pixel
5 years ago
3 changed files with 1166 additions and 16 deletions
-
1044QMPlusVuePage/src/style/animition.scss
-
93QMPlusVuePage/src/view/dashbord/component/animition.vue
-
45QMPlusVuePage/src/view/dashbord/index.vue
1044
QMPlusVuePage/src/style/animition.scss
File diff suppressed because it is too large
View File
File diff suppressed because it is too large
View File
@ -0,0 +1,93 @@ |
|||||
|
<template> |
||||
|
<div class="container"> |
||||
|
<ul class="moon"> |
||||
|
<li class="crater"></li> |
||||
|
<li class="crater"></li> |
||||
|
<li class="crater"></li> |
||||
|
</ul> |
||||
|
<ul class="mountain-range"> |
||||
|
<li class="mountain"></li> |
||||
|
<li class="mountain"></li> |
||||
|
<li class="mountain"></li> |
||||
|
<li class="mountain"></li> |
||||
|
<li class="mountain"></li> |
||||
|
<li class="mountain"></li> |
||||
|
<li class="mountain"></li> |
||||
|
<li class="mountain"></li> |
||||
|
<li class="mountain"></li> |
||||
|
<li class="mountain"></li> |
||||
|
<li class="mountain"></li> |
||||
|
</ul> |
||||
|
<div class="mountain-range-mask"></div> |
||||
|
<ul class="forest"> |
||||
|
<li class="hill"></li> |
||||
|
<li class="hill"></li> |
||||
|
<li class="hill"></li> |
||||
|
</ul> |
||||
|
<ul class="sparkles"> |
||||
|
<li class="sparkle one"></li> |
||||
|
<li class="sparkle one"></li> |
||||
|
<li class="sparkle one"></li> |
||||
|
<li class="sparkle one"></li> |
||||
|
<li class="sparkle two"></li> |
||||
|
<li class="sparkle two"></li> |
||||
|
<li class="sparkle two"></li> |
||||
|
<li class="sparkle two"></li> |
||||
|
<li class="sparkle three"></li> |
||||
|
<li class="sparkle three"></li> |
||||
|
<li class="sparkle three"></li> |
||||
|
<li class="sparkle three"></li> |
||||
|
<li class="sparkle four"></li> |
||||
|
<li class="sparkle four"></li> |
||||
|
<li class="sparkle four"></li> |
||||
|
<li class="sparkle four"></li> |
||||
|
<li class="sparkle five"></li> |
||||
|
<li class="sparkle five"></li> |
||||
|
<li class="sparkle five"></li> |
||||
|
<li class="sparkle five"></li> |
||||
|
<li class="sparkle six"></li> |
||||
|
<li class="sparkle six"></li> |
||||
|
<li class="sparkle six"></li> |
||||
|
<li class="sparkle six"></li> |
||||
|
<li class="sparkle seven"></li> |
||||
|
<li class="sparkle seven"></li> |
||||
|
<li class="sparkle seven"></li> |
||||
|
<li class="sparkle seven"></li> |
||||
|
<li class="sparkle eight"></li> |
||||
|
<li class="sparkle eight"></li> |
||||
|
<li class="sparkle eight"></li> |
||||
|
<li class="sparkle eight"></li> |
||||
|
</ul> |
||||
|
<div class="grass"> |
||||
|
<div class="pokemon"> |
||||
|
<div class="poke" id="bulbasaur"> |
||||
|
<div class="ear"></div> |
||||
|
<div class="ear"></div> |
||||
|
<div class="head"></div> |
||||
|
<div class="leg"></div> |
||||
|
<div class="bulba-body"></div> |
||||
|
<div class="bulbs"> |
||||
|
<div class="bulb"></div> |
||||
|
</div> |
||||
|
</div> |
||||
|
<div class="poke" id="pikachu"> |
||||
|
<div class="ear"></div> |
||||
|
<div class="ear"></div> |
||||
|
<div class="hand"></div> |
||||
|
<div class="pika-body"></div> |
||||
|
<div class="head"></div> |
||||
|
<div class="pika-tail"></div> |
||||
|
</div> |
||||
|
</div> |
||||
|
</div> |
||||
|
</div> |
||||
|
</template> |
||||
|
<script> |
||||
|
export default { |
||||
|
name: 'Animition' |
||||
|
} |
||||
|
</script> |
||||
|
<style lang="scss"> |
||||
|
@import '@/style/animition.scss'; |
||||
|
|
||||
|
</style> |
||||
@ -1,33 +1,46 @@ |
|||||
<template> |
<template> |
||||
<el-card class="box-card" shadow="hover"> |
|
||||
<div class="clearfix" slot="header"> |
|
||||
<span>用户信息</span> |
|
||||
</div> |
|
||||
<el-row> |
|
||||
<div class="fl-left left-mg-xs"> |
|
||||
<el-avatar :size="120" :src="userInfo.headerImg" shape="square"></el-avatar> |
|
||||
|
<div> |
||||
|
<h2 style="text-align:center"> |
||||
|
gin-vue-admin by 奇淼 And Spike |
||||
|
</h2> |
||||
|
<h4 style="text-align:center"> |
||||
|
微信：shouzi_1994 |
||||
|
</h4> |
||||
|
<!-- <el-card class="box-card" shadow="hover"> |
||||
|
<div class="clearfix" slot="header"> |
||||
|
<span>用户信息</span> |
||||
</div> |
</div> |
||||
<div class="fl-left left-mg-lg"> |
|
||||
<div>用户ID：{{userInfo.uuid}}</div> |
|
||||
<div>用户昵称：{{userInfo.nickName}}</div> |
|
||||
<div>用户组：{{userInfo.authority&&userInfo.authority.authorityName}}</div> |
|
||||
</div> |
|
||||
</el-row> |
|
||||
</el-card> |
|
||||
|
<el-row> |
||||
|
<div class="fl-left left-mg-xs"> |
||||
|
<el-avatar :size="120" :src="userInfo.headerImg" shape="square"></el-avatar> |
||||
|
</div> |
||||
|
<div class="fl-left left-mg-lg"> |
||||
|
<div>用户ID：{{userInfo.uuid}}</div> |
||||
|
<div>用户昵称：{{userInfo.nickName}}</div> |
||||
|
<div>用户组：{{userInfo.authority&&userInfo.authority.authorityName}}</div> |
||||
|
</div> |
||||
|
</el-row> |
||||
|
</el-card> --> |
||||
|
<Animition /> |
||||
|
</div> |
||||
</template> |
</template> |
||||
|
|
||||
<script> |
<script> |
||||
import { mapGetters } from 'vuex' |
import { mapGetters } from 'vuex' |
||||
|
import Animition from '@/view/dashbord/component/animition.vue' |
||||
export default { |
export default { |
||||
name: 'Dashbord', |
name: 'Dashbord', |
||||
computed: { |
computed: { |
||||
...mapGetters('user', ['userInfo']) |
...mapGetters('user', ['userInfo']) |
||||
|
}, |
||||
|
components: { |
||||
|
Animition |
||||
} |
} |
||||
} |
} |
||||
</script> |
</script> |
||||
|
|
||||
<style scoped> |
<style scoped> |
||||
.box-card{ |
|
||||
width: 600px; |
|
||||
|
.box-card { |
||||
|
width: 600px; |
||||
} |
} |
||||
</style> |
</style> |
||||
Write
Preview
Loading…
Cancel
Save
Reference in new issue