286 lines
8.3 KiB
Vue
286 lines
8.3 KiB
Vue
|
<template>
|
|||
|
|
<view class="container">
|
|||
|
|
<z-paging ref="pagingRef" class="containerBox" v-model="listData" :default-page-size="queryParams.pageSize" @query="queryList">
|
|||
|
|
<template #top>
|
|||
|
|
<view style="padding: 20rpx 32rpx 0;">
|
|||
|
|
<!-- 项目号/项目描述/物料号/物料描述/供应商编码/供应商名称/订单编号 -->
|
|||
|
|
<uv-search v-model="queryParams.keyword" placeholder="请输入" :showAction="true" actionText="搜索" @search="searchList" @custom="searchList"></uv-search>
|
|||
|
|
<uv-tabs :list="list" @click="click" lineColor="#199793"></uv-tabs>
|
|||
|
|
</view>
|
|||
|
|
</template>
|
|||
|
|
|
|||
|
|
|
|||
|
|
<view class="box">
|
|||
|
|
<view v-for="item in listData" class="item">
|
|||
|
|
<view class="title">配送号：{{ item.orderNo }}</view>
|
|||
|
|
<view><text>发货人：</text>{{ item.shipperName }}</view>
|
|||
|
|
<view><text>发货地：</text>{{ item.originName }}</view>
|
|||
|
|
<view><text>接收人：</text>{{ item.receiverName }}</view>
|
|||
|
|
<view style="display: flex; align-items: center;">
|
|||
|
|
<view><text>目的地：</text>{{ item.destName }}</view>
|
|||
|
|
<image :src="openMap" mode="scaleToFill" v-show="item.orderStatus == 2" style="width: 30rpx; height: 30rpx;margin-left: 20rpx;" @tap="toMap(item, 'location')" />
|
|||
|
|
</view>
|
|||
|
|
<view><text>货物数量：</text>{{ item.items.length }}</view>
|
|||
|
|
<view><text>配送日期：</text>{{ item.deliveryDate }}</view>
|
|||
|
|
<view class="statusBtn">
|
|||
|
|
<!-- <uv-button :plain="true" shape="circle" text="查看详情" @tap="goDetail(item)" style="margin-right: 20rpx;"></uv-button> -->
|
|||
|
|
<uv-button type="primary" shape="circle" v-show="item.orderStatus == 1" text="开始配送" @tap="changeOrder(item, 'ORIGIN')"></uv-button>
|
|||
|
|
<uv-button type="primary" shape="circle" v-show="item.orderStatus == 2" text="完成配送" @tap="changeOrder(item, 'DEST')"></uv-button>
|
|||
|
|
<uv-button type="primary" shape="circle" v-show="item.orderStatus == 3" text="查看单据" style="margin-right: 20rpx;" @tap="changeOrder(item, 'COMPLETE')"></uv-button>
|
|||
|
|
<!-- <uv-button type="primary" shape="circle" v-show="item.orderStatus == 1" text="开始配送" @tap="change1(item, 'ORIGIN')"></uv-button>
|
|||
|
|
<uv-button type="primary" shape="circle" v-show="item.orderStatus == 2" text="完成配送" @tap="change1(item, 'DEST')"></uv-button> -->
|
|||
|
|
<uv-button type="primary" v-show="item.orderStatus == 3" :plain="true" shape="circle" text="历史轨迹" @tap="toMap(item, 'history')"></uv-button>
|
|||
|
|
</view>
|
|||
|
|
</view>
|
|||
|
|
</view>
|
|||
|
|
</z-paging>
|
|||
|
|
|
|||
|
|
<view class="btn">
|
|||
|
|
<uv-button type="primary" text="确定" size="large" style="width: 100%;" class="mainBtn" @tap="handleAdd">新 增 配 送 任 务</uv-button>
|
|||
|
|
</view>
|
|||
|
|
|
|||
|
|
<uv-modal ref="modalRef" title="单据明细" class="modalInfo" confirmText="关闭" confirmColor="#606266"
|
|||
|
|
:closeOnClickOverlay="false">
|
|||
|
|
<view class="box">
|
|||
|
|
<view v-for="items in infoList" class="item">
|
|||
|
|
<view><text>订单编号：</text>{{ items.sapNo }}</view>
|
|||
|
|
<view><text>项目描述：</text>{{ items.xmMs }}</view>
|
|||
|
|
<view><text>项目号：</text>{{ items.xmNo }}</view>
|
|||
|
|
<view><text>物料号：</text>{{ items.wlNo }}</view>
|
|||
|
|
<view><text>物料描述：</text>{{ items.wlMs }}</view>
|
|||
|
|
<view><text>供应商名称：</text>{{ items.gysMc }}</view>
|
|||
|
|
<view><text>存放位置：</text>{{ items.pcode || "-" }}</view>
|
|||
|
|
<view><text>身份码：</text>{{ items.entityId || "-" }}</view>
|
|||
|
|
<view><text>备注：</text>{{ items.remark || '-' }}</view>
|
|||
|
|
</view>
|
|||
|
|
</view>
|
|||
|
|
</uv-modal>
|
|||
|
|
|
|||
|
|
</view>
|
|||
|
|
</template>
|
|||
|
|
|
|||
|
|
<script setup>
|
|||
|
|
import { ref, computed } from "vue";
|
|||
|
|
import { onLoad, onShow, onPageScroll } from "@dcloudio/uni-app";
|
|||
|
|
import { getOrder, getOrderDetail } from "@/api/index"
|
|||
|
|
import openMap from "@/static/openMap.png"
|
|||
|
|
|
|||
|
|
|
|||
|
|
|
|||
|
|
const list = ref([{
|
|||
|
|
name: '待接单',
|
|||
|
|
value: '0',
|
|||
|
|
}, {
|
|||
|
|
name: '待配送',
|
|||
|
|
value: '1',
|
|||
|
|
}, {
|
|||
|
|
name: '配送中',
|
|||
|
|
value: '2',
|
|||
|
|
}, {
|
|||
|
|
name: '已完成',
|
|||
|
|
value: '3',
|
|||
|
|
}])
|
|||
|
|
const click = (item) => {
|
|||
|
|
queryParams.value.orderStatus = item.value
|
|||
|
|
pagingRef.value.reload()
|
|||
|
|
console.log('item', item);
|
|||
|
|
}
|
|||
|
|
const queryParams = ref({
|
|||
|
|
// keyword: "",
|
|||
|
|
orderStatus: 0,
|
|||
|
|
pageNum: 1,
|
|||
|
|
pageSize: 10
|
|||
|
|
})
|
|||
|
|
const pagingRef = ref(null)
|
|||
|
|
const listData = ref([])
|
|||
|
|
// 获取列表
|
|||
|
|
const queryList = (pageNo, pageSize) => {
|
|||
|
|
queryParams.value.pageNum = pageNo
|
|||
|
|
console.log(pageNo, pageSize, queryParams.value)
|
|||
|
|
getOrder(queryParams.value).then(res => {
|
|||
|
|
console.log(res.rows)
|
|||
|
|
pagingRef.value.complete(res.rows)
|
|||
|
|
}).catch(res => {
|
|||
|
|
pagingRef.value.complete(false)
|
|||
|
|
})
|
|||
|
|
}
|
|||
|
|
const searchList = () => {
|
|||
|
|
pagingRef.value.reload()
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
onLoad(() => {
|
|||
|
|
})
|
|||
|
|
|
|||
|
|
onShow(() => {
|
|||
|
|
pagingRef.value?.reload()
|
|||
|
|
})
|
|||
|
|
|
|||
|
|
|
|||
|
|
// 弹窗
|
|||
|
|
const modalRef = ref()
|
|||
|
|
const infoList = ref([])
|
|||
|
|
const goDetail = (item) => {
|
|||
|
|
if (item.infoList && item.infoList.length > 0) {
|
|||
|
|
infoList.value = item.infoList
|
|||
|
|
modalRef.value.open()
|
|||
|
|
return
|
|||
|
|
}
|
|||
|
|
getOrderDetail({ orderNo: item.orderNo }).then(res => {
|
|||
|
|
infoList.value = res.data
|
|||
|
|
item.infoList = res.data
|
|||
|
|
modalRef.value.open()
|
|||
|
|
})
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
// 跳转地图
|
|||
|
|
const toMap = (item, type) => {
|
|||
|
|
if (type === 'location') {
|
|||
|
|
uni.navigateTo({
|
|||
|
|
url: "/pages/index/map?orderNo=" + item.orderNo + "&plateNo=" + item.plateNo + "&type=" + type
|
|||
|
|
})
|
|||
|
|
} else {
|
|||
|
|
uni.navigateTo({
|
|||
|
|
url: "/pages/index/map?orderNo=" + item.orderNo + "&plateNo=" + item.plateNo + "&type=" + type
|
|||
|
|
})
|
|||
|
|
}
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
|
|||
|
|
|
|||
|
|
const changeOrder = (item, type) => {
|
|||
|
|
uni.navigateTo({
|
|||
|
|
url: "/pages/index/deliveryBill?type=" + type + "&orderNo=" + item.orderNo + "&billNoCk=" + item.billNoCk
|
|||
|
|
})
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
const change1 = (item, type) => {
|
|||
|
|
uni.navigateTo({
|
|||
|
|
url: "/pages/index/editDelivery?type=" + type + "&orderNo=" + item.orderNo + "&billNoCk=" + item.billNoCk
|
|||
|
|
})
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
const handleAdd = (item) => {
|
|||
|
|
uni.navigateTo({
|
|||
|
|
url: "/pages/index/addDelivery"
|
|||
|
|
})
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
|
|||
|
|
</script>
|
|||
|
|
|
|||
|
|
<style scoped lang="scss">
|
|||
|
|
.container {
|
|||
|
|
position: relative;
|
|||
|
|
.containerBox{
|
|||
|
|
// padding: 32rpx;
|
|||
|
|
padding-bottom: 120rpx;
|
|||
|
|
min-height: calc(100vh - 196rpx - 120rpx);
|
|||
|
|
|
|||
|
|
::v-deep .uv-tabs__wrapper__nav{
|
|||
|
|
width: 100%;
|
|||
|
|
}
|
|||
|
|
::v-deep .uv-tabs__wrapper__nav__item{
|
|||
|
|
flex: 1;
|
|||
|
|
}
|
|||
|
|
.dropDown{
|
|||
|
|
padding: 0 30rpx;
|
|||
|
|
border-bottom: 1px solid #dadbde;
|
|||
|
|
.item_dropDown{
|
|||
|
|
padding: 20rpx;
|
|||
|
|
display: flex;
|
|||
|
|
align-items: center;
|
|||
|
|
::v-deep .uv-text{
|
|||
|
|
width: unset !important;
|
|||
|
|
flex: unset !important;
|
|||
|
|
}
|
|||
|
|
::v-deep .item_text{
|
|||
|
|
max-width: 200rpx;
|
|||
|
|
margin-right: 10rpx !important;
|
|||
|
|
}
|
|||
|
|
}
|
|||
|
|
}
|
|||
|
|
::v-deep .uv-search {
|
|||
|
|
flex: unset;
|
|||
|
|
}
|
|||
|
|
::v-deep .zp-scroll-view-super {
|
|||
|
|
background-color: #F3F4F8;
|
|||
|
|
}
|
|||
|
|
.box{
|
|||
|
|
// background-color: #ebebeb;
|
|||
|
|
// background-color: #f5f5f5;
|
|||
|
|
// padding-top: 20rpx;
|
|||
|
|
background-color: #F3F4F8;
|
|||
|
|
padding: 0 32rpx;
|
|||
|
|
box-sizing: border-box;
|
|||
|
|
padding-top: 20rpx;
|
|||
|
|
.item {
|
|||
|
|
background: white;
|
|||
|
|
padding: 20rpx;
|
|||
|
|
margin-bottom: 20rpx;
|
|||
|
|
line-height: 50rpx;
|
|||
|
|
font-size: 28rpx;
|
|||
|
|
border-radius: 8rpx;
|
|||
|
|
color: #333;
|
|||
|
|
position: relative;
|
|||
|
|
.title {
|
|||
|
|
font-size: 32rpx;
|
|||
|
|
font-weight: bold;
|
|||
|
|
display: flex;
|
|||
|
|
align-items: center;
|
|||
|
|
}
|
|||
|
|
text{
|
|||
|
|
color: #666;
|
|||
|
|
}
|
|||
|
|
.statusBtn {
|
|||
|
|
display: flex;
|
|||
|
|
justify-content: flex-end;
|
|||
|
|
border-top: 1px solid #c7c7c7;
|
|||
|
|
padding-top: 10rpx;
|
|||
|
|
::v-deep .uv-button{
|
|||
|
|
height: 60rpx !important;
|
|||
|
|
}
|
|||
|
|
}
|
|||
|
|
}
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
}
|
|||
|
|
::v-deep .uv-input__content{
|
|||
|
|
flex-direction: column;
|
|||
|
|
align-items: flex-start;
|
|||
|
|
}
|
|||
|
|
.btn {
|
|||
|
|
position: fixed;
|
|||
|
|
width: calc(100vw - 64rpx);
|
|||
|
|
bottom: 0;
|
|||
|
|
left: 32rpx;
|
|||
|
|
z-index: 99;
|
|||
|
|
display: flex;
|
|||
|
|
align-items: center;
|
|||
|
|
justify-content: space-between;
|
|||
|
|
}
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.modalInfo {
|
|||
|
|
.box {
|
|||
|
|
width: 100%;
|
|||
|
|
max-height: 60vh;
|
|||
|
|
overflow: auto;
|
|||
|
|
.item {
|
|||
|
|
background: #efefef;
|
|||
|
|
padding: 20rpx;
|
|||
|
|
margin-top: 20rpx;
|
|||
|
|
line-height: 50rpx;
|
|||
|
|
font-size: 28rpx;
|
|||
|
|
border-radius: 8rpx;
|
|||
|
|
color: #333;
|
|||
|
|
border: unset;
|
|||
|
|
|
|||
|
|
}
|
|||
|
|
}
|
|||
|
|
}
|
|||
|
|
::v-deep .zp-paging-container-content{
|
|||
|
|
background-color: #F3F4F8;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
</style>
|