501 lines
16 KiB
Vue
501 lines
16 KiB
Vue
<template>
|
|
<view>
|
|
<!-- 顶部头像栏 -->
|
|
<view class="padding bg-gradual-color" :style="'padding-top: ' + pageContentTop + 'px; padding-bottom: 100rpx;'">
|
|
<view class="flex justify-start padding-bottom-xl">
|
|
<view class="cu-avatar round"
|
|
:style="'width: 120rpx; height: 120rpx; background-image:url(' + curUserInfo.customerLogoUrl + ');'"></view>
|
|
<view class="margin-lr-sm">
|
|
<view class="text-xl margin-bottom-xs">{{curUserInfo.name}}</view>
|
|
<view class="padding-xs text-sm">
|
|
<view v-if="myInfo.vipInfo.isVip" class='cu-tag bg-yellow radius'>{{myInfo.vipInfo.level}}会员
|
|
</view>
|
|
<view v-else class='cu-tag bg-yellow radius'>非会员</view>
|
|
</view>
|
|
</view>
|
|
</view>
|
|
<!-- <view class="cu-bar">
|
|
<view class="action bar-first-action"><text class="margin-right-sm">余额:</text><text>{{myInfo.balance}}</text></view>
|
|
<view class="action"><text class="margin-right-sm">积分:</text><text>{{myInfo.integrate}}</text></view>
|
|
<view class="action" @click="showCart">
|
|
<text class="margin-right-sm">购物车:</text>
|
|
<text class="cuIcon-cart my-cart">
|
|
<text class="cu-tag badge my-cart-badge" v-if="myInfo.cartNum > 0">{{myInfo.cartNum}}</text>
|
|
</text>
|
|
</view>
|
|
</view> -->
|
|
</view>
|
|
<view class="margin-lr-sm paper-drawer-bar margin-bottom-with-bar">
|
|
<!-- 服务圈 -->
|
|
<!-- <view class="bg-white padding-lr shadow-warp">
|
|
<view class="cu-bar margin-top-sm solid-bottom">
|
|
<view class="action bar-first-action">
|
|
<text>{{myInfo.servCircle.name}}</text>
|
|
<view class="cuIcon-title text-main-color"></view>
|
|
<text>服务圈</text>
|
|
</view>
|
|
<view class="flex justify-end">
|
|
<view class="text-center margin-right-sm">
|
|
<view class="cuIcon-shop action-icon"></view>
|
|
<view class="text-xs">邻里商铺</view>
|
|
</view>
|
|
<view class="text-center">
|
|
<view class="cuIcon-roundaddfill text-main-color action-icon"></view>
|
|
<view class="text-xs">您的小区</view>
|
|
</view>
|
|
</view>
|
|
</view>
|
|
<view class="padding-top serv-news">
|
|
<view class="flex justify-between padding-bottom" v-for="(item, index) in myInfo.servCircle.newBuy">
|
|
<view class="flex justify-start">
|
|
<view class="cu-avatar round margin-right-sm"
|
|
:style="'background-image:url(' + item.avatarUrl + ');'"></view>
|
|
<view class="text-sm">
|
|
<text class="margin-right-xs">{{encryptString(item.userName)}}</text>
|
|
<text>{{item.action}}</text>
|
|
</view>
|
|
</view>
|
|
<view class="margin-left-sm">
|
|
<button v-if="item.type === 0" class="cu-btn bg-main-color round sm">立即下单</button>
|
|
<button v-else class="cu-btn bg-main-color round sm">学家政</button>
|
|
</view>
|
|
</view>
|
|
</view>
|
|
</view> -->
|
|
<view class="bg-white padding-lr padding-bottom">
|
|
<!-- 服务订单 -->
|
|
<view class="cu-bar solid-bottom margin-top-sm">
|
|
<view class="action bar-first-action">
|
|
<text class="cuIcon-titles text-main-color"></text> 服务订单
|
|
</view>
|
|
<view @click="showMyOrders(servOrderTabList, 0, servOrderType)">
|
|
<text>全部</text>
|
|
<text class="cuIcon-right"></text>
|
|
</view>
|
|
</view>
|
|
<view class="cu-list grid no-border col-5">
|
|
<view class="cu-item" @click="showMyOrders(servOrderTabList, 0, servOrderType)">
|
|
<view class="cuIcon-news">
|
|
<view class="cu-tag badge" v-if="myInfo.serOrderNum.wait2Pay > 0">
|
|
<block>{{myInfo.serOrderNum.wait2Pay}}</block>
|
|
</view>
|
|
</view>
|
|
<text>待付款</text>
|
|
</view>
|
|
<!-- <view class="cu-item" @click="showMyOrders(servOrderTabList, 1, servOrderType)">
|
|
<view class="cuIcon-list">
|
|
<view class="cu-tag badge" v-if="myInfo.serOrderNum.wait2Serv > 0">
|
|
<block>{{myInfo.serOrderNum.wait2Serv}}</block>
|
|
</view>
|
|
</view>
|
|
<text>待接单</text>
|
|
</view>
|
|
<view class="cu-item" @click="showMyOrders(servOrderTabList, 2, servOrderType)">
|
|
<view class="cuIcon-calendar">
|
|
<view class="cu-tag badge" v-if="myInfo.serOrderNum.wait2Serv > 0">
|
|
<block>{{myInfo.serOrderNum.wait2Serv}}</block>
|
|
</view>
|
|
</view>
|
|
<text>待排期</text>
|
|
</view>
|
|
<view class="cu-item" @click="showMyOrders(servOrderTabList, 3, servOrderType)">
|
|
<view class="cuIcon-repair">
|
|
<view class="cu-tag badge" v-if="myInfo.serOrderNum.processing > 0">
|
|
<block>{{myInfo.serOrderNum.processing}}</block>
|
|
</view>
|
|
</view>
|
|
<text>待上门</text>
|
|
</view> -->
|
|
<view class="cu-item" @click="showMyOrders(servOrderTabList, 1, servOrderType)">
|
|
<view class="cuIcon-repair">
|
|
<view class="cu-tag badge" v-if="myInfo.serOrderNum.processing > 0">
|
|
<block>{{myInfo.serOrderNum.processing}}</block>
|
|
</view>
|
|
</view>
|
|
<text>待服务</text>
|
|
</view>
|
|
<view class="cu-item" @click="showMyOrders(servOrderTabList, 2, servOrderType)">
|
|
<view class="cuIcon-comment">
|
|
<view class="cu-tag badge" v-if="myInfo.serOrderNum.afterServ > 0">
|
|
<block>{{myInfo.serOrderNum.afterServ}}</block>
|
|
</view>
|
|
</view>
|
|
<text>进行中</text>
|
|
</view>
|
|
<!-- <view class="cu-item" @click="showMyOrders(servOrderTabList, 3, servOrderType)">
|
|
<view class="cuIcon-notice">
|
|
<view class="cu-tag badge" v-if="myInfo.serOrderNum.afterServ > 0">
|
|
<block>{{myInfo.serOrderNum.afterServ}}</block>
|
|
</view>
|
|
</view>
|
|
<text>确认中</text>
|
|
</view> -->
|
|
<view class="cu-item" @click="showMyOrders(servOrderTabList, 3, servOrderType)">
|
|
<view class="cuIcon-service">
|
|
<view class="cu-tag badge" v-if="myInfo.serOrderNum.afterServ > 0">
|
|
<block>{{myInfo.serOrderNum.afterServ}}</block>
|
|
</view>
|
|
</view>
|
|
<text>售后中</text>
|
|
</view>
|
|
<view class="cu-item" @click="showMyOrders(servOrderTabList, 4, servOrderType)">
|
|
<view class="cuIcon-forward">
|
|
<view class="cu-tag badge" v-if="myInfo.serOrderNum.wait2Forward > 0">
|
|
<block>{{myInfo.serOrderNum.wait2Forward}}</block>
|
|
</view>
|
|
</view>
|
|
<text>已完成</text>
|
|
</view>
|
|
</view>
|
|
<!-- 商品订单 -->
|
|
<!-- <view class="cu-bar solid-bottom">
|
|
<view class="action bar-first-action">
|
|
<text class="cuIcon-titles text-main-color"></text> 商品订单
|
|
</view>
|
|
<view @click="showMyOrders(productOrderTabList, 0, productOrderType)">
|
|
<text>全部</text>
|
|
<text class="cuIcon-right"></text>
|
|
</view>
|
|
</view>
|
|
<view class="cu-list grid no-border col-5">
|
|
<view class="cu-item" @click="showMyOrders(productOrderTabList, 0, productOrderType)">
|
|
<view class="cuIcon-news">
|
|
<view class="cu-tag badge" v-if="myInfo.serOrderNum.wait2Pay > 0">
|
|
<block>{{myInfo.serOrderNum.wait2Pay}}</block>
|
|
</view>
|
|
</view>
|
|
<text>待付款</text>
|
|
</view>
|
|
<view class="cu-item" @click="showMyOrders(productOrderTabList, 1, productOrderType)">
|
|
<view class="cuIcon-goodsfavor">
|
|
<view class="cu-tag badge" v-if="myInfo.serOrderNum.buy> 0">
|
|
<block>{{myInfo.serOrderNum.buy}}</block>
|
|
</view>
|
|
</view>
|
|
<text>买到的</text>
|
|
</view>
|
|
<view class="cu-item" @click="showMyOrders(productOrderTabList, 2, productOrderType)">
|
|
<view class="cuIcon-goodsnew">
|
|
<view class="cu-tag badge" v-if="myInfo.serOrderNum.sale > 0">
|
|
<block>{{myInfo.serOrderNum.sale}}</block>
|
|
</view>
|
|
</view>
|
|
<text>卖出的</text>
|
|
</view>
|
|
<view class="cu-item" @click="showMyOrders(productOrderTabList, 3, productOrderType)">
|
|
<view class="cuIcon-comment">
|
|
<view class="cu-tag badge" v-if="myInfo.serOrderNum.afterServ > 0">
|
|
<block>{{myInfo.serOrderNum.afterServ}}</block>
|
|
</view>
|
|
</view>
|
|
<text>售后中</text>
|
|
</view>
|
|
<view class="cu-item" @click="showMyOrders(productOrderTabList, 4, productOrderType)">
|
|
<view class="cuIcon-forward">
|
|
<view class="cu-tag badge" v-if="myInfo.serOrderNum.wait2Forward > 0">
|
|
<block>{{myInfo.serOrderNum.wait2Forward}}</block>
|
|
</view>
|
|
</view>
|
|
<text>待转发</text>
|
|
</view>
|
|
</view> -->
|
|
</view>
|
|
<!-- 所有功能 -->
|
|
<view class="bg-white padding-lr padding-bottom">
|
|
<view class="cu-bar margin-top-sm solid-bottom">
|
|
<view class="action bar-first-action">
|
|
<view class="cuIcon-titles text-main-color"></view>
|
|
<text>所有功能</text>
|
|
</view>
|
|
</view>
|
|
<view class="cu-list grid no-border col-4">
|
|
<!-- <view class="cu-item" @click="showPage(null)">
|
|
<view class="cuIcon-wefill text-red"></view>
|
|
<text>我的发布</text>
|
|
</view> -->
|
|
<view class="cu-item" @click="showMyAddress">
|
|
<view class="cuIcon-locationfill text-orange"></view>
|
|
<text>地址管理</text>
|
|
</view>
|
|
<!-- <view class="cu-item">
|
|
<view class="cuIcon-questionfill text-yellow"></view>
|
|
<text>常见问题</text>
|
|
</view> -->
|
|
<!-- <view class="cu-item">
|
|
<view class="cuIcon-servicefill text-olive"></view>
|
|
<text>联系客服</text>
|
|
</view> -->
|
|
<view class="cu-item" @click="showAppInviteQrcode">
|
|
<view class="cuIcon-qr_code text-green"></view>
|
|
<text>二维码分享</text>
|
|
</view>
|
|
<view class="cu-item" v-if="curUserInfo.placeStatus == 2" @click="showPage('/pages/my/withdraw')">
|
|
<view class="cuIcon-moneybagfill text-cyan"></view>
|
|
<text>钱包</text>
|
|
</view>
|
|
<!-- <view class="cu-item">
|
|
<view class="cuIcon-friendaddfill text-blue"></view>
|
|
<text>加盟项目</text>
|
|
</view> -->
|
|
<!-- <view class="cu-item">
|
|
<view class="cuIcon-group_fill text-purple"></view>
|
|
<text>社区代理</text>
|
|
</view> -->
|
|
</view>
|
|
</view>
|
|
<!-- 后台入口 -->
|
|
<view class="bg-white padding-lr padding-bottom">
|
|
<view class="cu-bar margin-top-sm solid-bottom">
|
|
<view class="action bar-first-action">
|
|
<view class="cuIcon-titles text-main-color"></view>
|
|
<text>后台入口</text>
|
|
</view>
|
|
</view>
|
|
<view class="cu-list grid no-border col-4">
|
|
<!-- <view class="cu-item">
|
|
<view class="cuIcon-brandfill text-mauve"></view>
|
|
<text>商家注册</text>
|
|
</view> -->
|
|
<view class="cu-item" @click="showApplyOperator">
|
|
<view class="cuIcon-wenzi text-pink"></view>
|
|
<text>运营商申请</text>
|
|
</view>
|
|
<!-- <view class="cu-item">
|
|
<view class="cuIcon-searchlist text-brown"></view>
|
|
<text>后台数据</text>
|
|
</view> -->
|
|
</view>
|
|
</view>
|
|
</view>
|
|
|
|
<!-- app二维码分享 -->
|
|
<view class="cu-modal" :class="appShareQrcodeModal?'show':''">
|
|
<view class="cu-dialog bg-white">
|
|
<view class="cu-bar bg-white justify-end">
|
|
<view class="content">小程序邀请二维码</view>
|
|
<view class="action" @click="hideModal" data-modal="appShareQrcodeModal">
|
|
<text class="cuIcon-close text-red"></text>
|
|
</view>
|
|
</view>
|
|
<view class="padding-tb-sm">
|
|
<image :src="'data:image/png;base64,' + appQrcode" mode="aspectFit"></image>
|
|
</view>
|
|
<view class="text-center padding">
|
|
<view class="padding-bottom-sm text-lg">请通过扫码或分享链接给好友进行邀请</view>
|
|
<button class="cu-btn bg-main-color shadow-blur" open-type="share">
|
|
<text class="cuIcon-share"></text>
|
|
<text>分享链接给好友</text>
|
|
</button>
|
|
</view>
|
|
</view>
|
|
</view>
|
|
</view>
|
|
</template>
|
|
|
|
<script>
|
|
// import appInviteQrcode from '@/pages/my/app-invite-qrcode.vue';
|
|
|
|
export default {
|
|
name: 'personal-center',
|
|
// components: {
|
|
// appInviteQrcode
|
|
// },
|
|
data() {
|
|
return {
|
|
pageContentTop: this.CustomBar,
|
|
curUserInfo: {},
|
|
myInfo: {},
|
|
servOrderTabList: [{
|
|
// type: -1,
|
|
name: '待付款'
|
|
},
|
|
// {
|
|
// type: 0,
|
|
// name: '待接单'
|
|
// }, {
|
|
// type: 1,
|
|
// name: '待排期'
|
|
// }, {
|
|
// type: 2,
|
|
// name: '待上门'
|
|
// },
|
|
{
|
|
type: '0,1,2',
|
|
name: '待服务'
|
|
}, {
|
|
type: '3,4',
|
|
name: '服务中'
|
|
},
|
|
// {
|
|
// type: 4,
|
|
// name: '待确认'
|
|
// },
|
|
{
|
|
// type: 4,
|
|
name: '售后中'
|
|
}, {
|
|
type: 5,
|
|
name: '已完成'
|
|
}],
|
|
servOrderType: 0,
|
|
productOrderTabList: [{
|
|
// type: -1,
|
|
name: '待付款'
|
|
}, {
|
|
type: -1,
|
|
name: '买到的'
|
|
}, {
|
|
type: -1,
|
|
name: '卖出的'
|
|
}, {
|
|
type: -1,
|
|
name: '售后中'
|
|
}, {
|
|
type: -1,
|
|
name: '已完成'
|
|
}],
|
|
productOrderType: 1,
|
|
|
|
appQrcode: '',
|
|
appShareQrcodeModal: false
|
|
}
|
|
},
|
|
onReady() {
|
|
this.loadData();
|
|
},
|
|
methods: {
|
|
async loadData() {
|
|
await this.$request.refreshCurUserCache();
|
|
this.curUserInfo = this.$request.getCurUserInfo();
|
|
this.myInfo = await this.$api.data('myInfo');
|
|
},
|
|
showMyOrders(tabHeaderList, tabCur, orderType) {
|
|
let tabInfo = {
|
|
orderType: orderType,
|
|
tabHeaderList: tabHeaderList,
|
|
tabCur: tabCur
|
|
}
|
|
uni.navigateTo({
|
|
url: '/pages/my/my-order?tabInfo=' + encodeURIComponent(JSON.stringify(tabInfo))
|
|
})
|
|
},
|
|
encryptString(str) {
|
|
str = str[0] + "**" + str[str.length - 1];
|
|
return str;
|
|
},
|
|
showCart() {
|
|
uni.navigateTo({
|
|
url: '/pages/my/my-cart'
|
|
});
|
|
},
|
|
showMyAddress() {
|
|
uni.navigateTo({
|
|
url: '/pages/my/my-address'
|
|
});
|
|
},
|
|
showApplyOperator() {
|
|
this.curUserInfo = this.$request.getCurUserInfo();
|
|
// 判断当前用户的是否已提交分销资格申请
|
|
if (this.curUserInfo.placeStatus == 0) {
|
|
uni.navigateTo({
|
|
url: '/pages/my/apply-operator'
|
|
})
|
|
} else if (this.curUserInfo.placeStatus == 2) {
|
|
uni.navigateTo({
|
|
url: '/pages/my/my-team-member'
|
|
})
|
|
} else {
|
|
uni.showToast({
|
|
icon: 'none',
|
|
title: '申请审核中'
|
|
})
|
|
}
|
|
},
|
|
async showAppInviteQrcode() {
|
|
this.curUserInfo = this.$request.getCurUserInfo();
|
|
// 判断当前用户的是否已通过分销资格审核
|
|
if (this.curUserInfo.placeStatus == 1) {
|
|
uni.showToast({
|
|
icon: 'none',
|
|
title: '申请审核中'
|
|
})
|
|
} else if (this.curUserInfo.placeStatus != 2) {
|
|
uni.navigateTo({
|
|
url: '/pages/my/apply-operator'
|
|
})
|
|
} else {
|
|
// 判断是否有绑定银行信息
|
|
let res = await this.$request.getBindBankCardByCustomerId({
|
|
customerId: this.curUserInfo.customerId
|
|
});
|
|
let bindBankCardInfo = res.data;
|
|
if (bindBankCardInfo && bindBankCardInfo.bankNum) {
|
|
// 分销资格审核通过，可进行二维码分享
|
|
let res = await this.$request.getUnlimitedWxacode({
|
|
scene: "distributor=" + this.curUserInfo.customerId
|
|
});
|
|
this.appQrcode = res.data;
|
|
this.appShareQrcodeModal = true;
|
|
} else {
|
|
uni.navigateTo({
|
|
url: '/pages/my/withdraw'
|
|
})
|
|
}
|
|
}
|
|
},
|
|
showPage(pageUrl) {
|
|
if (pageUrl) {
|
|
uni.navigateTo({
|
|
url: pageUrl
|
|
})
|
|
} else {
|
|
uni.showToast({
|
|
icon: 'none',
|
|
title: '功能开发中'
|
|
})
|
|
}
|
|
},
|
|
hideModal(e) {
|
|
this[e.currentTarget.dataset.modal] = false;
|
|
}
|
|
}
|
|
}
|
|
</script>
|
|
|
|
<style scoped>
|
|
.bg-main-color .solid-bottom::after {
|
|
border-bottom: 1upx solid rgba(255, 255, 255, 0.5);
|
|
}
|
|
|
|
.my-cart {
|
|
position: relative;
|
|
font-size: 40rpx;
|
|
}
|
|
|
|
.my-cart-badge {
|
|
right: -30rpx;
|
|
}
|
|
|
|
.action-icon {
|
|
font-size: 40rpx;
|
|
}
|
|
|
|
.paper-drawer-bar {
|
|
position: relative;
|
|
top: -100rpx;
|
|
}
|
|
|
|
.bar-first-action {
|
|
margin-left: unset !important;
|
|
font-size: 30rpx !important;
|
|
}
|
|
|
|
.serv-news .cu-avatar {
|
|
min-width: 64rpx;
|
|
}
|
|
|
|
.serv-news button {
|
|
min-width: 120rpx;
|
|
}
|
|
</style>
|