viithiisys / School-Management-dashboard

Browse Code »

Commit 1eaabc5a2d8e4c82618d5b1fb9f7aaff62d1b0a5

Authored by Neeraj Sharma 2020-07-14 09:01:10 -0400

2 parents c3a54d5c1e ac24ec07ac

Exists in master and in 2 other branches

comit code

Showing 5 changed files Show diff stats

src/pages/Dashboard/ChapterInfo.vue

Diff comments View file @1eaabc5

 <template>
   <div>
     <!-- LOADER -->
     <div class="loader" v-if="showLoader">
       <v-progress-circular indeterminate color="white"></v-progress-circular>
     </div>
     <!-- SNACKBAR -->
     <v-snackbar
       :timeout="timeout"
       :top="y === 'top'"
       :right="x === 'right'"
       :vertical="mode === 'vertical'"
       v-model="snackbar"
       :color="snackbarColor"
     >
       {{ text }}
       <v-spacer></v-spacer>
       <v-btn flat text @click="snackbar = false">X</v-btn>
     </v-snackbar>
     <v-container class="pt-0">
       <v-layout row class="mt-1">
         <v-flex xs8>
           <!-- CHAPTER INFO -->
           <div class="title side-bar-color font-weight-bold">{{chapter.chapters[0].chapterName}}</div>
           <div class="subheading grey--text lighten-1">{{chapter.chapters[0].description}}</div>
           <div
             v-for="(point,index) in chapter.chapters[0].chapterPoints"
             :key="index"
             class="ml-2 mt-2"
           >
             <span class="subheading grey--text lighten-1">{{index +1}}. {{point}}</span>
           </div>
           <!-- ACTIVITIES -->
           <div class="mt-5">
             <v-icon>library_books</v-icon>
             <span class="subheading font-weight-bold">Activities</span>
           </div>
           <!-- OTHER OPTIONS -->
           <div class="mt-5">
-            <ul class="subheading">
+            <ul class="subheading" style="cursor: pointer">
-              <li>Live online classes solution</li>
+              <li @click="$router.push({name: 'Live Online Class'})">
-              <li>Tutorial-pharmacetutical</li>
+                <v-btn flat>Live online classes solution</v-btn>
-              <li>HSP Interactive content</li>
+              </li>
-              <li>Assessment</li>
+              <!-- <li>
+                <v-btn flat>Tutorial-pharmacetutical</v-btn>
+              </li>
+              <li>
+                <v-btn flat>HSP Interactive content</v-btn>
+              </li>
+              <li>
+                <v-btn flat>Assessment</v-btn>
+              </li>-->
             </ul>
           </div>
           <!-- SELECT CHAPTERS -->
           <v-layout row class="mt-5">
             <!-- PREVIOUS CHAPTER -->
             <v-flex
               style="cursor: pointer;"
               class="subheading font-weight-bold text-xs-left"
               v-if="indexSelectedChapter > 0"
               @click="showSelectedChapter('back')"
             >
               <v-icon class="black--text" style="position:relative; top: 4px;">chevron_left</v-icon>
               {{chapterNames[indexSelectedChapter - 1]}}
             </v-flex>
             <v-spacer></v-spacer>
             <!-- NEXT CHAPTER -->
             <v-flex
               style="cursor: pointer;"
               class="subheading font-weight-bold text-xs-right"
               v-if="indexSelectedChapter < chapterNames.length -1"
               @click="showSelectedChapter('forward')"
             >
               {{chapterNames[indexSelectedChapter + 1]}}
               <v-icon class="black--text" style="position:relative; top: 4px;">chevron_right</v-icon>
             </v-flex>
           </v-layout>
           <!-- <v-flex class="text-xs-right mt-5" v-else>
             <span class="subheading font-weight-bold">Return to chapter one</span>
           </v-flex>-->
         </v-flex>
         <v-spacer></v-spacer>
         <!-- COURSES - positioned to the right of the page -->
         <v-flex xs3>
           <v-card class="elevation-0 card-border" height="100%">
             <v-container class="pt-0">
               <div class="side-bar-color font-weight-bold title">Courses</div>
               <div v-for="(course,index) in courseData" :key="index">
                 <v-btn
                   flat
                   class="subheading text-xs-start justify-left"
                   style="cursor: pointer;"
                   block
                   @click="routeToCourseDetails(course._id)"
                 >
                   <div style="width: 100%;text-align: left;">
                     <v-icon style="color: red;padding-bottom: 3px;" size="15">play_arrow</v-icon>
                     {{course.courseName}}
                   </div>
                 </v-btn>
               </div>
             </v-container>
           </v-card>
         </v-flex>
       </v-layout>
     </v-container>
   </div>
 </template>
 <script>
 import http from "@/Services/http.js";
 import AllApiCalls from "@/Services/AllApiCalls.js";
 export default {
   mixins: [AllApiCalls],
   data() {
     return {
       // courseData: [],
       showLoader: false,
       chapter: { chapters: [{}] },
       chapterNames: [],
       chapterIds: [],
       selectedChapterId: "",
       indexSelectedChapter: ""
     };
   },
   methods: {
     showSelectedChapter(newChapter) {
       if (newChapter == "forward") {
         this.indexSelectedChapter += 1;
         this.selectedChapterId = this.chapterIds[this.indexSelectedChapter];
         this.getParticularChapterDetail();
       }
       if (newChapter == "back") {
         this.indexSelectedChapter -= 1;
         this.selectedChapterId = this.chapterIds[this.indexSelectedChapter];
         this.getParticularChapterDetail();
       }
     },
     getParticularChapterDetail() {
       http()
         .get("/getParticularChapterDetail", {
           params: {
             courseDetailId: this.$route.query.courseDetailId,
             chapterId: this.selectedChapterId
           }
         })
         .then(response => {
           this.chapter = response.data.data;
           console.log(" chapter data - ", this.chapter);
           this.showLoader = false;
         })
         .catch(err => {
           console.log("err====>", err);
           this.showLoader = false;
         });
     },
     async routeToCourseDetails(courseId) {
       /* getParticularCourseDetail- To get courseDetail - defined in GetApis.js*/
       let response = await this.getParticularCourseDetail(courseId);
       /* If the response is null then dont route */
       if (response.data.data.length > 0) {
         this.$router.push({
           name: "Course Details",
           query: { courseId: courseId }
         });
       } else {
         this.seeSnackbar("No Data Available", "warning");
       }
     }
   },
   // computed:{
   //   nextChapterIndex(){
   //   }
   // }
   async created() {
     console.log("route query - ", this.$route.query);
     this.selectedChapterId = this.$route.query.chapterId;
     /* set chapterNames array */
     this.chapterNames = Object.keys(this.$route.query);
     this.chapterNames.pop();
     this.chapterNames.pop();
     console.log("chapter names - ", this.chapterNames);
     /* set chapter Ids */
     this.chapterIds = Object.values(this.$route.query);
     this.chapterIds.pop();
     this.chapterIds.pop();
     console.log("chapter Ids - ", this.chapterIds);
     this.indexSelectedChapter = this.chapterIds.findIndex(id => {
       return id == this.selectedChapterId;
     });
     console.log(" index of selected chapter - ", this.indexSelectedChapter);
     /* get chapter clicked on using the id */
     await this.getParticularChapterDetail(this.selectedChapterId);
     /* getStudentCourses - to get courseData - defined in GetApis.js*/
     await this.getStudentCourses({
       classId: localStorage.getItem("parentClassId"),
       studentId: localStorage.getItem("parentStudentId")
     });
   }
 };
 </script>
 <style scoped>
 .side-bar-color {
   color: #827bfa !important;
   /* border-top-right-radius: 74px !important; */
 }
 .card-border {
   border: 1px #bdbdbd solid;
   border-radius: 3px;
 }
 </style>

src/pages/Dashboard/CourseDetails.vue

Diff comments View file @1eaabc5

1	<template>	1	<template>
2	<div>	2	<div>
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 class="pt-0">	22	<v-container class="pt-0">
23	<v-layout row wrap class="mt-1">	23	<v-layout row wrap class="mt-1">
24	<v-flex xs12 md8>	24	<v-flex xs12 md8>
25	<div	25	<div
26	class="title side-bar-color font-weight-bold"	26	class="title side-bar-color font-weight-bold"
27	>Welcome to the {{courseDetails[0].courseId.courseName}} Course for {{courseDetails[0].classId.classNum}} class</div>	27	>Welcome to the {{courseDetails[0].courseId.courseName}} Course for {{courseDetails[0].classId.classNum}} class</div>
28	<v-flex xs12 class="subheading mt-2">	28	<v-flex xs12 class="subheading mt-2">
29	Lorem Ipsum sdjjkhsdf sdklfjs dkfjskdjfk fjsdklf sdjfksljf sdfkls fljlkj kl	29	Lorem Ipsum sdjjkhsdf sdklfjs dkfjskdjfk fjsdklf sdjfksljf sdfkls fljlkj kl
30	jkhjkfhjksd sdfjkhsdjk fsdjkl sfkljkl ldkfjkl kjlfs dlkjlskd fljsldk fklj	30	jkhjkfhjksd sdfjkhsdjk fsdjkl sfkljkl ldkfjkl kjlfs dlkjlskd fljsldk fklj
31	lksjdfljklsdj flkjs dflkjsd flkjsd lfkjsd lfjsdjf lkj kl	31	lksjdfljklsdj flkjs dflkjsd flkjsd lfkjsd lfjsdjf lkj kl
32	</v-flex>	32	</v-flex>
33		33
34	<div class="mt-5">	34	<div class="mt-5">
35	<span	35	<span
36	style="cursor: pointer;"	36	style="cursor: pointer;"
37	class="grey--text lighten-1"	37	class="grey--text lighten-1"
38	@click="$router.push({name: 'Announcement', query:{courseId: $route.query.courseId}})"	38	@click="$router.push({name: 'Announcement', query:{courseId: $route.query.courseId}})"
39	>	39	>
40	<v-icon>question_answer</v-icon>	40	<v-icon>question_answer</v-icon>
41	<span class="ml-2">Announcement</span>	41	<span class="ml-2">Announcement</span>
42	</span>	42	</span>
43	</div>	43	</div>
44	<div>	44	<div>
45	<span	45	<span
46	style="cursor: pointer;"	46	style="cursor: pointer;"
47	@click="$router.push({name: 'Course Discussion Forum', query:{courseId: $route.query.courseId}})"	47	@click="$router.push({name: 'Course Discussion Forum', query:{courseId: $route.query.courseId}})"
48	class="grey--text lighten-1"	48	class="grey--text lighten-1"
49	>	49	>
50	<v-icon>question_answer</v-icon>	50	<v-icon>question_answer</v-icon>
51	<span class="ml-2">Course discussion forum</span>	51	<span class="ml-2">Course discussion forum</span>
52	</span>	52	</span>
53	</div>	53	</div>
54	<!-- CHAPTERS -->	54	<!-- CHAPTERS -->
55	<v-layout column class="mt-5">	55	<v-layout column class="mt-5">
56	<v-flex	56	<v-flex
57	v-for="(chapter,index) in courseDetails[0].chapters"	57	v-for="(chapter,index) in courseDetails[0].chapters"
58	:key="index"	58	:key="index"
59	style="cursor: pointer;"	59	style="cursor: pointer;"
60	@click="routeToChapterInfo(chapter._id)"	60	@click="routeToChapterInfo(chapter._id)"
61	>	61	>
62	<v-card class="mt-2 elevation-0 card-border">	62	<v-card class="mt-2 elevation-0 card-border">
63	<v-container class="pt-0">	63	<v-container class="pt-0">
64	<div class="title side-bar-color font-weight-bold">{{chapter.chapterName}}</div>	64	<div class="title side-bar-color font-weight-bold">{{chapter.chapterName}}</div>
65	<div class="grey--text lighten-1 subheading">{{chapter.description}}</div>	65	<div class="grey--text lighten-1 subheading">{{chapter.description}}</div>
66	<div	66	<div
67	v-for="(point,index) in chapter.chapterPoints"	67	v-for="(point,index) in chapter.chapterPoints"
68	:key="index"	68	:key="index"
69	class="ml-2 mt-2"	69	class="ml-2 mt-2"
70	>	70	>
71	<span class="grey--text lighten-1 subheading">{{index +1}}. {{point}}</span>	71	<span class="grey--text lighten-1 subheading">{{index +1}}. {{point}}</span>
72	</div>	72	</div>
73	</v-container>	73	</v-container>
74	</v-card>	74	</v-card>
75	</v-flex>	75	</v-flex>
76	</v-layout>	76	</v-layout>
77	</v-flex>	77	</v-flex>
78	<v-spacer></v-spacer>	78	<v-spacer></v-spacer>
79		79
80	<!-- COURSES -->	80	<!-- COURSES -->
81	<v-flex xs12 md3>	81	<v-flex xs12 md3>
82	<v-card class="elevation-0 card-border" height="100%">	82	<v-card class="elevation-0 card-border" height="100%">
83	<v-container class="pt-0">	83	<v-container class="pt-0">
84	<div class="side-bar-color font-weight-bold title">Courses</div>	84	<div class="side-bar-color font-weight-bold title">Courses</div>
85		85
86	<div v-for="(course,index) in courseData">	86	<div v-for="(course,index) in courseData">
87	<v-btn	87	<v-btn
88	flat	88	flat
89	class="subheading text-xs-start justify-left"	89	class="subheading text-xs-start justify-left"
90	style="cursor: pointer;"	90	style="cursor: pointer;"
91	block	91	block
92	@click="routeToCourseDetails(course._id)"	92	@click="routeToCourseDetails(course._id)"
93	>	93	>
94	<div style="width: 100%;text-align: left;">	94	<div style="width: 100%;text-align: left;">
95	<v-icon style="color: red;padding-bottom: 3px;" size="15">play_arrow</v-icon>	95	<v-icon style="color: red;padding-bottom: 3px;" size="15">play_arrow</v-icon>
96	{{course.courseName}}	96	{{course.courseName}}
97	</div>	97	</div>
98	</v-btn>	98	</v-btn>
99	</div>	99	</div>
100	<!-- <v-expansion-panel focusable class="elevation-0">	100	<!-- <v-expansion-panel focusable class="elevation-0">
101	<v-expansion-panel-content v-for="(item,i) in courseData" :key="i">	101	<v-expansion-panel-content v-for="(item,i) in courseData" :key="i">
102	<template v-slot:header>	102	<template v-slot:header>
103	<div class="subheading">{{item.courseName}}</div>	103	<div class="subheading">{{item.courseName}}</div>
104	</template>	104	</template>
105	</v-expansion-panel-content>	105	</v-expansion-panel-content>
106	</v-expansion-panel>-->	106	</v-expansion-panel>-->
107	</v-container>	107	</v-container>
108	</v-card>	108	</v-card>
109	</v-flex>	109	</v-flex>
110	</v-layout>	110	</v-layout>
111	</v-container>	111	</v-container>
112	</div>	112	</div>
113	</template>	113	</template>
114	<script>	114	<script>
115	import AllApiCalls from "@/Services/AllApiCalls.js";	115	import AllApiCalls from "@/Services/AllApiCalls.js";
116	import http from "@/Services/http.js";	116	import http from "@/Services/http.js";
117	import moment from "moment";	117	import moment from "moment";
118	export default {	118	export default {
119	mixins: [AllApiCalls],	119	mixins: [AllApiCalls],
120	data() {	120	data() {
121	return {	121	return {
122	showLoader: false,	122	showLoader: false,
123	courseDetails: [{ courseId: {}, classId: {} }],	123	courseDetails: [{ courseId: {}, classId: {} }],
124	chapterIds: [],	124	chapterIds: [],
125	// courseData: [],	125	// courseData: [],
126	courseDataTree: []	126	courseDataTree: []
127	};	127	};
128	},	128	},
129	methods: {	129	methods: {
130	routeToChapterInfo(chapterId) {	130	routeToChapterInfo(chapterId) {
131	/* set value of present chapter selected, and other chapters ids in the obj */	131	/* set value of present chapter selected, and other chapters ids in the obj */
132	let obj = {};	132	let obj = {};
133	for (var i = 0; i < this.courseDetails[0].chapters.length; i++) {	133	for (var i = 0; i < this.courseDetails[0].chapters.length; i++) {
134	obj[	134	obj[
135	this.courseDetails[0].chapters[i].chapterName	135	this.courseDetails[0].chapters[i].chapterName
136	] = this.courseDetails[0].chapters[i]._id;	136	] = this.courseDetails[0].chapters[i]._id;
137	}	137	}
138	obj.chapterId = chapterId;	138	obj.chapterId = chapterId;
139	obj.courseDetailId = this.courseDetails[0]._id;	139	obj.courseDetailId = this.courseDetails[0]._id;
140	this.$router.push({	140	this.$router.push({
141	name: "Chapter Info",	141	name: "Chapter Info",
142	query: obj	142	query: obj
143	});	143	});
144	},	144	},
145	async routeToCourseDetails(courseId) {	145	async routeToCourseDetails(courseId) {
146	/* getParticularCourseDetail- To get courseDetail - defined in GetApis.js*/	146	/* getParticularCourseDetail- To get courseDetail - defined in GetApis.js*/
147	let response = await this.getParticularCourseDetail(courseId);	147	let response = await this.getParticularCourseDetail(courseId);
148		148
149	/* If the response is null then dont route */	149	/* If the response is null then dont route */
150	if (response.data.data.length > 0) {	150	if (response.data.data.length > 0) {
151	this.$router.push({	151	this.$router.push({
152	name: "Course Details",	152	name: "Course Details",
153	query: { courseId: courseId }	153	query: { courseId: courseId }
154	});	154	});
155	} else {	155	} else {
156	this.seeSnackbar("No Data Available", "warning");	156	this.seeSnackbar("No Data Available", "warning");
157	}	157	}
158	}	158	}
159	},	159	},
160	async created() {	160	async created() {
161	/* getParticularCourseDetail- To get courseDetail - defined in GetApis.js*/	161	/* getParticularCourseDetail- To get courseDetail - defined in GetApis.js*/
162	let response = await this.getParticularCourseDetail(	162	let response = await this.getParticularCourseDetail(
163	this.$route.query.courseId	163	this.$route.query.courseId
164	);	164	);
165	this.courseDetails = response.data.data;	165	this.courseDetails = response.data.data;
166		166
167	/* getStudentCourses - to get courseData - defined in GetApis.js*/	167	/* getStudentCourses - to get courseData - defined in GetApis.js*/
168	await this.getStudentCourses({	168	await this.getStudentCourses({
169	classId: localStorage.getItem("parentClassId"),	169	classId: localStorage.getItem("parentClassId"),
170	studentId: localStorage.getItem("parentStudentId")	170	studentId: localStorage.getItem("parentStudentId")
171	});	171	});
172	}	172	}
173	};	173	};
174	</script>	174	</script>
175	<style scoped>	175	<style scoped>
176	.side-bar-color {	176	.side-bar-color {
177	color: #827bfa !important;	177	color: #827bfa !important;
178	/* border-top-right-radius: 74px !important; */	178	/* border-top-right-radius: 74px !important; */
179	}	179	}
180	.card-border {	180	.card-border {
181	border: 1px #bdbdbd solid;	181	border: 1px #bdbdbd solid;
182	border-radius: 3px;	182	border-radius: 3px;
183	}	183	}
184	/* .v-treeview-node__toggle {	184	/* .v-treeview-node__toggle {
185	color: red !important;	185	color: red !important;
186	} */	186	} */
187	</style>	187	</style>

