changeStudents.vue
2.82 KB
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
<template>
<v-app id="login">
<v-container fluid fill-height>
<v-layout>
<v-flex xs12 sm8 md8 lg5 offset-sm2 offset-lg3 class="mt-5">
<v-card flat class="card-style pa-2" dark id="form">
<v-layout>
<v-flex xs12>
<label class="title text-xs-center">Change Student</label>
</v-flex>
</v-layout>
<v-card-text>
<v-flex xs12 sm8 md8 lg8 offset-sm2>
<v-form class="mt-3">
<v-select
:items="studentsData"
item-text="name"
item-value="_id"
v-model="changeStudent"
label="Students"
></v-select>
</v-form>
</v-flex>
</v-card-text>
<v-card-actions>
<v-flex text-xs-center>
<v-btn round dark :loading="loading" @click="change" class="add-button">Change</v-btn>
</v-flex>
</v-card-actions>
<v-snackbar
:timeout="timeout"
:top="y === 'top'"
:right="x === 'right'"
:vertical="mode === 'vertical'"
v-model="snackbar"
:color="color"
>{{ text }}</v-snackbar>
</v-card>
</v-flex>
</v-layout>
</v-container>
</v-app>
</template>
<script>
import http from "@/Services/http.js";
export default {
data() {
return {
snackbar: false,
y: "top",
x: "right",
mode: "",
timeout: 4000,
text: "",
loading: false,
valid: false,
changeStudent: {},
studentsData: []
};
},
mounted() {
this.getparentStudents();
},
methods: {
change() {
console.log("changeStudent", this.changeStudent);
localStorage.setItem("parentStudentId", this.changeStudent);
this.$router.replace({ path: "/" });
},
getparentStudents() {
this.showLoader = true;
http()
.get("/parentStudentsList")
.then(response => {
// console.log("resssssss", response.data.data.students[0].classId);
this.studentsData = response.data.data.students;
localStorage.setItem(
"parentClassId",
response.data.data.students[0].classId
);
this.showLoader = false;
})
.catch(err => {
console.log("err====>", err);
this.showLoader = false;
});
}
},
computed: {
color() {
return this.loading ? "success" : "error";
}
}
};
</script>
<style scoped>
img {
position: absolute;
top: 13px;
left: 50px;
}
.v-btn--large {
padding: 0px 74px;
}
@media screen and (max-width: 769px) {
.v-btn--large {
font-size: 14px;
height: 44px;
padding: 0 32px;
}
}
</style>