From 0b08d373869c91dda58dd0e33b13fe59688234f9 Mon Sep 17 00:00:00 2001
From: zzw <wander.zheng@qq.com>
Date: 星期三, 29 十一月 2023 17:03:54 +0800
Subject: [PATCH] Merge remote-tracking branch 'origin/master'

---
 web/src/views/modules/flowChart/flowChartEdit.vue                                                                    |  827 +++++++++++++++++++
 modules/mainPart/src/main/java/com/zt/life/modules/configItemWarehouse/model/ConfigItemWarehouse.java                |    9 
 web/src/views/modules/itemCirculatOrder/ItemCirculatOrder-AddOrUpdate.vue                                            |    8 
 zt/core/src/main/resources/mapper/workflowconfig/WfDefDao.xml                                                        |   11 
 modules/mainPart/src/main/java/com/zt/life/modules/configItemWarehouse/dto/ConfigItemWarehouseDto.java               |    3 
 modules/mainPart/src/main/java/com/zt/life/modules/configItemWarehouse/controller/ConfigItemWarehouseController.java |   20 
 web/src/views/modules/itemCirculatOrder/ItemCirculatOrder.vue                                                        |    4 
 web/src/views/modules/sys/task/already-task.vue                                                                      |   13 
 modules/mainPart/src/main/java/com/zt/life/modules/configItemWarehouse/service/ConfigItemWarehouseService.java       |    3 
 web/src/views/modules/project/Environ.vue                                                                            |    4 
 web/src/views/modules/flowChart/flowChartView.vue                                                                    |  474 +++++++++++
 web/src/views/modules/project/Project.vue                                                                            |    4 
 web/src/views/modules/project/SoftwareTestOrder.vue                                                                  |    4 
 web/src/views/modules/flowChart/ConfigNode/project-list-select.vue                                                   |  273 ++++++
 web/src/views/modules/flowChart/flowChartEdge/index.vue                                                              |  143 +++
 web/src/views/modules/flowChart/ProcessTrajectory.vue                                                                |   42 +
 modules/mainPart/src/main/java/com/zt/life/modules/configItemWarehouse/model/WarehouseConfigItem.java                |    3 
 web/src/views/modules/sys/task/stay-task.vue                                                                         |    8 
 web/src/views/modules/configItemWarehouse/ConfigItemWarehouse.vue                                                    |   18 
 web/src/views/modules/flowChart/processTimeline.vue                                                                  |  111 ++
 web/src/views/modules/sys/task/taskCenter.vue                                                                        |    7 
 web/src/views/modules/flowChart/ConfigNode/index.vue                                                                 |  256 ++++++
 modules/mainPart/src/main/resources/mapper/configItemWarehouse/ConfigItemWarehouseDao.xml                            |    2 
 web/src/views/modules/flowChart/flowChartNode/index.vue                                                              |  235 +++++
 24 files changed, 2,422 insertions(+), 60 deletions(-)

diff --git a/modules/mainPart/src/main/java/com/zt/life/modules/configItemWarehouse/controller/ConfigItemWarehouseController.java b/modules/mainPart/src/main/java/com/zt/life/modules/configItemWarehouse/controller/ConfigItemWarehouseController.java
index ba35e36..3c06162 100644
--- a/modules/mainPart/src/main/java/com/zt/life/modules/configItemWarehouse/controller/ConfigItemWarehouseController.java
+++ b/modules/mainPart/src/main/java/com/zt/life/modules/configItemWarehouse/controller/ConfigItemWarehouseController.java
@@ -14,6 +14,7 @@
 import com.zt.common.validator.group.UpdateGroup;
 import com.zt.life.modules.configItemWarehouse.dto.ConfigItemWarehouseDto;
 import com.zt.life.modules.configItemWarehouse.model.ConfigItemWarehouse;
+import com.zt.life.modules.configItemWarehouse.model.WarehouseConfigItem;
 import com.zt.life.modules.configItemWarehouse.service.ConfigItemWarehouseService;
 import com.zt.life.modules.itemCirculatOrder.dto.ItemCirculatOrderDto;
 import com.zt.life.modules.itemCirculatOrder.model.ItemCirculatOrderTechnical;
@@ -60,12 +61,12 @@
         @ApiImplicitParam(name = Constant.Q.ORDER_FIELD, value = Constant.QV.ORDER_FIELD, dataType = Constant.QT.STRING),
         @ApiImplicitParam(name = Constant.Q.ORDER, value = Constant.QV.ORDER, dataType = Constant.QT.STRING),
         @ApiImplicitParam(name = "code", value = "閰嶇疆椤瑰叆搴撶紪鍙�", dataType = Constant.QT.STRING, format = "code^LK"),
-        @ApiImplicitParam(name = "projectCode", value = "椤圭洰缂栧彿", dataType = Constant.QT.STRING, format = "project_code^LK"),
-        @ApiImplicitParam(name = "projectName", value = "椤圭洰鍚嶇О", dataType = Constant.QT.STRING, format = "project_name^LK"),
+        @ApiImplicitParam(name = "projectCode", value = "椤圭洰缂栧彿", dataType = Constant.QT.STRING, format = "code1^EQ"),
+        @ApiImplicitParam(name = "softwareName", value = "椤圭洰鍚嶇О", dataType = Constant.QT.STRING, format = "software_name^EQ"),
         @ApiImplicitParam(name = "libraryType", value = "搴撶被鍨�", dataType = Constant.QT.STRING, format = "library_type^EQ")    })
     public PageResult<ConfigItemWarehouse> page(@ApiIgnore @QueryParam QueryFilter queryFilter){
-
-        return PageResult.ok(configItemWarehouseService.page(queryFilter));
+        List<ConfigItemWarehouse> configItemWarehouse=configItemWarehouseService.page(queryFilter);
+        return PageResult.ok(configItemWarehouse);
     }
 
     @GetMapping("getDto")
@@ -73,9 +74,12 @@
     public Result<ConfigItemWarehouseDto> getDto(Long projectId, Long warehouseId) {
         ConfigItemWarehouseDto data =configItemWarehouseService.getDto(projectId, warehouseId);
         if (warehouseId!=null) {
-            OssDto ossDto = sysOssConfigService.getOssByBusiType(warehouseId, "config_item_warehouse");
-            if (ossDto != null) {
-                data.setFiles(ossDto);
+            for (WarehouseConfigItem configItem  : data.getConfigItemList()) {
+                Long configItemId = configItem.getId();
+                OssDto ossDto = sysOssConfigService.getOssByBusiType(configItemId, "config_item_warehouse");
+                if (ossDto != null) {
+                    configItem.setFiles(ossDto);
+                }
             }
         }
         return Result.ok(data);
@@ -106,7 +110,7 @@
         return Result.ok();
     }
 
-    @DeleteMapping
+    @DeleteMapping("deleteConfigItem")
     @ApiOperation("鍒犻櫎")
     @LogOperation("鍒犻櫎")
     public Result delete(@RequestBody Long[] ids){
diff --git a/modules/mainPart/src/main/java/com/zt/life/modules/configItemWarehouse/dto/ConfigItemWarehouseDto.java b/modules/mainPart/src/main/java/com/zt/life/modules/configItemWarehouse/dto/ConfigItemWarehouseDto.java
index 1c37670..13810f6 100644
--- a/modules/mainPart/src/main/java/com/zt/life/modules/configItemWarehouse/dto/ConfigItemWarehouseDto.java
+++ b/modules/mainPart/src/main/java/com/zt/life/modules/configItemWarehouse/dto/ConfigItemWarehouseDto.java
@@ -25,8 +25,7 @@
     private Project project;
     @ApiModelProperty(value = "閰嶇疆椤瑰叆搴�")
     private ConfigItemWarehouse configItemWarehouse;
-    @ApiModelProperty(value = "闄勪欢")
-    private OssDto files;
+
 
     @ApiModelProperty(value = "鍏ュ簱閰嶇疆椤�")
     private List<WarehouseConfigItem> configItemList = new ArrayList<>();
diff --git a/modules/mainPart/src/main/java/com/zt/life/modules/configItemWarehouse/model/ConfigItemWarehouse.java b/modules/mainPart/src/main/java/com/zt/life/modules/configItemWarehouse/model/ConfigItemWarehouse.java
index 596f425..1e24a90 100644
--- a/modules/mainPart/src/main/java/com/zt/life/modules/configItemWarehouse/model/ConfigItemWarehouse.java
+++ b/modules/mainPart/src/main/java/com/zt/life/modules/configItemWarehouse/model/ConfigItemWarehouse.java
@@ -1,5 +1,6 @@
 package com.zt.life.modules.configItemWarehouse.model;
 
+import com.baomidou.mybatisplus.annotation.TableField;
 import com.baomidou.mybatisplus.annotation.TableName;
 import com.fasterxml.jackson.annotation.JsonFormat;
 import com.zt.common.entity.BusiEntity;
@@ -84,4 +85,12 @@
 	@ApiModelProperty(value = "骞翠唤")
 	private String year;
 
+	@TableField(exist = false)
+	@ApiModelProperty(value = "椤圭洰鍚嶇О")
+	private String softwareName;
+
+	@TableField(exist = false)
+	@ApiModelProperty(value = "椤圭洰缂栧彿")
+	private String projectCode;
+
 }
diff --git a/modules/mainPart/src/main/java/com/zt/life/modules/configItemWarehouse/model/WarehouseConfigItem.java b/modules/mainPart/src/main/java/com/zt/life/modules/configItemWarehouse/model/WarehouseConfigItem.java
index 9a0c518..9460079 100644
--- a/modules/mainPart/src/main/java/com/zt/life/modules/configItemWarehouse/model/WarehouseConfigItem.java
+++ b/modules/mainPart/src/main/java/com/zt/life/modules/configItemWarehouse/model/WarehouseConfigItem.java
@@ -2,6 +2,7 @@
 
 import com.baomidou.mybatisplus.annotation.TableName;
 import com.zt.common.entity.BusiEntity;
+import com.zt.life.sys.dto.OssDto;
 import io.swagger.annotations.ApiModel;
 import io.swagger.annotations.ApiModelProperty;
 import lombok.Data;
@@ -42,4 +43,6 @@
 	@ApiModelProperty(value = "瀵嗙骇")
 	private String secretClass;
 
+	@ApiModelProperty(value = "闄勪欢")
+	private OssDto files;
 }
diff --git a/modules/mainPart/src/main/java/com/zt/life/modules/configItemWarehouse/service/ConfigItemWarehouseService.java b/modules/mainPart/src/main/java/com/zt/life/modules/configItemWarehouse/service/ConfigItemWarehouseService.java
index 6d98b9e..862c230 100644
--- a/modules/mainPart/src/main/java/com/zt/life/modules/configItemWarehouse/service/ConfigItemWarehouseService.java
+++ b/modules/mainPart/src/main/java/com/zt/life/modules/configItemWarehouse/service/ConfigItemWarehouseService.java
@@ -100,6 +100,7 @@
                 configItem.setWarehouseId(warehouseId);
                 configItemService.insert(configItem);
             }
+            sysOssConfigService.updateOss(configItem.getId(), configItem.getFiles());// 淇濆瓨闄勪欢
         }
 
         for (WarehouseCmAudit cmAudit : configItemDto.getCmAuditList()) {
@@ -121,8 +122,6 @@
                 qaAuditService.insert(qaAudit);
             }
         }
-        sysOssConfigService.updateOss(configItemDto.getId(), configItemDto.getFiles());// 淇濆瓨闄勪欢
-
         return true;
     }
 
diff --git a/modules/mainPart/src/main/resources/mapper/configItemWarehouse/ConfigItemWarehouseDao.xml b/modules/mainPart/src/main/resources/mapper/configItemWarehouse/ConfigItemWarehouseDao.xml
index 58e02bc..a39002e 100644
--- a/modules/mainPart/src/main/resources/mapper/configItemWarehouse/ConfigItemWarehouseDao.xml
+++ b/modules/mainPart/src/main/resources/mapper/configItemWarehouse/ConfigItemWarehouseDao.xml
@@ -4,7 +4,7 @@
 <mapper namespace="com.zt.life.modules.configItemWarehouse.dao.ConfigItemWarehouseDao">
 
     <select id="getList" resultType="com.zt.life.modules.configItemWarehouse.model.ConfigItemWarehouse">
-        select a.* ,p.*
+        select a.* ,p.*,p.CODE AS projectCode
         from config_item_warehouse a
         INNER JOIN  project p ON p.id = a.project_id
         <where>
diff --git a/web/src/views/modules/configItemWarehouse/ConfigItemWarehouse.vue b/web/src/views/modules/configItemWarehouse/ConfigItemWarehouse.vue
index 30e0824..1b75940 100644
--- a/web/src/views/modules/configItemWarehouse/ConfigItemWarehouse.vue
+++ b/web/src/views/modules/configItemWarehouse/ConfigItemWarehouse.vue
@@ -1,7 +1,6 @@
 <template>
