viithiisys / School-Management-dashboard

Download as
Browse Code ยป

Commit ab1ba03f4ae6afe4979290d09db546f2400aee70

Authored by Amber Dev
1 parent 3308a8c2b8
Exists in master and in 2 other branches amber-development, ui-design

removed edit and delete icons from Announcements:

Showing 1 changed file with 0 additions and 20 deletions   Show diff stats
src/pages/Dashboard/Announcement.vue
Diff comments   View file @ab1ba03
1 <template> 1 <template>
2 <div class="body-color"> 2 <div class="body-color">
3 <!-- LOADER --> 3 <!-- LOADER -->
4 <div class="loader" v-if="showLoader"> 4 <div class="loader" v-if="showLoader">
5 <v-progress-circular indeterminate color="white"></v-progress-circular> 5 <v-progress-circular indeterminate color="white"></v-progress-circular>
6 </div> 6 </div>
7 7
8 <!-- SNACKBAR --> 8 <!-- SNACKBAR -->
9 <v-snackbar 9 <v-snackbar
10 :timeout="timeout" 10 :timeout="timeout"
11 :top="y === 'top'" 11 :top="y === 'top'"
12 :right="x === 'right'" 12 :right="x === 'right'"
13 :vertical="mode === 'vertical'" 13 :vertical="mode === 'vertical'"
14 v-model="snackbar" 14 v-model="snackbar"
15 :color="snackbarColor" 15 :color="snackbarColor"
16 > 16 >
17 {{ text }} 17 {{ text }}
18 <v-spacer></v-spacer> 18 <v-spacer></v-spacer>
19 <v-btn flat text @click="snackbar = false">X</v-btn> 19 <v-btn flat text @click="snackbar = false">X</v-btn>
20 </v-snackbar> 20 </v-snackbar>
21 21
22 <v-container grid-list-xl class="pt-0"> 22 <v-container grid-list-xl class="pt-0">
23 <v-layout row class="mt-1"> 23 <v-layout row class="mt-1">
24 <v-flex xs8> 24 <v-flex xs8>
25 <v-layout column> 25 <v-layout column>
26 <!-- HEADING --> 26 <!-- HEADING -->
27 <v-flex> 27 <v-flex>
28 <div class="title side-bar-color font-weight-bold">Announcements</div> 28 <div class="title side-bar-color font-weight-bold">Announcements</div>
29 <div class="subheading grey--text lighten-1">General news and announcements</div> 29 <div class="subheading grey--text lighten-1">General news and announcements</div>
30 </v-flex> 30 </v-flex>
31 31
32 <!-- DATA TABLE --> 32 <!-- DATA TABLE -->
33 <v-flex> 33 <v-flex>
34 <v-data-table 34 <v-data-table
35 :headers="announcementHeaders" 35 :headers="announcementHeaders"
36 :items="announcementsList" 36 :items="announcementsList"
37 :pagination.sync="pagination" 37 :pagination.sync="pagination"
38 :search="search" 38 :search="search"
39 item-key="_id" 39 item-key="_id"
40 > 40 >
41 <template slot="items" slot-scope="props"> 41 <template slot="items" slot-scope="props">
42 <tr 42 <tr
43 class="tr" 43 class="tr"
44 @click="props.expanded = !props.expanded; selectedAnnoucementId = props.item._id; getDiscussionesThread()" 44 @click="props.expanded = !props.expanded; selectedAnnoucementId = props.item._id; getDiscussionesThread()"
45 style="cursor: pointer;" 45 style="cursor: pointer;"
46 > 46 >
47 <td class="text-xs-center td td-row"> 47 <td class="text-xs-center td td-row">
48 <v-avatar size="40"> 48 <v-avatar size="40">
49 <img :src="props.item.attachementUrl" v-if="props.item.attachementUrl" /> 49 <img :src="props.item.attachementUrl" v-if="props.item.attachementUrl" />
50 <img src="/static/icon/user.png" v-else-if="!props.item.attachementUrl" /> 50 <img src="/static/icon/user.png" v-else-if="!props.item.attachementUrl" />
51 </v-avatar> 51 </v-avatar>
52 </td> 52 </td>
53 <td class="text-xs-center td td-row">{{ props.item.discussionType}}</td> 53 <td class="text-xs-center td td-row">{{ props.item.discussionType}}</td>
54 <td class="text-xs-center td td-row"> 54 <td class="text-xs-center td td-row">
55 <span> 55 <span>
56 <v-tooltip top> 56 <v-tooltip top>
57 <img 57 <img
58 slot="activator" 58 slot="activator"
59 style="cursor:pointer; width:25px; height:25px; " 59 style="cursor:pointer; width:25px; height:25px; "
60 class="mr-3" 60 class="mr-3"
61 @click="profile(props.item)" 61 @click="profile(props.item)"
62 src="/static/icon/view.png" 62 src="/static/icon/view.png"
63 /> 63 />
64 <span>View</span> 64 <span>View</span>
65 </v-tooltip> 65 </v-tooltip>
66 <v-tooltip top>
67 <img
68 slot="activator"
69 style="cursor:pointer; width:20px; height:18px; "
70 class="mr-3"
71 @click="editItem(props.item)"
72 src="/static/icon/edit.png"
73 />
74 <span>Edit</span>
75 </v-tooltip>
76 <v-tooltip top>
77 <img
78 slot="activator"
79 style="cursor:pointer; width:20px; height:20px; "
80 class="mr-3"
81 @click="deleteItem(props.item)"
82 src="/static/icon/delete.png"
83 />
84 <span>Delete</span>
85 </v-tooltip>
86 </span> 66 </span>
87 </td> 67 </td>
88 </tr> 68 </tr>
89 </template> 69 </template>
90 <!-- COURSE ANNOUNCEMENTS REPLY FUNCTIONALITY --> 70 <!-- COURSE ANNOUNCEMENTS REPLY FUNCTIONALITY -->
91 <template slot="expand" slot-scope="props"> 71 <template slot="expand" slot-scope="props">
92 <v-layout> 72 <v-layout>
93 <v-flex xs12 v-for="(annoucementData,i) in annoucementData" :key="i"> 73 <v-flex xs12 v-for="(annoucementData,i) in annoucementData" :key="i">
94 <v-card class="elevation-0 grey lighten-3 pa-2" flat> 74 <v-card class="elevation-0 grey lighten-3 pa-2" flat>
95 <v-list two-line subheader> 75 <v-list two-line subheader>
96 <v-list-tile> 76 <v-list-tile>
97 <v-list-tile-avatar> 77 <v-list-tile-avatar>
98 <v-avatar size="46"> 78 <v-avatar size="46">
99 <img 79 <img
100 :src="annoucementData.attachementUrl" 80 :src="annoucementData.attachementUrl"
101 v-if="annoucementData.attachementUrl" 81 v-if="annoucementData.attachementUrl"
102 /> 82 />
103 <img 83 <img
104 src="/static/icon/user.png" 84 src="/static/icon/user.png"
105 v-else-if="!annoucementData.attachementUrl" 85 v-else-if="!annoucementData.attachementUrl"
106 /> 86 />
107 </v-avatar> 87 </v-avatar>
108 </v-list-tile-avatar> 88 </v-list-tile-avatar>
109 <v-list-tile-content> 89 <v-list-tile-content>
110 <v-list-tile-title>{{ annoucementData.discussionType }}</v-list-tile-title> 90 <v-list-tile-title>{{ annoucementData.discussionType }}</v-list-tile-title>
111 <!-- <v-list-tile-sub-title> 91 <!-- <v-list-tile-sub-title>
112 By 92 By
113 <span class="info--text">{{ annoucementData.studentId.name }}</span> 93 <span class="info--text">{{ annoucementData.studentId.name }}</span>
114 - {{dates(annoucementData.created ) }} 94 - {{dates(annoucementData.created ) }}
115 </v-list-tile-sub-title>--> 95 </v-list-tile-sub-title>-->
116 </v-list-tile-content> 96 </v-list-tile-content>
117 <v-list-tile-action> 97 <v-list-tile-action>
118 <div> 98 <div>
119 <v-btn 99 <v-btn
120 flat 100 flat
121 round 101 round
122 dark 102 dark
123 class="reply-btn" 103 class="reply-btn"
124 @click="showReplyBox = true" 104 @click="showReplyBox = true"
125 >Reply</v-btn> 105 >Reply</v-btn>
126 </div> 106 </div>
127 </v-list-tile-action> 107 </v-list-tile-action>
128 </v-list-tile> 108 </v-list-tile>
129 </v-list> 109 </v-list>
130 </v-card> 110 </v-card>
131 <v-flex xs12 class="mt-4" v-show="showReplyBox"> 111 <v-flex xs12 class="mt-4" v-show="showReplyBox">
132 <v-textarea 112 <v-textarea
133 name="input-7-1" 113 name="input-7-1"
134 solo 114 solo
135 label="Label Text" 115 label="Label Text"
136 multi-line 116 multi-line
137 v-model="replyDescription" 117 v-model="replyDescription"
138 ></v-textarea> 118 ></v-textarea>
139 <v-btn 119 <v-btn
140 round 120 round
141 dark 121 dark
142 class="open-dialog-button" 122 class="open-dialog-button"
143 flat 123 flat
144 @click="showReplyBox = false" 124 @click="showReplyBox = false"
145 >Cancel</v-btn> 125 >Cancel</v-btn>
146 <v-btn 126 <v-btn
147 round 127 round
148 dark 128 dark
149 :loading="loading" 129 :loading="loading"
150 class="reply-btn" 130 class="reply-btn"
151 @click="replyThreadDiscussion()" 131 @click="replyThreadDiscussion()"
152 >Submit</v-btn> 132 >Submit</v-btn>
153 </v-flex> 133 </v-flex>
154 <v-flex 134 <v-flex
155 xs12 135 xs12
156 class="mt-4 pl-5 mx-auto" 136 class="mt-4 pl-5 mx-auto"
157 v-for="(replyThread,i) in annoucementData.discussionThread" 137 v-for="(replyThread,i) in annoucementData.discussionThread"
158 :key="i" 138 :key="i"
159 > 139 >
160 <v-card class="elevation-0 grey lighten-3" flat> 140 <v-card class="elevation-0 grey lighten-3" flat>
161 <v-list two-line subheader class="grey lighten-3 pa-1"> 141 <v-list two-line subheader class="grey lighten-3 pa-1">
162 <v-list-tile> 142 <v-list-tile>
163 <v-list-tile-avatar> 143 <v-list-tile-avatar>
164 <v-avatar size="46"> 144 <v-avatar size="46">
165 <img 145 <img
166 :src="annoucementData.attachementUrl" 146 :src="annoucementData.attachementUrl"
167 v-if="annoucementData.attachementUrl" 147 v-if="annoucementData.attachementUrl"
168 /> 148 />
169 <img 149 <img
170 src="/static/icon/user.png" 150 src="/static/icon/user.png"
171 v-else-if="!annoucementData.attachementUrl" 151 v-else-if="!annoucementData.attachementUrl"
172 /> 152 />
173 </v-avatar> 153 </v-avatar>
174 </v-list-tile-avatar> 154 </v-list-tile-avatar>
175 <v-list-tile-content> 155 <v-list-tile-content>
176 <v-list-tile-title>Re: {{ annoucementData.discussionType }}</v-list-tile-title> 156 <v-list-tile-title>Re: {{ annoucementData.discussionType }}</v-list-tile-title>
177 <v-list-tile-sub-title> 157 <v-list-tile-sub-title>
178 By 158 By
179 <span 159 <span
180 class="info--text" 160 class="info--text"
181 v-if="replyThread.teacherId" 161 v-if="replyThread.teacherId"
182 >{{ replyThread.teacherId.name }}</span> 162 >{{ replyThread.teacherId.name }}</span>
183 <span 163 <span
184 class="info--text" 164 class="info--text"
185 v-if="replyThread.studentId" 165 v-if="replyThread.studentId"
186 >{{ replyThread.studentId.name }}</span> 166 >{{ replyThread.studentId.name }}</span>
187 - {{dates(replyThread.created ) }} 167 - {{dates(replyThread.created ) }}
188 </v-list-tile-sub-title> 168 </v-list-tile-sub-title>
189 </v-list-tile-content> 169 </v-list-tile-content>
190 </v-list-tile> 170 </v-list-tile>
191 </v-list> 171 </v-list>
192 <v-list class="pa-2 reply-desc"> 172 <v-list class="pa-2 reply-desc">
193 <v-list-tile-content> 173 <v-list-tile-content>
194 <v-list-tile-title 174 <v-list-tile-title
195 v-show="replyThread.showDescriptionReplyThread" 175 v-show="replyThread.showDescriptionReplyThread"
196 >{{ replyThread.description }}</v-list-tile-title> 176 >{{ replyThread.description }}</v-list-tile-title>
197 <v-flex 177 <v-flex
198 xs12 178 xs12
199 sm12 179 sm12
200 md4 180 md4
201 v-show="replyThread.showUpdateReplyThread == true" 181 v-show="replyThread.showUpdateReplyThread == true"
202 > 182 >
203 <v-text-field v-model="replyThread.description"></v-text-field> 183 <v-text-field v-model="replyThread.description"></v-text-field>
204 <v-btn 184 <v-btn
205 flat 185 flat
206 round 186 round
207 dark 187 dark
208 class="reply-btn right" 188 class="reply-btn right"
209 @click="updateRelpyThreadDiscussion(replyThread)" 189 @click="updateRelpyThreadDiscussion(replyThread)"
210 >Save</v-btn> 190 >Save</v-btn>
211 </v-flex> 191 </v-flex>
212 </v-list-tile-content> 192 </v-list-tile-content>
213 </v-list> 193 </v-list>
214 <v-list class="grey lighten-4 pa-0"> 194 <v-list class="grey lighten-4 pa-0">
215 <v-list-tile-action> 195 <v-list-tile-action>
216 <v-spacer></v-spacer> 196 <v-spacer></v-spacer>
217 <div 197 <div
218 v-if="replyThread.studentId && replyThread.studentId._id == localStorage.getItem('parentStudentId')" 198 v-if="replyThread.studentId && replyThread.studentId._id == localStorage.getItem('parentStudentId')"
219 > 199 >
220 <v-btn 200 <v-btn
221 flat 201 flat
222 round 202 round
223 dark 203 dark
224 class="reply-btn" 204 class="reply-btn"
225 @click="deleteRelpyThreadDiscussion(replyThread._id)" 205 @click="deleteRelpyThreadDiscussion(replyThread._id)"
226 >Delete</v-btn> 206 >Delete</v-btn>
227 <v-btn 207 <v-btn
228 flat 208 flat
229 round 209 round
230 dark 210 dark
231 class="reply-btn mr-4" 211 class="reply-btn mr-4"
232 @click="showUpdateReplyThreadDiscussion(replyThread)" 212 @click="showUpdateReplyThreadDiscussion(replyThread)"
233 >Edit</v-btn> 213 >Edit</v-btn>
234 </div> 214 </div>
235 </v-list-tile-action> 215 </v-list-tile-action>
236 </v-list> 216 </v-list>
237 </v-card> 217 </v-card>
238 </v-flex> 218 </v-flex>
239 </v-flex> 219 </v-flex>
240 </v-layout> 220 </v-layout>
241 </template> 221 </template>
242 222
243 <v-alert 223 <v-alert
244 slot="no-results" 224 slot="no-results"
245 :value="true" 225 :value="true"
246 color="error" 226 color="error"
247 icon="warning" 227 icon="warning"
248 >Your search for "{{ search }}" found no results.</v-alert> 228 >Your search for "{{ search }}" found no results.</v-alert>
249 </v-data-table> 229 </v-data-table>
250 </v-flex> 230 </v-flex>
251 </v-layout> 231 </v-layout>
252 </v-flex> 232 </v-flex>
253 233
254 <v-spacer></v-spacer> 234 <v-spacer></v-spacer>
255 235
256 <!-- COURSES - positioned to the right of the page --> 236 <!-- COURSES - positioned to the right of the page -->
257 <v-flex xs3> 237 <v-flex xs3>
258 <v-card class="elevation-0 card-border" height="100%"> 238 <v-card class="elevation-0 card-border" height="100%">
259 <v-container class="pt-0"> 239 <v-container class="pt-0">
260 <div class="side-bar-color font-weight-bold title">Courses</div> 240 <div class="side-bar-color font-weight-bold title">Courses</div>
261 241
262 <div v-for="(course,index) in courseData"> 242 <div v-for="(course,index) in courseData">
263 <v-btn 243 <v-btn
264 flat 244 flat
265 class="subheading text-xs-start justify-left" 245 class="subheading text-xs-start justify-left"
266 style="cursor: pointer;" 246 style="cursor: pointer;"
267 block 247 block
268 @click="routeToCourseDetails(course._id)" 248 @click="routeToCourseDetails(course._id)"
269 > 249 >
270 <div style="width: 100%;text-align: left;"> 250 <div style="width: 100%;text-align: left;">
271 <v-icon style="color: red;padding-bottom: 3px;" size="15">play_arrow</v-icon> 251 <v-icon style="color: red;padding-bottom: 3px;" size="15">play_arrow</v-icon>
272 {{course.courseName}} 252 {{course.courseName}}
273 </div> 253 </div>
274 </v-btn> 254 </v-btn>
275 </div> 255 </div>
276 </v-container> 256 </v-container>
277 </v-card> 257 </v-card>
278 </v-flex> 258 </v-flex>
279 </v-layout> 259 </v-layout>
280 </v-container> 260 </v-container>
281 </div> 261 </div>
282 </template> 262 </template>
283 <script> 263 <script>
284 import AllApiCalls from "@/Services/AllApiCalls.js"; 264 import AllApiCalls from "@/Services/AllApiCalls.js";
285 import http from "@/Services/http.js"; 265 import http from "@/Services/http.js";
286 import moment from "moment"; 266 import moment from "moment";
287 export default { 267 export default {
288 mixins: [AllApiCalls], 268 mixins: [AllApiCalls],
289 data() { 269 data() {
290 return { 270 return {
291 // DATA TABLE 271 // DATA TABLE
292 localStorage: localStorage, 272 localStorage: localStorage,
293 moment: moment, 273 moment: moment,
294 search: "", 274 search: "",
295 pagination: { 275 pagination: {
296 rowsPerPage: 10 276 rowsPerPage: 10
297 }, 277 },
298 announcementHeaders: [ 278 announcementHeaders: [
299 { 279 {
300 text: "Image", 280 text: "Image",
301 value: "attachementUrl", 281 value: "attachementUrl",
302 sortable: false, 282 sortable: false,
303 align: "center" 283 align: "center"
304 }, 284 },
305 { 285 {
306 text: "Discussion Type", 286 text: "Discussion Type",
307 value: "discussionType", 287 value: "discussionType",
308 sortable: false, 288 sortable: false,
309 align: "center" 289 align: "center"
310 }, 290 },
311 { text: "Action", value: "", sortable: false, align: "center" } 291 { text: "Action", value: "", sortable: false, align: "center" }
312 ], 292 ],
313 announcementsList: [], 293 announcementsList: [],
314 selectedAnnoucementId: "", 294 selectedAnnoucementId: "",
315 295
316 // COURSE ANNOUNCEMENTS REPLY FUNCTONALITY 296 // COURSE ANNOUNCEMENTS REPLY FUNCTONALITY
317 snackbar: false, 297 snackbar: false,
318 y: "top", 298 y: "top",
319 x: "right", 299 x: "right",
320 mode: "", 300 mode: "",
321 timeout: 3000, 301 timeout: 3000,
322 text: "", 302 text: "",
323 showLoader: false, 303 showLoader: false,
324 loading: false, 304 loading: false,
325 date: null, 305 date: null,
326 token: "", 306 token: "",
327 role: "", 307 role: "",
328 schoolRole: "", 308 schoolRole: "",
329 menu: false, 309 menu: false,
330 annoucementData: {}, 310 annoucementData: {},
331 showReplyBox: false, 311 showReplyBox: false,
332 replyDescription: "", 312 replyDescription: "",
333 loginId: "", 313 loginId: "",
334 editedIndex: -1 314 editedIndex: -1
335 }; 315 };
336 }, 316 },
337 methods: { 317 methods: {
338 getAnnoucementes() { 318 getAnnoucementes() {
339 this.showLoader = true; 319 this.showLoader = true;
340 http() 320 http()
341 .get("/getAnnoucementesList", { 321 .get("/getAnnoucementesList", {
342 params: { 322 params: {
343 courseId: this.$route.query.courseId, 323 courseId: this.$route.query.courseId,
344 classId: localStorage.getItem("parentClassId") 324 classId: localStorage.getItem("parentClassId")
345 } 325 }
346 }) 326 })
347 .then(response => { 327 .then(response => {
348 this.announcementsList = response.data.data; 328 this.announcementsList = response.data.data;
349 this.showLoader = false; 329 this.showLoader = false;
350 }) 330 })
351 .catch(err => { 331 .catch(err => {
352 console.log("err====>", err); 332 console.log("err====>", err);
353 this.showLoader = false; 333 this.showLoader = false;
354 }); 334 });
355 }, 335 },
356 336
357 async routeToCourseDetails(courseId) { 337 async routeToCourseDetails(courseId) {
358 /* getParticularCourseDetail- To get courseDetail - defined in GetApis.js*/ 338 /* getParticularCourseDetail- To get courseDetail - defined in GetApis.js*/
359 let response = await this.getParticularCourseDetail(courseId); 339 let response = await this.getParticularCourseDetail(courseId);
360 340
361 /* If the response is null then dont route */ 341 /* If the response is null then dont route */
362 if (response.data.data.length > 0) { 342 if (response.data.data.length > 0) {
363 this.$router.push({ 343 this.$router.push({
364 name: "Course Details", 344 name: "Course Details",
365 query: { courseId: courseId } 345 query: { courseId: courseId }
366 }); 346 });
367 } else { 347 } else {
368 this.seeSnackbar("No Data Available", "warning"); 348 this.seeSnackbar("No Data Available", "warning");
369 } 349 }
370 }, 350 },
371 351
372 // COURSE ANNOUNCEMENTS REPLY FUNCTONALITY 352 // COURSE ANNOUNCEMENTS REPLY FUNCTONALITY
373 dates: function(date) { 353 dates: function(date) {
374 return moment(date).format("MMMM DD, YYYY hh:mm A"); 354 return moment(date).format("MMMM DD, YYYY hh:mm A");
375 }, 355 },
376 getDiscussionesThread() { 356 getDiscussionesThread() {
377 // console.log("id", this.getSelectedData.courseId); 357 // console.log("id", this.getSelectedData.courseId);
378 this.showLoader = true; 358 this.showLoader = true;
379 http() 359 http()
380 .get("/getParticularAnnoucement", { 360 .get("/getParticularAnnoucement", {
381 params: { 361 params: {
382 annoucementId: this.selectedAnnoucementId 362 annoucementId: this.selectedAnnoucementId
383 } 363 }
384 }) 364 })
385 .then(response => { 365 .then(response => {
386 // console.log("response", response.data.data); 366 // console.log("response", response.data.data);
387 this.annoucementData = response.data.data; 367 this.annoucementData = response.data.data;
388 // console.log("response", this.annoucementData); 368 // console.log("response", this.annoucementData);
389 for (let i = 0; i < this.annoucementData.length; i++) { 369 for (let i = 0; i < this.annoucementData.length; i++) {
390 for ( 370 for (
391 let j = 0; 371 let j = 0;
392 j < this.annoucementData[i].discussionThread.length; 372 j < this.annoucementData[i].discussionThread.length;
393 j++ 373 j++
394 ) { 374 ) {
395 if (this.annoucementData[i].discussionThread[j]) { 375 if (this.annoucementData[i].discussionThread[j]) {
396 this.annoucementData[i].discussionThread[ 376 this.annoucementData[i].discussionThread[
397 j 377 j
398 ].showUpdateReplyThread = false; 378 ].showUpdateReplyThread = false;
399 this.annoucementData[i].discussionThread[ 379 this.annoucementData[i].discussionThread[
400 j 380 j
401 ].showDescriptionReplyThread = true; 381 ].showDescriptionReplyThread = true;
402 } 382 }
403 } 383 }
404 } 384 }
405 this.showLoader = false; 385 this.showLoader = false;
406 this.showReplyBox = false; 386 this.showReplyBox = false;
407 }) 387 })
408 .catch(error => { 388 .catch(error => {
409 console.log("err====>", error); 389 console.log("err====>", error);
410 this.showLoader = false; 390 this.showLoader = false;
411 }); 391 });
412 }, 392 },
413 replyThreadDiscussion() { 393 replyThreadDiscussion() {
414 this.showLoader = true; 394 this.showLoader = true;
415 var payloadData = { 395 var payloadData = {
416 annoucementId: this.selectedAnnoucementId, 396 annoucementId: this.selectedAnnoucementId,
417 studentId: localStorage.getItem("parentStudentId"), 397 studentId: localStorage.getItem("parentStudentId"),
418 description: this.replyDescription 398 description: this.replyDescription
419 }; 399 };
420 http() 400 http()
421 .put("/replyThread", payloadData) 401 .put("/replyThread", payloadData)
422 .then(response => { 402 .then(response => {
423 this.showLoader = false; 403 this.showLoader = false;
424 this.getDiscussionesThread(); 404 this.getDiscussionesThread();
425 }) 405 })
426 .catch(error => { 406 .catch(error => {
427 this.showLoader = false; 407 this.showLoader = false;
428 }); 408 });
429 }, 409 },
430 showUpdateReplyThreadDiscussion(item) { 410 showUpdateReplyThreadDiscussion(item) {
431 this.editedIndex = this.annoucementData.indexOf(item); 411 this.editedIndex = this.annoucementData.indexOf(item);
432 var editedItem = Object.assign({}, item); 412 var editedItem = Object.assign({}, item);
433 var arrayOfannoucementData = []; 413 var arrayOfannoucementData = [];
434 for (let i = 0; i < this.annoucementData.length; i++) { 414 for (let i = 0; i < this.annoucementData.length; i++) {
435 for ( 415 for (
436 let j = 0; 416 let j = 0;
437 j < this.annoucementData[i].discussionThread.length; 417 j < this.annoucementData[i].discussionThread.length;
438 j++ 418 j++
439 ) { 419 ) {
440 if ( 420 if (
441 editedItem._id == this.annoucementData[i].discussionThread[j]._id 421 editedItem._id == this.annoucementData[i].discussionThread[j]._id
442 ) { 422 ) {
443 this.annoucementData[i].discussionThread[ 423 this.annoucementData[i].discussionThread[
444 j 424 j
445 ].showUpdateReplyThread = true; 425 ].showUpdateReplyThread = true;
446 this.annoucementData[i].discussionThread[ 426 this.annoucementData[i].discussionThread[
447 j 427 j
448 ].showDescriptionReplyThread = false; 428 ].showDescriptionReplyThread = false;
449 } 429 }
450 } 430 }
451 arrayOfannoucementData.push(this.annoucementData[i]); 431 arrayOfannoucementData.push(this.annoucementData[i]);
452 } 432 }
453 this.annoucementData = arrayOfannoucementData; 433 this.annoucementData = arrayOfannoucementData;
454 }, 434 },
455 updateRelpyThreadDiscussion(replyThread) { 435 updateRelpyThreadDiscussion(replyThread) {
456 this.showLoader = true; 436 this.showLoader = true;
457 var payloadData = { 437 var payloadData = {
458 discussionThreadId: replyThread._id, 438 discussionThreadId: replyThread._id,
459 annoucementId: this.selectedAnnoucementId, 439 annoucementId: this.selectedAnnoucementId,
460 studentId: localStorage.getItem("parentStudentId"), 440 studentId: localStorage.getItem("parentStudentId"),
461 description: replyThread.description 441 description: replyThread.description
462 }; 442 };
463 http() 443 http()
464 .put("/updateThread", payloadData) 444 .put("/updateThread", payloadData)
465 .then(response => { 445 .then(response => {
466 this.showLoader = false; 446 this.showLoader = false;
467 this.getDiscussionesThread(); 447 this.getDiscussionesThread();
468 }) 448 })
469 .catch(error => { 449 .catch(error => {
470 this.showLoader = false; 450 this.showLoader = false;
471 }); 451 });
472 }, 452 },
473 deleteRelpyThreadDiscussion(id) { 453 deleteRelpyThreadDiscussion(id) {
474 this.showLoader = true; 454 this.showLoader = true;
475 var payloadData = { 455 var payloadData = {
476 discussionThreadId: id, 456 discussionThreadId: id,
477 annoucementId: this.selectedAnnoucementId 457 annoucementId: this.selectedAnnoucementId
478 }; 458 };
479 http() 459 http()
480 .put( 460 .put(
481 "/deleteThread", 461 "/deleteThread",
482 confirm("Are you sure you want to delete this?") && payloadData 462 confirm("Are you sure you want to delete this?") && payloadData
483 ) 463 )
484 .then(response => { 464 .then(response => {
485 this.showLoader = false; 465 this.showLoader = false;
486 this.getDiscussionesThread(); 466 this.getDiscussionesThread();
487 }) 467 })
488 .catch(error => { 468 .catch(error => {
489 this.showLoader = false; 469 this.showLoader = false;
490 }); 470 });
491 } 471 }
492 }, 472 },
493 async created() { 473 async created() {
494 /* getStudentCourses - to get courseData - defined in GetApis.js*/ 474 /* getStudentCourses - to get courseData - defined in GetApis.js*/
495 await this.getStudentCourses({ 475 await this.getStudentCourses({
496 classId: localStorage.getItem("parentClassId"), 476 classId: localStorage.getItem("parentClassId"),
497 studentId: localStorage.getItem("parentStudentId") 477 studentId: localStorage.getItem("parentStudentId")
498 }); 478 });
499 479
500 /* getAnnoucementesList - to populate the data table */ 480 /* getAnnoucementesList - to populate the data table */
501 this.getAnnoucementes(); 481 this.getAnnoucementes();
502 } 482 }
503 }; 483 };
504 </script> 484 </script>
505 <style scoped> 485 <style scoped>
506 .side-bar-color { 486 .side-bar-color {
507 color: #827bfa !important; 487 color: #827bfa !important;
508 /* border-top-right-radius: 74px !important; */ 488 /* border-top-right-radius: 74px !important; */
509 } 489 }
510 .card-border { 490 .card-border {
511 border: 1px #bdbdbd solid; 491 border: 1px #bdbdbd solid;
512 border-radius: 3px; 492 border-radius: 3px;
513 } 493 }
514 494
515 /* ANNOUNCEMENTS REPLY FUNCTIONALITY */ 495 /* ANNOUNCEMENTS REPLY FUNCTIONALITY */
516 .reply-desc { 496 .reply-desc {
517 border: 1px solid #f2f2f2; 497 border: 1px solid #f2f2f2;
518 } 498 }
519 .open-dialog-button { 499 .open-dialog-button {
520 background: #827bfa !important; 500 background: #827bfa !important;
521 border-color: #827bfa !important; 501 border-color: #827bfa !important;
522 text-transform: none !important; 502 text-transform: none !important;
523 } 503 }
524 504
525 .reply-btn { 505 .reply-btn {
526 background: #feb83c !important; 506 background: #feb83c !important;
527 border-color: #feb83c !important; 507 border-color: #feb83c !important;
528 text-transform: none !important; 508 text-transform: none !important;
529 -webkit-box-shadow: none !important; 509 -webkit-box-shadow: none !important;
530 box-shadow: none !important; 510 box-shadow: none !important;
531 } 511 }
532 </style> 512 </style>