Web/admin-sjzx
5
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

联调流程定义 流程图

Browse Source
This commit is contained in:
GGJ
2024-04-17 09:44:50 +08:00
parent ecb649dc47
commit 38e88f0ff5
11 changed files with 314 additions and 263 deletions
Download Patch File Download Diff File Expand all files Collapse all files

1
package.json
View File

@@ -33,6 +33,7 @@
"lodash-es": "^4.17.21",
"luckyexcel": "^1.0.1",
"luckysheet": "^2.1.13",
"min-dash": "^4.2.1",
"mitt": "^3.0.1",
"nprogress": "^0.2.0",
"pinia": "^2.1.7",

7
pnpm-lock.yaml generated
View File

@@ -77,6 +77,9 @@ dependencies:
luckysheet:
specifier: ^2.1.13
version: 2.1.13
min-dash:
specifier: ^4.2.1
version: 4.2.1
mitt:
specifier: ^3.0.1
version: 3.0.1
@@ -2774,6 +2777,10 @@ packages:
resolution: {integrity: sha512-evumdlmIlg9mbRVPbC4F5FuRhNmcMS5pvuBUbqb1G9v09Ro0ImPEgz5n3khir83lFok1inKqVDjnKEg3GpDxQg==}
dev: false
/min-dash@4.2.1:
resolution: {integrity: sha512-to+unsToePnm7cUeR9TrMzFlETHd/UXmU+ELTRfWZj5XGT41KF6X3L233o3E/GdEs3sk2Tbw/lOLD1avmWkg8A==}
dev: false
/min-dom@0.2.0:
resolution: {integrity: sha512-VmxugbnAcVZGqvepjhOA4d4apmrpX8mMaRS+/jo0dI5Yorzrr4Ru9zc9KVALlY/+XakVCb8iQ+PYXljihQcsNw==}
dependencies:

16
src/api/process-boot/bpm.ts
View File

