<template>
|
<view class="main_app">
|
<view class="head_wrap" @click="openModal">
|
<view class="search_box">
|
<image src="@/static/ic_search@2x.png" class="search" mode=""></image>
|
<!-- <input type="text" disabled placeholder-class="placeholder9" v-model="param.contractNumber" @confirm="handleQuery" /> -->
|
</view>
|
<view class="right">
|
<image src="@/static/ic_shaixuan@2x.png" mode=""></image>
|
<text>筛选</text>
|
</view>
|
</view>
|
<view @click="diaodu" class="head_title">分中心调度联系方式</view>
|
<!-- -->
|
<scroll-view scroll-y="true" class="scroll_Y" @scrolltolower="scrolltolower">
|
<view class="main_list">
|
<view class="item" v-for="item,index in list" :key="index">
|
<view class="head">
|
<view class="code">{{item.contractNumber}}</view>
|
<view class="status">{{item.orderStatusDesc }}</view>
|
</view>
|
<view class="content">
|
<view class="line">
|
<view class="la">发货地：</view>
|
<view class="val">{{item.fromRepertoty || item.deliveryEnterprise || '-'}}</view>
|
</view>
|
<view class="line">
|
<view class="la">到货地：</view>
|
<view class="val">{{item.toRepertoty || item.receiveEnterprise || '-'}}</view>
|
</view>
|
<view class="line">
|
<view class="la">车牌号：</view>
|
<view class="val">{{item.plateNumber || item.plateName || '-'}}</view>
|
</view>
|
</view>
|
<view class="footer">
|
<view class="time">{{item.ncCreateDate}}</view>
|
<view class="detail" @click="handleDetail(item)">查看详情</view>
|
</view>
|
</view>
|
<view v-if="list.length === 0" style="text-align: center">
|
<image src="@/static/empty.png" style="width: 320rpx; margin: 120px auto 0" mode="widthFix" />
|
<view class="placeholder9 fs24">暂无数据</view>
|
</view>
|
</view>
|
</scroll-view>
|
|
<!-- -->
|
<u-popup :show="showModal" round="12" @close="showModal = false">
|
<view class="modal">
|
<view class="modal_title">筛选</view>
|
<view class="line">
|
<view class="la">合同号</view>
|
<view class="val">
|
<input type="text" placeholder-class="placeholder9" v-model="form.contractNumber" />
|
</view>
|
</view>
|
<view class="line">
|
<view class="la">制单开始日期</view>
|
<view class="val" @click="showStarttime = true">
|
<text class="mr12"
|
:class="{placeholder9: !form.ncCreateDateTimeStart}">{{ form.ncCreateDateTimeStart ? form.ncCreateDateTimeStart : '请选择' }}</text>
|
<u-icon name="arrow-right" size="14" color="#999999"></u-icon>
|
</view>
|
</view>
|
<view class="line">
|
<view class="la">制单结束日期</view>
|
<view class="val" @click="showEndtime = true">
|
<text class="mr12"
|
:class="{placeholder9: !form.ncCreateDateTimeEnd}">{{ form.ncCreateDateTimeEnd ? form.ncCreateDateTimeEnd : '请选择' }}</text>
|
<u-icon name="arrow-right" size="14" color="#999999"></u-icon>
|
</view>
|
</view>
|
<view class="line">
|
<view class="la">发货地</view>
|
<view class="val">
|
<input type="text" placeholder-class="placeholder9" v-model="form.deliveryEnterprise" />
|
</view>
|
</view>
|
<view class="line">
|
<view class="la">到货地</view>
|
<view class="val">
|
<input type="text" placeholder-class="placeholder9" v-model="form.receiveEnterprise" />
|
</view>
|
</view>
|
<view class="line">
|
<view class="la">省份</view>
|
<view class="val" @click="showPri = true">
|
<text class="mr12"
|
:class="{placeholder9: !form.provinceName}">{{ form.provinceName ? form.provinceName : '请选择' }}</text>
|
<u-icon name="arrow-right" size="14" color="#999999"></u-icon>
|
</view>
|
</view>
|
<view class="btns">
|
<view class="btn" @click="clear">取消</view>
|
<view class="btn sub" @click="modalSub">提交</view>
|
</view>
|
</view>
|
</u-popup>
|
<!-- -->
|
<u-datetime-picker :show="showStarttime" v-model="defaultDate" mode="date" @confirm="confirmStart"
|
@cancel="showStarttime = false"></u-datetime-picker>
|
<u-datetime-picker :show="showEndtime" v-model="defaultDate2" mode="date" :minDate="defaultDate" @confirm="confirmEnd"
|
@cancel="showEndtime = false"></u-datetime-picker>
|
<u-picker :show="showPri" :columns="provinceList" @cancel="showPri = false" @confirm="confirmPro"></u-picker>
|
|
</view>
|
</template>
|
|
<script>
|
import {
|
orderListTms
|
} from '@/api'
|
import dayjs from 'dayjs';
|
export default {
|
data() {
|
return {
|
param: {},
|
list: [],
|
page: 1,
|
total: 0,
|
|
showModal: false,
|
showStarttime: false,
|
showEndtime: false,
|
defaultDate: Number(new Date()),
|
defaultDate2: Number(new Date()),
|
showPri: false,
|
form: {},
|
provinceList: [
|
[
|
'安徽', '江苏', '浙江', '河北', '山西', '北京', '天津', '上海', '重庆', '辽宁', '吉林', '黑龙江', '福建', '江西', '山东',
|
'河南', '湖北', '湖南', '广东', '海南', '四川', '贵州', '云南', '陕西', '甘肃', '青海', '台湾', '内蒙古自治区', '广西壮族自治区',
|
'西藏自治区', '宁夏回族自治区', '新疆维吾尔自治区'
|
]
|
]
|
};
|
},
|
onLoad(options) {
|
this.$set(this.param, 'phoneNumber', options.phone)
|
this.getList()
|
},
|
methods: {
|
clear() {
|
this.param = {
|
phoneNumber: this.param.phoneNumber
|
}
|
this.form = {}
|
this.page = 1
|
this.list = []
|
this.showModal = false
|
this.getList()
|
},
|
diaodu() {
|
uni.navigateTo({
|
url: '/pages/staff/signin'
|
})
|
},
|
modalSub() {
|
this.handleQuery()
|
this.showModal = false
|
},
|
openModal() {
|
this.showModal = true
|
// this.$set(this.form, 'ncCreateDateTimeStart', dayjs().subtract(1, 'month').format('YYYY-MM-DD'))
|
// const nextMonth = dayjs().add(1, 'month');
|
// this.$set(this.form, 'ncCreateDateTimeEnd', dayjs().format('YYYY-MM-DD'))
|
},
|
confirmPro(e) {
|
this.$set(this.form, 'provinceName', e.value[0])
|
this.showPri = false
|
},
|
confirmStart(e) {
|
this.$nextTick(() => {
|
this.$set(this.form, 'ncCreateDateTimeStart', dayjs(e.value).format('YYYY-MM-DD'))
|
})
|
this.defaultDate2 = Number(new Date())
|
this.$set(this.form, 'ncCreateDateTimeEnd', '')
|
this.showStarttime = false
|
},
|
confirmEnd(e) {
|
this.$nextTick(() => {
|
this.$set(this.form, 'ncCreateDateTimeEnd', dayjs(e.value).format('YYYY-MM-DD'))
|
})
|
this.showEndtime = false
|
},
|
handleQuery() {
|
this.page = 1
|
this.list = []
|
this.getList()
|
},
|
handleDetail(item) {
|
uni.navigateTo({
|
url: '/pages/waybill/waybillDetail?id=' + item.contractNumber
|
})
|
},
|
scrolltolower() {
|
const {
|
total,
|
list
|
} = this
|
if (list.length < total) {
|
this.page = this.page + 1
|
this.getList()
|
} else {
|
this.showToast('暂无更多数据')
|
}
|
},
|
getList() {
|
const {
|
param,
|
form,
|
page
|
} = this
|
// if (form.contract) {
|
// form.contractNumber = form.contract
|
// } else {
|
// form.contractNumber = null
|
// }
|
orderListTms({
|
parameters: {
|
...param,
|
...form
|
},
|
pager: {
|
rows: 10,
|
page
|
}
|
}).then(res => {
|
if (res.data && res.data.rows) {
|
this.list = [...this.list, ...res.data.rows]
|
this.total = res.data.totalCount
|
}
|
})
|
}
|
}
|
}
|
</script>
|
|
<style lang="scss">
|
page {
|
background: #F7F7F7;
|
}
|
.head_title{
|
color: $uni-color-primary;
|
text-decoration-line: underline;
|
margin-top: 20rpx;
|
}
|
.head_wrap {
|
display: flex;
|
align-items: center;
|
width: 750rpx;
|
background-color: #fff;
|
margin: 0 -30rpx;
|
padding: 12rpx 30rpx;
|
|
.search_box {
|
flex: 1;
|
width: 572rpx;
|
height: 76rpx;
|
background: #F7F7F7;
|
border-radius: 38rpx;
|
padding-left: 30rpx;
|
display: flex;
|
align-items: center;
|
|
input {
|
flex: 1;
|
height: 60rpx;
|
}
|
|
.search {
|
width: 28rpx;
|
height: 28rpx;
|
margin-right: 16rpx;
|
}
|
}
|
|
.right {
|
display: flex;
|
align-items: center;
|
margin-left: 30rpx;
|
|
image {
|
width: 28rpx;
|
height: 28rpx;
|
}
|
}
|
}
|
|
.scroll_Y {
|
background-color: #f7f7f7;
|
height: calc(100vh - 180rpx);
|
margin-top: 10rpx;
|
|
.main_list {
|
width: 750rpx;
|
margin: 0 -30rpx;
|
padding: 24rpx 30rpx;
|
|
.item {
|
border-radius: 8rpx;
|
margin-bottom: 20rpx;
|
padding: 0 30rpx;
|
background-color: #fff;
|
|
.head {
|
display: flex;
|
justify-content: space-between;
|
align-items: center;
|
padding: 0 30rpx;
|
width: 690rpx;
|
height: 84rpx;
|
margin: 0 -30rpx;
|
background: linear-gradient(270deg, #FEFEFF 0%, #E1F7FE 100%);
|
|
.code {
|
font-weight: 500;
|
font-size: 32rpx;
|
color: #222222;
|
}
|
|
.status {
|
color: $uni-color-primary;
|
}
|
}
|
|
.content {
|
padding: 20rpx 0rpx;
|
border-bottom: 1rpx solid #E5E5E5;
|
margin-bottom: 20rpx;
|
|
.line {
|
display: flex;
|
margin-bottom: 16rpx;
|
font-size: 26rpx;
|
|
.la {
|
color: #666666;
|
}
|
|
.val {}
|
|
&:nth-last-child(1) {
|
margin-bottom: 0;
|
}
|
}
|
}
|
|
.footer {
|
display: flex;
|
justify-content: space-between;
|
align-items: center;
|
font-size: 26rpx;
|
color: #999999;
|
padding-bottom: 20rpx;
|
|
.detail {
|
width: 168rpx;
|
height: 60rpx;
|
background: #FFFFFF;
|
border-radius: 30rpx;
|
border: 1rpx solid $uni-color-primary;
|
color: $uni-color-primary;
|
display: flex;
|
align-items: center;
|
justify-content: center;
|
font-size: 26rpx;
|
|
}
|
}
|
}
|
}
|
}
|
|
|
.modal {
|
.modal_title {
|
height: 112rpx;
|
display: flex;
|
align-items: center;
|
justify-content: center;
|
font-weight: 500;
|
font-size: 32rpx;
|
color: #222222;
|
}
|
|
.line {
|
display: flex;
|
justify-content: space-between;
|
align-items: center;
|
font-size: 30rpx;
|
height: 98rpx;
|
padding: 0 28rpx;
|
border-bottom: 1rpx solid #E5E5E5;
|
|
.val {
|
display: flex;
|
justify-content: flex-end;
|
flex: 1;
|
|
input {
|
text-align: right;
|
width: 100%;
|
}
|
}
|
}
|
|
.btns {
|
display: flex;
|
justify-content: space-between;
|
padding: 30rpx;
|
|
.btn {
|
width: 336rpx;
|
height: 88rpx;
|
border-radius: 44rpx;
|
border: 1rpx solid $uni-color-primary;
|
color: $uni-color-primary;
|
display: flex;
|
justify-content: center;
|
align-items: center;
|
font-size: 32rpx;
|
}
|
|
.sub {
|
background-color: $uni-color-primary;
|
color: #fff;
|
}
|
}
|
}
|
</style>
|
