From 17f902fa9dbbeb8634fded392265f4388e2189eb Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?=E5=A7=9C=E7=8E=89=E7=90=A6?=
 <7507756+jiang_yuqi@user.noreply.gitee.com>
Date: Sat, 9 Sep 2023 23:00:24 +0800
Subject: [PATCH] =?UTF-8?q?=E6=8F=90=E4=BA=A4=E4=BB=A3=E7=A0=81?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 .../mapper/flowable/FlowBusinessKeyMapper.xml |   1 +
 .../views/flowable/task/finished/index.vue    |  69 ++++--
 .../task/myProcess/detail/initTaskDrawer.vue  | 223 ------------------
 .../views/flowable/task/myProcess/index.vue   |  30 +++
 4 files changed, 86 insertions(+), 237 deletions(-)
 delete mode 100644 ruoyi-ui/src/views/flowable/task/myProcess/detail/initTaskDrawer.vue

diff --git a/ruoyi-system/src/main/resources/mapper/flowable/FlowBusinessKeyMapper.xml b/ruoyi-system/src/main/resources/mapper/flowable/FlowBusinessKeyMapper.xml
index 2ce008e9..625e1675 100644
--- a/ruoyi-system/src/main/resources/mapper/flowable/FlowBusinessKeyMapper.xml
+++ b/ruoyi-system/src/main/resources/mapper/flowable/FlowBusinessKeyMapper.xml
@@ -30,6 +30,7 @@
             vw_flow_all fa
         <where>
             <if test="procDefName != null  and procDefName != ''"> and fa.procDefName like concat('%', #{procDefName}, '%')</if>
+            <if test="businessKey != null  and businessKey != ''"> and fa.businessKey = #{businessKey}</if>
             <if test="businessKeyName != null  and businessKeyName != ''"> and fa.businessKeyName like concat('%', #{businessKeyName}, '%')</if>
             <if test="category != null  and category != ''"> and fa.category = #{category}</if>
             <if test="params.beginDate != null and params.beginDate != '' and params.endDate != null and params.endDate != ''"> and fa.createTime between #{params.beginDate} and #{params.endDate}</if>
diff --git a/ruoyi-ui/src/views/flowable/task/finished/index.vue b/ruoyi-ui/src/views/flowable/task/finished/index.vue
index b91c700d..540e2a19 100644
--- a/ruoyi-ui/src/views/flowable/task/finished/index.vue
+++ b/ruoyi-ui/src/views/flowable/task/finished/index.vue
@@ -10,6 +10,22 @@
           @keyup.enter.native="handleQuery"
         />
       </el-form-item>
+      <el-form-item label="所属项目" prop="businessKey" v-if="showPro">
+          <el-select
+            v-model="queryParams.businessKey"
+            placeholder="请选择所属项目"
+            filterable
+            clearable
+          >
+            <el-option
+              v-for="(item, index) in projectOptions"
+              :key="index"
+              :label="item.projectName"
+              :value="item.id"
+            >
+            </el-option>
+          </el-select>
+        </el-form-item>
       <el-form-item label="流程类型" prop="category">
         <el-select
           v-model="queryParams.category"
@@ -115,17 +131,16 @@
       :limit.sync="queryParams.pageSize"
       @pagination="getList"
     />
+    <detailDrawer ref="detailDrawer"></detailDrawer>
   </div>
 </template>
-
 <script>
 import { finishedList, getDeployment, delDeployment, addDeployment, updateDeployment, exportDeployment, revokeProcess } from "@/api/flowable/finished";
 import {myFinishedFlowTaskList} from "@/api/flowable/businessKey";
-
+import detailDrawer from "../myProcess/detail/detailDrawer.vue";
 export default {
   name: "Deploy",
-  components: {
-  },
+  components: { detailDrawer },
   dicts: ["sys_process_category"],
   data() {
     return {
@@ -154,6 +169,7 @@ export default {
         pageSize: 10,
         procDefName: null,
         category: null,
+        businessKey:null,
         params: null,  
       },
       // 表单参数
@@ -161,11 +177,14 @@ export default {
       // 表单校验
       rules: {
       },
-      daterangeCheckTime:[]
+      daterangeCheckTime:[],
+      showPro:false,
+      projectOptions: null,
     };
   },
   created() {
     this.getList();
+    this.initMyProject();
   },
   methods: {
     /** 查询流程定义列表 */
@@ -187,6 +206,16 @@ export default {
         this.loading = false;
       });
     },
+    // 查询和我相关的项目信息
+    initMyProject() {
+      // 获取项目列表的接口
+      this.$api.publics.getMyProjectList({}).then((response) => {
+        this.projectOptions = response.rows;
+        if (response.rows.length > 1) {
+          this.showPro = true;
+        }
+      });
+    },
     // 取消按钮
     cancel() {
       this.open = false;
@@ -235,21 +264,33 @@ export default {
     },
     /** 流程流转记录 */
     handleFlowRecord(row){
-      this.$router.push({ path: '/flowable/task/finished/detail/index',
-        query: {
-          procInsId: row.procInsId,
-          deployId: row.deployId,
-          taskId: row.taskId,
-      }})
+      this.$refs.detailDrawer.show(row);
+      // this.$router.push({ path: '/flowable/task/finished/detail/index',
+      //   query: {
+      //     procInsId: row.procInsId,
+      //     deployId: row.deployId,
+      //     taskId: row.taskId,
+      // }})
     },
     /** 撤回任务 */
     handleRevoke(row){
       const params = {
         instanceId: row.procInsId
       }
-      revokeProcess(params).then( res => {
-       this.$modal.msgSuccess(res.msg);
-        this.getList();
+      this.$confirm('是否确认撤回当前任务流程?', '提示', {
+          confirmButtonText: '确定',
+          cancelButtonText: '取消',
+          type: 'warning'
+      }).then(() => {
+        this.loading=true;
+        revokeProcess(params).then(res => {
+          this.$modal.msgSuccess("任务撤回成功");
+          this.loading = false;
+          //关闭并刷新列表
+          this.getList();
+        });
+      }).catch(() => {
+        console.log("取消操作");         
       });
     },
     /** 修改按钮操作 */
diff --git a/ruoyi-ui/src/views/flowable/task/myProcess/detail/initTaskDrawer.vue b/ruoyi-ui/src/views/flowable/task/myProcess/detail/initTaskDrawer.vue
deleted file mode 100644
index 9be9dbdd..00000000
--- a/ruoyi-ui/src/views/flowable/task/myProcess/detail/initTaskDrawer.vue
+++ /dev/null
@@ -1,223 +0,0 @@
-<template>
-  <div class="app-container">
-    <el-drawer
-      v-if="onOpen"
-      :visible.sync="onOpen"
-      ref="drawer"
-      direction="rtl"
-      size="60%"
-      @close="closeCallBack"
-      style="padding-left: 20px; padding-right: 20px"
-    >
-      <template slot="title">
-        <div>申请流程详情 【{{ title }}】</div>
-      </template>
-      <el-form
-        ref="form"
-        :model="form"
-        :rules="rules"
-        v-loading="loading"
-        label-width="120px"
-        style="padding-right: 35px"
-      >
-        <div class="canvas" ref="flowCanvas"></div>
-        <div class="maskLayer" />
-        <el-form-item label="所属项目">
-          {{ initData.projectName }}
-        </el-form-item>
-        <el-form-item label="发起单位">
-          {{ deptName }}
-        </el-form-item>
-        <el-form-item label="发起人">
-          {{ nickName }}
-        </el-form-item>
-        <el-form-item label="审批事项">
-          {{ title }}
-        </el-form-item>
-        <el-form-item label="审批内容" prop="files">
-          <FileUpload
-            @input="fileInput"
-            :limit="9"
-            :fileType="['pdf', 'png', 'jpg', 'jpeg', 'doc', 'docx', 'xls', 'xlsx']"
-          />
-        </el-form-item>
-        <el-form-item label="申请说明" prop="remark">
-          <el-input
-            type="textarea"
-            v-model="form.remark"
-            placeholder="请输入申请说明"
-            rows="5"
-          />
-        </el-form-item>
-      </el-form>
-      <div style="text-align: center">
-        <el-button type="primary" @click="submitForm">提交流程</el-button>
-        <el-button @click="doCanel">取 消</el-button>
-      </div>
-    </el-drawer>
-  </div>
-</template>
-
-<script>
-import store from "@/store";
-import { definitionStart, flowXmlAndNode } from "@/api/flowable/definition";
-import { CustomViewer as BpmnViewer } from "@/components/customBpmn";
-import { getNextFlowNodeByStart } from "@/api/flowable/todo";
-
-export default {
-  components: {},
-  props: {
-    closeCallBack: {
-      type: Function,
-    },
-  },
-  data() {
-    return {
-      // 抽屉层
-      onOpen: false,
-      // 遮罩层
-      loading: false,
-      // 标题
-      title: "",
-      // 表单参数
-      form: {
-        businessKey: "",
-        projectName: "",
-        files: "",
-        remark: "",
-      },
-      // 表单校验
-      rules: {
-        businessKey: [{ required: true, message: "请选择所属项目", trigger: "blur" }],
-        files: [{ required: true, message: "请上传申请内容", trigger: "blur" }],
-        remark: [
-          { required: false, message: "请输入申请说明", trigger: "blur" },
-          {
-            max: 500,
-            message: "申请说明最多输入500字",
-            trigger: "blur",
-          },
-        ],
-      },
-      projectOptions: null,
-      deptName: null,
-      nickName: null,
-      disPro: false,
-      bpmnViewer: null,
-      options: {},
-      taskTitle: null,
-      taskOpen: false,
-      daterangeMarksTime: [],
-    };
-  },
-  computed: {},
-  watch: {},
-  created() {},
-  mounted() {},
-  beforeDestroy() {},
-  methods: {
-    // 查询和我相关的项目信息
-    initMyProject() {
-      // 获取项目列表的接口
-      this.$api.publics.getMyProjectList({}).then((response) => {
-        this.projectOptions = response.rows;
-        if (response.rows.length == 0) {
-          this.$message.error("未查询到和您关联项目，请联系子公司或管理员...");
-        } else if (response.rows.length == 1) {
-          // 这里只有一个项目，默认选中并只读
-          this.form.businessKey = response.rows[0].id;
-          this.form.projectName = response.rows[0].projectName;
-        }
-      });
-    },
-    // 项目选择
-    projectChage(val) {
-      let projectName = "";
-      this.projectOptions.forEach((item) => {
-        if ((item.id = val)) {
-          projectName = item.projectName;
-          return;
-        }
-      });
-      this.form.projectName = projectName;
-    },
-    doCanel() {
-      this.onOpen = false;
-    },
-    show(options) {
-      this.options = options;
-      this.initMyProject();
-      this.title = options.name;
-      this.deptName = store.getters.dept.deptName;
-      this.nickName = store.getters.name;
-      const self = this;
-      this.onOpen = true;
-      flowXmlAndNode({ deployId: options.deploymentId }).then((res) => {
-        this.initFlowImage(res.data.xmlData);
-      });
-    },
-    async initFlowImage(data) {
-      try {
-        self.bpmnViewer = new BpmnViewer({
-          container: this.$refs.flowCanvas,
-          height: "150px",
-        });
-        await self.bpmnViewer.importXML(data);
-        // 自适应
-        self.bpmnViewer.get("canvas").zoom("fit-viewport", "auto");
-      } catch (err) {
-        console.error(err.message, err.warnings);
-      }
-    },
-    fileInput(files) {
-      let fileUrls = "";
-      if (files.length > 0) {
-        fileUrls = "";
-        files.forEach((item) => {
-          fileUrls += "," + item.url;
-        });
-        fileUrls = fileUrls.substring(1);
-      }
-      this.form.files = fileUrls;
-    },
-    submitForm() {
-      this.$refs["form"].validate((valid) => {
-        if (valid) {
-          this.loading = true;
-          // 根据当前任务或者流程设计配置的下一步节点 todo 暂时未涉及到考虑网关、表达式和多节点情况
-          // getNextFlowNodeByStart({
-          //   deploymentId: this.options.deploymentId,
-          //   variables: this.form,
-          // }).then((res) => {
-          //   const data = res.data;
-          //   if (data) {
-          //     console.log(data);
-          //     this.loading = false;
-          //   }
-          // });
-          // 启动流程并将表单数据加入流程变量
-
-          definitionStart(this.options.id, JSON.stringify(this.form)).then((res) => {
-            this.$modal.msgSuccess(res.msg);
-            this.loading = false;
-            //关闭并刷新列表
-            this.$refs.drawer.closeDrawer();
-          });
-        }
-      });
-    },
-  },
-};
-</script>
-<style>
-.bjs-powered-by {
-  display: none !important;
-}
-.maskLayer {
-  width: 100%;
-  height: 150px;
-  position: absolute;
-  z-index: 9999;
-  top: 66px;
-}
-</style>
diff --git a/ruoyi-ui/src/views/flowable/task/myProcess/index.vue b/ruoyi-ui/src/views/flowable/task/myProcess/index.vue
index 648fecc0..2f3f3bf3 100644
--- a/ruoyi-ui/src/views/flowable/task/myProcess/index.vue
+++ b/ruoyi-ui/src/views/flowable/task/myProcess/index.vue
@@ -10,6 +10,22 @@
           @keyup.enter.native="handleQuery"
         />
       </el-form-item>
+      <el-form-item label="所属项目" prop="businessKey" v-if="showPro">
+          <el-select
+            v-model="queryParams.businessKey"
+            placeholder="请选择所属项目"
+            filterable
+            clearable
+          >
+            <el-option
+              v-for="(item, index) in projectOptions"
+              :key="index"
+              :label="item.projectName"
+              :value="item.id"
+            >
+            </el-option>
+          </el-select>
+      </el-form-item>
       <el-form-item label="流程类型" prop="category">
         <el-select
           v-model="queryParams.category"
@@ -253,6 +269,7 @@ export default {
         procDefName: null,
         category: null,
         params: null,
+        businessKey:null,
         activeName:null,
       },
       // 查询参数
@@ -281,11 +298,14 @@ export default {
         finished:"已完成（0）",
       },
       activeName:"await",
+      showPro:false,
+      projectOptions: null,
     };
   },
   created() {
     this.queryParams.activeName = this.activeName;
     this.getList();
+    this.initMyProject();
   },
   methods: {
     /** 查询流程定义列表 */
@@ -311,6 +331,16 @@ export default {
         this.tabs.all = "全部申请（"+(parseInt(response.data.await)+parseInt(response.data.finished))+"）";
       });
     },
+    // 查询和我相关的项目信息
+    initMyProject() {
+      // 获取项目列表的接口
+      this.$api.publics.getMyProjectList({}).then((response) => {
+        this.projectOptions = response.rows;
+        if (response.rows.length > 1) {
+          this.showPro = true;
+        }
+      });
+    },
     // 取消按钮
     cancel() {
       this.open = false;