190 lines
5.6 KiB
Vue
190 lines
5.6 KiB
Vue
<template>
|
|
<view style="position: relative;">
|
|
<view class="customer_nav_bar">
|
|
<!-- 这里是状态栏 -->
|
|
</view>
|
|
<image class="hdbg" :src="getCdnUrl(`home/hdbg.png`)"/>
|
|
|
|
<view class="pg-container">
|
|
|
|
<view class="com-jianju" style="margin-top: 10rpx;">
|
|
<view class="pt-30 pb-40 clr-wht font-32 font-weight">我的</view>
|
|
<u-row align="center" justify="between">
|
|
<view>
|
|
<u-row>
|
|
<u-avatar size="120" :src="userInfo.avatar"></u-avatar>
|
|
<view class="pl-30">
|
|
<u-row>
|
|
<u-text :text="userInfo.nickName" color="#fff" size="32" bold="true"></u-text>
|
|
<view class="ml-20 clr-wht font-24 pos-rlt" style="padding: 8rpx 12rpx;">南京网点
|
|
<view class="pos-abt-all" style="z-index: 0;background: #FFFFFF;opacity: 0.2;border-radius: 20rpx;"></view>
|
|
</view>
|
|
</u-row>
|
|
<view class="mt-20 clr-wht font-24">{{userInfo.phonenumber}}</view>
|
|
</view>
|
|
</u-row>
|
|
</view>
|
|
<view>
|
|
<u-image height="140" width="140" radius="10"></u-image>
|
|
</view>
|
|
</u-row>
|
|
|
|
<view class="mt-40">
|
|
<u-row justify="between">
|
|
<view style="flex: 1;text-align: center;">
|
|
<view class="clr-wht font-32 font-weight">
|
|
<text class="font-26">￥</text>
|
|
<tex>2888.80</tex>
|
|
</view>
|
|
<view class="pt-20 clr-wht font-26" style="opacity: 0.8;">计提预估</view>
|
|
</view>
|
|
<view>
|
|
<u-line direction="col" color="#fff" length="60"></u-line>
|
|
</view>
|
|
<view style="flex: 1;text-align: center;">
|
|
<view class="clr-wht font-32 font-weight">
|
|
<text class="font-26">￥</text>
|
|
<tex>128888.00</tex>
|
|
</view>
|
|
<view class="pt-20 clr-wht font-26" style="opacity: 0.8;">待回款</view>
|
|
</view>
|
|
</u-row>
|
|
</view>
|
|
|
|
<view class="blk-mdl">
|
|
<u-row>
|
|
<u-col v-for="(item) in mainBtnlist" span="3" align="center" custom-style="padding: 30rpx 0;"
|
|
@click="goto(item.url)"
|
|
>
|
|
<u-image height="60" width="60" :src="item.icon" custom-style="margin-left: auto;margin-right: auto;"></u-image>
|
|
<u-text :text="item.title" margin="20rpx 0 0 0" align="center" color="#666" size="26"></u-text>
|
|
</u-col>
|
|
</u-row>
|
|
</view>
|
|
|
|
<view class="blk-mdl">
|
|
<u-row custom-style="padding: 30rpx;" justify="between">
|
|
<u-row>
|
|
<u-image :src="getCdnUrl(`mine/banbenup.png`)" height="34" width="34"></u-image>
|
|
<u-text margin="0 0 0 30rpx" text="版本更新" size="28" color="#333"></u-text>
|
|
</u-row>
|
|
<u-row>
|
|
<u-text margin="0 10rpx 0 0" text="v1.0.0" size="28" color="#666"></u-text>
|
|
<u-icon name="arrow-right" size="32" color="#333"></u-icon>
|
|
</u-row>
|
|
</u-row>
|
|
<u-line></u-line>
|
|
<u-row custom-style="padding: 30rpx;" justify="between">
|
|
<u-row>
|
|
<u-image :src="getCdnUrl(`mine/qingchu.png`)" height="34" width="34"></u-image>
|
|
<u-text margin="0 0 0 30rpx" text="清空本地缓存" size="28" color="#333"></u-text>
|
|
</u-row>
|
|
<u-row>
|
|
<u-icon name="arrow-right" size="32" color="#333"></u-icon>
|
|
</u-row>
|
|
</u-row>
|
|
<u-line></u-line>
|
|
<u-row custom-style="padding: 30rpx;" justify="between">
|
|
<u-row>
|
|
<u-image :src="getCdnUrl(`mine/sao.png`)" height="34" width="34"></u-image>
|
|
<u-text margin="0 0 0 30rpx" text="红线扫描模式" size="28" color="#333"></u-text>
|
|
</u-row>
|
|
<u-row>
|
|
<u-switch v-model="saomiao" active-color="#B12D29" size="34"></u-switch>
|
|
</u-row>
|
|
</u-row>
|
|
<u-line></u-line>
|
|
<u-row custom-style="padding: 30rpx;" justify="between">
|
|
<u-row>
|
|
<u-image :src="getCdnUrl(`mine/xiumima.png`)" height="34" width="34"></u-image>
|
|
<u-text margin="0 0 0 30rpx" text="修改密码" size="28" color="#333"></u-text>
|
|
</u-row>
|
|
<u-row>
|
|
<u-icon name="arrow-right" size="32" color="#333"></u-icon>
|
|
</u-row>
|
|
</u-row>
|
|
<u-line></u-line>
|
|
</view>
|
|
|
|
<view class="pt-40 pb-40">
|
|
<u-button @click="handleUnlogin" type="primary" size="large" shape="circle"
|
|
custom-style="height:86rpx;font-size: 32rpx;border-radius: 20rpx;"
|
|
>退出登录</u-button>
|
|
</view>
|
|
</view>
|
|
|
|
</view>
|
|
</view>
|
|
</template>
|
|
<script>
|
|
import getCdnUrl from "@/common/getCdnUrl"
|
|
import { goto } from "@/common/untool"
|
|
import { USERKEY } from "@/store/actionKey"
|
|
export default {
|
|
computed: {
|
|
userInfo() {
|
|
return this.$store.getters.userInfo
|
|
}
|
|
},
|
|
props: {
|
|
// hasLeftWin: {
|
|
// type: Boolean
|
|
// }
|
|
},
|
|
data() {
|
|
return {
|
|
saomiao: true,
|
|
mainBtnlist: [
|
|
{ title: '服务客户', icon: getCdnUrl(`mine/kehu.png`), url: '' },
|
|
{ title: '计提明细', icon: getCdnUrl(`mine/jitmx.png`), url: 'user/withdraw' },
|
|
{ title: '专属二维码', icon: getCdnUrl(`mine/zhshu.png`), url: 'user/exclusiveQrcode' },
|
|
{ title: '我的收件', icon: getCdnUrl(`mine/shj.png`), url: 'user/bunsStatic' }
|
|
],
|
|
|
|
}
|
|
},
|
|
onShareAppMessage() {
|
|
return {
|
|
// title: '',
|
|
// path: 'TODO'
|
|
}
|
|
},
|
|
methods: {
|
|
getCdnUrl,
|
|
goto,
|
|
async handleUnlogin() {
|
|
await this.$store.dispatch(USERKEY.LOGOUT)
|
|
goto(`login/login`, 2)
|
|
}
|
|
}
|
|
}
|
|
</script>
|
|
|
|
<style lang="scss">
|
|
@import '@/common/uni-nvue.scss';
|
|
</style>
|
|
<style scoped lang="scss">
|
|
.com-jianju {
|
|
margin-left: 28rpx;
|
|
margin-right: 28rpx;
|
|
}
|
|
.hdbg{
|
|
position: absolute;
|
|
height: 600rpx;
|
|
top: 0;
|
|
z-index: 1;
|
|
width: 100%;
|
|
}
|
|
.pg-container{
|
|
position: relative;
|
|
z-index: 2;
|
|
overflow-x: hidden;
|
|
}
|
|
|
|
.blk-mdl{
|
|
margin-top: 40rpx;
|
|
background-color: #fff;
|
|
border-radius: 20rpx;
|
|
}
|
|
</style>
|