feat: 表单支持slot形式的自定义组件

This commit is contained in:
gaoyunqi
2024-03-06 18:33:49 +08:00
parent ebd405c3e5
commit 8b0921f1dc
4 changed files with 10 additions and 2 deletions

View File

@ -233,6 +233,10 @@ export interface FormSchema {
value?: any;
subTitle?: string;
isShow?: boolean;
//自定义插槽名称 用于自定义组件
slotName?: string;
//无视权限一直显示 用于自定义组件
ignorePermission?: boolean;
}
export interface HelpComponentProps {
maxWidth: string;

View File

@ -4,9 +4,12 @@
<Row v-bind="getRow">
<template v-for="schema in getSchemas" :key="schema.field">
<Col v-if="getIfShow(schema, formModel[schema.field])" v-show="getIsShow(schema, formModel[schema.field])" :span="getColWidth(schema)">
<template v-if="showComponent(schema)">
<template v-if="showComponent(schema) && schema.type !== 'slot'">
<SimpleFormItem v-model:value="formModel[schema.field]" :form-api="formApi" :isWorkFlow="isWorkFlow" :refreshFieldObj="refreshFieldObj" :schema="schema" />
</template>
<template v-if="schema.type === 'slot'">
<slot :name="schema.slotName" :schema="schema" :formModel="formModel"></slot>
</template>
</Col>
</template>
</Row>

View File

@ -262,7 +262,7 @@ export function usePermission() {
}
} else {
const field = schema.field || schema.dataIndex || schema.key;
return formAuth?.includes(field);
return formAuth?.includes(field) || schema.ignorePermission;
}
}

View File

@ -5,6 +5,7 @@
<div :style="{}" class="form-right">
<div v-for="(item, index) in forms.configs" :key="index" :tab="item.formName">
<div v-show="activeIndex == index">
<!-- 如果是生成文件模式 formType = 0也就是FormType.SYSTEM会加载对应项目的Form.vue-->
<SystemForm v-if="item.formType == FormType.SYSTEM" :ref="setItemRef" :formModel="item.formModel" :isViewProcess="props.disabled" :systemComponent="item.systemComponent" :workflowConfig="item" class="form-box" />
<SimpleForm v-else-if="item.formType == FormType.CUSTOM" :ref="setItemRef" :formModel="item.formModel" :formProps="item.formProps" :isWorkFlow="true" class="form-box" />
</div>