<template>
|
<view class="order-wrap">
|
<view class="order-wrap-inside">
|
<view class="data-box">
|
<view>
|
<u-input
|
placeholder="请选择开始日期"
|
clearable
|
disabled
|
class="dataInput"
|
v-model="startTime"
|
:border="true"
|
@click="startShow = true" />
|
<u-picker
|
mode="time"
|
v-model="startShow"
|
:params="params"
|
:safe-area-inset-bottom = "true"
|
@confirm="startConfirmBtn"
|
@cancel="cancelBtn">
|
</u-picker>
|
</view>
|
<view class="xian">—</view>
|
<view>
|
<u-input
|
placeholder="请选择结束日期"
|
clearable
|
disabled
|
class="dataInput"
|
v-model="endTime"
|
:border="true"
|
@click="endShow = true" />
|
<u-picker
|
mode="time"
|
v-model="endShow"
|
:params="params"
|
:safe-area-inset-bottom = "true"
|
@confirm="endConfirmBtn"
|
@cancel="cancelBtn">
|
</u-picker>
|
</view>
|
<u-button @click="shaixuanBtn">筛选</u-button>
|
</view>
|
<view class="table-box">
|
<u-table>
|
<u-tr>
|
<u-th>配送时间</u-th>
|
<u-th>条数</u-th>
|
<u-th>操作</u-th>
|
</u-tr>
|
<u-tr v-if="tableList.length > 0" v-for="item in tableList" :key="item.id">
|
<u-td>{{item.sendDate}}</u-td>
|
<u-td>{{item.num}}条</u-td>
|
<u-td>
|
<u-button plain size="small" @click="gotoOrderDetail(item)">查看</u-button>
|
</u-td>
|
</u-tr>
|
<u-empty class="zanwuData" v-if="tableList.length == 0" text="暂无数据" mode="data"></u-empty>
|
</u-table>
|
</view>
|
</view>
|
<orderDetail v-if="orderDetailVisiable" ref="orderDetail" @refeshOrderDetail="refeshOrderDetail"></orderDetail>
|
</view>
|
</template>
|
|
<script>
|
export default {
|
provide(){
|
return {
|
orderId: this.passData
|
}
|
},
|
data() {
|
return {
|
passData: {
|
orderId:'',
|
},
|
tableList:[],
|
params: {
|
year: true,
|
month: true,
|
day: true,
|
hour: false,
|
minute: false,
|
second: false
|
},
|
startTime:'',
|
endTime:'',
|
// pageNumber:1,
|
pageSize:31,
|
startShow: false, //开始时间控件
|
endShow: false, //结束时间控件
|
orderDetailVisiable:false, //详情弹框
|
}
|
},
|
onShow() {
|
this.orderDetailVisiable = false //切换页面关闭弹框
|
this.getOrderList()
|
},
|
onPullDownRefresh() { //下拉刷新
|
this.getOrderList()
|
},
|
methods: {
|
refeshOrderDetail() {
|
this.orderDetailVisiable = false
|
this.getOrderList()
|
},
|
getOrderList() { //获取订单列表
|
let params = {
|
// pageNumber:this.pageNumber,
|
pageSize:this.pageSize,
|
customerId:this.$store.state.customerId,
|
endTime:this.endTime,
|
startTime:this.startTime
|
}
|
this.$u.api.getOrderList(params).then(res => {
|
if(res.code == 200) {
|
this.tableList = res.result
|
uni.stopPullDownRefresh() //停止下拉刷新
|
}
|
})
|
},
|
shaixuanBtn() { //点击筛选按钮
|
this.getOrderList()
|
},
|
startConfirmBtn(val) { //开始
|
console.log('val',val)
|
this.startTime = val.year + '-' + val.month + '-' + val.day
|
},
|
endConfirmBtn(val) { //结束
|
this.endTime = val.year + '-' +val.month + '-' +val.day
|
},
|
gotoOrderDetail(item) { //跳转详情页面
|
console.log('item1',item)
|
this.passData.orderId = item.id
|
console.log('this.passData.orderId===',this.passData.orderId)
|
this.orderDetailVisiable = true
|
this.$nextTick(() => {
|
this.$refs.orderDetail.init(item)
|
})
|
}
|
}
|
}
|
</script>
|
|
<style lang="scss" scoped>
|
/deep/ .u-table{
|
border-left:none!important;
|
}
|
/deep/ u-td:first-child {
|
border-left: solid 1px #e4e7ed;
|
}
|
.order-wrap-inside{
|
width: 100%;
|
padding: 32rpx;
|
box-sizing: border-box;
|
}
|
.orderDetail /deep/ .u-btn--default{
|
border:none;
|
color: #1F9F4C;
|
background-color: transparent;
|
}
|
.order-wrap-inside{
|
/deep/ .u-input{
|
width: 230rpx;
|
margin-right: 20rpx;
|
}
|
/deep/ .u-btn--default{
|
border:none;
|
color: #1F9F4C;
|
background-color: transparent;
|
}
|
/deep/ .u-size-default{
|
height: 64rpx!important;
|
line-height: 64rpx!important;
|
width: 136rpx;
|
color: #1F9F4C!important;
|
}
|
}
|
|
|
.table-box{
|
/deep/.u-btn--default{
|
color: none;
|
}
|
|
/deep/.u-hairline-border::after{
|
border:none!important;
|
border-style:none;
|
}
|
/deep/ .u-btn--default{
|
font-size: 28rpx;
|
}
|
/deep/ .u-th{
|
background-color: #1F9F4C;
|
color: #FFFFFF;
|
font-weight: light;
|
}
|
}
|
.data-box{
|
display: flex;
|
align-items: center;
|
|
}
|
.xian{
|
margin-right: 20rpx;
|
color: #CCCCCC;
|
}
|
.table-box{
|
margin-top: 40rpx;
|
}
|
.zanwuData{
|
margin-top: 80rpx;
|
}
|
</style>
|
