viithiisys / School-Management-dashboard

Download as
Browse Code ยป

Commit 1b9dd5859eb67c337266545fc2cde2b7cba3d335

Authored by Amber Dev
1 parent 019880b6fb
Exists in master and in 1 other branch ui-design

added my kids to parents section

Showing 1 changed file with 122 additions and 83 deletions   Show diff stats
src/pages/Dashboard/dashboard.vue
Diff comments   View file @1b9dd58
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" persistent lazy> 72 <v-dialog v-model="viewEventDetails" max-width="500" persistent lazy>
73 <v-card flat class="card-style elevation-0" height="600" dark> 73 <v-card flat class="card-style elevation-0" height="600" dark>
74 <v-layout> 74 <v-layout>
75 <v-flex xs12> 75 <v-flex xs12>
76 <v-icon 76 <v-icon
77 size="24" 77 size="24"
78 class="right" 78 class="right"
79 @click="active=0;displayEventsList=[];dialogSchoolEvents = [];dialogMeetingEvents=[];viewEventDetails = false" 79 @click="active=0;displayEventsList=[];dialogSchoolEvents = [];dialogMeetingEvents=[];viewEventDetails = false"
80 >cancel</v-icon> 80 >cancel</v-icon>
81 </v-flex> 81 </v-flex>
82 </v-layout> 82 </v-layout>
83 <v-tabs v-model="active" color="#7f62f8" dark v-if="displayEventsList.length == 0"> 83 <v-tabs v-model="active" color="#7f62f8" dark v-if="displayEventsList.length == 0">
84 <v-tabs-slider color="yellow"></v-tabs-slider> 84 <v-tabs-slider color="yellow"></v-tabs-slider>
85 <v-tab v-for="(tab,index) in tabs" :key="index"> 85 <v-tab v-for="(tab,index) in tabs" :key="index">
86 <div class="subheading py-1">{{ tab.name }}</div> 86 <div class="subheading py-1">{{ tab.name }}</div>
87 </v-tab> 87 </v-tab>
88 <!-- <v-tab href="#schoolTab" v-if="dialogSchoolEvents.length > 0">School Events</v-tab> 88 <!-- <v-tab href="#schoolTab" v-if="dialogSchoolEvents.length > 0">School Events</v-tab>
89 <v-tab href="#meetingTab" v-if="dialogMeetingEvents.length > 0">Meeting Events</v-tab>--> 89 <v-tab href="#meetingTab" v-if="dialogMeetingEvents.length > 0">Meeting Events</v-tab>-->
90 90
91 <!-- SCHOOL EVENTS--> 91 <!-- SCHOOL EVENTS-->
92 <v-tab-item> 92 <v-tab-item>
93 <v-card flat class="card-style pa-2" dark v-if="dialogSchoolEvents.length > 0"> 93 <v-card flat class="card-style pa-2" dark v-if="dialogSchoolEvents.length > 0">
94 <v-container fluid> 94 <v-container fluid>
95 <v-divider class="white"></v-divider> 95 <v-divider class="white"></v-divider>
96 <v-card 96 <v-card
97 v-for="(particularEvent,index) in dialogSchoolEvents" 97 v-for="(particularEvent,index) in dialogSchoolEvents"
98 :key="index" 98 :key="index"
99 class="mt-3 pa-2 card-style white--text elevation-0" 99 class="mt-3 pa-2 card-style white--text elevation-0"
100 > 100 >
101 <div> 101 <div>
102 <div class="headline">{{particularEvent.title}}</div> 102 <div class="headline">{{particularEvent.title}}</div>
103 <div>Date Of Event : {{moment(particularEvent.dateOfEvent).format("DD MMMM, YYYY")}}</div> 103 <div>Date Of Event : {{moment(particularEvent.dateOfEvent).format("DD MMMM, YYYY")}}</div>
104 <div v-if="particularEvent.link">Start Time : {{particularEvent.startTime}}</div> 104 <div v-if="particularEvent.link">Start Time : {{particularEvent.startTime}}</div>
105 <div v-if="particularEvent.link">Duration : {{particularEvent.duration}}</div> 105 <div v-if="particularEvent.link">Duration : {{particularEvent.duration}}</div>
106 <div v-if="particularEvent.link"> 106 <div v-if="particularEvent.link">
107 Link : 107 Link :
108 <a :href="particularEvent.link">{{particularEvent.link}}</a> 108 <a :href="particularEvent.link">{{particularEvent.link}}</a>
109 </div> 109 </div>
110 <div 110 <div
111 v-if="particularEvent.description" 111 v-if="particularEvent.description"
112 >Description : {{particularEvent.description}}</div> 112 >Description : {{particularEvent.description}}</div>
113 </div> 113 </div>
114 <v-divider class="white mt-3"></v-divider> 114 <v-divider class="white mt-3"></v-divider>
115 </v-card> 115 </v-card>
116 </v-container> 116 </v-container>
117 </v-card> 117 </v-card>
118 </v-tab-item> 118 </v-tab-item>
119 119
120 <!-- MEETING EVENTS --> 120 <!-- MEETING EVENTS -->
121 <v-tab-item> 121 <v-tab-item>
122 <v-card v-if="dialogMeetingEvents.length > 0" flat class="card-style pa-2" dark> 122 <v-card v-if="dialogMeetingEvents.length > 0" flat class="card-style pa-2" dark>
123 <v-container fluid> 123 <v-container fluid>
124 <v-divider class="white"></v-divider> 124 <v-divider class="white"></v-divider>
125 <v-card 125 <v-card
126 v-for="(particularEvent,index) in dialogMeetingEvents" 126 v-for="(particularEvent,index) in dialogMeetingEvents"
127 :key="index" 127 :key="index"
128 class="mt-3 pa-2 card-style white--text elevation-0" 128 class="mt-3 pa-2 card-style white--text elevation-0"
129 > 129 >
130 <div> 130 <div>
131 <div class="headline">{{particularEvent.title}}</div> 131 <div class="headline">{{particularEvent.title}}</div>
132 <div>Date Of Event : {{moment(particularEvent.dateOfEvent).format("DD MMMM, YYYY")}}</div> 132 <div>Date Of Event : {{moment(particularEvent.dateOfEvent).format("DD MMMM, YYYY")}}</div>
133 <div v-if="particularEvent.link">Start Time : {{particularEvent.startTime}}</div> 133 <div v-if="particularEvent.link">Start Time : {{particularEvent.startTime}}</div>
134 <div v-if="particularEvent.link">Duration : {{particularEvent.duration}}</div> 134 <div v-if="particularEvent.link">Duration : {{particularEvent.duration}}</div>
135 <div v-if="particularEvent.link"> 135 <div v-if="particularEvent.link">
136 Link : 136 Link :
137 <a :href="particularEvent.link">{{particularEvent.link}}</a> 137 <a :href="particularEvent.link">{{particularEvent.link}}</a>
138 </div> 138 </div>
139 <div 139 <div
140 v-if="particularEvent.description" 140 v-if="particularEvent.description"
141 >Description : {{particularEvent.description}}</div> 141 >Description : {{particularEvent.description}}</div>
142 </div> 142 </div>
143 <v-divider class="white mt-3"></v-divider> 143 <v-divider class="white mt-3"></v-divider>
144 </v-card> 144 </v-card>
145 </v-container> 145 </v-container>
146 </v-card> 146 </v-card>
147 </v-tab-item> 147 </v-tab-item>
148 </v-tabs> 148 </v-tabs>
149 149
150 <!-- IF NO MULTIPLE EVENTS ON SAME DATE --> 150 <!-- IF NO MULTIPLE EVENTS ON SAME DATE -->
151 <v-card flat class="card-style pa-2 elevation-0" dark v-else> 151 <v-card flat class="card-style pa-2 elevation-0" dark v-else>
152 <v-container fluid> 152 <v-container fluid>
153 <v-divider class="white"></v-divider> 153 <v-divider class="white"></v-divider>
154 <v-card 154 <v-card
155 v-for="(particularEvent,index) in displayEventsList" 155 v-for="(particularEvent,index) in displayEventsList"
156 :key="index" 156 :key="index"
157 class="mt-3 pa-2 card-style white--text elevation-0" 157 class="mt-3 pa-2 card-style white--text elevation-0"
158 > 158 >
159 <div> 159 <div>
160 <div class="headline">{{particularEvent.title}}</div> 160 <div class="headline">{{particularEvent.title}}</div>
161 <div>Date Of Event : {{moment(particularEvent.dateOfEvent).format("DD MMMM, YYYY")}}</div> 161 <div>Date Of Event : {{moment(particularEvent.dateOfEvent).format("DD MMMM, YYYY")}}</div>
162 <div v-if="particularEvent.link">Start Time : {{particularEvent.startTime}}</div> 162 <div v-if="particularEvent.link">Start Time : {{particularEvent.startTime}}</div>
163 <div v-if="particularEvent.link">Duration : {{particularEvent.duration}}</div> 163 <div v-if="particularEvent.link">Duration : {{particularEvent.duration}}</div>
164 <div v-if="particularEvent.link"> 164 <div v-if="particularEvent.link">
165 Link : 165 Link :
166 <a :href="particularEvent.link">{{particularEvent.link}}</a> 166 <a :href="particularEvent.link">{{particularEvent.link}}</a>
167 </div> 167 </div>
168 <div 168 <div
169 v-if="particularEvent.description" 169 v-if="particularEvent.description"
170 >Description : {{particularEvent.description}}</div> 170 >Description : {{particularEvent.description}}</div>
171 </div> 171 </div>
172 <v-divider class="white mt-3"></v-divider> 172 <v-divider class="white mt-3"></v-divider>
173 </v-card> 173 </v-card>
174 </v-container> 174 </v-container>
175 </v-card> 175 </v-card>
176 </v-card> 176 </v-card>
177 </v-dialog> 177 </v-dialog>
178 178
179 <v-layout wrap row> 179 <v-layout wrap row>
180 <v-flex xs12 sm12 md8> 180 <v-flex xs12 sm12 md8>
181 <v-container fluid grid-list-xl> 181 <v-container fluid grid-list-xl>
182 <!-- ***** Total Students ***** --> 182 <!-- ***** Total Students ***** -->
183 <v-layout wrap class v-if="$store.state.role != 'PARENT' "> 183 <v-layout wrap class v-if="$store.state.role != 'PARENT' ">
184 <v-flex xs12 sm12 md3> 184 <v-flex xs12 sm12 md3>
185 <router-link :to="{ name:'Students' }"> 185 <router-link :to="{ name:'Students' }">
186 <v-card class="card pink-bgcolor"> 186 <v-card class="card pink-bgcolor">
187 <v-card-title primary-title class="titleCard white--text py-3">Students</v-card-title> 187 <v-card-title primary-title class="titleCard white--text py-3">Students</v-card-title>
188 <img src="/static/icon/student.png" class="ml-2" width="40" alt="icons" /> 188 <img src="/static/icon/student.png" class="ml-2" width="40" alt="icons" />
189 <v-card-title class="headline py-1 white--text">{{ students.length }}</v-card-title> 189 <v-card-title class="headline py-1 white--text">{{ students.length }}</v-card-title>
190 </v-card> 190 </v-card>
191 </router-link> 191 </router-link>
192 </v-flex> 192 </v-flex>
193 <!-- ***** Total Teachers***** --> 193 <!-- ***** Total Teachers***** -->
194 <v-flex xs12 sm12 md3> 194 <v-flex xs12 sm12 md3>
195 <router-link :to="{ name:'Teachers' }"> 195 <router-link :to="{ name:'Teachers' }">
196 <v-card flat class="card elevation-2 firozi-bgcolor"> 196 <v-card flat class="card elevation-2 firozi-bgcolor">
197 <v-card-title primary-title class="titleCard white--text py-3">Teachers</v-card-title> 197 <v-card-title primary-title class="titleCard white--text py-3">Teachers</v-card-title>
198 <img src="/static/icon/teacher.png" class="ml-2" width="40" alt="icons" /> 198 <img src="/static/icon/teacher.png" class="ml-2" width="40" alt="icons" />
199 199
200 <v-card-title class="headline py-1 white--text">{{ teachers.length }}</v-card-title> 200 <v-card-title class="headline py-1 white--text">{{ teachers.length }}</v-card-title>
201 </v-card> 201 </v-card>
202 </router-link> 202 </router-link>
203 </v-flex> 203 </v-flex>
204 <!-- ***** Total Parents ***** --> 204 <!-- ***** Total Parents ***** -->
205 <v-flex xs12 sm12 md3> 205 <v-flex xs12 sm12 md3>
206 <router-link :to="{ name:'Parents' }"> 206 <router-link :to="{ name:'Parents' }">
207 <v-card flat class="card yellow darken-3"> 207 <v-card flat class="card yellow darken-3">
208 <v-card-title primary-title class="titleCard white--text py-3">Parents</v-card-title> 208 <v-card-title primary-title class="titleCard white--text py-3">Parents</v-card-title>
209 <img src="/static/icon/parents.png" class="ml-3" width="40px" alt="icons" /> 209 <img src="/static/icon/parents.png" class="ml-3" width="40px" alt="icons" />
210 <v-card-title class="headline py-1 white--text">{{ parents.length }}</v-card-title> 210 <v-card-title class="headline py-1 white--text">{{ parents.length }}</v-card-title>
211 </v-card> 211 </v-card>
212 </router-link> 212 </router-link>
213 </v-flex> 213 </v-flex>
214 <!-- ***** Total Class***** --> 214 <!-- ***** Total Class***** -->
215 <v-flex xs12 sm12 md3> 215 <v-flex xs12 sm12 md3>
216 <router-link :to="{ name:'Class' }"> 216 <router-link :to="{ name:'Class' }">
217 <v-card flat class="card darkBlue-bgcolor"> 217 <v-card flat class="card darkBlue-bgcolor">
218 <v-card-title primary-title class="titleCard white--text py-3">Class</v-card-title> 218 <v-card-title primary-title class="titleCard white--text py-3">Class</v-card-title>
219 <img src="/static/icon/class.png" width="40" alt="icons" class="ml-2" /> 219 <img src="/static/icon/class.png" width="40" alt="icons" class="ml-2" />
220 <v-card-title class="headline py-1 white--text">{{ classes.length }}</v-card-title> 220 <v-card-title class="headline py-1 white--text">{{ classes.length }}</v-card-title>
221 </v-card> 221 </v-card>
222 </router-link> 222 </router-link>
223 </v-flex> 223 </v-flex>
224 </v-layout> 224 </v-layout>
225 225
226 <p 226 <p
227 v-if="studentsData.length === 0 && role == 'PARENT'" 227 v-if="studentsData.length === 0 && role == 'PARENT'"
228 class="text-center title grey lighten-4 error--text" 228 class="text-center title grey lighten-4 error--text"
229 >You have no student registered with school</p> 229 >You have no student registered with school</p>
230 <!-- ACCOUNT --> 230 <!-- ACCOUNT -->
231 <v-layout v-if="role == 'SUPERADMIN'|| role == 'ADMIN'"> 231 <v-layout v-if="role == 'SUPERADMIN'|| role == 'ADMIN'">
232 <v-flex xs12> 232 <v-flex xs12>
233 <v-card class="card mt-2 account-Card"> 233 <v-card class="card mt-2 account-Card">
234 <h4> 234 <h4>
235 <b>Account</b> 235 <b>Account</b>
236 </h4> 236 </h4>
237 <v-layout wrap> 237 <v-layout wrap>
238 <v-flex xs12 sm12 md3> 238 <v-flex xs12 sm12 md3>
239 <v-list two-line> 239 <v-list two-line>
240 <template> 240 <template>
241 <v-list-tile> 241 <v-list-tile>
242 <v-list-tile-avatar> 242 <v-list-tile-avatar>
243 <v-icon class="account-circle darkBlue-color">panorama_fish_eye</v-icon> 243 <v-icon class="account-circle darkBlue-color">panorama_fish_eye</v-icon>
244 </v-list-tile-avatar> 244 </v-list-tile-avatar>
245 <v-list-tile-content> 245 <v-list-tile-content>
246 <v-list-tile-title class="mt-2"> 246 <v-list-tile-title class="mt-2">
247 <p class="subheading font-color">Fees</p> 247 <p class="subheading font-color">Fees</p>
248 </v-list-tile-title> 248 </v-list-tile-title>
249 <v-list-tile-title>Rs. {{ feeData.totalFees }}</v-list-tile-title> 249 <v-list-tile-title>Rs. {{ feeData.totalFees }}</v-list-tile-title>
250 </v-list-tile-content> 250 </v-list-tile-content>
251 </v-list-tile> 251 </v-list-tile>
252 <v-list-tile> 252 <v-list-tile>
253 <v-list-tile-avatar> 253 <v-list-tile-avatar>
254 <v-icon class="account-circle yellowDark-color">panorama_fish_eye</v-icon> 254 <v-icon class="account-circle yellowDark-color">panorama_fish_eye</v-icon>
255 </v-list-tile-avatar> 255 </v-list-tile-avatar>
256 <v-list-tile-content> 256 <v-list-tile-content>
257 <v-list-tile-title class="mt-2"> 257 <v-list-tile-title class="mt-2">
258 <p class="subheading font-color">Collection</p> 258 <p class="subheading font-color">Collection</p>
259 </v-list-tile-title> 259 </v-list-tile-title>
260 <v-list-tile-title>Rs. {{ feeData.totalCollection }}</v-list-tile-title> 260 <v-list-tile-title>Rs. {{ feeData.totalCollection }}</v-list-tile-title>
261 </v-list-tile-content> 261 </v-list-tile-content>
262 </v-list-tile> 262 </v-list-tile>
263 <v-list-tile> 263 <v-list-tile>
264 <v-list-tile-avatar> 264 <v-list-tile-avatar>
265 <v-icon class="account-circle pink-color">panorama_fish_eye</v-icon> 265 <v-icon class="account-circle pink-color">panorama_fish_eye</v-icon>
266 </v-list-tile-avatar> 266 </v-list-tile-avatar>
267 <v-list-tile-content> 267 <v-list-tile-content>
268 <v-list-tile-title class="mt-2"> 268 <v-list-tile-title class="mt-2">
269 <p class="subheading font-color">Expences</p> 269 <p class="subheading font-color">Expences</p>
270 </v-list-tile-title> 270 </v-list-tile-title>
271 <v-list-tile-title>Rs. {{ expenseData.sum }}</v-list-tile-title> 271 <v-list-tile-title>Rs. {{ expenseData.sum }}</v-list-tile-title>
272 </v-list-tile-content> 272 </v-list-tile-content>
273 </v-list-tile> 273 </v-list-tile>
274 </template> 274 </template>
275 </v-list> 275 </v-list>
276 </v-flex> 276 </v-flex>
277 <v-flex xs12 sm12 md9 lg9> 277 <v-flex xs12 sm12 md9 lg9>
278 <div id="chart"> 278 <div id="chart">
279 <div v-if="showChart"> 279 <div v-if="showChart">
280 <apexchart 280 <apexchart
281 type="bar" 281 type="bar"
282 height="250" 282 height="250"
283 style="max-width: 800px !important" 283 style="max-width: 800px !important"
284 :options="chartOptions" 284 :options="chartOptions"
285 :series="series" 285 :series="series"
286 ></apexchart> 286 ></apexchart>
287 </div> 287 </div>
288 </div> 288 </div>
289 </v-flex> 289 </v-flex>
290 </v-layout> 290 </v-layout>
291 </v-card> 291 </v-card>
292 </v-flex> 292 </v-flex>
293 </v-layout> 293 </v-layout>
294 294
295 <!-- FOR ADMIN,TEACHER ROLE --> 295 <!-- FOR ADMIN,TEACHER ROLE -->
296 <v-layout row wrap v-if="role == 'ADMIN'||role == 'TEACHER'"> 296 <v-layout row wrap v-if="role == 'ADMIN'||role == 'TEACHER'">
297 <!-- NOTICE --> 297 <!-- NOTICE -->
298 <v-flex xs12 sm6> 298 <v-flex xs12 sm6>
299 <v-card class="card"> 299 <v-card class="card">
300 <v-container> 300 <v-container>
301 <v-card-title class="justify-center title font-weight-bold">Notice Board</v-card-title> 301 <v-card-title class="justify-center title font-weight-bold">Notice Board</v-card-title>
302 <v-layout column> 302 <v-layout column>
303 <v-flex 303 <v-flex
304 v-for="(item,index) in noticeData" 304 v-for="(item,index) in noticeData"
305 :key="index" 305 :key="index"
306 style="cursor: pointer;" 306 style="cursor: pointer;"
307 > 307 >
308 <v-layout column> 308 <v-layout column>
309 <!--Date--> 309 <!--Date-->
310 <v-flex class="pb-2 pl-2 pr-2"> 310 <v-flex class="pb-2 pl-2 pr-2">
311 <v-chip 311 <v-chip
312 :color="colorsArray[index%colorsArray.length]" 312 :color="colorsArray[index%colorsArray.length]"
313 text-color="white" 313 text-color="white"
314 class="ma-0" 314 class="ma-0"
315 >{{ moment(item.created).format("DD MMMM, YYYY") }}</v-chip> 315 >{{ moment(item.created).format("DD MMMM, YYYY") }}</v-chip>
316 </v-flex> 316 </v-flex>
317 <!-- title --> 317 <!-- title -->
318 <v-flex class="pa-2"> 318 <v-flex class="pa-2">
319 <div class="body-1 font-weight-bold px-2" @click="profile">{{item.title}}</div> 319 <div class="body-1 font-weight-bold px-2" @click="profile">{{item.title}}</div>
320 </v-flex> 320 </v-flex>
321 321
322 <!-- divider --> 322 <!-- divider -->
323 <v-flex class="pa-2"> 323 <v-flex class="pa-2">
324 <v-divider></v-divider> 324 <v-divider></v-divider>
325 </v-flex> 325 </v-flex>
326 </v-layout> 326 </v-layout>
327 </v-flex> 327 </v-flex>
328 </v-layout> 328 </v-layout>
329 329
330 <!-- <v-data-table 330 <!-- <v-data-table
331 :items="noticeData" 331 :items="noticeData"
332 class="elevation-0" 332 class="elevation-0"
333 flat 333 flat
334 hide-actions 334 hide-actions
335 hide-headers 335 hide-headers
336 style="border-spacing: 0 !important;" 336 style="border-spacing: 0 !important;"
337 > 337 >
338 <template 338 <template
339 slot="items" 339 slot="items"
340 slot-scope="props" 340 slot-scope="props"
341 v-if="props.index < 5" 341 v-if="props.index < 5"
342 style="border-spacing: 0 !important;" 342 style="border-spacing: 0 !important;"
343 > 343 >
344 <tr class="td-notice"> 344 <tr class="td-notice">
345 <td class="grey--text" style="width:18px">{{ props.index + 1}}</td> 345 <td class="grey--text" style="width:18px">{{ props.index + 1}}</td>
346 <td> 346 <td>
347 <span class="grey--text caption">{{ date(props.item.created) }}</span> 347 <span class="grey--text caption">{{ date(props.item.created) }}</span>
348 <br /> 348 <br />
349 <span class="body-2">{{ props.item.title}}</span> 349 <span class="body-2">{{ props.item.title}}</span>
350 </td>--> 350 </td>-->
351 <!-- <td class="grey--text mt-2" >{{ props.item.description}}</td> --> 351 <!-- <td class="grey--text mt-2" >{{ props.item.description}}</td> -->
352 <!-- 352 <!--
353 <td class="text-xs-center"> 353 <td class="text-xs-center">
354 <span> 354 <span>
355 <v-tooltip top> 355 <v-tooltip top>
356 <img 356 <img
357 slot="activator" 357 slot="activator"
358 style="cursor:pointer; width:25px; height:25px; " 358 style="cursor:pointer; width:25px; height:25px; "
359 @click="profile" 359 @click="profile"
360 src="/static/icon/view.png" 360 src="/static/icon/view.png"
361 /> 361 />
362 <span>View</span> 362 <span>View</span>
363 </v-tooltip> 363 </v-tooltip>
364 </span> 364 </span>
365 </td> 365 </td>
366 </tr> 366 </tr>
367 </template> 367 </template>
368 </v-data-table>--> 368 </v-data-table>-->
369 </v-container> 369 </v-container>
370 </v-card> 370 </v-card>
371 </v-flex> 371 </v-flex>
372 372
373 <!-- SCHOOL EVENTS --> 373 <!-- SCHOOL EVENTS -->
374 <v-flex xs12 sm6> 374 <v-flex xs12 sm6>
375 <v-layout column> 375 <v-layout column>
376 <!-- school events --> 376 <!-- school events -->
377 <v-flex> 377 <v-flex>
378 <v-card class="card"> 378 <v-card class="card">
379 <v-container> 379 <v-container>
380 <v-card-title class="justify-center title font-weight-bold">School Events</v-card-title> 380 <v-card-title class="justify-center title font-weight-bold">School Events</v-card-title>
381 <div 381 <div
382 v-for="(schoolEvent,index) in schoolEvents" 382 v-for="(schoolEvent,index) in schoolEvents"
383 :key="schoolEvent.title" 383 :key="schoolEvent.title"
384 class="mt-2" 384 class="mt-2"
385 style="cursor: pointer;" 385 style="cursor: pointer;"
386 @click="seeEventDetails(schoolEvent,'schoolEvent')" 386 @click="seeEventDetails(schoolEvent,'schoolEvent')"
387 > 387 >
388 <!-- color dot--> 388 <!-- color dot-->
389 <span 389 <span
390 :style="{ 'background-color': colorsArray[index%colorsArray.length] }" 390 :style="{ 'background-color': colorsArray[index%colorsArray.length] }"
391 style="height: 12px;width: 12px;border-radius: 50%;display: inline-block;vertical-align: top;" 391 style="height: 12px;width: 12px;border-radius: 50%;display: inline-block;vertical-align: top;"
392 ></span> 392 ></span>
393 <div style="display: inline-block;" class="ml-2"> 393 <div style="display: inline-block;" class="ml-2">
394 <div> 394 <div>
395 <!-- date of event --> 395 <!-- date of event -->
396 <div 396 <div
397 class="grey--text lighten-1 caption" 397 class="grey--text lighten-1 caption"
398 v-if="schoolEvent.dateOfEvent" 398 v-if="schoolEvent.dateOfEvent"
399 >{{moment(schoolEvent.dateOfEvent).format("DD MMMM, YYYY")}}</div> 399 >{{moment(schoolEvent.dateOfEvent).format("DD MMMM, YYYY")}}</div>
400 <!-- event title--> 400 <!-- event title-->
401 <div class="body-1" v-if="schoolEvent.title">{{schoolEvent.title}}</div> 401 <div class="body-1" v-if="schoolEvent.title">{{schoolEvent.title}}</div>
402 </div> 402 </div>
403 </div> 403 </div>
404 </div> 404 </div>
405 <div v-if="schoolEvents.length == 0"> 405 <div v-if="schoolEvents.length == 0">
406 <p class="text-center title grey lighten-4 error--text">No Data Found!</p> 406 <p class="text-center title grey lighten-4 error--text">No Data Found!</p>
407 </div> 407 </div>
408 </v-container> 408 </v-container>
409 </v-card> 409 </v-card>
410 </v-flex> 410 </v-flex>
411 <!-- apex charts - Male Female data --> 411 <!-- apex charts - Male Female data -->
412 <v-flex> 412 <v-flex>
413 <v-card> 413 <v-card>
414 <v-card-title class="justify-center title font-weight-bold">Students</v-card-title> 414 <v-card-title class="justify-center title font-weight-bold">Students</v-card-title>
415 <div id="chart"> 415 <div id="chart">
416 <apexcharts 416 <apexcharts
417 type="donut" 417 type="donut"
418 :options="maleFemaleData" 418 :options="maleFemaleData"
419 :series="maleFemaleSeries" 419 :series="maleFemaleSeries"
420 /> 420 />
421 </div> 421 </div>
422 </v-card> 422 </v-card>
423 </v-flex> 423 </v-flex>
424 </v-layout> 424 </v-layout>
425 </v-flex> 425 </v-flex>
426 </v-layout> 426 </v-layout>
427 427
428 <v-layout row wrap v-if="role == 'PARENT'"> 428 <v-layout row wrap v-if="role == 'PARENT'">
429 <!-- ROLE - PARENT , ACTIVE STUDENTS --> 429 <!-- ROLE - PARENT , MY KIDS -->
430 <v-flex xs12> 430 <v-flex xs12>
431 <v-card class="elevation-0 account-Card"> 431 <v-card class="elevation-3 card">
432 <v-container> 432 <v-container>
433 <v-card-title class="title font-weight-bold">Students</v-card-title> 433 <v-card-title class="title font-weight-bold justify-center">My Kids</v-card-title>
434 <v-data-iterator 434 <v-data-iterator
435 :items="activeStudentsList" 435 :items="activeStudentsList"
436 :rows-per-page-items="rowsPerPageItems" 436 :rows-per-page-items="rowsPerPageItems"
437 :pagination.sync="pagination" 437 :pagination.sync="pagination"
438 content-tag="v-layout" 438 content-tag="v-layout"
439 row 439 row
440 wrap 440 wrap
441 > 441 >
442 <template v-slot:item="props"> 442 <template v-slot:item="props">
443 <v-flex xs12 sm6> 443 <v-flex xs12 sm6>
444 <v-card style="border: 2px solid black" class="elevation-0" height="300"> 444 <div style="height: 150px; width: 100% display: inline-block;">
445 <v-container> 445 <v-layout row wrap>
446 <v-card-text> 446 <!-- IMAGE OF ACTIVE STUDENT -->
447 <v-layout row wrap> 447 <v-flex xs3 class="text-xs-center">
448 <!-- IMAGE OF ACTIVE STUDENT --> 448 <v-avatar size="50px">
449 <v-flex xs12 class="text-xs-center">
450 <img 449 <img
451 :src="props.item.profilePicUrl" 450 :src="props.item.profilePicUrl"
452 alt="profileImage" 451 v-if="props.item.profilePicUrl"
453 width="80"
454 /> 452 />
455 </v-flex> 453 <img src="/static/icon/user.png" v-else />
456 <v-flex xs12 class="text-xs-center"> 454 </v-avatar>
457 <!--NAME --> 455 <!-- <div style="height: 90px;">
458 <v-layout class="pa-0 ma-0"> 456 <img
459 <v-flex xs4 class="body-1 font-weight-bold pa-0 ma-0"> 457 :src="props.item.profilePicUrl"
460 <span class="left">Name:</span> 458 alt="profileImage"
461 </v-flex> 459 width="80"
462 <v-flex xs8 class="body-1 font-weight-bold pa-0 ml-2"> 460 v-if="props.item.profilePicUrl"
463 <span class="left">{{props.item.name}}</span> 461 />
464 </v-flex> 462 <img width="80" src="/static/icon/user.png" v-else />
465 </v-layout> 463 </div>-->
466 <!--ROLLNO --> 464 </v-flex>
467 <v-layout class="pa-0 ma-0"> 465 <v-flex xs9 class="text-xs-center">
468 <v-flex xs4 class="body-1 font-weight-bold pa-0 ma-0"> 466 <!--NAME -->
469 <span class="left">Roll No:</span> 467 <v-layout class="pa-0 ma-0">
470 </v-flex> 468 <v-flex xs3 class="body-1 pa-0 ma-0">
471 <v-flex xs8 class="body-1 font-weight-bold pa-0 ml-2"> 469 <span class="left">Name:</span>
472 <span class="left">{{props.item.rollNo}}</span> 470 </v-flex>
473 </v-flex> 471 <v-flex xs9 class="body-1 pa-0 ml-2">
474 </v-layout> 472 <span class="left">{{props.item.name}}</span>
475 <!--GENDER --> 473 </v-flex>
476 <v-layout class="pa-0 ma-0"> 474 </v-layout>
477 <v-flex xs4 class="body-1 font-weight-bold pa-0 ma-0"> 475 <!--ROLLNO -->
478 <span class="left">Gender:</span> 476 <v-layout class="pa-0 ma-0">
479 </v-flex> 477 <v-flex xs3 class="body-1 pa-0 ma-0">
480 <v-flex xs8 class="body-1 font-weight-bold pa-0 ml-2"> 478 <span class="left">Roll No:</span>
481 <span class="left">{{props.item.gender}}</span> 479 </v-flex>
482 </v-flex> 480 <v-flex xs9 class="body-1 pa-0 ml-2">
483 </v-layout> 481 <span class="left">{{props.item.rollNo}}</span>
484 <!--EMAIL --> 482 </v-flex>
485 <v-layout class="pa-0 ma-0"> 483 </v-layout>
486 <v-flex xs4 class="body-1 font-weight-bold pa-0 ma-0"> 484 <!--GENDER -->
487 <span class="left">Email:</span> 485 <v-layout class="pa-0 ma-0">
488 </v-flex> 486 <v-flex xs3 class="body-1 pa-0 ma-0">
489 <v-flex xs8 class="body-1 font-weight-bold pa-0 ml-2"> 487 <span class="left">Gender:</span>
490 <span class="left">{{props.item.email}}</span> 488 </v-flex>
491 </v-flex> 489 <v-flex xs9 class="body-1 pa-0 ml-2">
492 </v-layout> 490 <span class="left">{{props.item.gender}}</span>
493 </v-flex> 491 </v-flex>
494 </v-layout> 492 </v-layout>
495 </v-card-text> 493 <!--EMAIL -->
496 </v-container> 494 <v-layout class="pa-0 ma-0">
497 </v-card> 495 <v-flex xs3 class="body-1 pa-0 ma-0">
498 </v-flex> 496 <span class="left">Email:</span>
499 </template> 497 </v-flex>
500 </v-data-iterator> 498 <v-flex xs9 class="body-1 pa-0 ml-2">
499 <span class="left">{{props.item.email}}</span>
500 </v-flex>
501 </v-layout>
502 </v-flex>
503 </v-layout>
504 </div>
505 </v-flex>
506 </template>
507 </v-data-iterator>
501 </v-container> 508 </v-container>
502 </v-card> 509 </v-card>
503 </v-flex> 510 </v-flex>
504 511
505 <!-- ROLE - PARENT, MY COURSES --> 512 <!-- ROLE - PARENT, MY COURSES -->
506 <v-flex xs12> 513 <v-flex xs12>
507 <v-card class="elevation-0 account-Card"> 514 <v-card class="elevation-3 card">
515 <v-container>
516 <v-card-title class="justify-center title font-weight-bold">My Courses</v-card-title>
517 <v-layout wrap>
518 <v-flex xs12 sm12>
519 <v-list two-line>
520 <template>
521 <v-list-tile v-for="(course,i) in courseData" :key="i">
522 <v-list-tile-avatar>
523 <!-- <v-icon
524 class="account-circle darkBlue-color"
525 style="cursor: pointer;"
526 @click="routeToCourseDetails(course._id)"
527 >panorama_fish_eye</v-icon>-->
528 <span>
529 <v-tooltip top>
530 <img
531 slot="activator"
532 style="cursor:pointer; width:25px; height:25px; "
533 src="/static/icon/view.png"
534 @click="routeToCourseDetails(course._id)"
535 />
536 <span>View</span>
537 </v-tooltip>
538 </span>
539 </v-list-tile-avatar>
540 <v-list-tile-content>
541 <v-list-tile-title
542 style="cursor: pointer;"
543 @click="routeToCourseDetails(course._id)"
544 >{{ course.courseName }}</v-list-tile-title>
545 </v-list-tile-content>
546 </v-list-tile>
547 </template>
548 </v-list>
549 </v-flex>
550 </v-layout>
551 </v-container>
552 </v-card>
553 <!-- <v-card class="elevation-0 account-Card">
508 <v-container> 554 <v-container>
509 <v-card-title class="title font-weight-bold">My Courses</v-card-title> 555 <v-card-title class="title font-weight-bold">My Courses</v-card-title>
510 <v-layout wrap> 556 <v-layout wrap>
511 <v-flex xs3 v-for="(course,i) in courseData" :key="i"> 557 <v-flex xs3 v-for="(course,i) in courseData" :key="i">
512 <v-btn block outline color="#71d9ea" dark> 558 <v-btn block outline color="#71d9ea" dark>
513 <span 559 <span
514 class="subheading font-weight-bold" 560 class="subheading font-weight-bold"
515 @click="routeToCourseDetails(course._id)" 561 @click="routeToCourseDetails(course._id)"
516 >{{ course.courseName }}</span> 562 >{{ course.courseName }}</span>
517 </v-btn> 563 </v-btn>
518 <!-- <v-list two-line> 564
519 <template>
520 <v-list-tile>
521 <v-list-tile-avatar>
522
523 </v-list-tile-avatar>
524 <v-list-tile-content></v-list-tile-content>
525 </v-list-tile>
526 </template>
527 </v-list>-->
528 </v-flex> 565 </v-flex>
529 </v-layout> 566 </v-layout>
530 </v-container> 567 </v-container>
531 </v-card> 568 </v-card>-->
532 </v-flex> 569 </v-flex>
533 </v-layout> 570 </v-layout>
534 571
535 <v-layout row wrap v-if="role == 'PARENT'"> 572 <v-layout row wrap v-if="role == 'PARENT'">
536 <!-- ROLE - PARENT , LATEST ANNOUNCEMENTS --> 573 <!-- ROLE - PARENT , LATEST ANNOUNCEMENTS -->
537 <v-flex xs12 sm6 md6> 574 <v-flex xs12 sm6 md6>
538 <!-- NOTICE --> 575 <!-- NOTICE -->
539 <v-card class="account-Card"> 576 <v-card class="elevation-3 card">
540 <v-container> 577 <v-container>
541 <v-card-title class="justify-center subheading font-weight-bold">Latest Announcements</v-card-title> 578 <v-card-title
579 class="justify-center subheading font-weight-bold"
580 >Latest Announcements</v-card-title>
542 <v-layout column> 581 <v-layout column>
543 <v-flex 582 <v-flex
544 v-for="(item,index) in annoucementData" 583 v-for="(item,index) in annoucementData"
545 :key="index" 584 :key="index"
546 style="cursor: pointer;" 585 style="cursor: pointer;"
547 > 586 >
548 <v-layout column> 587 <v-layout column>
549 <!--Date--> 588 <!--Date-->
550 <v-flex class="pb-2 pl-2 pr-2"> 589 <v-flex class="pb-2 pl-2 pr-2">
551 <v-chip 590 <v-chip
552 :color="colorsArray[index%colorsArray.length]" 591 :color="colorsArray[index%colorsArray.length]"
553 text-color="white" 592 text-color="white"
554 class="ma-0" 593 class="ma-0"
555 >{{ moment(item.created).format("DD MMMM, YYYY") }}</v-chip> 594 >{{ moment(item.created).format("DD MMMM, YYYY") }}</v-chip>
556 </v-flex> 595 </v-flex>
557 <!-- title --> 596 <!-- title -->
558 <v-flex class="pa-2"> 597 <v-flex class="pa-2">
559 <div 598 <div
560 class="body-1 font-weight-bold px-2" 599 class="body-1 font-weight-bold px-2"
561 @click="profile" 600 @click="profile"
562 >{{item.discussionType}}</div> 601 >{{item.discussionType}}</div>
563 </v-flex> 602 </v-flex>
564 603
565 <!-- divider --> 604 <!-- divider -->
566 <v-flex class="pa-2"> 605 <v-flex class="pa-2">
567 <v-divider></v-divider> 606 <v-divider></v-divider>
568 </v-flex> 607 </v-flex>
569 </v-layout> 608 </v-layout>
570 </v-flex> 609 </v-flex>
571 </v-layout> 610 </v-layout>
572 </v-container> 611 </v-container>
573 </v-card> 612 </v-card>
574 </v-flex> 613 </v-flex>
575 614
576 <v-flex xs12 sm6> 615 <v-flex xs12 sm6>
577 <v-layout column> 616 <v-layout column>
578 <!-- ROLE - PARENT, SCHOOL EVENTS --> 617 <!-- ROLE - PARENT, SCHOOL EVENTS -->
579 <v-flex> 618 <v-flex>
580 <v-card class="account-Card"> 619 <v-card class="elevation-3 card">
581 <v-container> 620 <v-container>
582 <v-card-title class="justify-center subheading font-weight-bold">School Events</v-card-title> 621 <v-card-title class="justify-center subheading font-weight-bold">School Events</v-card-title>
583 <div 622 <div
584 v-for="(schoolEvent,index) in schoolEvents" 623 v-for="(schoolEvent,index) in schoolEvents"
585 :key="schoolEvent.title" 624 :key="schoolEvent.title"
586 class="mt-2" 625 class="mt-2"
587 style="cursor: pointer;" 626 style="cursor: pointer;"
588 @click="seeEventDetails(schoolEvent,'schoolEvent')" 627 @click="seeEventDetails(schoolEvent,'schoolEvent')"
589 > 628 >
590 <!-- color dot--> 629 <!-- color dot-->
591 <span 630 <span
592 :style="{ 'background-color': colorsArray[index%colorsArray.length] }" 631 :style="{ 'background-color': colorsArray[index%colorsArray.length] }"
593 style="height: 12px;width: 12px;border-radius: 50%;display: inline-block;vertical-align: top;" 632 style="height: 12px;width: 12px;border-radius: 50%;display: inline-block;vertical-align: top;"
594 ></span> 633 ></span>
595 <div style="display: inline-block;" class="ml-2"> 634 <div style="display: inline-block;" class="ml-2">
596 <div> 635 <div>
597 <!-- date of event --> 636 <!-- date of event -->
598 <div 637 <div
599 class="grey--text lighten-1 caption" 638 class="grey--text lighten-1 caption"
600 v-if="schoolEvent.dateOfEvent" 639 v-if="schoolEvent.dateOfEvent"
601 >{{moment(schoolEvent.dateOfEvent).format("DD MMMM, YYYY")}}</div> 640 >{{moment(schoolEvent.dateOfEvent).format("DD MMMM, YYYY")}}</div>
602 <!-- event title--> 641 <!-- event title-->
603 <div class="body-1" v-if="schoolEvent.title">{{schoolEvent.title}}</div> 642 <div class="body-1" v-if="schoolEvent.title">{{schoolEvent.title}}</div>
604 </div> 643 </div>
605 </div> 644 </div>
606 </div> 645 </div>
607 <div v-if="schoolEvents.length == 0"> 646 <div v-if="schoolEvents.length == 0">
608 <p class="text-center title grey lighten-4 error--text">No Data Found!</p> 647 <p class="text-center title grey lighten-4 error--text">No Data Found!</p>
609 </div> 648 </div>
610 </v-container> 649 </v-container>
611 </v-card> 650 </v-card>
612 </v-flex> 651 </v-flex>
613 </v-layout> 652 </v-layout>
614 </v-flex> 653 </v-flex>
615 </v-layout> 654 </v-layout>
616 </v-container> 655 </v-container>
617 </v-flex> 656 </v-flex>
618 <v-spacer></v-spacer> 657 <v-spacer></v-spacer>
619 <!-- SIDE BAR --> 658 <!-- SIDE BAR -->
620 <v-flex xs12 sm12 md4> 659 <v-flex xs12 sm12 md4>
621 <v-card height="100%" class="elevation-0 mt-3 profileDasboard"> 660 <v-card height="100%" class="elevation-0 mt-3 profileDasboard">
622 <v-card-text class="px-2"> 661 <v-card-text class="px-2">
623 <h4 class="text-xs-center py-3"> 662 <h4 class="text-xs-center py-3">
624 <b>Profile</b> 663 <b>Profile</b>
625 </h4> 664 </h4>
626 <v-flex xs12 class="py-3"> 665 <v-flex xs12 class="py-3">
627 <v-layout wrap> 666 <v-layout wrap>
628 <v-flex xs12 sm12 md4> 667 <v-flex xs12 sm12 md4>
629 <img 668 <img
630 src="/static/icon/user.png" 669 src="/static/icon/user.png"
631 v-if="!userData.profilePicUrl && !userData.schoolLogoUrl" 670 v-if="!userData.profilePicUrl && !userData.schoolLogoUrl"
632 width="80" 671 width="80"
633 /> 672 />
634 <img 673 <img
635 :src="userData.profilePicUrl" 674 :src="userData.profilePicUrl"
636 onerror="this.src='/static/icon/user.png';" 675 onerror="this.src='/static/icon/user.png';"
637 v-if="userData.profilePicUrl" 676 v-if="userData.profilePicUrl"
638 width="80" 677 width="80"
639 /> 678 />
640 <img 679 <img
641 :src="userData.schoolLogoUrl" 680 :src="userData.schoolLogoUrl"
642 onerror="this.src='/static/icon/user.png';" 681 onerror="this.src='/static/icon/user.png';"
643 v-if="userData.schoolLogoUrl" 682 v-if="userData.schoolLogoUrl"
644 width="80" 683 width="80"
645 /> 684 />
646 </v-flex> 685 </v-flex>
647 <v-flex xs12 sm12 md6> 686 <v-flex xs12 sm12 md6>
648 <p class="mb-0 body-1"> 687 <p class="mb-0 body-1">
649 <i>{{ userData.name }}</i> 688 <i>{{ userData.name }}</i>
650 </p> 689 </p>
651 <p class="mb-0 caption grey--text">{{ userData.email }}</p> 690 <p class="mb-0 caption grey--text">{{ userData.email }}</p>
652 <p class="mb-0 caption grey--text">{{ userData.mobile }}</p> 691 <p class="mb-0 caption grey--text">{{ userData.mobile }}</p>
653 <address class="caption grey--text mb-3">{{ userData.address }}</address> 692 <address class="caption grey--text mb-3">{{ userData.address }}</address>
654 </v-flex> 693 </v-flex>
655 </v-layout> 694 </v-layout>
656 </v-flex> 695 </v-flex>
657 <hr /> 696 <hr />
658 <div class="text-xs-center py-3 subheading font-weight-bold">Calender</div> 697 <div class="text-xs-center py-3 subheading font-weight-bold">Calender</div>
659 698
660 <vue-event-calendar :events="activityEvents" @day-changed="handleDayChanged($event)"></vue-event-calendar> 699 <vue-event-calendar :events="activityEvents" @day-changed="handleDayChanged($event)"></vue-event-calendar>
661 700
662 <!-- MEETING EVENTS --> 701 <!-- MEETING EVENTS -->
663 <!-- IF ROLE IS ADMIN --> 702 <!-- IF ROLE IS ADMIN -->
664 <v-card class="my-3 elevation-0"> 703 <v-card class="my-3 elevation-0">
665 <v-card-text v-if="$store.state.role === 'ADMIN' "> 704 <v-card-text v-if="$store.state.role === 'ADMIN' ">
666 <!-- MEETING EVENTS --> 705 <!-- MEETING EVENTS -->
667 <v-card-title class="justify-center subheading font-weight-bold">Meeting Events</v-card-title> 706 <v-card-title class="justify-center subheading font-weight-bold">Meeting Events</v-card-title>
668 <div 707 <div
669 v-for="(activity,index) in activityList" 708 v-for="(activity,index) in activityList"
670 :key="index" 709 :key="index"
671 class="mt-2" 710 class="mt-2"
672 style="cursor: pointer;" 711 style="cursor: pointer;"
673 @click="seeEventDetails(activity)" 712 @click="seeEventDetails(activity)"
674 > 713 >
675 <span 714 <span
676 :style="{ 'background-color': colorsArray[index%colorsArray.length] }" 715 :style="{ 'background-color': colorsArray[index%colorsArray.length] }"
677 style="height: 12px;width: 12px;border-radius: 50%;display: inline-block;vertical-align: top;" 716 style="height: 12px;width: 12px;border-radius: 50%;display: inline-block;vertical-align: top;"
678 ></span> 717 ></span>
679 <div style="display: inline-block;" class="ml-2"> 718 <div style="display: inline-block;" class="ml-2">
680 <div> 719 <div>
681 <div 720 <div
682 class="grey--text lighten-1 caption" 721 class="grey--text lighten-1 caption"
683 v-if="activity.dateOfEvent" 722 v-if="activity.dateOfEvent"
684 >{{moment(activity.dateOfEvent).format("DD MMMM, YYYY")}}</div> 723 >{{moment(activity.dateOfEvent).format("DD MMMM, YYYY")}}</div>
685 <div class="body-1" v-if="activity.title">{{activity.title}}</div> 724 <div class="body-1" v-if="activity.title">{{activity.title}}</div>
686 </div> 725 </div>
687 </div> 726 </div>
688 </div> 727 </div>
689 <div v-if="activityList.length == 0"> 728 <div v-if="activityList.length == 0">
690 <p class="text-center title grey lighten-4 error--text">No Data Found!</p> 729 <p class="text-center title grey lighten-4 error--text">No Data Found!</p>
691 </div> 730 </div>
692 </v-card-text> 731 </v-card-text>
693 732
694 <!-- ROLE IS NOT ADMIN --> 733 <!-- ROLE IS NOT ADMIN -->
695 <v-card-text v-if="$store.state.role != 'ADMIN'"> 734 <v-card-text v-if="$store.state.role != 'ADMIN'">
696 <v-card-title class="justify-center subheading font-weight-bold">Meeting Events</v-card-title> 735 <v-card-title class="justify-center subheading font-weight-bold">Meeting Events</v-card-title>
697 <div 736 <div
698 v-for="(activity,index) in activityList" 737 v-for="(activity,index) in activityList"
699 :key="index" 738 :key="index"
700 class="mt-2" 739 class="mt-2"
701 style="cursor: pointer;" 740 style="cursor: pointer;"
702 @click="seeEventDetails(activity)" 741 @click="seeEventDetails(activity)"
703 > 742 >
704 <span 743 <span
705 :style="{ 'background-color': colorsArray[index%colorsArray.length] }" 744 :style="{ 'background-color': colorsArray[index%colorsArray.length] }"
706 style="height: 12px;width: 12px;border-radius: 50%;display: inline-block;vertical-align: top;" 745 style="height: 12px;width: 12px;border-radius: 50%;display: inline-block;vertical-align: top;"
707 ></span> 746 ></span>
708 <div style="display: inline-block;" class="ml-2"> 747 <div style="display: inline-block;" class="ml-2">
709 <!-- MEETING EVENTS FOR PARENT --> 748 <!-- MEETING EVENTS FOR PARENT -->
710 <div v-if="$store.state.role === 'PARENT' "> 749 <div v-if="$store.state.role === 'PARENT' ">
711 <div 750 <div
712 class="grey--text lighten-1 caption" 751 class="grey--text lighten-1 caption"
713 v-if="activity.meetingEvent" 752 v-if="activity.meetingEvent"
714 >{{moment(activity.meetingEvent.dateOfEvent).format("DD MMMM, YYYY")}}</div> 753 >{{moment(activity.meetingEvent.dateOfEvent).format("DD MMMM, YYYY")}}</div>
715 <div 754 <div
716 class="body-2" 755 class="body-2"
717 v-if="activity.meetingEvent" 756 v-if="activity.meetingEvent"
718 >{{activity.meetingEvent.title}}</div> 757 >{{activity.meetingEvent.title}}</div>
719 </div> 758 </div>
720 759
721 <!-- MEETING EVENTS FOR TEACHER --> 760 <!-- MEETING EVENTS FOR TEACHER -->
722 <div v-if="role === 'TEACHER'"> 761 <div v-if="role === 'TEACHER'">
723 <div 762 <div
724 class="grey--text lighten-1 caption" 763 class="grey--text lighten-1 caption"
725 v-if="activity.dateOfEvent" 764 v-if="activity.dateOfEvent"
726 >{{moment(activity.dateOfEvent).format("DD MMMM, YYYY")}}</div> 765 >{{moment(activity.dateOfEvent).format("DD MMMM, YYYY")}}</div>
727 <div class="body-2" v-if="activity.title">{{activity.title}}</div> 766 <div class="body-2" v-if="activity.title">{{activity.title}}</div>
728 </div> 767 </div>
729 </div> 768 </div>
730 <div v-if="activityList.length == 0"> 769 <div v-if="activityList.length == 0">
731 <p class="text-center title grey lighten-4 error--text">No Data Found!</p> 770 <p class="text-center title grey lighten-4 error--text">No Data Found!</p>
732 </div> 771 </div>
733 </div> 772 </div>
734 </v-card-text> 773 </v-card-text>
735 </v-card> 774 </v-card>
736 </v-card-text> 775 </v-card-text>
737 </v-card> 776 </v-card>
738 </v-flex> 777 </v-flex>
739 </v-layout> 778 </v-layout>
740 779
741 <v-dialog v-model="dialog" max-width="500" persistent> 780 <v-dialog v-model="dialog" max-width="500" persistent>
742 <v-card color="grey lighten-4" flat> 781 <v-card color="grey lighten-4" flat>
743 <v-toolbar dark color="fixcolors"> 782 <v-toolbar dark color="fixcolors">
744 <v-spacer></v-spacer> 783 <v-spacer></v-spacer>
745 <v-btn icon @click="dialog= false"> 784 <v-btn icon @click="dialog= false">
746 <v-icon>close</v-icon> 785 <v-icon>close</v-icon>
747 </v-btn> 786 </v-btn>
748 </v-toolbar> 787 </v-toolbar>
749 <v-flex class="py-4"> 788 <v-flex class="py-4">
750 <v-list-tile> 789 <v-list-tile>
751 <v-list-tile-action> 790 <v-list-tile-action>
752 <v-icon>edit</v-icon> 791 <v-icon>edit</v-icon>
753 </v-list-tile-action> 792 </v-list-tile-action>
754 <v-list-tile-content> 793 <v-list-tile-content>
755 <v-list-tile-title>{{ selected.title }}</v-list-tile-title> 794 <v-list-tile-title>{{ selected.title }}</v-list-tile-title>
756 </v-list-tile-content> 795 </v-list-tile-content>
757 </v-list-tile> 796 </v-list-tile>
758 <v-list-tile> 797 <v-list-tile>
759 <v-list-tile-action> 798 <v-list-tile-action>
760 <v-icon>access_time</v-icon> 799 <v-icon>access_time</v-icon>
761 </v-list-tile-action> 800 </v-list-tile-action>
762 <v-list-tile-content> 801 <v-list-tile-content>
763 <v-list-tile-title>{{ date(selected.start)}}</v-list-tile-title> 802 <v-list-tile-title>{{ date(selected.start)}}</v-list-tile-title>
764 </v-list-tile-content> 803 </v-list-tile-content>
765 </v-list-tile> 804 </v-list-tile>
766 </v-flex> 805 </v-flex>
767 </v-card> 806 </v-card>
768 </v-dialog> 807 </v-dialog>
769 </v-app> 808 </v-app>
770 </template> 809 </template>
771 810
772 <script> 811 <script>
773 import http from "@/Services/http.js"; 812 import http from "@/Services/http.js";
774 import moment from "moment"; 813 import moment from "moment";
775 import AllApiCalls from "@/Services/AllApiCalls.js"; 814 import AllApiCalls from "@/Services/AllApiCalls.js";
776 import VueApexCharts from "vue-apexcharts"; 815 import VueApexCharts from "vue-apexcharts";
777 // import { FunctionalCalendar } from "vue-functional-calendar"; 816 // import { FunctionalCalendar } from "vue-functional-calendar";
778 817
779 export default { 818 export default {
780 components: { 819 components: {
781 apexcharts: VueApexCharts, 820 apexcharts: VueApexCharts,
782 }, 821 },
783 mixins: [AllApiCalls], 822 mixins: [AllApiCalls],
784 data() { 823 data() {
785 return { 824 return {
786 studentsData: [], 825 studentsData: [],
787 // data: { 826 // data: {
788 // clieckedToday: false 827 // clieckedToday: false
789 // }, 828 // },
790 // markedDates: ["16/4/2019", "18/4/2019", "20/4/2019", "21/4/2019"], 829 // markedDates: ["16/4/2019", "18/4/2019", "20/4/2019", "21/4/2019"],
791 // calendarData: {}, 830 // calendarData: {},
792 // calendar: {}, 831 // calendar: {},
793 832
794 // DIALOG BOX EVENT DETAILS 833 // DIALOG BOX EVENT DETAILS
795 tabs: [ 834 tabs: [
796 { name: "School Events", icon: "mdi-account" }, 835 { name: "School Events", icon: "mdi-account" },
797 { name: "Meeting Events", icon: "mdi-account-outline" }, 836 { name: "Meeting Events", icon: "mdi-account-outline" },
798 ], 837 ],
799 viewEventDetails: false, 838 viewEventDetails: false,
800 active: 0, 839 active: 0,
801 particularEvent: [], 840 particularEvent: [],
802 displayEventsList: [], 841 displayEventsList: [],
803 dialogSchoolEvents: [], 842 dialogSchoolEvents: [],
804 dialogMeetingEvents: [], 843 dialogMeetingEvents: [],
805 844
806 // apexCharts 845 // apexCharts
807 maleFemaleSeries: [], 846 maleFemaleSeries: [],
808 maleFemaleData: { 847 maleFemaleData: {
809 labels: ["Male", "Female"], 848 labels: ["Male", "Female"],
810 legend: { 849 legend: {
811 formatter: function (val, opts) { 850 formatter: function (val, opts) {
812 return val + " - " + opts.w.globals.series[opts.seriesIndex]; 851 return val + " - " + opts.w.globals.series[opts.seriesIndex];
813 }, 852 },
814 position: "bottom", 853 position: "bottom",
815 }, 854 },
816 dataLabels: { 855 dataLabels: {
817 enabled: true, 856 enabled: true,
818 formatter: function (val, opts) { 857 formatter: function (val, opts) {
819 return opts.w.globals.series[opts.seriesIndex]; 858 return opts.w.globals.series[opts.seriesIndex];
820 }, 859 },
821 }, 860 },
822 }, 861 },
823 862
824 // CALENDER 863 // CALENDER
825 moment: moment, 864 moment: moment,
826 activityEvents: [], 865 activityEvents: [],
827 onlineUser: [ 866 onlineUser: [
828 { 867 {
829 user: "Student Demo", 868 user: "Student Demo",
830 }, 869 },
831 { 870 {
832 user: "Teacher Demo", 871 user: "Teacher Demo",
833 }, 872 },
834 { 873 {
835 user: "Priyansh Gupta", 874 user: "Priyansh Gupta",
836 }, 875 },
837 { 876 {
838 user: "Gaurav Aggarwal", 877 user: "Gaurav Aggarwal",
839 }, 878 },
840 { 879 {
841 user: "Approve Arorra", 880 user: "Approve Arorra",
842 }, 881 },
843 ], 882 ],
844 showLoader: false, 883 showLoader: false,
845 calendarData: {}, 884 calendarData: {},
846 dialog: false, 885 dialog: false,
847 dialogNotice: false, 886 dialogNotice: false,
848 HolidaysList: [], 887 HolidaysList: [],
849 EventsList: [], 888 EventsList: [],
850 events: [], 889 events: [],
851 config: { 890 config: {
852 eventClick: (event) => { 891 eventClick: (event) => {
853 this.selected = event; 892 this.selected = event;
854 this.dialog = true; 893 this.dialog = true;
855 }, 894 },
856 }, 895 },
857 selected: {}, 896 selected: {},
858 barGraph: [], 897 barGraph: [],
859 // notice: {}, 898 // notice: {},
860 userData: {}, 899 userData: {},
861 dated: new Date(2018, 0, 9), 900 dated: new Date(2018, 0, 9),
862 userList: [], 901 userList: [],
863 sectionList: [], 902 sectionList: [],
864 students: "", 903 students: "",
865 parents: "", 904 parents: "",
866 teachers: "", 905 teachers: "",
867 classes: "", 906 classes: "",
868 noticeData: [], 907 noticeData: [],
869 expenseData: [], 908 expenseData: [],
870 feeData: [], 909 feeData: [],
871 collectionData: [], 910 collectionData: [],
872 courseData: [], 911 courseData: [],
873 912
874 annoucementData: [], 913 annoucementData: [],
875 role: "", 914 role: "",
876 attrs: [ 915 attrs: [
877 { 916 {
878 key: "today", 917 key: "today",
879 highlight: true, 918 highlight: true,
880 dates: new Date(), 919 dates: new Date(),
881 }, 920 },
882 ], 921 ],
883 drawer: true, 922 drawer: true,
884 items: [ 923 items: [
885 { title: "Home", icon: "dashboard" }, 924 { title: "Home", icon: "dashboard" },
886 { title: "About", icon: "question_answer" }, 925 { title: "About", icon: "question_answer" },
887 ], 926 ],
888 right: null, 927 right: null,
889 928
890 series: [ 929 series: [
891 { 930 {
892 name: "Total", 931 name: "Total",
893 data: [], 932 data: [],
894 }, 933 },
895 ], 934 ],
896 showChart: false, 935 showChart: false,
897 chartOptions: { 936 chartOptions: {
898 chart: { 937 chart: {
899 type: "bar", 938 type: "bar",
900 height: 150, 939 height: 150,
901 stacked: true, 940 stacked: true,
902 // animations: { 941 // animations: {
903 // enabled: true, 942 // enabled: true,
904 // easing: "easeinout", 943 // easing: "easeinout",
905 // speed: 1200, 944 // speed: 1200,
906 // animateGradually: { 945 // animateGradually: {
907 // enabled: true, 946 // enabled: true,
908 // delay: 450 947 // delay: 450
909 // }, 948 // },
910 // dynamicAnimation: { 949 // dynamicAnimation: {
911 // enabled: true, 950 // enabled: true,
912 // speed: 450 951 // speed: 450
913 // } 952 // }
914 // } 953 // }
915 }, 954 },
916 plotOptions: { 955 plotOptions: {
917 bar: { 956 bar: {
918 horizontal: false, 957 horizontal: false,
919 columnWidth: "25%", 958 columnWidth: "25%",
920 // endingShape: "rounded", 959 // endingShape: "rounded",
921 distributed: true, 960 distributed: true,
922 }, 961 },
923 }, 962 },
924 responsive: [ 963 responsive: [
925 { 964 {
926 breakpoint: 480, 965 breakpoint: 480,
927 options: { 966 options: {
928 legend: { 967 legend: {
929 position: "bottom", 968 position: "bottom",
930 offsetX: -10, 969 offsetX: -10,
931 offsetY: 0, 970 offsetY: 0,
932 }, 971 },
933 }, 972 },
934 }, 973 },
935 ], 974 ],
936 legend: { 975 legend: {
937 show: false, 976 show: false,
938 }, 977 },
939 colors: ["#7852cc", "#f9a825", "#ff8a89"], 978 colors: ["#7852cc", "#f9a825", "#ff8a89"],
940 dataLabels: { 979 dataLabels: {
941 enabled: false, 980 enabled: false,
942 }, 981 },
943 stroke: { 982 stroke: {
944 show: true, 983 show: true,
945 width: 2, 984 width: 2,
946 colors: ["transparent"], 985 colors: ["transparent"],
947 }, 986 },
948 xaxis: { 987 xaxis: {
949 categories: ["Fee", "Collections", "Expences"], 988 categories: ["Fee", "Collections", "Expences"],
950 }, 989 },
951 yaxis: { 990 yaxis: {
952 title: { 991 title: {
953 text: "", 992 text: "",
954 }, 993 },
955 }, 994 },
956 fill: { 995 fill: {
957 opacity: 1, 996 opacity: 1,
958 }, 997 },
959 tooltip: { 998 tooltip: {
960 y: { 999 y: {
961 formatter: function (val, opts) { 1000 formatter: function (val, opts) {
962 return "" + val + " "; 1001 return "" + val + " ";
963 }, 1002 },
964 }, 1003 },
965 }, 1004 },
966 }, 1005 },
967 1006
968 /* ROLE PARENT - ACTIVE STUDENTS */ 1007 /* ROLE PARENT - MY KIDS */
969 studentsData: [], 1008 studentsData: [],
970 activeStudent: {}, 1009 activeStudent: {},
971 activeStudentsList: [], 1010 activeStudentsList: [],
972 rowsPerPageItems: [2], 1011 rowsPerPageItems: [2],
973 pagination: { 1012 pagination: {
974 rowsPerPage: 2, 1013 rowsPerPage: 2,
975 }, 1014 },
976 1015
977 // LATEST ACTIVITY 1016 // LATEST ACTIVITY
978 colorsArray: ["#ff8a89", "#71d9ea", "#7852cc", "#F9A825"], 1017 colorsArray: ["#ff8a89", "#71d9ea", "#7852cc", "#F9A825"],
979 activityList: [], 1018 activityList: [],
980 }; 1019 };
981 }, 1020 },
982 1021
983 methods: { 1022 methods: {
984 test(e) { 1023 test(e) {
985 // console.log(" test - ", e); 1024 // console.log(" test - ", e);
986 }, 1025 },
987 1026
988 /*WHEN CALENDER IS CLICKED - DISPLAYS EVENTS IN DIALOG BOX */ 1027 /*WHEN CALENDER IS CLICKED - DISPLAYS EVENTS IN DIALOG BOX */
989 async handleDayChanged(e) { 1028 async handleDayChanged(e) {
990 // console.log("event calender - ", e); 1029 // console.log("event calender - ", e);
991 /*the list of events that will be used in dialog box to display events */ 1030 /*the list of events that will be used in dialog box to display events */
992 1031
993 this.dialogMeetingEvents = []; 1032 this.dialogMeetingEvents = [];
994 this.dialogSchoolEvents = []; 1033 this.dialogSchoolEvents = [];
995 1034
996 for (var i = 0; i < e.events.length; i++) { 1035 for (var i = 0; i < e.events.length; i++) {
997 if (e.events[i].eventType == "meetingEvent") { 1036 if (e.events[i].eventType == "meetingEvent") {
998 let meetingEventResponse = await this.getParticularMeetingEvent({ 1037 let meetingEventResponse = await this.getParticularMeetingEvent({
999 meetingEventId: e.events[i]._id, 1038 meetingEventId: e.events[i]._id,
1000 }); 1039 });
1001 this.dialogMeetingEvents.push(meetingEventResponse.data.data); 1040 this.dialogMeetingEvents.push(meetingEventResponse.data.data);
1002 } 1041 }
1003 if (e.events[i].eventType == "schoolEvent") { 1042 if (e.events[i].eventType == "schoolEvent") {
1004 let schoolEventResponse = await this.getParticularSchoolEvent({ 1043 let schoolEventResponse = await this.getParticularSchoolEvent({
1005 schoolEventId: e.events[i]._id, 1044 schoolEventId: e.events[i]._id,
1006 }); 1045 });
1007 this.dialogSchoolEvents.push(schoolEventResponse.data.data); 1046 this.dialogSchoolEvents.push(schoolEventResponse.data.data);
1008 } 1047 }
1009 } 1048 }
1010 /* Opens the dialog box */ 1049 /* Opens the dialog box */
1011 this.viewEventDetails = true; 1050 this.viewEventDetails = true;
1012 }, 1051 },
1013 1052
1014 /* see meeting events, school events individually (when calender is not clicked) */ 1053 /* see meeting events, school events individually (when calender is not clicked) */
1015 async seeEventDetails(activity, message) { 1054 async seeEventDetails(activity, message) {
1016 // if (this.$store.state.role === "TEACHER") { 1055 // if (this.$store.state.role === "TEACHER") {
1017 // let response = await this.getParticularMeetingEvent({ 1056 // let response = await this.getParticularMeetingEvent({
1018 // meetingEventId: activity._id, 1057 // meetingEventId: activity._id,
1019 // }); 1058 // });
1020 // this.displayEventsList = []; 1059 // this.displayEventsList = [];
1021 // this.displayEventsList.push(response.data.data); 1060 // this.displayEventsList.push(response.data.data);
1022 // this.viewEventDetails = true; 1061 // this.viewEventDetails = true;
1023 // } 1062 // }
1024 if (this.$store.state.role === "PARENT") { 1063 if (this.$store.state.role === "PARENT") {
1025 if (message == "schoolEvent") { 1064 if (message == "schoolEvent") {
1026 let response = await this.getParticularSchoolEvent({ 1065 let response = await this.getParticularSchoolEvent({
1027 schoolEventId: activity._id, 1066 schoolEventId: activity._id,
1028 }); 1067 });
1029 this.displayEventsList = []; 1068 this.displayEventsList = [];
1030 this.displayEventsList.push(response.data.data); 1069 this.displayEventsList.push(response.data.data);
1031 } else { 1070 } else {
1032 let response = await this.getParticularMeetingEvent({ 1071 let response = await this.getParticularMeetingEvent({
1033 meetingEventId: activity.meetingEvent._id, 1072 meetingEventId: activity.meetingEvent._id,
1034 }); 1073 });
1035 this.displayEventsList = []; 1074 this.displayEventsList = [];
1036 this.displayEventsList.push(response.data.data); 1075 this.displayEventsList.push(response.data.data);
1037 } 1076 }
1038 this.viewEventDetails = true; 1077 this.viewEventDetails = true;
1039 } 1078 }
1040 if ( 1079 if (
1041 this.$store.state.role === "ADMIN" || 1080 this.$store.state.role === "ADMIN" ||
1042 this.$store.state.role === "TEACHER" 1081 this.$store.state.role === "TEACHER"
1043 ) { 1082 ) {
1044 if (message == "schoolEvent") { 1083 if (message == "schoolEvent") {
1045 let response = await this.getParticularSchoolEvent({ 1084 let response = await this.getParticularSchoolEvent({
1046 schoolEventId: activity._id, 1085 schoolEventId: activity._id,
1047 }); 1086 });
1048 this.displayEventsList = []; 1087 this.displayEventsList = [];
1049 this.displayEventsList.push(response.data.data); 1088 this.displayEventsList.push(response.data.data);
1050 } else { 1089 } else {
1051 let response = await this.getParticularMeetingEvent({ 1090 let response = await this.getParticularMeetingEvent({
1052 meetingEventId: activity._id, 1091 meetingEventId: activity._id,
1053 }); 1092 });
1054 this.displayEventsList = []; 1093 this.displayEventsList = [];
1055 this.displayEventsList.push(response.data.data); 1094 this.displayEventsList.push(response.data.data);
1056 } 1095 }
1057 this.viewEventDetails = true; 1096 this.viewEventDetails = true;
1058 } 1097 }
1059 }, 1098 },
1060 async routeToCourseDetails(courseId) { 1099 async routeToCourseDetails(courseId) {
1061 /* getParticularCourseDetail- To get courseDetail - defined in GetApis.js*/ 1100 /* getParticularCourseDetail- To get courseDetail - defined in GetApis.js*/
1062 let response = await this.getParticularCourseDetail(courseId); 1101 let response = await this.getParticularCourseDetail(courseId);
1063 1102
1064 /* If the response is null then dont route */ 1103 /* If the response is null then dont route */
1065 if (response.data.data.length > 0) { 1104 if (response.data.data.length > 0) {
1066 this.$router.push({ 1105 this.$router.push({
1067 name: "Course Details", 1106 name: "Course Details",
1068 query: { courseId: courseId }, 1107 query: { courseId: courseId },
1069 }); 1108 });
1070 } else { 1109 } else {
1071 this.seeSnackbar("No Data Available", "warning"); 1110 this.seeSnackbar("No Data Available", "warning");
1072 } 1111 }
1073 }, 1112 },
1074 1113
1075 closeNotice() { 1114 closeNotice() {
1076 this.dialogNotice = false; 1115 this.dialogNotice = false;
1077 }, 1116 },
1078 profile() { 1117 profile() {
1079 // this.editedIndex = this.desserts.indexOf(item); 1118 // this.editedIndex = this.desserts.indexOf(item);
1080 // this.notice = Object.assign({}, item); 1119 // this.notice = Object.assign({}, item);
1081 // this.dialogNotice = true; 1120 // this.dialogNotice = true;
1082 this.$router.push("/noticeBoard"); 1121 this.$router.push("/noticeBoard");
1083 }, 1122 },
1084 date: function (date) { 1123 date: function (date) {
1085 return moment(date).format("MMMM DD, YYYY HH:mm"); 1124 return moment(date).format("MMMM DD, YYYY HH:mm");
1086 }, 1125 },
1087 activityDate(date) { 1126 activityDate(date) {
1088 return moment(date).format("MMMM DD, YYYY"); 1127 return moment(date).format("MMMM DD, YYYY");
1089 }, 1128 },
1090 refreshEvents() { 1129 refreshEvents() {
1091 this.$refs.calendar.$emit("refetch-events"); 1130 this.$refs.calendar.$emit("refetch-events");
1092 }, 1131 },
1093 removeEvent() { 1132 removeEvent() {
1094 this.$refs.calendar.$emit("remove-event", this.selected); 1133 this.$refs.calendar.$emit("remove-event", this.selected);
1095 this.selected = {}; 1134 this.selected = {};
1096 }, 1135 },
1097 eventSelected(event) { 1136 eventSelected(event) {
1098 this.selected = event; 1137 this.selected = event;
1099 }, 1138 },
1100 // eventDropStart: function(event) { 1139 // eventDropStart: function(event) {
1101 // event.editable = false; 1140 // event.editable = false;
1102 // }, 1141 // },
1103 eventCreated(...test) { 1142 eventCreated(...test) {
1104 // console.log(test); 1143 // console.log(test);
1105 }, 1144 },
1106 getStudents() { 1145 getStudents() {
1107 http() 1146 http()
1108 .get("/getStudentsList") 1147 .get("/getStudentsList")
1109 .then((response) => { 1148 .then((response) => {
1110 this.students = response.data.data; 1149 this.students = response.data.data;
1111 this.showLoader = false; 1150 this.showLoader = false;
1112 }) 1151 })
1113 .catch((error) => { 1152 .catch((error) => {
1114 // console.log("err====>", err); 1153 // console.log("err====>", err);
1115 this.showLoader = false; 1154 this.showLoader = false;
1116 if (error.response.status === 401) { 1155 if (error.response.status === 401) {
1117 this.$router.replace({ path: "/" }); 1156 this.$router.replace({ path: "/" });
1118 this.$store.dispatch("setToken", null); 1157 this.$store.dispatch("setToken", null);
1119 this.$store.dispatch("Id", null); 1158 this.$store.dispatch("Id", null);
1120 } 1159 }
1121 }); 1160 });
1122 }, 1161 },
1123 getParents() { 1162 getParents() {
1124 http() 1163 http()
1125 .get("/getParentsList") 1164 .get("/getParentsList")
1126 .then((response) => { 1165 .then((response) => {
1127 this.parents = response.data.data; 1166 this.parents = response.data.data;
1128 this.showLoader = false; 1167 this.showLoader = false;
1129 }) 1168 })
1130 .catch((error) => { 1169 .catch((error) => {
1131 // console.log("err====>", err); 1170 // console.log("err====>", err);
1132 this.showLoader = false; 1171 this.showLoader = false;
1133 }); 1172 });
1134 }, 1173 },
1135 getTeachers() { 1174 getTeachers() {
1136 http() 1175 http()
1137 .get("/getTeachersList") 1176 .get("/getTeachersList")
1138 .then((response) => { 1177 .then((response) => {
1139 this.teachers = response.data.data; 1178 this.teachers = response.data.data;
1140 this.showLoader = false; 1179 this.showLoader = false;
1141 }) 1180 })
1142 .catch((error) => { 1181 .catch((error) => {
1143 // console.log("err====>", err); 1182 // console.log("err====>", err);
1144 this.showLoader = false; 1183 this.showLoader = false;
1145 }); 1184 });
1146 }, 1185 },
1147 getClasses() { 1186 getClasses() {
1148 http() 1187 http()
1149 .get("/getClassesList") 1188 .get("/getClassesList")
1150 .then((response) => { 1189 .then((response) => {
1151 this.classes = response.data.data; 1190 this.classes = response.data.data;
1152 this.showLoader = false; 1191 this.showLoader = false;
1153 }) 1192 })
1154 .catch((error) => { 1193 .catch((error) => {
1155 this.showLoader = false; 1194 this.showLoader = false;
1156 }); 1195 });
1157 }, 1196 },
1158 getNoticeData() { 1197 getNoticeData() {
1159 this.showLoader = true; 1198 this.showLoader = true;
1160 http() 1199 http()
1161 .get("/getEventsList") 1200 .get("/getEventsList")
1162 .then((response) => { 1201 .then((response) => {
1163 this.noticeData = response.data.data; 1202 this.noticeData = response.data.data;
1164 this.showLoader = false; 1203 this.showLoader = false;
1165 }) 1204 })
1166 .catch((error) => { 1205 .catch((error) => {
1167 this.showLoader = false; 1206 this.showLoader = false;
1168 }); 1207 });
1169 }, 1208 },
1170 getUserData() { 1209 getUserData() {
1171 // this.showLoader = true; 1210 // this.showLoader = true;
1172 if (this.$store.state.role === "PARENT") { 1211 if (this.$store.state.role === "PARENT") {
1173 http() 1212 http()
1174 .get("/getParticularUserDetail", { 1213 .get("/getParticularUserDetail", {
1175 params: { 1214 params: {
1176 studentId: localStorage.getItem("parentStudentId"), 1215 studentId: localStorage.getItem("parentStudentId"),
1177 }, 1216 },
1178 }) 1217 })
1179 .then((response) => { 1218 .then((response) => {
1180 this.userData = response.data.data; 1219 this.userData = response.data.data;
1181 this.showLoader = false; 1220 this.showLoader = false;
1182 }) 1221 })
1183 .catch((error) => { 1222 .catch((error) => {
1184 this.showLoader = false; 1223 this.showLoader = false;
1185 }); 1224 });
1186 } else { 1225 } else {
1187 http() 1226 http()
1188 .get("/getParticularUserDetail") 1227 .get("/getParticularUserDetail")
1189 .then((response) => { 1228 .then((response) => {
1190 this.userData = response.data.data; 1229 this.userData = response.data.data;
1191 this.showLoader = false; 1230 this.showLoader = false;
1192 }) 1231 })
1193 .catch((error) => { 1232 .catch((error) => {
1194 this.showLoader = false; 1233 this.showLoader = false;
1195 }); 1234 });
1196 } 1235 }
1197 }, 1236 },
1198 1237
1199 getFeesAndCollectionsData() { 1238 getFeesAndCollectionsData() {
1200 http() 1239 http()
1201 .get("/getTotalFeesAndCollections") 1240 .get("/getTotalFeesAndCollections")
1202 .then((response) => { 1241 .then((response) => {
1203 this.feeData = response.data.data; 1242 this.feeData = response.data.data;
1204 // this.collectionData = response.data.data; 1243 // this.collectionData = response.data.data;
1205 this.series[0].data[0] = this.feeData.totalFees; 1244 this.series[0].data[0] = this.feeData.totalFees;
1206 this.series[0].data[1] = this.feeData.totalCollection; 1245 this.series[0].data[1] = this.feeData.totalCollection;
1207 this.showLoader = false; 1246 this.showLoader = false;
1208 }) 1247 })
1209 .catch((error) => { 1248 .catch((error) => {
1210 this.showLoader = false; 1249 this.showLoader = false;
1211 }); 1250 });
1212 }, 1251 },
1213 getExpensesData() { 1252 getExpensesData() {
1214 http() 1253 http()
1215 .get("/getTotalExpenses") 1254 .get("/getTotalExpenses")
1216 .then((response) => { 1255 .then((response) => {
1217 this.expenseData = response.data.data; 1256 this.expenseData = response.data.data;
1218 // var array = response.data.data.sum; 1257 // var array = response.data.data.sum;
1219 this.series[0].data[2] = this.expenseData.sum; 1258 this.series[0].data[2] = this.expenseData.sum;
1220 this.showChart = true; 1259 this.showChart = true;
1221 // this.series = [ 1260 // this.series = [
1222 // { 1261 // {
1223 // name: "Total", 1262 // name: "Total",
1224 // data: array 1263 // data: array
1225 // } 1264 // }
1226 // ]; 1265 // ];
1227 this.showLoader = false; 1266 this.showLoader = false;
1228 }) 1267 })
1229 .catch((error) => { 1268 .catch((error) => {
1230 this.showLoader = false; 1269 this.showLoader = false;
1231 }); 1270 });
1232 }, 1271 },
1233 // async getparentStudents() { 1272 // async getparentStudents() {
1234 // this.showLoader = true; 1273 // this.showLoader = true;
1235 // await http() 1274 // await http()
1236 // .get("/parentStudentsList") 1275 // .get("/parentStudentsList")
1237 // .then((response) => { 1276 // .then((response) => {
1238 1277
1239 // /* set values in local storage */ 1278 // /* set values in local storage */
1240 // this.studentsData = response.data.data.students; 1279 // this.studentsData = response.data.data.students;
1241 // this.showLoader = false; 1280 // this.showLoader = false;
1242 // }) 1281 // })
1243 // .catch((err) => { 1282 // .catch((err) => {
1244 // console.log("err====>", err); 1283 // console.log("err====>", err);
1245 // this.showLoader = false; 1284 // this.showLoader = false;
1246 // }); 1285 // });
1247 // await this.getCourses(parentStudentsId, classId); 1286 // await this.getCourses(parentStudentsId, classId);
1248 // await this.getAnnoucementes(classId); 1287 // await this.getAnnoucementes(classId);
1249 // }, 1288 // },
1250 async getCourses(parentStudentsId, classId) { 1289 async getCourses(parentStudentsId, classId) {
1251 /* getStudentCourses - to get courseData - defined in GetApis.js*/ 1290 /* getStudentCourses - to get courseData - defined in GetApis.js*/
1252 await this.getStudentCourses({ 1291 await this.getStudentCourses({
1253 classId: localStorage.getItem("parentClassId"), 1292 classId: localStorage.getItem("parentClassId"),
1254 studentId: localStorage.getItem("parentStudentId"), 1293 studentId: localStorage.getItem("parentStudentId"),
1255 }); 1294 });
1256 }, 1295 },
1257 getAnnoucementes(classId) { 1296 getAnnoucementes(classId) {
1258 this.showLoader = true; 1297 this.showLoader = true;
1259 http() 1298 http()
1260 .get("/getAnnoucementesList", { 1299 .get("/getAnnoucementesList", {
1261 params: { 1300 params: {
1262 classId: localStorage.getItem("parentClassId"), 1301 classId: localStorage.getItem("parentClassId"),
1263 }, 1302 },
1264 }) 1303 })
1265 .then((response) => { 1304 .then((response) => {
1266 this.annoucementData = response.data.data; 1305 this.annoucementData = response.data.data;
1267 console.log("avnn - ", this.annoucementData); 1306 console.log("avnn - ", this.annoucementData);
1268 this.showLoader = false; 1307 this.showLoader = false;
1269 }) 1308 })
1270 .catch((err) => { 1309 .catch((err) => {
1271 // console.log("err====>", err); 1310 // console.log("err====>", err);
1272 this.showLoader = false; 1311 this.showLoader = false;
1273 this.snackbar = true; 1312 this.snackbar = true;
1274 this.color = "error"; 1313 this.color = "error";
1275 this.text = error.response.data.message; 1314 this.text = error.response.data.message;
1276 }); 1315 });
1277 }, 1316 },
1278 1317
1279 /* MEETING EVENTS, SCHOOL EVENTS */ 1318 /* MEETING EVENTS, SCHOOL EVENTS */
1280 async getMeetingEventes() { 1319 async getMeetingEventes() {
1281 if (this.role == "TEACHER" || this.role === "ADMIN") { 1320 if (this.role == "TEACHER" || this.role === "ADMIN") {
1282 this.showLoader = true; 1321 this.showLoader = true;
1283 await http() 1322 await http()
1284 .get("/getMeetingEventesList") 1323 .get("/getMeetingEventesList")
1285 .then((response) => { 1324 .then((response) => {
1286 var activityList = response.data.data; 1325 var activityList = response.data.data;
1287 this.activityList = activityList; 1326 this.activityList = activityList;
1288 this.showLoader = false; 1327 this.showLoader = false;
1289 1328
1290 /* set meetingEvents in activityEvents array to highlight event dates in calender */ 1329 /* set meetingEvents in activityEvents array to highlight event dates in calender */
1291 for (var i = 0; i < this.activityList.length; i++) { 1330 for (var i = 0; i < this.activityList.length; i++) {
1292 let obj = {}; 1331 let obj = {};
1293 obj.date = moment(this.activityList[i].dateOfEvent).format( 1332 obj.date = moment(this.activityList[i].dateOfEvent).format(
1294 "YYYY/MM/DD" 1333 "YYYY/MM/DD"
1295 ); 1334 );
1296 obj.title = this.activityList[i].title; 1335 obj.title = this.activityList[i].title;
1297 obj._id = this.activityList[i]._id; 1336 obj._id = this.activityList[i]._id;
1298 obj.eventType = "meetingEvent"; 1337 obj.eventType = "meetingEvent";
1299 /* activityEvents is an array used to display events in calender on particular dates */ 1338 /* activityEvents is an array used to display events in calender on particular dates */
1300 this.activityEvents.push(obj); 1339 this.activityEvents.push(obj);
1301 } 1340 }
1302 }) 1341 })
1303 .catch((error) => { 1342 .catch((error) => {
1304 this.showLoader = false; 1343 this.showLoader = false;
1305 }); 1344 });
1306 } 1345 }
1307 /* If role is ADMIN,TEACHER, PARENT then school events need to be displayed too */ 1346 /* If role is ADMIN,TEACHER, PARENT then school events need to be displayed too */
1308 if ( 1347 if (
1309 this.role === "ADMIN" || 1348 this.role === "ADMIN" ||
1310 this.role === "TEACHER" || 1349 this.role === "TEACHER" ||
1311 this.role === "PARENT" 1350 this.role === "PARENT"
1312 ) { 1351 ) {
1313 /* this will get data in a "schoolEvents" data property */ 1352 /* this will get data in a "schoolEvents" data property */
1314 await this.getSchoolEventsList(); 1353 await this.getSchoolEventsList();
1315 /* set schoolEvents in activityEvents array to highlight event dates in calender */ 1354 /* set schoolEvents in activityEvents array to highlight event dates in calender */
1316 for (var i = 0; i < this.schoolEvents.length; i++) { 1355 for (var i = 0; i < this.schoolEvents.length; i++) {
1317 let obj = {}; 1356 let obj = {};
1318 obj.date = moment(this.schoolEvents[i].dateOfEvent).format( 1357 obj.date = moment(this.schoolEvents[i].dateOfEvent).format(
1319 "YYYY/MM/DD" 1358 "YYYY/MM/DD"
1320 ); 1359 );
1321 obj.title = this.schoolEvents[i].title; 1360 obj.title = this.schoolEvents[i].title;
1322 obj._id = this.schoolEvents[i]._id; 1361 obj._id = this.schoolEvents[i]._id;
1323 obj.eventType = "schoolEvent"; 1362 obj.eventType = "schoolEvent";
1324 /* activityEvents is an array used to display events in calender on particular dates */ 1363 /* activityEvents is an array used to display events in calender on particular dates */
1325 this.activityEvents.push(obj); 1364 this.activityEvents.push(obj);
1326 } 1365 }
1327 } 1366 }
1328 }, 1367 },
1329 async getMaleFemaleData() { 1368 async getMaleFemaleData() {
1330 await http() 1369 await http()
1331 .get("/getStudentsByGender") 1370 .get("/getStudentsByGender")
1332 .then((response) => { 1371 .then((response) => {
1333 console.log("gender response - ", response); 1372 console.log("gender response - ", response);
1334 for (var i = 0; i < response.data.data.length; i++) { 1373 for (var i = 0; i < response.data.data.length; i++) {
1335 if (response.data.data[i]._id == "male") { 1374 if (response.data.data[i]._id == "male") {
1336 this.maleFemaleSeries.push(response.data.data[i].total); 1375 this.maleFemaleSeries.push(response.data.data[i].total);
1337 } 1376 }
1338 if (response.data.data[i]._id == "female") { 1377 if (response.data.data[i]._id == "female") {
1339 this.maleFemaleSeries.push(response.data.data[i].total); 1378 this.maleFemaleSeries.push(response.data.data[i].total);
1340 } 1379 }
1341 } 1380 }
1342 }) 1381 })
1343 .catch((error) => { 1382 .catch((error) => {
1344 this.showLoader = false; 1383 this.showLoader = false;
1345 }); 1384 });
1346 }, 1385 },
1347 }, 1386 },
1348 1387
1349 mounted() { 1388 mounted() {
1350 // = this.$store.state.schoolToken; 1389 // = this.$store.state.schoolToken;
1351 // console.log("this.$store.state.role", this.token); 1390 // console.log("this.$store.state.role", this.token);
1352 // this.getUsersList(); 1391 // this.getUsersList();
1353 }, 1392 },
1354 1393
1355 async created() { 1394 async created() {
1356 if (this.$store.state.role === "ADMIN") { 1395 if (this.$store.state.role === "ADMIN") {
1357 // this.token = this.$store.state.token; 1396 // this.token = this.$store.state.token;
1358 await this.getFeesAndCollectionsData(); 1397 await this.getFeesAndCollectionsData();
1359 await this.getExpensesData(); 1398 await this.getExpensesData();
1360 await this.getMaleFemaleData(); 1399 await this.getMaleFemaleData();
1361 } else if (this.$store.state.schoolRole === "SUPERADMIN") { 1400 } else if (this.$store.state.schoolRole === "SUPERADMIN") {
1362 // this.token = this.$store.state.schoolToken; 1401 // this.token = this.$store.state.schoolToken;
1363 await this.getFeesAndCollectionsData(); 1402 await this.getFeesAndCollectionsData();
1364 await this.getExpensesData(); 1403 await this.getExpensesData();
1365 await this.getMaleFemaleData(); 1404 await this.getMaleFemaleData();
1366 } else if (this.$store.state.role === "TEACHER") { 1405 } else if (this.$store.state.role === "TEACHER") {
1367 // this.token = this.$store.state.token; 1406 // this.token = this.$store.state.token;
1368 await this.getMaleFemaleData(); 1407 await this.getMaleFemaleData();
1369 } else if (this.$store.state.role === "ACCOUNTANT") { 1408 } else if (this.$store.state.role === "ACCOUNTANT") {
1370 // this.token = this.$store.state.token; 1409 // this.token = this.$store.state.token;
1371 } else if (this.$store.state.role === "LIBRARIAN") { 1410 } else if (this.$store.state.role === "LIBRARIAN") {
1372 // this.token = this.$store.state.token; 1411 // this.token = this.$store.state.token;
1373 } else if (this.$store.state.role === "PARENT") { 1412 } else if (this.$store.state.role === "PARENT") {
1374 await this.getCourses(); 1413 await this.getCourses();
1375 await this.getAnnoucementes(); 1414 await this.getAnnoucementes();
1376 this.studentsData = this.$store.getters.GET_STUDENTS_DATA; 1415 this.studentsData = this.$store.getters.GET_STUDENTS_DATA;
1377 this.activeStudent = this.$store.getters.GET_ACTIVE_STUDENT; 1416 this.activeStudent = this.$store.getters.GET_ACTIVE_STUDENT;
1378 /* MAKE A LIST OF STUDENTS WITH STATUS TRUE, FOR DISPLAYING STUDENTS DATA AT TOP */ 1417 /* MAKE A LIST OF STUDENTS WITH STATUS TRUE, FOR DISPLAYING STUDENTS DATA AT TOP */
1379 for (var i = 0; i < this.studentsData.length; i++) { 1418 for (var i = 0; i < this.studentsData.length; i++) {
1380 if (this.studentsData[i].status == true) { 1419 if (this.studentsData[i].status == true) {
1381 this.activeStudentsList.push(this.studentsData[i]); 1420 this.activeStudentsList.push(this.studentsData[i]);
1382 } 1421 }
1383 } 1422 }
1384 console.log("student list - ", this.activeStudentsList); 1423 console.log("student list - ", this.activeStudentsList);
1385 console.log("active - ", this.activeStudent); 1424 console.log("active - ", this.activeStudent);
1386 } 1425 }
1387 this.role = this.$store.state.role; 1426 this.role = this.$store.state.role;
1388 1427
1389 await this.getStudents(); 1428 await this.getStudents();
1390 await this.getTeachers(); 1429 await this.getTeachers();
1391 await this.getParents(); 1430 await this.getParents();
1392 await this.getClasses(); 1431 await this.getClasses();
1393 await this.getNoticeData(); 1432 await this.getNoticeData();
1394 await this.getUserData(); 1433 await this.getUserData();
1395 1434
1396 /* get Latest events list for student login*/ 1435 /* get Latest events list for student login*/
1397 if (this.$store.state.role == "PARENT") { 1436 if (this.$store.state.role == "PARENT") {
1398 let response = await this.studentMeetingEvents({ 1437 let response = await this.studentMeetingEvents({
1399 studentId: localStorage.getItem("parentStudentId"), 1438 studentId: localStorage.getItem("parentStudentId"),
1400 }); 1439 });
1401 this.activityList = response.data.data; 1440 this.activityList = response.data.data;
1402 1441
1403 /* set activityEvents array to highlight event dates in calender */ 1442 /* set activityEvents array to highlight event dates in calender */
1404 for (var i = 0; i < this.activityList.length; i++) { 1443 for (var i = 0; i < this.activityList.length; i++) {
1405 let obj = {}; 1444 let obj = {};
1406 obj.date = moment(this.activityList[i].meetingEvent.dateOfEvent).format( 1445 obj.date = moment(this.activityList[i].meetingEvent.dateOfEvent).format(
1407 "YYYY/MM/DD" 1446 "YYYY/MM/DD"
1408 ); 1447 );
1409 obj.title = this.activityList[i].meetingEvent.title; 1448 obj.title = this.activityList[i].meetingEvent.title;
1410 obj._id = this.activityList[i].meetingEvent._id; 1449 obj._id = this.activityList[i].meetingEvent._id;
1411 obj.eventType = "meetingEvent"; 1450 obj.eventType = "meetingEvent";
1412 this.activityEvents.push(obj); 1451 this.activityEvents.push(obj);
1413 } 1452 }
1414 } 1453 }
1415 1454
1416 /* get Latest events list for teacher login*/ 1455 /* get Latest events list for teacher login*/
1417 if ( 1456 if (
1418 this.role == "TEACHER" || 1457 this.role == "TEACHER" ||
1419 this.role == "ADMIN" || 1458 this.role == "ADMIN" ||
1420 this.role == "PARENT" 1459 this.role == "PARENT"
1421 ) { 1460 ) {
1422 await this.getMeetingEventes(); 1461 await this.getMeetingEventes();
1423 } 1462 }
1424 }, 1463 },
1425 }; 1464 };
1426 </script> 1465 </script>