<script lang="ts" setup>
|
import { getFlowFormInfo } from '#/api/workFlow/template';
|
import FlowModal from '#/components/FlowProcess/src/propPanel/components/FlowModal.vue';
|
import { systemComponentsList } from '#/components/FormGenerator/src/helper/config';
|
import { $t } from '#/locales';
|
import { simpleSourceTypeOptions as sourceTypeOptions } from '#/utils/define';
|
|
const props = defineProps({
|
dataForm: { type: Object, default: () => {} },
|
allFormFieldsOptions: { type: Array as PropType<any>, default: () => [] },
|
});
|
const launchColumns = [
|
{ width: 50, title: '序号', align: 'center', customRender: ({ index }) => index + 1 },
|
{ title: '目标表单值', dataIndex: 'targetField', key: 'targetField', width: 200 },
|
{ title: '的值设为', dataIndex: 'tips', key: 'tips', align: 'center', width: 80 },
|
{ title: '类型', dataIndex: 'sourceType', key: 'sourceType', width: 100 },
|
{ title: '值', dataIndex: 'sourceValue', key: 'sourceValue', width: 200 },
|
{ title: '操作', dataIndex: 'action', key: 'action', width: 50 },
|
];
|
|
function addTransferItem() {
|
props.dataForm.launchFlow.transferList.push({ targetField: '', targetFieldLabel: '', sourceType: 1, sourceValue: '', required: false });
|
}
|
function handleDelItem(index) {
|
props.dataForm.launchFlow.transferList.splice(index, 1);
|
}
|
function onFlowIdChange(id, item) {
|
if (!id) return handleNull();
|
props.dataForm.launchFlow.flowName = item.fullName;
|
props.dataForm.launchFlow.flowId = id;
|
props.dataForm.launchFlow.transferList = [];
|
props.dataForm.launchFlow.initiator = [];
|
props.dataForm.launchFlow.launchPermission = item.visibleType || 1;
|
getFlowFormFieldList(id);
|
}
|
function handleNull() {
|
props.dataForm.launchFlow.flowName = '';
|
props.dataForm.launchFlow.flowId = '';
|
props.dataForm.launchFlow.formFieldList = [];
|
props.dataForm.launchFlow.transferList = [];
|
props.dataForm.launchFlow.initiator = [];
|
props.dataForm.launchFlow.launchPermission = 1;
|
}
|
function getFlowFormFieldList(flowId) {
|
if (!flowId) return;
|
getFlowFormInfo(flowId).then((res) => {
|
const { type = 1, formData } = res.data;
|
let fieldList: any[] = [];
|
let formJson: any = {};
|
if (formData) formJson = JSON.parse(formData);
|
fieldList = type == 2 ? transformFormJson(formJson) : formJson.fields;
|
const list: any[] = transformFieldList(fieldList);
|
props.dataForm.launchFlow.formFieldList = list.map((o) => ({ ...o, label: o.fullName ? `${o.id}(${o.fullName})` : o.id }));
|
updateTransferList();
|
});
|
}
|
function updateTransferList() {
|
const formFieldList = props.dataForm.launchFlow.formFieldList;
|
const list: any = [];
|
for (const element of formFieldList) {
|
if (element.__config__?.required) {
|
list.push({ targetField: element.id, targetFieldLabel: element.fullName, sourceType: 1, sourceValue: '', required: true });
|
}
|
}
|
props.dataForm.launchFlow.transferList = list;
|
}
|
function transformFormJson(list) {
|
const fieldList = list.map((o) => ({
|
__config__: {
|
label: o.fieldName,
|
jnpfKey: o.jnpfKey || '',
|
required: o.required || false,
|
},
|
__vModel__: o.fieldId,
|
multiple: o.multiple || false,
|
}));
|
return fieldList;
|
}
|
function transformFieldList(formFieldList) {
|
const list: any[] = [];
|
const loop = (data, parent?) => {
|
if (!data) return;
|
if (data.__vModel__) {
|
const isTableChild = parent && parent.__config__ && parent.__config__.jnpfKey === 'table';
|
const item: any = {
|
id: isTableChild ? `${parent.__vModel__}-${data.__vModel__}` : data.__vModel__,
|
fullName: isTableChild ? `${parent.__config__.label}-${data.__config__.label}` : data.__config__.label,
|
__config__: {
|
jnpfKey: data.__config__.jnpfKey,
|
},
|
};
|
list.push(item);
|
}
|
if (Array.isArray(data)) data.forEach((d) => loop(d, parent));
|
if (data.__config__ && data.__config__.children && Array.isArray(data.__config__.children)) {
|
loop(data.__config__.children, data);
|
}
|
};
|
loop(formFieldList);
|
return list;
|
}
|
function getSourceValueOptions(item) {
|
if (!item.targetField) return [];
|
return item.targetField.includes('-') ? props.allFormFieldsOptions : props.allFormFieldsOptions.filter((o) => !o?.__config__?.isSubTable);
|
}
|
function getTargetOptions(index: number) {
|
const ignoreOptions: any[] = [];
|
for (let i = 0; i < props.dataForm.launchFlow.transferList.length; i++) {
|
const e = props.dataForm.launchFlow.transferList[i];
|
if (e.targetField && index !== i) ignoreOptions.push(e.targetField);
|
}
|
const list = props.dataForm.launchFlow.formFieldList.filter(
|
(o) => !ignoreOptions.includes(o.id) && !['table', ...systemComponentsList].includes(o?.__config__?.jnpfKey),
|
);
|
return list;
|
}
|
function validateInitiator(_rule, _value) {
|
const { customUser, currentUser } = props.dataForm.launchFlow;
|
if (!customUser && !currentUser) {
|
return Promise.reject('指定成员 或 当前用户 必须至少选择一个');
|
}
|
return Promise.resolve();
|
}
|
</script>
|
<template>
|
<a-form-item label="选择流程" :name="['launchFlow', 'flowId']" :rules="[{ required: true, message: '必填', trigger: 'change' }]">
|
<FlowModal :value="dataForm.launchFlow.flowId" :title="dataForm.launchFlow.flowName" @change="onFlowIdChange" :allow-clear="false" />
|
</a-form-item>
|
<a-form-item label="字段设置" style="margin-bottom: 0" />
|
<a-table :data-source="dataForm.launchFlow?.transferList" :columns="launchColumns" size="small" :pagination="false">
|
<template #bodyCell="{ column, record, index }">
|
<template v-if="column.key === 'targetField'">
|
<jnpf-select
|
class="!w-[190px]"
|
v-model:value="record.targetField"
|
:options="getTargetOptions(index)"
|
show-search
|
allow-clear
|
:disabled="record.required" />
|
</template>
|
<template v-if="column.key === 'tips'">的值设为</template>
|
<template v-if="column.key === 'sourceType'">
|
<jnpf-select v-model:value="record.sourceType" :options="sourceTypeOptions" @change="record.sourceValue = ''" />
|
</template>
|
<template v-if="column.key === 'sourceValue'">
|
<jnpf-select
|
class="!w-[190px]"
|
v-model:value="record.sourceValue"
|
:options="getSourceValueOptions(record)"
|
placeholder="数据源字段"
|
show-search
|
allow-clear
|
v-if="record.sourceType === 1" />
|
<a-input v-model:value="record.sourceValue" placeholder="请输入" allow-clear v-if="record.sourceType === 2" />
|
</template>
|
<template v-if="column.key === 'action'">
|
<a-button class="action-btn" type="link" color="error" @click="handleDelItem(index)" size="small" :disabled="record.required">删除</a-button>
|
</template>
|
</template>
|
<template #emptyText>
|
<p class="leading-[60px]">暂无数据</p>
|
</template>
|
</a-table>
|
<div class="table-add-action mb-[20px]" @click="addTransferItem()">
|
<a-button type="link" pre-icon="icon-ym icon-ym-btn-add">{{ $t('common.add2Text') }}</a-button>
|
</div>
|
<a-form-item class="mb-[10px]">
|
<template #label>发起人<BasicHelp text="多个审批人时产生多条流程实例" /></template>
|
</a-form-item>
|
<div v-if="dataForm.launchFlow.launchPermission == 2">
|
<a-switch v-model:checked="dataForm.launchFlow.hasPermission" />
|
<span class="common-tip ml-[10px]">校验发起权限（校验发起人是否有该流程的发起权限）</span>
|
</div>
|
<a-form-item class="table-btn-launch" :name="['launchFlow', 'initiatorCheck']" :rules="[{ validator: validateInitiator, trigger: 'change' }]">
|
<div class="table-btn-event">
|
<JnpfCheckboxSingle class="leading-[32px]" label="指定成员" v-model:value="dataForm.launchFlow.customUser" /><br />
|
<JnpfCheckboxSingle class="leading-[32px]" label="当前用户" v-model:value="dataForm.launchFlow.currentUser" />
|
</div>
|
<div class="mt-[6px]" v-if="dataForm.launchFlow.customUser">
|
<jnpf-users-select v-model:value="dataForm.launchFlow.initiator" button-type="button" modal-title="添加发起人" />
|
</div>
|
</a-form-item>
|
</template>
|
