From 44196a636b7c4debaf688e2be29f0dab50d5a88d 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: Sun, 10 Sep 2023 13:50:28 +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

---
 .../views/flowable/task/finished/index.vue    |  11 +-
 .../views/flowable/task/myProcess/index.vue   |  34 ++-
 .../task/myProcess/initLeaveTaskDrawer.vue    | 207 ++++++++++++------
 .../task/todo/detail/approveDrawer.vue        |  58 +++--
 .../src/views/flowable/task/todo/index.vue    |  11 +-
 5 files changed, 216 insertions(+), 105 deletions(-)

diff --git a/ruoyi-ui/src/views/flowable/task/finished/index.vue b/ruoyi-ui/src/views/flowable/task/finished/index.vue
index 540e2a19..067d647a 100644
--- a/ruoyi-ui/src/views/flowable/task/finished/index.vue
+++ b/ruoyi-ui/src/views/flowable/task/finished/index.vue
@@ -132,15 +132,17 @@
       @pagination="getList"
     />
     <detailDrawer ref="detailDrawer"></detailDrawer>
+    <detailLeaveDrawer ref="detailLeaveDrawer"></detailLeaveDrawer>
   </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";
+import detailLeaveDrawer from "../myProcess/detail/detailLeaveDrawer.vue";
 export default {
   name: "Deploy",
-  components: { detailDrawer },
+  components: { detailDrawer, detailLeaveDrawer },
   dicts: ["sys_process_category"],
   data() {
     return {
@@ -264,7 +266,12 @@ export default {
     },
     /** 流程流转记录 */
     handleFlowRecord(row){
-      this.$refs.detailDrawer.show(row);
+      //根据不同业务跳转不同表单
+      if(row.procDefKey=="flow_xmglzdl_qjspb"){
+        this.$refs.detailLeaveDrawer.show(row);
+      }else{
+        this.$refs.detailDrawer.show(row);
+      }
       // this.$router.push({ path: '/flowable/task/finished/detail/index',
       //   query: {
       //     procInsId: row.procInsId,
diff --git a/ruoyi-ui/src/views/flowable/task/myProcess/index.vue b/ruoyi-ui/src/views/flowable/task/myProcess/index.vue
index 2f3f3bf3..2b3d952e 100644
--- a/ruoyi-ui/src/views/flowable/task/myProcess/index.vue
+++ b/ruoyi-ui/src/views/flowable/task/myProcess/index.vue
@@ -69,7 +69,7 @@
           v-hasPermi="['system:deployment:add']"
         >新增流程</el-button>
       </el-col>
-      <!-- <el-col :span="1.5">
+      <el-col :span="1.5">
         <el-button
           type="danger"
           plain
@@ -79,7 +79,7 @@
           @click="handleDelete"
           v-hasPermi="['system:deployment:remove']"
         >删除</el-button>
-      </el-col> -->
+      </el-col>
       <right-toolbar :showSearch.sync="showSearch" @queryTable="getList"></right-toolbar>
     </el-row>
     <el-tabs v-model="activeName" @tab-click="handleClick">
@@ -213,7 +213,9 @@
       />
     </el-dialog>
     <initTaskDrawer ref="initTaskDrawer" :closeCallBack="getList"></initTaskDrawer>
+    <initLeaveTaskDrawer ref="initLeaveTaskDrawer" :closeCallBack="getList"></initLeaveTaskDrawer>
     <detailDrawer ref="detailDrawer"></detailDrawer>
+    <detailLeaveDrawer ref="detailLeaveDrawer"></detailLeaveDrawer>
   </div>
 </template>
 
@@ -230,12 +232,16 @@ import { myProcessList,stopProcess } from "@/api/flowable/process";
 import {allList,queryCount} from "@/api/flowable/businessKey";
 import {myDefinitionList} from "@/api/flowable/definition";
 import initTaskDrawer from "./initTaskDrawer.vue";
+import initLeaveTaskDrawer from './initLeaveTaskDrawer'
 import detailDrawer from "./detail/detailDrawer.vue";
+import detailLeaveDrawer from "./detail/detailLeaveDrawer.vue";
 export default {
   name: "Deploy",
   components: {
     initTaskDrawer,
-    detailDrawer
+    initLeaveTaskDrawer,
+    detailDrawer,
+    detailLeaveDrawer
   },
   dicts: ["sys_process_category"],
   data() {
@@ -405,7 +411,11 @@ export default {
     /**  发起流程申请 */
     handleStartProcess(row){
       this.open = false;
-      this.$refs.initTaskDrawer.show(row);
+      if(row.flowKey=="flow_xmglzdl_qjspb"){
+        this.$refs.initLeaveTaskDrawer.show(row);
+      }else{
+        this.$refs.initTaskDrawer.show(row);
+      }
       // this.$router.push({ path: '/flowable/task/myProcess/send/index',
       //   query: {
       //     deployId: row.deploymentId,
@@ -418,18 +428,24 @@ export default {
       const params = {
         instanceId: row.procInsId
       }
+      let that = this;
       this.$modal.confirm('撤销流程会终止，是否继续？').then(function() {
-        this.loading = true;
+        that.loading = true;
         return stopProcess(params);
       }).then(res => {
-        this.$modal.msgSuccess(res.msg);
-        this.loading=false;
-        this.getList();
+        that.$modal.msgSuccess(res.msg);
+        that.loading=false;
+        that.getList();
       });
     },
     /** 流程流转记录 */
     handleFlowRecord(row){
-      this.$refs.detailDrawer.show(row);
+      //根据不同业务跳转不同表单
+      if(row.procDefKey=="flow_xmglzdl_qjspb"){
+        this.$refs.detailLeaveDrawer.show(row);
+      }else{
+        this.$refs.detailDrawer.show(row);
+      }
       // this.$router.push({ path: '/flowable/task/myProcess/detail/index',
       //   query: {
       //     procInsId: row.procInsId,
diff --git a/ruoyi-ui/src/views/flowable/task/myProcess/initLeaveTaskDrawer.vue b/ruoyi-ui/src/views/flowable/task/myProcess/initLeaveTaskDrawer.vue
index 04c954b4..7170b3d8 100644
--- a/ruoyi-ui/src/views/flowable/task/myProcess/initLeaveTaskDrawer.vue
+++ b/ruoyi-ui/src/views/flowable/task/myProcess/initLeaveTaskDrawer.vue
@@ -18,57 +18,105 @@
         :rules="rules"
         v-loading="loading"
         label-width="120px"
-        style="padding-right: 35px"
+        style="padding-right: 35px;"
       >
         <div class="canvas" ref="flowCanvas"></div>
         <div class="maskLayer" />
-        <el-form-item label="所属项目" prop="businessKey">
-          <el-select
-            v-model="form.businessKey"
-            placeholder="请选择所属项目"
-            style="width: 100%"
-            filterable
-            :disabled="disPro"
-            @change="projectChage"
-          >
-            <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="发起单位">
-          {{ 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" v-if="options.flowKey!='flow_xmglzdl_qjsp' && options.flowKey!='flow_aql_sxkj'">
-          <FileUpload
-            @input="fileInput"
-            :limit="9"
-            :fileType="['pdf', 'png', 'jpg', 'jpeg', 'doc', 'docx', 'xls', 'xlsx']"
-          />
-        </el-form-item>
-        <el-form-item label="申请说明" prop="remark" v-if="options.flowKey!='flow_xmglzdl_qjsp' && options.flowKey!='flow_aql_sxkj'">
-          <el-input
-            type="textarea"
-            v-model="form.remark"
-            placeholder="请输入申请说明"
-            rows="5"
-          />
-        </el-form-item>
+          <el-card class="box-card" style="margin-left:35px;">
+            <el-descriptions class="margin-top" :title="title" :column="2" size="medium" border>
+              <el-descriptions-item :span="2" prop="businessKey">
+                <template slot="label">
+                  <i class="el-icon-map-location"></i>
+                  所属项目<span class="cr"> *</span>
+                </template>
+                <el-select
+                v-model="form.businessKey"
+                placeholder="请选择所属项目"
+                style="width: 100%"
+                filterable
+                :disabled="disPro"
+                @change="projectChage"
+              >
+                <el-option
+                  v-for="(item, index) in projectOptions"
+                  :key="index"
+                  :label="item.projectName"
+                  :value="item.id"
+                >
+                </el-option>
+              </el-select>
+              </el-descriptions-item>
+              <el-descriptions-item :span="2" label-class-name="my-label" :labelStyle="labelStyle">
+                <template slot="label">
+                  <i class="el-icon-school"></i>
+                  申请单位
+                </template>
+                {{ deptName }}
+              </el-descriptions-item>
+              <el-descriptions-item :span="2" label-class-name="my-label" :labelStyle="labelStyle">
+                <template slot="label">
+                  <i class="el-icon-collection-tag"></i>
+                  申请事项
+                </template>
+                {{ title }}
+              </el-descriptions-item>
+              <el-descriptions-item label-class-name="my-label" :labelStyle="labelStyle">
+                <template slot="label">
+                  <i class="el-icon-user"></i>
+                  申请人
+                </template>
+                {{ nickName }}
+              </el-descriptions-item>
+              <el-descriptions-item label-class-name="my-label" :labelStyle="labelStyle">
+                <template slot="label">
+                  <i class="el-icon-s-flag"></i>
+                  申请日期
+                </template>
+                {{ date }}
+              </el-descriptions-item>
+              <el-descriptions-item label-class-name="my-label" :labelStyle="labelStyle">
+                <template slot="label">
+                  <i class="el-icon-time"></i>
+                  请假日期<span class="cr"> *</span>
+                </template>
+                <el-date-picker
+                  v-model="daterangeMarksTime"
+                  style="width: 400px"
+                  value-format="yyyy-MM-dd"
+                  type="daterange"
+                  range-separator="-"
+                  start-placeholder="开始日期"
+                  end-placeholder="结束日期"
+                  @change="checkTime"
+                ></el-date-picker>
+              </el-descriptions-item>
+              <el-descriptions-item label-class-name="my-label" :labelStyle="labelStyle">
+                <template slot="label">
+                  <i class="el-icon-tickets"></i>
+                  请假时间
+                </template>
+                {{times}}
+              </el-descriptions-item>
+              <el-descriptions-item :span="2" label-class-name="my-label" :labelStyle="labelStyle">
+                <template slot="label">
+                  <i class="el-icon-chat-dot-square"></i>
+                  请假事由<span class="cr"> *</span>
+                </template>
+                <el-input
+                  type="textarea"
+                  v-model="form.remark"
+                  placeholder="请输入申请说明"
+                  rows="5"
+                  max="1"
+                />
+              </el-descriptions-item>
+             </el-descriptions>
+             <div style="text-align: center;margin-top: 30px;">
+              <el-button type="primary" @click="submitForm">提交申请</el-button>
+              <el-button @click="doCanel">取 消</el-button>
+            </div>
+          </el-card>
       </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>
@@ -102,18 +150,7 @@ export default {
         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",
-          },
-        ],
-      },
+      rules: {},
       projectOptions: null,
       deptName: null,
       nickName: null,
@@ -123,6 +160,10 @@ export default {
       taskTitle: null,
       taskOpen: false,
       daterangeMarksTime: [],
+      //label样式
+      labelStyle: { width: "180px" },
+      times:"... ...",
+      date:null
     };
   },
   computed: {},
@@ -161,17 +202,20 @@ export default {
     },
     show(options) {
       this.options = options;
+      this.form={};
       this.initMyProject();
       this.title = options.name;
       this.deptName = store.getters.dept.deptName;
       this.nickName = store.getters.name;
-      const self = this;
+      this.date = this.$dt(new Date()).format("YYYY-MM-DD");
+      this.form.date = this.$dt(new Date()).format("YYYY-MM-DD HH:mm");
       this.onOpen = true;
       flowXmlAndNode({ deployId: options.deploymentId }).then((res) => {
         this.initFlowImage(res.data.xmlData);
       });
     },
     async initFlowImage(data) {
+      const self = this;
       try {
         self.bpmnViewer = new BpmnViewer({
           container: this.$refs.flowCanvas,
@@ -184,21 +228,17 @@ export default {
         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;
+    checkTime(val) {
+      let time = new Date(val[1]).getTime()-new Date(val[0]).getTime();
+      let hours = time/3600000;
+      let day = (hours/24)+1;//这里默认加1天，PS:2023-09-10 2023-09-11实际请假应该为2天，而不是一天
+      if(hours%24>0) day++;
+      this.form.day=day;
+      this.times="共 "+day+" 天"
     },
     submitForm() {
       this.$refs["form"].validate((valid) => {
         if (valid) {
-          this.loading = true;
           // 根据当前任务或者流程设计配置的下一步节点 todo 暂时未涉及到考虑网关、表达式和多节点情况
           // getNextFlowNodeByStart({
           //   deploymentId: this.options.deploymentId,
@@ -211,7 +251,26 @@ export default {
           //   }
           // });
           // 启动流程并将表单数据加入流程变量
-
+          if(!this.form.businessKey){
+            this.$modal.msgWarning("请选择所属项目...");
+            return;
+          }
+          if (null != this.daterangeMarksTime && "" != this.daterangeMarksTime) {
+            this.form.beginDate = this.daterangeMarksTime[0];
+            this.form.endDate = this.daterangeMarksTime[1];
+          }else{
+            this.$modal.msgWarning("请选择请假日期...");
+            return;
+          }
+          if(!this.form.day){
+            this.$modal.msgWarning("请选择请假日期...");
+            return;
+          }
+          if(!this.form.remark){
+            this.$modal.msgWarning("请输入请假事由...");
+            return;
+          }
+          this.loading = true;
           definitionStart(this.options.id, JSON.stringify(this.form)).then((res) => {
             this.$modal.msgSuccess(res.msg);
             this.loading = false;
@@ -235,4 +294,8 @@ export default {
   z-index: 9999;
   top: 66px;
 }
+.cr{
+  font-weight: 700;
+  color: red;
+}
 </style>
diff --git a/ruoyi-ui/src/views/flowable/task/todo/detail/approveDrawer.vue b/ruoyi-ui/src/views/flowable/task/todo/detail/approveDrawer.vue
index 905a8fc7..ed666fec 100644
--- a/ruoyi-ui/src/views/flowable/task/todo/detail/approveDrawer.vue
+++ b/ruoyi-ui/src/views/flowable/task/todo/detail/approveDrawer.vue
@@ -96,9 +96,24 @@
             rows="5"
           />
         </el-form-item>
+        <!-- <el-form-item label="驳回节点" prop="businessKey" v-if="returnTask">
+          <el-select
+            v-model="form.businessKey"
+            placeholder="请选择驳回节点"
+            style="width: 100%"
+          >
+            <el-option
+              v-for="(item, index) in returnTaskList"
+              :key="index"
+              :label="item.name"
+              :value="item.id"
+            >
+            </el-option>
+          </el-select>
+        </el-form-item> -->
         <div style="text-align: center">
-          <el-button icon="el-icon-check" type="success" size="mini" @click="handlePass">审批通过</el-button>
-          <el-button icon="el-icon-circle-close" type="danger" size="mini" @click="handleReject">审批驳回</el-button>
+          <el-button icon="el-icon-check" type="success" size="mini" @click="handlePass">通过</el-button>
+          <el-button icon="el-icon-circle-close" type="danger" size="mini" @click="handleReject">驳回</el-button>
         </div>
       </el-form>
       </div>
@@ -111,7 +126,7 @@
 import store from "@/store";
 import { flowXmlAndNode } from "@/api/flowable/definition";
 import { CustomViewer as BpmnViewer } from "@/components/customBpmn";
-import { complete, rejectTask } from "@/api/flowable/todo";
+import { complete, rejectTask, returnList } from "@/api/flowable/todo";
 import {findCommentByProcInsId,findFormDatasByProcInsId} from "@/api/flowable/businessKey";
 export default {
   components: {},
@@ -148,7 +163,9 @@ export default {
       showjd:false,
       //label样式
       labelStyle: { width: "180px" },
-      initData:{}
+      initData:{},
+      returnTaskList: [],  // 回退列表数据
+      returnTask:false
     };
   },
   computed: {},
@@ -161,14 +178,7 @@ export default {
     handlePass() {
       this.$refs["form"].validate((valid) => {
         if (valid) {
-          this.form.taskId = this.options.taskId;
-          this.form.taskName = this.options.taskName;
-          this.form.userId = store.getters.userId;
-          this.form.deployId = this.options.deployId;
-          this.form.procInsId = this.options.procInsId;
-          this.form.instanceId = this.options.procInsId;
-          this.form.executionId = this.options.procInsId;
-          this.$confirm('是否确认通过当前流程申请?', '提示', {
+          this.$confirm('是否确认审批通过当前流程申请?', '提示', {
           confirmButtonText: '确定',
           cancelButtonText: '取消',
           type: 'warning'
@@ -190,14 +200,7 @@ export default {
     handleReject() {
       this.$refs["form"].validate((valid) => {
         if (valid) {
-          this.form.taskId = this.options.taskId;
-          this.form.taskName = this.options.taskName;
-          this.form.userId = store.getters.userId;
-          this.form.deployId = this.options.deployId;
-          this.form.procInsId = this.options.procInsId;
-          this.form.instanceId = this.options.procInsId;
-          this.form.executionId = this.options.procInsId;
-          this.$confirm('是否确认驳回当前流程申请?', '提示', {
+          this.$confirm('是否确认审批驳回当前流程申请?', '提示', {
           confirmButtonText: '确定',
           cancelButtonText: '取消',
           type: 'warning'
@@ -215,6 +218,20 @@ export default {
         }
       });
     },
+    initReturnList(){
+      returnList(this.form).then(res => {
+        this.returnTaskList = res.data;
+      })
+    },
+    initFormDate(){
+      this.form.taskId = this.options.taskId;
+      this.form.taskName = this.options.taskName;
+      this.form.userId = store.getters.userId;
+      this.form.deployId = this.options.deployId;
+      this.form.procInsId = this.options.procInsId;
+      this.form.instanceId = this.options.procInsId;
+      this.form.executionId = this.options.procInsId;
+    },
     setIcon(row) {
       if (row.endTime) {
         if(row.commentResult=="驳回")
@@ -257,6 +274,7 @@ export default {
       this.onOpen = true;
       this.showjd = false;
       this.form = {};
+      this.initFormDate();
       if(options.finishTime==null){
         this.jdtitle="进行中";
         this.showjd=true;
diff --git a/ruoyi-ui/src/views/flowable/task/todo/index.vue b/ruoyi-ui/src/views/flowable/task/todo/index.vue
index 4d18ef00..68c58e6d 100644
--- a/ruoyi-ui/src/views/flowable/task/todo/index.vue
+++ b/ruoyi-ui/src/views/flowable/task/todo/index.vue
@@ -87,6 +87,7 @@
       @pagination="getList"
     />
     <approveDrawer ref="approveDrawer" :closeCallBack="getList"></approveDrawer>
+    <approveLeaveDrawer ref="approveLeaveDrawer" :closeCallBack="getList"></approveLeaveDrawer>
   </div>
 </template>
 <script>
@@ -96,10 +97,11 @@ import {
 } from "@/api/flowable/todo";
 import {myAwaitFlowTaskList} from "@/api/flowable/businessKey";
 import approveDrawer from "./detail/approveDrawer.vue";
+import approveLeaveDrawer from "./detail/approveLeaveDrawer.vue";
 
 export default {
   name: "Deploy",
-  components: {approveDrawer},
+  components: {approveDrawer,approveLeaveDrawer},
   dicts: ["sys_process_category"],
   data() {
     return {
@@ -161,7 +163,12 @@ export default {
     },
     // 跳转到处理页面
     handleProcess(row){
-      this.$refs.approveDrawer.show(row);
+      //根据不同业务跳转不同表单
+      if(row.procDefKey=="flow_xmglzdl_qjspb"){
+        this.$refs.approveLeaveDrawer.show(row);
+      }else{
+        this.$refs.approveDrawer.show(row);
+      }
       // this.$router.push({ path: '/flowable/task/todo/detail/index',
       //   query: {
       //     procInsId: row.procInsId,