src/pages/Dashboard/LiveOnlineClass.vue

Diff comments View file @1eaabc5

File was created	1	<template>
	2	<div class="body-color">
	3	<!-- LOADER -->
	4	<div class="loader" v-if="showLoader">
	5	<v-progress-circular indeterminate color="white"></v-progress-circular>
	6	</div>
	7
	8	<!-- SNACKBAR -->
	9	<v-snackbar
	10	:timeout="timeout"
	11	:top="y === 'top'"
	12	:right="x === 'right'"
	13	:vertical="mode === 'vertical'"
	14	v-model="snackbar"
	15	:color="snackbarColor"
	16	>
	17	{{ text }}
	18	<v-spacer></v-spacer>
	19	<v-btn flat text @click="snackbar = false">X</v-btn>
	20	</v-snackbar>
	21
	22	<!-- DIALOG TO ADD COURSE DISCUSSION FORUM -->
	23	<v-dialog v-model="addForumDialog" max-width="500" persistent>
	24	<v-card flat class="card-style pa-2" dark>
	25	<v-layout>
	26	<v-flex xs12>
	27	<label class="title text-xs-center">Add Forum</label>
	28	<v-icon size="24" class="right" @click="addForumDialog = false">cancel</v-icon>
	29	</v-flex>
	30	</v-layout>
	31	<v-container fluid>
	32	<v-layout align-center>
	33	<v-flex xs12>
	34	<v-flex xs12 sm12>
	35	<v-form ref="form" v-model="valid" lazy-validation>
	36	<v-layout>
	37	<v-flex
	38	xs12
	39	class="text-xs-center text-sm-center text-md-center text-lg-center"
	40	>
	41	<v-avatar size="100px" v-if="!imageUrl">
	42	<img src="/static/icon/user.png" />
	43	</v-avatar>
	44	<input
	45	type="file"
	46	style="display: none"
	47	ref="image"
	48	accept="image/*"
	49	@change="onFilePicked"
	50	/>
	51	<img
	52	:src="imageData.imageUrl"
	53	height="150"
	54	width="150"
	55	v-if="imageUrl"
	56	style="border-radius:50%; width:200px"
	57	/>
	58	</v-flex>
	59	</v-layout>
	60
	61	<v-layout wrap>
	62	<!-- SUBJECT -->
	63	<v-flex xs12 sm12>
	64	<v-layout>
	65	<v-flex xs4 sm4 class="pt-4 subheading">
	66	<label class="right hidden-xs-only hidden-sm-only">Subject:</label>
	67	<label class="right hidden-lg-only hidden-md-only hidden-xl-only">Subject:</label>
	68	</v-flex>
	69	<v-flex xs8 sm8 class="ml-3">
	70	<v-text-field
	71	v-model="addForumParams.subject"
	72	placeholder="subject"
	73	type="text"
	74	:rules="cantBeEmpty"
	75	required
	76	></v-text-field>
	77	</v-flex>
	78	</v-layout>
	79	</v-flex>
	80	<!-- DESCRIPTION -->
	81	<v-flex xs12 sm12>
	82	<v-layout>
	83	<v-flex xs4 sm4 class="pt-4 subheading">
	84	<label class="right hidden-xs-only hidden-sm-only">Description:</label>
	85	<label
	86	class="right hidden-lg-only hidden-md-only hidden-xl-only"
	87	>Description:</label>
	88	</v-flex>
	89	<v-flex xs8 sm8 class="ml-3">
	90	<v-text-field
	91	v-model="addForumParams.description"
	92	placeholder="Description"
	93	type="text"
	94	:rules="cantBeEmpty"
	95	required
	96	></v-text-field>
	97	</v-flex>
	98	</v-layout>
	99	</v-flex>
	100	<!-- UPLOAD IMAGE -->
	101	<v-flex xs12 sm12>
	102	<v-layout>
	103	<v-flex xs4 class="pt-4 subheading">
	104	<label class="right hidden-xs-only hidden-sm-only">Upload Image:</label>
	105	<label class="right hidden-lg-only hidden-md-only hidden-xl-only">Upload :</label>
	106	</v-flex>
	107	<v-flex xs8 class="ml-3">
	108	<v-text-field
	109	label="Select Image"
	110	@click="pickFile"
	111	v-model="imageName"
	112	append-icon="attach_file"
	113	></v-text-field>
	114	</v-flex>
	115	</v-layout>
	116	</v-flex>
	117	</v-layout>
	118	<v-layout>
	119	<v-flex xs12 sm12>
	120	<v-layout class="right">
	121	<v-btn @click="submit" round dark :loading="loading" class="add-button">Add</v-btn>
	122	</v-layout>
	123	</v-flex>
	124	</v-layout>
	125	</v-form>
	126	</v-flex>
	127	</v-flex>
	128	</v-layout>
	129	</v-container>
	130	</v-card>
	131	</v-dialog>
	132
	133	<v-container grid-list-xl class="pt-0">
	134	<v-layout row wrap class="mt-1">
	135	<v-flex xs12 sm12 md9>
	136	<v-layout column>
	137	<!-- HEADING -->
	138	<v-flex>
	139	<div class="title side-bar-color font-weight-bold">Live Online Classes - Solution</div>
	140	<div class="subheading grey--text lighten-1">This conference is in progress</div>
	141	<div
	142	class="subheading grey--text lighten-1"
	143	>The session started at 1:00 there is 1 moderator</div>
	144	</v-flex>
	145
	146	<!-- JOIN OR END SESSION -->
	147	<v-flex>
	148	<div>
	149	<v-btn round class="open-dialog-button" dark>Join Session</v-btn>
	150	</div>
	151	</v-flex>
	152
	153	<!-- DATA TABLE -->
	154	<v-flex>
	155	<div>
	156	<span class="subheading font-weight-bold">Recording</span>
	157	</div>
	158	<v-data-table
	159	:headers="liveOnlineHeaders"
	160	:items="liveOnlineHeaders"
	161	:pagination.sync="pagination"
	162	:search="search"
	163	item-key="_id"
	164	>
	165	<template slot="items" slot-scope="props">
	166	<tr
	167	class="tr"
	168	@click="props.expanded = !props.expanded;courseDiscussionId = props.item._id;getDiscussionesThread(props.item._id)"
	169	>
	170	<td class="text-xs-center td td-row">
	171	<v-btn round class="open-dialog-button" dark>Join Session</v-btn>
	172	</td>
	173	<td class="td td-row text-xs-center">{{ }}</td>
	174	<td class="td td-row text-xs-center">{{ }}</td>
	175	<td class="td td-row text-xs-center">-</td>
	176	<td class="td td-row text-xs-center">{{ }}</td>
	177	</tr>
	178	</template>
	179	</v-data-table>
	180	</v-flex>
	181	</v-layout>
	182	</v-flex>
	183
	184	<v-spacer></v-spacer>
	185
	186	<!-- COURSES - positioned to the right of the page -->
	187	<v-flex xs12 sm12 md3>
	188	<v-card class="elevation-0 card-border" height="100%">
	189	<v-container class="pt-0">
	190	<div class="side-bar-color font-weight-bold title">Courses</div>
	191
	192	<div v-for="(course,index) in courseData">
	193	<v-btn
	194	flat
	195	class="subheading text-xs-start justify-left"
	196	style="cursor: pointer;"
	197	block
	198	@click="routeToCourseDetails(course._id)"
	199	>
	200	<div style="width: 100%;text-align: left;">
	201	<v-icon style="color: red;padding-bottom: 3px;" size="15">play_arrow</v-icon>
	202	{{course.courseName}}
	203	</div>
	204	</v-btn>
	205	</div>
	206	</v-container>
	207	</v-card>
	208	</v-flex>
	209	</v-layout>
	210	</v-container>
	211	</div>
	212	</template>
	213	<script>
	214	import AllApiCalls from "@/Services/AllApiCalls.js";
	215	import http from "@/Services/http.js";
	216	import moment from "moment";
	217	export default {
	218	mixins: [AllApiCalls],
	219	data() {
	220	return {
	221	localStorage: localStorage,
	222	valid: true,
	223	addForumDialog: false,
	224	addForumParams: {},
	225	// UPLOAD IMAGE
	226	imageName: "",
	227	imageUrl: "",
	228	imageFile: "",
	229	imageData: {},
	230
	231	// DATA TABLE
	232	search: "",
	233	pagination: {
	234	rowsPerPage: 10
	235	},
	236	liveOnlineHeaders: [
	237	{
	238	text: "Playback",
	239	value: "attachementUrl",
	240	sortable: false,
	241	align: "center"
	242	},
	243	{
	244	text: "Meeting",
	245	align: "center",
	246	sortable: false,
	247	value: ""
	248	},
	249	{
	250	text: "Recording",
	251	value: "",
	252	sortable: false,
	253	align: "center"
	254	},
	255	{
	256	text: "Description Preview",
	257	value: "",
	258	sortable: false,
	259	align: "center"
	260	},
	261	{ text: "Date", value: "", sortable: false, align: "center" },
	262	{ text: "Duration", value: "", sortable: false, align: "center" },
	263	{ text: "Toolbar", value: "", sortable: false, align: "center" }
	264	],
	265	liveOnlineItems: [],
	266
	267	// COURSE DISCUSSION REPLTY FUNCTIONALITY
	268	courseDiscussionId: "",
	269	showReplyBox: false,
	270	courseDiscussionData: [],
	271	replyDescription: "",
	272	loginId: "",
	273	editedIndex: -1
	274	};
	275	},
	276	methods: {
	277	dates: function(date) {
	278	return moment(date).format("MMMM DD, YYYY hh:mm A");
	279	},
	280	/* UPLOAD IMAGE */
	281	pickFile() {
	282	this.$refs.image.click();
	283	},
	284
	285	onFilePicked(e) {
	286	// console.log(e)
	287	const files = e.target.files;
	288	this.imageData.upload = e.target.files[0];
	289	if (files[0] !== undefined) {
	290	this.imageName = files[0].name;
	291	if (this.imageName.lastIndexOf(".") <= 0) {
	292	return;
	293	}
	294	const fr = new FileReader();
	295	fr.readAsDataURL(files[0]);
	296	fr.addEventListener("load", () => {
	297	this.imageUrl = fr.result;
	298	this.imageFile = files[0]; // this is an image file that can be sent to server...
	299	this.imageData.imageUrl = URL.createObjectURL(this.imageFile);
	300	});
	301	} else {
	302	this.imageName = "";
	303	this.imageFile = "";
	304	this.imageUrl = "";
	305	}
	306	},
	307	async submit() {
	308	if (this.$refs.form.validate()) {
	309	this.addForumParams.classId = localStorage.getItem("parentClassId");
	310	this.addForumParams.courseId = this.$route.query.courseId;
	311	this.addForumParams.studentId = localStorage.getItem("parentStudentId");
	312
	313	if (this.imageUrl) {
	314	var str = this.imageUrl;
	315	const [baseUrl, imageUrl] = str.split(/,/);
	316	this.addForumParams.upload = imageUrl;
	317	}
	318	this.loading = true;
	319	await http()
	320	.post("/createCourseDiscussion", this.addForumParams)
	321	.then(response => {
	322	this.snackbar = true;
	323	this.text = "Discussion added successfully";
	324	this.snackbarColor = "green";
	325	this.addForumDialog = false;
	326	this.clear();
	327	this.loading = false;
	328	console.log("response of createCourseDiscussion - ", response);
	329	})
	330	.catch(error => {
	331	this.snackbar = true;
	332	this.text = error.response.data.message;
	333	this.snackbarColor = "error";
	334	this.loading = false;
	335	});
	336
	337	/* getCourseDiscussionesList - to populate the data table */
	338	await this.getCourseDiscussionesList({
	339	courseId: this.$route.query.courseId,
	340	classId: localStorage.getItem("parentClassId")
	341	});
	342	this.addForumDialog = false;
	343	}
	344	},
	345	clear() {
	346	this.$refs.form.reset();
	347	this.imageUrl = "";
	348	},
	349	async routeToCourseDetails(courseId) {
	350	/* getParticularCourseDetail- To get courseDetail - defined in GetApis.js*/
	351	let response = await this.getParticularCourseDetail(courseId);
	352
	353	/* If the response is null then dont route */
	354	if (response.data.data.length > 0) {
	355	this.$router.push({
	356	name: "Course Details",
	357	query: { courseId: courseId }
	358	});
	359	} else {
	360	this.seeSnackbar("No Data Available", "warning");
	361	}
	362	},
	363
	364	// COURSE DISCUSSION REPLY FUNCTIONALITY
	365
	366	getDiscussionesThread() {
	367	// console.log("id", this.getSelectedData.courseId);
	368	this.showLoader = true;
	369	http()
	370	.get("/getParticularCourseDiscussion", {
	371	params: {
	372	courseDiscussionId: this.courseDiscussionId
	373	}
	374	})
	375	.then(response => {
	376	// console.log("response", response.data.data);
	377	this.courseDiscussionData = response.data.data;
	378	for (let i = 0; i < this.courseDiscussionData.length; i++) {
	379	for (
	380	let j = 0;
	381	j < this.courseDiscussionData[i].forumThread.length;
	382	j++
	383	) {
	384	this.courseDiscussionData[i].forumThread[
	385	j
	386	].showUpdateReplyThread = false;
	387	this.courseDiscussionData[i].forumThread[
	388	j
	389	].showDescriptionReplyThread = true;
	390	}
	391	}
	392	this.showLoader = false;
	393	this.showReplyBox = false;
	394	})
	395	.catch(error => {
	396	console.log("err====>", error);
	397	this.showLoader = false;
	398	});
	399	},
	400	replyThreadDiscussion(selected) {
	401	this.showLoader = true;
	402	var payloadData = {
	403	courseDiscussionId: selected._id,
	404	studentId: localStorage.getItem("parentStudentId"),
	405	description: this.replyDescription
	406	};
	407	http()
	408	.put("/replyForumThread", payloadData)
	409	.then(response => {
	410	// console.log("response", response.data.data);
	411	this.showLoader = false;
	412	this.getDiscussionesThread();
	413	})
	414	.catch(error => {
	415	this.showLoader = false;
	416	});
	417	},
	418	showUpdateReplyThreadDiscussion(item) {
	419	this.editedIndex = this.courseDiscussionData.indexOf(item);
	420	var editedItem = Object.assign({}, item);
	421	var arrayOfcourseDiscussionData = [];
	422	for (let i = 0; i < this.courseDiscussionData.length; i++) {
	423	for (
	424	let j = 0;
	425	j < this.courseDiscussionData[i].forumThread.length;
	426	j++
	427	) {
	428	if (
	429	editedItem._id == this.courseDiscussionData[i].forumThread[j]._id
	430	) {
	431	this.courseDiscussionData[i].forumThread[
	432	j
	433	].showUpdateReplyThread = true;
	434	this.courseDiscussionData[i].forumThread[
	435	j
	436	].showDescriptionReplyThread = false;
	437	}
	438	}
	439	arrayOfcourseDiscussionData.push(this.courseDiscussionData[i]);
	440	}
	441	this.courseDiscussionData = arrayOfcourseDiscussionData;
	442	},
	443	updateRelpyThreadDiscussion(replyThread, selected) {
	444	this.showLoader = true;
	445	var payloadData = {
	446	forumThreadId: replyThread._id,
	447	courseDiscussionId: selected._id,
	448	studentId: localStorage.getItem("parentStudentId"),
	449	description: replyThread.description
	450	};
	451	http()
	452	.put("/updateForumThread", payloadData)
	453	.then(response => {
	454	this.showLoader = false;
	455	this.getDiscussionesThread();
	456	})
	457	.catch(error => {
	458	this.showLoader = false;
	459	});
	460	},
	461	deleteRelpyThreadDiscussion(id, courseDiscussionId) {
	462	this.showLoader = true;
	463	var payloadData = {
	464	forumThreadId: id,
	465	courseDiscussionId: courseDiscussionId
	466	};
	467	http()
	468	.put(
	469	"/deleteForumThread",
	470	confirm("Are you sure you want to delete this?") && payloadData
	471	)
	472	.then(response => {
	473	this.showLoader = false;
	474	this.getDiscussionesThread();
	475	})
	476	.catch(error => {
	477	this.showLoader = false;
	478	});
	479	}
	480	},
	481	async created() {
	482	this.loginId = this.$store.state.id;
	483	/* getStudentCourses - to get courseData - defined in GetApis.js*/
	484	await this.getStudentCourses({
	485	classId: localStorage.getItem("parentClassId"),
	486	studentId: localStorage.getItem("parentStudentId")
	487	});
	488	}
	489	};
	490	</script>
	491	<style scoped>
	492	.side-bar-color {
	493	color: #827bfa !important;
	494	/* border-top-right-radius: 74px !important; */
	495	}
	496	.card-border {
	497	border: 1px #bdbdbd solid;
	498	border-radius: 3px;
	499	}
	500	.reply-desc {
	501	border: 1px solid #f2f2f2;
	502	}
	503	.open-dialog-button {
	504	background: #827bfa !important;
	505	border-color: #827bfa !important;
	506	text-transform: none !important;
	507	}
	508
	509	.reply-btn {
	510	background: #feb83c !important;
	511	border-color: #feb83c !important;
	512	text-transform: none !important;
	513	-webkit-box-shadow: none !important;
	514	box-shadow: none !important;
	515	}
	516	</style>

