订单列表转异入口及弹层组件,待对接接口

src/views/ecw/order/components/TurnException.vue

+<script>
+import imageUpload from '@/components/ImageUpload/index.vue'
+
+export default {
+  name: 'TurnException',
+  components: { imageUpload },
+  props:{
+    orderNo: {
+      type: String,
+      default: ''
+    },
+  },
+  data(){
+    return {
+      showDialog: false,
+      form: {
+        manualExceptionType: [],
+        exceptionUrls: [],
+        descZh: ''
+      }
+    }
+  },
+  computed:{
+    rules(){
+      return {
+        manualExceptionType: [
+          { required: true, message: this.$t("请勾选原因类型"), trigger: "change" },
+          {
+            validator: (rule, value, callback) => {
+              if (value.length <= 0) {
+                callback(new Error("请勾选原因类型"));
+              }
+              callback();
+            },
+            trigger: "change",
+          },
+        ],
+      }
+    }
+  },
+  methods:{
+    handleException(){
+      this.$refs.form.validate((valid) => {
+        if (valid) {
+          this.handleSubmit();
+        }
+      });
+    },
+    handleSubmit(){
+      this.showDialog = false
+      this.$emit('done')
+    },
+    handleCancel(){
+      this.showDialog = false
+      this.$emit('cancel')
+    },
+    show(){
+      this.showDialog = true
+      // 初始化表单
+      for(const key in Object.keys(this.form)){
+        this.form[key] = this.form[key] instanceof Array ? [] : ''
+      }
+    }
+  }
+}
+</script>
+
+<template>
+  <el-dialog
+    :title="orderNo + $t('订单转异')"
+    center
+    :visible="showDialog"
+    @close="handleCancel"
+  >
+    <el-form
+      label-position="top"
+      label-width="200"
+      ref="form"
+      :model="form"
+      :rules="rules"
+    >
+      <el-form-item :label="$t('原因类型')" prop="manualExceptionType">
+        <dict-selector
+          v-model="form.manualExceptionType"
+          form-type="checkbox"
+          :type="DICT_TYPE.MANUAL_EXCEPTION_TYPE"
+          multiple
+        ></dict-selector>
+      </el-form-item>
+      <el-form-item :label="$t('附件')">
+        <image-upload v-model="form.exceptionUrls"></image-upload>
+      </el-form-item>
+      <el-form-item :label="$t('详细信息')">
+        <el-input v-model="form.descZh" type="textarea"></el-input>
+      </el-form-item>
+    </el-form>
+    <span slot="footer" class="dialog-footer">
+        <el-button type="primary" @click="handleException">{{
+            $t("确认并完成入仓")
+          }}</el-button>
+        <el-button @click="handleCancel">{{ $t("取消") }}</el-button>
+      </span>
+  </el-dialog>
+</template>
+
+<style scoped lang="scss">
+
+</style>

src/views/ecw/order/index.vue

@@ -666,15 +666,6 @@
                     >{{ $t("取消订单") }}</el-dropdown-item
                   >
                 </template>
-                <!--lanbm 2024-06-19 添加的转异功能-->
-                <template v-if="false">
-                  <el-dropdown-item
-                    @click.native="oprateOrder2(scope.row, 'cancelOrder')"
-                    >{{ $t("转异") }}</el-dropdown-item
-                  >
-                </template>
-                <!--lanbm 2024-06-19 添加的转异功能-->
-                <!-- 恢复 -->
                 <!-- <el-dropdown-item @click.native="oprateOrder(scope.row.orderId, 'recoveryOrder')" >{{$t('恢复订单')}}</el-dropdown-item>-->
 
                 <!-- 费用申请 -->
@@ -871,6 +862,13 @@
                     >{{ $t("不可出") }}</el-dropdown-item
                   >
                 </template>
+
+                <!--转异-->
+                <el-dropdown-item
+                  @click.native="handleException(scope.row)"
+                  v-hasPermi="['ecw:order:turnException']"
+                >{{ $t("转异") }}</el-dropdown-item
+                >
               </el-dropdown-menu>
             </el-dropdown>
 
@@ -1215,43 +1213,12 @@
         getList();
       "
     ></SplitRevoke>
-
-    <!--转异对话框 lanbm 2024-06-19 添加注释-->
-    <el-dialog
-      :title="order.orderNo + $t('订单转异')"
-      center
-      :visible.sync="errorShow"
-    >
-      <el-form
-        label-position="top"
-        label-width="200"
-        ref="exceptionForm"
-        :model="form2"
-        :rules="exceptionRules"
-      >
-        <el-form-item :label="$t('原因类型')" prop="manualExceptionType">
-          <dict-selector
-            v-model="form2.manualExceptionType"
-            form-type="checkbox"
-            :type="DICT_TYPE.MANUAL_EXCEPTION_TYPE"
-            multiple
-          ></dict-selector>
-        </el-form-item>
-        <el-form-item :label="$t('附件')">
-          <image-upload v-model="form2.exceptionUrls"></image-upload>
-        </el-form-item>
-        <el-form-item :label="$t('详细信息')">
-          <el-input v-model="form2.descZh" type="textarea"></el-input>
-        </el-form-item>
-      </el-form>
-      <span slot="footer" class="dialog-footer">
-        <el-button type="primary" @click="handleException">{{
-          $t("提交保存")
-        }}</el-button>
-        <el-button @click="handleExceptionClose">{{ $t("取消") }}</el-button>
-      </span>
-    </el-dialog>
-    <!--转异对话框 lanbm 2024-06-19 添加注释-->
+    <turn-exception
+      v-if="!!tureExceptionOrder"
+      ref="turnException"
+      :order-no="tureExceptionOrder.orderNo"
+      @done="handleTurnExceptionDone"
+      @cancel="handleExceptionClose"></turn-exception>
   </div>
 </template>
 
@@ -1313,9 +1280,11 @@ import SplitRevoke from "@/views/ecw/order/components/SplitRevoke";
 import { getChannelList } from "@/api/ecw/channel";
 import Template from "@/views/cms/template/index.vue";
 import { getDictDatas } from "@/utils/dict";
+import TurnException from '@/views/ecw/order/components/TurnException.vue'
 export default {
   name: "EcwOrderIndex",
   components: {
+    TurnException,
     Template,
     UserSelector,
     FeeApplication,
@@ -1426,21 +1395,8 @@ export default {
         key: "prodKey",
         value: "",
       },
-      //转异用到的参数信息 lanbm 2024-06-19 add
-      order: {
-        orderNo: undefined,
-      },
-      form2: {
-        orderSpecialNeedReceivableReqVoList: [],
-        orderLocationCreateReqVOList: [],
-        exceptionUrls: [],
-        descZh: "",
-        manualExceptionType: [],
-        urls: [],
-        sumVolume: "",
-        sumWeight: "",
-      },
-      //转异用到的参数信息 lanbm 2024-06-19 add
+      // 当前操作转异的订单
+      tureExceptionOrder: null
     };
   },
   watch: {
@@ -2124,12 +2080,17 @@ export default {
       this.order.orderNo = row.orderNo;
       this.errorShow = true;
     },
-    handleException() {
-      //保存异常信息 lanbm 2024-06-19 add
+    async handleException(order) {
+      this.tureExceptionOrder = order
+      await this.$nextTick()
+      this.$refs.turnException?.show()
+    },
+    handleTurnExceptionDone(){
+      this.tureExceptionOrder = null
+      this.getList()
     },
     handleExceptionClose() {
-      //关闭异常对话框
-      this.errorShow = false;
+      this.tureExceptionOrder =  null;
     },
   },
 };