This commit is contained in:
Aya Morisawa 2018-08-14 04:30:42 +09:00
parent ba08d1aa53
commit 3b38979a34
2 changed files with 65 additions and 12 deletions

View File

@ -1,11 +1,10 @@
<template>
<div>
<header>%i18n:@dashboard%</header>
<p><b>%i18n:@all-users%</b><span>{{ stats.usersCount | number }}</span></p>
<p><b>%i18n:@original-users%</b><span>{{ stats.originalUsersCount | number }}</span></p>
<p><b>%i18n:@all-notes%</b><span>{{ stats.notesCount | number }}</span></p>
<p><b>%i18n:@original-notes%</b><span>{{ stats.originalNotesCount | number }}</span></p>
<h1>%i18n:@dashboard%</h1>
<p><b>%i18n:@all-users%</b>: <span>{{ stats.usersCount | number }}</span></p>
<p><b>%i18n:@original-users%</b>: <span>{{ stats.originalUsersCount | number }}</span></p>
<p><b>%i18n:@all-notes%</b>: <span>{{ stats.notesCount | number }}</span></p>
<p><b>%i18n:@original-notes%</b>: <span>{{ stats.originalNotesCount | number }}</span></p>
</div>
</template>
@ -25,3 +24,12 @@ export default Vue.extend({
}
});
</script>
<style lang="stylus" scoped>
h1
margin 0 0 1em 0
padding 0 0 8px 0
font-size 1em
color #555
border-bottom solid 1px #eee
</style>

View File

@ -1,21 +1,21 @@
<template>
<div>
<div class="mk-admin">
<nav>
<ul>
<li @click="nav('dashboard')" :class="{ active: page == 'dashboard' }">%i18n:@dashboard%</li>
<li @click="nav('drive')" :class="{ active: page == 'drive' }">%i18n:@drive%</li>
<li @click="nav('users')" :class="{ active: page == 'users' }">%i18n:@users%</li>
<li @click="nav('update')" :class="{ active: page == 'update' }">%i18n:@update%</li>
<li @click="nav('dashboard')" :class="{ active: page == 'dashboard' }">%fa:chalkboard .fw%%i18n:@dashboard%</li>
<li @click="nav('users')" :class="{ active: page == 'users' }">%fa:users .fw%%i18n:@users%</li>
<li @click="nav('drive')" :class="{ active: page == 'drive' }">%fa:cloud .fw%%i18n:@drive%</li>
<!-- <li @click="nav('update')" :class="{ active: page == 'update' }">%i18n:@update%</li> -->
</ul>
</nav>
<main>
<div v-if="page == 'dashboard'">
<x-dashboard/>
</div>
<div v-if="page == 'drive'"></div>
<div v-if="page == 'users'">
<x-suspend-user/>
</div>
<div v-if="page == 'drive'"></div>
<div v-if="page == 'update'"></div>
</main>
</div>
@ -43,3 +43,48 @@ export default Vue.extend({
}
});
</script>
<style lang="stylus" scoped>
@import '~const.styl'
.mk-admin
display flex
height 100%
margin 32px
> nav
flex 0 0 250px
width 100%
height 100%
padding 16px 0 0 0
overflow auto
border-right solid 1px #ddd
> ul
list-style none
> li
display block
padding 10px 16px
margin 0
color #666
cursor pointer
user-select none
transition margin-left 0.2s ease
> [data-fa]
margin-right 4px
&:hover
color #555
&.active
margin-left 8px
color $theme-color !important
> main
width 100%
padding 16px 32px
</style>