smallchill
7 years ago
parent
048d1a3e97
commit
dcafb0937f
20 changed files with 918 additions and 109 deletions
File diff suppressed because one or more lines are too long
@ -0,0 +1,82 @@ |
|||||||
|
import request from '@/router/axios'; |
||||||
|
|
||||||
|
export const modelList = (current, size, params) => { |
||||||
|
return request({ |
||||||
|
url: '/api/blade-flow/model/list', |
||||||
|
method: 'get', |
||||||
|
params: { |
||||||
|
...params, |
||||||
|
current, |
||||||
|
size, |
||||||
|
} |
||||||
|
}) |
||||||
|
} |
||||||
|
|
||||||
|
export const managerList = (current, size, params) => { |
||||||
|
return request({ |
||||||
|
url: '/api/blade-flow/manager/list', |
||||||
|
method: 'get', |
||||||
|
params: { |
||||||
|
...params, |
||||||
|
current, |
||||||
|
size, |
||||||
|
} |
||||||
|
}) |
||||||
|
} |
||||||
|
|
||||||
|
export const followList = (current, size, params) => { |
||||||
|
return request({ |
||||||
|
url: '/api/blade-flow/follow/list', |
||||||
|
method: 'get', |
||||||
|
params: { |
||||||
|
...params, |
||||||
|
current, |
||||||
|
size, |
||||||
|
} |
||||||
|
}) |
||||||
|
} |
||||||
|
|
||||||
|
|
||||||
|
export const removeModel = (ids) => { |
||||||
|
return request({ |
||||||
|
url: '/api/blade-flow/model/remove', |
||||||
|
method: 'post', |
||||||
|
params: { |
||||||
|
ids, |
||||||
|
} |
||||||
|
}) |
||||||
|
} |
||||||
|
|
||||||
|
export const deployModel = (params) => { |
||||||
|
return request({ |
||||||
|
url: '/api/blade-flow/model/deploy', |
||||||
|
method: 'post', |
||||||
|
params |
||||||
|
}) |
||||||
|
} |
||||||
|
|
||||||
|
export const changeState = (params) => { |
||||||
|
return request({ |
||||||
|
url: '/api/blade-flow/manager/change-state', |
||||||
|
method: 'post', |
||||||
|
params |
||||||
|
}) |
||||||
|
} |
||||||
|
|
||||||
|
export const deleteDeployment = (deploymentIds) => { |
||||||
|
return request({ |
||||||
|
url: '/api/blade-flow/manager/delete-deployment', |
||||||
|
method: 'post', |
||||||
|
params: { |
||||||
|
deploymentIds, |
||||||
|
} |
||||||
|
}) |
||||||
|
} |
||||||
|
|
||||||
|
export const deleteProcessInstance = (params) => { |
||||||
|
return request({ |
||||||
|
url: '/api/blade-flow/follow/delete-process-instance', |
||||||
|
method: 'post', |
||||||
|
params |
||||||
|
}) |
||||||
|
} |
||||||
@ -0,0 +1,65 @@ |
|||||||
|
<template> |
||||||
|
<basic-container> |
||||||
|
<avue-form :option="option" v-model="form" :upload-before="uploadBefore" :upload-after="uploadAfter"></avue-form> |
||||||
|
</basic-container> |
||||||
|
</template> |
||||||
|
|
||||||
|
<script> |
||||||
|
export default { |
||||||
|
data() { |
||||||
|
return { |
||||||
|
form: { |
||||||
|
imgUrl: [], |
||||||
|
}, |
||||||
|
option: { |
||||||
|
labelWidth: 120, |
||||||
|
column: [ |
||||||
|
{ |
||||||
|
label: '流程类型', |
||||||
|
prop: 'flowCategory', |
||||||
|
type: 'select', |
||||||
|
dicUrl: `/api/blade-system/dict/dictionary?code=flow`, |
||||||
|
props: { |
||||||
|
label: "dictValue", |
||||||
|
value: "dictKey" |
||||||
|
}, |
||||||
|
rules: [ |
||||||
|
{ |
||||||
|
required: true, |
||||||
|
message: '请选择流程类型', |
||||||
|
trigger: 'blur' |
||||||
|
} |
||||||
|
] |
||||||
|
}, |
||||||
|
{ |
||||||
|
label: '附件上传', |
||||||
|
prop: 'imgUrl', |
||||||
|
type: 'upload', |
||||||
|
loadText: '附件上传中，请稍等', |
||||||
|
span: 24, |
||||||
|
propsHttp: { |
||||||
|
res: 'data.0' |
||||||
|
}, |
||||||
|
tip: '请上传 bpmn20.xml 标准格式文件', |
||||||
|
}, |
||||||
|
] |
||||||
|
} |
||||||
|
} |
||||||
|
}, |
||||||
|
methods: { |
||||||
|
uploadBefore(file, done, loading) { |
||||||
|
console.log(file) |
||||||
|
done() |
||||||
|
this.$message.success('上传前的方法') |
||||||
|
}, |
||||||
|
uploadAfter(res, done, loading) { |
||||||
|
console.log(res) |
||||||
|
done() |
||||||
|
this.$message.success('上传后的方法') |
||||||
|
}, |
||||||
|
submit() { |
||||||
|
this.$message.success('当前数据' + JSON.stringify(this.form)) |
||||||
|
} |
||||||
|
} |
||||||
|
} |
||||||
|
</script> |
||||||
@ -0,0 +1,157 @@ |
|||||||
|
<template> |
||||||
|
<basic-container> |
||||||
|
<avue-crud :option="option" |
||||||
|
:data="data" |
||||||
|
ref="crud" |
||||||
|
v-model="form" |
||||||
|
:page="page" |
||||||
|
:permission="permissionList" |
||||||
|
@row-del="rowDel" |
||||||
|
@search-change="searchChange" |
||||||
|
@search-reset="searchReset" |
||||||
|
@selection-change="selectionChange" |
||||||
|
@on-load="onLoad"> |
||||||
|
</avue-crud> |
||||||
|
<el-dialog title="流程删除" |
||||||
|
:visible.sync="followBox" |
||||||
|
width="20%"> |
||||||
|
<el-form :model="form" |
||||||
|
ref="form" |
||||||
|
label-width="20px"> |
||||||
|
<el-form-item label="删除理由"> |
||||||
|
<el-input v-model="deleteReason" |
||||||
|
placeholder="请输入删除理由"></el-input> |
||||||
|
</el-form-item> |
||||||
|
</el-form> |
||||||
|
<span slot="footer" |
||||||
|
class="dialog-footer"> |
||||||
|
<el-button @click="followBox = false">关 闭</el-button> |
||||||
|
<el-button type="primary" |
||||||
|
@click="handleDelete">确 定</el-button> |
||||||
|
</span> |
||||||
|
</el-dialog> |
||||||
|
</basic-container> |
||||||
|
</template> |
||||||
|
|
||||||
|
<script> |
||||||
|
import {followList, deleteProcessInstance} from "@/api/flow/flow"; |
||||||
|
import {mapGetters} from "vuex"; |
||||||
|
|
||||||
|
export default { |
||||||
|
data() { |
||||||
|
return { |
||||||
|
form: {}, |
||||||
|
selectionId: '', |
||||||
|
processInstanceId: '', |
||||||
|
selectionList: [], |
||||||
|
page: { |
||||||
|
pageSize: 10, |
||||||
|
currentPage: 1, |
||||||
|
total: 0 |
||||||
|
}, |
||||||
|
followBox: false, |
||||||
|
deleteReason: '', |
||||||
|
option: { |
||||||
|
tip: false, |
||||||
|
border: true, |
||||||
|
index: true, |
||||||
|
selection: true, |
||||||
|
editBtn: false, |
||||||
|
addBtn: false, |
||||||
|
viewBtn: false, |
||||||
|
dialogWidth: 300, |
||||||
|
dialogHeight: 400, |
||||||
|
column: [ |
||||||
|
{ |
||||||
|
label: "执行id", |
||||||
|
prop: "executionId", |
||||||
|
search: true, |
||||||
|
}, |
||||||
|
{ |
||||||
|
label: "流程key", |
||||||
|
prop: "processDefinitionKey", |
||||||
|
search: true, |
||||||
|
}, |
||||||
|
{ |
||||||
|
label: "流程实例id", |
||||||
|
prop: "processInstanceId", |
||||||
|
search: true, |
||||||
|
}, |
||||||
|
{ |
||||||
|
label: "状态", |
||||||
|
prop: "suspensionState", |
||||||
|
}, |
||||||
|
{ |
||||||
|
label: "发起人", |
||||||
|
prop: "startUser", |
||||||
|
}, |
||||||
|
{ |
||||||
|
label: '开始时间', |
||||||
|
prop: 'startTime', |
||||||
|
}, |
||||||
|
] |
||||||
|
}, |
||||||
|
data: [] |
||||||
|
}; |
||||||
|
}, |
||||||
|
computed: { |
||||||
|
...mapGetters(["permission"]), |
||||||
|
permissionList() { |
||||||
|
return { |
||||||
|
delBtn: this.vaildData(this.permission.flow_follow_delete, false), |
||||||
|
}; |
||||||
|
}, |
||||||
|
ids() { |
||||||
|
let ids = []; |
||||||
|
this.selectionList.forEach(ele => { |
||||||
|
ids.push(ele.id); |
||||||
|
}); |
||||||
|
return ids.join(","); |
||||||
|
} |
||||||
|
}, |
||||||
|
methods: { |
||||||
|
rowDel(row) { |
||||||
|
this.followBox = true; |
||||||
|
this.selectionId = row.id; |
||||||
|
this.processInstanceId = row.processInstanceId; |
||||||
|
}, |
||||||
|
handleDelete() { |
||||||
|
this.$confirm("确定将选择数据删除?", { |
||||||
|
confirmButtonText: "确定", |
||||||
|
cancelButtonText: "取消", |
||||||
|
type: "warning" |
||||||
|
}) |
||||||
|
.then(() => { |
||||||
|
return deleteProcessInstance({deleteReason: this.deleteReason, processInstanceId: this.processInstanceId}); |
||||||
|
}) |
||||||
|
.then(() => { |
||||||
|
this.onLoad(this.page); |
||||||
|
this.followBox = false; |
||||||
|
this.$message({ |
||||||
|
type: "success", |
||||||
|
message: "操作成功!" |
||||||
|
}); |
||||||
|
}); |
||||||
|
}, |
||||||
|
searchReset() { |
||||||
|
this.onLoad(this.page); |
||||||
|
}, |
||||||
|
searchChange(params) { |
||||||
|
this.onLoad(this.page, params); |
||||||
|
}, |
||||||
|
selectionChange(list) { |
||||||
|
this.selectionList = list; |
||||||
|
}, |
||||||
|
onLoad(page, params = {}) { |
||||||
|
followList(page.currentPage, page.pageSize, params).then(res => { |
||||||
|
const data = res.data.data; |
||||||
|
this.page.total = data.total; |
||||||
|
this.data = data.records; |
||||||
|
}); |
||||||
|
} |
||||||
|
} |
||||||
|
}; |
||||||
|
</script> |
||||||
|
|
||||||
|
<style> |
||||||
|
</style> |
||||||
@ -0,0 +1,304 @@ |
|||||||
|
<template> |
||||||
|
<basic-container> |
||||||
|
<avue-crud :option="option" |
||||||
|
:data="data" |
||||||
|
ref="crud" |
||||||
|
v-model="form" |
||||||
|
:page="page" |
||||||
|
:permission="permissionList" |
||||||
|
@row-del="rowDel" |
||||||
|
@row-update="rowUpdate" |
||||||
|
@row-save="rowSave" |
||||||
|
@search-change="searchChange" |
||||||
|
@search-reset="searchReset" |
||||||
|
@selection-change="selectionChange" |
||||||
|
@on-load="onLoad"> |
||||||
|
<template slot="menuLeft"> |
||||||
|
<el-button type="danger" |
||||||
|
size="small" |
||||||
|
icon="el-icon-delete" |
||||||
|
v-if="permission.flow_manager_remove" |
||||||
|
plain |
||||||
|
@click="handleDelete">删 除 |
||||||
|
</el-button> |
||||||
|
</template> |
||||||
|
<template slot-scope="scope" slot="menu"> |
||||||
|
<el-button type="text" |
||||||
|
size="small" |
||||||
|
v-if="permission.flow_manager_state" |
||||||
|
plain |
||||||
|
@click.stop="handleState(scope.row,scope.index)">变更状态 |
||||||
|
</el-button> |
||||||
|
<el-button type="text" |
||||||
|
size="small" |
||||||
|
v-if="permission.flow_manager_image" |
||||||
|
plain |
||||||
|
@click.stop="handleImage(scope.row,scope.index)">流程图 |
||||||
|
</el-button> |
||||||
|
<el-button type="text" |
||||||
|
size="small" |
||||||
|
v-if="permission.flow_manager_remove" |
||||||
|
plain |
||||||
|
@click.stop="handleSlotDelete(scope.row,scope.index)">删除 |
||||||
|
</el-button> |
||||||
|
</template> |
||||||
|
<template slot-scope="{row}" |
||||||
|
slot="version"> |
||||||
|
<el-tag>v{{row.version}}</el-tag> |
||||||
|
</template> |
||||||
|
<template slot-scope="{row}" |
||||||
|
slot="suspensionState"> |
||||||
|
<el-tag>{{row.suspensionState===1?'激活':'挂起'}}</el-tag> |
||||||
|
</template> |
||||||
|
<template slot-scope="{row}" |
||||||
|
slot="category"> |
||||||
|
<el-tag>{{row.categoryName}}</el-tag> |
||||||
|
</template> |
||||||
|
</avue-crud> |
||||||
|
<el-dialog title="流程图" |
||||||
|
:visible.sync="flowBox" |
||||||
|
fullscreen=true> |
||||||
|
<iframe |
||||||
|
:src=flowUrl |
||||||
|
width="100%" |
||||||
|
height="700" |
||||||
|
title="流程图" |
||||||
|
frameBorder="no" |
||||||
|
border="0" |
||||||
|
marginWidth="0" |
||||||
|
marginHeight="0" |
||||||
|
scrolling="no" |
||||||
|
allowTransparency="yes"> |
||||||
|
</iframe> |
||||||
|
<span slot="footer" |
||||||
|
class="dialog-footer"> |
||||||
|
<el-button @click="flowBox = false">关 闭</el-button> |
||||||
|
</span> |
||||||
|
</el-dialog> |
||||||
|
<el-dialog title="流程变更" |
||||||
|
:visible.sync="stateBox" |
||||||
|
width="20%"> |
||||||
|
<el-form :model="form" |
||||||
|
ref="form" |
||||||
|
label-width="80px"> |
||||||
|
<el-form-item label="流程状态"> |
||||||
|
<el-select v-model="flowState" placeholder="请选择" value=""> |
||||||
|
<el-option |
||||||
|
v-for="item in stateOptions" |
||||||
|
:key="item.value" |
||||||
|
:label="item.label" |
||||||
|
:value="item.value"> |
||||||
|
</el-option> |
||||||
|
</el-select> |
||||||
|
</el-form-item> |
||||||
|
</el-form> |
||||||
|
<span slot="footer" |
||||||
|
class="dialog-footer"> |
||||||
|
<el-button @click="stateBox = false">关 闭</el-button> |
||||||
|
<el-button type="primary" |
||||||
|
@click="handleDoState">确 定</el-button> |
||||||
|
</span> |
||||||
|
</el-dialog> |
||||||
|
</basic-container> |
||||||
|
</template> |
||||||
|
|
||||||
|
<script> |
||||||
|
import {managerList, changeState, deleteDeployment} from "@/api/flow/flow"; |
||||||
|
import {mapGetters} from "vuex"; |
||||||
|
|
||||||
|
export default { |
||||||
|
data() { |
||||||
|
return { |
||||||
|
form: {}, |
||||||
|
selectionId: '', |
||||||
|
selectionList: [], |
||||||
|
page: { |
||||||
|
pageSize: 10, |
||||||
|
currentPage: 1, |
||||||
|
total: 0 |
||||||
|
}, |
||||||
|
flowBox: false, |
||||||
|
flowUrl: '', |
||||||
|
stateBox: false, |
||||||
|
flowState: '', |
||||||
|
stateOptions: [{ |
||||||
|
value: 'active', |
||||||
|
label: '激活' |
||||||
|
}, { |
||||||
|
value: 'suspend', |
||||||
|
label: '挂起' |
||||||
|
}], |
||||||
|
option: { |
||||||
|
tip: false, |
||||||
|
border: true, |
||||||
|
index: true, |
||||||
|
selection: true, |
||||||
|
editBtn: false, |
||||||
|
addBtn: false, |
||||||
|
viewBtn: false, |
||||||
|
delBtn: false, |
||||||
|
dialogWidth: 300, |
||||||
|
dialogHeight: 400, |
||||||
|
column: [ |
||||||
|
{ |
||||||
|
label: '流程主键', |
||||||
|
prop: 'id', |
||||||
|
}, |
||||||
|
{ |
||||||
|
label: '流程标识', |
||||||
|
prop: 'key', |
||||||
|
}, |
||||||
|
{ |
||||||
|
label: '流程名称', |
||||||
|
prop: 'name', |
||||||
|
}, |
||||||
|
{ |
||||||
|
label: "流程分类", |
||||||
|
type: "select", |
||||||
|
row: true, |
||||||
|
dicUrl: "/api/blade-system/dict/dictionary?code=flow", |
||||||
|
props: { |
||||||
|
label: "dictValue", |
||||||
|
value: "dictKey" |
||||||
|
}, |
||||||
|
slot: true, |
||||||
|
prop: "category", |
||||||
|
search: true, |
||||||
|
}, |
||||||
|
{ |
||||||
|
label: '流程版本', |
||||||
|
prop: 'version', |
||||||
|
slot: true, |
||||||
|
}, |
||||||
|
{ |
||||||
|
label: '状态', |
||||||
|
prop: 'suspensionState', |
||||||
|
slot: true, |
||||||
|
}, |
||||||
|
{ |
||||||
|
label: '部署时间', |
||||||
|
prop: 'deploymentTime', |
||||||
|
}, |
||||||
|
] |
||||||
|
}, |
||||||
|
data: [] |
||||||
|
}; |
||||||
|
}, |
||||||
|
computed: { |
||||||
|
...mapGetters(["permission"]), |
||||||
|
permissionList() { |
||||||
|
return { |
||||||
|
delBtn: this.vaildData(this.permission.flow_manager_remove, false), |
||||||
|
}; |
||||||
|
}, |
||||||
|
ids() { |
||||||
|
let ids = []; |
||||||
|
this.selectionList.forEach(ele => { |
||||||
|
ids.push(ele.id); |
||||||
|
}); |
||||||
|
return ids.join(","); |
||||||
|
}, |
||||||
|
deploymentIds() { |
||||||
|
let ids = []; |
||||||
|
this.selectionList.forEach(ele => { |
||||||
|
ids.push(ele.deploymentId); |
||||||
|
}); |
||||||
|
return ids.join(","); |
||||||
|
} |
||||||
|
}, |
||||||
|
methods: { |
||||||
|
searchReset() { |
||||||
|
this.onLoad(this.page); |
||||||
|
}, |
||||||
|
searchChange(params) { |
||||||
|
this.onLoad(this.page, params); |
||||||
|
}, |
||||||
|
selectionChange(list) { |
||||||
|
this.selectionList = list; |
||||||
|
}, |
||||||
|
handleDelete() { |
||||||
|
if (this.selectionList.length === 0) { |
||||||
|
this.$message.warning("请选择至少一条数据"); |
||||||
|
return; |
||||||
|
} |
||||||
|
this.$confirm("确定将选择数据删除?", { |
||||||
|
confirmButtonText: "确定", |
||||||
|
cancelButtonText: "取消", |
||||||
|
type: "warning" |
||||||
|
}) |
||||||
|
.then(() => { |
||||||
|
return deleteDeployment(this.deploymentIds); |
||||||
|
}) |
||||||
|
.then(() => { |
||||||
|
this.$message({ |
||||||
|
type: "success", |
||||||
|
message: "操作成功!" |
||||||
|
}); |
||||||
|
this.$refs.crud.toggleSelection(); |
||||||
|
this.onLoad(this.page); |
||||||
|
}); |
||||||
|
}, |
||||||
|
handleSlotDelete(row) { |
||||||
|
this.$confirm("确定将选择数据删除?", { |
||||||
|
confirmButtonText: "确定", |
||||||
|
cancelButtonText: "取消", |
||||||
|
type: "warning" |
||||||
|
}) |
||||||
|
.then(() => { |
||||||
|
return deleteDeployment(row.deploymentId); |
||||||
|
}) |
||||||
|
.then(() => { |
||||||
|
this.$message({ |
||||||
|
type: "success", |
||||||
|
message: "操作成功!" |
||||||
|
}); |
||||||
|
this.$refs.crud.toggleSelection(); |
||||||
|
this.onLoad(this.page); |
||||||
|
}); |
||||||
|
}, |
||||||
|
handleState(row) { |
||||||
|
this.stateBox = true; |
||||||
|
this.selectionId = row.id; |
||||||
|
}, |
||||||
|
handleDoState() { |
||||||
|
if (!this.flowState) { |
||||||
|
this.$message({ |
||||||
|
type: "warn", |
||||||
|
message: "请先选择流程状态!" |
||||||
|
}); |
||||||
|
return; |
||||||
|
} |
||||||
|
changeState({processId: this.selectionId, state: this.flowState}).then(res => { |
||||||
|
const data = res.data; |
||||||
|
if (data.success) { |
||||||
|
this.$message({ |
||||||
|
type: "success", |
||||||
|
message: data.msg |
||||||
|
}); |
||||||
|
this.stateBox = false; |
||||||
|
this.onLoad(this.page); |
||||||
|
} else { |
||||||
|
this.$message({ |
||||||
|
type: "warn", |
||||||
|
message: data.msg |
||||||
|
}); |
||||||
|
} |
||||||
|
}) |
||||||
|
}, |
||||||
|
handleImage(row) { |
||||||
|
this.flowUrl = `/api/blade-flow/process/resource-view?processDefinitionId=${row.id}`; |
||||||
|
this.flowBox = true; |
||||||
|
}, |
||||||
|
onLoad(page, params = {}) { |
||||||
|
managerList(page.currentPage, page.pageSize, params).then(res => { |
||||||
|
const data = res.data.data; |
||||||
|
this.page.total = data.total; |
||||||
|
this.data = data.records; |
||||||
|
}); |
||||||
|
} |
||||||
|
} |
||||||
|
}; |
||||||
|
</script> |
||||||
|
|
||||||
|
<style> |
||||||
|
</style> |
||||||
@ -0,0 +1,292 @@ |
|||||||
|
<template> |
||||||
|
<basic-container> |
||||||
|
<avue-crud :option="option" |
||||||
|
:data="data" |
||||||
|
ref="crud" |
||||||
|
v-model="form" |
||||||
|
:page="page" |
||||||
|
@search-change="searchChange" |
||||||
|
@search-reset="searchReset" |
||||||
|
@selection-change="selectionChange" |
||||||
|
@on-load="onLoad"> |
||||||
|
<template slot="menuLeft"> |
||||||
|
<el-button type="primary" |
||||||
|
size="small" |
||||||
|
icon="el-icon-circle-plus" |
||||||
|
v-if="permission.flow_model_create" |
||||||
|
plain |
||||||
|
@click="handleCreate">创 建 |
||||||
|
</el-button> |
||||||
|
<el-button type="danger" |
||||||
|
size="small" |
||||||
|
icon="el-icon-delete" |
||||||
|
v-if="permission.flow_model_delete" |
||||||
|
plain |
||||||
|
@click="handleDelete">删 除 |
||||||
|
</el-button> |
||||||
|
</template> |
||||||
|
<template slot-scope="scope" slot="menu"> |
||||||
|
<el-button type="text" |
||||||
|
size="small" |
||||||
|
v-if="permission.flow_model_update" |
||||||
|
plain |
||||||
|
@click.stop="handleUpdate(scope.row,scope.index)">配置 |
||||||
|
</el-button> |
||||||
|
<el-button type="text" |
||||||
|
size="small" |
||||||
|
v-if="permission.flow_model_deploy" |
||||||
|
plain |
||||||
|
@click.stop="handleDeploy(scope.row,scope.index)">部署 |
||||||
|
</el-button> |
||||||
|
<el-button type="text" |
||||||
|
size="small" |
||||||
|
v-if="permission.flow_model_download" |
||||||
|
plain |
||||||
|
@click.stop="handleDownload(scope.row,scope.index)">下载 |
||||||
|
</el-button> |
||||||
|
<el-button type="text" |
||||||
|
size="small" |
||||||
|
v-if="permission.flow_model_delete" |
||||||
|
plain |
||||||
|
@click.stop="handleSlotDelete(scope.row,scope.index)">删除 |
||||||
|
</el-button> |
||||||
|
</template> |
||||||
|
<template slot-scope="{row}" |
||||||
|
slot="version"> |
||||||
|
<el-tag>v{{row.version}}</el-tag> |
||||||
|
</template> |
||||||
|
</avue-crud> |
||||||
|
<el-dialog title="流程配置" |
||||||
|
:visible.sync="flowBox" |
||||||
|
fullscreen=true> |
||||||
|
<iframe |
||||||
|
:src=flowUrl |
||||||
|
width="100%" |
||||||
|
height="700" |
||||||
|
title="流程设计器" |
||||||
|
frameBorder="no" |
||||||
|
border="0" |
||||||
|
marginWidth="0" |
||||||
|
marginHeight="0" |
||||||
|
scrolling="no" |
||||||
|
allowTransparency="yes"> |
||||||
|
</iframe> |
||||||
|
<span slot="footer" |
||||||
|
class="dialog-footer"> |
||||||
|
<el-button @click="flowBox = false">取 消</el-button> |
||||||
|
<el-button type="primary" |
||||||
|
@click="handleRefresh">确 定</el-button> |
||||||
|
</span> |
||||||
|
</el-dialog> |
||||||
|
<el-dialog title="流程部署" |
||||||
|
:visible.sync="deployBox" |
||||||
|
width="20%"> |
||||||
|
<el-form :model="form" |
||||||
|
ref="form" |
||||||
|
label-width="80px"> |
||||||
|
<el-form-item label="流程类型"> |
||||||
|
<el-select v-model="categoryValue" placeholder="请选择" value=""> |
||||||
|
<el-option |
||||||
|
v-for="item in category" |
||||||
|
:key="item.dictKey" |
||||||
|
:label="item.dictValue" |
||||||
|
:value="item.dictKey"> |
||||||
|
</el-option> |
||||||
|
</el-select> |
||||||
|
</el-form-item> |
||||||
|
</el-form> |
||||||
|
<span slot="footer" |
||||||
|
class="dialog-footer"> |
||||||
|
<el-button @click="deployBox = false">取 消</el-button> |
||||||
|
<el-button type="primary" |
||||||
|
@click="handleDoDeploy">确 定</el-button> |
||||||
|
</span> |
||||||
|
</el-dialog> |
||||||
|
</basic-container> |
||||||
|
</template> |
||||||
|
|
||||||
|
<script> |
||||||
|
import {getDictionary} from "@/api/system/dict"; |
||||||
|
import {modelList, removeModel, deployModel} from "@/api/flow/flow"; |
||||||
|
import {mapGetters} from "vuex"; |
||||||
|
import website from '@/config/website'; |
||||||
|
|
||||||
|
export default { |
||||||
|
data() { |
||||||
|
return { |
||||||
|
form: {}, |
||||||
|
selectionId: '', |
||||||
|
selectionList: [], |
||||||
|
page: { |
||||||
|
pageSize: 10, |
||||||
|
currentPage: 1, |
||||||
|
total: 0 |
||||||
|
}, |
||||||
|
deployBox: false, |
||||||
|
flowBox: false, |
||||||
|
flowUrl: '', |
||||||
|
category: [], |
||||||
|
categoryValue: '', |
||||||
|
option: { |
||||||
|
tip: false, |
||||||
|
border: true, |
||||||
|
index: true, |
||||||
|
selection: true, |
||||||
|
editBtn: false, |
||||||
|
addBtn: false, |
||||||
|
viewBtn: false, |
||||||
|
delBtn: false, |
||||||
|
dialogWidth: 300, |
||||||
|
dialogHeight: 400, |
||||||
|
column: [ |
||||||
|
{ |
||||||
|
label: '模型主键', |
||||||
|
prop: 'id', |
||||||
|
}, |
||||||
|
{ |
||||||
|
label: '模型标识', |
||||||
|
prop: 'modelKey', |
||||||
|
search: true, |
||||||
|
}, |
||||||
|
{ |
||||||
|
label: '模型名称', |
||||||
|
prop: 'name', |
||||||
|
search: true, |
||||||
|
}, |
||||||
|
{ |
||||||
|
label: '流程版本', |
||||||
|
prop: 'version', |
||||||
|
slot: true, |
||||||
|
}, |
||||||
|
{ |
||||||
|
label: '创建时间', |
||||||
|
prop: 'created', |
||||||
|
}, |
||||||
|
{ |
||||||
|
label: '更新时间', |
||||||
|
prop: 'lastUpdated', |
||||||
|
}, |
||||||
|
] |
||||||
|
}, |
||||||
|
data: [] |
||||||
|
}; |
||||||
|
}, |
||||||
|
computed: { |
||||||
|
...mapGetters(["permission"]), |
||||||
|
ids() { |
||||||
|
let ids = []; |
||||||
|
this.selectionList.forEach(ele => { |
||||||
|
ids.push(ele.id); |
||||||
|
}); |
||||||
|
return ids.join(","); |
||||||
|
} |
||||||
|
}, |
||||||
|
methods: { |
||||||
|
searchReset() { |
||||||
|
this.onLoad(this.page); |
||||||
|
}, |
||||||
|
searchChange(params) { |
||||||
|
this.onLoad(this.page, params); |
||||||
|
}, |
||||||
|
selectionChange(list) { |
||||||
|
this.selectionList = list; |
||||||
|
}, |
||||||
|
handleDelete() { |
||||||
|
if (this.selectionList.length === 0) { |
||||||
|
this.$message.warning("请选择至少一条数据"); |
||||||
|
return; |
||||||
|
} |
||||||
|
this.$confirm("确定将选择数据删除?", { |
||||||
|
confirmButtonText: "确定", |
||||||
|
cancelButtonText: "取消", |
||||||
|
type: "warning" |
||||||
|
}) |
||||||
|
.then(() => { |
||||||
|
return removeModel(this.ids); |
||||||
|
}) |
||||||
|
.then(() => { |
||||||
|
this.$message({ |
||||||
|
type: "success", |
||||||
|
message: "操作成功!" |
||||||
|
}); |
||||||
|
this.$refs.crud.toggleSelection(); |
||||||
|
this.onLoad(this.page); |
||||||
|
}); |
||||||
|
}, |
||||||
|
handleCreate() { |
||||||
|
this.flowUrl = `${website.flowDesignUrl}/index.html`; |
||||||
|
this.flowBox = true; |
||||||
|
}, |
||||||
|
handleUpdate(row) { |
||||||
|
this.flowUrl = `${website.flowDesignUrl}/index.html#/editor/${row.id}`; |
||||||
|
this.flowBox = true; |
||||||
|
}, |
||||||
|
handleDeploy(row) { |
||||||
|
this.deployBox = true; |
||||||
|
this.selectionId = row.id; |
||||||
|
}, |
||||||
|
handleDoDeploy() { |
||||||
|
if (!this.categoryValue) { |
||||||
|
this.$message({ |
||||||
|
type: "warn", |
||||||
|
message: "请先选择流程类型!" |
||||||
|
}); |
||||||
|
return; |
||||||
|
} |
||||||
|
deployModel({ modelId: this.selectionId, category: `flow_${this.categoryValue}` }).then(res =>{ |
||||||
|
const data = res.data; |
||||||
|
if (data.success) { |
||||||
|
this.$message({ |
||||||
|
type: "success", |
||||||
|
message: data.msg |
||||||
|
}); |
||||||
|
this.deployBox = false; |
||||||
|
} else { |
||||||
|
this.$message({ |
||||||
|
type: "warn", |
||||||
|
message: data.msg |
||||||
|
}); |
||||||
|
} |
||||||
|
}) |
||||||
|
}, |
||||||
|
handleDownload(row) { |
||||||
|
window.open(`${website.flowDesignUrl}/app/rest/models/${row.id}/bpmn20`); |
||||||
|
}, |
||||||
|
handleSlotDelete(row) { |
||||||
|
this.$confirm("确定将选择数据删除?", { |
||||||
|
confirmButtonText: "确定", |
||||||
|
cancelButtonText: "取消", |
||||||
|
type: "warning" |
||||||
|
}) |
||||||
|
.then(() => { |
||||||
|
return removeModel(row.id); |
||||||
|
}) |
||||||
|
.then(() => { |
||||||
|
this.$message({ |
||||||
|
type: "success", |
||||||
|
message: "操作成功!" |
||||||
|
}); |
||||||
|
this.$refs.crud.toggleSelection(); |
||||||
|
this.onLoad(this.page); |
||||||
|
}); |
||||||
|
}, |
||||||
|
handleRefresh() { |
||||||
|
this.flowBox = false; |
||||||
|
this.onLoad(this.page); |
||||||
|
}, |
||||||
|
onLoad(page, params = {}) { |
||||||
|
modelList(page.currentPage, page.pageSize, params).then(res => { |
||||||
|
const data = res.data.data; |
||||||
|
this.page.total = data.total; |
||||||
|
this.data = data.records; |
||||||
|
}); |
||||||
|
getDictionary({code: 'flow'}).then(res => { |
||||||
|
this.category = res.data.data; |
||||||
|
}) |
||||||
|
} |
||||||
|
} |
||||||
|
}; |
||||||
|
</script> |
||||||
|
|
||||||
|
<style> |
||||||
|
</style> |
||||||
Loading…
Reference in new issue