|
|
|
@ -1,6 +1,6 @@ |
|
|
|
<script lang="tsx"> |
|
|
|
import { computed, defineComponent, onMounted, PropType, ref, unref, watch } from 'vue' |
|
|
|
import { ElCol, ElForm, ElFormItem, ElRow, ElTooltip } from 'element-plus' |
|
|
|
import { ElButton, ElCol, ElForm, ElFormItem, ElInput, ElRow, ElTooltip } from 'element-plus' |
|
|
|
import { componentMap } from './componentMap' |
|
|
|
import { propTypes } from '@/utils/propTypes' |
|
|
|
import { getSlot } from '@/utils/tsxHelper' |
|
|
|
@ -21,6 +21,7 @@ import { set } from 'lodash-es' |
|
|
|
import { FormProps } from './types' |
|
|
|
import { Icon } from '@/components/Icon' |
|
|
|
import { FormSchema, FormSetPropsType } from '@/types/form' |
|
|
|
import { Search } from '@element-plus/icons-vue' |
|
|
|
|
|
|
|
const { getPrefixCls } = useDesign() |
|
|
|
|
|
|
|
@ -53,7 +54,7 @@ export default defineComponent({ |
|
|
|
vLoading: propTypes.bool.def(false), |
|
|
|
labelPosition: propTypes.string.def('left'), |
|
|
|
}, |
|
|
|
emits: ['register'], |
|
|
|
emits: ['register','opensearchTable'], |
|
|
|
setup(props, { slots, expose, emit }) { |
|
|
|
// element form 实例 |
|
|
|
const elFormRef = ref<ComponentRef<typeof ElForm>>() |
|
|
|
@ -119,6 +120,11 @@ export default defineComponent({ |
|
|
|
return unref(elFormRef) as ComponentRef<typeof ElForm> |
|
|
|
} |
|
|
|
|
|
|
|
const opensearchTable = (field, searchField,searchTitle,searchAllSchemas, searchPage) => { |
|
|
|
console.log(124, field) |
|
|
|
emit('opensearchTable',field, searchField, searchTitle, searchAllSchemas, searchPage) |
|
|
|
} |
|
|
|
|
|
|
|
expose({ |
|
|
|
setValues, |
|
|
|
formModel, |
|
|
|
@ -126,7 +132,8 @@ export default defineComponent({ |
|
|
|
delSchema, |
|
|
|
addSchema, |
|
|
|
setSchema, |
|
|
|
getElFormRef |
|
|
|
getElFormRef, |
|
|
|
opensearchTable |
|
|
|
}) |
|
|
|
|
|
|
|
// 监听表单结构化数组，重新生成formModel |
|
|
|
@ -213,6 +220,27 @@ export default defineComponent({ |
|
|
|
) |
|
|
|
} |
|
|
|
} |
|
|
|
|
|
|
|
// 如果有 isSearchList: true ，使用查询弹层列表 |
|
|
|
const formItemSlotsSearchList: Recordable = setFormItemSlots(slots, item.field) |
|
|
|
if (item?.componentProps?.isSearchList) { |
|
|
|
formItemSlotsSearchList[item.field] = () => { |
|
|
|
return ( |
|
|
|
<> |
|
|
|
<ElInput v-model={formModel.value[item.field]} placeholder={item?.componentProps?.searchListPlaceholder} onClick={()=>{ |
|
|
|
opensearchTable( |
|
|
|
item.field, item?.componentProps?.searchField, |
|
|
|
item?.componentProps?.searchTitle, |
|
|
|
item?.componentProps?.searchAllSchemas, |
|
|
|
item?.componentProps?.searchPage |
|
|
|
)}}> |
|
|
|
{/* <template v-slot:append >.com</template> */} |
|
|
|
</ElInput> |
|
|
|
{/* <ElButton >ddd</ElButton> */} |
|
|
|
</> |
|
|
|
) |
|
|
|
} |
|
|
|
} |
|
|
|
return ( |
|
|
|
<ElFormItem {...(item.formItemProps || {})} prop={item.field} label={item.label || ''}> |
|
|
|
{{ |
|
|
|
@ -221,26 +249,27 @@ export default defineComponent({ |
|
|
|
const Com = componentMap[item.component as string] as ReturnType< |
|
|
|
typeof defineComponent |
|
|
|
> |
|
|
|
|
|
|
|
const { autoSetPlaceholder } = unref(getProps) |
|
|
|
|
|
|
|
return slots[item.field] ? ( |
|
|
|
getSlot(slots, item.field, formModel.value) |
|
|
|
) : ( |
|
|
|
<Com |
|
|
|
vModel={formModel.value[item.field]} |
|
|
|
{...(autoSetPlaceholder && setTextPlaceholder(item))} |
|
|
|
{...setComponentProps(item)} |
|
|
|
style={item.componentProps?.style} |
|
|
|
{...(notRenderOptions.includes(item?.component as string) && |
|
|
|
item?.componentProps?.options |
|
|
|
? { options: item?.componentProps?.options || [] } |
|
|
|
: {})} |
|
|
|
> |
|
|
|
{{ ...slotsMap }} |
|
|
|
</Com> |
|
|
|
) |
|
|
|
} |
|
|
|
// 查询弹层列表定义的插槽 |
|
|
|
return formItemSlotsSearchList[item.field] ? |
|
|
|
(getSlot(formItemSlotsSearchList, item.field, formModel.value)) : |
|
|
|
slots[item.field] ? ( |
|
|
|
getSlot(slots, item.field, formModel.value) |
|
|
|
) : ( |
|
|
|
<Com |
|
|
|
vModel={formModel.value[item.field]} |
|
|
|
{...(autoSetPlaceholder && setTextPlaceholder(item))} |
|
|
|
{...setComponentProps(item)} |
|
|
|
style={item.componentProps?.style} |
|
|
|
{...(notRenderOptions.includes(item?.component as string) && |
|
|
|
item?.componentProps?.options |
|
|
|
? { options: item?.componentProps?.options || [] } |
|
|
|
: {})} |
|
|
|
> |
|
|
|
{{ ...slotsMap }} |
|
|
|
</Com> |
|
|
|
) |
|
|
|
}, |
|
|
|
}} |
|
|
|
</ElFormItem> |
|
|
|
) |
|
|
|
@ -296,6 +325,7 @@ export default defineComponent({ |
|
|
|
} |
|
|
|
}} |
|
|
|
</ElForm> |
|
|
|
|
|
|
|
) |
|
|
|
} |
|
|
|
}) |
|
|
|
|
