viithiisys / School-Management-dashboard

Download as
Browse Code ยป

Commit 375b62cd152c034067e45999c349574c668fe6bc

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

added video for teacher

Showing 4 changed files with 108 additions and 78 deletions   Show diff stats
src/pages/Common/CoursesSideBar.vue
Diff comments   View file @375b62c
... ... @@ -22,7 +22,7 @@
22 22 <v-container class="pt-0">
23 23 <div class="side-bar-color font-weight-bold title">Courses</div>
24 24  
25   - <div v-for="(course,index) in courseData">
  25 + <div v-for="(course,index) in courseData" :key="index">
26 26 <v-btn
27 27 flat
28 28 class="subheading text-xs-start justify-left"
... ...
src/pages/Dashboard/ChapterInfo.vue
Diff comments   View file @375b62c
... ... @@ -20,7 +20,7 @@
20 20 </v-snackbar>
21 21  
22 22 <v-container class="pt-0">
23   - <v-layout row class="mt-1">
  23 + <v-layout row wrap class="mt-1">
24 24 <v-flex xs8>
25 25 <!-- CHAPTER INFO -->
26 26 <div class="title side-bar-color font-weight-bold">{{chapter.chapters[0].chapterName}}</div>
... ... @@ -102,7 +102,7 @@
102 102 <v-spacer></v-spacer>
103 103  
104 104 <!-- COURSES SIDE BAR- positioned to the right of the page -->
105   - <v-flex xs3>
  105 + <v-flex md3>
106 106 <v-card class="elevation-0 card-border" height="100%">
107 107 <CoursesSideBar></CoursesSideBar>
108 108 </v-card>
... ...
src/pages/Dashboard/CourseDetails.vue
Diff comments   View file @375b62c
... ... @@ -87,7 +87,7 @@
87 87 <v-container class="pt-0">
88 88 <div class="side-bar-color font-weight-bold title">Courses</div>
89 89  
90   - <div v-for="(course,index) in courseData">
  90 + <div v-for="(course,index) in courseData" :key="index">
91 91 <v-btn
92 92 flat
93 93 class="subheading text-xs-start justify-left"
... ...
src/pages/Dashboard/LiveOnlineClass.vue
Diff comments   View file @375b62c
... ... @@ -43,12 +43,12 @@
43 43 class="open-dialog-button"
44 44 dark
45 45 v-if="studentBtn"
46   - @click="startConference();"
  46 + @click="startChat();"
47 47 >{{studentBtn}}</v-btn>
48 48 <span class="subheading grey--twxt lighten-1" v-else>Session hasnt started yet</span>
49 49 </div>
50 50 </v-flex>
51   - <v-flex>
  51 + <v-flex id="studentClone">
52 52 <div id="jitsi-container"></div>
53 53 </v-flex>
54 54 </v-layout>
... ... @@ -75,11 +75,11 @@
75 75 round
76 76 class="open-dialog-button"
77 77 dark
78   - @click="createRoom($route.query.classId)"
79   - >{{startLiveSession}}</v-btn>
  78 + @click="startChat()"
  79 + >Start Session</v-btn>
80 80 </div>
81 81 </v-flex>
82   - <v-flex>
  82 + <v-flex id="teacherClone">
