clay : workflow oss 分布式文件存储imageUpload对接完成

2023-01-24 14:17:46 +08:00 · 2023-01-24 14:17:46 +08:00 · a708944c77
parent f6827334c2
commit a708944c77
5 changed files with 243 additions and 107 deletions
--- a/flowable-engine-web/package-lock.json
+++ b/flowable-engine-web/package-lock.json
@ -1824,16 +1824,6 @@
          "integrity": "sha1-4a1IbmxUUBY0xsOXxcEh2qODYHw=",
          "dev": true
        },
-        "ansi-styles": {
-          "version": "4.3.0",
-          "resolved": "https://registry.npmjs.org/ansi-styles/-/ansi-styles-4.3.0.tgz",
-          "integrity": "sha512-zbB9rCJAT1rbjiVDb2hqKFHNYLxgtk8NURxZ3IZwD3F6NtxbXZQCnnSi1Lkx+IDohdPlFp222wVALIheZJQSEg==",
-          "dev": true,
-          "optional": true,
-          "requires": {
-            "color-convert": "^2.0.1"
-          }
-        },
        "cacache": {
          "version": "13.0.1",
          "resolved": "https://registry.npm.taobao.org/cacache/download/cacache-13.0.1.tgz?cache=0&sync_timestamp=1594428108619&other_urls=https%3A%2F%2Fregistry.npm.taobao.org%2Fcacache%2Fdownload%2Fcacache-13.0.1.tgz",
@ -1860,34 +1850,6 @@
            "unique-filename": "^1.1.1"
          }
        },
-        "chalk": {
-          "version": "4.1.2",
-          "resolved": "https://registry.npmjs.org/chalk/-/chalk-4.1.2.tgz",
-          "integrity": "sha512-oKnbhFyRIXpUuez8iBMmyEa4nbj4IOQyuhc/wy9kY7/WVPcwIO9VA668Pu8RkO7+0G76SLROeyw9CpQ061i4mA==",
-          "dev": true,
-          "optional": true,
-          "requires": {
-            "ansi-styles": "^4.1.0",
-            "supports-color": "^7.1.0"
-          }
-        },
-        "color-convert": {
-          "version": "2.0.1",
-          "resolved": "https://registry.npmjs.org/color-convert/-/color-convert-2.0.1.tgz",
-          "integrity": "sha512-RRECPsj7iu/xb5oKYcsFHSppFNnsj/52OVTRKb4zP5onXwVF3zVmmToNcOfGC+CRDpfK/U584fMg38ZHCaElKQ==",
-          "dev": true,
-          "optional": true,
-          "requires": {
-            "color-name": "~1.1.4"
-          }
-        },
-        "color-name": {
-          "version": "1.1.4",
-          "resolved": "https://registry.npmjs.org/color-name/-/color-name-1.1.4.tgz",
-          "integrity": "sha512-dOy+3AuW3a2wNbZHIuMZpTcgjGuLU/uBL/ubcZF9OXbDo8ff4O8yVp5Bf0efS8uEoYo5q4Fx7dY9OgQGXgAsQA==",
-          "dev": true,
-          "optional": true
-        },
        "find-cache-dir": {
          "version": "3.3.1",
          "resolved": "https://registry.npm.taobao.org/find-cache-dir/download/find-cache-dir-3.3.1.tgz",
@ -1909,25 +1871,6 @@
            "path-exists": "^4.0.0"
          }
        },
