|
|
@@ -1,13 +1,17 @@
|
|
|
<template>
|
|
|
<div class="full-container-p24">
|
|
|
- <el-checkbox
|
|
|
- v-model="isCheckAll"
|
|
|
- @change="checkAll"
|
|
|
- :indeterminate="isIndeterminate"
|
|
|
- size="large"
|
|
|
- style="margin-right: 20px"
|
|
|
- >全选</el-checkbox
|
|
|
- >
|
|
|
+ <div class="df mb10 aic">
|
|
|
+ <h5 class="mr20">请选择单据:</h5>
|
|
|
+ <el-checkbox
|
|
|
+ v-model="isCheckAll"
|
|
|
+ @change="checkAll"
|
|
|
+ :indeterminate="isIndeterminate"
|
|
|
+ size="large"
|
|
|
+ style="margin-right: 20px"
|
|
|
+ >全选</el-checkbox
|
|
|
+ >
|
|
|
+ </div>
|
|
|
+
|
|
|
<div v-show="fileList?.length" class="df aic fww">
|
|
|
<div
|
|
|
style="
|
|
|
@@ -17,6 +21,7 @@
|
|
|
margin-bottom: 20px;
|
|
|
"
|
|
|
v-for="item in fileList"
|
|
|
+ :key="item.id"
|
|
|
>
|
|
|
<el-image
|
|
|
style="height: 100px; width: 100px"
|
|
|
@@ -42,190 +47,203 @@
|
|
|
>
|
|
|
暂无单据图片
|
|
|
</div>
|
|
|
- <div v-if="checkedImages.length">
|
|
|
- <h4 class="mb10">请选择单据类型:</h4>
|
|
|
- <div class="df aic distribute-group">
|
|
|
+ <div v-if="recordIds.length" class="mb20">
|
|
|
+ <h5 class="mb10">请选择单据类型:</h5>
|
|
|
+ <div class="df aic distribute-group mb20">
|
|
|
<el-button
|
|
|
class="mr20"
|
|
|
:type="distributeType == 1 ? 'primary' : ''"
|
|
|
@click="distributeType = 1"
|
|
|
+ size="small"
|
|
|
>运单</el-button
|
|
|
>
|
|
|
<el-button
|
|
|
class="mr20"
|
|
|
:type="distributeType == 2 ? 'primary' : ''"
|
|
|
@click="distributeType = 2"
|
|
|
+ size="small"
|
|
|
>磅单</el-button
|
|
|
>
|
|
|
<el-button
|
|
|
:type="distributeType == 4 ? 'primary' : ''"
|
|
|
@click="distributeType = 4"
|
|
|
+ size="small"
|
|
|
>汽运装货单</el-button
|
|
|
>
|
|
|
</div>
|
|
|
- </div>
|
|
|
- <div v-if="distributeType != -1">
|
|
|
- <h4 class="mb10">请选择卸货港:</h4>
|
|
|
- <div class="df aic distribute-group">
|
|
|
- <el-button
|
|
|
- v-for="(item, index) in discPorts"
|
|
|
- class="mr20"
|
|
|
- :type="distributePortId == item.portId ? 'primary' : ''"
|
|
|
- @click="distributePortId = item.portId"
|
|
|
- >{{ item.portName }}</el-button
|
|
|
- >
|
|
|
- </div>
|
|
|
- </div>
|
|
|
- <div v-show="distributeType == 2">
|
|
|
- <el-form inline :model="distributePoundForm">
|
|
|
- <el-form-item label="卸货时间">
|
|
|
- <el-date-picker
|
|
|
- class="info-line-text"
|
|
|
- v-model="distributePoundForm.dischargeTime"
|
|
|
- type="datetime"
|
|
|
- format="YYYY/MM/DD HH:mm:ss"
|
|
|
- value-format="YYYY/MM/DD HH:mm:ss"
|
|
|
- placeholder="卸货时间"
|
|
|
- ></el-date-picker>
|
|
|
- </el-form-item>
|
|
|
- <el-form-item label="卸货吨位">
|
|
|
- <el-input
|
|
|
- class="info-line-text"
|
|
|
- v-model="distributePoundForm.dischargeTons"
|
|
|
- placeholder="卸货吨位"
|
|
|
- ></el-input>
|
|
|
- </el-form-item>
|
|
|
- <el-form-item label="卸货件数">
|
|
|
- <el-input
|
|
|
- class="info-line-text"
|
|
|
- v-model="distributePoundForm.dischargePieces"
|
|
|
- placeholder="卸货件数"
|
|
|
- ></el-input>
|
|
|
- </el-form-item>
|
|
|
- </el-form>
|
|
|
- </div>
|
|
|
- <div v-show="distributeType == 4">
|
|
|
- <div class="tar">
|
|
|
- <el-button @click="ocr" :loading="ocrLoading" type="primary">{{
|
|
|
- ocrLoading ? "正在识别" : "开始识别"
|
|
|
- }}</el-button>
|
|
|
+ <div v-if="distributeType != -1" class="mb20">
|
|
|
+ <h5 class="mb10">请选择卸货港:</h5>
|
|
|
+ <div class="df aic distribute-group">
|
|
|
+ <el-button
|
|
|
+ v-for="(item, index) in discPorts"
|
|
|
+ class="mr20"
|
|
|
+ :type="distributePortId == item.portId ? 'primary' : ''"
|
|
|
+ @click="distributePortId = item.portId"
|
|
|
+ size="small"
|
|
|
+ >{{ item.portName }}</el-button
|
|
|
+ >
|
|
|
+ </div>
|
|
|
</div>
|
|
|
- <el-table :data="ocrTruckRecordTableData" stripe max-height="500">
|
|
|
- <el-table-column label="港口名称" min-width="200" align="center">
|
|
|
- <template v-slot="scope">
|
|
|
- <el-input size="small" v-model="scope.row.portName"></el-input>
|
|
|
- </template>
|
|
|
- </el-table-column>
|
|
|
- <!-- <el-table-column label="称重时间" min-width="200" align="center">
|
|
|
- <template v-slot="scope">
|
|
|
+ <div v-show="distributeType == 2">
|
|
|
+ <el-form inline :model="distributePoundForm">
|
|
|
+ <el-form-item label="卸货时间">
|
|
|
<el-date-picker
|
|
|
- size="small"
|
|
|
class="info-line-text"
|
|
|
- v-model="scope.row.weighTime"
|
|
|
+ v-model="distributePoundForm.dischargeTime"
|
|
|
type="datetime"
|
|
|
format="YYYY/MM/DD HH:mm:ss"
|
|
|
value-format="YYYY/MM/DD HH:mm:ss"
|
|
|
- placeholder="称重时间"
|
|
|
+ placeholder="卸货时间"
|
|
|
></el-date-picker>
|
|
|
- </template>
|
|
|
- </el-table-column> -->
|
|
|
- <el-table-column label="称重时间" min-width="120" align="center">
|
|
|
- <template v-slot="scope">
|
|
|
- <el-input
|
|
|
- :input-style="
|
|
|
- scope.row.weighTime ? {} : { border: '1px solid red' }
|
|
|
- "
|
|
|
- size="small"
|
|
|
- v-model="scope.row.weighTime"
|
|
|
- ></el-input>
|
|
|
- </template>
|
|
|
- </el-table-column>
|
|
|
- <el-table-column label="车号" min-width="120" align="center">
|
|
|
- <template v-slot="scope">
|
|
|
- <el-input
|
|
|
- :input-style="
|
|
|
- scope.row.carNum?.length == 7 ? {} : { border: '1px solid red' }
|
|
|
- "
|
|
|
- size="small"
|
|
|
- v-model="scope.row.carNum"
|
|
|
- ></el-input>
|
|
|
- </template>
|
|
|
- </el-table-column>
|
|
|
- <el-table-column label="货物名称" min-width="120" align="center">
|
|
|
- <template v-slot="scope">
|
|
|
- <el-input size="small" v-model="scope.row.cargoName"></el-input>
|
|
|
- </template>
|
|
|
- </el-table-column>
|
|
|
- <el-table-column label="发货单位" min-width="200" align="center">
|
|
|
- <template v-slot="scope">
|
|
|
- <el-input size="small" v-model="scope.row.shippingUnit"></el-input>
|
|
|
- </template>
|
|
|
- </el-table-column>
|
|
|
- <el-table-column label="收货单位" min-width="200" align="center">
|
|
|
- <template v-slot="scope">
|
|
|
+ </el-form-item>
|
|
|
+ <el-form-item label="卸货吨位">
|
|
|
<el-input
|
|
|
- :input-style="
|
|
|
- scope.row.receivingUnit ? {} : { border: '1px solid red' }
|
|
|
- "
|
|
|
- size="small"
|
|
|
- v-model="scope.row.receivingUnit"
|
|
|
+ class="info-line-text"
|
|
|
+ v-model="distributePoundForm.dischargeTons"
|
|
|
+ placeholder="卸货吨位"
|
|
|
></el-input>
|
|
|
- </template>
|
|
|
- </el-table-column>
|
|
|
- <el-table-column label="毛重" min-width="120" align="center">
|
|
|
- <template v-slot="scope">
|
|
|
+ </el-form-item>
|
|
|
+ <el-form-item label="卸货件数">
|
|
|
<el-input
|
|
|
- :input-style="
|
|
|
- scope.row.grossWeight ? {} : { border: '1px solid red' }
|
|
|
- "
|
|
|
- size="small"
|
|
|
- v-model="scope.row.grossWeight"
|
|
|
- ></el-input>
|
|
|
- </template>
|
|
|
- </el-table-column>
|
|
|
- <el-table-column label="皮重" min-width="120" align="center">
|
|
|
- <template v-slot="scope">
|
|
|
- <el-input
|
|
|
- :input-style="scope.row.tare ? {} : { border: '1px solid red' }"
|
|
|
- size="small"
|
|
|
- v-model="scope.row.tare"
|
|
|
+ class="info-line-text"
|
|
|
+ v-model="distributePoundForm.dischargePieces"
|
|
|
+ placeholder="卸货件数"
|
|
|
></el-input>
|
|
|
- </template>
|
|
|
- </el-table-column>
|
|
|
- <el-table-column label="净重" min-width="120" align="center">
|
|
|
+ </el-form-item>
|
|
|
+ </el-form>
|
|
|
+ </div>
|
|
|
+ <div v-show="distributeType == 4">
|
|
|
+ <div class="tar">
|
|
|
+ <el-button @click="ocr" :loading="ocrLoading" type="primary">{{
|
|
|
+ ocrLoading ? "正在识别" : "开始识别"
|
|
|
+ }}</el-button>
|
|
|
+ </div>
|
|
|
+ <el-table :data="ocrTruckRecordTableData" stripe max-height="500">
|
|
|
+ <el-table-column label="港口名称" min-width="200" align="center">
|
|
|
+ <template v-slot="scope">
|
|
|
+ <el-input size="small" v-model="scope.row.portName"></el-input>
|
|
|
+ </template>
|
|
|
+ </el-table-column>
|
|
|
+ <!-- <el-table-column label="称重时间" min-width="200" align="center">
|
|
|
<template v-slot="scope">
|
|
|
- <el-input
|
|
|
- :input-style="
|
|
|
- scope.row.netWeight ? {} : { border: '1px solid red' }
|
|
|
- "
|
|
|
+ <el-date-picker
|
|
|
size="small"
|
|
|
- v-model="scope.row.netWeight"
|
|
|
- ></el-input>
|
|
|
- </template>
|
|
|
- </el-table-column>
|
|
|
- <el-table-column label="货船名称" min-width="120" align="center">
|
|
|
- <template v-slot="scope">
|
|
|
- <el-input size="small" v-model="scope.row.shipName"></el-input>
|
|
|
- </template>
|
|
|
- </el-table-column>
|
|
|
- <el-table-column label="司磅员" min-width="120" align="center">
|
|
|
- <template v-slot="scope">
|
|
|
- <el-input size="small" v-model="scope.row.weigher"></el-input>
|
|
|
+ class="info-line-text"
|
|
|
+ v-model="scope.row.weighTime"
|
|
|
+ type="datetime"
|
|
|
+ format="YYYY/MM/DD HH:mm:ss"
|
|
|
+ value-format="YYYY/MM/DD HH:mm:ss"
|
|
|
+ placeholder="称重时间"
|
|
|
+ ></el-date-picker>
|
|
|
</template>
|
|
|
- </el-table-column>
|
|
|
- <el-table-column label="查看" min-width="120" align="center">
|
|
|
- <template v-slot="scope">
|
|
|
- <el-image
|
|
|
- style="height: 40px; width: 60px"
|
|
|
- fit="contain"
|
|
|
- :src="scope.row.viewUrl"
|
|
|
- :preview-src-list="ocrImageList"
|
|
|
- ></el-image
|
|
|
- ></template>
|
|
|
- </el-table-column>
|
|
|
- </el-table>
|
|
|
+ </el-table-column> -->
|
|
|
+ <el-table-column label="称重时间" min-width="120" align="center">
|
|
|
+ <template v-slot="scope">
|
|
|
+ <el-input
|
|
|
+ :input-style="
|
|
|
+ scope.row.weighTime ? {} : { border: '1px solid red' }
|
|
|
+ "
|
|
|
+ size="small"
|
|
|
+ v-model="scope.row.weighTime"
|
|
|
+ ></el-input>
|
|
|
+ </template>
|
|
|
+ </el-table-column>
|
|
|
+ <el-table-column label="车号" min-width="120" align="center">
|
|
|
+ <template v-slot="scope">
|
|
|
+ <el-input
|
|
|
+ :input-style="
|
|
|
+ scope.row.carNum?.length == 7
|
|
|
+ ? {}
|
|
|
+ : { border: '1px solid red' }
|
|
|
+ "
|
|
|
+ size="small"
|
|
|
+ v-model="scope.row.carNum"
|
|
|
+ ></el-input>
|
|
|
+ </template>
|
|
|
+ </el-table-column>
|
|
|
+ <el-table-column label="货物名称" min-width="120" align="center">
|
|
|
+ <template v-slot="scope">
|
|
|
+ <el-input size="small" v-model="scope.row.cargoName"></el-input>
|
|
|
+ </template>
|
|
|
+ </el-table-column>
|
|
|
+ <el-table-column label="发货单位" min-width="200" align="center">
|
|
|
+ <template v-slot="scope">
|
|
|
+ <el-input
|
|
|
+ size="small"
|
|
|
+ v-model="scope.row.shippingUnit"
|
|
|
+ ></el-input>
|
|
|
+ </template>
|
|
|
+ </el-table-column>
|
|
|
+ <el-table-column label="收货单位" min-width="200" align="center">
|
|
|
+ <template v-slot="scope">
|
|
|
+ <el-input
|
|
|
+ :input-style="
|
|
|
+ scope.row.receivingUnit ? {} : { border: '1px solid red' }
|
|
|
+ "
|
|
|
+ size="small"
|
|
|
+ v-model="scope.row.receivingUnit"
|
|
|
+ ></el-input>
|
|
|
+ </template>
|
|
|
+ </el-table-column>
|
|
|
+ <el-table-column label="毛重" min-width="120" align="center">
|
|
|
+ <template v-slot="scope">
|
|
|
+ <el-input
|
|
|
+ :input-style="
|
|
|
+ scope.row.grossWeight ? {} : { border: '1px solid red' }
|
|
|
+ "
|
|
|
+ size="small"
|
|
|
+ v-model="scope.row.grossWeight"
|
|
|
+ ></el-input>
|
|
|
+ </template>
|
|
|
+ </el-table-column>
|
|
|
+ <el-table-column label="皮重" min-width="120" align="center">
|
|
|
+ <template v-slot="scope">
|
|
|
+ <el-input
|
|
|
+ :input-style="scope.row.tare ? {} : { border: '1px solid red' }"
|
|
|
+ size="small"
|
|
|
+ v-model="scope.row.tare"
|
|
|
+ ></el-input>
|
|
|
+ </template>
|
|
|
+ </el-table-column>
|
|
|
+ <el-table-column label="净重" min-width="120" align="center">
|
|
|
+ <template v-slot="scope">
|
|
|
+ <el-input
|
|
|
+ :input-style="
|
|
|
+ scope.row.netWeight ? {} : { border: '1px solid red' }
|
|
|
+ "
|
|
|
+ size="small"
|
|
|
+ v-model="scope.row.netWeight"
|
|
|
+ ></el-input>
|
|
|
+ </template>
|
|
|
+ </el-table-column>
|
|
|
+ <el-table-column label="货船名称" min-width="120" align="center">
|
|
|
+ <template v-slot="scope">
|
|
|
+ <el-input size="small" v-model="scope.row.shipName"></el-input>
|
|
|
+ </template>
|
|
|
+ </el-table-column>
|
|
|
+ <el-table-column label="司磅员" min-width="120" align="center">
|
|
|
+ <template v-slot="scope">
|
|
|
+ <el-input size="small" v-model="scope.row.weigher"></el-input>
|
|
|
+ </template>
|
|
|
+ </el-table-column>
|
|
|
+ <el-table-column label="查看" min-width="120" align="center">
|
|
|
+ <template v-slot="scope">
|
|
|
+ <el-image
|
|
|
+ style="height: 40px; width: 60px"
|
|
|
+ fit="contain"
|
|
|
+ :src="scope.row.viewUrl"
|
|
|
+ :preview-src-list="ocrImageList"
|
|
|
+ ></el-image
|
|
|
+ ></template>
|
|
|
+ </el-table-column>
|
|
|
+ </el-table>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ <div class="df jcfe">
|
|
|
+ <el-button size="large" type="primary" @click="submitDistribute"
|
|
|
+ >提交</el-button
|
|
|
+ >
|
|
|
</div>
|
|
|
- <el-button @click="submit">提交</el-button>
|
|
|
</div>
|
|
|
</template>
|
|
|
<script setup>
|
|
|
@@ -248,19 +266,38 @@ function checkAll(b) {
|
|
|
fileList.value.forEach((e) => {
|
|
|
e.checked = b;
|
|
|
});
|
|
|
+ setRecordIds();
|
|
|
}
|
|
|
-let checkedImages = ref([]);
|
|
|
function checkItem() {
|
|
|
- checkedImages.value = fileList.value.filter((e) => e.checked);
|
|
|
- if (checkedImages.value.length == fileList.value.length) {
|
|
|
+ if (
|
|
|
+ fileList.value.every((item) => {
|
|
|
+ return item.checked;
|
|
|
+ })
|
|
|
+ ) {
|
|
|
isCheckAll.value = true;
|
|
|
isIndeterminate.value = false;
|
|
|
- } else if (checkedImages.value.length == 0) {
|
|
|
+ } else if (
|
|
|
+ fileList.value.every((item) => {
|
|
|
+ return !item.checked;
|
|
|
+ })
|
|
|
+ ) {
|
|
|
isCheckAll.value = false;
|
|
|
isIndeterminate.value = false;
|
|
|
} else {
|
|
|
isIndeterminate.value = true;
|
|
|
}
|
|
|
+ setRecordIds();
|
|
|
+}
|
|
|
+function setRecordIds() {
|
|
|
+ let arr0 = [];
|
|
|
+ for (let i of fileList.value) {
|
|
|
+ if (i.checked) {
|
|
|
+ checkedPreviewList.value.push(i.viewUrl);
|
|
|
+ arr0.push(i.id);
|
|
|
+ }
|
|
|
+ }
|
|
|
+ recordIds.value = arr0.join(",");
|
|
|
+ ocrTruckRecordTableData.value = [];
|
|
|
}
|
|
|
async function getBill() {
|
|
|
let res = await api.getBill({
|
|
|
@@ -273,10 +310,6 @@ async function getBill() {
|
|
|
}
|
|
|
let distributeType = ref(-1);
|
|
|
let distributePortId = ref(-1);
|
|
|
-async function submit() {
|
|
|
- console.log("已选中", checkedImages.value);
|
|
|
- console.log("单据类型", distributeType.value);
|
|
|
-}
|
|
|
|
|
|
let distributePoundForm = ref({});
|
|
|
let ocrLoading = ref(false);
|
|
|
@@ -285,12 +318,6 @@ let checkedPreviewList = ref([]);
|
|
|
let recordIds = ref("");
|
|
|
let ocrTruckRecordTableData = ref([]);
|
|
|
async function ocr() {
|
|
|
- let arr0 = [];
|
|
|
- for (let i of checkedImages.value) {
|
|
|
- checkedPreviewList.value.push(i.viewUrl);
|
|
|
- arr0.push(i.id);
|
|
|
- }
|
|
|
- recordIds.value = arr0.join(",");
|
|
|
ocrLoading.value = true;
|
|
|
ocrImageList.value = [];
|
|
|
let res = await api.ocr({
|
|
|
@@ -303,6 +330,75 @@ async function ocr() {
|
|
|
ocrImageList.value.push(i.viewUrl);
|
|
|
}
|
|
|
}
|
|
|
+async function submitDistribute() {
|
|
|
+ if (recordIds.value.length == 0) {
|
|
|
+ ElMessage({
|
|
|
+ type: "error",
|
|
|
+ message: "请选择要分配的图片!",
|
|
|
+ });
|
|
|
+ return;
|
|
|
+ }
|
|
|
+ if (distributeType.value == -1) {
|
|
|
+ ElMessage({
|
|
|
+ type: "error",
|
|
|
+ message: "请选择要分配类型!",
|
|
|
+ });
|
|
|
+ return;
|
|
|
+ }
|
|
|
+ if (distributePortId.value == -1) {
|
|
|
+ ElMessage({
|
|
|
+ type: "error",
|
|
|
+ message: "请选择要分配的港口!",
|
|
|
+ });
|
|
|
+ return;
|
|
|
+ }
|
|
|
+ let postData = {};
|
|
|
+ let type = distributeType.value;
|
|
|
+ if (2 == type) {
|
|
|
+ if (
|
|
|
+ !distributePoundForm.value.dischargeTime ||
|
|
|
+ !distributePoundForm.value.dischargeTons
|
|
|
+ ) {
|
|
|
+ ElMessage({
|
|
|
+ type: "error",
|
|
|
+ message: "卸货时间和吨位必填!",
|
|
|
+ });
|
|
|
+ return;
|
|
|
+ }
|
|
|
+ postData = {
|
|
|
+ poundBillData: {
|
|
|
+ ...distributePoundForm.value,
|
|
|
+ portId: distributePortId.value,
|
|
|
+ },
|
|
|
+ };
|
|
|
+ } else if (4 == type) {
|
|
|
+ if (!ocrTruckRecordTableData.value.length) {
|
|
|
+ ElMessage({
|
|
|
+ type: "error",
|
|
|
+ message: "请识别装货单!",
|
|
|
+ });
|
|
|
+ return;
|
|
|
+ }
|
|
|
+ for (let i of ocrTruckRecordTableData.value) {
|
|
|
+ i.portId = distributePortId.value;
|
|
|
+ }
|
|
|
+ postData = { carLoadDatas: ocrTruckRecordTableData.value };
|
|
|
+ }
|
|
|
+ console.log(postData, route.query.id, recordIds.value, type);
|
|
|
+ let res = await api.distribute({
|
|
|
+ ...postData,
|
|
|
+ voyageId: route.query.id,
|
|
|
+ recordIds: recordIds.value,
|
|
|
+ type,
|
|
|
+ });
|
|
|
+ distributeType.value = -1;
|
|
|
+ recordIds.value = [];
|
|
|
+ distributePortId.value = -1;
|
|
|
+ ocrTruckRecordTableData.value = [];
|
|
|
+ isCheckAll.value = false;
|
|
|
+ isIndeterminate.value = false;
|
|
|
+ getBill();
|
|
|
+}
|
|
|
onMounted(() => {
|
|
|
discPorts.value = JSON.parse(route.query.discPorts);
|
|
|
getBill();
|
wzh