显示 placeholder

This commit is contained in:
TimSpan 2024-12-19 16:52:18 +08:00
parent c037a3ab53
commit 9df3582913
2 changed files with 34 additions and 31 deletions

View File

@ -47,7 +47,7 @@
v-else-if="item.type === 'select'" v-else-if="item.type === 'select'"
v-model:value="modelValue[field]" v-model:value="modelValue[field]"
style="width: 100%" style="width: 100%"
:placeholder="getPlaceholder(item)" :placeholder="item.placeholder"
v-bind="item.componentsProps" v-bind="item.componentsProps"
:allowClear="item.componentsProps?.allowClear ?? true" :allowClear="item.componentsProps?.allowClear ?? true"
:options="item.options" :options="item.options"
@ -167,8 +167,8 @@ const getResponsive = (item: FormProMaxItemProps): Grid => {
//: =formItem=label //: =formItem=label
const getPlaceholder = function (item: FormProMaxItemProps) { const getPlaceholder = function (item: FormProMaxItemProps) {
// console.log('getPlaceholder____________________________', item) // console.log('getPlaceholder____________________________', item)
console.log('getPlaceholder_______________________placeholder', item.placeholder) // console.log('getPlaceholder_______________________placeholder', item.placeholder)
console.log(item.componentsProps?.placeholder ?? item.placeholder ?? (item.type.includes('input') ? `请输入${item.label}` : `请选择${item.label}`)) // 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}`) return item.componentsProps?.placeholder ?? item.placeholder ?? (item.type.includes('input') ? `请输入${item.label}` : `请选择${item.label}`)
} }

View File

@ -17,9 +17,9 @@
</a-space> </a-space>
</template> </template>
</TableProMax> </TableProMax>
<a-modal v-model:open="visible" :title="serviceTitle" @ok="submit" @cancel="closeModal"> <!-- <a-modal v-model:open="visible" :title="serviceTitle" @ok="submit" @cancel="closeModal">
<FormProMax ref="formRef" v-model:value="formParams" :form-item-options="formItemOptions" /> <FormProMax ref="formRef" v-model:value="formParams" :form-item-options="formItemOptions" />
</a-modal> </a-modal> -->
</div> </div>
</template> </template>
@ -32,7 +32,7 @@ import { debounce } from 'lodash-es'
import FormProMax from '@/components/form/FormProMax.vue' import FormProMax from '@/components/form/FormProMax.vue'
import api from '@/axios' import api from '@/axios'
// createVNode // createVNode
import { ref, reactive, computed, onMounted } from 'vue' import { ref, reactive, computed, onMounted, createVNode } from 'vue'
import TableProMax from '@/components/table/TableProMax.vue' import TableProMax from '@/components/table/TableProMax.vue'
import { TableProMaxProps } from '@/types/components/table/index.ts' import { TableProMaxProps } from '@/types/components/table/index.ts'
import { ComponentExposed } from 'vue-component-type-helpers' import { ComponentExposed } from 'vue-component-type-helpers'
@ -42,6 +42,7 @@ import { FormProMaxItemOptions } from '@/types/components/form//index.ts'
import { FormExpose } from 'ant-design-vue/es/form/Form' import { FormExpose } from 'ant-design-vue/es/form/Form'
import { serviceProjectSaveOrUpdateParams_ } from '@/types/views/serviceManagement' import { serviceProjectSaveOrUpdateParams_ } from '@/types/views/serviceManagement'
import { showEnterprisesUnit } from './index.tsx' import { showEnterprisesUnit } from './index.tsx'
var modal: any
type _FormType = EnterprisesUnitSaveOrUpdateParams & { type _FormType = EnterprisesUnitSaveOrUpdateParams & {
contactPersonInfoName?: string contactPersonInfoName?: string
contactPersonInfoTelephone?: string contactPersonInfoTelephone?: string
@ -354,7 +355,7 @@ const netType = computed(() => {
const formParams = ref<{ const formParams = ref<{
snowFlakeId?: string snowFlakeId?: string
enterprisesUnitId: string enterprisesUnitId: string
securityUnitId: string securityUnitId: string | null
administrativeDivisionCodes?: null administrativeDivisionCodes?: null
projectManagerMiniProgramUserId?: string projectManagerMiniProgramUserId?: string
projectManagerMiniProgramUserName?: string projectManagerMiniProgramUserName?: string
@ -374,7 +375,7 @@ const formParams = ref<{
name: '', name: '',
enterprisesUnitId: '', enterprisesUnitId: '',
type: 'security', type: 'security',
securityUnitId: '', securityUnitId: null, // null placeholder
}) })
const securityUnitIdList = ref<any>([]) const securityUnitIdList = ref<any>([])
const formItemOptions = ref<FormProMaxItemOptions<serviceProjectSaveOrUpdateParams_>>({ const formItemOptions = ref<FormProMaxItemOptions<serviceProjectSaveOrUpdateParams_>>({
@ -395,9 +396,6 @@ const formItemOptions = ref<FormProMaxItemOptions<serviceProjectSaveOrUpdatePara
showSearch: true, showSearch: true,
// inputValue option option true false // inputValue option option true false
filterOption: (input: string, option: any) => { filterOption: (input: string, option: any) => {
// if (option.label.toLowerCase().includes(input?.toLowerCase())) {
// console.log(111111111111111)
// }
return option.label.toLowerCase().includes(input?.toLowerCase()) return option.label.toLowerCase().includes(input?.toLowerCase())
}, },
}, },
@ -630,7 +628,7 @@ const expandedRowRender: TableProMaxProps['expandedRowRender'] = ({ record }) =>
<a-button <a-button
class='btn-warn' class='btn-warn'
onClick={async () => { onClick={async () => {
visible.value = true // visible.value = true
serviceTitle.value = '编辑服务项目' serviceTitle.value = '编辑服务项目'
idNumberDisabled.value = record.twoType.value !== 'outsource' idNumberDisabled.value = record.twoType.value !== 'outsource'
formParams.value.securityUnitId = record.securityUnitId //id formParams.value.securityUnitId = record.securityUnitId //id
@ -649,8 +647,8 @@ const expandedRowRender: TableProMaxProps['expandedRowRender'] = ({ record }) =>
formParams.value.houseTotal = record.houseTotal // formParams.value.houseTotal = record.houseTotal //
formParams.value.staffTotal = record.staffTotal // formParams.value.staffTotal = record.staffTotal //
formParams.value.securityUserTotal = record.securityUserTotal // formParams.value.securityUserTotal = record.securityUserTotal //
{
/* Modal.confirm({ modal = Modal.confirm({
title: serviceTitle.value, title: serviceTitle.value,
icon: createVNode('div'), icon: createVNode('div'),
width: 600, width: 600,
@ -662,8 +660,7 @@ const expandedRowRender: TableProMaxProps['expandedRowRender'] = ({ record }) =>
onCancel: async () => { onCancel: async () => {
await closeModal() await closeModal()
}, },
}) */ })
}
}} }}
> >
编辑 编辑
@ -705,9 +702,10 @@ const expandedRowRender: TableProMaxProps['expandedRowRender'] = ({ record }) =>
} }
const closeModal = async () => { const closeModal = async () => {
console.log(modal)
visible.value = false visible.value = false
formParams.value = { formParams.value = {
securityUnitId: '', securityUnitId: null,
enterprisesUnitId: '', enterprisesUnitId: '',
administrativeDivisionCodes: '', administrativeDivisionCodes: '',
name: '', name: '',
@ -724,6 +722,9 @@ const closeModal = async () => {
enterprisesUnitId.value = '' enterprisesUnitId.value = ''
serviceTitle.value = '新增服务项目' serviceTitle.value = '新增服务项目'
idNumberDisabled.value = false idNumberDisabled.value = false
modal.destroy()
// console.log(modal)
Modal.destroyAll()
} }
const submit = async () => { const submit = async () => {
@ -733,6 +734,7 @@ const submit = async () => {
message.success(resp.message) message.success(resp.message)
await _tableRef.value.requestGetTableData() await _tableRef.value.requestGetTableData()
await closeModal() await closeModal()
// modal.destroy()
} }
onMounted(async () => { onMounted(async () => {
@ -740,20 +742,21 @@ onMounted(async () => {
securityUnitIdList.value = res.data securityUnitIdList.value = res.data
}) })
const addService = function (record) { const addService = function (record) {
// modal.destroy()
formParams.value.enterprisesUnitId = record.snowFlakeId //Id formParams.value.enterprisesUnitId = record.snowFlakeId //Id
visible.value = true // visible.value = true
//Modal.confirm({ modal = Modal.confirm({
// title: serviceTitle.value, title: serviceTitle.value,
// icon: createVNode('div'), icon: createVNode('div'),
// width: 600, width: 600,
// centered: true, centered: true,
// content: () => <FormProMax ref={formRef} v-model:value={formParams.value} formItemOptions={formItemOptions.value} />, content: () => <FormProMax ref={formRef} v-model:value={formParams.value} formItemOptions={formItemOptions.value} />,
// onOk: async () => { onOk: async () => {
// await submit() await submit()
// }, },
// onCancel: async () => { onCancel: async () => {
// await closeModal() await closeModal()
// }, },
//}) })
} }
</script> </script>