/* * @Author: fxs bjnsfxs@163.com * @Date: 2024-08-21 17:23:32 * @LastEditors: fxs bjnsfxs@163.com * @LastEditTime: 2024-10-14 17:00:57 * @FilePath: \Game-Backstage-Management-System\src\hooks\useDialog.ts * @Description: * */ import type { DialogSetting } from '@/types/table' import { nextTick } from 'vue' import Form from '@/components/form/CustomForm.vue' import 'element-plus/theme-chalk/el-message.css' import 'element-plus/theme-chalk/el-message-box.css' export function useDialog() { /** * @description: 对话框关闭 * @param {InstanceType} formEl 表单对象 * @param {DialogSetting} dialogConfig 对话框配置 */ const dialogClose = ( formEl: InstanceType | undefined, dialogConfig: DialogSetting ) => { if (!formEl) return dialogConfig.dialogVisible = false formEl.resetForm() } /** * @description: 点击修改按钮,填充数据 * @param {any} row 行数据 * @param {any} formData 表单数据 * @param {DialogSetting} dialogConfig 对话框配置 */ const handleEdit = (row: any, formData: any, dialogConfig: DialogSetting) => { dialogConfig.type = 1 dialogConfig.dialogVisible = true // 这里放到nextTick,因为resetFields原理是将表单重置到dom刚渲染时的数据 // 而这个表单,如果第一次使用就点击编辑的话,会将初始值直接设置为这行的数据,导致无法重置 void nextTick(() => { for (const key in row) { if (key in formData) { formData[key] = row[key] } else { console.log(key) } } }) } return { dialogClose, handleEdit } }