-  <el-card shadow="never" class="aui-card--fill">
-    <div class="mod-configItemWarehouse-configItemWarehouse}">
-      <zt-table-wraper query-url="/configItemWarehouse/ConfigItemWarehouse/page" delete-url="/configItemWarehouse/ConfigItemWarehouse" v-slot="{ table }">
+  <div class="fa-card-a">
+      <zt-table-wraper query-url="/configItemWarehouse/ConfigItemWarehouse/page" delete-url="/configItemWarehouse/ConfigItemWarehouse/deleteConfigItem" v-slot="{ table }">
         <el-form :inline="true" :model="dataForm" @keyup.enter.native="table.query()">
           <el-form-item>
             <el-input v-model="dataForm.code" placeholder="璇疯緭鍏ラ厤缃」鍏ュ簱缂栧彿" clearable></el-input>
@@ -10,7 +9,7 @@
             <el-input v-model="dataForm.projectCode" placeholder="璇疯緭鍏ラ」鐩紪鍙�" clearable></el-input>
           </el-form-item>
           <el-form-item>
-            <el-input v-model="dataForm.projectName" placeholder="璇疯緭鍏ラ」鐩悕绉�" clearable></el-input>
+            <el-input v-model="dataForm.softwareName" placeholder="璇疯緭鍏ラ」鐩悕绉�" clearable></el-input>
           </el-form-item>
           <el-form-item>
             <zt-dict v-model="dataForm.libraryType" dict="library_type" clearable></zt-dict>
@@ -22,10 +21,10 @@
           </el-form-item>
         </el-form>
         <el-table v-loading="table.dataLoading" :data="table.dataList" height="100px" v-adaptive="{bottomOffset:70}" border @selection-change="table.selectionChangeHandle">
-          <el-table-column type="selection" width="40"/>
+          <el-table-column align="center" type="selection" width="40"/>
             <el-table-column prop="code" label="閰嶇疆椤瑰叆搴撶紪鍙�"/>
                 <el-table-column prop="projectCode" label="椤圭洰缂栧彿"/>
-                <el-table-column prop="projectName" label="椤圭洰鍚嶇О"/>
+                <el-table-column prop="softwareName" label="椤圭洰鍚嶇О"/>
                 <zt-table-column-dict prop="libraryType" label="搴撶被鍨�" dict="library_type"/>
               <zt-table-column-handle :table="table" edit-perm="configItemWarehouse:update" delete-perm="configItemWarehouse::delete"/>
         </el-table>
@@ -36,8 +35,7 @@
                        @setProjectInfo="openAddWin">
         </ProjectSelect>
       </zt-table-wraper>
-    </div>
-  </el-card>
+  </div>
 </template>
 
 <script>
@@ -49,8 +47,8 @@
         dataForm: {
           code: '',
           projectCode: '',
-          projectName: '',
-          libraryType: '',
+          softwareName: '',
+          libraryType: ''
         }
       }
     },
