feat: 表单支持slot形式的自定义组件
This commit is contained in:
@ -233,6 +233,10 @@ export interface FormSchema {
|
||||
value?: any;
|
||||
subTitle?: string;
|
||||
isShow?: boolean;
|
||||
//自定义插槽名称 用于自定义组件
|
||||
slotName?: string;
|
||||
//无视权限一直显示 用于自定义组件
|
||||
ignorePermission?: boolean;
|
||||
}
|
||||
export interface HelpComponentProps {
|
||||
maxWidth: string;
|
||||
|
||||
@ -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>
|
||||
|
||||
@ -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;
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
@ -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>
|
||||
|
||||
Reference in New Issue
Block a user