viithiisys / School-Management-dashboard

Download as
Browse Code ยป

Commit e659e774fe39f99d22ea69d061e1a71b1b412da5

Authored by Shikha Mishra
1 parent b5fb2daea3
Exists in master and in 1 other branch ui-design

integrate updateLiveClass API

Showing 1 changed file with 20 additions and 2 deletions   Show diff stats
src/pages/Dashboard/LiveOnlineClass.vue
Diff comments   View file @e659e77
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 wrap class="mt-1"> 23 <v-layout row wrap class="mt-1">
24 <!-- if logged in user is parent --> 24 <!-- if logged in user is parent -->
25 <v-flex xs12 sm12 md9 v-if=" $store.state.role === 'PARENT' "> 25 <v-flex xs12 sm12 md9 v-if=" $store.state.role === 'PARENT' ">
26 <v-layout column> 26 <v-layout column>
27 <!-- HEADING --> 27 <!-- HEADING -->
28 <v-flex> 28 <v-flex>
29 <div 29 <div
30 class="title side-bar-color font-weight-bold" 30 class="title side-bar-color font-weight-bold"
31 >Live Online Classes - {{$route.query.chapterName}}</div> 31 >Live Online Classes - {{$route.query.chapterName}}</div>
32 <!-- <div class="subheading grey--text lighten-1">{{liveLink}}</div> --> 32 <!-- <div class="subheading grey--text lighten-1">{{liveLink}}</div> -->
33 <!-- <div 33 <!-- <div
34 class="subheading grey--text lighten-1" 34 class="subheading grey--text lighten-1"
35 >The session started at 1:00 there is 1 moderator</div>--> 35 >The session started at 1:00 there is 1 moderator</div>-->
36 </v-flex> 36 </v-flex>
37 37
38 <!-- JOIN OR END SESSION --> 38 <!-- JOIN OR END SESSION -->
39 <v-flex v-if="showJoinSessionButton"> 39 <v-flex v-if="showJoinSessionButton">
40 <div> 40 <div>
41 <v-btn 41 <v-btn
42 round 42 round
43 class="open-dialog-button" 43 class="open-dialog-button"
44 dark 44 dark
45 v-if="studentBtn" 45 v-if="studentBtn"
46 @click="showLoader = true;startChat();" 46 @click="showLoader = true;startChat();"
47 >{{studentBtn}}</v-btn> 47 >{{studentBtn}}</v-btn>
48 <span class="subheading grey--twxt lighten-1" v-else>Session hasnt started yet</span> 48 <span class="subheading grey--twxt lighten-1" v-else>Session hasn't started yet</span>
49 </div> 49 </div>
50 </v-flex> 50 </v-flex>
51 <v-flex id="studentClone"> 51 <v-flex id="studentClone">
52 <div id="jitsi-container"></div> 52 <div id="jitsi-container"></div>
53 </v-flex> 53 </v-flex>
54 </v-layout> 54 </v-layout>
55 </v-flex> 55 </v-flex>
56 56
57 <!-- if logged in user is teacher --> 57 <!-- if logged in user is teacher -->
58 <v-flex xs12 sm12 md12 v-else> 58 <v-flex xs12 sm12 md12 v-else>
59 <v-layout column> 59 <v-layout column>
60 <!-- HEADING --> 60 <!-- HEADING -->
61 <v-flex> 61 <v-flex>
62 <div 62 <div
63 class="title side-bar-color font-weight-bold" 63 class="title side-bar-color font-weight-bold"
64 >Live Online Classes - {{$route.query.chapterName}}</div> 64 >Live Online Classes - {{$route.query.chapterName}}</div>
65 <!-- <div class="subheading grey--text lighten-1"></div> --> 65 <!-- <div class="subheading grey--text lighten-1"></div> -->
66 <!-- <div 66 <!-- <div
67 class="subheading grey--text lighten-1" 67 class="subheading grey--text lighten-1"
68 >The session started at 1:00 there is 1 moderator</div>--> 68 >The session started at 1:00 there is 1 moderator</div>-->
69 </v-flex> 69 </v-flex>
70 70
71 <!-- JOIN OR END SESSION --> 71 <!-- JOIN OR END SESSION -->
72 <v-flex v-if="showStartSessionButton"> 72 <v-flex v-if="showStartSessionButton">
73 <div> 73 <div>
74 <v-btn 74 <v-btn
75 round 75 round
76 class="open-dialog-button" 76 class="open-dialog-button"
77 dark 77 dark
78 @click="showLoader = true;startChat()" 78 @click="showLoader = true;startChat()"
79 >Start Session</v-btn> 79 >Start Session</v-btn>
80 </div> 80 </div>
81 </v-flex> 81 </v-flex>
82 <v-flex id="teacherClone"> 82 <v-flex id="teacherClone">
83 <div id="jitsi-container"></div> 83 <div id="jitsi-container"></div>
84 </v-flex> 84 </v-flex>
85 </v-layout> 85 </v-layout>
86 </v-flex> 86 </v-flex>
87 87
88 <v-spacer></v-spacer> 88 <v-spacer></v-spacer>
89 89
90 <!-- COURSES SIDE BAR- positioned to the right of the page --> 90 <!-- COURSES SIDE BAR- positioned to the right of the page -->
91 <!-- <v-flex xs3> 91 <!-- <v-flex xs3>
92 <v-card class="elevation-0 card-border" height="100%"> 92 <v-card class="elevation-0 card-border" height="100%">
93 <CoursesSideBar></CoursesSideBar> 93 <CoursesSideBar></CoursesSideBar>
94 </v-card> 94 </v-card>
95 </v-flex>--> 95 </v-flex>-->
96 </v-layout> 96 </v-layout>
97 </v-container> 97 </v-container>
98 </div> 98 </div>
99 </template> 99 </template>
100 <script> 100 <script>
101 import AllApiCalls from "@/Services/AllApiCalls.js"; 101 import AllApiCalls from "@/Services/AllApiCalls.js";
102 import http from "@/Services/http.js"; 102 import http from "@/Services/http.js";
103 import moment from "moment"; 103 import moment from "moment";
104 import Meet from "@/pages/Meet/meet.vue"; 104 import Meet from "@/pages/Meet/meet.vue";
105 import CoursesSideBar from "@/pages/Common/CoursesSideBar.vue"; 105 import CoursesSideBar from "@/pages/Common/CoursesSideBar.vue";
106 export default { 106 export default {
107 mixins: [AllApiCalls], 107 mixins: [AllApiCalls],
108 components: { 108 components: {
109 CoursesSideBar, 109 CoursesSideBar,
110 }, 110 },
111 data() { 111 data() {
112 return { 112 return {
113 startLiveSession: "", 113 startLiveSession: "",
114 studentBtn: "", 114 studentBtn: "",
115 115
116 // DATA TABLE 116 // DATA TABLE
117 search: "", 117 search: "",
118 pagination: { 118 pagination: {
119 rowsPerPage: 10, 119 rowsPerPage: 10,
120 }, 120 },
121 liveOnlineHeaders: [ 121 liveOnlineHeaders: [
122 { 122 {
123 text: "Playback", 123 text: "Playback",
124 value: "attachementUrl", 124 value: "attachementUrl",
125 sortable: false, 125 sortable: false,
126 align: "center", 126 align: "center",
127 }, 127 },
128 { 128 {
129 text: "Meeting", 129 text: "Meeting",
130 align: "center", 130 align: "center",
131 sortable: false, 131 sortable: false,
132 value: "", 132 value: "",
133 }, 133 },
134 { 134 {
135 text: "Recording", 135 text: "Recording",
136 value: "", 136 value: "",
137 sortable: false, 137 sortable: false,
138 align: "center", 138 align: "center",
139 }, 139 },
140 { 140 {
141 text: "Description Preview", 141 text: "Description Preview",
142 value: "", 142 value: "",
143 sortable: false, 143 sortable: false,
144 align: "center", 144 align: "center",
145 }, 145 },
146 { text: "Date", value: "", sortable: false, align: "center" }, 146 { text: "Date", value: "", sortable: false, align: "center" },
147 { text: "Duration", value: "", sortable: false, align: "center" }, 147 { text: "Duration", value: "", sortable: false, align: "center" },
148 { text: "Toolbar", value: "", sortable: false, align: "center" }, 148 { text: "Toolbar", value: "", sortable: false, align: "center" },
149 ], 149 ],
150 liveOnlineItems: [], 150 liveOnlineItems: [],
151 151
152 // JITSI CONTAINER 152 // JITSI CONTAINER
153 liveLink: "", 153 liveLink: "",
154 token: "", 154 token: "",
155 selectStudents: {}, 155 selectStudents: {},
156 classRules: [(v) => !!v || " Class Name is required"], 156 classRules: [(v) => !!v || " Class Name is required"],
157 sectionRules: [(v) => !!v || " Section Name is required"], 157 sectionRules: [(v) => !!v || " Section Name is required"],
158 addclass: [], 158 addclass: [],
159 addSection: [], 159 addSection: [],
160 loading: false, 160 loading: false,
161 room: "", 161 room: "",
162 username: "", 162 username: "",
163 roomPassword: "", 163 roomPassword: "",
164 counter: 0, 164 // counter: 0,
165 appLink: "", 165 appLink: "",
166 showStartSessionButton: true, 166 showStartSessionButton: true,
167 showJoinSessionButton: true, 167 showJoinSessionButton: true,
168 }; 168 };
169 }, 169 },
170 methods: { 170 methods: {
171 async startChat() { 171 async startChat() {
172 if (this.$store.state.role === "PARENT") { 172 if (this.$store.state.role === "PARENT") {
173 // if (this.counter == 0) { 173 // if (this.counter == 0) {
174 // console.log("enter start chat"); 174 // console.log("enter start chat");
175 const isMobile = /iPhone|iPad|iPod|Android/i.test(navigator.userAgent); 175 const isMobile = /iPhone|iPad|iPod|Android/i.test(navigator.userAgent);
176 if (isMobile) { 176 if (isMobile) {
177 window.open(this.appLink); 177 window.open(this.appLink);
178 this.showLoader = false; 178 this.showLoader = false;
179 } else { 179 } else {
180 this.startConference(); 180 this.startConference();
181 // this.counter += 1; 181 // this.counter += 1;
182 this.showJoinSessionButton = false; 182 this.showJoinSessionButton = false;
183 } 183 }
184 // } 184 // }
185 } 185 }
186 if (this.$store.state.role === "TEACHER") { 186 if (this.$store.state.role === "TEACHER") {
187 // if (this.counter == 0) { 187 // if (this.counter == 0) {
188 this.createRoom(); 188 this.createRoom();
189 // this.counter += 1; 189 // this.counter += 1;
190 // } 190 // }
191 } 191 }
192 }, 192 },
193 // JITSI CONTAINER 193 // JITSI CONTAINER
194 startConference() { 194 startConference() {
195 // console.log("yes session started"); 195 // console.log("yes session started");
196 var _this = this; 196 var _this = this;
197 try { 197 try {
198 const domain = "meet.intrack.in"; 198 const domain = "meet.intrack.in";
199 const options = { 199 const options = {
200 audioInput: "<deviceLabel>", 200 audioInput: "<deviceLabel>",
201 audioOutput: "<deviceLabel>", 201 audioOutput: "<deviceLabel>",
202 videoInput: "<deviceLabel>", 202 videoInput: "<deviceLabel>",
203 prejoinPageEnabled: false, 203 prejoinPageEnabled: false,
204 roomName: this.room, 204 roomName: this.room,
205 height: 500, 205 height: 500,
206 parentNode: document.getElementById("jitsi-container"), 206 parentNode: document.getElementById("jitsi-container"),
207 interfaceConfigOverwrite: { 207 interfaceConfigOverwrite: {
208 filmStripOnly: false, 208 filmStripOnly: false,
209 SHOW_PROMOTIONAL_CLOSE_PAGE: false, 209 SHOW_PROMOTIONAL_CLOSE_PAGE: false,
210 SHOW_POWERED_BY: false, 210 SHOW_POWERED_BY: false,
211 SHOW_JITSI_WATERMARK: false, 211 SHOW_JITSI_WATERMARK: false,
212 TOOLBAR_BUTTONS: [ 212 TOOLBAR_BUTTONS: [
213 "microphone", 213 "microphone",
214 "camera", 214 "camera",
215 "closedcaptions", 215 "closedcaptions",
216 "desktop", 216 "desktop",
217 "fullscreen", 217 "fullscreen",
218 "fodeviceselection", 218 "fodeviceselection",
219 "hangup", 219 "hangup",
220 "profile", 220 "profile",
221 "info", 221 "info",
222 "chat", 222 "chat",
223 "recording", 223 "recording",
224 "livestreaming", 224 "livestreaming",
225 "etherpad", 225 "etherpad",
226 "sharedvideo", 226 "sharedvideo",
227 "settings", 227 "settings",
228 "raisehand", 228 "raisehand",
229 "videoquality", 229 "videoquality",
230 "filmstrip", 230 "filmstrip",
231 "invite", 231 "invite",
232 "feedback", 232 "feedback",
233 "stats", 233 "stats",
234 "shortcuts", 234 "shortcuts",
235 "tileview", 235 "tileview",
236 ], 236 ],
237 }, 237 },
238 configOverwrite: { 238 configOverwrite: {
239 disableSimulcast: false, 239 disableSimulcast: false,
240 }, 240 },
241 teacherName: "", 241 teacherName: "",
242 room: "", 242 room: "",
243 }; 243 };
244 _this.api = new JitsiMeetExternalAPI(domain, options); 244 _this.api = new JitsiMeetExternalAPI(domain, options);
245 // console.log("this.api ", this.api); 245 // console.log("this.api ", this.api);
246 _this.api.addEventListener("videoConferenceJoined", () => { 246 _this.api.addEventListener("videoConferenceJoined", () => {
247 this.showLoader = false; 247 this.showLoader = false;
248 setTimeout(() => { 248 setTimeout(() => {
249 _this.api.executeCommand("displayName", _this.username); 249 _this.api.executeCommand("displayName", _this.username);
250 _this.api.executeCommand("password", _this.roomPassword); 250 _this.api.executeCommand("password", _this.roomPassword);
251 }, 1000); 251 }, 1000);
252 }); 252 });
253 253
254 _this.api.on("passwordRequired", () => { 254 _this.api.on("passwordRequired", () => {
255 _this.api.executeCommand("password", _this.roomPassword); 255 _this.api.executeCommand("password", _this.roomPassword);
256 }); 256 });
257 257
258 _this.api.on("readyToClose", () => { 258 _this.api.on("readyToClose", () => {
259 // this.$router.push({ name: "Refresh" }); 259 // this.$router.push({ name: "Refresh" });
260 let jitsi = document.getElementById("jitsi-container"); 260 let jitsi = document.getElementById("jitsi-container");
261 jitsi.innerHTML = ""; 261 jitsi.innerHTML = "";
262 this.showStartSessionButton = true; 262 this.showStartSessionButton = true;
263 this.showJoinSessionButton = true; 263 this.showJoinSessionButton = true;
264 if (this.$store.state.role === "TEACHER") {
265 this.updateLiveClass();
266 }
264 }); 267 });
265 } catch (error) { 268 } catch (error) {
266 // console.error("Failed to load Jitsi API", error); 269 // console.error("Failed to load Jitsi API", error);
267 } 270 }
268 }, 271 },
269 openRoom() { 272 openRoom() {
270 // verify the JitsiMeetExternalAPI constructor is added to the global.. 273 // verify the JitsiMeetExternalAPI constructor is added to the global..
271 // if (this.teacherName != "" || this.room != "") { 274 // if (this.teacherName != "" || this.room != "") {
272 // if (window.JitsiMeetExternalAPI) { 275 // if (window.JitsiMeetExternalAPI) {
273 // // var person = prompt("Please enter your name:", "Rabie"); 276 // // var person = prompt("Please enter your name:", "Rabie");
274 // if (person != null || person != "") this.username = this.teacherName; 277 // if (person != null || person != "") this.username = this.teacherName;
275 // var room = prompt("Please enter your room:", "Test Room"); 278 // var room = prompt("Please enter your room:", "Test Room");
276 // if (room != null || room != "") this.room = this.room; 279 // if (room != null || room != "") this.room = this.room;
277 // this.startConference(); 280 // this.startConference();
278 // } else alert("Jitsi Meet API script not loaded"); 281 // } else alert("Jitsi Meet API script not loaded");
279 // } 282 // }
280 }, 283 },
281 284
282 createRoom(classId) { 285 createRoom(classId) {
283 // this.showLoader = true; 286 // this.showLoader = true;
284 var classId = { 287 var classId = {
285 classId: classId, 288 classId: classId,
286 }; 289 };
287 http() 290 http()
288 .post("/createLiveClasses", { 291 .post("/createLiveClasses", {
289 classId: this.$route.query.classId, 292 classId: this.$route.query.classId,
290 courseId: this.$route.query.courseId, 293 courseId: this.$route.query.courseId,
291 chapterId: this.$route.query.chapterId, 294 chapterId: this.$route.query.chapterId,
292 }) 295 })
293 .then((response) => { 296 .then((response) => {
294 // this.addSection = response.data.data; 297 // this.addSection = response.data.data;
295 // console.log("CREATE___ROOOM", response.data); 298 // console.log("CREATE___ROOOM", response.data);
296 var room = response.data.data.roomName; 299 var room = response.data.data.roomName;
297 var username = localStorage.getItem("teacherName"); 300 var username = localStorage.getItem("teacherName");
298 var roomPassword = response.data.data.password; 301 var roomPassword = response.data.data.password;
299 this.appLink = response.data.data.appLink; 302 this.appLink = response.data.data.appLink;
303 this.liveClassId = response.data.data._id;
300 // console.log( 304 // console.log(
301 // "room", 305 // "room",
302 // room, 306 // room,
303 // "username", 307 // "username",
304 // username, 308 // username,
305 // "roomPassword", 309 // "roomPassword",
306 // roomPassword 310 // roomPassword
307 // ); 311 // );
308 var this_ = this; 312 var this_ = this;
309 if (username != "" || room != "") { 313 if (username != "" || room != "") {
310 const isMobile = /iPhone|iPad|iPod|Android/i.test( 314 const isMobile = /iPhone|iPad|iPod|Android/i.test(
311 navigator.userAgent 315 navigator.userAgent
312 ); 316 );
313 if (isMobile) { 317 if (isMobile) {
314 // console.log("==TEACHER=appLink==", this.appLink); 318 // console.log("==TEACHER=appLink==", this.appLink);
315 window.open(this.appLink); 319 window.open(this.appLink);
316 this.showLoader = false; 320 this.showLoader = false;
317 this.showStartSessionButton = false; 321 this.showStartSessionButton = false;
318 } else { 322 } else {
319 if (window.JitsiMeetExternalAPI) { 323 if (window.JitsiMeetExternalAPI) {
320 // var person = prompt("Please enter your name:", "Rabie"); 324 // var person = prompt("Please enter your name:", "Rabie");
321 if (username != null || username != "") { 325 if (username != null || username != "") {
322 this_.username = username; 326 this_.username = username;
323 } 327 }
324 // var room = prompt("Please enter your room:", "Test Room"); 328 // var room = prompt("Please enter your room:", "Test Room");
325 if (room != null || room != "") { 329 if (room != null || room != "") {
326 this_.room = room; 330 this_.room = room;
327 } 331 }
328 if (roomPassword != null || roomPassword != "") { 332 if (roomPassword != null || roomPassword != "") {
329 this_.roomPassword = roomPassword; 333 this_.roomPassword = roomPassword;
330 } 334 }
331 } else alert("Jitsi Meet API script not loaded"); 335 } else alert("Jitsi Meet API script not loaded");
332 this_.startConference(); 336 this_.startConference();
333 this.showStartSessionButton = false; 337 this.showStartSessionButton = false;
334 } 338 }
335 } 339 }
336 }) 340 })
337 .catch((err) => { 341 .catch((err) => {
338 this.showLoader = false; 342 this.showLoader = false;
339 }); 343 });
340 }, 344 },
345 updateLiveClass() {
346 this.showLoader = true;
347 var payloadData = {
348 liveClassesId: this.liveClassId,
349 };
350 http()
351 .put("/updateLiveClasses", payloadData)
352 .then((response) => {
353 this.showLoader = false;
354 })
355 .catch((error) => {
356 this.showLoader = false;
357 });
358 },
341 async studentClasses() { 359 async studentClasses() {
342 this.liveLink = ""; 360 this.liveLink = "";
343 this.room = ""; 361 this.room = "";
344 this.username = ""; 362 this.username = "";
345 this.roomPassword = ""; 363 this.roomPassword = "";
346 /* getLiveClassesesList - To up date line under heading*/ 364 /* getLiveClassesesList - To up date line under heading*/
347 let response = await this.getLiveClassesesList({ 365 let response = await this.getLiveClassesesList({
348 classId: this.$route.query.classId, 366 classId: this.$route.query.classId,
349 courseId: this.$route.query.courseId, 367 courseId: this.$route.query.courseId,
350 chapterId: this.$route.query.chapterId, 368 chapterId: this.$route.query.chapterId,
351 }); 369 });
352 // console.log("response getLiveClassesesList- ", response); 370 // console.log("response getLiveClassesesList- ", response);
353 371
354 /* CHECK RESPONSE TO ASSIGN MESSAGE INSIDE BUTTON */ 372 /* CHECK RESPONSE TO ASSIGN MESSAGE INSIDE BUTTON */
355 if (response.data.data[0].sessionStatus == "ENDED") { 373 if (response.data.data[0].sessionStatus == "ENDED") {
356 // this.startLiveSession = "Start Session"; 374 // this.startLiveSession = "Start Session";
357 this.studentBtn = ""; 375 this.studentBtn = "";
358 } 376 }
359 if (response.data.data[0].sessionStatus == "STARTED") { 377 if (response.data.data[0].sessionStatus == "STARTED") {
360 // this.startLiveSession = "Join Session"; 378 // this.startLiveSession = "Join Session";
361 this.studentBtn = "Join Session"; 379 this.studentBtn = "Join Session";
362 } 380 }
363 if (response.data.data.length == 0) { 381 if (response.data.data.length == 0) {
364 this.startLiveSession = "Start Session"; 382 this.startLiveSession = "Start Session";
365 this.studentBtn = ""; 383 this.studentBtn = "";
366 } else { 384 } else {
367 this.liveLink = response.data.data[0].link; 385 this.liveLink = response.data.data[0].link;
368 this.appLink = response.data.data[0].appLink; 386 this.appLink = response.data.data[0].appLink;
369 var room = response.data.data[0].roomName; 387 var room = response.data.data[0].roomName;
370 var username = this.currentUser; 388 var username = this.currentUser;
371 var roomPassword = response.data.data[0].password; 389 var roomPassword = response.data.data[0].password;
372 var this_ = this; 390 var this_ = this;
373 // console.log(this.room, this.roomPassword, this.username); 391 // console.log(this.room, this.roomPassword, this.username);
374 392
375 if (username != "" || room != "") { 393 if (username != "" || room != "") {
376 if (window.JitsiMeetExternalAPI) { 394 if (window.JitsiMeetExternalAPI) {
377 // var person = prompt("Please enter your name:", "Rabie"); 395 // var person = prompt("Please enter your name:", "Rabie");
378 if (username != null || username != "") { 396 if (username != null || username != "") {
379 this_.username = username; 397 this_.username = username;
380 } 398 }
381 if (roomPassword != null || roomPassword != "") { 399 if (roomPassword != null || roomPassword != "") {
382 this_.roomPassword = roomPassword; 400 this_.roomPassword = roomPassword;
383 } 401 }
384 // var room = prompt("Please enter your room:", "Test Room"); 402 // var room = prompt("Please enter your room:", "Test Room");
385 if (room != null || room != "") { 403 if (room != null || room != "") {
386 this_.room = room; 404 this_.room = room;
387 } 405 }
388 // this.startConference(); 406 // this.startConference();
389 } 407 }
390 } 408 }
391 } 409 }
392 }, 410 },
393 }, 411 },
394 412
395 async created() { 413 async created() {
396 // console.log( 414 // console.log(
397 // "this.$store.state.studentsData", 415 // "this.$store.state.studentsData",
398 // this.$store.state.studentsData[0].name 416 // this.$store.state.studentsData[0].name
399 // ); 417 // );
400 this.currentUser = localStorage.getItem("studentName"); 418 this.currentUser = localStorage.getItem("studentName");
401 this.token = this.$store.state.token; 419 this.token = this.$store.state.token;
402 if (this.$store.state.role === "PARENT") { 420 if (this.$store.state.role === "PARENT") {
403 await this.studentClasses(); 421 await this.studentClasses();
404 } 422 }
405 423
406 /* getStudentCourses - to get courseData - defined in GetApis.js*/ 424 /* getStudentCourses - to get courseData - defined in GetApis.js*/
407 if (this.$store.state.role === "PARENT") { 425 if (this.$store.state.role === "PARENT") {
408 await this.getStudentCourses({ 426 await this.getStudentCourses({
409 classId: localStorage.getItem("parentClassId"), 427 classId: localStorage.getItem("parentClassId"),
410 studentId: localStorage.getItem("parentStudentId"), 428 studentId: localStorage.getItem("parentStudentId"),
411 }); 429 });
412 } 430 }
413 }, 431 },
414 }; 432 };
415 </script> 433 </script>
416 <style scoped> 434 <style scoped>
417 .side-bar-color { 435 .side-bar-color {
418 color: #827bfa !important; 436 color: #827bfa !important;
419 /* border-top-right-radius: 74px !important; */ 437 /* border-top-right-radius: 74px !important; */
420 } 438 }
421 .card-border { 439 .card-border {
422 border: 1px #bdbdbd solid; 440 border: 1px #bdbdbd solid;
423 border-radius: 3px; 441 border-radius: 3px;
424 } 442 }
425 .reply-desc { 443 .reply-desc {
426 border: 1px solid #f2f2f2; 444 border: 1px solid #f2f2f2;
427 } 445 }
428 .open-dialog-button { 446 .open-dialog-button {
429 background: #827bfa !important; 447 background: #827bfa !important;
430 border-color: #827bfa !important; 448 border-color: #827bfa !important;
431 text-transform: none !important; 449 text-transform: none !important;
432 } 450 }
433 451
434 .reply-btn { 452 .reply-btn {
435 background: #feb83c !important; 453 background: #feb83c !important;
436 border-color: #feb83c !important; 454 border-color: #feb83c !important;
437 text-transform: none !important; 455 text-transform: none !important;
438 -webkit-box-shadow: none !important; 456 -webkit-box-shadow: none !important;
439 box-shadow: none !important; 457 box-shadow: none !important;
440 } 458 }
441 #jitsi-container { 459 #jitsi-container {
442 height: 100vh; 460 height: 100vh;
443 } 461 }
444 </style> 462 </style>