angelo
/
web-base-h5
3
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

Merge branch 'lx-test' of gitee.com:cabbage_qd/web-base-h5 into lx-online

This commit is contained in:
woody 2025-05-30 09:56:39 +08:00
parent 37a91fe8a5 5b98fa4e0a
commit f07dceffd6
3 changed files with 527 additions and 411 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

484
pages/mine/index.vue
View File

@ -20,13 +20,10 @@
<view class="left_text"> <view class="left_text">
<view class="name_box"> <view class="name_box">
<view class="tTit1">{{ userInfo.memberCode }}</view> <view class="tTit1">{{ userInfo.memberCode }}</view>
</view> </view>
<view class="cmem"> <view class="cmem">
<view <view style="margin-right: 20rpx; display: flex">
style="margin-right: 20rpx; display: flex;" <view style="margin-right: 10rpx">{{ '结算等级' }}:</view>
>
<view style="margin-right: 10rpx;">{{ '结算等级' }}:</view>
<view class="jxTit1">{{ userInfo.pkGradeVal }}</view> <view class="jxTit1">{{ userInfo.pkGradeVal }}</view>
</view> </view>
<view class="grade_left"> <view class="grade_left">
@ -43,11 +40,10 @@
</view> </view>
</view> </view>
<view class="cmem"> <view class="cmem">
<view style="margin-right: 10rpx;">{{ '荣誉奖衔' }}:</view> <view style="margin-right: 10rpx">{{ '荣誉奖衔' }}:</view>
<view class="jxTit1">{{ userInfo.pkAwardsVal }}</view> <view class="jxTit1">{{ userInfo.pkAwardsVal }}</view>
</view> </view>
</view> </view>
</view> </view>
<view class="top_right" @click="goTo('/pages/userData/index')"> <view class="top_right" @click="goTo('/pages/userData/index')">
<view class="ricon"> <view class="ricon">
@ -57,7 +53,6 @@
</view> </view>
</view> </view>
<view class="ju_grade" v-if="!ifSpecial"> <view class="ju_grade" v-if="!ifSpecial">
<!-- <view v-if="awards.tarAwardsName" class="awards-progress-summary" style="text-align: center;"> <!-- <view v-if="awards.tarAwardsName" class="awards-progress-summary" style="text-align: center;">
<span class="descriptive-text">当前距离</span> <span class="descriptive-text">当前距离</span>
@ -92,7 +87,13 @@
</view> </view>
<view class="yestDay"> <view class="yestDay">
<view class="yes_t">昨日业绩</view> <view class="yes_t">昨日业绩</view>
<view :class="awards.aNewPv!=0&&awards.bNewPv!=0?'ju_left_bottom1':'ju_left_bottom'"> <view
:class="
awards.aNewPv != 0 && awards.bNewPv != 0
? 'ju_left_bottom1'
: 'ju_left_bottom'
"
>
<view <view
class="current-progress" class="current-progress"
:style="{ :style="{
@ -106,7 +107,13 @@
</view> </view>
<view class="yestDay"> <view class="yestDay">
<view class="yes_t">当月业绩</view> <view class="yes_t">当月业绩</view>
<view :class="awards.aMonthPv!=0&&awards.bMonthPv!=0?'ju_left_bottom1':'ju_left_bottom'"> <view
:class="
awards.aMonthPv != 0 && awards.bMonthPv != 0
? 'ju_left_bottom1'
: 'ju_left_bottom'
"
>
<view <view
class="current-progress" class="current-progress"
:style="{ :style="{
@ -114,14 +121,20 @@
}" }"
></view> ></view>
<view class="cha"> <view class="cha">
左区 {{ awards.aMonthPv || '0.00' }}/右区
左区 {{ awards.aMonthPv || "0.00" }}/右区 {{ awards.bMonthPv || "0.00" }} {{ awards.bMonthPv || '0.00' }}
</view> </view>
</view> </view>
</view> </view>
<view class="yestDay"> <view class="yestDay">
<view class="yes_t">{{ '历史业绩' }}</view> <view class="yes_t">{{ '历史业绩' }}</view>
<view :class="awards.aSumPv!=0&&awards.bSumPv!=0?'ju_left_bottom1':'ju_left_bottom'"> <view
:class="
awards.aSumPv != 0 && awards.bSumPv != 0
? 'ju_left_bottom1'
: 'ju_left_bottom'
"
>
<view <view
class="current-progress" class="current-progress"
:style="{ :style="{
@ -133,7 +146,6 @@
> >
</view> </view>
</view> </view>
</view> </view>
</view> </view>
</view> </view>
@ -281,13 +293,13 @@
</template> </template>
<script> <script>
import clTabbar from "@/components/cl-tabbar.vue"; import clTabbar from '@/components/cl-tabbar.vue'
import * as min from "@/config/balance.js"; import * as min from '@/config/balance.js'
import * as api from "@/config/login.js"; import * as api from '@/config/login.js'
// import talentList from "@/components/talentList.vue"; // import talentList from "@/components/talentList.vue";
export default { export default {
components: { components: {
"cl-tabbar": clTabbar, 'cl-tabbar': clTabbar,
// talentList, // talentList,
}, },
data() { data() {
@ -297,76 +309,76 @@ export default {
userInfo: {}, userInfo: {},
userData: {}, userData: {},
pswShow: false, pswShow: false,
password: "", password: '',
waitPayNum: "", waitPayNum: '',
payNum: "", payNum: '',
awards: {}, awards: {},
markMenuList: [ markMenuList: [
{ {
url: "/pages/performanceEchart/index", url: '/pages/performanceEchart/index',
name: '数据查询', name: '数据查询',
imgurl: "../../static/images/mark1.png", imgurl: '../../static/images/mark1.png',
menuKey: "marketDynamics", menuKey: 'marketDynamics',
ifshow: true, ifshow: true,
}, },
{ {
url: "/pages/bonus/index", url: '/pages/bonus/index',
name: '奖金明细', name: '奖金明细',
imgurl: "../../static/images/mark2.png", imgurl: '../../static/images/mark2.png',
menuKey: "incomeDetail", menuKey: 'incomeDetail',
ifshow: false, ifshow: false,
}, },
{ {
url: "/pages/market/examineDetail/examineDetail", url: '/pages/market/examineDetail/examineDetail',
name: '考核明细', name: '考核明细',
imgurl: "../../static/images/mark5.png", imgurl: '../../static/images/mark5.png',
menuKey: "appraisal", menuKey: 'appraisal',
ifshow: false, ifshow: false,
}, },
{ {
url: "/pages/market/registerList/registerList", url: '/pages/market/registerList/registerList',
name: '注册列表', name: '注册列表',
imgurl: "../../static/images/mark6.png", imgurl: '../../static/images/mark6.png',
menuKey: "registration", menuKey: 'registration',
ifshow: false, ifshow: false,
}, },
{ {
url: "/pages/market/investmentList/investmentList", url: '/pages/market/investmentList/investmentList',
name: '招商列表', name: '招商列表',
imgurl: "../../static/images/mark7.png", imgurl: '../../static/images/mark7.png',
menuKey: "investment", menuKey: 'investment',
ifshow: false, ifshow: false,
}, },
{ {
url: "/pages/market/activeArea/index", url: '/pages/market/activeArea/index',
name: '活动专区', name: '活动专区',
imgurl: "../../static/images/mark9.png", imgurl: '../../static/images/mark9.png',
menuKey: "activeZone", menuKey: 'activeZone',
ifshow: false, ifshow: false,
}, },
{ {
url: "/pages/architecture/architecture", url: '/pages/architecture/architecture',
name: '架构管理', name: '架构管理',
imgurl: "../../static/images/my_icon14.png", imgurl: '../../static/images/my_icon14.png',
menuKey: "recommend", menuKey: 'recommend',
ifshow: false, ifshow: false,
}, },
], ],
otherMenuList: [ otherMenuList: [
{ {
url: "1", url: '1',
name: '我的钱包', name: '我的钱包',
imgurl: "../../static/images/my_icon1.png", imgurl: '../../static/images/my_icon1.png',
menuKey: "wallet", menuKey: 'wallet',
ifshow: false, ifshow: false,
}, },
{ {
url: "/pages/pickupArea/pickupArea", url: '/pages/pickupArea/pickupArea',
name: '提货专区', name: '提货专区',
imgurl: "../../static/images/my_icon3.png", imgurl: '../../static/images/my_icon3.png',
menuKey: "pickGoods", menuKey: 'pickGoods',
ifshow: false, ifshow: false,
}, },
// { // {
@ -376,39 +388,33 @@ export default {
// menuKey: "", // menuKey: "",
// ifshow: false, // ifshow: false,
// }, // },
{ {
url: "/pages/makerspaceView/index", url: '/pages/selfService/index',
name: '创客空间认证',
imgurl: "../../static/images/my_icon5.png",
menuKey: "space",
ifshow: false,
},
{
url: "/pages/selfService/index",
name: '自助服务', name: '自助服务',
imgurl: "../../static/images/my_icon6.png", imgurl: '../../static/images/my_icon6.png',
menuKey: "selfHelp", menuKey: 'selfHelp',
ifshow: false, ifshow: false,
}, },
{ {
url: "/pages/userSecure/index", url: '/pages/userSecure/index',
name: '账号安全', name: '账号安全',
imgurl: "../../static/images/my_icon8.png", imgurl: '../../static/images/my_icon8.png',
menuKey: "", menuKey: '',
ifshow: false, ifshow: false,
}, },
{ {
url: "/pages/addressList/index", url: '/pages/addressList/index',
name: '地址管理', name: '地址管理',
imgurl: "../../static/images/my_icon9.png", imgurl: '../../static/images/my_icon9.png',
menuKey: "", menuKey: '',
ifshow: false, ifshow: false,
}, },
{ {
url: "/pages/mine/bindBank/index", url: '/pages/mine/bindBank/index',
name: '银行信息', name: '银行信息',
imgurl: "../../static/images/my_icon10.png", imgurl: '../../static/images/my_icon10.png',
menuKey: "", menuKey: '',
ifshow: false, ifshow: false,
}, },
// { // {
@ -447,141 +453,138 @@ export default {
// menuKey: "", // menuKey: "",
// ifshow: false, // ifshow: false,
// }, // },
// {
// url: "/pages/mine/space/list",
// name: '创客空间',
// imgurl: "../../static/images/mark9.png",
// menuKey: "",
// ifshow: false,
// },
{ {
url: "/pages/mine/addNewPv/index", url: '/pages/mine/addNewPv/index',
name: '新增业绩', name: '新增业绩',
imgurl: "../../static/images/mark9.png", imgurl: '../../static/images/mark9.png',
menuKey: "iNewAchievement", menuKey: 'iNewAchievement',
ifshow: false, ifshow: false,
}, },
], ],
drShow: false, drShow: false,
actMenu: false, actMenu: false,
iHonorAward: false, iHonorAward: false,
ifSpecial: false, ifSpecial: false,
awardsList: "", awardsList: '',
}; }
}, },
onShow() { onShow() {
this.getInfo(); this.getInfo()
this.orderNum(); this.orderNum()
this.getUserAwardss(); this.getUserAwardss()
}, },
computed: { computed: {
sprintProgress() { sprintProgress() {
const targetPvStr = this.awards.targetPv; const targetPvStr = this.awards.targetPv
const sumRealPvStr = this.awards.sumRealPv; // 这是"小区仅需"的量，即差距 const sumRealPvStr = this.awards.sumRealPv // 这是"小区仅需"的量，即差距
const targetPv = parseFloat(targetPvStr); const targetPv = parseFloat(targetPvStr)
const sumRealPv = parseFloat(sumRealPvStr); const sumRealPv = parseFloat(sumRealPvStr)
let achievedPv = 0; let achievedPv = 0
let percentage = 0; let percentage = 0
const numericTargetPv = Math.floor((isNaN(targetPv) ? 0 : targetPv) * 100) / 100; const numericTargetPv =
Math.floor((isNaN(targetPv) ? 0 : targetPv) * 100) / 100
if (!isNaN(targetPv) && targetPv > 0) { if (!isNaN(targetPv) && targetPv > 0) {
// sumRealPv 是差距，所以已完成的是 targetPv - sumRealPv // sumRealPv 是差距，所以已完成的是 targetPv - sumRealPv
achievedPv = targetPv - (isNaN(sumRealPv) ? 0 : sumRealPv); achievedPv = targetPv - (isNaN(sumRealPv) ? 0 : sumRealPv)
achievedPv = Math.max(0, Math.min(achievedPv, targetPv)); achievedPv = Math.max(0, Math.min(achievedPv, targetPv))
percentage = (sumRealPvStr / targetPv) * 100; percentage = (sumRealPvStr / targetPv) * 100
} else if (!isNaN(targetPv) && targetPv === 0 && !isNaN(sumRealPv) && sumRealPv <=0) { } else if (
!isNaN(targetPv) &&
targetPv === 0 &&
!isNaN(sumRealPv) &&
sumRealPv <= 0
) {
// 如果目标是0，且差距也是0或负数（表示已满足或超越0目标），则认为是100% // 如果目标是0，且差距也是0或负数（表示已满足或超越0目标），则认为是100%
achievedPv = 0; achievedPv = 0
percentage = 100; percentage = 100
} }
const clampedPercentage = Math.min(100, Math.max(0, percentage))
const clampedPercentage = Math.min(100, Math.max(0, percentage));
return { return {
percentageString: `${Math.floor(clampedPercentage)}%`, percentageString: `${Math.floor(clampedPercentage)}%`,
achieved: (Math.floor(achievedPv * 100) / 100).toFixed(2), achieved: (Math.floor(achievedPv * 100) / 100).toFixed(2),
target: numericTargetPv.toFixed(2), target: numericTargetPv.toFixed(2),
rawPercentage: clampedPercentage rawPercentage: clampedPercentage,
};
} }
}, },
},
methods: { methods: {
goYear() { goYear() {
uni.navigateTo({ uni.navigateTo({
url: "/pages/mine/yearGift/index", url: '/pages/mine/yearGift/index',
}); })
}, },
closeShow() { closeShow() {
this.drShow = false; this.drShow = false
}, },
goHonoray() { goHonoray() {
uni.navigateTo({ uni.navigateTo({
url: "/pages/mine/honoraryAwards/honoraryAwards", url: '/pages/mine/honoraryAwards/honoraryAwards',
}); })
}, },
//获取用户真实奖衔 //获取用户真实奖衔
getUserAwardss() { getUserAwardss() {
api.getUserAwards().then((res) => { api.getUserAwards().then(res => {
this.awards = res.data || {}; this.awards = res.data || {}
}); })
}, },
GetPercent(num, total) { GetPercent(num, total) {
num = parseFloat(num); num = parseFloat(num)
total = parseFloat(total); total = parseFloat(total)
if (isNaN(num) || isNaN(total)) { if (isNaN(num) || isNaN(total)) {
return "-"; return '-'
} }
if (total == 0) { if (total == 0) {
return "0%"; return '0%'
} else if (total < 0) { } else if (total < 0) {
return 100 + "%"; return 100 + '%'
} else { } else {
return Math.round((num / total) * 10000) / 100.0 + "%"; return Math.round((num / total) * 10000) / 100.0 + '%'
} }
}, },
yesPercent(left, right) { yesPercent(left, right) {
left = parseFloat(left); left = parseFloat(left)
right = parseFloat(right); right = parseFloat(right)
if (isNaN(left) || isNaN(right)) { if (isNaN(left) || isNaN(right)) {
return '0%'; return '0%'
} }
return right + left == 0 return right + left == 0
? "0%" ? '0%'
: Math.round((left / (right + left)) * 10000) / 100.0 + "%"; : Math.round((left / (right + left)) * 10000) / 100.0 + '%'
}, },
orderNum() { orderNum() {
api.orderNum().then((res) => { api.orderNum().then(res => {
this.waitPayNum = res.data.waitPayNum; this.waitPayNum = res.data.waitPayNum
this.payNum = res.data.payNum; this.payNum = res.data.payNum
}); })
}, },
getInfo() { getInfo() {
api.getInfo().then((res) => { api.getInfo().then(res => {
if (res) { if (res) {
this.userInfo = res.data; this.userInfo = res.data
if (this.userInfo.memberCode == "CN688806280001") { if (this.userInfo.memberCode == 'CN68880628') {
this.ifSpecial = true; this.ifSpecial = true
this.otherMenuList = [ this.otherMenuList = [
{ {
url: "1", url: '1',
name: '我的钱包', name: '我的钱包',
imgurl: "../../static/images/my_icon1.png", imgurl: '../../static/images/my_icon1.png',
menuKey: "wallet", menuKey: 'wallet',
ifshow: false, ifshow: false,
}, },
{ {
url: "/pages/pickupArea/pickupArea", url: '/pages/pickupArea/pickupArea',
name: '提货专区', name: '提货专区',
imgurl: "../../static/images/my_icon3.png", imgurl: '../../static/images/my_icon3.png',
menuKey: "pickGoods", menuKey: 'pickGoods',
ifshow: true, ifshow: true,
}, },
// { // {
@ -591,83 +594,71 @@ export default {
// menuKey: "", // menuKey: "",
// ifshow: false, // ifshow: false,
// }, // },
{ {
url: "/pages/makerspaceView/index", url: '/pages/selfService/index',
name: '创客空间认证',
imgurl: "../../static/images/my_icon5.png",
menuKey: "space",
ifshow: false,
},
{
url: "/pages/selfService/index",
name: '自助服务', name: '自助服务',
imgurl: "../../static/images/my_icon6.png", imgurl: '../../static/images/my_icon6.png',
menuKey: "selfHelp", menuKey: 'selfHelp',
ifshow: true, ifshow: true,
}, },
{ {
url: "/pages/userSecure/index", url: '/pages/userSecure/index',
name: '账号安全', name: '账号安全',
imgurl: "../../static/images/my_icon8.png", imgurl: '../../static/images/my_icon8.png',
menuKey: "", menuKey: '',
ifshow: true, ifshow: true,
}, },
{ {
url: "/pages/addressList/index", url: '/pages/addressList/index',
name: '地址管理', name: '地址管理',
imgurl: "../../static/images/my_icon9.png", imgurl: '../../static/images/my_icon9.png',
menuKey: "", menuKey: '',
ifshow: true, ifshow: true,
}, },
{ {
url: "/pages/mine/bindBank/index", url: '/pages/mine/bindBank/index',
name: '银行信息', name: '银行信息',
imgurl: "../../static/images/my_icon10.png", imgurl: '../../static/images/my_icon10.png',
menuKey: "", menuKey: '',
ifshow: false, ifshow: false,
}, },
{ {
url: "2", url: '2',
name: "达人榜单", name: '达人榜单',
imgurl: "../../static/images/my_icon10.png", imgurl: '../../static/images/my_icon10.png',
menuKey: "", menuKey: '',
ifdr: 1, ifdr: 1,
ifshow: false, ifshow: false,
}, },
{ {
url: "/pages/mine/myMarket/myMarket", url: '/pages/mine/myMarket/myMarket',
name: '我的市场', name: '我的市场',
imgurl: "../../static/images/my_icon9.png", imgurl: '../../static/images/my_icon9.png',
menuKey: "", menuKey: '',
ifshow: true, ifshow: true,
}, },
{ {
url: "/pages/mine/globalDistribution/globalDistribution", url: '/pages/mine/globalDistribution/globalDistribution',
name: '全球分布', name: '全球分布',
imgurl: "../../static/images/my_icon9.png", imgurl: '../../static/images/my_icon9.png',
menuKey: "", menuKey: '',
}, },
{ {
url: "/pages/mine/honorHall/honorHall", url: '/pages/mine/honorHall/honorHall',
name: "荣誉馆", name: '荣誉馆',
imgurl: "../../static/images/my_icon9.png", imgurl: '../../static/images/my_icon9.png',
menuKey: "", menuKey: '',
ifshow: false, ifshow: false,
}, },
{ {
url: "/pages/mine/giftAddress/list", url: '/pages/mine/giftAddress/list',
name: '礼品地址', name: '礼品地址',
imgurl: "../../static/images/mark9.png", imgurl: '../../static/images/mark9.png',
menuKey: "", menuKey: '',
ifshow: false,
},
{
url: "/pages/mine/space/list",
name: '创客空间',
imgurl: "../../static/images/mark9.png",
menuKey: "",
ifshow: false, ifshow: false,
}, },
// { // {
// url: '/pages/mine/addNewPv/index', // url: '/pages/mine/addNewPv/index',
// name: '新增业绩', // name: '新增业绩',
@ -676,110 +667,110 @@ export default {
// ifshow: false, // ifshow: false,
// }, // },
]; ]
} else { } else {
this.ifSpecial = false; this.ifSpecial = false
} }
} }
}); })
api.getData().then((res) => { api.getData().then(res => {
if (res.code == 200) { if (res.code == 200) {
this.userData = res.data; this.userData = res.data
} }
}); })
api.getMenuList().then((res) => { api.getMenuList().then(res => {
res.data.forEach((item) => { res.data.forEach(item => {
if (item.menuKey == "iHonorAward") { if (item.menuKey == 'iHonorAward') {
this.iHonorAward = true; this.iHonorAward = true
} }
this.markMenuList.forEach((ele) => { this.markMenuList.forEach(ele => {
if (ele.menuKey == item.menuKey || ele.menuKey == "") { if (ele.menuKey == item.menuKey || ele.menuKey == '') {
ele.ifshow = true; ele.ifshow = true
} }
}); })
this.otherMenuList.forEach((ele) => { this.otherMenuList.forEach(ele => {
if (ele.menuKey == item.menuKey || ele.menuKey == "") { if (ele.menuKey == item.menuKey || ele.menuKey == '') {
ele.ifshow = true; ele.ifshow = true
} }
}); })
}); })
console.log("🌈ad", this.otherMenuList); console.log('🌈ad', this.otherMenuList)
let a = this.markMenuList.some((item) => { let a = this.markMenuList.some(item => {
return item.ifshow == true; return item.ifshow == true
}); })
this.actMenu = a; this.actMenu = a
}); })
// api.memberAwards().then((res) => { // api.memberAwards().then((res) => {
// this.awardsList = res.data; // this.awardsList = res.data;
// }); // });
}, },
goTo(url) { goTo(url) {
if (url == 1) { if (url == 1) {
this.pswShow = true; this.pswShow = true
} else if (url == 2) { } else if (url == 2) {
//达人榜单 //达人榜单
this.drShow = true; this.drShow = true
} else { } else {
uni.navigateTo({ uni.navigateTo({
url: url, url: url,
}); })
} }
}, },
goOrder(index) { goOrder(index) {
//全部订单 //全部订单
uni.navigateTo({ uni.navigateTo({
url: "/pages/mine/order/index?isTab=" + index, url: '/pages/mine/order/index?isTab=' + index,
}); })
}, },
goRoad(index) { goRoad(index) {
//1等级2奖衔 //1等级2奖衔
if (index == 1) { if (index == 1) {
uni.navigateTo({ uni.navigateTo({
url: "/pages/mine/growthRoad/gradeRoad", url: '/pages/mine/growthRoad/gradeRoad',
}); })
} else if (index == 2) { } else if (index == 2) {
uni.navigateTo({ uni.navigateTo({
url: "/pages/mine/growthRoad/awardRoad", url: '/pages/mine/growthRoad/awardRoad',
}); })
} }
}, },
loginOut() { loginOut() {
uni.setStorageSync("pkCountry", ""); uni.setStorageSync('pkCountry', '')
uni.setStorageSync("showInfo", 0); uni.setStorageSync('showInfo', 0)
this.$store.dispatch("LogOut"); this.$store.dispatch('LogOut')
uni.reLaunch({ uni.reLaunch({
url: "/pages/login/index", url: '/pages/login/index',
}); })
}, },
surePsw() { surePsw() {
min min
.checkPwd({ .checkPwd({
pwd: this.password, pwd: this.password,
}) })
.then((res) => { .then(res => {
if (res.code == 200) { if (res.code == 200) {
this.password = ""; this.password = ''
this.pswShow = false; this.pswShow = false
uni.navigateTo({ uni.navigateTo({
url: "/pages/mine/balance/index", url: '/pages/mine/balance/index',
}); })
} else { } else {
uni.showToast({ uni.showToast({
title: res.msg, title: res.msg,
icon: "error", icon: 'error',
}); })
} }
}); })
}, },
goSpecialArea() { goSpecialArea() {
uni.switchTab({ uni.switchTab({
url: "/pages/specialArea/index", url: '/pages/specialArea/index',
}); })
}, },
}, },
}; }
</script> </script>
<style lang="scss" scoped> <style lang="scss" scoped>
@ -799,7 +790,7 @@ export default {
.highlight-name { .highlight-name {
font-size: 30rpx; /* 示例字号，您可以根据需要调整 */ font-size: 30rpx; /* 示例字号，您可以根据需要调整 */
font-weight: bold; font-weight: bold;
color: #005BAC; /* 示例颜色，您可以根据需要调整 */ color: #005bac; /* 示例颜色，您可以根据需要调整 */
padding: 0 8rpx; /* 增加一些内边距，使其更突出 */ padding: 0 8rpx; /* 增加一些内边距，使其更突出 */
margin-right: 10rpx; /* 在名称和下一个标签之间添加间距 */ margin-right: 10rpx; /* 在名称和下一个标签之间添加间距 */
} }
@ -807,7 +798,7 @@ export default {
.highlight-pv { .highlight-pv {
font-size: 30rpx; /* 示例字号，您可以根据需要调整 */ font-size: 30rpx; /* 示例字号，您可以根据需要调整 */
font-weight: bold; font-weight: bold;
color: #FF5722; /* 示例颜色，您可以根据需要调整 */ color: #ff5722; /* 示例颜色，您可以根据需要调整 */
padding: 0 8rpx; /* 增加一些内边距，使其更突出 */ padding: 0 8rpx; /* 增加一些内边距，使其更突出 */
} }
@ -844,7 +835,7 @@ export default {
} }
.ju_text2 { .ju_text2 {
color: #005BAC; color: #005bac;
font-weight: bold; font-weight: bold;
font-size: 16px; font-size: 16px;
padding: 0 6rpx; padding: 0 6rpx;
@ -860,20 +851,16 @@ export default {
margin: 10rpx; margin: 10rpx;
// margin-top: 23rpx; // margin-top: 23rpx;
position: relative; position: relative;
} }
.ju_left_bottom1 { .ju_left_bottom1 {
// width: 100%; // width: 100%;
flex: 1; flex: 1;
height: 34rpx; height: 34rpx;
background: #FFB74D; background: #ffb74d;
border-radius: 20rpx; border-radius: 20rpx;
margin: 10rpx; margin: 10rpx;
// margin-top: 23rpx; // margin-top: 23rpx;
position: relative; position: relative;
} }
// .current-schedule1 { // .current-schedule1 {
// position: absolute; // position: absolute;
@ -899,7 +886,7 @@ export default {
.current-progress { .current-progress {
position: absolute; position: absolute;
width: 30%; width: 30%;
background: #3385D6; background: #3385d6;
height: 34rpx; height: 34rpx;
border-radius: 20px; border-radius: 20px;
} }
@ -911,7 +898,6 @@ export default {
transform: translate(0%, -55%); transform: translate(0%, -55%);
white-space: nowrap; white-space: nowrap;
text-align: center; text-align: center;
} }
.yestDay { .yestDay {
display: flex; display: flex;
@ -951,13 +937,17 @@ export default {
.thetitle { .thetitle {
font-size: 28rpx; font-size: 28rpx;
font-family: PingFangSC-Semibold, PingFang SC; font-family:
PingFangSC-Semibold,
PingFang SC;
font-weight: 600; font-weight: 600;
color: #333333; color: #333333;
} }
.findallorder { .findallorder {
font-family: PingFangSC-Regular, PingFang SC; font-family:
PingFangSC-Regular,
PingFang SC;
color: #999999; color: #999999;
font-size: 16rpx; font-size: 16rpx;
display: flex; display: flex;
@ -989,7 +979,9 @@ export default {
.order_text { .order_text {
margin-top: 15rpx; margin-top: 15rpx;
font-size: 20rpx; font-size: 20rpx;
font-family: PingFangSC-Semibold, PingFang SC; font-family:
PingFangSC-Semibold,
PingFang SC;
font-weight: 600; font-weight: 600;
color: #333333; color: #333333;
} }
@ -1003,7 +995,9 @@ export default {
.order_text2 { .order_text2 {
font-size: 28rpx; font-size: 28rpx;
font-family: PingFangSC-Regular, PingFang SC; font-family:
PingFangSC-Regular,
PingFang SC;
font-weight: 400; font-weight: 400;
color: #333333; color: #333333;
} }
@ -1063,7 +1057,7 @@ export default {
font-size: 24rpx; font-size: 24rpx;
background-image: linear-gradient( background-image: linear-gradient(
to bottom, to bottom,
#005BAC 5%, #005bac 5%,
#f2f2f2 50% #f2f2f2 50%
); // background-position: top; ); // background-position: top;
@ -1140,7 +1134,7 @@ export default {
display: flex; display: flex;
align-items: center; align-items: center;
font-size: 12px; font-size: 12px;
color: #005BAC; color: #005bac;
font-weight: 400; font-weight: 400;
// margin-left: 20rpx; // margin-left: 20rpx;
.gra_left1 { .gra_left1 {
@ -1270,7 +1264,7 @@ export default {
top: 0; top: 0;
height: 100%; height: 100%;
border-radius: 20rpx; border-radius: 20rpx;
background: linear-gradient(135deg, #ED9A38 0%, #FDD05F 50%, #E68A2E 100%); background: linear-gradient(135deg, #ed9a38 0%, #fdd05f 50%, #e68a2e 100%);
transition: width 0.6s ease-in-out; transition: width 0.6s ease-in-out;
box-shadow: none; box-shadow: none;
overflow: hidden; overflow: hidden;
@ -1323,14 +1317,14 @@ export default {
.sprint-progress-text .award-name { .sprint-progress-text .award-name {
font-weight: bold; font-weight: bold;
color: #005BAC; color: #005bac;
font-size: 26rpx; font-size: 26rpx;
padding: 0 4rpx; padding: 0 4rpx;
} }
.sprint-progress-text .award-amount { .sprint-progress-text .award-amount {
font-weight: bold; font-weight: bold;
color: #D9534F; color: #d9534f;
font-size: 24rpx; font-size: 24rpx;
padding: 0 4rpx; padding: 0 4rpx;
} }

2
pages/mine/order/index.vue
View File

@ -102,7 +102,7 @@
@click="openWl(item)" @click="openWl(item)"
shape="circle" shape="circle"
:text="'查看物流'" :text="'查看物流'"
color="#E03030" color="#005BAC"
></u-button> ></u-button>
</view> </view>
</view> </view>

322
pages/mine/order/wl.vue
View File

@ -1,35 +1,64 @@
<template> <template>
<view class="content"> <view class="content">
<view v-for="(item, index) in wlData" <!-- 选项卡区域 - 移到外层 -->
:key="index"> <view class="tab-container" v-if="wlData.length > 0">
<view class="tab"> <view
<view @click="isClick = index" v-for="(item, index) in wlData"
class="tab_i"> :key="index"
<view>{{'快递包裹'}}{{index+1 }}</view> @click="isClick = index"
<view :class="[isClick===index?'heng':'heng1']"> class="tab-item"
:class="{ active: isClick === index }"
>
<view class="tab-text">快递包裹{{ index + 1 }}</view>
<view class="tab-underline" :class="{ show: isClick === index }"></view>
</view> </view>
</view> </view>
<!-- 分隔区域 -->
<view class="separator"></view>
<!-- 当前选中的物流信息 -->
<view v-if="wlData.length > 0 && wlData[isClick]">
<!-- 物流信息头部 -->
<view class="logistics-header">
<view class="logistics-info">
<image src="@/static/images/wl.png" class="logistics-icon" />
<view class="logistics-details">
<view class="company-name"
>物流公司：{{ wlData[isClick].expressName }}</view
>
<view class="tracking-number"
>物流单号：{{ wlData[isClick].expressCode }}</view
>
</view> </view>
<view class="hui"></view>
<view class="head_t">
<view class="disflex">
<img src="@/static/images/wl.png"
alt="">
<view>{{ item.expressName }}{{'快递包裹'}} {{ item.expressCode }}</view>
</view> </view>
<view @click="onCopy(item.expressCode)">{{'复制'}}</view> <view class="copy-btn" @click="onCopy(wlData[isClick].expressCode)"
>复制</view
>
</view> </view>
<view class="wl_tree"
v-for="ctem,cndex in item.detailList" <!-- 物流轨迹时间线 -->
:key="cndex"> <view class="timeline-container">
<view class="zhong"> <view
<view :class="cndex==0?'red1':'qiu'"></view> class="timeline-item"
<view class="gun"></view> v-for="(ctem, cndex) in wlData[isClick].detailList"
:key="cndex"
>
<view class="timeline-left">
<view class="timeline-dot" :class="{ active: cndex === 0 }"></view>
<view
class="timeline-line"
v-if="cndex < wlData[isClick].detailList.length - 1"
></view>
</view>
<view class="timeline-content">
<view class="timeline-time" :class="{ active: cndex === 0 }">{{
ctem.time
}}</view>
<view class="timeline-desc" :class="{ active: cndex === 0 }">{{
ctem.context
}}</view>
</view> </view>
<view class="tree_r">
<view :class="cndex==0?'red2':'tree_t'">{{ ctem.time }}</view>
<view :class="cndex==0?'red3':'tree_t'">{{ ctem.context }}</view>
</view> </view>
</view> </view>
</view> </view>
@ -52,7 +81,7 @@ export default {
onShow() {}, onShow() {},
methods: { methods: {
openWl(id) { openWl(id) {
api.expressList(id).then((res) => { api.expressList(id).then(res => {
if (res.code == 200) { if (res.code == 200) {
this.wlData = res.data this.wlData = res.data
} }
@ -60,7 +89,7 @@ export default {
}, },
onCopy(code) { onCopy(code) {
let text = code + '' let text = code + ''
this.$copyText(text).then((res) => { this.$copyText(text).then(res => {
uni.showToast({ uni.showToast({
title: '复制成功', title: '复制成功',
icon: 'none', icon: 'none',
@ -72,109 +101,202 @@ export default {
</script> </script>
<style lang="scss" scoped> <style lang="scss" scoped>
.tab { .content {
display: flex; background-color: #f5f5f5;
align-items: center; min-height: 100vh;
justify-content: space-between;
padding: 0 24rpx;
margin-top: 20rpx;
margin-bottom: 6rpx;
} }
.tab_i {
// width: 120rpx; /* 选项卡样式 */
.tab-container {
display: flex;
background: #ffffff;
padding: 20rpx 40rpx 0;
}
.tab-item {
flex: 1;
text-align: center; text-align: center;
padding-bottom: 20rpx;
cursor: pointer;
}
.tab-text {
font-size: 28rpx; font-size: 28rpx;
font-family: PingFang SC; color: #999999;
font-weight: 400; font-weight: 400;
margin-bottom: 8rpx;
}
.tab-item.active .tab-text {
color: #333333; color: #333333;
// margin-right: 28rpx; font-weight: 500;
white-space: nowrap;
display: flex;
flex-direction: column;
align-items: center;
} }
.heng {
width: 24px; .tab-underline {
height: 2px; height: 4rpx;
background: #ed1d25; background: transparent;
border-radius: 1px 1px 1px 1px; margin: 0 auto;
margin-top: 4rpx; width: 60rpx;
border-radius: 2rpx;
transition: all 0.3s ease;
} }
.heng1 {
width: 24px; .tab-underline.show {
height: 2px; background: #005bac;
background: #fff;
border-radius: 1px 1px 1px 1px;
margin-top: 4rpx;
} }
.hui {
height: 24rpx; /* 分隔区域 */
background: #eee; .separator {
height: 20rpx;
background: #f5f5f5;
} }
.head_t {
/* 物流信息头部 */
.logistics-header {
background: #ffffff;
padding: 30rpx 40rpx;
display: flex; display: flex;
align-items: center; align-items: center;
justify-content: space-between; justify-content: space-between;
font-size: 12px; border-bottom: 1rpx solid #eeeeee;
font-family: PingFang SC-Regular, PingFang SC;
font-weight: 400;
color: #666666;
border-bottom: 1px solid #ccc;
margin: 0 20rpx;
padding: 20rpx;
margin-bottom: 40rpx;
img {
width: 44px;
height: 44px;
margin-right: 10px;
} }
}
.disflex { .logistics-info {
display: flex; display: flex;
align-items: center; align-items: center;
flex: 1;
} }
.wl_tree {
.logistics-icon {
width: 88rpx;
height: 88rpx;
margin-right: 20rpx;
border-radius: 50%;
}
.logistics-details {
flex: 1;
}
.company-name {
font-size: 28rpx;
color: #333333;
font-weight: 500;
margin-bottom: 8rpx;
}
.tracking-number {
font-size: 24rpx;
color: #666666;
font-weight: 400;
}
.copy-btn {
padding: 12rpx 24rpx;
background: #f8f8f8;
border: 1rpx solid #e6e6e6;
border-radius: 8rpx;
font-size: 24rpx;
color: #666666;
cursor: pointer;
}
.copy-btn:active {
background: #eeeeee;
}
/* 时间线样式 */
.timeline-container {
background: #ffffff;
padding: 0 40rpx 40rpx;
}
.timeline-item {
display: flex; display: flex;
padding-right: 40rpx; position: relative;
.zhong { padding: 30rpx 0;
// flex: 1; }
margin: 0 20px;
.timeline-left {
display: flex; display: flex;
flex-direction: column; flex-direction: column;
align-items: center; align-items: center;
.qiu { margin-right: 30rpx;
width: 10px; position: relative;
height: 10px; }
.timeline-dot {
width: 20rpx;
height: 20rpx;
border-radius: 50%;
background: #cccccc; background: #cccccc;
border-radius: 50%; position: relative;
// margin: 10px 0; z-index: 2;
// margin: 3px 0 10px 0;
} }
.gun {
background: #ccc; .timeline-dot.active {
width: 1px; background: #ff4757;
min-height: 110px; width: 24rpx;
height: 24rpx;
} }
.timeline-line {
width: 2rpx;
background: #eeeeee;
position: absolute;
top: 24rpx;
bottom: -30rpx;
left: 50%;
transform: translateX(-50%);
z-index: 1;
} }
.tree_r {
// width: 60%; .timeline-content {
flex: 1;
padding-top: 2rpx;
}
.timeline-time {
font-size: 24rpx; font-size: 24rpx;
color: #999; color: #999999;
.tree_t { margin-bottom: 8rpx;
color: #999; font-weight: 400;
} }
.timeline-time.active {
color: #ff4757;
font-weight: 500;
} }
.timeline-desc {
font-size: 28rpx;
color: #666666;
line-height: 1.5;
font-weight: 400;
} }
.red1 {
width: 10px; .timeline-desc.active {
height: 10px; color: #333333;
background: #005BAC; font-weight: 500;
border-radius: 50%;
}
.red2 {
color: #005BAC;
} }
/* 移除旧样式 */
.tab,
.tab_i,
.heng,
.heng1,
.hui,
.head_t,
.disflex,
.wl_tree,
.zhong,
.qiu,
.gun,
.tree_r,
.tree_t,
.red1,
.red2,
.red3 { .red3 {
color: #333; display: none;
} }
</style> </style>