diff --git a/web/src/views/modules/flowChart/ConfigNode/index.vue b/web/src/views/modules/flowChart/ConfigNode/index.vue
new file mode 100644
index 0000000..ebf59e9
--- /dev/null
+++ b/web/src/views/modules/flowChart/ConfigNode/index.vue
@@ -0,0 +1,256 @@
+<template>
+  <div style="position: absolute;top:6%;right:0;background:#cccccc;width: 300px;" :style="'height:'+ left_p + 'px'">
+  <el-card style="height: 100%">
+    <el-tabs v-model="activeName" id="tabPane">
+      <el-tab-pane label="鏂囨湰"  name="first">
+        <el-row :gutter="5" align="middle" style="margin-top:20px">
+          <el-col :span=8 style="font-size: 16px;line-height: 38px">鏂囨湰澶у皬</el-col>
+          <el-col :span=16>
+            <el-slider :min=8 :max=20 :step=1 v-model="globalGridAttr.nodeFontSize" @change="onFontSizeChange"></el-slider>
+          </el-col>
+        </el-row>
+        <el-row :gutter="5" align="middle" style="margin-top:20px">
+          <el-col :span=8 style="font-size: 16px;line-height: 40px">瀛椾綋棰滆壊</el-col>
+          <el-col :span=16>
+            <el-color-picker  v-model="globalGridAttr.nodeColor" style="width: 100%" @change="onColorChange"></el-color-picker>
+          </el-col>
+        </el-row>
+        <el-row v-show="shape!=='custom-text' || shape!=='custom-circle1'" :gutter="5" align="middle" style="margin-top:20px">
+          <el-col :span=8 style="font-size: 16px;line-height: 32px">椤圭洰鍚嶇О</el-col>
+          <el-col :span=16 >
+            <el-input  @click.native='showDialog' v-model="globalGridAttr.inspectName" style="width:100%"></el-input>
+          </el-col>
+        </el-row>
+        <el-row :gutter="5" v-show="shape!=='custom-circle1'"  align="middle" style="margin-top:20px">
+          <el-col :span=8 style="font-size: 16px;line-height: 32px">杩囩▼鍚嶇О</el-col>
+          <el-col :span=16 >
+            <el-input  v-model="globalGridAttr.nodeText" style="width:100%" @change="onTextChange"></el-input>
+          </el-col>
+        </el-row>
+        <el-row v-show="shape!=='custom-text'" :gutter="5" align="middle" style="margin-top:20px">
+          <el-col :span=8 style="font-size: 16px;line-height: 32px">鏃ユ湡</el-col>
+          <el-col :span=16 >
+            <el-date-picker v-model="globalGridAttr.nodeDate" type="date" placeholder="閫夋嫨鏃ユ湡" value-format="yyyy-MM-dd"
+                            style="width: 100%" @change="onDateChange">
+            </el-date-picker>
+          </el-col>
+        </el-row>
+      </el-tab-pane>
+      <el-tab-pane label="鑺傜偣"  name="second">
+        <el-row align="middle" style="margin-top:20px">
+          <el-col :span=8 style="font-size: 16px;line-height: 40px">杈规棰滆壊</el-col>
+          <el-col :span=16>
+            <el-color-picker v-model="globalGridAttr.nodeStroke" style="width: 100%" @change="onStrokeChange"></el-color-picker>
+          </el-col>
+        </el-row>
+        <el-row align="middle"style="margin-top:20px">
+          <el-col :span=8 style="font-size: 16px;line-height: 38px">杈规瀹藉害</el-col>
+          <el-col :span=16>
+            <el-slider :min=1 :max=20 :step=1 v-model="globalGridAttr.nodeStrokeWidth" @change="onStrokeWidthChange"></el-slider>
+          </el-col>
+        </el-row>
+        <el-row align="middle" style="margin-top:20px">
+          <el-col :span=8 style="font-size: 16px;line-height: 40px">棰滆壊</el-col>
+          <el-col :span=16>
+            <el-color-picker  v-model="globalGridAttr.nodeFill" style="width: 100%" @change="onFillChange"></el-color-picker>
+          </el-col>
+        </el-row>
+      </el-tab-pane>
+    </el-tabs>
+  </el-card>
+    <el-dialog ref="detailedDialog"  title="閫夋嫨椤圭洰" width='85%' :visible.sync="dialogVisible ">
+      <Inspection @func="procResult" ref="inspectionNode" />
+    </el-dialog>
+  </div>
+</template>
+
+<script>
+import { Graph, Shape, Node, Addon, Cell,FunctionExt} from '@antv/x6';
+import Inspection from './project-list-select'
+// const {inject} = require("vue");
+export default {
+  name: "index",
+  data(){
+    return{
+      data:{
+        dataId:'',
+        finishDate: '',
+        inspectName:''
+      },
+      date:'',
+      text:'',
+      dateId:'',
+      content:'',
+      dialogVisible:false,
+      activeName: 'first',
+      // globalGridAttr:{},
+      curCel:Cell,
+      left_p:document.documentElement.clientHeight*0.9,
+    }
+  },
+  components:{
+    Inspection
+  },
+  props:{
+    id: {
+      type: String,
+    },
+    shape:{
+      type: String
+    },
+    refY2:{
+      type: Number
+    },
+    globalGridAttr:{
+      type: Object,
+    },
+    graph:{
+      type: String,
+    },
+    projectId:{
+      type: String,
+    },
+    diagramId:{
+      type: String,
+    }
+  },
+  watch:{
+    'id'(val,oldVal){
+      this.curCel = this.nodeOpt(this.id,this.globalGridAttr)
+    }
+  },
+  mounted() {
+    // this.curCel = this.nodeOpt(this.id,this.globalGridAttr)
+  },
+  methods:{
+    showDialog() {
+      let param = {projectId:this.projectId,diagramId:this.diagramId}
+      console.log(param, 'dialog init param')
+      this.dialogVisible = true;
+      this.$nextTick(()=>{
+        this.$refs.inspectionNode.init(param)
+      })
+    },
+    procResult(node) {
+      // console.log(node,'node')
+      this.text =node.nodeName
+      this.dateId = node.nodeId
+      this.globalGridAttr.dataId = this.dateId
+      this.globalGridAttr.inspectName = this.text
+      this.globalGridAttr.nodeText = this.text
+      this.data={
+        dataId:this.dateId,
+        inspectName:this.text
+      }
+      this.curCel.setData(this.data)
+      this.curCel.attr('text/text', this.text)
+      this.curCel.attr('data/dataId', this.dateId)
+      this.curCel.attr('data/inspectName', this.text)
+      this.curCel = this.nodeOpt(this.id,this.globalGridAttr)
+      this.dialogVisible = false
+      // console.log(node,'dialog绐楀彛杩斿洖鍊�')
+    },
+    // 鏀瑰彉杈规棰滆壊
+    onStrokeChange(e){
+      let val = e
+      this.globalGridAttr.nodeStroke = val
+     this.curCel.attr('body/stroke', val)
+    },
+    //鏀瑰彉杈规澶у皬
+    onStrokeWidthChange(e){
+      let val =e
+      this.globalGridAttr.nodeStrokeWidth = val
+      this.curCel.attr('body/strokeWidth', val)
+    },
+    //鏀瑰彉鏂囨湰棰滆壊
+    onFillChange(e){
+      let val = e
+      this.globalGridAttr.nodeFill=val
+      this.curCel.attr('body/fill', val)
+      // this.curCel.attr('title/fill', val)
+    },
+    // 鏀瑰彉瀛椾綋澶у皬
+    onFontSizeChange(e){
+      let val =e
+      this.globalGridAttr.nodeFontSize = val
+      this.curCel.attr('text/fontSize', val)
+      this.curCel.attr('title/fontSize', val)
+    },
+    // 鏀瑰彉瀛椾綋棰滆壊
+    onColorChange(e){
+      let val =e
+      this.globalGridAttr.nodeColor = val
+      this.curCel.attr('text/fill', val)
+      this.curCel.attr('title/fill', val)
+      this.curCel.attr('text/style/color', val)
+      this.curCel.attr('title/style/color', val)
+      this.curCel = this.nodeOpt(this.id,this.globalGridAttr)
+    },
+    // 鏀瑰彉鏂囨湰
+    onTextChange(e){
+      this.text =e
+      this.globalGridAttr.nodeText = this.text
+      this.curCel.attr('label/textWrap/text', this.text)
+      this.curCel = this.nodeOpt(this.id,this.globalGridAttr)
+
+    },
+    onDateChange(e){
+      this.date =e
+       this.globalGridAttr.nodeDate = this.date
+       this.data={
+        finishDate:this.date,
+      }
+      this.curCel.setData(this.data)
+      if(this.shape=='custom-circle1'){
+        this.curCel.attr('text/text', this.date)
+      }
+      this.curCel.attr('title/text', this.date)
+      this.curCel = this.nodeOpt(this.id,this.globalGridAttr)
+    },
+    nodeOpt(id, globalGridAttr){
+      this.curCel=null
+      if(id){
+        let cell =  this.graph.getCellById(id)
+        // console.log(cell,'let cell 123456')
+        if (!cell || !cell.isNode()) {
+          return
+        }
+        this.curCel = cell
+        globalGridAttr.nodeStroke = cell.attr('body/stroke')
+        globalGridAttr.nodeStrokeWidth = cell.attr('body/strokeWidth')
+        globalGridAttr.nodeFill = cell.attr('body/fill')
+        // globalGridAttr.nodeFontSize = cell.attr('text/fontSize')
+        // globalGridAttr.nodeFontSize = cell.attr('title/fontSize')
+        globalGridAttr.nodeFontSize = cell.attr('text/fontSize')?cell.attr('text/fontSize'):cell.attr('title/fontSize')
+        globalGridAttr.nodeColor = cell.attr('text/fill') ? cell.attr('text/fill'):cell.attr('title/fill')?cell.attr('title/fill'):cell.attr('label/text/fill')
+        // globalGridAttr.nodeColor = cell.attr('text/fill')
+        // globalGridAttr.nodeColor = cell.attr('title/fill')
+        // globalGridAttr.nodeColor = cell.attr('text/style/color')
+        // globalGridAttr.nodeColor =  cell.attr('title/style/color')
+        globalGridAttr.nodeUsers = cell.attr('approve/users')
+        globalGridAttr.nodeText = cell.attr('label/textWrap/text')
+        if(this.shape=='custom-circle1'){
+          globalGridAttr.nodeDate = cell.attr('text/text')
+        }
+        globalGridAttr.nodeDate = cell.attr('title/text')
+        globalGridAttr.dataId = cell.getData().dataId
+        globalGridAttr.inspectName =cell.getData().inspectName
+        // console.log(globalGridAttr.inspectName,globalGridAttr.dataId,globalGridAttr.nodeDate,'globalGridAttr.inspectName,globalGridAttr.dataId,globalGridAttr.nodeDate 789')
+        cell.getData()
+        // console.log( cell.getData(),' cell.getData() 909')
+      }
+      return this.curCel;
+    }
+  }
+}
+</script>
+
+<style >
+#tabPane .el-tabs__header.is-top .el-tabs__nav-scroll{
+width: 100% !important;
+}
+
+#tabPane .el-color-picker__trigger{
+  width: 100%;
+}
+</style>
diff --git a/web/src/views/modules/flowChart/ConfigNode/project-list-select.vue b/web/src/views/modules/flowChart/ConfigNode/project-list-select.vue
new file mode 100644
index 0000000..063761e
--- /dev/null
+++ b/web/src/views/modules/flowChart/ConfigNode/project-list-select.vue
@@ -0,0 +1,273 @@
+<template>
+  <div class="v-service-user">
+    <zt-table-wraper ref="tableObj" query-url="/maintain/projectNetworkDiagram/getInspectionPage" :lazy="true" :paging='true'
+                     delete-url="/project/inspection" v-slot="{ table }">
+      <el-form :inline="true" :model="dataForm" @keyup.enter.native="table.query()">
+        <el-form-item class="toolbar">
+          <el-form-item prop="projectId" style="margin-top: 2px;width: 150px;">
+            <zt-select v-model="dataForm.projectId" :datas="model" placeholder="宸ョ▼椤圭洰" clearable></zt-select>
+          </el-form-item>
+          <el-form-item style="margin-top: 2px;" v-show="selectProjectFlag">
+            <el-input v-model="dataForm.userKey" placeholder="鍏抽敭瀛�" style="width: 150px;" clearable></el-input>
+          </el-form-item>
+          <!--<el-form-item prop="projectMajor" style="margin-top: 2px;width: 150px;">-->
+          <!--<zt-dict v-model="dataForm.projectMajor" dict="project_major" placeholder="宸ョ▼涓撲笟" clearable></zt-dict>-->
+          <!--</el-form-item>-->
+          <el-form-item prop="reconditionMajor" style="margin-top: 2px;width: 120px;" v-show="selectProjectFlag">
+            <zt-dict v-model="dataForm.reconditionMajor" dict="recondition_major" placeholder="鐩戜慨涓撲笟"
+                     clearable></zt-dict>
+          </el-form-item>
+          <el-form-item style="width:130px;margin-top: 2px;" v-show="selectProjectFlag">
+            <zt-dict v-model="dataForm.projectType" dict="project_type" placeholder="椤圭洰绫诲瀷"
+                     @keyup.enter.native="table.query()" clearable></zt-dict>
+          </el-form-item>
+          <el-form-item style="width:120px;margin-top: 2px;" v-show="selectProjectFlag">
+            <el-select v-model="dataForm.planStatus" placeholder="椤圭洰鐘舵��" @change="table.query()" clearable>
+              <el-option label="鏈畬宸�" value="0"></el-option>
+              <el-option label="宸插畬宸�" value="1"></el-option>
+              <el-option label="宸插彇娑�" value="2"></el-option>
+            </el-select>
+          </el-form-item>
+          <el-form-item class="message-btn" style="margin-top: 2px;">
+            <el-button type="primary" size="medium" icon="el-icon-search" @click="table.query()">鎼滅储
+            </el-button>
+          </el-form-item>
+        </el-form-item>
+      </el-form>
+      <!--{{ table }}-->
+      <el-table id="table" ref="table" v-adaptive="{bottomOffset:120}" height="650px" v-loading="table.dataLoading"
+                :data="table.dataList" :default-expand-all="false" :paging="true" @current-change="showProjectList"
+                border  align-text="left"
+                @selection-change="table.selectionChangeHandle" row-key="id" width="100%" lazy :load="load"
+                class="repair_button"
+                @row-dblclick="rowDblclick"
+                :tree-props="{children: 'children', hasChildren: 'hasChildren'}">
+        <el-table-column type="selection" width="40" v-show="!isShow"/>
+        <el-table-column prop="projectListCode" label="缂栧彿" width="160" v-if="showColumn.projectListCode" sortable show-overflow-tooltip >
+        </el-table-column>
+        <el-table-column prop="projectListName" label="宸ョ▼鍚嶇О"  v-if="showColumn.projectListName" show-overflow-tooltip/>
+        <el-table-column prop="examineConcat" label="妫�楠屽唴瀹�"  v-if="showColumn.examineConcat" show-overflow-tooltip/>
+        <el-table-column prop="maintainUnitName" label="鎵夸慨鍗曚綅" v-if="showColumn.maintainUnit" show-overflow-tooltip/>
+      </el-table>
+    </zt-table-wraper>
+  </div>
+</template>
+
+<script>
+  export default {
+    props: {
+      noImportCodes: {
+        type: Object
+      },
+      isShow: {
+        type: Number
+      },
+      projectTypeName: {
+        type: String
+      }
+    },
+    data() {
+      return {
+        timeNodeArr: [{projectType: '', projectTypeName: '', timeNode: ''}],
+        timeNodesForm: {
+          timeNodes: ''
+        },
+        isShowColumn: '',
+        dialogFormVisible: false,
+        checkList: {},
+        showColumn: {
+          projectListCode: true,
+          projectListName: true,
+          examineConcat: true,
+          maintainUnit: true,
+          gmtFinish: true,
+          reconditionMajor: true,
+          isSpecial: true,
+          armyType: true,
+          isCheck: true,
+          files: true,
+          projectTypeName: true,
+          planStatus: true,
+          timeRemaining: true,
+          deadline: true,
+          cause: true,
+        },
+        fullHeight: (document.documentElement.clientHeight - 210) - 120,
+        word: {},
+        dataForm: {
+          projectId: '',
+          diagramId:'',
+          reconditionMajor: '',
+          projectTypeName: '',
+          productId: '', // 閫夋嫨鐨勪骇鍝佽妭鐐�
+          userKey: '', // 鐢ㄦ埛杈撳叆鍏抽敭瀛�
+          projectMajor: '', // 宸ョ▼涓撲笟
+          id: '',
+          projectName: '',
+          planStatus: '',
+          type: '',
+          projectNode: '',
+          floatTime: '',
+          typeStr: '',
+          maxDate: '',
+          minDate: '',
+          options: [],
+        },
+        constructionOrInspection: 1,
+        model: '',
+        timeNodeArr: [],
+        options: [{value: 0, label: '鍚�'}, {value: 1, label: '鏄�'}],
+        postList: [{id: '0', name: '鏈畬宸�'}, {id: '1', name: '宸插畬宸�'}, {id: '2', name: '宸插彇娑�'}],
+        equipments: {
+          equipments: []
+        },
+        parts: {
+          parts: []
+        },
+        stateFrom: {
+          id: '',
+          planStatus: ''
+        },
+        oldDataForm: {
+          productId: '',
+          projectId: '',
+          maintainLevel: ''
+        },
+        queryForm: {
+          productId: '',
+          projectId: '',
+          maintainLevel: ''
+        },
+        technologyData: {
+          equipmentData: [],
+          unitData: []
+        },
+        // postList: [{id: '3', name: '鏈鎵�'}, {id: '0', name: '宸查┏鍥�'}, {id: '1', name: '宸插悓鎰�'}],
+        twoPostList: [{id: '3', name: '鏈鎵�'}, {id: '0', name: '宸查┏鍥�'}, {id: '1', name: '宸插悓鎰�'}],
+        isStyle: "margin-top:-10px",
+        ids: [],
+        productId: '',
+        armyCheckNo: '',
+        selectProjectFlag: false,
+        timeNodes: false
+      }
+    },
+    components: {
+    },
+    computed: {
+    },
+    created() {
+    },
+    mounted() {
+      this.getInfo()
+    },
+    watch: {
+    },
+    methods: {
+      init(item) {
+        // this.$nextTick(()=>{
+        console.log(item, "dialog init param.....................")
+        this.dataForm.projectId = item.projectId
+        this.dataForm.diagramId = item.diagramId
+        this.selectProjectFlag = true
+        console.log(this.dataForm, ' init this.dataForm')
+        this.$refs.tableObj.query()
+        // })
+      },
+      rowDblclick(row) {
+        console.log(row.id,'鍙屽嚮琛岀殑id')
+        console.log(row.name,'鍙屽嚮琛岀殑鏁版嵁')
+        this.$emit('func',{nodeId:row.id,nodeName:row.projectListName})
+      },
+      async getInfo(){
+        if (this.$store.state.user.localShip) {
+          this.dataForm.productId = this.$store.state.user.localShip
+        }
+        let res = await this.$http.get(`/homeFunction/projectSelect?productId=${this.dataForm.productId}`)
+        this.model = res.data
+        if (this.model.length > 0 && !this.dataForm.projectId) {
+          this.dataForm.projectId = this.model[0].id
+        }
+      }
+    }
+  }
+</script>
+<style lang="less" >
+  #columnOption {
+    position: fixed;
+    z-index: 20;
+    top: 15%;
+    left: 80%;
+    width: 10%;
+    height: 60%;
+    background-color: rgba(0, 0, 0, 0.3);
+    display: flex;
+    flex-direction: row-reverse;
+    .content {
+      width: 100%;
+      height: 100%;
+      .head {
+        width: 100%;
+        height: 44px;
+        display: flex;
+        justify-content: center;
+        align-items: center;
+        font-size: 15px;
+      }
+      .body {
+        width: 88%;
+        height: calc(100% - 88px);
+        box-sizing: border-box;
+        margin-left:20px;
+        padding-top: 10px;
+        overflow-y: auto;
+        .items {
+          width: 100%;
+          height: 100%;
+          overflow-y: auto;
+          display: flex;
+          flex-direction: column;
+          .el-checkbox__label {
+            width: 100%;
+            height: 28px;
+            line-height: 28px;
+            margin-bottom: 14px;
+            display: inline-block;
+            font-style: normal;
+            font-weight: normal;
+            font-size: 14px;
+            overflow: hidden;
+            text-overflow: ellipsis;
+            white-space: nowrap;
+            box-sizing: border-box;
+            padding-left: 14px;
+          }
+          .el-checkbox:hover {
+            background-color: #f5f7fa;
+          }
+        }
+      }
+      #footer {
+        width: 100%;
+        height: 44px;
+        display: flex;
+        justify-content: center;
+        align-items: center;
+        size: 20px;
+      }
+    }
+  }
+  // 鎺у埗娣″叆娣″嚭鏁堟灉
+  .fade-enter-active,
+  .fade-leave-active {
+    transition: opacity 0.3s;
+  }
+  .fade-enter,
+  .fade-leave-to {
+    opacity: 0;
+  }
+  #columnOption .el-checkbox{
+    display: block;
+    margin-top:10px;
+  }
+</style>
diff --git a/web/src/views/modules/flowChart/ProcessTrajectory.vue b/web/src/views/modules/flowChart/ProcessTrajectory.vue
new file mode 100644
index 0000000..4fa2bfc
--- /dev/null
+++ b/web/src/views/modules/flowChart/ProcessTrajectory.vue
@@ -0,0 +1,42 @@
+<!--娴佺▼杞ㄨ抗-->
+<template>
+  <zt-dialog ref="dialog" :hasConfirm="false" title="娴佺▼鍔炵悊杞ㄨ抗" append-to-body
+             @close="close">
+    <el-table :data="tableData"  v-adaptive="{bottomOffset: 100}"
+              height="250"
+              v-loading="this.dataLoading">
+      <el-table-column align="center" label="姝ラ鍚�" prop="stepName"></el-table-column>
+      <el-table-column align="center" label="瑙掕壊鍚�" prop="receiveName"></el-table-column>
+      <el-table-column align="center" label="鎺ュ彈浠诲姟鏃堕棿" prop="receiveTime"></el-table-column>
+      <el-table-column align="center" label="瀹屾垚鏃堕棿" prop="finishTime"></el-table-column>
+    </el-table>
+  </zt-dialog>
+</template>
+
+<script>
+  export default {
+    name: 'ProcessTrajectory',
+    data(){
+      return{
+        tableData:[],
+        dataLoading:false,
+      }
+    },
+    methods:{
+     async init(params){
+       this.dataLoading = true
+        let res =await this.$http.get(`wf/getFlowTrack`,{params: params})
+       console.log(res.data,'processTra res.data')
+        if(res){
+          this.tableData = res.data
+          console.log(res.data,'getFlowTrack res.data')
+        }
+       this.dataLoading = false
+      }
+    }
+  }
+</script>
+
+<style scoped>
+
+</style>
diff --git a/web/src/views/modules/flowChart/flowChartEdge/index.vue b/web/src/views/modules/flowChart/flowChartEdge/index.vue
new file mode 100644
index 0000000..f80528c
--- /dev/null
+++ b/web/src/views/modules/flowChart/flowChartEdge/index.vue
@@ -0,0 +1,143 @@
+<template>
+  <div style="position: absolute;top:6%;right:0;background:#cccccc;width: 300px;" :style="'height:'+ left_p + 'px'">
+    <el-card style="height: 100%">
+      <el-tabs v-model="activeName" id="EdgeTabPane">
+        <el-tab-pane label="绾挎潯"  name="first">
+          <el-row :gutter="5" align="middle" style="margin-top:20px;">
+            <el-col :span=8 style="font-size: 16px;line-height: 38px">瀹藉害</el-col>
+            <el-col :span=16>
+              <el-slider :min=1 :max=20 :step=1 v-model="globalGridAttr.strokeWidth" @change="onStrokeWidthChange"></el-slider>
+            </el-col>
+          </el-row>
+          <el-row :gutter="5" align="middle" style="margin-top:20px;">
+            <el-col :span=8 style="font-size: 16px;line-height: 38px">棰滆壊</el-col>
+            <el-col :span=16>
+              <el-color-picker  v-model="globalGridAttr.stroke" style="width: 100%" @change="onStrokeChange"></el-color-picker>
+            </el-col>
+          </el-row>
+<!--          <el-row :gutter="5" align="middle" style="margin-top:20px;">-->
+<!--            <el-col :span=8 style="font-size: 16px;line-height: 32px">绫诲瀷</el-col>-->
+<!--            <el-col :span=16>-->
+<!--              <el-select style="width: 100%" v-model="globalGridAttr.connector" @change="onConnectorChange">-->
+<!--                <el-option-->
+<!--                  v-for="item in options"-->
+<!--                  :key="item.value"-->
+<!--                  :label="item.label"-->
+<!--                  :value="item.value">-->
+<!--                </el-option>-->
+<!--                &lt;!&ndash;              <el-option value="normal">榛樿</el-option>&ndash;&gt;-->
+<!--                &lt;!&ndash;              <el-option value="smooth">骞虫粦</el-option>&ndash;&gt;-->
+<!--                &lt;!&ndash;              <el-option value="rounded">鍦嗗舰</el-option>&ndash;&gt;-->
+<!--                &lt;!&ndash;              <el-option value="jumpover">鎶樼嚎</el-option>&ndash;&gt;-->
+<!--              </el-select>-->
+<!--            </el-col>-->
+<!--          </el-row>-->
+          <el-row :gutter="5" align="middle" style="margin-top:20px;">
+            <el-col :span=8 style="font-size: 16px;line-height: 32px">鏍囩</el-col>
+            <el-col :span=16>
+              <el-input v-model="globalGridAttr.label" style="width: 100%" @change="onLabelChange"/>
+            </el-col>
+          </el-row>
+        </el-tab-pane>
+      </el-tabs>
+    </el-card>
+  </div>
+</template>
+
+<script>
+import { Edge} from '@antv/x6';
+export default {
+  name: "index",
+  data(){
+    return{
+      left_p:document.documentElement.clientHeight*0.9,
+      activeName: 'first',
+      // globalGridAttr:{},
+      curCell:Edge,
+      options: [{
+        value: 'normal',
+        label: '榛樿'
+      }, {
+        value: 'smooth',
+        label: '骞虫粦杩炵嚎'
+      }]
+    }
+  },
+  props:{
+    id: {
+      type: String,
+    },
+    globalGridAttr:{
+      type: Object,
+    },
+    graph:{
+      type: String,
+    }
+  },
+  watch:{
+    'id'(val,oldVal){
+      const cell = this.graph.getCellById(this.id)
+      if(!cell || !cell.isEdge()){
+        return
+      }
+      this.curCell = cell
+      let connector = cell.getConnector() || {
+        name:'榛樿'
+      }
+      this.globalGridAttr.stroke = cell.attr('line/stroke')
+      this.globalGridAttr.strokeWidth = cell.attr('line/strokeWidth')
+      this.globalGridAttr.connector = connector.name
+      // console.log(cell.getLabels()[0],'cell.getLabels()[0]')
+      //  this.globalGridAttr.label = (cell.getLabels()[0].attrs).text.text||''
+    }
+  },
+  methods:{
+    onStrokeWidthChange(val) {
+
+      this.globalGridAttr.strokeWidth = val
+      this.curCell.attr('line/strokeWidth', val)
+    },
+
+    onStrokeChange(e) {
+      const val = e
+      this.globalGridAttr.stroke = val
+      this.curCell.attr('line/stroke', val)
+    },
+
+
+    onConnectorChange(val){
+      this.globalGridAttr.connector = val
+      this.curCell.setConnector(val)
+    },
+
+    onLabelChange(e) {
+      const val = e
+      this.globalGridAttr.label = val
+      this.curCell.setLabels([
+        {
+          attrs: {
+            text: {
+              text: val,
+            },
+          },
+          position: {
+            distance: 0.50,
+          },
+        }
+      ])
+    }
+  }
+}
+</script>
+
+<style >
+#EdgeTabPane .el-tabs__header.is-top .el-tabs__nav-scroll{
+  width: 100% !important;
+}
+#EdgeTabPane .el-tabs__nav.is-top{
+  -webkit-transform: translateX(35px) !important
+}
+#EdgeTabPane .el-color-picker__trigger{
+  width: 100%;
+}
+</style>
diff --git a/web/src/views/modules/flowChart/flowChartEdit.vue b/web/src/views/modules/flowChart/flowChartEdit.vue
new file mode 100644
index 0000000..82c17c2
--- /dev/null
+++ b/web/src/views/modules/flowChart/flowChartEdit.vue
@@ -0,0 +1,827 @@
+<template>
+  <div>
+    <el-row :gutter="[8,8]">
+      <el-col :span="3">
+        <div class="fa-card-a">
+          <div id="stencil2" :style="'height:'+ left_p + 'px'"></div>
+        </div>
+      </el-col>
+      <el-col :span="21">
+          <div class="fa-card-a">
+            <el-form :inline="true">
+              <el-form-item prop="flowId" style="margin-left:10px;width: 180px;">
+                <zt-select v-model="flowId" :datas="flowList" @change="flowChange" placeholder="宸ョ▼椤圭洰"
+                           clearable></zt-select>
+              </el-form-item>
+              <el-form-item>
+                <el-button type="primary" v-show="dataForm.id" @click="saveDiagram()">淇濆瓨</el-button>
+              </el-form-item>
+            </el-form>
+            <div id="flowChart">
+            </div>
+            <flowChartNode v-show="type === 'node'" :flowId="flowId" :id="id" :globalGridAttr="globalGridAttr"
+                           :graph="graph"/>
+            <flowChart-edge v-show="type === 'edge'" :flowId="flowId" :id="id" :globalGridAttr="globalGridAttr"
+                            :graph="graph"/>
+          </div>
+      </el-col>
+    </el-row>
+  </div>
+</template>
+
+<script>
+import {Graph, Shape, Addon, Cell} from '@antv/x6';
+import ConfigNode from './ConfigNode/index.vue'
+import flowChartNode from './flowChartNode/index.vue'
+import flowChartEdge from './flowChartEdge/index.vue'
+
+export default {
+  name: "flowChart-edit",
+  components: {
+    flowChartNode,
+    ConfigNode,
+    flowChartEdge
+  },
+  data() {
+    return {
+      shape: '',
+      diagramList:[],
+      diagramName:'',
+      diagramId:'',
+      flowList: '',
+      flowId: '',
+      diagramJson: '',
+      dataForm: { // 娴佺▼鍥惧唴瀹�
+        id: null,
+        diagram: null
+      },
+      type: '',
+      id: '',
+      graph: null,
+      emptyJson: {
+        // 鑺傜偣
+        nodes: [
+          {
+            id: 'node1', // String锛屽彲閫夛紝鑺傜偣鐨勫敮涓�鏍囪瘑
+            width: 500,   // Number锛屽彲閫夛紝鑺傜偣澶у皬鐨� width 鍊�
+            height: 300,  // Number锛屽彲閫夛紝鑺傜偣澶у皬鐨� height 鍊�
+            label: '璇ユ祦绋嬪浘杩樻病鏈夐厤缃�',
+            attrs: {
+              body: {
+                strokeWidth: 0
+              },
+            }
+            //   text: {
+            //     text: '璇ラ」鐩繕鏈紪鍒剁綉缁滃浘',
+            //     // fontSize: 56,
+            //     fill: 'rgba(0,0,0,0.7)'
+            //   },
+            // },
+          }
+        ],
+      },
+      globalGridAttr: {
+        type: 'mesh',
+        size: 10,
+        color: '#e5e5e5',
+        thickness: 1,
+        colorSecond: '#d0d0d0',
+        thicknessSecond: 1,
+        factor: 4,
+        bgColor: '#e5e5e5',
+        showImage: true,
+        repeat: 'watermark',
+        angle: 30,
+        position: 'center',
+        bgSize: JSON.stringify({width: 150, height: 150}),
+        opacity: 0.1,
+
+        stroke: '#5F95FF',
+        strokeWidth: 1,
+        connector: 'normal',
+        label: '',
+
+        nodeStroke: '#5F95FF',
+        nodeStrokeWidth: 1,
+        nodeFill: '#ffffff',
+        nodeFontSize: 12,
+        nodeColor: '#080808',
+        nodeText: '',
+        nodeDate: '',
+        nodeUsers: '',
+        nodeDataDate: '',
+        nodeDataText: ''
+      },
+      isReady: false,
+      curCel: Cell,
+      left_p: document.documentElement.clientHeight -220,
+      ports: {
+        groups: {
+          top: {
+            position: 'top',
+            attrs: {
+              circle: {
+                r: 8,
+                magnet: true,
+                stroke: '#5F95FF',
+                strokeWidth: 1,
+                fill: '#fff',
+                style: {
+                  visibility: 'hidden',
+                },
+              },
+            },
+          },
+          right: {
+            position: 'right',
+            attrs: {
+              circle: {
+                r: 8,
+                magnet: true,
+                stroke: '#5F95FF',
+                strokeWidth: 1,
+                fill: '#fff',
+                style: {
+                  visibility: 'hidden',
+                },
+              },
+            },
+          },
+          bottom: {
+            position: 'bottom',
+            attrs: {
+              circle: {
+                r: 8,
+                magnet: true,
+                stroke: '#5F95FF',
+                strokeWidth: 1,
+                fill: '#fff',
+                style: {
+                  visibility: 'hidden',
+                },
+              },
+            },
+          },
+          left: {
+            position: 'left',
+            attrs: {
+              circle: {
+                r: 8,
+                magnet: true,
+                stroke: '#5F95FF',
+                strokeWidth: 1,
+                fill: '#fff',
+                style: {
+                  visibility: 'hidden',
+                },
+              },
+            },
+          },
+        },
+        items: [
+          {
+            group: 'top',
+          },
+          {
+            group: 'right',
+          },
+          {
+            group: 'bottom',
+          },
+          {
+            group: 'left',
+          },
+        ],
+      }
+    }
+  },
+  watch: {
+  },
+  methods: {
+    async getFlowList() {
+      let res = await this.$http.get(`/WfDef/getFlowList`)
+      this.flowList = res.data
+      console.log(this.flowList,'this.flowList')
+      for (let i = 0; i < this.flowList.length; i++) {
+        if (this.flowList[i] && this.flowList[i].id) {
+          this.flowId = this.flowList[i].id
+          console.log(this.flowId, 'this.flowId 6789')
+          break
+        }
+      }
+      this.flowChange(this.flowId)
+    },
+    flowChange() {
+      this.dataForm.id = this.flowId
+      // this.flowId = this.dataForm.id
+      console.log(this.flowId,'this.flowId')
+      this.getDiagram()
+    },
+    async getDiagram() {
+      let res = await this.$http.get(`/WfDef/${this.flowId}`)
+      if (res.data !== null) {
+        this.dataForm = res.data
+        if (res.data.diagram != null && res.data.diagram != '')
+          this.diagramJson = JSON.parse(this.dataForm.diagram)
+        else
+          this.diagramJson = this.emptyJson
+        console.log(this.diagramJson, 'this.Diagram json')
+        this.graph.fromJSON(this.diagramJson)
+        this.graph.centerContent()
+        this.graph.zoomToFit()
+        // this.graph.freeze('flowChart')
+      } else {
+        this.dataForm.id = null
+/*        this.graph.fromJSON(this.emptyJson)
+        this.graph.centerContent()
+        this.graph.zoomToFit()
+        this.graph.freeze()*/
+      }
+    },
+    init1() {
+      // console.log(document.documentElement.clientWidth, 'document.documentElement.clientWidth')
+      // console.log(document.documentElement.clientHeight, 'document.documentElement.clientHeight')
+      this.graph = new Graph({
+        container: document.getElementById('flowChart'),
+        width: document.documentElement.clientWidth,
+        height: document.documentElement.clientHeight - 240,
+        // async: true,
+        grid: {
+          visible: true,
+        },
+        onToolItemCreated({ tool }) {
+          const handle = tool
+          const options = handle.options
+          if (options && options.index % 2 === 1) {
+            tool.setAttrs({ fill: 'red' })
+          }
+        },
+        autoResize: true,
+        history: true,
+        panning: {
+          enabled: false,
+        },
+        scroller: {
+          enabled: true,
+          pageVisible: true,
+          pageBreak: true,
+          pannable: true,
+        },
+        mousewheel: {
+          enabled: true,
+          zoomAtMousePosition: true,
+          modifiers: 'ctrl',
+          minScale: 0.5,
+          maxScale: 2,
+        },
+        connecting: {
+          router: { name: 'manhattan' },
+          connector: { name: 'rounded' },
+          // anchor: 'center',
+          connectionPoint: 'anchor',
+          allowBlank: false,
+          createEdge() {
+            return new Shape.Edge({
+              attrs: {
+                line: {
+                  stroke: '#A2B1C3',
+                  strokeWidth: 2,
+                  targetMarker: 'classic'
+                }
+              },
+              tools: {
+                name: 'segments',
+                args: {
+                  snapRadius: 20,
+                  attrs: {
+                    fill: '#444',
+                  },
+                },
+              },
+              zIndex: 0,
+            })
+          },
+          validateConnection({targetMagnet}) {
+            return !!targetMagnet
+          },
+        },
+        highlighting: {
+          magnetAdsorbed: {
+            name: 'stroke',
+            args: {
+              attrs: {
+                fill: '#5F95FF',
+                stroke: '#5F95FF',
+              },
+            },
+          },
+        },
+        resizing: {
+          enabled:true,
+          restricted:true
+        },
+        rotating: true,
+        selecting: {
+          enabled: true,
+          rubberband: true,
+          rubberEdge: true,
+          showNodeSelectionBox: true,
+        },
+        snapline: true,
+        keyboard: true,
+        clipboard: true,
+      })
+      // graph.fromJSON(
+      //   {nodes:nodes,
+      //     edges:edges}
+      // )
+      this.graph.centerContent()
+      const stencil = new Addon.Stencil({
+        title: '',
+        target: this.graph,
+        stencilGraphWidth: 200,
+        stencilGraphHeight: 480,
+        // collapsable: true,
+        groups: [
+          {
+            title: '鍥惧厓',
+            name: 'group1',
+          }
+        ],
+        layoutOptions: {
+          columns: 1,
+          columnWidth: 120,
+          // rowHeight: 75,
+        },
+      })
+      document.getElementById('stencil2').appendChild(stencil.container)
+
+      Graph.registerNode(
+        'custom-polygon',
+        {
+          inherit: 'polygon',
+          width: 86,
+          height: 56,
+          attrs: {
+            body: {
+              strokeWidth: 1,
+              stroke: '#5F95FF',
+              fill: '#EFF4FF',
+            },
+            // title:{
+            //   text:'',
+            //   refX: 40,
+            //   refY: 38,
+            //   fontSize: 14,
+            //   fill: '#262626',
+            //   'text-anchor': 'start',
+            // },
+            text: {
+              // refX: 40,
+              // refY: 14,
+              fontSize: 14,
+              fill: '#262626',
+              // 'text-anchor': 'start',
+            },
+          },
+          // markup: [
+          //   {
+          //     tagName: 'polygon',
+          //     selector: 'body',
+          //   },
+          //   {
+          //     tagName: 'text',
+          //     selector: 'title',
+          //   },
+          //   {
+          //     tagName: 'text',
+          //     selector: 'text',
+          //   },
+          // ],
+          ports: {
+            ...this.ports
+            // items: [
+            //   {
+            //     group: 'top',
+            //   },
+            //   {
+            //     group: 'bottom',
+            //   },
+            // ],
+          },
+        },
+        true,
+      )
+
+      Graph.registerNode(
+        'custom-circle',
+        {
+          inherit: 'ellipse',
+          width: 86,
+          height: 56,
+          data: {
+            dataId: '',
+            finishDate: ''
+          },
+          attrs: {
+            body: {
+              strokeWidth: 1,
+              stroke: '#5F95FF',
+              fill: '#EFF4FF',
+            },
+            title: {
+              text: '',
+              fontSize: 14,
+              fill: '#262626',
+              refX: 0.5,
+              refY: '100%',
+              refY2: 4,
+              textAnchor: 'middle',
+              textVerticalAnchor: 'top',
+            },
+            text: {
+              fontSize: 14,
+              fill: '#262626',
+              refX: 0.5,
+              refY: 0.5,
+              textAnchor: 'middle',
+              textVerticalAnchor: 'middle',
+            },
+          },
+          markup: [
+            {
+              tagName: 'ellipse',
+              selector: 'body',
+            },
+            {
+              tagName: 'text',
+              selector: 'title',
+            },
+            {
+              tagName: 'text',
+              selector: 'text',
+            },
+          ],
+          ports: {...this.ports},
+        },
+        true,
+      )
+      const r6 = this.graph.createNode({
+        shape: 'text-block',
+        label: '鍙�夎繃绋�',
+        width: 86,
+        height: 56,
+        data: {
+          stepMarker:''
+        },
+        attrs: {
+          body: {
+            strokeWidth: 1,
+            stroke: '#5F95FF',
+            fill: '#EFF4FF',
+            rx: 6,
+            ry: 6
+          },
+          text: {
+            text: '鍙�夎繃绋�',
+            fontSize: 14,
+            fill: '#262626',
+            refX: '0',
+            refY: -0.5,
+            refY2: '0',
+            textAnchor: 'middle',
+            textVerticalAnchor: 'middle',
+          },
+        },
+        markup: [
+          {
+            tagName: 'rect',
+            selector: 'body',
+          },
+          {
+            tagName: 'text',
+            selector: 'text',
+          },
+        ],
+        ports: {...this.ports},
+      })
+      const r4 = this.graph.createNode({
+        shape: 'custom-polygon',
+        data: {
+          stepMarker:''
+        },
+        attrs: {
+          body: {
+            refPoints: '0,10 10,0 20,10 10,20',
+          },
+        },
+        label: '鍐崇瓥',
+      })
+      const r5 = this.graph.createNode({
+        shape: 'custom-circle',
+        data: {
+          stepMarker:''
+        },
+        label: '闃舵',
+      })
+      stencil.load([r4, r5,r6], 'group1')
+
+      this.graph.bindKey(['meta+c', 'ctrl+c'], () => {
+        const cells = this.graph.getSelectedCells()
+        if (cells.length) {
+          this.graph.copy(cells)
+        }
+        return false
+      })
+
+      this.graph.bindKey(['meta+x', 'ctrl+x'], () => {
+        const cells = this.graph.getSelectedCells()
+        if (cells.length) {
+          this.graph.cut(cells)
+        }
+        return false
+      })
+
+      this.graph.bindKey(['meta+v', 'ctrl+v'], () => {
+        if (!this.graph.isClipboardEmpty()) {
+          const cells = this.graph.paste({offset: 32})
+          this.graph.cleanSelection()
+          this.graph.select(cells)
+        }
+        return false
+      })
+//undo redo
+      this.graph.bindKey(['meta+z', 'ctrl+z'], () => {
+        if (this.graph.history.canUndo()) {
+          this.graph.history.undo()
+        }
+        return false
+      })
+
+      this.graph.bindKey(['meta+shift+z', 'ctrl+shift+z'], () => {
+        if (this.graph.history.canRedo()) {
+          this.graph.history.redo()
+        }
+        return false
+      })
+
+// select all
+      this.graph.bindKey(['meta+a', 'ctrl+a'], () => {
+        const nodes = this.graph.getNodes()
+        if (nodes) {
+          this.graph.select(nodes)
+        }
+      })
+//delete
+      this.graph.bindKey('delete', () => {
+        const cells = this.graph.getSelectedCells()
+        if (cells.length) {
+          this.graph.removeCells(cells)
+        }
+      })
+// zoom
+      this.graph.bindKey(['ctrl+1', 'meta+1'], () => {
+        const zoom = this.graph.zoom()
+        if (zoom < 1.5) {
+          this.graph.zoom(0.1)
+        }
+      })
+
+      this.graph.bindKey(['ctrl+2', 'meta+2'], () => {
+        const zoom = this.graph.zoom()
+        if (zoom > 0.5) {
+          this.graph.zoom(-0.1)
+        }
+      })
+
+      this.graph.on('blank:click', ({cell}) => {
+        this.reset()
+        this.type = 'grid'
+        // this.id = cell.id
+      })
+
+      this.graph.on('cell:click', ({cell}) => {
+        // this.type.value = cell.isNode() ? "node" : "edge"
+        this.type = cell.isNode() ? "node" : "edge"
+        this.shape = cell.shape
+        this.id = cell.id
+        // this.nodeOpt(this.id, this.globalGridAttr)
+      })
+      //鍗曞嚮杈硅妭鐐�
+      this.graph.on('edge:click', ({edge}) => {
+        this.reset()
+        edge.attr('line/stroke', 'orange')
+        edge.prop('labels/0', {
+          attrs: {
+            body: {
+              stroke: 'orange',
+            },
+          },
+        })
+      })
+      // 鍗曞嚮node鑺傜偣
+      this.graph.on('node:click', ({node}) => {
+        this.reset()
+        node.attr('line/stroke', 'orange')
+        node.prop('labels/0', {
+          attrs: {
+            body: {
+              stroke: 'orange',
+            },
+          },
+        })
+      })
+      // 鎺у埗杩炴帴妗╂樉绀�/闅愯棌
+      this.graph.on('node:delete', ({view, e}) => {
+        e.stopPropagation()
+        view.cell.remove()
+      })
+
+      this.graph.on('node:customevent', ({name, view, e}) => {
+        if (name === 'node:delete') {
+          e.stopPropagation()
+          view.cell.remove()
+        }
+      })
+      // 鍙屽嚮缂栬緫
+      this.graph.on('cell:dblclick', ({cell, e}) => {
+        const isNode = cell.isNode()
+        const name = cell.isNode() ? 'node-editor' : 'edge-editor'
+        cell.removeTool(name)
+        cell.addTools({
+          name,
+          args: {
+            event: e,
+            attrs: {
+              backgroundColor: isNode ? '#EFF4FF' : '#FFF',
+              text: {
+                fontSize: 16,
+                fill: '#262626',
+              },
+            },
+          },
+        })
+      })
+
+      this.graph.on('node:mouseenter', ({node}) => {
+        const flowChart = document.getElementById('flowChart')
+        const ports = flowChart.querySelectorAll(
+          '.x6-port-body',
+        )
+        this.showPorts(ports, true)
+      })
+
+      this.graph.on('node:mouseleave', ({node}) => {
+        // if (node.hasTool('button-remove')) {
+        //   node.removeTool('button-remove')
+        // }
+        const flowChart = document.getElementById('flowChart')
+        const ports = flowChart.querySelectorAll(
+          '.x6-port-body',
+        )
+        this.showPorts(ports, false)
+      })
+
+      this.graph.on('edge:mouseenter', ({cell}) => {
+        cell.addTools([
+          {
+            name: 'source-arrowhead',
+          },
+          {
+            name: 'target-arrowhead',
+            args: {
+              attrs: {
+                fill: 'red',
+              },
+            },
+          },
+        ])
+        cell.addTools(
+          [
+            {
+              name: 'segments',
+              args: {snapRadius: 20, attrs: {fill: '#444'}}
+            }
+          ]
+        )
+      })
+
+      this.graph.on('edge:mouseleave', ({cell}) => {
+        cell.removeTools()
+      })
+    },
+    reset() {
+      this.graph.drawBackground({color: '#fff'})
+      const nodes = this.graph.getNodes()
+      const edges = this.graph.getEdges()
+      nodes.forEach((node) => {
+        node.attr('body/stroke', '#5F95FF')
+      })
+      edges.forEach((edge) => {
+        edge.attr('line/stroke', '#5F95FF')
+        edge.prop('labels/0', {
+          attrs: {
+            body: {
+              stroke: '#5F95FF',
+            },
+          },
+        })
+      })
+    },
+    showPorts(ports, show) {
+      for (let i = 0, len = ports.length; i < len; i = i + 1) {
+        ports[i].style.visibility = show ? "visible" : "hidden"
+      }
+    },
+    nodeOpt(id, globalGridAttr) {
+      this.curCel = null
+      if (id) {
+        let cell = this.graph.getCellById(id)
+        // console.log(cell, 'let cell 123456')
+        if (!cell || !cell.isNode()) {
+          return
+        }
+        this.curCel = cell
+        globalGridAttr.nodeStroke = cell.attr('body/stroke')
+        globalGridAttr.nodeStrokeWidth = cell.attr('body/strokeWidth')
+        globalGridAttr.nodeFill = cell.attr('body/fill')
+        globalGridAttr.nodeFontSize = cell.attr('text/fontSize')
+        globalGridAttr.nodeFontSize = cell.attr('title/fontSize')
+        globalGridAttr.nodeColor = cell.attr('text/fill')
+        globalGridAttr.nodeColor = cell.attr('title/fill')
+        // globalGridAttr.nodeColor = cell.attr('label/text/fill')
+        // globalGridAttr.nodeColor = cell.attr('label/title/fill')
+        globalGridAttr.nodeUsers = cell.attr('approve/users')
+        globalGridAttr.nodeText = cell.attr('text/text')
+        globalGridAttr.nodeDate = cell.attr('title/text')
+        // let data={
+        //   dataId:this.flowId,
+        //   finishDate: globalGridAttr.nodeDate,
+        // }
+        // cell.setData(data)
+        // console.log( cell.getData(),' cell.getData() 909')
+      }
+      return this.curCel;
+    },
+    async saveDiagram() {
+      console.log(JSON.stringify(this.graph.toJSON()), 'graph.toJSON()')
+      this.dataForm.diagram = JSON.stringify(this.graph.toJSON())
+      console.log(this.dataForm, 'dataFrom')
+      await this.$http[this.dataForm.id === null ? 'post' : 'put'](`/WfDef`, this.dataForm).then(async res => {
+        if (res.msg === 'success') {
+          this.$alert('淇濆瓨鎴愬姛', '鎻愮ず', {
+            confirmButtonText: '纭畾'
+          })
+        }
+      })
+    }
+  },
+  mounted() {
+    this.getFlowList()
+    this.init1()
+    // this.nodeOpt(this.id, this.globalGridAttr)
+    // let data={
+    //     dataId: this.flowId,
+    //     finishDate: this.date
+    // }
+    // this.curCel.setData(data)
+    // if(this.dataForm) {
+    //   this.graph.fromJSON(this.diagramJson)
+    // }
+    this.type = 'grid'
+  }
+}
+</script>
+
+<style>
+#flowChart {
+  display: flex;
+  border: 1px solid #dfe3e8;
+  width: 100% !important;
+}
+
+.x6-graph-scroller.x6-graph-scroller-pannable {
+  width: 100% !important;
+}
+
+#stencil2 {
+  width: 100%;
+  height: 100%;
+  position: relative;
+  border-right: 1px solid #dfe3e8;
+}
+
+.x6-widget-stencil {
+  position: relative;
+  height: 100%;
+}
+
+.x6-widget-stencil-content {
+  position: relative;
+  height: 100%;
+}
+.x6-graph-scroller.x6-graph-scroller-paged.x6-graph-scroller-pannable{
+  box-shadow:1px 1px 3px #606266;
+  border-radius: 10px;
+}
+</style>
diff --git a/web/src/views/modules/flowChart/flowChartNode/index.vue b/web/src/views/modules/flowChart/flowChartNode/index.vue
new file mode 100644
index 0000000..23af11b
--- /dev/null
+++ b/web/src/views/modules/flowChart/flowChartNode/index.vue
@@ -0,0 +1,235 @@
+<template>
+  <div style="position: absolute;top:6%;right:0;z-index:1000;background:#cccccc;width: 300px;" :style="'height:'+ left_p + 'px'">
+    <el-card style="height: 100%">
+      <el-tabs v-model="activeName" id="tabPane">
+        <el-tab-pane label="鏂囨湰"  name="first">
+          <el-row :gutter="5" align="middle" style="margin-top:20px">
+            <el-col :span=8 style="font-size: 16px;line-height: 38px">鏂囨湰澶у皬</el-col>
+            <el-col :span=16>
+              <el-slider :min=8 :max=20 :step=1 v-model="globalGridAttr.nodeFontSize" @change="onFontSizeChange"></el-slider>
+            </el-col>
+          </el-row>
+          <el-row :gutter="5" align="middle" style="margin-top:20px">
+            <el-col :span=8 style="font-size: 16px;line-height: 40px">瀛椾綋棰滆壊</el-col>
+            <el-col :span=16>
+              <el-color-picker  v-model="globalGridAttr.nodeColor" style="width: 100%" @change="onColorChange"></el-color-picker>
+            </el-col>
+          </el-row>
+          <el-row :gutter="5" align="middle" style="margin-top:20px">
+            <el-col :span=8 style="font-size: 16px;line-height: 32px">鏂囨湰鍐呭</el-col>
+            <el-col :span=16 >
+<!--              <el-input v-model="globalGridAttr.nodeText" style="width: 100%" @change="onTextChange"></el-input>-->
+              <el-select style="width: 100%" :value-key="key" v-model="globalGridAttr.nodeText" @change="onTextChange($event)">
+                <el-option v-for="item in FlowStepList"
+                           :key="item.stepMarker"
+                           :label="item.stepTitle"
+                           :value="item.stepMarker">
+                </el-option>
+              </el-select>
+            </el-col>
+          </el-row>
+        </el-tab-pane>
+        <el-tab-pane label="鑺傜偣"  name="second">
+          <el-row align="middle" style="margin-top:20px">
+            <el-col :span=8 style="font-size: 16px;line-height: 40px">杈规棰滆壊</el-col>
+            <el-col :span=16>
+              <el-color-picker v-model="globalGridAttr.nodeStroke" style="width: 100%" @change="onStrokeChange"></el-color-picker>
+            </el-col>
+          </el-row>
+          <el-row align="middle"style="margin-top:20px">
+            <el-col :span=8 style="font-size: 16px;line-height: 38px">杈规瀹藉害</el-col>
+            <el-col :span=16>
+              <el-slider :min=1 :max=20 :step=1 v-model="globalGridAttr.nodeStrokeWidth" @change="onStrokeWidthChange"></el-slider>
+            </el-col>
+          </el-row>
+          <el-row align="middle" style="margin-top:20px">
+            <el-col :span=8 style="font-size: 16px;line-height: 40px">棰滆壊</el-col>
+            <el-col :span=16>
+              <el-color-picker  v-model="globalGridAttr.nodeFill" style="width: 100%" @change="onFillChange"></el-color-picker>
+            </el-col>
+          </el-row>
+        </el-tab-pane>
+      </el-tabs>
+    </el-card>
+  </div>
+</template>
+
+<script>
+import { Graph, Shape, Node, Addon, Cell,FunctionExt} from '@antv/x6';
+// const {inject} = require("vue");
+export default {
+  name: "index",
+  data(){
+    return{
+      data:'',
+      FlowStepList:[],
+      date:'',
+      text:'',
+      content:'',
+      activeName: 'first',
+      // globalGridAttr:{},
+      curCel:Cell,
+      left_p:document.documentElement.clientHeight*0.9,
+    }
+  },
+  props:{
+    id: {
+      type: String,
+    },
+    shape:{
+      type: String
+    },
+    globalGridAttr:{
+      type: Object,
+    },
+    graph:{
+      type: String,
+    },
+    flowId:{
+      type: String,
+    }
+  },
+  watch:{
+    'id'(val,oldVal){
+      this.getFlowStepList()
+      this.curCel = this.nodeOpt(this.id,this.globalGridAttr)
+    },
+    'flowId'(val,oldVal){
+      this.FlowStepList = []
+      this.getFlowStepList()
+      this.curCel = this.nodeOpt(this.id,this.globalGridAttr)
+      // this.curCel = this.nodeOpt(this.id,this.globalGridAttr)
+    }
+  },
+  mounted() {
+    this.getFlowStepList()
+    // this.curCel = this.nodeOpt(this.id,this.globalGridAttr)
+  },
+  methods:{
+   async getFlowStepList(){
+      let res= await this.$http.get(`/WfDef/getFlowStepList?flowId=${this.flowId}`)
+      if(res.data){
+        this.FlowStepList =res.data
+      }
+      console.log(this.FlowStepList,'this.FlowStepList')
+    },
+    // 鏀瑰彉杈规棰滆壊
+    onStrokeChange(e){
+      // this.curCel = Cell
+      let val = e
+      this.globalGridAttr.nodeStroke = val
+      this.curCel.attr('body/stroke', val)
+    },
+    //鏀瑰彉杈规澶у皬
+    onStrokeWidthChange(e){
+      let val =e
+      this.globalGridAttr.nodeStrokeWidth = val
+      this.curCel.attr('body/strokeWidth', val)
+    },
+    //鏀瑰彉鑳屾櫙棰滆壊
+    onFillChange(e){
+      let val = e
+      this.globalGridAttr.nodeFill=val
+      this.curCel.attr('body/fill', val)
+    },
+    // 鏀瑰彉瀛椾綋澶у皬
+    onFontSizeChange(e){
+      let val =e
+      this.globalGridAttr.nodeFontSize = val
+      this.curCel.attr('text/fontSize', val)
+      this.curCel.attr('title/fontSize', val)
+    },
+    // 鏀瑰彉瀛椾綋棰滆壊
+    onColorChange(e){
+      let val =e
+      this.globalGridAttr.nodeColor = val
+      this.curCel.attr('text/fill', val)
+      this.curCel.attr('title/fill', val)
+      this.curCel = this.nodeOpt(this.id,this.globalGridAttr)
+    },
+    // 鏀瑰彉鏂囨湰
+    onTextChange(e){
+     let selectItemObj= this.FlowStepList.find((item)=>{
+        return item.stepMarker===e
+      })
+
+      this.curCel.setData({
+        stepMarker:e
+      })
+      this.curCel.attr('text/text', selectItemObj.name)
+      this.globalGridAttr.nodeText = e
+      this.curCel = this.nodeOpt(this.id, this.globalGridAttr)
+
+/*      this.text =e
+      if(this.text.indexOf("锛�")!==-1){
+        let arr = this.text.split("锛�")
+        let title = arr[1]
+        this.data={
+          stepMarker:obj.stepMarker
+        }
+        this.curCel.setData(this.data)
+        this.curCel.attr('text/text',title)
+        this.globalGridAttr.nodeText = obj.stepMarker //this.text
+        this.curCel = this.nodeOpt(this.id,this.globalGridAttr)
+      }else {
+        let title = this.text
+        this.data={
+          stepMarker:obj.stepMarker
+        }
+        this.curCel.setData(this.data)
+        this.curCel.attr('text/text',title)
+        this.globalGridAttr.nodeText = obj.stepMarker //this.text
+        this.curCel = this.nodeOpt(this.id,this.globalGridAttr)
+      }*/
+    },
+    onDateChange(e){
+      this.date =e
+      this.globalGridAttr.nodeDate = this.date
+      this.curCel.attr('title/text', this.date)
+      this.curCel = this.nodeOpt(this.id,this.globalGridAttr)
+    },
+    nodeOpt(id, globalGridAttr){
+      this.curCel=null
+      if(id){
+        let cell =  this.graph.getCellById(id)
+        console.log(cell,'let cell 123456')
+        if (!cell || !cell.isNode()) {
+          return
+        }
+        this.curCel = cell
+        console.log(this.curCel.getData(),'this.curCel.getData()')
+
+        globalGridAttr.nodeStroke = cell.attr('body/stroke')
+        globalGridAttr.nodeStrokeWidth = cell.attr('body/strokeWidth')
+        globalGridAttr.nodeFill = cell.attr('body/fill')
+        globalGridAttr.nodeFontSize = cell.attr('text/fontSize')?cell.attr('text/fontSize'):cell.attr('title/fontSize')
+        //globalGridAttr.nodeFontSize = cell.attr('title/fontSize')
+        globalGridAttr.nodeColor = cell.attr('text/fill') ? cell.attr('text/fill'):cell.attr('title/fill')?cell.attr('title/fill'):cell.attr('label/text/fill')
+        // globalGridAttr.nodeColor = cell.attr('title/fill')
+        // globalGridAttr.nodeColor = cell.attr('label/text/fill')
+        // globalGridAttr.nodeColor = cell.attr('label/title/fill')
+        // globalGridAttr.nodeColor = cell.attr('label/style/fill')
+
+        //globalGridAttr.nodeUsers = cell.attr('approve/users')
+        //globalGridAttr.nodeDate = cell.attr('title/text')
+
+        globalGridAttr.nodeText = this.curCel.getData().stepMarker
+        console.log(globalGridAttr.nodeText,'globalGridAttr.nodeText globalGridAttr.nodeText')
+        cell.getData()
+        console.log( cell.getData(),' cell.getData() 909')
+      }
+      return this.curCel;
+    }
+  }
+}
+</script>
+
+<style >
+#tabPane .el-tabs__header.is-top .el-tabs__nav-scroll{
+  width: 100% !important;
+}
+
+#tabPane .el-color-picker__trigger{
+  width: 100%;
+}
+</style>
diff --git a/web/src/views/modules/flowChart/flowChartView.vue b/web/src/views/modules/flowChart/flowChartView.vue
new file mode 100644
index 0000000..5a1aa6d
--- /dev/null
+++ b/web/src/views/modules/flowChart/flowChartView.vue
@@ -0,0 +1,474 @@
+<template>
+  <div>
+    <el-form :inline="true" style="padding: 0">
+      <zt-form-item style="float: left;margin-bottom: 0">
+        <zt-button style="background:#EAEBEE;border: 1px solid #EAEBEE;color:#000">鏈畬鎴�</zt-button>
+        <zt-button style="background:#F1F0A3;border: 1px solid #F1F0A3;color:#000">杩涜涓�</zt-button>
+        <zt-button style="background:#5FF13A;border: 1px solid #5FF13A;color:#000">宸插畬鎴�</zt-button>
+      </zt-form-item>
+    </el-form>
+        <div id="flowChartView" style="border: 1px solid #EAEBEE;border-radius: 6px;
+        box-shadow: 0 2px 12px 0 rgb(0 0 0 / 10%);overflow-x: hidden">
+        </div>
+<!--    <el-tooltip id="toolTip" class="box-item" effect="dark" content="1234" placement="top">-->
+<!--      <div></div>-->
+<!--    </el-tooltip>-->
+  </div>
+</template>
+
+<script>
+import {Graph, Shape, Addon, Cell,ToolsView,NodeView} from '@antv/x6';
+export default {
+  name: "flowChart-view",
+  components: {
+  },
+  props:{
+    flowChartHeight:''
+  },
+  data() {
+    return {
+      prop:{
+        content:'',
+        visible:false,
+      },
+      knob:HTMLDivElement,
+      flowCode:'',
+      diagramList:[],
+      diagramName:'',
+      diagramId:'',
+      flowList: '',
+      flowId: '',
+      diagramJson: '',
+      dataForm: { // 娴佺▼鍥惧唴瀹�
+        id: null,
+        diagram: null
+      },
+      emptyJson: {
+        // 鑺傜偣
+        nodes: [
+          {
+            id: 'node1', // String锛屽彲閫夛紝鑺傜偣鐨勫敮涓�鏍囪瘑
+            width: 500,   // Number锛屽彲閫夛紝鑺傜偣澶у皬鐨� width 鍊�
+            height: 300,  // Number锛屽彲閫夛紝鑺傜偣澶у皬鐨� height 鍊�
+            label: '璇ラ」鐩繕鏈厤缃巶瀹剁綉缁滃浘',
+            attrs: {
+              body: {
+                strokeWidth: 0
+              },
+            }
+            //   text: {
+            //     text: '璇ラ」鐩繕鏈紪鍒剁綉缁滃浘',
+            //     // fontSize: 56,
+            //     fill: 'rgba(0,0,0,0.7)'
+            //   },
+            // },
+          }
+        ],
+      },
+      type: '',
+      id: '',
+      graph: null,
+      globalGridAttr: {
+        type: 'mesh',
+        size: 10,
+        color: '#e5e5e5',
+        thickness: 1,
+        colorSecond: '#d0d0d0',
+        thicknessSecond: 1,
+        factor: 4,
+        bgColor: '#e5e5e5',
+        showImage: true,
+        repeat: 'watermark',
+        angle: 30,
+        position: 'center',
+        bgSize: JSON.stringify({width: 150, height: 150}),
+        opacity: 0.1,
+
+        stroke: '#5F95FF',
+        strokeWidth: 1,
+        connector: 'normal',
+        label: '',
+
+        nodeStroke: '#5F95FF',
+        nodeStrokeWidth: 1,
+        nodeFill: '#ffffff',
+        nodeFontSize: 12,
+        nodeColor: '#080808',
+        nodeText: '',
+        nodeDate: '',
+        nodeUsers: '',
+        nodeDataDate: '',
+        nodeDataText: ''
+      },
+      isReady: false,
+      curCel: Cell,
+      left_p: document.documentElement.clientHeight * 0.85,
+      ports: {
+        groups: {
+          top: {
+            position: 'top',
+            attrs: {
+              circle: {
+                r: 8,
+                magnet: true,
+                stroke: '#5F95FF',
+                strokeWidth: 1,
+                fill: '#fff',
+                style: {
+                  visibility: 'hidden',
+                },
+              },
+            },
+          },
+          right: {
+            position: 'right',
+            attrs: {
+              circle: {
+                r: 8,
+                magnet: true,
+                stroke: '#5F95FF',
+                strokeWidth: 1,
+                fill: '#fff',
+                style: {
+                  visibility: 'hidden',
+                },
+              },
+            },
+          },
+          bottom: {
+            position: 'bottom',
+            attrs: {
+              circle: {
+                r: 8,
+                magnet: true,
+                stroke: '#5F95FF',
+                strokeWidth: 1,
+                fill: '#fff',
+                style: {
+                  visibility: 'hidden',
+                },
+              },
+            },
+          },
+          left: {
+            position: 'left',
+            attrs: {
+              circle: {
+                r: 8,
+                magnet: true,
+                stroke: '#5F95FF',
+                strokeWidth: 1,
+                fill: '#fff',
+                style: {
+                  visibility: 'hidden',
+                },
+              },
+            },
+          },
+        },
+        items: [
+          {
+            group: 'top',
+          },
+          {
+            group: 'right',
+          },
+          {
+            group: 'bottom',
+          },
+          {
+            group: 'left',
+          },
+        ],
+      }
+    }
+  },
+  watch: {
+  },
+  methods: {
+    async init(params) {
+      let res = await this.$http.get(`/WfDef/getFlowStatusJson`,{params:params})
+      console.log(res.data,'res.data ')
+      if (res.data !== null) {
+        this.dataForm = res.data
+        this.graph.unfreeze('flowChartView')
+        if (this.dataForm.diagram!=null){
+          this.graph.fromJSON(JSON.parse(this.dataForm.diagram))
+        } else{
+          this.graph.fromJSON(this.emptyJson)
+        }
+        this.graph.positionContent('top',{ padding: { left: 0 }})
+        // this.graph.zoomToFit()
+        this.graph.freeze('flowChartView')
+        if(flowCode!='planFlow' && flowCode!='wltFlow' && flowCode!='xbsy' && flowCode!='hxsy' && flowCode!='kybgFlow'
+          && flowCode!='jsfaFlow' && flowCode!='jzjysFlow' && flowCode!='zjgcFlow'){
+          if(this.graph.scroller){
+            for(let graph in this.graph.scroller.widgetOptions){
+              this.graph.scroller.widgetOptions[graph] = false
+            }
+          }
+          // this.graph.disablePanning()
+          this.graph.lockScroller()
+        }
+      } else {
+        this.graph.unfreeze('flowChartView')
+        this.dataForm.id = null
+        console.log(this.data, 'this.data asdfg')
+        this.graph.fromJSON(this.emptyJson)
+        this.graph.centerContent()
+        // this.graph.zoomToFit()
+        this.graph.freeze('flowChartView')
+      }
+    },
+    init2() {
+      this.graph = new Graph({
+        container: document.getElementById('flowChartView'),
+        width: document.documentElement.clientWidth*0.5,
+        height:this.flowChartHeight? 595:document.documentElement.clientHeight-220,
+        // async: true,
+        // grid: {
+        //   visible: true,
+        // },
+        // autoResize: true,
+        // panning: {
+        //   enabled: true,
+        // },
+        scroller: {
+          enabled: true,
+          pannable: true,
+        },
+        mousewheel: {
+          enabled: true,
+          zoomAtMousePosition: true,
+          modifiers: 'ctrl',
+          minScale: 0.1,
+          maxScale: 10,
+        },
+        connecting: {
+          router: { name: 'manhattan' },
+          connector: { name: 'rounded' },
+          connectionPoint: 'anchor',
+          allowBlank: false,
+          snap: {
+            radius: 20,
+          }
+        },
+      })
+      this.graph.centerContent()
+      Graph.registerNode(
+        'custom-polygon',
+        {
+          inherit: 'polygon',
+          width: 86,
+          height: 56,
+          attrs: {
+            body: {
+              strokeWidth: 1,
+              stroke: '#5F95FF',
+              fill: '#EFF4FF',
+            },
+            text: {
+              fontSize: 20,
+              fill: '#262626',
+            },
+          },
+          ports: {
+            ...this.ports
+          },
+        },
+        true,
+      )
+
+      Graph.registerNode(
+        'custom-circle',
+        {
+          inherit: 'ellipse',
+          width: 86,
+          height: 56,
+          data: {
+            dataId: '',
+            finishDate: ''
+          },
+          attrs: {
+            body: {
+              strokeWidth: 1,
+              stroke: '#5F95FF',
+              fill: '#EFF4FF',
+            },
+            title: {
+              text: '',
+              fontSize: 20,
+              fill: '#262626',
+              refX: 0.5,
+              refY: '100%',
+              refY2: 4,
+              textAnchor: 'middle',
+              textVerticalAnchor: 'top',
+            },
+            text: {
+              fontSize: 20,
+              fill: '#262626',
+              refX: 0.5,
+              refY: 0.5,
+              textAnchor: 'middle',
+              textVerticalAnchor: 'middle',
+            },
+          },
+
+          markup: [
+            {
+              tagName: 'ellipse',
+              selector: 'body',
+            },
+            {
+              tagName: 'text',
+              selector: 'title',
+            },
+            {
+              tagName: 'text',
+              selector: 'text',
+            },
+          ],
+          ports: {...this.ports},
+        },
+        true,
+      )
+      const r6 = this.graph.createNode({
+        shape: 'text-block',
+        label: '鍙�夎繃绋�',
+        width: 86,
+        height: 56,
+        data: {
+          dataId: '',
+          finishDate: ''
+        },
+        attrs: {
+          body: {
+            strokeWidth: 1,
+            stroke: '#5F95FF',
+            fill: '#EFF4FF',
+            rx: 6,
+            ry: 6
+          },
+          text: {
+            text: '鍙�夎繃绋�',
+            fontSize: 20,
+            fill: '#262626',
+            refX: '0',
+            refY: -0.5,
+            refY2: '0',
+            textAnchor: 'middle',
+            textVerticalAnchor: 'middle',
+          },
+        },
+        markup: [
+          {
+            tagName: 'rect',
+            selector: 'body',
+          },
+          {
+            tagName: 'text',
+            selector: 'text',
+          },
+        ],
+        ports: {...this.ports},
+      })
+      const r4 = this.graph.createNode({
+        shape: 'custom-polygon',
+        attrs: {
+          body: {
+            refPoints: '0,10 10,0 20,10 10,20',
+          },
+        },
+        label: '鍐崇瓥',
+      })
+      const r5 = this.graph.createNode({
+        shape: 'custom-circle',
+        data: {
+          dataId: '',
+          finishDate: ''
+        },
+        label: '闃舵',
+      })
+      // 鍗曞嚮node鑺傜偣
+      this.graph.on('node:click', ({node}) => {
+          let stepMarker = node.getData().stepMarker || ''
+          this.$emit('fatherMethod',stepMarker)
+          console.log(node.getData(),stepMarker,'  node.getData()')
+      })
+      // // 榧犳爣绉诲叆node鑺傜偣
+      this.graph.on('node:mouseenter', ({node,e}) => {
+        const style = this.knob.style
+        // e.stopPropagation()
+        setTimeout(()=>{
+        if (e) {
+          if (node.getData().receiveName && node.getData().receiveName!==undefined) {
+              const p = this.graph.clientToGraph(e.clientX, e.clientY)
+              style.display = 'block'
+              style.left = `${p.x}px`
+              style.top = `${p.y}px`
+              style.width = (node.getData().tipsWidth +30+ 'px')
+              style.height = (40 + 'px')
+              style.textAlign = 'center'
+              style.background = '#000'
+              style.color = '#fff'
+              style.lineHeight = (40 + 'px')
+              this.knob.innerText = node.getData().receiveName === undefined ? '鏆傛棤' : node.getData().receiveName
+          }else{
+            style.display = 'none'
+            style.left = '-1000px'
+            style.top = '-1000px'
+          }
+        } else {
+          style.display = 'none'
+          style.left = '-1000px'
+          style.top = '-1000px'
+        }
+        },50)
+      })
+      // // 榧犳爣绉诲嚭node鑺傜偣
+      this.graph.on('node:mouseleave', ({node}) => {
+        const style = this.knob.style
+        style.display = 'none'
+      })
+    }
+  },
+  mounted() {
+    this.init2()
+    this.type = 'grid'
+     this.knob = document.createElement('div',false)
+    // this.knob = document.getElementById('toolTip')
+    this.knob.style.position = 'absolute'
+    document.getElementById('flowChartView').appendChild(this.knob)
+  }
+}
+</script>
+
+<style>
+#flowChartView {
+  display: flex;
+  border: 1px solid #dfe3e8;
+  width: 100% !important;
+}
+#flowChartView .x6-cell.x6-node {
+  cursor: inherit;
+}
+.x6-graph-scroller.x6-graph-scroller-pannable {
+  width: 100% !important;
+}
+
+.x6-widget-stencil {
+  position: relative;
+  height: 100%;
+}
+
+.x6-widget-stencil-content {
+  position: relative;
+  height: 100%;
+}
+.clear::after{
+  content: '';
+  display: table;
+  clear: both;
+}
+</style>
diff --git a/web/src/views/modules/flowChart/processTimeline.vue b/web/src/views/modules/flowChart/processTimeline.vue
new file mode 100644
index 0000000..0ad1db2
--- /dev/null
+++ b/web/src/views/modules/flowChart/processTimeline.vue
@@ -0,0 +1,111 @@
+<template>
+  <el-row :gutter="10">
+    <el-col>
+      <FlowChartView :flowChartHeight="flowChartHeight" ref="flowChartView"></FlowChartView>
+    </el-col>
+    <el-col>
+      <ProcessTrajectory ref="processTrajectory" @refreshDataList="getQuery()"></ProcessTrajectory>
+    </el-col>
+  </el-row>
+</template>
+
+<script>
+  import FlowChartView from './flowChartView'
+  import ProcessTrajectory from './ProcessTrajectory'
+
+  export default {
+    name: "processTimeline",
+    props:{
+      flowChartHeight:''
+    },
+    data() {
+      return {
+        contractComponent: null,
+        dataForm2: {
+          id: '',
+          projectId: '',
+          approveStepId: '',
+        },
+        isBlankPage:true,
+        word: {},
+        transTitle: ['鏁伴噺'],
+        stepCountList: [],
+        constructionList: [],
+        isBackground1: false,
+        approvalNum: '',
+        refuseNum: '',
+        num: '',
+        repairNum: '',
+        approveStepId: '',
+        pier: '',
+        agreed: '',
+        repair: '',
+        approve: '',
+        projectId: '',
+        processData: false,
+        flowCode: '',
+        selectFlowCode: '',
+        showFlowCode: '',
+        stepMarker: '',
+        statusData: {},
+        noneFrame: false,
+      };
+    },
+    components: {
+      FlowChartView,
+      ProcessTrajectory
+    },
+    watch: {},
+    created() {
+    },
+    computed: {},
+    methods: {
+      init(row) {
+        console.log(row, 'row init')
+        this.showFlowCode = this.selectFlowCode = this.flowCode = row.flowCode
+        this.showFlowCode = 'planFlow'
+        this.stepMarker = row.stepMarker
+        let params={
+          flowCode:row.flowCode,
+          bizId:row.bizId
+        }
+        this.$nextTick(() => {
+          this.$refs.flowChartView.init(params)
+          this.$refs.processTrajectory.init(params)
+        })
+      },
+      indexFormat(index) {
+        return index += 1
+      },
+      handleInfiniteLoadingBeforeGet() {
+        this.page = 1;
+        this.dataListAll = []
+        this.dataList = []
+      },
+      async getQuery(){
+        this.handleInfiniteLoadingBeforeGet()
+        this.dataLoading = true
+        let params = {
+          djxlSystem: this.dataForm.djxlSystem,
+        }
+        let res = await this.$http.get(`/newPlan/taskCenter/page`,{
+          params: params
+        })
+        if (res.success) {
+          this.dataLoading = false
+          this.handleInfiniteLoadingAfterGet(res)
+          console.log(this.dataList, 'getQuery:this.dataList')
+        } else {
+          this.dataLoading = true
+        }
+      },
+    },
+    mounted() {
+      // this.kwReplacement()
+    }
+  }
+</script>
+
+<style>
+
+</style>
diff --git a/web/src/views/modules/itemCirculatOrder/ItemCirculatOrder-AddOrUpdate.vue b/web/src/views/modules/itemCirculatOrder/ItemCirculatOrder-AddOrUpdate.vue
index 0a1b4af..7e73462 100644
--- a/web/src/views/modules/itemCirculatOrder/ItemCirculatOrder-AddOrUpdate.vue
+++ b/web/src/views/modules/itemCirculatOrder/ItemCirculatOrder-AddOrUpdate.vue
@@ -121,7 +121,7 @@
           </div>
           <div class="el-border-left-right acceptDate" style="width: 20%;height: 80px;">
             <el-form-item style="width: 100%;padding-left:20px;margin:0;">
