From 28e4407fbff996295203855617554ec3e125533c Mon Sep 17 00:00:00 2001
From: xzg <4727863@qq.com>
Date: Thu, 14 Dec 2023 21:28:10 +0800
Subject: [PATCH] =?UTF-8?q?=E5=AE=A2=E6=9C=8D?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 src/router/views/index.js                     |   13 +-
 .../aftersales/aftersalesWorkOrderInfo.vue    |  131 ++
 .../aftersales/aftersalesWorkOrdermodify.vue  | 1307 +++++++++++++++++
 3 files changed, 1450 insertions(+), 1 deletion(-)
 create mode 100644 src/views/aftersales/aftersalesWorkOrdermodify.vue

diff --git a/src/router/views/index.js b/src/router/views/index.js
index 505badea..3b05b17c 100644
--- a/src/router/views/index.js
+++ b/src/router/views/index.js
@@ -1277,7 +1277,18 @@ export default [
       },
     ],
   },
-
+  {
+    path: '/aftersales/aftersalesWorkOrdermodify',
+    component: Layout,
+    redirect: '/aftersales/aftersalesWorkOrdermodify',
+    children: [
+      {
+        path: '/aftersales/aftersalesWorkOrdermodify',
+        name: '信息修改',
+        component: () => import('@/views/aftersales/aftersalesWorkOrdermodify.vue'),
+      },
+    ],
+  },
   {
     path: '/aftersales/aftersalesWorkOrderSS',
     component: Layout,
diff --git a/src/views/aftersales/aftersalesWorkOrderInfo.vue b/src/views/aftersales/aftersalesWorkOrderInfo.vue
index ebf4f65e..4710e129 100644
--- a/src/views/aftersales/aftersalesWorkOrderInfo.vue
+++ b/src/views/aftersales/aftersalesWorkOrderInfo.vue
@@ -417,6 +417,15 @@
       <el-button @click="Indexdialog = false">取消</el-button>
       <el-button type="primary" @click="ConfirmForm"> 提交 </el-button>
     </div>
+
+
+    <div class="foot_btn">
+    <el-button type="primary" @click="addingRecord">新增记录</el-button>
+    <el-button type="primary" @click="EndJump">完结 </el-button>
+    <el-button type="primary" @click="ConfirmForm">打回 </el-button>
+    <el-button type="primary" @click="CustomerServiceCompleted">客服仲裁完结 </el-button>
+  </div>
+
   </el-card>
 
   <!-- <div v-if="routerState" class="foot_btn">
@@ -507,6 +516,7 @@ import {
   $_remove,
   $_getBusinessDepartmentUser,
   $_getAbnormalPackage,
+  $_getInfo,
 } from '@/api/aftersales/aftersalesWorkOrder';
 import { ref, reactive, toRefs, computed, onMounted, nextTick } from 'vue';
 import { getToken } from '@/utils/auth';
@@ -669,6 +679,103 @@ const onLoad = () => {
   updateDictionary(IndexException.value, 'pc_work_order'); //异常类型
   updateDictionary(DiscoveringNodes.value, 'pc_discovery_node'); //发现环节
   handle(); //处理方和责任方信息
+
+  $_getInfo({ id: $route.query.id }).then(res => {
+      console.log(res, '回显返回值参数');
+      endFrom.value = res.data.data;
+      endFrom.value.result = [];
+      endFrom.value.processor = [];
+      endFrom.value.packageImage = [];
+      //图片处理回显
+      res.data.data.decreaseImageVOList.forEach(res => {
+        endFrom.value['packageImage'].push({
+          name: res.imageName,
+          url: res.imagePath,
+        });
+      });
+      // 包件回显
+      PackageInfo.value = res.data.data.abnormalPackageVOList
+        .map(item => {
+          let orderCodes = item.orderCode.split(',');
+          let packageCodes = item.packageCode.split(',');
+          let waybillNumbers = item.waybillNumber.split(',');
+
+          return orderCodes.map((code, index) => ({
+            packageCode: packageCodes[index],
+            orderCode: code,
+            waybillNumber: waybillNumbers[index],
+          }));
+        })
+        .flat();
+      // 责任方回显
+      FangAddList.value = res.data.data.processorVOList
+        .filter(item => item.typesOf == '1')
+        .map(res => {
+          return {
+            businessName: res.businessId,
+          };
+        });
+
+      FangAddList.value = res.data.data.personResponsibleVOS.map(res => {
+        return {
+          businessName: res.businessId, //责任人ID
+          personResponsibleName: res.personResponsibleName, //责任人名称
+          responsibilityRatio: res.responsibilityRatio, //占比
+          description: res.description, //说明
+        };
+      });
+      res.data.data.processorVOList.forEach(item => {
+        if (item.typesOf == 2) {
+          // 处理方
+          endFrom.value.processor.push(item.businessId);
+        }
+      });
+      console.log(endFrom.value.processor, ' endFrom.value.processor');
+      getDictionaryBiz('pc_work_order').then(res => {
+        //处理结果字典
+        console.log(res, '环节字典');
+        endFrom.value.workOrderType = res.data.data.find(
+          res => res.dictKey == endFrom.value.workOrderType
+        ).dictValue; //异常类型回显
+      });
+
+      //发现环节回显
+      getDictionaryBiz('pc_discovery_node').then(res => {
+        console.log(res, '发现环节');
+        // ProcessingResults.value = res.data.data;
+        TransportlossList.value = res.data.data;
+        console.log(TransportlossList.value, '处理好的发现环节');
+        // endFrom.discoveryNode
+      });
+      getDictionaryBiz('result_handling').then(res => {
+        console.log(res, '发现环节');
+        ProcessingResults.value = res.data.data;
+      });
+
+      // 公司占比回显计算
+      let sum = 0;
+      FangAddList.value.forEach(item => {
+        sum = Number(item.responsibilityRatio) + sum;
+      });
+      companyProportion.value = 100 - sum;
+
+      // updateDictionary(columnList[2].checkarr, 'pc_work_order'); //异常类型
+      // updateDictionary(columnList[3].checkarr, 'pc_discovery_node'); //发现环节
+
+      // 处理结果回显
+      // res.data.data.processingResultsVO.processingMoneyEntityList.forEach(item => {
+      //   ProcessingList.value.push({
+      //     input: item.money,
+      //     min: 0,
+      //     max: 9999999999999,
+      //     state: item.resultType,
+      //     payment: item.compensationMethod,
+      //     name: item.resultTypeName,
+      //     text: '',
+      //   });
+      //   endFrom.value.result.push(item.resultType);
+      // });
+    });
 };
 onLoad(); //初始化程序
 // 异常类型事件
@@ -1060,6 +1167,30 @@ const ViewPackageDetails = val => {
   });
   dialogHistoricalPackage.value = false; //打开历史包件弹窗
 };