@@ -30,15 +30,15 @@ export function getRouteMenu() {
}
export const getModelPage = async (params: any) => {
return await createAxios({ url: '/bpm/model/page', params, method: 'get' })
return await createAxios({ url: '/process-boot/bpm/model/page', params, method: 'get' })
}
export const getModel = async (id: number) => {
return await createAxios({ url: '/bpm/model/get?id=' + id, method: 'get' })
return await createAxios({ url: '/process-boot/bpm/model/get?id=' + id, method: 'get' })
}
export const updateModel = async (data: any) => {
return await createAxios({ url: '/bpm/model/update', method: 'put', data: data })
return await createAxios({ url: '/process-boot/bpm/model/update', method: 'put', data: data })
}
// 任务状态修改
@@ -47,19 +47,19 @@ export const updateModelState = async (id: number, state: number) => {
id: id,
state: state
}
return await createAxios({ url: '/bpm/model/update-state', method: 'put', data: data })
return await createAxios({ url: '/process-boot/bpm/model/update-state', method: 'put', data: data })
}
export const createModel = async data => {
return await createAxios({ url: '/bpm/model/create', method: 'POST', data: data })
export const save = async data => {
return await createAxios({ url: '/process-boot/flowable/definition/save', method: 'POST', data: data })
}
export const deleteModel = async (id: number) => {
return await createAxios({ url: '/bpm/model/delete?id=' + id, method: 'DELETE' })
return await createAxios({ url: '/process-boot/bpm/model/delete?id=' + id, method: 'DELETE' })
}
export const deployModel = async (id: number) => {
return await createAxios({ url: '/bpm/model/deploy?id=' + id, method: 'POST' })
return await createAxios({ url: '/process-boot/bpm/model/deploy?id=' + id, method: 'POST' })
}
export const readXml = async (id: number) => {
return await createAxios({ url: 'process-boot/flowable/definition/readXml?deployId=' + id, method: 'GET' })

106
src/components/bpmnProcessDesigner/package/designer/ProcessDesigner.vue
View File

@@ -19,21 +19,6 @@
</template>
<el-button icon="el-icon-Download">下载文件</el-button>
</el-tooltip>
<el-tooltip effect="light">
<el-button icon="el-icon-View">浏览</el-button>
<template #content>
<el-button link @click="previewProcessXML">预览XML</el-button>
<br />
<el-button link @click="previewProcessJson">预览JSON</el-button>
</template>
</el-tooltip>
<!-- <el-tooltip
v-if="props.simulation"
effect="light"
:content="simulationStatus ? '退出模拟' : '开启模拟'"
>
<el-button icon="el-icon-Cpu" @click="processSimulation">模拟</el-button>
</el-tooltip> -->
</ElButtonGroup>
<ElButtonGroup key="align-control">
<el-tooltip effect="light" content="向左对齐">
@@ -81,7 +66,7 @@
<el-button
icon="el-icon-Plus"
title="保存模型"
@click="processSave"
@click="preservation"
:type="props.headerButtonType"
:disabled="simulationStatus"
>
@@ -109,13 +94,25 @@
<!-- <div id="js-properties-panel" class="panel"></div> -->
<!-- <div class="my-process-designer__canvas" ref="bpmn-canvas"></div> -->
</div>
<!-- <Dialog title="预览" v-model="previewModelVisible" width="80%" :scroll="true" max-height="600px">
<div v-highlight>
<code class="hljs">
{{ previewResult }}
</code>
<el-dialog title="保存流程" v-model="previewModelVisible" width="500px" :scroll="true" max-height="600px">
<el-form ref="ruleFormRef" :model="form" :rules="rules" label-width="auto">
<el-form-item label="流程名称" prop="name">
<el-input v-model="form.name" placeholder="请输入流程名称" />
</el-form-item>
<el-form-item label="流程分类" prop="category">
<el-select v-model="form.category" placeholder="请输入流程流程名分类">
<el-option v-for="item in options" :key="item.id" :label="item.name" :value="item.id" />
</el-select>
</el-form-item>
</el-form>
<template #footer>
<div class="dialog-footer">
<el-button @click="previewModelVisible = false">取消</el-button>
<el-button type="primary" @click="processSave">保存</el-button>
</div>
</Dialog> -->
</template>
</el-dialog>
</div>
</template>
@@ -238,9 +235,28 @@ const defaultZoom = ref(1)
const previewModelVisible = ref(false)
const simulationStatus = ref(false)
const previewResult = ref('')
const ruleFormRef = ref()
const previewType = ref('xml')
const recoverable = ref(false)
const revocable = ref(false)
const rules = {
name: [{ required: true, message: '请输入流程名称', trigger: 'blur' }],
category: [{ required: true, message: '请输入流程分类', trigger: 'blur' }]
}
const options = [
{
name: '默认分类',
id: '默认分类'
},
{
name: '业务分类',
id: '业务分类'
}
]
const form = ref({
name: '',
category: ''
})
const additionalModules = computed(() => {
console.log(props.additionalModel, 'additionalModel')
const Modules: any[] = []
@@ -543,48 +559,16 @@ const elementsAlign = align => {
Align.trigger(SelectedElements, align)
})
}
/*----------------------------- 方法结束 ---------------------------------*/
const previewProcessXML = () => {
console.log(bpmnModeler.saveXML, 'bpmnModeler')
bpmnModeler.saveXML({ format: true }).then(({ xml }) => {
// console.log(xml, 'xml111111')
previewResult.value = xml
previewType.value = 'xml'
// 保存
const preservation = () => {
previewModelVisible.value = true
})
}
const previewProcessJson = () => {
bpmnModeler.saveXML({ format: true }).then(({ xml }) => {
// console.log(xml, 'xml')
// const rootNode = parseXmlString(xml)
// console.log(rootNode, 'rootNoderootNode')
const rootNodes = new XmlNode(XmlNodeType.Root, parseXmlString(xml))
// console.log(rootNodes, 'rootNodesrootNodesrootNodes')
// console.log(rootNodes.parent.toJsObject(), 'rootNodes.toJSON()')
// console.log(JSON.stringify(rootNodes.parent.toJsObject()), 'rootNodes.toJSON()')
// console.log(JSON.stringify(rootNodes.parent.toJSON()), 'rootNodes.toJSON()')
// const parser = new xml2js.XMLParser()
// let jObj = parser.parse(xml)
// console.log(jObj, 'jObjjObjjObjjObjjObj')
// const builder = new xml2js.XMLBuilder(xml)
// const xmlContent = builder
// console.log(xmlContent, 'xmlContent')
// console.log(xml2js, 'convertconvertconvert')
previewResult.value = rootNodes.parent?.toJSON() as unknown as string
// previewResult.value = jObj
// previewResult.value = convert.xml2json(xml, {explicitArray : false},{ spaces: 2 })
previewType.value = 'json'
previewModelVisible.value = true
})
}
/* ------------------------------------------------ 芋道源码 methods ------------------------------------------------------ */
const processSave = async () => {
// console.log(bpmnModeler, 'bpmnModelerbpmnModelerbpmnModelerbpmnModeler')
ruleFormRef.value.validate(async valid => {
if (valid) {
const { err, xml } = await bpmnModeler.saveXML()
// console.log(err, 'errerrerrerrerr')
// console.log(xml, 'xmlxmlxmlxmlxml')
// 读取异常时抛出异常
if (err) {
// this.$modal.msgError('保存模型失败，请重试！')
@@ -592,7 +576,9 @@ const processSave = async () => {
return
}
// 触发 save 事件
emit('save', xml)
emit('save', xml, form.value)
}
})
}
/** 高亮显示 */
// const highlightedCode = (previewType, previewResult) => {

41
src/components/bpmnProcessDesigner/package/penal/base/ElementBaseInfo.vue
View File

@@ -2,22 +2,14 @@
<div class="panel-tab__content">
<el-form label-width="90px" :model="needProps" :rules="rules">
<div v-if="needProps.type == 'bpmn:Process'">
<!-- <el-form-item label="流程标识" prop="id">
<el-form-item label="流程标识" prop="id">
<el-input
v-model="needProps.id"
placeholder="请输入流标标识"
:disabled="needProps.id !== undefined && needProps.id.length > 0"
placeholder="请输入流标标识"
@change="handleKeyUpdate"
/>
</el-form-item>
<el-form-item label="流程名称" prop="name">
<el-input
v-model="needProps.name"
placeholder="请输入流程名称"
clearable
@change="handleNameUpdate"
/>
</el-form-item> -->
</div>
<div v-else>
<el-form-item label="ID">
@@ -27,14 +19,18 @@
<el-input v-model="elementBaseInfo.name" clearable @change="updateBaseInfo('name')" />
</el-form-item>
<el-form-item label="描述">
<el-input v-model="elementBaseInfo.documentation" clearable @change="updateBaseInfo('documentation')" />
<el-input
v-model="elementBaseInfo.documentation"
clearable
@change="updateBaseInfo('documentation')"
/>
</el-form-item>
</div>
</el-form>
</div>
</template>
<script lang="ts" setup>
import { onMounted, reactive, ref, watch, onBeforeUnmount,toRaw } from 'vue'
import { onMounted, reactive, ref, watch, onBeforeUnmount, toRaw } from 'vue'
defineOptions({ name: 'ElementBaseInfo' })
const props = defineProps({
@@ -50,6 +46,7 @@ const props = defineProps({
const needProps = ref<any>({})
const bpmnElement = ref()
const elementBaseInfo = ref<any>({})
// 流程表单的下拉框的数据
// const forms = ref([])
// 流程模型的校验
@@ -72,7 +69,7 @@ const resetBaseInfo = () => {
// elementBaseInfo.value = JSON.parse(JSON.stringify(bpmnElement.value.businessObject))
// console.log(elementBaseInfo.value, 'elementBaseInfo22222222222')
}
const handleKeyUpdate = (value) => {
const handleKeyUpdate = value => {
// 校验 value 的值，只有 XML NCName 通过的情况下，才进行赋值。否则，会导致流程图报错，无法绘制的问题
if (!value) {
return
@@ -90,7 +87,7 @@ const handleKeyUpdate = (value) => {
updateBaseInfo('id')
}, 100)
}
const handleNameUpdate = (value) => {
const handleNameUpdate = value => {
console.log(elementBaseInfo, 'elementBaseInfo')
if (!value) {
return
@@ -101,12 +98,22 @@ const handleNameUpdate = (value) => {
updateBaseInfo('name')
}, 100)
}
const handleClassifyUpdate = value => {
if (!value) {
return
}
elementBaseInfo.value['processCategory'] = value
setTimeout(() => {
updateBaseInfo('processCategory')
}, 100)
}
// const handleDescriptionUpdate=(value)=> {
// TODO 芋艿：documentation 暂时无法修改，后续在看看
// this.elementBaseInfo['documentation'] = value;
// this.updateBaseInfo('documentation');
// }
const updateBaseInfo = (key) => {
const updateBaseInfo = key => {
console.log(key, 'key')
// 触发 elementBaseInfo 对应的字段
const attrObj = Object.create(null)
@@ -137,7 +144,7 @@ const updateBaseInfo = (key) => {
watch(
() => props.businessObject,
(val) => {
val => {
// console.log(val, 'val11111111111111111111')
if (val) {
// nextTick(() => {
@@ -149,7 +156,7 @@ watch(
watch(
() => props.model?.key,
(val) => {
val => {
// 针对上传的 bpmn 流程图时，保证 key 和 name 的更新
if (val) {
handleKeyUpdate(props.model.key)

46
src/views/pqs/process/definition/allocation.vue Normal file
View File

@@ -0,0 +1,46 @@
<template>
<el-dialog v-model="dialogVisible" title="挂载表单" width="700" :before-close="handleClose">
<vxe-table v-bind="defaultAttribute" ref="vxeRef" height="400" :data="equipmentList">
<vxe-column field="formId" title="序号"></vxe-column>
<vxe-column field="formName" title="功能名称"></vxe-column>
<vxe-column title="操作">
<template #default="{ row }">
<el-button type="primary" size="small" link @click="mount(row)">挂载</el-button>
</template>
</vxe-column>
</vxe-table>
<template #footer>
<div class="dialog-footer">
<el-button type="primary">确定</el-button>
<el-button @click="handleClose">取消</el-button>
</div>
</template>
</el-dialog>
</template>
<script setup lang="ts">
import { ref, reactive } from 'vue'
import { defaultAttribute } from '@/components/table/defaultAttribute'
const dialogVisible = ref(false)
const List = ref({})
const equipmentList = ref([
{ formId: '1', formName: '谐波普测计划' },
{ formId: '2', formName: '干扰源用户管理' },
{ formId: '3', formName: '电能质量问题管理' }
])
const handleClose = () => {
dialogVisible.value = false
}
// 挂载
const mount = (row: any) => {
}
const open = (row: any) => {
dialogVisible.value = true
List.value = row
}
defineExpose({ open })
</script>
<style lang="scss" scoped></style>

22
src/views/pqs/process/definition/editor/index.vue
View File

@@ -61,42 +61,38 @@ const initModeler = item => {
}
/** 添加/修改模型 */
const save = async bpmnXml => {
const save = async (bpmnXml: any, form: any) => {
const data = {
// name
// flowableXml
// category
...model.value,
flowableXml: bpmnXml, // bpmnXml 只是初始化流程图，后续修改无法通过它获得
category: '',
name: ''
category: form.category,
name: form.name
} as unknown as ModelApi.ModelVO
// 提交
if (data.id) {
await ModelApi.updateModel(data)
ElMessage.success('修改成功')
} else {
await ModelApi.createModel(data)
await ModelApi.save(data)
ElMessage.success('新增成功')
}
// 跳转回去
close()
emit('quit')
}
/** 关闭按钮 */
const close = () => {}
const randomStr = () => {
return Math.random().toString(36).slice(-8)
}
/** 初始化 */
onMounted(async () => {
const data: any = {}
if (prop.model?.deploymentId === undefined) {
if (!data.bpmnXml) {
// 首次创建的 Model 模型，它是没有 bpmnXml，此时需要给它一个默认的
data.key = Math.random().toString(36).slice(-8)
console.log('🚀 ~ onMounted ~ data.key:', data.key)
data.bpmnXml = ` <?xml version="1.0" encoding="UTF-8"?>
<definitions xmlns="http://www.omg.org/spec/BPMN/20100524/MODEL" xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance" xmlns:bpmndi="http://www.omg.org/spec/BPMN/20100524/DI" xmlns:xsd="http://www.w3.org/2001/XMLSchema" targetNamespace="http://www.activiti.org/processdef">
<process id="${data.key}" name="${data.name}" />
<process id="flow_${data.key}" name="${data.name || ''}" />
<bpmndi:BPMNDiagram id="BPMNDiagram">
<bpmndi:BPMNPlane id="${data.key}_di" bpmnElement="${data.key}" />
</bpmndi:BPMNDiagram>
@@ -110,11 +106,13 @@ onMounted(async () => {
}
// 查询模型
setTimeout(() => {
model.value = {
...data,
bpmnXml: undefined // 清空 bpmnXml 属性
}
xmlString.value = data.bpmnXml
}, 0)
})
</script>
<style lang="scss">

19
src/views/pqs/process/definition/index.vue
View File

@@ -17,7 +17,10 @@
<Table ref="tableRef"></Table>
</div>
<!-- 设计流程 -->
<editor v-if="!addedShow" :model="model" @quit="addedShow = true"/>
<editor v-if="!addedShow" :model="model" @quit="quit" />
<!-- 配置表单 -->
<Allocation ref="allocationRef" />
</div>
</template>
@@ -25,15 +28,17 @@
import TableStore from '@/utils/tableStore'
import Table from '@/components/table/index.vue'
import TableHeader from '@/components/table/header/index.vue'
import Allocation from './allocation.vue'
import { onMounted, provide, ref } from 'vue'
import editor from './editor/index.vue';
import editor from './editor/index.vue'
defineOptions({
name: 'harmonic-boot/reate/word'
name: '/flowable/definition/index'
})
const tableRef = ref()
const allocationRef = ref()
const model = ref({})
const addedShow = ref(true)
@@ -99,7 +104,9 @@ const tableStore = new TableStore({
type: 'primary',
icon: 'el-icon-Plus',
render: 'basicButton',
click: async row => {}
click: async row => {
allocationRef.value.open(row)
}
},
{
name: 'edit',
@@ -150,6 +157,10 @@ onMounted(() => {
// 加载数据
tableStore.index()
})
const quit = () => {
addedShow.value = true
tableStore.index()
}
tableStore.table.params.name = ''
provide('tableStore', tableStore)
</script>

26
src/views/pqs/supervise/retire/components/equipment.vue Normal file
View File

@@ -0,0 +1,26 @@
<template>
<el-dialog v-model="dialogVisible" :title="title" width="500" :before-close="handleClose">
<span>111</span>
<template #footer>
<div class="dialog-footer">
<el-button type="primary">确定</el-button>
<el-button @click="handleClose">取消</el-button>
</div>
</template>
</el-dialog>
</template>
<script setup lang="ts">
import { ref, reactive } from 'vue'
const dialogVisible = ref(false)
const title = ref('')
const handleClose = (done: () => void) => {
dialogVisible.value = false
}
const open = (text: string) => {
title.value = text
dialogVisible.value = true
}
defineExpose({ open })
</script>
<style lang="scss" scoped></style>

58
src/views/pqs/supervise/retire/index.vue
View File

@@ -29,23 +29,21 @@
</TableHeader>
<Table ref="tableRef" />
</div>
<!-- 新增编辑 -->
<Equipment ref="EquipmentRef" />
</template>
<script setup lang="ts">
import { ref, onMounted, provide, nextTick } from 'vue'
import TableStore from '@/utils/tableStore'
import Table from '@/components/table/index.vue'
import TableHeader from '@/components/table/header/index.vue'
import Equipment from './components/equipment.vue'
import { ElMessage, ElMessageBox } from 'element-plus'
import { deleteIssues, archive } from '@/api/process-boot/electricitymanagement'
import { deleteIssues } from '@/api/process-boot/electricitymanagement'
import { useDictData } from '@/stores/dictData'
const dictData = useDictData()
const FillingRef = ref()
const showNewlyAdded = ref(false)
const dialogVisible = ref(false)
const recordingRef = ref(false)
const TableHeaderRef = ref()
const detailRef = ref()
const EquipmentRef = ref()
const problemData = dictData.getBasicData('Problem_Sources')
const fillingProgress = dictData.getBasicData('Fill_Progress')
const auditStatus = dictData.getBasicData('Audit_Status')
@@ -101,9 +99,7 @@ const tableStore: any = new TableStore({
},
icon: 'el-icon-Plus',
render: 'basicButton',
click: async row => {
detailRef.value.open(row)
}
click: async row => {}
},
{
name: 'edit',
@@ -118,19 +114,12 @@ const tableStore: any = new TableStore({
type: 'primary',
icon: 'el-icon-Plus',
render: 'basicButton',
click: row => {
dialogVisible.value = true
setTimeout(() => {
FillingRef.value.open(row)
}, 10)
}
click: row => {}
},
{
name: 'edit',
title: '归档',
disabled: row => {
return !(row.reportProcess == 'Insights' && row.reportProcessStatus == 'Success')
},
type: 'primary',
icon: 'el-icon-SuccessFilled',
render: 'basicButton',
@@ -140,25 +129,16 @@ const tableStore: any = new TableStore({
confirmButtonType: 'danger',
title: '确定归档？'
},
click: row => {
archive(row.powerQualityProblemNo).then(() => {
ElMessage.success('归档成功！')
tableStore.index()
})
}
click: row => {}
},
{
name: 'edit',
title: '审核记录',
type: 'primary',
disabled: row => {
return row.reportProcessStatus == 'Init'
},
icon: 'el-icon-PieChart',
render: 'basicButton',
click: row => {
recordingRef.value.open(row)
}
click: row => {}
},
{
name: 'del',
@@ -172,9 +152,7 @@ const tableStore: any = new TableStore({
confirmButtonType: 'danger',
title: '确定删除？'
},
disabled: row => {
return row.reportProcess == 'Archived'
},
click: row => {
deleteIssues(row.powerQualityProblemNo).then(() => {
ElMessage.success('删除成功')
@@ -209,16 +187,6 @@ onMounted(() => {
})
// 新增
const add = () => {
showNewlyAdded.value = true
}
// 关闭弹框
const handleClose = () => {
showNewlyAdded.value = false
}
// 关闭 填报
const beforeClose = () => {
dialogVisible.value = false
tableStore.index()
EquipmentRef.value.open('新增资产')
}
</script>

1
src/views/system/auth/menu/popupMenu.vue
View File

@@ -5,6 +5,7 @@
<el-form-item label="上级菜单">
<el-cascader
v-model="form.pid"
clearable
:options="tableStore.table.data"
:props="cascaderProps"
style="width: 100%"