|
|
@@ -8,10 +8,10 @@
|
|
|
<view class="infor">
|
|
|
<!-- 用户信息 -->
|
|
|
<view class="infor-left">
|
|
|
- <image src="../../static/error/missing-face.png" mode=""></image>
|
|
|
+ <image :src=" userInfo.avatar || '../../static/error/missing-face.png' "></image>
|
|
|
<view class="info-box">
|
|
|
- <view class="username">李丹丹</view>
|
|
|
- <view class="phone">13911111111</view>
|
|
|
+ <view class="username">{{ userInfo.nickname || '游客' }}</view>
|
|
|
+ <view class="phone">{{userInfo.phone}}</view>
|
|
|
</view>
|
|
|
</view>
|
|
|
<!-- 设置 -->
|
|
|
@@ -28,19 +28,19 @@
|
|
|
</view>
|
|
|
<!-- 订单栏 -->
|
|
|
<view class="order-section">
|
|
|
- <view class="order-item" @click="nav('/pages/order/')">
|
|
|
+ <view class="order-item" @click="nav('/pages/order/order?state=1')">
|
|
|
<image src="../../static/img/img19.png" mode="scaleToFill"></image>
|
|
|
<view class="text">待付款</view>
|
|
|
</view>
|
|
|
- <view class="order-item" @click="nav('/pages/order/')">
|
|
|
+ <view class="order-item" @click="nav('/pages/order/order?state=2')">
|
|
|
<image src="../../static/img/img20.png" mode="scaleToFill"></image>
|
|
|
<view class="text">待发货</view>
|
|
|
</view>
|
|
|
- <view class="order-item" @click="nav('/pages/order/')">
|
|
|
+ <view class="order-item" @click="nav('/pages/order/order?state=3')">
|
|
|
<image src="../../static/img/img21.png" mode="scaleToFill"></image>
|
|
|
<view class="text">待收货</view>
|
|
|
</view>
|
|
|
- <view class="order-item" @click="nav('/pages/order/')">
|
|
|
+ <view class="order-item" @click="nav('/pages/order/order?state=4')">
|
|
|
<image src="../../static/img/img22.png" mode="scaleToFill"></image>
|
|
|
<view class="text">已完成</view>
|
|
|
</view>
|
|
|
@@ -51,7 +51,7 @@
|
|
|
<view class="item-box">
|
|
|
<!-- 我的余额 -->
|
|
|
<view class="order-section">
|
|
|
- <view class="order-item" @click="nav('/pages/user/balance')">
|
|
|
+ <view class="order-item" @click="nav('/pages/money/wallet')">
|
|
|
<image src="../../static/img/img26.png" mode="scaleToFill"></image>
|
|
|
<view class="text">我的余额</view>
|
|
|
</view>
|
|
|
@@ -70,7 +70,7 @@
|
|
|
</view>
|
|
|
<!-- 底部列表 -->
|
|
|
<view class="btm">
|
|
|
- <view class="ul-btm">
|
|
|
+ <view class="ul-btm" @click="nav('/pages/user/jiedian')">
|
|
|
<image src="../../static/img/img27.png" mode="scaleToFill"></image>
|
|
|
<view class="text">我的接点</view>
|
|
|
<image class="jiantou" src="../../static/img/img32.png" mode="scaleToFill"></image>
|
|
|
@@ -80,36 +80,136 @@
|
|
|
<view class="text">邀请海报</view>
|
|
|
<image class="jiantou" src="../../static/img/img32.png" mode="scaleToFill"></image>
|
|
|
</view>
|
|
|
- <view class="ul-btm">
|
|
|
+ <view class="ul-btm" >
|
|
|
<image src="../../static/img/img29.png" mode="scaleToFill"></image>
|
|
|
<view class="text">会员注册</view>
|
|
|
<image class="jiantou" src="../../static/img/img32.png" mode="scaleToFill"></image>
|
|
|
</view>
|
|
|
- <view class="ul-btm">
|
|
|
+ <view class="ul-btm" @click="nav('/pages/set/address')">
|
|
|
<image src="../../static/img/img30.png" mode="scaleToFill"></image>
|
|
|
<view class="text">收货地址</view>
|
|
|
<image class="jiantou" src="../../static/img/img32.png" mode="scaleToFill"></image>
|
|
|
</view>
|
|
|
- <view class="ul-btm">
|
|
|
+ <view class="ul-btm" @click="open()">
|
|
|
<image src="../../static/img/img31.png" mode="scaleToFill"></image>
|
|
|
<view class="text">联系客服</view>
|
|
|
<image class="jiantou" src="../../static/img/img32.png" mode="scaleToFill"></image>
|
|
|
</view>
|
|
|
</view>
|
|
|
</view>
|
|
|
+ <uni-popup ref="popup" type="center">
|
|
|
+ <view class="popup-box">
|
|
|
+ <view class="img"><image src="../../static/img/img009.png" mode=""></image></view>
|
|
|
+ <view class="mian">
|
|
|
+ <view class="delivery">
|
|
|
+ <view class="title">已经为您定制专属客服</view>
|
|
|
+ <image src="../../static/img/img010.png" mode=""></image>
|
|
|
+ </view>
|
|
|
+ <view class="nocancel">客服VX:{{ text }}</view>
|
|
|
+ <view class="comfirm-box">
|
|
|
+ <view class="cancel" @click="cancel">取消</view>
|
|
|
+ <view class="comfirm" @click="comfirm(text)">复制微信</view>
|
|
|
+ </view>
|
|
|
+ </view>
|
|
|
+ </view>
|
|
|
+ </uni-popup>
|
|
|
</view>
|
|
|
</template>
|
|
|
|
|
|
<script>
|
|
|
+ import { orderData, getUserInfo,service } from '@/api/user.js';
|
|
|
+ import uniPopup from '@/components/uni-popup/uni-popup.vue';
|
|
|
+ import uniCopy from '@/utils/uni-copy.js';
|
|
|
+ import { mapState, mapMutations } from 'vuex';
|
|
|
export default {
|
|
|
+ components: {
|
|
|
+ uniPopup
|
|
|
+ },
|
|
|
data() {
|
|
|
- return {}
|
|
|
+ return {
|
|
|
+ text:'123465'
|
|
|
+ }
|
|
|
+ },
|
|
|
+ onShow() {
|
|
|
+ //判断是否已经登录
|
|
|
+ if (this.hasLogin) {
|
|
|
+ this.loadBaseData();
|
|
|
+ } else {
|
|
|
+ uni.showModal({
|
|
|
+ title: '登录',
|
|
|
+ content: '您未登录，是否马上登陆?',
|
|
|
+ success: e => {
|
|
|
+ if (e.confirm) {
|
|
|
+ interceptor();
|
|
|
+ }
|
|
|
+ },
|
|
|
+ fail: e => {
|
|
|
+ console.log(e);
|
|
|
+ }
|
|
|
+ });
|
|
|
+ }
|
|
|
+ },
|
|
|
+ computed: {
|
|
|
+ ...mapState('user', ['userInfo', 'orderInfo', 'hasLogin'])
|
|
|
},
|
|
|
methods: {
|
|
|
+ ...mapMutations('user', ['setUserInfo', 'setOrderInfo']),
|
|
|
+ loadBaseData() {
|
|
|
+ getUserInfo({})
|
|
|
+ .then(({ data }) => {
|
|
|
+ console.log(data)
|
|
|
+ this.setUserInfo(data);
|
|
|
+ // 获取用户数据完毕后在获取订单数据防止多次跳转到登录页
|
|
|
+ orderData({})
|
|
|
+ .then(({ data }) => {
|
|
|
+ this.setOrderInfo(data);
|
|
|
+ })
|
|
|
+ .catch(e => {
|
|
|
+ this.setOrderInfo({
|
|
|
+ complete_count: 0, //完成
|
|
|
+ received_count: 0, //待收货
|
|
|
+ unshipped_count: 0, //待发货
|
|
|
+ order_count: 0, //订单总数
|
|
|
+ unpaid_count: 0 //待付款
|
|
|
+ });
|
|
|
+ });
|
|
|
+ })
|
|
|
+ .catch(e => {
|
|
|
+ console.log(e);
|
|
|
+ });
|
|
|
+ },
|
|
|
nav(url) {
|
|
|
+ console.log(url)
|
|
|
uni.navigateTo({
|
|
|
url
|
|
|
})
|
|
|
+ },
|
|
|
+ open(){
|
|
|
+ console.log('点击出现弹窗');
|
|
|
+ this.$refs.popup.open();
|
|
|
+ },
|
|
|
+ // 客服弹窗 - 复制微信
|
|
|
+ comfirm(value) {
|
|
|
+
|
|
|
+ let content = value; //需要复制的内容
|
|
|
+ console.log('复制的内容:', content);
|
|
|
+ // content = typeof content === 'string' ? content : content.toString(); // 复制内容，必须字符串，数字需要转换为字符串
|
|
|
+ const result = uniCopy({content,success});
|
|
|
+ if (result === false) {
|
|
|
+ uni.showToast({
|
|
|
+ title: '不支持'
|
|
|
+ });
|
|
|
+ } else {
|
|
|
+ uni.showToast({
|
|
|
+ title: '复制成功',
|
|
|
+ icon: 'none'
|
|
|
+ });
|
|
|
+ }
|
|
|
+ this.$refs.popup.close();
|
|
|
+ },
|
|
|
+ // 客服弹窗 - 取消
|
|
|
+ cancel() {
|
|
|
+ this.$refs.popup.close();
|
|
|
}
|
|
|
}
|
|
|
}
|
|
|
@@ -320,4 +420,91 @@
|
|
|
}
|
|
|
}
|
|
|
}
|
|
|
+ .popup-box {
|
|
|
+ width: 522rpx;
|
|
|
+ height: 605rpx;
|
|
|
+ background-color: #ffffff;
|
|
|
+ border-radius: 20rpx;
|
|
|
+ position: relative;
|
|
|
+ .img {
|
|
|
+ position: relative;
|
|
|
+ top: -56rpx;
|
|
|
+ left: 0;
|
|
|
+ width: 522rpx;
|
|
|
+ height: 132rpx;
|
|
|
+ display: flex;
|
|
|
+ justify-content: center;
|
|
|
+ image {
|
|
|
+ border-radius: 20rpx 20rpx 0 0;
|
|
|
+ width: 450rpx;
|
|
|
+ height: 132rpx;
|
|
|
+ }
|
|
|
+ }
|
|
|
+
|
|
|
+ .mian {
|
|
|
+ margin-top: -44rpx;
|
|
|
+ display: flex;
|
|
|
+ flex-direction: column;
|
|
|
+ align-items: center;
|
|
|
+ // padding: 32rpx 32rpx;
|
|
|
+ background-color: #ffffff;
|
|
|
+ border-radius: 0 0 20rpx 20rpx;
|
|
|
+ text-align: center;
|
|
|
+
|
|
|
+ .delivery {
|
|
|
+ font-size: 40rpx;
|
|
|
+ color: #333333;
|
|
|
+ display: flex;
|
|
|
+ align-items: center;
|
|
|
+ flex-direction: column;
|
|
|
+ .title {
|
|
|
+ }
|
|
|
+ image {
|
|
|
+ margin-top: 48rpx;
|
|
|
+ width: 172rpx;
|
|
|
+ height: 160rpx;
|
|
|
+ }
|
|
|
+ }
|
|
|
+
|
|
|
+ .nocancel {
|
|
|
+ font-size: 32rpx;
|
|
|
+ color: #333333;
|
|
|
+ margin-top: 14rpx;
|
|
|
+ }
|
|
|
+
|
|
|
+ .comfirm-box {
|
|
|
+ margin-top: 52rpx;
|
|
|
+ display: flex;
|
|
|
+ // margin-bottom: 32rpx;
|
|
|
+
|
|
|
+ // justify-content: space-around;
|
|
|
+ .cancel {
|
|
|
+ display: flex;
|
|
|
+ align-items: center;
|
|
|
+ justify-content: center;
|
|
|
+ width: 197rpx;
|
|
|
+ height: 74rpx;
|
|
|
+ border: 1px solid #dcc786;
|
|
|
+ border-radius: 38rpx;
|
|
|
+
|
|
|
+ font-size: 32rpx;
|
|
|
+ color: #605128;
|
|
|
+ }
|
|
|
+
|
|
|
+ .comfirm {
|
|
|
+ margin-left: 32rpx;
|
|
|
+ display: flex;
|
|
|
+ align-items: center;
|
|
|
+ justify-content: center;
|
|
|
+ width: 197rpx;
|
|
|
+ height: 74rpx;
|
|
|
+ background: linear-gradient(-90deg, #d1ba77 0%, #f7e8ad 100%);
|
|
|
+ border-radius: 38px;
|
|
|
+ font-size: 32rpx;
|
|
|
+ color: #605128;
|
|
|
+ }
|
|
|
+ }
|
|
|
+ }
|
|
|
+ }
|
|
|
+
|
|
|
</style>
|
