viithiisys / School-Management-dashboard

Download as
Browse Code ยป

Commit 7b5f451a3fdc4c23ff863f39a3faceb69046127a

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

routine time ssue

Showing 1 changed file with 1 additions and 1 deletions   Show diff stats
src/pages/Academic/routine.vue
Diff comments   View file @7b5f451
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"> 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(addRoutine.classId)" 26 @change="getClassSubject(addRoutine.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="addRoutine.classId" 191 v-model="addRoutine.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(addRoutine.classId)" 196 @change="getSections(addRoutine.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="addRoutine.sectionId" 203 v-model="addRoutine.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-show="showSearch"> 222 <v-flex xs9 sm9 md2 lg2 xl2 v-show="showSearch">
223 <v-layout> 223 <v-layout>
224 <v-text-field 224 <v-text-field
225 v-model="search" 225 v-model="search"
226 label="Search" 226 label="Search"
227 prepend-inner-icon="search" 227 prepend-inner-icon="search"
228 color="primary" 228 color="primary"
229 style="transition: 0.8s cubic-bezier(0.25, 0.8, 0.25, 1); !important" 229 style="transition: 0.8s cubic-bezier(0.25, 0.8, 0.25, 1); !important"
230 ></v-text-field> 230 ></v-text-field>
231 <v-icon @click="closeSearch" color="error">close</v-icon> 231 <v-icon @click="closeSearch" color="error">close</v-icon>
232 </v-layout> 232 </v-layout>
233 </v-flex> 233 </v-flex>
234 </v-toolbar> 234 </v-toolbar>
235 235
236 <div class="col-sm-12"> 236 <div class="col-sm-12">
237 <div class="box-body"> 237 <div class="box-body">
238 <div class="row"> 238 <div class="row">
239 <div class="col-sm-12"> 239 <div class="col-sm-12">
240 <div class="nav-tabs-custom"> 240 <div class="nav-tabs-custom">
241 <ul class="nav nav-tabs"> 241 <ul class="nav nav-tabs">
242 <li class="active"> 242 <li class="active">
243 <a data-toggle="tab" href="#all" aria-expanded="true">All Routines</a> 243 <a data-toggle="tab" href="#all" aria-expanded="true">All Routines</a>
244 </li> 244 </li>
245 </ul> 245 </ul>
246 246
247 <div class="tab-content" v-show="hideTable"> 247 <div class="tab-content" v-show="hideTable">
248 <div id="all" class="tab-pane active mCustomScrollbar _mCS_1 mCS_no_scrollbar"> 248 <div id="all" class="tab-pane active mCustomScrollbar _mCS_1 mCS_no_scrollbar">
249 <div 249 <div
250 id="mCSB_1" 250 id="mCSB_1"
251 class="mCustomScrollBox mCS-light" 251 class="mCustomScrollBox mCS-light"
252 style="max-height: none;" 252 style="max-height: none;"
253 tabindex="0" 253 tabindex="0"
254 > 254 >
255 <div 255 <div
256 id="mCSB_1_container" 256 id="mCSB_1_container"
257 class="mCSB_container mCS_x_hidden mCS_no_scrollbar_x" 257 class="mCSB_container mCS_x_hidden mCS_no_scrollbar_x"
258 style="position: relative; top: 0px; left: 0px; width: 100%;" 258 style="position: relative; top: 0px; left: 0px; width: 100%;"
259 dir="ltr" 259 dir="ltr"
260 > 260 >
261 <div id="hide-table-2"> 261 <div id="hide-table-2">
262 <table id="table" class="table table-striped"> 262 <table id="table" class="table table-striped">
263 <tbody> 263 <tbody>
264 <tr> 264 <tr>
265 <td>MONDAY</td> 265 <td>MONDAY</td>
266 </tr> 266 </tr>
267 <tr> 267 <tr>
268 <td>TUESDAY</td> 268 <td>TUESDAY</td>
269 </tr> 269 </tr>
270 <tr> 270 <tr>
271 <td>WEDNESDAY</td> 271 <td>WEDNESDAY</td>
272 </tr> 272 </tr>
273 <tr> 273 <tr>
274 <td>THURSDAY</td> 274 <td>THURSDAY</td>
275 </tr> 275 </tr>
276 <tr> 276 <tr>
277 <td>FRIDAY</td> 277 <td>FRIDAY</td>
278 </tr> 278 </tr>
279 <tr> 279 <tr>
280 <td>SATURDAY</td> 280 <td>SATURDAY</td>
281 </tr> 281 </tr>
282 </tbody> 282 </tbody>
283 </table> 283 </table>
284 </div> 284 </div>
285 </div> 285 </div>
286 <div 286 <div
287 id="mCSB_1_scrollbar_horizontal" 287 id="mCSB_1_scrollbar_horizontal"
288 class="mCSB_scrollTools mCSB_1_scrollbar mCS-light mCSB_scrollTools_horizontal" 288 class="mCSB_scrollTools mCSB_1_scrollbar mCS-light mCSB_scrollTools_horizontal"
289 style="display: none;" 289 style="display: none;"
290 > 290 >
291 <div class="mCSB_draggerContainer"> 291 <div class="mCSB_draggerContainer">
292 <div 292 <div
293 id="mCSB_1_dragger_horizontal" 293 id="mCSB_1_dragger_horizontal"
294 class="mCSB_dragger" 294 class="mCSB_dragger"
295 style="position: absolute; min-width: 30px; width: 0px; left: 0px;" 295 style="position: absolute; min-width: 30px; width: 0px; left: 0px;"
296 > 296 >
297 <div class="mCSB_dragger_bar"></div> 297 <div class="mCSB_dragger_bar"></div>
298 </div> 298 </div>
299 <div class="mCSB_draggerRail"></div> 299 <div class="mCSB_draggerRail"></div>
300 </div> 300 </div>
301 </div> 301 </div>
302 </div> 302 </div>
303 </div> 303 </div>
304 </div> 304 </div>
305 <div> 305 <div>
306 <table id="table" class="table table-bordered" v-show="showTable"> 306 <table id="table" class="table table-bordered" v-show="showTable">
307 <tbody> 307 <tbody>
308 <div class="nav-tabs-custom"> 308 <div class="nav-tabs-custom">
309 <div class="tab-content" id="scrolling"> 309 <div class="tab-content" id="scrolling">
310 <div id="hide-table-2"> 310 <div id="hide-table-2">
311 <v-data-table :items="routineList"> 311 <v-data-table :items="routineList">
312 <template slot="items" slot-scope="props"> 312 <template slot="items" slot-scope="props">
313 <tr class="tr"> 313 <tr class="tr">
314 <td>{{ props.item.day }}</td> 314 <td>{{ props.item.day }}</td>
315 <td class="text-center" v-for="list in props.item.lectureRoutine"> 315 <td class="text-center" v-for="list in props.item.lectureRoutine">
316 {{ props.item.classId.classNum }} 316 {{ props.item.classId.classNum }}
317 <br /> 317 <br />
318 {{ props.item.sectionId.name }} 318 {{ props.item.sectionId.name }}
319 <br /> 319 <br />
320 {{ list.startingTime }} - {{ list.endingTime }} 320 {{ list.startingTime }} - {{ list.endingTime }}
321 <br /> 321 <br />
322 {{ list.room }} 322 {{ list.room }}
323 <br /> 323 <br />
324 {{ list.subjectName }} 324 {{ list.subjectName }}
325 <br /> 325 <br />
326 {{ list.teacherId.name}} 326 {{ list.teacherId.name}}
327 <br /> 327 <br />
328 <span> 328 <span>
329 <v-tooltip top> 329 <v-tooltip top>
330 <img 330 <img
331 slot="activator" 331 slot="activator"
332 style="cursor:pointer; width:20px; height:18px; " 332 style="cursor:pointer; width:20px; height:18px; "
333 class="mr-3" 333 class="mr-3"
334 @click="editItem(list, props.item)" 334 @click="editItem(list, props.item)"
335 src="/static/icon/edit.png" 335 src="/static/icon/edit.png"
336 /> 336 />
337 <span>Edit</span> 337 <span>Edit</span>
338 </v-tooltip> 338 </v-tooltip>
339 <v-tooltip top> 339 <v-tooltip top>
340 <img 340 <img
341 slot="activator" 341 slot="activator"
342 style="cursor:pointer; width:20px; height:18px; " 342 style="cursor:pointer; width:20px; height:18px; "
343 class="mr-3" 343 class="mr-3"
344 @click="deleteItem(props.item)" 344 @click="deleteItem(props.item)"
345 src="/static/icon/delete.png" 345 src="/static/icon/delete.png"
346 /> 346 />
347 <span>Delete</span> 347 <span>Delete</span>
348 </v-tooltip> 348 </v-tooltip>
349 </span> 349 </span>
350 </td> 350 </td>
351 </tr> 351 </tr>
352 </template> 352 </template>
353 </v-data-table> 353 </v-data-table>
354 </div> 354 </div>
355 </div> 355 </div>
356 </div> 356 </div>
357 </tbody> 357 </tbody>
358 </table> 358 </table>
359 </div> 359 </div>
360 </div> 360 </div>
361 </div> 361 </div>
362 </div> 362 </div>
363 </div> 363 </div>
364 </div> 364 </div>
365 <!-- ****** ADD MULTIPLE Subject ****** --> 365 <!-- ****** ADD MULTIPLE Subject ****** -->
366 <v-snackbar 366 <v-snackbar
367 :timeout="timeout" 367 :timeout="timeout"
368 :top="y === 'top'" 368 :top="y === 'top'"
369 :right="x === 'right'" 369 :right="x === 'right'"
370 :vertical="mode === 'vertical'" 370 :vertical="mode === 'vertical'"
371 v-model="snackbar" 371 v-model="snackbar"
372 :color="color" 372 :color="color"
373 >{{ text }}</v-snackbar> 373 >{{ text }}</v-snackbar>
374 <v-dialog v-model="addRoutineDialog" max-width="600px"> 374 <v-dialog v-model="addRoutineDialog" max-width="600px">
375 <v-card flat class="card-style pa-2" dark> 375 <v-card flat class="card-style pa-2" dark>
376 <v-layout> 376 <v-layout>
377 <v-flex xs12> 377 <v-flex xs12>
378 <label class="title text-xs-center">Add Routine</label> 378 <label class="title text-xs-center">Add Routine</label>
379 <v-icon size="24" class="right" @click="addRoutineDialog = false">cancel</v-icon> 379 <v-icon size="24" class="right" @click="addRoutineDialog = false">cancel</v-icon>
380 </v-flex> 380 </v-flex>
381 </v-layout> 381 </v-layout>
382 <v-container fluid fill-height> 382 <v-container fluid fill-height>
383 <v-layout align-center> 383 <v-layout align-center>
384 <v-flex xs12> 384 <v-flex xs12>
385 <v-form ref="form" v-model="valid" lazy-validation> 385 <v-form ref="form" v-model="valid" lazy-validation>
386 <v-layout> 386 <v-layout>
387 <v-flex xs4 sm4 class="pt-4 subheading"> 387 <v-flex xs4 sm4 class="pt-4 subheading">
388 <label class="right">School Year :</label> 388 <label class="right">School Year :</label>
389 </v-flex> 389 </v-flex>
390 <v-flex xs8 sm8 class="ml-3"> 390 <v-flex xs8 sm8 class="ml-3">
391 <v-text-field 391 <v-text-field
392 label="fill your year" 392 label="fill your year"
393 :rules="schoolRules" 393 :rules="schoolRules"
394 v-model="addRoutine.schoolYear" 394 v-model="addRoutine.schoolYear"
395 ></v-text-field> 395 ></v-text-field>
396 </v-flex> 396 </v-flex>
397 </v-layout> 397 </v-layout>
398 <v-layout> 398 <v-layout>
399 <v-flex xs4 sm4 class="pt-4 subheading"> 399 <v-flex xs4 sm4 class="pt-4 subheading">
400 <label class="right">Class :</label> 400 <label class="right">Class :</label>
401 </v-flex> 401 </v-flex>
402 <v-flex xs8 sm8 class="ml-3"> 402 <v-flex xs8 sm8 class="ml-3">
403 <v-select 403 <v-select
404 :items="classList" 404 :items="classList"
405 item-text="classNum" 405 item-text="classNum"
406 item-value="_id" 406 item-value="_id"
407 v-model="addRoutine.classId" 407 v-model="addRoutine.classId"
408 label="Select Class" 408 label="Select Class"
409 :rules="classRules" 409 :rules="classRules"
410 @change="getSections(addRoutine.classId)" 410 @change="getSections(addRoutine.classId)"
411 class="pl-2" 411 class="pl-2"
412 required 412 required
413 ></v-select> 413 ></v-select>
414 </v-flex> 414 </v-flex>
415 </v-layout> 415 </v-layout>
416 <v-layout> 416 <v-layout>
417 <v-flex xs4 sm4 class="pt-4 subheading"> 417 <v-flex xs4 sm4 class="pt-4 subheading">
418 <label class="right">Section :</label> 418 <label class="right">Section :</label>
419 </v-flex> 419 </v-flex>
420 <v-flex xs8 sm8 class="ml-3"> 420 <v-flex xs8 sm8 class="ml-3">
421 <v-select 421 <v-select
422 :items="addSection" 422 :items="addSection"
423 item-text="name" 423 item-text="name"
424 item-value="_id" 424 item-value="_id"
425 v-model="addRoutine.sectionId" 425 v-model="addRoutine.sectionId"
426 label="Select Section" 426 label="Select Section"
427 :rules="sectionRules" 427 :rules="sectionRules"
428 @change="getClassSubject(addRoutine.classId)" 428 @change="getClassSubject(addRoutine.classId)"
429 class="px-2" 429 class="px-2"
430 required 430 required
431 ></v-select> 431 ></v-select>
432 </v-flex> 432 </v-flex>
433 </v-layout> 433 </v-layout>
434 <v-layout> 434 <v-layout>
435 <v-flex xs3 sm4 class="pt-4 subheading"> 435 <v-flex xs3 sm4 class="pt-4 subheading">
436 <label class="right">Subject :</label> 436 <label class="right">Subject :</label>
437 </v-flex> 437 </v-flex>
438 <v-flex xs8 sm8 class="ml-2"> 438 <v-flex xs8 sm8 class="ml-2">
439 <v-select 439 <v-select
440 :items="subjectList.subjects" 440 :items="subjectList.subjects"
441 label="Select your subject" 441 label="Select your subject"
442 v-model="addRoutine.subjectName" 442 v-model="addRoutine.subjectName"
443 item-text="subjectName" 443 item-text="subjectName"
444 item-value="subjectName" 444 item-value="subjectName"
445 :rules="subjectRules" 445 :rules="subjectRules"
446 required 446 required
447 ></v-select> 447 ></v-select>
448 </v-flex> 448 </v-flex>
449 </v-layout> 449 </v-layout>
450 <v-layout> 450 <v-layout>
451 <v-flex xs3 sm4 class="pt-4 subheading"> 451 <v-flex xs3 sm4 class="pt-4 subheading">
452 <label class="right">Day :</label> 452 <label class="right">Day :</label>
453 </v-flex> 453 </v-flex>
454 <v-flex xs8 sm8 class="ml-2"> 454 <v-flex xs8 sm8 class="ml-2">
455 <v-select 455 <v-select
456 :items="day" 456 :items="day"
457 label="Select your day" 457 label="Select your day"
458 v-model="addRoutine.day" 458 v-model="addRoutine.day"
459 item-text="text" 459 item-text="text"
460 :rules="dayRules" 460 :rules="dayRules"
461 required 461 required
462 ></v-select> 462 ></v-select>
463 </v-flex> 463 </v-flex>
464 </v-layout> 464 </v-layout>
465 <v-layout> 465 <v-layout>
466 <v-flex xs4 sm4 class="pt-4 subheading"> 466 <v-flex xs4 sm4 class="pt-4 subheading">
467 <label class="right">Teacher Name :</label> 467 <label class="right">Teacher Name :</label>
468 </v-flex> 468 </v-flex>
469 <v-flex xs8 sm8 class="ml-3"> 469 <v-flex xs8 sm8 class="ml-3">
470 <v-select 470 <v-select
471 v-model="addRoutine.teacherId" 471 v-model="addRoutine.teacherId"
472 label="Select your teacher" 472 label="Select your teacher"
473 type="text" 473 type="text"
474 :items="teacherList" 474 :items="teacherList"
475 item-text="name" 475 item-text="name"
476 item-value="_id" 476 item-value="_id"
477 :rules="teacherRules" 477 :rules="teacherRules"
478 required 478 required
479 ></v-select> 479 ></v-select>
480 </v-flex> 480 </v-flex>
481 </v-layout> 481 </v-layout>
482 <v-layout> 482 <v-layout>
483 <v-flex xs4 class="pt-4 subheading"> 483 <v-flex xs4 class="pt-4 subheading">
484 <label class="right">Starting time:</label> 484 <label class="right">Starting time:</label>
485 </v-flex> 485 </v-flex>
486 <v-flex xs8 sm6 class="ml-3"> 486 <v-flex xs8 sm6 class="ml-3">
487 <v-menu 487 <v-menu
488 ref="menuA" 488 ref="menuA"
489 :close-on-content-click="false" 489 :close-on-content-click="false"
490 v-model="menu2" 490 v-model="menu2"
491 :nudge-right="40" 491 :nudge-right="40"
492 :return-value.sync="addRoutine.startingTime" 492 :return-value.sync="addRoutine.startingTime"
493 lazy 493 lazy
494 transition="scale-transition" 494 transition="scale-transition"
495 offset-y 495 offset-y
496 full-width 496 full-width
497 max-width="290px" 497 max-width="290px"
498 min-width="290px" 498 min-width="290px"
499 > 499 >
500 <v-text-field 500 <v-text-field
501 slot="activator" 501 slot="activator"
502 v-model="addRoutine.startingTime" 502 v-model="addRoutine.startingTime"
503 label="Select your starting time" 503 label="Select your starting time"
504 append-icon="access_time" 504 append-icon="access_time"
505 :rules="timeInRules" 505 :rules="timeInRules"
506 readonly 506 readonly
507 ></v-text-field> 507 ></v-text-field>
508 <v-time-picker 508 <v-time-picker
509 v-model="addRoutine.startingTime" 509 v-model="addRoutine.startingTime"
510 @change="$refs.menuA.save(addRoutine.startingTime)" 510 @change="$refs.menuA.save(addRoutine.startingTime)"
511 ></v-time-picker> 511 ></v-time-picker>
512 </v-menu> 512 </v-menu>
513 </v-flex> 513 </v-flex>
514 </v-layout> 514 </v-layout>
515 <v-layout> 515 <v-layout>
516 <v-flex xs4 class="pt-4 subheading"> 516 <v-flex xs4 class="pt-4 subheading">
517 <label class="right">Ending Time:</label> 517 <label class="right">Ending Time:</label>
518 </v-flex> 518 </v-flex>
519 <v-flex xs8 sm6 class="ml-3"> 519 <v-flex xs8 sm6 class="ml-3">
520 <v-menu 520 <v-menu
521 ref="menu" 521 ref="menu"
522 :close-on-content-click="false" 522 :close-on-content-click="false"
523 v-model="menu1" 523 v-model="menu1"
524 :nudge-right="40" 524 :nudge-right="40"
525 :return-value.sync="addRoutine.endingTime" 525 :return-value.sync="addRoutine.endingTime"
526 lazy 526 lazy
527 transition="scale-transition" 527 transition="scale-transition"
528 offset-y 528 offset-y
529 full-width 529 full-width
530 max-width="290px" 530 max-width="290px"
531 min-width="290px" 531 min-width="290px"
532 > 532 >
533 <v-text-field 533 <v-text-field
534 slot="activator" 534 slot="activator"
535 v-model="addRoutine.endingTime" 535 v-model="addRoutine.endingTime"
536 label="Select your end time" 536 label="Select your end time"
537 append-icon="access_time" 537 append-icon="access_time"
538 :rules="timeOutRules" 538 :rules="timeOutRules"
539 readonly 539 readonly
540 ></v-text-field> 540 ></v-text-field>
541 <v-time-picker 541 <v-time-picker
542 v-model="addRoutine.endingTime" 542 v-model="addRoutine.endingTime"
543 @change="$refs.menu.save(addRoutine.endingTime)" 543 @change="$refs.menu.save(addRoutine.endingTime)"
544 ></v-time-picker> 544 ></v-time-picker>
545 </v-menu> 545 </v-menu>
546 </v-flex> 546 </v-flex>
547 </v-layout> 547 </v-layout>
548 <v-layout> 548 <v-layout>
549 <v-flex xs4 sm4 class="pt-4 subheading"> 549 <v-flex xs4 sm4 class="pt-4 subheading">
550 <label class="right">Room:</label> 550 <label class="right">Room:</label>
551 </v-flex> 551 </v-flex>
552 <v-flex xs8 sm8 class="ml-3"> 552 <v-flex xs8 sm8 class="ml-3">
553 <v-text-field 553 <v-text-field
554 label="fill your room" 554 label="fill your room"
555 :rules="roomRules" 555 :rules="roomRules"
556 v-model="addRoutine.room" 556 v-model="addRoutine.room"
557 @keyup.enter="submit" 557 @keyup.enter="submit"
558 ></v-text-field> 558 ></v-text-field>
559 </v-flex> 559 </v-flex>
560 </v-layout> 560 </v-layout>
561 <v-layout> 561 <v-layout>
562 <v-flex xs4 sm4 class="pt-4 subheading"> 562 <v-flex xs4 sm4 class="pt-4 subheading">
563 <label class="right">Period:</label> 563 <label class="right">Period:</label>
564 </v-flex> 564 </v-flex>
565 <v-flex xs8 sm8 class="ml-3"> 565 <v-flex xs8 sm8 class="ml-3">
566 <v-text-field 566 <v-text-field
567 label="fill your period" 567 label="fill your period"
568 :rules="periodRules" 568 :rules="periodRules"
569 v-model="addRoutine.period" 569 v-model="addRoutine.period"
570 @keyup.enter="submit" 570 @keyup.enter="submit"
571 ></v-text-field> 571 ></v-text-field>
572 </v-flex> 572 </v-flex>
573 </v-layout> 573 </v-layout>
574 <v-layout> 574 <v-layout>
575 <v-flex xs12 sm12> 575 <v-flex xs12 sm12>
576 <v-card-actions> 576 <v-card-actions>
577 <v-spacer></v-spacer> 577 <v-spacer></v-spacer>
578 <v-btn 578 <v-btn
579 @click="create" 579 @click="create"
580 round 580 round
581 dark 581 dark
582 :loading="loading" 582 :loading="loading"
583 class="add-button" 583 class="add-button"
584 >Add Routine</v-btn> 584 >Add Routine</v-btn>
585 </v-card-actions> 585 </v-card-actions>
586 </v-flex> 586 </v-flex>
587 </v-layout> 587 </v-layout>
588 </v-form> 588 </v-form>
589 </v-flex> 589 </v-flex>
590 </v-layout> 590 </v-layout>
591 </v-container> 591 </v-container>
592 </v-card> 592 </v-card>
593 </v-dialog> 593 </v-dialog>
594 <div class="loader" v-if="showLoader"> 594 <div class="loader" v-if="showLoader">
595 <v-progress-circular indeterminate color="white"></v-progress-circular> 595 <v-progress-circular indeterminate color="white"></v-progress-circular>
596 </div> 596 </div>
597 </v-container> 597 </v-container>
598 </template> 598 </template>
599 599
600 <script> 600 <script>
601 import http from "@/Services/http.js"; 601 import http from "@/Services/http.js";
602 import Util from "@/util"; 602 import Util from "@/util";
603 603
604 export default { 604 export default {
605 data: () => ({ 605 data: () => ({
606 snackbar: false, 606 snackbar: false,
607 y: "top", 607 y: "top",
608 x: "right", 608 x: "right",
609 role: "", 609 role: "",
610 mode: "", 610 mode: "",
611 timeout: 3000, 611 timeout: 3000,
612 text: "", 612 text: "",
613 color: "", 613 color: "",
614 show: true, 614 show: true,
615 showSearch: false, 615 showSearch: false,
616 showLoader: false, 616 showLoader: false,
617 loading: false, 617 loading: false,
618 editLoading: false, 618 editLoading: false,
619 date: null, 619 date: null,
620 search: "", 620 search: "",
621 editRoutineDialog: false, 621 editRoutineDialog: false,
622 valid: true, 622 valid: true,
623 validEditRoutine: true, 623 validEditRoutine: true,
624 addRoutineDialog: false, 624 addRoutineDialog: false,
625 showTable: false, 625 showTable: false,
626 hideTable: true, 626 hideTable: true,
627 name: "", 627 name: "",
628 628
629 day: [ 629 day: [
630 "Monday", 630 "Monday",
631 "Tuesday", 631 "Tuesday",
632 "Wednesday", 632 "Wednesday",
633 "Thursday", 633 "Thursday",
634 "Friday", 634 "Friday",
635 "Saturday", 635 "Saturday",
636 "Sunday" 636 "Sunday"
637 ], 637 ],
638 638
639 token: "", 639 token: "",
640 640
641 menu1: false, 641 menu1: false,
642 menu2: false, 642 menu2: false,
643 menu4: false, 643 menu4: false,
644 menu3: false, 644 menu3: false,
645 645
646 schoolRules: [v => !!v || "School Year is required"], 646 schoolRules: [v => !!v || "School Year is required"],
647 classRules: [v => !!v || " Class Name is required"], 647 classRules: [v => !!v || " Class Name is required"],
648 teacherRules: [v => !!v || " Teacher Name is required"], 648 teacherRules: [v => !!v || " Teacher Name is required"],
649 sectionRules: [v => !!v || "Section is required"], 649 sectionRules: [v => !!v || "Section is required"],
650 studentRules: [v => !!v || " Student is required"], 650 studentRules: [v => !!v || " Student is required"],
651 finalRules: [v => !!v || "Final MArk is required"], 651 finalRules: [v => !!v || "Final MArk is required"],
652 subjectRules: [v => !!v || " Subject Name is required"], 652 subjectRules: [v => !!v || " Subject Name is required"],
653 dayRules: [v => !!v || "Day is required"], 653 dayRules: [v => !!v || "Day is required"],
654 timeInRules: [v => !!v || "Start Time is required"], 654 timeInRules: [v => !!v || "Start Time is required"],
655 timeOutRules: [v => !!v || "End Time is required"], 655 timeOutRules: [v => !!v || "End Time is required"],
656 roomRules: [v => !!v || "Room is required"], 656 roomRules: [v => !!v || "Room is required"],
657 periodRules: [v => !!v || "Period is required"], 657 periodRules: [v => !!v || "Period is required"],
658 658
659 classList: [], 659 classList: [],
660 addSection: [], 660 addSection: [],
661 subjectList: [], 661 subjectList: [],
662 teacherList: [], 662 teacherList: [],
663 titleRules: [], 663 titleRules: [],
664 markRules: [], 664 markRules: [],
665 typeRules: [], 665 typeRules: [],
666 routineList: [], 666 routineList: [],
667 editedIndex: -1, 667 editedIndex: -1,
668 addRoutine: {}, 668 addRoutine: {},
669 startingTime: "", 669 startingTime: "",
670 editedItem: {} 670 editedItem: {}
671 671
672 }), 672 }),
673 methods: { 673 methods: {
674 editItem(item, routineData) { 674 editItem(item, routineData) {
675 console.log("routineData", routineData) 675 console.log("routineData", routineData)
676 console.log("item", item) 676 console.log("item", item)
677 this.editedIndex = this.routineList; 677 this.editedIndex = this.routineList;
678 this.editedItem = Object.assign({}, item); 678 this.editedItem = Object.assign({}, item);
679 this.editedItem.lectureRoutineId = item._id; 679 this.editedItem.lectureRoutineId = item._id;
680 this.editedItem.routineId = routineData._id; 680 this.editedItem.routineId = routineData._id;
681 this.dialog = true; 681 this.dialog = true;
682 this.editRoutineDialog = true; 682 this.editRoutineDialog = true;
683 }, 683 },
684 deleteItem(item) { 684 deleteItem(item) {
685 let deleteLecture = { 685 let deleteLecture = {
686 routineId: item._id, 686 routineId: item._id,
687 lectureId: item.lectureRoutine[0]._id 687 lectureId: item.lectureRoutine[0]._id
688 }; 688 };
689 http() 689 http()
690 .delete( 690 .delete(
691 "/deleteRoutineLecture", 691 "/deleteRoutineLecture",
692 confirm("Are you sure you want to delete this?") && { 692 confirm("Are you sure you want to delete this?") && {
693 params: deleteLecture 693 params: deleteLecture
694 } 694 }
695 ) 695 )
696 .then(response => { 696 .then(response => {
697 this.snackbar = true; 697 this.snackbar = true;
698 this.text = "Successfully delete Existing Routine"; 698 this.text = "Successfully delete Existing Routine";
699 this.color = "green"; 699 this.color = "green";
700 this.getRoutineList(); 700 this.getRoutineList();
701 }) 701 })
702 .catch(error => { 702 .catch(error => {
703 this.snackbar = true; 703 this.snackbar = true;
704 this.text = error.response.data.message; 704 this.text = error.response.data.message;
705 this.color = "error"; 705 this.color = "error";
706 }); 706 });
707 }, 707 },
708 close() { 708 close() {
709 this.editRoutineDialog = false; 709 this.editRoutineDialog = false;
710 }, 710 },
711 711
712 create() { 712 create() {
713 var routineData = { 713 var routineData = {
714 schoolYear: this.addRoutine.schoolYear, 714 schoolYear: this.addRoutine.schoolYear,
715 classId: this.addRoutine.classId, 715 classId: this.addRoutine.classId,
716 sectionId: this.addRoutine.sectionId, 716 sectionId: this.addRoutine.sectionId,
717 day: this.addRoutine.day, 717 day: this.addRoutine.day,
718 lectureRoutine: [] 718 lectureRoutine: []
719 }; 719 };
720 if (this.$refs.form.validate()) { 720 if (this.$refs.form.validate()) {
721 routineData.lectureRoutine.push({ 721 routineData.lectureRoutine.push({
722 teacherId: this.addRoutine.teacherId, 722 teacherId: this.addRoutine.teacherId,
723 startingTime: this.addRoutine.startingTime, 723 startingTime: this.addRoutine.startingTime,
724 endingTime: this.addRoutine.endingTime, 724 endingTime: this.addRoutine.endingTime,
725 room: this.addRoutine.room, 725 room: this.addRoutine.room,
726 period: this.addRoutine.period, 726 period: this.addRoutine.period,
727 subjectName: this.addRoutine.subjectName 727 subjectName: this.addRoutine.subjectName
728 }); 728 });
729 http() 729 http()
730 .post("/createRoutine", routineData) 730 .post("/createRoutine", routineData)
731 .then(response => { 731 .then(response => {
732 this.getRoutineList(); 732 this.getRoutineList();
733 this.text = "Routine added successfully"; 733 this.text = "Routine added successfully";
734 this.clear(); 734 this.clear();
735 this.snackbar = true; 735 this.snackbar = true;
736 this.color = "green"; 736 this.color = "green";
737 this.addRoutineDialog = false; 737 this.addRoutineDialog = false;
738 }) 738 })
739 .catch(error => { 739 .catch(error => {
740 // console.log(error); 740 // console.log(error);
741 this.snackbar = true; 741 this.snackbar = true;
742 this.text = error.response.data.message; 742 this.text = error.response.data.message;
743 this.color = "error"; 743 this.color = "error";
744 }); 744 });
745 } 745 }
746 }, 746 },
747 clear() { 747 clear() {
748 this.$refs.form.reset(); 748 this.$refs.form.reset();
749 }, 749 },
750 750
751 update() { 751 update() {
752 if (this.$refs.formEditRoutine.validate()) { 752 if (this.$refs.formEditRoutine.validate()) {
753 let editRoutine = { 753 let editRoutine = {
754 routineId: this.editedItem.routineId, 754 routineId: this.editedItem.routineId,
755 lectureRoutineId: this.editedItem.lectureRoutineId, 755 lectureRoutineId: this.editedItem.lectureRoutineId,
756 subjectName: this.editedItem.subjectName, 756 subjectName: this.editedItem.subjectName,
757 teacherId: this.editedItem.teacherId._id, 757 teacherId: this.editedItem.teacherId._id,
758 startingTime: this.editedItem.startingTime, 758 startingTime: this.editedItem.startingTime,
759 endingTime: this.editedItem.endingTime, 759 endingTime: this.editedItem.endingTime,
760 room: this.editedItem.room, 760 room: this.editedItem.room,
761 period: this.editedItem.period 761 period: this.editedItem.period
762 }; 762 };
763 this.editLoading = true; 763 this.editLoading = true;
764 http() 764 http()
765 .put("/updateRoutine", editRoutine) 765 .put("/updateRoutine", editRoutine)
766 .then(response => { 766 .then(response => {
767 this.snackbar = true; 767 this.snackbar = true;
768 this.text = "Successfully Edit Existing Routine"; 768 this.text = "Successfully Edit Existing Routine";
769 this.color = "green"; 769 this.color = "green";
770 this.editLoading = false; 770 this.editLoading = false;
771 this.editRoutineDialog = false; 771 this.editRoutineDialog = false;
772 this.getRoutineList(); 772 this.getRoutineList();
773 // http() 773 // http()
774 // .get( 774 // .get(
775 // "/getRoutineList", 775 // "/getRoutineList",
776 // { 776 // {
777 // params: { 777 // params: {
778 // classId: this.addRoutine.classId, 778 // classId: this.addRoutine.classId,
779 // sectionId: this.addRoutine.sectionId 779 // sectionId: this.addRoutine.sectionId
780 // } 780 // }
781 // }, 781 // },
782 // { 782 // {
783 // headers: { Authorization: "Bearer " + this.token } 783 // headers: { Authorization: "Bearer " + this.token }
784 // } 784 // }
785 // ) 785 // )
786 // .then(response => { 786 // .then(response => {
787 // this.routineList = response.data.data; 787 // this.routineList = response.data.data;
788 // this.showLoader = false; 788 // this.showLoader = false;
789 // this.showTable = true; 789 // this.showTable = true;
790 // this.hideTable = false; 790 // this.hideTable = false;
791 // }) 791 // })
792 // .catch(err => { 792 // .catch(err => {
793 // console.log("err====>", err); 793 // console.log("err====>", err);
794 // }); 794 // });
795 }) 795 })
796 .catch(error => { 796 .catch(error => {
797 this.editLoading = false; 797 this.editLoading = false;
798 }); 798 });
799 } 799 }
800 }, 800 },
801 getClass() { 801 getClass() {
802 http() 802 http()
803 .get("/getClassesList", { 803 .get("/getClassesList", {
804 headers: { Authorization: "Bearer " + this.token } 804 headers: { Authorization: "Bearer " + this.token }
805 }) 805 })
806 .then(response => { 806 .then(response => {
807 this.classList = response.data.data; 807 this.classList = response.data.data;
808 }) 808 })
809 .catch(error => { 809 .catch(error => {
810 if (error.response.status === 401) { 810 if (error.response.status === 401) {
811 this.$router.replace({ path: "/" }); 811 this.$router.replace({ path: "/" });
812 this.$store.dispatch("setToken", null); 812 this.$store.dispatch("setToken", null);
813 this.$store.dispatch("Id", null); 813 this.$store.dispatch("Id", null);
814 } 814 }
815 }); 815 });
816 }, 816 },
817 getSections(_id) { 817 getSections(_id) {
818 var token = this.$store.state.token; 818 var token = this.$store.state.token;
819 this.showLoader = true; 819 this.showLoader = true;
820 http() 820 http()
821 .get( 821 .get(
822 "/getSectionsList", 822 "/getSectionsList",
823 { params: { classId: _id } }, 823 { params: { classId: _id } },
824 { 824 {
825 headers: { Authorization: "Bearer " + token } 825 headers: { Authorization: "Bearer " + token }
826 } 826 }
827 ) 827 )
828 .then(response => { 828 .then(response => {
829 this.addSection = response.data.data; 829 this.addSection = response.data.data;
830 this.showLoader = false; 830 this.showLoader = false;
831 }) 831 })
832 .catch(err => { 832 .catch(err => {
833 this.showLoader = false; 833 this.showLoader = false;
834 }); 834 });
835 }, 835 },
836 getClassSubject(_id) { 836 getClassSubject(_id) {
837 this.showLoader = true; 837 this.showLoader = true;
838 // this.classId = this.classId; 838 // this.classId = this.classId;
839 http() 839 http()
840 .get( 840 .get(
841 "/getParticularClass", 841 "/getParticularClass",
842 { params: { classId: _id } }, 842 { params: { classId: _id } },
843 { 843 {
844 headers: { Authorization: "Bearer " + this.token } 844 headers: { Authorization: "Bearer " + this.token }
845 } 845 }
846 ) 846 )
847 .then(response => { 847 .then(response => {
848 this.subjectList = response.data.data; 848 this.subjectList = response.data.data;
849 this.showLoader = false; 849 this.showLoader = false;
850 }) 850 })
851 .catch(err => { 851 .catch(err => {
852 this.showLoader = false; 852 this.showLoader = false;
853 }); 853 });
854 }, 854 },
855 getTeacherList() { 855 getTeacherList() {
856 this.showLoader = true; 856 this.showLoader = true;
857 var token = this.$store.state.token; 857 var token = this.$store.state.token;
858 http() 858 http()
859 .get("/getTeachersList", { 859 .get("/getTeachersList", {
860 headers: { Authorization: "Bearer " + token } 860 headers: { Authorization: "Bearer " + token }
861 }) 861 })
862 .then(response => { 862 .then(response => {
863 this.teacherList = response.data.data; 863 this.teacherList = response.data.data;
864 this.showLoader = false; 864 this.showLoader = false;
865 // console.log("getTeacherList=====>",this.desserts) 865 // console.log("getTeacherList=====>",this.desserts)
866 }) 866 })
867 .catch(error => { 867 .catch(error => {
868 this.showLoader = false; 868 this.showLoader = false;
869 if (error.response.status === 401) { 869 if (error.response.status === 401) {
870 this.$router.replace({ path: "/" }); 870 this.$router.replace({ path: "/" });
871 this.$store.dispatch("setToken", null); 871 this.$store.dispatch("setToken", null);
872 this.$store.dispatch("Id", null); 872 this.$store.dispatch("Id", null);
873 } 873 }
874 }); 874 });
875 }, 875 },
876 getRoutineList() { 876 getRoutineList() {
877 this.showLoader = true; 877 this.showLoader = true;
878 http() 878 http()
879 .get( 879 .get(
880 "/getRoutineList", 880 "/getRoutineList",
881 { 881 {
882 params: { 882 params: {
883 classId: this.addRoutine.classId, 883 classId: this.addRoutine.classId,
884 sectionId: this.addRoutine.sectionId 884 sectionId: this.addRoutine.sectionId
885 } 885 }
886 }, 886 },
887 { 887 {
888 headers: { Authorization: "Bearer " + this.token } 888 headers: { Authorization: "Bearer " + this.token }
889 } 889 }
890 ) 890 )
891 .then(response => { 891 .then(response => {
892 this.routineList = response.data.data; 892 this.routineList = response.data.data;
893 this.showLoader = false; 893 this.showLoader = false;
894 this.showTable = true; 894 this.showTable = true;
895 this.hideTable = false; 895 this.hideTable = false;
896 }) 896 })
897 .catch(err => { 897 .catch(err => {
898 this.showLoader = false; 898 this.showLoader = false;
899 }); 899 });
900 }, 900 },
901 displaySearch() { 901 displaySearch() {
902 (this.show = false), (this.showSearch = true); 902 (this.show = false), (this.showSearch = true);
903 }, 903 },
904 closeSearch() { 904 closeSearch() {
905 this.showSearch = false; 905 this.showSearch = false;
906 this.show = true; 906 this.show = true;
907 this.search = ""; 907 this.search = "";
908 } 908 }
909 }, 909 },
910 mounted() { 910 mounted() {
911 this.token = this.$store.state.token; 911 this.token = this.$store.state.token;
912 this.getClass(); 912 this.getClass();
913 this.getTeacherList(); 913 this.getTeacherList();
914 this.role = this.$store.state.role; 914 this.role = this.$store.state.role;
915 } 915 }
916 }; 916 };
917 </script> 917 </script>
918 918
919 <style scoped> 919 <style scoped>
920 html, 920 html,
921 body { 921 body {
922 font-family: "OpenSans Regular"; 922 font-family: "OpenSans Regular";
923 } 923 }
924 .box .box-body { 924 .box .box-body {
925 padding: 15px; 925 padding: 15px;
926 border-top-left-radius: 0; 926 border-top-left-radius: 0;
927 border-top-right-radius: 0; 927 border-top-right-radius: 0;
928 border-bottom-right-radius: 3px; 928 border-bottom-right-radius: 3px;
929 border-bottom-left-radius: 3px; 929 border-bottom-left-radius: 3px;
930 } 930 }
931 .nav-tabs-custom { 931 .nav-tabs-custom {
932 margin-bottom: 20px; 932 margin-bottom: 20px;
933 background: #fff; 933 background: #fff;
934 box-shadow: 0px 1px 3px rgba(0, 0, 0, 0.1); 934 box-shadow: 0px 1px 3px rgba(0, 0, 0, 0.1);
935 } 935 }
936 .nav-tabs { 936 .nav-tabs {
937 border-bottom: 1px solid #ddd; 937 border-bottom: 1px solid #ddd;
938 } 938 }
939 .nav { 939 .nav {
940 padding-left: 0; 940 padding-left: 0;
941 list-style: none; 941 list-style: none;
942 } 942 }
943 .tab-content > .active { 943 .tab-content > .active {
944 display: block; 944 display: block;
945 } 945 }
946 .nav-tabs-custom > .nav-tabs > li.active > a { 946 .nav-tabs-custom > .nav-tabs > li.active > a {
947 border-top: 0; 947 border-top: 0;
948 border-left-color: #09a3a3; 948 border-left-color: #09a3a3;
949 border-right-color: #09a3a3; 949 border-right-color: #09a3a3;
950 } 950 }
951 .nav-tabs-custom > .nav-tabs { 951 .nav-tabs-custom > .nav-tabs {
952 background-color: #e5e5e5; 952 background-color: #e5e5e5;
953 margin: 0; 953 margin: 0;
954 border-bottom-color: #e5e5e5; 954 border-bottom-color: #e5e5e5;
955 } 955 }
956 .nav-tabs-custom > .nav-tabs > li:first-of-type { 956 .nav-tabs-custom > .nav-tabs > li:first-of-type {
957 margin-left: 0px; 957 margin-left: 0px;
958 } 958 }
959 .nav-tabs-custom > .nav-tabs > li.active { 959 .nav-tabs-custom > .nav-tabs > li.active {
960 border-bottom-color: #09a3a3; 960 border-bottom-color: #09a3a3;
961 } 961 }
962 .nav-tabs-custom > .nav-tabs > li { 962 .nav-tabs-custom > .nav-tabs > li {
963 border-bottom: 2px solid transparent; 963 border-bottom: 2px solid transparent;
964 border-top: 3px solid transparent; 964 border-top: 3px solid transparent;
965 margin-bottom: -2px; 965 margin-bottom: -2px;
966 margin-right: 5px; 966 margin-right: 5px;
967 } 967 }
968 .nav-tabs-custom > .nav-tabs > li:first-of-type.active > a { 968 .nav-tabs-custom > .nav-tabs > li:first-of-type.active > a {
969 border-left-width: 0; 969 border-left-width: 0;
970 } 970 }
971 .nav-tabs-custom > .nav-tabs > li.active > a { 971 .nav-tabs-custom > .nav-tabs > li.active > a {
972 border-top: 0; 972 border-top: 0;
973 border-bottom-color: #09a3a3; 973 border-bottom-color: #09a3a3;
974 } 974 }
975 .nav-tabs-custom > .nav-tabs > li.active > a, 975 .nav-tabs-custom > .nav-tabs > li.active > a,
976 .nav-tabs-custom > .nav-tabs > li.active:hover > a { 976 .nav-tabs-custom > .nav-tabs > li.active:hover > a {
977 background-color: #e5e5e5; 977 background-color: #e5e5e5;
978 border: 0px; 978 border: 0px;
979 color: #000000db; 979 color: #000000db;
980 } 980 }
981 .nav-tabs-custom > .nav-tabs > li > a, 981 .nav-tabs-custom > .nav-tabs > li > a,
982 .nav-tabs-custom > .nav-tabs > li > a:hover { 982 .nav-tabs-custom > .nav-tabs > li > a:hover {
983 border-radius: 0 !important; 983 border-radius: 0 !important;
984 } 984 }
985 .nav-tabs-custom > .tab-content { 985 .nav-tabs-custom > .tab-content {
986 background: #fff; 986 background: #fff;
987 padding: 10px; 987 padding: 10px;
988 } 988 }
989 .page-header { 989 .page-header {
990 margin: 10px 0 20px 0; 990 margin: 10px 0 20px 0;
991 padding: 0px 0px 16px; 991 padding: 0px 0px 16px;
992 font-size: 22px; 992 font-size: 22px;
993 border: none; 993 border: none;
994 } 994 }
995 .table { 995 .table {
996 width: 100%; 996 width: 100%;
997 border-collapse: collapse; 997 border-collapse: collapse;
998 border-spacing: 0; 998 border-spacing: 0;
999 } 999 }
1000 .table > tbody > tr > th, 1000 .table > tbody > tr > th,
1001 .table > tfoot > tr > th, 1001 .table > tfoot > tr > th,
1002 .table > tbody > tr > td, 1002 .table > tbody > tr > td,
1003 .table > tfoot > tr > td { 1003 .table > tfoot > tr > td {
1004 padding: 8px; 1004 padding: 8px;
1005 line-height: 1.428571429; 1005 line-height: 1.428571429;
1006 vertical-align: top; 1006 vertical-align: top;
1007 border-top: 1px solid #ddd; 1007 border-top: 1px solid #ddd;
1008 } 1008 }
1009 .nav::before, 1009 .nav::before,
1010 .nav::after { 1010 .nav::after {
1011 display: table; 1011 display: table;
1012 content: ""; 1012 content: "";
1013 } 1013 }
1014 .box .box-body .table { 1014 .box .box-body .table {
1015 margin-bottom: 0; 1015 margin-bottom: 0;
1016 } 1016 }
1017 .table-bordered { 1017 .table-bordered {
1018 border: 1px solid #e2e7eb; 1018 border: 1px solid #e2e7eb;
1019 } 1019 }
1020 .table-striped > tbody > tr:nth-child(2n + 1) > td, 1020 .table-striped > tbody > tr:nth-child(2n + 1) > td,
1021 .table-striped > tbody > tr:nth-child(2n + 1) > th { 1021 .table-striped > tbody > tr:nth-child(2n + 1) > th {
1022 background-color: #f0f3f5; 1022 background-color: #f0f3f5;
1023 } 1023 }
1024 .table-bordered > tbody > v-data-table > template > tr > th, 1024 .table-bordered > tbody > v-data-table > template > tr > th,
1025 .table-bordered > tbody > tr > td { 1025 .table-bordered > tbody > tr > td {
1026 border-color: #e2e7eb; 1026 border-color: #e2e7eb;
1027 font-size: 12px; 1027 font-size: 12px;
1028 } 1028 }
1029 .table-bordered > tbody > tr > td { 1029 .table-bordered > tbody > tr > td {
1030 color: #707070; 1030 color: #707070;
1031 } 1031 }
1032 /* 1032 /*
1033 .table-bordered > tbody > tr > th, 1033 .table-bordered > tbody > tr > th,
1034 .table-bordered > tfoot > tr > th, 1034 .table-bordered > tfoot > tr > th,
1035 .table-bordered > tbody > tr > td, 1035 .table-bordered > tbody > tr > td,
1036 .table-bordered > tfoot > tr > td { 1036 .table-bordered > tfoot > tr > td {
1037 border: 1px solid #ddd; 1037 border: 1px solid #ddd;
1038 } */ 1038 } */
1039 .mCustomScrollbar.mCS_no_scrollbar, 1039 .mCustomScrollbar.mCS_no_scrollbar,
1040 .mCustomScrollbar.mCS_touch_action { 1040 .mCustomScrollbar.mCS_touch_action {
1041 touch-action: auto; 1041 touch-action: auto;
1042 } 1042 }
1043 .mCSB_scrollTools.mCSB_scrollTools_horizontal { 1043 .mCSB_scrollTools.mCSB_scrollTools_horizontal {
1044 width: auto; 1044 width: auto;
1045 height: 16px; 1045 height: 16px;
1046 top: auto; 1046 top: auto;
1047 right: 0; 1047 right: 0;
1048 bottom: 0; 1048 bottom: 0;
1049 left: 0; 1049 left: 0;
1050 } 1050 }
1051 .mCSB_scrollTools { 1051 .mCSB_scrollTools {
1052 opacity: 0.75; 1052 opacity: 0.75;
1053 } 1053 }
1054 .mCSB_scrollTools .mCSB_draggerContainer { 1054 .mCSB_scrollTools .mCSB_draggerContainer {
1055 position: absolute; 1055 position: absolute;
1056 height: auto; 1056 height: auto;
1057 top: 0; 1057 top: 0;
1058 left: 0; 1058 left: 0;
1059 bottom: 0; 1059 bottom: 0;
1060 right: 0; 1060 right: 0;
1061 } 1061 }
1062 .mCSB_scrollTools.mCSB_scrollTools_horizontal .mCSB_dragger { 1062 .mCSB_scrollTools.mCSB_scrollTools_horizontal .mCSB_dragger {
1063 height: 100%; 1063 height: 100%;
1064 } 1064 }
1065 .mCSB_scrollTools .mCSB_dragger { 1065 .mCSB_scrollTools .mCSB_dragger {
1066 cursor: pointer; 1066 cursor: pointer;
1067 z-index: 1; 1067 z-index: 1;
1068 } 1068 }
1069 .mCSB_scrollTools.mCSB_scrollTools_horizontal .mCSB_dragger .mCSB_dragger_bar { 1069 .mCSB_scrollTools.mCSB_scrollTools_horizontal .mCSB_dragger .mCSB_dragger_bar {
1070 width: 100%; 1070 width: 100%;
1071 height: 4px; 1071 height: 4px;
1072 margin: 6px auto; 1072 margin: 6px auto;
1073 } 1073 }
1074 .mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar { 1074 .mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar {
1075 background-color: rgba(255, 255, 255, 0.75); 1075 background-color: rgba(255, 255, 255, 0.75);
1076 } 1076 }
1077 .mCSB_scrollTools.mCSB_scrollTools_horizontal .mCSB_draggerRail { 1077 .mCSB_scrollTools.mCSB_scrollTools_horizontal .mCSB_draggerRail {
1078 width: 100%; 1078 width: 100%;
1079 height: 2px; 1079 height: 2px;
1080 margin: 7px 0; 1080 margin: 7px 0;
1081 } 1081 }
1082 .mCSB_scrollTools .mCSB_draggerRail { 1082 .mCSB_scrollTools .mCSB_draggerRail {
1083 background-color: rgba(0, 0, 0, 0.4); 1083 background-color: rgba(0, 0, 0, 0.4);
1084 border-radius: 16px; 1084 border-radius: 16px;
1085 } 1085 }
1086 .mCustomScrollBox { 1086 .mCustomScrollBox {
1087 position: relative; 1087 position: relative;
1088 overflow: hidden; 1088 overflow: hidden;
1089 height: 100%; 1089 height: 100%;
1090 max-width: 100%; 1090 max-width: 100%;
1091 outline: none; 1091 outline: none;
1092 direction: ltr; 1092 direction: ltr;
1093 } 1093 }
1094 /* .mCSB_horizontal > .mCSB_container.mCS_no_scrollbar_x.mCS_x_hidden { 1094 /* .mCSB_horizontal > .mCSB_container.mCS_no_scrollbar_x.mCS_x_hidden {
1095 margin-bottom: 0; 1095 margin-bottom: 0;
1096 } 1096 }
1097 .mCSB_horizontal.mCSB_inside > .mCSB_container { 1097 .mCSB_horizontal.mCSB_inside > .mCSB_container {
1098 margin-right: 0; 1098 margin-right: 0;
1099 } */ 1099 } */
1100 .mCSB_container { 1100 .mCSB_container {
1101 overflow: hidden; 1101 overflow: hidden;
1102 height: auto; 1102 height: auto;
1103 } 1103 }
1104 1104
1105 @media (min-width: 768px) { 1105 @media (min-width: 768px) {
1106 .col-sm-12 { 1106 .col-sm-12 {
1107 width: 100%; 1107 width: 100%;
1108 } 1108 }
1109 } 1109 }
1110 </style> 1110 </style>