+
+// 新增记录跳转
+const addingRecord = () => {
+  $router.push({
+    path: '/aftersales/aftersalesWorkOrderend',
+    query: {
+      id: $route.query.id,
+      name: $route.query.workOrderNumber + '-添加异常记录',
+      businessId: $route.query.workOrderNumber,
+      RouterState: 'record',
+    },
+  });
+};
+const EndJump = () => {
+  $router.push({
+    path: '/aftersales/aftersalesWorkOrderend',
+    query: {
+      id: $route.query.id,
+      name: $route.query.id + '-完结填写',
+      RouterState: 'end',
+    },
+  });
+};
+
 </script>
 
 <style scoped lang="scss">
diff --git a/src/views/aftersales/aftersalesWorkOrdermodify.vue b/src/views/aftersales/aftersalesWorkOrdermodify.vue
new file mode 100644
index 00000000..7f053f88
--- /dev/null
+++ b/src/views/aftersales/aftersalesWorkOrdermodify.vue
@@ -0,0 +1,1307 @@
+<template>
+    <el-card class="box-card">
+      <el-tabs type="border-card" class="topClass" @tab-change="TopChange">
+        <el-tab-pane label="订单"></el-tab-pane>
+        <el-tab-pane label="零担"></el-tab-pane>
+      </el-tabs>
+  
+      <!-- <el-divider content-position="left">
+        <span> {{ routerState ? '信息查看' : '工单新增' }}</span>
+      </el-divider> -->
+      <el-tabs type="border-card" class="PackageInformation">
+        <el-tab-pane label="包件信息">
+          <div class="ResponsibilityBoxS">
+            <div><el-button type="primary" @click="AddPackage"> 添加信息 </el-button></div>
+            <div class="el_btbox" v-for="(item, index) in PackageInfo" :key="index">
+              <div class="leftbox">
+                <div class="maxBox">
+                  <span class="title">包条码:</span>
+                  <el-input
+                    v-model="item.packageCode"
+                    placeholder="请输入包条码"
+                    clearable
+                    :rows="2"
+                    @change="ChangePackageInfo(item.packageCode, index)"
+                  />
+                </div>
+  
+                <div class="maxBox">
+                  <span class="title">订单自编码:</span>
+                  <el-input v-model="item.orderCode" placeholder="请输入订单自编号" clearable />
+                </div>
+  
+                <div class="maxBox">
+                  <span class="title">运单号:</span>
+                  <el-input v-model="item.waybillNumber" placeholder="请输入运单号" clearable />
+                </div>
+              </div>
+  
+              <div class="el-btn">
+                <el-button v-if="item.state" type="primary" @click="historicalPackages(index)">
+                  查看历史包件
+                </el-button>
+                <el-button type="primary" @click="PackagRemoval(index)"> 移除 </el-button>
+              </div>
+            </div>
+            <div class="NumTotal">
+              <span>总件数:{{ Indexform.number }}</span>
+            </div>
+          </div>
+        </el-tab-pane>
+      </el-tabs>
+      <el-form :model="Indexform" label-width="100px" class="IndexFrom" ref="IndexForm">
+        <el-form-item label="异常类型">
+          <el-select
+            v-model="Indexform.workOrderType"
+            clearable
+            placeholder="选择工单异常类型"
+            @change="abnormalChange"
+          >
+            <el-option
+              v-for="item in IndexException"
+              :key="item.value"
+              :label="item.label"
+              :value="item.value"
+            />
+          </el-select>
+        </el-form-item>
+  
+        <el-form-item label="发现节点">
+          <el-select
+            v-model="Indexform.discoveryNode"
+            clearable
+            placeholder="选择发现节点"
+            @change="DiscoveringNodesChange"
+          >
+            <el-option
+              v-for="item in DiscoveringNodes"
+              :key="item.value"
+              :label="item.label"
+              :value="item.value"
+            />
+          </el-select>
+        </el-form-item>
+  
+        <el-form-item label="异常工单号">
+          <el-input v-model="Indexform.workOrderNumber" disabled placeholder="异常工单号" clearable />
+        </el-form-item>
+        <!-- 必填(提货环节可以不填写运单号) -->
+        <!-- <el-form-item label="运单号" v-if="groundlineType != 1">
+        <el-input v-model="Indexform.waybillNumber" placeholder="请输入运单号" clearable />
+      </el-form-item> -->
+  
+        <!-- <el-form-item label="少货件数" v-if="StateType || SelectType == 2">
+        <div class="moneyNum">
+          <el-input
+            @change="ShortageTtems"
+            v-model="Indexform.number"
+            placeholder="请输入少货件数"
+            clearable
+          />
+          <div class="el_btn" @click="moneyBtnA"><span>编辑</span></div>
+        </div>
+      </el-form-item> -->
+  
+        <!-- <el-form-item label="窜货件数" v-if="StateType || SelectType == 3">
+        <div class="moneyNum">
+          <el-input
+            @change="fleeingTtems"
+            v-model="Indexform.number"
+            placeholder="请输入窜货件数"
+            clearable
+          />
+          <div class="el_btn" @click="moneyBtnB"><span>编辑</span></div>
+        </div>
+      </el-form-item> -->
+  
+        <!-- <el-form-item
+        label="包条码"
+        v-if="SelectType == 1 || SelectType == 2 || SelectType == 3 || StateType"
+      >
+        <el-input
+          v-model="Indexform.packageCode"
+          placeholder="请输入包条码,多个用逗号隔开"
+          clearable
+        />
+      </el-form-item> -->
+  
+        <!-- 必填 -->
+        <!-- <el-form-item label="订单自编号">
+        <el-input v-model="Indexform.orderCode" placeholder="请输入订单自编号" clearable />
+      </el-form-item> -->
+  
+        <el-form-item
+          label="车次号"
+          v-if="
+            groundlineSet ||
+            groundlineType == 1 ||
+            groundlineType == 3 ||
+            groundlineType == 4 ||
+            groundlineType == 8 ||
+            groundlineType == 5 ||
+            groundlineType == 7 ||
+            groundlineType == 8
+          "
+        >
+          <el-input
+            v-model="Indexform.trainNumber"
+            placeholder="请输入车次号(干线卸车环节)"
+            clearable
+          />
+        </el-form-item>
+        <!-- 必填 -->
+        <el-form-item label="一级品">
+          <el-input v-model="Indexform.first" placeholder="请输入一级品类" clearable />
+        </el-form-item>
+        <!-- 必填 -->
+        <el-form-item label="二级品">
+          <el-input v-model="Indexform.secondary" placeholder="请输入二级品类" clearable />
+        </el-form-item>
+  
+        <el-form-item label="车辆路线" v-if="groundlineSet || groundlineType == 3">
+          <el-input
+            v-model="Indexform.vehicleRoute"
+            placeholder="请输入车辆路线车次号(通过车次号自动带出车辆路线)"
+            clearable
+          />
+        </el-form-item>
+  
+        <el-form-item label="发货时间">
+          <el-date-picker
+            v-model="Indexform.deliverGoodsTime"
+            type="datetime"
+            format="YYYY-MM-DD HH:mm:ss"
+            value-format="YYYY-MM-DD HH:mm:ss"
+            placeholder="请选择发货时间"
+          />
+        </el-form-item>
+  
+        <el-form-item
+          label="发现时间"
+          v-if="
+            groundlineSet ||
+            groundlineType == 2 ||
+            groundlineType == 3 ||
+            groundlineType == 4 ||
+            groundlineType == 8 ||
+            groundlineType == 5 ||
+            groundlineType == 7 ||
+            groundlineType == 8
+          "
+        >
+          <el-date-picker
+            v-model="Indexform.discoveryTime"
+            type="datetime"
+            format="YYYY-MM-DD HH:mm:ss"
+            value-format="YYYY-MM-DD HH:mm:ss"
+            placeholder="请选择发现时间"
+          />
+        </el-form-item>
+  
+        <el-form-item
+          label="配送时间"
+          v-if="
+            groundlineSet ||
+            groundlineType == 3 ||
+            groundlineType == 4 ||
+            groundlineType == 8 ||
+            groundlineType == 5 ||
+            groundlineType == 7 ||
+            groundlineType == 8
+          "
+        >
+          <el-date-picker
+            v-model="Indexform.deliveryTime"
+            type="datetime"
+            format="YYYY-MM-DD HH:mm:ss"
+            value-format="YYYY-MM-DD HH:mm:ss"
+            placeholder="请选择配送时间"
+          />
+        </el-form-item>
+  
+        <el-form-item
+          label="入库时间"
+          v-if="groundlineSet || groundlineType == 2 || groundlineType == 4"
+        >
+          <el-date-picker
+            v-model="Indexform.warehousingTime"
+            type="datetime"
+            format="YYYY-MM-DD HH:mm:ss"
+            value-format="YYYY-MM-DD HH:mm:ss"
+            placeholder="请选择入库"
+          />
+        </el-form-item>
+        <!-- 必填 -->
+        <el-form-item label="运单商场">
+          <el-input v-model="Indexform.waybillMall" placeholder="请输入运单商场" clearable />
+        </el-form-item>
+        <el-form-item label="钉钉流程号">
+          <el-input v-model="Indexform.processNumber" placeholder="请输入钉钉流程号" />
+        </el-form-item>
+        <el-form-item
+          label="配送司机"
+          v-if="
+            groundlineSet ||
+            groundlineType == 3 ||
+            groundlineType == 4 ||
+            groundlineType == 8 ||
+            groundlineType == 5 ||
+            groundlineType == 7 ||
+            groundlineType == 8
+          "
+        >
+          <el-select
+            v-model="Indexform.deliveryDriver"
+            filterable
+            default-first-option
+            :reserve-keyword="false"
+            placeholder="请输入配送司机"
+          >
+            <el-option
+              v-for="item in DeliveryDriver"
+              :key="item.value"
+              :label="item.label"
+              :value="item.value"
+            />
+          </el-select>
+        </el-form-item>
+        <!-- 必填 -->
+        <el-form-item label="异常问题描述">
+          <el-input v-model="Indexform.problemDescription" placeholder="请输入异常问题" clearable />
+        </el-form-item>
+      </el-form>
+  
+      <!-- 必填 -->
+      <div class="el_clzr">
+        <el-form-item class="investigate" label="调查经过">
+          <el-input
+            v-model="Indexform.investigationPocess"
+            placeholder="请输入调查经过"
+            clearable
+            :rows="2"
+            type="textarea"
+          />
+        </el-form-item>
+  
+        <el-form-item label="处理方">
+          <el-select
+            v-model="Indexform.processor"
+            clearable
+            filterable
+            multiple
+            placeholder="请选择处理方"
+          >
+            <el-option
+              v-for="item in warehouseData"
+              :key="item.value"
+              :label="item.label"
+              :value="item.value"
+            />
+          </el-select>
+        </el-form-item>
+      </div>
+  
+      <el-tabs type="border-card">
+        <el-tab-pane label="责任方选择">
+          <div class="ResponsibilityBox">
+            <div><el-button type="primary" @click="responsibleParty"> 添加信息 </el-button></div>
+            <div class="el_btbox" v-for="(item, index) in FangAddList" :key="index">
+              <div class="leftbox">
+                <div class="maxBox">
+                  <span class="title">责任方:</span>
+  
+                  <!-- 提货环节  -->
+  
+                  <el-select
+                    v-model="item.businessName"
+                    clearable
+                    placeholder="请选提货择责任方"
+                    v-if="groundlineType == 1"
+                  >
+                    <el-option
+                      v-for="item in responsible"
+                      :key="item.value"
+                      :label="item.label"
+                      :value="item.value"
+                    />
+                  </el-select>
+  
+                  <el-select
+                    v-else
+                    v-model="item.businessName"
+                    filterable  
+                    placeholder="请选择责任方"
+                    @change="ResponsiblePartychange(item.businessName, index)"
+                  >
+                    <el-option
+                      v-for="item in warehouseData"
+                      :key="item.value"
+                      :label="item.label"
+                      :value="item.value"
+                    />
+                  </el-select>
+                </div>
+  
+                <div class="maxBox">
+                  <span class="title">责任人：</span>
+                  <el-select
+                    v-model="item.personResponsibleName"
+                    clearable
+                    filterable
+                    placeholder="请选责任人"
+                  >
+                    <el-option
+                      v-for="item in personResponsibleList"
+                      :key="item.id"
+                      :label="item.name"
+                      :value="item.id"
+                    />
+                  </el-select>
+                </div>
+                <div class="maxBox">
+                  <span class="title">占比:</span>
+                  <el-input
+                    v-model="item.responsibilityRatio"
+                    placeholder="请输入占比 "
+                    clearable
+                    :rows="2"
+                  />
+                </div>
+  
+                <div class="maxBox">
+                  <span class="title">说明:</span>
+                  <el-input
+                    v-model="item.description"
+                    placeholder="请输入说明 "
+                    clearable
+                    :rows="2"
+                  />
+                </div>
+              </div>
+              <div class="el-btn">
+                <el-button type="primary" @click="ResponsibilityRemoval(index)"> 移除 </el-button>
+              </div>
+            </div>
+            <div class="Proportion">
+              <span class="title">公司占比:{{ companyProportion }}</span>
+            </div>
+          </div>
+        </el-tab-pane>
+      </el-tabs>
+  
+      <div class="Transport_damage_photos" v-if="SelectType == 1 || SelectType == 3 || StateType">
+        <span class="title">{{
+          SelectType == 1 ? '运损照片' : SelectType == 3 ? '窜货照片' : '照片'
+        }}</span>
+        <el-upload
+          v-model:file-list="Indexform.packList"
+          list-type="picture-card"
+          :on-preview="pictureList"
+          :on-remove="ImgListRemove"
+          :action="doubledCount"
+          :on-success="ImgSuccess"
+          :before-upload="beforeAvatarUpload"
+          :headers="headers"
+          multiple
+          drag
+        >
+          <el-icon><Plus /></el-icon>
+        </el-upload>
+  
+        <el-dialog v-model="dialogVisible">
+          <img w-full :src="dialogImageUrl" alt="图片" />
+        </el-dialog>
+      </div>
+  
+      <div class="dialog-footer">
+        <el-button @click="Indexdialog = false">取消</el-button>
+        <el-button type="primary" @click="ConfirmForm"> 提交 </el-button>
+      </div>
+    </el-card>
+  
+    <!-- <div v-if="routerState" class="foot_btn">
+      <el-button type="primary" @click="ConfirmForm">新增记录</el-button>
+      <el-button type="primary" @click="ConfirmForm">完结 </el-button>
+      <el-button type="primary" @click="ConfirmForm">打回 </el-button>
+    </div> -->
+  
+    <!-- 少货件数大于3 -->
+    <el-dialog
+      :show-close="false"
+      v-model="ShortageState"
+      title="少货件数"
+      width="40%"
+      @close="ShortageStateFun"
+      lock-scroll
+      draggable
+    >
+      <div class="ShortageStatenum" v-for="item in ShortageList">
+        <span class="title">件数{{ item.number }}</span
+        ><el-input v-model="item.packageCode" placeholder="请输入包条码" />
+      </div>
+  
+      <template #footer>
+        <span class="dialog-footer">
+          <el-button @click="ShortageCancellation">取消</el-button>
+          <el-button type="primary" @click="ShortageState = false"> 确认信息 </el-button>
+        </span>
+      </template>
+    </el-dialog>
+  
+    <!-- 窜货件数大于3 -->
+    <el-dialog
+      :show-close="false"
+      v-model="fleeingState"
+      title="窜货件数"
+      width="40%"
+      @close="fleeingFun"
+      lock-scroll
+      draggable
+    >
+      <div class="ShortageStatenum" v-for="item in fleeingList">
+        <span class="title">件数{{ item.number }}</span
+        ><el-input v-model="item.packageCode" placeholder="请输入包条码" />
+      </div>
+  
+      <template #footer>
+        <span class="dialog-footer">
+          <el-button @click="fleeingCancellation">取消</el-button>
+          <el-button type="primary" @click="ShortageState = false"> 确认信息 </el-button>
+        </span>
+      </template>
+    </el-dialog>
+  
+    <el-dialog v-model="dialogHistoricalPackage" title="查看历史包件" width="30%">
+      <el-form-item label="历史包件选择">
+        <el-select v-model="HistoricalPackageinput" clearable filterable placeholder="请选择包件">
+          <el-option
+            v-for="item in HistoricalPackageList"
+            :key="item.value"
+            :label="item.workOrderNumber"
+            :value="item.workOrderId"
+          />
+        </el-select>
+        <el-button @click="ViewPackageDetails(HistoricalPackageinput)">查看详情</el-button>
+      </el-form-item>
+      <template #footer>
+        <span class="dialog-footer">
+          <el-button @click="dialogHistoricalPackage = false">取消</el-button>
+          <el-button type="primary" @click="HistoricalPackage(HistoricalPackageinput)">
+            确定选择
+          </el-button>
+        </span>
+      </template>
+    </el-dialog>
+  </template>
+  
+  <script setup>
+  import { ElMessage } from 'element-plus';
+  import { ElMessageBox } from 'element-plus';
+  import { useRouter, useRoute } from 'vue-router';
+  import { getDictionaryBiz } from '@/api/system/dict'; //字典
+  import { getDetailWarehouse, getDeptWarehouse } from '@/api/basicdata/basicdataWarehouse'; //处理方
+  import {
+    $_getList,
+    $_submit,
+    $_getDetail,
+    $_remove,
+    $_getBusinessDepartmentUser,
+    $_getAbnormalPackage,
+  } from '@/api/aftersales/aftersalesWorkOrder';
+  import { ref, reactive, toRefs, computed, onMounted, nextTick } from 'vue';
+  import { getToken } from '@/utils/auth';
+  const $router = useRouter();
+  const $route = useRoute();
+  const Indexform = ref({
+    packList: [
+      {
+        name: 'food.jpeg',
+        url: 'https://fuss10.elemecdn.com/3/63/4e7f3a15429bfda99bce42a18cdd1jpeg.jpeg?imageMogr2/thumbnail/360x360/format/webp/quality/100',
+      },
+      {
+        name: 'food.jpeg',
+        url: 'https://fuss10.elemecdn.com/3/63/4e7f3a15429bfda99bce42a18cdd1jpeg.jpeg?imageMogr2/thumbnail/360x360/format/webp/quality/100',
+      },
+    ],
+    decreaseImageEntityList: [], //处理好的图片数据
+  }); //首页新增表单
+  const IndexException = ref([]); //异常类型下拉选择
+  const DiscoveringNodes = ref([]); //发现节点下拉选择
+  const warehouseData = ref([]); //处理方
+  const SelectType = ref(null); //类型
+  const StateType = ref(true); //类型
+  const HistoricalPackageinput = ref(''); //历史包件选择
+  const dialogImageUrl = ref(null); //图片
+  const dialogVisible = ref(null); //图片
+  const groundlineSet = ref(true); //干线条件都满足
+  const groundlineType = ref(null); //干线状态
+  const ShortageState = ref(false); //少货件数弹窗状态
+  const fleeingState = ref(false); //窜货件数弹窗
+  const ShortageList = ref([]); //少货件数
+  const fleeingList = ref([]); //窜货件数
+  const valueStrictly = ref();
+  const routerID = ref(null); //路由参数ID
+  const routerState = ref(''); //路由状态
+  const personResponsibleList = ref([]); //责任人列表
+  const companyProportion = ref(0); //公司占比
+  const identifying = ref(1); //订单，零担状态
+  const dialogHistoricalPackage = ref(false); //历史包件弹窗
+  const HistoricalPackageList = ref([]); //历史包件数组
+  const HistorIndex = ref(0); //历史包件索引
+  const PackageInfo = ref([
+    //包件信息
+    { packageCode: '', orderCode: '', waybillNumber: '' },
+  ]);
+  // 责任方列表
+  const FangAddList = ref([
+    { businessName: '', personResponsibleName: '', responsibilityRatio: '', description: '' },
+  ]);
+  // 提货责任方
+  const responsible = ref([
+    {
+      value: '1',
+      label: '工厂',
+    },
+    {
+      value: '2',
+      label: '外包搬运',
+    },
+    {
+      value: '3',
+      label: '物流',
+    },
+  ]);
+  
+  const DeliveryDriver = ref([
+    {
+      value: '0',
+      label: '兰溪',
+    },
+    {
+      value: '1',
+      label: '李华',
+    },
+    {
+      value: '2',
+      label: '唐飞',
+    },
+  ]);
+  // 图片列表
+  const fileList = ref([]);
+  // 字典公共函数
+  function updateDictionary(targetArray, dictionaryType) {
+    getDictionaryBiz(dictionaryType).then(res => {
+      console.log(res, '字典');
+      res.data.data.forEach(item => {
+        targetArray.push({
+          value: item.dictKey,
+          label: item.dictValue,
+        });
+      });
+    });
+  }
+  // 图片上传必须携带TOKEN
+  const headers = computed(() => {
+    return { 'Blade-Auth': 'Bearer ' + getToken() };
+  });
+  // 图片上传接口
+  const doubledCount = computed(() => {
+    return '/api/blade-resource/oss/endpoint/put-file';
+  });
+  // 图片上传接口
+  
+  // 图片上传成功回调函数
+  const ImgSuccess = (response, uploadFile) => {
+    if (response.success === true) {
+      console.log(response);
+      Indexform.value['packList'].push({
+        name: response.data.originalName,
+        url: response.data.link,
+      });
+      console.log(Indexform.value['packList'], '图片列表');
+    }
+  };
+  
+  // 上传图片规则
+  const beforeAvatarUpload = rawFile => {
+    if (rawFile.type !== 'image/png') {
+      ElMessage.error('图片格式只能为image/png!');
+      return false;
+    } else if (rawFile.size / 1024 / 1024 > 2) {
+      ElMessage.error('图片大小不能大于2MB!');
+      return false;
+    }
+    return true;
+  };
+  // 点击图片列表回调
+  const pictureList = val => {
+    console.log(val, '图片列表');
+  };
+  // 点击图片移除
+  const ImgListRemove = val => {
+    console.log(val, '移除图片');
+  };
+  // 处理方和责任方获取数据
+  const handle = () => {
+    getDeptWarehouse().then(res => {
+      res.data.data.forEach(item => {
+        warehouseData.value.push({
+          value: item.id,
+          label: item.name,
+        });
+      });
+    });
+  };
+  
+  // 获取当前责任方的责任人
+  const ResponsiblePartychange = (val, index) => {
+    FangAddList.value[index].personResponsibleName = null; //清空当前选择的责任人
+    $_getBusinessDepartmentUser({
+      warehouseId: val,
+    }).then(res => {
+      console.log(res, '获取责任人列表');
+      personResponsibleList.value = res.data.data;
+    });
+  };
+  const onLoad = () => {
+    console.log($route.query.id, '页面初始化');
+    routerState.value = $route.query.routerState;
+    updateDictionary(IndexException.value, 'pc_work_order'); //异常类型
+    updateDictionary(DiscoveringNodes.value, 'pc_discovery_node'); //发现环节
+    handle(); //处理方和责任方信息
+  };
+  onLoad(); //初始化程序
+  // 异常类型事件
+  const abnormalChange = val => {
+    console.log(val, '异常事件类型');
+    console.log(StateType.value);
+    StateType.value = false;
+    if (val == 1 || val == 2 || val == 3) {
+      SelectType.value = val;
+    } else {
+      StateType.value = true;
+    }
+    // 运损无数据默认0
+    if (val == 1) {
+      Indexform.value.packageCode = 0;
+    } else {
+      Indexform.value.packageCode = null;
+    }
+  };
+  
+  // 发现节点事件
+  const DiscoveringNodesChange = val => {
+    groundlineSet.value = false; //干线条件都不满足
+    if (val == 1 || val == 2 || val == 3 || val == 4 || val == 5 || val == 8 || val == 7) {
+      groundlineType.value = val; //干线状态
+      console.log(val);
+    } else {
+      groundlineSet.value = true; //展示所有搜索框
+    }
+  };
+  
+  // 照片
+  const handleRemove = (uploadFile, uploadFiles) => {
+    console.log(uploadFile, uploadFiles);
+  };
+  
+  const handlePictureCardPreview = uploadFile => {
+    dialogImageUrl.value = uploadFile.url;
+    dialogVisible.value = true;
+  };
+  
+  // 添加包件
+  const AddPackage = () => {
+    PackageInfo.value.push({ packageCode: '', orderCode: '', waybillNumber: '' });
+  };
+  // 包件移除
+  const PackagRemoval = val => {
+    PackageInfo.value.splice(val, 1); //移除当前点击的按钮
+  };
+  // 责任方添加
+  const responsibleParty = () => {
+    FangAddList.value.push({
+      businessName: '',
+      personResponsibleName: '',
+      responsibilityRatio: '',
+      description: '',
+    });
+  };
+  // 责任移除
+  const ResponsibilityRemoval = val => {
+    FangAddList.value.splice(val, 1); //移除当前点击的按钮
+  };
+  // 顶部标签切换
+  const TopChange = val => {
+    console.log(val);
+    if (val == 0) {
+      identifying.value = 1;
+    } else {
+      identifying.value = 2;
+    }
+  };
+  
+  //表单提交
+  const ConfirmForm = () => {
+    // 图片类型:10运损,20窜货
+    // decreaseImageEntityList:[
+    //   {imageType:10,imageName:'图片名称',imagePath:'图片路径'},
+    //   {imageType:10,imageName:'图片名称',imagePath:'图片路径'},
+    // ]
+    console.log(Indexform.value['packList'], '图片列表');
+    // 处理图片(当类型为货损或为窜货才执行下面的东西)
+    if (SelectType.value == 1 || SelectType.value == 3) {
+      if (Indexform.value['packList']) {
+        Indexform.value['packList'].forEach(item => {
+          Indexform.value['decreaseImageEntityList'].push({
+            imageType: SelectType.value == 1 ? 10 : SelectType.value == 3 ? 20 : '',
+            imageName: item.name,
+            imagePath: item.url,
+          });
+        });
+      }
+    }
+  
+    console.log(Indexform.value['decreaseImageEntityList'], '处理好的图片');
+    //司机信息处理
+    if (Indexform.value.deliveryDriver) {
+      Indexform.value.deliveryDriver = DeliveryDriver.value.find(
+        item => item.value == Indexform.value.deliveryDriver
+      ).label;
+    }
+  
+    console.log(Indexform.value.deliveryDriver); // 输出李华
+    let processorEntityList = [];
+  
+    //处理方信息处理
+    if (Indexform.value.processor.length) {
+      Indexform.value.processor.forEach(item => {
+        let found = warehouseData.value.find(element => element.value == item.toString());
+        processorEntityList.push({
+          businessName: found ? found.label : '',
+          businessId: item,
+          conditions: 1,
+          typesOf: 2,
+        });
+      });
+    }
+  
+    // 提货责任方
+    // if (Indexform.value.businessMame) {
+    //   const found = responsible.value.find(item => item.value === Indexform.value.businessMame);
+    //   if (found) {
+    //     processorEntityList.push({
+    //       businessName: found.label,
+    //       businessId: found.id,
+    //       conditions: 1,
+    //       typesOf: 1,
+    //     });
+    //   }
+    // }
+    //  提货责任方
+  
+    console.log(Indexform.value.businessMame, '提货责任方');
+    let DataSubmit = {
+      personResponsibleDTO: [],
+      packageEntityList: [], ////包件信息
+      ...Indexform.value,
+    }; //解构表单参数
+    DataSubmit.processorEntityList = processorEntityList;
+    DataSubmit.decreaseImageEntityList = JSON.parse(
+      JSON.stringify(Indexform.value['decreaseImageEntityList'])
+    );
+  
+    // 包件信息
+    // packageEntityList
+  
+    DataSubmit['packageEntityList'].push({
+      workOrderId: Indexform.workOrderNumber, //异常ID
+      number: PackageInfo.value.length, //数量
+      packageCode: PackageInfo.value.map(item => item.packageCode).join(','), //包件码
+      warehouseId: '', //仓库ID
+      packageImage: Indexform.value['packList'].map(item => item.url).join(','), //包件图片路径
+      waybillNumber: PackageInfo.value.map(item => item.waybillNumber).join(','), //运单号
+      orderCode: PackageInfo.value.map(item => item.orderCode).join(','), //订单自编码
+    });
+    DataSubmit.orderCode = PackageInfo.value.map(item => item.orderCode).join(','); //订单自编码
+    // 总件数
+    Indexform.value.number = PackageInfo.value.length;
+    console.log(DataSubmit['packageEntityList'], '包件信息');
+    // 调查经过
+    DataSubmit.surveyRecordDTO = {
+      content: Indexform.value.investigationPocess,
+      workOrderId: Indexform.value.workOrderNumber,
+    };
+    console.log(DataSubmit.surveyRecordDTO, '调查经过');
+    // 新责任方处理
+    // FangAddList.value
+  
+    // 责任方信息
+    FangAddList.value.forEach(item => {
+      DataSubmit['personResponsibleDTO'].push({
+        businessName: warehouseData.value.find(obj => obj.value == item.businessName)?.label || null, //责任方名称  
+        businessId: warehouseData.value.find(obj => obj.value == item.businessName)?.value || null,
+        wordOrderId: Indexform.value.workOrderNumber, //异常工单ID
+        description: item.description,
+        personResponsibleId:
+          personResponsibleList.value.find(obj => obj.id == item.personResponsibleName)?.id || null, //责任人ID   personResponsibleList
+        personResponsibleName:
+          personResponsibleList.value.find(obj => obj.id == item.personResponsibleName)?.name || null, //责任人名称
+        responsibilityRatio: item.responsibilityRatio, //责任比例
+      });
+    });
+    let proportion = 0; //责任比例之和
+    DataSubmit['personResponsibleDTO'].forEach(item => {
+      proportion += Number(item.responsibilityRatio);
+    });
+    console.log(proportion, '责任比例之和');
+    companyProportion.value = 100 - proportion;
+    DataSubmit.companyProportion = companyProportion.value; //公司占比
+    console.log(DataSubmit.companyProportion, '公司占比');
+    console.log(DataSubmit['personResponsibleDTO'], '新责任方处理的数据');
+    //console.log(Indexform.value.duty.length);
+    //责任方信息处理
+    if (FangAddList.value.length) {
+      console.log(warehouseData.value, 'warehouseData.value');
+      FangAddList.value.forEach(item => {
+        console.log(item, 'item');
+        processorEntityList.push({
+          businessName:
+            warehouseData.value.find(obj => obj.value == item.businessName)?.label || null,
+          businessId: item.businessName,
+          conditions: 1,
+          typesOf: 1,
+        });
+      });
+    }
+    DataSubmit.identifying = identifying.value; //1订单2零担3库存品
+  
+    console.log(processorEntityList, '老责任方处理好的数据');
+  
+    // //责任方信息处理
+    // if (Indexform.value.duty.length) {
+    //   Indexform.value.forEach(item => {
+    //     let found = warehouseData.value.find(element => element.value == item.toString());
+    //     processorEntityList.push({
+    //       businessName: found ? found.label : '',
+    //       businessId: item,
+    //       conditions: 1,
+    //       typesOf: 1,
+    //     });
+    //   });
+    // }
+  
+    delete DataSubmit.duty, //移除多余字段
+      delete DataSubmit.packList; //移除图片原始字段
+    delete DataSubmit.processor; //移除多余字段
+    console.log(DataSubmit, '处理好的数据');
+    //提交表单信息stringify
+    $_submit(DataSubmit).then(res => {
+      if (res.data.code == 200) {
+        ElMessage({
+          message: res.data.msg,
+          type: 'success',
+        });
+        Indexform.value = {}; //重置表单
+        $router.push('/aftersales/aftersalesWorkOrder'); //添加成功跳转到列表
+      }
+    });
+  };
+  
+  // 少货件数对应事件
+  const ShortageTtems = val => {
+    ShortageList.value = []; //进入之前重置参数
+    const pattern = /\s+/g;
+    const result = val.replace(pattern, '');
+    console.log(result); // 输出 "33"
+    Indexform.value.number = result;
+    if (Indexform.value.number > 1) {
+      ShortageState.value = true; //数量大于1，开启弹窗输入
+    }
+    for (let i = 0; i < val; i++) {
+      ShortageList.value.push({
+        number: i + 1, //件数
+        packageCode: null, //输入框
+      });
+    }
+  };
+  // 少货关闭回调
+  const ShortageStateFun = () => {
+    ShortageList.value.forEach(item => {
+      if (item.packageCode == null) {
+        Indexform.value.number = null;
+      }
+    });
+  };
+  // 少货按钮取消
+  const ShortageCancellation = () => {
+    Indexform.value.number = null; //少货件数
+    ShortageList.value = []; //进入之前重置参数
+    ShortageState.value = false; //关闭弹窗
+  };
+  // 窜货关闭回调
+  const fleeingFun = () => {
+    fleeingList.value.forEach(item => {
+      if (item.packageCode == null) {
+        Indexform.value.number = null;
+      }
+    });
+  };
+  // 窜货取消事件
+  const fleeingCancellation = () => {
+    Indexform.value.number = null; //少货件数
+    fleeingList.value = []; //进入之前重置参数
+    fleeingState.value = false; //关闭弹窗
+  };
+  // 窜货输入框
+  const fleeingTtems = val => {
+    fleeingList.value = []; //进入之前重置参数
+    const pattern = /\s+/g;
+    const result = val.replace(pattern, '');
+    console.log(result); // 输出 "33"
+    Indexform.value.number = result;
+    if (Indexform.value.number > 1) {
+      fleeingState.value = true; //数量大于1，开启弹窗输入
+    }
+    for (let i = 0; i < val; i++) {
+      fleeingList.value.push({
+        number: i + 1, //件数
+        packageCode: null, //输入框
+      });
+    }
+  };
+  // 少货编辑
+  const moneyBtnA = () => {
+    if (!Indexform.value.number) {
+      ElMessage({
+        message: '请输入少货数量',
+        type: 'warning',
+      });
+      return;
+    }
+    ShortageState.value = true; //开启弹窗输入
+  };
+  // 窜货编辑
+  const moneyBtnB = () => {
+    if (!Indexform.value.number) {
+      ElMessage({
+        message: '请输入窜货数量',
+        type: 'warning',
+      });
+      return;
+    }
+    fleeingState.value = true; //开启弹窗输入
+  };
+  // 查询包件信息自动回显
+  const ChangePackageInfo = (val, index) => {
+    let data = {
+      packageCode: val,
+    };
+    $_getAbnormalPackage(data).then(res => {
+      console.log(res, '包件信息');
+      console.log(res.data.data, '包件信息');
+      if (res.data.data.length) {
+        const packageData = res.data.data[0];
+        PackageInfo.value[index].orderCode = packageData.orderCode; //订单自编码
+        PackageInfo.value[index].waybillNumber = packageData.waybillNumber; //运单号
+        PackageInfo.value[index].orderId = packageData.orderId; //运单号
+        PackageInfo.value[index].state = false; //状态
+  
+        if (res.data.data.length > 1) {
+          HistoricalPackageList.value = res.data.data;
+          PackageInfo.value[index].state = true; //状态
+        }
+      }
+      // packageCode; //包件码
+      // //订单自编码
+      // orderCode: orderId; //运单号
+      // workOrderId; //工单id
+      // workOrderNumber; //工单名称
+      console.log(PackageInfo.value, '处理好的参数');
+    });
+  };
+  
+  // 查看历史包件
+  const historicalPackages = val => {
+    dialogHistoricalPackage.value = true; //打开历史包件弹窗
+    HistorIndex.value = val;
+    console.log(val);
+  };
+  // 历史包件确定选择
+  const HistoricalPackage = val => {
+    let info = HistoricalPackageList.value.find(obj => obj.workOrderId == val);
+    PackageInfo.value[HistorIndex.value].orderCode = info.orderCode; //订单自编码
+    PackageInfo.value[HistorIndex.value].waybillNumber = info.waybillNumber; //运单号
+    PackageInfo.value[HistorIndex.value].orderId = info.orderId; //运单号
+    dialogHistoricalPackage.value = false; //关闭历史包件弹窗
+  
+    PackageInfo.value[HistorIndex.value].relatedWorkOrdersId = info.workOrderId;
+    console.log(PackageInfo.value, '处理好的参数');
+  };
+  // 历史包件里面的查看
+  const ViewPackageDetails = val => {
+    if (!val) {
+      ElMessage({
+        message: '请选择要查看的数据',
+        type: 'warning',
+      });
+      return;
+    }
+    console.log(val);
+    let info = HistoricalPackageList.value.find(obj => obj.workOrderId == val);
+    console.log(info, '筛选的值');
+    $router.push({
+      path: '/aftersales/aftersalesWorkOrderInfo',
+      query: {
+        id: info.workOrderId,
+        name: info.workOrderId + '-信息查看',
+        routerState: 'view',
+      },
+    });
+    dialogHistoricalPackage.value = false; //打开历史包件弹窗
+  };
+  </script>
+  
+  <style scoped lang="scss">
+  .IndexFrom {
+    display: flex;
+    flex-wrap: wrap;
+    justify-content: flex-start;
+  
+    .el-form-item {
+      height: 46px;
+      display: flex;
+      align-items: center;
+      margin: 0;
+      margin-bottom: 18px;
+      flex: 1 0 30%;
+      :deep(.el-form-item__label) {
+        width: 100px !important;
+        justify-content: flex-start;
+      }
+    }
+    :deep(.el-form-item__content) {
+      height: 100%;
+      width: 70% !important;
+      flex: none;
+      .el-input {
+        height: 100% !important;
+        display: flex;
+        align-items: center;
+      }
+    }
+    .el-input__wrapper {
+      height: 32px !important;
+    }
+    :deep(.el-input) {
+      width: 100% !important;
+    }
+    :deep(.el-input__wrapper) {
+      height: 30px !important;
+    }
+    :deep(.el-select) {
+      width: 100%;
+    }
+    :deep(.el-form-item__label) {
+      margin-left: 20px;
+    }
+  }
+  .el_clzr {
+    margin-top: 40px;
+  
+    :deep(.el-select) {
+      width: 100%;
+    }
+    :deep(.el-input) {
+      height: 38px;
+    }
+    :deep(.el-form-item__label) {
+      margin-left: 20px;
+      font-size: 14px;
+      width: 100px !important;
+    }
+    .el-form-item {
+      margin: 0;
+      margin-bottom: 34px;
+    }
+    :deep(.el-input__wrapper) {
+      height: 35px !important;
+    }
+    :deep(.el-form-item__content) {
+      height: 100%;
+      width: 90% !important;
+      flex: none;
+      .el-input {
+        height: 100% !important;
+        display: flex;
+        align-items: center;
+      }
+    }
+  }
+  .Transport_damage_photos {
+    display: flex;
+    padding: 0 15px;
+    margin-top: 20px;
+    .title {
+      width: 100px;
+      display: block;
+      margin-bottom: 10px;
+      font-size: 14px;
+    }
+  }
+  .dialog-footer {
+    width: 100%;
+    display: flex;
+    justify-content: flex-end;
+    padding: 0 10px;
+    box-sizing: border-box;
+    padding-right: 36px;
+  }
+  .investigate {
+    :deep(.el-form-item__content) {
+      width: 90% !important;
+      box-sizing: border-box;
+    }
+  }
+  .ShortageStatenum {
+    display: flex;
+    align-items: center;
+    margin-bottom: 10px;
+    .title {
+      width: 80px;
+    }
+    .remove {
+      width: 47px;
+      display: flex;
+      align-items: center;
+      justify-content: center;
+      cursor: pointer;
+      color: #ff0000;
+    }
+  }
+  .moneyNum {
+    display: flex;
+    flex: 1;
+    .el_btn {
+      width: 50px;
+      display: flex;
+      align-items: center;
+      justify-content: center;
+      border: 1px solid #ccc;
+      margin-left: 3px;
+      border-radius: 4px;
+      cursor: pointer;
+    }
+  }
+  .ResponsibilityBox {
+    width: 100%;
+    display: flex;
+    flex-direction: column;
+    .leftbox {
+      width: 80%;
+      display: flex;
+      justify-content: space-between;
+    }
+    .maxBox {
+      display: flex;
+      align-items: center;
+      width: 30%;
+      margin-right: 16px;
+      .title {
+        width: 80px;
+        font-size: 14px;
+        color: #606266;
+      }
+      .el-select {
+        width: 100%;
+      }
+    }
+    .el-btn {
+      margin-left: 5%;
+      border: none;
+    }
+    .el_btbox {
+      display: flex;
+      margin-top: 10px;
+    }
+  }
+  .ResponsibilityBoxS {
+    width: 100%;
+    display: flex;
+    flex-direction: column;
+    margin-bottom: 10px;
+    .leftbox {
+      width: 80%;
+      display: flex;
+      justify-content: space-between;
+    }
+    .maxBox {
+      display: flex;
+      align-items: center;
+      width: 30%;
+      .title {
+        width: 140px;
+        color: #606266;
+        font-size: 14px;
+      }
+      .el-select {
+        width: 100%;
+      }
+    }
+    .el-btn {
+      margin-left: 5%;
+      border: none;
+    }
+    .el_btbox {
+      display: flex;
+      margin-top: 10px;
+    }
+  }
+  .PackageInformation {
+    margin-bottom: 10px;
+  }
+  .NumTotal {
+    width: 30%;
+    margin-top: 16px;
+    display: flex;
+    align-items: center;
+    span {
+      width: 120px;
+      font-size: 14px;
+    }
+  }
+  .Proportion {
+    margin-top: 16px;
+    .title {
+      font-size: 14px;
+      color: #606266;
+    }
+  }
+  
+  :deep(.is-active) {
+    border-bottom: 1px solid #e4e7ed !important;
+  }
+  .topClass {
+    :deep(.el-tabs__content) {
+      padding: 0;
+    }
+  }
+  .foot_btn {
+    position: fixed;
+    bottom: 0;
+    left: 50%;
+    transform: translate(0, -50%);
+    width: 100%;
+    height: 40px;
+    background-color: #ffffff;
+    border-top: 1px solid #fff;
+    box-shadow: 3px -1px 1px #ccc;
+    display: flex;
+    align-items: center;
+    padding-left: 10px;
+  }
+  :deep(.el-card__body) {
+    margin-bottom: 50px;
+  }
+  </style>
+  
\ No newline at end of file