-        "has-flag": {
-          "version": "4.0.0",
-          "resolved": "https://registry.npmjs.org/has-flag/-/has-flag-4.0.0.tgz",
-          "integrity": "sha512-EykJT/Q1KjTWctppgIAgfSO0tKVuZUjhgMr17kqTumMl6Afv3EISleU7qZUzoXDFTAHTDC4NOoG/ZxU3EvlMPQ==",
-          "dev": true,
-          "optional": true
-        },
-        "loader-utils": {
-          "version": "2.0.4",
-          "resolved": "https://registry.npmjs.org/loader-utils/-/loader-utils-2.0.4.tgz",
-          "integrity": "sha512-xXqpXoINfFhgua9xiqD8fPFHgkoq1mmmpE92WlDbm9rNRd/EbRb+Gqf908T2DMfuHjjJlksiK2RbHVOdD/MqSw==",
-          "dev": true,
-          "optional": true,
-          "requires": {
-            "big.js": "^5.2.2",
-            "emojis-list": "^3.0.0",
-            "json5": "^2.1.2"
-          }
-        },
        "locate-path": {
          "version": "5.0.0",
          "resolved": "https://registry.npm.taobao.org/locate-path/download/locate-path-5.0.0.tgz",
@ -1992,16 +1935,6 @@
            "minipass": "^3.1.1"
          }
        },
-        "supports-color": {
-          "version": "7.2.0",
-          "resolved": "https://registry.npmjs.org/supports-color/-/supports-color-7.2.0.tgz",
-          "integrity": "sha512-qpCAvRl9stuOHveKsn7HncJRvv501qIacKzQlO/+Lwxc9+0q2wLyv4Dfvt80/DPn2pqOBsJdDiogXGR9+OvwRw==",
-          "dev": true,
-          "optional": true,
-          "requires": {
-            "has-flag": "^4.0.0"
-          }
-        },
        "terser-webpack-plugin": {
          "version": "2.3.8",
          "resolved": "https://registry.npm.taobao.org/terser-webpack-plugin/download/terser-webpack-plugin-2.3.8.tgz?cache=0&sync_timestamp=1597229595508&other_urls=https%3A%2F%2Fregistry.npm.taobao.org%2Fterser-webpack-plugin%2Fdownload%2Fterser-webpack-plugin-2.3.8.tgz",
@ -2018,18 +1951,6 @@
            "terser": "^4.6.12",
            "webpack-sources": "^1.4.3"
          }
-        },
-        "vue-loader-v16": {
-          "version": "npm:vue-loader@16.8.3",
-          "resolved": "https://registry.npmjs.org/vue-loader/-/vue-loader-16.8.3.tgz",
-          "integrity": "sha512-7vKN45IxsKxe5GcVCbc2qFU5aWzyiLrYJyUuMz4BQLKctCj/fmCa0w6fGiiQ2cLFetNcek1ppGJQDCup0c1hpA==",
-          "dev": true,
-          "optional": true,
-          "requires": {
-            "chalk": "^4.1.0",
-            "hash-sum": "^2.0.0",
-            "loader-utils": "^2.0.0"
-          }
        }
      }
    },
@ -12142,6 +12063,87 @@
        }
      }
    },
