Commit 813e55a7930fcf35599672a129a91f8f08684b3f

Authored by Neeraj Sharma
1 parent 1159d4f6d0

implement parents all api and fix others bugs

1 const Menu = [ 1 const Menu = [
2 // { header: 'Apps' }, 2 // { header: 'Apps' },
3 { 3 {
4 title: 'Class', 4 title: 'Class',
5 // group: 'apps', 5 // group: 'apps',
6 name: 'addclass', 6 name: 'addclass',
7 icon: 'local_library', 7 icon: 'local_library',
8 }, 8 },
9 { 9 {
10 title: 'Section', 10 title: 'Section',
11 // group: 'apps', 11 // group: 'apps',
12 name: 'section', 12 name: 'section',
13 icon: 'view_module', 13 icon: 'view_module',
14 }, 14 },
15 { 15 {
16 title: 'Teachers', 16 title: 'Parents',
17 // group: '', 17 // group: 'apps',
18 name: 'teachers', 18 name: 'parents',
19 icon: 'group', 19 icon: 'group',
20 }, 20 },
21 { 21 {
22 title: 'Students', 22 title: 'Teachers',
23 // group: 'apps', 23 // group: '',
24 name: 'Students', 24 name: 'teachers',
25 icon: 'school', 25 icon: 'person',
26 }, 26 },
27 // { 27 {
28 // title: 'Event', 28 title: 'Students',
29 // name: 'event', 29 // group: 'apps',
30 // icon: 'event_available', 30 name: 'Students',
31 // }, 31 icon: 'school',
32 { 32 },
33 title: 'News', 33 // {
34 name: 'news', 34 // title: 'Event',
35 icon: 'notification_important', 35 // name: 'event',
36 }, 36 // icon: 'event_available',
37 // { 37 // },
38 // title: 'Reminder', 38 {
39 // name: 'reminder', 39 title: 'News',
40 // icon: 'alarm_add', 40 name: 'news',
41 // }, 41 icon: 'notification_important',
42 { 42 },
43 title: 'Time Table', 43 // {
44 name: 'timeTable', 44 // title: 'Reminder',
45 icon: 'event_note', 45 // name: 'reminder',
46 }, 46 // icon: 'alarm_add',
47 { 47 // },
48 title: 'Notification', 48 {
49 name: 'notification', 49 title: 'Time Table',
50 icon: 'notifications_active', 50 name: 'timeTable',
51 }, 51 icon: 'event_note',
52 },
53 {
54 title: 'Notification',
55 name: 'notification',
56 icon: 'notifications_active',
57 },
52 ]; 58 ];
53 59
54 60
55 // reorder menu 61 // reorder menu
56 Menu.forEach((item) => { 62 Menu.forEach((item) => {
57 if (item.items) { 63 if (item.items) {
58 item.items.sort((x, y) => { 64 item.items.sort((x, y) => {
59 let textA = x.title.toUpperCase(); 65 let textA = x.title.toUpperCase();
60 let textB = y.title.toUpperCase(); 66 let textB = y.title.toUpperCase();
61 return (textA < textB) ? -1 : (textA > textB) ? 1 : 0; 67 return (textA < textB) ? -1 : (textA > textB) ? 1 : 0;
62 }); 68 });
63 } 69 }
64 }); 70 });
65 71
66 export default Menu; 72 export default Menu;
src/pages/Parent/parents.vue
File was created 1 <template>
2 <v-app id="pages-dasboard">
3 <v-toolbar class="fixcolors" fixed app>
4 <v-toolbar-title class="ml-0 pl-3">
5 <v-toolbar-side-icon @click.stop="handleDrawerToggle" class="hide"></v-toolbar-side-icon>
6 </v-toolbar-title>
7
8 <!-- ****** SEARCH ALL EXISTING PARENT ****** -->
9
10 <v-flex xs7 sm3 class="userSearch">
11 <v-text-field
12 flat
13 append-icon="search"
14 label="Find Parents"
15 v-model="search"
16 color="white"
17 dark
18 ></v-text-field>
19 </v-flex>
20 <v-spacer></v-spacer>
21 <v-menu offset-y origin="center center" :nudge-bottom="10" transition="scale-transition">
22 <v-btn icon large flat slot="activator">
23 <v-avatar size="40px">
24 <img src="/static/icon/user.png" />
25 </v-avatar>
26 </v-btn>
27 <v-list class="pa-0">
28 <v-list-tile
29 v-for="(item,index) in items"
30 :to="!item.href ? { name: item.name } : null"
31 :href="item.href"
32 @click="item.click"
33 ripple="ripple"
34 :disabled="item.disabled"
35 :target="item.target"
36 rel="noopener"
37 :key="index"
38 >
39 <v-list-tile-action v-if="item.icon">
40 <v-icon>{{ item.icon }}</v-icon>
41 </v-list-tile-action>
42 <v-list-tile-content>
43 <v-list-tile-title>{{ item.title }}</v-list-tile-title>
44 </v-list-tile-content>
45 </v-list-tile>
46 </v-list>
47 </v-menu>
48 </v-toolbar>
49 <v-tabs grow slider-color="black">
50 <v-tab
51 ripple
52 @click="activeTab('existing')"
53 v-bind:class="{ active: isActive }"
54 id="tab"
55 class="subheading"
56 >Existing Parents</v-tab>
57 <v-tab
58 ripple
59 @click="activeTab('new')"
60 v-bind:class="{ active: newActive }"
61 id="tab1"
62 User
63 class="subheading"
64 >Add New Parents</v-tab>
65
66 <!-- ****** EDITS Parents DETAILS ****** -->
67
68 <v-tab-item>
69 <v-snackbar
70 :timeout="timeout"
71 :top="y === 'top'"
72 :right="x === 'right'"
73 :vertical="mode === 'vertical'"
74 v-model="snackbar"
75 color="success"
76 >{{ text }}</v-snackbar>
77 <v-dialog v-model="dialog" max-width="700px" scrollable>
78 <v-card flat>
79 <v-toolbar color="grey lighten-2" flat>
80 <v-spacer></v-spacer>
81 <v-toolbar-title>
82 <h3>Edit Parent Profile</h3>
83 </v-toolbar-title>
84 <v-spacer></v-spacer>
85 <v-icon @click="close">close</v-icon>
86 </v-toolbar>
87 <v-card-text style="height: 410px;">
88 <v-form ref="form">
89 <v-container fluid>
90 <v-layout>
91 <v-flex xs12>
92 <v-layout>
93 <v-flex xs4 class="pt-4 subheading">
94 <label class="right">Email ID:</label>
95 </v-flex>
96 <v-flex xs8 class="ml-3">
97 <v-text-field
98 placeholder="fill your email"
99 v-model="editedItem.email"
100 type="text"
101 name="email"
102 required
103 ></v-text-field>
104 </v-flex>
105 </v-layout>
106 </v-flex>
107 </v-layout>
108 <v-layout>
109 <v-flex xs12>
110 <v-layout>
111 <v-flex xs4 class="pt-4 subheading">
112 <label class="right">Father Cell No:</label>
113 </v-flex>
114 <v-flex xs8 class="ml-3">
115 <v-text-field
116 v-model="editedItem.fatherCellNo"
117 placeholder="fill your father Cell Number"
118 name="state"
119 type="number"
120 required
121 ></v-text-field>
122 </v-flex>
123 </v-layout>
124 </v-flex>
125 <v-flex xs12>
126 <v-layout>
127 <v-flex xs4 class="pt-4 subheading">
128 <label class="right">Mother Name:</label>
129 </v-flex>
130 <v-flex xs8 class="ml-3">
131 <v-text-field
132 v-model="editedItem.motherName"
133 placeholder="fill your Mother Name"
134 name="state"
135 type="text"
136 required
137 ></v-text-field>
138 </v-flex>
139 </v-layout>
140 </v-flex>
141 <v-flex xs12>
142 <v-layout>
143 <v-flex xs4 class="pt-4 subheading">
144 <label class="right">Mother Cell No:</label>
145 </v-flex>
146 <v-flex xs8 class="ml-3">
147 <v-text-field
148 v-model="editedItem.motherCellNo"
149 placeholder="fill your Mother Cell Number"
150 name="state"
151 type="number"
152 required
153 ></v-text-field>
154 </v-flex>
155 </v-layout>
156 </v-flex>
157 </v-layout>
158 <v-layout>
159 <v-flex xs12 sm12>
160 <v-card-actions>
161 <v-spacer></v-spacer>
162 <v-btn round dark @click="save">Save</v-btn>
163 <v-spacer></v-spacer>
164 </v-card-actions>
165 </v-flex>
166 </v-layout>
167 </v-container>
168 </v-form>
169 </v-card-text>
170 </v-card>
171 </v-dialog>
172
173 <!-- ****** PROFILE VIEW Parents DEATILS ****** -->
174
175 <v-dialog v-model="dialog1" max-width="800px" scrollable>
176 <v-card>
177 <v-toolbar color="grey lighten-2" flat>
178 <v-spacer></v-spacer>
179 <v-toolbar-title>Parent Profile</v-toolbar-title>
180 <v-spacer></v-spacer>
181 <v-icon @click="close1">close</v-icon>
182 </v-toolbar>
183 <v-card-text style="height: 300px;">
184 <!-- <v-flex align-center justify-center layout text-xs-center class="mt-3">
185 <v-avatar size="160px">
186 <img src="/static/icon/user.png" v-if="!editedItem.profilePicUrl" />
187 <img :src="editedItem.profilePicUrl" v-else-if="editedItem.profilePicUrl" />
188 </v-avatar>
189 </v-flex>-->
190 <v-container grid-list-md>
191 <v-layout wrap>
192 <v-flex>
193 <v-layout>
194 <v-flex xs12 sm12>
195 <v-layout>
196 <v-flex xs6>
197 <h5 class="right my-1">
198 <b>Email:</b>
199 </h5>
200 </v-flex>
201 <v-flex xs6>
202 <h5 class="my-1 left">{{ editedItem.email }}</h5>
203 </v-flex>
204 </v-layout>
205 </v-flex>
206 </v-layout>
207 <v-layout>
208 <v-flex xs12>
209 <v-layout>
210 <v-flex xs6>
211 <b>
212 <h5 class="right my-1">
213 <b>Fahter Name:</b>
214 </h5>
215 </b>
216 </v-flex>
217 <v-flex xs6>
218 <h5 class="my-1">{{ editedItem.fatherName }}</h5>
219 </v-flex>
220 </v-layout>
221 </v-flex>
222 </v-layout>
223 <v-layout>
224 <v-flex xs12>
225 <v-layout>
226 <v-flex xs6>
227 <b>
228 <h5 class="right my-1">
229 <b>Mother Name:</b>
230 </h5>
231 </b>
232 </v-flex>
233 <v-flex xs6>
234 <h5 class="my-1">{{ editedItem.motherName }}</h5>
235 </v-flex>
236 </v-layout>
237 </v-flex>
238 </v-layout>
239 <v-layout>
240 <v-flex xs12>
241 <v-layout>
242 <v-flex sm6>
243 <b>
244 <h5 class="right my-1">
245 <b>Father Cell No:</b>
246 </h5>
247 </b>
248 </v-flex>
249 <v-flex sm6>
250 <h5 class="my-1">{{ editedItem.fatherCellNo }}</h5>
251 </v-flex>
252 </v-layout>
253 </v-flex>
254 </v-layout>
255 <v-layout>
256 <v-flex xs12>
257 <v-layout>
258 <v-flex xs6>
259 <b>
260 <h5 class="right my-1">
261 <b>Mother Cell No:</b>
262 </h5>
263 </b>
264 </v-flex>
265 <v-flex xs6>
266 <h5 class="my-1">{{ editedItem.motherCellNo }}</h5>
267 </v-flex>
268 </v-layout>
269 </v-flex>
270 </v-layout>
271 </v-flex>
272 </v-layout>
273 </v-container>
274 </v-card-text>
275 </v-card>
276 </v-dialog>
277
278 <v-snackbar
279 :timeout="timeout"
280 :top="y === 'top'"
281 :right="x === 'right'"
282 :vertical="mode === 'vertical'"
283 v-model="snackbar"
284 color="success"
285 >{{ text }}</v-snackbar>
286
287 <!-- ****** EXISTING-USERS Parents TABLE ****** -->
288 <v-data-table
289 :headers="headers"
290 :items="parentsList"
291 :pagination.sync="pagination"
292 :search="search"
293 >
294 <template slot="items" slot-scope="props">
295 <td id="td" class="text-xs-center">{{ props.index}}</td>
296 <td id="td" class="text-xs-center">{{ props.item.email }}</td>
297 <td id="td" class="text-xs-center">{{ props.item.fatherName }}</td>
298 <td id="td" class="text-xs-center">{{ props.item.fatherCellNo }}</td>
299 <td id="td" class="text-xs-center">{{ props.item.motherName }}</td>
300 <td id="td" class="text-xs-center">{{ props.item.motherCellNo }}</td>
301 <td class="text-xs-center">
302 <span>
303 <img
304 style="cursor:pointer; width:25px; height:18px; "
305 class="mr-5"
306 @click="profile(props.item)"
307 src="/static/icon/eye1.png"
308 />
309 <img
310 style="cursor:pointer; width:20px; height:18px; "
311 class="mr-5"
312 @click="editItem(props.item)"
313 src="/static/icon/edit1.png"
314 />
315 </span>
316 </td>
317 </template>
318 <v-alert
319 slot="no-results"
320 :value="true"
321 color="error"
322 icon="warning"
323 >Your search for "{{ search }}" found no results.</v-alert>
324 </v-data-table>
325 </v-tab-item>
326
327 <!-- ****** ADD PARENTS DETAILS****** -->
328 <v-tab-item>
329 <v-container fluid class="mt-5">
330 <v-layout align-center justify-center fill-height>
331 <v-flex xs12 sm8 md7 lg8>
332 <v-card>
333 <v-container fluid class>
334 <v-layout>
335 <v-flex xs12>
336 <v-snackbar
337 :timeout="timeout"
338 :top="y === 'top'"
339 :right="x === 'right'"
340 :vertical="mode === 'vertical'"
341 v-model="snackbar"
342 color="success"
343 >{{ text }}</v-snackbar>
344 <v-flex xs12 sm12>
345 <v-form ref="parentForm" v-model="valid" lazy-validation>
346 <v-container fluid>
347 <v-layout>
348 <v-flex xs12 sm6>
349 <v-layout>
350 <v-flex xs4 class="pt-4 subheading">
351 <label class="right">Parent Email Id:</label>
352 </v-flex>
353 <v-flex xs8 class="ml-3">
354 <v-text-field
355 placeholder="fill Parent email"
356 :rules="emailRules"
357 v-model="parentData.email"
358 type="text"
359 v-on:keyup="getParentDetails"
360 name="email"
361 required
362 ></v-text-field>
363 </v-flex>
364 </v-layout>
365 </v-flex>
366 <v-flex xs12 sm6>
367 <v-layout>
368 <v-flex xs4 class="pt-4 subheading">
369 <label class="right">Father Name:</label>
370 </v-flex>
371 <v-flex xs8 class="ml-3">
372 <v-text-field
373 v-model="parentData.fatherName"
374 :rules="fatherNameRules"
375 placeholder="Fill your father Name"
376 required
377 ></v-text-field>
378 </v-flex>
379 </v-layout>
380 </v-flex>
381 </v-layout>
382 <v-layout>
383 <v-flex xs12 sm6>
384 <v-layout>
385 <v-flex xs4 class="pt-4 subheading">
386 <label class="right">Father Cell No:</label>
387 </v-flex>
388 <v-flex xs8 class="ml-3">
389 <v-text-field
390 v-model="parentData.fatherCellNo"
391 placeholder="fill your father Cell Number"
392 name="state"
393 type="number"
394 :rules="fatheCellNoRules"
395 required
396 ></v-text-field>
397 </v-flex>
398 </v-layout>
399 </v-flex>
400 <v-flex xs12 sm6>
401 <v-layout>
402 <v-flex xs4 class="pt-4 subheading">
403 <label class="right">Mother Name:</label>
404 </v-flex>
405 <v-flex xs8 class="ml-3">
406 <v-text-field
407 v-model="parentData.motherName"
408 placeholder="fill your Mother Name"
409 name="state"
410 type="text"
411 :rules="motherNameRules"
412 required
413 ></v-text-field>
414 </v-flex>
415 </v-layout>
416 </v-flex>
417 </v-layout>
418 <v-layout>
419 <v-flex xs12 sm6>
420 <v-layout>
421 <v-flex xs4 class="pt-4 subheading">
422 <label class="right">Mother Cell No:</label>
423 </v-flex>
424 <v-flex xs8 class="ml-3">
425 <v-text-field
426 v-model="parentData.motherCellNo"
427 placeholder="fill your Mother Cell Number"
428 name="state"
429 type="number"
430 :rules="motherCellNoRules"
431 required
432 ></v-text-field>
433 </v-flex>
434 </v-layout>
435 </v-flex>
436 </v-layout>
437 <v-flex xs12 sm12>
438 <v-card-actions>
439 <v-btn @click="clear" round dark class="ml-4">clear</v-btn>
440 <v-spacer></v-spacer>
441 <v-btn
442 @click="submitParentDetails"
443 round
444 dark
445 :loading="loading"
446 v-show="showParent"
447 >Add</v-btn>
448 </v-card-actions>
449 </v-flex>
450 </v-container>
451 </v-form>
452 </v-flex>
453 </v-flex>
454 </v-layout>
455 </v-container>
456 </v-card>
457 </v-flex>
458 </v-layout>
459 </v-container>
460 </v-tab-item>
461 </v-tabs>
462 <div class="loader" v-if="showLoader">
463 <v-progress-circular indeterminate color="white"></v-progress-circular>
464 </div>
465 </v-app>
466 </template>
467
468 <script>
469 import http from "@/Services/http.js";
470 import Util from "@/util";
471 import moment from "moment";
472
473 export default {
474 data: () => ({
475 showParent: true,
476 snackbar: false,
477 y: "top",
478 x: "right",
479 mode: "",
480 timeout: 3000,
481 text: "",
482 showLoader: false,
483 loading: false,
484 date: null,
485 search: "",
486 menu: false,
487 menu1: false,
488 dialog: false,
489 dialog1: false,
490 valid: true,
491 isActive: true,
492 newActive: false,
493 AddUsercredentials: {},
494 pagination: {
495 rowsPerPage: 15
496 },
497 fatherNameRules: [v => !!v || " Father Name is required"],
498 fatheCellNoRules: [v => !!v || " father Cell Number is required"],
499 motherNameRules: [v => !!v || " Mother Name is required"],
500 motherCellNoRules: [v => !!v || " Mother Cell Number is required"],
501 errorMessages: "",
502 emailRules: [
503 v => !!v || "E-mail is required",
504 v =>
505 /^\w+([.-]?\w+)*@\w+([.-]?\w+)*(\.\w{2,3})+$/.test(v) ||
506 "E-mail must be valid"
507 ],
508 headers: [
509 {
510 text: "No",
511 align: "center",
512 sortable: false,
513 value: "No"
514 },
515 { text: "Email", value: "email", sortable: false, align: "center" },
516 {
517 text: "Father Name",
518 value: "fatherName",
519 sortable: false,
520 align: "center"
521 },
522 {
523 text: "Father Cell No",
524 value: "fatherName",
525 sortable: false,
526 align: "center"
527 },
528 {
529 text: "Mother Name",
530 value: "motherName",
531 sortable: false,
532 align: "center"
533 },
534 {
535 text: "Mother Cell No",
536 value: "motherCellNo",
537 sortable: false,
538 align: "center"
539 },
540 { text: "Action", value: "", sortable: false, align: "center" }
541 ],
542 parentsList: [],
543 editedIndex: -1,
544 parentData: {},
545 editedItem: {
546 fatherName: "",
547 fatherCellNo: "",
548 motherName: "",
549 motherCellNo: "",
550 email: ""
551 },
552 items: [
553 {
554 href: "/changepassword",
555 title: "Change Password",
556 click: e => {
557 console.log(e);
558 }
559 },
560 {
561 href: "#",
562 title: "Logout",
563 click: e => {
564 window.getApp.$emit("APP_LOGOUT");
565 }
566 }
567 ]
568 }),
569 watch: {
570 menu(val) {
571 val && this.$nextTick(() => (this.$refs.picker.activePicker = "YEAR"));
572 },
573 menu1(val) {
574 val && this.$nextTick(() => (this.$refs.picker.activePicker = "YEAR"));
575 }
576 },
577 methods: {
578 editItem(item) {
579 this.editedIndex = this.parentsList.indexOf(item);
580 this.editedItem = Object.assign({}, item);
581 this.dialog = true;
582 },
583 profile(item) {
584 console.log("item", item);
585 this.editedIndex = this.parentsList.indexOf(item);
586 this.editedItem = Object.assign({}, item);
587 this.dialog1 = true;
588 },
589 activeTab(type) {
590 switch (type) {
591 case "existing":
592 this.newActive = false;
593 this.isActive = true;
594 break;
595
596 default:
597 this.newActive = true;
598 this.isActive = false;
599 break;
600 }
601 },
602 close() {
603 this.dialog = false;
604 setTimeout(() => {
605 this.editedItem = Object.assign({}, this.defaultItem);
606 this.editedIndex = -1;
607 }, 300);
608 },
609 close1() {
610 this.dialog1 = false;
611 },
612 clear() {
613 this.$refs.parentForm.reset();
614 },
615 save() {
616 this.editedItem.parentId = this.editedItem._id;
617 http()
618 .put("/updateParent", this.editedItem)
619 .then(response => {
620 if ((this.snackbar = true)) {
621 this.text = "Successfully Student Existing User";
622 }
623 this.getParentDetails();
624 this.close();
625 })
626 .catch(error => {
627 if ((this.snackbar = true)) {
628 this.text = error.response.data.statusText;
629 }
630 });
631 },
632 submitParentDetails() {
633 if (this.$refs.parentForm.validate()) {
634 let addparentDetails = {
635 email: this.parentData.email,
636 fatherName: this.parentData.fatherName,
637 fatherCellNo: this.parentData.fatherCellNo,
638 motherName: this.parentData.motherName,
639 motherCellNo: this.parentData.motherCellNo,
640 role: "PARENT"
641 };
642 this.loading = true;
643 http()
644 .post("/createParent", addparentDetails)
645 .then(response => {
646 this.parentId = response.data.data.id;
647 if ((this.snackbar = true)) {
648 this.text = "successfully";
649 }
650 this.getParentDetails();
651 this.clear();
652 this.loading = false;
653 })
654 .catch(error => {
655 console.log(error.response.data);
656 if ((this.snackbar = true)) {
657 this.text = error.response.data.message;
658 this.text = error.response.data.statusText;
659 }
660 this.loading = false;
661 });
662 }
663 },
664 getParentDetails() {
665 http()
666 .get("getParentsList", {
667 headers: {
668 Authorization: "Bearer " + this.$store.state.token
669 }
670 })
671 .then(response => {
672 this.parentsList = response.data.data;
673 })
674 .catch(error => {
675 console.log("err====>", error.response.data.message);
676 });
677 },
678 handleDrawerToggle() {
679 window.getApp.$emit("APP_DRAWER_TOGGLED");
680 },
681 handleFullScreen() {
682 Util.toggleFullScreen();
683 }
684 },
685 mounted() {
686 this.getParentDetails();
687 },
688 computed: {
689 toolbarColor() {
690 return this.$vuetify.options.extra.mainNav;
691 }
692 }
693 };
694 </script>
695 <style scoped>
696 .v-tabs__div {
697 text-transform: none;
698 }
699 .v-input__prepend-outer {
700 margin-right: 0px !important;
701 }
702 .v-card__actions .v-btn {
703 margin: 0 15px;
704 min-width: 120px;
705 }
706 .primary {
707 background-color: #aaa !important;
708 border-color: #aaa !important;
709 }
710 h4 {
711 background-repeat: no-repeat;
712 padding: 8px;
713 margin: auto;
714 font-size: 25px;
715 }
716 #name {
717 position: absolute;
718 left: 100px;
719 top: 17px;
720 }
721 #icon {
722 position: absolute;
723 right: 8px;
724 top: 8px;
725 }
726 #m {
727 position: relative;
728 left: 135px;
729 top: -15px;
730 }
731 #G {
732 position: absolute;
733 top: 38px;
734 color: white;
735 }
736 #bt {
737 position: relative;
738 top: -20px;
739 left: 115px;
740 }
741 #e {
742 position: relative;
743 top: 5px;
744 right: -30px;
745 height: 17px;
746 cursor: pointer;
747 }
748 #d {
749 position: relative;
750 top: 5px;
751 right: -70px;
752 height: 17px;
753 cursor: pointer;
754 }
755 #td {
756 border: 1px solid #dddddd;
757 text-align: left;
758 padding: 8px;
759 }
760 #dialog {
761 height: 550px;
762 }
763 .active {
764 background-color: black;
765 color: white !important;
766 }
767 .activebtn {
768 color: black !important;
769 }
770 #flex {
771 height: 300px;
772 }
773 .top {
774 margin-top: 100px;
775 }
776 .v-tabs__item a {
777 font-size: 16px !important;
778 }
779 @media screen and (max-width: 769px) {
780 .top {
781 margin-top: 0 !important;
782 }
783 .userSearch .v-icon {
784 font-size: 20px !important;
785 margin-left: 20px;
786 }
787 }
788 @media screen and (max-width: 380px) {
789 .pl-3 {
790 padding-left: 0px !important;
791 }
792 .right {
793 float: none !important;
794 }
795 .subheading {
796 font-size: 14px !important;
797 }
798 .v-card__actions .v-btn {
799 margin: 0 0px;
800 min-width: 100px;
801 }
802 /* .searchIcon .v-icon {
803 font-size: 20px;
804 margin-left: 20px;
805 } */
806 .subheading {
807 font-size: 12px !important;
808 }
809 h5 {
810 font-size: 13px;
811 }
812 }
813 .v-icon {
814 font-size: 30px;
815 }
816 @media screen and (min-width: 1270px) {
817 .hide {
818 display: none;
819 }
820 /* }
821 @media screen and (max-width: 962px) {
822 .imglogo{
823 position: absolute;
824 top: 13px;
825 left: 13px !important;
826 width: 70px;
827 height: 24px;
828 } */
829 }
830 @media screen and (max-width: 420px) {
831 .userSearch .v-text-field .v-label {
832 line-height: 24px !important;
833 }
834 .userSearch .v-label {
835 font-size: 13px !important;
836 }
837 .v-list__tile {
838 font-size: 14px;
839 padding: 0 10px;
840 }
841 .name {
842 font-size: 15px;
843 }
844 }
845 </style>
src/pages/Students/students.vue
1 <template> 1 <template>
2 <v-app id="pages-dasboard"> 2 <v-app id="pages-dasboard">
3 <v-toolbar class="fixcolors" fixed app> 3 <v-toolbar class="fixcolors" fixed app>
4 <v-toolbar-title class="ml-0 pl-3"> 4 <v-toolbar-title class="ml-0 pl-3">
5 <v-toolbar-side-icon @click.stop="handleDrawerToggle" class="hide"></v-toolbar-side-icon> 5 <v-toolbar-side-icon @click.stop="handleDrawerToggle" class="hide"></v-toolbar-side-icon>
6 </v-toolbar-title> 6 </v-toolbar-title>
7 <!-- ****** SEARCH ALL EXISTING StudentS ****** --> 7 <!-- ****** SEARCH ALL EXISTING StudentS ****** -->
8 <v-flex xs7 sm3 class="userSearch"> 8 <v-flex xs7 sm3 class="userSearch">
9 <v-text-field 9 <v-text-field
10 flat 10 flat
11 append-icon="search" 11 append-icon="search"
12 label="Find your Students" 12 label="Find your Students"
13 v-model="search" 13 v-model="search"
14 color="white" 14 color="white"
15 dark 15 dark
16 ></v-text-field> 16 ></v-text-field>
17 </v-flex> 17 </v-flex>
18 <v-spacer></v-spacer> 18 <v-spacer></v-spacer>
19 <v-menu offset-y origin="center center" :nudge-bottom="10" transition="scale-transition"> 19 <v-menu offset-y origin="center center" :nudge-bottom="10" transition="scale-transition">
20 <v-btn icon large flat slot="activator"> 20 <v-btn icon large flat slot="activator">
21 <v-avatar size="40px"> 21 <v-avatar size="40px">
22 <img src="/static/icon/user.png" /> 22 <img src="/static/icon/user.png" />
23 </v-avatar> 23 </v-avatar>
24 </v-btn> 24 </v-btn>
25 <v-list class="pa-0"> 25 <v-list class="pa-0">
26 <v-list-tile 26 <v-list-tile
27 v-for="(item,index) in items" 27 v-for="(item,index) in items"
28 :to="!item.href ? { name: item.name } : null" 28 :to="!item.href ? { name: item.name } : null"
29 :href="item.href" 29 :href="item.href"
30 @click="item.click" 30 @click="item.click"
31 ripple="ripple" 31 ripple="ripple"
32 :disabled="item.disabled" 32 :disabled="item.disabled"
33 :target="item.target" 33 :target="item.target"
34 rel="noopener" 34 rel="noopener"
35 :key="index" 35 :key="index"
36 > 36 >
37 <v-list-tile-action v-if="item.icon"> 37 <v-list-tile-action v-if="item.icon">
38 <v-icon>{{ item.icon }}</v-icon> 38 <v-icon>{{ item.icon }}</v-icon>
39 </v-list-tile-action> 39 </v-list-tile-action>
40 <v-list-tile-content> 40 <v-list-tile-content>
41 <v-list-tile-title>{{ item.title }}</v-list-tile-title> 41 <v-list-tile-title>{{ item.title }}</v-list-tile-title>
42 </v-list-tile-content> 42 </v-list-tile-content>
43 </v-list-tile> 43 </v-list-tile>
44 </v-list> 44 </v-list>
45 </v-menu> 45 </v-menu>
46 </v-toolbar> 46 </v-toolbar>
47 <v-tabs grow slider-color="black"> 47 <v-tabs grow slider-color="black">
48 <v-tab 48 <v-tab
49 ripple 49 ripple
50 @click="activeTab('existing')" 50 @click="activeTab('existing')"
51 v-bind:class="{ active: isActive }" 51 v-bind:class="{ active: isActive }"
52 id="tab" 52 id="tab"
53 class="subheading" 53 class="subheading"
54 >Existing Students</v-tab> 54 >Existing Students</v-tab>
55 <v-tab 55 <v-tab
56 ripple 56 ripple
57 @click="activeTab('new')" 57 @click="activeTab('new')"
58 v-bind:class="{ active: newActive }" 58 v-bind:class="{ active: newActive }"
59 id="tab1" 59 id="tab1"
60 User 60 User
61 class="subheading" 61 class="subheading"
62 >Add New Students</v-tab> 62 >Add New Students</v-tab>
63 63
64 <!-- ****** EDITS STUDENTS DETAILS ****** --> 64 <!-- ****** EDITS STUDENTS DETAILS ****** -->
65 65
66 <v-tab-item> 66 <v-tab-item>
67 <v-snackbar 67 <v-snackbar
68 :timeout="timeout" 68 :timeout="timeout"
69 :top="y === 'top'" 69 :top="y === 'top'"
70 :right="x === 'right'" 70 :right="x === 'right'"
71 :vertical="mode === 'vertical'" 71 :vertical="mode === 'vertical'"
72 v-model="snackbar" 72 v-model="snackbar"
73 color="success" 73 color="success"
74 >{{ text }}</v-snackbar> 74 >{{ text }}</v-snackbar>
75 <v-dialog v-model="dialog" max-width="1300px" scrollable> 75 <v-dialog v-model="dialog" max-width="1300px" scrollable>
76 <v-card flat> 76 <v-card flat>
77 <v-toolbar color="grey lighten-2" flat> 77 <v-toolbar color="grey lighten-2" flat>
78 <v-spacer></v-spacer> 78 <v-spacer></v-spacer>
79 <v-toolbar-title> 79 <v-toolbar-title>
80 <h3>Edit Student Profile</h3> 80 <h3>Edit Student Profile</h3>
81 </v-toolbar-title> 81 </v-toolbar-title>
82 <v-spacer></v-spacer> 82 <v-spacer></v-spacer>
83 </v-toolbar> 83 </v-toolbar>
84 <v-card-text style="height: 800px;"> 84 <v-card-text style="height: 800px;">
85 <v-form ref="form"> 85 <v-form ref="form">
86 <v-container fluid> 86 <v-container fluid>
87 <v-layout> 87 <v-layout>
88 <v-flex 88 <v-flex
89 xs12 89 xs12
90 class="text-xs-center text-sm-center text-md-center text-lg-center mr-4" 90 class="text-xs-center text-sm-center text-md-center text-lg-center mr-4"
91 > 91 >
92 <v-avatar size="160px"> 92 <v-avatar size="160px">
93 <img 93 <img
94 src="/static/icon/user.png" 94 src="/static/icon/user.png"
95 v-if="!editedItem.profilePicUrl && !imageUrl" 95 v-if="!editedItem.profilePicUrl && !imageUrl"
96 /> 96 />
97 <img 97 <img
98 :src="editedItem.profilePicUrl" 98 :src="editedItem.profilePicUrl"
99 v-else-if="editedItem.profilePicUrl && !imageUrl" 99 v-else-if="editedItem.profilePicUrl && !imageUrl"
100 /> 100 />
101 <img 101 <img
102 v-if="imageUrl" 102 v-if="imageUrl"
103 :src="imageUrl" 103 :src="imageUrl"
104 height="150" 104 height="150"
105 style="border-radius:50%; width:200px" 105 style="border-radius:50%; width:200px"
106 /> 106 />
107 </v-avatar> 107 </v-avatar>
108 <input 108 <input
109 type="file" 109 type="file"
110 style="display: none" 110 style="display: none"
111 ref="image" 111 ref="image"
112 accept="image/*" 112 accept="image/*"
113 @change="onFilePicked" 113 @change="onFilePicked"
114 /> 114 />
115 </v-flex> 115 </v-flex>
116 </v-layout> 116 </v-layout>
117 <v-layout> 117 <v-layout>
118 <v-flex xs12 sm4> 118 <v-flex xs12 sm4>
119 <v-layout> 119 <v-layout>
120 <v-flex xs4 class="pt-4 subheading"> 120 <v-flex xs4 class="pt-4 subheading">
121 <label class="right">Select Class:</label> 121 <label class="right">Select Class:</label>
122 </v-flex> 122 </v-flex>
123 <v-flex xs8 class="ml-3"> 123 <v-flex xs8 class="ml-3">
124 <v-select 124 <v-select
125 :items="addclass" 125 :items="addclass"
126 label="Select Class" 126 label="Select Class"
127 v-model="editedItem.select" 127 v-model="editedItem.select"
128 item-text="classNum" 128 item-text="classNum"
129 item-value="_id" 129 item-value="_id"
130 name="Select Class" 130 name="Select Class"
131 @change="getSections(editedItem.select)" 131 @change="getSections(editedItem.select)"
132 required 132 required
133 ></v-select> 133 ></v-select>
134 </v-flex> 134 </v-flex>
135 </v-layout> 135 </v-layout>
136 </v-flex> 136 </v-flex>
137 <v-flex xs12 sm4> 137 <v-flex xs12 sm4>
138 <v-layout> 138 <v-layout>
139 <v-flex xs4 class="pt-4 subheading"> 139 <v-flex xs4 class="pt-4 subheading">
140 <label class="right">Select Section:</label> 140 <label class="right">Select Section:</label>
141 </v-flex> 141 </v-flex>
142 <v-flex xs8 class="ml-3"> 142 <v-flex xs8 class="ml-3">
143 <v-select 143 <v-select
144 :items="addSection" 144 :items="addSection"
145 label="Select Section" 145 label="Select Section"
146 v-model="editedItem.selectSection" 146 v-model="editedItem.selectSection"
147 item-text="name" 147 item-text="name"
148 item-value="_id" 148 item-value="_id"
149 name="Select Section" 149 name="Select Section"
150 required 150 required
151 ></v-select> 151 ></v-select>
152 </v-flex> 152 </v-flex>
153 </v-layout> 153 </v-layout>
154 </v-flex> 154 </v-flex>
155 <v-flex xs12 sm4> 155 <v-flex xs12 sm4>
156 <v-layout> 156 <v-layout>
157 <v-flex xs4 class="pt-4 subheading"> 157 <v-flex xs4 class="pt-4 subheading">
158 <label class="right">Full Name:</label> 158 <label class="right">Full Name:</label>
159 </v-flex> 159 </v-flex>
160 <v-flex xs8 class="ml-3"> 160 <v-flex xs8 class="ml-3">
161 <v-text-field 161 <v-text-field
162 v-model="editedItem.name" 162 v-model="editedItem.name"
163 placeholder="fill your full Name" 163 placeholder="fill your full Name"
164 name="name" 164 name="name"
165 type="text" 165 type="text"
166 required 166 required
167 ></v-text-field> 167 ></v-text-field>
168 </v-flex> 168 </v-flex>
169 </v-layout> 169 </v-layout>
170 </v-flex> 170 </v-flex>
171 </v-layout> 171 </v-layout>
172 <v-layout> 172 <v-layout>
173 <v-flex xs12 sm4> 173 <v-flex xs12 sm4>
174 <v-layout> 174 <v-layout>
175 <v-flex xs4 class="pt-4 subheading"> 175 <v-flex xs4 class="pt-4 subheading">
176 <label class="right">Email ID:</label> 176 <label class="right">Email ID:</label>
177 </v-flex> 177 </v-flex>
178 <v-flex xs8 class="ml-3"> 178 <v-flex xs8 class="ml-3">
179 <v-text-field 179 <v-text-field
180 placeholder="fill your email" 180 placeholder="fill your email"
181 v-model="editedItem.email" 181 v-model="editedItem.email"
182 type="text" 182 type="text"
183 name="email" 183 name="email"
184 required 184 required
185 ></v-text-field> 185 ></v-text-field>
186 </v-flex> 186 </v-flex>
187 </v-layout> 187 </v-layout>
188 </v-flex> 188 </v-flex>
189 <v-flex xs12 sm4> 189 <v-flex xs12 sm4>
190 <v-layout> 190 <v-layout>
191 <v-flex xs4 class="pt-4 subheading"> 191 <v-flex xs4 class="pt-4 subheading">
192 <label class="right">Date of Birth:</label> 192 <label class="right">Date of Birth:</label>
193 </v-flex> 193 </v-flex>
194 <v-flex xs8 class="ml-3"> 194 <v-flex xs8 class="ml-3">
195 <v-menu 195 <v-menu
196 ref="menu" 196 ref="menu"
197 :close-on-content-click="false" 197 :close-on-content-click="false"
198 v-model="menu1" 198 v-model="menu1"
199 :nudge-right="40" 199 :nudge-right="40"
200 lazy 200 lazy
201 transition="scale-transition" 201 transition="scale-transition"
202 offset-y 202 offset-y
203 full-width 203 full-width
204 min-width="290px" 204 min-width="290px"
205 > 205 >
206 <v-text-field 206 <v-text-field
207 slot="activator" 207 slot="activator"
208 v-model="editedItem.dob" 208 v-model="editedItem.dob"
209 placeholder="Select Dob" 209 placeholder="Select Dob"
210 ></v-text-field> 210 ></v-text-field>
211 <v-date-picker 211 <v-date-picker
212 ref="picker" 212 ref="picker"
213 v-model="editedItem.dob" 213 v-model="editedItem.dob"
214 :max="new Date().toISOString().substr(0, 10)" 214 :max="new Date().toISOString().substr(0, 10)"
215 min="1950-01-01" 215 min="1950-01-01"
216 @input="menu1 = false" 216 @input="menu1 = false"
217 ></v-date-picker> 217 ></v-date-picker>
218 </v-menu> 218 </v-menu>
219 </v-flex> 219 </v-flex>
220 </v-layout> 220 </v-layout>
221 </v-flex> 221 </v-flex>
222 <v-flex xs12 sm4> 222 <v-flex xs12 sm4>
223 <v-layout> 223 <v-layout>
224 <v-flex xs4 class="pt-4 subheading"> 224 <v-flex xs4 class="pt-4 subheading">
225 <label class="right">City:</label> 225 <label class="right">City:</label>
226 </v-flex> 226 </v-flex>
227 <v-flex xs8 class="ml-3"> 227 <v-flex xs8 class="ml-3">
228 <v-text-field 228 <v-text-field
229 v-model="editedItem.city" 229 v-model="editedItem.city"
230 placeholder="fill your City Name" 230 placeholder="fill your City Name"
231 name="City" 231 name="City"
232 type="text" 232 type="text"
233 required 233 required
234 ></v-text-field> 234 ></v-text-field>
235 </v-flex> 235 </v-flex>
236 </v-layout> 236 </v-layout>
237 </v-flex> 237 </v-flex>
238 </v-layout> 238 </v-layout>
239 <v-layout> 239 <v-layout>
240 <v-flex xs12 sm4> 240 <v-flex xs12 sm4>
241 <v-layout> 241 <v-layout>
242 <v-flex xs4 class="pt-4 subheading"> 242 <v-flex xs4 class="pt-4 subheading">
243 <label class="right">Blood Group:</label> 243 <label class="right">Blood Group:</label>
244 </v-flex> 244 </v-flex>
245 <v-flex xs8 class="ml-3"> 245 <v-flex xs8 class="ml-3">
246 <v-text-field 246 <v-text-field
247 v-model="editedItem.bloodGroup" 247 v-model="editedItem.bloodGroup"
248 placeholder="fill your BloodGroup" 248 placeholder="fill your BloodGroup"
249 name="state" 249 name="state"
250 type="text" 250 type="text"
251 required 251 required
252 ></v-text-field> 252 ></v-text-field>
253 </v-flex> 253 </v-flex>
254 </v-layout> 254 </v-layout>
255 </v-flex> 255 </v-flex>
256 <v-flex xs12 sm4> 256 <v-flex xs12 sm4>
257 <v-layout> 257 <v-layout>
258 <v-flex xs4 class="pt-4 subheading"> 258 <v-flex xs4 class="pt-4 subheading">
259 <label class="right">Allergies:</label> 259 <label class="right">Allergies:</label>
260 </v-flex> 260 </v-flex>
261 <v-flex xs8 class="ml-3"> 261 <v-flex xs8 class="ml-3">
262 <v-text-field 262 <v-text-field
263 v-model="editedItem.allergies" 263 v-model="editedItem.allergies"
264 placeholder="fill your Allergies" 264 placeholder="fill your Allergies"
265 name="pincode" 265 name="pincode"
266 required 266 required
267 ></v-text-field> 267 ></v-text-field>
268 </v-flex> 268 </v-flex>
269 </v-layout> 269 </v-layout>
270 </v-flex> 270 </v-flex>
271 <v-flex xs12 sm4> 271 <v-flex xs12 sm4>
272 <v-layout> 272 <v-layout>
273 <v-flex xs4 class="pt-4 subheading"> 273 <v-flex xs4 class="pt-4 subheading">
274 <label class="right">Medical Notes:</label> 274 <label class="right">Medical Notes:</label>
275 </v-flex> 275 </v-flex>
276 <v-flex xs8 class="ml-3"> 276 <v-flex xs8 class="ml-3">
277 <v-text-field 277 <v-text-field
278 v-model="editedItem.medicalNotes" 278 v-model="editedItem.medicalNotes"
279 placeholder="fill your medicalNotes" 279 placeholder="fill your medicalNotes"
280 name="mobileNo" 280 name="mobileNo"
281 required 281 required
282 ></v-text-field> 282 ></v-text-field>
283 </v-flex> 283 </v-flex>
284 </v-layout> 284 </v-layout>
285 </v-flex> 285 </v-flex>
286 </v-layout> 286 </v-layout>
287 <v-layout> 287 <v-layout>
288 <v-flex xs12 sm4> 288 <v-flex xs12 sm4>
289 <v-layout> 289 <v-layout>
290 <v-flex xs4 class="pt-4 subheading"> 290 <v-flex xs4 class="pt-4 subheading">
291 <label class="right">Height:</label> 291 <label class="right">Height:</label>
292 </v-flex> 292 </v-flex>
293 <v-flex xs8 class="ml-3"> 293 <v-flex xs8 class="ml-3">
294 <v-text-field 294 <v-text-field
295 v-model="editedItem.height" 295 v-model="editedItem.height"
296 placeholder="fill your Height" 296 placeholder="fill your Height"
297 name="state" 297 name="state"
298 type="text" 298 type="text"
299 required 299 required
300 ></v-text-field> 300 ></v-text-field>
301 </v-flex> 301 </v-flex>
302 </v-layout> 302 </v-layout>
303 </v-flex> 303 </v-flex>
304 <v-flex xs12 sm4> 304 <v-flex xs12 sm4>
305 <v-layout> 305 <v-layout>
306 <v-flex xs4 class="pt-4 subheading"> 306 <v-flex xs4 class="pt-4 subheading">
307 <label class="right">Weight:</label> 307 <label class="right">Weight:</label>
308 </v-flex> 308 </v-flex>
309 <v-flex xs8 class="ml-3"> 309 <v-flex xs8 class="ml-3">
310 <v-text-field 310 <v-text-field
311 v-model="editedItem.weight" 311 v-model="editedItem.weight"
312 placeholder="fill your Weight" 312 placeholder="fill your Weight"
313 name="pincode" 313 name="pincode"
314 required 314 required
315 ></v-text-field> 315 ></v-text-field>
316 </v-flex> 316 </v-flex>
317 </v-layout> 317 </v-layout>
318 </v-flex> 318 </v-flex>
319 <v-flex xs12 sm4> 319 <v-flex xs12 sm4>
320 <v-layout> 320 <v-layout>
321 <v-flex xs4 class="pt-4 subheading"> 321 <v-flex xs4 class="pt-4 subheading">
322 <label class="right">Uplaod Image:</label> 322 <label class="right">Uplaod Image:</label>
323 </v-flex> 323 </v-flex>
324 <v-flex xs8 class="ml-3"> 324 <v-flex xs8 class="ml-3">
325 <v-text-field 325 <v-text-field
326 label="Select Image" 326 label="Select Image"
327 @click="pickFile" 327 @click="pickFile"
328 v-model="imageName" 328 v-model="imageName"
329 append-icon="attach_file" 329 append-icon="attach_file"
330 ></v-text-field> 330 ></v-text-field>
331 </v-flex> 331 </v-flex>
332 </v-layout> 332 </v-layout>
333 </v-flex> 333 </v-flex>
334 </v-layout> 334 </v-layout>
335 <v-layout> 335 <v-layout>
336 <v-flex xs12 sm4> 336 <v-flex xs12 sm4>
337 <v-layout> 337 <v-layout>
338 <v-flex xs4 class="pt-4 subheading"> 338 <v-flex xs4 class="pt-4 subheading">
339 <label class="right">State:</label> 339 <label class="right">State:</label>
340 </v-flex> 340 </v-flex>
341 <v-flex xs8 class="ml-3"> 341 <v-flex xs8 class="ml-3">
342 <v-text-field 342 <v-text-field
343 v-model="editedItem.state" 343 v-model="editedItem.state"
344 placeholder="fill your State Name" 344 placeholder="fill your State Name"
345 name="state" 345 name="state"
346 type="text" 346 type="text"
347 required 347 required
348 ></v-text-field> 348 ></v-text-field>
349 </v-flex> 349 </v-flex>
350 </v-layout> 350 </v-layout>
351 </v-flex> 351 </v-flex>
352 <v-flex xs12 sm4> 352 <v-flex xs12 sm4>
353 <v-layout> 353 <v-layout>
354 <v-flex xs4 class="pt-4 subheading"> 354 <v-flex xs4 class="pt-4 subheading">
355 <label class="right">Pincode:</label> 355 <label class="right">Pincode:</label>
356 </v-flex> 356 </v-flex>
357 <v-flex xs8 class="ml-3"> 357 <v-flex xs8 class="ml-3">
358 <v-text-field 358 <v-text-field
359 v-model="editedItem.pincode" 359 v-model="editedItem.pincode"
360 placeholder="fill your pincode" 360 placeholder="fill your pincode"
361 name="pincode" 361 name="pincode"
362 type="number" 362 type="number"
363 required 363 required
364 ></v-text-field> 364 ></v-text-field>
365 </v-flex> 365 </v-flex>
366 </v-layout> 366 </v-layout>
367 </v-flex> 367 </v-flex>
368 <v-flex xs12 sm4> 368 <v-flex xs12 sm4>
369 <v-layout> 369 <v-layout>
370 <v-flex xs4 class="pt-4 subheading"> 370 <v-flex xs4 class="pt-4 subheading">
371 <label class="right">Mobile No:</label> 371 <label class="right">Mobile No:</label>
372 </v-flex> 372 </v-flex>
373 <v-flex xs8 class="ml-3"> 373 <v-flex xs8 class="ml-3">
374 <v-text-field 374 <v-text-field
375 v-model="editedItem.mobile" 375 v-model="editedItem.mobile"
376 placeholder="fill your MobileNo" 376 placeholder="fill your MobileNo"
377 name="mobileNo" 377 name="mobileNo"
378 type="number" 378 type="number"
379 required 379 required
380 ></v-text-field> 380 ></v-text-field>
381 </v-flex> 381 </v-flex>
382 </v-layout> 382 </v-layout>
383 </v-flex> 383 </v-flex>
384 </v-layout> 384 </v-layout>
385 <v-layout> 385 <v-layout>
386 <v-flex xs12 sm4> 386 <v-flex xs12 sm4>
387 <v-layout> 387 <v-layout>
388 <v-flex xs4 class="pt-4 subheading"> 388 <v-flex xs4 class="pt-4 subheading">
389 <label class="right">Select Country:</label> 389 <label class="right">Select Country:</label>
390 </v-flex> 390 </v-flex>
391 <v-flex xs8 class="ml-3"> 391 <v-flex xs8 class="ml-3">
392 <v-autocomplete 392 <v-autocomplete
393 v-model="editedItem.country" 393 v-model="editedItem.country"
394 :items="countries" 394 :items="countries"
395 placeholder="Select Country Name" 395 placeholder="Select Country Name"
396 required 396 required
397 ></v-autocomplete> 397 ></v-autocomplete>
398 </v-flex> 398 </v-flex>
399 </v-layout> 399 </v-layout>
400 </v-flex> 400 </v-flex>
401 <v-flex xs12 sm4> 401 <v-flex xs12 sm4>
402 <v-layout> 402 <v-layout>
403 <v-flex xs4 class="pt-4 subheading"> 403 <v-flex xs4 class="pt-4 subheading">
404 <label class="right">Gender:</label> 404 <label class="right">Gender:</label>
405 </v-flex> 405 </v-flex>
406 <v-flex xs8 class="ml-3"> 406 <v-flex xs8 class="ml-3">
407 <v-select 407 <v-select
408 :items="gender" 408 :items="gender"
409 v-model="editedItem.gender" 409 v-model="editedItem.gender"
410 placeholder="Select Gender" 410 placeholder="Select Gender"
411 required 411 required
412 ></v-select> 412 ></v-select>
413 </v-flex> 413 </v-flex>
414 </v-layout> 414 </v-layout>
415 </v-flex> 415 </v-flex>
416 <v-flex xs12 sm4> 416 <v-flex xs12 sm4>
417 <v-layout> 417 <v-layout>
418 <v-flex xs4 class="pt-4 subheading"> 418 <v-flex xs4 class="pt-4 subheading">
419 <label class="right">Father Name:</label> 419 <label class="right">Father Name:</label>
420 </v-flex> 420 </v-flex>
421 <v-flex xs8 class="ml-3"> 421 <v-flex xs8 class="ml-3">
422 <v-text-field 422 <v-text-field
423 v-model="editedItem.fatherName" 423 v-model="editedItem.fatherName"
424 :items="countries" 424 :items="countries"
425 placeholder="Fill your father Name" 425 placeholder="Fill your father Name"
426 required 426 required
427 ></v-text-field> 427 ></v-text-field>
428 </v-flex> 428 </v-flex>
429 </v-layout> 429 </v-layout>
430 </v-flex> 430 </v-flex>
431 </v-layout> 431 </v-layout>
432 <v-layout> 432 <v-layout>
433 <v-flex xs12 sm4> 433 <v-flex xs12 sm4>
434 <v-layout> 434 <v-layout>
435 <v-flex xs4 class="pt-4 subheading"> 435 <v-flex xs4 class="pt-4 subheading">
436 <label class="right">Father Cell No:</label> 436 <label class="right">Father Cell No:</label>
437 </v-flex> 437 </v-flex>
438 <v-flex xs8 class="ml-3"> 438 <v-flex xs8 class="ml-3">
439 <v-text-field 439 <v-text-field
440 v-model="editedItem.fatherCellNo" 440 v-model="editedItem.fatherCellNo"
441 placeholder="fill your father Cell Number" 441 placeholder="fill your father Cell Number"
442 name="state" 442 name="state"
443 type="number" 443 type="number"
444 required 444 required
445 ></v-text-field> 445 ></v-text-field>
446 </v-flex> 446 </v-flex>
447 </v-layout> 447 </v-layout>
448 </v-flex> 448 </v-flex>
449 <v-flex xs12 sm4> 449 <v-flex xs12 sm4>
450 <v-layout> 450 <v-layout>
451 <v-flex xs4 class="pt-4 subheading"> 451 <v-flex xs4 class="pt-4 subheading">
452 <label class="right">Mother Name:</label> 452 <label class="right">Mother Name:</label>
453 </v-flex> 453 </v-flex>
454 <v-flex xs8 class="ml-3"> 454 <v-flex xs8 class="ml-3">
455 <v-text-field 455 <v-text-field
456 v-model="editedItem.motherName" 456 v-model="editedItem.motherName"
457 placeholder="fill your Mother Name" 457 placeholder="fill your Mother Name"
458 name="state" 458 name="state"
459 type="text" 459 type="text"
460 required 460 required
461 ></v-text-field> 461 ></v-text-field>
462 </v-flex> 462 </v-flex>
463 </v-layout> 463 </v-layout>
464 </v-flex> 464 </v-flex>
465 <v-flex xs12 sm4> 465 <v-flex xs12 sm4>
466 <v-layout> 466 <v-layout>
467 <v-flex xs4 class="pt-4 subheading"> 467 <v-flex xs4 class="pt-4 subheading">
468 <label class="right">Mother Cell No:</label> 468 <label class="right">Mother Cell No:</label>
469 </v-flex> 469 </v-flex>
470 <v-flex xs8 class="ml-3"> 470 <v-flex xs8 class="ml-3">
471 <v-text-field 471 <v-text-field
472 v-model="editedItem.motherCellNo" 472 v-model="editedItem.motherCellNo"
473 placeholder="fill your Mother Cell Number" 473 placeholder="fill your Mother Cell Number"
474 name="state" 474 name="state"
475 type="number" 475 type="number"
476 required 476 required
477 ></v-text-field> 477 ></v-text-field>
478 </v-flex> 478 </v-flex>
479 </v-layout> 479 </v-layout>
480 </v-flex> 480 </v-flex>
481 </v-layout> 481 </v-layout>
482 <!-- <v-layout> 482 <!-- <v-layout>
483 <v-flex xs12 sm4> 483 <v-flex xs12 sm4>
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">Academic Year:</label> 486 <label class="right">Academic Year:</label>
487 </v-flex> 487 </v-flex>
488 <v-flex xs8 class="ml-3"> 488 <v-flex xs8 class="ml-3">
489 <v-text-field 489 <v-text-field
490 v-model="editedItem.establishmentYear" 490 v-model="editedItem.establishmentYear"
491 placeholder="fill your Mother Name" 491 placeholder="fill your Mother Name"
492 name="state" 492 name="state"
493 type="number" 493 type="number"
494 required 494 required
495 ></v-text-field> 495 ></v-text-field>
496 </v-flex> 496 </v-flex>
497 </v-layout> 497 </v-layout>
498 </v-flex> 498 </v-flex>
499 </v-layout>--> 499 </v-layout>-->
500 <v-layout> 500 <v-layout>
501 <v-flex xs12> 501 <v-flex xs12>
502 <v-layout> 502 <v-layout>
503 <v-flex 503 <v-flex
504 xs1 504 xs1
505 class="pt-4 subheading" 505 class="pt-4 subheading"
506 style="flex-basis: 13.333333% !important; max-width: 13.333333% !important;" 506 style="flex-basis: 13.333333% !important; max-width: 13.333333% !important;"
507 > 507 >
508 <label class="right">Present Address:</label> 508 <label class="right">Present Address:</label>
509 </v-flex> 509 </v-flex>
510 <v-flex xs11 class="ml-2"> 510 <v-flex xs11 class="ml-2">
511 <v-text-field 511 <v-text-field
512 v-model="editedItem.presentAddress" 512 v-model="editedItem.presentAddress"
513 placeholder="fill Your present Address" 513 placeholder="fill Your present Address"
514 required 514 required
515 ></v-text-field> 515 ></v-text-field>
516 </v-flex> 516 </v-flex>
517 </v-layout> 517 </v-layout>
518 </v-flex> 518 </v-flex>
519 </v-layout> 519 </v-layout>
520 <v-layout> 520 <v-layout>
521 <v-flex xs12> 521 <v-flex xs12>
522 <v-layout> 522 <v-layout>
523 <v-flex 523 <v-flex
524 xs1 524 xs1
525 class="pt-4 subheading" 525 class="pt-4 subheading"
526 style="flex-basis: 13.333333% !important; max-width: 13.333333% !important;" 526 style="flex-basis: 13.333333% !important; max-width: 13.333333% !important;"
527 > 527 >
528 <label class="right">Permanent Address:</label> 528 <label class="right">Permanent Address:</label>
529 </v-flex> 529 </v-flex>
530 <v-flex xs11 class="ml-2"> 530 <v-flex xs11 class="ml-2">
531 <v-textarea 531 <v-textarea
532 rows="1" 532 rows="1"
533 v-model="editedItem.permanentAddress" 533 v-model="editedItem.permanentAddress"
534 placeholder="fill Your Permanent Address" 534 placeholder="fill Your Permanent Address"
535 required 535 required
536 ></v-textarea> 536 ></v-textarea>
537 </v-flex> 537 </v-flex>
538 </v-layout> 538 </v-layout>
539 </v-flex> 539 </v-flex>
540 </v-layout> 540 </v-layout>
541 <v-layout> 541 <v-layout>
542 <v-flex xs12 sm12> 542 <v-flex xs12 sm12>
543 <v-card-actions> 543 <v-card-actions>
544 <v-btn round dark @click.native="close">Cancel</v-btn> 544 <v-btn round dark @click.native="close">Cancel</v-btn>
545 <v-spacer></v-spacer> 545 <v-spacer></v-spacer>
546 <v-btn round dark @click="save">Save</v-btn> 546 <v-btn round dark @click="save">Save</v-btn>
547 </v-card-actions> 547 </v-card-actions>
548 </v-flex> 548 </v-flex>
549 </v-layout> 549 </v-layout>
550 </v-container> 550 </v-container>
551 </v-form> 551 </v-form>
552 </v-card-text> 552 </v-card-text>
553 </v-card> 553 </v-card>
554 </v-dialog> 554 </v-dialog>
555 555
556 <!-- ****** PROFILE VIEW STUDENTS DEATILS ****** --> 556 <!-- ****** PROFILE VIEW STUDENTS DEATILS ****** -->
557 557
558 <v-dialog v-model="dialog1" max-width="800px" scrollable> 558 <v-dialog v-model="dialog1" max-width="800px" scrollable>
559 <v-card> 559 <v-card>
560 <v-toolbar color="grey lighten-2" flat> 560 <v-toolbar color="grey lighten-2" flat>
561 <v-spacer></v-spacer> 561 <v-spacer></v-spacer>
562 <v-toolbar-title>Student Profile</v-toolbar-title> 562 <v-toolbar-title>Student Profile</v-toolbar-title>
563 <v-spacer></v-spacer> 563 <v-spacer></v-spacer>
564 <v-icon @click="close1">close</v-icon> 564 <v-icon @click="close1">close</v-icon>
565 </v-toolbar> 565 </v-toolbar>
566 <v-card-text style="height: 700px;"> 566 <v-card-text style="height: 700px;">
567 <v-flex align-center justify-center layout text-xs-center class="mt-3"> 567 <v-flex align-center justify-center layout text-xs-center class="mt-3">
568 <v-avatar size="160px"> 568 <v-avatar size="160px">
569 <img src="/static/icon/user.png" v-if="!editedItem.profilePicUrl" /> 569 <img src="/static/icon/user.png" v-if="!editedItem.profilePicUrl" />
570 <img :src="editedItem.profilePicUrl" v-else-if="editedItem.profilePicUrl" /> 570 <img :src="editedItem.profilePicUrl" v-else-if="editedItem.profilePicUrl" />
571 </v-avatar> 571 </v-avatar>
572 </v-flex> 572 </v-flex>
573 <v-container grid-list-md> 573 <v-container grid-list-md>
574 <v-layout wrap> 574 <v-layout wrap>
575 <v-flex> 575 <v-flex>
576 <v-layout> 576 <v-layout>
577 <v-flex xs12 sm6> 577 <v-flex xs12 sm6>
578 <v-layout> 578 <v-layout>
579 <v-flex xs6 sm5> 579 <v-flex xs6 sm5>
580 <h5 class="right my-1"> 580 <h5 class="right my-1">
581 <b>Full Name:</b> 581 <b>Full Name:</b>
582 </h5> 582 </h5>
583 </v-flex> 583 </v-flex>
584 <v-flex sm7 xs6> 584 <v-flex sm7 xs6>
585 <h5 class="my-1 left">{{ editedItem.name }}</h5> 585 <h5 class="my-1 left">{{ editedItem.name }}</h5>
586 </v-flex> 586 </v-flex>
587 </v-layout> 587 </v-layout>
588 </v-flex> 588 </v-flex>
589 <v-flex xs12 sm6> 589 <v-flex xs12 sm6>
590 <v-layout> 590 <v-layout>
591 <v-flex xs4 sm4> 591 <v-flex xs4 sm4>
592 <h5 class="right my-1"> 592 <h5 class="right my-1">
593 <b>Email:</b> 593 <b>Email:</b>
594 </h5> 594 </h5>
595 </v-flex> 595 </v-flex>
596 <v-flex sm8 xs8> 596 <v-flex sm8 xs8>
597 <h5 class="my-1 left">{{ editedItem.email }}</h5> 597 <h5 class="my-1 left">{{ editedItem.email }}</h5>
598 </v-flex> 598 </v-flex>
599 </v-layout> 599 </v-layout>
600 </v-flex> 600 </v-flex>
601 </v-layout> 601 </v-layout>
602 <v-layout> 602 <v-layout>
603 <v-flex xs6 sm6> 603 <v-flex xs6 sm6>
604 <v-layout> 604 <v-layout>
605 <v-flex xs4 sm5> 605 <v-flex xs4 sm5>
606 <b> 606 <b>
607 <h5 class="right my-1"> 607 <h5 class="right my-1">
608 <b>Gender:</b> 608 <b>Gender:</b>
609 </h5> 609 </h5>
610 </b> 610 </b>
611 </v-flex> 611 </v-flex>
612 <v-flex sm7 xs8> 612 <v-flex sm7 xs8>
613 <h5 class="my-1 left">{{ editedItem.gender }}</h5> 613 <h5 class="my-1 left">{{ editedItem.gender }}</h5>
614 </v-flex> 614 </v-flex>
615 </v-layout> 615 </v-layout>
616 </v-flex> 616 </v-flex>
617 <v-flex xs6 sm6> 617 <v-flex xs6 sm6>
618 <v-layout> 618 <v-layout>
619 <v-flex xs4 sm4> 619 <v-flex xs4 sm4>
620 <b> 620 <b>
621 <h5 class="right my-1"> 621 <h5 class="right my-1">
622 <b>D.O.B:</b> 622 <b>D.O.B:</b>
623 </h5> 623 </h5>
624 </b> 624 </b>
625 </v-flex> 625 </v-flex>
626 <v-flex sm7 xs8> 626 <v-flex sm7 xs8>
627 <h5 class="my-1">{{ dates(editedItem.dob) }}</h5> 627 <h5 class="my-1">{{ dates(editedItem.dob) }}</h5>
628 </v-flex> 628 </v-flex>
629 </v-layout> 629 </v-layout>
630 </v-flex> 630 </v-flex>
631 </v-layout> 631 </v-layout>
632 <v-layout> 632 <v-layout>
633 <v-flex xs6 sm6> 633 <v-flex xs6 sm6>
634 <v-layout> 634 <v-layout>
635 <v-flex xs4 sm5> 635 <v-flex xs4 sm5>
636 <b> 636 <b>
637 <h5 class="right my-1"> 637 <h5 class="right my-1">
638 <b>Blood Group:</b> 638 <b>Blood Group:</b>
639 </h5> 639 </h5>
640 </b> 640 </b>
641 </v-flex> 641 </v-flex>
642 <v-flex sm7 xs8> 642 <v-flex sm7 xs8>
643 <h5 class="my-1 left">{{ editedItem.bloodGroup }}</h5> 643 <h5 class="my-1 left">{{ editedItem.bloodGroup }}</h5>
644 </v-flex> 644 </v-flex>
645 </v-layout> 645 </v-layout>
646 </v-flex> 646 </v-flex>
647 <v-flex xs6 sm6> 647 <v-flex xs6 sm6>
648 <v-layout> 648 <v-layout>
649 <v-flex xs4 sm4> 649 <v-flex xs4 sm4>
650 <b> 650 <b>
651 <h5 class="right my-1"> 651 <h5 class="right my-1">
652 <b>Allergies:</b> 652 <b>Allergies:</b>
653 </h5> 653 </h5>
654 </b> 654 </b>
655 </v-flex> 655 </v-flex>
656 <v-flex sm8 xs8> 656 <v-flex sm8 xs8>
657 <h5 class="my-1">{{ editedItem.allergies }}</h5> 657 <h5 class="my-1">{{ editedItem.allergies }}</h5>
658 </v-flex> 658 </v-flex>
659 </v-layout> 659 </v-layout>
660 </v-flex> 660 </v-flex>
661 </v-layout> 661 </v-layout>
662 <v-layout> 662 <v-layout>
663 <v-flex xs6 sm6> 663 <v-flex xs6 sm6>
664 <v-layout> 664 <v-layout>
665 <v-flex xs4 sm5> 665 <v-flex xs4 sm5>
666 <b> 666 <b>
667 <h5 class="right my-1"> 667 <h5 class="right my-1">
668 <b>Height:</b> 668 <b>Height:</b>
669 </h5> 669 </h5>
670 </b> 670 </b>
671 </v-flex> 671 </v-flex>
672 <v-flex sm7 xs8> 672 <v-flex sm7 xs8>
673 <h5 class="my-1 left">{{ editedItem.height }}</h5> 673 <h5 class="my-1 left">{{ editedItem.height }}</h5>
674 </v-flex> 674 </v-flex>
675 </v-layout> 675 </v-layout>
676 </v-flex> 676 </v-flex>
677 <v-flex xs6 sm6> 677 <v-flex xs6 sm6>
678 <v-layout> 678 <v-layout>
679 <v-flex xs4 sm4> 679 <v-flex xs4 sm4>
680 <b> 680 <b>
681 <h5 class="right my-1"> 681 <h5 class="right my-1">
682 <b>Weight:</b> 682 <b>Weight:</b>
683 </h5> 683 </h5>
684 </b> 684 </b>
685 </v-flex> 685 </v-flex>
686 <v-flex sm8 xs8> 686 <v-flex sm8 xs8>
687 <h5 class="my-1">{{ editedItem.weight }}</h5> 687 <h5 class="my-1">{{ editedItem.weight }}</h5>
688 </v-flex> 688 </v-flex>
689 </v-layout> 689 </v-layout>
690 </v-flex> 690 </v-flex>
691 </v-layout> 691 </v-layout>
692 <v-layout> 692 <v-layout>
693 <v-flex xs6 sm6> 693 <v-flex xs6 sm6>
694 <v-layout> 694 <v-layout>
695 <v-flex xs4 sm5> 695 <v-flex xs4 sm5>
696 <b> 696 <b>
697 <h5 class="right my-1"> 697 <h5 class="right my-1">
698 <b>City:</b> 698 <b>City:</b>
699 </h5> 699 </h5>
700 </b> 700 </b>
701 </v-flex> 701 </v-flex>
702 <v-flex sm7 xs8> 702 <v-flex sm7 xs8>
703 <h5 class="my-1 left">{{ editedItem.city }}</h5> 703 <h5 class="my-1 left">{{ editedItem.city }}</h5>
704 </v-flex> 704 </v-flex>
705 </v-layout> 705 </v-layout>
706 </v-flex> 706 </v-flex>
707 <v-flex xs6 sm6> 707 <v-flex xs6 sm6>
708 <v-layout> 708 <v-layout>
709 <v-flex xs4 sm4> 709 <v-flex xs4 sm4>
710 <b> 710 <b>
711 <h5 class="right my-1"> 711 <h5 class="right my-1">
712 <b>State:</b> 712 <b>State:</b>
713 </h5> 713 </h5>
714 </b> 714 </b>
715 </v-flex> 715 </v-flex>
716 <v-flex sm8 xs8> 716 <v-flex sm8 xs8>
717 <h5 class="my-1">{{ editedItem.state }}</h5> 717 <h5 class="my-1">{{ editedItem.state }}</h5>
718 </v-flex> 718 </v-flex>
719 </v-layout> 719 </v-layout>
720 </v-flex> 720 </v-flex>
721 </v-layout> 721 </v-layout>
722 <v-layout> 722 <v-layout>
723 <v-flex xs6 sm6> 723 <v-flex xs6 sm6>
724 <v-layout> 724 <v-layout>
725 <v-flex xs4 sm5> 725 <v-flex xs4 sm5>
726 <b> 726 <b>
727 <h5 class="right my-1"> 727 <h5 class="right my-1">
728 <b>Pincode:</b> 728 <b>Pincode:</b>
729 </h5> 729 </h5>
730 </b> 730 </b>
731 </v-flex> 731 </v-flex>
732 <v-flex sm7 xs8> 732 <v-flex sm7 xs8>
733 <h5 class="my-1">{{ editedItem.pincode }}</h5> 733 <h5 class="my-1">{{ editedItem.pincode }}</h5>
734 </v-flex> 734 </v-flex>
735 </v-layout> 735 </v-layout>
736 </v-flex> 736 </v-flex>
737 <v-flex xs5 sm5> 737 <v-flex xs5 sm5>
738 <v-layout> 738 <v-layout>
739 <v-flex xs4 sm5> 739 <v-flex xs4 sm5>
740 <b> 740 <b>
741 <h5 class="right my-1"> 741 <h5 class="right my-1">
742 <b>Country:</b> 742 <b>Country:</b>
743 </h5> 743 </h5>
744 </b> 744 </b>
745 </v-flex> 745 </v-flex>
746 <v-flex sm7 xs8> 746 <v-flex sm7 xs8>
747 <h5 class="my-1">{{ editedItem.country }}</h5> 747 <h5 class="my-1">{{ editedItem.country }}</h5>
748 </v-flex> 748 </v-flex>
749 </v-layout> 749 </v-layout>
750 </v-flex> 750 </v-flex>
751 </v-layout> 751 </v-layout>
752 <v-layout> 752 <v-layout>
753 <v-flex xs5 sm6> 753 <v-flex xs5 sm6>
754 <v-layout> 754 <v-layout>
755 <v-flex sm5 xs8> 755 <v-flex sm5 xs8>
756 <b> 756 <b>
757 <h5 class="right my-1"> 757 <h5 class="right my-1">
758 <b>Mobile No:</b> 758 <b>Mobile No:</b>
759 </h5> 759 </h5>
760 </b> 760 </b>
761 </v-flex> 761 </v-flex>
762 <v-flex sm6 xs8> 762 <v-flex sm6 xs8>
763 <h5 class="my-1">{{ editedItem.mobile }}</h5> 763 <h5 class="my-1">{{ editedItem.mobile }}</h5>
764 </v-flex> 764 </v-flex>
765 </v-layout> 765 </v-layout>
766 </v-flex> 766 </v-flex>
767 <v-flex xs5 sm6> 767 <v-flex xs5 sm6>
768 <v-layout> 768 <v-layout>
769 <v-flex xs5 sm4> 769 <v-flex xs5 sm4>
770 <b> 770 <b>
771 <h5 class="right my-1"> 771 <h5 class="right my-1">
772 <b>Fahter Name:</b> 772 <b>Fahter Name:</b>
773 </h5> 773 </h5>
774 </b> 774 </b>
775 </v-flex> 775 </v-flex>
776 <v-flex sm8 xs8> 776 <v-flex sm8 xs8>
777 <h5 class="my-1">{{ editedItem.fatherName }}</h5> 777 <h5 class="my-1">{{ editedItem.fatherName }}</h5>
778 </v-flex> 778 </v-flex>
779 </v-layout> 779 </v-layout>
780 </v-flex> 780 </v-flex>
781 </v-layout> 781 </v-layout>
782 <v-layout> 782 <v-layout>
783 <v-flex xs6 sm5> 783 <v-flex xs6 sm5>
784 <v-layout> 784 <v-layout>
785 <v-flex xs4 sm6> 785 <v-flex xs4 sm6>
786 <b> 786 <b>
787 <h5 class="right my-1"> 787 <h5 class="right my-1">
788 <b>Mother Name:</b> 788 <b>Mother Name:</b>
789 </h5> 789 </h5>
790 </b> 790 </b>
791 </v-flex> 791 </v-flex>
792 <v-flex sm6 xs8> 792 <v-flex sm6 xs8>
793 <h5 class="my-1">{{ editedItem.motherName }}</h5> 793 <h5 class="my-1">{{ editedItem.motherName }}</h5>
794 </v-flex> 794 </v-flex>
795 </v-layout> 795 </v-layout>
796 </v-flex> 796 </v-flex>
797 <v-flex xs6 sm6> 797 <v-flex xs6 sm6>
798 <v-layout> 798 <v-layout>
799 <v-flex xs4 sm6> 799 <v-flex xs4 sm6>
800 <b> 800 <b>
801 <h5 class="right my-1"> 801 <h5 class="right my-1">
802 <b>Father Cell No:</b> 802 <b>Father Cell No:</b>
803 </h5> 803 </h5>
804 </b> 804 </b>
805 </v-flex> 805 </v-flex>
806 <v-flex sm6 xs8> 806 <v-flex sm6 xs8>
807 <h5 class="my-1">{{ editedItem.fatherCellNo }}</h5> 807 <h5 class="my-1">{{ editedItem.fatherCellNo }}</h5>
808 </v-flex> 808 </v-flex>
809 </v-layout> 809 </v-layout>
810 </v-flex> 810 </v-flex>
811 </v-layout> 811 </v-layout>
812 <v-layout> 812 <v-layout>
813 <v-flex xs6 sm5> 813 <v-flex xs6 sm5>
814 <v-layout> 814 <v-layout>
815 <v-flex xs4 sm6> 815 <v-flex xs4 sm6>
816 <b> 816 <b>
817 <h5 class="right my-1"> 817 <h5 class="right my-1">
818 <b>Mother Cell No:</b> 818 <b>Mother Cell No:</b>
819 </h5> 819 </h5>
820 </b> 820 </b>
821 </v-flex> 821 </v-flex>
822 <v-flex sm6 xs8> 822 <v-flex sm6 xs8>
823 <h5 class="my-1">{{ editedItem.motherCellNo }}</h5> 823 <h5 class="my-1">{{ editedItem.motherCellNo }}</h5>
824 </v-flex> 824 </v-flex>
825 </v-layout> 825 </v-layout>
826 </v-flex> 826 </v-flex>
827 <v-flex xs6 sm6> 827 <v-flex xs6 sm6>
828 <v-layout> 828 <v-layout>
829 <v-flex xs5 sm6> 829 <v-flex xs5 sm6>
830 <b> 830 <b>
831 <h5 class="my-1 right"> 831 <h5 class="my-1 right">
832 <b>Academic Year:</b> 832 <b>Academic Year:</b>
833 </h5> 833 </h5>
834 </b> 834 </b>
835 </v-flex> 835 </v-flex>
836 <v-flex sm5 xs8> 836 <v-flex sm5 xs8>
837 <h5 class="my-1">{{ editedItem.establishmentYear }}</h5> 837 <h5 class="my-1">{{ editedItem.establishmentYear }}</h5>
838 </v-flex> 838 </v-flex>
839 </v-layout> 839 </v-layout>
840 </v-flex> 840 </v-flex>
841 </v-layout> 841 </v-layout>
842 <v-layout> 842 <v-layout>
843 <v-flex xs6 sm5> 843 <v-flex xs6 sm5>
844 <v-layout> 844 <v-layout>
845 <v-flex xs5 sm6> 845 <v-flex xs5 sm6>
846 <b> 846 <b>
847 <h5 class="my-1 right"> 847 <h5 class="my-1 right">
848 <b>Medical Notes:</b> 848 <b>Medical Notes:</b>
849 </h5> 849 </h5>
850 </b> 850 </b>
851 </v-flex> 851 </v-flex>
852 <v-flex sm5 xs8> 852 <v-flex sm5 xs8>
853 <h5 class="my-1">{{ editedItem.medicalNotes }}</h5> 853 <h5 class="my-1">{{ editedItem.medicalNotes }}</h5>
854 </v-flex> 854 </v-flex>
855 </v-layout> 855 </v-layout>
856 </v-flex> 856 </v-flex>
857 <v-flex xs12 sm6> 857 <v-flex xs12 sm6>
858 <v-layout> 858 <v-layout>
859 <v-flex xs6 sm6> 859 <v-flex xs6 sm6>
860 <b> 860 <b>
861 <h5 class="right my-1"> 861 <h5 class="right my-1">
862 <b>present Address:</b> 862 <b>present Address:</b>
863 </h5> 863 </h5>
864 </b> 864 </b>
865 </v-flex> 865 </v-flex>
866 <v-flex sm6 xs8> 866 <v-flex sm6 xs8>
867 <h5 class="my-1">{{ editedItem.presentAddress }}</h5> 867 <h5 class="my-1">{{ editedItem.presentAddress }}</h5>
868 </v-flex> 868 </v-flex>
869 </v-layout> 869 </v-layout>
870 </v-flex> 870 </v-flex>
871 </v-layout> 871 </v-layout>
872 <v-layout> 872 <v-layout>
873 <v-flex xs12 sm12> 873 <v-flex xs12 sm12>
874 <v-layout> 874 <v-layout>
875 <v-flex xs4 sm3> 875 <v-flex xs4 sm3>
876 <b> 876 <b>
877 <h5 class="right my-1"> 877 <h5 class="right my-1">
878 <b>Permanent Address:</b> 878 <b>Permanent Address:</b>
879 </h5> 879 </h5>
880 </b> 880 </b>
881 </v-flex> 881 </v-flex>
882 <v-flex sm9 xs8> 882 <v-flex sm9 xs8>
883 <h5 class="my-1">{{ editedItem.permanentAddress }}</h5> 883 <h5 class="my-1">{{ editedItem.permanentAddress }}</h5>
884 </v-flex> 884 </v-flex>
885 </v-layout> 885 </v-layout>
886 </v-flex> 886 </v-flex>
887 </v-layout> 887 </v-layout>
888 </v-flex> 888 </v-flex>
889 </v-layout> 889 </v-layout>
890 </v-container> 890 </v-container>
891 </v-card-text> 891 </v-card-text>
892 </v-card> 892 </v-card>
893 </v-dialog> 893 </v-dialog>
894 894
895 <v-snackbar 895 <v-snackbar
896 :timeout="timeout" 896 :timeout="timeout"
897 :top="y === 'top'" 897 :top="y === 'top'"
898 :right="x === 'right'" 898 :right="x === 'right'"
899 :vertical="mode === 'vertical'" 899 :vertical="mode === 'vertical'"
900 v-model="snackbar" 900 v-model="snackbar"
901 color="success" 901 color="success"
902 >{{ text }}</v-snackbar> 902 >{{ text }}</v-snackbar>
903 903
904 <!-- ****** EXISTING-USERS STUDENTS TABLE ****** --> 904 <!-- ****** EXISTING-USERS STUDENTS TABLE ****** -->
905 <v-card flat> 905 <v-card flat>
906 <v-card-actions> 906 <v-card-actions>
907 <v-layout> 907 <v-layout>
908 <label class="right mt-4 ml-5">Select Class:</label> 908 <label class="right mt-4 ml-5">Select Class:</label>
909 <v-select 909 <v-select
910 :items="addclass" 910 :items="addclass"
911 label="Select Class" 911 label="Select Class"
912 v-model="selectStudents.select" 912 v-model="selectStudents.select"
913 item-text="classNum" 913 item-text="classNum"
914 item-value="_id" 914 item-value="_id"
915 name="Select Class" 915 name="Select Class"
916 :rules="classRules" 916 :rules="classRules"
917 @change="getSections(selectStudents.select)" 917 @change="getSections(selectStudents.select)"
918 class="px-4" 918 class="px-4"
919 required 919 required
920 ></v-select> 920 ></v-select>
921 <label class="right mt-4">Select Section:</label> 921 <label class="right mt-4">Select Section:</label>
922 <v-select 922 <v-select
923 :items="addSection" 923 :items="addSection"
924 label="Select Section" 924 label="Select Section"
925 v-model="selectStudents.selectSection" 925 v-model="selectStudents.selectSection"
926 item-text="name" 926 item-text="name"
927 item-value="_id" 927 item-value="_id"
928 name="Select Section" 928 name="Select Section"
929 :rules="sectionRules" 929 :rules="sectionRules"
930 class="pl-3" 930 class="pl-3"
931 required 931 required
932 ></v-select> 932 ></v-select>
933 </v-layout> 933 </v-layout>
934 <v-spacer></v-spacer> 934 <v-spacer></v-spacer>
935 <v-btn @click="findStudents()" round dark :loading="loading" class="left">Find</v-btn> 935 <v-btn @click="findStudents()" round dark :loading="loading" class="left">Find</v-btn>
936 </v-card-actions> 936 </v-card-actions>
937 </v-card> 937 </v-card>
938 <v-data-table 938 <v-data-table
939 :headers="headers" 939 :headers="headers"
940 :items="desserts" 940 :items="desserts"
941 :pagination.sync="pagination" 941 :pagination.sync="pagination"
942 :search="search" 942 :search="search"
943 > 943 >
944 <template slot="items" slot-scope="props"> 944 <template slot="items" slot-scope="props">
945 <td id="td" class="text-xs-center">{{ props.index}}</td> 945 <td id="td" class="text-xs-center">{{ props.index}}</td>
946 <td id="td" class="text-xs-center"> 946 <td id="td" class="text-xs-center">
947 <v-avatar> 947 <v-avatar>
948 <img :src="props.item.profilePicUrl" v-if="props.item.profilePicUrl" /> 948 <img :src="props.item.profilePicUrl" v-if="props.item.profilePicUrl" />
949 <img src="/static/icon/user.png" v-else-if="!props.item.profilePicUrl" /> 949 <img src="/static/icon/user.png" v-else-if="!props.item.profilePicUrl" />
950 </v-avatar> 950 </v-avatar>
951 </td> 951 </td>
952 <td id="td" class="text-xs-center">{{ props.item.name}}</td> 952 <td id="td" class="text-xs-center">{{ props.item.name}}</td>
953 <td id="td" class="text-xs-center">{{ props.item.email }}</td> 953 <td id="td" class="text-xs-center">{{ props.item.email }}</td>
954 <td id="td" class="text-xs-center">{{ dates(props.item.dob) }}</td> 954 <td id="td" class="text-xs-center">{{ dates(props.item.dob) }}</td>
955 <td id="td" class="text-xs-center">{{ props.item.gender }}</td> 955 <td id="td" class="text-xs-center">{{ props.item.gender }}</td>
956 <td id="td" class="text-xs-center">{{ props.item.parentId.fatherName }}</td> 956 <td id="td" class="text-xs-center">{{ props.item.parentId.fatherName }}</td>
957 <td id="td" class="text-xs-center">{{ props.item.parentId.motherName }}</td> 957 <td id="td" class="text-xs-center">{{ props.item.parentId.motherName }}</td>
958 <td id="td" class="text-xs-center">{{ props.item.establishmentYear }}</td> 958 <td id="td" class="text-xs-center">{{ props.item.establishmentYear }}</td>
959 <td id="td" class="text-xs-center">{{ props.item.mobile}}</td> 959 <td id="td" class="text-xs-center">{{ props.item.mobile}}</td>
960 960
961 <td class="text-xs-center"> 961 <td class="text-xs-center">
962 <span> 962 <span>
963 <img 963 <img
964 style="cursor:pointer; width:25px; height:18px; " 964 style="cursor:pointer; width:25px; height:18px; "
965 class="mr-5" 965 class="mr-5"
966 @click="profile(props.item)" 966 @click="profile(props.item)"
967 src="/static/icon/eye1.png" 967 src="/static/icon/eye1.png"
968 /> 968 />
969 <img 969 <img
970 style="cursor:pointer; width:20px; height:18px; " 970 style="cursor:pointer; width:20px; height:18px; "
971 class="mr-5" 971 class="mr-5"
972 @click="editItem(props.item)" 972 @click="editItem(props.item)"
973 src="/static/icon/edit1.png" 973 src="/static/icon/edit1.png"
974 /> 974 />
975 <img 975 <img
976 style="cursor:pointer; height:20px; " 976 style="cursor:pointer; height:20px; "
977 class="mr-5" 977 class="mr-5"
978 @click="deleteItem(props.item)" 978 @click="deleteItem(props.item)"
979 src="/static/icon/delete1.png" 979 src="/static/icon/delete1.png"
980 /> 980 />
981 </span> 981 </span>
982 </td> 982 </td>
983 </template> 983 </template>
984 <v-alert 984 <v-alert
985 slot="no-results" 985 slot="no-results"
986 :value="true" 986 :value="true"
987 color="error" 987 color="error"
988 icon="warning" 988 icon="warning"
989 >Your search for "{{ search }}" found no results.</v-alert> 989 >Your search for "{{ search }}" found no results.</v-alert>
990 </v-data-table> 990 </v-data-table>
991 </v-tab-item> 991 </v-tab-item>
992 992
993 <!-- ****** ADD STUDENTS DETAILS****** --> 993 <!-- ****** ADD STUDENTS DETAILS****** -->
994 <v-tab-item> 994 <v-tab-item>
995 <v-container fluid> 995 <v-container fluid>
996 <v-layout align-center justify-center fill-height> 996 <v-layout align-center justify-center fill-height>
997 <v-flex xs12 sm8 md7 lg8> 997 <v-flex xs12 sm8 md7 lg8>
998 <div> 998 <div>
999 <v-app> 999 <v-app>
1000 <v-stepper v-model="e2"> 1000 <v-stepper v-model="e2">
1001 <v-stepper-header> 1001 <v-stepper-header>
1002 <v-stepper-step :complete="e2 > 1" step="1">Fill parent Details</v-stepper-step> 1002 <v-stepper-step :complete="e2 > 1" step="1">Fill parent Details</v-stepper-step>
1003 <v-divider></v-divider> 1003 <v-divider></v-divider>
1004 <v-stepper-step step="2">Fill Student Details</v-stepper-step> 1004 <v-stepper-step step="2">Fill Student Details</v-stepper-step>
1005 </v-stepper-header> 1005 </v-stepper-header>
1006 <v-stepper-items> 1006 <v-stepper-items>
1007 <v-stepper-content step="1"> 1007 <v-stepper-content step="1">
1008 <v-container fluid class> 1008 <v-container fluid class>
1009 <v-layout> 1009 <v-layout>
1010 <v-flex xs12> 1010 <v-flex xs12>
1011 <v-snackbar 1011 <v-snackbar
1012 :timeout="timeout" 1012 :timeout="timeout"
1013 :top="y === 'top'" 1013 :top="y === 'top'"
1014 :right="x === 'right'" 1014 :right="x === 'right'"
1015 :vertical="mode === 'vertical'" 1015 :vertical="mode === 'vertical'"
1016 v-model="snackbar" 1016 v-model="snackbar"
1017 color="success" 1017 color="success"
1018 >{{ text }}</v-snackbar> 1018 >{{ text }}</v-snackbar>
1019 <v-flex xs12 sm12> 1019 <v-flex xs12 sm12>
1020 <v-form ref="parentForm" v-model="valid" lazy-validation> 1020 <v-form ref="parentForm" v-model="valid" lazy-validation>
1021 <v-container fluid> 1021 <v-container fluid>
1022 <v-layout> 1022 <v-layout>
1023 <v-flex xs12 sm6> 1023 <v-flex xs12 sm6>
1024 <v-layout> 1024 <v-layout>
1025 <v-flex xs4 class="pt-4 subheading"> 1025 <v-flex xs4 class="pt-4 subheading">
1026 <label class="right">Parent Email Id:</label> 1026 <label class="right">Parent Email Id:</label>
1027 </v-flex> 1027 </v-flex>
1028 <v-flex xs8 class="ml-3"> 1028 <v-flex xs8 class="ml-3">
1029 <v-text-field 1029 <v-text-field
1030 placeholder="fill Parent email" 1030 placeholder="fill Parent email"
1031 :rules="emailRules" 1031 :rules="emailRules"
1032 v-model="parentData.email" 1032 v-model="parentData.email"
1033 type="text" 1033 type="text"
1034 v-on:keyup="getParentDetails" 1034 v-on:keyup="getParentDetails"
1035 name="email" 1035 name="email"
1036 required 1036 required
1037 ></v-text-field> 1037 ></v-text-field>
1038 </v-flex> 1038 </v-flex>
1039 </v-layout> 1039 </v-layout>
1040 </v-flex> 1040 </v-flex>
1041 <v-flex xs12 sm6> 1041 <v-flex xs12 sm6>
1042 <v-layout> 1042 <v-layout>
1043 <v-flex xs4 class="pt-4 subheading"> 1043 <v-flex xs4 class="pt-4 subheading">
1044 <label class="right">Father Name:</label> 1044 <label class="right">Father Name:</label>
1045 </v-flex> 1045 </v-flex>
1046 <v-flex xs8 class="ml-3"> 1046 <v-flex xs8 class="ml-3">
1047 <v-text-field 1047 <v-text-field
1048 v-model="parentData.fatherName" 1048 v-model="parentData.fatherName"
1049 :rules="fatherNameRules" 1049 :rules="fatherNameRules"
1050 placeholder="Fill your father Name" 1050 placeholder="Fill your father Name"
1051 required 1051 required
1052 ></v-text-field> 1052 ></v-text-field>
1053 </v-flex> 1053 </v-flex>
1054 </v-layout> 1054 </v-layout>
1055 </v-flex> 1055 </v-flex>
1056 </v-layout> 1056 </v-layout>
1057 <v-layout> 1057 <v-layout>
1058 <v-flex xs12 sm6> 1058 <v-flex xs12 sm6>
1059 <v-layout> 1059 <v-layout>
1060 <v-flex xs4 class="pt-4 subheading"> 1060 <v-flex xs4 class="pt-4 subheading">
1061 <label class="right">Father Cell No:</label> 1061 <label class="right">Father Cell No:</label>
1062 </v-flex> 1062 </v-flex>
1063 <v-flex xs8 class="ml-3"> 1063 <v-flex xs8 class="ml-3">
1064 <v-text-field 1064 <v-text-field
1065 v-model="parentData.fatherCellNo" 1065 v-model="parentData.fatherCellNo"
1066 placeholder="fill your father Cell Number" 1066 placeholder="fill your father Cell Number"
1067 name="state" 1067 name="state"
1068 type="number" 1068 type="number"
1069 :rules="fatheCellNoRules" 1069 :rules="fatheCellNoRules"
1070 required 1070 required
1071 ></v-text-field> 1071 ></v-text-field>
1072 </v-flex> 1072 </v-flex>
1073 </v-layout> 1073 </v-layout>
1074 </v-flex> 1074 </v-flex>
1075 <v-flex xs12 sm6> 1075 <v-flex xs12 sm6>
1076 <v-layout> 1076 <v-layout>
1077 <v-flex xs4 class="pt-4 subheading"> 1077 <v-flex xs4 class="pt-4 subheading">
1078 <label class="right">Mother Name:</label> 1078 <label class="right">Mother Name:</label>
1079 </v-flex> 1079 </v-flex>
1080 <v-flex xs8 class="ml-3"> 1080 <v-flex xs8 class="ml-3">
1081 <v-text-field 1081 <v-text-field
1082 v-model="parentData.motherName" 1082 v-model="parentData.motherName"
1083 placeholder="fill your Mother Name" 1083 placeholder="fill your Mother Name"
1084 name="state" 1084 name="state"
1085 type="text" 1085 type="text"
1086 :rules="motherNameRules" 1086 :rules="motherNameRules"
1087 required 1087 required
1088 ></v-text-field> 1088 ></v-text-field>
1089 </v-flex> 1089 </v-flex>
1090 </v-layout> 1090 </v-layout>
1091 </v-flex> 1091 </v-flex>
1092 </v-layout> 1092 </v-layout>
1093 <v-layout> 1093 <v-layout>
1094 <v-flex xs12 sm6> 1094 <v-flex xs12 sm6>
1095 <v-layout> 1095 <v-layout>
1096 <v-flex xs4 class="pt-4 subheading"> 1096 <v-flex xs4 class="pt-4 subheading">
1097 <label class="right">Mother Cell No:</label> 1097 <label class="right">Mother Cell No:</label>
1098 </v-flex> 1098 </v-flex>
1099 <v-flex xs8 class="ml-3"> 1099 <v-flex xs8 class="ml-3">
1100 <v-text-field 1100 <v-text-field
1101 v-model="parentData.motherCellNo" 1101 v-model="parentData.motherCellNo"
1102 placeholder="fill your Mother Cell Number" 1102 placeholder="fill your Mother Cell Number"
1103 name="state" 1103 name="state"
1104 type="number" 1104 type="number"
1105 :rules="motherCellNoRules" 1105 :rules="motherCellNoRules"
1106 required 1106 required
1107 ></v-text-field> 1107 ></v-text-field>
1108 </v-flex> 1108 </v-flex>
1109 </v-layout> 1109 </v-layout>
1110 </v-flex> 1110 </v-flex>
1111 </v-layout> 1111 </v-layout>
1112 <v-flex xs12 sm12> 1112 <v-flex xs12 sm12>
1113 <v-card-actions> 1113 <v-card-actions>
1114 <v-spacer></v-spacer> 1114 <v-spacer></v-spacer>
1115 <v-btn 1115 <v-btn
1116 @click="submitParentDetails" 1116 @click="submitParentDetails"
1117 round 1117 round
1118 dark 1118 dark
1119 :loading="loading" 1119 :loading="loading"
1120 v-show="showParent" 1120 v-show="showParent"
1121 >Add</v-btn> 1121 >Add</v-btn>
1122 <v-btn v-show="showNext" @click="e2 = 2" round dark>Next</v-btn> 1122 <v-btn v-show="showNext" @click="e2 = 2" round dark>Next</v-btn>
1123 </v-card-actions> 1123 </v-card-actions>
1124 </v-flex> 1124 </v-flex>
1125 </v-container> 1125 </v-container>
1126 </v-form> 1126 </v-form>
1127 </v-flex> 1127 </v-flex>
1128 </v-flex> 1128 </v-flex>
1129 </v-layout> 1129 </v-layout>
1130 </v-container> 1130 </v-container>
1131 </v-stepper-content> 1131 </v-stepper-content>
1132 <v-stepper-content step="2"> 1132 <v-stepper-content step="2">
1133 <v-container fluid> 1133 <v-container fluid>
1134 <v-snackbar 1134 <v-snackbar
1135 :timeout="timeout" 1135 :timeout="timeout"
1136 :top="y === 'top'" 1136 :top="y === 'top'"
1137 :right="x === 'right'" 1137 :right="x === 'right'"
1138 :vertical="mode === 'vertical'" 1138 :vertical="mode === 'vertical'"
1139 v-model="snackbar" 1139 v-model="snackbar"
1140 color="success" 1140 color="success"
1141 >{{ text }}</v-snackbar> 1141 >{{ text }}</v-snackbar>
1142 <v-flex xs12 sm12> 1142 <v-flex xs12 sm12>
1143 <v-form ref="form" v-model="valid" lazy-validation> 1143 <v-form ref="form" v-model="valid" lazy-validation>
1144 <v-container fluid> 1144 <v-container fluid>
1145 <v-layout> 1145 <v-layout>
1146 <v-flex 1146 <v-flex
1147 xs12 1147 xs12
1148 class="text-xs-center text-sm-center text-md-center text-lg-center mr-4" 1148 class="text-xs-center text-sm-center text-md-center text-lg-center mr-4"
1149 > 1149 >
1150 <v-avatar size="100px"> 1150 <v-avatar size="100px">
1151 <img src="/static/icon/user.png" v-if="!imageUrl" /> 1151 <img src="/static/icon/user.png" v-if="!imageUrl" />
1152 </v-avatar> 1152 </v-avatar>
1153 <input 1153 <input
1154 type="file" 1154 type="file"
1155 style="display: none" 1155 style="display: none"
1156 ref="image" 1156 ref="image"
1157 accept="image/*" 1157 accept="image/*"
1158 @change="onFilePicked" 1158 @change="onFilePicked"
1159 /> 1159 />
1160 <img 1160 <img
1161 :src="imageData.imageUrl" 1161 :src="imageData.imageUrl"
1162 height="150" 1162 height="150"
1163 v-if="imageUrl" 1163 v-if="imageUrl"
1164 style="border-radius:50%; width:200px" 1164 style="border-radius:50%; width:200px"
1165 /> 1165 />
1166 </v-flex> 1166 </v-flex>
1167 </v-layout> 1167 </v-layout>
1168 <v-layout> 1168 <v-layout>
1169 <v-flex xs12 sm6> 1169 <v-flex xs12 sm6>
1170 <v-layout> 1170 <v-layout>
1171 <v-flex xs4 class="pt-4 subheading"> 1171 <v-flex xs4 class="pt-4 subheading">
1172 <label class="right">Select Class:</label> 1172 <label class="right">Select Class:</label>
1173 </v-flex> 1173 </v-flex>
1174 <v-flex xs8 class="ml-3"> 1174 <v-flex xs8 class="ml-3">
1175 <v-select 1175 <v-select
1176 :items="addclass" 1176 :items="addclass"
1177 label="Select Class" 1177 label="Select Class"
1178 v-model="addStudents.select" 1178 v-model="addStudents.select"
1179 item-text="classNum" 1179 item-text="classNum"
1180 item-value="_id" 1180 item-value="_id"
1181 name="Select Class" 1181 name="Select Class"
1182 :rules="classRules" 1182 :rules="classRules"
1183 @change="getSection(addStudents.select)" 1183 @change="getSection(addStudents.select)"
1184 required 1184 required
1185 ></v-select> 1185 ></v-select>
1186 </v-flex> 1186 </v-flex>
1187 </v-layout> 1187 </v-layout>
1188 </v-flex> 1188 </v-flex>
1189 <v-flex xs12 sm6> 1189 <v-flex xs12 sm6>
1190 <v-layout> 1190 <v-layout>
1191 <v-flex xs4 class="pt-4 subheading"> 1191 <v-flex xs4 class="pt-4 subheading">
1192 <label class="right">Select Section:</label> 1192 <label class="right">Select Section:</label>
1193 </v-flex> 1193 </v-flex>
1194 <v-flex xs8 class="ml-3"> 1194 <v-flex xs8 class="ml-3">
1195 <v-select 1195 <v-select
1196 :items="addSection" 1196 :items="addSection"
1197 label="Select Section" 1197 label="Select Section"
1198 v-model="addStudents.selectSection" 1198 v-model="addStudents.selectSection"
1199 item-text="name" 1199 item-text="name"
1200 item-value="_id" 1200 item-value="_id"
1201 name="Select Section" 1201 name="Select Section"
1202 :rules="sectionRules" 1202 :rules="sectionRules"
1203 required 1203 required
1204 ></v-select> 1204 ></v-select>
1205 </v-flex> 1205 </v-flex>
1206 </v-layout> 1206 </v-layout>
1207 </v-flex> 1207 </v-flex>
1208 </v-layout> 1208 </v-layout>
1209 <v-layout> 1209 <v-layout>
1210 <v-flex xs12 sm6> 1210 <v-flex xs12 sm6>
1211 <v-layout> 1211 <v-layout>
1212 <v-flex xs4 class="pt-4 subheading"> 1212 <v-flex xs4 class="pt-4 subheading">
1213 <label class="right">Full Name:</label> 1213 <label class="right">Full Name:</label>
1214 </v-flex> 1214 </v-flex>
1215 <v-flex xs8 class="ml-3"> 1215 <v-flex xs8 class="ml-3">
1216 <v-text-field 1216 <v-text-field
1217 v-model="addStudents.name" 1217 v-model="addStudents.name"
1218 placeholder="fill your full Name" 1218 placeholder="fill your full Name"
1219 name="name" 1219 name="name"
1220 type="text" 1220 type="text"
1221 :rules="nameRules" 1221 :rules="nameRules"
1222 required 1222 required
1223 ></v-text-field> 1223 ></v-text-field>
1224 </v-flex> 1224 </v-flex>
1225 </v-layout> 1225 </v-layout>
1226 </v-flex> 1226 </v-flex>
1227 <v-flex xs12 sm6> 1227 <v-flex xs12 sm6>
1228 <v-layout> 1228 <v-layout>
1229 <v-flex xs4 class="pt-4 subheading"> 1229 <v-flex xs4 class="pt-4 subheading">
1230 <label class="right">Email ID:</label> 1230 <label class="right">Email ID:</label>
1231 </v-flex> 1231 </v-flex>
1232 <v-flex xs8 class="ml-3"> 1232 <v-flex xs8 class="ml-3">
1233 <v-text-field 1233 <v-text-field
1234 placeholder="fill your email" 1234 placeholder="fill your email"
1235 :rules="emailRules" 1235 :rules="emailRules"
1236 v-model="addStudents.email" 1236 v-model="addStudents.email"
1237 type="text" 1237 type="text"
1238 name="email" 1238 name="email"
1239 required 1239 required
1240 ></v-text-field> 1240 ></v-text-field>
1241 </v-flex> 1241 </v-flex>
1242 </v-layout> 1242 </v-layout>
1243 </v-flex> 1243 </v-flex>
1244 </v-layout> 1244 </v-layout>
1245 <v-layout> 1245 <v-layout>
1246 <v-flex xs12 sm6> 1246 <v-flex xs12 sm6>
1247 <v-layout> 1247 <v-layout>
1248 <v-flex xs4 class="pt-4 subheading"> 1248 <v-flex xs4 class="pt-4 subheading">
1249 <label class="right">Date of Birth:</label> 1249 <label class="right">Date of Birth:</label>
1250 </v-flex> 1250 </v-flex>
1251 <v-flex xs8 class="ml-3"> 1251 <v-flex xs8 class="ml-3">
1252 <v-menu 1252 <v-menu
1253 ref="menu" 1253 ref="menu"
1254 :close-on-content-click="false" 1254 :close-on-content-click="false"
1255 v-model="menu" 1255 v-model="menu"
1256 :nudge-right="40" 1256 :nudge-right="40"
1257 lazy 1257 lazy
1258 transition="scale-transition" 1258 transition="scale-transition"
1259 offset-y 1259 offset-y
1260 full-width 1260 full-width
1261 min-width="290px" 1261 min-width="290px"
1262 > 1262 >
1263 <v-text-field 1263 <v-text-field
1264 slot="activator" 1264 slot="activator"
1265 :rules="dateRules" 1265 :rules="dateRules"
1266 v-model="addStudents.date" 1266 v-model="addStudents.date"
1267 placeholder="Select date" 1267 placeholder="Select date"
1268 ></v-text-field> 1268 ></v-text-field>
1269 <v-date-picker 1269 <v-date-picker
1270 ref="picker" 1270 ref="picker"
1271 v-model="addStudents.date" 1271 v-model="addStudents.date"
1272 :max="new Date().toISOString().substr(0, 10)" 1272 :max="new Date().toISOString().substr(0, 10)"
1273 min="1950-01-01" 1273 min="1950-01-01"
1274 @input="menu = false" 1274 @input="menu = false"
1275 ></v-date-picker> 1275 ></v-date-picker>
1276 </v-menu> 1276 </v-menu>
1277 </v-flex> 1277 </v-flex>
1278 </v-layout> 1278 </v-layout>
1279 </v-flex> 1279 </v-flex>
1280 <v-flex xs12 sm6> 1280 <v-flex xs12 sm6>
1281 <v-layout> 1281 <v-layout>
1282 <v-flex xs4 class="pt-4 subheading"> 1282 <v-flex xs4 class="pt-4 subheading">
1283 <label class="right">City:</label> 1283 <label class="right">City:</label>
1284 </v-flex> 1284 </v-flex>
1285 <v-flex xs8 class="ml-3"> 1285 <v-flex xs8 class="ml-3">
1286 <v-text-field 1286 <v-text-field
1287 v-model="addStudents.city" 1287 v-model="addStudents.city"
1288 placeholder="fill your City Name" 1288 placeholder="fill your City Name"
1289 name="City" 1289 name="City"
1290 type="text" 1290 type="text"
1291 :rules="cityRules" 1291 :rules="cityRules"
1292 required 1292 required
1293 ></v-text-field> 1293 ></v-text-field>
1294 </v-flex> 1294 </v-flex>
1295 </v-layout> 1295 </v-layout>
1296 </v-flex> 1296 </v-flex>
1297 </v-layout> 1297 </v-layout>
1298 <v-layout> 1298 <v-layout>
1299 <v-flex xs12 sm6> 1299 <v-flex xs12 sm6>
1300 <v-layout> 1300 <v-layout>
1301 <v-flex xs4 class="pt-4 subheading"> 1301 <v-flex xs4 class="pt-4 subheading">
1302 <label class="right">State:</label> 1302 <label class="right">State:</label>
1303 </v-flex> 1303 </v-flex>
1304 <v-flex xs8 class="ml-3"> 1304 <v-flex xs8 class="ml-3">
1305 <v-text-field 1305 <v-text-field
1306 v-model="addStudents.state" 1306 v-model="addStudents.state"
1307 placeholder="fill your State Name" 1307 placeholder="fill your State Name"
1308 name="state" 1308 name="state"
1309 type="text" 1309 type="text"
1310 :rules="stateRules" 1310 :rules="stateRules"
1311 required 1311 required
1312 ></v-text-field> 1312 ></v-text-field>
1313 </v-flex> 1313 </v-flex>
1314 </v-layout> 1314 </v-layout>
1315 </v-flex> 1315 </v-flex>
1316 <v-flex xs12 sm6> 1316 <v-flex xs12 sm6>
1317 <v-layout> 1317 <v-layout>
1318 <v-flex xs4 class="pt-4 subheading"> 1318 <v-flex xs4 class="pt-4 subheading">
1319 <label class="right">Pincode:</label> 1319 <label class="right">Pincode:</label>
1320 </v-flex> 1320 </v-flex>
1321 <v-flex xs8 class="ml-3"> 1321 <v-flex xs8 class="ml-3">
1322 <v-text-field 1322 <v-text-field
1323 v-model="addStudents.pincode" 1323 v-model="addStudents.pincode"
1324 placeholder="fill your pincode" 1324 placeholder="fill your pincode"
1325 name="pincode" 1325 name="pincode"
1326 type="number" 1326 type="number"
1327 :rules="pincode" 1327 :rules="pincode"
1328 required 1328 required
1329 ></v-text-field> 1329 ></v-text-field>
1330 </v-flex> 1330 </v-flex>
1331 </v-layout> 1331 </v-layout>
1332 </v-flex> 1332 </v-flex>
1333 </v-layout> 1333 </v-layout>
1334 <v-layout> 1334 <v-layout>
1335 <v-flex xs12 sm6> 1335 <v-flex xs12 sm6>
1336 <v-layout> 1336 <v-layout>
1337 <v-flex xs4 class="pt-4 subheading"> 1337 <v-flex xs4 class="pt-4 subheading">
1338 <label class="right">Mobile No:</label> 1338 <label class="right">Mobile No:</label>
1339 </v-flex> 1339 </v-flex>
1340 <v-flex xs8 class="ml-3"> 1340 <v-flex xs8 class="ml-3">
1341 <v-text-field 1341 <v-text-field
1342 v-model="addStudents.mobile" 1342 v-model="addStudents.mobile"
1343 placeholder="fill your MobileNo" 1343 placeholder="fill your MobileNo"
1344 name="mobileNo" 1344 name="mobileNo"
1345 type="number" 1345 type="number"
1346 :rules="mobileNoRules" 1346 :rules="mobileNoRules"
1347 required 1347 required
1348 ></v-text-field> 1348 ></v-text-field>
1349 </v-flex> 1349 </v-flex>
1350 </v-layout> 1350 </v-layout>
1351 </v-flex> 1351 </v-flex>
1352 <v-flex xs12 sm6> 1352 <v-flex xs12 sm6>
1353 <v-layout> 1353 <v-layout>
1354 <v-flex xs4 class="pt-4 subheading"> 1354 <v-flex xs4 class="pt-4 subheading">
1355 <label class="right">Select Country:</label> 1355 <label class="right">Select Country:</label>
1356 </v-flex> 1356 </v-flex>
1357 <v-flex xs8 class="ml-3"> 1357 <v-flex xs8 class="ml-3">
1358 <v-autocomplete 1358 <v-autocomplete
1359 v-model="addStudents.country" 1359 v-model="addStudents.country"
1360 :rules="country" 1360 :rules="country"
1361 :items="countries" 1361 :items="countries"
1362 placeholder="Select Country Name" 1362 placeholder="Select Country Name"
1363 required 1363 required
1364 ></v-autocomplete> 1364 ></v-autocomplete>
1365 </v-flex> 1365 </v-flex>
1366 </v-layout> 1366 </v-layout>
1367 </v-flex> 1367 </v-flex>
1368 </v-layout> 1368 </v-layout>
1369 <v-layout> 1369 <v-layout>
1370 <v-flex xs12 sm6> 1370 <v-flex xs12 sm6>
1371 <v-layout> 1371 <v-layout>
1372 <v-flex xs4 class="pt-4 subheading"> 1372 <v-flex xs4 class="pt-4 subheading">
1373 <label class="right">Gender:</label> 1373 <label class="right">Gender:</label>
1374 </v-flex> 1374 </v-flex>
1375 <v-flex xs8 class="ml-3"> 1375 <v-flex xs8 class="ml-3">
1376 <v-select 1376 <v-select
1377 :items="gender" 1377 :items="gender"
1378 v-model="addStudents.gender" 1378 v-model="addStudents.gender"
1379 :rules="genderRules" 1379 :rules="genderRules"
1380 label="Select Gender" 1380 label="Select Gender"
1381 required 1381 required
1382 ></v-select> 1382 ></v-select>
1383 </v-flex> 1383 </v-flex>
1384 </v-layout> 1384 </v-layout>
1385 </v-flex> 1385 </v-flex>
1386 <v-flex xs12 sm6> 1386 <v-flex xs12 sm6>
1387 <v-layout> 1387 <v-layout>
1388 <v-flex xs4 class="pt-4 subheading"> 1388 <v-flex xs4 class="pt-4 subheading">
1389 <label class="right">Blood Group:</label> 1389 <label class="right">Blood Group:</label>
1390 </v-flex> 1390 </v-flex>
1391 <v-flex xs8 class="ml-3"> 1391 <v-flex xs8 class="ml-3">
1392 <v-text-field 1392 <v-text-field
1393 v-model="addStudents.bloodGroup" 1393 v-model="addStudents.bloodGroup"
1394 placeholder="Fill your Blood Group" 1394 placeholder="Fill your Blood Group"
1395 required 1395 required
1396 ></v-text-field> 1396 ></v-text-field>
1397 </v-flex> 1397 </v-flex>
1398 </v-layout> 1398 </v-layout>
1399 </v-flex> 1399 </v-flex>
1400 </v-layout> 1400 </v-layout>
1401 <v-layout> 1401 <v-layout>
1402 <v-flex xs12 sm6> 1402 <v-flex xs12 sm6>
1403 <v-layout> 1403 <v-layout>
1404 <v-flex xs4 class="pt-4 subheading"> 1404 <v-flex xs4 class="pt-4 subheading">
1405 <label class="right">Allergies:</label> 1405 <label class="right">Allergies:</label>
1406 </v-flex> 1406 </v-flex>
1407 <v-flex xs8 class="ml-3"> 1407 <v-flex xs8 class="ml-3">
1408 <v-text-field 1408 <v-text-field
1409 v-model="addStudents.allergies" 1409 v-model="addStudents.allergies"
1410 placeholder="Fill your Allergies" 1410 placeholder="Fill your Allergies"
1411 required 1411 required
1412 ></v-text-field> 1412 ></v-text-field>
1413 </v-flex> 1413 </v-flex>
1414 </v-layout> 1414 </v-layout>
1415 </v-flex> 1415 </v-flex>
1416 <v-flex xs12 sm6> 1416 <v-flex xs12 sm6>
1417 <v-layout> 1417 <v-layout>
1418 <v-flex xs4 class="pt-4 subheading"> 1418 <v-flex xs4 class="pt-4 subheading">
1419 <label class="right">Medical Notes:</label> 1419 <label class="right">Medical Notes:</label>
1420 </v-flex> 1420 </v-flex>
1421 <v-flex xs8 class="ml-3"> 1421 <v-flex xs8 class="ml-3">
1422 <v-text-field 1422 <v-text-field
1423 v-model="addStudents.medicalNotes" 1423 v-model="addStudents.medicalNotes"
1424 placeholder="Fill your Medical Notes" 1424 placeholder="Fill your Medical Notes"
1425 required 1425 required
1426 ></v-text-field> 1426 ></v-text-field>
1427 </v-flex> 1427 </v-flex>
1428 </v-layout> 1428 </v-layout>
1429 </v-flex> 1429 </v-flex>
1430 </v-layout> 1430 </v-layout>
1431 <v-layout> 1431 <v-layout>
1432 <v-flex xs12 sm6> 1432 <v-flex xs12 sm6>
1433 <v-layout> 1433 <v-layout>
1434 <v-flex xs4 class="pt-4 subheading"> 1434 <v-flex xs4 class="pt-4 subheading">
1435 <label class="right">Height:</label> 1435 <label class="right">Height:</label>
1436 </v-flex> 1436 </v-flex>
1437 <v-flex xs8 class="ml-3"> 1437 <v-flex xs8 class="ml-3">
1438 <v-text-field 1438 <v-text-field
1439 v-model="addStudents.height" 1439 v-model="addStudents.height"
1440 placeholder="Fill your Height" 1440 placeholder="Fill your Height"
1441 required 1441 required
1442 ></v-text-field> 1442 ></v-text-field>
1443 </v-flex> 1443 </v-flex>
1444 </v-layout> 1444 </v-layout>
1445 </v-flex> 1445 </v-flex>
1446 <v-flex xs12 sm6> 1446 <v-flex xs12 sm6>
1447 <v-layout> 1447 <v-layout>
1448 <v-flex xs4 class="pt-4 subheading"> 1448 <v-flex xs4 class="pt-4 subheading">
1449 <label class="right">Weight:</label> 1449 <label class="right">Weight:</label>
1450 </v-flex> 1450 </v-flex>
1451 <v-flex xs8 class="ml-3"> 1451 <v-flex xs8 class="ml-3">
1452 <v-text-field 1452 <v-text-field
1453 v-model="addStudents.weight" 1453 v-model="addStudents.weight"
1454 placeholder="Fill your Weight" 1454 placeholder="Fill your Weight"
1455 required 1455 required
1456 ></v-text-field> 1456 ></v-text-field>
1457 </v-flex> 1457 </v-flex>
1458 </v-layout> 1458 </v-layout>
1459 </v-flex> 1459 </v-flex>
1460 </v-layout> 1460 </v-layout>
1461 <v-layout> 1461 <v-layout>
1462 <v-flex xs12 sm6> 1462 <v-flex xs12 sm6>
1463 <v-layout> 1463 <v-layout>
1464 <v-flex xs4 class="pt-4 subheading"> 1464 <v-flex xs4 class="pt-4 subheading">
1465 <label class="right">Uplaod Image:</label> 1465 <label class="right">Uplaod Image:</label>
1466 </v-flex> 1466 </v-flex>
1467 <v-flex xs8 class="ml-3"> 1467 <v-flex xs8 class="ml-3">
1468 <v-text-field 1468 <v-text-field
1469 label="Select Image" 1469 label="Select Image"
1470 @click="pickFile" 1470 @click="pickFile"
1471 v-model="imageName" 1471 v-model="imageName"
1472 append-icon="attach_file" 1472 append-icon="attach_file"
1473 ></v-text-field> 1473 ></v-text-field>
1474 </v-flex> 1474 </v-flex>
1475 </v-layout> 1475 </v-layout>
1476 </v-flex> 1476 </v-flex>
1477 <v-flex xs12 sm6> 1477 <v-flex xs12 sm6>
1478 <v-layout> 1478 <v-layout>
1479 <v-flex xs4 class="pt-4 subheading"> 1479 <v-flex xs4 class="pt-4 subheading">
1480 <label class="right">Academic Year:</label> 1480 <label class="right">Academic Year:</label>
1481 </v-flex> 1481 </v-flex>
1482 <v-flex xs8 class="ml-3"> 1482 <v-flex xs8 class="ml-3">
1483 <v-text-field 1483 <v-text-field
1484 v-model="addStudents.establishmentYear" 1484 v-model="addStudents.establishmentYear"
1485 placeholder="fill your Academic Year" 1485 placeholder="fill your Academic Year"
1486 name="state" 1486 name="state"
1487 type="number" 1487 type="number"
1488 :rules="establishmentYearRules" 1488 :rules="establishmentYearRules"
1489 required 1489 required
1490 ></v-text-field> 1490 ></v-text-field>
1491 </v-flex> 1491 </v-flex>
1492 </v-layout> 1492 </v-layout>
1493 </v-flex> 1493 </v-flex>
1494 </v-layout> 1494 </v-layout>
1495 <v-layout> 1495 <v-layout>
1496 <v-flex xs12 sm12> 1496 <v-flex xs12 sm12>
1497 <v-layout> 1497 <v-layout>
1498 <v-flex 1498 <v-flex
1499 xs3 1499 xs3
1500 class="pt-4 subheading pl-4" 1500 class="pt-4 subheading pl-4"
1501 style="max-width: 17%;" 1501 style="max-width: 17%;"
1502 > 1502 >
1503 <label class>Present Address:</label> 1503 <label class>Present Address:</label>
1504 </v-flex> 1504 </v-flex>
1505 <v-flex xs12> 1505 <v-flex xs12>
1506 <v-text-field 1506 <v-text-field
1507 name="input-4-3" 1507 name="input-4-3"
1508 v-model="addStudents.presentAddress" 1508 v-model="addStudents.presentAddress"
1509 :rules="presentAddress" 1509 :rules="presentAddress"
1510 placeholder="fill Your present Address" 1510 placeholder="fill Your present Address"
1511 required 1511 required
1512 ></v-text-field> 1512 ></v-text-field>
1513 </v-flex> 1513 </v-flex>
1514 </v-layout> 1514 </v-layout>
1515 </v-flex> 1515 </v-flex>
1516 <v-flex xs12 sm12> 1516 <v-flex xs12 sm12>
1517 <v-layout> 1517 <v-layout>
1518 <v-flex xs3 class="pt-4 subheading" style="max-width: 17%;"> 1518 <v-flex xs3 class="pt-4 subheading" style="max-width: 17%;">
1519 <label>Permanent Address:</label> 1519 <label>Permanent Address:</label>
1520 </v-flex> 1520 </v-flex>
1521 <v-flex xs12> 1521 <v-flex xs12>
1522 <v-text-field 1522 <v-text-field
1523 name="input-4-3" 1523 name="input-4-3"
1524 v-model="addStudents.permanentAddress" 1524 v-model="addStudents.permanentAddress"
1525 :rules="permanentAddress" 1525 :rules="permanentAddress"
1526 placeholder="fill Your Permanent Address" 1526 placeholder="fill Your Permanent Address"
1527 required 1527 required
1528 ></v-text-field> 1528 ></v-text-field>
1529 </v-flex> 1529 </v-flex>
1530 </v-layout> 1530 </v-layout>
1531 </v-flex> 1531 </v-flex>
1532 </v-layout> 1532 </v-layout>
1533 <v-layout> 1533 <v-layout>
1534 <v-flex xs12 sm12> 1534 <v-flex xs12 sm12>
1535 <v-card-actions> 1535 <v-card-actions>
1536 <!-- <v-btn @click="clear" round dark>clear</v-btn> --> 1536 <!-- <v-btn @click="clear" round dark>clear</v-btn> -->
1537 <v-btn round dark @click="e2 = 1"> 1537 <v-btn round dark @click="e2 = 1">
1538 <v-icon dark left>arrow_back</v-icon>Back 1538 <v-icon dark left>arrow_back</v-icon>Back
1539 </v-btn> 1539 </v-btn>
1540 <v-spacer></v-spacer> 1540 <v-spacer></v-spacer>
1541 <v-btn @click="submit" round dark :loading="loading">Add</v-btn> 1541 <v-btn @click="submit" round dark :loading="loading">Add</v-btn>
1542 </v-card-actions> 1542 </v-card-actions>
1543 </v-flex> 1543 </v-flex>
1544 </v-layout> 1544 </v-layout>
1545 </v-container> 1545 </v-container>
1546 </v-form> 1546 </v-form>
1547 </v-flex> 1547 </v-flex>
1548 </v-container> 1548 </v-container>
1549 </v-stepper-content> 1549 </v-stepper-content>
1550 </v-stepper-items> 1550 </v-stepper-items>
1551 </v-stepper> 1551 </v-stepper>
1552 </v-app> 1552 </v-app>
1553 </div> 1553 </div>
1554 </v-flex> 1554 </v-flex>
1555 </v-layout> 1555 </v-layout>
1556 </v-container> 1556 </v-container>
1557 </v-tab-item> 1557 </v-tab-item>
1558 </v-tabs> 1558 </v-tabs>
1559 <div class="loader" v-if="showLoader"> 1559 <div class="loader" v-if="showLoader">
1560 <v-progress-circular indeterminate color="white"></v-progress-circular> 1560 <v-progress-circular indeterminate color="white"></v-progress-circular>
1561 </div> 1561 </div>
1562 </v-app> 1562 </v-app>
1563 </template> 1563 </template>
1564 1564
1565 <script> 1565 <script>
1566 import http from "@/Services/http.js"; 1566 import http from "@/Services/http.js";
1567 import Util from "@/util"; 1567 import Util from "@/util";
1568 import moment from "moment"; 1568 import moment from "moment";
1569 1569
1570 export default { 1570 export default {
1571 data: () => ({ 1571 data: () => ({
1572 e2: 0, 1572 e2: 0,
1573 showParent: true, 1573 showParent: true,
1574 showNext: false, 1574 showNext: false,
1575 snackbar: false, 1575 snackbar: false,
1576 y: "top", 1576 y: "top",
1577 x: "right", 1577 x: "right",
1578 mode: "", 1578 mode: "",
1579 timeout: 3000, 1579 timeout: 3000,
1580 text: "", 1580 text: "",
1581 showLoader: false, 1581 showLoader: false,
1582 loading: false, 1582 loading: false,
1583 date: null, 1583 date: null,
1584 search: "", 1584 search: "",
1585 menu: false, 1585 menu: false,
1586 menu1: false, 1586 menu1: false,
1587 dialog: false, 1587 dialog: false,
1588 dialog1: false, 1588 dialog1: false,
1589 valid: true, 1589 valid: true,
1590 isActive: true, 1590 isActive: true,
1591 newActive: false, 1591 newActive: false,
1592 addclass: [], 1592 addclass: [],
1593 addSection: [], 1593 addSection: [],
1594 gender: ["Male", "Female"], 1594 gender: ["Male", "Female"],
1595 AddUsercredentials: {}, 1595 AddUsercredentials: {},
1596 pagination: { 1596 pagination: {
1597 rowsPerPage: 15 1597 rowsPerPage: 15
1598 }, 1598 },
1599 imageData: {}, 1599 imageData: {},
1600 imageName: "", 1600 imageName: "",
1601 imageUrl: "", 1601 imageUrl: "",
1602 imageFile: "", 1602 imageFile: "",
1603 nameRules: [v => !!v || " Full Name is required"], 1603 nameRules: [v => !!v || " Full Name is required"],
1604 dateRules: [v => !!v || " DOB is required"], 1604 dateRules: [v => !!v || " DOB is required"],
1605 cityRules: [v => !!v || " City Name is required"], 1605 cityRules: [v => !!v || " City Name is required"],
1606 pincode: [v => !!v || " Pincode is required"], 1606 pincode: [v => !!v || " Pincode is required"],
1607 country: [v => !!v || " Country Name is required"], 1607 country: [v => !!v || " Country Name is required"],
1608 permanentAddress: [v => !!v || " Permanent Address is required"], 1608 permanentAddress: [v => !!v || " Permanent Address is required"],
1609 presentAddress: [v => !!v || " Present Address is required"], 1609 presentAddress: [v => !!v || " Present Address is required"],
1610 mobileNoRules: [v => !!v || "Mobile Number is required"], 1610 mobileNoRules: [v => !!v || "Mobile Number is required"],
1611 stateRules: [v => !!v || "State Name is required"], 1611 stateRules: [v => !!v || "State Name is required"],
1612 classRules: [v => !!v || " Class Name is required"], 1612 classRules: [v => !!v || " Class Name is required"],
1613 sectionRules: [v => !!v || " Section Name is required"], 1613 sectionRules: [v => !!v || " Section Name is required"],
1614 genderRules: [v => !!v || " Select Gender is required"], 1614 genderRules: [v => !!v || " Select Gender is required"],
1615 fatherNameRules: [v => !!v || " Father Name is required"], 1615 fatherNameRules: [v => !!v || " Father Name is required"],
1616 fatheCellNoRules: [v => !!v || " father Cell Number is required"], 1616 fatheCellNoRules: [v => !!v || " father Cell Number is required"],
1617 motherNameRules: [v => !!v || " Mother Name is required"], 1617 motherNameRules: [v => !!v || " Mother Name is required"],
1618 motherCellNoRules: [v => !!v || " Mother Cell Number is required"], 1618 motherCellNoRules: [v => !!v || " Mother Cell Number is required"],
1619 establishmentYearRules: [v => !!v || " Academic Year is required"], 1619 establishmentYearRules: [v => !!v || " Academic Year is required"],
1620 errorMessages: "", 1620 errorMessages: "",
1621 emailRules: [ 1621 emailRules: [
1622 v => !!v || "E-mail is required", 1622 v => !!v || "E-mail is required",
1623 v => 1623 v =>
1624 /^\w+([.-]?\w+)*@\w+([.-]?\w+)*(\.\w{2,3})+$/.test(v) || 1624 /^\w+([.-]?\w+)*@\w+([.-]?\w+)*(\.\w{2,3})+$/.test(v) ||
1625 "E-mail must be valid" 1625 "E-mail must be valid"
1626 ], 1626 ],
1627 countries: [ 1627 countries: [
1628 "Afghanistan", 1628 "Afghanistan",
1629 "Albania", 1629 "Albania",
1630 "Algeria", 1630 "Algeria",
1631 "Andorra", 1631 "Andorra",
1632 "Angola", 1632 "Angola",
1633 "Anguilla", 1633 "Anguilla",
1634 "Antigua &amp; Barbuda", 1634 "Antigua &amp; Barbuda",
1635 "Argentina", 1635 "Argentina",
1636 "Armenia", 1636 "Armenia",
1637 "Aruba", 1637 "Aruba",
1638 "Australia", 1638 "Australia",
1639 "Austria", 1639 "Austria",
1640 "Azerbaijan", 1640 "Azerbaijan",
1641 "Bahamas", 1641 "Bahamas",
1642 "Bahrain", 1642 "Bahrain",
1643 "Bangladesh", 1643 "Bangladesh",
1644 "Barbados", 1644 "Barbados",
1645 "Belarus", 1645 "Belarus",
1646 "Belgium", 1646 "Belgium",
1647 "Belize", 1647 "Belize",
1648 "Benin", 1648 "Benin",
1649 "Bermuda", 1649 "Bermuda",
1650 "Bhutan", 1650 "Bhutan",
1651 "Bolivia", 1651 "Bolivia",
1652 "Bosnia &amp; Herzegovina", 1652 "Bosnia &amp; Herzegovina",
1653 "Botswana", 1653 "Botswana",
1654 "Brazil", 1654 "Brazil",
1655 "British Virgin Islands", 1655 "British Virgin Islands",
1656 "Brunei", 1656 "Brunei",
1657 "Bulgaria", 1657 "Bulgaria",
1658 "Burkina Faso", 1658 "Burkina Faso",
1659 "Burundi", 1659 "Burundi",
1660 "Cambodia", 1660 "Cambodia",
1661 "Cameroon", 1661 "Cameroon",
1662 "Cape Verde", 1662 "Cape Verde",
1663 "Cayman Islands", 1663 "Cayman Islands",
1664 "Chad", 1664 "Chad",
1665 "Chile", 1665 "Chile",
1666 "China", 1666 "China",
1667 "Colombia", 1667 "Colombia",
1668 "Congo", 1668 "Congo",
1669 "Cook Islands", 1669 "Cook Islands",
1670 "Costa Rica", 1670 "Costa Rica",
1671 "Cote D Ivoire", 1671 "Cote D Ivoire",
1672 "Croatia", 1672 "Croatia",
1673 "Cruise Ship", 1673 "Cruise Ship",
1674 "Cuba", 1674 "Cuba",
1675 "Cyprus", 1675 "Cyprus",
1676 "Czech Republic", 1676 "Czech Republic",
1677 "Denmark", 1677 "Denmark",
1678 "Djibouti", 1678 "Djibouti",
1679 "Dominica", 1679 "Dominica",
1680 "Dominican Republic", 1680 "Dominican Republic",
1681 "Ecuador", 1681 "Ecuador",
1682 "Egypt", 1682 "Egypt",
1683 "El Salvador", 1683 "El Salvador",
1684 "Equatorial Guinea", 1684 "Equatorial Guinea",
1685 "Estonia", 1685 "Estonia",
1686 "Ethiopia", 1686 "Ethiopia",
1687 "Falkland Islands", 1687 "Falkland Islands",
1688 "Faroe Islands", 1688 "Faroe Islands",
1689 "Fiji", 1689 "Fiji",
1690 "Finland", 1690 "Finland",
1691 "France", 1691 "France",
1692 "French Polynesia", 1692 "French Polynesia",
1693 "French West Indies", 1693 "French West Indies",
1694 "Gabon", 1694 "Gabon",
1695 "Gambia", 1695 "Gambia",
1696 "Georgia", 1696 "Georgia",
1697 "Germany", 1697 "Germany",
1698 "Ghana", 1698 "Ghana",
1699 "Gibraltar", 1699 "Gibraltar",
1700 "Greece", 1700 "Greece",
1701 "Greenland", 1701 "Greenland",
1702 "Grenada", 1702 "Grenada",
1703 "Guam", 1703 "Guam",
1704 "Guatemala", 1704 "Guatemala",
1705 "Guernsey", 1705 "Guernsey",
1706 "Guinea", 1706 "Guinea",
1707 "Guinea Bissau", 1707 "Guinea Bissau",
1708 "Guyana", 1708 "Guyana",
1709 "Haiti", 1709 "Haiti",
1710 "Honduras", 1710 "Honduras",
1711 "Hong Kong", 1711 "Hong Kong",
1712 "Hungary", 1712 "Hungary",
1713 "Iceland", 1713 "Iceland",
1714 "India", 1714 "India",
1715 "Indonesia", 1715 "Indonesia",
1716 "Iran", 1716 "Iran",
1717 "Iraq", 1717 "Iraq",
1718 "Ireland", 1718 "Ireland",
1719 "Isle of Man", 1719 "Isle of Man",
1720 "Israel", 1720 "Israel",
1721 "Italy", 1721 "Italy",
1722 "Jamaica", 1722 "Jamaica",
1723 "Japan", 1723 "Japan",
1724 "Jersey", 1724 "Jersey",
1725 "Jordan", 1725 "Jordan",
1726 "Kazakhstan", 1726 "Kazakhstan",
1727 "Kenya", 1727 "Kenya",
1728 "Kuwait", 1728 "Kuwait",
1729 "Kyrgyz Republic", 1729 "Kyrgyz Republic",
1730 "Laos", 1730 "Laos",
1731 "Latvia", 1731 "Latvia",
1732 "Lebanon", 1732 "Lebanon",
1733 "Lesotho", 1733 "Lesotho",
1734 "Liberia", 1734 "Liberia",
1735 "Libya", 1735 "Libya",
1736 "Liechtenstein", 1736 "Liechtenstein",
1737 "Lithuania", 1737 "Lithuania",
1738 "Luxembourg", 1738 "Luxembourg",
1739 "Macau", 1739 "Macau",
1740 "Macedonia", 1740 "Macedonia",
1741 "Madagascar", 1741 "Madagascar",
1742 "Malawi", 1742 "Malawi",
1743 "Malaysia", 1743 "Malaysia",
1744 "Maldives", 1744 "Maldives",
1745 "Mali", 1745 "Mali",
1746 "Malta", 1746 "Malta",
1747 "Mauritania", 1747 "Mauritania",
1748 "Mauritius", 1748 "Mauritius",
1749 "Mexico", 1749 "Mexico",
1750 "Moldova", 1750 "Moldova",
1751 "Monaco", 1751 "Monaco",
1752 "Mongolia", 1752 "Mongolia",
1753 "Montenegro", 1753 "Montenegro",
1754 "Montserrat", 1754 "Montserrat",
1755 "Morocco", 1755 "Morocco",
1756 "Mozambique", 1756 "Mozambique",
1757 "Namibia", 1757 "Namibia",
1758 "Nepal", 1758 "Nepal",
1759 "Netherlands", 1759 "Netherlands",
1760 "Netherlands Antilles", 1760 "Netherlands Antilles",
1761 "New Caledonia", 1761 "New Caledonia",
1762 "New Zealand", 1762 "New Zealand",
1763 "Nicaragua", 1763 "Nicaragua",
1764 "Niger", 1764 "Niger",
1765 "Nigeria", 1765 "Nigeria",
1766 "Norway", 1766 "Norway",
1767 "Oman", 1767 "Oman",
1768 "Pakistan", 1768 "Pakistan",
1769 "Palestine", 1769 "Palestine",
1770 "Panama", 1770 "Panama",
1771 "Papua New Guinea", 1771 "Papua New Guinea",
1772 "Paraguay", 1772 "Paraguay",
1773 "Peru", 1773 "Peru",
1774 "Philippines", 1774 "Philippines",
1775 "Poland", 1775 "Poland",
1776 "Portugal", 1776 "Portugal",
1777 "Puerto Rico", 1777 "Puerto Rico",
1778 "Qatar", 1778 "Qatar",
1779 "Reunion", 1779 "Reunion",
1780 "Romania", 1780 "Romania",
1781 "Russia", 1781 "Russia",
1782 "Rwanda", 1782 "Rwanda",
1783 "Saint Pierre &amp; Miquelon", 1783 "Saint Pierre &amp; Miquelon",
1784 "Samoa", 1784 "Samoa",
1785 "San Marino", 1785 "San Marino",
1786 "Satellite", 1786 "Satellite",
1787 "Saudi Arabia", 1787 "Saudi Arabia",
1788 "Senegal", 1788 "Senegal",
1789 "Serbia", 1789 "Serbia",
1790 "Seychelles", 1790 "Seychelles",
1791 "Sierra Leone", 1791 "Sierra Leone",
1792 "Singapore", 1792 "Singapore",
1793 "Slovakia", 1793 "Slovakia",
1794 "Slovenia", 1794 "Slovenia",
1795 "South Africa", 1795 "South Africa",
1796 "South Korea", 1796 "South Korea",
1797 "Spain", 1797 "Spain",
1798 "Sri Lanka", 1798 "Sri Lanka",
1799 "St Kitts &amp; Nevis", 1799 "St Kitts &amp; Nevis",
1800 "St Lucia", 1800 "St Lucia",
1801 "St Vincent", 1801 "St Vincent",
1802 "St. Lucia", 1802 "St. Lucia",
1803 "Sudan", 1803 "Sudan",
1804 "Suriname", 1804 "Suriname",
1805 "Swaziland", 1805 "Swaziland",
1806 "Sweden", 1806 "Sweden",
1807 "Switzerland", 1807 "Switzerland",
1808 "Syria", 1808 "Syria",
1809 "Taiwan", 1809 "Taiwan",
1810 "Tajikistan", 1810 "Tajikistan",
1811 "Tanzania", 1811 "Tanzania",
1812 "Thailand", 1812 "Thailand",
1813 "Timor L'Este", 1813 "Timor L'Este",
1814 "Togo", 1814 "Togo",
1815 "Tonga", 1815 "Tonga",
1816 "Trinidad &amp; Tobago", 1816 "Trinidad &amp; Tobago",
1817 "Tunisia", 1817 "Tunisia",
1818 "Turkey", 1818 "Turkey",
1819 "Turkmenistan", 1819 "Turkmenistan",
1820 "Turks &amp; Caicos", 1820 "Turks &amp; Caicos",
1821 "Uganda", 1821 "Uganda",
1822 "Ukraine", 1822 "Ukraine",
1823 "United Arab Emirates", 1823 "United Arab Emirates",
1824 "United Kingdom", 1824 "United Kingdom",
1825 "United States", 1825 "United States",
1826 "Uruguay", 1826 "Uruguay",
1827 "Uzbekistan", 1827 "Uzbekistan",
1828 "Venezuela", 1828 "Venezuela",
1829 "Vietnam", 1829 "Vietnam",
1830 "Virgin Islands (US)", 1830 "Virgin Islands (US)",
1831 "Yemen", 1831 "Yemen",
1832 "Zambia", 1832 "Zambia",
1833 "Zimbabwe" 1833 "Zimbabwe"
1834 ], 1834 ],
1835 headers: [ 1835 headers: [
1836 { 1836 {
1837 text: "No", 1837 text: "No",
1838 align: "center", 1838 align: "center",
1839 sortable: false, 1839 sortable: false,
1840 value: "No" 1840 value: "No"
1841 }, 1841 },
1842 { 1842 {
1843 text: "Profile Pic", 1843 text: "Profile Pic",
1844 value: "profilePicUrl", 1844 value: "profilePicUrl",
1845 sortable: false, 1845 sortable: false,
1846 align: "center" 1846 align: "center"
1847 }, 1847 },
1848 { text: "Name", value: "name", sortable: false, align: "center" }, 1848 { text: "Name", value: "name", sortable: false, align: "center" },
1849 { text: "Email", value: "email", sortable: false, align: "center" }, 1849 { text: "Email", value: "email", sortable: false, align: "center" },
1850 { text: "Dob", value: "dob", sortable: false, align: "center" }, 1850 { text: "Dob", value: "dob", sortable: false, align: "center" },
1851 { text: "Gender", value: "gender", sortable: false, align: "center" }, 1851 { text: "Gender", value: "gender", sortable: false, align: "center" },
1852 { 1852 {
1853 text: "Father Name", 1853 text: "Father Name",
1854 value: "fatherName", 1854 value: "fatherName",
1855 sortable: false, 1855 sortable: false,
1856 align: "center" 1856 align: "center"
1857 }, 1857 },
1858 { 1858 {
1859 text: "Mother Name", 1859 text: "Mother Name",
1860 value: "motherName", 1860 value: "motherName",
1861 sortable: false, 1861 sortable: false,
1862 align: "center" 1862 align: "center"
1863 }, 1863 },
1864 { 1864 {
1865 text: "Academic Year", 1865 text: "Academic Year",
1866 value: "establishmentYear", 1866 value: "establishmentYear",
1867 sortable: false, 1867 sortable: false,
1868 align: "center" 1868 align: "center"
1869 }, 1869 },
1870 { text: "Mobile No", value: "mobile", sortable: false, align: "center" }, 1870 { text: "Mobile No", value: "mobile", sortable: false, align: "center" },
1871 { text: "Action", value: "", sortable: false, align: "center" } 1871 { text: "Action", value: "", sortable: false, align: "center" }
1872 ], 1872 ],
1873 desserts: [], 1873 desserts: [],
1874 parentId: "", 1874 parentId: "",
1875 editedIndex: -1, 1875 editedIndex: -1,
1876 parentData: {}, 1876 parentData: {},
1877 addStudents: { 1877 addStudents: {
1878 role: "STUDENT", 1878 role: "STUDENT",
1879 name: "", 1879 name: "",
1880 email: "", 1880 email: "",
1881 date: "", 1881 date: "",
1882 city: "", 1882 city: "",
1883 pincode: "", 1883 pincode: "",
1884 country: "", 1884 country: "",
1885 permanentAddress: "", 1885 permanentAddress: "",
1886 presentAddress: "", 1886 presentAddress: "",
1887 mobile: "", 1887 mobile: "",
1888 state: "", 1888 state: "",
1889 gender: "", 1889 gender: "",
1890 select: "", 1890 select: "",
1891 selectSection: "", 1891 selectSection: "",
1892 bloodGroup: "", 1892 bloodGroup: "",
1893 allergies: "", 1893 allergies: "",
1894 medicalNotes: "", 1894 medicalNotes: "",
1895 height: "", 1895 height: "",
1896 weight: "", 1896 weight: "",
1897 establishmentYear: new Date().getFullYear() 1897 establishmentYear: new Date().getFullYear()
1898 }, 1898 },
1899 selectStudents: { 1899 selectStudents: {
1900 select: "", 1900 select: "",
1901 selectSection: "" 1901 selectSection: ""
1902 }, 1902 },
1903 editedItem: { 1903 editedItem: {
1904 role: "STUDENT", 1904 role: "STUDENT",
1905 name: "", 1905 name: "",
1906 email: "", 1906 email: "",
1907 dob: "", 1907 dob: "",
1908 city: "", 1908 city: "",
1909 pincode: "", 1909 pincode: "",
1910 country: "", 1910 country: "",
1911 permanentAddress: "", 1911 permanentAddress: "",
1912 presentAddress: "", 1912 presentAddress: "",
1913 mobile: "", 1913 mobile: "",
1914 state: "", 1914 state: "",
1915 gender: "", 1915 gender: "",
1916 fatherName: "", 1916 fatherName: "",
1917 fatherCellNo: "", 1917 fatherCellNo: "",
1918 motherName: "", 1918 motherName: "",
1919 motherCellNo: "", 1919 motherCellNo: "",
1920 select: "", 1920 select: "",
1921 selectSection: "", 1921 selectSection: "",
1922 bloodGroup: "", 1922 bloodGroup: "",
1923 allergies: "", 1923 allergies: "",
1924 medicalNotes: "", 1924 medicalNotes: "",
1925 height: "", 1925 height: "",
1926 weight: "", 1926 weight: "",
1927 establishmentYear: new Date().getFullYear() 1927 establishmentYear: new Date().getFullYear()
1928 }, 1928 },
1929 defaultItem: { 1929 defaultItem: {
1930 role: "STUDENT", 1930 role: "STUDENT",
1931 name: "", 1931 name: "",
1932 email: "" 1932 email: ""
1933 }, 1933 },
1934 userName: "", 1934 userName: "",
1935 items: [ 1935 items: [
1936 { 1936 {
1937 href: "/changepassword", 1937 href: "/changepassword",
1938 title: "Change Password", 1938 title: "Change Password",
1939 click: e => { 1939 click: e => {
1940 console.log(e); 1940 console.log(e);
1941 } 1941 }
1942 }, 1942 },
1943 { 1943 {
1944 href: "#", 1944 href: "#",
1945 title: "Logout", 1945 title: "Logout",
1946 click: e => { 1946 click: e => {
1947 window.getApp.$emit("APP_LOGOUT"); 1947 window.getApp.$emit("APP_LOGOUT");
1948 } 1948 }
1949 } 1949 }
1950 ] 1950 ]
1951 }), 1951 }),
1952 watch: { 1952 watch: {
1953 menu(val) { 1953 menu(val) {
1954 val && this.$nextTick(() => (this.$refs.picker.activePicker = "YEAR")); 1954 val && this.$nextTick(() => (this.$refs.picker.activePicker = "YEAR"));
1955 }, 1955 },
1956 menu1(val) { 1956 menu1(val) {
1957 val && this.$nextTick(() => (this.$refs.picker.activePicker = "YEAR")); 1957 val && this.$nextTick(() => (this.$refs.picker.activePicker = "YEAR"));
1958 } 1958 }
1959 }, 1959 },
1960 methods: { 1960 methods: {
1961 findStudents() { 1961 findStudents() {
1962 this.showLoader = true; 1962 this.showLoader = true;
1963 http() 1963 http()
1964 .get("/getStudentWithClass", { 1964 .get("/getStudentWithClass", {
1965 params: { 1965 params: {
1966 classId: this.selectStudents.select, 1966 classId: this.selectStudents.select,
1967 sectionId: this.selectStudents.selectSection 1967 sectionId: this.selectStudents.selectSection
1968 } 1968 }
1969 }) 1969 })
1970 .then(response => { 1970 .then(response => {
1971 this.desserts = response.data.data; 1971 this.desserts = response.data.data;
1972 this.showLoader = false; 1972 this.showLoader = false;
1973 console.log("getSectionsList=====>", this.addSection); 1973 console.log("getSectionsList=====>", this.addSection);
1974 }) 1974 })
1975 .catch(err => { 1975 .catch(err => {
1976 console.log("err====>", err); 1976 console.log("err====>", err);
1977 this.showLoader = false; 1977 this.showLoader = false;
1978 }); 1978 });
1979 }, 1979 },
1980 getSections(_id) { 1980 getSections(_id) {
1981 var token = this.$store.state.token; 1981 var token = this.$store.state.token;
1982 http() 1982 http()
1983 .get( 1983 .get(
1984 "/getSectionsList", 1984 "/getSectionsList",
1985 { params: { classId: _id } }, 1985 { params: { classId: _id } },
1986 { 1986 {
1987 headers: { Authorization: "Bearer " + token } 1987 headers: { Authorization: "Bearer " + token }
1988 } 1988 }
1989 ) 1989 )
1990 .then(response => { 1990 .then(response => {
1991 this.addSection = response.data.data; 1991 this.addSection = response.data.data;
1992 console.log("getSectionsList=====>", this.addSection); 1992 console.log("getSectionsList=====>", this.addSection);
1993 }) 1993 })
1994 .catch(err => { 1994 .catch(err => {
1995 // console.log("err====>", err); 1995 // console.log("err====>", err);
1996 // this.$router.replace({ path: '/' }); 1996 // this.$router.replace({ path: '/' });
1997 }); 1997 });
1998 }, 1998 },
1999 getSection(_id) { 1999 getSection(_id) {
2000 var token = this.$store.state.token; 2000 var token = this.$store.state.token;
2001 http() 2001 http()
2002 .get( 2002 .get(
2003 "/getSectionsList", 2003 "/getSectionsList",
2004 { params: { classId: _id } }, 2004 { params: { classId: _id } },
2005 { 2005 {
2006 headers: { Authorization: "Bearer " + token } 2006 headers: { Authorization: "Bearer " + token }
2007 } 2007 }
2008 ) 2008 )
2009 .then(response => { 2009 .then(response => {
2010 this.addSection = response.data.data; 2010 this.addSection = response.data.data;
2011 console.log("getSectionsList=====>", this.addSection); 2011 console.log("getSectionsList=====>", this.addSection);
2012 }) 2012 })
2013 .catch(err => { 2013 .catch(err => {
2014 // console.log("err====>", err); 2014 // console.log("err====>", err);
2015 // this.$router.replace({ path: '/' }); 2015 // this.$router.replace({ path: '/' });
2016 }); 2016 });
2017 }, 2017 },
2018 pickFile() { 2018 pickFile() {
2019 this.$refs.image.click(); 2019 this.$refs.image.click();
2020 }, 2020 },
2021 dates: function(date) { 2021 dates: function(date) {
2022 return moment(date).format("MMMM DD, YYYY"); 2022 return moment(date).format("MMMM DD, YYYY");
2023 }, 2023 },
2024 onFilePicked(e) { 2024 onFilePicked(e) {
2025 // console.log(e) 2025 // console.log(e)
2026 const files = e.target.files; 2026 const files = e.target.files;
2027 this.imageData.upload = e.target.files[0]; 2027 this.imageData.upload = e.target.files[0];
2028 if (files[0] !== undefined) { 2028 if (files[0] !== undefined) {
2029 this.imageName = files[0].name; 2029 this.imageName = files[0].name;
2030 if (this.imageName.lastIndexOf(".") <= 0) { 2030 if (this.imageName.lastIndexOf(".") <= 0) {
2031 return; 2031 return;
2032 } 2032 }
2033 const fr = new FileReader(); 2033 const fr = new FileReader();
2034 fr.readAsDataURL(files[0]); 2034 fr.readAsDataURL(files[0]);
2035 fr.addEventListener("load", () => { 2035 fr.addEventListener("load", () => {
2036 this.imageUrl = fr.result; 2036 this.imageUrl = fr.result;
2037 this.imageFile = files[0]; // this is an image file that can be sent to server... 2037 this.imageFile = files[0]; // this is an image file that can be sent to server...
2038 this.imageData.imageUrl = URL.createObjectURL(this.imageFile); 2038 this.imageData.imageUrl = URL.createObjectURL(this.imageFile);
2039 console.log("upload=======>", this.imageData.imageUrl);
2040 console.log("imageFile", this.imageFile);
2041 }); 2039 });
2042 } else { 2040 } else {
2043 this.imageName = ""; 2041 this.imageName = "";
2044 this.imageFile = ""; 2042 this.imageFile = "";
2045 this.imageUrl = ""; 2043 this.imageUrl = "";
2046 } 2044 }
2047 }, 2045 },
2048 // getStudentList() { 2046 // getStudentList() {
2049 // this.showLoader = true; 2047 // this.showLoader = true;
2050 // var token = this.$store.state.token; 2048 // var token = this.$store.state.token;
2051 // http() 2049 // http()
2052 // .get("/getStudentsList", { 2050 // .get("/getStudentsList", {
2053 // headers: { Authorization: "Bearer " + token } 2051 // headers: { Authorization: "Bearer " + token }
2054 // }) 2052 // })
2055 // .then(response => { 2053 // .then(response => {
2056 // this.desserts = response.data.data; 2054 // this.desserts = response.data.data;
2057 // this.showLoader = false; 2055 // this.showLoader = false;
2058 // // console.log("getStudentList=====>",this.desserts) 2056 // // console.log("getStudentList=====>",this.desserts)
2059 // }) 2057 // })
2060 // .catch(err => { 2058 // .catch(err => {
2061 // // console.log("err====>", err); 2059 // // console.log("err====>", err);
2062 // this.showLoader = false; 2060 // this.showLoader = false;
2063 // this.$router.replace({ path: "/" }); 2061 // this.$router.replace({ path: "/" });
2064 // }); 2062 // });
2065 // }, 2063 // },
2066 editItem(item) { 2064 editItem(item) {
2067 this.editedIndex = this.desserts.indexOf(item); 2065 this.editedIndex = this.desserts.indexOf(item);
2068 this.editedItem = Object.assign({}, item); 2066 this.editedItem = Object.assign({}, item);
2069 this.editedItem.fatherName = item.parentId.fatherName; 2067 this.editedItem.fatherName = item.parentId.fatherName;
2070 this.editedItem.fatherCellNo = item.parentId.fatherCellNo; 2068 this.editedItem.fatherCellNo = item.parentId.fatherCellNo;
2071 this.editedItem.motherName = item.parentId.motherName; 2069 this.editedItem.motherName = item.parentId.motherName;
2072 this.editedItem.motherCellNo = item.parentId.motherCellNo; 2070 this.editedItem.motherCellNo = item.parentId.motherCellNo;
2073 // if(this.editedItem.dob != undefined){ 2071 // if(this.editedItem.dob != undefined){
2074 // this.editedItem.dob = this.editedItem.dob.substring(0, 10) 2072 // this.editedItem.dob = this.editedItem.dob.substring(0, 10)
2075 // }else if(this.editedItem.dob = undefined){ 2073 // }else if(this.editedItem.dob = undefined){
2076 // this.editedItem.dob = '' 2074 // this.editedItem.dob = ''
2077 // } 2075 // }
2078 this.editedItem.dob = 2076 this.editedItem.dob =
2079 this.editedItem.dob != undefined 2077 this.editedItem.dob != undefined
2080 ? (this.editedItem.dob = this.editedItem.dob.substring(0, 10)) 2078 ? (this.editedItem.dob = this.editedItem.dob.substring(0, 10))
2081 : (this.editedItem.dob = ""); 2079 : (this.editedItem.dob = "");
2082 this.dialog = true; 2080 this.dialog = true;
2083 }, 2081 },
2084 profile(item) { 2082 profile(item) {
2085 console.log("item", item); 2083 console.log("item", item);
2086 this.editedIndex = this.desserts.indexOf(item); 2084 this.editedIndex = this.desserts.indexOf(item);
2087 this.editedItem = Object.assign({}, item); 2085 this.editedItem = Object.assign({}, item);
2088 this.editedItem.fatherName = item.parentId.fatherName; 2086 this.editedItem.fatherName = item.parentId.fatherName;
2089 this.editedItem.fatherCellNo = item.parentId.fatherCellNo; 2087 this.editedItem.fatherCellNo = item.parentId.fatherCellNo;
2090 this.editedItem.motherName = item.parentId.motherName; 2088 this.editedItem.motherName = item.parentId.motherName;
2091 this.editedItem.motherCellNo = item.parentId.motherCellNo; 2089 this.editedItem.motherCellNo = item.parentId.motherCellNo;
2092 2090
2093 this.dialog1 = true; 2091 this.dialog1 = true;
2094 }, 2092 },
2095 deleteItem(item) { 2093 deleteItem(item) {
2096 let deleteStudent = { 2094 let deleteStudent = {
2097 studentId: item._id 2095 studentId: item._id
2098 }; 2096 };
2099 http() 2097 http()
2100 .delete( 2098 .delete(
2101 "/deleteStudent", 2099 "/deleteStudent",
2102 confirm("Are you sure you want to delete this?") && { 2100 confirm("Are you sure you want to delete this?") && {
2103 params: deleteStudent 2101 params: deleteStudent
2104 } 2102 }
2105 ) 2103 )
2106 .then(response => { 2104 .then(response => {
2107 // console.log("deleteUers",deleteStudent) 2105 // console.log("deleteUers",deleteStudent)
2108 if ((this.snackbar = true)) { 2106 if ((this.snackbar = true)) {
2109 this.text = "Successfully delete Existing Student"; 2107 this.text = "Successfully delete Existing Student";
2110 } 2108 }
2111 this.getStudentList(); 2109 this.getStudentList();
2112 }) 2110 })
2113 .catch(error => { 2111 .catch(error => {
2114 // console.log(error); 2112 // console.log(error);
2115 }); 2113 });
2116 }, 2114 },
2117 activeTab(type) { 2115 activeTab(type) {
2118 switch (type) { 2116 switch (type) {
2119 case "existing": 2117 case "existing":
2120 this.newActive = false; 2118 this.newActive = false;
2121 this.isActive = true; 2119 this.isActive = true;
2122 break; 2120 break;
2123 2121
2124 default: 2122 default:
2125 this.newActive = true; 2123 this.newActive = true;
2126 this.isActive = false; 2124 this.isActive = false;
2127 break; 2125 break;
2128 } 2126 }
2129 }, 2127 },
2130 close() { 2128 close() {
2131 this.dialog = false; 2129 this.dialog = false;
2132 setTimeout(() => { 2130 setTimeout(() => {
2133 this.editedItem = Object.assign({}, this.defaultItem); 2131 this.editedItem = Object.assign({}, this.defaultItem);
2134 this.editedIndex = -1; 2132 this.editedIndex = -1;
2135 }, 300); 2133 }, 300);
2136 }, 2134 },
2137 close1() { 2135 close1() {
2138 this.dialog1 = false; 2136 this.dialog1 = false;
2139 }, 2137 },
2140 submit() { 2138 submit() {
2141 if (this.$refs.form.validate()) { 2139 if (this.$refs.form.validate()) {
2142 let addStudent = { 2140 let addStudent = {
2143 parentId: this.parentId, 2141 parentId: this.parentId,
2144 name: this.addStudents.name, 2142 name: this.addStudents.name,
2145 email: this.addStudents.email, 2143 email: this.addStudents.email,
2146 role: this.addStudents.role, 2144 role: this.addStudents.role,
2147 dob: this.addStudents.date, 2145 dob: this.addStudents.date,
2148 city: this.addStudents.city, 2146 city: this.addStudents.city,
2149 pincode: this.addStudents.pincode, 2147 pincode: this.addStudents.pincode,
2150 country: this.addStudents.country, 2148 country: this.addStudents.country,
2151 permanentAddress: this.addStudents.permanentAddress, 2149 permanentAddress: this.addStudents.permanentAddress,
2152 presentAddress: this.addStudents.presentAddress, 2150 presentAddress: this.addStudents.presentAddress,
2153 mobile: this.addStudents.mobile, 2151 mobile: this.addStudents.mobile,
2154 state: this.addStudents.state, 2152 state: this.addStudents.state,
2155 gender: this.addStudents.gender, 2153 gender: this.addStudents.gender,
2156 fatherName: this.addStudents.fatherName, 2154 fatherName: this.addStudents.fatherName,
2157 fatherCellNo: this.addStudents.fatherCellNo, 2155 fatherCellNo: this.addStudents.fatherCellNo,
2158 motherName: this.addStudents.motherName, 2156 motherName: this.addStudents.motherName,
2159 motherCellNo: this.addStudents.motherCellNo, 2157 motherCellNo: this.addStudents.motherCellNo,
2160 establishmentYear: this.addStudents.establishmentYear, 2158 establishmentYear: this.addStudents.establishmentYear,
2161 classId: this.addStudents.select, 2159 classId: this.addStudents.select,
2162 sectionId: this.addStudents.selectSection, 2160 sectionId: this.addStudents.selectSection,
2163 bloodGroup: this.addStudents.bloodGroup, 2161 bloodGroup: this.addStudents.bloodGroup,
2164 allergies: this.addStudents.allergies, 2162 allergies: this.addStudents.allergies,
2165 medicalNotes: this.addStudents.medicalNotes, 2163 medicalNotes: this.addStudents.medicalNotes,
2166 height: this.addStudents.height, 2164 height: this.addStudents.height,
2167 weight: this.addStudents.weight, 2165 weight: this.addStudents.weight,
2168 upload: this.imageUrl 2166 upload: this.imageUrl
2169 }; 2167 };
2170 this.loading = true; 2168 this.loading = true;
2171 http() 2169 http()
2172 .post("/createStudent", addStudent) 2170 .post("/createStudent", addStudent)
2173 .then(response => { 2171 .then(response => {
2174 console.log(addStudent); 2172 console.log(addStudent);
2175 if ((this.snackbar = true)) { 2173 if ((this.snackbar = true)) {
2176 this.text = "New Student added successfully"; 2174 this.text = "New Student added successfully";
2177 } 2175 }
2178 // this.getStudentList(); 2176 // this.getStudentList();
2179 this.clear(); 2177 this.clear();
2180 this.loading = false; 2178 this.loading = false;
2181 }) 2179 })
2182 .catch(error => { 2180 .catch(error => {
2183 // console.log(error); 2181 // console.log(error);
2184 if ((this.snackbar = true)) { 2182 if ((this.snackbar = true)) {
2185 this.text = error.response.data.message; 2183 this.text = error.response.data.message;
2186 } 2184 }
2187 this.loading = false; 2185 this.loading = false;
2188 }); 2186 });
2189 } 2187 }
2190 }, 2188 },
2191 mail() {}, 2189 mail() {},
2192 download() {}, 2190 download() {},
2193 clear() { 2191 clear() {
2194 this.$refs.form.reset(); 2192 this.$refs.form.reset();
2195 }, 2193 },
2196 save() { 2194 save() {
2197 let editStudent = { 2195 let editStudent = {
2198 studentId: this.editedItem._id, 2196 studentId: this.editedItem._id,
2199 name: this.editedItem.name, 2197 name: this.editedItem.name,
2200 email: this.editedItem.email, 2198 email: this.editedItem.email,
2201 role: this.editedItem.role, 2199 role: this.editedItem.role,
2202 dob: this.editedItem.dob, 2200 dob: this.editedItem.dob,
2203 city: this.editedItem.city, 2201 city: this.editedItem.city,
2204 pincode: this.editedItem.pincode, 2202 pincode: this.editedItem.pincode,
2205 country: this.editedItem.country, 2203 country: this.editedItem.country,
2206 permanentAddress: this.editedItem.permanentAddress, 2204 permanentAddress: this.editedItem.permanentAddress,
2207 presentAddress: this.editedItem.presentAddress, 2205 presentAddress: this.editedItem.presentAddress,
2208 mobile: this.editedItem.mobile, 2206 mobile: this.editedItem.mobile,
2209 state: this.editedItem.state, 2207 state: this.editedItem.state,
2210 gender: this.editedItem.gender, 2208 gender: this.editedItem.gender,
2211 fatherName: this.editedItem.fatherName, 2209 fatherName: this.editedItem.fatherName,
2212 fatherCellNo: this.editedItem.fatherCellNo, 2210 fatherCellNo: this.editedItem.fatherCellNo,
2213 motherName: this.editedItem.motherName, 2211 motherName: this.editedItem.motherName,
2214 motherCellNo: this.editedItem.motherCellNo, 2212 motherCellNo: this.editedItem.motherCellNo,
2215 establishmentYear: this.editedItem.establishmentYear, 2213 establishmentYear: this.editedItem.establishmentYear,
2216 classId: this.editedItem.select, 2214 classId: this.editedItem.select,
2217 sectionId: this.editedItem.selectSection, 2215 sectionId: this.editedItem.selectSection,
2218 bloodGroup: this.editedItem.bloodGroup, 2216 bloodGroup: this.editedItem.bloodGroup,
2219 allergies: this.editedItem.allergies, 2217 allergies: this.editedItem.allergies,
2220 medicalNotes: this.editedItem.medicalNotes, 2218 medicalNotes: this.editedItem.medicalNotes,
2221 height: this.editedItem.height, 2219 height: this.editedItem.height,
2222 weight: this.editedItem.weight 2220 weight: this.editedItem.weight
2223 }; 2221 };
2224 if (this.imageUrl) { 2222 if (this.imageUrl) {
2225 editStudent.upload = this.imageUrl; 2223 editStudent.upload = this.imageUrl;
2226 } 2224 }
2227 console.log("editStudent", editStudent);
2228 http() 2225 http()
2229 .put("/updateStudent", editStudent) 2226 .put("/updateStudent", editStudent)
2230 .then(response => { 2227 .then(response => {
2231 console.log("editStudent", editStudent);
2232 if ((this.snackbar = true)) { 2228 if ((this.snackbar = true)) {
2233 this.text = "Successfully Student Existing User"; 2229 this.text = "Successfully Student Existing User";
2234 } 2230 }
2235 this.findStudents(); 2231 this.findStudents();
2236 this.close(); 2232 this.close();
2237 }) 2233 })
2238 .catch(error => { 2234 .catch(error => {
2239 // console.log(error); 2235 // console.log(error);
2240 if ((this.snackbar = true)) { 2236 if ((this.snackbar = true)) {
2241 this.text = error.response.data.statusText; 2237 this.text = error.response.data.statusText;
2242 } 2238 }
2243 }); 2239 });
2244 }, 2240 },
2245 submitParentDetails() { 2241 submitParentDetails() {
2246 if (this.$refs.parentForm.validate()) { 2242 if (this.$refs.parentForm.validate()) {
2247 let addparentDetails = { 2243 let addparentDetails = {
2248 email: this.parentData.email, 2244 email: this.parentData.email,
2249 fatherName: this.parentData.fatherName, 2245 fatherName: this.parentData.fatherName,
2250 fatherCellNo: this.parentData.fatherCellNo, 2246 fatherCellNo: this.parentData.fatherCellNo,
2251 motherName: this.parentData.motherName, 2247 motherName: this.parentData.motherName,
2252 motherCellNo: this.parentData.motherCellNo, 2248 motherCellNo: this.parentData.motherCellNo,
2253 role: "PARENT" 2249 role: "PARENT"
2254 }; 2250 };
2255 this.loading = true; 2251 this.loading = true;
2256 http() 2252 http()
2257 .post("/createParent", addparentDetails) 2253 .post("/createParent", addparentDetails)
2258 .then(response => { 2254 .then(response => {
2259 this.parentId = response.data.data.id; 2255 this.parentId = response.data.data.id;
2260 this.e2 = 2; 2256 this.e2 = 2;
2261 if ((this.snackbar = true)) { 2257 if ((this.snackbar = true)) {
2262 this.text = "successfully"; 2258 this.text = "successfully";
2263 } 2259 }
2264 // this.getStudentList(); 2260 // this.getStudentList();
2265 this.clear(); 2261 this.clear();
2266 this.loading = false; 2262 this.loading = false;
2267 }) 2263 })
2268 .catch(error => { 2264 .catch(error => {
2269 console.log(error.response.data); 2265 console.log(error.response.data);
2270 if ((this.snackbar = true)) { 2266 if ((this.snackbar = true)) {
2271 this.text = error.response.data.message; 2267 this.text = error.response.data.message;
2272 this.text = error.response.data.statusText; 2268 this.text = error.response.data.statusText;
2273 } 2269 }
2274 this.loading = false; 2270 this.loading = false;
2275 }); 2271 });
2276 } 2272 }
2277 }, 2273 },
2278 getParentDetails() { 2274 getParentDetails() {
2279 if (this.parentData.email) { 2275 if (this.parentData.email) {
2280 http() 2276 http()
2281 .get("getParticularParent", { 2277 .get("getParticularParent", {
2282 params: { email: this.parentData.email }, 2278 params: { email: this.parentData.email },
2283 headers: { 2279 headers: {
2284 Authorization: "Bearer " + this.$store.state.token 2280 Authorization: "Bearer " + this.$store.state.token
2285 } 2281 }
2286 }) 2282 })
2287 .then(response => { 2283 .then(response => {
2288 this.showNext = true; 2284 this.showNext = true;
2289 this.showParent = false; 2285 this.showParent = false;
2290 this.parentData = response.data.data; 2286 this.parentData = response.data.data;
2291 this.parentId = response.data.data._id; 2287 this.parentId = response.data.data._id;
2292 }) 2288 })
2293 .catch(error => { 2289 .catch(error => {
2294 console.log("err====>", error.response.data.message); 2290 console.log("err====>", error.response.data.message);
2295 }); 2291 });
2296 } 2292 }
2297 }, 2293 },
2298 handleDrawerToggle() { 2294 handleDrawerToggle() {
2299 window.getApp.$emit("APP_DRAWER_TOGGLED"); 2295 window.getApp.$emit("APP_DRAWER_TOGGLED");
2300 }, 2296 },
2301 handleFullScreen() { 2297 handleFullScreen() {
2302 Util.toggleFullScreen(); 2298 Util.toggleFullScreen();
2303 } 2299 }
2304 }, 2300 },
2305 mounted() { 2301 mounted() {
2306 // this.getStudentList(); 2302 // this.getStudentList();
2307 var token = this.$store.state.token; 2303 var token = this.$store.state.token;
2308 http() 2304 http()
2309 .get("/getClassesList", { 2305 .get("/getClassesList", {
2310 headers: { Authorization: "Bearer " + token } 2306 headers: { Authorization: "Bearer " + token }
2311 }) 2307 })
2312 .then(response => { 2308 .then(response => {
2313 this.addclass = response.data.data; 2309 this.addclass = response.data.data;
2314 // console.log("getClassesList=====>",this.addclass)
2315 }) 2310 })
2316 .catch(err => { 2311 .catch(err => {
2317 // console.log("err====>", err); 2312 // console.log("err====>", err);
2318 this.$router.replace({ path: "/" }); 2313 this.$router.replace({ path: "/" });
2319 }); 2314 });
2320 }, 2315 },
2321 2316
2322 // console.log("Id",this.$store.state.id) 2317 // console.log("Id",this.$store.state.id)
2323 // console.log("token",this.$store.state.token) 2318 // console.log("token",this.$store.state.token)
2324 computed: { 2319 computed: {
2325 toolbarColor() { 2320 toolbarColor() {
2326 return this.$vuetify.options.extra.mainNav; 2321 return this.$vuetify.options.extra.mainNav;
2327 } 2322 }
2328 } 2323 }
2329 }; 2324 };
2330 </script> 2325 </script>
2331 <style scoped> 2326 <style scoped>
2332 .v-tabs__div { 2327 .v-tabs__div {
2333 text-transform: none; 2328 text-transform: none;
2334 } 2329 }
2335 .v-input__prepend-outer { 2330 .v-input__prepend-outer {
2336 margin-right: 0px !important; 2331 margin-right: 0px !important;
2337 } 2332 }
2338 .v-card__actions .v-btn { 2333 .v-card__actions .v-btn {
2339 margin: 0 15px; 2334 margin: 0 15px;
2340 min-width: 120px; 2335 min-width: 120px;
2341 } 2336 }
2342 .primary { 2337 .primary {
2343 background-color: #aaa !important; 2338 background-color: #aaa !important;
2344 border-color: #aaa !important; 2339 border-color: #aaa !important;
2345 } 2340 }
2346 h4 { 2341 h4 {
2347 background-repeat: no-repeat; 2342 background-repeat: no-repeat;
2348 padding: 8px; 2343 padding: 8px;
2349 margin: auto; 2344 margin: auto;
2350 font-size: 25px; 2345 font-size: 25px;
2351 } 2346 }
2352 #name { 2347 #name {
2353 position: absolute; 2348 position: absolute;
2354 left: 100px; 2349 left: 100px;
2355 top: 17px; 2350 top: 17px;
2356 } 2351 }
2357 #icon { 2352 #icon {
2358 position: absolute; 2353 position: absolute;
2359 right: 8px; 2354 right: 8px;
2360 top: 8px; 2355 top: 8px;
2361 } 2356 }
2362 #m { 2357 #m {
2363 position: relative; 2358 position: relative;
2364 left: 135px; 2359 left: 135px;
2365 top: -15px; 2360 top: -15px;
2366 } 2361 }
2367 #G { 2362 #G {
2368 position: absolute; 2363 position: absolute;
2369 top: 38px; 2364 top: 38px;
2370 color: white; 2365 color: white;
2371 } 2366 }
2372 #bt { 2367 #bt {
2373 position: relative; 2368 position: relative;
2374 top: -20px; 2369 top: -20px;
2375 left: 115px; 2370 left: 115px;
2376 } 2371 }
2377 #e { 2372 #e {
2378 position: relative; 2373 position: relative;
2379 top: 5px; 2374 top: 5px;
2380 right: -30px; 2375 right: -30px;
2381 height: 17px; 2376 height: 17px;
2382 cursor: pointer; 2377 cursor: pointer;
2383 } 2378 }
2384 #d { 2379 #d {
2385 position: relative; 2380 position: relative;
2386 top: 5px; 2381 top: 5px;
2387 right: -70px; 2382 right: -70px;
2388 height: 17px; 2383 height: 17px;
2389 cursor: pointer; 2384 cursor: pointer;
2390 } 2385 }
2391 #td { 2386 #td {
2392 border: 1px solid #dddddd; 2387 border: 1px solid #dddddd;
2393 text-align: left; 2388 text-align: left;
2394 padding: 8px; 2389 padding: 8px;
2395 } 2390 }
2396 #dialog { 2391 #dialog {
2397 height: 550px; 2392 height: 550px;
2398 } 2393 }
2399 .active { 2394 .active {
2400 background-color: black; 2395 background-color: black;
2401 color: white !important; 2396 color: white !important;
2402 } 2397 }
2403 .activebtn { 2398 .activebtn {
2404 color: black !important; 2399 color: black !important;
2405 } 2400 }
2406 #flex { 2401 #flex {
2407 height: 300px; 2402 height: 300px;
2408 } 2403 }
2409 .top { 2404 .top {
2410 margin-top: 100px; 2405 margin-top: 100px;
2411 } 2406 }
2412 .v-tabs__item a { 2407 .v-tabs__item a {
2413 font-size: 16px !important; 2408 font-size: 16px !important;
2414 } 2409 }
2415 @media screen and (max-width: 769px) { 2410 @media screen and (max-width: 769px) {
2416 .top { 2411 .top {
2417 margin-top: 0 !important; 2412 margin-top: 0 !important;
2418 } 2413 }
2419 .userSearch .v-icon { 2414 .userSearch .v-icon {
2420 font-size: 20px !important; 2415 font-size: 20px !important;
2421 margin-left: 20px; 2416 margin-left: 20px;
2422 } 2417 }
2423 } 2418 }
2424 @media screen and (max-width: 380px) { 2419 @media screen and (max-width: 380px) {
2425 .pl-3 { 2420 .pl-3 {
2426 padding-left: 0px !important; 2421 padding-left: 0px !important;
2427 } 2422 }
2428 .right { 2423 .right {
2429 float: none !important; 2424 float: none !important;
2430 } 2425 }
2431 .subheading { 2426 .subheading {
2432 font-size: 14px !important; 2427 font-size: 14px !important;
2433 } 2428 }
2434 .v-card__actions .v-btn { 2429 .v-card__actions .v-btn {
2435 margin: 0 0px; 2430 margin: 0 0px;
2436 min-width: 100px; 2431 min-width: 100px;
2437 } 2432 }
2438 /* .searchIcon .v-icon { 2433 /* .searchIcon .v-icon {
2439 font-size: 20px; 2434 font-size: 20px;
2440 margin-left: 20px; 2435 margin-left: 20px;
2441 } */ 2436 } */
2442 .subheading { 2437 .subheading {
2443 font-size: 12px !important; 2438 font-size: 12px !important;
2444 } 2439 }
2445 h5 { 2440 h5 {
2446 font-size: 13px; 2441 font-size: 13px;
2447 } 2442 }
2448 } 2443 }
2449 .v-icon { 2444 .v-icon {
2450 font-size: 30px; 2445 font-size: 30px;
2451 } 2446 }
2452 @media screen and (min-width: 1270px) { 2447 @media screen and (min-width: 1270px) {
2453 .hide { 2448 .hide {
2454 display: none; 2449 display: none;
2455 } 2450 }
2456 /* } 2451 /* }
2457 @media screen and (max-width: 962px) { 2452 @media screen and (max-width: 962px) {
2458 .imglogo{ 2453 .imglogo{
2459 position: absolute; 2454 position: absolute;
2460 top: 13px; 2455 top: 13px;
2461 left: 13px !important; 2456 left: 13px !important;
2462 width: 70px; 2457 width: 70px;
2463 height: 24px; 2458 height: 24px;
2464 } */ 2459 } */
2465 } 2460 }
2466 @media screen and (max-width: 420px) { 2461 @media screen and (max-width: 420px) {
2467 .userSearch .v-text-field .v-label { 2462 .userSearch .v-text-field .v-label {
2468 line-height: 24px !important; 2463 line-height: 24px !important;
2469 } 2464 }
2470 .userSearch .v-label { 2465 .userSearch .v-label {
2471 font-size: 13px !important; 2466 font-size: 13px !important;
2472 } 2467 }
2473 .v-list__tile { 2468 .v-list__tile {
2474 font-size: 14px; 2469 font-size: 14px;
2475 padding: 0 10px; 2470 padding: 0 10px;
2476 } 2471 }
2477 .name { 2472 .name {
2478 font-size: 15px; 2473 font-size: 15px;
2479 } 2474 }
2480 } 2475 }
2481 </style> 2476 </style>
src/pages/Teachers/teachers.vue
1 <template> 1 <template>
2 <v-app id="pages-dasboard"> 2 <v-app id="pages-dasboard">
3 <v-toolbar class="fixcolors" fixed app> 3 <v-toolbar class="fixcolors" fixed app>
4 <v-toolbar-title class="ml-0 pl-3"> 4 <v-toolbar-title class="ml-0 pl-3">
5 <v-toolbar-side-icon @click.stop="handleDrawerToggle" class="hide"></v-toolbar-side-icon> 5 <v-toolbar-side-icon @click.stop="handleDrawerToggle" class="hide"></v-toolbar-side-icon>
6 </v-toolbar-title> 6 </v-toolbar-title>
7 <!-- ****** SEARCH ALL Teachers ****** --> 7 <!-- ****** SEARCH ALL Teachers ****** -->
8 <v-flex xs7 sm3 class="userSearch"> 8 <v-flex xs7 sm3 class="userSearch">
9 <v-text-field 9 <v-text-field
10 flat 10 flat
11 append-icon="search" 11 append-icon="search"
12 label="Find your Teachers" 12 label="Find your Teachers"
13 v-model="search" 13 v-model="search"
14 color="white" 14 color="white"
15 dark 15 dark
16 ></v-text-field> 16 ></v-text-field>
17 </v-flex> 17 </v-flex>
18 <v-spacer></v-spacer> 18 <v-spacer></v-spacer>
19 <v-menu offset-y origin="center center" :nudge-bottom="10" transition="scale-transition"> 19 <v-menu offset-y origin="center center" :nudge-bottom="10" transition="scale-transition">
20 <v-btn icon large flat slot="activator"> 20 <v-btn icon large flat slot="activator">
21 <v-avatar size="40px"> 21 <v-avatar size="40px">
22 <img src="/static/icon/user.png"> 22 <img src="/static/icon/user.png" />
23 </v-avatar> 23 </v-avatar>
24 </v-btn> 24 </v-btn>
25 <v-list class="pa-0"> 25 <v-list class="pa-0">
26 <v-list-tile 26 <v-list-tile
27 v-for="(item,index) in items" 27 v-for="(item,index) in items"
28 :to="!item.href ? { name: item.name } : null" 28 :to="!item.href ? { name: item.name } : null"
29 :href="item.href" 29 :href="item.href"
30 @click="item.click" 30 @click="item.click"
31 ripple="ripple" 31 ripple="ripple"
32 :disabled="item.disabled" 32 :disabled="item.disabled"
33 :target="item.target" 33 :target="item.target"
34 rel="noopener" 34 rel="noopener"
35 :key="index" 35 :key="index"
36 > 36 >
37 <v-list-tile-action v-if="item.icon"> 37 <v-list-tile-action v-if="item.icon">
38 <v-icon>{{ item.icon }}</v-icon> 38 <v-icon>{{ item.icon }}</v-icon>
39 </v-list-tile-action> 39 </v-list-tile-action>
40 <v-list-tile-content> 40 <v-list-tile-content>
41 <v-list-tile-title>{{ item.title }}</v-list-tile-title> 41 <v-list-tile-title>{{ item.title }}</v-list-tile-title>
42 </v-list-tile-content> 42 </v-list-tile-content>
43 </v-list-tile> 43 </v-list-tile>
44 </v-list> 44 </v-list>
45 </v-menu> 45 </v-menu>
46 </v-toolbar> 46 </v-toolbar>
47 <v-tabs grow slider-color="black"> 47 <v-tabs grow slider-color="black">
48 <v-tab 48 <v-tab
49 ripple 49 ripple
50 @click="activeTab('existing')" 50 @click="activeTab('existing')"
51 v-bind:class="{ active: isActive }" 51 v-bind:class="{ active: isActive }"
52 id="tab" 52 id="tab"
53 class="subheading" 53 class="subheading"
54 >Existing Teachers</v-tab> 54 >Existing Teachers</v-tab>
55 <v-tab 55 <v-tab
56 ripple 56 ripple
57 @click="activeTab('new')" 57 @click="activeTab('new')"
58 v-bind:class="{ active: newActive }" 58 v-bind:class="{ active: newActive }"
59 id="tab1" 59 id="tab1"
60 User 60 User
61 class="subheading" 61 class="subheading"
62 >Add New Teachers</v-tab> 62 >Add New Teachers</v-tab>
63 <!-- ****** EDIT TEACHERS DETAILS ****** --> 63 <!-- ****** EDIT TEACHERS DETAILS ****** -->
64 <v-tab-item> 64 <v-tab-item>
65 <v-snackbar 65 <v-snackbar
66 :timeout="timeout" 66 :timeout="timeout"
67 :top="y === 'top'" 67 :top="y === 'top'"
68 :right="x === 'right'" 68 :right="x === 'right'"
69 :vertical="mode === 'vertical'" 69 :vertical="mode === 'vertical'"
70 v-model="snackbar" 70 v-model="snackbar"
71 color="success" 71 color="success"
72 >{{ text }}</v-snackbar> 72 >{{ text }}</v-snackbar>
73 <v-dialog v-model="dialog" max-width="1100px" scrollable> 73 <v-dialog v-model="dialog" max-width="1100px" scrollable>
74 <v-card flat> 74 <v-card flat>
75 <v-toolbar color="grey lighten-2" flat> 75 <v-toolbar color="grey lighten-2" flat>
76 <v-spacer></v-spacer> 76 <v-spacer></v-spacer>
77 <v-toolbar-title>Edit Teacher Profile</v-toolbar-title> 77 <v-toolbar-title>Edit Teacher Profile</v-toolbar-title>
78 <v-spacer></v-spacer> 78 <v-spacer></v-spacer>
79 </v-toolbar> 79 </v-toolbar>
80 <v-card-text style="height: 800px;"> 80 <v-card-text style="height: 800px;">
81 <v-form ref="form"> 81 <v-form ref="form">
82 <v-container fluid> 82 <v-container fluid>
83 <v-layout> 83 <v-layout>
84 <v-flex 84 <v-flex
85 xs12 85 xs12
86 class="text-xs-center text-sm-center text-md-center text-lg-center my-4 mr-4" 86 class="text-xs-center text-sm-center text-md-center text-lg-center my-4 mr-4"
87 > 87 >
88 <v-avatar size="160px"> 88 <v-avatar size="160px">
89 <img src="/static/icon/user.png" v-if="!editedItem.profilePicUrl && !imageUrl">
90 <img :src="editedItem.profilePicUrl" v-else-if="editedItem.profilePicUrl && !imageUrl">
91 <img 89 <img
92 v-if="imageUrl" 90 src="/static/icon/user.png"
93 :src="imageUrl" 91 v-if="!editedItem.profilePicUrl && !imageUrl"
94 height="150" 92 />
95 style="border-radius:50%; width:200px" 93 <img
96 > 94 :src="editedItem.profilePicUrl"
95 v-else-if="editedItem.profilePicUrl && !imageUrl"
96 />
97 <img
98 v-if="imageUrl"
99 :src="imageUrl"
100 height="150"
101 style="border-radius:50%; width:200px"
102 />
97 </v-avatar> 103 </v-avatar>
98 <input 104 <input
99 type="file" 105 type="file"
100 style="display:none" 106 style="display:none"
101 ref="image" 107 ref="image"
102 accept="image/*" 108 accept="image/*"
103 @change="onFilePicked" 109 @change="onFilePicked"
104 > 110 />
105 </v-flex> 111 </v-flex>
106 </v-layout> 112 </v-layout>
107 <v-layout> 113 <v-layout>
108 <v-flex xs12 sm6> 114 <v-flex xs12 sm6>
109 <v-layout> 115 <v-layout>
110 <v-flex xs4 class="pt-4 subheading"> 116 <v-flex xs4 class="pt-4 subheading">
111 <label class="right">Full Name:</label> 117 <label class="right">Full Name:</label>
112 </v-flex> 118 </v-flex>
113 <v-flex xs8 class="ml-3"> 119 <v-flex xs8 class="ml-3">
114 <v-text-field 120 <v-text-field
115 v-model="editedItem.name" 121 v-model="editedItem.name"
116 placeholder="fill your full Name" 122 placeholder="fill your full Name"
117 name="name" 123 name="name"
118 type="text" 124 type="text"
119 required 125 required
120 ></v-text-field> 126 ></v-text-field>
121 </v-flex> 127 </v-flex>
122 </v-layout> 128 </v-layout>
123 </v-flex> 129 </v-flex>
124 <v-flex xs12 sm6> 130 <v-flex xs12 sm6>
125 <v-layout> 131 <v-layout>
126 <v-flex xs4 class="pt-4 subheading"> 132 <v-flex xs4 class="pt-4 subheading">
127 <label class="right">Email ID:</label> 133 <label class="right">Email ID:</label>
128 </v-flex> 134 </v-flex>
129 <v-flex xs8 class="ml-3"> 135 <v-flex xs8 class="ml-3">
130 <v-text-field 136 <v-text-field
131 placeholder="fill your email" 137 placeholder="fill your email"
132 v-model="editedItem.email" 138 v-model="editedItem.email"
133 type="text" 139 type="text"
134 name="email" 140 name="email"
135 required 141 required
136 ></v-text-field> 142 ></v-text-field>
137 </v-flex> 143 </v-flex>
138 </v-layout> 144 </v-layout>
139 </v-flex> 145 </v-flex>
140 </v-layout> 146 </v-layout>
141 <v-layout> 147 <v-layout>
142 <v-flex xs12 sm6> 148 <v-flex xs12 sm6>
143 <v-layout> 149 <v-layout>
144 <v-flex xs4 class="pt-4 subheading"> 150 <v-flex xs4 class="pt-4 subheading">
145 <label class="right">Date of Birth:</label> 151 <label class="right">Date of Birth:</label>
146 </v-flex> 152 </v-flex>
147 <v-flex xs8 class="ml-3"> 153 <v-flex xs8 class="ml-3">
148 <v-menu 154 <v-menu
149 ref="menu" 155 ref="menu"
150 :close-on-content-click="false" 156 :close-on-content-click="false"
151 v-model="menu2" 157 v-model="menu2"
152 :nudge-right="40" 158 :nudge-right="40"
153 lazy 159 lazy
154 transition="scale-transition" 160 transition="scale-transition"
155 offset-y 161 offset-y
156 full-width 162 full-width
157 min-width="290px" 163 min-width="290px"
158 > 164 >
159 <v-text-field 165 <v-text-field
160 slot="activator" 166 slot="activator"
161 v-model="editedItem.dob" 167 v-model="editedItem.dob"
162 placeholder="Select date" 168 placeholder="Select date"
163 ></v-text-field> 169 ></v-text-field>
164 <v-date-picker 170 <v-date-picker
165 ref="picker" 171 ref="picker"
166 v-model="editedItem.dob" 172 v-model="editedItem.dob"
167 :max="new Date().toISOString().substr(0, 10)" 173 :max="new Date().toISOString().substr(0, 10)"
168 min="1950-01-01" 174 min="1950-01-01"
169 @input="menu2 = false" 175 @input="menu2 = false"
170 ></v-date-picker> 176 ></v-date-picker>
171 </v-menu> 177 </v-menu>
172 </v-flex> 178 </v-flex>
173 </v-layout> 179 </v-layout>
174 </v-flex> 180 </v-flex>
175 <v-flex xs12 sm6> 181 <v-flex xs12 sm6>
176 <v-layout> 182 <v-layout>
177 <v-flex xs4 class="pt-4 subheading"> 183 <v-flex xs4 class="pt-4 subheading">
178 <label class="right">City:</label> 184 <label class="right">City:</label>
179 </v-flex> 185 </v-flex>
180 <v-flex xs8 class="ml-3"> 186 <v-flex xs8 class="ml-3">
181 <v-text-field 187 <v-text-field
182 v-model="editedItem.city" 188 v-model="editedItem.city"
183 placeholder="fill your City Name" 189 placeholder="fill your City Name"
184 name="City" 190 name="City"
185 type="text" 191 type="text"
186 required 192 required
187 ></v-text-field> 193 ></v-text-field>
188 </v-flex> 194 </v-flex>
189 </v-layout> 195 </v-layout>
190 </v-flex> 196 </v-flex>
191 </v-layout> 197 </v-layout>
192 <v-layout> 198 <v-layout>
193 <v-flex xs12 sm6> 199 <v-flex xs12 sm6>
194 <v-layout> 200 <v-layout>
195 <v-flex xs4 class="pt-4 subheading"> 201 <v-flex xs4 class="pt-4 subheading">
196 <label class="right">State:</label> 202 <label class="right">State:</label>
197 </v-flex> 203 </v-flex>
198 <v-flex xs8 class="ml-3"> 204 <v-flex xs8 class="ml-3">
199 <v-text-field 205 <v-text-field
200 v-model="editedItem.state" 206 v-model="editedItem.state"
201 placeholder="fill your State Name" 207 placeholder="fill your State Name"
202 name="state" 208 name="state"
203 type="text" 209 type="text"
204 required 210 required
205 ></v-text-field> 211 ></v-text-field>
206 </v-flex> 212 </v-flex>
207 </v-layout> 213 </v-layout>
208 </v-flex> 214 </v-flex>
209 <v-flex xs12 sm6> 215 <v-flex xs12 sm6>
210 <v-layout> 216 <v-layout>
211 <v-flex xs4 class="pt-4 subheading"> 217 <v-flex xs4 class="pt-4 subheading">
212 <label class="right">PinCode:</label> 218 <label class="right">PinCode:</label>
213 </v-flex> 219 </v-flex>
214 <v-flex xs8 class="ml-3"> 220 <v-flex xs8 class="ml-3">
215 <v-text-field 221 <v-text-field
216 v-model="editedItem.pincode" 222 v-model="editedItem.pincode"
217 placeholder="fill your pincode" 223 placeholder="fill your pincode"
218 name="pincode" 224 name="pincode"
219 type="number" 225 type="number"
220 required 226 required
221 ></v-text-field> 227 ></v-text-field>
222 </v-flex> 228 </v-flex>
223 </v-layout> 229 </v-layout>
224 </v-flex> 230 </v-flex>
225 </v-layout> 231 </v-layout>
226 <v-layout> 232 <v-layout>
227 <v-flex xs12 sm6> 233 <v-flex xs12 sm6>
228 <v-layout> 234 <v-layout>
229 <v-flex xs4 class="pt-4 subheading"> 235 <v-flex xs4 class="pt-4 subheading">
230 <label class="right">Mobile NO:</label> 236 <label class="right">Mobile NO:</label>
231 </v-flex> 237 </v-flex>
232 <v-flex xs8 class="ml-3"> 238 <v-flex xs8 class="ml-3">
233 <v-text-field 239 <v-text-field
234 v-model="editedItem.mobileNo" 240 v-model="editedItem.mobileNo"
235 placeholder="fill your MobileNo" 241 placeholder="fill your MobileNo"
236 name="mobileNo" 242 name="mobileNo"
237 type="number" 243 type="number"
238 required 244 required
239 ></v-text-field> 245 ></v-text-field>
240 </v-flex> 246 </v-flex>
241 </v-layout> 247 </v-layout>
242 </v-flex> 248 </v-flex>
243 <v-flex xs12 sm6> 249 <v-flex xs12 sm6>
244 <v-layout> 250 <v-layout>
245 <v-flex xs4 class="pt-4 subheading"> 251 <v-flex xs4 class="pt-4 subheading">
246 <label class="right">Select Country:</label> 252 <label class="right">Select Country:</label>
247 </v-flex> 253 </v-flex>
248 <v-flex xs8 class="ml-3"> 254 <v-flex xs8 class="ml-3">
249 <v-autocomplete 255 <v-autocomplete
250 v-model="editedItem.country" 256 v-model="editedItem.country"
251 :items="countries" 257 :items="countries"
252 placeholder="Select Country Name" 258 placeholder="Select Country Name"
253 required 259 required
254 ></v-autocomplete> 260 ></v-autocomplete>
255 </v-flex> 261 </v-flex>
256 </v-layout> 262 </v-layout>
257 </v-flex> 263 </v-flex>
258 </v-layout> 264 </v-layout>
259 <v-layout> 265 <v-layout>
260 <v-flex xs12 sm6> 266 <v-flex xs12 sm6>
261 <v-layout> 267 <v-layout>
262 <v-flex xs4 class="pt-4 subheading"> 268 <v-flex xs4 class="pt-4 subheading">
263 <label class="right">Join Date:</label> 269 <label class="right">Join Date:</label>
264 </v-flex> 270 </v-flex>
265 <v-flex xs8 class="ml-3"> 271 <v-flex xs8 class="ml-3">
266 <v-menu 272 <v-menu
267 ref="menu" 273 ref="menu"
268 :close-on-content-click="false" 274 :close-on-content-click="false"
269 v-model="menu3" 275 v-model="menu3"
270 :nudge-right="40" 276 :nudge-right="40"
271 lazy 277 lazy
272 transition="scale-transition" 278 transition="scale-transition"
273 offset-y 279 offset-y
274 full-width 280 full-width
275 min-width="290px" 281 min-width="290px"
276 > 282 >
277 <v-text-field 283 <v-text-field
278 slot="activator" 284 slot="activator"
279 v-model="editedItem.joinDate" 285 v-model="editedItem.joinDate"
280 placeholder="Select date" 286 placeholder="Select date"
281 ></v-text-field> 287 ></v-text-field>
282 <v-date-picker 288 <v-date-picker
283 ref="picker" 289 ref="picker"
284 v-model="editedItem.joinDate" 290 v-model="editedItem.joinDate"
285 :max="new Date().toISOString().substr(0, 10)" 291 :max="new Date().toISOString().substr(0, 10)"
286 min="1950-01-01" 292 min="1950-01-01"
287 @input="menu3 = false" 293 @input="menu3 = false"
288 ></v-date-picker> 294 ></v-date-picker>
289 </v-menu> 295 </v-menu>
290 </v-flex> 296 </v-flex>
291 </v-layout> 297 </v-layout>
292 </v-flex> 298 </v-flex>
293 <v-flex xs12 sm6> 299 <v-flex xs12 sm6>
294 <v-layout> 300 <v-layout>
295 <v-flex xs4 class="pt-4 subheading"> 301 <v-flex xs4 class="pt-4 subheading">
296 <label class="right">Uplaod Image:</label> 302 <label class="right">Uplaod Image:</label>
297 </v-flex> 303 </v-flex>
298 <v-flex xs8 class="ml-3"> 304 <v-flex xs8 class="ml-3">
299 <v-text-field 305 <v-text-field
300 label="Select Image" 306 label="Select Image"
301 @click="pickFile" 307 @click="pickFile"
302 v-model="imageName" 308 v-model="imageName"
303 append-icon="attach_file" 309 append-icon="attach_file"
304 ></v-text-field> 310 ></v-text-field>
305 </v-flex> 311 </v-flex>
306 </v-layout> 312 </v-layout>
307 </v-flex> 313 </v-flex>
308 </v-layout> 314 </v-layout>
309 <v-layout> 315 <v-layout>
310 <v-flex xs12 sm12> 316 <v-flex xs12 sm12>
311 <v-layout> 317 <v-layout>
312 <v-flex xs3 class="pt-4 subheading pl-3" style="max-width: 17%;"> 318 <v-flex xs3 class="pt-4 subheading pl-3" style="max-width: 17%;">
313 <label class>Present Address:</label> 319 <label class>Present Address:</label>
314 </v-flex> 320 </v-flex>
315 <v-flex xs12> 321 <v-flex xs12>
316 <v-text-field 322 <v-text-field
317 name="input-4-3" 323 name="input-4-3"
318 v-model="editedItem.presentAddress" 324 v-model="editedItem.presentAddress"
319 placeholder="fill Your present Address" 325 placeholder="fill Your present Address"
320 required 326 required
321 ></v-text-field> 327 ></v-text-field>
322 </v-flex> 328 </v-flex>
323 </v-layout> 329 </v-layout>
324 </v-flex> 330 </v-flex>
325 <v-flex xs12 sm12> 331 <v-flex xs12 sm12>
326 <v-layout> 332 <v-layout>
327 <v-flex xs3 class="pt-4 subheading" style="max-width: 17%;"> 333 <v-flex xs3 class="pt-4 subheading" style="max-width: 17%;">
328 <label>Permanent Address:</label> 334 <label>Permanent Address:</label>
329 </v-flex> 335 </v-flex>
330 <v-flex xs12> 336 <v-flex xs12>
331 <v-text-field 337 <v-text-field
332 name="input-4-3" 338 name="input-4-3"
333 v-model="editedItem.permanentAddress" 339 v-model="editedItem.permanentAddress"
334 placeholder="fill Your Permanent Address" 340 placeholder="fill Your Permanent Address"
335 required 341 required
336 ></v-text-field> 342 ></v-text-field>
337 </v-flex> 343 </v-flex>
338 </v-layout> 344 </v-layout>
339 </v-flex> 345 </v-flex>
340 </v-layout> 346 </v-layout>
341 <v-layout> 347 <v-layout>
342 <v-flex xs12 sm12> 348 <v-flex xs12 sm12>
343 <v-card-actions> 349 <v-card-actions>
344 <v-btn round dark @click.native="close">Cancel</v-btn> 350 <v-btn round dark @click.native="close">Cancel</v-btn>
345 <v-spacer></v-spacer> 351 <v-spacer></v-spacer>
346 <v-btn round dark :loading="loading" @click="save">Save</v-btn> 352 <v-btn round dark :loading="loading" @click="save">Save</v-btn>
347 </v-card-actions> 353 </v-card-actions>
348 </v-flex> 354 </v-flex>
349 </v-layout> 355 </v-layout>
350 </v-container> 356 </v-container>
351 </v-form> 357 </v-form>
352 </v-card-text> 358 </v-card-text>
353 </v-card> 359 </v-card>
354 </v-dialog> 360 </v-dialog>
355 361
356 <!-- ****** PROFILE VIEW TEACHERS DETAILS ****** --> 362 <!-- ****** PROFILE VIEW TEACHERS DETAILS ****** -->
357 363
358 <v-dialog v-model="dialog1" max-width="600px" scrollable> 364 <v-dialog v-model="dialog1" max-width="600px" scrollable>
359 <v-card> 365 <v-card>
360 <v-toolbar color="grey lighten-2" flat> 366 <v-toolbar color="grey lighten-2" flat>
361 <v-spacer></v-spacer> 367 <v-spacer></v-spacer>
362 <v-toolbar-title><h3>Teacher Profile</h3></v-toolbar-title> 368 <v-toolbar-title>
363 <v-spacer></v-spacer> 369 <h3>Teacher Profile</h3>
364 <v-icon @click="close1">close</v-icon> 370 </v-toolbar-title>
365 </v-toolbar> 371 <v-spacer></v-spacer>
372 <v-icon @click="close1">close</v-icon>
373 </v-toolbar>
366 <v-card-text style="height: 700px;"> 374 <v-card-text style="height: 700px;">
367 <v-container grid-list-md> 375 <v-container grid-list-md>
368 <v-layout wrap> 376 <v-layout wrap>
369 <v-flex> 377 <v-flex>
370 <v-flex align-center justify-center layout text-xs-center> 378 <v-flex align-center justify-center layout text-xs-center>
371 <v-avatar size="160px"> 379 <v-avatar size="160px">
372 <img src="/static/icon/user.png" v-if="!editedItem.profilePicUrl"> 380 <img src="/static/icon/user.png" v-if="!editedItem.profilePicUrl" />
373 <img :src="editedItem.profilePicUrl" v-else-if="editedItem.profilePicUrl"> 381 <img :src="editedItem.profilePicUrl" v-else-if="editedItem.profilePicUrl" />
374 </v-avatar> 382 </v-avatar>
375 </v-flex> 383 </v-flex>
376 <v-layout> 384 <v-layout>
377 <v-flex xs5 sm6> 385 <v-flex xs5 sm6>
378 <h5 class="right my-1">Full Name:</h5> 386 <h5 class="right my-1">Full Name:</h5>
379 </v-flex> 387 </v-flex>
380 <v-flex sm6 xs8> 388 <v-flex sm6 xs8>
381 <h5 class="my-1">{{ editedItem.name }}</h5> 389 <h5 class="my-1">{{ editedItem.name }}</h5>
382 </v-flex> 390 </v-flex>
383 </v-layout> 391 </v-layout>
384 <v-layout> 392 <v-layout>
385 <v-flex xs5 sm6> 393 <v-flex xs5 sm6>
386 <h5 class="right my-1">Email:</h5> 394 <h5 class="right my-1">Email:</h5>
387 </v-flex> 395 </v-flex>
388 <v-flex sm6 xs8> 396 <v-flex sm6 xs8>
389 <h5 class="my-1">{{ editedItem.email }}</h5> 397 <h5 class="my-1">{{ editedItem.email }}</h5>
390 </v-flex> 398 </v-flex>
391 </v-layout> 399 </v-layout>
392 <v-layout> 400 <v-layout>
393 <v-flex xs5 sm6> 401 <v-flex xs5 sm6>
394 <h5 class="right my-1">City:</h5> 402 <h5 class="right my-1">City:</h5>
395 </v-flex> 403 </v-flex>
396 <v-flex sm6 xs8> 404 <v-flex sm6 xs8>
397 <h5 class="my-1">{{ editedItem.city }}</h5> 405 <h5 class="my-1">{{ editedItem.city }}</h5>
398 </v-flex> 406 </v-flex>
399 </v-layout> 407 </v-layout>
400 <v-layout> 408 <v-layout>
401 <v-flex xs5 sm6> 409 <v-flex xs5 sm6>
402 <h5 class="right my-1">State:</h5> 410 <h5 class="right my-1">State:</h5>
403 </v-flex> 411 </v-flex>
404 <v-flex sm6 xs8> 412 <v-flex sm6 xs8>
405 <h5 class="my-1">{{ editedItem.state }}</h5> 413 <h5 class="my-1">{{ editedItem.state }}</h5>
406 </v-flex> 414 </v-flex>
407 </v-layout> 415 </v-layout>
408 <v-layout> 416 <v-layout>
409 <v-flex xs5 sm6> 417 <v-flex xs5 sm6>
410 <h5 class="right my-1">Country:</h5> 418 <h5 class="right my-1">Country:</h5>
411 </v-flex> 419 </v-flex>
412 <v-flex sm6 xs8> 420 <v-flex sm6 xs8>
413 <h5 class="my-1">{{ editedItem.country }}</h5> 421 <h5 class="my-1">{{ editedItem.country }}</h5>
414 </v-flex> 422 </v-flex>
415 </v-layout> 423 </v-layout>
416 <v-layout> 424 <v-layout>
417 <v-flex xs5 sm6> 425 <v-flex xs5 sm6>
418 <h5 class="right my-1">Pincode:</h5> 426 <h5 class="right my-1">Pincode:</h5>
419 </v-flex> 427 </v-flex>
420 <v-flex sm6 xs8> 428 <v-flex sm6 xs8>
421 <h5 class="my-1">{{ editedItem.pincode }}</h5> 429 <h5 class="my-1">{{ editedItem.pincode }}</h5>
422 </v-flex> 430 </v-flex>
423 </v-layout> 431 </v-layout>
424 <v-layout> 432 <v-layout>
425 <v-flex xs5 sm6> 433 <v-flex xs5 sm6>
426 <h5 class="right my-1">Mobile No:</h5> 434 <h5 class="right my-1">Mobile No:</h5>
427 </v-flex> 435 </v-flex>
428 <v-flex sm6 xs8> 436 <v-flex sm6 xs8>
429 <h5 class="my-1">{{ editedItem.mobileNo }}</h5> 437 <h5 class="my-1">{{ editedItem.mobileNo }}</h5>
430 </v-flex> 438 </v-flex>
431 </v-layout> 439 </v-layout>
432 <v-layout> 440 <v-layout>
433 <v-flex xs5 sm6> 441 <v-flex xs5 sm6>
434 <h5 class="right my-1">Join Date:</h5> 442 <h5 class="right my-1">Join Date:</h5>
435 </v-flex> 443 </v-flex>
436 <v-flex sm6 xs8> 444 <v-flex sm6 xs8>
437 <h5 class="my-1">{{ dates(editedItem.joinDate) }}</h5> 445 <h5 class="my-1">{{ dates(editedItem.joinDate) }}</h5>
438 </v-flex> 446 </v-flex>
439 </v-layout> 447 </v-layout>
440 <v-layout> 448 <v-layout>
441 <v-flex xs5 sm6> 449 <v-flex xs5 sm6>
442 <h5 class="right my-1">Date Of Birth:</h5> 450 <h5 class="right my-1">Date Of Birth:</h5>
443 </v-flex> 451 </v-flex>
444 <v-flex sm6 xs8> 452 <v-flex sm6 xs8>
445 <h5 class="my-1">{{ dates(editedItem.dob) }}</h5> 453 <h5 class="my-1">{{ dates(editedItem.dob) }}</h5>
446 </v-flex> 454 </v-flex>
447 </v-layout> 455 </v-layout>
448 <v-layout> 456 <v-layout>
449 <v-flex xs6 sm6 > 457 <v-flex xs6 sm6>
450 <h5 class="right my-1">Permanent Address:</h5> 458 <h5 class="right my-1">Permanent Address:</h5>
451 </v-flex> 459 </v-flex>
452 <v-flex sm6 xs8> 460 <v-flex sm6 xs8>
453 <h5 class="my-1">{{ editedItem.permanentAddress }}</h5> 461 <h5 class="my-1">{{ editedItem.permanentAddress }}</h5>
454 </v-flex> 462 </v-flex>
455 </v-layout> 463 </v-layout>
456 <v-layout> 464 <v-layout>
457 <v-flex xs6 sm6 > 465 <v-flex xs6 sm6>
458 <h5 class="right my-1">present Address:</h5> 466 <h5 class="right my-1">present Address:</h5>
459 </v-flex> 467 </v-flex>
460 <v-flex sm6 xs8> 468 <v-flex sm6 xs8>
461 <h5 class="my-1">{{ editedItem.presentAddress }}</h5> 469 <h5 class="my-1">{{ editedItem.presentAddress }}</h5>
462 </v-flex> 470 </v-flex>
463 </v-layout> 471 </v-layout>
464 </v-flex> 472 </v-flex>
465 </v-layout> 473 </v-layout>
466 </v-container> 474 </v-container>
467 </v-card-text> 475 </v-card-text>
468 </v-card> 476 </v-card>
469 </v-dialog> 477 </v-dialog>
470 <v-snackbar 478 <v-snackbar
471 :timeout="timeout" 479 :timeout="timeout"
472 :top="y === 'top'" 480 :top="y === 'top'"
473 :right="x === 'right'" 481 :right="x === 'right'"
474 :vertical="mode === 'vertical'" 482 :vertical="mode === 'vertical'"
475 v-model="snackbar" 483 v-model="snackbar"
476 color="success" 484 color="success"
477 >{{ text }}</v-snackbar> 485 >{{ text }}</v-snackbar>
478 486
479 <!-- ****** EXISTING-Teachers TABLE DATA****** --> 487 <!-- ****** EXISTING-Teachers TABLE DATA****** -->
480 488
481 <v-data-table 489 <v-data-table
482 :headers="headers" 490 :headers="headers"
483 :items="desserts" 491 :items="desserts"
484 :pagination.sync="pagination" 492 :pagination.sync="pagination"
485 :search="search" 493 :search="search"
486 > 494 >
487 <template slot="items" slot-scope="props"> 495 <template slot="items" slot-scope="props">
488 <td id="td" class="text-xs-center">{{ props.index}}</td> 496 <td id="td" class="text-xs-center">{{ props.index}}</td>
489 <td id="td" class="text-xs-center"> 497 <td id="td" class="text-xs-center">
490 <v-avatar><img :src="props.item.profilePicUrl" v-if="props.item.profilePicUrl"> 498 <v-avatar>
491 <img src="/static/icon/user.png" v-else-if="!props.item.profilePicUrl"> 499 <img :src="props.item.profilePicUrl" v-if="props.item.profilePicUrl" />
492 </v-avatar></td> 500 <img src="/static/icon/user.png" v-else-if="!props.item.profilePicUrl" />
501 </v-avatar>
502 </td>
493 <td id="td" class="text-xs-center">{{ props.item.name}}</td> 503 <td id="td" class="text-xs-center">{{ props.item.name}}</td>
494 <td id="td" class="text-xs-center">{{ props.item.email }}</td> 504 <td id="td" class="text-xs-center">{{ props.item.email }}</td>
495 <td id="td" class="text-xs-center">{{ dates(props.item.dob) }}</td> 505 <td id="td" class="text-xs-center">{{ dates(props.item.dob) }}</td>
496 <td id="td" class="text-xs-center">{{ dates(props.item.joinDate)}}</td> 506 <td id="td" class="text-xs-center">{{ dates(props.item.joinDate)}}</td>
497 <td id="td" class="text-xs-center">{{ props.item.mobileNo }}</td> 507 <td id="td" class="text-xs-center">{{ props.item.mobileNo }}</td>
498 <td class="text-xs-center"> 508 <td class="text-xs-center">
499 <span> 509 <span>
500 <img 510 <img
501 style="cursor:pointer; width:25px; height:18px; " 511 style="cursor:pointer; width:25px; height:18px; "
502 class="mr-5" 512 class="mr-5"
503 @click="profile(props.item)" 513 @click="profile(props.item)"
504 src="/static/icon/eye1.png" 514 src="/static/icon/eye1.png"
505 > 515 />
506 <img 516 <img
507 style="cursor:pointer; width:20px; height:18px; " 517 style="cursor:pointer; width:20px; height:18px; "
508 class="mr-5" 518 class="mr-5"
509 @click="editItem(props.item)" 519 @click="editItem(props.item)"
510 src="/static/icon/edit1.png" 520 src="/static/icon/edit1.png"
511 > 521 />
512 <img 522 <img
513 style="cursor:pointer; height:20px; " 523 style="cursor:pointer; height:20px; "
514 class="mr-5" 524 class="mr-5"
515 @click="deleteItem(props.item)" 525 @click="deleteItem(props.item)"
516 src="/static/icon/delete1.png" 526 src="/static/icon/delete1.png"
517 > 527 />
518 </span> 528 </span>
519 </td> 529 </td>
520 </template> 530 </template>
521 <v-alert 531 <v-alert
522 slot="no-results" 532 slot="no-results"
523 :value="true" 533 :value="true"
524 color="error" 534 color="error"
525 icon="warning" 535 icon="warning"
526 >Your search for "{{ search }}" found no results.</v-alert> 536 >Your search for "{{ search }}" found no results.</v-alert>
527 </v-data-table> 537 </v-data-table>
528 </v-tab-item> 538 </v-tab-item>
529 539
530 <!-- ****** Add Teachers Data****** --> 540 <!-- ****** Add Teachers Data****** -->
531 <v-tab-item> 541 <v-tab-item>
532 <v-container> 542 <v-container>
533 <v-snackbar 543 <v-snackbar
534 :timeout="timeout" 544 :timeout="timeout"
535 :top="y === 'top'" 545 :top="y === 'top'"
536 :right="x === 'right'" 546 :right="x === 'right'"
537 :vertical="mode === 'vertical'" 547 :vertical="mode === 'vertical'"
538 v-model="snackbar" 548 v-model="snackbar"
539 color="success" 549 color="success"
540 >{{ text }}</v-snackbar> 550 >{{ text }}</v-snackbar>
541 <v-flex xs12 sm12 class="my-4"> 551 <v-flex xs12 sm12 class="my-4">
542 <v-card flat> 552 <v-card flat>
543 <v-form ref="form" v-model="valid" lazy-validation> 553 <v-form ref="form" v-model="valid" lazy-validation>
544 <v-container fluid> 554 <v-container fluid>
545 <v-layout> 555 <v-layout>
546 <v-flex 556 <v-flex
547 xs12 557 xs12
548 class="text-xs-center text-sm-center text-md-center text-lg-center my-4 mr-4" 558 class="text-xs-center text-sm-center text-md-center text-lg-center my-4 mr-4"
549 > 559 >
550 <v-avatar size="100px"> 560 <v-avatar size="100px">
551 <img src="/static/icon/user.png" v-if="!imageUrl"> 561 <img src="/static/icon/user.png" v-if="!imageUrl" />
552 </v-avatar> 562 </v-avatar>
553 <img 563 <img
554 :src="imageUrl" 564 :src="imageUrl"
555 height="150" 565 height="150"
556 v-if="imageUrl" 566 v-if="imageUrl"
557 style="border-radius:50%; width:200px" 567 style="border-radius:50%; width:200px"
558 > 568 />
559 </v-flex> 569 </v-flex>
560 </v-layout> 570 </v-layout>
561 <v-layout> 571 <v-layout>
562 <v-flex xs12 sm6> 572 <v-flex xs12 sm6>
563 <v-layout> 573 <v-layout>
564 <v-flex xs4 class="pt-4 subheading"> 574 <v-flex xs4 class="pt-4 subheading">
565 <label class="right">Full Name:</label> 575 <label class="right">Full Name:</label>
566 </v-flex> 576 </v-flex>
567 <v-flex xs8 class="ml-3"> 577 <v-flex xs8 class="ml-3">
568 <v-text-field 578 <v-text-field
569 v-model="addTeachers.name" 579 v-model="addTeachers.name"
570 placeholder="fill your full Name" 580 placeholder="fill your full Name"
571 name="name" 581 name="name"
572 type="text" 582 type="text"
573 :rules="nameRules" 583 :rules="nameRules"
574 required 584 required
575 ></v-text-field> 585 ></v-text-field>
576 </v-flex> 586 </v-flex>
577 </v-layout> 587 </v-layout>
578 </v-flex> 588 </v-flex>
579 <v-flex xs12 sm6> 589 <v-flex xs12 sm6>
580 <v-layout> 590 <v-layout>
581 <v-flex xs4 class="pt-4 subheading"> 591 <v-flex xs4 class="pt-4 subheading">
582 <label class="right">Email ID:</label> 592 <label class="right">Email ID:</label>
583 </v-flex> 593 </v-flex>
584 <v-flex xs8 class="ml-3"> 594 <v-flex xs8 class="ml-3">
585 <v-text-field 595 <v-text-field
586 placeholder="fill your email" 596 placeholder="fill your email"
587 :rules="emailRules" 597 :rules="emailRules"
588 v-model="addTeachers.email" 598 v-model="addTeachers.email"
589 type="text" 599 type="text"
590 name="email" 600 name="email"
591 required 601 required
592 ></v-text-field> 602 ></v-text-field>
593 </v-flex> 603 </v-flex>
594 </v-layout> 604 </v-layout>
595 </v-flex> 605 </v-flex>
596 </v-layout> 606 </v-layout>
597 <v-layout> 607 <v-layout>
598 <v-flex xs12 sm6> 608 <v-flex xs12 sm6>
599 <v-layout> 609 <v-layout>
600 <v-flex xs4 class="pt-4 subheading"> 610 <v-flex xs4 class="pt-4 subheading">
601 <label class="right">Date of Birth:</label> 611 <label class="right">Date of Birth:</label>
602 </v-flex> 612 </v-flex>
603 <v-flex xs8 class="ml-3"> 613 <v-flex xs8 class="ml-3">
604 <v-menu 614 <v-menu
605 ref="menu" 615 ref="menu"
606 :close-on-content-click="false" 616 :close-on-content-click="false"
607 v-model="menu" 617 v-model="menu"
608 :nudge-right="40" 618 :nudge-right="40"
609 lazy 619 lazy
610 transition="scale-transition" 620 transition="scale-transition"
611 offset-y 621 offset-y
612 full-width 622 full-width
613 min-width="290px" 623 min-width="290px"
614 > 624 >
615 <v-text-field 625 <v-text-field
616 slot="activator" 626 slot="activator"
617 :rules="dateRules" 627 :rules="dateRules"
618 v-model="addTeachers.date" 628 v-model="addTeachers.date"
619 placeholder="Select date" 629 placeholder="Select date"
620 ></v-text-field> 630 ></v-text-field>
621 <v-date-picker 631 <v-date-picker
622 ref="picker" 632 ref="picker"
623 v-model="addTeachers.date" 633 v-model="addTeachers.date"
624 :max="new Date().toISOString().substr(0, 10)" 634 :max="new Date().toISOString().substr(0, 10)"
625 min="1950-01-01" 635 min="1950-01-01"
626 @input="menu = false" 636 @input="menu = false"
627 ></v-date-picker> 637 ></v-date-picker>
628 </v-menu> 638 </v-menu>
629 </v-flex> 639 </v-flex>
630 </v-layout> 640 </v-layout>
631 </v-flex> 641 </v-flex>
632 <v-flex xs12 sm6> 642 <v-flex xs12 sm6>
633 <v-layout> 643 <v-layout>
634 <v-flex xs4 class="pt-4 subheading"> 644 <v-flex xs4 class="pt-4 subheading">
635 <label class="right">City:</label> 645 <label class="right">City:</label>
636 </v-flex> 646 </v-flex>
637 <v-flex xs8 class="ml-3"> 647 <v-flex xs8 class="ml-3">
638 <v-text-field 648 <v-text-field
639 v-model="addTeachers.city" 649 v-model="addTeachers.city"
640 placeholder="fill your City Name" 650 placeholder="fill your City Name"
641 name="City" 651 name="City"
642 type="text" 652 type="text"
643 :rules="cityRules" 653 :rules="cityRules"
644 required 654 required
645 ></v-text-field> 655 ></v-text-field>
646 </v-flex> 656 </v-flex>
647 </v-layout> 657 </v-layout>
648 </v-flex> 658 </v-flex>
649 </v-layout> 659 </v-layout>
650 <v-layout> 660 <v-layout>
651 <v-flex xs12 sm6> 661 <v-flex xs12 sm6>
652 <v-layout> 662 <v-layout>
653 <v-flex xs4 class="pt-4 subheading"> 663 <v-flex xs4 class="pt-4 subheading">
654 <label class="right">State:</label> 664 <label class="right">State:</label>
655 </v-flex> 665 </v-flex>
656 <v-flex xs8 class="ml-3"> 666 <v-flex xs8 class="ml-3">
657 <v-text-field 667 <v-text-field
658 v-model="addTeachers.state" 668 v-model="addTeachers.state"
659 placeholder="fill your State Name" 669 placeholder="fill your State Name"
660 name="state" 670 name="state"
661 type="text" 671 type="text"
662 :rules="stateRules" 672 :rules="stateRules"
663 required 673 required
664 ></v-text-field> 674 ></v-text-field>
665 </v-flex> 675 </v-flex>
666 </v-layout> 676 </v-layout>
667 </v-flex> 677 </v-flex>
668 <v-flex xs12 sm6> 678 <v-flex xs12 sm6>
669 <v-layout> 679 <v-layout>
670 <v-flex xs4 class="pt-4 subheading"> 680 <v-flex xs4 class="pt-4 subheading">
671 <label class="right">PinCode:</label> 681 <label class="right">PinCode:</label>
672 </v-flex> 682 </v-flex>
673 <v-flex xs8 class="ml-3"> 683 <v-flex xs8 class="ml-3">
674 <v-text-field 684 <v-text-field
675 v-model="addTeachers.pincode" 685 v-model="addTeachers.pincode"
676 placeholder="fill your pincode" 686 placeholder="fill your pincode"
677 name="pincode" 687 name="pincode"
678 type="number" 688 type="number"
679 :rules="pincode" 689 :rules="pincode"
680 required 690 required
681 ></v-text-field> 691 ></v-text-field>
682 </v-flex> 692 </v-flex>
683 </v-layout> 693 </v-layout>
684 </v-flex> 694 </v-flex>
685 </v-layout> 695 </v-layout>
686 <v-layout> 696 <v-layout>
687 <v-flex xs12 sm6> 697 <v-flex xs12 sm6>
688 <v-layout> 698 <v-layout>
689 <v-flex xs4 class="pt-4 subheading"> 699 <v-flex xs4 class="pt-4 subheading">
690 <label class="right">Mobile NO:</label> 700 <label class="right">Mobile NO:</label>
691 </v-flex> 701 </v-flex>
692 <v-flex xs8 class="ml-3"> 702 <v-flex xs8 class="ml-3">
693 <v-text-field 703 <v-text-field
694 v-model="addTeachers.mobileNo" 704 v-model="addTeachers.mobileNo"
695 placeholder="fill your MobileNo" 705 placeholder="fill your MobileNo"
696 name="mobileNo" 706 name="mobileNo"
697 type="number" 707 type="number"
698 :rules="mobileNoRules" 708 :rules="mobileNoRules"
699 required 709 required
700 ></v-text-field> 710 ></v-text-field>
701 </v-flex> 711 </v-flex>
702 </v-layout> 712 </v-layout>
703 </v-flex> 713 </v-flex>
704 <v-flex xs12 sm6> 714 <v-flex xs12 sm6>
705 <v-layout> 715 <v-layout>
706 <v-flex xs4 class="pt-4 subheading"> 716 <v-flex xs4 class="pt-4 subheading">
707 <label class="right">Select Country:</label> 717 <label class="right">Select Country:</label>
708 </v-flex> 718 </v-flex>
709 <v-flex xs8 class="ml-3"> 719 <v-flex xs8 class="ml-3">
710 <v-autocomplete 720 <v-autocomplete
711 v-model="addTeachers.country" 721 v-model="addTeachers.country"
712 :rules="country" 722 :rules="country"
713 :items="countries" 723 :items="countries"
714 placeholder="Select Country Name" 724 placeholder="Select Country Name"
715 required 725 required
716 ></v-autocomplete> 726 ></v-autocomplete>
717 </v-flex> 727 </v-flex>
718 </v-layout> 728 </v-layout>
719 </v-flex> 729 </v-flex>
720 </v-layout> 730 </v-layout>
721 <v-layout> 731 <v-layout>
722 <v-flex xs12 sm6> 732 <v-flex xs12 sm6>
723 <v-layout> 733 <v-layout>
724 <v-flex xs4 class="pt-4 subheading"> 734 <v-flex xs4 class="pt-4 subheading">
725 <label class="right">Join Date</label> 735 <label class="right">Join Date</label>
726 </v-flex> 736 </v-flex>
727 <v-flex xs8 class="ml-3"> 737 <v-flex xs8 class="ml-3">
728 <v-menu 738 <v-menu
729 ref="menu1" 739 ref="menu1"
730 :close-on-content-click="false" 740 :close-on-content-click="false"
731 v-model="menu1" 741 v-model="menu1"
732 :nudge-right="40" 742 :nudge-right="40"
733 lazy 743 lazy
734 transition="scale-transition" 744 transition="scale-transition"
735 offset-y 745 offset-y
736 full-width 746 full-width
737 min-width="290px" 747 min-width="290px"
738 > 748 >
739 <v-text-field 749 <v-text-field
740 slot="activator" 750 slot="activator"
741 :rules="joinDateRules" 751 :rules="joinDateRules"
742 v-model="addTeachers.joinDate" 752 v-model="addTeachers.joinDate"
743 placeholder="Select date" 753 placeholder="Select date"
744 ></v-text-field> 754 ></v-text-field>
745 <v-date-picker 755 <v-date-picker
746 ref="picker" 756 ref="picker"
747 v-model="addTeachers.joinDate" 757 v-model="addTeachers.joinDate"
748 :max="new Date().toISOString().substr(0, 10)" 758 :max="new Date().toISOString().substr(0, 10)"
749 min="1950-01-01" 759 min="1950-01-01"
750 @input="menu1 = false" 760 @input="menu1 = false"
751 ></v-date-picker> 761 ></v-date-picker>
752 </v-menu> 762 </v-menu>
753 </v-flex> 763 </v-flex>
754 </v-layout> 764 </v-layout>
755 </v-flex> 765 </v-flex>
756 <v-flex xs12 sm6> 766 <v-flex xs12 sm6>
757 <v-layout> 767 <v-layout>
758 <v-flex xs4 class="pt-4 subheading"> 768 <v-flex xs4 class="pt-4 subheading">
759 <label class="right">Uplaod Image:</label> 769 <label class="right">Uplaod Image:</label>
760 </v-flex> 770 </v-flex>
761 <v-flex xs8 class="ml-3"> 771 <v-flex xs8 class="ml-3">
762 <v-text-field 772 <v-text-field
763 label="Select Image" 773 label="Select Image"
764 @click="pickFile" 774 @click="pickFile"
765 v-model="imageName" 775 v-model="imageName"
766 append-icon="attach_file" 776 append-icon="attach_file"
767 ></v-text-field> 777 ></v-text-field>
768 <input 778 <input
769 type="file" 779 type="file"
770 style="display:none" 780 style="display:none"
771 ref="image" 781 ref="image"
772 accept="image/*" 782 accept="image/*"
773 @change="onFilePicked" 783 @change="onFilePicked"
774 > 784 />
775 </v-flex> 785 </v-flex>
776 </v-layout> 786 </v-layout>
777 </v-flex> 787 </v-flex>
778 </v-layout> 788 </v-layout>
779 <v-layout> 789 <v-layout>
780 <v-flex xs12 sm12> 790 <v-flex xs12 sm12>
781 <v-layout> 791 <v-layout>
782 <v-flex xs3 class="pt-4 subheading pl-4" style="max-width: 17%;"> 792 <v-flex xs3 class="pt-4 subheading pl-4" style="max-width: 17%;">
783 <label class>Present Address:</label> 793 <label class>Present Address:</label>
784 </v-flex> 794 </v-flex>
785 <v-flex xs12 class="presentInput"> 795 <v-flex xs12 class="presentInput">
786 <v-text-field 796 <v-text-field
787 name="input-4-3" 797 name="input-4-3"
788 v-model="addTeachers.presentAddress" 798 v-model="addTeachers.presentAddress"
789 :rules="presentAddress" 799 :rules="presentAddress"
790 placeholder="fill Your present Address" 800 placeholder="fill Your present Address"
791 required 801 required
792 ></v-text-field> 802 ></v-text-field>
793 </v-flex> 803 </v-flex>
794 </v-layout> 804 </v-layout>
795 </v-flex> 805 </v-flex>
796 <v-flex xs12 sm12> 806 <v-flex xs12 sm12>
797 <v-layout> 807 <v-layout>
798 <v-flex xs3 class="pt-4 subheading" style="max-width: 17%;"> 808 <v-flex xs3 class="pt-4 subheading" style="max-width: 17%;">
799 <label>Permanent Address:</label> 809 <label>Permanent Address:</label>
800 </v-flex> 810 </v-flex>
801 <v-flex xs12 class="presentInput"> 811 <v-flex xs12 class="presentInput">
802 <v-text-field 812 <v-text-field
803 name="input-4-3" 813 name="input-4-3"
804 v-model="addTeachers.permanentAddress" 814 v-model="addTeachers.permanentAddress"
805 :rules="permanentAddress" 815 :rules="permanentAddress"
806 placeholder="fill Your Permanent Address" 816 placeholder="fill Your Permanent Address"
807 required 817 required
808 ></v-text-field> 818 ></v-text-field>
809 </v-flex> 819 </v-flex>
810 </v-layout> 820 </v-layout>
811 </v-flex> 821 </v-flex>
812 </v-layout> 822 </v-layout>
813 <v-layout> 823 <v-layout>
814 <v-flex xs12 sm12> 824 <v-flex xs12 sm12>
815 <v-card-actions> 825 <v-card-actions>
816 <v-btn @click="clear" round dark>clear</v-btn> 826 <v-btn @click="clear" round dark>clear</v-btn>
817 <v-spacer></v-spacer> 827 <v-spacer></v-spacer>
818 <v-btn @click="submit" round dark :loading="loading">Add</v-btn> 828 <v-btn @click="submit" round dark :loading="loading">Add</v-btn>
819 </v-card-actions> 829 </v-card-actions>
820 </v-flex> 830 </v-flex>
821 </v-layout> 831 </v-layout>
822 </v-container> 832 </v-container>
823 </v-form> 833 </v-form>
824 </v-card> 834 </v-card>
825 </v-flex> 835 </v-flex>
826 </v-container> 836 </v-container>
827 </v-tab-item> 837 </v-tab-item>
828 </v-tabs> 838 </v-tabs>
829 <div class="loader" v-if="showLoader"> 839 <div class="loader" v-if="showLoader">
830 <v-progress-circular indeterminate color="white"></v-progress-circular> 840 <v-progress-circular indeterminate color="white"></v-progress-circular>
831 </div> 841 </div>
832 </v-app> 842 </v-app>
833 </template> 843 </template>
834 844
835 <script> 845 <script>
836 // import AppToolbar from '@/components/AppToolbar'; 846 // import AppToolbar from '@/components/AppToolbar';
837 import http from "@/Services/http.js"; 847 import http from "@/Services/http.js";
838 import Util from "@/util"; 848 import Util from "@/util";
839 import moment from "moment"; 849 import moment from "moment";
840 850
841 export default { 851 export default {
842 components: { 852 components: {
843 // "one-month": onemonth, 853 // "one-month": onemonth,
844 }, 854 },
845 data: () => ({ 855 data: () => ({
846 component: "report-generate", 856 component: "report-generate",
847 snackbar: false, 857 snackbar: false,
848 y: "top", 858 y: "top",
849 x: "right", 859 x: "right",
850 mode: "", 860 mode: "",
851 timeout: 3000, 861 timeout: 3000,
852 text: "", 862 text: "",
853 showLoader:false, 863 showLoader: false,
854 loading: false, 864 loading: false,
855 date: null, 865 date: null,
856 search: "", 866 search: "",
857 menu: false, 867 menu: false,
858 menu1: false, 868 menu1: false,
859 menu2: false, 869 menu2: false,
860 menu3: false, 870 menu3: false,
861 dialog: false, 871 dialog: false,
862 dialog1: false, 872 dialog1: false,
863 valid: true, 873 valid: true,
864 isActive: true, 874 isActive: true,
865 newActive: false, 875 newActive: false,
866 pagination: { 876 pagination: {
867 rowsPerPage: 15 877 rowsPerPage: 15
868 }, 878 },
869 imageData: {}, 879 imageData: {},
870 imageName: "", 880 imageName: "",
871 imageUrl: "", 881 imageUrl: "",
872 imageFile: "", 882 imageFile: "",
873 nameRules: [v => !!v || " Full Name is required"], 883 nameRules: [v => !!v || " Full Name is required"],
874 dateRules: [v => !!v || " DOB is required"], 884 dateRules: [v => !!v || " DOB is required"],
875 cityRules: [v => !!v || " City Name is required"], 885 cityRules: [v => !!v || " City Name is required"],
876 pincode: [v => !!v || " Pincode is required"], 886 pincode: [v => !!v || " Pincode is required"],
877 country: [v => !!v || " Country Name is required"], 887 country: [v => !!v || " Country Name is required"],
878 permanentAddress: [v => !!v || " Permanent Address is required"], 888 permanentAddress: [v => !!v || " Permanent Address is required"],
879 presentAddress: [v => !!v || " Present Address is required"], 889 presentAddress: [v => !!v || " Present Address is required"],
880 mobileNoRules: [v => !!v || "Mobile Number is required"], 890 mobileNoRules: [v => !!v || "Mobile Number is required"],
881 stateRules: [v => !!v || "State Name is required"], 891 stateRules: [v => !!v || "State Name is required"],
882 joinDateRules: [v => !!v || " Join Date is required"], 892 joinDateRules: [v => !!v || " Join Date is required"],
883 errorMessages: "", 893 errorMessages: "",
884 emailRules: [ 894 emailRules: [
885 v => !!v || "E-mail is required", 895 v => !!v || "E-mail is required",
886 v => 896 v =>
887 /^\w+([.-]?\w+)*@\w+([.-]?\w+)*(\.\w{2,3})+$/.test(v) || 897 /^\w+([.-]?\w+)*@\w+([.-]?\w+)*(\.\w{2,3})+$/.test(v) ||
888 "E-mail must be valid" 898 "E-mail must be valid"
889 ], 899 ],
890 countries: [ 900 countries: [
891 "Afghanistan", 901 "Afghanistan",
892 "Albania", 902 "Albania",
893 "Algeria", 903 "Algeria",
894 "Andorra", 904 "Andorra",
895 "Angola", 905 "Angola",
896 "Anguilla", 906 "Anguilla",
897 "Antigua &amp; Barbuda", 907 "Antigua &amp; Barbuda",
898 "Argentina", 908 "Argentina",
899 "Armenia", 909 "Armenia",
900 "Aruba", 910 "Aruba",
901 "Australia", 911 "Australia",
902 "Austria", 912 "Austria",
903 "Azerbaijan", 913 "Azerbaijan",
904 "Bahamas", 914 "Bahamas",
905 "Bahrain", 915 "Bahrain",
906 "Bangladesh", 916 "Bangladesh",
907 "Barbados", 917 "Barbados",
908 "Belarus", 918 "Belarus",
909 "Belgium", 919 "Belgium",
910 "Belize", 920 "Belize",
911 "Benin", 921 "Benin",
912 "Bermuda", 922 "Bermuda",
913 "Bhutan", 923 "Bhutan",
914 "Bolivia", 924 "Bolivia",
915 "Bosnia &amp; Herzegovina", 925 "Bosnia &amp; Herzegovina",
916 "Botswana", 926 "Botswana",
917 "Brazil", 927 "Brazil",
918 "British Virgin Islands", 928 "British Virgin Islands",
919 "Brunei", 929 "Brunei",
920 "Bulgaria", 930 "Bulgaria",
921 "Burkina Faso", 931 "Burkina Faso",
922 "Burundi", 932 "Burundi",
923 "Cambodia", 933 "Cambodia",
924 "Cameroon", 934 "Cameroon",
925 "Cape Verde", 935 "Cape Verde",
926 "Cayman Islands", 936 "Cayman Islands",
927 "Chad", 937 "Chad",
928 "Chile", 938 "Chile",
929 "China", 939 "China",
930 "Colombia", 940 "Colombia",
931 "Congo", 941 "Congo",
932 "Cook Islands", 942 "Cook Islands",
933 "Costa Rica", 943 "Costa Rica",
934 "Cote D Ivoire", 944 "Cote D Ivoire",
935 "Croatia", 945 "Croatia",
936 "Cruise Ship", 946 "Cruise Ship",
937 "Cuba", 947 "Cuba",
938 "Cyprus", 948 "Cyprus",
939 "Czech Republic", 949 "Czech Republic",
940 "Denmark", 950 "Denmark",
941 "Djibouti", 951 "Djibouti",
942 "Dominica", 952 "Dominica",
943 "Dominican Republic", 953 "Dominican Republic",
944 "Ecuador", 954 "Ecuador",
945 "Egypt", 955 "Egypt",
946 "El Salvador", 956 "El Salvador",
947 "Equatorial Guinea", 957 "Equatorial Guinea",
948 "Estonia", 958 "Estonia",
949 "Ethiopia", 959 "Ethiopia",
950 "Falkland Islands", 960 "Falkland Islands",
951 "Faroe Islands", 961 "Faroe Islands",
952 "Fiji", 962 "Fiji",
953 "Finland", 963 "Finland",
954 "France", 964 "France",
955 "French Polynesia", 965 "French Polynesia",
956 "French West Indies", 966 "French West Indies",
957 "Gabon", 967 "Gabon",
958 "Gambia", 968 "Gambia",
959 "Georgia", 969 "Georgia",
960 "Germany", 970 "Germany",
961 "Ghana", 971 "Ghana",
962 "Gibraltar", 972 "Gibraltar",
963 "Greece", 973 "Greece",
964 "Greenland", 974 "Greenland",
965 "Grenada", 975 "Grenada",
966 "Guam", 976 "Guam",
967 "Guatemala", 977 "Guatemala",
968 "Guernsey", 978 "Guernsey",
969 "Guinea", 979 "Guinea",
970 "Guinea Bissau", 980 "Guinea Bissau",
971 "Guyana", 981 "Guyana",
972 "Haiti", 982 "Haiti",
973 "Honduras", 983 "Honduras",
974 "Hong Kong", 984 "Hong Kong",
975 "Hungary", 985 "Hungary",
976 "Iceland", 986 "Iceland",
977 "India", 987 "India",
978 "Indonesia", 988 "Indonesia",
979 "Iran", 989 "Iran",
980 "Iraq", 990 "Iraq",
981 "Ireland", 991 "Ireland",
982 "Isle of Man", 992 "Isle of Man",
983 "Israel", 993 "Israel",
984 "Italy", 994 "Italy",
985 "Jamaica", 995 "Jamaica",
986 "Japan", 996 "Japan",
987 "Jersey", 997 "Jersey",
988 "Jordan", 998 "Jordan",
989 "Kazakhstan", 999 "Kazakhstan",
990 "Kenya", 1000 "Kenya",
991 "Kuwait", 1001 "Kuwait",
992 "Kyrgyz Republic", 1002 "Kyrgyz Republic",
993 "Laos", 1003 "Laos",
994 "Latvia", 1004 "Latvia",
995 "Lebanon", 1005 "Lebanon",
996 "Lesotho", 1006 "Lesotho",
997 "Liberia", 1007 "Liberia",
998 "Libya", 1008 "Libya",
999 "Liechtenstein", 1009 "Liechtenstein",
1000 "Lithuania", 1010 "Lithuania",
1001 "Luxembourg", 1011 "Luxembourg",
1002 "Macau", 1012 "Macau",
1003 "Macedonia", 1013 "Macedonia",
1004 "Madagascar", 1014 "Madagascar",
1005 "Malawi", 1015 "Malawi",
1006 "Malaysia", 1016 "Malaysia",
1007 "Maldives", 1017 "Maldives",
1008 "Mali", 1018 "Mali",
1009 "Malta", 1019 "Malta",
1010 "Mauritania", 1020 "Mauritania",
1011 "Mauritius", 1021 "Mauritius",
1012 "Mexico", 1022 "Mexico",
1013 "Moldova", 1023 "Moldova",
1014 "Monaco", 1024 "Monaco",
1015 "Mongolia", 1025 "Mongolia",
1016 "Montenegro", 1026 "Montenegro",
1017 "Montserrat", 1027 "Montserrat",
1018 "Morocco", 1028 "Morocco",
1019 "Mozambique", 1029 "Mozambique",
1020 "Namibia", 1030 "Namibia",
1021 "Nepal", 1031 "Nepal",
1022 "Netherlands", 1032 "Netherlands",
1023 "Netherlands Antilles", 1033 "Netherlands Antilles",
1024 "New Caledonia", 1034 "New Caledonia",
1025 "New Zealand", 1035 "New Zealand",
1026 "Nicaragua", 1036 "Nicaragua",
1027 "Niger", 1037 "Niger",
1028 "Nigeria", 1038 "Nigeria",
1029 "Norway", 1039 "Norway",
1030 "Oman", 1040 "Oman",
1031 "Pakistan", 1041 "Pakistan",
1032 "Palestine", 1042 "Palestine",
1033 "Panama", 1043 "Panama",
1034 "Papua New Guinea", 1044 "Papua New Guinea",
1035 "Paraguay", 1045 "Paraguay",
1036 "Peru", 1046 "Peru",
1037 "Philippines", 1047 "Philippines",
1038 "Poland", 1048 "Poland",
1039 "Portugal", 1049 "Portugal",
1040 "Puerto Rico", 1050 "Puerto Rico",
1041 "Qatar", 1051 "Qatar",
1042 "Reunion", 1052 "Reunion",
1043 "Romania", 1053 "Romania",
1044 "Russia", 1054 "Russia",
1045 "Rwanda", 1055 "Rwanda",
1046 "Saint Pierre &amp; Miquelon", 1056 "Saint Pierre &amp; Miquelon",
1047 "Samoa", 1057 "Samoa",
1048 "San Marino", 1058 "San Marino",
1049 "Satellite", 1059 "Satellite",
1050 "Saudi Arabia", 1060 "Saudi Arabia",
1051 "Senegal", 1061 "Senegal",
1052 "Serbia", 1062 "Serbia",
1053 "Seychelles", 1063 "Seychelles",
1054 "Sierra Leone", 1064 "Sierra Leone",
1055 "Singapore", 1065 "Singapore",
1056 "Slovakia", 1066 "Slovakia",
1057 "Slovenia", 1067 "Slovenia",
1058 "South Africa", 1068 "South Africa",
1059 "South Korea", 1069 "South Korea",
1060 "Spain", 1070 "Spain",
1061 "Sri Lanka", 1071 "Sri Lanka",
1062 "St Kitts &amp; Nevis", 1072 "St Kitts &amp; Nevis",
1063 "St Lucia", 1073 "St Lucia",
1064 "St Vincent", 1074 "St Vincent",
1065 "St. Lucia", 1075 "St. Lucia",
1066 "Sudan", 1076 "Sudan",
1067 "Suriname", 1077 "Suriname",
1068 "Swaziland", 1078 "Swaziland",
1069 "Sweden", 1079 "Sweden",
1070 "Switzerland", 1080 "Switzerland",
1071 "Syria", 1081 "Syria",
1072 "Taiwan", 1082 "Taiwan",
1073 "Tajikistan", 1083 "Tajikistan",
1074 "Tanzania", 1084 "Tanzania",
1075 "Thailand", 1085 "Thailand",
1076 "Timor L'Este", 1086 "Timor L'Este",
1077 "Togo", 1087 "Togo",
1078 "Tonga", 1088 "Tonga",
1079 "Trinidad &amp; Tobago", 1089 "Trinidad &amp; Tobago",
1080 "Tunisia", 1090 "Tunisia",
1081 "Turkey", 1091 "Turkey",
1082 "Turkmenistan", 1092 "Turkmenistan",
1083 "Turks &amp; Caicos", 1093 "Turks &amp; Caicos",
1084 "Uganda", 1094 "Uganda",
1085 "Ukraine", 1095 "Ukraine",
1086 "United Arab Emirates", 1096 "United Arab Emirates",
1087 "United Kingdom", 1097 "United Kingdom",
1088 "United States", 1098 "United States",
1089 "Uruguay", 1099 "Uruguay",
1090 "Uzbekistan", 1100 "Uzbekistan",
1091 "Venezuela", 1101 "Venezuela",
1092 "Vietnam", 1102 "Vietnam",
1093 "Virgin Islands (US)", 1103 "Virgin Islands (US)",
1094 "Yemen", 1104 "Yemen",
1095 "Zambia", 1105 "Zambia",
1096 "Zimbabwe" 1106 "Zimbabwe"
1097 ], 1107 ],
1098 headers: [ 1108 headers: [
1099 { 1109 {
1100 text: "No", 1110 text: "No",
1101 align: "center", 1111 align: "center",
1102 sortable: false, 1112 sortable: false,
1103 value: "No" 1113 value: "No"
1104 }, 1114 },
1105 { text: "Profile Pic", value: "profilePicUrl", sortable: false, align: "center" }, 1115 {
1116 text: "Profile Pic",
1117 value: "profilePicUrl",
1118 sortable: false,
1119 align: "center"
1120 },
1106 { text: "Name", value: "name", sortable: false, align: "center" }, 1121 { text: "Name", value: "name", sortable: false, align: "center" },
1107 { text: "Email", value: "email", sortable: false, align: "center" }, 1122 { text: "Email", value: "email", sortable: false, align: "center" },
1108 { text: "DOB", value: "dob", sortable: false, align: "center" }, 1123 { text: "DOB", value: "dob", sortable: false, align: "center" },
1109 { text: "Join Date", value: "joinDate", sortable: false, align: "center" }, 1124 {
1110 { text: "Mobile No", value: "mobileNo", sortable: false, align: "center" }, 1125 text: "Join Date",
1126 value: "joinDate",
1127 sortable: false,
1128 align: "center"
1129 },
1130 {
1131 text: "Mobile No",
1132 value: "mobileNo",
1133 sortable: false,
1134 align: "center"
1135 },
1111 { text: "Action", value: "", sortable: false, align: "center" } 1136 { text: "Action", value: "", sortable: false, align: "center" }
1112 ], 1137 ],
1113 desserts: [], 1138 desserts: [],
1114 editedIndex: -1, 1139 editedIndex: -1,
1115 upload:'', 1140 upload: "",
1116 editedItem: { 1141 editedItem: {
1117 role: "TEACHER", 1142 role: "TEACHER",
1118 name: "", 1143 name: "",
1119 email: "", 1144 email: "",
1120 date: null, 1145 date: null,
1121 city: "", 1146 city: "",
1122 pincode: "", 1147 pincode: "",
1123 country: "", 1148 country: "",
1124 permanentAddress: "", 1149 permanentAddress: "",
1125 presentAddress: "", 1150 presentAddress: "",
1126 mobileNo: "", 1151 mobileNo: "",
1127 state: "", 1152 state: "",
1128 joinDate: null 1153 joinDate: null
1129 }, 1154 },
1130 addTeachers: { 1155 addTeachers: {
1131 role: "TEACHER", 1156 role: "TEACHER",
1132 name: "", 1157 name: "",
1133 email: "", 1158 email: "",
1134 date: null, 1159 date: null,
1135 city: "", 1160 city: "",
1136 pincode: "", 1161 pincode: "",
1137 country: "", 1162 country: "",
1138 permanentAddress: "", 1163 permanentAddress: "",
1139 presentAddress: "", 1164 presentAddress: "",
1140 mobileNo: "", 1165 mobileNo: "",
1141 state: "", 1166 state: "",
1142 joinDate: null 1167 joinDate: null
1143 }, 1168 },
1144 defaultItem: { 1169 defaultItem: {
1145 role: "TEACHER", 1170 role: "TEACHER",
1146 name: "", 1171 name: "",
1147 email: "" 1172 email: ""
1148 }, 1173 },
1149 userName: "", 1174 userName: "",
1150 items: [ 1175 items: [
1151 { 1176 {
1152 href: "/changepassword", 1177 href: "/changepassword",
1153 title: "Change Password", 1178 title: "Change Password",
1154 click: e => { 1179 click: e => {
1155 console.log(e); 1180 console.log(e);
1156 } 1181 }
1157 }, 1182 },
1158 { 1183 {
1159 href: "#", 1184 href: "#",
1160 title: "Logout", 1185 title: "Logout",
1161 click: e => { 1186 click: e => {
1162 window.getApp.$emit("APP_LOGOUT"); 1187 window.getApp.$emit("APP_LOGOUT");
1163 } 1188 }
1164 } 1189 }
1165 ] 1190 ]
1166 }), 1191 }),
1167 watch: { 1192 watch: {
1168 menu(val) { 1193 menu(val) {
1169 val && this.$nextTick(() => (this.$refs.picker.activePicker = "YEAR")); 1194 val && this.$nextTick(() => (this.$refs.picker.activePicker = "YEAR"));
1170 }, 1195 },
1171 menu1(val) { 1196 menu1(val) {
1172 val && this.$nextTick(() => (this.$refs.picker.activePicker = "YEAR")); 1197 val && this.$nextTick(() => (this.$refs.picker.activePicker = "YEAR"));
1173 } 1198 }
1174 }, 1199 },
1175 methods: { 1200 methods: {
1176 save (date) { 1201 save(date) {
1177 this.$refs.menu.save(date) 1202 this.$refs.menu.save(date);
1178 }, 1203 },
1179 save (date) { 1204 save(date) {
1180 this.$refs.menu1.save(date) 1205 this.$refs.menu1.save(date);
1181 }, 1206 },
1182 pickFile() { 1207 pickFile() {
1183 this.$refs.image.click (); 1208 this.$refs.image.click();
1184 }, 1209 },
1185 onFilePicked(e) { 1210 onFilePicked(e) {
1186 // console.log(e) 1211 // console.log(e)
1187 const files = e.target.files; 1212 const files = e.target.files;
1188 this.upload = e.target.files[0]; 1213 this.upload = e.target.files[0];
1189 console.log("imageData-upload========>",this.upload) 1214 console.log("imageData-upload========>", this.upload);
1190 if (files[0] !== undefined) { 1215 if (files[0] !== undefined) {
1191 this.imageName = files[0].name; 1216 this.imageName = files[0].name;
1192 if (this.imageName.lastIndexOf(".") <= 0) { 1217 if (this.imageName.lastIndexOf(".") <= 0) {
1193 return; 1218 return;
1194 } 1219 }
1195 const fr = new FileReader(); 1220 const fr = new FileReader();
1196 fr.readAsDataURL(files[0]); 1221 fr.readAsDataURL(files[0]);
1197 fr.addEventListener("load", () => { 1222 fr.addEventListener("load", () => {
1198 this.imageUrl = fr.result; 1223 this.imageUrl = fr.result;
1199 this.imageFile = files[0]; // this is an image file that can be sent to server... 1224 this.imageFile = files[0]; // this is an image file that can be sent to server...
1200 // this.imageData.imageUrl = URL.createObjectURL(this.imageFile); 1225 // this.imageData.imageUrl = URL.createObjectURL(this.imageFile);
1201 // console.log("upload=======>", this.imageData.imageUrl); 1226 // console.log("upload=======>", this.imageData.imageUrl);
1202 console.log("imageFile", this.imageUrl ); 1227 console.log("imageFile", this.imageUrl);
1203 }); 1228 });
1204 } else { 1229 } else {
1205 this.imageName = ""; 1230 this.imageName = "";
1206 this.imageFile = ""; 1231 this.imageFile = "";
1207 this.imageUrl = ""; 1232 this.imageUrl = "";
1208 } 1233 }
1209 }, 1234 },
1210 dates: function(date) { 1235 dates: function(date) {
1211 return moment(date).format("MMMM DD, YYYY"); 1236 return moment(date).format("MMMM DD, YYYY");
1212 }, 1237 },
1213 getTeacherList() { 1238 getTeacherList() {
1214 this.showLoader = true; 1239 this.showLoader = true;
1215 var token = this.$store.state.token; 1240 var token = this.$store.state.token;
1216 console.log("token",token) 1241 console.log("token", token);
1217 http() 1242 http()
1218 .get("/getTeachersList", { 1243 .get("/getTeachersList", {
1219 headers: { Authorization: "Bearer " + token } 1244 headers: { Authorization: "Bearer " + token }
1220 }) 1245 })
1221 .then(response => { 1246 .then(response => {
1222 this.desserts = response.data.data; 1247 this.desserts = response.data.data;
1223 this.showLoader = false; 1248 this.showLoader = false;
1224 // console.log("getTeacherList=====>",this.desserts) 1249 // console.log("getTeacherList=====>",this.desserts)
1225 }) 1250 })
1226 .catch(err => { 1251 .catch(err => {
1227 // console.log("err====>", err); 1252 // console.log("err====>", err);
1228 this.showLoader = false; 1253 this.showLoader = false;
1229 // this.$router.replace({ path: "/" }); 1254 // this.$router.replace({ path: "/" });
1230 }); 1255 });
1231 }, 1256 },
1232 editItem(item) { 1257 editItem(item) {
1233 this.editedIndex = this.desserts.indexOf(item); 1258 this.editedIndex = this.desserts.indexOf(item);
1234 this.editedItem = Object.assign({}, item); 1259 this.editedItem = Object.assign({}, item);
1235 this.editedItem.dob = this.editedItem.dob != undefined ? this.editedItem.dob = this.editedItem.dob.substring(0, 10): this.editedItem.dob = '' 1260 this.editedItem.dob =
1236 this.editedItem.joinDate = this.editedItem.joinDate != undefined ? this.editedItem.joinDate = this.editedItem.joinDate.substring(0, 10): this.editedItem.joinDate = '' 1261 this.editedItem.dob != undefined
1262 ? (this.editedItem.dob = this.editedItem.dob.substring(0, 10))
1263 : (this.editedItem.dob = "");
1264 this.editedItem.joinDate =
1265 this.editedItem.joinDate != undefined
1266 ? (this.editedItem.joinDate = this.editedItem.joinDate.substring(
1267 0,
1268 10
1269 ))
1270 : (this.editedItem.joinDate = "");
1237 1271
1238 this.dialog = true; 1272 this.dialog = true;
1239 }, 1273 },
1240 profile(item) { 1274 profile(item) {
1241 this.editedIndex = this.desserts.indexOf(item); 1275 this.editedIndex = this.desserts.indexOf(item);
1242 this.editedItem = Object.assign({}, item); 1276 this.editedItem = Object.assign({}, item);
1243 this.dialog1 = true; 1277 this.dialog1 = true;
1244 }, 1278 },
1245 deleteItem(item) { 1279 deleteItem(item) {
1246 let deleteTeachers = { 1280 let deleteTeachers = {
1247 teacherId: item._id 1281 teacherId: item._id
1248 }; 1282 };
1249 // console.log("deleteUers",deleteTeachers) 1283 // console.log("deleteUers",deleteTeachers)
1250 http() 1284 http()
1251 .delete( 1285 .delete(
1252 "/deleteTeacher", 1286 "/deleteTeacher",
1253 confirm("Are you sure you want to delete this?") && { 1287 confirm("Are you sure you want to delete this?") && {
1254 params: deleteTeachers 1288 params: deleteTeachers
1255 } 1289 }
1256 ) 1290 )
1257 .then(response => { 1291 .then(response => {
1258 // console.log("deleteUers",deleteTeachers) 1292 // console.log("deleteUers",deleteTeachers)
1259 if ((this.snackbar = true)) { 1293 if ((this.snackbar = true)) {
1260 this.text = "Successfully delete Existing Teacher"; 1294 this.text = "Successfully delete Existing Teacher";
1261 } 1295 }
1262 this.getTeacherList(); 1296 this.getTeacherList();
1263 }) 1297 })
1264 .catch(error => { 1298 .catch(error => {
1265 console.log(error); 1299 console.log(error);
1266 }); 1300 });
1267 }, 1301 },
1268 activeTab(type) { 1302 activeTab(type) {
1269 switch (type) { 1303 switch (type) {
1270 case "existing": 1304 case "existing":
1271 this.newActive = false; 1305 this.newActive = false;
1272 this.isActive = true; 1306 this.isActive = true;
1273 break; 1307 break;
1274 1308
1275 default: 1309 default:
1276 this.newActive = true; 1310 this.newActive = true;
1277 this.isActive = false; 1311 this.isActive = false;
1278 break; 1312 break;
1279 } 1313 }
1280 }, 1314 },
1281 close() { 1315 close() {
1282 this.dialog = false; 1316 this.dialog = false;
1283 setTimeout(() => { 1317 setTimeout(() => {
1284 this.editedItem = Object.assign({}, this.defaultItem); 1318 this.editedItem = Object.assign({}, this.defaultItem);
1285 this.editedIndex = -1; 1319 this.editedIndex = -1;
1286 }, 300); 1320 }, 300);
1287 }, 1321 },
1288 close1() { 1322 close1() {
1289 this.dialog1 = false; 1323 this.dialog1 = false;
1290 }, 1324 },
1291 // close2() { 1325 // close2() {
1292 // this.dialog2 = false; 1326 // this.dialog2 = false;
1293 // }, 1327 // },
1294 submit() { 1328 submit() {
1295 if (this.$refs.form.validate()) { 1329 if (this.$refs.form.validate()) {
1296 // let images = new FormData(); 1330 // let images = new FormData();
1297 // images.append("upload",this.imageUrl); 1331 // images.append("upload",this.imageUrl);
1298 // console.log(images); 1332 // console.log(images);
1299 // var form_data = new FormData(); 1333 // var form_data = new FormData();
1300 // for (var key in addTeacher) { 1334 // for (var key in addTeacher) {
1301 // if (key === 'upload') { 1335 // if (key === 'upload') {
1302 // form_data.append(key, this.imageFile); 1336 // form_data.append(key, this.imageFile);
1303 // } else { 1337 // } else {
1304 // form_data.append(key, addTeacher[key]) 1338 // form_data.append(key, addTeacher[key])
1305 // } 1339 // }
1306 // } 1340 // }
1307 // console.log("images",images) 1341 // console.log("images",images)
1308 let addTeacher = { 1342 let addTeacher = {
1309 name: this.addTeachers.name, 1343 name: this.addTeachers.name,
1310 email: this.addTeachers.email, 1344 email: this.addTeachers.email,
1311 role: this.addTeachers.role, 1345 role: this.addTeachers.role,
1312 dob: this.addTeachers.date, 1346 dob: this.addTeachers.date,
1313 city: this.addTeachers.city, 1347 city: this.addTeachers.city,
1314 pincode: this.addTeachers.pincode, 1348 pincode: this.addTeachers.pincode,
1315 country: this.addTeachers.country, 1349 country: this.addTeachers.country,
1316 permanentAddress: this.addTeachers.permanentAddress, 1350 permanentAddress: this.addTeachers.permanentAddress,
1317 presentAddress: this.addTeachers.presentAddress, 1351 presentAddress: this.addTeachers.presentAddress,
1318 mobileNo: this.addTeachers.mobileNo, 1352 mobileNo: this.addTeachers.mobileNo,
1319 state: this.addTeachers.state, 1353 state: this.addTeachers.state,
1320 joinDate: this.addTeachers.joinDate, 1354 joinDate: this.addTeachers.joinDate,
1321 upload:this.imageUrl 1355 upload: this.imageUrl
1322 // upload:this.imageFile 1356 // upload:this.imageFile
1323 }; 1357 };
1324 // console.log("addTeacher============>", addTeacher); 1358 // console.log("addTeacher============>", addTeacher);
1325 this.loading = true; 1359 this.loading = true;
1326 http() 1360 http()
1327 .post("/createTeacher", addTeacher) 1361 .post("/createTeacher", addTeacher)
1328 .then(response => { 1362 .then(response => {
1329 console.log("addTeacher", addTeacher); 1363 console.log("addTeacher", addTeacher);
1330 this.getTeacherList(); 1364 this.getTeacherList();
1331 if ((this.snackbar = true)) { 1365 if ((this.snackbar = true)) {
1332 this.text = "New Teacher added successfully"; 1366 this.text = "New Teacher added successfully";
1333 } 1367 }
1334 1368
1335 this.clear(); 1369 this.clear();
1336 this.loading = false; 1370 this.loading = false;
1337 }) 1371 })
1338 .catch(error => { 1372 .catch(error => {
1339 // console.log(error); 1373 // console.log(error);
1340 if ((this.snackbar = true)) { 1374 if ((this.snackbar = true)) {
1341 this.text = error.response.data.message; 1375 this.text = error.response.data.message;
1342 } 1376 }
1343 this.loading = false; 1377 this.loading = false;
1344 }); 1378 });
1345 } 1379 }
1346 }, 1380 },
1347 mail() {}, 1381 mail() {},
1348 download() {}, 1382 download() {},
1349 clear() { 1383 clear() {
1350 this.$refs.form.reset(); 1384 this.$refs.form.reset();
1351 }, 1385 },
1352 save() { 1386 save() {
1387 this.loading = true;
1353 let editTeacher = { 1388 let editTeacher = {
1354 teacherId: this.editedItem._id, 1389 teacherId: this.editedItem._id,
1355 name: this.editedItem.name, 1390 name: this.editedItem.name,
1356 email: this.editedItem.email, 1391 email: this.editedItem.email,
1357 role: this.editedItem.role, 1392 role: this.editedItem.role,
1358 dob: this.editedItem.date, 1393 dob: this.editedItem.date,
1359 city: this.editedItem.city, 1394 city: this.editedItem.city,
1360 pincode: this.editedItem.pincode, 1395 pincode: this.editedItem.pincode,
1361 country: this.editedItem.country, 1396 country: this.editedItem.country,
1362 permanentAddress: this.editedItem.permanentAddress, 1397 permanentAddress: this.editedItem.permanentAddress,
1363 presentAddress: this.editedItem.presentAddress, 1398 presentAddress: this.editedItem.presentAddress,
1364 mobileNo: this.editedItem.mobileNo, 1399 mobileNo: this.editedItem.mobileNo,
1365 state: this.editedItem.state, 1400 state: this.editedItem.state,
1366 joinDate: this.editedItem.joinDate, 1401 joinDate: this.editedItem.joinDate
1367 upload:this.imageUrl
1368 }; 1402 };
1369 this.loading = true; 1403 if (this.imageUrl) {
1404 editTeacher.upload = this.imageUrl;
1405 }
1370 http() 1406 http()
1371 .put("/updateTeacher", editTeacher) 1407 .put("/updateTeacher", editTeacher)
1372 .then(response => { 1408 .then(response => {
1373 console.log("editTeacher",editTeacher); 1409 console.log("editTeacher", editTeacher);
1374 if ((this.snackbar = true)) { 1410 if ((this.snackbar = true)) {
1375 this.text = "Successfully Edit Existing Teacher"; 1411 this.text = "Successfully Edit Existing Teacher";
1376 } 1412 }
1377 this.loading = false; 1413 this.loading = false;
1378 this.getTeacherList(); 1414 this.getTeacherList();
1379 this.close(); 1415 this.close();
1380
1381 }) 1416 })
1382 .catch(error => { 1417 .catch(error => {
1383 console.log(error); 1418 console.log(error);
1384 this.loading = false; 1419 this.loading = false;
1385 }); 1420 });
1386 }, 1421 },
1387 handleDrawerToggle() { 1422 handleDrawerToggle() {
1388 window.getApp.$emit("APP_DRAWER_TOGGLED"); 1423 window.getApp.$emit("APP_DRAWER_TOGGLED");
1389 }, 1424 },
1390 handleFullScreen() { 1425 handleFullScreen() {
1391 Util.toggleFullScreen(); 1426 Util.toggleFullScreen();
1392 } 1427 }
1393 }, 1428 },
1394 mounted() { 1429 mounted() {
1395 this.getTeacherList(); 1430 this.getTeacherList();
1396 // console.log("Id",this.$store.state.id) 1431 // console.log("Id",this.$store.state.id)
1397 // console.log("token",this.$store.state.token) 1432 // console.log("token",this.$store.state.token)
1398 }, 1433 },
1399 computed: { 1434 computed: {
1400 toolbarColor() { 1435 toolbarColor() {
1401 return this.$vuetify.options.extra.mainNav; 1436 return this.$vuetify.options.extra.mainNav;
1402 } 1437 }
1403 } 1438 }
1404 }; 1439 };
1405 </script> 1440 </script>
1406 <style scoped> 1441 <style scoped>
1407 .v-tabs__div { 1442 .v-tabs__div {
1408 text-transform: none; 1443 text-transform: none;
1409 } 1444 }
1410 .v-input__prepend-outer { 1445 .v-input__prepend-outer {
1411 margin-right: 0px !important; 1446 margin-right: 0px !important;
1412 } 1447 }
1413 .v-card__actions .v-btn { 1448 .v-card__actions .v-btn {
1414 margin: 0 15px; 1449 margin: 0 15px;
1415 min-width: 120px; 1450 min-width: 120px;
1416 } 1451 }
1417 .primary { 1452 .primary {
1418 background-color: #aaa !important; 1453 background-color: #aaa !important;
1419 border-color: #aaa !important; 1454 border-color: #aaa !important;
1420 } 1455 }
1421 h4 { 1456 h4 {
1422 background-repeat: no-repeat; 1457 background-repeat: no-repeat;
1423 padding: 8px; 1458 padding: 8px;
1424 margin: auto; 1459 margin: auto;
1425 font-size: 25px; 1460 font-size: 25px;
1426 } 1461 }
1427 #name { 1462 #name {
1428 position: absolute; 1463 position: absolute;
1429 left: 100px; 1464 left: 100px;
1430 top: 17px; 1465 top: 17px;
1431 } 1466 }
1432 #icon { 1467 #icon {
1433 position: absolute; 1468 position: absolute;
1434 right: 8px; 1469 right: 8px;
1435 top: 8px; 1470 top: 8px;
1436 } 1471 }
1437 #m { 1472 #m {
1438 position: relative; 1473 position: relative;
1439 left: 135px; 1474 left: 135px;
1440 top: -15px; 1475 top: -15px;
1441 } 1476 }
1442 #G { 1477 #G {
1443 position: absolute; 1478 position: absolute;
1444 top: 38px; 1479 top: 38px;
1445 color: white; 1480 color: white;
1446 } 1481 }
1447 #bt { 1482 #bt {
1448 position: relative; 1483 position: relative;
1449 top: -20px; 1484 top: -20px;
1450 left: 115px; 1485 left: 115px;
1451 } 1486 }
1452 #e { 1487 #e {
1453 position: relative; 1488 position: relative;
1454 top: 5px; 1489 top: 5px;
1455 right: -30px; 1490 right: -30px;
1456 height: 17px; 1491 height: 17px;
1457 cursor: pointer; 1492 cursor: pointer;
1458 } 1493 }
1459 #d { 1494 #d {
1460 position: relative; 1495 position: relative;
1461 top: 5px; 1496 top: 5px;
1462 right: -70px; 1497 right: -70px;
1463 height: 17px; 1498 height: 17px;
1464 cursor: pointer; 1499 cursor: pointer;
1465 } 1500 }
1466 #td { 1501 #td {
1467 border: 1px solid #dddddd; 1502 border: 1px solid #dddddd;
1468 text-align: left; 1503 text-align: left;
1469 padding: 8px; 1504 padding: 8px;
1470 } 1505 }
1471 #dialog { 1506 #dialog {
1472 height: 550px; 1507 height: 550px;
1473 } 1508 }
1474 .active { 1509 .active {
1475 background-color: black; 1510 background-color: black;
1476 color: white !important; 1511 color: white !important;
1477 } 1512 }
1478 .activebtn { 1513 .activebtn {
1479 color: black !important; 1514 color: black !important;
1480 } 1515 }
1481 #flex { 1516 #flex {
1482 height: 300px; 1517 height: 300px;
1483 } 1518 }
1484 .v-tabs__item a { 1519 .v-tabs__item a {
1485 font-size: 16px !important; 1520 font-size: 16px !important;
1486 } 1521 }
1487 @media screen and (max-width: 769px) { 1522 @media screen and (max-width: 769px) {
1488 .top { 1523 .top {
1489 margin-top: 0 !important; 1524 margin-top: 0 !important;
1490 } 1525 }
1491 .userSearch .v-icon { 1526 .userSearch .v-icon {
1492 font-size: 20px !important; 1527 font-size: 20px !important;
1493 margin-left: 20px; 1528 margin-left: 20px;
1494 } 1529 }
1495 } 1530 }
1496 1531
1497 @media screen and (max-width: 380px) { 1532 @media screen and (max-width: 380px) {
1498 .pl-3 { 1533 .pl-3 {
1499 padding-left: 0px !important; 1534 padding-left: 0px !important;
1500 } 1535 }
1501 .right { 1536 .right {
1502 float: none !important; 1537 float: none !important;
1503 } 1538 }
1504 .subheading { 1539 .subheading {
1505 font-size: 14px !important; 1540 font-size: 14px !important;
1506 } 1541 }
1507 .v-card__actions .v-btn { 1542 .v-card__actions .v-btn {
1508 margin: 0 0px; 1543 margin: 0 0px;
1509 min-width: 100px; 1544 min-width: 100px;
1510 } 1545 }
1511 .presentInput{ 1546 .presentInput {
1512 padding-left:48px !important; 1547 padding-left: 48px !important;
1513 } 1548 }
1514 /* .searchIcon .v-icon { 1549 /* .searchIcon .v-icon {
1515 font-size: 20px; 1550 font-size: 20px;
1516 margin-left: 20px; 1551 margin-left: 20px;
1517 } */ 1552 } */
1518 .subheading { 1553 .subheading {
1519 font-size: 12px !important; 1554 font-size: 12px !important;
1520 } 1555 }
1521 h5 { 1556 h5 {
1522 font-size: 13px; 1557 font-size: 13px;
1523 } 1558 }
1524 .pl-4{ 1559 .pl-4 {
1525 padding-left: 0px !important; 1560 padding-left: 0px !important;
1526
1527 } 1561 }
1528 } 1562 }
1529 .v-icon { 1563 .v-icon {
1530 font-size: 30px; 1564 font-size: 30px;
1531 } 1565 }
1532 @media screen and (min-width: 1270px) { 1566 @media screen and (min-width: 1270px) {
1533 .hide { 1567 .hide {
1534 display: none; 1568 display: none;
1535 } 1569 }
1536 /* } 1570 /* }
1537 @media screen and (max-width: 962px) { 1571 @media screen and (max-width: 962px) {
1538 .imglogo{ 1572 .imglogo{
1539 position: absolute; 1573 position: absolute;
1540 top: 13px; 1574 top: 13px;
1541 left: 13px !important; 1575 left: 13px !important;
1542 width: 70px; 1576 width: 70px;
1543 height: 24px; 1577 height: 24px;
1544 } */ 1578 } */
1545 } 1579 }
1546 @media screen and (max-width: 420px) { 1580 @media screen and (max-width: 420px) {
1547 .userSearch .v-text-field .v-label { 1581 .userSearch .v-text-field .v-label {
1548 line-height: 24px !important; 1582 line-height: 24px !important;
1549 } 1583 }
1550 .userSearch .v-label { 1584 .userSearch .v-label {
1551 font-size: 13px !important; 1585 font-size: 13px !important;
1552 } 1586 }
1553 .v-list__tile { 1587 .v-list__tile {
1554 font-size: 14px; 1588 font-size: 14px;
1555 padding: 0 10px; 1589 padding: 0 10px;
1556 } 1590 }
src/pages/TimeTable/timeTable.vue
1 <template> 1 <template>
2 <v-app id="pages-dasboard"> 2 <v-app id="pages-dasboard">
3 <v-toolbar class="fixcolors" fixed app> 3 <v-toolbar class="fixcolors" fixed app>
4 <v-toolbar-title class="ml-0 pl-3"> 4 <v-toolbar-title class="ml-0 pl-3">
5 <v-toolbar-side-icon @click.stop="handleDrawerToggle" class="hide"></v-toolbar-side-icon> 5 <v-toolbar-side-icon @click.stop="handleDrawerToggle" class="hide"></v-toolbar-side-icon>
6 </v-toolbar-title> 6 </v-toolbar-title>
7 <!-- ****** SEARCH ALL EXISTING TIME-TABLE ****** --> 7 <!-- ****** SEARCH ALL EXISTING TIME-TABLE ****** -->
8 <v-flex xs7 sm3 class="userSearch"> 8 <v-flex xs7 sm3 class="userSearch">
9 <v-text-field 9 <v-text-field
10 flat 10 flat
11 append-icon="search" 11 append-icon="search"
12 label="Find your Time Talbe" 12 label="Find your Time Talbe"
13 v-model="search" 13 v-model="search"
14 color="white" 14 color="white"
15 dark 15 dark
16 ></v-text-field> 16 ></v-text-field>
17 </v-flex> 17 </v-flex>
18 <v-spacer></v-spacer> 18 <v-spacer></v-spacer>
19 <v-menu offset-y origin="center center" :nudge-bottom="10" transition="scale-transition"> 19 <v-menu offset-y origin="center center" :nudge-bottom="10" transition="scale-transition">
20 <v-btn icon large flat slot="activator"> 20 <v-btn icon large flat slot="activator">
21 <v-avatar size="40px"> 21 <v-avatar size="40px">
22 <img src="/static/icon/user.png" /> 22 <img src="/static/icon/user.png" />
23 </v-avatar> 23 </v-avatar>
24 </v-btn> 24 </v-btn>
25 <v-list class="pa-0"> 25 <v-list class="pa-0">
26 <v-list-tile 26 <v-list-tile
27 v-for="(item,index) in items" 27 v-for="(item,index) in items"
28 :to="!item.href ? { name: item.name } : null" 28 :to="!item.href ? { name: item.name } : null"
29 :href="item.href" 29 :href="item.href"
30 @click="item.click" 30 @click="item.click"
31 ripple="ripple" 31 ripple="ripple"
32 :disabled="item.disabled" 32 :disabled="item.disabled"
33 :target="item.target" 33 :target="item.target"
34 rel="noopener" 34 rel="noopener"
35 :key="index" 35 :key="index"
36 > 36 >
37 <v-list-tile-action v-if="item.icon"> 37 <v-list-tile-action v-if="item.icon">
38 <v-icon>{{ item.icon }}</v-icon> 38 <v-icon>{{ item.icon }}</v-icon>
39 </v-list-tile-action> 39 </v-list-tile-action>
40 <v-list-tile-content> 40 <v-list-tile-content>
41 <v-list-tile-title>{{ item.title }}</v-list-tile-title> 41 <v-list-tile-title>{{ item.title }}</v-list-tile-title>
42 </v-list-tile-content> 42 </v-list-tile-content>
43 </v-list-tile> 43 </v-list-tile>
44 </v-list> 44 </v-list>
45 </v-menu> 45 </v-menu>
46 </v-toolbar> 46 </v-toolbar>
47 <v-tabs grow slider-color="black"> 47 <v-tabs grow slider-color="black">
48 <v-tab 48 <v-tab
49 ripple 49 ripple
50 @click="activeTab('existing')" 50 @click="activeTab('existing')"
51 v-bind:class="{ active: isActive }" 51 v-bind:class="{ active: isActive }"
52 id="tab" 52 id="tab"
53 class="subheading" 53 class="subheading"
54 >Existing Time Table</v-tab> 54 >Existing Time Table</v-tab>
55 <v-tab 55 <v-tab
56 ripple 56 ripple
57 @click="activeTab('new')" 57 @click="activeTab('new')"
58 v-bind:class="{ active: newActive }" 58 v-bind:class="{ active: newActive }"
59 id="tab1" 59 id="tab1"
60 User 60 User
61 class="subheading" 61 class="subheading"
62 >Add New Time Table</v-tab> 62 >Add New Time Table</v-tab>
63 63
64 <!-- ****** EDITS TIME-TABLE****** --> 64 <!-- ****** EDITS TIME-TABLE****** -->
65 65
66 <v-tab-item> 66 <v-tab-item>
67 <v-snackbar 67 <v-snackbar
68 :timeout="timeout" 68 :timeout="timeout"
69 :top="y === 'top'" 69 :top="y === 'top'"
70 :right="x === 'right'" 70 :right="x === 'right'"
71 :vertical="mode === 'vertical'" 71 :vertical="mode === 'vertical'"
72 v-model="snackbar" 72 v-model="snackbar"
73 color="success" 73 color="success"
74 >{{ text }}</v-snackbar> 74 >{{ text }}</v-snackbar>
75 <v-dialog v-model="dialog" max-width="1000px"> 75 <v-dialog v-model="dialog" max-width="1000px">
76 <v-flex xs12 sm12 class> 76 <v-flex xs12 sm12 class>
77 <v-toolbar color="grey lighten-2"> 77 <v-toolbar color="grey lighten-2">
78 <v-spacer></v-spacer> 78 <v-spacer></v-spacer>
79 <v-toolbar-title> 79 <v-toolbar-title>
80 <h3>Edit Time Table</h3> 80 <h3>Edit Time Table</h3>
81 </v-toolbar-title> 81 </v-toolbar-title>
82 <v-spacer></v-spacer> 82 <v-spacer></v-spacer>
83 </v-toolbar> 83 </v-toolbar>
84 <v-card flat> 84 <v-card flat>
85 <v-form ref="form"> 85 <v-form ref="form">
86 <v-container fluid> 86 <v-container fluid>
87 <v-layout> 87 <v-layout>
88 <v-flex 88 <v-flex
89 xs12 89 xs12
90 class="text-xs-center text-sm-center text-md-center text-lg-center mr-4" 90 class="text-xs-center text-sm-center text-md-center text-lg-center mr-4"
91 > 91 >
92 <v-avatar size="100px"> 92 <v-avatar size="100px">
93 <img src="/static/icon/user.png" v-if="!imageUrl" /> 93 <img src="/static/icon/user.png" v-if="!imageUrl" />
94 </v-avatar> 94 </v-avatar>
95 <input 95 <input
96 type="file" 96 type="file"
97 style="display: none" 97 style="display: none"
98 ref="image" 98 ref="image"
99 accept="image/*" 99 accept="image/*"
100 @change="onFilePicked" 100 @change="onFilePicked"
101 /> 101 />
102 <img 102 <img
103 :src="imageData.imageUrl" 103 :src="imageData.imageUrl"
104 height="150" 104 height="150"
105 v-if="imageUrl" 105 v-if="imageUrl"
106 style="border-radius:50%; width:200px" 106 style="border-radius:50%; width:200px"
107 /> 107 />
108 </v-flex> 108 </v-flex>
109 </v-layout> 109 </v-layout>
110 <v-flex xs12 sm12> 110 <v-flex xs12 sm12>
111 <v-layout> 111 <v-layout>
112 <v-flex xs4 class="pt-4 subheading"> 112 <v-flex xs4 class="pt-4 subheading">
113 <label class="right">class No:</label> 113 <label class="right">class No:</label>
114 </v-flex> 114 </v-flex>
115 <v-flex xs12 sm5 class="ml-3"> 115 <v-flex xs12 sm5 class="ml-3">
116 <v-select 116 <v-select
117 :items="addclass" 117 :items="addclass"
118 label="Select Class" 118 label="Select Class"
119 v-model="editedItem.classNum" 119 v-model="editedItem.classNum"
120 item-text="classNum" 120 item-text="classNum"
121 item-value="_id" 121 item-value="_id"
122 @change="getSections(editedItem.classNum)" 122 @change="getSections(editedItem.classNum)"
123 ></v-select> 123 ></v-select>
124 </v-flex> 124 </v-flex>
125 </v-layout> 125 </v-layout>
126 </v-flex> 126 </v-flex>
127 <v-flex xs12 sm12> 127 <v-flex xs12 sm12>
128 <v-layout> 128 <v-layout>
129 <v-flex xs4 class="pt-4 subheading"> 129 <v-flex xs4 class="pt-4 subheading">
130 <label class="right">Section Name:</label> 130 <label class="right">Section Name:</label>
131 </v-flex> 131 </v-flex>
132 <v-flex xs5 class="ml-3"> 132 <v-flex xs5 class="ml-3">
133 <v-select 133 <v-select
134 :items="addSection" 134 :items="addSection"
135 label="Select Section" 135 label="Select Section"
136 v-model="editedItem.selectSection" 136 v-model="editedItem.selectSection"
137 item-text="name" 137 item-text="name"
138 item-value="_id" 138 item-value="_id"
139 ></v-select> 139 ></v-select>
140 </v-flex> 140 </v-flex>
141 </v-layout> 141 </v-layout>
142 </v-flex> 142 </v-flex>
143 <v-layout> 143 <v-layout>
144 <v-flex xs12 sm8 offset-sm2> 144 <v-flex xs12 sm8 offset-sm2>
145 <v-card-actions> 145 <v-card-actions>
146 <v-btn round dark @click.native="close">Cancel</v-btn> 146 <v-btn round dark @click.native="close">Cancel</v-btn>
147 <v-spacer></v-spacer> 147 <v-spacer></v-spacer>
148 <v-btn round dark @click="save">Save</v-btn> 148 <v-btn round dark @click="save">Save</v-btn>
149 </v-card-actions> 149 </v-card-actions>
150 </v-flex> 150 </v-flex>
151 </v-layout> 151 </v-layout>
152 </v-container> 152 </v-container>
153 </v-form> 153 </v-form>
154 </v-card> 154 </v-card>
155 </v-flex> 155 </v-flex>
156 </v-dialog> 156 </v-dialog>
157 157
158 <!-- ****** ADD LECTURES IN TIME-TABLE ****** --> 158 <!-- ****** ADD LECTURES IN TIME-TABLE ****** -->
159 159
160 <v-dialog v-model="dialogAddLecture" max-width="1000px"> 160 <v-dialog v-model="dialogAddLecture" max-width="1000px">
161 <v-flex xs12 sm12> 161 <v-flex xs12 sm12>
162 <v-toolbar color="grey lighten-2"> 162 <v-toolbar color="grey lighten-2">
163 <v-spacer></v-spacer> 163 <v-spacer></v-spacer>
164 <v-toolbar-title> 164 <v-toolbar-title>
165 <h3>Add Lecture</h3> 165 <h3>Add Lecture</h3>
166 </v-toolbar-title> 166 </v-toolbar-title>
167 <v-spacer></v-spacer> 167 <v-spacer></v-spacer>
168 </v-toolbar> 168 </v-toolbar>
169 <v-card flat> 169 <v-card flat>
170 <v-form ref="lectureForm" v-model="valid" lazy-validation> 170 <v-form ref="lectureForm" v-model="valid" lazy-validation>
171 <v-container fluid> 171 <v-container fluid>
172 <v-flex xs12 sm12> 172 <v-flex xs12 sm12>
173 <v-layout> 173 <v-layout>
174 <v-flex xs4 class="pt-4 subheading"> 174 <v-flex xs4 class="pt-4 subheading">
175 <label class="right">Subject Name:</label> 175 <label class="right">Subject Name:</label>
176 </v-flex> 176 </v-flex>
177 <v-flex xs5 class="ml-3"> 177 <v-flex xs5 class="ml-3">
178 <v-text-field 178 <v-text-field
179 v-model="addlectures.subjectName" 179 v-model="addlectures.subjectName"
180 :rules="subjectNameRules" 180 :rules="subjectNameRules"
181 placeholder="fill your Subject Name" 181 placeholder="fill your Subject Name"
182 type="text" 182 type="text"
183 ></v-text-field> 183 ></v-text-field>
184 </v-flex> 184 </v-flex>
185 </v-layout> 185 </v-layout>
186 </v-flex> 186 </v-flex>
187 <v-flex xs12 sm12> 187 <v-flex xs12 sm12>
188 <v-layout> 188 <v-layout>
189 <v-flex xs4 class="pt-4 subheading"> 189 <v-flex xs4 class="pt-4 subheading">
190 <label class="right">Time In:</label> 190 <label class="right">Time In:</label>
191 </v-flex> 191 </v-flex>
192 <v-flex xs5 class="ml-3"> 192 <v-flex xs5 class="ml-3">
193 <v-menu 193 <v-menu
194 ref="menuD" 194 ref="menuD"
195 :close-on-content-click="false" 195 :close-on-content-click="false"
196 v-model="menu5" 196 v-model="menu5"
197 :nudge-right="40" 197 :nudge-right="40"
198 lazy 198 lazy
199 transition="scale-transition" 199 transition="scale-transition"
200 offset-y 200 offset-y
201 full-width 201 full-width
202 max-width="290px" 202 max-width="290px"
203 min-width="290px" 203 min-width="290px"
204 > 204 >
205 <v-text-field 205 <v-text-field
206 slot="activator" 206 slot="activator"
207 v-model="addlectures.timeIn" 207 v-model="addlectures.timeIn"
208 label="Select your Time In" 208 label="Select your Time In"
209 append-icon="access_time" 209 append-icon="access_time"
210 :rules="timeInRules" 210 :rules="timeInRules"
211 ></v-text-field> 211 ></v-text-field>
212 <v-time-picker v-model="addlectures.timeIn" @change="menu5 = false"></v-time-picker> 212 <v-time-picker v-model="addlectures.timeIn" @change="menu5 = false"></v-time-picker>
213 </v-menu> 213 </v-menu>
214 </v-flex> 214 </v-flex>
215 </v-layout> 215 </v-layout>
216 </v-flex> 216 </v-flex>
217 <v-flex xs12 sm12> 217 <v-flex xs12 sm12>
218 <v-layout> 218 <v-layout>
219 <v-flex xs4 class="pt-4 subheading"> 219 <v-flex xs4 class="pt-4 subheading">
220 <label class="right">Time Out:</label> 220 <label class="right">Time Out:</label>
221 </v-flex> 221 </v-flex>
222 <v-flex xs5 class="ml-3"> 222 <v-flex xs5 class="ml-3">
223 <v-menu 223 <v-menu
224 ref="menuE" 224 ref="menuE"
225 :close-on-content-click="false" 225 :close-on-content-click="false"
226 v-model="menu6" 226 v-model="menu6"
227 :nudge-right="40" 227 :nudge-right="40"
228 lazy 228 lazy
229 transition="scale-transition" 229 transition="scale-transition"
230 offset-y 230 offset-y
231 full-width 231 full-width
232 max-width="290px" 232 max-width="290px"
233 min-width="290px" 233 min-width="290px"
234 > 234 >
235 <v-text-field 235 <v-text-field
236 slot="activator" 236 slot="activator"
237 :rules="timeOutRules" 237 :rules="timeOutRules"
238 v-model="addlectures.timeOut" 238 v-model="addlectures.timeOut"
239 label="Select your Time Out" 239 label="Select your Time Out"
240 append-icon="access_time" 240 append-icon="access_time"
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 v-model="addlectures.teacherId" 255 v-model="addlectures.teacherId"
256 :rules="subjectNameRules" 256 :rules="subjectNameRules"
257 item-text="name" 257 item-text="name"
258 item-value="_id" 258 item-value="_id"
259 required 259 required
260 ></v-select> 260 ></v-select>
261 </v-flex> 261 </v-flex>
262 </v-layout> 262 </v-layout>
263 </v-flex> 263 </v-flex>
264 <v-layout> 264 <v-layout>
265 <v-flex xs12 sm8 offset-sm2> 265 <v-flex xs12 sm8 offset-sm2>
266 <v-card-actions> 266 <v-card-actions>
267 <v-btn round dark @click.native="closedialogLecture">Cancel</v-btn> 267 <v-btn round dark @click.native="closedialogLecture">Cancel</v-btn>
268 <v-spacer></v-spacer> 268 <v-spacer></v-spacer>
269 <v-btn round dark @click="AddLecture">Save</v-btn> 269 <v-btn round dark @click="AddLecture">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="1000px"> 281 <v-dialog v-model="dialogUpdateLectures" max-width="1000px">
282 <v-flex xs12 sm12 class> 282 <v-flex xs12 sm12 class>
283 <v-toolbar color="grey lighten-2"> 283 <v-toolbar color="grey lighten-2">
284 <v-spacer></v-spacer> 284 <v-spacer></v-spacer>
285 <v-toolbar-title>Edit Lecture</v-toolbar-title> 285 <v-toolbar-title>Edit Lecture</v-toolbar-title>
286 <v-spacer></v-spacer> 286 <v-spacer></v-spacer>
287 </v-toolbar> 287 </v-toolbar>
288 <v-card flat> 288 <v-card flat>
289 <v-form ref="form"> 289 <v-form ref="form">
290 <v-container fluid> 290 <v-container fluid>
291 <v-flex xs12 sm12> 291 <v-flex xs12 sm12>
292 <v-layout> 292 <v-layout>
293 <v-flex xs4 class="pt-4 subheading"> 293 <v-flex xs4 class="pt-4 subheading">
294 <label class="right">Subject Name:</label> 294 <label class="right">Subject Name:</label>
295 </v-flex> 295 </v-flex>
296 <v-flex xs5 class="ml-3"> 296 <v-flex xs5 class="ml-3">
297 <v-text-field 297 <v-text-field
298 v-model="updateLectures.subjectName" 298 v-model="updateLectures.subjectName"
299 placeholder="fill your Subject Name" 299 placeholder="fill your Subject Name"
300 type="text" 300 type="text"
301 ></v-text-field> 301 ></v-text-field>
302 </v-flex> 302 </v-flex>
303 </v-layout> 303 </v-layout>
304 </v-flex> 304 </v-flex>
305 <v-flex xs12 sm12> 305 <v-flex xs12 sm12>
306 <v-layout> 306 <v-layout>
307 <v-flex xs4 class="pt-4 subheading"> 307 <v-flex xs4 class="pt-4 subheading">
308 <label class="right">Time In:</label> 308 <label class="right">Time In:</label>
309 </v-flex> 309 </v-flex>
310 <v-flex xs5 class="ml-3"> 310 <v-flex xs5 class="ml-3">
311 <v-menu 311 <v-menu
312 ref="menuC" 312 ref="menuC"
313 :close-on-content-click="false" 313 :close-on-content-click="false"
314 v-model="menu4" 314 v-model="menu4"
315 :nudge-right="40" 315 :nudge-right="40"
316 lazy 316 lazy
317 transition="scale-transition" 317 transition="scale-transition"
318 offset-y 318 offset-y
319 full-width 319 full-width
320 max-width="290px" 320 max-width="290px"
321 min-width="290px" 321 min-width="290px"
322 > 322 >
323 <v-text-field 323 <v-text-field
324 slot="activator" 324 slot="activator"
325 v-model="updateLectures.timeIn" 325 v-model="updateLectures.timeIn"
326 placeholder="Select your Time In" 326 placeholder="Select your Time In"
327 append-icon="access_time" 327 append-icon="access_time"
328 ></v-text-field> 328 ></v-text-field>
329 <v-time-picker v-model="updateLectures.timeIn" @change="menu4= false"></v-time-picker> 329 <v-time-picker v-model="updateLectures.timeIn" @change="menu4= false"></v-time-picker>
330 </v-menu> 330 </v-menu>
331 </v-flex> 331 </v-flex>
332 </v-layout> 332 </v-layout>
333 </v-flex> 333 </v-flex>
334 <v-flex xs12 sm12> 334 <v-flex xs12 sm12>
335 <v-layout> 335 <v-layout>
336 <v-flex xs4 class="pt-4 subheading"> 336 <v-flex xs4 class="pt-4 subheading">
337 <label class="right">Time Out:</label> 337 <label class="right">Time Out:</label>
338 </v-flex> 338 </v-flex>
339 <v-flex xs5 class="ml-3"> 339 <v-flex xs5 class="ml-3">
340 <v-menu 340 <v-menu
341 ref="menuB" 341 ref="menuB"
342 :close-on-content-click="false" 342 :close-on-content-click="false"
343 v-model="menu3" 343 v-model="menu3"
344 :nudge-right="40" 344 :nudge-right="40"
345 lazy 345 lazy
346 transition="scale-transition" 346 transition="scale-transition"
347 offset-y 347 offset-y
348 full-width 348 full-width
349 max-width="290px" 349 max-width="290px"
350 min-width="290px" 350 min-width="290px"
351 > 351 >
352 <v-text-field 352 <v-text-field
353 slot="activator" 353 slot="activator"
354 v-model="updateLectures.timeOut" 354 v-model="updateLectures.timeOut"
355 placeholder="Select your Time Out" 355 placeholder="Select your Time Out"
356 append-icon="access_time" 356 append-icon="access_time"
357 ></v-text-field> 357 ></v-text-field>
358 <v-time-picker v-model="updateLectures.timeOut" @change="menu3 = false"></v-time-picker> 358 <v-time-picker v-model="updateLectures.timeOut" @change="menu3 = false"></v-time-picker>
359 </v-menu> 359 </v-menu>
360 </v-flex> 360 </v-flex>
361 </v-layout> 361 </v-layout>
362 </v-flex> 362 </v-flex>
363 <v-flex xs12 sm12> 363 <v-flex xs12 sm12>
364 <v-layout> 364 <v-layout>
365 <v-flex xs4 class="pt-4 subheading"> 365 <v-flex xs4 class="pt-4 subheading">
366 <label class="right">Select Teacher:</label> 366 <label class="right">Select Teacher:</label>
367 </v-flex> 367 </v-flex>
368 <v-flex xs5 class="ml-3"> 368 <v-flex xs5 class="ml-3">
369 <v-select 369 <v-select
370 :items="addTeachers" 370 :items="addTeachers"
371 label="Select Teacher" 371 label="Select Teacher"
372 v-model="updateLectures.teacherId" 372 v-model="updateLectures.teacherId"
373 item-text="name" 373 item-text="name"
374 item-value="_id" 374 item-value="_id"
375 required 375 required
376 ></v-select> 376 ></v-select>
377 </v-flex> 377 </v-flex>
378 </v-layout> 378 </v-layout>
379 </v-flex> 379 </v-flex>
380 <v-layout> 380 <v-layout>
381 <v-flex xs12 sm8 offset-sm2> 381 <v-flex xs12 sm8 offset-sm2>
382 <v-card-actions> 382 <v-card-actions>
383 <v-btn round dark @click.native="closeUpdateLectures">Cancel</v-btn> 383 <v-btn round dark @click.native="closeUpdateLectures">Cancel</v-btn>
384 <v-spacer></v-spacer> 384 <v-spacer></v-spacer>
385 <v-btn 385 <v-btn
386 round 386 round
387 dark 387 dark
388 @click="updateParticularTable(updateLectures.timeIn,updateLectures.timeOut)" 388 @click="updateParticularTable(updateLectures.timeIn,updateLectures.timeOut)"
389 >Save</v-btn> 389 >Save</v-btn>
390 </v-card-actions> 390 </v-card-actions>
391 </v-flex> 391 </v-flex>
392 </v-layout> 392 </v-layout>
393 </v-container> 393 </v-container>
394 </v-form> 394 </v-form>
395 </v-card> 395 </v-card>
396 </v-flex> 396 </v-flex>
397 </v-dialog> 397 </v-dialog>
398 <v-snackbar 398 <v-snackbar
399 :timeout="timeout" 399 :timeout="timeout"
400 :top="y === 'top'" 400 :top="y === 'top'"
401 :right="x === 'right'" 401 :right="x === 'right'"
402 :vertical="mode === 'vertical'" 402 :vertical="mode === 'vertical'"
403 v-model="snackbar" 403 v-model="snackbar"
404 color="success" 404 color="success"
405 >{{ text }}</v-snackbar> 405 >{{ text }}</v-snackbar>
406 406
407 <!-- ****** EXISTING-USERS TIME-TABLE ****** --> 407 <!-- ****** EXISTING-USERS TIME-TABLE ****** -->
408 408
409 <v-card flat> 409 <v-card flat>
410 <v-card-actions> 410 <v-card-actions>
411 <v-layout> 411 <v-layout>
412 <label class="right mt-4 ml-5">Select Class:</label> 412 <label class="right mt-4 ml-5">Select Class:</label>
413 <v-select 413 <v-select
414 :items="addclass" 414 :items="addclass"
415 label="Select Class" 415 label="Select Class"
416 v-model="selectTimeTable.select" 416 v-model="selectTimeTable.select"
417 item-text="classNum" 417 item-text="classNum"
418 item-value="_id" 418 item-value="_id"
419 name="Select Class" 419 name="Select Class"
420 @change="getSections(selectTimeTable.select)" 420 @change="getSections(selectTimeTable.select)"
421 class="px-4" 421 class="px-4"
422 required 422 required
423 ></v-select> 423 ></v-select>
424 <label class="right mt-4">Select Section:</label> 424 <label class="right mt-4">Select Section:</label>
425 <v-select 425 <v-select
426 :items="addSection" 426 :items="addSection"
427 label="Select Section" 427 label="Select Section"
428 v-model="selectTimeTable.selectSection" 428 v-model="selectTimeTable.selectSection"
429 item-text="name" 429 item-text="name"
430 item-value="_id" 430 item-value="_id"
431 name="Select Section" 431 name="Select Section"
432 class="pl-3" 432 class="pl-3"
433 required 433 required
434 ></v-select> 434 ></v-select>
435 </v-layout> 435 </v-layout>
436 <v-spacer></v-spacer> 436 <v-spacer></v-spacer>
437 <v-btn @click="findTimeTable()" round dark :loading="loading" class="left">Find</v-btn> 437 <v-btn @click="findTimeTable()" round dark :loading="loading" class="left">Find</v-btn>
438 </v-card-actions> 438 </v-card-actions>
439 </v-card> 439 </v-card>
440 <v-flex xs12> 440 <v-flex xs12>
441 <v-data-table 441 <v-data-table
442 :headers="headers" 442 :headers="headers"
443 :items="desserts" 443 :items="desserts"
444 :pagination.sync="pagination" 444 :pagination.sync="pagination"
445 :search="search" 445 :search="search"
446 item-key="_id" 446 item-key="_id"
447 > 447 >
448 <template slot="items" slot-scope="props"> 448 <template slot="items" slot-scope="props">
449 <tr 449 <tr
450 style="cursor: pointer;" 450 style="cursor: pointer;"
451 @click="getTimeTable(props.item), props.expanded = !props.expanded" 451 @click="getTimeTable(props.item), props.expanded = !props.expanded"
452 > 452 >
453 <td class="text-xs-center">{{ props.index }}</td> 453 <td class="text-xs-center">{{ props.index }}</td>
454 <td class="text-xs-center">{{ props.item.classData.classNum}}</td> 454 <td class="text-xs-center">{{ props.item.classData.classNum}}</td>
455 <td class="text-xs-center">{{ props.item.sectionData.name }}</td> 455 <td class="text-xs-center">{{ props.item.sectionData.name }}</td>
456 <td class="text-xs-center"> 456 <td class="text-xs-center">
457 <span> 457 <span>
458 <img 458 <img
459 style="cursor:pointer; width:20px; height:18px; " 459 style="cursor:pointer; width:20px; height:18px; "
460 class="mr-5" 460 class="mr-5"
461 @click="editItem(props.item)" 461 @click="editItem(props.item)"
462 src="/static/icon/edit1.png" 462 src="/static/icon/edit1.png"
463 /> 463 />
464 <img 464 <img
465 style="cursor:pointer; height:20px; " 465 style="cursor:pointer; height:20px; "
466 class="mr-5" 466 class="mr-5"
467 @click="deleteItem(props.item)" 467 @click="deleteItem(props.item)"
468 src="/static/icon/delete1.png" 468 src="/static/icon/delete1.png"
469 /> 469 />
470 </span> 470 </span>
471 </td> 471 </td>
472 </tr> 472 </tr>
473 </template> 473 </template>
474 <template slot="expand" slot-scope="props"> 474 <template slot="expand" slot-scope="props">
475 <v-data-table 475 <v-data-table
476 :items="timeTableList.schedule" 476 :items="timeTableList.schedule"
477 hide-actions 477 hide-actions
478 item-key="title" 478 item-key="title"
479 style="width: auto;" 479 style="width: auto;"
480 > 480 >
481 <template slot="items" slot-scope="props"> 481 <template slot="items" slot-scope="props">
482 <tr> 482 <tr>
483 <td class="text-xs-left subheading table-td"> 483 <td class="text-xs-left subheading table-td">
484 <b>{{ props.item.day }}</b> 484 <b>{{ props.item.day }}</b>
485 </td> 485 </td>
486 <td class="table-td"> 486 <td class="table-td">
487 <b>Subject</b> 487 <b>Subject</b>
488 <br /> 488 <br />
489 <b>Time In</b> 489 <b>Time In</b>
490 <br /> 490 <br />
491 <b>Time Out</b> 491 <b>Time Out</b>
492 </td> 492 </td>
493 <td v-for="list in props.item.lectures" class="table-td"> 493 <td v-for="list in props.item.lectures" class="table-td">
494 <b>{{ list.subjectName }}</b> 494 <b>{{ list.subjectName }}</b>
495 <img 495 <img
496 style="cursor:pointer; width:20px; height:18px; " 496 style="cursor:pointer; width:20px; height:18px; "
497 class="mr-2 ml-2" 497 class="mr-2 ml-2"
498 src="/static/icon/edit1.png" 498 src="/static/icon/edit1.png"
499 @click="updateTimeTable(list, timeTableList)" 499 @click="updateTimeTable(list, timeTableList)"
500 /> 500 />
501 <img 501 <img
502 style="cursor:pointer; height:20px; " 502 style="cursor:pointer; height:20px; "
503 src="/static/icon/delete1.png" 503 src="/static/icon/delete1.png"
504 @click="deleteTimeTable(list,props.item.lectures)" 504 @click="deleteTimeTable(list,props.item.lectures)"
505 /> 505 />
506 <br /> 506 <br />
507 {{list.timeIn}} 507 {{list.timeIn}}
508 <br /> 508 <br />
509 {{list.timeOut}} 509 {{list.timeOut}}
510 </td> 510 </td>
511 <td> 511 <td>
512 <v-icon 512 <v-icon
513 color="black" 513 color="black"
514 @click="addLecture(props.item._id, timeTableList._id)" 514 @click="addLecture(props.item._id, timeTableList._id)"
515 >add_circle_outline</v-icon> 515 >add_circle_outline</v-icon>
516 </td> 516 </td>
517 </tr> 517 </tr>
518 </template> 518 </template>
519 </v-data-table> 519 </v-data-table>
520 </template> 520 </template>
521 <v-alert 521 <v-alert
522 slot="no-results" 522 slot="no-results"
523 :value="true" 523 :value="true"
524 color="error" 524 color="error"
525 icon="warning" 525 icon="warning"
526 >Your search for "{{ search }}" found no results.</v-alert> 526 >Your search for "{{ search }}" found no results.</v-alert>
527 </v-data-table> 527 </v-data-table>
528 <br /> 528 <br />
529 <br /> 529 <br />
530 </v-flex> 530 </v-flex>
531 </v-tab-item> 531 </v-tab-item>
532 532
533 <!-- ****** ADD MULTIPLE TIME-TABLE ****** --> 533 <!-- ****** ADD MULTIPLE TIME-TABLE ****** -->
534 534
535 <v-tab-item> 535 <v-tab-item>
536 <v-container> 536 <v-container>
537 <v-snackbar 537 <v-snackbar
538 :timeout="timeout" 538 :timeout="timeout"
539 :top="y === 'top'" 539 :top="y === 'top'"
540 :right="x === 'right'" 540 :right="x === 'right'"
541 :vertical="mode === 'vertical'" 541 :vertical="mode === 'vertical'"
542 v-model="snackbar" 542 v-model="snackbar"
543 color="success" 543 color="success"
544 >{{ text }}</v-snackbar> 544 >{{ text }}</v-snackbar>
545 <v-flex xs12 sm12 class="my-4"> 545 <v-flex xs12 sm12 class="my-4">
546 <v-card flat> 546 <v-card flat>
547 <v-form ref="form" v-model="valid" lazy-validation> 547 <v-form ref="form" v-model="valid" lazy-validation>
548 <v-container fluid> 548 <v-container fluid>
549 <v-layout> 549 <v-layout>
550 <v-flex 550 <v-flex
551 xs12 551 xs12
552 class="text-xs-center text-sm-center text-md-center text-lg-center my-4 mr-4" 552 class="text-xs-center text-sm-center text-md-center text-lg-center my-4 mr-4"
553 > 553 >
554 <v-avatar size="100px"> 554 <v-avatar size="100px">
555 <img src="/static/icon/user.png" v-if="!imageUrl" /> 555 <img src="/static/icon/user.png" v-if="!imageUrl" />
556 </v-avatar> 556 </v-avatar>
557 <input 557 <input
558 type="file" 558 type="file"
559 style="display: none" 559 style="display: none"
560 ref="image" 560 ref="image"
561 accept="image/*" 561 accept="image/*"
562 @change="onFilePicked" 562 @change="onFilePicked"
563 /> 563 />
564 <img 564 <img
565 :src="imageData.imageUrl" 565 :src="imageData.imageUrl"
566 height="150" 566 height="150"
567 v-if="imageUrl" 567 v-if="imageUrl"
568 style="border-radius:50%; width:200px" 568 style="border-radius:50%; width:200px"
569 /> 569 />
570 </v-flex> 570 </v-flex>
571 </v-layout> 571 </v-layout>
572 <v-flex xs12> 572 <v-flex xs12>
573 <v-layout> 573 <v-layout>
574 <v-flex xs4 class="pt-4 subheading"> 574 <v-flex xs4 class="pt-4 subheading">
575 <label class="right">Select Class:</label> 575 <label class="right">Select Class:</label>
576 </v-flex> 576 </v-flex>
577 <v-flex xs4 class="ml-3"> 577 <v-flex xs4 class="ml-3">
578 <v-select 578 <v-select
579 :items="addclass" 579 :items="addclass"
580 label="Select Class" 580 label="Select Class"
581 v-model="timeTable.select" 581 v-model="timeTable.select"
582 item-text="classNum" 582 item-text="classNum"
583 item-value="_id" 583 item-value="_id"
584 @change="getSections(timeTable.select)" 584 @change="getSections(timeTable.select)"
585 required 585 required
586 ></v-select> 586 ></v-select>
587 </v-flex> 587 </v-flex>
588 </v-layout> 588 </v-layout>
589 </v-flex> 589 </v-flex>
590 <v-flex xs12> 590 <v-flex xs12>
591 <v-layout> 591 <v-layout>
592 <v-flex xs4 class="pt-4 subheading"> 592 <v-flex xs4 class="pt-4 subheading">
593 <label class="right">Select Section:</label> 593 <label class="right">Select Section:</label>
594 </v-flex> 594 </v-flex>
595 <v-flex xs4 class="ml-3"> 595 <v-flex xs4 class="ml-3">
596 <v-select 596 <v-select
597 :items="addSection" 597 :items="addSection"
598 label="Select Section" 598 label="Select Section"
599 v-model="timeTable.selectSection" 599 v-model="timeTable.selectSection"
600 item-text="name" 600 item-text="name"
601 item-value="_id" 601 item-value="_id"
602 required 602 required
603 ></v-select> 603 ></v-select>
604 </v-flex> 604 </v-flex>
605 </v-layout> 605 </v-layout>
606 </v-flex> 606 </v-flex>
607 <v-flex xs12> 607 <v-flex xs12>
608 <v-layout> 608 <v-layout>
609 <v-flex xs4 class="pt-4 subheading"> 609 <v-flex xs4 class="pt-4 subheading">
610 <label class="right">Select Teacher:</label> 610 <label class="right">Select Teacher:</label>
611 </v-flex> 611 </v-flex>
612 <v-flex xs4 class="ml-3"> 612 <v-flex xs4 class="ml-3">
613 <v-select 613 <v-select
614 :items="addTeachers" 614 :items="addTeachers"
615 label="Select Teacher" 615 label="Select Teacher"
616 v-model="timeTable.selectTeacher" 616 v-model="timeTable.selectTeacher"
617 item-text="name" 617 item-text="name"
618 item-value="_id" 618 item-value="_id"
619 required 619 required
620 ></v-select> 620 ></v-select>
621 </v-flex> 621 </v-flex>
622 </v-layout> 622 </v-layout>
623 </v-flex> 623 </v-flex>
624 <v-flex xs12> 624 <v-flex xs12>
625 <v-layout> 625 <v-layout>
626 <v-flex xs4 class="pt-4 subheading"> 626 <v-flex xs4 class="pt-4 subheading">
627 <label class="right">Select Day:</label> 627 <label class="right">Select Day:</label>
628 </v-flex> 628 </v-flex>
629 <v-flex xs4 class="ml-3"> 629 <v-flex xs4 class="ml-3">
630 <v-select 630 <v-select
631 :items="addOneDay" 631 :items="addOneDay"
632 label="Select Day" 632 label="Select Day"
633 v-model="timeTable.selectDay" 633 v-model="timeTable.selectDay"
634 item-text="name" 634 item-text="name"
635 item-value="_id" 635 item-value="_id"
636 required 636 required
637 ></v-select> 637 ></v-select>
638 </v-flex> 638 </v-flex>
639 </v-layout> 639 </v-layout>
640 </v-flex> 640 </v-flex>
641 <v-flex xs12> 641 <v-flex xs12>
642 <v-layout> 642 <v-layout>
643 <v-flex xs4 class="pt-4 subheading"> 643 <v-flex xs4 class="pt-4 subheading">
644 <label class="right">Subject Name:</label> 644 <label class="right">Subject Name:</label>
645 </v-flex> 645 </v-flex>
646 <v-flex xs4 class="ml-3"> 646 <v-flex xs4 class="ml-3">
647 <v-text-field 647 <v-text-field
648 placeholder="fill your Subject Name" 648 placeholder="fill your Subject Name"
649 :rules="subjectNameRules" 649 :rules="subjectNameRules"
650 v-model="timeTable.subjectName" 650 v-model="timeTable.subjectName"
651 type="text" 651 type="text"
652 required 652 required
653 ></v-text-field> 653 ></v-text-field>
654 </v-flex> 654 </v-flex>
655 </v-layout> 655 </v-layout>
656 </v-flex> 656 </v-flex>
657 <v-flex xs12> 657 <v-flex xs12>
658 <v-layout> 658 <v-layout>
659 <v-flex xs4 class="pt-4 subheading"> 659 <v-flex xs4 class="pt-4 subheading">
660 <label class="right">Time In:</label> 660 <label class="right">Time In:</label>
661 </v-flex> 661 </v-flex>
662 <v-flex xs4 class="ml-3"> 662 <v-flex xs4 class="ml-3">
663 <v-menu 663 <v-menu
664 ref="menuA" 664 ref="menuA"
665 :close-on-content-click="false" 665 :close-on-content-click="false"
666 v-model="menu2" 666 v-model="menu2"
667 :nudge-right="40" 667 :nudge-right="40"
668 :return-value.sync="timeTable.timeIn" 668 :return-value.sync="timeTable.timeIn"
669 lazy 669 lazy
670 transition="scale-transition" 670 transition="scale-transition"
671 offset-y 671 offset-y
672 full-width 672 full-width
673 max-width="290px" 673 max-width="290px"
674 min-width="290px" 674 min-width="290px"
675 > 675 >
676 <v-text-field 676 <v-text-field
677 slot="activator" 677 slot="activator"
678 v-model="timeTable.timeIn" 678 v-model="timeTable.timeIn"
679 label="Select your timeIn" 679 label="Select your timeIn"
680 append-icon="access_time" 680 append-icon="access_time"
681 ></v-text-field> 681 ></v-text-field>
682 <v-time-picker 682 <v-time-picker
683 v-model="timeTable.timeIn" 683 v-model="timeTable.timeIn"
684 @change="$refs.menuA.save(timeTable.timeIn)" 684 @change="$refs.menuA.save(timeTable.timeIn)"
685 ></v-time-picker> 685 ></v-time-picker>
686 </v-menu> 686 </v-menu>
687 </v-flex> 687 </v-flex>
688 </v-layout> 688 </v-layout>
689 </v-flex> 689 </v-flex>
690 <v-flex xs12> 690 <v-flex xs12>
691 <v-layout> 691 <v-layout>
692 <v-flex xs4 class="pt-4 subheading"> 692 <v-flex xs4 class="pt-4 subheading">
693 <label class="right">Time Out:</label> 693 <label class="right">Time Out:</label>
694 </v-flex> 694 </v-flex>
695 <v-flex xs4 class="ml-3"> 695 <v-flex xs4 class="ml-3">
696 <v-menu 696 <v-menu
697 ref="menu" 697 ref="menu"
698 :close-on-content-click="false" 698 :close-on-content-click="false"
699 v-model="menu1" 699 v-model="menu1"
700 :nudge-right="40" 700 :nudge-right="40"
701 :return-value.sync="timeTable.timeOut" 701 :return-value.sync="timeTable.timeOut"
702 lazy 702 lazy
703 transition="scale-transition" 703 transition="scale-transition"
704 offset-y 704 offset-y
705 full-width 705 full-width
706 max-width="290px" 706 max-width="290px"
707 min-width="290px" 707 min-width="290px"
708 > 708 >
709 <v-text-field 709 <v-text-field
710 slot="activator" 710 slot="activator"
711 v-model="timeTable.timeOut" 711 v-model="timeTable.timeOut"
712 label="Select your Time Out" 712 label="Select your Time Out"
713 append-icon="access_time" 713 append-icon="access_time"
714 ></v-text-field> 714 ></v-text-field>
715 <v-time-picker 715 <v-time-picker
716 v-model="timeTable.timeOut" 716 v-model="timeTable.timeOut"
717 @change="$refs.menu.save(timeTable.timeOut)" 717 @change="$refs.menu.save(timeTable.timeOut)"
718 ></v-time-picker> 718 ></v-time-picker>
719 </v-menu> 719 </v-menu>
720 </v-flex> 720 </v-flex>
721 </v-layout> 721 </v-layout>
722 </v-flex> 722 </v-flex>
723 <v-layout> 723 <v-layout>
724 <v-flex xs12 sm6 offset-sm3> 724 <v-flex xs12 sm6 offset-sm3>
725 <v-card-actions> 725 <v-card-actions>
726 <v-btn @click="clear" round dark>clear</v-btn> 726 <v-btn @click="clear" round dark>clear</v-btn>
727 <v-spacer></v-spacer> 727 <v-spacer></v-spacer>
728 <v-btn @click="submit" round dark :loading="loading">Add</v-btn> 728 <v-btn @click="submit" round dark :loading="loading">Add</v-btn>
729 </v-card-actions> 729 </v-card-actions>
730 </v-flex> 730 </v-flex>
731 </v-layout> 731 </v-layout>
732 </v-container> 732 </v-container>
733 </v-form> 733 </v-form>
734 </v-card> 734 </v-card>
735 </v-flex> 735 </v-flex>
736 </v-container> 736 </v-container>
737 </v-tab-item> 737 </v-tab-item>
738 </v-tabs> 738 </v-tabs>
739 <div class="loader" v-if="showLoader"> 739 <div class="loader" v-if="showLoader">
740 <v-progress-circular indeterminate color="white"></v-progress-circular> 740 <v-progress-circular indeterminate color="white"></v-progress-circular>
741 </div> 741 </div>
742 </v-app> 742 </v-app>
743 </template> 743 </template>
744 <script> 744 <script>
745 import http from "@/Services/http.js"; 745 import http from "@/Services/http.js";
746 import Util from "@/util"; 746 import Util from "@/util";
747 747
748 export default { 748 export default {
749 data: () => ({ 749 data: () => ({
750 y: "top", 750 y: "top",
751 x: "right", 751 x: "right",
752 mode: "", 752 mode: "",
753 timeout: 3000, 753 timeout: 3000,
754 text: "", 754 text: "",
755 search: "", 755 search: "",
756 snackbar: false, 756 snackbar: false,
757 loading: false, 757 loading: false,
758 showLoader: false, 758 showLoader: false,
759 dialog: false, 759 dialog: false,
760 dialogAddLecture: false, 760 dialogAddLecture: false,
761 dialogUpdateLectures: false, 761 dialogUpdateLectures: false,
762 dialog1: false, 762 dialog1: false,
763 valid: true, 763 valid: true,
764 isActive: true, 764 isActive: true,
765 newActive: false, 765 newActive: false,
766 addclass: [], 766 addclass: [],
767 addSection: [], 767 addSection: [],
768 addTeachers: [], 768 addTeachers: [],
769 gender: ["Male", "Female"], 769 gender: ["Male", "Female"],
770 AddUsercredentials: {}, 770 AddUsercredentials: {},
771 pagination: { 771 pagination: {
772 rowsPerPage: 15 772 rowsPerPage: 15
773 }, 773 },
774 imageData: {}, 774 imageData: {},
775 imageName: "", 775 imageName: "",
776 imageUrl: "", 776 imageUrl: "",
777 imageFile: "", 777 imageFile: "",
778 timeInRules: [v => !!v || "Time In is required"], 778 timeInRules: [v => !!v || "Time In is required"],
779 timeOutRules: [v => !!v || "Time Out is required"], 779 timeOutRules: [v => !!v || "Time Out is required"],
780 lectureRules: [v => !!v || "Lecture No is required"], 780 lectureRules: [v => !!v || "Lecture No is required"],
781 subjectNameRules: [v => !!v || "Subject Name is required"], 781 subjectNameRules: [v => !!v || "Subject Name is required"],
782 getParticulerLecture:"", 782 getParticulerLecture:"",
783 headers: [ 783 headers: [
784 { 784 {
785 text: "No", 785 text: "No",
786 align: "center", 786 align: "center",
787 sortable: false, 787 sortable: false,
788 value: "No" 788 value: "No"
789 }, 789 },
790 { 790 {
791 text: "Class Name", 791 text: "Class Name",
792 value: "classData.classNum", 792 value: "classData.classNum",
793 sortable: false, 793 sortable: false,
794 align: "center" 794 align: "center"
795 }, 795 },
796 { 796 {
797 text: "Section Name", 797 text: "Section Name",
798 value: "sectionData.name", 798 value: "sectionData.name",
799 sortable: false, 799 sortable: false,
800 align: "center" 800 align: "center"
801 }, 801 },
802 { text: "Action", value: "", sortable: false, align: "center" } 802 { text: "Action", value: "", sortable: false, align: "center" }
803 ], 803 ],
804 daysHeaders: [ 804 daysHeaders: [
805 { text: "Day", value: "dayday", sortable: false, align: "center" }, 805 { text: "Day", value: "dayday", sortable: false, align: "center" },
806 { 806 {
807 text: "Subject Name", 807 text: "Subject Name",
808 value: "subjectName", 808 value: "subjectName",
809 sortable: false, 809 sortable: false,
810 align: "center" 810 align: "center"
811 }, 811 },
812 { text: "Time In", value: "timeIn", sortable: false, align: "center" }, 812 { text: "Time In", value: "timeIn", sortable: false, align: "center" },
813 { text: "Time Out", value: "timeOut", sortable: false, align: "center" } 813 { text: "Time Out", value: "timeOut", sortable: false, align: "center" }
814 ], 814 ],
815 addOneDay: [ 815 addOneDay: [
816 "Monday", 816 "Monday",
817 "Tuesday", 817 "Tuesday",
818 "Wednesday", 818 "Wednesday",
819 "Thursday", 819 "Thursday",
820 "Friday", 820 "Friday",
821 "Saturday", 821 "Saturday",
822 "Sunday" 822 "Sunday"
823 ], 823 ],
824 desserts: [], 824 desserts: [],
825 timeTableList: [], 825 timeTableList: [],
826 editedIndex: -1, 826 editedIndex: -1,
827 selectTimeTable: { 827 selectTimeTable: {
828 select: "", 828 select: "",
829 selectSection: "" 829 selectSection: ""
830 }, 830 },
831 timeTable: { 831 timeTable: {
832 select: "", 832 select: "",
833 selectSection: "", 833 selectSection: "",
834 selectDay: "", 834 selectDay: "",
835 timeIn: null, 835 timeIn: null,
836 timeOut: null, 836 timeOut: null,
837 subjectName: "", 837 subjectName: "",
838 selectTeacher: "" 838 selectTeacher: ""
839 }, 839 },
840 editedItem: { 840 editedItem: {
841 classNum: "", 841 classNum: "",
842 selectSection: "" 842 selectSection: ""
843 }, 843 },
844 addlectures: { 844 addlectures: {
845 timeIn: null, 845 timeIn: null,
846 timeOut: null, 846 timeOut: null,
847 subjectName: "", 847 subjectName: "",
848 teacherId: "", 848 teacherId: "",
849 scheduleId: "", 849 scheduleId: "",
850 timeTableId: "" 850 timeTableId: ""
851 }, 851 },
852 updateLectures: { 852 updateLectures: {
853 timeIn: null, 853 timeIn: null,
854 timeOut: null, 854 timeOut: null,
855 subjectName: "", 855 subjectName: "",
856 teacherId: "" 856 teacherId: ""
857 }, 857 },
858 updateLecturesId: { 858 updateLecturesId: {
859 lectureId: "", 859 lectureId: "",
860 scheduleId: "" 860 scheduleId: ""
861 }, 861 },
862 menu1: false, 862 menu1: false,
863 menu2: false, 863 menu2: false,
864 menu3: false, 864 menu3: false,
865 menu4: false, 865 menu4: false,
866 menu5: false, 866 menu5: false,
867 menu6: false, 867 menu6: false,
868 868
869 items: [ 869 items: [
870 { 870 {
871 href: "/changepassword", 871 href: "/changepassword",
872 title: "Change Password", 872 title: "Change Password",
873 click: e => { 873 click: e => {
874 console.log(e); 874 console.log(e);
875 } 875 }
876 }, 876 },
877 { 877 {
878 href: "#", 878 href: "#",
879 title: "Logout", 879 title: "Logout",
880 click: e => { 880 click: e => {
881 window.getApp.$emit("APP_LOGOUT"); 881 window.getApp.$emit("APP_LOGOUT");
882 } 882 }
883 } 883 }
884 ] 884 ]
885 }), 885 }),
886 methods: { 886 methods: {
887 findTimeTable() { 887 findTimeTable() {
888 http() 888 http()
889 .get("/getParticularClassTimeTable", { 889 .get("/getParticularClassTimeTable", {
890 params: { 890 params: {
891 sectionId: this.selectTimeTable.selectSection, 891 sectionId: this.selectTimeTable.selectSection,
892 classId: this.selectTimeTable.select 892 classId: this.selectTimeTable.select
893 } 893 }
894 }) 894 })
895 .then(response => { 895 .then(response => {
896 this.desserts = response.data.data; 896 this.desserts = response.data.data;
897 }) 897 })
898 .catch(error => { 898 .catch(error => {
899 console.log("err====>", error); 899 console.log("err====>", error);
900 if ((this.snackbar = true)) { 900 if ((this.snackbar = true)) {
901 this.text = error.response.data.message; 901 this.text = error.response.data.message;
902 this.text = error.response.data.statusText; 902 this.text = error.response.data.statusText;
903 } 903 }
904 }); 904 });
905 }, 905 },
906 getSections(_id) { 906 getSections(_id) {
907 var token = this.$store.state.token; 907 var token = this.$store.state.token;
908 http() 908 http()
909 .get( 909 .get(
910 "/getSectionsList", 910 "/getSectionsList",
911 { params: { classId: _id } }, 911 { params: { classId: _id } },
912 { 912 {
913 headers: { Authorization: "Bearer " + token } 913 headers: { Authorization: "Bearer " + token }
914 } 914 }
915 ) 915 )
916 .then(response => { 916 .then(response => {
917 this.addSection = response.data.data; 917 this.addSection = response.data.data;
918 }) 918 })
919 .catch(err => { 919 .catch(err => {
920 // console.log("err====>", err); 920 // console.log("err====>", err);
921 }); 921 });
922 }, 922 },
923 getTimeTable(item) { 923 getTimeTable(item) {
924 this.showLoader = true; 924 this.showLoader = true;
925 this.getParticulerLecture = item._id 925 this.getParticulerLecture = item._id
926 var token = this.$store.state.token; 926 var token = this.$store.state.token;
927 http() 927 http()
928 .get( 928 .get(
929 "/getParticularTimeTable", 929 "/getParticularTimeTable",
930 { params: { timeTableId: item._id } }, 930 { params: { timeTableId: item._id } },
931 { 931 {
932 headers: { Authorization: "Bearer " + token } 932 headers: { Authorization: "Bearer " + token }
933 } 933 }
934 ) 934 )
935 .then(response => { 935 .then(response => {
936 this.timeTableList = response.data.data; 936 this.timeTableList = response.data.data;
937 this.showLoader = false; 937 this.showLoader = false;
938 }) 938 })
939 .catch(err => { 939 .catch(err => {
940 this.showLoader = false; 940 this.showLoader = false;
941 // console.log("err====>", err); 941 // console.log("err====>", err);
942 }); 942 });
943 }, 943 },
944 pickFile() { 944 pickFile() {
945 this.$refs.image.click(); 945 this.$refs.image.click();
946 }, 946 },
947 947
948 onFilePicked(e) { 948 onFilePicked(e) {
949 // console.log(e) 949 // console.log(e)
950 const files = e.target.files; 950 const files = e.target.files;
951 this.imageData.upload = e.target.files[0]; 951 this.imageData.upload = e.target.files[0];
952 if (files[0] !== undefined) { 952 if (files[0] !== undefined) {
953 this.imageName = files[0].name; 953 this.imageName = files[0].name;
954 if (this.imageName.lastIndexOf(".") <= 0) { 954 if (this.imageName.lastIndexOf(".") <= 0) {
955 return; 955 return;
956 } 956 }
957 const fr = new FileReader(); 957 const fr = new FileReader();
958 fr.readAsDataURL(files[0]); 958 fr.readAsDataURL(files[0]);
959 fr.addEventListener("load", () => { 959 fr.addEventListener("load", () => {
960 this.imageUrl = fr.result; 960 this.imageUrl = fr.result;
961 this.imageFile = files[0]; // this is an image file that can be sent to server... 961 this.imageFile = files[0]; // this is an image file that can be sent to server...
962 this.imageData.imageUrl = URL.createObjectURL(this.imageFile); 962 this.imageData.imageUrl = URL.createObjectURL(this.imageFile);
963 // console.log("upload=======>", this.imageData.imageUrl); 963 // console.log("upload=======>", this.imageData.imageUrl);
964 // console.log("imageFile", this.imageFile); 964 // console.log("imageFile", this.imageFile);
965 }); 965 });
966 } else { 966 } else {
967 this.imageName = ""; 967 this.imageName = "";
968 this.imageFile = ""; 968 this.imageFile = "";
969 this.imageUrl = ""; 969 this.imageUrl = "";
970 } 970 }
971 }, 971 },
972 // getTimeTableList() { 972 // getTimeTableList() {
973 // this.showLoader = true; 973 // this.showLoader = true;
974 // var token = this.$store.state.token; 974 // var token = this.$store.state.token;
975 // http() 975 // http()
976 // .get("/getTimeTablesList", { 976 // .get("/getTimeTablesList", {
977 // headers: { Authorization: "Bearer " + token } 977 // headers: { Authorization: "Bearer " + token }
978 // }) 978 // })
979 // .then(response => { 979 // .then(response => {
980 // this.desserts = response.data.data; 980 // this.desserts = response.data.data;
981 // this.showLoader = false; 981 // this.showLoader = false;
982 // // console.log("getTimeTableList=====>", response.data.data); 982 // // console.log("getTimeTableList=====>", response.data.data);
983 // }) 983 // })
984 // .catch(err => { 984 // .catch(err => {
985 // // console.log("err====>", err); 985 // // console.log("err====>", err);
986 // this.showLoader = false; 986 // this.showLoader = false;
987 // this.$router.replace({ path: "/" }); 987 // this.$router.replace({ path: "/" });
988 // }); 988 // });
989 // }, 989 // },
990 editItem(item) { 990 editItem(item) {
991 this.editedIndex = this.desserts.indexOf(item); 991 this.editedIndex = this.desserts.indexOf(item);
992 this.editedItem = Object.assign({}, item); 992 this.editedItem = Object.assign({}, item);
993 this.dialog = true; 993 this.dialog = true;
994 }, 994 },
995 updateTimeTable(timeToUpdate, classToUpdate) { 995 updateTimeTable(timeToUpdate, classToUpdate) {
996 console.log( 996 console.log(
997 "timeToUpdate, classToUpdate", 997 "timeToUpdate, classToUpdate",
998 timeToUpdate._id, 998 timeToUpdate._id,
999 classToUpdate.schedule 999 classToUpdate.schedule
1000 ); 1000 );
1001 for (let i = 0; i < classToUpdate.schedule.length; i++) { 1001 for (let i = 0; i < classToUpdate.schedule.length; i++) {
1002 this.updateLecturesId.scheduleId = classToUpdate.schedule[i]._id; 1002 this.updateLecturesId.scheduleId = classToUpdate.schedule[i]._id;
1003 } 1003 }
1004 (this.updateLecturesId.lectureId = timeToUpdate._id), 1004 (this.updateLecturesId.lectureId = timeToUpdate._id),
1005 (this.updateLectures = timeToUpdate); 1005 (this.updateLectures = timeToUpdate);
1006 this.dialogUpdateLectures = true; 1006 this.dialogUpdateLectures = true;
1007 }, 1007 },
1008 addLecture(scheduleId, timeTableId) { 1008 addLecture(scheduleId, timeTableId) {
1009 // console.log('timeToAdd, classToAdd', scheduleId, timeTableId); 1009 // console.log('timeToAdd, classToAdd', scheduleId, timeTableId);
1010 this.addlectures.scheduleId = scheduleId; 1010 this.addlectures.scheduleId = scheduleId;
1011 this.addlectures.timeTableId = timeTableId; 1011 this.addlectures.timeTableId = timeTableId;
1012 this.dialogAddLecture = true; 1012 this.dialogAddLecture = true;
1013 }, 1013 },
1014 AddLecture() { 1014 AddLecture() {
1015 if (this.$refs.lectureForm.validate()) { 1015 if (this.$refs.lectureForm.validate()) {
1016 http() 1016 http()
1017 .post("/addLecture", this.addlectures) 1017 .post("/addLecture", this.addlectures)
1018 .then(response => { 1018 .then(response => {
1019 if ((this.snackbar = true)) { 1019 if ((this.snackbar = true)) {
1020 this.text = "New Add Lecture successfully"; 1020 this.text = "New Add Lecture successfully";
1021 } 1021 }
1022 var token = this.$store.state.token; 1022 var token = this.$store.state.token;
1023 http() 1023 http()
1024 .get( 1024 .get(
1025 "/getParticularTimeTable", 1025 "/getParticularTimeTable",
1026 { params: { timeTableId: this.getParticulerLecture } }, 1026 { params: { timeTableId: this.getParticulerLecture } },
1027 { 1027 {
1028 headers: { Authorization: "Bearer " + token } 1028 headers: { Authorization: "Bearer " + token }
1029 } 1029 }
1030 ) 1030 )
1031 .then(response => { 1031 .then(response => {
1032 this.timeTableList = response.data.data; 1032 this.timeTableList = response.data.data;
1033 this.showLoader = false; 1033 this.showLoader = false;
1034 // console.log("getParticularTimeTable=====>", this.timeTableList);
1035 }) 1034 })
1036 .catch(err => { 1035 .catch(err => {
1037 this.showLoader = false; 1036 this.showLoader = false;
1038 // console.log("err====>", err); 1037 // console.log("err====>", err);
1039 }); 1038 });
1040 this.closedialogLecture(); 1039 this.closedialogLecture();
1041 this.clearLeactureData(); 1040 this.clearLeactureData();
1042 }) 1041 })
1043 .catch(error => { 1042 .catch(error => {
1044 if ((this.snackbar = true)) { 1043 if ((this.snackbar = true)) {
1045 this.text = error.response.data.message; 1044 this.text = error.response.data.message;
1046 this.text = error.response.data.statusText; 1045 this.text = error.response.data.statusText;
1047 } 1046 }
1048 }); 1047 });
1049 } 1048 }
1050 }, 1049 },
1051 updateParticularTable() { 1050 updateParticularTable() {
1052 let EditLecture = { 1051 let EditLecture = {
1053 lectureId: this.updateLecturesId.lectureId, 1052 lectureId: this.updateLecturesId.lectureId,
1054 scheduleId: this.updateLecturesId.scheduleId, 1053 scheduleId: this.updateLecturesId.scheduleId,
1055 updatedLecture: { 1054 updatedLecture: {
1056 timeIn: this.updateLectures.timeIn, 1055 timeIn: this.updateLectures.timeIn,
1057 timeOut: this.updateLectures.timeOut, 1056 timeOut: this.updateLectures.timeOut,
1058 subjectName: this.updateLectures.subjectName, 1057 subjectName: this.updateLectures.subjectName,
1059 teacherId: this.updateLectures.teacherId 1058 teacherId: this.updateLectures.teacherId
1060 } 1059 }
1061 }; 1060 };
1062 http() 1061 http()
1063 .put("/updateLecture", EditLecture) 1062 .put("/updateLecture", EditLecture)
1064 .then(response => { 1063 .then(response => {
1065 console.log("updateLecture", EditLecture); 1064 console.log("updateLecture", EditLecture);
1066 if ((this.snackbar = true)) { 1065 if ((this.snackbar = true)) {
1067 this.text = "Successfully Edit Update Lecture"; 1066 this.text = "Successfully Edit Update Lecture";
1068 } 1067 }
1069 this.closeUpdateLectures(); 1068 this.closeUpdateLectures();
1070 }) 1069 })
1071 .catch(error => { 1070 .catch(error => {
1072 // console.log(error); 1071 // console.log(error);
1073 if ((this.snackbar = true)) { 1072 if ((this.snackbar = true)) {
1074 this.text = error.response.data.message; 1073 this.text = error.response.data.message;
1075 this.text = error.response.data.statusText; 1074 this.text = error.response.data.statusText;
1076 } 1075 }
1077 }); 1076 });
1078 }, 1077 },
1079 deleteItem(item) { 1078 deleteItem(item) {
1080 let deleteTimeTable = { 1079 let deleteTimeTable = {
1081 timeTableId: item._id 1080 timeTableId: item._id
1082 }; 1081 };
1083 http() 1082 http()
1084 .delete( 1083 .delete(
1085 "/deleteTimeTable", 1084 "/deleteTimeTable",
1086 confirm("Are you sure you want to delete this?") && { 1085 confirm("Are you sure you want to delete this?") && {
1087 params: deleteTimeTable 1086 params: deleteTimeTable
1088 } 1087 }
1089 ) 1088 )
1090 .then(response => { 1089 .then(response => {
1091 // console.log("deleteUers",deleteTimeTable) 1090 // console.log("deleteUers",deleteTimeTable)
1092 if ((this.snackbar = true)) { 1091 if ((this.snackbar = true)) {
1093 this.text = "Successfully delete Existing Time Table"; 1092 this.text = "Successfully delete Existing Time Table";
1094 } 1093 }
1095 this.findTimeTable(); 1094 this.findTimeTable();
1096 }) 1095 })
1097 .catch(error => { 1096 .catch(error => {
1098 // console.log(error); 1097 // console.log(error);
1099 }); 1098 });
1100 }, 1099 },
1101 activeTab(type) { 1100 activeTab(type) {
1102 switch (type) { 1101 switch (type) {
1103 case "existing": 1102 case "existing":
1104 this.newActive = false; 1103 this.newActive = false;
1105 this.isActive = true; 1104 this.isActive = true;
1106 break; 1105 break;
1107 1106
1108 default: 1107 default:
1109 this.newActive = true; 1108 this.newActive = true;
1110 this.isActive = false; 1109 this.isActive = false;
1111 break; 1110 break;
1112 } 1111 }
1113 }, 1112 },
1114 close() { 1113 close() {
1115 this.dialog = false; 1114 this.dialog = false;
1116 setTimeout(() => { 1115 setTimeout(() => {
1117 this.editedItem = Object.assign({}, this.defaultItem); 1116 this.editedItem = Object.assign({}, this.defaultItem);
1118 this.editedIndex = -1; 1117 this.editedIndex = -1;
1119 }, 300); 1118 }, 300);
1120 }, 1119 },
1121 close1() { 1120 close1() {
1122 this.dialog1 = false; 1121 this.dialog1 = false;
1123 }, 1122 },
1124 closedialogLecture() { 1123 closedialogLecture() {
1125 this.dialogAddLecture = false; 1124 this.dialogAddLecture = false;
1126 }, 1125 },
1127 closeUpdateLectures() { 1126 closeUpdateLectures() {
1128 this.dialogUpdateLectures = false; 1127 this.dialogUpdateLectures = false;
1129 }, 1128 },
1130 submit() { 1129 submit() {
1131 if (this.$refs.form.validate()) { 1130 if (this.$refs.form.validate()) {
1132 let imageData = new FormData(); 1131 let imageData = new FormData();
1133 imageData.append("upload", this.imageFile); 1132 imageData.append("upload", this.imageFile);
1134 let addTimeTable = { 1133 let addTimeTable = {
1135 sectionId: this.timeTable.selectSection, 1134 sectionId: this.timeTable.selectSection,
1136 classId: this.timeTable.select, 1135 classId: this.timeTable.select,
1137 schedule: [ 1136 schedule: [
1138 { 1137 {
1139 day: this.timeTable.selectDay, 1138 day: this.timeTable.selectDay,
1140 lectures: [ 1139 lectures: [
1141 { 1140 {
1142 timeIn: this.timeTable.timeIn, 1141 timeIn: this.timeTable.timeIn,
1143 timeOut: this.timeTable.timeOut, 1142 timeOut: this.timeTable.timeOut,
1144 subjectName: this.timeTable.subjectName, 1143 subjectName: this.timeTable.subjectName,
1145 teacherId: this.timeTable.selectTeacher 1144 teacherId: this.timeTable.selectTeacher
1146 } 1145 }
1147 ] 1146 ]
1148 } 1147 }
1149 ] 1148 ]
1150 }; 1149 };
1151 this.loading = true; 1150 this.loading = true;
1152 http() 1151 http()
1153 .post("/createTimeTable", addTimeTable) 1152 .post("/createTimeTable", addTimeTable)
1154 .then(response => { 1153 .then(response => {
1155 // console.log("addTimeTable=====>", addTimeTable); 1154 // console.log("addTimeTable=====>", addTimeTable);
1156 if ((this.snackbar = true)) { 1155 if ((this.snackbar = true)) {
1157 this.text = "New Time Table added successfully"; 1156 this.text = "New Time Table added successfully";
1158 } 1157 }
1159 this.clear(); 1158 this.clear();
1160 this.loading = false; 1159 this.loading = false;
1161 }) 1160 })
1162 .catch(error => { 1161 .catch(error => {
1163 // console.log(error); 1162 // console.log(error);
1164 if ((this.snackbar = true)) { 1163 if ((this.snackbar = true)) {
1165 this.text = error.response.data.message; 1164 this.text = error.response.data.message;
1166 } 1165 }
1167 this.loading = false; 1166 this.loading = false;
1168 }); 1167 });
1169 } 1168 }
1170 }, 1169 },
1171 mail() {}, 1170 mail() {},
1172 download() {}, 1171 download() {},
1173 clear() { 1172 clear() {
1174 this.$refs.form.reset(); 1173 this.$refs.form.reset();
1175 }, 1174 },
1176 clearLeactureData(){ 1175 clearLeactureData(){
1177 this.$refs.lectureForm.reset(); 1176 this.$refs.lectureForm.reset();
1178 }, 1177 },
1179 save() { 1178 save() {
1180 let imageData = new FormData(); 1179 let imageData = new FormData();
1181 imageData.append("upload", this.imageFile); 1180 imageData.append("upload", this.imageFile);
1182 // console.log(imageData); 1181 // console.log(imageData);
1183 let editTimeTable = { 1182 let editTimeTable = {
1184 timeTableId: this.editedItem._id, 1183 timeTableId: this.editedItem._id,
1185 classId: this.editedItem.classNum, 1184 classId: this.editedItem.classNum,
1186 sectionId: this.editedItem.selectSection 1185 sectionId: this.editedItem.selectSection
1187 // imageData 1186 // imageData
1188 }; 1187 };
1189 http() 1188 http()
1190 .put("/updateTimeTable", editTimeTable) 1189 .put("/updateTimeTable", editTimeTable)
1191 .then(response => { 1190 .then(response => {
1192 console.log("editTimeTable", editTimeTable); 1191 console.log("editTimeTable", editTimeTable);
1193 if ((this.snackbar = true)) { 1192 if ((this.snackbar = true)) {
1194 this.text = "Successfully Edit Existing Time Table"; 1193 this.text = "Successfully Edit Existing Time Table";
1195 } 1194 }
1196 this.findTimeTable(); 1195 this.findTimeTable();
1197 }) 1196 })
1198 .catch(error => { 1197 .catch(error => {
1199 // console.log(error); 1198 // console.log(error);
1200 if ((this.snackbar = true)) { 1199 if ((this.snackbar = true)) {
1201 this.text = error.response.data.message; 1200 this.text = error.response.data.message;
1202 } 1201 }
1203 }); 1202 });
1204 this.close(); 1203 this.close();
1205 }, 1204 },
1206 handleDrawerToggle() { 1205 handleDrawerToggle() {
1207 window.getApp.$emit("APP_DRAWER_TOGGLED"); 1206 window.getApp.$emit("APP_DRAWER_TOGGLED");
1208 }, 1207 },
1209 handleFullScreen() { 1208 handleFullScreen() {
1210 Util.toggleFullScreen(); 1209 Util.toggleFullScreen();
1211 }, 1210 },
1212 deleteTimeTable(timeToDelete, deleteLectures) { 1211 deleteTimeTable(timeToDelete, deleteLectures) {
1213 let deleteLecture = { 1212 let deleteLecture = {
1214 lectureId: timeToDelete._id 1213 lectureId: timeToDelete._id
1215 }; 1214 };
1216 http() 1215 http()
1217 .delete( 1216 .delete(
1218 "/deleteLecture", 1217 "/deleteLecture",
1219 confirm("Are you sure you want to delete this?") && { 1218 confirm("Are you sure you want to delete this?") && {
1220 params: deleteLecture 1219 params: deleteLecture
1221 } 1220 }
1222 ) 1221 )
1223 .then(response => { 1222 .then(response => {
1224 if ((this.snackbar = true)) { 1223 if ((this.snackbar = true)) {
1225 this.text = "Successfully delete Existing User"; 1224 this.text = "Successfully delete Existing User";
1226 } 1225 }
1227 const index = this.timeTableList.schedule.indexOf(deleteLectures); 1226 const index = this.timeTableList.schedule.indexOf(deleteLectures);
1228 for (let i = 0; i < this.timeTableList.schedule.length; i++) { 1227 for (let i = 0; i < this.timeTableList.schedule.length; i++) {
1229 this.timeTableList.schedule[i].lectures.splice(index, 1); 1228 this.timeTableList.schedule[i].lectures.splice(index, 1);
1230 } 1229 }
1231 }) 1230 })
1232 .catch(error => { 1231 .catch(error => {
1233 console.log(error); 1232 console.log(error);
1234 }); 1233 });
1235 } 1234 }
1236 }, 1235 },
1237 mounted() { 1236 mounted() {
1238 // this.getTimeTableList(); 1237 // this.getTimeTableList();
1239 var token = this.$store.state.token; 1238 var token = this.$store.state.token;
1240 http() 1239 http()
1241 .get("/getClassesList", { 1240 .get("/getClassesList", {
1242 headers: { Authorization: "Bearer " + token } 1241 headers: { Authorization: "Bearer " + token }
1243 }) 1242 })
1244 .then(response => { 1243 .then(response => {
1245 this.addclass = response.data.data; 1244 this.addclass = response.data.data;
1246 // console.log("getClassesList=====>",this.addclass) 1245 // console.log("getClassesList=====>",this.addclass)
1247 }) 1246 })
1248 .catch(err => { 1247 .catch(err => {
1249 // console.log("err====>", err); 1248 // console.log("err====>", err);
1250 }); 1249 });
1251 1250
1252 http() 1251 http()
1253 .get("/getTeachersList", { 1252 .get("/getTeachersList", {
1254 headers: { Authorization: "Bearer " + token } 1253 headers: { Authorization: "Bearer " + token }
1255 }) 1254 })
1256 .then(response => { 1255 .then(response => {
1257 this.addTeachers = response.data.data; 1256 this.addTeachers = response.data.data;
1258 // console.log("getClassesList=====>",this.addTeachers) 1257 // console.log("getClassesList=====>",this.addTeachers)
1259 }) 1258 })
1260 .catch(err => { 1259 .catch(err => {
1261 // console.log("err====>", err); 1260 // console.log("err====>", err);
1262 }); 1261 });
1263 }, 1262 },
1264 computed: { 1263 computed: {
1265 toolbarColor() { 1264 toolbarColor() {
1266 return this.$vuetify.options.extra.mainNav; 1265 return this.$vuetify.options.extra.mainNav;
1267 } 1266 }
1268 } 1267 }
1269 }; 1268 };
1270 </script> 1269 </script>
1271 <style scoped> 1270 <style scoped>
1272 .theme--light .v-label, 1271 .theme--light .v-label,
1273 .application .theme--light.v-label { 1272 .application .theme--light.v-label {
1274 color: black; 1273 color: black;
1275 } 1274 }
1276 .v-tabs__div { 1275 .v-tabs__div {
1277 text-transform: none; 1276 text-transform: none;
1278 } 1277 }
1279 .v-input__prepend-outer { 1278 .v-input__prepend-outer {
1280 margin-right: 0px !important; 1279 margin-right: 0px !important;
1281 } 1280 }
1282 .v-card__actions .v-btn { 1281 .v-card__actions .v-btn {
1283 margin: 0 15px; 1282 margin: 0 15px;
1284 min-width: 120px; 1283 min-width: 120px;
1285 } 1284 }
1286 .primary { 1285 .primary {
1287 background-color: #aaa !important; 1286 background-color: #aaa !important;
1288 border-color: #aaa !important; 1287 border-color: #aaa !important;
1289 } 1288 }
1290 h4 { 1289 h4 {
1291 background-repeat: no-repeat; 1290 background-repeat: no-repeat;
1292 padding: 8px; 1291 padding: 8px;
1293 margin: auto; 1292 margin: auto;
1294 font-size: 25px; 1293 font-size: 25px;
1295 } 1294 }
1296 #name { 1295 #name {
1297 position: absolute; 1296 position: absolute;
1298 left: 100px; 1297 left: 100px;
1299 top: 17px; 1298 top: 17px;
1300 } 1299 }
1301 #icon { 1300 #icon {
1302 position: absolute; 1301 position: absolute;
1303 right: 8px; 1302 right: 8px;
1304 top: 8px; 1303 top: 8px;
1305 } 1304 }
1306 #m { 1305 #m {
1307 position: relative; 1306 position: relative;
1308 left: 135px; 1307 left: 135px;
1309 top: -15px; 1308 top: -15px;
1310 } 1309 }
1311 #G { 1310 #G {
1312 position: absolute; 1311 position: absolute;
1313 top: 38px; 1312 top: 38px;
1314 color: white; 1313 color: white;
1315 } 1314 }
1316 #bt { 1315 #bt {
1317 position: relative; 1316 position: relative;
1318 top: -20px; 1317 top: -20px;
1319 left: 115px; 1318 left: 115px;
1320 } 1319 }
1321 #e { 1320 #e {
1322 position: relative; 1321 position: relative;
1323 top: 5px; 1322 top: 5px;
1324 right: -30px; 1323 right: -30px;
1325 height: 17px; 1324 height: 17px;
1326 cursor: pointer; 1325 cursor: pointer;
1327 } 1326 }
1328 #d { 1327 #d {
1329 position: relative; 1328 position: relative;
1330 top: 5px; 1329 top: 5px;
1331 right: -70px; 1330 right: -70px;
1332 height: 17px; 1331 height: 17px;
1333 cursor: pointer; 1332 cursor: pointer;
1334 } 1333 }
1335 #td { 1334 #td {
1336 border: 1px solid #dddddd; 1335 border: 1px solid #dddddd;
1337 text-align: left; 1336 text-align: left;
1338 padding: 8px; 1337 padding: 8px;
1339 } 1338 }
1340 #dialog { 1339 #dialog {
1341 height: 550px; 1340 height: 550px;
1342 } 1341 }
1343 .active { 1342 .active {
1344 background-color: black; 1343 background-color: black;
1345 color: white !important; 1344 color: white !important;
1346 } 1345 }
1347 .activebtn { 1346 .activebtn {
1348 color: black !important; 1347 color: black !important;
1349 } 1348 }
1350 #flex { 1349 #flex {
1351 height: 300px; 1350 height: 300px;
1352 } 1351 }
1353 .top { 1352 .top {
1354 margin-top: 100px; 1353 margin-top: 100px;
1355 } 1354 }
1356 .v-tabs__item a { 1355 .v-tabs__item a {
1357 font-size: 16px !important; 1356 font-size: 16px !important;
1358 } 1357 }
1359 .table-td { 1358 .table-td {
1360 padding: 0px 42px !important; 1359 padding: 0px 42px !important;
1361 } 1360 }
1362 @media screen and (max-width: 769px) { 1361 @media screen and (max-width: 769px) {
1363 .top { 1362 .top {
1364 margin-top: 0 !important; 1363 margin-top: 0 !important;
1365 } 1364 }
1366 .userSearch .v-icon { 1365 .userSearch .v-icon {
1367 font-size: 20px !important; 1366 font-size: 20px !important;
1368 margin-left: 20px; 1367 margin-left: 20px;
1369 } 1368 }
1370 } 1369 }
1371 @media screen and (max-width: 380px) { 1370 @media screen and (max-width: 380px) {
1372 .pl-3 { 1371 .pl-3 {
1373 padding-left: 0px !important; 1372 padding-left: 0px !important;
1374 } 1373 }
1375 .right { 1374 .right {
1376 float: none !important; 1375 float: none !important;
1377 } 1376 }
1378 .subheading { 1377 .subheading {
1379 font-size: 14px !important; 1378 font-size: 14px !important;
1380 } 1379 }
1381 .v-card__actions .v-btn { 1380 .v-card__actions .v-btn {
1382 margin: 0 0px; 1381 margin: 0 0px;
1383 min-width: 100px; 1382 min-width: 100px;
1384 } 1383 }
1385 /* .searchIcon .v-icon { 1384 /* .searchIcon .v-icon {
1386 font-size: 20px; 1385 font-size: 20px;
1387 margin-left: 20px; 1386 margin-left: 20px;
1388 } */ 1387 } */
1389 .subheading { 1388 .subheading {
1390 font-size: 12px !important; 1389 font-size: 12px !important;
1391 } 1390 }
1392 h5 { 1391 h5 {
1393 font-size: 13px; 1392 font-size: 13px;
1394 } 1393 }
1395 } 1394 }
1396 .v-icon { 1395 .v-icon {
1397 font-size: 30px; 1396 font-size: 30px;
1398 } 1397 }
1399 @media screen and (min-width: 1270px) { 1398 @media screen and (min-width: 1270px) {
1400 .hide { 1399 .hide {
1401 display: none; 1400 display: none;
1402 } 1401 }
1403 } 1402 }
1404 @media screen and (max-width: 420px) { 1403 @media screen and (max-width: 420px) {
1405 .userSearch .v-text-field .v-label { 1404 .userSearch .v-text-field .v-label {
1406 line-height: 24px !important; 1405 line-height: 24px !important;
1407 } 1406 }
1408 .userSearch .v-label { 1407 .userSearch .v-label {
1409 font-size: 13px !important; 1408 font-size: 13px !important;
1410 } 1409 }
1411 .v-list__tile { 1410 .v-list__tile {
1412 font-size: 14px; 1411 font-size: 14px;
1413 padding: 0 10px; 1412 padding: 0 10px;
1414 } 1413 }
1415 .name { 1414 .name {
1416 font-size: 15px; 1415 font-size: 15px;
1417 } 1416 }
1418 } 1417 }
1419 </style> 1418 </style>
src/router/paths.js
1 export default [ 1 export default [
2 2
3 { 3 {
4 path: '*', 4 path: '*',
5 meta: { 5 meta: {
6 public: true, 6 public: true,
7 },
8 redirect: {
9 path: '/404'
10 }
7 }, 11 },
8 redirect: { 12 {
9 path: '/404' 13 path: '/404',
10 } 14 meta: {
11 }, 15 public: true,
12 { 16 },
13 path: '/404', 17 name: 'NotFound',
14 meta: { 18 component: () =>
15 public: true, 19 import (
20 /* webpackChunkName: "routes" */
21 /* webpackMode: "lazy-once" */
22 `@/pages/NotFound/NotFound.vue`
23 )
24 },
25 {
26 path: '/500',
27 meta: {
28 public: true,
29 },
30 name: 'ServerError',
31 component: () =>
32 import (
33 /* webpackChunkName: "routes" */
34 /* webpackMode: "lazy-once" */
35 `@/pages/NotFound/Error.vue`
36 )
37 },
38 {
39 path: '/changepassword',
40 meta: {},
41 name: 'changepassword',
42 props: (route) => ({ type: route.query.type }),
43 component: () =>
44 import (
45 /* webpackChunkName: "routes" */
46 /* webpackMode: "lazy-once" */
47 `@/pages/Authentication/changepassword.vue`
48 )
49 },
50 {
51 path: '/teachers',
52 meta: { breadcrumb: false },
53 name: 'teachers',
54 component: () =>
55 import (
56 /* webpackChunkName: "routes" */
57 /* webpackMode: "lazy-once" */
58 `@/pages/Teachers/teachers.vue`
59 )
60 },
61 {
62 path: '/',
63 meta: {
64 public: true,
65 },
66 name: 'Login',
67 component: () =>
68 import (
69 /* webpackChunkName: "routes" */
70 /* webpackMode: "lazy-once" */
71 `@/pages/Authentication/Login.vue`
72 )
16 }, 73 },
17 name: 'NotFound', 74 {
18 component: () => import( 75 path: '/forgetpassword',
19 /* webpackChunkName: "routes" */ 76 meta: {
20 /* webpackMode: "lazy-once" */ 77 public: true,
21 `@/pages/NotFound/NotFound.vue` 78 },
22 ) 79 name: 'forgetpassword',
23 }, 80 component: () =>
24 { 81 import (
25 path: '/500', 82 /* webpackChunkName: "routes" */
26 meta: { 83 /* webpackMode: "lazy-once" */
27 public: true, 84 `@/pages/Authentication/forgetpassword.vue`
85 )
28 }, 86 },
29 name: 'ServerError', 87 {
30 component: () => import( 88 path: '/students',
31 /* webpackChunkName: "routes" */ 89 meta: {},
32 /* webpackMode: "lazy-once" */ 90 name: 'Students',
33 `@/pages/NotFound/Error.vue` 91 props: (route) => ({ type: route.query.type }),
34 ) 92 component: () =>
35 }, 93 import (
36 { 94 /* webpackChunkName: "routes" */
37 path: '/changepassword', 95 /* webpackMode: "lazy-once" */
38 meta: { }, 96 `@/pages/Students/students.vue`
39 name: 'changepassword', 97 )
40 props: (route) => ({ type: route.query.type }),
41 component: () => import(
42 /* webpackChunkName: "routes" */
43 /* webpackMode: "lazy-once" */
44 `@/pages/Authentication/changepassword.vue`
45 )
46 },
47 {
48 path: '/teachers',
49 meta: { breadcrumb: false },
50 name: 'teachers',
51 component: () => import(
52 /* webpackChunkName: "routes" */
53 /* webpackMode: "lazy-once" */
54 `@/pages/Teachers/teachers.vue`
55 )
56 },
57 {
58 path: '/',
59 meta: {
60 public: true,
61 }, 98 },
62 name: 'Login', 99 {
63 component: () => import( 100 path: '/addclass',
64 /* webpackChunkName: "routes" */ 101 meta: {},
65 /* webpackMode: "lazy-once" */ 102 name: 'addclass',
66 `@/pages/Authentication/Login.vue` 103 props: (route) => ({ type: route.query.type }),
67 ) 104 component: () =>
68 }, 105 import (
69 { 106 /* webpackChunkName: "routes" */
70 path: '/forgetpassword', 107 /* webpackMode: "lazy-once" */
71 meta: { 108 `@/pages/Class/addclass.vue`
72 public: true, 109 )
73 }, 110 },
74 name: 'forgetpassword', 111 {
75 component: () => import( 112 path: '/section',
76 /* webpackChunkName: "routes" */ 113 meta: {},
77 /* webpackMode: "lazy-once" */ 114 name: 'section',
78 `@/pages/Authentication/forgetpassword.vue` 115 props: (route) => ({ type: route.query.type }),
79 ) 116 component: () =>
80 }, 117 import (
81 { 118 /* webpackChunkName: "routes" */
82 path: '/students', 119 /* webpackMode: "lazy-once" */
83 meta: { }, 120 `@/pages/Section/section.vue`
84 name: 'Students', 121 )
85 props: (route) => ({ type: route.query.type }), 122 },
86 component: () => import( 123 // {
87 /* webpackChunkName: "routes" */ 124 // path: '/event',
88 /* webpackMode: "lazy-once" */ 125 // meta: { },
89 `@/pages/Students/students.vue` 126 // name: 'event',
90 ) 127 // props: (route) => ({ type: route.query.type }),
91 }, 128 // component: () => import(
92 { 129 // /* webpackChunkName: "routes" */
93 path: '/addclass', 130 // /* webpackMode: "lazy-once" */
94 meta: { }, 131 // `@/pages/Event/event.vue`
95 name: 'addclass', 132 // )
96 props: (route) => ({ type: route.query.type }), 133 // },
97 component: () => import( 134 {
98 /* webpackChunkName: "routes" */ 135 path: '/news',
99 /* webpackMode: "lazy-once" */ 136 meta: {},
100 `@/pages/Class/addclass.vue` 137 name: 'news',
101 ) 138 props: (route) => ({ type: route.query.type }),
102 }, 139 component: () =>
103 { 140 import (
104 path: '/section', 141 /* webpackChunkName: "routes" */
105 meta: { }, 142 /* webpackMode: "lazy-once" */
106 name: 'section', 143 `@/pages/News/news.vue`
107 props: (route) => ({ type: route.query.type }), 144 )
108 component: () => import( 145 },
109 /* webpackChunkName: "routes" */ 146 // {
110 /* webpackMode: "lazy-once" */ 147 // path: '/reminder',
111 `@/pages/Section/section.vue` 148 // meta: { },
112 ) 149 // name: 'reminder',
113 }, 150 // props: (route) => ({ type: route.query.type }),
114 // { 151 // component: () => import(
115 // path: '/event', 152 // /* webpackChunkName: "routes" */
116 // meta: { }, 153 // /* webpackMode: "lazy-once" */
117 // name: 'event', 154 // `@/pages/Reminder/reminder.vue`
118 // props: (route) => ({ type: route.query.type }), 155 // )
119 // component: () => import( 156 // },
120 // /* webpackChunkName: "routes" */ 157 {
121 // /* webpackMode: "lazy-once" */ 158 path: '/timeTable',
122 // `@/pages/Event/event.vue` 159 meta: {},
123 // ) 160 name: 'timeTable',
124 // }, 161 props: (route) => ({ type: route.query.type }),
125 { 162 component: () =>
126 path: '/news', 163 import (
127 meta: { }, 164 /* webpackChunkName: "routes" */
128 name: 'news', 165 /* webpackMode: "lazy-once" */
129 props: (route) => ({ type: route.query.type }), 166 `@/pages/TimeTable/timeTable.vue`
130 component: () => import( 167 )
131 /* webpackChunkName: "routes" */ 168 },
132 /* webpackMode: "lazy-once" */ 169 {
133 `@/pages/News/news.vue` 170 path: '/notification',
134 ) 171 meta: {},
135 }, 172 name: 'notification',