viithiisys / School-Management-dashboard

Download as
Browse Code ยป

Commit 4da08fe72f727ce387499ee105572cdc06e75389

Authored by Shikha Mishra
1 parent 575d794924
Exists in master and in 1 other branch ui-design

chnage design of card and button

Showing 2 changed files with 40 additions and 12 deletions   Show diff stats
src/pages/Parent/parents.vue
Diff comments   View file @4da08fe
1 <template> 1 <template>
2 <v-container fluid class="body-color"> 2 <v-container fluid class="body-color">
3 <v-dialog v-model="editParentDilaog" max-width="600px" scrollable persistent> 3 <v-dialog v-model="editParentDilaog" max-width="600px" scrollable persistent>
4 <v-card flat class="card-style pa-2" dark> 4 <v-card flat class="Card-style pa-2">
5 <v-layout> 5 <v-layout>
6 <v-flex xs12> 6 <v-flex xs12>
7 <label class="title text-xs-center">Edit Parents Details</label> 7 <label class="title text-xs-center">Edit Parents Details</label>
8 <v-icon size="24" class="right" @click="editParentDilaog = false">cancel</v-icon> 8 <v-icon size="24" class="right" @click="editParentDilaog = false">cancel</v-icon>
9 </v-flex> 9 </v-flex>
10 </v-layout> 10 </v-layout>
11 <v-card-text class="hidden-xs-only hidden-sm-only"> 11 <v-card-text class="hidden-xs-only hidden-sm-only">
12 <v-form ref="editParentForm" v-model="validEditParent" lazy-validation> 12 <v-form ref="editParentForm" v-model="validEditParent" lazy-validation>
13 <v-flex xs12> 13 <v-flex xs12>
14 <v-layout> 14 <v-layout>
15 <v-flex xs3 sm4 class="pt-4 subheading"> 15 <v-flex xs3 sm4 class="pt-4 subheading">
16 <label class="right">Email ID:</label> 16 <label class="right">Email ID:</label>
17 </v-flex> 17 </v-flex>
18 <v-flex xs8 sm6 class="ml-3"> 18 <v-flex xs8 sm6 class="ml-3">
19 <v-text-field 19 <v-text-field
20 placeholder="fill your email" 20 placeholder="fill your email"
21 v-model="editedItem.email" 21 v-model="editedItem.email"
22 type="text" 22 type="text"
23 name="email" 23 name="email"
24 required 24 required
25 ></v-text-field> 25 ></v-text-field>
26 </v-flex> 26 </v-flex>
27 </v-layout> 27 </v-layout>
28 </v-flex> 28 </v-flex>
29 <v-flex xs12> 29 <v-flex xs12>
30 <v-layout> 30 <v-layout>
31 <v-flex xs3 sm4 class="pt-4 subheading"> 31 <v-flex xs3 sm4 class="pt-4 subheading">
32 <label class="right">Father Name:</label> 32 <label class="right">Father Name:</label>
33 </v-flex> 33 </v-flex>
34 <v-flex xs8 sm6 class="ml-3"> 34 <v-flex xs8 sm6 class="ml-3">
35 <v-text-field 35 <v-text-field
36 v-model="editedItem.fatherName" 36 v-model="editedItem.fatherName"
37 placeholder="fill your father Name" 37 placeholder="fill your father Name"
38 required 38 required
39 ></v-text-field> 39 ></v-text-field>
40 </v-flex> 40 </v-flex>
41 </v-layout> 41 </v-layout>
42 </v-flex> 42 </v-flex>
43 <!-- EDIT FATHER CELL NUMBER - HIDDEN AT xs and sm screen --> 43 <!-- EDIT FATHER CELL NUMBER - HIDDEN AT xs and sm screen -->
44 <v-flex xs12> 44 <v-flex xs12>
45 <v-layout> 45 <v-layout>
46 <v-flex xs3 sm4 class="pt-4 subheading"> 46 <v-flex xs3 sm4 class="pt-4 subheading">
47 <label class="right">Father Cell No:</label> 47 <label class="right">Father Cell No:</label>
48 </v-flex> 48 </v-flex>
49 <v-flex xs8 sm6 class="ml-3"> 49 <v-flex xs8 sm6 class="ml-3">
50 <v-layout row wrap> 50 <v-layout row wrap>
51 <v-flex md3 class="mt-3"> 51 <v-flex md3 class="mt-3">
52 <vue-country-code @onSelect="editFatherCellCode" class="black--text"></vue-country-code> 52 <vue-country-code @onSelect="editFatherCellCode" class="black--text"></vue-country-code>
53 </v-flex> 53 </v-flex>
54 <v-flex md9> 54 <v-flex md9>
55 <v-text-field 55 <v-text-field
56 v-model="editedItem.fatherCellNo" 56 v-model="editedItem.fatherCellNo"
57 placeholder="Fill your father Cell Number" 57 placeholder="Fill your father Cell Number"
58 :rules="editFatherNoRule" 58 :rules="editFatherNoRule"
59 type="number" 59 type="number"
60 required 60 required
61 ></v-text-field> 61 ></v-text-field>
62 </v-flex> 62 </v-flex>
63 </v-layout> 63 </v-layout>
64 </v-flex> 64 </v-flex>
65 </v-layout> 65 </v-layout>
66 </v-flex> 66 </v-flex>
67 <v-flex xs12> 67 <v-flex xs12>
68 <v-layout> 68 <v-layout>
69 <v-flex xs3 sm4 class="pt-4 subheading"> 69 <v-flex xs3 sm4 class="pt-4 subheading">
70 <label class="right">Father Profession:</label> 70 <label class="right">Father Profession:</label>
71 </v-flex> 71 </v-flex>
72 <v-flex xs8 sm6 class="ml-3"> 72 <v-flex xs8 sm6 class="ml-3">
73 <v-text-field 73 <v-text-field
74 v-model="editedItem.fatherProfession" 74 v-model="editedItem.fatherProfession"
75 placeholder="fill your father Profession" 75 placeholder="fill your father Profession"
76 required 76 required
77 ></v-text-field> 77 ></v-text-field>
78 </v-flex> 78 </v-flex>
79 </v-layout> 79 </v-layout>
80 </v-flex> 80 </v-flex>
81 <v-flex xs12> 81 <v-flex xs12>
82 <v-layout> 82 <v-layout>
83 <v-flex xs3 sm4 class="pt-4 subheading"> 83 <v-flex xs3 sm4 class="pt-4 subheading">
84 <label class="right">Mother Name:</label> 84 <label class="right">Mother Name:</label>
85 </v-flex> 85 </v-flex>
86 <v-flex xs8 sm6 class="ml-3"> 86 <v-flex xs8 sm6 class="ml-3">
87 <v-text-field 87 <v-text-field
88 v-model="editedItem.motherName" 88 v-model="editedItem.motherName"
89 placeholder="fill your Mother Name" 89 placeholder="fill your Mother Name"
90 type="text" 90 type="text"
91 required 91 required
92 ></v-text-field> 92 ></v-text-field>
93 </v-flex> 93 </v-flex>
94 </v-layout> 94 </v-layout>
95 </v-flex> 95 </v-flex>
96 <v-flex xs12> 96 <v-flex xs12>
97 <v-layout> 97 <v-layout>
98 <v-flex xs3 sm4 class="pt-4 subheading"> 98 <v-flex xs3 sm4 class="pt-4 subheading">
99 <label class="right">Mother Cell No:</label> 99 <label class="right">Mother Cell No:</label>
100 </v-flex> 100 </v-flex>
101 <v-flex xs8 sm6 class="ml-3"> 101 <v-flex xs8 sm6 class="ml-3">
102 <v-layout row wrap> 102 <v-layout row wrap>
103 <v-flex md3 class="mt-3"> 103 <v-flex md3 class="mt-3">
104 <vue-country-code @onSelect="onSelect" class="black--text"></vue-country-code> 104 <vue-country-code @onSelect="onSelect" class="black--text"></vue-country-code>
105 </v-flex> 105 </v-flex>
106 <v-flex md9> 106 <v-flex md9>
107 <v-text-field 107 <v-text-field
108 v-model="editedItem.motherCellNo" 108 v-model="editedItem.motherCellNo"
109 placeholder="fill your Mother Cell Number" 109 placeholder="fill your Mother Cell Number"
110 type="number" 110 type="number"
111 required 111 required
112 ></v-text-field> 112 ></v-text-field>
113 </v-flex> 113 </v-flex>
114 </v-layout> 114 </v-layout>
115 </v-flex> 115 </v-flex>
116 </v-layout> 116 </v-layout>
117 </v-flex> 117 </v-flex>
118 <v-flex xs12> 118 <v-flex xs12>
119 <!-- EDIT MOTHER CELL NUMBER - HIDDEN AT xs and sm screen --> 119 <!-- EDIT MOTHER CELL NUMBER - HIDDEN AT xs and sm screen -->
120 <v-layout> 120 <v-layout>
121 <v-flex xs3 sm4 class="pt-4 subheading"> 121 <v-flex xs3 sm4 class="pt-4 subheading">
122 <label class="right">Mother Profession:</label> 122 <label class="right">Mother Profession:</label>
123 </v-flex> 123 </v-flex>
124 <v-flex xs8 sm6 class="ml-3"> 124 <v-flex xs8 sm6 class="ml-3">
125 <v-text-field 125 <v-text-field
126 v-model="editedItem.motherProfession" 126 v-model="editedItem.motherProfession"
127 placeholder="fill your Mother Profession" 127 placeholder="fill your Mother Profession"
128 type="text" 128 type="text"
129 required 129 required
130 ></v-text-field> 130 ></v-text-field>
131 </v-flex> 131 </v-flex>
132 </v-layout> 132 </v-layout>
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">Password:</label> 135 <label class="right">Password:</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 v-model="editedItem.password" 139 v-model="editedItem.password"
140 placeholder="Enter Password" 140 placeholder="Enter Password"
141 type="text" 141 type="text"
142 required 142 required
143 ></v-text-field> 143 ></v-text-field>
144 </v-flex> 144 </v-flex>
145 </v-layout> 145 </v-layout>
146 </v-flex> 146 </v-flex>
147 <v-layout> 147 <v-layout>
148 <v-flex xs12 sm12> 148 <v-flex xs12 sm12>
149 <v-card-actions> 149 <v-card-actions>
150 <v-spacer></v-spacer> 150 <v-spacer></v-spacer>
151 <v-btn round dark @click="save" class="add-button">Save</v-btn> 151 <v-btn round dark @click="save" class="add-button">Save</v-btn>
152 <v-spacer></v-spacer> 152 <v-spacer></v-spacer>
153 </v-card-actions> 153 </v-card-actions>
154 </v-flex> 154 </v-flex>
155 </v-layout> 155 </v-layout>
156 </v-form> 156 </v-form>
157 </v-card-text> 157 </v-card-text>
158 <v-card-text style="height: 600px;" class="hidden-lg-only hidden-xl-only hidden-md-only"> 158 <v-card-text style="height: 600px;" class="hidden-lg-only hidden-xl-only hidden-md-only">
159 <v-flex xs12> 159 <v-flex xs12>
160 <v-layout wrap> 160 <v-layout wrap>
161 <v-flex xs12 class="pt-4 subheading"> 161 <v-flex xs12 class="pt-4 subheading">
162 <label>Email ID:</label> 162 <label>Email ID:</label>
163 </v-flex> 163 </v-flex>
164 <v-flex xs12> 164 <v-flex xs12>
165 <v-text-field 165 <v-text-field
166 placeholder="fill your email" 166 placeholder="fill your email"
167 v-model="editedItem.email" 167 v-model="editedItem.email"
168 type="text" 168 type="text"
169 name="email" 169 name="email"
170 required 170 required
171 ></v-text-field> 171 ></v-text-field>
172 </v-flex> 172 </v-flex>
173 </v-layout> 173 </v-layout>
174 </v-flex> 174 </v-flex>
175 <v-flex xs12> 175 <v-flex xs12>
176 <v-layout wrap> 176 <v-layout wrap>
177 <v-flex xs12 class="pt-4 subheading"> 177 <v-flex xs12 class="pt-4 subheading">
178 <label>Father Name:</label> 178 <label>Father Name:</label>
179 </v-flex> 179 </v-flex>
180 <v-flex xs12> 180 <v-flex xs12>
181 <v-text-field 181 <v-text-field
182 v-model="editedItem.fatherName" 182 v-model="editedItem.fatherName"
183 placeholder="fill your father Name" 183 placeholder="fill your father Name"
184 required 184 required
185 ></v-text-field> 185 ></v-text-field>
186 </v-flex> 186 </v-flex>
187 </v-layout> 187 </v-layout>
188 </v-flex> 188 </v-flex>
189 <v-flex xs12> 189 <v-flex xs12>
190 <!-- EDIT FATHER CELL NUMBER - visible AT xs and sm screen --> 190 <!-- EDIT FATHER CELL NUMBER - visible AT xs and sm screen -->
191 <v-layout wrap> 191 <v-layout wrap>
192 <v-flex xs12 class="pt-4 subheading"> 192 <v-flex xs12 class="pt-4 subheading">
193 <label>Father Cell No:</label> 193 <label>Father Cell No:</label>
194 </v-flex> 194 </v-flex>
195 <v-flex xs12> 195 <v-flex xs12>
196 <v-layout row wrap> 196 <v-layout row wrap>
197 <v-flex sm3 class="mt-3"> 197 <v-flex sm3 class="mt-3">
198 <vue-country-code @onSelect="editFatherCellCode" class="black--text"></vue-country-code> 198 <vue-country-code @onSelect="editFatherCellCode" class="black--text"></vue-country-code>
199 </v-flex> 199 </v-flex>
200 <v-flex sm9> 200 <v-flex sm9>
201 <v-text-field 201 <v-text-field
202 v-model="editedItem.fatherCellNo" 202 v-model="editedItem.fatherCellNo"
203 placeholder="fill your father Cell Number" 203 placeholder="fill your father Cell Number"
204 type="number" 204 type="number"
205 required 205 required
206 ></v-text-field> 206 ></v-text-field>
207 </v-flex> 207 </v-flex>
208 </v-layout> 208 </v-layout>
209 </v-flex> 209 </v-flex>
210 </v-layout> 210 </v-layout>
211 </v-flex> 211 </v-flex>
212 <v-flex xs12> 212 <v-flex xs12>
213 <v-layout wrap> 213 <v-layout wrap>
214 <v-flex xs12 class="pt-4 subheading"> 214 <v-flex xs12 class="pt-4 subheading">
215 <label>Father Profession:</label> 215 <label>Father Profession:</label>
216 </v-flex> 216 </v-flex>
217 <v-flex xs12> 217 <v-flex xs12>
218 <v-text-field 218 <v-text-field
219 v-model="editedItem.fatherProfession" 219 v-model="editedItem.fatherProfession"
220 placeholder="fill your father Profession" 220 placeholder="fill your father Profession"
221 required 221 required
222 ></v-text-field> 222 ></v-text-field>
223 </v-flex> 223 </v-flex>
224 </v-layout> 224 </v-layout>
225 </v-flex> 225 </v-flex>
226 <v-flex xs12> 226 <v-flex xs12>
227 <v-layout wrap> 227 <v-layout wrap>
228 <v-flex xs12 class="pt-4 subheading"> 228 <v-flex xs12 class="pt-4 subheading">
229 <label>Mother Name:</label> 229 <label>Mother Name:</label>
230 </v-flex> 230 </v-flex>
231 <v-flex xs12> 231 <v-flex xs12>
232 <v-text-field 232 <v-text-field
233 v-model="editedItem.motherName" 233 v-model="editedItem.motherName"
234 placeholder="fill your Mother Name" 234 placeholder="fill your Mother Name"
235 type="text" 235 type="text"
236 required 236 required
237 ></v-text-field> 237 ></v-text-field>
238 </v-flex> 238 </v-flex>
239 </v-layout> 239 </v-layout>
240 </v-flex> 240 </v-flex>
241 <v-flex xs12> 241 <v-flex xs12>
242 <!-- EDIT MOTHER CELL NUMBER - VISIBLE ONLY AT xs and sm screen --> 242 <!-- EDIT MOTHER CELL NUMBER - VISIBLE ONLY AT xs and sm screen -->
243 <v-layout wrap> 243 <v-layout wrap>
244 <v-flex xs12 class="pt-4 subheading"> 244 <v-flex xs12 class="pt-4 subheading">
245 <label>Mother Cell No:</label> 245 <label>Mother Cell No:</label>
246 </v-flex> 246 </v-flex>
247 <v-flex xs12> 247 <v-flex xs12>
248 <v-layout row wrap> 248 <v-layout row wrap>
249 <v-flex sm3 class="mt-3"> 249 <v-flex sm3 class="mt-3">
250 <vue-country-code @onSelect="onSelect" class="black--text"></vue-country-code> 250 <vue-country-code @onSelect="onSelect" class="black--text"></vue-country-code>
251 </v-flex> 251 </v-flex>
252 <v-flex sm9> 252 <v-flex sm9>
253 <v-text-field 253 <v-text-field
254 v-model="editedItem.motherCellNo" 254 v-model="editedItem.motherCellNo"
255 placeholder="fill your Mother Cell Number" 255 placeholder="fill your Mother Cell Number"
256 type="number" 256 type="number"
257 required 257 required
258 ></v-text-field> 258 ></v-text-field>
259 </v-flex> 259 </v-flex>
260 </v-layout> 260 </v-layout>
261 </v-flex> 261 </v-flex>
262 </v-layout> 262 </v-layout>
263 </v-flex> 263 </v-flex>
264 <v-flex xs12> 264 <v-flex xs12>
265 <v-layout wrap> 265 <v-layout wrap>
266 <v-flex xs12 class="pt-4 subheading"> 266 <v-flex xs12 class="pt-4 subheading">
267 <label>Mother Profession:</label> 267 <label>Mother Profession:</label>
268 </v-flex> 268 </v-flex>
269 <v-flex xs12> 269 <v-flex xs12>
270 <v-text-field 270 <v-text-field
271 v-model="editedItem.motherProfession" 271 v-model="editedItem.motherProfession"
272 placeholder="fill your Mother Profession" 272 placeholder="fill your Mother Profession"
273 type="text" 273 type="text"
274 required 274 required
275 ></v-text-field> 275 ></v-text-field>
276 </v-flex> 276 </v-flex>
277 <v-flex xs12 class="pt-4 subheading"> 277 <v-flex xs12 class="pt-4 subheading">
278 <label>Password:</label> 278 <label>Password:</label>
279 </v-flex> 279 </v-flex>
280 <v-flex xs12> 280 <v-flex xs12>
281 <v-text-field 281 <v-text-field
282 v-model="editedItem.password" 282 v-model="editedItem.password"
283 placeholder="Enter Password" 283 placeholder="Enter Password"
284 type="text" 284 type="text"
285 required 285 required
286 ></v-text-field> 286 ></v-text-field>
287 </v-flex> 287 </v-flex>
288 </v-layout> 288 </v-layout>
289 </v-flex> 289 </v-flex>
290 <v-layout> 290 <v-layout>
291 <v-flex xs12 sm12> 291 <v-flex xs12 sm12>
292 <v-card-actions> 292 <v-card-actions>
293 <v-spacer></v-spacer> 293 <v-spacer></v-spacer>
294 <v-btn round dark @click="save" class="add-button">Save</v-btn> 294 <v-btn round dark @click="save" class="add-button">Save</v-btn>
295 <v-spacer></v-spacer> 295 <v-spacer></v-spacer>
296 </v-card-actions> 296 </v-card-actions>
297 </v-flex> 297 </v-flex>
298 </v-layout> 298 </v-layout>
299 </v-card-text> 299 </v-card-text>
300 </v-card> 300 </v-card>
301 </v-dialog> 301 </v-dialog>
302 302
303 <!-- ****** RESET Parents MPIN ****** --> 303 <!-- ****** RESET Parents MPIN ****** -->
304 <v-dialog v-model="resetParentMpin" max-width="500px" scrollable persistent> 304 <v-dialog v-model="resetParentMpin" max-width="500px" scrollable persistent>
305 <v-card class="card-style pa-2" dark> 305 <v-card class="Card-style pa-2">
306 <v-layout> 306 <v-layout>
307 <v-flex xs12> 307 <v-flex xs12>
308 <label class="title text-xs-center">Reset Mpin</label> 308 <label class="title text-xs-center">Reset Mpin</label>
309 <v-icon size="24" class="right" @click="resetParentMpin = false">cancel</v-icon> 309 <v-icon size="24" class="right" @click="resetParentMpin = false">cancel</v-icon>
310 </v-flex> 310 </v-flex>
311 </v-layout> 311 </v-layout>
312 <v-card-text class="hidden-xs-only hidden-sm-only"> 312 <v-card-text class="hidden-xs-only hidden-sm-only">
313 <v-form ref="resetParentMpinForm" v-model="validParentMpin" lazy-validation> 313 <v-form ref="resetParentMpinForm" v-model="validParentMpin" lazy-validation>
314 <v-flex xs12> 314 <v-flex xs12>
315 <v-layout> 315 <v-layout>
316 <v-flex xs3 sm4 class="pt-4 subheading"> 316 <v-flex xs3 sm4 class="pt-4 subheading">
317 <label class="right">Change Mpin:</label> 317 <label class="right">Change Mpin:</label>
318 </v-flex> 318 </v-flex>
319 <v-flex xs8 sm6 class="ml-3"> 319 <v-flex xs8 sm6 class="ml-3">
320 <v-text-field 320 <v-text-field
321 placeholder="change mpin" 321 placeholder="change mpin"
322 :rules="mPinRules" 322 :rules="mPinRules"
323 v-model="editMpin.mPin" 323 v-model="editMpin.mPin"
324 type="number" 324 type="number"
325 counter="4" 325 counter="4"
326 required 326 required
327 ></v-text-field> 327 ></v-text-field>
328 </v-flex> 328 </v-flex>
329 </v-layout> 329 </v-layout>
330 </v-flex> 330 </v-flex>
331 </v-form> 331 </v-form>
332 <v-layout> 332 <v-layout>
333 <v-flex xs12 sm12> 333 <v-flex xs12 sm12>
334 <v-card-actions> 334 <v-card-actions>
335 <v-spacer></v-spacer> 335 <v-spacer></v-spacer>
336 <v-btn round dark @click="resetMpin" class="add-button">Reset</v-btn> 336 <v-btn round dark @click="resetMpin" class="add-button">Reset</v-btn>
337 <v-spacer></v-spacer> 337 <v-spacer></v-spacer>
338 </v-card-actions> 338 </v-card-actions>
339 </v-flex> 339 </v-flex>
340 </v-layout> 340 </v-layout>
341 </v-card-text> 341 </v-card-text>
342 </v-card> 342 </v-card>
343 </v-dialog> 343 </v-dialog>
344 344
345 <!-- ****** PROFILE VIEW Parents DEATILS ****** --> 345 <!-- ****** PROFILE VIEW Parents DEATILS ****** -->
346 346
347 <v-dialog v-model="profileParentDialog" max-width="700px" persistent> 347 <v-dialog v-model="profileParentDialog" max-width="700px" persistent>
348 <v-card class="card-style pa-2" dark> 348 <v-card class="Card-style pa-2">
349 <v-layout> 349 <v-layout>
350 <v-flex xs12> 350 <v-flex xs12>
351 <label class="title text-xs-center">View Parent Details</label> 351 <label class="title text-xs-center">View Parent Details</label>
352 <v-icon size="24" class="right" @click="profileParentDialog = false">cancel</v-icon> 352 <v-icon size="24" class="right" @click="profileParentDialog = false">cancel</v-icon>
353 </v-flex> 353 </v-flex>
354 </v-layout> 354 </v-layout>
355 <v-flex align-center justify-center layout text-xs-center class="mt-3"> 355 <v-flex align-center justify-center layout text-xs-center class="mt-3">
356 <v-avatar size="100px"> 356 <v-avatar size="100px">
357 <img src="/static/icon/user.png" v-if="!editedItem.profilePicUrl" /> 357 <img src="/static/icon/user.png" v-if="!editedItem.profilePicUrl" />
358 <img :src="editedItem.profilePicUrl" v-else-if="editedItem.profilePicUrl" /> 358 <img :src="editedItem.profilePicUrl" v-else-if="editedItem.profilePicUrl" />
359 </v-avatar> 359 </v-avatar>
360 </v-flex> 360 </v-flex>
361 <v-container grid-list-md> 361 <v-container grid-list-md>
362 <v-layout wrap> 362 <v-layout wrap>
363 <v-flex xs12> 363 <v-flex xs12>
364 <v-layout> 364 <v-layout>
365 <v-flex xs12 sm12> 365 <v-flex xs12 sm12>
366 <v-layout> 366 <v-layout>
367 <v-flex xs6> 367 <v-flex xs6>
368 <h5 class="right my-1"> 368 <h5 class="right my-1">
369 <b>Email:</b> 369 <b>Email:</b>
370 </h5> 370 </h5>
371 </v-flex> 371 </v-flex>
372 <v-flex xs6> 372 <v-flex xs6>
373 <h5 class="my-1">{{ editedItem.email }}</h5> 373 <h5 class="my-1">{{ editedItem.email }}</h5>
374 </v-flex> 374 </v-flex>
375 </v-layout> 375 </v-layout>
376 </v-flex> 376 </v-flex>
377 </v-layout> 377 </v-layout>
378 <v-layout> 378 <v-layout>
379 <v-flex xs12> 379 <v-flex xs12>
380 <v-layout> 380 <v-layout>
381 <v-flex xs6> 381 <v-flex xs6>
382 <b> 382 <b>
383 <h5 class="right my-1"> 383 <h5 class="right my-1">
384 <b>Fahter Name:</b> 384 <b>Fahter Name:</b>
385 </h5> 385 </h5>
386 </b> 386 </b>
387 </v-flex> 387 </v-flex>
388 <v-flex xs6> 388 <v-flex xs6>
389 <h5 class="my-1">{{ editedItem.fatherName }}</h5> 389 <h5 class="my-1">{{ editedItem.fatherName }}</h5>
390 </v-flex> 390 </v-flex>
391 </v-layout> 391 </v-layout>
392 </v-flex> 392 </v-flex>
393 </v-layout> 393 </v-layout>
394 <v-layout> 394 <v-layout>
395 <v-flex xs12> 395 <v-flex xs12>
396 <v-layout> 396 <v-layout>
397 <v-flex xs6> 397 <v-flex xs6>
398 <b> 398 <b>
399 <h5 class="right my-1"> 399 <h5 class="right my-1">
400 <b>Mother Name:</b> 400 <b>Mother Name:</b>
401 </h5> 401 </h5>
402 </b> 402 </b>
403 </v-flex> 403 </v-flex>
404 <v-flex xs6> 404 <v-flex xs6>
405 <h5 class="my-1">{{ editedItem.motherName }}</h5> 405 <h5 class="my-1">{{ editedItem.motherName }}</h5>
406 </v-flex> 406 </v-flex>
407 </v-layout> 407 </v-layout>
408 </v-flex> 408 </v-flex>
409 </v-layout> 409 </v-layout>
410 <v-layout> 410 <v-layout>
411 <v-flex xs12> 411 <v-flex xs12>
412 <v-layout> 412 <v-layout>
413 <v-flex sm6 xs6> 413 <v-flex sm6 xs6>
414 <b> 414 <b>
415 <h5 class="right my-1"> 415 <h5 class="right my-1">
416 <b>Father Cell No:</b> 416 <b>Father Cell No:</b>
417 </h5> 417 </h5>
418 </b> 418 </b>
419 </v-flex> 419 </v-flex>
420 <v-flex sm6 xs6> 420 <v-flex sm6 xs6>
421 <h5 class="my-1">{{ editedItem.fatherCellNo }}</h5> 421 <h5 class="my-1">{{ editedItem.fatherCellNo }}</h5>
422 </v-flex> 422 </v-flex>
423 </v-layout> 423 </v-layout>
424 </v-flex> 424 </v-flex>
425 </v-layout> 425 </v-layout>
426 <v-layout> 426 <v-layout>
427 <v-flex xs12> 427 <v-flex xs12>
428 <v-layout> 428 <v-layout>
429 <v-flex xs6> 429 <v-flex xs6>
430 <b> 430 <b>
431 <h5 class="right my-1"> 431 <h5 class="right my-1">
432 <b>Mother Cell No:</b> 432 <b>Mother Cell No:</b>
433 </h5> 433 </h5>
434 </b> 434 </b>
435 </v-flex> 435 </v-flex>
436 <v-flex xs6> 436 <v-flex xs6>
437 <h5 class="my-1">{{ editedItem.motherCellNo }}</h5> 437 <h5 class="my-1">{{ editedItem.motherCellNo }}</h5>
438 </v-flex> 438 </v-flex>
439 </v-layout> 439 </v-layout>
440 </v-flex> 440 </v-flex>
441 </v-layout> 441 </v-layout>
442 <v-layout> 442 <v-layout>
443 <v-flex xs12> 443 <v-flex xs12>
444 <v-layout> 444 <v-layout>
445 <v-flex xs6> 445 <v-flex xs6>
446 <b> 446 <b>
447 <h5 class="right my-1 hidden-lg-only hidden-xl-only hidden-md-only"> 447 <h5 class="right my-1 hidden-lg-only hidden-xl-only hidden-md-only">
448 <b>FatherProfession:</b> 448 <b>FatherProfession:</b>
449 </h5> 449 </h5>
450 <h5 class="right my-1 hidden-sm-only hidden-xs-only"> 450 <h5 class="right my-1 hidden-sm-only hidden-xs-only">
451 <b>Father Profession:</b> 451 <b>Father Profession:</b>
452 </h5> 452 </h5>
453 </b> 453 </b>
454 </v-flex> 454 </v-flex>
455 <v-flex xs6> 455 <v-flex xs6>
456 <h5 class="my-1">{{ editedItem.fatherProfession }}</h5> 456 <h5 class="my-1">{{ editedItem.fatherProfession }}</h5>
457 </v-flex> 457 </v-flex>
458 </v-layout> 458 </v-layout>
459 </v-flex> 459 </v-flex>
460 </v-layout> 460 </v-layout>
461 <v-layout> 461 <v-layout>
462 <v-flex xs12> 462 <v-flex xs12>
463 <v-layout> 463 <v-layout>
464 <v-flex xs6> 464 <v-flex xs6>
465 <b> 465 <b>
466 <h5 class="right my-1 hidden-lg-only hidden-xl-only hidden-md-only"> 466 <h5 class="right my-1 hidden-lg-only hidden-xl-only hidden-md-only">
467 <b>MotherProfession:</b> 467 <b>MotherProfession:</b>
468 </h5> 468 </h5>
469 <h5 class="right my-1 hidden-sm-only hidden-xs-only"> 469 <h5 class="right my-1 hidden-sm-only hidden-xs-only">
470 <b>Mother Profession:</b> 470 <b>Mother Profession:</b>
471 </h5> 471 </h5>
472 </b> 472 </b>
473 </v-flex> 473 </v-flex>
474 <v-flex xs6> 474 <v-flex xs6>
475 <h5 class="my-1">{{ editedItem.motherProfession }}</h5> 475 <h5 class="my-1">{{ editedItem.motherProfession }}</h5>
476 </v-flex> 476 </v-flex>
477 </v-layout> 477 </v-layout>
478 <!-- <v-layout> 478 <!-- <v-layout>
479 <v-flex xs6> 479 <v-flex xs6>
480 <b> 480 <b>
481 <h5 class="right my-1 hidden-lg-only hidden-xl-only hidden-md-only"> 481 <h5 class="right my-1 hidden-lg-only hidden-xl-only hidden-md-only">
482 <b>Password:</b> 482 <b>Password:</b>
483 </h5> 483 </h5>
484 <h5 class="right my-1 hidden-sm-only hidden-xs-only"> 484 <h5 class="right my-1 hidden-sm-only hidden-xs-only">
485 <b>Password:</b> 485 <b>Password:</b>
486 </h5> 486 </h5>
487 </b> 487 </b>
488 </v-flex> 488 </v-flex>
489 <v-flex xs6> 489 <v-flex xs6>
490 <h5 class="my-1">{{ editedItem.password }}</h5> 490 <h5 class="my-1">{{ editedItem.password }}</h5>
491 </v-flex> 491 </v-flex>
492 </v-layout>--> 492 </v-layout>-->
493 </v-flex> 493 </v-flex>
494 </v-layout> 494 </v-layout>
495 </v-flex> 495 </v-flex>
496 </v-layout> 496 </v-layout>
497 </v-container> 497 </v-container>
498 </v-card> 498 </v-card>
499 </v-dialog> 499 </v-dialog>
500 <!-- ****** EXISTING-USERS Parents TABLE ****** --> 500 <!-- ****** EXISTING-USERS Parents TABLE ****** -->
501 <v-toolbar color="transparent" flat> 501 <v-toolbar color="transparent" flat>
502 <v-btn 502 <v-btn
503 fab 503 fab
504 dark 504 dark
505 class="open-dialog-button hidden-xl-only hidden-md-only hidden-lg-only" 505 class="open-dialog-button hidden-xl-only hidden-md-only hidden-lg-only"
506 small 506 small
507 @click="addParentDialog = true" 507 @click="addParentDialog = true"
508 > 508 >
509 <v-icon dark>add</v-icon> 509 <v-icon dark>add</v-icon>
510 </v-btn> 510 </v-btn>
511 <v-btn 511 <v-btn
512 v-if="role != 'TEACHER' " 512 v-if="role != 'TEACHER' "
513 round 513 round
514 class="open-dialog-button hidden-sm-only hidden-xs-only" 514 class="open-dialog-button hidden-sm-only hidden-xs-only"
515 dark 515 dark
516 @click="addParentDialog = true" 516 @click="addParentDialog = true"
517 > 517 >
518 <v-icon class="white--text pr-1" size="20">add</v-icon>Add Parent 518 <v-icon class="white--text pr-1" size="20">add</v-icon>Add Parent
519 </v-btn> 519 </v-btn>
520 <v-spacer></v-spacer> 520 <v-spacer></v-spacer>
521 <v-card-title class="body-1" v-show="show"> 521 <v-card-title class="body-1" v-show="show">
522 <v-btn icon large flat @click="displaySearch"> 522 <v-btn icon large flat @click="displaySearch">
523 <v-avatar size="27"> 523 <v-avatar size="27">
524 <img src="/static/icon/search.png" alt="icon" /> 524 <img src="/static/icon/search.png" alt="icon" />
525 </v-avatar> 525 </v-avatar>
526 </v-btn> 526 </v-btn>
527 </v-card-title> 527 </v-card-title>
528 <v-flex xs8 sm8 md2 lg2 v-if="showSearch"> 528 <v-flex xs8 sm8 md2 lg2 v-if="showSearch">
529 <v-layout> 529 <v-layout>
530 <v-text-field 530 <v-text-field
531 v-model="search" 531 v-model="search"
532 label="Search" 532 label="Search"
533 prepend-inner-icon="search" 533 prepend-inner-icon="search"
534 color="primary" 534 color="primary"
535 ref="searchField" 535 ref="searchField"
536 autofocus 536 autofocus
537 style="transition: 0.8s cubic-bezier(0.25, 0.8, 0.25, 1); !important" 537 style="transition: 0.8s cubic-bezier(0.25, 0.8, 0.25, 1); !important"
538 ></v-text-field> 538 ></v-text-field>
539 <v-icon @click="closeSearch" color="error">close</v-icon> 539 <v-icon @click="closeSearch" color="error">close</v-icon>
540 </v-layout> 540 </v-layout>
541 </v-flex> 541 </v-flex>
542 </v-toolbar> 542 </v-toolbar>
543 <v-data-table 543 <v-data-table
544 :headers="headers" 544 :headers="headers"
545 :items="parentsList" 545 :items="parentsList"
546 :pagination.sync="pagination" 546 :pagination.sync="pagination"
547 :search="search" 547 :search="search"
548 > 548 >
549 <template slot="items" slot-scope="props"> 549 <template slot="items" slot-scope="props">
550 <tr class="tr"> 550 <tr class="tr">
551 <td class="text-xs-center td td-row">{{ props.index + 1}}</td> 551 <td class="text-xs-center td td-row">{{ props.index + 1}}</td>
552 <td class="text-xs-center td td-row">{{ props.item.email }}</td> 552 <td class="text-xs-center td td-row">{{ props.item.email }}</td>
553 <td class="text-xs-center td td-row">{{ props.item.fatherName }}</td> 553 <td class="text-xs-center td td-row">{{ props.item.fatherName }}</td>
554 <td class="text-xs-center td td-row">{{ props.item.fatherCellNo }}</td> 554 <td class="text-xs-center td td-row">{{ props.item.fatherCellNo }}</td>
555 <td class="text-xs-center td td-row">{{ props.item.motherName }}</td> 555 <td class="text-xs-center td td-row">{{ props.item.motherName }}</td>
556 <td class="text-xs-center td td-row">{{ props.item.motherCellNo }}</td> 556 <td class="text-xs-center td td-row">{{ props.item.motherCellNo }}</td>
557 <td class="text-xs-center td td-row"> 557 <td class="text-xs-center td td-row">
558 <span> 558 <span>
559 <v-tooltip top> 559 <v-tooltip top>
560 <img 560 <img
561 slot="activator" 561 slot="activator"
562 style="cursor:pointer; width:25px; height:25px; " 562 style="cursor:pointer; width:25px; height:25px; "
563 class="mr-3" 563 class="mr-3"
564 @click="profile(props.item)" 564 @click="profile(props.item)"
565 src="/static/icon/view.png" 565 src="/static/icon/view.png"
566 /> 566 />
567 <span>View</span> 567 <span>View</span>
568 </v-tooltip> 568 </v-tooltip>
569 <v-tooltip top v-if="role != 'TEACHER' "> 569 <v-tooltip top v-if="role != 'TEACHER' ">
570 <img 570 <img
571 slot="activator" 571 slot="activator"
572 style="cursor:pointer; width:20px; height:18px; " 572 style="cursor:pointer; width:20px; height:18px; "
573 @click="editItem(props.item)" 573 @click="editItem(props.item)"
574 src="/static/icon/edit.png" 574 src="/static/icon/edit.png"
575 class="mr-3" 575 class="mr-3"
576 /> 576 />
577 <span>Edit</span> 577 <span>Edit</span>
578 </v-tooltip> 578 </v-tooltip>
579 <span v-if="role === 'ADMIN' "> 579 <span v-if="role === 'ADMIN' ">
580 <i 580 <i
581 class="material-icons md-18" 581 class="material-icons md-18"
582 style="cursor:pointer; width:20px; height:18px;" 582 style="cursor:pointer; width:20px; height:18px;"
583 @click="resetParentMPIN(props.item)" 583 @click="resetParentMPIN(props.item)"
584 >vpn_key</i> 584 >vpn_key</i>
585 </span> 585 </span>
586 </span> 586 </span>
587 </td> 587 </td>
588 </tr> 588 </tr>
589 </template> 589 </template>
590 <v-alert 590 <v-alert
591 slot="no-results" 591 slot="no-results"
592 :value="true" 592 :value="true"
593 color="error" 593 color="error"
594 icon="warning" 594 icon="warning"
595 >Your search for "{{ search }}" found no results.</v-alert> 595 >Your search for "{{ search }}" found no results.</v-alert>
596 </v-data-table> 596 </v-data-table>
597 597
598 <!-- ******DIALOG BOX - ADD PARENTS DETAILS****** --> 598 <!-- ******DIALOG BOX - ADD PARENTS DETAILS****** -->
599 <v-dialog v-model="addParentDialog" max-width="1100px" v-if="addParentDialog" persistent> 599 <v-dialog v-model="addParentDialog" max-width="1100px" v-if="addParentDialog" persistent>
600 <v-card flat class="card-style pa-2" dark> 600 <v-card flat class="Card-style pa-2">
601 <v-layout> 601 <v-layout>
602 <v-flex xs12> 602 <v-flex xs12>
603 <label class="title text-xs-center">Add Parent</label> 603 <label class="title text-xs-center">Add Parent</label>
604 <v-icon 604 <v-icon
605 size="24" 605 size="24"
606 class="right" 606 class="right"
607 @click="$refs.parentForm.reset();addParentDialog = false" 607 @click="$refs.parentForm.reset();addParentDialog = false"
608 >cancel</v-icon> 608 >cancel</v-icon>
609 </v-flex> 609 </v-flex>
610 </v-layout> 610 </v-layout>
611 <v-container fluid fill-height> 611 <v-container fluid fill-height>
612 <v-layout align-center> 612 <v-layout align-center>
613 <v-flex xs12 sm12> 613 <v-flex xs12 sm12>
614 <v-form ref="parentForm" v-model="valid" lazy-validation> 614 <v-form ref="parentForm" v-model="valid" lazy-validation>
615 <v-container fluid class="hidden-xs-only hidden-sm-only"> 615 <v-container fluid class="hidden-xs-only hidden-sm-only">
616 <v-layout> 616 <v-layout>
617 <!-- ADD FATHER CELL NUMBER HIDDEN ON xs and sm screen--> 617 <!-- ADD FATHER CELL NUMBER HIDDEN ON xs and sm screen-->
618 <v-flex xs12 sm6> 618 <v-flex xs12 sm6>
619 <v-layout> 619 <v-layout>
620 <v-flex xs4 class="pt-4 subheading"> 620 <v-flex xs4 class="pt-4 subheading">
621 <label class="right">Father Cell No:</label> 621 <label class="right">Father Cell No:</label>
622 </v-flex> 622 </v-flex>
623 <v-flex xs8 class="ml-3"> 623 <v-flex xs8 class="ml-3">
624 <v-layout row wrap> 624 <v-layout row wrap>
625 <v-flex md3 class="mt-3"> 625 <v-flex md3 class="mt-3">
626 <vue-country-code @onSelect="addFatherCellCode" class="black--text"></vue-country-code> 626 <vue-country-code @onSelect="addFatherCellCode" class="black--text"></vue-country-code>
627 </v-flex> 627 </v-flex>
628 <v-flex md9> 628 <v-flex md9>
629 <v-text-field 629 <v-text-field
630 v-model="parentData.fatherCellNo" 630 v-model="parentData.fatherCellNo"
631 placeholder="Father Cell Number" 631 placeholder="Father Cell Number"
632 type="number" 632 type="number"
633 :rules="fatheCellNoRules" 633 :rules="fatheCellNoRules"
634 counter="10" 634 counter="10"
635 required 635 required
636 ></v-text-field> 636 ></v-text-field>
637 </v-flex> 637 </v-flex>
638 </v-layout> 638 </v-layout>
639 </v-flex> 639 </v-flex>
640 </v-layout> 640 </v-layout>
641 </v-flex> 641 </v-flex>
642 <v-flex xs12 sm6> 642 <v-flex xs12 sm6>
643 <v-layout> 643 <v-layout>
644 <v-flex xs4 class="pt-4 subheading"> 644 <v-flex xs4 class="pt-4 subheading">
645 <label class="right">Parent Email Id:</label> 645 <label class="right">Parent Email Id:</label>
646 </v-flex> 646 </v-flex>
647 <v-flex xs8 class="ml-3"> 647 <v-flex xs8 class="ml-3">
648 <v-text-field 648 <v-text-field
649 placeholder="fill Parent email" 649 placeholder="fill Parent email"
650 v-model="parentData.email" 650 v-model="parentData.email"
651 type="text" 651 type="text"
652 required 652 required
653 ></v-text-field> 653 ></v-text-field>
654 </v-flex> 654 </v-flex>
655 </v-layout> 655 </v-layout>
656 </v-flex> 656 </v-flex>
657 </v-layout> 657 </v-layout>
658 <v-layout> 658 <v-layout>
659 <v-flex xs12 sm6> 659 <v-flex xs12 sm6>
660 <v-layout> 660 <v-layout>
661 <v-flex xs4 class="pt-4 subheading"> 661 <v-flex xs4 class="pt-4 subheading">
662 <label class="right">Father Name:</label> 662 <label class="right">Father Name:</label>
663 </v-flex> 663 </v-flex>
664 <v-flex xs8 class="ml-3"> 664 <v-flex xs8 class="ml-3">
665 <v-text-field 665 <v-text-field
666 v-model="parentData.fatherName" 666 v-model="parentData.fatherName"
667 placeholder="Fill your father Name" 667 placeholder="Fill your father Name"
668 required 668 required
669 ></v-text-field> 669 ></v-text-field>
670 </v-flex> 670 </v-flex>
671 </v-layout> 671 </v-layout>
672 </v-flex> 672 </v-flex>
673 <v-flex xs12 sm6> 673 <v-flex xs12 sm6>
674 <v-layout> 674 <v-layout>
675 <v-flex xs4 class="pt-4 subheading"> 675 <v-flex xs4 class="pt-4 subheading">
676 <label class="right">Father Profession:</label> 676 <label class="right">Father Profession:</label>
677 </v-flex> 677 </v-flex>
678 <v-flex xs8 class="ml-3"> 678 <v-flex xs8 class="ml-3">
679 <v-text-field 679 <v-text-field
680 v-model="parentData.fatherProfession" 680 v-model="parentData.fatherProfession"
681 placeholder="fill your father Profession" 681 placeholder="fill your father Profession"
682 required 682 required
683 ></v-text-field> 683 ></v-text-field>
684 </v-flex> 684 </v-flex>
685 </v-layout> 685 </v-layout>
686 </v-flex> 686 </v-flex>
687 </v-layout> 687 </v-layout>
688 <v-layout> 688 <v-layout>
689 <v-flex xs12 sm6> 689 <v-flex xs12 sm6>
690 <v-layout> 690 <v-layout>
691 <v-flex xs4 class="pt-4 subheading"> 691 <v-flex xs4 class="pt-4 subheading">
692 <label class="right">Mother Name:</label> 692 <label class="right">Mother Name:</label>
693 </v-flex> 693 </v-flex>
694 <v-flex xs8 class="ml-3"> 694 <v-flex xs8 class="ml-3">
695 <v-text-field 695 <v-text-field
696 v-model="parentData.motherName" 696 v-model="parentData.motherName"
697 placeholder="fill your Mother Name" 697 placeholder="fill your Mother Name"
698 type="text" 698 type="text"
699 required 699 required
700 ></v-text-field> 700 ></v-text-field>
701 </v-flex> 701 </v-flex>
702 </v-layout> 702 </v-layout>
703 </v-flex> 703 </v-flex>
704 <!-- MOTHER CELL NUMBER HIDDEN ON xs and sm screen --> 704 <!-- MOTHER CELL NUMBER HIDDEN ON xs and sm screen -->
705 <v-flex xs12 sm6> 705 <v-flex xs12 sm6>
706 <v-layout> 706 <v-layout>
707 <v-flex xs4 class="pt-4 subheading"> 707 <v-flex xs4 class="pt-4 subheading">
708 <label class="right">Mother Cell No:</label> 708 <label class="right">Mother Cell No:</label>
709 </v-flex> 709 </v-flex>
710 <v-flex xs8 class="ml-3"> 710 <v-flex xs8 class="ml-3">
711 <v-layout row wrap> 711 <v-layout row wrap>
712 <v-flex md3 class="mt-3"> 712 <v-flex md3 class="mt-3">
713 <vue-country-code @onSelect="onSelect" class="black--text"></vue-country-code> 713 <vue-country-code @onSelect="onSelect" class="black--text"></vue-country-code>
714 </v-flex> 714 </v-flex>
715 <v-flex md9> 715 <v-flex md9>
716 <v-text-field 716 <v-text-field
717 v-model="parentData.motherCellNo" 717 v-model="parentData.motherCellNo"
718 placeholder="Mother Cell Number" 718 placeholder="Mother Cell Number"
719 counter="10" 719 counter="10"
720 type="number" 720 type="number"
721 required 721 required
722 ></v-text-field> 722 ></v-text-field>
723 </v-flex> 723 </v-flex>
724 </v-layout> 724 </v-layout>
725 </v-flex> 725 </v-flex>
726 </v-layout> 726 </v-layout>
727 </v-flex> 727 </v-flex>
728 </v-layout> 728 </v-layout>
729 <v-layout> 729 <v-layout>
730 <v-flex xs12 sm6> 730 <v-flex xs12 sm6>
731 <v-layout> 731 <v-layout>
732 <v-flex xs4 class="pt-4 subheading"> 732 <v-flex xs4 class="pt-4 subheading">
733 <label class="right">Mother Profession:</label> 733 <label class="right">Mother Profession:</label>
734 </v-flex> 734 </v-flex>
735 <v-flex xs8 class="ml-3"> 735 <v-flex xs8 class="ml-3">
736 <v-text-field 736 <v-text-field
737 v-model="parentData.motherProfession" 737 v-model="parentData.motherProfession"
738 placeholder="fill your Mother Profession" 738 placeholder="fill your Mother Profession"
739 type="text" 739 type="text"
740 required 740 required
741 ></v-text-field> 741 ></v-text-field>
742 </v-flex> 742 </v-flex>
743 </v-layout> 743 </v-layout>
744 </v-flex> 744 </v-flex>
745 <v-flex xs12 sm6> 745 <v-flex xs12 sm6>
746 <v-layout> 746 <v-layout>
747 <v-flex xs4 class="pt-4 subheading"> 747 <v-flex xs4 class="pt-4 subheading">
748 <label class="right">Password:</label> 748 <label class="right">Password:</label>
749 </v-flex> 749 </v-flex>
750 <v-flex xs8 class="ml-3"> 750 <v-flex xs8 class="ml-3">
751 <v-text-field 751 <v-text-field
752 v-model="parentData.password" 752 v-model="parentData.password"
753 :append-icon="e1 ? 'visibility_off' : 'visibility'" 753 :append-icon="e1 ? 'visibility_off' : 'visibility'"
754 :append-icon-cb="() => (e1 = !e1)" 754 :append-icon-cb="() => (e1 = !e1)"
755 :type="e1 ? 'password' : 'text'" 755 :type="e1 ? 'password' : 'text'"
756 :rules="password" 756 :rules="password"
757 placeholder="Enter Your Password" 757 placeholder="Enter Your Password"
758 :disabled="isFatherCellExists" 758 :disabled="isFatherCellExists"
759 required 759 required
760 ></v-text-field> 760 ></v-text-field>
761 </v-flex> 761 </v-flex>
762 </v-layout> 762 </v-layout>
763 </v-flex> 763 </v-flex>
764 </v-layout> 764 </v-layout>
765 <v-flex xs12 sm12> 765 <v-flex xs12 sm12>
766 <v-layout> 766 <v-layout>
767 <v-flex xs12 sm12> 767 <v-flex xs12 sm12>
768 <v-btn 768 <v-btn
769 class="right add-button" 769 class="right add-button"
770 @click="submitParentDetails" 770 @click="submitParentDetails"
771 round 771 round
772 dark 772 dark
773 :loading="loading" 773 :loading="loading"
774 v-show="showParent" 774 v-show="showParent"
775 >Add</v-btn> 775 >Add</v-btn>
776 <v-btn @click="clear" round dark class="clear-button right">Clear</v-btn> 776 <v-btn @click="clear" round dark class="clear-button right">Clear</v-btn>
777 </v-flex> 777 </v-flex>
778 </v-layout> 778 </v-layout>
779 </v-flex> 779 </v-flex>
780 </v-container> 780 </v-container>
781 <v-container fluid class="hidden-lg-only hidden-xl-only hidden-md-only"> 781 <v-container fluid class="hidden-lg-only hidden-xl-only hidden-md-only">
782 <v-layout wrap> 782 <v-layout wrap>
783 <!-- ADD FATHER CELL NUMBER -- VISIBLE ON xs and sm screens --> 783 <!-- ADD FATHER CELL NUMBER -- VISIBLE ON xs and sm screens -->
784 <v-flex xs12 sm6> 784 <v-flex xs12 sm6>
785 <v-layout wrap> 785 <v-layout wrap>
786 <v-flex xs12 class="pt-4 subheading"> 786 <v-flex xs12 class="pt-4 subheading">
787 <label>Father Cell No:</label> 787 <label>Father Cell No:</label>
788 </v-flex> 788 </v-flex>
789 <v-layout row wrap xs12> 789 <v-layout row wrap xs12>
790 <v-flex sm3 class="mt-3"> 790 <v-flex sm3 class="mt-3">
791 <vue-country-code @onSelect="addFatherCellCode" class="black--text"></vue-country-code> 791 <vue-country-code @onSelect="addFatherCellCode" class="black--text"></vue-country-code>
792 </v-flex> 792 </v-flex>
793 793
794 <v-flex sm9> 794 <v-flex sm9>
795 <v-text-field 795 <v-text-field
796 v-model="parentData.fatherCellNo" 796 v-model="parentData.fatherCellNo"
797 :rules="fatheCellNoRules" 797 :rules="fatheCellNoRules"
798 counter="10" 798 counter="10"
799 placeholder="Father Cell Number" 799 placeholder="Father Cell Number"
800 type="number" 800 type="number"
801 required 801 required
802 ></v-text-field> 802 ></v-text-field>
803 </v-flex> 803 </v-flex>
804 </v-layout> 804 </v-layout>
805 </v-layout> 805 </v-layout>
806 </v-flex> 806 </v-flex>
807 <v-flex xs12 sm6> 807 <v-flex xs12 sm6>
808 <v-layout wrap> 808 <v-layout wrap>
809 <v-flex xs12 class="pt-4 subheading"> 809 <v-flex xs12 class="pt-4 subheading">
810 <label>Parent Email Id:</label> 810 <label>Parent Email Id:</label>
811 </v-flex> 811 </v-flex>
812 <v-flex xs12> 812 <v-flex xs12>
813 <v-text-field 813 <v-text-field
814 placeholder="fill Parent email" 814 placeholder="fill Parent email"
815 v-model="parentData.email" 815 v-model="parentData.email"
816 type="text" 816 type="text"
817 required 817 required
818 ></v-text-field> 818 ></v-text-field>
819 </v-flex> 819 </v-flex>
820 </v-layout> 820 </v-layout>
821 </v-flex> 821 </v-flex>
822 </v-layout> 822 </v-layout>
823 <v-layout wrap> 823 <v-layout wrap>
824 <v-flex xs12 sm6> 824 <v-flex xs12 sm6>
825 <v-layout wrap> 825 <v-layout wrap>
826 <v-flex xs12 class="pt-4 subheading"> 826 <v-flex xs12 class="pt-4 subheading">
827 <label>Father Name:</label> 827 <label>Father Name:</label>
828 </v-flex> 828 </v-flex>
829 <v-flex xs12> 829 <v-flex xs12>
830 <v-text-field 830 <v-text-field
831 v-model="parentData.fatherName" 831 v-model="parentData.fatherName"
832 placeholder="Fill your father Name" 832 placeholder="Fill your father Name"
833 required 833 required
834 ></v-text-field> 834 ></v-text-field>
835 </v-flex> 835 </v-flex>
836 </v-layout> 836 </v-layout>
837 </v-flex> 837 </v-flex>
838 <v-flex xs12 sm6> 838 <v-flex xs12 sm6>
839 <v-layout wrap> 839 <v-layout wrap>
840 <v-flex xs12 class="pt-4 subheading"> 840 <v-flex xs12 class="pt-4 subheading">
841 <label>Father Profession:</label> 841 <label>Father Profession:</label>
842 </v-flex> 842 </v-flex>
843 <v-flex xs12> 843 <v-flex xs12>
844 <v-text-field 844 <v-text-field
845 v-model="parentData.fatherProfession" 845 v-model="parentData.fatherProfession"
846 placeholder="fill your father Profession" 846 placeholder="fill your father Profession"
847 required 847 required
848 ></v-text-field> 848 ></v-text-field>
849 </v-flex> 849 </v-flex>
850 </v-layout> 850 </v-layout>
851 </v-flex> 851 </v-flex>
852 </v-layout> 852 </v-layout>
853 <v-layout wrap> 853 <v-layout wrap>
854 <v-flex xs12 sm6> 854 <v-flex xs12 sm6>
855 <v-layout wrap> 855 <v-layout wrap>
856 <v-flex xs12 class="pt-4 subheading"> 856 <v-flex xs12 class="pt-4 subheading">
857 <label>Mother Name:</label> 857 <label>Mother Name:</label>
858 </v-flex> 858 </v-flex>
859 <v-flex xs12> 859 <v-flex xs12>
860 <v-text-field 860 <v-text-field
861 v-model="parentData.motherName" 861 v-model="parentData.motherName"
862 placeholder="fill your Mother Name" 862 placeholder="fill your Mother Name"
863 type="text" 863 type="text"
864 required 864 required
865 ></v-text-field> 865 ></v-text-field>
866 </v-flex> 866 </v-flex>
867 </v-layout> 867 </v-layout>
868 </v-flex> 868 </v-flex>
869 <!-- MOTHER CELL NUMBER - VISIBLE ONLY ON xs and sm screen--> 869 <!-- MOTHER CELL NUMBER - VISIBLE ONLY ON xs and sm screen-->
870 <v-flex xs12 sm6> 870 <v-flex xs12 sm6>
871 <v-layout wrap> 871 <v-layout wrap>
872 <v-flex xs42 class="pt-4 subheading"> 872 <v-flex xs42 class="pt-4 subheading">
873 <label>Mother Cell No:</label> 873 <label>Mother Cell No:</label>
874 </v-flex> 874 </v-flex>
875 <v-flex xs12> 875 <v-flex xs12>
876 <v-layout row wrap> 876 <v-layout row wrap>
877 <v-flex sm3 class="mt-3"> 877 <v-flex sm3 class="mt-3">
878 <vue-country-code @onSelect="onSelect" class="black--text"></vue-country-code> 878 <vue-country-code @onSelect="onSelect" class="black--text"></vue-country-code>
879 </v-flex> 879 </v-flex>
880 <v-flex sm9> 880 <v-flex sm9>
881 <v-text-field 881 <v-text-field
882 v-model="parentData.motherCellNo" 882 v-model="parentData.motherCellNo"
883 placeholder="fill your Mother Cell Number" 883 placeholder="fill your Mother Cell Number"
884 type="number" 884 type="number"
885 required 885 required
886 ></v-text-field> 886 ></v-text-field>
887 </v-flex> 887 </v-flex>
888 </v-layout> 888 </v-layout>
889 </v-flex> 889 </v-flex>
890 </v-layout> 890 </v-layout>
891 </v-flex> 891 </v-flex>
892 </v-layout> 892 </v-layout>
893 <v-layout wrap> 893 <v-layout wrap>
894 <v-flex xs12 sm6> 894 <v-flex xs12 sm6>
895 <v-layout wrap> 895 <v-layout wrap>
896 <v-flex xs12 class="pt-4 subheading"> 896 <v-flex xs12 class="pt-4 subheading">
897 <label>Mother Profession:</label> 897 <label>Mother Profession:</label>
898 </v-flex> 898 </v-flex>
899 <v-flex xs12> 899 <v-flex xs12>
900 <v-text-field 900 <v-text-field
901 v-model="parentData.motherProfession" 901 v-model="parentData.motherProfession"
902 placeholder="fill your Mother Profession" 902 placeholder="fill your Mother Profession"
903 type="text" 903 type="text"
904 required 904 required
905 ></v-text-field> 905 ></v-text-field>
906 </v-flex> 906 </v-flex>
907 </v-layout> 907 </v-layout>
908 </v-flex> 908 </v-flex>
909 </v-layout> 909 </v-layout>
910 <v-flex xs12 sm12> 910 <v-flex xs12 sm12>
911 <v-layout> 911 <v-layout>
912 <v-flex xs6 sm6 offset-sm1> 912 <v-flex xs6 sm6 offset-sm1>
913 <v-btn @click="clear" class="clear-button" round dark>clear</v-btn> 913 <v-btn @click="clear" class="clear-button" round dark>clear</v-btn>
914 </v-flex> 914 </v-flex>
915 <v-flex xs6 sm6> 915 <v-flex xs6 sm6>
916 <v-btn 916 <v-btn
917 class="add-button" 917 class="add-button"
918 @click="submitParentDetails" 918 @click="submitParentDetails"
919 round 919 round
920 dark 920 dark
921 :loading="loading" 921 :loading="loading"
922 v-show="showParent" 922 v-show="showParent"
923 >Add</v-btn> 923 >Add</v-btn>
924 </v-flex> 924 </v-flex>
925 </v-layout> 925 </v-layout>
926 </v-flex> 926 </v-flex>
927 </v-container> 927 </v-container>
928 </v-form> 928 </v-form>
929 </v-flex> 929 </v-flex>
930 </v-layout> 930 </v-layout>
931 </v-container> 931 </v-container>
932 </v-card> 932 </v-card>
933 </v-dialog> 933 </v-dialog>
934 <div class="loader" v-if="showLoader"> 934 <div class="loader" v-if="showLoader">
935 <v-progress-circular indeterminate color="white"></v-progress-circular> 935 <v-progress-circular indeterminate color="white"></v-progress-circular>
936 </div> 936 </div>
937 <v-snackbar 937 <v-snackbar
938 :timeout="timeout" 938 :timeout="timeout"
939 :top="y === 'top'" 939 :top="y === 'top'"
940 :right="x === 'right'" 940 :right="x === 'right'"
941 :vertical="mode === 'vertical'" 941 :vertical="mode === 'vertical'"
942 v-model="snackbar" 942 v-model="snackbar"
943 color="success" 943 color="success"
944 >{{ text }}</v-snackbar> 944 >{{ text }}</v-snackbar>
945 </v-container> 945 </v-container>
946 </template> 946 </template>
947 947
948 <script> 948 <script>
949 import http from "@/Services/http.js"; 949 import http from "@/Services/http.js";
950 import Util from "@/util"; 950 import Util from "@/util";
951 import moment from "moment"; 951 import moment from "moment";
952 952
953 export default { 953 export default {
954 data: () => ({ 954 data: () => ({
955 /* EDIT FATHER CELL */ 955 /* EDIT FATHER CELL */
956 editedFatherCellCode: "", 956 editedFatherCellCode: "",
957 /* ADD FATHER CELL */ 957 /* ADD FATHER CELL */
958 addedFatherCellCode: "", 958 addedFatherCellCode: "",
959 e1: true, 959 e1: true,
960 showParent: true, 960 showParent: true,
961 snackbar: false, 961 snackbar: false,
962 role: "", 962 role: "",
963 // TEACHER: "", 963 // TEACHER: "",
964 y: "top", 964 y: "top",
965 x: "right", 965 x: "right",
966 color: "", 966 color: "",
967 mode: "", 967 mode: "",
968 timeout: 3000, 968 timeout: 3000,
969 text: "", 969 text: "",
970 show: true, 970 show: true,
971 showSearch: false, 971 showSearch: false,
972 showLoader: false, 972 showLoader: false,
973 loading: false, 973 loading: false,
974 date: null, 974 date: null,
975 search: "", 975 search: "",
976 password: "", 976 password: "",
977 addParentDialog: false, 977 addParentDialog: false,
978 menu: false, 978 menu: false,
979 menu1: false, 979 menu1: false,
980 editParentDilaog: false, 980 editParentDilaog: false,
981 profileParentDialog: false, 981 profileParentDialog: false,
982 resetParentMpin: false, 982 resetParentMpin: false,
983 viewProfileParentDialog: false, 983 viewProfileParentDialog: false,
984 valid: true, 984 valid: true,
985 validEditParent: true, 985 validEditParent: true,
986 validParentMpin: true, 986 validParentMpin: true,
987 pagination: { 987 pagination: {
988 rowsPerPage: 10, 988 rowsPerPage: 10,
989 }, 989 },
990 fatherNameRules: [(v) => !!v || " Father Name is required"], 990 fatherNameRules: [(v) => !!v || " Father Name is required"],
991 fatheCellNoRules: [ 991 fatheCellNoRules: [
992 (v) => !!v || " father Cell Number is required", 992 (v) => !!v || " father Cell Number is required",
993 (v) => v <= 10000000000 || "Max 10 characters is required", 993 (v) => v <= 10000000000 || "Max 10 characters is required",
994 ], 994 ],
995 password: [ 995 password: [
996 (v) => !!v || "Password field is Required.", 996 (v) => !!v || "Password field is Required.",
997 // v => (/^(?=.*[a-z])(?=.*[0-9])(?=.*[!@#$%^&*])(?=.{8,})/).test(v) && v.length >= 8 || 'Min 8 characters lower case symbol required' 997 // v => (/^(?=.*[a-z])(?=.*[0-9])(?=.*[!@#$%^&*])(?=.{8,})/).test(v) && v.length >= 8 || 'Min 8 characters lower case symbol required'
998 ], 998 ],
999 editFatherNoRule: [ 999 editFatherNoRule: [
1000 (v) => !!v || " father Cell Number is required", 1000 (v) => !!v || " father Cell Number is required",
1001 (v) => v <= 10000000000 || "Max 10 characters is required", 1001 (v) => v <= 10000000000 || "Max 10 characters is required",
1002 ], 1002 ],
1003 1003
1004 editfatherCellNo: [(v) => !!v || " Father Name is required"], 1004 editfatherCellNo: [(v) => !!v || " Father Name is required"],
1005 errorMessages: "", 1005 errorMessages: "",
1006 emailRules: [ 1006 emailRules: [
1007 (v) => !!v || "E-mail is required", 1007 (v) => !!v || "E-mail is required",
1008 (v) => 1008 (v) =>
1009 /^\w+([.-]?\w+)*@\w+([.-]?\w+)*(\.\w{2,3})+$/.test(v) || 1009 /^\w+([.-]?\w+)*@\w+([.-]?\w+)*(\.\w{2,3})+$/.test(v) ||
1010 "E-mail must be valid", 1010 "E-mail must be valid",
1011 ], 1011 ],
1012 mPinRules: [ 1012 mPinRules: [
1013 (v) => !!v || "MPIN is required", 1013 (v) => !!v || "MPIN is required",
1014 (v) => v <= 10000 || "Max 4 numbers are required", 1014 (v) => v <= 10000 || "Max 4 numbers are required",
1015 ], 1015 ],
1016 headers: [ 1016 headers: [
1017 { 1017 {
1018 text: "No", 1018 text: "No",
1019 align: "center", 1019 align: "center",
1020 sortable: false, 1020 sortable: false,
1021 value: "No", 1021 value: "No",
1022 }, 1022 },
1023 { text: "Email", value: "email", sortable: false, align: "center" }, 1023 { text: "Email", value: "email", sortable: false, align: "center" },
1024 { 1024 {
1025 text: "Father Name", 1025 text: "Father Name",
1026 value: "fatherName", 1026 value: "fatherName",
1027 sortable: false, 1027 sortable: false,
1028 align: "center", 1028 align: "center",
1029 }, 1029 },
1030 { 1030 {
1031 text: "Father Cell No", 1031 text: "Father Cell No",
1032 value: "fatherName", 1032 value: "fatherName",
1033 sortable: false, 1033 sortable: false,
1034 align: "center", 1034 align: "center",
1035 }, 1035 },
1036 { 1036 {
1037 text: "Mother Name", 1037 text: "Mother Name",
1038 value: "motherName", 1038 value: "motherName",
1039 sortable: false, 1039 sortable: false,
1040 align: "center", 1040 align: "center",
1041 }, 1041 },
1042 { 1042 {
1043 text: "Mother Cell No", 1043 text: "Mother Cell No",
1044 value: "motherCellNo", 1044 value: "motherCellNo",
1045 sortable: false, 1045 sortable: false,
1046 align: "center", 1046 align: "center",
1047 }, 1047 },
1048 { text: "Action", value: "", sortable: false, align: "center" }, 1048 { text: "Action", value: "", sortable: false, align: "center" },
1049 ], 1049 ],
1050 parentsList: [], 1050 parentsList: [],
1051 editedIndex: -1, 1051 editedIndex: -1,
1052 parentData: {}, 1052 parentData: {},
1053 max: 10, 1053 max: 10,
1054 editedItem: { 1054 editedItem: {
1055 fatherName: "", 1055 fatherName: "",
1056 fatherCellNo: "", 1056 fatherCellNo: "",
1057 motherName: "", 1057 motherName: "",
1058 motherCellNo: "", 1058 motherCellNo: "",
1059 email: "", 1059 email: "",
1060 password: "", 1060 password: "",
1061 }, 1061 },
1062 editMpin: { 1062 editMpin: {
1063 mPin: "", 1063 mPin: "",
1064 }, 1064 },
1065 isFatherCellExists: false, 1065 isFatherCellExists: false,
1066 }), 1066 }),
1067 watch: { 1067 watch: {
1068 menu(val) { 1068 menu(val) {
1069 val && this.$nextTick(() => (this.$refs.picker.activePicker = "YEAR")); 1069 val && this.$nextTick(() => (this.$refs.picker.activePicker = "YEAR"));
1070 }, 1070 },
1071 menu1(val) { 1071 menu1(val) {
1072 val && this.$nextTick(() => (this.$refs.picker.activePicker = "YEAR")); 1072 val && this.$nextTick(() => (this.$refs.picker.activePicker = "YEAR"));
1073 }, 1073 },
1074 addParentDialog: function (val) { 1074 addParentDialog: function (val) {
1075 if (!val) { 1075 if (!val) {
1076 this.parentData = []; 1076 this.parentData = [];
1077 } 1077 }
1078 }, 1078 },
1079 }, 1079 },
1080 methods: { 1080 methods: {
1081 onSelect({ name, iso2, dialCode }) { 1081 onSelect({ name, iso2, dialCode }) {
1082 // console.log("country codes", name, iso2, dialCode); 1082 // console.log("country codes", name, iso2, dialCode);
1083 // this.countryCode = iso2 1083 // this.countryCode = iso2
1084 }, 1084 },
1085 editFatherCellCode({ name, iso2, dialCode }) { 1085 editFatherCellCode({ name, iso2, dialCode }) {
1086 // console.log("Edit father cell", name,iso2); 1086 // console.log("Edit father cell", name,iso2);
1087 this.editedFatherCellCode = dialCode; 1087 this.editedFatherCellCode = dialCode;
1088 }, 1088 },
1089 addFatherCellCode({ name, iso2, dialCode }) { 1089 addFatherCellCode({ name, iso2, dialCode }) {
1090 this.addedFatherCellCode = dialCode; 1090 this.addedFatherCellCode = dialCode;
1091 }, 1091 },
1092 editItem(item) { 1092 editItem(item) {
1093 this.editedIndex = this.parentsList.indexOf(item); 1093 this.editedIndex = this.parentsList.indexOf(item);
1094 this.editedItem = Object.assign({}, item); 1094 this.editedItem = Object.assign({}, item);
1095 this.editParentDilaog = true; 1095 this.editParentDilaog = true;
1096 }, 1096 },
1097 profile(item) { 1097 profile(item) {
1098 this.editedIndex = this.parentsList.indexOf(item); 1098 this.editedIndex = this.parentsList.indexOf(item);
1099 this.editedItem = Object.assign({}, item); 1099 this.editedItem = Object.assign({}, item);
1100 this.profileParentDialog = true; 1100 this.profileParentDialog = true;
1101 }, 1101 },
1102 resetParentMPIN(item) { 1102 resetParentMPIN(item) {
1103 this.editMpin = Object.assign({}, item); 1103 this.editMpin = Object.assign({}, item);
1104 this.resetParentMpin = true; 1104 this.resetParentMpin = true;
1105 }, 1105 },
1106 close() { 1106 close() {
1107 this.editParentDilaog = false; 1107 this.editParentDilaog = false;
1108 }, 1108 },
1109 closeProfile() { 1109 closeProfile() {
1110 this.profileParentDialog = false; 1110 this.profileParentDialog = false;
1111 }, 1111 },
1112 closeReset() { 1112 closeReset() {
1113 this.resetParentMpin = false; 1113 this.resetParentMpin = false;
1114 }, 1114 },
1115 clear() { 1115 clear() {
1116 this.$refs.parentForm.reset(); 1116 this.$refs.parentForm.reset();
1117 }, 1117 },
1118 save() { 1118 save() {
1119 if (this.$refs.editParentForm.validate()) { 1119 if (this.$refs.editParentForm.validate()) {
1120 this.editedItem.parentId = this.editedItem._id; 1120 this.editedItem.parentId = this.editedItem._id;
1121 this.editedItem.countryCode = this.editedFatherCellCode; 1121 this.editedItem.countryCode = this.editedFatherCellCode;
1122 http() 1122 http()
1123 .put("/updateParent", this.editedItem) 1123 .put("/updateParent", this.editedItem)
1124 .then((response) => { 1124 .then((response) => {
1125 this.snackbar = true; 1125 this.snackbar = true;
1126 this.color = "green"; 1126 this.color = "green";
1127 this.text = response.data.message; 1127 this.text = response.data.message;
1128 this.getParentDetails(); 1128 this.getParentDetails();
1129 this.close(); 1129 this.close();
1130 }) 1130 })
1131 .catch((error) => { 1131 .catch((error) => {
1132 this.snackbar = true; 1132 this.snackbar = true;
1133 this.color = "error"; 1133 this.color = "error";
1134 this.text = error.response.data.message; 1134 this.text = error.response.data.message;
1135 if (error.response.data.statusText) { 1135 if (error.response.data.statusText) {
1136 this.text = error.response.data.statusText; 1136 this.text = error.response.data.statusText;
1137 } 1137 }
1138 }); 1138 });
1139 } 1139 }
1140 }, 1140 },
1141 resetMpin() { 1141 resetMpin() {
1142 if (this.$refs.resetParentMpinForm.validate()) { 1142 if (this.$refs.resetParentMpinForm.validate()) {
1143 var changeMpin = { 1143 var changeMpin = {
1144 parentId: this.editMpin._id, 1144 parentId: this.editMpin._id,
1145 mPin: this.editMpin.mPin, 1145 mPin: this.editMpin.mPin,
1146 }; 1146 };
1147 http() 1147 http()
1148 .put("/resetMPin", changeMpin) 1148 .put("/resetMPin", changeMpin)
1149 .then((response) => { 1149 .then((response) => {
1150 this.snackbar = true; 1150 this.snackbar = true;
1151 this.color = "green"; 1151 this.color = "green";
1152 this.text = response.data.message; 1152 this.text = response.data.message;
1153 this.getParentDetails(); 1153 this.getParentDetails();
1154 this.resetParentMpin = false; 1154 this.resetParentMpin = false;
1155 this.closeReset(); 1155 this.closeReset();
1156 }) 1156 })
1157 .catch((error) => { 1157 .catch((error) => {
1158 this.snackbar = true; 1158 this.snackbar = true;
1159 this.color = "error"; 1159 this.color = "error";
1160 this.text = error.response.data.message; 1160 this.text = error.response.data.message;
1161 if (error.response.data.statusText) { 1161 if (error.response.data.statusText) {
1162 this.text = error.response.data.statusText; 1162 this.text = error.response.data.statusText;
1163 } 1163 }
1164 }); 1164 });
1165 } 1165 }
1166 }, 1166 },
1167 async submitParentDetails() { 1167 async submitParentDetails() {
1168 if (this.$refs.parentForm.validate()) { 1168 if (this.$refs.parentForm.validate()) {
1169 this.parentData.role = "PARENT"; 1169 this.parentData.role = "PARENT";
1170 this.loading = true; 1170 this.loading = true;
1171 (this.parentData.countryCode = this.addedFatherCellCode), 1171 (this.parentData.countryCode = this.addedFatherCellCode),
1172 await http() 1172 await http()
1173 .post("/createParent", this.parentData) 1173 .post("/createParent", this.parentData)
1174 .then((response) => { 1174 .then((response) => {
1175 this.parentId = response.data.data.id; 1175 this.parentId = response.data.data.id;
1176 this.snackbar = true; 1176 this.snackbar = true;
1177 this.color = "green"; 1177 this.color = "green";
1178 this.text = response.data.message; 1178 this.text = response.data.message;
1179 this.getParentDetails(); 1179 this.getParentDetails();
1180 this.clear(); 1180 this.clear();
1181 this.loading = false; 1181 this.loading = false;
1182 this.isFatherCellExists = true; 1182 this.isFatherCellExists = true;
1183 this.addParentDialog = false; 1183 this.addParentDialog = false;
1184 }) 1184 })
1185 .catch((error) => { 1185 .catch((error) => {
1186 this.snackbar = true; 1186 this.snackbar = true;
1187 this.color = "error"; 1187 this.color = "error";
1188 this.text = error.response.data.message; 1188 this.text = error.response.data.message;
1189 if (error.response.data.statusText) { 1189 if (error.response.data.statusText) {
1190 this.text = error.response.data.statusText; 1190 this.text = error.response.data.statusText;
1191 } 1191 }
1192 this.loading = false; 1192 this.loading = false;
1193 }); 1193 });
1194 } 1194 }
1195 }, 1195 },
1196 getParentDetails() { 1196 getParentDetails() {
1197 http() 1197 http()
1198 .get("getParentsList", { 1198 .get("getParentsList", {
1199 headers: { 1199 headers: {
1200 Authorization: "Bearer " + this.$store.state.token, 1200 Authorization: "Bearer " + this.$store.state.token,
1201 }, 1201 },
1202 }) 1202 })
1203 .then((response) => { 1203 .then((response) => {
1204 this.parentsList = response.data.data; 1204 this.parentsList = response.data.data;
1205 }) 1205 })
1206 .catch((error) => { 1206 .catch((error) => {
1207 // console.log("err====>", error.response.data.message); 1207 // console.log("err====>", error.response.data.message);
1208 this.showLoader = false; 1208 this.showLoader = false;
1209 if (error.response.status === 401) { 1209 if (error.response.status === 401) {
1210 this.$router.replace({ path: "/" }); 1210 this.$router.replace({ path: "/" });
1211 this.$store.dispatch("setToken", null); 1211 this.$store.dispatch("setToken", null);
1212 this.$store.dispatch("Id", null); 1212 this.$store.dispatch("Id", null);
1213 this.$store.dispatch("Role", null); 1213 this.$store.dispatch("Role", null);
1214 } 1214 }
1215 }); 1215 });
1216 }, 1216 },
1217 displaySearch() { 1217 displaySearch() {
1218 this.show = false; 1218 this.show = false;
1219 this.showSearch = true; 1219 this.showSearch = true;
1220 // this.$refs.searchField.focus() 1220 // this.$refs.searchField.focus()
1221 }, 1221 },
1222 closeSearch() { 1222 closeSearch() {
1223 this.showSearch = false; 1223 this.showSearch = false;
1224 this.show = true; 1224 this.show = true;
1225 this.search = ""; 1225 this.search = "";
1226 }, 1226 },
1227 }, 1227 },
1228 mounted() { 1228 mounted() {
1229 this.getParentDetails(); 1229 this.getParentDetails();
1230 // console.log("role", this.$store.state.role); 1230 // console.log("role", this.$store.state.role);
1231 this.role = this.$store.state.role; 1231 this.role = this.$store.state.role;
1232 }, 1232 },
1233 }; 1233 };
1234 </script> 1234 </script>
static/css/custom.css
Diff comments   View file @4da08fe
1 .custom-input-align .v-label { 1 .custom-input-align .v-label {
2 text-align: center !important; 2 text-align: center !important;
3 width: 100% !important; 3 width: 100% !important;
4 } 4 }
5 5
6 .custom-input-align input { 6 .custom-input-align input {
7 text-align: center !important; 7 text-align: center !important;
8 } 8 }
9 9
10 .fixcolor { 10 .fixcolor {
11 background: linear-gradient(90deg, #f58753 30%, #f15e5f 110%) 11 background: linear-gradient(90deg, #f58753 30%, #f15e5f 110%)
12 } 12 }
13 13
14 .fixcolors { 14 .fixcolors {
15 background: #444B54 !important; 15 background: #444B54 !important;
16 } 16 }
17 17
18 .fc-toolbar .fc-state-active, 18 .fc-toolbar .fc-state-active,
19 .fc-toolbar .ui-state-active { 19 .fc-toolbar .ui-state-active {
20 z-index: 0 !important; 20 z-index: 0 !important;
21 } 21 }
22 22
23 .loader { 23 .loader {
24 width: 100%; 24 width: 100%;
25 height: 100%; 25 height: 100%;
26 position: fixed; 26 position: fixed;
27 top: 0; 27 top: 0;
28 left: 0; 28 left: 0;
29 text-align: center; 29 text-align: center;
30 background-color: rgba(0, 0, 0, 0.5); 30 background-color: rgba(0, 0, 0, 0.5);
31 z-index: 999; 31 z-index: 999;
32 } 32 }
33 33
34 .profile-image-wrapper { 34 .profile-image-wrapper {
35 position: relative; 35 position: relative;
36 } 36 }
37 37
38 .edit-profile-icon { 38 .edit-profile-icon {
39 position: absolute; 39 position: absolute;
40 right: 15px; 40 right: 15px;
41 top: 15px; 41 top: 15px;
42 cursor: pointer; 42 cursor: pointer;
43 } 43 }
44 44
45 .profile-image-wrapper>.edit-profile-icon { 45 .profile-image-wrapper>.edit-profile-icon {
46 right: 10%; 46 right: 10%;
47 top: 0%; 47 top: 0%;
48 margin-top: 8px; 48 margin-top: 8px;
49 border-radius: 50%; 49 border-radius: 50%;
50 padding: 7px; 50 padding: 7px;
51 font-size: 20px; 51 font-size: 20px;
52 } 52 }
53 53
54 .loader>div { 54 .loader>div {
55 position: relative; 55 position: relative;
56 top: calc(50% - 16px); 56 top: calc(50% - 16px);
57 } 57 }
58 58
59 .v-tabs__div { 59 .v-tabs__div {
60 text-transform: none !important; 60 text-transform: none !important;
61 } 61 }
62 62
63 .v-input__prepend-outer { 63 .v-input__prepend-outer {
64 margin-right: 0px !important; 64 margin-right: 0px !important;
65 } 65 }
66 66
67 .v-card__actions .v-btn { 67 .v-card__actions .v-btn {
68 margin: 0 15px !important; 68 margin: 0 15px !important;
69 min-width: 96px !important; 69 min-width: 96px !important;
70 } 70 }
71 71
72 .paymentStatus { 72 .paymentStatus {
73 border-radius: 4px; 73 border-radius: 4px;
74 } 74 }
75 75
76 .linkCover { 76 .linkCover {
77 overflow: auto !important; 77 overflow: auto !important;
78 } 78 }
79 79
80 .primary { 80 .primary {
81 background-color: #aaa !important; 81 background-color: #aaa !important;
82 border-color: #aaa !important; 82 border-color: #aaa !important;
83 } 83 }
84 84
85 h4 { 85 h4 {
86 background-repeat: no-repeat; 86 background-repeat: no-repeat;
87 padding: 8px; 87 padding: 8px;
88 margin: auto; 88 margin: auto;
89 font-size: 25px; 89 font-size: 25px;
90 } 90 }
91 91
92 #name { 92 #name {
93 position: absolute; 93 position: absolute;
94 left: 100px; 94 left: 100px;
95 top: 17px; 95 top: 17px;
96 } 96 }
97 97
98 #icon { 98 #icon {
99 position: absolute; 99 position: absolute;
100 right: 8px; 100 right: 8px;
101 top: 8px; 101 top: 8px;
102 } 102 }
103 103
104 #m { 104 #m {
105 position: relative; 105 position: relative;
106 left: 135px; 106 left: 135px;
107 top: -15px; 107 top: -15px;
108 } 108 }
109 109
110 #G { 110 #G {
111 position: absolute; 111 position: absolute;
112 top: 38px; 112 top: 38px;
113 color: white; 113 color: white;
114 } 114 }
115 115
116 #bt { 116 #bt {
117 position: relative; 117 position: relative;
118 top: -20px; 118 top: -20px;
119 left: 115px; 119 left: 115px;
120 } 120 }
121 121
122 #e { 122 #e {
123 position: relative; 123 position: relative;
124 top: 5px; 124 top: 5px;
125 right: -30px; 125 right: -30px;
126 height: 17px; 126 height: 17px;
127 cursor: pointer; 127 cursor: pointer;
128 } 128 }
129 129
130 #d { 130 #d {
131 position: relative; 131 position: relative;
132 top: 5px; 132 top: 5px;
133 right: -70px; 133 right: -70px;
134 height: 17px; 134 height: 17px;
135 cursor: pointer; 135 cursor: pointer;
136 } 136 }
137 137
138 #indexId { 138 #indexId {
139 padding: 0 0px !important; 139 padding: 0 0px !important;
140 } 140 }
141 141
142 #td { 142 #td {
143 border: 1px solid #dddddd; 143 border: 1px solid #dddddd;
144 text-align: left; 144 text-align: left;
145 padding: 8px; 145 padding: 8px;
146 } 146 }
147 147
148 148
149 /* .apexcharts-canvas { 149 /* .apexcharts-canvas {
150 width: 100% !important; 150 width: 100% !important;
151 } 151 }
152 .apexcharts-canvas > svg{ 152 .apexcharts-canvas > svg{
153 width: 100% !important; 153 width: 100% !important;
154 } 154 }
155 .apexcharts-canvas > svg > apexcharts-inner > apexcharts-graphical { 155 .apexcharts-canvas > svg > apexcharts-inner > apexcharts-graphical {
156 transform: translate(0); 156 transform: translate(0);
157 } */ 157 } */
158 158
159 #dialog { 159 #dialog {
160 height: 550px; 160 height: 550px;
161 } 161 }
162 162
163 #flex { 163 #flex {
164 height: 300px; 164 height: 300px;
165 } 165 }
166 166
167 .top { 167 .top {
168 margin-top: 100px; 168 margin-top: 100px;
169 } 169 }
170 170
171 .v-tabs__item a { 171 .v-tabs__item a {
172 font-size: 16px !important; 172 font-size: 16px !important;
173 } 173 }
174 174
175 .iconSize { 175 .iconSize {
176 font-size: 22px !important; 176 font-size: 22px !important;
177 } 177 }
178 178
179 .mr5 { 179 .mr5 {
180 margin-right: 48px !important; 180 margin-right: 48px !important;
181 } 181 }
182 182
183 .addressForm { 183 .addressForm {
184 max-width: 17%; 184 max-width: 17%;
185 } 185 }
186 186
187 .noticeDecritpion { 187 .noticeDecritpion {
188 white-space: nowrap; 188 white-space: nowrap;
189 width: 250px; 189 width: 250px;
190 overflow: hidden; 190 overflow: hidden;
191 text-overflow: ellipsis; 191 text-overflow: ellipsis;
192 display: block; 192 display: block;
193 } 193 }
194 194
195 .header-icon { 195 .header-icon {
196 color: #5f2171 !important; 196 color: #5f2171 !important;
197 } 197 }
198 198
199 .pink-bgcolor { 199 .pink-bgcolor {
200 background: #ff8a89 !important 200 background: #ff8a89 !important
201 } 201 }
202 202
203 .firozi-bgcolor { 203 .firozi-bgcolor {
204 background: #71d9ea !important 204 background: #71d9ea !important
205 } 205 }
206 206
207 .darkBlue-bgcolor { 207 .darkBlue-bgcolor {
208 background: #7852cc !important 208 background: #7852cc !important
209 } 209 }
210 210
211 .darkBlue-color { 211 .darkBlue-color {
212 color: #7852cc !important 212 color: #7852cc !important
213 } 213 }
214 214
215 .yellowDark-color { 215 .yellowDark-color {
216 color: #f9a825 !important; 216 color: #f9a825 !important;
217 } 217 }
218 218
219 .account-Card { 219 .account-Card {
220 border: 2px solid #71d9ea !important 220 border: 2px solid #71d9ea !important
221 } 221 }
222 222
223 .pink-color { 223 .pink-color {
224 color: #ff8a89 !important 224 color: #ff8a89 !important
225 } 225 }
226 226
227 .account-circle { 227 .account-circle {
228 font-size: 27px !important; 228 font-size: 27px !important;
229 font-weight: 900 !important 229 font-weight: 900 !important
230 } 230 }
231 231
232 .font-color { 232 .font-color {
233 color: #9ba0c0 !important 233 color: #9ba0c0 !important
234 } 234 }
235 235
236 .profileDasboard { 236 .profileDasboard {
237 background: #f6f9ff !important; 237 background: #f6f9ff !important;
238 border-top-left-radius: 78px; 238 border-top-left-radius: 78px;
239 } 239 }
240 240
241 a { 241 a {
242 text-decoration: none !important; 242 text-decoration: none !important;
243 } 243 }
244 244
245 .td { 245 .td {
246 background-color: #fefeff; 246 background-color: #fefeff;
247 padding: 5px; 247 padding: 5px;
248 color: #142453; 248 color: #142453;
249 } 249 }
250 250
251 .td-notice { 251 .td-notice {
252 border-bottom: inherit !important; 252 border-bottom: inherit !important;
253 } 253 }
254 254
255 .td-notice:nth-child(even) { 255 .td-notice:nth-child(even) {
256 color: rgb(120, 82, 204) !important; 256 color: rgb(120, 82, 204) !important;
257 } 257 }
258 258
259 .td-notice:nth-child(odd) { 259 .td-notice:nth-child(odd) {
260 color: #f9a825 !important; 260 color: #f9a825 !important;
261 } 261 }
262 262
263 .td-notice { 263 .td-notice {
264 border-bottom: inherit !important; 264 border-bottom: inherit !important;
265 } 265 }
266 266
267 .td-notice:nth-child(even) { 267 .td-notice:nth-child(even) {
268 color: rgb(120, 82, 204); 268 color: rgb(120, 82, 204);
269 } 269 }
270 270
271 .td-notice:nth-child(odd) { 271 .td-notice:nth-child(odd) {
272 color: #f9a825; 272 color: #f9a825;
273 } 273 }
274 274
275 .card { 275 .card {
276 border-radius: 6px !important; 276 border-radius: 6px !important;
277 } 277 }
278 278
279 .card:hover { 279 .card:hover {
280 -webkit-box-shadow: 0px 2px 4px -1px rgba(0, 0, 0, 0.2), 0px 4px 5px 0px rgba(0, 0, 0, 0.14), 0px 1px 10px 0px rgba(0, 0, 0, 0.12) !important; 280 -webkit-box-shadow: 0px 2px 4px -1px rgba(0, 0, 0, 0.2), 0px 4px 5px 0px rgba(0, 0, 0, 0.14), 0px 1px 10px 0px rgba(0, 0, 0, 0.12) !important;
281 box-shadow: 0px 2px 4px -1px rgba(0, 0, 0, 0.2), 0px 4px 5px 0px rgba(0, 0, 0, 0.14), 0px 1px 10px 0px rgba(0, 0, 0, 0.12) !important; 281 box-shadow: 0px 2px 4px -1px rgba(0, 0, 0, 0.2), 0px 4px 5px 0px rgba(0, 0, 0, 0.14), 0px 1px 10px 0px rgba(0, 0, 0, 0.12) !important;
282 } 282 }
283 283
284 .td-row { 284 .td-row {
285 border-right: hidden; 285 border-right: hidden;
286 } 286 }
287 287
288 table.v-table { 288 table.v-table {
289 border-radius: 2px; 289 border-radius: 2px;
290 border-collapse: separate !important; 290 border-collapse: separate !important;
291 border-spacing: 0 15px !important; 291 border-spacing: 0 15px !important;
292 width: 100%; 292 width: 100%;
293 max-width: 100%; 293 max-width: 100%;
294 } 294 }
295 295
296 .gfg { 296 .gfg {
297 border-collapse: separate; 297 border-collapse: separate;
298 border-spacing: 0 15px; 298 border-spacing: 0 15px;
299 } 299 }
300 300
301 .theme--light.v-table { 301 .theme--light.v-table {
302 background-color: transparent !important; 302 background-color: transparent !important;
303 color: rgba(0, 0, 0, 0.87); 303 color: rgba(0, 0, 0, 0.87);
304 } 304 }
305 305
306 .open-dialog-button { 306 .open-dialog-button {
307 background: #827bfa !important; 307 background: #827bfa !important;
308 border-color: #827bfa !important; 308 border-color: #827bfa !important;
309 text-transform: none !important; 309 text-transform: none !important;
310 } 310 }
311 311
312 .add-button {
313 background: #feb83c !important;
314 border-color: #feb83c !important;
315 text-transform: none !important;
316 -webkit-box-shadow: none !important;
317 box-shadow: none !important;
318 }
319
320 table.v-table thead th { 312 table.v-table thead th {
321 font-size: 14px !important; 313 font-size: 14px !important;
322 } 314 }
323 315
324 .titleCard { 316 .titleCard {
325 font-size: 20px !important; 317 font-size: 20px !important;
326 font-weight: 500; 318 font-weight: 500;
327 line-height: 1 !important; 319 line-height: 1 !important;
328 letter-spacing: 0.02em !important; 320 letter-spacing: 0.02em !important;
329 font-family: 'Roboto', sans-serif !important; 321 font-family: 'Roboto', sans-serif !important;
330 } 322 }
331 323
332 324
333 /* .v-text-field input { 325 /* .v-text-field input {
334 text-align: center; 326 text-align: center;
335 } */ 327 } */
336 328
337 .card-style { 329 .card-style {
338 background: #7f62f8 !important; 330 background: #7f62f8 !important;
339 border-color: #7f62f8 !important; 331 border-color: #7f62f8 !important;
340 border-radius: 12px; 332 border-radius: 12px;
341 text-align: center !important; 333 text-align: center !important;
342 padding-top: 10px !important; 334 padding-top: 10px !important;
343 } 335 }
344 336
345 .title { 337 .title {
346 line-height: 2 !important; 338 line-height: 2 !important;
347 } 339 }
348 340
349 .v-dialog { 341 .v-dialog {
350 -webkit-box-shadow: none !important; 342 -webkit-box-shadow: none !important;
351 box-shadow: none !important; 343 box-shadow: none !important;
352 } 344 }
353 345
354 .tr { 346 .tr {
355 border-radius: 6px !important; 347 border-radius: 6px !important;
356 } 348 }
357 349
358 .tr:hover { 350 .tr:hover {
359 -webkit-box-shadow: 0px 2px 4px -1px rgba(0, 0, 0, 0.2), 0px 4px 5px 0px rgba(0, 0, 0, 0.14), 0px 1px 10px 0px rgba(0, 0, 0, 0.12) !important; 351 -webkit-box-shadow: 0px 2px 4px -1px rgba(0, 0, 0, 0.2), 0px 4px 5px 0px rgba(0, 0, 0, 0.14), 0px 1px 10px 0px rgba(0, 0, 0, 0.12) !important;
360 box-shadow: 0px 2px 4px -1px rgba(0, 0, 0, 0.2), 0px 4px 5px 0px rgba(0, 0, 0, 0.14), 0px 1px 10px 0px rgba(0, 0, 0, 0.12) !important; 352 box-shadow: 0px 2px 4px -1px rgba(0, 0, 0, 0.2), 0px 4px 5px 0px rgba(0, 0, 0, 0.14), 0px 1px 10px 0px rgba(0, 0, 0, 0.12) !important;
361 } 353 }
362 354
363 .__vev_calendar-wrapper .events-wrapper { 355 .__vev_calendar-wrapper .events-wrapper {
364 display: none; 356 display: none;
365 } 357 }
366 358
367 .__vev_calendar-wrapper .cal-wrapper { 359 .__vev_calendar-wrapper .cal-wrapper {
368 width: 100% !important; 360 width: 100% !important;
369 padding: 0 !important; 361 padding: 0 !important;
370 background: white; 362 background: white;
371 border-radius: 8px; 363 border-radius: 8px;
372 } 364 }
373 365
374 .body-color { 366 .body-color {
375 background: #f6f9ff 367 background: #f6f9ff
376 } 368 }
377 369
378 .clear-button { 370 .clear-button {
379 background: #fa7676 !important; 371 background: #fa7676 !important;
380 border-color: #fa7676 !important; 372 border-color: #fa7676 !important;
381 text-transform: none !important; 373 text-transform: none !important;
382 -webkit-box-shadow: none !important; 374 -webkit-box-shadow: none !important;
383 box-shadow: none !important; 375 box-shadow: none !important;
384 } 376 }
377 .add-button {
378 background: #7f62f8 !important;
379 border-color: #7f62f8 !important;
380 text-transform: none !important;
381 -webkit-box-shadow: none !important;
382 box-shadow: none !important;
383 }
385 384
386 .card-styles { 385 .card-styles {
387 background: #7f62f8 !important; 386 background: #7f62f8 !important;
388 border-color: #7f62f8 !important; 387 border-color: #7f62f8 !important;
389 } 388 }
389 .Card-style {
390 background: #fff !important;
391 border-color: #fff !important;
392 border-radius: 12px;
393 text-align: center !important;
394 padding-top: 10px !important;
395 }
396 /* .clear-btn {
397 background: #7ac29a !important;
398 border-color: #7ac29a !important;
399 text-transform: none !important;
400 -webkit-box-shadow: none !important;
401 box-shadow: none !important;
402 }
403
404 .add-btn {
405 background: #409eff !important;
406 border-color: #409eff !important;
407 text-transform: none !important;
408 -webkit-box-shadow: none !important;
409 box-shadow: none !important;
410 } */
411 .cancel-btn {
412 background: #71d9ea !important;
413 border-color: #71d9ea !important;
414 text-transform: none !important;
415 -webkit-box-shadow: none !important;
416 box-shadow: none !important;
417 }
390 418
391 419
392 /* Side Scroll Bar */ 420 /* Side Scroll Bar */
393 421
394 ::-webkit-scrollbar { 422 ::-webkit-scrollbar {
395 width: 6px; 423 width: 6px;
396 height: 3px; 424 height: 3px;
397 } 425 }
398 426
399 427
400 /* Track */ 428 /* Track */
401 429
402 ::-webkit-scrollbar-track { 430 ::-webkit-scrollbar-track {
403 -webkit-box-shadow: inset 0 0 6px rgba(0, 0, 0, 0.3); 431 -webkit-box-shadow: inset 0 0 6px rgba(0, 0, 0, 0.3);
404 -webkit-border-radius: 10px; 432 -webkit-border-radius: 10px;
405 border-radius: 10px; 433 border-radius: 10px;
406 background-color: #f5f5f5; 434 background-color: #f5f5f5;
407 } 435 }
408 436
409 437
410 /* Handle */ 438 /* Handle */
411 439
412 ::-webkit-scrollbar-thumb { 440 ::-webkit-scrollbar-thumb {
413 -webkit-border-radius: 10px; 441 -webkit-border-radius: 10px;
414 border-radius: 10px; 442 border-radius: 10px;
415 background: rgba(255, 0, 0, 0.8); 443 background: rgba(255, 0, 0, 0.8);
416 -webkit-box-shadow: inset 0 0 6px rgba(0, 0, 0, 0.5); 444 -webkit-box-shadow: inset 0 0 6px rgba(0, 0, 0, 0.5);
417 background-color: #f5f5f5; 445 background-color: #f5f5f5;
418 background-image: -webkit-gradient( linear, left bottom, left top, color-stop(0.44, rgb(122, 153, 217)), color-stop(0.72, rgb(73, 125, 189)), color-stop(0.86, rgb(28, 58, 148))); 446 background-image: -webkit-gradient( linear, left bottom, left top, color-stop(0.44, rgb(122, 153, 217)), color-stop(0.72, rgb(73, 125, 189)), color-stop(0.86, rgb(28, 58, 148)));
419 } 447 }
420 448
421 ::-webkit-scrollbar-thumb:window-inactive { 449 ::-webkit-scrollbar-thumb:window-inactive {
422 background: rgba(255, 0, 0, 0.4); 450 background: rgba(255, 0, 0, 0.4);
423 background-image: -webkit-gradient( linear, left bottom, left top, color-stop(0.44, rgb(122, 153, 217)), color-stop(0.72, rgb(73, 125, 189)), color-stop(0.86, rgb(28, 58, 148))); 451 background-image: -webkit-gradient( linear, left bottom, left top, color-stop(0.44, rgb(122, 153, 217)), color-stop(0.72, rgb(73, 125, 189)), color-stop(0.86, rgb(28, 58, 148)));
424 } 452 }
425 453
426 @media screen and (max-width: 769px) { 454 @media screen and (max-width: 769px) {
427 .top { 455 .top {
428 margin-top: 0 !important; 456 margin-top: 0 !important;
429 } 457 }
430 .userSearch .v-icon { 458 .userSearch .v-icon {
431 font-size: 20px !important; 459 font-size: 20px !important;
432 margin-left: 20px; 460 margin-left: 20px;
433 } 461 }
434 } 462 }
435 463
436 @media screen and (max-width: 380px) { 464 @media screen and (max-width: 380px) {
437 .pl-3 { 465 .pl-3 {
438 padding-left: 0px !important; 466 padding-left: 0px !important;
439 } 467 }
440 .right { 468 .right {
441 float: none !important; 469 float: none !important;
442 } 470 }
443 .subheading { 471 .subheading {
444 font-size: 14px !important; 472 font-size: 14px !important;
445 } 473 }
446 .v-card__actions .v-btn { 474 .v-card__actions .v-btn {
447 margin: 0 0px; 475 margin: 0 0px;
448 min-width: 100px; 476 min-width: 100px;
449 } 477 }
450 .subheading { 478 .subheading {
451 font-size: 12px !important; 479 font-size: 12px !important;
452 } 480 }
453 h5 { 481 h5 {
454 font-size: 13px; 482 font-size: 13px;
455 } 483 }
456 } 484 }
457 485
458 .v-icon { 486 .v-icon {
459 font-size: 30px; 487 font-size: 30px;
460 } 488 }
461 489
462 @media screen and (min-width: 1270px) { 490 @media screen and (min-width: 1270px) {
463 .hide { 491 .hide {
464 display: none; 492 display: none;
465 } 493 }
466 } 494 }
467 495
468 @media screen and (max-width: 420px) { 496 @media screen and (max-width: 420px) {
469 .userSearch .v-text-field .v-label { 497 .userSearch .v-text-field .v-label {
470 line-height: 24px !important; 498 line-height: 24px !important;
471 } 499 }
472 .userSearch .v-label { 500 .userSearch .v-label {
473 font-size: 13px !important; 501 font-size: 13px !important;
474 } 502 }
475 .v-list__tile { 503 .v-list__tile {
476 font-size: 14px !important; 504 font-size: 14px !important;
477 padding: 0 10px !important; 505 padding: 0 10px !important;
478 } 506 }
479 .name { 507 .name {
480 font-size: 15px !important; 508 font-size: 15px !important;
481 } 509 }
482 .mr5 { 510 .mr5 {
483 margin-right: 14px !important; 511 margin-right: 14px !important;
484 } 512 }
485 .addressForm { 513 .addressForm {
486 max-width: 0; 514 max-width: 0;
487 } 515 }
488 .tableRsponsive { 516 .tableRsponsive {
489 display: block; 517 display: block;
490 position: relative; 518 position: relative;
491 overflow: scroll; 519 overflow: scroll;
492 } 520 }
493 } 521 }
494 522
495 @media screen and (max-width: 600px) { 523 @media screen and (max-width: 600px) {
496 img { 524 img {
497 /* position: absolute; */ 525 /* position: absolute; */
498 top: 13px; 526 top: 13px;
499 left: 10px; 527 left: 10px;
500 height: 28px; 528 height: 28px;
501 width: 28px; 529 width: 28px;
502 margin-top: 5px; 530 margin-top: 5px;
503 } 531 }
504 .iconOfDashboard { 532 .iconOfDashboard {
505 top: 0px !important; 533 top: 0px !important;
506 left: 0px !important; 534 left: 0px !important;
507 height: 80px !important; 535 height: 80px !important;
508 width: 80px !important; 536 width: 80px !important;
509 margin-top: 0px !important; 537 margin-top: 0px !important;
510 } 538 }
511 .v-list__tile__title { 539 .v-list__tile__title {
512 padding-left: 12px !important; 540 padding-left: 12px !important;
513 } 541 }
514 } 542 }
515 543
516 .img { 544 .img {
517 height: 200px; 545 height: 200px;
518 width: auto; 546 width: auto;
519 } 547 }
520 548