viithiisys / School-Management-dashboard

Download as
Browse Code ยป

Commit 3f7b851676c581bd793d651334dc8abcfd071145

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

added announcements

Showing 5 changed files with 706 additions and 303 deletions   Show diff stats
src/Services/GetApis.js
Diff comments   View file @3f7b851
... ... @@ -40,7 +40,7 @@ export default {
40 40 async getCourseDiscussionesList(params) {
41 41 try {
42 42 let response = await this.getMethod("/getCourseDiscussionesList", {
43   - courseId: params.courseId,
  43 + // courseId: params.courseId,
44 44 classId: params.classId,
45 45 })
46 46 this.courseDiscussionItems = response.data.data
... ...
src/pages/Dashboard/Announcement.vue
Diff comments   View file @3f7b851
... ... @@ -0,0 +1,379 @@
  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 class="mt-1">
  135 + <v-flex xs8>
  136 + <v-layout column>
  137 + <!-- HEADING -->
  138 + <v-flex>
  139 + <div class="title side-bar-color font-weight-bold">Announcements</div>
  140 + <div class="subheading grey--text lighten-1">General news and announcements</div>
  141 + </v-flex>
  142 +
  143 + <!-- ADD DISCUSSION FORUM BUTTON -->
  144 + <!-- <v-flex>
  145 + <div>
  146 + <v-btn
  147 + fab
  148 + dark
  149 + class="open-dialog-button hidden-xl-only hidden-md-only hidden-lg-only"
  150 + small
  151 + @click="addForumDialog = true"
  152 + >
  153 + <v-icon dark>add</v-icon>
  154 + </v-btn>
  155 + <v-btn
  156 + round
  157 + class="open-dialog-button hidden-sm-only hidden-xs-only"
  158 + dark
  159 + @click="addForumDialog = true"
  160 + >
  161 + <v-icon class="white--text pr-1" size="20">add</v-icon>Add A New Discussion Topic
  162 + </v-btn>
  163 + </div>
  164 + </v-flex>-->
  165 +
  166 + <!-- DATA TABLE -->
  167 + <v-flex>
  168 + <v-data-table
  169 + :headers="courseDiscussionHeaders"
  170 + :items="courseDiscussionItems"
  171 + :pagination.sync="pagination"
  172 + :search="search"
  173 + >
  174 + <template slot="items" slot-scope="props">
  175 + <tr class="tr">
  176 + <td class="td td-row text-xs-center">{{ props.item.courseId.courseName}}</td>
  177 + <td class="td td-row text-xs-center">{{ props.item.studentId.name }}</td>
  178 + <td class="td td-row text-xs-center">{{ props.item.courseId.courseName}}</td>
  179 + <td class="td td-row text-xs-center">{{ props.item.studentId.name }}</td>
  180 + </tr>
  181 + </template>
  182 + <v-alert
  183 + slot="no-results"
  184 + :value="true"
  185 + color="error"
  186 + icon="warning"
  187 + >Your search for "{{ search }}" found no results.</v-alert>
  188 + </v-data-table>
  189 + </v-flex>
  190 + </v-layout>
  191 +
  192 + <!-- NEXT CHAPTER -->
  193 + <!-- <v-flex
  194 + class="text-xs-right mt-5"
  195 + v-if="indexSelectedChapter < chapterNames.length -1"
  196 + @click="showSelectedChapter()"
  197 + >
  198 + <span style="cursor: pointer;" class="subheading font-weight-bold">
  199 + {{chapterNames[indexSelectedChapter + 1]}}
  200 + <v-icon class="black--text" style="position:relative; top: 4px;">chevron_right</v-icon>
  201 + </span>
  202 + </v-flex>-->
  203 + <!-- <v-flex class="text-xs-right mt-5" v-else>
  204 + <span class="subheading font-weight-bold">Return to chapter one</span>
  205 + </v-flex>-->
  206 + </v-flex>
  207 +
  208 + <v-spacer></v-spacer>
  209 +
  210 + <!-- COURSES - positioned to the right of the page -->
  211 + <v-flex xs3>
  212 + <v-card class="elevation-0 card-border" height="100%">
  213 + <v-container class="pt-0">
  214 + <div class="side-bar-color font-weight-bold title">Courses</div>
  215 +
  216 + <div v-for="(course,index) in courseData">
  217 + <v-btn
  218 + flat
  219 + class="subheading text-xs-start justify-left"
  220 + style="cursor: pointer;"
  221 + block
  222 + @click="routeToCourseDetails(course._id)"
  223 + >
  224 + <div style="width: 100%;text-align: left;">
  225 + <v-icon style="color: red;padding-bottom: 3px;" size="15">play_arrow</v-icon>
  226 + {{course.courseName}}
  227 + </div>
  228 + </v-btn>
  229 + </div>
  230 + </v-container>
  231 + </v-card>
  232 + </v-flex>
  233 + </v-layout>
  234 + </v-container>
  235 + </div>
  236 +</template>
  237 +<script>
  238 +import AllApiCalls from "@/Services/AllApiCalls.js";
  239 +import http from "@/Services/http.js";
  240 +export default {
  241 + mixins: [AllApiCalls],
  242 + data() {
  243 + return {
  244 + valid: true,
  245 + addForumDialog: false,
  246 + addForumParams: {},
  247 + // UPLOAD IMAGE
  248 + imageName: "",
  249 + imageUrl: "",
  250 + imageFile: "",
  251 + imageData: {},
  252 +
  253 + // DATA TABLE
  254 + search: "",
  255 + pagination: {
  256 + rowsPerPage: 10
  257 + },
  258 + courseDiscussionHeaders: [
  259 + {
  260 + text: "Discussion",
  261 + align: "",
  262 + sortable: false,
  263 + value: ""
  264 + },
  265 + {
  266 + text: "Started",
  267 + value: "",
  268 + sortable: false,
  269 + align: "center"
  270 + },
  271 + { text: "Last Pot", value: "", sortable: false, align: "center" },
  272 + { text: "Replies", value: "", sortable: false, align: "center" }
  273 + ],
  274 + courseDiscussionItems: []
  275 + };
  276 + },
  277 + methods: {
  278 + /* UPLOAD IMAGE */
  279 + pickFile() {
  280 + this.$refs.image.click();
  281 + },
  282 +
  283 + onFilePicked(e) {
  284 + // console.log(e)
  285 + const files = e.target.files;
  286 + this.imageData.upload = e.target.files[0];
  287 + if (files[0] !== undefined) {
  288 + this.imageName = files[0].name;
  289 + if (this.imageName.lastIndexOf(".") <= 0) {
  290 + return;
  291 + }
  292 + const fr = new FileReader();
  293 + fr.readAsDataURL(files[0]);
  294 + fr.addEventListener("load", () => {
  295 + this.imageUrl = fr.result;
  296 + this.imageFile = files[0]; // this is an image file that can be sent to server...
  297 + this.imageData.imageUrl = URL.createObjectURL(this.imageFile);
  298 + });
  299 + } else {
  300 + this.imageName = "";
  301 + this.imageFile = "";
  302 + this.imageUrl = "";
  303 + }
  304 + },
  305 + submit() {
  306 + if (this.$refs.form.validate()) {
  307 + this.addForumParams.classId = localStorage.getItem("parentClassId");
  308 + this.addForumParams.courseId = this.$route.query.courseId;
  309 + this.addForumParams.studentId = localStorage.getItem("parentStudentId");
  310 +
  311 + if (this.imageUrl) {
  312 + var str = this.imageUrl;
  313 + const [baseUrl, imageUrl] = str.split(/,/);
  314 + this.addForumParams.upload = imageUrl;
  315 + }
  316 + this.loading = true;
  317 + http()
  318 + .post("/createCourseDiscussion", this.addForumParams)
  319 + .then(response => {
  320 + this.snackbar = true;
  321 + this.text = "Discussion added successfully";
  322 + this.snackbarColor = "green";
  323 + this.addForumDialog = false;
  324 + this.clear();
  325 + this.loading = false;
  326 + console.log("response of createCourseDiscussion - ", response);
  327 + })
  328 + .catch(error => {
  329 + this.snackbar = true;
  330 + this.text = error.response.data.message;
  331 + this.color = "error";
  332 + this.loading = false;
  333 + });
  334 + }
  335 + },
  336 + clear() {
  337 + this.$refs.form.reset();
  338 + this.imageUrl = "";
  339 + },
  340 + async routeToCourseDetails(courseId) {
  341 + /* getParticularCourseDetail- To get courseDetail - defined in GetApis.js*/
  342 + let response = await this.getParticularCourseDetail(courseId);
  343 +
  344 + /* If the response is null then dont route */
  345 + if (response.data.data.length > 0) {
  346 + this.$router.push({
  347 + name: "Course Details",
  348 + query: { courseId: courseId }
  349 + });
  350 + } else {
  351 + this.seeSnackbar("No Data Available", "warning");
  352 + }
  353 + }
  354 + },
  355 + async created() {
  356 + /* getStudentCourses - to get courseData - defined in GetApis.js*/
  357 + await this.getStudentCourses({
  358 + classId: localStorage.getItem("parentClassId"),
  359 + studentId: localStorage.getItem("parentStudentId")
  360 + });
  361 +
  362 + /* getCourseDiscussionesList - to populate the data table */
  363 + await this.getCourseDiscussionesList({
  364 + courseId: this.$route.query.courseId,
  365 + classId: localStorage.getItem("parentClassId")
  366 + });
  367 + }
  368 +};
  369 +</script>
  370 +<style scoped>
  371 +.side-bar-color {
  372 + color: #827bfa !important;
  373 + /* border-top-right-radius: 74px !important; */
  374 +}
  375 +.card-border {
  376 + border: 1px #bdbdbd solid;
  377 + border-radius: 3px;
  378 +}
  379 +</style>
0 380 \ No newline at end of file
... ...
src/pages/Dashboard/CourseDetails.vue
Diff comments   View file @3f7b851
... ... @@ -33,6 +33,7 @@
33 33  
34 34 <div class="mt-5">
35 35 <span
  36 + style="cursor: pointer;"
36 37 class="grey--text lighten-1"
37 38 @click="$router.push({name: 'Announcement', query:{courseId: $route.query.courseId}})"
38 39 >
... ...
src/pages/Dashboard/CourseDiscussionForum.vue
Diff comments   View file @3f7b851
... ... @@ -302,7 +302,7 @@ export default {
302 302 this.imageUrl = "";
303 303 }
304 304 },
305   - submit() {
  305 + async submit() {
306 306 if (this.$refs.form.validate()) {
307 307 this.addForumParams.classId = localStorage.getItem("parentClassId");
308 308 this.addForumParams.courseId = this.$route.query.courseId;
... ... @@ -331,6 +331,12 @@ export default {
331 331 this.color = "error";
332 332 this.loading = false;
333 333 });
  334 + /* getCourseDiscussionesList - to populate the data table */
  335 + await this.getCourseDiscussionesList({
  336 + courseId: this.$route.query.courseId,
  337 + classId: localStorage.getItem("parentClassId")
  338 + });
  339 + this.addForumDialog = false;
334 340 }
335 341 },
336 342 clear() {
... ...
src/pages/Dashboard/dashboard.vue
Diff comments   View file @3f7b851
... ... @@ -68,138 +68,215 @@
68 68 <v-btn flat text @click="snackbar = false">X</v-btn>
69 69 </v-snackbar>
70 70  
71   - <v-layout wrap>
72   - <v-flex xs12>
73   - <v-layout wrap row>
  71 + <v-layout wrap row>
  72 + <v-flex xs12 sm12 md9>
  73 + <v-container fluid grid-list-xl>
74 74 <!-- ***** Total Students ***** -->
75   - <v-flex xs12 sm12 md9>
76   - <v-container fluid grid-list-xl>
77   - <v-flex xs12 sm12 md12>
78   - <v-layout wrap class>
79   - <v-flex xs12 sm12 md3>
80   - <router-link :to="{ name:'Students' }">
81   - <v-card class="card pink-bgcolor">
82   - <v-card-title primary-title class="titleCard white--text py-3">Students</v-card-title>
83   - <img src="/static/icon/student.png" class="ml-2" width="40" alt="icons" />
84   - <v-card-title class="headline py-1 white--text">{{ students.length }}</v-card-title>
85   - </v-card>
86   - </router-link>
87   - </v-flex>
88   - <!-- ***** Total Teachers***** -->
89   - <v-flex xs12 sm12 md3>
90   - <router-link :to="{ name:'Teachers' }">
91   - <v-card flat class="card elevation-2 firozi-bgcolor">
92   - <v-card-title primary-title class="titleCard white--text py-3">Teachers</v-card-title>
93   - <img src="/static/icon/teacher.png" class="ml-2" width="40" alt="icons" />
  75 + <!-- <v-flex xs12 sm12 md12>
  76 + <v-layout wrap class>
  77 + <v-flex xs12 sm12 md3>
  78 + <router-link :to="{ name:'Students' }">
  79 + <v-card class="card pink-bgcolor">
  80 + <v-card-title primary-title class="titleCard white--text py-3">Students</v-card-title>
  81 + <img src="/static/icon/student.png" class="ml-2" width="40" alt="icons" />
  82 + <v-card-title class="headline py-1 white--text">{{ students.length }}</v-card-title>
  83 + </v-card>
  84 + </router-link>
  85 + </v-flex>-->
  86 + <!-- ***** Total Teachers***** -->
  87 + <!-- <v-flex xs12 sm12 md3>
  88 + <router-link :to="{ name:'Teachers' }">
  89 + <v-card flat class="card elevation-2 firozi-bgcolor">
  90 + <v-card-title primary-title class="titleCard white--text py-3">Teachers</v-card-title>
  91 + <img src="/static/icon/teacher.png" class="ml-2" width="40" alt="icons" />
94 92  
95   - <v-card-title class="headline py-1 white--text">{{ teachers.length }}</v-card-title>
96   - </v-card>
97   - </router-link>
98   - </v-flex>
99   - <!-- ***** Total Parents ***** -->
  93 + <v-card-title class="headline py-1 white--text">{{ teachers.length }}</v-card-title>
  94 + </v-card>
  95 + </router-link>
  96 + </v-flex>-->
  97 + <!-- ***** Total Parents ***** -->
  98 + <!-- <v-flex xs12 sm12 md3>
  99 + <router-link :to="{ name:'Parents' }">
  100 + <v-card flat class="card yellow darken-3">
  101 + <v-card-title primary-title class="titleCard white--text py-3">Parents</v-card-title>
  102 + <img src="/static/icon/parents.png" class="ml-3" width="40px" alt="icons" />
  103 + <v-card-title class="headline py-1 white--text">{{ parents.length }}</v-card-title>
  104 + </v-card>
  105 + </router-link>
  106 + </v-flex>-->
  107 + <!-- ***** Total Class***** -->
  108 + <!-- <v-flex xs12 sm12 md3>
  109 + <router-link :to="{ name:'Class' }">
  110 + <v-card flat class="card darkBlue-bgcolor">
  111 + <v-card-title primary-title class="titleCard white--text py-3">Class</v-card-title>
  112 + <img src="/static/icon/class.png" width="40" alt="icons" class="ml-2" />
  113 + <v-card-title class="headline py-1 white--text">{{ classes.length }}</v-card-title>
  114 + </v-card>
  115 + </router-link>
  116 + </v-flex>
  117 + </v-layout>
  118 + </v-flex>-->
  119 + <p
  120 + v-if="studentsData.length === 0 && role == 'PARENT'"
  121 + class="text-center title grey lighten-4 error--text"
  122 + >You have no student registered with school</p>
  123 + <v-layout v-if="role != 'PARENT'">
  124 + <v-flex xs12>
  125 + <v-card class="card mt-2 account-Card">
  126 + <h4>
  127 + <b>Account</b>
  128 + </h4>
  129 + <v-layout wrap>
100 130 <v-flex xs12 sm12 md3>
101   - <router-link :to="{ name:'Parents' }">
102   - <v-card flat class="card yellow darken-3">
103   - <v-card-title primary-title class="titleCard white--text py-3">Parents</v-card-title>
104   - <img src="/static/icon/parents.png" class="ml-3" width="40px" alt="icons" />
105   - <v-card-title class="headline py-1 white--text">{{ parents.length }}</v-card-title>
106   - </v-card>
107   - </router-link>
  131 + <v-list two-line>
  132 + <template>
  133 + <v-list-tile>
  134 + <v-list-tile-avatar>
  135 + <v-icon class="account-circle darkBlue-color">panorama_fish_eye</v-icon>
  136 + </v-list-tile-avatar>
  137 + <v-list-tile-content>
  138 + <v-list-tile-title class="mt-2">
  139 + <p class="subheading font-color">Fees</p>
  140 + </v-list-tile-title>
  141 + <v-list-tile-title>Rs. {{ feeData.totalFees }}</v-list-tile-title>
  142 + </v-list-tile-content>
  143 + </v-list-tile>
  144 + <v-list-tile>
  145 + <v-list-tile-avatar>
  146 + <v-icon class="account-circle yellowDark-color">panorama_fish_eye</v-icon>
  147 + </v-list-tile-avatar>
  148 + <v-list-tile-content>
  149 + <v-list-tile-title class="mt-2">
  150 + <p class="subheading font-color">Collection</p>
  151 + </v-list-tile-title>
  152 + <v-list-tile-title>Rs. {{ feeData.totalCollection }}</v-list-tile-title>
  153 + </v-list-tile-content>
  154 + </v-list-tile>
  155 + <v-list-tile>
  156 + <v-list-tile-avatar>
  157 + <v-icon class="account-circle pink-color">panorama_fish_eye</v-icon>
  158 + </v-list-tile-avatar>
  159 + <v-list-tile-content>
  160 + <v-list-tile-title class="mt-2">
  161 + <p class="subheading font-color">Expences</p>
  162 + </v-list-tile-title>
  163 + <v-list-tile-title>Rs. {{ expenseData.sum }}</v-list-tile-title>
  164 + </v-list-tile-content>
  165 + </v-list-tile>
  166 + </template>
  167 + </v-list>
108 168 </v-flex>
109   - <!-- ***** Total Class***** -->
110   - <v-flex xs12 sm12 md3>
111   - <router-link :to="{ name:'Class' }">
112   - <v-card flat class="card darkBlue-bgcolor">
113   - <v-card-title primary-title class="titleCard white--text py-3">Class</v-card-title>
114   - <img src="/static/icon/class.png" width="40" alt="icons" class="ml-2" />
115   - <v-card-title class="headline py-1 white--text">{{ classes.length }}</v-card-title>
116   - </v-card>
117   - </router-link>
  169 + <v-flex xs12 sm12 md9 lg9>
  170 + <div id="chart">
  171 + <div v-if="this.series">
  172 + <apexchart
  173 + type="bar"
  174 + height="250"
  175 + style="max-width: 800px !important"
  176 + :options="chartOptions"
  177 + :series="series"
  178 + v-show="true"
  179 + ></apexchart>
  180 + </div>
  181 + </div>
118 182 </v-flex>
119 183 </v-layout>
120   - </v-flex>
121   - <p
122   - v-if="studentsData.length === 0 && role == 'PARENT'"
123   - class="text-center title grey lighten-4 error--text"
124   - >You have no student registered with scholl</p>
125   - <v-layout v-if="role != 'PARENT'">
126   - <v-flex xs12>
127   - <v-card class="card mt-2 account-Card">
128   - <h4>
129   - <b>Account</b>
130   - </h4>
131   - <v-layout wrap>
132   - <v-flex xs12 sm12 md3>
133   - <v-list two-line>
134   - <template>
135   - <v-list-tile>
136   - <v-list-tile-avatar>
137   - <v-icon class="account-circle darkBlue-color">panorama_fish_eye</v-icon>
138   - </v-list-tile-avatar>
139   - <v-list-tile-content>
140   - <v-list-tile-title class="mt-2">
141   - <p class="subheading font-color">Fees</p>
142   - </v-list-tile-title>
143   - <v-list-tile-title>Rs. {{ feeData.totalFees }}</v-list-tile-title>
144   - </v-list-tile-content>
145   - </v-list-tile>
146   - <v-list-tile>
147   - <v-list-tile-avatar>
148   - <v-icon class="account-circle yellowDark-color">panorama_fish_eye</v-icon>
149   - </v-list-tile-avatar>
150   - <v-list-tile-content>
151   - <v-list-tile-title class="mt-2">
152   - <p class="subheading font-color">Collection</p>
153   - </v-list-tile-title>
154   - <v-list-tile-title>Rs. {{ feeData.totalCollection }}</v-list-tile-title>
155   - </v-list-tile-content>
156   - </v-list-tile>
157   - <v-list-tile>
158   - <v-list-tile-avatar>
159   - <v-icon class="account-circle pink-color">panorama_fish_eye</v-icon>
160   - </v-list-tile-avatar>
161   - <v-list-tile-content>
162   - <v-list-tile-title class="mt-2">
163   - <p class="subheading font-color">Expences</p>
164   - </v-list-tile-title>
165   - <v-list-tile-title>Rs. {{ expenseData.sum }}</v-list-tile-title>
166   - </v-list-tile-content>
167   - </v-list-tile>
168   - </template>
169   - </v-list>
170   - </v-flex>
171   - <v-flex xs12 sm12 md9 lg9>
172   - <div id="chart">
173   - <div v-if="this.series">
174   - <apexchart
175   - type="bar"
176   - height="250"
177   - style="max-width: 800px !important"
178   - :options="chartOptions"
179   - :series="series"
180   - v-show="true"
181   - ></apexchart>
182   - </div>
183   - </div>
184   - </v-flex>
185   - </v-layout>
186   - </v-card>
187   - </v-flex>
188   - </v-layout>
189   - <v-card class="mt-2 card" v-if="role != 'PARENT'">
190   - <!-- <full-calendar
  184 + </v-card>
  185 + </v-flex>
  186 + </v-layout>
  187 + <v-card class="mt-2 card" v-if="role != 'PARENT'">
  188 + <!-- <full-calendar
191 189 ref="calendar"
192 190 defaultView="month"
193 191 droppable="false"
194 192 :events="events"
195 193 :config="config"
196   - ></full-calendar>-->
  194 + ></full-calendar>-->
  195 + <h4 class="pa-3">
  196 + <b>Notice</b>
  197 + </h4>
  198 +
  199 + <v-data-table
  200 + :items="noticeData"
  201 + class="elevation-0"
  202 + flat
  203 + hide-actions
  204 + hide-headers
  205 + style="border-spacing: 0 !important;"
  206 + >
  207 + <template
  208 + slot="items"
  209 + slot-scope="props"
  210 + v-if="props.index < 5"
  211 + style="border-spacing: 0 !important;"
  212 + >
  213 + <tr class="td-notice">
  214 + <td class="grey--text" style="width:18px">{{ props.index + 1}}</td>
  215 + <td>
  216 + <span class="grey--text caption">{{ date(props.item.created) }}</span>
  217 + <br />
  218 + <span class="body-2">{{ props.item.title}}</span>
  219 + </td>
  220 + <td class="noticeDecritpion grey--text mt-2">{{ props.item.description}}</td>
  221 +
  222 + <td class="text-xs-center">
  223 + <span>
  224 + <v-tooltip top>
  225 + <img
  226 + slot="activator"
  227 + style="cursor:pointer; width:25px; height:25px; "
  228 + @click="profile"
  229 + src="/static/icon/view.png"
  230 + />
  231 + <span>View</span>
  232 + </v-tooltip>
  233 + </span>
  234 + </td>
  235 + </tr>
  236 + </template>
  237 + </v-data-table>
  238 + </v-card>
  239 + <!-- COURSES -->
  240 + <v-layout v-if="role == 'PARENT'">
  241 + <v-flex xs12>
  242 + <v-card class="card mt-2 account-Card">
  243 + <h4>
  244 + <b>My Courses</b>
  245 + </h4>
  246 + <v-layout wrap>
  247 + <v-flex xs12 sm12>
  248 + <v-list two-line>
  249 + <template>
  250 + <v-list-tile v-for="(course,i) in courseData" :key="i">
  251 + <v-list-tile-avatar>
  252 + <v-icon
  253 + class="account-circle darkBlue-color"
  254 + style="cursor: pointer;"
  255 + >panorama_fish_eye</v-icon>
  256 + </v-list-tile-avatar>
  257 + <v-list-tile-content>
  258 + <v-list-tile-title
  259 + style="cursor: pointer;"
  260 + @click="routeToCourseDetails(course._id)"
  261 + >{{ course.courseName }}</v-list-tile-title>
  262 + </v-list-tile-content>
  263 + </v-list-tile>
  264 + </template>
  265 + </v-list>
  266 + </v-flex>
  267 + </v-layout>
  268 + </v-card>
  269 + </v-flex>
  270 + </v-layout>
  271 + <v-layout v-if="role == 'PARENT'">
  272 + <v-flex xs6>
  273 + <v-card class="mt-2 card">
197 274 <h4 class="pa-3">
198   - <b>Notice</b>
  275 + <b>Latest Annoucements</b>
199 276 </h4>
200 277  
201 278 <v-data-table
202   - :items="noticeData"
  279 + :items="annoucementData"
203 280 class="elevation-0"
204 281 flat
205 282 hide-actions
... ... @@ -217,17 +294,14 @@
217 294 <td>
218 295 <span class="grey--text caption">{{ date(props.item.created) }}</span>
219 296 <br />
220   - <span class="body-2">{{ props.item.title}}</span>
  297 + <span class="body-2">{{ props.item.discussionType}}</span>
221 298 </td>
222   - <td class="noticeDecritpion grey--text mt-2">{{ props.item.description}}</td>
223   -
224 299 <td class="text-xs-center">
225 300 <span>
226 301 <v-tooltip top>
227 302 <img
228 303 slot="activator"
229 304 style="cursor:pointer; width:25px; height:25px; "
230   - @click="profile"
231 305 src="/static/icon/view.png"
232 306 />
233 307 <span>View</span>
... ... @@ -238,181 +312,102 @@
238 312 </template>
239 313 </v-data-table>
240 314 </v-card>
241   - <!-- COURSES -->
242   - <v-layout v-if="role == 'PARENT'">
243   - <v-flex xs12>
244   - <v-card class="card mt-2 account-Card">
245   - <h4>
246   - <b>My Courses</b>
247   - </h4>
248   - <v-layout wrap>
249   - <v-flex xs12 sm12>
250   - <v-list two-line>
251   - <template>
252   - <v-list-tile v-for="(course,i) in courseData" :key="i">
253   - <v-list-tile-avatar>
254   - <v-icon
255   - class="account-circle darkBlue-color"
256   - style="cursor: pointer;"
257   - >panorama_fish_eye</v-icon>
258   - </v-list-tile-avatar>
259   - <v-list-tile-content>
260   - <v-list-tile-title
261   - style="cursor: pointer;"
262   - @click="routeToCourseDetails(course._id)"
263   - >{{ course.courseName }}</v-list-tile-title>
264   - </v-list-tile-content>
265   - </v-list-tile>
266   - </template>
267   - </v-list>
268   - </v-flex>
269   - </v-layout>
270   - </v-card>
271   - </v-flex>
272   - </v-layout>
273   - <v-layout v-if="role == 'PARENT'">
274   - <v-flex xs6>
275   - <v-card class="mt-2 card">
276   - <h4 class="pa-3">
277   - <b>Latest Annoucements</b>
278   - </h4>
  315 + </v-flex>
  316 + <v-flex xs6>
  317 + <v-card class="mt-2 card">
  318 + <h4 class="pa-3">
  319 + <b>Online User</b>
  320 + </h4>
279 321  
280   - <v-data-table
281   - :items="annoucementData"
282   - class="elevation-0"
283   - flat
284   - hide-actions
285   - hide-headers
286   - style="border-spacing: 0 !important;"
287   - >
288   - <template
289   - slot="items"
290   - slot-scope="props"
291   - v-if="props.index < 5"
292   - style="border-spacing: 0 !important;"
293   - >
294   - <tr class="td-notice">
295   - <td class="grey--text" style="width:18px">{{ props.index + 1}}</td>
296   - <td>
297   - <span class="grey--text caption">{{ date(props.item.created) }}</span>
298   - <br />
299   - <span class="body-2">{{ props.item.discussionType}}</span>
300   - </td>
301   - <td class="text-xs-center">
302   - <span>
303   - <v-tooltip top>
304   - <img
305   - slot="activator"
306   - style="cursor:pointer; width:25px; height:25px; "
307   - src="/static/icon/view.png"
308   - />
309   - <span>View</span>
310   - </v-tooltip>
311   - </span>
312   - </td>
313   - </tr>
314   - </template>
315   - </v-data-table>
316   - </v-card>
  322 + <v-data-table
  323 + :items="onlineUser"
  324 + class="elevation-0"
  325 + flat
  326 + hide-actions
  327 + hide-headers
  328 + style="border-spacing: 0 !important;"
  329 + >
  330 + <template
  331 + slot="items"
  332 + slot-scope="props"
  333 + v-if="props.index < 5"
  334 + style="border-spacing: 0 !important;"
  335 + >
  336 + <tr class="td-notice">
  337 + <td class="grey--text" style="width:18px">{{ props.index + 1}}</td>
  338 + <td>
  339 + <span class="body-2">{{ props.item.user }}</span>
  340 + </td>
  341 + <td class="text-xs-center">
  342 + <span>
  343 + <v-tooltip top>
  344 + <img
  345 + slot="activator"
  346 + style="cursor:pointer; width:25px; height:25px; "
  347 + src="/static/icon/view.png"
  348 + />
  349 + <span>View</span>
  350 + </v-tooltip>
  351 + </span>
  352 + </td>
  353 + </tr>
  354 + </template>
  355 + </v-data-table>
  356 + </v-card>
  357 + </v-flex>
  358 + </v-layout>
  359 + </v-container>
  360 + </v-flex>
  361 + <v-spacer></v-spacer>
  362 + <!-- SIDE BAR -->
  363 + <v-flex xs12 sm12 md3>
  364 + <v-card height="100%" class="elevation-0 mt-3 profileDasboard">
  365 + <v-card-text class="px-2">
  366 + <h4 class="text-xs-center py-3">
  367 + <b>Profile</b>
  368 + </h4>
  369 + <v-flex xs12 class="py-3">
  370 + <v-layout wrap>
  371 + <v-flex xs12 sm12 md4>
  372 + <img src="/static/icon/user.png" v-if="!userData.schoolLogoUrl" width="80" />
  373 + <img :src="userData.schoolLogoUrl" v-else-if="userData.schoolLogoUrl" width="80" />
317 374 </v-flex>
318   - <v-flex xs6>
319   - <v-card class="mt-2 card">
320   - <h4 class="pa-3">
321   - <b>Online User</b>
322   - </h4>
323   -
324   - <v-data-table
325   - :items="onlineUser"
326   - class="elevation-0"
327   - flat
328   - hide-actions
329   - hide-headers
330   - style="border-spacing: 0 !important;"
331   - >
332   - <template
333   - slot="items"
334   - slot-scope="props"
335   - v-if="props.index < 5"
336   - style="border-spacing: 0 !important;"
337   - >
338   - <tr class="td-notice">
339   - <td class="grey--text" style="width:18px">{{ props.index + 1}}</td>
340   - <td>
341   - <span class="body-2">{{ props.item.user }}</span>
342   - </td>
343   - <td class="text-xs-center">
344   - <span>
345   - <v-tooltip top>
346   - <img
347   - slot="activator"
348   - style="cursor:pointer; width:25px; height:25px; "
349   - src="/static/icon/view.png"
350   - />
351   - <span>View</span>
352   - </v-tooltip>
353   - </span>
354   - </td>
355   - </tr>
356   - </template>
357   - </v-data-table>
358   - </v-card>
  375 + <v-flex xs12 sm12 md6>
  376 + <p class="mb-0 body-1">
  377 + <i>{{ userData.name }}</i>
  378 + </p>
  379 + <p class="mb-0 caption grey--text">{{ userData.email }}</p>
  380 + <p class="mb-0 caption grey--text">{{ userData.mobile }}</p>
  381 + <address class="caption grey--text mb-3">{{ userData.address }}</address>
359 382 </v-flex>
360 383 </v-layout>
361   - </v-container>
362   - </v-flex>
363   - <v-flex xs12 sm12 md3>
364   - <v-card height="100%" class="elevation-0 mt-3 profileDasboard">
  384 + </v-flex>
  385 + <hr />
  386 + <div class="text-xs-center py-3 subheading font-weight-bold">Calender</div>
  387 + <vue-event-calendar :events="activityEvents"></vue-event-calendar>
  388 + <!-- LATEST ACTIVITY -->
  389 + <v-card class="my-3 elevation-0">
365 390 <v-card-text>
366   - <h4 class="text-xs-center py-3">
367   - <b>Profile</b>
368   - </h4>
369   - <v-flex xs12 class="py-3">
370   - <v-layout wrap>
371   - <v-flex xs12 sm12 md4>
372   - <img src="/static/icon/user.png" v-if="!userData.schoolLogoUrl" width="80" />
373   - <img
374   - :src="userData.schoolLogoUrl"
375   - v-else-if="userData.schoolLogoUrl"
376   - width="80"
377   - />
378   - </v-flex>
379   - <v-flex xs12 sm12 md6>
380   - <p class="mb-0 body-1">
381   - <i>{{ userData.name }}</i>
382   - </p>
383   - <p class="mb-0 caption grey--text">{{ userData.email }}</p>
384   - <p class="mb-0 caption grey--text">{{ userData.mobile }}</p>
385   - <address class="caption grey--text mb-3">{{ userData.address }}</address>
386   - </v-flex>
387   - </v-layout>
388   - </v-flex>
389   - <hr />
390   - <div class="text-xs-center py-3 subheading font-weight-bold">Calender</div>
391   - <vue-event-calendar :events="activityEvents"></vue-event-calendar>
392   - <!-- LATEST ACTIVITY -->
393   - <v-card class="my-3 elevation-0">
394   - <v-card-text>
395   - <v-card-title class="justify-center subheading font-weight-bold">Latest Activity</v-card-title>
396   - <div v-for="(activity,index) in activityList" :key="index" class="mt-2">
397   - <span
398   - :style="{ 'background-color': colorsArray[index%colorsArray.length] }"
399   - style="height: 12px;width: 12px;border-radius: 50%;display: inline-block;vertical-align: top;"
400   - ></span>
401   - <div style="display: inline-block;" class="ml-2">
402   - <div
403   - class="grey--text lighten-1 caption"
404   - >{{moment(activity.meetingEvent.dateOfEvent).format("DD MMMM, YYYY")}}</div>
405   - <div class="body-2">{{activity.meetingEvent.title}}</div>
406   - </div>
407   - </div>
408   - </v-card-text>
409   - </v-card>
  391 + <v-card-title class="justify-center subheading font-weight-bold">Latest Activity</v-card-title>
  392 + <div v-for="(activity,index) in activityList" :key="index" class="mt-2">
  393 + <span
  394 + :style="{ 'background-color': colorsArray[index%colorsArray.length] }"
  395 + style="height: 12px;width: 12px;border-radius: 50%;display: inline-block;vertical-align: top;"
  396 + ></span>
  397 + <div style="display: inline-block;" class="ml-2">
  398 + <div
  399 + class="grey--text lighten-1 caption"
  400 + >{{moment(activity.meetingEvent.dateOfEvent).format("DD MMMM, YYYY")}}</div>
  401 + <div class="body-2">{{activity.meetingEvent.title}}</div>
  402 + </div>
  403 + </div>
410 404 </v-card-text>
411 405 </v-card>
412   - </v-flex>
413   - </v-layout>
  406 + </v-card-text>
  407 + </v-card>
414 408 </v-flex>
415 409 </v-layout>
  410 +
416 411 <v-dialog v-model="dialog" max-width="500">
417 412 <v-card color="grey lighten-4" flat>
418 413 <v-toolbar dark color="fixcolors">
... ... @@ -777,19 +772,39 @@ export default {
777 772 },
778 773 getUserData() {
779 774 // this.showLoader = true;
780   - http()
781   - .get("/getParticularUserDetail", {
782   - headers: {
783   - Authorization: "Bearer " + this.token
784   - }
785   - })
786   - .then(response => {
787   - this.userData = response.data.data;
788   - this.showLoader = false;
789   - })
790   - .catch(error => {
791   - this.showLoader = false;
792   - });
  775 + if (this.$store.state.role === "PARENT") {
  776 + http()
  777 + .get("/getParticularUserDetail", {
  778 + headers: {
  779 + Authorization: "Bearer " + this.token
  780 + },
  781 + params: {
  782 + studentId: localStorage.getItem("parentStudentId")
  783 + }
  784 + })
  785 + .then(response => {
  786 + this.userData = response.data.data;
  787 + this.showLoader = false;
  788 + console.log("sdsdfsdfsd - ", response);
  789 + })
  790 + .catch(error => {
  791 + this.showLoader = false;
  792 + });
  793 + } else {
  794 + http()
  795 + .get("/getParticularUserDetail", {
  796 + headers: {
  797 + Authorization: "Bearer " + this.token
  798 + }
  799 + })
  800 + .then(response => {
  801 + this.userData = response.data.data;
  802 + this.showLoader = false;
  803 + })
  804 + .catch(error => {
  805 + this.showLoader = false;
  806 + });
  807 + }
793 808 },
794 809  
795 810 getFeesAndCollectionsData() {
... ... @@ -904,7 +919,9 @@ export default {
904 919 /* set activityEvents array to highlight event dates in calender */
905 920 for (var i = 0; i < this.activityList.length; i++) {
906 921 let obj = {};
907   - obj.date = moment(this.activityList[i].meetingEvent.dateOfEvent).format("YYYY/MM/DD");;
  922 + obj.date = moment(this.activityList[i].meetingEvent.dateOfEvent).format(
  923 + "YYYY/MM/DD"
  924 + );
908 925 obj.title = this.activityList[i].meetingEvent.title;
909 926 this.activityEvents.push(obj);
910 927 }
... ...