root
/
school_uni
1
0
Fork 0
Code Issues Pull Requests Projects Releases Wiki Activity
Browse Source

11

master
wangfukang 2 weeks ago
parent
b4e1a3405a
commit
195c32873b
1 changed files with 146 additions and 52 deletions
Whitespace
Show all changes Ignore whitespace when comparing lines Ignore changes in amount of whitespace Ignore changes in whitespace at EOL
Split View
Diff Options
Show Stats Download Patch File Download Diff File
  1. 198
      package1/order/orderList.vue

198
package1/order/orderList.vue
View File

@ -50,80 +50,75 @@
全部</view>
<view class="tabs2" @tap="checkTabs2('daifu')"
:style="{'background':tab2Checked=='daifu'?'rgba(166, 255, 234, 1)':'#F5F5F5','color':tab2Checked=='daifu'?'#000':'#777'}">
待付款</view>
待支付</view>
<view class="tabs2" @tap="checkTabs2('daifu')"
:style="{'background':tab2Checked=='daifu'?'rgba(166, 255, 234, 1)':'#F5F5F5','color':tab2Checked=='daifu'?'#000':'#777'}">
待成团</view>
<view class="tabs2" @tap="checkTabs2('daishou')"
:style="{'background':tab2Checked=='daishou'?'rgba(166, 255, 234, 1)':'#F5F5F5','color':tab2Checked=='daishou'?'#000':'#777'}">
待消费</view>
<view class="tabs2" @tap="checkTabs2('daifu')"
:style="{'background':tab2Checked=='daifu'?'rgba(166, 255, 234, 1)':'#F5F5F5','color':tab2Checked=='daifu'?'#000':'#777'}">
待接单</view>
<view class="tabs2" @tap="checkTabs2('daifa')"
:style="{'background':tab2Checked=='daifa'?'rgba(166, 255, 234, 1)':'#F5F5F5','color':tab2Checked=='daifa'?'#000':'#777'}">
待发货</view>
待取货</view>
<view class="tabs2" @tap="checkTabs2('daishou')"
:style="{'background':tab2Checked=='daishou'?'rgba(166, 255, 234, 1)':'#F5F5F5','color':tab2Checked=='daishou'?'#000':'#777'}">
待送达</view>
<view class="tabs2" @tap="checkTabs2('daishou')"
:style="{'background':tab2Checked=='daishou'?'rgba(166, 255, 234, 1)':'#F5F5F5','color':tab2Checked=='daishou'?'#000':'#777'}">
已完成</view>
<view class="tabs2" @tap="checkTabs2('daishou')"
:style="{'background':tab2Checked=='daishou'?'rgba(166, 255, 234, 1)':'#F5F5F5','color':tab2Checked=='daishou'?'#000':'#777'}">
待收货</view>
<view class="tabs2" @tap="checkTabs2('daiping')"
:style="{'background':tab2Checked=='daiping'?'rgba(166, 255, 234, 1)':'#F5F5F5','color':tab2Checked=='daiping'?'#000':'#777'}">
待评价</view>
待商家同意退款</view>
<view class="tabs2" @tap="checkTabs2('daishou')"
:style="{'background':tab2Checked=='daishou'?'rgba(166, 255, 234, 1)':'#F5F5F5','color':tab2Checked=='daishou'?'#000':'#777'}">
已退款</view>
<view class="tabs2" @tap="checkTabs2('guanbi')"
:style="{'background':tab2Checked=='guanbi'?'rgba(166, 255, 234, 1)':'#F5F5F5','color':tab2Checked=='guanbi'?'#000':'#777'}">
已关闭</view>
已取消</view>
</view>
</view>
<view class="content">
<view class="box1" v-for="(item,index) in orderList" :key="index">
<view class="ziqu-xuanfu" style="background:red">
<view class="ziqu-xuanfu" v-if="item.status == 0" style="background:red">
待支付
</view>
<!-- <view class="ziqu-xuanfu" style="background:rgba(166, 255, 234, 1)">
待商家接单
<view class="ziqu-xuanfu" v-if="item.status == 10" style="background:rgba(166, 255, 234, 1)">
待成团
</view>
<view class="ziqu-xuanfu" style="background:rgba(166, 255, 234, 1)">
<view class="ziqu-xuanfu" v-if="item.status == 2" style="background:rgba(166, 255, 234, 1)">
待骑手接单
</view>
<view class="ziqu-xuanfu" style="background:rgba(166, 255, 234, 1)">
待配送
<view class="ziqu-xuanfu" v-if="item.status == 3 && item.deliveryType == 1" style="background:rgba(166, 255, 234, 1)">
待取货
</view>
<view class="ziqu-xuanfu" v-if="item.status == 3 && item.deliveryType == 2" style="background:rgba(166, 255, 234, 1)">
待消费
</view>
<view class="ziqu-xuanfu" style="background:rgba(255, 193, 236, 1)">
配送中
<view class="ziqu-xuanfu" v-if="item.status == 4" style="background:rgba(255, 193, 236, 1)">
待送达
</view>
<view class="ziqu-xuanfu">
已送达
<view class="ziqu-xuanfu" v-if="item.status == 5">
已完成
</view>
<view class="ziqu-xuanfu">
<view class="ziqu-xuanfu" v-if="item.status == 6">
已取消
</view>
<view class="ziqu-xuanfu">
已完成
<view class="ziqu-xuanfu" v-if="item.status == 7">
待商家同意退款
</view>
<view class="ziqu-xuanfu" v-if="item.status == 8">
已退款
</view>
<view class="ziqu-xuanfu">
待评价
</view> -->
<view style="width: 100%;line-height: 70rpx;font-size: 28rpx;font-weight: 700;display: flex;">
<view style="height: 40rpx;line-height: 40rpx;background: linear-gradient(90deg, rgba(255, 77, 0, 1), rgba(255, 184, 84, 1));padding: 0 16rpx;border-radius: 40rpx;color: #fff;margin: 14rpx 20rpx 0 0;">
{{tab1Checked == 'paotui'?'跑腿':tab1Checked == 'ershou'?'二手':tab1Checked == 'fantuan'?'饭团':"订单"}}
{{item.orderType == 4 ? '快递' : item.orderType == 5 ? '跑腿' : item.orderType == 6 ? '二手':"饭团"}}
</view>
{{tab1Checked == 'paotui'?'跑腿帮送':tab1Checked == 'ershou'?'二手物品':tab1Checked == 'fantuan'?'竹仔园牛仔农庄(第六分店)':"订单详情"}}
{{item.orderType == 4 ? '快递代取' : item.orderType == 5 ? '跑腿帮送' : item.orderType == 6 ? '二手物品': item.shopName}}
</view>
<view v-if="tab1Checked != 'paotui'" style="display: flex;padding: 20rpx;background: #F5F5F5;border-radius: 20rpx;">
<view class="goods-img">
<img src="/static/images/img/shangpintu.png" alt="">
</view>
<view class="goods-content">
<view class="goods-name">
牛仔农庄(医专店)
</view>
<view class="goods-content-center">
<view>
打分；不要啦
</view>
</view>
<view class="goods-content-bottom">
<view style="width: 45%;">
X1
</view>
<view class="pintuan-left-price">
￥90.00
</view>
</view>
</view>
</view>
<view v-else style="display: flex;padding: 20rpx;background: #F5F5F5;border-radius: 20rpx;">
<view v-if="item.orderType == 4 || item.orderType == 5" style="display: flex;padding: 20rpx;background: #F5F5F5;border-radius: 20rpx;">
<view class="goods-img">
<img src="https://jewel-shop.oss-cn-beijing.aliyuncs.com/4130b6a412584c71949b3a03e5834453.png" alt="">
<view class="jiaobiao">
@ -147,9 +142,32 @@
</view>
</view>
</view>
<view v-else style="display: flex;padding: 20rpx;background: #F5F5F5;border-radius: 20rpx;" v-for="(item1,index1) in item.goodsList" :key="index1" v-if="item.goodsList != null && item.goodsList.length > 0">
<view class="goods-img">
<img :src="item1.productPicture" alt="">
</view>
<view class="goods-content">
<view class="goods-name">
{{item1.productName}}
</view>
<view class="goods-content-center">
<view>
{{item1.specs == null ? '' : item1.specs}}
</view>
</view>
<view class="goods-content-bottom">
<view style="width: 45%;">
X{{item1.quantity}}
</view>
<view class="pintuan-left-price">
￥{{item1.price}}
</view>
</view>
</view>
</view>
<view style="height: 100rpx;border-bottom: 1px solid #F5F5F5;display: flex;line-height: 100rpx;">
<view style="flex: 1;color: #777;">
待支付 <text style="font-size: 32rpx;color: red;font-weight: 700;">23:59:23</text>
<view style="flex: 1;color: #777;" v-if="item.status == 0">
待支付 <text style="font-size: 32rpx;color: red;font-weight: 700;">{{ formatTime(item.timeLeft) }}</text>
</view>
<view style="font-size: 24rpx;font-weight: 700;">
实付<text v-if="tab1Checked == 'fantuan'" style="font-size: 20rpx;color: #777;">（含包装/配送费）</text> <text
@ -160,7 +178,7 @@
<view class="btn1">
取消订单
</view>
<view class="btn1"
<view class="btn1" v-
style="background: linear-gradient(90deg, rgba(227, 255, 150, 1), rgba(166, 255, 234, 1));color: #000;">
去支付
</view>
@ -189,10 +207,12 @@
tab2Checked: 'quanbu',
totalPages: 1,
pageNum:1,
timer: null,
orderList:[],
searchForm:{
pageNum:1,
pageSize:10,
searchType:0,
userId:uni.getStorageSync('id'),
regionId:JSON.parse(uni.getStorageSync('area')).id
},
@ -207,13 +227,85 @@
},
onLoad(option) {
this.getOrderList()
this.startGlobalTimer()
},
onUnload() {
// 页面卸载清除定时器
if (this.timer) clearInterval(this.timer)
},
onShow() {
this.menuButtonInfo = uni.getMenuButtonBoundingClientRect()
},
methods: {
// 1. 开启全局定时器
startGlobalTimer() {
// 立即执行一次，避免等待1秒才显示
this.updateCountdown()
this.timer = setInterval(() => {
this.updateCountdown()
}, 1000)
},
// 2. 核心逻辑：计算每条数据的剩余时间
updateCountdown() {
const now = new Date().getTime()
this.orderList.forEach(item => {
const reg = /(\d{4})-(\d{2})-(\d{2})T(\d{2}):(\d{2}):(\d{2})/
const match = item.createTime.match(reg)
if (match) {
// 2. 手动构造时间 (注意：月份要减 1，因为 JS 月份是 0-11)
// 这种写法在 iOS 上绝对不会报错
let targetTime = new Date(
parseInt(match[1]), // 年
parseInt(match[2]) - 1, // 月 (记得减1)
parseInt(match[3]), // 日
parseInt(match[4]), // 时
parseInt(match[5]), // 分
parseInt(match[6]) // 秒
).getTime()
// 3. 加上 1 小时
targetTime = targetTime + (60 * 60 * 1000)
// 4. 计算差值
const diff = targetTime - new Date().getTime()
// 如果时间已过期，设为0
item.timeLeft = diff > 0 ? diff : 0
}
})
},
// 3. 格式化时间 (毫秒 -> 天时分秒)
formatTime(ms) {
const second = Math.floor(ms / 1000)
const day = Math.floor(second / 86400)
const hour = Math.floor((second % 86400) / 3600)
const minute = Math.floor((second % 3600) / 60)
const sec = second % 60
// 补零操作
const pad = (n) => n < 10 ? '0' + n : n
// 根据需要返回格式，例如：1天 02时 05分 10秒
return `${day > 0 ? day + '天' : ''}${pad(hour)}时${pad(minute)}分${pad(sec)}秒`
},
checkTab1(type) {
this.tab1Checked = type
if(type == 'quanbu'){
this.searchForm.searchType = 0
}else if(type == 'fantuan'){
this.searchForm.searchType = 1
}else if(type == 'paotui'){
this.searchForm.searchType = 2
}else if(type == 'ershou'){
this.searchForm.searchType = 3
}
this.searchForm.pageNum = 1
this.getOrderList()
},
checkTabs2(type) {
this.tab2Checked = type
@ -229,6 +321,7 @@
} else {
that.orderList = [...that.orderList, ...res.result.records]
}
console.log(that.orderList)
that.totalPages = res.result.pages; // pages = 总页数
that.$forceUpdate();
} else {
@ -377,6 +470,7 @@
background: #fff;
border-radius: 20rpx;
padding: 20rpx;
position: relative;
}
.goods-img {

Write Preview
Loading…
Cancel
Save