81 lines
2.1 KiB
Vue
81 lines
2.1 KiB
Vue
|
<template>
|
||
|
|
<view>
|
||
|
|
<u-navbar :is-back="true"
|
||
|
|
back-icon-color="#ffffff"
|
||
|
|
title="摇一摇"
|
||
|
|
:background="{ background: '#101010'}"
|
||
|
|
title-color="#ffffff"
|
||
|
|
:title-bold="true"
|
||
|
|
title-size="34"
|
||
|
|
:border-bottom="false"
|
||
|
|
z-index="1001">
|
||
|
|
<view slot="right" class="u-p-r-30" @click="toSet()">
|
||
|
|
<u-icon name="more-dot-fill" color="#ffffff" :size="36"></u-icon>
|
||
|
|
</view>
|
||
|
|
</u-navbar>
|
||
|
|
|
||
|
|
<view class="u-flex u-row-center u-col-center" style="padding-top: 60%;">
|
||
|
|
<view>
|
||
|
|
<u-image src="/static/image/wx/yaoyiyao-1.jpg" :width="200" :height="200"></u-image>
|
||
|
|
</view>
|
||
|
|
</view>
|
||
|
|
<view class="footer-box u-flex u-row-around u-col-center">
|
||
|
|
<view @click="activeTab=0">
|
||
|
|
<view class="u-flex u-row-center u-col-center">
|
||
|
|
<view>
|
||
|
|
<u-image v-if="activeTab==0" src="/static/image/wx/yaoyiyao-2.jpg" :width="48" :height="48"></u-image>
|
||
|
|
<u-image v-if="activeTab==1" src="/static/image/wx/yaoyiyao-b.jpg" :width="48" :height="48"></u-image>
|
||
|
|
</view>
|
||
|
|
</view>
|
||
|
|
<view class="u-m-t-8" :style="activeTab==1?'color:#595959;':''">
|
||
|
|
<text>人</text>
|
||
|
|
</view>
|
||
|
|
</view>
|
||
|
|
<view @click="activeTab=1">
|
||
|
|
<view class="u-flex u-row-center u-col-center">
|
||
|
|
<view>
|
||
|
|
<u-image v-if="activeTab==0" src="/static/image/wx/yaoyiyao-3.jpg" :width="48" :height="48"></u-image>
|
||
|
|
<u-image v-if="activeTab==1" src="/static/image/wx/yaoyiyao-c.jpg" :width="48" :height="48"></u-image>
|
||
|
|
</view>
|
||
|
|
</view>
|
||
|
|
<view class="u-m-t-8" :style="activeTab==0?'color:#595959;':''">
|
||
|
|
<text>歌曲和哼唱</text>
|
||
|
|
</view>
|
||
|
|
</view>
|
||
|
|
</view>
|
||
|
|
</view>
|
||
|
|
</template>
|
||
|
|
|
||
|
|
<script>
|
||
|
|
export default {
|
||
|
|
data() {
|
||
|
|
return {
|
||
|
|
activeTab:0,
|
||
|
|
};
|
||
|
|
},
|
||
|
|
methods:{
|
||
|
|
toSet:function(){
|
||
|
|
console.log("去摇一摇设置");
|
||
|
|
uni.$u.route("/pages/find/shake/set");
|
||
|
|
}
|
||
|
|
}
|
||
|
|
}
|
||
|
|
</script>
|
||
|
|
|
||
|
|
<style lang="scss" scoped>
|
||
|
|
.footer-box{
|
||
|
|
color: #ffffff;
|
||
|
|
width: 100%;
|
||
|
|
position: absolute;
|
||
|
|
bottom: 80rpx;
|
||
|
|
padding: 20rpx 100rpx;
|
||
|
|
text-align: center;
|
||
|
|
font-size: 22rpx;
|
||
|
|
}
|
||
|
|
</style>
|
||
|
|
<style>
|
||
|
|
page{
|
||
|
|
background-color: #101010;
|
||
|
|
}
|
||
|
|
</style>
|