封装流程属性面板组件：流程属性、发起权限、开始节点。封装全局组件：选择角色和选择账号。
parent
7caecfbac7
commit
1a51ad1c7b
|
|
@ -7,7 +7,7 @@
|
||||||
'connection.changed'
|
'connection.changed'
|
||||||
]" @element-click="elementClick" @init-finished="initModeler" @event="handlerEvent" @save="onSaveProcess" />
|
]" @element-click="elementClick" @init-finished="initModeler" @event="handlerEvent" @save="onSaveProcess" />
|
||||||
<!-- 属性面板 -->
|
<!-- 属性面板 -->
|
||||||
<bmpn-process-penal :bpmn-modeler="data.modeler" :prefix="data.controlForm.prefix" class="process-panel" />
|
<bmpn-process-penal :element="data.element" :bpmn-modeler="data.modeler" :prefix="data.controlForm.prefix" class="process-panel" />
|
||||||
</div>
|
</div>
|
||||||
</template>
|
</template>
|
||||||
|
|
||||||
|
|
@ -61,7 +61,7 @@
|
||||||
}
|
}
|
||||||
</script>
|
</script>
|
||||||
|
|
||||||
<style lang="scss">
|
<style lang="scss" scoped>
|
||||||
body {
|
body {
|
||||||
overflow: auto !important;
|
overflow: auto !important;
|
||||||
margin: 0;
|
margin: 0;
|
||||||
|
|
@ -108,4 +108,7 @@
|
||||||
-webkit-border-radius: 4px;
|
-webkit-border-radius: 4px;
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
.process-panel{
|
||||||
|
height: 100%;
|
||||||
|
}
|
||||||
</style>
|
</style>
|
||||||
|
|
@ -43,7 +43,7 @@
|
||||||
</template>
|
</template>
|
||||||
|
|
||||||
<script lang="ts" setup>
|
<script lang="ts" setup>
|
||||||
import { h, reactive, onMounted, defineProps, computed, defineEmits } from 'vue';
|
import { h,provide, reactive, onMounted, defineProps, computed, defineEmits } from '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 BpmnModeler from "bpmn-js/lib/Modeler";
|
import BpmnModeler from "bpmn-js/lib/Modeler";
|
||||||
|
|
@ -150,6 +150,8 @@
|
||||||
// 注册需要的监听事件, 将. 替换为 - , 避免解析异常
|
// 注册需要的监听事件, 将. 替换为 - , 避免解析异常
|
||||||
props.events.forEach(event => {
|
props.events.forEach(event => {
|
||||||
EventBus.on(event, function (eventObj) {
|
EventBus.on(event, function (eventObj) {
|
||||||
|
console.log(eventObj)
|
||||||
|
provide('wfdesign',eventObj)
|
||||||
let eventName = event.replace(/\./g, "-");
|
let eventName = event.replace(/\./g, "-");
|
||||||
let element = eventObj ? eventObj.element : null;
|
let element = eventObj ? eventObj.element : null;
|
||||||
emit(eventName, element, eventObj);
|
emit(eventName, element, eventObj);
|
||||||
|
|
|
||||||
|
|
@ -1,6 +1,26 @@
|
||||||
|
<!--
|
||||||
|
* @Author: 刘妍
|
||||||
|
* @Date: 2024-03-05 17:09:44
|
||||||
|
* @LastEditors: Do not edit
|
||||||
|
* @LastEditTime: 2024-03-07 14:48:08
|
||||||
|
* @Description:
|
||||||
|
-->
|
||||||
<template>
|
<template>
|
||||||
<div class="process-panel__container" :style="{ width: `${props.width}px` }">
|
<div :class="prefixCls" :style="{ width: `${props.width}px` }">
|
||||||
属性面板
|
<a-tabs v-model:activeKey="activeKey">
|
||||||
|
<a-tab-pane key="1" tab="流程属性">
|
||||||
|
<shcemeinfo-config ref="shcemeinfo" :disabled="true"></shcemeinfo-config>
|
||||||
|
</a-tab-pane>
|
||||||
|
<a-tab-pane key="2" tab="发起权限" force-render>
|
||||||
|
<auth-config ref="auth"></auth-config>
|
||||||
|
</a-tab-pane>
|
||||||
|
<a-tab-pane key="3" tab="开始节点">
|
||||||
|
<start-event-option ref="start" :element="data.elementData"></start-event-option>
|
||||||
|
</a-tab-pane>
|
||||||
|
<!-- <a-tab-pane key="4" tab="审核节点">
|
||||||
|
<user-task-option ref="task"></user-task-option>
|
||||||
|
</a-tab-pane> -->
|
||||||
|
</a-tabs>
|
||||||
<!-- <el-tabs v-model="configActiveName" :stretch="true">
|
<!-- <el-tabs v-model="configActiveName" :stretch="true">
|
||||||
<el-tab-pane :label="$t(wfNodeName[currentWfNode.type])" name="tab01" v-if="currentWfNode != undefined">
|
<el-tab-pane :label="$t(wfNodeName[currentWfNode.type])" name="tab01" v-if="currentWfNode != undefined">
|
||||||
<component :disabled="true" ref="wfcongfig" :is="`${currentWfNode.type}Option`"></component>
|
<component :disabled="true" ref="wfcongfig" :is="`${currentWfNode.type}Option`"></component>
|
||||||
|
|
@ -17,38 +37,32 @@
|
||||||
<shcemeinfo-config ref="shcemeinfo" :disabled="true"></shcemeinfo-config>
|
<shcemeinfo-config ref="shcemeinfo" :disabled="true"></shcemeinfo-config>
|
||||||
</Tabs.TabPane>
|
</Tabs.TabPane>
|
||||||
</Tabs> -->
|
</Tabs> -->
|
||||||
<!-- <Tabs>
|
|
||||||
<template v-for="item in achieveList" :key="item.key">
|
|
||||||
<Tabs.TabPane :tab="item.name">
|
|
||||||
<component :is="tabs[item.component]" />
|
|
||||||
<component :is="ElementBaseInfo" />
|
|
||||||
<element-base-info :id-edit-disabled="idEditDisabled" :business-object="data.elementBusinessObject"
|
|
||||||
:type="data.elementType" />
|
|
||||||
</Tabs.TabPane>
|
|
||||||
</template>
|
|
||||||
</Tabs> -->
|
|
||||||
|
|
||||||
</div>
|
</div>
|
||||||
</template>
|
</template>
|
||||||
<script lang="ts" setup>
|
<script lang="ts" setup>
|
||||||
import { h, reactive, onMounted, defineProps, computed, defineEmits, provide, watch, ref } from 'vue';
|
import { h, reactive, onMounted, defineProps, computed, defineEmits, provide, watch, ref } from '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 { Tabs } from 'ant-design-vue';
|
import { Tabs } from 'ant-design-vue';
|
||||||
|
import { PageWrapper } from '@/components/Page';
|
||||||
|
import { useDesign } from '@/hooks/web/useDesign';
|
||||||
|
const { prefixCls } = useDesign('process-property');
|
||||||
|
|
||||||
|
|
||||||
// 流程属性
|
// 流程属性
|
||||||
import shcemeinfoConfig from './config/shcemeInfo.vue'
|
import shcemeinfoConfig from './shcemeInfo/index.vue'
|
||||||
|
// 发起权限
|
||||||
|
import authConfig from './auth/index.vue'
|
||||||
// 开始节点
|
// 开始节点
|
||||||
import startEventOption from './config/startEvent.vue'
|
import startEventOption from './startEvent/index.vue'
|
||||||
|
// 审核节点
|
||||||
|
import userTaskOption from './userTask/index.vue'
|
||||||
// 结束节点
|
// 结束节点
|
||||||
import endEventOption from './config/endEvent.vue'
|
import endEventOption from './config/endEvent.vue'
|
||||||
|
|
||||||
import gatewayAndOption from './config/gatewayAnd.vue'
|
import gatewayAndOption from './config/gatewayAnd.vue'
|
||||||
import gatewayInclusiveOption from './config/gatewayInclusive.vue'
|
import gatewayInclusiveOption from './config/gatewayInclusive.vue'
|
||||||
import gatewayXorOption from './config/gatewayXor.vue'
|
import gatewayXorOption from './config/gatewayXor.vue'
|
||||||
import scriptTaskOption from './config/scriptTask.vue'
|
import scriptTaskOption from './config/scriptTask.vue'
|
||||||
import subprocessOption from './config/subprocess.vue'
|
import subprocessOption from './config/subprocess.vue'
|
||||||
import userTaskOption from './config/userTask.vue'
|
|
||||||
import mylineOption from './config/myline.vue'
|
import mylineOption from './config/myline.vue'
|
||||||
/**
|
/**
|
||||||
* 侧边栏
|
* 侧边栏
|
||||||
|
|
@ -64,16 +78,18 @@
|
||||||
},
|
},
|
||||||
width: {
|
width: {
|
||||||
type: Number,
|
type: Number,
|
||||||
default: 480
|
default: 520
|
||||||
},
|
},
|
||||||
idEditDisabled: {
|
idEditDisabled: {
|
||||||
type: Boolean,
|
type: Boolean,
|
||||||
default: false
|
default: false
|
||||||
}
|
},
|
||||||
|
element: Object
|
||||||
})
|
})
|
||||||
console.log(props)
|
|
||||||
provide('prefix', props.prefix)
|
provide('prefix', props.prefix)
|
||||||
provide('width', props.width)
|
provide('width', props.width)
|
||||||
|
const activeKey = ref("1")
|
||||||
const data = reactive({
|
const data = reactive({
|
||||||
configActiveName: 'tab02',
|
configActiveName: 'tab02',
|
||||||
currentWfNode: undefined,
|
currentWfNode: undefined,
|
||||||
|
|
@ -88,8 +104,14 @@
|
||||||
subprocess: '子流程',
|
subprocess: '子流程',
|
||||||
myline: '线条'
|
myline: '线条'
|
||||||
},
|
},
|
||||||
|
elementData:{}
|
||||||
})
|
})
|
||||||
|
watch(
|
||||||
|
() => props.element,
|
||||||
|
(newVal, oldVal) => {
|
||||||
|
data.elementData = newVal
|
||||||
|
}
|
||||||
|
)
|
||||||
const achieveList = ref([
|
const achieveList = ref([
|
||||||
{
|
{
|
||||||
key: '1',
|
key: '1',
|
||||||
|
|
@ -107,4 +129,22 @@
|
||||||
startEventOption,
|
startEventOption,
|
||||||
};
|
};
|
||||||
|
|
||||||
</script>
|
</script>
|
||||||
|
<style lang="less" scoped>
|
||||||
|
@prefix-cls: ~'@{namespace}-process-property';
|
||||||
|
|
||||||
|
.@{prefix-cls} {
|
||||||
|
background-color: @component-background;
|
||||||
|
}
|
||||||
|
|
||||||
|
::v-deep .ant-tabs {
|
||||||
|
height: 100%;
|
||||||
|
width: 100%;
|
||||||
|
padding: 0 20px;
|
||||||
|
|
||||||
|
}
|
||||||
|
|
||||||
|
::v-deep .ant-tabs-content-holder {
|
||||||
|
overflow-y: auto;
|
||||||
|
}
|
||||||
|
</style>
|
||||||
|
|
@ -0,0 +1,191 @@
|
||||||
|
<!--
|
||||||
|
* @Author: 刘妍
|
||||||
|
* @Date: 2024-03-05 17:09:44
|
||||||
|
* @LastEditors: Do not edit
|
||||||
|
* @LastEditTime: 2024-03-07 10:46:55
|
||||||
|
* @Description:
|
||||||
|
-->
|
||||||
|
<template>
|
||||||
|
<div class="auth-config">
|
||||||
|
<a-tabs v-model:activeKey="f_AuthType" type="card" size="small">
|
||||||
|
<a-tab-pane key="1" tab="所有成员">
|
||||||
|
<a-alert message="权限说明" description="所有人员指不限制流程模版的发起人员，表示每个人都能发起该流程模版。" type="info" show-icon />
|
||||||
|
</a-tab-pane>
|
||||||
|
<a-tab-pane key="2" tab="指定成员">
|
||||||
|
<a-space>
|
||||||
|
<a-radio-group>
|
||||||
|
<a-radio-button value="1" @click="handlePostClick">岗位</a-radio-button>
|
||||||
|
<a-radio-button value="2" @click="handleRoleClick">角色</a-radio-button>
|
||||||
|
<a-radio-button value="3" @click="handleAccountClick">用户</a-radio-button>
|
||||||
|
</a-radio-group>
|
||||||
|
<a-button danger :size="size">清空</a-button>
|
||||||
|
</a-space>
|
||||||
|
<a-table :columns="columns" :data-source="dataSource" bordered :pagination="false">
|
||||||
|
<template #bodyCell="{ column, text, record }">
|
||||||
|
<template v-if="['name', 'type'].includes(column.dataIndex)">
|
||||||
|
<div>
|
||||||
|
{{ text }}
|
||||||
|
</div>
|
||||||
|
</template>
|
||||||
|
<template v-else-if="column.dataIndex === 'operation'">
|
||||||
|
<a-popconfirm v-if="dataSource.length" title="Sure to delete?"
|
||||||
|
@confirm="onDelete(record.key)">
|
||||||
|
<a>Delete</a>
|
||||||
|
</a-popconfirm>
|
||||||
|
</template>
|
||||||
|
</template>
|
||||||
|
</a-table>
|
||||||
|
</a-tab-pane>
|
||||||
|
</a-tabs>
|
||||||
|
<a-modal width="60%" v-model:open="data.postOpen" title="添加岗位" @ok="postHandleOk">
|
||||||
|
<BasicTree ref="asyncExpandTreeRef" title="部门和职级列表" toolbar
|
||||||
|
treeWrapperClassName="h-[calc(100%-35px)] overflow-auto" loadData :clickRowToExpand="false"
|
||||||
|
:treeData="treeData" :fieldNames="{ key: 'id', title: 'name' ,disabled:'disabled'}"
|
||||||
|
:defaultExpandAll="true" :checkable="true" :checkStrictly="true" @check="handleSelect" />
|
||||||
|
|
||||||
|
</a-modal>
|
||||||
|
<a-modal width="60%" v-model:open="data.roleOpen" title="添加角色" @ok="roleHandleOk">
|
||||||
|
<SelectRole ref="roleRef"></SelectRole>
|
||||||
|
</a-modal>
|
||||||
|
<a-modal width="60%" v-model:open="data.accountOpen" title="添加角色" @ok="accountHandleOk">
|
||||||
|
<SelectAccount ref="accountRef"></SelectAccount>
|
||||||
|
</a-modal>
|
||||||
|
</div>
|
||||||
|
</template>
|
||||||
|
|
||||||
|
<script lang="ts" setup>
|
||||||
|
import { reactive, ref, onMounted, nextTick, unref } from 'vue';
|
||||||
|
const f_AuthType = ref("1")
|
||||||
|
import { cloneDeep } from 'lodash-es';
|
||||||
|
import type { UnwrapRef } from 'vue';
|
||||||
|
import { BasicTree, TreeItem } from '@/components/Tree';
|
||||||
|
import SelectRole from '@/components/SelectRole/index.vue';
|
||||||
|
import SelectAccount from '@/components/SelectAccount/index.vue';
|
||||||
|
import { getOrgPositonTree, userOrgs } from '@/api/demo/system';
|
||||||
|
const columns = [
|
||||||
|
{
|
||||||
|
title: '名称',
|
||||||
|
dataIndex: 'name',
|
||||||
|
},
|
||||||
|
{
|
||||||
|
title: '类型',
|
||||||
|
dataIndex: 'type',
|
||||||
|
},
|
||||||
|
{
|
||||||
|
title: '操作',
|
||||||
|
dataIndex: 'operation',
|
||||||
|
},
|
||||||
|
|
||||||
|
];
|
||||||
|
const dataSource = [
|
||||||
|
{
|
||||||
|
id: 0,
|
||||||
|
name: "王五",
|
||||||
|
type: "管理员",
|
||||||
|
},
|
||||||
|
{
|
||||||
|
id: 1,
|
||||||
|
name: "王五",
|
||||||
|
type: "管理员",
|
||||||
|
},
|
||||||
|
]
|
||||||
|
onMounted(() => {
|
||||||
|
fetch();
|
||||||
|
});
|
||||||
|
const data = reactive({
|
||||||
|
postOpen: false,
|
||||||
|
roleOpen: false,
|
||||||
|
accountOpen: false,
|
||||||
|
})
|
||||||
|
// 岗位
|
||||||
|
function handlePostClick() {
|
||||||
|
data.postOpen = true;
|
||||||
|
}
|
||||||
|
const treeData = ref < TreeItem[] > ([]);
|
||||||
|
const asyncExpandTreeRef = ref < Nullable < TreeActionType >> (null);
|
||||||
|
const posData = ref([])
|
||||||
|
function treeIterator(tree) {
|
||||||
|
tree.forEach((node) => {
|
||||||
|
if (node.key == 0) {
|
||||||
|
node.name = "部门--" + node.name
|
||||||
|
node.disableCheckbox = true
|
||||||
|
} else {
|
||||||
|
node.name = "职级--" + node.name
|
||||||
|
// 需要拼接parentName
|
||||||
|
posData.value.push(node)
|
||||||
|
}
|
||||||
|
node.children && treeIterator(node.children)
|
||||||
|
})
|
||||||
|
}
|
||||||
|
async function fetch() {
|
||||||
|
const data = (await getOrgPositonTree()) as unknown as TreeItem[];
|
||||||
|
treeIterator(data)
|
||||||
|
treeData.value = await data
|
||||||
|
// 展开全部
|
||||||
|
nextTick(() => {
|
||||||
|
unref(asyncExpandTreeRef)?.expandAll(true);
|
||||||
|
});
|
||||||
|
}
|
||||||
|
let orgList = ref([])
|
||||||
|
let posList = ref([])
|
||||||
|
function handleSelect(checkedKeys, e: { checked: bool, checkedNodes, node, event }) {
|
||||||
|
const list = e.checkedNodes
|
||||||
|
console.log(e.node)
|
||||||
|
console.log(checkedKeys)
|
||||||
|
orgList.value = []
|
||||||
|
posList.value = []
|
||||||
|
list.forEach(element => {
|
||||||
|
if (element.key > 0) {
|
||||||
|
posList.value.push({
|
||||||
|
orgId: Number(element.tag),
|
||||||
|
posId: element.id,
|
||||||
|
})
|
||||||
|
} else {
|
||||||
|
orgList.value.push({
|
||||||
|
orgId: element.id,
|
||||||
|
posId: 0,
|
||||||
|
})
|
||||||
|
}
|
||||||
|
});
|
||||||
|
}
|
||||||
|
function postHandleOk() {
|
||||||
|
console.log(posData.value)
|
||||||
|
console.log(unref(asyncExpandTreeRef)?.getCheckedKeys())
|
||||||
|
}
|
||||||
|
// 角色
|
||||||
|
const roleRef = ref < any > ()
|
||||||
|
|
||||||
|
function handleRoleClick() {
|
||||||
|
data.roleOpen = true;
|
||||||
|
}
|
||||||
|
function roleHandleOk() {
|
||||||
|
console.log(roleRef.value.getRow())
|
||||||
|
}
|
||||||
|
// 用户
|
||||||
|
const accountRef = ref < any > ()
|
||||||
|
|
||||||
|
function handleAccountClick() {
|
||||||
|
data.accountOpen = true;
|
||||||
|
}
|
||||||
|
function accountHandleOk() {
|
||||||
|
console.log(accountRef.value.getRow())
|
||||||
|
}
|
||||||
|
|
||||||
|
</script>
|
||||||
|
<style lang="less" scoped>
|
||||||
|
.site-space-compact-wrapper {
|
||||||
|
width: 100%;
|
||||||
|
|
||||||
|
.ant-select {
|
||||||
|
width: 100%;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
::v-deep .ant-tabs {
|
||||||
|
padding: 0 !important;
|
||||||
|
}
|
||||||
|
|
||||||
|
::v-deep .ant-table-content {
|
||||||
|
margin-top: 10px;
|
||||||
|
}
|
||||||
|
</style>
|
||||||
|
|
@ -1,196 +0,0 @@
|
||||||
<template>
|
|
||||||
<l-layout >
|
|
||||||
<template #top>
|
|
||||||
<div style="text-align: center;padding-top:16px;" >
|
|
||||||
<el-radio-group v-model="formData.f_AuthType" size="mini">
|
|
||||||
<el-radio-button label="1">所有成员</el-radio-button>
|
|
||||||
<el-radio-button label="2">指定成员</el-radio-button>
|
|
||||||
</el-radio-group>
|
|
||||||
</div>
|
|
||||||
</template>
|
|
||||||
|
|
||||||
<div v-if="formData.f_AuthType == 1" style="padding:0 16px;">
|
|
||||||
<el-alert
|
|
||||||
title="权限说明"
|
|
||||||
type="info"
|
|
||||||
description="所有人员指不限制流程模版的发起人员，表示每个人都能发起该流程模版。"
|
|
||||||
show-icon
|
|
||||||
:closable="false"
|
|
||||||
>
|
|
||||||
</el-alert>
|
|
||||||
</div>
|
|
||||||
<template v-else-if="formData.f_AuthType == 2" >
|
|
||||||
<l-layout :top="40">
|
|
||||||
<template #top>
|
|
||||||
<div style="padding-left:8px;float:left;" >
|
|
||||||
<el-button-group>
|
|
||||||
<el-button size="mini" icon="el-icon-plus" @click="handlePostClick">{{$t('岗位')}}</el-button>
|
|
||||||
<el-button size="mini" icon="el-icon-plus" @click="handleRoleClick">{{$t('角色')}}</el-button>
|
|
||||||
<el-button size="mini" icon="el-icon-plus" @click="handleUserClick">{{$t('用户')}}</el-button>
|
|
||||||
</el-button-group>
|
|
||||||
</div>
|
|
||||||
<div style="padding-right:8px;float:right;">
|
|
||||||
<el-button size="mini" type="danger" icon="el-icon-delete" @click="handleClearClick">{{$t('清空')}}</el-button>
|
|
||||||
</div>
|
|
||||||
</template>
|
|
||||||
<l-table :columns="columns" :dataSource="tableData" >
|
|
||||||
<template v-slot:type="scope" >
|
|
||||||
{{typeFormat(scope.row.type)}}
|
|
||||||
</template>
|
|
||||||
<l-table-btns :btns="tableBtns" @click="handleTableBtnClick" ></l-table-btns>
|
|
||||||
</l-table>
|
|
||||||
</l-layout>
|
|
||||||
|
|
||||||
</template>
|
|
||||||
<l-dialog
|
|
||||||
:title="$t('添加岗位')"
|
|
||||||
:visible.sync="selectPostVisible"
|
|
||||||
:height="480"
|
|
||||||
width="1024px"
|
|
||||||
|
|
||||||
@ok="handlePostSelectOk"
|
|
||||||
@closed="handlePostSelectClosed"
|
|
||||||
>
|
|
||||||
<l-post-select-panel ref="postSelectPanel" ></l-post-select-panel>
|
|
||||||
</l-dialog>
|
|
||||||
|
|
||||||
<l-dialog
|
|
||||||
:title="$t('添加角色')"
|
|
||||||
:visible.sync="selectRoleVisible"
|
|
||||||
:height="480"
|
|
||||||
width="800px"
|
|
||||||
|
|
||||||
@ok="handleRoleSelectOk"
|
|
||||||
@closed="handleRoleSelectClosed"
|
|
||||||
>
|
|
||||||
<l-role-select-panel ref="roleSelectPanel" ></l-role-select-panel>
|
|
||||||
</l-dialog>
|
|
||||||
|
|
||||||
<l-dialog
|
|
||||||
:title="$t('用户岗位')"
|
|
||||||
:visible.sync="selectUserVisible"
|
|
||||||
:height="480"
|
|
||||||
width="1024px"
|
|
||||||
|
|
||||||
@ok="handleUserSelectOk"
|
|
||||||
@closed="handleUserSelectClosed"
|
|
||||||
>
|
|
||||||
<l-user-select-panel ref="userSelectPanel" ></l-user-select-panel>
|
|
||||||
</l-dialog>
|
|
||||||
</l-layout>
|
|
||||||
</template>
|
|
||||||
|
|
||||||
<script>
|
|
||||||
export default {
|
|
||||||
name: 'auth-config',
|
|
||||||
data () {
|
|
||||||
return {
|
|
||||||
columns:[
|
|
||||||
{label:'类型',prop:'type',width:'60', align: 'center'},
|
|
||||||
{label:'名称',prop:'name',minWidth:'100'},
|
|
||||||
],
|
|
||||||
tableBtns:[
|
|
||||||
{prop:'Delete',label:'删除'}
|
|
||||||
],
|
|
||||||
tableData:[],
|
|
||||||
formData:{
|
|
||||||
f_AuthType:1
|
|
||||||
},
|
|
||||||
selectPostVisible:false,
|
|
||||||
selectRoleVisible:false,
|
|
||||||
selectUserVisible:false
|
|
||||||
}
|
|
||||||
},
|
|
||||||
|
|
||||||
computed: {
|
|
||||||
|
|
||||||
},
|
|
||||||
created () {
|
|
||||||
this.lr_loadDblink()
|
|
||||||
},
|
|
||||||
methods: {
|
|
||||||
handlePostClick(){
|
|
||||||
this.selectPostVisible = true;
|
|
||||||
},
|
|
||||||
handlePostSelectClosed(){
|
|
||||||
this.$refs.postSelectPanel.resetForm();
|
|
||||||
},
|
|
||||||
handlePostSelectOk(){
|
|
||||||
let selectData = this.$refs.postSelectPanel.getForm().map(t=>{return {type:1,id:t.f_PostId,name:t.name} });
|
|
||||||
this.addTableData(selectData);
|
|
||||||
this.selectPostVisible = false;
|
|
||||||
},
|
|
||||||
|
|
||||||
handleRoleClick(){
|
|
||||||
this.selectRoleVisible = true;
|
|
||||||
},
|
|
||||||
handleRoleSelectClosed(){
|
|
||||||
this.$refs.roleSelectPanel.resetForm();
|
|
||||||
},
|
|
||||||
handleRoleSelectOk(){
|
|
||||||
let selectData = this.$refs.roleSelectPanel.getForm().map(t=>{return {type:2,id:t.f_RoleId,name:t.f_FullName} });
|
|
||||||
this.addTableData(selectData);
|
|
||||||
this.selectRoleVisible = false;
|
|
||||||
},
|
|
||||||
|
|
||||||
handleUserClick(){
|
|
||||||
this.selectUserVisible = true;
|
|
||||||
},
|
|
||||||
handleUserSelectClosed(){
|
|
||||||
this.$refs.userSelectPanel.resetForm();
|
|
||||||
},
|
|
||||||
handleUserSelectOk(){
|
|
||||||
let selectData = this.$refs.userSelectPanel.getForm().map(t=>{return {type:3,id:t.f_UserId,name:t.name} });
|
|
||||||
this.addTableData(selectData);
|
|
||||||
this.selectUserVisible = false;
|
|
||||||
},
|
|
||||||
|
|
||||||
|
|
||||||
addTableData(selectData){
|
|
||||||
let addData = selectData.filter(t=>this.tableData.findIndex(t2=>t2.id == t.id) == -1 );
|
|
||||||
this.tableData = this.tableData.concat(addData);
|
|
||||||
},
|
|
||||||
handleTableBtnClick(btn){
|
|
||||||
this.tableData.splice(btn.rowIndex,1);
|
|
||||||
},
|
|
||||||
handleClearClick(){
|
|
||||||
this.tableData = [];
|
|
||||||
},
|
|
||||||
typeFormat(type){
|
|
||||||
switch(type){
|
|
||||||
case 1:
|
|
||||||
return '岗位'
|
|
||||||
case 2:
|
|
||||||
return '角色'
|
|
||||||
case 3:
|
|
||||||
return '用户'
|
|
||||||
}
|
|
||||||
},
|
|
||||||
|
|
||||||
|
|
||||||
resetForm(){
|
|
||||||
this.$refs.form && this.$refs.form.resetFields();
|
|
||||||
this.tableData = [];
|
|
||||||
},
|
|
||||||
// 校验表单
|
|
||||||
validateForm(callback){
|
|
||||||
this.$refs.form.validate((valid) => {
|
|
||||||
if(valid){
|
|
||||||
callback();
|
|
||||||
}
|
|
||||||
});
|
|
||||||
},
|
|
||||||
setForm(data){
|
|
||||||
this.formData.f_AuthType = data.f_AuthType;
|
|
||||||
this.tableData = data.authData;
|
|
||||||
},
|
|
||||||
getForm(){
|
|
||||||
return {
|
|
||||||
f_AuthType:this.formData.f_AuthType,
|
|
||||||
authData:this.tableData
|
|
||||||
}
|
|
||||||
}
|
|
||||||
}
|
|
||||||
}
|
|
||||||
</script>
|
|
||||||
|
|
||||||
|
|
@ -1,284 +0,0 @@
|
||||||
<template>
|
|
||||||
<el-form class="l-form-config" label-width="96px" label-position="left" size="mini" :model="formData" :rules="rules"
|
|
||||||
ref="form">
|
|
||||||
<el-form-item v-if="!disabled" label="模板编号" prop="f_Code">
|
|
||||||
<el-input v-model="formData.f_Code" placeholder="请输入"></el-input>
|
|
||||||
</el-form-item>
|
|
||||||
<el-form-item v-if="!disabled" label="模板名称" prop="f_Name">
|
|
||||||
<el-input v-model="formData.f_Name" placeholder="请输入"></el-input>
|
|
||||||
</el-form-item>
|
|
||||||
<el-form-item v-if="!disabled" label="模板图标" prop="f_Icon">
|
|
||||||
<l-input-icon onlyFirst v-model="formData.f_Icon"></l-input-icon>
|
|
||||||
</el-form-item>
|
|
||||||
<el-form-item v-if="!disabled" label="图标颜色" prop="f_Color">
|
|
||||||
<l-input-color v-model="formData.f_Color" placeholder="请输入"></l-input-color>
|
|
||||||
</el-form-item>
|
|
||||||
<el-form-item v-if="!disabled" label="模板分类" prop="f_Category">
|
|
||||||
<el-select v-model="formData.f_Category" placeholder="请选择">
|
|
||||||
<el-option v-for="item in lr_dataItem['FlowSort']" :key="item.f_ItemValue" :label="item.f_ItemName"
|
|
||||||
:value="item.f_ItemValue">
|
|
||||||
</el-option>
|
|
||||||
</el-select>
|
|
||||||
</el-form-item>
|
|
||||||
<!--<el-form-item label="任务命名规则" prop="titleRules">
|
|
||||||
<el-input v-model="formData.titleRules" readonly="readonly"
|
|
||||||
placeholder="请输入任务命名规则">
|
|
||||||
<el-button slot="append" icon="el-icon-setting" @click="handleTitleRulesClick"></el-button>
|
|
||||||
</el-input>
|
|
||||||
</el-form-item>-->
|
|
||||||
<el-form-item v-if="!disabled" label="我的任务创建" prop="f_Mark">
|
|
||||||
<l-radio v-model="formData.f_Mark" :options="optionsNotOrOk"></l-radio>
|
|
||||||
</el-form-item>
|
|
||||||
<el-form-item v-if="!disabled" label="移动端创建" prop="f_IsInApp">
|
|
||||||
<l-radio v-model="formData.f_IsInApp" :options="optionsNotOrOk"></l-radio>
|
|
||||||
</el-form-item>
|
|
||||||
<el-form-item v-if="!disabled" prop="f_Description" label-width="0">
|
|
||||||
<el-input type="textarea" rows="4" v-model="formData.f_Description" placeholder="请填写备注"></el-input>
|
|
||||||
</el-form-item>
|
|
||||||
|
|
||||||
<el-divider>撤销操作</el-divider>
|
|
||||||
<div style="text-align: center;margin-bottom:16px;">
|
|
||||||
<el-radio-group v-model="formData.undoType" size="mini" :disabled="disabled">
|
|
||||||
<el-radio-button label="1">执行SQL</el-radio-button>
|
|
||||||
<el-radio-button label="2">.NET方法</el-radio-button>
|
|
||||||
<el-radio-button label="3">第三方接口</el-radio-button>
|
|
||||||
</el-radio-group>
|
|
||||||
</div>
|
|
||||||
<!--执行SQL-->
|
|
||||||
<div v-if="formData.undoType == '1'">
|
|
||||||
<el-form-item prop="undoDbCode" label-width="0">
|
|
||||||
<el-select :disabled="disabled" v-model="formData.undoDbCode" placeholder="请选择执行SQL数据库">
|
|
||||||
<el-option-group v-for="group in lr_dblinkTree" :key="group.id" :label="group.label">
|
|
||||||
<el-option v-for="item in group.children" :key="item.id" :label="item.label" :value="item.id">
|
|
||||||
</el-option>
|
|
||||||
</el-option-group>
|
|
||||||
</el-select>
|
|
||||||
</el-form-item>
|
|
||||||
<el-form-item prop="undoDbSQL" label-width="0">
|
|
||||||
<el-input :readonly="disabled" type="textarea" v-model="formData.undoDbSQL" rows="8"
|
|
||||||
placeholder="请填写SQL语句，参数有 @processId流程进程主键 @userId用户Id @userAccount用户账号 @companyId用户公司 @departmentId用户部门">
|
|
||||||
</el-input>
|
|
||||||
</el-form-item>
|
|
||||||
</div>
|
|
||||||
<!--.NET方法-->
|
|
||||||
<div v-else-if="formData.undoType == '2'">
|
|
||||||
<el-form-item prop="undoIOCName" label-width="0">
|
|
||||||
<el-input :readonly="disabled" v-model="formData.undoIOCName" placeholder="请填写.NET方法IOC别名"></el-input>
|
|
||||||
</el-form-item>
|
|
||||||
</div>
|
|
||||||
<!--第三方接口-->
|
|
||||||
<div v-else-if="formData.undoType == '3'">
|
|
||||||
<el-form-item prop="undoUrl" label-width="0">
|
|
||||||
<el-input :readonly="disabled" type="textarea" rows="4" v-model="formData.undoUrl"
|
|
||||||
placeholder="请填写第三方接口地址(POST),JSON 格式,参数有 userId用户Id,userAccount用户账号,companyId用户公司,departmentId用户部门">
|
|
||||||
</el-input>
|
|
||||||
</el-form-item>
|
|
||||||
</div>
|
|
||||||
|
|
||||||
<el-divider>作废操作</el-divider>
|
|
||||||
<div style="text-align: center;margin-bottom:16px;">
|
|
||||||
<el-radio-group v-model="formData.deleteType" size="mini" :disabled="disabled">
|
|
||||||
<el-radio-button label="1">执行SQL</el-radio-button>
|
|
||||||
<el-radio-button label="2">.NET方法</el-radio-button>
|
|
||||||
<el-radio-button label="3">第三方接口</el-radio-button>
|
|
||||||
</el-radio-group>
|
|
||||||
</div>
|
|
||||||
<!--执行SQL-->
|
|
||||||
<div v-if="formData.deleteType == '1'">
|
|
||||||
<el-form-item prop="deleteDbCode" label-width="0">
|
|
||||||
<el-select v-model="formData.deleteDbCode" placeholder="请选择执行SQL数据库" :disabled="disabled">
|
|
||||||
<el-option-group v-for="group in lr_dblinkTree" :key="group.id" :label="group.label">
|
|
||||||
<el-option v-for="item in group.children" :key="item.id" :label="item.label" :value="item.id">
|
|
||||||
</el-option>
|
|
||||||
</el-option-group>
|
|
||||||
</el-select>
|
|
||||||
</el-form-item>
|
|
||||||
<el-form-item prop="deleteDbSQL" label-width="0">
|
|
||||||
<el-input :readonly="disabled" type="textarea" v-model="formData.deleteDbSQL" rows="8"
|
|
||||||
placeholder="请填写SQL语句，参数有 @processId流程进程主键 @userId用户Id @userAccount用户账号 @companyId用户公司 @departmentId用户部门">
|
|
||||||
</el-input>
|
|
||||||
</el-form-item>
|
|
||||||
</div>
|
|
||||||
<!--.NET方法-->
|
|
||||||
<div v-else-if="formData.deleteType == '2'">
|
|
||||||
<el-form-item prop="deleteIOCName" label-width="0">
|
|
||||||
<el-input :readonly="disabled" v-model="formData.deleteIOCName" placeholder="请填写.NET方法IOC别名"></el-input>
|
|
||||||
</el-form-item>
|
|
||||||
</div>
|
|
||||||
<!--第三方接口-->
|
|
||||||
<div v-else-if="formData.deleteType == '3'">
|
|
||||||
<el-form-item prop="deleteUrl" label-width="0">
|
|
||||||
<el-input :readonly="disabled" type="textarea" rows="4" v-model="formData.deleteUrl"
|
|
||||||
placeholder="请填写第三方接口地址(POST),JSON 格式,参数有userId用户Id,userAccount用户账号,companyId用户公司,departmentId用户部门">
|
|
||||||
</el-input>
|
|
||||||
</el-form-item>
|
|
||||||
</div>
|
|
||||||
|
|
||||||
<el-divider>删除草稿</el-divider>
|
|
||||||
<div style="text-align: center;margin-bottom:16px;">
|
|
||||||
<el-radio-group v-model="formData.deleteDraftType" size="mini" :disabled="disabled">
|
|
||||||
<el-radio-button label="1">执行SQL</el-radio-button>
|
|
||||||
<el-radio-button label="2">.NET方法</el-radio-button>
|
|
||||||
<el-radio-button label="3">第三方接口</el-radio-button>
|
|
||||||
</el-radio-group>
|
|
||||||
</div>
|
|
||||||
<!--执行SQL-->
|
|
||||||
<div v-if="formData.deleteDraftType == '1'">
|
|
||||||
<el-form-item prop="deleteDbCode" label-width="0">
|
|
||||||
<el-select v-model="formData.deleteDraftDbCode" placeholder="请选择执行SQL数据库" :disabled="disabled">
|
|
||||||
<el-option-group v-for="group in lr_dblinkTree" :key="group.id" :label="group.label">
|
|
||||||
<el-option v-for="item in group.children" :key="item.id" :label="item.label" :value="item.id">
|
|
||||||
</el-option>
|
|
||||||
</el-option-group>
|
|
||||||
</el-select>
|
|
||||||
</el-form-item>
|
|
||||||
<el-form-item prop="deleteDraftDbSQL" label-width="0">
|
|
||||||
<el-input :readonly="disabled" type="textarea" v-model="formData.deleteDraftDbSQL" rows="8"
|
|
||||||
placeholder="请填写SQL语句，参数有 @processId流程进程主键 @userId用户Id @userAccount用户账号 @companyId用户公司 @departmentId用户部门">
|
|
||||||
</el-input>
|
|
||||||
</el-form-item>
|
|
||||||
</div>
|
|
||||||
<!--.NET方法-->
|
|
||||||
<div v-else-if="formData.deleteDraftType == '2'">
|
|
||||||
<el-form-item prop="deleteDraftIOCName" label-width="0">
|
|
||||||
<el-input :readonly="disabled" v-model="formData.deleteDraftIOCName" placeholder="请填写.NET方法IOC别名">
|
|
||||||
</el-input>
|
|
||||||
</el-form-item>
|
|
||||||
</div>
|
|
||||||
<!--第三方接口-->
|
|
||||||
<div v-else-if="formData.deleteDraftType == '3'">
|
|
||||||
<el-form-item prop="deleteDraftUrl" label-width="0">
|
|
||||||
<el-input :readonly="disabled" type="textarea" rows="4" v-model="formData.deleteDraftUrl"
|
|
||||||
placeholder="请填写第三方接口地址(POST),JSON 格式,参数有userId用户Id,userAccount用户账号,companyId用户公司,departmentId用户部门">
|
|
||||||
</el-input>
|
|
||||||
</el-form-item>
|
|
||||||
</div>
|
|
||||||
|
|
||||||
|
|
||||||
<l-dialog :title="$t('流程任务命名规则配置')" :visible.sync="titleRulesVisible" :height="480" width="600px">
|
|
||||||
<div class="l-rblock" style="padding:8px">
|
|
||||||
<el-alert :title="titleRules" type="info" :closable="false" v-if="!$validatenull(titleRules)">
|
|
||||||
</el-alert>
|
|
||||||
<draggable :list="titleRulesList" :group="{ name: 'dic' }" ghost-class="set-item-ghost"
|
|
||||||
handle=".l-drag-item">
|
|
||||||
<div v-for="(item, index) in titleRulesList" class="l-set-item" :key="index">
|
|
||||||
<i class="l-drag-item el-icon-rank"></i>
|
|
||||||
<l-select style="width:26%;margin-right:1%;" size="mini" v-model="item.F_FiledValueType"
|
|
||||||
:placeholder="$t('字段值类型')" :options="vTypeOptions" @change="handleChangeVType(item)">
|
|
||||||
</l-select>
|
|
||||||
<el-input :readonly="item.F_FiledValueType != 1 && item.F_FiledValueType != 10 "
|
|
||||||
style="width:26%;" size="mini" v-model="item.F_FiledValue" placeholder="字段值"></el-input>
|
|
||||||
<el-button @click="handleRemoveConditions(index)" circle plain type="danger" size="mini"
|
|
||||||
icon="el-icon-minus" class="l-delete-item" style="padding: 4px;"></el-button>
|
|
||||||
</div>
|
|
||||||
</draggable>
|
|
||||||
<div style="padding-left:22px;">
|
|
||||||
<el-button size="mini" type="text" icon="el-icon-circle-plus-outline"
|
|
||||||
@click="handleAddTitleRulesList">添加流程任务命名规则配置</el-button>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
|
|
||||||
</l-dialog>
|
|
||||||
|
|
||||||
</el-form>
|
|
||||||
</template>
|
|
||||||
|
|
||||||
<script lang="ts" setup>
|
|
||||||
import { h, reactive, onMounted, defineProps, computed, defineEmits, provide, watch, ref } from 'vue';
|
|
||||||
const props = defineProps({
|
|
||||||
disabled: {
|
|
||||||
type: Boolean,
|
|
||||||
default: false
|
|
||||||
}
|
|
||||||
})
|
|
||||||
const data = reactive({
|
|
||||||
optionsNotOrOk: [{ label: '允许', value: 1 }, { label: '不允许', value: 2 }],
|
|
||||||
formData: {
|
|
||||||
f_Code: '',
|
|
||||||
f_Name: '',
|
|
||||||
f_Category: '',
|
|
||||||
f_Mark: 1,
|
|
||||||
f_IsInApp: 2,
|
|
||||||
f_Description: '',
|
|
||||||
|
|
||||||
titleRules: '',
|
|
||||||
|
|
||||||
undoType: 1,
|
|
||||||
undoDbCode: '',
|
|
||||||
undoDbSQL: '',
|
|
||||||
undoIOCName: '',
|
|
||||||
undoUrl: '',
|
|
||||||
|
|
||||||
deleteType: 1,
|
|
||||||
deleteDbCode: '',
|
|
||||||
deleteDbSQL: '',
|
|
||||||
deleteIOCName: '',
|
|
||||||
deleteUrl: '',
|
|
||||||
|
|
||||||
deleteDraftType: 1,
|
|
||||||
deleteDraftDbCode: '',
|
|
||||||
deleteDraftDbSQL: '',
|
|
||||||
deleteDraftIOCName: '',
|
|
||||||
deleteDraftUrl: '',
|
|
||||||
|
|
||||||
f_Icon: 'learun-icon-stars',
|
|
||||||
f_Color: '#409EFF',
|
|
||||||
|
|
||||||
|
|
||||||
},
|
|
||||||
rules: {
|
|
||||||
f_Code: [
|
|
||||||
{ required: true, message: '请输入模板编号' },
|
|
||||||
{ validator: lr_existDbFiled, keyValue: () => { return data.formData.f_Id }, tableName: 'lr_wf_schemeinfo', keyName: 'f_Id', trigger: 'blur' }
|
|
||||||
],
|
|
||||||
f_Name: [
|
|
||||||
{ required: true, message: '请输入模板名称' }
|
|
||||||
],
|
|
||||||
f_Category: [
|
|
||||||
{ required: true, message: '请选择模板分类' }
|
|
||||||
],
|
|
||||||
f_Icon: [
|
|
||||||
{ required: true, message: '请选择图标' }
|
|
||||||
],
|
|
||||||
f_Color: [
|
|
||||||
{ required: true, message: '请选择颜色' }
|
|
||||||
],
|
|
||||||
},
|
|
||||||
titleRulesVisible: false,
|
|
||||||
titleRules: '',
|
|
||||||
titleRulesList: []
|
|
||||||
})
|
|
||||||
function handleTitleRulesClick() {
|
|
||||||
data.titleRulesVisible = true;
|
|
||||||
}
|
|
||||||
function handleAddTitleRulesList() {
|
|
||||||
data.titleRulesList.push({ type: 1, value: '' });
|
|
||||||
}
|
|
||||||
function handleRemoveConditions() {
|
|
||||||
|
|
||||||
}
|
|
||||||
|
|
||||||
function resetForm() {
|
|
||||||
data.formData.f_Id = ''
|
|
||||||
data.formData.f_SchemeId = ''
|
|
||||||
this.$refs.form && this.$refs.form.resetFields()
|
|
||||||
}
|
|
||||||
// 校验表单
|
|
||||||
function validateForm() {
|
|
||||||
return new Promise((resolve) => {
|
|
||||||
this.$refs.form.validate((valid) => {
|
|
||||||
resolve(valid)
|
|
||||||
})
|
|
||||||
})
|
|
||||||
}
|
|
||||||
function setForm(data) {
|
|
||||||
data.formData = data
|
|
||||||
}
|
|
||||||
function getForm() {
|
|
||||||
return this.$deepClone(data.formData)
|
|
||||||
}
|
|
||||||
|
|
||||||
onMounted(() => {
|
|
||||||
lr_loadDblink();
|
|
||||||
})
|
|
||||||
</script>
|
|
||||||
|
|
@ -1,283 +0,0 @@
|
||||||
<!-- 开始节点配置 -->
|
|
||||||
<template>
|
|
||||||
<el-form class="l-form-config" label-width="88px" label-position="left" size="mini">
|
|
||||||
<el-form-item label="节点标识">
|
|
||||||
<el-input v-model="node.id" readonly></el-input>
|
|
||||||
</el-form-item>
|
|
||||||
<el-form-item label="下一审核人">
|
|
||||||
<el-switch :disabled="disabled" v-model="node.isNextAuditor">
|
|
||||||
</el-switch>
|
|
||||||
</el-form-item>
|
|
||||||
<el-form-item label="自定义标题">
|
|
||||||
<el-switch :disabled="disabled" v-model="node.isCustmerTitle">
|
|
||||||
</el-switch>
|
|
||||||
</el-form-item>
|
|
||||||
<el-form-item label="通知策略">
|
|
||||||
<l-checkbox :disabled="disabled" v-model="node.messageType"
|
|
||||||
:options="[{value:'1',label:'短信'},{value:'2',label:'邮箱'},{value:'3',label:'微信'},{value:'4',label:'站内消息'}]">
|
|
||||||
</l-checkbox>
|
|
||||||
</el-form-item>
|
|
||||||
<el-divider>表单添加</el-divider>
|
|
||||||
<div style="text-align: center;margin-bottom:16px;">
|
|
||||||
<el-radio-group :disabled="disabled" v-model="node.formType" size="mini" @change="handleFormTypeChange">
|
|
||||||
<el-radio-button label="1">自定义表单</el-radio-button>
|
|
||||||
<el-radio-button label="2">系统表单</el-radio-button>
|
|
||||||
</el-radio-group>
|
|
||||||
</div>
|
|
||||||
<div v-show="node.formType === '1'">
|
|
||||||
<el-form-item label-width="0px">
|
|
||||||
<l-custmerform-select v-model="node.formCode" @change="custmerformChange" :disabled="disabled">
|
|
||||||
</l-custmerform-select>
|
|
||||||
</el-form-item>
|
|
||||||
<el-form-item label-width="0px">
|
|
||||||
<l-select v-model="node.formVerison" :disabled="disabled" :options="formVerisons"
|
|
||||||
@change="custmerformVerisonChange" placeholder="请选择表单版本">
|
|
||||||
</l-select>
|
|
||||||
</el-form-item>
|
|
||||||
<el-form-item label-width="0px">
|
|
||||||
<l-select v-model="node.formRelationId" :disabled="disabled" :options="node.formRelations"
|
|
||||||
placeholder="请选择流程关联字段">
|
|
||||||
</l-select>
|
|
||||||
</el-form-item>
|
|
||||||
</div>
|
|
||||||
<div v-show="node.formType === '2'">
|
|
||||||
<el-form-item label-width="0px">
|
|
||||||
<el-input v-model="node.formUrl" placeholder="请输入PC端表单地址" :readonly="disabled">
|
|
||||||
</el-input>
|
|
||||||
</el-form-item>
|
|
||||||
<el-form-item label-width="0px">
|
|
||||||
<el-input v-model="node.formAppUrl" placeholder="请输入APP端表单地址" :readonly="disabled">
|
|
||||||
</el-input>
|
|
||||||
</el-form-item>
|
|
||||||
</div>
|
|
||||||
<el-divider>表单字段权限</el-divider>
|
|
||||||
<template v-if="node.formType === '1'">
|
|
||||||
<l-table height="notset" :isShowNum="false" :columns="columns" :dataSource="node.authFields" ref="authField">
|
|
||||||
<template v-slot:required="scope">
|
|
||||||
<el-switch v-model="scope.row.required" :disabled="disabled || scope.row.type == 'grid'">
|
|
||||||
</el-switch>
|
|
||||||
</template>
|
|
||||||
<template v-slot:isEdit="scope">
|
|
||||||
<el-switch v-model="scope.row.isEdit" :disabled="disabled || scope.row.type == 'gridrequired'">
|
|
||||||
</el-switch>
|
|
||||||
</template>
|
|
||||||
<template v-slot:isLook="scope">
|
|
||||||
<el-switch v-model="scope.row.isLook"
|
|
||||||
:disabled="disabled || scope.row.type == 'grid' || scope.row.type == 'gridrequired'">
|
|
||||||
</el-switch>
|
|
||||||
</template>
|
|
||||||
</l-table>
|
|
||||||
</template>
|
|
||||||
<template v-else>
|
|
||||||
<l-edit-table addBtnText="添加字段" :dataSource="node.authFields" :isShowNum="false" @addRow="handleAddAuthField"
|
|
||||||
@deleteRow="handleDeleteAuthField">
|
|
||||||
<el-table-column prop="label" label="名称" minWidth="100">
|
|
||||||
<template slot-scope="scope">
|
|
||||||
<el-input :readonly="disabled" size="mini" v-model="scope.row.label" placeholder="请输入"></el-input>
|
|
||||||
</template>
|
|
||||||
</el-table-column>
|
|
||||||
<el-table-column prop="field" label="字段" minWidth="100">
|
|
||||||
<template slot-scope="scope">
|
|
||||||
<el-input :readonly="disabled" size="mini" v-model="scope.row.field" placeholder="请输入"></el-input>
|
|
||||||
</template>
|
|
||||||
</el-table-column>
|
|
||||||
<el-table-column prop="required" label="必填" width="64">
|
|
||||||
<template slot-scope="scope">
|
|
||||||
<el-switch v-model="scope.row.required" :disabled="disabled">
|
|
||||||
</el-switch>
|
|
||||||
</template>
|
|
||||||
</el-table-column>
|
|
||||||
<el-table-column prop="isEdit" label="编辑" width="64">
|
|
||||||
<template slot-scope="scope">
|
|
||||||
<el-switch v-model="scope.row.isEdit" :disabled="disabled">
|
|
||||||
</el-switch>
|
|
||||||
</template>
|
|
||||||
</el-table-column>
|
|
||||||
<el-table-column prop="isLook" label="查看" width="64">
|
|
||||||
<template slot-scope="scope">
|
|
||||||
<el-switch v-model="scope.row.isLook" :disabled="disabled">
|
|
||||||
</el-switch>
|
|
||||||
</template>
|
|
||||||
</el-table-column>
|
|
||||||
</l-edit-table>
|
|
||||||
</template>
|
|
||||||
</el-form>
|
|
||||||
</template>
|
|
||||||
|
|
||||||
<script>
|
|
||||||
// 获取的接口，core\modules\custmerForm\api\scheme.js
|
|
||||||
// const apiForm = window.$api.custmerForm.scheme
|
|
||||||
|
|
||||||
export default {
|
|
||||||
name: 'start-event-option',
|
|
||||||
props: {
|
|
||||||
disabled: {
|
|
||||||
type: Boolean,
|
|
||||||
default: false
|
|
||||||
}
|
|
||||||
},
|
|
||||||
data() {
|
|
||||||
return {
|
|
||||||
columns: [
|
|
||||||
{ label: '名称', prop: 'label', minWidth: '100' },
|
|
||||||
{ label: '字段', prop: 'field', minWidth: '100' },
|
|
||||||
{ label: '必填', prop: 'required', width: '64', align: 'center' },
|
|
||||||
{ label: '编辑', prop: 'isEdit', width: '64', align: 'center' },
|
|
||||||
{ label: '查看', prop: 'isLook', width: '64', align: 'center' },
|
|
||||||
],
|
|
||||||
tableBtns: [
|
|
||||||
{ prop: 'Delete', label: '删除' }
|
|
||||||
],
|
|
||||||
formRelations: []
|
|
||||||
}
|
|
||||||
},
|
|
||||||
asyncComputed: {
|
|
||||||
formVerisons: {
|
|
||||||
async get() {
|
|
||||||
let res = []
|
|
||||||
if (!this.$validatenull(this.node.formCode) && this.node.formType == '1') {
|
|
||||||
// res = await this.$awaitWraper(apiForm.getHistoryList(this.node.formCode))
|
|
||||||
}
|
|
||||||
return (res || []).map(t => { return { label: this.lr_dateFormat(t.f_CreateDate), value: t.f_Id } })
|
|
||||||
}
|
|
||||||
}
|
|
||||||
},
|
|
||||||
computed: {
|
|
||||||
node() {
|
|
||||||
return this.wfdesign.currentWfNode;
|
|
||||||
}
|
|
||||||
},
|
|
||||||
inject: ["wfdesign"],
|
|
||||||
methods: {
|
|
||||||
async custmerformChange(val) {
|
|
||||||
this.$set(this.node, 'formRelationId', '')
|
|
||||||
if (val == null) {
|
|
||||||
this.node.authFields = [];
|
|
||||||
this.node.formVerison = ''
|
|
||||||
return;
|
|
||||||
}
|
|
||||||
if (this.$validatenull(this.wfdesign.custmerformSchemes[val.f_SchemeId])) {
|
|
||||||
// const {f_SchemeInfoId,f_Scheme,f_Id} = (await this.$awaitWraper(apiForm.getHistory(val.f_SchemeId))) || {}
|
|
||||||
this.wfdesign.custmerformSchemes[f_Id] = { f_Scheme }
|
|
||||||
if (this.node.formCode == f_SchemeInfoId) {
|
|
||||||
this.loadFormScheme(f_Scheme)
|
|
||||||
}
|
|
||||||
}
|
|
||||||
else {
|
|
||||||
this.loadFormScheme(this.wfdesign.custmerformSchemes[val.f_SchemeId].f_Scheme);
|
|
||||||
}
|
|
||||||
this.node.formVerison = val.f_SchemeId
|
|
||||||
},
|
|
||||||
async custmerformVerisonChange(val) {
|
|
||||||
this.$set(this.node, 'formRelationId', '')
|
|
||||||
if (this.$validatenull(val)) {
|
|
||||||
this.node.authFields = []
|
|
||||||
return
|
|
||||||
}
|
|
||||||
if (this.$validatenull(this.wfdesign.custmerformSchemes[val.value])) {
|
|
||||||
// const {f_Scheme,f_Id} = (await this.$awaitWraper(apiForm.getHistory(val.value))) || {}
|
|
||||||
this.wfdesign.custmerformSchemes[f_Id] = { f_Scheme }
|
|
||||||
if (this.node.formVerison == f_Id) {
|
|
||||||
|
|
||||||
this.loadFormScheme(f_Scheme)
|
|
||||||
}
|
|
||||||
}
|
|
||||||
else {
|
|
||||||
this.loadFormScheme(this.wfdesign.custmerformSchemes[val.value].f_Scheme);
|
|
||||||
}
|
|
||||||
},
|
|
||||||
loadFormScheme(strScheme) {
|
|
||||||
const scheme = JSON.parse(strScheme)
|
|
||||||
const fields = []
|
|
||||||
const rfields = []
|
|
||||||
scheme.formInfo.tabList.forEach(tab => {
|
|
||||||
tab.components.forEach(component => {
|
|
||||||
if (['guid'].includes(component.type)) {
|
|
||||||
rfields.push({ label: component.label, value: component.prop })
|
|
||||||
}
|
|
||||||
|
|
||||||
if (!['gridtable', 'divider'].includes(component.type) && component.display) {
|
|
||||||
fields.push({
|
|
||||||
prop: component.prop,
|
|
||||||
field: component.field,
|
|
||||||
label: component.label,
|
|
||||||
table: component.table,
|
|
||||||
required: component.required,
|
|
||||||
isEdit: true,
|
|
||||||
isLook: true
|
|
||||||
})
|
|
||||||
}
|
|
||||||
else if (['gridtable'].includes(component.type)) {
|
|
||||||
fields.push({
|
|
||||||
prop: `${component.prop}_add`,
|
|
||||||
label: `${component.label || '表格'}-添加按钮`,
|
|
||||||
required: false,
|
|
||||||
isEdit: true,
|
|
||||||
isLook: false,
|
|
||||||
type: 'grid'
|
|
||||||
})
|
|
||||||
fields.push({
|
|
||||||
prop: `${component.prop}_remove`,
|
|
||||||
label: `${component.label || '表格'}-删除按钮`,
|
|
||||||
required: false,
|
|
||||||
isEdit: true,
|
|
||||||
isLook: false,
|
|
||||||
type: 'grid'
|
|
||||||
})
|
|
||||||
|
|
||||||
fields.push({
|
|
||||||
prop: `${component.prop}_required`,
|
|
||||||
label: `${component.label || '表格'}-数据`,
|
|
||||||
required: component.required,
|
|
||||||
isEdit: false,
|
|
||||||
isLook: false,
|
|
||||||
type: 'gridrequired'
|
|
||||||
})
|
|
||||||
fields.push(...component.children.filter(t => t.display).map(t => {
|
|
||||||
return {
|
|
||||||
gridprop: component.prop,
|
|
||||||
prop: t.prop,
|
|
||||||
field: t.field,
|
|
||||||
label: `${component.label || '表格'}-${t.label}`,
|
|
||||||
table: component.table,
|
|
||||||
required: t.required,
|
|
||||||
isEdit: true,
|
|
||||||
isLook: true
|
|
||||||
}
|
|
||||||
}))
|
|
||||||
}
|
|
||||||
})
|
|
||||||
})
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
this.node.formRelations = rfields
|
|
||||||
this.node.authFields = fields
|
|
||||||
|
|
||||||
},
|
|
||||||
handleFormTypeChange() {
|
|
||||||
this.node.formCode = ''
|
|
||||||
this.node.formUrl = ''
|
|
||||||
this.node.formAppUrl = ''
|
|
||||||
this.node.authFields = []
|
|
||||||
this.node.formRelations = []
|
|
||||||
|
|
||||||
this.$set(this.node, 'formRelationId', '')
|
|
||||||
|
|
||||||
},
|
|
||||||
handleAddAuthField() {
|
|
||||||
this.node.authFields.push({
|
|
||||||
field: '',
|
|
||||||
label: '',
|
|
||||||
required: true,
|
|
||||||
isEdit: true,
|
|
||||||
isLook: true
|
|
||||||
})
|
|
||||||
},
|
|
||||||
handleDeleteAuthField({ index }) {
|
|
||||||
this.node.authFields.splice(index, 1)
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
}
|
|
||||||
</script>
|
|
||||||
|
|
@ -1,805 +0,0 @@
|
||||||
<!-- 开始节点配置 -->
|
|
||||||
<template>
|
|
||||||
<el-form
|
|
||||||
label-width="96px"
|
|
||||||
label-position="left"
|
|
||||||
size="mini"
|
|
||||||
>
|
|
||||||
<el-collapse v-model="activeNames" accordion>
|
|
||||||
<el-collapse-item :title="$t('基础配置')" name="1">
|
|
||||||
<div style="padding:0 16px;">
|
|
||||||
<el-form-item label="节点标识">
|
|
||||||
<el-input v-model="node.id" readonly ></el-input>
|
|
||||||
</el-form-item>
|
|
||||||
<el-form-item label="继承表单">
|
|
||||||
<el-switch :disabled="disabled" v-model="node.isInherit">
|
|
||||||
</el-switch>
|
|
||||||
</el-form-item>
|
|
||||||
<el-form-item label="允许加签">
|
|
||||||
<el-switch :disabled="disabled" v-model="node.isAddSign">
|
|
||||||
</el-switch>
|
|
||||||
</el-form-item>
|
|
||||||
<el-form-item label="允许转移">
|
|
||||||
<el-switch :disabled="disabled" v-model="node.isTransfer">
|
|
||||||
</el-switch>
|
|
||||||
</el-form-item>
|
|
||||||
<el-form-item label="允许批量审核">
|
|
||||||
<el-switch :disabled="disabled" v-model="node.isBatchAudit">
|
|
||||||
</el-switch>
|
|
||||||
</el-form-item>
|
|
||||||
<el-form-item label="自动同意规则">
|
|
||||||
<l-select multiple :disabled="disabled" v-model="node.autoAgree" :options="atuoAgreeOptions" >
|
|
||||||
</l-select>
|
|
||||||
</el-form-item>
|
|
||||||
<el-form-item label="无对应处理人">
|
|
||||||
<l-select :disabled="disabled" v-model="node.noAuditor" :options="noAuditorOptions" >
|
|
||||||
</l-select>
|
|
||||||
</el-form-item>
|
|
||||||
<el-form-item label="驳回策略">
|
|
||||||
<l-radio :disabled="disabled" v-model="node.rejectType" :options="[{value:'1',label:'驳回节点固定'},{value:'2',label:'能驳回到任何执行过节点'}]" >
|
|
||||||
</l-radio>
|
|
||||||
</el-form-item>
|
|
||||||
|
|
||||||
<el-form-item label="通知策略">
|
|
||||||
<l-checkbox :disabled="disabled" v-model="node.messageType" :options="[{value:'1',label:'短信'},{value:'2',label:'邮箱'},{value:'3',label:'微信'},{value:'4',label:'站内消息'}]" >
|
|
||||||
</l-checkbox>
|
|
||||||
</el-form-item>
|
|
||||||
</div>
|
|
||||||
|
|
||||||
</el-collapse-item>
|
|
||||||
<el-collapse-item :title="$t('审核人员设置')" name="2">
|
|
||||||
<el-button-group style="padding:0 0 8px 8px" v-if="!disabled" >
|
|
||||||
<el-button size="mini" @click="handlePostClick(false)" >{{$t('岗位')}}</el-button>
|
|
||||||
<el-button size="mini" @click="handleRoleClick(false)" >{{$t('角色')}}</el-button>
|
|
||||||
<el-button size="mini" @click="handleUserClick(false)" >{{$t('用户')}}</el-button>
|
|
||||||
<el-button size="mini" @click="handleLevelClick(false)">{{$t('上下级')}}</el-button>
|
|
||||||
<el-button size="mini" @click="handleNodeAuditorClick(false)">{{$t('节点执行人')}}</el-button>
|
|
||||||
<el-button size="mini" @click="handleAuditorSqlClick(false)" >{{$t('表字段')}}</el-button>
|
|
||||||
</el-button-group>
|
|
||||||
<l-table height="notset" :isShowNum="false" :columns="userColumns" :dataSource="node.auditUsers" >
|
|
||||||
<template v-slot:type="scope" >
|
|
||||||
{{typeFormat(scope.row.type)}}
|
|
||||||
</template>
|
|
||||||
<template v-slot:condition="scope" >
|
|
||||||
<l-select :disabled="disabled" size="mini" v-if="scope.row.type == '2'" :options="conditionOptions" v-model="scope.row.condition" ></l-select>
|
|
||||||
</template>
|
|
||||||
<l-table-btns v-if="!disabled" :isFixed="false" :btns="tableBtns" @click="handleTableBtnClick" ></l-table-btns>
|
|
||||||
</l-table>
|
|
||||||
</el-collapse-item>
|
|
||||||
<el-collapse-item :title="$t('传阅人员设置')" name="3">
|
|
||||||
<el-button-group style="padding:0 0 8px 8px" v-if="!disabled" >
|
|
||||||
<el-button size="mini" @click="handlePostClick(true)" >{{$t('岗位')}}</el-button>
|
|
||||||
<el-button size="mini" @click="handleRoleClick(true)">{{$t('角色')}}</el-button>
|
|
||||||
<el-button size="mini" @click="handleUserClick(true)">{{$t('用户')}}</el-button>
|
|
||||||
<el-button size="mini" @click="handleLevelClick(true)">{{$t('上下级')}}</el-button>
|
|
||||||
<el-button size="mini" @click="handleNodeAuditorClick(true)">{{$t('节点执行人')}}</el-button>
|
|
||||||
<el-button size="mini" @click="handleAuditorSqlClick(true)">{{$t('表字段')}}</el-button>
|
|
||||||
</el-button-group>
|
|
||||||
<l-table height="notset" :isShowNum="false" :columns="userColumns" :dataSource="node.lookUsers" >
|
|
||||||
<template v-slot:type="scope" >
|
|
||||||
{{typeFormat(scope.row.type)}}
|
|
||||||
</template>
|
|
||||||
<template v-slot:condition="scope" >
|
|
||||||
<l-select :disabled="disabled" size="mini" v-if="scope.row.type == '2'" :options="conditionOptions" v-model="scope.row.condition" ></l-select>
|
|
||||||
</template>
|
|
||||||
<l-table-btns v-if="!disabled" :isFixed="false" :btns="tableBtns" @click="handleTableBtnClick2" ></l-table-btns>
|
|
||||||
</l-table>
|
|
||||||
</el-collapse-item>
|
|
||||||
<el-collapse-item v-if="!node.isInherit" :title="$t('表单设置')" name="4">
|
|
||||||
<div style="padding:0 16px;">
|
|
||||||
<div style="text-align: center;margin-bottom:16px;" >
|
|
||||||
<el-radio-group :disabled="disabled" v-model="node.formType" size="mini" @change="handleFormTypeChange">
|
|
||||||
<el-radio-button label="1">自定义表单</el-radio-button>
|
|
||||||
<el-radio-button label="2">系统表单</el-radio-button>
|
|
||||||
</el-radio-group>
|
|
||||||
</div>
|
|
||||||
<div v-show="node.formType === '1'" >
|
|
||||||
<el-form-item label-width="0px">
|
|
||||||
<l-custmerform-select
|
|
||||||
v-model="node.formCode"
|
|
||||||
@change="custmerformChange"
|
|
||||||
|
|
||||||
:disabled="disabled"
|
|
||||||
>
|
|
||||||
</l-custmerform-select>
|
|
||||||
</el-form-item>
|
|
||||||
<el-form-item label-width="0px">
|
|
||||||
<l-select
|
|
||||||
v-model="node.formVerison"
|
|
||||||
:disabled="disabled"
|
|
||||||
:options="formVerisons"
|
|
||||||
@change="custmerformVerisonChange"
|
|
||||||
|
|
||||||
placeholder="请选择表单版本"
|
|
||||||
>
|
|
||||||
</l-select>
|
|
||||||
</el-form-item>
|
|
||||||
<el-form-item label-width="0px">
|
|
||||||
<l-select
|
|
||||||
v-model="node.formRelationId"
|
|
||||||
:disabled="disabled"
|
|
||||||
:options="node.formRelations"
|
|
||||||
|
|
||||||
placeholder="请选择流程关联字段"
|
|
||||||
>
|
|
||||||
</l-select>
|
|
||||||
</el-form-item>
|
|
||||||
|
|
||||||
</div>
|
|
||||||
<div v-show="node.formType === '2'" >
|
|
||||||
<el-form-item label-width="0px">
|
|
||||||
<el-input
|
|
||||||
v-model="node.formUrl"
|
|
||||||
placeholder="请输入PC端表单地址"
|
|
||||||
|
|
||||||
:readonly="disabled"
|
|
||||||
>
|
|
||||||
</el-input>
|
|
||||||
</el-form-item>
|
|
||||||
<el-form-item label-width="0px">
|
|
||||||
<el-input
|
|
||||||
v-model="node.formAppUrl"
|
|
||||||
placeholder="请输入APP端表单地址"
|
|
||||||
|
|
||||||
:readonly="disabled"
|
|
||||||
>
|
|
||||||
</el-input>
|
|
||||||
</el-form-item>
|
|
||||||
</div>
|
|
||||||
<el-divider>表单字段权限</el-divider>
|
|
||||||
<template v-if="node.formType === '1'">
|
|
||||||
<l-table height="notset" :isShowNum="false" :columns="columns" :dataSource="node.authFields" ref="authField" >
|
|
||||||
<template v-slot:required="scope" >
|
|
||||||
<el-switch
|
|
||||||
v-model="scope.row.required"
|
|
||||||
:disabled="disabled || scope.row.type == 'grid'"
|
|
||||||
>
|
|
||||||
</el-switch>
|
|
||||||
</template>
|
|
||||||
<template v-slot:isEdit="scope" >
|
|
||||||
<el-switch
|
|
||||||
v-model="scope.row.isEdit"
|
|
||||||
:disabled="disabled || scope.row.type == 'gridrequired'"
|
|
||||||
>
|
|
||||||
</el-switch>
|
|
||||||
</template>
|
|
||||||
<template v-slot:isLook="scope" >
|
|
||||||
<el-switch
|
|
||||||
v-model="scope.row.isLook"
|
|
||||||
:disabled="disabled || scope.row.type == 'grid' || scope.row.type == 'gridrequired'"
|
|
||||||
>
|
|
||||||
</el-switch>
|
|
||||||
</template>
|
|
||||||
</l-table>
|
|
||||||
</template>
|
|
||||||
<template v-else>
|
|
||||||
<l-edit-table
|
|
||||||
addBtnText="添加字段"
|
|
||||||
:dataSource="node.authFields"
|
|
||||||
|
|
||||||
:isShowNum="false"
|
|
||||||
|
|
||||||
:isAddBtn="!disabled"
|
|
||||||
:isRemoveBtn="!disabled"
|
|
||||||
|
|
||||||
@addRow="handleAddAuthField"
|
|
||||||
@deleteRow="handleDeleteAuthField"
|
|
||||||
>
|
|
||||||
<el-table-column
|
|
||||||
prop="label"
|
|
||||||
label="名称"
|
|
||||||
minWidth="100">
|
|
||||||
<template slot-scope="scope">
|
|
||||||
<el-input :readonly="disabled" size="mini" v-model="scope.row.label" placeholder="请输入名称" ></el-input>
|
|
||||||
</template>
|
|
||||||
</el-table-column>
|
|
||||||
<el-table-column
|
|
||||||
prop="field"
|
|
||||||
label="字段"
|
|
||||||
minWidth="100">
|
|
||||||
<template slot-scope="scope">
|
|
||||||
<el-input :readonly="disabled" size="mini" v-model="scope.row.field" placeholder="请输入字段"></el-input>
|
|
||||||
</template>
|
|
||||||
</el-table-column>
|
|
||||||
<el-table-column
|
|
||||||
prop="required"
|
|
||||||
label="必填"
|
|
||||||
width="64">
|
|
||||||
<template slot-scope="scope">
|
|
||||||
<el-switch
|
|
||||||
v-model="scope.row.required"
|
|
||||||
:disabled="disabled"
|
|
||||||
>
|
|
||||||
</el-switch>
|
|
||||||
</template>
|
|
||||||
</el-table-column>
|
|
||||||
<el-table-column
|
|
||||||
prop="isEdit"
|
|
||||||
label="编辑"
|
|
||||||
width="64">
|
|
||||||
<template slot-scope="scope">
|
|
||||||
<el-switch
|
|
||||||
v-model="scope.row.isEdit"
|
|
||||||
:disabled="disabled"
|
|
||||||
>
|
|
||||||
</el-switch>
|
|
||||||
</template>
|
|
||||||
</el-table-column>
|
|
||||||
<el-table-column
|
|
||||||
prop="isLook"
|
|
||||||
label="查看"
|
|
||||||
width="64">
|
|
||||||
<template slot-scope="scope">
|
|
||||||
<el-switch
|
|
||||||
v-model="scope.row.isLook"
|
|
||||||
:disabled="disabled"
|
|
||||||
>
|
|
||||||
</el-switch>
|
|
||||||
</template>
|
|
||||||
</el-table-column>
|
|
||||||
</l-edit-table >
|
|
||||||
</template>
|
|
||||||
</div>
|
|
||||||
</el-collapse-item>
|
|
||||||
<el-collapse-item :title="$t('按钮设置')" name="5">
|
|
||||||
<l-edit-table
|
|
||||||
addBtnText="添加按钮"
|
|
||||||
:dataSource="node.btnlist"
|
|
||||||
:isShowNum="false"
|
|
||||||
:hasDeleteBtn="hasBtnsDeleteBtn"
|
|
||||||
|
|
||||||
:isAddBtn="!disabled"
|
|
||||||
:isRemoveBtn="!disabled"
|
|
||||||
|
|
||||||
@addRow="handleAddBtns"
|
|
||||||
@deleteRow="handleDeleteBtns"
|
|
||||||
|
|
||||||
>
|
|
||||||
<el-table-column
|
|
||||||
prop="name"
|
|
||||||
label="名称"
|
|
||||||
minWidth="100">
|
|
||||||
<template slot-scope="scope">
|
|
||||||
<el-input :readonly="disabled" v-if="!scope.row.isSys" size="mini" v-model="scope.row.name" placeholder="请输入名称" ></el-input>
|
|
||||||
<span v-else >{{scope.row.name}}</span>
|
|
||||||
</template>
|
|
||||||
</el-table-column>
|
|
||||||
<el-table-column
|
|
||||||
prop="code"
|
|
||||||
label="编码"
|
|
||||||
minWidth="100">
|
|
||||||
<template slot-scope="scope">
|
|
||||||
<el-input :readonly="disabled" v-if="!scope.row.isSys" size="mini" v-model="scope.row.code" placeholder="请输入编码"></el-input>
|
|
||||||
<span v-else >{{scope.row.code}}</span>
|
|
||||||
</template>
|
|
||||||
</el-table-column>
|
|
||||||
<el-table-column
|
|
||||||
align="center"
|
|
||||||
prop="hidden"
|
|
||||||
label="隐藏"
|
|
||||||
width="64">
|
|
||||||
<template slot-scope="scope">
|
|
||||||
<el-switch
|
|
||||||
v-model="scope.row.hidden"
|
|
||||||
:disabled="disabled"
|
|
||||||
>
|
|
||||||
</el-switch>
|
|
||||||
</template>
|
|
||||||
</el-table-column>
|
|
||||||
<el-table-column
|
|
||||||
align="center"
|
|
||||||
prop="isSign"
|
|
||||||
label="签章"
|
|
||||||
width="64">
|
|
||||||
<template slot-scope="scope">
|
|
||||||
<el-switch
|
|
||||||
v-model="scope.row.isSign"
|
|
||||||
:disabled="disabled"
|
|
||||||
>
|
|
||||||
</el-switch>
|
|
||||||
</template>
|
|
||||||
</el-table-column>
|
|
||||||
<el-table-column
|
|
||||||
align="center"
|
|
||||||
prop="isNextAuditor"
|
|
||||||
label="下一审核人"
|
|
||||||
width="80">
|
|
||||||
<template slot-scope="scope">
|
|
||||||
<el-switch
|
|
||||||
v-if="scope.row.code != 'disagree'"
|
|
||||||
v-model="scope.row.isNextAuditor"
|
|
||||||
:disabled="disabled"
|
|
||||||
>
|
|
||||||
</el-switch>
|
|
||||||
</template>
|
|
||||||
</el-table-column>
|
|
||||||
</l-edit-table >
|
|
||||||
</el-collapse-item>
|
|
||||||
<el-collapse-item :title="$t('会签设置')" name="6">
|
|
||||||
<div style="padding:0 16px" >
|
|
||||||
<el-form-item label="是否会签">
|
|
||||||
<el-switch v-model="node.isCountersign" :disabled="disabled">
|
|
||||||
</el-switch>
|
|
||||||
</el-form-item>
|
|
||||||
<template v-if="node.isCountersign">
|
|
||||||
<el-form-item label="审核方式">
|
|
||||||
<l-radio :disabled="disabled" v-model="node.countersignType" :options="[{value:'1',label:'并行'},{value:'2',label:'串行'}]" >
|
|
||||||
</l-radio>
|
|
||||||
</el-form-item>
|
|
||||||
<el-form-item v-if="node.countersignType == '1'" label="是否等待"><!--并行才有这个设置-->
|
|
||||||
<el-switch v-model="node.isCountersignAll" :disabled="disabled">
|
|
||||||
</el-switch>
|
|
||||||
</el-form-item>
|
|
||||||
<el-form-item v-if="node.countersignType == '1'" label="通过百分比">
|
|
||||||
<el-input-number :disabled="disabled" :min="1" :max="100" v-model="node.countersignAllType">
|
|
||||||
</el-input-number>
|
|
||||||
</el-form-item>
|
|
||||||
|
|
||||||
<el-form-item label="再次审核">
|
|
||||||
<l-radio :disabled="disabled" v-model="node.countersignAgian" :options="[{value:'1',label:'已同意不需要审核'},{value:'2',label:'已同意需要审核'}]" >
|
|
||||||
</l-radio>
|
|
||||||
</el-form-item>
|
|
||||||
</template>
|
|
||||||
|
|
||||||
</div>
|
|
||||||
</el-collapse-item>
|
|
||||||
<el-collapse-item :title="$t('超时设置')" name="7">
|
|
||||||
<div style="padding:0 16px" >
|
|
||||||
<el-form-item label="超时通知">
|
|
||||||
<el-switch :disabled="disabled" v-model="node.isOvertimeMessage">
|
|
||||||
</el-switch>
|
|
||||||
</el-form-item>
|
|
||||||
<template v-if="node.isOvertimeMessage" >
|
|
||||||
|
|
||||||
<el-form-item label="第一次通知(时)">
|
|
||||||
<el-input-number :disabled="disabled" :min="1" v-model="node.overtimeMessageStart">
|
|
||||||
</el-input-number>
|
|
||||||
</el-form-item>
|
|
||||||
<el-form-item label="通知间隔(时)">
|
|
||||||
<el-input-number :disabled="disabled" :min="1" v-model="node.overtimeMessageInterval">
|
|
||||||
</el-input-number>
|
|
||||||
</el-form-item>
|
|
||||||
<el-form-item label="超时流转时间(时)">
|
|
||||||
<el-input-number :disabled="disabled" :min="1" v-model="node.overtimeGo">
|
|
||||||
</el-input-number>
|
|
||||||
</el-form-item>
|
|
||||||
<el-form-item label="超时通知策略">
|
|
||||||
<l-checkbox :disabled="disabled" v-model="node.overtimeMessageType" :options="[{value:'1',label:'短信'},{value:'2',label:'邮箱'},{value:'3',label:'微信'},{value:'4',label:'站内消息'}]" >
|
|
||||||
</l-checkbox>
|
|
||||||
</el-form-item>
|
|
||||||
</template>
|
|
||||||
|
|
||||||
</div>
|
|
||||||
</el-collapse-item>
|
|
||||||
</el-collapse>
|
|
||||||
|
|
||||||
|
|
||||||
<l-dialog
|
|
||||||
:title="$t('添加岗位')"
|
|
||||||
:visible.sync="selectPostVisible"
|
|
||||||
:height="480"
|
|
||||||
width="1024px"
|
|
||||||
|
|
||||||
@ok="handlePostSelectOk"
|
|
||||||
@closed="handlePostSelectClosed"
|
|
||||||
>
|
|
||||||
<l-post-select-panel ref="postSelectPanel" ></l-post-select-panel>
|
|
||||||
</l-dialog>
|
|
||||||
|
|
||||||
<l-dialog
|
|
||||||
:title="$t('添加角色')"
|
|
||||||
:visible.sync="selectRoleVisible"
|
|
||||||
:height="480"
|
|
||||||
width="800px"
|
|
||||||
|
|
||||||
@ok="handleRoleSelectOk"
|
|
||||||
@closed="handleRoleSelectClosed"
|
|
||||||
>
|
|
||||||
<l-role-select-panel ref="roleSelectPanel" ></l-role-select-panel>
|
|
||||||
</l-dialog>
|
|
||||||
|
|
||||||
|
|
||||||
<l-dialog
|
|
||||||
:title="$t('添加用户')"
|
|
||||||
:visible.sync="selectUserVisible"
|
|
||||||
:height="480"
|
|
||||||
width="1024px"
|
|
||||||
|
|
||||||
@ok="handleUserSelectOk"
|
|
||||||
@closed="handleUserSelectClosed"
|
|
||||||
>
|
|
||||||
<l-user-select-panel ref="userSelectPanel" ></l-user-select-panel>
|
|
||||||
</l-dialog>
|
|
||||||
|
|
||||||
<!--上下级选择-->
|
|
||||||
<l-dialog
|
|
||||||
:title="$t('上下级选择')"
|
|
||||||
:visible.sync="levelVisible"
|
|
||||||
:height="200"
|
|
||||||
width="500px"
|
|
||||||
|
|
||||||
@ok="handleLevelOk"
|
|
||||||
@closed="handleLevelClosed"
|
|
||||||
>
|
|
||||||
<auditor-level-form ref="auditorLevelForm" ></auditor-level-form>
|
|
||||||
</l-dialog>
|
|
||||||
|
|
||||||
<!--流程节点选择-->
|
|
||||||
<l-dialog
|
|
||||||
:title="$t('流程节点选择')"
|
|
||||||
:visible.sync="nodeAuditorVisible"
|
|
||||||
:height="200"
|
|
||||||
width="500px"
|
|
||||||
|
|
||||||
@ok="handleNodeAuditorOk"
|
|
||||||
@closed="handleNodeAuditorClosed"
|
|
||||||
@opened="handleNodeAuditorOpened"
|
|
||||||
>
|
|
||||||
<node-auditor-form ref="nodeAuditorForm" ></node-auditor-form>
|
|
||||||
</l-dialog>
|
|
||||||
|
|
||||||
<!--流程节点选择-->
|
|
||||||
<l-dialog
|
|
||||||
:title="$t('数据表字段选择')"
|
|
||||||
:visible.sync="auditorSqlVisible"
|
|
||||||
width="500px"
|
|
||||||
:height="300"
|
|
||||||
|
|
||||||
@ok="handleAuditorSqlOk"
|
|
||||||
@closed="handleAuditorSqlClosed"
|
|
||||||
>
|
|
||||||
<auditor-sql-form ref="auditorSqlForm" ></auditor-sql-form>
|
|
||||||
</l-dialog>
|
|
||||||
|
|
||||||
</el-form>
|
|
||||||
</template>
|
|
||||||
|
|
||||||
<script>
|
|
||||||
|
|
||||||
// const apiForm = window.$api.custmerForm.scheme
|
|
||||||
|
|
||||||
import auditorLevelForm from './auditorLevel.vue'
|
|
||||||
import nodeAuditorForm from './auditorNode.vue'
|
|
||||||
import auditorSqlForm from './auditorSql.vue'
|
|
||||||
|
|
||||||
export default {
|
|
||||||
name:'user-task-option',
|
|
||||||
props:{
|
|
||||||
disabled:{
|
|
||||||
type:Boolean,
|
|
||||||
default:false
|
|
||||||
}
|
|
||||||
},
|
|
||||||
components:{
|
|
||||||
auditorLevelForm,
|
|
||||||
nodeAuditorForm,
|
|
||||||
auditorSqlForm
|
|
||||||
},
|
|
||||||
data () {
|
|
||||||
return {
|
|
||||||
activeNames: ['1'],
|
|
||||||
columns:[
|
|
||||||
{label:'名称',prop:'label',minWidth:'100'},
|
|
||||||
{label:'字段',prop:'field',minWidth:'100'},
|
|
||||||
{label:'必填',prop:'required',width:'64',align:'center'},
|
|
||||||
{label:'编辑',prop:'isEdit',width:'64',align:'center'},
|
|
||||||
{label:'查看',prop:'isLook',width:'64',align:'center'},
|
|
||||||
],
|
|
||||||
tableBtns:[
|
|
||||||
{prop:'Delete',label:'删除'}
|
|
||||||
],
|
|
||||||
atuoAgreeOptions: [{ value: '1', label: '处理人就是提交人' }, { value: '2', label: '处理人和上一步的处理人相同' }, { value: '3', label: '处理人审批过' }],
|
|
||||||
noAuditorOptions: [{ value: '1', label: '超级管理员处理' }, { value: '2', label: '跳过此步骤' }, { value: '3', label: '不能提交' }],
|
|
||||||
userColumns:[
|
|
||||||
{label:'类型',prop:'type',width:'64'},
|
|
||||||
{label:'名称',prop:'name',minWidth:'100'},
|
|
||||||
{label:'附加条件',prop:'condition',minWidth:'100'}
|
|
||||||
],
|
|
||||||
|
|
||||||
conditionOptions:[{ value: '1', label: '同一个部门' }, { value: '2', label: '同一个公司' }, { value: '3', label: '发起人上级' }, { value: '4', label: '发起人下级' }],
|
|
||||||
|
|
||||||
selectPostVisible:false,
|
|
||||||
selectRoleVisible:false,
|
|
||||||
selectUserVisible:false,
|
|
||||||
levelVisible:false,
|
|
||||||
nodeAuditorVisible:false,
|
|
||||||
auditorSqlVisible:false,
|
|
||||||
|
|
||||||
isLooker:false,
|
|
||||||
|
|
||||||
}
|
|
||||||
},
|
|
||||||
asyncComputed:{
|
|
||||||
formVerisons:{
|
|
||||||
async get(){
|
|
||||||
let res = []
|
|
||||||
if(!this.$validatenull(this.node.formCode) && this.node.formType =='1'){
|
|
||||||
// res = await this.$awaitWraper(apiForm.getHistoryList(this.node.formCode))
|
|
||||||
}
|
|
||||||
return (res || []).map(t=>{return { label:this.lr_dateFormat(t.f_CreateDate),value:t.f_Id }})
|
|
||||||
}
|
|
||||||
}
|
|
||||||
},
|
|
||||||
computed: {
|
|
||||||
node(){
|
|
||||||
return this.wfdesign.currentWfNode;
|
|
||||||
}
|
|
||||||
},
|
|
||||||
inject: ["wfdesign"],
|
|
||||||
methods:{
|
|
||||||
async custmerformChange(val){
|
|
||||||
this.$set(this.node,'formRelationId','')
|
|
||||||
if(val == null){
|
|
||||||
this.node.authFields = [];
|
|
||||||
this.node.formVerison = ''
|
|
||||||
return;
|
|
||||||
}
|
|
||||||
if(this.$validatenull(this.wfdesign.custmerformSchemes[val.f_SchemeId])){
|
|
||||||
// const {f_SchemeInfoId,f_Scheme,f_Id} = (await this.$awaitWraper(apiForm.getHistory(val.f_SchemeId))) || {}
|
|
||||||
const {f_SchemeInfoId,f_Scheme,f_Id} = {}
|
|
||||||
this.wfdesign.custmerformSchemes[f_Id] = {f_Scheme}
|
|
||||||
if(this.node.formCode == f_SchemeInfoId){
|
|
||||||
this.loadFormScheme(f_Scheme)
|
|
||||||
}
|
|
||||||
}
|
|
||||||
else{
|
|
||||||
this.loadFormScheme(this.wfdesign.custmerformSchemes[val.f_SchemeId].f_Scheme);
|
|
||||||
}
|
|
||||||
this.node.formVerison = val.f_SchemeId
|
|
||||||
},
|
|
||||||
async custmerformVerisonChange(val){
|
|
||||||
this.$set(this.node,'formRelationId','')
|
|
||||||
if(this.$validatenull(val)){
|
|
||||||
this.node.authFields = []
|
|
||||||
return
|
|
||||||
}
|
|
||||||
if(this.$validatenull(this.wfdesign.custmerformSchemes[val.value])){
|
|
||||||
// const {f_Scheme,f_Id} = (await this.$awaitWraper(apiForm.getHistory(val.value))) || {}
|
|
||||||
const {f_Scheme,f_Id} = {}
|
|
||||||
this.wfdesign.custmerformSchemes[f_Id] = {f_Scheme}
|
|
||||||
if(this.node.formVerison == f_Id){
|
|
||||||
this.loadFormScheme(f_Scheme)
|
|
||||||
}
|
|
||||||
}
|
|
||||||
else{
|
|
||||||
this.loadFormScheme(this.wfdesign.custmerformSchemes[val.value].f_Scheme);
|
|
||||||
}
|
|
||||||
},
|
|
||||||
loadFormScheme(strScheme){
|
|
||||||
const scheme = JSON.parse(strScheme)
|
|
||||||
const fields = []
|
|
||||||
const rfields = []
|
|
||||||
scheme.formInfo.tabList.forEach(tab => {
|
|
||||||
tab.components.forEach(component =>{
|
|
||||||
if(['guid'].includes(component.type)){
|
|
||||||
rfields.push({label:component.label,value:component.prop})
|
|
||||||
}
|
|
||||||
|
|
||||||
if(!['gridtable','divider'].includes(component.type) && component.display){
|
|
||||||
fields.push({
|
|
||||||
prop:component.prop,
|
|
||||||
field:component.field,
|
|
||||||
label:component.label,
|
|
||||||
table:component.table,
|
|
||||||
required:component.required,
|
|
||||||
isEdit:true,
|
|
||||||
isLook:true
|
|
||||||
})
|
|
||||||
}
|
|
||||||
else if(['gridtable'].includes(component.type)){
|
|
||||||
fields.push({
|
|
||||||
prop:`${component.prop}_add`,
|
|
||||||
label:`${component.label || '表格'}-添加按钮`,
|
|
||||||
required:false,
|
|
||||||
isEdit:true,
|
|
||||||
isLook:false,
|
|
||||||
type:'grid'
|
|
||||||
})
|
|
||||||
fields.push({
|
|
||||||
prop:`${component.prop}_remove`,
|
|
||||||
label:`${component.label || '表格'}-删除按钮`,
|
|
||||||
required:false,
|
|
||||||
isEdit:true,
|
|
||||||
isLook:false,
|
|
||||||
type:'grid'
|
|
||||||
})
|
|
||||||
|
|
||||||
fields.push({
|
|
||||||
prop:`${component.prop}_required`,
|
|
||||||
label:`${component.label || '表格'}-数据`,
|
|
||||||
required:component.required,
|
|
||||||
isEdit:false,
|
|
||||||
isLook:false,
|
|
||||||
type:'gridrequired'
|
|
||||||
})
|
|
||||||
fields.push(...component.children.filter(t=>t.display).map(t=>{
|
|
||||||
return {
|
|
||||||
gridprop:component.prop,
|
|
||||||
prop:t.prop,
|
|
||||||
field:t.field,
|
|
||||||
label:`${component.label || '表格'}-${t.label}`,
|
|
||||||
table:component.table,
|
|
||||||
required:t.required,
|
|
||||||
isEdit:true,
|
|
||||||
isLook:true
|
|
||||||
}
|
|
||||||
}))
|
|
||||||
}
|
|
||||||
})
|
|
||||||
})
|
|
||||||
this.node.formRelations = rfields
|
|
||||||
this.node.authFields = fields
|
|
||||||
|
|
||||||
},
|
|
||||||
handleFormTypeChange(){
|
|
||||||
this.node.formCode = ''
|
|
||||||
this.node.formUrl = ''
|
|
||||||
this.node.formAppUrl = ''
|
|
||||||
this.node.authFields = []
|
|
||||||
this.node.formRelations = []
|
|
||||||
|
|
||||||
this.$set(this.node,'formRelationId','')
|
|
||||||
|
|
||||||
},
|
|
||||||
handleAddAuthField(){
|
|
||||||
this.node.authFields.push({
|
|
||||||
field:'',
|
|
||||||
label:'',
|
|
||||||
required:true,
|
|
||||||
isEdit:true,
|
|
||||||
isLook:true
|
|
||||||
})
|
|
||||||
},
|
|
||||||
handleDeleteAuthField(row){
|
|
||||||
this.node.authFields.splice(row.index,1);
|
|
||||||
},
|
|
||||||
|
|
||||||
handleTableBtnClick(btn){
|
|
||||||
this.node.auditUsers.splice(btn.rowIndex,1);
|
|
||||||
},
|
|
||||||
handleTableBtnClick2(btn){
|
|
||||||
this.node.lookUsers.splice(btn.rowIndex,1);
|
|
||||||
},
|
|
||||||
|
|
||||||
typeFormat(type){
|
|
||||||
switch(type){
|
|
||||||
case '1':
|
|
||||||
return '岗位'
|
|
||||||
case '2':
|
|
||||||
return '角色'
|
|
||||||
case '3':
|
|
||||||
return '用户'
|
|
||||||
case '4':
|
|
||||||
return '上下级'
|
|
||||||
case '5':
|
|
||||||
return '节点'
|
|
||||||
case '6':
|
|
||||||
return '表字段'
|
|
||||||
}
|
|
||||||
},
|
|
||||||
addTableData(selectData){
|
|
||||||
if(this.isLooker){
|
|
||||||
let addData2 = selectData.filter(t=>this.node.lookUsers.findIndex(t2=>t2.id == t.id && t2.type == t.type) == -1 );
|
|
||||||
this.node.lookUsers = this.node.lookUsers.concat(addData2);
|
|
||||||
}
|
|
||||||
else{
|
|
||||||
let addData = selectData.filter(t=>this.node.auditUsers.findIndex(t2=>t2.id == t.id && t2.type == t.type) == -1 );
|
|
||||||
this.node.auditUsers = this.node.auditUsers.concat(addData);
|
|
||||||
}
|
|
||||||
|
|
||||||
},
|
|
||||||
|
|
||||||
handlePostClick(isLooker){
|
|
||||||
this.selectPostVisible = true;
|
|
||||||
this.isLooker = isLooker;
|
|
||||||
},
|
|
||||||
handlePostSelectClosed(){
|
|
||||||
this.$refs.postSelectPanel.resetForm();
|
|
||||||
},
|
|
||||||
handlePostSelectOk(){
|
|
||||||
let selectData = this.$refs.postSelectPanel.getForm().map(t=>{return {type:'1',id:t.f_PostId,name:t.name}});
|
|
||||||
this.addTableData(selectData);
|
|
||||||
this.selectPostVisible = false;
|
|
||||||
},
|
|
||||||
|
|
||||||
handleRoleClick(isLooker){
|
|
||||||
this.selectRoleVisible = true;
|
|
||||||
this.isLooker = isLooker;
|
|
||||||
},
|
|
||||||
handleRoleSelectClosed(){
|
|
||||||
this.$refs.roleSelectPanel.resetForm();
|
|
||||||
},
|
|
||||||
handleRoleSelectOk(){
|
|
||||||
let selectData = this.$refs.roleSelectPanel.getForm().map(t=>{return {type:'2',id:t.f_RoleId,name:t.f_FullName,condition:''} });
|
|
||||||
this.addTableData(selectData);
|
|
||||||
this.selectRoleVisible = false;
|
|
||||||
},
|
|
||||||
|
|
||||||
handleUserClick(isLooker){
|
|
||||||
this.selectUserVisible = true;
|
|
||||||
this.isLooker = isLooker;
|
|
||||||
},
|
|
||||||
handleUserSelectClosed(){
|
|
||||||
this.$refs.userSelectPanel.resetForm();
|
|
||||||
},
|
|
||||||
handleUserSelectOk(){
|
|
||||||
let selectData = this.$refs.userSelectPanel.getForm().map(t=>{return {type:'3',id:t.f_UserId,name:t.name} });
|
|
||||||
this.addTableData(selectData);
|
|
||||||
this.selectUserVisible = false;
|
|
||||||
},
|
|
||||||
|
|
||||||
|
|
||||||
handleLevelClick(isLooker){
|
|
||||||
this.levelVisible = true;
|
|
||||||
this.isLooker = isLooker;
|
|
||||||
},
|
|
||||||
handleLevelClosed(){
|
|
||||||
this.$refs.auditorLevelForm.resetForm();
|
|
||||||
},
|
|
||||||
handleLevelOk(){
|
|
||||||
this.$refs.auditorLevelForm.validateForm(()=>{
|
|
||||||
let data = this.$refs.auditorLevelForm.getForm();
|
|
||||||
this.addTableData([data]);
|
|
||||||
this.levelVisible = false;
|
|
||||||
});
|
|
||||||
},
|
|
||||||
|
|
||||||
|
|
||||||
handleNodeAuditorClick(isLooker){
|
|
||||||
this.nodeAuditorVisible = true;
|
|
||||||
this.isLooker = isLooker;
|
|
||||||
},
|
|
||||||
handleNodeAuditorOk(){
|
|
||||||
this.$refs.nodeAuditorForm.validateForm(()=>{
|
|
||||||
let data = this.$refs.nodeAuditorForm.getForm();
|
|
||||||
this.addTableData([data]);
|
|
||||||
this.nodeAuditorVisible = false;
|
|
||||||
});
|
|
||||||
},
|
|
||||||
handleNodeAuditorClosed(){
|
|
||||||
this.$refs.nodeAuditorForm.resetForm();
|
|
||||||
},
|
|
||||||
handleNodeAuditorOpened(){
|
|
||||||
let wfdata = this.wfdesign.handleGetWFData();
|
|
||||||
this.$refs.nodeAuditorForm.setForm(wfdata.filter(t=>t.type = 'userTask' && t.id != this.node.id ));
|
|
||||||
},
|
|
||||||
|
|
||||||
|
|
||||||
handleAuditorSqlClick(isLooker){
|
|
||||||
this.auditorSqlVisible = true;
|
|
||||||
this.isLooker = isLooker;
|
|
||||||
},
|
|
||||||
handleAuditorSqlOk(){
|
|
||||||
this.$refs.auditorSqlForm.validateForm(()=>{
|
|
||||||
let data = this.$refs.auditorSqlForm.getForm();
|
|
||||||
data.name = `${data.table}【${data.auditorField}】`
|
|
||||||
this.addTableData([data]);
|
|
||||||
this.auditorSqlVisible = false;
|
|
||||||
});
|
|
||||||
},
|
|
||||||
handleAuditorSqlClosed(){
|
|
||||||
this.$refs.auditorSqlForm.resetForm();
|
|
||||||
},
|
|
||||||
|
|
||||||
hasBtnsDeleteBtn(row){
|
|
||||||
if(row.isSys){
|
|
||||||
return false;
|
|
||||||
}
|
|
||||||
else{
|
|
||||||
return true;
|
|
||||||
}
|
|
||||||
},
|
|
||||||
handleAddBtns(){
|
|
||||||
this.node.btnlist.push({code:'',name:'',hidden:false,isNextAuditor:false,isSign:false})
|
|
||||||
},
|
|
||||||
handleDeleteBtns(row){
|
|
||||||
this.node.btnlist.splice(row.index,1);
|
|
||||||
}
|
|
||||||
|
|
||||||
}
|
|
||||||
|
|
||||||
}
|
|
||||||
</script>
|
|
||||||
|
|
||||||
<style>
|
|
||||||
</style>
|
|
||||||
|
|
@ -0,0 +1,220 @@
|
||||||
|
<template>
|
||||||
|
<div class="shceme-info">
|
||||||
|
<a-form ref="formRef" :rules="rules" :model="formState" labelAlign="left" :label-col="labelCol" :wrapper-col="wrapperCol">
|
||||||
|
<a-form-item label="模板编号" name="f_Code">
|
||||||
|
<a-input v-model:value="formState.f_Code" placeholder="请输入" />
|
||||||
|
</a-form-item>
|
||||||
|
<a-form-item label="模板名称" name="f_Name">
|
||||||
|
<a-input v-model:value="formState.f_Name" placeholder="请输入" />
|
||||||
|
</a-form-item>
|
||||||
|
<a-form-item label="模板图标" name="f_Icon">
|
||||||
|
<IconPicker :value="formState.f_Icon" />
|
||||||
|
</a-form-item>
|
||||||
|
<a-form-item label="图标颜色" name="f_Color">
|
||||||
|
<a-input type="color" v-model="formState.f_Color" placeholder="请输入"></a-input>
|
||||||
|
</a-form-item>
|
||||||
|
<a-form-item label="模板分类" name="f_Category">
|
||||||
|
<a-select v-model:value="formState.f_Category" placeholder="please select your zone">
|
||||||
|
<a-select-option value="shanghai">Zone one</a-select-option>
|
||||||
|
<a-select-option value="beijing">Zone two</a-select-option>
|
||||||
|
</a-select>
|
||||||
|
</a-form-item>
|
||||||
|
<a-form-item label="我的任务创建">
|
||||||
|
<a-radio-group v-model:value="formState.f_Mark" name="radioGroup">
|
||||||
|
<a-radio v-for="item in data.optionsNotOrOk" :value="item.value">{{item.label}}</a-radio>
|
||||||
|
</a-radio-group>
|
||||||
|
</a-form-item>
|
||||||
|
<a-form-item label="移动端创建">
|
||||||
|
<a-radio-group v-model:value="formState.f_IsInApp" name="radioGroup">
|
||||||
|
<a-radio v-for="item in data.optionsNotOrOk" :value="item.value">{{item.label}}</a-radio>
|
||||||
|
</a-radio-group>
|
||||||
|
</a-form-item>
|
||||||
|
<a-textarea v-model:value="formState.f_Description" placeholder="请填写备注"
|
||||||
|
:auto-size="{ minRows: 5, maxRows: 8 }" />
|
||||||
|
|
||||||
|
|
||||||
|
<a-divider plain="true">撤销操作</a-divider>
|
||||||
|
<a-tabs v-model:activeKey="formState.undoType" type="card" size="small" centered="true">
|
||||||
|
<a-tab-pane key="1" tab="执行SQL">
|
||||||
|
<a-space direction="vertical" size="middle" class="site-space-compact-wrapper">
|
||||||
|
<a-space-compact block>
|
||||||
|
<a-select v-model:value="formState.undoDbCode" placeholder="请选择执行SQL数据库">
|
||||||
|
<a-select-option value="shanghai">Zone one</a-select-option>
|
||||||
|
<a-select-option value="beijing">Zone two</a-select-option>
|
||||||
|
</a-select>
|
||||||
|
</a-space-compact>
|
||||||
|
<a-space-compact block>
|
||||||
|
<a-textarea v-model:value="formState.undoDbSQL"
|
||||||
|
placeholder="请填写SQL语句，参数有 @processId流程进程主键 @userId用户Id @userAccount用户账号 @companyId用户公司 @departmentId用户部门"
|
||||||
|
:auto-size="{ minRows: 5, maxRows: 8 }" />
|
||||||
|
</a-space-compact>
|
||||||
|
</a-space>
|
||||||
|
</a-tab-pane>
|
||||||
|
<a-tab-pane key="2" tab=".NET方法">
|
||||||
|
<a-space direction="vertical" size="middle" class="site-space-compact-wrapper">
|
||||||
|
<a-space-compact block>
|
||||||
|
<a-textarea v-model:value="formState.undoIOCName" placeholder="请填写.NET方法IOC别名"
|
||||||
|
:auto-size="{ minRows: 5, maxRows: 8 }" />
|
||||||
|
</a-space-compact>
|
||||||
|
</a-space>
|
||||||
|
</a-tab-pane>
|
||||||
|
<a-tab-pane key="3" tab="第三方接口">
|
||||||
|
<a-space direction="vertical" size="middle" class="site-space-compact-wrapper">
|
||||||
|
<a-space-compact block>
|
||||||
|
<a-textarea v-model:value="formState.undoUrl"
|
||||||
|
placeholder="请填写第三方接口地址(POST),JSON 格式,参数有 userId用户Id,userAccount用户账号,companyId用户公司,departmentId用户部门"
|
||||||
|
:auto-size="{ minRows: 5, maxRows: 8 }" />
|
||||||
|
</a-space-compact>
|
||||||
|
</a-space>
|
||||||
|
</a-tab-pane>
|
||||||
|
</a-tabs>
|
||||||
|
|
||||||
|
<a-divider plain="true">作废操作</a-divider>
|
||||||
|
<a-tabs v-model:activeKey="formState.deleteType" type="card" size="small" centered="true">
|
||||||
|
<a-tab-pane key="1" tab="执行SQL">
|
||||||
|
<a-space direction="vertical" size="middle" class="site-space-compact-wrapper">
|
||||||
|
<a-space-compact block>
|
||||||
|
<a-select v-model:value="formState.deleteDbCode" placeholder="请选择执行SQL数据库">
|
||||||
|
<a-select-option value="shanghai">Zone one</a-select-option>
|
||||||
|
<a-select-option value="beijing">Zone two</a-select-option>
|
||||||
|
</a-select>
|
||||||
|
</a-space-compact>
|
||||||
|
<a-space-compact block>
|
||||||
|
<a-textarea v-model:value="formState.deleteDbSQL"
|
||||||
|
placeholder="请填写SQL语句，参数有 @processId流程进程主键 @userId用户Id @userAccount用户账号 @companyId用户公司 @departmentId用户部门"
|
||||||
|
:auto-size="{ minRows: 5, maxRows: 8 }" />
|
||||||
|
</a-space-compact>
|
||||||
|
</a-space>
|
||||||
|
</a-tab-pane>
|
||||||
|
<a-tab-pane key="2" tab=".NET方法">
|
||||||
|
<a-space direction="vertical" size="middle" class="site-space-compact-wrapper">
|
||||||
|
<a-space-compact block>
|
||||||
|
<a-textarea v-model:value="formState.deleteIOCName" placeholder="请填写.NET方法IOC别名"
|
||||||
|
:auto-size="{ minRows: 5, maxRows: 8 }" />
|
||||||
|
</a-space-compact>
|
||||||
|
</a-space>
|
||||||
|
</a-tab-pane>
|
||||||
|
<a-tab-pane key="3" tab="第三方接口">
|
||||||
|
<a-space direction="vertical" size="middle" class="site-space-compact-wrapper">
|
||||||
|
<a-space-compact block>
|
||||||
|
<a-textarea v-model:value="formState.undoUrl"
|
||||||
|
placeholder="请填写第三方接口地址(POST),JSON 格式,参数有 userId用户Id,userAccount用户账号,companyId用户公司,departmentId用户部门"
|
||||||
|
:auto-size="{ minRows: 5, maxRows: 8 }" />
|
||||||
|
</a-space-compact>
|
||||||
|
</a-space>
|
||||||
|
</a-tab-pane>
|
||||||
|
</a-tabs>
|
||||||
|
|
||||||
|
<a-divider plain="true">删除草稿</a-divider>
|
||||||
|
<a-tabs v-model:activeKey="formState.deleteDraftType" type="card" size="small" centered="true">
|
||||||
|
<a-tab-pane key="1" tab="执行SQL">
|
||||||
|
<a-space direction="vertical" size="middle" class="site-space-compact-wrapper">
|
||||||
|
<a-space-compact block>
|
||||||
|
<a-select v-model:value="formState.deleteDraftDbCode" placeholder="请选择执行SQL数据库">
|
||||||
|
<a-select-option value="shanghai">Zone one</a-select-option>
|
||||||
|
<a-select-option value="beijing">Zone two</a-select-option>
|
||||||
|
</a-select>
|
||||||
|
</a-space-compact>
|
||||||
|
<a-space-compact block>
|
||||||
|
<a-textarea v-model:value="formState.deleteDraftDbSQL"
|
||||||
|
placeholder="请填写SQL语句，参数有 @processId流程进程主键 @userId用户Id @userAccount用户账号 @companyId用户公司 @departmentId用户部门"
|
||||||
|
:auto-size="{ minRows: 5, maxRows: 8 }" />
|
||||||
|
</a-space-compact>
|
||||||
|
</a-space>
|
||||||
|
</a-tab-pane>
|
||||||
|
<a-tab-pane key="2" tab=".NET方法">
|
||||||
|
<a-space direction="vertical" size="middle" class="site-space-compact-wrapper">
|
||||||
|
<a-space-compact block>
|
||||||
|
<a-textarea v-model:value="formState.deleteDraftIOCName" placeholder="请填写.NET方法IOC别名"
|
||||||
|
:auto-size="{ minRows: 5, maxRows: 8 }" />
|
||||||
|
</a-space-compact>
|
||||||
|
</a-space>
|
||||||
|
</a-tab-pane>
|
||||||
|
<a-tab-pane key="3" tab="第三方接口">
|
||||||
|
<a-space direction="vertical" size="middle" class="site-space-compact-wrapper">
|
||||||
|
<a-space-compact block>
|
||||||
|
<a-textarea v-model:value="formState.undoUrl"
|
||||||
|
placeholder="请填写第三方接口地址(POST),JSON 格式,参数有 userId用户Id,userAccount用户账号,companyId用户公司,departmentId用户部门"
|
||||||
|
:auto-size="{ minRows: 5, maxRows: 8 }" />
|
||||||
|
</a-space-compact>
|
||||||
|
</a-space>
|
||||||
|
</a-tab-pane>
|
||||||
|
</a-tabs>
|
||||||
|
</a-form>
|
||||||
|
</div>
|
||||||
|
</template>
|
||||||
|
<script lang="ts" setup>
|
||||||
|
import { Dayjs } from 'dayjs';
|
||||||
|
import { reactive, ref, toRaw } from 'vue';
|
||||||
|
import type { UnwrapRef } from 'vue';
|
||||||
|
import type { Rule } from 'ant-design-vue/es/form';
|
||||||
|
import { IconPicker } from '/@/components/Icon';
|
||||||
|
const formRef = ref();
|
||||||
|
const labelCol = { span: 7 };
|
||||||
|
const wrapperCol = { span: 17 };
|
||||||
|
const activeKey = ref('1')
|
||||||
|
const data = reactive({
|
||||||
|
optionsNotOrOk: [{ label: '允许', value: 1 }, { label: '不允许', value: 2 }],
|
||||||
|
|
||||||
|
})
|
||||||
|
const formState = reactive({
|
||||||
|
f_Code: '',
|
||||||
|
f_Name: '',
|
||||||
|
f_Category: '',
|
||||||
|
f_Mark: 1,
|
||||||
|
f_IsInApp: 2,
|
||||||
|
f_Description: '',
|
||||||
|
|
||||||
|
titleRules: '',
|
||||||
|
|
||||||
|
undoType: "1",
|
||||||
|
undoDbCode: '',
|
||||||
|
undoDbSQL: '',
|
||||||
|
undoIOCName: '',
|
||||||
|
undoUrl: '',
|
||||||
|
|
||||||
|
deleteType: "1",
|
||||||
|
deleteDbCode: '',
|
||||||
|
deleteDbSQL: '',
|
||||||
|
deleteIOCName: '',
|
||||||
|
deleteUrl: '',
|
||||||
|
|
||||||
|
deleteDraftType: "1",
|
||||||
|
deleteDraftDbCode: '',
|
||||||
|
deleteDraftDbSQL: '',
|
||||||
|
deleteDraftIOCName: '',
|
||||||
|
deleteDraftUrl: '',
|
||||||
|
f_Icon: '',
|
||||||
|
f_Color: '#409EFF',
|
||||||
|
});
|
||||||
|
const rules: Record<string, Rule[]> = {
|
||||||
|
f_Code: [
|
||||||
|
{ required: true, message: '请输入模板编号' },
|
||||||
|
// { validator: lr_existDbFiled, keyValue: () => { return data.formData.f_Id }, tableName: 'lr_wf_schemeinfo', keyName: 'f_Id', trigger: 'blur' }
|
||||||
|
],
|
||||||
|
f_Name: [
|
||||||
|
{ required: true, message: '请输入模板名称' }
|
||||||
|
],
|
||||||
|
f_Category: [
|
||||||
|
{ required: true, message: '请选择模板分类' }
|
||||||
|
],
|
||||||
|
f_Icon: [
|
||||||
|
{ required: true, message: '请选择图标' }
|
||||||
|
],
|
||||||
|
f_Color: [
|
||||||
|
{ required: true, message: '请选择颜色' }
|
||||||
|
],
|
||||||
|
};
|
||||||
|
|
||||||
|
</script>
|
||||||
|
<style lang="less" scoped>
|
||||||
|
.site-space-compact-wrapper {
|
||||||
|
width: 100%;
|
||||||
|
.ant-select {
|
||||||
|
width: 100%;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
::v-deep .ant-tabs {
|
||||||
|
padding: 0!important;
|
||||||
|
}
|
||||||
|
</style>
|
||||||
|
|
@ -0,0 +1,349 @@
|
||||||
|
<!-- 开始节点配置 -->
|
||||||
|
<template>
|
||||||
|
<div class="start-event">
|
||||||
|
|
||||||
|
<a-form ref="formRef" :rules="rules" :model="formState" labelAlign="left" :label-col="labelCol"
|
||||||
|
:wrapper-col="wrapperCol">
|
||||||
|
<a-form-item label="节点标识">
|
||||||
|
<a-input v-model:value="node.id" placeholder="请输入" readonly />
|
||||||
|
</a-form-item>
|
||||||
|
<a-form-item label="下一审核人">
|
||||||
|
<a-switch v-model:checked="node.isNextAuditor" />
|
||||||
|
</a-form-item>
|
||||||
|
<a-form-item label="自定义标题">
|
||||||
|
<a-switch v-model:checked="node.isCustmerTitle" />
|
||||||
|
</a-form-item>
|
||||||
|
<a-form-item label="通知策略" name="f_Color">
|
||||||
|
<a-checkbox-group v-model:value="node.messageType" name="checkboxgroup"
|
||||||
|
:options="[{value:'1',label:'短信'},{value:'2',label:'邮箱'},{value:'3',label:'微信'},{value:'4',label:'站内消息'}]" />
|
||||||
|
</a-form-item>
|
||||||
|
|
||||||
|
<a-divider plain="true">表单添加</a-divider>
|
||||||
|
<a-tabs v-model:activeKey="node.formType" type="card" size="small" centered="true">
|
||||||
|
<a-tab-pane key="1" tab="自定义表单">
|
||||||
|
<a-space direction="vertical" size="middle" class="site-space-compact-wrapper">
|
||||||
|
<a-space-compact block>
|
||||||
|
<a-select v-model:value="node.formVerison" placeholder="请选择表单版本">
|
||||||
|
<a-select-option value="shanghai">Zone one</a-select-option>
|
||||||
|
<a-select-option value="beijing">Zone two</a-select-option>
|
||||||
|
</a-select>
|
||||||
|
</a-space-compact>
|
||||||
|
<a-space-compact block>
|
||||||
|
<a-select v-model:value="node.formRelationId" placeholder="请选择流程关联字段">
|
||||||
|
<a-select-option value="shanghai">Zone one</a-select-option>
|
||||||
|
<a-select-option value="beijing">Zone two</a-select-option>
|
||||||
|
</a-select>
|
||||||
|
</a-space-compact>
|
||||||
|
</a-space>
|
||||||
|
</a-tab-pane>
|
||||||
|
<a-tab-pane key="2" tab="系统表单">
|
||||||
|
<a-space direction="vertical" size="middle" class="site-space-compact-wrapper">
|
||||||
|
<a-space-compact block>
|
||||||
|
<a-input v-model:value="node.formUrl" placeholder="请输入PC端表单地址" />
|
||||||
|
</a-space-compact>
|
||||||
|
<a-space-compact block>
|
||||||
|
<a-input v-model:value="node.formAppUrl" placeholder="请输入APP端表单地址" />
|
||||||
|
</a-space-compact>
|
||||||
|
</a-space>
|
||||||
|
</a-tab-pane>
|
||||||
|
</a-tabs>
|
||||||
|
|
||||||
|
<a-divider plain="true">表单字段权限</a-divider>
|
||||||
|
<a-table :columns="data.columns" :data-source="node.authFields" bordered :pagination="false"
|
||||||
|
v-if="node.formType == 1">
|
||||||
|
<template #bodyCell="{ column, text, record }">
|
||||||
|
<template v-if="['label', 'field'].includes(column.dataIndex)">
|
||||||
|
<div>
|
||||||
|
{{ text }}
|
||||||
|
</div>
|
||||||
|
</template>
|
||||||
|
<template v-else-if="['required', 'isEdit','isLook'].includes(column.dataIndex)">
|
||||||
|
<div>
|
||||||
|
<a-switch v-model:checked="record[column.dataIndex]" />
|
||||||
|
</div>
|
||||||
|
</template>
|
||||||
|
</template>
|
||||||
|
</a-table>
|
||||||
|
<a-table :columns="data.columns" :data-source="node.authFields" bordered :pagination="false" v-else>
|
||||||
|
<template #bodyCell="{ column, text, record }">
|
||||||
|
<template v-if="['label', 'field'].includes(column.dataIndex)">
|
||||||
|
<div>
|
||||||
|
{{ text }}
|
||||||
|
</div>
|
||||||
|
</template>
|
||||||
|
<template v-else-if="['required', 'isEdit','isLook'].includes(column.dataIndex)">
|
||||||
|
<div>
|
||||||
|
<a-switch v-model:checked="record[column.dataIndex]" />
|
||||||
|
</div>
|
||||||
|
</template>
|
||||||
|
<template v-else-if="column.dataIndex === 'operation'">
|
||||||
|
<delete-outlined two-tone-color='#eb2f96' @click='handleDeleteAuthField(record.field)' />
|
||||||
|
</template>
|
||||||
|
</template>
|
||||||
|
</a-table>
|
||||||
|
|
||||||
|
<a-divider plain="true"></a-divider>
|
||||||
|
<a-space v-if="node.formType!=1">
|
||||||
|
<a-button @click="handleAddAuthField" width="100%" type="dashed" danger :icon="h(PlusOutlined)">添加字段</a-button>
|
||||||
|
</a-space>
|
||||||
|
<!-- <a-table :columns="data.columns" :data-source="node.authField" bordered :pagination="false">
|
||||||
|
<template #bodyCell="{ column, text, record }">
|
||||||
|
<template v-if="['name', 'type'].includes(column.dataIndex)">
|
||||||
|
<div>
|
||||||
|
<a-input
|
||||||
|
v-model:value="text"
|
||||||
|
style="margin: -5px 0"
|
||||||
|
/>
|
||||||
|
</div>
|
||||||
|
</template>
|
||||||
|
<template v-else-if="column.dataIndex === 'operation'">
|
||||||
|
<a>删除</a>
|
||||||
|
</template>
|
||||||
|
</template>
|
||||||
|
</a-table> -->
|
||||||
|
|
||||||
|
</a-form>
|
||||||
|
</div>
|
||||||
|
</template>
|
||||||
|
|
||||||
|
<script lang="ts" setup>
|
||||||
|
import { reactive, defineProps, computed, inject, ref, watch, h } from 'vue'
|
||||||
|
import { DeleteOutlined, PlusOutlined } from '@ant-design/icons-vue'
|
||||||
|
const props = defineProps({
|
||||||
|
disabled: {
|
||||||
|
type: Boolean,
|
||||||
|
default: false
|
||||||
|
},
|
||||||
|
element: Object
|
||||||
|
})
|
||||||
|
const data = reactive({
|
||||||
|
columns: [
|
||||||
|
{
|
||||||
|
title: '名称',
|
||||||
|
dataIndex: 'label',
|
||||||
|
},
|
||||||
|
{
|
||||||
|
title: '字段',
|
||||||
|
dataIndex: 'field',
|
||||||
|
},
|
||||||
|
{
|
||||||
|
title: '必填',
|
||||||
|
dataIndex: 'required',
|
||||||
|
},
|
||||||
|
{
|
||||||
|
title: '编辑',
|
||||||
|
dataIndex: 'isEdit',
|
||||||
|
},
|
||||||
|
{
|
||||||
|
title: '查看',
|
||||||
|
dataIndex: 'isLook',
|
||||||
|
},
|
||||||
|
|
||||||
|
|
||||||
|
],
|
||||||
|
formRelations: [],
|
||||||
|
elementData: props.element
|
||||||
|
})
|
||||||
|
const node = reactive({
|
||||||
|
id: data.elementData.id,
|
||||||
|
type: data.elementData.type,
|
||||||
|
isNextAuditor: false,
|
||||||
|
isCustmerTitle: false,
|
||||||
|
formRelations: [],
|
||||||
|
formType: "1",
|
||||||
|
formCode: "",
|
||||||
|
formVerison: "",
|
||||||
|
formRelationId: "",
|
||||||
|
formUrl: "",
|
||||||
|
formAppUrl: "",
|
||||||
|
authFields: [
|
||||||
|
{
|
||||||
|
label: '测试',
|
||||||
|
field: 'ceshi',
|
||||||
|
required: true,
|
||||||
|
isEdit: true,
|
||||||
|
isLook: true,
|
||||||
|
}
|
||||||
|
],
|
||||||
|
messageType: "",
|
||||||
|
isInit: true
|
||||||
|
})
|
||||||
|
watch(
|
||||||
|
() => props.element,
|
||||||
|
(newVal, oldVal) => {
|
||||||
|
data.elementData = newVal
|
||||||
|
node.id = data.elementData.id
|
||||||
|
node.type = data.elementData.type
|
||||||
|
}
|
||||||
|
)
|
||||||
|
watch(
|
||||||
|
() => node.formType,
|
||||||
|
(newVal, oldVal) => {
|
||||||
|
if (newVal == 1) {
|
||||||
|
data.columns = data.columns.filter(item => item.dataIndex !== 'operation');
|
||||||
|
} else {
|
||||||
|
data.columns.push({
|
||||||
|
title: '',
|
||||||
|
dataIndex: 'operation',
|
||||||
|
})
|
||||||
|
}
|
||||||
|
}
|
||||||
|
)
|
||||||
|
|
||||||
|
|
||||||
|
async function custmerformChange(val) {
|
||||||
|
this.$set(this.node, 'formRelationId', '')
|
||||||
|
if (val == null) {
|
||||||
|
this.node.authFields = [];
|
||||||
|
this.node.formVerison = ''
|
||||||
|
return;
|
||||||
|
}
|
||||||
|
if (this.$validatenull(this.wfdesign.custmerformSchemes[val.f_SchemeId])) {
|
||||||
|
// const {f_SchemeInfoId,f_Scheme,f_Id} = (await this.$awaitWraper(apiForm.getHistory(val.f_SchemeId))) || {}
|
||||||
|
this.wfdesign.custmerformSchemes[f_Id] = { f_Scheme }
|
||||||
|
if (this.node.formCode == f_SchemeInfoId) {
|
||||||
|
this.loadFormScheme(f_Scheme)
|
||||||
|
}
|
||||||
|
}
|
||||||
|
else {
|
||||||
|
this.loadFormScheme(this.wfdesign.custmerformSchemes[val.f_SchemeId].f_Scheme);
|
||||||
|
}
|
||||||
|
this.node.formVerison = val.f_SchemeId
|
||||||
|
}
|
||||||
|
async function custmerformVerisonChange(val) {
|
||||||
|
this.$set(this.node, 'formRelationId', '')
|
||||||
|
if (this.$validatenull(val)) {
|
||||||
|
this.node.authFields = []
|
||||||
|
return
|
||||||
|
}
|
||||||
|
if (this.$validatenull(this.wfdesign.custmerformSchemes[val.value])) {
|
||||||
|
// const {f_Scheme,f_Id} = (await this.$awaitWraper(apiForm.getHistory(val.value))) || {}
|
||||||
|
this.wfdesign.custmerformSchemes[f_Id] = { f_Scheme }
|
||||||
|
if (this.node.formVerison == f_Id) {
|
||||||
|
|
||||||
|
this.loadFormScheme(f_Scheme)
|
||||||
|
}
|
||||||
|
}
|
||||||
|
else {
|
||||||
|
this.loadFormScheme(this.wfdesign.custmerformSchemes[val.value].f_Scheme);
|
||||||
|
}
|
||||||
|
}
|
||||||
|
function loadFormScheme(strScheme) {
|
||||||
|
const scheme = JSON.parse(strScheme)
|
||||||
|
const fields = []
|
||||||
|
const rfields = []
|
||||||
|
scheme.formInfo.tabList.forEach(tab => {
|
||||||
|
tab.components.forEach(component => {
|
||||||
|
if (['guid'].includes(component.type)) {
|
||||||
|
rfields.push({ label: component.label, value: component.prop })
|
||||||
|
}
|
||||||
|
|
||||||
|
if (!['gridtable', 'divider'].includes(component.type) && component.display) {
|
||||||
|
fields.push({
|
||||||
|
prop: component.prop,
|
||||||
|
field: component.field,
|
||||||
|
label: component.label,
|
||||||
|
table: component.table,
|
||||||
|
required: component.required,
|
||||||
|
isEdit: true,
|
||||||
|
isLook: true
|
||||||
|
})
|
||||||
|
}
|
||||||
|
else if (['gridtable'].includes(component.type)) {
|
||||||
|
fields.push({
|
||||||
|
prop: `${component.prop}_add`,
|
||||||
|
label: `${component.label || '表格'}-添加按钮`,
|
||||||
|
required: false,
|
||||||
|
isEdit: true,
|
||||||
|
isLook: false,
|
||||||
|
type: 'grid'
|
||||||
|
})
|
||||||
|
fields.push({
|
||||||
|
prop: `${component.prop}_remove`,
|
||||||
|
label: `${component.label || '表格'}-删除按钮`,
|
||||||
|
required: false,
|
||||||
|
isEdit: true,
|
||||||
|
isLook: false,
|
||||||
|
type: 'grid'
|
||||||
|
})
|
||||||
|
|
||||||
|
fields.push({
|
||||||
|
prop: `${component.prop}_required`,
|
||||||
|
label: `${component.label || '表格'}-数据`,
|
||||||
|
required: component.required,
|
||||||
|
isEdit: false,
|
||||||
|
isLook: false,
|
||||||
|
type: 'gridrequired'
|
||||||
|
})
|
||||||
|
fields.push(...component.children.filter(t => t.display).map(t => {
|
||||||
|
return {
|
||||||
|
gridprop: component.prop,
|
||||||
|
prop: t.prop,
|
||||||
|
field: t.field,
|
||||||
|
label: `${component.label || '表格'}-${t.label}`,
|
||||||
|
table: component.table,
|
||||||
|
required: t.required,
|
||||||
|
isEdit: true,
|
||||||
|
isLook: true
|
||||||
|
}
|
||||||
|
}))
|
||||||
|
}
|
||||||
|
})
|
||||||
|
})
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
this.node.formRelations = rfields
|
||||||
|
this.node.authFields = fields
|
||||||
|
|
||||||
|
}
|
||||||
|
function handleFormTypeChange() {
|
||||||
|
this.node.formCode = ''
|
||||||
|
this.node.formUrl = ''
|
||||||
|
this.node.formAppUrl = ''
|
||||||
|
this.node.authFields = []
|
||||||
|
this.node.formRelations = []
|
||||||
|
|
||||||
|
this.$set(this.node, 'formRelationId', '')
|
||||||
|
|
||||||
|
}
|
||||||
|
function handleAddAuthField() {
|
||||||
|
node.authFields.push({
|
||||||
|
field: '',
|
||||||
|
label: '',
|
||||||
|
required: true,
|
||||||
|
isEdit: true,
|
||||||
|
isLook: true
|
||||||
|
})
|
||||||
|
}
|
||||||
|
function handleDeleteAuthField(key) {
|
||||||
|
node.authFields = node.authFields.filter(item => item.field !== key);
|
||||||
|
}
|
||||||
|
|
||||||
|
</script>
|
||||||
|
<style lang="less" scoped>
|
||||||
|
.site-space-compact-wrapper {
|
||||||
|
width: 100%;
|
||||||
|
|
||||||
|
.ant-select {
|
||||||
|
width: 100%;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
::v-deep .ant-tabs {
|
||||||
|
padding: 0 !important;
|
||||||
|
}
|
||||||
|
|
||||||
|
::v-deep .ant-space {
|
||||||
|
width: 90%;
|
||||||
|
margin-left: 5%;
|
||||||
|
|
||||||
|
.ant-space-item {
|
||||||
|
width: 100%;
|
||||||
|
|
||||||
|
button {
|
||||||
|
width: 100%;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
</style>
|
||||||
|
|
@ -0,0 +1,673 @@
|
||||||
|
<!-- 开始节点配置 -->
|
||||||
|
<template>
|
||||||
|
<el-form label-width="96px" label-position="left" size="mini">
|
||||||
|
<el-collapse v-model="activeNames" accordion>
|
||||||
|
<el-collapse-item :title="$t('基础配置')" name="1">
|
||||||
|
<div style="padding:0 16px;">
|
||||||
|
<el-form-item label="节点标识">
|
||||||
|
<el-input v-model="node.id" readonly></el-input>
|
||||||
|
</el-form-item>
|
||||||
|
<el-form-item label="继承表单">
|
||||||
|
<el-switch :disabled="disabled" v-model="node.isInherit">
|
||||||
|
</el-switch>
|
||||||
|
</el-form-item>
|
||||||
|
<el-form-item label="允许加签">
|
||||||
|
<el-switch :disabled="disabled" v-model="node.isAddSign">
|
||||||
|
</el-switch>
|
||||||
|
</el-form-item>
|
||||||
|
<el-form-item label="允许转移">
|
||||||
|
<el-switch :disabled="disabled" v-model="node.isTransfer">
|
||||||
|
</el-switch>
|
||||||
|
</el-form-item>
|
||||||
|
<el-form-item label="允许批量审核">
|
||||||
|
<el-switch :disabled="disabled" v-model="node.isBatchAudit">
|
||||||
|
</el-switch>
|
||||||
|
</el-form-item>
|
||||||
|
<el-form-item label="自动同意规则">
|
||||||
|
<l-select multiple :disabled="disabled" v-model="node.autoAgree" :options="atuoAgreeOptions">
|
||||||
|
</l-select>
|
||||||
|
</el-form-item>
|
||||||
|
<el-form-item label="无对应处理人">
|
||||||
|
<l-select :disabled="disabled" v-model="node.noAuditor" :options="noAuditorOptions">
|
||||||
|
</l-select>
|
||||||
|
</el-form-item>
|
||||||
|
<el-form-item label="驳回策略">
|
||||||
|
<l-radio :disabled="disabled" v-model="node.rejectType"
|
||||||
|
:options="[{value:'1',label:'驳回节点固定'},{value:'2',label:'能驳回到任何执行过节点'}]">
|
||||||
|
</l-radio>
|
||||||
|
</el-form-item>
|
||||||
|
|
||||||
|
<el-form-item label="通知策略">
|
||||||
|
<l-checkbox :disabled="disabled" v-model="node.messageType"
|
||||||
|
:options="[{value:'1',label:'短信'},{value:'2',label:'邮箱'},{value:'3',label:'微信'},{value:'4',label:'站内消息'}]">
|
||||||
|
</l-checkbox>
|
||||||
|
</el-form-item>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
</el-collapse-item>
|
||||||
|
<el-collapse-item :title="$t('审核人员设置')" name="2">
|
||||||
|
<el-button-group style="padding:0 0 8px 8px" v-if="!disabled">
|
||||||
|
<el-button size="mini" @click="handlePostClick(false)">{{$t('岗位')}}</el-button>
|
||||||
|
<el-button size="mini" @click="handleRoleClick(false)">{{$t('角色')}}</el-button>
|
||||||
|
<el-button size="mini" @click="handleUserClick(false)">{{$t('用户')}}</el-button>
|
||||||
|
<el-button size="mini" @click="handleLevelClick(false)">{{$t('上下级')}}</el-button>
|
||||||
|
<el-button size="mini" @click="handleNodeAuditorClick(false)">{{$t('节点执行人')}}</el-button>
|
||||||
|
<el-button size="mini" @click="handleAuditorSqlClick(false)">{{$t('表字段')}}</el-button>
|
||||||
|
</el-button-group>
|
||||||
|
<l-table height="notset" :isShowNum="false" :columns="userColumns" :dataSource="node.auditUsers">
|
||||||
|
<template v-slot:type="scope">
|
||||||
|
{{typeFormat(scope.row.type)}}
|
||||||
|
</template>
|
||||||
|
<template v-slot:condition="scope">
|
||||||
|
<l-select :disabled="disabled" size="mini" v-if="scope.row.type == '2'"
|
||||||
|
:options="conditionOptions" v-model="scope.row.condition"></l-select>
|
||||||
|
</template>
|
||||||
|
<l-table-btns v-if="!disabled" :isFixed="false" :btns="tableBtns" @click="handleTableBtnClick">
|
||||||
|
</l-table-btns>
|
||||||
|
</l-table>
|
||||||
|
</el-collapse-item>
|
||||||
|
<el-collapse-item :title="$t('传阅人员设置')" name="3">
|
||||||
|
<el-button-group style="padding:0 0 8px 8px" v-if="!disabled">
|
||||||
|
<el-button size="mini" @click="handlePostClick(true)">{{$t('岗位')}}</el-button>
|
||||||
|
<el-button size="mini" @click="handleRoleClick(true)">{{$t('角色')}}</el-button>
|
||||||
|
<el-button size="mini" @click="handleUserClick(true)">{{$t('用户')}}</el-button>
|
||||||
|
<el-button size="mini" @click="handleLevelClick(true)">{{$t('上下级')}}</el-button>
|
||||||
|
<el-button size="mini" @click="handleNodeAuditorClick(true)">{{$t('节点执行人')}}</el-button>
|
||||||
|
<el-button size="mini" @click="handleAuditorSqlClick(true)">{{$t('表字段')}}</el-button>
|
||||||
|
</el-button-group>
|
||||||
|
<l-table height="notset" :isShowNum="false" :columns="userColumns" :dataSource="node.lookUsers">
|
||||||
|
<template v-slot:type="scope">
|
||||||
|
{{typeFormat(scope.row.type)}}
|
||||||
|
</template>
|
||||||
|
<template v-slot:condition="scope">
|
||||||
|
<l-select :disabled="disabled" size="mini" v-if="scope.row.type == '2'"
|
||||||
|
:options="conditionOptions" v-model="scope.row.condition"></l-select>
|
||||||
|
</template>
|
||||||
|
<l-table-btns v-if="!disabled" :isFixed="false" :btns="tableBtns" @click="handleTableBtnClick2">
|
||||||
|
</l-table-btns>
|
||||||
|
</l-table>
|
||||||
|
</el-collapse-item>
|
||||||
|
<el-collapse-item v-if="!node.isInherit" :title="$t('表单设置')" name="4">
|
||||||
|
<div style="padding:0 16px;">
|
||||||
|
<div style="text-align: center;margin-bottom:16px;">
|
||||||
|
<el-radio-group :disabled="disabled" v-model="node.formType" size="mini"
|
||||||
|
@change="handleFormTypeChange">
|
||||||
|
<el-radio-button label="1">自定义表单</el-radio-button>
|
||||||
|
<el-radio-button label="2">系统表单</el-radio-button>
|
||||||
|
</el-radio-group>
|
||||||
|
</div>
|
||||||
|
<div v-show="node.formType === '1'">
|
||||||
|
<el-form-item label-width="0px">
|
||||||
|
<l-custmerform-select v-model="node.formCode" @change="custmerformChange"
|
||||||
|
:disabled="disabled">
|
||||||
|
</l-custmerform-select>
|
||||||
|
</el-form-item>
|
||||||
|
<el-form-item label-width="0px">
|
||||||
|
<l-select v-model="node.formVerison" :disabled="disabled" :options="formVerisons"
|
||||||
|
@change="custmerformVerisonChange" placeholder="请选择表单版本">
|
||||||
|
</l-select>
|
||||||
|
</el-form-item>
|
||||||
|
<el-form-item label-width="0px">
|
||||||
|
<l-select v-model="node.formRelationId" :disabled="disabled" :options="node.formRelations"
|
||||||
|
placeholder="请选择流程关联字段">
|
||||||
|
</l-select>
|
||||||
|
</el-form-item>
|
||||||
|
|
||||||
|
</div>
|
||||||
|
<div v-show="node.formType === '2'">
|
||||||
|
<el-form-item label-width="0px">
|
||||||
|
<el-input v-model="node.formUrl" placeholder="请输入PC端表单地址" :readonly="disabled">
|
||||||
|
</el-input>
|
||||||
|
</el-form-item>
|
||||||
|
<el-form-item label-width="0px">
|
||||||
|
<el-input v-model="node.formAppUrl" placeholder="请输入APP端表单地址" :readonly="disabled">
|
||||||
|
</el-input>
|
||||||
|
</el-form-item>
|
||||||
|
</div>
|
||||||
|
<el-divider>表单字段权限</el-divider>
|
||||||
|
<template v-if="node.formType === '1'">
|
||||||
|
<l-table height="notset" :isShowNum="false" :columns="columns" :dataSource="node.authFields"
|
||||||
|
ref="authField">
|
||||||
|
<template v-slot:required="scope">
|
||||||
|
<el-switch v-model="scope.row.required"
|
||||||
|
:disabled="disabled || scope.row.type == 'grid'">
|
||||||
|
</el-switch>
|
||||||
|
</template>
|
||||||
|
<template v-slot:isEdit="scope">
|
||||||
|
<el-switch v-model="scope.row.isEdit"
|
||||||
|
:disabled="disabled || scope.row.type == 'gridrequired'">
|
||||||
|
</el-switch>
|
||||||
|
</template>
|
||||||
|
<template v-slot:isLook="scope">
|
||||||
|
<el-switch v-model="scope.row.isLook"
|
||||||
|
:disabled="disabled || scope.row.type == 'grid' || scope.row.type == 'gridrequired'">
|
||||||
|
</el-switch>
|
||||||
|
</template>
|
||||||
|
</l-table>
|
||||||
|
</template>
|
||||||
|
<template v-else>
|
||||||
|
<l-edit-table addBtnText="添加字段" :dataSource="node.authFields" :isShowNum="false"
|
||||||
|
:isAddBtn="!disabled" :isRemoveBtn="!disabled" @addRow="handleAddAuthField"
|
||||||
|
@deleteRow="handleDeleteAuthField">
|
||||||
|
<el-table-column prop="label" label="名称" minWidth="100">
|
||||||
|
<template slot-scope="scope">
|
||||||
|
<el-input :readonly="disabled" size="mini" v-model="scope.row.label"
|
||||||
|
placeholder="请输入名称"></el-input>
|
||||||
|
</template>
|
||||||
|
</el-table-column>
|
||||||
|
<el-table-column prop="field" label="字段" minWidth="100">
|
||||||
|
<template slot-scope="scope">
|
||||||
|
<el-input :readonly="disabled" size="mini" v-model="scope.row.field"
|
||||||
|
placeholder="请输入字段"></el-input>
|
||||||
|
</template>
|
||||||
|
</el-table-column>
|
||||||
|
<el-table-column prop="required" label="必填" width="64">
|
||||||
|
<template slot-scope="scope">
|
||||||
|
<el-switch v-model="scope.row.required" :disabled="disabled">
|
||||||
|
</el-switch>
|
||||||
|
</template>
|
||||||
|
</el-table-column>
|
||||||
|
<el-table-column prop="isEdit" label="编辑" width="64">
|
||||||
|
<template slot-scope="scope">
|
||||||
|
<el-switch v-model="scope.row.isEdit" :disabled="disabled">
|
||||||
|
</el-switch>
|
||||||
|
</template>
|
||||||
|
</el-table-column>
|
||||||
|
<el-table-column prop="isLook" label="查看" width="64">
|
||||||
|
<template slot-scope="scope">
|
||||||
|
<el-switch v-model="scope.row.isLook" :disabled="disabled">
|
||||||
|
</el-switch>
|
||||||
|
</template>
|
||||||
|
</el-table-column>
|
||||||
|
</l-edit-table>
|
||||||
|
</template>
|
||||||
|
</div>
|
||||||
|
</el-collapse-item>
|
||||||
|
<el-collapse-item :title="$t('按钮设置')" name="5">
|
||||||
|
<l-edit-table addBtnText="添加按钮" :dataSource="node.btnlist" :isShowNum="false"
|
||||||
|
:hasDeleteBtn="hasBtnsDeleteBtn" :isAddBtn="!disabled" :isRemoveBtn="!disabled"
|
||||||
|
@addRow="handleAddBtns" @deleteRow="handleDeleteBtns">
|
||||||
|
<el-table-column prop="name" label="名称" minWidth="100">
|
||||||
|
<template slot-scope="scope">
|
||||||
|
<el-input :readonly="disabled" v-if="!scope.row.isSys" size="mini" v-model="scope.row.name"
|
||||||
|
placeholder="请输入名称"></el-input>
|
||||||
|
<span v-else>{{scope.row.name}}</span>
|
||||||
|
</template>
|
||||||
|
</el-table-column>
|
||||||
|
<el-table-column prop="code" label="编码" minWidth="100">
|
||||||
|
<template slot-scope="scope">
|
||||||
|
<el-input :readonly="disabled" v-if="!scope.row.isSys" size="mini" v-model="scope.row.code"
|
||||||
|
placeholder="请输入编码"></el-input>
|
||||||
|
<span v-else>{{scope.row.code}}</span>
|
||||||
|
</template>
|
||||||
|
</el-table-column>
|
||||||
|
<el-table-column align="center" prop="hidden" label="隐藏" width="64">
|
||||||
|
<template slot-scope="scope">
|
||||||
|
<el-switch v-model="scope.row.hidden" :disabled="disabled">
|
||||||
|
</el-switch>
|
||||||
|
</template>
|
||||||
|
</el-table-column>
|
||||||
|
<el-table-column align="center" prop="isSign" label="签章" width="64">
|
||||||
|
<template slot-scope="scope">
|
||||||
|
<el-switch v-model="scope.row.isSign" :disabled="disabled">
|
||||||
|
</el-switch>
|
||||||
|
</template>
|
||||||
|
</el-table-column>
|
||||||
|
<el-table-column align="center" prop="isNextAuditor" label="下一审核人" width="80">
|
||||||
|
<template slot-scope="scope">
|
||||||
|
<el-switch v-if="scope.row.code != 'disagree'" v-model="scope.row.isNextAuditor"
|
||||||
|
:disabled="disabled">
|
||||||
|
</el-switch>
|
||||||
|
</template>
|
||||||
|
</el-table-column>
|
||||||
|
</l-edit-table>
|
||||||
|
</el-collapse-item>
|
||||||
|
<el-collapse-item :title="$t('会签设置')" name="6">
|
||||||
|
<div style="padding:0 16px">
|
||||||
|
<el-form-item label="是否会签">
|
||||||
|
<el-switch v-model="node.isCountersign" :disabled="disabled">
|
||||||
|
</el-switch>
|
||||||
|
</el-form-item>
|
||||||
|
<template v-if="node.isCountersign">
|
||||||
|
<el-form-item label="审核方式">
|
||||||
|
<l-radio :disabled="disabled" v-model="node.countersignType"
|
||||||
|
:options="[{value:'1',label:'并行'},{value:'2',label:'串行'}]">
|
||||||
|
</l-radio>
|
||||||
|
</el-form-item>
|
||||||
|
<el-form-item v-if="node.countersignType == '1'" label="是否等待">
|
||||||
|
<!--并行才有这个设置-->
|
||||||
|
<el-switch v-model="node.isCountersignAll" :disabled="disabled">
|
||||||
|
</el-switch>
|
||||||
|
</el-form-item>
|
||||||
|
<el-form-item v-if="node.countersignType == '1'" label="通过百分比">
|
||||||
|
<el-input-number :disabled="disabled" :min="1" :max="100" v-model="node.countersignAllType">
|
||||||
|
</el-input-number>
|
||||||
|
</el-form-item>
|
||||||
|
|
||||||
|
<el-form-item label="再次审核">
|
||||||
|
<l-radio :disabled="disabled" v-model="node.countersignAgian"
|
||||||
|
:options="[{value:'1',label:'已同意不需要审核'},{value:'2',label:'已同意需要审核'}]">
|
||||||
|
</l-radio>
|
||||||
|
</el-form-item>
|
||||||
|
</template>
|
||||||
|
|
||||||
|
</div>
|
||||||
|
</el-collapse-item>
|
||||||
|
<el-collapse-item :title="$t('超时设置')" name="7">
|
||||||
|
<div style="padding:0 16px">
|
||||||
|
<el-form-item label="超时通知">
|
||||||
|
<el-switch :disabled="disabled" v-model="node.isOvertimeMessage">
|
||||||
|
</el-switch>
|
||||||
|
</el-form-item>
|
||||||
|
<template v-if="node.isOvertimeMessage">
|
||||||
|
|
||||||
|
<el-form-item label="第一次通知(时)">
|
||||||
|
<el-input-number :disabled="disabled" :min="1" v-model="node.overtimeMessageStart">
|
||||||
|
</el-input-number>
|
||||||
|
</el-form-item>
|
||||||
|
<el-form-item label="通知间隔(时)">
|
||||||
|
<el-input-number :disabled="disabled" :min="1" v-model="node.overtimeMessageInterval">
|
||||||
|
</el-input-number>
|
||||||
|
</el-form-item>
|
||||||
|
<el-form-item label="超时流转时间(时)">
|
||||||
|
<el-input-number :disabled="disabled" :min="1" v-model="node.overtimeGo">
|
||||||
|
</el-input-number>
|
||||||
|
</el-form-item>
|
||||||
|
<el-form-item label="超时通知策略">
|
||||||
|
<l-checkbox :disabled="disabled" v-model="node.overtimeMessageType"
|
||||||
|
:options="[{value:'1',label:'短信'},{value:'2',label:'邮箱'},{value:'3',label:'微信'},{value:'4',label:'站内消息'}]">
|
||||||
|
</l-checkbox>
|
||||||
|
</el-form-item>
|
||||||
|
</template>
|
||||||
|
|
||||||
|
</div>
|
||||||
|
</el-collapse-item>
|
||||||
|
</el-collapse>
|
||||||
|
|
||||||
|
|
||||||
|
<l-dialog :title="$t('添加岗位')" :visible.sync="selectPostVisible" :height="480" width="1024px"
|
||||||
|
@ok="handlePostSelectOk" @closed="handlePostSelectClosed">
|
||||||
|
<l-post-select-panel ref="postSelectPanel"></l-post-select-panel>
|
||||||
|
</l-dialog>
|
||||||
|
|
||||||
|
<l-dialog :title="$t('添加角色')" :visible.sync="selectRoleVisible" :height="480" width="800px"
|
||||||
|
@ok="handleRoleSelectOk" @closed="handleRoleSelectClosed">
|
||||||
|
<l-role-select-panel ref="roleSelectPanel"></l-role-select-panel>
|
||||||
|
</l-dialog>
|
||||||
|
|
||||||
|
|
||||||
|
<l-dialog :title="$t('添加用户')" :visible.sync="selectUserVisible" :height="480" width="1024px"
|
||||||
|
@ok="handleUserSelectOk" @closed="handleUserSelectClosed">
|
||||||
|
<l-user-select-panel ref="userSelectPanel"></l-user-select-panel>
|
||||||
|
</l-dialog>
|
||||||
|
|
||||||
|
<!--上下级选择-->
|
||||||
|
<l-dialog :title="$t('上下级选择')" :visible.sync="levelVisible" :height="200" width="500px" @ok="handleLevelOk"
|
||||||
|
@closed="handleLevelClosed">
|
||||||
|
<!-- <auditor-level-form ref="auditorLevelForm"></auditor-level-form> -->
|
||||||
|
</l-dialog>
|
||||||
|
|
||||||
|
<!--流程节点选择-->
|
||||||
|
<l-dialog :title="$t('流程节点选择')" :visible.sync="nodeAuditorVisible" :height="200" width="500px"
|
||||||
|
@ok="handleNodeAuditorOk" @closed="handleNodeAuditorClosed" @opened="handleNodeAuditorOpened">
|
||||||
|
<!-- <node-auditor-form ref="nodeAuditorForm"></node-auditor-form> -->
|
||||||
|
</l-dialog>
|
||||||
|
|
||||||
|
<!--流程节点选择-->
|
||||||
|
<l-dialog :title="$t('数据表字段选择')" :visible.sync="auditorSqlVisible" width="500px" :height="300"
|
||||||
|
@ok="handleAuditorSqlOk" @closed="handleAuditorSqlClosed">
|
||||||
|
<!-- <auditor-sql-form ref="auditorSqlForm"></auditor-sql-form> -->
|
||||||
|
</l-dialog>
|
||||||
|
|
||||||
|
</el-form>
|
||||||
|
</template>
|
||||||
|
|
||||||
|
<script>
|
||||||
|
|
||||||
|
// const apiForm = window.$api.custmerForm.scheme
|
||||||
|
|
||||||
|
// import auditorLevelForm from './auditorLevel.vue'
|
||||||
|
// import nodeAuditorForm from './auditorNode.vue'
|
||||||
|
// import auditorSqlForm from './auditorSql.vue'
|
||||||
|
|
||||||
|
export default {
|
||||||
|
name: 'user-task-option',
|
||||||
|
props: {
|
||||||
|
disabled: {
|
||||||
|
type: Boolean,
|
||||||
|
default: false
|
||||||
|
}
|
||||||
|
},
|
||||||
|
components: {
|
||||||
|
// auditorLevelForm,
|
||||||
|
// nodeAuditorForm,
|
||||||
|
// auditorSqlForm
|
||||||
|
},
|
||||||
|
data() {
|
||||||
|
return {
|
||||||
|
activeNames: ['1'],
|
||||||
|
columns: [
|
||||||
|
{ label: '名称', prop: 'label', minWidth: '100' },
|
||||||
|
{ label: '字段', prop: 'field', minWidth: '100' },
|
||||||
|
{ label: '必填', prop: 'required', width: '64', align: 'center' },
|
||||||
|
{ label: '编辑', prop: 'isEdit', width: '64', align: 'center' },
|
||||||
|
{ label: '查看', prop: 'isLook', width: '64', align: 'center' },
|
||||||
|
],
|
||||||
|
tableBtns: [
|
||||||
|
{ prop: 'Delete', label: '删除' }
|
||||||
|
],
|
||||||
|
atuoAgreeOptions: [{ value: '1', label: '处理人就是提交人' }, { value: '2', label: '处理人和上一步的处理人相同' }, { value: '3', label: '处理人审批过' }],
|
||||||
|
noAuditorOptions: [{ value: '1', label: '超级管理员处理' }, { value: '2', label: '跳过此步骤' }, { value: '3', label: '不能提交' }],
|
||||||
|
userColumns: [
|
||||||
|
{ label: '类型', prop: 'type', width: '64' },
|
||||||
|
{ label: '名称', prop: 'name', minWidth: '100' },
|
||||||
|
{ label: '附加条件', prop: 'condition', minWidth: '100' }
|
||||||
|
],
|
||||||
|
|
||||||
|
conditionOptions: [{ value: '1', label: '同一个部门' }, { value: '2', label: '同一个公司' }, { value: '3', label: '发起人上级' }, { value: '4', label: '发起人下级' }],
|
||||||
|
|
||||||
|
selectPostVisible: false,
|
||||||
|
selectRoleVisible: false,
|
||||||
|
selectUserVisible: false,
|
||||||
|
levelVisible: false,
|
||||||
|
nodeAuditorVisible: false,
|
||||||
|
auditorSqlVisible: false,
|
||||||
|
|
||||||
|
isLooker: false,
|
||||||
|
|
||||||
|
}
|
||||||
|
},
|
||||||
|
asyncComputed: {
|
||||||
|
formVerisons: {
|
||||||
|
async get() {
|
||||||
|
let res = []
|
||||||
|
if (!this.$validatenull(this.node.formCode) && this.node.formType == '1') {
|
||||||
|
// res = await this.$awaitWraper(apiForm.getHistoryList(this.node.formCode))
|
||||||
|
}
|
||||||
|
return (res || []).map(t => { return { label: this.lr_dateFormat(t.f_CreateDate), value: t.f_Id } })
|
||||||
|
}
|
||||||
|
}
|
||||||
|
},
|
||||||
|
computed: {
|
||||||
|
node() {
|
||||||
|
return this.wfdesign.currentWfNode;
|
||||||
|
}
|
||||||
|
},
|
||||||
|
inject: ["wfdesign"],
|
||||||
|
methods: {
|
||||||
|
async custmerformChange(val) {
|
||||||
|
this.$set(this.node, 'formRelationId', '')
|
||||||
|
if (val == null) {
|
||||||
|
this.node.authFields = [];
|
||||||
|
this.node.formVerison = ''
|
||||||
|
return;
|
||||||
|
}
|
||||||
|
if (this.$validatenull(this.wfdesign.custmerformSchemes[val.f_SchemeId])) {
|
||||||
|
// const {f_SchemeInfoId,f_Scheme,f_Id} = (await this.$awaitWraper(apiForm.getHistory(val.f_SchemeId))) || {}
|
||||||
|
const { f_SchemeInfoId, f_Scheme, f_Id } = {}
|
||||||
|
this.wfdesign.custmerformSchemes[f_Id] = { f_Scheme }
|
||||||
|
if (this.node.formCode == f_SchemeInfoId) {
|
||||||
|
this.loadFormScheme(f_Scheme)
|
||||||
|
}
|
||||||
|
}
|
||||||
|
else {
|
||||||
|
this.loadFormScheme(this.wfdesign.custmerformSchemes[val.f_SchemeId].f_Scheme);
|
||||||
|
}
|
||||||
|
this.node.formVerison = val.f_SchemeId
|
||||||
|
},
|
||||||
|
async custmerformVerisonChange(val) {
|
||||||
|
this.$set(this.node, 'formRelationId', '')
|
||||||
|
if (this.$validatenull(val)) {
|
||||||
|
this.node.authFields = []
|
||||||
|
return
|
||||||
|
}
|
||||||
|
if (this.$validatenull(this.wfdesign.custmerformSchemes[val.value])) {
|
||||||
|
// const {f_Scheme,f_Id} = (await this.$awaitWraper(apiForm.getHistory(val.value))) || {}
|
||||||
|
const { f_Scheme, f_Id } = {}
|
||||||
|
this.wfdesign.custmerformSchemes[f_Id] = { f_Scheme }
|
||||||
|
if (this.node.formVerison == f_Id) {
|
||||||
|
this.loadFormScheme(f_Scheme)
|
||||||
|
}
|
||||||
|
}
|
||||||
|
else {
|
||||||
|
this.loadFormScheme(this.wfdesign.custmerformSchemes[val.value].f_Scheme);
|
||||||
|
}
|
||||||
|
},
|
||||||
|
loadFormScheme(strScheme) {
|
||||||
|
const scheme = JSON.parse(strScheme)
|
||||||
|
const fields = []
|
||||||
|
const rfields = []
|
||||||
|
scheme.formInfo.tabList.forEach(tab => {
|
||||||
|
tab.components.forEach(component => {
|
||||||
|
if (['guid'].includes(component.type)) {
|
||||||
|
rfields.push({ label: component.label, value: component.prop })
|
||||||
|
}
|
||||||
|
|
||||||
|
if (!['gridtable', 'divider'].includes(component.type) && component.display) {
|
||||||
|
fields.push({
|
||||||
|
prop: component.prop,
|
||||||
|
field: component.field,
|
||||||
|
label: component.label,
|
||||||
|
table: component.table,
|
||||||
|
required: component.required,
|
||||||
|
isEdit: true,
|
||||||
|
isLook: true
|
||||||
|
})
|
||||||
|
}
|
||||||
|
else if (['gridtable'].includes(component.type)) {
|
||||||
|
fields.push({
|
||||||
|
prop: `${component.prop}_add`,
|
||||||
|
label: `${component.label || '表格'}-添加按钮`,
|
||||||
|
required: false,
|
||||||
|
isEdit: true,
|
||||||
|
isLook: false,
|
||||||
|
type: 'grid'
|
||||||
|
})
|
||||||
|
fields.push({
|
||||||
|
prop: `${component.prop}_remove`,
|
||||||
|
label: `${component.label || '表格'}-删除按钮`,
|
||||||
|
required: false,
|
||||||
|
isEdit: true,
|
||||||
|
isLook: false,
|
||||||
|
type: 'grid'
|
||||||
|
})
|
||||||
|
|
||||||
|
fields.push({
|
||||||
|
prop: `${component.prop}_required`,
|
||||||
|
label: `${component.label || '表格'}-数据`,
|
||||||
|
required: component.required,
|
||||||
|
isEdit: false,
|
||||||
|
isLook: false,
|
||||||
|
type: 'gridrequired'
|
||||||
|
})
|
||||||
|
fields.push(...component.children.filter(t => t.display).map(t => {
|
||||||
|
return {
|
||||||
|
gridprop: component.prop,
|
||||||
|
prop: t.prop,
|
||||||
|
field: t.field,
|
||||||
|
label: `${component.label || '表格'}-${t.label}`,
|
||||||
|
table: component.table,
|
||||||
|
required: t.required,
|
||||||
|
isEdit: true,
|
||||||
|
isLook: true
|
||||||
|
}
|
||||||
|
}))
|
||||||
|
}
|
||||||
|
})
|
||||||
|
})
|
||||||
|
this.node.formRelations = rfields
|
||||||
|
this.node.authFields = fields
|
||||||
|
|
||||||
|
},
|
||||||
|
handleFormTypeChange() {
|
||||||
|
this.node.formCode = ''
|
||||||
|
this.node.formUrl = ''
|
||||||
|
this.node.formAppUrl = ''
|
||||||
|
this.node.authFields = []
|
||||||
|
this.node.formRelations = []
|
||||||
|
|
||||||
|
this.$set(this.node, 'formRelationId', '')
|
||||||
|
|
||||||
|
},
|
||||||
|
handleAddAuthField() {
|
||||||
|
this.node.authFields.push({
|
||||||
|
field: '',
|
||||||
|
label: '',
|
||||||
|
required: true,
|
||||||
|
isEdit: true,
|
||||||
|
isLook: true
|
||||||
|
})
|
||||||
|
},
|
||||||
|
handleDeleteAuthField(row) {
|
||||||
|
this.node.authFields.splice(row.index, 1);
|
||||||
|
},
|
||||||
|
|
||||||
|
handleTableBtnClick(btn) {
|
||||||
|
this.node.auditUsers.splice(btn.rowIndex, 1);
|
||||||
|
},
|
||||||
|
handleTableBtnClick2(btn) {
|
||||||
|
this.node.lookUsers.splice(btn.rowIndex, 1);
|
||||||
|
},
|
||||||
|
|
||||||
|
typeFormat(type) {
|
||||||
|
switch (type) {
|
||||||
|
case '1':
|
||||||
|
return '岗位'
|
||||||
|
case '2':
|
||||||
|
return '角色'
|
||||||
|
case '3':
|
||||||
|
return '用户'
|
||||||
|
case '4':
|
||||||
|
return '上下级'
|
||||||
|
case '5':
|
||||||
|
return '节点'
|
||||||
|
case '6':
|
||||||
|
return '表字段'
|
||||||
|
}
|
||||||
|
},
|
||||||
|
addTableData(selectData) {
|
||||||
|
if (this.isLooker) {
|
||||||
|
let addData2 = selectData.filter(t => this.node.lookUsers.findIndex(t2 => t2.id == t.id && t2.type == t.type) == -1);
|
||||||
|
this.node.lookUsers = this.node.lookUsers.concat(addData2);
|
||||||
|
}
|
||||||
|
else {
|
||||||
|
let addData = selectData.filter(t => this.node.auditUsers.findIndex(t2 => t2.id == t.id && t2.type == t.type) == -1);
|
||||||
|
this.node.auditUsers = this.node.auditUsers.concat(addData);
|
||||||
|
}
|
||||||
|
|
||||||
|
},
|
||||||
|
|
||||||
|
handlePostClick(isLooker) {
|
||||||
|
this.selectPostVisible = true;
|
||||||
|
this.isLooker = isLooker;
|
||||||
|
},
|
||||||
|
handlePostSelectClosed() {
|
||||||
|
this.$refs.postSelectPanel.resetForm();
|
||||||
|
},
|
||||||
|
handlePostSelectOk() {
|
||||||
|
let selectData = this.$refs.postSelectPanel.getForm().map(t => { return { type: '1', id: t.f_PostId, name: t.name } });
|
||||||
|
this.addTableData(selectData);
|
||||||
|
this.selectPostVisible = false;
|
||||||
|
},
|
||||||
|
|
||||||
|
handleRoleClick(isLooker) {
|
||||||
|
this.selectRoleVisible = true;
|
||||||
|
this.isLooker = isLooker;
|
||||||
|
},
|
||||||
|
handleRoleSelectClosed() {
|
||||||
|
this.$refs.roleSelectPanel.resetForm();
|
||||||
|
},
|
||||||
|
handleRoleSelectOk() {
|
||||||
|
let selectData = this.$refs.roleSelectPanel.getForm().map(t => { return { type: '2', id: t.f_RoleId, name: t.f_FullName, condition: '' } });
|
||||||
|
this.addTableData(selectData);
|
||||||
|
this.selectRoleVisible = false;
|
||||||
|
},
|
||||||
|
|
||||||
|
handleUserClick(isLooker) {
|
||||||
|
this.selectUserVisible = true;
|
||||||
|
this.isLooker = isLooker;
|
||||||
|
},
|
||||||
|
handleUserSelectClosed() {
|
||||||
|
this.$refs.userSelectPanel.resetForm();
|
||||||
|
},
|
||||||
|
handleUserSelectOk() {
|
||||||
|
let selectData = this.$refs.userSelectPanel.getForm().map(t => { return { type: '3', id: t.f_UserId, name: t.name } });
|
||||||
|
this.addTableData(selectData);
|
||||||
|
this.selectUserVisible = false;
|
||||||
|
},
|
||||||
|
|
||||||
|
|
||||||
|
handleLevelClick(isLooker) {
|
||||||
|
this.levelVisible = true;
|
||||||
|
this.isLooker = isLooker;
|
||||||
|
},
|
||||||
|
handleLevelClosed() {
|
||||||
|
this.$refs.auditorLevelForm.resetForm();
|
||||||
|
},
|
||||||
|
handleLevelOk() {
|
||||||
|
this.$refs.auditorLevelForm.validateForm(() => {
|
||||||
|
let data = this.$refs.auditorLevelForm.getForm();
|
||||||
|
this.addTableData([data]);
|
||||||
|
this.levelVisible = false;
|
||||||
|
});
|
||||||
|
},
|
||||||
|
|
||||||
|
|
||||||
|
handleNodeAuditorClick(isLooker) {
|
||||||
|
this.nodeAuditorVisible = true;
|
||||||
|
this.isLooker = isLooker;
|
||||||
|
},
|
||||||
|
handleNodeAuditorOk() {
|
||||||
|
this.$refs.nodeAuditorForm.validateForm(() => {
|
||||||
|
let data = this.$refs.nodeAuditorForm.getForm();
|
||||||
|
this.addTableData([data]);
|
||||||
|
this.nodeAuditorVisible = false;
|
||||||
|
});
|
||||||
|
},
|
||||||
|
handleNodeAuditorClosed() {
|
||||||
|
this.$refs.nodeAuditorForm.resetForm();
|
||||||
|
},
|
||||||
|
handleNodeAuditorOpened() {
|
||||||
|
let wfdata = this.wfdesign.handleGetWFData();
|
||||||
|
this.$refs.nodeAuditorForm.setForm(wfdata.filter(t => t.type = 'userTask' && t.id != this.node.id));
|
||||||
|
},
|
||||||
|
|
||||||
|
|
||||||
|
handleAuditorSqlClick(isLooker) {
|
||||||
|
this.auditorSqlVisible = true;
|
||||||
|
this.isLooker = isLooker;
|
||||||
|
},
|
||||||
|
handleAuditorSqlOk() {
|
||||||
|
this.$refs.auditorSqlForm.validateForm(() => {
|
||||||
|
let data = this.$refs.auditorSqlForm.getForm();
|
||||||
|
data.name = `${data.table}【${data.auditorField}】`
|
||||||
|
this.addTableData([data]);
|
||||||
|
this.auditorSqlVisible = false;
|
||||||
|
});
|
||||||
|
},
|
||||||
|
handleAuditorSqlClosed() {
|
||||||
|
this.$refs.auditorSqlForm.resetForm();
|
||||||
|
},
|
||||||
|
|
||||||
|
hasBtnsDeleteBtn(row) {
|
||||||
|
if (row.isSys) {
|
||||||
|
return false;
|
||||||
|
}
|
||||||
|
else {
|
||||||
|
return true;
|
||||||
|
}
|
||||||
|
},
|
||||||
|
handleAddBtns() {
|
||||||
|
this.node.btnlist.push({ code: '', name: '', hidden: false, isNextAuditor: false, isSign: false })
|
||||||
|
},
|
||||||
|
handleDeleteBtns(row) {
|
||||||
|
this.node.btnlist.splice(row.index, 1);
|
||||||
|
}
|
||||||
|
|
||||||
|
}
|
||||||
|
|
||||||
|
}
|
||||||
|
</script>
|
||||||
|
|
||||||
|
<style>
|
||||||
|
</style>
|
||||||
|
|
@ -9,7 +9,7 @@
|
||||||
padding: 5px 0 10px 10px;
|
padding: 5px 0 10px 10px;
|
||||||
display: flex;
|
display: flex;
|
||||||
flex-direction: column;
|
flex-direction: column;
|
||||||
width: 100%;
|
width: 70%;
|
||||||
height: 100%;
|
height: 100%;
|
||||||
box-sizing: border-box;
|
box-sizing: border-box;
|
||||||
.my-process-designer__header {
|
.my-process-designer__header {
|
||||||
|
|
|
||||||
|
|
@ -0,0 +1,38 @@
|
||||||
|
<!--
|
||||||
|
* @Author: 刘妍
|
||||||
|
* @Date: 2024-03-07 10:43:34
|
||||||
|
* @LastEditors: Do not edit
|
||||||
|
* @LastEditTime: 2024-03-07 10:49:15
|
||||||
|
* @Description:
|
||||||
|
-->
|
||||||
|
<template>
|
||||||
|
<div class="m-4 mr-0 overflow-hidden bg-white">
|
||||||
|
<BasicTree title="部门列表" toolbar treeWrapperClassName="h-[calc(100%-35px)] overflow-auto" loadData
|
||||||
|
:clickRowToExpand="false" :treeData="treeData" :fieldNames="{ key: 'id', title: 'name' }"
|
||||||
|
@select="handleSelect" />
|
||||||
|
</div>
|
||||||
|
</template>
|
||||||
|
<script lang="ts" setup>
|
||||||
|
import { onMounted, ref } from 'vue';
|
||||||
|
|
||||||
|
import { BasicTree, TreeItem } from '@/components/Tree';
|
||||||
|
import { getDeptList } from '@/api/demo/system';
|
||||||
|
|
||||||
|
defineOptions({ name: 'DeptTree' });
|
||||||
|
|
||||||
|
const emit = defineEmits(['select']);
|
||||||
|
|
||||||
|
const treeData = ref < TreeItem[] > ([]);
|
||||||
|
|
||||||
|
async function fetch() {
|
||||||
|
treeData.value = (await getDeptList()) as unknown as TreeItem[];
|
||||||
|
}
|
||||||
|
|
||||||
|
function handleSelect(keys) {
|
||||||
|
emit('select', keys[0]);
|
||||||
|
}
|
||||||
|
|
||||||
|
onMounted(() => {
|
||||||
|
fetch();
|
||||||
|
});
|
||||||
|
</script>
|
||||||
|
|
@ -0,0 +1,55 @@
|
||||||
|
/*
|
||||||
|
* @Author: 刘妍
|
||||||
|
* @Date: 2024-03-07 10:43:34
|
||||||
|
* @LastEditors: Do not edit
|
||||||
|
* @LastEditTime: 2024-03-07 10:48:39
|
||||||
|
* @Description:
|
||||||
|
*/
|
||||||
|
import { getAllRoleList, isAccountExist } from '@/api/demo/system';
|
||||||
|
import { BasicColumn, FormSchema } from '@/components/Table';
|
||||||
|
|
||||||
|
/**
|
||||||
|
* transform mock data
|
||||||
|
* {
|
||||||
|
* 0: '华东分部',
|
||||||
|
* '0-0': '华东分部-研发部'
|
||||||
|
* '0-1': '华东分部-市场部',
|
||||||
|
* ...
|
||||||
|
* }
|
||||||
|
*/
|
||||||
|
export const columns: BasicColumn[] = [
|
||||||
|
{
|
||||||
|
title: '用户名',
|
||||||
|
dataIndex: 'account',
|
||||||
|
width: 120,
|
||||||
|
},
|
||||||
|
{
|
||||||
|
title: '昵称',
|
||||||
|
dataIndex: 'name',
|
||||||
|
width: 120,
|
||||||
|
},
|
||||||
|
{
|
||||||
|
title: '所属部门',
|
||||||
|
dataIndex: 'organizations',
|
||||||
|
// customRender: ({ value }) => {
|
||||||
|
// return deptMap[value];
|
||||||
|
// },
|
||||||
|
},
|
||||||
|
];
|
||||||
|
|
||||||
|
export const searchFormSchema: FormSchema[] = [
|
||||||
|
{
|
||||||
|
field: 'account',
|
||||||
|
label: '用户名',
|
||||||
|
component: 'Input',
|
||||||
|
colProps: { span: 8 },
|
||||||
|
},
|
||||||
|
{
|
||||||
|
field: 'nickname',
|
||||||
|
label: '昵称',
|
||||||
|
component: 'Input',
|
||||||
|
colProps: { span: 8 },
|
||||||
|
},
|
||||||
|
];
|
||||||
|
|
||||||
|
|
||||||
|
|
@ -0,0 +1,66 @@
|
||||||
|
<!--
|
||||||
|
* @Author: 刘妍
|
||||||
|
* @Date: 2024-03-07 10:43:34
|
||||||
|
* @LastEditors: Do not edit
|
||||||
|
* @LastEditTime: 2024-03-07 10:56:46
|
||||||
|
* @Description:
|
||||||
|
-->
|
||||||
|
<template>
|
||||||
|
<!-- <PageWrapper dense contentFullHeight fixedHeight contentClass="flex"> -->
|
||||||
|
<div class="select-account">
|
||||||
|
<DeptTree class="w-1/4 xl:w-1/5" @select="handleSelect" />
|
||||||
|
<BasicTable @register="registerTable" class="w-3/4 xl:w-4/5" :searchInfo="searchInfo"> </BasicTable>
|
||||||
|
</div>
|
||||||
|
<!-- </PageWrapper> -->
|
||||||
|
</template>
|
||||||
|
<script lang="ts" setup>
|
||||||
|
import { reactive } from 'vue';
|
||||||
|
|
||||||
|
import { BasicTable, useTable, TableAction } from '@/components/Table';
|
||||||
|
import { getAccountList, deleteAccount } from '@/api/demo/system';
|
||||||
|
import { PageWrapper } from '@/components/Page';
|
||||||
|
import DeptTree from './DeptTree.vue';
|
||||||
|
import { useMessage } from '/@/hooks/web/useMessage';
|
||||||
|
|
||||||
|
|
||||||
|
import { columns, searchFormSchema } from './account.data';
|
||||||
|
|
||||||
|
defineOptions({ name: 'AccountManagement' });
|
||||||
|
|
||||||
|
const searchInfo = reactive < Recordable > ({});
|
||||||
|
const [registerTable, { reload, updateTableDataRecord, getSelectRows, clearSelectedRowKeys }] = useTable({
|
||||||
|
title: '账号列表',
|
||||||
|
api: getAccountList,
|
||||||
|
rowKey: 'id',
|
||||||
|
columns,
|
||||||
|
formConfig: {
|
||||||
|
labelWidth: 120,
|
||||||
|
schemas: searchFormSchema,
|
||||||
|
autoSubmitOnEnter: true,
|
||||||
|
},
|
||||||
|
rowSelection: {//多选框
|
||||||
|
type: 'checkbox',
|
||||||
|
},
|
||||||
|
useSearchForm: true,
|
||||||
|
showTableSetting: false,
|
||||||
|
bordered: true,
|
||||||
|
tableSetting: { fullScreen: true },
|
||||||
|
isCanResizeParent: true,
|
||||||
|
handleSearchInfoFn(info) {
|
||||||
|
console.log('handleSearchInfoFn', info);
|
||||||
|
return info;
|
||||||
|
},
|
||||||
|
});
|
||||||
|
function getRow() {
|
||||||
|
let rows = getSelectRows();
|
||||||
|
return rows
|
||||||
|
}
|
||||||
|
defineExpose({
|
||||||
|
getRow
|
||||||
|
})
|
||||||
|
</script>
|
||||||
|
<style scoped>
|
||||||
|
.select-account{
|
||||||
|
display: flex;
|
||||||
|
}
|
||||||
|
</style>
|
||||||
|
|
@ -0,0 +1,79 @@
|
||||||
|
<!--
|
||||||
|
* @Author: 刘妍
|
||||||
|
* @Date: 2024-03-07 10:00:26
|
||||||
|
* @LastEditors: Do not edit
|
||||||
|
* @LastEditTime: 2024-03-07 10:50:39
|
||||||
|
* @Description:
|
||||||
|
-->
|
||||||
|
<template>
|
||||||
|
<div>
|
||||||
|
<BasicTable @register="registerTable" :searchInfo="searchInfo"> </BasicTable>
|
||||||
|
</div>
|
||||||
|
</template>
|
||||||
|
<script lang="ts" setup>
|
||||||
|
import { reactive, } from 'vue';
|
||||||
|
|
||||||
|
import { BasicTable, useTable, TableAction } from '@/components/Table';
|
||||||
|
import { getRoleListByPage, deleteRole } from '@/api/demo/system';
|
||||||
|
|
||||||
|
defineOptions({ name: 'RoleManagement' });
|
||||||
|
|
||||||
|
const searchInfo = reactive < Recordable > ({});
|
||||||
|
|
||||||
|
const [registerTable, { reload, getSelectRows, clearSelectedRowKeys }] = useTable({
|
||||||
|
// 表格名称
|
||||||
|
title: '角色列表',
|
||||||
|
// 获取数据的接口
|
||||||
|
api: getRoleListByPage,
|
||||||
|
// 表单列信息 BasicColumn[]
|
||||||
|
columns: [
|
||||||
|
{
|
||||||
|
title: '角色名称',
|
||||||
|
dataIndex: 'name',
|
||||||
|
width: 200,
|
||||||
|
},
|
||||||
|
{
|
||||||
|
title: '创建时间',
|
||||||
|
dataIndex: 'createTime',
|
||||||
|
width: 180,
|
||||||
|
},
|
||||||
|
],
|
||||||
|
rowKey: 'id',
|
||||||
|
formConfig: {
|
||||||
|
labelWidth: 120,
|
||||||
|
schemas: [{
|
||||||
|
field: 'key',
|
||||||
|
label: '关键字',
|
||||||
|
component: 'Input',
|
||||||
|
colProps: { span: 8 },
|
||||||
|
}],
|
||||||
|
},
|
||||||
|
// 使用搜索表单
|
||||||
|
useSearchForm: true,
|
||||||
|
// 显示表格设置工具
|
||||||
|
showTableSetting: false,
|
||||||
|
// 是否显示表格边框
|
||||||
|
bordered: true,
|
||||||
|
// 序号列
|
||||||
|
showIndexColumn: false,
|
||||||
|
// 勾选列
|
||||||
|
rowSelection: {//多选框
|
||||||
|
type: 'checkbox',
|
||||||
|
},
|
||||||
|
tableSetting: { fullScreen: true },
|
||||||
|
isCanResizeParent: true,
|
||||||
|
// 搜索
|
||||||
|
handleSearchInfoFn(info) {
|
||||||
|
return info;
|
||||||
|
},
|
||||||
|
});
|
||||||
|
|
||||||
|
function getRow() {
|
||||||
|
let rows = getSelectRows();
|
||||||
|
return rows
|
||||||
|
}
|
||||||
|
defineExpose({
|
||||||
|
getRow
|
||||||
|
})
|
||||||
|
|
||||||
|
</script>
|
||||||
|
|
@ -2,7 +2,7 @@
|
||||||
* @Author: 刘妍
|
* @Author: 刘妍
|
||||||
* @Date: 2024-01-13 13:04:15
|
* @Date: 2024-01-13 13:04:15
|
||||||
* @LastEditors: Do not edit
|
* @LastEditors: Do not edit
|
||||||
* @LastEditTime: 2024-03-02 16:11:00
|
* @LastEditTime: 2024-03-06 10:56:44
|
||||||
* @Description:
|
* @Description:
|
||||||
*/
|
*/
|
||||||
import 'uno.css';
|
import 'uno.css';
|
||||||
|
|
@ -32,9 +32,10 @@ import "mars3d/dist/mars3d.css"
|
||||||
import 'bpmn-js/dist/assets/diagram-js.css';
|
import 'bpmn-js/dist/assets/diagram-js.css';
|
||||||
import 'bpmn-js/dist/assets/bpmn-font/css/bpmn-embedded.css';
|
import 'bpmn-js/dist/assets/bpmn-font/css/bpmn-embedded.css';
|
||||||
|
|
||||||
|
import Antd from "ant-design-vue"
|
||||||
async function bootstrap() {
|
async function bootstrap() {
|
||||||
const app = createApp(App);
|
const app = createApp(App);
|
||||||
|
app.use(Antd)
|
||||||
|
|
||||||
// Configure store
|
// Configure store
|
||||||
// 配置 store
|
// 配置 store
|
||||||
|
|
|
||||||
Loading…
Reference in New Issue