作者 小范

流程实例管理界面新增流程图功能按钮

@@ -9,8 +9,10 @@ export const create = params => { return http.post(`${baseUrl}/deployment/create @@ -9,8 +9,10 @@ export const create = params => { return http.post(`${baseUrl}/deployment/create
9 9
10 10
11 11
12 -//实例管理 12 +//流程实例管理
13 export const instanceList = params => { return http.get(`${baseUrl}/process/instanceList`, params); }; 13 export const instanceList = params => { return http.get(`${baseUrl}/process/instanceList`, params); };
  14 +export const processDiagram = params => { return http.getStream(`${baseUrl}/processDiagram`, params); };
  15 +
14 //任务管理 16 //任务管理
15 export const allTask = params => { return http.get(`${baseUrl}/task/allTask`, params); }; 17 export const allTask = params => { return http.get(`${baseUrl}/task/allTask`, params); };
16 export const allTaskHistory = params => { return http.get(`${baseUrl}/task/allTaskHistory`, params); }; 18 export const allTaskHistory = params => { return http.get(`${baseUrl}/task/allTaskHistory`, params); };
@@ -459,7 +459,7 @@ let routes = [ @@ -459,7 +459,7 @@ let routes = [
459 iconCls: 'el-icon-goods', 459 iconCls: 'el-icon-goods',
460 children: [ 460 children: [
461 {path:'/technological',component:technological,name:'部署管理'}, 461 {path:'/technological',component:technological,name:'部署管理'},
462 - {path:'/example',component:example,name:'部署实例管理'}, 462 + {path:'/example',component:example,name:'流程实例管理'},
463 {path:'/task',component:task,name:'任务管理'}, 463 {path:'/task',component:task,name:'任务管理'},
464 {path:'/definition',component:definition,name:'部署定义管理'}, 464 {path:'/definition',component:definition,name:'部署定义管理'},
465 ] 465 ]
@@ -23,7 +23,7 @@ @@ -23,7 +23,7 @@
23 <el-table 23 <el-table
24 v-loading="tableloading" 24 v-loading="tableloading"
25 :data="tableData" 25 :data="tableData"
26 - style="width: 100%" 26 + style="width: 100%"npm run dev
27 :default-sort = "{prop: 'date', order: 'descending'}" 27 :default-sort = "{prop: 'date', order: 'descending'}"
28 :header-cell-style="{background:'#6F8294',color:'#FFFFFF'}" size="small"> 28 :header-cell-style="{background:'#6F8294',color:'#FFFFFF'}" size="small">
29 <el-table-column type="expand"> 29 <el-table-column type="expand">
@@ -79,29 +79,29 @@ @@ -79,29 +79,29 @@
79 </el-table-column> 79 </el-table-column>
80 <el-table-column 80 <el-table-column
81 label="名称" 81 label="名称"
82 - prop="name " 82 + prop="name"
83 width="160"> 83 width="160">
84 </el-table-column> 84 </el-table-column>
85 <el-table-column 85 <el-table-column
86 label="描述" 86 label="描述"
87 - prop="description " 87 + prop="description"
88 width="160"> 88 width="160">
89 </el-table-column> 89 </el-table-column>
90 <el-table-column 90 <el-table-column
91 label="关键字" 91 label="关键字"
92 - prop="key "> 92 + prop="key">
93 </el-table-column> 93 </el-table-column>
94 <el-table-column 94 <el-table-column
95 label="版本" 95 label="版本"
96 - prop="version "> 96 + prop="version">
97 </el-table-column> 97 </el-table-column>
98 <el-table-column 98 <el-table-column
99 label="已升级" 99 label="已升级"
100 - prop="isUpdated "> 100 + prop="isUpdated">
101 </el-table-column> 101 </el-table-column>
102 <el-table-column 102 <el-table-column
103 label="删除状态" 103 label="删除状态"
104 - prop="isDeleted "> 104 + prop="isDeleted">
105 <!-- <template slot-scope="scope">--> 105 <!-- <template slot-scope="scope">-->
106 <!-- <span v-if="scope.row.suspensionState ==='1'">活跃</span>--> 106 <!-- <span v-if="scope.row.suspensionState ==='1'">活跃</span>-->
107 <!-- <span v-if="scope.row.suspensionState ==='2'">中断</span>--> 107 <!-- <span v-if="scope.row.suspensionState ==='2'">中断</span>-->
@@ -41,6 +41,15 @@ @@ -41,6 +41,15 @@
41 </template> 41 </template>
42 </el-table-column> 42 </el-table-column>
43 <el-table-column 43 <el-table-column
  44 + fixed="left"
  45 + label="操作">
  46 + <template slot-scope="scope">
  47 + <el-button type="success" size="mini" @click="chart(scope.$index,scope.row)">流程图</el-button>
  48 + <!-- <el-button type="warning" size="mini" @click="remove(scope.$index,scope.row)">删除</el-button>-->
  49 + <!-- <el-button type="danger" size="mini" @click="removeDel(scope.$index,scope.row)">彻底删除</el-button>-->
  50 + </template>
  51 + </el-table-column>
  52 + <el-table-column
44 label="实例名称" 53 label="实例名称"
45 prop="processDefinitionName" 54 prop="processDefinitionName"
46 width="160"> 55 width="160">
@@ -92,12 +101,30 @@ @@ -92,12 +101,30 @@
92 </div> 101 </div>
93 </el-col> 102 </el-col>
94 </el-row> 103 </el-row>
  104 +<!-- 流程图弹框-->
  105 + <el-row>
  106 + <el-dialog title="流程图" :visible.sync="dialogFormVisible">
  107 + <el-form :model="form">
  108 + <el-form-item>
  109 + <div class="demo-image__preview">
  110 + <el-image
  111 +
  112 + :src="form.url">
  113 + </el-image>
  114 + </div>
  115 + </el-form-item>
  116 + </el-form>
  117 + <div slot="footer" class="dialog-footer">
  118 + <el-button @click="dialogFormVisible = false">取 消</el-button>
  119 + </div>
  120 + </el-dialog>
  121 + </el-row>
95 </el-main> 122 </el-main>
96 </el-container> 123 </el-container>
97 </template> 124 </template>
98 125
99 <script> 126 <script>
100 - import {instanceList} from "../../api/technological"; 127 + import {instanceList,processDiagram} from "../../api/technological";
101 128
102 export default { 129 export default {
103 name: "example", 130 name: "example",
@@ -112,6 +139,10 @@ @@ -112,6 +139,10 @@
112 total:0, 139 total:0,
113 tableData: [], 140 tableData: [],
114 tableloading:false, 141 tableloading:false,
  142 + dialogFormVisible: false,
  143 + form: {
  144 + url: ''
  145 + }
115 } 146 }
116 }, 147 },
117 mounted() { 148 mounted() {
@@ -151,6 +182,17 @@ @@ -151,6 +182,17 @@
151 182
152 }) 183 })
153 }, 184 },
  185 + // 打开流程图
  186 + chart(index, row) {
  187 + this.dialogFormVisible = true
  188 +
  189 + processDiagram({processId:row.processInstanceId}).then(res =>{
  190 + // eslint-disable-next-line no-console
  191 + console.log(res)
  192 + this.form.url=window.URL.createObjectURL(res.data);
  193 + });
  194 +
  195 + },
154 } 196 }
155 } 197 }
156 </script> 198 </script>
1 { 1 {
2 - "nmmsVer": "1.26" 2 + "nmmsVer": "1.27"
3 } 3 }