Compare View

switch
from
...
to
 
Commits (2)
src/pages/Course/courseDetail.vue
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 <!-- ****** Edit Chapter detail ****** --> 70 <!-- ****** Edit Chapter detail ****** -->
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 size="24" class="right" @click="editChapterDetailDialog = false">cancel</v-icon> 76 <v-icon size="24" class="right" @click="editChapterDetailDialog = false">cancel</v-icon>
77 </v-flex> 77 </v-flex>
78 </v-layout> 78 </v-layout>
79 <v-card-text> 79 <v-card-text>
80 <v-layout wrap> 80 <v-layout wrap>
81 <v-flex xs12 sm12> 81 <v-flex xs12 sm12>
82 <v-layout> 82 <v-layout>
83 <v-flex xs4 class="pt-4 subheading"> 83 <v-flex xs4 class="pt-4 subheading">
84 <label class="right">Chapter Name:</label> 84 <label class="right">Chapter Name:</label>
85 </v-flex> 85 </v-flex>
86 <v-flex xs8 sm6 class="ml-3"> 86 <v-flex xs8 sm6 class="ml-3">
87 <v-text-field 87 <v-text-field
88 v-model="editChapter.chapterName" 88 v-model="editChapter.chapterName"
89 placeholder="fill your Title" 89 placeholder="fill your Title"
90 type="text" 90 type="text"
91 required 91 required
92 ></v-text-field> 92 ></v-text-field>
93 </v-flex> 93 </v-flex>
94 </v-layout> 94 </v-layout>
95 </v-flex> 95 </v-flex>
96 <v-flex xs12 sm12> 96 <v-flex xs12 sm12>
97 <v-layout> 97 <v-layout>
98 <v-flex xs4 class="pt-4 subheading"> 98 <v-flex xs4 class="pt-4 subheading">
99 <label class="right">Description:</label> 99 <label class="right">Description:</label>
100 </v-flex> 100 </v-flex>
101 <v-flex xs8 sm6 class="ml-3"> 101 <v-flex xs8 sm6 class="ml-3">
102 <v-text-field 102 <v-text-field
103 placeholder="fill your Description" 103 placeholder="fill your Description"
104 v-model="editChapter.description" 104 v-model="editChapter.description"
105 type="text" 105 type="text"
106 required 106 required
107 ></v-text-field> 107 ></v-text-field>
108 </v-flex> 108 </v-flex>
109 </v-layout> 109 </v-layout>
110 </v-flex> 110 </v-flex>
111 </v-layout> 111 </v-layout>
112 <!-- <v-flex xs12 v-if="editChapter.chapterPoints.length != 0"> 112 <!-- <v-flex xs12 v-if="editChapter.chapterPoints.length != 0">
113 <v-layout 113 <v-layout
114 wrap 114 wrap
115 v-for="(editChapterPoint,index) in editChapter.chapterPoints" 115 v-for="(editChapterPoint,index) in editChapter.chapterPoints"
116 :key="index" 116 :key="index"
117 > 117 >
118 <v-flex xs12 sm12 md4 class="pt-4 subheading"> 118 <v-flex xs12 sm12 md4 class="pt-4 subheading">
119 <label class="right hidden-xs-only hidden-sm-only">Chapter Points:</label> 119 <label class="right hidden-xs-only hidden-sm-only">Chapter Points:</label>
120 <label class="hidden-md-only hidden-lg-only hidden-xl-only">Chapter Points:</label> 120 <label class="hidden-md-only hidden-lg-only hidden-xl-only">Chapter Points:</label>
121 </v-flex> 121 </v-flex>
122 <v-layout> 122 <v-layout>
123 <v-flex xs10 sm10 sm5 md9 class="ml-3"> 123 <v-flex xs10 sm10 sm5 md9 class="ml-3">
124 <v-text-field :value="editChapterPoint" type="text" required></v-text-field> 124 <v-text-field :value="editChapterPoint" type="text" required></v-text-field>
125 </v-flex> 125 </v-flex>
126 <v-flex xs2 class="pt-4"> 126 <v-flex xs2 class="pt-4">
127 <v-icon @click="deleteUrl(index)">cancel</v-icon> 127 <v-icon @click="deleteUrl(index)">cancel</v-icon>
128 </v-flex>
129 </v-layout> 128 </v-flex>
130 </v-layout> 129 </v-layout>
131 </v-flex>--> 130 </v-layout>
132 <v-flex xs12> 131 </v-flex>-->
133 <div v-for="(updateImage,index) in updates" :key="index"> 132 <v-flex xs12>
134 <v-layout wrap> 133 <div v-for="(updateImage,index) in updates" :key="index">
135 <v-flex xs12 sm12 md4 class="pt-4 subheading"> 134 <v-layout wrap>
136 <label class="right hidden-xs-only hidden-sm-only">Chapter Points:</label> 135 <v-flex xs12 sm12 md4 class="pt-4 subheading">
137 <label class="hidden-md-only hidden-lg-only hidden-xl-only">Chapter Points:</label> 136 <label class="right hidden-xs-only hidden-sm-only">Chapter Points:</label>
138 </v-flex> 137 <label class="hidden-md-only hidden-lg-only hidden-xl-only">Chapter Points:</label>
139 <v-layout> 138 </v-flex>
140 <v-flex xs10 sm12 md9 class="ml-3"> 139 <v-layout>
141 <v-text-field 140 <v-flex xs10 sm12 md9 class="ml-3">
142 v-model="updateImage.value" 141 <v-text-field
143 placeholder="Upload new Chapter Points" 142 v-model="updateImage.value"
144 required 143 placeholder="Upload new Chapter Points"
145 ></v-text-field> 144 required
146 </v-flex> 145 ></v-text-field>
147 <v-flex xs2 class="pt-4"> 146 </v-flex>
148 <v-icon @click="deleteUpdate(index)" v-if="index !=0">cancel</v-icon> 147 <v-flex xs2 class="pt-4">
149 <v-icon @click="update">add_circle</v-icon> 148 <v-icon @click="deleteUpdate(index)" v-if="index !=0">cancel</v-icon>
150 </v-flex> 149 <v-icon @click="update">add_circle</v-icon>
151 </v-layout> 150 </v-flex>
152 </v-layout> 151 </v-layout>
153 </div> 152 </v-layout>
154 </v-flex> 153 </div>
155 <v-layout> 154 </v-flex>
156 <v-flex xs12 sm12 md11 lg11> 155 <v-layout>
157 <v-card-actions class="hidden-xs-only hidden-sm-only"> 156 <v-flex xs12 sm12 md11 lg11>
158 <v-spacer></v-spacer> 157 <v-card-actions class="hidden-xs-only hidden-sm-only">
159 <v-btn 158 <v-spacer></v-spacer>
160 round 159 <v-btn
161 dark 160 round
162 @click="saveChapter" 161 dark
163 :loading="editLoading" 162 @click="saveChapter"
164 class="add-button mr-4" 163 :loading="editLoading"
165 >Save</v-btn> 164 class="add-button mr-4"
166 </v-card-actions> 165 >Save</v-btn>
167 <v-card-actions class="hidden-md-only hidden-lg-only hidden-xl-only"> 166 </v-card-actions>
168 <v-spacer></v-spacer> 167 <v-card-actions class="hidden-md-only hidden-lg-only hidden-xl-only">
169 <v-btn 168 <v-spacer></v-spacer>
170 round 169 <v-btn
171 dark 170 round
172 @click="saveChapter" 171 dark
173 :loading="editLoading" 172 @click="saveChapter"
174 class="add-button" 173 :loading="editLoading"
175 >Save</v-btn> 174 class="add-button"
176 <v-spacer></v-spacer> 175 >Save</v-btn>
177 </v-card-actions> 176 <v-spacer></v-spacer>
178 </v-flex> 177 </v-card-actions>
179 </v-layout> 178 </v-flex>
180 </v-card-text> 179 </v-layout>
181 </v-card> 180 </v-card-text>
182 </v-dialog> 181 </v-card>
183 <!-- ****** Add Chapter detail ****** --> 182 </v-dialog>
184 <v-dialog v-model="addChapterDialog" max-width="1000px" scrollable> 183 <!-- ****** Add Chapter detail ****** -->
185 <v-card class="card-style pa-2" dark> 184 <v-dialog v-model="addChapterDialog" max-width="1000px" scrollable>
186 <v-layout> 185 <v-card class="card-style pa-2" dark>
187 <v-flex xs12> 186 <v-layout>
188 <label class="title text-xs-center">Add Chapter Detail</label> 187 <v-flex xs12>
189 <v-icon size="24" class="right" @click="addChapterDialog = false">cancel</v-icon> 188 <label class="title text-xs-center">Add Chapter Detail</label>
190 </v-flex> 189 <v-icon size="24" class="right" @click="addChapterDialog = false">cancel</v-icon>
191 </v-layout> 190 </v-flex>
192 <v-card-text> 191 </v-layout>
193 <v-layout wrap> 192 <v-card-text>
194 <v-flex xs12 sm12> 193 <v-layout wrap>
195 <v-layout> 194 <v-flex xs12 sm12>
196 <v-flex xs4 class="pt-4 subheading"> 195 <v-layout>
197 <label class="right">Chapter Name:</label> 196 <v-flex xs4 class="pt-4 subheading">
198 </v-flex> 197 <label class="right">Chapter Name:</label>
199 <v-flex xs8 sm6 class="ml-3"> 198 </v-flex>
200 <v-text-field 199 <v-flex xs8 sm6 class="ml-3">
201 v-model="addChapterItem.chapterName" 200 <v-text-field
202 placeholder="fill your Title" 201 v-model="addChapterItem.chapterName"
203 type="text" 202 placeholder="fill your Title"
204 required 203 type="text"
205 ></v-text-field> 204 required
206 </v-flex> 205 ></v-text-field>
207 </v-layout> 206 </v-flex>
208 </v-flex> 207 </v-layout>
209 <v-flex xs12 sm12> 208 </v-flex>
210 <v-layout> 209 <v-flex xs12 sm12>
211 <v-flex xs4 class="pt-4 subheading"> 210 <v-layout>
212 <label class="right">Description:</label> 211 <v-flex xs4 class="pt-4 subheading">
213 </v-flex> 212 <label class="right">Description:</label>
214 <v-flex xs8 sm6 class="ml-3"> 213 </v-flex>
215 <v-text-field 214 <v-flex xs8 sm6 class="ml-3">
216 placeholder="fill your Description" 215 <v-text-field
217 v-model="addChapterItem.description" 216 placeholder="fill your Description"
218 type="text" 217 v-model="addChapterItem.description"
219 required 218 type="text"
220 ></v-text-field> 219 required
221 </v-flex> 220 ></v-text-field>
222 </v-layout> 221 </v-flex>
223 </v-flex> 222 </v-layout>
224 </v-layout> 223 </v-flex>
225 <v-flex xs12> 224 </v-layout>
226 <div v-for="(chapterPoints,index) in findsChapterPoint" :key="index"> 225 <v-flex xs12>
227 <v-layout> 226 <div v-for="(chapterPoints,index) in findsChapterPoint" :key="index">
228 <v-flex xs4 class="pt-4 subheading"> 227 <v-layout>
229 <label class="right">Chapter Points:</label> 228 <v-flex xs4 class="pt-4 subheading">
230 </v-flex> 229 <label class="right">Chapter Points:</label>
231 <v-flex xs8 sm8 md6 class="ml-3"> 230 </v-flex>
232 <v-text-field 231 <v-flex xs8 sm8 md6 class="ml-3">
233 placeholder="fill your Chapter Points" 232 <v-text-field
234 v-model="chapterPoints.value" 233 placeholder="fill your Chapter Points"
235 type="text" 234 v-model="chapterPoints.value"
236 name="link" 235 type="text"
237 required 236 name="link"
238 ></v-text-field> 237 required
239 </v-flex> 238 ></v-text-field>
240 <v-flex xs2 class="pt-4"> 239 </v-flex>
241 <v-icon @click="deleteChapterPoint(index)" v-if="index !=0 ">cancel</v-icon> 240 <v-flex xs2 class="pt-4">
242 <v-icon @click="addChapterPoint()">add_circle</v-icon> 241 <v-icon @click="deleteChapterPoint(index)" v-if="index !=0 ">cancel</v-icon>
243 </v-flex> 242 <v-icon @click="addChapterPoint()">add_circle</v-icon>
244 </v-layout> 243 </v-flex>
245 </div> 244 </v-layout>
246 </v-flex> 245 </div>
247 <v-layout> 246 </v-flex>
248 <v-flex xs12 sm12 md11 lg11> 247 <v-layout>
249 <v-card-actions class="hidden-xs-only hidden-sm-only"> 248 <v-flex xs12 sm12 md11 lg11>
250 <v-spacer></v-spacer> 249 <v-card-actions class="hidden-xs-only hidden-sm-only">
251 <v-btn 250 <v-spacer></v-spacer>
252 round 251 <v-btn
253 dark 252 round
254 @click="submitChapter" 253 dark
255 :loading="editLoading" 254 @click="submitChapter"
256 class="add-button mr-4" 255 :loading="editLoading"
257 >Submit</v-btn> 256 class="add-button mr-4"
258 </v-card-actions> 257 >Submit</v-btn>
259 <v-card-actions class="hidden-md-only hidden-lg-only hidden-xl-only"> 258 </v-card-actions>
260 <v-spacer></v-spacer> 259 <v-card-actions class="hidden-md-only hidden-lg-only hidden-xl-only">
261 <v-btn round dark @click="save" :loading="editLoading" class="add-button">Save</v-btn> 260 <v-spacer></v-spacer>
262 <v-spacer></v-spacer> 261 <v-btn round dark @click="save" :loading="editLoading" class="add-button">Save</v-btn>
263 </v-card-actions> 262 <v-spacer></v-spacer>
264 </v-flex> 263 </v-card-actions>
265 </v-layout> 264 </v-flex>
266 </v-card-text> 265 </v-layout>
267 </v-card> 266 </v-card-text>
268 </v-dialog> 267 </v-card>
269 268 </v-dialog>
270 <!-- ****** PROFILE Gallery ****** --> 269
271 270 <!-- ****** PROFILE Gallery ****** -->
272 <v-dialog v-model="viewProfileGallery" max-width="1000" scrollable> 271
273 <v-card flat class="card-style pa-3" dark> 272 <v-dialog v-model="viewProfileGallery" max-width="1000" scrollable>
274 <v-layout> 273 <v-card flat class="card-style pa-3" dark>
275 <v-flex xs12> 274 <v-layout>
276 <label class="title text-xs-center">View Course Detail</label> 275 <v-flex xs12>
277 <v-icon size="24" class="right" @click="closeProfileGallery">cancel</v-icon> 276 <label class="title text-xs-center">View Course Detail</label>
278 </v-flex> 277 <v-icon size="24" class="right" @click="closeProfileGallery">cancel</v-icon>
279 </v-layout> 278 </v-flex>
280 <v-card-text> 279 </v-layout>
281 <v-container grid-list-md> 280 <v-card-text>
282 <v-layout wrap> 281 <v-container grid-list-md>
283 <v-flex xs12> 282 <v-layout wrap>
284 <v-layout> 283 <v-flex xs12>
285 <v-flex xs4 sm6> 284 <v-layout>
286 <h5 class="right my-1"> 285 <v-flex xs4 sm6>
287 <b>Chapter Name:</b> 286 <h5 class="right my-1">
288 </h5> 287 <b>Chapter Name:</b>
289 </v-flex> 288 </h5>
290 <v-flex sm6 xs8> 289 </v-flex>
291 <h5 class="my-1">{{ editedItem.chapterName }}</h5> 290 <v-flex sm6 xs8>
292 </v-flex> 291 <h5 class="my-1">{{ editedItem.chapterName }}</h5>
293 </v-layout> 292 </v-flex>
294 <v-layout> 293 </v-layout>
295 <v-flex xs4 sm6> 294 <v-layout>
296 <h5 class="right my-1"> 295 <v-flex xs4 sm6>
297 <b>Description:</b> 296 <h5 class="right my-1">
298 </h5> 297 <b>Description:</b>
299 </v-flex> 298 </h5>
300 <v-flex sm6 xs8> 299 </v-flex>
301 <h5 class="my-1">{{ editedItem.description }}</h5> 300 <v-flex sm6 xs8>
302 </v-flex> 301 <h5 class="my-1">{{ editedItem.description }}</h5>
303 </v-layout> 302 </v-flex>
304 <v-layout> 303 </v-layout>
305 <v-flex xs5 sm6> 304 <v-layout>
306 <h5 class="right my-1"> 305 <v-flex xs5 sm6>
307 <b>You Tube Link Url:</b> 306 <h5 class="right my-1">
308 </h5> 307 <b>You Tube Link Url:</b>
309 </v-flex> 308 </h5>
310 <v-flex sm6 xs8> 309 </v-flex>
311 <h5 class="my-1"> 310 <v-flex sm6 xs8>
312 <ul v-for="chapterPoint in editedItem.chapterPoints" :key="chapterPoint"> 311 <h5 class="my-1">
313 <li>{{ chapterPoint}}</li> 312 <ul v-for="chapterPoint in editedItem.chapterPoints" :key="chapterPoint">
314 </ul> 313 <li>{{ chapterPoint}}</li>
315 </h5> 314 </ul>
316 </v-flex> 315 </h5>
317 </v-layout> 316 </v-flex>
318 </v-flex> 317 </v-layout>
319 </v-layout> 318 </v-flex>
320 </v-container> 319 </v-layout>
321 </v-card-text> 320 </v-container>
322 </v-card> 321 </v-card-text>
323 </v-dialog> 322 </v-card>
324 323 </v-dialog>
325 <!-- ****** Course Detail TABLE ****** --> 324
326 325 <!-- ****** Course Detail TABLE ****** -->
327 <v-toolbar color="transparent" flat> 326
328 <v-btn 327 <v-toolbar color="transparent" flat>
329 fab 328 <v-btn
330 dark 329 fab
331 class="open-dialog-button hidden-xl-only hidden-md-only hidden-lg-only" 330 dark
332 small 331 class="open-dialog-button hidden-xl-only hidden-md-only hidden-lg-only"
333 @click="addCourseDetailDialog = true" 332 small
334 > 333 @click="addCourseDetailDialog = true"
335 <v-icon dark>add</v-icon> 334 >
336 </v-btn> 335 <v-icon dark>add</v-icon>
337 <v-btn 336 </v-btn>
338 round 337 <v-btn
339 class="open-dialog-button hidden-sm-only hidden-xs-only" 338 round
340 dark 339 class="open-dialog-button hidden-sm-only hidden-xs-only"
341 @click="addCourseDetailDialog = true" 340 dark
342 > 341 @click="addCourseDetailDialog = true"
343 <v-icon class="white--text pr-1" size="20">add</v-icon>Add Course Detail 342 >
344 </v-btn> 343 <v-icon class="white--text pr-1" size="20">add</v-icon>Add Course Detail
345 <v-flex xs12 sm4 md2> 344 </v-btn>
346 <v-select 345 <v-flex xs12 sm4 md2>
347 small 346 <v-select
348 :items="addclass" 347 small
349 label="Select Class" 348 :items="addclass"
350 v-model="getCourse.classId" 349 label="Select Class"
351 item-text="classNum" 350 v-model="getCourse.classId"
352 item-value="_id" 351 item-text="classNum"
353 name="Select Class" 352 item-value="_id"
354 @change="getCourses(getCourse.classId)" 353 name="Select Class"
355 class="mr-2" 354 @change="getCourses(getCourse.classId)"
356 required 355 class="mr-2"
357 ></v-select> 356 required
358 </v-flex> 357 ></v-select>
359 <v-flex xs12 sm4 md2> 358 </v-flex>
360 <v-select 359 <v-flex xs12 sm4 md2>
361 :items="courseData" 360 <v-select
362 label="Select Course" 361 :items="courseData"
363 v-model="getCourse.courseId" 362 label="Select Course"
364 item-text="courseName" 363 v-model="getCourse.courseId"
365 item-value="_id" 364 item-text="courseName"
366 required 365 item-value="_id"
367 class="ml-2" 366 required
368 @change="getCourseDetailsList(getCourse.courseId)" 367 class="ml-2"
369 ></v-select> 368 @change="getCourseDetailsList(getCourse.courseId)"
370 </v-flex> 369 ></v-select>
371 <v-spacer></v-spacer> 370 </v-flex>
372 <v-card-title class="body-1" v-show="show"> 371 <v-spacer></v-spacer>
373 <v-btn icon large flat @click="displaySearch"> 372 <v-card-title class="body-1" v-show="show">
374 <v-avatar size="27"> 373 <v-btn icon large flat @click="displaySearch">
375 <img src="/static/icon/search.png" alt="icon" /> 374 <v-avatar size="27">
376 </v-avatar> 375 <img src="/static/icon/search.png" alt="icon" />
377 </v-btn> 376 </v-avatar>
378 </v-card-title> 377 </v-btn>
379 <v-flex xs8 sm8 md3 lg2 v-show="showSearch"> 378 </v-card-title>
380 <v-layout> 379 <v-flex xs8 sm8 md3 lg2 v-show="showSearch">
381 <v-text-field v-model="search" label="Search" prepend-inner-icon="search" color="primary"></v-text-field> 380 <v-layout>
382 <v-icon @click="closeSearch" color="error">close</v-icon> 381 <v-text-field v-model="search" label="Search" prepend-inner-icon="search" color="primary"></v-text-field>
383 </v-layout> 382 <v-icon @click="closeSearch" color="error">close</v-icon>
384 </v-flex> 383 </v-layout>
385 </v-toolbar> 384 </v-flex>
386 <v-data-table 385 </v-toolbar>
387 :headers="headers" 386 <v-data-table
388 :items="CourseDetailsList" 387 :headers="headers"
389 :pagination.sync="pagination" 388 :items="CourseDetailsList"
390 :search="search" 389 :pagination.sync="pagination"
391 item-key="_id" 390 :search="search"
392 > 391 item-key="_id"
393 <template slot="items" slot-scope="props"> 392 >
394 <tr class="tr" @click="courseTableRow(props.item._id)"> 393 <template slot="items" slot-scope="props">
395 <td class="td td-row">{{ props.index + 1}}</td> 394 <tr class="tr" @click="courseTableRow(props.item._id)">
396 <td class="td td-row text-xs-center">{{ props.item.classId.classNum }}</td> 395 <td class="td td-row">{{ props.index + 1}}</td>
397 <td class="td td-row text-xs-center">{{ props.item.courseId.courseName }}</td> 396 <td class="td td-row text-xs-center">{{ props.item.classId.classNum }}</td>
398 <td class="td td-row text-xs-center"> 397 <td class="td td-row text-xs-center">{{ props.item.courseId.courseName }}</td>
399 <div style="vertical-align: top;"> 398 <td class="td td-row text-xs-center">
400 <v-tooltip top> 399 <div style="vertical-align: top;">
401 <v-icon 400 <v-tooltip top>
402 slot="activator" 401 <v-icon
403 style="cursor:pointer;font-size:22px;position: relative;top: -4px; " 402 slot="activator"
404 class="mr-3" 403 style="cursor:pointer;font-size:22px;position: relative;top: -4px; "
405 @click="addChapters(props.item)" 404 class="mr-3"
406 >add_circle_outline</v-icon> 405 @click="addChapters(props.item)"
407 <span>Add</span> 406 >add_circle_outline</v-icon>
408 </v-tooltip> 407 <span>Add</span>
409 <v-tooltip top> 408 </v-tooltip>
410 <img 409 <v-tooltip top>
411 slot="activator" 410 <img
412 style="cursor:pointer; width:25px; height:25px; " 411 slot="activator"
413 class="mr-3" 412 style="cursor:pointer; width:25px; height:25px; "
414 @click="props.expanded = !props.expanded" 413 class="mr-3"
415 src="/static/icon/view.png" 414 @click="props.expanded = !props.expanded"
416 /> 415 src="/static/icon/view.png"
417 <span>View</span> 416 />
418 </v-tooltip> 417 <span>View</span>
419 <v-tooltip top> 418 </v-tooltip>
420 <img 419 <v-tooltip top>
421 slot="activator" 420 <img
422 style="cursor:pointer; width:20px; height:18px; " 421 slot="activator"
423 class="mr-3" 422 style="cursor:pointer; width:20px; height:18px; "
424 @click="editItem(props.item)" 423 class="mr-3"
425 src="/static/icon/edit.png" 424 @click="editItem(props.item)"
426 /> 425 src="/static/icon/edit.png"
427 <span>Edit</span> 426 />
428 </v-tooltip> 427 <span>Edit</span>
429 <v-tooltip top> 428 </v-tooltip>
430 <img 429 <v-tooltip top>
431 slot="activator" 430 <img
432 style="cursor:pointer; width:20px; height:20px; " 431 slot="activator"
433 class="mr-3" 432 style="cursor:pointer; width:20px; height:20px; "
434 @click="deleteItem(props.item)" 433 class="mr-3"
435 src="/static/icon/delete.png" 434 @click="deleteItem(props.item)"
436 /> 435 src="/static/icon/delete.png"
437 <span>Delete</span> 436 />
438 </v-tooltip> 437 <span>Delete</span>
439 </div> 438 </v-tooltip>
440 </td> 439 </div>
441 </tr> 440 </td>
442 </template> 441 </tr>
443 <template slot="expand"> 442 </template>
444 <v-data-table :items="chapters" hide-actions item-key="chapterName" style="width: auto;"> 443 <template slot="expand">
445 <template slot="items" slot-scope="props"> 444 <v-data-table :items="chapters" hide-actions item-key="chapterName" style="width: auto;">
446 <tr class="tr" @click="props.expanded = !props.expanded"> 445 <template slot="items" slot-scope="props">
447 <td class="td td-row">{{ props.index + 1}}</td> 446 <tr class="tr" @click="props.expanded = !props.expanded">
448 <td class="text-xs-center td td-row">{{ props.item.chapterName}}</td> 447 <td class="td td-row">{{ props.index + 1}}</td>
449 <td class="text-xs-center td td-row">{{ props.item.description }}</td> 448 <td class="text-xs-center td td-row">{{ props.item.chapterName}}</td>
450 <td class="text-xs-center td td-row"> 449 <td class="text-xs-center td td-row">{{ props.item.description }}</td>
451 <v-tooltip top> 450 <td class="text-xs-center td td-row">
452 <img 451 <v-tooltip top>
453 slot="activator" 452 <img
454 style="cursor:pointer; width:25px; height:25px; " 453 slot="activator"
455 class="mr-3" 454 style="cursor:pointer; width:25px; height:25px; "
456 @click="profile(props.item)" 455 class="mr-3"
457 src="/static/icon/view.png" 456 @click="profile(props.item)"
458 /> 457 src="/static/icon/view.png"
459 <span>View</span> 458 />
460 </v-tooltip> 459 <span>View</span>
461 <v-tooltip top> 460 </v-tooltip>
462 <img 461 <v-tooltip top>
463 slot="activator" 462 <img
464 style="cursor:pointer; width:20px; height:18px; " 463 slot="activator"
465 class="mr-3" 464 style="cursor:pointer; width:20px; height:18px; "
466 @click="editChapterItem(props.item)" 465 class="mr-3"
467 src="/static/icon/edit.png" 466 @click="editChapterItem(props.item)"
468 /> 467 src="/static/icon/edit.png"
469 <span>Edit</span> 468 />
470 </v-tooltip> 469 <span>Edit</span>
471 <v-tooltip top> 470 </v-tooltip>
472 <img 471 <v-tooltip top>
473 slot="activator" 472 <img
474 style="cursor:pointer; width:20px; height:20px; " 473 slot="activator"
475 class="mr-3" 474 style="cursor:pointer; width:20px; height:20px; "
476 @click="deleteChapters(props.item)" 475 class="mr-3"
477 src="/static/icon/delete.png" 476 @click="deleteChapters(props.item)"
478 /> 477 src="/static/icon/delete.png"
479 <span>Delete Chapter</span> 478 />
480 </v-tooltip> 479 <span>Delete Chapter</span>
481 </td> 480 </v-tooltip>
482 </tr> 481 </td>
483 </template> 482 </tr>
484 </v-data-table> 483 </template>
485 </template> 484 </v-data-table>
486 485 </template>
487 <v-alert 486
488 slot="no-results" 487 <v-alert
489 :value="true" 488 slot="no-results"
490 color="error" 489 :value="true"
491 icon="warning" 490 color="error"
492 >Your search for "{{ search }}" found no results.</v-alert> 491 icon="warning"
493 </v-data-table> 492 >Your search for "{{ search }}" found no results.</v-alert>
494 <!-- ****** ADD Course Detail ****** --> 493 </v-data-table>
495 <v-dialog v-model="addCourseDetailDialog" max-width="600px" persistent> 494 <!-- ****** ADD Course Detail ****** -->
496 <v-card flat class="card-style pa-2" dark> 495 <v-dialog v-model="addCourseDetailDialog" max-width="600px" persistent>
497 <v-layout> 496 <v-card flat class="card-style pa-2" dark>
498 <v-flex xs12> 497 <v-layout>
499 <label class="title text-xs-center">Add Course Details</label> 498 <v-flex xs12>
500 <v-icon size="24" class="right" @click="addCourseDetailDialog = false; clear();">cancel</v-icon> 499 <label class="title text-xs-center">Add Course Details</label>
501 </v-flex> 500 <v-icon size="24" class="right" @click="addCourseDetailDialog = false; clear();">cancel</v-icon>
502 </v-layout> 501 </v-flex>
503 <v-form ref="form" v-model="valid" lazy-validation> 502 </v-layout>
504 <v-container fluid> 503 <v-form ref="form" v-model="valid" lazy-validation>
505 <v-flex xs12> 504 <v-container fluid>
506 <v-layout> 505 <v-flex xs12>
507 <v-flex xs4 class="pt-4 subheading"> 506 <v-layout>
508 <label class="right hidden-xs-only hidden-sm-only">Select Class:</label> 507 <v-flex xs4 class="pt-4 subheading">
509 <label class="right hidden-lg-only hidden-md-only hidden-xl-only">Class:</label> 508 <label class="right hidden-xs-only hidden-sm-only">Select Class:</label>
510 </v-flex> 509 <label class="right hidden-lg-only hidden-md-only hidden-xl-only">Class:</label>
511 <v-flex xs8 sm8 md7 class="ml-3"> 510 </v-flex>
512 <v-select 511 <v-flex xs8 sm8 md7 class="ml-3">
513 :items="addclass" 512 <v-select
514 label="Select Class" 513 :items="addclass"
515 v-model="addCourseDetail.classId" 514 label="Select Class"
516 item-text="classNum" 515 v-model="addCourseDetail.classId"
517 item-value="_id" 516 item-text="classNum"
518 name="Select Class" 517 item-value="_id"
519 :rules="clsssRules" 518 name="Select Class"
520 @change="getCourses(addCourseDetail.classId)" 519 :rules="clsssRules"
521 required 520 @change="getCourses(addCourseDetail.classId)"
522 ></v-select> 521 required
523 </v-flex> 522 ></v-select>
524 </v-layout> 523 </v-flex>
525 </v-flex> 524 </v-layout>
526 <v-flex xs12> 525 </v-flex>
527 <v-layout> 526 <v-flex xs12>
528 <v-flex xs4 class="pt-4 subheading"> 527 <v-layout>
529 <label class="right hidden-xs-only hidden-sm-only">Select Course:</label> 528 <v-flex xs4 class="pt-4 subheading">
530 <label class="right hidden-lg-only hidden-md-only hidden-xl-only">Course:</label> 529 <label class="right hidden-xs-only hidden-sm-only">Select Course:</label>
531 </v-flex> 530 <label class="right hidden-lg-only hidden-md-only hidden-xl-only">Course:</label>
532 <v-flex xs8 sm8 md7 class="ml-3"> 531 </v-flex>
533 <v-select 532 <v-flex xs8 sm8 md7 class="ml-3">
534 :items="courseData" 533 <v-select
535 label="Select Course" 534 :items="courseData"
536 v-model="addCourseDetail.courseId" 535 label="Select Course"
537 item-text="courseName" 536 v-model="addCourseDetail.courseId"
538 item-value="_id" 537 item-text="courseName"
539 :rules="courseRules" 538 item-value="_id"
540 required 539 :rules="courseRules"
541 ></v-select> 540 required
542 </v-flex> 541 ></v-select>
543 </v-layout> 542 </v-flex>
544 </v-flex> 543 </v-layout>
545 <v-flex xs12> 544 </v-flex>
546 <v-layout> 545 <v-flex xs12>
547 <v-flex xs4 class="pt-4 subheading"> 546 <v-layout>
548 <label class="right">Chapter Name:</label> 547 <v-flex xs4 class="pt-4 subheading">
549 </v-flex> 548 <label class="right">Chapter Name:</label>
550 <v-flex xs8 sm8 md7 class="ml-3"> 549 </v-flex>
551 <v-text-field 550 <v-flex xs8 sm8 md7 class="ml-3">
552 v-model="addCourseDetail.chapterName" 551 <v-text-field
553 placeholder="fill your Title" 552 v-model="addCourseDetail.chapterName"
554 name="name" 553 placeholder="fill your Title"
555 type="text" 554 name="name"
556 :rules="chapterNameRules" 555 type="text"
557 required 556 :rules="chapterNameRules"
558 ></v-text-field> 557 required
559 </v-flex> 558 ></v-text-field>
560 </v-layout> 559 </v-flex>
561 </v-flex> 560 </v-layout>
562 <v-flex xs12> 561 </v-flex>
563 <v-layout> 562 <v-flex xs12>
564 <v-flex xs4 class="pt-4 subheading"> 563 <v-layout>
565 <label class="right">Description:</label> 564 <v-flex xs4 class="pt-4 subheading">
566 </v-flex> 565 <label class="right">Description:</label>
567 <v-flex xs8 sm8 md7 class="ml-3"> 566 </v-flex>
568 <v-text-field 567 <v-flex xs8 sm8 md7 class="ml-3">
569 placeholder="fill your Description" 568 <v-text-field
570 :rules="descriptionRules" 569 placeholder="fill your Description"
571 v-model="addCourseDetail.description" 570 :rules="descriptionRules"
572 type="text" 571 v-model="addCourseDetail.description"
573 name="email" 572 type="text"
574 required 573 name="email"
575 ></v-text-field> 574 required
576 </v-flex> 575 ></v-text-field>
577 </v-layout> 576 </v-flex>
578 </v-flex> 577 </v-layout>
579 <v-layout> 578 </v-flex>
580 <v-flex xs12> 579 <v-layout>
581 <div v-for="(chapterPoints,index) in finds" :key="index"> 580 <v-flex xs12>
582 <v-layout> 581 <div v-for="(chapterPoints,index) in finds" :key="index">
583 <v-flex xs4 class="pt-4 subheading"> 582 <v-layout>
584 <label class="right">Chapter Points:</label> 583 <v-flex xs4 class="pt-4 subheading">
585 </v-flex> 584 <label class="right">Chapter Points:</label>
586 <v-flex xs8 sm8 md6 class="ml-3"> 585 </v-flex>
587 <v-text-field 586 <v-flex xs8 sm8 md6 class="ml-3">
588 placeholder="fill your Chapter Points" 587 <v-text-field
589 v-model="chapterPoints.value" 588 placeholder="fill your Chapter Points"
590 type="text" 589 v-model="chapterPoints.value"
591 required 590 type="text"
592 ></v-text-field> 591 required
593 </v-flex> 592 ></v-text-field>
594 <v-flex xs2 class="pt-4"> 593 </v-flex>
595 <v-icon @click="deleteFind(index)" v-if="index !=0 ">cancel</v-icon> 594 <v-flex xs2 class="pt-4">
596 <v-icon @click="addFind">add_circle</v-icon> 595 <v-icon @click="deleteFind(index)" v-if="index !=0 ">cancel</v-icon>
597 </v-flex> 596 <v-icon @click="addFind">add_circle</v-icon>
598 </v-layout> 597 </v-flex>
599 </div> 598 </v-layout>
600 </v-flex> 599 </div>
601 </v-layout> 600 </v-flex>
602 <v-layout> 601 </v-layout>
603 <v-flex xs12 sm12> 602 <v-layout>
604 <v-layout class="right"> 603 <v-flex xs12 sm12>
605 <v-btn @click="clear" round dark class="clear-button">Clear</v-btn> 604 <v-layout class="right">
606 <v-btn @click="submit" round dark :loading="loading" class="add-button">Add</v-btn> 605 <v-btn @click="clear" round dark class="clear-button">Clear</v-btn>
607 </v-layout> 606 <v-btn @click="submit" round dark :loading="loading" class="add-button">Add</v-btn>
608 </v-flex> 607 </v-layout>
609 </v-layout> 608 </v-flex>
610 </v-container> 609 </v-layout>
611 </v-form> 610 </v-container>
612 </v-card> 611 </v-form>
613 </v-dialog> 612 </v-card>
614 <v-snackbar 613 </v-dialog>
615 :timeout="timeout" 614 <v-snackbar
616 :top="y === 'top'" 615 :timeout="timeout"
617 :right="x === 'right'" 616 :top="y === 'top'"
618 :vertical="mode === 'vertical'" 617 :right="x === 'right'"
619 v-model="snackbar" 618 :vertical="mode === 'vertical'"
620 :color="color" 619 v-model="snackbar"
621 >{{ text }}</v-snackbar> 620 :color="color"
622 <div class="loader" v-if="showLoader"> 621 >{{ text }}</v-snackbar>
623 <v-progress-circular indeterminate color="white"></v-progress-circular> 622 <div class="loader" v-if="showLoader">
624 </div> 623 <v-progress-circular indeterminate color="white"></v-progress-circular>
625 </v-container> 624 </div>
626 </template> 625 </v-container>
627 626 </template>
628 <script> 627
629 import http from "@/Services/http.js"; 628 <script>
630 629 import http from "@/Services/http.js";
631 export default { 630
632 data: () => ({ 631 export default {
633 snackbar: false, 632 data: () => ({
634 y: "top", 633 snackbar: false,
635 x: "right", 634 y: "top",
636 mode: "", 635 x: "right",
637 timeout: 3000, 636 mode: "",
638 text: "", 637 timeout: 3000,
639 loading: false, 638 text: "",
640 color: "", 639 loading: false,
641 date: null, 640 color: "",
642 search: "", 641 date: null,
643 show: true, 642 search: "",
644 addCourseDetailDialog: false, 643 show: true,
645 showSearch: false, 644 addCourseDetailDialog: false,
646 showLoader: false, 645 showSearch: false,
647 editCourseDetailDialog: false, 646 showLoader: false,
648 editChapterDetailDialog: false, 647 editCourseDetailDialog: false,
649 viewProfileGallery: false, 648 editChapterDetailDialog: false,
650 valid: true, 649 viewProfileGallery: false,
651 editLoading: false, 650 valid: true,
652 addclass: [], 651 editLoading: false,
653 courseData: [], 652 addclass: [],
654 addSection: [], 653 courseData: [],
655 getCourse: {}, 654 addSection: [],
656 finds: [{ value: "" }], 655 getCourse: {},
657 findsChapterPoint: [{ value: "" }], 656 finds: [{ value: "" }],
658 updates: [], 657 findsChapterPoint: [{ value: "" }],
659 youTubeLink: {}, 658 updates: [],
660 addCourseDetail: { 659 youTubeLink: {},
661 chapters: [ 660 addCourseDetail: {
662 { 661 chapters: [
663 chapterName: "", 662 {
664 description: "", 663 chapterName: "",
665 chapterPoints: [] 664 description: "",
666 } 665 chapterPoints: []
667 ] 666 }
668 }, 667 ]
669 chapters: [], 668 },
670 pagination: { 669 chapters: [],
671 rowsPerPage: 10 670 pagination: {
672 }, 671 rowsPerPage: 10
673 editFiles: [], 672 },
674 files: [], 673 editFiles: [],
675 courseData: [], 674 files: [],
676 token: "", 675 courseData: [],
677 courseId: "", 676 token: "",
678 clsssRules: [v => !!v || " Class is required"], 677 courseId: "",
679 courseRules: [v => !!v || " Course is required"], 678 clsssRules: [v => !!v || " Class is required"],
680 chapterNameRules: [v => !!v || " Tilte is required"], 679 courseRules: [v => !!v || " Course is required"],
681 descriptionRules: [v => !!v || " Description is required"], 680 chapterNameRules: [v => !!v || " Tilte is required"],
682 headers: [ 681 descriptionRules: [v => !!v || " Description is required"],
683 { 682 headers: [
684 align: "", 683 {
685 text: "No", 684 align: "",
686 sortable: false, 685 text: "No",
687 value: "index" 686 sortable: false,
688 }, 687 value: "index"
689 { 688 },
690 text: "Class Name", 689 {
691 value: "classNum", 690 text: "Class Name",
692 sortable: false, 691 value: "classNum",
693 align: "center" 692 sortable: false,
694 }, 693 align: "center"
695 { 694 },
696 text: "Course Name", 695 {
697 value: "courseName", 696 text: "Course Name",
698 sortable: false, 697 value: "courseName",
699 align: "center" 698 sortable: false,
700 }, 699 align: "center"
701 { text: "Action", value: "", sortable: false, align: "center" } 700 },
702 ], 701 { text: "Action", value: "", sortable: false, align: "center" }
703 CourseDetailsList: [], 702 ],
704 editedIndex: -1, 703 CourseDetailsList: [],
705 editedItem: {}, 704 editedIndex: -1,
706 editedCourse: {}, 705 editedItem: {},
707 editChapter: { 706 editedCourse: {},
708 chapterPoints: [] 707 editChapter: {
708 chapterPoints: []
709 },
709 }, 710 index: "",
710 index: "", 711 addChapterItem: {},
711 addChapterItem: {}, 712 addChapterItemObj: {},
712 addChapterItemObj: {}, 713 addChapterDialog: false
713 addChapterDialog: false 714 }),
714 }), 715 methods: {
715 methods: { 716 getCourses(classId) {
716 getCourses(classId) { 717 this.showLoader = true;
717 this.showLoader = true; 718 http()
718 http() 719 .get("/getCourseesList", {
719 .get("/getCourseesList", { 720 params: {
720 params: { 721 classId: classId
721 classId: classId 722 }
722 } 723 })
723 }) 724 .then(response => {
724 .then(response => { 725 this.editChapter.courseId = "";
725 this.editChapter.courseId = ""; 726 this.courseData = response.data.data;
726 this.courseData = response.data.data; 727 // console.log("this.courseData", this.courseData);
727 // console.log("this.courseData", this.courseData); 728 this.showLoader = false;
728 this.showLoader = false; 729 })
729 }) 730 .catch(err => {
730 .catch(err => { 731 console.log("err====>", err);
731 console.log("err====>", err); 732 this.showLoader = false;
732 this.showLoader = false; 733 });
733 }); 734 },
734 }, 735 getCourseDetailsList() {
735 getCourseDetailsList() { 736 this.showLoader = true;
736 this.showLoader = true; 737 http()
737 http() 738 .get("/getParticularCourseDetail", {
738 .get("/getParticularCourseDetail", { 739 params: {
739 params: { 740 courseId: this.getCourse.courseId
740 courseId: this.getCourse.courseId 741 }
741 } 742 })
742 }) 743 .then(response => {
743 .then(response => { 744 this.CourseDetailsList = response.data.data;
744 this.CourseDetailsList = response.data.data; 745 if (response.data.data[0]) {
745 if (response.data.data[0]) { 746 this.chapters = response.data.data[0].chapters;
746 this.chapters = response.data.data[0].chapters; 747 }
747 } 748 // console.log("response.data.data", this.CourseDetailsList);
748 // console.log("response.data.data", this.CourseDetailsList); 749 this.showLoader = false;
749 this.showLoader = false; 750 })
750 }) 751 .catch(error => {
751 .catch(error => { 752 // console.log("err====>", err);
752 // console.log("err====>", err); 753 this.showLoader = false;
753 this.showLoader = false; 754 if (error.response.status === 401) {
754 if (error.response.status === 401) { 755 this.$router.replace({ path: "/" });
755 this.$router.replace({ path: "/" }); 756 this.$store.dispatch("setToken", null);
756 this.$store.dispatch("setToken", null); 757 this.$store.dispatch("Id", null);
757 this.$store.dispatch("Id", null); 758 }
758 } 759 });
759 }); 760 },
760 }, 761 courseTableRow(id) {
761 courseTableRow(id) { 762 // console.log("click7", id);
762 // console.log("click7", id); 763 this.courseId = id;
763 this.courseId = id; 764 },
764 }, 765 addChapters(item) {
765 addChapters(item) { 766 this.editedIndex = this.CourseDetailsList.indexOf(item);
766 this.editedIndex = this.CourseDetailsList.indexOf(item); 767 this.addChapterItemObj = Object.assign({}, item);
767 this.addChapterItemObj = Object.assign({}, item); 768 this.addChapterItem.courseDetailId = this.addChapterItemObj._id;
768 this.addChapterItem.courseDetailId = this.addChapterItemObj._id; 769 this.addChapterDialog = true;
769 this.addChapterDialog = true; 770 },
770 }, 771 submitChapter() {
771 submitChapter() { 772 this.addChapterItem.chapterPoints = [];
772 this.addChapterItem.chapterPoints = []; 773 for (let i = 0; i < this.findsChapterPoint.length; i++) {
773 for (let i = 0; i < this.findsChapterPoint.length; i++) { 774 this.addChapterItem.chapterPoints.push(this.findsChapterPoint[i].value);
774 this.addChapterItem.chapterPoints.push(this.findsChapterPoint[i].value); 775 }
775 } 776 // console.log("this.addChapterItem", this.addChapterItem);
776 // console.log("this.addChapterItem", this.addChapterItem); 777 this.loading = true;
777 this.loading = true; 778 http()
778 http() 779 .put("/addChapters", this.addChapterItem)
779 .put("/addChapters", this.addChapterItem) 780 .then(response => {
780 .then(response => { 781 this.addChapterDialog = false;
781 this.addChapterDialog = false; 782 this.loading = false;
782 this.loading = false; 783 this.snackbar = true;
783 this.snackbar = true; 784 this.text = response.data.message;
784 this.text = response.data.message; 785 this.color = "green";
785 this.color = "green"; 786 this.addChapterItem = {};
786 this.addChapterItem = {}; 787 this.removeChapterPoint();
787 this.removeChapterPoint(); 788 this.getCourseDetailsList();
788 this.getCourseDetailsList(); 789 })
789 }) 790 .catch(error => {
790 .catch(error => { 791 this.snackbar = true;
791 this.snackbar = true; 792 this.text = error.response.data.message;
792 this.text = error.response.data.message; 793 this.color = "error";
793 this.color = "error"; 794 this.loading = false;
794 this.loading = false; 795 });
795 }); 796 },
796 }, 797 profile(item) {
797 profile(item) { 798 this.editedIndex = this.chapters.indexOf(item);
798 this.editedIndex = this.chapters.indexOf(item); 799 this.editedItem = Object.assign({}, item);
799 this.editedItem = Object.assign({}, item); 800 this.viewProfileGallery = true;
800 this.viewProfileGallery = true; 801 },
801 }, 802 editItem(item) {
802 editItem(item) { 803 this.editedIndex = this.CourseDetailsList.indexOf(item);
803 this.editedIndex = this.CourseDetailsList.indexOf(item); 804 this.editedCourse = Object.assign({}, item);
804 this.editedCourse = Object.assign({}, item); 805 this.editCourseDetailDialog = true;
805 this.editCourseDetailDialog = true; 806 },
806 }, 807 editChapterItem(item) {
807 editChapterItem(item) { 808 this.editedIndex = this.chapters.indexOf(item);
808 this.editedIndex = this.chapters.indexOf(item); 809 this.editChapter = Object.assign({}, item);
810 this.updates = [];
811 for (let i = 0; i < this.editChapter.chapterPoints.length; i++) {
812 this.updates.push({ value: this.editChapter.chapterPoints[i] });
813 }
809 this.editChapter = Object.assign({}, item); 814 this.editChapterDetailDialog = true;
810 this.updates = []; 815 },
811 for (let i = 0; i < this.editChapter.chapterPoints.length; i++) { 816 deleteItem(item) {
812 this.updates.push({ value: this.editChapter.chapterPoints[i] }); 817 let deleteGallery = {
813 } 818 courseDetailId: item._id
814 this.editChapterDetailDialog = true; 819 };
815 }, 820 http()
816 deleteItem(item) { 821 .delete(
817 let deleteGallery = { 822 "/deleteCourseDetail",
818 courseDetailId: item._id 823 confirm("Are you sure you want to delete this?") && {
819 }; 824 params: deleteGallery,
820 http() 825 headers: {
821 .delete( 826 Authorization: "Bearer " + this.token
822 "/deleteCourseDetail", 827 }
823 confirm("Are you sure you want to delete this?") && { 828 }
824 params: deleteGallery, 829 )
825 headers: { 830 .then(response => {
826 Authorization: "Bearer " + this.token 831 this.snackbar = true;
827 } 832 this.text = "Successfully delete Course Details";
828 } 833 this.color = "green";
829 ) 834 this.getCourseDetailsList();
830 .then(response => { 835 })
831 this.snackbar = true; 836 .catch(error => {
832 this.text = "Successfully delete Course Details"; 837 // console.log(error);
833 this.color = "green"; 838 this.snackbar = true;
834 this.getCourseDetailsList(); 839 this.text = error.response.data.message;
835 }) 840 this.color = "error";
836 .catch(error => { 841 });
837 // console.log(error); 842 },
838 this.snackbar = true; 843 deleteChapters(item) {
839 this.text = error.response.data.message; 844 // console.log("item", item);
840 this.color = "error"; 845 let deleteChapters = {
841 }); 846 courseDetailId: this.courseId,
842 }, 847 chapterId: item._id
843 deleteChapters(item) { 848 };
844 // console.log("item", item); 849 http()
845 let deleteChapters = { 850 .put(
846 courseDetailId: this.courseId, 851 "/deleteChapters",
847 chapterId: item._id 852 confirm("Are you sure you want to delete this?") && deleteChapters
848 }; 853 )
849 http() 854 .then(response => {
850 .put( 855 this.snackbar = true;
851 "/deleteChapters", 856 this.text = "Successfully delete Chapters";
852 confirm("Are you sure you want to delete this?") && deleteChapters 857 this.color = "green";
853 ) 858 this.getCourseDetailsList();
854 .then(response => { 859 })
855 this.snackbar = true; 860 .catch(error => {
856 this.text = "Successfully delete Chapters"; 861 // console.log(error);
857 this.color = "green"; 862 this.snackbar = true;
858 this.getCourseDetailsList(); 863 this.text = error.response.data.message;
859 }) 864 this.color = "error";
860 .catch(error => { 865 });
861 // console.log(error); 866 },
862 this.snackbar = true; 867 close() {
863 this.text = error.response.data.message; 868 this.editCourseDetailDialog = false;
864 this.color = "error"; 869 },
865 }); 870 closeProfileGallery() {
866 }, 871 this.viewProfileGallery = false;
867 close() { 872 },
868 this.editCourseDetailDialog = false; 873 submit() {
869 }, 874 let chapters = [];
870 closeProfileGallery() { 875 var chapterPoints = [];
871 this.viewProfileGallery = false; 876 for (let i = 0; i < this.finds.length; i++) {
872 }, 877 chapterPoints.push(this.finds[i].value);
873 submit() { 878 // console.log("this.finds[i].value", this.finds[i].value);
874 let chapters = []; 879 chapters = [
875 var chapterPoints = []; 880 {
876 for (let i = 0; i < this.finds.length; i++) { 881 chapterName: this.addCourseDetail.chapterName,
877 chapterPoints.push(this.finds[i].value); 882 description: this.addCourseDetail.description,
878 // console.log("this.finds[i].value", this.finds[i].value); 883 chapterPoints: chapterPoints
879 chapters = [ 884 }
880 { 885 ];
881 chapterName: this.addCourseDetail.chapterName, 886 }
882 description: this.addCourseDetail.description, 887 if (this.$refs.form.validate()) {
883 chapterPoints: chapterPoints 888 // console.log("this.addCourseDetail", this.addCourseDetail);
884 } 889 var courseDetailsData = {
885 ]; 890 classId: this.addCourseDetail.classId,
886 } 891 courseId: this.addCourseDetail.courseId,
887 if (this.$refs.form.validate()) { 892 chapters: chapters
888 // console.log("this.addCourseDetail", this.addCourseDetail); 893 };
889 var courseDetailsData = { 894 this.loading = true;
890 classId: this.addCourseDetail.classId, 895 http()
891 courseId: this.addCourseDetail.courseId, 896 .post("/createCourseDetail", courseDetailsData)
892 chapters: chapters 897 .then(response => {
893 }; 898 this.addCourseDetailDialog = false;
894 this.loading = true; 899 this.loading = false;
895 http() 900 this.snackbar = true;
896 .post("/createCourseDetail", courseDetailsData) 901 this.text = response.data.message;
897 .then(response => { 902 this.color = "green";
898 this.addCourseDetailDialog = false; 903 this.clear();
899 this.loading = false; 904 this.removeAddFind();
900 this.snackbar = true; 905 })
901 this.text = response.data.message; 906 .catch(error => {
902 this.color = "green"; 907 this.snackbar = true;
903 this.clear(); 908 this.text = error.response.data.message;
904 this.removeAddFind(); 909 this.color = "error";
905 }) 910 this.loading = false;
906 .catch(error => { 911 });
907 this.snackbar = true; 912 }
908 this.text = error.response.data.message; 913 },
909 this.color = "error"; 914 clear() {
910 this.loading = false; 915 this.$refs.form.reset();
911 }); 916 },
912 } 917 saveChapter() {
913 }, 918 this.editedItem.courseDetailId = this.editedItem._id;
914 clear() { 919 // console.log("this.updates", this.updates);
920 var chapterPoints = [];
915 this.$refs.form.reset(); 921 for (let i = 0; i < this.updates.length; i++) {
916 }, 922 console.log("this.updates[i]", this.updates[i]);
917 saveChapter() { 923 chapterPoints.push(this.updates[i].value);
918 this.editedItem.courseDetailId = this.editedItem._id;
919 // console.log("this.updates", this.updates);
920 var chapterPoints = [];
921 for (let i = 0; i < this.updates.length; i++) {
922 console.log("this.updates[i]", this.updates[i]); 924 }
923 chapterPoints.push(this.updates[i].value); 925 var updateData = {
924 } 926 courseDetailId: this.courseId,
925 var updateData = { 927 chapterId: this.editChapter._id,
926 courseDetailId: this.courseId, 928 chapterName: this.editChapter.chapterName,
927 chapterId: this.editChapter._id, 929 description: this.editChapter.description,
928 chapterName: this.editChapter.chapterName, 930 chapterPoints: chapterPoints
929 description: this.editChapter.description, 931 };
932 console.log("chapterPoints", updateData);
930 chapterPoints: chapterPoints 933 this.editLoading = true;
931 }; 934 http()
932 console.log("chapterPoints", updateData); 935 .put("/updateChapters", updateData)
933 this.editLoading = true; 936 .then(response => {
934 http() 937 this.editChapterDetailDialog = false;
935 .put("/updateChapters", updateData) 938 this.snackbar = true;
936 .then(response => { 939 this.text = response.data.message;
937 this.editChapterDetailDialog = false; 940 this.color = "green";
938 this.snackbar = true; 941 this.editLoading = false;
939 this.text = response.data.message; 942 // this.removeUpdatePoints();
940 this.color = "green"; 943 this.getCourseDetailsList();
941 this.editLoading = false; 944 })
942 // this.removeUpdatePoints(); 945 .catch(error => {
943 this.getCourseDetailsList(); 946 this.editLoading = false;
944 }) 947 this.snackbar = true;
945 .catch(error => { 948 this.text = error.response.data.message;
946 this.editLoading = false; 949 this.color = "error";
947 this.snackbar = true; 950 });
948 this.text = error.response.data.message; 951 },
949 this.color = "error"; 952 save() {
950 }); 953 // console.log("utykgigiu", this.editedCourse);
951 }, 954 var updateData = {
952 save() { 955 courseDetailId: this.editedCourse._id,
953 // console.log("utykgigiu", this.editedCourse); 956 courseId: this.editedCourse.courseId,
954 var updateData = { 957 classId: this.editedCourse.classId
955 courseDetailId: this.editedCourse._id, 958 };
956 courseId: this.editedCourse.courseId, 959 this.editLoading = true;
957 classId: this.editedCourse.classId 960 http()
958 }; 961 .put("/updateCourseDetail", updateData)
959 this.editLoading = true; 962 .then(response => {
960 http() 963 this.getCourseDetailsList();
961 .put("/updateCourseDetail", updateData) 964 this.editCourseDetailDialog = false;
962 .then(response => { 965 this.snackbar = true;
963 this.getCourseDetailsList(); 966 this.text = response.data.message;
964 this.editCourseDetailDialog = false; 967 this.color = "green";
965 this.snackbar = true; 968 this.editLoading = false;
966 this.text = response.data.message; 969 // this.editChapterPointName = "";
967 this.color = "green"; 970 this.editFiles = [];
968 this.editLoading = false; 971 })
969 // this.editChapterPointName = ""; 972 .catch(error => {
970 this.editFiles = []; 973 this.editLoading = false;
971 }) 974 this.snackbar = true;
972 .catch(error => { 975 this.text = error.response.data.message;
973 this.editLoading = false; 976 this.color = "error";
974 this.snackbar = true; 977 });
975 this.text = error.response.data.message; 978 },
976 this.color = "error"; 979 getAllClasses() {
977 }); 980 http()
978 }, 981 .get("/getClassesList", {
979 getAllClasses() { 982 headers: { Authorization: "Bearer " + this.token }
980 http() 983 })
981 .get("/getClassesList", { 984 .then(response => {
982 headers: { Authorization: "Bearer " + this.token } 985 this.addclass = response.data.data;
983 }) 986 })
984 .then(response => { 987 .catch(err => {
985 this.addclass = response.data.data; 988 // console.log("err====>", err);
986 }) 989 });
987 .catch(err => { 990 },
988 // console.log("err====>", err); 991 removeChapterPoint: function() {
989 }); 992 this.findsChapterPoint = [{ value: "" }];
990 }, 993 },
991 removeChapterPoint: function() { 994 removeAddFind: function() {
992 this.findsChapterPoint = [{ value: "" }]; 995 this.finds = [{ value: "" }];
993 }, 996 },
994 removeAddFind: function() { 997 addFind: function() {
995 this.finds = [{ value: "" }]; 998 this.finds.push({ value: "" });
996 }, 999 },
997 addFind: function() { 1000 addChapterPoint: function() {
998 this.finds.push({ value: "" }); 1001 this.findsChapterPoint.push({ value: "" });
999 }, 1002 console.log("this.findsChapterPoint", this.findsChapterPoint);
1000 addChapterPoint: function() { 1003 },
1001 this.findsChapterPoint.push({ value: "" }); 1004 update: function() {
1002 console.log("this.findsChapterPoint", this.findsChapterPoint); 1005 this.updates.push({ value: "" });
1003 }, 1006 },
1004 update: function() { 1007 // removeUpdatePoints: function() {
1005 this.updates.push({ value: "" }); 1008 // this.updates = [{ value: "" }];
1006 }, 1009 // },
1007 // removeUpdatePoints: function() { 1010 deleteFind: function(index) {
1008 // this.updates = [{ value: "" }]; 1011 this.finds.splice(index, 1);
1009 // }, 1012 if (index === 0) this.addFind();
1010 deleteFind: function(index) { 1013 },
1011 this.finds.splice(index, 1); 1014 deleteChapterPoint: function(index) {
1012 if (index === 0) this.addFind(); 1015 this.findsChapterPoint.splice(index, 1);
1013 }, 1016 if (index === 0) this.addChapterPoint();
1014 deleteChapterPoint: function(index) { 1017 },
1015 this.findsChapterPoint.splice(index, 1); 1018 deleteUpdate: function(index) {
1016 if (index === 0) this.addChapterPoint(); 1019 this.updates.splice(index, 1);
1017 }, 1020 if (index === 0) this.update();
1018 deleteUpdate: function(index) { 1021 },
1019 this.updates.splice(index, 1); 1022 deleteUrl: function(index, youTubelinkId, id) {
1020 if (index === 0) this.update(); 1023 this.editChapter.chapterPoints.splice(index, 1);
1021 }, 1024 if (index === 0) this.update();
1022 deleteUrl: function(index, youTubelinkId, id) { 1025 },
1023 this.editChapter.chapterPoints.splice(index, 1); 1026 displaySearch() {
1024 if (index === 0) this.update(); 1027 this.show = false;
1025 }, 1028 this.showSearch = true;
1026 displaySearch() { 1029 },
1027 this.show = false; 1030 closeSearch() {
1028 this.showSearch = true; 1031 this.showSearch = false;
1029 }, 1032 this.show = true;
1030 closeSearch() { 1033 this.search = "";
1031 this.showSearch = false; 1034 }
1032 this.show = true; 1035 },
1033 this.search = ""; 1036 mounted() {