1060 lines
33 KiB
Vue
1060 lines
33 KiB
Vue
<!-- 开始节点配置 -->
|
|
<template>
|
|
<div class="user-task">
|
|
<a-form
|
|
ref="formRef"
|
|
:model="node"
|
|
labelAlign="left"
|
|
:label-col="labelCol"
|
|
:wrapper-col="wrapperCol"
|
|
:disabled="data.componentDisabled"
|
|
>
|
|
<a-collapse v-model:activeKey="activeKey" accordion ghost>
|
|
<a-collapse-panel key="1" header="基础配置">
|
|
<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.isInherit" @change="updateWfData('isInherit')" />
|
|
</a-form-item>
|
|
<a-form-item label="允许加签">
|
|
<a-switch v-model:checked="node.isAddSign" @change="updateWfData('isAddSign')" />
|
|
</a-form-item>
|
|
<a-form-item label="允许转移">
|
|
<a-switch v-model:checked="node.isTransfer" @change="updateWfData('isTransfer')" />
|
|
</a-form-item>
|
|
<a-form-item label="允许批量审核">
|
|
<a-switch v-model:checked="node.isBatchAudit" @change="updateWfData('isBatchAudit')" />
|
|
</a-form-item>
|
|
<a-form-item label="自动同意规则">
|
|
<a-select
|
|
v-model:value="node.autoAgree"
|
|
:options="data.atuoAgreeOptions"
|
|
@change="updateWfData('autoAgree')"
|
|
/>
|
|
</a-form-item>
|
|
<a-form-item label="无对应处理人">
|
|
<a-select
|
|
v-model:value="node.noAuditor"
|
|
@change="updateWfData('noAuditor')"
|
|
:options="data.noAuditorOptions"
|
|
/>
|
|
</a-form-item>
|
|
<a-form-item label="驳回策略">
|
|
<a-radio-group
|
|
v-model:value="node.rejectType"
|
|
name="checkboxgroup"
|
|
@change="updateWfData('rejectType')"
|
|
:options="[
|
|
{ value: '1', label: '驳回节点固定' },
|
|
{ value: '2', label: '能驳回到任何执行过节点' },
|
|
]"
|
|
/>
|
|
</a-form-item>
|
|
<a-form-item label="通知策略">
|
|
<a-checkbox-group
|
|
v-model:value="node.messageType"
|
|
name="checkboxgroup"
|
|
@change="updateWfData('messageType')"
|
|
:options="[
|
|
{ value: '1', label: '短信' },
|
|
{ value: '2', label: '邮箱' },
|
|
{ value: '3', label: '微信' },
|
|
{ value: '4', label: '站内消息' },
|
|
]"
|
|
/>
|
|
</a-form-item>
|
|
</a-collapse-panel>
|
|
<a-collapse-panel key="2" header="审核人员设置">
|
|
<a-space>
|
|
<a-radio-group size="small">
|
|
<a-radio-button value="1" @click="handlePostClick(false)">岗位</a-radio-button>
|
|
<a-radio-button value="2" @click="handleRoleClick(false)">角色</a-radio-button>
|
|
<a-radio-button value="3" @click="handleAccountClick(false)">用户</a-radio-button>
|
|
<a-radio-button value="3" @click="handleLevelClick(false)">上下级</a-radio-button>
|
|
<a-radio-button value="3" @click="handleNodeAuditorClick(false)"
|
|
>节点执行人</a-radio-button
|
|
>
|
|
<a-radio-button value="3" @click="handleAuditorSqlClick(false)"
|
|
>表字段</a-radio-button
|
|
>
|
|
</a-radio-group>
|
|
</a-space>
|
|
<a-table
|
|
size="small"
|
|
:columns="data.userColumns"
|
|
:data-source="node.auditUsers"
|
|
bordered
|
|
@change="updateWfData('auditUsers')"
|
|
:pagination="false"
|
|
>
|
|
<template #bodyCell="{ column, text, record }">
|
|
<template v-if="['name'].includes(column.dataIndex)">
|
|
<div>
|
|
{{ text }}
|
|
</div>
|
|
</template>
|
|
<template v-else-if="['type'].includes(column.dataIndex)">
|
|
<div>
|
|
{{ typeFormat(text) }}
|
|
</div>
|
|
</template>
|
|
<template v-else-if="['condition'].includes(column.dataIndex)">
|
|
<div>
|
|
<a-select
|
|
v-model:value="record[column.dataIndex]"
|
|
:options="data.conditionOptions"
|
|
v-if="record.type == '2'"
|
|
/>
|
|
</div>
|
|
</template>
|
|
<template v-else-if="column.dataIndex === 'operation'">
|
|
<a-popconfirm title="确定要删除吗？" @confirm="onDelete(record.name, false)">
|
|
<delete-outlined two-tone-color="#eb2f96" />
|
|
</a-popconfirm>
|
|
</template>
|
|
</template>
|
|
</a-table>
|
|
</a-collapse-panel>
|
|
<a-collapse-panel key="3" header="传阅人员设置">
|
|
<a-space>
|
|
<a-radio-group size="small">
|
|
<a-radio-button value="1" @click="handlePostClick(true)">岗位</a-radio-button>
|
|
<a-radio-button value="2" @click="handleRoleClick(true)">角色</a-radio-button>
|
|
<a-radio-button value="3" @click="handleAccountClick(true)">用户</a-radio-button>
|
|
<a-radio-button value="3" @click="handleLevelClick(true)">上下级</a-radio-button>
|
|
<a-radio-button value="3" @click="handleNodeAuditorClick(true)"
|
|
>节点执行人</a-radio-button
|
|
>
|
|
<a-radio-button value="3" @click="handleAuditorSqlClick(true)">表字段</a-radio-button>
|
|
</a-radio-group>
|
|
</a-space>
|
|
<a-table
|
|
size="small"
|
|
:columns="data.userColumns"
|
|
:data-source="node.lookUsers"
|
|
bordered
|
|
:pagination="false"
|
|
>
|
|
<template #bodyCell="{ column, text, record }">
|
|
<template v-if="['name'].includes(column.dataIndex)">
|
|
<div>
|
|
{{ text }}
|
|
</div>
|
|
</template>
|
|
<template v-else-if="['type'].includes(column.dataIndex)">
|
|
<div>
|
|
{{ typeFormat(text) }}
|
|
</div>
|
|
</template>
|
|
<template v-else-if="['condition'].includes(column.dataIndex)">
|
|
<div>
|
|
<a-select
|
|
v-model:value="record[column.dataIndex]"
|
|
:options="data.conditionOptions"
|
|
v-if="record.type == '2'"
|
|
@change="updateWfData('lookUsers')"
|
|
/>
|
|
</div>
|
|
</template>
|
|
<template v-else-if="column.dataIndex === 'operation'">
|
|
<a-popconfirm title="确定要删除吗？" @confirm="onDelete(record.name, true)">
|
|
<delete-outlined two-tone-color="#eb2f96" />
|
|
</a-popconfirm>
|
|
</template>
|
|
</template>
|
|
</a-table>
|
|
</a-collapse-panel>
|
|
<a-collapse-panel key="4" header="表单设置" v-if="!node.isInherit">
|
|
<a-tabs
|
|
v-model:activeKey="node.formType"
|
|
type="card"
|
|
size="small"
|
|
centered="true"
|
|
@change="tabsChange"
|
|
>
|
|
<a-tab-pane key="1" tab="自定义表单">
|
|
<a-space direction="vertical" size="middle" class="site-space-compact-wrapper">
|
|
<a-space-compact block>
|
|
<a-input v-model:value="data.formName" placeholder="请选择表单" readonly />
|
|
<a-button @click="handleShow">选择</a-button>
|
|
</a-space-compact>
|
|
<a-space-compact block>
|
|
<a-select
|
|
v-model:value="node.formVerison"
|
|
placeholder="请选择表单版本"
|
|
@change="custmerformVerisonChange"
|
|
:options="data.formVerisons"
|
|
:fieldNames="{ value: 'id', label: 'createDate' }"
|
|
/>
|
|
</a-space-compact>
|
|
<a-space-compact block>
|
|
<a-select
|
|
v-model:value="node.formRelationId"
|
|
placeholder="请选择流程关联字段"
|
|
@change="updateWfData('formRelationId')"
|
|
:options="data.formRelations"
|
|
/>
|
|
</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端表单地址"
|
|
@change="updateWfData('formUrl')"
|
|
/>
|
|
</a-space-compact>
|
|
<a-space-compact block>
|
|
<a-input
|
|
v-model:value="node.formAppUrl"
|
|
placeholder="请输入APP端表单地址"
|
|
@change="updateWfData('formAppUrl')"
|
|
/>
|
|
</a-space-compact>
|
|
</a-space>
|
|
</a-tab-pane>
|
|
</a-tabs>
|
|
|
|
<a-divider plain="true">表单字段权限</a-divider>
|
|
<a-table
|
|
:columns="data.formColumns"
|
|
:data-source="node.authFields"
|
|
bordered
|
|
:pagination="false"
|
|
v-if="node.formType == 1"
|
|
>
|
|
<template #bodyCell="{ column, text, record }">
|
|
<template v-if="['label', 'fieldName'].includes(column.dataIndex)">
|
|
<div>
|
|
{{ text }}
|
|
</div>
|
|
</template>
|
|
<template v-else-if="['required', 'disabled', 'ifShow'].includes(column.dataIndex)">
|
|
<div>
|
|
<a-switch v-model:checked="record[column.dataIndex]" size="small" />
|
|
</div>
|
|
</template>
|
|
</template>
|
|
</a-table>
|
|
<a-table
|
|
:columns="data.columns"
|
|
:data-source="node.authFields"
|
|
bordered
|
|
:pagination="false"
|
|
v-else
|
|
>
|
|
<template #bodyCell="{ column, record }">
|
|
<template v-if="['label', 'fieldName'].includes(column.dataIndex)">
|
|
<div>
|
|
<a-input v-model:value="record[column.dataIndex]" placeholder="请输入" />
|
|
</div>
|
|
</template>
|
|
<template v-else-if="['required', 'disabled', 'ifShow'].includes(column.dataIndex)">
|
|
<div>
|
|
<a-switch v-model:checked="record[column.dataIndex]" size="small" />
|
|
</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-space v-if="node.formType != 1">
|
|
<a-button
|
|
@click="handleAddAuthField"
|
|
width="100%"
|
|
type="dashed"
|
|
danger
|
|
:icon="h(PlusOutlined)"
|
|
>添加字段</a-button
|
|
>
|
|
</a-space>
|
|
</a-collapse-panel>
|
|
<a-collapse-panel key="5" header="按钮设置">
|
|
<a-table
|
|
size="small"
|
|
:columns="data.columns"
|
|
:data-source="node.btnlist"
|
|
bordered
|
|
@change="updateWfData('btnlist')"
|
|
:pagination="false"
|
|
>
|
|
<template #bodyCell="{ column, text, record }">
|
|
<template v-if="['name', 'code'].includes(column.dataIndex)">
|
|
<div>
|
|
<a-input
|
|
v-model:value="record[column.dataIndex]"
|
|
placeholder="请输入"
|
|
@change="updateWfData('btnlist')"
|
|
/>
|
|
</div>
|
|
</template>
|
|
<!-- 删除了签章的switch -->
|
|
<template v-else-if="['isNextAuditor', 'hidden'].includes(column.dataIndex)">
|
|
<div>
|
|
<a-switch
|
|
v-model:checked="record[column.dataIndex]"
|
|
@change="updateWfData('btnlist')"
|
|
/>
|
|
</div>
|
|
</template>
|
|
<template v-else-if="column.dataIndex === 'operation'">
|
|
<delete-outlined two-tone-color="#eb2f96" @click="handleDeleteBtns(record.code)" />
|
|
</template>
|
|
</template>
|
|
</a-table>
|
|
<a-divider plain="true" />
|
|
<a-space>
|
|
<a-button
|
|
@click="handleAddBtns"
|
|
width="100%"
|
|
type="dashed"
|
|
danger
|
|
:icon="h(PlusOutlined)"
|
|
>
|
|
添加字段</a-button
|
|
>
|
|
</a-space>
|
|
</a-collapse-panel>
|
|
<a-collapse-panel key="6" header="会签设置">
|
|
<a-form-item label="是否会签">
|
|
<a-switch
|
|
v-model:checked="node.isCountersign"
|
|
@change="updateWfData('isCountersign')"
|
|
/>
|
|
</a-form-item>
|
|
<template v-if="node.isCountersign">
|
|
<a-form-item label="审核方式">
|
|
<a-radio-group
|
|
v-model:value="node.countersignType"
|
|
name="checkboxgroup"
|
|
@change="updateWfData('countersignType')"
|
|
:options="[
|
|
{ value: '1', label: '并行' },
|
|
{ value: '2', label: '串行' },
|
|
]"
|
|
/>
|
|
</a-form-item>
|
|
<template v-if="node.countersignType == 1">
|
|
<a-form-item label="是否等待">
|
|
<a-switch
|
|
v-model:checked="node.isCountersignAll"
|
|
@change="updateWfData('isCountersignAll')"
|
|
/>
|
|
</a-form-item>
|
|
<a-form-item label="通过百分比">
|
|
<a-input-number
|
|
id="inputNumber"
|
|
v-model:value="node.countersignAllType"
|
|
:min="1"
|
|
:max="100"
|
|
@change="updateWfData('countersignAllType')"
|
|
/>
|
|
</a-form-item>
|
|
</template>
|
|
<a-form-item label="再次审核">
|
|
<a-radio-group
|
|
v-model:value="node.countersignAgian"
|
|
name="checkboxgroup"
|
|
@change="updateWfData('countersignAgian')"
|
|
:options="[
|
|
{ value: '1', label: '已同意不需要审核' },
|
|
{ value: '2', label: '已同意需要审核' },
|
|
]"
|
|
/>
|
|
</a-form-item>
|
|
</template>
|
|
</a-collapse-panel>
|
|
<a-collapse-panel key="7" header="超时设置">
|
|
<a-form-item label="超时通知">
|
|
<a-switch v-model:checked="node.isOvertimeMessage" />
|
|
</a-form-item>
|
|
<template v-if="node.isOvertimeMessage">
|
|
<a-form-item label="第一次通知(时)">
|
|
<a-input-number
|
|
id="inputNumber"
|
|
v-model:value="node.overtimeMessageStart"
|
|
:min="1"
|
|
@change="updateWfData('overtimeMessageStart')"
|
|
/>
|
|
</a-form-item>
|
|
<a-form-item label="通知间隔(时)">
|
|
<a-input-number
|
|
id="inputNumber"
|
|
v-model:value="node.overtimeMessageInterval"
|
|
:min="1"
|
|
@change="updateWfData('overtimeMessageInterval')"
|
|
/>
|
|
</a-form-item>
|
|
<a-form-item label="超时流转时间(时)">
|
|
<a-input-number
|
|
id="inputNumber"
|
|
v-model:value="node.overtimeGo"
|
|
:min="1"
|
|
@change="updateWfData('overtimeGo')"
|
|
/>
|
|
</a-form-item>
|
|
<a-form-item label="超时通知策略">
|
|
<a-checkbox-group
|
|
v-model:value="node.overtimeMessageType"
|
|
name="checkboxgroup"
|
|
@change="updateWfData('overtimeMessageType')"
|
|
:options="[
|
|
{ value: '1', label: '短信' },
|
|
{ value: '2', label: '邮箱' },
|
|
{ value: '3', label: '微信' },
|
|
{ value: '4', label: '站内消息' },
|
|
]"
|
|
/>
|
|
</a-form-item>
|
|
</template>
|
|
</a-collapse-panel>
|
|
</a-collapse>
|
|
</a-form>
|
|
<a-modal
|
|
width="60%"
|
|
wrap-class-name="full-modal"
|
|
v-model:open="data.postOpen"
|
|
title="添加岗位"
|
|
@ok="postHandleOk"
|
|
:destroyOnClose="true"
|
|
>
|
|
<SelectPos ref="posRef" />
|
|
</a-modal>
|
|
<a-modal
|
|
width="60%"
|
|
wrap-class-name="full-modal"
|
|
v-model:open="data.roleOpen"
|
|
title="添加角色"
|
|
@ok="roleHandleOk"
|
|
:destroyOnClose="true"
|
|
>
|
|
<SelectRole ref="roleRef" />
|
|
</a-modal>
|
|
<a-modal
|
|
width="60%"
|
|
wrap-class-name="full-modal"
|
|
v-model:open="data.accountOpen"
|
|
title="添加用户"
|
|
@ok="accountHandleOk"
|
|
:destroyOnClose="true"
|
|
>
|
|
<SelectAccount ref="accountRef" />
|
|
</a-modal>
|
|
<a-modal
|
|
width="40%"
|
|
v-model:open="data.levelOpen"
|
|
title="添加上下级"
|
|
@ok="levelHandleOk"
|
|
:destroyOnClose="true"
|
|
>
|
|
<AuditorLevel ref="levelRef" />
|
|
</a-modal>
|
|
<a-modal
|
|
width="40%"
|
|
v-model:open="data.nodeOpen"
|
|
title="流程节点选择"
|
|
@ok="nodeHandleOk"
|
|
:destroyOnClose="true"
|
|
>
|
|
<AuditorNode ref="nodeRef" :id="nodeId" />
|
|
</a-modal>
|
|
<a-modal
|
|
width="40%"
|
|
v-model:open="data.auditorSqlOpen"
|
|
title="数据表字段选择"
|
|
@ok="sqlHandleOk"
|
|
:destroyOnClose="true"
|
|
>
|
|
<AuditorSql ref="sqlRef" />
|
|
</a-modal>
|
|
<a-modal
|
|
width="60%"
|
|
wrap-class-name="full-modal"
|
|
v-model:open="data.formOpen"
|
|
title="选择表单"
|
|
@ok="formHandleOk"
|
|
:destroyOnClose="true"
|
|
>
|
|
<SelectForm ref="formRef" />
|
|
</a-modal>
|
|
</div>
|
|
</template>
|
|
|
|
<script lang="ts" setup>
|
|
import { reactive, ref, onMounted, h, watch, defineProps } from 'vue';
|
|
import { SelectPos } from '@/components/SelectPos/index';
|
|
import { SelectRole } from '@/components/SelectRole/index';
|
|
import { SelectAccount } from '@/components/SelectAccount/index';
|
|
import { AuditorLevel, AuditorSql, AuditorNode } from './page';
|
|
import { DeleteOutlined, PlusOutlined } from '@ant-design/icons-vue';
|
|
import { flowStore } from '@/store/modules/flow';
|
|
import { SelectForm } from '@/components/SelectForm/index';
|
|
import { functionGetSchemePageList, functionLoadFormPage } from '@/api/demo/formScheme';
|
|
|
|
const flowWfDataStore = flowStore();
|
|
const labelCol = { span: 7 };
|
|
const wrapperCol = { span: 17 };
|
|
const activeKey = ref('1');
|
|
const nodeId = ref('');
|
|
let node: any = ref({});
|
|
const props = defineProps({
|
|
element: {
|
|
type: Object,
|
|
default: () => {
|
|
return {};
|
|
},
|
|
},
|
|
schemeCode: String,
|
|
pageType: String,
|
|
pageView: String,
|
|
taskData: Object,
|
|
});
|
|
const data = reactive({
|
|
atuoAgreeOptions: [
|
|
{ value: '1', label: '处理人就是提交人' },
|
|
{ value: '2', label: '处理人和上一步的处理人相同' },
|
|
{ value: '3', label: '处理人审批过' },
|
|
],
|
|
noAuditorOptions: [
|
|
{ value: '1', label: '超级管理员处理' },
|
|
{ value: '2', label: '跳过此步骤' },
|
|
{ value: '3', label: '不能提交' },
|
|
],
|
|
postOpen: false,
|
|
roleOpen: false,
|
|
accountOpen: false,
|
|
levelOpen: false,
|
|
nodeOpen: false,
|
|
auditorSqlOpen: false,
|
|
userColumns: [
|
|
{ title: '类型', dataIndex: 'type' },
|
|
{ title: '名称', dataIndex: 'name' },
|
|
{ title: '附加条件', dataIndex: 'condition', width: 130 },
|
|
{ title: '操作', dataIndex: 'operation' },
|
|
],
|
|
columns: [
|
|
{
|
|
title: '名称',
|
|
dataIndex: 'name',
|
|
},
|
|
{
|
|
title: '编码',
|
|
dataIndex: 'code',
|
|
},
|
|
{
|
|
title: '隐藏',
|
|
dataIndex: 'hidden',
|
|
},
|
|
// {
|
|
// title: '签章',
|
|
// dataIndex: 'isSign',
|
|
// },
|
|
{
|
|
title: '下一审批人',
|
|
dataIndex: 'isNextAuditor',
|
|
},
|
|
{
|
|
title: '',
|
|
dataIndex: 'operation',
|
|
},
|
|
],
|
|
formColumns: [
|
|
{
|
|
title: '名称',
|
|
dataIndex: 'label',
|
|
},
|
|
{
|
|
title: '字段',
|
|
dataIndex: 'fieldName',
|
|
},
|
|
{
|
|
title: '必填',
|
|
dataIndex: 'required',
|
|
},
|
|
{
|
|
title: '编辑',
|
|
dataIndex: 'disabled',
|
|
},
|
|
{
|
|
title: '查看',
|
|
dataIndex: 'ifShow',
|
|
},
|
|
],
|
|
isLooker: false,
|
|
conditionOptions: [
|
|
{ value: '1', label: '同一个部门' },
|
|
{ value: '2', label: '同一个公司' },
|
|
{ value: '3', label: '发起人上级' },
|
|
{ value: '4', label: '发起人下级' },
|
|
],
|
|
componentDisabled: props.pageType == 'detail' ? true : false,
|
|
formRelations: [],
|
|
formOpen: false,
|
|
formVerisons: [],
|
|
formName: '',
|
|
});
|
|
|
|
watch(
|
|
() => props.element,
|
|
(newVal) => {
|
|
if (newVal.type == 'bpmn:Task') {
|
|
const currentNode = flowWfDataStore.getWfDataNode(newVal.id);
|
|
if (currentNode) {
|
|
node.value = currentNode;
|
|
} else {
|
|
node.value = newVal;
|
|
}
|
|
}
|
|
},
|
|
);
|
|
watch(
|
|
() => node.value.formCode,
|
|
(newVal) => {
|
|
if (newVal) {
|
|
getFormList();
|
|
getVersions(false);
|
|
}
|
|
},
|
|
);
|
|
function updateWfData(key) {
|
|
flowWfDataStore.updataWfDataNode(node.value.id, key, node.value[key]);
|
|
}
|
|
function typeFormat(type) {
|
|
switch (type) {
|
|
case '1':
|
|
return '岗位';
|
|
case '2':
|
|
return '角色';
|
|
case '3':
|
|
return '用户';
|
|
case '4':
|
|
return '上下级';
|
|
case '5':
|
|
return '节点';
|
|
case '6':
|
|
return '表字段';
|
|
}
|
|
}
|
|
|
|
onMounted(() => {
|
|
if (props.element.type == 'bpmn:Task') {
|
|
const currentNode = flowWfDataStore.getWfDataNode(props.element.id);
|
|
if (currentNode) {
|
|
node.value = currentNode;
|
|
} else {
|
|
node.value = props.element;
|
|
}
|
|
}
|
|
});
|
|
// 岗位
|
|
const posRef = ref<any>();
|
|
function handlePostClick(isLooker) {
|
|
data.postOpen = true;
|
|
data.isLooker = isLooker;
|
|
}
|
|
function addTableData(selectData) {
|
|
if (data.isLooker) {
|
|
let addData2 = selectData.filter(
|
|
(t) => node.value.lookUsers.findIndex((t2) => t2.id == t.id && t2.type == t.type) == -1,
|
|
);
|
|
node.value.lookUsers = node.value.lookUsers.concat(addData2);
|
|
updateWfData('lookUsers');
|
|
} else {
|
|
let addData = selectData.filter(
|
|
(t) => node.value.auditUsers.findIndex((t2) => t2.id == t.id && t2.type == t.type) == -1,
|
|
);
|
|
node.value.auditUsers = node.value.auditUsers.concat(addData);
|
|
updateWfData('auditUsers');
|
|
}
|
|
}
|
|
function postHandleOk() {
|
|
let selectData = posRef.value.getRow().map((t) => {
|
|
return { type: '1', id: t.id, name: t.name };
|
|
});
|
|
addTableData(selectData);
|
|
data.postOpen = false;
|
|
}
|
|
// 角色
|
|
const roleRef = ref<any>();
|
|
function handleRoleClick(isLooker) {
|
|
data.isLooker = isLooker;
|
|
data.roleOpen = true;
|
|
}
|
|
function roleHandleOk() {
|
|
let selectData = roleRef.value.getRow().map((t) => {
|
|
return { type: '2', id: t.id, name: t.name, condition: '' };
|
|
});
|
|
addTableData(selectData);
|
|
data.roleOpen = false;
|
|
}
|
|
// 用户
|
|
const accountRef = ref<any>();
|
|
function handleAccountClick(isLooker) {
|
|
data.isLooker = isLooker;
|
|
data.accountOpen = true;
|
|
}
|
|
function accountHandleOk() {
|
|
let selectData = accountRef.value.getRow().map((t) => {
|
|
return { type: '3', id: t.id, name: t.name };
|
|
});
|
|
addTableData(selectData);
|
|
data.accountOpen = false;
|
|
}
|
|
// 上下级
|
|
const levelRef = ref<any>();
|
|
function handleLevelClick(isLooker) {
|
|
data.isLooker = isLooker;
|
|
data.levelOpen = true;
|
|
}
|
|
async function levelHandleOk() {
|
|
await levelRef.value.validateForm();
|
|
let obj = levelRef.value.getForm();
|
|
if (obj.id != '') {
|
|
addTableData([obj]);
|
|
data.levelOpen = false;
|
|
}
|
|
}
|
|
//节点执行人
|
|
const nodeRef = ref<any>();
|
|
|
|
function handleNodeAuditorClick(isLooker) {
|
|
nodeId.value = node.value.id;
|
|
data.isLooker = isLooker;
|
|
data.nodeOpen = true;
|
|
}
|
|
function nodeHandleOk() {
|
|
nodeRef.value.validateForm();
|
|
let obj = nodeRef.value.getForm();
|
|
if (obj.id != '') {
|
|
addTableData([obj]);
|
|
data.nodeOpen = false;
|
|
}
|
|
}
|
|
|
|
// 数据表字段选择
|
|
const sqlRef = ref<any>();
|
|
function handleAuditorSqlClick(isLooker) {
|
|
data.isLooker = isLooker;
|
|
data.auditorSqlOpen = true;
|
|
}
|
|
function sqlHandleOk() {
|
|
sqlRef.value.validateForm();
|
|
let obj = sqlRef.value.getForm();
|
|
if (
|
|
obj.name == '' ||
|
|
obj.table == '' ||
|
|
obj.value == '' ||
|
|
obj.rfield == '' ||
|
|
obj.cfield == '' ||
|
|
obj.compareType == ''
|
|
) {
|
|
data.auditorSqlOpen = true;
|
|
} else {
|
|
obj.name = `${obj.table}【${obj.auditorField}】`;
|
|
addTableData([obj]);
|
|
data.auditorSqlOpen = false;
|
|
}
|
|
}
|
|
// 审核人员设置
|
|
function onDelete(key, isLook) {
|
|
if (isLook) {
|
|
node.value.lookUsers = node.value.lookUsers.filter((item) => item.name !== key);
|
|
updateWfData('lookUsers');
|
|
} else {
|
|
node.value.auditUsers = node.value.auditUsers.filter((item) => item.name !== key);
|
|
updateWfData('auditUsers');
|
|
}
|
|
}
|
|
// 按钮设置
|
|
function handleAddBtns() {
|
|
node.value.btnlist.push({
|
|
code: '',
|
|
name: '',
|
|
hidden: false,
|
|
isNextAuditor: false,
|
|
isSign: false,
|
|
});
|
|
updateWfData('btnlist');
|
|
}
|
|
function handleDeleteBtns(key) {
|
|
node.value.btnlist = node.value.btnlist.filter((item) => item.code !== key);
|
|
updateWfData('btnlist');
|
|
}
|
|
// 表单设置
|
|
// 编辑时获取表单名称，表单版本
|
|
async function getFormList() {
|
|
const list = await functionLoadFormPage({
|
|
page: 1,
|
|
limit: 1000,
|
|
});
|
|
list.items.forEach((element) => {
|
|
if (element.id == node.value.formCode) {
|
|
data.formName = element.name;
|
|
}
|
|
});
|
|
}
|
|
// 切换自定义表单和系统表单
|
|
function tabsChange() {
|
|
data.formName = '';
|
|
node.value.formCode = '';
|
|
node.value.formVerison = '';
|
|
node.value.formRelationId = '';
|
|
node.value.formUrl = '';
|
|
node.value.formAppUrl = '';
|
|
node.value.authFields = [];
|
|
node.value.formRelations = [];
|
|
}
|
|
// 表单选择打开
|
|
function handleShow() {
|
|
data.formOpen = true;
|
|
}
|
|
// 表单选择
|
|
const formRef = ref<any>();
|
|
async function formHandleOk() {
|
|
let obj = formRef.value.getRow();
|
|
node.value.formCode = obj[0].id;
|
|
data.formName = obj[0].name;
|
|
node.value.formVerison = '';
|
|
node.value.formRelationId = '';
|
|
node.value.formUrl = '';
|
|
node.value.formAppUrl = '';
|
|
node.value.authFields = [];
|
|
node.value.formRelations = [];
|
|
getVersions(true);
|
|
data.formOpen = false;
|
|
}
|
|
async function getVersions(isChange) {
|
|
const list = await functionGetSchemePageList({
|
|
schemeInfoId: node.value.formCode,
|
|
});
|
|
data.formVerisons = list.items;
|
|
if (node.value.formVerison) {
|
|
custmerformVerisonChange(node.value.formVerison, isChange);
|
|
}
|
|
}
|
|
// 表单版本更改
|
|
async function custmerformVerisonChange(val, isChange) {
|
|
let obj;
|
|
data.formVerisons.forEach((element) => {
|
|
if (element.id == val) {
|
|
obj = element;
|
|
}
|
|
});
|
|
loadFormScheme(obj.scheme, isChange);
|
|
}
|
|
function loadFormScheme(strScheme, isChange) {
|
|
const scheme = JSON.parse(strScheme);
|
|
const fields: any[] = [];
|
|
const rfields: {
|
|
label?: string;
|
|
value?: string;
|
|
}[] = [];
|
|
scheme.formInfo.tabList.forEach((tabElement) => {
|
|
tabElement.schemas.forEach(
|
|
(element: { label?: string; field?: string; component: any; itemProps: any }) => {
|
|
if (['InputGuid'].includes(element.component)) {
|
|
rfields.push({
|
|
label: element.label,
|
|
// value:element.prop
|
|
value: element.field,
|
|
});
|
|
}
|
|
|
|
if (
|
|
![
|
|
'Divider',
|
|
'Grid',
|
|
'Card',
|
|
'CreateUser',
|
|
'CreateTime',
|
|
'ModifyUser',
|
|
'ModifyTime',
|
|
].includes(element.component) &&
|
|
!element.itemProps.hidden
|
|
) {
|
|
let obj: any = element;
|
|
obj.required = element.itemProps.required;
|
|
// obj.componentProps.disabled = true;
|
|
obj.disabled = true;
|
|
obj.ifShow = true;
|
|
obj.fieldName = element.componentProps.fieldName;
|
|
fields.push(obj);
|
|
} else if (['Grid'].includes(element.component) || element.type == 'subTable') {
|
|
console.log('gridtable');
|
|
fields.push({
|
|
field: `${element.field}_add`,
|
|
label: `${element.label || '表格'}-添加按钮`,
|
|
required: false,
|
|
disabled: true,
|
|
ifShow: false,
|
|
type: 'grid',
|
|
});
|
|
fields.push({
|
|
field: `${element.field}_remove`,
|
|
label: `${element.label || '表格'}-删除按钮`,
|
|
required: false,
|
|
disabled: true,
|
|
ifShow: false,
|
|
type: 'grid',
|
|
});
|
|
|
|
fields.push({
|
|
field: `${element.field}_required`,
|
|
label: `${element.label || '表格'}-数据`,
|
|
required: element.itemProps.required,
|
|
disabled: false,
|
|
ifShow: false,
|
|
type: 'gridrequired',
|
|
});
|
|
element.columns.forEach((child) => {
|
|
child.children.forEach((t) => {
|
|
fields.push({
|
|
type: 'childData',
|
|
gridprop: element.field,
|
|
field: t.field,
|
|
label: `${element.label || '表格'}-${t.label}`,
|
|
required: t.itemProps.required,
|
|
disabled: true,
|
|
ifShow: true,
|
|
fieldName: t.componentProps.fieldName,
|
|
...t,
|
|
});
|
|
});
|
|
});
|
|
} else if (['Card'].includes(element.component)) {
|
|
element.columns.forEach((child) => {
|
|
child.children.forEach((t) => {
|
|
fields.push({
|
|
gridprop: element.field,
|
|
field: t.field,
|
|
required: t.itemProps.required,
|
|
disabled: true,
|
|
ifShow: true,
|
|
fieldName: t.componentProps.fieldName,
|
|
...t,
|
|
});
|
|
});
|
|
});
|
|
} else if (
|
|
['CreateUser', 'CreateTime', 'ModifyUser', 'ModifyTime'].includes(element.component) &&
|
|
element.display
|
|
) {
|
|
let obj: any = element;
|
|
obj.required = element.itemProps.required;
|
|
// obj.componentProps.disabled = false;
|
|
obj.disabled = true;
|
|
obj.ifShow = true;
|
|
obj.fieldName = element.componentProps.fieldName;
|
|
fields.push(obj);
|
|
}
|
|
},
|
|
);
|
|
});
|
|
data.formRelations = rfields;
|
|
if (isChange) {
|
|
node.value.authFields = fields;
|
|
}
|
|
}
|
|
function handleAddAuthField() {
|
|
node.value.authFields.push({
|
|
field: '',
|
|
label: '',
|
|
required: true,
|
|
disabled: true,
|
|
ifShow: true,
|
|
});
|
|
}
|
|
function handleDeleteAuthField(key) {
|
|
node.value.authFields = node.value.authFields.filter((item) => item.field !== key);
|
|
}
|
|
defineExpose({});
|
|
</script>
|
|
|
|
<style lang="less" scoped>
|
|
::v-deep .ant-select-single {
|
|
width: 100%;
|
|
}
|
|
|
|
.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%;
|
|
}
|
|
}
|
|
}
|
|
|
|
::v-deep .ant-table-content {
|
|
margin-top: 10px;
|
|
}
|
|
|
|
::v-deep .ant-collapse-content-box {
|
|
padding: 0;
|
|
}
|
|
|
|
::v-deep .ant-collapse .ant-collapse-content > .ant-collapse-content-box {
|
|
padding: 0;
|
|
}
|
|
|
|
::v-deep .ant-collapse > .ant-collapse-item > .ant-collapse-header {
|
|
padding: 12px 0;
|
|
}
|
|
</style>
|
|
<style lang="less">
|
|
.full-modal {
|
|
.ant-modal {
|
|
max-width: 100%;
|
|
}
|
|
|
|
.ant-modal-content {
|
|
height: calc(80vh);
|
|
}
|
|
|
|
.ant-modal-body {
|
|
height: 80%;
|
|
}
|
|
}
|
|
</style>
|
|
<style lang="scss" scoped>
|
|
::v-deep .ant-space {
|
|
width: 90%;
|
|
margin-left: 5%;
|
|
|
|
.ant-space-item {
|
|
width: 100%;
|
|
|
|
button {
|
|
width: 20%;
|
|
}
|
|
.ant-btn-dangerous {
|
|
width: 100%;
|
|
}
|
|
}
|
|
}
|
|
</style>
|