-              {{dataForm.circulatOrder.acceptDate}}
+              {{ dataForm.circulatOrder.acceptDate | filterTime('YYYY骞碝M鏈圖D鏃�') }}
             </el-form-item>
           </div>
           <div style="width: 84px;text-align: center;font-weight: 600">
@@ -176,7 +176,8 @@
           </div>
           <div class="el-border-left-right" style="width: 20%;height: 40px;">
             <el-form-item style="width: 100%;padding-left:20px;margin:0;">
-              {{dataForm.circulatOrder.detectDate}}
+<!--              {{dataForm.circulatOrder.detectDate}}-->
+              {{ dataForm.circulatOrder.detectDate | filterTime('YYYY骞碝M鏈圖D鏃�') }}
             </el-form-item>
           </div>
           <div style="width: 84px;text-align: center;font-weight: 600">
@@ -228,7 +229,8 @@
           </div>
           <div class="el-border-left-right " style="width: 20%;height: 40px;">
             <el-form-item style="width: 100%;padding-left:20px;margin:0;">
-              {{dataForm.circulatOrder.issueDate}}
+<!--              {{dataForm.circulatOrder.issueDate}}-->
+              {{ dataForm.circulatOrder.issueDate | filterTime('YYYY骞碝M鏈圖D鏃�') }}
             </el-form-item>
           </div>
           <div style="width: 84px;text-align: center;font-weight: 600">
