viithiisys / School-Management-dashboard

Download as
Browse Code ยป

Commit 3f818713703aa13672d8542f1296b55aff791692

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

Added functionality to login with phone-no,label change in course detail,show st… 

…art-time and link in latest event, teacher dashboard UI chnage and set router of notice board, solved issue of update api in meeting event
Showing 4 changed files with 115 additions and 22 deletions   Show diff stats
src/pages/Authentication/Login.vue
Diff comments   View file @3f81871
1 <template> 1 <template>
2 <v-app id="login"> 2 <v-app id="login">
3 <v-content> 3 <v-content>
4 <v-container fluid fill-height> 4 <v-container fluid fill-height>
5 <v-snackbar 5 <v-snackbar
6 :timeout="timeout" 6 :timeout="timeout"
7 :top="y === 'top'" 7 :top="y === 'top'"
8 :right="x === 'right'" 8 :right="x === 'right'"
9 :vertical="mode === 'vertical'" 9 :vertical="mode === 'vertical'"
10 v-model="snackbar" 10 v-model="snackbar"
11 :color="color" 11 :color="color"
12 >{{ text }}</v-snackbar> 12 >{{ text }}</v-snackbar>
13 <v-layout align-center justify-center> 13 <v-layout align-center justify-center>
14 <v-flex xs12 sm10 md5 lg4> 14 <v-flex xs12 sm10 md5 lg4>
15 <img 15 <img
16 src="/static/icon.png" 16 src="/static/icon.png"
17 height="40" 17 height="40"
18 width="140" 18 width="140"
19 alt="logo" 19 alt="logo"
20 class="logo mx-auto mb-2" 20 class="logo mx-auto mb-2"
21 /> 21 />
22 <v-card class="elevation-1 px-2 py-3 card" style="background-color: #7852cc" dark> 22 <v-card class="elevation-1 px-2 py-3 card" style="background-color: #7852cc" dark>
23 <img 23 <img
24 src="/static/intrackIllustration.png" 24 src="/static/intrackIllustration.png"
25 class="mx-auto logoSchool" 25 class="mx-auto logoSchool"
26 style="display:block" 26 style="display:block"
27 width="280" 27 width="280"
28 /> 28 />
29 <v-card-text align-center justify-center> 29 <v-card-text align-center justify-center>
30 <v-toolbar-title class="text-xs-center subheadline">SCHOOL LOGIN</v-toolbar-title> 30 <v-toolbar-title class="text-xs-center subheadline">SCHOOL LOGIN</v-toolbar-title>
31 <v-flex xs12 sm12 md12 lg12> 31 <v-flex xs12 sm12 md12 lg12>
32 <v-form ref="form" v-model="valid" lazy-validation> 32 <v-form ref="form" v-model="valid" lazy-validation>
33 <label class="title">Email</label> 33 <label class="title">Email / PhoneNo</label>
34 <v-text-field 34 <v-text-field
35 style="padding: 0px; margin: 0px;" 35 style="padding: 0px; margin: 0px;"
36 v-model.trim="userLogincredentials.email" 36 v-model.trim="userLogincredentials.email"
37 :rules="nameRules" 37 :rules="nameRules"
38 placeholder="Enter your email" 38 placeholder="Enter your email / phoneNo"
39 required 39 required
40 ></v-text-field> 40 ></v-text-field>
41 <label class="title">Password</label> 41 <label class="title">Password</label>
42 <v-text-field 42 <v-text-field
43 style="padding: 0px; margin: 0px;" 43 style="padding: 0px; margin: 0px;"
44 :rules="[rules.required]" 44 :rules="[rules.required]"
45 v-model.trim="userLogincredentials.password" 45 v-model.trim="userLogincredentials.password"
46 :append-icon="e1 ? 'visibility_off' : 'visibility'" 46 :append-icon="e1 ? 'visibility_off' : 'visibility'"
47 :append-icon-cb="() => (e1 = !e1)" 47 :append-icon-cb="() => (e1 = !e1)"
48 :type="e1 ? 'password' : 'text'" 48 :type="e1 ? 'password' : 'text'"
49 name="input-10-1" 49 name="input-10-1"
50 placeholder="Enter Your password" 50 placeholder="Enter Your password"
51 @keyup.enter="login" 51 @keyup.enter="login"
52 ></v-text-field> 52 ></v-text-field>
53 </v-form> 53 </v-form>
54 <v-layout> 54 <v-layout>
55 <v-flex xs12 class="pa-0 ma-0"> 55 <v-flex xs12 class="pa-0 ma-0">
56 <h5 class="right mt-4"> 56 <h5 class="right mt-4">
57 <router-link class="link" to="/forgetpassword">Forgot password</router-link> 57 <router-link class="link" to="/forgetpassword">Forgot password</router-link>
58 </h5> 58 </h5>
59 </v-flex> 59 </v-flex>
60 </v-layout> 60 </v-layout>
61 </v-flex> 61 </v-flex>
62 </v-card-text> 62 </v-card-text>
63 <v-layout> 63 <v-layout>
64 <v-flex sm12> 64 <v-flex sm12>
65 <v-btn 65 <v-btn
66 style="margin: auto;display: block;background-color: #71d9ea; color: #0c0754;" 66 style="margin: auto;display: block;background-color: #71d9ea; color: #0c0754;"
67 dark 67 dark
68 flat 68 flat
69 @click="login" 69 @click="login"
70 :loading="loading" 70 :loading="loading"
71 >Login</v-btn> 71 >Login</v-btn>
72 </v-flex> 72 </v-flex>
73 </v-layout> 73 </v-layout>
74 <v-layout></v-layout> 74 <v-layout></v-layout>
75 </v-card> 75 </v-card>
76 </v-flex> 76 </v-flex>
77 </v-layout> 77 </v-layout>
78 </v-container> 78 </v-container>
79 </v-content> 79 </v-content>
80 </v-app> 80 </v-app>
81 </template> 81 </template>
82 82
83 <script> 83 <script>
84 import http from "@/Services/http.js"; 84 import http from "@/Services/http.js";
85 export default { 85 export default {
86 data() { 86 data() {
87 return { 87 return {
88 snackbar: false, 88 snackbar: false,
89 y: "top", 89 y: "top",
90 x: "right", 90 x: "right",
91 mode: "", 91 mode: "",
92 timeout: 3000, 92 timeout: 3000,
93 text: "", 93 text: "",
94 append: "", 94 append: "",
95 e1: true, 95 e1: true,
96 loading: false, 96 loading: false,
97 remember: false, 97 remember: false,
98 valid: false, 98 valid: false,
99 userLogincredentials: {}, 99 userLogincredentials: {},
100 nameRules: [v => !!v || "Username is required"], 100 nameRules: [v => !!v || "Username is required"],
101 password: "", 101 password: "",
102 email: "", 102 email: "",
103 rules: { 103 rules: {
104 required: value => !!value || "password is Required." 104 required: value => !!value || "password is Required."
105 } 105 }
106 }; 106 };
107 }, 107 },
108 methods: { 108 methods: {
109 async login() { 109 async login() {
110 if (this.$refs.form.validate()) { 110 if (this.$refs.form.validate()) {
111 this.loading = true; 111 this.loading = true;
112 var userdata = { 112 var userdata = {
113 email: this.userLogincredentials.email, 113 email: this.userLogincredentials.email,
114 password: this.userLogincredentials.password 114 password: this.userLogincredentials.password
115 }; 115 };
116 if (/^[0-9]{10}$/.test(this.userLogincredentials.email)) {
117 userdata.fatherCellNo = this.userLogincredentials.email;
118 delete userdata.email;
119 }
116 http() 120 http()
117 .post("/schoolLogin", userdata) 121 .post("/schoolLogin", userdata)
118 .then(response => { 122 .then(response => {
119 // console.log("token",response.data.data); 123 // console.log("token",response.data.data);
120 this.loading = false; 124 this.loading = false;
121 if (response.data.data.role === "ADMIN") { 125 if (response.data.data.role === "ADMIN") {
122 this.$store.dispatch("setToken", response.data.data.token); 126 this.$store.dispatch("setToken", response.data.data.token);
123 this.$store.dispatch("Id", response.data.data.id); 127 this.$store.dispatch("Id", response.data.data.id);
124 this.$store.dispatch("Role", response.data.data.role); 128 this.$store.dispatch("Role", response.data.data.role);
125 this.$router.push("/dashboard"); 129 this.$router.push("/dashboard");
126 } else if (response.data.data.role === "SUPERADMIN") { 130 } else if (response.data.data.role === "SUPERADMIN") {
127 this.$store.dispatch("setSchoolRole", response.data.data.role); 131 this.$store.dispatch("setSchoolRole", response.data.data.role);
128 this.$store.dispatch("setSchoolToken", response.data.data.token); 132 this.$store.dispatch("setSchoolToken", response.data.data.token);
129 this.$router.push("/schooldashboard"); 133 this.$router.push("/schooldashboard");
130 } else if (response.data.data.role === "TEACHER") { 134 } else if (response.data.data.role === "TEACHER") {
131 // console.log("teacher", response.data.data.role); 135 // console.log("teacher", response.data.data.role);
132 this.$store.dispatch("setToken", response.data.data.token); 136 this.$store.dispatch("setToken", response.data.data.token);
133 this.$store.dispatch("Id", response.data.data.id); 137 this.$store.dispatch("Id", response.data.data.id);
134 this.$store.dispatch("Role", response.data.data.role); 138 this.$store.dispatch("Role", response.data.data.role);
135 this.$router.push("/dashboard"); 139 this.$router.push("/dashboard");
136 } else if (response.data.data.role === "LIBRARIAN") { 140 } else if (response.data.data.role === "LIBRARIAN") {
137 this.$store.dispatch("setToken", response.data.data.token); 141 this.$store.dispatch("setToken", response.data.data.token);
138 this.$store.dispatch("Id", response.data.data.id); 142 this.$store.dispatch("Id", response.data.data.id);
139 this.$store.dispatch("Role", response.data.data.role); 143 this.$store.dispatch("Role", response.data.data.role);
140 this.$router.push("/dashboard"); 144 this.$router.push("/dashboard");
141 } else if (response.data.data.role === "ACCOUNTANT") { 145 } else if (response.data.data.role === "ACCOUNTANT") {
142 this.$store.dispatch("setToken", response.data.data.token); 146 this.$store.dispatch("setToken", response.data.data.token);
143 this.$store.dispatch("Id", response.data.data.id); 147 this.$store.dispatch("Id", response.data.data.id);
144 this.$store.dispatch("Role", response.data.data.role); 148 this.$store.dispatch("Role", response.data.data.role);
145 this.$router.push("/dashboard"); 149 this.$router.push("/dashboard");
146 } else if (response.data.data.role === "PARENT") { 150 } else if (response.data.data.role === "PARENT") {
147 this.$store.dispatch("setToken", response.data.data.token); 151 this.$store.dispatch("setToken", response.data.data.token);
148 this.$store.dispatch("Id", response.data.data.id); 152 this.$store.dispatch("Id", response.data.data.id);
149 this.$store.dispatch("Role", response.data.data.role); 153 this.$store.dispatch("Role", response.data.data.role);
150 localStorage.setItem("parentStudentId", response.data.data.id); 154 localStorage.setItem("parentStudentId", response.data.data.id);
151 this.$router.push("/dashboard"); 155 this.$router.push("/dashboard");
152 } 156 }
153 }) 157 })
154 .catch(error => { 158 .catch(error => {
155 if (error.response.data.message) { 159 if (error.response.data.message) {
156 this.text = error.response.data.message; 160 this.text = error.response.data.message;
157 this.snackbar = true; 161 this.snackbar = true;
158 this.loading = false; 162 this.loading = false;
159 } else { 163 } else {
160 this.text = "Server appears to be offline"; 164 this.text = "Server appears to be offline";
161 this.snackbar = true; 165 this.snackbar = true;
162 this.loading = false; 166 this.loading = false;
163 } 167 }
164 }); 168 });
165 } 169 }
166 } 170 }
167 }, 171 },
168 mounted() { 172 mounted() {
169 if (this.$store.state.isUserLoggedIn == true) { 173 if (this.$store.state.isUserLoggedIn == true) {
170 this.$router.push("/dashboard"); 174 this.$router.push("/dashboard");
171 } else if (this.$store.state.isSchoolLoggedIn == true) { 175 } else if (this.$store.state.isSchoolLoggedIn == true) {
172 this.$router.push("/dashboard"); 176 this.$router.push("/dashboard");
173 } 177 }
174 }, 178 },
175 computed: { 179 computed: {
176 color() { 180 color() {
177 return this.loading ? "success" : "error"; 181 return this.loading ? "success" : "error";
178 } 182 }
179 } 183 }
180 }; 184 };
181 </script> 185 </script>
182 186
183 <style scoped lang="css"> 187 <style scoped lang="css">
184 #login { 188 #login {
185 width: 100%; 189 width: 100%;
186 position: absolute; 190 position: absolute;
187 top: 0; 191 top: 0;
188 left: 0; 192 left: 0;
189 content: ""; 193 content: "";
190 z-index: 0; 194 z-index: 0;
191 } 195 }
192 </style> 196 </style>
193 <style scoped> 197 <style scoped>
194 .schoolLogo { 198 .schoolLogo {
195 height: 60%; 199 height: 60%;
196 padding-left: 31%; 200 padding-left: 31%;
197 } 201 }
198 /* img { 202 /* img {
199 position: absolute; 203 position: absolute;
200 top: 13px; 204 top: 13px;
201 left: 8px; 205 left: 8px;
202 } */ 206 } */
203 .v-btn--large { 207 .v-btn--large {
204 padding: 0px 84px; 208 padding: 0px 84px;
205 } 209 }
206 .link { 210 .link {
207 text-decoration: none; 211 text-decoration: none;
208 } 212 }
209 a { 213 a {
210 color: #fff; 214 color: #fff;
211 } 215 }
212 .mt-4 { 216 .mt-4 {
213 margin-top: 21px !important; 217 margin-top: 21px !important;
214 } 218 }
215 .logo { 219 .logo {
216 display: block; 220 display: block;
217 } 221 }
218 @media screen and (max-width: 600px) { 222 @media screen and (max-width: 600px) {
219 img { 223 img {
220 left: 10px; 224 left: 10px;
221 height: 34px; 225 height: 34px;
222 width: 120px; 226 width: 120px;
223 } 227 }
224 .logo { 228 .logo {
225 height: 56px; 229 height: 56px;
226 left: 10px; 230 left: 10px;
227 width: 120px; 231 width: 120px;
228 display: block; 232 display: block;
229 } 233 }
230 .logoSchool { 234 .logoSchool {
231 height: 87px; 235 height: 87px;
232 left: 10px; 236 left: 10px;
233 width: 120px; 237 width: 120px;
234 } 238 }
235 } 239 }
236 </style> 240 </style>
src/pages/Course/courseDetail.vue
Diff comments   View file @3f81871
1 <template> 1 <template>
2 <v-container fluid class="body-color"> 2 <v-container fluid class="body-color">
3 <!-- ****** Edit Chapter detail ****** --> 3 <!-- ****** Edit Chapter detail ****** -->
4 <v-dialog v-model="editCourseDetailDialog" max-width="1000px" scrollable> 4 <v-dialog v-model="editCourseDetailDialog" max-width="1000px" scrollable>
5 <v-card class="card-style pa-2" dark> 5 <v-card class="card-style pa-2" dark>
6 <v-layout> 6 <v-layout>
7 <v-flex xs12> 7 <v-flex xs12>
8 <label class="title text-xs-center">Edit Chapter</label> 8 <label class="title text-xs-center">Edit Chapter</label>
9 <v-icon size="24" class="right" @click="editCourseDetailDialog = false">cancel</v-icon> 9 <v-icon size="24" class="right" @click="editCourseDetailDialog = false">cancel</v-icon>
10 </v-flex> 10 </v-flex>
11 </v-layout> 11 </v-layout>
12 <v-card-text> 12 <v-card-text>
13 <v-layout wrap> 13 <v-layout wrap>
14 <v-flex xs12 sm12> 14 <v-flex xs12 sm12>
15 <v-layout> 15 <v-layout>
16 <v-flex xs4 class="pt-4 subheading"> 16 <v-flex xs4 class="pt-4 subheading">
17 <label class="right">Select Class:</label> 17 <label class="right">Select Class:</label>
18 </v-flex> 18 </v-flex>
19 <v-flex xs8 sm6 class="ml-3"> 19 <v-flex xs8 sm6 class="ml-3">
20 <v-select 20 <v-select
21 small 21 small
22 :items="addclass" 22 :items="addclass"
23 label="Select Class" 23 label="Select Class"
24 v-model="editedCourse.classId" 24 v-model="editedCourse.classId"
25 item-text="classNum" 25 item-text="classNum"
26 item-value="_id" 26 item-value="_id"
27 name="Select Class" 27 name="Select Class"
28 @change="getCourses(editedCourse.classId)" 28 @change="getCourses(editedCourse.classId)"
29 class="mr-2" 29 class="mr-2"
30 required 30 required
31 ></v-select> 31 ></v-select>
32 </v-flex> 32 </v-flex>
33 </v-layout> 33 </v-layout>
34 </v-flex> 34 </v-flex>
35 <v-flex xs12 sm12> 35 <v-flex xs12 sm12>
36 <v-layout> 36 <v-layout>
37 <v-flex xs4 class="pt-4 subheading"> 37 <v-flex xs4 class="pt-4 subheading">
38 <label class="right">Select Course:</label> 38 <label class="right">Select Course:</label>
39 </v-flex> 39 </v-flex>
40 <v-flex xs8 sm6 class="ml-3"> 40 <v-flex xs8 sm6 class="ml-3">
41 <v-select 41 <v-select
42 :items="courseData" 42 :items="courseData"
43 label="Select Course" 43 label="Select Course"
44 v-model="editedCourse.courseId" 44 v-model="editedCourse.courseId"
45 item-text="courseName" 45 item-text="courseName"
46 item-value="_id" 46 item-value="_id"
47 required 47 required
48 class="ml-2" 48 class="ml-2"
49 ></v-select> 49 ></v-select>
50 </v-flex> 50 </v-flex>
51 </v-layout> 51 </v-layout>
52 </v-flex> 52 </v-flex>
53 </v-layout> 53 </v-layout>
54 <v-layout> 54 <v-layout>
55 <v-flex xs12 sm12 md11 lg11> 55 <v-flex xs12 sm12 md11 lg11>
56 <v-card-actions class="hidden-xs-only hidden-sm-only"> 56 <v-card-actions class="hidden-xs-only hidden-sm-only">
57 <v-spacer></v-spacer> 57 <v-spacer></v-spacer>
58 <v-btn round dark @click="save" :loading="editLoading" class="add-button mr-4">Save</v-btn> 58 <v-btn round dark @click="save" :loading="editLoading" class="add-button mr-4">Save</v-btn>
59 </v-card-actions> 59 </v-card-actions>
60 <v-card-actions class="hidden-md-only hidden-lg-only hidden-xl-only"> 60 <v-card-actions class="hidden-md-only hidden-lg-only hidden-xl-only">
61 <v-spacer></v-spacer> 61 <v-spacer></v-spacer>
62 <v-btn round dark @click="save" :loading="editLoading" class="add-button">Save</v-btn> 62 <v-btn round dark @click="save" :loading="editLoading" class="add-button">Save</v-btn>
63 <v-spacer></v-spacer> 63 <v-spacer></v-spacer>
64 </v-card-actions> 64 </v-card-actions>
65 </v-flex> 65 </v-flex>
66 </v-layout> 66 </v-layout>
67 </v-card-text> 67 </v-card-text>
68 </v-card> 68 </v-card>
69 </v-dialog> 69 </v-dialog>
70 <!-- DIALOG BOX - EDIT CHAPTER--> 70 <!-- DIALOG BOX - EDIT CHAPTER-->
71 <v-dialog v-model="editChapterDetailDialog" max-width="1000px" scrollable> 71 <v-dialog v-model="editChapterDetailDialog" max-width="1000px" scrollable>
72 <v-card class="card-style pa-2" dark> 72 <v-card class="card-style pa-2" dark>
73 <v-layout> 73 <v-layout>
74 <v-flex xs12> 74 <v-flex xs12>
75 <label class="title text-xs-center">Edit Chapter</label> 75 <label class="title text-xs-center">Edit Chapter</label>
76 <v-icon 76 <v-icon
77 size="24" 77 size="24"
78 class="right" 78 class="right"
79 @click="editChapterDetailDialog = false; trigger = 'reset'; emptyPdf = 'reset' " 79 @click="editChapterDetailDialog = false; trigger = 'reset'; emptyPdf = 'reset' "
80 >cancel</v-icon> 80 >cancel</v-icon>
81 </v-flex> 81 </v-flex>
82 </v-layout> 82 </v-layout>
83 <v-card-text> 83 <v-card-text>
84 <v-layout wrap> 84 <v-layout wrap>
85 <!-- CHAPTER NAME --> 85 <!-- CHAPTER NAME -->
86 <v-flex xs12 sm12> 86 <v-flex xs12 sm12>
87 <v-layout> 87 <v-layout>
88 <v-flex xs4 class="pt-4 subheading"> 88 <v-flex xs4 class="pt-4 subheading">
89 <label class="right">Chapter Name:</label> 89 <label class="right">Chapter Name:</label>
90 </v-flex> 90 </v-flex>
91 <v-flex xs8 sm6 class="ml-3"> 91 <v-flex xs8 sm6 class="ml-3">
92 <v-text-field 92 <v-text-field
93 v-model="editChapter.chapterName" 93 v-model="editChapter.chapterName"
94 placeholder="fill your Title" 94 placeholder="fill your Title"
95 type="text" 95 type="text"
96 required 96 required
97 ></v-text-field> 97 ></v-text-field>
98 </v-flex> 98 </v-flex>
99 </v-layout> 99 </v-layout>
100 </v-flex> 100 </v-flex>
101 <!-- DESCRIPTION --> 101 <!-- DESCRIPTION -->
102 <v-flex xs12 sm12> 102 <v-flex xs12 sm12>
103 <v-layout> 103 <v-layout>
104 <v-flex xs4 class="pt-4 subheading"> 104 <v-flex xs4 class="pt-4 subheading">
105 <label class="right">Description:</label> 105 <label class="right">Description:</label>
106 </v-flex> 106 </v-flex>
107 <v-flex xs8 sm6 class="ml-3"> 107 <v-flex xs8 sm6 class="ml-3">
108 <v-text-field 108 <v-text-field
109 placeholder="fill your Description" 109 placeholder="fill your Description"
110 v-model="editChapter.description" 110 v-model="editChapter.description"
111 type="text" 111 type="text"
112 required 112 required
113 ></v-text-field> 113 ></v-text-field>
114 </v-flex> 114 </v-flex>
115 </v-layout> 115 </v-layout>
116 </v-flex> 116 </v-flex>
117 <!-- UPLOAD PPT --> 117 <!-- UPLOAD PPT -->
118 <v-flex xs12> 118 <v-flex xs12>
119 <v-layout> 119 <v-layout>
120 <v-flex xs4 class="pt-4 subheading"> 120 <v-flex xs4 class="pt-4 subheading">
121 <label class="right">Upload PPT:</label> 121 <label class="right">Upload PPT:</label>
122 </v-flex> 122 </v-flex>
123 <v-flex xs8 sm6 class="ml-3"> 123 <v-flex xs8 sm6 class="ml-3">
124 <UploadFiles 124 <UploadFiles
125 @fileSelected="fileSelected($event,'uploadPPT')" 125 @fileSelected="fileSelected($event,'uploadPPT')"
126 label="Add PPT" 126 label="Add PPT"
127 reference="EditPpt" 127 reference="EditPpt"
128 id="editPptInput" 128 id="editPptInput"
129 :trigger="trigger" 129 :trigger="trigger"
130 ></UploadFiles> 130 ></UploadFiles>
131 </v-flex> 131 </v-flex>
132 </v-layout> 132 </v-layout>
133 </v-flex> 133 </v-flex>
134 <!-- UPLOAD PDF --> 134 <!-- UPLOAD PDF -->
135 <v-flex xs12> 135 <v-flex xs12>
136 <v-layout> 136 <v-layout>
137 <v-flex xs4 class="pt-4 subheading"> 137 <v-flex xs4 class="pt-4 subheading">
138 <label class="right">Upload PDF:</label> 138 <label class="right">Upload PDF:</label>
139 </v-flex> 139 </v-flex>
140 <v-flex xs8 sm6 class="ml-3"> 140 <v-flex xs8 sm6 class="ml-3">
141 <UploadPdf 141 <UploadPdf
142 @pdfFileSelected="pdfFileSelected($event,'uploadPDF')" 142 @pdfFileSelected="pdfFileSelected($event,'uploadPDF')"
143 label="Add PDF" 143 label="Add PDF"
144 reference="editPdf" 144 reference="editPdf"
145 id="editPdfInput" 145 id="editPdfInput"
146 :emptyPdf="emptyPdf" 146 :emptyPdf="emptyPdf"
147 ></UploadPdf> 147 ></UploadPdf>
148 </v-flex> 148 </v-flex>
149 </v-layout> 149 </v-layout>
150 </v-flex> 150 </v-flex>
151 </v-layout> 151 </v-layout>
152 <!-- <v-flex xs12 v-if="editChapter.chapterPoints.length != 0"> 152 <!-- <v-flex xs12 v-if="editChapter.chapterPoints.length != 0">
153 <v-layout 153 <v-layout
154 wrap 154 wrap
155 v-for="(editChapterPoint,index) in editChapter.chapterPoints" 155 v-for="(editChapterPoint,index) in editChapter.chapterPoints"
156 :key="index" 156 :key="index"
157 > 157 >
158 <v-flex xs12 sm12 md4 class="pt-4 subheading"> 158 <v-flex xs12 sm12 md4 class="pt-4 subheading">
159 <label class="right hidden-xs-only hidden-sm-only">Chapter Points:</label> 159 <label class="right hidden-xs-only hidden-sm-only">Chapter Points:</label>
160 <label class="hidden-md-only hidden-lg-only hidden-xl-only">Chapter Points:</label> 160 <label class="hidden-md-only hidden-lg-only hidden-xl-only">Chapter Points:</label>
161 </v-flex> 161 </v-flex>
162 <v-layout> 162 <v-layout>
163 <v-flex xs10 sm10 sm5 md9 class="ml-3"> 163 <v-flex xs10 sm10 sm5 md9 class="ml-3">
164 <v-text-field :value="editChapterPoint" type="text" required></v-text-field> 164 <v-text-field :value="editChapterPoint" type="text" required></v-text-field>
165 </v-flex> 165 </v-flex>
166 <v-flex xs2 class="pt-4"> 166 <v-flex xs2 class="pt-4">
167 <v-icon @click="deleteUrl(index)">cancel</v-icon> 167 <v-icon @click="deleteUrl(index)">cancel</v-icon>
168 </v-flex> 168 </v-flex>
169 </v-layout> 169 </v-layout>
170 </v-layout> 170 </v-layout>
171 </v-flex>--> 171 </v-flex>-->
172 <v-flex xs12> 172 <v-flex xs12>
173 <div v-for="(updateImage,index) in updates" :key="index"> 173 <div v-for="(updateImage,index) in updates" :key="index">
174 <v-layout wrap> 174 <v-layout wrap>
175 <v-flex xs12 sm12 md4 class="pt-4 subheading"> 175 <v-flex xs12 sm12 md4 class="pt-4 subheading">
176 <label class="right hidden-xs-only hidden-sm-only">Chapter Points:</label> 176 <label class="right hidden-xs-only hidden-sm-only">Chapter Points:</label>
177 <label class="hidden-md-only hidden-lg-only hidden-xl-only">Chapter Points:</label> 177 <label class="hidden-md-only hidden-lg-only hidden-xl-only">Chapter Points:</label>
178 </v-flex> 178 </v-flex>
179 <v-layout> 179 <v-layout>
180 <v-flex xs10 sm12 md9 class="ml-3"> 180 <v-flex xs10 sm12 md9 class="ml-3">
181 <v-text-field 181 <v-text-field
182 v-model="updateImage.value" 182 v-model="updateImage.value"
183 placeholder="Upload new Chapter Points" 183 placeholder="Upload new Chapter Points"
184 required 184 required
185 ></v-text-field> 185 ></v-text-field>
186 </v-flex> 186 </v-flex>
187 <v-flex xs2 class="pt-4"> 187 <v-flex xs2 class="pt-4">
188 <v-icon @click="deleteUpdate(index)" v-if="index !=0">cancel</v-icon> 188 <v-icon @click="deleteUpdate(index)" v-if="index !=0">cancel</v-icon>
189 <v-icon @click="update">add_circle</v-icon> 189 <v-icon @click="update">add_circle</v-icon>
190 </v-flex> 190 </v-flex>
191 </v-layout> 191 </v-layout>
192 </v-layout> 192 </v-layout>
193 </div> 193 </div>
194 </v-flex> 194 </v-flex>
195 <v-layout> 195 <v-layout>
196 <v-flex xs12 sm12 md11 lg11> 196 <v-flex xs12 sm12 md11 lg11>
197 <v-card-actions class="hidden-xs-only hidden-sm-only"> 197 <v-card-actions class="hidden-xs-only hidden-sm-only">
198 <v-spacer></v-spacer> 198 <v-spacer></v-spacer>
199 <v-btn 199 <v-btn
200 round 200 round
201 dark 201 dark
202 @click="saveChapter" 202 @click="saveChapter"
203 :loading="editLoading" 203 :loading="editLoading"
204 class="add-button mr-4" 204 class="add-button mr-4"
205 >Save</v-btn> 205 >Save</v-btn>
206 </v-card-actions> 206 </v-card-actions>
207 <v-card-actions class="hidden-md-only hidden-lg-only hidden-xl-only"> 207 <v-card-actions class="hidden-md-only hidden-lg-only hidden-xl-only">
208 <v-spacer></v-spacer> 208 <v-spacer></v-spacer>
209 <v-btn 209 <v-btn
210 round 210 round
211 dark 211 dark
212 @click="saveChapter" 212 @click="saveChapter"
213 :loading="editLoading" 213 :loading="editLoading"
214 class="add-button" 214 class="add-button"
215 >Save</v-btn> 215 >Save</v-btn>
216 <v-spacer></v-spacer> 216 <v-spacer></v-spacer>
217 </v-card-actions> 217 </v-card-actions>
218 </v-flex> 218 </v-flex>
219 </v-layout> 219 </v-layout>
220 </v-card-text> 220 </v-card-text>
221 </v-card> 221 </v-card>
222 </v-dialog> 222 </v-dialog>
223 <!-- ADD NEW CHAPTER--> 223 <!-- ADD NEW CHAPTER-->
224 <v-dialog v-model="addChapterDialog" max-width="1000px" scrollable> 224 <v-dialog v-model="addChapterDialog" max-width="1000px" scrollable>
225 <v-card class="card-style pa-2" dark> 225 <v-card class="card-style pa-2" dark>
226 <v-layout> 226 <v-layout>
227 <v-flex xs12> 227 <v-flex xs12>
228 <label class="title text-xs-center">Add Chapter Detail</label> 228 <label class="title text-xs-center">Add Chapter Detail</label>
229 <v-icon 229 <v-icon
230 size="24" 230 size="24"
231 class="right" 231 class="right"
232 @click="addChapterDialog = false; trigger = 'reset'; emptyPdf = 'reset' " 232 @click="addChapterDialog = false; trigger = 'reset'; emptyPdf = 'reset' "
233 >cancel</v-icon> 233 >cancel</v-icon>
234 </v-flex> 234 </v-flex>
235 </v-layout> 235 </v-layout>
236 <v-card-text> 236 <v-card-text>
237 <v-layout wrap> 237 <v-layout wrap>
238 <v-flex xs12 sm12> 238 <v-flex xs12 sm12>
239 <v-layout> 239 <v-layout>
240 <v-flex xs4 class="pt-4 subheading"> 240 <v-flex xs4 class="pt-4 subheading">
241 <label class="right">Chapter Name:</label> 241 <label class="right">Chapter Name:</label>
242 </v-flex> 242 </v-flex>
243 <v-flex xs8 sm6 class="ml-3"> 243 <v-flex xs8 sm6 class="ml-3">
244 <v-text-field 244 <v-text-field
245 v-model="addChapterItem.chapterName" 245 v-model="addChapterItem.chapterName"
246 placeholder="fill your Title" 246 placeholder="fill your Title"
247 type="text" 247 type="text"
248 required 248 required
249 ></v-text-field> 249 ></v-text-field>
250 </v-flex> 250 </v-flex>
251 </v-layout> 251 </v-layout>
252 </v-flex> 252 </v-flex>
253 <v-flex xs12 sm12> 253 <v-flex xs12 sm12>
254 <v-layout> 254 <v-layout>
255 <v-flex xs4 class="pt-4 subheading"> 255 <v-flex xs4 class="pt-4 subheading">
256 <label class="right">Description:</label> 256 <label class="right">Description:</label>
257 </v-flex> 257 </v-flex>
258 <v-flex xs8 sm6 class="ml-3"> 258 <v-flex xs8 sm6 class="ml-3">
259 <v-text-field 259 <v-text-field
260 placeholder="fill your Description" 260 placeholder="fill your Description"
261 v-model="addChapterItem.description" 261 v-model="addChapterItem.description"
262 type="text" 262 type="text"
263 required 263 required
264 ></v-text-field> 264 ></v-text-field>
265 </v-flex> 265 </v-flex>
266 </v-layout> 266 </v-layout>
267 </v-flex> 267 </v-flex>
268 <!-- UPLOAD PPT --> 268 <!-- UPLOAD PPT -->
269 <v-flex xs12> 269 <v-flex xs12>
270 <v-layout> 270 <v-layout>
271 <v-flex xs4 class="pt-4 subheading"> 271 <v-flex xs4 class="pt-4 subheading">
272 <label class="right">Upload PPT:</label> 272 <label class="right">Upload PPT:</label>
273 </v-flex> 273 </v-flex>
274 <v-flex xs8 sm6 class="ml-3"> 274 <v-flex xs8 sm6 class="ml-3">
275 <UploadFiles 275 <UploadFiles
276 @fileSelected="fileSelected($event,'uploadPPT')" 276 @fileSelected="fileSelected($event,'uploadPPT')"
277 label="Add PPT" 277 label="Add PPT"
278 reference="newChapterPpt" 278 reference="newChapterPpt"
279 id="newChapterPptInput" 279 id="newChapterPptInput"
280 :trigger="trigger" 280 :trigger="trigger"
281 ></UploadFiles> 281 ></UploadFiles>
282 </v-flex> 282 </v-flex>
283 </v-layout> 283 </v-layout>
284 </v-flex> 284 </v-flex>
285 <!-- UPLOAD PDF --> 285 <!-- UPLOAD PDF -->
286 <v-flex xs12> 286 <v-flex xs12>
287 <v-layout> 287 <v-layout>
288 <v-flex xs4 class="pt-4 subheading"> 288 <v-flex xs4 class="pt-4 subheading">
289 <label class="right">Upload PDF:</label> 289 <label class="right">Upload PDF:</label>
290 </v-flex> 290 </v-flex>
291 <v-flex xs8 sm6 class="ml-3"> 291 <v-flex xs8 sm6 class="ml-3">
292 <UploadPdf 292 <UploadPdf
293 @pdfFileSelected="pdfFileSelected($event,'uploadPDF')" 293 @pdfFileSelected="pdfFileSelected($event,'uploadPDF')"
294 label="Add PDF" 294 label="Add PDF"
295 reference="newChapterPdf" 295 reference="newChapterPdf"
296 id="newChapterPdfInput" 296 id="newChapterPdfInput"
297 :emptyPdf="emptyPdf" 297 :emptyPdf="emptyPdf"
298 ></UploadPdf> 298 ></UploadPdf>
299 </v-flex> 299 </v-flex>
300 </v-layout> 300 </v-layout>
301 </v-flex> 301 </v-flex>
302 </v-layout> 302 </v-layout>
303 <v-flex xs12> 303 <v-flex xs12>
304 <div v-for="(chapterPoints,index) in findsChapterPoint" :key="index"> 304 <div v-for="(chapterPoints,index) in findsChapterPoint" :key="index">
305 <v-layout> 305 <v-layout>
306 <v-flex xs4 class="pt-4 subheading"> 306 <v-flex xs4 class="pt-4 subheading">
307 <label class="right">Chapter Points:</label> 307 <label class="right">Chapter Points:</label>
308 </v-flex> 308 </v-flex>
309 <v-flex xs8 sm8 md6 class="ml-3"> 309 <v-flex xs8 sm8 md6 class="ml-3">
310 <v-text-field 310 <v-text-field
311 placeholder="fill your Chapter Points" 311 placeholder="fill your Chapter Points"
312 v-model="chapterPoints.value" 312 v-model="chapterPoints.value"
313 type="text" 313 type="text"
314 name="link" 314 name="link"
315 required 315 required
316 ></v-text-field> 316 ></v-text-field>
317 </v-flex> 317 </v-flex>
318 <v-flex xs2 class="pt-4"> 318 <v-flex xs2 class="pt-4">
319 <v-icon @click="deleteChapterPoint(index)" v-if="index !=0 ">cancel</v-icon> 319 <v-icon @click="deleteChapterPoint(index)" v-if="index !=0 ">cancel</v-icon>
320 <v-icon @click="addChapterPoint()">add_circle</v-icon> 320 <v-icon @click="addChapterPoint()">add_circle</v-icon>
321 </v-flex> 321 </v-flex>
322 </v-layout> 322 </v-layout>
323 </div> 323 </div>
324 </v-flex> 324 </v-flex>
325 <v-layout> 325 <v-layout>
326 <v-flex xs12 sm12 md11 lg11> 326 <v-flex xs12 sm12 md11 lg11>
327 <v-card-actions class="hidden-xs-only hidden-sm-only"> 327 <v-card-actions class="hidden-xs-only hidden-sm-only">
328 <v-spacer></v-spacer> 328 <v-spacer></v-spacer>
329 <v-btn 329 <v-btn
330 round 330 round
331 dark 331 dark
332 @click="submitChapter" 332 @click="submitChapter"
333 :loading="editLoading" 333 :loading="editLoading"
334 class="add-button mr-4" 334 class="add-button mr-4"
335 >Submit</v-btn> 335 >Submit</v-btn>
336 </v-card-actions> 336 </v-card-actions>
337 <v-card-actions class="hidden-md-only hidden-lg-only hidden-xl-only"> 337 <v-card-actions class="hidden-md-only hidden-lg-only hidden-xl-only">
338 <v-spacer></v-spacer> 338 <v-spacer></v-spacer>
339 <v-btn round dark @click="save" :loading="editLoading" class="add-button">Save</v-btn> 339 <v-btn round dark @click="save" :loading="editLoading" class="add-button">Save</v-btn>
340 <v-spacer></v-spacer> 340 <v-spacer></v-spacer>
341 </v-card-actions> 341 </v-card-actions>
342 </v-flex> 342 </v-flex>
343 </v-layout> 343 </v-layout>
344 </v-card-text> 344 </v-card-text>
345 </v-card> 345 </v-card>
346 </v-dialog> 346 </v-dialog>
347 347
348 <!-- ****** PROFILE Gallery ****** --> 348 <!-- ****** PROFILE Gallery ****** -->
349 349
350 <v-dialog v-model="viewProfileGallery" max-width="1000" scrollable> 350 <v-dialog v-model="viewProfileGallery" max-width="1000" scrollable>
351 <v-card flat class="card-style pa-3" dark> 351 <v-card flat class="card-style pa-3" dark>
352 <v-layout> 352 <v-layout>
353 <v-flex xs12> 353 <v-flex xs12>
354 <label class="title text-xs-center">View Course Detail</label> 354 <label class="title text-xs-center">View Course Detail</label>
355 <v-icon size="24" class="right" @click="closeProfileGallery">cancel</v-icon> 355 <v-icon size="24" class="right" @click="closeProfileGallery">cancel</v-icon>
356 </v-flex> 356 </v-flex>
357 </v-layout> 357 </v-layout>
358 <v-card-text> 358 <v-card-text>
359 <v-container grid-list-md> 359 <v-container grid-list-md>
360 <v-layout wrap> 360 <v-layout wrap>
361 <v-flex xs12> 361 <v-flex xs12>
362 <v-layout> 362 <v-layout>
363 <v-flex xs4 sm6> 363 <v-flex xs4 sm6>
364 <h5 class="right my-1"> 364 <h5 class="right my-1">
365 <b>Chapter Name:</b> 365 <b>Chapter Name:</b>
366 </h5> 366 </h5>
367 </v-flex> 367 </v-flex>
368 <v-flex sm6 xs8> 368 <v-flex sm6 xs8>
369 <h5 class="my-1">{{ editedItem.chapterName }}</h5> 369 <h5 class="my-1">{{ editedItem.chapterName }}</h5>
370 </v-flex> 370 </v-flex>
371 </v-layout> 371 </v-layout>
372 <v-layout> 372 <v-layout>
373 <v-flex xs4 sm6> 373 <v-flex xs4 sm6>
374 <h5 class="right my-1"> 374 <h5 class="right my-1">
375 <b>Description:</b> 375 <b>Description:</b>
376 </h5> 376 </h5>
377 </v-flex> 377 </v-flex>
378 <v-flex sm6 xs8> 378 <v-flex sm6 xs8>
379 <h5 class="my-1">{{ editedItem.description }}</h5> 379 <h5 class="my-1">{{ editedItem.description }}</h5>
380 </v-flex> 380 </v-flex>
381 </v-layout> 381 </v-layout>
382 <v-layout> 382 <v-layout>
383 <v-flex xs5 sm6> 383 <v-flex xs5 sm6>
384 <h5 class="right my-1"> 384 <h5 class="right my-1">
385 <b>You Tube Link Url:</b> 385 <b>Chapter Point:</b>
386 </h5> 386 </h5>
387 </v-flex> 387 </v-flex>
388 <v-flex sm6 xs8> 388 <v-flex sm6 xs8>
389 <h5 class="my-1"> 389 <h5 class="my-1">
390 <ul v-for="chapterPoint in editedItem.chapterPoints" :key="chapterPoint"> 390 <ul v-for="chapterPoint in editedItem.chapterPoints" :key="chapterPoint">
391 <li>{{ chapterPoint}}</li> 391 <li>{{ chapterPoint}}</li>
392 </ul> 392 </ul>
393 </h5> 393 </h5>
394 </v-flex> 394 </v-flex>
395 </v-layout> 395 </v-layout>
396 </v-flex> 396 </v-flex>
397 </v-layout> 397 </v-layout>
398 </v-container> 398 </v-container>
399 </v-card-text> 399 </v-card-text>
400 </v-card> 400 </v-card>
401 </v-dialog> 401 </v-dialog>
402 402
403 <!-- ****** Course Detail TABLE ****** --> 403 <!-- ****** Course Detail TABLE ****** -->
404 404
405 <v-toolbar color="transparent" flat> 405 <v-toolbar color="transparent" flat>
406 <v-btn 406 <v-btn
407 fab 407 fab
408 dark 408 dark
409 class="open-dialog-button hidden-xl-only hidden-md-only hidden-lg-only" 409 class="open-dialog-button hidden-xl-only hidden-md-only hidden-lg-only"
410 small 410 small
411 @click="addCourseDetailDialog = true" 411 @click="addCourseDetailDialog = true"
412 > 412 >
413 <v-icon dark>add</v-icon> 413 <v-icon dark>add</v-icon>
414 </v-btn> 414 </v-btn>
415 <v-btn 415 <v-btn
416 round 416 round
417 class="open-dialog-button hidden-sm-only hidden-xs-only" 417 class="open-dialog-button hidden-sm-only hidden-xs-only"
418 dark 418 dark
419 @click="addCourseDetailDialog = true" 419 @click="addCourseDetailDialog = true"
420 > 420 >
421 <v-icon class="white--text pr-1" size="20">add</v-icon>Add Course Detail 421 <v-icon class="white--text pr-1" size="20">add</v-icon>Add Course Detail
422 </v-btn> 422 </v-btn>
423 <v-flex xs12 sm4 md2> 423 <v-flex xs12 sm4 md2>
424 <v-select 424 <v-select
425 small 425 small
426 :items="addclass" 426 :items="addclass"
427 label="Select Class" 427 label="Select Class"
428 v-model="getCourse.classId" 428 v-model="getCourse.classId"
429 item-text="classNum" 429 item-text="classNum"
430 item-value="_id" 430 item-value="_id"
431 name="Select Class" 431 name="Select Class"
432 @change="getCourses(getCourse.classId)" 432 @change="getCourses(getCourse.classId)"
433 class="mr-2" 433 class="mr-2"
434 required 434 required
435 ></v-select> 435 ></v-select>
436 </v-flex> 436 </v-flex>
437 <v-flex xs12 sm4 md2> 437 <v-flex xs12 sm4 md2>
438 <v-select 438 <v-select
439 :items="courseData" 439 :items="courseData"
440 label="Select Course" 440 label="Select Course"
441 v-model="getCourse.courseId" 441 v-model="getCourse.courseId"
442 item-text="courseName" 442 item-text="courseName"
443 item-value="_id" 443 item-value="_id"
444 required 444 required
445 class="ml-2" 445 class="ml-2"
446 @change="getCourseDetailsList(getCourse.courseId)" 446 @change="getCourseDetailsList(getCourse.courseId)"
447 ></v-select> 447 ></v-select>
448 </v-flex> 448 </v-flex>
449 <v-spacer></v-spacer> 449 <v-spacer></v-spacer>
450 <v-card-title class="body-1" v-show="show"> 450 <v-card-title class="body-1" v-show="show">
451 <v-btn icon large flat @click="displaySearch"> 451 <v-btn icon large flat @click="displaySearch">
452 <v-avatar size="27"> 452 <v-avatar size="27">
453 <img src="/static/icon/search.png" alt="icon" /> 453 <img src="/static/icon/search.png" alt="icon" />
454 </v-avatar> 454 </v-avatar>
455 </v-btn> 455 </v-btn>
456 </v-card-title> 456 </v-card-title>
457 <v-flex xs8 sm8 md3 lg2 v-show="showSearch"> 457 <v-flex xs8 sm8 md3 lg2 v-show="showSearch">
458 <v-layout> 458 <v-layout>
459 <v-text-field v-model="search" label="Search" prepend-inner-icon="search" color="primary"></v-text-field> 459 <v-text-field v-model="search" label="Search" prepend-inner-icon="search" color="primary"></v-text-field>
460 <v-icon @click="closeSearch" color="error">close</v-icon> 460 <v-icon @click="closeSearch" color="error">close</v-icon>
461 </v-layout> 461 </v-layout>
462 </v-flex> 462 </v-flex>
463 </v-toolbar> 463 </v-toolbar>
464 <v-data-table 464 <v-data-table
465 :headers="headers" 465 :headers="headers"
466 :items="CourseDetailsList" 466 :items="CourseDetailsList"
467 :pagination.sync="pagination" 467 :pagination.sync="pagination"
468 :search="search" 468 :search="search"
469 item-key="_id" 469 item-key="_id"
470 > 470 >
471 <template slot="items" slot-scope="props"> 471 <template slot="items" slot-scope="props">
472 <tr class="tr" @click="courseTableRow(props.item._id)"> 472 <tr class="tr" @click="courseTableRow(props.item._id)">
473 <td class="td td-row">{{ props.index + 1}}</td> 473 <td class="td td-row">{{ props.index + 1}}</td>
474 <td class="td td-row text-xs-center">{{ props.item.classId.classNum }}</td> 474 <td class="td td-row text-xs-center">{{ props.item.classId.classNum }}</td>
475 <td class="td td-row text-xs-center">{{ props.item.courseId.courseName }}</td> 475 <td class="td td-row text-xs-center">{{ props.item.courseId.courseName }}</td>
476 <td class="td td-row text-xs-center"> 476 <td class="td td-row text-xs-center">
477 <div style="vertical-align: top;"> 477 <div style="vertical-align: top;">
478 <v-tooltip top> 478 <v-tooltip top>
479 <v-icon 479 <v-icon
480 slot="activator" 480 slot="activator"
481 style="cursor:pointer;font-size:22px;position: relative;top: -4px; " 481 style="cursor:pointer;font-size:22px;position: relative;top: -4px; "
482 class="mr-3" 482 class="mr-3"
483 @click="addChapters(props.item)" 483 @click="addChapters(props.item)"
484 >add_circle_outline</v-icon> 484 >add_circle_outline</v-icon>
485 <span>Add</span> 485 <span>Add</span>
486 </v-tooltip> 486 </v-tooltip>
487 <v-tooltip top> 487 <v-tooltip top>
488 <img 488 <img
489 slot="activator" 489 slot="activator"
490 style="cursor:pointer; width:25px; height:25px; " 490 style="cursor:pointer; width:25px; height:25px; "
491 class="mr-3" 491 class="mr-3"
492 @click="props.expanded = !props.expanded" 492 @click="props.expanded = !props.expanded"
493 src="/static/icon/view.png" 493 src="/static/icon/view.png"
494 /> 494 />
495 <span>View</span> 495 <span>View</span>
496 </v-tooltip> 496 </v-tooltip>
497 <v-tooltip top> 497 <v-tooltip top>
498 <img 498 <img
499 slot="activator" 499 slot="activator"
500 style="cursor:pointer; width:20px; height:18px; " 500 style="cursor:pointer; width:20px; height:18px; "
501 class="mr-3" 501 class="mr-3"
502 @click="editItem(props.item)" 502 @click="editItem(props.item)"
503 src="/static/icon/edit.png" 503 src="/static/icon/edit.png"
504 /> 504 />
505 <span>Edit</span> 505 <span>Edit</span>
506 </v-tooltip> 506 </v-tooltip>
507 <v-tooltip top> 507 <v-tooltip top>
508 <img 508 <img
509 slot="activator" 509 slot="activator"
510 style="cursor:pointer; width:20px; height:20px; " 510 style="cursor:pointer; width:20px; height:20px; "
511 class="mr-3" 511 class="mr-3"
512 @click="deleteItem(props.item)" 512 @click="deleteItem(props.item)"
513 src="/static/icon/delete.png" 513 src="/static/icon/delete.png"
514 /> 514 />
515 <span>Delete</span> 515 <span>Delete</span>
516 </v-tooltip> 516 </v-tooltip>
517 </div> 517 </div>
518 </td> 518 </td>
519 </tr> 519 </tr>
520 </template> 520 </template>
521 <template slot="expand"> 521 <template slot="expand">
522 <v-data-table :items="chapters" hide-actions item-key="chapterName" style="width: auto;"> 522 <v-data-table :items="chapters" hide-actions item-key="chapterName" style="width: auto;">
523 <template slot="items" slot-scope="props"> 523 <template slot="items" slot-scope="props">
524 <tr class="tr" @click="props.expanded = !props.expanded"> 524 <tr class="tr" @click="props.expanded = !props.expanded">
525 <td class="td td-row">{{ props.index + 1}}</td> 525 <td class="td td-row">{{ props.index + 1}}</td>
526 <td class="text-xs-center td td-row">{{ props.item.chapterName}}</td> 526 <td class="text-xs-center td td-row">{{ props.item.chapterName}}</td>
527 <td class="text-xs-center td td-row">{{ props.item.description }}</td> 527 <td class="text-xs-center td td-row">{{ props.item.description }}</td>
528 <td class="text-xs-center td td-row"> 528 <td class="text-xs-center td td-row">
529 <v-tooltip top> 529 <v-tooltip top>
530 <v-icon 530 <v-icon
531 slot="activator" 531 slot="activator"
532 style="cursor:pointer;font-size:22px;position: relative;top: -4px; " 532 style="cursor:pointer;font-size:22px;position: relative;top: -4px; "
533 class="mr-3" 533 class="mr-3"
534 @click="$router.push({name: 'Live Online Class', query: {chapterId: props.item._id, chapterName: props.item.chapterName, courseId: getCourse.courseId, classId: getCourse.classId }})" 534 @click="$router.push({name: 'Live Online Class', query: {chapterId: props.item._id, chapterName: props.item.chapterName, courseId: getCourse.courseId, classId: getCourse.classId }})"
535 >video_call</v-icon> 535 >video_call</v-icon>
536 <span>Live Session</span> 536 <span>Live Session</span>
537 </v-tooltip> 537 </v-tooltip>
538 <v-tooltip top> 538 <v-tooltip top>
539 <img 539 <img
540 slot="activator" 540 slot="activator"
541 style="cursor:pointer; width:25px; height:25px; " 541 style="cursor:pointer; width:25px; height:25px; "
542 class="mr-3" 542 class="mr-3"
543 @click="profile(props.item)" 543 @click="profile(props.item)"
544 src="/static/icon/view.png" 544 src="/static/icon/view.png"
545 /> 545 />
546 <span>View</span> 546 <span>View</span>
547 </v-tooltip> 547 </v-tooltip>
548 <v-tooltip top> 548 <v-tooltip top>
549 <img 549 <img
550 slot="activator" 550 slot="activator"
551 style="cursor:pointer; width:20px; height:18px; " 551 style="cursor:pointer; width:20px; height:18px; "
552 class="mr-3" 552 class="mr-3"
553 @click="editChapterItem(props.item)" 553 @click="editChapterItem(props.item)"
554 src="/static/icon/edit.png" 554 src="/static/icon/edit.png"
555 /> 555 />
556 <span>Edit</span> 556 <span>Edit</span>
557 </v-tooltip> 557 </v-tooltip>
558 <v-tooltip top> 558 <v-tooltip top>
559 <img 559 <img
560 slot="activator" 560 slot="activator"
561 style="cursor:pointer; width:20px; height:20px; " 561 style="cursor:pointer; width:20px; height:20px; "
562 class="mr-3" 562 class="mr-3"
563 @click="deleteChapters(props.item)" 563 @click="deleteChapters(props.item)"
564 src="/static/icon/delete.png" 564 src="/static/icon/delete.png"
565 /> 565 />
566 <span>Delete Chapter</span> 566 <span>Delete Chapter</span>
567 </v-tooltip> 567 </v-tooltip>
568 </td> 568 </td>
569 </tr> 569 </tr>
570 </template> 570 </template>
571 </v-data-table> 571 </v-data-table>
572 </template> 572 </template>
573 573
574 <v-alert 574 <v-alert
575 slot="no-results" 575 slot="no-results"
576 :value="true" 576 :value="true"
577 color="error" 577 color="error"
578 icon="warning" 578 icon="warning"
579 >Your search for "{{ search }}" found no results.</v-alert> 579 >Your search for "{{ search }}" found no results.</v-alert>
580 </v-data-table> 580 </v-data-table>
581 <!-- ****** ADD Course Detail ****** --> 581 <!-- ****** ADD Course Detail ****** -->
582 <v-dialog v-model="addCourseDetailDialog" max-width="600px" persistent> 582 <v-dialog v-model="addCourseDetailDialog" max-width="600px" persistent>
583 <v-card flat class="card-style pa-2" dark> 583 <v-card flat class="card-style pa-2" dark>
584 <v-layout> 584 <v-layout>
585 <v-flex xs12> 585 <v-flex xs12>
586 <label class="title text-xs-center">Add Course Details</label> 586 <label class="title text-xs-center">Add Course Details</label>
587 <v-icon 587 <v-icon
588 size="24" 588 size="24"
589 class="right" 589 class="right"
590 @click="addCourseDetailDialog = false; clear() ; trigger = 'reset' ; emptyPdf = 'reset' " 590 @click="addCourseDetailDialog = false; clear() ; trigger = 'reset' ; emptyPdf = 'reset' "
591 >cancel</v-icon> 591 >cancel</v-icon>
592 </v-flex> 592 </v-flex>
593 </v-layout> 593 </v-layout>
594 <v-form ref="form" v-model="valid" lazy-validation> 594 <v-form ref="form" v-model="valid" lazy-validation>
595 <v-container fluid> 595 <v-container fluid>
596 <v-flex xs12> 596 <v-flex xs12>
597 <v-layout> 597 <v-layout>
598 <v-flex xs4 class="pt-4 subheading"> 598 <v-flex xs4 class="pt-4 subheading">
599 <label class="right hidden-xs-only hidden-sm-only">Select Class:</label> 599 <label class="right hidden-xs-only hidden-sm-only">Select Class:</label>
600 <label class="right hidden-lg-only hidden-md-only hidden-xl-only">Class:</label> 600 <label class="right hidden-lg-only hidden-md-only hidden-xl-only">Class:</label>
601 </v-flex> 601 </v-flex>
602 <v-flex xs8 sm8 md7 class="ml-3"> 602 <v-flex xs8 sm8 md7 class="ml-3">
603 <v-select 603 <v-select
604 :items="addclass" 604 :items="addclass"
605 label="Select Class" 605 label="Select Class"
606 v-model="addCourseDetail.classId" 606 v-model="addCourseDetail.classId"
607 item-text="classNum" 607 item-text="classNum"
608 item-value="_id" 608 item-value="_id"
609 name="Select Class" 609 name="Select Class"
610 :rules="clsssRules" 610 :rules="clsssRules"
611 @change="getCourses(addCourseDetail.classId)" 611 @change="getCourses(addCourseDetail.classId)"
612 required 612 required
613 ></v-select> 613 ></v-select>
614 </v-flex> 614 </v-flex>
615 </v-layout> 615 </v-layout>
616 </v-flex> 616 </v-flex>
617 <v-flex xs12> 617 <v-flex xs12>
618 <v-layout> 618 <v-layout>
619 <v-flex xs4 class="pt-4 subheading"> 619 <v-flex xs4 class="pt-4 subheading">
620 <label class="right hidden-xs-only hidden-sm-only">Select Course:</label> 620 <label class="right hidden-xs-only hidden-sm-only">Select Course:</label>
621 <label class="right hidden-lg-only hidden-md-only hidden-xl-only">Course:</label> 621 <label class="right hidden-lg-only hidden-md-only hidden-xl-only">Course:</label>
622 </v-flex> 622 </v-flex>
623 <v-flex xs8 sm8 md7 class="ml-3"> 623 <v-flex xs8 sm8 md7 class="ml-3">
624 <v-select 624 <v-select
625 :items="courseData" 625 :items="courseData"
626 label="Select Course" 626 label="Select Course"
627 v-model="addCourseDetail.courseId" 627 v-model="addCourseDetail.courseId"
628 item-text="courseName" 628 item-text="courseName"
629 item-value="_id" 629 item-value="_id"
630 :rules="courseRules" 630 :rules="courseRules"
631 required 631 required
632 ></v-select> 632 ></v-select>
633 </v-flex> 633 </v-flex>
634 </v-layout> 634 </v-layout>
635 </v-flex> 635 </v-flex>
636 <v-flex xs12> 636 <v-flex xs12>
637 <v-layout> 637 <v-layout>
638 <v-flex xs4 class="pt-4 subheading"> 638 <v-flex xs4 class="pt-4 subheading">
639 <label class="right">Chapter Name:</label> 639 <label class="right">Chapter Name:</label>
640 </v-flex> 640 </v-flex>
641 <v-flex xs8 sm8 md7 class="ml-3"> 641 <v-flex xs8 sm8 md7 class="ml-3">
642 <v-text-field 642 <v-text-field
643 v-model="addCourseDetail.chapterName" 643 v-model="addCourseDetail.chapterName"
644 placeholder="fill your Title" 644 placeholder="fill your Title"
645 name="name" 645 name="name"
646 type="text" 646 type="text"
647 :rules="chapterNameRules" 647 :rules="chapterNameRules"
648 required 648 required
649 ></v-text-field> 649 ></v-text-field>
650 </v-flex> 650 </v-flex>
651 </v-layout> 651 </v-layout>
652 </v-flex> 652 </v-flex>
653 <!-- DESCRIPTION --> 653 <!-- DESCRIPTION -->
654 <v-flex xs12> 654 <v-flex xs12>
655 <v-layout> 655 <v-layout>
656 <v-flex xs4 class="pt-4 subheading"> 656 <v-flex xs4 class="pt-4 subheading">
657 <label class="right">Description:</label> 657 <label class="right">Description:</label>
658 </v-flex> 658 </v-flex>
659 <v-flex xs8 sm8 md7 class="ml-3"> 659 <v-flex xs8 sm8 md7 class="ml-3">
660 <v-text-field 660 <v-text-field
661 placeholder="fill your Description" 661 placeholder="fill your Description"
662 :rules="descriptionRules" 662 :rules="descriptionRules"
663 v-model="addCourseDetail.description" 663 v-model="addCourseDetail.description"
664 type="text" 664 type="text"
665 name="email" 665 name="email"
666 required 666 required
667 ></v-text-field> 667 ></v-text-field>
668 </v-flex> 668 </v-flex>
669 </v-layout> 669 </v-layout>
670 </v-flex> 670 </v-flex>
671 <!-- UPLOAD PPT --> 671 <!-- UPLOAD PPT -->
672 <v-flex xs12> 672 <v-flex xs12>
673 <v-layout> 673 <v-layout>
674 <v-flex xs4 class="pt-4 subheading"> 674 <v-flex xs4 class="pt-4 subheading">
675 <label class="right">Upload PPT:</label> 675 <label class="right">Upload PPT:</label>
676 </v-flex> 676 </v-flex>
677 <v-flex xs8 sm8 md7 class="ml-3"> 677 <v-flex xs8 sm8 md7 class="ml-3">
678 <UploadFiles 678 <UploadFiles
679 @fileSelected="fileSelected($event,'uploadPPT')" 679 @fileSelected="fileSelected($event,'uploadPPT')"
680 label="Add PPT" 680 label="Add PPT"
681 reference="newCoursePpt" 681 reference="newCoursePpt"
682 id="newCoursePptInput" 682 id="newCoursePptInput"
683 :trigger="trigger" 683 :trigger="trigger"
684 ></UploadFiles> 684 ></UploadFiles>
685 </v-flex> 685 </v-flex>
686 </v-layout> 686 </v-layout>
687 </v-flex> 687 </v-flex>
688 <!-- UPLOAD PDF --> 688 <!-- UPLOAD PDF -->
689 <v-flex xs12> 689 <v-flex xs12>
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">Upload PDF:</label> 692 <label class="right">Upload PDF:</label>
693 </v-flex> 693 </v-flex>
694 <v-flex xs8 sm8 md7 class="ml-3"> 694 <v-flex xs8 sm8 md7 class="ml-3">
695 <UploadPdf 695 <UploadPdf
696 @pdfFileSelected="pdfFileSelected($event,'uploadPDF')" 696 @pdfFileSelected="pdfFileSelected($event,'uploadPDF')"
697 label="Add PDF" 697 label="Add PDF"
698 reference="newCoursePdf" 698 reference="newCoursePdf"
699 id="newCoursePdfInput" 699 id="newCoursePdfInput"
700 :emptyPdf="emptyPdf" 700 :emptyPdf="emptyPdf"
701 ></UploadPdf> 701 ></UploadPdf>
702 </v-flex> 702 </v-flex>
703 </v-layout> 703 </v-layout>
704 </v-flex> 704 </v-flex>
705 <v-layout> 705 <v-layout>
706 <v-flex xs12> 706 <v-flex xs12>
707 <div v-for="(chapterPoints,index) in finds" :key="index"> 707 <div v-for="(chapterPoints,index) in finds" :key="index">
708 <v-layout> 708 <v-layout>
709 <v-flex xs4 class="pt-4 subheading"> 709 <v-flex xs4 class="pt-4 subheading">
710 <label class="right">Chapter Points:</label> 710 <label class="right">Chapter Points:</label>
711 </v-flex> 711 </v-flex>
712 <v-flex xs8 sm8 md6 class="ml-3"> 712 <v-flex xs8 sm8 md6 class="ml-3">
713 <v-text-field 713 <v-text-field
714 placeholder="fill your Chapter Points" 714 placeholder="fill your Chapter Points"
715 v-model="chapterPoints.value" 715 v-model="chapterPoints.value"
716 type="text" 716 type="text"
717 required 717 required
718 ></v-text-field> 718 ></v-text-field>
719 </v-flex> 719 </v-flex>
720 <v-flex xs2 class="pt-4"> 720 <v-flex xs2 class="pt-4">
721 <v-icon @click="deleteFind(index)" v-if="index !=0 ">cancel</v-icon> 721 <v-icon @click="deleteFind(index)" v-if="index !=0 ">cancel</v-icon>
722 <v-icon @click="addFind">add_circle</v-icon> 722 <v-icon @click="addFind">add_circle</v-icon>
723 </v-flex> 723 </v-flex>
724 </v-layout> 724 </v-layout>
725 </div> 725 </div>
726 </v-flex> 726 </v-flex>
727 </v-layout> 727 </v-layout>
728 <v-layout> 728 <v-layout>
729 <v-flex xs12 sm12> 729 <v-flex xs12 sm12>
730 <v-layout class="right"> 730 <v-layout class="right">
731 <v-btn 731 <v-btn
732 @click="clear();" 732 @click="clear();"
733 round 733 round
734 dark 734 dark
735 class="clear-button" 735 class="clear-button"
736 >Clear</v-btn> 736 >Clear</v-btn>
737 <v-btn @click="submit" round dark :loading="loading" class="add-button">Add</v-btn> 737 <v-btn @click="submit" round dark :loading="loading" class="add-button">Add</v-btn>
738 </v-layout> 738 </v-layout>
739 </v-flex> 739 </v-flex>
740 </v-layout> 740 </v-layout>
741 </v-container> 741 </v-container>
742 </v-form> 742 </v-form>
743 </v-card> 743 </v-card>
744 </v-dialog> 744 </v-dialog>
745 <v-snackbar 745 <v-snackbar
746 :timeout="timeout" 746 :timeout="timeout"
747 :top="y === 'top'" 747 :top="y === 'top'"
748 :right="x === 'right'" 748 :right="x === 'right'"
749 :vertical="mode === 'vertical'" 749 :vertical="mode === 'vertical'"
750 v-model="snackbar" 750 v-model="snackbar"
751 :color="color" 751 :color="color"
752 >{{ text }}</v-snackbar> 752 >{{ text }}</v-snackbar>
753 <div class="loader" v-if="showLoader"> 753 <div class="loader" v-if="showLoader">
754 <v-progress-circular indeterminate color="white"></v-progress-circular> 754 <v-progress-circular indeterminate color="white"></v-progress-circular>
755 </div> 755 </div>
756 </v-container> 756 </v-container>
757 </template> 757 </template>
758 758
759 <script> 759 <script>
760 import http from "@/Services/http.js"; 760 import http from "@/Services/http.js";
761 import UploadFiles from "@/pages/Common/UploadFiles.vue"; 761 import UploadFiles from "@/pages/Common/UploadFiles.vue";
762 import UploadPdf from "@/pages/Common/UploadPdf.vue"; 762 import UploadPdf from "@/pages/Common/UploadPdf.vue";
763 import AllApiCalls from "@/Services/AllApiCalls.js"; 763 import AllApiCalls from "@/Services/AllApiCalls.js";
764 764
765 export default { 765 export default {
766 mixins: [AllApiCalls], 766 mixins: [AllApiCalls],
767 components: { 767 components: {
768 UploadFiles, 768 UploadFiles,
769 UploadPdf 769 UploadPdf
770 }, 770 },
771 data: () => ({ 771 data: () => ({
772 snackbar: false, 772 snackbar: false,
773 y: "top", 773 y: "top",
774 x: "right", 774 x: "right",
775 mode: "", 775 mode: "",
776 timeout: 3000, 776 timeout: 3000,
777 text: "", 777 text: "",
778 loading: false, 778 loading: false,
779 color: "", 779 color: "",
780 date: null, 780 date: null,
781 search: "", 781 search: "",
782 show: true, 782 show: true,
783 addCourseDetailDialog: false, 783 addCourseDetailDialog: false,
784 showSearch: false, 784 showSearch: false,
785 showLoader: false, 785 showLoader: false,
786 editCourseDetailDialog: false, 786 editCourseDetailDialog: false,
787 editChapterDetailDialog: false, 787 editChapterDetailDialog: false,
788 viewProfileGallery: false, 788 viewProfileGallery: false,
789 valid: true, 789 valid: true,
790 editLoading: false, 790 editLoading: false,
791 addclass: [], 791 addclass: [],
792 courseData: [], 792 courseData: [],
793 addSection: [], 793 addSection: [],
794 getCourse: {}, 794 getCourse: {},
795 finds: [{ value: "" }], 795 finds: [{ value: "" }],
796 findsChapterPoint: [{ value: "" }], 796 findsChapterPoint: [{ value: "" }],
797 updates: [], 797 updates: [],
798 youTubeLink: {}, 798 youTubeLink: {},
799 addCourseDetail: { 799 addCourseDetail: {
800 chapters: [ 800 chapters: [
801 { 801 {
802 chapterName: "", 802 chapterName: "",
803 description: "", 803 description: "",
804 chapterPoints: [] 804 chapterPoints: []
805 } 805 }
806 ] 806 ]
807 }, 807 },
808 chapters: [], 808 chapters: [],
809 pagination: { 809 pagination: {
810 rowsPerPage: 10 810 rowsPerPage: 10
811 }, 811 },
812 editFiles: [], 812 editFiles: [],
813 files: [], 813 files: [],
814 courseData: [], 814 courseData: [],
815 token: "", 815 token: "",
816 courseId: "", 816 courseId: "",
817 clsssRules: [v => !!v || " Class is required"], 817 clsssRules: [v => !!v || " Class is required"],
818 courseRules: [v => !!v || " Course is required"], 818 courseRules: [v => !!v || " Course is required"],
819 chapterNameRules: [v => !!v || " Tilte is required"], 819 chapterNameRules: [v => !!v || " Tilte is required"],
820 descriptionRules: [v => !!v || " Description is required"], 820 descriptionRules: [v => !!v || " Description is required"],
821 headers: [ 821 headers: [
822 { 822 {
823 align: "", 823 align: "",
824 text: "No", 824 text: "No",
825 sortable: false, 825 sortable: false,
826 value: "index" 826 value: "index"
827 }, 827 },
828 { 828 {
829 text: "Class Name", 829 text: "Class Name",
830 value: "classNum", 830 value: "classNum",
831 sortable: false, 831 sortable: false,
832 align: "center" 832 align: "center"
833 }, 833 },
834 { 834 {
835 text: "Course Name", 835 text: "Course Name",
836 value: "courseName", 836 value: "courseName",
837 sortable: false, 837 sortable: false,
838 align: "center" 838 align: "center"
839 }, 839 },
840 { text: "Action", value: "", sortable: false, align: "center" } 840 { text: "Action", value: "", sortable: false, align: "center" }
841 ], 841 ],
842 CourseDetailsList: [], 842 CourseDetailsList: [],
843 editedIndex: -1, 843 editedIndex: -1,
844 editedItem: {}, 844 editedItem: {},
845 editedCourse: {}, 845 editedCourse: {},
846 editChapter: { 846 editChapter: {
847 chapterPoints: [] 847 chapterPoints: []
848 }, 848 },
849 index: "", 849 index: "",
850 addChapterItem: {}, 850 addChapterItem: {},
851 addChapterItemObj: {}, 851 addChapterItemObj: {},
852 addChapterDialog: false 852 addChapterDialog: false
853 }), 853 }),
854 methods: { 854 methods: {
855 getCourses(classId) { 855 getCourses(classId) {
856 this.showLoader = true; 856 this.showLoader = true;
857 http() 857 http()
858 .get("/getCourseesList", { 858 .get("/getCourseesList", {
859 params: { 859 params: {
860 classId: classId 860 classId: classId
861 } 861 }
862 }) 862 })
863 .then(response => { 863 .then(response => {
864 this.editChapter.courseId = ""; 864 this.editChapter.courseId = "";
865 this.courseData = response.data.data; 865 this.courseData = response.data.data;
866 // console.log("this.courseData", this.courseData);
867 this.showLoader = false; 866 this.showLoader = false;
868 }) 867 })
869 .catch(err => { 868 .catch(err => {
870 console.log("err====>", err); 869 console.log("err====>", err);
871 this.showLoader = false; 870 this.showLoader = false;
872 }); 871 });
873 }, 872 },
874 getCourseDetailsList() { 873 getCourseDetailsList() {
875 this.showLoader = true; 874 this.showLoader = true;
876 http() 875 http()
877 .get("/getParticularCourseDetail", { 876 .get("/getParticularCourseDetail", {
878 params: { 877 params: {
879 courseId: this.getCourse.courseId 878 courseId: this.getCourse.courseId
880 } 879 }
881 }) 880 })
882 .then(response => { 881 .then(response => {
883 this.CourseDetailsList = response.data.data; 882 this.CourseDetailsList = response.data.data;
884 if (response.data.data[0]) { 883 if (response.data.data[0]) {
885 this.chapters = response.data.data[0].chapters; 884 this.chapters = response.data.data[0].chapters;
886 console.log(" this.chapters - ", this.chapters);
887 } 885 }
888 // console.log("response.data.data", this.CourseDetailsList);
889 this.showLoader = false; 886 this.showLoader = false;
890 }) 887 })
891 .catch(error => { 888 .catch(error => {
892 // console.log("err====>", err); 889 // console.log("err====>", err);
893 this.showLoader = false; 890 this.showLoader = false;
894 if (error.response.status === 401) { 891 if (error.response.status === 401) {
895 this.$router.replace({ path: "/" }); 892 this.$router.replace({ path: "/" });
896 this.$store.dispatch("setToken", null); 893 this.$store.dispatch("setToken", null);
897 this.$store.dispatch("Id", null); 894 this.$store.dispatch("Id", null);
898 } 895 }
899 }); 896 });
900 }, 897 },
901 courseTableRow(id) { 898 courseTableRow(id) {
902 // console.log("click7", id);
903 this.courseId = id; 899 this.courseId = id;
904 }, 900 },
905 addChapters(item) { 901 addChapters(item) {
906 this.editedIndex = this.CourseDetailsList.indexOf(item); 902 this.editedIndex = this.CourseDetailsList.indexOf(item);
907 this.addChapterItemObj = Object.assign({}, item); 903 this.addChapterItemObj = Object.assign({}, item);
908 this.addChapterItem.courseDetailId = this.addChapterItemObj._id; 904 this.addChapterItem.courseDetailId = this.addChapterItemObj._id;
909 this.addChapterDialog = true; 905 this.addChapterDialog = true;
910 }, 906 },
911 submitChapter() { 907 submitChapter() {
912 this.addChapterItem.chapterPoints = []; 908 this.addChapterItem.chapterPoints = [];
913 for (let i = 0; i < this.findsChapterPoint.length; i++) { 909 for (let i = 0; i < this.findsChapterPoint.length; i++) {
914 this.addChapterItem.chapterPoints.push(this.findsChapterPoint[i].value); 910 this.addChapterItem.chapterPoints.push(this.findsChapterPoint[i].value);
915 } 911 }
916 // console.log("this.addChapterItem", this.addChapterItem);
917 this.loading = true; 912 this.loading = true;
918 http() 913 http()
919 .put("/addChapters", this.addChapterItem) 914 .put("/addChapters", this.addChapterItem)
920 .then(response => { 915 .then(response => {
921 this.addChapterDialog = false; 916 this.addChapterDialog = false;
922 this.loading = false; 917 this.loading = false;
923 this.snackbar = true; 918 this.snackbar = true;
924 this.text = response.data.message; 919 this.text = response.data.message;
925 this.color = "green"; 920 this.color = "green";
926 this.addChapterItem = {}; 921 this.addChapterItem = {};
927 this.removeChapterPoint(); 922 this.removeChapterPoint();
928 this.getCourseDetailsList(); 923 this.getCourseDetailsList();
929 }) 924 })
930 .catch(error => { 925 .catch(error => {
931 this.snackbar = true; 926 this.snackbar = true;
932 this.text = error.response.data.message; 927 this.text = error.response.data.message;
933 this.color = "error"; 928 this.color = "error";
934 this.loading = false; 929 this.loading = false;
935 }); 930 });
936 }, 931 },
937 profile(item) { 932 profile(item) {
938 this.editedIndex = this.chapters.indexOf(item); 933 this.editedIndex = this.chapters.indexOf(item);
939 this.editedItem = Object.assign({}, item); 934 this.editedItem = Object.assign({}, item);
940 this.viewProfileGallery = true; 935 this.viewProfileGallery = true;
941 }, 936 },
942 editItem(item) { 937 editItem(item) {
943 this.editedIndex = this.CourseDetailsList.indexOf(item); 938 this.editedIndex = this.CourseDetailsList.indexOf(item);
944 this.editedCourse = Object.assign({}, item); 939 this.editedCourse = Object.assign({}, item);
945 this.editCourseDetailDialog = true; 940 this.editCourseDetailDialog = true;
946 }, 941 },
947 editChapterItem(item) { 942 editChapterItem(item) {
948 this.editedIndex = this.chapters.indexOf(item); 943 this.editedIndex = this.chapters.indexOf(item);
949 this.editChapter = Object.assign({}, item); 944 this.editChapter = Object.assign({}, item);
950 this.updates = []; 945 this.updates = [];
951 for (let i = 0; i < this.editChapter.chapterPoints.length; i++) { 946 for (let i = 0; i < this.editChapter.chapterPoints.length; i++) {
952 this.updates.push({ value: this.editChapter.chapterPoints[i] }); 947 this.updates.push({ value: this.editChapter.chapterPoints[i] });
953 } 948 }
954 this.editChapterDetailDialog = true; 949 this.editChapterDetailDialog = true;
955 }, 950 },
956 deleteItem(item) { 951 deleteItem(item) {
957 let deleteGallery = { 952 let deleteGallery = {
958 courseDetailId: item._id 953 courseDetailId: item._id
959 }; 954 };
960 http() 955 http()
961 .delete( 956 .delete(
962 "/deleteCourseDetail", 957 "/deleteCourseDetail",
963 confirm("Are you sure you want to delete this?") && { 958 confirm("Are you sure you want to delete this?") && {
964 params: deleteGallery, 959 params: deleteGallery,
965 headers: { 960 headers: {
966 Authorization: "Bearer " + this.token 961 Authorization: "Bearer " + this.token
967 } 962 }
968 } 963 }
969 ) 964 )
970 .then(response => { 965 .then(response => {
971 this.snackbar = true; 966 this.snackbar = true;
972 this.text = "Successfully delete Course Details"; 967 this.text = "Successfully delete Course Details";
973 this.color = "green"; 968 this.color = "green";
974 this.getCourseDetailsList(); 969 this.getCourseDetailsList();
975 }) 970 })
976 .catch(error => { 971 .catch(error => {
977 // console.log(error); 972 // console.log(error);
978 this.snackbar = true; 973 this.snackbar = true;
979 this.text = error.response.data.message; 974 this.text = error.response.data.message;
980 this.color = "error"; 975 this.color = "error";
981 }); 976 });
982 }, 977 },
983 deleteChapters(item) { 978 deleteChapters(item) {
984 // console.log("item", item); 979 // console.log("item", item);
985 let deleteChapters = { 980 let deleteChapters = {
986 courseDetailId: this.courseId, 981 courseDetailId: this.courseId,
987 chapterId: item._id 982 chapterId: item._id
988 }; 983 };
989 http() 984 http()
990 .put( 985 .put(
991 "/deleteChapters", 986 "/deleteChapters",
992 confirm("Are you sure you want to delete this?") && deleteChapters 987 confirm("Are you sure you want to delete this?") && deleteChapters
993 ) 988 )
994 .then(response => { 989 .then(response => {
995 this.snackbar = true; 990 this.snackbar = true;
996 this.text = "Successfully delete Chapters"; 991 this.text = "Successfully delete Chapters";
997 this.color = "green"; 992 this.color = "green";
998 this.getCourseDetailsList(); 993 this.getCourseDetailsList();
999 }) 994 })
1000 .catch(error => { 995 .catch(error => {
1001 // console.log(error); 996 // console.log(error);
1002 this.snackbar = true; 997 this.snackbar = true;
1003 this.text = error.response.data.message; 998 this.text = error.response.data.message;
1004 this.color = "error"; 999 this.color = "error";
1005 }); 1000 });
1006 }, 1001 },
1007 close() { 1002 close() {
1008 this.editCourseDetailDialog = false; 1003 this.editCourseDetailDialog = false;
1009 }, 1004 },
1010 closeProfileGallery() { 1005 closeProfileGallery() {
1011 this.viewProfileGallery = false; 1006 this.viewProfileGallery = false;
1012 }, 1007 },
1013 submit() { 1008 submit() {
1014 let chapters = []; 1009 let chapters = [];
1015 var chapterPoints = []; 1010 var chapterPoints = [];
1016 for (let i = 0; i < this.finds.length; i++) { 1011 for (let i = 0; i < this.finds.length; i++) {
1017 chapterPoints.push(this.finds[i].value); 1012 chapterPoints.push(this.finds[i].value);
1018 // console.log("this.finds[i].value", this.finds[i].value);
1019 chapters = [ 1013 chapters = [
1020 { 1014 {
1021 chapterName: this.addCourseDetail.chapterName, 1015 chapterName: this.addCourseDetail.chapterName,
1022 description: this.addCourseDetail.description, 1016 description: this.addCourseDetail.description,
1023 chapterPoints: chapterPoints, 1017 chapterPoints: chapterPoints,
1024 uploadPdf: this.pdfFile, 1018 uploadPdf: this.pdfFile,
1025 uploadPpt: this.pptFile 1019 uploadPpt: this.pptFile
1026 } 1020 }
1027 ]; 1021 ];
1028 } 1022 }
1029 if (this.$refs.form.validate()) { 1023 if (this.$refs.form.validate()) {
1030 // console.log("this.addCourseDetail", this.addCourseDetail);
1031 var courseDetailsData = { 1024 var courseDetailsData = {
1032 classId: this.addCourseDetail.classId, 1025 classId: this.addCourseDetail.classId,
1033 courseId: this.addCourseDetail.courseId, 1026 courseId: this.addCourseDetail.courseId,
1034 chapters: chapters 1027 chapters: chapters
1035 }; 1028 };
1036 this.loading = true; 1029 this.loading = true;
1037 http() 1030 http()
1038 .post("/createCourseDetail", courseDetailsData) 1031 .post("/createCourseDetail", courseDetailsData)
1039 .then(response => { 1032 .then(response => {
1040 this.addCourseDetailDialog = false; 1033 this.addCourseDetailDialog = false;
1041 this.loading = false; 1034 this.loading = false;
1042 this.snackbar = true; 1035 this.snackbar = true;
1043 this.text = response.data.message; 1036 this.text = response.data.message;
1044 this.color = "green"; 1037 this.color = "green";
1045 this.clear(); 1038 this.clear();
1046 this.trigger = "reset"; 1039 this.trigger = "reset";
1047 this.emptyPdf = "reset"; 1040 this.emptyPdf = "reset";
1048 this.removeAddFind(); 1041 this.removeAddFind();
1049 }) 1042 })
1050 .catch(error => { 1043 .catch(error => {
1051 this.snackbar = true; 1044 this.snackbar = true;
1052 this.text = error.response.data.message; 1045 this.text = error.response.data.message;
1053 this.color = "error"; 1046 this.color = "error";
1054 this.loading = false; 1047 this.loading = false;
1055 }); 1048 });
1056 } 1049 }
1057 }, 1050 },
1058 clear() { 1051 clear() {
1059 this.$refs.form.reset(); 1052 this.$refs.form.reset();
1060 }, 1053 },
1061 saveChapter() { 1054 saveChapter() {
1062 this.editedItem.courseDetailId = this.editedItem._id; 1055 this.editedItem.courseDetailId = this.editedItem._id;
1063 // console.log("this.updates", this.updates);
1064 var chapterPoints = []; 1056 var chapterPoints = [];
1065 for (let i = 0; i < this.updates.length; i++) { 1057 for (let i = 0; i < this.updates.length; i++) {
1066 chapterPoints.push(this.updates[i].value); 1058 chapterPoints.push(this.updates[i].value);
1067 } 1059 }
1068 var updateData = { 1060 var updateData = {
1069 courseDetailId: this.courseId, 1061 courseDetailId: this.courseId,
1070 chapterId: this.editChapter._id, 1062 chapterId: this.editChapter._id,
1071 chapterName: this.editChapter.chapterName, 1063 chapterName: this.editChapter.chapterName,
1072 description: this.editChapter.description, 1064 description: this.editChapter.description,
1073 chapterPoints: chapterPoints, 1065 chapterPoints: chapterPoints,
1074 uploadPdf: this.pdfFile, 1066 uploadPdf: this.pdfFile,
1075 uploadPpt: this.pptFile 1067 uploadPpt: this.pptFile
1076 }; 1068 };
1077 this.editLoading = true; 1069 this.editLoading = true;
1078 http() 1070 http()
1079 .put("/updateChapters", updateData) 1071 .put("/updateChapters", updateData)
1080 .then(response => { 1072 .then(response => {
1081 this.editChapterDetailDialog = false; 1073 this.editChapterDetailDialog = false;
1082 this.snackbar = true; 1074 this.snackbar = true;
1083 this.text = response.data.message; 1075 this.text = response.data.message;
1084 this.color = "green"; 1076 this.color = "green";
1085 this.editLoading = false; 1077 this.editLoading = false;
1086 // this.removeUpdatePoints(); 1078 // this.removeUpdatePoints();
1087 this.trigger = "reset"; 1079 this.trigger = "reset";
1088 this.emptyPdf = "reset"; 1080 this.emptyPdf = "reset";
1089 this.getCourseDetailsList(); 1081 this.getCourseDetailsList();
1090 }) 1082 })
1091 .catch(error => { 1083 .catch(error => {
1092 this.editLoading = false; 1084 this.editLoading = false;
1093 this.snackbar = true; 1085 this.snackbar = true;
1094 this.text = error.response.data.message; 1086 this.text = error.response.data.message;
1095 this.color = "error"; 1087 this.color = "error";
1096 }); 1088 });
1097 }, 1089 },
1098 save() { 1090 save() {
1099 var updateData = { 1091 var updateData = {
1100 courseDetailId: this.editedCourse._id, 1092 courseDetailId: this.editedCourse._id,
1101 courseId: this.editedCourse.courseId, 1093 courseId: this.editedCourse.courseId,
1102 classId: this.editedCourse.classId 1094 classId: this.editedCourse.classId
1103 }; 1095 };
1104 this.editLoading = true; 1096 this.editLoading = true;
1105 http() 1097 http()
1106 .put("/updateCourseDetail", updateData) 1098 .put("/updateCourseDetail", updateData)
1107 .then(response => { 1099 .then(response => {
1108 this.getCourseDetailsList(); 1100 this.getCourseDetailsList();
1109 this.editCourseDetailDialog = false; 1101 this.editCourseDetailDialog = false;
1110 this.snackbar = true; 1102 this.snackbar = true;
1111 this.text = response.data.message; 1103 this.text = response.data.message;
1112 this.color = "green"; 1104 this.color = "green";
1113 this.editLoading = false; 1105 this.editLoading = false;
1114 // this.editChapterPointName = ""; 1106 // this.editChapterPointName = "";
1115 this.editFiles = []; 1107 this.editFiles = [];
1116 }) 1108 })
1117 .catch(error => { 1109 .catch(error => {
1118 this.editLoading = false; 1110 this.editLoading = false;
1119 this.snackbar = true; 1111 this.snackbar = true;
1120 this.text = error.response.data.message; 1112 this.text = error.response.data.message;
1121 this.color = "error"; 1113 this.color = "error";
1122 }); 1114 });
1123 }, 1115 },
1124 getAllClasses() { 1116 getAllClasses() {
1125 http() 1117 http()
1126 .get("/getClassesList", { 1118 .get("/getClassesList", {
1127 headers: { Authorization: "Bearer " + this.token } 1119 headers: { Authorization: "Bearer " + this.token }
1128 }) 1120 })
1129 .then(response => { 1121 .then(response => {
1130 this.addclass = response.data.data; 1122 this.addclass = response.data.data;
1131 }) 1123 })
1132 .catch(err => { 1124 .catch(err => {
1133 // console.log("err====>", err); 1125 // console.log("err====>", err);
1134 }); 1126 });
1135 }, 1127 },
1136 removeChapterPoint: function() { 1128 removeChapterPoint: function() {
1137 this.findsChapterPoint = [{ value: "" }]; 1129 this.findsChapterPoint = [{ value: "" }];
1138 }, 1130 },
1139 removeAddFind: function() { 1131 removeAddFind: function() {
1140 this.finds = [{ value: "" }]; 1132 this.finds = [{ value: "" }];
1141 }, 1133 },
1142 addFind: function() { 1134 addFind: function() {
1143 this.finds.push({ value: "" }); 1135 this.finds.push({ value: "" });
1144 }, 1136 },
1145 addChapterPoint: function() { 1137 addChapterPoint: function() {
1146 this.findsChapterPoint.push({ value: "" }); 1138 this.findsChapterPoint.push({ value: "" });
1147 }, 1139 },
1148 update: function() { 1140 update: function() {
1149 this.updates.push({ value: "" }); 1141 this.updates.push({ value: "" });
1150 }, 1142 },
1151 // removeUpdatePoints: function() { 1143 // removeUpdatePoints: function() {
1152 // this.updates = [{ value: "" }]; 1144 // this.updates = [{ value: "" }];
1153 // }, 1145 // },
1154 deleteFind: function(index) { 1146 deleteFind: function(index) {
1155 this.finds.splice(index, 1); 1147 this.finds.splice(index, 1);
1156 if (index === 0) this.addFind(); 1148 if (index === 0) this.addFind();
1157 }, 1149 },
1158 deleteChapterPoint: function(index) { 1150 deleteChapterPoint: function(index) {
1159 this.findsChapterPoint.splice(index, 1); 1151 this.findsChapterPoint.splice(index, 1);
1160 if (index === 0) this.addChapterPoint(); 1152 if (index === 0) this.addChapterPoint();
1161 }, 1153 },
1162 deleteUpdate: function(index) { 1154 deleteUpdate: function(index) {
1163 this.updates.splice(index, 1); 1155 this.updates.splice(index, 1);
1164 if (index === 0) this.update(); 1156 if (index === 0) this.update();
1165 }, 1157 },
1166 deleteUrl: function(index, youTubelinkId, id) { 1158 deleteUrl: function(index, youTubelinkId, id) {
1167 this.editChapter.chapterPoints.splice(index, 1); 1159 this.editChapter.chapterPoints.splice(index, 1);
1168 if (index === 0) this.update(); 1160 if (index === 0) this.update();
1169 }, 1161 },
1170 displaySearch() { 1162 displaySearch() {
1171 this.show = false; 1163 this.show = false;
1172 this.showSearch = true; 1164 this.showSearch = true;
1173 }, 1165 },
1174 closeSearch() { 1166 closeSearch() {
1175 this.showSearch = false; 1167 this.showSearch = false;
1176 this.show = true; 1168 this.show = true;
1177 this.search = ""; 1169 this.search = "";
1178 } 1170 }
1179 }, 1171 },
1180 mounted() { 1172 mounted() {
1181 this.token = this.$store.state.token; 1173 this.token = this.$store.state.token;
1182 this.getAllClasses(); 1174 this.getAllClasses();
1183 } 1175 }
1184 }; 1176 };
1185 </script> 1177 </script>
src/pages/Dashboard/dashboard.vue
Diff comments   View file @3f81871
1 <template> 1 <template>
2 <v-app id="pages-dasboard"> 2 <v-app id="pages-dasboard">
3 <!-- ****** VIEW PROFIL NOTICE BOARD ****** --> 3 <!-- ****** VIEW PROFIL NOTICE BOARD ****** -->
4 <!-- <v-dialog v-model="dialogNotice" max-width="940px" scrollable> 4 <!-- <v-dialog v-model="dialogNotice" max-width="940px" scrollable>
5 <v-card> 5 <v-card>
6 <v-toolbar color="grey lighten-2" flat> 6 <v-toolbar color="grey lighten-2" flat>
7 <v-spacer></v-spacer> 7 <v-spacer></v-spacer>
8 <v-toolbar-title> 8 <v-toolbar-title>
9 <h3>Notice Board</h3> 9 <h3>Notice Board</h3>
10 </v-toolbar-title> 10 </v-toolbar-title>
11 <v-spacer></v-spacer> 11 <v-spacer></v-spacer>
12 <v-icon @click="closeNotice">close</v-icon> 12 <v-icon @click="closeNotice">close</v-icon>
13 </v-toolbar> 13 </v-toolbar>
14 <v-card-text> 14 <v-card-text>
15 <v-layout> 15 <v-layout>
16 <v-flex align-center justify-center layout text-xs-center class="mt-2"> 16 <v-flex align-center justify-center layout text-xs-center class="mt-2">
17 <img src="/static/icon/user.png" width="70px" v-if="!notice.eventImageUrl" /> 17 <img src="/static/icon/user.png" width="70px" v-if="!notice.eventImageUrl" />
18 <img :src="notice.eventImageUrl" width="280px" v-else-if="notice.eventImageUrl" /> 18 <img :src="notice.eventImageUrl" width="280px" v-else-if="notice.eventImageUrl" />
19 </v-flex> 19 </v-flex>
20 </v-layout> 20 </v-layout>
21 <v-container grid-list-md> 21 <v-container grid-list-md>
22 <v-layout wrap> 22 <v-layout wrap>
23 <v-flex> 23 <v-flex>
24 <v-layout> 24 <v-layout>
25 <v-flex xs5 sm6> 25 <v-flex xs5 sm6>
26 <h5 class="right my-1"> 26 <h5 class="right my-1">
27 <b>Title:</b> 27 <b>Title:</b>
28 </h5> 28 </h5>
29 </v-flex> 29 </v-flex>
30 <v-flex sm6 xs8> 30 <v-flex sm6 xs8>
31 <h5 class="my-1">{{ notice.title }}</h5> 31 <h5 class="my-1">{{ notice.title }}</h5>
32 </v-flex> 32 </v-flex>
33 </v-layout> 33 </v-layout>
34 <v-layout> 34 <v-layout>
35 <v-flex xs5 sm6> 35 <v-flex xs5 sm6>
36 <h5 class="right my-1"> 36 <h5 class="right my-1">
37 <b>Description:</b> 37 <b>Description:</b>
38 </h5> 38 </h5>
39 </v-flex> 39 </v-flex>
40 <v-flex sm6 xs8> 40 <v-flex sm6 xs8>
41 <h5 class="my-1">{{ notice.description }}</h5> 41 <h5 class="my-1">{{ notice.description }}</h5>
42 </v-flex> 42 </v-flex>
43 </v-layout> 43 </v-layout>
44 </v-flex> 44 </v-flex>
45 </v-layout> 45 </v-layout>
46 </v-container> 46 </v-container>
47 </v-card-text> 47 </v-card-text>
48 </v-card> 48 </v-card>
49 </v-dialog>--> 49 </v-dialog>-->
50 <!-- <v-container fluid grid-list-xl> --> 50 <!-- <v-container fluid grid-list-xl> -->
51 51
52 <!-- LOADER --> 52 <!-- LOADER -->
53 <div class="loader" v-if="showLoader"> 53 <div class="loader" v-if="showLoader">
54 <v-progress-circular indeterminate color="white"></v-progress-circular> 54 <v-progress-circular indeterminate color="white"></v-progress-circular>
55 </div> 55 </div>
56 56
57 <!-- SNACKBAR --> 57 <!-- SNACKBAR -->
58 <v-snackbar 58 <v-snackbar
59 :timeout="timeout" 59 :timeout="timeout"
60 :top="y === 'top'" 60 :top="y === 'top'"
61 :right="x === 'right'" 61 :right="x === 'right'"
62 :vertical="mode === 'vertical'" 62 :vertical="mode === 'vertical'"
63 v-model="snackbar" 63 v-model="snackbar"
64 :color="snackbarColor" 64 :color="snackbarColor"
65 > 65 >
66 {{ text }} 66 {{ text }}
67 <v-spacer></v-spacer> 67 <v-spacer></v-spacer>
68 <v-btn flat text @click="snackbar = false">X</v-btn> 68 <v-btn flat text @click="snackbar = false">X</v-btn>
69 </v-snackbar> 69 </v-snackbar>
70 70
71 <!-- DIALOG BOX EVENT DETAILS --> 71 <!-- DIALOG BOX EVENT DETAILS -->
72 <v-dialog v-model="viewEventDetails" max-width="500"> 72 <v-dialog v-model="viewEventDetails" max-width="500">
73 <v-card flat class="card-style pa-2" dark> 73 <v-card flat class="card-style pa-2" dark>
74 <!-- TITLE --> 74 <!-- TITLE -->
75 <v-layout> 75 <v-layout>
76 <v-layout> 76 <v-layout>
77 <v-flex xs12> 77 <v-flex xs12>
78 <label class="title text-xs-center">{{particularEvent.title}}</label> 78 <label class="title text-xs-center">{{particularEvent.title}}</label>
79 <v-icon size="24" class="right" @click="viewEventDetails = false">cancel</v-icon> 79 <v-icon size="24" class="right" @click="viewEventDetails = false">cancel</v-icon>
80 </v-flex> 80 </v-flex>
81 </v-layout> 81 </v-layout>
82 </v-layout> 82 </v-layout>
83 83
84 <v-card-text> 84 <v-card-text>
85 <v-list dark class="card-style"> 85 <v-list dark class="card-style">
86 <v-list-tile> 86 <v-list-tile>
87 <v-list-tile-content> 87 <v-list-tile-content>
88 <v-list-tile-title>Date Of Event : {{moment(particularEvent.dateOfEvent).format("DD MMMM, YYYY")}}</v-list-tile-title> 88 <v-list-tile-title>Date Of Event : {{moment(particularEvent.dateOfEvent).format("DD MMMM, YYYY")}}</v-list-tile-title>
89 </v-list-tile-content> 89 </v-list-tile-content>
90 </v-list-tile> 90 </v-list-tile>
91 <v-list-tile> 91 <v-list-tile>
92 <v-list-tile-content> 92 <v-list-tile-content>
93 <v-list-tile-title>Start Time : {{particularEvent.startTime}}</v-list-tile-title>
94 </v-list-tile-content>
95 </v-list-tile>
96 <v-list-tile>
97 <v-list-tile-content>
93 <v-list-tile-title>Duration : {{particularEvent.duration}}</v-list-tile-title> 98 <v-list-tile-title>Duration : {{particularEvent.duration}}</v-list-tile-title>
94 </v-list-tile-content> 99 </v-list-tile-content>
95 </v-list-tile> 100 </v-list-tile>
101 <v-list-tile>
102 <v-list-tile-content>
103 <v-list-tile-title>Link : <a :href="particularEvent.link">{{particularEvent.link}}</a></v-list-tile-title>
104 </v-list-tile-content>
105 </v-list-tile>
96 </v-list> 106 </v-list>
97 </v-card-text> 107 </v-card-text>
98 </v-card> 108 </v-card>
99 </v-dialog> 109 </v-dialog>
100 110
101 <v-layout wrap row> 111 <v-layout wrap row>
102 <v-flex xs12 sm12 md9> 112 <v-flex xs12 sm12 md9>
103 <v-container fluid grid-list-xl> 113 <v-container fluid grid-list-xl>
104 <!-- ***** Total Students ***** --> 114 <!-- ***** Total Students ***** -->
105 <v-layout wrap class v-if="$store.state.role != 'PARENT' "> 115 <v-layout wrap class v-if="$store.state.role != 'PARENT' ">
106 <v-flex xs12 sm12 md3> 116 <v-flex xs12 sm12 md3>
107 <router-link :to="{ name:'Students' }"> 117 <router-link :to="{ name:'Students' }">
108 <v-card class="card pink-bgcolor"> 118 <v-card class="card pink-bgcolor">
109 <v-card-title primary-title class="titleCard white--text py-3">Students</v-card-title> 119 <v-card-title primary-title class="titleCard white--text py-3">Students</v-card-title>
110 <img src="/static/icon/student.png" class="ml-2" width="40" alt="icons" /> 120 <img src="/static/icon/student.png" class="ml-2" width="40" alt="icons" />
111 <v-card-title class="headline py-1 white--text">{{ students.length }}</v-card-title> 121 <v-card-title class="headline py-1 white--text">{{ students.length }}</v-card-title>
112 </v-card> 122 </v-card>
113 </router-link> 123 </router-link>
114 </v-flex> 124 </v-flex>
115 <!-- ***** Total Teachers***** --> 125 <!-- ***** Total Teachers***** -->
116 <v-flex xs12 sm12 md3> 126 <v-flex xs12 sm12 md3>
117 <router-link :to="{ name:'Teachers' }"> 127 <router-link :to="{ name:'Teachers' }">
118 <v-card flat class="card elevation-2 firozi-bgcolor"> 128 <v-card flat class="card elevation-2 firozi-bgcolor">
119 <v-card-title primary-title class="titleCard white--text py-3">Teachers</v-card-title> 129 <v-card-title primary-title class="titleCard white--text py-3">Teachers</v-card-title>
120 <img src="/static/icon/teacher.png" class="ml-2" width="40" alt="icons" /> 130 <img src="/static/icon/teacher.png" class="ml-2" width="40" alt="icons" />
121 131
122 <v-card-title class="headline py-1 white--text">{{ teachers.length }}</v-card-title> 132 <v-card-title class="headline py-1 white--text">{{ teachers.length }}</v-card-title>
123 </v-card> 133 </v-card>
124 </router-link> 134 </router-link>
125 </v-flex> 135 </v-flex>
126 <!-- ***** Total Parents ***** --> 136 <!-- ***** Total Parents ***** -->
127 <v-flex xs12 sm12 md3> 137 <v-flex xs12 sm12 md3>
128 <router-link :to="{ name:'Parents' }"> 138 <router-link :to="{ name:'Parents' }">
129 <v-card flat class="card yellow darken-3"> 139 <v-card flat class="card yellow darken-3">
130 <v-card-title primary-title class="titleCard white--text py-3">Parents</v-card-title> 140 <v-card-title primary-title class="titleCard white--text py-3">Parents</v-card-title>
131 <img src="/static/icon/parents.png" class="ml-3" width="40px" alt="icons" /> 141 <img src="/static/icon/parents.png" class="ml-3" width="40px" alt="icons" />
132 <v-card-title class="headline py-1 white--text">{{ parents.length }}</v-card-title> 142 <v-card-title class="headline py-1 white--text">{{ parents.length }}</v-card-title>
133 </v-card> 143 </v-card>
134 </router-link> 144 </router-link>
135 </v-flex> 145 </v-flex>
136 <!-- ***** Total Class***** --> 146 <!-- ***** Total Class***** -->
137 <v-flex xs12 sm12 md3> 147 <v-flex xs12 sm12 md3>
138 <router-link :to="{ name:'Class' }"> 148 <router-link :to="{ name:'Class' }">
139 <v-card flat class="card darkBlue-bgcolor"> 149 <v-card flat class="card darkBlue-bgcolor">
140 <v-card-title primary-title class="titleCard white--text py-3">Class</v-card-title> 150 <v-card-title primary-title class="titleCard white--text py-3">Class</v-card-title>
141 <img src="/static/icon/class.png" width="40" alt="icons" class="ml-2" /> 151 <img src="/static/icon/class.png" width="40" alt="icons" class="ml-2" />
142 <v-card-title class="headline py-1 white--text">{{ classes.length }}</v-card-title> 152 <v-card-title class="headline py-1 white--text">{{ classes.length }}</v-card-title>
143 </v-card> 153 </v-card>
144 </router-link> 154 </router-link>
145 </v-flex> 155 </v-flex>
146 </v-layout> 156 </v-layout>
147 157
148 <p 158 <p
149 v-if="studentsData.length === 0 && role == 'PARENT'" 159 v-if="studentsData.length === 0 && role == 'PARENT'"
150 class="text-center title grey lighten-4 error--text" 160 class="text-center title grey lighten-4 error--text"
151 >You have no student registered with school</p> 161 >You have no student registered with school</p>
152 <!-- ACCOUNT --> 162 <!-- ACCOUNT -->
153 <v-layout v-if="role == 'SUPERADMIN'|| role == 'ADMIN'"> 163 <v-layout v-if="role == 'SUPERADMIN'|| role == 'ADMIN'">
154 <v-flex xs12> 164 <v-flex xs12>
155 <v-card class="card mt-2 account-Card"> 165 <v-card class="card mt-2 account-Card">
156 <h4> 166 <h4>
157 <b>Account</b> 167 <b>Account</b>
158 </h4> 168 </h4>
159 <v-layout wrap> 169 <v-layout wrap>
160 <v-flex xs12 sm12 md3> 170 <v-flex xs12 sm12 md3>
161 <v-list two-line> 171 <v-list two-line>
162 <template> 172 <template>
163 <v-list-tile> 173 <v-list-tile>
164 <v-list-tile-avatar> 174 <v-list-tile-avatar>
165 <v-icon class="account-circle darkBlue-color">panorama_fish_eye</v-icon> 175 <v-icon class="account-circle darkBlue-color">panorama_fish_eye</v-icon>
166 </v-list-tile-avatar> 176 </v-list-tile-avatar>
167 <v-list-tile-content> 177 <v-list-tile-content>
168 <v-list-tile-title class="mt-2"> 178 <v-list-tile-title class="mt-2">
169 <p class="subheading font-color">Fees</p> 179 <p class="subheading font-color">Fees</p>
170 </v-list-tile-title> 180 </v-list-tile-title>
171 <v-list-tile-title>Rs. {{ feeData.totalFees }}</v-list-tile-title> 181 <v-list-tile-title>Rs. {{ feeData.totalFees }}</v-list-tile-title>
172 </v-list-tile-content> 182 </v-list-tile-content>
173 </v-list-tile> 183 </v-list-tile>
174 <v-list-tile> 184 <v-list-tile>
175 <v-list-tile-avatar> 185 <v-list-tile-avatar>
176 <v-icon class="account-circle yellowDark-color">panorama_fish_eye</v-icon> 186 <v-icon class="account-circle yellowDark-color">panorama_fish_eye</v-icon>
177 </v-list-tile-avatar> 187 </v-list-tile-avatar>
178 <v-list-tile-content> 188 <v-list-tile-content>
179 <v-list-tile-title class="mt-2"> 189 <v-list-tile-title class="mt-2">
180 <p class="subheading font-color">Collection</p> 190 <p class="subheading font-color">Collection</p>
181 </v-list-tile-title> 191 </v-list-tile-title>
182 <v-list-tile-title>Rs. {{ feeData.totalCollection }}</v-list-tile-title> 192 <v-list-tile-title>Rs. {{ feeData.totalCollection }}</v-list-tile-title>
183 </v-list-tile-content> 193 </v-list-tile-content>
184 </v-list-tile> 194 </v-list-tile>
185 <v-list-tile> 195 <v-list-tile>
186 <v-list-tile-avatar> 196 <v-list-tile-avatar>
187 <v-icon class="account-circle pink-color">panorama_fish_eye</v-icon> 197 <v-icon class="account-circle pink-color">panorama_fish_eye</v-icon>
188 </v-list-tile-avatar> 198 </v-list-tile-avatar>
189 <v-list-tile-content> 199 <v-list-tile-content>
190 <v-list-tile-title class="mt-2"> 200 <v-list-tile-title class="mt-2">
191 <p class="subheading font-color">Expences</p> 201 <p class="subheading font-color">Expences</p>
192 </v-list-tile-title> 202 </v-list-tile-title>
193 <v-list-tile-title>Rs. {{ expenseData.sum }}</v-list-tile-title> 203 <v-list-tile-title>Rs. {{ expenseData.sum }}</v-list-tile-title>
194 </v-list-tile-content> 204 </v-list-tile-content>
195 </v-list-tile> 205 </v-list-tile>
196 </template> 206 </template>
197 </v-list> 207 </v-list>
198 </v-flex> 208 </v-flex>
199 <v-flex xs12 sm12 md9 lg9> 209 <v-flex xs12 sm12 md9 lg9>
200 <div id="chart"> 210 <div id="chart">
201 <div v-if="this.series"> 211 <div v-if="this.series">
202 <apexchart 212 <apexchart
203 type="bar" 213 type="bar"
204 height="250" 214 height="250"
205 style="max-width: 800px !important" 215 style="max-width: 800px !important"
206 :options="chartOptions" 216 :options="chartOptions"
207 :series="series" 217 :series="series"
208 v-show="true" 218 v-show="true"
209 ></apexchart> 219 ></apexchart>
210 </div> 220 </div>
211 </div> 221 </div>
212 </v-flex> 222 </v-flex>
213 </v-layout> 223 </v-layout>
214 </v-card> 224 </v-card>
215 </v-flex> 225 </v-flex>
216 </v-layout> 226 </v-layout>
217 227
218 <v-card class="mt-2 card" v-if="role != 'PARENT'"> 228 <!-- FOR ADMIN ROLE -->
229 <v-card class="mt-2 card" v-if="role == 'ADMIN'">
219 <!-- <full-calendar 230 <!-- <full-calendar
220 ref="calendar" 231 ref="calendar"
221 defaultView="month" 232 defaultView="month"
222 droppable="false" 233 droppable="false"
223 :events="events" 234 :events="events"
224 :config="config" 235 :config="config"
225 ></full-calendar>--> 236 ></full-calendar>-->
226 <h4 class="pa-3"> 237 <h4 class="pa-3">
227 <b>Notice</b> 238 <b>Notice</b>
228 </h4> 239 </h4>
229 240
230 <v-data-table 241 <v-data-table
231 :items="noticeData" 242 :items="noticeData"
232 class="elevation-0" 243 class="elevation-0"
233 flat 244 flat
234 hide-actions 245 hide-actions
235 hide-headers 246 hide-headers
236 style="border-spacing: 0 !important;" 247 style="border-spacing: 0 !important;"
237 > 248 >
238 <template 249 <template
239 slot="items" 250 slot="items"
240 slot-scope="props" 251 slot-scope="props"
241 v-if="props.index < 5" 252 v-if="props.index < 5"
242 style="border-spacing: 0 !important;" 253 style="border-spacing: 0 !important;"
243 > 254 >
244 <tr class="td-notice"> 255 <tr class="td-notice">
245 <td class="grey--text" style="width:18px">{{ props.index + 1}}</td> 256 <td class="grey--text" style="width:18px">{{ props.index + 1}}</td>
246 <td> 257 <td>
247 <span class="grey--text caption">{{ date(props.item.created) }}</span> 258 <span class="grey--text caption">{{ date(props.item.created) }}</span>
248 <br /> 259 <br />
249 <span class="body-2">{{ props.item.title}}</span> 260 <span class="body-2">{{ props.item.title}}</span>
250 </td> 261 </td>
251 <td class="noticeDecritpion grey--text mt-2">{{ props.item.description}}</td> 262 <td class="noticeDecritpion grey--text mt-2">{{ props.item.description}}</td>
252 263
253 <td class="text-xs-center"> 264 <td class="text-xs-center">
254 <span> 265 <span>
255 <v-tooltip top> 266 <v-tooltip top>
256 <img 267 <img
257 slot="activator" 268 slot="activator"
258 style="cursor:pointer; width:25px; height:25px; " 269 style="cursor:pointer; width:25px; height:25px; "
259 @click="profile" 270 @click="profile"
260 src="/static/icon/view.png" 271 src="/static/icon/view.png"
261 /> 272 />
262 <span>View</span> 273 <span>View</span>
263 </v-tooltip> 274 </v-tooltip>
264 </span> 275 </span>
265 </td> 276 </td>
266 </tr> 277 </tr>
267 </template> 278 </template>
268 </v-data-table> 279 </v-data-table>
269 </v-card> 280 </v-card>
281
282 <!-- FOR TEACHER ROLE -->
283 <v-card class="mt-2 card" v-if="role == 'TEACHER'">
284 <v-layout>
285 <v-flex xs6 sm6 md6>
286 <h4 class="pa-3">
287 <b>Notice</b>
288 </h4>
289 <v-data-table
290 :items="noticeData"
291 class="elevation-0"
292 flat
293 hide-actions
294 hide-headers
295 style="border-spacing: 0 !important;"
296 >
297 <template
298 slot="items"
299 slot-scope="props"
300 v-if="props.index < 5"
301 style="border-spacing: 0 !important;"
302 >
303 <tr class="td-notice">
304 <td class="grey--text" style="width:18px">{{ props.index + 1}}</td>
305 <td>
306 <span class="grey--text caption">{{ date(props.item.created) }}</span>
307 <br />
308 <span class="body-2">{{ props.item.title}}</span>
309 </td>
310 <td class="noticeDecritpion grey--text mt-2">{{ props.item.description}}</td>
311
312 <td class="text-xs-center">
313 <span>
314 <v-tooltip top>
315 <img
316 slot="activator"
317 style="cursor:pointer; width:25px; height:25px; "
318 @click="profile"
319 src="/static/icon/view.png"
320 />
321 <span>View</span>
322 </v-tooltip>
323 </span>
324 </td>
325 </tr>
326 </template>
327 </v-data-table>
328 </v-flex>
329
330 <v-flex xs6 sm6 md6>
331 <v-card-text>
332 <v-card-title class="justify-center subheading font-weight-bold">Latest Events</v-card-title>
333 <div
334 v-for="(activity,index) in activityList"
335 :key="index"
336 class="mt-2"
337 style="cursor: pointer;"
338 @click="seeEventDetails(activity)"
339 >
340 <span
341 :style="{ 'background-color': colorsArray[index%colorsArray.length] }"
342 style="height: 12px;width: 12px;border-radius: 50%;display: inline-block;vertical-align: top;"
343 ></span>
344 <div style="display: inline-block;" class="ml-2">
345 <div>
346 <div
347 class="grey--text lighten-1 caption"
348 v-if="activity.dateOfEvent"
349 >{{moment(activity.dateOfEvent).format("DD MMMM, YYYY")}}</div>
350 <div class="body-2" v-if="activity.title">{{activity.title}}</div>
351 </div>
352 </div>
353 </div>
354 <div v-if="activityList.length == 0">
355 <p class="text-center title grey lighten-4 error--text">No Data Found!</p>
356 </div>
357 </v-card-text>
358 </v-flex>
359 </v-layout>
360 </v-card>
361
270 <!-- COURSES --> 362 <!-- COURSES -->
271 <v-layout v-if="role == 'PARENT'"> 363 <v-layout v-if="role == 'PARENT'">
272 <v-flex xs12> 364 <v-flex xs12>
273 <v-card class="card mt-2 account-Card"> 365 <v-card class="card mt-2 account-Card">
274 <h4> 366 <h4>
275 <b>My Courses</b> 367 <b>My Courses</b>
276 </h4> 368 </h4>
277 <v-layout wrap> 369 <v-layout wrap>
278 <v-flex xs12 sm12> 370 <v-flex xs12 sm12>
279 <v-list two-line> 371 <v-list two-line>
280 <template> 372 <template>
281 <v-list-tile v-for="(course,i) in courseData" :key="i"> 373 <v-list-tile v-for="(course,i) in courseData" :key="i">
282 <v-list-tile-avatar> 374 <v-list-tile-avatar>
283 <v-icon 375 <v-icon
284 class="account-circle darkBlue-color" 376 class="account-circle darkBlue-color"
285 style="cursor: pointer;" 377 style="cursor: pointer;"
286 >panorama_fish_eye</v-icon> 378 >panorama_fish_eye</v-icon>
287 </v-list-tile-avatar> 379 </v-list-tile-avatar>
288 <v-list-tile-content> 380 <v-list-tile-content>
289 <v-list-tile-title 381 <v-list-tile-title
290 style="cursor: pointer;" 382 style="cursor: pointer;"
291 @click="routeToCourseDetails(course._id)" 383 @click="routeToCourseDetails(course._id)"
292 >{{ course.courseName }}</v-list-tile-title> 384 >{{ course.courseName }}</v-list-tile-title>
293 </v-list-tile-content> 385 </v-list-tile-content>
294 </v-list-tile> 386 </v-list-tile>
295 </template> 387 </template>
296 </v-list> 388 </v-list>
297 </v-flex> 389 </v-flex>
298 </v-layout> 390 </v-layout>
299 </v-card> 391 </v-card>
300 </v-flex> 392 </v-flex>
301 </v-layout> 393 </v-layout>
302 <v-layout v-if="role == 'PARENT'"> 394 <v-layout v-if="role == 'PARENT'">
303 <v-flex xs6> 395 <v-flex xs6>
304 <v-card class="mt-2 card"> 396 <v-card class="mt-2 card">
305 <h4 class="pa-3"> 397 <h4 class="pa-3">
306 <b>Latest Annoucements</b> 398 <b>Latest Annoucements</b>
307 </h4> 399 </h4>
308 400
309 <v-data-table 401 <v-data-table
310 :items="annoucementData" 402 :items="annoucementData"
311 class="elevation-0" 403 class="elevation-0"
312 flat 404 flat
313 hide-actions 405 hide-actions
314 hide-headers 406 hide-headers
315 style="border-spacing: 0 !important;" 407 style="border-spacing: 0 !important;"
316 > 408 >
317 <template 409 <template
318 slot="items" 410 slot="items"
319 slot-scope="props" 411 slot-scope="props"
320 v-if="props.index < 5" 412 v-if="props.index < 5"
321 style="border-spacing: 0 !important;" 413 style="border-spacing: 0 !important;"
322 > 414 >
323 <tr class="td-notice"> 415 <tr class="td-notice">
324 <td class="grey--text" style="width:18px">{{ props.index + 1}}</td> 416 <td class="grey--text" style="width:18px">{{ props.index + 1}}</td>
325 <td> 417 <td>
326 <span class="grey--text caption">{{ date(props.item.created) }}</span> 418 <span class="grey--text caption">{{ date(props.item.created) }}</span>
327 <br /> 419 <br />
328 <span class="body-2">{{ props.item.discussionType}}</span> 420 <span class="body-2">{{ props.item.discussionType}}</span>
329 </td> 421 </td>
330 <td class="text-xs-center"> 422 <td class="text-xs-center">
331 <span> 423 <span>
332 <v-tooltip top> 424 <v-tooltip top>
333 <img 425 <img
334 slot="activator" 426 slot="activator"
335 style="cursor:pointer; width:25px; height:25px; " 427 style="cursor:pointer; width:25px; height:25px; "
336 src="/static/icon/view.png" 428 src="/static/icon/view.png"
337 /> 429 />
338 <span>View</span> 430 <span>View</span>
339 </v-tooltip> 431 </v-tooltip>
340 </span> 432 </span>
341 </td> 433 </td>
342 </tr> 434 </tr>
343 </template> 435 </template>
344 </v-data-table> 436 </v-data-table>
345 </v-card> 437 </v-card>
346 </v-flex> 438 </v-flex>
347 <v-flex xs6> 439 <v-flex xs6>
348 <v-card class="mt-2 card"> 440 <v-card class="mt-2 card">
349 <h4 class="pa-3"> 441 <h4 class="pa-3">
350 <b>Online User</b> 442 <b>Online User</b>
351 </h4> 443 </h4>
352 444
353 <v-data-table 445 <v-data-table
354 :items="onlineUser" 446 :items="onlineUser"
355 class="elevation-0" 447 class="elevation-0"
356 flat 448 flat
357 hide-actions 449 hide-actions
358 hide-headers 450 hide-headers
359 style="border-spacing: 0 !important;" 451 style="border-spacing: 0 !important;"
360 > 452 >
361 <template 453 <template
362 slot="items" 454 slot="items"
363 slot-scope="props" 455 slot-scope="props"
364 v-if="props.index < 5" 456 v-if="props.index < 5"
365 style="border-spacing: 0 !important;" 457 style="border-spacing: 0 !important;"
366 > 458 >
367 <tr class="td-notice"> 459 <tr class="td-notice">
368 <td class="grey--text" style="width:18px">{{ props.index + 1}}</td> 460 <td class="grey--text" style="width:18px">{{ props.index + 1}}</td>
369 <td> 461 <td>
370 <span class="body-2">{{ props.item.user }}</span> 462 <span class="body-2">{{ props.item.user }}</span>
371 </td> 463 </td>
372 <td class="text-xs-center"> 464 <td class="text-xs-center">
373 <span> 465 <span>
374 <v-tooltip top> 466 <v-tooltip top>
375 <img 467 <img
376 slot="activator" 468 slot="activator"
377 style="cursor:pointer; width:25px; height:25px; " 469 style="cursor:pointer; width:25px; height:25px; "
378 src="/static/icon/view.png" 470 src="/static/icon/view.png"
379 /> 471 />
380 <span>View</span> 472 <span>View</span>
381 </v-tooltip> 473 </v-tooltip>
382 </span> 474 </span>
383 </td> 475 </td>
384 </tr> 476 </tr>
385 </template> 477 </template>
386 </v-data-table> 478 </v-data-table>
387 </v-card> 479 </v-card>
388 </v-flex> 480 </v-flex>
389 </v-layout> 481 </v-layout>
390 </v-container> 482 </v-container>
391 </v-flex> 483 </v-flex>
392 <v-spacer></v-spacer> 484 <v-spacer></v-spacer>
393 <!-- SIDE BAR --> 485 <!-- SIDE BAR -->
394 <v-flex xs12 sm12 md3> 486 <v-flex xs12 sm12 md3>
395 <v-card height="100%" class="elevation-0 mt-3 profileDasboard"> 487 <v-card height="100%" class="elevation-0 mt-3 profileDasboard">
396 <v-card-text class="px-2"> 488 <v-card-text class="px-2">
397 <h4 class="text-xs-center py-3"> 489 <h4 class="text-xs-center py-3">
398 <b>Profile</b> 490 <b>Profile</b>
399 </h4> 491 </h4>
400 <v-flex xs12 class="py-3"> 492 <v-flex xs12 class="py-3">
401 <v-layout wrap> 493 <v-layout wrap>
402 <v-flex xs12 sm12 md4> 494 <v-flex xs12 sm12 md4>
403 <img src="/static/icon/user.png" v-if="!userData.schoolLogoUrl" width="80" /> 495 <img src="/static/icon/user.png" v-if="!userData.profilePicUrl && !userData.schoolLogoUrl" width="80" />
404 <img :src="userData.schoolLogoUrl" v-else-if="userData.schoolLogoUrl" width="80" /> 496 <img :src="userData.profilePicUrl" onerror="this.src='/static/icon/user.png';" v-if="userData.profilePicUrl" width="80" />
497 <img :src="userData.schoolLogoUrl" onerror="this.src='/static/icon/user.png';" v-if="userData.schoolLogoUrl" width="80" />
405 </v-flex> 498 </v-flex>
406 <v-flex xs12 sm12 md6> 499 <v-flex xs12 sm12 md6>
407 <p class="mb-0 body-1"> 500 <p class="mb-0 body-1">
408 <i>{{ userData.name }}</i> 501 <i>{{ userData.name }}</i>
409 </p> 502 </p>
410 <p class="mb-0 caption grey--text">{{ userData.email }}</p> 503 <p class="mb-0 caption grey--text">{{ userData.email }}</p>
411 <p class="mb-0 caption grey--text">{{ userData.mobile }}</p> 504 <p class="mb-0 caption grey--text">{{ userData.mobile }}</p>
412 <address class="caption grey--text mb-3">{{ userData.address }}</address> 505 <address class="caption grey--text mb-3">{{ userData.address }}</address>
413 </v-flex> 506 </v-flex>
414 </v-layout> 507 </v-layout>
415 </v-flex> 508 </v-flex>
416 <hr /> 509 <hr />
417 <div class="text-xs-center py-3 subheading font-weight-bold">Calender</div> 510 <div class="text-xs-center py-3 subheading font-weight-bold">Calender</div>
418 511
419 <vue-event-calendar :events="activityEvents" @day-changed="handleDayChanged($event)"></vue-event-calendar> 512 <vue-event-calendar :events="activityEvents" @day-changed="handleDayChanged($event)"></vue-event-calendar>
420 513
421 <!-- LATEST EVENTS --> 514 <!-- LATEST EVENTS -->
422 <v-card class="my-3 elevation-0"> 515 <v-card class="my-3 elevation-0" v-if="role != 'TEACHER'">
423 <v-card-text> 516 <v-card-text>
424 <v-card-title class="justify-center subheading font-weight-bold">Latest Events</v-card-title> 517 <v-card-title class="justify-center subheading font-weight-bold">Latest Events</v-card-title>
425 <div 518 <div
426 v-for="(activity,index) in activityList" 519 v-for="(activity,index) in activityList"
427 :key="index" 520 :key="index"
428 class="mt-2" 521 class="mt-2"
429 style="cursor: pointer;" 522 style="cursor: pointer;"
430 @click="seeEventDetails(activity)" 523 @click="seeEventDetails(activity)"
431 > 524 >
432 <span 525 <span
433 :style="{ 'background-color': colorsArray[index%colorsArray.length] }" 526 :style="{ 'background-color': colorsArray[index%colorsArray.length] }"
434 style="height: 12px;width: 12px;border-radius: 50%;display: inline-block;vertical-align: top;" 527 style="height: 12px;width: 12px;border-radius: 50%;display: inline-block;vertical-align: top;"
435 ></span> 528 ></span>
436 <div style="display: inline-block;" class="ml-2"> 529 <div style="display: inline-block;" class="ml-2">
437 <!-- LATEST EVENTS FOR PARENT --> 530 <!-- LATEST EVENTS FOR PARENT -->
438 <div v-if="$store.state.role === 'PARENT' "> 531 <div v-if="$store.state.role === 'PARENT' ">
439 <div 532 <div
440 class="grey--text lighten-1 caption" 533 class="grey--text lighten-1 caption"
441 v-if="activity.meetingEvent" 534 v-if="activity.meetingEvent"
442 >{{moment(activity.meetingEvent.dateOfEvent).format("DD MMMM, YYYY")}}</div> 535 >{{moment(activity.meetingEvent.dateOfEvent).format("DD MMMM, YYYY")}}</div>
443 <div 536 <div
444 class="body-2" 537 class="body-2"
445 v-if="activity.meetingEvent" 538 v-if="activity.meetingEvent"
446 >{{activity.meetingEvent.title}}</div> 539 >{{activity.meetingEvent.title}}</div>
447 </div> 540 </div>
448 541
449 <!-- LATEST EVENTS FOR TEACHER --> 542 <!-- LATEST EVENTS FOR TEACHER -->
450 <div v-if="role == 'TEACHER'"> 543 <div v-if="role == 'TEACHER'">
451 <div 544 <div
452 class="grey--text lighten-1 caption" 545 class="grey--text lighten-1 caption"
453 v-if="activity.dateOfEvent" 546 v-if="activity.dateOfEvent"
454 >{{moment(activity.dateOfEvent).format("DD MMMM, YYYY")}}</div> 547 >{{moment(activity.dateOfEvent).format("DD MMMM, YYYY")}}</div>
455 <div class="body-2" v-if="activity.title">{{activity.title}}</div> 548 <div class="body-2" v-if="activity.title">{{activity.title}}</div>
456 </div> 549 </div>
457 </div> 550 </div>
458 </div> 551 </div>
459 <div v-if="activityList.length == 0"> 552 <div v-if="activityList.length == 0">
460 <p class="text-center title grey lighten-4 error--text">No Data Found!</p> 553 <p class="text-center title grey lighten-4 error--text">No Data Found!</p>
461 </div> 554 </div>
462 </v-card-text> 555 </v-card-text>
463 </v-card> 556 </v-card>
464 </v-card-text> 557 </v-card-text>
465 </v-card> 558 </v-card>
466 </v-flex> 559 </v-flex>
467 </v-layout> 560 </v-layout>
468 561
469 <v-dialog v-model="dialog" max-width="500"> 562 <v-dialog v-model="dialog" max-width="500">
470 <v-card color="grey lighten-4" flat> 563 <v-card color="grey lighten-4" flat>
471 <v-toolbar dark color="fixcolors"> 564 <v-toolbar dark color="fixcolors">
472 <v-spacer></v-spacer> 565 <v-spacer></v-spacer>
473 <v-btn icon @click="dialog= false"> 566 <v-btn icon @click="dialog= false">
474 <v-icon>close</v-icon> 567 <v-icon>close</v-icon>
475 </v-btn> 568 </v-btn>
476 </v-toolbar> 569 </v-toolbar>
477 <v-flex class="py-4"> 570 <v-flex class="py-4">
478 <v-list-tile> 571 <v-list-tile>
479 <v-list-tile-action> 572 <v-list-tile-action>
480 <v-icon>edit</v-icon> 573 <v-icon>edit</v-icon>
481 </v-list-tile-action> 574 </v-list-tile-action>
482 <v-list-tile-content> 575 <v-list-tile-content>
483 <v-list-tile-title>{{ selected.title }}</v-list-tile-title> 576 <v-list-tile-title>{{ selected.title }}</v-list-tile-title>
484 </v-list-tile-content> 577 </v-list-tile-content>
485 </v-list-tile> 578 </v-list-tile>
486 <v-list-tile> 579 <v-list-tile>
487 <v-list-tile-action> 580 <v-list-tile-action>
488 <v-icon>access_time</v-icon> 581 <v-icon>access_time</v-icon>
489 </v-list-tile-action> 582 </v-list-tile-action>
490 <v-list-tile-content> 583 <v-list-tile-content>
491 <v-list-tile-title>{{ date(selected.start)}}</v-list-tile-title> 584 <v-list-tile-title>{{ date(selected.start)}}</v-list-tile-title>
492 </v-list-tile-content> 585 </v-list-tile-content>
493 </v-list-tile> 586 </v-list-tile>
494 </v-flex> 587 </v-flex>
495 </v-card> 588 </v-card>
496 </v-dialog> 589 </v-dialog>
497 </v-app> 590 </v-app>
498 </template> 591 </template>
499 592
500 <script> 593 <script>
501 import http from "@/Services/http.js"; 594 import http from "@/Services/http.js";
502 import moment from "moment"; 595 import moment from "moment";
503 import AllApiCalls from "@/Services/AllApiCalls.js"; 596 import AllApiCalls from "@/Services/AllApiCalls.js";
504 // import { FunctionalCalendar } from "vue-functional-calendar"; 597 // import { FunctionalCalendar } from "vue-functional-calendar";
505 598
506 export default { 599 export default {
507 components: { 600 components: {
508 // FunctionalCalendar 601 // FunctionalCalendar
509 }, 602 },
510 mixins: [AllApiCalls], 603 mixins: [AllApiCalls],
511 data() { 604 data() {
512 return { 605 return {
513 // data: { 606 // data: {
514 // clieckedToday: false 607 // clieckedToday: false
515 // }, 608 // },
516 // markedDates: ["16/4/2019", "18/4/2019", "20/4/2019", "21/4/2019"], 609 // markedDates: ["16/4/2019", "18/4/2019", "20/4/2019", "21/4/2019"],
517 // calendarData: {}, 610 // calendarData: {},
518 // calendar: {}, 611 // calendar: {},
519 612
520 // DIALOG BOX EVENT DETAILS 613 // DIALOG BOX EVENT DETAILS
521 viewEventDetails: false, 614 viewEventDetails: false,
522 615
523 // CALENDER 616 // CALENDER
524 moment: moment, 617 moment: moment,
525 activityEvents: [], 618 activityEvents: [],
526 onlineUser: [ 619 onlineUser: [
527 { 620 {
528 user: "Student Demo" 621 user: "Student Demo"
529 }, 622 },
530 { 623 {
531 user: "Teacher Demo" 624 user: "Teacher Demo"
532 }, 625 },
533 { 626 {
534 user: "Priyansh Gupta" 627 user: "Priyansh Gupta"
535 }, 628 },
536 { 629 {
537 user: "Gaurav Aggarwal" 630 user: "Gaurav Aggarwal"
538 }, 631 },
539 { 632 {
540 user: "Approve Arorra" 633 user: "Approve Arorra"
541 } 634 }
542 ], 635 ],
543 showLoader: false, 636 showLoader: false,
544 calendarData: {}, 637 calendarData: {},
545 dialog: false, 638 dialog: false,
546 dialogNotice: false, 639 dialogNotice: false,
547 HolidaysList: [], 640 HolidaysList: [],
548 EventsList: [], 641 EventsList: [],
549 events: [], 642 events: [],
550 config: { 643 config: {
551 eventClick: event => { 644 eventClick: event => {
552 this.selected = event; 645 this.selected = event;
553 this.dialog = true; 646 this.dialog = true;
554 } 647 }
555 }, 648 },
556 selected: {}, 649 selected: {},
557 barGraph: [], 650 barGraph: [],
558 // notice: {}, 651 // notice: {},
559 userData: {}, 652 userData: {},
560 dated: new Date(2018, 0, 9), 653 dated: new Date(2018, 0, 9),
561 userList: [], 654 userList: [],
562 sectionList: [], 655 sectionList: [],
563 students: "", 656 students: "",
564 parents: "", 657 parents: "",
565 teachers: "", 658 teachers: "",
566 classes: "", 659 classes: "",
567 noticeData: [], 660 noticeData: [],
568 expenseData: [], 661 expenseData: [],
569 feeData: [], 662 feeData: [],
570 collectionData: [], 663 collectionData: [],
571 courseData: [], 664 courseData: [],
572 studentsData: [], 665 studentsData: [],
573 annoucementData: [], 666 annoucementData: [],
574 role: "", 667 role: "",
575 attrs: [ 668 attrs: [
576 { 669 {
577 key: "today", 670 key: "today",
578 highlight: true, 671 highlight: true,
579 dates: new Date() 672 dates: new Date()
580 } 673 }
581 ], 674 ],
582 drawer: true, 675 drawer: true,
583 items: [ 676 items: [
584 { title: "Home", icon: "dashboard" }, 677 { title: "Home", icon: "dashboard" },
585 { title: "About", icon: "question_answer" } 678 { title: "About", icon: "question_answer" }
586 ], 679 ],
587 right: null, 680 right: null,
588 681
589 series: [ 682 series: [
590 { 683 {
591 name: "Total", 684 name: "Total",
592 data: [] 685 data: []
593 } 686 }
594 ], 687 ],
595 chartOptions: { 688 chartOptions: {
596 chart: { 689 chart: {
597 type: "bar", 690 type: "bar",
598 height: 150, 691 height: 150,
599 stacked: true 692 stacked: true
600 // animations: { 693 // animations: {
601 // enabled: true, 694 // enabled: true,
602 // easing: "easeinout", 695 // easing: "easeinout",
603 // speed: 1200, 696 // speed: 1200,
604 // animateGradually: { 697 // animateGradually: {
605 // enabled: true, 698 // enabled: true,
606 // delay: 450 699 // delay: 450
607 // }, 700 // },
608 // dynamicAnimation: { 701 // dynamicAnimation: {
609 // enabled: true, 702 // enabled: true,
610 // speed: 450 703 // speed: 450
611 // } 704 // }
612 // } 705 // }
613 }, 706 },
614 plotOptions: { 707 plotOptions: {
615 bar: { 708 bar: {
616 horizontal: false, 709 horizontal: false,
617 columnWidth: "25%", 710 columnWidth: "25%",
618 // endingShape: "rounded", 711 // endingShape: "rounded",
619 distributed: true 712 distributed: true
620 } 713 }
621 }, 714 },
622 responsive: [ 715 responsive: [
623 { 716 {
624 breakpoint: 480, 717 breakpoint: 480,
625 options: { 718 options: {
626 legend: { 719 legend: {
627 position: "bottom", 720 position: "bottom",
628 offsetX: -10, 721 offsetX: -10,
629 offsetY: 0 722 offsetY: 0
630 } 723 }
631 } 724 }
632 } 725 }
633 ], 726 ],
634 legend: { 727 legend: {
635 show: false 728 show: false
636 }, 729 },
637 colors: ["#7852cc", "#f9a825", "#ff8a89"], 730 colors: ["#7852cc", "#f9a825", "#ff8a89"],
638 dataLabels: { 731 dataLabels: {
639 enabled: false 732 enabled: false
640 }, 733 },
641 stroke: { 734 stroke: {
642 show: true, 735 show: true,
643 width: 2, 736 width: 2,
644 colors: ["transparent"] 737 colors: ["transparent"]
645 }, 738 },
646 xaxis: { 739 xaxis: {
647 categories: ["Fee", "Collections", "Expences"] 740 categories: ["Fee", "Collections", "Expences"]
648 }, 741 },
649 yaxis: { 742 yaxis: {
650 title: { 743 title: {
651 text: "" 744 text: ""
652 } 745 }
653 }, 746 },
654 fill: { 747 fill: {
655 opacity: 1 748 opacity: 1
656 }, 749 },
657 tooltip: { 750 tooltip: {
658 y: { 751 y: {
659 formatter: function(val, opts) { 752 formatter: function(val, opts) {
660 // console.log("opts",opts.w.config.xaxis.categories)
661 return "" + val + " "; 753 return "" + val + " ";
662 } 754 }
663 } 755 }
664 } 756 }
665 }, 757 },
666 758
667 // LATEST ACTIVITY 759 // LATEST ACTIVITY
668 colorsArray: ["#ff8a89", "#71d9ea", "#7852cc", "#F9A825"], 760 colorsArray: ["#ff8a89", "#71d9ea", "#7852cc", "#F9A825"],
669 activityList: [] 761 activityList: []
670 }; 762 };
671 }, 763 },
672 methods: { 764 methods: {
673 test(e) { 765 test(e) {
674 console.log(" test - ", e); 766 console.log(" test - ", e);
675 }, 767 },
676 async handleDayChanged(e) { 768 async handleDayChanged(e) {
677 await this.getParticularMeetingEvent({ 769 await this.getParticularMeetingEvent({
678 meetingEventId: e.events[0]._id 770 meetingEventId: e.events[0]._id
679 }); 771 });
680 this.viewEventDetails = true; 772 this.viewEventDetails = true;
681 }, 773 },
682 async seeEventDetails(activity) { 774 async seeEventDetails(activity) {
683 if (this.$store.state.role === "TEACHER") { 775 if (this.$store.state.role === "TEACHER") {
684 await this.getParticularMeetingEvent({ meetingEventId: activity._id }); 776 await this.getParticularMeetingEvent({ meetingEventId: activity._id });
685 this.viewEventDetails = true; 777 this.viewEventDetails = true;
686 } 778 }
687 if (this.$store.state.role === "PARENT") { 779 if (this.$store.state.role === "PARENT") {
688 await this.getParticularMeetingEvent({ 780 await this.getParticularMeetingEvent({
689 meetingEventId: activity.meetingEvent._id 781 meetingEventId: activity.meetingEvent._id
690 }); 782 });
691 this.viewEventDetails = true; 783 this.viewEventDetails = true;
692 } 784 }
693 }, 785 },
694 async routeToCourseDetails(courseId) { 786 async routeToCourseDetails(courseId) {
695 /* getParticularCourseDetail- To get courseDetail - defined in GetApis.js*/ 787 /* getParticularCourseDetail- To get courseDetail - defined in GetApis.js*/
696 let response = await this.getParticularCourseDetail(courseId); 788 let response = await this.getParticularCourseDetail(courseId);
697 789
698 /* If the response is null then dont route */ 790 /* If the response is null then dont route */
699 if (response.data.data.length > 0) { 791 if (response.data.data.length > 0) {
700 this.$router.push({ 792 this.$router.push({
701 name: "Course Details", 793 name: "Course Details",
702 query: { courseId: courseId } 794 query: { courseId: courseId }
703 }); 795 });
704 } else { 796 } else {
705 this.seeSnackbar("No Data Available", "warning"); 797 this.seeSnackbar("No Data Available", "warning");
706 } 798 }
707 }, 799 },
708 800
709 closeNotice() { 801 closeNotice() {
710 this.dialogNotice = false; 802 this.dialogNotice = false;
711 }, 803 },
712 profile() { 804 profile() {
713 // this.editedIndex = this.desserts.indexOf(item); 805 // this.editedIndex = this.desserts.indexOf(item);
714 // this.notice = Object.assign({}, item); 806 // this.notice = Object.assign({}, item);
715 // this.dialogNotice = true; 807 // this.dialogNotice = true;
716 this.$router.push({ name: "NoticeBoard" }); 808 this.$router.push("/noticeBoard");
717 }, 809 },
718 date: function(date) { 810 date: function(date) {
719 return moment(date).format("MMMM DD, YYYY HH:mm"); 811 return moment(date).format("MMMM DD, YYYY HH:mm");
720 }, 812 },
721 activityDate(date) { 813 activityDate(date) {
722 return moment(date).format("MMMM DD, YYYY"); 814 return moment(date).format("MMMM DD, YYYY");
723 }, 815 },
724 refreshEvents() { 816 refreshEvents() {
725 this.$refs.calendar.$emit("refetch-events"); 817 this.$refs.calendar.$emit("refetch-events");
726 }, 818 },
727 removeEvent() { 819 removeEvent() {
728 this.$refs.calendar.$emit("remove-event", this.selected); 820 this.$refs.calendar.$emit("remove-event", this.selected);
729 this.selected = {}; 821 this.selected = {};
730 }, 822 },
731 eventSelected(event) { 823 eventSelected(event) {
732 this.selected = event; 824 this.selected = event;
733 console.log("this.selected", this.selected);
734 }, 825 },
735 // eventDropStart: function(event) { 826 // eventDropStart: function(event) {
736 // event.editable = false; 827 // event.editable = false;
737 // }, 828 // },
738 eventCreated(...test) { 829 eventCreated(...test) {
739 console.log(test); 830 console.log(test);
740 }, 831 },
741 getStudents() { 832 getStudents() {
742 http() 833 http()
743 .get("/getStudentsList", { 834 .get("/getStudentsList", {
744 headers: { 835 headers: {
745 Authorization: "Bearer " + this.token 836 Authorization: "Bearer " + this.token
746 } 837 }
747 }) 838 })
748 .then(response => { 839 .then(response => {
749 this.students = response.data.data; 840 this.students = response.data.data;
750 this.showLoader = false; 841 this.showLoader = false;
751 }) 842 })
752 .catch(error => { 843 .catch(error => {
753 // console.log("err====>", err); 844 // console.log("err====>", err);
754 this.showLoader = false; 845 this.showLoader = false;
755 if (error.response.status === 401) { 846 if (error.response.status === 401) {
756 this.$router.replace({ path: "/" }); 847 this.$router.replace({ path: "/" });
757 this.$store.dispatch("setToken", null); 848 this.$store.dispatch("setToken", null);
758 this.$store.dispatch("Id", null); 849 this.$store.dispatch("Id", null);
759 } 850 }
760 }); 851 });
761 }, 852 },
762 getParents() { 853 getParents() {
763 http() 854 http()
764 .get("/getParentsList", { 855 .get("/getParentsList", {
765 headers: { 856 headers: {
766 Authorization: "Bearer " + this.token 857 Authorization: "Bearer " + this.token
767 } 858 }
768 }) 859 })
769 .then(response => { 860 .then(response => {
770 this.parents = response.data.data; 861 this.parents = response.data.data;
771 this.showLoader = false; 862 this.showLoader = false;
772 }) 863 })
773 .catch(error => { 864 .catch(error => {
774 // console.log("err====>", err); 865 // console.log("err====>", err);
775 this.showLoader = false; 866 this.showLoader = false;
776 }); 867 });
777 }, 868 },
778 getTeachers() { 869 getTeachers() {
779 http() 870 http()
780 .get("/getTeachersList", { 871 .get("/getTeachersList", {
781 headers: { 872 headers: {
782 Authorization: "Bearer " + this.token 873 Authorization: "Bearer " + this.token
783 } 874 }
784 }) 875 })
785 .then(response => { 876 .then(response => {
786 this.teachers = response.data.data; 877 this.teachers = response.data.data;
787 this.showLoader = false; 878 this.showLoader = false;
788 }) 879 })
789 .catch(error => { 880 .catch(error => {
790 // console.log("err====>", err); 881 // console.log("err====>", err);
791 this.showLoader = false; 882 this.showLoader = false;
792 }); 883 });
793 }, 884 },
794 getClasses() { 885 getClasses() {
795 http() 886 http()
796 .get("/getClassesList", { 887 .get("/getClassesList", {
797 headers: { 888 headers: {
798 Authorization: "Bearer " + this.token 889 Authorization: "Bearer " + this.token
799 } 890 }
800 }) 891 })
801 .then(response => { 892 .then(response => {
802 this.classes = response.data.data; 893 this.classes = response.data.data;
803 this.showLoader = false; 894 this.showLoader = false;
804 }) 895 })
805 .catch(error => { 896 .catch(error => {
806 this.showLoader = false; 897 this.showLoader = false;
807 }); 898 });
808 }, 899 },
809 getNoticeData() { 900 getNoticeData() {
810 this.showLoader = true; 901 this.showLoader = true;
811 http() 902 http()
812 .get("/getEventsList", { 903 .get("/getEventsList", {
813 headers: { 904 headers: {
814 Authorization: "Bearer " + this.token 905 Authorization: "Bearer " + this.token
815 } 906 }
816 }) 907 })
817 .then(response => { 908 .then(response => {
818 this.noticeData = response.data.data; 909 this.noticeData = response.data.data;
819 this.showLoader = false; 910 this.showLoader = false;
820 }) 911 })
821 .catch(error => { 912 .catch(error => {
822 this.showLoader = false; 913 this.showLoader = false;
823 }); 914 });
824 }, 915 },
825 getUserData() { 916 getUserData() {
826 // this.showLoader = true; 917 // this.showLoader = true;
827 if (this.$store.state.role === "PARENT") { 918 if (this.$store.state.role === "PARENT") {
828 http() 919 http()
829 .get("/getParticularUserDetail", { 920 .get("/getParticularUserDetail", {
830 headers: { 921 headers: {
831 Authorization: "Bearer " + this.token 922 Authorization: "Bearer " + this.token
832 }, 923 },
833 params: { 924 params: {
834 studentId: localStorage.getItem("parentStudentId") 925 studentId: localStorage.getItem("parentStudentId")
835 } 926 }
836 }) 927 })
837 .then(response => { 928 .then(response => {
838 this.userData = response.data.data; 929 this.userData = response.data.data;
839 this.showLoader = false; 930 this.showLoader = false;
840 console.log("sdsdfsdfsd - ", response);
841 }) 931 })
842 .catch(error => { 932 .catch(error => {
843 this.showLoader = false; 933 this.showLoader = false;
844 }); 934 });
845 } else { 935 } else {
846 http() 936 http()
847 .get("/getParticularUserDetail", { 937 .get("/getParticularUserDetail", {
848 headers: { 938 headers: {
849 Authorization: "Bearer " + this.token 939 Authorization: "Bearer " + this.token
850 } 940 }
851 }) 941 })
852 .then(response => { 942 .then(response => {
853 this.userData = response.data.data; 943 this.userData = response.data.data;
854 this.showLoader = false; 944 this.showLoader = false;
855 }) 945 })
856 .catch(error => { 946 .catch(error => {
857 this.showLoader = false; 947 this.showLoader = false;
858 }); 948 });
859 } 949 }
860 }, 950 },
861 951
862 getFeesAndCollectionsData() { 952 getFeesAndCollectionsData() {
863 http() 953 http()
864 .get("/getTotalFeesAndCollections", { 954 .get("/getTotalFeesAndCollections", {
865 headers: { 955 headers: {
866 Authorization: "Bearer " + this.token 956 Authorization: "Bearer " + this.token
867 } 957 }
868 }) 958 })
869 .then(response => { 959 .then(response => {
870 this.feeData = response.data.data; 960 this.feeData = response.data.data;
871 // this.collectionData = response.data.data; 961 // this.collectionData = response.data.data;
872 this.series[0].data[0] = this.feeData.totalFees; 962 this.series[0].data[0] = this.feeData.totalFees;
873 this.series[0].data[1] = this.feeData.totalCollection; 963 this.series[0].data[1] = this.feeData.totalCollection;
874 // console.log("this.series====", this.series);
875 964
876 this.showLoader = false; 965 this.showLoader = false;
877 }) 966 })
878 .catch(error => { 967 .catch(error => {
879 this.showLoader = false; 968 this.showLoader = false;
880 }); 969 });
881 }, 970 },
882 getExpensesData() { 971 getExpensesData() {
883 http() 972 http()
884 .get("/getTotalExpenses", { 973 .get("/getTotalExpenses", {
885 headers: { 974 headers: {
886 Authorization: "Bearer " + this.token 975 Authorization: "Bearer " + this.token
887 } 976 }
888 }) 977 })
889 .then(response => { 978 .then(response => {
890 this.expenseData = response.data.data; 979 this.expenseData = response.data.data;
891 // var array = response.data.data.sum; 980 // var array = response.data.data.sum;
892 this.series[0].data[2] = this.expenseData.sum; 981 this.series[0].data[2] = this.expenseData.sum;
893 // this.series = [ 982 // this.series = [
894 // { 983 // {
895 // name: "Total", 984 // name: "Total",
896 // data: array 985 // data: array
897 // } 986 // }
898 // ]; 987 // ];
899 // console.log("this.series====", this.series);
900 this.showLoader = false; 988 this.showLoader = false;
901 }) 989 })
902 .catch(error => { 990 .catch(error => {
903 this.showLoader = false; 991 this.showLoader = false;
904 }); 992 });
905 }, 993 },
906 async getparentStudents() { 994 async getparentStudents() {
907 this.showLoader = true; 995 this.showLoader = true;
908 var parentStudentsId; 996 var parentStudentsId;
909 var classId; 997 var classId;
910 await http() 998 await http()
911 .get("/parentStudentsList") 999 .get("/parentStudentsList")
912 .then(response => { 1000 .then(response => {
913 // console.log("resssssss", response.data.data.students[0].classId);
914 this.studentsData = response.data.data; 1001 this.studentsData = response.data.data;
915 localStorage.setItem( 1002 localStorage.setItem(
916 "parentStudentId", 1003 "parentStudentId",
917 this.studentsData.students[0]._id 1004 this.studentsData.students[0]._id
918 ); 1005 );
919 localStorage.setItem( 1006 localStorage.setItem(
920 "parentClassId", 1007 "parentClassId",
921 this.studentsData.students[0].classId 1008 this.studentsData.students[0].classId
922 ); 1009 );
923 1010
924 if (localStorage.getItem("parentStudentId") == null) { 1011 if (localStorage.getItem("parentStudentId") == null) {
925 parentStudentsId = response.data.data.students[0].classId; 1012 parentStudentsId = response.data.data.students[0].classId;
926 classId = response.data.data.students[0]._id; 1013 classId = response.data.data.students[0]._id;
927 } 1014 }
928 if (localStorage.getItem("parentStudentId")) { 1015 if (localStorage.getItem("parentStudentId")) {
929 parentStudentsId = localStorage.getItem("parentStudentId"); 1016 parentStudentsId = localStorage.getItem("parentStudentId");
930 classId = localStorage.getItem("parentClassId"); 1017 classId = localStorage.getItem("parentClassId");
931 } 1018 }
932 1019
933 this.showLoader = false; 1020 this.showLoader = false;
934 }) 1021 })
935 .catch(err => { 1022 .catch(err => {
936 console.log("err====>", err); 1023 console.log("err====>", err);
937 this.showLoader = false; 1024 this.showLoader = false;
938 }); 1025 });
939 await this.getCourses(parentStudentsId, classId); 1026 await this.getCourses(parentStudentsId, classId);
940 await this.getAnnoucementes(classId); 1027 await this.getAnnoucementes(classId);
941 }, 1028 },
942 async getCourses(parentStudentsId, classId) { 1029 async getCourses(parentStudentsId, classId) {
943 /* getStudentCourses - to get courseData - defined in GetApis.js*/ 1030 /* getStudentCourses - to get courseData - defined in GetApis.js*/
944 await this.getStudentCourses({ 1031 await this.getStudentCourses({
945 classId: classId, 1032 classId: classId,
946 studentId: parentStudentsId 1033 studentId: parentStudentsId
947 }); 1034 });
948 }, 1035 },
949 getAnnoucementes(classId) { 1036 getAnnoucementes(classId) {
950 this.showLoader = true; 1037 this.showLoader = true;
951 http() 1038 http()
952 .get("/getAnnoucementesList", { 1039 .get("/getAnnoucementesList", {
953 params: { 1040 params: {
954 classId: classId 1041 classId: classId
955 } 1042 }
956 }) 1043 })
957 .then(response => { 1044 .then(response => {
958 this.annoucementData = response.data.data; 1045 this.annoucementData = response.data.data;
959 this.showLoader = false; 1046 this.showLoader = false;
960 }) 1047 })
961 .catch(err => { 1048 .catch(err => {
962 console.log("err====>", err); 1049 console.log("err====>", err);
963 this.showLoader = false; 1050 this.showLoader = false;
964 }); 1051 });
965 }, 1052 },
966 async getMeetingEventes() { 1053 async getMeetingEventes() {
967 if (this.role == "TEACHER") { 1054 if (this.role == "TEACHER") {
968 this.showLoader = true; 1055 this.showLoader = true;
969 await http() 1056 await http()
970 .get("/getMeetingEventesList", { 1057 .get("/getMeetingEventesList", {
971 headers: { 1058 headers: {
972 Authorization: "Bearer " + this.token 1059 Authorization: "Bearer " + this.token
973 } 1060 }
974 }) 1061 })
975 .then(response => { 1062 .then(response => {
976 var activityList = response.data.data; 1063 var activityList = response.data.data;
977 this.activityList = activityList; 1064 this.activityList = activityList;
978 this.showLoader = false; 1065 this.showLoader = false;
979 1066
980 /* set activityEvents array to highlight event dates in calender */ 1067 /* set activityEvents array to highlight event dates in calender */
981 for (var i = 0; i < this.activityList.length; i++) { 1068 for (var i = 0; i < this.activityList.length; i++) {
982 let obj = {}; 1069 let obj = {};
983 obj.date = moment(this.activityList[i].dateOfEvent).format( 1070 obj.date = moment(this.activityList[i].dateOfEvent).format(
984 "YYYY/MM/DD" 1071 "YYYY/MM/DD"
985 ); 1072 );
986 obj.title = this.activityList[i].title; 1073 obj.title = this.activityList[i].title;
987 obj._id = this.activityList[i]._id; 1074 obj._id = this.activityList[i]._id;
988 this.activityEvents.push(obj); 1075 this.activityEvents.push(obj);
989 } 1076 }
990 }) 1077 })
991 .catch(error => { 1078 .catch(error => {
992 this.showLoader = false; 1079 this.showLoader = false;
993 }); 1080 });
994 } 1081 }
995 } 1082 }
996 }, 1083 },
997 1084
998 mounted() { 1085 mounted() {
999 // = this.$store.state.schoolToken; 1086 // = this.$store.state.schoolToken;
1000 // console.log("this.$store.state.role", this.token); 1087 // console.log("this.$store.state.role", this.token);
1001 // this.getUsersList(); 1088 // this.getUsersList();
1002 }, 1089 },
1003 1090
1004 async created() { 1091 async created() {
1005 if (this.$store.state.role === "ADMIN") { 1092 if (this.$store.state.role === "ADMIN") {
1006 this.token = this.$store.state.token; 1093 this.token = this.$store.state.token;
1007 } else if (this.$store.state.schoolRole === "SUPERADMIN") { 1094 } else if (this.$store.state.schoolRole === "SUPERADMIN") {
1008 this.token = this.$store.state.schoolToken; 1095 this.token = this.$store.state.schoolToken;
1009 } else if (this.$store.state.role === "TEACHER") { 1096 } else if (this.$store.state.role === "TEACHER") {
1010 this.token = this.$store.state.token; 1097 this.token = this.$store.state.token;
1011 } else if (this.$store.state.role === "ACCOUNTANT") { 1098 } else if (this.$store.state.role === "ACCOUNTANT") {
1012 this.token = this.$store.state.token; 1099 this.token = this.$store.state.token;
1013 } else if (this.$store.state.role === "LIBRARIAN") { 1100 } else if (this.$store.state.role === "LIBRARIAN") {
1014 this.token = this.$store.state.token; 1101 this.token = this.$store.state.token;
1015 } else if (this.$store.state.role === "PARENT") { 1102 } else if (this.$store.state.role === "PARENT") {
1016 this.token = this.$store.state.token; 1103 this.token = this.$store.state.token;
1017 await this.getparentStudents(); 1104 await this.getparentStudents();
1018 } 1105 }
1019 this.role = this.$store.state.role; 1106 this.role = this.$store.state.role;
1020 // console.log("role", this.$store.state.schoolRole,"tt",this.$store.state.schoolToken); 1107 // console.log("role", this.$store.state.schoolRole,"tt",this.$store.state.schoolToken);
1021 // this.getData(); 1108 // this.getData();
1022 await this.getStudents(); 1109 await this.getStudents();
1023 await this.getTeachers(); 1110 await this.getTeachers();
1024 await this.getParents(); 1111 await this.getParents();
1025 await this.getClasses(); 1112 await this.getClasses();
1026 await this.getNoticeData(); 1113 await this.getNoticeData();
1027 await this.getUserData(); 1114 await this.getUserData();
1028 await this.getFeesAndCollectionsData(); 1115 await this.getFeesAndCollectionsData();
1029 await this.getExpensesData(); 1116 await this.getExpensesData();
1030 1117
1031 /* get Latest events list for student login*/ 1118 /* get Latest events list for student login*/
1032 if (this.$store.state.role == "PARENT") { 1119 if (this.$store.state.role == "PARENT") {
1033 let response = await this.studentMeetingEvents({ 1120 let response = await this.studentMeetingEvents({
1034 studentId: localStorage.getItem("parentStudentId") 1121 studentId: localStorage.getItem("parentStudentId")
1035 }); 1122 });
1036 this.activityList = response.data.data; 1123 this.activityList = response.data.data;
1037 1124
1038 /* set activityEvents array to highlight event dates in calender */ 1125 /* set activityEvents array to highlight event dates in calender */
1039 for (var i = 0; i < this.activityList.length; i++) { 1126 for (var i = 0; i < this.activityList.length; i++) {
1040 let obj = {}; 1127 let obj = {};
1041 obj.date = moment(this.activityList[i].meetingEvent.dateOfEvent).format( 1128 obj.date = moment(this.activityList[i].meetingEvent.dateOfEvent).format(
1042 "YYYY/MM/DD" 1129 "YYYY/MM/DD"
1043 ); 1130 );
1044 obj.title = this.activityList[i].meetingEvent.title; 1131 obj.title = this.activityList[i].meetingEvent.title;
1045 obj._id = this.activityList[i].meetingEvent._id; 1132 obj._id = this.activityList[i].meetingEvent._id;
1046 this.activityEvents.push(obj); 1133 this.activityEvents.push(obj);
1047 } 1134 }
1048 } 1135 }
1049 1136
1050 /* get Latest events list for teacher login*/ 1137 /* get Latest events list for teacher login*/
1051 if (this.role == "TEACHER") { 1138 if (this.role == "TEACHER") {
1052 await this.getMeetingEventes(); 1139 await this.getMeetingEventes();
1053 } 1140 }
1054 } 1141 }
1055 }; 1142 };
1056 </script> 1143 </script>
1057 1144
1058 <style scoped> 1145 <style scoped>
src/pages/meetingEvent/meetingEvent.vue
Diff comments   View file @3f81871
1 <template> 1 <template>
2 <v-container fluid class="body-color"> 2 <v-container fluid class="body-color">
3 <!-- ****** EDITS EVENT ****** --> 3 <!-- ****** EDITS EVENT ****** -->
4 <v-dialog v-model="editEventdialog" max-width="500px"> 4 <v-dialog v-model="editEventdialog" max-width="500px">
5 <v-card flat class="card-style pa-2" dark> 5 <v-card flat class="card-style pa-2" dark>
6 <v-layout> 6 <v-layout>
7 <v-flex xs12> 7 <v-flex xs12>
8 <label class="title text-xs-center">Edit Meeting Event</label> 8 <label class="title text-xs-center">Edit Meeting Event</label>
9 <v-icon size="24" class="right" @click="editEventdialog = false">cancel</v-icon> 9 <v-icon size="24" class="right" @click="editEventdialog = false">cancel</v-icon>
10 </v-flex> 10 </v-flex>
11 </v-layout> 11 </v-layout>
12 <v-container fluid> 12 <v-container fluid>
13 <v-flex xs12 sm12> 13 <v-flex xs12 sm12>
14 <v-layout> 14 <v-layout>
15 <v-flex xs4 class="pt-4 subheading"> 15 <v-flex xs4 class="pt-4 subheading">
16 <label class="right">Title:</label> 16 <label class="right">Title:</label>
17 </v-flex> 17 </v-flex>
18 <v-flex xs7 class="ml-3"> 18 <v-flex xs7 class="ml-3">
19 <v-text-field v-model="editedItem.title" type="text"></v-text-field> 19 <v-text-field v-model="editedItem.title" type="text"></v-text-field>
20 </v-flex> 20 </v-flex>
21 </v-layout> 21 </v-layout>
22 </v-flex> 22 </v-flex>
23 <v-flex xs12 sm12> 23 <v-flex xs12 sm12>
24 <v-layout> 24 <v-layout>
25 <v-flex xs4 class="pt-4 subheading"> 25 <v-flex xs4 class="pt-4 subheading">
26 <label class="right">Date:</label> 26 <label class="right">Date:</label>
27 </v-flex> 27 </v-flex>
28 <v-flex xs7 class="ml-3"> 28 <v-flex xs7 class="ml-3">
29 <v-menu 29 <v-menu
30 ref="menu" 30 ref="menu"
31 :close-on-content-click="false" 31 :close-on-content-click="false"
32 v-model="menuEditDate" 32 v-model="menuEditDate"
33 :nudge-right="40" 33 :nudge-right="40"
34 lazy 34 lazy
35 transition="scale-transition" 35 transition="scale-transition"
36 offset-y 36 offset-y
37 full-width 37 full-width
38 min-width="290px" 38 min-width="290px"
39 > 39 >
40 <v-text-field 40 <v-text-field
41 slot="activator" 41 slot="activator"
42 v-model="editedItem.dateOfEvent" 42 v-model="editedItem.dateOfEvent"
43 placeholder="Select date" 43 placeholder="Select date"
44 ></v-text-field> 44 ></v-text-field>
45 <v-date-picker 45 <v-date-picker
46 color="info" 46 color="info"
47 ref="picker" 47 ref="picker"
48 v-model="editedItem.dateOfEvent" 48 v-model="editedItem.dateOfEvent"
49 @input="$refs.menu.save(editedItem.dateOfEvent)" 49 @input="$refs.menu.save(editedItem.dateOfEvent)"
50 ></v-date-picker> 50 ></v-date-picker>
51 </v-menu> 51 </v-menu>
52 </v-flex> 52 </v-flex>
53 </v-layout> 53 </v-layout>
54 </v-flex> 54 </v-flex>
55 <v-flex xs12 sm12> 55 <v-flex xs12 sm12>
56 <v-layout> 56 <v-layout>
57 <v-flex xs4 class="pt-4 subheading"> 57 <v-flex xs4 class="pt-4 subheading">
58 <label class="right">Start Time:</label> 58 <label class="right">Start Time:</label>
59 </v-flex> 59 </v-flex>
60 <v-flex xs7 class="ml-3"> 60 <v-flex xs7 class="ml-3">
61 <v-menu 61 <v-menu
62 ref="menuEdit" 62 ref="menuEdit"
63 :close-on-content-click="false" 63 :close-on-content-click="false"
64 v-model="menuEditTime" 64 v-model="menuEditTime"
65 :nudge-right="40" 65 :nudge-right="40"
66 :return-value.sync="editedItem.startTime" 66 :return-value.sync="editedItem.startTime"
67 lazy 67 lazy
68 transition="scale-transition" 68 transition="scale-transition"
69 offset-y 69 offset-y
70 full-width 70 full-width
71 max-width="290px" 71 max-width="290px"
72 min-width="290px" 72 min-width="290px"
73 > 73 >
74 <v-text-field 74 <v-text-field
75 slot="activator" 75 slot="activator"
76 v-model="editedItem.startTime" 76 v-model="editedItem.startTime"
77 append-icon="access_time" 77 append-icon="access_time"
78 readonly 78 readonly
79 ></v-text-field> 79 ></v-text-field>
80 <v-time-picker 80 <v-time-picker
81 v-model="editedItem.startTime" 81 v-model="editedItem.startTime"
82 format="24hr"
82 @change="$refs.menuEdit.save(editedItem.startTime)" 83 @change="$refs.menuEdit.save(editedItem.startTime)"
83 ></v-time-picker> 84 ></v-time-picker>
84 </v-menu> 85 </v-menu>
85 </v-flex> 86 </v-flex>
86 </v-layout> 87 </v-layout>
87 </v-flex> 88 </v-flex>
88 <v-flex xs12 sm12> 89 <v-flex xs12 sm12>
89 <v-layout> 90 <v-layout>
90 <v-flex xs4 class="pt-4 subheading"> 91 <v-flex xs4 class="pt-4 subheading">
91 <label class="right">Duration:</label> 92 <label class="right">Duration:</label>
92 </v-flex> 93 </v-flex>
93 <v-flex xs7 class="ml-3"> 94 <v-flex xs7 class="ml-3">
94 <v-text-field v-model="editedItem.duration" type="text"></v-text-field> 95 <v-text-field v-model="editedItem.duration" type="text"></v-text-field>
95 </v-flex> 96 </v-flex>
96 </v-layout> 97 </v-layout>
97 </v-flex> 98 </v-flex>
98 <v-layout> 99 <v-layout>
99 <v-flex xs12> 100 <v-flex xs12>
100 <v-card-actions class="hidden-xs-only hidden-sm-only"> 101 <v-card-actions class="hidden-xs-only hidden-sm-only">
101 <v-spacer></v-spacer> 102 <v-spacer></v-spacer>
102 <v-btn round dark @click="save" class="add-button">Save</v-btn> 103 <v-btn round dark @click="save" class="add-button">Save</v-btn>
103 </v-card-actions> 104 </v-card-actions>
104 <v-card-actions class="hidden-md-only hidden-lg-only hidden-xl-only"> 105 <v-card-actions class="hidden-md-only hidden-lg-only hidden-xl-only">
105 <v-spacer></v-spacer> 106 <v-spacer></v-spacer>
106 <v-btn round dark @click="save" class="add-button">Save</v-btn> 107 <v-btn round dark @click="save" class="add-button">Save</v-btn>
107 <v-spacer></v-spacer> 108 <v-spacer></v-spacer>
108 </v-card-actions> 109 </v-card-actions>
109 </v-flex> 110 </v-flex>
110 </v-layout> 111 </v-layout>
111 </v-container> 112 </v-container>
112 </v-card> 113 </v-card>
113 </v-dialog> 114 </v-dialog>
114 <!-- ****** PROFILE VIEW EVENT ****** --> 115 <!-- ****** PROFILE VIEW EVENT ****** -->
115 <v-dialog v-model="viewEventdialog" max-width="500px"> 116 <v-dialog v-model="viewEventdialog" max-width="500px">
116 <v-card flat class="card-style pa-3" dark> 117 <v-card flat class="card-style pa-3" dark>
117 <v-layout> 118 <v-layout>
118 <v-flex xs12> 119 <v-flex xs12>
119 <label class="title text-xs-center">View Meeting Event</label> 120 <label class="title text-xs-center">View Meeting Event</label>
120 <v-icon size="24" class="right" @click="viewEventdialog = false">cancel</v-icon> 121 <v-icon size="24" class="right" @click="viewEventdialog = false">cancel</v-icon>
121 </v-flex> 122 </v-flex>
122 </v-layout> 123 </v-layout>
123 <v-card-text> 124 <v-card-text>
124 <v-container grid-list-md> 125 <v-container grid-list-md>
125 <v-layout wrap> 126 <v-layout wrap>
126 <v-flex> 127 <v-flex>
127 <v-layout> 128 <v-layout>
128 <v-flex xs4 sm6> 129 <v-flex xs4 sm6>
129 <h5 class="right my-1"> 130 <h5 class="right my-1">
130 <b>Title:</b> 131 <b>Title:</b>
131 </h5> 132 </h5>
132 </v-flex> 133 </v-flex>
133 <v-flex sm6 xs8> 134 <v-flex sm6 xs8>
134 <h5 class="my-1">{{ editedItem.title }}</h5> 135 <h5 class="my-1">{{ editedItem.title }}</h5>
135 </v-flex> 136 </v-flex>
136 </v-layout> 137 </v-layout>
137 <v-layout> 138 <v-layout>
138 <v-flex xs4 sm6> 139 <v-flex xs4 sm6>
139 <h5 class="right my-1"> 140 <h5 class="right my-1">
140 <b>Date:</b> 141 <b>Date:</b>
141 </h5> 142 </h5>
142 </v-flex> 143 </v-flex>
143 <v-flex sm6 xs8> 144 <v-flex sm6 xs8>
144 <h5 class="my-1">{{ dates(editedItem.dateOfEvent) }}</h5> 145 <h5 class="my-1">{{ dates(editedItem.dateOfEvent) }}</h5>
145 </v-flex> 146 </v-flex>
146 </v-layout> 147 </v-layout>
147 <v-layout> 148 <v-layout>
148 <v-flex xs4 sm6> 149 <v-flex xs4 sm6>
149 <h5 class="right my-1"> 150 <h5 class="right my-1">
150 <b>Start Time:</b> 151 <b>Start Time:</b>
151 </h5> 152 </h5>
152 </v-flex> 153 </v-flex>
153 <v-flex sm6 xs8> 154 <v-flex sm6 xs8>
154 <h5 class="my-1">{{ editedItem.startTime }}</h5> 155 <h5 class="my-1">{{ editedItem.startTime }}</h5>
155 </v-flex> 156 </v-flex>
156 </v-layout> 157 </v-layout>
157 <v-layout> 158 <v-layout>
158 <v-flex xs4 sm6> 159 <v-flex xs4 sm6>
159 <h5 class="right my-1"> 160 <h5 class="right my-1">
160 <b>Type Of Event:</b> 161 <b>Type Of Event:</b>
161 </h5> 162 </h5>
162 </v-flex> 163 </v-flex>
163 <v-flex sm6 xs8> 164 <v-flex sm6 xs8>
164 <h5 class="my-1">{{ editedItem.typeOfEvent }}</h5> 165 <h5 class="my-1">{{ editedItem.typeOfEvent }}</h5>
165 </v-flex> 166 </v-flex>
166 </v-layout> 167 </v-layout>
167 <v-layout v-if="editedItem.classId"> 168 <v-layout v-if="editedItem.classId">
168 <v-flex xs4 sm6> 169 <v-flex xs4 sm6>
169 <h5 class="right my-1"> 170 <h5 class="right my-1">
170 <b>Class:</b> 171 <b>Class:</b>
171 </h5> 172 </h5>
172 </v-flex> 173 </v-flex>
173 <v-flex sm6 xs8> 174 <v-flex sm6 xs8>
174 <h5 class="my-1">{{ editedItem.classId.classNum }}</h5> 175 <h5 class="my-1">{{ editedItem.classId.classNum }}</h5>
175 </v-flex> 176 </v-flex>
176 </v-layout> 177 </v-layout>
177 <v-layout> 178 <v-layout>
178 <v-flex xs4 sm6> 179 <v-flex xs4 sm6>
179 <h5 class="right my-1"> 180 <h5 class="right my-1">
180 <b>Duration:</b> 181 <b>Duration:</b>
181 </h5> 182 </h5>
182 </v-flex> 183 </v-flex>
183 <v-flex sm6 xs8> 184 <v-flex sm6 xs8>
184 <h5 class="my-1">{{ editedItem.duration }}</h5> 185 <h5 class="my-1">{{ editedItem.duration }}</h5>
185 </v-flex> 186 </v-flex>
186 </v-layout> 187 </v-layout>
187 </v-flex> 188 </v-flex>
188 </v-layout> 189 </v-layout>
189 </v-container> 190 </v-container>
190 </v-card-text> 191 </v-card-text>
191 </v-card> 192 </v-card>
192 </v-dialog> 193 </v-dialog>
193 194
194 <!-- ****** EVENT TABLE ****** --> 195 <!-- ****** EVENT TABLE ****** -->
195 196
196 <v-toolbar color="transparent" flat> 197 <v-toolbar color="transparent" flat>
197 <v-btn 198 <v-btn
198 fab 199 fab
199 dark 200 dark
200 class="open-dialog-button hidden-xl-only hidden-md-only hidden-lg-only" 201 class="open-dialog-button hidden-xl-only hidden-md-only hidden-lg-only"
201 small 202 small
202 @click="meetEventDialog = true" 203 @click="meetEventDialog = true"
203 > 204 >
204 <v-icon dark>add</v-icon> 205 <v-icon dark>add</v-icon>
205 </v-btn> 206 </v-btn>
206 <v-btn 207 <v-btn
207 round 208 round
208 class="open-dialog-button hidden-sm-only hidden-xs-only" 209 class="open-dialog-button hidden-sm-only hidden-xs-only"
209 dark 210 dark
210 @click="meetEventDialog = true" 211 @click="meetEventDialog = true"
211 > 212 >
212 <v-icon class="white--text pr-1" size="20">add</v-icon>Add Event 213 <v-icon class="white--text pr-1" size="20">add</v-icon>Add Event
213 </v-btn> 214 </v-btn>
214 <v-spacer></v-spacer> 215 <v-spacer></v-spacer>
215 <v-card-title class="body-1" v-show="show"> 216 <v-card-title class="body-1" v-show="show">
216 <v-btn icon large flat @click="displaySearch"> 217 <v-btn icon large flat @click="displaySearch">
217 <v-avatar size="27"> 218 <v-avatar size="27">
218 <img src="/static/icon/search.png" alt="icon" /> 219 <img src="/static/icon/search.png" alt="icon" />
219 </v-avatar> 220 </v-avatar>
220 </v-btn> 221 </v-btn>
221 </v-card-title> 222 </v-card-title>
222 <v-flex xs8 sm8 md3 lg2 v-show="showSearch"> 223 <v-flex xs8 sm8 md3 lg2 v-show="showSearch">
223 <v-layout> 224 <v-layout>
224 <v-text-field v-model="search" label="Search" prepend-inner-icon="search" color="primary"></v-text-field> 225 <v-text-field v-model="search" label="Search" prepend-inner-icon="search" color="primary"></v-text-field>
225 <v-icon @click="closeSearch" color="error">close</v-icon> 226 <v-icon @click="closeSearch" color="error">close</v-icon>
226 </v-layout> 227 </v-layout>
227 </v-flex> 228 </v-flex>
228 </v-toolbar> 229 </v-toolbar>
229 <v-data-table :headers="headers" :items="events" :pagination.sync="pagination" :search="search"> 230 <v-data-table :headers="headers" :items="events" :pagination.sync="pagination" :search="search">
230 <template slot="items" slot-scope="props"> 231 <template slot="items" slot-scope="props">
231 <tr class="tr"> 232 <tr class="tr">
232 <td class="td td-row">{{ props.index + 1}}</td> 233 <td class="td td-row">{{ props.index + 1}}</td>
233 <td 234 <td
234 class="td td-row text-xs-center" 235 class="td td-row text-xs-center"
235 >{{ props.item.classId ? props.item.classId.classNum : "-" }}</td> 236 >{{ props.item.classId ? props.item.classId.classNum : "-" }}</td>
236 <td class="td td-row text-xs-center">{{ props.item.title }}</td> 237 <td class="td td-row text-xs-center">{{ props.item.title }}</td>
237 <td class="td td-row text-xs-center">{{ dates(props.item.dateOfEvent) }}</td> 238 <td class="td td-row text-xs-center">{{ dates(props.item.dateOfEvent) }}</td>
238 <td class="td td-row text-xs-center">{{ props.item.startTime }}</td> 239 <td class="td td-row text-xs-center">{{ props.item.startTime }}</td>
239 <td class="td td-row text-xs-center"> 240 <td class="td td-row text-xs-center">
240 <span> 241 <span>
241 <v-tooltip top> 242 <v-tooltip top>
242 <img 243 <img
243 slot="activator" 244 slot="activator"
244 style="cursor:pointer; width:25px; height:25px; " 245 style="cursor:pointer; width:25px; height:25px; "
245 class="mr-3" 246 class="mr-3"
246 @click="profile(props.item)" 247 @click="profile(props.item)"
247 src="/static/icon/view.png" 248 src="/static/icon/view.png"
248 /> 249 />
249 <span>View</span> 250 <span>View</span>
250 </v-tooltip> 251 </v-tooltip>
251 <v-tooltip top> 252 <v-tooltip top>
252 <img 253 <img
253 slot="activator" 254 slot="activator"
254 style="cursor:pointer; width:20px; height:18px; " 255 style="cursor:pointer; width:20px; height:18px; "
255 class="mr-3" 256 class="mr-3"
256 @click="editItem(props.item)" 257 @click="editItem(props.item)"
257 src="/static/icon/edit.png" 258 src="/static/icon/edit.png"
258 /> 259 />
259 <span>Edit</span> 260 <span>Edit</span>
260 </v-tooltip> 261 </v-tooltip>
261 <v-tooltip top> 262 <v-tooltip top>
262 <img 263 <img
263 slot="activator" 264 slot="activator"
264 style="cursor:pointer; width:20px; height:20px; " 265 style="cursor:pointer; width:20px; height:20px; "
265 class="mr-3" 266 class="mr-3"
266 @click="deleteItem(props.item)" 267 @click="deleteItem(props.item)"
267 src="/static/icon/delete.png" 268 src="/static/icon/delete.png"
268 /> 269 />
269 <span>Delete</span> 270 <span>Delete</span>
270 </v-tooltip> 271 </v-tooltip>
271 </span> 272 </span>
272 </td> 273 </td>
273 </tr> 274 </tr>
274 </template> 275 </template>
275 <v-alert 276 <v-alert
276 slot="no-results" 277 slot="no-results"
277 :value="true" 278 :value="true"
278 color="error" 279 color="error"
279 icon="warning" 280 icon="warning"
280 >Your search for "{{ search }}" found no results.</v-alert> 281 >Your search for "{{ search }}" found no results.</v-alert>
281 </v-data-table> 282 </v-data-table>
282 <!-- ****** ADD MULTIPLE EVENT ****** --> 283 <!-- ****** ADD MULTIPLE EVENT ****** -->
283 <v-dialog v-model="meetEventDialog" max-width="500px" persistent> 284 <v-dialog v-model="meetEventDialog" max-width="500px" persistent>
284 <v-card flat class="card-style pa-2" dark> 285 <v-card flat class="card-style pa-2" dark>
285 <v-layout> 286 <v-layout>
286 <v-flex xs12> 287 <v-flex xs12>
287 <label class="title text-xs-center">Add Meeting Event</label> 288 <label class="title text-xs-center">Add Meeting Event</label>
288 <v-icon size="24" class="right" @click="meetEventDialog = false; $refs.form.reset()">cancel</v-icon> 289 <v-icon size="24" class="right" @click="meetEventDialog = false; $refs.form.reset()">cancel</v-icon>
289 </v-flex> 290 </v-flex>
290 </v-layout> 291 </v-layout>
291 <v-form ref="form" v-model="valid" lazy-validation > 292 <v-form ref="form" v-model="valid" lazy-validation >
292 <v-container fluid> 293 <v-container fluid>
293 <v-flex xs12> 294 <v-flex xs12>
294 <v-layout> 295 <v-layout>
295 <v-flex xs4 class="pt-4 subheading"> 296 <v-flex xs4 class="pt-4 subheading">
296 <label class="right">Title:</label> 297 <label class="right">Title:</label>
297 </v-flex> 298 </v-flex>
298 <v-flex xs8 sm8 class="ml-3"> 299 <v-flex xs8 sm8 class="ml-3">
299 <v-text-field 300 <v-text-field
300 v-model="meetEvent.title" 301 v-model="meetEvent.title"
301 placeholder="fill your Title" 302 placeholder="fill your Title"
302 type="text" 303 type="text"
303 :rules="titleRules" 304 :rules="titleRules"
304 required 305 required
305 ></v-text-field> 306 ></v-text-field>
306 </v-flex> 307 </v-flex>
307 </v-layout> 308 </v-layout>
308 </v-flex> 309 </v-flex>
309 <v-flex xs12> 310 <v-flex xs12>
310 <v-layout> 311 <v-layout>
311 <v-flex xs4 class="pt-4 subheading"> 312 <v-flex xs4 class="pt-4 subheading">
312 <label class="right">Date:</label> 313 <label class="right">Date:</label>
313 </v-flex> 314 </v-flex>
314 <v-flex xs8 sm8 class="ml-3"> 315 <v-flex xs8 sm8 class="ml-3">
315 <v-menu 316 <v-menu
316 ref="menu1" 317 ref="menu1"
317 :close-on-content-click="false" 318 :close-on-content-click="false"
318 v-model="menu1" 319 v-model="menu1"
319 :nudge-right="40" 320 :nudge-right="40"
320 :return-value.sync="meetEvent.dateOfEvent" 321 :return-value.sync="meetEvent.dateOfEvent"
321 app 322 app
322 lazy 323 lazy
323 transition="scale-transition" 324 transition="scale-transition"
324 offset-y 325 offset-y
325 full-width 326 full-width
326 min-width="290px" 327 min-width="290px"
327 > 328 >
328 <v-text-field 329 <v-text-field
329 slot="activator" 330 slot="activator"
330 :rules="dateRules" 331 :rules="dateRules"
331 v-model="meetEvent.dateOfEvent" 332 v-model="meetEvent.dateOfEvent"
332 append-icon="event" 333 append-icon="event"
333 placeholder="Select date" 334 placeholder="Select date"
334 ></v-text-field> 335 ></v-text-field>
335 <v-date-picker 336 <v-date-picker
336 color="info" 337 color="info"
337 v-model="meetEvent.dateOfEvent" 338 v-model="meetEvent.dateOfEvent"
338 @input="$refs.menu1.save(meetEvent.dateOfEvent)" 339 @input="$refs.menu1.save(meetEvent.dateOfEvent)"
339 ></v-date-picker> 340 ></v-date-picker>
340 </v-menu> 341 </v-menu>
341 </v-flex> 342 </v-flex>
342 </v-layout> 343 </v-layout>
343 </v-flex> 344 </v-flex>
344 <v-flex xs12> 345 <v-flex xs12>
345 <v-layout> 346 <v-layout>
346 <v-flex xs4 class="pt-4 subheading"> 347 <v-flex xs4 class="pt-4 subheading">
347 <label class="right">Start Time:</label> 348 <label class="right">Start Time:</label>
348 </v-flex> 349 </v-flex>
349 <v-flex xs8 sm8 class="ml-3"> 350 <v-flex xs8 sm8 class="ml-3">
350 <v-menu 351 <v-menu
351 ref="menuA" 352 ref="menuA"
352 :close-on-content-click="false" 353 :close-on-content-click="false"
353 v-model="menu2" 354 v-model="menu2"
354 :nudge-right="40" 355 :nudge-right="40"
355 :return-value.sync="meetEvent.startTime" 356 :return-value.sync="meetEvent.startTime"
356 lazy 357 lazy
357 transition="scale-transition" 358 transition="scale-transition"
358 offset-y 359 offset-y
359 full-width 360 full-width
360 max-width="290px" 361 max-width="290px"
361 min-width="290px" 362 min-width="290px"
362 > 363 >
363 <v-text-field 364 <v-text-field
364 slot="activator" 365 slot="activator"
365 v-model="meetEvent.startTime" 366 v-model="meetEvent.startTime"
366 placeholder="Select Start time" 367 placeholder="Select Start time"
367 append-icon="access_time" 368 append-icon="access_time"
368 :rules="startTimeRules" 369 :rules="startTimeRules"
369 readonly 370 readonly
370 ></v-text-field> 371 ></v-text-field>
371 <v-time-picker 372 <v-time-picker
372 v-model="meetEvent.startTime" 373 v-model="meetEvent.startTime"
374 format="24hr"
373 @change="$refs.menuA.save(meetEvent.startTime)" 375 @change="$refs.menuA.save(meetEvent.startTime)"
374 ></v-time-picker> 376 ></v-time-picker>
375 </v-menu> 377 </v-menu>
376 </v-flex> 378 </v-flex>
377 </v-layout> 379 </v-layout>
378 </v-flex> 380 </v-flex>
379 <v-flex xs12> 381 <v-flex xs12>
380 <v-layout> 382 <v-layout>
381 <v-flex xs4 class="pt-4 subheading"> 383 <v-flex xs4 class="pt-4 subheading">
382 <label class="right">Type Of Event:</label> 384 <label class="right">Type Of Event:</label>
383 </v-flex> 385 </v-flex>
384 <v-flex xs8 sm8 class="ml-3"> 386 <v-flex xs8 sm8 class="ml-3">
385 <v-select 387 <v-select
386 :items="typeOfEvent" 388 :items="typeOfEvent"
387 label="Select Type Of Event" 389 label="Select Type Of Event"
388 v-model="meetEvent.typeOfEvent" 390 v-model="meetEvent.typeOfEvent"
389 :rules="typeOfEventRules" 391 :rules="typeOfEventRules"
390 @change="getSelectOption(meetEvent.typeOfEvent)" 392 @change="getSelectOption(meetEvent.typeOfEvent)"
391 ></v-select> 393 ></v-select>
392 </v-flex> 394 </v-flex>
393 </v-layout> 395 </v-layout>
394 </v-flex> 396 </v-flex>
395 <v-flex xs12 v-show="classShow"> 397 <v-flex xs12 v-show="classShow">
396 <v-layout> 398 <v-layout>
397 <v-flex xs4 class="pt-4 subheading"> 399 <v-flex xs4 class="pt-4 subheading">
398 <label class="right">Class:</label> 400 <label class="right">Class:</label>
399 </v-flex> 401 </v-flex>
400 <v-flex xs8 sm8 class="ml-3"> 402 <v-flex xs8 sm8 class="ml-3">
401 <v-select 403 <v-select
402 :items="addclass" 404 :items="addclass"
403 label="Select Class" 405 label="Select Class"
404 v-model="meetEvent.classId" 406 v-model="meetEvent.classId"
405 item-text="classNum" 407 item-text="classNum"
406 item-value="_id" 408 item-value="_id"
407 @change="getCourses(meetEvent.classId)" 409 @change="getCourses(meetEvent.classId)"
408 ></v-select> 410 ></v-select>
409 </v-flex> 411 </v-flex>
410 </v-layout> 412 </v-layout>
411 </v-flex> 413 </v-flex>
412 <v-flex xs12 v-show="courseShow"> 414 <v-flex xs12 v-show="courseShow">
413 <v-layout> 415 <v-layout>
414 <v-flex xs4 class="pt-4 subheading"> 416 <v-flex xs4 class="pt-4 subheading">
415 <label class="right">Courses:</label> 417 <label class="right">Courses:</label>
416 </v-flex> 418 </v-flex>
417 <v-flex xs8 sm8 class="ml-3"> 419 <v-flex xs8 sm8 class="ml-3">
418 <v-select 420 <v-select
419 :items="courseData" 421 :items="courseData"
420 label="Select Course" 422 label="Select Course"
421 v-model="meetEvent.courseId" 423 v-model="meetEvent.courseId"
422 item-text="courseName" 424 item-text="courseName"
423 item-value="_id" 425 item-value="_id"
424 required 426 required
425 ></v-select> 427 ></v-select>
426 </v-flex> 428 </v-flex>
427 </v-layout> 429 </v-layout>
428 </v-flex> 430 </v-flex>
429 <v-flex xs12> 431 <v-flex xs12>
430 <v-layout> 432 <v-layout>
431 <v-flex xs4 class="pt-4 subheading"> 433 <v-flex xs4 class="pt-4 subheading">
432 <label class="right">Duration</label> 434 <label class="right">Duration</label>
433 </v-flex> 435 </v-flex>
434 <v-flex xs8 sm8 class="ml-3"> 436 <v-flex xs8 sm8 class="ml-3">
435 <v-text-field 437 <v-text-field
436 placeholder="fill your Description" 438 placeholder="fill your Description"
437 :rules="descriptionRules" 439 :rules="descriptionRules"
438 v-model="meetEvent.duration" 440 v-model="meetEvent.duration"
439 type="text" 441 type="text"
440 required 442 required
441 ></v-text-field> 443 ></v-text-field>
442 </v-flex> 444 </v-flex>
443 </v-layout> 445 </v-layout>
444 </v-flex> 446 </v-flex>
445 <v-layout> 447 <v-layout>
446 <v-flex xs12> 448 <v-flex xs12>
447 <v-layout class="right"> 449 <v-layout class="right">
448 <v-btn @click="clear" round class="clear-button" dark>clear</v-btn> 450 <v-btn @click="clear" round class="clear-button" dark>clear</v-btn>
449 <v-btn @click="submit" round dark :loading="loading" class="add-button">Add</v-btn> 451 <v-btn @click="submit" round dark :loading="loading" class="add-button">Add</v-btn>
450 </v-layout> 452 </v-layout>
451 </v-flex> 453 </v-flex>
452 </v-layout> 454 </v-layout>
453 </v-container> 455 </v-container>
454 </v-form> 456 </v-form>
455 </v-card> 457 </v-card>
456 </v-dialog> 458 </v-dialog>
457 <v-snackbar 459 <v-snackbar
458 :timeout="timeout" 460 :timeout="timeout"
459 :top="y === 'top'" 461 :top="y === 'top'"
460 :right="x === 'right'" 462 :right="x === 'right'"
461 :vertical="mode === 'vertical'" 463 :vertical="mode === 'vertical'"
462 v-model="snackbar" 464 v-model="snackbar"
463 :color="color" 465 :color="color"
464 >{{ text }}</v-snackbar> 466 >{{ text }}</v-snackbar>
465 <div class="loader" v-if="showLoader"> 467 <div class="loader" v-if="showLoader">
466 <v-progress-circular indeterminate color="white"></v-progress-circular> 468 <v-progress-circular indeterminate color="white"></v-progress-circular>
467 </div> 469 </div>
468 </v-container> 470 </v-container>
469 </template> 471 </template>
470 472
471 <script> 473 <script>
472 import http from "@/Services/http.js"; 474 import http from "@/Services/http.js";
473 import moment from "moment"; 475 import moment from "moment";
474 476
475 export default { 477 export default {
476 data: () => ({ 478 data: () => ({
477 snackbar: false, 479 snackbar: false,
478 y: "top", 480 y: "top",
479 x: "right", 481 x: "right",
480 mode: "", 482 mode: "",
481 timeout: 5000, 483 timeout: 5000,
482 text: "", 484 text: "",
483 color: "", 485 color: "",
484 loading: false, 486 loading: false,
485 date: null, 487 date: null,
486 search: "", 488 search: "",
487 color: "", 489 color: "",
488 show: true, 490 show: true,
489 meetEventDialog: false, 491 meetEventDialog: false,
490 showSearch: false, 492 showSearch: false,
491 showLoader: false, 493 showLoader: false,
492 editEventdialog: false, 494 editEventdialog: false,
493 viewEventdialog: false, 495 viewEventdialog: false,
494 valid: true, 496 valid: true,
495 addclass: [], 497 addclass: [],
496 courseData: [], 498 courseData: [],
497 pagination: { 499 pagination: {
498 rowsPerPage: 10 500 rowsPerPage: 10
499 }, 501 },
500 date: null, 502 date: null,
501 menu1: false, 503 menu1: false,
502 menu: false, 504 menu: false,
503 menuEditTime: false, 505 menuEditTime: false,
504 menuEditDate: false, 506 menuEditDate: false,
505 titleRules: [v => !!v || " Tilte is required"], 507 titleRules: [v => !!v || " Tilte is required"],
506 descriptionRules: [v => !!v || " Discription is required"], 508 descriptionRules: [v => !!v || " Discription is required"],
507 dateRules: [v => !!v || "Date of event is required"], 509 dateRules: [v => !!v || "Date of event is required"],
508 startTimeRules: [v => !!v || "Start Time is required"], 510 startTimeRules: [v => !!v || "Start Time is required"],
509 typeOfEventRules: [v => !!v || "Type of event is required"], 511 typeOfEventRules: [v => !!v || "Type of event is required"],
510 headers: [ 512 headers: [
511 { 513 {
512 text: "No", 514 text: "No",
513 align: "", 515 align: "",
514 sortable: false, 516 sortable: false,
515 value: "No" 517 value: "No"
516 }, 518 },
517 { 519 {
518 text: "Class", 520 text: "Class",
519 value: "classNum", 521 value: "classNum",
520 sortable: false, 522 sortable: false,
521 align: "center" 523 align: "center"
522 }, 524 },
523 { text: "Title", value: "title", sortable: false, align: "center" }, 525 { text: "Title", value: "title", sortable: false, align: "center" },
524 { 526 {
525 text: "Date Of Event", 527 text: "Date Of Event",
526 value: "dateOfEvent", 528 value: "dateOfEvent",
527 sortable: false, 529 sortable: false,
528 align: "center" 530 align: "center"
529 }, 531 },
530 { 532 {
531 text: "Start Time", 533 text: "Start Time",
532 value: "startTime", 534 value: "startTime",
533 sortable: false, 535 sortable: false,
534 align: "center" 536 align: "center"
535 }, 537 },
536 { text: "Action", value: "", sortable: false, align: "center" } 538 { text: "Action", value: "", sortable: false, align: "center" }
537 ], 539 ],
538 events: [], 540 events: [],
539 typeOfEvent: ["Class", "Course"], 541 typeOfEvent: ["Class", "Course"],
540 editedIndex: -1, 542 editedIndex: -1,
541 meetEvent: { 543 meetEvent: {
542 startTime: null 544 startTime: null
543 }, 545 },
544 editedItem: {}, 546 editedItem: {},
545 menu1: false, 547 menu1: false,
546 menu2: false, 548 menu2: false,
547 classShow: false, 549 classShow: false,
548 courseShow: false, 550 courseShow: false,
549 loginId: "" 551 loginId: ""
550 }), 552 }),
551 methods: { 553 methods: {
552 dates: function(date) { 554 dates: function(date) {
553 return moment(date).format("MMMM DD, YYYY"); 555 return moment(date).format("MMMM DD, YYYY");
554 }, 556 },
555 getEvents() { 557 getEvents() {
556 this.showLoader = true; 558 this.showLoader = true;
557 var token = this.$store.state.token; 559 var token = this.$store.state.token;
558 http() 560 http()
559 .get("/getMeetingEventesList", { 561 .get("/getMeetingEventesList", {
560 params: { teacherId: this.loginId }, 562 params: { teacherId: this.loginId },
561 headers: { Authorization: "Bearer " + token } 563 headers: { Authorization: "Bearer " + token }
562 }) 564 })
563 .then(response => { 565 .then(response => {
564 this.events = response.data.data; 566 this.events = response.data.data;
565 this.showLoader = false; 567 this.showLoader = false;
566 }) 568 })
567 .catch(error => { 569 .catch(error => {
568 // console.log("err====>", err); 570 // console.log("err====>", err);
569 this.showLoader = false; 571 this.showLoader = false;
570 if (error.response.status === 401) { 572 if (error.response.status === 401) {
571 this.$router.replace({ path: "/" }); 573 this.$router.replace({ path: "/" });
572 this.$store.dispatch("setToken", null); 574 this.$store.dispatch("setToken", null);
573 this.$store.dispatch("Id", null); 575 this.$store.dispatch("Id", null);
574 } 576 }
575 }); 577 });
576 }, 578 },
577 editItem(item) { 579 editItem(item) {
578 this.editedIndex = this.events.indexOf(item); 580 this.editedIndex = this.events.indexOf(item);
579 this.editedItem = Object.assign({}, item); 581 this.editedItem = Object.assign({}, item);
580 this.editedItem.meetingEventId = item._id; 582 this.editedItem.meetingEventId = item._id;
583 this.editedItem.startTime = moment(this.editedItem.startTime, ["h:mm A"]).format("HH:mm");
581 this.editEventdialog = true; 584 this.editEventdialog = true;
582 }, 585 },
583 profile(item) { 586 profile(item) {
584 this.editedIndex = this.events.indexOf(item); 587 this.editedIndex = this.events.indexOf(item);
585 this.editedItem = Object.assign({}, item); 588 this.editedItem = Object.assign({}, item);
586 this.viewEventdialog = true; 589 this.viewEventdialog = true;
587 }, 590 },
588 591
589 deleteItem(item) { 592 deleteItem(item) {
590 let deleteEvent = { 593 let deleteEvent = {
591 meetingEventId: item._id 594 meetingEventId: item._id
592 }; 595 };
593 http() 596 http()
594 .delete( 597 .delete(
595 "/deleteMeetingEvent", 598 "/deleteMeetingEvent",
596 confirm("Are you sure you want to delete this?") && { 599 confirm("Are you sure you want to delete this?") && {
597 params: deleteEvent 600 params: deleteEvent
598 } 601 }
599 ) 602 )
600 .then(response => { 603 .then(response => {
601 this.snackbar = true; 604 this.snackbar = true;
602 this.text = response.data.message; 605 this.text = response.data.message;
603 this.getEvents(); 606 this.getEvents();
604 this.snackbar = true; 607 this.snackbar = true;
605 this.color = "green"; 608 this.color = "green";
606 this.text = response.data.message; 609 this.text = response.data.message;
607 }) 610 })
608 .catch(error => { 611 .catch(error => {
609 this.snackbar = true; 612 this.snackbar = true;
610 this.text = error.response.data.message; 613 this.text = error.response.data.message;
611 this.color = "error"; 614 this.color = "error";
612 this.loading = false; 615 this.loading = false;
613 }); 616 });
614 }, 617 },
615 getSelectOption(type) { 618 getSelectOption(type) {
616 this.classShow = true; 619 this.classShow = true;
617 this.courseShow = true; 620 this.courseShow = true;
618 }, 621 },
619 getAllClass() { 622 getAllClass() {
620 http() 623 http()
621 .get("/getClassesList") 624 .get("/getClassesList")
622 .then(response => { 625 .then(response => {
623 this.addclass = response.data.data; 626 this.addclass = response.data.data;
624 }) 627 })
625 .catch(error => { 628 .catch(error => {
626 // console.log("err====>", err); 629 // console.log("err====>", err);
627 // this.$router.replace({ path: "/" }); 630 // this.$router.replace({ path: "/" });
628 }); 631 });
629 }, 632 },
630 getCourses(classId) { 633 getCourses(classId) {
631 this.showLoader = true; 634 this.showLoader = true;
632 http() 635 http()
633 .get("/getCourseesList", { 636 .get("/getCourseesList", {
634 params: { 637 params: {
635 classId: classId 638 classId: classId
636 } 639 }
637 }) 640 })
638 .then(response => { 641 .then(response => {
639 this.courseData = response.data.data; 642 this.courseData = response.data.data;
640 this.showLoader = false; 643 this.showLoader = false;
641 }) 644 })
642 .catch(err => { 645 .catch(err => {
643 console.log("err====>", err); 646 console.log("err====>", err);
644 this.showLoader = false; 647 this.showLoader = false;
645 }); 648 });
646 }, 649 },
647 close() { 650 close() {
648 this.editEventdialog = false; 651 this.editEventdialog = false;
649 }, 652 },
650 submit() { 653 submit() {
651 if (this.$refs.form.validate()) { 654 if (this.$refs.form.validate()) {
652 this.loading = true; 655 this.loading = true;
656 this.meetEvent.startTime = moment(this.meetEvent.startTime, "hh:mm").format("LT");
653 http() 657 http()
654 .post("/createMeetingEvent", this.meetEvent) 658 .post("/createMeetingEvent", this.meetEvent)
655 .then(response => { 659 .then(response => {
656 this.snackbar = true; 660 this.snackbar = true;
657 this.text = response.data.message; 661 this.text = response.data.message;
658 this.color = "green"; 662 this.color = "green";
659 this.getEvents(); 663 this.getEvents();
660 this.clear(); 664 this.clear();
661 this.loading = false; 665 this.loading = false;
662 this.meetEventDialog = false; 666 this.meetEventDialog = false;
663 }) 667 })
664 .catch(error => { 668 .catch(error => {
665 this.snackbar = true; 669 this.snackbar = true;
666 this.text = error.response.data.message; 670 this.text = error.response.data.message;
667 this.color = "error"; 671 this.color = "error";
668 this.loading = false; 672 this.loading = false;
669 }); 673 });
670 } 674 }
671 }, 675 },
672 clear() { 676 clear() {
673 this.$refs.form.reset(); 677 this.$refs.form.reset();
674 }, 678 },
675 save() { 679 save() {
676 delete this.editedItem.classId; 680 delete this.editedItem.classId;
681 this.editedItem.courseId = this.editedItem.courseId._id;
682 this.editedItem.startTime = moment(this.editedItem.startTime, "hh:mm").format("LT");
677 http() 683 http()
678 .put("/updateMeetingEvent", this.editedItem) 684 .put("/updateMeetingEvent", this.editedItem)
679 .then(response => { 685 .then(response => {
680 this.snackbar = true; 686 this.snackbar = true;
681 this.text = response.data.message; 687 this.text = response.data.message;
682 this.color = "green"; 688 this.color = "green";
683 this.getEvents(); 689 this.getEvents();
684 this.close(); 690 this.close();
685 }) 691 })
686 .catch(error => { 692 .catch(error => {
687 this.snackbar = true; 693 this.snackbar = true;
688 this.text = error.response.data.message; 694 this.text = error.response.data.message;
689 this.color = "error"; 695 this.color = "error";
690 }); 696 });
691 }, 697 },
692 displaySearch() { 698 displaySearch() {
693 (this.show = false), (this.showSearch = true); 699 (this.show = false), (this.showSearch = true);
694 }, 700 },
695 closeSearch() { 701 closeSearch() {
696 this.showSearch = false; 702 this.showSearch = false;
697 this.show = true; 703 this.show = true;
698 this.search = ""; 704 this.search = "";
699 } 705 }
700 }, 706 },
701 mounted() { 707 mounted() {
702 this.loginId = this.$store.state.id; 708 this.loginId = this.$store.state.id;
703 this.getEvents(); 709 this.getEvents();
704 this.getAllClass(); 710 this.getAllClass();
705 } 711 }
706 }; 712 };
707 </script> 713 </script>