dingdong-master/pages/index/my-home.vue

159 lines
4.7 KiB
Vue

<template>
<view>
<view class="bg-gradual-color padding text-center"
:style="'padding-top: ' + pageContentTop + 'px; padding-bottom: 100rpx;'">
<view class="cu-avatar round"
:style="'width: 150rpx; height: 150rpx; background-image:url(' + curUserInfo.workerLogoUrl + ');'">
</view>
<view class="text-xl margin-sm">{{curUserInfo.name}}</view>
<view class="cu-list grid no-border col-2" style="background-color: inherit;">
<view class="cu-item" @click="clickMenuItem({pageUrl: '/pages/my/my-money-bag'})">
<view class="margin-bottom-xs text-xxl">0</view>
<view>我的钱包</view>
</view>
<view class="cu-item solid-left">
<view class="margin-bottom-xs text-xxl">5.0</view>
<view>服务评分</view>
</view>
</view>
</view>
<view class="paper-drawer-bar margin-bottom-with-bar">
<view class="margin-lr-sm cu-list grid no-border col-4 shadow-warp">
<view class="cu-item">
<view class="cuIcon-remind margin-bottom-xs middle-icon"
:class="myInfo.door24h ? 'text-main-color' : 'text-gray'"></view>
<view :class="myInfo.door24h ? '' : 'text-gray'">24小时上门</view>
</view>
<view class="cu-item solid-left">
<view class="cuIcon-safe margin-bottom-xs middle-icon"
:class="myInfo.warranty72h ? 'text-main-color' : 'text-gray'"></view>
<view :class="myInfo.warranty72h ? '' : 'text-gray'">72小时质保</view>
</view>
<view class="cu-item solid-left" @click="goToPage('/pages/my/certification')">
<view class="cuIcon-profile margin-bottom-xs middle-icon"
:class="curCertifyInfo && curCertifyInfo.status === 1 ? 'text-main-color' : 'text-gray'"></view>
<view :class="curCertifyInfo && curCertifyInfo.status === 1 ? '' : 'text-gray'">实名认证</view>
</view>
<view class="cu-item solid-left">
<view class="cuIcon-moneybag margin-bottom-xs middle-icon"
:class="myInfo.deposit ? 'text-main-color' : 'text-gray'"></view>
<view :class="myInfo.deposit ? '' : 'text-gray'">保证金</view>
</view>
</view>
<view class="bg-white">
<view class="margin-top margin-lr-sm">
<view class="flex justify-between align-center solid-bottom padding padding-lr-lg text-lg"
v-for="(item, index) in menuList" @click="clickMenuItem(item)"
v-if="item.show || (item.showByStatus ? curUserInfo.status != -1 : false)">
<view class="flex justify-start align-center">
<view class="margin-right-sm text-main-color text-xl"><view :class="'cuIcon-' + item.icon"></view></view>
<view>{{item.name}}</view>
</view>
<view class="cuIcon-right"></view>
</view>
</view>
</view>
</view>
</view>
</template>
<script>
export default {
name: 'my-home',
data() {
return {
pageContentTop: this.CustomBar,
curUserInfo: {},
curCertifyInfo: null,
myInfo: {},
menuList: [{
name: '提现账户',
icon: 'moneybag',
pageUrl: '/pages/my/withdraw',
// show: true,
showByStatus: true
}, {
name: '交易明细',
icon: 'form',
pageUrl: '/pages/my/my-money-bag',
show: true
}, {
name: '服务明细',
icon: 'calendar'
}, {
name: '师傅入驻',
icon: 'profile',
pageUrl: '/pages/my/master-settled-info',
show: true
}, {
name: '个人信息',
icon: 'lock',
pageUrl: '/pages/my/personal-info',
show: true
}, {
name: '法律声明',
icon: 'read'
}, {
name: '店铺认证',
icon: 'taoxiaopu'
}, {
name: '签约协议',
icon: 'punch'
}, {
name: '反馈到平台',
icon: 'comment'
}, {
name: '开放平台',
icon: 'community'
}, {
name: '师傅缴费',
icon: 'sponsor',
pageUrl: '/pages/my/pay-deposit'
}]
}
},
onReady() {
this.loadData();
},
methods: {
async loadData() {
this.curUserInfo = this.$request.getCurUserInfo();
let res = await this.$request.getWorkerCertify();
this.curCertifyInfo = res.data;
this.myInfo = await this.$api.data('myInfo');
},
clickMenuItem(menu) {
if (menu.prefixFun) {
this[menu.prefixFun]();
}
if (menu.pageUrl) {
uni.navigateTo({
url: menu.pageUrl
})
}
},
goToPage(pageUrl) {
uni.navigateTo({
url: pageUrl
})
}
},
}
</script>
<style scoped>
.cu-list.grid.no-border>.solid-left.cu-item:after {
border-left: 1upx solid rgba(255, 255, 255, 0.5);
}
.paper-drawer-bar {
position: relative;
top: -100rpx;
}
.paper-drawer-bar-back {
z-index: -1;
padding-top: 100rpx;
}
</style>