You can not select more than 25 topics Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
shop-app/pages/account/setting/index.vue

83 lines
1.7 KiB

<!--
* @Author: ch
* @Date: 2022-03-22 15:09:06
* @LastEditors: ch
* @LastEditTime: 2022-04-19 17:55:28
* @Description: file content
-->
<template>
<view>
<UiCell class="userInfo cell" :title="userInfo.nickname" @click="$Router.push('/setUserInfo')">
<image slot="icon" class="userInfo--head" :src="userInfo.avatar || require('@/static/account/tx.png')" ></image>
</UiCell>
<UiCell class="cell" title="我的收货地址" @click="$Router.push('/addressList')"></UiCell>
<UiCell class="cell" title="关于我们" ></UiCell>
<UiCell class="cell cell--last" title="版本号" value="1.0.0" valueClass="cell--value" :rightIcon="false"></UiCell>
<view class="logout" @click="logout">退</view>
</view>
</template>
<script>
import UiButton from '@/components/UiButton.vue'
import UiCell from '@/components/UiCell.vue'
export default {
components: { UiCell, UiButton },
computed:{
userInfo (){
return this.$store.state.userInfo
}
},
methods:{
logout(){
this.$msb.confirm({
content : '是否退出登录?',
cancelText : '再看看',
confirm : ()=>{
this.$store.commit('SET_TOKEN');
this.$Router.replace('/login');
}
})
}
}
}
</script>
<style lang="scss" scoped>
page{
background: $color-grey1;
}
.userInfo{
margin: 20rpx 0;
border: 0;
height: 200rpx;
&--head{
width: 120rpx;
height: 120rpx;
border-radius: 50%;
margin-right: 40rpx;
}
}
.cell{
padding: 0 40rpx;
&--last{
border: 0;
}
}
.logout{
height: 100rpx;
line-height: 100rpx;
text-align: center;
color: $color-grey4;
background: $color-grey0;
margin: 20rpx 0;
font-size: $font-size-lg;
}
/deep/{
.userInfo .uiCell--title{
font-size: $font-size-lg;
}
.uiCell--value{
color: $color-grey4;
}
}
</style>