feat
This commit is contained in:
@@ -1,22 +1,12 @@
|
||||
<template>
|
||||
<a-row>
|
||||
<a-col :flex="1">
|
||||
<a-form
|
||||
:model="localModel"
|
||||
:label-col-props="{ span: 6 }"
|
||||
:wrapper-col-props="{ span: 18 }"
|
||||
label-align="left"
|
||||
>
|
||||
<a-form :model="localModel" :label-col-props="{ span: 6 }" :wrapper-col-props="{ span: 18 }" label-align="left">
|
||||
<a-row :gutter="16">
|
||||
<a-col v-for="item in formItems" :key="item.field" :span="item.span || 8">
|
||||
<a-form-item :field="item.field" :label="item.label">
|
||||
<!-- 输入框 -->
|
||||
<a-input
|
||||
v-if="item.type === 'input'"
|
||||
v-model="localModel[item.field]"
|
||||
:placeholder="item.placeholder"
|
||||
allow-clear
|
||||
/>
|
||||
<a-input v-if="item.type === 'input'" v-model="localModel[item.field]" :placeholder="item.placeholder" allow-clear />
|
||||
<!-- 选择框 -->
|
||||
<a-select
|
||||
v-else-if="item.type === 'select'"
|
||||
@@ -29,11 +19,7 @@
|
||||
allow-clear
|
||||
/>
|
||||
<!-- 日期范围选择器 -->
|
||||
<a-range-picker
|
||||
v-else-if="item.type === 'dateRange'"
|
||||
v-model="localModel[item.field]"
|
||||
style="width: 100%"
|
||||
/>
|
||||
<a-range-picker v-else-if="item.type === 'dateRange'" v-model="localModel[item.field]" style="width: 100%" />
|
||||
</a-form-item>
|
||||
</a-col>
|
||||
<!-- 自定义表单项插槽 -->
|
||||
@@ -100,7 +86,7 @@ const isUpdating = ref(false)
|
||||
|
||||
// 初始化本地模型
|
||||
const initLocalModel = () => {
|
||||
Object.keys(localModel).forEach(key => delete localModel[key])
|
||||
Object.keys(localModel).forEach((key) => delete localModel[key])
|
||||
Object.assign(localModel, props.modelValue)
|
||||
}
|
||||
|
||||
@@ -109,7 +95,7 @@ watch(
|
||||
() => props.modelValue,
|
||||
(val) => {
|
||||
if (isUpdating.value) return
|
||||
Object.keys(localModel).forEach(key => delete localModel[key])
|
||||
Object.keys(localModel).forEach((key) => delete localModel[key])
|
||||
Object.assign(localModel, val)
|
||||
},
|
||||
{ immediate: true, deep: true }
|
||||
@@ -148,5 +134,4 @@ export default {
|
||||
}
|
||||
</script>
|
||||
|
||||
<style scoped lang="less">
|
||||
</style>
|
||||
<style scoped lang="less"></style>
|
||||
|
||||
Reference in New Issue
Block a user