@ebiz/designer-components 0.0.36 → 0.0.37

package/src/components/senior/EbizSDialog/index.vue

@@ -0,0 +1,900 @@
+<template>
+  <div class="ebiz-tdesign-button-dialog">
+    <t-dialog v-model:visible="dialogVisible" :header="title || computedTitle" :width="dialogWidth" :top="dialogTop"
+      :attach="dialogAttach" :destroy-on-close="dialogDestroyOnClose" :mode="dialogMode" :placement="dialogPlacement"
+      :show-overlay="dialogShowOverlay" :close-on-esc-keydown="dialogCloseOnEscKeydown"
+      :close-on-overlay-click="dialogCloseOnOverlayClick" :show-footer="dialogShowFooter" @close="handleDialogClose"
+      @confirm="handleDialogConfirm" @cancel="handleDialogCancel">
+      <template #header>
+        <slot name="header">
+          <div :class="['dialog-header', dialogType === 'delete' ? 'dialog-header-delete' : '']">
+            {{ title || computedTitle }}
+          </div>
+        </slot>
+      </template>
+
+      <template #body>
+        <div v-if="dialogType === 'normal'">
+          <slot name="body"></slot>
+        </div>
+        <div v-else-if="dialogType === 'add'">
+          <t-form ref="formRef" :colon="colon"
+            :data="localFormData" :disabled="disabled" :label-align="labelAlign" :label-width="labelWidth" :layout="layout"
+            :reset-type="resetType" :reset-on-semi-controlled="resetOnSemiControlled" :rules="rules"
+            :show-error-message="showErrorMessage" :status-icon="statusIcon"
+            :style="customStyle" @reset="handleReset" @submit="handleSubmit" @validate="handleValidate">
+            <slot name="body"></slot>
+          </t-form>
+        </div>
+        <div v-else-if="dialogType === 'edit'">
+          <t-form ref="formRef" :colon="colon"
+            :data="localFormData" :disabled="disabled" :label-align="labelAlign" :label-width="labelWidth" :layout="layout"
+            :reset-type="resetType" :reset-on-semi-controlled="resetOnSemiControlled" :rules="rules"
+            :show-error-message="showErrorMessage" :status-icon="statusIcon"
+            :style="customStyle" @reset="handleReset" @submit="handleSubmit" @validate="handleValidate">
+            <slot name="body"></slot>
+          </t-form>
+        </div>
+        <slot v-else-if="dialogType === 'delete'" name="body">
+          <div class="delete-confirm-content">
+            <t-icon name="error-circle" size="large" class="delete-icon" />
+            <p class="delete-message">{{ deleteConfirmMessage }}</p>
+          </div>
+        </slot>
+      </template>
+    </t-dialog>
+  </div>
+</template>
+
+<script setup>
+import { ref, computed, watch } from 'vue'
+import { Dialog as TDialog, MessagePlugin, Icon as TIcon } from 'tdesign-vue-next'
+import dataService from '../../../apiService/simpleDataService'
+
+const props = defineProps({
+  // 弹窗类型
+  dialogType: {
+    type: String,
+    default: 'normal', // 'normal', 'add', 'delete'
+    validator: (value) => ['normal', 'add', 'edit', 'delete'].includes(value)
+  },
+  
+  // 删除确认消息
+  deleteConfirmMessage: {
+    type: String,
+    default: '确定要删除该数据吗？此操作不可逆，请谨慎操作。'
+  },
+  
+  // 按钮基础属性
+  buttonText: {
+    type: String,
+    default: ''
+  },
+  // 按钮样式属性
+  buttonTheme: {
+    type: String,
+    default: ''
+  },
+  buttonVariant: {
+    type: String,
+    default: 'base'
+  },
+  buttonSize: {
+    type: String,
+    default: 'medium'
+  },
+  buttonBlock: {
+    type: Boolean,
+    default: false
+  },
+  buttonShape: {
+    type: String,
+    default: 'rectangle'
+  },
+  buttonDisabled: {
+    type: Boolean,
+    default: false
+  },
+  buttonLoading: {
+    type: Boolean,
+    default: false
+  },
+  buttonIcon: {
+    type: String,
+    default: ''
+  },
+  
+  // 弹窗基础属性
+  title: {
+    type: String,
+    default: ''
+  },
+  visible: {
+    type: Boolean,
+    default: false
+  },
+  confirmText: {
+    type: String,
+    default: undefined
+  },
+  cancelText: {
+    type: String,
+    default: undefined
+  },
+  
+  // 弹窗样式和行为属性
+  dialogWidth: {
+    type: [String, Number],
+    default: '500px'
+  },
+  dialogTop: {
+    type: [String, Number],
+    default: '15vh'
+  },
+  dialogAttach: {
+    type: [String, Function],
+    default: 'body'
+  },
+  dialogDestroyOnClose: {
+    type: Boolean,
+    default: false
+  },
+  dialogMode: {
+    type: String,
+    default: 'modal'
+  },
+  dialogPlacement: {
+    type: String,
+    default: 'top'
+  },
+  dialogShowOverlay: {
+    type: Boolean,
+    default: true
+  },
+  dialogCloseOnEscKeydown: {
+    type: Boolean,
+    default: true
+  },
+  dialogCloseOnOverlayClick: {
+    type: Boolean,
+    default: true
+  },
+  dialogShowFooter: {
+    type: Boolean,
+    default: true
+  },
+  
+  // API配置
+  apiConfig: {
+    type: Object,
+    default: () => null
+  },
+
+  // 请求参数
+  params: {
+    type: Object,
+    default: () => null
+  },
+
+  // 表单数据
+  formData:{
+    type: Object,
+    default: () => null
+  },
+
+  // 表单验证规则
+  rules:{
+    type: Object,
+    default: () => null
+  },
+
+  // 是否在API调用成功后自动关闭弹窗
+  closeOnSuccess: {
+    type: Boolean,
+    default: true
+  },
+  // 是否显示API调用的结果消息
+  showResultMessage: {
+    type: Boolean,
+    default: true
+  },
+  
+  // 表单组件属性
+  colon: {
+    type: Boolean,
+    default: false
+  },
+  disabled: {
+    type: Boolean,
+    default: false
+  },
+  labelAlign: {
+    type: String,
+    default: 'right'
+  },
+  labelWidth: {
+    type: [String, Number],
+    default: '100px'
+  },
+  layout: {
+    type: String,
+    default: 'vertical'
+  },
+  resetType: {
+    type: String,
+    default: 'empty'
+  },
+  resetOnSemiControlled: {
+    type: Boolean,
+    default: false
+  },
+  showErrorMessage: {
+    type: Boolean,
+    default: true
+  },
+  statusIcon: {
+    type: Boolean,
+    default: false
+  },
+  customStyle: {
+    type: Object,
+    default: () => ({})
+  },
+
+  // 详情API配置，用于编辑模式加载数据
+  detailApiConfig: {
+    type: Object,
+    default: () => null
+  },
+})
+
+const emit = defineEmits([
+  'update:modelValue',
+  'button-click',
+  'dialog-close',
+  'dialog-confirm',
+  'dialog-cancel',
+  'api-success',
+  'api-error',
+  'reset',
+  'submit',
+  'submit-error',
+  'validate',
+  'detail-loaded',
+  'detail-error'
+])
+
+const computedTitle = computed(() => {
+  switch (props.dialogType) {
+    case 'add': return '添加数据';
+    case 'delete': return '删除确认';
+    case 'edit': return '编辑数据';
+    default: return '标题';
+  }
+})
+
+// 初始化dialogVisible
+const dialogVisible = ref(props.visible)
+const apiLoading = ref(false)
+const formRef = ref(null)
+const currentId = ref(null)
+const currentParams = ref({})
+// 本地维护一份表单数据的副本
+const localFormData = ref(props.formData ? { ...props.formData } : {})
+
+// 监听props的visible变化
+watch(() => props.visible, (newVal) => {
+  dialogVisible.value = newVal
+})
+
+// 监听dialogVisible变化，同步更新modelValue
+watch(dialogVisible, (newVal) => {
+  emit('update:modelValue', newVal)
+})
+
+// 弹窗关闭事件
+const handleDialogClose = (e) => {
+  dialogVisible.value = false
+  emit('dialog-close', e)
+}
+
+// API调用方法
+// 获取错误消息
+const getErrorMessage = (error, dialogType) => {
+  const errorPrefix = dialogType === 'delete' 
+    ? '删除失败' 
+    : dialogType === 'add' 
+      ? '添加失败' 
+      : dialogType === 'edit'
+        ? '修改失败'
+        : '操作失败'
+  
+  if (!error) return `${errorPrefix}: 未知错误`
+  
+  // 处理不同类型的错误
+  if (error.response && error.response.data) {
+    // API返回的详细错误信息
+    const { message, msg, error: errMsg } = error.response.data
+    return `${errorPrefix}: ${message || msg || errMsg || error.message || '服务器返回错误'}`
+  } else if (error.message) {
+    // 标准错误对象
+    return `${errorPrefix}: ${error.message}`
+  } else if (typeof error === 'string') {
+    // 字符串错误
+    return `${errorPrefix}: ${error}`
+  } else {
+    // 未知错误
+    return `${errorPrefix}: 未知错误`
+  }
+}
+
+const callApi = async (config = props.apiConfig) => {
+  if (!config) return null
+  
+  try {
+    apiLoading.value = true
+    
+    // 克隆配置以避免修改原始对象
+    const apiConfig = { ...config }
+    
+    // 对于添加和编辑表单，自动附加表单数据
+    if ((props.dialogType === 'add' || props.dialogType === 'edit') && localFormData.value) {
+      // 如果没有data字段，创建一个
+      if (!apiConfig.data) {
+        apiConfig.data = { ...localFormData.value }
+      } 
+      // 如果有data字段且是对象，合并表单数据
+      else if (typeof apiConfig.data === 'object' && apiConfig.data !== null) {
+        // 深拷贝表单数据，避免引用问题
+        const formDataCopy = {}
+        Object.keys(localFormData.value).forEach(key => {
+          // 处理表单中的引用类型数据
+          if (typeof localFormData.value[key] === 'object' && localFormData.value[key] !== null) {
+            formDataCopy[key] = Array.isArray(localFormData.value[key]) 
+              ? [...localFormData.value[key]] 
+              : { ...localFormData.value[key] }
+          } else {
+            formDataCopy[key] = localFormData.value[key]
+          }
+        })
+        
+        apiConfig.data = { ...apiConfig.data, ...formDataCopy }
+      }
+    }
+    
+    // 添加默认的content-type头
+    if (!apiConfig.headers) {
+      apiConfig.headers = {}
+    }
+    
+    if (!apiConfig.headers['Content-Type']) {
+      apiConfig.headers['Content-Type'] = 'application/json'
+    }
+    
+    // 设置默认的请求方法
+    if (!apiConfig.method) {
+      // 根据弹窗类型设置默认方法
+      switch (props.dialogType) {
+        case 'add':
+          apiConfig.method = 'post'
+          break
+        case 'edit':
+          apiConfig.method = 'put'
+          break
+        case 'delete':
+          apiConfig.method = 'delete'
+          break
+        default:
+          apiConfig.method = 'post'
+      }
+    }
+    
+    // 如果是URL形式的API配置
+    if (typeof apiConfig === 'string') {
+      apiConfig = { url: apiConfig, method: 'post' }
+    }
+    
+    // 添加自定义请求拦截器
+    let requestTransformer = null
+    if (apiConfig.transformRequest) {
+      requestTransformer = apiConfig.transformRequest
+      delete apiConfig.transformRequest
+    }
+    
+    // 添加自定义响应拦截器
+    let responseTransformer = null
+    if (apiConfig.transformResponse) {
+      responseTransformer = apiConfig.transformResponse
+      delete apiConfig.transformResponse
+    }
+    
+    // 处理请求数据
+    if (requestTransformer && typeof requestTransformer === 'function') {
+      apiConfig.data = requestTransformer(apiConfig.data)
+    }
+    
+    // 调用dataService进行API请求
+    const response = await dataService.fetch({}, apiConfig)
+    
+    // 处理响应数据
+    let transformedResponse = response
+    if (responseTransformer && typeof responseTransformer === 'function') {
+      transformedResponse = responseTransformer(response)
+    }
+    
+    // 显示成功消息
+    if (props.showResultMessage) {
+      const successMessage = props.dialogType === 'delete' 
+        ? '删除成功' 
+        : props.dialogType === 'add' 
+          ? '添加成功' 
+          : props.dialogType === 'edit'
+            ? '修改成功'
+            : '操作成功'
+      MessagePlugin.success(successMessage)
+    }
+    
+    // 触发成功事件
+    emit('api-success', transformedResponse)
+    
+    // 如果设置了成功后关闭，则关闭弹窗
+    if (props.closeOnSuccess) {
+      dialogVisible.value = false
+    }
+    
+    return transformedResponse
+  } catch (error) {
+    // 错误处理和错误消息展示
+    const errorMessage = getErrorMessage(error, props.dialogType)
+    
+    // 显示错误消息
+    if (props.showResultMessage) {
+      MessagePlugin.error(errorMessage)
+    }
+    
+    // 触发错误事件
+    emit('api-error', error)
+    
+    throw error // 继续抛出错误以便上层捕获
+  } finally {
+    apiLoading.value = false
+  }
+}
+
+// 弹窗确认事件
+const handleDialogConfirm = async (e) => {
+  emit('dialog-confirm', e)
+  
+  // 对于非普通类型的弹窗，总是尝试调用API
+  if (props.dialogType !== 'normal') {
+    if (props.apiConfig) {
+
+      // 如果是表单类型（添加或编辑），先进行表单校验
+      if ((props.dialogType === 'add' || props.dialogType === 'edit') && formRef.value) {
+
+        try {
+          // 显示加载状态
+          apiLoading.value = true
+          
+          // 使用表单的validate方法进行校验
+          const validateResult = await formRef.value.validate()
+          
+          // 校验成功，执行提交操作
+          if (validateResult === true) {
+            // 克隆API配置，避免修改原始配置
+            const apiConfig = { ...props.apiConfig }
+            
+            // 对于编辑模式，确保请求中包含ID
+            if (props.dialogType === 'edit' && currentId.value) {
+              // 替换URL中的ID参数，支持{id}和:id两种格式
+              if (apiConfig.url) {
+                apiConfig.url = apiConfig.url.replace(/\{id\}/g, currentId.value).replace(/:id/g, currentId.value)
+              }
+              
+              // 准备请求参数
+              if (!apiConfig.params) {
+                apiConfig.params = {}
+              }
+              
+              // 如果有params参数且没有id，添加id
+              if (!apiConfig.params.id && currentId.value) {
+                apiConfig.params.id = currentId.value
+              }
+              
+              // 准备请求数据
+              if (!apiConfig.data) {
+                apiConfig.data = {}
+              }
+              
+              // 确保请求体中有ID
+              if (!apiConfig.data.id && currentId.value) {
+                apiConfig.data.id = currentId.value
+              }
+              
+              // 合并当前参数中的非表单数据
+              if (currentParams.value && Object.keys(currentParams.value).length > 0) {
+                // 过滤掉id和formData，避免重复
+                const { id: _id, formData: _formData, ...otherParams } = currentParams.value
+                apiConfig.params = { ...apiConfig.params, ...otherParams }
+              }
+              
+              await callApi(apiConfig)
+            } else {
+              // 克隆API配置，确保添加操作有正确的data字段
+              const addApiConfig = { ...props.apiConfig }
+              
+              // 合并当前参数中的非表单数据
+              if (currentParams.value && Object.keys(currentParams.value).length > 0) {
+                // 过滤掉id和formData，避免重复
+                const { id: _id, formData: _formData, ...otherParams } = currentParams.value
+                
+                if (!addApiConfig.params) {
+                  addApiConfig.params = {}
+                }
+                
+                addApiConfig.params = { ...addApiConfig.params, ...otherParams }
+              }
+              
+              await callApi(addApiConfig)
+            }
+          } else {
+            // 校验失败，显示第一个错误信息
+            const firstError = validateResult[Object.keys(validateResult)[0]]?.[0]?.message || '表单校验失败'
+            MessagePlugin.error(firstError)
+            emit('submit-error', { validateResult, firstError })
+            return // 阻止关闭弹窗
+          }
+        } catch (error) {
+          // 校验或API调用过程中的错误
+          MessagePlugin.error(`操作失败: ${error.message || '未知错误'}`)
+          emit('submit-error', { error })
+          return // 阻止关闭弹窗
+        } finally {
+          apiLoading.value = false
+        }
+      } else if (props.dialogType === 'delete') {
+        try {
+          // 显示加载状态
+          apiLoading.value = true
+          
+          // 克隆API配置，避免修改原始配置
+          const deleteApiConfig = { ...props.apiConfig }
+          
+          // 对于删除操作，确保包含ID
+          if (currentId.value) {
+            // 替换URL中的ID参数
+            if (deleteApiConfig.url) {
+              deleteApiConfig.url = deleteApiConfig.url.replace(/\{id\}/g, currentId.value).replace(/:id/g, currentId.value)
+            }
+            
+            // 准备请求参数
+            if (!deleteApiConfig.params) {
+              deleteApiConfig.params = {}
+            }
+            
+            // 如果有params参数且没有id，添加id
+            if (!deleteApiConfig.params.id && currentId.value) {
+              deleteApiConfig.params.id = currentId.value
+            }
+            
+            // 准备请求数据
+            if (!deleteApiConfig.data) {
+              deleteApiConfig.data = {}
+            }
+            
+            // 确保请求体中有ID
+            if (!deleteApiConfig.data.id && currentId.value) {
+              deleteApiConfig.data.id = currentId.value
+            }
+          }
+          
+          // 合并当前参数
+          if (currentParams.value && Object.keys(currentParams.value).length > 0) {
+            // 过滤掉id和formData，避免重复
+            const { id: _id, formData: _formData, ...otherParams } = currentParams.value
+            
+            if (!deleteApiConfig.params) {
+              deleteApiConfig.params = {}
+            }
+            
+            deleteApiConfig.params = { ...deleteApiConfig.params, ...otherParams }
+          }
+          
+          // 删除操作直接调用API
+          await callApi(deleteApiConfig)
+        } catch (error) {
+          // API调用过程中的错误
+          MessagePlugin.error(`删除失败: ${error.message || '未知错误'}`)
+          emit('api-error', error)
+          return // 阻止关闭弹窗
+        } finally {
+          apiLoading.value = false
+        }
+      }
+    } else {
+      dialogVisible.value = false
+    }
+  } else {
+    // 普通弹窗的行为
+    if (props.apiConfig) {
+      try {
+        // 显示加载状态
+        apiLoading.value = true
+        
+        // 克隆API配置，避免修改原始配置
+        const normalApiConfig = { ...props.apiConfig }
+        
+        // 合并当前参数
+        if (currentParams.value && Object.keys(currentParams.value).length > 0) {
+          if (!normalApiConfig.params) {
+            normalApiConfig.params = {}
+          }
+          
+          normalApiConfig.params = { ...normalApiConfig.params, ...currentParams.value }
+        }
+        
+        await callApi(normalApiConfig)
+      } catch (error) {
+        // API调用过程中的错误
+        MessagePlugin.error(`操作失败: ${error.message || '未知错误'}`)
+        emit('api-error', error)
+        return // 阻止关闭弹窗
+      } finally {
+        apiLoading.value = false
+      }
+    } else {
+      dialogVisible.value = false
+    }
+  }
+}
+
+// 弹窗取消事件
+const handleDialogCancel = (e) => {
+  dialogVisible.value = false
+  emit('dialog-cancel', e)
+}
+
+// 表单重置事件
+const handleReset = (e) => {
+  emit('reset', e)
+}
+
+// 表单提交事件
+const handleSubmit = async ({ validateResult, firstError, e }) => {
+  if (validateResult === true) {
+    emit('submit', { e, formData: localFormData.value })
+  } else {
+    MessagePlugin.error(firstError)
+    emit('submit-error', { validateResult, firstError })
+  }
+}
+
+// 表单验证事件
+const handleValidate = (params) => {
+  emit('validate', params)
+}
+
+// 加载详情数据
+const loadDetailData = async (id) => {
+  if (!props.detailApiConfig) return null
+  
+  try {
+    // 显示加载状态
+    apiLoading.value = true
+    
+    // 构建详情请求配置
+    const requestConfig = {
+      ...props.detailApiConfig
+    }
+    
+    // 替换URL中的ID参数，支持{id}和:id两种格式
+    if (requestConfig.url) {
+      requestConfig.url = requestConfig.url.replace(/\{id\}/g, id).replace(/:id/g, id)
+    }
+    
+    // 处理请求参数
+    if (!requestConfig.params) {
+      requestConfig.params = {}
+    }
+    
+    // 如果有params参数且没有id，添加id
+    if (!requestConfig.params.id && id) {
+      requestConfig.params.id = id
+    }
+    
+    // 合并当前参数
+    if (currentParams.value && Object.keys(currentParams.value).length > 0) {
+      // 过滤掉id和formData，避免重复
+      const { id: _id, formData: _formData, ...otherParams } = currentParams.value
+      requestConfig.params = { ...requestConfig.params, ...otherParams }
+    }
+    
+    // 调用dataService进行API请求
+    const response = await dataService.fetch({}, requestConfig)
+    
+    // 获取详情数据
+    const detailData = response.data || response
+    
+    // 更新本地表单数据
+    if (detailData) {
+      // 清空现有数据
+      Object.keys(localFormData.value).forEach(key => {
+        delete localFormData.value[key]
+      })
+      
+      // 写入新数据
+      Object.keys(detailData).forEach(key => {
+        localFormData.value[key] = detailData[key]
+      })
+    }
+    
+    // 触发加载成功事件
+    emit('detail-loaded', detailData)
+    return detailData
+  } catch (error) {
+    // 显示错误消息
+    if (props.showResultMessage) {
+      MessagePlugin.error(`加载详情失败: ${error.message || '未知错误'}`)
+    }
+    
+    // 触发错误事件
+    emit('detail-error', error)
+    return null
+  } finally {
+    apiLoading.value = false
+  }
+}
+
+// 打开弹窗并传递参数
+const openDialog = (params = {}) => {
+  // 重置状态
+  if (props.dialogType === 'add') {
+    // 添加模式：清空表单数据
+    Object.keys(localFormData.value).forEach(key => {
+      delete localFormData.value[key]
+    })
+  }
+  
+  // 处理传入的表单数据
+  if (params.formData && (props.dialogType === 'add' || props.dialogType === 'edit')) {
+    // 更新本地表单数据副本
+    Object.keys(params.formData).forEach(key => {
+      localFormData.value[key] = params.formData[key]
+    })
+  }
+  
+  // 存储其他参数，如删除ID等
+  if (params.id) {
+    currentId.value = params.id
+    
+    // 如果是编辑模式且有detailApiConfig，加载详情数据
+    if (props.dialogType === 'edit' && props.detailApiConfig) {
+      loadDetailData(params.id)
+    }
+  } else {
+    currentId.value = null
+  }
+  
+  // 存储其他自定义参数
+  currentParams.value = params
+  
+  // 打开弹窗
+  dialogVisible.value = true
+  
+  return { success: true, message: '弹窗已打开' }
+}
+
+// 关闭弹窗
+const closeDialog = () => {
+  dialogVisible.value = false
+  return { success: true, message: '弹窗已关闭' }
+}
+
+// 重置表单数据到初始状态
+const resetFormData = () => {
+  if (formRef.value) {
+    formRef.value.reset()
+    emit('reset', { type: 'manual' })
+  }
+  
+  return { success: true, message: '表单已重置' }
+}
+
+// 清空表单数据
+const clearFormData = () => {
+  // 清空表单数据
+  Object.keys(localFormData.value).forEach(key => {
+    delete localFormData.value[key]
+  })
+  
+  emit('reset', { type: 'clear' })
+  return { success: true, message: '表单数据已清空' }
+}
+
+// 设置表单数据
+const setFormData = (data) => {
+  if (!data || typeof data !== 'object') {
+    return { success: false, message: '数据必须是一个对象' }
+  }
+  
+  // 清空现有数据
+  Object.keys(localFormData.value).forEach(key => {
+    delete localFormData.value[key]
+  })
+  
+  // 写入新数据
+  Object.keys(data).forEach(key => {
+    localFormData.value[key] = data[key]
+  })
+  
+  return { success: true, message: '表单数据已设置' }
+}
+
+// 获取表单数据
+const getFormData = () => {
+  return { ...localFormData.value }
+}
+
+// 获取表单的当前验证状态
+const validateForm = async () => {
+  if (!formRef.value) {
+    return { success: false, message: '表单引用不存在' }
+  }
+  
+  try {
+    const validateResult = await formRef.value.validate()
+    
+    if (validateResult === true) {
+      return { success: true, message: '表单验证通过', data: getFormData() }
+    } else {
+      const firstError = validateResult[Object.keys(validateResult)[0]]?.[0]?.message || '表单校验失败'
+      return { success: false, message: firstError, errors: validateResult }
+    }
+  } catch (error) {
+    return { success: false, message: error.message || '表单验证过程中发生错误' }
+  }
+}
+
+// 暴露给父组件的方法
+defineExpose({
+  openDialog,
+  closeDialog,
+  resetFormData,
+  clearFormData,
+  setFormData,
+  getFormData,
+  validateForm,
+  loadDetailData,
+  currentId,
+  currentParams,
+  formRef
+})
+</script>
+
+<style scoped>
+.ebiz-tdesign-button-dialog {
+  display: inline-block;
+}
+
+.dialog-header-delete {
+  color: var(--td-error-color, #e34d59);
+}
+
+.delete-confirm-content {
+  display: flex;
+  align-items: center;
+  padding: 16px;
+}
+
+.delete-icon {
+  font-size: 24px;
+  color: var(--td-error-color, #e34d59);
+  margin-right: 12px;
+}
+
+.delete-message {
+  margin: 0;
+  font-size: 14px;
+  line-height: 22px;
+}
+</style>