viithiisys / School-Management-dashboard

Download as
Browse Code ยป

Commit 68d600c976a661e4a091de5a9259b2850d42c020

Authored by Shikha Mishra
1 parent dfd943df60
Exists in master and in 3 other branches amber-development, development, ui-design

improve dashboard ui and set route of school while superadmin login

Showing 5 changed files with 86 additions and 44 deletions   Show diff stats
src/components/pageHeader/AppToolbar.vue
Diff comments   View file @68d600c
... ... @@ -18,6 +18,7 @@
18 18 <v-toolbar-title class="header-route-name pl-2">{{ $route.name }}</v-toolbar-title>
19 19 </v-flex>
20 20 <v-spacer></v-spacer>
  21 + <v-btn type="button" @click="goToSchool" v-if="adminRole">Towards School!</v-btn>
21 22 <v-toolbar-items class="hidden-sm-and-down">
22 23 <v-icon class="header-icon">notifications_none</v-icon>
23 24 </v-toolbar-items>
... ... @@ -84,7 +85,8 @@ export default {
84 85 window.getApp.$emit("APP_LOGOUT");
85 86 }
86 87 }
87   - ]
  88 + ],
  89 + adminRole: ""
88 90 }),
89 91 computed: {
90 92 toolbarColor() {
... ... @@ -93,6 +95,8 @@ export default {
93 95 },
94 96 mounted() {
95 97 // this.getUserData();
  98 + this.adminRole = this.$store.state.role;
  99 + console.log("this.adminRole", this.adminRole);
96 100 },
97 101 methods: {
98 102 // emitSearch(ev) {
... ... @@ -121,6 +125,17 @@ export default {
121 125 // this.$store.dispatch("Id", null);
122 126 // }
123 127 });
  128 + },
  129 + goToSchool() {
  130 + console.log("click");
  131 + if (this.$store.state.role === "ADMIN") {
  132 + this.$store.dispatch("Role", null);
  133 + this.$store.dispatch("setToken", null);
  134 + this.$router.push("/schooldashboard");
  135 + setTimeout(() => {
  136 + location.reload();
  137 + }, 1000);
  138 + }
124 139 }
125 140 }
126 141 };
... ...
src/pages/Dashboard/dashboard.vue
Diff comments   View file @68d600c
... ... @@ -144,15 +144,16 @@
144 144 </template>
145 145 </v-list>
146 146 </v-flex>
147   - <v-flex xs12 sm12 md9>
148   - <div id="chart">
  147 + <v-flex xs12 sm12 md9 lg9>
  148 + <!-- <div id="chart"> -->
149 149 <apexchart
150 150 type="bar"
151 151 height="250"
  152 + style="max-width: 800px !important"
152 153 :options="chartOptions"
153 154 :series="series"
154 155 ></apexchart>
155   - </div>
  156 + <!-- </div> -->
