项目初始化

datax-common/datax-common-redis/src/main/java/cn/datax/common/redis/config/RedisConfig.java

 package cn.datax.common.redis.config;
 
+import cn.datax.common.redis.service.DistributedLock;
 import cn.datax.common.redis.service.RedisService;
 import com.fasterxml.jackson.annotation.JsonAutoDetect;
+import com.fasterxml.jackson.annotation.JsonInclude;
 import com.fasterxml.jackson.annotation.JsonTypeInfo;
 import com.fasterxml.jackson.annotation.PropertyAccessor;
 import com.fasterxml.jackson.databind.DeserializationFeature;
@@ -29,6 +31,8 @@ public class RedisConfig {
     @Bean
     public RedisSerializer<Object> redisSerializer() {
         ObjectMapper objectMapper = new ObjectMapper();
+        // null数据不返回
+        objectMapper.setSerializationInclusion(JsonInclude.Include.NON_NULL);
         objectMapper.setVisibility(PropertyAccessor.ALL, JsonAutoDetect.Visibility.ANY);
         //反序列化时候遇到不匹配的属性并不抛出异常
         objectMapper.configure(DeserializationFeature.FAIL_ON_UNKNOWN_PROPERTIES, false);
@@ -70,4 +74,10 @@ public class RedisConfig {
     public RedisService redisService() {
         return new RedisService();
     }
+
+    @Bean
+    @ConditionalOnBean(name = "redisTemplate")
+    public DistributedLock distributedLock() {
+        return new DistributedLock();
+    }
 }
\ No newline at end of file

datax-common/datax-common-redis/src/main/java/cn/datax/common/redis/service/DistributedLock.java

+package cn.datax.common.redis.service;
+
+import lombok.extern.slf4j.Slf4j;
+import org.springframework.beans.factory.annotation.Autowired;
+import org.springframework.data.redis.core.StringRedisTemplate;
+import org.springframework.data.redis.core.script.DefaultRedisScript;
+import org.springframework.data.redis.core.script.RedisScript;
+
+import java.util.Arrays;
+import java.util.concurrent.TimeUnit;
+
+/**
+ * redis分布式锁
+ */
+@Slf4j
+public class DistributedLock {
+
+    @Autowired
+    private StringRedisTemplate redisTemplate;
+
+    /**
+     * 加锁，无阻塞
+     * @param lock
+     * @param key
+     * @param expireTime    锁过期时间单位秒
+     * @return
+     */
+    public boolean tryLock(String lock, String key, Long expireTime) {
+        return this.tryLock(lock, key, expireTime, TimeUnit.SECONDS);
+    }
+
+    /**
+     * 加锁，无阻塞
+     * @param lock
+     * @param key
+     * @param expireTime    锁过期时间
+     * @param timeUnit
+     * @return
+     */
+    public boolean tryLock(String lock, String key, Long expireTime, TimeUnit timeUnit) {
+        Boolean success = redisTemplate.opsForValue().setIfAbsent(lock, key, expireTime, timeUnit);
+        if (success == null || !success) {
+            log.info("申请锁(" + lock + "," + key + ")失败");
+            return false;
+        }
+        log.error("申请锁(" + lock + "," + key + ")成功");
+        return true;
+    }
+
+    public void unlock(String lock, String key) {
+        String script = "if redis.call('get', KEYS[1]) == KEYS[2] then return redis.call('del', KEYS[1]) else return 0 end";
+        RedisScript<Long> redisScript = new DefaultRedisScript<>(script, Long.class);
+        Long result = redisTemplate.execute(redisScript, Arrays.asList(lock, key));
+        if (result == null || result == 0) {
+            log.info("释放锁(" + lock + "," + key + ")失败,该锁不存在或锁已经过期");
+        } else {
+            log.info("释放锁(" + lock + "," + key + ")成功");
+        }
+    }
+}

datax-modules/workflow-service-parent/workflow-service/src/main/java/cn/datax/service/workflow/controller/FlowDefinitionController.java

@@ -49,6 +49,9 @@ public class FlowDefinitionController extends BaseController {
             @ApiImplicitParam(name = "file", value = "模板文件", required = true, dataType = "__file")
     })
     public R deployByInputStream(String name, String category, String tenantId, @RequestParam("file") MultipartFile file) {
+        if (file.isEmpty()) {
+            return R.error("文件内容为空");
+        }
         try (InputStream in = file.getInputStream()) {
             flowDefinitionService.deploy(name, category, tenantId, in);
         } catch (IOException e) {
@@ -66,6 +69,9 @@ public class FlowDefinitionController extends BaseController {
             @ApiImplicitParam(name = "file", value = "模板文件", required = true, dataType = "__file")
     })
     public R deployByZip(String name, String category, String tenantId, @RequestParam("file") MultipartFile file) {
+        if (file.isEmpty()) {
+            return R.error("文件内容为空");
+        }
         try (ZipInputStream zipIn = new ZipInputStream(file.getInputStream(), Charset.forName("UTF-8"))) {
             flowDefinitionService.deploy(name, category, tenantId, zipIn);
         } catch (IOException e) {

datax-ui/src/views/basic/monitor/loginlog/LogList.vue

@@ -227,7 +227,11 @@ export default {
     },
     /** 重置按钮操作 */
     resetQuery() {
-      this.$refs['queryForm'].resetFields()
+      this.queryParams = {
+        pageNum: 1,
+        pageSize: 20,
+        userName: ''
+      }
       this.handleQuery()
     },
     /** 刷新列表 */

datax-ui/src/views/basic/monitor/operlog/LogList.vue

@@ -245,7 +245,11 @@ export default {
     },
     /** 重置按钮操作 */
     resetQuery() {
-      this.$refs['queryForm'].resetFields()
+      this.queryParams = {
+        pageNum: 1,
+        pageSize: 20,
+        userName: ''
+      }
       this.handleQuery()
     },
     /** 刷新列表 */

datax-ui/src/views/basic/scheduler/job/JobList.vue

@@ -288,7 +288,11 @@ export default {
     },
     /** 重置按钮操作 */
     resetQuery() {
-      this.$refs['queryForm'].resetFields()
+      this.queryParams = {
+        pageNum: 1,
+        pageSize: 20,
+        jobName: ''
+      }
       this.handleQuery()
     },
     /** 刷新列表 */

datax-ui/src/views/basic/scheduler/log/JobLogList.vue

@@ -255,7 +255,11 @@ export default {
     },
     /** 重置按钮操作 */
     resetQuery() {
-      this.$refs['queryForm'].resetFields()
+      this.queryParams = {
+        pageNum: 1,
+        pageSize: 20,
+        jobId: ''
+      }
       this.handleQuery()
     },
     /** 刷新列表 */

datax-ui/src/views/basic/system/config/ConfigList.vue

@@ -270,7 +270,11 @@ export default {
     },
     /** 重置按钮操作 */
     resetQuery() {
-      this.$refs['queryForm'].resetFields()
+      this.queryParams = {
+        pageNum: 1,
+        pageSize: 20,
+        configName: ''
+      }
       this.handleQuery()
     },
     /** 刷新列表 */

datax-ui/src/views/basic/system/dict/DictList.vue

@@ -287,7 +287,12 @@ export default {
     },
     /** 重置按钮操作 */
     resetQuery() {
-      this.$refs['queryForm'].resetFields()
+      this.queryParams = {
+        pageNum: 1,
+        pageSize: 20,
+        dictName: '',
+        dictCode: ''
+      }
       this.handleQuery()
     },
     /** 刷新列表 */

datax-ui/src/views/basic/system/dict/item/DictItemList.vue

@@ -283,7 +283,13 @@ export default {
     },
     /** 重置按钮操作 */
     resetQuery() {
-      this.$refs['queryForm'].resetFields()
+      this.queryParams = {
+        pageNum: 1,
+        pageSize: 20,
+        dictId: this.data.dictId,
+        itemText: '',
+        itemValue: ''
+      }
       this.handleQuery()
     },
     /** 刷新列表 */

datax-ui/src/views/basic/system/post/PostList.vue

@@ -261,7 +261,11 @@ export default {
     },
     /** 重置按钮操作 */
     resetQuery() {
-      this.$refs['queryForm'].resetFields()
+      this.queryParams = {
+        pageNum: 1,
+        pageSize: 20,
+        postName: ''
+      }
       this.handleQuery()
     },
     /** 刷新列表 */

datax-ui/src/views/basic/system/role/RoleList.vue

@@ -275,7 +275,11 @@ export default {
     },
     /** 重置按钮操作 */
     resetQuery() {
-      this.$refs['queryForm'].resetFields()
+      this.queryParams = {
+        pageNum: 1,
+        pageSize: 20,
+        roleName: ''
+      }
       this.handleQuery()
     },
     /** 刷新列表 */

datax-ui/src/views/basic/system/user/UserList.vue

@@ -345,7 +345,13 @@ export default {
     },
     /** 重置按钮操作 */
     resetQuery() {
-      this.$refs['queryForm'].resetFields()
+      this.queryParams = {
+        pageNum: 1,
+        pageSize: 20,
+        username: '',
+        nickname: '',
+        deptId: ''
+      }
       this.handleQuery()
     },
     /** 刷新列表 */

datax-ui/src/views/market/apilog/LogList.vue

@@ -236,7 +236,11 @@ export default {
     },
     /** 重置按钮操作 */
     resetQuery() {
-      this.$refs['queryForm'].resetFields()
+      this.queryParams = {
+        pageNum: 1,
+        pageSize: 20,
+        apiName: ''
+      }
       this.handleQuery()
     },
     /** 刷新列表 */

datax-ui/src/views/market/apimask/ApiMaskList.vue

@@ -254,7 +254,11 @@ export default {
     },
     /** 重置按钮操作 */
     resetQuery() {
-      this.$refs['queryForm'].resetFields()
+      this.queryParams = {
+        pageNum: 1,
+        pageSize: 20,
+        maskName: ''
+      }
       this.handleQuery()
     },
     /** 刷新列表 */

datax-ui/src/views/market/dataapi/DataApiList.vue

@@ -279,7 +279,11 @@ export default {
     },
     /** 重置按钮操作 */
     resetQuery() {
-      this.$refs['queryForm'].resetFields()
+      this.queryParams = {
+        pageNum: 1,
+        pageSize: 20,
+        apiName: ''
+      }
       this.handleQuery()
     },
     /** 刷新列表 */

datax-ui/src/views/market/dataservice/DataServiceList.vue

@@ -262,7 +262,11 @@ export default {
     },
     /** 重置按钮操作 */
     resetQuery() {
-      this.$refs['queryForm'].resetFields()
+      this.queryParams = {
+        pageNum: 1,
+        pageSize: 20,
+        serviceName: ''
+      }
       this.handleQuery()
     },
     /** 刷新列表 */

datax-ui/src/views/market/servicelog/LogList.vue

@@ -235,7 +235,11 @@ export default {
     },
     /** 重置按钮操作 */
     resetQuery() {
-      this.$refs['queryForm'].resetFields()
+      this.queryParams = {
+        pageNum: 1,
+        pageSize: 20,
+        serviceName: ''
+      }
       this.handleQuery()
     },
     /** 刷新列表 */

datax-ui/src/views/metadata/changerecord/ChangeRecordList.vue

@@ -264,7 +264,11 @@ export default {
     },
     /** 重置按钮操作 */
     resetQuery() {
-      this.$refs['queryForm'].resetFields()
+      this.queryParams = {
+        pageNum: 1,
+        pageSize: 20,
+        fieldName: ''
+      }
       this.handleQuery()
     },
     /** 刷新列表 */

datax-ui/src/views/metadata/datacolumn/DataColumnList.vue

@@ -260,9 +260,13 @@ export default {
     },
     /** 重置按钮操作 */
     resetQuery() {
-      this.$refs['queryForm'].resetFields()
-      this.queryParams.sourceId = ''
-      this.queryParams.tableId = ''
+      this.queryParams = {
+        pageNum: 1,
+        pageSize: 20,
+        columnName: '',
+        sourceId: '',
+        tableId: ''
+      }
       this.handleQuery()
     },
     /** 刷新列表 */

datax-ui/src/views/metadata/datasource/DataSourceList.vue

@@ -260,7 +260,11 @@ export default {
     },
     /** 重置按钮操作 */
     resetQuery() {
-      this.$refs['queryForm'].resetFields()
+      this.queryParams = {
+        pageNum: 1,
+        pageSize: 20,
+        sourceName: ''
+      }
       this.handleQuery()
     },
     /** 刷新列表 */

datax-ui/src/views/visual/dataset/DataSetList.vue

@@ -254,7 +254,11 @@ export default {
     },
     /** 重置按钮操作 */
     resetQuery() {
-      this.$refs['queryForm'].resetFields()
+      this.queryParams = {
+        pageNum: 1,
+        pageSize: 20,
+        setName: ''
+      }
       this.handleQuery()
     },
     /** 刷新列表 */

datax-ui/src/views/workflow/definition/DefinitionList.vue

@@ -183,51 +183,23 @@
     </el-col>
 
     <!-- 流程分类对话框 -->
-    <el-dialog :title="dialog.title" :visible.sync="dialog.category" width="400px" append-to-body>
-      <el-form ref="dialogCategoryForm" :model="dialogCategoryForm" :rules="dialogCategoryRules" label-width="80px">
-        <el-form-item label="分类名称" prop="name">
-          <el-input v-model="dialogCategoryForm.name" placeholder="请输入分类名称" />
-        </el-form-item>
-      </el-form>
-      <div slot="footer" class="dialog-footer">
-        <el-button type="primary" @click="submitDialogCategoryForm">确 定</el-button>
-        <el-button @click="dialog.category = false">取 消</el-button>
-      </div>
-    </el-dialog>
-    <!-- 部署流程模板文件对话框 -->
-    <el-dialog :title="dialog.title" :visible.sync="dialog.definition" width="400px" append-to-body>
-      <el-form ref="dialogDefinitionForm" :model="dialogDefinitionForm" :rules="dialogDefinitionRules" label-width="80px">
-        <el-form-item label="模板名称" prop="name">
-          <el-input v-model="dialogDefinitionForm.name" placeholder="请输入模板名称" />
-        </el-form-item>
-        <el-form-item label="模板文件">
-          <input type="file" @change="getDefinitionFile($event)" />
-        </el-form-item>
-      </el-form>
-      <div slot="footer" class="dialog-footer">
-        <el-button type="primary" @click="submitDialogDefinitionForm">确 定</el-button>
-        <el-button @click="dialog.definition = false">取 消</el-button>
-      </div>
-    </el-dialog>
-    <!-- 流程图对话框 -->
-    <el-dialog :title="dialog.title" :visible.sync="dialog.resource" width="600px" append-to-body>
-      <el-image :src="flowSrc">
-        <div slot="error" class="image-slot">
-          <i class="el-icon-picture-outline"></i>
-        </div>
-      </el-image>
-      <div slot="footer" class="dialog-footer">
-        <el-button @click="dialog.resource = false">取 消</el-button>
-      </div>
-    </el-dialog>
+    <flow-category v-if="dialogFlowCategoryVisible" :visible.sync="dialogFlowCategoryVisible" :data="currentCategory" @handleFlowCategoryFinished="getTree"></flow-category>
+    <!-- 流程定义对话框 -->
+    <flow-definition v-if="dialogFlowDefinitionVisible" :visible.sync="dialogFlowDefinitionVisible" :category="queryParams.categoryId" @handleFlowDefinitionFinished="getList"></flow-definition>
+    <!-- 流程资源对话框 -->
+    <flow-resource v-if="dialogFlowResourceVisible" :visible.sync="dialogFlowResourceVisible" :processDefinitionId="currentProcessDefinitionId" />
   </el-row>
 </template>
 
 <script>
-import { listCategory, addCategory, updateCategory, delCategory, pageDefinition, delDefinition, deployDefinition, flowResource, activateDefinition, suspendDefinition } from '@/api/workflow/definition'
+import { listCategory, delCategory, pageDefinition, delDefinition, activateDefinition, suspendDefinition } from '@/api/workflow/definition'
+import FlowResource from './components/FlowResource'
+import FlowCategory from './components/FlowCategory'
+import FlowDefinition from './components/FlowDefinition'
 
 export default {
   name: 'DefinitionList',
+  components: { FlowResource, FlowCategory, FlowDefinition },
   data() {
     return {
       tableHeight: document.body.offsetHeight - 310 + 'px',
@@ -277,27 +249,14 @@ export default {
         children: 'children',
         label: 'name'
       },
-      dialog: {
-        // 是否显示弹出层
-        category: false,
-        definition: false,
-        resource: false,
-        // 弹出层标题
-        title: ''
-      },
-      dialogCategoryForm: {},
-      dialogCategoryRules: {
-        name: [
-          { required: true, message: '分类名称不能为空', trigger: 'blur' }
-        ]
-      },
-      dialogDefinitionForm: {},
-      dialogDefinitionRules: {
-        name: [
-          { required: true, message: '模板名称不能为空', trigger: 'blur' }
-        ]
-      },
-      flowSrc: ''
+      // 流程图
+      dialogFlowResourceVisible: false,
+      currentProcessDefinitionId: '',
+      // 流程分类
+      dialogFlowCategoryVisible: false,
+      currentCategory: {},
+      // 流程定义
+      dialogFlowDefinitionVisible: false
     }
   },
   created() {
@@ -327,44 +286,6 @@ export default {
         this.getList()
       }
     },
-    handleAddCategory() {
-      this.dialog.category = true
-      this.dialog.title = '流程分类'
-      this.dialogCategoryForm = {
-        name: ''
-      }
-    },
-    submitDialogCategoryForm() {
-      this.$refs['dialogCategoryForm'].validate(valid => {
-        if (valid) {
-          if (this.dialogCategoryForm.id) {
-            updateCategory(this.dialogCategoryForm).then(response => {
-              if (response.success) {
-                this.$message.success('保存成功')
-                this.dialog.category = false
-                this.getTree()
-              } else {
-                this.$message.error('保存失败')
-              }
-            }).catch(error => {
-              this.$message.error(error.msg || '保存失败')
-            })
-          } else {
-            addCategory(this.dialogCategoryForm).then(response => {
-              if (response.success) {
-                this.$message.success('保存成功')
-                this.dialog.category = false
-                this.getTree()
-              } else {
-                this.$message.error('保存失败')
-              }
-            }).catch(error => {
-              this.$message.error(error.msg || '保存失败')
-            })
-          }
-        }
-      })
-    },
     /** 树节点鼠标移入移出 */
     mouseenter(data) {
       this.$set(data, 'show', true)
@@ -372,13 +293,13 @@ export default {
     mouseleave(data) {
       this.$set(data, 'show', false)
     },
+    handleAddCategory() {
+      this.dialogFlowCategoryVisible = true
+      this.currentCategory = {}
+    },
     handleEditCategory(data) {
-      this.dialog.category = true
-      this.dialog.title = '流程分类'
-      this.dialogCategoryForm = {
-        id: data.id,
-        name: data.name
-      }
+      this.dialogFlowCategoryVisible = true
+      this.currentCategory = Object.assign({}, data)
     },
     handleDelCategory(data) {
       this.$confirm('选中数据将被永久删除, 是否继续？', '提示', {
@@ -396,39 +317,12 @@ export default {
       })
     },
     handleImport() {
-      const node = this.$refs.category.getCurrentNode()
-      if (node && node.id) {
-        this.dialog.definition = true
-        this.dialog.title = '部署流程模板文件'
-        this.dialogDefinitionForm = {
-          name: '',
-          category: node.id,
-          file: ''
-        }
+      if (this.queryParams.categoryId) {
+        this.dialogFlowDefinitionVisible = true
       } else {
         this.$message.warning('请先选择流程分类')
       }
     },
-    getDefinitionFile(event) {
-      this.dialogDefinitionForm.file = event.target.files[0]
-    },
-    submitDialogDefinitionForm() {
-      const formData = new FormData()
-      formData.append('name', this.dialogDefinitionForm.name)
-      formData.append('category', this.dialogDefinitionForm.category)
-      formData.append('file', this.dialogDefinitionForm.file)
-      deployDefinition(formData).then(response => {
-        if (response.success) {
-          this.$message.success('部署成功')
-          this.dialog.definition = false
-          this.getList()
-        } else {
-          this.$message.error('部署失败')
-        }
-      }).catch(error => {
-        this.$message.error(error.msg || '部署失败')
-      })
-    },
     /** 查询数据源列表 */
     getList() {
       this.loading = true
@@ -483,12 +377,8 @@ export default {
       this.multiple = !selection.length
     },
     handleResource(row) {
-      flowResource(row.id).then(response => {
-        const blob = new Blob([response])
-        this.flowSrc = window.URL.createObjectURL(blob)
-        this.dialog.title = '流程部署资源'
-        this.dialog.resource = true
-      })
+      this.currentProcessDefinitionId = row.id
+      this.dialogFlowResourceVisible = true
     },
     handleActivate(row) {
       this.$confirm('激活流程定义？', '提示', {

datax-ui/src/views/workflow/definition/components/FlowCategory.vue

+<template>
+  <el-dialog title="流程分类" width="50%" :visible.sync="dialogVisible">
+    <el-form ref="form" :model="form" :rules="rules" label-width="100px">
+      <el-form-item label="分类名称" prop="name">
+        <el-input v-model="form.name" placeholder="请输入分类名称" />
+      </el-form-item>
+    </el-form>
+    <span slot="footer" class="dialog-footer">
+      <el-button type="primary" @click="submitForm">确定</el-button>
+      <el-button @click="dialogVisible = false">取消</el-button>
+    </span>
+  </el-dialog>
+</template>
+
+<script>
+import { addCategory, updateCategory } from '@/api/workflow/definition'
+
+export default {
+  name: 'FlowCategory',
+  props: {
+    visible: {
+      type: Boolean,
+      default: function() {
+        return false
+      }
+    },
+    data: {
+      type: Object,
+      default: function() {
+        return {}
+      }
+    }
+  },
+  data() {
+    return {
+      form: {},
+      rules: {
+        name: [
+          { required: true, message: '分类名称不能为空', trigger: 'blur' }
+        ]
+      }
+    }
+  },
+  computed: {
+    dialogVisible: {
+      get() {
+        return this.visible
+      },
+      set(val) {
+        this.$emit('update:visible', val)
+      }
+    }
+  },
+  created() {
+    console.log(this.data)
+    this.form = Object.assign({}, this.data)
+  },
+  methods: {
+    submitForm() {
+      this.$refs['form'].validate(valid => {
+        if (valid) {
+          if (this.form.id) {
+            updateCategory(this.form).then(response => {
+              if (response.success) {
+                this.$message.success('保存成功')
+                this.dialogVisible = false
+                this.$emit('handleFlowCategoryFinished')
+              }
+            }).catch(error => {
+              this.$message.error(error.msg || '保存失败')
+            })
+          } else {
+            addCategory(this.form).then(response => {
+              if (response.success) {
+                this.$message.success('保存成功')
+                this.dialogVisible = false
+                this.$emit('handleFlowCategoryFinished')
+              }
+            }).catch(error => {
+              this.$message.error(error.msg || '保存失败')
+            })
+          }
+        }
+      })
+    }
+  }
+}
+</script>
+
+<style lang="scss" scoped>
+
+</style>

datax-ui/src/views/workflow/definition/components/FlowDefinition.vue

+<template>
+  <el-dialog title="流程定义" width="50%" :visible.sync="dialogVisible">
+    <el-form ref="form" :model="form" :rules="rules" label-width="100px">
+      <el-form-item label="模板名称" prop="name">
+        <el-input v-model="form.name" placeholder="请输入模板名称" />
+      </el-form-item>
+      <el-form-item label="模板文件">
+        <el-upload
+          ref="upload"
+          class="upload-demo"
+          action=""
+          :limit="1"
+          :on-change="handleChange"
+          :on-remove="handleRemove"
+          :auto-upload="false"
+          accept="text/xml"
+        >
+          <el-button slot="trigger" size="small" type="primary">选取文件</el-button>
+          <div slot="tip" class="el-upload__tip">只能上传.bpmn20.xml结尾的文件</div>
+        </el-upload>
+      </el-form-item>
+    </el-form>
+    <span slot="footer" class="dialog-footer">
+      <el-button type="primary" @click="submitForm">确定</el-button>
+      <el-button @click="dialogVisible = false">取消</el-button>
+    </span>
+  </el-dialog>
+</template>
+
+<script>
+import { deployDefinition } from '@/api/workflow/definition'
+
+export default {
+  name: 'FlowDefinition',
+  props: {
+    visible: {
+      type: Boolean,
+      default: function() {
+        return false
+      }
+    },
+    category: {
+      type: String,
+      default: function() {
+        return ''
+      }
+    }
+  },
+  data() {
+    return {
+      form: {},
+      rules: {
+        name: [
+          { required: true, message: '模板名称不能为空', trigger: 'blur' }
+        ]
+      }
+    }
+  },
+  computed: {
+    dialogVisible: {
+      get() {
+        return this.visible
+      },
+      set(val) {
+        this.$emit('update:visible', val)
+      }
+    }
+  },
+  methods: {
+    handleRemove(file) {
+      this.form.file = undefined
+    },
+    handleChange(file) {
+      this.form.file = file.raw
+    },
+    submitForm() {
+      this.$refs['form'].validate(valid => {
+        if (valid) {
+          const formData = new FormData()
+          formData.append('category', this.category)
+          formData.append('name', this.form.name)
+          formData.append('file', this.form.file)
+          deployDefinition(formData).then(response => {
+            if (response.success) {
+              this.$message.success('部署成功')
+              this.dialogVisible = false
+              this.$emit('handleFlowDefinitionFinished')
+            }
+          }).catch(error => {
+            this.$message.error(error.msg || '部署失败')
+          })
+        }
+      })
+    }
+  }
+}
+</script>
+
+<style lang="scss" scoped>
+
+</style>

datax-ui/src/views/workflow/definition/components/FlowResource.vue

+<template>
+  <el-dialog title="流程资源" width="50%" :visible.sync="dialogVisible">
+    <el-image :src="flowSrc">
+      <div slot="error" class="image-slot">
+        <i class="el-icon-picture-outline"></i>
+      </div>
+    </el-image>
+    <span slot="footer" class="dialog-footer">
+      <el-button @click="dialogVisible = false">取消</el-button>
+    </span>
+  </el-dialog>
+</template>
+
+<script>
+import { flowResource } from '@/api/workflow/definition'
+
+export default {
+  name: 'FlowResource',
+  props: {
+    visible: {
+      type: Boolean,
+      default: function() {
+        return false
+      }
+    },
+    processDefinitionId: {
+      type: String,
+      default: function() {
+        return ''
+      }
+    }
+  },
+  data() {
+    return {
+      flowSrc: ''
+    }
+  },
+  computed: {
+    dialogVisible: {
+      get() {
+        return this.visible
+      },
+      set(val) {
+        this.$emit('update:visible', val)
+      }
+    }
+  },
+  created() {
+    this.init()
+  },
+  methods: {
+    init() {
+      flowResource(this.processDefinitionId).then(response => {
+        const blob = new Blob([response])
+        this.flowSrc = window.URL.createObjectURL(blob)
+      })
+    }
+  }
+}
+</script>
+
+<style lang="scss" scoped>
+
+</style>

datax-ui/src/views/workflow/instance/components/FlowImage.vue

+<template>
+  <el-dialog title="流程图" width="50%" :visible.sync="dialogVisible">
+    <el-image :src="flowSrc">
+      <div slot="error" class="image-slot">
+        <i class="el-icon-picture-outline"></i>
+      </div>
+    </el-image>
+    <span slot="footer" class="dialog-footer">
+      <el-button @click="dialogVisible = false">取消</el-button>
+    </span>
+  </el-dialog>
+</template>
+
+<script>
+import { flowTrack } from '@/api/workflow/instance'
+
+export default {
+  name: 'FlowImage',
+  props: {
+    visible: {
+      type: Boolean,
+      default: function() {
+        return false
+      }
+    },
+    processInstanceId: {
+      type: String,
+      default: function() {
+        return ''
+      }
+    }
+  },
+  data() {
+    return {
+      flowSrc: ''
+    }
+  },
+  computed: {
+    dialogVisible: {
+      get() {
+        return this.visible
+      },
+      set(val) {
+        this.$emit('update:visible', val)
+      }
+    }
+  },
+  created() {
+    this.init()
+  },
+  methods: {
+    init() {
+      flowTrack(this.processInstanceId).then(response => {
+        const blob = new Blob([response])
+        this.flowSrc = window.URL.createObjectURL(blob)
+      })
+    }
+  }
+}
+</script>
+
+<style lang="scss" scoped>
+
+</style>

datax-ui/src/views/workflow/instance/myinvolved/MyInvolvedInstanceList.vue

@@ -68,25 +68,19 @@
       @size-change="handleSizeChange"
       @current-change="handleCurrentChange"
     />
+
     <!-- 流程图对话框 -->
-    <el-dialog :title="dialog.title" :visible.sync="dialog.track" width="600px" append-to-body>
-      <el-image :src="flowSrc">
-        <div slot="error" class="image-slot">
-          <i class="el-icon-picture-outline"></i>
-        </div>
-      </el-image>
-      <div slot="footer" class="dialog-footer">
-        <el-button @click="dialog.track = false">取 消</el-button>
-      </div>
-    </el-dialog>
+    <flow-image v-if="dialogFlowImageVisible" :visible.sync="dialogFlowImageVisible" :processInstanceId="currentProcessInstanceId"></flow-image>
   </el-card>
 </template>
 
 <script>
-import { pageMyInvolvedInstance, flowTrack } from '@/api/workflow/instance'
+import { pageMyInvolvedInstance } from '@/api/workflow/instance'
+import FlowImage from '../components/FlowImage'
 
 export default {
   name: 'MyInvolvedInstanceList',
+  components: { FlowImage },
   data() {
     return {
       tableHeight: document.body.offsetHeight - 310 + 'px',
@@ -122,13 +116,9 @@ export default {
         pageSize: 20,
         name: ''
       },
-      dialog: {
-        // 是否显示弹出层
-        track: false,
-        // 弹出层标题
-        title: ''
-      },
-      flowSrc: ''
+      // 流程图
+      dialogFlowImageVisible: false,
+      currentProcessInstanceId: ''
     }
   },
   created() {
@@ -168,12 +158,8 @@ export default {
       this.multiple = !selection.length
     },
     handleTrack(row) {
-      flowTrack(row.id).then(response => {
-        const blob = new Blob([response])
-        this.flowSrc = window.URL.createObjectURL(blob)
-        this.dialog.title = '流程追踪'
-        this.dialog.track = true
-      })
+      this.currentProcessInstanceId = row.id
+      this.dialogFlowImageVisible = true
     },
     handleSizeChange(val) {
       console.log(`每页 ${val} 条`)

datax-ui/src/views/workflow/instance/mystarted/MyStartedInstanceList.vue

@@ -69,25 +69,19 @@
       @size-change="handleSizeChange"
       @current-change="handleCurrentChange"
     />
+
     <!-- 流程图对话框 -->
-    <el-dialog :title="dialog.title" :visible.sync="dialog.track" width="600px" append-to-body>
-      <el-image :src="flowSrc">
-        <div slot="error" class="image-slot">
-          <i class="el-icon-picture-outline"></i>
-        </div>
-      </el-image>
-      <div slot="footer" class="dialog-footer">
-        <el-button @click="dialog.track = false">取 消</el-button>
-      </div>
-    </el-dialog>
+    <flow-image v-if="dialogFlowImageVisible" :visible.sync="dialogFlowImageVisible" :processInstanceId="currentProcessInstanceId"></flow-image>
   </el-card>
 </template>
 
 <script>
-import { pageMyStartedInstance, flowTrack } from '@/api/workflow/instance'
+import { pageMyStartedInstance } from '@/api/workflow/instance'
+import FlowImage from '../components/FlowImage'
 
 export default {
   name: 'MyStartedInstanceList',
+  components: { FlowImage },
   data() {
     return {
       tableHeight: document.body.offsetHeight - 310 + 'px',
@@ -123,13 +117,9 @@ export default {
         pageSize: 20,
         name: ''
       },
-      dialog: {
-        // 是否显示弹出层
-        track: false,
-        // 弹出层标题
-        title: ''
-      },
-      flowSrc: ''
+      // 流程图
+      dialogFlowImageVisible: false,
+      currentProcessInstanceId: ''
     }
   },
   created() {
@@ -169,12 +159,8 @@ export default {
       this.multiple = !selection.length
     },
     handleTrack(row) {
-      flowTrack(row.id).then(response => {
-        const blob = new Blob([response])
-        this.flowSrc = window.URL.createObjectURL(blob)
-        this.dialog.title = '流程追踪'
-        this.dialog.track = true
-      })
+      this.currentProcessInstanceId = row.id
+      this.dialogFlowImageVisible = true
     },
     handleSizeChange(val) {
       console.log(`每页 ${val} 条`)

datax-ui/src/views/workflow/instance/running/RunningInstanceList.vue

@@ -89,25 +89,19 @@
       @size-change="handleSizeChange"
       @current-change="handleCurrentChange"
     />
+
     <!-- 流程图对话框 -->
-    <el-dialog :title="dialog.title" :visible.sync="dialog.track" width="600px" append-to-body>
-      <el-image :src="flowSrc">
-        <div slot="error" class="image-slot">
-          <i class="el-icon-picture-outline"></i>
-        </div>
-      </el-image>
-      <div slot="footer" class="dialog-footer">
-        <el-button @click="dialog.track = false">取 消</el-button>
-      </div>
-    </el-dialog>
+    <flow-image v-if="dialogFlowImageVisible" :visible.sync="dialogFlowImageVisible" :processInstanceId="currentProcessInstanceId"></flow-image>
   </el-card>
 </template>
 
 <script>
-import { pageRunningInstance, delInstance, activateInstance, suspendInstance, flowTrack } from '@/api/workflow/instance'
+import { pageRunningInstance, delInstance, activateInstance, suspendInstance } from '@/api/workflow/instance'
+import FlowImage from '../components/FlowImage'
 
 export default {
   name: 'InstanceList',
+  components: { FlowImage },
   data() {
     return {
       tableHeight: document.body.offsetHeight - 310 + 'px',
@@ -147,13 +141,9 @@ export default {
         pageSize: 20,
         name: ''
       },
-      dialog: {
-        // 是否显示弹出层
-        track: false,
-        // 弹出层标题
-        title: ''
-      },
-      flowSrc: ''
+      // 流程图
+      dialogFlowImageVisible: false,
+      currentProcessInstanceId: ''
     }
   },
   created() {
@@ -193,12 +183,8 @@ export default {
       this.multiple = !selection.length
     },
     handleTrack(row) {
-      flowTrack(row.id).then(response => {
-        const blob = new Blob([response])
-        this.flowSrc = window.URL.createObjectURL(blob)
-        this.dialog.title = '流程追踪'
-        this.dialog.track = true
-      })
+      this.currentProcessInstanceId = row.id
+      this.dialogFlowImageVisible = true
     },
     handleActivate(row) {
       this.$confirm('激活流程实例？', '提示', {

datax-ui/src/views/workflow/task/components/HandleTask.vue

+<template>
+  <el-dialog title="任务审核" width="50%" :visible.sync="dialogVisible">
+    <el-form ref="form" :model="form" :rules="rules" label-width="100px">
+      <el-form-item label="意审核见" prop="message">
+        <el-input
+          v-model="form.message"
+          :autosize="{ minRows: 2, maxRows: 3}"
+          type="textarea"
+          placeholder="请输入审核意见"
+          maxlength="100"
+          show-word-limit
+        />
+      </el-form-item>
+    </el-form>
+    <span slot="footer" class="dialog-footer">
+      <el-button type="primary" @click="doComplete(true)">同意</el-button>
+      <el-button type="primary" @click="doComplete(false)">不同意</el-button>
+      <el-button @click="dialogVisible = false">取消</el-button>
+    </span>
+  </el-dialog>
+</template>
+
+<script>
+import { executeTask } from '@/api/workflow/task'
+
+export default {
+  name: 'HandleTask',
+  props: {
+    visible: {
+      type: Boolean,
+      default: function() {
+        return false
+      }
+    },
+    task: {
+      type: Object,
+      default: function() {
+        return {}
+      }
+    }
+  },
+  data() {
+    return {
+      form: { message: '' },
+      rules: {
+        message: [
+          { required: true, message: '审核意见不能为空', trigger: 'blur' }
+        ]
+      }
+    }
+  },
+  computed: {
+    dialogVisible: {
+      get() {
+        return this.visible
+      },
+      set(val) {
+        this.$emit('update:visible', val)
+      }
+    }
+  },
+  methods: {
+    doComplete(approved) {
+      this.$refs['form'].validate(valid => {
+        if (valid) {
+          const data = {
+            action: 'complete',
+            processInstanceId: this.task.processInstanceId,
+            taskId: this.task.id,
+            userId: '',
+            message: this.form.message,
+            variables: { approved: approved }
+          }
+          executeTask(data).then(response => {
+            if (response.success) {
+              this.$message.success('任务审核成功')
+              this.dialogVisible = false
+              this.$emit('handleTaskFinished')
+            }
+          })
+        }
+      })
+    }
+  }
+}
+</script>
+
+<style lang="scss" scoped>
+
+</style>

datax-ui/src/views/workflow/task/todo/TaskTodoList.vue

@@ -89,9 +89,9 @@
               v-if="scope.row.assignee && scope.row.assignee === user.id"
               size="mini"
               type="text"
-              icon="el-icon-delete"
+              icon="el-icon-view"
               @click="handleTask(scope.row)"
-            >审批</el-button>
+            >审核</el-button>
             <el-button slot="reference">操作</el-button>
           </el-popover>
         </template>
@@ -107,15 +107,20 @@
       @size-change="handleSizeChange"
       @current-change="handleCurrentChange"
     />
+
+    <!-- 任务审核对话框 -->
+    <handle-task v-if="dialogHandleTaskVisible" :visible.sync="dialogHandleTaskVisible" :task="currentTask" @handleTaskFinished="getList"></handle-task>
   </el-card>
 </template>
 
 <script>
 import { pageTodoTask, executeTask } from '@/api/workflow/task'
 import { mapGetters } from 'vuex'
+import HandleTask from '../components/HandleTask'
 
 export default {
   name: 'TaskTodoList',
+  components: { HandleTask },
   data() {
     return {
       tableHeight: document.body.offsetHeight - 310 + 'px',
@@ -147,7 +152,9 @@ export default {
         pageSize: 20,
         businessCode: '',
         businessName: ''
-      }
+      },
+      dialogHandleTaskVisible: false,
+      currentTask: {}
     }
   },
   created() {
@@ -240,7 +247,10 @@ export default {
     },
     handleDelegate(row) {},
     handleAssignee(row) {},
-    handleTask(row) {},
+    handleTask(row) {
+      this.currentTask = Object.assign({}, row)
+      this.dialogHandleTaskVisible = true
+    },
     handleSizeChange(val) {
       console.log(`每页 ${val} 条`)
       this.queryParams.pageNum = 1