生产中订单删除流程

src/views/subsidiary/order/management/index.vue

@@ -1,37 +1,61 @@
 <template>
-  <div>
-    <el-card class="box-card">
-      <byTable
-        :source="sourceList.data"
-        :pagination="sourceList.pagination"
-        :config="config"
-        :loading="loading"
-        :searchConfig="searchConfig"
-        highlight-current-row
-        :action-list="[
-          judgeRoles()
-            ? {
-                text: '新建订单',
-                action: () => clickAddOrder(),
-              }
-            : {},
-        ]"
-        @get-list="getList"
-        @clickReset="clickReset">
-        <template #code="{ item }">
-          <div>
-            <a style="color: #409eff; cursor: pointer; word-break: break-all" @click="clickCode(item)">{{ item.code }}</a>
-          </div>
-        </template>
-        <template #totalAmount="{ item }">
-          <div style="color: #409eff">{{ moneyFormat(item.totalAmount) }}</div>
-        </template>
-        <template #address="{ item }">
-          <div>{{ item.province }}, {{ item.city }}, {{ item.county }}, {{ item.detailedAddress }}</div>
-        </template>
-      </byTable>
-    </el-card>
-  </div>
+  <el-card class="box-card">
+    <byTable
+      :source="sourceList.data"
+      :pagination="sourceList.pagination"
+      :config="config"
+      :loading="loading"
+      :searchConfig="searchConfig"
+      highlight-current-row
+      :action-list="[
+        judgeRoles()
+          ? {
+              text: '新建订单',
+              action: () => clickAddOrder(),
+            }
+          : {},
+      ]"
+      @get-list="getList"
+      @clickReset="clickReset">
+      <template #code="{ item }">
+        <div>
+          <a style="color: #409eff; cursor: pointer; word-break: break-all" @click="clickCode(item)">{{ item.code }}</a>
+        </div>
+      </template>
+      <template #totalAmount="{ item }">
+        <div style="color: #409eff">{{ moneyFormat(item.totalAmount) }}</div>
+      </template>
+      <template #address="{ item }">
+        <div>{{ item.province }}, {{ item.city }}, {{ item.county }}, {{ item.detailedAddress }}</div>
+      </template>
+    </byTable>
+
+    <el-dialog title="订单删除申请" v-if="openApplyForCancellation" v-model="openApplyForCancellation" width="600" style="margin-top: 20vh !important">
+      <el-form :model="formData.data" label-width="120px" :rules="rules" ref="submit">
+        <el-form-item label="订单删除原因:" prop="remark">
+          <el-input v-model="formData.data.remark" :rows="4" type="textarea" placeholder="请输入订单删除原因" />
+        </el-form-item>
+      </el-form>
+      <template #footer>
+        <el-button @click="openApplyForCancellation = false" size="large">取 消</el-button>
+        <el-button type="primary" @click="clickSubmit()" size="large" v-preReClick>确 认</el-button>
+      </template>
+    </el-dialog>
+
+    <el-dialog title="下一处理人" v-if="openSelectUser" v-model="openSelectUser" width="500" style="margin-top: 20vh !important">
+      <el-form :model="formData.data" label-width="100px" :rules="rules" ref="submitUser">
+        <el-form-item label="处理人:" prop="handleUserId">
+          <el-select v-model="formData.data.handleUserId" placeholder="请选择处理人" filterable style="width: 100%">
+            <el-option v-for="item in userList" :key="item.userId" :label="item.nickName" :value="item.userId" />
+          </el-select>
+        </el-form-item>
+      </el-form>
+      <template #footer>
+        <el-button @click="openSelectUser = false" size="large">取 消</el-button>
+        <el-button type="primary" @click="clickSubmitUser()" size="large" v-preReClick>确 认</el-button>
+      </template>
+    </el-dialog>
+  </el-card>
 </template>
 
 <script setup>
@@ -331,6 +355,19 @@ const config = computed(() => {
                 },
               }
             : {},
+          row.status == 30
+            ? {
+                attrs: {
+                  label: "申请订单取消",
+                  type: "danger",
+                  text: true,
+                },
+                el: "button",
+                click() {
+                  clickApplyForCancellation(row);
+                },
+              }
+            : {},
         ];
       },
     },
@@ -426,6 +463,59 @@ const judgeRoles = () => {
   }
   return status;
 };
+const openApplyForCancellation = ref(false);
+const formData = reactive({
+  data: {
+    flowKey: "order_delete",
+    remark: "",
+    handleUserId: "",
+    data: {
+      id: "",
+    },
+  },
+});
+const rules = ref({
+  remark: [{ required: true, message: "请输入订单删除原因", trigger: "blur" }],
+  handleUserId: [{ required: true, message: "请选择处理人", trigger: "change" }],
+});
+const clickApplyForCancellation = (row) => {
+  formData.data.remark = "";
+  formData.data.handleUserId = "";
+  formData.data.data.id = row.id;
+  openApplyForCancellation.value = true;
+};
+const userList = ref([]);
+const openSelectUser = ref(false);
+const clickSubmit = () => {
+  proxy.$refs.submit.validate((valid) => {
+    if (valid) {
+      proxy.post("/flowProcess/initiate", formData.data).then((res) => {
+        if (res !== null && res.success) {
+          ElMessage({ message: "提交成功", type: "success" });
+          openApplyForCancellation.value = false;
+        } else {
+          userList.value = res.userList;
+          openSelectUser.value = true;
+        }
+      });
+    }
+  });
+};
+const clickSubmitUser = () => {
+  proxy.$refs.submitUser.validate((valid) => {
+    if (valid) {
+      proxy.post("/flowProcess/initiate", formData.data).then((res) => {
+        if (res !== null && res.success) {
+          ElMessage({ message: "提交成功", type: "success" });
+          openApplyForCancellation.value = false;
+          openSelectUser.value = false;
+        } else {
+          ElMessage("流程提交失败");
+        }
+      });
+    }
+  });
+};
 </script>
 
 <style lang="scss" scoped>