加了个搜索

This commit is contained in:
TimSpan 2024-12-19 16:23:17 +08:00
parent 144bca851a
commit 7c03401de9
2 changed files with 53 additions and 2 deletions

View File

@ -40,12 +40,15 @@
/>
<a-radio-group v-else-if="item.type === 'radioGroup'" v-model:value="modelValue[field]" style="width: 100%" v-bind="item.componentsProps" :options="item.options" />
<a-checkbox-group v-else-if="item.type === 'checkboxGroup'" v-model:value="modelValue[field]" style="width: 100%" v-bind="item.componentsProps" :options="item.options" />
<!-- :show-search="item.showSearch" -->
<!-- :placeholder="getPlaceholder(item)" -->
<!-- :placeholder="item.placeholder" -->
<a-select
v-else-if="item.type === 'select'"
v-model:value="modelValue[field]"
style="width: 100%"
v-bind="item.componentsProps"
:placeholder="getPlaceholder(item)"
v-bind="item.componentsProps"
:allowClear="item.componentsProps?.allowClear ?? true"
:options="item.options"
/>
@ -162,7 +165,13 @@ const getResponsive = (item: FormProMaxItemProps): Grid => {
}
//: =formItem=label
const getPlaceholder = (item: FormProMaxItemProps) => item.componentsProps?.placeholder ?? item.placeholder ?? (item.type.includes('input') ? `请输入${item.label}` : `请选择${item.label}`)
const getPlaceholder = function (item: FormProMaxItemProps) {
// console.log('getPlaceholder____________________________', item)
console.log('getPlaceholder_______________________placeholder', item.placeholder)
console.log(item.componentsProps?.placeholder ?? item.placeholder ?? (item.type.includes('input') ? `请输入${item.label}` : `请选择${item.label}`))
return item.componentsProps?.placeholder ?? item.placeholder ?? (item.type.includes('input') ? `请输入${item.label}` : `请选择${item.label}`)
}
defineExpose<FormExpose>({
validate: (nameList, options) => formProMaxRef.value?.validate(nameList, options),

View File

@ -31,6 +31,7 @@ import { AutoComplete, Button, Input, message, Modal, Space } from 'ant-design-v
import { debounce } from 'lodash-es'
import FormProMax from '@/components/form/FormProMax.vue'
import api from '@/axios'
// createVNode
import { ref, reactive, computed, onMounted } from 'vue'
import TableProMax from '@/components/table/TableProMax.vue'
import { TableProMaxProps } from '@/types/components/table/index.ts'
@ -238,6 +239,7 @@ const saveOrUpdateEnterprisesUnit = (params: _FormType, callback: Function) => {
type: 'select',
label: '单位类型',
required: true,
placeholder: '请选择单位类型',
// @ts-ignore
options: dictSelectNodes('EnterprisesUnitType'),
},
@ -387,6 +389,18 @@ const formItemOptions = ref<FormProMaxItemOptions<serviceProjectSaveOrUpdatePara
label: '保安单位',
required: true,
options: securityUnitIdList,
placeholder: '请选择或搜索保安单位',
componentsProps: {
// placeholder: '',
showSearch: true,
// inputValue option option true false
filterOption: (input: string, option: any) => {
// if (option.label.toLowerCase().includes(input?.toLowerCase())) {
// console.log(111111111111111)
// }
return option.label.toLowerCase().includes(input?.toLowerCase())
},
},
},
type: {
type: 'radioGroup',
@ -635,6 +649,21 @@ const expandedRowRender: TableProMaxProps['expandedRowRender'] = ({ record }) =>
formParams.value.houseTotal = record.houseTotal //
formParams.value.staffTotal = record.staffTotal //
formParams.value.securityUserTotal = record.securityUserTotal //
{
/* Modal.confirm({
title: serviceTitle.value,
icon: createVNode('div'),
width: 600,
centered: true,
content: () => <FormProMax ref={formRef} v-model:value={formParams.value} formItemOptions={formItemOptions.value} />,
onOk: async () => {
await submit()
},
onCancel: async () => {
await closeModal()
},
}) */
}
}}
>
编辑
@ -713,5 +742,18 @@ onMounted(async () => {
const addService = function (record) {
formParams.value.enterprisesUnitId = record.snowFlakeId //Id
visible.value = true
//Modal.confirm({
// title: serviceTitle.value,
// icon: createVNode('div'),
// width: 600,
// centered: true,
// content: () => <FormProMax ref={formRef} v-model:value={formParams.value} formItemOptions={formItemOptions.value} />,
// onOk: async () => {
// await submit()
// },
// onCancel: async () => {
// await closeModal()
// },
//})
}
</script>