hhyykk/ipms-sjy
1
1
Fork 0
mirror of https://gitee.com/hhyykk/ipms-sjy.git synced 2025-07-14 11:05:06 +08:00
Code Issues Actions Packages Projects Releases Wiki Activity

完善工作流模型。工作流定义

Browse Source
This commit is contained in:
yunlong.li
2021-11-19 16:08:01 +08:00
parent bab046f10c
commit f958137dd1
20 changed files with 445 additions and 79 deletions
Download Patch File Download Diff File Expand all files Collapse all files

17
yudao-admin-ui/src/api/bpm/processDefinition.js Normal file
View File

@ -0,0 +1,17 @@
import request from '@/utils/request'
export function page(query) {
return request({
url: '/workflow/process/definition/page',
method: 'get',
params: query
})
}
export function exportProcessDefinition(query) {
return request({
url: '/workflow/process/definition/export?processDefinitionId='+query.id,
method: 'get'
})
}

38
yudao-admin-ui/src/components/bpmn/VueBpmn.vue
View File

@ -1,5 +1,5 @@
<template>
<div class="">
<div class="bpmnclass">
<ImportDialog :dialogVisibleBool="importXmlShow" @closeShowXmlDialog="closeShowXmlDialog"></ImportDialog>
<el-row>
<el-col :span="24">
@ -28,25 +28,25 @@
</template>
<script>
import templateXml from "./data/template";
import ImportDialog from "./dialog/ImportDialog";
// import activitiCom from "../provider/activiti";
// import BpmnModeler2 from 'bpmn-js/lib/Modeler';
import BpmnModeler from 'jeeplus-bpmn/lib/Modeler'
import customTranslate from "./data/translate/customTranslate";
import VueHeader from "./Header";
import BpmnPanel from "./panel/index";
import activitiModule from './data/activiti.json'
import flowableModule from './data/flowable.json'
import './assets/css/vue-bmpn.css'
import './assets/css/font-awesome.min.css'
import templateXml from "./data/template";
import ImportDialog from "./dialog/ImportDialog";
// import activitiCom from "../provider/activiti";
// import BpmnModeler2 from 'bpmn-js/lib/Modeler';
import BpmnModeler from 'jeeplus-bpmn/lib/Modeler'
import customTranslate from "./data/translate/customTranslate";
import VueHeader from "./Header";
import BpmnPanel from "./panel/index";
import activitiModule from './data/activiti.json'
import flowableModule from './data/flowable.json'
import './assets/css/vue-bmpn.css'
import './assets/css/font-awesome.min.css'
import 'bpmn-js/dist/assets/diagram-js.css'
import 'bpmn-js/dist/assets/bpmn-font/css/bpmn.css'
import 'bpmn-js/dist/assets/bpmn-font/css/bpmn-codes.css'
import 'bpmn-js/dist/assets/bpmn-font/css/bpmn-embedded.css'
import './assets/css/vue-bmpn.css'
export default {
import 'bpmn-js/dist/assets/diagram-js.css'
import 'bpmn-js/dist/assets/bpmn-font/css/bpmn.css'
import 'bpmn-js/dist/assets/bpmn-font/css/bpmn-codes.css'
import 'bpmn-js/dist/assets/bpmn-font/css/bpmn-embedded.css'
export default {
name: "VueBpmn",
data() {
return {

18
yudao-admin-ui/src/components/bpmn/assets/css/vue-bmpn.css
View File

@ -31,25 +31,25 @@
.el-collapse-item__header{
padding-left: 15px;
}
.djs-direct-editing-parent{
.bpmnclass .djs-direct-editing-parent{
/*display: none;*/
}
.bpmn-panel {
.bpmnclass .bpmn-panel {
/*width: 370px;*/
border: 1px solid #eeeeee;
padding: 0 5px;
}
.el-select--small{
.bpmnclass .el-select--small{
width: 100%;
}
.el-dialog > .el-dialog__header{
padding: 5px 20px ;
.bpmnclass > .is-fullscreen > .el-dialog__header:first-of-type{
padding: 0 ;
}
.el-dialog > .el-dialog__body{
.bpmnclass .el-dialog > .el-dialog__body{
padding: 0px;
margin: 0 20px;
border: 1px solid #cccccc;
margin: 0 ;
/*border: 1px solid #cccccc;*/
}
.default-undo{
.bpmnclass .default-undo{
color: #c0c4cc;
}

6
yudao-admin-ui/src/components/bpmn/dialog/ImportDialog.vue
View File

@ -67,7 +67,5 @@ export default {
</script>
<style scoped>
/deep/.el-dialog > .el-dialog__header{
padding: 24px 20px
}
</style>
</style>

21
yudao-admin-ui/src/components/bpmn/panel/NodePropertyPanel.vue
View File

@ -129,7 +129,8 @@
<script>
import EventListenerDialog from "./dialog/EventListenerDialog"
import UserSelectDialog from "./dialog/UserSelectDialog"
export default {
export default {
name: "NodePropertyPanel",
data() {
return {
@ -269,32 +270,32 @@ import UserSelectDialog from "./dialog/UserSelectDialog"
</script>
<style scoped>
.title span{
.bpmnclass .title span{
font-weight: bold;
margin-left: 5px;
}
/deep/.el-select .el-input .el-select__caret{
.bpmnclass .el-select .el-input .el-select__caret{
margin-top: 5px;
}
/deep/.el-input__icon{
.bpmnclass .el-input__icon{
height: 20px !important;
line-height: 20px !important;
}
/deep/.el-input-group__append{
.bpmnclass .el-input-group__append{
padding: 0 5px !important;
}
.icon-div{
.bpmnclass .icon-div{
font-size: 1.2em;
font-weight: bold !important;
width: 100%;
}
.icon-div i{
.bpmnclass .icon-div i{
padding: 5px;
}
.icon-div i:hover{
.bpmnclass .icon-div i:hover{
cursor:pointer;
}
.ant-divider-vertical {
.bpmnclass .ant-divider-vertical {
position: relative;
top: -0.08em;
display: inline-block;
@ -303,7 +304,7 @@ import UserSelectDialog from "./dialog/UserSelectDialog"
/*margin: 0 8px;*/
vertical-align: middle;
}
.ant-divider {
.bpmnclass .ant-divider {
box-sizing: border-box;
margin: 0;
padding: 0;

9
yudao-admin-ui/src/components/bpmn/panel/ProcessPropertyPanel.vue
View File

@ -95,9 +95,10 @@
</template>
<script>
import GlobalEventListenerDialog from "./dialog/GlobalEventListenerDialog"
import EventListenerDialog from "./dialog/EventListenerDialog"
export default {
import GlobalEventListenerDialog from "./dialog/GlobalEventListenerDialog"
import EventListenerDialog from "./dialog/EventListenerDialog"
export default {
name: "ProcessProperty",
data() {
return {
@ -232,7 +233,7 @@
</script>
<style scoped>
.title span{
.bpmnclass .title span{
font-weight: bold;
margin-left: 5px;
}

6
yudao-admin-ui/src/components/bpmn/panel/StartEventNodePropertyPanel.vue
View File

@ -67,8 +67,8 @@
<script>
import EventListenerDialog from "./dialog/EventListenerDialog"
import GlobalEventListenerDialog from "./dialog/GlobalEventListenerDialog";
export default {
export default {
name: "NodePropertyPanel",
data() {
return {
@ -233,7 +233,7 @@ import GlobalEventListenerDialog from "./dialog/GlobalEventListenerDialog";
</script>
<style scoped>
.title span{
.bpmnclass .title span{
font-weight: bold;
margin-left: 5px;
}

4
yudao-admin-ui/src/components/bpmn/panel/dialog/EventListenerDialog.vue
View File

@ -115,7 +115,5 @@ export default {
</script>
<style scoped>
/deep/.el-dialog > .el-dialog__header{
padding: 24px 20px
}
</style>

4
yudao-admin-ui/src/components/bpmn/panel/dialog/GlobalEventListenerDialog.vue
View File

@ -111,7 +111,5 @@ export default {
</script>
<style scoped>
/deep/.el-dialog > .el-dialog__header{
padding: 24px 20px
}
</style>

6
yudao-admin-ui/src/components/bpmn/panel/dialog/UserSelectDialog.vue
View File

@ -167,7 +167,5 @@ export default {
</script>
<style scoped>
/deep/.el-dialog > .el-dialog__header{
padding: 24px 20px
}
</style>
</style>

19
yudao-admin-ui/src/router/index.js
View File

@ -1,11 +1,9 @@
import Vue from 'vue'
import Router from 'vue-router'
Vue.use(Router)
/* Layout */
import Layout from '@/layout'
import ParentView from '@/components/ParentView';
Vue.use(Router)
/**
* Note: 路由配置项
@ -98,19 +96,6 @@ export const constantRoutes = [
}
]
},
{
path: '/bpmn',
component: Layout,
hidden: true,
children: [
{
path: 'model',
component: (resolve) => require(['@/views/bpm/model'], resolve),
name: 'model',
meta: { title: '工作流模型', icon: '' }
}
]
},
{
path: '/job',
component: Layout,

7
yudao-admin-ui/src/views/bpm/model/index.vue
View File

@ -50,14 +50,14 @@
<pagination v-show="total>0" :total="total" :page.sync="queryParams.pageNo" :limit.sync="queryParams.pageSize"
@pagination="getList"/>
<el-dialog :visible.sync="showBpmnBool" :before-close="close" :fullscreen="true">
<el-dialog class="bpmnclass dialogClass" :visible.sync="showBpmnBool" :before-close="close" :fullscreen="true">
<vue-bpmn v-if="showBpmnBool" product="activiti" @processSave="processSave" :bpmnXml="bpmnXML" :bpmnData="bpmnData" @beforeClose="close"></vue-bpmn>
</el-dialog>
</div>
</template>
<script>
import { page, exportBpmnXml, modelUpdate, modelSave, modelDelete, modelDeploy } from "@/api/bpm/model";
import {exportBpmnXml, modelDelete, modelDeploy, modelSave, modelUpdate, page} from "@/api/bpm/model";
import VueBpmn from "@/components/bpmn/VueBpmn";
export default {
@ -202,5 +202,8 @@ export default {
.v-modal{
z-index: 2000!important;
}
.dialogClass{
padding: 0 ;
}
</style>

198
yudao-admin-ui/src/views/bpm/processDefinition/index.vue Normal file
View File

@ -0,0 +1,198 @@
<template>
<div class="app-container">
<el-form :model="queryParams" ref="queryForm" :inline="true" v-show="showSearch" label-width="68px">
<el-form-item label="模型名字" prop="name">
<el-input v-model="queryParams.name" placeholder="请输入模型名字" clearable style="width: 240px;" size="small"
@keyup.enter.native="handleQuery"/>
</el-form-item>
<el-form-item>
<el-button type="cyan" icon="el-icon-search" size="mini" @click="handleQuery">搜索</el-button>
<el-button icon="el-icon-refresh" size="mini" @click="resetQuery">重置</el-button>
</el-form-item>
</el-form>
<el-row :gutter="10" class="mb8">
<el-col :span="1.5">
<el-button
type="primary"
icon="el-icon-plus"
size="mini"
@click="openBpmn"
v-hasPermi="['infra:config:create']"
>新建流程</el-button>
</el-col>
<right-toolbar :showSearch.sync="showSearch" @queryTable="getList"></right-toolbar>
</el-row>
<el-table v-loading="loading" :data="list">
<el-table-column label="ID" align="center" prop="id" />
<el-table-column label="流程名字" align="center" prop="name" />
<!-- <el-table-column label="创建时间" align="center" prop="createTime" >-->
<!-- <template slot-scope="scope">-->
<!-- <span>{{ parseTime(scope.row.createTime) }}</span>-->
<!-- </template>-->
<!-- </el-table-column>-->
<el-table-column label="操作" align="center" >
<template slot-scope="scope">
<!-- <el-button size="mini" type="text" icon="el-icon-setting" @click="change(scope.row)">设计流程</el-button>-->
<!-- <el-button size="mini" type="text" icon="el-icon-delete" @click="modelDelete(scope.row)">删除</el-button>-->
<!-- <el-button size="mini" type="text" icon="el-icon-thumb" @click="modelDeploy(scope.row)">发布</el-button>-->
</template>
</el-table-column>
</el-table>
<pagination v-show="total>0" :total="total" :page.sync="queryParams.pageNo" :limit.sync="queryParams.pageSize"
@pagination="getList"/>
<el-dialog :visible.sync="showBpmnBool" :before-close="close" :fullscreen="true">
<vue-bpmn v-if="showBpmnBool" product="activiti" @processSave="processSave" :bpmnXml="bpmnXML" :bpmnData="bpmnData" @beforeClose="close"></vue-bpmn>
</el-dialog>
</div>
</template>
<script>
import {page} from "@/api/bpm/processDefinition";
import VueBpmn from "@/components/bpmn/VueBpmn";
export default {
name: "processDefinition",
data() {
return {
// 遮罩层
loading: true,
// 显示搜索条件
showSearch: true,
showBpmnBool: false,
// 总条数
total: 0,
// 表格数据
list: [],
bpmnXML: null,
bpmnData: {},
// 查询参数
queryParams: {
pageNo: 1,
pageSize: 10
}
};
},
components: {VueBpmn},
created() {
this.getList();
},
methods: {
/** 查询登录日志列表 */
getList() {
this.loading = true;
page(this.queryParams).then(response => {
this.list = response.data.list;
this.total = response.data.total;
this.loading = false;
}
);
},
// 登录状态字典翻译
statusFormat(row, column) {
return this.selectDictLabel(this.statusOptions, row.status);
},
/** 搜索按钮操作 */
handleQuery() {
this.queryParams.pageNo = 1;
this.getList();
},
/** 重置按钮操作 */
resetQuery() {
this.dateRange = [];
this.resetForm("queryForm");
this.handleQuery();
},
processSave(data) {
const that = this;
// 如果存在id 说明是修改
if (data.id) {
let postData = JSON.parse(data.metaInfo)
postData.bpmnXml = data.bpmnXml
postData.id = data.id
postData.name = data.name
postData.key = data.key
postData.description = data.description
modelUpdate(postData).then(response => {
this.msgSuccess("保存成功");
})
this.showBpmnBool = false
this.getList();
return
}
modelSave(data).then(response => {
that.bpmnData.id = response.data
this.msgSuccess("保存成功");
})
this.showBpmnBool = false
this.getList();
},
openBpmn() {
this.bpmnData = {}
this.bpmnXML = ""
this.showBpmnBool = true
},
close() {
this.showBpmnBool = false
this.getList();
},
change(row) {
const that = this;
this.bpmnXML = ""
this.bpmnData = {}
exportBpmnXml({
modelId: row.id
}).then(response => {
that.bpmnXML = response
that.bpmnData = row
that.showBpmnBool = true
})
},
modelDelete(row) {
const that = this;
this.$confirm('是否删除该流程！！', "警告", {
confirmButtonText: "确定",
cancelButtonText: "取消",
type: "warning"
}).then(function() {
modelDelete({
modelId: row.id
}).then(response => {
that.getList();
that.msgSuccess("删除成功");
})
})
},
modelDeploy(row) {
const that = this;
this.$confirm('是否部署该流程！！', "提示", {
confirmButtonText: "确定",
cancelButtonText: "取消",
type: "success"
}).then(function() {
modelDeploy({
modelId: row.id
}).then(response => {
that.getList();
that.msgSuccess("部署成功");
})
})
}
}
};
</script>
<style>
.el-dialog > .el-dialog__body{
margin: 0;
border: 0;
}
.bpmn-viewer-header{
background: white;
}
.v-modal{
z-index: 2000!important;
}
</style>