viithiisys / School-Management-dashboard

Download as
Browse Code ยป

Commit 0ce7cb4582e0d2c5580797936d35ffec944e95f7

Authored by Amber Dev
1 parent 0a52566000
Exists in master and in 2 other branches amber-development, ui-design

added events

Showing 1 changed file with 0 additions and 17 deletions   Show diff stats
src/pages/Dashboard/dashboard.vue
Diff comments   View file @0ce7cb4
1 <template> 1 <template>
2 <v-app id="pages-dasboard"> 2 <v-app id="pages-dasboard">
3 <!-- ****** VIEW PROFIL NOTICE BOARD ****** --> 3 <!-- ****** VIEW PROFIL NOTICE BOARD ****** -->
4 <!-- <v-dialog v-model="dialogNotice" max-width="940px" scrollable> 4 <!-- <v-dialog v-model="dialogNotice" max-width="940px" scrollable>
5 <v-card> 5 <v-card>
6 <v-toolbar color="grey lighten-2" flat> 6 <v-toolbar color="grey lighten-2" flat>
7 <v-spacer></v-spacer> 7 <v-spacer></v-spacer>
8 <v-toolbar-title> 8 <v-toolbar-title>
9 <h3>Notice Board</h3> 9 <h3>Notice Board</h3>
10 </v-toolbar-title> 10 </v-toolbar-title>
11 <v-spacer></v-spacer> 11 <v-spacer></v-spacer>
12 <v-icon @click="closeNotice">close</v-icon> 12 <v-icon @click="closeNotice">close</v-icon>
13 </v-toolbar> 13 </v-toolbar>
14 <v-card-text> 14 <v-card-text>
15 <v-layout> 15 <v-layout>
16 <v-flex align-center justify-center layout text-xs-center class="mt-2"> 16 <v-flex align-center justify-center layout text-xs-center class="mt-2">
17 <img src="/static/icon/user.png" width="70px" v-if="!notice.eventImageUrl" /> 17 <img src="/static/icon/user.png" width="70px" v-if="!notice.eventImageUrl" />
18 <img :src="notice.eventImageUrl" width="280px" v-else-if="notice.eventImageUrl" /> 18 <img :src="notice.eventImageUrl" width="280px" v-else-if="notice.eventImageUrl" />
19 </v-flex> 19 </v-flex>
20 </v-layout> 20 </v-layout>
21 <v-container grid-list-md> 21 <v-container grid-list-md>
22 <v-layout wrap> 22 <v-layout wrap>
23 <v-flex> 23 <v-flex>
24 <v-layout> 24 <v-layout>
25 <v-flex xs5 sm6> 25 <v-flex xs5 sm6>
26 <h5 class="right my-1"> 26 <h5 class="right my-1">
27 <b>Title:</b> 27 <b>Title:</b>
28 </h5> 28 </h5>
29 </v-flex> 29 </v-flex>
30 <v-flex sm6 xs8> 30 <v-flex sm6 xs8>
31 <h5 class="my-1">{{ notice.title }}</h5> 31 <h5 class="my-1">{{ notice.title }}</h5>
32 </v-flex> 32 </v-flex>
33 </v-layout> 33 </v-layout>
34 <v-layout> 34 <v-layout>
35 <v-flex xs5 sm6> 35 <v-flex xs5 sm6>
36 <h5 class="right my-1"> 36 <h5 class="right my-1">
37 <b>Description:</b> 37 <b>Description:</b>
38 </h5> 38 </h5>
39 </v-flex> 39 </v-flex>
40 <v-flex sm6 xs8> 40 <v-flex sm6 xs8>
41 <h5 class="my-1">{{ notice.description }}</h5> 41 <h5 class="my-1">{{ notice.description }}</h5>
42 </v-flex> 42 </v-flex>
43 </v-layout> 43 </v-layout>
44 </v-flex> 44 </v-flex>
45 </v-layout> 45 </v-layout>
46 </v-container> 46 </v-container>
47 </v-card-text> 47 </v-card-text>
48 </v-card> 48 </v-card>
49 </v-dialog>--> 49 </v-dialog>-->
50 <!-- <v-container fluid grid-list-xl> --> 50 <!-- <v-container fluid grid-list-xl> -->
51 51
52 <!-- LOADER --> 52 <!-- LOADER -->
53 <div class="loader" v-if="showLoader"> 53 <div class="loader" v-if="showLoader">
54 <v-progress-circular indeterminate color="white"></v-progress-circular> 54 <v-progress-circular indeterminate color="white"></v-progress-circular>
55 </div> 55 </div>
56 56
57 <!-- SNACKBAR --> 57 <!-- SNACKBAR -->
58 <v-snackbar 58 <v-snackbar
59 :timeout="timeout" 59 :timeout="timeout"
60 :top="y === 'top'" 60 :top="y === 'top'"
61 :right="x === 'right'" 61 :right="x === 'right'"
62 :vertical="mode === 'vertical'" 62 :vertical="mode === 'vertical'"
63 v-model="snackbar" 63 v-model="snackbar"
64 :color="snackbarColor" 64 :color="snackbarColor"
65 > 65 >
66 {{ text }} 66 {{ text }}
67 <v-spacer></v-spacer> 67 <v-spacer></v-spacer>
68 <v-btn flat text @click="snackbar = false">X</v-btn> 68 <v-btn flat text @click="snackbar = false">X</v-btn>
69 </v-snackbar> 69 </v-snackbar>
70 70
71 <v-layout wrap> 71 <v-layout wrap>
72 <v-flex xs12> 72 <v-flex xs12>
73 <v-layout wrap row> 73 <v-layout wrap row>
74 <!-- ***** Total Students ***** --> 74 <!-- ***** Total Students ***** -->
75 <v-flex xs12 sm12 md9> 75 <v-flex xs12 sm12 md9>
76 <v-container fluid grid-list-xl> 76 <v-container fluid grid-list-xl>
77 <v-flex xs12 sm12 md12> 77 <v-flex xs12 sm12 md12>
78 <v-layout wrap class> 78 <v-layout wrap class>
79 <v-flex xs12 sm12 md3> 79 <v-flex xs12 sm12 md3>
80 <router-link :to="{ name:'Students' }"> 80 <router-link :to="{ name:'Students' }">
81 <v-card class="card pink-bgcolor"> 81 <v-card class="card pink-bgcolor">
82 <v-card-title primary-title class="titleCard white--text py-3">Students</v-card-title> 82 <v-card-title primary-title class="titleCard white--text py-3">Students</v-card-title>
83 <img src="/static/icon/student.png" class="ml-2" width="40" alt="icons" /> 83 <img src="/static/icon/student.png" class="ml-2" width="40" alt="icons" />
84 <v-card-title class="headline py-1 white--text">{{ students.length }}</v-card-title> 84 <v-card-title class="headline py-1 white--text">{{ students.length }}</v-card-title>
85 </v-card> 85 </v-card>
86 </router-link> 86 </router-link>
87 </v-flex> 87 </v-flex>
88 <!-- ***** Total Teachers***** --> 88 <!-- ***** Total Teachers***** -->
89 <v-flex xs12 sm12 md3> 89 <v-flex xs12 sm12 md3>
90 <router-link :to="{ name:'Teachers' }"> 90 <router-link :to="{ name:'Teachers' }">
91 <v-card flat class="card elevation-2 firozi-bgcolor"> 91 <v-card flat class="card elevation-2 firozi-bgcolor">
92 <v-card-title primary-title class="titleCard white--text py-3">Teachers</v-card-title> 92 <v-card-title primary-title class="titleCard white--text py-3">Teachers</v-card-title>
93 <img src="/static/icon/teacher.png" class="ml-2" width="40" alt="icons" /> 93 <img src="/static/icon/teacher.png" class="ml-2" width="40" alt="icons" />
94 94
95 <v-card-title class="headline py-1 white--text">{{ teachers.length }}</v-card-title> 95 <v-card-title class="headline py-1 white--text">{{ teachers.length }}</v-card-title>
96 </v-card> 96 </v-card>
97 </router-link> 97 </router-link>
98 </v-flex> 98 </v-flex>
99 <!-- ***** Total Parents ***** --> 99 <!-- ***** Total Parents ***** -->
100 <v-flex xs12 sm12 md3> 100 <v-flex xs12 sm12 md3>
101 <router-link :to="{ name:'Parents' }"> 101 <router-link :to="{ name:'Parents' }">
102 <v-card flat class="card yellow darken-3"> 102 <v-card flat class="card yellow darken-3">
103 <v-card-title primary-title class="titleCard white--text py-3">Parents</v-card-title> 103 <v-card-title primary-title class="titleCard white--text py-3">Parents</v-card-title>
104 <img src="/static/icon/parents.png" class="ml-3" width="40px" alt="icons" /> 104 <img src="/static/icon/parents.png" class="ml-3" width="40px" alt="icons" />
105 <v-card-title class="headline py-1 white--text">{{ parents.length }}</v-card-title> 105 <v-card-title class="headline py-1 white--text">{{ parents.length }}</v-card-title>
106 </v-card> 106 </v-card>
107 </router-link> 107 </router-link>
108 </v-flex> 108 </v-flex>
109 <!-- ***** Total Class***** --> 109 <!-- ***** Total Class***** -->
110 <v-flex xs12 sm12 md3> 110 <v-flex xs12 sm12 md3>
111 <router-link :to="{ name:'Class' }"> 111 <router-link :to="{ name:'Class' }">
112 <v-card flat class="card darkBlue-bgcolor"> 112 <v-card flat class="card darkBlue-bgcolor">
113 <v-card-title primary-title class="titleCard white--text py-3">Class</v-card-title> 113 <v-card-title primary-title class="titleCard white--text py-3">Class</v-card-title>
114 <img src="/static/icon/class.png" width="40" alt="icons" class="ml-2" /> 114 <img src="/static/icon/class.png" width="40" alt="icons" class="ml-2" />
115 <v-card-title class="headline py-1 white--text">{{ classes.length }}</v-card-title> 115 <v-card-title class="headline py-1 white--text">{{ classes.length }}</v-card-title>
116 </v-card> 116 </v-card>
117 </router-link> 117 </router-link>
118 </v-flex> 118 </v-flex>
119 </v-layout> 119 </v-layout>
120 </v-flex> 120 </v-flex>
121 <p 121 <p
122 v-if="studentsData.length === 0 && role == 'PARENT'" 122 v-if="studentsData.length === 0 && role == 'PARENT'"
123 class="text-center title grey lighten-4 error--text" 123 class="text-center title grey lighten-4 error--text"
124 >You have no student registered with scholl</p> 124 >You have no student registered with scholl</p>
125 <v-layout v-if="role != 'PARENT'"> 125 <v-layout v-if="role != 'PARENT'">
126 <v-flex xs12> 126 <v-flex xs12>
127 <v-card class="card mt-2 account-Card"> 127 <v-card class="card mt-2 account-Card">
128 <h4> 128 <h4>
129 <b>Account</b> 129 <b>Account</b>
130 </h4> 130 </h4>
131 <v-layout wrap> 131 <v-layout wrap>
132 <v-flex xs12 sm12 md3> 132 <v-flex xs12 sm12 md3>
133 <v-list two-line> 133 <v-list two-line>
134 <template> 134 <template>
135 <v-list-tile> 135 <v-list-tile>
136 <v-list-tile-avatar> 136 <v-list-tile-avatar>
137 <v-icon class="account-circle darkBlue-color">panorama_fish_eye</v-icon> 137 <v-icon class="account-circle darkBlue-color">panorama_fish_eye</v-icon>
138 </v-list-tile-avatar> 138 </v-list-tile-avatar>
139 <v-list-tile-content> 139 <v-list-tile-content>
140 <v-list-tile-title class="mt-2"> 140 <v-list-tile-title class="mt-2">
141 <p class="subheading font-color">Fees</p> 141 <p class="subheading font-color">Fees</p>
142 </v-list-tile-title> 142 </v-list-tile-title>
143 <v-list-tile-title>Rs. {{ feeData.totalFees }}</v-list-tile-title> 143 <v-list-tile-title>Rs. {{ feeData.totalFees }}</v-list-tile-title>
144 </v-list-tile-content> 144 </v-list-tile-content>
145 </v-list-tile> 145 </v-list-tile>
146 <v-list-tile> 146 <v-list-tile>
147 <v-list-tile-avatar> 147 <v-list-tile-avatar>
148 <v-icon class="account-circle yellowDark-color">panorama_fish_eye</v-icon> 148 <v-icon class="account-circle yellowDark-color">panorama_fish_eye</v-icon>
149 </v-list-tile-avatar> 149 </v-list-tile-avatar>
150 <v-list-tile-content> 150 <v-list-tile-content>
151 <v-list-tile-title class="mt-2"> 151 <v-list-tile-title class="mt-2">
152 <p class="subheading font-color">Collection</p> 152 <p class="subheading font-color">Collection</p>
153 </v-list-tile-title> 153 </v-list-tile-title>
154 <v-list-tile-title>Rs. {{ feeData.totalCollection }}</v-list-tile-title> 154 <v-list-tile-title>Rs. {{ feeData.totalCollection }}</v-list-tile-title>
155 </v-list-tile-content> 155 </v-list-tile-content>
156 </v-list-tile> 156 </v-list-tile>
157 <v-list-tile> 157 <v-list-tile>
158 <v-list-tile-avatar> 158 <v-list-tile-avatar>
159 <v-icon class="account-circle pink-color">panorama_fish_eye</v-icon> 159 <v-icon class="account-circle pink-color">panorama_fish_eye</v-icon>
160 </v-list-tile-avatar> 160 </v-list-tile-avatar>
161 <v-list-tile-content> 161 <v-list-tile-content>
162 <v-list-tile-title class="mt-2"> 162 <v-list-tile-title class="mt-2">
163 <p class="subheading font-color">Expences</p> 163 <p class="subheading font-color">Expences</p>
164 </v-list-tile-title> 164 </v-list-tile-title>
165 <v-list-tile-title>Rs. {{ expenseData.sum }}</v-list-tile-title> 165 <v-list-tile-title>Rs. {{ expenseData.sum }}</v-list-tile-title>
166 </v-list-tile-content> 166 </v-list-tile-content>
167 </v-list-tile> 167 </v-list-tile>
168 </template> 168 </template>
169 </v-list> 169 </v-list>
170 </v-flex> 170 </v-flex>
171 <v-flex xs12 sm12 md9 lg9> 171 <v-flex xs12 sm12 md9 lg9>
172 <div id="chart"> 172 <div id="chart">
173 <div v-if="this.series"> 173 <div v-if="this.series">
174 <apexchart 174 <apexchart
175 type="bar" 175 type="bar"
176 height="250" 176 height="250"
177 style="max-width: 800px !important" 177 style="max-width: 800px !important"
178 :options="chartOptions" 178 :options="chartOptions"
179 :series="series" 179 :series="series"
180 v-show="true" 180 v-show="true"
181 ></apexchart> 181 ></apexchart>
182 </div> 182 </div>
183 </div> 183 </div>
184 </v-flex> 184 </v-flex>
185 </v-layout> 185 </v-layout>
186 </v-card> 186 </v-card>
187 </v-flex> 187 </v-flex>
188 </v-layout> 188 </v-layout>
189 <v-card class="mt-2 card" v-if="role != 'PARENT'"> 189 <v-card class="mt-2 card" v-if="role != 'PARENT'">
190 <!-- <full-calendar 190 <!-- <full-calendar
191 ref="calendar" 191 ref="calendar"
192 defaultView="month" 192 defaultView="month"
193 droppable="false" 193 droppable="false"
194 :events="events" 194 :events="events"
195 :config="config" 195 :config="config"
196 ></full-calendar>--> 196 ></full-calendar>-->
197 <h4 class="pa-3"> 197 <h4 class="pa-3">
198 <b>Notice</b> 198 <b>Notice</b>
199 </h4> 199 </h4>
200 200
201 <v-data-table 201 <v-data-table
202 :items="noticeData" 202 :items="noticeData"
203 class="elevation-0" 203 class="elevation-0"
204 flat 204 flat
205 hide-actions 205 hide-actions
206 hide-headers 206 hide-headers
207 style="border-spacing: 0 !important;" 207 style="border-spacing: 0 !important;"
208 > 208 >
209 <template 209 <template
210 slot="items" 210 slot="items"
211 slot-scope="props" 211 slot-scope="props"
212 v-if="props.index < 5" 212 v-if="props.index < 5"
213 style="border-spacing: 0 !important;" 213 style="border-spacing: 0 !important;"
214 > 214 >
215 <tr class="td-notice"> 215 <tr class="td-notice">
216 <td class="grey--text" style="width:18px">{{ props.index + 1}}</td> 216 <td class="grey--text" style="width:18px">{{ props.index + 1}}</td>
217 <td> 217 <td>
218 <span class="grey--text caption">{{ date(props.item.created) }}</span> 218 <span class="grey--text caption">{{ date(props.item.created) }}</span>
219 <br /> 219 <br />
220 <span class="body-2">{{ props.item.title}}</span> 220 <span class="body-2">{{ props.item.title}}</span>
221 </td> 221 </td>
222 <td class="noticeDecritpion grey--text mt-2">{{ props.item.description}}</td> 222 <td class="noticeDecritpion grey--text mt-2">{{ props.item.description}}</td>
223 223
224 <td class="text-xs-center"> 224 <td class="text-xs-center">
225 <span> 225 <span>
226 <v-tooltip top> 226 <v-tooltip top>
227 <img 227 <img
228 slot="activator" 228 slot="activator"
229 style="cursor:pointer; width:25px; height:25px; " 229 style="cursor:pointer; width:25px; height:25px; "
230 @click="profile" 230 @click="profile"
231 src="/static/icon/view.png" 231 src="/static/icon/view.png"
232 /> 232 />
233 <span>View</span> 233 <span>View</span>
234 </v-tooltip> 234 </v-tooltip>
235 </span> 235 </span>
236 </td> 236 </td>
237 </tr> 237 </tr>
238 </template> 238 </template>
239 </v-data-table> 239 </v-data-table>
240 </v-card> 240 </v-card>
241 <!-- COURSES --> 241 <!-- COURSES -->
242 <v-layout v-if="role == 'PARENT'"> 242 <v-layout v-if="role == 'PARENT'">
243 <v-flex xs12> 243 <v-flex xs12>
244 <v-card class="card mt-2 account-Card"> 244 <v-card class="card mt-2 account-Card">
245 <h4> 245 <h4>
246 <b>My Courses</b> 246 <b>My Courses</b>
247 </h4> 247 </h4>
248 <v-layout wrap> 248 <v-layout wrap>
249 <v-flex xs12 sm12> 249 <v-flex xs12 sm12>
250 <v-list two-line> 250 <v-list two-line>
251 <template> 251 <template>
252 <v-list-tile v-for="(course,i) in courseData" :key="i"> 252 <v-list-tile v-for="(course,i) in courseData" :key="i">
253 <v-list-tile-avatar> 253 <v-list-tile-avatar>
254 <v-icon 254 <v-icon
255 class="account-circle darkBlue-color" 255 class="account-circle darkBlue-color"
256 style="cursor: pointer;" 256 style="cursor: pointer;"
257 >panorama_fish_eye</v-icon> 257 >panorama_fish_eye</v-icon>
258 </v-list-tile-avatar> 258 </v-list-tile-avatar>
259 <v-list-tile-content> 259 <v-list-tile-content>
260 <v-list-tile-title 260 <v-list-tile-title
261 style="cursor: pointer;" 261 style="cursor: pointer;"
262 @click="routeToCourseDetails(course._id)" 262 @click="routeToCourseDetails(course._id)"
263 >{{ course.courseName }}</v-list-tile-title> 263 >{{ course.courseName }}</v-list-tile-title>
264 </v-list-tile-content> 264 </v-list-tile-content>
265 </v-list-tile> 265 </v-list-tile>
266 </template> 266 </template>
267 </v-list> 267 </v-list>
268 </v-flex> 268 </v-flex>
269 </v-layout> 269 </v-layout>
270 </v-card> 270 </v-card>
271 </v-flex> 271 </v-flex>
272 </v-layout> 272 </v-layout>
273 <v-layout v-if="role == 'PARENT'"> 273 <v-layout v-if="role == 'PARENT'">
274 <v-flex xs6> 274 <v-flex xs6>
275 <v-card class="mt-2 card"> 275 <v-card class="mt-2 card">
276 <h4 class="pa-3"> 276 <h4 class="pa-3">
277 <b>Latest Annoucements</b> 277 <b>Latest Annoucements</b>
278 </h4> 278 </h4>
279 279
280 <v-data-table 280 <v-data-table
281 :items="annoucementData" 281 :items="annoucementData"
282 class="elevation-0" 282 class="elevation-0"
283 flat 283 flat
284 hide-actions 284 hide-actions
285 hide-headers 285 hide-headers
286 style="border-spacing: 0 !important;" 286 style="border-spacing: 0 !important;"
287 > 287 >
288 <template 288 <template
289 slot="items" 289 slot="items"
290 slot-scope="props" 290 slot-scope="props"
291 v-if="props.index < 5" 291 v-if="props.index < 5"
292 style="border-spacing: 0 !important;" 292 style="border-spacing: 0 !important;"
293 > 293 >
294 <tr class="td-notice"> 294 <tr class="td-notice">
295 <td class="grey--text" style="width:18px">{{ props.index + 1}}</td> 295 <td class="grey--text" style="width:18px">{{ props.index + 1}}</td>
296 <td> 296 <td>
297 <span class="grey--text caption">{{ date(props.item.created) }}</span> 297 <span class="grey--text caption">{{ date(props.item.created) }}</span>
298 <br /> 298 <br />
299 <span class="body-2">{{ props.item.discussionType}}</span> 299 <span class="body-2">{{ props.item.discussionType}}</span>
300 </td> 300 </td>
301 <td class="text-xs-center"> 301 <td class="text-xs-center">
302 <span> 302 <span>
303 <v-tooltip top> 303 <v-tooltip top>
304 <img 304 <img
305 slot="activator" 305 slot="activator"
306 style="cursor:pointer; width:25px; height:25px; " 306 style="cursor:pointer; width:25px; height:25px; "
307 src="/static/icon/view.png" 307 src="/static/icon/view.png"
308 /> 308 />
309 <span>View</span> 309 <span>View</span>
310 </v-tooltip> 310 </v-tooltip>
311 </span> 311 </span>
312 </td> 312 </td>
313 </tr> 313 </tr>
314 </template> 314 </template>
315 </v-data-table> 315 </v-data-table>
316 </v-card> 316 </v-card>
317 </v-flex> 317 </v-flex>
318 <v-flex xs6> 318 <v-flex xs6>
319 <v-card class="mt-2 card"> 319 <v-card class="mt-2 card">
320 <h4 class="pa-3"> 320 <h4 class="pa-3">
321 <b>Online User</b> 321 <b>Online User</b>
322 </h4> 322 </h4>
323 323
324 <v-data-table 324 <v-data-table
325 :items="onlineUser" 325 :items="onlineUser"
326 class="elevation-0" 326 class="elevation-0"
327 flat 327 flat
328 hide-actions 328 hide-actions
329 hide-headers 329 hide-headers
330 style="border-spacing: 0 !important;" 330 style="border-spacing: 0 !important;"
331 > 331 >
332 <template 332 <template
333 slot="items" 333 slot="items"
334 slot-scope="props" 334 slot-scope="props"
335 v-if="props.index < 5" 335 v-if="props.index < 5"
336 style="border-spacing: 0 !important;" 336 style="border-spacing: 0 !important;"
337 > 337 >
338 <tr class="td-notice"> 338 <tr class="td-notice">
339 <td class="grey--text" style="width:18px">{{ props.index + 1}}</td> 339 <td class="grey--text" style="width:18px">{{ props.index + 1}}</td>
340 <td> 340 <td>
341 <span class="body-2">{{ props.item.user }}</span> 341 <span class="body-2">{{ props.item.user }}</span>
342 </td> 342 </td>
343 <td class="text-xs-center"> 343 <td class="text-xs-center">
344 <span> 344 <span>
345 <v-tooltip top> 345 <v-tooltip top>
346 <img 346 <img
347 slot="activator" 347 slot="activator"
348 style="cursor:pointer; width:25px; height:25px; " 348 style="cursor:pointer; width:25px; height:25px; "
349 src="/static/icon/view.png" 349 src="/static/icon/view.png"
350 /> 350 />
351 <span>View</span> 351 <span>View</span>
352 </v-tooltip> 352 </v-tooltip>
353 </span> 353 </span>
354 </td> 354 </td>
355 </tr> 355 </tr>
356 </template> 356 </template>
357 </v-data-table> 357 </v-data-table>
358 </v-card> 358 </v-card>
359 </v-flex> 359 </v-flex>
360 </v-layout> 360 </v-layout>
361 </v-container> 361 </v-container>
362 </v-flex> 362 </v-flex>
363 <v-flex xs12 sm12 md3> 363 <v-flex xs12 sm12 md3>
364 <v-card height="100%" class="elevation-0 mt-3 profileDasboard"> 364 <v-card height="100%" class="elevation-0 mt-3 profileDasboard">
365 <v-card-text> 365 <v-card-text>
366 <h4 class="text-xs-center py-3"> 366 <h4 class="text-xs-center py-3">
367 <b>Profile</b> 367 <b>Profile</b>
368 </h4> 368 </h4>
369 <v-flex xs12 class="py-3"> 369 <v-flex xs12 class="py-3">
370 <v-layout wrap> 370 <v-layout wrap>
371 <v-flex xs12 sm12 md4> 371 <v-flex xs12 sm12 md4>
372 <img src="/static/icon/user.png" v-if="!userData.schoolLogoUrl" width="80" /> 372 <img src="/static/icon/user.png" v-if="!userData.schoolLogoUrl" width="80" />
373 <img 373 <img
374 :src="userData.schoolLogoUrl" 374 :src="userData.schoolLogoUrl"
375 v-else-if="userData.schoolLogoUrl" 375 v-else-if="userData.schoolLogoUrl"
376 width="80" 376 width="80"
377 /> 377 />
378 </v-flex> 378 </v-flex>
379 <v-flex xs12 sm12 md6> 379 <v-flex xs12 sm12 md6>
380 <p class="mb-0 body-1"> 380 <p class="mb-0 body-1">
381 <i>{{ userData.name }}</i> 381 <i>{{ userData.name }}</i>
382 </p> 382 </p>
383 <p class="mb-0 caption grey--text">{{ userData.email }}</p> 383 <p class="mb-0 caption grey--text">{{ userData.email }}</p>
384 <p class="mb-0 caption grey--text">{{ userData.mobile }}</p> 384 <p class="mb-0 caption grey--text">{{ userData.mobile }}</p>
385 <address class="caption grey--text mb-3">{{ userData.address }}</address> 385 <address class="caption grey--text mb-3">{{ userData.address }}</address>
386 </v-flex> 386 </v-flex>
387 </v-layout> 387 </v-layout>
388 </v-flex> 388 </v-flex>
389 <hr /> 389 <hr />
390 <div class="text-xs-center py-3 subheading font-weight-bold">Calender</div> 390 <div class="text-xs-center py-3 subheading font-weight-bold">Calender</div>
391 <vue-event-calendar :events="activityEvents"></vue-event-calendar> 391 <vue-event-calendar :events="activityEvents"></vue-event-calendar>
392 <!-- LATEST ACTIVITY --> 392 <!-- LATEST ACTIVITY -->
393 <v-card class="my-3 elevation-0"> 393 <v-card class="my-3 elevation-0">
394 <v-card-text> 394 <v-card-text>
395 <v-card-title class="justify-center subheading font-weight-bold">Latest Activity</v-card-title> 395 <v-card-title class="justify-center subheading font-weight-bold">Latest Activity</v-card-title>
396 <div v-for="(activity,index) in activityList" :key="index" class="mt-2"> 396 <div v-for="(activity,index) in activityList" :key="index" class="mt-2">
397 <span 397 <span
398 :style="{ 'background-color': colorsArray[index%colorsArray.length] }" 398 :style="{ 'background-color': colorsArray[index%colorsArray.length] }"
399 style="height: 12px;width: 12px;border-radius: 50%;display: inline-block;vertical-align: top;" 399 style="height: 12px;width: 12px;border-radius: 50%;display: inline-block;vertical-align: top;"
400 ></span> 400 ></span>
401 <div style="display: inline-block;" class="ml-2"> 401 <div style="display: inline-block;" class="ml-2">
402 <div 402 <div
403 class="grey--text lighten-1 caption" 403 class="grey--text lighten-1 caption"
404 >{{moment(activity.meetingEvent.dateOfEvent).format("DD MMMM, YYYY")}}</div> 404 >{{moment(activity.meetingEvent.dateOfEvent).format("DD MMMM, YYYY")}}</div>
405 <div class="body-2">{{activity.meetingEvent.title}}</div> 405 <div class="body-2">{{activity.meetingEvent.title}}</div>
406 </div> 406 </div>
407 </div> 407 </div>
408 </v-card-text> 408 </v-card-text>
409 </v-card> 409 </v-card>
410 </v-card-text> 410 </v-card-text>
411 </v-card> 411 </v-card>
412 </v-flex> 412 </v-flex>
413 </v-layout> 413 </v-layout>
414 </v-flex> 414 </v-flex>
415 </v-layout> 415 </v-layout>
416 <v-dialog v-model="dialog" max-width="500"> 416 <v-dialog v-model="dialog" max-width="500">
417 <v-card color="grey lighten-4" flat> 417 <v-card color="grey lighten-4" flat>
418 <v-toolbar dark color="fixcolors"> 418 <v-toolbar dark color="fixcolors">
419 <v-spacer></v-spacer> 419 <v-spacer></v-spacer>
420 <v-btn icon @click="dialog= false"> 420 <v-btn icon @click="dialog= false">
421 <v-icon>close</v-icon> 421 <v-icon>close</v-icon>
422 </v-btn> 422 </v-btn>
423 </v-toolbar> 423 </v-toolbar>
424 <v-flex class="py-4"> 424 <v-flex class="py-4">
425 <v-list-tile> 425 <v-list-tile>
426 <v-list-tile-action> 426 <v-list-tile-action>
427 <v-icon>edit</v-icon> 427 <v-icon>edit</v-icon>
428 </v-list-tile-action> 428 </v-list-tile-action>
429 <v-list-tile-content> 429 <v-list-tile-content>
430 <v-list-tile-title>{{ selected.title }}</v-list-tile-title> 430 <v-list-tile-title>{{ selected.title }}</v-list-tile-title>
431 </v-list-tile-content> 431 </v-list-tile-content>
432 </v-list-tile> 432 </v-list-tile>
433 <v-list-tile> 433 <v-list-tile>
434 <v-list-tile-action> 434 <v-list-tile-action>
435 <v-icon>access_time</v-icon> 435 <v-icon>access_time</v-icon>
436 </v-list-tile-action> 436 </v-list-tile-action>
437 <v-list-tile-content> 437 <v-list-tile-content>
438 <v-list-tile-title>{{ date(selected.start)}}</v-list-tile-title> 438 <v-list-tile-title>{{ date(selected.start)}}</v-list-tile-title>
439 </v-list-tile-content> 439 </v-list-tile-content>
440 </v-list-tile> 440 </v-list-tile>
441 </v-flex> 441 </v-flex>
442 </v-card> 442 </v-card>
443 </v-dialog> 443 </v-dialog>
444 </v-app> 444 </v-app>
445 </template> 445 </template>
446 446
447 <script> 447 <script>
448 import http from "@/Services/http.js"; 448 import http from "@/Services/http.js";
449 import moment from "moment"; 449 import moment from "moment";
450 import AllApiCalls from "@/Services/AllApiCalls.js"; 450 import AllApiCalls from "@/Services/AllApiCalls.js";
451 // import { FunctionalCalendar } from "vue-functional-calendar"; 451 // import { FunctionalCalendar } from "vue-functional-calendar";
452 452
453 export default { 453 export default {
454 components: { 454 components: {
455 // FunctionalCalendar 455 // FunctionalCalendar
456 }, 456 },
457 mixins: [AllApiCalls], 457 mixins: [AllApiCalls],
458 data() { 458 data() {
459 return { 459 return {
460 // data: { 460 // data: {
461 // clieckedToday: false 461 // clieckedToday: false
462 // }, 462 // },
463 // markedDates: ["16/4/2019", "18/4/2019", "20/4/2019", "21/4/2019"], 463 // markedDates: ["16/4/2019", "18/4/2019", "20/4/2019", "21/4/2019"],
464 // calendarData: {}, 464 // calendarData: {},
465 // calendar: {}, 465 // calendar: {},
466 466
467 // CALENDER 467 // CALENDER
468 moment: moment, 468 moment: moment,
469 activityEvents: [], 469 activityEvents: [],
470 onlineUser: [ 470 onlineUser: [
471 { 471 {
472 user: "Student Demo" 472 user: "Student Demo"
473 }, 473 },
474 { 474 {
475 user: "Teacher Demo" 475 user: "Teacher Demo"
476 }, 476 },
477 { 477 {
478 user: "Priyansh Gupta" 478 user: "Priyansh Gupta"
479 }, 479 },
480 { 480 {
481 user: "Gaurav Aggarwal" 481 user: "Gaurav Aggarwal"
482 }, 482 },
483 { 483 {
484 user: "Approve Arorra" 484 user: "Approve Arorra"
485 } 485 }
486 ], 486 ],
487 showLoader: false, 487 showLoader: false,
488 calendarData: {}, 488 calendarData: {},
489 dialog: false, 489 dialog: false,
490 dialogNotice: false, 490 dialogNotice: false,
491 HolidaysList: [], 491 HolidaysList: [],
492 EventsList: [], 492 EventsList: [],
493 events: [], 493 events: [],
494 config: { 494 config: {
495 eventClick: event => { 495 eventClick: event => {
496 this.selected = event; 496 this.selected = event;
497 this.dialog = true; 497 this.dialog = true;
498 } 498 }
499 }, 499 },
500 selected: {}, 500 selected: {},
501 barGraph: [], 501 barGraph: [],
502 // notice: {}, 502 // notice: {},
503 userData: {}, 503 userData: {},
504 dated: new Date(2018, 0, 9), 504 dated: new Date(2018, 0, 9),
505 userList: [], 505 userList: [],
506 sectionList: [], 506 sectionList: [],
507 students: "", 507 students: "",
508 parents: "", 508 parents: "",
509 teachers: "", 509 teachers: "",
510 classes: "", 510 classes: "",
511 noticeData: [], 511 noticeData: [],
512 expenseData: [], 512 expenseData: [],
513 feeData: [], 513 feeData: [],
514 collectionData: [], 514 collectionData: [],
515 courseData: [], 515 courseData: [],
516 studentsData: [], 516 studentsData: [],
517 annoucementData: [], 517 annoucementData: [],
518 role: "", 518 role: "",
519 attrs: [ 519 attrs: [
520 { 520 {
521 key: "today", 521 key: "today",
522 highlight: true, 522 highlight: true,
523 dates: new Date() 523 dates: new Date()
524 } 524 }
525 ], 525 ],
526 drawer: true, 526 drawer: true,
527 items: [ 527 items: [
528 { title: "Home", icon: "dashboard" }, 528 { title: "Home", icon: "dashboard" },
529 { title: "About", icon: "question_answer" } 529 { title: "About", icon: "question_answer" }
530 ], 530 ],
531 right: null, 531 right: null,
532 532
533 series: [ 533 series: [
534 { 534 {
535 name: "Total", 535 name: "Total",
536 data: [] 536 data: []
537 } 537 }
538 ], 538 ],
539 chartOptions: { 539 chartOptions: {
540 chart: { 540 chart: {
541 type: "bar", 541 type: "bar",
542 height: 150, 542 height: 150,
543 stacked: true 543 stacked: true
544 // animations: { 544 // animations: {
545 // enabled: true, 545 // enabled: true,
546 // easing: "easeinout", 546 // easing: "easeinout",
547 // speed: 1200, 547 // speed: 1200,
548 // animateGradually: { 548 // animateGradually: {
549 // enabled: true, 549 // enabled: true,
550 // delay: 450 550 // delay: 450
551 // }, 551 // },
552 // dynamicAnimation: { 552 // dynamicAnimation: {
553 // enabled: true, 553 // enabled: true,
554 // speed: 450 554 // speed: 450
555 // } 555 // }
556 // } 556 // }
557 }, 557 },
558 plotOptions: { 558 plotOptions: {
559 bar: { 559 bar: {
560 horizontal: false, 560 horizontal: false,
561 columnWidth: "25%", 561 columnWidth: "25%",
562 // endingShape: "rounded", 562 // endingShape: "rounded",
563 distributed: true 563 distributed: true
564 } 564 }
565 }, 565 },
566 responsive: [ 566 responsive: [
567 { 567 {
568 breakpoint: 480, 568 breakpoint: 480,
569 options: { 569 options: {
570 legend: { 570 legend: {
571 position: "bottom", 571 position: "bottom",
572 offsetX: -10, 572 offsetX: -10,
573 offsetY: 0 573 offsetY: 0
574 } 574 }
575 } 575 }
576 } 576 }
577 ], 577 ],
578 legend: { 578 legend: {
579 show: false 579 show: false
580 }, 580 },
581 colors: ["#7852cc", "#f9a825", "#ff8a89"], 581 colors: ["#7852cc", "#f9a825", "#ff8a89"],
582 dataLabels: { 582 dataLabels: {
583 enabled: false 583 enabled: false
584 }, 584 },
585 stroke: { 585 stroke: {
586 show: true, 586 show: true,
587 width: 2, 587 width: 2,
588 colors: ["transparent"] 588 colors: ["transparent"]
589 }, 589 },
590 xaxis: { 590 xaxis: {
591 categories: ["Fee", "Collections", "Expences"] 591 categories: ["Fee", "Collections", "Expences"]
592 }, 592 },
593 yaxis: { 593 yaxis: {
594 title: { 594 title: {
595 text: "" 595 text: ""
596 } 596 }
597 }, 597 },
598 fill: { 598 fill: {
599 opacity: 1 599 opacity: 1
600 }, 600 },
601 tooltip: { 601 tooltip: {
602 y: { 602 y: {
603 formatter: function(val, opts) { 603 formatter: function(val, opts) {
604 // console.log("opts",opts.w.config.xaxis.categories) 604 // console.log("opts",opts.w.config.xaxis.categories)
605 return "" + val + " "; 605 return "" + val + " ";
606 } 606 }
607 } 607 }
608 } 608 }
609 }, 609 },
610 610
611 // LATEST ACTIVITY 611 // LATEST ACTIVITY
612 colorsArray: ["#ff8a89", "#71d9ea", "#7852cc", "#F9A825"], 612 colorsArray: ["#ff8a89", "#71d9ea", "#7852cc", "#F9A825"],
613 activityList: [] 613 activityList: []
614 }; 614 };
615 }, 615 },
616 mounted() { 616 mounted() {
617 // = this.$store.state.schoolToken; 617 // = this.$store.state.schoolToken;
618 // console.log("this.$store.state.role", this.token); 618 // console.log("this.$store.state.role", this.token);
619 if (this.$store.state.role === "ADMIN") { 619 if (this.$store.state.role === "ADMIN") {
620 this.token = this.$store.state.token; 620 this.token = this.$store.state.token;
621 } else if (this.$store.state.schoolRole === "SUPERADMIN") { 621 } else if (this.$store.state.schoolRole === "SUPERADMIN") {
622 this.token = this.$store.state.schoolToken; 622 this.token = this.$store.state.schoolToken;
623 } else if (this.$store.state.role === "TEACHER") { 623 } else if (this.$store.state.role === "TEACHER") {
624 this.token = this.$store.state.token; 624 this.token = this.$store.state.token;
625 } else if (this.$store.state.role === "ACCOUNTANT") { 625 } else if (this.$store.state.role === "ACCOUNTANT") {
626 this.token = this.$store.state.token; 626 this.token = this.$store.state.token;
627 } else if (this.$store.state.role === "LIBRARIAN") { 627 } else if (this.$store.state.role === "LIBRARIAN") {
628 this.token = this.$store.state.token; 628 this.token = this.$store.state.token;
629 } else if (this.$store.state.role === "PARENT") { 629 } else if (this.$store.state.role === "PARENT") {
630 this.token = this.$store.state.token; 630 this.token = this.$store.state.token;
631 } 631 }
632 this.role = this.$store.state.role; 632 this.role = this.$store.state.role;
633 // console.log("role", this.$store.state.schoolRole,"tt",this.$store.state.schoolToken); 633 // console.log("role", this.$store.state.schoolRole,"tt",this.$store.state.schoolToken);
634 // this.getData(); 634 // this.getData();
635 this.getStudents(); 635 this.getStudents();
636 this.getTeachers(); 636 this.getTeachers();
637 this.getParents(); 637 this.getParents();
638 this.getClasses(); 638 this.getClasses();
639 this.getNoticeData(); 639 this.getNoticeData();
640 this.getUserData(); 640 this.getUserData();
641 this.getFeesAndCollectionsData(); 641 this.getFeesAndCollectionsData();
642 this.getExpensesData(); 642 this.getExpensesData();
643 this.getparentStudents(); 643 this.getparentStudents();
644 // this.getUsersList(); 644 // this.getUsersList();
645 }, 645 },
646 methods: { 646 methods: {
647 async routeToCourseDetails(courseId) { 647 async routeToCourseDetails(courseId) {
648 /* getParticularCourseDetail- To get courseDetail - defined in GetApis.js*/ 648 /* getParticularCourseDetail- To get courseDetail - defined in GetApis.js*/
649 let response = await this.getParticularCourseDetail(courseId); 649 let response = await this.getParticularCourseDetail(courseId);
650 650
651 /* If the response is null then dont route */ 651 /* If the response is null then dont route */
652 if (response.data.data.length > 0) { 652 if (response.data.data.length > 0) {
653 this.$router.push({ 653 this.$router.push({
654 name: "Course Details", 654 name: "Course Details",
655 query: { courseId: courseId } 655 query: { courseId: courseId }
656 }); 656 });
657 } else { 657 } else {
658 this.seeSnackbar("No Data Available", "warning"); 658 this.seeSnackbar("No Data Available", "warning");
659 } 659 }
660 }, 660 },
661 661
662 closeNotice() { 662 closeNotice() {
663 this.dialogNotice = false; 663 this.dialogNotice = false;
664 }, 664 },
665 profile() { 665 profile() {
666 // this.editedIndex = this.desserts.indexOf(item); 666 // this.editedIndex = this.desserts.indexOf(item);
667 // this.notice = Object.assign({}, item); 667 // this.notice = Object.assign({}, item);
668 // this.dialogNotice = true; 668 // this.dialogNotice = true;
669 this.$router.push({ name: "NoticeBoard" }); 669 this.$router.push({ name: "NoticeBoard" });
670 }, 670 },
671 date: function(date) { 671 date: function(date) {
672 return moment(date).format("MMMM DD, YYYY HH:mm"); 672 return moment(date).format("MMMM DD, YYYY HH:mm");
673 }, 673 },
674 activityDate(date) { 674 activityDate(date) {
675 return moment(date).format("MMMM DD, YYYY"); 675 return moment(date).format("MMMM DD, YYYY");
676 }, 676 },
677 refreshEvents() { 677 refreshEvents() {
678 this.$refs.calendar.$emit("refetch-events"); 678 this.$refs.calendar.$emit("refetch-events");
679 }, 679 },
680 removeEvent() { 680 removeEvent() {
681 this.$refs.calendar.$emit("remove-event", this.selected); 681 this.$refs.calendar.$emit("remove-event", this.selected);
682 this.selected = {}; 682 this.selected = {};
683 }, 683 },
684 eventSelected(event) { 684 eventSelected(event) {
685 this.selected = event; 685 this.selected = event;
686 console.log("this.selected", this.selected); 686 console.log("this.selected", this.selected);
687 }, 687 },
688 // eventDropStart: function(event) { 688 // eventDropStart: function(event) {
689 // event.editable = false; 689 // event.editable = false;
690 // }, 690 // },
691 eventCreated(...test) { 691 eventCreated(...test) {
692 console.log(test); 692 console.log(test);
693 }, 693 },
694 getStudents() { 694 getStudents() {
695 http() 695 http()
696 .get("/getStudentsList", { 696 .get("/getStudentsList", {
697 headers: { 697 headers: {
698 Authorization: "Bearer " + this.token 698 Authorization: "Bearer " + this.token
699 } 699 }
700 }) 700 })
701 .then(response => { 701 .then(response => {
702 this.students = response.data.data; 702 this.students = response.data.data;
703 this.showLoader = false; 703 this.showLoader = false;
704 }) 704 })
705 .catch(error => { 705 .catch(error => {
706 // console.log("err====>", err); 706 // console.log("err====>", err);
707 this.showLoader = false; 707 this.showLoader = false;
708 if (error.response.status === 401) { 708 if (error.response.status === 401) {
709 this.$router.replace({ path: "/" }); 709 this.$router.replace({ path: "/" });
710 this.$store.dispatch("setToken", null); 710 this.$store.dispatch("setToken", null);
711 this.$store.dispatch("Id", null); 711 this.$store.dispatch("Id", null);
712 } 712 }
713 }); 713 });
714 }, 714 },
715 getParents() { 715 getParents() {
716 http() 716 http()
717 .get("/getParentsList", { 717 .get("/getParentsList", {
718 headers: { 718 headers: {
719 Authorization: "Bearer " + this.token 719 Authorization: "Bearer " + this.token
720 } 720 }
721 }) 721 })
722 .then(response => { 722 .then(response => {
723 this.parents = response.data.data; 723 this.parents = response.data.data;
724 this.showLoader = false; 724 this.showLoader = false;
725 }) 725 })
726 .catch(error => { 726 .catch(error => {
727 // console.log("err====>", err); 727 // console.log("err====>", err);
728 this.showLoader = false; 728 this.showLoader = false;
729 }); 729 });
730 }, 730 },
731 getTeachers() { 731 getTeachers() {
732 http() 732 http()
733 .get("/getTeachersList", { 733 .get("/getTeachersList", {
734 headers: { 734 headers: {
735 Authorization: "Bearer " + this.token 735 Authorization: "Bearer " + this.token
736 } 736 }
737 }) 737 })
738 .then(response => { 738 .then(response => {
739 this.teachers = response.data.data; 739 this.teachers = response.data.data;
740 this.showLoader = false; 740 this.showLoader = false;
741 }) 741 })
742 .catch(error => { 742 .catch(error => {
743 // console.log("err====>", err); 743 // console.log("err====>", err);
744 this.showLoader = false; 744 this.showLoader = false;
745 }); 745 });
746 }, 746 },
747 getClasses() { 747 getClasses() {
748 http() 748 http()
749 .get("/getClassesList", { 749 .get("/getClassesList", {
750 headers: { 750 headers: {
751 Authorization: "Bearer " + this.token 751 Authorization: "Bearer " + this.token
752 } 752 }
753 }) 753 })
754 .then(response => { 754 .then(response => {
755 this.classes = response.data.data; 755 this.classes = response.data.data;
756 this.showLoader = false; 756 this.showLoader = false;
757 }) 757 })
758 .catch(error => { 758 .catch(error => {
759 this.showLoader = false; 759 this.showLoader = false;
760 }); 760 });
761 }, 761 },
762 getNoticeData() { 762 getNoticeData() {
763 this.showLoader = true; 763 this.showLoader = true;
764 http() 764 http()
765 .get("/getEventsList", { 765 .get("/getEventsList", {
766 headers: { 766 headers: {
767 Authorization: "Bearer " + this.token 767 Authorization: "Bearer " + this.token
768 } 768 }
769 }) 769 })
770 .then(response => { 770 .then(response => {
771 this.noticeData = response.data.data; 771 this.noticeData = response.data.data;
772 this.showLoader = false; 772 this.showLoader = false;
773 }) 773 })
774 .catch(error => { 774 .catch(error => {
775 this.showLoader = false; 775 this.showLoader = false;
776 }); 776 });
777 }, 777 },
778 getUserData() { 778 getUserData() {
779 // this.showLoader = true; 779 // this.showLoader = true;
780 http() 780 http()
781 .get("/getParticularUserDetail", { 781 .get("/getParticularUserDetail", {
782 headers: { 782 headers: {
783 Authorization: "Bearer " + this.token 783 Authorization: "Bearer " + this.token
784 } 784 }
785 }) 785 })
786 .then(response => { 786 .then(response => {
787 this.userData = response.data.data; 787 this.userData = response.data.data;
788 this.showLoader = false; 788 this.showLoader = false;
789 }) 789 })
790 .catch(error => { 790 .catch(error => {
791 this.showLoader = false; 791 this.showLoader = false;
792 }); 792 });
793 }, 793 },
794 794
795 getFeesAndCollectionsData() { 795 getFeesAndCollectionsData() {
796 http() 796 http()
797 .get("/getTotalFeesAndCollections", { 797 .get("/getTotalFeesAndCollections", {
798 headers: { 798 headers: {
799 Authorization: "Bearer " + this.token 799 Authorization: "Bearer " + this.token
800 } 800 }
801 }) 801 })
802 .then(response => { 802 .then(response => {
803 this.feeData = response.data.data; 803 this.feeData = response.data.data;
804 // this.collectionData = response.data.data; 804 // this.collectionData = response.data.data;
805 this.series[0].data[0] = this.feeData.totalFees; 805 this.series[0].data[0] = this.feeData.totalFees;
806 this.series[0].data[1] = this.feeData.totalCollection; 806 this.series[0].data[1] = this.feeData.totalCollection;
807 // console.log("this.series====", this.series); 807 // console.log("this.series====", this.series);
808 808
809 this.showLoader = false; 809 this.showLoader = false;
810 }) 810 })
811 .catch(error => { 811 .catch(error => {
812 this.showLoader = false; 812 this.showLoader = false;
813 }); 813 });
814 }, 814 },
815 getExpensesData() { 815 getExpensesData() {
816 http() 816 http()
817 .get("/getTotalExpenses", { 817 .get("/getTotalExpenses", {
818 headers: { 818 headers: {
819 Authorization: "Bearer " + this.token 819 Authorization: "Bearer " + this.token
820 } 820 }
821 }) 821 })
822 .then(response => { 822 .then(response => {
823 this.expenseData = response.data.data; 823 this.expenseData = response.data.data;
824 // var array = response.data.data.sum; 824 // var array = response.data.data.sum;
825 this.series[0].data[2] = this.expenseData.sum; 825 this.series[0].data[2] = this.expenseData.sum;
826 // this.series = [ 826 // this.series = [
827 // { 827 // {
828 // name: "Total", 828 // name: "Total",
829 // data: array 829 // data: array
830 // } 830 // }
831 // ]; 831 // ];
832 // console.log("this.series====", this.series); 832 // console.log("this.series====", this.series);
833 this.showLoader = false; 833 this.showLoader = false;
834 }) 834 })
835 .catch(error => { 835 .catch(error => {
836 this.showLoader = false; 836 this.showLoader = false;
837 }); 837 });
838 }, 838 },
839 getparentStudents() { 839 getparentStudents() {
840 this.showLoader = true; 840 this.showLoader = true;
841 http() 841 http()
842 .get("/parentStudentsList") 842 .get("/parentStudentsList")
843 .then(response => { 843 .then(response => {
844 // console.log("resssssss", response.data.data.students[0].classId); 844 // console.log("resssssss", response.data.data.students[0].classId);
845 this.studentsData = response.data.data; 845 this.studentsData = response.data.data;
846 // localStorage.setItem( 846 // localStorage.setItem(
847 // "parentStudentId", 847 // "parentStudentId",
848 // this.studentsData.students[0]._id 848 // this.studentsData.students[0]._id
849 // ); 849 // );
850 // localStorage.setItem( 850 // localStorage.setItem(
851 // "parentClassId", 851 // "parentClassId",
852 // this.studentsData.students[0].classId 852 // this.studentsData.students[0].classId
853 // ); 853 // );
854 854
855 if (localStorage.getItem("parentStudentId") == null) { 855 if (localStorage.getItem("parentStudentId") == null) {
856 var parentStudentsId = response.data.data.students[0].classId; 856 var parentStudentsId = response.data.data.students[0].classId;
857 var classId = response.data.data.students[0]._id; 857 var classId = response.data.data.students[0]._id;
858 } 858 }
859 if (localStorage.getItem("parentStudentId")) { 859 if (localStorage.getItem("parentStudentId")) {
860 var parentStudentsId = localStorage.getItem("parentStudentId"); 860 var parentStudentsId = localStorage.getItem("parentStudentId");
861 var classId = localStorage.getItem("parentClassId"); 861 var classId = localStorage.getItem("parentClassId");
862 } 862 }
863 this.getCourses(parentStudentsId, classId); 863 this.getCourses(parentStudentsId, classId);
864 this.getAnnoucementes(classId); 864 this.getAnnoucementes(classId);
865 this.showLoader = false; 865 this.showLoader = false;
866 }) 866 })
867 .catch(err => { 867 .catch(err => {
868 console.log("err====>", err); 868 console.log("err====>", err);
869 this.showLoader = false; 869 this.showLoader = false;
870 }); 870 });
871 }, 871 },
872 async getCourses(parentStudentsId, classId) { 872 async getCourses(parentStudentsId, classId) {
873 /* getStudentCourses - to get courseData - defined in GetApis.js*/ 873 /* getStudentCourses - to get courseData - defined in GetApis.js*/
874 await this.getStudentCourses({ 874 await this.getStudentCourses({
875 classId: classId, 875 classId: classId,
876 studentId: parentStudentsId 876 studentId: parentStudentsId
877 }); 877 });
878 // this.showLoader = true;
879 // http()
880 // .get("/getStudentCourses", {
881 // params: {
882 // classId: classId,
883 // studentId: parentStudentsId
884 // }
885 // })
886 // .then(response => {
887 // this.courseData = response.data.data;
888 // console.log("course data - ",this.courseData)
889 // this.showLoader = false;
890 // })
891 // .catch(err => {
892 // console.log("err====>", err);
893 // this.showLoader = false;
894 // });
895 }, 878 },
896 getAnnoucementes(classId) { 879 getAnnoucementes(classId) {
897 this.showLoader = true; 880 this.showLoader = true;
898 http() 881 http()
899 .get("/getAnnoucementesList", { 882 .get("/getAnnoucementesList", {
900 params: { 883 params: {
901 classId: classId 884 classId: classId
902 } 885 }
903 }) 886 })
904 .then(response => { 887 .then(response => {
905 this.annoucementData = response.data.data; 888 this.annoucementData = response.data.data;
906 this.showLoader = false; 889 this.showLoader = false;
907 }) 890 })
908 .catch(err => { 891 .catch(err => {
909 console.log("err====>", err); 892 console.log("err====>", err);
910 this.showLoader = false; 893 this.showLoader = false;
911 }); 894 });
912 } 895 }
913 }, 896 },
914 async created() { 897 async created() {
915 /* get Latest events list */ 898 /* get Latest events list */
916 let response = await this.studentMeetingEvents({ 899 let response = await this.studentMeetingEvents({
917 studentId: localStorage.getItem("parentStudentId") 900 studentId: localStorage.getItem("parentStudentId")
918 }); 901 });
919 this.activityList = response.data.data; 902 this.activityList = response.data.data;
920 903
921 /* set activityEvents array to highlight event dates in calender */ 904 /* set activityEvents array to highlight event dates in calender */
922 for (var i = 0; i < this.activityList.length; i++) { 905 for (var i = 0; i < this.activityList.length; i++) {
923 let obj = {}; 906 let obj = {};
924 obj.date = moment(this.activityList[i].meetingEvent.dateOfEvent).format("YYYY/MM/DD");; 907 obj.date = moment(this.activityList[i].meetingEvent.dateOfEvent).format("YYYY/MM/DD");;
925 obj.title = this.activityList[i].meetingEvent.title; 908 obj.title = this.activityList[i].meetingEvent.title;
926 this.activityEvents.push(obj); 909 this.activityEvents.push(obj);
927 } 910 }
928 } 911 }
929 }; 912 };
930 </script> 913 </script>
931 914
932 <style scoped> 915 <style scoped>
933 @import "fullcalendar/dist/fullcalendar.css"; 916 @import "fullcalendar/dist/fullcalendar.css";
934 </style> 917 </style>