更新 单据分配

src/views/voyage/billDetail.vue

@@ -1,5 +1,232 @@
 <template>
-  <div class="full-container-p24">单据详情</div>
+  <div class="full-container-p24">
+    <el-checkbox
+      v-model="isCheckAll"
+      @change="checkAll"
+      :indeterminate="isIndeterminate"
+      size="large"
+      style="margin-right: 20px"
+      >全选</el-checkbox
+    >
+    <div v-show="fileList?.length" class="df aic fww">
+      <div
+        style="
+          width: 100px;
+          text-align: center;
+          margin-right: 20px;
+          margin-bottom: 20px;
+        "
+        v-for="item in fileList"
+      >
+        <el-image
+          style="height: 100px; width: 100px"
+          fit="contain"
+          :src="item.viewUrl"
+          :preview-src-list="previewList"
+        ></el-image>
+        <div style="width: 100px; text-align: center; font-size: 12px">
+          {{ item.createTime }}
+        </div>
+        <div class="tac">
+          <el-checkbox
+            @change="checkItem"
+            v-model="item.checked"
+            size="large"
+          ></el-checkbox>
+        </div>
+      </div>
+    </div>
+    <div
+      v-show="!fileList?.length"
+      style="text-align: center; font-size: 24px; color: #ccc"
+    >
+      暂无单据图片
+    </div>
+    <div v-if="checkedImages.length">
+      <h4 class="mb10">请选择单据类型:</h4>
+      <div class="df aic distribute-group">
+        <el-button
+          class="mr20"
+          :type="distributeType == 1 ? 'primary' : ''"
+          @click="distributeType = 1"
+          >运单</el-button
+        >
+        <el-button
+          class="mr20"
+          :type="distributeType == 2 ? 'primary' : ''"
+          @click="distributeType = 2"
+          >磅单</el-button
+        >
+        <el-button
+          :type="distributeType == 4 ? 'primary' : ''"
+          @click="distributeType = 4"
+          >汽运装货单</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>
+      <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-date-picker
+              size="small"
+              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-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>
+    <el-button @click="submit">提交</el-button>
+  </div>
 </template>
 <script setup>
 import { ref, h, reactive, toRefs, onMounted } from "vue";
@@ -8,7 +235,78 @@ import store from "../../store";
 import router from "../../router";
 import md5 from "md5";
 import api from "../../apis/fetch";
-onMounted(() => {});
+import { useRoute } from "vue-router";
+
+const route = useRoute();
+let fileList = ref([]);
+let discPorts = ref([]);
+let isCheckAll = ref(false);
+let isIndeterminate = ref(false);
+let previewList = ref([]);
+function checkAll(b) {
+  isIndeterminate.value = false;
+  fileList.value.forEach((e) => {
+    e.checked = b;
+  });
+}
+let checkedImages = ref([]);
+function checkItem() {
+  checkedImages.value = fileList.value.filter((e) => e.checked);
+  if (checkedImages.value.length == fileList.value.length) {
+    isCheckAll.value = true;
+    isIndeterminate.value = false;
+  } else if (checkedImages.value.length == 0) {
+    isCheckAll.value = false;
+    isIndeterminate.value = false;
+  } else {
+    isIndeterminate.value = true;
+  }
+}
+async function getBill() {
+  let res = await api.getBill({
+    voyageId: route.query.id,
+  });
+  fileList.value = res.data.result;
+  for (let i of fileList.value || []) {
+    previewList.value.push(i.viewUrl);
+  }
+}
+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);
+let ocrImageList = ref([]);
+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({
+    recordIds: recordIds.value,
+  });
+  ocrLoading.value = false;
+  ocrTruckRecordTableData.value = res.data.result;
+  for (let i of ocrTruckRecordTableData.value) {
+    if (i.weighTime) i.weighTime = i.weighTime.substring(0, 10);
+    ocrImageList.value.push(i.viewUrl);
+  }
+}
+onMounted(() => {
+  discPorts.value = JSON.parse(route.query.discPorts);
+  getBill();
+});
 </script>
 <style scoped>
 </style>

src/views/voyage/billList.vue

@@ -64,7 +64,7 @@
         <el-table-column label="操作" min-width="80" align="center">
           <template v-slot="scope">
             <el-button
-              @click="billDetail(scope.row.id)"
+              @click="billDetail(scope.row.id, scope.row.discPorts)"
               type="text"
               size="small"
             >
@@ -112,11 +112,12 @@ async function getBillList(page) {
   }
 }
 
-async function billDetail(id) {
+async function billDetail(id, discPorts) {
   router.push({
     path: "/voyage/billDetail",
     query: {
       id,
+      discPorts: JSON.stringify(discPorts),
     },
   });
 }

src/views/voyage/voyageDetail.vue

@@ -1450,8 +1450,8 @@
               <br />
               {{ item.createTime }}
               <br />
-              天气 : {{ item.weather.weather }} - 气温 :
-              {{ item.weather.temperature }}℃
+              天气 : {{ item.weather?.weather }} - 气温 :
+              {{ item.weather?.temperature }}℃
             </div>
             <div class="medias-box mb10" style="position: relative">
               <el-image