diff --git a/web/src/views/modules/itemCirculatOrder/ItemCirculatOrder.vue b/web/src/views/modules/itemCirculatOrder/ItemCirculatOrder.vue
index 414a9ab..219780a 100644
--- a/web/src/views/modules/itemCirculatOrder/ItemCirculatOrder.vue
+++ b/web/src/views/modules/itemCirculatOrder/ItemCirculatOrder.vue
@@ -1,6 +1,5 @@
 <template>
-  <el-card shadow="never" class="aui-card--fill">
-    <div class="mod-itemCirculatOrder-itemCirculatOrder}">
+    <div class="fa-card-a">
       <zt-table-wraper query-url="/itemCirculatOrder/ItemCirculatOrder/page" delete-url="/itemCirculatOrder/ItemCirculatOrder/deleteCirculat" v-slot="{ table }">
         <el-form :inline="true" :model="dataForm" @keyup.enter.native="table.query()">
           <el-form-item>
@@ -33,7 +32,6 @@
         </ProjectSelect>
       </zt-table-wraper>
     </div>
-  </el-card>
 </template>
 
 <script>
diff --git a/web/src/views/modules/project/Environ.vue b/web/src/views/modules/project/Environ.vue
index 05dc14b..f301a53 100644
--- a/web/src/views/modules/project/Environ.vue
+++ b/web/src/views/modules/project/Environ.vue
@@ -1,6 +1,5 @@
 <template>
