|
|
|
|
@ -1,6 +1,24 @@ |
|
|
|
|
<template> |
|
|
|
|
<ifrm> |
|
|
|
|
<uni-forms ref="wrForm" class="formBox" label-position="top"> |
|
|
|
|
<uni-forms-item label="扫描模式：" label-width="100px" class="label-left"> |
|
|
|
|
<view class="mode-switch"> |
|
|
|
|
<view |
|
|
|
|
class="switch-btn" |
|
|
|
|
:class="{ active: scanMode === 'bind' }" |
|
|
|
|
@click="handleModeChange('bind')" |
|
|
|
|
> |
|
|
|
|
送料 |
|
|
|
|
</view> |
|
|
|
|
<view |
|
|
|
|
class="switch-btn" |
|
|
|
|
:class="{ active: scanMode === 'unbind' }" |
|
|
|
|
@click="handleModeChange('unbind')" |
|
|
|
|
> |
|
|
|
|
叫料 |
|
|
|
|
</view> |
|
|
|
|
</view> |
|
|
|
|
</uni-forms-item> |
|
|
|
|
<uni-forms-item label="物料箱条码：" label-width="100px"> |
|
|
|
|
<view class="bottom-input-row"> |
|
|
|
|
<view class="weight-input-wrapper"> |
|
|
|
|
@ -16,16 +34,16 @@ |
|
|
|
|
/> |
|
|
|
|
</view> |
|
|
|
|
</view> |
|
|
|
|
<button |
|
|
|
|
<!-- <button |
|
|
|
|
@click="handleSubmit" |
|
|
|
|
:disabled="!startData || !endCenter" |
|
|
|
|
class="submit-btn" |
|
|
|
|
:class="{ 'btn-disabled': !startData || !endCenter }" |
|
|
|
|
> |
|
|
|
|
配送 |
|
|
|
|
</button> |
|
|
|
|
</button> --> |
|
|
|
|
</view> |
|
|
|
|
<view v-if="boxData" class="box-info"> |
|
|
|
|
<!-- <view v-if="boxData" class="box-info"> |
|
|
|
|
<view class="info-section"> |
|
|
|
|
<text class="info-text"> |
|
|
|
|
包含订单: |
|
|
|
|
@ -39,9 +57,13 @@ |
|
|
|
|
<button @click="detailsFn()" class="details-btn"> |
|
|
|
|
明细 <text class="arrow">›</text> |
|
|
|
|
</button> |
|
|
|
|
</view> |
|
|
|
|
</view> --> |
|
|
|
|
</uni-forms-item> |
|
|
|
|
<uni-forms-item label="配送起点：" label-width="100px"> |
|
|
|
|
<uni-forms-item |
|
|
|
|
label="起点站点：" |
|
|
|
|
label-width="100px" |
|
|
|
|
v-if="scanMode === 'bind'" |
|
|
|
|
> |
|
|
|
|
<input |
|
|
|
|
type="text" |
|
|
|
|
v-model="startCode" |
|
|
|
|
@ -56,7 +78,38 @@ |
|
|
|
|
<text class="confirm-text">已确认: {{ startData.stationName }}</text> |
|
|
|
|
</view> |
|
|
|
|
</uni-forms-item> |
|
|
|
|
<uni-forms-item label="终点(作业中心)：" label-width="150px"> |
|
|
|
|
<uni-forms-item label="起点区域：" label-width="100px" v-else> |
|
|
|
|
<picker |
|
|
|
|
mode="selector" |
|
|
|
|
:range="startAreas" |
|
|
|
|
range-key="name" |
|
|
|
|
:value="startAreaIndex" |
|
|
|
|
@change="handleStartAreaChange" |
|
|
|
|
class="uni-input-border" |
|
|
|
|
> |
|
|
|
|
<view class="picker-input"> |
|
|
|
|
<text :class="startArea ? 'picker-value' : 'picker-placeholder'"> |
|
|
|
|
{{ startArea || "请选择起点区域" }} |
|
|
|
|
</text> |
|
|
|
|
</view> |
|
|
|
|
</picker> |
|
|
|
|
<picker |
|
|
|
|
mode="selector" |
|
|
|
|
:range="startStations" |
|
|
|
|
range-key="name" |
|
|
|
|
:value="startStationIndex" |
|
|
|
|
@change="handleStartStationChange" |
|
|
|
|
class="uni-input-border" |
|
|
|
|
:disabled="!startArea" |
|
|
|
|
> |
|
|
|
|
<view class="picker-input"> |
|
|
|
|
<text :class="startStation ? 'picker-value' : 'picker-placeholder'"> |
|
|
|
|
{{ startStation || "请选择起点站点" }} |
|
|
|
|
</text> |
|
|
|
|
</view> |
|
|
|
|
</picker> |
|
|
|
|
</uni-forms-item> |
|
|
|
|
<uni-forms-item label="终点区域：" label-width="150px"> |
|
|
|
|
<picker |
|
|
|
|
mode="selector" |
|
|
|
|
:range="workCenters" |
|
|
|
|
@ -67,13 +120,37 @@ |
|
|
|
|
> |
|
|
|
|
<view class="picker-input"> |
|
|
|
|
<text :class="endCenter ? 'picker-value' : 'picker-placeholder'"> |
|
|
|
|
{{ endCenter || "请选择终点" }} |
|
|
|
|
{{ endCenter || "请选择作业中心" }} |
|
|
|
|
</text> |
|
|
|
|
</view> |
|
|
|
|
</picker> |
|
|
|
|
<picker |
|
|
|
|
mode="selector" |
|
|
|
|
:range="endAreas" |
|
|
|
|
range-key="name" |
|
|
|
|
:value="endAreaIndex" |
|
|
|
|
@change="handleAreaChange" |
|
|
|
|
class="uni-input-border" |
|
|
|
|
:disabled="!endCenter" |
|
|
|
|
> |
|
|
|
|
<view class="picker-input"> |
|
|
|
|
<text :class="endArea ? 'picker-value' : 'picker-placeholder'"> |
|
|
|
|
{{ endArea || "请选择终点区域" }} |
|
|
|
|
</text> |
|
|
|
|
</view> |
|
|
|
|
</picker> |
|
|
|
|
</uni-forms-item> |
|
|
|
|
</uni-forms> |
|
|
|
|
|
|
|
|
|
<view class="footer-action"> |
|
|
|
|
<button |
|
|
|
|
@click="handleSubmit" |
|
|
|
|
:disabled="!startData || !endCenter" |
|
|
|
|
class="submit-btn" |
|
|
|
|
:class="{ 'btn-disabled': !startData || !endCenter }" |
|
|
|
|
> |
|
|
|
|
配送 |
|
|
|
|
</button> |
|
|
|
|
</view> |
|
|
|
|
<view v-if="showDetails" class="popup-overlay" @click="showDetails = false"> |
|
|
|
|
<view class="popup-content" @click.stop> |
|
|
|
|
<view class="popup-header"> |
|
|
|
|
@ -128,6 +205,20 @@ export default { |
|
|
|
|
}, |
|
|
|
|
workCenters: [], |
|
|
|
|
yieldOrderList: [], //订单明细 |
|
|
|
|
scanMode: "bind", |
|
|
|
|
hasData: false, |
|
|
|
|
workCenters: [], // 作业中心列表 |
|
|
|
|
endAreas: [], // 终点区域列表 |
|
|
|
|
endCenter: "", // 选中的作业中心 |
|
|
|
|
endArea: "", // 选中的终点区域 |
|
|
|
|
endCenterIndex: 0, // 作业中心选中索引 |
|
|
|
|
endAreaIndex: 0, // 终点区域选中索引 |
|
|
|
|
startAreas: [], // 起点区域列表 |
|
|
|
|
startStations: [], // 起点站点列表 |
|
|
|
|
startArea: "", // 选中的起点区域 |
|
|
|
|
startStation: "", // 选中的起点站点 |
|
|
|
|
startAreaIndex: 0, // 起点区域选中索引 |
|
|
|
|
startStationIndex: 0, // 起点站点选中索引 |
|
|
|
|
}; |
|
|
|
|
}, |
|
|
|
|
computed: { |
|
|
|
|
@ -143,6 +234,128 @@ export default { |
|
|
|
|
this.getWorkCenterList(); |
|
|
|
|
}, |
|
|
|
|
methods: { |
|
|
|
|
// 起点区域选择变化 |
|
|
|
|
handleStartAreaChange(e) { |
|
|
|
|
const index = e.detail.value; |
|
|
|
|
this.startArea = this.startAreas[index].name; |
|
|
|
|
this.startAreaIndex = this.startAreas[index].id; |
|
|
|
|
// 清空起点站点 |
|
|
|
|
this.startStation = ""; |
|
|
|
|
this.startStationIndex = 0; |
|
|
|
|
// 获取对应站点列表 |
|
|
|
|
this.getStartStationsList(this.startAreas[index].id); |
|
|
|
|
}, |
|
|
|
|
|
|
|
|
|
// 起点站点选择变化 |
|
|
|
|
handleStartStationChange(e) { |
|
|
|
|
const index = e.detail.value; |
|
|
|
|
this.startStation = this.startStations[index].name; |
|
|
|
|
this.startStationIndex = this.startStations[index].id; |
|
|
|
|
}, |
|
|
|
|
|
|
|
|
|
// 获取起点区域列表 |
|
|
|
|
getStartAreasList() { |
|
|
|
|
this.$u.api.getStartAreas().then((res) => { |
|
|
|
|
this.startAreas = res.data.map((area) => ({ |
|
|
|
|
id: area.id, |
|
|
|
|
name: area.areaName, |
|
|
|
|
})); |
|
|
|
|
}); |
|
|
|
|
}, |
|
|
|
|
|
|
|
|
|
// 获取起点站点列表（根据区域 ID） |
|
|
|
|
getStartStationsList(areaId) { |
|
|
|
|
if (!areaId) { |
|
|
|
|
this.startStations = []; |
|
|
|
|
return; |
|
|
|
|
} |
|
|
|
|
this.$u.api.getStartStations({ areaId }).then((res) => { |
|
|
|
|
this.startStations = res.data.map((station) => ({ |
|
|
|
|
id: station.id, |
|
|
|
|
name: station.stationName, |
|
|
|
|
})); |
|
|
|
|
// 默认选中第一个站点 |
|
|
|
|
if (this.startStations.length > 0) { |
|
|
|
|
this.startStation = this.startStations[0].name; |
|
|
|
|
this.startStationIndex = this.startStations[0].id; |
|
|
|
|
} |
|
|
|
|
}); |
|
|
|
|
}, |
|
|
|
|
// 作业中心选择变化 |
|
|
|
|
handleEndChange(e) { |
|
|
|
|
const index = e.detail.value; |
|
|
|
|
this.endCenter = this.workCenters[index].name; |
|
|
|
|
this.endCenterIndex = index; |
|
|
|
|
// 清空终点区域，并获取对应区域列表 |
|
|
|
|
this.endArea = ""; |
|
|
|
|
this.endAreaIndex = 0; |
|
|
|
|
this.getEndAreaList(this.workCenters[index].id); |
|
|
|
|
}, |
|
|
|
|
|
|
|
|
|
// 终点区域选择变化 |
|
|
|
|
handleAreaChange(e) { |
|
|
|
|
const index = e.detail.value; |
|
|
|
|
this.endArea = this.endAreas[index].name; |
|
|
|
|
this.endAreaIndex = index; |
|
|
|
|
}, |
|
|
|
|
|
|
|
|
|
// 获取作业中心列表 |
|
|
|
|
getWorkCenterList() { |
|
|
|
|
// this.$u.api.getWorkCenter().then((res) => { |
|
|
|
|
// this.workCenters = res.data.map((c) => ({ |
|
|
|
|
// id: c.id, |
|
|
|
|
// name: c.wcName, |
|
|
|
|
// })); |
|
|
|
|
// }); |
|
|
|
|
}, |
|
|
|
|
|
|
|
|
|
// 获取终点区域列表（根据作业中心 ID） |
|
|
|
|
getEndAreaList(workCenterId) { |
|
|
|
|
if (!workCenterId) { |
|
|
|
|
this.endAreas = []; |
|
|
|
|
return; |
|
|
|
|
} |
|
|
|
|
// this.$u.api.getEndArea({ workCenterId }).then((res) => { |
|
|
|
|
// this.endAreas = res.data.map((area) => ({ |
|
|
|
|
// id: area.id, |
|
|
|
|
// name: area.areaName, |
|
|
|
|
// })); |
|
|
|
|
// }); |
|
|
|
|
}, |
|
|
|
|
handleModeChange(mode) { |
|
|
|
|
this.scanMode = mode; |
|
|
|
|
this.hasData = false; |
|
|
|
|
|
|
|
|
|
// 清空物料箱数据 |
|
|
|
|
this.boxCode = ""; |
|
|
|
|
this.boxData = null; |
|
|
|
|
this.boxInputFocus = true; |
|
|
|
|
|
|
|
|
|
// 清空送料模式数据 |
|
|
|
|
this.startCode = ""; |
|
|
|
|
this.startData = null; |
|
|
|
|
this.startInputFocus = false; |
|
|
|
|
|
|
|
|
|
// 清空叫料模式数据 |
|
|
|
|
this.startArea = ""; |
|
|
|
|
this.startStation = ""; |
|
|
|
|
this.startAreaIndex = 0; |
|
|
|
|
this.startStationIndex = 0; |
|
|
|
|
this.startAreas = []; |
|
|
|
|
this.startStations = []; |
|
|
|
|
|
|
|
|
|
// 清空终点数据 |
|
|
|
|
this.endCenter = ""; |
|
|
|
|
this.endArea = ""; |
|
|
|
|
this.endCenterIndex = 0; |
|
|
|
|
this.endAreaIndex = 0; |
|
|
|
|
this.endAreas = []; |
|
|
|
|
|
|
|
|
|
// 叫料模式时加载起点区域列表 |
|
|
|
|
if (mode === "unbind") { |
|
|
|
|
this.getStartAreasList(); |
|
|
|
|
} |
|
|
|
|
}, |
|
|
|
|
// 获取订单明细 |
|
|
|
|
detailsFn() { |
|
|
|
|
this.showDetails = true; |
|
|
|
|
@ -219,27 +432,30 @@ export default { |
|
|
|
|
title: "提交中...", |
|
|
|
|
}); |
|
|
|
|
let query_ = { |
|
|
|
|
boxBarcode: this.boxBarcode||'', //箱条码 |
|
|
|
|
boxBarcode: this.boxBarcode || "", //箱条码 |
|
|
|
|
startStationCode: this.startData.stationCode, //开始站点 |
|
|
|
|
endWcId: this.endCenterIndex, //终点作业中心 |
|
|
|
|
}; |
|
|
|
|
this.$u.api.boxBindingTesk(query_).then((res) => { |
|
|
|
|
uni.showToast({ |
|
|
|
|
title: `成功配送至 ${this.endCenter}!`, |
|
|
|
|
icon: "success", |
|
|
|
|
this.$u.api |
|
|
|
|
.boxBindingTesk(query_) |
|
|
|
|
.then((res) => { |
|
|
|
|
uni.showToast({ |
|
|
|
|
title: `成功配送至 ${this.endCenter}!`, |
|
|
|
|
icon: "success", |
|
|
|
|
}); |
|
|
|
|
uni.hideLoading(); |
|
|
|
|
|
|
|
|
|
this.boxCode = ""; |
|
|
|
|
this.boxData = null; |
|
|
|
|
this.startCode = ""; |
|
|
|
|
this.startData = null; |
|
|
|
|
this.endCenter = ""; |
|
|
|
|
this.boxInputFocus = true; |
|
|
|
|
this.startInputFocus = false; |
|
|
|
|
}) |
|
|
|
|
.catch((err) => { |
|
|
|
|
uni.hideLoading(); |
|
|
|
|
}); |
|
|
|
|
uni.hideLoading() |
|
|
|
|
|
|
|
|
|
this.boxCode = ""; |
|
|
|
|
this.boxData = null; |
|
|
|
|
this.startCode = ""; |
|
|
|
|
this.startData = null; |
|
|
|
|
this.endCenter = ""; |
|
|
|
|
this.boxInputFocus = true; |
|
|
|
|
this.startInputFocus = false; |
|
|
|
|
}).catch(err=>{ |
|
|
|
|
uni.hideLoading() |
|
|
|
|
}) |
|
|
|
|
}, |
|
|
|
|
}, |
|
|
|
|
}; |
|
|
|
|
@ -603,4 +819,68 @@ export default { |
|
|
|
|
.submit-btn.disabled { |
|
|
|
|
opacity: 0.5; |
|
|
|
|
} |
|
|
|
|
.mode-switch { |
|
|
|
|
display: flex; |
|
|
|
|
width: 140px; |
|
|
|
|
height: 34px; |
|
|
|
|
border-radius: 4px; |
|
|
|
|
border: 1px solid rgba(21, 93, 252, 1); |
|
|
|
|
overflow: hidden; |
|
|
|
|
margin-left: auto; |
|
|
|
|
} |
|
|
|
|
|
|
|
|
|
.switch-btn { |
|
|
|
|
flex: 1; |
|
|
|
|
text-align: center; |
|
|
|
|
line-height: 32px; |
|
|
|
|
font-size: 14px; |
|
|
|
|
color: rgba(21, 93, 252, 1); |
|
|
|
|
background-color: #fff; |
|
|
|
|
transition: all 0.2s; |
|
|
|
|
} |
|
|
|
|
|
|
|
|
|
.switch-btn.active { |
|
|
|
|
background-color: rgba(21, 93, 252, 1); |
|
|
|
|
color: #fff; |
|
|
|
|
} |
|
|
|
|
.label-left { |
|
|
|
|
flex-direction: row !important; |
|
|
|
|
margin-top: 20rpx; |
|
|
|
|
} |
|
|
|
|
/* 底部固定按钮区域 */ |
|
|
|
|
.footer-action { |
|
|
|
|
position: fixed; |
|
|
|
|
left: 0; |
|
|
|
|
right: 0; |
|
|
|
|
bottom: 0; |
|
|
|
|
padding: 20rpx 32rpx; |
|
|
|
|
background-color: #ffffff; |
|
|
|
|
border-top: 2rpx solid #e2e8f0; |
|
|
|
|
box-shadow: 0 -2rpx 8rpx rgba(0, 0, 0, 0.05); |
|
|
|
|
z-index: 50; |
|
|
|
|
} |
|
|
|
|
.picker-input { |
|
|
|
|
width: 100%; |
|
|
|
|
padding: 16rpx; |
|
|
|
|
} |
|
|
|
|
|
|
|
|
|
.picker-value { |
|
|
|
|
font-size: 28rpx; |
|
|
|
|
font-weight: bold; |
|
|
|
|
color: #0f172a; |
|
|
|
|
} |
|
|
|
|
|
|
|
|
|
.picker-placeholder { |
|
|
|
|
font-size: 28rpx; |
|
|
|
|
color: #94a3b8; |
|
|
|
|
} |
|
|
|
|
|
|
|
|
|
/* 禁用状态 */ |
|
|
|
|
.picker-input.disabled { |
|
|
|
|
opacity: 0.5; |
|
|
|
|
background-color: #f1f5f9; |
|
|
|
|
} |
|
|
|
|
.uni-input-border { |
|
|
|
|
margin-bottom: 20rpx; |
|
|
|
|
} |
|
|
|
|
</style> |
|
|
|
|
|
zhangdi
2 weeks ago