+    "vue-loader-v16": {
+      "version": "npm:vue-loader@16.8.3",
+      "resolved": "https://registry.npmjs.org/vue-loader/-/vue-loader-16.8.3.tgz",
+      "integrity": "sha512-7vKN45IxsKxe5GcVCbc2qFU5aWzyiLrYJyUuMz4BQLKctCj/fmCa0w6fGiiQ2cLFetNcek1ppGJQDCup0c1hpA==",
+      "dev": true,
+      "optional": true,
+      "requires": {
+        "chalk": "^4.1.0",
+        "hash-sum": "^2.0.0",
+        "loader-utils": "^2.0.0"
+      },
+      "dependencies": {
+        "ansi-styles": {
+          "version": "4.3.0",
+          "resolved": "https://registry.npmjs.org/ansi-styles/-/ansi-styles-4.3.0.tgz",
+          "integrity": "sha512-zbB9rCJAT1rbjiVDb2hqKFHNYLxgtk8NURxZ3IZwD3F6NtxbXZQCnnSi1Lkx+IDohdPlFp222wVALIheZJQSEg==",
+          "dev": true,
+          "optional": true,
+          "requires": {
+            "color-convert": "^2.0.1"
+          }
+        },
+        "chalk": {
+          "version": "4.1.2",
+          "resolved": "https://registry.npmjs.org/chalk/-/chalk-4.1.2.tgz",
+          "integrity": "sha512-oKnbhFyRIXpUuez8iBMmyEa4nbj4IOQyuhc/wy9kY7/WVPcwIO9VA668Pu8RkO7+0G76SLROeyw9CpQ061i4mA==",
+          "dev": true,
+          "optional": true,
+          "requires": {
+            "ansi-styles": "^4.1.0",
+            "supports-color": "^7.1.0"
+          }
+        },
+        "color-convert": {
+          "version": "2.0.1",
+          "resolved": "https://registry.npmjs.org/color-convert/-/color-convert-2.0.1.tgz",
+          "integrity": "sha512-RRECPsj7iu/xb5oKYcsFHSppFNnsj/52OVTRKb4zP5onXwVF3zVmmToNcOfGC+CRDpfK/U584fMg38ZHCaElKQ==",
+          "dev": true,
+          "optional": true,
+          "requires": {
+            "color-name": "~1.1.4"
+          }
+        },
+        "color-name": {
+          "version": "1.1.4",
+          "resolved": "https://registry.npmjs.org/color-name/-/color-name-1.1.4.tgz",
+          "integrity": "sha512-dOy+3AuW3a2wNbZHIuMZpTcgjGuLU/uBL/ubcZF9OXbDo8ff4O8yVp5Bf0efS8uEoYo5q4Fx7dY9OgQGXgAsQA==",
+          "dev": true,
+          "optional": true
+        },
+        "has-flag": {
+          "version": "4.0.0",
+          "resolved": "https://registry.npmjs.org/has-flag/-/has-flag-4.0.0.tgz",
+          "integrity": "sha512-EykJT/Q1KjTWctppgIAgfSO0tKVuZUjhgMr17kqTumMl6Afv3EISleU7qZUzoXDFTAHTDC4NOoG/ZxU3EvlMPQ==",
+          "dev": true,
+          "optional": true
+        },
+        "loader-utils": {
+          "version": "2.0.4",
+          "resolved": "https://registry.npmjs.org/loader-utils/-/loader-utils-2.0.4.tgz",
+          "integrity": "sha512-xXqpXoINfFhgua9xiqD8fPFHgkoq1mmmpE92WlDbm9rNRd/EbRb+Gqf908T2DMfuHjjJlksiK2RbHVOdD/MqSw==",
+          "dev": true,
+          "optional": true,
+          "requires": {
+            "big.js": "^5.2.2",
+            "emojis-list": "^3.0.0",
+            "json5": "^2.1.2"
+          }
+        },
+        "supports-color": {
+          "version": "7.2.0",
+          "resolved": "https://registry.npmjs.org/supports-color/-/supports-color-7.2.0.tgz",
+          "integrity": "sha512-qpCAvRl9stuOHveKsn7HncJRvv501qIacKzQlO/+Lwxc9+0q2wLyv4Dfvt80/DPn2pqOBsJdDiogXGR9+OvwRw==",
+          "dev": true,
+          "optional": true,
+          "requires": {
+            "has-flag": "^4.0.0"
+          }
+        }
+      }
+    },
    "vue-router": {
      "version": "3.4.3",
      "resolved": "https://registry.npm.taobao.org/vue-router/download/vue-router-3.4.3.tgz?cache=0&sync_timestamp=1598983087864&other_urls=https%3A%2F%2Fregistry.npm.taobao.org%2Fvue-router%2Fdownload%2Fvue-router-3.4.3.tgz",
--- a/flowable-engine-web/src/api/task.js
+++ b/flowable-engine-web/src/api/task.js
@ -22,6 +22,22 @@ export function completeTask(params) {
        data: params
    })
 }