-  <el-card shadow="never" class="aui-card--fill">
-    <div class="mod-project-environ}">
+    <div class="fa-card-a">
       <zt-table-wraper query-url="/project/Environ/page" delete-url="/project/Environ/deleteEnviron" v-slot="{ table }" @dataLoaded="dataLoaded">
         <el-form :inline="true" :model="dataForm" @keyup.enter.native="table.query()">
           <el-form-item>
@@ -31,7 +30,6 @@
         </ProjectSelect>
       </zt-table-wraper>
     </div>
-  </el-card>
 </template>
 
 <script>
diff --git a/web/src/views/modules/project/Project.vue b/web/src/views/modules/project/Project.vue
index c368ee6..4466ff4 100644
--- a/web/src/views/modules/project/Project.vue
+++ b/web/src/views/modules/project/Project.vue
@@ -1,6 +1,5 @@
 <template>
-  <el-card shadow="never" class="aui-card--fill">
-    <div class="mod-project-project}">
+    <div class="fa-card-a">
       <zt-table-wraper query-url="/project/Project/page" delete-url="/project/Project/deleteProject" v-slot="{ table }">
         <el-form :inline="true" class="form-input-width-1"  :model="dataForm" @keyup.enter.native="table.query()">
           <el-form-item>
@@ -52,7 +51,6 @@
         <add-or-update @refreshDataList="table.query"/>
       </zt-table-wraper>
     </div>
