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

模型表单优化

Browse Source
This commit is contained in:
hongawen
2024-05-14 10:22:22 +08:00
parent b4aded5eb7
commit 4e9baf7aa1
4 changed files with 232 additions and 191 deletions
Download Patch File Download Diff File Expand all files Collapse all files

22
src/api/bpm-boot/model.ts
View File

@@ -35,6 +35,16 @@ export const getById = (id: string) => {
}) })
} }
/**
* 删除模型
*/
export const deleteModel = (id: string) => {
return createAxios({
url: MAPPING_PATH + '/delete?id=' + id,
method: 'GET'
})
}
/** /**
* 根据id部署模型 * 根据id部署模型
*/ */
@@ -69,15 +79,3 @@ export const updateModel = (data: any) => {
}) })
} }
/**
* 删除流程模型
*/
export const deleteModel = (data: any) => {
let ids = [data]
return createAxios({
url: MAPPING_PATH + '/delete',
method: 'POST',
data: ids
})
}

2
src/views/pqs/supervise/interfere/components/undocumented/addForm.vue
View File

@@ -798,7 +798,7 @@ const defaultProps = {
const nonlinearDeviceTypeList = ref('') const nonlinearDeviceTypeList = ref('')
//获取登陆用户姓名和部门 //获取登陆用户姓名和部门
const adminInfo = useAdminInfo() const adminInfo = useAdminInfo()
console.log(adminInfo.$state, '打印登陆用户新信息') // console.log(adminInfo.$state, '打印登陆用户新信息')
const resetForm = () => { const resetForm = () => {
form.value = { form.value = {
reporter: '', //填报人 1 reporter: '', //填报人 1

382
src/views/system/bpm/model/index.vue
View File

@@ -1,34 +1,34 @@
<!--流程模型管理界面--> <!--流程模型管理界面-->
<template> <template>
<div class="default-main"> <div class='default-main'>
<TableHeader> <TableHeader>
<template v-slot:select> <template v-slot:select>
<!-- <el-form-item label='用户'>--> <!-- <el-form-item label='用户'>-->
<!-- <el-select v-model='tableStore.table.params.userId' filterable clearable>--> <!-- <el-select v-model='tableStore.table.params.userId' filterable clearable>-->
<!-- <el-option--> <!-- <el-option-->
<!-- v-for='item in userListData'--> <!-- v-for='item in userListData'-->
<!-- :key='item.id'--> <!-- :key='item.id'-->
<!-- :label='item.userName'--> <!-- :label='item.userName'-->
<!-- :value='item.id'--> <!-- :value='item.id'-->
<!-- />--> <!-- />-->
<!-- </el-select>--> <!-- </el-select>-->
<!-- </el-form-item>--> <!-- </el-form-item>-->
</template> </template>
<template v-slot:operation> <template v-slot:operation>
<el-button type="primary" @click="add" class="ml10" :icon="Plus">新增模型</el-button> <el-button type='primary' @click='add' class='ml10' :icon='Plus'>新增模型</el-button>
</template> </template>
</TableHeader> </TableHeader>
<!--表格--> <!--表格-->
<Table ref="tableRef" isGroup></Table> <Table ref='tableRef' isGroup></Table>
<model-popup ref="modelPopup" /> <model-popup ref='modelPopup' />
<!-- 弹窗：表单详情 --> <!-- 弹窗：表单详情 -->
<el-dialog title="表单详情" v-model="formDetailVisible" width="800"> <el-dialog title='表单详情' v-model='formDetailVisible' width='800'>
<form-create :rule="formDetailPreview.rule" :option="formDetailPreview.option" /> <form-create :rule='formDetailPreview.rule' :option='formDetailPreview.option' />
</el-dialog> </el-dialog>
</div> </div>
</template> </template>
<script setup lang="ts"> <script setup lang='ts'>
import { Plus } from '@element-plus/icons-vue' import { Plus } from '@element-plus/icons-vue'
import { ElMessage, ElMessageBox } from 'element-plus' import { ElMessage, ElMessageBox } from 'element-plus'
import TableStore from '@/utils/tableStore' import TableStore from '@/utils/tableStore'
@@ -36,193 +36,233 @@ import Table from '@/components/table/index.vue'
import TableHeader from '@/components/table/header/index.vue' import TableHeader from '@/components/table/header/index.vue'
import { onMounted, provide, ref } from 'vue' import { onMounted, provide, ref } from 'vue'
import { useRouter } from 'vue-router' import { useRouter } from 'vue-router'
import { sgUserList } from '@/api/advance-boot/sgGroven/sgUser'
import { deleteSgScheme } from '@/api/advance-boot/sgGroven/sgScheme'
import ModelPopup from '@/views/system/bpm/model/modelPopup.vue' import ModelPopup from '@/views/system/bpm/model/modelPopup.vue'
import { deployModel } from '@/api/bpm-boot/model' import { deleteModel, deployModel } from '@/api/bpm-boot/model'
import { getById } from '@/api/bpm-boot/form' import { getById } from '@/api/bpm-boot/form'
import { setConfAndFields2 } from '@/utils/formCreate' import { setConfAndFields2 } from '@/utils/formCreate'
import { getSignSimpleList } from '@/api/bpm-boot/sign'
defineOptions({ defineOptions({
name: 'governSchemeHistory' name: 'governSchemeHistory'
}) })
const { push } = useRouter() const { push } = useRouter()
const modelPopup = ref() const modelPopup = ref()
const tableStore = new TableStore({ const tableStore = new TableStore({
url: '/bpm-boot/bpm/model/list', url: '/bpm-boot/bpm/model/list',
method: 'POST', method: 'POST',
column: [ column: [
{ title: '序号', type: 'seq', width: 80 }, { title: '序号', type: 'seq', width: 80 },
{ title: '模型标识', field: 'key', width: 160 }, { title: '模型标识', field: 'key', width: 160 },
{ title: '模型名称', field: 'name', width: 160 }, { title: '模型名称', field: 'name', width: 160 },
{ title: '流程分类', field: 'categoryName', width: 150 }, { title: '流程分类', field: 'categoryName', width: 150 },
{ title: '表单信息', field: 'formName', width: 170, }, {
{ title: '表单信息', field: 'formName', width: 170,
title: '创建时间', formatter: (obj: any) => {
field: 'createTime', const formType = obj.row.formType
width: 150 if (formType == 20) {
}, return getFormNameByViewPath(obj.row.formCustomViewPath)
{ } else {
title: '最新部署的流程定义', return obj.row.formName
children: [
{ title: '模型版本', width: '150', field: 'processDefinition.version' },
{
title: '激活状态',
width: '150',
field: 'processDefinition.suspensionState',
render: 'switch',
activeValue: '1',
inactiveValue: '0',
onChangeField: (row: any, value) => {
console.log(row, 444123, value)
value == 0 ? (value = 1) : (value = 0)
}
// custom: {
// 2: 'danger',
// 1: 'success'
// },
// replaceValue: {
// 2: '关闭',
// 1: '开启'
// }
},
{ title: '部署时间', width: '150', field: 'processDefinition.deploymentTime' }
]
},
{
title: '操作',
align: 'center',
minWidth: '200',
render: 'buttons',
fixed: 'right',
buttons: [
{
name: 'productSetting',
title: '设计流程',
type: 'primary',
icon: 'el-icon-EditPen',
render: 'basicButton',
click: row => {
handleDesign(row.id)
}
},
{
name: 'productSetting',
title: '部署流程',
type: 'primary',
icon: 'el-icon-EditPen',
render: 'basicButton',
click: row => {
handleDeployConfirm(row.id)
}
},
{
name: 'productSetting',
title: '表单预览',
type: 'primary',
icon: 'el-icon-EditPen',
render: 'basicButton',
click: row => {
handleFormDetail(row.formId)
}
},
{
name: 'update',
title: '删除',
type: 'danger',
icon: 'el-icon-Delete',
render: 'confirmButton',
popconfirm: {
confirmButtonText: '确认',
cancelButtonText: '取消',
confirmButtonType: 'danger',
title: '确定删除吗？'
},
click: row => {
deleteSgScheme(row.id).then(res => {
ElMessage.success('删除成功')
tableStore.index()
})
}
}
]
} }
], }
beforeSearchFun: () => { },
if (tableStore.table.params.addr) { {
tableStore.table.params.addrStrOption = tableStore.table.params.addr.map(tempArray => tempArray.join('/')) title: '创建时间',
} field: 'createTime',
for (let key in tableStore.table.params) { width: 150
if (tableStore.table.params[key] === '') { },
delete tableStore.table.params[key] {
title: '最新部署的流程定义',
children: [
{
title: '模型版本',
width: '150',
field: 'processDefinition.version',
type: 'html',
formatter: (obj: any) => {
if (obj.row.processDefinition) {
const val = obj.row.processDefinition.version
return `<a href='javascript:void(0);' style='color: #409EFF;text-decoration: none'>v${val}</a>`
} else {
return '未部署'
} }
}
},
{
title: '激活状态',
width: '150',
field: 'processDefinition.suspensionState',
// render: 'switch',
// activeValue: '1',
// inactiveValue: '0',
// onChangeField: (row: any, value) => {
// console.log(row, 444123, value)
// value == 0 ? (value = 1) : (value = 0)
// }
render: 'tag',
custom: {
2: 'danger',
1: 'success'
},
replaceValue: {
2: '关闭',
1: '开启'
}
},
{ title: '部署时间', width: '150', field: 'processDefinition.deploymentTime' }
]
},
{
title: '操作',
align: 'center',
minWidth: '200',
render: 'buttons',
fixed: 'right',
buttons: [
{
name: 'productSetting',
title: '设计流程',
type: 'primary',
icon: 'el-icon-EditPen',
render: 'basicButton',
click: row => {
handleDesign(row.id)
}
},
{
name: 'productSetting',
title: '部署流程',
type: 'primary',
icon: 'el-icon-EditPen',
render: 'basicButton',
click: row => {
handleDeployConfirm(row.id)
}
},
{
name: 'productSetting',
title: '表单预览',
type: 'primary',
icon: 'el-icon-EditPen',
render: 'basicButton',
click: row => {
handleFormDetail(row.formId)
}
},
{
name: 'update',
title: '删除',
type: 'danger',
icon: 'el-icon-Delete',
render: 'confirmButton',
popconfirm: {
confirmButtonText: '确认',
cancelButtonText: '取消',
confirmButtonType: 'danger',
title: '确定删除吗？'
},
click: row => {
deleteModel(row.id).then(res => {
ElMessage.success('删除成功')
tableStore.index()
})
}
} }
]
} }
],
beforeSearchFun: () => {
if (tableStore.table.params.addr) {
tableStore.table.params.addrStrOption = tableStore.table.params.addr.map(tempArray => tempArray.join('/'))
}
for (let key in tableStore.table.params) {
if (tableStore.table.params[key] === '') {
delete tableStore.table.params[key]
}
}
}
}) })
const flowInfo = ref()
onMounted(() => { onMounted(async () => {
// 加载数据 // 加载数据
tableStore.index() tableStore.index()
//加载流程标识
await getSignSimpleList().then(res => {
flowInfo.value = res.data
})
}) })
tableStore.table.params.userId = '' tableStore.table.params.userId = ''
provide('tableStore', tableStore) provide('tableStore', tableStore)
//获取流程标识的名称
const getFormNameByViewPath = (viewPath: string) => {
const nameItem = flowInfo.value.filter(item => item.viewPath == viewPath)
if (nameItem.length > 0) {
return nameItem[0].name
} else {
return ''
}
}
//新增用户信息 //新增用户信息
const add = () => { const add = () => {
modelPopup.value.open('新增流程模型') modelPopup.value.open('新增流程模型')
} }
/** 设计流程 */ /** 设计流程 */
const handleDesign = (rowId: string) => { const handleDesign = (rowId: string) => {
push({ push({
name: 'BpmModelEditor', name: 'BpmModelEditor',
query: { query: {
modelId: rowId modelId: rowId
} }
}) })
} }
/** 发布流程 */ /** 发布流程 */
const handleDeployConfirm = (rowId: string) => { const handleDeployConfirm = (rowId: string) => {
try { try {
// 删除的二次确认 // 删除的二次确认
ElMessageBox.confirm('是否部署该流程?', '提示', { ElMessageBox.confirm('是否部署该流程?', '提示', {
confirmButtonText: '确定', confirmButtonText: '确定',
cancelButtonText: '取消', cancelButtonText: '取消',
draggable: true, draggable: true,
type: 'warning' type: 'warning'
}).then(() => {
handleDeploy(rowId)
}) })
.then(() => { .catch(() => {
handleDeploy(rowId) })
}) } catch {
.catch(() => {}) }
} catch {}
} }
const handleDeploy = async (rowId: string) => { const handleDeploy = async (rowId: string) => {
// 发起部署 // 发起部署
await deployModel(rowId) await deployModel(rowId)
ElMessage.success('部署成功') ElMessage.success('部署成功')
tableStore.index() tableStore.index()
} }
/** 流程表单的详情按钮操作 */ /** 流程表单的详情按钮操作 */
const formDetailVisible = ref(false) const formDetailVisible = ref(false)
const formDetailPreview = ref({ const formDetailPreview = ref({
rule: [], rule: [],
option: {} option: {}
}) })
const handleFormDetail = async (formId: string) => { const handleFormDetail = async (formId: string) => {
// 设置表单 // 设置表单
await getById(formId).then(res => { await getById(formId).then(res => {
const data = res.data const data = res.data
setConfAndFields2(formDetailPreview, data.conf, data.fields) setConfAndFields2(formDetailPreview, data.conf, data.fields)
// 弹窗打开 // 弹窗打开
formDetailVisible.value = true formDetailVisible.value = true
}) })
} }
</script> </script>

17
src/views/system/bpm/model/modelPopup.vue
View File

@@ -4,8 +4,8 @@
<el-scrollbar> <el-scrollbar>
<el-form :inline='false' :model='formData' label-width='120px' :rules='rules' ref='formRef'> <el-form :inline='false' :model='formData' label-width='120px' :rules='rules' ref='formRef'>
<el-form-item label='表单类型' prop='formType'> <el-form-item label='表单类型' prop='formType' >
<el-radio-group v-model='formData.formType'> <el-radio-group v-model='formData.formType' :disabled='!!formData.id'>
<el-radio border label='20'>业务表单</el-radio> <el-radio border label='20'>业务表单</el-radio>
<el-radio border label='10'>流程表单</el-radio> <el-radio border label='10'>流程表单</el-radio>
</el-radio-group> </el-radio-group>
@@ -40,7 +40,7 @@
<!-- <UploadImg v-model='formData.icon' :limit='1' height='128px' width='128px' />--> <!-- <UploadImg v-model='formData.icon' :limit='1' height='128px' width='128px' />-->
<!-- </el-form-item>--> <!-- </el-form-item>-->
<el-form-item label='流程标识' prop='key'> <el-form-item label='流程标识' prop='key' v-if='formData.formType == 20'>
<el-select v-model='formData.key' clearable style='width: 100%' @change='changeSign'> <el-select v-model='formData.key' clearable style='width: 100%' @change='changeSign'>
<el-option <el-option
v-for='item in flowInfo' v-for='item in flowInfo'
@@ -50,10 +50,13 @@
placeholder='请选择流程标识' placeholder='请选择流程标识'
/> />
</el-select> </el-select>
</el-form-item> </el-form-item>
<el-form-item label='流程表单' prop='formId' v-if='formData.formType == "10"'> <el-form-item label='流程标识' prop='key' v-else>
<el-input v-model='formData.key' />
</el-form-item>
<el-form-item label='流程表单' prop='formId' v-if='formData.formType == 10'>
<el-select v-model='formData.formId' clearable style='width: 100%'> <el-select v-model='formData.formId' clearable style='width: 100%'>
<el-option <el-option
v-for='form in formList' v-for='form in formList'
@@ -112,7 +115,7 @@ const formData = reactive({
category: '', category: '',
icon: '', icon: '',
description: '', description: '',
formType: '20', formType: 20,
formCustomCreatePath: '', formCustomCreatePath: '',
formCustomViewPath: '', formCustomViewPath: '',
formId: '' formId: ''
@@ -157,7 +160,7 @@ const open = async (text: string, data?: any) => {
formData[key] = '' formData[key] = ''
} }
//随机一个key给该模型 //随机一个key给该模型
formData.formType = '20' formData.formType = 20
} }
dialogVisible.value = true dialogVisible.value = true
} }