+export function refuseTask(params) {
+    return request({
+        url: "/flowable/process/task/refuse",
+        method: "put",
+        data: params
+    })
+}
+
+export function rollBackTask(params) {
+    return request({
+        url: "/flowable/process/task/rollback",
+        method: "put",
+        data: params
+    })
+}
+
 export function addComment(params) {
    return request({
        url: "/flowable/process/task/comment",
--- a/flowable-engine-web/src/components/common/Comment.vue
+++ b/flowable-engine-web/src/components/common/Comment.vue
@ -1,5 +1,12 @@
 <template>
-  <w-dialog :border="false" closeFree width="500px" :title="title" v-model="visible" @ok="selectConfirm">
+  <w-dialog :border="false" closeFree width="500px" :title="title" :click-close="true" v-model="visible" @ok="selectConfirm">
+    <div v-if="type === 3">
+      <el-select v-model="rollBackId" placeholder="请指定退回节点" size="medium">
+        <el-option v-for="(task,index) in taskOption" :key="index"
+                   :label="task.label"
+                   :value="task.value"/>
+      </el-select>
+    </div>
    <div class="el-textarea">
      <el-input
          type="textarea"
@ -22,7 +29,7 @@
                 :on-success="handleUploadSuccess"
                 :before-upload="beforeUpload">
        <i slot="default" class="el-icon-plus"></i>
-        <div slot="file" slot-scope="{file}" >
+        <div slot="file" slot-scope="{file}">
          <img style="width: 100%;height: 100%" :src="file.url" alt="">
          <label class="el-upload-list__item-status-label">
            <i class="el-icon-upload-success el-icon-check"></i>
@ -67,6 +74,18 @@ export default {
    //     return [];
    //   }
    // },
+    title: {
+      type: String,
+      default: () => {
+        return "添加评论";
+      }
+    },
+    type: {
+      type: Number,
+      default: () => {
+        return 1;
+      }
+    },
    imageSize: {
      type: Number,
      default: 5
@ -82,6 +101,9 @@ export default {
    },
    attachmentTip() {
      return this.attachmentMaxSize > 0 ? `| 单个附件不超过${this.attachmentMaxSize}MB` : "";
+    },
+    taskOption(){
+      return this.$store.state.userTaskOption
    }
  },
  created() {
@ -89,7 +111,7 @@ export default {
  data() {
    return {
      visible: false,
-      title: "添加评论",
+      rollBackId: null,
      imageList: [],
      attachmentList: [],
      disabled: false,
@ -125,7 +147,7 @@ export default {
    },
    beforeAttachmentUpload(file) {
      if (this.attachmentMaxSize > 0 && file.size / 1024 / 1024 > this.attachmentMaxSize) {
-        this.$message.warning(`单张图片最大不超过 ${this.attachmentMaxSize}MB`);
+        this.$message.warning(`单个附件最大不超过 ${this.attachmentMaxSize}MB`);
        return false;
      } else {
        return true;
@ -158,7 +180,7 @@ export default {
      this.attachmentList.forEach((attachment) => {
        fileList.push({
          id: attachment.id,
-          name:attachment.name,
+          name: attachment.name,
          isImage: attachment.isImage,
          size: attachment.size,
          url: attachment.url
@ -167,19 +189,21 @@ export default {
      this.imageList.forEach((image) => {
        fileList.push({
          id: image.id,
-          name:image.name,
+          name: image.name,
          isImage: image.isImage,
          size: image.size,
          url: image.url
        })
      })
-
      let data = {
        context: this.context,
-        attachments:fileList
+        attachments: fileList
      }
-      console.log(this.attachmentList, this.imageList)
-      this.$emit("ok", data)
+      switch (this.type){
+        case 3: this.$set(data,"rollBackId",this.rollBackId);break
+        default: break;
+      }
+      this.$emit("ok", data,this.type)
      this.visible = false;
    }
  }
--- a/flowable-engine-web/src/views/common/form/components/ImageUpload.vue
+++ b/flowable-engine-web/src/views/common/form/components/ImageUpload.vue
@ -38,7 +38,11 @@
      </template>
      <template v-else-if="perm === 'R'">
        <div v-for="(item , index) in _value" :key="index">
-          <img :src="item.url" alt="" style="width: 65px;height: 65px">
+          <el-image
+              style="width: 100px; height: 100px"
+              :src="item.url"
+              :preview-src-list="[item.url]">
+          </el-image>
        </div>
      </template>
    </template>
--- a/flowable-engine-web/src/views/workspace/DisposalTask.vue
+++ b/flowable-engine-web/src/views/workspace/DisposalTask.vue
@ -45,28 +45,28 @@
        <div class="top">
          <div class="top_left">
            <el-avatar size="large" :src="avatar"></el-avatar>
-            <span style="text-align: center;color: #19191a;font-size: 14px;">Clay</span>
+            <span style="text-align: center;color: #19191a;font-size: 14px;">{{ selectTask.initiatorName }}</span>
          </div>
          <div class="top_right">
-             <div style="margin-bottom: 12px">
-               <span style="font-size: 15px;margin-right: 15px">财务</span>
-               <el-tag style="font-size: 12px" size="mini">进行中</el-tag>
-             </div>
+            <div style="margin-bottom: 12px">
+              <span style="font-size: 15px;margin-right: 15px">{{ selectTask.processName }}</span>
+              <el-tag style="font-size: 12px" size="mini">进行中</el-tag>
+            </div>
            <div>
-              <span style="color: rgb(108, 108, 108);" >编号: d69e9582-873f-11ed-b0e7-fa28000d2c27</span>
+              <span style="color: rgb(108, 108, 108);">编号: {{ selectTask.taskId }}</span>
            </div>
          </div>
        </div>
        <div style="height: 15px;background:#f5f5f5;"></div>
        <form-render-view ref="taskViewForm" :form-items="taskData.formItems"
                          v-model="taskData.formData"/>
-        <!--        <process-diagram-viewer/>-->
        <div style="height: 15px;background:#f5f5f5;"></div>
        <footer class="footer">
-          <div class="footer_comment" @click="$refs.comment.show()">
+          <div class="footer_comment" @click="commentButton">
            <i class="el-icon-chat-line-round" style="font-size: 18px;"></i>
            <span style="font-size: 12px;">评论</span>
          </div>
+          <process-diagram-viewer/>
          <div style="margin-right: 20px;">
            <el-dropdown>
              <span class="el-dropdown-link" style="color: #2a99ff">
@ -74,20 +74,25 @@
              </span>
              <el-dropdown-menu slot="dropdown">
                <el-dropdown-item icon="el-icon-s-custom">转交</el-dropdown-item>
-                <el-dropdown-item icon="el-icon-s-release">退回</el-dropdown-item>
+                <el-dropdown-item icon="el-icon-s-release" @click="rollbackButton()">退回</el-dropdown-item>
                <el-dropdown-item icon="el-icon-s-check">加签</el-dropdown-item>
                <el-dropdown-item icon="el-icon-refresh-left">撤销</el-dropdown-item>
              </el-dropdown-menu>
            </el-dropdown>
-            <el-button type="danger" size="mini" plain round style="margin-left: 20px">拒绝</el-button>
+            <el-button type="danger" size="mini" plain round style="margin-left: 20px"
+                       @click="rollbackButton()">拒绝
+            <!--                       @click="refuseButton()">拒绝-->
+            </el-button>
            <el-button type="primary" size="mini" round @click="submitTask()">同意</el-button>
          </div>
-          <!--          <el-button type="success" @click="submitTask()">通过</el-button>-->
-          <!--          <el-button type="success" @click="$refs.comment.show()">评论</el-button>-->
        </footer>
      </div>
    </el-drawer>
-    <comment ref="comment" :max-size="5" :attachment-max-size="10" @ok="commentConfirm"/>
+    <comment ref="comment"
+             :title="commentInfo.title"
+             :type="commentInfo.type"
+             :max-size="5"
+             :attachment-max-size="20" @ok="commentConfirm"/>
  </div>
 </template>

@ -95,7 +100,7 @@
 import Comment from "../../components/common/Comment";
 import FormRenderView from "@/views/common/form/FormRender";
 import ProcessDiagramViewer from "../admin/layout/ProcessDiagramViewer";
-import {addComment, completeTask, getTaskInfo, getTaskList} from "@/api/task";
+import {addComment, completeTask, getTaskInfo, getTaskList, refuseTask,rollBackTask} from "@/api/task";

 export default {
  name: "DisposalTask",
@ -105,6 +110,10 @@ export default {
      approveOpen: false,
      selectTask: {},
      tableData: [],
+      commentInfo: {
+        title: null,
+        type: null, //1 添加评论 2 拒绝
+      },
      loading: false,
      taskData: {
        formData: {},
@ -152,6 +161,7 @@ export default {
        that.$store.state.runningList = that.taskData.runningList;
        that.$store.state.endList = that.taskData.endList;
        that.$store.state.noTakeList = that.taskData.noTakeList;
+        that.$store.state.userTaskOption = that.taskData.userTaskOption;
        this.loading = false;
      });
    },
@ -166,7 +176,81 @@ export default {
        this.$message.success(res.msg);
      });
    },
-    commentConfirm(data) {
+    refuseButton() {
+      this.commentInfo = {
+        title: "拒绝任务",
+        type: 2
+      }
+      this.commentShow()
+    },
+    commentButton() {
+      this.commentInfo = {
+        title: "添加评论",
+        type: 1
+      }
+      this.commentShow()
+    },
+    rollbackButton() {
+      console.log("1111111111111111111")
+      this.commentInfo = {
+        title: "退回任务",
+        type: 3
+      }
+      this.commentShow()
+    },
+    commentShow() {
+      this.$refs.comment.show()
+    },
+    /**
+     * 拒绝提交
+     * @param data
+     */
+    submitRefuse(data) {
+      let params = {
+        taskId: this.selectTask.taskId,
+        comment: data
+      };
+      refuseTask(params).then(res => {
+        this.approveOpen = false;
+        this.getList();
+        this.$message.success(res.msg);
+      })
+    },
+    /**
+     * 评论回调
+     * @param data
+     * @param type
+     */
+    commentConfirm(data, type) {
+      switch (type) {
+        case 1:
+          this.submitComment(data);
+          break;
+        case 2:
+          this.submitRefuse(data);
+          break;
+        case 3:
+          this.submitRollBack(data);
+          break;
+        default :
+          break;
+      }
+    },
+    submitRollBack(data){
+      let params = {
+        taskId: this.selectTask.taskId,
+        rollBackId: data.rollBackId,
+        comment: data,
+      };
+      rollBackTask(params).then(res=>{
+        this.$message.success(res.msg);
+      })
+    },
+    /**
+     * 提交评论
+     * @param data
+     */
+    submitComment(data) {
      this.$set(data, "taskId", this.selectTask.taskId);
      addComment(data).then(res => {
        this.$message.success(res.msg);
@ -177,16 +261,18 @@ export default {
 </script>

 <style scoped lang="scss">
-.top{
+.top {
  padding: 0 10px 10px 10px;
  display: flex;
+
  .top_left {
    display: flex;
    flex-direction: column;
    width: 50px;
    align-items: center;
  }
-  .top_right{
+
+  .top_right {
    display: flex;
    flex-direction: column;
    //justify-content: space-between;
@ -221,4 +307,8 @@ export default {
    top: -5px !important;
  }
 }
+
+.el-dropdown-link, .footer_comment {
+  cursor: pointer;
+}
 </style>