-  </el-card>
 </template>
 
 <script>
diff --git a/web/src/views/modules/project/SoftwareTestOrder.vue b/web/src/views/modules/project/SoftwareTestOrder.vue
index 431fa8f..80b448b 100644
--- a/web/src/views/modules/project/SoftwareTestOrder.vue
+++ b/web/src/views/modules/project/SoftwareTestOrder.vue
@@ -1,6 +1,5 @@
 <template>
-  <el-card shadow="never" class="aui-card--fill">
-    <div class="mod-project-softwareTestOrder}">
+    <div class="fa-card-a">
       <zt-table-wraper query-url="/project/SoftwareTestOrder/page" delete-url="/project/SoftwareTestOrder/deleteOrder"
                        v-slot="{ table }">
         <el-form :inline="true" :model="dataForm" @keyup.enter.native="table.query()">
@@ -51,7 +50,6 @@
         <Preview ref="view" :pageMarkerfun="SoftwareTestOrder"></Preview>
       </zt-table-wraper>
     </div>
-  </el-card>
 </template>
 
 <script>
diff --git a/web/src/views/modules/sys/task/already-task.vue b/web/src/views/modules/sys/task/already-task.vue
index a5fc4a0..0691a61 100644
--- a/web/src/views/modules/sys/task/already-task.vue
+++ b/web/src/views/modules/sys/task/already-task.vue
@@ -6,7 +6,7 @@
       <el-input type="text" v-model="dataForm.djxlSystem" v-if="false" />
     </el-form>
     <el-table ref="table"