src/pages/Dashboard/dashboard.vue

Diff comments View file @1eaabc5

1	<template>	1	<template>
2	<v-app id="pages-dasboard">	2	<v-app id="pages-dasboard">
3	<!-- **** VIEW PROFIL NOTICE BOARD **** -->	3	<!-- **** VIEW PROFIL NOTICE BOARD **** -->
4	<!-- <v-dialog v-model="dialogNotice" max-width="940px" scrollable>	4	<!-- <v-dialog v-model="dialogNotice" max-width="940px" scrollable>
5	<v-card>	5	<v-card>
6	<v-toolbar color="grey lighten-2" flat>	6	<v-toolbar color="grey lighten-2" flat>
7	<v-spacer></v-spacer>	7	<v-spacer></v-spacer>
8	<v-toolbar-title>	8	<v-toolbar-title>
9	<h3>Notice Board</h3>	9	<h3>Notice Board</h3>
10	</v-toolbar-title>	10	</v-toolbar-title>
11	<v-spacer></v-spacer>	11	<v-spacer></v-spacer>
12	<v-icon @click="closeNotice">close</v-icon>	12	<v-icon @click="closeNotice">close</v-icon>
13	</v-toolbar>	13	</v-toolbar>
14	<v-card-text>	14	<v-card-text>
15	<v-layout>	15	<v-layout>
16	<v-flex align-center justify-center layout text-xs-center class="mt-2">	16	<v-flex align-center justify-center layout text-xs-center class="mt-2">
17	<img src="/static/icon/user.png" width="70px" v-if="!notice.eventImageUrl" />	17	<img src="/static/icon/user.png" width="70px" v-if="!notice.eventImageUrl" />
18	<img :src="notice.eventImageUrl" width="280px" v-else-if="notice.eventImageUrl" />	18	<img :src="notice.eventImageUrl" width="280px" v-else-if="notice.eventImageUrl" />
19	</v-flex>	19	</v-flex>
20	</v-layout>	20	</v-layout>
21	<v-container grid-list-md>	21	<v-container grid-list-md>
22	<v-layout wrap>	22	<v-layout wrap>
23	<v-flex>	23	<v-flex>
24	<v-layout>	24	<v-layout>
25	<v-flex xs5 sm6>	25	<v-flex xs5 sm6>
26	<h5 class="right my-1">	26	<h5 class="right my-1">
27	<b>Title:</b>	27	<b>Title:</b>
28	</h5>	28	</h5>
29	</v-flex>	29	</v-flex>
30	<v-flex sm6 xs8>	30	<v-flex sm6 xs8>
31	<h5 class="my-1">{{ notice.title }}</h5>	31	<h5 class="my-1">{{ notice.title }}</h5>
32	</v-flex>	32	</v-flex>
33	</v-layout>	33	</v-layout>
34	<v-layout>	34	<v-layout>
35	<v-flex xs5 sm6>	35	<v-flex xs5 sm6>
36	<h5 class="right my-1">	36	<h5 class="right my-1">
37	<b>Description:</b>	37	<b>Description:</b>
38	</h5>	38	</h5>
39	</v-flex>	39	</v-flex>
40	<v-flex sm6 xs8>	40	<v-flex sm6 xs8>
41	<h5 class="my-1">{{ notice.description }}</h5>	41	<h5 class="my-1">{{ notice.description }}</h5>
42	</v-flex>	42	</v-flex>
43	</v-layout>	43	</v-layout>
44	</v-flex>	44	</v-flex>
45	</v-layout>	45	</v-layout>
46	</v-container>	46	</v-container>
47	</v-card-text>	47	</v-card-text>
48	</v-card>	48	</v-card>
49	</v-dialog>-->	49	</v-dialog>-->
50	<!-- <v-container fluid grid-list-xl> -->	50	<!-- <v-container fluid grid-list-xl> -->
51		51
52	<!-- LOADER -->	52	<!-- LOADER -->
53	<div class="loader" v-if="showLoader">	53	<div class="loader" v-if="showLoader">
54	<v-progress-circular indeterminate color="white"></v-progress-circular>	54	<v-progress-circular indeterminate color="white"></v-progress-circular>
55	</div>	55	</div>
56		56
57	<!-- SNACKBAR -->	57	<!-- SNACKBAR -->
58	<v-snackbar	58	<v-snackbar
59	:timeout="timeout"	59	:timeout="timeout"
60	:top="y === 'top'"	60	:top="y === 'top'"
61	:right="x === 'right'"	61	:right="x === 'right'"
62	:vertical="mode === 'vertical'"	62	:vertical="mode === 'vertical'"
63	v-model="snackbar"	63	v-model="snackbar"
64	:color="snackbarColor"	64	:color="snackbarColor"
65	>	65	>
66	{{ text }}	66	{{ text }}
67	<v-spacer></v-spacer>	67	<v-spacer></v-spacer>
68	<v-btn flat text @click="snackbar = false">X</v-btn>	68	<v-btn flat text @click="snackbar = false">X</v-btn>
69	</v-snackbar>	69	</v-snackbar>
70		70
71	<!-- DIALOG BOX EVENT DETAILS -->	71	<!-- DIALOG BOX EVENT DETAILS -->
72	<v-dialog v-model="viewEventDetails" max-width="500">	72	<v-dialog v-model="viewEventDetails" max-width="500">
73	<v-card flat class="card-style pa-2" dark>	73	<v-card flat class="card-style pa-2" dark>
74	<!-- TITLE -->	74	<!-- TITLE -->
75	<v-layout>	75	<v-layout>
76	<v-layout>	76	<v-layout>
77	<v-flex xs12>	77	<v-flex xs12>
78	<label class="title text-xs-center">{{particularEvent.title}}</label>	78	<label class="title text-xs-center">{{particularEvent.title}}</label>
79	<v-icon size="24" class="right" @click="viewEventDetails = false">cancel</v-icon>	79	<v-icon size="24" class="right" @click="viewEventDetails = false">cancel</v-icon>
80	</v-flex>	80	</v-flex>
81	</v-layout>	81	</v-layout>
82	</v-layout>	82	</v-layout>
83		83
84	<v-card-text>	84	<v-card-text>
85	<v-list dark class="card-style">	85	<v-list dark class="card-style">
86	<v-list-tile>	86	<v-list-tile>
87	<v-list-tile-content>	87	<v-list-tile-content>
88	<v-list-tile-title>Date Of Event : {{moment(particularEvent.dateOfEvent).format("DD MMMM, YYYY")}}</v-list-tile-title>	88	<v-list-tile-title>Date Of Event : {{moment(particularEvent.dateOfEvent).format("DD MMMM, YYYY")}}</v-list-tile-title>
89	</v-list-tile-content>	89	</v-list-tile-content>
90	</v-list-tile>	90	</v-list-tile>
91	<v-list-tile>	91	<v-list-tile>
92	<v-list-tile-content>	92	<v-list-tile-content>
93	<v-list-tile-title>Duration : {{particularEvent.duration}}</v-list-tile-title>	93	<v-list-tile-title>Duration : {{particularEvent.duration}}</v-list-tile-title>
94	</v-list-tile-content>	94	</v-list-tile-content>
95	</v-list-tile>	95	</v-list-tile>
96	</v-list>	96	</v-list>
97	</v-card-text>	97	</v-card-text>
98	</v-card>	98	</v-card>
99	</v-dialog>	99	</v-dialog>
100		100
101	<v-layout wrap row>	101	<v-layout wrap row>
102	<v-flex xs12 sm12 md9>	102	<v-flex xs12 sm12 md9>
103	<v-container fluid grid-list-xl>	103	<v-container fluid grid-list-xl>
104	<!-- *** Total Students *** -->	104	<!-- *** Total Students *** -->
105	<v-flex xs12 sm12 md12 v-if="$store.state.role != 'PARENT' ">	105	<v-layout wrap class v-if="$store.state.role != 'PARENT' ">
106	<v-layout wrap class>	106	<v-flex xs12 sm12 md3>
107	<v-flex xs12 sm12 md3>	107	<router-link :to="{ name:'Students' }">
108	<router-link :to="{ name:'Students' }">	108	<v-card class="card pink-bgcolor">
109	<v-card class="card pink-bgcolor">	109	<v-card-title primary-title class="titleCard white--text py-3">Students</v-card-title>
110	<v-card-title primary-title class="titleCard white--text py-3">Students</v-card-title>	110	<img src="/static/icon/student.png" class="ml-2" width="40" alt="icons" />
111	<img src="/static/icon/student.png" class="ml-2" width="40" alt="icons" />	111	<v-card-title class="headline py-1 white--text">{{ students.length }}</v-card-title>
112	<v-card-title class="headline py-1 white--text">{{ students.length }}</v-card-title>	112	</v-card>
113	</v-card>	113	</router-link>
114	</router-link>	114	</v-flex>
115	</v-flex>	115	<!-- *** Total Teachers*** -->
116	<!-- *** Total Teachers*** -->	116	<v-flex xs12 sm12 md3>
117	<v-flex xs12 sm12 md3>	117	<router-link :to="{ name:'Teachers' }">
118	<router-link :to="{ name:'Teachers' }">	118	<v-card flat class="card elevation-2 firozi-bgcolor">
119	<v-card flat class="card elevation-2 firozi-bgcolor">	119	<v-card-title primary-title class="titleCard white--text py-3">Teachers</v-card-title>
120	<v-card-title primary-title class="titleCard white--text py-3">Teachers</v-card-title>	120	<img src="/static/icon/teacher.png" class="ml-2" width="40" alt="icons" />
121	<img src="/static/icon/teacher.png" class="ml-2" width="40" alt="icons" />	121
		122	<v-card-title class="headline py-1 white--text">{{ teachers.length }}</v-card-title>
		123	</v-card>
		124	</router-link>
		125	</v-flex>
		126	<!-- *** Total Parents *** -->
		127	<v-flex xs12 sm12 md3>
		128	<router-link :to="{ name:'Parents' }">
		129	<v-card flat class="card yellow darken-3">
		130	<v-card-title primary-title class="titleCard white--text py-3">Parents</v-card-title>
		131	<img src="/static/icon/parents.png" class="ml-3" width="40px" alt="icons" />
		132	<v-card-title class="headline py-1 white--text">{{ parents.length }}</v-card-title>
		133	</v-card>
		134	</router-link>
		135	</v-flex>
		136	<!-- *** Total Class*** -->
		137	<v-flex xs12 sm12 md3>
		138	<router-link :to="{ name:'Class' }">
		139	<v-card flat class="card darkBlue-bgcolor">
		140	<v-card-title primary-title class="titleCard white--text py-3">Class</v-card-title>
		141	<img src="/static/icon/class.png" width="40" alt="icons" class="ml-2" />
		142	<v-card-title class="headline py-1 white--text">{{ classes.length }}</v-card-title>
		143	</v-card>
		144	</router-link>
		145	</v-flex>
		146	</v-layout>
