af-mobile-client-vue3 1.3.30 → 1.3.31

package/src/components/data/XForm/index.vue

@@ -1,659 +1,659 @@
-<script setup lang="ts">
-import type { FormInstance } from 'vant'
-import XFormItem from '@af-mobile-client-vue3/components/data/XFormItem/index.vue'
-import XOlMap from '@af-mobile-client-vue3/components/data/XOlMap/index.vue'
-import { formatDate } from '@af-mobile-client-vue3/hooks/useCommon'
-import { addOrModifyEntity, getConfigByName, runLogic } from '@af-mobile-client-vue3/services/api/common'
-import { useUserStore } from '@af-mobile-client-vue3/stores'
-
-import {
-  showFailToast,
-  showSuccessToast,
-  Button as VanButton,
-  CellGroup as VanCellGroup,
-  Form as VanForm,
-} from 'vant'
-import { computed, defineEmits, defineProps, inject, nextTick, onBeforeMount, reactive, ref, watch } from 'vue'
-
-interface FormItem {
-  addOrEdit: string
-  isOnlyAddOrEdit?: boolean
-  type?: string
-  model?: string
-  name?: string
-  rule?: {
-    type: string
-  }
-}
-
-interface SilenceAddFormItem extends FormItem {
-  silencePurpose: string
-  silenceSource?: string
-}
-
-interface GroupFormItems {
-  btnName?: string
-  formJson: any[] // 根据实际类型调整
-  showSubmitBtn?: boolean
-  groupName?: string
-  tableName?: string
-  paramLogicName?: string
-  isGroupForm?: boolean
-}
-
-interface InitParams {
-  formItems?: GroupFormItems
-  formData?: object
-  getDataParams?: object
-}
-
-const props = withDefaults(defineProps<{
-  configName?: string
-  groupTitle?: string
-  groupFormItems?: GroupFormItems
-  serviceName?: string
-  formData?: object
-  formName?: string
-  mode?: string
-  submitButton?: boolean
-  isHandleFormKey?: boolean
-  paramLogicNameParam?: any
-  isGroupForm?: boolean
-}>(), {
-  configName: undefined,
-  groupTitle: undefined,
-  groupFormItems: null,
-  serviceName: undefined,
-  formData: null,
-  formName: 'default',
-  mode: '查询',
-  submitButton: true,
-  isHandleFormKey: true,
-  paramLogicNameParam: {},
-  isGroupForm: false,
-})
-
-const emits = defineEmits(['onSubmit', 'xFormItemEmitFunc'])
-const userStore = useUserStore()
-
-// inject
-const formDataChange = inject('formDataChange', null)
-
-// 核心状态
-const xFormRef = ref<FormInstance>()
-const loaded = ref(false)
-const form = ref({})
-const rules = reactive({})
-const myGetDataParams = ref({})
-
-// 配置相关状态
-const formConfig = ref<GroupFormItems | null>(null)
-const formGroupName = ref<string>('default')
-const myServiceName = ref('')
-const tableName = ref('')
-
-// 计算属性
-const realJsonData = computed(() => {
-  const sourceFormItems = formConfig.value?.formJson
-  if (!sourceFormItems)
-    return []
-
-  return sourceFormItems.filter((item) => {
-    return item.addOrEdit !== 'no'
-  })
-})
-
-// 过滤出用于静默新增场景的表单项
-const silenceAddJsonData = computed(() => {
-  return realJsonData.value.filter((item) => {
-    return item.addOrEdit === 'silenceAdd'
-  }) as SilenceAddFormItem[]
-})
-
-const resolvedSubmitButton = computed(() => {
-  if (props.configName && formConfig.value?.showSubmitBtn !== undefined) {
-    return formConfig.value.showSubmitBtn
-  }
-  return props.submitButton
-})
-
-// 地图预览相关
-const previewMapRef = ref(null)
-const previewLonLatKey = computed(() => {
-  const item = realJsonData.value.find(i => i.type === 'addressSearch')
-  return item ? `${item.model}_lon_lat` : null
-})
-
-const previewMapPoint = computed(() => {
-  const val = form.value[previewLonLatKey.value]
-  if (val && typeof val === 'string' && val.includes(',')) {
-    const [lon, lat] = val.split(',').map(Number)
-    if (!Number.isNaN(lon) && !Number.isNaN(lat)) {
-      return [lon, lat]
-    }
-  }
-  return null
-})
-
-// 地图初始化逻辑
-const previewMapInited = ref(false)
-watch(previewMapPoint, async (val) => {
-  await nextTick()
-  if (val && previewMapRef.value) {
-    if (!previewMapInited.value) {
-      await previewMapRef.value.init({ center: val, zoom: 16, isPreview: true })
-      previewMapInited.value = true
-    }
-    previewMapRef.value.setCenter(val, true)
-    previewMapRef.value.updateLocationMarker(val)
-  }
-}, { immediate: true })
-
-// 统一的初始化函数 - 仅在组件挂载时调用
-async function initializeForm() {
-  loaded.value = false
-
-  try {
-    if (props.configName) {
-      await loadFormConfig()
-    }
-    else if (props.groupFormItems) {
-      await initWithGroupFormItems()
-    }
-    else {
-      console.warn('未提供配置名称或表单配置，等待 init 函数调用')
-      resetForm()
-    }
-  }
-  catch (error) {
-    console.error('表单初始化失败:', error)
-    resetForm()
-  }
-  finally {
-    loaded.value = true
-  }
-}
-
-// 加载配置的方式初始化
-async function loadFormConfig(): Promise<void> {
-  return new Promise((resolve, reject) => {
-    getConfigByName(props.configName!, (result) => {
-      if (result) {
-        setupFormConfig(result)
-        resolve()
-      }
-      else {
-        console.warn(`配置 '${props.configName}' 不存在`)
-        reject(new Error(`配置 '${props.configName}' 不存在`))
-      }
-    }, props.serviceName)
-  })
-}
-
-// 直接使用 groupFormItems 初始化
-async function initWithGroupFormItems() {
-  if (!props.groupFormItems) {
-    throw new Error('groupFormItems 不能为空')
-  }
-
-  setupFormConfig(props.groupFormItems)
-
-  // 设置表名
-  if (props.groupFormItems.tableName) {
-    tableName.value = props.groupFormItems.tableName.split(' ')[0] || ''
-  }
-}
-
-// 设置表单配置
-function setupFormConfig(config: GroupFormItems) {
-  loadParamLogicNameData(config.paramLogicName)
-  formConfig.value = config
-  myServiceName.value = props.serviceName || undefined
-  formGroupName.value = config.groupName || 'default'
-  form.value = props.formData || {}
-  // 清理并重新设置验证规则
-  setupValidationRules()
-}
-
-// 设置验证规则
-function setupValidationRules() {
-  // 清理现有规则
-  Object.keys(rules).forEach(key => delete rules[key])
-
-  // 为每个表单项设置规则
-  for (const item of realJsonData.value) {
-    if (item.rule) {
-      setFormRule(item)
-    }
-  }
-}
-
-// 设置单个表单项的验证规则
-function setFormRule(item: FormItem) {
-  if (!item.model || !item.rule)
-    return
-
-  rules[item.model] = []
-  let defaultValue: any
-  let message: string
-
-  switch (item.rule.type) {
-    case 'number':
-      message = '数字'
-      defaultValue = 0
-      break
-    case 'integer':
-      message = '整数'
-      defaultValue = 0
-      break
-    case 'float':
-      message = '小数'
-      defaultValue = 0.0
-      break
-    case 'string':
-      message = '字符串'
-      defaultValue = ''
-      break
-    default:
-      return
-  }
-
-  rules[item.model].push({
-    type: item.rule.type,
-    message: `${item.name || item.model}必须为${message}`,
-    transform: (value: any) => {
-      if (value && value.length !== 0) {
-        return Number(value)
-      }
-      else {
-        return defaultValue
-      }
-    },
-    trigger: 'blur',
-  })
-}
-
-// 重置表单状态
-function resetForm() {
-  formConfig.value = null
-  formGroupName.value = 'default'
-  myServiceName.value = ''
-  tableName.value = ''
-  form.value = {}
-  Object.keys(rules).forEach(key => delete rules[key])
-  myGetDataParams.value = {}
-}
-
-// 监听 formData 变化
-watch(() => props.formData, (newVal) => {
-  if (newVal) {
-    Object.assign(form, newVal)
-  }
-})
-
-watch(form, (newVal) => {
-  if (typeof formDataChange === 'function') {
-    formDataChange(newVal)
-  }
-}, { deep: true })
-
-// 组件挂载时初始化
-onBeforeMount(() => {
-  initializeForm()
-})
-
-// 支持函数调用方式初始化
-function init(params: InitParams) {
-  const {
-    formItems,
-    formData = {},
-    getDataParams = {},
-  } = params
-
-  // 重置状态
-  loaded.value = false
-
-  try {
-    if (props.configName) {
-      // 通过 props 中的配置名称初始化
-      loadFormConfig()
-    }
-    else if (formItems) {
-      // 直接使用传入的配置初始化
-      setupFormConfig(formItems)
-      form.value = formData || props.formData || {}
-      myGetDataParams.value = getDataParams
-
-      // 设置表名
-      if (formItems.tableName) {
-        tableName.value = formItems.tableName.split(' ')[0] || ''
-      }
-    }
-    else {
-      console.warn('init 函数调用时既没有 props.configName 也没有 formItems')
-      resetForm()
-    }
-  }
-  catch (error) {
-    console.error('init 函数初始化失败:', error)
-    resetForm()
-  }
-  finally {
-    loaded.value = true
-  }
-}
-
-function loadParamLogicNameData(paramLogicName) {
-  // 如果有 paramLogicName，自动请求并赋值
-  if (paramLogicName && (!props.formData || (props.formData && Object.keys(props.formData).length === 0))) {
-    let logicParam = props?.paramLogicNameParam || {}
-    if (typeof logicParam === 'string') {
-      try {
-        logicParam = JSON.parse(logicParam)
-      }
-      catch {
-        logicParam = { value: logicParam }
-      }
-    }
-    logicParam = {
-      ...logicParam,
-      currUserName: userStore.getUserInfo().name,
-      currUserId: userStore.getUserInfo().id,
-      orgId: userStore.getUserInfo().orgid,
-    }
-    runLogic(paramLogicName, logicParam || {}, props.serviceName).then((data: any) => {
-      if (data) {
-        form.value = data
-      }
-    })
-  }
-}
-
-function setForm(obj: object) {
-  Object.assign(form.value, obj)
-}
-
-// 获取表单字段实际值
-function getRealKey(key: string, mustHandleKey = false) {
-  if (key === 'selected_id')
-    return key
-  if (props.isHandleFormKey || mustHandleKey) {
-    return key.substring(key.indexOf('_') + 1)
-  }
-  else {
-    return key
-  }
-}
-
-async function asyncSubmit() {
-  return new Promise((resolve, reject) => {
-    validate().then(async () => {
-      const cleanedForm = prepareForm()
-      await appendSilenceAddFields(cleanedForm)
-      const realForm = handleFormKeys(cleanedForm)
-      resolve({
-        realForm,
-        mode: props.mode,
-        serviceName: props.serviceName,
-        currUserName: userStore.getUserInfo().name,
-        currUserId: userStore.getUserInfo().id,
-        orgId: userStore.getUserInfo().orgid,
-      })
-    }).catch((error) => {
-      reject(error)
-    })
-  })
-}
-
-function handleFormKeys(form: any, mustHandleKey = false) {
-  const realForm: any = {}
-  for (const key of Object.keys(form)) {
-    const value = form[key]
-    const extraFormKeyTagIndex = key.indexOf('@')
-    if (extraFormKeyTagIndex !== -1) {
-      const extraFormKey = key.substring(0, extraFormKeyTagIndex)
-      const realKey = key.substring(extraFormKeyTagIndex + 1)
-      if (!realForm[extraFormKey]) {
-        realForm[extraFormKey] = {}
-      }
-      realForm[extraFormKey][realKey] = value
-    }
-    else {
-      const realKey = props.isHandleFormKey || mustHandleKey ? getRealKey(key, mustHandleKey) : key
-      // 如果发生重名，不覆盖，把key的别名带上
-      if (realForm[realKey]) {
-        realForm[key] = value
-      }
-      else {
-        realForm[realKey] = value
-      }
-    }
-  }
-  return realForm
-}
-
-async function appendSilenceAddFields(form: any) {
-  if (props.mode === '新增') {
-    for (const item of silenceAddJsonData.value) {
-      switch (item.silencePurpose) {
-        case 'createTime':
-          form[item.model] = formatDate(new Date())
-          break
-        case 'operator':
-          form[item.model] = userStore.getUserInfo().name
-          break
-        case 'operatorId':
-          form[item.model] = userStore.getUserInfo().id
-          break
-        case 'orgId':
-          form[item.model] = userStore.getUserInfo().orgid
-          break
-        case 'orgName':
-          form[item.model] = userStore.getUserInfo().orgs
-          break
-        case 'depId':
-          form[item.model] = userStore.getUserInfo().depids
-          break
-        case 'depName':
-          form[item.model] = userStore.getUserInfo().deps
-          break
-      }
-    }
-    for (const item of silenceAddJsonData.value.filter(item => item.silencePurpose === 'customize')) {
-      const result: any = await runLogic(item.silenceSource!, form, props.serviceName)
-      if (result) {
-        const keys = Object.keys(result)
-        if (keys.length === 1 && keys[0] === 'value') {
-          form[item.model] = result.value
-        }
-        else {
-          form[item.model] = result
-        }
-      }
-      else {
-        form[item.model] = result
-      }
-    }
-  }
-}
-
-function prepareForm() {
-  const formObj = { ...form.value }
-  const cleanedForm: any = {}
-
-  for (const key of Object.keys(formObj)) {
-    const value = formObj[key]
-
-    // 跳过无效值
-    if (value === null || value === undefined || value === '') {
-      continue
-    }
-
-    // 处理数组
-    if (Array.isArray(value)) {
-      // 过滤掉空字符串、null、undefined
-      const filteredArray = value.filter(item =>
-        item !== null && item !== undefined && item !== '',
-      )
-      // 只有当数组不为空时才添加
-      if (filteredArray.length > 0) {
-        cleanedForm[key] = filteredArray
-      }
-      continue
-    }
-
-    // 处理对象
-    if (typeof value === 'object' && value !== null) {
-      // 检查对象是否为空
-      const objectKeys = Object.keys(value)
-      if (objectKeys.length === 0) {
-        continue
-      }
-
-      // 递归清理对象内部
-      const cleanedObject: any = {}
-      let hasValidValue = false
-
-      for (const objKey of objectKeys) {
-        const objValue = value[objKey]
-        if (objValue !== null && objValue !== undefined && objValue !== '') {
-          cleanedObject[objKey] = objValue
-          hasValidValue = true
-        }
-      }
-
-      // 只有当对象有有效值时才添加
-      if (hasValidValue) {
-        cleanedForm[key] = cleanedObject
-      }
-      continue
-    }
-
-    // 处理基本类型
-    if (value !== null && value !== undefined && value !== '') {
-      cleanedForm[key] = value
-    }
-  }
-
-  return cleanedForm
-}
-
-function getFormData() {
-  return prepareForm()
-}
-
-async function onSubmit() {
-  await validate()
-  // 清理表单数据
-  const cleanedForm = prepareForm()
-  if (!props.configName && props.groupFormItems) {
-    // 只有单表才可以成功，多表关联或者自定义sql不行
-    await appendSilenceAddFields(cleanedForm)
-    const realForm = handleFormKeys(cleanedForm)
-
-    try {
-      addOrModifyEntity(realForm, tableName.value, props.serviceName || import.meta.env.VITE_APP_SYSTEM_NAME).then(() => {
-        showSuccessToast('提交成功!！')
-      })
-    }
-    catch (error) {
-      showFailToast('提交失败!！')
-    }
-    finally {
-      setTimeout(() => {
-        history.back()
-      }, 1000)
-    }
-  }
-  else {
-    // 使用清理后的数据
-    emits('onSubmit', cleanedForm)
-  }
-}
-async function validate() {
-  await xFormRef.value?.validate()
-}
-function emitFunc(func: any, data: any, value: any) {
-  emits(func, data, value)
-  emits('xFormItemEmitFunc', func, data, value)
-}
-
-defineExpose({ init, form, formGroupName, validate, asyncSubmit, setForm, getFormData })
-</script>
-
-<template>
-  <VanForm v-if="loaded" ref="xFormRef" class="x-form-container" :class="{ 'use-full-height': !props.isGroupForm }" @submit="onSubmit">
-    <div class="form-fields-scrollable">
-      <VanCellGroup :title="groupTitle">
-        <XFormItem
-          v-for="(item, index) in realJsonData"
-          :key="index"
-          v-model="form[item.model]"
-          :mode="props.mode"
-          :form="form"
-          :attr="item"
-          :rules="rules"
-          :service-name="myServiceName"
-          :get-data-params="myGetDataParams"
-          @set-form="setForm"
-          @x-form-item-emit-func="emitFunc"
-        />
-        <slot name="extraFormItem" />
-      </VanCellGroup>
-      <slot name="extraCellGroup" />
-      <!-- 地图预览，统一放在表单项下方，只在有经纬度时显示 -->
-      <div v-if="previewMapPoint" style="height: 200px; margin-top: 12px; position: relative;">
-        <XOlMap
-          ref="previewMapRef"
-          :center="previewMapPoint"
-          :style="{ height: '100%' }"
-        />
-        <div class="map-mask" />
-      </div>
-    </div>
-    <div v-if="resolvedSubmitButton && props.mode !== '预览'" class="form-footer-fixed">
-      <VanButton class="action-btn" round block type="primary" native-type="submit">
-        {{ props.groupFormItems?.btnName ? props.groupFormItems.btnName : '提交' }}
-      </VanButton>
-      <slot />
-    </div>
-    <slot name="extraActionSpace" />
-  </VanForm>
-</template>
-
-<style scoped>
-.use-full-height {
-  height: calc(100vh - var(--van-nav-bar-height) - 20px);
-}
-
-.x-form-container {
-  display: flex;
-  flex-direction: column;
-  max-height: 100vh;
-  overflow: hidden;
-}
-
-.form-fields-scrollable {
-  flex: 1;
-  overflow-y: auto;
-  min-height: 0;
-}
-
-.form-footer-fixed {
-  margin: 16px;
-  flex-shrink: 0;
-  .action-btn {
-    border-radius: 10px;
-  }
-}
-.map-mask {
-  position: absolute;
-  left: 0;
-  top: 0;
-  width: 100%;
-  height: 100%;
-  pointer-events: all;
-  background: transparent;
-  z-index: 10;
-}
-</style>
+<script setup lang="ts">
+import type { FormInstance } from 'vant'
+import XFormItem from '@af-mobile-client-vue3/components/data/XFormItem/index.vue'
+import XOlMap from '@af-mobile-client-vue3/components/data/XOlMap/index.vue'
+import { formatDate } from '@af-mobile-client-vue3/hooks/useCommon'
+import { addOrModifyEntity, getConfigByName, runLogic } from '@af-mobile-client-vue3/services/api/common'
+import { useUserStore } from '@af-mobile-client-vue3/stores'
+
+import {
+  showFailToast,
+  showSuccessToast,
+  Button as VanButton,
+  CellGroup as VanCellGroup,
+  Form as VanForm,
+} from 'vant'
+import { computed, defineEmits, defineProps, inject, nextTick, onBeforeMount, reactive, ref, watch } from 'vue'
+
+interface FormItem {
+  addOrEdit: string
+  isOnlyAddOrEdit?: boolean
+  type?: string
+  model?: string
+  name?: string
+  rule?: {
+    type: string
+  }
+}
+
+interface SilenceAddFormItem extends FormItem {
+  silencePurpose: string
+  silenceSource?: string
+}
+
+interface GroupFormItems {
+  btnName?: string
+  formJson: any[] // 根据实际类型调整
+  showSubmitBtn?: boolean
+  groupName?: string
+  tableName?: string
+  paramLogicName?: string
+  isGroupForm?: boolean
+}
+
+interface InitParams {
+  formItems?: GroupFormItems
+  formData?: object
+  getDataParams?: object
+}
+
+const props = withDefaults(defineProps<{
+  configName?: string
+  groupTitle?: string
+  groupFormItems?: GroupFormItems
+  serviceName?: string
+  formData?: object
+  formName?: string
+  mode?: string
+  submitButton?: boolean
+  isHandleFormKey?: boolean
+  paramLogicNameParam?: any
+  isGroupForm?: boolean
+}>(), {
+  configName: undefined,
+  groupTitle: undefined,
+  groupFormItems: null,
+  serviceName: undefined,
+  formData: null,
+  formName: 'default',
+  mode: '查询',
+  submitButton: true,
+  isHandleFormKey: true,
+  paramLogicNameParam: {},
+  isGroupForm: false,
+})
+
+const emits = defineEmits(['onSubmit', 'xFormItemEmitFunc'])
+const userStore = useUserStore()
+
+// inject
+const formDataChange = inject('formDataChange', null)
+
+// 核心状态
+const xFormRef = ref<FormInstance>()
+const loaded = ref(false)
+const form = ref({})
+const rules = reactive({})
+const myGetDataParams = ref({})
+
+// 配置相关状态
+const formConfig = ref<GroupFormItems | null>(null)
+const formGroupName = ref<string>('default')
+const myServiceName = ref('')
+const tableName = ref('')
+
+// 计算属性
+const realJsonData = computed(() => {
+  const sourceFormItems = formConfig.value?.formJson
+  if (!sourceFormItems)
+    return []
+
+  return sourceFormItems.filter((item) => {
+    return item.addOrEdit !== 'no'
+  })
+})
+
+// 过滤出用于静默新增场景的表单项
+const silenceAddJsonData = computed(() => {
+  return realJsonData.value.filter((item) => {
+    return item.addOrEdit === 'silenceAdd'
+  }) as SilenceAddFormItem[]
+})
+
+const resolvedSubmitButton = computed(() => {
+  if (props.configName && formConfig.value?.showSubmitBtn !== undefined) {
+    return formConfig.value.showSubmitBtn
+  }
+  return props.submitButton
+})
+
+// 地图预览相关
+const previewMapRef = ref(null)
+const previewLonLatKey = computed(() => {
+  const item = realJsonData.value.find(i => i.type === 'addressSearch')
+  return item ? `${item.model}_lon_lat` : null
+})
+
+const previewMapPoint = computed(() => {
+  const val = form.value[previewLonLatKey.value]
+  if (val && typeof val === 'string' && val.includes(',')) {
+    const [lon, lat] = val.split(',').map(Number)
+    if (!Number.isNaN(lon) && !Number.isNaN(lat)) {
+      return [lon, lat]
+    }
+  }
+  return null
+})
+
+// 地图初始化逻辑
+const previewMapInited = ref(false)
+watch(previewMapPoint, async (val) => {
+  await nextTick()
+  if (val && previewMapRef.value) {
+    if (!previewMapInited.value) {
+      await previewMapRef.value.init({ center: val, zoom: 16, isPreview: true })
+      previewMapInited.value = true
+    }
+    previewMapRef.value.setCenter(val, true)
+    previewMapRef.value.updateLocationMarker(val)
+  }
+}, { immediate: true })
+
+// 统一的初始化函数 - 仅在组件挂载时调用
+async function initializeForm() {
+  loaded.value = false
+
+  try {
+    if (props.configName) {
+      await loadFormConfig()
+    }
+    else if (props.groupFormItems) {
+      await initWithGroupFormItems()
+    }
+    else {
+      console.warn('未提供配置名称或表单配置，等待 init 函数调用')
+      resetForm()
+    }
+  }
+  catch (error) {
+    console.error('表单初始化失败:', error)
+    resetForm()
+  }
+  finally {
+    loaded.value = true
+  }
+}
+
+// 加载配置的方式初始化
+async function loadFormConfig(): Promise<void> {
+  return new Promise((resolve, reject) => {
+    getConfigByName(props.configName!, (result) => {
+      if (result) {
+        setupFormConfig(result)
+        resolve()
+      }
+      else {
+        console.warn(`配置 '${props.configName}' 不存在`)
+        reject(new Error(`配置 '${props.configName}' 不存在`))
+      }
+    }, props.serviceName)
+  })
+}
+
+// 直接使用 groupFormItems 初始化
+async function initWithGroupFormItems() {
+  if (!props.groupFormItems) {
+    throw new Error('groupFormItems 不能为空')
+  }
+
+  setupFormConfig(props.groupFormItems)
+
+  // 设置表名
+  if (props.groupFormItems.tableName) {
+    tableName.value = props.groupFormItems.tableName.split(' ')[0] || ''
+  }
+}
+
+// 设置表单配置
+function setupFormConfig(config: GroupFormItems) {
+  loadParamLogicNameData(config.paramLogicName)
+  formConfig.value = config
+  myServiceName.value = props.serviceName || undefined
+  formGroupName.value = config.groupName || 'default'
+  form.value = props.formData || {}
+  // 清理并重新设置验证规则
+  setupValidationRules()
+}
+
+// 设置验证规则
+function setupValidationRules() {
+  // 清理现有规则
+  Object.keys(rules).forEach(key => delete rules[key])
+
+  // 为每个表单项设置规则
+  for (const item of realJsonData.value) {
+    if (item.rule) {
+      setFormRule(item)
+    }
+  }
+}
+
+// 设置单个表单项的验证规则
+function setFormRule(item: FormItem) {
+  if (!item.model || !item.rule)
+    return
+
+  rules[item.model] = []
+  let defaultValue: any
+  let message: string
+
+  switch (item.rule.type) {
+    case 'number':
+      message = '数字'
+      defaultValue = 0
+      break
+    case 'integer':
+      message = '整数'
+      defaultValue = 0
+      break
+    case 'float':
+      message = '小数'
+      defaultValue = 0.0
+      break
+    case 'string':
+      message = '字符串'
+      defaultValue = ''
+      break
+    default:
+      return
+  }
+
+  rules[item.model].push({
+    type: item.rule.type,
+    message: `${item.name || item.model}必须为${message}`,
+    transform: (value: any) => {
+      if (value && value.length !== 0) {
+        return Number(value)
+      }
+      else {
+        return defaultValue
+      }
+    },
+    trigger: 'blur',
+  })
+}
+
+// 重置表单状态
+function resetForm() {
+  formConfig.value = null
+  formGroupName.value = 'default'
+  myServiceName.value = ''
+  tableName.value = ''
+  form.value = {}
+  Object.keys(rules).forEach(key => delete rules[key])
+  myGetDataParams.value = {}
+}
+
+// 监听 formData 变化
+watch(() => props.formData, (newVal) => {
+  if (newVal) {
+    Object.assign(form, newVal)
+  }
+})
+
+watch(form, (newVal) => {
+  if (typeof formDataChange === 'function') {
+    formDataChange(newVal)
+  }
+}, { deep: true })
+
+// 组件挂载时初始化
+onBeforeMount(() => {
+  initializeForm()
+})
+
+// 支持函数调用方式初始化
+function init(params: InitParams) {
+  const {
+    formItems,
+    formData = {},
+    getDataParams = {},
+  } = params
+
+  // 重置状态
+  loaded.value = false
+
+  try {
+    if (props.configName) {
+      // 通过 props 中的配置名称初始化
+      loadFormConfig()
+    }
+    else if (formItems) {
+      // 直接使用传入的配置初始化
+      setupFormConfig(formItems)
+      form.value = formData || props.formData || {}
+      myGetDataParams.value = getDataParams
+
+      // 设置表名
+      if (formItems.tableName) {
+        tableName.value = formItems.tableName.split(' ')[0] || ''
+      }
+    }
+    else {
+      console.warn('init 函数调用时既没有 props.configName 也没有 formItems')
+      resetForm()
+    }
+  }
+  catch (error) {
+    console.error('init 函数初始化失败:', error)
+    resetForm()
+  }
+  finally {
+    loaded.value = true
+  }
+}
+
+function loadParamLogicNameData(paramLogicName) {
+  // 如果有 paramLogicName，自动请求并赋值
+  if (paramLogicName && (!props.formData || (props.formData && Object.keys(props.formData).length === 0))) {
+    let logicParam = props?.paramLogicNameParam || {}
+    if (typeof logicParam === 'string') {
+      try {
+        logicParam = JSON.parse(logicParam)
+      }
+      catch {
+        logicParam = { value: logicParam }
+      }
+    }
+    logicParam = {
+      ...logicParam,
+      currUserName: userStore.getUserInfo().name,
+      currUserId: userStore.getUserInfo().id,
+      orgId: userStore.getUserInfo().orgid,
+    }
+    runLogic(paramLogicName, logicParam || {}, props.serviceName).then((data: any) => {
+      if (data) {
+        form.value = data
+      }
+    })
+  }
+}
+
+function setForm(obj: object) {
+  Object.assign(form.value, obj)
+}
+
+// 获取表单字段实际值
+function getRealKey(key: string, mustHandleKey = false) {
+  if (key === 'selected_id')
+    return key
+  if (props.isHandleFormKey || mustHandleKey) {
+    return key.substring(key.indexOf('_') + 1)
+  }
+  else {
+    return key
+  }
+}
+
+async function asyncSubmit() {
+  return new Promise((resolve, reject) => {
+    validate().then(async () => {
+      const cleanedForm = prepareForm()
+      await appendSilenceAddFields(cleanedForm)
+      const realForm = handleFormKeys(cleanedForm)
+      resolve({
+        realForm,
+        mode: props.mode,
+        serviceName: props.serviceName,
+        currUserName: userStore.getUserInfo().name,
+        currUserId: userStore.getUserInfo().id,
+        orgId: userStore.getUserInfo().orgid,
+      })
+    }).catch((error) => {
+      reject(error)
+    })
+  })
+}
+
+function handleFormKeys(form: any, mustHandleKey = false) {
+  const realForm: any = {}
+  for (const key of Object.keys(form)) {
+    const value = form[key]
+    const extraFormKeyTagIndex = key.indexOf('@')
+    if (extraFormKeyTagIndex !== -1) {
+      const extraFormKey = key.substring(0, extraFormKeyTagIndex)
+      const realKey = key.substring(extraFormKeyTagIndex + 1)
+      if (!realForm[extraFormKey]) {
+        realForm[extraFormKey] = {}
+      }
+      realForm[extraFormKey][realKey] = value
+    }
+    else {
+      const realKey = props.isHandleFormKey || mustHandleKey ? getRealKey(key, mustHandleKey) : key
+      // 如果发生重名，不覆盖，把key的别名带上
+      if (realForm[realKey]) {
+        realForm[key] = value
+      }
+      else {
+        realForm[realKey] = value
+      }
+    }
+  }
+  return realForm
+}
+
+async function appendSilenceAddFields(form: any) {
+  if (props.mode === '新增') {
+    for (const item of silenceAddJsonData.value) {
+      switch (item.silencePurpose) {
+        case 'createTime':
+          form[item.model] = formatDate(new Date())
+          break
+        case 'operator':
+          form[item.model] = userStore.getUserInfo().name
+          break
+        case 'operatorId':
+          form[item.model] = userStore.getUserInfo().id
+          break
+        case 'orgId':
+          form[item.model] = userStore.getUserInfo().orgid
+          break
+        case 'orgName':
+          form[item.model] = userStore.getUserInfo().orgs
+          break
+        case 'depId':
+          form[item.model] = userStore.getUserInfo().depids
+          break
+        case 'depName':
+          form[item.model] = userStore.getUserInfo().deps
+          break
+      }
+    }
+    for (const item of silenceAddJsonData.value.filter(item => item.silencePurpose === 'customize')) {
+      const result: any = await runLogic(item.silenceSource!, form, props.serviceName)
+      if (result) {
+        const keys = Object.keys(result)
+        if (keys.length === 1 && keys[0] === 'value') {
+          form[item.model] = result.value
+        }
+        else {
+          form[item.model] = result
+        }
+      }
+      else {
+        form[item.model] = result
+      }
+    }
+  }
+}
+
+function prepareForm() {
+  const formObj = { ...form.value }
+  const cleanedForm: any = {}
+
+  for (const key of Object.keys(formObj)) {
+    const value = formObj[key]
+
+    // 跳过无效值
+    if (value === null || value === undefined || value === '') {
+      continue
+    }
+
+    // 处理数组
+    if (Array.isArray(value)) {
+      // 过滤掉空字符串、null、undefined
+      const filteredArray = value.filter(item =>
+        item !== null && item !== undefined && item !== '',
+      )
+      // 只有当数组不为空时才添加
+      if (filteredArray.length > 0) {
+        cleanedForm[key] = filteredArray
+      }
+      continue
+    }
+
+    // 处理对象
+    if (typeof value === 'object' && value !== null) {
+      // 检查对象是否为空
+      const objectKeys = Object.keys(value)
+      if (objectKeys.length === 0) {
+        continue
+      }
+
+      // 递归清理对象内部
+      const cleanedObject: any = {}
+      let hasValidValue = false
+
+      for (const objKey of objectKeys) {
+        const objValue = value[objKey]
+        if (objValue !== null && objValue !== undefined && objValue !== '') {
+          cleanedObject[objKey] = objValue
+          hasValidValue = true
+        }
+      }
+
+      // 只有当对象有有效值时才添加
+      if (hasValidValue) {
+        cleanedForm[key] = cleanedObject
+      }
+      continue
+    }
+
+    // 处理基本类型
+    if (value !== null && value !== undefined && value !== '') {
+      cleanedForm[key] = value
+    }
+  }
+
+  return cleanedForm
+}
+
+function getFormData() {
+  return prepareForm()
+}
+
+async function onSubmit() {
+  await validate()
+  // 清理表单数据
+  const cleanedForm = prepareForm()
+  if (!props.configName && props.groupFormItems) {
+    // 只有单表才可以成功，多表关联或者自定义sql不行
+    await appendSilenceAddFields(cleanedForm)
+    const realForm = handleFormKeys(cleanedForm)
+
+    try {
+      addOrModifyEntity(realForm, tableName.value, props.serviceName || import.meta.env.VITE_APP_SYSTEM_NAME).then(() => {
+        showSuccessToast('提交成功!！')
+      })
+    }
+    catch (error) {
+      showFailToast('提交失败!！')
+    }
+    finally {
+      setTimeout(() => {
+        history.back()
+      }, 1000)
+    }
+  }
+  else {
+    // 使用清理后的数据
+    emits('onSubmit', cleanedForm)
+  }
+}
+async function validate() {
+  await xFormRef.value?.validate()
+}
+function emitFunc(func: any, data: any, value: any) {
+  emits(func, data, value)
+  emits('xFormItemEmitFunc', func, data, value)
+}
+
+defineExpose({ init, form, formGroupName, validate, asyncSubmit, setForm, getFormData })
+</script>
+
+<template>
+  <VanForm v-if="loaded" ref="xFormRef" class="x-form-container" :class="{ 'use-full-height': !props.isGroupForm }" @submit="onSubmit">
+    <div class="form-fields-scrollable">
+      <VanCellGroup :title="groupTitle">
+        <XFormItem
+          v-for="(item, index) in realJsonData"
+          :key="index"
+          v-model="form[item.model]"
+          :mode="props.mode"
+          :form="form"
+          :attr="item"
+          :rules="rules"
+          :service-name="myServiceName"
+          :get-data-params="myGetDataParams"
+          @set-form="setForm"
+          @x-form-item-emit-func="emitFunc"
+        />
+        <slot name="extraFormItem" />
+      </VanCellGroup>
+      <slot name="extraCellGroup" />
+      <!-- 地图预览，统一放在表单项下方，只在有经纬度时显示 -->
+      <div v-if="previewMapPoint" style="height: 200px; margin-top: 12px; position: relative;">
+        <XOlMap
+          ref="previewMapRef"
+          :center="previewMapPoint"
+          :style="{ height: '100%' }"
+        />
+        <div class="map-mask" />
+      </div>
+    </div>
+    <div v-if="resolvedSubmitButton && props.mode !== '预览'" class="form-footer-fixed">
+      <VanButton class="action-btn" round block type="primary" native-type="submit">
+        {{ props.groupFormItems?.btnName ? props.groupFormItems.btnName : '提交' }}
+      </VanButton>
+      <slot />
+    </div>
+    <slot name="extraActionSpace" />
+  </VanForm>
+</template>
+
+<style scoped>
+.use-full-height {
+  height: calc(100vh - var(--van-nav-bar-height) - 20px);
+}
+
+.x-form-container {
+  display: flex;
+  flex-direction: column;
+  max-height: 100vh;
+  overflow: hidden;
+}
+
+.form-fields-scrollable {
+  flex: 1;
+  overflow-y: auto;
+  min-height: 0;
+}
+
+.form-footer-fixed {
+  margin: 16px;
+  flex-shrink: 0;
+  .action-btn {
+    border-radius: 10px;
+  }
+}
+.map-mask {
+  position: absolute;
+  left: 0;
+  top: 0;
+  width: 100%;
+  height: 100%;
+  pointer-events: all;
+  background: transparent;
+  z-index: 10;
+}
+</style>