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> <template>
<div> <div>
<header>%i18n:@dashboard%</header> <h1>%i18n:@dashboard%</h1>
<p><b>%i18n:@all-users%</b>: <span>{{ stats.usersCount | number }}</span></p>
<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:@original-users%</b><span>{{ stats.originalUsersCount | number }}</span></p> <p><b>%i18n:@all-notes%</b>: <span>{{ stats.notesCount | 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>
<p><b>%i18n:@original-notes%</b><span>{{ stats.originalNotesCount | number }}</span></p>
</div> </div>
</template> </template>
@ -25,3 +24,12 @@ export default Vue.extend({
} }
}); });
</script> </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> <template>
<div> <div class="mk-admin">
<nav> <nav>
<ul> <ul>
<li @click="nav('dashboard')" :class="{ active: page == 'dashboard' }">%i18n:@dashboard%</li> <li @click="nav('dashboard')" :class="{ active: page == 'dashboard' }">%fa:chalkboard .fw%%i18n:@dashboard%</li>
<li @click="nav('drive')" :class="{ active: page == 'drive' }">%i18n:@drive%</li> <li @click="nav('users')" :class="{ active: page == 'users' }">%fa:users .fw%%i18n:@users%</li>
<li @click="nav('users')" :class="{ active: page == 'users' }">%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> <!-- <li @click="nav('update')" :class="{ active: page == 'update' }">%i18n:@update%</li> -->
</ul> </ul>
</nav> </nav>
<main> <main>
<div v-if="page == 'dashboard'"> <div v-if="page == 'dashboard'">
<x-dashboard/> <x-dashboard/>
</div> </div>
<div v-if="page == 'drive'"></div>
<div v-if="page == 'users'"> <div v-if="page == 'users'">
<x-suspend-user/> <x-suspend-user/>
</div> </div>
<div v-if="page == 'drive'"></div>
<div v-if="page == 'update'"></div> <div v-if="page == 'update'"></div>
</main> </main>
</div> </div>
@ -43,3 +43,48 @@ export default Vue.extend({
} }
}); });
</script> </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>