2479 lines
92 KiB
Vue
2479 lines
92 KiB
Vue
<template>
|
||
<view class="main">
|
||
|
||
<view class="fixedHeader" :style="{ height: menu.bottom + 16 + 'px' }">
|
||
<image class="YDIcon" src="/static/images/home/yunnanLogo.svg" />
|
||
</view>
|
||
|
||
<!-- 用户页面骨架屏 -->
|
||
<view class="user-skeleton" v-if="!showContent" :style="{ paddingTop: menu.bottom + 16 + 'px' }">
|
||
<!-- 用户信息骨架 -->
|
||
<view class="skeleton-user-top">
|
||
<view class="skeleton-user-info">
|
||
<view class="skeleton skeleton-avatar"></view>
|
||
<view class="skeleton-user-details">
|
||
<view class="skeleton skeleton-username"></view>
|
||
<view class="skeleton skeleton-level"></view>
|
||
</view>
|
||
<view class="skeleton skeleton-qr-code"></view>
|
||
</view>
|
||
|
||
<!-- 优惠券统计骨架 -->
|
||
<view class="skeleton-stats">
|
||
<view class="skeleton-stat-item" v-for="index in 2" :key="index">
|
||
<view class="skeleton skeleton-stat-number"></view>
|
||
<view class="skeleton skeleton-stat-label"></view>
|
||
</view>
|
||
</view>
|
||
</view>
|
||
|
||
<!-- 服务按钮骨架 -->
|
||
<view class="skeleton-section">
|
||
<view class="skeleton skeleton-section-title"></view>
|
||
<view class="skeleton-service-grid">
|
||
<view class="skeleton-service-item" v-for="index in 5" :key="index">
|
||
<view class="skeleton skeleton-service-icon"></view>
|
||
<view class="skeleton skeleton-service-text"></view>
|
||
</view>
|
||
</view>
|
||
</view>
|
||
|
||
<!-- 订单状态骨架 -->
|
||
<view class="skeleton-section">
|
||
<view class="skeleton skeleton-section-title"></view>
|
||
<view class="skeleton-order-grid">
|
||
<view class="skeleton-order-item" v-for="index in 5" :key="index">
|
||
<view class="skeleton skeleton-order-icon"></view>
|
||
<view class="skeleton skeleton-order-text"></view>
|
||
</view>
|
||
</view>
|
||
</view>
|
||
|
||
<!-- 点餐功能骨架 -->
|
||
<view class="skeleton-section">
|
||
<view class="skeleton skeleton-section-title"></view>
|
||
<view class="skeleton-food-grid">
|
||
<view class="skeleton-food-item" v-for="index in 4" :key="index">
|
||
<view class="skeleton skeleton-food-icon"></view>
|
||
<view class="skeleton skeleton-food-text"></view>
|
||
</view>
|
||
</view>
|
||
</view>
|
||
|
||
<!-- 客服帮助骨架 -->
|
||
<view class="skeleton-section">
|
||
<view class="skeleton skeleton-section-title"></view>
|
||
<view class="skeleton-service-cards">
|
||
<view class="skeleton-service-card" v-for="index in 2" :key="index">
|
||
<view class="skeleton skeleton-card-title"></view>
|
||
<view class="skeleton skeleton-card-content"></view>
|
||
</view>
|
||
</view>
|
||
</view>
|
||
</view>
|
||
|
||
<view class="pageTop" v-if="showContent" :style="{ paddingTop: menu.bottom + 16 + 'px' }">
|
||
|
||
|
||
<!-- 两个包一下 改一下样式 -->
|
||
<view class="userTopInfo">
|
||
<!-- 用户信息内容 -->
|
||
<view class="userInfoBox">
|
||
<!-- 头像内容 -->
|
||
<view class="headerImgBox">
|
||
<button class="avatarBtn" open-type="chooseAvatar" @chooseavatar="onChooseAvatar"
|
||
v-if="userInfo && userInfo.MEMBERSHIP_ID">
|
||
<image class="headerImg" :src="WXProfile ||
|
||
(userInfo && userInfo.MEMBERSHIP_HEADIMAGEURL
|
||
? userInfo.MEMBERSHIP_HEADIMAGEURL
|
||
: '')
|
||
" />
|
||
</button>
|
||
</view>
|
||
|
||
<view class="userInfo">
|
||
<view class="userInfoLeft">
|
||
<view class="userInfoLeftTop">
|
||
<view class="userName">{{ inShop === 2 ? (userInfo.MEMBERSHIP_NAME ||
|
||
user.MEMBERSHIP_NAME || "微信用户")
|
||
:
|
||
(userInfo.Membership_NickName || userInfo.NICK_NAME || userInfo.MEMBERSHIP_NAME ||
|
||
"未填写名称") }}
|
||
</view>
|
||
<view class="userLevelBox" style="width: 100%;">
|
||
<view class="userLevel">
|
||
<image class="userLevelIcon"
|
||
src="https://eshangtech.com/caiyunyiImg/levelIcon2.png" />
|
||
<view class="userLevelName">{{ user.MEMBERSHIP_LEVEL_TEXT || "" }}</view>
|
||
</view>
|
||
</view>
|
||
<!-- <view class="userSetting" @click="hanldGoConfig">
|
||
<image class="userSettingIcon" src="https://eshangtech.com/caiyunyiImg/userSettingIcon.png" />
|
||
</view> -->
|
||
</view>
|
||
<!-- <view class="userInfoLeftBottom">
|
||
<view class="userInfoLeftBottomItem">
|
||
<view class="bindCarBox" @click="handleGoBindCar">{{ cards ? cards : "未绑定爱车" }}</view>
|
||
</view>
|
||
<view class="userInfoLeftBottomItem">
|
||
<view class="userCollect" @click="handleGoCollect">我的收藏</view>
|
||
</view>
|
||
</view> -->
|
||
</view>
|
||
|
||
<view class="userInfoRight" @click="handleGoUserCode">
|
||
<image class="userCodeImg" src="https://eshangtech.com/caiyunyiImg/userInfoCode.png" />
|
||
<view class="userCodeText">会员码</view>
|
||
</view>
|
||
</view>
|
||
</view>
|
||
|
||
<!-- 优惠券信息 -->
|
||
<view class="couponBox">
|
||
<view class="CouponContent">
|
||
<view class="CouponItem" @click="handleGoCoupon"
|
||
:style="{ width: userInfo && userInfo.INDUSTRY_MEMBERSHIP_ID ? 'calc((100% - 2px) / 3)' : 'calc((100% - 2px) / 2)' }">
|
||
<view class="CouponItemValue">{{ userInfo.COUPON_COUNT || 0 }}</view>
|
||
<view class="CouponItemLabel">优惠券</view>
|
||
</view>
|
||
<view class="line"></view>
|
||
<view class="CouponItem" @click="handleGoPoint"
|
||
:style="{ width: userInfo && userInfo.INDUSTRY_MEMBERSHIP_ID ? 'calc((100% - 2px) / 3)' : 'calc((100% - 2px) / 2)' }">
|
||
<view class="CouponItemValue">{{
|
||
$utils.handleFormatNumber(userInfo.MEMBERSHIP_POINT || 0)
|
||
}}</view>
|
||
<view class="CouponItemLabel">积分</view>
|
||
</view>
|
||
<view class="line" v-if="userInfo && userInfo.INDUSTRY_MEMBERSHIP_ID"></view>
|
||
<view class="CouponItem" v-if="userInfo && userInfo.INDUSTRY_MEMBERSHIP_ID"
|
||
@click="hanldGoBalance"
|
||
:style="{ width: userInfo && userInfo.INDUSTRY_MEMBERSHIP_ID ? 'calc((100% - 2px) / 3)' : 'calc((100% - 2px) / 2)' }">
|
||
<view class="CouponItemValue">{{
|
||
$utils.handleFormatNumber(userInfo.ACCOUNT_BALANCE || 0)
|
||
}}</view>
|
||
<view class="CouponItemLabel">工会福利</view>
|
||
</view>
|
||
</view>
|
||
</view>
|
||
</view>
|
||
</view>
|
||
|
||
<!-- {{ showErrorText || "" }} -->
|
||
|
||
<view class="pageContent" v-if="showContent">
|
||
|
||
<!-- 基础按钮 -->
|
||
<view class="basicBox">
|
||
<view class="userOrderTop">
|
||
<view class="userOrderTitle">我的服务</view>
|
||
</view>
|
||
<view class="basicBoxContent">
|
||
<view class="basicItem" @click="handleGoCollect">
|
||
<image class="basicItemImg" src="https://eshangtech.com/caiyunyiImg/productCollection.png" />
|
||
<view class="basicText">商品收藏</view>
|
||
</view>
|
||
|
||
<view class="basicItem" @click="handleGoNormal({ value: 1 })">
|
||
<image class="basicItemImg" src="https://eshangtech.com/caiyunyiImg/MemberBenefitsIcon.png" />
|
||
<view class="basicText">会员权益</view>
|
||
</view>
|
||
|
||
<view class="basicItem" @click="handleGoBindCar">
|
||
<image class="basicItemImg" src="https://eshangtech.com/caiyunyiImg/bindCarIcon.png" />
|
||
<view class="basicText">绑定车辆</view>
|
||
</view>
|
||
|
||
<view class="basicItem" @click="handleGoNormal({ value: 3 })">
|
||
<image class="basicItemImg"
|
||
src="https://eshangtech.com/caiyunyiImg/suggestionFeedbackIcon.png" />
|
||
<view class="basicText">建议反馈</view>
|
||
</view>
|
||
|
||
<view class="basicItem" @click="hanldGoConfig">
|
||
<image class="basicItemImg" src="https://eshangtech.com/caiyunyiImg/configIcon.png" />
|
||
<view class="basicText">设置</view>
|
||
</view>
|
||
</view>
|
||
</view>
|
||
|
||
<!-- 我的订单 -->
|
||
<view class="userOrder">
|
||
<view class="userOrderTop" @click="handleGoOrder(0, '')">
|
||
<view class="userOrderTitle">我的订单</view>
|
||
<image class="userOrderMoreIcon" src="https://eshangtech.com/caiyunyiImg/moreIcon.png" />
|
||
</view>
|
||
|
||
<view class="userOrderBottom">
|
||
<view class="userOrderBottomItem" @click="handleGoOrder(1, '')">
|
||
<img class="userOrderBottomItemImg" src="/static/images/home/obligationIcon.svg" />
|
||
<view class="userOrderBottomItemText">未付款</view>
|
||
<view class="orderCount" v-if="mallOrderCountList[0] > 0">{{ mallOrderCountList[0] }}</view>
|
||
</view>
|
||
|
||
<view class="userOrderBottomItem" @click="handleGoOrder(2, '')">
|
||
<img class="userOrderBottomItemImg" src="/static/images/home/shipmentIcon.svg" />
|
||
<view class="userOrderBottomItemText">待发货</view>
|
||
<view class="orderCount" v-if="mallOrderCountList[1] > 0">{{ mallOrderCountList[1] }}</view>
|
||
</view>
|
||
|
||
<view class="userOrderBottomItem" @click="handleGoOrder(3, '')">
|
||
<img class="userOrderBottomItemImg" src="/static/images/home/receiptOfGoods.svg" />
|
||
<view class="userOrderBottomItemText">待收货</view>
|
||
<view class="orderCount" v-if="mallOrderCountList[2] > 0">{{ mallOrderCountList[2] }}</view>
|
||
</view>
|
||
|
||
<view class="userOrderBottomItem" @click="handleGoOrder(4, '')">
|
||
<img class="userOrderBottomItemImg" src="/static/images/home/evaluatedIcon.svg" />
|
||
<view class="userOrderBottomItemText">待评价</view>
|
||
</view>
|
||
|
||
<view class="userOrderBottomItem" @click="handleGo('/pages/order/buyOrder/index?type=6')">
|
||
<img class="userOrderBottomItemImg" src="/static/images/home/afterSales.svg" />
|
||
<view class="userOrderBottomItemText">退换货</view>
|
||
</view>
|
||
</view>
|
||
</view>
|
||
|
||
<view class="orderFun" v-if="false">
|
||
<view class="boxTitleTop" @click="handleGoOrder(0, '')">
|
||
<text class="boxTitle">商城订单</text>
|
||
<image class="rightArrow" src="/static/images/home/rightArrow.svg" />
|
||
</view>
|
||
<view class="orderContent">
|
||
<view class="orderLeft">
|
||
<view class="orderFunItem" v-for="(item, index) in orderFunList" :key="index"
|
||
@click="handleGoOrder(item.value, '')">
|
||
<image class="orderFunIcon" :src="item.src" />
|
||
<text class="orderFunText">{{ item.label }}</text>
|
||
</view>
|
||
</view>
|
||
|
||
<view class="orderRight">
|
||
<view class="orderFunItem" @click="handleGo(`/pages/order/buyOrder/index?type=6`)">
|
||
<image class="orderFunIcon" src="/static/images/home/afterSales.svg" />
|
||
<text class="orderFunText">退换/售后</text>
|
||
</view>
|
||
</view>
|
||
</view>
|
||
</view>
|
||
<!-- 工会之家订单栏 -->
|
||
<view class="orderFun" v-if="false">
|
||
<view class="boxTitleTop" @click="handleGoOrder(0, 'UnionMall')">
|
||
<text class="boxTitle">工会订单</text>
|
||
<image class="rightArrow" src="/static/images/home/rightArrow.svg" />
|
||
</view>
|
||
<view class="orderContent">
|
||
<view class="orderLeft">
|
||
<view class="orderFunItem" v-for="(item, index) in orderFunList" :key="index"
|
||
@click="handleGoOrder(item.value, 'UnionMall')">
|
||
<image class="orderFunIcon" :src="item.src" />
|
||
<text class="orderFunText">{{ item.label }}</text>
|
||
</view>
|
||
</view>
|
||
</view>
|
||
</view>
|
||
|
||
<!-- 我的点餐订单栏 -->
|
||
<view class="orderFun">
|
||
<view class="boxTitleTop" @click="handleGoFoodOrder(0)">
|
||
<text class="boxTitle">我的点餐</text>
|
||
<image class="rightArrow" src="/static/images/home/rightArrow.svg" />
|
||
</view>
|
||
<view class="orderContent">
|
||
<view class="newOrderLeft" style="width: 100%; padding-right: 0">
|
||
<view class="orderFunItem" v-for="(item, index) in foodFunList" :key="index"
|
||
@click="handleGoFoodOrder(item.value)">
|
||
<image class="orderFunIcon" :src="item.src" />
|
||
<text class="orderFunText">{{ item.label }}</text>
|
||
<view class="orderCount" v-if="item.orderCount > 0">{{ item.orderCount }}</view>
|
||
</view>
|
||
</view>
|
||
</view>
|
||
</view>
|
||
|
||
<!-- 常用功能 -->
|
||
<view class="oftenFunBox" v-if="false">
|
||
<view class="ofternFunTitle">常用功能</view>
|
||
|
||
<view class="funListBox">
|
||
<view class="funItemBox" @click="handleGoNormal({ value: 1 })">
|
||
<image class="funItemImg" src="/static/images/home/memberBenefits.svg" />
|
||
<view class="funItemText">会员权益</view>
|
||
</view>
|
||
<view class="funItemBox" @click="handleGoNormal({ value: 2 })">
|
||
<image class="funItemImg" src="/static/images/home/serviceIcon.svg" />
|
||
<view class="funItemText">我的爱车</view>
|
||
</view>
|
||
<view class="funItemBox" @click="handleGoNormal({ value: 3 })">
|
||
<image class="funItemImg" src="/static/images/home/suggestion.svg" />
|
||
<view class="funItemText">建议反馈</view>
|
||
</view>
|
||
</view>
|
||
</view>
|
||
|
||
|
||
<!-- 客服帮助 -->
|
||
<view class="customerServiceBox">
|
||
<view class="customerServiceTitle">客服帮助</view>
|
||
|
||
<view class="customerServiceContent">
|
||
<view class="customerServiceItem">
|
||
<button class="no-border-btn" hover-class="none" hover-start-time="0" hover-stay-time="0"
|
||
style="background-color: transparent;border-width: 0;padding: 0;" open-type="contact"
|
||
@contact="onContact">
|
||
<view class="customerServiceItemTitle">客服帮助</view>
|
||
<view class="customerServiceItemContent">伴您行程无忧</view>
|
||
</button>
|
||
</view>
|
||
<view class="customerServiceItem customerServiceItemBg2">
|
||
<view class="customerServiceItemTitle">服务热线</view>
|
||
<view class="customerServiceItemContent" style="color: #182145;">伴您行程无忧</view>
|
||
</view>
|
||
</view>
|
||
</view>
|
||
|
||
</view>
|
||
<shop-tabbar :page="`/pages/shopMallPage/user/newIndex`" :pageType="bigPageType"
|
||
:shopCarLength="shopCarListCount" :comeForm="comeForm" />
|
||
|
||
</view>
|
||
</template>
|
||
|
||
<script>
|
||
import { handleSaveOrderStore } from '../../../utils/publicMethods'
|
||
import { mapGetters } from "vuex";
|
||
import shopTabbar from "../../../components/shopTabbar.vue";
|
||
import { useSkeletonControl } from '../../../utils/skeletonManager.js'
|
||
export default {
|
||
components: { shopTabbar },
|
||
data() {
|
||
return {
|
||
showContent: false, // 是否显示内容（控制骨架屏切换）
|
||
skeletonControl: null, // 骨架屏控制器
|
||
isFirstLoad: true, // 是否首次进入页面
|
||
pageType: "", // spring 春节模式
|
||
menu: {},
|
||
orderFunList: [
|
||
{
|
||
label: "待付款",
|
||
value: 1,
|
||
src: "/static/images/home/obligationIcon.svg",
|
||
},
|
||
{
|
||
label: "待发货",
|
||
value: 2,
|
||
src: "/static/images/home/shipmentIcon.svg",
|
||
},
|
||
{
|
||
label: "待收货",
|
||
value: 3,
|
||
src: "/static/images/home/receiptOfGoods.svg",
|
||
},
|
||
{
|
||
label: "待评价",
|
||
value: 4,
|
||
src: "/static/images/home/evaluatedIcon.svg",
|
||
},
|
||
], // 我的订单前面四个
|
||
commonFunList: [
|
||
{
|
||
label: "会员权益",
|
||
value: 1,
|
||
src: "/static/images/home/memberBenefits.svg",
|
||
springSrc: "/static/images/home/springMemberBenefits.svg",
|
||
},
|
||
{
|
||
label: "我的爱车",
|
||
value: 2,
|
||
src: "/static/images/home/serviceIcon.svg",
|
||
springSrc: "/static/images/home/springService.svg",
|
||
},
|
||
{
|
||
label: "建议反馈",
|
||
value: 3,
|
||
src: "/static/images/home/suggestion.svg",
|
||
springSrc: "/static/images/home/springSuggestion.svg",
|
||
},
|
||
], // 常用功能
|
||
foodFunList: [
|
||
{
|
||
label: "待付款",
|
||
value: 1,
|
||
src: "/static/images/home/obligationIcon.svg",
|
||
},
|
||
{
|
||
label: "待接单",
|
||
value: 2,
|
||
src: "/static/images/home/shipmentIcon.svg",
|
||
},
|
||
{
|
||
label: "制作中",
|
||
value: 3,
|
||
src: "/static/images/home/receiptOfGoods.svg",
|
||
},
|
||
{
|
||
label: "待评价",
|
||
value: 4,
|
||
src: "/static/images/home/evaluatedIcon.svg",
|
||
},
|
||
{}
|
||
],
|
||
cards: "",
|
||
userInfo: {},
|
||
safeHeight: 0,
|
||
serviceDetail: {}, // 当前服务区的详情
|
||
seat: {},
|
||
chargingObj: {},
|
||
inShop: 0,// 判断是否在商城里面
|
||
shopCarListCount: 0, // 购物车商品数量
|
||
showErrorText: "",
|
||
mallOrderCountList: [0, 0, 0],// 商城订单的数量
|
||
foodOrderCountList: [0, 0, 0],// 点餐订单的数量
|
||
bigPageType: "",// 判断是工会商城还是精选商城的
|
||
comeForm: "",// 来自
|
||
};
|
||
},
|
||
async onLoad(query) {
|
||
console.log("queryqueryqueryqueryquery", query);
|
||
|
||
// 初始化骨架屏控制
|
||
this.skeletonControl = useSkeletonControl('/pages/shopMallPage/user/newIndex', query.pageType)
|
||
this.showContent = this.skeletonControl.showContent
|
||
this.isFirstLoad = this.skeletonControl.showSkeleton
|
||
|
||
if (query.pageType) {
|
||
this.bigPageType = query.pageType
|
||
}
|
||
if (query.comeForm) {
|
||
this.comeForm = query.comeForm;
|
||
}
|
||
if (!this.user.MEMBERSHIP_ID) {
|
||
uni.navigateTo({ url: "/pages/register/index" });
|
||
}
|
||
this.menu = uni.getMenuButtonBoundingClientRect();
|
||
console.log('this.menuthis.menuthis.menu', this.menu);
|
||
|
||
let height = uni.getStorageSync("safeHeight");
|
||
this.safeHeight = Number(height);
|
||
|
||
// 拿到新的缓存数据
|
||
let userData = uni.getStorageSync('userData')
|
||
if (userData) {
|
||
this.userInfo = userData
|
||
this.cards = userData.LicencePlate.List && userData.LicencePlate.List.length > 0 ? userData.LicencePlate.List[0].License_Plate : ""
|
||
}
|
||
// 拿用户信息
|
||
await this.handleGetUserDetail();
|
||
let shopOrderStatus = uni.getStorageSync('shopOrderStatus')
|
||
if (!shopOrderStatus) {
|
||
// 拿到订单信息
|
||
await this.handleGetOrderDetail()
|
||
}
|
||
|
||
|
||
// 拿到订单信息
|
||
// await this.handleGetOrderDetail()
|
||
// 拿车牌号
|
||
// await this.handleGetCarCode();
|
||
|
||
|
||
// 如果是首次访问，延迟显示内容并标记已访问
|
||
if (this.skeletonControl && this.skeletonControl.showSkeleton) {
|
||
setTimeout(async () => {
|
||
if (this.skeletonControl) {
|
||
await this.skeletonControl.showContentAfterLoading(0)
|
||
this.showContent = true;
|
||
this.isFirstLoad = false;
|
||
}
|
||
}, 500);
|
||
} else {
|
||
// 非首次访问直接显示内容
|
||
this.showContent = true;
|
||
this.isFirstLoad = false;
|
||
}
|
||
|
||
this.$utils.addUserBehaviorNew({
|
||
behaviorRecordDesc: "进入了我的页面"
|
||
});
|
||
},
|
||
async onShow() {
|
||
// onShow 中不控制骨架屏，骨架屏完全由 onLoad 中控制
|
||
|
||
let inShop = uni.getStorageSync("inShop");
|
||
this.inShop = inShop
|
||
console.log('this.inShop', JSON.parse(JSON.stringify(this.inShop)));
|
||
|
||
// 拿到订单的缓存数据
|
||
let shopOrderStatus = uni.getStorageSync('shopOrderStatus')
|
||
let foodOrderStatus = uni.getStorageSync('foodOrderStatus')
|
||
|
||
this.mallOrderCountList = shopOrderStatus ? shopOrderStatus : []
|
||
console.log('this.mallOrderCountListthis.mallOrderCountList', this.mallOrderCountList);
|
||
|
||
if (foodOrderStatus && foodOrderStatus.length > 0) {
|
||
let foodTab = JSON.parse(JSON.stringify(this.foodFunList))
|
||
foodTab.forEach((item) => {
|
||
if (item.value === 1) {
|
||
item.orderCount = foodOrderStatus[0] || 0
|
||
} else if (item.value === 2) {
|
||
item.orderCount = foodOrderStatus[1] || 0
|
||
} else if (item.value === 3) {
|
||
item.orderCount = foodOrderStatus[2] || 0
|
||
}
|
||
})
|
||
this.foodFunList = foodTab
|
||
}
|
||
|
||
// if (!this.user.MEMBERSHIP_ID) {
|
||
// uni.navigateTo({ url: "/pages/register/index" });
|
||
// }
|
||
|
||
|
||
|
||
// let seatInfo = uni.getStorageSync("seatInfo");
|
||
// if (seatInfo) {
|
||
// this.seat = JSON.parse(seatInfo);
|
||
// }
|
||
|
||
// let currentService = uni.getStorageSync("currentService");
|
||
// if (currentService) {
|
||
// await this.handleGetServiceDetail(currentService.SERVERPART_ID);
|
||
|
||
// let obj = this.handleMergeDetail(currentService)
|
||
// let newObj = {
|
||
// ...currentService,
|
||
// sumDetail: obj,
|
||
// haveREFUELINGGUN: obj.haveREFUELINGGUN,
|
||
// HASCHARGE: obj.HASCHARGE,
|
||
// havePARKING: obj.havePARKING,
|
||
// haveWC: obj.haveWC,
|
||
// HASMOTHER: obj.HASMOTHER,
|
||
// HASPILOTLOUNGE: obj.HASPILOTLOUNGE,
|
||
// }
|
||
// this.serviceDetail = newObj
|
||
// this.handleGetChargingStation(this.serviceDetail);
|
||
// }
|
||
|
||
if (this.inShop === 2 || this.inShop === 1) {
|
||
// 判断当前的购物车里面是否有东西
|
||
let shopCarList = [];
|
||
if (this.inShop === 2) {
|
||
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;
|
||
}
|
||
|
||
await this.handleGetOrderDetail()
|
||
// 拿用户信息
|
||
await this.handleGetUserDetail();
|
||
// 拿到新的缓存数据
|
||
let userData = uni.getStorageSync('userData')
|
||
if (userData) {
|
||
this.userInfo = userData
|
||
this.cards = userData.LicencePlate.List && userData.LicencePlate.List.length > 0 ? userData.LicencePlate.List[0].License_Plate : ""
|
||
}
|
||
// 避免在 onShow 中强制更新影响骨架屏状态
|
||
// this.$forceUpdate()
|
||
},
|
||
computed: {
|
||
...mapGetters({
|
||
user: "user",
|
||
}),
|
||
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 "";
|
||
}
|
||
},
|
||
},
|
||
onUnload() {
|
||
handleSaveOrderStore()
|
||
},
|
||
methods: {
|
||
onContact(e) {
|
||
console.log('用户点击客服，回调detail：', e.detail);
|
||
// e.detail.path / query 等可用于透传会话来源
|
||
},
|
||
// 跳转客服帮助
|
||
handleGoCustomerService() {
|
||
uni.navigateTo({ url: "/pages/useConfig/customerService" });
|
||
},
|
||
// 跳转到余额
|
||
hanldGoBalance() {
|
||
if (this.user && !this.user.MEMBERSHIP_ID || (!this.user && !this.user.MEMBERSHIP_ID)) {
|
||
let _this = this;
|
||
uni.showModal({
|
||
title: "温馨提示",
|
||
content: "请您授权登录后再操作。",
|
||
success(res) {
|
||
if (res.confirm) {
|
||
uni.navigateTo({ url: "/pages/register/index" });
|
||
}
|
||
},
|
||
});
|
||
return;
|
||
}
|
||
uni.navigateTo({
|
||
url: `/pages/useConfig/balanceManage`,
|
||
});
|
||
},
|
||
handleGoDetail() {
|
||
uni.navigateTo({
|
||
url: `/pages/serviceDetail/index?pageType=userInfo`,
|
||
});
|
||
},
|
||
// 打开地图的跳转
|
||
handleGoMap() {
|
||
uni.openLocation({
|
||
latitude: this.serviceDetail.SERVERPART_Y * 1,
|
||
longitude: this.serviceDetail.SERVERPART_X * 1,
|
||
scale: 16, // 缩放比例
|
||
name: this.serviceDetail.SERVERPART_NAME,
|
||
// address: "", // 这个可能会影响地图的定位，所以可以选择不填
|
||
success(data) {
|
||
},
|
||
fail(err) {
|
||
},
|
||
});
|
||
},
|
||
// 拿到服务区详情
|
||
async handleGetServiceDetail(id) {
|
||
if (!id) {
|
||
return;
|
||
}
|
||
let req = {
|
||
ServerpartId: id,
|
||
latitude: this.seat.latitude,
|
||
longitude: this.seat.longitude,
|
||
};
|
||
const data = await this.$api.$get(
|
||
"/CommercialApi/BaseInfo/GetServerpartInfo",
|
||
req
|
||
);
|
||
let obj = data.Result_Data;
|
||
this.serviceDetail = obj;
|
||
this.serviceDetail.sumDetail = this.handleMergeDetail(obj);
|
||
}, // 合并服务区数据
|
||
handleMergeDetail(obj) {
|
||
let sumObj = {
|
||
LIVESTOCKPACKING: 0, // 充电桩数
|
||
STATEGRIDCHARGE: 0, // 国网充电桩数量
|
||
LIAUTOCHARGE: 0, // 理想5C充电桩数量
|
||
GACENERGYCHARGE: 0, // 广汽能源充电桩数量
|
||
OTHERCHARGE: 0, // 其他充电桩数量
|
||
REFUELINGGUN92: 0, // 加油枪92号
|
||
REFUELINGGUN95: 0, // 加油枪95号
|
||
REFUELINGGUN0: 0, // 加油枪0号
|
||
HASPANTRY: 0, // 男厕数量
|
||
HASWIFI: 0, // 女厕数量
|
||
TOILETCOUNT: 0, // 潮汐厕位
|
||
HASSHOWERROOM: 0, // 淋浴房
|
||
HASWATERROOM: 0, // 开水器
|
||
MICROWAVEOVEN: 0, // 微波炉
|
||
WASHERCOUNT: 0, // 洗衣机数量
|
||
SLEEPINGPODS: 0, // 睡眠仓
|
||
HASPILOTLOUNGE: false, // 有无司机之家
|
||
HASCHILD: false, // 有无车辆维修
|
||
VEHICLEWATERFILLING: false, // 有无车辆加水
|
||
SMALLPARKING: 0, // 轿车车位
|
||
PACKING: 0, // 客车车位
|
||
TRUCKPACKING: 0, // 货车车位
|
||
DANPACKING: 0, // 危化品车位
|
||
DININGBXCOUNT: 0, // 商铺数量
|
||
DININGROOMCOUNT: 0, // 餐饮店
|
||
HASBACKGROUNDRADIO: 0, // 便利店
|
||
POINTCONTROLCOUNT: 0, // 客房
|
||
BUSINESSTYPE: "",
|
||
TOILET_PAPER: 0, // 厕纸巾
|
||
MABROOMWATER_DISPENSER: 0, // 母婴室饮水机
|
||
NURSING_TABLE: 0, // 哺乳桌
|
||
BABY_COT: 0, // 婴儿床
|
||
CHANGING_TABLE: 0, // 尿布台
|
||
DROOMWATER_DISPENSER: 0, // 司机之家饮水机
|
||
haveREFUELINGGUN: false, // 判断有无加油
|
||
havePARKING: false, // 判断有无停车场
|
||
haveWC: false, // 判断有无卫生间
|
||
HASMOTHER: false
|
||
};
|
||
if (obj.RegionInfo && obj.RegionInfo.length > 0) {
|
||
obj.RegionInfo.forEach((item) => {
|
||
sumObj.LIVESTOCKPACKING += item.LIVESTOCKPACKING;
|
||
sumObj.STATEGRIDCHARGE += item.STATEGRIDCHARGE;
|
||
sumObj.LIAUTOCHARGE += item.LIAUTOCHARGE;
|
||
sumObj.GACENERGYCHARGE += item.GACENERGYCHARGE;
|
||
sumObj.OTHERCHARGE += item.OTHERCHARGE;
|
||
sumObj.REFUELINGGUN92 += item.REFUELINGGUN92;
|
||
sumObj.REFUELINGGUN95 += item.REFUELINGGUN95;
|
||
sumObj.REFUELINGGUN0 += item.REFUELINGGUN0;
|
||
sumObj.HASPANTRY += item.HASPANTRY;
|
||
sumObj.HASWIFI += item.HASWIFI;
|
||
sumObj.TOILETCOUNT += item.TOILETCOUNT;
|
||
sumObj.HASSHOWERROOM += item.HASSHOWERROOM;
|
||
sumObj.HASWATERROOM += item.HASWATERROOM;
|
||
sumObj.MICROWAVEOVEN += item.MICROWAVEOVEN;
|
||
sumObj.WASHERCOUNT += item.WASHERCOUNT;
|
||
sumObj.SLEEPINGPODS += item.SLEEPINGPODS;
|
||
sumObj.SMALLPARKING += item.SMALLPARKING;
|
||
sumObj.PACKING += item.PACKING;
|
||
sumObj.TRUCKPACKING += item.TRUCKPACKING;
|
||
sumObj.DANPACKING += item.DANPACKING;
|
||
sumObj.BUSINESSTYPE = item.BUSINESSTYPE;
|
||
sumObj.TOILET_PAPER += item.TOILET_PAPER;
|
||
sumObj.MABROOMWATER_DISPENSER += item.MABROOMWATER_DISPENSER;
|
||
sumObj.NURSING_TABLE += item.NURSING_TABLE;
|
||
sumObj.BABY_COT += item.BABY_COT;
|
||
sumObj.CHANGING_TABLE += item.CHANGING_TABLE;
|
||
sumObj.DROOMWATER_DISPENSER += item.DROOMWATER_DISPENSER;
|
||
|
||
if (item.HASMOTHER) {
|
||
sumObj.HASMOTHER = true
|
||
}
|
||
|
||
|
||
|
||
if (sumObj.LIVESTOCKPACKING > 0 || sumObj.STATEGRIDCHARGE > 0 || sumObj.LIAUTOCHARGE > 0 || sumObj.GACENERGYCHARGE > 0 || sumObj.OTHERCHARGE > 0) {
|
||
sumObj.HASCHARGE = true;
|
||
}
|
||
|
||
if (item.HASPILOTLOUNGE) {
|
||
sumObj.HASPILOTLOUNGE = true;
|
||
}
|
||
if (item.VEHICLEWATERFILLING) {
|
||
sumObj.VEHICLEWATERFILLING = true;
|
||
}
|
||
if (item.HASCHILD) {
|
||
sumObj.HASCHILD = true;
|
||
}
|
||
sumObj.DININGBXCOUNT += item.DININGBXCOUNT;
|
||
sumObj.DININGROOMCOUNT += item.DININGROOMCOUNT;
|
||
sumObj.HASBACKGROUNDRADIO += item.HASBACKGROUNDRADIO;
|
||
sumObj.POINTCONTROLCOUNT += item.POINTCONTROLCOUNT;
|
||
|
||
if (
|
||
sumObj.REFUELINGGUN92 > 0 ||
|
||
sumObj.REFUELINGGUN95 > 0 ||
|
||
sumObj.REFUELINGGUN0 > 0
|
||
) {
|
||
sumObj.haveREFUELINGGUN = true;
|
||
}
|
||
|
||
if (
|
||
sumObj.SMALLPARKING > 0 ||
|
||
sumObj.PACKING > 0 ||
|
||
sumObj.TRUCKPACKING > 0 ||
|
||
sumObj.DANPACKING > 0
|
||
) {
|
||
sumObj.havePARKING = true;
|
||
}
|
||
if (
|
||
sumObj.HASPANTRY > 0 ||
|
||
sumObj.HASWIFI > 0 ||
|
||
sumObj.TOILETCOUNT > 0
|
||
) {
|
||
sumObj.haveWC = true;
|
||
}
|
||
});
|
||
}
|
||
return sumObj;
|
||
},
|
||
// 查询现在的充电桩
|
||
async handleGetChargingStation(obj) {
|
||
let _this = this;
|
||
uni.request({
|
||
url: "https://xny.yciccloud.com/interconnect/api/interconnection/open/getConnectList", //仅为示例，并非真实接口地址。
|
||
method: "POST",
|
||
success: (res) => {
|
||
let list = res.data;
|
||
let result = [];
|
||
if (list && list.length > 0) {
|
||
list.forEach((item) => {
|
||
if (
|
||
(item.stationName.indexOf("读书铺") !== -1 &&
|
||
obj.SERVERPART_NAME.indexOf("读书铺") !== -1) ||
|
||
(item.stationName.indexOf("鸡街") !== -1 &&
|
||
obj.SERVERPART_NAME.indexOf("鸡街") !== -1) ||
|
||
(item.stationName.indexOf("星云") !== -1 &&
|
||
obj.SERVERPART_NAME.indexOf("星云") !== -1) ||
|
||
(item.stationName.indexOf("富民") !== -1 &&
|
||
obj.SERVERPART_NAME.indexOf("富民") !== -1)
|
||
) {
|
||
result.push(item);
|
||
}
|
||
});
|
||
}
|
||
let sum = 0;
|
||
let have = 0;
|
||
let use = 0;
|
||
|
||
if (result && result.length > 0) {
|
||
result.forEach((item) => {
|
||
if (item.status === "50") {
|
||
sum += 1;
|
||
}
|
||
});
|
||
}
|
||
if (sum > 0) {
|
||
use = sum;
|
||
if (obj.sumDetail.STATEGRIDCHARGE > 0) {
|
||
if (obj.sumDetail.STATEGRIDCHARGE < result.length) {
|
||
have = result.length;
|
||
} else {
|
||
have = obj.sumDetail.STATEGRIDCHARGE;
|
||
}
|
||
} else {
|
||
have = result.length;
|
||
}
|
||
} else {
|
||
have = obj.sumDetail.LIVESTOCKPACKING;
|
||
let rank = Number(uni.getStorageSync("rankNumber"));
|
||
if (rank > 0) {
|
||
} else {
|
||
rank = Math.random() * (0.7 - 0.5) + 0.5;
|
||
uni.setStorageSync("rankNumber", rank);
|
||
}
|
||
use = Math.floor(have * rank);
|
||
}
|
||
_this.chargingObj = {
|
||
have: have,
|
||
use: use,
|
||
};
|
||
_this.$forceUpdate();
|
||
},
|
||
});
|
||
},
|
||
// 跳转会员设置
|
||
hanldGoConfig() {
|
||
if (this.user && !this.user.MEMBERSHIP_ID || (!this.user && !this.user.MEMBERSHIP_ID)) {
|
||
let _this = this;
|
||
uni.showModal({
|
||
title: "温馨提示",
|
||
content: "请您授权登录后再操作。",
|
||
success(res) {
|
||
if (res.confirm) {
|
||
uni.navigateTo({ url: "/pages/register/index" });
|
||
}
|
||
},
|
||
});
|
||
return;
|
||
}
|
||
uni.navigateTo({
|
||
url: '/pages/useConfig/userConfig'
|
||
})
|
||
},
|
||
// 跳转到积分页面
|
||
handleGoPoint() {
|
||
if (this.user && !this.user.MEMBERSHIP_ID || (!this.user && !this.user.MEMBERSHIP_ID)) {
|
||
let _this = this;
|
||
uni.showModal({
|
||
title: "温馨提示",
|
||
content: "请您授权登录后再操作。",
|
||
success(res) {
|
||
if (res.confirm) {
|
||
uni.navigateTo({ url: "/pages/register/index" });
|
||
}
|
||
},
|
||
});
|
||
return;
|
||
}
|
||
uni.navigateTo({
|
||
url: '/pages/useConfig/pointsDetail'
|
||
})
|
||
},
|
||
// 跳转券包
|
||
handleGoCoupon() {
|
||
if (this.user && !this.user.MEMBERSHIP_ID || (!this.user && !this.user.MEMBERSHIP_ID)) {
|
||
let _this = this;
|
||
uni.showModal({
|
||
title: "温馨提示",
|
||
content: "请您授权登录后再操作。",
|
||
success(res) {
|
||
if (res.confirm) {
|
||
uni.navigateTo({ url: "/pages/register/index" });
|
||
}
|
||
},
|
||
});
|
||
return;
|
||
}
|
||
uni.navigateTo({
|
||
url: '/pages/homeFn/myCoupon/index'
|
||
})
|
||
},
|
||
// 用户上传头像
|
||
async onChooseAvatar(e) {
|
||
if (this.user && !this.user.MEMBERSHIP_ID || (!this.user && !this.user.MEMBERSHIP_ID)) {
|
||
let _this = this;
|
||
uni.showModal({
|
||
title: "温馨提示",
|
||
content: "请您授权登录后再操作。",
|
||
success(res) {
|
||
if (res.confirm) {
|
||
uni.navigateTo({ url: "/pages/register/index" });
|
||
}
|
||
},
|
||
});
|
||
return;
|
||
}
|
||
let _this = this;
|
||
_this.showErrorText = 1
|
||
uni.uploadFile({
|
||
url: "https://eshangtech.com:18900/EShangApiMain/Picture/UploadPicture", // 你的接口 URL
|
||
filePath: e.detail.avatarUrl,
|
||
name: "file", // 表单中的文件字段名
|
||
formData: {
|
||
Tabletype: "1005", // 表单中其他数据
|
||
},
|
||
success: async (uploadRes) => {
|
||
let data = uploadRes.data ? JSON.parse(uploadRes.data) : "";
|
||
let url = data.Result_Data.ImageUrl;
|
||
if (url) {
|
||
let req = {
|
||
membershipId: this.user.MEMBERSHIP_ID,
|
||
headImgUrl: url,
|
||
};
|
||
_this.WXProfile = url;
|
||
_this.showErrorText = _this.WXProfile
|
||
const userInfoData = await _this.$api.$get(
|
||
"/WeChat/UpdateMemberInfo",
|
||
req
|
||
);
|
||
if (userInfoData.Result_Code === 100) {
|
||
_this.handleGetUserDetail();
|
||
}
|
||
}
|
||
},
|
||
fail: (error) => {
|
||
_this.showErrorText = JSON.stringify(error)
|
||
}
|
||
});
|
||
},
|
||
// 拿到用户详情
|
||
async handleGetUserDetail() {
|
||
let _this = this;
|
||
_this.$api
|
||
.getCoop({
|
||
action_type: "GetMembershipInfo",
|
||
WechatUserId: _this.user.WechatUserId,
|
||
noLoading: true,
|
||
})
|
||
.then(function (data) {
|
||
if (data.ResultCode === "100") {
|
||
let _data = data;
|
||
console.log("_data", _data);
|
||
_this.userInfo = _data.Data
|
||
_this.user.MEMBERSHIP_ID = _data.Data.MEMBERSHIP_ID || "";
|
||
_this.user.MEMBERSHIP_NAME = _data.Data.MEMBERSHIP_NAME || "";
|
||
_this.user.MEMBERSHIP_LEVEL_TEXT =
|
||
_data.Data.MEMBERSHIP_LEVEL_TEXT || "";
|
||
_this.user.COUPON_COUNT = _data.Data.COUPON_COUNT || "";
|
||
_this.user.PENDORDER_COUNT = _data.Data.PENDORDER_COUNT || "";
|
||
_this.user.RESERVATION_COUNT = _data.Data.RESERVATION_COUNT || "";
|
||
_this.user.ACCOUNT_BALANCE = _data.Data.ACCOUNT_BALANCE || "";
|
||
_this.user.ISPLUS = _data.Data.ISPLUS || "";
|
||
_this.user.INDUSTRY_MEMBERSHIP_ID =
|
||
_data.Data.INDUSTRY_MEMBERSHIP_ID || "";
|
||
_this.user.MEMBERSHIP_TYPE = _data.Data.MEMBERSHIP_TYPE || "";
|
||
_this.user.MEMBERSHIP_LEVEL = _data.Data.MEMBERSHIP_LEVEL || "";
|
||
_this.user.InviteCode = _data.Data.InviteCode || "";
|
||
_this.user.MEMBERSHIP_POINT = _data.Data.MEMBERSHIP_POINT || "";
|
||
_this.user.MEMBERSHIP_MOBILEPHONE =
|
||
_data.Data.MEMBERSHIP_MOBILEPHONE || "";
|
||
_this.WXProfile = _data.Data.MEMBERSHIP_HEADIMAGEURL;
|
||
|
||
_this.$store.commit("setUser", _this.user);
|
||
_this.$forceUpdate()
|
||
} else {
|
||
// _this.setUser({});
|
||
_this.$store.commit("setUser", user);
|
||
}
|
||
});
|
||
},
|
||
// 跳转去售后 即已完成的列表
|
||
handleGo(url) {
|
||
if (this.user && !this.user.MEMBERSHIP_ID || (!this.user && !this.user.MEMBERSHIP_ID)) {
|
||
let _this = this;
|
||
uni.showModal({
|
||
title: "温馨提示",
|
||
content: "请您授权登录后再操作。",
|
||
success(res) {
|
||
if (res.confirm) {
|
||
uni.navigateTo({ url: "/pages/register/index" });
|
||
}
|
||
},
|
||
});
|
||
return;
|
||
}
|
||
uni.navigateTo({
|
||
url: url,
|
||
});
|
||
},
|
||
// 跳转去点餐订单页面
|
||
handleGoFoodOrder(value) {
|
||
if (this.user && !this.user.MEMBERSHIP_ID || (!this.user && !this.user.MEMBERSHIP_ID)) {
|
||
let _this = this;
|
||
uni.showModal({
|
||
title: "温馨提示",
|
||
content: "请您授权登录后再操作。",
|
||
success(res) {
|
||
if (res.confirm) {
|
||
uni.navigateTo({ url: "/pages/register/index" });
|
||
}
|
||
},
|
||
});
|
||
return;
|
||
}
|
||
uni.navigateTo({
|
||
url: `/pages/order/foodOrder/index?type=${value}`,
|
||
});
|
||
},
|
||
// 绑定车辆
|
||
handleGoBindCar() {
|
||
if (this.user && !this.user.MEMBERSHIP_ID || (!this.user && !this.user.MEMBERSHIP_ID)) {
|
||
let _this = this;
|
||
uni.showModal({
|
||
title: "温馨提示",
|
||
content: "请您授权登录后再操作。",
|
||
success(res) {
|
||
if (res.confirm) {
|
||
uni.navigateTo({ url: "/pages/register/index" });
|
||
}
|
||
},
|
||
});
|
||
return;
|
||
}
|
||
uni.navigateTo({
|
||
url: `/pages/bindCar/index`,
|
||
});
|
||
},
|
||
// 拿到车牌号
|
||
async handleGetCarCode() {
|
||
let _this = this;
|
||
uni.showLoading({ title: "加载中" });
|
||
const res = await this.$api.getCoop({ action_type: "GetVehicleList" })
|
||
let list = res.Result_Data.List;
|
||
if (list && list.length > 0) {
|
||
_this.cards = list[0].License_Plate;
|
||
}
|
||
uni.hideLoading();
|
||
},
|
||
// 常用功能的跳转
|
||
handleGoNormal(obj) {
|
||
console.log("obj", obj);
|
||
if (obj.value === 1) {
|
||
// 会员权益
|
||
uni.navigateTo({
|
||
url: `/pages/noDataPage/index`,
|
||
});
|
||
// this.handleShowPayCode();
|
||
} else if (obj.value === 2) {
|
||
// 我的爱车
|
||
this.handleGoBindCar();
|
||
} else if (obj.value === 3) {
|
||
// 建议反馈
|
||
// uni.navigateToMiniProgram({
|
||
// shortLink: "#小程序://云交经司服/jFbQlCIEsEjf5Nq",
|
||
// });
|
||
uni.navigateTo({
|
||
url: `/pages/complaints/index`,
|
||
});
|
||
}
|
||
},
|
||
// // 调起付款码
|
||
async handleShowPayCode() {
|
||
let timeStamp = Math.ceil(new Date().getTime() / 1000);
|
||
let nonceStr = Math.random().toString(36).substring(2, 8);
|
||
let req = {
|
||
appId: "wxee018fb96955552a",
|
||
timeStamp: timeStamp,
|
||
nonceStr: nonceStr,
|
||
package: "1672298991",
|
||
signType: "MD5",
|
||
};
|
||
let reqSign = {
|
||
parameters: `appId=wxee018fb96955552a&nonceStr=${nonceStr}&package=mch_id=1672298991&signType=MD5&timeStamp=${timeStamp}`,
|
||
// "wxee018fb96955552a\n" +
|
||
// timeStamp +
|
||
// "\n" +
|
||
// nonceStr +
|
||
// "\npackage=" +
|
||
// req.package +
|
||
// "\n",
|
||
};
|
||
|
||
const data = await this.$api.$get("/WeChat/GenerateSign", reqSign);
|
||
console.log("data", data);
|
||
wx.openOfflinePayView({
|
||
appId: "wxee018fb96955552a",
|
||
timeStamp: timeStamp,
|
||
nonceStr: nonceStr,
|
||
package: "1672298991",
|
||
signType: "MD5",
|
||
paySign: data.Result_Data,
|
||
success(res) {
|
||
console.log("res", res);
|
||
},
|
||
});
|
||
},
|
||
// 最底下的两个点击事件
|
||
handleLastFun(value) {
|
||
console.log("value", value);
|
||
if (value === 1) {
|
||
// 客服帮助
|
||
// uni.navigateTo({
|
||
// url: `/pages/noDataPage/index`,
|
||
// });
|
||
wx.openCustomerServiceChat({
|
||
extInfo: {
|
||
url: "", // 客服链接
|
||
}, // 客服信息
|
||
corpId: "", //企业ID
|
||
success(res) {
|
||
console.log("res", res);
|
||
},
|
||
});
|
||
} else if (value === 2) {
|
||
// 服务热线
|
||
uni.navigateTo({
|
||
url: `/pages/noDataPage/index`,
|
||
});
|
||
}
|
||
},
|
||
// 跳转订单
|
||
handleGoOrder(value, pageType) {
|
||
if (this.user && !this.user.MEMBERSHIP_ID || (!this.user && !this.user.MEMBERSHIP_ID)) {
|
||
let _this = this;
|
||
uni.showModal({
|
||
title: "温馨提示",
|
||
content: "请您授权登录后再操作。",
|
||
success(res) {
|
||
if (res.confirm) {
|
||
uni.navigateTo({ url: "/pages/register/index" });
|
||
}
|
||
},
|
||
});
|
||
return;
|
||
}
|
||
if (value === 4) {
|
||
uni.navigateTo({
|
||
url: `/pages/evaluateList/index?pageType=${pageType}`,
|
||
});
|
||
} else {
|
||
uni.navigateTo({
|
||
url: `/pages/order/buyOrder/index?type=${value || ""
|
||
}&pageType=${pageType}`,
|
||
});
|
||
}
|
||
},
|
||
// 跳转到选择服务区
|
||
goSelectServer() {
|
||
uni.navigateTo({ url: "/pages/newMap/index/index?comeForm=home" });
|
||
},
|
||
// 跳转到会员码页面
|
||
handleGoUserCode() {
|
||
if (this.user && !this.user.MEMBERSHIP_ID || (!this.user && !this.user.MEMBERSHIP_ID)) {
|
||
let _this = this;
|
||
uni.showModal({
|
||
title: "温馨提示",
|
||
content: "请您授权登录后再操作。",
|
||
success(res) {
|
||
if (res.confirm) {
|
||
uni.navigateTo({ url: "/pages/register/index" });
|
||
}
|
||
},
|
||
});
|
||
return;
|
||
}
|
||
uni.navigateTo({
|
||
url: "/pages/payfor/index",
|
||
});
|
||
},
|
||
// 跳转去收藏页面
|
||
handleGoCollect() {
|
||
if (this.user && !this.user.MEMBERSHIP_ID || (!this.user && !this.user.MEMBERSHIP_ID)) {
|
||
let _this = this;
|
||
uni.showModal({
|
||
title: "温馨提示",
|
||
content: "请您授权登录后再操作。",
|
||
success(res) {
|
||
if (res.confirm) {
|
||
uni.navigateTo({ url: "/pages/register/index" });
|
||
}
|
||
},
|
||
});
|
||
return;
|
||
}
|
||
uni.navigateTo({
|
||
url:
|
||
"/pages/useConfig/FavoriteStore"
|
||
});
|
||
},
|
||
async handleGetOrderDetail() {
|
||
if (this.user && !this.user.MEMBERSHIP_ID || (!this.user && !this.user.MEMBERSHIP_ID)) {
|
||
return;
|
||
}
|
||
// 商城订单数据
|
||
const req = {
|
||
action_type: "GetMallOrderList",
|
||
salebillType: '3000,3001,3002,3999',
|
||
salebillState: "",
|
||
PageIndex: 1,
|
||
pageSize: 99999,
|
||
ownerUnitId: 911,
|
||
requestType: "application/x-www-form-urlencoded",
|
||
noLoading: true,
|
||
};
|
||
const data = await this.$api.postCoop(req);
|
||
console.log('商城订单', data);
|
||
if (data.ResultCode === "100") {
|
||
let list = data.Data.List
|
||
// 待付款
|
||
let obligation = []
|
||
// 待发货
|
||
let pendingShipment = []
|
||
// 待收货
|
||
let pendingReceiptOfGoods = []
|
||
|
||
if (list && list.length > 0) {
|
||
list.forEach((item) => {
|
||
if (item.SALEBILL_STATE === 1005) {
|
||
obligation.push(item)
|
||
} else if (item.SALEBILL_STATE === 1010) {
|
||
pendingShipment.push(item)
|
||
} else if (item.SALEBILL_STATE === 2010) {
|
||
pendingReceiptOfGoods.push(item)
|
||
}
|
||
})
|
||
}
|
||
|
||
let mallOrderCountList = [obligation && obligation.length > 0 ? obligation.length : 0,
|
||
pendingShipment && pendingShipment.length > 0 ? pendingShipment.length : 0,
|
||
pendingReceiptOfGoods && pendingReceiptOfGoods.length > 0 ? pendingReceiptOfGoods.length : 0,]
|
||
this.mallOrderCountList = mallOrderCountList
|
||
} else {
|
||
this.mallOrderCountList = [0, 0, 0]
|
||
}
|
||
|
||
uni.setStorageSync("shopOrderStatus", this.mallOrderCountList)
|
||
|
||
const reqFood = {
|
||
action_type: "GetOrderList",
|
||
salebillType: 6000,
|
||
salebillState: "",
|
||
PageIndex: 1,
|
||
pageSize: 99999,
|
||
ownerUnitId: 911,
|
||
requestType: "application/x-www-form-urlencoded",
|
||
};
|
||
const dataFood = await this.$api.postCoop(reqFood);
|
||
console.log('点餐订单', dataFood);
|
||
if (dataFood.ResultCode === "100") {
|
||
let list = dataFood.Data.List
|
||
// 待付款
|
||
let obligation = []
|
||
// 待接单
|
||
let pendingShipment = []
|
||
// 制作中
|
||
let pendingReceiptOfGoods = []
|
||
|
||
if (list && list.length > 0) {
|
||
list.forEach((item) => {
|
||
if (item.SALEBILL_STATE === 1005) {
|
||
obligation.push(item)
|
||
} else if (item.SALEBILL_STATE === 1010) {
|
||
pendingShipment.push(item)
|
||
} else if (item.SALEBILL_STATE === 2000) {
|
||
pendingReceiptOfGoods.push(item)
|
||
}
|
||
})
|
||
}
|
||
|
||
let foodOrderCountList = [obligation && obligation.length > 0 ? obligation.length : 0,
|
||
pendingShipment && pendingShipment.length > 0 ? pendingShipment.length : 0,
|
||
pendingReceiptOfGoods && pendingReceiptOfGoods.length > 0 ? pendingReceiptOfGoods.length : 0,]
|
||
// this.foodOrderCountList = foodOrderCountList
|
||
let foodTab = JSON.parse(JSON.stringify(this.foodFunList))
|
||
foodTab.forEach((item) => {
|
||
if (item.value === 1) {
|
||
item.orderCount = obligation && obligation.length > 0 ? obligation.length : 0
|
||
} else if (item.value === 2) {
|
||
item.orderCount = pendingShipment && pendingShipment.length > 0 ? pendingShipment.length : 0
|
||
} else if (item.value === 3) {
|
||
item.orderCount = pendingReceiptOfGoods && pendingReceiptOfGoods.length > 0 ? pendingReceiptOfGoods.length : 0
|
||
}
|
||
})
|
||
this.foodFunList = foodTab
|
||
} else {
|
||
this.foodFunList = [
|
||
{
|
||
label: "待付款",
|
||
value: 1,
|
||
src: "/static/images/home/obligationIcon.svg",
|
||
},
|
||
{
|
||
label: "待接单",
|
||
value: 2,
|
||
src: "/static/images/home/shipmentIcon.svg",
|
||
},
|
||
{
|
||
label: "制作中",
|
||
value: 3,
|
||
src: "/static/images/home/receiptOfGoods.svg",
|
||
},
|
||
{
|
||
label: "待评价",
|
||
value: 4,
|
||
src: "/static/images/home/evaluatedIcon.svg",
|
||
},
|
||
]
|
||
}
|
||
|
||
uni.setStorageSync("foodOrderStatus", this.mallOrderCountList)
|
||
this.$forceUpdate()
|
||
}
|
||
},
|
||
};
|
||
</script>
|
||
|
||
<style lang="less" scoped>
|
||
.main {
|
||
width: 100vw;
|
||
height: 100vh;
|
||
background-image: url('https://eshangtech.com/minTestImg/pageBg.png');
|
||
|
||
.fixedHeader {
|
||
width: 100vw;
|
||
position: fixed;
|
||
// background-image: url('https://eshangtech.com/caiyunyiImg/userInfoBg.png');
|
||
background-image: url('https://eshangtech.com/minTestImg/pageBg.png');
|
||
background-repeat: no-repeat;
|
||
background-size: 100% 100vh;
|
||
top: 0;
|
||
left: 0;
|
||
z-index: 999999;
|
||
|
||
display: flex;
|
||
align-items: flex-end;
|
||
|
||
.YDIcon {
|
||
width: 176rpx;
|
||
height: 48rpx;
|
||
margin-left: 32rpx;
|
||
margin-bottom: 16px;
|
||
}
|
||
}
|
||
|
||
.pageTop {
|
||
width: 100vw;
|
||
// height: 456rpx;
|
||
// background-image: url('https://eshangtech.com/caiyunyiImg/userInfoBg.png');
|
||
background-image: url('https://eshangtech.com/minTestImg/pageBg.png');
|
||
background-repeat: no-repeat;
|
||
background-size: 100% 100vh;
|
||
box-sizing: border-box;
|
||
|
||
.userTopInfo {
|
||
width: calc(100vw - 64rpx);
|
||
margin-left: 32rpx;
|
||
background: linear-gradient(270deg, #27B25F 0%, #4CCC7F 100%);
|
||
border-radius: 16rpx;
|
||
|
||
.userInfoBox {
|
||
width: 100%;
|
||
// height: 136rpx;
|
||
box-sizing: border-box;
|
||
padding: 40rpx 42rpx;
|
||
display: flex;
|
||
|
||
.headerImgBox {
|
||
width: 136rpx;
|
||
height: 136rpx;
|
||
|
||
.avatarBtn {
|
||
width: 136rpx;
|
||
height: 136rpx;
|
||
border-radius: 50%;
|
||
border: 1px solid #fff;
|
||
padding: 0 !important;
|
||
|
||
.headerImg {
|
||
width: 100%;
|
||
height: 100%;
|
||
|
||
}
|
||
}
|
||
}
|
||
|
||
.userInfo {
|
||
width: calc(100% - 170rpx);
|
||
height: 100%;
|
||
margin-left: 34rpx;
|
||
display: flex;
|
||
|
||
|
||
.userInfoLeft {
|
||
// width: calc(100% - 82rpx);
|
||
width: 100%;
|
||
box-sizing: border-box;
|
||
// padding: 16rpx 0 0 0;
|
||
|
||
.userInfoLeftTop {
|
||
|
||
// display: flex;
|
||
// align-items: center;
|
||
.userName {
|
||
display: block;
|
||
max-width: 100%;
|
||
text-overflow: ellipsis;
|
||
white-space: nowrap;
|
||
overflow: hidden;
|
||
font-family: PingFangSC, PingFang SC;
|
||
font-weight: 500;
|
||
font-size: 30rpx;
|
||
color: #FFFFFF;
|
||
line-height: 40rpx;
|
||
text-align: left;
|
||
font-style: normal;
|
||
}
|
||
|
||
.userLevel {
|
||
display: inline-flex;
|
||
align-items: center;
|
||
margin-top: 24rpx;
|
||
box-sizing: border-box;
|
||
padding: 0 14rpx;
|
||
border-radius: 32rpx;
|
||
// background-color: #2D2D2D;
|
||
background-color: #fff;
|
||
|
||
.userLevelIcon {
|
||
width: 24rpx;
|
||
height: 24rpx;
|
||
margin-right: 8rpx;
|
||
}
|
||
|
||
.userLevelName {
|
||
font-family: PingFangSC, PingFang SC;
|
||
font-weight: 500;
|
||
font-size: 24rpx;
|
||
// color: #F4DA7F;
|
||
color: #716F69;
|
||
line-height: 34rpx;
|
||
text-align: left;
|
||
font-style: normal;
|
||
text-transform: none;
|
||
}
|
||
}
|
||
|
||
|
||
|
||
.userSetting {
|
||
width: 48rpx;
|
||
height: 48rpx;
|
||
margin-left: 24rpx;
|
||
|
||
.userSettingIcon {
|
||
width: 100%;
|
||
height: 100%;
|
||
}
|
||
}
|
||
|
||
}
|
||
|
||
.userInfoLeftBottom {
|
||
width: 100%;
|
||
margin-top: 16rpx;
|
||
// display: flex;
|
||
// align-items: center;
|
||
|
||
.userInfoLeftBottomItem {
|
||
.bindCarBox {
|
||
font-family: PingFangSC, PingFang SC;
|
||
font-weight: 400;
|
||
font-size: 24rpx;
|
||
line-height: 34rpx;
|
||
text-align: right;
|
||
font-style: normal;
|
||
padding: 4rpx 22rpx 2rpx 22rpx;
|
||
border-radius: 32rpx;
|
||
// color: #2D2D2D;
|
||
// background-color: #D8D8D8;
|
||
color: #716F69;
|
||
background-color: #fff;
|
||
display: inline-block;
|
||
}
|
||
|
||
.userCollect {
|
||
font-family: PingFangSC, PingFang SC;
|
||
font-weight: 400;
|
||
font-size: 24rpx;
|
||
line-height: 34rpx;
|
||
text-align: right;
|
||
font-style: normal;
|
||
padding: 4rpx 22rpx 2rpx 22rpx;
|
||
border-radius: 32rpx;
|
||
// margin-left: 18rpx;
|
||
// color: #2D2D2D;
|
||
// background-color: #D8D8D8;
|
||
color: #716F69;
|
||
background-color: #fff;
|
||
display: inline-block;
|
||
}
|
||
}
|
||
|
||
}
|
||
|
||
}
|
||
|
||
.userInfoRight {
|
||
width: 82rpx;
|
||
height: 100%;
|
||
box-sizing: border-box;
|
||
// padding-top: 18rpx;
|
||
|
||
.userCodeImg {
|
||
width: 82rpx;
|
||
height: 76rpx;
|
||
margin-bottom: 4rpx;
|
||
}
|
||
|
||
.userCodeText {
|
||
font-family: PingFangSC, PingFang SC;
|
||
font-weight: 400;
|
||
font-size: 24rpx;
|
||
// color: #F2CC93;
|
||
color: #fff;
|
||
line-height: 34rpx;
|
||
text-align: center;
|
||
font-style: normal;
|
||
}
|
||
}
|
||
}
|
||
}
|
||
|
||
.couponBox {
|
||
width: 100%;
|
||
height: 132rpx;
|
||
// margin-top: 36rpx;
|
||
box-sizing: border-box;
|
||
// padding: 0 30rpx;
|
||
|
||
.CouponContent {
|
||
width: 100%;
|
||
height: 100%;
|
||
background-color: #fff;
|
||
box-shadow: 2rpx 2rpx 4rpx 0rpx rgba(0, 0, 0, 0.09);
|
||
// border-radius: 8rpx;
|
||
border-bottom-left-radius: 16rpx;
|
||
border-bottom-right-radius: 16rpx;
|
||
box-sizing: border-box;
|
||
padding: 20rpx 0;
|
||
display: flex;
|
||
align-items: center;
|
||
|
||
.CouponItem {
|
||
// width: calc((100% - 2px) / 3);
|
||
width: calc((100% - 2px) / 2);
|
||
height: 100%;
|
||
display: flex;
|
||
flex-direction: column;
|
||
align-items: center;
|
||
justify-content: center;
|
||
|
||
.CouponItemValue {
|
||
font-family: PingFangSC, PingFang SC;
|
||
font-weight: 600;
|
||
font-size: 30rpx;
|
||
color: #101010;
|
||
line-height: 44rpx;
|
||
text-align: left;
|
||
font-style: normal;
|
||
margin-bottom: 2rpx;
|
||
}
|
||
|
||
.CouponItemLabel {
|
||
font-family: PingFangSC, PingFang SC;
|
||
font-weight: 400;
|
||
font-size: 24rpx;
|
||
color: #333330;
|
||
line-height: 44rpx;
|
||
text-align: center;
|
||
font-style: normal;
|
||
}
|
||
}
|
||
|
||
.line {
|
||
width: 2rpx;
|
||
height: 48rpx;
|
||
background-color: #B9B6B6;
|
||
border-radius: 1rpx;
|
||
}
|
||
}
|
||
|
||
|
||
|
||
}
|
||
}
|
||
|
||
|
||
|
||
|
||
}
|
||
|
||
|
||
.pageContent {
|
||
width: 100%;
|
||
box-sizing: border-box;
|
||
padding: 0 32rpx 200rpx;
|
||
|
||
.basicBox {
|
||
width: 100%;
|
||
background: #FFFFFF;
|
||
border-radius: 14rpx;
|
||
margin-top: 24rpx;
|
||
box-sizing: border-box;
|
||
padding: 22rpx 34rpx;
|
||
|
||
.userOrderTop {
|
||
width: 100%;
|
||
display: flex;
|
||
align-items: center;
|
||
justify-content: space-between;
|
||
|
||
.userOrderTitle {
|
||
font-family: PingFangSC, PingFang SC;
|
||
font-weight: 600;
|
||
font-size: 28rpx;
|
||
color: #222222;
|
||
line-height: 40rpx;
|
||
text-align: right;
|
||
font-style: normal;
|
||
}
|
||
|
||
.userOrderMoreIcon {
|
||
width: 24rpx;
|
||
height: 24rpx;
|
||
}
|
||
}
|
||
|
||
.basicBoxContent {
|
||
width: 100%;
|
||
display: flex;
|
||
align-items: center;
|
||
margin-top: 42rpx;
|
||
|
||
.basicItem {
|
||
width: 20%;
|
||
display: flex;
|
||
flex-direction: column;
|
||
align-items: center;
|
||
justify-content: center;
|
||
|
||
.basicItemImg {
|
||
width: 48rpx;
|
||
height: 48rpx;
|
||
margin-bottom: 16rpx;
|
||
}
|
||
|
||
.basicText {
|
||
font-family: 'PingFangSC';
|
||
font-weight: 400;
|
||
font-size: 24rpx;
|
||
color: #716F69;
|
||
line-height: 36rpx;
|
||
text-align: left;
|
||
font-style: normal;
|
||
}
|
||
}
|
||
}
|
||
|
||
|
||
}
|
||
|
||
.userOrder {
|
||
width: 100%;
|
||
background: #FFFFFF;
|
||
border-radius: 14rpx;
|
||
margin-top: 24rpx;
|
||
box-sizing: border-box;
|
||
padding: 22rpx 34rpx;
|
||
|
||
.userOrderTop {
|
||
width: 100%;
|
||
display: flex;
|
||
align-items: center;
|
||
justify-content: space-between;
|
||
|
||
.userOrderTitle {
|
||
font-family: PingFangSC, PingFang SC;
|
||
font-weight: 600;
|
||
font-size: 28rpx;
|
||
color: #222222;
|
||
line-height: 40rpx;
|
||
text-align: right;
|
||
font-style: normal;
|
||
}
|
||
|
||
.userOrderMoreIcon {
|
||
width: 24rpx;
|
||
height: 24rpx;
|
||
}
|
||
}
|
||
|
||
.userOrderBottom {
|
||
width: 100%;
|
||
display: flex;
|
||
margin-top: 42rpx;
|
||
|
||
.userOrderBottomItem {
|
||
width: 20%;
|
||
display: flex;
|
||
flex-direction: column;
|
||
align-items: center;
|
||
justify-content: center;
|
||
position: relative;
|
||
|
||
.userOrderBottomItemImg {
|
||
width: 48rpx;
|
||
height: 48rpx;
|
||
margin-bottom: 16rpx;
|
||
}
|
||
|
||
.userOrderBottomItemText {
|
||
font-family: PingFangSC, PingFang SC;
|
||
font-weight: 400;
|
||
font-size: 24rpx;
|
||
color: #222222;
|
||
line-height: 36rpx;
|
||
text-align: right;
|
||
font-style: normal;
|
||
}
|
||
|
||
.orderCount {
|
||
position: absolute;
|
||
min-width: 28rpx;
|
||
min-height: 28rpx;
|
||
text-align: center;
|
||
top: -10rpx;
|
||
right: 10rpx;
|
||
color: #fff;
|
||
background-color: red;
|
||
border-radius: 50%;
|
||
font-size: 20rpx;
|
||
}
|
||
}
|
||
}
|
||
}
|
||
|
||
.oftenFunBox {
|
||
width: 100%;
|
||
margin-top: 24rpx;
|
||
background: #FFFFFF;
|
||
border-radius: 14rpx;
|
||
box-sizing: border-box;
|
||
padding: 22rpx 32rpx;
|
||
|
||
.ofternFunTitle {
|
||
font-family: PingFangSC, PingFang SC;
|
||
font-weight: 600;
|
||
font-size: 28rpx;
|
||
color: #222222;
|
||
line-height: 40rpx;
|
||
text-align: left;
|
||
font-style: normal;
|
||
}
|
||
|
||
.funListBox {
|
||
width: 100%;
|
||
margin-top: 20rpx;
|
||
display: flex;
|
||
align-items: center;
|
||
justify-content: space-between;
|
||
|
||
.funItemBox {
|
||
width: calc((100% - 48rpx) / 3);
|
||
height: 136rpx;
|
||
box-sizing: border-box;
|
||
padding: 14rpx 0;
|
||
display: flex;
|
||
flex-direction: column;
|
||
align-items: center;
|
||
justify-content: center;
|
||
background: #F1F5FA;
|
||
border-radius: 9rpx;
|
||
|
||
.funItemImg {
|
||
width: 64rpx;
|
||
height: 64rpx;
|
||
margin-bottom: 8rpx;
|
||
}
|
||
|
||
.funItemText {
|
||
font-family: PingFangSC, PingFang SC;
|
||
font-weight: 400;
|
||
font-size: 24rpx;
|
||
color: #222222;
|
||
line-height: 40rpx;
|
||
text-align: center;
|
||
font-style: normal;
|
||
}
|
||
}
|
||
}
|
||
}
|
||
|
||
.customerServiceBox {
|
||
width: 100%;
|
||
margin-top: 24rpx;
|
||
background: #FFFFFF;
|
||
border-radius: 14rpx;
|
||
box-sizing: border-box;
|
||
padding: 22rpx 32rpx;
|
||
|
||
.customerServiceTitle {
|
||
font-family: PingFangSC, PingFang SC;
|
||
font-weight: 600;
|
||
font-size: 28rpx;
|
||
color: #222222;
|
||
line-height: 40rpx;
|
||
text-align: left;
|
||
font-style: normal;
|
||
}
|
||
|
||
.customerServiceContent {
|
||
display: flex;
|
||
align-items: center;
|
||
justify-content: space-between;
|
||
margin-top: 20rpx;
|
||
|
||
.customerServiceItem {
|
||
width: calc((100% - 20rpx) / 2);
|
||
height: 130rpx;
|
||
background-repeat: no-repeat;
|
||
background-size: 100% 100%;
|
||
background-image: url('https://eshangtech.com/caiyunyiImg/customerServiceItem1.png');
|
||
box-sizing: border-box;
|
||
padding: 20rpx;
|
||
|
||
/* 覆盖系统生成的伪元素 */
|
||
.no-border-btn::after,
|
||
.no-border-btn::before {
|
||
content: '' !important;
|
||
border: 0 !important;
|
||
box-shadow: none !important;
|
||
display: none !important;
|
||
height: 0 !important;
|
||
width: 0 !important;
|
||
-webkit-transform: scale(0) !important;
|
||
transform: scale(0) !important;
|
||
}
|
||
|
||
.customerServiceItemTitle {
|
||
font-family: PingFangSC, PingFang SC;
|
||
font-weight: 500;
|
||
font-size: 28rpx;
|
||
color: #FFFFFF;
|
||
line-height: 40rpx;
|
||
text-align: left;
|
||
font-style: normal;
|
||
}
|
||
|
||
.customerServiceItemContent {
|
||
font-family: STYuanti-SC, STYuanti-SC;
|
||
font-weight: 400;
|
||
font-size: 20rpx;
|
||
color: #0754F3;
|
||
line-height: 28rpx;
|
||
text-align: left;
|
||
font-style: normal;
|
||
margin-top: 8rpx;
|
||
}
|
||
}
|
||
|
||
.customerServiceItemBg2 {
|
||
background-image: url('https://eshangtech.com/caiyunyiImg/customerServiceItem2.png');
|
||
}
|
||
}
|
||
|
||
}
|
||
|
||
.serviceDetail {
|
||
width: 100%;
|
||
margin-top: 32rpx;
|
||
box-sizing: border-box;
|
||
padding: 24rpx;
|
||
background: #ffffff;
|
||
border-radius: 12rpx;
|
||
|
||
.detailTop {
|
||
width: 100%;
|
||
display: flex;
|
||
align-items: flex-start;
|
||
position: relative;
|
||
|
||
.detailImg {
|
||
width: 160rpx;
|
||
height: 136rpx;
|
||
border-radius: 6rpx;
|
||
overflow: hidden;
|
||
margin-right: 20rpx;
|
||
|
||
.img {
|
||
width: 160rpx;
|
||
height: 136rpx;
|
||
}
|
||
}
|
||
|
||
.detailRight {
|
||
width: calc(100% - 180rpx);
|
||
height: 136rpx;
|
||
display: flex;
|
||
flex-direction: column;
|
||
justify-content: space-between;
|
||
|
||
.detailTop {
|
||
display: flex;
|
||
flex-direction: column;
|
||
|
||
.title {
|
||
font-family: PingFangSC, PingFang SC;
|
||
font-weight: 600;
|
||
font-size: 32rpx;
|
||
color: #130f05;
|
||
line-height: 44rpx;
|
||
text-align: left;
|
||
font-style: normal;
|
||
display: inline-block;
|
||
width: 352rpx;
|
||
overflow: hidden;
|
||
white-space: nowrap;
|
||
text-overflow: ellipsis;
|
||
margin-bottom: 4rpx;
|
||
}
|
||
|
||
.status {
|
||
.statusText {
|
||
font-family: PingFangSC, PingFang SC;
|
||
font-weight: 400;
|
||
font-size: 22rpx;
|
||
color: #009f43;
|
||
line-height: 32rpx;
|
||
text-align: justify;
|
||
font-style: normal;
|
||
padding: 2rpx 6rpx;
|
||
background: #e9f8ee;
|
||
border-radius: 4rpx;
|
||
display: inline-block;
|
||
}
|
||
}
|
||
}
|
||
|
||
.detailBottom {
|
||
margin-top: 16rpx;
|
||
|
||
.distance {
|
||
font-family: PingFangSC, PingFang SC;
|
||
font-weight: 400;
|
||
font-size: 24rpx;
|
||
color: #130f05;
|
||
line-height: 36rpx;
|
||
text-align: left;
|
||
font-style: normal;
|
||
margin-right: 8rpx;
|
||
}
|
||
|
||
.addressText {
|
||
max-width: 342rpx;
|
||
font-family: PingFangSC, PingFang SC;
|
||
font-weight: 400;
|
||
font-size: 24rpx;
|
||
color: #716f69;
|
||
line-height: 36rpx;
|
||
text-align: left;
|
||
font-style: normal;
|
||
text-overflow: ellipsis;
|
||
overflow: hidden;
|
||
white-space: nowrap;
|
||
}
|
||
}
|
||
}
|
||
|
||
.navigation {
|
||
width: 64rpx;
|
||
height: 64rpx;
|
||
position: absolute;
|
||
right: 0;
|
||
top: 0;
|
||
}
|
||
}
|
||
|
||
.detailBottom {
|
||
width: 100%;
|
||
margin-top: 24rpx;
|
||
display: flex;
|
||
align-items: center;
|
||
|
||
.detailBottomItem {
|
||
width: calc(100% / 6);
|
||
display: flex;
|
||
flex-direction: column;
|
||
justify-content: space-between;
|
||
align-items: center;
|
||
|
||
.detailIcon {
|
||
width: 48rpx;
|
||
height: 48rpx;
|
||
margin-bottom: 4rpx;
|
||
}
|
||
|
||
.detailText {
|
||
font-family: PingFangSC, PingFang SC;
|
||
font-weight: 400;
|
||
font-size: 22rpx;
|
||
color: #130f05;
|
||
line-height: 32rpx;
|
||
text-align: left;
|
||
font-style: normal;
|
||
}
|
||
}
|
||
}
|
||
|
||
.stateGrid {
|
||
width: 100%;
|
||
margin-top: 24rpx;
|
||
background: #f6f6f6;
|
||
border-radius: 12rpx;
|
||
box-sizing: border-box;
|
||
padding: 24rpx;
|
||
display: flex;
|
||
align-items: center;
|
||
justify-content: space-between;
|
||
|
||
.leftGrid {
|
||
display: flex;
|
||
align-items: center;
|
||
|
||
.gridImg {
|
||
width: 40rpx;
|
||
height: 40rpx;
|
||
margin-right: 12rpx;
|
||
}
|
||
|
||
.gridText {
|
||
font-family: PingFangSC, PingFang SC;
|
||
font-weight: 400;
|
||
font-size: 28rpx;
|
||
color: #130f05;
|
||
line-height: 40rpx;
|
||
text-align: left;
|
||
font-style: normal;
|
||
margin-right: 12rpx;
|
||
}
|
||
|
||
.fastCharg {
|
||
font-family: PingFangSC, PingFang SC;
|
||
font-weight: 400;
|
||
font-size: 20rpx;
|
||
color: #ffffff;
|
||
line-height: 28rpx;
|
||
text-align: justify;
|
||
font-style: normal;
|
||
display: inline;
|
||
padding: 2rpx 6rpx;
|
||
background: linear-gradient(270deg, #ff500e 0%, #ff7d0a 100%);
|
||
border-radius: 4rpx;
|
||
}
|
||
}
|
||
|
||
.rightGrid {
|
||
display: flex;
|
||
align-items: center;
|
||
|
||
.other {
|
||
font-family: PingFangSC, PingFang SC;
|
||
font-weight: 400;
|
||
font-size: 24rpx;
|
||
color: #130f05;
|
||
line-height: 36rpx;
|
||
text-align: left;
|
||
font-style: normal;
|
||
margin-right: 4rpx;
|
||
}
|
||
|
||
.have {
|
||
font-family: DINAlternate, DINAlternate;
|
||
font-weight: bold;
|
||
font-size: 32rpx;
|
||
color: #130f05;
|
||
line-height: 36rpx;
|
||
text-align: left;
|
||
font-style: normal;
|
||
margin-right: 4rpx;
|
||
}
|
||
|
||
.all {
|
||
font-family: DINAlternate, DINAlternate;
|
||
font-weight: bold;
|
||
font-size: 32rpx;
|
||
color: #716f69;
|
||
line-height: 36rpx;
|
||
text-align: left;
|
||
font-style: normal;
|
||
}
|
||
}
|
||
}
|
||
}
|
||
|
||
.orderFun {
|
||
width: 100%;
|
||
margin-top: 24rpx;
|
||
background: #fff;
|
||
box-sizing: border-box;
|
||
padding: 22rpx 34rpx;
|
||
border-radius: 14rpx;
|
||
|
||
.boxTitleTop {
|
||
width: 100%;
|
||
display: flex;
|
||
align-items: center;
|
||
justify-content: space-between;
|
||
|
||
.boxTitle {
|
||
font-family: PingFangSC, PingFang SC;
|
||
font-weight: 600;
|
||
font-size: 28rpx;
|
||
color: #130f05;
|
||
line-height: 40rpx;
|
||
text-align: left;
|
||
font-style: normal;
|
||
}
|
||
|
||
.rightArrow {
|
||
width: 24rpx;
|
||
height: 24rpx;
|
||
}
|
||
}
|
||
|
||
.orderContent {
|
||
margin-top: 32rpx;
|
||
width: 100%;
|
||
display: flex;
|
||
align-items: center;
|
||
|
||
.orderLeft,
|
||
.newOrderLeft {
|
||
width: calc(100% - 108rpx);
|
||
display: flex;
|
||
justify-content: space-between;
|
||
position: relative;
|
||
box-sizing: border-box;
|
||
padding-right: 44rpx;
|
||
|
||
.orderFunItem {
|
||
width: 20%;
|
||
display: flex;
|
||
flex-direction: column;
|
||
align-items: center;
|
||
justify-content: center;
|
||
position: relative;
|
||
|
||
.orderFunIcon {
|
||
width: 48rpx;
|
||
height: 48rpx;
|
||
margin-bottom: 16rpx;
|
||
}
|
||
|
||
.orderFunText {
|
||
font-family: PingFangSC, PingFang SC;
|
||
font-weight: 400;
|
||
font-size: 24rpx;
|
||
color: #716f69;
|
||
line-height: 36rpx;
|
||
text-align: left;
|
||
font-style: normal;
|
||
}
|
||
|
||
.orderCount {
|
||
position: absolute;
|
||
right: 10rpx;
|
||
top: -10rpx;
|
||
min-width: 28rpx;
|
||
min-height: 28rpx;
|
||
text-align: center;
|
||
color: #fff;
|
||
background-color: red;
|
||
border-radius: 50%;
|
||
font-size: 20rpx;
|
||
}
|
||
}
|
||
}
|
||
|
||
.orderLeft::after {
|
||
content: "";
|
||
width: 2rpx;
|
||
height: 76rpx;
|
||
background: #eeeeee;
|
||
position: absolute;
|
||
right: 0;
|
||
top: 50%;
|
||
transform: translateY(-50%);
|
||
}
|
||
|
||
.orderRight {
|
||
width: 162rpx;
|
||
box-sizing: border-box;
|
||
padding-left: 44rpx;
|
||
|
||
.orderFunItem {
|
||
width: 108rpx;
|
||
display: flex;
|
||
flex-direction: column;
|
||
align-items: center;
|
||
justify-content: center;
|
||
|
||
.orderFunIcon {
|
||
width: 48rpx;
|
||
height: 48rpx;
|
||
margin-bottom: 16rpx;
|
||
}
|
||
|
||
.orderFunText {
|
||
font-family: PingFangSC, PingFang SC;
|
||
font-weight: 400;
|
||
font-size: 24rpx;
|
||
color: #716f69;
|
||
line-height: 36rpx;
|
||
text-align: left;
|
||
font-style: normal;
|
||
}
|
||
}
|
||
}
|
||
}
|
||
}
|
||
}
|
||
}
|
||
|
||
/* 用户页面骨架屏样式 */
|
||
.user-skeleton {
|
||
width: 100vw;
|
||
background-image: url('https://eshangtech.com/minTestImg/pageBg.png');
|
||
background-repeat: no-repeat;
|
||
background-size: 100% 100vh;
|
||
padding-bottom: 200rpx;
|
||
}
|
||
|
||
/* 基础骨架屏动画 */
|
||
.skeleton {
|
||
background: linear-gradient(90deg, #f2f2f2 25%, #e6e6e6 50%, #f2f2f2 75%);
|
||
background-size: 200% 100%;
|
||
animation: loading 1.5s infinite;
|
||
}
|
||
|
||
@keyframes loading {
|
||
0% {
|
||
background-position: 200% 0;
|
||
}
|
||
|
||
100% {
|
||
background-position: -200% 0;
|
||
}
|
||
}
|
||
|
||
/* 用户顶部信息骨架 */
|
||
.skeleton-user-top {
|
||
width: calc(100vw - 64rpx);
|
||
margin-left: 32rpx;
|
||
background: linear-gradient(270deg, #27B25F 0%, #4CCC7F 100%);
|
||
border-radius: 16rpx;
|
||
overflow: hidden;
|
||
}
|
||
|
||
.skeleton-user-info {
|
||
padding: 40rpx 42rpx;
|
||
display: flex;
|
||
align-items: center;
|
||
|
||
.skeleton-avatar {
|
||
width: 136rpx;
|
||
height: 136rpx;
|
||
border-radius: 50%;
|
||
margin-right: 34rpx;
|
||
background: rgba(255, 255, 255, 0.3);
|
||
}
|
||
|
||
.skeleton-user-details {
|
||
flex: 1;
|
||
|
||
.skeleton-username {
|
||
width: 200rpx;
|
||
height: 40rpx;
|
||
border-radius: 20rpx;
|
||
margin-bottom: 24rpx;
|
||
background: rgba(255, 255, 255, 0.3);
|
||
}
|
||
|
||
.skeleton-level {
|
||
width: 120rpx;
|
||
height: 34rpx;
|
||
border-radius: 17rpx;
|
||
background: rgba(255, 255, 255, 0.3);
|
||
}
|
||
}
|
||
|
||
.skeleton-qr-code {
|
||
width: 82rpx;
|
||
height: 110rpx;
|
||
border-radius: 8rpx;
|
||
background: rgba(255, 255, 255, 0.3);
|
||
}
|
||
}
|
||
|
||
.skeleton-stats {
|
||
background: #ffffff;
|
||
display: flex;
|
||
padding: 20rpx 0;
|
||
|
||
.skeleton-stat-item {
|
||
flex: 1;
|
||
display: flex;
|
||
flex-direction: column;
|
||
align-items: center;
|
||
|
||
.skeleton-stat-number {
|
||
width: 60rpx;
|
||
height: 44rpx;
|
||
border-radius: 22rpx;
|
||
margin-bottom: 4rpx;
|
||
}
|
||
|
||
.skeleton-stat-label {
|
||
width: 80rpx;
|
||
height: 44rpx;
|
||
border-radius: 22rpx;
|
||
}
|
||
}
|
||
}
|
||
|
||
/* 功能区域骨架 */
|
||
.skeleton-section {
|
||
width: calc(100vw - 64rpx);
|
||
margin: 24rpx 32rpx 0;
|
||
background: #FFFFFF;
|
||
border-radius: 14rpx;
|
||
padding: 22rpx 34rpx;
|
||
|
||
.skeleton-section-title {
|
||
width: 120rpx;
|
||
height: 40rpx;
|
||
border-radius: 20rpx;
|
||
margin-bottom: 42rpx;
|
||
}
|
||
}
|
||
|
||
.skeleton-service-grid {
|
||
display: flex;
|
||
justify-content: space-between;
|
||
|
||
.skeleton-service-item {
|
||
width: 18%;
|
||
text-align: center;
|
||
|
||
.skeleton-service-icon {
|
||
width: 48rpx;
|
||
height: 48rpx;
|
||
border-radius: 8rpx;
|
||
margin: 0 auto 16rpx;
|
||
}
|
||
|
||
.skeleton-service-text {
|
||
width: 60rpx;
|
||
height: 36rpx;
|
||
border-radius: 18rpx;
|
||
margin: 0 auto;
|
||
}
|
||
}
|
||
}
|
||
|
||
.skeleton-order-grid {
|
||
display: flex;
|
||
justify-content: space-between;
|
||
|
||
.skeleton-order-item {
|
||
width: 18%;
|
||
text-align: center;
|
||
|
||
.skeleton-order-icon {
|
||
width: 48rpx;
|
||
height: 48rpx;
|
||
border-radius: 8rpx;
|
||
margin: 0 auto 16rpx;
|
||
}
|
||
|
||
.skeleton-order-text {
|
||
width: 60rpx;
|
||
height: 36rpx;
|
||
border-radius: 18rpx;
|
||
margin: 0 auto;
|
||
}
|
||
}
|
||
}
|
||
|
||
.skeleton-food-grid {
|
||
display: flex;
|
||
justify-content: space-between;
|
||
|
||
.skeleton-food-item {
|
||
width: 22%;
|
||
text-align: center;
|
||
|
||
.skeleton-food-icon {
|
||
width: 48rpx;
|
||
height: 48rpx;
|
||
border-radius: 8rpx;
|
||
margin: 0 auto 16rpx;
|
||
}
|
||
|
||
.skeleton-food-text {
|
||
width: 60rpx;
|
||
height: 36rpx;
|
||
border-radius: 18rpx;
|
||
margin: 0 auto;
|
||
}
|
||
}
|
||
}
|
||
|
||
.skeleton-service-cards {
|
||
display: flex;
|
||
justify-content: space-between;
|
||
|
||
.skeleton-service-card {
|
||
width: calc((100% - 20rpx) / 2);
|
||
height: 130rpx;
|
||
border-radius: 8rpx;
|
||
padding: 20rpx;
|
||
box-sizing: border-box;
|
||
|
||
.skeleton-card-title {
|
||
width: 80rpx;
|
||
height: 40rpx;
|
||
border-radius: 20rpx;
|
||
margin-bottom: 8rpx;
|
||
}
|
||
|
||
.skeleton-card-content {
|
||
width: 120rpx;
|
||
height: 28rpx;
|
||
border-radius: 14rpx;
|
||
}
|
||
}
|
||
}
|
||
</style> |