156 157 </v-flex>
157 158 </v-layout>
158 159 </v-card>
... ... @@ -361,19 +362,20 @@ export default {
361 362 chart: {
362 363 type: "bar",
363 364 height: 150,
364   - animations: {
365   - enabled: true,
366   - easing: "easeinout",
367   - speed: 1200,
368   - animateGradually: {
369   - enabled: true,
370   - delay: 450
371   - },
372   - dynamicAnimation: {
373   - enabled: true,
374   - speed: 450
375   - }
376   - }
  365 + stacked: true
  366 + // animations: {
  367 + // enabled: true,
  368 + // easing: "easeinout",
  369 + // speed: 1200,
  370 + // animateGradually: {
  371 + // enabled: true,
  372 + // delay: 450
  373 + // },
  374 + // dynamicAnimation: {
  375 + // enabled: true,
  376 + // speed: 450
  377 + // }
  378 + // }
377 379 },
378 380 plotOptions: {
379 381 bar: {
... ... @@ -383,6 +385,18 @@ export default {
383 385 distributed: true
384 386 }
385 387 },
  388 + responsive: [
  389 + {
  390 + breakpoint: 480,
  391 + options: {
  392 + legend: {
  393 + position: "bottom",
  394 + offsetX: -10,
  395 + offsetY: 0
  396 + }
  397 + }
  398 + }
  399 + ],
386 400 legend: {
387 401 show: false
388 402 },
... ...
src/pages/School/school.vue
Diff comments   View file @68d600c
... ... @@ -969,7 +969,9 @@ export default {
969 969 this.$store.dispatch("Id", response.data.data.id);
970 970 this.$store.dispatch("Role", response.data.data.role);
971 971 this.$router.push("/dashboard");
972   - location.reload();
  972 + setTimeout(() => {
  973 + location.reload();
  974 + }, 1000);
973 975 // let routeData = this.$router.resolve({
974 976 // name: "dashboardAdmin"
975 977 // });
... ...
src/pages/School/viewSchoolDashboard.vue
Diff comments   View file @68d600c
... ... @@ -144,15 +144,10 @@
144 144 </template>
145 145 </v-list>
146 146 </v-flex>
147   - <v-flex xs12 sm12 md9>
148   - <div id="chart">
149   - <apexchart
150   - type="bar"
151   - height="250"
152   - :options="chartOptions"
153   - :series="series"
154   - ></apexchart>
155   - </div>
  147 + <v-flex xs12 sm12 md9 lg9 >
  148 + <!-- <div id="chart"> -->
  149 + <apexchart type="bar" height="250" style="max-width:800px !important" :options="chartOptions" :series="series"></apexchart>
  150 + <!-- </div> -->
156 151 </v-flex>
157 152 </v-layout>
158 153 </v-card>
... ... @@ -359,21 +354,23 @@ export default {
359 354 ],
360 355 chartOptions: {
361 356 chart: {
362   - type: "bar",
  357 + // type: "bar",
363 358 height: 150,
364   - animations: {
365   - enabled: true,
366   - easing: "easeinout",
367   - speed: 1200,
368   - animateGradually: {
369   - enabled: true,
370   - delay: 450
371   - },
372   - dynamicAnimation: {
373   - enabled: true,
374   - speed: 450
375   - }
376   - }
  359 + stacked: true
  360 +
  361 + // animations: {
  362 + // enabled: true,
  363 + // easing: "easeinout",
  364 + // speed: 1200,
  365 + // animateGradually: {
  366 + // enabled: true,
  367 + // delay: 450
  368 + // },
  369 + // dynamicAnimation: {
  370 + // enabled: true,
  371 + // speed: 450
  372 + // }
  373 + // }
377 374 },
378 375 plotOptions: {
379 376 bar: {
... ... @@ -383,8 +380,22 @@ export default {
383 380 distributed: true
384 381 }
385 382 },
  383 + responsive: [
  384 + {
  385 + breakpoint: 480,
  386 + options: {
  387 + legend: {
  388 + position: "bottom",
  389 + offsetX: -10,
  390 + offsetY: 0
  391 + }
  392 + }
  393 + }
  394 + ],
  395 +
386 396 legend: {
387   - show: false
  397 + position: "right",
  398 + offsetY: 40
388 399 },
389 400 colors: ["#7852cc", "#f9a825", "#ff8a89"],
390 401 dataLabels: {
... ...
static/css/custom.css
Diff comments   View file @68d600c
... ... @@ -145,7 +145,7 @@ h4 {
145 145 padding: 8px;
146 146 }
147 147  
148   -.apexcharts-canvas {
  148 +/* .apexcharts-canvas {
149 149 width: 100% !important;
150 150 }
151 151 .apexcharts-canvas > svg{
... ... @@ -153,7 +153,7 @@ h4 {
153 153 }
154 154 .apexcharts-canvas > svg > apexcharts-inner > apexcharts-graphical {
155 155 transform: translate(0);
156   -}
  156 +} */
157 157  
158 158 #dialog {
159 159 height: 550px;
... ...