viithiisys / School-Management-dashboard

Download as
Browse Code ยป

Commit 4430dd6715bc61f3bc15e6585ff41cb89d5b3bf6

Authored by Neeraj Sharma
1 parent 7adcb53626
Exists in master and in 3 other branches amber-development, development, ui-design

somethings changes in design and comment all console

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