<script lang="ts" setup>
|
import { reactive, ref } from 'vue';
|
|
import { BasicModal, useModalInner } from '@jnpf/ui/modal';
|
|
const emit = defineEmits(['register', 'confirm']);
|
const dataForm = reactive({
|
biz_sign_enabled: false,
|
biz_sign_field: '',
|
});
|
const fieldOptions = ref<{ fullName: string; id: string }[]>([]);
|
const [registerModal, { closeModal }] = useModalInner(init);
|
|
function init(data: { config?: { biz_sign_enabled?: boolean; biz_sign_field?: string }; drawingList?: any[] }) {
|
fieldOptions.value = getInputFieldOptions(data?.drawingList || []);
|
dataForm.biz_sign_enabled = data?.config?.biz_sign_enabled ?? false;
|
dataForm.biz_sign_field = data?.config?.biz_sign_field ?? fieldOptions.value.find((item) => item.id === 'biz_sign')?.id ?? '';
|
}
|
|
function getInputFieldOptions(drawingList: any[]) {
|
const options: { fullName: string; id: string }[] = [];
|
const loop = (nodes: any[], isInTable = false) => {
|
if (!Array.isArray(nodes)) return;
|
nodes.forEach((node) => {
|
const config = node?.__config__;
|
const isCurrentTable = isInTable || config?.jnpfKey === 'table';
|
if (!isCurrentTable && config?.jnpfKey === 'input' && node.__vModel__) {
|
options.push({ fullName: config.label || node.__vModel__, id: node.__vModel__ });
|
}
|
loop(config?.children, isCurrentTable);
|
});
|
};
|
loop(drawingList);
|
return options;
|
}
|
|
function handleSubmit() {
|
emit('confirm', { ...dataForm });
|
closeModal();
|
}
|
</script>
|
|
<template>
|
<BasicModal v-bind="$attrs" title="按钮配置" :width="500" destroy-on-close @register="registerModal" @ok="handleSubmit">
|
<a-form :colon="false" label-align="left" :label-col="{ style: { width: '110px' } }">
|
<a-form-item label="启用电子签名">
|
<a-switch v-model:checked="dataForm.biz_sign_enabled" />
|
</a-form-item>
|
<a-form-item label="电子签名字段" required v-if="dataForm.biz_sign_enabled">
|
<jnpf-select v-model:value="dataForm.biz_sign_field" :options="fieldOptions" placeholder="请选择" allow-clear show-search />
|
</a-form-item>
|
</a-form>
|
</BasicModal>
|
</template>
|