Commit afc98f0286e450017d45509a4a6eee877daae7c0

Authored by Neeraj Sharma
1 parent dc4d6088aa

implement class validation of edit subaject

Showing 1 changed file with 81 additions and 76 deletions   Show diff stats
src/pages/Subjects/subjects.vue
... ... @@ -39,44 +39,46 @@
39 39 </v-toolbar>
40 40 <v-card flat>
41 41 <v-container fluid>
42   - <v-layout>
43   - <v-flex xs4 class="pt-4 subheading">
44   - <label class="right">Class:</label>
  42 + <v-form ref="formEditSubject" v-model="validEditSubject" lazy-validation>
  43 + <v-layout>
  44 + <v-flex xs4 class="pt-4 subheading">
  45 + <label class="right">Class:</label>
  46 + </v-flex>
  47 + <v-flex xs6 class="ml-3">
  48 + <v-select
  49 + :items="classList"
  50 + label="Select Class"
  51 + v-model="addSubject.selectName"
  52 + item-text="classNum"
  53 + item-value="_id"
  54 + name="Select Class"
  55 + :rules="nameEditSubjectRules"
  56 + required
  57 + ></v-select>
  58 + </v-flex>
  59 + </v-layout>
  60 + <v-layout>
  61 + <v-flex xs4 class="pt-4 subheading">
  62 + <label class="right">Subject:</label>
  63 + </v-flex>
  64 + <v-flex xs6 class="ml-3">
  65 + <v-text-field
  66 + placeholder="fill your Subject"
  67 + v-model="editedItem.subjectName"
  68 + type="text"
  69 + name="email"
  70 + required
  71 + ></v-text-field>
  72 + </v-flex>
  73 + </v-layout>
  74 + <v-flex xs12 sm9 offset-sm2>
  75 + <v-card-actions>
  76 + <v-btn round dark @click.native="close">Cancel</v-btn>
  77 + <v-spacer></v-spacer>
  78 + <v-btn round dark @click="save" :loading="editLoading">Save</v-btn>
  79 + </v-card-actions>
45 80 </v-flex>
46   - <v-flex xs6 class="ml-3">
47   - <v-select
48   - :items="classList"
49   - label="Select Class"
50   - v-model="addSubject.selectName"
51   - item-text="classNum"
52   - item-value="_id"
53   - name="Select Class"
54   - :rules="nameRules"
55   - required
56   - ></v-select>
57   - </v-flex>
58   - </v-layout>
59   - <v-layout>
60   - <v-flex xs4 class="pt-4 subheading">
61   - <label class="right">Subject:</label>
62   - </v-flex>
63   - <v-flex xs6 class="ml-3">
64   - <v-text-field
65   - placeholder="fill your Subject"
66   - v-model="editedItem.subjectName"
67   - type="text"
68   - name="email"
69   - required
70   - ></v-text-field>
71   - </v-flex>
72   - </v-layout>
73   - <v-flex xs12 sm9 offset-sm2>
74   - <v-card-actions>
75   - <v-btn round dark @click.native="close">Cancel</v-btn>
76   - <v-spacer></v-spacer>
77   - <v-btn round dark @click="save">Save</v-btn>
78   - </v-card-actions>
79   - </v-flex>
  81 + </v-form>
80 82 </v-container>
81 83 </v-card>
82 84 </v-flex>
... ... @@ -291,11 +293,13 @@ export default {
291 293 color: "",
292 294 showLoader: false,
293 295 loading: false,
  296 + editLoading: false,
294 297 date: null,
295 298 search: "",
296 299 dialog: false,
297 300 dialog1: false,
298 301 valid: true,
  302 + validEditSubject: true,
299 303 isActive: true,
300 304 newActive: false,
301 305 gender: ["Male", "Female"],
... ... @@ -304,6 +308,7 @@ export default {
304 308 },
305 309 token: "",
306 310 nameRules: [v => !!v || " Class Name is required"],
  311 + nameEditSubjectRules: [v => !!v || " Class Name is required"],
307 312 subjectRules: [v => !!v || " Subject Name is required"],
308 313 headers: [
309 314 {
... ... @@ -336,6 +341,7 @@ export default {
336 341 },
337 342  
338 343 editItem(item) {
  344 + console.log("item", item);
339 345 this.editedItem = Object.assign({}, item);
340 346 this.dialog = true;
341 347 },
... ... @@ -379,10 +385,6 @@ export default {
379 385 },
380 386 close() {
381 387 this.dialog = false;
382   - setTimeout(() => {
383   - this.editedItem = Object.assign({}, this.defaultItem);
384   - this.editedIndex = -1;
385   - }, 300);
386 388 },
387 389 close1() {
388 390 this.dialog1 = false;
... ... @@ -410,42 +412,45 @@ export default {
410 412 this.$refs.form.reset();
411 413 },
412 414 save() {
413   - let editSubject = {
414   - classId: this.addSubject.selectName,
415   - subjectId: this.editedItem._id,
416   - subjectName: this.editedItem.subjectName
417   - };
418   - http()
419   - .put("/updateSubject", editSubject)
420   - .then(response => {
421   - // console.log("editEvent",editEvent);
422   - if ((this.snackbar = true)) {
  415 + if (this.$refs.formEditSubject.validate()) {
  416 + let editSubject = {
  417 + classId: this.addSubject.selectName,
  418 + subjectId: this.editedItem._id,
  419 + subjectName: this.editedItem.subjectName
  420 + };
  421 + this.editLoading = true;
  422 + http()
  423 + .put("/updateSubject", editSubject)
  424 + .then(response => {
  425 + this.snackbar = true;
423 426 this.text = "Successfully Edit Existing Subject";
424   - }
425   - // this.getClassSubject();
426   - http()
427   - .get(
428   - "/getParticularClass",
429   - { params: { classId: this.selectClassId } },
430   - {
431   - headers: { Authorization: "Bearer " + this.token }
432   - }
433   - )
434   - .then(response => {
435   - this.subjectList = response.data.data;
436   - this.getClassSubject();
437   - this.snackbar = true;
438   - this.color = "green";
439   - this.text = response.data.message;
440   - })
441   - .catch(err => {
442   - console.log("err====>", err);
443   - });
444   - })
445   - .catch(error => {
446   - // console.log(error);
447   - });
448   - this.close();
  427 + this.editLoading = false;
  428 + http()
  429 + .get(
  430 + "/getParticularClass",
  431 + { params: { classId: this.selectClassId } },
  432 + {
  433 + headers: { Authorization: "Bearer " + this.token }
  434 + }
  435 + )
  436 + .then(response => {
  437 + this.subjectList = response.data.data;
  438 + this.getClassSubject();
  439 + this.snackbar = true;
  440 + this.color = "green";
  441 + this.text = response.data.message;
  442 + this.close();
  443 + })
  444 + .catch(err => {
  445 + console.log("err====>", err);
  446 + });
  447 + })
  448 + .catch(error => {
  449 + this.editLoading = false;
  450 +
  451 + // console.log(error);
  452 + });
  453 + }
449 454 },
450 455 getClassSubject() {
451 456 this.selectClassId = this.selectClassId;
... ...