viithiisys / School-Management-dashboard

Download as
Browse Code ยป

Commit 9d0f438058f40e3eb91ab511d318160dd06f4549

Authored by Shikha Mishra
1 parent b372c241b2
Exists in master and in 2 other branches amber-development, ui-design

show list of added while adding time table and routine

Showing 2 changed files with 43 additions and 3 deletions   Show diff stats
src/pages/Academic/routine.vue
Diff comments   View file @9d0f438
1 <template> 1 <template>
2 <v-container fluid class="body-color"> 2 <v-container fluid class="body-color">
3 <!-- ****** EDIT Subject ****** --> 3 <!-- ****** EDIT Subject ****** -->
4 <v-dialog v-model="editRoutineDialog" max-width="600px" persistent> 4 <v-dialog v-model="editRoutineDialog" max-width="600px" persistent>
5 <v-card flat class="card-style pa-2" dark> 5 <v-card flat class="card-style pa-2" dark>
6 <v-layout> 6 <v-layout>
7 <v-flex xs12> 7 <v-flex xs12>
8 <label class="title text-xs-center">Edit Routine</label> 8 <label class="title text-xs-center">Edit Routine</label>
9 <v-icon size="24" class="right" @click="editRoutineDialog = false">cancel</v-icon> 9 <v-icon size="24" class="right" @click="editRoutineDialog = false">cancel</v-icon>
10 </v-flex> 10 </v-flex>
11 </v-layout> 11 </v-layout>
12 <v-container fluid> 12 <v-container fluid>
13 <v-form ref="formEditRoutine" v-model="validEditRoutine" lazy-validation> 13 <v-form ref="formEditRoutine" v-model="validEditRoutine" lazy-validation>
14 <v-layout> 14 <v-layout>
15 <v-flex xs3 sm4 class="pt-4 subheading"> 15 <v-flex xs3 sm4 class="pt-4 subheading">
16 <label class="right">Class :</label> 16 <label class="right">Class :</label>
17 </v-flex> 17 </v-flex>
18 <v-flex xs8 sm8 class="ml-2"> 18 <v-flex xs8 sm8 class="ml-2">
19 <v-select 19 <v-select
20 :items="classList" 20 :items="classList"
21 label="Select your Class" 21 label="Select your Class"
22 v-model="editedItem.classId" 22 v-model="editedItem.classId"
23 item-text="classNum" 23 item-text="classNum"
24 item-value="_id" 24 item-value="_id"
25 :rules="classRules" 25 :rules="classRules"
26 @change="getClassSubject(editedItem.classId)" 26 @change="getClassSubject(editedItem.classId)"
27 required 27 required
28 ></v-select> 28 ></v-select>
29 </v-flex> 29 </v-flex>
30 </v-layout> 30 </v-layout>
31 <v-layout> 31 <v-layout>
32 <v-flex xs3 sm4 class="pt-4 subheading"> 32 <v-flex xs3 sm4 class="pt-4 subheading">
33 <label class="right">Subject :</label> 33 <label class="right">Subject :</label>
34 </v-flex> 34 </v-flex>
35 <v-flex xs8 sm8 class="ml-2"> 35 <v-flex xs8 sm8 class="ml-2">
36 <v-select 36 <v-select
37 :items="subjectList.subjects" 37 :items="subjectList.subjects"
38 label="Select your subject" 38 label="Select your subject"
39 v-model="editedItem.subjectName" 39 v-model="editedItem.subjectName"
40 item-text="subjectName" 40 item-text="subjectName"
41 item-value="_id" 41 item-value="_id"
42 :rules="subjectRules" 42 :rules="subjectRules"
43 required 43 required
44 ></v-select> 44 ></v-select>
45 </v-flex> 45 </v-flex>
46 </v-layout> 46 </v-layout>
47 <v-layout> 47 <v-layout>
48 <v-flex xs4 sm4 class="pt-4 subheading"> 48 <v-flex xs4 sm4 class="pt-4 subheading">
49 <label class="right">Teacher Name :</label> 49 <label class="right">Teacher Name :</label>
50 </v-flex> 50 </v-flex>
51 <v-flex xs8 sm8 class="ml-3"> 51 <v-flex xs8 sm8 class="ml-3">
52 <v-select 52 <v-select
53 :items="teacherList" 53 :items="teacherList"
54 label="Select your teacher" 54 label="Select your teacher"
55 v-model="editedItem.teacherId" 55 v-model="editedItem.teacherId"
56 item-text="name" 56 item-text="name"
57 item-value="_id" 57 item-value="_id"
58 :rules="teacherRules" 58 :rules="teacherRules"
59 required 59 required
60 ></v-select> 60 ></v-select>
61 </v-flex> 61 </v-flex>
62 </v-layout> 62 </v-layout>
63 <v-layout> 63 <v-layout>
64 <v-flex xs5 sm4 class="pt-4 subheading"> 64 <v-flex xs5 sm4 class="pt-4 subheading">
65 <label class="right">Starting time:</label> 65 <label class="right">Starting time:</label>
66 </v-flex> 66 </v-flex>
67 <v-flex xs7 sm6 class="ml-3"> 67 <v-flex xs7 sm6 class="ml-3">
68 <v-menu 68 <v-menu
69 ref="menuC" 69 ref="menuC"
70 :close-on-content-click="false" 70 :close-on-content-click="false"
71 v-model="menu4" 71 v-model="menu4"
72 :nudge-right="40" 72 :nudge-right="40"
73 lazy 73 lazy
74 transition="scale-transition" 74 transition="scale-transition"
75 offset-y 75 offset-y
76 full-width 76 full-width
77 max-width="290px" 77 max-width="290px"
78 min-width="290px" 78 min-width="290px"
79 > 79 >
80 <v-text-field 80 <v-text-field
81 slot="activator" 81 slot="activator"
82 v-model="editedItem.startingTime" 82 v-model="editedItem.startingTime"
83 placeholder="Select your starting time" 83 placeholder="Select your starting time"
84 append-icon="access_time" 84 append-icon="access_time"
85 readonly 85 readonly
86 ></v-text-field> 86 ></v-text-field>
87 <v-time-picker v-model="editedItem.startingTime" @change="menu4= false"></v-time-picker> 87 <v-time-picker v-model="editedItem.startingTime" @change="menu4= false"></v-time-picker>
88 </v-menu> 88 </v-menu>
89 </v-flex> 89 </v-flex>
90 </v-layout> 90 </v-layout>
91 <v-layout> 91 <v-layout>
92 <v-flex xs5 sm4 class="pt-4 subheading"> 92 <v-flex xs5 sm4 class="pt-4 subheading">
93 <label class="right">Ending Time:</label> 93 <label class="right">Ending Time:</label>
94 </v-flex> 94 </v-flex>
95 <v-flex xs7 sm6 class="ml-3"> 95 <v-flex xs7 sm6 class="ml-3">
96 <v-menu 96 <v-menu
97 ref="menuB" 97 ref="menuB"
98 :close-on-content-click="false" 98 :close-on-content-click="false"
99 v-model="menu3" 99 v-model="menu3"
100 :nudge-right="40" 100 :nudge-right="40"
101 lazy 101 lazy
102 transition="scale-transition" 102 transition="scale-transition"
103 offset-y 103 offset-y
104 full-width 104 full-width
105 max-width="290px" 105 max-width="290px"
106 min-width="290px" 106 min-width="290px"
107 > 107 >
108 <v-text-field 108 <v-text-field
109 slot="activator" 109 slot="activator"
110 v-model="editedItem.endingTime" 110 v-model="editedItem.endingTime"
111 placeholder="Select your end time" 111 placeholder="Select your end time"
112 append-icon="access_time" 112 append-icon="access_time"
113 readonly 113 readonly
114 ></v-text-field> 114 ></v-text-field>
115 <v-time-picker v-model="editedItem.endingTime" @change="menu3 = false"></v-time-picker> 115 <v-time-picker v-model="editedItem.endingTime" @change="menu3 = false"></v-time-picker>
116 </v-menu> 116 </v-menu>
117 </v-flex> 117 </v-flex>
118 </v-layout> 118 </v-layout>
119 <v-layout> 119 <v-layout>
120 <v-flex xs4 sm4 class="pt-4 subheading"> 120 <v-flex xs4 sm4 class="pt-4 subheading">
121 <label class="right">Room:</label> 121 <label class="right">Room:</label>
122 </v-flex> 122 </v-flex>
123 <v-flex xs8 sm8 class="ml-3"> 123 <v-flex xs8 sm8 class="ml-3">
124 <v-text-field 124 <v-text-field
125 label="fill your room" 125 label="fill your room"
126 :rules="roomRules" 126 :rules="roomRules"
127 v-model="editedItem.room" 127 v-model="editedItem.room"
128 @keyup.enter="submit" 128 @keyup.enter="submit"
129 ></v-text-field> 129 ></v-text-field>
130 </v-flex> 130 </v-flex>
131 </v-layout> 131 </v-layout>
132 <v-layout> 132 <v-layout>
133 <v-flex xs4 sm4 class="pt-4 subheading"> 133 <v-flex xs4 sm4 class="pt-4 subheading">
134 <label class="right">Period:</label> 134 <label class="right">Period:</label>
135 </v-flex> 135 </v-flex>
136 <v-flex xs8 sm8 class="ml-3"> 136 <v-flex xs8 sm8 class="ml-3">
137 <v-text-field 137 <v-text-field
138 label="fill your period" 138 label="fill your period"
139 :rules="periodRules" 139 :rules="periodRules"
140 v-model="editedItem.period" 140 v-model="editedItem.period"
141 @keyup.enter="submit" 141 @keyup.enter="submit"
142 ></v-text-field> 142 ></v-text-field>
143 </v-flex> 143 </v-flex>
144 </v-layout> 144 </v-layout>
145 <v-layout> 145 <v-layout>
146 <v-flex xs12 sm12> 146 <v-flex xs12 sm12>
147 <v-card-actions> 147 <v-card-actions>
148 <v-spacer></v-spacer> 148 <v-spacer></v-spacer>
149 <v-btn 149 <v-btn
150 @click="update" 150 @click="update"
151 round 151 round
152 dark 152 dark
153 :loading="loading" 153 :loading="loading"
154 class="add-button" 154 class="add-button"
155 >Update Routine</v-btn> 155 >Update Routine</v-btn>
156 </v-card-actions> 156 </v-card-actions>
157 </v-flex> 157 </v-flex>
158 </v-layout> 158 </v-layout>
159 </v-form> 159 </v-form>
160 </v-container> 160 </v-container>
161 </v-card> 161 </v-card>
162 </v-dialog> 162 </v-dialog>
163 163
164 <!-- ****** EXISTING ROUTINE TABLE ****** --> 164 <!-- ****** EXISTING ROUTINE TABLE ****** -->
165 <v-toolbar color="transparent" flat> 165 <v-toolbar color="transparent" flat>
166 <v-btn 166 <v-btn
167 fab 167 fab
168 dark 168 dark
169 class="open-dialog-button hidden-xl-only hidden-md-only hidden-lg-only" 169 class="open-dialog-button hidden-xl-only hidden-md-only hidden-lg-only"
170 small 170 small
171 @click="addRoutineDialog = true" 171 @click="addRoutineDialog = true"
172 > 172 >
173 <v-icon dark>add</v-icon> 173 <v-icon dark>add</v-icon>
174 </v-btn> 174 </v-btn>
175 <v-flex xs1 class="hidden-sm-only hidden-xs-only"> 175 <v-flex xs1 class="hidden-sm-only hidden-xs-only">
176 <v-btn 176 <v-btn
177 round 177 round
178 class="open-dialog-button" 178 class="open-dialog-button"
179 dark 179 dark
180 @click="addRoutineDialog = true" 180 @click="addRoutineDialog = true"
181 v-if="role != 'TEACHER' " 181 v-if="role != 'TEACHER' "
182 > 182 >
183 <v-icon class="white--text pr-1" size="20">add</v-icon>Add Routine 183 <v-icon class="white--text pr-1" size="20">add</v-icon>Add Routine
184 </v-btn> 184 </v-btn>
185 </v-flex> 185 </v-flex>
186 <v-spacer></v-spacer> 186 <v-spacer></v-spacer>
187 <v-flex lg2 md2 xs12 v-show="show"> 187 <v-flex lg2 md2 xs12 v-show="show">
188 <v-select 188 <v-select
189 :items="classList" 189 :items="classList"
190 label="Select Your Class" 190 label="Select Your Class"
191 v-model="addRoutineList.classId" 191 v-model="addRoutineList.classId"
192 item-text="classNum" 192 item-text="classNum"
193 item-value="_id" 193 item-value="_id"
194 name="Select Class" 194 name="Select Class"
195 :rules="classRules" 195 :rules="classRules"
196 @change="getSections(addRoutineList.classId)" 196 @change="getSections(addRoutineList.classId)"
197 class="pl-2" 197 class="pl-2"
198 required 198 required
199 ></v-select> 199 ></v-select>
200 </v-flex> 200 </v-flex>
201 <v-flex xs8 sm3 md2 class="mr-3"> 201 <v-flex xs8 sm3 md2 class="mr-3">
202 <v-select 202 <v-select
203 v-model="addRoutineList.sectionId" 203 v-model="addRoutineList.sectionId"
204 label="Select your section" 204 label="Select your section"
205 :items="addSection" 205 :items="addSection"
206 item-text="name" 206 item-text="name"
207 item-value="_id" 207 item-value="_id"
208 name="Select Section" 208 name="Select Section"
209 :rules="sectionRules" 209 :rules="sectionRules"
210 @change="getRoutineList()" 210 @change="getRoutineList()"
211 class="pl-2" 211 class="pl-2"
212 required 212 required
213 ></v-select> 213 ></v-select>
214 </v-flex> 214 </v-flex>
215 <v-card-title class="body-1" v-show="show"> 215 <v-card-title class="body-1" v-show="show">
216 <v-btn icon flat @click="displaySearch"> 216 <v-btn icon flat @click="displaySearch">
217 <v-avatar size="27"> 217 <v-avatar size="27">
218 <img src="/static/icon/search.png" alt="icon" /> 218 <img src="/static/icon/search.png" alt="icon" />
219 </v-avatar> 219 </v-avatar>
220 </v-btn> 220 </v-btn>
221 </v-card-title> 221 </v-card-title>
222 <v-flex xs9 sm9 md2 lg2 xl2 v-if="showSearch"> 222 <v-flex xs9 sm9 md2 lg2 xl2 v-if="showSearch">
223 <v-layout> 223 <v-layout>
224 <v-text-field 224 <v-text-field
225 autofocus 225 autofocus
226 v-model="search" 226 v-model="search"
227 label="Search" 227 label="Search"
228 prepend-inner-icon="search" 228 prepend-inner-icon="search"
229 color="primary" 229 color="primary"
230 style="transition: 0.8s cubic-bezier(0.25, 0.8, 0.25, 1); !important" 230 style="transition: 0.8s cubic-bezier(0.25, 0.8, 0.25, 1); !important"
231 ></v-text-field> 231 ></v-text-field>
232 <v-icon @click="closeSearch" color="error">close</v-icon> 232 <v-icon @click="closeSearch" color="error">close</v-icon>
233 </v-layout> 233 </v-layout>
234 </v-flex> 234 </v-flex>
235 </v-toolbar> 235 </v-toolbar>
236 236
237 <div class="col-sm-12"> 237 <div class="col-sm-12">
238 <div class="box-body"> 238 <div class="box-body">
239 <div class="row"> 239 <div class="row">
240 <div class="col-sm-12"> 240 <div class="col-sm-12">
241 <div class="nav-tabs-custom"> 241 <div class="nav-tabs-custom">
242 <ul class="nav nav-tabs"> 242 <ul class="nav nav-tabs">
243 <li class="active"> 243 <li class="active">
244 <a data-toggle="tab" href="#all" aria-expanded="true">All Routines</a> 244 <a data-toggle="tab" href="#all" aria-expanded="true">All Routines</a>
245 </li> 245 </li>
246 </ul> 246 </ul>
247 247
248 <div class="tab-content" v-show="hideTable"> 248 <div class="tab-content" v-show="hideTable">
249 <div id="all" class="tab-pane active mCustomScrollbar _mCS_1 mCS_no_scrollbar"> 249 <div id="all" class="tab-pane active mCustomScrollbar _mCS_1 mCS_no_scrollbar">
250 <div 250 <div
251 id="mCSB_1" 251 id="mCSB_1"
252 class="mCustomScrollBox mCS-light" 252 class="mCustomScrollBox mCS-light"
253 style="max-height: none;" 253 style="max-height: none;"
254 tabindex="0" 254 tabindex="0"
255 > 255 >
256 <div 256 <div
257 id="mCSB_1_container" 257 id="mCSB_1_container"
258 class="mCSB_container mCS_x_hidden mCS_no_scrollbar_x" 258 class="mCSB_container mCS_x_hidden mCS_no_scrollbar_x"
259 style="position: relative; top: 0px; left: 0px; width: 100%;" 259 style="position: relative; top: 0px; left: 0px; width: 100%;"
260 dir="ltr" 260 dir="ltr"
261 > 261 >
262 <div id="hide-table-2"> 262 <div id="hide-table-2">
263 <table id="table" class="table table-striped"> 263 <table id="table" class="table table-striped">
264 <tbody> 264 <tbody>
265 <tr> 265 <tr>
266 <td>MONDAY</td> 266 <td>MONDAY</td>
267 </tr> 267 </tr>
268 <tr> 268 <tr>
269 <td>TUESDAY</td> 269 <td>TUESDAY</td>
270 </tr> 270 </tr>
271 <tr> 271 <tr>
272 <td>WEDNESDAY</td> 272 <td>WEDNESDAY</td>
273 </tr> 273 </tr>
274 <tr> 274 <tr>
275 <td>THURSDAY</td> 275 <td>THURSDAY</td>
276 </tr> 276 </tr>
277 <tr> 277 <tr>
278 <td>FRIDAY</td> 278 <td>FRIDAY</td>
279 </tr> 279 </tr>
280 <tr> 280 <tr>
281 <td>SATURDAY</td> 281 <td>SATURDAY</td>
282 </tr> 282 </tr>
283 </tbody> 283 </tbody>
284 </table> 284 </table>
285 </div> 285 </div>
286 </div> 286 </div>
287 <div 287 <div
288 id="mCSB_1_scrollbar_horizontal" 288 id="mCSB_1_scrollbar_horizontal"
289 class="mCSB_scrollTools mCSB_1_scrollbar mCS-light mCSB_scrollTools_horizontal" 289 class="mCSB_scrollTools mCSB_1_scrollbar mCS-light mCSB_scrollTools_horizontal"
290 style="display: none;" 290 style="display: none;"
291 > 291 >
292 <div class="mCSB_draggerContainer"> 292 <div class="mCSB_draggerContainer">
293 <div 293 <div
294 id="mCSB_1_dragger_horizontal" 294 id="mCSB_1_dragger_horizontal"
295 class="mCSB_dragger" 295 class="mCSB_dragger"
296 style="position: absolute; min-width: 30px; width: 0px; left: 0px;" 296 style="position: absolute; min-width: 30px; width: 0px; left: 0px;"
297 > 297 >
298 <div class="mCSB_dragger_bar"></div> 298 <div class="mCSB_dragger_bar"></div>
299 </div> 299 </div>
300 <div class="mCSB_draggerRail"></div> 300 <div class="mCSB_draggerRail"></div>
301 </div> 301 </div>
302 </div> 302 </div>
303 </div> 303 </div>
304 </div> 304 </div>
305 </div> 305 </div>
306 <div> 306 <div>
307 <table id="table" class="table table-bordered" v-show="showTable"> 307 <table id="table" class="table table-bordered" v-show="showTable">
308 <tbody> 308 <tbody>
309 <div class="nav-tabs-custom"> 309 <div class="nav-tabs-custom">
310 <div class="tab-content" id="scrolling"> 310 <div class="tab-content" id="scrolling">
311 <div id="hide-table-2"> 311 <div id="hide-table-2">
312 <v-data-table :items="routineList"> 312 <v-data-table :items="routineList">
313 <template slot="items" slot-scope="props"> 313 <template slot="items" slot-scope="props">
314 <tr class="tr"> 314 <tr class="tr">
315 <td>{{ props.item.day }}</td> 315 <td>{{ props.item.day }}</td>
316 <td class="text-center" v-for="list in props.item.lectureRoutine"> 316 <td class="text-center" v-for="list in props.item.lectureRoutine">
317 {{ props.item.classId.classNum }} 317 {{ props.item.classId.classNum }}
318 <br /> 318 <br />
319 {{ props.item.sectionId.name }} 319 {{ props.item.sectionId.name }}
320 <br /> 320 <br />
321 {{ list.startingTime }} - {{ list.endingTime }} 321 {{ list.startingTime }} - {{ list.endingTime }}
322 <br /> 322 <br />
323 {{ list.room }} 323 {{ list.room }}
324 <br /> 324 <br />
325 {{ list.subjectName }} 325 {{ list.subjectName }}
326 <br /> 326 <br />
327 {{ list.teacherId.name}} 327 {{ list.teacherId.name}}
328 <br /> 328 <br />
329 <span> 329 <span>
330 <v-tooltip top> 330 <v-tooltip top>
331 <img 331 <img
332 slot="activator" 332 slot="activator"
333 style="cursor:pointer; width:20px; height:18px; " 333 style="cursor:pointer; width:20px; height:18px; "
334 class="mr-3" 334 class="mr-3"
335 @click="editItem(list, props.item)" 335 @click="editItem(list, props.item)"
336 src="/static/icon/edit.png" 336 src="/static/icon/edit.png"
337 /> 337 />
338 <span>Edit</span> 338 <span>Edit</span>
339 </v-tooltip> 339 </v-tooltip>
340 <v-tooltip top> 340 <v-tooltip top>
341 <img 341 <img
342 slot="activator" 342 slot="activator"
343 style="cursor:pointer; width:20px; height:18px; " 343 style="cursor:pointer; width:20px; height:18px; "
344 class="mr-3" 344 class="mr-3"
345 @click="deleteItem(props.item)" 345 @click="deleteItem(props.item)"
346 src="/static/icon/delete.png" 346 src="/static/icon/delete.png"
347 /> 347 />
348 <span>Delete</span> 348 <span>Delete</span>
349 </v-tooltip> 349 </v-tooltip>
350 </span> 350 </span>
351 </td> 351 </td>
352 </tr> 352 </tr>
353 </template> 353 </template>
354 </v-data-table> 354 </v-data-table>
355 </div> 355 </div>
356 </div> 356 </div>
357 </div> 357 </div>
358 </tbody> 358 </tbody>
359 </table> 359 </table>
360 </div> 360 </div>
361 </div> 361 </div>
362 </div> 362 </div>
363 </div> 363 </div>
364 </div> 364 </div>
365 </div> 365 </div>
366 <!-- ****** ADD MULTIPLE Subject ****** --> 366 <!-- ****** ADD MULTIPLE Subject ****** -->
367 <v-snackbar 367 <v-snackbar
368 :timeout="timeout" 368 :timeout="timeout"
369 :top="y === 'top'" 369 :top="y === 'top'"
370 :right="x === 'right'" 370 :right="x === 'right'"
371 :vertical="mode === 'vertical'" 371 :vertical="mode === 'vertical'"
372 v-model="snackbar" 372 v-model="snackbar"
373 :color="color" 373 :color="color"
374 >{{ text }}</v-snackbar> 374 >{{ text }}</v-snackbar>
375 <v-dialog v-model="addRoutineDialog" max-width="600px" v-if="addRoutineDialog"> 375 <v-dialog v-model="addRoutineDialog" max-width="600px" v-if="addRoutineDialog">
376 v-if="addRoutineDialog" 376 v-if="addRoutineDialog"
377 <v-card flat class="card-style pa-2" dark> 377 <v-card flat class="card-style pa-2" dark>
378 <v-layout> 378 <v-layout>
379 <v-flex xs12> 379 <v-flex xs12>
380 <label class="title text-xs-center">Add Routine</label> 380 <label class="title text-xs-center">Add Routine</label>
381 <v-icon size="24" class="right" @click="closeAddRoutineModel">cancel</v-icon> 381 <v-icon size="24" class="right" @click="closeAddRoutineModel">cancel</v-icon>
382 </v-flex> 382 </v-flex>
383 </v-layout> 383 </v-layout>
384 <v-container fluid fill-height> 384 <v-container fluid fill-height>
385 <v-layout align-center> 385 <v-layout align-center>
386 <v-flex xs12> 386 <v-flex xs12>
387 <v-form ref="form" v-model="valid" lazy-validation> 387 <v-form ref="form" v-model="valid" lazy-validation>
388 <v-layout> 388 <v-layout>
389 <v-flex xs4 sm4 class="pt-4 subheading"> 389 <v-flex xs4 sm4 class="pt-4 subheading">
390 <label class="right">School Year :</label> 390 <label class="right">School Year :</label>
391 </v-flex> 391 </v-flex>
392 <v-flex xs8 sm8 class="ml-3"> 392 <v-flex xs8 sm8 class="ml-3">
393 <v-text-field 393 <v-text-field
394 label="fill your year" 394 label="fill your year"
395 :rules="schoolRules" 395 :rules="schoolRules"
396 v-model="addRoutine.schoolYear" 396 v-model="addRoutine.schoolYear"
397 ></v-text-field> 397 ></v-text-field>
398 </v-flex> 398 </v-flex>
399 </v-layout> 399 </v-layout>
400 <v-layout> 400 <v-layout>
401 <v-flex xs4 sm4 class="pt-4 subheading"> 401 <v-flex xs4 sm4 class="pt-4 subheading">
402 <label class="right">Class :</label> 402 <label class="right">Class :</label>
403 </v-flex> 403 </v-flex>
404 <v-flex xs8 sm8 class="ml-3"> 404 <v-flex xs8 sm8 class="ml-3">
405 <v-select 405 <v-select
406 :items="classList" 406 :items="classList"
407 item-text="classNum" 407 item-text="classNum"
408 item-value="_id" 408 item-value="_id"
409 v-model="addRoutine.classId" 409 v-model="addRoutine.classId"
410 label="Select Class" 410 label="Select Class"
411 :rules="classRules" 411 :rules="classRules"
412 @change="getSections(addRoutine.classId)" 412 @change="getSections(addRoutine.classId)"
413 class="pl-2" 413 class="pl-2"
414 required 414 required
415 ></v-select> 415 ></v-select>
416 </v-flex> 416 </v-flex>
417 </v-layout> 417 </v-layout>
418 <v-layout> 418 <v-layout>
419 <v-flex xs4 sm4 class="pt-4 subheading"> 419 <v-flex xs4 sm4 class="pt-4 subheading">
420 <label class="right">Section :</label> 420 <label class="right">Section :</label>
421 </v-flex> 421 </v-flex>
422 <v-flex xs8 sm8 class="ml-3"> 422 <v-flex xs8 sm8 class="ml-3">
423 <v-select 423 <v-select
424 :items="addSection" 424 :items="addSection"
425 item-text="name" 425 item-text="name"
426 item-value="_id" 426 item-value="_id"
427 v-model="addRoutine.sectionId" 427 v-model="addRoutine.sectionId"
428 label="Select Section" 428 label="Select Section"
429 :rules="sectionRules" 429 :rules="sectionRules"
430 @change="getClassSubject(addRoutine.classId)" 430 @change="getClassSubject(addRoutine.classId)"
431 class="px-2" 431 class="px-2"
432 required 432 required
433 ></v-select> 433 ></v-select>
434 </v-flex> 434 </v-flex>
435 </v-layout> 435 </v-layout>
436 <v-layout> 436 <v-layout>
437 <v-flex xs3 sm4 class="pt-4 subheading"> 437 <v-flex xs3 sm4 class="pt-4 subheading">
438 <label class="right">Subject :</label> 438 <label class="right">Subject :</label>
439 </v-flex> 439 </v-flex>
440 <v-flex xs8 sm8 class="ml-2"> 440 <v-flex xs8 sm8 class="ml-2">
441 <v-select 441 <v-select
442 :items="subjectList.subjects" 442 :items="subjectList.subjects"
443 label="Select your subject" 443 label="Select your subject"
444 v-model="addRoutine.subjectName" 444 v-model="addRoutine.subjectName"
445 item-text="subjectName" 445 item-text="subjectName"
446 item-value="subjectName" 446 item-value="subjectName"
447 :rules="subjectRules" 447 :rules="subjectRules"
448 required 448 required
449 ></v-select> 449 ></v-select>
450 </v-flex> 450 </v-flex>
451 </v-layout> 451 </v-layout>
452 <v-layout> 452 <v-layout>
453 <v-flex xs3 sm4 class="pt-4 subheading"> 453 <v-flex xs3 sm4 class="pt-4 subheading">
454 <label class="right">Day :</label> 454 <label class="right">Day :</label>
455 </v-flex> 455 </v-flex>
456 <v-flex xs8 sm8 class="ml-2"> 456 <v-flex xs8 sm8 class="ml-2">
457 <v-select 457 <v-select
458 :items="day" 458 :items="day"
459 label="Select your day" 459 label="Select your day"
460 v-model="addRoutine.day" 460 v-model="addRoutine.day"
461 item-text="text" 461 item-text="text"
462 :rules="dayRules" 462 :rules="dayRules"
463 required 463 required
464 ></v-select> 464 ></v-select>
465 </v-flex> 465 </v-flex>
466 </v-layout> 466 </v-layout>
467 <v-layout> 467 <v-layout>
468 <v-flex xs4 sm4 class="pt-4 subheading"> 468 <v-flex xs4 sm4 class="pt-4 subheading">
469 <label class="right">Teacher Name :</label> 469 <label class="right">Teacher Name :</label>
470 </v-flex> 470 </v-flex>
471 <v-flex xs8 sm8 class="ml-3"> 471 <v-flex xs8 sm8 class="ml-3">
472 <v-select 472 <v-select
473 v-model="addRoutine.teacherId" 473 v-model="addRoutine.teacherId"
474 label="Select your teacher" 474 label="Select your teacher"
475 type="text" 475 type="text"
476 :items="teacherList" 476 :items="teacherList"
477 item-text="name" 477 item-text="name"
478 item-value="_id" 478 item-value="_id"
479 :rules="teacherRules" 479 :rules="teacherRules"
480 required 480 required
481 ></v-select> 481 ></v-select>
482 </v-flex> 482 </v-flex>
483 </v-layout> 483 </v-layout>
484 <v-layout> 484 <v-layout>
485 <v-flex xs4 class="pt-4 subheading"> 485 <v-flex xs4 class="pt-4 subheading">
486 <label class="right">Starting time:</label> 486 <label class="right">Starting time:</label>
487 </v-flex> 487 </v-flex>
488 <v-flex xs8 sm6 class="ml-3"> 488 <v-flex xs8 sm6 class="ml-3">
489 <v-menu 489 <v-menu
490 ref="menuA" 490 ref="menuA"
491 :close-on-content-click="false" 491 :close-on-content-click="false"
492 v-model="menu2" 492 v-model="menu2"
493 :nudge-right="40" 493 :nudge-right="40"
494 :return-value.sync="addRoutine.startingTime" 494 :return-value.sync="addRoutine.startingTime"
495 lazy 495 lazy
496 transition="scale-transition" 496 transition="scale-transition"
497 offset-y 497 offset-y
498 full-width 498 full-width
499 max-width="290px" 499 max-width="290px"
500 min-width="290px" 500 min-width="290px"
501 > 501 >
502 <v-text-field 502 <v-text-field
503 slot="activator" 503 slot="activator"
504 v-model="addRoutine.startingTime" 504 v-model="addRoutine.startingTime"
505 label="Select your starting time" 505 label="Select your starting time"
506 append-icon="access_time" 506 append-icon="access_time"
507 :rules="timeInRules" 507 :rules="timeInRules"
508 readonly 508 readonly
509 ></v-text-field> 509 ></v-text-field>
510 <v-time-picker 510 <v-time-picker
511 v-model="addRoutine.startingTime" 511 v-model="addRoutine.startingTime"
512 @change="$refs.menuA.save(addRoutine.startingTime)" 512 @change="$refs.menuA.save(addRoutine.startingTime)"
513 ></v-time-picker> 513 ></v-time-picker>
514 </v-menu> 514 </v-menu>
515 </v-flex> 515 </v-flex>
516 </v-layout> 516 </v-layout>
517 <v-layout> 517 <v-layout>
518 <v-flex xs4 class="pt-4 subheading"> 518 <v-flex xs4 class="pt-4 subheading">
519 <label class="right">Ending Time:</label> 519 <label class="right">Ending Time:</label>
520 </v-flex> 520 </v-flex>
521 <v-flex xs8 sm6 class="ml-3"> 521 <v-flex xs8 sm6 class="ml-3">
522 <v-menu 522 <v-menu
523 ref="menu" 523 ref="menu"
524 :close-on-content-click="false" 524 :close-on-content-click="false"
525 v-model="menu1" 525 v-model="menu1"
526 :nudge-right="40" 526 :nudge-right="40"
527 :return-value.sync="addRoutine.endingTime" 527 :return-value.sync="addRoutine.endingTime"
528 lazy 528 lazy
529 transition="scale-transition" 529 transition="scale-transition"
530 offset-y 530 offset-y
531 full-width 531 full-width
532 max-width="290px" 532 max-width="290px"
533 min-width="290px" 533 min-width="290px"
534 > 534 >
535 <v-text-field 535 <v-text-field
536 slot="activator" 536 slot="activator"
537 v-model="addRoutine.endingTime" 537 v-model="addRoutine.endingTime"
538 label="Select your end time" 538 label="Select your end time"
539 append-icon="access_time" 539 append-icon="access_time"
540 :rules="timeOutRules" 540 :rules="timeOutRules"
541 readonly 541 readonly
542 ></v-text-field> 542 ></v-text-field>
543 <v-time-picker 543 <v-time-picker
544 v-model="addRoutine.endingTime" 544 v-model="addRoutine.endingTime"
545 @change="$refs.menu.save(addRoutine.endingTime)" 545 @change="$refs.menu.save(addRoutine.endingTime)"
546 ></v-time-picker> 546 ></v-time-picker>
547 </v-menu> 547 </v-menu>
548 </v-flex> 548 </v-flex>
549 </v-layout> 549 </v-layout>
550 <v-layout> 550 <v-layout>
551 <v-flex xs4 sm4 class="pt-4 subheading"> 551 <v-flex xs4 sm4 class="pt-4 subheading">
552 <label class="right">Room:</label> 552 <label class="right">Room:</label>
553 </v-flex> 553 </v-flex>
554 <v-flex xs8 sm8 class="ml-3"> 554 <v-flex xs8 sm8 class="ml-3">
555 <v-text-field 555 <v-text-field
556 label="fill your room" 556 label="fill your room"
557 :rules="roomRules" 557 :rules="roomRules"
558 v-model="addRoutine.room" 558 v-model="addRoutine.room"
559 @keyup.enter="submit" 559 @keyup.enter="submit"
560 ></v-text-field> 560 ></v-text-field>
561 </v-flex> 561 </v-flex>
562 </v-layout> 562 </v-layout>
563 <v-layout> 563 <v-layout>
564 <v-flex xs4 sm4 class="pt-4 subheading"> 564 <v-flex xs4 sm4 class="pt-4 subheading">
565 <label class="right">Period:</label> 565 <label class="right">Period:</label>
566 </v-flex> 566 </v-flex>
567 <v-flex xs8 sm8 class="ml-3"> 567 <v-flex xs8 sm8 class="ml-3">
568 <v-text-field 568 <v-text-field
569 label="fill your period" 569 label="fill your period"
570 :rules="periodRules" 570 :rules="periodRules"
571 v-model="addRoutine.period" 571 v-model="addRoutine.period"
572 @keyup.enter="submit" 572 @keyup.enter="submit"
573 ></v-text-field> 573 ></v-text-field>
574 </v-flex> 574 </v-flex>
575 </v-layout> 575 </v-layout>
576 <v-layout> 576 <v-layout>
577 <v-flex xs12 sm12> 577 <v-flex xs12 sm12>
578 <v-card-actions> 578 <v-card-actions>
579 <v-spacer></v-spacer> 579 <v-spacer></v-spacer>
580 <v-btn 580 <v-btn
581 @click="create" 581 @click="create"
582 round 582 round
583 dark 583 dark
584 :loading="loading" 584 :loading="loading"
585 class="add-button" 585 class="add-button"
586 >Add Routine</v-btn> 586 >Add Routine</v-btn>
587 </v-card-actions> 587 </v-card-actions>
588 </v-flex> 588 </v-flex>
589 </v-layout> 589 </v-layout>
590 </v-form> 590 </v-form>
591 </v-flex> 591 </v-flex>
592 </v-layout> 592 </v-layout>
593 </v-container> 593 </v-container>
594 </v-card> 594 </v-card>
595 </v-dialog> 595 </v-dialog>
596 <div class="loader" v-if="showLoader"> 596 <div class="loader" v-if="showLoader">
597 <v-progress-circular indeterminate color="white"></v-progress-circular> 597 <v-progress-circular indeterminate color="white"></v-progress-circular>
598 </div> 598 </div>
599 </v-container> 599 </v-container>
600 </template> 600 </template>
601 601
602 <script> 602 <script>
603 import http from "@/Services/http.js"; 603 import http from "@/Services/http.js";
604 import Util from "@/util"; 604 import Util from "@/util";
605 605
606 export default { 606 export default {
607 data: () => ({ 607 data: () => ({
608 snackbar: false, 608 snackbar: false,
609 y: "top", 609 y: "top",
610 x: "right", 610 x: "right",
611 role: "", 611 role: "",
612 mode: "", 612 mode: "",
613 timeout: 3000, 613 timeout: 3000,
614 text: "", 614 text: "",
615 color: "", 615 color: "",
616 show: true, 616 show: true,
617 showSearch: false, 617 showSearch: false,
618 showLoader: false, 618 showLoader: false,
619 loading: false, 619 loading: false,
620 editLoading: false, 620 editLoading: false,
621 date: null, 621 date: null,
622 search: "", 622 search: "",
623 editRoutineDialog: false, 623 editRoutineDialog: false,
624 valid: true, 624 valid: true,
625 validEditRoutine: true, 625 validEditRoutine: true,
626 addRoutineDialog: false, 626 addRoutineDialog: false,
627 showTable: false, 627 showTable: false,
628 hideTable: true, 628 hideTable: true,
629 name: "", 629 name: "",
630 630
631 day: [ 631 day: [
632 "Monday", 632 "Monday",
633 "Tuesday", 633 "Tuesday",
634 "Wednesday", 634 "Wednesday",
635 "Thursday", 635 "Thursday",
636 "Friday", 636 "Friday",
637 "Saturday", 637 "Saturday",
638 "Sunday", 638 "Sunday",
639 ], 639 ],
640 640
641 token: "", 641 token: "",
642 642
643 menu1: false, 643 menu1: false,
644 menu2: false, 644 menu2: false,
645 menu4: false, 645 menu4: false,
646 menu3: false, 646 menu3: false,
647 647
648 schoolRules: [(v) => !!v || "School Year is required"], 648 schoolRules: [(v) => !!v || "School Year is required"],
649 classRules: [(v) => !!v || " Class Name is required"], 649 classRules: [(v) => !!v || " Class Name is required"],
650 teacherRules: [(v) => !!v || " Teacher Name is required"], 650 teacherRules: [(v) => !!v || " Teacher Name is required"],
651 sectionRules: [(v) => !!v || "Section is required"], 651 sectionRules: [(v) => !!v || "Section is required"],
652 studentRules: [(v) => !!v || " Student is required"], 652 studentRules: [(v) => !!v || " Student is required"],
653 finalRules: [(v) => !!v || "Final MArk is required"], 653 finalRules: [(v) => !!v || "Final MArk is required"],
654 subjectRules: [(v) => !!v || " Subject Name is required"], 654 subjectRules: [(v) => !!v || " Subject Name is required"],
655 dayRules: [(v) => !!v || "Day is required"], 655 dayRules: [(v) => !!v || "Day is required"],
656 timeInRules: [(v) => !!v || "Start Time is required"], 656 timeInRules: [(v) => !!v || "Start Time is required"],
657 timeOutRules: [(v) => !!v || "End Time is required"], 657 timeOutRules: [(v) => !!v || "End Time is required"],
658 roomRules: [(v) => !!v || "Room is required"], 658 roomRules: [(v) => !!v || "Room is required"],
659 periodRules: [(v) => !!v || "Period is required"], 659 periodRules: [(v) => !!v || "Period is required"],
660 660
661 classList: [], 661 classList: [],
662 addSection: [], 662 addSection: [],
663 subjectList: [], 663 subjectList: [],
664 teacherList: [], 664 teacherList: [],
665 titleRules: [], 665 titleRules: [],
666 markRules: [], 666 markRules: [],
667 typeRules: [], 667 typeRules: [],
668 routineList: [], 668 routineList: [],
669 editedIndex: -1, 669 editedIndex: -1,
670 addRoutine: {}, 670 addRoutine: {},
671 addRoutineList: {}, 671 addRoutineList: {},
672 startingTime: "", 672 startingTime: "",
673 editedItem: {}, 673 editedItem: {},
674 }), 674 }),
675 watch: { 675 watch: {
676 addRoutineDialog: function (val) { 676 addRoutineDialog: function (val) {
677 if (!val) { 677 if (!val) {
678 this.addRoutine = []; 678 this.addRoutine = [];
679 } 679 }
680 }, 680 },
681 }, 681 },
682 methods: { 682 methods: {
683 editItem(item, routineData) { 683 editItem(item, routineData) {
684 console.log("routineData", routineData); 684 console.log("routineData", routineData);
685 console.log("item", item); 685 console.log("item", item);
686 this.editedIndex = this.routineList; 686 this.editedIndex = this.routineList;
687 this.editedItem = Object.assign({}, item); 687 this.editedItem = Object.assign({}, item);
688 this.editedItem.lectureRoutineId = item._id; 688 this.editedItem.lectureRoutineId = item._id;
689 this.editedItem.routineId = routineData._id; 689 this.editedItem.routineId = routineData._id;
690 this.dialog = true; 690 this.dialog = true;
691 this.editRoutineDialog = true; 691 this.editRoutineDialog = true;
692 }, 692 },
693 deleteItem(item) { 693 deleteItem(item) {
694 let deleteLecture = { 694 let deleteLecture = {
695 routineId: item._id, 695 routineId: item._id,
696 lectureId: item.lectureRoutine[0]._id, 696 lectureId: item.lectureRoutine[0]._id,
697 }; 697 };
698 http() 698 http()
699 .delete( 699 .delete(
700 "/deleteRoutineLecture", 700 "/deleteRoutineLecture",
701 confirm("Are you sure you want to delete this?") && { 701 confirm("Are you sure you want to delete this?") && {
702 params: deleteLecture, 702 params: deleteLecture,
703 } 703 }
704 ) 704 )
705 .then((response) => { 705 .then((response) => {
706 this.snackbar = true; 706 this.snackbar = true;
707 this.text = "Successfully delete Existing Routine"; 707 this.text = "Successfully delete Existing Routine";
708 this.color = "green"; 708 this.color = "green";
709 this.getRoutineList(); 709 this.getRoutineList();
710 }) 710 })
711 .catch((error) => { 711 .catch((error) => {
712 this.snackbar = true; 712 this.snackbar = true;
713 this.text = error.response.data.message; 713 this.text = error.response.data.message;
714 this.color = "error"; 714 this.color = "error";
715 }); 715 });
716 }, 716 },
717 close() { 717 close() {
718 this.editRoutineDialog = false; 718 this.editRoutineDialog = false;
719 }, 719 },
720 closeAddRoutineModel() { 720 closeAddRoutineModel() {
721 this.addRoutineDialog = false; 721 this.addRoutineDialog = false;
722 this.classList = []; 722 this.classList = [];
723 this.addRoutine = []; 723 this.addRoutine = [];
724 }, 724 },
725 create() { 725 create() {
726 var routineData = { 726 var routineData = {
727 schoolYear: this.addRoutine.schoolYear, 727 schoolYear: this.addRoutine.schoolYear,
728 classId: this.addRoutine.classId, 728 classId: this.addRoutine.classId,
729 sectionId: this.addRoutine.sectionId, 729 sectionId: this.addRoutine.sectionId,
730 day: this.addRoutine.day, 730 day: this.addRoutine.day,
731 lectureRoutine: [], 731 lectureRoutine: [],
732 }; 732 };
733 if (this.$refs.form.validate()) { 733 if (this.$refs.form.validate()) {
734 routineData.lectureRoutine.push({ 734 routineData.lectureRoutine.push({
735 teacherId: this.addRoutine.teacherId, 735 teacherId: this.addRoutine.teacherId,
736 startingTime: this.addRoutine.startingTime, 736 startingTime: this.addRoutine.startingTime,
737 endingTime: this.addRoutine.endingTime, 737 endingTime: this.addRoutine.endingTime,
738 room: this.addRoutine.room, 738 room: this.addRoutine.room,
739 period: this.addRoutine.period, 739 period: this.addRoutine.period,
740 subjectName: this.addRoutine.subjectName, 740 subjectName: this.addRoutine.subjectName,
741 }); 741 });
742 http() 742 http()
743 .post("/createRoutine", routineData) 743 .post("/createRoutine", routineData)
744 .then((response) => { 744 .then((response) => {
745 this.getRoutineList();
746 this.text = "Routine added successfully"; 745 this.text = "Routine added successfully";
747 this.clear(); 746 // this.clear();
748 this.snackbar = true; 747 this.snackbar = true;
749 this.color = "green"; 748 this.color = "green";
749 console.log("===this.addRoutine===", this.addRoutine);
750 http()
751 .get(
752 "/getRoutineList",
753 {
754 params: {
755 classId: this.addRoutine.classId,
756 sectionId: this.addRoutine.sectionId,
757 },
758 },
759 {
760 headers: { Authorization: "Bearer " + this.token },
761 }
762 )
763 .then((response) => {
764 this.routineList = response.data.data;
765 this.showLoader = false;
766 this.showTable = true;
767 this.hideTable = false;
768 })
769 .catch((err) => {
770 console.log("err====>", err);
771 });
750 this.addRoutineDialog = false; 772 this.addRoutineDialog = false;
751 }) 773 })
752 .catch((error) => { 774 .catch((error) => {
753 // console.log(error); 775 // console.log(error);
754 this.snackbar = true; 776 this.snackbar = true;
755 this.text = error.response.data.message; 777 this.text = error.response.data.message;
756 this.color = "error"; 778 this.color = "error";
757 }); 779 });
758 } 780 }
759 }, 781 },
760 clear() { 782 clear() {
761 this.$refs.form.reset(); 783 this.$refs.form.reset();
762 }, 784 },
763 785
764 update() { 786 update() {
765 if (this.$refs.formEditRoutine.validate()) { 787 if (this.$refs.formEditRoutine.validate()) {
766 let editRoutine = { 788 let editRoutine = {
767 routineId: this.editedItem.routineId, 789 routineId: this.editedItem.routineId,
768 lectureRoutineId: this.editedItem.lectureRoutineId, 790 lectureRoutineId: this.editedItem.lectureRoutineId,
769 subjectName: this.editedItem.subjectName, 791 subjectName: this.editedItem.subjectName,
770 teacherId: this.editedItem.teacherId._id, 792 teacherId: this.editedItem.teacherId._id,
771 startingTime: this.editedItem.startingTime, 793 startingTime: this.editedItem.startingTime,
772 endingTime: this.editedItem.endingTime, 794 endingTime: this.editedItem.endingTime,
773 room: this.editedItem.room, 795 room: this.editedItem.room,
774 period: this.editedItem.period, 796 period: this.editedItem.period,
775 }; 797 };
776 this.editLoading = true; 798 this.editLoading = true;
777 http() 799 http()
778 .put("/updateRoutine", editRoutine) 800 .put("/updateRoutine", editRoutine)
779 .then((response) => { 801 .then((response) => {
780 this.snackbar = true; 802 this.snackbar = true;
781 this.text = "Successfully Edit Existing Routine"; 803 this.text = "Successfully Edit Existing Routine";
782 this.color = "green"; 804 this.color = "green";
783 this.editLoading = false; 805 this.editLoading = false;
784 this.editRoutineDialog = false; 806 this.editRoutineDialog = false;
785 this.getRoutineList(); 807 this.getRoutineList();
786 // http() 808 // http()
787 // .get( 809 // .get(
788 // "/getRoutineList", 810 // "/getRoutineList",
789 // { 811 // {
790 // params: { 812 // params: {
791 // classId: this.addRoutine.classId, 813 // classId: this.addRoutine.classId,
792 // sectionId: this.addRoutine.sectionId 814 // sectionId: this.addRoutine.sectionId
793 // } 815 // }
794 // }, 816 // },
795 // { 817 // {
796 // headers: { Authorization: "Bearer " + this.token } 818 // headers: { Authorization: "Bearer " + this.token }
797 // } 819 // }
798 // ) 820 // )
799 // .then(response => { 821 // .then(response => {
800 // this.routineList = response.data.data; 822 // this.routineList = response.data.data;
801 // this.showLoader = false; 823 // this.showLoader = false;
802 // this.showTable = true; 824 // this.showTable = true;
803 // this.hideTable = false; 825 // this.hideTable = false;
804 // }) 826 // })
805 // .catch(err => { 827 // .catch(err => {
806 // console.log("err====>", err); 828 // console.log("err====>", err);
807 // }); 829 // });
808 }) 830 })
809 .catch((error) => { 831 .catch((error) => {
810 this.editLoading = false; 832 this.editLoading = false;
811 }); 833 });
812 } 834 }
813 }, 835 },
814 getClass() { 836 getClass() {
815 http() 837 http()
816 .get("/getClassesList", { 838 .get("/getClassesList", {
817 headers: { Authorization: "Bearer " + this.token }, 839 headers: { Authorization: "Bearer " + this.token },
818 }) 840 })
819 .then((response) => { 841 .then((response) => {
820 this.classList = response.data.data; 842 this.classList = response.data.data;
821 }) 843 })
822 .catch((error) => { 844 .catch((error) => {
823 if (error.response.status === 401) { 845 if (error.response.status === 401) {
824 this.$router.replace({ path: "/" }); 846 this.$router.replace({ path: "/" });
825 this.$store.dispatch("setToken", null); 847 this.$store.dispatch("setToken", null);
826 this.$store.dispatch("Id", null); 848 this.$store.dispatch("Id", null);
827 } 849 }
828 }); 850 });
829 }, 851 },
830 getSections(_id) { 852 getSections(_id) {
831 var token = this.$store.state.token; 853 var token = this.$store.state.token;
832 this.showLoader = true; 854 this.showLoader = true;
833 http() 855 http()
834 .get( 856 .get(
835 "/getSectionsList", 857 "/getSectionsList",
836 { params: { classId: _id } }, 858 { params: { classId: _id } },
837 { 859 {
838 headers: { Authorization: "Bearer " + token }, 860 headers: { Authorization: "Bearer " + token },
839 } 861 }
840 ) 862 )
841 .then((response) => { 863 .then((response) => {
842 this.addSection = response.data.data; 864 this.addSection = response.data.data;
843 this.showLoader = false; 865 this.showLoader = false;
844 }) 866 })
845 .catch((err) => { 867 .catch((err) => {
846 this.showLoader = false; 868 this.showLoader = false;
847 }); 869 });
848 }, 870 },
849 getClassSubject(_id) { 871 getClassSubject(_id) {
850 this.showLoader = true; 872 this.showLoader = true;
851 // this.classId = this.classId; 873 // this.classId = this.classId;
852 http() 874 http()
853 .get( 875 .get(
854 "/getParticularClass", 876 "/getParticularClass",
855 { params: { classId: _id } }, 877 { params: { classId: _id } },
856 { 878 {
857 headers: { Authorization: "Bearer " + this.token }, 879 headers: { Authorization: "Bearer " + this.token },
858 } 880 }
859 ) 881 )
860 .then((response) => { 882 .then((response) => {
861 this.subjectList = response.data.data; 883 this.subjectList = response.data.data;
862 this.showLoader = false; 884 this.showLoader = false;
863 }) 885 })
864 .catch((err) => { 886 .catch((err) => {
865 this.showLoader = false; 887 this.showLoader = false;
866 }); 888 });
867 }, 889 },
868 getTeacherList() { 890 getTeacherList() {
869 this.showLoader = true; 891 this.showLoader = true;
870 var token = this.$store.state.token; 892 var token = this.$store.state.token;
871 http() 893 http()
872 .get("/getTeachersList", { 894 .get("/getTeachersList", {
873 headers: { Authorization: "Bearer " + token }, 895 headers: { Authorization: "Bearer " + token },
874 }) 896 })
875 .then((response) => { 897 .then((response) => {
876 this.teacherList = response.data.data; 898 this.teacherList = response.data.data;
877 this.showLoader = false; 899 this.showLoader = false;
878 // console.log("getTeacherList=====>",this.desserts) 900 // console.log("getTeacherList=====>",this.desserts)
879 }) 901 })
880 .catch((error) => { 902 .catch((error) => {
881 this.showLoader = false; 903 this.showLoader = false;
882 if (error.response.status === 401) { 904 if (error.response.status === 401) {
883 this.$router.replace({ path: "/" }); 905 this.$router.replace({ path: "/" });
884 this.$store.dispatch("setToken", null); 906 this.$store.dispatch("setToken", null);
885 this.$store.dispatch("Id", null); 907 this.$store.dispatch("Id", null);
886 } 908 }
887 }); 909 });
888 }, 910 },
889 getRoutineList() { 911 getRoutineList() {
890 this.showLoader = true; 912 this.showLoader = true;
891 http() 913 http()
892 .get( 914 .get(
893 "/getRoutineList", 915 "/getRoutineList",
894 { 916 {
895 params: { 917 params: {
896 classId: this.addRoutineList.classId, 918 classId: this.addRoutineList.classId,
897 sectionId: this.addRoutineList.sectionId, 919 sectionId: this.addRoutineList.sectionId,
898 }, 920 },
899 }, 921 },
900 { 922 {
901 headers: { Authorization: "Bearer " + this.token }, 923 headers: { Authorization: "Bearer " + this.token },
902 } 924 }
903 ) 925 )
904 .then((response) => { 926 .then((response) => {
905 this.routineList = response.data.data; 927 this.routineList = response.data.data;
906 this.showLoader = false; 928 this.showLoader = false;
907 this.showTable = true; 929 this.showTable = true;
908 this.hideTable = false; 930 this.hideTable = false;
909 }) 931 })
910 .catch((err) => { 932 .catch((err) => {
911 this.showLoader = false; 933 this.showLoader = false;
912 }); 934 });
913 }, 935 },
914 displaySearch() { 936 displaySearch() {
915 (this.show = false), (this.showSearch = true); 937 (this.show = false), (this.showSearch = true);
916 }, 938 },
917 closeSearch() { 939 closeSearch() {
918 this.showSearch = false; 940 this.showSearch = false;
919 this.show = true; 941 this.show = true;
920 this.search = ""; 942 this.search = "";
921 }, 943 },
922 }, 944 },
923 mounted() { 945 mounted() {
924 this.token = this.$store.state.token; 946 this.token = this.$store.state.token;
925 this.getClass(); 947 this.getClass();
926 this.getTeacherList(); 948 this.getTeacherList();
927 this.role = this.$store.state.role; 949 this.role = this.$store.state.role;
928 }, 950 },
929 }; 951 };
930 </script> 952 </script>
931 953
932 <style scoped> 954 <style scoped>
933 html, 955 html,
934 body { 956 body {
935 font-family: "OpenSans Regular"; 957 font-family: "OpenSans Regular";
936 } 958 }
937 .box .box-body { 959 .box .box-body {
938 padding: 15px; 960 padding: 15px;
939 border-top-left-radius: 0; 961 border-top-left-radius: 0;
940 border-top-right-radius: 0; 962 border-top-right-radius: 0;
941 border-bottom-right-radius: 3px; 963 border-bottom-right-radius: 3px;
942 border-bottom-left-radius: 3px; 964 border-bottom-left-radius: 3px;
943 } 965 }
944 .nav-tabs-custom { 966 .nav-tabs-custom {
945 margin-bottom: 20px; 967 margin-bottom: 20px;
946 background: #fff; 968 background: #fff;
947 box-shadow: 0px 1px 3px rgba(0, 0, 0, 0.1); 969 box-shadow: 0px 1px 3px rgba(0, 0, 0, 0.1);
948 } 970 }
949 .nav-tabs { 971 .nav-tabs {
950 border-bottom: 1px solid #ddd; 972 border-bottom: 1px solid #ddd;
951 } 973 }
952 .nav { 974 .nav {
953 padding-left: 0; 975 padding-left: 0;
954 list-style: none; 976 list-style: none;
955 } 977 }
956 .tab-content > .active { 978 .tab-content > .active {
957 display: block; 979 display: block;
958 } 980 }
959 .nav-tabs-custom > .nav-tabs > li.active > a { 981 .nav-tabs-custom > .nav-tabs > li.active > a {
960 border-top: 0; 982 border-top: 0;
961 border-left-color: #09a3a3; 983 border-left-color: #09a3a3;
962 border-right-color: #09a3a3; 984 border-right-color: #09a3a3;
963 } 985 }
964 .nav-tabs-custom > .nav-tabs { 986 .nav-tabs-custom > .nav-tabs {
965 background-color: #e5e5e5; 987 background-color: #e5e5e5;
966 margin: 0; 988 margin: 0;
967 border-bottom-color: #e5e5e5; 989 border-bottom-color: #e5e5e5;
968 } 990 }
969 .nav-tabs-custom > .nav-tabs > li:first-of-type { 991 .nav-tabs-custom > .nav-tabs > li:first-of-type {
970 margin-left: 0px; 992 margin-left: 0px;
971 } 993 }
972 .nav-tabs-custom > .nav-tabs > li.active { 994 .nav-tabs-custom > .nav-tabs > li.active {
973 border-bottom-color: #09a3a3; 995 border-bottom-color: #09a3a3;
974 } 996 }
975 .nav-tabs-custom > .nav-tabs > li { 997 .nav-tabs-custom > .nav-tabs > li {
976 border-bottom: 2px solid transparent; 998 border-bottom: 2px solid transparent;
977 border-top: 3px solid transparent; 999 border-top: 3px solid transparent;
978 margin-bottom: -2px; 1000 margin-bottom: -2px;
979 margin-right: 5px; 1001 margin-right: 5px;
980 } 1002 }
981 .nav-tabs-custom > .nav-tabs > li:first-of-type.active > a { 1003 .nav-tabs-custom > .nav-tabs > li:first-of-type.active > a {
982 border-left-width: 0; 1004 border-left-width: 0;
983 } 1005 }
984 .nav-tabs-custom > .nav-tabs > li.active > a { 1006 .nav-tabs-custom > .nav-tabs > li.active > a {
985 border-top: 0; 1007 border-top: 0;
986 border-bottom-color: #09a3a3; 1008 border-bottom-color: #09a3a3;
987 } 1009 }
988 .nav-tabs-custom > .nav-tabs > li.active > a, 1010 .nav-tabs-custom > .nav-tabs > li.active > a,
989 .nav-tabs-custom > .nav-tabs > li.active:hover > a { 1011 .nav-tabs-custom > .nav-tabs > li.active:hover > a {
990 background-color: #e5e5e5; 1012 background-color: #e5e5e5;
991 border: 0px; 1013 border: 0px;
992 color: #000000db; 1014 color: #000000db;
993 } 1015 }
994 .nav-tabs-custom > .nav-tabs > li > a, 1016 .nav-tabs-custom > .nav-tabs > li > a,
995 .nav-tabs-custom > .nav-tabs > li > a:hover { 1017 .nav-tabs-custom > .nav-tabs > li > a:hover {
996 border-radius: 0 !important; 1018 border-radius: 0 !important;
997 } 1019 }
998 .nav-tabs-custom > .tab-content { 1020 .nav-tabs-custom > .tab-content {
999 background: #fff; 1021 background: #fff;
1000 padding: 10px; 1022 padding: 10px;
1001 } 1023 }
1002 .page-header { 1024 .page-header {
1003 margin: 10px 0 20px 0; 1025 margin: 10px 0 20px 0;
1004 padding: 0px 0px 16px; 1026 padding: 0px 0px 16px;
1005 font-size: 22px; 1027 font-size: 22px;
1006 border: none; 1028 border: none;
1007 } 1029 }
1008 .table { 1030 .table {
1009 width: 100%; 1031 width: 100%;
1010 border-collapse: collapse; 1032 border-collapse: collapse;
1011 border-spacing: 0; 1033 border-spacing: 0;
1012 } 1034 }
1013 .table > tbody > tr > th, 1035 .table > tbody > tr > th,
1014 .table > tfoot > tr > th, 1036 .table > tfoot > tr > th,
1015 .table > tbody > tr > td, 1037 .table > tbody > tr > td,
1016 .table > tfoot > tr > td { 1038 .table > tfoot > tr > td {
1017 padding: 8px; 1039 padding: 8px;
1018 line-height: 1.428571429; 1040 line-height: 1.428571429;
1019 vertical-align: top; 1041 vertical-align: top;
1020 border-top: 1px solid #ddd; 1042 border-top: 1px solid #ddd;
1021 } 1043 }
1022 .nav::before, 1044 .nav::before,
1023 .nav::after { 1045 .nav::after {
1024 display: table; 1046 display: table;
1025 content: ""; 1047 content: "";
1026 } 1048 }
1027 .box .box-body .table { 1049 .box .box-body .table {
1028 margin-bottom: 0; 1050 margin-bottom: 0;
1029 } 1051 }
1030 .table-bordered { 1052 .table-bordered {
1031 border: 1px solid #e2e7eb; 1053 border: 1px solid #e2e7eb;
1032 } 1054 }
1033 .table-striped > tbody > tr:nth-child(2n + 1) > td, 1055 .table-striped > tbody > tr:nth-child(2n + 1) > td,
1034 .table-striped > tbody > tr:nth-child(2n + 1) > th { 1056 .table-striped > tbody > tr:nth-child(2n + 1) > th {
1035 background-color: #f0f3f5; 1057 background-color: #f0f3f5;
1036 } 1058 }
1037 .table-bordered > tbody > v-data-table > template > tr > th, 1059 .table-bordered > tbody > v-data-table > template > tr > th,
1038 .table-bordered > tbody > tr > td { 1060 .table-bordered > tbody > tr > td {
1039 border-color: #e2e7eb; 1061 border-color: #e2e7eb;
1040 font-size: 12px; 1062 font-size: 12px;
1041 } 1063 }
1042 .table-bordered > tbody > tr > td { 1064 .table-bordered > tbody > tr > td {
1043 color: #707070; 1065 color: #707070;
1044 } 1066 }
1045 /* 1067 /*
1046 .table-bordered > tbody > tr > th, 1068 .table-bordered > tbody > tr > th,
1047 .table-bordered > tfoot > tr > th, 1069 .table-bordered > tfoot > tr > th,
1048 .table-bordered > tbody > tr > td, 1070 .table-bordered > tbody > tr > td,
1049 .table-bordered > tfoot > tr > td { 1071 .table-bordered > tfoot > tr > td {
1050 border: 1px solid #ddd; 1072 border: 1px solid #ddd;
1051 } */ 1073 } */
1052 .mCustomScrollbar.mCS_no_scrollbar, 1074 .mCustomScrollbar.mCS_no_scrollbar,
1053 .mCustomScrollbar.mCS_touch_action { 1075 .mCustomScrollbar.mCS_touch_action {
1054 touch-action: auto; 1076 touch-action: auto;
1055 } 1077 }
1056 .mCSB_scrollTools.mCSB_scrollTools_horizontal { 1078 .mCSB_scrollTools.mCSB_scrollTools_horizontal {
1057 width: auto; 1079 width: auto;
1058 height: 16px; 1080 height: 16px;
1059 top: auto; 1081 top: auto;
1060 right: 0; 1082 right: 0;
1061 bottom: 0; 1083 bottom: 0;
1062 left: 0; 1084 left: 0;
1063 } 1085 }
1064 .mCSB_scrollTools { 1086 .mCSB_scrollTools {
1065 opacity: 0.75; 1087 opacity: 0.75;
1066 } 1088 }
1067 .mCSB_scrollTools .mCSB_draggerContainer { 1089 .mCSB_scrollTools .mCSB_draggerContainer {
1068 position: absolute; 1090 position: absolute;
1069 height: auto; 1091 height: auto;
1070 top: 0; 1092 top: 0;
1071 left: 0; 1093 left: 0;
1072 bottom: 0; 1094 bottom: 0;
1073 right: 0; 1095 right: 0;
1074 } 1096 }
1075 .mCSB_scrollTools.mCSB_scrollTools_horizontal .mCSB_dragger { 1097 .mCSB_scrollTools.mCSB_scrollTools_horizontal .mCSB_dragger {
1076 height: 100%; 1098 height: 100%;
1077 } 1099 }
1078 .mCSB_scrollTools .mCSB_dragger { 1100 .mCSB_scrollTools .mCSB_dragger {
1079 cursor: pointer; 1101 cursor: pointer;
1080 z-index: 1; 1102 z-index: 1;
1081 } 1103 }
1082 .mCSB_scrollTools.mCSB_scrollTools_horizontal .mCSB_dragger .mCSB_dragger_bar { 1104 .mCSB_scrollTools.mCSB_scrollTools_horizontal .mCSB_dragger .mCSB_dragger_bar {
1083 width: 100%; 1105 width: 100%;
1084 height: 4px; 1106 height: 4px;
1085 margin: 6px auto; 1107 margin: 6px auto;
1086 } 1108 }
1087 .mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar { 1109 .mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar {
1088 background-color: rgba(255, 255, 255, 0.75); 1110 background-color: rgba(255, 255, 255, 0.75);
1089 } 1111 }
1090 .mCSB_scrollTools.mCSB_scrollTools_horizontal .mCSB_draggerRail { 1112 .mCSB_scrollTools.mCSB_scrollTools_horizontal .mCSB_draggerRail {
1091 width: 100%; 1113 width: 100%;
1092 height: 2px; 1114 height: 2px;
1093 margin: 7px 0; 1115 margin: 7px 0;
1094 } 1116 }
1095 .mCSB_scrollTools .mCSB_draggerRail { 1117 .mCSB_scrollTools .mCSB_draggerRail {
1096 background-color: rgba(0, 0, 0, 0.4); 1118 background-color: rgba(0, 0, 0, 0.4);
1097 border-radius: 16px; 1119 border-radius: 16px;
1098 } 1120 }
1099 .mCustomScrollBox { 1121 .mCustomScrollBox {
1100 position: relative; 1122 position: relative;
1101 overflow: hidden; 1123 overflow: hidden;
1102 height: 100%; 1124 height: 100%;
1103 max-width: 100%; 1125 max-width: 100%;
1104 outline: none; 1126 outline: none;
1105 direction: ltr; 1127 direction: ltr;
1106 } 1128 }
1107 /* .mCSB_horizontal > .mCSB_container.mCS_no_scrollbar_x.mCS_x_hidden { 1129 /* .mCSB_horizontal > .mCSB_container.mCS_no_scrollbar_x.mCS_x_hidden {
1108 margin-bottom: 0; 1130 margin-bottom: 0;
1109 } 1131 }
1110 .mCSB_horizontal.mCSB_inside > .mCSB_container { 1132 .mCSB_horizontal.mCSB_inside > .mCSB_container {
1111 margin-right: 0; 1133 margin-right: 0;
1112 } */ 1134 } */
1113 .mCSB_container { 1135 .mCSB_container {
1114 overflow: hidden; 1136 overflow: hidden;
1115 height: auto; 1137 height: auto;
1116 } 1138 }
1117 1139
1118 @media (min-width: 768px) { 1140 @media (min-width: 768px) {
1119 .col-sm-12 { 1141 .col-sm-12 {
1120 width: 100%; 1142 width: 100%;
1121 } 1143 }
1122 } 1144 }
src/pages/TimeTable/timeTable.vue
Diff comments   View file @9d0f438
1 <template> 1 <template>
2 <v-container fluid class="body-color"> 2 <v-container fluid class="body-color">
3 <!-- ****** EDIT TIME-TABLE****** --> 3 <!-- ****** EDIT TIME-TABLE****** -->
4 <v-dialog v-model="dialog" max-width="600px"> 4 <v-dialog v-model="dialog" max-width="600px">
5 <v-flex xs12 sm12> 5 <v-flex xs12 sm12>
6 <v-card flat class="card-style pa-2" dark> 6 <v-card flat class="card-style pa-2" dark>
7 <v-layout> 7 <v-layout>
8 <v-flex xs12> 8 <v-flex xs12>
9 <label class="title text-xs-center">Edit Time Table</label> 9 <label class="title text-xs-center">Edit Time Table</label>
10 <v-icon size="24" class="right" @click="dialog = false">cancel</v-icon> 10 <v-icon size="24" class="right" @click="dialog = false">cancel</v-icon>
11 </v-flex> 11 </v-flex>
12 </v-layout> 12 </v-layout>
13 <!-- <v-layout> 13 <!-- <v-layout>
14 <v-flex 14 <v-flex
15 xs12 15 xs12
16 class="text-xs-center text-sm-center text-md-center text-lg-center" 16 class="text-xs-center text-sm-center text-md-center text-lg-center"
17 > 17 >
18 <v-avatar size="100px"> 18 <v-avatar size="100px">
19 <img src="/static/icon/user.png" v-if="!imageUrl" /> 19 <img src="/static/icon/user.png" v-if="!imageUrl" />
20 </v-avatar> 20 </v-avatar>
21 <input 21 <input
22 type="file" 22 type="file"
23 style="display: none" 23 style="display: none"
24 ref="image" 24 ref="image"
25 accept="image/*" 25 accept="image/*"
26 @change="onFilePicked" 26 @change="onFilePicked"
27 /> 27 />
28 <img 28 <img
29 :src="imageData.imageUrl" 29 :src="imageData.imageUrl"
30 height="150" 30 height="150"
31 v-if="imageUrl" 31 v-if="imageUrl"
32 style="border-radius:50%; width:200px" 32 style="border-radius:50%; width:200px"
33 /> 33 />
34 </v-flex> 34 </v-flex>
35 </v-layout>--> 35 </v-layout>-->
36 <v-flex xs12 sm12> 36 <v-flex xs12 sm12>
37 <v-layout> 37 <v-layout>
38 <v-flex xs4 class="pt-4 subheading"> 38 <v-flex xs4 class="pt-4 subheading">
39 <label class="right hidden-xs-only hidden-sm-only">Select Class:</label> 39 <label class="right hidden-xs-only hidden-sm-only">Select Class:</label>
40 <label class="right hidden-lg-only hidden-md-only hidden-xl-only">Class:</label> 40 <label class="right hidden-lg-only hidden-md-only hidden-xl-only">Class:</label>
41 </v-flex> 41 </v-flex>
42 <v-flex xs8 sm5 class="ml-3"> 42 <v-flex xs8 sm5 class="ml-3">
43 <v-select 43 <v-select
44 :items="addclass" 44 :items="addclass"
45 label="Select Class" 45 label="Select Class"
46 v-model="editedItem.classNum" 46 v-model="editedItem.classNum"
47 item-text="classNum" 47 item-text="classNum"
48 item-value="_id" 48 item-value="_id"
49 @change="getSections(editedItem.classNum)" 49 @change="getSections(editedItem.classNum)"
50 ></v-select> 50 ></v-select>
51 </v-flex> 51 </v-flex>
52 </v-layout> 52 </v-layout>
53 </v-flex> 53 </v-flex>
54 <v-flex xs12 sm12> 54 <v-flex xs12 sm12>
55 <v-layout> 55 <v-layout>
56 <v-flex xs4 class="pt-4 subheading"> 56 <v-flex xs4 class="pt-4 subheading">
57 <label class="right hidden-xs-only hidden-sm-only">Section Name:</label> 57 <label class="right hidden-xs-only hidden-sm-only">Section Name:</label>
58 <label class="right hidden-lg-only hidden-md-only hidden-xl-only">Section:</label> 58 <label class="right hidden-lg-only hidden-md-only hidden-xl-only">Section:</label>
59 </v-flex> 59 </v-flex>
60 <v-flex xs8 sm5 class="ml-3"> 60 <v-flex xs8 sm5 class="ml-3">
61 <v-select 61 <v-select
62 :items="addSection" 62 :items="addSection"
63 label="Select Section" 63 label="Select Section"
64 v-model="editedItem.selectSection" 64 v-model="editedItem.selectSection"
65 item-text="name" 65 item-text="name"
66 item-value="_id" 66 item-value="_id"
67 ></v-select> 67 ></v-select>
68 </v-flex> 68 </v-flex>
69 </v-layout> 69 </v-layout>
70 </v-flex> 70 </v-flex>
71 <v-layout> 71 <v-layout>
72 <v-flex xs12 sm9 offset-sm1> 72 <v-flex xs12 sm9 offset-sm1>
73 <v-card-actions> 73 <v-card-actions>
74 <v-spacer></v-spacer> 74 <v-spacer></v-spacer>
75 <v-btn round dark @click.native="close" class="clear-button">Cancel</v-btn> 75 <v-btn round dark @click.native="close" class="clear-button">Cancel</v-btn>
76 <v-btn round dark @click="save" class="add-button">Save</v-btn> 76 <v-btn round dark @click="save" class="add-button">Save</v-btn>
77 </v-card-actions> 77 </v-card-actions>
78 </v-flex> 78 </v-flex>
79 </v-layout> 79 </v-layout>
80 </v-card> 80 </v-card>
81 </v-flex> 81 </v-flex>
82 </v-dialog> 82 </v-dialog>
83 83
84 <!-- ****** ADD Dialog Schedule IN TIME-TABLE ****** --> 84 <!-- ****** ADD Dialog Schedule IN TIME-TABLE ****** -->
85 85
86 <v-dialog v-model="dialogSchedule" max-width="600px"> 86 <v-dialog v-model="dialogSchedule" max-width="600px">
87 <v-flex xs12 sm12> 87 <v-flex xs12 sm12>
88 <v-card flat class="card-style pa-2" dark> 88 <v-card flat class="card-style pa-2" dark>
89 <v-layout> 89 <v-layout>
90 <v-flex xs12> 90 <v-flex xs12>
91 <label class="title text-xs-center">Add Schedule</label> 91 <label class="title text-xs-center">Add Schedule</label>
92 <v-icon size="24" class="right" @click="dialogSchedule = false">cancel</v-icon> 92 <v-icon size="24" class="right" @click="dialogSchedule = false">cancel</v-icon>
93 </v-flex> 93 </v-flex>
94 </v-layout> 94 </v-layout>
95 <v-form ref="formAddDay" v-model="validAddDay" lazy-validation> 95 <v-form ref="formAddDay" v-model="validAddDay" lazy-validation>
96 <v-container fluid> 96 <v-container fluid>
97 <v-flex xs12 sm12 class="py-3"> 97 <v-flex xs12 sm12 class="py-3">
98 <v-layout> 98 <v-layout>
99 <v-flex xs4 class="pt-4 subheading"> 99 <v-flex xs4 class="pt-4 subheading">
100 <label class="right hidden-xs-only hidden-sm-only">Select Day:</label> 100 <label class="right hidden-xs-only hidden-sm-only">Select Day:</label>
101 <label class="right hidden-lg-only hidden-md-only hidden-xl-only">Day:</label> 101 <label class="right hidden-lg-only hidden-md-only hidden-xl-only">Day:</label>
102 </v-flex> 102 </v-flex>
103 <v-flex xs12 sm5 class="pl-3"> 103 <v-flex xs12 sm5 class="pl-3">
104 <v-select 104 <v-select
105 :items="addOneDay" 105 :items="addOneDay"
106 label="Select Day" 106 label="Select Day"
107 v-model="schedule.selectDay" 107 v-model="schedule.selectDay"
108 :rules="selecDayRule" 108 :rules="selecDayRule"
109 ></v-select> 109 ></v-select>
110 </v-flex> 110 </v-flex>
111 </v-layout> 111 </v-layout>
112 </v-flex> 112 </v-flex>
113 <v-layout> 113 <v-layout>
114 <v-flex xs12 sm8 offset-sm2> 114 <v-flex xs12 sm8 offset-sm2>
115 <v-card-actions> 115 <v-card-actions>
116 <v-spacer></v-spacer> 116 <v-spacer></v-spacer>
117 <v-btn round dark @click="submitSchedule" class="add-button">Save</v-btn> 117 <v-btn round dark @click="submitSchedule" class="add-button">Save</v-btn>
118 <v-spacer></v-spacer> 118 <v-spacer></v-spacer>
119 </v-card-actions> 119 </v-card-actions>
120 </v-flex> 120 </v-flex>
121 </v-layout> 121 </v-layout>
122 </v-container> 122 </v-container>
123 </v-form> 123 </v-form>
124 </v-card> 124 </v-card>
125 </v-flex> 125 </v-flex>
126 </v-dialog> 126 </v-dialog>
127 127
128 <!-- ****** ADD LECTURES IN TIME-TABLE ****** --> 128 <!-- ****** ADD LECTURES IN TIME-TABLE ****** -->
129 129
130 <v-dialog v-model="dialogAddLecture" max-width="600px" persistent> 130 <v-dialog v-model="dialogAddLecture" max-width="600px" persistent>
131 <v-flex xs12 sm12> 131 <v-flex xs12 sm12>
132 <v-card flat class="card-style pa-2" dark> 132 <v-card flat class="card-style pa-2" dark>
133 <v-layout> 133 <v-layout>
134 <v-flex xs12> 134 <v-flex xs12>
135 <label class="title text-xs-center">Add Lecture</label> 135 <label class="title text-xs-center">Add Lecture</label>
136 <v-icon size="24" class="right" @click="dialogAddLecture = false">cancel</v-icon> 136 <v-icon size="24" class="right" @click="dialogAddLecture = false">cancel</v-icon>
137 </v-flex> 137 </v-flex>
138 </v-layout> 138 </v-layout>
139 <v-form ref="lectureForm" v-model="valid" lazy-validation> 139 <v-form ref="lectureForm" v-model="valid" lazy-validation>
140 <v-container fluid> 140 <v-container fluid>
141 <v-flex xs12 sm12> 141 <v-flex xs12 sm12>
142 <v-layout> 142 <v-layout>
143 <v-flex xs4 class="pt-4 subheading"> 143 <v-flex xs4 class="pt-4 subheading">
144 <label class="right hidden-xs-only hidden-sm-only">Select Class:</label> 144 <label class="right hidden-xs-only hidden-sm-only">Select Class:</label>
145 <label class="right hidden-lg-only hidden-md-only hidden-xl-only">Class:</label> 145 <label class="right hidden-lg-only hidden-md-only hidden-xl-only">Class:</label>
146 </v-flex> 146 </v-flex>
147 <v-flex xs5 class="ml-3"> 147 <v-flex xs5 class="ml-3">
148 <v-select 148 <v-select
149 :items="addclass" 149 :items="addclass"
150 label="Select Class" 150 label="Select Class"
151 v-model="timeTable.select" 151 v-model="timeTable.select"
152 item-text="classNum" 152 item-text="classNum"
153 item-value="_id" 153 item-value="_id"
154 @change="getClassSubject(timeTable.select)" 154 @change="getClassSubject(timeTable.select)"
155 :rules="classRules" 155 :rules="classRules"
156 required 156 required
157 ></v-select> 157 ></v-select>
158 </v-flex> 158 </v-flex>
159 </v-layout> 159 </v-layout>
160 </v-flex> 160 </v-flex>
161 <v-flex xs12 sm12> 161 <v-flex xs12 sm12>
162 <v-layout> 162 <v-layout>
163 <v-flex xs4 class="pt-4 subheading"> 163 <v-flex xs4 class="pt-4 subheading">
164 <label class="right">Subject Name:</label> 164 <label class="right">Subject Name:</label>
165 </v-flex> 165 </v-flex>
166 <v-flex xs5 class="ml-3"> 166 <v-flex xs5 class="ml-3">
167 <v-select 167 <v-select
168 :items="subjectList.subjects" 168 :items="subjectList.subjects"
169 label="Select Subject" 169 label="Select Subject"
170 v-model="addlectures.subjectName" 170 v-model="addlectures.subjectName"
171 item-text="subjectName" 171 item-text="subjectName"
172 item-value="subjectName" 172 item-value="subjectName"
173 :rules="subjectNameRules" 173 :rules="subjectNameRules"
174 required 174 required
175 ></v-select> 175 ></v-select>
176 <!-- <v-text-field 176 <!-- <v-text-field
177 v-model="addlectures.subjectName" 177 v-model="addlectures.subjectName"
178 :rules="subjectNameRules" 178 :rules="subjectNameRules"
179 placeholder="fill your Subject Name" 179 placeholder="fill your Subject Name"
180 type="text" 180 type="text"
181 ></v-text-field>--> 181 ></v-text-field>-->
182 </v-flex> 182 </v-flex>
183 </v-layout> 183 </v-layout>
184 </v-flex> 184 </v-flex>
185 <v-flex xs12 sm12> 185 <v-flex xs12 sm12>
186 <v-layout> 186 <v-layout>
187 <v-flex xs4 class="pt-4 subheading"> 187 <v-flex xs4 class="pt-4 subheading">
188 <label class="right">Time In:</label> 188 <label class="right">Time In:</label>
189 </v-flex> 189 </v-flex>
190 <v-flex xs5 class="ml-3"> 190 <v-flex xs5 class="ml-3">
191 <v-menu 191 <v-menu
192 ref="menuD" 192 ref="menuD"
193 :close-on-content-click="false" 193 :close-on-content-click="false"
194 v-model="menu5" 194 v-model="menu5"
195 :nudge-right="40" 195 :nudge-right="40"
196 lazy 196 lazy
197 transition="scale-transition" 197 transition="scale-transition"
198 offset-y 198 offset-y
199 full-width 199 full-width
200 max-width="290px" 200 max-width="290px"
201 min-width="290px" 201 min-width="290px"
202 > 202 >
203 <v-text-field 203 <v-text-field
204 slot="activator" 204 slot="activator"
205 v-model="addlectures.timeIn" 205 v-model="addlectures.timeIn"
206 label="Select your Time In" 206 label="Select your Time In"
207 append-icon="access_time" 207 append-icon="access_time"
208 :rules="timeInRules" 208 :rules="timeInRules"
209 readonly 209 readonly
210 ></v-text-field> 210 ></v-text-field>
211 <v-time-picker v-model="addlectures.timeIn" @change="menu5 = false"></v-time-picker> 211 <v-time-picker v-model="addlectures.timeIn" @change="menu5 = false"></v-time-picker>
212 </v-menu> 212 </v-menu>
213 </v-flex> 213 </v-flex>
214 </v-layout> 214 </v-layout>
215 </v-flex> 215 </v-flex>
216 <v-flex xs12 sm12> 216 <v-flex xs12 sm12>
217 <v-layout> 217 <v-layout>
218 <v-flex xs4 class="pt-4 subheading"> 218 <v-flex xs4 class="pt-4 subheading">
219 <label class="right">Time Out:</label> 219 <label class="right">Time Out:</label>
220 </v-flex> 220 </v-flex>
221 <v-flex xs5 class="ml-3"> 221 <v-flex xs5 class="ml-3">
222 <v-menu 222 <v-menu
223 ref="menuE" 223 ref="menuE"
224 :close-on-content-click="false" 224 :close-on-content-click="false"
225 v-model="menu6" 225 v-model="menu6"
226 :nudge-right="40" 226 :nudge-right="40"
227 lazy 227 lazy
228 transition="scale-transition" 228 transition="scale-transition"
229 offset-y 229 offset-y
230 full-width 230 full-width
231 max-width="290px" 231 max-width="290px"
232 min-width="290px" 232 min-width="290px"
233 > 233 >
234 <v-text-field 234 <v-text-field
235 slot="activator" 235 slot="activator"
236 :rules="timeOutRules" 236 :rules="timeOutRules"
237 v-model="addlectures.timeOut" 237 v-model="addlectures.timeOut"
238 label="Select your Time Out" 238 label="Select your Time Out"
239 append-icon="access_time" 239 append-icon="access_time"
240 readonly 240 readonly
241 ></v-text-field> 241 ></v-text-field>
242 <v-time-picker v-model="addlectures.timeOut" @change="menu6 = false"></v-time-picker> 242 <v-time-picker v-model="addlectures.timeOut" @change="menu6 = false"></v-time-picker>
243 </v-menu> 243 </v-menu>
244 </v-flex> 244 </v-flex>
245 </v-layout> 245 </v-layout>
246 </v-flex> 246 </v-flex>
247 <v-flex xs12 sm12> 247 <v-flex xs12 sm12>
248 <v-layout> 248 <v-layout>
249 <v-flex xs4 class="pt-4 subheading"> 249 <v-flex xs4 class="pt-4 subheading">
250 <label class="right">Select Teacher:</label> 250 <label class="right">Select Teacher:</label>
251 </v-flex> 251 </v-flex>
252 <v-flex xs5 class="ml-3"> 252 <v-flex xs5 class="ml-3">
253 <v-select 253 <v-select
254 :items="addTeachers" 254 :items="addTeachers"
255 label="Select Teacher" 255 label="Select Teacher"
256 v-model="addlectures.teacherId" 256 v-model="addlectures.teacherId"
257 :rules="teacherRules" 257 :rules="teacherRules"
258 item-text="name" 258 item-text="name"
259 item-value="_id" 259 item-value="_id"
260 required 260 required
261 ></v-select> 261 ></v-select>
262 </v-flex> 262 </v-flex>
263 </v-layout> 263 </v-layout>
264 </v-flex> 264 </v-flex>
265 <v-layout> 265 <v-layout>
266 <v-flex xs12 sm8 offset-sm2> 266 <v-flex xs12 sm8 offset-sm2>
267 <v-card-actions> 267 <v-card-actions>
268 <v-spacer></v-spacer> 268 <v-spacer></v-spacer>
269 <v-btn round dark @click="AddLecture" class="add-button">Save</v-btn> 269 <v-btn round dark @click="AddLecture" class="add-button">Save</v-btn>
270 </v-card-actions> 270 </v-card-actions>
271 </v-flex> 271 </v-flex>
272 </v-layout> 272 </v-layout>
273 </v-container> 273 </v-container>
274 </v-form> 274 </v-form>
275 </v-card> 275 </v-card>
276 </v-flex> 276 </v-flex>
277 </v-dialog> 277 </v-dialog>
278 278
279 <!-- ****** EDIT PARTICULAR LECTURES TIME-TABLE ****** --> 279 <!-- ****** EDIT PARTICULAR LECTURES TIME-TABLE ****** -->
280 280
281 <v-dialog v-model="dialogUpdateLectures" max-width="600px"> 281 <v-dialog v-model="dialogUpdateLectures" max-width="600px">
282 <v-flex xs12 sm12 class> 282 <v-flex xs12 sm12 class>
283 <v-card flat class="card-style pa-2" dark> 283 <v-card flat class="card-style pa-2" dark>
284 <v-layout> 284 <v-layout>
285 <v-flex xs12> 285 <v-flex xs12>
286 <label class="title text-xs-center">Edit Lecture</label> 286 <label class="title text-xs-center">Edit Lecture</label>
287 <v-icon size="24" class="right" @click="dialogUpdateLectures = false">cancel</v-icon> 287 <v-icon size="24" class="right" @click="dialogUpdateLectures = false">cancel</v-icon>
288 </v-flex> 288 </v-flex>
289 </v-layout> 289 </v-layout>
290 <v-flex xs12 sm12> 290 <v-flex xs12 sm12>
291 <v-layout> 291 <v-layout>
292 <v-flex xs4 class="pt-4 subheading"> 292 <v-flex xs4 class="pt-4 subheading">
293 <label class="right hidden-xs-only hidden-sm-only">Select Class:</label> 293 <label class="right hidden-xs-only hidden-sm-only">Select Class:</label>
294 <label class="right hidden-lg-only hidden-md-only hidden-xl-only">Class:</label> 294 <label class="right hidden-lg-only hidden-md-only hidden-xl-only">Class:</label>
295 </v-flex> 295 </v-flex>
296 <v-flex xs7 sm6 class="ml-3"> 296 <v-flex xs7 sm6 class="ml-3">
297 <v-select 297 <v-select
298 :items="addclass" 298 :items="addclass"
299 label="Select Class" 299 label="Select Class"
300 v-model="updateLectures.select" 300 v-model="updateLectures.select"
301 item-text="classNum" 301 item-text="classNum"
302 item-value="_id" 302 item-value="_id"
303 @change="getClassSubject(updateLectures.select)" 303 @change="getClassSubject(updateLectures.select)"
304 required 304 required
305 ></v-select> 305 ></v-select>
306 </v-flex> 306 </v-flex>
307 </v-layout> 307 </v-layout>
308 </v-flex> 308 </v-flex>
309 <v-flex xs12 sm12> 309 <v-flex xs12 sm12>
310 <v-layout> 310 <v-layout>
311 <v-flex xs4 class="pt-4 subheading"> 311 <v-flex xs4 class="pt-4 subheading">
312 <label class="right hidden-xs-only hidden-sm-only">Select Subject:</label> 312 <label class="right hidden-xs-only hidden-sm-only">Select Subject:</label>
313 <label class="right hidden-lg-only hidden-md-only hidden-xl-only">Subject:</label> 313 <label class="right hidden-lg-only hidden-md-only hidden-xl-only">Subject:</label>
314 </v-flex> 314 </v-flex>
315 <v-flex xs7 sm6 class="ml-3"> 315 <v-flex xs7 sm6 class="ml-3">
316 <v-select 316 <v-select
317 :items="subjectList.subjects" 317 :items="subjectList.subjects"
318 label="Select Subject" 318 label="Select Subject"
319 v-model="updateLectures.subjectName" 319 v-model="updateLectures.subjectName"
320 item-text="subjectName" 320 item-text="subjectName"
321 item-value="subjectName" 321 item-value="subjectName"
322 required 322 required
323 ></v-select> 323 ></v-select>
324 <!-- <v-text-field 324 <!-- <v-text-field
325 v-model="updateLectures.subjectName" 325 v-model="updateLectures.subjectName"
326 placeholder="fill your Subject Name" 326 placeholder="fill your Subject Name"
327 type="text" 327 type="text"
328 ></v-text-field>--> 328 ></v-text-field>-->
329 </v-flex> 329 </v-flex>
330 </v-layout> 330 </v-layout>
331 </v-flex> 331 </v-flex>
332 <v-flex xs12 sm12> 332 <v-flex xs12 sm12>
333 <v-layout> 333 <v-layout>
334 <v-flex xs5 sm4 class="pt-4 subheading"> 334 <v-flex xs5 sm4 class="pt-4 subheading">
335 <label class="right">Time In:</label> 335 <label class="right">Time In:</label>
336 </v-flex> 336 </v-flex>
337 <v-flex xs7 sm6 class="ml-3"> 337 <v-flex xs7 sm6 class="ml-3">
338 <v-menu 338 <v-menu
339 ref="menuC" 339 ref="menuC"
340 :close-on-content-click="false" 340 :close-on-content-click="false"
341 v-model="menu4" 341 v-model="menu4"
342 :nudge-right="40" 342 :nudge-right="40"
343 lazy 343 lazy
344 transition="scale-transition" 344 transition="scale-transition"
345 offset-y 345 offset-y
346 full-width 346 full-width
347 max-width="290px" 347 max-width="290px"
348 min-width="290px" 348 min-width="290px"
349 > 349 >
350 <v-text-field 350 <v-text-field
351 slot="activator" 351 slot="activator"
352 v-model="updateLectures.timeIn" 352 v-model="updateLectures.timeIn"
353 placeholder="Select your Time In" 353 placeholder="Select your Time In"
354 append-icon="access_time" 354 append-icon="access_time"
355 readonly 355 readonly
356 ></v-text-field> 356 ></v-text-field>
357 <v-time-picker v-model="updateLectures.timeIn" @change="menu4= false"></v-time-picker> 357 <v-time-picker v-model="updateLectures.timeIn" @change="menu4= false"></v-time-picker>
358 </v-menu> 358 </v-menu>
359 </v-flex> 359 </v-flex>
360 </v-layout> 360 </v-layout>
361 </v-flex> 361 </v-flex>
362 <v-flex xs12 sm12> 362 <v-flex xs12 sm12>
363 <v-layout> 363 <v-layout>
364 <v-flex xs5 sm4 class="pt-4 subheading"> 364 <v-flex xs5 sm4 class="pt-4 subheading">
365 <label class="right">Time Out:</label> 365 <label class="right">Time Out:</label>
366 </v-flex> 366 </v-flex>
367 <v-flex xs7 sm6 class="ml-3"> 367 <v-flex xs7 sm6 class="ml-3">
368 <v-menu 368 <v-menu
369 ref="menuB" 369 ref="menuB"
370 :close-on-content-click="false" 370 :close-on-content-click="false"
371 v-model="menu3" 371 v-model="menu3"
372 :nudge-right="40" 372 :nudge-right="40"
373 lazy 373 lazy
374 transition="scale-transition" 374 transition="scale-transition"
375 offset-y 375 offset-y
376 full-width 376 full-width
377 max-width="290px" 377 max-width="290px"
378 min-width="290px" 378 min-width="290px"
379 > 379 >
380 <v-text-field 380 <v-text-field
381 slot="activator" 381 slot="activator"
382 v-model="updateLectures.timeOut" 382 v-model="updateLectures.timeOut"
383 placeholder="Select your Time Out" 383 placeholder="Select your Time Out"
384 append-icon="access_time" 384 append-icon="access_time"
385 readonly 385 readonly
386 ></v-text-field> 386 ></v-text-field>
387 <v-time-picker v-model="updateLectures.timeOut" @change="menu3 = false"></v-time-picker> 387 <v-time-picker v-model="updateLectures.timeOut" @change="menu3 = false"></v-time-picker>
388 </v-menu> 388 </v-menu>
389 </v-flex> 389 </v-flex>
390 </v-layout> 390 </v-layout>
391 </v-flex> 391 </v-flex>
392 <v-flex xs12 sm12> 392 <v-flex xs12 sm12>
393 <v-layout> 393 <v-layout>
394 <v-flex xs5 sm4 class="pt-4 subheading"> 394 <v-flex xs5 sm4 class="pt-4 subheading">
395 <label class="right">Select Teacher:</label> 395 <label class="right">Select Teacher:</label>
396 </v-flex> 396 </v-flex>
397 <v-flex xs7 sm6 class="ml-3"> 397 <v-flex xs7 sm6 class="ml-3">
398 <v-select 398 <v-select
399 :items="addTeachers" 399 :items="addTeachers"
400 label="Select Teacher" 400 label="Select Teacher"
401 v-model="updateLectures.teacherId" 401 v-model="updateLectures.teacherId"
402 item-text="name" 402 item-text="name"
403 item-value="_id" 403 item-value="_id"
404 required 404 required
405 ></v-select> 405 ></v-select>
406 </v-flex> 406 </v-flex>
407 </v-layout> 407 </v-layout>
408 </v-flex> 408 </v-flex>
409 <v-layout> 409 <v-layout>
410 <v-flex xs12 sm10 offset-sm1> 410 <v-flex xs12 sm10 offset-sm1>
411 <v-card-actions> 411 <v-card-actions>
412 <!-- <v-btn round dark @click.native="closeUpdateLectures">Cancel</v-btn> --> 412 <!-- <v-btn round dark @click.native="closeUpdateLectures">Cancel</v-btn> -->
413 <v-spacer></v-spacer> 413 <v-spacer></v-spacer>
414 <v-btn 414 <v-btn
415 round 415 round
416 dark 416 dark
417 class="add-button" 417 class="add-button"
418 @click="updateParticularTable(updateLectures.timeIn,updateLectures.timeOut)" 418 @click="updateParticularTable(updateLectures.timeIn,updateLectures.timeOut)"
419 >Save</v-btn> 419 >Save</v-btn>
420 </v-card-actions> 420 </v-card-actions>
421 </v-flex> 421 </v-flex>
422 </v-layout> 422 </v-layout>
423 </v-card> 423 </v-card>
424 </v-flex> 424 </v-flex>
425 </v-dialog> 425 </v-dialog>
426 <!-- ****** EXISTING-USERS TIME-TABLE ****** --> 426 <!-- ****** EXISTING-USERS TIME-TABLE ****** -->
427 427
428 <!-- <v-card flat> 428 <!-- <v-card flat>
429 <v-card-actions class="hidden-xs-only hidden-sm-only"> 429 <v-card-actions class="hidden-xs-only hidden-sm-only">
430 <v-layout> 430 <v-layout>
431 <label class="right mt-4 ml-5">Select Class:</label> 431 <label class="right mt-4 ml-5">Select Class:</label>
432 <v-select 432 <v-select
433 :items="addclass" 433 :items="addclass"
434 label="Select Class" 434 label="Select Class"
435 v-model="selectTimeTable.select" 435 v-model="selectTimeTable.select"
436 item-text="classNum" 436 item-text="classNum"
437 item-value="_id" 437 item-value="_id"
438 name="Select Class" 438 name="Select Class"
439 @change="getSections(selectTimeTable.select)" 439 @change="getSections(selectTimeTable.select)"
440 class="px-4" 440 class="px-4"
441 required 441 required
442 ></v-select> 442 ></v-select>
443 <label class="right mt-4">Select Section:</label> 443 <label class="right mt-4">Select Section:</label>
444 <v-select 444 <v-select
445 :items="addSection" 445 :items="addSection"
446 label="Select Section" 446 label="Select Section"
447 v-model="selectTimeTable.selectSection" 447 v-model="selectTimeTable.selectSection"
448 item-text="name" 448 item-text="name"
449 item-value="_id" 449 item-value="_id"
450 name="Select Section" 450 name="Select Section"
451 class="pl-3" 451 class="pl-3"
452 required 452 required
453 ></v-select> 453 ></v-select>
454 </v-layout> 454 </v-layout>
455 <v-spacer></v-spacer> 455 <v-spacer></v-spacer>
456 <v-btn @click="findTimeTable()" round dark :loading="loadingFindData" class="left">Find</v-btn> 456 <v-btn @click="findTimeTable()" round dark :loading="loadingFindData" class="left">Find</v-btn>
457 </v-card-actions> 457 </v-card-actions>
458 <v-layout class="hidden-xl-only hidden-lg-only hidden-md-only"> 458 <v-layout class="hidden-xl-only hidden-lg-only hidden-md-only">
459 <v-flex xs4 sm2 class="mt-4 ml-2"> 459 <v-flex xs4 sm2 class="mt-4 ml-2">
460 <label>Select Class:</label> 460 <label>Select Class:</label>
461 </v-flex> 461 </v-flex>
462 <v-flex xs6 sm9> 462 <v-flex xs6 sm9>
463 <v-select 463 <v-select
464 :items="addclass" 464 :items="addclass"
465 label="Select Class" 465 label="Select Class"
466 v-model="selectTimeTable.select" 466 v-model="selectTimeTable.select"
467 item-text="classNum" 467 item-text="classNum"
468 item-value="_id" 468 item-value="_id"
469 name="Select Class" 469 name="Select Class"
470 @change="getSections(selectTimeTable.select)" 470 @change="getSections(selectTimeTable.select)"
471 required 471 required
472 ></v-select> 472 ></v-select>
473 </v-flex> 473 </v-flex>
474 </v-layout> 474 </v-layout>
475 <v-layout class="hidden-xl-only hidden-lg-only hidden-md-only"> 475 <v-layout class="hidden-xl-only hidden-lg-only hidden-md-only">
476 <v-flex xs4 sm2 class="mt-4 ml-2"> 476 <v-flex xs4 sm2 class="mt-4 ml-2">
477 <label>Select Section:</label> 477 <label>Select Section:</label>
478 </v-flex> 478 </v-flex>
479 <v-flex xs6 sm9> 479 <v-flex xs6 sm9>
480 <v-select 480 <v-select
481 :items="addSection" 481 :items="addSection"
482 label="Select Section" 482 label="Select Section"
483 v-model="selectTimeTable.selectSection" 483 v-model="selectTimeTable.selectSection"
484 item-text="name" 484 item-text="name"
485 item-value="_id" 485 item-value="_id"
486 name="Select Section" 486 name="Select Section"
487 required 487 required
488 ></v-select> 488 ></v-select>
489 </v-flex> 489 </v-flex>
490 </v-layout> 490 </v-layout>
491 <v-layout class="hidden-xl-only hidden-lg-only hidden-md-only"> 491 <v-layout class="hidden-xl-only hidden-lg-only hidden-md-only">
492 <v-flex xs12> 492 <v-flex xs12>
493 <v-btn @click="findTimeTable()" round dark :loading="loading" class="right mr-4 mb-2">Find</v-btn> 493 <v-btn @click="findTimeTable()" round dark :loading="loading" class="right mr-4 mb-2">Find</v-btn>
494 </v-flex> 494 </v-flex>
495 </v-layout> 495 </v-layout>
496 </v-card>--> 496 </v-card>-->
497 <v-flex xs12> 497 <v-flex xs12>
498 <v-toolbar color="transparent" flat> 498 <v-toolbar color="transparent" flat>
499 <v-btn 499 <v-btn
500 fab 500 fab
501 dark 501 dark
502 class="open-dialog-button hidden-xl-only hidden-md-only hidden-lg-only" 502 class="open-dialog-button hidden-xl-only hidden-md-only hidden-lg-only"
503 small 503 small
504 @click="addTimeTableDialog = true" 504 @click="addTimeTableDialog = true"
505 > 505 >
506 <v-icon dark>add</v-icon> 506 <v-icon dark>add</v-icon>
507 </v-btn> 507 </v-btn>
508 <v-btn 508 <v-btn
509 round 509 round
510 class="open-dialog-button hidden-sm-only hidden-xs-only" 510 class="open-dialog-button hidden-sm-only hidden-xs-only"
511 dark 511 dark
512 @click="addTimeTableDialog = true" 512 @click="addTimeTableDialog = true"
513 > 513 >
514 <v-icon class="white--text pr-1" size="20">add</v-icon>Add Time Table 514 <v-icon class="white--text pr-1" size="20">add</v-icon>Add Time Table
515 </v-btn> 515 </v-btn>
516 <v-flex xs4 md2> 516 <v-flex xs4 md2>
517 <v-select 517 <v-select
518 :items="addclass" 518 :items="addclass"
519 label="Select Class" 519 label="Select Class"
520 v-model="selectTimeTable.select" 520 v-model="selectTimeTable.select"
521 item-text="classNum" 521 item-text="classNum"
522 item-value="_id" 522 item-value="_id"
523 name="Select Class" 523 name="Select Class"
524 @change="getSections(selectTimeTable.select)" 524 @change="getSections(selectTimeTable.select)"
525 required 525 required
526 ></v-select> 526 ></v-select>
527 </v-flex> 527 </v-flex>
528 <v-flex xs4 md2 class="ml-4"> 528 <v-flex xs4 md2 class="ml-4">
529 <v-select 529 <v-select
530 :items="addSection" 530 :items="addSection"
531 label="Select Section" 531 label="Select Section"
532 v-model="selectTimeTable.selectSection" 532 v-model="selectTimeTable.selectSection"
533 item-text="name" 533 item-text="name"
534 item-value="_id" 534 item-value="_id"
535 name="Select Section" 535 name="Select Section"
536 required 536 required
537 ></v-select> 537 ></v-select>
538 </v-flex> 538 </v-flex>
539 <v-spacer></v-spacer> 539 <v-spacer></v-spacer>
540 <v-btn 540 <v-btn
541 @click="findTimeTable()" 541 @click="findTimeTable()"
542 round 542 round
543 dark 543 dark
544 :loading="loading" 544 :loading="loading"
545 class="right mb-2 open-dialog-button" 545 class="right mb-2 open-dialog-button"
546 >Find</v-btn> 546 >Find</v-btn>
547 <v-card-title class="body-1" v-show="show"> 547 <v-card-title class="body-1" v-show="show">
548 <v-btn icon large flat @click="displaySearch"> 548 <v-btn icon large flat @click="displaySearch">
549 <v-avatar size="27"> 549 <v-avatar size="27">
550 <img src="/static/icon/search.png" alt="icon" /> 550 <img src="/static/icon/search.png" alt="icon" />
551 </v-avatar> 551 </v-avatar>
552 </v-btn> 552 </v-btn>
553 </v-card-title> 553 </v-card-title>
554 <v-flex xs8 sm8 md3 lg2 v-if="showSearch"> 554 <v-flex xs8 sm8 md3 lg2 v-if="showSearch">
555 <v-layout> 555 <v-layout>
556 <v-text-field 556 <v-text-field
557 autofocus 557 autofocus
558 v-model="search" 558 v-model="search"
559 label="Search" 559 label="Search"
560 prepend-inner-icon="search" 560 prepend-inner-icon="search"
561 color="primary" 561 color="primary"
562 ></v-text-field> 562 ></v-text-field>
563 <v-icon @click="closeSearch" color="error">close</v-icon> 563 <v-icon @click="closeSearch" color="error">close</v-icon>
564 </v-layout> 564 </v-layout>
565 </v-flex> 565 </v-flex>
566 </v-toolbar> 566 </v-toolbar>
567 <v-data-table 567 <v-data-table
568 :headers="headers" 568 :headers="headers"
569 :items="desserts" 569 :items="desserts"
570 :pagination.sync="pagination" 570 :pagination.sync="pagination"
571 :search="search" 571 :search="search"
572 item-key="_id" 572 item-key="_id"
573 > 573 >
574 <template slot="items" slot-scope="props"> 574 <template slot="items" slot-scope="props">
575 <tr 575 <tr
576 style="cursor: pointer;" 576 style="cursor: pointer;"
577 class="tr" 577 class="tr"
578 @click="getTimeTable(props.item), props.expanded = !props.expanded" 578 @click="getTimeTable(props.item), props.expanded = !props.expanded"
579 > 579 >
580 <td class="td td-row">{{ props.index + 1}}</td> 580 <td class="td td-row">{{ props.index + 1}}</td>
581 <td class="text-xs-center td td-row">{{ props.item.classData.classNum}}</td> 581 <td class="text-xs-center td td-row">{{ props.item.classData.classNum}}</td>
582 <td class="text-xs-center td td-row">{{ props.item.sectionData.name }}</td> 582 <td class="text-xs-center td td-row">{{ props.item.sectionData.name }}</td>
583 <td class="text-xs-center td td-row"> 583 <td class="text-xs-center td td-row">
584 <span> 584 <span>
585 <v-tooltip top> 585 <v-tooltip top>
586 <img 586 <img
587 slot="activator" 587 slot="activator"
588 style="cursor:pointer; width:20px; height:20px; " 588 style="cursor:pointer; width:20px; height:20px; "
589 class="mr-3" 589 class="mr-3"
590 @click="editItem(props.item)" 590 @click="editItem(props.item)"
591 src="/static/icon/edit.png" 591 src="/static/icon/edit.png"
592 /> 592 />
593 <span>Edit</span> 593 <span>Edit</span>
594 </v-tooltip> 594 </v-tooltip>
595 <v-tooltip top> 595 <v-tooltip top>
596 <img 596 <img
597 slot="activator" 597 slot="activator"
598 style="cursor:pointer; width:20px; height:20px; " 598 style="cursor:pointer; width:20px; height:20px; "
599 class="mr-3" 599 class="mr-3"
600 @click="deleteItem(props.item)" 600 @click="deleteItem(props.item)"
601 src="/static/icon/delete.png" 601 src="/static/icon/delete.png"
602 /> 602 />
603 <span>Delete</span> 603 <span>Delete</span>
604 </v-tooltip> 604 </v-tooltip>
605 <v-tooltip top> 605 <v-tooltip top>
606 <img 606 <img
607 slot="activator" 607 slot="activator"
608 style="cursor:pointer; width:20px; height:20px; " 608 style="cursor:pointer; width:20px; height:20px; "
609 class="mr-3" 609 class="mr-3"
610 src="/static/icon/add1.png" 610 src="/static/icon/add1.png"
611 @click="addSchedule(props.item._id)" 611 @click="addSchedule(props.item._id)"
612 /> 612 />
613 <span>Add</span> 613 <span>Add</span>
614 </v-tooltip> 614 </v-tooltip>
615 </span> 615 </span>
616 </td> 616 </td>
617 </tr> 617 </tr>
618 </template> 618 </template>
619 <template slot="expand" slot-scope="props"> 619 <template slot="expand" slot-scope="props">
620 <v-data-table 620 <v-data-table
621 :items="timeTableList.schedule" 621 :items="timeTableList.schedule"
622 hide-actions 622 hide-actions
623 item-key="title" 623 item-key="title"
624 style="width: auto;" 624 style="width: auto;"
625 > 625 >
626 <template slot="items" slot-scope="props"> 626 <template slot="items" slot-scope="props">
627 <tr class="tr"> 627 <tr class="tr">
628 <td class="text-xs-left subheading table-td td td-row"> 628 <td class="text-xs-left subheading table-td td td-row">
629 <b>{{ props.item.day }}</b> 629 <b>{{ props.item.day }}</b>
630 </td> 630 </td>
631 <td class="table-td td td-row"> 631 <td class="table-td td td-row">
632 <b>Subject</b> 632 <b>Subject</b>
633 <br /> 633 <br />
634 <b>Time In</b> 634 <b>Time In</b>
635 <br /> 635 <br />
636 <b>Time Out</b> 636 <b>Time Out</b>
637 </td> 637 </td>
638 <td v-for="list in props.item.lectures" class="table-td td td-row"> 638 <td v-for="list in props.item.lectures" class="table-td td td-row">
639 <b>{{ list.subjectName }}</b> 639 <b>{{ list.subjectName }}</b>
640 <img 640 <img
641 style="cursor:pointer; width:20px; height:18px; " 641 style="cursor:pointer; width:20px; height:18px; "
642 class="mr-2 ml-2" 642 class="mr-2 ml-2"
643 src="/static/icon/edit1.png" 643 src="/static/icon/edit1.png"
644 @click="updateTimeTable(list, timeTableList,props.item._id)" 644 @click="updateTimeTable(list, timeTableList,props.item._id)"
645 /> 645 />
646 <img 646 <img
647 style="cursor:pointer; width:20px; height:20px; " 647 style="cursor:pointer; width:20px; height:20px; "
648 src="/static/icon/delete1.png" 648 src="/static/icon/delete1.png"
649 @click="deleteTimeTable(list,props.item.lectures)" 649 @click="deleteTimeTable(list,props.item.lectures)"
650 /> 650 />
651 <br /> 651 <br />
652 {{list.timeIn}} 652 {{list.timeIn}}
653 <br /> 653 <br />
654 {{list.timeOut}} 654 {{list.timeOut}}
655 </td> 655 </td>
656 <td class="td td-row"> 656 <td class="td td-row">
657 <v-tooltip top> 657 <v-tooltip top>
658 <v-icon 658 <v-icon
659 slot="activator" 659 slot="activator"
660 color="black" 660 color="black"
661 @click="addLecture(props.item._id, timeTableList._id)" 661 @click="addLecture(props.item._id, timeTableList._id)"
662 >add_circle_outline</v-icon> 662 >add_circle_outline</v-icon>
663 <span>Add</span> 663 <span>Add</span>
664 </v-tooltip> 664 </v-tooltip>
665 </td> 665 </td>
666 </tr> 666 </tr>
667 </template> 667 </template>
668 </v-data-table> 668 </v-data-table>
669 </template> 669 </template>
670 <v-alert 670 <v-alert
671 slot="no-results" 671 slot="no-results"
672 :value="true" 672 :value="true"
673 color="error" 673 color="error"
674 icon="warning" 674 icon="warning"
675 >Your search for "{{ search }}" found no results.</v-alert> 675 >Your search for "{{ search }}" found no results.</v-alert>
676 </v-data-table> 676 </v-data-table>
677 <br /> 677 <br />
678 <br /> 678 <br />
679 </v-flex> 679 </v-flex>
680 680
681 <!-- ****** ADD TIME-TABLE ****** --> 681 <!-- ****** ADD TIME-TABLE ****** -->
682 <v-dialog v-model="addTimeTableDialog" max-width="600px" v-if="addTimeTableDialog"> 682 <v-dialog v-model="addTimeTableDialog" max-width="600px" v-if="addTimeTableDialog">
683 <v-card flat class="card-style pa-2" dark> 683 <v-card flat class="card-style pa-2" dark>
684 <v-layout> 684 <v-layout>
685 <v-flex xs12> 685 <v-flex xs12>
686 <label class="title text-xs-center">Add Time Table</label> 686 <label class="title text-xs-center">Add Time Table</label>
687 <v-icon size="24" class="right" @click="closeAddTimeTableModel">cancel</v-icon> 687 <v-icon size="24" class="right" @click="closeAddTimeTableModel">cancel</v-icon>
688 </v-flex> 688 </v-flex>
689 </v-layout> 689 </v-layout>
690 <v-form ref="form" v-model="valid" lazy-validation> 690 <v-form ref="form" v-model="valid" lazy-validation>
691 <v-container fluid class="pt-3"> 691 <v-container fluid class="pt-3">
692 <v-flex xs12> 692 <v-flex xs12>
693 <v-layout> 693 <v-layout>
694 <v-flex xs4 class="pt-4 subheading"> 694 <v-flex xs4 class="pt-4 subheading">
695 <label class="right hidden-xs-only hidden-sm-only">Select Class:</label> 695 <label class="right hidden-xs-only hidden-sm-only">Select Class:</label>
696 <label class="right hidden-lg-only hidden-md-only hidden-xl-only">Class:</label> 696 <label class="right hidden-lg-only hidden-md-only hidden-xl-only">Class:</label>
697 </v-flex> 697 </v-flex>
698 <v-flex xs8 sm6 class="ml-3"> 698 <v-flex xs8 sm6 class="ml-3">
699 <v-select 699 <v-select
700 :items="addclass" 700 :items="addclass"
701 label="Select Class" 701 label="Select Class"
702 v-model="timeTable.select" 702 v-model="timeTable.select"
703 item-text="classNum" 703 item-text="classNum"
704 item-value="_id" 704 item-value="_id"
705 @change="getSections(timeTable.select)" 705 @change="getSections(timeTable.select)"
706 :rules="classRules" 706 :rules="classRules"
707 required 707 required
708 ></v-select> 708 ></v-select>
709 </v-flex> 709 </v-flex>
710 </v-layout> 710 </v-layout>
711 </v-flex> 711 </v-flex>
712 <v-flex xs12> 712 <v-flex xs12>
713 <v-layout> 713 <v-layout>
714 <v-flex xs4 class="pt-4 subheading"> 714 <v-flex xs4 class="pt-4 subheading">
715 <label class="right hidden-xs-only hidden-sm-only">Select Section:</label> 715 <label class="right hidden-xs-only hidden-sm-only">Select Section:</label>
716 <label class="right hidden-lg-only hidden-md-only hidden-xl-only">Section:</label> 716 <label class="right hidden-lg-only hidden-md-only hidden-xl-only">Section:</label>
717 </v-flex> 717 </v-flex>
718 <v-flex sm6 xs8 class="ml-3"> 718 <v-flex sm6 xs8 class="ml-3">
719 <v-select 719 <v-select
720 :items="addSection" 720 :items="addSection"
721 label="Select Section" 721 label="Select Section"
722 v-model="timeTable.selectSection" 722 v-model="timeTable.selectSection"
723 item-text="name" 723 item-text="name"
724 item-value="_id" 724 item-value="_id"
725 :rules="sectionRules" 725 :rules="sectionRules"
726 @change="getClassSubject(timeTable.select)" 726 @change="getClassSubject(timeTable.select)"
727 required 727 required
728 ></v-select> 728 ></v-select>
729 </v-flex> 729 </v-flex>
730 </v-layout> 730 </v-layout>
731 <v-layout> 731 <v-layout>
732 <v-flex xs4 class="pt-4 subheading"> 732 <v-flex xs4 class="pt-4 subheading">
733 <label class="right hidden-xs-only hidden-sm-only">Subject Name:</label> 733 <label class="right hidden-xs-only hidden-sm-only">Subject Name:</label>
734 <label class="right hidden-lg-only hidden-md-only hidden-xl-only">Subject:</label> 734 <label class="right hidden-lg-only hidden-md-only hidden-xl-only">Subject:</label>
735 </v-flex> 735 </v-flex>
736 <v-flex xs8 sm6 class="ml-3"> 736 <v-flex xs8 sm6 class="ml-3">
737 <v-select 737 <v-select
738 :items="subjectList.subjects" 738 :items="subjectList.subjects"
739 label="Select Subject" 739 label="Select Subject"
740 v-model="timeTable.subjectName" 740 v-model="timeTable.subjectName"
741 item-text="subjectName" 741 item-text="subjectName"
742 item-value="subjectName" 742 item-value="subjectName"
743 :rules="subjectNameRules" 743 :rules="subjectNameRules"
744 required 744 required
745 ></v-select> 745 ></v-select>
746 </v-flex> 746 </v-flex>
747 </v-layout> 747 </v-layout>
748 </v-flex> 748 </v-flex>
749 <v-flex xs12> 749 <v-flex xs12>
750 <v-layout> 750 <v-layout>
751 <v-flex xs4 class="pt-4 subheading"> 751 <v-flex xs4 class="pt-4 subheading">
752 <label class="right hidden-xs-only hidden-sm-only">Select Teacher:</label> 752 <label class="right hidden-xs-only hidden-sm-only">Select Teacher:</label>
753 <label class="right hidden-lg-only hidden-md-only hidden-xl-only">Teacher:</label> 753 <label class="right hidden-lg-only hidden-md-only hidden-xl-only">Teacher:</label>
754 </v-flex> 754 </v-flex>
755 <v-flex xs8 sm6 class="ml-3"> 755 <v-flex xs8 sm6 class="ml-3">
756 <v-select 756 <v-select
757 :items="addTeachers" 757 :items="addTeachers"
758 label="Select Teacher" 758 label="Select Teacher"
759 v-model="timeTable.selectTeacher" 759 v-model="timeTable.selectTeacher"
760 item-text="name" 760 item-text="name"
761 item-value="_id" 761 item-value="_id"
762 :rules="teacherRules" 762 :rules="teacherRules"
763 required 763 required
764 ></v-select> 764 ></v-select>
765 </v-flex> 765 </v-flex>
766 </v-layout> 766 </v-layout>
767 </v-flex> 767 </v-flex>
768 <v-flex xs12> 768 <v-flex xs12>
769 <v-layout> 769 <v-layout>
770 <v-flex xs4 class="pt-4 subheading"> 770 <v-flex xs4 class="pt-4 subheading">
771 <label class="right">Select Day:</label> 771 <label class="right">Select Day:</label>
772 </v-flex> 772 </v-flex>
773 <v-flex xs8 sm6 class="ml-3"> 773 <v-flex xs8 sm6 class="ml-3">
774 <v-select 774 <v-select
775 :items="addOneDay" 775 :items="addOneDay"
776 label="Select Day" 776 label="Select Day"
777 v-model="timeTable.selectDay" 777 v-model="timeTable.selectDay"
778 :rules="dayRules" 778 :rules="dayRules"
779 item-text="name" 779 item-text="name"
780 item-value="_id" 780 item-value="_id"
781 required 781 required
782 ></v-select> 782 ></v-select>
783 </v-flex> 783 </v-flex>
784 </v-layout> 784 </v-layout>
785 </v-flex> 785 </v-flex>
786 <!-- <v-flex xs12> 786 <!-- <v-flex xs12>
787 <v-layout> 787 <v-layout>
788 <v-flex xs4 class="pt-4 subheading"> 788 <v-flex xs4 class="pt-4 subheading">
789 <label class="right hidden-xs-only hidden-sm-only">Subject Name:</label> 789 <label class="right hidden-xs-only hidden-sm-only">Subject Name:</label>
790 <label class="right hidden-lg-only hidden-md-only hidden-xl-only">Subject:</label> 790 <label class="right hidden-lg-only hidden-md-only hidden-xl-only">Subject:</label>
791 </v-flex> 791 </v-flex>
792 <v-flex xs8 sm6 class="ml-3"> 792 <v-flex xs8 sm6 class="ml-3">
793 <v-text-field 793 <v-text-field
794 placeholder="fill your Subject Name" 794 placeholder="fill your Subject Name"
795 :rules="subjectNameRules" 795 :rules="subjectNameRules"
796 v-model="timeTable.subjectName" 796 v-model="timeTable.subjectName"
797 type="text" 797 type="text"
798 required 798 required
799 ></v-text-field> 799 ></v-text-field>
800 </v-flex> 800 </v-flex>
801 </v-layout> 801 </v-layout>
802 </v-flex>--> 802 </v-flex>-->
803 <v-flex xs12> 803 <v-flex xs12>
804 <v-layout> 804 <v-layout>
805 <v-flex xs4 class="pt-4 subheading"> 805 <v-flex xs4 class="pt-4 subheading">
806 <label class="right">Time In:</label> 806 <label class="right">Time In:</label>
807 </v-flex> 807 </v-flex>
808 <v-flex xs8 sm6 class="ml-3"> 808 <v-flex xs8 sm6 class="ml-3">
809 <v-menu 809 <v-menu
810 ref="menuA" 810 ref="menuA"
811 :close-on-content-click="false" 811 :close-on-content-click="false"
812 v-model="menu2" 812 v-model="menu2"
813 :nudge-right="40" 813 :nudge-right="40"
814 :return-value.sync="timeTable.timeIn" 814 :return-value.sync="timeTable.timeIn"
815 lazy 815 lazy
816 transition="scale-transition" 816 transition="scale-transition"
817 offset-y 817 offset-y
818 full-width 818 full-width
819 max-width="290px" 819 max-width="290px"
820 min-width="290px" 820 min-width="290px"
821 > 821 >
822 <v-text-field 822 <v-text-field
823 slot="activator" 823 slot="activator"
824 v-model="timeTable.timeIn" 824 v-model="timeTable.timeIn"
825 label="Select your timeIn" 825 label="Select your timeIn"
826 append-icon="access_time" 826 append-icon="access_time"
827 :rules="timeInRules" 827 :rules="timeInRules"
828 readonly 828 readonly
829 ></v-text-field> 829 ></v-text-field>
830 <v-time-picker 830 <v-time-picker
831 v-model="timeTable.timeIn" 831 v-model="timeTable.timeIn"
832 @change="$refs.menuA.save(timeTable.timeIn)" 832 @change="$refs.menuA.save(timeTable.timeIn)"
833 ></v-time-picker> 833 ></v-time-picker>
834 </v-menu> 834 </v-menu>
835 </v-flex> 835 </v-flex>
836 </v-layout> 836 </v-layout>
837 </v-flex> 837 </v-flex>
838 <v-flex xs12> 838 <v-flex xs12>
839 <v-layout> 839 <v-layout>
840 <v-flex xs4 class="pt-4 subheading"> 840 <v-flex xs4 class="pt-4 subheading">
841 <label class="right">Time Out:</label> 841 <label class="right">Time Out:</label>
842 </v-flex> 842 </v-flex>
843 <v-flex xs8 sm6 class="ml-3"> 843 <v-flex xs8 sm6 class="ml-3">
844 <v-menu 844 <v-menu
845 ref="menu" 845 ref="menu"
846 :close-on-content-click="false" 846 :close-on-content-click="false"
847 v-model="menu1" 847 v-model="menu1"
848 :nudge-right="40" 848 :nudge-right="40"
849 :return-value.sync="timeTable.timeOut" 849 :return-value.sync="timeTable.timeOut"
850 lazy 850 lazy
851 transition="scale-transition" 851 transition="scale-transition"
852 offset-y 852 offset-y
853 full-width 853 full-width
854 max-width="290px" 854 max-width="290px"
855 min-width="290px" 855 min-width="290px"
856 > 856 >
857 <v-text-field 857 <v-text-field
858 slot="activator" 858 slot="activator"
859 v-model="timeTable.timeOut" 859 v-model="timeTable.timeOut"
860 label="Select your Time Out" 860 label="Select your Time Out"
861 append-icon="access_time" 861 append-icon="access_time"
862 :rules="timeOutRules" 862 :rules="timeOutRules"
863 readonly 863 readonly
864 ></v-text-field> 864 ></v-text-field>
865 <v-time-picker 865 <v-time-picker
866 v-model="timeTable.timeOut" 866 v-model="timeTable.timeOut"
867 @change="$refs.menu.save(timeTable.timeOut)" 867 @change="$refs.menu.save(timeTable.timeOut)"
868 ></v-time-picker> 868 ></v-time-picker>
869 </v-menu> 869 </v-menu>
870 </v-flex> 870 </v-flex>
871 </v-layout> 871 </v-layout>
872 </v-flex> 872 </v-flex>
873 <v-layout> 873 <v-layout>
874 <v-flex xs12 sm11> 874 <v-flex xs12 sm11>
875 <v-layout> 875 <v-layout>
876 <v-spacer></v-spacer> 876 <v-spacer></v-spacer>
877 <v-btn @click="clear" round class="clear-button" dark>clear</v-btn> 877 <v-btn @click="clear" round class="clear-button" dark>clear</v-btn>
878 <v-btn @click="submit" round dark :loading="loading" class="add-button">Add</v-btn> 878 <v-btn @click="submit" round dark :loading="loading" class="add-button">Add</v-btn>
879 </v-layout> 879 </v-layout>
880 </v-flex> 880 </v-flex>
881 </v-layout> 881 </v-layout>
882 </v-container> 882 </v-container>
883 </v-form> 883 </v-form>
884 </v-card> 884 </v-card>
885 </v-dialog> 885 </v-dialog>
886 <div class="loader" v-if="showLoader"> 886 <div class="loader" v-if="showLoader">
887 <v-progress-circular indeterminate color="white"></v-progress-circular> 887 <v-progress-circular indeterminate color="white"></v-progress-circular>
888 </div> 888 </div>
889 <v-snackbar 889 <v-snackbar
890 :timeout="timeout" 890 :timeout="timeout"
891 :top="y === 'top'" 891 :top="y === 'top'"
892 :right="x === 'right'" 892 :right="x === 'right'"
893 :vertical="mode === 'vertical'" 893 :vertical="mode === 'vertical'"
894 v-model="snackbar" 894 v-model="snackbar"
895 :color="color" 895 :color="color"
896 >{{ text }}</v-snackbar> 896 >{{ text }}</v-snackbar>
897 </v-container> 897 </v-container>
898 </template> 898 </template>
899 <script> 899 <script>
900 import http from "@/Services/http.js"; 900 import http from "@/Services/http.js";
901 import Util from "@/util"; 901 import Util from "@/util";
902 902
903 export default { 903 export default {
904 data: () => ({ 904 data: () => ({
905 y: "top", 905 y: "top",
906 x: "right", 906 x: "right",
907 mode: "", 907 mode: "",
908 timeout: 3000, 908 timeout: 3000,
909 text: "", 909 text: "",
910 search: "", 910 search: "",
911 color: "", 911 color: "",
912 snackbar: false, 912 snackbar: false,
913 loading: false, 913 loading: false,
914 showLoader: false, 914 showLoader: false,
915 dialog: false, 915 dialog: false,
916 show: true, 916 show: true,
917 showSearch: false, 917 showSearch: false,
918 dialogAddLecture: false, 918 dialogAddLecture: false,
919 dialogUpdateLectures: false, 919 dialogUpdateLectures: false,
920 dialogSchedule: false, 920 dialogSchedule: false,
921 dialog1: false, 921 dialog1: false,
922 valid: true, 922 valid: true,
923 addTimeTableDialog: false, 923 addTimeTableDialog: false,
924 validAddDay: true, 924 validAddDay: true,
925 loadingFindData: false, 925 loadingFindData: false,
926 addclass: [], 926 addclass: [],
927 addSection: [], 927 addSection: [],
928 subjectList: [], 928 subjectList: [],
929 addTeachers: [], 929 addTeachers: [],
930 gender: ["Male", "Female"], 930 gender: ["Male", "Female"],
931 pagination: { 931 pagination: {
932 rowsPerPage: 15, 932 rowsPerPage: 15,
933 }, 933 },
934 imageData: {}, 934 imageData: {},
935 imageName: "", 935 imageName: "",
936 imageUrl: "", 936 imageUrl: "",
937 imageFile: "", 937 imageFile: "",
938 timeInRules: [(v) => !!v || "Time In is required"], 938 timeInRules: [(v) => !!v || "Time In is required"],
939 timeOutRules: [(v) => !!v || "Time Out is required"], 939 timeOutRules: [(v) => !!v || "Time Out is required"],
940 lectureRules: [(v) => !!v || "Lecture No is required"], 940 lectureRules: [(v) => !!v || "Lecture No is required"],
941 subjectNameRules: [(v) => !!v || "Subject Name is required"], 941 subjectNameRules: [(v) => !!v || "Subject Name is required"],
942 classRules: [(v) => !!v || "Class Name is required"], 942 classRules: [(v) => !!v || "Class Name is required"],
943 sectionRules: [(v) => !!v || "Section Name is required"], 943 sectionRules: [(v) => !!v || "Section Name is required"],
944 sectionRules: [(v) => !!v || "Section Name is required"], 944 sectionRules: [(v) => !!v || "Section Name is required"],
945 teacherRules: [(v) => !!v || "Teacher Name is required"], 945 teacherRules: [(v) => !!v || "Teacher Name is required"],
946 selecDayRule: [(v) => !!v || "Day is required"], 946 selecDayRule: [(v) => !!v || "Day is required"],
947 dayRules: [(v) => !!v || "Day is required"], 947 dayRules: [(v) => !!v || "Day is required"],
948 getParticulerLecture: "", 948 getParticulerLecture: "",
949 headers: [ 949 headers: [
950 { 950 {
951 text: "No", 951 text: "No",
952 align: "", 952 align: "",
953 sortable: false, 953 sortable: false,
954 value: "No", 954 value: "No",
955 }, 955 },
956 { 956 {
957 text: "Class Name", 957 text: "Class Name",
958 value: "classData.classNum", 958 value: "classData.classNum",
959 sortable: false, 959 sortable: false,
960 align: "center", 960 align: "center",
961 }, 961 },
962 { 962 {
963 text: "Section Name", 963 text: "Section Name",
964 value: "sectionData.name", 964 value: "sectionData.name",
965 sortable: false, 965 sortable: false,
966 align: "center", 966 align: "center",
967 }, 967 },
968 { text: "Action", value: "", sortable: false, align: "center" }, 968 { text: "Action", value: "", sortable: false, align: "center" },
969 ], 969 ],
970 daysHeaders: [ 970 daysHeaders: [
971 { text: "Day", value: "dayday", sortable: false, align: "center" }, 971 { text: "Day", value: "dayday", sortable: false, align: "center" },
972 { 972 {
973 text: "Subject Name", 973 text: "Subject Name",
974 value: "subjectName", 974 value: "subjectName",
975 sortable: false, 975 sortable: false,
976 align: "center", 976 align: "center",
977 }, 977 },
978 { text: "Time In", value: "timeIn", sortable: false, align: "center" }, 978 { text: "Time In", value: "timeIn", sortable: false, align: "center" },
979 { text: "Time Out", value: "timeOut", sortable: false, align: "center" }, 979 { text: "Time Out", value: "timeOut", sortable: false, align: "center" },
980 ], 980 ],
981 addOneDay: [ 981 addOneDay: [
982 "Monday", 982 "Monday",
983 "Tuesday", 983 "Tuesday",
984 "Wednesday", 984 "Wednesday",
985 "Thursday", 985 "Thursday",
986 "Friday", 986 "Friday",
987 "Saturday", 987 "Saturday",
988 "Sunday", 988 "Sunday",
989 ], 989 ],
990 schedule: { 990 schedule: {
991 selectDay: "", 991 selectDay: "",
992 }, 992 },
993 desserts: [], 993 desserts: [],
994 timeTableList: [], 994 timeTableList: [],
995 editedIndex: -1, 995 editedIndex: -1,
996 selectTimeTable: { 996 selectTimeTable: {
997 select: "", 997 select: "",
998 selectSection: "", 998 selectSection: "",
999 }, 999 },
1000 timeTable: { 1000 timeTable: {
1001 select: "", 1001 select: "",
1002 selectSection: "", 1002 selectSection: "",
1003 selectDay: "", 1003 selectDay: "",
1004 timeIn: null, 1004 timeIn: null,
1005 timeOut: null, 1005 timeOut: null,
1006 subjectName: "", 1006 subjectName: "",
1007 selectTeacher: "", 1007 selectTeacher: "",
1008 }, 1008 },
1009 editedItem: { 1009 editedItem: {
1010 classNum: "", 1010 classNum: "",
1011 selectSection: "", 1011 selectSection: "",
1012 }, 1012 },
1013 addlectures: { 1013 addlectures: {
1014 timeIn: null, 1014 timeIn: null,
1015 timeOut: null, 1015 timeOut: null,
1016 subjectName: "", 1016 subjectName: "",
1017 teacherId: "", 1017 teacherId: "",
1018 scheduleId: "", 1018 scheduleId: "",
1019 timeTableId: "", 1019 timeTableId: "",
1020 select: "", 1020 select: "",
1021 }, 1021 },
1022 updateLectures: { 1022 updateLectures: {
1023 timeIn: null, 1023 timeIn: null,
1024 timeOut: null, 1024 timeOut: null,
1025 subjectName: "", 1025 subjectName: "",
1026 teacherId: "", 1026 teacherId: "",
1027 select: "", 1027 select: "",
1028 }, 1028 },
1029 updateLecturesId: { 1029 updateLecturesId: {
1030 lectureId: "", 1030 lectureId: "",
1031 scheduleId: "", 1031 scheduleId: "",
1032 }, 1032 },
1033 menu1: false, 1033 menu1: false,
1034 menu2: false, 1034 menu2: false,
1035 menu3: false, 1035 menu3: false,
1036 menu4: false, 1036 menu4: false,
1037 menu5: false, 1037 menu5: false,
1038 menu6: false, 1038 menu6: false,
1039 scheduleDayId: "", 1039 scheduleDayId: "",
1040 showData: false, 1040 showData: false,
1041 }), 1041 }),
1042 watch: { 1042 watch: {
1043 addTimeTableDialog: function (val) { 1043 addTimeTableDialog: function (val) {
1044 if (!val) { 1044 if (!val) {
1045 this.timeTable = []; 1045 this.timeTable = [];
1046 } 1046 }
1047 }, 1047 },
1048 }, 1048 },
1049 methods: { 1049 methods: {
1050 findTimeTable() { 1050 findTimeTable() {
1051 this.loadingFindData = true; 1051 this.loadingFindData = true;
1052 http() 1052 http()
1053 .get("/getParticularClassTimeTable", { 1053 .get("/getParticularClassTimeTable", {
1054 params: { 1054 params: {
1055 sectionId: this.selectTimeTable.selectSection, 1055 sectionId: this.selectTimeTable.selectSection,
1056 classId: this.selectTimeTable.select, 1056 classId: this.selectTimeTable.select,
1057 }, 1057 },
1058 }) 1058 })
1059 .then((response) => { 1059 .then((response) => {
1060 this.desserts = response.data.data; 1060 this.desserts = response.data.data;
1061 if (this.desserts.length === 0) { 1061 if (this.desserts.length === 0) {
1062 this.showLoader = false; 1062 this.showLoader = false;
1063 this.snackbar = true; 1063 this.snackbar = true;
1064 this.text = "Data not found!"; 1064 this.text = "Data not found!";
1065 this.color = "error"; 1065 this.color = "error";
1066 return; 1066 return;
1067 } 1067 }
1068 this.showData = true; 1068 this.showData = true;
1069 this.loadingFindData = false; 1069 this.loadingFindData = false;
1070 }) 1070 })
1071 .catch((error) => { 1071 .catch((error) => {
1072 this.loadingFindData = false; 1072 this.loadingFindData = false;
1073 this.snackbar = true; 1073 this.snackbar = true;
1074 this.text = error.response.data.message; 1074 this.text = error.response.data.message;
1075 this.text = error.response.data.statusText; 1075 this.text = error.response.data.statusText;
1076 }); 1076 });
1077 }, 1077 },
1078 getSections(_id) { 1078 getSections(_id) {
1079 var token = this.$store.state.token; 1079 var token = this.$store.state.token;
1080 http() 1080 http()
1081 .get( 1081 .get(
1082 "/getSectionsList", 1082 "/getSectionsList",
1083 { params: { classId: _id } }, 1083 { params: { classId: _id } },
1084 { 1084 {
1085 headers: { Authorization: "Bearer " + token }, 1085 headers: { Authorization: "Bearer " + token },
1086 } 1086 }
1087 ) 1087 )
1088 .then((response) => { 1088 .then((response) => {
1089 this.addSection = response.data.data; 1089 this.addSection = response.data.data;
1090 }) 1090 })
1091 .catch((err) => { 1091 .catch((err) => {
1092 // console.log("err====>", err); 1092 // console.log("err====>", err);
1093 }); 1093 });
1094 }, 1094 },
1095 getClassSubject(_id) { 1095 getClassSubject(_id) {
1096 this.showLoader = true; 1096 this.showLoader = true;
1097 // this.classId = this.classId; 1097 // this.classId = this.classId;
1098 http() 1098 http()
1099 .get( 1099 .get(
1100 "/getParticularClass", 1100 "/getParticularClass",
1101 { params: { classId: _id } }, 1101 { params: { classId: _id } },
1102 { 1102 {
1103 headers: { Authorization: "Bearer " + this.token }, 1103 headers: { Authorization: "Bearer " + this.token },
1104 } 1104 }
1105 ) 1105 )
1106 .then((response) => { 1106 .then((response) => {
1107 this.subjectList = response.data.data; 1107 this.subjectList = response.data.data;
1108 this.showLoader = false; 1108 this.showLoader = false;
1109 }) 1109 })
1110 .catch((err) => { 1110 .catch((err) => {
1111 this.showLoader = false; 1111 this.showLoader = false;
1112 }); 1112 });
1113 }, 1113 },
1114 getTimeTable(item) { 1114 getTimeTable(item) {
1115 this.showLoader = true; 1115 this.showLoader = true;
1116 this.getParticulerLecture = item._id; 1116 this.getParticulerLecture = item._id;
1117 this.getTimeTableDayData(); 1117 this.getTimeTableDayData();
1118 }, 1118 },
1119 getTimeTableDayData() { 1119 getTimeTableDayData() {
1120 var token = this.$store.state.token; 1120 var token = this.$store.state.token;
1121 http() 1121 http()
1122 .get( 1122 .get(
1123 "/getParticularTimeTable", 1123 "/getParticularTimeTable",
1124 { params: { timeTableId: this.getParticulerLecture } }, 1124 { params: { timeTableId: this.getParticulerLecture } },
1125 { 1125 {
1126 headers: { Authorization: "Bearer " + token }, 1126 headers: { Authorization: "Bearer " + token },
1127 } 1127 }
1128 ) 1128 )
1129 .then((response) => { 1129 .then((response) => {
1130 this.timeTableList = response.data.data; 1130 this.timeTableList = response.data.data;
1131 this.showLoader = false; 1131 this.showLoader = false;
1132 }) 1132 })
1133 .catch((err) => { 1133 .catch((err) => {
1134 this.showLoader = false; 1134 this.showLoader = false;
1135 // console.log("err====>", err); 1135 // console.log("err====>", err);
1136 }); 1136 });
1137 }, 1137 },
1138 pickFile() { 1138 pickFile() {
1139 this.$refs.image.click(); 1139 this.$refs.image.click();
1140 }, 1140 },
1141 1141
1142 onFilePicked(e) { 1142 onFilePicked(e) {
1143 const files = e.target.files; 1143 const files = e.target.files;
1144 this.imageData.upload = e.target.files[0]; 1144 this.imageData.upload = e.target.files[0];
1145 if (files[0] !== undefined) { 1145 if (files[0] !== undefined) {
1146 this.imageName = files[0].name; 1146 this.imageName = files[0].name;
1147 if (this.imageName.lastIndexOf(".") <= 0) { 1147 if (this.imageName.lastIndexOf(".") <= 0) {
1148 return; 1148 return;
1149 } 1149 }
1150 const fr = new FileReader(); 1150 const fr = new FileReader();
1151 fr.readAsDataURL(files[0]); 1151 fr.readAsDataURL(files[0]);
1152 fr.addEventListener("load", () => { 1152 fr.addEventListener("load", () => {
1153 this.imageUrl = fr.result; 1153 this.imageUrl = fr.result;
1154 this.imageFile = files[0]; // this is an image file that can be sent to server... 1154 this.imageFile = files[0]; // this is an image file that can be sent to server...
1155 this.imageData.imageUrl = URL.createObjectURL(this.imageFile); 1155 this.imageData.imageUrl = URL.createObjectURL(this.imageFile);
1156 }); 1156 });
1157 } else { 1157 } else {
1158 this.imageName = ""; 1158 this.imageName = "";
1159 this.imageFile = ""; 1159 this.imageFile = "";
1160 this.imageUrl = ""; 1160 this.imageUrl = "";
1161 } 1161 }
1162 }, 1162 },
1163 // getTimeTableList() { 1163 // getTimeTableList() {
1164 // this.showLoader = true; 1164 // this.showLoader = true;
1165 // var token = this.$store.state.token; 1165 // var token = this.$store.state.token;
1166 // http() 1166 // http()
1167 // .get("/getTimeTablesList", { 1167 // .get("/getTimeTablesList", {
1168 // headers: { Authorization: "Bearer " + token } 1168 // headers: { Authorization: "Bearer " + token }
1169 // }) 1169 // })
1170 // .then(response => { 1170 // .then(response => {
1171 // this.desserts = response.data.data; 1171 // this.desserts = response.data.data;
1172 // this.showLoader = false; 1172 // this.showLoader = false;
1173 // // console.log("getTimeTableList=====>", response.data.data); 1173 // // console.log("getTimeTableList=====>", response.data.data);
1174 // }) 1174 // })
1175 // .catch(err => { 1175 // .catch(err => {
1176 // // console.log("err====>", err); 1176 // // console.log("err====>", err);
1177 // this.showLoader = false; 1177 // this.showLoader = false;
1178 // this.$router.replace({ path: "/" }); 1178 // this.$router.replace({ path: "/" });
1179 // }); 1179 // });
1180 // }, 1180 // },
1181 editItem(item) { 1181 editItem(item) {
1182 this.editedIndex = this.desserts.indexOf(item); 1182 this.editedIndex = this.desserts.indexOf(item);
1183 this.editedItem = Object.assign({}, item); 1183 this.editedItem = Object.assign({}, item);
1184 this.dialog = true; 1184 this.dialog = true;
1185 }, 1185 },
1186 updateTimeTable(timeToUpdate, classToUpdate, scheduleId) { 1186 updateTimeTable(timeToUpdate, classToUpdate, scheduleId) {
1187 this.updateLecturesId.scheduleId = scheduleId; 1187 this.updateLecturesId.scheduleId = scheduleId;
1188 this.updateLecturesId.lectureId = timeToUpdate._id; 1188 this.updateLecturesId.lectureId = timeToUpdate._id;
1189 this.updateLectures = timeToUpdate; 1189 this.updateLectures = timeToUpdate;
1190 this.dialogUpdateLectures = true; 1190 this.dialogUpdateLectures = true;
1191 }, 1191 },
1192 addLecture(scheduleId, timeTableId) { 1192 addLecture(scheduleId, timeTableId) {
1193 this.addlectures.scheduleId = scheduleId; 1193 this.addlectures.scheduleId = scheduleId;
1194 this.addlectures.timeTableId = timeTableId; 1194 this.addlectures.timeTableId = timeTableId;
1195 this.dialogAddLecture = true; 1195 this.dialogAddLecture = true;
1196 }, 1196 },
1197 AddLecture() { 1197 AddLecture() {
1198 if (this.$refs.lectureForm.validate()) { 1198 if (this.$refs.lectureForm.validate()) {
1199 http() 1199 http()
1200 .post("/addLecture", this.addlectures) 1200 .post("/addLecture", this.addlectures)
1201 .then((response) => { 1201 .then((response) => {
1202 this.snackbar = true; 1202 this.snackbar = true;
1203 this.text = "New Add Lecture successfully"; 1203 this.text = "New Add Lecture successfully";
1204 var token = this.$store.state.token; 1204 var token = this.$store.state.token;
1205 http() 1205 http()
1206 .get( 1206 .get(
1207 "/getParticularTimeTable", 1207 "/getParticularTimeTable",
1208 { params: { timeTableId: this.getParticulerLecture } }, 1208 { params: { timeTableId: this.getParticulerLecture } },
1209 { 1209 {
1210 headers: { Authorization: "Bearer " + token }, 1210 headers: { Authorization: "Bearer " + token },
1211 } 1211 }
1212 ) 1212 )
1213 .then((response) => { 1213 .then((response) => {
1214 this.timeTableList = response.data.data; 1214 this.timeTableList = response.data.data;
1215 this.snackbar = true; 1215 this.snackbar = true;
1216 this.text = response.data.message; 1216 this.text = response.data.message;
1217 this.color = "green"; 1217 this.color = "green";
1218 this.showLoader = false; 1218 this.showLoader = false;
1219 }) 1219 })
1220 .catch((err) => { 1220 .catch((err) => {
1221 this.showLoader = false; 1221 this.showLoader = false;
1222 // console.log("err====>", err); 1222 // console.log("err====>", err);
1223 this.snackbar = true; 1223 this.snackbar = true;
1224 this.color = "error"; 1224 this.color = "error";
1225 this.text = error.response.data.message; 1225 this.text = error.response.data.message;
1226 }); 1226 });
1227 this.closedialogLecture(); 1227 this.closedialogLecture();
1228 this.clearLeactureData(); 1228 this.clearLeactureData();
1229 }) 1229 })
1230 .catch((error) => { 1230 .catch((error) => {
1231 this.snackbar = true; 1231 this.snackbar = true;
1232 this.text = error.response.data.message; 1232 this.text = error.response.data.message;
1233 this.text = error.response.data.statusText; 1233 this.text = error.response.data.statusText;
1234 }); 1234 });
1235 } 1235 }
1236 }, 1236 },
1237 updateParticularTable() { 1237 updateParticularTable() {
1238 let EditLecture = { 1238 let EditLecture = {
1239 lectureId: this.updateLecturesId.lectureId, 1239 lectureId: this.updateLecturesId.lectureId,
1240 scheduleId: this.updateLecturesId.scheduleId, 1240 scheduleId: this.updateLecturesId.scheduleId,
1241 updatedLecture: { 1241 updatedLecture: {
1242 timeIn: this.updateLectures.timeIn, 1242 timeIn: this.updateLectures.timeIn,
1243 timeOut: this.updateLectures.timeOut, 1243 timeOut: this.updateLectures.timeOut,
1244 subjectName: this.updateLectures.subjectName, 1244 subjectName: this.updateLectures.subjectName,
1245 teacherId: this.updateLectures.teacherId, 1245 teacherId: this.updateLectures.teacherId,
1246 }, 1246 },
1247 }; 1247 };
1248 http() 1248 http()
1249 .put("/updateLecture", EditLecture) 1249 .put("/updateLecture", EditLecture)
1250 .then((response) => { 1250 .then((response) => {
1251 console.log("updateLecture", EditLecture); 1251 console.log("updateLecture", EditLecture);
1252 this.snackbar = true; 1252 this.snackbar = true;
1253 this.text = response.data.message; 1253 this.text = response.data.message;
1254 this.color = "green"; 1254 this.color = "green";
1255 this.closeUpdateLectures(); 1255 this.closeUpdateLectures();
1256 }) 1256 })
1257 .catch((error) => { 1257 .catch((error) => {
1258 // console.log(error); 1258 // console.log(error);
1259 1259
1260 this.snackbar = true; 1260 this.snackbar = true;
1261 this.color = "error"; 1261 this.color = "error";
1262 this.text = error.response.data.message; 1262 this.text = error.response.data.message;
1263 if (error.response.data.statusText) { 1263 if (error.response.data.statusText) {
1264 this.text = error.response.data.statusText; 1264 this.text = error.response.data.statusText;
1265 } 1265 }
1266 }); 1266 });
1267 }, 1267 },
1268 deleteItem(item) { 1268 deleteItem(item) {
1269 let deleteTimeTable = { 1269 let deleteTimeTable = {
1270 timeTableId: item._id, 1270 timeTableId: item._id,
1271 }; 1271 };
1272 http() 1272 http()
1273 .delete( 1273 .delete(
1274 "/deleteTimeTable", 1274 "/deleteTimeTable",
1275 confirm("Are you sure you want to delete this?") && { 1275 confirm("Are you sure you want to delete this?") && {
1276 params: deleteTimeTable, 1276 params: deleteTimeTable,
1277 } 1277 }
1278 ) 1278 )
1279 .then((response) => { 1279 .then((response) => {
1280 // console.log("deleteUers",deleteTimeTable) 1280 // console.log("deleteUers",deleteTimeTable)
1281 this.snackbar = true; 1281 this.snackbar = true;
1282 this.text = response.data.message; 1282 this.text = response.data.message;
1283 this.color = "green"; 1283 this.color = "green";
1284 this.findTimeTable(); 1284 this.findTimeTable();
1285 }) 1285 })
1286 .catch((error) => { 1286 .catch((error) => {
1287 // console.log(error); 1287 // console.log(error);
1288 }); 1288 });
1289 }, 1289 },
1290 close() { 1290 close() {
1291 this.dialog = false; 1291 this.dialog = false;
1292 }, 1292 },
1293 close1() { 1293 close1() {
1294 this.dialog1 = false; 1294 this.dialog1 = false;
1295 }, 1295 },
1296 closedialogLecture() { 1296 closedialogLecture() {
1297 this.dialogAddLecture = false; 1297 this.dialogAddLecture = false;
1298 }, 1298 },
1299 closeUpdateLectures() { 1299 closeUpdateLectures() {
1300 this.dialogUpdateLectures = false; 1300 this.dialogUpdateLectures = false;
1301 }, 1301 },
1302 closeAddTimeTableModel() { 1302 closeAddTimeTableModel() {
1303 this.addTimeTableDialog = false; 1303 this.addTimeTableDialog = false;
1304 this.timeTableList = []; 1304 this.timeTableList = [];
1305 this.timeTable = []; 1305 this.timeTable = [];
1306 }, 1306 },
1307 submit() { 1307 submit() {
1308 if (this.$refs.form.validate()) { 1308 if (this.$refs.form.validate()) {
1309 let imageData = new FormData(); 1309 let imageData = new FormData();
1310 imageData.append("upload", this.imageFile); 1310 imageData.append("upload", this.imageFile);
1311 let addTimeTable = { 1311 let addTimeTable = {
1312 sectionId: this.timeTable.selectSection, 1312 sectionId: this.timeTable.selectSection,
1313 classId: this.timeTable.select, 1313 classId: this.timeTable.select,
1314 schedule: [ 1314 schedule: [
1315 { 1315 {
1316 day: this.timeTable.selectDay, 1316 day: this.timeTable.selectDay,
1317 lectures: [ 1317 lectures: [
1318 { 1318 {
1319 timeIn: this.timeTable.timeIn, 1319 timeIn: this.timeTable.timeIn,
1320 timeOut: this.timeTable.timeOut, 1320 timeOut: this.timeTable.timeOut,
1321 subjectName: this.timeTable.subjectName, 1321 subjectName: this.timeTable.subjectName,
1322 teacherId: this.timeTable.selectTeacher, 1322 teacherId: this.timeTable.selectTeacher,
1323 }, 1323 },
1324 ], 1324 ],
1325 }, 1325 },
1326 ], 1326 ],
1327 }; 1327 };
1328 this.loading = true; 1328 this.loading = true;
1329 http() 1329 http()
1330 .post("/createTimeTable", addTimeTable) 1330 .post("/createTimeTable", addTimeTable)
1331 .then((response) => { 1331 .then((response) => {
1332 // console.log("addTimeTable=====>", addTimeTable); 1332 // console.log("addTimeTable=====>", addTimeTable);
1333 if ((this.snackbar = true)) { 1333 if ((this.snackbar = true)) {
1334 this.text = "New Time Table added successfully"; 1334 this.text = "New Time Table added successfully";
1335 } 1335 }
1336 this.color = "green"; 1336 this.color = "green";
1337 this.clear(); 1337 // this.clear();
1338 http()
1339 .get("/getParticularClassTimeTable", {
1340 params: {
1341 classId: this.timeTable.select,
1342 sectionId: this.timeTable.selectSection,
1343 },
1344 })
1345 .then((response) => {
1346 this.desserts = response.data.data;
1347 this.showData = true;
1348 this.loadingFindData = false;
1349 })
1350 .catch((error) => {
1351 this.loadingFindData = false;
1352 this.snackbar = true;
1353 this.text = error.response.data.message;
1354 this.text = error.response.data.statusText;
1355 });
1338 this.addTimeTableDialog = false; 1356 this.addTimeTableDialog = false;
1339 this.loading = false; 1357 this.loading = false;
1340 }) 1358 })
1341 .catch((error) => { 1359 .catch((error) => {
1342 // console.log(error); 1360 // console.log(error);
1343 if ((this.snackbar = true)) { 1361 if ((this.snackbar = true)) {
1344 this.text = error.response.data.message; 1362 this.text = error.response.data.message;
1345 } 1363 }
1346 this.loading = false; 1364 this.loading = false;
1347 }); 1365 });
1348 } 1366 }
1349 }, 1367 },
1350 clear() { 1368 clear() {
1351 this.$refs.form.reset(); 1369 this.$refs.form.reset();
1352 }, 1370 },
1353 clearLeactureData() { 1371 clearLeactureData() {
1354 this.$refs.lectureForm.reset(); 1372 this.$refs.lectureForm.reset();
1355 }, 1373 },
1356 save() { 1374 save() {
1357 let imageData = new FormData(); 1375 let imageData = new FormData();
1358 imageData.append("upload", this.imageFile); 1376 imageData.append("upload", this.imageFile);
1359 // console.log(imageData); 1377 // console.log(imageData);
1360 let editTimeTable = { 1378 let editTimeTable = {
1361 timeTableId: this.editedItem._id, 1379 timeTableId: this.editedItem._id,
1362 classId: this.editedItem.classNum, 1380 classId: this.editedItem.classNum,
1363 sectionId: this.editedItem.selectSection, 1381 sectionId: this.editedItem.selectSection,
1364 // imageData 1382 // imageData
1365 }; 1383 };
1366 http() 1384 http()
1367 .put("/updateTimeTable", editTimeTable) 1385 .put("/updateTimeTable", editTimeTable)
1368 .then((response) => { 1386 .then((response) => {
1369 // console.log("editTimeTable", editTimeTable); 1387 // console.log("editTimeTable", editTimeTable);
1370 if ((this.snackbar = true)) { 1388 if ((this.snackbar = true)) {
1371 this.text = "Successfully Edit Existing Time Table"; 1389 this.text = "Successfully Edit Existing Time Table";
1372 this.color = "success"; 1390 this.color = "success";
1373 } 1391 }
1374 this.findTimeTable(); 1392 this.findTimeTable();
1375 }) 1393 })
1376 .catch((error) => { 1394 .catch((error) => {
1377 // console.log(error); 1395 // console.log(error);
1378 if ((this.snackbar = true)) { 1396 if ((this.snackbar = true)) {
1379 this.text = error.response.data.message; 1397 this.text = error.response.data.message;
1380 } 1398 }
1381 }); 1399 });
1382 this.close(); 1400 this.close();
1383 }, 1401 },
1384 deleteTimeTable(timeToDelete, deleteLectures) { 1402 deleteTimeTable(timeToDelete, deleteLectures) {
1385 let deleteLecture = { 1403 let deleteLecture = {
1386 lectureId: timeToDelete._id, 1404 lectureId: timeToDelete._id,
1387 }; 1405 };
1388 http() 1406 http()
1389 .delete( 1407 .delete(
1390 "/deleteLecture", 1408 "/deleteLecture",
1391 confirm("Are you sure you want to delete this?") && { 1409 confirm("Are you sure you want to delete this?") && {
1392 params: deleteLecture, 1410 params: deleteLecture,
1393 } 1411 }
1394 ) 1412 )
1395 .then((response) => { 1413 .then((response) => {
1396 if ((this.snackbar = true)) { 1414 if ((this.snackbar = true)) {
1397 this.text = "Successfully delete Existing Time Table"; 1415 this.text = "Successfully delete Existing Time Table";
1398 } 1416 }
1399 const index = this.timeTableList.schedule.indexOf(deleteLectures); 1417 const index = this.timeTableList.schedule.indexOf(deleteLectures);
1400 for (let i = 0; i < this.timeTableList.schedule.length; i++) { 1418 for (let i = 0; i < this.timeTableList.schedule.length; i++) {
1401 this.timeTableList.schedule[i].lectures.splice(index, 1); 1419 this.timeTableList.schedule[i].lectures.splice(index, 1);
1402 } 1420 }
1403 }) 1421 })
1404 .catch((error) => { 1422 .catch((error) => {
1405 console.log(error); 1423 console.log(error);
1406 }); 1424 });
1407 }, 1425 },
1408 addSchedule(id) { 1426 addSchedule(id) {
1409 this.scheduleDayId = id; 1427 this.scheduleDayId = id;
1410 this.dialogSchedule = true; 1428 this.dialogSchedule = true;
1411 }, 1429 },
1412 submitSchedule() { 1430 submitSchedule() {
1413 if (this.$refs.formAddDay.validate()) { 1431 if (this.$refs.formAddDay.validate()) {
1414 let scheduleDayData = { 1432 let scheduleDayData = {
1415 timeTableId: this.scheduleDayId, 1433 timeTableId: this.scheduleDayId,
1416 day: this.schedule.selectDay, 1434 day: this.schedule.selectDay,
1417 }; 1435 };
1418 http() 1436 http()
1419 .post("/addSchedule", scheduleDayData) 1437 .post("/addSchedule", scheduleDayData)
1420 .then((response) => { 1438 .then((response) => {
1421 this.snackbar = true; 1439 this.snackbar = true;
1422 this.text = "New Schedule Day added successfully"; 1440 this.text = "New Schedule Day added successfully";
1423 this.dialogSchedule = false; 1441 this.dialogSchedule = false;
1424 this.loading = false; 1442 this.loading = false;
1425 this.getTimeTableDayData(); 1443 this.getTimeTableDayData();
1426 }) 1444 })
1427 .catch((error) => { 1445 .catch((error) => {
1428 // console.log(error); 1446 // console.log(error);
1429 this.snackbar = true; 1447 this.snackbar = true;
1430 this.text = error.response.data.message; 1448 this.text = error.response.data.message;
1431 this.loading = false; 1449 this.loading = false;
1432 }); 1450 });
1433 } 1451 }
1434 }, 1452 },
1435 displaySearch() { 1453 displaySearch() {
1436 (this.show = false), (this.showSearch = true); 1454 (this.show = false), (this.showSearch = true);
1437 }, 1455 },
1438 closeSearch() { 1456 closeSearch() {
1439 this.showSearch = false; 1457 this.showSearch = false;
1440 this.show = true; 1458 this.show = true;
1441 this.search = ""; 1459 this.search = "";
1442 }, 1460 },
1443 }, 1461 },
1444 mounted() { 1462 mounted() {
1445 // this.getTimeTableList(); 1463 // this.getTimeTableList();
1446 var token = this.$store.state.token; 1464 var token = this.$store.state.token;
1447 http() 1465 http()
1448 .get("/getClassesList", { 1466 .get("/getClassesList", {
1449 headers: { Authorization: "Bearer " + token }, 1467 headers: { Authorization: "Bearer " + token },
1450 }) 1468 })
1451 .then((response) => { 1469 .then((response) => {
1452 this.addclass = response.data.data; 1470 this.addclass = response.data.data;
1453 // console.log("getClassesList=====>",this.addclass) 1471 // console.log("getClassesList=====>",this.addclass)
1454 }) 1472 })
1455 .catch((error) => { 1473 .catch((error) => {
1456 this.showLoader = false; 1474 this.showLoader = false;
1457 if (error.response.status === 401) { 1475 if (error.response.status === 401) {
1458 this.$router.replace({ path: "/" }); 1476 this.$router.replace({ path: "/" });
1459 this.$store.dispatch("setToken", null); 1477 this.$store.dispatch("setToken", null);
1460 this.$store.dispatch("Id", null); 1478 this.$store.dispatch("Id", null);
1461 this.$store.dispatch("Role", null); 1479 this.$store.dispatch("Role", null);
1462 } 1480 }
1463 }); 1481 });
1464 1482
1465 http() 1483 http()
1466 .get("/getTeachersList", { 1484 .get("/getTeachersList", {
1467 headers: { Authorization: "Bearer " + token }, 1485 headers: { Authorization: "Bearer " + token },
1468 }) 1486 })
1469 .then((response) => { 1487 .then((response) => {
1470 this.addTeachers = response.data.data; 1488 this.addTeachers = response.data.data;
1471 // console.log("getClassesList=====>",this.addTeachers) 1489 // console.log("getClassesList=====>",this.addTeachers)
1472 }) 1490 })
1473 .catch((error) => { 1491 .catch((error) => {
1474 this.showLoader = false; 1492 this.showLoader = false;
1475 if (error.response.status === 401) { 1493 if (error.response.status === 401) {
1476 this.$router.replace({ path: "/" }); 1494 this.$router.replace({ path: "/" });
1477 this.$store.dispatch("setToken", null); 1495 this.$store.dispatch("setToken", null);
1478 this.$store.dispatch("Id", null); 1496 this.$store.dispatch("Id", null);
1479 this.$store.dispatch("Role", null); 1497 this.$store.dispatch("Role", null);
1480 } 1498 }
1481 }); 1499 });
1482 }, 1500 },
1483 }; 1501 };
1484 </script> 1502 </script>