83 83 <div id="jitsi-container"></div>
84 84 </v-flex>
85 85 </v-layout>
... ... @@ -106,7 +106,7 @@ import CoursesSideBar from &quot;@/pages/Common/CoursesSideBar.vue&quot;;
106 106 export default {
107 107 mixins: [AllApiCalls],
108 108 components: {
109   - CoursesSideBar
  109 + CoursesSideBar,
110 110 },
111 111 data() {
112 112 return {
... ... @@ -116,36 +116,36 @@ export default {
116 116 // DATA TABLE
117 117 search: "",
118 118 pagination: {
119   - rowsPerPage: 10
  119 + rowsPerPage: 10,
120 120 },
121 121 liveOnlineHeaders: [
122 122 {
123 123 text: "Playback",
124 124 value: "attachementUrl",
125 125 sortable: false,
126   - align: "center"
  126 + align: "center",
127 127 },
128 128 {
129 129 text: "Meeting",
130 130 align: "center",
131 131 sortable: false,
132   - value: ""
  132 + value: "",
133 133 },
134 134 {
135 135 text: "Recording",
136 136 value: "",
137 137 sortable: false,
138   - align: "center"
  138 + align: "center",
139 139 },
140 140 {
141 141 text: "Description Preview",
142 142 value: "",
143 143 sortable: false,
144   - align: "center"
  144 + align: "center",
145 145 },
146 146 { text: "Date", value: "", sortable: false, align: "center" },
147 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 150 liveOnlineItems: [],
151 151  
... ... @@ -153,19 +153,41 @@ export default {
153 153 liveLink: "",
154 154 token: "",
155 155 selectStudents: {},
156   - classRules: [v => !!v || " Class Name is required"],
157   - sectionRules: [v => !!v || " Section Name is required"],
  156 + classRules: [(v) => !!v || " Class Name is required"],
  157 + sectionRules: [(v) => !!v || " Section Name is required"],
158 158 addclass: [],
159 159 addSection: [],
160 160 loading: false,
161 161 room: "",
162 162 username: "",
163   - roomPassword: ""
  163 + roomPassword: "",
  164 + counter: 0,
164 165 };
165 166 },
166 167 methods: {
  168 + startChat() {
  169 + if (this.$store.state.role === "PARENT") {
  170 + let div = document.getElementById("jitsi-container");
  171 + var parent = div.parentNode;
  172 + var clone = div.cloneNode(true);
  173 + clone.id = "jitsi-container";
  174 + parent.replaceChild(clone, div);
  175 + // div.replaceWith(input.val('').clone(true));
  176 + this.studentClasses();
  177 + }
  178 + if (this.$store.state.role === "TEACHER") {
  179 + let div = document.getElementById("jitsi-container");
  180 + var parent = div.parentNode;
  181 + var clone = div.cloneNode(true);
  182 + clone.id = "jitsi-container";
  183 + parent.replaceChild(clone, div);
  184 + // div.replaceWith(input.val('').clone(true));
  185 + this.createRoom();
  186 + }
  187 + },
167 188 // JITSI CONTAINER
168 189 startConference() {
  190 + console.log("yes session started");
169 191 var _this = this;
170 192 try {
171 193 const domain = "meet.intrack.in";
... ... @@ -203,14 +225,14 @@ export default {
203 225 "feedback",
204 226 "stats",
205 227 "shortcuts",
206   - "tileview"
207   - ]
  228 + "tileview",
  229 + ],
208 230 },
209 231 configOverwrite: {
210   - disableSimulcast: false
  232 + disableSimulcast: false,
211 233 },
212 234 teacherName: "",
213   - romm: ""
  235 + romm: "",
214 236 };
215 237  
216 238 this.api = new JitsiMeetExternalAPI(domain, options);
... ... @@ -240,20 +262,22 @@ export default {
240 262 createRoom(classId) {
241 263 this.showLoader = true;
242 264 var classId = {
243   - classId: classId
  265 + classId: classId,
244 266 };
245 267 http()
246 268 .post("/createLiveClasses", {
247 269 classId: this.$route.query.classId,
248 270 courseId: this.$route.query.courseId,
249   - chapterId: this.$route.query.chapterId
  271 + chapterId: this.$route.query.chapterId,
250 272 })
251   - .then(response => {
  273 + .then((response) => {
252 274 // this.addSection = response.data.data;
253 275 console.log("CREATE___ROOOM", response.data);
254   - this.room = response.data.data.LiveClasses.roomName;
  276 + this.room = response.data.data.roomName;
  277 +
255 278 // this.username = response.data.data.LiveClasses.teacherName;
256   - this.roomPassword = response.data.data.LiveClasses.password;
  279 + this.roomPassword = response.data.data.password;
  280 +
257 281 var this_ = this;
258 282 if (this.username != "" || this.room != "") {
259 283 if (window.JitsiMeetExternalAPI) {
... ... @@ -268,74 +292,80 @@ export default {
268 292 this.startConference();
269 293 } else alert("Jitsi Meet API script not loaded");
270 294 }
  295 + console.log("bazinga");
271 296 this.showLoader = false;
272 297 })
273   - .catch(err => {
  298 + .catch((err) => {
274 299 this.showLoader = false;
275 300 });
276   - }
277   - },
278   -
279   - mounted() {
280   - this.token = this.$store.state.token;
281   - },
282   - async created() {
283   - /* getLiveClassesesList - To up date line under heading*/
284   - let response = await this.getLiveClassesesList({
285   - classId: this.$route.query.classId,
286   - courseId: this.$route.query.courseId,
287   - chapterId: this.$route.query.chapterId
288   - });
289   - console.log("response getLiveClassesesList- ", response);
  301 + },
  302 + async studentClasses() {
  303 + /* getLiveClassesesList - To up date line under heading*/
  304 + let response = await this.getLiveClassesesList({
  305 + classId: this.$route.query.classId,
  306 + courseId: this.$route.query.courseId,
  307 + chapterId: this.$route.query.chapterId,
  308 + });
  309 + console.log("response getLiveClassesesList- ", response);
290 310  
291   - /* CHECK RESPONSE TO ASSIGN MESSAGE INSIDE BUTTON */
292   - if (response.data.data.length == 0) {
293   - this.startLiveSession = "Start Session";
294   - this.studentBtn = "";
295   - } else {
296   - this.liveLink = response.data.data[0].link;
297   - this.room = response.data.data[0].roomName;
298   - this.username = response.data.data[0].teacherId.name;
299   - this.roomPassword = response.data.data[0].password;
300   - // this.room = response.data.data[0].roomName;
301   - var this_ = this;
302   - console.log(this.room, this.roomPassword, this.username);
  311 + /* CHECK RESPONSE TO ASSIGN MESSAGE INSIDE BUTTON */
  312 + if (response.data.data.length == 0) {
  313 + this.startLiveSession = "Start Session";
  314 + this.studentBtn = "";
  315 + } else {
  316 + this.liveLink = response.data.data[0].link;
  317 + this.room = response.data.data[0].roomName;
  318 + this.username = response.data.data[0].teacherId.name;
  319 + this.roomPassword = response.data.data[0].password;
  320 + // this.room = response.data.data[0].roomName;
  321 + var this_ = this;
  322 + console.log(this.room, this.roomPassword, this.username);
303 323  
304   - // // this.username = response.data.data.LiveClasses.teacherName;
305   - // this.roomPassword = response.data.data[0].password;
306   - // var this_ = this;
307   - if (this.username != "" || this.room != "") {
308   - if (window.JitsiMeetExternalAPI) {
309   - // var person = prompt("Please enter your name:", "Rabie");
310   - if (this_.username != null || this_.username != "") {
311   - this.username = this.username;
  324 + // // this.username = response.data.data.LiveClasses.teacherName;
  325 + // this.roomPassword = response.data.data[0].password;
  326 + // var this_ = this;
  327 + if (this.username != "" || this.room != "") {
  328 + if (window.JitsiMeetExternalAPI) {
  329 + // var person = prompt("Please enter your name:", "Rabie");
  330 + if (this_.username != null || this_.username != "") {
  331 + this.username = this.username;
  332 + }
  333 + // var room = prompt("Please enter your room:", "Test Room");
  334 + if (this_.room != null || this_.room != "") {
  335 + this.room = this.room;
  336 + }
  337 + this.startConference();
312 338 }
313   - // var room = prompt("Please enter your room:", "Test Room");
314   - if (this_.room != null || this_.room != "") {
315   - this.room = this.room;
316   - }
317   - // this.startConference();
318 339 }
319   - }
320 340  
321   - if (response.data.data[0].sessionStatus == "ENDED") {
322   - this.startLiveSession = "Start Session";
323   - this.studentBtn = "";
324   - }
325   - if (response.data.data[0].sessionStatus == "STARTED") {
326   - this.startLiveSession = "Join Session";
327   - this.studentBtn = "Join Session";
  341 + if (response.data.data[0].sessionStatus == "ENDED") {
  342 + // this.startLiveSession = "Start Session";
  343 + this.studentBtn = "";
  344 + }
  345 + if (response.data.data[0].sessionStatus == "STARTED") {
  346 + // this.startLiveSession = "Join Session";
  347 + this.studentBtn = "Join Session";
  348 + }
328 349 }
  350 + },
  351 + },
  352 +
  353 + mounted() {
  354 + this.token = this.$store.state.token;
  355 + },
  356 + async created() {
  357 + if (this.$store.state.role === "PARENT") {
  358 + this.studentClasses();
329 359 }
330 360  
331 361 /* getStudentCourses - to get courseData - defined in GetApis.js*/
332 362 if (this.$store.state.role === "PARENT") {
333 363 await this.getStudentCourses({
334 364 classId: localStorage.getItem("parentClassId"),
335   - studentId: localStorage.getItem("parentStudentId")
  365 + studentId: localStorage.getItem("parentStudentId"),
336 366 });
337 367 }
338   - }
  368 + },
339 369 };
340 370 </script>
341 371 <style scoped>
... ...