viithiisys / School-Management-dashboard

Download as
Browse Code ยป

Commit c8fc8e42e916000a9966539a8e5732346554c976

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

solved issues

Showing 5 changed files with 20 additions and 12 deletions   Show diff stats
1 const adminMenu = [ 1 const adminMenu = [
2 // { header: 'Apps' }, 2 // { header: 'Apps' },
3 { 3 {
4 title: 'Dashboard', 4 title: 'Dashboard',
5 // group: 'apps', 5 // group: 'apps',
6 name: 'Dashboard', 6 name: 'Dashboard',
7 icon: '/static/icon/dashboard.png', 7 icon: '/static/icon/dashboard.png',
8 }, 8 },
9 { 9 {
10 title: 'Class', 10 title: 'Class',
11 // group: 'apps', 11 // group: 'apps',
12 name: 'Class', 12 name: 'Class',
13 icon: '/static/icon/class.png', 13 icon: '/static/icon/class.png',
14 }, 14 },
15 { 15 {
16 title: 'Section', 16 title: 'Section',
17 // group: 'apps', 17 // group: 'apps',
18 name: 'Section', 18 name: 'Section',
19 icon: '/static/icon/section.png', 19 icon: '/static/icon/section.png',
20 }, 20 },
21 { 21 {
22 title: 'Subjects', 22 title: 'Subjects',
23 name: 'Subject', 23 name: 'Subject',
24 icon: '/static/icon/subject.png', 24 icon: '/static/icon/subject.png',
25 }, 25 },
26 { 26 {
27 title: 'Parents', 27 title: 'Parents',
28 // group: 'apps', 28 // group: 'apps',
29 name: 'Parents', 29 name: 'Parents',
30 icon: '/static/icon/parents.png', 30 icon: '/static/icon/parents.png',
31 }, 31 },
32 { 32 {
33 title: 'Teachers', 33 title: 'Teachers',
34 // group: '', 34 // group: '',
35 name: 'Teachers', 35 name: 'Teachers',
36 icon: '/static/icon/teacher.png', 36 icon: '/static/icon/teacher.png',
37 }, 37 },
38 { 38 {
39 title: 'Students', 39 title: 'Students',
40 // group: 'apps', 40 // group: 'apps',
41 name: 'Students', 41 name: 'Students',
42 icon: '/static/icon/student.png', 42 icon: '/static/icon/student.png',
43 }, 43 },
44 { 44 {
45 title: 'User', 45 title: 'User',
46 name: 'User', 46 name: 'User',
47 icon: '/static/icon/users.png', 47 icon: '/static/icon/users.png',
48 }, 48 },
49 { 49 {
50 title: 'Attendance', 50 title: 'Attendance',
51 group: 'Attendance', 51 group: 'Attendance',
52 component: 'Attendance', 52 component: 'Attendance',
53 icon: '/static/icon/attendence.png', 53 icon: '/static/icon/attendence.png',
54 items: [ 54 items: [
55 { name: 'StudentAttendence', title: 'Student Attendance', component: 'Student Attendence', action: '', }, 55 { name: 'StudentAttendence', title: 'Student Attendance', component: 'Student Attendence', action: '', },
56 { name: 'TeacherAttendence', title: 'Teacher Attendance', component: 'Teacher Attendence', action: '', } 56 { name: 'TeacherAttendence', title: 'Teacher Attendance', component: 'Teacher Attendence', action: '', }
57 // { name: 'userAttendence', title: 'User Attendance', component: 'userAttendence', action: '', }, 57 // { name: 'userAttendence', title: 'User Attendance', component: 'userAttendence', action: '', },
58 ] 58 ]
59 }, 59 },
60 { 60 {
61 title: 'Exam', 61 title: 'Exam',
62 group: 'Exam', 62 group: 'Exam',
63 component: 'Exam', 63 component: 'Exam',
64 icon: '/static/icon/exam.png', 64 icon: '/static/icon/exam.png',
65 items: [ 65 items: [
66 { name: 'Exam', title: 'Exam', component: 'Exam', action: '', }, 66 { name: 'Exam', title: 'Exam', component: 'Exam', action: '', },
67 { name: 'ExamSchedule', title: 'Exam Schedule', component: 'Exam Schedule', action: '', }, 67 { name: 'ExamSchedule', title: 'Exam Schedule', component: 'Exam Schedule', action: '', },
68 { name: 'Grade', title: 'Grade', component: 'Grade', action: '', }, 68 { name: 'Grade', title: 'Grade', component: 'Grade', action: '', },
69 // { name: 'userAttendence', title: 'User Attendance', component: 'userAttendence', action: '', }, 69 // { name: 'userAttendence', title: 'User Attendance', component: 'userAttendence', action: '', },
70 ] 70 ]
71 }, 71 },
72 { 72 {
73 title: 'Marks', 73 title: 'Marks',
74 group: 'Mark', 74 group: 'Mark',
75 component: 'Mark', 75 component: 'Mark',
76 icon: '/static/icon/marks.png', 76 icon: '/static/icon/marks.png',
77 items: [ 77 items: [
78 { name: 'Mark', title: 'Mark', component: 'Mark', action: '', }, 78 { name: 'Mark', title: 'Mark', component: 'Mark', action: '', },
79 { name: 'MarkDistribution', title: 'Mark Distribution', component: 'Mark Distribution', action: '', }, 79 { name: 'MarkDistribution', title: 'Mark Distribution', component: 'Mark Distribution', action: '', },
80 { name: 'Promotion', title: 'promotion', component: 'Promotion', action: '', }, 80 { name: 'Promotion', title: 'promotion', component: 'Promotion', action: '', },
81 // { name: 'userAttendence', title: 'User Attendance', component: 'userAttendence', action: '', }, 81 // { name: 'userAttendence', title: 'User Attendance', component: 'userAttendence', action: '', },
82 ] 82 ]
83 }, 83 },
84 { 84 {
85 title: 'Administrator', 85 title: 'Administrator',
86 group: 'Administrator', 86 group: 'Administrator',
87 component: 'Administrator', 87 component: 'Administrator',
88 icon: '/static/icon/adminstrator.png', 88 icon: '/static/icon/adminstrator.png',
89 items: [ 89 items: [
90 { name: 'AcademicYear', title: 'Academic Year', component: 'Academic Year', action: '', }, 90 { name: 'AcademicYear', title: 'Academic Year', component: 'Academic Year', action: '', },
91 // { name: 'systemAdmin', title: 'System Admin', component: 'systemAdmin', action: '', }, 91 // { name: 'systemAdmin', title: 'System Admin', component: 'systemAdmin', action: '', },
92 { name: 'resetPassword', title: 'Reset Password', component: 'Reset Password', action: '', }, 92 { name: 'resetPassword', title: 'Change Password', component: 'Change Password', action: '', },
93 { name: 'Role', title: 'Role', component: 'Role', action: '', }, 93 { name: 'Role', title: 'Role', component: 'Role', action: '', },
94 { name: 'BulkImport', title: 'Bulk Import', component: 'Bulk Import', action: '', }, 94 { name: 'BulkImport', title: 'Bulk Import', component: 'Bulk Import', action: '', },
95 95
96 ] 96 ]
97 }, 97 },
98 { 98 {
99 title: 'Notice Board', 99 title: 'Notice Board',
100 name: 'Notice Board', 100 name: 'Notice Board',
101 icon: '/static/icon/notice board.png', 101 icon: '/static/icon/notice board.png',
102 }, 102 },
103 { 103 {
104 title: 'News', 104 title: 'News',
105 name: 'News', 105 name: 'News',
106 icon: '/static/icon/news.png', 106 icon: '/static/icon/news.png',
107 }, 107 },
108 // { 108 // {
109 // title: 'Reminder', 109 // title: 'Reminder',
110 // name: 'reminder', 110 // name: 'reminder',
111 // icon: 'alarm_add', 111 // icon: 'alarm_add',
112 // }, 112 // },
113 { 113 {
114 title: 'Time Table', 114 title: 'Time Table',
115 name: 'Time Table', 115 name: 'Time Table',
116 icon: '/static/icon/time table.png', 116 icon: '/static/icon/time table.png',
117 }, 117 },
118 { 118 {
119 title: 'Library', 119 title: 'Library',
120 group: 'Library', 120 group: 'Library',
121 component: 'Library', 121 component: 'Library',
122 icon: '/static/icon/library.png', 122 icon: '/static/icon/library.png',
123 items: [ 123 items: [
124 { name: 'LibraryMember', title: ' Library Member', component: 'Library Member', action: '', }, 124 { name: 'LibraryMember', title: ' Library Member', component: 'Library Member', action: '', },
125 { name: 'Books', title: 'Books', component: 'Books', action: '', }, 125 { name: 'Books', title: 'Books', component: 'Books', action: '', },
126 { name: 'Issue', title: ' Issue', component: 'Issue', action: '', }, 126 { name: 'Issue', title: ' Issue', component: 'Issue', action: '', },
127 { name: 'E-Books', title: 'E-Books', component: 'E-Books', action: '', } 127 { name: 'E-Books', title: 'E-Books', component: 'E-Books', action: '', }
128 128
129 ] 129 ]
130 }, 130 },
131 { 131 {
132 title: 'Report', 132 title: 'Report',
133 group: 'Report', 133 group: 'Report',
134 component: 'Report', 134 component: 'Report',
135 icon: '/static/icon/reports.png', 135 icon: '/static/icon/reports.png',
136 items: [ 136 items: [
137 { name: 'studentReport', title: 'Student Report', component: 'Student Report', action: '', }, 137 { name: 'studentReport', title: 'Student Report', component: 'Student Report', action: '', },
138 { name: 'ProgressCardReport', title: 'Progress Card Report', component: 'Progress Card Report', action: '', } 138 { name: 'ProgressCardReport', title: 'Progress Card Report', component: 'Progress Card Report', action: '', }
139 ] 139 ]
140 }, 140 },
141 { 141 {
142 title: 'Notification', 142 title: 'Notification',
143 name: 'Notification', 143 name: 'Notification',
144 icon: '/static/icon/notification.png', 144 icon: '/static/icon/notification.png',
145 }, 145 },
146 { 146 {
147 title: 'Social Media', 147 title: 'Social Media',
148 name: 'Social Media', 148 name: 'Social Media',
149 icon: '/static/icon/events.png', 149 icon: '/static/icon/events.png',
150 }, 150 },
151 { 151 {
152 title: 'Gallery', 152 title: 'Gallery',
153 name: 'Gallery', 153 name: 'Gallery',
154 icon: '/static/icon/gallery.png', 154 icon: '/static/icon/gallery.png',
155 }, 155 },
156 { 156 {
157 title: 'Event', 157 title: 'Event',
158 name: 'Event', 158 name: 'Event',
159 icon: '/static/icon/events.png', 159 icon: '/static/icon/events.png',
160 }, 160 },
161 { 161 {
162 title: 'Account', 162 title: 'Account',
163 group: 'Account', 163 group: 'Account',
164 component: 'Account', 164 component: 'Account',
165 icon: '/static/icon/accounts.png', 165 icon: '/static/icon/accounts.png',
166 items: [ 166 items: [
167 { name: 'feeTypes', title: 'Fee Types', component: 'Fee Types', action: '', }, 167 { name: 'feeTypes', title: 'Fee Types', component: 'Fee Types', action: '', },
168 { name: 'Invoice', title: 'Invoice', component: 'Invoice', action: '', }, 168 { name: 'Invoice', title: 'Invoice', component: 'Invoice', action: '', },
169 { name: 'PaymentHistory', title: 'Payment History', component: 'Payment History', action: '', }, 169 { name: 'PaymentHistory', title: 'Payment History', component: 'Payment History', action: '', },
170 { name: 'Expense', title: 'Expense', component: 'Expense', action: '', }, 170 { name: 'Expense', title: 'Expense', component: 'Expense', action: '', },
171 { name: 'Income', title: 'Income', component: 'Income', action: '', }, 171 { name: 'Income', title: 'Income', component: 'Income', action: '', },
172 { name: 'GlobalPayment', title: 'Global Payment', component: 'Global Payment', action: '', } 172 { name: 'GlobalPayment', title: 'Global Payment', component: 'Global Payment', action: '', }
173 ] 173 ]
174 }, 174 },
175 { 175 {
176 title: 'Holiday', 176 title: 'Holiday',
177 name: 'Holiday', 177 name: 'Holiday',
178 icon: '/static/icon/holiday.png', 178 icon: '/static/icon/holiday.png',
179 }, 179 },
180 { 180 {
181 title: 'General Setting', 181 title: 'General Setting',
182 name: 'General Setting', 182 name: 'General Setting',
183 icon: '/static/icon/settings.png', 183 icon: '/static/icon/settings.png',
184 } 184 }
185 ]; 185 ];
186 186
187 const libraryMenu = [{ 187 const libraryMenu = [{
188 title: 'Library', 188 title: 'Library',
189 group: 'Library', 189 group: 'Library',
190 component: 'Library', 190 component: 'Library',
191 icon: '/static/schoolIcons/Library.png', 191 icon: '/static/schoolIcons/Library.png',
192 items: [ 192 items: [
193 { name: 'libraryMember', title: ' Library Member', component: 'libraryMember', action: '', }, 193 { name: 'libraryMember', title: ' Library Member', component: 'libraryMember', action: '', },
194 { name: 'Books', title: 'Books', component: 'Books', action: '', }, 194 { name: 'Books', title: 'Books', component: 'Books', action: '', },
195 { name: 'Issue', title: ' Issue', component: 'Issue', action: '', }, 195 { name: 'Issue', title: ' Issue', component: 'Issue', action: '', },
196 { name: 'eBooks', title: 'E-Books', component: 'eBooks', action: '', } 196 { name: 'eBooks', title: 'E-Books', component: 'eBooks', action: '', }
197 197
198 ] 198 ]
199 }]; 199 }];
200 200
201 const accountMenu = [{ 201 const accountMenu = [{
202 title: 'Account', 202 title: 'Account',
203 group: 'Account', 203 group: 'Account',
204 component: 'Account', 204 component: 'Account',
205 icon: '/static/schoolIcons/Account.png', 205 icon: '/static/schoolIcons/Account.png',
206 items: [ 206 items: [
207 { name: 'feeTypes', title: 'Fee Types', component: 'feeTypes', action: '', }, 207 { name: 'feeTypes', title: 'Fee Types', component: 'feeTypes', action: '', },
208 { name: 'Invoice', title: 'Invoice', component: 'Invoice', action: '', }, 208 { name: 'Invoice', title: 'Invoice', component: 'Invoice', action: '', },
209 { name: 'paymentHistory', title: 'Payment History', component: 'paymentHistory', action: '', }, 209 { name: 'paymentHistory', title: 'Payment History', component: 'paymentHistory', action: '', },
210 { name: 'Expense', title: 'Expense', component: 'Expense', action: '', }, 210 { name: 'Expense', title: 'Expense', component: 'Expense', action: '', },
211 { name: 'Income', title: 'Income', component: 'Income', action: '', }, 211 { name: 'Income', title: 'Income', component: 'Income', action: '', },
212 { name: 'GlobalPayment', title: 'Global Payment', component: 'GlobalPayment', action: '', } 212 { name: 'GlobalPayment', title: 'Global Payment', component: 'GlobalPayment', action: '', }
213 ] 213 ]
214 }]; 214 }];
215 215
216 const schoolMenu = [ 216 const schoolMenu = [
217 // { header: 'Apps' }, 217 // { header: 'Apps' },
218 { 218 {
219 title: 'Dashboard', 219 title: 'Dashboard',
220 // group: 'apps', 220 // group: 'apps',
221 name: 'Dashboard', 221 name: 'Dashboard',
222 icon: '/static/icon/dashboard.png', 222 icon: '/static/icon/dashboard.png',
223 }, 223 },
224 { 224 {
225 title: 'School', 225 title: 'School',
226 // group: 'apps', 226 // group: 'apps',
227 name: 'School', 227 name: 'School',
228 icon: '/static/schoolIcons/Dashboard.png', 228 icon: '/static/schoolIcons/Dashboard.png',
229 } 229 }
230 ]; 230 ];
231 231
232 // reorder menu 232 // reorder menu
233 // Menu.forEach((item) => { 233 // Menu.forEach((item) => {
234 // if (item.items) { 234 // if (item.items) {
235 // item.items.sort((x, y) => { 235 // item.items.sort((x, y) => {
236 // let textA = x.title.toUpperCase(); 236 // let textA = x.title.toUpperCase();
237 // let textB = y.title.toUpperCase(); 237 // let textB = y.title.toUpperCase();
238 // return (textA < textB) ? -1 : (textA > textB) ? 1 : 0; 238 // return (textA < textB) ? -1 : (textA > textB) ? 1 : 0;
239 // }); 239 // });
240 // } 240 // }
241 // }); 241 // });
242 242
243 export default { adminMenu, schoolMenu, libraryMenu, accountMenu }; 243 export default { adminMenu, schoolMenu, libraryMenu, accountMenu };
src/pages/Exam/exam.vue
Diff comments   View file @c8fc8e4
1 <template> 1 <template>
2 <v-container fluid class="body-color"> 2 <v-container fluid class="body-color">
3 <!-- ****** EDIT EXAM ****** --> 3 <!-- ****** EDIT EXAM ****** -->
4 <v-dialog v-model="editExamDialog" max-width="600px" scrollable> 4 <v-dialog v-model="editExamDialog" max-width="600px" scrollable>
5 <v-card flat class="card-style pa-2" dark> 5 <v-card flat class="card-style pa-2" dark>
6 <v-layout> 6 <v-layout>
7 <v-flex xs12> 7 <v-flex xs12>
8 <label class="title text-xs-center">Edit Exam</label> 8 <label class="title text-xs-center">Edit Exam</label>
9 <v-icon size="24" class="right" @click="editExamDialog = false">cancel</v-icon> 9 <v-icon size="24" class="right" @click="editExamDialog = false">cancel</v-icon>
10 </v-flex> 10 </v-flex>
11 </v-layout> 11 </v-layout>
12 <v-card-text> 12 <v-card-text>
13 <v-form ref="form"> 13 <v-form ref="form">
14 <v-container fluid> 14 <v-container fluid>
15 <v-layout wrap> 15 <v-layout wrap>
16 <v-flex xs12 sm12> 16 <v-flex xs12 sm12>
17 <v-layout> 17 <v-layout>
18 <v-flex xs4 class="pt-4 subheading"> 18 <v-flex xs4 class="pt-4 subheading">
19 <label class="right">Exam Name:</label> 19 <label class="right">Exam Name:</label>
20 </v-flex> 20 </v-flex>
21 <v-flex xs7 class="ml-3"> 21 <v-flex xs7 class="ml-3">
22 <v-text-field 22 <v-text-field
23 placeholder="fill your Serial Number" 23 placeholder="fill your Serial Number"
24 v-model="editedItem.examName" 24 v-model="editedItem.examName"
25 type="text" 25 type="text"
26 ></v-text-field> 26 ></v-text-field>
27 </v-flex> 27 </v-flex>
28 </v-layout> 28 </v-layout>
29 </v-flex> 29 </v-flex>
30 <v-flex xs12 sm12> 30 <v-flex xs12 sm12>
31 <v-layout> 31 <v-layout>
32 <v-flex xs4 class="pt-4 subheading"> 32 <v-flex xs4 class="pt-4 subheading">
33 <label class="right">Date:</label> 33 <label class="right">Date:</label>
34 </v-flex> 34 </v-flex>
35 <v-flex xs7 class="ml-3"> 35 <v-flex xs7 class="ml-3">
36 <v-menu 36 <v-menu
37 ref="menu1" 37 ref="menu1"
38 :close-on-content-click="false" 38 :close-on-content-click="false"
39 v-model="menu1" 39 v-model="menu1"
40 :nudge-right="40" 40 :nudge-right="40"
41 :return-value.sync="menu1" 41 :return-value.sync="menu1"
42 lazy 42 lazy
43 transition="scale-transition" 43 transition="scale-transition"
44 offset-y 44 offset-y
45 full-width 45 full-width
46 min-width="290px" 46 min-width="290px"
47 > 47 >
48 <v-text-field 48 <v-text-field
49 slot="activator" 49 slot="activator"
50 v-model="editedItem.date" 50 v-model="editedItem.date"
51 label="Select Date" 51 label="Select Date"
52 append-icon="event" 52 append-icon="event"
53 readonly 53 readonly
54 ></v-text-field> 54 ></v-text-field>
55 <v-date-picker v-model="editedItem.date" @input="menu1 = false"></v-date-picker> 55 <v-date-picker v-model="editedItem.date" @input="menu1 = false"></v-date-picker>
56 </v-menu> 56 </v-menu>
57 </v-flex> 57 </v-flex>
58 </v-layout> 58 </v-layout>
59 </v-flex> 59 </v-flex>
60 <v-flex xs12 sm12> 60 <v-flex xs12 sm12>
61 <v-layout> 61 <v-layout>
62 <v-flex xs4 class="pt-4 subheading"> 62 <v-flex xs4 class="pt-4 subheading">
63 <label class="right">Note:</label> 63 <label class="right">Note:</label>
64 </v-flex> 64 </v-flex>
65 <v-flex xs7 class="ml-3"> 65 <v-flex xs7 class="ml-3">
66 <v-text-field 66 <v-text-field
67 placeholder="fill your Serial Number" 67 placeholder="fill your Serial Number"
68 v-model="editedItem.note" 68 v-model="editedItem.note"
69 type="text" 69 type="text"
70 ></v-text-field> 70 ></v-text-field>
71 </v-flex> 71 </v-flex>
72 </v-layout> 72 </v-layout>
73 </v-flex> 73 </v-flex>
74 </v-layout> 74 </v-layout>
75 <v-layout> 75 <v-layout>
76 <v-flex xs12> 76 <v-flex xs12>
77 <v-card-actions> 77 <v-card-actions>
78 <v-spacer></v-spacer> 78 <v-spacer></v-spacer>
79 <v-btn round dark @click="save" class="add-button">Save</v-btn> 79 <v-btn round dark @click="save" class="add-button">Save</v-btn>
80 </v-card-actions> 80 </v-card-actions>
81 </v-flex> 81 </v-flex>
82 </v-layout> 82 </v-layout>
83 </v-container> 83 </v-container>
84 </v-form> 84 </v-form>
85 </v-card-text> 85 </v-card-text>
86 </v-card> 86 </v-card>
87 </v-dialog> 87 </v-dialog>
88 88
89 <!-- ****** PROFILE VIEW PARTICULAR EXAM ****** --> 89 <!-- ****** PROFILE VIEW PARTICULAR EXAM ****** -->
90 90
91 <v-dialog v-model="profileExamDialog" max-width="500px"> 91 <v-dialog v-model="profileExamDialog" max-width="500px">
92 <v-card flat class="card-style pa-3" dark> 92 <v-card flat class="card-style pa-3" dark>
93 <v-layout> 93 <v-layout>
94 <v-flex xs12> 94 <v-flex xs12>
95 <label class="title text-xs-center">View Exam</label> 95 <label class="title text-xs-center">View Exam</label>
96 <v-icon size="24" class="right" @click="profileExamDialog = false">cancel</v-icon> 96 <v-icon size="24" class="right" @click="profileExamDialog = false">cancel</v-icon>
97 </v-flex> 97 </v-flex>
98 </v-layout> 98 </v-layout>
99 <v-card-text> 99 <v-card-text>
100 <v-container grid-list-md> 100 <v-container grid-list-md>
101 <v-layout wrap> 101 <v-layout wrap>
102 <v-flex> 102 <v-flex>
103 <v-layout> 103 <v-layout>
104 <v-flex xs6 sm4> 104 <v-flex xs6 sm4>
105 <h5 class="right my-1"> 105 <h5 class="right my-1">
106 <b>Exam Name:</b> 106 <b>Exam Name:</b>
107 </h5> 107 </h5>
108 </v-flex> 108 </v-flex>
109 <v-flex sm8 xs6> 109 <v-flex sm8 xs6>
110 <h5 class="my-1">{{ editedItem.examName }}</h5> 110 <h5 class="my-1">{{ editedItem.examName }}</h5>
111 </v-flex> 111 </v-flex>
112 </v-layout> 112 </v-layout>
113 <v-layout> 113 <v-layout>
114 <v-flex xs6 sm4> 114 <v-flex xs6 sm4>
115 <h5 class="right my-1"> 115 <h5 class="right my-1">
116 <b>Date:</b> 116 <b>Date:</b>
117 </h5> 117 </h5>
118 </v-flex> 118 </v-flex>
119 <v-flex sm8 xs6> 119 <v-flex sm8 xs6>
120 <h5 class="my-1">{{ dates(editedItem.date) }}</h5> 120 <h5 class="my-1">{{ dates(editedItem.date) }}</h5>
121 </v-flex> 121 </v-flex>
122 </v-layout> 122 </v-layout>
123 <v-layout> 123 <v-layout>
124 <v-flex xs6 sm4> 124 <v-flex xs6 sm4>
125 <h5 class="right my-1"> 125 <h5 class="right my-1">
126 <b>Note:</b> 126 <b>Note:</b>
127 </h5> 127 </h5>
128 </v-flex> 128 </v-flex>
129 <v-flex sm8 xs6> 129 <v-flex sm8 xs6>
130 <h5 class="my-1">{{ editedItem.note }}</h5> 130 <h5 class="my-1">{{ editedItem.note }}</h5>
131 </v-flex> 131 </v-flex>
132 </v-layout> 132 </v-layout>
133 </v-flex> 133 </v-flex>
134 </v-layout> 134 </v-layout>
135 </v-container> 135 </v-container>
136 </v-card-text> 136 </v-card-text>
137 </v-card> 137 </v-card>
138 </v-dialog> 138 </v-dialog>
139 <!-- ****** EXAM TABLE****** --> 139 <!-- ****** EXAM TABLE****** -->
140 140
141 <v-toolbar color="transparent" flat> 141 <v-toolbar color="transparent" flat>
142 <v-btn 142 <v-btn
143 fab 143 fab
144 dark 144 dark
145 class="open-dialog-button hidden-xl-only hidden-md-only hidden-lg-only" 145 class="open-dialog-button hidden-xl-only hidden-md-only hidden-lg-only"
146 small 146 small
147 @click="addExamDialog = true" 147 @click="addExamDialog = true"
148 > 148 >
149 <v-icon dark>add</v-icon> 149 <v-icon dark>add</v-icon>
150 </v-btn> 150 </v-btn>
151 <v-btn 151 <v-btn
152 round 152 round
153 class="open-dialog-button hidden-sm-only hidden-xs-only" 153 class="open-dialog-button hidden-sm-only hidden-xs-only"
154 dark 154 dark
155 @click="addExamDialog = true" 155 @click="addExamDialog = true"
156 > 156 >
157 <v-icon class="white--text pr-1" size="20">add</v-icon>Add Exam 157 <v-icon class="white--text pr-1" size="20">add</v-icon>Add Exam
158 </v-btn> 158 </v-btn>
159 <v-spacer></v-spacer> 159 <v-spacer></v-spacer>
160 <v-card-title class="body-1" v-show="show"> 160 <v-card-title class="body-1" v-show="show">
161 <v-btn icon large flat @click="displaySearch"> 161 <v-btn icon large flat @click="displaySearch">
162 <v-avatar size="27"> 162 <v-avatar size="27">
163 <img src="/static/icon/search.png" alt="icon" /> 163 <img src="/static/icon/search.png" alt="icon" />
164 </v-avatar> 164 </v-avatar>
165 </v-btn> 165 </v-btn>
166 </v-card-title> 166 </v-card-title>
167 <v-flex xs8 sm8 md3 lg2 v-show="showSearch"> 167 <v-flex xs8 sm8 md3 lg2 v-show="showSearch">
168 <v-layout> 168 <v-layout>
169 <v-text-field v-model="search" label="Search" prepend-inner-icon="search" color="primary"></v-text-field> 169 <v-text-field v-model="search" label="Search" prepend-inner-icon="search" color="primary"></v-text-field>
170 <v-icon @click="closeSearch" color="error">close</v-icon> 170 <v-icon @click="closeSearch" color="error">close</v-icon>
171 </v-layout> 171 </v-layout>
172 </v-flex> 172 </v-flex>
173 </v-toolbar> 173 </v-toolbar>
174 <v-data-table 174 <v-data-table
175 :headers="headers" 175 :headers="headers"
176 :items="examData" 176 :items="examData"
177 :pagination.sync="pagination" 177 :pagination.sync="pagination"
178 :search="search" 178 :search="search"
179 > 179 >
180 <template slot="items" slot-scope="props"> 180 <template slot="items" slot-scope="props">
181 <tr class="tr"> 181 <tr class="tr">
182 <td class="td td-row">{{ props.index + 1}}</td> 182 <td class="td td-row">{{ props.index + 1}}</td>
183 <td class="td td-row text-xs-center">{{ props.item.examName}}</td> 183 <td class="td td-row text-xs-center">{{ props.item.examName}}</td>
184 <td class="td td-row text-xs-center">{{ dates(props.item.date) }}</td> 184 <td class="td td-row text-xs-center">{{ dates(props.item.date) }}</td>
185 <td class="td td-row text-xs-center">{{ props.item.note}}</td> 185 <td class="td td-row text-xs-center">{{ props.item.note}}</td>
186 <td class="td td-row text-xs-center"> 186 <td class="td td-row text-xs-center">
187 <span> 187 <span>
188 <v-tooltip top> 188 <v-tooltip top>
189 <img 189 <img
190 slot="activator" 190 slot="activator"
191 style="cursor:pointer; width:25px; height:25px; " 191 style="cursor:pointer; width:25px; height:25px; "
192 class="mr-3" 192 class="mr-3"
193 @click="profile(props.item)" 193 @click="profile(props.item)"
194 src="/static/icon/view.png" 194 src="/static/icon/view.png"
195 /> 195 />
196 <span>View</span> 196 <span>View</span>
197 </v-tooltip> 197 </v-tooltip>
198 <v-tooltip top> 198 <v-tooltip top>
199 <img 199 <img
200 slot="activator" 200 slot="activator"
201 style="cursor:pointer; width:20px; height:18px; " 201 style="cursor:pointer; width:20px; height:18px; "
202 class="mr-3" 202 class="mr-3"
203 @click="editItem(props.item)" 203 @click="editItem(props.item)"
204 src="/static/icon/edit.png" 204 src="/static/icon/edit.png"
205 /> 205 />
206 <span>Edit</span> 206 <span>Edit</span>
207 </v-tooltip> 207 </v-tooltip>
208 <v-tooltip top> 208 <v-tooltip top>
209 <img 209 <img
210 slot="activator" 210 slot="activator"
211 style="cursor:pointer; width:20px; height:20px; " 211 style="cursor:pointer; width:20px; height:20px; "
212 class="mr-3" 212 class="mr-3"
213 @click="deleteItem(props.item)" 213 @click="deleteItem(props.item)"
214 src="/static/icon/delete.png" 214 src="/static/icon/delete.png"
215 /> 215 />
216 <span>Delete</span> 216 <span>Delete</span>
217 </v-tooltip> 217 </v-tooltip>
218 </span> 218 </span>
219 </td> 219 </td>
220 </tr> 220 </tr>
221 </template> 221 </template>
222 <v-alert 222 <v-alert
223 slot="no-results" 223 slot="no-results"
224 :value="true" 224 :value="true"
225 color="error" 225 color="error"
226 icon="warning" 226 icon="warning"
227 >Your search for "{{ search }}" found no results.</v-alert> 227 >Your search for "{{ search }}" found no results.</v-alert>
228 </v-data-table> 228 </v-data-table>
229 229
230 <!-- ****** ADD EXAM ****** --> 230 <!-- ****** ADD EXAM ****** -->
231 <v-dialog v-model="addExamDialog" max-width="500px"> 231 <v-dialog v-model="addExamDialog" max-width="500px">
232 <v-card flat class="card-style pa-2" dark> 232 <v-card flat class="card-style pa-2" dark>
233 <v-layout> 233 <v-layout>
234 <v-flex xs12> 234 <v-flex xs12>
235 <label class="title text-xs-center">Add Exam</label> 235 <label class="title text-xs-center">Add Exam</label>
236 <v-icon size="24" class="right" @click="addExamDialog = false">cancel</v-icon> 236 <v-icon size="24" class="right" @click="addExamDialog = false">cancel</v-icon>
237 </v-flex> 237 </v-flex>
238 </v-layout> 238 </v-layout>
239 <v-form ref="form" v-model="valid" lazy-validation> 239 <v-form ref="form" v-model="valid" lazy-validation>
240 <v-container fluid> 240 <v-container fluid>
241 <v-flex xs12> 241 <v-flex xs12>
242 <v-layout> 242 <v-layout>
243 <v-flex xs4 class="pt-4 subheading"> 243 <v-flex xs4 class="pt-4 subheading">
244 <label class="right hidden-xs-only">Exam Name:</label> 244 <label class="right hidden-xs-only">Exam Name:</label>
245 <label 245 <label
246 class="right hidden-sm-only hidden-md-only hidden-lg-only hidden-xl-only" 246 class="right hidden-sm-only hidden-md-only hidden-lg-only hidden-xl-only"
247 >ExamName:</label> 247 >ExamName:</label>
248 </v-flex> 248 </v-flex>
249 <v-flex xs8 sm7 class="ml-3"> 249 <v-flex xs8 sm7 class="ml-3">
250 <v-text-field 250 <v-text-field
251 placeholder="fill your Exam Name" 251 placeholder="fill your Exam Name"
252 :rules="authorRules" 252 :rules="authorRules"
253 v-model="addExam.examName" 253 v-model="addExam.examName"
254 ></v-text-field> 254 ></v-text-field>
255 </v-flex> 255 </v-flex>
256 </v-layout> 256 </v-layout>
257 </v-flex> 257 </v-flex>
258 <v-flex xs12> 258 <v-flex xs12>
259 <v-layout> 259 <v-layout>
260 <v-flex xs4 class="pt-4 subheading"> 260 <v-flex xs4 class="pt-4 subheading">
261 <label class="right">Date:</label> 261 <label class="right">Date:</label>
262 </v-flex> 262 </v-flex>
263 <v-flex xs8 sm7 class="ml-3"> 263 <v-flex xs8 sm7 class="ml-3">
264 <v-menu 264 <v-menu
265 ref="menu2" 265 ref="menu2"
266 :close-on-content-click="false" 266 :close-on-content-click="false"
267 v-model="menu2" 267 v-model="menu2"
268 :nudge-right="40" 268 :nudge-right="40"
269 :return-value.sync="addExam.date" 269 :return-value.sync="addExam.date"
270 lazy 270 lazy
271 transition="scale-transition" 271 transition="scale-transition"
272 offset-y 272 offset-y
273 full-width 273 full-width
274 min-width="290px" 274 min-width="290px"
275 > 275 >
276 <v-text-field 276 <v-text-field
277 slot="activator" 277 slot="activator"
278 v-model="addExam.date" 278 v-model="addExam.date"
279 :rules="examDateRules" 279 :rules="examDateRules"
280 label="Select Date" 280 label="Select Date"
281 append-icon="event" 281 append-icon="event"
282 readonly 282 readonly
283 ></v-text-field> 283 ></v-text-field>
284 <v-date-picker v-model="addExam.date" @input="$refs.menu2.save(addExam.date)"></v-date-picker> 284 <v-date-picker v-model="addExam.date" @input="$refs.menu2.save(addExam.date)"></v-date-picker>
285 </v-menu> 285 </v-menu>
286 </v-flex> 286 </v-flex>
287 </v-layout> 287 </v-layout>
288 </v-flex> 288 </v-flex>
289 <v-flex xs12> 289 <v-flex xs12>
290 <v-layout> 290 <v-layout>
291 <v-flex xs4 class="pt-4 subheading"> 291 <v-flex xs4 class="pt-4 subheading">
292 <label class="right">Note:</label> 292 <label class="right">Note:</label>
293 </v-flex> 293 </v-flex>
294 <v-flex xs8 sm7 class="ml-3"> 294 <v-flex xs8 sm7 class="ml-3">
295 <v-text-field 295 <v-text-field
296 placeholder="fill your Note" 296 placeholder="fill your Note"
297 :rules="noteRules"
298 v-model="addExam.note" 297 v-model="addExam.note"
299 ></v-text-field> 298 ></v-text-field>
300 </v-flex> 299 </v-flex>
301 </v-layout> 300 </v-layout>
302 </v-flex> 301 </v-flex>
303 <v-layout> 302 <v-layout>
304 <v-flex xs12> 303 <v-flex xs12>
305 <v-card-actions> 304 <v-card-actions>
306 <v-spacer class="hidden-xs-only"></v-spacer> 305 <v-spacer class="hidden-xs-only"></v-spacer>
307 <v-btn @click="clear" round dark class="clear-button">clear</v-btn> 306 <v-btn @click="clear" round dark class="clear-button">clear</v-btn>
308 <v-btn @click="submit" round dark :loading="loading" class="add-button">Add</v-btn> 307 <v-btn @click="submit" round dark :loading="loading" class="add-button">Add</v-btn>
309 </v-card-actions> 308 </v-card-actions>
310 </v-flex> 309 </v-flex>
311 </v-layout> 310 </v-layout>
312 </v-container> 311 </v-container>
313 </v-form> 312 </v-form>
314 </v-card> 313 </v-card>
315 </v-dialog> 314 </v-dialog>
316 <v-snackbar 315 <v-snackbar
317 :timeout="timeout" 316 :timeout="timeout"
318 :top="y === 'top'" 317 :top="y === 'top'"
319 :right="x === 'right'" 318 :right="x === 'right'"
320 :vertical="mode === 'vertical'" 319 :vertical="mode === 'vertical'"
321 v-model="snackbar" 320 v-model="snackbar"
322 :color="color" 321 :color="color"
323 >{{ text }}</v-snackbar> 322 >{{ text }}</v-snackbar>
324 <div class="loader" v-if="showLoader"> 323 <div class="loader" v-if="showLoader">
325 <v-progress-circular indeterminate color="white"></v-progress-circular> 324 <v-progress-circular indeterminate color="white"></v-progress-circular>
326 </div> 325 </div>
327 </v-container> 326 </v-container>
328 </template> 327 </template>
329 328
330 <script> 329 <script>
331 import http from "@/Services/http.js"; 330 import http from "@/Services/http.js";
332 import moment from "moment"; 331 import moment from "moment";
333 332
334 export default { 333 export default {
335 data: () => ({ 334 data: () => ({
336 snackbar: false, 335 snackbar: false,
337 date: null, 336 date: null,
338 menu1: false, 337 menu1: false,
339 menu2: false, 338 menu2: false,
340 color: "", 339 color: "",
341 y: "top", 340 y: "top",
342 x: "right", 341 x: "right",
343 mode: "", 342 mode: "",
344 timeout: 10000, 343 timeout: 10000,
345 text: "", 344 text: "",
346 libraryId: "", 345 libraryId: "",
347 show: true, 346 show: true,
348 showSearch: false, 347 showSearch: false,
349 addExamDialog: false, 348 addExamDialog: false,
350 loading: false, 349 loading: false,
351 loadingSearch: false, 350 loadingSearch: false,
352 date: null, 351 date: null,
353 search: "", 352 search: "",
354 showLoader: false, 353 showLoader: false,
355 editExamDialog: false, 354 editExamDialog: false,
356 profileExamDialog: false, 355 profileExamDialog: false,
357 valid: true, 356 valid: true,
358 pagination: { 357 pagination: {
359 rowsPerPage: 10 358 rowsPerPage: 10
360 }, 359 },
361 libraryIDRules: [v => !!v || " Library ID is required"], 360 libraryIDRules: [v => !!v || " Library ID is required"],
362 bookRules: [v => !!v || " book Name is required"], 361 bookRules: [v => !!v || " book Name is required"],
363 authorRules: [v => !!v || "Author Name is required"], 362 authorRules: [v => !!v || "Author Name is required"],
364 subjectCodeRules: [v => !!v || "Subject Code is required"], 363 subjectCodeRules: [v => !!v || "Subject Code is required"],
365 authorRules: [v => !!v || "Author is required"], 364 authorRules: [v => !!v || "Author is required"],
366 noteRules: [v => !!v || "Note is required"],
367 examDateRules: [v => !!v || "Date is required"], 365 examDateRules: [v => !!v || "Date is required"],
368 headers: [ 366 headers: [
369 { 367 {
370 align: "", 368 align: "",
371 text: "No", 369 text: "No",
372 sortable: false, 370 sortable: false,
373 value: "No" 371 value: "No"
374 }, 372 },
375 { text: "Exam Name", vaue: "examName", sortable: false, align: "center" }, 373 { text: "Exam Name", vaue: "examName", sortable: false, align: "center" },
376 { 374 {
377 text: "Date", 375 text: "Date",
378 value: "date", 376 value: "date",
379 sortable: false, 377 sortable: false,
380 align: "center" 378 align: "center"
381 }, 379 },
382 { 380 {
383 text: "Note", 381 text: "Note",
384 value: "note", 382 value: "note",
385 sortable: false, 383 sortable: false,
386 align: "center" 384 align: "center"
387 }, 385 },
388 { text: "Action", value: "", sortable: false, align: "center" } 386 { text: "Action", value: "", sortable: false, align: "center" }
389 ], 387 ],
390 examData: [], 388 examData: [],
391 addExam: {}, 389 addExam: {},
392 editedItem: {}, 390 editedItem: {},
393 token: "" 391 token: ""
394 }), 392 }),
395 methods: { 393 methods: {
396 dates: function(date) { 394 dates: function(date) {
397 return moment(date).format("MMMM DD, YYYY"); 395 return moment(date).format("MMMM DD, YYYY");
398 }, 396 },
399 pickFile() { 397 pickFile() {
400 this.$refs.image.click(); 398 this.$refs.image.click();
401 }, 399 },
402 getExamList() { 400 getExamList() {
403 this.showLoader = true; 401 this.showLoader = true;
404 this.loadingSearch = true; 402 this.loadingSearch = true;
405 http() 403 http()
406 .get("/getExamsList", { 404 .get("/getExamsList", {
407 headers: { Authorization: "Bearer " + this.token } 405 headers: { Authorization: "Bearer " + this.token }
408 }) 406 })
409 .then(response => { 407 .then(response => {
410 this.examData = response.data.data; 408 this.examData = response.data.data;
411 this.showLoader = false; 409 this.showLoader = false;
412 this.loadingSearch = false; 410 this.loadingSearch = false;
413 }) 411 })
414 .catch(error => { 412 .catch(error => {
415 // console.log("err====>", err); 413 // console.log("err====>", err);
416 this.showLoader = false; 414 this.showLoader = false;
417 this.loadingSearch = false; 415 this.loadingSearch = false;
418 this.snackbar = true; 416 this.snackbar = true;
419 this.text = error.response.data.message; 417 this.text = error.response.data.message;
420 if (error.response.status === 401) { 418 if (error.response.status === 401) {
421 this.$router.replace({ path: "/" }); 419 this.$router.replace({ path: "/" });
422 this.$store.dispatch("setToken", null); 420 this.$store.dispatch("setToken", null);
423 this.$store.dispatch("Id", null); 421 this.$store.dispatch("Id", null);
424 } 422 }
425 }); 423 });
426 }, 424 },
427 editItem(item) { 425 editItem(item) {
428 this.editedIndex = this.examData.indexOf(item); 426 this.editedIndex = this.examData.indexOf(item);
429 this.editedItem = Object.assign({}, item); 427 this.editedItem = Object.assign({}, item);
430 this.editedItem.date = 428 this.editedItem.date =
431 this.editedItem.date != undefined 429 this.editedItem.date != undefined
432 ? (this.editedItem.date = this.editedItem.date.substring(0, 10)) 430 ? (this.editedItem.date = this.editedItem.date.substring(0, 10))
433 : (this.editedItem.date = ""); 431 : (this.editedItem.date = "");
434 this.editExamDialog = true; 432 this.editExamDialog = true;
435 }, 433 },
436 profile(item) { 434 profile(item) {
437 this.editedIndex = this.examData.indexOf(item); 435 this.editedIndex = this.examData.indexOf(item);
438 this.editedItem = Object.assign({}, item); 436 this.editedItem = Object.assign({}, item);
439 this.profileExamDialog = true; 437 this.profileExamDialog = true;
440 }, 438 },
441 deleteExam(item) { 439 deleteItem(item) {
442 let Exam = { 440 let Exam = {
443 examId: item._id 441 examId: item._id
444 }; 442 };
445 http() 443 http()
446 .delete( 444 .delete(
447 "/deleteExam", 445 "/deleteExam",
448 confirm("Are you sure you want to Delete this?") && { 446 confirm("Are you sure you want to Delete this?") && {
449 params: Exam 447 params: Exam
450 } 448 }
451 ) 449 )
452 .then(response => { 450 .then(response => {
453 this.snackbar = true; 451 this.snackbar = true;
454 this.text = "Successfully Delete Exam "; 452 this.text = "Successfully Delete Exam ";
455 this.getExamList(); 453 this.getExamList();
456 }) 454 })
457 .catch(error => { 455 .catch(error => {
458 // console.log(error); 456 this.snackbar = true;
457 this.text = error.response.data.message;
458 this.color = "error";
459 }); 459 });
460 }, 460 },
461 close() { 461 close() {
462 this.editExamDialog = false; 462 this.editExamDialog = false;
463 }, 463 },
464 submit() { 464 submit() {
465 if (this.$refs.form.validate()) { 465 if (this.$refs.form.validate()) {
466 this.loading = true; 466 this.loading = true;
467 http() 467 http()
468 .post("/createExam", this.addExam) 468 .post("/createExam", this.addExam)
469 .then(response => { 469 .then(response => {
470 this.snackbar = true; 470 this.snackbar = true;
471 this.text = response.data.message; 471 this.text = response.data.message;
472 this.color = "green"; 472 this.color = "green";
473 this.addExamDialog = false; 473 this.addExamDialog = false;
474 this.getExamList(); 474 this.getExamList();
475 this.color = "succses"; 475 this.color = "succses";
476 this.loading = false; 476 this.loading = false;
477 this.clear(); 477 this.clear();
478 }) 478 })
479 .catch(error => { 479 .catch(error => {
480 this.snackbar = true; 480 this.snackbar = true;
481 this.text = error.response.data.message; 481 this.text = error.response.data.message;
482 this.color = "red"; 482 this.color = "red";
483 this.loading = false; 483 this.loading = false;
484 }); 484 });
485 } 485 }
486 }, 486 },
487 clear() { 487 clear() {
488 this.$refs.form.reset(); 488 this.$refs.form.reset();
489 this.disable = false; 489 this.disable = false;
490 }, 490 },
491 save() { 491 save() {
492 this.editedItem.examId = this.editedItem._id; 492 this.editedItem.examId = this.editedItem._id;
493 http() 493 http()
494 .put("/updateExam", this.editedItem) 494 .put("/updateExam", this.editedItem)
495 .then(response => { 495 .then(response => {
496 this.snackbar = true; 496 this.snackbar = true;
497 this.text = response.data.message; 497 this.text = response.data.message;
498 this.color = "green"; 498 this.color = "green";
499 this.getExamList(); 499 this.getExamList();
500 this.close(); 500 this.close();
501 }) 501 })
502 .catch(error => { 502 .catch(error => {
503 this.snackbar = true; 503 this.snackbar = true;
504 this.text = error.response.data.message; 504 this.text = error.response.data.message;
505 this.color = "red"; 505 this.color = "red";
506 }); 506 });
507 }, 507 },
508 displaySearch() { 508 displaySearch() {
509 (this.show = false), (this.showSearch = true); 509 (this.show = false), (this.showSearch = true);
510 }, 510 },
511 closeSearch() { 511 closeSearch() {
512 this.showSearch = false; 512 this.showSearch = false;
513 this.show = true; 513 this.show = true;
514 this.search = ""; 514 this.search = "";
515 } 515 }
516 }, 516 },
517 mounted() { 517 mounted() {
518 this.token = this.$store.state.token; 518 this.token = this.$store.state.token;
519 this.getExamList(); 519 this.getExamList();
520 } 520 }
src/pages/Students/students.vue
Diff comments   View file @c8fc8e4
1 <template> 1 <template>
2 <v-container fluid class="body-color"> 2 <v-container fluid class="body-color">
3 <!-- ****** EDITS STUDENTS DETAILS ****** --> 3 <!-- ****** EDITS STUDENTS DETAILS ****** -->
4 <v-dialog v-model="editStudentDialog" max-width="1700px" scrollable> 4 <v-dialog v-model="editStudentDialog" max-width="1700px" scrollable>
5 <v-card flat class="card-style pa-2" dark> 5 <v-card flat class="card-style pa-2" dark>
6 <v-layout> 6 <v-layout>
7 <v-flex xs12> 7 <v-flex xs12>
8 <label class="title text-xs-center">Edit Student Details</label> 8 <label class="title text-xs-center">Edit Student Details</label>
9 <v-icon size="24" class="right" @click="editStudentDialog = false">cancel</v-icon> 9 <v-icon size="24" class="right" @click="editStudentDialog = false">cancel</v-icon>
10 </v-flex> 10 </v-flex>
11 </v-layout> 11 </v-layout>
12 <v-card-text> 12 <v-card-text>
13 <v-form ref="form"> 13 <v-form ref="form">
14 <v-container fluid> 14 <v-container fluid>
15 <v-layout> 15 <v-layout>
16 <v-flex xs12 class="text-xs-center text-sm-center text-md-center text-lg-center"> 16 <v-flex xs12 class="text-xs-center text-sm-center text-md-center text-lg-center">
17 <v-avatar size="100px" v-if="!editedItem.profilePicUrl && !editImageUrl"> 17 <v-avatar size="100px" v-if="!editedItem.profilePicUrl && !editImageUrl">
18 <img 18 <img
19 src="/static/icon/user.png" 19 src="/static/icon/user.png"
20 /> 20 />
21 </v-avatar> 21 </v-avatar>
22 <img 22 <img
23 :src="editedItem.profilePicUrl" 23 :src="editedItem.profilePicUrl"
24 v-else-if="editedItem.profilePicUrl && !editImageUrl" 24 v-else-if="editedItem.profilePicUrl && !editImageUrl"
25 height="150" 25 height="150"
26 style="border-radius:50%; width:150px" 26 style="border-radius:50%; width:150px"
27 /> 27 />
28 <img 28 <img
29 v-if="editImageUrl" 29 v-if="editImageUrl"
30 :src="editImageUrl" 30 :src="editImageUrl"
31 style="border-radius:50%; width:150px;height:150px" 31 style="border-radius:50%; width:150px;height:150px"
32 /> 32 />
33 <input 33 <input
34 type="file" 34 type="file"
35 style="display: none" 35 style="display: none"
36 ref="editDataImage" 36 ref="editDataImage"
37 accept="image/*" 37 accept="image/*"
38 @change="onEditFilePicked" 38 @change="onEditFilePicked"
39 /> 39 />
40 </v-flex> 40 </v-flex>
41 </v-layout> 41 </v-layout>
42 <v-layout wrap> 42 <v-layout wrap>
43 <v-flex xs12 sm4> 43 <v-flex xs12 sm4>
44 <v-layout> 44 <v-layout>
45 <v-flex xs4 class="pt-4 subheading"> 45 <v-flex xs4 class="pt-4 subheading">
46 <label class="right hidden-xs-only hidden-sm-only">Select Class:</label> 46 <label class="right hidden-xs-only hidden-sm-only">Select Class:</label>
47 <label class="right hidden-lg-only hidden-md-only hidden-xl-only">Class:</label> 47 <label class="right hidden-lg-only hidden-md-only hidden-xl-only">Class:</label>
48 </v-flex> 48 </v-flex>
49 <v-flex xs8 class="ml-3"> 49 <v-flex xs8 class="ml-3">
50 <v-select 50 <v-select
51 :items="addclass" 51 :items="addclass"
52 label="Select Class" 52 label="Select Class"
53 v-model="editedItem.select" 53 v-model="editedItem.select"
54 item-text="classNum" 54 item-text="classNum"
55 item-value="_id" 55 item-value="_id"
56 name="Select Class" 56 name="Select Class"
57 @change="getSections(editedItem.select)" 57 @change="getSections(editedItem.select)"
58 required 58 required
59 ></v-select> 59 ></v-select>
60 </v-flex> 60 </v-flex>
61 </v-layout> 61 </v-layout>
62 </v-flex> 62 </v-flex>
63 <v-flex xs12 sm4> 63 <v-flex xs12 sm4>
64 <v-layout> 64 <v-layout>
65 <v-flex xs4 class="pt-4 subheading"> 65 <v-flex xs4 class="pt-4 subheading">
66 <label class="right hidden-xs-only hidden-sm-only">Select Section:</label> 66 <label class="right hidden-xs-only hidden-sm-only">Select Section:</label>
67 <label class="right hidden-lg-only hidden-md-only hidden-xl-only">Section:</label> 67 <label class="right hidden-lg-only hidden-md-only hidden-xl-only">Section:</label>
68 </v-flex> 68 </v-flex>
69 <v-flex xs8 class="ml-3"> 69 <v-flex xs8 class="ml-3">
70 <v-select 70 <v-select
71 :items="addSection" 71 :items="addSection"
72 label="Select Section" 72 label="Select Section"
73 v-model="editedItem.selectSection" 73 v-model="editedItem.selectSection"
74 item-text="name" 74 item-text="name"
75 item-value="_id" 75 item-value="_id"
76 name="Select Section" 76 name="Select Section"
77 required 77 required
78 ></v-select> 78 ></v-select>
79 </v-flex> 79 </v-flex>
80 </v-layout> 80 </v-layout>
81 </v-flex> 81 </v-flex>
82 <v-flex xs12 sm4> 82 <v-flex xs12 sm4>
83 <v-layout> 83 <v-layout>
84 <v-flex xs4 class="pt-4 subheading"> 84 <v-flex xs4 class="pt-4 subheading">
85 <label class="right hidden-xs-only hidden-sm-only">Full Name:</label> 85 <label class="right hidden-xs-only hidden-sm-only">Full Name:</label>
86 <label class="right hidden-lg-only hidden-md-only hidden-xl-only">Name:</label> 86 <label class="right hidden-lg-only hidden-md-only hidden-xl-only">Name:</label>
87 </v-flex> 87 </v-flex>
88 <v-flex xs8 class="ml-3"> 88 <v-flex xs8 class="ml-3">
89 <v-text-field 89 <v-text-field
90 v-model="editedItem.name" 90 v-model="editedItem.name"
91 placeholder="fill your full Name" 91 placeholder="fill your full Name"
92 name="name" 92 name="name"
93 type="text" 93 type="text"
94 required 94 required
95 ></v-text-field> 95 ></v-text-field>
96 </v-flex> 96 </v-flex>
97 </v-layout> 97 </v-layout>
98 </v-flex> 98 </v-flex>
99 </v-layout> 99 </v-layout>
100 <v-layout wrap> 100 <v-layout wrap>
101 <v-flex xs12 sm4> 101 <v-flex xs12 sm4>
102 <v-layout> 102 <v-layout>
103 <v-flex xs4 class="pt-4 subheading"> 103 <v-flex xs4 class="pt-4 subheading">
104 <label class="right hidden-xs-only hidden-sm-only">Email Id:</label> 104 <label class="right hidden-xs-only hidden-sm-only">Email Id:</label>
105 <label class="right hidden-lg-only hidden-md-only hidden-xl-only">Email:</label> 105 <label class="right hidden-lg-only hidden-md-only hidden-xl-only">Email:</label>
106 </v-flex> 106 </v-flex>
107 <v-flex xs8 class="ml-3"> 107 <v-flex xs8 class="ml-3">
108 <v-text-field 108 <v-text-field
109 placeholder="fill your email" 109 placeholder="fill your email"
110 v-model="editedItem.email" 110 v-model="editedItem.email"
111 type="text" 111 type="text"
112 name="email" 112 name="email"
113 required 113 required
114 ></v-text-field> 114 ></v-text-field>
115 </v-flex> 115 </v-flex>
116 </v-layout> 116 </v-layout>
117 </v-flex> 117 </v-flex>
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 hidden-sm-only hidden-xs-only">Date of Birth:</label> 121 <label class="right hidden-sm-only hidden-xs-only">Date of Birth:</label>
122 <label class="right hidden-lg-only hidden-xl-only hidden-md-only">D.O.B:</label> 122 <label class="right hidden-lg-only hidden-xl-only hidden-md-only">D.O.B:</label>
123 </v-flex> 123 </v-flex>
124 <v-flex xs8 class="ml-3"> 124 <v-flex xs8 class="ml-3">
125 <v-menu 125 <v-menu
126 ref="menu" 126 ref="menu"
127 :close-on-content-click="false" 127 :close-on-content-click="false"
128 v-model="menu1" 128 v-model="menu1"
129 :nudge-right="40" 129 :nudge-right="40"
130 lazy 130 lazy
131 transition="scale-transition" 131 transition="scale-transition"
132 offset-y 132 offset-y
133 full-width 133 full-width
134 min-width="290px" 134 min-width="290px"
135 > 135 >
136 <v-text-field 136 <v-text-field
137 slot="activator" 137 slot="activator"
138 v-model="editedItem.dob" 138 v-model="editedItem.dob"
139 placeholder="Select Dob" 139 placeholder="Select Dob"
140 ></v-text-field> 140 ></v-text-field>
141 <v-date-picker 141 <v-date-picker
142 ref="picker" 142 ref="picker"
143 v-model="editedItem.dob" 143 v-model="editedItem.dob"
144 :max="new Date().toISOString().substr(0, 10)" 144 :max="new Date().toISOString().substr(0, 10)"
145 min="1950-01-01" 145 min="1950-01-01"
146 @input="menu1 = false" 146 @input="menu1 = false"
147 ></v-date-picker> 147 ></v-date-picker>
148 </v-menu> 148 </v-menu>
149 </v-flex> 149 </v-flex>
150 </v-layout> 150 </v-layout>
151 </v-flex> 151 </v-flex>
152 <v-flex xs12 sm4> 152 <v-flex xs12 sm4>
153 <v-layout> 153 <v-layout>
154 <v-flex xs4 class="pt-4 subheading"> 154 <v-flex xs4 class="pt-4 subheading">
155 <label class="right">City:</label> 155 <label class="right">City:</label>
156 </v-flex> 156 </v-flex>
157 <v-flex xs8 class="ml-3"> 157 <v-flex xs8 class="ml-3">
158 <v-text-field 158 <v-text-field
159 v-model="editedItem.city" 159 v-model="editedItem.city"
160 placeholder="fill your City Name" 160 placeholder="fill your City Name"
161 name="City" 161 name="City"
162 type="text" 162 type="text"
163 required 163 required
164 ></v-text-field> 164 ></v-text-field>
165 </v-flex> 165 </v-flex>
166 </v-layout> 166 </v-layout>
167 </v-flex> 167 </v-flex>
168 </v-layout> 168 </v-layout>
169 <v-layout wrap> 169 <v-layout wrap>
170 <v-flex xs12 sm4> 170 <v-flex xs12 sm4>
171 <v-layout> 171 <v-layout>
172 <v-flex xs4 class="pt-4 subheading"> 172 <v-flex xs4 class="pt-4 subheading">
173 <label class="right hidden-xs-only hidden-sm-only">Blood Group:</label> 173 <label class="right hidden-xs-only hidden-sm-only">Blood Group:</label>
174 <label class="right hidden-lg-only hidden-md-only hidden-xl-only">Blood:</label> 174 <label class="right hidden-lg-only hidden-md-only hidden-xl-only">Blood:</label>
175 </v-flex> 175 </v-flex>
176 <v-flex xs8 class="ml-3"> 176 <v-flex xs8 class="ml-3">
177 <v-text-field 177 <v-text-field
178 v-model="editedItem.bloodGroup" 178 v-model="editedItem.bloodGroup"
179 placeholder="fill your BloodGroup" 179 placeholder="fill your BloodGroup"
180 name="state" 180 name="state"
181 type="text" 181 type="text"
182 required 182 required
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 sm4> 187 <v-flex xs12 sm4>
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">Gender:</label> 190 <label class="right">Gender:</label>
191 </v-flex> 191 </v-flex>
192 <v-flex xs8 class="ml-3"> 192 <v-flex xs8 class="ml-3">
193 <v-select 193 <v-select
194 :items="gender" 194 :items="gender"
195 v-model="editedItem.gender" 195 v-model="editedItem.gender"
196 placeholder="Select Gender" 196 placeholder="Select Gender"
197 required 197 required
198 ></v-select> 198 ></v-select>
199 </v-flex> 199 </v-flex>
200 </v-layout> 200 </v-layout>
201 </v-flex> 201 </v-flex>
202 <v-flex xs12 sm4> 202 <v-flex xs12 sm4>
203 <v-layout> 203 <v-layout>
204 <v-flex xs4 class="pt-4 subheading"> 204 <v-flex xs4 class="pt-4 subheading">
205 <label class="right">Medical Notes:</label> 205 <label class="right">Medical Notes:</label>
206 </v-flex> 206 </v-flex>
207 <v-flex xs8 class="ml-3"> 207 <v-flex xs8 class="ml-3">
208 <v-text-field 208 <v-text-field
209 v-model="editedItem.medicalNotes" 209 v-model="editedItem.medicalNotes"
210 placeholder="fill your medicalNotes" 210 placeholder="fill your medicalNotes"
211 required 211 required
212 ></v-text-field> 212 ></v-text-field>
213 </v-flex> 213 </v-flex>
214 </v-layout> 214 </v-layout>
215 </v-flex> 215 </v-flex>
216 </v-layout> 216 </v-layout>
217 <v-layout wrap> 217 <v-layout wrap>
218 <v-flex xs12 sm4> 218 <v-flex xs12 sm4>
219 <v-layout> 219 <v-layout>
220 <v-flex xs4 class="pt-4 subheading"> 220 <v-flex xs4 class="pt-4 subheading">
221 <label class="right">Height:</label> 221 <label class="right">Height:</label>
222 </v-flex> 222 </v-flex>
223 <v-flex xs8 class="ml-3"> 223 <v-flex xs8 class="ml-3">
224 <v-text-field 224 <v-text-field
225 v-model="editedItem.height" 225 v-model="editedItem.height"
226 placeholder="fill your Height" 226 placeholder="fill your Height"
227 name="state" 227 name="state"
228 type="text" 228 type="text"
229 required 229 required
230 ></v-text-field> 230 ></v-text-field>
231 </v-flex> 231 </v-flex>
232 </v-layout> 232 </v-layout>
233 </v-flex> 233 </v-flex>
234 <v-flex xs12 sm4> 234 <v-flex xs12 sm4>
235 <v-layout> 235 <v-layout>
236 <v-flex xs4 class="pt-4 subheading"> 236 <v-flex xs4 class="pt-4 subheading">
237 <label class="right">Weight:</label> 237 <label class="right">Weight:</label>
238 </v-flex> 238 </v-flex>
239 <v-flex xs8 class="ml-3"> 239 <v-flex xs8 class="ml-3">
240 <v-text-field 240 <v-text-field
241 v-model="editedItem.weight" 241 v-model="editedItem.weight"
242 placeholder="fill your Weight" 242 placeholder="fill your Weight"
243 name="pincode" 243 name="pincode"
244 required 244 required
245 ></v-text-field> 245 ></v-text-field>
246 </v-flex> 246 </v-flex>
247 </v-layout> 247 </v-layout>
248 </v-flex> 248 </v-flex>
249 <v-flex xs12 sm4> 249 <v-flex xs12 sm4>
250 <v-layout> 250 <v-layout>
251 <v-flex xs4 class="pt-4 subheading"> 251 <v-flex xs4 class="pt-4 subheading">
252 <label class="right hidden-xs-only hidden-sm-only">Uplaod Image:</label> 252 <label class="right hidden-xs-only hidden-sm-only">Uplaod Image:</label>
253 <label class="right hidden-lg-only hidden-md-only hidden-xl-only">Uplaod:</label> 253 <label class="right hidden-lg-only hidden-md-only hidden-xl-only">Uplaod:</label>
254 </v-flex> 254 </v-flex>
255 <v-flex xs8 class="ml-3"> 255 <v-flex xs8 class="ml-3">
256 <v-text-field 256 <v-text-field
257 label="Select Image" 257 label="Select Image"
258 @click="pickEditFile" 258 @click="pickEditFile"
259 v-model="editImageName" 259 v-model="editImageName"
260 append-icon="attach_file" 260 append-icon="attach_file"
261 ></v-text-field> 261 ></v-text-field>
262 </v-flex> 262 </v-flex>
263 </v-layout> 263 </v-layout>
264 </v-flex> 264 </v-flex>
265 </v-layout> 265 </v-layout>
266 <v-layout wrap> 266 <v-layout wrap>
267 <v-flex xs12 sm4> 267 <v-flex xs12 sm4>
268 <v-layout> 268 <v-layout>
269 <v-flex xs4 class="pt-4 subheading"> 269 <v-flex xs4 class="pt-4 subheading">
270 <label class="right">State:</label> 270 <label class="right">State:</label>
271 </v-flex> 271 </v-flex>
272 <v-flex xs8 class="ml-3"> 272 <v-flex xs8 class="ml-3">
273 <v-text-field 273 <v-text-field
274 v-model="editedItem.state" 274 v-model="editedItem.state"
275 placeholder="fill your State Name" 275 placeholder="fill your State Name"
276 name="state" 276 name="state"
277 type="text" 277 type="text"
278 required 278 required
279 ></v-text-field> 279 ></v-text-field>
280 </v-flex> 280 </v-flex>
281 </v-layout> 281 </v-layout>
282 </v-flex> 282 </v-flex>
283 <v-flex xs12 sm4> 283 <v-flex xs12 sm4>
284 <v-layout> 284 <v-layout>
285 <v-flex xs4 class="pt-4 subheading"> 285 <v-flex xs4 class="pt-4 subheading">
286 <label class="right">Pincode:</label> 286 <label class="right">Pincode:</label>
287 </v-flex> 287 </v-flex>
288 <v-flex xs8 class="ml-3"> 288 <v-flex xs8 class="ml-3">
289 <v-text-field 289 <v-text-field
290 v-model="editedItem.pincode" 290 v-model="editedItem.pincode"
291 placeholder="fill your pincode" 291 placeholder="fill your pincode"
292 name="pincode" 292 name="pincode"
293 type="number" 293 type="number"
294 required 294 required
295 ></v-text-field> 295 ></v-text-field>
296 </v-flex> 296 </v-flex>
297 </v-layout> 297 </v-layout>
298 </v-flex> 298 </v-flex>
299 <v-flex xs12 sm4> 299 <v-flex xs12 sm4>
300 <v-layout> 300 <v-layout>
301 <v-flex xs4 class="pt-4 subheading"> 301 <v-flex xs4 class="pt-4 subheading">
302 <label class="right hidden-xs-only hidden-sm-only">Mobile No:</label> 302 <label class="right hidden-xs-only hidden-sm-only">Mobile No:</label>
303 <label class="right hidden-lg-only hidden-md-only hidden-xl-only">Mobile:</label> 303 <label class="right hidden-lg-only hidden-md-only hidden-xl-only">Mobile:</label>
304 </v-flex> 304 </v-flex>
305 <v-flex xs8 class="ml-3"> 305 <v-flex xs8 class="ml-3">
306 <v-text-field 306 <v-text-field
307 v-model="editedItem.mobile" 307 v-model="editedItem.mobile"
308 placeholder="fill your MobileNo" 308 placeholder="fill your MobileNo"
309 name="mobileNo" 309 name="mobileNo"
310 type="number" 310 type="number"
311 required 311 required
312 ></v-text-field> 312 ></v-text-field>
313 </v-flex> 313 </v-flex>
314 </v-layout> 314 </v-layout>
315 </v-flex> 315 </v-flex>
316 </v-layout> 316 </v-layout>
317 <v-layout wrap> 317 <v-layout wrap>
318 <v-flex xs12 sm4> 318 <v-flex xs12 sm4>
319 <v-layout> 319 <v-layout>
320 <v-flex xs4 class="pt-4 subheading"> 320 <v-flex xs4 class="pt-4 subheading">
321 <label class="right hidden-xs-only hidden-sm-only">Select Country:</label> 321 <label class="right hidden-xs-only hidden-sm-only">Select Country:</label>
322 <label class="right hidden-lg-only hidden-md-only hidden-xl-only">Country:</label> 322 <label class="right hidden-lg-only hidden-md-only hidden-xl-only">Country:</label>
323 </v-flex> 323 </v-flex>
324 <v-flex xs8 class="ml-3"> 324 <v-flex xs8 class="ml-3">
325 <v-autocomplete 325 <v-autocomplete
326 v-model="editedItem.country" 326 v-model="editedItem.country"
327 :items="countries" 327 :items="countries"
328 placeholder="Select Country Name" 328 placeholder="Select Country Name"
329 required 329 required
330 ></v-autocomplete> 330 ></v-autocomplete>
331 </v-flex> 331 </v-flex>
332 </v-layout> 332 </v-layout>
333 </v-flex> 333 </v-flex>
334 <v-flex xs12 sm4 class="hidden-xs-only hidden-sm-only"> 334 <v-flex xs12 sm4 class="hidden-xs-only hidden-sm-only">
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 hidden-xs-only hidden-sm-only">Roll Number:</label> 337 <label class="right hidden-xs-only hidden-sm-only">Roll Number:</label>
338 <label class="right hidden-lg-only hidden-md-only hidden-xl-only">Roll No:</label> 338 <label class="right hidden-lg-only hidden-md-only hidden-xl-only">Roll No:</label>
339 </v-flex> 339 </v-flex>
340 <v-flex xs8 class="ml-3"> 340 <v-flex xs8 class="ml-3">
341 <v-text-field 341 <v-text-field
342 v-model="editedItem.rollNo" 342 v-model="editedItem.rollNo"
343 placeholder="fill roll number" 343 placeholder="fill roll number"
344 required 344 required
345 ></v-text-field> 345 ></v-text-field>
346 </v-flex> 346 </v-flex>
347 </v-layout> 347 </v-layout>
348 </v-flex> 348 </v-flex>
349 <v-flex xs12 sm4 class="hidden-xs-only hidden-sm-only"> 349 <v-flex xs12 sm4 class="hidden-xs-only hidden-sm-only">
350 <v-layout> 350 <v-layout>
351 <v-flex xs4 sm4 class="pt-4 subheading"> 351 <v-flex xs4 sm4 class="pt-4 subheading">
352 <label class="right hidden-xs-only hidden-sm-only">Permanent Address:</label> 352 <label class="right hidden-xs-only hidden-sm-only">Permanent Address:</label>
353 <label 353 <label
354 class="right hidden-lg-only hidden-md-only hidden-xl-only" 354 class="right hidden-lg-only hidden-md-only hidden-xl-only"
355 >Permanent Address:</label> 355 >Permanent Address:</label>
356 </v-flex> 356 </v-flex>
357 <v-flex xs12 sm8 class="ml-3"> 357 <v-flex xs12 sm8 class="ml-3">
358 <v-text-field 358 <v-text-field
359 v-model="editedItem.permanentAddress" 359 v-model="editedItem.permanentAddress"
360 placeholder="fill Your Permanent Address" 360 placeholder="fill Your Permanent Address"
361 required 361 required
362 ></v-text-field> 362 ></v-text-field>
363 </v-flex> 363 </v-flex>
364 </v-layout> 364 </v-layout>
365 </v-flex> 365 </v-flex>
366 </v-layout> 366 </v-layout>
367 <v-layout class="hidden-xs-only hidden-sm-only" > 367 <v-layout class="hidden-xs-only hidden-sm-only" >
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 hidden-xs-only hidden-sm-only">Present Address:</label> 371 <label class="right hidden-xs-only hidden-sm-only">Present Address:</label>
372 <label 372 <label
373 class="right hidden-lg-only hidden-md-only hidden-xl-only" 373 class="right hidden-lg-only hidden-md-only hidden-xl-only"
374 >Present Address:</label> 374 >Present Address:</label>
375 </v-flex> 375 </v-flex>
376 <v-flex xs8 class="ml-3"> 376 <v-flex xs8 class="ml-3">
377 <v-text-field 377 <v-text-field
378 v-model="editedItem.presentAddress" 378 v-model="editedItem.presentAddress"
379 placeholder="Select Country Name" 379 placeholder="Select Country Name"
380 required 380 required
381 ></v-text-field> 381 ></v-text-field>
382 </v-flex> 382 </v-flex>
383 </v-layout> 383 </v-layout>
384 </v-flex> 384 </v-flex>
385 </v-layout> 385 </v-layout>
386 <v-layout class="hidden-lg-only hidden-md-only hidden-xl-only" wrap> 386 <v-layout class="hidden-lg-only hidden-md-only hidden-xl-only" wrap>
387 <v-flex xs12 sm12> 387 <v-flex xs12 sm12>
388 <v-layout> 388 <v-layout>
389 <v-flex xs4 class="pt-4 subheading"> 389 <v-flex xs4 class="pt-4 subheading">
390 <label class="right hidden-xs-only hidden-sm-only">Roll Number:</label> 390 <label class="right hidden-xs-only hidden-sm-only">Roll Number:</label>
391 <label class="right hidden-lg-only hidden-md-only hidden-xl-only">Roll No:</label> 391 <label class="right hidden-lg-only hidden-md-only hidden-xl-only">Roll No:</label>
392 </v-flex> 392 </v-flex>
393 <v-flex xs8 class="ml-3"> 393 <v-flex xs8 class="ml-3">
394 <v-text-field 394 <v-text-field
395 v-model="editedItem.rollNo" 395 v-model="editedItem.rollNo"
396 placeholder="fill roll number" 396 placeholder="fill roll number"
397 required 397 required
398 ></v-text-field> 398 ></v-text-field>
399 </v-flex> 399 </v-flex>
400 </v-layout> 400 </v-layout>
401 </v-flex> 401 </v-flex>
402 </v-layout> 402 </v-layout>
403 <v-layout class="hidden-lg-only hidden-md-only hidden-xl-only" wrap> 403 <v-layout class="hidden-lg-only hidden-md-only hidden-xl-only" wrap>
404 <v-flex xs12 sm12> 404 <v-flex xs12 sm12>
405 <v-layout> 405 <v-layout>
406 <v-flex xs12 sm3 class="pt-4 subheading text-xs-center"> 406 <v-flex xs12 sm3 class="pt-4 subheading text-xs-center">
407 <label class>Present Address :</label> 407 <label class>Present Address :</label>
408 </v-flex> 408 </v-flex>
409 </v-layout> 409 </v-layout>
410 <v-layout> 410 <v-layout>
411 <v-flex xs12 sm12> 411 <v-flex xs12 sm12>
412 <v-textarea 412 <v-textarea
413 v-model="editedItem.presentAddress" 413 v-model="editedItem.presentAddress"
414 placeholder="fill Your present Address" 414 placeholder="fill Your present Address"
415 required 415 required
416 ></v-textarea> 416 ></v-textarea>
417 </v-flex> 417 </v-flex>
418 </v-layout> 418 </v-layout>
419 </v-flex> 419 </v-flex>
420 <v-flex xs12 sm12> 420 <v-flex xs12 sm12>
421 <v-layout> 421 <v-layout>
422 <v-flex xs12 sm3 class="pt-4 pr-4 subheading text-xs-center addressForm"> 422 <v-flex xs12 sm3 class="pt-4 pr-4 subheading text-xs-center addressForm">
423 <label>Permanent addr:</label> 423 <label>Permanent addr:</label>
424 </v-flex> 424 </v-flex>
425 </v-layout> 425 </v-layout>
426 <v-layout> 426 <v-layout>
427 <v-flex xs12 sm12> 427 <v-flex xs12 sm12>
428 <v-textarea 428 <v-textarea
429 name="input-4-3" 429 name="input-4-3"
430 v-model="editedItem.permanentAddress" 430 v-model="editedItem.permanentAddress"
431 placeholder="fill Your Permanent Address" 431 placeholder="fill Your Permanent Address"
432 required 432 required
433 ></v-textarea> 433 ></v-textarea>
434 </v-flex> 434 </v-flex>
435 </v-layout> 435 </v-layout>
436 </v-flex> 436 </v-flex>
437 </v-layout> 437 </v-layout>
438 <v-layout> 438 <v-layout>
439 <v-flex xs12 sm12> 439 <v-flex xs12 sm12>
440 <v-layout class="right"> 440 <v-layout class="right">
441 <v-btn @click="save" round dark :loading="editLoading" class="add-button">Save</v-btn> 441 <v-btn @click="save" round dark :loading="editLoading" class="add-button">Save</v-btn>
442 </v-layout> 442 </v-layout>
443 </v-flex> 443 </v-flex>
444 </v-layout> 444 </v-layout>
445 </v-container> 445 </v-container>
446 </v-form> 446 </v-form>
447 </v-card-text> 447 </v-card-text>
448 </v-card> 448 </v-card>
449 </v-dialog> 449 </v-dialog>
450 450
451 <!-- ****** PROFILE VIEW STUDENTS DEATILS ****** --> 451 <!-- ****** PROFILE VIEW STUDENTS DEATILS ****** -->
452 452
453 <v-dialog v-model="profileStudentDialog" max-width="1000px" scrollable> 453 <v-dialog v-model="profileStudentDialog" max-width="1000px" scrollable>
454 <v-card flat class="card-style pa-3" dark> 454 <v-card flat class="card-style pa-3" dark>
455 <v-layout> 455 <v-layout>
456 <v-flex xs12> 456 <v-flex xs12>
457 <label class="title text-xs-center">View Student Details</label> 457 <label class="title text-xs-center">View Student Details</label>
458 <v-icon size="24" class="right" @click="profileStudentDialog = false">cancel</v-icon> 458 <v-icon size="24" class="right" @click="profileStudentDialog = false">cancel</v-icon>
459 </v-flex> 459 </v-flex>
460 </v-layout> 460 </v-layout>
461 <v-card-text> 461 <v-card-text>
462 <v-flex align-center justify-center layout text-xs-center class="mt-3"> 462 <v-flex align-center justify-center layout text-xs-center class="mt-3">
463 <v-avatar size="100px"> 463 <v-avatar size="100px">
464 <img src="/static/icon/user.png" v-if="!editedItem.profilePicUrl" /> 464 <img src="/static/icon/user.png" v-if="!editedItem.profilePicUrl" />
465 <img :src="editedItem.profilePicUrl" v-else-if="editedItem.profilePicUrl" /> 465 <img :src="editedItem.profilePicUrl" v-else-if="editedItem.profilePicUrl" />
466 </v-avatar> 466 </v-avatar>
467 </v-flex> 467 </v-flex>
468 <v-container grid-list-md> 468 <v-container grid-list-md>
469 <v-layout wrap> 469 <v-layout wrap>
470 <v-flex xs12 sm5> 470 <v-flex xs12 sm5>
471 <v-layout> 471 <v-layout>
472 <v-flex xs6 sm6> 472 <v-flex xs6 sm6>
473 <h5 class="right my-1"> 473 <h5 class="right my-1">
474 <b>Full Name:</b> 474 <b>Full Name:</b>
475 </h5> 475 </h5>
476 </v-flex> 476 </v-flex>
477 <v-flex sm6 xs6> 477 <v-flex sm6 xs6>
478 <h5 class="my-1 left">{{ editedItem.name }}</h5> 478 <h5 class="my-1 left">{{ editedItem.name }}</h5>
479 </v-flex> 479 </v-flex>
480 </v-layout> 480 </v-layout>
481 </v-flex> 481 </v-flex>
482 <v-flex xs12 sm7> 482 <v-flex xs12 sm7>
483 <v-layout> 483 <v-layout>
484 <v-flex xs6 sm4> 484 <v-flex xs6 sm4>
485 <h5 class="right my-1"> 485 <h5 class="right my-1">
486 <b>Email:</b> 486 <b>Email:</b>
487 </h5> 487 </h5>
488 </v-flex> 488 </v-flex>
489 <v-flex sm8 xs6> 489 <v-flex sm8 xs6>
490 <h5 class="my-1 left">{{ editedItem.email }}</h5> 490 <h5 class="my-1 left">{{ editedItem.email }}</h5>
491 </v-flex> 491 </v-flex>
492 </v-layout> 492 </v-layout>
493 </v-flex> 493 </v-flex>
494 </v-layout> 494 </v-layout>
495 <v-layout wrap> 495 <v-layout wrap>
496 <v-flex xs12 sm5> 496 <v-flex xs12 sm5>
497 <v-layout> 497 <v-layout>
498 <v-flex xs6 sm6> 498 <v-flex xs6 sm6>
499 <b> 499 <b>
500 <h5 class="right my-1"> 500 <h5 class="right my-1">
501 <b>Gender:</b> 501 <b>Gender:</b>
502 </h5> 502 </h5>
503 </b> 503 </b>
504 </v-flex> 504 </v-flex>
505 <v-flex sm6 xs6> 505 <v-flex sm6 xs6>
506 <h5 class="my-1 left">{{ editedItem.gender }}</h5> 506 <h5 class="my-1 left">{{ editedItem.gender }}</h5>
507 </v-flex> 507 </v-flex>
508 </v-layout> 508 </v-layout>
509 </v-flex> 509 </v-flex>
510 <v-flex xs12 sm7> 510 <v-flex xs12 sm7>
511 <v-layout> 511 <v-layout>
512 <v-flex xs6 sm4> 512 <v-flex xs6 sm4>
513 <b> 513 <b>
514 <h5 class="right my-1"> 514 <h5 class="right my-1">
515 <b>D.O.B:</b> 515 <b>D.O.B:</b>
516 </h5> 516 </h5>
517 </b> 517 </b>
518 </v-flex> 518 </v-flex>
519 <v-flex sm8 xs6> 519 <v-flex sm8 xs6>
520 <h5 class="my-1">{{ dates(editedItem.dob) }}</h5> 520 <h5 class="my-1">{{ editedItem.dob }}</h5>
521 </v-flex> 521 </v-flex>
522 </v-layout> 522 </v-layout>
523 </v-flex> 523 </v-flex>
524 </v-layout> 524 </v-layout>
525 <v-layout wrap> 525 <v-layout wrap>
526 <v-flex xs12 sm5> 526 <v-flex xs12 sm5>
527 <v-layout> 527 <v-layout>
528 <v-flex xs6 sm6> 528 <v-flex xs6 sm6>
529 <b> 529 <b>
530 <h5 class="right my-1"> 530 <h5 class="right my-1">
531 <b>BloodGroup:</b> 531 <b>BloodGroup:</b>
532 </h5> 532 </h5>
533 </b> 533 </b>
534 </v-flex> 534 </v-flex>
535 <v-flex sm6 xs6> 535 <v-flex sm6 xs6>
536 <h5 class="my-1 left">{{ editedItem.bloodGroup }}</h5> 536 <h5 class="my-1 left">{{ editedItem.bloodGroup }}</h5>
537 </v-flex> 537 </v-flex>
538 </v-layout> 538 </v-layout>
539 </v-flex> 539 </v-flex>
540 <v-flex xs12 sm7> 540 <v-flex xs12 sm7>
541 <v-layout> 541 <v-layout>
542 <v-flex xs6 sm4> 542 <v-flex xs6 sm4>
543 <b> 543 <b>
544 <h5 class="right my-1"> 544 <h5 class="right my-1">
545 <b>Roll No. :</b> 545 <b>Roll No. :</b>
546 </h5> 546 </h5>
547 </b> 547 </b>
548 </v-flex> 548 </v-flex>
549 <v-flex sm8 xs6> 549 <v-flex sm8 xs6>
550 <h5 class="my-1">{{ editedItem.rollNo }}</h5> 550 <h5 class="my-1">{{ editedItem.rollNo }}</h5>
551 </v-flex> 551 </v-flex>
552 </v-layout> 552 </v-layout>
553 </v-flex> 553 </v-flex>
554 </v-layout> 554 </v-layout>
555 <v-layout wrap> 555 <v-layout wrap>
556 <v-flex xs12 sm5> 556 <v-flex xs12 sm5>
557 <v-layout> 557 <v-layout>
558 <v-flex xs6 sm6> 558 <v-flex xs6 sm6>
559 <b> 559 <b>
560 <h5 class="right my-1"> 560 <h5 class="right my-1">
561 <b>Height:</b> 561 <b>Height:</b>
562 </h5> 562 </h5>
563 </b> 563 </b>
564 </v-flex> 564 </v-flex>
565 <v-flex sm6 xs6> 565 <v-flex sm6 xs6>
566 <h5 class="my-1 left">{{ editedItem.height }}</h5> 566 <h5 class="my-1 left">{{ editedItem.height }}</h5>
567 </v-flex> 567 </v-flex>
568 </v-layout> 568 </v-layout>
569 </v-flex> 569 </v-flex>
570 <v-flex xs12 sm7> 570 <v-flex xs12 sm7>
571 <v-layout> 571 <v-layout>
572 <v-flex xs6 sm4> 572 <v-flex xs6 sm4>
573 <b> 573 <b>
574 <h5 class="right my-1"> 574 <h5 class="right my-1">
575 <b>Weight:</b> 575 <b>Weight:</b>
576 </h5> 576 </h5>
577 </b> 577 </b>
578 </v-flex> 578 </v-flex>
579 <v-flex sm8 xs6> 579 <v-flex sm8 xs6>
580 <h5 class="my-1">{{ editedItem.weight }}</h5> 580 <h5 class="my-1">{{ editedItem.weight }}</h5>
581 </v-flex> 581 </v-flex>
582 </v-layout> 582 </v-layout>
583 </v-flex> 583 </v-flex>
584 </v-layout> 584 </v-layout>
585 <v-layout wrap> 585 <v-layout wrap>
586 <v-flex xs12 sm5> 586 <v-flex xs12 sm5>
587 <v-layout> 587 <v-layout>
588 <v-flex xs6 sm6> 588 <v-flex xs6 sm6>
589 <b> 589 <b>
590 <h5 class="right my-1"> 590 <h5 class="right my-1">
591 <b>City:</b> 591 <b>City:</b>
592 </h5> 592 </h5>
593 </b> 593 </b>
594 </v-flex> 594 </v-flex>
595 <v-flex sm6 xs6> 595 <v-flex sm6 xs6>
596 <h5 class="my-1 left">{{ editedItem.city }}</h5> 596 <h5 class="my-1 left">{{ editedItem.city }}</h5>
597 </v-flex> 597 </v-flex>
598 </v-layout> 598 </v-layout>
599 </v-flex> 599 </v-flex>
600 <v-flex xs12 sm7> 600 <v-flex xs12 sm7>
601 <v-layout> 601 <v-layout>
602 <v-flex xs6 sm4> 602 <v-flex xs6 sm4>
603 <b> 603 <b>
604 <h5 class="right my-1"> 604 <h5 class="right my-1">
605 <b>State:</b> 605 <b>State:</b>
606 </h5> 606 </h5>
607 </b> 607 </b>
608 </v-flex> 608 </v-flex>
609 <v-flex sm8 xs6> 609 <v-flex sm8 xs6>
610 <h5 class="my-1">{{ editedItem.state }}</h5> 610 <h5 class="my-1">{{ editedItem.state }}</h5>
611 </v-flex> 611 </v-flex>
612 </v-layout> 612 </v-layout>
613 </v-flex> 613 </v-flex>
614 </v-layout> 614 </v-layout>
615 <v-layout wrap> 615 <v-layout wrap>
616 <v-flex xs12 sm5> 616 <v-flex xs12 sm5>
617 <v-layout> 617 <v-layout>
618 <v-flex xs6 sm6> 618 <v-flex xs6 sm6>
619 <b> 619 <b>
620 <h5 class="right my-1"> 620 <h5 class="right my-1">
621 <b>Pincode:</b> 621 <b>Pincode:</b>
622 </h5> 622 </h5>
623 </b> 623 </b>
624 </v-flex> 624 </v-flex>
625 <v-flex sm6 xs6> 625 <v-flex sm6 xs6>
626 <h5 class="my-1">{{ editedItem.pincode }}</h5> 626 <h5 class="my-1">{{ editedItem.pincode }}</h5>
627 </v-flex> 627 </v-flex>
628 </v-layout> 628 </v-layout>
629 </v-flex> 629 </v-flex>
630 <v-flex xs12 sm7> 630 <v-flex xs12 sm7>
631 <v-layout> 631 <v-layout>
632 <v-flex xs6 sm4> 632 <v-flex xs6 sm4>
633 <b> 633 <b>
634 <h5 class="right my-1"> 634 <h5 class="right my-1">
635 <b>Country:</b> 635 <b>Country:</b>
636 </h5> 636 </h5>
637 </b> 637 </b>
638 </v-flex> 638 </v-flex>
639 <v-flex sm7 xs6> 639 <v-flex sm7 xs6>
640 <h5 class="my-1">{{ editedItem.country }}</h5> 640 <h5 class="my-1">{{ editedItem.country }}</h5>
641 </v-flex> 641 </v-flex>
642 </v-layout> 642 </v-layout>
643 </v-flex> 643 </v-flex>
644 </v-layout> 644 </v-layout>
645 <v-layout wrap> 645 <v-layout wrap>
646 <v-flex xs12 sm5> 646 <v-flex xs12 sm5>
647 <v-layout> 647 <v-layout>
648 <v-flex sm6 xs6> 648 <v-flex sm6 xs6>
649 <b> 649 <b>
650 <h5 class="right my-1"> 650 <h5 class="right my-1">
651 <b>Mobile No:</b> 651 <b>Mobile No:</b>
652 </h5> 652 </h5>
653 </b> 653 </b>
654 </v-flex> 654 </v-flex>
655 <v-flex sm6 xs6> 655 <v-flex sm6 xs6>
656 <h5 class="my-1">{{ editedItem.mobile }}</h5> 656 <h5 class="my-1">{{ editedItem.mobile }}</h5>
657 </v-flex> 657 </v-flex>
658 </v-layout> 658 </v-layout>
659 </v-flex> 659 </v-flex>
660 <v-flex xs12 sm7> 660 <v-flex xs12 sm7>
661 <v-layout> 661 <v-layout>
662 <v-flex xs6 sm4> 662 <v-flex xs6 sm4>
663 <b> 663 <b>
664 <h5 class="right my-1"> 664 <h5 class="right my-1">
665 <b>FahterName:</b> 665 <b>FahterName:</b>
666 </h5> 666 </h5>
667 </b> 667 </b>
668 </v-flex> 668 </v-flex>
669 <v-flex sm8 xs6> 669 <v-flex sm8 xs6>
670 <h5 class="my-1">{{ editedItem.fatherName }}</h5> 670 <h5 class="my-1">{{ editedItem.fatherName }}</h5>
671 </v-flex> 671 </v-flex>
672 </v-layout> 672 </v-layout>
673 </v-flex> 673 </v-flex>
674 </v-layout> 674 </v-layout>
675 <v-layout wrap> 675 <v-layout wrap>
676 <v-flex xs12 sm5> 676 <v-flex xs12 sm5>
677 <v-layout> 677 <v-layout>
678 <v-flex xs6 sm6> 678 <v-flex xs6 sm6>
679 <b> 679 <b>
680 <h5 class="right my-1"> 680 <h5 class="right my-1">
681 <b>MotherName:</b> 681 <b>MotherName:</b>
682 </h5> 682 </h5>
683 </b> 683 </b>
684 </v-flex> 684 </v-flex>
685 <v-flex sm6 xs6> 685 <v-flex sm6 xs6>
686 <h5 class="my-1">{{ editedItem.motherName }}</h5> 686 <h5 class="my-1">{{ editedItem.motherName }}</h5>
687 </v-flex> 687 </v-flex>
688 </v-layout> 688 </v-layout>
689 </v-flex> 689 </v-flex>
690 <v-flex xs12 sm7> 690 <v-flex xs12 sm7>
691 <v-layout> 691 <v-layout>
692 <v-flex xs6 sm4> 692 <v-flex xs6 sm4>
693 <b> 693 <b>
694 <h5 class="right my-1"> 694 <h5 class="right my-1">
695 <b>FatherCellNo:</b> 695 <b>FatherCellNo:</b>
696 </h5> 696 </h5>
697 </b> 697 </b>
698 </v-flex> 698 </v-flex>
699 <v-flex sm6 xs6> 699 <v-flex sm6 xs6>
700 <h5 class="my-1">{{ editedItem.fatherCellNo }}</h5> 700 <h5 class="my-1">{{ editedItem.fatherCellNo }}</h5>
701 </v-flex> 701 </v-flex>
702 </v-layout> 702 </v-layout>
703 </v-flex> 703 </v-flex>
704 </v-layout> 704 </v-layout>
705 <v-layout wrap> 705 <v-layout wrap>
706 <v-flex xs12 sm5> 706 <v-flex xs12 sm5>
707 <v-layout> 707 <v-layout>
708 <v-flex xs6 sm6> 708 <v-flex xs6 sm6>
709 <b> 709 <b>
710 <h5 class="right my-1"> 710 <h5 class="right my-1">
711 <b>MotherCellNo:</b> 711 <b>MotherCellNo:</b>
712 </h5> 712 </h5>
713 </b> 713 </b>
714 </v-flex> 714 </v-flex>
715 <v-flex sm6 xs6> 715 <v-flex sm6 xs6>
716 <h5 class="my-1">{{ editedItem.motherCellNo }}</h5> 716 <h5 class="my-1">{{ editedItem.motherCellNo }}</h5>
717 </v-flex> 717 </v-flex>
718 </v-layout> 718 </v-layout>
719 </v-flex> 719 </v-flex>
720 <v-flex xs12 sm7> 720 <v-flex xs12 sm7>
721 <v-layout> 721 <v-layout>
722 <v-flex xs6 sm4> 722 <v-flex xs6 sm4>
723 <b> 723 <b>
724 <h5 class="my-1 right"> 724 <h5 class="my-1 right">
725 <b>AcademicYear:</b> 725 <b>AcademicYear:</b>
726 </h5> 726 </h5>
727 </b> 727 </b>
728 </v-flex> 728 </v-flex>
729 <v-flex sm5 xs8> 729 <v-flex sm5 xs8>
730 <h5 class="my-1">{{ editedItem.establishmentYear }}</h5> 730 <h5 class="my-1">{{ editedItem.establishmentYear }}</h5>
731 </v-flex> 731 </v-flex>
732 </v-layout> 732 </v-layout>
733 </v-flex> 733 </v-flex>
734 </v-layout> 734 </v-layout>
735 <v-layout wrap> 735 <v-layout wrap>
736 <v-flex xs12 sm5> 736 <v-flex xs12 sm5>
737 <v-layout> 737 <v-layout>
738 <v-flex xs6 sm6> 738 <v-flex xs6 sm6>
739 <b> 739 <b>
740 <h5 class="my-1 right"> 740 <h5 class="my-1 right">
741 <b>MedicalNotes:</b> 741 <b>MedicalNotes:</b>
742 </h5> 742 </h5>
743 </b> 743 </b>
744 </v-flex> 744 </v-flex>
745 <v-flex sm5 xs6> 745 <v-flex sm5 xs6>
746 <h5 class="my-1">{{ editedItem.medicalNotes }}</h5> 746 <h5 class="my-1">{{ editedItem.medicalNotes }}</h5>
747 </v-flex> 747 </v-flex>
748 </v-layout> 748 </v-layout>
749 </v-flex> 749 </v-flex>
750 <v-flex xs12 sm7 class="hidden-xs-only"> 750 <v-flex xs12 sm7 class="hidden-xs-only">
751 <v-layout wrap> 751 <v-layout wrap>
752 <v-flex sm4> 752 <v-flex sm4>
753 <b> 753 <b>
754 <h5 class="my-1 right"> 754 <h5 class="my-1 right">
755 <b>present Address:</b> 755 <b>present Address:</b>
756 </h5> 756 </h5>
757 </b> 757 </b>
758 </v-flex> 758 </v-flex>
759 <v-flex sm8> 759 <v-flex sm8>
760 <h5 class="my-1">{{ editedItem.presentAddress }}</h5> 760 <h5 class="my-1">{{ editedItem.presentAddress }}</h5>
761 </v-flex> 761 </v-flex>
762 </v-layout> 762 </v-layout>
763 </v-flex> 763 </v-flex>
764 <v-flex sm6 class="hidden-xs-only"> 764 <v-flex sm6 class="hidden-xs-only">
765 <v-layout wrap> 765 <v-layout wrap>
766 <v-flex sm5> 766 <v-flex sm5>
767 <b> 767 <b>
768 <h5 class="my-1 right"> 768 <h5 class="my-1 right">
769 <b>Permanent Address:</b> 769 <b>Permanent Address:</b>
770 </h5> 770 </h5>
771 </b> 771 </b>
772 </v-flex> 772 </v-flex>
773 <v-flex sm7> 773 <v-flex sm7>
774 <h5 class="my-1">{{ editedItem.permanentAddress }}</h5> 774 <h5 class="my-1">{{ editedItem.permanentAddress }}</h5>
775 </v-flex> 775 </v-flex>
776 </v-layout> 776 </v-layout>
777 </v-flex> 777 </v-flex>
778 </v-layout> 778 </v-layout>
779 <v-layout wrap class="hidden-sm-only hidden-md-only hidden-lg-only hidden-xl-only"> 779 <v-layout wrap class="hidden-sm-only hidden-md-only hidden-lg-only hidden-xl-only">
780 <v-flex xs12 sm5> 780 <v-flex xs12 sm5>
781 <v-layout wrap> 781 <v-layout wrap>
782 <v-flex xs12 sm6> 782 <v-flex xs12 sm6>
783 <b> 783 <b>
784 <h5 class="my-1"> 784 <h5 class="my-1">
785 <b>present Address:-</b> 785 <b>present Address:-</b>
786 </h5> 786 </h5>
787 </b> 787 </b>
788 </v-flex> 788 </v-flex>
789 <v-flex sm5 xs12> 789 <v-flex sm5 xs12>
790 <h5 class="my-1">{{ editedItem.presentAddress }}</h5> 790 <h5 class="my-1">{{ editedItem.presentAddress }}</h5>
791 </v-flex> 791 </v-flex>
792 </v-layout> 792 </v-layout>
793 </v-flex> 793 </v-flex>
794 <v-flex xs12 sm6> 794 <v-flex xs12 sm6>
795 <v-layout wrap> 795 <v-layout wrap>
796 <v-flex xs12 sm6> 796 <v-flex xs12 sm6>
797 <b> 797 <b>
798 <h5 class="my-1"> 798 <h5 class="my-1">
799 <b>Permanent Address:-</b> 799 <b>Permanent Address:-</b>
800 </h5> 800 </h5>
801 </b> 801 </b>
802 </v-flex> 802 </v-flex>
803 <v-flex sm6 xs12> 803 <v-flex sm6 xs12>
804 <h5 class="my-1">{{ editedItem.permanentAddress }}</h5> 804 <h5 class="my-1">{{ editedItem.permanentAddress }}</h5>
805 </v-flex> 805 </v-flex>
806 </v-layout> 806 </v-layout>
807 </v-flex> 807 </v-flex>
808 </v-layout> 808 </v-layout>
809 </v-container> 809 </v-container>
810 </v-card-text> 810 </v-card-text>
811 </v-card> 811 </v-card>
812 </v-dialog> 812 </v-dialog>
813 813
814 <!-- ****** STUDENTS TABLE ****** --> 814 <!-- ****** STUDENTS TABLE ****** -->
815 <v-toolbar color="transparent" flat> 815 <v-toolbar color="transparent" flat>
816 <v-btn 816 <v-btn
817 fab 817 fab
818 dark 818 dark
819 class="open-dialog-button hidden-xl-only hidden-md-only hidden-lg-only" 819 class="open-dialog-button hidden-xl-only hidden-md-only hidden-lg-only"
820 small 820 small
821 @click="addStudentDialog = true" 821 @click="addStudentDialog = true"
822 > 822 >
823 <v-icon dark>add</v-icon> 823 <v-icon dark>add</v-icon>
824 </v-btn> 824 </v-btn>
825 <v-btn 825 <v-btn
826 round 826 round
827 class="open-dialog-button hidden-sm-only hidden-xs-only" 827 class="open-dialog-button hidden-sm-only hidden-xs-only"
828 dark 828 dark
829 @click="addStudentDialog = true" 829 @click="addStudentDialog = true"
830 > 830 >
831 <v-icon class="white--text pr-1" size="20">add</v-icon>Add Student 831 <v-icon class="white--text pr-1" size="20">add</v-icon>Add Student
832 </v-btn> 832 </v-btn>
833 <v-card-actions class="hidden-xs-only hidden-sm-only"> 833 <v-card-actions class="hidden-xs-only hidden-sm-only">
834 <v-flex md13 lg12> 834 <v-flex md13 lg12>
835 <v-layout> 835 <v-layout>
836 <v-flex lg3 md4> 836 <v-flex lg3 md4>
837 <v-select 837 <v-select
838 :items="addclass" 838 :items="addclass"
839 label="Select Class" 839 label="Select Class"
840 v-model="selectStudents.select" 840 v-model="selectStudents.select"
841 item-text="classNum" 841 item-text="classNum"
842 item-value="_id" 842 item-value="_id"
843 name="Select Class" 843 name="Select Class"
844 :rules="classRules" 844 :rules="classRules"
845 @change="getSections(selectStudents.select)" 845 @change="getSections(selectStudents.select)"
846 required 846 required
847 class="ml-2" 847 class="ml-2"
848 ></v-select> 848 ></v-select>
849 </v-flex> 849 </v-flex>
850 <v-flex lg3 md4 class="ml-2"> 850 <v-flex lg3 md4 class="ml-2">
851 <v-layout> 851 <v-layout>
852 <v-select 852 <v-select
853 :items="addSection" 853 :items="addSection"
854 label="Select Section" 854 label="Select Section"
855 v-model="selectStudents.selectSection" 855 v-model="selectStudents.selectSection"
856 item-text="name" 856 item-text="name"
857 item-value="_id" 857 item-value="_id"
858 name="Select Section" 858 name="Select Section"
859 :rules="sectionRules" 859 :rules="sectionRules"
860 required 860 required
861 ></v-select> 861 ></v-select>
862 </v-layout> 862 </v-layout>
863 </v-flex> 863 </v-flex>
864 </v-layout> 864 </v-layout>
865 </v-flex> 865 </v-flex>
866 </v-card-actions> 866 </v-card-actions>
867 <v-spacer></v-spacer> 867 <v-spacer></v-spacer>
868 <v-btn @click="findStudents()" round dark :loading="loading" class="add-button hidden-xs-only hidden-sm-only">Find</v-btn> 868 <v-btn @click="findStudents()" round dark :loading="loading" class="add-button hidden-xs-only hidden-sm-only">Find</v-btn>
869 <v-card-title class="body-1" v-show="show"> 869 <v-card-title class="body-1" v-show="show">
870 <v-btn icon large flat @click="displaySearch"> 870 <v-btn icon large flat @click="displaySearch">
871 <v-avatar size="27"> 871 <v-avatar size="27">
872 <img src="/static/icon/search.png" alt="icon" /> 872 <img src="/static/icon/search.png" alt="icon" />
873 </v-avatar> 873 </v-avatar>
874 </v-btn> 874 </v-btn>
875 </v-card-title> 875 </v-card-title>
876 <v-flex xs8 sm7 lg2 md3 v-show="showSearch"> 876 <v-flex xs8 sm7 lg2 md3 v-show="showSearch">
877 <v-layout> 877 <v-layout>
878 <v-text-field v-model="search" label="Search" prepend-inner-icon="search" color="primary"></v-text-field> 878 <v-text-field v-model="search" label="Search" prepend-inner-icon="search" color="primary"></v-text-field>
879 <v-icon @click="closeSearch" color="error">close</v-icon> 879 <v-icon @click="closeSearch" color="error">close</v-icon>
880 </v-layout> 880 </v-layout>
881 </v-flex> 881 </v-flex>
882 </v-toolbar> 882 </v-toolbar>
883 <v-card flat class="elevation-0 transparent"> 883 <v-card flat class="elevation-0 transparent">
884 <v-flex class="hidden-xl-only hidden-lg-only hidden-md-only"> 884 <v-flex class="hidden-xl-only hidden-lg-only hidden-md-only">
885 <v-layout> 885 <v-layout>
886 <v-flex xs4> 886 <v-flex xs4>
887 <label class="right mt-4">Select Class:</label> 887 <label class="right mt-4">Select Class:</label>
888 </v-flex> 888 </v-flex>
889 <v-flex xs8> 889 <v-flex xs8>
890 <v-select 890 <v-select
891 :items="addclass" 891 :items="addclass"
892 label="Select Class" 892 label="Select Class"
893 v-model="selectStudents.select" 893 v-model="selectStudents.select"
894 item-text="classNum" 894 item-text="classNum"
895 item-value="_id" 895 item-value="_id"
896 name="Select Class" 896 name="Select Class"
897 :rules="classRules" 897 :rules="classRules"
898 @change="getSections(selectStudents.select)" 898 @change="getSections(selectStudents.select)"
899 class="px-2" 899 class="px-2"
900 ></v-select> 900 ></v-select>
901 </v-flex> 901 </v-flex>
902 </v-layout> 902 </v-layout>
903 <v-layout> 903 <v-layout>
904 <v-flex xs4> 904 <v-flex xs4>
905 <label class="right mt-4">Select Section:</label> 905 <label class="right mt-4">Select Section:</label>
906 </v-flex> 906 </v-flex>
907 <v-flex xs8> 907 <v-flex xs8>
908 <v-select 908 <v-select
909 :items="addSection" 909 :items="addSection"
910 label="Select Section" 910 label="Select Section"
911 v-model="selectStudents.selectSection" 911 v-model="selectStudents.selectSection"
912 item-text="name" 912 item-text="name"
913 item-value="_id" 913 item-value="_id"
914 name="Select Section" 914 name="Select Section"
915 :rules="sectionRules" 915 :rules="sectionRules"
916 class="px-2" 916 class="px-2"
917 required 917 required
918 ></v-select> 918 ></v-select>
919 </v-flex> 919 </v-flex>
920 </v-layout> 920 </v-layout>
921 <v-layout> 921 <v-layout>
922 <v-flex xs5 class="mx-auto mb-2"> 922 <v-flex xs5 class="mx-auto mb-2">
923 <v-btn @click="findStudents()" block round dark :loading="loading" class="add-button">Find</v-btn> 923 <v-btn @click="findStudents()" block round dark :loading="loading" class="add-button">Find</v-btn>
924 </v-flex> 924 </v-flex>
925 </v-layout> 925 </v-layout>
926 </v-flex> 926 </v-flex>
927 </v-card> 927 </v-card>
928 <v-data-table 928 <v-data-table
929 :headers="headers" 929 :headers="headers"
930 :items="studentsData" 930 :items="studentsData"
931 :pagination.sync="pagination" 931 :pagination.sync="pagination"
932 :search="search" 932 :search="search"
933 > 933 >
934 <template slot="items" slot-scope="props"> 934 <template slot="items" slot-scope="props">
935 <tr class="tr"> 935 <tr class="tr">
936 <td class="text-xs-center td td-row">{{ props.item.rollNo}}</td> 936 <td class="text-xs-center td td-row">{{ props.item.rollNo}}</td>
937 <td class="text-xs-center td td-row"> 937 <td class="text-xs-center td td-row">
938 <v-avatar size="40"> 938 <v-avatar size="40">
939 <img :src="props.item.profilePicUrl" v-if="props.item.profilePicUrl" /> 939 <img :src="props.item.profilePicUrl" v-if="props.item.profilePicUrl" />
940 <img src="/static/icon/user.png" v-else-if="!props.item.profilePicUrl" /> 940 <img src="/static/icon/user.png" v-else-if="!props.item.profilePicUrl" />
941 </v-avatar> 941 </v-avatar>
942 </td> 942 </td>
943 <td class="text-xs-center td td-row">{{ props.item.name}}</td> 943 <td class="text-xs-center td td-row">{{ props.item.name}}</td>
944 <td class="text-xs-center td td-row">{{ props.item.gender }}</td> 944 <td class="text-xs-center td td-row">{{ props.item.gender }}</td>
945 <td class="text-xs-center td td-row">{{ props.item.parentId.fatherName }}</td> 945 <td class="text-xs-center td td-row">{{ props.item.parentId.fatherName }}</td>
946 <td class="text-xs-center td td-row">{{ props.item.parentId.motherName }}</td> 946 <td class="text-xs-center td td-row">{{ props.item.parentId.motherName }}</td>
947 <td class="text-xs-center td td-row">{{ props.item.establishmentYear }}</td> 947 <td class="text-xs-center td td-row">{{ props.item.establishmentYear }}</td>
948 <td class="text-xs-center td td-row">{{ props.item.mobile}}</td> 948 <!-- <td class="text-xs-center td td-row">{{ props.item.mobile}}</td> -->
949 <td class="text-xs-center td td-row"> 949 <td class="text-xs-center td td-row">
950 <v-switch 950 <v-switch
951 class="pl-3" 951 class="pl-3"
952 v-model="props.item.status" 952 v-model="props.item.status"
953 @change="suspendStudentStatus(props.item.status,props.item._id)" 953 @change="suspendStudentStatus(props.item.status,props.item._id)"
954 ></v-switch> 954 ></v-switch>
955 </td> 955 </td>
956 <td class="text-xs-center td td-row"> 956 <td class="text-xs-center td td-row">
957 <span> 957 <span>
958 <v-tooltip top> 958 <v-tooltip top>
959 <img 959 <img
960 slot="activator" 960 slot="activator"
961 style="cursor:pointer; width:25px; height:25px; " 961 style="cursor:pointer; width:25px; height:25px; "
962 class="mr-3" 962 class="mr-3"
963 @click="profile(props.item)" 963 @click="profile(props.item)"
964 src="/static/icon/view.png" 964 src="/static/icon/view.png"
965 /> 965 />
966 <span>View</span> 966 <span>View</span>
967 </v-tooltip> 967 </v-tooltip>
968 <v-tooltip top> 968 <v-tooltip top>
969 <img 969 <img
970 slot="activator" 970 slot="activator"
971 style="cursor:pointer; width:20px; height:18px; " 971 style="cursor:pointer; width:20px; height:18px; "
972 class="mr-3" 972 class="mr-3"
973 @click="editItem(props.item)" 973 @click="editItem(props.item)"
974 src="/static/icon/edit.png" 974 src="/static/icon/edit.png"
975 /> 975 />
976 <span>Edit</span> 976 <span>Edit</span>
977 </v-tooltip> 977 </v-tooltip>
978 <v-tooltip top> 978 <v-tooltip top>
979 <img 979 <img
980 slot="activator" 980 slot="activator"
981 style="cursor:pointer; width:20px; height:20px; " 981 style="cursor:pointer; width:20px; height:20px; "
982 class="mr-3" 982 class="mr-3"
983 @click="deleteItem(props.item)" 983 @click="deleteItem(props.item)"
984 src="/static/icon/delete.png" 984 src="/static/icon/delete.png"
985 /> 985 />
986 <span>Delete</span> 986 <span>Delete</span>
987 </v-tooltip> 987 </v-tooltip>
988 </span> 988 </span>
989 </td> 989 </td>
990 </tr> 990 </tr>
991 </template> 991 </template>
992 <v-alert 992 <v-alert
993 slot="no-results" 993 slot="no-results"
994 :value="true" 994 :value="true"
995 color="error" 995 color="error"
996 icon="warning" 996 icon="warning"
997 >Your search for "{{ search }}" found no results.</v-alert> 997 >Your search for "{{ search }}" found no results.</v-alert>
998 </v-data-table> 998 </v-data-table>
999 <!-- ****** ADD STUDENTS DETAILS****** --> 999 <!-- ****** ADD STUDENTS DETAILS****** -->
1000 <v-dialog v-model="addStudentDialog" max-width="1280"> 1000 <v-dialog v-model="addStudentDialog" max-width="1280">
1001 <v-card flat class="card-style pa-2" dark> 1001 <v-card flat class="card-style pa-2" dark>
1002 <v-layout> 1002 <v-layout>
1003 <v-flex xs12> 1003 <v-flex xs12>
1004 <label class="title text-xs-center">Add Student</label> 1004 <label class="title text-xs-center">Add Student</label>
1005 <v-icon size="24" class="right" @click="addStudentDialog = false">cancel</v-icon> 1005 <v-icon size="24" class="right" @click="addStudentDialog = false">cancel</v-icon>
1006 </v-flex> 1006 </v-flex>
1007 </v-layout> 1007 </v-layout>
1008 <v-container fluid> 1008 <v-container fluid>
1009 <v-layout align-center> 1009 <v-layout align-center>
1010 <v-flex xs12> 1010 <v-flex xs12>
1011 <v-stepper v-model="e2" flat class="card-style elevation-0" dark> 1011 <v-stepper v-model="e2" flat class="card-style elevation-0" dark>
1012 <v-stepper-header> 1012 <v-stepper-header>
1013 <v-stepper-step :complete="e2 > 1" step="1">Fill parent Details</v-stepper-step> 1013 <v-stepper-step :complete="e2 > 1" step="1">Fill parent Details</v-stepper-step>
1014 <v-divider></v-divider> 1014 <v-divider></v-divider>
1015 <v-stepper-step step="2">Fill Student Details</v-stepper-step> 1015 <v-stepper-step step="2">Fill Student Details</v-stepper-step>
1016 </v-stepper-header> 1016 </v-stepper-header>
1017 <v-stepper-items> 1017 <v-stepper-items>
1018 <v-stepper-content step="1"> 1018 <v-stepper-content step="1">
1019 <v-container fluid class> 1019 <v-container fluid class>
1020 <v-flex xs12 sm12 class="hidden-md-only hidden-lg-only hidden-xl-only"> 1020 <v-flex xs12 sm12 class="hidden-md-only hidden-lg-only hidden-xl-only">
1021 <v-form ref="parentForm" v-model="valid" lazy-validation> 1021 <v-form ref="parentForm" v-model="valid" lazy-validation>
1022 <v-layout wrap> 1022 <v-layout wrap>
1023 <v-flex xs12 sm6> 1023 <v-flex xs12 sm6>
1024 <v-layout wrap> 1024 <v-layout wrap>
1025 <v-flex xs12 class="pt-4 subheading"> 1025 <v-flex xs12 class="pt-4 subheading">
1026 <label>Father Cell No:</label> 1026 <label>Father Cell No:</label>
1027 </v-flex> 1027 </v-flex>
1028 <v-flex xs12> 1028 <v-flex xs12>
1029 <v-text-field 1029 <v-text-field
1030 v-model.trim="parentData.fatherCellNo" 1030 v-model.trim="parentData.fatherCellNo"
1031 placeholder="fill your father Cell Number" 1031 placeholder="fill your father Cell Number"
1032 type="number" 1032 type="number"
1033 :rules="fatheCellNoRules" 1033 :rules="fatheCellNoRules"
1034 counter="10" 1034 counter="10"
1035 v-on:keyup="getParentDetails()" 1035 v-on:keyup="getParentDetails()"
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 wrap> 1042 <v-layout wrap>
1043 <v-flex xs12 class="pt-4 subheading"> 1043 <v-flex xs12 class="pt-4 subheading">
1044 <label>Parent Email Id:</label> 1044 <label>Parent Email Id:</label>
1045 </v-flex> 1045 </v-flex>
1046 <v-flex xs12> 1046 <v-flex xs12>
1047 <v-text-field 1047 <v-text-field
1048 placeholder="fill Parent email" 1048 placeholder="fill Parent email"
1049 v-model="parentData.email" 1049 v-model="parentData.email"
1050 type="text" 1050 type="text"
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 wrap> 1057 <v-layout wrap>
1058 <v-flex xs12 sm6> 1058 <v-flex xs12 sm6>
1059 <v-layout wrap> 1059 <v-layout wrap>
1060 <v-flex xs12 class="pt-4 subheading"> 1060 <v-flex xs12 class="pt-4 subheading">
1061 <label>Father Name:</label> 1061 <label>Father Name:</label>
1062 </v-flex> 1062 </v-flex>
1063 <v-flex xs12> 1063 <v-flex xs12>
1064 <v-text-field 1064 <v-text-field
1065 v-model="parentData.fatherName" 1065 v-model="parentData.fatherName"
1066 placeholder="Fill your father Name" 1066 placeholder="Fill your father Name"
1067 required 1067 required
1068 ></v-text-field> 1068 ></v-text-field>
1069 </v-flex> 1069 </v-flex>
1070 </v-layout> 1070 </v-layout>
1071 </v-flex> 1071 </v-flex>
1072 <v-flex xs12 sm6> 1072 <v-flex xs12 sm6>
1073 <v-layout wrap> 1073 <v-layout wrap>
1074 <v-flex xs12 class="pt-4 subheading"> 1074 <v-flex xs12 class="pt-4 subheading">
1075 <label>Mother Name:</label> 1075 <label>Mother Name:</label>
1076 </v-flex> 1076 </v-flex>
1077 <v-flex xs12> 1077 <v-flex xs12>
1078 <v-text-field 1078 <v-text-field
1079 v-model="parentData.motherName" 1079 v-model="parentData.motherName"
1080 placeholder="fill your Mother Name" 1080 placeholder="fill your Mother Name"
1081 type="text" 1081 type="text"
1082 required 1082 required
1083 ></v-text-field> 1083 ></v-text-field>
1084 </v-flex> 1084 </v-flex>
1085 </v-layout> 1085 </v-layout>
1086 </v-flex> 1086 </v-flex>
1087 </v-layout> 1087 </v-layout>
1088 <v-layout wrap> 1088 <v-layout wrap>
1089 <v-flex xs12 sm6> 1089 <v-flex xs12 sm6>
1090 <v-layout wrap> 1090 <v-layout wrap>
1091 <v-flex xs12 class="pt-4 subheading"> 1091 <v-flex xs12 class="pt-4 subheading">
1092 <label>Mother Cell No:</label> 1092 <label>Mother Cell No:</label>
1093 </v-flex> 1093 </v-flex>
1094 <v-flex xs12> 1094 <v-flex xs12>
1095 <v-text-field 1095 <v-text-field
1096 v-model="parentData.motherCellNo" 1096 v-model="parentData.motherCellNo"
1097 placeholder="fill your Mother Cell Number" 1097 placeholder="fill your Mother Cell Number"
1098 type="number" 1098 type="number"
1099 required 1099 required
1100 ></v-text-field> 1100 ></v-text-field>
1101 </v-flex> 1101 </v-flex>
1102 </v-layout> 1102 </v-layout>
1103 </v-flex> 1103 </v-flex>
1104 <v-flex xs12 sm6> 1104 <v-flex xs12 sm6>
1105 <v-layout wrap> 1105 <v-layout wrap>
1106 <v-flex xs12 class="pt-4 subheading"> 1106 <v-flex xs12 class="pt-4 subheading">
1107 <label>Father Profession:</label> 1107 <label>Father Profession:</label>
1108 </v-flex> 1108 </v-flex>
1109 <v-flex xs12> 1109 <v-flex xs12>
1110 <v-text-field 1110 <v-text-field
1111 v-model="parentData.fatherProfession" 1111 v-model="parentData.fatherProfession"
1112 placeholder="fill your father profession" 1112 placeholder="fill your father profession"
1113 ></v-text-field> 1113 ></v-text-field>
1114 </v-flex> 1114 </v-flex>
1115 </v-layout> 1115 </v-layout>
1116 </v-flex> 1116 </v-flex>
1117 </v-layout> 1117 </v-layout>
1118 <v-layout wrap> 1118 <v-layout wrap>
1119 <v-flex xs12 sm6> 1119 <v-flex xs12 sm6>
1120 <v-layout wrap> 1120 <v-layout wrap>
1121 <v-flex xs12 class="pt-4 subheading"> 1121 <v-flex xs12 class="pt-4 subheading">
1122 <label>Mother Profession:</label> 1122 <label>Mother Profession:</label>
1123 </v-flex> 1123 </v-flex>
1124 <v-flex xs12> 1124 <v-flex xs12>
1125 <v-text-field 1125 <v-text-field
1126 v-model="parentData.motherProfession" 1126 v-model="parentData.motherProfession"
1127 placeholder="fill your mother profession" 1127 placeholder="fill your mother profession"
1128 ></v-text-field> 1128 ></v-text-field>
1129 </v-flex> 1129 </v-flex>
1130 </v-layout> 1130 </v-layout>
1131 </v-flex> 1131 </v-flex>
1132 <v-flex xs12 sm6> 1132 <v-flex xs12 sm6>
1133 <v-layout wrap> 1133 <v-layout wrap>
1134 <v-flex xs12 class="pt-4 subheading"> 1134 <v-flex xs12 class="pt-4 subheading">
1135 <label>Password:</label> 1135 <label>Password:</label>
1136 </v-flex> 1136 </v-flex>
1137 <v-flex xs12> 1137 <v-flex xs12>
1138 <v-text-field 1138 <v-text-field
1139 v-model="parentData.password" 1139 v-model="parentData.password"
1140 placeholder="Enter Your Password" 1140 placeholder="Enter Your Password"
1141 ></v-text-field> 1141 ></v-text-field>
1142 </v-flex> 1142 </v-flex>
1143 </v-layout> 1143 </v-layout>
1144 </v-flex> 1144 </v-flex>
1145 </v-layout> 1145 </v-layout>
1146 <v-flex sm12 class="hidden-xs-only"> 1146 <v-flex sm12 class="hidden-xs-only">
1147 <v-card-actions> 1147 <v-card-actions>
1148 <v-spacer></v-spacer> 1148 <v-spacer></v-spacer>
1149 <v-btn 1149 <v-btn
1150 @click="submitParentDetails" 1150 @click="submitParentDetails"
1151 round 1151 round
1152 dark 1152 dark
1153 :loading="loading" 1153 :loading="loading"
1154 v-show="showParent" 1154 v-show="showParent"
1155 class="add-button" 1155 class="add-button"
1156 >Add</v-btn> 1156 >Add</v-btn>
1157 <v-btn 1157 <v-btn
1158 v-show="showNext" 1158 v-show="showNext"
1159 @click="e2 = 2" 1159 @click="e2 = 2"
1160 round 1160 round
1161 dark 1161 dark
1162 class="add-button" 1162 class="add-button"
1163 >Next</v-btn> 1163 >Next</v-btn>
1164 </v-card-actions> 1164 </v-card-actions>
1165 </v-flex> 1165 </v-flex>
1166 <v-flex 1166 <v-flex
1167 xs6 1167 xs6
1168 class="hidden-md-only hidden-sm-only hidden-lg-only hidden-xl-only mx-auto mt-2" 1168 class="hidden-md-only hidden-sm-only hidden-lg-only hidden-xl-only mx-auto mt-2"
1169 > 1169 >
1170 <v-btn 1170 <v-btn
1171 @click="submitParentDetails" 1171 @click="submitParentDetails"
1172 round 1172 round
1173 dark 1173 dark
1174 :loading="loading" 1174 :loading="loading"
1175 v-show="showParent" 1175 v-show="showParent"
1176 class="add-button" 1176 class="add-button"
1177 >Add</v-btn> 1177 >Add</v-btn>
1178 <v-btn 1178 <v-btn
1179 v-show="showNext" 1179 v-show="showNext"
1180 @click="e2 = 2" 1180 @click="e2 = 2"
1181 round 1181 round
1182 dark 1182 dark
1183 class="add-button" 1183 class="add-button"
1184 >Next</v-btn> 1184 >Next</v-btn>
1185 </v-flex> 1185 </v-flex>
1186 </v-form> 1186 </v-form>
1187 </v-flex> 1187 </v-flex>
1188 <v-flex xs12 sm12 class="hidden-xs-only hidden-sm-only"> 1188 <v-flex xs12 sm12 class="hidden-xs-only hidden-sm-only">
1189 <v-form ref="parentForm" v-model="valid" lazy-validation> 1189 <v-form ref="parentForm" v-model="valid" lazy-validation>
1190 <v-layout wrap> 1190 <v-layout wrap>
1191 <v-flex xs12 sm6> 1191 <v-flex xs12 sm6>
1192 <v-layout> 1192 <v-layout>
1193 <v-flex xs4 class="pt-4 subheading"> 1193 <v-flex xs4 class="pt-4 subheading">
1194 <label class="right">Father Cell No:</label> 1194 <label class="right">Father Cell No:</label>
1195 </v-flex> 1195 </v-flex>
1196 <v-flex xs8 class="ml-3"> 1196 <v-flex xs8 class="ml-3">
1197 <v-text-field 1197 <v-text-field
1198 v-model.trim="parentData.fatherCellNo" 1198 v-model.trim="parentData.fatherCellNo"
1199 placeholder="fill your father Cell Number" 1199 placeholder="fill your father Cell Number"
1200 type="number" 1200 type="number"
1201 :rules="fatheCellNoRules" 1201 :rules="fatheCellNoRules"
1202 counter="10" 1202 counter="10"
1203 v-on:keyup="getParentDetails()" 1203 v-on:keyup="getParentDetails()"
1204 required 1204 required
1205 ></v-text-field> 1205 ></v-text-field>
1206 </v-flex> 1206 </v-flex>
1207 </v-layout> 1207 </v-layout>
1208 </v-flex> 1208 </v-flex>
1209 <v-flex xs12 sm6> 1209 <v-flex xs12 sm6>
1210 <v-layout> 1210 <v-layout>
1211 <v-flex xs4 class="pt-4 subheading"> 1211 <v-flex xs4 class="pt-4 subheading">
1212 <label class="right">Parent Email Id:</label> 1212 <label class="right">Parent Email Id:</label>
1213 </v-flex> 1213 </v-flex>
1214 <v-flex xs8 class="ml-3"> 1214 <v-flex xs8 class="ml-3">
1215 <v-text-field 1215 <v-text-field
1216 placeholder="fill Parent email" 1216 placeholder="fill Parent email"
1217 v-model="parentData.email" 1217 v-model="parentData.email"
1218 type="text" 1218 type="text"
1219 required 1219 required
1220 ></v-text-field> 1220 ></v-text-field>
1221 </v-flex> 1221 </v-flex>
1222 </v-layout> 1222 </v-layout>
1223 </v-flex> 1223 </v-flex>
1224 </v-layout> 1224 </v-layout>
1225 <v-layout wrap> 1225 <v-layout wrap>
1226 <v-flex xs12 sm6> 1226 <v-flex xs12 sm6>
1227 <v-layout> 1227 <v-layout>
1228 <v-flex xs4 class="pt-4 subheading"> 1228 <v-flex xs4 class="pt-4 subheading">
1229 <label class="right">Father Name:</label> 1229 <label class="right">Father Name:</label>
1230 </v-flex> 1230 </v-flex>
1231 <v-flex xs8 class="ml-3"> 1231 <v-flex xs8 class="ml-3">
1232 <v-text-field 1232 <v-text-field
1233 v-model="parentData.fatherName" 1233 v-model="parentData.fatherName"
1234 placeholder="Fill your father Name" 1234 placeholder="Fill your father Name"
1235 required 1235 required
1236 ></v-text-field> 1236 ></v-text-field>
1237 </v-flex> 1237 </v-flex>
1238 </v-layout> 1238 </v-layout>
1239 </v-flex> 1239 </v-flex>
1240 <v-flex xs12 sm6> 1240 <v-flex xs12 sm6>
1241 <v-layout> 1241 <v-layout>
1242 <v-flex xs4 class="pt-4 subheading"> 1242 <v-flex xs4 class="pt-4 subheading">
1243 <label class="right">Mother Name:</label> 1243 <label class="right">Mother Name:</label>
1244 </v-flex> 1244 </v-flex>
1245 <v-flex xs8 class="ml-3"> 1245 <v-flex xs8 class="ml-3">
1246 <v-text-field 1246 <v-text-field
1247 v-model="parentData.motherName" 1247 v-model="parentData.motherName"
1248 placeholder="fill your Mother Name" 1248 placeholder="fill your Mother Name"
1249 type="text" 1249 type="text"
1250 required 1250 required
1251 ></v-text-field> 1251 ></v-text-field>
1252 </v-flex> 1252 </v-flex>
1253 </v-layout> 1253 </v-layout>
1254 </v-flex> 1254 </v-flex>
1255 </v-layout> 1255 </v-layout>
1256 <v-layout wrap> 1256 <v-layout wrap>
1257 <v-flex xs12 sm6> 1257 <v-flex xs12 sm6>
1258 <v-layout> 1258 <v-layout>
1259 <v-flex xs4 class="pt-4 subheading"> 1259 <v-flex xs4 class="pt-4 subheading">
1260 <label class="right">Mother Cell No:</label> 1260 <label class="right">Mother Cell No:</label>
1261 </v-flex> 1261 </v-flex>
1262 <v-flex xs8 class="ml-3"> 1262 <v-flex xs8 class="ml-3">
1263 <v-text-field 1263 <v-text-field
1264 v-model="parentData.motherCellNo" 1264 v-model="parentData.motherCellNo"
1265 placeholder="fill your Mother Cell Number" 1265 placeholder="fill your Mother Cell Number"
1266 type="number" 1266 type="number"
1267 required 1267 required
1268 ></v-text-field> 1268 ></v-text-field>
1269 </v-flex> 1269 </v-flex>
1270 </v-layout> 1270 </v-layout>
1271 </v-flex> 1271 </v-flex>
1272 <v-flex xs12 sm6> 1272 <v-flex xs12 sm6>
1273 <v-layout> 1273 <v-layout>
1274 <v-flex xs4 class="pt-4 subheading"> 1274 <v-flex xs4 class="pt-4 subheading">
1275 <label class="right">Father Profession:</label> 1275 <label class="right">Father Profession:</label>
1276 </v-flex> 1276 </v-flex>
1277 <v-flex xs8 class="ml-3"> 1277 <v-flex xs8 class="ml-3">
1278 <v-text-field 1278 <v-text-field
1279 v-model="parentData.fatherProfession" 1279 v-model="parentData.fatherProfession"
1280 placeholder="fill your father profession" 1280 placeholder="fill your father profession"
1281 ></v-text-field> 1281 ></v-text-field>
1282 </v-flex> 1282 </v-flex>
1283 </v-layout> 1283 </v-layout>
1284 </v-flex> 1284 </v-flex>
1285 </v-layout> 1285 </v-layout>
1286 <v-layout wrap> 1286 <v-layout wrap>
1287 <v-flex xs12 sm6> 1287 <v-flex xs12 sm6>
1288 <v-layout> 1288 <v-layout>
1289 <v-flex xs4 class="pt-4 subheading"> 1289 <v-flex xs4 class="pt-4 subheading">
1290 <label class="right">Mother Profession:</label> 1290 <label class="right">Mother Profession:</label>
1291 </v-flex> 1291 </v-flex>
1292 <v-flex xs8 class="ml-3"> 1292 <v-flex xs8 class="ml-3">
1293 <v-text-field 1293 <v-text-field
1294 v-model="parentData.motherProfession" 1294 v-model="parentData.motherProfession"
1295 placeholder="fill your mother profession" 1295 placeholder="fill your mother profession"
1296 ></v-text-field> 1296 ></v-text-field>
1297 </v-flex> 1297 </v-flex>
1298 </v-layout> 1298 </v-layout>
1299 </v-flex> 1299 </v-flex>
1300 <v-flex xs12 sm6> 1300 <v-flex xs12 sm6>
1301 <v-layout> 1301 <v-layout>
1302 <v-flex xs4 class="pt-4 subheading"> 1302 <v-flex xs4 class="pt-4 subheading">
1303 <label class="right">Password:</label> 1303 <label class="right">Password:</label>
1304 </v-flex> 1304 </v-flex>
1305 <v-flex xs8 class="ml-3"> 1305 <v-flex xs8 class="ml-3">
1306 <v-text-field 1306 <v-text-field
1307 :append-icon="e1 ? 'visibility_off' : 'visibility'" 1307 :append-icon="e1 ? 'visibility_off' : 'visibility'"
1308 :append-icon-cb="() => (e1 = !e1)" 1308 :append-icon-cb="() => (e1 = !e1)"
1309 :type="e1 ? 'password' : 'text'" 1309 :type="e1 ? 'password' : 'text'"
1310 :rules="password" 1310 :rules="password"
1311 placeholder="Enter Your Password" 1311 placeholder="Enter Your Password"
1312 required 1312 required
1313 ></v-text-field> 1313 ></v-text-field>
1314 </v-flex> 1314 </v-flex>
1315 </v-layout> 1315 </v-layout>
1316 </v-flex> 1316 </v-flex>
1317 </v-layout> 1317 </v-layout>
1318 <v-flex sm12 class="hidden-xs-only"> 1318 <v-flex sm12 class="hidden-xs-only">
1319 <v-card-actions> 1319 <v-card-actions>
1320 <v-spacer></v-spacer> 1320 <v-spacer></v-spacer>
1321 <v-btn 1321 <v-btn
1322 @click="submitParentDetails" 1322 @click="submitParentDetails"
1323 round 1323 round
1324 dark 1324 dark
1325 :loading="loading" 1325 :loading="loading"
1326 v-show="showParent" 1326 v-show="showParent"
1327 class="add-button" 1327 class="add-button"
1328 >Add</v-btn> 1328 >Add</v-btn>
1329 <v-btn 1329 <v-btn
1330 v-show="showNext" 1330 v-show="showNext"
1331 @click="e2 = 2" 1331 @click="e2 = 2"
1332 round 1332 round
1333 dark 1333 dark
1334 class="add-button" 1334 class="add-button"
1335 >Next</v-btn> 1335 >Next</v-btn>
1336 </v-card-actions> 1336 </v-card-actions>
1337 </v-flex> 1337 </v-flex>
1338 <v-flex 1338 <v-flex
1339 xs6 1339 xs6
1340 class="hidden-md-only hidden-sm-only hidden-lg-only hidden-xl-only mx-auto mt-2" 1340 class="hidden-md-only hidden-sm-only hidden-lg-only hidden-xl-only mx-auto mt-2"
1341 > 1341 >
1342 <v-btn 1342 <v-btn
1343 @click="submitParentDetails" 1343 @click="submitParentDetails"
1344 round 1344 round
1345 dark 1345 dark
1346 :loading="loading" 1346 :loading="loading"
1347 v-show="showParent" 1347 v-show="showParent"
1348 class="add-button" 1348 class="add-button"
1349 >Add</v-btn> 1349 >Add</v-btn>
1350 <v-btn 1350 <v-btn
1351 v-show="showNext" 1351 v-show="showNext"
1352 @click="e2 = 2" 1352 @click="e2 = 2"
1353 round 1353 round
1354 dark 1354 dark
1355 class="add-button" 1355 class="add-button"
1356 >Next</v-btn> 1356 >Next</v-btn>
1357 </v-flex> 1357 </v-flex>
1358 </v-form> 1358 </v-form>
1359 </v-flex> 1359 </v-flex>
1360 </v-container> 1360 </v-container>
1361 </v-stepper-content> 1361 </v-stepper-content>
1362 <v-stepper-content step="2"> 1362 <v-stepper-content step="2">
1363 <v-flex xs12 sm12> 1363 <v-flex xs12 sm12>
1364 <v-form ref="form" v-model="valid" lazy-validation> 1364 <v-form ref="form" v-model="valid" lazy-validation>
1365 <v-layout> 1365 <v-layout>
1366 <v-flex 1366 <v-flex
1367 xs12 1367 xs12
1368 class="text-xs-center text-sm-center text-md-center text-lg-center" 1368 class="text-xs-center text-sm-center text-md-center text-lg-center"
1369 > 1369 >
1370 <v-avatar size="100px"> 1370 <v-avatar size="100px">
1371 <img src="/static/icon/user.png" v-if="!imageUrl" /> 1371 <img src="/static/icon/user.png" v-if="!imageUrl" />
1372 </v-avatar> 1372 </v-avatar>
1373 <input 1373 <input
1374 type="file" 1374 type="file"
1375 style="display: none" 1375 style="display: none"
1376 ref="image" 1376 ref="image"
1377 accept="image/*" 1377 accept="image/*"
1378 @change="onFilePicked" 1378 @change="onFilePicked"
1379 /> 1379 />
1380 <img 1380 <img
1381 :src="imageData.imageUrl" 1381 :src="imageData.imageUrl"
1382 height="150" 1382 height="150"
1383 v-if="imageUrl" 1383 v-if="imageUrl"
1384 style="border-radius:50%; width:200px" 1384 style="border-radius:50%; width:200px"
1385 /> 1385 />
1386 </v-flex> 1386 </v-flex>
1387 </v-layout> 1387 </v-layout>
1388 <v-layout wrap> 1388 <v-layout wrap>
1389 <v-flex xs12 sm6> 1389 <v-flex xs12 sm6>
1390 <v-layout> 1390 <v-layout>
1391 <v-flex x4 sm4 class="pt-4 subheading"> 1391 <v-flex x4 sm4 class="pt-4 subheading">
1392 <label class="right hidden-xs-only hidden-sm-only">Select Class:</label> 1392 <label class="right hidden-xs-only hidden-sm-only">Select Class:</label>
1393 <label 1393 <label
1394 class="right hidden-lg-only hidden-md-only hidden-xl-only" 1394 class="right hidden-lg-only hidden-md-only hidden-xl-only"
1395 >Class:</label> 1395 >Class:</label>
1396 </v-flex> 1396 </v-flex>
1397 <v-flex xs8 sm8 class="ml-3"> 1397 <v-flex xs8 sm8 class="ml-3">
1398 <v-select 1398 <v-select
1399 :items="addclass" 1399 :items="addclass"
1400 label="Select Class" 1400 label="Select Class"
1401 v-model="addStudents.select" 1401 v-model="addStudents.select"
1402 item-text="classNum" 1402 item-text="classNum"
1403 item-value="_id" 1403 item-value="_id"
1404 name="Select Class" 1404 name="Select Class"
1405 :rules="classRules" 1405 :rules="classRules"
1406 @change="getSection(addStudents.select)" 1406 @change="getSection(addStudents.select)"
1407 required 1407 required
1408 ></v-select> 1408 ></v-select>
1409 </v-flex> 1409 </v-flex>
1410 </v-layout> 1410 </v-layout>
1411 </v-flex> 1411 </v-flex>
1412 <v-flex xs12 sm6> 1412 <v-flex xs12 sm6>
1413 <v-layout> 1413 <v-layout>
1414 <v-flex xs4 class="pt-4 subheading"> 1414 <v-flex xs4 class="pt-4 subheading">
1415 <label class="right hidden-xs-only hidden-sm-only">Select Section:</label> 1415 <label class="right hidden-xs-only hidden-sm-only">Select Section:</label>
1416 <label 1416 <label
1417 class="right hidden-lg-only hidden-md-only hidden-xl-only" 1417 class="right hidden-lg-only hidden-md-only hidden-xl-only"
1418 >Section:</label> 1418 >Section:</label>
1419 </v-flex> 1419 </v-flex>
1420 <v-flex xs8 class="ml-3"> 1420 <v-flex xs8 class="ml-3">
1421 <v-select 1421 <v-select
1422 :items="addSection" 1422 :items="addSection"
1423 label="Select Section" 1423 label="Select Section"
1424 v-model="addStudents.selectSection" 1424 v-model="addStudents.selectSection"
1425 item-text="name" 1425 item-text="name"
1426 item-value="_id" 1426 item-value="_id"
1427 name="Select Section" 1427 name="Select Section"
1428 :rules="sectionRules" 1428 :rules="sectionRules"
1429 required 1429 required
1430 ></v-select> 1430 ></v-select>
1431 </v-flex> 1431 </v-flex>
1432 </v-layout> 1432 </v-layout>
1433 </v-flex> 1433 </v-flex>
1434 </v-layout> 1434 </v-layout>
1435 <v-layout wrap> 1435 <v-layout wrap>
1436 <v-flex xs12 sm6> 1436 <v-flex xs12 sm6>
1437 <v-layout> 1437 <v-layout>
1438 <v-flex xs4 sm4 class="pt-4 subheading"> 1438 <v-flex xs4 sm4 class="pt-4 subheading">
1439 <label class="right hidden-xs-only hidden-sm-only">Full Name:</label> 1439 <label class="right hidden-xs-only hidden-sm-only">Full Name:</label>
1440 <label 1440 <label
1441 class="right hidden-lg-only hidden-md-only hidden-xl-only" 1441 class="right hidden-lg-only hidden-md-only hidden-xl-only"
1442 >Name:</label> 1442 >Name:</label>
1443 </v-flex> 1443 </v-flex>
1444 <v-flex xs8 sm8 class="ml-3"> 1444 <v-flex xs8 sm8 class="ml-3">
1445 <v-text-field 1445 <v-text-field
1446 v-model="addStudents.name" 1446 v-model="addStudents.name"
1447 placeholder="fill your full Name" 1447 placeholder="fill your full Name"
1448 name="name" 1448 name="name"
1449 type="text" 1449 type="text"
1450 :rules="nameRules" 1450 :rules="nameRules"
1451 required 1451 required
1452 ></v-text-field> 1452 ></v-text-field>
1453 </v-flex> 1453 </v-flex>
1454 </v-layout> 1454 </v-layout>
1455 </v-flex> 1455 </v-flex>
1456 <v-flex xs12 sm6> 1456 <v-flex xs12 sm6>
1457 <v-layout> 1457 <v-layout>
1458 <v-flex xs4 sm4 class="pt-4 subheading"> 1458 <v-flex xs4 sm4 class="pt-4 subheading">
1459 <label class="right">Email:</label> 1459 <label class="right">Email:</label>
1460 </v-flex> 1460 </v-flex>
1461 <v-flex xs8 sm8 class="ml-3"> 1461 <v-flex xs8 sm8 class="ml-3">
1462 <v-text-field 1462 <v-text-field
1463 placeholder="fill your email" 1463 placeholder="fill your email"
1464 v-model="addStudents.email" 1464 v-model="addStudents.email"
1465 type="text" 1465 type="text"
1466 name="email" 1466 name="email"
1467 required 1467 required
1468 ></v-text-field> 1468 ></v-text-field>
1469 </v-flex> 1469 </v-flex>
1470 </v-layout> 1470 </v-layout>
1471 </v-flex> 1471 </v-flex>
1472 </v-layout> 1472 </v-layout>
1473 <v-layout wrap> 1473 <v-layout wrap>
1474 <v-flex xs12 sm6> 1474 <v-flex xs12 sm6>
1475 <v-layout> 1475 <v-layout>
1476 <v-flex xs4 sm4 class="pt-4 subheading"> 1476 <v-flex xs4 sm4 class="pt-4 subheading">
1477 <label class="right hidden-sm-only hidden-xs-only">Date of Birth:</label> 1477 <label class="right hidden-sm-only hidden-xs-only">Date of Birth:</label>
1478 <label 1478 <label
1479 class="right hidden-lg-only hidden-xl-only hidden-md-only" 1479 class="right hidden-lg-only hidden-xl-only hidden-md-only"
1480 >D.O.B:</label> 1480 >D.O.B:</label>
1481 </v-flex> 1481 </v-flex>
1482 <v-flex xs8 sm8 class="ml-3"> 1482 <v-flex xs8 sm8 class="ml-3">
1483 <v-menu 1483 <v-menu
1484 ref="menu" 1484 ref="menu"
1485 :close-on-content-click="false" 1485 :close-on-content-click="false"
1486 v-model="menu" 1486 v-model="menu"
1487 :nudge-right="40" 1487 :nudge-right="40"
1488 lazy 1488 lazy
1489 transition="scale-transition" 1489 transition="scale-transition"
1490 offset-y 1490 offset-y
1491 full-width 1491 full-width
1492 min-width="290px" 1492 min-width="290px"
1493 > 1493 >
1494 <v-text-field 1494 <v-text-field
1495 slot="activator" 1495 slot="activator"
1496 :rules="dateRules" 1496 :rules="dateRules"
1497 v-model="addStudents.date" 1497 v-model="addStudents.date"
1498 placeholder="Select date" 1498 placeholder="Select date"
1499 ></v-text-field> 1499 ></v-text-field>
1500 <v-date-picker 1500 <v-date-picker
1501 ref="picker" 1501 ref="picker"
1502 v-model="addStudents.date" 1502 v-model="addStudents.date"
1503 :max="new Date().toISOString().substr(0, 10)" 1503 :max="new Date().toISOString().substr(0, 10)"
1504 min="1950-01-01" 1504 min="1950-01-01"
1505 @input="menu = false" 1505 @input="menu = false"
1506 ></v-date-picker> 1506 ></v-date-picker>
1507 </v-menu> 1507 </v-menu>
1508 </v-flex> 1508 </v-flex>
1509 </v-layout> 1509 </v-layout>
1510 </v-flex> 1510 </v-flex>
1511 <v-flex xs12 sm6> 1511 <v-flex xs12 sm6>
1512 <v-layout> 1512 <v-layout>
1513 <v-flex xs4 class="pt-4 subheading"> 1513 <v-flex xs4 class="pt-4 subheading">
1514 <label class="right">City:</label> 1514 <label class="right">City:</label>
1515 </v-flex> 1515 </v-flex>
1516 <v-flex xs8 class="ml-3"> 1516 <v-flex xs8 class="ml-3">
1517 <v-text-field 1517 <v-text-field
1518 v-model="addStudents.city" 1518 v-model="addStudents.city"
1519 placeholder="fill your City Name" 1519 placeholder="fill your City Name"
1520 name="City" 1520 name="City"
1521 type="text" 1521 type="text"
1522 :rules="cityRules" 1522 :rules="cityRules"
1523 required 1523 required
1524 ></v-text-field> 1524 ></v-text-field>
1525 </v-flex> 1525 </v-flex>
1526 </v-layout> 1526 </v-layout>
1527 </v-flex> 1527 </v-flex>
1528 </v-layout> 1528 </v-layout>
1529 <v-layout wrap> 1529 <v-layout wrap>
1530 <v-flex xs12 sm6> 1530 <v-flex xs12 sm6>
1531 <v-layout> 1531 <v-layout>
1532 <v-flex xs4 class="pt-4 subheading"> 1532 <v-flex xs4 class="pt-4 subheading">
1533 <label class="right">State:</label> 1533 <label class="right">State:</label>
1534 </v-flex> 1534 </v-flex>
1535 <v-flex xs8 class="ml-3"> 1535 <v-flex xs8 class="ml-3">
1536 <v-text-field 1536 <v-text-field
1537 v-model="addStudents.state" 1537 v-model="addStudents.state"
1538 placeholder="fill your State Name" 1538 placeholder="fill your State Name"
1539 name="state" 1539 name="state"
1540 type="text" 1540 type="text"
1541 :rules="stateRules" 1541 :rules="stateRules"
1542 required 1542 required
1543 ></v-text-field> 1543 ></v-text-field>
1544 </v-flex> 1544 </v-flex>
1545 </v-layout> 1545 </v-layout>
1546 </v-flex> 1546 </v-flex>
1547 <v-flex xs12 sm6> 1547 <v-flex xs12 sm6>
1548 <v-layout> 1548 <v-layout>
1549 <v-flex xs4 class="pt-4 subheading"> 1549 <v-flex xs4 class="pt-4 subheading">
1550 <label class="right">Pincode:</label> 1550 <label class="right">Pincode:</label>
1551 </v-flex> 1551 </v-flex>
1552 <v-flex xs8 class="ml-3"> 1552 <v-flex xs8 class="ml-3">
1553 <v-text-field 1553 <v-text-field
1554 v-model="addStudents.pincode" 1554 v-model="addStudents.pincode"
1555 placeholder="fill your pincode" 1555 placeholder="fill your pincode"
1556 name="pincode" 1556 name="pincode"
1557 type="number" 1557 type="number"
1558 :rules="pincode" 1558 :rules="pincode"
1559 required 1559 required
1560 ></v-text-field> 1560 ></v-text-field>
1561 </v-flex> 1561 </v-flex>
1562 </v-layout> 1562 </v-layout>
1563 </v-flex> 1563 </v-flex>
1564 </v-layout> 1564 </v-layout>
1565 <v-layout wrap> 1565 <v-layout wrap>
1566 <v-flex xs12 sm6> 1566 <v-flex xs12 sm6>
1567 <v-layout> 1567 <v-layout>
1568 <v-flex xs4 class="pt-4 subheading"> 1568 <v-flex xs4 class="pt-4 subheading">
1569 <label class="right hidden-xs-only hidden-sm-only">Mobile No:</label> 1569 <label class="right hidden-xs-only hidden-sm-only">Mobile No:</label>
1570 <label 1570 <label
1571 class="right hidden-lg-only hidden-md-only hidden-xl-only" 1571 class="right hidden-lg-only hidden-md-only hidden-xl-only"
1572 >Mobile:</label> 1572 >Mobile:</label>
1573 </v-flex> 1573 </v-flex>
1574 <v-flex xs8 class="ml-3"> 1574 <v-flex xs8 class="ml-3">
1575 <v-text-field 1575 <v-text-field
1576 v-model="addStudents.mobile" 1576 v-model="addStudents.mobile"
1577 placeholder="fill your MobileNo" 1577 placeholder="fill your MobileNo"
1578 name="mobileNo" 1578 name="mobileNo"
1579 type="number" 1579 type="number"
1580 1580
1581 ></v-text-field> 1581 ></v-text-field>
1582 </v-flex> 1582 </v-flex>
1583 </v-layout> 1583 </v-layout>
1584 </v-flex> 1584 </v-flex>
1585 <v-flex xs12 sm6> 1585 <v-flex xs12 sm6>
1586 <v-layout> 1586 <v-layout>
1587 <v-flex xs4 class="pt-4 subheading"> 1587 <v-flex xs4 class="pt-4 subheading">
1588 <label class="right hidden-xs-only hidden-sm-only">Select Country:</label> 1588 <label class="right hidden-xs-only hidden-sm-only">Select Country:</label>
1589 <label 1589 <label
1590 class="right hidden-lg-only hidden-md-only hidden-xl-only" 1590 class="right hidden-lg-only hidden-md-only hidden-xl-only"
1591 >Country:</label> 1591 >Country:</label>
1592 </v-flex> 1592 </v-flex>
1593 <v-flex xs8 class="ml-3"> 1593 <v-flex xs8 class="ml-3">
1594 <v-autocomplete 1594 <v-autocomplete
1595 v-model="addStudents.country" 1595 v-model="addStudents.country"
1596 :rules="country" 1596 :rules="country"
1597 :items="countries" 1597 :items="countries"
1598 placeholder="Select Country Name" 1598 placeholder="Select Country Name"
1599 required 1599 required
1600 ></v-autocomplete> 1600 ></v-autocomplete>
1601 </v-flex> 1601 </v-flex>
1602 </v-layout> 1602 </v-layout>
1603 </v-flex> 1603 </v-flex>
1604 </v-layout> 1604 </v-layout>
1605 <v-layout wrap> 1605 <v-layout wrap>
1606 <v-flex xs12 sm6> 1606 <v-flex xs12 sm6>
1607 <v-layout> 1607 <v-layout>
1608 <v-flex xs4 class="pt-4 subheading"> 1608 <v-flex xs4 class="pt-4 subheading">
1609 <label class="right">Gender:</label> 1609 <label class="right">Gender:</label>
1610 </v-flex> 1610 </v-flex>
1611 <v-flex xs8 class="ml-3"> 1611 <v-flex xs8 class="ml-3">
1612 <v-select 1612 <v-select
1613 :items="gender" 1613 :items="gender"
1614 v-model="addStudents.gender" 1614 v-model="addStudents.gender"
1615 :rules="genderRules" 1615 :rules="genderRules"
1616 label="Select Gender" 1616 label="Select Gender"
1617 required 1617 required
1618 ></v-select> 1618 ></v-select>
1619 </v-flex> 1619 </v-flex>
1620 </v-layout> 1620 </v-layout>
1621 </v-flex> 1621 </v-flex>
1622 <v-flex xs12 sm6> 1622 <v-flex xs12 sm6>
1623 <v-layout> 1623 <v-layout>
1624 <v-flex xs4 class="pt-4 subheading"> 1624 <v-flex xs4 class="pt-4 subheading">
1625 <label class="right hidden-xs-only hidden-sm-only">Blood Group:</label> 1625 <label class="right hidden-xs-only hidden-sm-only">Blood Group:</label>
1626 <label 1626 <label
1627 class="right hidden-lg-only hidden-md-only hidden-xl-only" 1627 class="right hidden-lg-only hidden-md-only hidden-xl-only"
1628 >Blood:</label> 1628 >Blood:</label>
1629 </v-flex> 1629 </v-flex>
1630 <v-flex xs8 class="ml-3"> 1630 <v-flex xs8 class="ml-3">
1631 <v-text-field 1631 <v-text-field
1632 v-model="addStudents.bloodGroup" 1632 v-model="addStudents.bloodGroup"
1633 placeholder="Fill your Blood Group" 1633 placeholder="Fill your Blood Group"
1634 required 1634 required
1635 ></v-text-field> 1635 ></v-text-field>
1636 </v-flex> 1636 </v-flex>
1637 </v-layout> 1637 </v-layout>
1638 </v-flex> 1638 </v-flex>
1639 </v-layout> 1639 </v-layout>
1640 <v-layout wrap> 1640 <v-layout wrap>
1641 <v-flex xs12 sm6> 1641 <v-flex xs12 sm6>
1642 <v-layout> 1642 <v-layout>
1643 <v-flex xs4 class="pt-4 subheading"> 1643 <v-flex xs4 class="pt-4 subheading">
1644 <label class="right hidden-xs-only hidden-sm-only">Roll Number:</label> 1644 <label class="right hidden-xs-only hidden-sm-only">Roll Number:</label>
1645 <label 1645 <label
1646 class="right hidden-lg-only hidden-md-only hidden-xl-only" 1646 class="right hidden-lg-only hidden-md-only hidden-xl-only"
1647 >Roll No:</label> 1647 >Roll No:</label>
1648 </v-flex> 1648 </v-flex>
1649 <v-flex xs8 class="ml-3"> 1649 <v-flex xs8 class="ml-3">
1650 <v-text-field 1650 <v-text-field
1651 v-model="addStudents.rollNo" 1651 v-model="addStudents.rollNo"
1652 placeholder="Fill your Roll Number" 1652 placeholder="Fill your Roll Number"
1653 :rules="rollNo"
1653 required 1654 required
1654 ></v-text-field> 1655 ></v-text-field>
1655 </v-flex> 1656 </v-flex>
1656 </v-layout> 1657 </v-layout>
1657 </v-flex> 1658 </v-flex>
1658 <v-flex xs12 sm6> 1659 <v-flex xs12 sm6>
1659 <v-layout> 1660 <v-layout>
1660 <v-flex xs4 class="pt-4 subheading"> 1661 <v-flex xs4 class="pt-4 subheading">
1661 <label class="right hidden-xs-only hidden-sm-only">Medical Notes:</label> 1662 <label class="right hidden-xs-only hidden-sm-only">Medical Notes:</label>
1662 <label 1663 <label
1663 class="right hidden-lg-only hidden-md-only hidden-xl-only" 1664 class="right hidden-lg-only hidden-md-only hidden-xl-only"
1664 >Medical:</label> 1665 >Medical:</label>
1665 </v-flex> 1666 </v-flex>
1666 <v-flex xs8 class="ml-3"> 1667 <v-flex xs8 class="ml-3">
1667 <v-text-field 1668 <v-text-field
1668 v-model="addStudents.medicalNotes" 1669 v-model="addStudents.medicalNotes"
1669 placeholder="Fill your Medical Notes" 1670 placeholder="Fill your Medical Notes"
1670 required 1671 required
1671 ></v-text-field> 1672 ></v-text-field>
1672 </v-flex> 1673 </v-flex>
1673 </v-layout> 1674 </v-layout>
1674 </v-flex> 1675 </v-flex>
1675 </v-layout> 1676 </v-layout>
1676 <v-layout wrap> 1677 <v-layout wrap>
1677 <v-flex xs12 sm6> 1678 <v-flex xs12 sm6>
1678 <v-layout> 1679 <v-layout>
1679 <v-flex xs4 class="pt-4 subheading"> 1680 <v-flex xs4 class="pt-4 subheading">
1680 <label class="right">Height:</label> 1681 <label class="right">Height:</label>
1681 </v-flex> 1682 </v-flex>
1682 <v-flex xs8 class="ml-3"> 1683 <v-flex xs8 class="ml-3">
1683 <v-text-field 1684 <v-text-field
1684 v-model="addStudents.height" 1685 v-model="addStudents.height"
1685 placeholder="Fill your Height" 1686 placeholder="Fill your Height"
1686 required 1687 required
1687 ></v-text-field> 1688 ></v-text-field>
1688 </v-flex> 1689 </v-flex>
1689 </v-layout> 1690 </v-layout>
1690 </v-flex> 1691 </v-flex>
1691 <v-flex xs12 sm6> 1692 <v-flex xs12 sm6>
1692 <v-layout> 1693 <v-layout>
1693 <v-flex xs4 class="pt-4 subheading"> 1694 <v-flex xs4 class="pt-4 subheading">
1694 <label class="right">Weight:</label> 1695 <label class="right">Weight:</label>
1695 </v-flex> 1696 </v-flex>
1696 <v-flex xs8 class="ml-3"> 1697 <v-flex xs8 class="ml-3">
1697 <v-text-field 1698 <v-text-field
1698 v-model="addStudents.weight" 1699 v-model="addStudents.weight"
1699 placeholder="Fill your Weight" 1700 placeholder="Fill your Weight"
1700 required 1701 required
1701 ></v-text-field> 1702 ></v-text-field>
1702 </v-flex> 1703 </v-flex>
1703 </v-layout> 1704 </v-layout>
1704 </v-flex> 1705 </v-flex>
1705 </v-layout> 1706 </v-layout>
1706 <v-layout wrap> 1707 <v-layout wrap>
1707 <v-flex xs12 sm6> 1708 <v-flex xs12 sm6>
1708 <v-layout> 1709 <v-layout>
1709 <v-flex xs4 class="pt-4 subheading"> 1710 <v-flex xs4 class="pt-4 subheading">
1710 <label class="right hidden-xs-only hidden-sm-only">Uplaod Image:</label> 1711 <label class="right hidden-xs-only hidden-sm-only">Uplaod Image:</label>
1711 <label 1712 <label
1712 class="right hidden-lg-only hidden-md-only hidden-xl-only" 1713 class="right hidden-lg-only hidden-md-only hidden-xl-only"
1713 >Uplaod :</label> 1714 >Uplaod :</label>
1714 </v-flex> 1715 </v-flex>
1715 <v-flex xs8 class="ml-3"> 1716 <v-flex xs8 class="ml-3">
1716 <v-text-field 1717 <v-text-field
1717 label="Select Image" 1718 label="Select Image"
1718 @click="pickFile" 1719 @click="pickFile"
1719 v-model="imageName" 1720 v-model="imageName"
1720 append-icon="attach_file" 1721 append-icon="attach_file"
1721 ></v-text-field> 1722 ></v-text-field>
1722 </v-flex> 1723 </v-flex>
1723 </v-layout> 1724 </v-layout>
1724 </v-flex> 1725 </v-flex>
1725 <v-flex xs12 sm6> 1726 <v-flex xs12 sm6>
1726 <v-layout> 1727 <v-layout>
1727 <v-flex xs4 class="pt-4 subheading"> 1728 <v-flex xs4 class="pt-4 subheading">
1728 <label class="right hidden-xs-only hidden-sm-only">Academic Year:</label> 1729 <label class="right hidden-xs-only hidden-sm-only">Academic Year:</label>
1729 <label 1730 <label
1730 class="right hidden-lg-only hidden-md-only hidden-xl-only" 1731 class="right hidden-lg-only hidden-md-only hidden-xl-only"
1731 >Year:</label> 1732 >Year:</label>
1732 </v-flex> 1733 </v-flex>
1733 <v-flex xs8 class="ml-3"> 1734 <v-flex xs8 class="ml-3">
1734 <v-text-field 1735 <v-text-field
1735 v-model="addStudents.establishmentYear" 1736 v-model="addStudents.establishmentYear"
1736 placeholder="fill your Academic Year" 1737 placeholder="fill your Academic Year"
1737 name="state" 1738 name="state"
1738 type="number" 1739 type="number"
1739 :rules="establishmentYearRules" 1740 :rules="establishmentYearRules"
1740 required 1741 required
1741 ></v-text-field> 1742 ></v-text-field>
1742 </v-flex> 1743 </v-flex>
1743 </v-layout> 1744 </v-layout>
1744 </v-flex> 1745 </v-flex>
1745 </v-layout> 1746 </v-layout>
1746 <v-layout wrap class="hidden-xs-only hidden-sm-only"> 1747 <v-layout wrap class="hidden-xs-only hidden-sm-only">
1747 <v-flex xs12 sm6> 1748 <v-flex xs12 sm6>
1748 <v-layout> 1749 <v-layout>
1749 <v-flex xs4 sm4 class="pt-4 subheading"> 1750 <v-flex xs4 sm4 class="pt-4 subheading">
1750 <label class="right">Present Address:</label> 1751 <label class="right">Present Address:</label>
1751 </v-flex> 1752 </v-flex>
1752 <v-flex xs8 sm8 class="ml-3"> 1753 <v-flex xs8 sm8 class="ml-3">
1753 <v-text-field 1754 <v-text-field
1754 v-model="addStudents.presentAddress" 1755 v-model="addStudents.presentAddress"
1755 :rules="presentAddress" 1756 :rules="presentAddress"
1756 placeholder="fill Your present Address" 1757 placeholder="fill Your present Address"
1757 @keyup="copyData" 1758 @keyup="copyData"
1758 ></v-text-field> 1759 ></v-text-field>
1759 </v-flex> 1760 </v-flex>
1760 </v-layout> 1761 </v-layout>
1761 </v-flex> 1762 </v-flex>
1762 <v-flex xs12 sm6> 1763 <v-flex xs12 sm6>
1763 <v-layout> 1764 <v-layout>
1764 <v-flex xs4 sm4 class="pt-4 subheading addressForm"> 1765 <v-flex xs4 sm4 class="pt-4 subheading addressForm">
1765 <label class="right">Permanent Address:</label> 1766 <label class="right">Permanent Address:</label>
1766 </v-flex> 1767 </v-flex>
1767 <v-flex xs12 sm8 class="ml-3"> 1768 <v-flex xs12 sm8 class="ml-3">
1768 <v-switch 1769 <v-switch
1769 v-model="addStudents.permanentAddress" 1770 v-model="addStudents.permanentAddress"
1770 label="Select Permanent Address" 1771 label="Select Permanent Address"
1771 :value="addStudents.presentAddress" 1772 :value="addStudents.presentAddress"
1772 ></v-switch> 1773 ></v-switch>
1773 </v-flex> 1774 </v-flex>
1774 </v-layout> 1775 </v-layout>
1775 </v-flex> 1776 </v-flex>
1776 </v-layout> 1777 </v-layout>
1777 <v-layout class="hidden-xs-only hidden-sm-only"> 1778 <v-layout class="hidden-xs-only hidden-sm-only">
1778 <v-flex xs12 sm6> 1779 <v-flex xs12 sm6>
1779 <v-layout> 1780 <v-layout>
1780 <v-flex xs4 sm4 class="pt-4 subheading addressForm"> 1781 <v-flex xs4 sm4 class="pt-4 subheading addressForm">
1781 <label class="right">Permanent Address:</label> 1782 <label class="right">Permanent Address:</label>
1782 </v-flex> 1783 </v-flex>
1783 <v-flex xs12 sm8 class="ml-3"> 1784 <v-flex xs12 sm8 class="ml-3">
1784 <v-text-field 1785 <v-text-field
1785 v-model="addStudents.permanentAddress" 1786 v-model="addStudents.permanentAddress"
1786 :rules="permanentAddress" 1787 :rules="permanentAddress"
1787 placeholder="fill Your Permanent Address" 1788 placeholder="fill Your Permanent Address"
1788 ></v-text-field> 1789 ></v-text-field>
1789 </v-flex> 1790 </v-flex>
1790 </v-layout> 1791 </v-layout>
1791 </v-flex> 1792 </v-flex>
1792 </v-layout> 1793 </v-layout>
1793 <v-layout class="hidden-lg-only hidden-md-only hidden-xl-only" wrap> 1794 <v-layout class="hidden-lg-only hidden-md-only hidden-xl-only" wrap>
1794 <v-flex xs12 sm12> 1795 <v-flex xs12 sm12>
1795 <v-layout> 1796 <v-layout>
1796 <v-flex xs12 sm12 class="pt-4 subheading text-xs-center"> 1797 <v-flex xs12 sm12 class="pt-4 subheading text-xs-center">
1797 <label class>Present Address:</label> 1798 <label class>Present Address:</label>
1798 </v-flex> 1799 </v-flex>
1799 </v-layout> 1800 </v-layout>
1800 <v-layout> 1801 <v-layout>
1801 <v-flex xs12 sm12> 1802 <v-flex xs12 sm12>
1802 <v-textarea 1803 <v-textarea
1803 name="input-4-3" 1804 name="input-4-3"
1804 v-model="addStudents.presentAddress" 1805 v-model="addStudents.presentAddress"
1805 :rules="presentAddress" 1806 :rules="presentAddress"
1806 placeholder="fill Your present Address" 1807 placeholder="fill Your present Address"
1807 required 1808 required
1808 ></v-textarea> 1809 ></v-textarea>
1809 </v-flex> 1810 </v-flex>
1810 </v-layout> 1811 </v-layout>
1811 </v-flex> 1812 </v-flex>
1812 <v-flex xs12 sm12> 1813 <v-flex xs12 sm12>
1813 <v-layout> 1814 <v-layout>
1814 <v-flex 1815 <v-flex
1815 xs12 1816 xs12
1816 sm12 1817 sm12
1817 class="pt-4 pr-4 subheading text-xs-center addressForm" 1818 class="pt-4 pr-4 subheading text-xs-center addressForm"
1818 > 1819 >
1819 <label>Permanent Address:</label> 1820 <label>Permanent Address:</label>
1820 </v-flex> 1821 </v-flex>
1821 </v-layout> 1822 </v-layout>
1822 <v-layout> 1823 <v-layout>
1823 <v-flex xs12 sm12> 1824 <v-flex xs12 sm12>
1824 <v-textarea 1825 <v-textarea
1825 name="input-4-3" 1826 name="input-4-3"
1826 v-model="addStudents.permanentAddress" 1827 v-model="addStudents.permanentAddress"
1827 :rules="permanentAddress" 1828 :rules="permanentAddress"
1828 placeholder="fill Your Permanent Address" 1829 placeholder="fill Your Permanent Address"
1829 required 1830 required
1830 ></v-textarea> 1831 ></v-textarea>
1831 </v-flex> 1832 </v-flex>
1832 </v-layout> 1833 </v-layout>
1833 </v-flex> 1834 </v-flex>
1834 </v-layout> 1835 </v-layout>
1835 <v-layout> 1836 <v-layout>
1836 <v-flex xs12 sm12> 1837 <v-flex xs12 sm12>
1837 <v-layout class="right"> 1838 <v-layout class="right">
1838 <!-- <v-flex xs6> --> 1839 <!-- <v-flex xs6> -->
1839 <v-btn round dark @click="e2 = 1" class="clear-button">Back</v-btn> 1840 <v-btn round dark @click="e2 = 1" class="clear-button">Back</v-btn>
1840 <!-- </v-flex> 1841 <!-- </v-flex>
1841 <v-flex xs6>--> 1842 <v-flex xs6>-->
1842 <v-btn 1843 <v-btn
1843 @click="submit" 1844 @click="submit"
1844 round 1845 round
1845 dark 1846 dark
1846 :loading="loading" 1847 :loading="loading"
1847 class="add-button" 1848 class="add-button"
1848 >Add</v-btn> 1849 >Add</v-btn>
1849 <!-- </v-flex> --> 1850 <!-- </v-flex> -->
1850 </v-layout> 1851 </v-layout>
1851 </v-flex> 1852 </v-flex>
1852 </v-layout> 1853 </v-layout>
1853 </v-form> 1854 </v-form>
1854 </v-flex> 1855 </v-flex>
1855 </v-stepper-content> 1856 </v-stepper-content>
1856 </v-stepper-items> 1857 </v-stepper-items>
1857 </v-stepper> 1858 </v-stepper>
1858 </v-flex> 1859 </v-flex>
1859 </v-layout> 1860 </v-layout>
1860 </v-container> 1861 </v-container>
1861 </v-card> 1862 </v-card>
1862 </v-dialog> 1863 </v-dialog>
1863 <v-snackbar 1864 <v-snackbar
1864 :timeout="timeout" 1865 :timeout="timeout"
1865 :top="y === 'top'" 1866 :top="y === 'top'"
1866 :right="x === 'right'" 1867 :right="x === 'right'"
1867 :vertical="mode === 'vertical'" 1868 :vertical="mode === 'vertical'"
1868 v-model="snackbar" 1869 v-model="snackbar"
1869 :color="color" 1870 :color="color"
1870 >{{ text }}</v-snackbar> 1871 >{{ text }}</v-snackbar>
1871 <div class="loader" v-if="showLoader"> 1872 <div class="loader" v-if="showLoader">
1872 <v-progress-circular indeterminate color="white"></v-progress-circular> 1873 <v-progress-circular indeterminate color="white"></v-progress-circular>
1873 </div> 1874 </div>
1874 </v-container> 1875 </v-container>
1875 </template> 1876 </template>
1876 1877
1877 <script> 1878 <script>
1878 import http from "@/Services/http.js"; 1879 import http from "@/Services/http.js";
1879 import moment from "moment"; 1880 import moment from "moment";
1880 import countryList from "@/script/country.js"; 1881 import countryList from "@/script/country.js";
1881 import parent from "@/script/parents.js"; 1882 import parent from "@/script/parents.js";
1882 1883
1883 export default { 1884 export default {
1884 data: () => ({ 1885 data: () => ({
1885 e1: true, 1886 e1: true,
1886 e2: 0, 1887 e2: 0,
1887 showParent: true, 1888 showParent: true,
1888 showNext: false, 1889 showNext: false,
1889 snackbar: false, 1890 snackbar: false,
1890 y: "top", 1891 y: "top",
1891 x: "right", 1892 x: "right",
1892 mode: "", 1893 mode: "",
1893 timeout: 3000, 1894 timeout: 3000,
1894 text: "", 1895 text: "",
1895 show: true, 1896 show: true,
1896 color: "", 1897 color: "",
1897 showSearch: false, 1898 showSearch: false,
1898 showLoader: false, 1899 showLoader: false,
1899 loading: false, 1900 loading: false,
1900 editLoading: false, 1901 editLoading: false,
1901 date: null, 1902 date: null,
1902 search: "", 1903 search: "",
1903 password: "", 1904 password: "",
1904 menu: false, 1905 menu: false,
1905 menu1: false, 1906 menu1: false,
1906 editStudentDialog: false, 1907 editStudentDialog: false,
1907 profileStudentDialog: false, 1908 profileStudentDialog: false,
1908 addStudentDialog: false, 1909 addStudentDialog: false,
1909 valid: true, 1910 valid: true,
1910 addclass: [], 1911 addclass: [],
1911 addSection: [], 1912 addSection: [],
1912 gender: ["Male", "Female"], 1913 gender: ["Male", "Female"],
1913 pagination: { 1914 pagination: {
1914 rowsPerPage: 10 1915 rowsPerPage: 10
1915 }, 1916 },
1916 imageData: {}, 1917 imageData: {},
1917 imageName: "", 1918 imageName: "",
1918 imageUrl: "", 1919 imageUrl: "",
1919 imageFile: "", 1920 imageFile: "",
1920 editImageName: "", 1921 editImageName: "",
1921 editImageUrl: "", 1922 editImageUrl: "",
1922 nameRules: [v => !!v || " Full Name is required"], 1923 nameRules: [v => !!v || " Full Name is required"],
1923 dateRules: [v => !!v || " DOB is required"], 1924 dateRules: [v => !!v || " DOB is required"],
1924 cityRules: [v => !!v || " City Name is required"], 1925 cityRules: [v => !!v || " City Name is required"],
1925 pincode: [v => !!v || " Pincode is required"], 1926 pincode: [v => !!v || " Pincode is required"],
1926 country: [v => !!v || " Country Name is required"], 1927 country: [v => !!v || " Country Name is required"],
1927 rollNo: [v => !!v || "Roll No is required"], 1928 rollNo: [v => !!v || "Roll No is required"],
1928 permanentAddress: [v => !!v || " Permanent Address is required"], 1929 permanentAddress: [v => !!v || " Permanent Address is required"],
1929 presentAddress: [v => !!v || " Present Address is required"], 1930 presentAddress: [v => !!v || " Present Address is required"],
1930 stateRules: [v => !!v || "State Name is required"], 1931 stateRules: [v => !!v || "State Name is required"],
1931 classRules: [v => !!v || " Class Name is required"], 1932 classRules: [v => !!v || " Class Name is required"],
1932 sectionRules: [v => !!v || " Section Name is required"], 1933 sectionRules: [v => !!v || " Section Name is required"],
1933 genderRules: [v => !!v || " Select Gender is required"], 1934 genderRules: [v => !!v || " Select Gender is required"],
1934 fatheCellNoRules: [ 1935 fatheCellNoRules: [
1935 v => !!v || " father Cell Number is required", 1936 v => !!v || " father Cell Number is required",
1936 v => v <= 10000000000 || "Max 10 characters is required" 1937 v => v <= 10000000000 || "Max 10 characters is required"
1937 ], 1938 ],
1938 password: [ 1939 password: [
1939 v => !!v || "Password field is Required.", 1940 v => !!v || "Password field is Required.",
1940 // v => (/^(?=.*[a-z])(?=.*[0-9])(?=.*[!@#$%^&*])(?=.{8,})/).test(v) && v.length >= 8 1941 // v => (/^(?=.*[a-z])(?=.*[0-9])(?=.*[!@#$%^&*])(?=.{8,})/).test(v) && v.length >= 8
1941 ], 1942 ],
1942 mobileNoRule: [v => !!v || " Mobile Number is required"], 1943 mobileNoRule: [v => !!v || " Mobile Number is required"],
1943 establishmentYearRules: [v => !!v || " Academic Year is required"], 1944 establishmentYearRules: [v => !!v || " Academic Year is required"],
1944 errorMessages: "", 1945 errorMessages: "",
1945 countries: [], 1946 countries: [],
1946 headers: [ 1947 headers: [
1947 { 1948 {
1948 text: "Roll No.", 1949 text: "Roll No.",
1949 align: "center", 1950 align: "center",
1950 sortable: false, 1951 sortable: false,
1951 value: "rollNo" 1952 value: "rollNo"
1952 }, 1953 },
1953 { 1954 {
1954 text: "Profile Pic", 1955 text: "Profile Pic",
1955 value: "profilePicUrl", 1956 value: "profilePicUrl",
1956 sortable: false, 1957 sortable: false,
1957 align: "center" 1958 align: "center"
1958 }, 1959 },
1959 { text: "Name", value: "name", sortable: false, align: "center" }, 1960 { text: "Name", value: "name", sortable: false, align: "center" },
1960 { text: "Gender", value: "gender", sortable: false, align: "center" }, 1961 { text: "Gender", value: "gender", sortable: false, align: "center" },
1961 { 1962 {
1962 text: "Father Name", 1963 text: "Father Name",
1963 value: "fatherName", 1964 value: "fatherName",
1964 sortable: false, 1965 sortable: false,
1965 align: "center" 1966 align: "center"
1966 }, 1967 },
1967 { 1968 {
1968 text: "Mother Name", 1969 text: "Mother Name",
1969 value: "motherName", 1970 value: "motherName",
1970 sortable: false, 1971 sortable: false,
1971 align: "center" 1972 align: "center"
1972 }, 1973 },
1973 { 1974 {
1974 text: "Academic Year", 1975 text: "Academic Year",
1975 value: "establishmentYear", 1976 value: "establishmentYear",
1976 sortable: false, 1977 sortable: false,
1977 align: "center" 1978 align: "center"
1978 }, 1979 },
1979 { text: "Mobile No", value: "mobile", sortable: false, align: "center" }, 1980 // { text: "Mobile No", value: "mobile", sortable: false, align: "center" },
1980 { 1981 {
1981 text: "Status", 1982 text: "Status",
1982 value: "status", 1983 value: "status",
1983 sortable: false, 1984 sortable: false,
1984 align: "center" 1985 align: "center"
1985 }, 1986 },
1986 { text: "Action", value: "", sortable: false, align: "center" } 1987 { text: "Action", value: "", sortable: false, align: "center" }
1987 ], 1988 ],
1988 studentsData: [], 1989 studentsData: [],
1989 parentId: "", 1990 parentId: "",
1990 editedIndex: -1, 1991 editedIndex: -1,
1991 parentData: {}, 1992 parentData: {},
1992 addStudents: { 1993 addStudents: {
1993 role: "STUDENT", 1994 role: "STUDENT",
1994 name: "", 1995 name: "",
1995 email: "", 1996 email: "",
1996 date: "", 1997 date: "",
1997 city: "", 1998 city: "",
1998 pincode: "", 1999 pincode: "",
1999 country: "", 2000 country: "",
2000 permanentAddress: "", 2001 permanentAddress: "",
2001 presentAddress: "", 2002 presentAddress: "",
2002 mobile: "", 2003 mobile: "",
2003 state: "", 2004 state: "",
2004 gender: "", 2005 gender: "",
2005 select: "", 2006 select: "",
2006 selectSection: "", 2007 selectSection: "",
2007 bloodGroup: "", 2008 bloodGroup: "",
2008 allergies: "", 2009 allergies: "",
2009 medicalNotes: "", 2010 medicalNotes: "",
2010 height: "", 2011 height: "",
2011 weight: "", 2012 weight: "",
2012 rollNo: "", 2013 rollNo: "",
2013 establishmentYear: new Date().getFullYear() 2014 establishmentYear: new Date().getFullYear()
2014 }, 2015 },
2015 selectStudents: { 2016 selectStudents: {
2016 select: "", 2017 select: "",
2017 selectSection: "" 2018 selectSection: ""
2018 }, 2019 },
2019 editedItem: { 2020 editedItem: {
2020 role: "STUDENT", 2021 role: "STUDENT",
2021 name: "", 2022 name: "",
2022 email: "", 2023 email: "",
2023 dob: "", 2024 dob: "",
2024 city: "", 2025 city: "",
2025 pincode: "", 2026 pincode: "",
2026 country: "", 2027 country: "",
2027 permanentAddress: "", 2028 permanentAddress: "",
2028 presentAddress: "", 2029 presentAddress: "",
2029 mobile: "", 2030 mobile: "",
2030 state: "", 2031 state: "",
2031 gender: "", 2032 gender: "",
2032 select: "", 2033 select: "",
2033 selectSection: "", 2034 selectSection: "",
2034 bloodGroup: "", 2035 bloodGroup: "",
2035 allergies: "", 2036 allergies: "",
2036 medicalNotes: "", 2037 medicalNotes: "",
2037 height: "", 2038 height: "",
2038 weight: "", 2039 weight: "",
2039 rollNo: "", 2040 rollNo: "",
2040 establishmentYear: new Date().getFullYear() 2041 establishmentYear: new Date().getFullYear()
2041 } 2042 }
2042 }), 2043 }),
2043 watch: { 2044 watch: {
2044 menu(val) { 2045 menu(val) {
2045 val && this.$nextTick(() => (this.$refs.picker.activePicker = "YEAR")); 2046 val && this.$nextTick(() => (this.$refs.picker.activePicker = "YEAR"));
2046 }, 2047 },
2047 menu1(val) { 2048 menu1(val) {
2048 val && this.$nextTick(() => (this.$refs.picker.activePicker = "YEAR")); 2049 val && this.$nextTick(() => (this.$refs.picker.activePicker = "YEAR"));
2049 } 2050 }
2050 }, 2051 },
2051 methods: { 2052 methods: {
2052 findStudents() { 2053 findStudents() {
2053 this.showLoader = true; 2054 this.showLoader = true;
2054 http() 2055 http()
2055 .get("/getStudentWithClass", { 2056 .get("/getStudentWithClass", {
2056 params: { 2057 params: {
2057 classId: this.selectStudents.select, 2058 classId: this.selectStudents.select,
2058 sectionId: this.selectStudents.selectSection 2059 sectionId: this.selectStudents.selectSection
2059 } 2060 }
2060 }) 2061 })
2061 .then(response => { 2062 .then(response => {
2062 this.studentsData = response.data.data; 2063 this.studentsData = response.data.data;
2063 this.showLoader = false; 2064 this.showLoader = false;
2064 }) 2065 })
2065 .catch(err => { 2066 .catch(err => {
2066 console.log("err====>", err); 2067 console.log("err====>", err);
2067 this.showLoader = false; 2068 this.showLoader = false;
2068 }); 2069 });
2069 }, 2070 },
2070 getSections(_id) { 2071 getSections(_id) {
2071 var token = this.$store.state.token; 2072 var token = this.$store.state.token;
2072 this.showLoader = true; 2073 this.showLoader = true;
2073 http() 2074 http()
2074 .get( 2075 .get(
2075 "/getSectionsList", 2076 "/getSectionsList",
2076 { params: { classId: _id } }, 2077 { params: { classId: _id } },
2077 { 2078 {
2078 headers: { Authorization: "Bearer " + token } 2079 headers: { Authorization: "Bearer " + token }
2079 } 2080 }
2080 ) 2081 )
2081 .then(response => { 2082 .then(response => {
2082 this.addSection = response.data.data; 2083 this.addSection = response.data.data;
2083 this.showLoader = false; 2084 this.showLoader = false;
2084 }) 2085 })
2085 .catch(err => { 2086 .catch(err => {
2086 this.showLoader = false; 2087 this.showLoader = false;
2087 }); 2088 });
2088 }, 2089 },
2089 getSection(_id) { 2090 getSection(_id) {
2090 var token = this.$store.state.token; 2091 var token = this.$store.state.token;
2091 this.showLoader = true; 2092 this.showLoader = true;
2092 http() 2093 http()
2093 .get( 2094 .get(
2094 "/getSectionsList", 2095 "/getSectionsList",
2095 { params: { classId: _id } }, 2096 { params: { classId: _id } },
2096 { 2097 {
2097 headers: { Authorization: "Bearer " + token } 2098 headers: { Authorization: "Bearer " + token }
2098 } 2099 }
2099 ) 2100 )
2100 .then(response => { 2101 .then(response => {
2101 this.addSection = response.data.data; 2102 this.addSection = response.data.data;
2102 this.showLoader = false; 2103 this.showLoader = false;
2103 }) 2104 })
2104 .catch(err => { 2105 .catch(err => {
2105 this.showLoader = false; 2106 this.showLoader = false;
2106 }); 2107 });
2107 }, 2108 },
2108 pickFile() { 2109 pickFile() {
2109 this.$refs.image.click(); 2110 this.$refs.image.click();
2110 }, 2111 },
2111 pickEditFile() { 2112 pickEditFile() {
2112 this.$refs.editDataImage.click(); 2113 this.$refs.editDataImage.click();
2113 }, 2114 },
2114 dates: function(date) { 2115 dates: function(date) {
2115 return moment(date).format("MMMM DD, YYYY"); 2116 return moment(date).format("MMM DD, YYYY");
2116 }, 2117 },
2117 onFilePicked(e) { 2118 onFilePicked(e) {
2118 // console.log(e) 2119 // console.log(e)
2119 const files = e.target.files; 2120 const files = e.target.files;
2120 this.imageData.upload = e.target.files[0]; 2121 this.imageData.upload = e.target.files[0];
2121 if (files[0] !== undefined) { 2122 if (files[0] !== undefined) {
2122 this.imageName = files[0].name; 2123 this.imageName = files[0].name;
2123 if (this.imageName.lastIndexOf(".") <= 0) { 2124 if (this.imageName.lastIndexOf(".") <= 0) {
2124 return; 2125 return;
2125 } 2126 }
2126 const fr = new FileReader(); 2127 const fr = new FileReader();
2127 fr.readAsDataURL(files[0]); 2128 fr.readAsDataURL(files[0]);
2128 fr.addEventListener("load", () => { 2129 fr.addEventListener("load", () => {
2129 this.imageUrl = fr.result; 2130 this.imageUrl = fr.result;
2130 this.imageFile = files[0]; // this is an image file that can be sent to server... 2131 this.imageFile = files[0]; // this is an image file that can be sent to server...
2131 this.imageData.imageUrl = URL.createObjectURL(this.imageFile); 2132 this.imageData.imageUrl = URL.createObjectURL(this.imageFile);
2132 }); 2133 });
2133 } else { 2134 } else {
2134 this.imageName = ""; 2135 this.imageName = "";
2135 this.imageFile = ""; 2136 this.imageFile = "";
2136 this.imageUrl = ""; 2137 this.imageUrl = "";
2137 } 2138 }
2138 }, 2139 },
2139 onEditFilePicked(e) { 2140 onEditFilePicked(e) {
2140 console.log(e); 2141 console.log(e);
2141 const files = e.target.files; 2142 const files = e.target.files;
2142 if (files[0] !== undefined) { 2143 if (files[0] !== undefined) {
2143 this.editImageName = files[0].name; 2144 this.editImageName = files[0].name;
2144 console.log("this.editImageName", this.editImageName); 2145 console.log("this.editImageName", this.editImageName);
2145 2146
2146 if (this.editImageName.lastIndexOf(".") <= 0) { 2147 if (this.editImageName.lastIndexOf(".") <= 0) {
2147 return; 2148 return;
2148 } 2149 }
2149 const fr = new FileReader(); 2150 const fr = new FileReader();
2150 fr.readAsDataURL(files[0]); 2151 fr.readAsDataURL(files[0]);
2151 fr.addEventListener("load", () => { 2152 fr.addEventListener("load", () => {
2152 this.editImageUrl = fr.result; 2153 this.editImageUrl = fr.result;
2153 this.editiImageFile = files[0]; // this is an image file that can be sent to server... 2154 this.editiImageFile = files[0]; // this is an image file that can be sent to server...
2154 }); 2155 });
2155 } else { 2156 } else {
2156 this.editImageName = ""; 2157 this.editImageName = "";
2157 this.editiImageFile = ""; 2158 this.editiImageFile = "";
2158 } 2159 }
2159 }, 2160 },
2160 editItem(item) { 2161 editItem(item) {
2161 this.editedIndex = this.studentsData.indexOf(item); 2162 this.editedIndex = this.studentsData.indexOf(item);
2162 this.editedItem = Object.assign({}, item); 2163 this.editedItem = Object.assign({}, item);
2163 this.editedItem.fatherName = item.parentId.fatherName; 2164 this.editedItem.fatherName = item.parentId.fatherName;
2164 this.editedItem.fatherCellNo = item.parentId.fatherCellNo; 2165 this.editedItem.fatherCellNo = item.parentId.fatherCellNo;
2165 this.editedItem.motherName = item.parentId.motherName; 2166 this.editedItem.motherName = item.parentId.motherName;
2166 this.editedItem.motherCellNo = item.parentId.motherCellNo; 2167 this.editedItem.motherCellNo = item.parentId.motherCellNo;
2167 this.editedItem.dob = 2168 this.editedItem.dob =
2168 this.editedItem.dob != undefined 2169 this.editedItem.dob != undefined
2169 ? (this.editedItem.dob = this.editedItem.dob.substring(0, 10)) 2170 ? (this.editedItem.dob = this.editedItem.dob.substring(0, 10))
2170 : (this.editedItem.dob = ""); 2171 : (this.editedItem.dob = "");
2171 this.editStudentDialog = true; 2172 this.editStudentDialog = true;
2172 }, 2173 },
2173 profile(item) { 2174 profile(item) {
2174 this.editedIndex = this.studentsData.indexOf(item); 2175 this.editedIndex = this.studentsData.indexOf(item);
2175 this.editedItem = Object.assign({}, item); 2176 this.editedItem = Object.assign({}, item);
2176 this.editedItem.fatherName = item.parentId.fatherName; 2177 this.editedItem.fatherName = item.parentId.fatherName;
2177 this.editedItem.fatherCellNo = item.parentId.fatherCellNo; 2178 this.editedItem.fatherCellNo = item.parentId.fatherCellNo;
2178 this.editedItem.motherName = item.parentId.motherName; 2179 this.editedItem.motherName = item.parentId.motherName;
2179 this.editedItem.motherCellNo = item.parentId.motherCellNo; 2180 this.editedItem.motherCellNo = item.parentId.motherCellNo;
2180 2181
2181 this.profileStudentDialog = true; 2182 this.profileStudentDialog = true;
2182 }, 2183 },
2183 deleteItem(item) { 2184 deleteItem(item) {
2184 let deleteStudent = { 2185 let deleteStudent = {
2185 studentId: item._id 2186 studentId: item._id
2186 }; 2187 };
2187 http() 2188 http()
2188 .delete( 2189 .delete(
2189 "/deleteStudent", 2190 "/deleteStudent",
2190 confirm("Are you sure you want to delete this?") && { 2191 confirm("Are you sure you want to delete this?") && {
2191 params: deleteStudent 2192 params: deleteStudent
2192 } 2193 }
2193 ) 2194 )
2194 .then(response => { 2195 .then(response => {
2195 this.snackbar = true; 2196 this.snackbar = true;
2196 this.text = response.data.message; 2197 this.text = response.data.message;
2197 this.color = "green"; 2198 this.color = "green";
2198 this.findStudents(); 2199 this.findStudents();
2199 }) 2200 })
2200 .catch(error => { 2201 .catch(error => {
2201 this.snackbar = true; 2202 this.snackbar = true;
2202 this.text = error.response.data.message; 2203 this.text = error.response.data.message;
2203 this.color = "error"; 2204 this.color = "error";
2204 }); 2205 });
2205 }, 2206 },
2206 close() { 2207 close() {
2207 this.editStudentDialog = false; 2208 this.editStudentDialog = false;
2208 }, 2209 },
2209 closeStudentProfile() { 2210 closeStudentProfile() {
2210 this.profileStudentDialog = false; 2211 this.profileStudentDialog = false;
2211 }, 2212 },
2212 copyData() { 2213 copyData() {
2213 this.addStudents.permanentAddress = this.addStudents.presentAddress; 2214 this.addStudents.permanentAddress = this.addStudents.presentAddress;
2214 }, 2215 },
2215 submit() { 2216 submit() {
2216 if (this.$refs.form.validate()) { 2217 if (this.$refs.form.validate()) {
2217 let addStudent = { 2218 let addStudent = {
2218 parentId: this.parentId, 2219 parentId: this.parentId,
2219 name: this.addStudents.name, 2220 name: this.addStudents.name,
2220 email: this.addStudents.email, 2221 email: this.addStudents.email,
2221 role: this.addStudents.role, 2222 role: this.addStudents.role,
2222 dob: this.addStudents.date, 2223 dob: this.addStudents.date,
2223 city: this.addStudents.city, 2224 city: this.addStudents.city,
2224 pincode: this.addStudents.pincode, 2225 pincode: this.addStudents.pincode,
2225 country: this.addStudents.country, 2226 country: this.addStudents.country,
2226 permanentAddress: this.addStudents.permanentAddress, 2227 permanentAddress: this.addStudents.permanentAddress,
2227 presentAddress: this.addStudents.presentAddress, 2228 presentAddress: this.addStudents.presentAddress,
2228 mobile: this.addStudents.mobile, 2229 mobile: this.addStudents.mobile,
2229 state: this.addStudents.state, 2230 state: this.addStudents.state,
2230 gender: this.addStudents.gender, 2231 gender: this.addStudents.gender,
2231 establishmentYear: this.addStudents.establishmentYear, 2232 establishmentYear: this.addStudents.establishmentYear,
2232 classId: this.addStudents.select, 2233 classId: this.addStudents.select,
2233 sectionId: this.addStudents.selectSection, 2234 sectionId: this.addStudents.selectSection,
2234 bloodGroup: this.addStudents.bloodGroup, 2235 bloodGroup: this.addStudents.bloodGroup,
2235 medicalNotes: this.addStudents.medicalNotes, 2236 medicalNotes: this.addStudents.medicalNotes,
2236 height: this.addStudents.height, 2237 height: this.addStudents.height,
2237 weight: this.addStudents.weight, 2238 weight: this.addStudents.weight,
2238 rollNo: this.addStudents.rollNo 2239 rollNo: this.addStudents.rollNo
2239 }; 2240 };
2240 if (this.imageUrl) { 2241 if (this.imageUrl) {
2241 var str = this.imageUrl; 2242 var str = this.imageUrl;
2242 const [baseUrl, imageUrl] = str.split(/,/); 2243 const [baseUrl, imageUrl] = str.split(/,/);
2243 addStudent.upload = imageUrl; 2244 addStudent.upload = imageUrl;
2244 } 2245 }
2245 this.loading = true; 2246 this.loading = true;
2246 http() 2247 http()
2247 .post("/createStudent", addStudent) 2248 .post("/createStudent", addStudent)
2248 .then(response => { 2249 .then(response => {
2249 this.snackbar = true; 2250 this.snackbar = true;
2250 this.text = "New Student added successfully"; 2251 this.text = "New Student added successfully";
2251 this.color = "green"; 2252 this.color = "green";
2252 this.addStudentDialog = false; 2253 this.addStudentDialog = false;
2253 this.clear(); 2254 this.clear();
2254 this.clearParents(); 2255 this.clearParents();
2255 this.loading = false; 2256 this.loading = false;
2256 }) 2257 })
2257 .catch(error => { 2258 .catch(error => {
2258 this.snackbar = true; 2259 this.snackbar = true;
2259 this.text = error.response.data.message; 2260 this.text = error.response.data.message;
2260 this.color = "error"; 2261 this.color = "error";
2261 this.loading = false; 2262 this.loading = false;
2262 }); 2263 });
2263 } 2264 }
2264 }, 2265 },
2265 clear() { 2266 clear() {
2266 this.$refs.form.reset(); 2267 this.$refs.form.reset();
2267 this.imageUrl = ""; 2268 this.imageUrl = "";
2268 }, 2269 },
2269 clearParents() { 2270 clearParents() {
2270 this.$refs.parentForm.reset(); 2271 this.$refs.parentForm.reset();
2271 }, 2272 },
2272 save() { 2273 save() {
2273 let editStudent = { 2274 let editStudent = {
2274 studentId: this.editedItem._id, 2275 studentId: this.editedItem._id,
2275 name: this.editedItem.name, 2276 name: this.editedItem.name,
2276 email: this.editedItem.email, 2277 email: this.editedItem.email,
2277 role: this.editedItem.role, 2278 role: this.editedItem.role,
2278 dob: this.editedItem.dob, 2279 dob: this.editedItem.dob,
2279 city: this.editedItem.city, 2280 city: this.editedItem.city,
2280 pincode: this.editedItem.pincode, 2281 pincode: this.editedItem.pincode,
2281 country: this.editedItem.country, 2282 country: this.editedItem.country,
2282 permanentAddress: this.editedItem.permanentAddress, 2283 permanentAddress: this.editedItem.permanentAddress,
2283 presentAddress: this.editedItem.presentAddress, 2284 presentAddress: this.editedItem.presentAddress,
2284 mobile: this.editedItem.mobile, 2285 mobile: this.editedItem.mobile,
2285 state: this.editedItem.state, 2286 state: this.editedItem.state,
2286 gender: this.editedItem.gender, 2287 gender: this.editedItem.gender,
2287 establishmentYear: this.editedItem.establishmentYear, 2288 establishmentYear: this.editedItem.establishmentYear,
2288 classId: this.editedItem.select, 2289 classId: this.editedItem.select,
2289 sectionId: this.editedItem.selectSection, 2290 sectionId: this.editedItem.selectSection,
2290 bloodGroup: this.editedItem.bloodGroup, 2291 bloodGroup: this.editedItem.bloodGroup,
2291 medicalNotes: this.editedItem.medicalNotes, 2292 medicalNotes: this.editedItem.medicalNotes,
2292 height: this.editedItem.height, 2293 height: this.editedItem.height,
2293 weight: this.editedItem.weight, 2294 weight: this.editedItem.weight,
2294 rollNo: this.editedItem.rollNo 2295 rollNo: this.editedItem.rollNo
2295 }; 2296 };
2296 if (this.editImageUrl) { 2297 if (this.editImageUrl) {
2297 var str = this.editImageUrl; 2298 var str = this.editImageUrl;
2298 const [baseUrl, editImageUrl] = str.split(/,/); 2299 const [baseUrl, editImageUrl] = str.split(/,/);
2299 editStudent.upload = editImageUrl; 2300 editStudent.upload = editImageUrl;
2300 } 2301 }
2301 this.editLoading = true; 2302 this.editLoading = true;
2302 http() 2303 http()
2303 .put("/updateStudent", editStudent) 2304 .put("/updateStudent", editStudent)
2304 .then(response => { 2305 .then(response => {
2305 this.snackbar = true; 2306 this.snackbar = true;
2306 this.text = response.data.message; 2307 this.text = response.data.message;
2307 this.color = "green"; 2308 this.color = "green";
2308 this.imageUrl = ""; 2309 this.imageUrl = "";
2309 this.findStudents(); 2310 this.findStudents();
2310 this.close(); 2311 this.close();
2311 this.editLoading = false; 2312 this.editLoading = false;
2312 }) 2313 })
2313 .catch(error => { 2314 .catch(error => {
2314 this.snackbar = true; 2315 this.snackbar = true;
2315 this.text = error.response.data.statusText; 2316 this.text = error.response.data.statusText;
2316 this.color = "error"; 2317 this.color = "error";
2317 this.editLoading = false; 2318 this.editLoading = false;
2318 }); 2319 });
2319 }, 2320 },
2320 submitParentDetails() { 2321 submitParentDetails() {
2321 if (this.$refs.parentForm.validate()) { 2322 if (this.$refs.parentForm.validate()) {
2322 this.parentData.fatherCellNo = this.parentData.fatherCellNo; 2323 this.parentData.fatherCellNo = this.parentData.fatherCellNo;
2323 this.parentData.motherCellNo = this.parentData.motherCellNo; 2324 this.parentData.motherCellNo = this.parentData.motherCellNo;
2324 let addparentDetails = { 2325 let addparentDetails = {
2325 email: this.parentData.email, 2326 email: this.parentData.email,
2326 fatherName: this.parentData.fatherName, 2327 fatherName: this.parentData.fatherName,
2327 fatherCellNo: this.parentData.fatherCellNo, 2328 fatherCellNo: this.parentData.fatherCellNo,
2328 motherName: this.parentData.motherName, 2329 motherName: this.parentData.motherName,
2329 motherCellNo: this.parentData.motherCellNo, 2330 motherCellNo: this.parentData.motherCellNo,
2330 fatherProfession: this.parentData.fatherProfession, 2331 fatherProfession: this.parentData.fatherProfession,
2331 motherProfession: this.parentData.motherProfession, 2332 motherProfession: this.parentData.motherProfession,
2332 password: this.parentData.password, 2333 password: this.parentData.password,
2333 role: "PARENT" 2334 role: "PARENT"
2334 }; 2335 };
2335 this.loading = true; 2336 this.loading = true;
2336 http() 2337 http()
2337 .post("/createParent", addparentDetails) 2338 .post("/createParent", addparentDetails)
2338 .then(response => { 2339 .then(response => {
2339 this.parentId = response.data.data.id; 2340 this.parentId = response.data.data.id;
2340 this.e2 = 2; 2341 this.e2 = 2;
2341 this.snackbar = true; 2342 this.snackbar = true;
2342 this.text = response.data.message; 2343 this.text = response.data.message;
2343 this.color = "green"; 2344 this.color = "green";
2344 // this.getStudentList(); 2345 // this.getStudentList();
2345 this.clear(); 2346 this.clear();
2346 this.loading = false; 2347 this.loading = false;
2347 }) 2348 })
2348 .catch(error => { 2349 .catch(error => {
2349 this.snackbar = true; 2350 this.snackbar = true;
2350 this.text = error.response.data.message; 2351 this.text = error.response.data.message;
2351 this.color = "error"; 2352 this.color = "error";
2352 if (error.response.data.statusText) { 2353 if (error.response.data.statusText) {
2353 this.text = error.response.data.statusText; 2354 this.text = error.response.data.statusText;
2354 } 2355 }
2355 this.loading = false; 2356 this.loading = false;
2356 }); 2357 });
2357 } 2358 }
2358 }, 2359 },
2359 getParentDetails() { 2360 getParentDetails() {
2360 if (this.parentData.fatherCellNo.length > 9) { 2361 if (this.parentData.fatherCellNo.length > 9) {
2361 this.showLoader = true; 2362 this.showLoader = true;
2362 http() 2363 http()
2363 .get("getParticularParent", { 2364 .get("getParticularParent", {
2364 params: { fatherCellNo: this.parentData.fatherCellNo }, 2365 params: { fatherCellNo: this.parentData.fatherCellNo },
2365 headers: { 2366 headers: {
2366 Authorization: "Bearer " + this.$store.state.token 2367 Authorization: "Bearer " + this.$store.state.token
2367 } 2368 }
2368 }) 2369 })
2369 .then(response => { 2370 .then(response => {
2370 this.showNext = true; 2371 this.showNext = true;
2371 this.showParent = false; 2372 this.showParent = false;
2372 this.parentData = response.data.data; 2373 this.parentData = response.data.data;
2373 this.parentId = response.data.data._id; 2374 this.parentId = response.data.data._id;
2374 this.showLoader = false; 2375 this.showLoader = false;
2375 }) 2376 })
2376 .catch(error => { 2377 .catch(error => {
2377 console.log("err====>", error.response.data.message); 2378 console.log("err====>", error.response.data.message);
2378 this.text = error.response.data.message; 2379 this.text = error.response.data.message;
2379 this.snackbar = true; 2380 this.snackbar = true;
2380 if (this.text === "Data not found!") { 2381 if (this.text === "Data not found!") {
2381 this.showNext = false; 2382 this.showNext = false;
2382 this.showParent = true; 2383 this.showParent = true;
2383 this.parentData.email = ""; 2384 this.parentData.email = "";
2384 this.parentData.fatherName = ""; 2385 this.parentData.fatherName = "";
2385 this.parentData.motherName = ""; 2386 this.parentData.motherName = "";
2386 this.parentData.motherCellNo = ""; 2387 this.parentData.motherCellNo = "";
2387 this.parentData.fatherProfession = ""; 2388 this.parentData.fatherProfession = "";
2388 this.parentData.motherProfession = ""; 2389 this.parentData.motherProfession = "";
2389 this.parentData.password = ""; 2390 this.parentData.password = "";
2390 } 2391 }
2391 this.showLoader = false; 2392 this.showLoader = false;
2392 }); 2393 });
2393 } 2394 }
2394 }, 2395 },
2395 suspendStudentStatus(status, id) { 2396 suspendStudentStatus(status, id) {
2396 let suspendStudentData = { 2397 let suspendStudentData = {
2397 studentId: id, 2398 studentId: id,
2398 status: status 2399 status: status
2399 }; 2400 };
2400 http() 2401 http()
2401 .put("/suspendStudentAccount", suspendStudentData) 2402 .put("/suspendStudentAccount", suspendStudentData)
2402 .then(response => { 2403 .then(response => {
2403 this.findStudents(); 2404 this.findStudents();
2404 this.text = response.data.message; 2405 this.text = response.data.message;
2405 this.color = "green"; 2406 this.color = "green";
2406 this.snackbar = true; 2407 this.snackbar = true;
2407 }) 2408 })
2408 .catch(error => { 2409 .catch(error => {
2409 this.snackbar = true; 2410 this.snackbar = true;
2410 this.color = "error"; 2411 this.color = "error";
2411 this.text = error.response.data.message; 2412 this.text = error.response.data.message;
2412 }); 2413 });
2413 }, 2414 },
2414 displaySearch() { 2415 displaySearch() {
2415 (this.show = false), (this.showSearch = true); 2416 (this.show = false), (this.showSearch = true);
2416 }, 2417 },
2417 closeSearch() { 2418 closeSearch() {
2418 this.showSearch = false; 2419 this.showSearch = false;
2419 this.show = true; 2420 this.show = true;
2420 this.search = ""; 2421 this.search = "";
2421 } 2422 }
2422 }, 2423 },
2423 mounted() { 2424 mounted() {
2424 const getCountryList = countryList(); 2425 const getCountryList = countryList();
2425 this.countries = getCountryList; 2426 this.countries = getCountryList;
2426 var token = this.$store.state.token; 2427 var token = this.$store.state.token;
2427 http() 2428 http()
2428 .get("/getClassesList", { 2429 .get("/getClassesList", {
2429 headers: { Authorization: "Bearer " + token } 2430 headers: { Authorization: "Bearer " + token }
2430 }) 2431 })
2431 .then(response => { 2432 .then(response => {
2432 this.addclass = response.data.data; 2433 this.addclass = response.data.data;
2433 }) 2434 })
2434 .catch(error => { 2435 .catch(error => {
2435 this.showLoader = false; 2436 this.showLoader = false;
2436 if (error.response.status === 401) { 2437 if (error.response.status === 401) {
2437 this.$router.replace({ path: "/" }); 2438 this.$router.replace({ path: "/" });
2438 this.$store.dispatch("setToken", null); 2439 this.$store.dispatch("setToken", null);
2439 this.$store.dispatch("Id", null); 2440 this.$store.dispatch("Id", null);
2440 this.$store.dispatch("Role", null); 2441 this.$store.dispatch("Role", null);
2441 } 2442 }
2442 }); 2443 });
2443 } 2444 }
2444 }; 2445 };
2445 </script> 2446 </script>
2446 <style scoped> 2447 <style scoped>
2447 .active { 2448 .active {
2448 background-color: gray; 2449 background-color: gray;
2449 color: white !important; 2450 color: white !important;
2450 } 2451 }
2451 .activebtn { 2452 .activebtn {
2452 color: black !important; 2453 color: black !important;
2453 } 2454 }
2454 </style> 2455 </style>
src/pages/Subjects/subjects.vue
Diff comments   View file @c8fc8e4
1 <template> 1 <template>
2 <v-container fluid class="body-color"> 2 <v-container fluid class="body-color">
3 <!-- ****** EDIT Subject ****** --> 3 <!-- ****** EDIT Subject ****** -->
4 <v-dialog v-model="editSubjectDialog" max-width="400px"> 4 <v-dialog v-model="editSubjectDialog" max-width="400px">
5 <v-card flat class="card-style pa-2" dark> 5 <v-card flat class="card-style pa-2" dark>
6 <v-layout> 6 <v-layout>
7 <v-flex xs12> 7 <v-flex xs12>
8 <label class="title text-xs-center">Edit Subject</label> 8 <label class="title text-xs-center">Edit Subject</label>
9 <v-icon size="24" class="right" @click="editSubjectDialog = false">cancel</v-icon> 9 <v-icon size="24" class="right" @click="editSubjectDialog = false">cancel</v-icon>
10 </v-flex> 10 </v-flex>
11 </v-layout> 11 </v-layout>
12 <v-container fluid> 12 <v-container fluid>
13 <v-form ref="formEditSubject" v-model="validEditSubject" lazy-validation> 13 <v-form ref="formEditSubject" v-model="validEditSubject" lazy-validation>
14 <v-layout> 14 <v-layout>
15 <v-flex xs4 class="pt-4 subheading"> 15 <v-flex xs4 class="pt-4 subheading">
16 <label class="right">Class:</label> 16 <label class="right">Class:</label>
17 </v-flex> 17 </v-flex>
18 <v-flex xs8 class="ml-3"> 18 <v-flex xs8 class="ml-3">
19 <v-select 19 <v-select
20 :items="classList" 20 :items="classList"
21 label="Select Class" 21 label="Select Class"
22 v-model="addSubject.selectName" 22 v-model="addSubject.selectName"
23 item-text="classNum" 23 item-text="classNum"
24 item-value="_id" 24 item-value="_id"
25 name="Select Class" 25 name="Select Class"
26 :rules="nameEditSubjectRules" 26 :rules="nameEditSubjectRules"
27 required 27 required
28 ></v-select> 28 ></v-select>
29 </v-flex> 29 </v-flex>
30 </v-layout> 30 </v-layout>
31 <v-layout> 31 <v-layout>
32 <v-flex xs4 class="pt-4 subheading"> 32 <v-flex xs4 class="pt-4 subheading">
33 <label class="right">Subject:</label> 33 <label class="right">Subject:</label>
34 </v-flex> 34 </v-flex>
35 <v-flex xs8 class="ml-3"> 35 <v-flex xs8 class="ml-3">
36 <v-text-field 36 <v-text-field
37 placeholder="fill your Subject" 37 placeholder="fill your Subject"
38 v-model="editedItem.subjectName" 38 v-model="editedItem.subjectName"
39 :rules="subjectEditNameRules" 39 :rules="subjectEditNameRules"
40 type="text" 40 type="text"
41 name="email" 41 name="email"
42 required 42 required
43 ></v-text-field> 43 ></v-text-field>
44 </v-flex> 44 </v-flex>
45 </v-layout> 45 </v-layout>
46 <v-flex xs12 sm12> 46 <v-flex xs12 sm12>
47 <v-card-actions> 47 <v-card-actions>
48 <v-btn round dark @click.native="close" class="clear-button">Cancel</v-btn> 48 <v-btn round dark @click.native="close" class="clear-button">Cancel</v-btn>
49 <v-spacer></v-spacer> 49 <v-spacer></v-spacer>
50 <v-btn round dark @click="save" :loading="editLoading" class="add-button">Save</v-btn> 50 <v-btn round dark @click="save" :loading="editLoading" class="add-button">Save</v-btn>
51 </v-card-actions> 51 </v-card-actions>
52 </v-flex> 52 </v-flex>
53 </v-form> 53 </v-form>
54 </v-container> 54 </v-container>
55 </v-card> 55 </v-card>
56 </v-dialog> 56 </v-dialog>
57 57
58 <!-- ****** VIEW PROFIL NOTICE BOARD ****** --> 58 <!-- ****** VIEW PROFIL NOTICE BOARD ****** -->
59 59
60 <v-dialog v-model="viewSubjectDialog" max-width="600px"> 60 <v-dialog v-model="viewSubjectDialog" max-width="600px">
61 <v-toolbar color="v-toolbar"> 61 <v-toolbar flat class="card-style pa-3" dark>
62 <v-spacer></v-spacer> 62 <v-spacer></v-spacer>
63 <v-toolbar-title> 63 <v-toolbar-title>
64 <h3>Subject</h3> 64 <h3>Subject</h3>
65 </v-toolbar-title> 65 </v-toolbar-title>
66 <v-spacer></v-spacer> 66 <v-spacer></v-spacer>
67 <v-icon @click="close1">close</v-icon> 67 <v-icon @click="close1">close</v-icon>
68 </v-toolbar> 68 </v-toolbar>
69 <v-card> 69 <v-card>
70 <v-card-text> 70 <v-card-text>
71 <v-container grid-list-md> 71 <v-container grid-list-md>
72 <v-layout wrap> 72 <v-layout wrap>
73 <v-flex> 73 <v-flex>
74 <v-layout> 74 <v-layout>
75 <v-flex xs7 sm6> 75 <v-flex xs7 sm6>
76 <h5 class="right my-1"> 76 <h5 class="right my-1">
77 <b>Subject Name:</b> 77 <b>Subject Name:</b>
78 </h5> 78 </h5>
79 </v-flex> 79 </v-flex>
80 <v-flex sm6 xs5> 80 <v-flex sm6 xs5>
81 <h5 class="my-1">{{ editedItem.subjectName }}</h5> 81 <h5 class="my-1">{{ editedItem.subjectName }}</h5>
82 </v-flex> 82 </v-flex>
83 </v-layout> 83 </v-layout>
84 </v-flex> 84 </v-flex>
85 </v-layout> 85 </v-layout>
86 </v-container> 86 </v-container>
87 </v-card-text> 87 </v-card-text>
88 </v-card> 88 </v-card>
89 </v-dialog> 89 </v-dialog>
90 90
91 <!-- ****** EXISTING SUBJECTS TABLE ****** --> 91 <!-- ****** EXISTING SUBJECTS TABLE ****** -->
92 <v-toolbar color="transparent" flat> 92 <v-toolbar color="transparent" flat>
93 <v-btn 93 <v-btn
94 fab 94 fab
95 dark 95 dark
96 class="open-dialog-button hidden-xl-only hidden-md-only hidden-lg-only" 96 class="open-dialog-button hidden-xl-only hidden-md-only hidden-lg-only"
97 small 97 small
98 @click="addSubjectDialog = true" 98 @click="addSubjectDialog = true"
99 > 99 >
100 <v-icon dark>add</v-icon> 100 <v-icon dark>add</v-icon>
101 </v-btn> 101 </v-btn>
102 <v-flex xs1 class="hidden-sm-only hidden-xs-only"> 102 <v-flex xs1 class="hidden-sm-only hidden-xs-only">
103 <v-btn round class="open-dialog-button" dark @click="addSubjectDialog = true"> 103 <v-btn round class="open-dialog-button" dark @click="addSubjectDialog = true">
104 <v-icon class="white--text pr-1" size="20">add</v-icon>Add Subject 104 <v-icon class="white--text pr-1" size="20">add</v-icon>Add Subject
105 </v-btn> 105 </v-btn>
106 </v-flex> 106 </v-flex>
107 <v-spacer></v-spacer> 107 <v-spacer></v-spacer>
108 <v-flex lg2 md2 xs12 v-show="show"> 108 <v-flex lg2 md2 xs12 v-show="show">
109 <v-select 109 <v-select
110 :items="classList" 110 :items="classList"
111 label="Select Your Class" 111 label="Select Your Class"
112 v-model="selectClassId" 112 v-model="selectClassId"
113 item-text="classNum" 113 item-text="classNum"
114 item-value="_id" 114 item-value="_id"
115 name="Select Class" 115 name="Select Class"
116 :rules="nameRules" 116 :rules="nameRules"
117 @change="getClassSubject" 117 @change="getClassSubject"
118 class="pl-2" 118 class="pl-2"
119 required 119 required
120 ></v-select> 120 ></v-select>
121 </v-flex> 121 </v-flex>
122 <v-card-title class="body-1" v-show="show"> 122 <v-card-title class="body-1" v-show="show">
123 <v-btn icon flat @click="displaySearch"> 123 <v-btn icon flat @click="displaySearch">
124 <v-avatar size="27"> 124 <v-avatar size="27">
125 <img src="/static/icon/search.png" alt="icon" /> 125 <img src="/static/icon/search.png" alt="icon" />
126 </v-avatar> 126 </v-avatar>
127 </v-btn> 127 </v-btn>
128 </v-card-title> 128 </v-card-title>
129 <v-flex xs9 sm9 md2 lg2 xl2 v-show="showSearch"> 129 <v-flex xs9 sm9 md2 lg2 xl2 v-show="showSearch">
130 <v-layout> 130 <v-layout>
131 <v-text-field 131 <v-text-field
132 v-model="search" 132 v-model="search"
133 label="Search" 133 label="Search"
134 prepend-inner-icon="search" 134 prepend-inner-icon="search"
135 color="primary" 135 color="primary"
136 style="transition: 0.8s cubic-bezier(0.25, 0.8, 0.25, 1); !important" 136 style="transition: 0.8s cubic-bezier(0.25, 0.8, 0.25, 1); !important"
137 ></v-text-field> 137 ></v-text-field>
138 <v-icon @click="closeSearch" color="error">close</v-icon> 138 <v-icon @click="closeSearch" color="error">close</v-icon>
139 </v-layout> 139 </v-layout>
140 </v-flex> 140 </v-flex>
141 </v-toolbar> 141 </v-toolbar>
142 <v-data-table 142 <v-data-table
143 :headers="headers" 143 :headers="headers"
144 :items="subjectList.subjects" 144 :items="subjectList.subjects"
145 :pagination.sync="pagination" 145 :pagination.sync="pagination"
146 :search="search" 146 :search="search"
147 > 147 >
148 <template slot="items" slot-scope="props"> 148 <template slot="items" slot-scope="props">
149 <tr class="tr"> 149 <tr class="tr">
150 <td class="td-row td">{{ props.index + 1 }}</td> 150 <td class="td-row td">{{ props.index + 1 }}</td>
151 <td class="text-xs-center td td-row">{{ props.item.subjectName }}</td> 151 <td class="text-xs-center td td-row">{{ props.item.subjectName }}</td>
152 <td class="text-xs-center td td-row"> 152 <td class="text-xs-center td td-row">
153 <span> 153 <span>
154 <v-tooltip top> 154 <v-tooltip top>
155 <img 155 <img
156 slot="activator" 156 slot="activator"
157 style="cursor:pointer; width:25px; height:25px; " 157 style="cursor:pointer; width:25px; height:25px; "
158 class="mr-3" 158 class="mr-3"
159 @click="profile(props.item)" 159 @click="profile(props.item)"
160 src="/static/icon/view.png" 160 src="/static/icon/view.png"
161 /> 161 />
162 <span>View</span> 162 <span>View</span>
163 </v-tooltip> 163 </v-tooltip>
164 <v-tooltip top> 164 <v-tooltip top>
165 <img 165 <img
166 slot="activator" 166 slot="activator"
167 style="cursor:pointer; width:20px; height:18px; " 167 style="cursor:pointer; width:20px; height:18px; "
168 class="mr-3" 168 class="mr-3"
169 @click="editItem(props.item)" 169 @click="editItem(props.item)"
170 src="/static/icon/edit.png" 170 src="/static/icon/edit.png"
171 /> 171 />
172 <span>Edit</span> 172 <span>Edit</span>
173 </v-tooltip> 173 </v-tooltip>
174 <v-tooltip top> 174 <v-tooltip top>
175 <img 175 <img
176 slot="activator" 176 slot="activator"
177 style="cursor:pointer; width:20px; height:20px; " 177 style="cursor:pointer; width:20px; height:20px; "
178 class="mr-3" 178 class="mr-3"
179 @click="deleteItem(props.item)" 179 @click="deleteItem(props.item)"
180 src="/static/icon/delete.png" 180 src="/static/icon/delete.png"
181 /> 181 />
182 <span>Delete</span> 182 <span>Delete</span>
183 </v-tooltip> 183 </v-tooltip>
184 </span> 184 </span>
185 </td> 185 </td>
186 </tr> 186 </tr>
187 </template> 187 </template>
188 <v-alert 188 <v-alert
189 slot="no-results" 189 slot="no-results"
190 :value="true" 190 :value="true"
191 color="error" 191 color="error"
192 icon="warning" 192 icon="warning"
193 >Your search for "{{ search }}" found no results.</v-alert> 193 >Your search for "{{ search }}" found no results.</v-alert>
194 </v-data-table> 194 </v-data-table>
195 <!-- ****** ADD MULTIPLE Subject ****** --> 195 <!-- ****** ADD MULTIPLE Subject ****** -->
196 <v-snackbar 196 <v-snackbar
197 :timeout="timeout" 197 :timeout="timeout"
198 :top="y === 'top'" 198 :top="y === 'top'"
199 :right="x === 'right'" 199 :right="x === 'right'"
200 :vertical="mode === 'vertical'" 200 :vertical="mode === 'vertical'"
201 v-model="snackbar" 201 v-model="snackbar"
202 :color="color" 202 :color="color"
203 >{{ text }}</v-snackbar> 203 >{{ text }}</v-snackbar>
204 <v-dialog v-model="addSubjectDialog" max-width="400px"> 204 <v-dialog v-model="addSubjectDialog" max-width="400px">
205 <v-card flat class="card-style pa-2" dark> 205 <v-card flat class="card-style pa-2" dark>
206 <v-layout> 206 <v-layout>
207 <v-flex xs12> 207 <v-flex xs12>
208 <label class="title text-xs-center">Add Subject</label> 208 <label class="title text-xs-center">Add Subject</label>
209 <v-icon size="24" class="right" @click="addSubjectDialog = false">cancel</v-icon> 209 <v-icon size="24" class="right" @click="addSubjectDialog = false">cancel</v-icon>
210 </v-flex> 210 </v-flex>
211 </v-layout> 211 </v-layout>
212 <v-container fluid fill-height> 212 <v-container fluid fill-height>
213 <v-layout align-center> 213 <v-layout align-center>
214 <v-flex xs12> 214 <v-flex xs12>
215 <v-form ref="form" v-model="valid" lazy-validation> 215 <v-form ref="form" v-model="valid" lazy-validation>
216 <v-layout> 216 <v-layout>
217 <v-flex xs4 sm4 class="pt-4 subheading"> 217 <v-flex xs4 sm4 class="pt-4 subheading">
218 <label class="right">Class :</label> 218 <label class="right">Class :</label>
219 </v-flex> 219 </v-flex>
220 <v-flex xs8 sm8 class="ml-3"> 220 <v-flex xs8 sm8 class="ml-3">
221 <v-select 221 <v-select
222 v-model="addSubject.classId" 222 v-model="addSubject.classId"
223 label="Select your class" 223 label="Select your class"
224 type="text" 224 type="text"
225 :items="classList" 225 :items="classList"
226 item-text="classNum" 226 item-text="classNum"
227 item-value="_id" 227 item-value="_id"
228 :rules="nameRules" 228 :rules="nameRules"
229 required 229 required
230 ></v-select> 230 ></v-select>
231 </v-flex> 231 </v-flex>
232 </v-layout> 232 </v-layout>
233 <v-layout> 233 <v-layout>
234 <v-flex xs4 sm4 class="pt-4 subheading"> 234 <v-flex xs4 sm4 class="pt-4 subheading">
235 <label class="right">Subject :</label> 235 <label class="right">Subject :</label>
236 </v-flex> 236 </v-flex>
237 <v-flex xs8 sm8 class="ml-3"> 237 <v-flex xs8 sm8 class="ml-3">
238 <v-text-field 238 <v-text-field
239 v-model="addSubject.subjectName" 239 v-model="addSubject.subjectName"
240 placeholder="fill your Subject Name" 240 placeholder="fill your Subject Name"
241 name="name" 241 name="name"
242 type="text" 242 type="text"
243 :rules="subjectRules" 243 :rules="subjectRules"
244 required 244 required
245 ></v-text-field> 245 ></v-text-field>
246 </v-flex> 246 </v-flex>
247 </v-layout> 247 </v-layout>
248 <v-layout> 248 <v-layout>
249 <v-flex xs12 sm12> 249 <v-flex xs12 sm12>
250 <v-card-actions> 250 <v-card-actions>
251 <v-btn @click="clear" round dark class="clear-button">Clear</v-btn> 251 <v-btn @click="clear" round dark class="clear-button">Clear</v-btn>
252 <v-spacer></v-spacer> 252 <v-spacer></v-spacer>
253 <v-btn @click="submit" round dark :loading="loading" class="add-button">Add</v-btn> 253 <v-btn @click="submit" round dark :loading="loading" class="add-button">Add</v-btn>
254 </v-card-actions> 254 </v-card-actions>
255 </v-flex> 255 </v-flex>
256 </v-layout> 256 </v-layout>
257 </v-form> 257 </v-form>
258 </v-flex> 258 </v-flex>
259 </v-layout> 259 </v-layout>
260 </v-container> 260 </v-container>
261 </v-card> 261 </v-card>
262 </v-dialog> 262 </v-dialog>
263 <div class="loader" v-if="showLoader"> 263 <div class="loader" v-if="showLoader">
264 <v-progress-circular indeterminate color="white"></v-progress-circular> 264 <v-progress-circular indeterminate color="white"></v-progress-circular>
265 </div> 265 </div>
266 </v-container> 266 </v-container>
267 </template> 267 </template>
268 268
269 <script> 269 <script>
270 import http from "@/Services/http.js"; 270 import http from "@/Services/http.js";
271 import Util from "@/util"; 271 import Util from "@/util";
272 272
273 export default { 273 export default {
274 data: () => ({ 274 data: () => ({
275 snackbar: false, 275 snackbar: false,
276 y: "top", 276 y: "top",
277 x: "right", 277 x: "right",
278 mode: "", 278 mode: "",
279 timeout: 3000, 279 timeout: 3000,
280 text: "", 280 text: "",
281 color: "", 281 color: "",
282 show: true, 282 show: true,
283 showSearch: false, 283 showSearch: false,
284 showLoader: false, 284 showLoader: false,
285 loading: false, 285 loading: false,
286 editLoading: false, 286 editLoading: false,
287 date: null, 287 date: null,
288 search: "", 288 search: "",
289 viewSubjectDialog: false, 289 viewSubjectDialog: false,
290 editSubjectDialog: false, 290 editSubjectDialog: false,
291 valid: true, 291 valid: true,
292 validEditSubject: true, 292 validEditSubject: true,
293 addSubjectDialog: false, 293 addSubjectDialog: false,
294 // isActive: true, 294 // isActive: true,
295 // newActive: false, 295 // newActive: false,
296 gender: ["Male", "Female"], 296 gender: ["Male", "Female"],
297 pagination: { 297 pagination: {
298 rowsPerPage: 10 298 rowsPerPage: 10
299 }, 299 },
300 token: "", 300 token: "",
301 nameRules: [v => !!v || " Class Name is required"], 301 nameRules: [v => !!v || " Class Name is required"],
302 nameEditSubjectRules: [v => !!v || " Class Name is required"], 302 nameEditSubjectRules: [v => !!v || " Class Name is required"],
303 subjectRules: [v => !!v || " Subject Name is required"], 303 subjectRules: [v => !!v || " Subject Name is required"],
304 subjectEditNameRules: [v => !!v || " Subject Name is required"], 304 subjectEditNameRules: [v => !!v || " Subject Name is required"],
305 headers: [ 305 headers: [
306 { 306 {
307 text: "No", 307 text: "No",
308 align: "", 308 align: "",
309 sortable: false, 309 sortable: false,
310 value: "No" 310 value: "No"
311 }, 311 },
312 { 312 {
313 text: "Subject Name", 313 text: "Subject Name",
314 value: "subjectName", 314 value: "subjectName",
315 sortable: false, 315 sortable: false,
316 align: "center" 316 align: "center"
317 }, 317 },
318 { text: "Action", value: "", sortable: false, align: "center" } 318 { text: "Action", value: "", sortable: false, align: "center" }
319 ], 319 ],
320 subjectList: [], 320 subjectList: [],
321 classList: [], 321 classList: [],
322 editedIndex: -1, 322 editedIndex: -1,
323 addSubject: {}, 323 addSubject: {},
324 selectClassId: "", 324 selectClassId: "",
325 selectClassId: "", 325 selectClassId: "",
326 editedItem: { 326 editedItem: {
327 subjectName: "" 327 subjectName: ""
328 } 328 }
329 }), 329 }),
330 methods: { 330 methods: {
331 pickFile() { 331 pickFile() {
332 this.$refs.image.click(); 332 this.$refs.image.click();
333 }, 333 },
334 editItem(item) { 334 editItem(item) {
335 this.editedIndex = this.subjectList.subjects;
335 this.editedItem = Object.assign({}, item); 336 this.editedItem = Object.assign({}, item);
336 this.dialog = true; 337 this.dialog = true;
338 this.editSubjectDialog = true;
337 }, 339 },
338 profile(item) { 340 profile(item) {
341 this.editedIndex = this.subjectList.subjects;
339 this.editedItem = Object.assign({}, item); 342 this.editedItem = Object.assign({}, item);
340 this.dialog1 = true; 343 this.dialog1 = true;
344 this.viewSubjectDialog = true;
345
341 }, 346 },
342 deleteItem(item) { 347 deleteItem(item) {
343 let deleteSubject = { 348 let deleteSubject = {
344 classId: this.selectClassId, 349 classId: this.selectClassId,
345 subjectId: item._id 350 subjectId: item._id
346 }; 351 };
347 http() 352 http()
348 .delete( 353 .delete(
349 "/deleteSubject", 354 "/deleteSubject",
350 confirm("Are you sure you want to delete this?") && { 355 confirm("Are you sure you want to delete this?") && {
351 params: deleteSubject 356 params: deleteSubject
352 } 357 }
353 ) 358 )
354 .then(response => { 359 .then(response => {
355 this.getClassSubject(); 360 this.getClassSubject();
356 this.snackbar = true; 361 this.snackbar = true;
357 this.text = "Successfully delete Existing Subject"; 362 this.text = "Successfully delete Existing Subject";
358 }) 363 })
359 .catch(error => { 364 .catch(error => {
360 // console.log(error); 365 this.snackbar = true;
366 this.text = error.response.data.message;
367 this.color = "error";
361 }); 368 });
362 }, 369 },
363 close() { 370 close() {
364 this.editSubjectDialog = false; 371 this.editSubjectDialog = false;
365 }, 372 },
366 close1() { 373 close1() {
367 this.viewSubjectDialog = false; 374 this.viewSubjectDialog = false;
368 }, 375 },
369 submit() { 376 submit() {
370 if (this.$refs.form.validate()) { 377 if (this.$refs.form.validate()) {
371 http() 378 http()
372 .post("/addSubject", this.addSubject) 379 .post("/addSubject", this.addSubject)
373 .then(response => { 380 .then(response => {
374 this.getClassSubject(); 381 this.getClassSubject();
375 this.snackbar = true; 382 this.snackbar = true;
376 this.text = "New Subject added successfully"; 383 this.text = "New Subject added successfully";
377 this.clear(); 384 this.clear();
378 this.color = "green"; 385 this.color = "green";
379 this.addSubjectDialog = false; 386 this.addSubjectDialog = false;
380 }) 387 })
381 .catch(error => { 388 .catch(error => {
382 // console.log(error); 389 // console.log(error);
383 this.snackbar = true; 390 this.snackbar = true;
384 this.text = error.response.data.message; 391 this.text = error.response.data.message;
385 this.color = "error"; 392 this.color = "error";
386 }); 393 });
387 } 394 }
388 }, 395 },
389 clear() { 396 clear() {
390 this.$refs.form.reset(); 397 this.$refs.form.reset();
391 }, 398 },
392 save() { 399 save() {
393 if (this.$refs.formEditSubject.validate()) { 400 if (this.$refs.formEditSubject.validate()) {
394 let editSubject = { 401 let editSubject = {
395 classId: this.addSubject.selectName, 402 classId: this.addSubject.selectName,
396 subjectId: this.editedItem._id, 403 subjectId: this.editedItem._id,
397 subjectName: this.editedItem.subjectName 404 subjectName: this.editedItem.subjectName
398 }; 405 };
399 this.editLoading = true; 406 this.editLoading = true;
400 http() 407 http()
401 .put("/updateSubject", editSubject) 408 .put("/updateSubject", editSubject)
402 .then(response => { 409 .then(response => {
403 this.snackbar = true; 410 this.snackbar = true;
404 this.text = "Successfully Edit Existing Subject"; 411 this.text = "Successfully Edit Existing Subject";
405 this.editLoading = false; 412 this.editLoading = false;
406 http() 413 http()
407 .get( 414 .get(
408 "/getParticularClass", 415 "/getParticularClass",
409 { params: { classId: this.selectClassId } }, 416 { params: { classId: this.selectClassId } },
410 { 417 {
411 headers: { Authorization: "Bearer " + this.token } 418 headers: { Authorization: "Bearer " + this.token }
412 } 419 }
413 ) 420 )
414 .then(response => { 421 .then(response => {
415 this.subjectList = response.data.data; 422 this.subjectList = response.data.data;
416 this.getClassSubject(); 423 this.getClassSubject();
417 this.snackbar = true; 424 this.snackbar = true;
418 this.color = "green"; 425 this.color = "green";
419 this.text = response.data.message; 426 this.text = response.data.message;
420 this.close(); 427 this.close();
421 }) 428 })
422 .catch(err => { 429 .catch(err => {
423 console.log("err====>", err); 430 console.log("err====>", err);
424 }); 431 });
425 }) 432 })
426 .catch(error => { 433 .catch(error => {
427 this.editLoading = false; 434 this.editLoading = false;
428 435
429 // console.log(error); 436 // console.log(error);
430 }); 437 });
431 } 438 }
432 }, 439 },
433 getClassSubject() { 440 getClassSubject() {
434 this.showLoader = true; 441 this.showLoader = true;
435 this.selectClassId = this.selectClassId; 442 this.selectClassId = this.selectClassId;
436 http() 443 http()
437 .get( 444 .get(
438 "/getParticularClass", 445 "/getParticularClass",
439 { params: { classId: this.selectClassId } }, 446 { params: { classId: this.selectClassId } },
440 { 447 {
441 headers: { Authorization: "Bearer " + this.token } 448 headers: { Authorization: "Bearer " + this.token }
442 } 449 }
443 ) 450 )
444 .then(response => { 451 .then(response => {
445 this.subjectList = response.data.data; 452 this.subjectList = response.data.data;
446 this.showLoader = false; 453 this.showLoader = false;
447 }) 454 })
448 .catch(err => { 455 .catch(err => {
449 this.showLoader = false; 456 this.showLoader = false;
450 }); 457 });
451 }, 458 },
452 getClass() { 459 getClass() {
453 http() 460 http()
454 .get("/getClassesList", { 461 .get("/getClassesList", {
455 headers: { Authorization: "Bearer " + this.token } 462 headers: { Authorization: "Bearer " + this.token }
456 }) 463 })
457 .then(response => { 464 .then(response => {
458 this.classList = response.data.data; 465 this.classList = response.data.data;
459 }) 466 })
460 .catch(error => { 467 .catch(error => {
461 if (error.response.status === 401) { 468 if (error.response.status === 401) {
462 this.$router.replace({ path: "/" }); 469 this.$router.replace({ path: "/" });
463 this.$store.dispatch("setToken", null); 470 this.$store.dispatch("setToken", null);
464 this.$store.dispatch("Id", null); 471 this.$store.dispatch("Id", null);
465 } 472 }
466 }); 473 });
467 }, 474 },
468 displaySearch() { 475 displaySearch() {
469 (this.show = false), (this.showSearch = true); 476 (this.show = false), (this.showSearch = true);
470 }, 477 },
471 closeSearch() { 478 closeSearch() {
472 this.showSearch = false; 479 this.showSearch = false;
473 this.show = true; 480 this.show = true;
474 this.search = ""; 481 this.search = "";
475 } 482 }
476 }, 483 },
477 mounted() { 484 mounted() {
478 this.token = this.$store.state.token; 485 this.token = this.$store.state.token;
479 // this.getNoticeDataList(); 486 // this.getNoticeDataList();
480 this.getClass(); 487 this.getClass();
481 } 488 }
482 }; 489 };
483 </script> 490 </script>
src/pages/Teachers/teachers.vue
Diff comments   View file @c8fc8e4
1 <template> 1 <template>
2 <v-container fluid class="body-color"> 2 <v-container fluid class="body-color">
3 <!-- ****** EDIT TEACHERS DETAILS ****** --> 3 <!-- ****** EDIT TEACHERS DETAILS ****** -->
4 <v-dialog v-model="editTeacherDialog" max-width="1160px" scrollable> 4 <v-dialog v-model="editTeacherDialog" max-width="1160px" scrollable>
5 <v-card flat class="card-style" dark> 5 <v-card flat class="card-style" dark>
6 <v-card-text> 6 <v-card-text>
7 <v-layout> 7 <v-layout>
8 <v-flex xs12> 8 <v-flex xs12>
9 <label class="title text-xs-center">Edit Teacher</label> 9 <label class="title text-xs-center">Edit Teacher Details</label>
10 <v-icon size="24" class="right" @click="editTeacherDialog = false">cancel</v-icon> 10 <v-icon size="24" class="right" @click="editTeacherDialog = false">cancel</v-icon>
11 </v-flex> 11 </v-flex>
12 </v-layout> 12 </v-layout>
13 <v-container fluid> 13 <v-container fluid>
14 <v-layout> 14 <v-layout>
15 <v-flex xs12 class="text-xs-center text-sm-center text-md-center text-lg-center my-4"> 15 <v-flex xs12 class="text-xs-center text-sm-center text-md-center text-lg-center my-4">
16 <v-avatar size="100px" v-if="!editedItem.profilePicUrl && !imageUrl"> 16 <v-avatar size="100px" v-if="!editedItem.profilePicUrl && !imageUrl">
17 <img src="/static/icon/user.png" /> 17 <img src="/static/icon/user.png" />
18 </v-avatar> 18 </v-avatar>
19 <img 19 <img
20 :src="editedItem.profilePicUrl" 20 :src="editedItem.profilePicUrl"
21 v-else-if="editedItem.profilePicUrl && !imageUrl" 21 v-else-if="editedItem.profilePicUrl && !imageUrl"
22 height="150" 22 height="150"
23 style="border-radius:50%; width:150px" 23 style="border-radius:50%; width:150px"
24 /> 24 />
25 <img 25 <img
26 v-if="imageUrl" 26 v-if="imageUrl"
27 :src="imageUrl" 27 :src="imageUrl"
28 height="150" 28 height="150"
29 style="border-radius:50%; width:150px" 29 style="border-radius:50%; width:150px"
30 /> 30 />
31 <input 31 <input
32 type="file" 32 type="file"
33 style="display:none" 33 style="display:none"
34 ref="image" 34 ref="image"
35 accept="image/*" 35 accept="image/*"
36 @change="onFilePicked" 36 @change="onFilePicked"
37 /> 37 />
38 </v-flex> 38 </v-flex>
39 </v-layout> 39 </v-layout>
40 <v-layout wrap> 40 <v-layout wrap>
41 <v-flex xs12 sm6> 41 <v-flex xs12 sm6>
42 <v-layout> 42 <v-layout>
43 <v-flex xs4 class="pt-4 subheading"> 43 <v-flex xs4 class="pt-4 subheading">
44 <label class="right hidden-xs-only hidden-sm-only">Full Name:</label> 44 <label class="right hidden-xs-only hidden-sm-only">Full Name:</label>
45 <label class="right hidden-lg-only hidden-md-only hidden-xl-only">Name:</label> 45 <label class="right hidden-lg-only hidden-md-only hidden-xl-only">Name:</label>
46 </v-flex> 46 </v-flex>
47 <v-flex xs8 class="ml-3"> 47 <v-flex xs8 class="ml-3">
48 <v-text-field 48 <v-text-field
49 v-model="editedItem.name" 49 v-model="editedItem.name"
50 placeholder="fill your full Name" 50 placeholder="fill your full Name"
51 type="text" 51 type="text"
52 required 52 required
53 ></v-text-field> 53 ></v-text-field>
54 </v-flex> 54 </v-flex>
55 </v-layout> 55 </v-layout>
56 </v-flex> 56 </v-flex>
57 <v-flex xs12 sm6> 57 <v-flex xs12 sm6>
58 <v-layout> 58 <v-layout>
59 <v-flex xs4 sm4 class="pt-4 subheading"> 59 <v-flex xs4 sm4 class="pt-4 subheading">
60 <label class="right">Email ID:</label> 60 <label class="right">Email ID:</label>
61 </v-flex> 61 </v-flex>
62 <v-flex xs8 sm8 class="ml-3"> 62 <v-flex xs8 sm8 class="ml-3">
63 <v-text-field 63 <v-text-field
64 placeholder="fill your email" 64 placeholder="fill your email"
65 v-model="editedItem.email" 65 v-model="editedItem.email"
66 type="text" 66 type="text"
67 required 67 required
68 ></v-text-field> 68 ></v-text-field>
69 </v-flex> 69 </v-flex>
70 </v-layout> 70 </v-layout>
71 </v-flex> 71 </v-flex>
72 </v-layout> 72 </v-layout>
73 <v-layout wrap> 73 <v-layout wrap>
74 <v-flex xs12 sm6> 74 <v-flex xs12 sm6>
75 <v-layout> 75 <v-layout>
76 <v-flex xs4 class="pt-4 subheading"> 76 <v-flex xs4 class="pt-4 subheading">
77 <label class="right hidden-sm-only hidden-xs-only">Date of Birth:</label> 77 <label class="right hidden-sm-only hidden-xs-only">Date of Birth:</label>
78 <label class="right hidden-lg-only hidden-xl-only hidden-md-only">D.O.B:</label> 78 <label class="right hidden-lg-only hidden-xl-only hidden-md-only">D.O.B:</label>
79 </v-flex> 79 </v-flex>
80 <v-flex xs8 class="ml-3"> 80 <v-flex xs8 class="ml-3">
81 <v-menu 81 <v-menu
82 ref="menu" 82 ref="menu"
83 :close-on-content-click="false" 83 :close-on-content-click="false"
84 v-model="menu2" 84 v-model="menu2"
85 :nudge-right="40" 85 :nudge-right="40"
86 lazy 86 lazy
87 transition="scale-transition" 87 transition="scale-transition"
88 offset-y 88 offset-y
89 full-width 89 full-width
90 min-width="290px" 90 min-width="290px"
91 > 91 >
92 <v-text-field 92 <v-text-field
93 slot="activator" 93 slot="activator"
94 v-model="editedItem.dob" 94 v-model="editedItem.dob"
95 placeholder="Select date" 95 placeholder="Select date"
96 ></v-text-field> 96 ></v-text-field>
97 <v-date-picker 97 <v-date-picker
98 ref="picker" 98 ref="picker"
99 v-model="editedItem.dob" 99 v-model="editedItem.dob"
100 :max="new Date().toISOString().substr(0, 10)" 100 :max="new Date().toISOString().substr(0, 10)"
101 min="1950-01-01" 101 min="1950-01-01"
102 @input="menu2 = false" 102 @input="menu2 = false"
103 ></v-date-picker> 103 ></v-date-picker>
104 </v-menu> 104 </v-menu>
105 </v-flex> 105 </v-flex>
106 </v-layout> 106 </v-layout>
107 </v-flex> 107 </v-flex>
108 <v-flex xs12 sm6> 108 <v-flex xs12 sm6>
109 <v-layout> 109 <v-layout>
110 <v-flex xs4 class="pt-4 subheading"> 110 <v-flex xs4 class="pt-4 subheading">
111 <label class="right">City:</label> 111 <label class="right">City:</label>
112 </v-flex> 112 </v-flex>
113 <v-flex xs8 class="ml-3"> 113 <v-flex xs8 class="ml-3">
114 <v-text-field 114 <v-text-field
115 v-model="editedItem.city" 115 v-model="editedItem.city"
116 placeholder="fill your City Name" 116 placeholder="fill your City Name"
117 type="text" 117 type="text"
118 required 118 required
119 ></v-text-field> 119 ></v-text-field>
120 </v-flex> 120 </v-flex>
121 </v-layout> 121 </v-layout>
122 </v-flex> 122 </v-flex>
123 </v-layout> 123 </v-layout>
124 <v-layout wrap> 124 <v-layout wrap>
125 <v-flex xs12 sm6> 125 <v-flex xs12 sm6>
126 <v-layout> 126 <v-layout>
127 <v-flex xs4 class="pt-4 subheading"> 127 <v-flex xs4 class="pt-4 subheading">
128 <label class="right">State:</label> 128 <label class="right">State:</label>
129 </v-flex> 129 </v-flex>
130 <v-flex xs8 class="ml-3"> 130 <v-flex xs8 class="ml-3">
131 <v-text-field 131 <v-text-field
132 v-model="editedItem.state" 132 v-model="editedItem.state"
133 placeholder="fill your State Name" 133 placeholder="fill your State Name"
134 type="text" 134 type="text"
135 required 135 required
136 ></v-text-field> 136 ></v-text-field>
137 </v-flex> 137 </v-flex>
138 </v-layout> 138 </v-layout>
139 </v-flex> 139 </v-flex>
140 <v-flex xs12 sm6> 140 <v-flex xs12 sm6>
141 <v-layout> 141 <v-layout>
142 <v-flex xs4 class="pt-4 subheading"> 142 <v-flex xs4 class="pt-4 subheading">
143 <label class="right">PinCode:</label> 143 <label class="right">PinCode:</label>
144 </v-flex> 144 </v-flex>
145 <v-flex xs8 class="ml-3"> 145 <v-flex xs8 class="ml-3">
146 <v-text-field 146 <v-text-field
147 v-model="editedItem.pincode" 147 v-model="editedItem.pincode"
148 placeholder="fill your pincode" 148 placeholder="fill your pincode"
149 type="number" 149 type="number"
150 required 150 required
151 ></v-text-field> 151 ></v-text-field>
152 </v-flex> 152 </v-flex>
153 </v-layout> 153 </v-layout>
154 </v-flex> 154 </v-flex>
155 </v-layout> 155 </v-layout>
156 <v-layout wrap> 156 <v-layout wrap>
157 <v-flex xs12 sm6> 157 <v-flex xs12 sm6>
158 <v-layout> 158 <v-layout>
159 <v-flex xs4 class="pt-4 subheading"> 159 <v-flex xs4 class="pt-4 subheading">
160 <label class="right hidden-xs-only hidden-sm-only">Mobile No:</label> 160 <label class="right hidden-xs-only hidden-sm-only">Mobile No:</label>
161 <label class="right hidden-lg-only hidden-md-only hidden-xl-only">Mobile:</label> 161 <label class="right hidden-lg-only hidden-md-only hidden-xl-only">Mobile:</label>
162 </v-flex> 162 </v-flex>
163 <v-flex xs8 class="ml-3"> 163 <v-flex xs8 class="ml-3">
164 <v-text-field 164 <v-text-field
165 v-model="editedItem.mobileNo" 165 v-model="editedItem.mobileNo"
166 placeholder="fill your MobileNo" 166 placeholder="fill your MobileNo"
167 type="number" 167 type="number"
168 required 168 required
169 ></v-text-field> 169 ></v-text-field>
170 </v-flex> 170 </v-flex>
171 </v-layout> 171 </v-layout>
172 </v-flex> 172 </v-flex>
173 <v-flex xs12 sm6> 173 <v-flex xs12 sm6>
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 hidden-xs-only hidden-sm-only">Select Country:</label> 176 <label class="right hidden-xs-only hidden-sm-only">Select Country:</label>
177 <label class="right hidden-lg-only hidden-md-only hidden-xl-only">Country:</label> 177 <label class="right hidden-lg-only hidden-md-only hidden-xl-only">Country:</label>
178 </v-flex> 178 </v-flex>
179 <v-flex xs8 sm8 class="ml-3"> 179 <v-flex xs8 sm8 class="ml-3">
180 <v-autocomplete 180 <v-autocomplete
181 v-model="editedItem.country" 181 v-model="editedItem.country"
182 :items="countries" 182 :items="countries"
183 placeholder="Select Country Name" 183 placeholder="Select Country Name"
184 required 184 required
185 ></v-autocomplete> 185 ></v-autocomplete>
186 </v-flex> 186 </v-flex>
187 </v-layout> 187 </v-layout>
188 </v-flex> 188 </v-flex>
189 </v-layout> 189 </v-layout>
190 <v-layout wrap> 190 <v-layout wrap>
191 <v-flex xs12 sm6> 191 <v-flex xs12 sm6>
192 <v-layout> 192 <v-layout>
193 <v-flex xs4 class="pt-4 subheading"> 193 <v-flex xs4 class="pt-4 subheading">
194 <label class="right">Join Date:</label> 194 <label class="right">Join Date:</label>
195 </v-flex> 195 </v-flex>
196 <v-flex xs8 sm8 class="ml-3"> 196 <v-flex xs8 sm8 class="ml-3">
197 <v-menu 197 <v-menu
198 ref="menu" 198 ref="menu"
199 :close-on-content-click="false" 199 :close-on-content-click="false"
200 v-model="menu3" 200 v-model="menu3"
201 :nudge-right="40" 201 :nudge-right="40"
202 lazy 202 lazy
203 transition="scale-transition" 203 transition="scale-transition"
204 offset-y 204 offset-y
205 full-width 205 full-width
206 min-width="290px" 206 min-width="290px"
207 > 207 >
208 <v-text-field 208 <v-text-field
209 slot="activator" 209 slot="activator"
210 v-model="editedItem.joinDate" 210 v-model="editedItem.joinDate"
211 placeholder="Select date" 211 placeholder="Select date"
212 ></v-text-field> 212 ></v-text-field>
213 <v-date-picker 213 <v-date-picker
214 ref="picker" 214 ref="picker"
215 v-model="editedItem.joinDate" 215 v-model="editedItem.joinDate"
216 :max="new Date().toISOString().substr(0, 10)" 216 :max="new Date().toISOString().substr(0, 10)"
217 min="1950-01-01" 217 min="1950-01-01"
218 @input="menu3 = false" 218 @input="menu3 = false"
219 ></v-date-picker> 219 ></v-date-picker>
220 </v-menu> 220 </v-menu>
221 </v-flex> 221 </v-flex>
222 </v-layout> 222 </v-layout>
223 </v-flex> 223 </v-flex>
224 <v-flex xs12 sm6> 224 <v-flex xs12 sm6>
225 <v-layout> 225 <v-layout>
226 <v-flex xs4 class="pt-4 subheading"> 226 <v-flex xs4 class="pt-4 subheading">
227 <label class="right hidden-xs-only hidden-sm-only">Uplaod Image:</label> 227 <label class="right hidden-xs-only hidden-sm-only">Uplaod Image:</label>
228 <label class="right hidden-lg-only hidden-md-only hidden-xl-only">Uplaod :</label> 228 <label class="right hidden-lg-only hidden-md-only hidden-xl-only">Uplaod :</label>
229 </v-flex> 229 </v-flex>
230 <v-flex xs8 sm8 class="ml-3"> 230 <v-flex xs8 sm8 class="ml-3">
231 <v-text-field 231 <v-text-field
232 label="Select Image" 232 label="Select Image"
233 @click="pickFile" 233 @click="pickFile"
234 v-model="imageName" 234 v-model="imageName"
235 append-icon="attach_file" 235 append-icon="attach_file"
236 ></v-text-field> 236 ></v-text-field>
237 </v-flex> 237 </v-flex>
238 </v-layout> 238 </v-layout>
239 </v-flex> 239 </v-flex>
240 </v-layout> 240 </v-layout>
241 <v-layout class="hidden-xs-only hidden-sm-only" wrap> 241 <v-layout class="hidden-xs-only hidden-sm-only" wrap>
242 <v-flex xs12 sm6> 242 <v-flex xs12 sm6>
243 <v-layout> 243 <v-layout>
244 <v-flex xs4 sm4 class="pt-4 subheading"> 244 <v-flex xs4 sm4 class="pt-4 subheading">
245 <label class="right">Present Address:</label> 245 <label class="right">Present Address:</label>
246 </v-flex> 246 </v-flex>
247 <v-flex xs8 sm8 class="ml-3"> 247 <v-flex xs8 sm8 class="ml-3">
248 <v-text-field 248 <v-text-field
249 name="input-4-3" 249 name="input-4-3"
250 v-model="editedItem.presentAddress" 250 v-model="editedItem.presentAddress"
251 placeholder="fill Your present Address" 251 placeholder="fill Your present Address"
252 required 252 required
253 ></v-text-field> 253 ></v-text-field>
254 </v-flex> 254 </v-flex>
255 </v-layout> 255 </v-layout>
256 </v-flex> 256 </v-flex>
257 <v-flex xs12 sm6> 257 <v-flex xs12 sm6>
258 <v-layout> 258 <v-layout>
259 <v-flex xs4 sm4 class="pt-4 subheading"> 259 <v-flex xs4 sm4 class="pt-4 subheading">
260 <label class="right">Permanent Address:</label> 260 <label class="right">Permanent Address:</label>
261 </v-flex> 261 </v-flex>
262 <v-flex xs12 sm8 class="ml-3"> 262 <v-flex xs12 sm8 class="ml-3">
263 <v-text-field 263 <v-text-field
264 name="input-4-3" 264 name="input-4-3"
265 v-model="editedItem.permanentAddress" 265 v-model="editedItem.permanentAddress"
266 placeholder="fill Your Permanent Address" 266 placeholder="fill Your Permanent Address"
267 required 267 required
268 ></v-text-field> 268 ></v-text-field>
269 </v-flex> 269 </v-flex>
270 </v-layout> 270 </v-layout>
271 </v-flex> 271 </v-flex>
272 </v-layout> 272 </v-layout>
273 <v-layout class="hidden-lg-only hidden-md-only hidden-xl-only" wrap> 273 <v-layout class="hidden-lg-only hidden-md-only hidden-xl-only" wrap>
274 <v-flex xs12 sm12> 274 <v-flex xs12 sm12>
275 <v-layout> 275 <v-layout>
276 <v-flex xs12 sm3 class="pt-4 subheading text-xs-center"> 276 <v-flex xs12 sm3 class="pt-4 subheading text-xs-center">
277 <label class>Present Address:</label> 277 <label class>Present Address:</label>
278 </v-flex> 278 </v-flex>
279 </v-layout> 279 </v-layout>
280 <v-layout> 280 <v-layout>
281 <v-flex xs12 sm12> 281 <v-flex xs12 sm12>
282 <v-textarea 282 <v-textarea
283 name="input-4-3" 283 name="input-4-3"
284 v-model="editedItem.presentAddress" 284 v-model="editedItem.presentAddress"
285 placeholder="fill Your present Address" 285 placeholder="fill Your present Address"
286 required 286 required
287 ></v-textarea> 287 ></v-textarea>
288 </v-flex> 288 </v-flex>
289 </v-layout> 289 </v-layout>
290 </v-flex> 290 </v-flex>
291 <v-flex xs12 sm12> 291 <v-flex xs12 sm12>
292 <v-layout> 292 <v-layout>
293 <v-flex xs12 sm3 class="pt-4 pr-4 subheading text-xs-center addressForm"> 293 <v-flex xs12 sm3 class="pt-4 pr-4 subheading text-xs-center addressForm">
294 <label>Permanent Address:</label> 294 <label>Permanent Address:</label>
295 </v-flex> 295 </v-flex>
296 </v-layout> 296 </v-layout>
297 <v-layout> 297 <v-layout>
298 <v-flex xs12 sm12> 298 <v-flex xs12 sm12>
299 <v-textarea 299 <v-textarea
300 name="input-4-3" 300 name="input-4-3"
301 v-model="editedItem.permanentAddress" 301 v-model="editedItem.permanentAddress"
302 placeholder="fill Your Permanent Address" 302 placeholder="fill Your Permanent Address"
303 required 303 required
304 ></v-textarea> 304 ></v-textarea>
305 </v-flex> 305 </v-flex>
306 </v-layout> 306 </v-layout>
307 </v-flex> 307 </v-flex>
308 </v-layout> 308 </v-layout>
309 <v-layout> 309 <v-layout>
310 <v-flex xs12 sm12> 310 <v-flex xs12 sm12>
311 <v-flex xs12 sm12> 311 <v-flex xs12 sm12>
312 <v-layout class="right"> 312 <v-layout class="right">
313 <v-btn @click="save" round dark :loading="loading" class="add-button">Save</v-btn> 313 <v-btn @click="save" round dark :loading="loading" class="add-button">Save</v-btn>
314 </v-layout> 314 </v-layout>
315 </v-flex> 315 </v-flex>
316 </v-flex> 316 </v-flex>
317 </v-layout> 317 </v-layout>
318 </v-container> 318 </v-container>
319 </v-card-text> 319 </v-card-text>
320 </v-card> 320 </v-card>
321 </v-dialog> 321 </v-dialog>
322 322
323 <!-- ****** PROFILE VIEW TEACHERS DETAILS ****** --> 323 <!-- ****** PROFILE VIEW TEACHERS DETAILS ****** -->
324 324
325 <v-dialog v-model="viewTeacherProfileDialog" max-width="500px" scrollable> 325 <v-dialog v-model="viewTeacherProfileDialog" max-width="500px" scrollable>
326 <v-card flat class="card-style pa-3" dark> 326 <v-card flat class="card-style pa-3" dark>
327 <v-layout> 327 <v-layout>
328 <v-flex xs12> 328 <v-flex xs12>
329 <label class="title text-xs-center">View Class</label> 329 <label class="title text-xs-center">View Class</label>
330 <v-icon size="24" class="right" @click="viewTeacherProfileDialog = false">cancel</v-icon> 330 <v-icon size="24" class="right" @click="viewTeacherProfileDialog = false">cancel</v-icon>
331 </v-flex> 331 </v-flex>
332 </v-layout> 332 </v-layout>
333 <v-card-text> 333 <v-card-text>
334 <v-container grid-list-md> 334 <v-container grid-list-md>
335 <v-layout wrap> 335 <v-layout wrap>
336 <v-flex> 336 <v-flex>
337 <v-flex align-center justify-center layout text-xs-center> 337 <v-flex align-center justify-center layout text-xs-center>
338 <v-avatar size="80"> 338 <v-avatar size="80">
339 <img src="/static/icon/user.png" v-if="!editedItem.profilePicUrl" /> 339 <img src="/static/icon/user.png" v-if="!editedItem.profilePicUrl" />
340 <img :src="editedItem.profilePicUrl" v-else-if="editedItem.profilePicUrl" /> 340 <img :src="editedItem.profilePicUrl" v-else-if="editedItem.profilePicUrl" />
341 </v-avatar> 341 </v-avatar>
342 </v-flex> 342 </v-flex>
343 <v-layout> 343 <v-layout>
344 <v-flex xs5 sm6> 344 <v-flex xs5 sm6>
345 <h5 class="right my-1"> 345 <h5 class="right my-1">
346 <b>Full Name:</b> 346 <b>Full Name:</b>
347 </h5> 347 </h5>
348 </v-flex> 348 </v-flex>
349 <v-flex sm6 xs8> 349 <v-flex sm6 xs8>
350 <h5 class="my-1">{{ editedItem.name }}</h5> 350 <h5 class="my-1">{{ editedItem.name }}</h5>
351 </v-flex> 351 </v-flex>
352 </v-layout> 352 </v-layout>
353 <v-layout> 353 <v-layout>
354 <v-flex xs5 sm6> 354 <v-flex xs5 sm6>
355 <h5 class="right my-1"> 355 <h5 class="right my-1">
356 <b>Email:</b> 356 <b>Email:</b>
357 </h5> 357 </h5>
358 </v-flex> 358 </v-flex>
359 <v-flex sm6 xs8> 359 <v-flex sm6 xs8>
360 <h5 class="my-1">{{ editedItem.email }}</h5> 360 <h5 class="my-1">{{ editedItem.email }}</h5>
361 </v-flex> 361 </v-flex>
362 </v-layout> 362 </v-layout>
363 <v-layout> 363 <v-layout>
364 <v-flex xs5 sm6> 364 <v-flex xs5 sm6>
365 <h5 class="right my-1"> 365 <h5 class="right my-1">
366 <b>City:</b> 366 <b>City:</b>
367 </h5> 367 </h5>
368 </v-flex> 368 </v-flex>
369 <v-flex sm6 xs8> 369 <v-flex sm6 xs8>
370 <h5 class="my-1">{{ editedItem.city }}</h5> 370 <h5 class="my-1">{{ editedItem.city }}</h5>
371 </v-flex> 371 </v-flex>
372 </v-layout> 372 </v-layout>
373 <v-layout> 373 <v-layout>
374 <v-flex xs5 sm6> 374 <v-flex xs5 sm6>
375 <h5 class="right my-1"> 375 <h5 class="right my-1">
376 <b>State:</b> 376 <b>State:</b>
377 </h5> 377 </h5>
378 </v-flex> 378 </v-flex>
379 <v-flex sm6 xs8> 379 <v-flex sm6 xs8>
380 <h5 class="my-1">{{ editedItem.state }}</h5> 380 <h5 class="my-1">{{ editedItem.state }}</h5>
381 </v-flex> 381 </v-flex>
382 </v-layout> 382 </v-layout>
383 <v-layout> 383 <v-layout>
384 <v-flex xs5 sm6> 384 <v-flex xs5 sm6>
385 <h5 class="right my-1"> 385 <h5 class="right my-1">
386 <b>Country:</b> 386 <b>Country:</b>
387 </h5> 387 </h5>
388 </v-flex> 388 </v-flex>
389 <v-flex sm6 xs8> 389 <v-flex sm6 xs8>
390 <h5 class="my-1">{{ editedItem.country }}</h5> 390 <h5 class="my-1">{{ editedItem.country }}</h5>
391 </v-flex> 391 </v-flex>
392 </v-layout> 392 </v-layout>
393 <v-layout> 393 <v-layout>
394 <v-flex xs5 sm6> 394 <v-flex xs5 sm6>
395 <h5 class="right my-1"> 395 <h5 class="right my-1">
396 <b>Pincode:</b> 396 <b>Pincode:</b>
397 </h5> 397 </h5>
398 </v-flex> 398 </v-flex>
399 <v-flex sm6 xs8> 399 <v-flex sm6 xs8>
400 <h5 class="my-1">{{ editedItem.pincode }}</h5> 400 <h5 class="my-1">{{ editedItem.pincode }}</h5>
401 </v-flex> 401 </v-flex>
402 </v-layout> 402 </v-layout>
403 <v-layout> 403 <v-layout>
404 <v-flex xs5 sm6> 404 <v-flex xs5 sm6>
405 <h5 class="right my-1"> 405 <h5 class="right my-1">
406 <b>Mobile No:</b> 406 <b>Mobile No:</b>
407 </h5> 407 </h5>
408 </v-flex> 408 </v-flex>
409 <v-flex sm6 xs8> 409 <v-flex sm6 xs8>
410 <h5 class="my-1">{{ editedItem.mobileNo }}</h5> 410 <h5 class="my-1">{{ editedItem.mobileNo }}</h5>
411 </v-flex> 411 </v-flex>
412 </v-layout> 412 </v-layout>
413 <v-layout> 413 <v-layout>
414 <v-flex xs5 sm6> 414 <v-flex xs5 sm6>
415 <h5 class="right my-1"> 415 <h5 class="right my-1">
416 <b>Join Date:</b> 416 <b>Join Date:</b>
417 </h5> 417 </h5>
418 </v-flex> 418 </v-flex>
419 <v-flex sm6 xs8> 419 <v-flex sm6 xs8>
420 <h5 class="my-1">{{ dates(editedItem.joinDate) }}</h5> 420 <h5 class="my-1">{{ dates(editedItem.joinDate) }}</h5>
421 </v-flex> 421 </v-flex>
422 </v-layout> 422 </v-layout>
423 <v-layout> 423 <v-layout>
424 <v-flex xs5 sm6> 424 <v-flex xs5 sm6>
425 <h5 class="right my-1"> 425 <h5 class="right my-1">
426 <b>D.O.B :</b> 426 <b>D.O.B :</b>
427 </h5> 427 </h5>
428 </v-flex> 428 </v-flex>
429 <v-flex sm6 xs8> 429 <v-flex sm6 xs8>
430 <h5 class="my-1">{{ dates(editedItem.dob) }}</h5> 430 <h5 class="my-1">{{ dates(editedItem.dob) }}</h5>
431 </v-flex> 431 </v-flex>
432 </v-layout> 432 </v-layout>
433 <v-layout> 433 <v-layout>
434 <v-flex xs6 sm6> 434 <v-flex xs6 sm6>
435 <h5 class="right my-1"> 435 <h5 class="right my-1">
436 <b>Permanent Address:</b> 436 <b>Permanent Address:</b>
437 </h5> 437 </h5>
438 </v-flex> 438 </v-flex>
439 <v-flex sm6 xs8> 439 <v-flex sm6 xs8>
440 <h5 class="my-1">{{ editedItem.permanentAddress }}</h5> 440 <h5 class="my-1">{{ editedItem.permanentAddress }}</h5>
441 </v-flex> 441 </v-flex>
442 </v-layout> 442 </v-layout>
443 <v-layout> 443 <v-layout>
444 <v-flex xs6 sm6> 444 <v-flex xs6 sm6>
445 <h5 class="right my-1"> 445 <h5 class="right my-1">
446 <b>present Address:</b> 446 <b>present Address:</b>
447 </h5> 447 </h5>
448 </v-flex> 448 </v-flex>
449 <v-flex sm6 xs8> 449 <v-flex sm6 xs8>
450 <h5 class="my-1">{{ editedItem.presentAddress }}</h5> 450 <h5 class="my-1">{{ editedItem.presentAddress }}</h5>
451 </v-flex> 451 </v-flex>
452 </v-layout> 452 </v-layout>
453 </v-flex> 453 </v-flex>
454 </v-layout> 454 </v-layout>
455 </v-container> 455 </v-container>
456 </v-card-text> 456 </v-card-text>
457 </v-card> 457 </v-card>
458 </v-dialog> 458 </v-dialog>
459 <!-- ****** EXISTING-Teachers TABLE DATA****** --> 459 <!-- ****** EXISTING-Teachers TABLE DATA****** -->
460 <v-toolbar color="transparent" flat> 460 <v-toolbar color="transparent" flat>
461 <v-btn 461 <v-btn
462 fab 462 fab
463 dark 463 dark
464 class="open-dialog-button hidden-xl-only hidden-md-only hidden-lg-only" 464 class="open-dialog-button hidden-xl-only hidden-md-only hidden-lg-only"
465 small 465 small
466 @click="addTeacherDialog = true" 466 @click="addTeacherDialog = true"
467 > 467 >
468 <v-icon dark>add</v-icon> 468 <v-icon dark>add</v-icon>
469 </v-btn> 469 </v-btn>
470 <v-btn 470 <v-btn
471 round 471 round
472 class="open-dialog-button hidden-sm-only hidden-xs-only" 472 class="open-dialog-button hidden-sm-only hidden-xs-only"
473 dark 473 dark
474 @click="addTeacherDialog = true" 474 @click="addTeacherDialog = true"
475 > 475 >
476 <v-icon class="white--text pr-1" size="20">add</v-icon>Add Teacher 476 <v-icon class="white--text pr-1" size="20">add</v-icon>Add Teacher
477 </v-btn> 477 </v-btn>
478 <v-spacer></v-spacer> 478 <v-spacer></v-spacer>
479 <v-card-title class="body-1" v-show="show"> 479 <v-card-title class="body-1" v-show="show">
480 <v-btn icon large flat @click="displaySearch"> 480 <v-btn icon large flat @click="displaySearch">
481 <v-avatar size="27"> 481 <v-avatar size="27">
482 <img src="/static/icon/search.png" alt="icon" /> 482 <img src="/static/icon/search.png" alt="icon" />
483 </v-avatar> 483 </v-avatar>
484 </v-btn> 484 </v-btn>
485 </v-card-title> 485 </v-card-title>
486 <v-flex md2 lg2 sm6 xs8 v-show="showSearch"> 486 <v-flex md2 lg2 sm6 xs8 v-show="showSearch">
487 <v-layout> 487 <v-layout>
488 <v-text-field v-model="search" label="Search" prepend-inner-icon="search" color="primary"></v-text-field> 488 <v-text-field v-model="search" label="Search" prepend-inner-icon="search" color="primary"></v-text-field>
489 <v-icon @click="closeSearch" color="error">close</v-icon> 489 <v-icon @click="closeSearch" color="error">close</v-icon>
490 </v-layout> 490 </v-layout>
491 </v-flex> 491 </v-flex>
492 </v-toolbar> 492 </v-toolbar>
493 <v-data-table 493 <v-data-table
494 :headers="headers" 494 :headers="headers"
495 :items="desserts" 495 :items="desserts"
496 :pagination.sync="pagination" 496 :pagination.sync="pagination"
497 :search="search" 497 :search="search"
498 > 498 >
499 <template slot="items" slot-scope="props"> 499 <template slot="items" slot-scope="props">
500 <tr class="tr"> 500 <tr class="tr">
501 <td class="td td-row">{{ props.index + 1}}</td> 501 <td class="td td-row">{{ props.index + 1}}</td>
502 <td class="td td-row text-xs-center"> 502 <td class="td td-row text-xs-center">
503 <v-avatar size="40"> 503 <v-avatar size="40">
504 <img :src="props.item.profilePicUrl" v-if="props.item.profilePicUrl" /> 504 <img :src="props.item.profilePicUrl" v-if="props.item.profilePicUrl" />
505 <img src="/static/icon/user.png" v-else-if="!props.item.profilePicUrl" /> 505 <img src="/static/icon/user.png" v-else-if="!props.item.profilePicUrl" />
506 </v-avatar> 506 </v-avatar>
507 </td> 507 </td>
508 <td class="td td-row text-xs-center">{{ props.item.name}}</td> 508 <td class="td td-row text-xs-center">{{ props.item.name}}</td>
509 <td class="td td-row text-xs-center">{{ props.item.email }}</td> 509 <td class="td td-row text-xs-center">{{ props.item.email }}</td>
510 <td class="td td-row text-xs-center">{{ dates(props.item.dob) }}</td> 510 <td class="td td-row text-xs-center">{{ dates(props.item.dob) }}</td>
511 <td class="td td-row text-xs-center">{{ dates(props.item.joinDate)}}</td> 511 <td class="td td-row text-xs-center">{{ dates(props.item.joinDate)}}</td>
512 <td class="td td-row text-xs-center">{{ props.item.mobileNo }}</td> 512 <td class="td td-row text-xs-center">{{ props.item.mobileNo }}</td>
513 <td class="td td-row text-xs-center"> 513 <td class="td td-row text-xs-center">
514 <v-switch 514 <v-switch
515 class="pl-3" 515 class="pl-3"
516 v-model="props.item.status" 516 v-model="props.item.status"
517 @change="suspendStatus(props.item.status,props.item._id)" 517 @change="suspendStatus(props.item.status,props.item._id)"
518 ></v-switch> 518 ></v-switch>
519 </td> 519 </td>
520 <td class="text-xs-center td td-row"> 520 <td class="text-xs-center td td-row">
521 <span> 521 <span>
522 <v-tooltip top> 522 <v-tooltip top>
523 <img 523 <img
524 slot="activator" 524 slot="activator"
525 style="cursor:pointer; width:25px; height:25px; " 525 style="cursor:pointer; width:25px; height:25px; "
526 class="mr-3" 526 class="mr-3"
527 @click="profile(props.item)" 527 @click="profile(props.item)"
528 src="/static/icon/view.png" 528 src="/static/icon/view.png"
529 /> 529 />
530 <span>View</span> 530 <span>View</span>
531 </v-tooltip> 531 </v-tooltip>
532 <v-tooltip top> 532 <v-tooltip top>
533 <img 533 <img
534 slot="activator" 534 slot="activator"
535 style="cursor:pointer; width:20px; height:18px; " 535 style="cursor:pointer; width:20px; height:18px; "
536 class="mr-3" 536 class="mr-3"
537 @click="editItem(props.item)" 537 @click="editItem(props.item)"
538 src="/static/icon/edit.png" 538 src="/static/icon/edit.png"
539 /> 539 />
540 <span>Edit</span> 540 <span>Edit</span>
541 </v-tooltip> 541 </v-tooltip>
542 <v-tooltip top> 542 <v-tooltip top>
543 <img 543 <img
544 slot="activator" 544 slot="activator"
545 style="cursor:pointer; width:20px; height:20px; " 545 style="cursor:pointer; width:20px; height:20px; "
546 @click="deleteItem(props.item)" 546 @click="deleteItem(props.item)"
547 src="/static/icon/delete.png" 547 src="/static/icon/delete.png"
548 class="mr-3" 548 class="mr-3"
549 /> 549 />
550 <span>Delete</span> 550 <span>Delete</span>
551 </v-tooltip> 551 </v-tooltip>
552 </span> 552 </span>
553 </td> 553 </td>
554 </tr> 554 </tr>
555 </template> 555 </template>
556 <v-alert 556 <v-alert
557 slot="no-results" 557 slot="no-results"
558 :value="true" 558 :value="true"
559 color="error" 559 color="error"
560 icon="warning" 560 icon="warning"
561 >Your search for "{{ search }}" found no results.</v-alert> 561 >Your search for "{{ search }}" found no results.</v-alert>
562 </v-data-table> 562 </v-data-table>
563 563
564 <!-- ****** Add Teachers Data****** --> 564 <!-- ****** Add Teachers Data****** -->
565 <v-dialog v-model="addTeacherDialog" max-width="1160"> 565 <v-dialog v-model="addTeacherDialog" max-width="1160">
566 <v-card flat class="card-style pa-2" dark> 566 <v-card flat class="card-style pa-2" dark>
567 <v-layout> 567 <v-layout>
568 <v-flex xs12 class="pa-0"> 568 <v-flex xs12 class="pa-0">
569 <label class="title text-xs-center">Add Teacher</label> 569 <label class="title text-xs-center">Add Teacher</label>
570 <v-icon size="24" class="right" @click="addTeacherDialog = false">cancel</v-icon> 570 <v-icon size="24" class="right" @click="addTeacherDialog = false">cancel</v-icon>
571 </v-flex> 571 </v-flex>
572 </v-layout> 572 </v-layout>
573 <v-form ref="form" v-model="valid" lazy-validation> 573 <v-form ref="form" v-model="valid" lazy-validation>
574 <v-container fluid> 574 <v-container fluid>
575 <v-layout> 575 <v-layout>
576 <v-flex xs12 class="text-xs-center text-sm-center text-md-center text-lg-center my-4"> 576 <v-flex xs12 class="text-xs-center text-sm-center text-md-center text-lg-center my-4">
577 <v-avatar size="120px"> 577 <v-avatar size="120px">
578 <img src="/static/icon/user.png" v-if="!imageUrl" /> 578 <img src="/static/icon/user.png" v-if="!imageUrl" />
579 </v-avatar> 579 </v-avatar>
580 <img 580 <img
581 :src="imageUrl" 581 :src="imageUrl"
582 height="150" 582 height="150"
583 v-if="imageUrl" 583 v-if="imageUrl"
584 style="border-radius:50%; width:150px" 584 style="border-radius:50%; width:150px"
585 /> 585 />
586 </v-flex> 586 </v-flex>
587 </v-layout> 587 </v-layout>
588 <v-layout wrap> 588 <v-layout wrap>
589 <v-flex xs12 sm6> 589 <v-flex xs12 sm6>
590 <v-layout> 590 <v-layout>
591 <v-flex xs4 class="pt-4 subheading"> 591 <v-flex xs4 class="pt-4 subheading">
592 <label class="right hidden-sm-only hidden-xs-only">Full Name:</label> 592 <label class="right hidden-sm-only hidden-xs-only">Full Name:</label>
593 <label class="right hidden-lg-only hidden-xl-only hidden-md-only">Full Name</label> 593 <label class="right hidden-lg-only hidden-xl-only hidden-md-only">Full Name</label>
594 </v-flex> 594 </v-flex>
595 <v-flex xs8 class="ml-3"> 595 <v-flex xs8 class="ml-3">
596 <v-text-field 596 <v-text-field
597 v-model="addTeachers.name" 597 v-model="addTeachers.name"
598 placeholder="fill your full Name" 598 placeholder="fill your full Name"
599 name="name" 599 name="name"
600 type="text" 600 type="text"
601 :rules="nameRules" 601 :rules="nameRules"
602 required 602 required
603 ></v-text-field> 603 ></v-text-field>
604 </v-flex> 604 </v-flex>
605 </v-layout> 605 </v-layout>
606 </v-flex> 606 </v-flex>
607 <v-flex xs12 sm6> 607 <v-flex xs12 sm6>
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">Email ID:</label> 610 <label class="right">Email ID:</label>
611 </v-flex> 611 </v-flex>
612 <v-flex xs8 class="ml-3"> 612 <v-flex xs8 class="ml-3">
613 <v-text-field 613 <v-text-field
614 placeholder="fill your email" 614 placeholder="fill your email"
615 v-model="addTeachers.email" 615 v-model="addTeachers.email"
616 type="text" 616 type="text"
617 name="email" 617 name="email"
618 required 618 required
619 ></v-text-field> 619 ></v-text-field>
620 </v-flex> 620 </v-flex>
621 </v-layout> 621 </v-layout>
622 </v-flex> 622 </v-flex>
623 </v-layout> 623 </v-layout>
624 <v-layout wrap> 624 <v-layout wrap>
625 <v-flex xs12 sm6> 625 <v-flex xs12 sm6>
626 <v-layout> 626 <v-layout>
627 <v-flex xs4 sm4 class="pt-4 subheading"> 627 <v-flex xs4 sm4 class="pt-4 subheading">
628 <label class="right hidden-sm-only hidden-xs-only">Date of Birth:</label> 628 <label class="right hidden-sm-only hidden-xs-only">Date of Birth:</label>
629 <label class="right hidden-lg-only hidden-xl-only hidden-md-only">D.O.B:</label> 629 <label class="right hidden-lg-only hidden-xl-only hidden-md-only">D.O.B:</label>
630 </v-flex> 630 </v-flex>
631 <v-flex xs8 class="ml-3"> 631 <v-flex xs8 class="ml-3">
632 <v-menu 632 <v-menu
633 ref="menu" 633 ref="menu"
634 :close-on-content-click="false" 634 :close-on-content-click="false"
635 v-model="menu" 635 v-model="menu"
636 :nudge-right="40" 636 :nudge-right="40"
637 lazy 637 lazy
638 transition="scale-transition" 638 transition="scale-transition"
639 offset-y 639 offset-y
640 full-width 640 full-width
641 min-width="290px" 641 min-width="290px"
642 > 642 >
643 <v-text-field 643 <v-text-field
644 slot="activator" 644 slot="activator"
645 :rules="dateRules" 645 :rules="dateRules"
646 v-model="addTeachers.date" 646 v-model="addTeachers.date"
647 placeholder="Select date" 647 placeholder="Select date"
648 ></v-text-field> 648 ></v-text-field>
649 <v-date-picker 649 <v-date-picker
650 ref="picker" 650 ref="picker"
651 v-model="addTeachers.date" 651 v-model="addTeachers.date"
652 :max="new Date().toISOString().substr(0, 10)" 652 :max="new Date().toISOString().substr(0, 10)"
653 min="1950-01-01" 653 min="1950-01-01"
654 @input="menu = false" 654 @input="menu = false"
655 ></v-date-picker> 655 ></v-date-picker>
656 </v-menu> 656 </v-menu>
657 </v-flex> 657 </v-flex>
658 </v-layout> 658 </v-layout>
659 </v-flex> 659 </v-flex>
660 <v-flex xs12 sm6> 660 <v-flex xs12 sm6>
661 <v-layout> 661 <v-layout>
662 <v-flex xs4 class="pt-4 subheading"> 662 <v-flex xs4 class="pt-4 subheading">
663 <label class="right">City:</label> 663 <label class="right">City:</label>
664 </v-flex> 664 </v-flex>
665 <v-flex xs8 class="ml-3"> 665 <v-flex xs8 class="ml-3">
666 <v-text-field 666 <v-text-field
667 v-model="addTeachers.city" 667 v-model="addTeachers.city"
668 placeholder="fill your City Name" 668 placeholder="fill your City Name"
669 name="City" 669 name="City"
670 type="text" 670 type="text"
671 :rules="cityRules" 671 :rules="cityRules"
672 required 672 required
673 ></v-text-field> 673 ></v-text-field>
674 </v-flex> 674 </v-flex>
675 </v-layout> 675 </v-layout>
676 </v-flex> 676 </v-flex>
677 </v-layout> 677 </v-layout>
678 <v-layout wrap> 678 <v-layout wrap>
679 <v-flex xs12 sm6> 679 <v-flex xs12 sm6>
680 <v-layout> 680 <v-layout>
681 <v-flex xs4 class="pt-4 subheading"> 681 <v-flex xs4 class="pt-4 subheading">
682 <label class="right">State:</label> 682 <label class="right">State:</label>
683 </v-flex> 683 </v-flex>
684 <v-flex xs8 class="ml-3"> 684 <v-flex xs8 class="ml-3">
685 <v-text-field 685 <v-text-field
686 v-model="addTeachers.state" 686 v-model="addTeachers.state"
687 placeholder="fill your State Name" 687 placeholder="fill your State Name"
688 name="state" 688 name="state"
689 type="text" 689 type="text"
690 :rules="stateRules" 690 :rules="stateRules"
691 required 691 required
692 ></v-text-field> 692 ></v-text-field>
693 </v-flex> 693 </v-flex>
694 </v-layout> 694 </v-layout>
695 </v-flex> 695 </v-flex>
696 <v-flex xs12 sm6> 696 <v-flex xs12 sm6>
697 <v-layout> 697 <v-layout>
698 <v-flex xs4 class="pt-4 subheading"> 698 <v-flex xs4 class="pt-4 subheading">
699 <label class="right">PinCode:</label> 699 <label class="right">PinCode:</label>
700 </v-flex> 700 </v-flex>
701 <v-flex xs8 class="ml-3"> 701 <v-flex xs8 class="ml-3">
702 <v-text-field 702 <v-text-field
703 v-model="addTeachers.pincode" 703 v-model="addTeachers.pincode"
704 placeholder="fill your pincode" 704 placeholder="fill your pincode"
705 name="pincode" 705 name="pincode"
706 type="number" 706 type="number"
707 :rules="pincode" 707 :rules="pincode"
708 required 708 required
709 ></v-text-field> 709 ></v-text-field>
710 </v-flex> 710 </v-flex>
711 </v-layout> 711 </v-layout>
712 </v-flex> 712 </v-flex>
713 </v-layout> 713 </v-layout>
714 <v-layout wrap> 714 <v-layout wrap>
715 <v-flex xs12 sm6> 715 <v-flex xs12 sm6>
716 <v-layout> 716 <v-layout>
717 <v-flex xs4 class="pt-4 subheading"> 717 <v-flex xs4 class="pt-4 subheading">
718 <label class="right hidden-xs-only hidden-sm-only">Mobile No:</label> 718 <label class="right hidden-xs-only hidden-sm-only">Mobile No:</label>
719 <label class="right hidden-lg-only hidden-md-only hidden-xl-only">Mobile:</label> 719 <label class="right hidden-lg-only hidden-md-only hidden-xl-only">Mobile:</label>
720 </v-flex> 720 </v-flex>
721 <v-flex xs8 class="ml-3"> 721 <v-flex xs8 class="ml-3">
722 <v-text-field 722 <v-text-field
723 v-model="addTeachers.mobileNo" 723 v-model="addTeachers.mobileNo"
724 placeholder="fill your Mobile No." 724 placeholder="fill your Mobile No."
725 name="mobileNo" 725 name="mobileNo"
726 type="number" 726 type="number"
727 :rules="mobileNoRules" 727 :rules="mobileNoRules"
728 required 728 required
729 ></v-text-field> 729 ></v-text-field>
730 </v-flex> 730 </v-flex>
731 </v-layout> 731 </v-layout>
732 </v-flex> 732 </v-flex>
733 <v-flex xs12 sm6> 733 <v-flex xs12 sm6>
734 <v-layout> 734 <v-layout>
735 <v-flex xs4 class="pt-4 subheading"> 735 <v-flex xs4 class="pt-4 subheading">
736 <label class="right hidden-xs-only hidden-sm-only">Select Country:</label> 736 <label class="right hidden-xs-only hidden-sm-only">Select Country:</label>
737 <label class="right hidden-lg-only hidden-md-only hidden-xl-only">Country:</label> 737 <label class="right hidden-lg-only hidden-md-only hidden-xl-only">Country:</label>
738 </v-flex> 738 </v-flex>
739 <v-flex xs8 class="ml-3"> 739 <v-flex xs8 class="ml-3">
740 <v-autocomplete 740 <v-autocomplete
741 v-model="addTeachers.country" 741 v-model="addTeachers.country"
742 :rules="country" 742 :rules="country"
743 :items="countries" 743 :items="countries"
744 placeholder="Select Country Name" 744 placeholder="Select Country Name"
745 required 745 required
746 ></v-autocomplete> 746 ></v-autocomplete>
747 </v-flex> 747 </v-flex>
748 </v-layout> 748 </v-layout>
749 </v-flex> 749 </v-flex>
750 </v-layout> 750 </v-layout>
751 <v-layout wrap> 751 <v-layout wrap>
752 <v-flex xs12 sm6> 752 <v-flex xs12 sm6>
753 <v-layout> 753 <v-layout>
754 <v-flex xs4 class="pt-4 subheading"> 754 <v-flex xs4 class="pt-4 subheading">
755 <label class="right">Join Date:</label> 755 <label class="right">Join Date:</label>
756 </v-flex> 756 </v-flex>
757 <v-flex xs8 class="ml-3"> 757 <v-flex xs8 class="ml-3">
758 <v-menu 758 <v-menu
759 ref="menu1" 759 ref="menu1"
760 :close-on-content-click="false" 760 :close-on-content-click="false"
761 v-model="menu1" 761 v-model="menu1"
762 :nudge-right="40" 762 :nudge-right="40"
763 lazy 763 lazy
764 transition="scale-transition" 764 transition="scale-transition"
765 offset-y 765 offset-y
766 full-width 766 full-width
767 min-width="290px" 767 min-width="290px"
768 > 768 >
769 <v-text-field 769 <v-text-field
770 slot="activator" 770 slot="activator"
771 :rules="joinDateRules" 771 :rules="joinDateRules"
772 v-model="addTeachers.joinDate" 772 v-model="addTeachers.joinDate"
773 placeholder="Select date" 773 placeholder="Select date"
774 ></v-text-field> 774 ></v-text-field>
775 <v-date-picker 775 <v-date-picker
776 ref="picker" 776 ref="picker"
777 v-model="addTeachers.joinDate" 777 v-model="addTeachers.joinDate"
778 :max="new Date().toISOString().substr(0, 10)" 778 :max="new Date().toISOString().substr(0, 10)"
779 min="1950-01-01" 779 min="1950-01-01"
780 @input="menu1 = false" 780 @input="menu1 = false"
781 ></v-date-picker> 781 ></v-date-picker>
782 </v-menu> 782 </v-menu>
783 </v-flex> 783 </v-flex>
784 </v-layout> 784 </v-layout>
785 </v-flex> 785 </v-flex>
786 <v-flex xs12 sm6> 786 <v-flex xs12 sm6>
787 <v-layout> 787 <v-layout>
788 <v-flex xs4 class="pt-4 subheading"> 788 <v-flex xs4 class="pt-4 subheading">
789 <label class="right hidden-xs-only hidden-sm-only">Uplaod Image:</label> 789 <label class="right hidden-xs-only hidden-sm-only">Uplaod Image:</label>
790 <label class="right hidden-lg-only hidden-md-only hidden-xl-only">Uplaod:</label> 790 <label class="right hidden-lg-only hidden-md-only hidden-xl-only">Uplaod:</label>
791 </v-flex> 791 </v-flex>
792 <v-flex xs8 class="ml-3"> 792 <v-flex xs8 class="ml-3">
793 <v-text-field 793 <v-text-field
794 label="Select Image" 794 label="Select Image"
795 @click="pickFile" 795 @click="pickFile"
796 v-model="imageName" 796 v-model="imageName"
797 append-icon="attach_file" 797 append-icon="attach_file"
798 ></v-text-field> 798 ></v-text-field>
799 <input 799 <input
800 type="file" 800 type="file"
801 style="display:none" 801 style="display:none"
802 ref="image" 802 ref="image"
803 accept="image/*" 803 accept="image/*"
804 @change="onFilePicked" 804 @change="onFilePicked"
805 /> 805 />
806 </v-flex> 806 </v-flex>
807 </v-layout> 807 </v-layout>
808 </v-flex> 808 </v-flex>
809 </v-layout> 809 </v-layout>
810 <v-layout class="hidden-xs-only hidden-sm-only"> 810 <v-layout class="hidden-xs-only hidden-sm-only">
811 <v-flex xs12 sm6> 811 <v-flex xs12 sm6>
812 <v-layout> 812 <v-layout>
813 <v-flex xs4 md4 class="pt-4 subheading"> 813 <v-flex xs4 md4 class="pt-4 subheading">
814 <label class="right">Present Address:</label> 814 <label class="right">Present Address:</label>
815 </v-flex> 815 </v-flex>
816 <v-flex xs8 md8 class="ml-3"> 816 <v-flex xs8 md8 class="ml-3">
817 <v-text-field 817 <v-text-field
818 name="input-4-3" 818 name="input-4-3"
819 v-model="addTeachers.presentAddress" 819 v-model="addTeachers.presentAddress"
820 :rules="presentAddress" 820 :rules="presentAddress"
821 placeholder="fill Your present Address" 821 placeholder="fill Your present Address"
822 @keyup="copyData" 822 @keyup="copyData"
823 ></v-text-field> 823 ></v-text-field>
824 </v-flex> 824 </v-flex>
825 </v-layout> 825 </v-layout>
826 </v-flex> 826 </v-flex>
827 <v-flex xs12 sm6> 827 <v-flex xs12 sm6>
828 <v-layout> 828 <v-layout>
829 <v-flex xs4 md4 class="pt-4 subheading addressForm"> 829 <v-flex xs4 md4 class="pt-4 subheading addressForm">
830 <label class="right">Permanent Address:</label> 830 <label class="right">Permanent Address:</label>
831 </v-flex> 831 </v-flex>
832 <v-flex xs12 md8 class="ml-3"> 832 <v-flex xs12 md8 class="ml-3">
833 <v-switch 833 <v-switch
834 v-model="addTeachers.permanentAddress" 834 v-model="addTeachers.permanentAddress"
835 label="Select Permanent Address" 835 label="Select Permanent Address"
836 :value="addTeachers.presentAddress" 836 :value="addTeachers.presentAddress"
837 ></v-switch> 837 ></v-switch>
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 class="hidden-xs-only hidden-sm-only"> 842 <v-layout class="hidden-xs-only hidden-sm-only">
843 <v-flex xs12 sm6> 843 <v-flex xs12 sm6>
844 <v-layout> 844 <v-layout>
845 <v-flex xs4 md4 class="pt-4 subheading addressForm"> 845 <v-flex xs4 md4 class="pt-4 subheading addressForm">
846 <label class="right">Permanent Address:</label> 846 <label class="right">Permanent Address:</label>
847 </v-flex> 847 </v-flex>
848 <v-flex xs12 md8 class="ml-3"> 848 <v-flex xs12 md8 class="ml-3">
849 <v-text-field 849 <v-text-field
850 name="input-4-3" 850 name="input-4-3"
851 v-model="addTeachers.permanentAddress" 851 v-model="addTeachers.permanentAddress"
852 :rules="permanentAddress" 852 :rules="permanentAddress"
853 placeholder="fill Your Permanent Address" 853 placeholder="fill Your Permanent Address"
854 required 854 required
855 ></v-text-field> 855 ></v-text-field>
856 </v-flex> 856 </v-flex>
857 </v-layout> 857 </v-layout>
858 </v-flex> 858 </v-flex>
859 </v-layout> 859 </v-layout>
860 <v-layout class="hidden-lg-only hidden-md-only hidden-xl-only" wrap> 860 <v-layout class="hidden-lg-only hidden-md-only hidden-xl-only" wrap>
861 <v-flex xs12 sm12> 861 <v-flex xs12 sm12>
862 <v-layout> 862 <v-layout>
863 <v-flex xs12 sm12 class="pt-4 subheading text-xs-center"> 863 <v-flex xs12 sm12 class="pt-4 subheading text-xs-center">
864 <label class>Present Addres:</label> 864 <label class>Present Addres:</label>
865 </v-flex> 865 </v-flex>
866 </v-layout> 866 </v-layout>
867 <v-layout> 867 <v-layout>
868 <v-flex xs12 sm12> 868 <v-flex xs12 sm12>
869 <v-textarea 869 <v-textarea
870 name="input-4-3" 870 name="input-4-3"
871 v-model="addTeachers.presentAddress" 871 v-model="addTeachers.presentAddress"
872 :rules="presentAddress" 872 :rules="presentAddress"
873 placeholder="fill Your present Address" 873 placeholder="fill Your present Address"
874 required 874 required
875 ></v-textarea> 875 ></v-textarea>
876 </v-flex> 876 </v-flex>
877 </v-layout> 877 </v-layout>
878 </v-flex> 878 </v-flex>
879 <v-flex xs12 sm12> 879 <v-flex xs12 sm12>
880 <v-layout> 880 <v-layout>
881 <v-flex xs12 sm12 class="pt-4 pr-4 subheading text-xs-center addressForm"> 881 <v-flex xs12 sm12 class="pt-4 pr-4 subheading text-xs-center addressForm">
882 <label>Permanent Address:</label> 882 <label>Permanent Address:</label>
883 </v-flex> 883 </v-flex>
884 </v-layout> 884 </v-layout>
885 <v-layout> 885 <v-layout>
886 <v-flex xs12 sm12> 886 <v-flex xs12 sm12>
887 <v-textarea 887 <v-textarea
888 name="input-4-3" 888 name="input-4-3"
889 v-model="addTeachers.permanentAddress" 889 v-model="addTeachers.permanentAddress"
890 :rules="permanentAddress" 890 :rules="permanentAddress"
891 placeholder="fill Your Permanent Address" 891 placeholder="fill Your Permanent Address"
892 required 892 required
893 ></v-textarea> 893 ></v-textarea>
894 </v-flex> 894 </v-flex>
895 </v-layout> 895 </v-layout>
896 </v-flex> 896 </v-flex>
897 </v-layout> 897 </v-layout>
898 <v-layout> 898 <v-layout>
899 <v-flex xs12 sm12> 899 <v-flex xs12 sm12>
900 <v-layout class="right"> 900 <v-layout class="right">
901 <v-btn @click="clear" round dark class="clear-button">Clear</v-btn> 901 <v-btn @click="clear" round dark class="clear-button">Clear</v-btn>
902 <v-btn @click="submit" round dark :loading="loading" class="add-button">Add</v-btn> 902 <v-btn @click="submit" round dark :loading="loading" class="add-button">Add</v-btn>
903 </v-layout> 903 </v-layout>
904 </v-flex> 904 </v-flex>
905 </v-layout> 905 </v-layout>
906 </v-container> 906 </v-container>
907 </v-form> 907 </v-form>
908 </v-card> 908 </v-card>
909 </v-dialog> 909 </v-dialog>
910 <div class="loader" v-if="showLoader"> 910 <div class="loader" v-if="showLoader">
911 <v-progress-circular indeterminate color="white"></v-progress-circular> 911 <v-progress-circular indeterminate color="white"></v-progress-circular>
912 </div> 912 </div>
913 </v-container> 913 </v-container>
914 </template> 914 </template>
915 915
916 <script> 916 <script>
917 import http from "@/Services/http.js"; 917 import http from "@/Services/http.js";
918 import moment from "moment"; 918 import moment from "moment";
919 import countryList from "@/script/country.js"; 919 import countryList from "@/script/country.js";
920 920
921 export default { 921 export default {
922 data: () => ({ 922 data: () => ({
923 component: "report-generate", 923 component: "report-generate",
924 snackbar: false, 924 snackbar: false,
925 y: "top", 925 y: "top",
926 x: "right", 926 x: "right",
927 mode: "", 927 mode: "",
928 timeout: 3000, 928 timeout: 3000,
929 text: "", 929 text: "",
930 color: "", 930 color: "",
931 showLoader: false, 931 showLoader: false,
932 loading: false, 932 loading: false,
933 date: null, 933 date: null,
934 search: "", 934 search: "",
935 show: true, 935 show: true,
936 showSearch: false, 936 showSearch: false,
937 menu: false, 937 menu: false,
938 menu1: false, 938 menu1: false,
939 menu2: false, 939 menu2: false,
940 menu3: false, 940 menu3: false,
941 editTeacherDialog: false, 941 editTeacherDialog: false,
942 viewTeacherProfileDialog: false, 942 viewTeacherProfileDialog: false,
943 addTeacherDialog: false, 943 addTeacherDialog: false,
944 valid: true, 944 valid: true,
945 pagination: { 945 pagination: {
946 rowsPerPage: 10 946 rowsPerPage: 10
947 }, 947 },
948 imageData: {}, 948 imageData: {},
949 imageName: "", 949 imageName: "",
950 imageUrl: "", 950 imageUrl: "",
951 imageFile: "", 951 imageFile: "",
952 nameRules: [v => !!v || " Full Name is required"], 952 nameRules: [v => !!v || " Full Name is required"],
953 dateRules: [v => !!v || " DOB is required"], 953 dateRules: [v => !!v || " DOB is required"],
954 cityRules: [v => !!v || " City Name is required"], 954 cityRules: [v => !!v || " City Name is required"],
955 pincode: [v => !!v || " Pincode is required"], 955 pincode: [v => !!v || " Pincode is required"],
956 country: [v => !!v || " Country Name is required"], 956 country: [v => !!v || " Country Name is required"],
957 permanentAddress: [v => !!v || " Permanent Address is required"], 957 permanentAddress: [v => !!v || " Permanent Address is required"],
958 presentAddress: [v => !!v || " Present Address is required"], 958 presentAddress: [v => !!v || " Present Address is required"],
959 mobileNoRules: [v => !!v || "Mobile Number is required"], 959 mobileNoRules: [v => !!v || "Mobile Number is required"],
960 stateRules: [v => !!v || "State Name is required"], 960 stateRules: [v => !!v || "State Name is required"],
961 joinDateRules: [v => !!v || " Join Date is required"], 961 joinDateRules: [v => !!v || " Join Date is required"],
962 errorMessages: "", 962 errorMessages: "",
963 switch1: true, 963 switch1: true,
964 countries: [], 964 countries: [],
965 headers: [ 965 headers: [
966 { 966 {
967 text: "No", 967 text: "No",
968 align: "", 968 align: "",
969 sortable: false, 969 sortable: false,
970 value: "No" 970 value: "No"
971 }, 971 },
972 { 972 {
973 text: "Profile Pic", 973 text: "Profile Pic",
974 value: "profilePicUrl", 974 value: "profilePicUrl",
975 sortable: false, 975 sortable: false,
976 align: "center" 976 align: "center"
977 }, 977 },
978 { text: "Name", value: "name", sortable: false, align: "center" }, 978 { text: "Name", value: "name", sortable: false, align: "center" },
979 { text: "Email", value: "email", sortable: false, align: "center" }, 979 { text: "Email", value: "email", sortable: false, align: "center" },
980 { text: "DOB", value: "dob", sortable: false, align: "center" }, 980 { text: "DOB", value: "dob", sortable: false, align: "center" },
981 { 981 {
982 text: "Join Date", 982 text: "Join Date",
983 value: "joinDate", 983 value: "joinDate",
984 sortable: false, 984 sortable: false,
985 align: "center" 985 align: "center"
986 }, 986 },
987 { 987 {
988 text: "Mobile No", 988 text: "Mobile No",
989 value: "mobileNo", 989 value: "mobileNo",
990 sortable: false, 990 sortable: false,
991 align: "center" 991 align: "center"
992 }, 992 },
993 { 993 {
994 text: "Status", 994 text: "Status",
995 value: "status", 995 value: "status",
996 sortable: false, 996 sortable: false,
997 align: "center" 997 align: "center"
998 }, 998 },
999 { text: "Action", value: "", sortable: false, align: "center" } 999 { text: "Action", value: "", sortable: false, align: "center" }
1000 ], 1000 ],
1001 desserts: [], 1001 desserts: [],
1002 editedIndex: -1, 1002 editedIndex: -1,
1003 upload: "", 1003 upload: "",
1004 editedItem: { 1004 editedItem: {
1005 role: "TEACHER", 1005 role: "TEACHER",
1006 name: "", 1006 name: "",
1007 email: "", 1007 email: "",
1008 date: null, 1008 date: null,
1009 city: "", 1009 city: "",
1010 pincode: "", 1010 pincode: "",
1011 country: "", 1011 country: "",
1012 permanentAddress: "", 1012 permanentAddress: "",
1013 presentAddress: "", 1013 presentAddress: "",
1014 mobileNo: "", 1014 mobileNo: "",
1015 state: "", 1015 state: "",
1016 joinDate: null 1016 joinDate: null
1017 }, 1017 },
1018 addTeachers: { 1018 addTeachers: {
1019 role: "TEACHER", 1019 role: "TEACHER",
1020 name: "", 1020 name: "",
1021 email: "", 1021 email: "",
1022 date: null, 1022 date: null,
1023 city: "", 1023 city: "",
1024 pincode: "", 1024 pincode: "",
1025 country: "", 1025 country: "",
1026 permanentAddress: "", 1026 permanentAddress: "",
1027 presentAddress: "", 1027 presentAddress: "",
1028 mobileNo: "", 1028 mobileNo: "",
1029 state: "", 1029 state: "",
1030 joinDate: null 1030 joinDate: null
1031 }, 1031 },
1032 status: "" 1032 status: ""
1033 }), 1033 }),
1034 watch: { 1034 watch: {
1035 menu(val) { 1035 menu(val) {
1036 val && this.$nextTick(() => (this.$refs.picker.activePicker = "YEAR")); 1036 val && this.$nextTick(() => (this.$refs.picker.activePicker = "YEAR"));
1037 }, 1037 },
1038 menu1(val) { 1038 menu1(val) {
1039 val && this.$nextTick(() => (this.$refs.picker.activePicker = "YEAR")); 1039 val && this.$nextTick(() => (this.$refs.picker.activePicker = "YEAR"));
1040 } 1040 }
1041 }, 1041 },
1042 methods: { 1042 methods: {
1043 save(date) { 1043 save(date) {
1044 this.$refs.menu.save(date); 1044 this.$refs.menu.save(date);
1045 }, 1045 },
1046 save(date) { 1046 save(date) {
1047 this.$refs.menu1.save(date); 1047 this.$refs.menu1.save(date);
1048 }, 1048 },
1049 pickFile() { 1049 pickFile() {
1050 this.$refs.image.click(); 1050 this.$refs.image.click();
1051 }, 1051 },
1052 onFilePicked(e) { 1052 onFilePicked(e) {
1053 const files = e.target.files; 1053 const files = e.target.files;
1054 this.upload = e.target.files[0]; 1054 this.upload = e.target.files[0];
1055 if (files[0] !== undefined) { 1055 if (files[0] !== undefined) {
1056 this.imageName = files[0].name; 1056 this.imageName = files[0].name;
1057 if (this.imageName.lastIndexOf(".") <= 0) { 1057 if (this.imageName.lastIndexOf(".") <= 0) {
1058 return; 1058 return;
1059 } 1059 }
1060 const fr = new FileReader(); 1060 const fr = new FileReader();
1061 fr.readAsDataURL(files[0]); 1061 fr.readAsDataURL(files[0]);
1062 fr.addEventListener("load", () => { 1062 fr.addEventListener("load", () => {
1063 this.imageUrl = fr.result; 1063 this.imageUrl = fr.result;
1064 this.imageFile = files[0]; // this is an image file that can be sent to server... 1064 this.imageFile = files[0]; // this is an image file that can be sent to server...
1065 }); 1065 });
1066 } else { 1066 } else {
1067 this.imageName = ""; 1067 this.imageName = "";
1068 this.imageFile = ""; 1068 this.imageFile = "";
1069 this.imageUrl = ""; 1069 this.imageUrl = "";
1070 } 1070 }
1071 }, 1071 },
1072 dates: function(date) { 1072 dates: function(date) {
1073 return moment(date).format("MMMM DD, YYYY"); 1073 return moment(date).format("MMMM DD, YYYY");
1074 }, 1074 },
1075 getTeacherList() { 1075 getTeacherList() {
1076 this.showLoader = true; 1076 this.showLoader = true;
1077 var token = this.$store.state.token; 1077 var token = this.$store.state.token;
1078 http() 1078 http()
1079 .get("/getTeachersList", { 1079 .get("/getTeachersList", {
1080 headers: { Authorization: "Bearer " + token } 1080 headers: { Authorization: "Bearer " + token }
1081 }) 1081 })
1082 .then(response => { 1082 .then(response => {
1083 this.desserts = response.data.data; 1083 this.desserts = response.data.data;
1084 this.showLoader = false; 1084 this.showLoader = false;
1085 // console.log("getTeacherList=====>",this.desserts) 1085 // console.log("getTeacherList=====>",this.desserts)
1086 }) 1086 })
1087 .catch(error => { 1087 .catch(error => {
1088 this.showLoader = false; 1088 this.showLoader = false;
1089 if (error.response.status === 401) { 1089 if (error.response.status === 401) {
1090 this.$router.replace({ path: "/" }); 1090 this.$router.replace({ path: "/" });
1091 this.$store.dispatch("setToken", null); 1091 this.$store.dispatch("setToken", null);
1092 this.$store.dispatch("Id", null); 1092 this.$store.dispatch("Id", null);
1093 } 1093 }
1094 }); 1094 });
1095 }, 1095 },
1096 editItem(item) { 1096 editItem(item) {
1097 this.editedIndex = this.desserts.indexOf(item); 1097 this.editedIndex = this.desserts.indexOf(item);
1098 this.editedItem = Object.assign({}, item); 1098 this.editedItem = Object.assign({}, item);
1099 this.editedItem.dob = 1099 this.editedItem.dob =
1100 this.editedItem.dob != undefined 1100 this.editedItem.dob != undefined
1101 ? (this.editedItem.dob = this.editedItem.dob.substring(0, 10)) 1101 ? (this.editedItem.dob = this.editedItem.dob.substring(0, 10))
1102 : (this.editedItem.dob = ""); 1102 : (this.editedItem.dob = "");
1103 this.editedItem.joinDate = 1103 this.editedItem.joinDate =
1104 this.editedItem.joinDate != undefined 1104 this.editedItem.joinDate != undefined
1105 ? (this.editedItem.joinDate = this.editedItem.joinDate.substring( 1105 ? (this.editedItem.joinDate = this.editedItem.joinDate.substring(
1106 0, 1106 0,
1107 10 1107 10
1108 )) 1108 ))
1109 : (this.editedItem.joinDate = ""); 1109 : (this.editedItem.joinDate = "");
1110 1110
1111 this.editTeacherDialog = true; 1111 this.editTeacherDialog = true;
1112 }, 1112 },
1113 profile(item) { 1113 profile(item) {
1114 this.editedIndex = this.desserts.indexOf(item); 1114 this.editedIndex = this.desserts.indexOf(item);
1115 this.editedItem = Object.assign({}, item); 1115 this.editedItem = Object.assign({}, item);
1116 this.viewTeacherProfileDialog = true; 1116 this.viewTeacherProfileDialog = true;
1117 }, 1117 },
1118 deleteItem(item) { 1118 deleteItem(item) {
1119 let deleteTeachers = { 1119 let deleteTeachers = {
1120 teacherId: item._id 1120 teacherId: item._id
1121 }; 1121 };
1122 http() 1122 http()
1123 .delete( 1123 .delete(
1124 "/deleteTeacher", 1124 "/deleteTeacher",
1125 confirm("Are you sure you want to delete this?") && { 1125 confirm("Are you sure you want to delete this?") && {
1126 params: deleteTeachers 1126 params: deleteTeachers
1127 } 1127 }
1128 ) 1128 )
1129 .then(response => { 1129 .then(response => {
1130 this.snackbar = true; 1130 this.snackbar = true;
1131 this.text = "Successfully delete Existing Teacher"; 1131 this.text = "Successfully delete Existing Teacher";
1132 this.color = "green"; 1132 this.color = "green";
1133 this.getTeacherList(); 1133 this.getTeacherList();
1134 }) 1134 })
1135 .catch(error => { 1135 .catch(error => {
1136 this.snackbar = true; 1136 this.snackbar = true;
1137 this.text = error.response.data.message; 1137 this.text = error.response.data.message;
1138 this.color = "error"; 1138 this.color = "error";
1139 }); 1139 });
1140 }, 1140 },
1141 closeEditTeacherDialog() { 1141 closeEditTeacherDialog() {
1142 this.editTeacherDialog = false; 1142 this.editTeacherDialog = false;
1143 }, 1143 },
1144 close1() { 1144 close1() {
1145 this.viewTeacherProfileDialog = false; 1145 this.viewTeacherProfileDialog = false;
1146 }, 1146 },
1147 copyData() { 1147 copyData() {
1148 this.addTeachers.permanentAddress = this.addTeachers.presentAddress; 1148 this.addTeachers.permanentAddress = this.addTeachers.presentAddress;
1149 }, 1149 },
1150 submit() { 1150 submit() {
1151 if (this.$refs.form.validate()) { 1151 if (this.$refs.form.validate()) {
1152 let addTeacher = { 1152 let addTeacher = {
1153 name: this.addTeachers.name, 1153 name: this.addTeachers.name,
1154 email: this.addTeachers.email, 1154 email: this.addTeachers.email,
1155 role: this.addTeachers.role, 1155 role: this.addTeachers.role,
1156 dob: this.addTeachers.date, 1156 dob: this.addTeachers.date,
1157 city: this.addTeachers.city, 1157 city: this.addTeachers.city,
1158 pincode: this.addTeachers.pincode, 1158 pincode: this.addTeachers.pincode,
1159 country: this.addTeachers.country, 1159 country: this.addTeachers.country,
1160 permanentAddress: this.addTeachers.permanentAddress, 1160 permanentAddress: this.addTeachers.permanentAddress,
1161 presentAddress: this.addTeachers.presentAddress, 1161 presentAddress: this.addTeachers.presentAddress,
1162 mobileNo: this.addTeachers.mobileNo, 1162 mobileNo: this.addTeachers.mobileNo,
1163 state: this.addTeachers.state, 1163 state: this.addTeachers.state,
1164 joinDate: this.addTeachers.joinDate 1164 joinDate: this.addTeachers.joinDate
1165 }; 1165 };
1166 if (this.imageUrl) { 1166 if (this.imageUrl) {
1167 var str = this.imageUrl; 1167 var str = this.imageUrl;
1168 const [baseUrl, imageUrl] = str.split(/,/); 1168 const [baseUrl, imageUrl] = str.split(/,/);
1169 addTeacher.upload = imageUrl; 1169 addTeacher.upload = imageUrl;
1170 } 1170 }
1171 this.loading = true; 1171 this.loading = true;
1172 http() 1172 http()
1173 .post("/createTeacher", addTeacher) 1173 .post("/createTeacher", addTeacher)
1174 .then(response => { 1174 .then(response => {
1175 this.imageUrl = ""; 1175 this.imageUrl = "";
1176 this.getTeacherList(); 1176 this.getTeacherList();
1177 this.snackbar = true; 1177 this.snackbar = true;
1178 this.text = "New Teacher added successfully"; 1178 this.text = "New Teacher added successfully";
1179 this.color = "green"; 1179 this.color = "green";
1180 this.clear(); 1180 this.clear();
1181 this.loading = false; 1181 this.loading = false;
1182 this.addTeacherDialog = false; 1182 this.addTeacherDialog = false;
1183 }) 1183 })
1184 .catch(error => { 1184 .catch(error => {
1185 this.snackbar = true; 1185 this.snackbar = true;
1186 this.text = error.response.data.message; 1186 this.text = error.response.data.message;
1187 this.color = "error"; 1187 this.color = "error";
1188 this.loading = false; 1188 this.loading = false;
1189 }); 1189 });
1190 } 1190 }
1191 }, 1191 },
1192 clear() { 1192 clear() {
1193 this.$refs.form.reset(); 1193 this.$refs.form.reset();
1194 this.imageUrl = ""; 1194 this.imageUrl = "";
1195 }, 1195 },
1196 save() { 1196 save() {
1197 this.loading = true; 1197 this.loading = true;
1198 let editTeacher = { 1198 let editTeacher = {
1199 teacherId: this.editedItem._id, 1199 teacherId: this.editedItem._id,
1200 name: this.editedItem.name, 1200 name: this.editedItem.name,
1201 email: this.editedItem.email, 1201 email: this.editedItem.email,
1202 role: this.editedItem.role, 1202 role: this.editedItem.role,
1203 dob: this.editedItem.dob, 1203 dob: this.editedItem.dob,
1204 city: this.editedItem.city, 1204 city: this.editedItem.city,
1205 pincode: this.editedItem.pincode, 1205 pincode: this.editedItem.pincode,
1206 country: this.editedItem.country, 1206 country: this.editedItem.country,
1207 permanentAddress: this.editedItem.permanentAddress, 1207 permanentAddress: this.editedItem.permanentAddress,
1208 presentAddress: this.editedItem.presentAddress, 1208 presentAddress: this.editedItem.presentAddress,
1209 mobileNo: this.editedItem.mobileNo, 1209 mobileNo: this.editedItem.mobileNo,
1210 state: this.editedItem.state, 1210 state: this.editedItem.state,
1211 joinDate: this.editedItem.joinDate 1211 joinDate: this.editedItem.joinDate
1212 }; 1212 };
1213 if (this.imageUrl) { 1213 if (this.imageUrl) {
1214 var str = this.imageUrl; 1214 var str = this.imageUrl;
1215 const [baseUrl, imageUrl] = str.split(/,/); 1215 const [baseUrl, imageUrl] = str.split(/,/);
1216 editTeacher.upload = imageUrl; 1216 editTeacher.upload = imageUrl;
1217 } 1217 }
1218 http() 1218 http()
1219 .put("/updateTeacher", editTeacher) 1219 .put("/updateTeacher", editTeacher)
1220 .then(response => { 1220 .then(response => {
1221 this.snackbar = true; 1221 this.snackbar = true;
1222 this.text = "Successfully Edit Existing Teacher"; 1222 this.text = "Successfully Edit Existing Teacher";
1223 this.color = "green"; 1223 this.color = "green";
1224 this.loading = false; 1224 this.loading = false;
1225 this.getTeacherList(); 1225 this.getTeacherList();
1226 this.closeEditTeacherDialog(); 1226 this.closeEditTeacherDialog();
1227 }) 1227 })
1228 .catch(error => { 1228 .catch(error => {
1229 this.snackbar = true; 1229 this.snackbar = true;
1230 this.text = error.response.data.message; 1230 this.text = error.response.data.message;
1231 this.color = "error"; 1231 this.color = "error";
1232 this.loading = false; 1232 this.loading = false;
1233 }); 1233 });
1234 }, 1234 },
1235 suspendStatus(suspendStatus, id) { 1235 suspendStatus(suspendStatus, id) {
1236 let suspendStatusData = { 1236 let suspendStatusData = {
1237 teacherId: id, 1237 teacherId: id,
1238 status: suspendStatus 1238 status: suspendStatus
1239 }; 1239 };
1240 this.showLoader = true; 1240 this.showLoader = true;
1241 http() 1241 http()
1242 .put("/suspendAccount", suspendStatusData) 1242 .put("/suspendAccount", suspendStatusData)
1243 .then(response => { 1243 .then(response => {
1244 this.getTeacherList(); 1244 this.getTeacherList();
1245 this.text = response.data.message; 1245 this.text = response.data.message;
1246 this.color = "green"; 1246 this.color = "green";
1247 this.snackbar = true; 1247 this.snackbar = true;
1248 this.showLoader = false; 1248 this.showLoader = false;
1249 }) 1249 })
1250 .catch(error => { 1250 .catch(error => {
1251 this.snackbar = true; 1251 this.snackbar = true;
1252 this.color = "error"; 1252 this.color = "error";
1253 this.text = error.response.data.message; 1253 this.text = error.response.data.message;
1254 this.showLoader = false; 1254 this.showLoader = false;
1255 }); 1255 });
1256 }, 1256 },
1257 displaySearch() { 1257 displaySearch() {
1258 (this.show = false), (this.showSearch = true); 1258 (this.show = false), (this.showSearch = true);
1259 }, 1259 },
1260 closeSearch() { 1260 closeSearch() {
1261 this.showSearch = false; 1261 this.showSearch = false;
1262 this.show = true; 1262 this.show = true;
1263 this.search = ""; 1263 this.search = "";
1264 } 1264 }
1265 }, 1265 },
1266 mounted() { 1266 mounted() {
1267 const getCountryList = countryList(); 1267 const getCountryList = countryList();
1268 this.countries = getCountryList; 1268 this.countries = getCountryList;
1269 this.getTeacherList(); 1269 this.getTeacherList();
1270 } 1270 }
1271 }; 1271 };
1272 </script> 1272 </script>
1273 <style scoped> 1273 <style scoped>
1274 .active { 1274 .active {
1275 background-color: gray; 1275 background-color: gray;
1276 color: white !important; 1276 color: white !important;
1277 } 1277 }
1278 .activebtn { 1278 .activebtn {
1279 color: black !important; 1279 color: black !important;
1280 } 1280 }
1281 </style> 1281 </style>