435 lines
12 KiB
Vue
435 lines
12 KiB
Vue
<template>
|
|
<view class="main">
|
|
<view class="topHeader" :style="{ paddingTop: menu.bottom + 6 + 'px' }">
|
|
<view
|
|
class="headerTop"
|
|
:style="{ top: menu.top + (menu.height - 24) / 2 + 'px' }"
|
|
>
|
|
<image
|
|
class="backArrow"
|
|
src="/static/images/home/backArrowWhite.svg"
|
|
@click="handleBackHome"
|
|
/>
|
|
<text class="pageTitle">{{
|
|
pageType === "UnionMall" ? "工会之家" : "我的"
|
|
}}</text>
|
|
<view class="backArrow"></view>
|
|
</view>
|
|
</view>
|
|
<view class="userBox">
|
|
<view class="userLeft">
|
|
<image class="userImg" src="/static/images/home/defaultUser.svg" />
|
|
<view class="userDetail">
|
|
<view class="userName">{{ user.MEMBERSHIP_NAME }}</view>
|
|
<view class="userPhone">{{ phone || "" }}</view>
|
|
</view>
|
|
</view>
|
|
<view class="userRight">
|
|
<image class="messageImg" src="/static/images/home/msg.svg" />
|
|
</view>
|
|
</view>
|
|
|
|
<view class="content">
|
|
<view class="userOrder">
|
|
<view class="orderTitle">我的订单</view>
|
|
<view class="orderList">
|
|
<view
|
|
class="orderItem"
|
|
v-for="(item, index) in userOrderList"
|
|
:key="index"
|
|
@click="handleGo(item.value)"
|
|
>
|
|
<image class="itemImg" :src="item.src" />
|
|
<text class="itemText">{{ item.label }}</text>
|
|
<text class="itemValue">{{
|
|
item.value === 1
|
|
? Unpaid_Count
|
|
: item.value === 2
|
|
? Deliver_Count
|
|
: item.value === 3
|
|
? CheckOrder_Count
|
|
: item.value === 4
|
|
? Complete_Count
|
|
: ""
|
|
}}</text>
|
|
</view>
|
|
</view>
|
|
</view>
|
|
|
|
<view class="userOrder" style="margin-top: 24rpx">
|
|
<view class="orderTitle">我的评价</view>
|
|
<view class="orderList">
|
|
<view
|
|
class="orderItem"
|
|
v-for="(item, index) in evaluateList"
|
|
:key="index"
|
|
@click="goToEvaluate(item.value)"
|
|
>
|
|
<image class="itemImg" :src="item.src" />
|
|
<text class="itemText">{{ item.label }}</text>
|
|
<text class="itemValue">{{
|
|
item.value === 1
|
|
? Comment_Count
|
|
: item.value === 2
|
|
? Evaluated_Count
|
|
: ""
|
|
}}</text>
|
|
</view>
|
|
</view>
|
|
</view>
|
|
|
|
<view class="userOrder">
|
|
<view class="orderTitle">常用功能</view>
|
|
<view class="orderList">
|
|
<view class="orderItem" @click="goAddressManager">
|
|
<image class="itemImg" src="/static/images/home/wati_go.svg" />
|
|
<text class="itemText" style="font-size: 24rpx; white-space: nowrap"
|
|
>地址管理</text
|
|
>
|
|
</view>
|
|
</view>
|
|
</view>
|
|
</view>
|
|
|
|
<shop-tabbar
|
|
:page="'/pages/shopMallPage/user/index'"
|
|
:pageType="pageType"
|
|
:shopCarLength="shopCarListCount"
|
|
/>
|
|
</view>
|
|
</template>
|
|
|
|
<script>
|
|
import { mapGetters } from "vuex";
|
|
import shopTabbar from "../../../components/shopTabbar.vue";
|
|
export default {
|
|
components: { shopTabbar },
|
|
data() {
|
|
return {
|
|
menu: {}, // 用户手机信息对象
|
|
userOrderList: [
|
|
{ label: "待付款", value: 1, src: "/static/images/home/wati_go.svg" },
|
|
{ label: "待发货", value: 2, src: "/static/images/home/wati_go.svg" },
|
|
{
|
|
label: "待收货",
|
|
value: 3,
|
|
src: "/static/images/home/wait_check.svg",
|
|
},
|
|
{ label: "已完成", value: 4, src: "/static/images/home/finish.svg" },
|
|
], // 我的订单tab数组
|
|
evaluateList: [
|
|
{ src: "/static/images/home/wait_fed.svg", label: "待评价", value: 1 },
|
|
{ src: "/static/images/home/fead.svg", label: "已评价", value: 2 },
|
|
{},
|
|
], // 我的评价tab数组
|
|
|
|
Deliver_Count: 0, // 待发货
|
|
Complete_Count: 0, // 已完成
|
|
Evaluated_Count: 0, // 已评价
|
|
CheckOrder_Count: 0, // 待收货
|
|
Comment_Count: 0, // 待评价
|
|
Unpaid_Count: 0, // 待付款
|
|
|
|
pageType: "", // 页面类型 是不是进来查工会之家的
|
|
shopCarListCount: 0, // 购物车商品数量
|
|
};
|
|
},
|
|
computed: {
|
|
...mapGetters({
|
|
user: "user",
|
|
serverList: "severList",
|
|
}),
|
|
phone() {
|
|
if (this.user.MEMBERSHIP_MOBILEPHONE) {
|
|
let a = this.user.MEMBERSHIP_MOBILEPHONE.substring(0, 3);
|
|
let b = this.user.MEMBERSHIP_MOBILEPHONE.substring(7, 11);
|
|
return a + "****" + b;
|
|
} else {
|
|
return "";
|
|
}
|
|
},
|
|
},
|
|
onLoad(query) {
|
|
this.menu = uni.getMenuButtonBoundingClientRect();
|
|
console.log("this.menu", this.menu);
|
|
if (query.pageType) {
|
|
this.pageType = query.pageType;
|
|
}
|
|
console.log("this.pageType", this.pageType);
|
|
this.$utils.addUserBehaviorNew();
|
|
},
|
|
onShow() {
|
|
if (!this.user.MEMBERSHIP_ID) {
|
|
uni.navigateTo({ url: "/pages/register/index" });
|
|
}
|
|
// 请求用户的信息和订单信息
|
|
this.getMember();
|
|
// 判断当前的购物车里面是否有东西
|
|
let shopCarList = [];
|
|
|
|
if (this.pageType === "UnionMall") {
|
|
shopCarList = this.$store.state.unionMyShopCar;
|
|
} else {
|
|
shopCarList = this.$store.state.myShopCar;
|
|
}
|
|
|
|
console.log("shopCarList", shopCarList);
|
|
let count = 0;
|
|
if (shopCarList && shopCarList.length > 0) {
|
|
shopCarList.forEach((item) => {
|
|
count += item.count;
|
|
});
|
|
}
|
|
this.shopCarListCount = count;
|
|
},
|
|
methods: {
|
|
getMember() {
|
|
let _this = this;
|
|
_this.$api
|
|
.getCoop({
|
|
action_type: "GetMembershipInfo",
|
|
// memberShipId: this.user.MEMBERSHIP_ID,
|
|
WechatUserId: this.user.WechatUserId,
|
|
RegisterType: 0,
|
|
saleBillType: this.pageType === "UnionMall" ? "3001" : "3000",
|
|
})
|
|
.then(function (data) {
|
|
if (data.ResultCode === "100") {
|
|
let _data = data.Data;
|
|
_this.Deliver_Count = _data.Deliver_Count;
|
|
_this.Complete_Count = _data.Complete_Count;
|
|
_this.Evaluated_Count = _data.Evaluated_Count;
|
|
_this.CheckOrder_Count = _data.CheckOrder_Count;
|
|
_this.Comment_Count = _data.Comment_Count;
|
|
_this.Unpaid_Count = _data.Unpaid_Count;
|
|
_this.user.MEMBERSHIP_LEVEL_TEXT =
|
|
_data.MEMBERSHIP_LEVEL_TEXT || "";
|
|
_this.user.COUPON_COUNT = _data.COUPON_COUNT || "";
|
|
_this.user.PENDORDER_COUNT = _data.PENDORDER_COUNT || "";
|
|
_this.user.RESERVATION_COUNT = _data.RESERVATION_COUNT || "";
|
|
_this.user.ACCOUNT_BALANCE = _data.ACCOUNT_BALANCE || "";
|
|
_this.user.ISPLUS = _data.ISPLUS || "";
|
|
_this.user.INDUSTRY_MEMBERSHIP_ID =
|
|
_data.INDUSTRY_MEMBERSHIP_ID || "";
|
|
_this.user.MEMBERSHIP_TYPE = _data.MEMBERSHIP_TYPE || "";
|
|
_this.user.MEMBERSHIP_LEVEL = _data.MEMBERSHIP_LEVEL || "";
|
|
_this.user.DELIVER_COUNT = _data.DELIVER_COUNT || "";
|
|
_this.user.InviteCode = _data.InviteCode || "";
|
|
_this.user.MEMBERSHIP_POINT = _data.MEMBERSHIP_POINT || "";
|
|
_this.user.MEMBERSHIP_MOBILEPHONE =
|
|
_data.MEMBERSHIP_MOBILEPHONE || "";
|
|
|
|
_this.$store.commit("setUser", _this.user);
|
|
console.log("data.Data", data.Data);
|
|
}
|
|
});
|
|
},
|
|
// 去订单页面
|
|
handleGo(url) {
|
|
// 待付款 1 待发货 2 已发货 3 已验收 4
|
|
console.log("url", url);
|
|
uni.navigateTo({
|
|
url: `/pages/order/buyOrder/index?type=${url}&pageType=${this.pageType}`,
|
|
});
|
|
},
|
|
// 去评价页面
|
|
goToEvaluate(type) {
|
|
// 待评价 2 已评价 3
|
|
let obj = {
|
|
1: 2,
|
|
2: 3,
|
|
};
|
|
uni.navigateTo({
|
|
url: `/pages/evaluateList/index?type=${obj[type]}&pageType=${this.pageType}`,
|
|
});
|
|
},
|
|
// 跳转地址管理页面
|
|
goAddressManager() {
|
|
uni.navigateTo({ url: `/pages/myAddress/address/index` });
|
|
},
|
|
handleBackHome() {
|
|
if (this.pageType === "UnionMall") {
|
|
uni.redirectTo({
|
|
url: `/pages/shopMallPage/index/index?pageType=${this.pageType}`,
|
|
});
|
|
} else {
|
|
uni.redirectTo({
|
|
url: "/pages/shopMallPage/index/index",
|
|
});
|
|
}
|
|
},
|
|
},
|
|
};
|
|
</script>
|
|
|
|
<style lang="less" scoped>
|
|
.main {
|
|
width: 100vw;
|
|
height: 100vh;
|
|
background-color: #f5f6f6;
|
|
|
|
.topHeader {
|
|
width: 100%;
|
|
background: linear-gradient(270deg, #2fa4ff 0%, #197aff 100%);
|
|
display: flex;
|
|
justify-content: center;
|
|
position: relative;
|
|
|
|
.headerTop {
|
|
width: 100%;
|
|
position: absolute;
|
|
left: 50%;
|
|
transform: translateX(-50%);
|
|
display: flex;
|
|
align-items: center;
|
|
justify-content: space-between;
|
|
box-sizing: border-box;
|
|
padding: 0 32rpx;
|
|
|
|
.backArrow {
|
|
width: 48rpx;
|
|
height: 48rpx;
|
|
}
|
|
|
|
.pageTitle {
|
|
font-family: PingFangSC, PingFang SC;
|
|
font-weight: 600;
|
|
font-size: 34rpx;
|
|
color: #ffffff;
|
|
line-height: 48rpx;
|
|
text-align: left;
|
|
font-style: normal;
|
|
}
|
|
}
|
|
}
|
|
|
|
.userBox {
|
|
width: 100%;
|
|
height: 216rpx;
|
|
background: linear-gradient(270deg, #2fa4ff 0%, #197aff 100%);
|
|
box-sizing: border-box;
|
|
padding: 48rpx 32rpx;
|
|
display: flex;
|
|
align-items: center;
|
|
justify-content: space-between;
|
|
|
|
.userLeft {
|
|
display: flex;
|
|
align-items: center;
|
|
|
|
.userImg {
|
|
width: 120rpx;
|
|
height: 120rpx;
|
|
border-radius: 50%;
|
|
margin-right: 24rpx;
|
|
}
|
|
|
|
.userDetail {
|
|
.userName {
|
|
font-family: PingFangSC, PingFang SC;
|
|
font-weight: 600;
|
|
font-size: 36rpx;
|
|
color: #ffffff;
|
|
line-height: 52rpx;
|
|
text-align: left;
|
|
font-style: normal;
|
|
margin-bottom: 8rpx;
|
|
}
|
|
|
|
.userPhone {
|
|
font-family: PingFangSC, PingFang SC;
|
|
font-weight: 400;
|
|
font-size: 28rpx;
|
|
color: #ffffff;
|
|
line-height: 40rpx;
|
|
text-align: left;
|
|
font-style: normal;
|
|
}
|
|
}
|
|
}
|
|
|
|
.userRight {
|
|
width: 80rpx;
|
|
height: 80rpx;
|
|
background: rgba(255, 255, 255, 0.19);
|
|
border-radius: 16rpx;
|
|
display: flex;
|
|
align-items: center;
|
|
justify-content: center;
|
|
|
|
.messageImg {
|
|
width: 48rpx;
|
|
height: 48rpx;
|
|
}
|
|
}
|
|
}
|
|
|
|
.content {
|
|
width: 100%;
|
|
box-sizing: border-box;
|
|
padding: 24rpx 32rpx 0;
|
|
|
|
.userOrder {
|
|
width: 100%;
|
|
background: #fff;
|
|
box-sizing: border-box;
|
|
padding: 24rpx;
|
|
border-radius: 16rpx;
|
|
margin-top: 24rpx;
|
|
|
|
.orderTitle {
|
|
font-family: PingFangSC, PingFang SC;
|
|
font-weight: 600;
|
|
font-size: 28rpx;
|
|
color: #020e1a;
|
|
line-height: 40rpx;
|
|
text-align: left;
|
|
font-style: normal;
|
|
}
|
|
|
|
.orderList {
|
|
width: 100%;
|
|
display: flex;
|
|
align-items: center;
|
|
|
|
.orderItem {
|
|
width: calc(100% / 4);
|
|
box-sizing: border-box;
|
|
padding: 24rpx 32rpx 0;
|
|
display: flex;
|
|
flex-direction: column;
|
|
justify-content: center;
|
|
|
|
.itemImg {
|
|
width: 64rpx;
|
|
height: 64rpx;
|
|
margin-bottom: 4rpx;
|
|
}
|
|
|
|
.itemText {
|
|
font-family: PingFangSC, PingFang SC;
|
|
font-weight: 400;
|
|
font-size: 28rpx;
|
|
color: #6c737a;
|
|
line-height: 40rpx;
|
|
text-align: left;
|
|
font-style: normal;
|
|
margin-bottom: 16rpx;
|
|
}
|
|
|
|
.itemValue {
|
|
font-family: PingFangSC, PingFang SC;
|
|
font-weight: 600;
|
|
font-size: 32rpx;
|
|
color: #020e1a;
|
|
line-height: 44rpx;
|
|
text-align: left;
|
|
font-style: normal;
|
|
}
|
|
}
|
|
}
|
|
}
|
|
}
|
|
}
|
|
</style>
|