122		147
123	<v-card-title class="headline py-1 white--text">{{ teachers.length }}</v-card-title>
124	</v-card>
125	</router-link>
126	</v-flex>
127	<!-- *** Total Parents *** -->
128	<v-flex xs12 sm12 md3>
129	<router-link :to="{ name:'Parents' }">
130	<v-card flat class="card yellow darken-3">
131	<v-card-title primary-title class="titleCard white--text py-3">Parents</v-card-title>
132	<img src="/static/icon/parents.png" class="ml-3" width="40px" alt="icons" />
133	<v-card-title class="headline py-1 white--text">{{ parents.length }}</v-card-title>
134	</v-card>
135	</router-link>
136	</v-flex>
137	<!-- *** Total Class*** -->
138	<v-flex xs12 sm12 md3>
139	<router-link :to="{ name:'Class' }">
140	<v-card flat class="card darkBlue-bgcolor">
141	<v-card-title primary-title class="titleCard white--text py-3">Class</v-card-title>
142	<img src="/static/icon/class.png" width="40" alt="icons" class="ml-2" />
143	<v-card-title class="headline py-1 white--text">{{ classes.length }}</v-card-title>
144	</v-card>
145	</router-link>
146	</v-flex>
147	</v-layout>
148	</v-flex>
149	<p	148	<p
150	v-if="studentsData.length === 0 && role == 'PARENT'"	149	v-if="studentsData.length === 0 && role == 'PARENT'"
151	class="text-center title grey lighten-4 error--text"	150	class="text-center title grey lighten-4 error--text"
152	>You have no student registered with school</p>	151	>You have no student registered with school</p>
153	<v-layout v-if="role != 'PARENT'">	152	<v-layout v-if="role != 'PARENT'">
154	<v-flex xs12>	153	<v-flex xs12>
155	<v-card class="card mt-2 account-Card">	154	<v-card class="card mt-2 account-Card">
156	<h4>	155	<h4>
157	<b>Account</b>	156	<b>Account</b>
158	</h4>	157	</h4>
159	<v-layout wrap>	158	<v-layout wrap>
160	<v-flex xs12 sm12 md3>	159	<v-flex xs12 sm12 md3>
161	<v-list two-line>	160	<v-list two-line>
162	<template>	161	<template>
163	<v-list-tile>	162	<v-list-tile>
164	<v-list-tile-avatar>	163	<v-list-tile-avatar>
165	<v-icon class="account-circle darkBlue-color">panorama_fish_eye</v-icon>	164	<v-icon class="account-circle darkBlue-color">panorama_fish_eye</v-icon>
166	</v-list-tile-avatar>	165	</v-list-tile-avatar>
167	<v-list-tile-content>	166	<v-list-tile-content>
168	<v-list-tile-title class="mt-2">	167	<v-list-tile-title class="mt-2">
169	<p class="subheading font-color">Fees</p>	168	<p class="subheading font-color">Fees</p>
170	</v-list-tile-title>	169	</v-list-tile-title>
171	<v-list-tile-title>Rs. {{ feeData.totalFees }}</v-list-tile-title>	170	<v-list-tile-title>Rs. {{ feeData.totalFees }}</v-list-tile-title>
172	</v-list-tile-content>	171	</v-list-tile-content>
173	</v-list-tile>	172	</v-list-tile>
174	<v-list-tile>	173	<v-list-tile>
175	<v-list-tile-avatar>	174	<v-list-tile-avatar>
176	<v-icon class="account-circle yellowDark-color">panorama_fish_eye</v-icon>	175	<v-icon class="account-circle yellowDark-color">panorama_fish_eye</v-icon>
177	</v-list-tile-avatar>	176	</v-list-tile-avatar>
178	<v-list-tile-content>	177	<v-list-tile-content>
179	<v-list-tile-title class="mt-2">	178	<v-list-tile-title class="mt-2">
180	<p class="subheading font-color">Collection</p>	179	<p class="subheading font-color">Collection</p>
181	</v-list-tile-title>	180	</v-list-tile-title>
182	<v-list-tile-title>Rs. {{ feeData.totalCollection }}</v-list-tile-title>	181	<v-list-tile-title>Rs. {{ feeData.totalCollection }}</v-list-tile-title>
183	</v-list-tile-content>	182	</v-list-tile-content>
184	</v-list-tile>	183	</v-list-tile>
185	<v-list-tile>	184	<v-list-tile>
186	<v-list-tile-avatar>	185	<v-list-tile-avatar>
187	<v-icon class="account-circle pink-color">panorama_fish_eye</v-icon>	186	<v-icon class="account-circle pink-color">panorama_fish_eye</v-icon>
188	</v-list-tile-avatar>	187	</v-list-tile-avatar>
189	<v-list-tile-content>	188	<v-list-tile-content>
190	<v-list-tile-title class="mt-2">	189	<v-list-tile-title class="mt-2">
191	<p class="subheading font-color">Expences</p>	190	<p class="subheading font-color">Expences</p>
192	</v-list-tile-title>	191	</v-list-tile-title>
193	<v-list-tile-title>Rs. {{ expenseData.sum }}</v-list-tile-title>	192	<v-list-tile-title>Rs. {{ expenseData.sum }}</v-list-tile-title>
194	</v-list-tile-content>	193	</v-list-tile-content>
195	</v-list-tile>	194	</v-list-tile>
196	</template>	195	</template>
197	</v-list>	196	</v-list>
198	</v-flex>	197	</v-flex>
199	<v-flex xs12 sm12 md9 lg9>	198	<v-flex xs12 sm12 md9 lg9>
200	<div id="chart">	199	<div id="chart">
201	<div v-if="this.series">	200	<div v-if="this.series">
202	<apexchart	201	<apexchart
203	type="bar"	202	type="bar"
204	height="250"	203	height="250"
205	style="max-width: 800px !important"	204	style="max-width: 800px !important"
206	:options="chartOptions"	205	:options="chartOptions"
207	:series="series"	206	:series="series"
208	v-show="true"	207	v-show="true"
209	></apexchart>	208	></apexchart>
210	</div>	209	</div>
211	</div>	210	</div>
212	</v-flex>	211	</v-flex>
213	</v-layout>	212	</v-layout>
214	</v-card>	213	</v-card>
215	</v-flex>	214	</v-flex>
216	</v-layout>	215	</v-layout>
217	<v-card class="mt-2 card" v-if="role != 'PARENT'">	216	<v-card class="mt-2 card" v-if="role != 'PARENT'">
218	<!-- <full-calendar	217	<!-- <full-calendar
219	ref="calendar"	218	ref="calendar"
220	defaultView="month"	219	defaultView="month"
221	droppable="false"	220	droppable="false"
222	:events="events"	221	:events="events"
223	:config="config"	222	:config="config"
224	></full-calendar>-->	223	></full-calendar>-->
225	<h4 class="pa-3">	224	<h4 class="pa-3">
226	<b>Notice</b>	225	<b>Notice</b>
227	</h4>	226	</h4>
228		227
229	<v-data-table	228	<v-data-table
230	:items="noticeData"	229	:items="noticeData"
231	class="elevation-0"	230	class="elevation-0"
232	flat	231	flat
233	hide-actions	232	hide-actions
234	hide-headers	233	hide-headers
235	style="border-spacing: 0 !important;"	234	style="border-spacing: 0 !important;"
236	>	235	>
237	<template	236	<template
238	slot="items"	237	slot="items"
239	slot-scope="props"	238	slot-scope="props"
240	v-if="props.index < 5"	239	v-if="props.index < 5"
241	style="border-spacing: 0 !important;"	240	style="border-spacing: 0 !important;"
242	>	241	>
243	<tr class="td-notice">	242	<tr class="td-notice">
244	<td class="grey--text" style="width:18px">{{ props.index + 1}}</td>	243	<td class="grey--text" style="width:18px">{{ props.index + 1}}</td>
245	<td>	244	<td>
246	<span class="grey--text caption">{{ date(props.item.created) }}</span>	245	<span class="grey--text caption">{{ date(props.item.created) }}</span>
247	<br />	246	<br />
248	<span class="body-2">{{ props.item.title}}</span>	247	<span class="body-2">{{ props.item.title}}</span>
249	</td>	248	</td>
250	<td class="noticeDecritpion grey--text mt-2">{{ props.item.description}}</td>	249	<td class="noticeDecritpion grey--text mt-2">{{ props.item.description}}</td>
251		250
252	<td class="text-xs-center">	251	<td class="text-xs-center">
253	<span>	252	<span>
254	<v-tooltip top>	253	<v-tooltip top>
255	<img	254	<img
256	slot="activator"	255	slot="activator"
257	style="cursor:pointer; width:25px; height:25px; "	256	style="cursor:pointer; width:25px; height:25px; "
258	@click="profile"	257	@click="profile"
259	src="/static/icon/view.png"	258	src="/static/icon/view.png"
260	/>	259	/>
261	<span>View</span>	260	<span>View</span>
262	</v-tooltip>	261	</v-tooltip>
263	</span>	262	</span>
264	</td>	263	</td>
265	</tr>	264	</tr>
266	</template>	265	</template>
267	</v-data-table>	266	</v-data-table>
268	</v-card>	267	</v-card>
269	<!-- COURSES -->	268	<!-- COURSES -->
270	<v-layout v-if="role == 'PARENT'">	269	<v-layout v-if="role == 'PARENT'">
271	<v-flex xs12>	270	<v-flex xs12>
272	<v-card class="card mt-2 account-Card">	271	<v-card class="card mt-2 account-Card">
273	<h4>	272	<h4>
274	<b>My Courses</b>	273	<b>My Courses</b>
275	</h4>	274	</h4>
276	<v-layout wrap>	275	<v-layout wrap>
277	<v-flex xs12 sm12>	276	<v-flex xs12 sm12>
278	<v-list two-line>	277	<v-list two-line>
279	<template>	278	<template>
280	<v-list-tile v-for="(course,i) in courseData" :key="i">	279	<v-list-tile v-for="(course,i) in courseData" :key="i">
281	<v-list-tile-avatar>	280	<v-list-tile-avatar>
282	<v-icon	281	<v-icon
283	class="account-circle darkBlue-color"	282	class="account-circle darkBlue-color"
284	style="cursor: pointer;"	283	style="cursor: pointer;"
285	>panorama_fish_eye</v-icon>	284	>panorama_fish_eye</v-icon>
286	</v-list-tile-avatar>	285	</v-list-tile-avatar>
287	<v-list-tile-content>	286	<v-list-tile-content>
288	<v-list-tile-title	287	<v-list-tile-title
289	style="cursor: pointer;"	288	style="cursor: pointer;"
290	@click="routeToCourseDetails(course._id)"	289	@click="routeToCourseDetails(course._id)"
291	>{{ course.courseName }}</v-list-tile-title>	290	>{{ course.courseName }}</v-list-tile-title>
292	</v-list-tile-content>	291	</v-list-tile-content>
293	</v-list-tile>	292	</v-list-tile>
294	</template>	293	</template>
295	</v-list>	294	</v-list>
296	</v-flex>	295	</v-flex>
297	</v-layout>	296	</v-layout>
298	</v-card>	297	</v-card>
299	</v-flex>	298	</v-flex>
300	</v-layout>	299	</v-layout>
301	<v-layout v-if="role == 'PARENT'">	300	<v-layout v-if="role == 'PARENT'">
302	<v-flex xs6>	301	<v-flex xs6>
303	<v-card class="mt-2 card">	302	<v-card class="mt-2 card">
304	<h4 class="pa-3">	303	<h4 class="pa-3">
305	<b>Latest Annoucements</b>	304	<b>Latest Annoucements</b>
306	</h4>	305	</h4>
307		306
308	<v-data-table	307	<v-data-table
309	:items="annoucementData"	308	:items="annoucementData"
310	class="elevation-0"	309	class="elevation-0"
311	flat	310	flat
312	hide-actions	311	hide-actions
313	hide-headers	312	hide-headers
314	style="border-spacing: 0 !important;"	313	style="border-spacing: 0 !important;"
315	>	314	>
316	<template	315	<template
317	slot="items"	316	slot="items"
318	slot-scope="props"	317	slot-scope="props"
319	v-if="props.index < 5"	318	v-if="props.index < 5"
320	style="border-spacing: 0 !important;"	319	style="border-spacing: 0 !important;"
321	>	320	>
322	<tr class="td-notice">	321	<tr class="td-notice">
323	<td class="grey--text" style="width:18px">{{ props.index + 1}}</td>	322	<td class="grey--text" style="width:18px">{{ props.index + 1}}</td>
324	<td>	323	<td>
325	<span class="grey--text caption">{{ date(props.item.created) }}</span>	324	<span class="grey--text caption">{{ date(props.item.created) }}</span>
326	<br />	325	<br />
327	<span class="body-2">{{ props.item.discussionType}}</span>	326	<span class="body-2">{{ props.item.discussionType}}</span>
328	</td>	327	</td>
329	<td class="text-xs-center">	328	<td class="text-xs-center">
330	<span>	329	<span>
331	<v-tooltip top>	330	<v-tooltip top>
332	<img	331	<img
333	slot="activator"	332	slot="activator"
334	style="cursor:pointer; width:25px; height:25px; "	333	style="cursor:pointer; width:25px; height:25px; "
335	src="/static/icon/view.png"	334	src="/static/icon/view.png"
336	/>	335	/>
337	<span>View</span>	336	<span>View</span>
338	</v-tooltip>	337	</v-tooltip>
339	</span>	338	</span>
340	</td>	339	</td>
341	</tr>	340	</tr>
342	</template>	341	</template>
343	</v-data-table>	342	</v-data-table>
344	</v-card>	343	</v-card>
345	</v-flex>	344	</v-flex>
346	<v-flex xs6>	345	<v-flex xs6>
347	<v-card class="mt-2 card">	346	<v-card class="mt-2 card">
348	<h4 class="pa-3">	347	<h4 class="pa-3">
349	<b>Online User</b>	348	<b>Online User</b>
350	</h4>	349	</h4>
351		350
352	<v-data-table	351	<v-data-table
353	:items="onlineUser"	352	:items="onlineUser"
354	class="elevation-0"	353	class="elevation-0"
355	flat	354	flat
356	hide-actions	355	hide-actions
357	hide-headers	356	hide-headers
358	style="border-spacing: 0 !important;"	357	style="border-spacing: 0 !important;"
359	>	358	>
360	<template	359	<template
361	slot="items"	360	slot="items"
362	slot-scope="props"	361	slot-scope="props"
363	v-if="props.index < 5"	362	v-if="props.index < 5"
364	style="border-spacing: 0 !important;"	363	style="border-spacing: 0 !important;"
365	>	364	>
366	<tr class="td-notice">	365	<tr class="td-notice">
367	<td class="grey--text" style="width:18px">{{ props.index + 1}}</td>	366	<td class="grey--text" style="width:18px">{{ props.index + 1}}</td>
368	<td>	367	<td>
369	<span class="body-2">{{ props.item.user }}</span>	368	<span class="body-2">{{ props.item.user }}</span>
370	</td>	369	</td>
371	<td class="text-xs-center">	370	<td class="text-xs-center">
372	<span>	371	<span>
373	<v-tooltip top>	372	<v-tooltip top>
374	<img	373	<img
375	slot="activator"	374	slot="activator"
376	style="cursor:pointer; width:25px; height:25px; "	375	style="cursor:pointer; width:25px; height:25px; "
377	src="/static/icon/view.png"	376	src="/static/icon/view.png"
378	/>	377	/>
379	<span>View</span>	378	<span>View</span>
380	</v-tooltip>	379	</v-tooltip>
381	</span>	380	</span>
382	</td>	381	</td>
383	</tr>	382	</tr>
384	</template>	383	</template>
385	</v-data-table>	384	</v-data-table>
386	</v-card>	385	</v-card>
387	</v-flex>	386	</v-flex>
388	</v-layout>	387	</v-layout>
389	</v-container>	388	</v-container>
390	</v-flex>	389	</v-flex>
391	<v-spacer></v-spacer>	390	<v-spacer></v-spacer>
392	<!-- SIDE BAR -->	391	<!-- SIDE BAR -->
393	<v-flex xs12 sm12 md3>	392	<v-flex xs12 sm12 md3>
394	<v-card height="100%" class="elevation-0 mt-3 profileDasboard">	393	<v-card height="100%" class="elevation-0 mt-3 profileDasboard">
395	<v-card-text class="px-2">	394	<v-card-text class="px-2">
396	<h4 class="text-xs-center py-3">	395	<h4 class="text-xs-center py-3">
397	<b>Profile</b>	396	<b>Profile</b>
398	</h4>	397	</h4>
399	<v-flex xs12 class="py-3">	398	<v-flex xs12 class="py-3">
400	<v-layout wrap>	399	<v-layout wrap>
401	<v-flex xs12 sm12 md4>	400	<v-flex xs12 sm12 md4>
402	<img src="/static/icon/user.png" v-if="!userData.schoolLogoUrl" width="80" />	401	<img src="/static/icon/user.png" v-if="!userData.schoolLogoUrl" width="80" />
403	<img :src="userData.schoolLogoUrl" v-else-if="userData.schoolLogoUrl" width="80" />	402	<img :src="userData.schoolLogoUrl" v-else-if="userData.schoolLogoUrl" width="80" />
404	</v-flex>	403	</v-flex>
405	<v-flex xs12 sm12 md6>	404	<v-flex xs12 sm12 md6>
406	<p class="mb-0 body-1">	405	<p class="mb-0 body-1">
407	<i>{{ userData.name }}</i>	406	<i>{{ userData.name }}</i>
408	</p>	407	</p>
409	<p class="mb-0 caption grey--text">{{ userData.email }}</p>	408	<p class="mb-0 caption grey--text">{{ userData.email }}</p>
410	<p class="mb-0 caption grey--text">{{ userData.mobile }}</p>	409	<p class="mb-0 caption grey--text">{{ userData.mobile }}</p>
411	<address class="caption grey--text mb-3">{{ userData.address }}</address>	410	<address class="caption grey--text mb-3">{{ userData.address }}</address>
412	</v-flex>	411	</v-flex>
413	</v-layout>	412	</v-layout>
414	</v-flex>	413	</v-flex>
415	<hr />	414	<hr />
416	<div class="text-xs-center py-3 subheading font-weight-bold">Calender</div>	415	<div class="text-xs-center py-3 subheading font-weight-bold">Calender</div>
417	<vue-event-calendar :events="activityEvents" @day-changed="handleDayChanged($event)"></vue-event-calendar>	416	<vue-event-calendar :events="activityEvents" @day-changed="handleDayChanged($event)"></vue-event-calendar>
418	<!-- LATEST ACTIVITY -->	417	<!-- LATEST ACTIVITY -->
419	<v-card class="my-3 elevation-0">	418	<v-card class="my-3 elevation-0">
420	<v-card-text>	419	<v-card-text>
421	<v-card-title class="justify-center subheading font-weight-bold">Latest Events</v-card-title>	420	<v-card-title class="justify-center subheading font-weight-bold">Latest Events</v-card-title>
422	<div	421	<div
423	v-for="(activity,index) in activityList"	422	v-for="(activity,index) in activityList"
424	:key="index"	423	:key="index"
425	class="mt-2"	424	class="mt-2"
426	style="cursor: pointer;"	425	style="cursor: pointer;"
427	@click="seeEventDetails(activity)"	426	@click="seeEventDetails(activity)"
428	>	427	>
429	<span	428	<span
430	:style="{ 'background-color': colorsArray[index%colorsArray.length] }"	429	:style="{ 'background-color': colorsArray[index%colorsArray.length] }"
431	style="height: 12px;width: 12px;border-radius: 50%;display: inline-block;vertical-align: top;"	430	style="height: 12px;width: 12px;border-radius: 50%;display: inline-block;vertical-align: top;"
432	></span>	431	></span>
433	<div style="display: inline-block;" class="ml-2">	432	<div style="display: inline-block;" class="ml-2">
434	<div v-if="$store.state.role === 'PARENT' ">	433	<div v-if="$store.state.role === 'PARENT' ">
435	<div	434	<div
436	class="grey--text lighten-1 caption"	435	class="grey--text lighten-1 caption"
437	v-if="activity.meetingEvent"	436	v-if="activity.meetingEvent"
438	>{{moment(activity.meetingEvent.dateOfEvent).format("DD MMMM, YYYY")}}</div>	437	>{{moment(activity.meetingEvent.dateOfEvent).format("DD MMMM, YYYY")}}</div>
439	<div	438	<div
440	class="body-2"	439	class="body-2"
441	v-if="activity.meetingEvent"	440	v-if="activity.meetingEvent"
442	>{{activity.meetingEvent.title}}</div>	441	>{{activity.meetingEvent.title}}</div>
443	</div>	442	</div>
444		443
445	<!-- LATEST EVENTS FOR TEACHER -->	444	<!-- LATEST EVENTS FOR TEACHER -->
446	<div v-if="role == 'TEACHER'">	445	<div v-if="role == 'TEACHER'">
447	<div	446	<div
448	class="grey--text lighten-1 caption"	447	class="grey--text lighten-1 caption"
449	v-if="activity.dateOfEvent"	448	v-if="activity.dateOfEvent"
450	>{{moment(activity.dateOfEvent).format("DD MMMM, YYYY")}}</div>	449	>{{moment(activity.dateOfEvent).format("DD MMMM, YYYY")}}</div>
451	<div class="body-2" v-if="activity.title">{{activity.title}}</div>	450	<div class="body-2" v-if="activity.title">{{activity.title}}</div>
452	</div>	451	</div>
453	</div>	452	</div>
454	</div>	453	</div>
455	<div v-if="activityList.length == 0">	454	<div v-if="activityList.length == 0">
456	<p class="text-center title grey lighten-4 error--text">No Data Found!</p>	455	<p class="text-center title grey lighten-4 error--text">No Data Found!</p>
457	</div>	456	</div>
458	</v-card-text>	457	</v-card-text>
459	</v-card>	458	</v-card>
460	</v-card-text>	459	</v-card-text>
461	</v-card>	460	</v-card>
462	</v-flex>	461	</v-flex>
463	</v-layout>	462	</v-layout>
464		463
465	<v-dialog v-model="dialog" max-width="500">	464	<v-dialog v-model="dialog" max-width="500">
466	<v-card color="grey lighten-4" flat>	465	<v-card color="grey lighten-4" flat>
467	<v-toolbar dark color="fixcolors">	466	<v-toolbar dark color="fixcolors">
468	<v-spacer></v-spacer>	467	<v-spacer></v-spacer>
469	<v-btn icon @click="dialog= false">	468	<v-btn icon @click="dialog= false">
470	<v-icon>close</v-icon>	469	<v-icon>close</v-icon>
471	</v-btn>	470	</v-btn>
472	</v-toolbar>	471	</v-toolbar>
473	<v-flex class="py-4">	472	<v-flex class="py-4">
474	<v-list-tile>	473	<v-list-tile>
475	<v-list-tile-action>	474	<v-list-tile-action>
476	<v-icon>edit</v-icon>	475	<v-icon>edit</v-icon>
477	</v-list-tile-action>	476	</v-list-tile-action>
478	<v-list-tile-content>	477	<v-list-tile-content>
479	<v-list-tile-title>{{ selected.title }}</v-list-tile-title>	478	<v-list-tile-title>{{ selected.title }}</v-list-tile-title>
480	</v-list-tile-content>	479	</v-list-tile-content>
481	</v-list-tile>	480	</v-list-tile>
482	<v-list-tile>	481	<v-list-tile>
483	<v-list-tile-action>	482	<v-list-tile-action>
484	<v-icon>access_time</v-icon>	483	<v-icon>access_time</v-icon>
485	</v-list-tile-action>	484	</v-list-tile-action>
486	<v-list-tile-content>	485	<v-list-tile-content>
487	<v-list-tile-title>{{ date(selected.start)}}</v-list-tile-title>	486	<v-list-tile-title>{{ date(selected.start)}}</v-list-tile-title>
488	</v-list-tile-content>	487	</v-list-tile-content>
489	</v-list-tile>	488	</v-list-tile>
490	</v-flex>	489	</v-flex>
491	</v-card>	490	</v-card>
492	</v-dialog>	491	</v-dialog>
493	</v-app>	492	</v-app>
494	</template>	493	</template>
495		494
496	<script>	495	<script>
497	import http from "@/Services/http.js";	496	import http from "@/Services/http.js";
498	import moment from "moment";	497	import moment from "moment";
499	import AllApiCalls from "@/Services/AllApiCalls.js";	498	import AllApiCalls from "@/Services/AllApiCalls.js";
500	// import { FunctionalCalendar } from "vue-functional-calendar";	499	// import { FunctionalCalendar } from "vue-functional-calendar";
501		500
502	export default {	501	export default {
503	components: {	502	components: {
504	// FunctionalCalendar	503	// FunctionalCalendar
505	},	504	},
506	mixins: [AllApiCalls],	505	mixins: [AllApiCalls],
507	data() {	506	data() {
508	return {	507	return {
509	// data: {	508	// data: {
510	// clieckedToday: false	509	// clieckedToday: false
511	// },	510	// },
512	// markedDates: ["16/4/2019", "18/4/2019", "20/4/2019", "21/4/2019"],	511	// markedDates: ["16/4/2019", "18/4/2019", "20/4/2019", "21/4/2019"],
513	// calendarData: {},	512	// calendarData: {},
514	// calendar: {},	513	// calendar: {},
515		514
516	// DIALOG BOX EVENT DETAILS	515	// DIALOG BOX EVENT DETAILS
517	viewEventDetails: false,	516	viewEventDetails: false,
518		517
519	// CALENDER	518	// CALENDER
520	moment: moment,	519	moment: moment,
521	activityEvents: [],	520	activityEvents: [],
522	onlineUser: [	521	onlineUser: [
523	{	522	{
524	user: "Student Demo"	523	user: "Student Demo"
525	},	524	},
526	{	525	{
527	user: "Teacher Demo"	526	user: "Teacher Demo"
528	},	527	},
529	{	528	{
530	user: "Priyansh Gupta"	529	user: "Priyansh Gupta"
531	},	530	},
532	{	531	{
533	user: "Gaurav Aggarwal"	532	user: "Gaurav Aggarwal"
534	},	533	},
535	{	534	{
536	user: "Approve Arorra"	535	user: "Approve Arorra"
537	}	536	}
538	],	537	],
539	showLoader: false,	538	showLoader: false,
540	calendarData: {},	539	calendarData: {},
541	dialog: false,	540	dialog: false,
542	dialogNotice: false,	541	dialogNotice: false,
543	HolidaysList: [],	542	HolidaysList: [],
544	EventsList: [],	543	EventsList: [],
545	events: [],	544	events: [],
546	config: {	545	config: {
547	eventClick: event => {	546	eventClick: event => {
548	this.selected = event;	547	this.selected = event;
549	this.dialog = true;	548	this.dialog = true;
550	}	549	}
551	},	550	},
552	selected: {},	551	selected: {},
553	barGraph: [],	552	barGraph: [],
554	// notice: {},	553	// notice: {},
555	userData: {},	554	userData: {},
556	dated: new Date(2018, 0, 9),	555	dated: new Date(2018, 0, 9),
557	userList: [],	556	userList: [],
558	sectionList: [],	557	sectionList: [],
559	students: "",	558	students: "",
560	parents: "",	559	parents: "",
561	teachers: "",	560	teachers: "",
562	classes: "",	561	classes: "",
563	noticeData: [],	562	noticeData: [],
564	expenseData: [],	563	expenseData: [],
565	feeData: [],	564	feeData: [],
566	collectionData: [],	565	collectionData: [],
567	courseData: [],	566	courseData: [],
568	studentsData: [],	567	studentsData: [],
569	annoucementData: [],	568	annoucementData: [],
570	role: "",	569	role: "",
571	attrs: [	570	attrs: [
572	{	571	{
573	key: "today",	572	key: "today",
574	highlight: true,	573	highlight: true,
575	dates: new Date()	574	dates: new Date()
576	}	575	}
577	],	576	],
578	drawer: true,	577	drawer: true,
579	items: [	578	items: [
580	{ title: "Home", icon: "dashboard" },	579	{ title: "Home", icon: "dashboard" },
581	{ title: "About", icon: "question_answer" }	580	{ title: "About", icon: "question_answer" }
582	],	581	],
583	right: null,	582	right: null,
584		583
585	series: [	584	series: [
586	{	585	{
587	name: "Total",	586	name: "Total",
588	data: []	587	data: []
589	}	588	}
590	],	589	],
591	chartOptions: {	590	chartOptions: {
592	chart: {	591	chart: {
593	type: "bar",	592	type: "bar",
594	height: 150,	593	height: 150,
595	stacked: true	594	stacked: true
596	// animations: {	595	// animations: {
597	// enabled: true,	596	// enabled: true,
598	// easing: "easeinout",	597	// easing: "easeinout",
599	// speed: 1200,	598	// speed: 1200,
600	// animateGradually: {	599	// animateGradually: {
601	// enabled: true,	600	// enabled: true,
602	// delay: 450	601	// delay: 450
603	// },	602	// },
604	// dynamicAnimation: {	603	// dynamicAnimation: {
605	// enabled: true,	604	// enabled: true,
606	// speed: 450	605	// speed: 450
607	// }	606	// }
608	// }	607	// }
609	},	608	},
610	plotOptions: {	609	plotOptions: {
611	bar: {	610	bar: {
612	horizontal: false,	611	horizontal: false,
613	columnWidth: "25%",	612	columnWidth: "25%",
614	// endingShape: "rounded",	613	// endingShape: "rounded",
615	distributed: true	614	distributed: true
616	}	615	}
617	},	616	},
618	responsive: [	617	responsive: [
619	{	618	{
620	breakpoint: 480,	619	breakpoint: 480,
621	options: {	620	options: {
622	legend: {	621	legend: {
623	position: "bottom",	622	position: "bottom",
624	offsetX: -10,	623	offsetX: -10,
625	offsetY: 0	624	offsetY: 0
626	}	625	}
627	}	626	}
628	}	627	}
629	],	628	],
630	legend: {	629	legend: {
631	show: false	630	show: false
632	},	631	},
633	colors: ["#7852cc", "#f9a825", "#ff8a89"],	632	colors: ["#7852cc", "#f9a825", "#ff8a89"],
634	dataLabels: {	633	dataLabels: {
635	enabled: false	634	enabled: false
636	},	635	},
637	stroke: {	636	stroke: {
638	show: true,	637	show: true,
639	width: 2,	638	width: 2,
640	colors: ["transparent"]	639	colors: ["transparent"]
641	},	640	},
642	xaxis: {	641	xaxis: {
643	categories: ["Fee", "Collections", "Expences"]	642	categories: ["Fee", "Collections", "Expences"]
644	},	643	},
645	yaxis: {	644	yaxis: {
646	title: {	645	title: {
647	text: ""	646	text: ""
648	}	647	}
649	},	648	},
650	fill: {	649	fill: {
651	opacity: 1	650	opacity: 1
652	},	651	},
653	tooltip: {	652	tooltip: {
654	y: {	653	y: {
655	formatter: function(val, opts) {	654	formatter: function(val, opts) {
656	// console.log("opts",opts.w.config.xaxis.categories)	655	// console.log("opts",opts.w.config.xaxis.categories)
657	return "" + val + " ";	656	return "" + val + " ";
658	}	657	}
659	}	658	}
660	}	659	}
661	},	660	},
662		661
663	// LATEST ACTIVITY	662	// LATEST ACTIVITY
664	colorsArray: ["#ff8a89", "#71d9ea", "#7852cc", "#F9A825"],	663	colorsArray: ["#ff8a89", "#71d9ea", "#7852cc", "#F9A825"],
665	activityList: []	664	activityList: []
666	};	665	};
667	},	666	},
668	methods: {	667	methods: {
669	async handleDayChanged(e) {	668	async handleDayChanged(e) {
670	console.log("date-changed - ", e);	669	console.log("date-changed - ", e);
671	await this.getParticularMeetingEvent({	670	await this.getParticularMeetingEvent({
672	meetingEventId: e.events[0]._id	671	meetingEventId: e.events[0]._id
673	});	672	});
674	this.viewEventDetails = true;	673	this.viewEventDetails = true;
675	},	674	},
676	async seeEventDetails(activity) {	675	async seeEventDetails(activity) {
677	if (this.$store.state.role === "TEACHER") {	676	if (this.$store.state.role === "TEACHER") {
678	await this.getParticularMeetingEvent({ meetingEventId: activity._id });	677	await this.getParticularMeetingEvent({ meetingEventId: activity._id });
679	this.viewEventDetails = true;	678	this.viewEventDetails = true;
680	}	679	}
681	if (this.$store.state.role === "PARENT") {	680	if (this.$store.state.role === "PARENT") {
682	await this.getParticularMeetingEvent({	681	await this.getParticularMeetingEvent({
683	meetingEventId: activity.meetingEvent._id	682	meetingEventId: activity.meetingEvent._id
684	});	683	});
685	this.viewEventDetails = true;	684	this.viewEventDetails = true;
686	}	685	}
687	},	686	},
688	async routeToCourseDetails(courseId) {	687	async routeToCourseDetails(courseId) {
689	/* getParticularCourseDetail- To get courseDetail - defined in GetApis.js*/	688	/* getParticularCourseDetail- To get courseDetail - defined in GetApis.js*/
690	let response = await this.getParticularCourseDetail(courseId);	689	let response = await this.getParticularCourseDetail(courseId);
691		690
692	/* If the response is null then dont route */	691	/* If the response is null then dont route */
693	if (response.data.data.length > 0) {	692	if (response.data.data.length > 0) {
694	this.$router.push({	693	this.$router.push({
695	name: "Course Details",	694	name: "Course Details",
696	query: { courseId: courseId }	695	query: { courseId: courseId }
697	});	696	});
698	} else {	697	} else {
699	this.seeSnackbar("No Data Available", "warning");	698	this.seeSnackbar("No Data Available", "warning");
700	}	699	}
701	},	700	},
702		701
703	closeNotice() {	702	closeNotice() {
704	this.dialogNotice = false;	703	this.dialogNotice = false;
705	},	704	},
706	profile() {	705	profile() {
707	// this.editedIndex = this.desserts.indexOf(item);	706	// this.editedIndex = this.desserts.indexOf(item);
708	// this.notice = Object.assign({}, item);	707	// this.notice = Object.assign({}, item);
709	// this.dialogNotice = true;	708	// this.dialogNotice = true;
710	this.$router.push({ name: "NoticeBoard" });	709	this.$router.push({ name: "NoticeBoard" });
711	},	710	},
712	date: function(date) {	711	date: function(date) {
713	return moment(date).format("MMMM DD, YYYY HH:mm");	712	return moment(date).format("MMMM DD, YYYY HH:mm");
714	},	713	},
715	activityDate(date) {	714	activityDate(date) {
716	return moment(date).format("MMMM DD, YYYY");	715	return moment(date).format("MMMM DD, YYYY");
717	},	716	},
718	refreshEvents() {	717	refreshEvents() {
719	this.$refs.calendar.$emit("refetch-events");	718	this.$refs.calendar.$emit("refetch-events");
720	},	719	},
721	removeEvent() {	720	removeEvent() {
722	this.$refs.calendar.$emit("remove-event", this.selected);	721	this.$refs.calendar.$emit("remove-event", this.selected);
723	this.selected = {};	722	this.selected = {};
724	},	723	},
725	eventSelected(event) {	724	eventSelected(event) {
726	this.selected = event;	725	this.selected = event;
727	console.log("this.selected", this.selected);	726	console.log("this.selected", this.selected);
728	},	727	},
729	// eventDropStart: function(event) {	728	// eventDropStart: function(event) {
730	// event.editable = false;	729	// event.editable = false;
731	// },	730	// },
732	eventCreated(...test) {	731	eventCreated(...test) {
733	console.log(test);	732	console.log(test);
734	},	733	},
735	getStudents() {	734	getStudents() {
736	http()	735	http()
737	.get("/getStudentsList", {	736	.get("/getStudentsList", {
738	headers: {	737	headers: {
739	Authorization: "Bearer " + this.token	738	Authorization: "Bearer " + this.token
740	}	739	}
741	})	740	})
742	.then(response => {	741	.then(response => {
743	this.students = response.data.data;	742	this.students = response.data.data;
744	this.showLoader = false;	743	this.showLoader = false;
745	})	744	})
746	.catch(error => {	745	.catch(error => {
747	// console.log("err====>", err);	746	// console.log("err====>", err);
748	this.showLoader = false;	747	this.showLoader = false;
749	if (error.response.status === 401) {	748	if (error.response.status === 401) {
750	this.$router.replace({ path: "/" });	749	this.$router.replace({ path: "/" });
751	this.$store.dispatch("setToken", null);	750	this.$store.dispatch("setToken", null);
752	this.$store.dispatch("Id", null);	751	this.$store.dispatch("Id", null);
753	}	752	}
754	});	753	});
755	},	754	},
756	getParents() {	755	getParents() {
757	http()	756	http()
758	.get("/getParentsList", {	757	.get("/getParentsList", {
759	headers: {	758	headers: {
760	Authorization: "Bearer " + this.token	759	Authorization: "Bearer " + this.token
761	}	760	}
762	})	761	})
763	.then(response => {	762	.then(response => {
764	this.parents = response.data.data;	763	this.parents = response.data.data;
765	this.showLoader = false;	764	this.showLoader = false;
766	})	765	})
767	.catch(error => {	766	.catch(error => {
768	// console.log("err====>", err);	767	// console.log("err====>", err);
769	this.showLoader = false;	768	this.showLoader = false;
770	});	769	});
771	},	770	},
772	getTeachers() {	771	getTeachers() {
773	http()	772	http()
774	.get("/getTeachersList", {	773	.get("/getTeachersList", {
775	headers: {	774	headers: {
776	Authorization: "Bearer " + this.token	775	Authorization: "Bearer " + this.token
777	}	776	}
778	})	777	})
779	.then(response => {	778	.then(response => {
780	this.teachers = response.data.data;	779	this.teachers = response.data.data;
781	this.showLoader = false;	780	this.showLoader = false;
782	})	781	})
783	.catch(error => {	782	.catch(error => {
784	// console.log("err====>", err);	783	// console.log("err====>", err);
785	this.showLoader = false;	784	this.showLoader = false;
786	});	785	});
787	},	786	},
788	getClasses() {	787	getClasses() {
789	http()	788	http()
790	.get("/getClassesList", {	789	.get("/getClassesList", {
791	headers: {	790	headers: {
792	Authorization: "Bearer " + this.token	791	Authorization: "Bearer " + this.token
793	}	792	}
794	})	793	})
795	.then(response => {	794	.then(response => {
796	this.classes = response.data.data;	795	this.classes = response.data.data;
797	this.showLoader = false;	796	this.showLoader = false;
798	})	797	})
799	.catch(error => {	798	.catch(error => {
800	this.showLoader = false;	799	this.showLoader = false;
801	});	800	});
802	},	801	},
803	getNoticeData() {	802	getNoticeData() {
804	this.showLoader = true;	803	this.showLoader = true;
805	http()	804	http()
806	.get("/getEventsList", {	805	.get("/getEventsList", {
807	headers: {	806	headers: {
808	Authorization: "Bearer " + this.token	807	Authorization: "Bearer " + this.token
809	}	808	}
810	})	809	})
811	.then(response => {	810	.then(response => {
812	this.noticeData = response.data.data;	811	this.noticeData = response.data.data;
813	this.showLoader = false;	812	this.showLoader = false;
814	})	813	})
815	.catch(error => {	814	.catch(error => {
816	this.showLoader = false;	815	this.showLoader = false;
817	});	816	});
818	},	817	},
819	getUserData() {	818	getUserData() {
820	// this.showLoader = true;	819	// this.showLoader = true;
821	if (this.$store.state.role === "PARENT") {	820	if (this.$store.state.role === "PARENT") {
822	http()	821	http()
823	.get("/getParticularUserDetail", {	822	.get("/getParticularUserDetail", {
824	headers: {	823	headers: {
825	Authorization: "Bearer " + this.token	824	Authorization: "Bearer " + this.token
826	},	825	},
827	params: {	826	params: {
828	studentId: localStorage.getItem("parentStudentId")	827	studentId: localStorage.getItem("parentStudentId")
829	}	828	}
830	})	829	})
831	.then(response => {	830	.then(response => {
832	this.userData = response.data.data;	831	this.userData = response.data.data;
833	this.showLoader = false;	832	this.showLoader = false;
834	console.log("sdsdfsdfsd - ", response);	833	console.log("sdsdfsdfsd - ", response);
835	})	834	})
836	.catch(error => {	835	.catch(error => {
837	this.showLoader = false;	836	this.showLoader = false;
838	});	837	});
839	} else {	838	} else {
840	http()	839	http()
841	.get("/getParticularUserDetail", {	840	.get("/getParticularUserDetail", {
842	headers: {	841	headers: {
843	Authorization: "Bearer " + this.token	842	Authorization: "Bearer " + this.token
844	}	843	}
845	})	844	})
846	.then(response => {	845	.then(response => {
847	this.userData = response.data.data;	846	this.userData = response.data.data;
848	this.showLoader = false;	847	this.showLoader = false;
849	})	848	})
850	.catch(error => {	849	.catch(error => {
851	this.showLoader = false;	850	this.showLoader = false;
852	});	851	});
853	}	852	}
854	},	853	},
855		854
856	getFeesAndCollectionsData() {	855	getFeesAndCollectionsData() {
857	http()	856	http()
858	.get("/getTotalFeesAndCollections", {	857	.get("/getTotalFeesAndCollections", {
859	headers: {	858	headers: {
860	Authorization: "Bearer " + this.token	859	Authorization: "Bearer " + this.token
861	}	860	}
862	})	861	})
863	.then(response => {	862	.then(response => {
864	this.feeData = response.data.data;	863	this.feeData = response.data.data;
865	// this.collectionData = response.data.data;	864	// this.collectionData = response.data.data;
866	this.series[0].data[0] = this.feeData.totalFees;	865	this.series[0].data[0] = this.feeData.totalFees;
867	this.series[0].data[1] = this.feeData.totalCollection;	866	this.series[0].data[1] = this.feeData.totalCollection;
868	// console.log("this.series====", this.series);	867	// console.log("this.series====", this.series);
869		868
870	this.showLoader = false;	869	this.showLoader = false;
871	})	870	})
872	.catch(error => {	871	.catch(error => {
873	this.showLoader = false;	872	this.showLoader = false;
874	});	873	});
875	},	874	},
876	getExpensesData() {	875	getExpensesData() {
877	http()	876	http()
878	.get("/getTotalExpenses", {	877	.get("/getTotalExpenses", {
879	headers: {	878	headers: {
880	Authorization: "Bearer " + this.token	879	Authorization: "Bearer " + this.token
881	}	880	}
882	})	881	})
883	.then(response => {	882	.then(response => {
884	this.expenseData = response.data.data;	883	this.expenseData = response.data.data;
885	// var array = response.data.data.sum;	884	// var array = response.data.data.sum;
886	this.series[0].data[2] = this.expenseData.sum;	885	this.series[0].data[2] = this.expenseData.sum;
887	// this.series = [	886	// this.series = [
888	// {	887	// {
889	// name: "Total",	888	// name: "Total",
890	// data: array	889	// data: array
891	// }	890	// }
892	// ];	891	// ];
893	// console.log("this.series====", this.series);	892	// console.log("this.series====", this.series);
894	this.showLoader = false;	893	this.showLoader = false;
895	})	894	})
896	.catch(error => {	895	.catch(error => {
897	this.showLoader = false;	896	this.showLoader = false;
898	});	897	});
899	},	898	},
900	async getparentStudents() {	899	async getparentStudents() {
901	this.showLoader = true;	900	this.showLoader = true;
902	var parentStudentsId;	901	var parentStudentsId;
903	var classId;	902	var classId;
904	await http()	903	await http()
905	.get("/parentStudentsList")	904	.get("/parentStudentsList")
906	.then(response => {	905	.then(response => {
907	// console.log("resssssss", response.data.data.students[0].classId);	906	// console.log("resssssss", response.data.data.students[0].classId);
908	this.studentsData = response.data.data;	907	this.studentsData = response.data.data;
909	localStorage.setItem(	908	localStorage.setItem(
910	"parentStudentId",	909	"parentStudentId",
911	this.studentsData.students[0]._id	910	this.studentsData.students[0]._id
912	);	911	);
913	localStorage.setItem(	912	localStorage.setItem(
914	"parentClassId",	913	"parentClassId",
915	this.studentsData.students[0].classId	914	this.studentsData.students[0].classId
916	);	915	);
917		916
918	if (localStorage.getItem("parentStudentId") == null) {	917	if (localStorage.getItem("parentStudentId") == null) {
919	parentStudentsId = response.data.data.students[0].classId;	918	parentStudentsId = response.data.data.students[0].classId;
920	classId = response.data.data.students[0]._id;	919	classId = response.data.data.students[0]._id;
921	}	920	}
922	if (localStorage.getItem("parentStudentId")) {	921	if (localStorage.getItem("parentStudentId")) {
923	parentStudentsId = localStorage.getItem("parentStudentId");	922	parentStudentsId = localStorage.getItem("parentStudentId");
924	classId = localStorage.getItem("parentClassId");	923	classId = localStorage.getItem("parentClassId");
925	}	924	}
926		925
927	this.showLoader = false;	926	this.showLoader = false;
928	})	927	})
929	.catch(err => {	928	.catch(err => {
930	console.log("err====>", err);	929	console.log("err====>", err);
931	this.showLoader = false;	930	this.showLoader = false;
932	});	931	});
933	await this.getCourses(parentStudentsId, classId);	932	await this.getCourses(parentStudentsId, classId);
934	await this.getAnnoucementes(classId);	933	await this.getAnnoucementes(classId);
935	},	934	},
936	async getCourses(parentStudentsId, classId) {	935	async getCourses(parentStudentsId, classId) {
937	/* getStudentCourses - to get courseData - defined in GetApis.js*/	936	/* getStudentCourses - to get courseData - defined in GetApis.js*/
938	await this.getStudentCourses({	937	await this.getStudentCourses({
939	classId: classId,	938	classId: classId,
940	studentId: parentStudentsId	939	studentId: parentStudentsId
941	});	940	});
942	},	941	},
943	getAnnoucementes(classId) {	942	getAnnoucementes(classId) {
944	this.showLoader = true;	943	this.showLoader = true;
945	http()	944	http()
946	.get("/getAnnoucementesList", {	945	.get("/getAnnoucementesList", {
947	params: {	946	params: {
948	classId: classId	947	classId: classId
949	}	948	}
950	})	949	})
951	.then(response => {	950	.then(response => {
952	this.annoucementData = response.data.data;	951	this.annoucementData = response.data.data;
953	this.showLoader = false;	952	this.showLoader = false;
954	})	953	})
955	.catch(err => {	954	.catch(err => {
956	console.log("err====>", err);	955	console.log("err====>", err);
957	this.showLoader = false;	956	this.showLoader = false;
958	});	957	});
959	},	958	},
960	async getMeetingEventes() {	959	async getMeetingEventes() {
961	if (this.role == "TEACHER") {	960	if (this.role == "TEACHER") {
962	this.showLoader = true;	961	this.showLoader = true;
963	await http()	962	await http()
964	.get("/getMeetingEventesList", {	963	.get("/getMeetingEventesList", {
965	headers: {	964	headers: {
966	Authorization: "Bearer " + this.token	965	Authorization: "Bearer " + this.token
967	}	966	}
968	})	967	})
969	.then(response => {	968	.then(response => {
970	var activityList = response.data.data;	969	var activityList = response.data.data;
971	this.activityList = activityList;	970	this.activityList = activityList;
972	this.showLoader = false;	971	this.showLoader = false;
973		972
974	/* set activityEvents array to highlight event dates in calender */	973	/* set activityEvents array to highlight event dates in calender */
975	for (var i = 0; i < this.activityList.length; i++) {	974	for (var i = 0; i < this.activityList.length; i++) {
976	let obj = {};	975	let obj = {};
977	obj.date = moment(this.activityList[i].dateOfEvent).format(	976	obj.date = moment(this.activityList[i].dateOfEvent).format(
978	"YYYY/MM/DD"	977	"YYYY/MM/DD"
979	);	978	);
980	obj.title = this.activityList[i].title;	979	obj.title = this.activityList[i].title;
981	obj._id = this.activityList[i]._id;	980	obj._id = this.activityList[i]._id;
982	this.activityEvents.push(obj);	981	this.activityEvents.push(obj);
983	}	982	}
984	})	983	})
985	.catch(error => {	984	.catch(error => {
986	this.showLoader = false;	985	this.showLoader = false;
987	});	986	});
988	}	987	}
989	}	988	}
990	},	989	},
991		990
992	mounted() {	991	mounted() {
993	// = this.$store.state.schoolToken;	992	// = this.$store.state.schoolToken;
994	// console.log("this.$store.state.role", this.token);	993	// console.log("this.$store.state.role", this.token);
995	// this.getUsersList();	994	// this.getUsersList();
996	},	995	},
997		996
998	async created() {	997	async created() {
999	if (this.$store.state.role === "ADMIN") {	998	if (this.$store.state.role === "ADMIN") {
1000	this.token = this.$store.state.token;	999	this.token = this.$store.state.token;
1001	} else if (this.$store.state.schoolRole === "SUPERADMIN") {	1000	} else if (this.$store.state.schoolRole === "SUPERADMIN") {
1002	this.token = this.$store.state.schoolToken;	1001	this.token = this.$store.state.schoolToken;
1003	} else if (this.$store.state.role === "TEACHER") {	1002	} else if (this.$store.state.role === "TEACHER") {
1004	this.token = this.$store.state.token;	1003	this.token = this.$store.state.token;
1005	} else if (this.$store.state.role === "ACCOUNTANT") {	1004	} else if (this.$store.state.role === "ACCOUNTANT") {
1006	this.token = this.$store.state.token;	1005	this.token = this.$store.state.token;
1007	} else if (this.$store.state.role === "LIBRARIAN") {	1006	} else if (this.$store.state.role === "LIBRARIAN") {
1008	this.token = this.$store.state.token;	1007	this.token = this.$store.state.token;
1009	} else if (this.$store.state.role === "PARENT") {	1008	} else if (this.$store.state.role === "PARENT") {
1010	this.token = this.$store.state.token;	1009	this.token = this.$store.state.token;
1011	}	1010	}
1012	this.role = this.$store.state.role;	1011	this.role = this.$store.state.role;
1013	// console.log("role", this.$store.state.schoolRole,"tt",this.$store.state.schoolToken);	1012	// console.log("role", this.$store.state.schoolRole,"tt",this.$store.state.schoolToken);
1014	// this.getData();	1013	// this.getData();
1015	await this.getStudents();	1014	await this.getStudents();
1016	await this.getTeachers();	1015	await this.getTeachers();
1017	await this.getParents();	1016	await this.getParents();
1018	await this.getClasses();	1017	await this.getClasses();
1019	await this.getNoticeData();	1018	await this.getNoticeData();
1020	await this.getUserData();	1019	await this.getUserData();
1021	await this.getFeesAndCollectionsData();	1020	await this.getFeesAndCollectionsData();
1022	await this.getExpensesData();	1021	await this.getExpensesData();
1023	await this.getparentStudents();	1022	await this.getparentStudents();
1024	await this.getMeetingEventes();
1025		1023
1026	/* get Latest events list for student login*/	1024	/* get Latest events list for student login*/
1027	if (this.$store.state.role != "TEACHER") {	1025	if (this.$store.state.role == "PARENT") {
1028	let response = await this.studentMeetingEvents({	1026	let response = await this.studentMeetingEvents({
1029	studentId: localStorage.getItem("parentStudentId")	1027	studentId: localStorage.getItem("parentStudentId")

src/router/paths.js

Diff comments View file @1eaabc5

 export default [{
         path: '*',
         meta: {
             public: true,
         },
         redirect: {
             path: '/404'
         }
     },
     {
         path: '/404',
         meta: {
             public: true,
         },
         name: 'NotFound',
         component: () =>
-            import (
+            import(
                 /* webpackChunkName: "routes" */
                 /* webpackMode: "lazy-once" */
                 `@/pages/NotFound/NotFound.vue`
             )
     },
     {
         path: '*',
         meta: {},
         name: 'dashboardAdmin',
         props: (route) => ({
             type: route.query.type
         }),
         component: () =>
-            import (
+            import(
                 /* webpackChunkName: "routes" */
                 /* webpackMode: "lazy-once" */
                 `@/pages/Dashboard/dashboard.vue`
             )
     },
     {
         path: '/500',
         meta: {
             public: true,
         },
         name: 'ServerError',
         component: () =>
-            import (
+            import(
                 /* webpackChunkName: "routes" */
                 /* webpackMode: "lazy-once" */
                 `@/pages/NotFound/Error.vue`
             )
     },
     {
         path: '/changepassword',
         meta: {},
         name: 'changepassword',
         props: (route) => ({
             type: route.query.type
         }),
         component: () =>
-            import (
+            import(
                 /* webpackChunkName: "routes" */
                 /* webpackMode: "lazy-once" */
                 `@/pages/Authentication/changepassword.vue`
             )
     },
     {
         path: '/teachers',
         meta: {
             breadcrumb: false
         },
         name: 'Teachers',
         component: () =>
-            import (
+            import(
                 /* webpackChunkName: "routes" */
                 /* webpackMode: "lazy-once" */
                 `@/pages/Teachers/teachers.vue`
             )
     },
     {
         path: '/',
         meta: {
             public: true,
         },
         name: 'Login',
         component: () =>
-            import (
+            import(
                 /* webpackChunkName: "routes" */
                 /* webpackMode: "lazy-once" */
                 `@/pages/Authentication/Login.vue`
             )
     },
     {
         path: '/forgetpassword',
         meta: {
             public: true,
         },
         name: 'forgetpassword',
         component: () =>
-            import (
+            import(
                 /* webpackChunkName: "routes" */
                 /* webpackMode: "lazy-once" */
                 `@/pages/Authentication/forgetpassword.vue`
             )
     },
     {
         path: '/students',
         meta: {},
         name: 'Students',
         props: (route) => ({
             type: route.query.type
         }),
         component: () =>
-            import (
+            import(
                 /* webpackChunkName: "routes" */
                 /* webpackMode: "lazy-once" */
                 `@/pages/Students/students.vue`
             )
     },
     {
         path: '/class',
         meta: {},
         name: 'Class',
         props: (route) => ({
             type: route.query.type
         }),
         component: () =>
-            import (
+            import(
                 /* webpackChunkName: "routes" */
                 /* webpackMode: "lazy-once" */
                 `@/pages/Class/addclass.vue`
             )
     },
     {
         path: '/section',
         meta: {},
         name: 'Section',
         props: (route) => ({
             type: route.query.type
         }),
         component: () =>
-            import (
+            import(
                 /* webpackChunkName: "routes" */
                 /* webpackMode: "lazy-once" */
                 `@/pages/Section/section.vue`
             )
     },
     {
         path: '/noticeBoard',
         meta: {},
         name: 'Notice Board',
         props: (route) => ({
             type: route.query.type
         }),
         component: () =>
-            import (
+            import(
                 /* webpackChunkName: "routes" */
                 /* webpackMode: "lazy-once" */
                 `@/pages/NoticeBoard/noticeBoard.vue`
             )
     },
     {
         path: '/news',
         meta: {},
         name: 'News',
         props: (route) => ({
             type: route.query.type
         }),
         component: () =>
-            import (
+            import(
                 /* webpackChunkName: "routes" */
                 /* webpackMode: "lazy-once" */
                 `@/pages/News/news.vue`
             )
     },
     // {
     //   path: '/reminder',
     //   meta: { },
     //   name: 'reminder',
     //   props: (route) => ({ type: route.query.type }),
     //   component: () => import(
     //     /* webpackChunkName: "routes" */
     //     /* webpackMode: "lazy-once" */
     //     `@/pages/Reminder/reminder.vue`
     //   )
     // },
     {
         path: '/timeTable',
         meta: {},
         name: 'Time Table',
         props: (route) => ({
             type: route.query.type
         }),
         component: () =>
-            import (
+            import(
                 /* webpackChunkName: "routes" */
                 /* webpackMode: "lazy-once" */
                 `@/pages/TimeTable/timeTable.vue`
             )
     },
     {
         path: '/notification',
         meta: {},
         name: 'Notification',
         props: (route) => ({
             type: route.query.type
         }),
         component: () =>
-            import (
+            import(
                 /* webpackChunkName: "routes" */
                 /* webpackMode: "lazy-once" */
                 `@/pages/Notification/notification.vue`
             )
     },
     {
         path: '/parents',
         meta: {},
         name: 'Parents',
         props: (route) => ({
             type: route.query.type
         }),
         component: () =>
-            import (
+            import(
                 /* webpackChunkName: "routes" */
                 /* webpackMode: "lazy-once" */
                 `@/pages/Parent/parents.vue`
             )
     },
     // {
     //     path: '/subject',
     //     meta: {},
     //     name: 'Subject',
     //     props: (route) => ({ type: route.query.type }),
     //     component: () =>
     //         import (
     //             /* webpackChunkName: "routes" */
     //             /* webpackMode: "lazy-once" */
     //             `@/pages/Subjects/subjects.vue`
     //         )
     // },
     {
         path: '/dashboard',
         meta: {},
         name: 'Dashboard',
         props: (route) => ({
             type: route.query.type
         }),
         component: () =>
-            import (
+            import(
                 /* webpackChunkName: "routes" */
                 /* webpackMode: "lazy-once" */
                 `@/pages/Dashboard/dashboard.vue`
             )
     },
     {
         path: '/CourseDetails',
         meta: {},
         name: 'Course Details',
         props: (route) => ({
             type: route.query.type
         }),
         component: () =>
-            import (
+            import(
                 /* webpackChunkName: "routes" */
                 /* webpackMode: "lazy-once" */
                 `@/pages/Dashboard/CourseDetails.vue`
             )
     },
     {
         path: '/ChapterInfo',
         meta: {},
         name: 'Chapter Info',
         props: (route) => ({
             type: route.query.type
         }),
         component: () =>
-            import (
+            import(
                 /* webpackChunkName: "routes" */
                 /* webpackMode: "lazy-once" */
                 `@/pages/Dashboard/ChapterInfo.vue`
             )
     },
     {
+        path: '/LiveOnlineClass',
+        meta: {},
+        name: 'Live Online Class',
+        props: (route) => ({
+            type: route.query.type
+        }),
+        component: () =>
+            import(
+                /* webpackChunkName: "routes" */
+                /* webpackMode: "lazy-once" */
+                `@/pages/Dashboard/LiveOnlineClass.vue`
+            )
+    },
+    {
         path: '/CourseDiscussionForum',
         meta: {},
         name: 'Course Discussion Forum',
         props: (route) => ({
             type: route.query.type
         }),
         component: () =>
-            import (
+            import(
                 /* webpackChunkName: "routes" */
                 /* webpackMode: "lazy-once" */
                 `@/pages/Dashboard/CourseDiscussionForum.vue`
             )
     },
     {
         path: '/courseDiscussion',
         meta: {},
         name: 'Course Discussion',
         props: (route) => ({
             type: route.query.type
         }),
         component: () =>
-            import (
+            import(
                 /* webpackChunkName: "routes" */
                 /* webpackMode: "lazy-once" */
                 `@/pages/Course/courseDiscussion.vue`
             )
     },
     {
         path: '/courseDiscussionesForm/:discussionId',
         meta: {},
         name: 'Course Discussiones Fourm',
         props: (route) => ({
             type: route.query.type
         }),
         component: () =>
-            import (
+            import(
                 /* webpackChunkName: "routes" */
                 /* webpackMode: "lazy-once" */
                 `@/pages/Course/discussion.vue`
             )
     },
     {
         path: '/Announcement',
         meta: {},
         name: 'Announcement',
         props: (route) => ({
             type: route.query.type
         }),
         component: () =>
-            import (
+            import(
                 /* webpackChunkName: "routes" */
                 /* webpackMode: "lazy-once" */
                 `@/pages/Dashboard/Announcement.vue`
             )
     },
     {
         path: '/annoucementForum/:annoucementId',
         meta: {},
         name: 'Annoucement Forum',
         props: (route) => ({
             type: route.query.type
         }),
         component: () =>
-            import (
+            import(
                 /* webpackChunkName: "routes" */
                 /* webpackMode: "lazy-once" */
                 `@/pages/Annoucement/annoucementForum.vue`
             )
     },
     {
         path: '/socialMedia',
         meta: {},
         name: 'Social Media',
         props: (route) => ({
             type: route.query.type
         }),
         component: () =>
-            import (
+            import(
                 /* webpackChunkName: "routes" */
                 /* webpackMode: "lazy-once" */
                 `@/pages/socialMedia/socialMedia.vue`
             )
     },
     {
         path: '/gallery',
         meta: {},
         name: 'Gallery',
         props: (route) => ({
             type: route.query.type
         }),
         component: () =>
-            import (
+            import(
                 /* webpackChunkName: "routes" */
                 /* webpackMode: "lazy-once" */
                 `@/pages/Gallery/gallery.vue`
             )
     },
     {
         path: '/event',
         meta: {},
         name: 'Event',
         props: (route) => ({
             type: route.query.type
         }),
         component: () =>
-            import (
+            import(
                 /* webpackChunkName: "routes" */
                 /* webpackMode: "lazy-once" */
                 `@/pages/Event/event.vue`
             )
     },
     {
         path: '/holiday',
         meta: {},
         name: 'Holiday',
         props: (route) => ({
             type: route.query.type
         }),
         component: () =>
-            import (
+            import(
                 /* webpackChunkName: "routes" */
                 /* webpackMode: "lazy-once" */
                 `@/pages/Holiday/holiday.vue`
             )
     },
     {
         path: '/user',
         meta: {},
         name: 'User',
         props: (route) => ({
             type: route.query.type
         }),
         component: () =>
-            import (
+            import(
                 /* webpackChunkName: "routes" */
                 /* webpackMode: "lazy-once" */
                 `@/pages/User/user.vue`
             )
     },
     {
         path: '/AttendenceStudent',
         meta: {},
         name: 'Student Attendence',
         props: (route) => ({
             type: route.query.type
         }),
         component: () =>
-            import (
+            import(
                 /* webpackChunkName: "routes" */
                 /* webpackMode: "lazy-once" */
                 `@/pages/Attendence/studentAttendence.vue`
             )
     },
     {
         path: '/AttendenceTeacher',
         meta: {},
         name: 'Teacher Attendence',
         props: (route) => ({
             type: route.query.type
         }),
         component: () =>
-            import (
+            import(
                 /* webpackChunkName: "routes" */
                 /* webpackMode: "lazy-once" */
                 `@/pages/Attendence/teacherAttendence.vue`
             )
     },
     {
         path: '/salaryTemplate',
         meta: {},
         name: 'Salary Template',
         props: (route) => ({
             type: route.query.type
         }),
         component: () =>
-            import (
+            import(
                 `@/pages/Payroll/salaryTemplate.vue`
             )
     },
     {
         path: '/hourlyTemplate',
         meta: {},
         name: 'Hourly Template',
         props: (route) => ({
             type: route.query.type
         }),
         component: () =>
-            import (
+            import(
                 `@/pages/Payroll/hourlyTemplate.vue`
             )
     },
     {
         path: '/manageSalary',
         meta: {},
         name: 'Manage Salary',
         props: (route) => ({
             type: route.query.type
         }),
         component: () =>
-            import (
+            import(
                 `@/pages/Payroll/manageSalary.vue`
             )
     },
     // {
     //     path: '/makePayment',
     //     meta: {},
     //     name: 'Make Payment',
     //     props: (route) => ({ type: route.query.type }),
     //     component: () =>
     //         import (
     //             `@/pages/Payroll/makePayment.vue`
     //         )
     // },
     {
         path: '/AttendenceUser',
         meta: {},
         name: 'User Attendence',
         props: (route) => ({
             type: route.query.type
         }),
         component: () =>
-            import (
+            import(
                 /* webpackChunkName: "routes" */
                 /* webpackMode: "lazy-once" */
                 `@/pages/Attendence/userAttendence.vue`
             )
     },
     {
         path: '/feeTypes',
         meta: {},
         name: 'Fee Types',
         props: (route) => ({
             type: route.query.type
         }),
         component: () =>
-            import (
+            import(
                 /* webpackChunkName: "routes" */
                 /* webpackMode: "lazy-once" */
                 `@/pages/Account/feeTypes.vue`
             )
     },
     {
         path: '/invoice',
         meta: {},
         name: 'Invoice',
         props: (route) => ({
             type: route.query.type
         }),
         component: () =>
-            import (
+            import(
                 /* webpackChunkName: "routes" */
                 /* webpackMode: "lazy-once" */
                 `@/pages/Account/invoice.vue`
             )
     },
     {
         path: '/paymentHistory',
         meta: {},
         name: 'Payment History',
         props: (route) => ({
             type: route.query.type
         }),
         component: () =>
-            import (
+            import(
                 /* webpackChunkName: "routes" */
                 /* webpackMode: "lazy-once" */
                 `@/pages/Account/paymentHistory.vue`
             )
     },
     {
         path: '/expense',
         meta: {},
         name: 'Expense',
         props: (route) => ({
             type: route.query.type
         }),
         component: () =>
-            import (
+            import(
                 /* webpackChunkName: "routes" */
                 /* webpackMode: "lazy-once" */
                 `@/pages/Account/expense.vue`
             )
     },
     {
         path: '/income',
         meta: {},
         name: 'Income',
         props: (route) => ({
             type: route.query.type
         }),
         component: () =>
-            import (
+            import(
                 /* webpackChunkName: "routes" */
                 /* webpackMode: "lazy-once" */
                 `@/pages/Account/income.vue`
             )
     },
     {
         path: '/libraryMember',
         meta: {},
         name: 'Library Member',
         props: (route) => ({
             type: route.query.type
         }),
         component: () =>
-            import (
+            import(
                 /* webpackChunkName: "routes" */
                 /* webpackMode: "lazy-once" */
                 `@/pages/Library/member.vue`
             )
     },
     {
         path: '/books',
         meta: {},
         name: 'Books',
         props: (route) => ({
             type: route.query.type
         }),
         component: () =>
-            import (
+            import(
                 /* webpackChunkName: "routes" */
                 /* webpackMode: "lazy-once" */
                 `@/pages/Library/books.vue`
             )
     },
     {
         path: '/issue',
         meta: {},
         name: 'Issue',
         props: (route) => ({
             type: route.query.type
         }),
         component: () =>
-            import (
+            import(
                 /* webpackChunkName: "routes" */
                 /* webpackMode: "lazy-once" */
                 `@/pages/Library/issue.vue`
             )
     },
     {
         path: '/e-books',
         meta: {},
         name: 'E-Books',
         props: (route) => ({
             type: route.query.type
         }),
         component: () =>
-            import (
+            import(
                 /* webpackChunkName: "routes" */
                 /* webpackMode: "lazy-once" */
                 `@/pages/Library/eBook.vue`
             )
     },
     {
         path: '/editInvoice/:invoiceid',
         meta: {},
         name: 'Edit Invoice',
         // props: (route) => ({ type: route.query.type }),
         component: () =>
-            import (
+            import(
                 /* webpackChunkName: "routes" */
                 /* webpackMode: "lazy-once" */
                 `@/pages/Account/editInvoice.vue`
             )
     },
     {
         path: '/StudentsAttendence/:id',
         meta: {},
         name: 'View Students Attendence',
         props: (route) => ({
             type: route.query.type
         }),
         component: () =>
-            import (
+            import(
                 /* webpackChunkName: "routes" */
                 /* webpackMode: "lazy-once" */
                 `@/pages/Attendence/viewStudentsAttendence.vue`
             )
     },
     {
         path: '/TeacherAttendence/:teacherId',
         meta: {},
         name: 'View Teacher Attendence',
         props: (route) => ({
             type: route.query.type
         }),
         component: () =>
-            import (
+            import(
                 /* webpackChunkName: "routes" */
                 /* webpackMode: "lazy-once" */
                 `@/pages/Attendence/viewTeacherAttendence.vue`
             )
     },
     {
         path: '/viewInvoice/:viewInvoiceId',
         meta: {},
         name: 'View Invoice',
         props: (route) => ({
             type: route.query.type
         }),
         component: () =>
-            import (
+            import(
                 /* webpackChunkName: "routes" */
                 /* webpackMode: "lazy-once" */
                 `@/pages/Account/viewInvoice.vue`
             )
     },
     {
         path: '/viewPaymentInvoice/:viewPaymentInvoiceId',
         meta: {},
         name: 'View Payment Invoice',
         props: (route) => ({
             type: route.query.type
         }),
         component: () =>
-            import (
+            import(
                 /* webpackChunkName: "routes" */
                 /* webpackMode: "lazy-once" */
                 `@/pages/Account/viewPaymentInvoice.vue`
             )
     },
     {
         path: '/globalPayment',
         meta: {},
         name: 'Global Payment',
         props: (route) => ({
             type: route.query.type
         }),
         component: () =>
-            import (
+            import(
                 /* webpackChunkName: "routes" */
                 /* webpackMode: "lazy-once" */
                 `@/pages/Account/globalPayment.vue`
             )
     },
     {
         path: '/exam',
         meta: {},
         name: 'Exam',
         props: (route) => ({
             type: route.query.type
         }),
         component: () =>
-            import (
+            import(
                 /* webpackChunkName: "routes" */
                 /* webpackMode: "lazy-once" */
                 `@/pages/Exam/exam.vue`
             )
     },
     {
         path: '/grade',
         meta: {},
         name: 'Grade',
         props: (route) => ({
             type: route.query.type
         }),
         component: () =>
-            import (
+            import(
                 /* webpackChunkName: "routes" */
                 /* webpackMode: "lazy-once" */
                 `@/pages/Exam/grade.vue`
             )
     },
     {
         path: '/examSchedule',
         meta: {},
         name: 'Exam Schedule',
         props: (route) => ({
             type: route.query.type
         }),
         component: () =>
-            import (
+            import(
                 /* webpackChunkName: "routes" */
                 /* webpackMode: "lazy-once" */
                 `@/pages/Exam/examSchedule.vue`
             )
     },
     {
         path: '/examAttendence',
         meta: {},
         name: 'Exam Attendence',
         props: (route) => ({
             type: route.query.type
         }),
         component: () =>
-            import (
+            import(
                 /* webpackChunkName: "routes" */
                 /* webpackMode: "lazy-once" */
                 `@/pages/Exam/examAttendence.vue`
             )
     },
     {
         path: '/mark',
         meta: {},
         name: 'Mark',
         props: (route) => ({
             type: route.query.type
         }),
         component: () =>
-            import (
+            import(
                 /* webpackChunkName: "routes" */
                 /* webpackMode: "lazy-once" */
                 `@/pages/Mark/mark.vue`
             )
     },
     {
         path: '/viewMark/:markId',
         meta: {},
         name: 'view Mark',
         props: (route) => ({
             type: route.query.type
         }),
         component: () =>
-            import (
+            import(
                 /* webpackChunkName: "routes" */
                 /* webpackMode: "lazy-once" */
                 `@/pages/Mark/viewMark.vue`
             )
     },
     {
         path: '/markDistribution',
         meta: {},
         name: 'Mark Distribution',
         props: (route) => ({
             type: route.query.type
         }),
         component: () =>
-            import (
+            import(
                 /* webpackChunkName: "routes" */
                 /* webpackMode: "lazy-once" */
                 `@/pages/Mark/markDistribution.vue`
             )
     },
     {
         path: '/meet',
         meta: {},
         name: 'Meet',
         props: (route) => ({
             type: route.query.type
         }),
         component: () =>
-            import (
+            import(
                 /* webpackChunkName: "routes" */
                 /* webpackMode: "lazy-once" */
                 `@/pages/Meet/meet.vue`
             )
     },
     {
         path: '/academicYear',
         meta: {},
         name: 'Academic Year',
         props: (route) => ({
             type: route.query.type
         }),
         component: () =>
-            import (
+            import(
                 /* webpackChunkName: "routes" */
                 /* webpackMode: "lazy-once" */
                 `@/pages/Administrator/academicYear.vue`
             )
     },
     {
         path: '/systemAdmin',
         meta: {},
         name: 'System Admin',
         props: (route) => ({
             type: route.query.type
         }),
         component: () =>
-            import (
+            import(
                 /* webpackChunkName: "routes" */
                 /* webpackMode: "lazy-once" */
                 `@/pages/Administrator/systemAdmin.vue`
             )
     },
     {
         path: '/resetPassword',
         meta: {},
         name: 'Change Password',
         props: (route) => ({
             type: route.query.type
         }),
         component: () =>
-            import (
+            import(
                 /* webpackChunkName: "routes" */
                 /* webpackMode: "lazy-once" */
                 `@/pages/Administrator/resetPassword.vue`
             )
     },
     {
         path: '/role',
         meta: {},
         name: 'Role',
         props: (route) => ({
             type: route.query.type
         }),
         component: () =>
-            import (
+            import(
                 /* webpackChunkName: "routes" */
                 /* webpackMode: "lazy-once" */
                 `@/pages/Administrator/role.vue`
             )
     },
     {
         path: '/bulkImport',
         meta: {},
         name: 'Bulk Import',
         props: (route) => ({
             type: route.query.type
         }),
         component: () =>
-            import (
+            import(
                 /* webpackChunkName: "routes" */
                 /* webpackMode: "lazy-once" */
                 `@/pages/Administrator/bulkImport.vue`
             )
     },
     {
         path: '/studentReport',
         meta: {},
         name: 'Student Report',
         props: (route) => ({
             type: route.query.type
         }),
         component: () =>
-            import (
+            import(
                 /* webpackChunkName: "routes" */
                 /* webpackMode: "lazy-once" */
                 `@/pages/Report/studentReport.vue`
             )
     },
     {
         path: '/progressCardReport',
         meta: {},
         name: 'Progress Card Report',
         props: (route) => ({
             type: route.query.type
         }),
         component: () =>
-            import (
+            import(
                 /* webpackChunkName: "routes" */
                 /* webpackMode: "lazy-once" */
                 `@/pages/Report/progressCardReport.vue`
             )
     },
     {
         path: '/idCard',
         meta: {},
         name: 'Id Card Report',
         props: (route) => ({
             type: route.query.type
         }),
         component: () =>
-            import (
+            import(
                 `@/pages/Report/idCard.vue`
             )
     },
     {
         path: '/admitCard',
         meta: {},
         name: 'Admit Card Report',
         props: (route) => ({
             type: route.query.type
         }),
         component: () =>
-            import (
+            import(
                 `@/pages/Report/admitCard.vue`
             )
     },
     {
         path: '/generalSetting',
         meta: {},
         name: 'General Setting',
         props: (route) => ({
             type: route.query.type
         }),
         component: () =>
-            import (
+            import(
                 /* webpackChunkName: "routes" */
                 /* webpackMode: "lazy-once" */
                 `@/pages/generalSetting/generalSetting.vue`
             )
     },
     {
         path: '/assignment',
         meta: {},
         name: 'Assignment',
         props: (route) => ({
             type: route.query.type
         }),
         component: () =>
-            import (
+            import(
                 `@/pages/Academic/assignment.vue`
             )
     },
     {
         path: '/routine',
         meta: {},
         name: 'Routine',
         props: (route) => ({
             type: route.query.type
         }),
         component: () =>
-            import (
+            import(
                 `@/pages/Academic/routine.vue`
             )
     },
     {
         path: '/subject',
         meta: {},
         name: 'Subject',
         props: (route) => ({
             type: route.query.type
         }),
         component: () =>
-            import (
+            import(
                 `@/pages/Academic/subject.vue`
             )
     },
     {
         path: '/syllabus',
         meta: {},
         name: 'Syllabus',
         props: (route) => ({
             type: route.query.type
         }),
         component: () =>
-            import (
+            import(
                 `@/pages/Academic/syllabus.vue`
             )
     },
     {
         path: '/course',
         meta: {},
         name: 'Course',
         props: (route) => ({
             type: route.query.type
         }),
         component: () =>
-            import (
+            import(
                 /* webpackChunkName: "routes" */
                 /* webpackMode: "lazy-once" */
                 `@/pages/Course/course.vue`
             )
     },
     {
         path: '/courseDetail',
         meta: {},
         name: 'Course Detail',
         props: (route) => ({
             type: route.query.type
         }),
         component: () =>
-            import (
+            import(
                 /* webpackChunkName: "routes" */
                 /* webpackMode: "lazy-once" */
                 `@/pages/Course/courseDetail.vue`
             )
     },
     {
         path: '/enrollStudents',
         meta: {},
         name: 'Enroll Students',
         props: (route) => ({
             type: route.query.type
         }),
         component: () =>
-            import (
+            import(
                 /* webpackChunkName: "routes" */
                 /* webpackMode: "lazy-once" */
                 `@/pages/Course/enrollStudents.vue`
             )
     },
     {
         path: '/changeStudents',
         meta: {},
         name: 'Change Students',
         props: (route) => ({
             type: route.query.type
         }),
         component: () =>
-            import (
+            import(
                 /* webpackChunkName: "routes" */
                 /* webpackMode: "lazy-once" */
                 `@/pages/changeStudents/changeStudents.vue`
             )
     },
     {
         path: '/annoucement',
         meta: {},
         name: 'Annoucement',
         props: (route) => ({
             type: route.query.type
         }),
         component: () =>
-            import (
+            import(
                 /* webpackChunkName: "routes" */
                 /* webpackMode: "lazy-once" */
                 `@/pages/Annoucement/annoucement.vue`
             )
     },
     {
         path: '/meetingEvent',
         meta: {},
         name: 'Meeting Event',
         props: (route) => ({
             type: route.query.type
         }),
         component: () =>
-            import (
+            import(
                 /* webpackChunkName: "routes" */
                 /* webpackMode: "lazy-once" */
                 `@/pages/meetingEvent/meetingEvent.vue`
             )
     },
     //////SCHOOL
     {
         path: '/school',
         meta: {},
         name: 'School',
         props: (route) => ({
             type: route.query.type
         }),
         component: () =>
-            import (
+            import(
                 /* webpackChunkName: "routes" */
                 /* webpackMode: "lazy-once" */
                 `@/pages/School/school.vue`
             )
     },
     {
         path: '/schooldashboard',
         meta: {},
         name: 'View School Dashboard',
         props: (route) => ({
             type: route.query.type
         }),
         component: () =>
-            import (
+            import(
                 /* webpackChunkName: "routes" */
                 /* webpackMode: "lazy-once" */
                 `@/pages/School/viewSchoolDashboard.vue`
             )
     }
 ];