流程模板设计:简单的流程新增数据处理,接口对接,编辑逻辑梳理。
parent
b015db153d
commit
72c07fbd80
|
|
@ -1,7 +1,7 @@
|
||||||
// WFSchemeInfo 流程模版基本信息
|
// WFSchemeInfo 流程模版基本信息
|
||||||
import { defHttp } from '@/utils/http/axios';
|
import { defHttp } from '@/utils/http/axios';
|
||||||
import {SchemeListParams,GetSchemeModel,AddParams,
|
import {SchemeListParams,GetSchemeModel,AddParams,
|
||||||
DeleteParams,UpdateParams,StateParams,HistoryParams,GetHistoryModel,SchemeParams} from './model/wfSchemeInfoModel'
|
DeleteParams,UpdateParams,StateParams,HistoryParams,GetHistoryModel,SchemeParams,DetailParams} from './model/wfSchemeInfoModel'
|
||||||
enum Api {
|
enum Api {
|
||||||
// 流程模板基本信息
|
// 流程模板基本信息
|
||||||
LoadPage = '/api/WFSchemeInfo/LoadPage',
|
LoadPage = '/api/WFSchemeInfo/LoadPage',
|
||||||
|
|
@ -9,6 +9,7 @@ enum Api {
|
||||||
Update = '/api/WFSchemeInfo/Update',
|
Update = '/api/WFSchemeInfo/Update',
|
||||||
Delete = '/api/WFSchemeInfo/Delete',
|
Delete = '/api/WFSchemeInfo/Delete',
|
||||||
UpDateState = '/api/WFSchemeInfo/UpDateState',
|
UpDateState = '/api/WFSchemeInfo/UpDateState',
|
||||||
|
GetDetail='/api/WFSchemeInfo/Get',
|
||||||
// 流程模板详细信息
|
// 流程模板详细信息
|
||||||
LoadHistoryPage= '/api/WFScheme/LoadPage',
|
LoadHistoryPage= '/api/WFScheme/LoadPage',
|
||||||
UpdateScheme='/api/WFSchemeInfo/UpdateScheme',
|
UpdateScheme='/api/WFSchemeInfo/UpdateScheme',
|
||||||
|
|
@ -20,6 +21,9 @@ enum Api {
|
||||||
export function getLoadPage(params?: SchemeListParams) {
|
export function getLoadPage(params?: SchemeListParams) {
|
||||||
return defHttp.get<GetSchemeModel>({ url: Api.LoadPage, params });
|
return defHttp.get<GetSchemeModel>({ url: Api.LoadPage, params });
|
||||||
}
|
}
|
||||||
|
export function getDetail(params?: DetailParams){
|
||||||
|
return defHttp.get({ url: Api.GetDetail, params });
|
||||||
|
}
|
||||||
/**
|
/**
|
||||||
* @description: postAdd
|
* @description: postAdd
|
||||||
*/
|
*/
|
||||||
|
|
@ -34,7 +38,7 @@ export function postAdd( params?:AddParams) {
|
||||||
|
|
||||||
export function update(params:UpdateParams) {
|
export function update(params:UpdateParams) {
|
||||||
return defHttp.post({
|
return defHttp.post({
|
||||||
url: Api.Update,
|
url: Api.Update+"?id="+params.schemeinfo.id,
|
||||||
params
|
params
|
||||||
});
|
});
|
||||||
}
|
}
|
||||||
|
|
|
||||||
|
|
@ -8,6 +8,12 @@ export interface SchemeListParams {
|
||||||
category: string;
|
category: string;
|
||||||
ids?: string;
|
ids?: string;
|
||||||
}
|
}
|
||||||
|
/**
|
||||||
|
* @description: 获取流程模板详情参数
|
||||||
|
*/
|
||||||
|
export interface DetailParams {
|
||||||
|
code: string;
|
||||||
|
}
|
||||||
|
|
||||||
/**
|
/**
|
||||||
* @description: 流程模板添加参数
|
* @description: 流程模板添加参数
|
||||||
|
|
@ -101,9 +107,9 @@ export interface DeleteParams {
|
||||||
id: string;
|
id: string;
|
||||||
}
|
}
|
||||||
|
|
||||||
export interface StateParams{
|
export interface StateParams {
|
||||||
id:string;
|
id: string;
|
||||||
state:number;
|
state: number;
|
||||||
}
|
}
|
||||||
|
|
||||||
/**
|
/**
|
||||||
|
|
@ -133,7 +139,7 @@ export interface GetSchemeModel {
|
||||||
/**
|
/**
|
||||||
* @description: 历史记录查询参数
|
* @description: 历史记录查询参数
|
||||||
*/
|
*/
|
||||||
export interface HistoryParams{
|
export interface HistoryParams {
|
||||||
key: string;
|
key: string;
|
||||||
page: number;
|
page: number;
|
||||||
limit: number;
|
limit: number;
|
||||||
|
|
@ -142,7 +148,7 @@ export interface HistoryParams{
|
||||||
/**
|
/**
|
||||||
* @description: 历史记录返回值
|
* @description: 历史记录返回值
|
||||||
*/
|
*/
|
||||||
export interface GetHistoryModel{
|
export interface GetHistoryModel {
|
||||||
id: string,
|
id: string,
|
||||||
schemeInfoId: string,
|
schemeInfoId: string,
|
||||||
type: number,
|
type: number,
|
||||||
|
|
@ -154,7 +160,7 @@ export interface GetHistoryModel{
|
||||||
/**
|
/**
|
||||||
* @description: 切换版本
|
* @description: 切换版本
|
||||||
*/
|
*/
|
||||||
export interface SchemeParams{
|
export interface SchemeParams {
|
||||||
id:string,
|
id: string,
|
||||||
schemeId:string
|
schemeId: string
|
||||||
}
|
}
|
||||||
|
|
|
||||||
|
|
@ -10,7 +10,7 @@
|
||||||
@event="handlerEvent" @save="onSaveProcess" />
|
@event="handlerEvent" @save="onSaveProcess" />
|
||||||
<!-- 属性面板 -->
|
<!-- 属性面板 -->
|
||||||
<bmpn-process-penal :element="data.element" :bpmn-modeler="data.modeler" :prefix="data.controlForm.prefix"
|
<bmpn-process-penal :element="data.element" :bpmn-modeler="data.modeler" :prefix="data.controlForm.prefix"
|
||||||
class="process-panel" ref=processPanel />
|
class="process-panel" ref=processPanel :schemeCode="props.schemeCode"/>
|
||||||
</div>
|
</div>
|
||||||
</template>
|
</template>
|
||||||
|
|
||||||
|
|
@ -30,6 +30,9 @@
|
||||||
designerForm: {
|
designerForm: {
|
||||||
type: Object,
|
type: Object,
|
||||||
required: true
|
required: true
|
||||||
|
},
|
||||||
|
schemeCode:{
|
||||||
|
type:String,
|
||||||
}
|
}
|
||||||
})
|
})
|
||||||
const data = reactive({
|
const data = reactive({
|
||||||
|
|
@ -49,11 +52,17 @@
|
||||||
element: null,
|
element: null,
|
||||||
})
|
})
|
||||||
const processPanel = ref < any > ()
|
const processPanel = ref < any > ()
|
||||||
function getFlow() {
|
async function getFlow() {
|
||||||
let panel = processPanel.value.getPanel()
|
let panel = await processPanel.value.getPanel()
|
||||||
|
return panel
|
||||||
|
}
|
||||||
|
async function validateFlow(){
|
||||||
|
let res = await processPanel.value.validatePanel()
|
||||||
|
return res
|
||||||
}
|
}
|
||||||
defineExpose({
|
defineExpose({
|
||||||
getFlow
|
getFlow,
|
||||||
|
validateFlow
|
||||||
})
|
})
|
||||||
function connectionAdded(node) {
|
function connectionAdded(node) {
|
||||||
console.log(node)
|
console.log(node)
|
||||||
|
|
|
||||||
|
|
@ -1,10 +1,11 @@
|
||||||
<template>
|
<template>
|
||||||
<div :class="prefixCls" :style="{ width: `${props.width}px` }">
|
<div :class="prefixCls" :style="{ width: `${props.width}px` }">
|
||||||
<a-tabs v-model:activeKey="configActiveName">
|
<a-tabs v-model:activeKey="configActiveName">
|
||||||
<a-tab-pane :tab="data.wfNodeName" key="1" >
|
<a-tab-pane :tab="data.wfNodeName" key="1">
|
||||||
<start-event-option ref="startRef" :element="data.currentWfNode"
|
<start-event-option ref="startRef" :element="data.currentWfNode"
|
||||||
:class="data.currentWfNode.type=='bpmn:StartEvent' ? '' : 'hidden'"></start-event-option>
|
:class="data.currentWfNode.type=='bpmn:StartEvent' ? '' : 'hidden'"></start-event-option>
|
||||||
<user-task-option ref="taskRef" :element="data.currentWfNode" :class="data.currentWfNode.type=='bpmn:Task' ? '' : 'hidden'">
|
<user-task-option ref="taskRef" :element="data.currentWfNode"
|
||||||
|
:class="data.currentWfNode.type=='bpmn:Task' ? '' : 'hidden'">
|
||||||
</user-task-option>
|
</user-task-option>
|
||||||
<end-event-option ref="endRef" :element="data.currentWfNode"
|
<end-event-option ref="endRef" :element="data.currentWfNode"
|
||||||
:class="data.currentWfNode.type=='bpmn:EndEvent' ? '' : 'hidden'"></end-event-option>
|
:class="data.currentWfNode.type=='bpmn:EndEvent' ? '' : 'hidden'"></end-event-option>
|
||||||
|
|
@ -12,7 +13,7 @@
|
||||||
:class="data.currentWfNode.type=='bpmn:SubProcess' ? '' : 'hidden'"></subprocess-option>
|
:class="data.currentWfNode.type=='bpmn:SubProcess' ? '' : 'hidden'"></subprocess-option>
|
||||||
</a-tab-pane>
|
</a-tab-pane>
|
||||||
<a-tab-pane tab="流程属性" key="2">
|
<a-tab-pane tab="流程属性" key="2">
|
||||||
<shcemeinfo-config ref="shcemeinfoRef" :disabled="true"></shcemeinfo-config>
|
<shcemeinfo-config ref="shcemeinfoRef" :disabled="true" :schemeInfo="detailInfo.schemeInfo"></shcemeinfo-config>
|
||||||
</a-tab-pane>
|
</a-tab-pane>
|
||||||
<a-tab-pane key="3" tab="发起权限" force-render>
|
<a-tab-pane key="3" tab="发起权限" force-render>
|
||||||
<auth-config ref="authRef"></auth-config>
|
<auth-config ref="authRef"></auth-config>
|
||||||
|
|
@ -27,8 +28,12 @@
|
||||||
import { Tabs } from 'ant-design-vue';
|
import { Tabs } from 'ant-design-vue';
|
||||||
import { PageWrapper } from '@/components/Page';
|
import { PageWrapper } from '@/components/Page';
|
||||||
import { useDesign } from '@/hooks/web/useDesign';
|
import { useDesign } from '@/hooks/web/useDesign';
|
||||||
import {lr_AESEncrypt} from '../utils.ts'
|
import { lr_AESEncrypt } from '../utils.ts'
|
||||||
const { prefixCls } = useDesign('process-property');
|
const { prefixCls } = useDesign('process-property');
|
||||||
|
import { useMessage } from '@/hooks/web/useMessage';
|
||||||
|
const { createConfirm, createMessage } = useMessage();
|
||||||
|
import { getDetail } from '@/api/sys/WFSchemeInfo'
|
||||||
|
|
||||||
// 流程属性
|
// 流程属性
|
||||||
import shcemeinfoConfig from './shcemeInfo/index.vue'
|
import shcemeinfoConfig from './shcemeInfo/index.vue'
|
||||||
// 发起权限
|
// 发起权限
|
||||||
|
|
@ -67,8 +72,17 @@
|
||||||
type: Number,
|
type: Number,
|
||||||
default: 520
|
default: 520
|
||||||
},
|
},
|
||||||
element: Object
|
element: Object,
|
||||||
|
schemeCode: String,
|
||||||
})
|
})
|
||||||
|
|
||||||
|
const startRef = ref < any > ()
|
||||||
|
const shcemeinfoRef = ref < any > ()
|
||||||
|
const authRef = ref < any > ()
|
||||||
|
const taskRef = ref < any > ()
|
||||||
|
const endRef = ref < any > ()
|
||||||
|
const subprocessRef = ref < any > ()
|
||||||
|
|
||||||
const configActiveName = ref('2')
|
const configActiveName = ref('2')
|
||||||
const data = reactive({
|
const data = reactive({
|
||||||
currentWfNode: undefined,
|
currentWfNode: undefined,
|
||||||
|
|
@ -78,7 +92,6 @@
|
||||||
() => props.element,
|
() => props.element,
|
||||||
(newVal, oldVal) => {
|
(newVal, oldVal) => {
|
||||||
var typeName = newVal.type.replace('bpmn:', '')
|
var typeName = newVal.type.replace('bpmn:', '')
|
||||||
console.log(newVal)
|
|
||||||
if (newVal.type == "bpmn:Process") {
|
if (newVal.type == "bpmn:Process") {
|
||||||
data.currentWfNode = {
|
data.currentWfNode = {
|
||||||
type: newVal.type
|
type: newVal.type
|
||||||
|
|
@ -123,7 +136,66 @@
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
)
|
)
|
||||||
|
const detailInfo = reactive({
|
||||||
|
schemeInfo: {},
|
||||||
|
startInfor: {},
|
||||||
|
endInfo: {},
|
||||||
|
authInfo: {},
|
||||||
|
subprocessInfo: {},
|
||||||
|
taskInfo: {},
|
||||||
|
})
|
||||||
|
async function getDetailInfo() {
|
||||||
|
let data = await getDetail({ code: props.schemeCode })
|
||||||
|
let scheme = JSON.parse(data.scheme.content);
|
||||||
|
let baseinfo = {
|
||||||
|
id: data.schemeinfo.id,
|
||||||
|
code: data.schemeinfo.code,
|
||||||
|
name: data.schemeinfo.name,
|
||||||
|
category: data.schemeinfo.category,
|
||||||
|
enabledMark: data.schemeinfo.enabledMark,
|
||||||
|
mark: data.schemeinfo.mark,
|
||||||
|
isInApp: data.schemeinfo.isInApp,
|
||||||
|
description: data.schemeinfo.description,
|
||||||
|
icon: data.schemeinfo.icon,
|
||||||
|
color: data.schemeinfo.color,
|
||||||
|
schemeId: data.schemeinfo.schemeId,
|
||||||
|
|
||||||
|
undoType: scheme.undoType,
|
||||||
|
undoDbCode: scheme.undoDbCode,
|
||||||
|
undoDbSQL: scheme.undoDbSQL,
|
||||||
|
undoIOCName: scheme.undoIOCName,
|
||||||
|
undoUrl: scheme.undoUrl,
|
||||||
|
|
||||||
|
deleteType: scheme.deleteType,
|
||||||
|
deleteDbCode: scheme.deleteDbCode,
|
||||||
|
deleteDbSQL: scheme.deleteDbSQL,
|
||||||
|
deleteIOCName: scheme.deleteIOCName,
|
||||||
|
deleteUrl: scheme.deleteUrl,
|
||||||
|
|
||||||
|
|
||||||
|
deleteDraftType: scheme.deleteDraftType,
|
||||||
|
deleteDraftDbCode: scheme.deleteDraftDbCode,
|
||||||
|
deleteDraftDbSQL: scheme.deleteDraftDbSQL,
|
||||||
|
deleteDraftIOCName: scheme.deleteDraftIOCName,
|
||||||
|
deleteDraftUrl: scheme.deleteDraftUrl
|
||||||
|
};
|
||||||
|
|
||||||
|
let wfData = scheme.wfData
|
||||||
|
|
||||||
|
let auth = {
|
||||||
|
authType: data.schemeinfo.authType,
|
||||||
|
authData: data.schemeAuthList.map(t => {
|
||||||
|
return {
|
||||||
|
id: t.objId,
|
||||||
|
name: t.objName,
|
||||||
|
type: t.objType
|
||||||
|
}
|
||||||
|
})
|
||||||
|
}
|
||||||
|
shcemeinfoRef.value.setForm(baseinfo)
|
||||||
|
authRef.value.setForm(auth)
|
||||||
|
console.log(wfData)
|
||||||
|
}
|
||||||
|
|
||||||
function scriptTaskNodeInit(node) {
|
function scriptTaskNodeInit(node) {
|
||||||
node.executeType = '1'
|
node.executeType = '1'
|
||||||
|
|
@ -146,28 +218,38 @@
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
const startRef = ref < any > ()
|
|
||||||
const shcemeinfoRef = ref < any > ()
|
|
||||||
const authRef = ref < any > ()
|
|
||||||
const taskRef = ref < any > ()
|
|
||||||
const endRef = ref < any > ()
|
|
||||||
const subprocessRef = ref < any > ()
|
|
||||||
|
|
||||||
function getPanel() {
|
async function validatePanel() {
|
||||||
|
let res = await shcemeinfoRef.value.validateForm();
|
||||||
|
return res
|
||||||
|
}
|
||||||
|
async function getPanel() {
|
||||||
// 1.获取流程配置基础属性
|
// 1.获取流程配置基础属性
|
||||||
let baseinfo = shcemeinfoRef.value.getForm();
|
let baseinfo = await shcemeinfoRef.value.getForm();
|
||||||
// 2.获取流程权限信息
|
// 2.获取流程权限信息
|
||||||
let auth = authRef.value.getForm();
|
let auth = await authRef.value.getForm();
|
||||||
|
if (startRef.value == undefined) {
|
||||||
let startFrom = startRef.value.getForm();
|
return createMessage.warn('请设置开始节点');
|
||||||
let taskFrom = taskRef.value.getForm();
|
}
|
||||||
let endFrom = endRef.value.getForm();
|
if (endRef.value == undefined) {
|
||||||
let subprocessFrom = subprocessRef.value.getForm();
|
return createMessage.warn('请设置结束节点');
|
||||||
|
}
|
||||||
|
let startFrom = await startRef.value.getForm();
|
||||||
|
let endFrom = await endRef.value.getForm();
|
||||||
|
if (endFrom.id == '') {
|
||||||
|
return createMessage.warn('请设置结束节点');
|
||||||
|
}
|
||||||
let wfData = []
|
let wfData = []
|
||||||
wfData.push(startFrom)
|
wfData.push(startFrom)
|
||||||
wfData.push(taskFrom)
|
|
||||||
wfData.push(endFrom)
|
wfData.push(endFrom)
|
||||||
wfData.push(subprocessFrom)
|
let taskFrom = await !(taskRef.value) ? {} : taskRef.value.getForm();
|
||||||
|
let subprocessFrom = await !(subprocessRef.value) ? {} : subprocessRef.value.getForm();
|
||||||
|
if(subprocessFrom != undefined){
|
||||||
|
wfData.push(subprocessFrom)
|
||||||
|
}
|
||||||
|
if(subprocessFrom != undefined){
|
||||||
|
wfData.push(taskFrom)
|
||||||
|
}
|
||||||
// 3.流程节点信息
|
// 3.流程节点信息
|
||||||
wfData.forEach(node => {
|
wfData.forEach(node => {
|
||||||
if (node.type == 'myline' && !node.isInit) {
|
if (node.type == 'myline' && !node.isInit) {
|
||||||
|
|
@ -207,34 +289,41 @@
|
||||||
};
|
};
|
||||||
let dto = {
|
let dto = {
|
||||||
schemeinfo: {
|
schemeinfo: {
|
||||||
f_Code: baseinfo.f_Code,
|
id:baseinfo.id,
|
||||||
f_Name: baseinfo.f_Name,
|
code: baseinfo.code,
|
||||||
f_Category: baseinfo.f_Category,
|
name: baseinfo.name,
|
||||||
f_EnabledMark: baseinfo.f_EnabledMark,
|
category: baseinfo.category,
|
||||||
f_Mark: baseinfo.f_Mark,
|
enabledMark: baseinfo.enabledMark,
|
||||||
f_IsInApp: baseinfo.f_IsInApp,
|
mark: baseinfo.mark,
|
||||||
f_AuthType: auth.f_AuthType,
|
isInApp: baseinfo.isInApp,
|
||||||
f_Description: baseinfo.f_Description,
|
authType: auth.authType,
|
||||||
f_Icon: baseinfo.f_Icon,
|
description: baseinfo.description,
|
||||||
f_Color: baseinfo.f_Color,
|
icon: baseinfo.icon,
|
||||||
f_SchemeId: baseinfo.f_SchemeId,
|
color: baseinfo.color,
|
||||||
|
schemeId: baseinfo.schemeId,
|
||||||
},
|
},
|
||||||
schemeAuthList: auth.f_AuthType == 1 ? [] : auth.authData.map(t => {
|
schemeAuthList: auth.authType == 1 ? [] : auth.authData.map(t => {
|
||||||
return {
|
return {
|
||||||
f_ObjId: t.id,
|
objId: t.id,
|
||||||
f_ObjName: t.name,
|
objName: t.name,
|
||||||
f_ObjType: t.type
|
objType: t.type
|
||||||
};
|
};
|
||||||
}),
|
}),
|
||||||
scheme: {
|
scheme: {
|
||||||
f_Content: lr_AESEncrypt(JSON.stringify(scheme), "learun")
|
content: lr_AESEncrypt(JSON.stringify(scheme), "learun")
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
console.log(dto)
|
console.log(dto)
|
||||||
return dto
|
return dto
|
||||||
}
|
}
|
||||||
defineExpose({
|
defineExpose({
|
||||||
getPanel
|
getPanel,
|
||||||
|
validatePanel
|
||||||
|
})
|
||||||
|
onMounted(() => {
|
||||||
|
if (props.schemeCode) {
|
||||||
|
getDetailInfo()
|
||||||
|
}
|
||||||
})
|
})
|
||||||
|
|
||||||
</script>
|
</script>
|
||||||
|
|
@ -255,7 +344,8 @@
|
||||||
::v-deep .ant-tabs-content-holder {
|
::v-deep .ant-tabs-content-holder {
|
||||||
overflow-y: auto;
|
overflow-y: auto;
|
||||||
}
|
}
|
||||||
.hidden{
|
|
||||||
|
.hidden {
|
||||||
display: none;
|
display: none;
|
||||||
}
|
}
|
||||||
</style>
|
</style>
|
||||||
|
|
@ -1,6 +1,6 @@
|
||||||
<template>
|
<template>
|
||||||
<div class="auth-config">
|
<div class="auth-config">
|
||||||
<a-tabs v-model:activeKey="f_AuthType" type="card" size="small">
|
<a-tabs v-model:activeKey="authType" type="card" size="small">
|
||||||
<a-tab-pane key="1" tab="所有成员">
|
<a-tab-pane key="1" tab="所有成员">
|
||||||
<a-alert message="权限说明" description="所有人员指不限制流程模版的发起人员,表示每个人都能发起该流程模版。" type="info" show-icon />
|
<a-alert message="权限说明" description="所有人员指不限制流程模版的发起人员,表示每个人都能发起该流程模版。" type="info" show-icon />
|
||||||
</a-tab-pane>
|
</a-tab-pane>
|
||||||
|
|
@ -44,7 +44,7 @@
|
||||||
|
|
||||||
<script lang="ts" setup>
|
<script lang="ts" setup>
|
||||||
import { reactive, ref, onMounted, nextTick, unref } from 'vue';
|
import { reactive, ref, onMounted, nextTick, unref } from 'vue';
|
||||||
const f_AuthType = ref("1")
|
let authType = ref("1")
|
||||||
import { cloneDeep } from 'lodash-es';
|
import { cloneDeep } from 'lodash-es';
|
||||||
import type { UnwrapRef } from 'vue';
|
import type { UnwrapRef } from 'vue';
|
||||||
import SelectPos from '@/components/SelectPos/index.vue';
|
import SelectPos from '@/components/SelectPos/index.vue';
|
||||||
|
|
@ -65,7 +65,7 @@
|
||||||
},
|
},
|
||||||
|
|
||||||
];
|
];
|
||||||
const dataSource = [
|
let dataSource = ref([
|
||||||
{
|
{
|
||||||
id: 0,
|
id: 0,
|
||||||
name: "王五",
|
name: "王五",
|
||||||
|
|
@ -76,7 +76,7 @@
|
||||||
name: "王五",
|
name: "王五",
|
||||||
type: "管理员",
|
type: "管理员",
|
||||||
},
|
},
|
||||||
]
|
])
|
||||||
const data = reactive({
|
const data = reactive({
|
||||||
postOpen: false,
|
postOpen: false,
|
||||||
roleOpen: false,
|
roleOpen: false,
|
||||||
|
|
@ -109,14 +109,19 @@
|
||||||
function accountHandleOk() {
|
function accountHandleOk() {
|
||||||
console.log(accountRef.value.getRow())
|
console.log(accountRef.value.getRow())
|
||||||
}
|
}
|
||||||
|
function setForm(data){
|
||||||
|
authType.value = data.authType
|
||||||
|
dataSource.value =data.authData
|
||||||
|
}
|
||||||
function getForm() {
|
function getForm() {
|
||||||
return {
|
return {
|
||||||
f_AuthType: f_AuthType.value,
|
authType: authType.value,
|
||||||
authData: dataSource.value
|
authData: dataSource.value
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
defineExpose({
|
defineExpose({
|
||||||
getForm
|
getForm,
|
||||||
|
setForm
|
||||||
})
|
})
|
||||||
|
|
||||||
</script>
|
</script>
|
||||||
|
|
|
||||||
|
|
@ -21,8 +21,10 @@
|
||||||
watch(
|
watch(
|
||||||
() => props.element,
|
() => props.element,
|
||||||
(newVal, oldVal) => {
|
(newVal, oldVal) => {
|
||||||
node.id = newVal.id
|
if(newVal.type == "bpmn:EndEvent"){
|
||||||
node.type = newVal.type
|
node.id = newVal.id
|
||||||
|
node.type = newVal.type
|
||||||
|
}
|
||||||
}
|
}
|
||||||
)
|
)
|
||||||
const labelCol = { span: 7 };
|
const labelCol = { span: 7 };
|
||||||
|
|
|
||||||
|
|
@ -2,35 +2,34 @@
|
||||||
<div class="shceme-info">
|
<div class="shceme-info">
|
||||||
<a-form ref="formRef" :rules="rules" :model="formState" labelAlign="left" :label-col="labelCol"
|
<a-form ref="formRef" :rules="rules" :model="formState" labelAlign="left" :label-col="labelCol"
|
||||||
:wrapper-col="wrapperCol">
|
:wrapper-col="wrapperCol">
|
||||||
<a-form-item label="模板编号" name="f_Code">
|
<a-form-item label="模板编号" name="code">
|
||||||
<a-input v-model:value="formState.f_Code" placeholder="请输入" />
|
<a-input v-model:value="formState.code" placeholder="请输入" />
|
||||||
</a-form-item>
|
</a-form-item>
|
||||||
<a-form-item label="模板名称" name="f_Name">
|
<a-form-item label="模板名称" name="name">
|
||||||
<a-input v-model:value="formState.f_Name" placeholder="请输入" />
|
<a-input v-model:value="formState.name" placeholder="请输入" />
|
||||||
</a-form-item>
|
</a-form-item>
|
||||||
<a-form-item label="模板图标" name="f_Icon">
|
<a-form-item label="模板图标" name="icon">
|
||||||
<IconPicker :value="formState.f_Icon" />
|
<IconPicker v-model:value="formState.icon" />
|
||||||
</a-form-item>
|
</a-form-item>
|
||||||
<a-form-item label="图标颜色" name="f_Color">
|
<a-form-item label="图标颜色" name="color">
|
||||||
<a-input type="color" v-model="formState.f_Color" placeholder="请输入"></a-input>
|
<a-input type="color" v-model="formState.color" placeholder="请输入"></a-input>
|
||||||
</a-form-item>
|
</a-form-item>
|
||||||
<a-form-item label="模板分类" name="f_Category">
|
<a-form-item label="模板分类" name="category">
|
||||||
<a-select v-model:value="formState.f_Category" placeholder="please select your zone">
|
<a-select v-model:value="formState.category" placeholder="请选择" :options="data.optionsType"
|
||||||
<a-select-option value="shanghai">Zone one</a-select-option>
|
:field-names="{ label: 'itemName', value: 'itemDetailId' }">
|
||||||
<a-select-option value="beijing">Zone two</a-select-option>
|
|
||||||
</a-select>
|
</a-select>
|
||||||
</a-form-item>
|
</a-form-item>
|
||||||
<a-form-item label="我的任务创建">
|
<a-form-item label="我的任务创建">
|
||||||
<a-radio-group v-model:value="formState.f_Mark" name="radioGroup">
|
<a-radio-group v-model:value="formState.mark" name="radioGroup">
|
||||||
<a-radio v-for="item in data.optionsNotOrOk" :value="item.value">{{item.label}}</a-radio>
|
<a-radio v-for="item in data.optionsNotOrOk" :value="item.value">{{item.label}}</a-radio>
|
||||||
</a-radio-group>
|
</a-radio-group>
|
||||||
</a-form-item>
|
</a-form-item>
|
||||||
<a-form-item label="移动端创建">
|
<a-form-item label="移动端创建">
|
||||||
<a-radio-group v-model:value="formState.f_IsInApp" name="radioGroup">
|
<a-radio-group v-model:value="formState.isInApp" name="radioGroup">
|
||||||
<a-radio v-for="item in data.optionsNotOrOk" :value="item.value">{{item.label}}</a-radio>
|
<a-radio v-for="item in data.optionsNotOrOk" :value="item.value">{{item.label}}</a-radio>
|
||||||
</a-radio-group>
|
</a-radio-group>
|
||||||
</a-form-item>
|
</a-form-item>
|
||||||
<a-textarea v-model:value="formState.f_Description" placeholder="请填写备注"
|
<a-textarea v-model:value="formState.description" placeholder="请填写备注"
|
||||||
:auto-size="{ minRows: 5, maxRows: 8 }" />
|
:auto-size="{ minRows: 5, maxRows: 8 }" />
|
||||||
|
|
||||||
|
|
||||||
|
|
@ -146,25 +145,27 @@
|
||||||
</template>
|
</template>
|
||||||
<script lang="ts" setup>
|
<script lang="ts" setup>
|
||||||
import { Dayjs } from 'dayjs';
|
import { Dayjs } from 'dayjs';
|
||||||
import { reactive, ref, toRaw } from 'vue';
|
import { reactive, ref, toRaw, onMounted, defineProps } from 'vue';
|
||||||
import type { UnwrapRef } from 'vue';
|
import type { UnwrapRef } from 'vue';
|
||||||
import type { Rule } from 'ant-design-vue/es/form';
|
import type { Rule } from 'ant-design-vue/es/form';
|
||||||
import { IconPicker } from '/@/components/Icon';
|
import { IconPicker } from '/@/components/Icon';
|
||||||
|
import { getLoad } from '@/api/sys/sysDataItemDetail';
|
||||||
const formRef = ref();
|
const formRef = ref();
|
||||||
const labelCol = { span: 7 };
|
const labelCol = { span: 7 };
|
||||||
const wrapperCol = { span: 17 };
|
const wrapperCol = { span: 17 };
|
||||||
const activeKey = ref('1')
|
const activeKey = ref('1')
|
||||||
const data = reactive({
|
const data = reactive({
|
||||||
optionsNotOrOk: [{ label: '允许', value: 1 }, { label: '不允许', value: 2 }],
|
optionsNotOrOk: [{ label: '允许', value: 1 }, { label: '不允许', value: 2 }],
|
||||||
|
optionsType: [],
|
||||||
})
|
})
|
||||||
const formState = reactive({
|
let formState = ref({
|
||||||
f_Code: '',
|
code: '',
|
||||||
f_Name: '',
|
name: '',
|
||||||
f_Category: '',
|
category: '',
|
||||||
f_Mark: 1,
|
enabledMark: 1,
|
||||||
f_IsInApp: 2,
|
mark: 1,
|
||||||
f_Description: '',
|
isInApp: 2,
|
||||||
|
description: '',
|
||||||
|
|
||||||
titleRules: '',
|
titleRules: '',
|
||||||
|
|
||||||
|
|
@ -185,33 +186,57 @@
|
||||||
deleteDraftDbSQL: '',
|
deleteDraftDbSQL: '',
|
||||||
deleteDraftIOCName: '',
|
deleteDraftIOCName: '',
|
||||||
deleteDraftUrl: '',
|
deleteDraftUrl: '',
|
||||||
f_Icon: '',
|
icon: 'ant-design:appstore-outlined',
|
||||||
f_Color: '#409EFF',
|
color: '#409EFF',
|
||||||
});
|
});
|
||||||
const rules: Record<string, Rule[]> = {
|
const rules: Record<string, Rule[]> = {
|
||||||
f_Code: [
|
code: [
|
||||||
{ required: true, message: '请输入模板编号' },
|
{ required: true, message: '请输入模板编号' },
|
||||||
// { validator: lr_existDbFiled, keyValue: () => { return data.formData.f_Id }, tableName: 'lr_wf_schemeinfo', keyName: 'f_Id', trigger: 'blur' }
|
// { validator: lr_existDbFiled, keyValue: () => { return data.formData.f_Id }, tableName: 'lr_wf_schemeinfo', keyName: 'f_Id', trigger: 'blur' }
|
||||||
],
|
],
|
||||||
f_Name: [
|
name: [
|
||||||
{ required: true, message: '请输入模板名称' }
|
{ required: true, message: '请输入模板名称' }
|
||||||
],
|
],
|
||||||
f_Category: [
|
category: [
|
||||||
{ required: true, message: '请选择模板分类' }
|
{ required: true, message: '请选择模板分类' }
|
||||||
],
|
],
|
||||||
f_Icon: [
|
icon: [
|
||||||
{ required: true, message: '请选择图标' }
|
{ required: true, message: '请选择图标' }
|
||||||
],
|
],
|
||||||
f_Color: [
|
color: [
|
||||||
{ required: true, message: '请选择颜色' }
|
{ required: true, message: '请选择颜色' }
|
||||||
],
|
],
|
||||||
};
|
};
|
||||||
|
async function fetch() {
|
||||||
|
let list = await getLoad({ code: 'FlowSort' });
|
||||||
|
data.optionsType = list
|
||||||
|
|
||||||
|
}
|
||||||
|
async function validateForm() {
|
||||||
|
let res = await formRef.value
|
||||||
|
.validate()
|
||||||
|
.then((values) => {
|
||||||
|
return true
|
||||||
|
})
|
||||||
|
.catch((error: ValidateErrorEntity<FormState>) => {
|
||||||
|
return false
|
||||||
|
});
|
||||||
|
return res
|
||||||
|
}
|
||||||
|
function setForm(data) {
|
||||||
|
formState.value = data
|
||||||
|
}
|
||||||
function getForm() {
|
function getForm() {
|
||||||
return formState
|
return formState.value
|
||||||
}
|
}
|
||||||
defineExpose({
|
defineExpose({
|
||||||
getForm
|
setForm,
|
||||||
|
getForm,
|
||||||
|
validateForm
|
||||||
})
|
})
|
||||||
|
onMounted(() => {
|
||||||
|
fetch();
|
||||||
|
});
|
||||||
</script>
|
</script>
|
||||||
<style lang="less" scoped>
|
<style lang="less" scoped>
|
||||||
.site-space-compact-wrapper {
|
.site-space-compact-wrapper {
|
||||||
|
|
|
||||||
|
|
@ -157,8 +157,10 @@
|
||||||
watch(
|
watch(
|
||||||
() => props.element,
|
() => props.element,
|
||||||
(newVal, oldVal) => {
|
(newVal, oldVal) => {
|
||||||
node.id = newVal.id
|
if(newVal.type == "bpmn:StartEvent"){
|
||||||
node.type = newVal.type
|
node.id = newVal.id
|
||||||
|
node.type = newVal.type
|
||||||
|
}
|
||||||
}
|
}
|
||||||
)
|
)
|
||||||
watch(
|
watch(
|
||||||
|
|
@ -174,12 +176,6 @@
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
)
|
)
|
||||||
watch(
|
|
||||||
() => node, (newVal, oldVal) => {
|
|
||||||
console.log(oldVal)
|
|
||||||
console.log(newVal)
|
|
||||||
}
|
|
||||||
)
|
|
||||||
function handleAddAuthField() {
|
function handleAddAuthField() {
|
||||||
node.authFields.push({
|
node.authFields.push({
|
||||||
field: '',
|
field: '',
|
||||||
|
|
@ -193,7 +189,7 @@
|
||||||
node.authFields = node.authFields.filter(item => item.field !== key);
|
node.authFields = node.authFields.filter(item => item.field !== key);
|
||||||
}
|
}
|
||||||
|
|
||||||
function getForm(){
|
function getForm() {
|
||||||
return node
|
return node
|
||||||
}
|
}
|
||||||
defineExpose({
|
defineExpose({
|
||||||
|
|
|
||||||
|
|
@ -36,8 +36,10 @@
|
||||||
watch(
|
watch(
|
||||||
() => props.element,
|
() => props.element,
|
||||||
(newVal, oldVal) => {
|
(newVal, oldVal) => {
|
||||||
node.id = newVal.id
|
if (newVal.type == "bpmn:SubProcess") {
|
||||||
node.type = newVal.type
|
node.id = newVal.id
|
||||||
|
node.type = newVal.type
|
||||||
|
}
|
||||||
}
|
}
|
||||||
)
|
)
|
||||||
const data = reactive({
|
const data = reactive({
|
||||||
|
|
@ -45,7 +47,9 @@
|
||||||
verisons: []
|
verisons: []
|
||||||
})
|
})
|
||||||
function getForm() {
|
function getForm() {
|
||||||
return node
|
if (node.id != '') {
|
||||||
|
return node
|
||||||
|
}
|
||||||
}
|
}
|
||||||
defineExpose({
|
defineExpose({
|
||||||
getForm
|
getForm
|
||||||
|
|
|
||||||
|
|
@ -242,8 +242,8 @@
|
||||||
conditionOptions: [{ value: '1', label: '同一个部门' }, { value: '2', label: '同一个公司' }, { value: '3', label: '发起人上级' }, { value: '4', label: '发起人下级' }],
|
conditionOptions: [{ value: '1', label: '同一个部门' }, { value: '2', label: '同一个公司' }, { value: '3', label: '发起人上级' }, { value: '4', label: '发起人下级' }],
|
||||||
})
|
})
|
||||||
const node = reactive({
|
const node = reactive({
|
||||||
id: "edb713be-7a25-44a2-8048-1f9abc638680",
|
id: "",
|
||||||
type: "userTask",
|
type: "",
|
||||||
isAddSign: false,
|
isAddSign: false,
|
||||||
isTransfer: false,
|
isTransfer: false,
|
||||||
isBatchAudit: false,
|
isBatchAudit: false,
|
||||||
|
|
@ -300,8 +300,10 @@
|
||||||
watch(
|
watch(
|
||||||
() => props.element,
|
() => props.element,
|
||||||
(newVal, oldVal) => {
|
(newVal, oldVal) => {
|
||||||
node.id = newVal.id
|
if (newVal.type == "bpmn:Task") {
|
||||||
node.type = newVal.type
|
node.id = newVal.id
|
||||||
|
node.type = newVal.type
|
||||||
|
}
|
||||||
}
|
}
|
||||||
)
|
)
|
||||||
// 岗位
|
// 岗位
|
||||||
|
|
@ -375,7 +377,9 @@
|
||||||
node.btnlist = node.btnlist.filter(item => item.code !== key);
|
node.btnlist = node.btnlist.filter(item => item.code !== key);
|
||||||
}
|
}
|
||||||
function getForm() {
|
function getForm() {
|
||||||
return node
|
if(node.id!=''){
|
||||||
|
return node
|
||||||
|
}
|
||||||
}
|
}
|
||||||
defineExpose({
|
defineExpose({
|
||||||
getForm
|
getForm
|
||||||
|
|
|
||||||
|
|
@ -45,8 +45,6 @@
|
||||||
const values = await validate();
|
const values = await validate();
|
||||||
setDrawerProps({ confirmLoading: true });
|
setDrawerProps({ confirmLoading: true });
|
||||||
if (isUpdate.value) {
|
if (isUpdate.value) {
|
||||||
console.log(values)
|
|
||||||
console.log(detail.value)
|
|
||||||
var querys = detail.value
|
var querys = detail.value
|
||||||
querys.description = values.description
|
querys.description = values.description
|
||||||
querys.enabledMark = values.enabledMark
|
querys.enabledMark = values.enabledMark
|
||||||
|
|
|
||||||
|
|
@ -99,14 +99,10 @@
|
||||||
function handleEdit() {
|
function handleEdit() {
|
||||||
let rows = getSelectRows();
|
let rows = getSelectRows();
|
||||||
if (rows.length == 0) {
|
if (rows.length == 0) {
|
||||||
return createMessage.warn('请选择一个按钮进行编辑');
|
return createMessage.warn('请选择一个模板进行编辑');
|
||||||
}
|
}
|
||||||
const record = rows[0]
|
const record = rows[0]
|
||||||
record.type = '2'
|
go('/dashboard/scheme_preview/add?code='+record.code);
|
||||||
openDrawer(true, {
|
|
||||||
record,
|
|
||||||
isUpdate: true,
|
|
||||||
});
|
|
||||||
}
|
}
|
||||||
async function classifyEdit(record) {
|
async function classifyEdit(record) {
|
||||||
openDrawer(true, {
|
openDrawer(true, {
|
||||||
|
|
|
||||||
|
|
@ -4,7 +4,7 @@
|
||||||
<a-button type="primary" :icon="h(SaveOutlined)" @click="onSave" class="ml-2">保存流程 </a-button>
|
<a-button type="primary" :icon="h(SaveOutlined)" @click="onSave" class="ml-2">保存流程 </a-button>
|
||||||
</div>
|
</div>
|
||||||
<process-designer :key="designerOpen" style="border:1px solid rgba(0, 0, 0, 0.1);" ref="modelDesigner"
|
<process-designer :key="designerOpen" style="border:1px solid rgba(0, 0, 0, 0.1);" ref="modelDesigner"
|
||||||
v-loading="designerData.loading" :bpmnXml="designerData.bpmnXml" :designerForm="designerData.form"
|
v-loading="designerData.loading" :bpmnXml="designerData.bpmnXml" :designerForm="designerData.form" :schemeCode="schemeCode"
|
||||||
@save="onSaveDesigner" />
|
@save="onSaveDesigner" />
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
|
|
@ -14,6 +14,10 @@
|
||||||
import { h, ref, provide, reactive, onMounted, defineProps, computed, defineEmits } from 'vue';
|
import { h, ref, provide, reactive, onMounted, defineProps, computed, defineEmits } from 'vue';
|
||||||
import ProcessDesigner from '@/components/ProcessDesigner/index.vue';
|
import ProcessDesigner from '@/components/ProcessDesigner/index.vue';
|
||||||
import { SaveOutlined, ZoomOutOutlined, ZoomInOutlined, RotateLeftOutlined, RotateRightOutlined, ClearOutlined } from '@ant-design/icons-vue';
|
import { SaveOutlined, ZoomOutOutlined, ZoomInOutlined, RotateLeftOutlined, RotateRightOutlined, ClearOutlined } from '@ant-design/icons-vue';
|
||||||
|
import { postAdd ,update} from '@/api/sys/WFSchemeInfo'
|
||||||
|
import { useRoute } from 'vue-router'
|
||||||
|
const route = useRoute()
|
||||||
|
const schemeCode = route.query.code
|
||||||
const designerOpen = ref(false)
|
const designerOpen = ref(false)
|
||||||
const designerData = reactive({
|
const designerData = reactive({
|
||||||
loading: false,
|
loading: false,
|
||||||
|
|
@ -25,8 +29,17 @@
|
||||||
}
|
}
|
||||||
})
|
})
|
||||||
const modelDesigner = ref < any > ()
|
const modelDesigner = ref < any > ()
|
||||||
function onSave() {
|
async function onSave() {
|
||||||
let formData = modelDesigner.value.getFlow()
|
let validateData = await modelDesigner.value.validateFlow()
|
||||||
|
if (validateData) {
|
||||||
|
let formData = await modelDesigner.value.getFlow()
|
||||||
|
formData.scheme.type = 1
|
||||||
|
if(!schemeCode){
|
||||||
|
let data = await postAdd(formData)
|
||||||
|
}else{
|
||||||
|
let data = await update(formData)
|
||||||
|
}
|
||||||
|
}
|
||||||
}
|
}
|
||||||
</script>
|
</script>
|
||||||
<style scoped>
|
<style scoped>
|
||||||
|
|
|
||||||
Loading…
Reference in New Issue