viithiisys / School-Management-dashboard

Download as
Browse Code ยป

Commit 02dca9d60170d812a25123410518152cee38f061

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

teacher activity event

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