ylj20011123 93112d2e51 update
2025-09-05 17:30:23 +08:00

2429 lines
90 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">
<view class="CouponItemValue">{{ userInfo.COUPON_COUNT || 0 }}</view>
<view class="CouponItemLabel">优惠券</view>
</view>
<view class="line"></view>
<view class="CouponItem" @click="handleGoPoint">
<view class="CouponItemValue">{{
$utils.handleFormatNumber(userInfo.MEMBERSHIP_POINT || 0)
}}</view>
<view class="CouponItemLabel">积分</view>
</view>
<!-- <view class="line"></view>
<view class="CouponItem" @click="hanldGoBalance">
<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" @click="handleGoCustomerService">
<view class="customerServiceItemTitle">客服帮助</view>
<view class="customerServiceItemContent">伴您行程无忧</view>
</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" />
</view>
</template>
<script>
import { handleSaveOrderStore } from '../../../utils/publicMethods'
import { mapGetters } from "vuex";
import shopTabbar from "../../../components/shopTabbar.vue";
export default {
components: { shopTabbar },
data() {
return {
showContent: false, // 是否显示内容(控制骨架屏切换)
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: "",// 判断是工会商城还是精选商城的
};
},
async onLoad(query) {
console.log("queryqueryqueryqueryquery", query);
if (query.pageType) {
this.bigPageType = query.pageType
}
// 确保首次加载时显示骨架屏
this.isFirstLoad = true;
this.showContent = false;
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();
this.$utils.addUserBehaviorNew({
behaviorRecordDesc: "进入了我的页面"
});
},
async onShow() {
// 只有第一次进入时才显示骨架屏
if (this.isFirstLoad) {
this.showContent = false;
setTimeout(() => {
this.showContent = true;
this.isFirstLoad = false; // 标记已不是第一次进入
}, 500);
} else {
// 非第一次进入直接显示内容
this.showContent = true;
}
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 handleSaveOrderStore()
// 拿到新的缓存数据
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 : ""
}
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: {
// 跳转客服帮助
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://api.eshangtech.com/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,
})
.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",
});
}
},
// // 调起付款码
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",
};
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;
.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>