Alexander/FitTrackee
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

Client - init dashboard components (wip)

Browse Source
This commit is contained in:
Sam 2021-08-21 18:47:35 +02:00
parent db9ea49998
commit 93f5452b30
5 changed files with 44 additions and 0 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

3
fittrackee_client/src/components/Dashboard/Timeline.vue Normal file
View File

@ -0,0 +1,3 @@
<template>
<div>Timeline</div>
</template>

3
fittrackee_client/src/components/Dashboard/UserCalendar.vue Normal file
View File

@ -0,0 +1,3 @@
<template>
<div>Calendar</div>
</template>

3
fittrackee_client/src/components/Dashboard/UserMonthStats.vue Normal file
View File

@ -0,0 +1,3 @@
<template>
<div>Month stats</div>
</template>

3
fittrackee_client/src/components/Dashboard/UserRecords.vue Normal file
View File

@ -0,0 +1,3 @@
<template>
<div>User records</div>
</template>

32
fittrackee_client/src/views/DashBoard.vue
View File

@ -3,12 +3,26 @@
<div class="container">
<UserStats :user="authUser" v-if="authUser.username" />
</div>
<div class="container">
<div class="left-container dashboard-container">
<UserMonthStats :user="authUser" />
<UserRecords />
</div>
<div class="right-container dashboard-container">
<UserCalendar />
<Timeline />
</div>
</div>
</div>
</template>
<script lang="ts">
import { computed, ComputedRef, defineComponent } from 'vue'
import Timeline from '@/components/Dashboard/Timeline.vue'
import UserCalendar from '@/components/Dashboard/UserCalendar.vue'
import UserMonthStats from '@/components/Dashboard/UserMonthStats.vue'
import UserRecords from '@/components/Dashboard/UserRecords.vue'
import UserStats from '@/components/Dashboard/UserStats.vue'
import { USER_STORE } from '@/store/constants'
import { IAuthUserProfile } from '@/types/user'
@ -17,6 +31,10 @@
export default defineComponent({
name: 'Dashboard',
components: {
Timeline,
UserCalendar,
UserMonthStats,
UserRecords,
UserStats,
},
setup() {
@ -28,3 +46,17 @@
},
})
</script>
<style lang="scss">
@import '~@/scss/base';
.dashboard-container {
display: flex;
flex-direction: column;
}
.left-container {
width: 35%;
}
.right-container {
width: 65%;
}
</style>