Merge remote-tracking branch 'origin/main'

policeManagement/src/components/form/FormProMax.vue

@@ -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%"
+            :placeholder="item.placeholder"
             v-bind="item.componentsProps"
-            :placeholder="getPlaceholder(item)"
             :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),

policeManagement/src/views/query/publicUnit.vue

@@ -17,9 +17,9 @@
         </a-space>
       </template>
     </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" />
-    </a-modal>
+    </a-modal> -->
   </div>
 </template>
 
@@ -31,7 +31,8 @@ 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'
-import { ref, reactive, computed, onMounted } from 'vue'
+// createVNode
+import { ref, reactive, computed, onMounted, createVNode } from 'vue'
 import TableProMax from '@/components/table/TableProMax.vue'
 import { TableProMaxProps } from '@/types/components/table/index.ts'
 import { ComponentExposed } from 'vue-component-type-helpers'
@@ -41,6 +42,7 @@ import { FormProMaxItemOptions } from '@/types/components/form//index.ts'
 import { FormExpose } from 'ant-design-vue/es/form/Form'
 import { serviceProjectSaveOrUpdateParams_ } from '@/types/views/serviceManagement'
 import { showEnterprisesUnit } from './index.tsx'
+var modal: any
 type _FormType = EnterprisesUnitSaveOrUpdateParams & {
   contactPersonInfoName?: string
   contactPersonInfoTelephone?: string
@@ -238,6 +240,7 @@ const saveOrUpdateEnterprisesUnit = (params: _FormType, callback: Function) => {
       type: 'select',
       label: '单位类型',
       required: true,
+      placeholder: '请选择单位类型',
       // @ts-ignore
       options: dictSelectNodes('EnterprisesUnitType'),
     },
@@ -352,7 +355,7 @@ const netType = computed(() => {
 const formParams = ref<{
   snowFlakeId?: string
   enterprisesUnitId: string
-  securityUnitId: string
+  securityUnitId: string | null
   administrativeDivisionCodes?: null
   projectManagerMiniProgramUserId?: string
   projectManagerMiniProgramUserName?: string
@@ -372,7 +375,7 @@ const formParams = ref<{
   name: '',
   enterprisesUnitId: '',
   type: 'security',
-  securityUnitId: '',
+  securityUnitId: null, // 初始值得设置为null，不然 placeholder 显示不出来
 })
 const securityUnitIdList = ref<any>([])
 const formItemOptions = ref<FormProMaxItemOptions<serviceProjectSaveOrUpdateParams_>>({
@@ -387,6 +390,15 @@ 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) => {
+        return option.label.toLowerCase().includes(input?.toLowerCase())
+      },
+    },
   },
   type: {
     type: 'radioGroup',
@@ -616,7 +628,7 @@ const expandedRowRender: TableProMaxProps['expandedRowRender'] = ({ record }) =>
             <a-button
               class='btn-warn'
               onClick={async () => {
-                visible.value = true
+                // visible.value = true
                 serviceTitle.value = '编辑服务项目'
                 idNumberDisabled.value = record.twoType.value !== 'outsource'
                 formParams.value.securityUnitId = record.securityUnitId //企事业单位id
@@ -635,6 +647,20 @@ const expandedRowRender: TableProMaxProps['expandedRowRender'] = ({ record }) =>
                 formParams.value.houseTotal = record.houseTotal //户数
                 formParams.value.staffTotal = record.staffTotal //工作人员数量
                 formParams.value.securityUserTotal = record.securityUserTotal //保安人员数量
+
+                modal = 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()
+                  },
+                })
               }}
             >
               编辑
@@ -676,9 +702,10 @@ const expandedRowRender: TableProMaxProps['expandedRowRender'] = ({ record }) =>
 }
 
 const closeModal = async () => {
+  console.log(modal)
   visible.value = false
   formParams.value = {
-    securityUnitId: '',
+    securityUnitId: null,
     enterprisesUnitId: '',
     administrativeDivisionCodes: '',
     name: '',
@@ -695,6 +722,9 @@ const closeModal = async () => {
   enterprisesUnitId.value = ''
   serviceTitle.value = '新增服务项目'
   idNumberDisabled.value = false
+  modal.destroy()
+  // console.log(modal)
+  Modal.destroyAll()
 }
 
 const submit = async () => {
@@ -704,6 +734,7 @@ const submit = async () => {
   message.success(resp.message)
   await _tableRef.value.requestGetTableData()
   await closeModal()
+  // modal.destroy()
 }
 
 onMounted(async () => {
@@ -711,7 +742,21 @@ onMounted(async () => {
   securityUnitIdList.value = res.data
 })
 const addService = function (record) {
+  // modal.destroy()
   formParams.value.enterprisesUnitId = record.snowFlakeId //企事业单位Id
-  visible.value = true
+  // visible.value = true
+  modal = 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>