完善订单模块
This commit is contained in:
@ -1,148 +1,165 @@
|
||||
<template>
|
||||
<view>
|
||||
<view class="u-p-t-20 u-p-b-20 ">
|
||||
<view>
|
||||
<mescroll-body ref="mescroll" @init="mescrollInit" @down="downCallback" :up="upOption" @up="upCallback">
|
||||
<navigator
|
||||
class="br16 px20 u-m-b-24"
|
||||
hover-class="none"
|
||||
url="/pages/order_details/order_details?type=0"
|
||||
v-for="(item, index ) in orderList" :key="index">
|
||||
<order-goods :list="item.order_goods"
|
||||
:order_type="item.order_type"
|
||||
:imageRadius="12"
|
||||
:orderDesc="item.order_status_desc"
|
||||
:orderCancleTime="item.order_cancle_time"
|
||||
@refresh="orderRefresh"></order-goods>
|
||||
<!-- <view class="row-between">
|
||||
<view>{{ item. }}</view>
|
||||
<view class="text-999">待付款</view> -->
|
||||
<!-- <view class="text-999">已完成</view>
|
||||
<view class="text-999">退款</view>
|
||||
<view class="primary" >未制作</view>
|
||||
<view class="primary" >未取餐</view> -->
|
||||
<!-- </view>
|
||||
<view class="u-m-t-16 row">
|
||||
<view>
|
||||
<u-image :src="cloudPath + 'img/banner.png'" width="124" height="124" border-radius="16"></u-image>
|
||||
</view>
|
||||
<view class="sm ml20 text-999">
|
||||
<view>下单时间:2024-10-10 16:58:53</view>
|
||||
<view>预计时间:2025-10-10 16:58:54</view>
|
||||
<view>数量:1</view>
|
||||
<view>实付:￥0.00</view>
|
||||
</view>
|
||||
</view>
|
||||
<view class="u-m-t-26 u-m-b-26">
|
||||
<u-line color="#EEE" />
|
||||
</view> -->
|
||||
</navigator>
|
||||
</mescroll-body>
|
||||
</view>
|
||||
<!-- <view class="u-m-t-26 row-between">
|
||||
<view class="primary">等待时间:15分钟</view> -->
|
||||
<!-- <view class="row">
|
||||
<view class="u-m-r-16">
|
||||
<u-button @click="cancleOrder" hover-class="none" :customStyle="{width: '164rpx', height: '60rpx', color: '#999', border: '1px solid #DDD'}" :plain="true" :hair-line="false" shape="circle">取消订单</u-button>
|
||||
<mescroll-uni ref="mescroll" top="100rpx" @init="mescrollInit" @down="downCallback" :down="downOption" :up="upOption" @up="upCallback">
|
||||
<view class="u-p-20">
|
||||
<navigator class="bg-white br16 px20 u-m-b-24 u-p-b-20" hover-class="none"
|
||||
v-for="(item, index) in orderList"
|
||||
:key="index"
|
||||
:url="'/pages/order_details/order_details?id=' + item.id">
|
||||
<order-goods :list="item.order_goods" :order_type="item.order_type" :imageRadius="12"
|
||||
:orderDesc="item.order_status_desc"></order-goods>
|
||||
<view class="u-m-t-26 u-m-b-26 u-p-l-20 u-p-r-20">
|
||||
<u-line color="#EEE" />
|
||||
</view>
|
||||
<view class="u-m-t-26 row-between u-p-l-20 u-p-r-20">
|
||||
<view class="primary flex1">
|
||||
<view v-if="getCancelTime(item.order_cancel_time) > 0">
|
||||
<u-count-down separator="zh" :timestamp="getCancelTime(item.order_cancel_time)"
|
||||
separator-color="#FF2C3C" color="#FF2C3C" :separator-size="26" :font-size="26"
|
||||
bg-color="transparent" @end="orderRefresh"></u-count-down>
|
||||
</view>
|
||||
<!-- 这边还缺一个未制作等待的时间 -->
|
||||
<view class="primary" v-if="type === 'finish'">
|
||||
存餐格号:15号
|
||||
</view>
|
||||
</view>
|
||||
<view>
|
||||
<u-button @click="toPay" hover-class="none" :customStyle="{width: '164rpx', height: '60rpx', backgroundColor: themeColor, color: '#fff', border: 'none'}" :hair-line="false" shape="circle">去付款</u-button>
|
||||
</view> -->
|
||||
<!-- <view>
|
||||
<u-button @click="seeDetails" hover-class="none" :customStyle="{width: '164rpx', height: '60rpx', backgroundColor: themeColor, color: '#fff', border: 'none'}" :hair-line="false" shape="circle">查看详情</u-button>
|
||||
<view class="row">
|
||||
<view class="u-m-r-16" v-if="item.cancel_btn">
|
||||
<u-button @click="cancelOrder(item.id)" hover-class="none"
|
||||
:customStyle="{ width: '164rpx', height: '60rpx', color: '#999', border: '1px solid #DDD' }"
|
||||
:plain="true" :hair-line="false" shape="circle">取消订单</u-button>
|
||||
</view>
|
||||
<view v-if="item.pay_btn">
|
||||
<u-button @click="payNow(item.id)" hover-class="none"
|
||||
:customStyle="{ width: '164rpx', height: '60rpx', backgroundColor: themeColor, color: '#fff', border: 'none' }"
|
||||
:hair-line="false" shape="circle">去付款</u-button>
|
||||
</view>
|
||||
<view v-if="type === 'delivery' || type === 'finish'">
|
||||
<u-button @click="seeDetails" hover-class="none" :customStyle="{width: '164rpx', height: '60rpx', backgroundColor: themeColor, color: '#fff', border: 'none'}" :hair-line="false" shape="circle">查看详情</u-button>
|
||||
</view>
|
||||
<!-- <view>
|
||||
<u-button @click="toRefund" hover-class="none" :customStyle="{width: '164rpx', height: '60rpx', backgroundColor: themeColor, color: '#fff', border: 'none'}" :hair-line="false" shape="circle">申请退款</u-button>
|
||||
</view> -->
|
||||
</view>
|
||||
<view>
|
||||
<u-button @click="toRefund" hover-class="none" :customStyle="{width: '164rpx', height: '60rpx', backgroundColor: themeColor, color: '#fff', border: 'none'}" :hair-line="false" shape="circle">查看详情</u-button>
|
||||
</view> -->
|
||||
<!-- </view>
|
||||
</view> -->
|
||||
</view>
|
||||
</navigator>
|
||||
<order-dialog ref="orderDialog" :order-id="orderId" :type="orderType" @refresh="reflesh"></order-dialog>
|
||||
</view>
|
||||
</view>
|
||||
</mescroll-uni>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import {
|
||||
getOrderList,
|
||||
cancelOrder,
|
||||
delOrder,
|
||||
confirmOrder,
|
||||
completeAudit
|
||||
} from '@/api/order'
|
||||
import MescrollMixin from "@/components/mescroll-uni/mescroll-mixins.js"
|
||||
import {
|
||||
getOrderList,
|
||||
cancelOrder,
|
||||
delOrder,
|
||||
confirmOrder,
|
||||
completeAudit
|
||||
} from '@/api/order'
|
||||
import MescrollMixin from "@/components/mescroll-uni/mescroll-mixins.js"
|
||||
|
||||
export default {
|
||||
name: 'order-list',
|
||||
mixins: [MescrollMixin],
|
||||
props: {
|
||||
type: {
|
||||
type: String,
|
||||
default: 'all'
|
||||
}
|
||||
},
|
||||
data() {
|
||||
return {
|
||||
orderList: [],
|
||||
upOption:{
|
||||
noMoreSize: 4,
|
||||
empty:{
|
||||
tip: '~ 空空如也 ~', // 提示
|
||||
btnText: ''
|
||||
},
|
||||
textNoMore: '没有更多了'
|
||||
export default {
|
||||
name: 'order-list',
|
||||
mixins: [MescrollMixin],
|
||||
props: {
|
||||
type: {
|
||||
type: String,
|
||||
default: 'all'
|
||||
}
|
||||
},
|
||||
data() {
|
||||
return {
|
||||
orderList: [],
|
||||
downOption: {
|
||||
auto: false
|
||||
},
|
||||
upOption: {
|
||||
noMoreSize: 4,
|
||||
empty: {
|
||||
tip: '~ 空空如也 ~', // 提示
|
||||
btnText: '',
|
||||
fixed: true
|
||||
},
|
||||
}
|
||||
textNoMore: '没有更多了'
|
||||
},
|
||||
orderId: "",
|
||||
pay_way: "",
|
||||
showCancel: false,
|
||||
orderType: 0
|
||||
}
|
||||
},
|
||||
created() {
|
||||
},
|
||||
methods: {
|
||||
// 初始化数据
|
||||
upCallback(page) {
|
||||
let pageNum = page.num // 页码, 默认从1开始
|
||||
let pageSize = page.size // 页长, 默认每页10条
|
||||
let { type } = this
|
||||
getOrderList({
|
||||
page_size: pageSize,
|
||||
page_no: pageNum,
|
||||
type
|
||||
}).then(({
|
||||
data
|
||||
}) => {
|
||||
let curPageData = data.list;
|
||||
let curPageLen = curPageData.length;
|
||||
let hasNext = !!data.more;
|
||||
if (page.num == 1) this.orderList = [];
|
||||
this.orderList = this.orderList.concat(curPageData);
|
||||
this.mescroll.endSuccess(curPageLen, hasNext);
|
||||
})
|
||||
},
|
||||
created() {
|
||||
|
||||
orderRefresh() {
|
||||
this.mescroll.resetUpScroll()
|
||||
},
|
||||
methods: {
|
||||
// 初始化数据
|
||||
upCallback(page) {
|
||||
let pageNum = page.num // 页码, 默认从1开始
|
||||
let pageSize = page.size // 页长, 默认每页10条
|
||||
let {type} = this
|
||||
getOrderList({
|
||||
page_size: pageSize,
|
||||
page_no: pageNum,
|
||||
type
|
||||
}).then(({
|
||||
data
|
||||
}) => {
|
||||
let curPageData = data.list;
|
||||
let curPageLen = curPageData.length;
|
||||
let hasNext = !!data.more;
|
||||
if (page.num == 1) this.orderList = [];
|
||||
this.orderList = this.orderList.concat(curPageData);
|
||||
this.mescroll.endSuccess(curPageLen, hasNext);
|
||||
})
|
||||
},
|
||||
|
||||
orderRefresh() {
|
||||
this.mescroll.resetUpScroll()
|
||||
},
|
||||
cancelOrder(id) {
|
||||
this.orderId = id;
|
||||
this.orderType = 0;
|
||||
this.$nextTick(() => {
|
||||
this.orderDialog();
|
||||
});
|
||||
},
|
||||
|
||||
// 取消订单
|
||||
cancleOrder() {
|
||||
|
||||
},
|
||||
|
||||
// 去付款
|
||||
toPay() {
|
||||
|
||||
},
|
||||
|
||||
// 查看详情
|
||||
seeDetails() {
|
||||
|
||||
},
|
||||
|
||||
// 申请退款
|
||||
toRefund() {
|
||||
|
||||
}
|
||||
payNow(id) {
|
||||
uni.navigateTo({
|
||||
url: `/pages/payment/payment?from=${"order"}&order_id=${id}`,
|
||||
});
|
||||
},
|
||||
|
||||
reflesh() {
|
||||
this.mescroll.resetUpScroll()
|
||||
},
|
||||
|
||||
orderDialog() {
|
||||
this.$refs.orderDialog.open();
|
||||
},
|
||||
|
||||
// 查看详情
|
||||
seeDetails() {
|
||||
|
||||
},
|
||||
|
||||
// 申请退款
|
||||
toRefund() {
|
||||
|
||||
}
|
||||
},
|
||||
computed: {
|
||||
getCancelTime() {
|
||||
return (time) => time - Date.now() / 1000;
|
||||
},
|
||||
},
|
||||
|
||||
watch: {
|
||||
type() {
|
||||
this.mescroll.resetUpScroll()
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style lang="scss">
|
||||
|
||||
</style>
|
||||
Reference in New Issue
Block a user