|
|
|
|
@ -1,7 +1,8 @@
|
|
|
|
|
<template>
|
|
|
|
|
<div class="h-100">
|
|
|
|
|
<main-back height="100%">
|
|
|
|
|
<div class="px-16 pb-10">
|
|
|
|
|
<!-- admin role -->
|
|
|
|
|
<div class="px-16 pb-10" v-if="role === 'admin'">
|
|
|
|
|
<div class="mt-11">
|
|
|
|
|
<div class="d-flex justify-center"><UserName role="admin" /></div>
|
|
|
|
|
</div>
|
|
|
|
|
@ -47,19 +48,169 @@
|
|
|
|
|
</v-row>
|
|
|
|
|
<v-row class="mx-md-16 mx-0">
|
|
|
|
|
<v-col cols="12" sm="3"
|
|
|
|
|
><Notification text="total trainees" quantity="112"
|
|
|
|
|
><Notification
|
|
|
|
|
text="total trainees"
|
|
|
|
|
:quantity="
|
|
|
|
|
statistics.trainees_count ? statistics.trainees_count : 0
|
|
|
|
|
"
|
|
|
|
|
/></v-col>
|
|
|
|
|
<v-col cols="12" sm="3"
|
|
|
|
|
><Notification text="total trainers" quantity="15"
|
|
|
|
|
><Notification
|
|
|
|
|
text="total trainers"
|
|
|
|
|
:quantity="
|
|
|
|
|
statistics.trainers_count ? statistics.trainers_count : 0
|
|
|
|
|
"
|
|
|
|
|
/></v-col>
|
|
|
|
|
<v-col cols="12" sm="3"
|
|
|
|
|
><Notification text="total programs" quantity="147"
|
|
|
|
|
><Notification
|
|
|
|
|
text="total programs"
|
|
|
|
|
:quantity="
|
|
|
|
|
statistics.courses_count ? statistics.courses_count : 0
|
|
|
|
|
"
|
|
|
|
|
/></v-col>
|
|
|
|
|
<v-col cols="12" sm="3"
|
|
|
|
|
><Notification text="moves defined" quantity="1140"
|
|
|
|
|
><Notification
|
|
|
|
|
text="moves defined"
|
|
|
|
|
:quantity="
|
|
|
|
|
statistics.workouts_count ? statistics.workouts_count : 0
|
|
|
|
|
"
|
|
|
|
|
/></v-col>
|
|
|
|
|
</v-row>
|
|
|
|
|
</div>
|
|
|
|
|
<!-- /admin role -->
|
|
|
|
|
<!-- trainer role -->
|
|
|
|
|
<div class="px-16 pb-10" v-if="role === 'trainer'">
|
|
|
|
|
<div class="mt-11">
|
|
|
|
|
<div class="d-flex justify-center"><UserName role="trainer" /></div>
|
|
|
|
|
</div>
|
|
|
|
|
<v-row class="mt-3">
|
|
|
|
|
<v-col cols="12">
|
|
|
|
|
<div class="">
|
|
|
|
|
<div class="text-left description">
|
|
|
|
|
here is your dashboard home, feel free navigate from right side
|
|
|
|
|
menu or choose from shortcuts we prepared for you.
|
|
|
|
|
</div>
|
|
|
|
|
</div>
|
|
|
|
|
</v-col>
|
|
|
|
|
</v-row>
|
|
|
|
|
<div class="mb-16 mt-10">
|
|
|
|
|
<div class="d-sm-grid d-flex justify-center">
|
|
|
|
|
<div class="mr-5 section">
|
|
|
|
|
<box text="programs" link="programs" icon="WMi-align-left" />
|
|
|
|
|
</div>
|
|
|
|
|
<div class="mr-5 section">
|
|
|
|
|
<box text="bookmarks" link="bookmarks" icon="WMi-bookmark" />
|
|
|
|
|
</div>
|
|
|
|
|
<div class="mr-5 section">
|
|
|
|
|
<box text="trainees" link="users" icon=" WMi-users" />
|
|
|
|
|
</div>
|
|
|
|
|
<div class="mr-5 section">
|
|
|
|
|
<box text="profile" link="profile" icon="WMi-user" />
|
|
|
|
|
</div>
|
|
|
|
|
</div>
|
|
|
|
|
</div>
|
|
|
|
|
<v-divider dark></v-divider>
|
|
|
|
|
<v-row class="mt-3">
|
|
|
|
|
<v-col cols="12">
|
|
|
|
|
<div class="d-flex justify-center pr-16">
|
|
|
|
|
<div class="text-left description">
|
|
|
|
|
and here is some stats we hope it gives you a great overview of
|
|
|
|
|
your status
|
|
|
|
|
</div>
|
|
|
|
|
</div>
|
|
|
|
|
</v-col>
|
|
|
|
|
</v-row>
|
|
|
|
|
<div class="mx-md-16 mx-0 d-flex justify-center">
|
|
|
|
|
<div>
|
|
|
|
|
<div class="mr-16">
|
|
|
|
|
<Notification
|
|
|
|
|
text="total trainees"
|
|
|
|
|
:quantity="
|
|
|
|
|
statistics.trainees_count ? statistics.trainees_count : 0
|
|
|
|
|
"
|
|
|
|
|
/>
|
|
|
|
|
</div>
|
|
|
|
|
</div>
|
|
|
|
|
<div>
|
|
|
|
|
<div class="ml-16">
|
|
|
|
|
<Notification
|
|
|
|
|
text="total programs"
|
|
|
|
|
:quantity="
|
|
|
|
|
statistics.courses_count ? statistics.courses_count : 0
|
|
|
|
|
"
|
|
|
|
|
/>
|
|
|
|
|
</div>
|
|
|
|
|
</div>
|
|
|
|
|
</div>
|
|
|
|
|
</div>
|
|
|
|
|
<!-- /trainer role -->
|
|
|
|
|
<!-- trainee role -->
|
|
|
|
|
<div class="px-16 pb-10" v-if="role === 'trainee'">
|
|
|
|
|
<div class="mt-11">
|
|
|
|
|
<div class="d-flex justify-center"><UserName role="trainee" /></div>
|
|
|
|
|
</div>
|
|
|
|
|
<v-row class="mt-3">
|
|
|
|
|
<v-col cols="12">
|
|
|
|
|
<div class="">
|
|
|
|
|
<div class="text-left description">
|
|
|
|
|
here is your dashboard home, feel free navigate from right side
|
|
|
|
|
menu or choose from shortcuts we prepared for you.
|
|
|
|
|
</div>
|
|
|
|
|
</div>
|
|
|
|
|
</v-col>
|
|
|
|
|
</v-row>
|
|
|
|
|
<div class="mb-16 mt-10">
|
|
|
|
|
<div class="d-sm-grid d-flex justify-center">
|
|
|
|
|
<div class="mr-5 section">
|
|
|
|
|
<box text="bookmarks" link="bookmarks" icon="WMi-bookmark" />
|
|
|
|
|
</div>
|
|
|
|
|
<div class="mr-5 section">
|
|
|
|
|
<box text="programs" link="trainPrograms" icon="WMi-align-left" />
|
|
|
|
|
</div>
|
|
|
|
|
<div class="mr-5 section">
|
|
|
|
|
<box text="profile" link="profile" icon="WMi-user" />
|
|
|
|
|
</div>
|
|
|
|
|
</div>
|
|
|
|
|
</div>
|
|
|
|
|
<v-divider dark></v-divider>
|
|
|
|
|
<v-row class="mt-3">
|
|
|
|
|
<v-col cols="12">
|
|
|
|
|
<div class="d-flex justify-center pr-16">
|
|
|
|
|
<div class="text-left description">
|
|
|
|
|
and here is some stats we hope it gives you a great overview of
|
|
|
|
|
your status
|
|
|
|
|
</div>
|
|
|
|
|
</div>
|
|
|
|
|
</v-col>
|
|
|
|
|
</v-row>
|
|
|
|
|
<div class="mx-md-16 mx-0 d-flex justify-center">
|
|
|
|
|
<div>
|
|
|
|
|
<div class="mr-16">
|
|
|
|
|
<Notification
|
|
|
|
|
text="programs joined"
|
|
|
|
|
:quantity="
|
|
|
|
|
statistics.joined_courses_count
|
|
|
|
|
? statistics.joined_courses_count
|
|
|
|
|
: 0
|
|
|
|
|
"
|
|
|
|
|
/>
|
|
|
|
|
</div>
|
|
|
|
|
</div>
|
|
|
|
|
<div>
|
|
|
|
|
<div class="ml-16">
|
|
|
|
|
<Notification
|
|
|
|
|
text="moves done"
|
|
|
|
|
:quantity="
|
|
|
|
|
statistics.total_series_done
|
|
|
|
|
? statistics.total_series_done
|
|
|
|
|
: 0
|
|
|
|
|
"
|
|
|
|
|
/>
|
|
|
|
|
</div>
|
|
|
|
|
</div>
|
|
|
|
|
</div>
|
|
|
|
|
</div>
|
|
|
|
|
<!-- /trainee role -->
|
|
|
|
|
</main-back>
|
|
|
|
|
</div>
|
|
|
|
|
</template>
|
|
|
|
|
@ -67,12 +218,35 @@
|
|
|
|
|
import Box from "../Global/Section/Box.vue";
|
|
|
|
|
import Notification from "../Global/Section/Notification.vue";
|
|
|
|
|
import UserName from "../Global/Section/UserName.vue";
|
|
|
|
|
import { UserStorage } from "@/utils/storage";
|
|
|
|
|
import StatisticRepository from "@/abstraction/repository/statisticRepository.js";
|
|
|
|
|
export default {
|
|
|
|
|
components: {
|
|
|
|
|
UserName,
|
|
|
|
|
Box,
|
|
|
|
|
Notification,
|
|
|
|
|
},
|
|
|
|
|
data: () => ({
|
|
|
|
|
role: UserStorage.get() ? UserStorage.get().role : null,
|
|
|
|
|
statistics: {},
|
|
|
|
|
}),
|
|
|
|
|
methods: {
|
|
|
|
|
async loadStatistic() {
|
|
|
|
|
let repository = new StatisticRepository();
|
|
|
|
|
this.statistics =
|
|
|
|
|
this.role === "admin"
|
|
|
|
|
? await repository.indexStatisticAdmin()
|
|
|
|
|
: this.role === "trainer"
|
|
|
|
|
? await repository.indexStatisticTrainer()
|
|
|
|
|
: this.role === "trainee"
|
|
|
|
|
? await repository.indexStatisticTrainee()
|
|
|
|
|
: false;
|
|
|
|
|
console.log(this.statistics);
|
|
|
|
|
},
|
|
|
|
|
},
|
|
|
|
|
created() {
|
|
|
|
|
this.loadStatistic();
|
|
|
|
|
},
|
|
|
|
|
};
|
|
|
|
|
</script>
|
|
|
|
|
<style scoped>
|
|
|
|
|
|
sajjad
3 years ago