-              :height="getTransformHeight(transformHeight)"
+              :height="getTransformHeight()"
               class="pushtable  table-is__left-tz"
               v-loading="dataLoading"
               :data="dataList"
@@ -27,13 +27,13 @@
       <el-table-column align="center" prop="stepName" label="褰撳墠鐘舵��" width="240px"/>
       <el-table-column align="center" prop="receiveName" label="鍔炵悊浜�"  width="120px"/>
       <!--        <el-table-column align="center" prop="statusName" label="鎴戠殑鎰忚" />-->
-      <el-table-column label="鎿嶄綔" width="220px">
+      <el-table-column label="鎿嶄綔" width="180px">
         <template v-slot="{ row }">
           <zt-table-button v-show="row.canRecall == 1 && !$store.state.user.isAdmin" @click="reCall(row)">鎾ゅ洖</zt-table-button>
           <zt-table-button @click="check(row,'')" v-if="row.flowCode !== 'yearPlanFlow'">鏌ョ湅</zt-table-button>
           <zt-table-button @click="check(row,'')" v-if="row.flowCode === 'yearPlanFlow'">淇敼</zt-table-button>
           <zt-table-button @click="flowChart(row)">娴佺▼鍥�</zt-table-button>
-          <zt-table-button v-if="row.flowCode != 'yearPlan2'" @click="getFlowTrack(row)">鍔炵悊杞ㄨ抗</zt-table-button>
+<!--          <zt-table-button v-if="row.flowCode != 'yearPlan2'" @click="getFlowTrack(row)">鍔炵悊杞ㄨ抗</zt-table-button>-->
         </template>
       </el-table-column>
       <infinite-loading
@@ -57,6 +57,7 @@
   import cloneDeep from 'lodash/cloneDeep'
   import InfiniteLoading from 'vue-infinite-loading'
   import ItemCirculatOrder from '@/views/modules/itemCirculatOrder/ItemCirculatOrder-AddOrUpdate'
+  import Cookies from "js-cookie";
 
   export default {
     data() {
@@ -146,13 +147,9 @@
         });
       },
 
-      getTransformHeight(transformHeight){
+      getTransformHeight(){
         let Height=document.documentElement.clientHeight
-        if(transformHeight){
           return  Height-(650-403)
-        }else{
-          return  Height-650
-        }
       },
       async getQuery(){
         this.handleInfiniteLoadingBeforeGet()
diff --git a/web/src/views/modules/sys/task/stay-task.vue b/web/src/views/modules/sys/task/stay-task.vue
index b3921d5..81e4532 100644
--- a/web/src/views/modules/sys/task/stay-task.vue
+++ b/web/src/views/modules/sys/task/stay-task.vue
@@ -6,7 +6,7 @@
       <el-input type="text" v-model="dataForm.djxlSystem" v-if="false"/>
     </el-form>
     <el-table ref="table"
-              :height="getTransformHeight(transformHeight)"
+              :height="getTransformHeight()"
               v-loading="dataLoading"
               :data="dataList"
               style='margin-top:10px;transition: .5s;'
@@ -182,13 +182,9 @@
           this.dataLoading = true
         }
       },
-      getTransformHeight(transformHeight) {
+      getTransformHeight() {
         let Height = document.documentElement.clientHeight
-        if (transformHeight) {
           return Height - (650 - 403)
-        } else {
-          return Height - 650
-        }
       },
       async reCall(row) {
         if (await this.$tip.confirm('纭畾瑕佽繘琛屾挙鍥炲悧?')) {
diff --git a/web/src/views/modules/sys/task/taskCenter.vue b/web/src/views/modules/sys/task/taskCenter.vue
index d13ae74..4d3bcf4 100644
--- a/web/src/views/modules/sys/task/taskCenter.vue
+++ b/web/src/views/modules/sys/task/taskCenter.vue
@@ -12,12 +12,16 @@
         <alreadyTask :system="system" ref="alreadyTask" @alreadyTask="getDiagram1"></alreadyTask>
       </el-tab-pane>
     </el-tabs>
+    <el-dialog v-dialogDrag title="椤圭洰杩涘害鍥�" top="10vh" width='85%' :visible.sync="dialogVisible">
+      <processTimeline ref="processTimeline"></processTimeline>
+    </el-dialog>
   </div>
 </template>
 
 <script>
   import stayTask from './stay-task'
   import alreadyTask from './already-task'
+  import processTimeline from '../../flowChart/processTimeline'
 
   export default {
     data() {
@@ -31,7 +35,8 @@
     },
     components: {
       stayTask,
-      alreadyTask
+      alreadyTask,
+      processTimeline
     },
     mounted() {
     },
diff --git a/zt/core/src/main/resources/mapper/workflowconfig/WfDefDao.xml b/zt/core/src/main/resources/mapper/workflowconfig/WfDefDao.xml
index 48f8158..f1580fc 100644
--- a/zt/core/src/main/resources/mapper/workflowconfig/WfDefDao.xml
+++ b/zt/core/src/main/resources/mapper/workflowconfig/WfDefDao.xml
@@ -116,14 +116,11 @@
     </select>
 
     <select id="getStyleList" resultType="com.zt.modules.workflowconfig.model.WfDef">
-        select Content as diagram
-        from WX_NETWORK_DIAGRAM
+        select diagram
+        from wf_def
         where is_delete = 0
-        <if test="projectId!=null and projectId!=''">
-            and PROJECT_ID = #{projectId}
-        </if>
-        <if test="diagramId!=null and diagramId!=''">
-            and DIAGRAM_ID = #{diagramId}
+        <if test="flowCode!=null and flowCode!=''">
+            and CODE = #{flowCode}
         </if>
     </select>
 

--
Gitblit v1.9.1