feat(CURD): 支持PageSearch组件自定义插槽,增强表单项扩展性
- PageSearch.vue: 新增custom类型支持,允许通过插槽渲染自定义组件 - types.ts: ISearchComponent类型新增'custom'选项,支持字典等复杂组件集成
This commit is contained in:
@@ -19,8 +19,16 @@
|
|||||||
</span>
|
</span>
|
||||||
</template>
|
</template>
|
||||||
|
|
||||||
|
<!-- 自定义插槽 -->
|
||||||
|
<slot
|
||||||
|
v-if="item.type === 'custom'"
|
||||||
|
:name="item.slotName"
|
||||||
|
:form-data="queryParams"
|
||||||
|
:prop="item.prop"
|
||||||
|
:attrs="{ style: { width: '100%' }, ...item.attrs }"
|
||||||
|
/>
|
||||||
<el-cascader
|
<el-cascader
|
||||||
v-if="item.type === 'cascader'"
|
v-else-if="item.type === 'cascader'"
|
||||||
v-model.trim="queryParams[item.prop]"
|
v-model.trim="queryParams[item.prop]"
|
||||||
v-bind="{ style: { width: '100%' }, ...item.attrs }"
|
v-bind="{ style: { width: '100%' }, ...item.attrs }"
|
||||||
v-on="item.events || {}"
|
v-on="item.events || {}"
|
||||||
|
|||||||
@@ -14,7 +14,7 @@ export type IObject = Record<string, any>;
|
|||||||
type DateComponent = "date-picker" | "time-picker" | "time-select" | "custom-tag" | "input-tag";
|
type DateComponent = "date-picker" | "time-picker" | "time-select" | "custom-tag" | "input-tag";
|
||||||
type InputComponent = "input" | "select" | "input-number" | "cascader" | "tree-select";
|
type InputComponent = "input" | "select" | "input-number" | "cascader" | "tree-select";
|
||||||
type OtherComponent = "text" | "radio" | "checkbox" | "switch" | "icon-select" | "custom";
|
type OtherComponent = "text" | "radio" | "checkbox" | "switch" | "icon-select" | "custom";
|
||||||
export type ISearchComponent = DateComponent | InputComponent;
|
export type ISearchComponent = DateComponent | InputComponent | "custom";
|
||||||
export type IComponentType = DateComponent | InputComponent | OtherComponent;
|
export type IComponentType = DateComponent | InputComponent | OtherComponent;
|
||||||
|
|
||||||
type ToolbarLeft = "add" | "delete" | "import" | "export";
|
type ToolbarLeft = "add" | "delete" | "import" | "export";
|
||||||
|
|||||||
Reference in New Issue
Block a user