From e6fa9f60a927f639b8b7f6145982a395506b3150 Mon Sep 17 00:00:00 2001
From: Charles7c <charles7c@126.com>
Date: Mon, 11 Mar 2024 22:17:36 +0800
Subject: [PATCH] =?UTF-8?q?refactor:=20=E4=BC=98=E5=8C=96=E9=83=A8?=
 =?UTF-8?q?=E5=88=86=20ref=20API=20=E4=BD=BF=E7=94=A8=E6=96=B9=E5=BC=8F?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 src/views/login/components/email-login.vue    |  3 ++-
 src/views/login/components/phone-login.vue    |  5 +++--
 src/views/monitor/log/login/index.vue         |  5 +++--
 src/views/monitor/log/operation/index.vue     |  5 +++--
 src/views/monitor/log/system/index.vue        |  5 +++--
 src/views/monitor/online/index.vue            |  7 ++++---
 src/views/system/announcement/index.vue       | 15 +++++++------
 .../config/components/basic-setting.vue       |  3 ++-
 src/views/system/dept/index.vue               | 21 +++++++++++--------
 src/views/system/dict/index.vue               | 17 ++++++++-------
 src/views/system/dict/item.vue                |  8 ++++---
 src/views/system/file/main/FileMain/index.vue |  5 +++--
 src/views/system/menu/index.vue               | 21 +++++++++++--------
 src/views/system/message/index.vue            | 10 +++++----
 src/views/system/role/index.vue               | 15 +++++++------
 .../user/center/components/basic-info.vue     |  5 +++--
 .../security-settings/update-email.vue        |  7 ++++---
 .../security-settings/update-phone.vue        |  9 ++++----
 .../security-settings/update-pwd.vue          |  5 +++--
 src/views/system/user/index.vue               | 15 +++++++------
 src/views/tool/generator/index.vue            | 10 +++++----
 21 files changed, 116 insertions(+), 80 deletions(-)

diff --git a/src/views/login/components/email-login.vue b/src/views/login/components/email-login.vue
index 6bda250..84c90ed 100644
--- a/src/views/login/components/email-login.vue
+++ b/src/views/login/components/email-login.vue
@@ -9,6 +9,7 @@
   const { t } = useI18n();
   const router = useRouter();
   const userStore = useUserStore();
+  const formRef = ref();
   const loading = ref(false);
   const captchaLoading = ref(false);
   const captchaDisable = ref(false);
@@ -47,7 +48,7 @@
    */
   const handleSendCaptcha = () => {
     if (captchaLoading.value) return;
-    proxy.$refs.formRef.validateField('email', (valid: any) => {
+    formRef.value.validateField('email', (valid: any) => {
       if (!valid) {
         captchaLoading.value = true;
         captchaBtnNameKey.value = 'login.captcha.ing';
diff --git a/src/views/login/components/phone-login.vue b/src/views/login/components/phone-login.vue
index c7694d3..72e0483 100644
--- a/src/views/login/components/phone-login.vue
+++ b/src/views/login/components/phone-login.vue
@@ -9,6 +9,7 @@
   const { t } = useI18n();
   const router = useRouter();
   const userStore = useUserStore();
+  const formRef = ref();
   const loading = ref(false);
   const captchaLoading = ref(false);
   const captchaDisable = ref(true);
@@ -43,7 +44,7 @@
    */
   const handleOpenBehaviorCaptcha = () => {
     if (captchaLoading.value) return;
-    proxy.$refs.formRef.validateField('phone', (valid: any) => {
+    formRef.value.validateField('phone', (valid: any) => {
       if (!valid) {
         proxy.$refs.verifyRef.show();
       }
@@ -65,7 +66,7 @@
    */
   const handleSendCaptcha = (captchaParam: BehaviorCaptchaReq) => {
     if (captchaLoading.value) return;
-    proxy.$refs.formRef.validateField('phone', (valid: any) => {
+    formRef.value.validateField('phone', (valid: any) => {
       if (!valid) {
         captchaLoading.value = true;
         captchaBtnNameKey.value = 'login.captcha.ing';
diff --git a/src/views/monitor/log/login/index.vue b/src/views/monitor/log/login/index.vue
index 6346895..5d24f27 100644
--- a/src/views/monitor/log/login/index.vue
+++ b/src/views/monitor/log/login/index.vue
@@ -10,6 +10,7 @@
     'success_failure_status_enum',
   );
 
+  const queryFormRef = ref();
   const loginLogList = ref<LoginLogRecord[]>([]);
   const total = ref(0);
   const loading = ref(false);
@@ -55,7 +56,7 @@
    * 重置
    */
   const resetQuery = () => {
-    proxy.$refs.queryRef.resetFields();
+    queryFormRef.value.resetFields();
     handleQuery();
   };
 
@@ -94,7 +95,7 @@
       <div class="header">
         <!-- 搜索栏 -->
         <div class="header-query">
-          <a-form ref="queryRef" :model="queryParams" layout="inline">
+          <a-form ref="queryFormRef" :model="queryParams" layout="inline">
             <a-form-item field="status" hide-label>
               <a-select
                 v-model="queryParams.status"
diff --git a/src/views/monitor/log/operation/index.vue b/src/views/monitor/log/operation/index.vue
index 250d74c..a13b5c1 100644
--- a/src/views/monitor/log/operation/index.vue
+++ b/src/views/monitor/log/operation/index.vue
@@ -10,6 +10,7 @@
     'success_failure_status_enum'
   );
 
+  const queryFormRef = ref();
   const operationLogList = ref<OperationLogRecord[]>([]);
   const total = ref(0);
   const loading = ref(false);
@@ -56,7 +57,7 @@
    * 重置
    */
   const resetQuery = () => {
-    proxy.$refs.queryRef.resetFields();
+    queryFormRef.value.resetFields();
     handleQuery();
   };
 
@@ -95,7 +96,7 @@
       <div class="header">
         <!-- 搜索栏 -->
         <div class="header-query">
-          <a-form ref="queryRef" :model="queryParams" layout="inline">
+          <a-form ref="queryFormRef" :model="queryParams" layout="inline">
             <a-form-item field="description" hide-label>
               <a-input
                 v-model="queryParams.description"
diff --git a/src/views/monitor/log/system/index.vue b/src/views/monitor/log/system/index.vue
index 66470fe..044d66e 100644
--- a/src/views/monitor/log/system/index.vue
+++ b/src/views/monitor/log/system/index.vue
@@ -12,6 +12,7 @@
 
   const { proxy } = getCurrentInstance() as any;
   const { copy, copied } = useClipboard();
+  const queryFormRef = ref();
   const systemLogList = ref<SystemLogRecord[]>([]);
   const systemLog = ref<SystemLogDetailRecord>({
     traceId: '',
@@ -112,7 +113,7 @@
    * 重置
    */
   const resetQuery = () => {
-    proxy.$refs.queryRef.resetFields();
+    queryFormRef.value.resetFields();
     handleQuery();
   };
 
@@ -151,7 +152,7 @@
       <div class="header">
         <!-- 搜索栏 -->
         <div class="header-query">
-          <a-form ref="queryRef" :model="queryParams" layout="inline">
+          <a-form ref="queryFormRef" :model="queryParams" layout="inline">
             <a-form-item field="createTime" hide-label>
               <date-range-picker v-model="queryParams.createTime" />
             </a-form-item>
diff --git a/src/views/monitor/online/index.vue b/src/views/monitor/online/index.vue
index e051c28..26b4bec 100644
--- a/src/views/monitor/online/index.vue
+++ b/src/views/monitor/online/index.vue
@@ -4,7 +4,8 @@
   import checkPermission from '@/utils/permission';
 
   const { proxy } = getCurrentInstance() as any;
-
+  const queryFormRef = ref();
+  const tableRef = ref();
   const dataList = ref<DataRecord[]>([]);
   const total = ref(0);
   const loading = ref(false);
@@ -63,7 +64,7 @@
    * 重置
    */
   const resetQuery = () => {
-    proxy.$refs.queryRef.resetFields();
+    queryFormRef.value.resetFields();
     handleQuery();
   };
 
@@ -102,7 +103,7 @@
       <div class="header">
         <!-- 搜索栏 -->
         <div class="header-query">
-          <a-form ref="queryRef" :model="queryParams" layout="inline">
+          <a-form ref="queryFormRef" :model="queryParams" layout="inline">
             <a-form-item field="nickname" hide-label>
               <a-input
                 v-model="queryParams.nickname"
diff --git a/src/views/system/announcement/index.vue b/src/views/system/announcement/index.vue
index 4c1d52f..c541199 100644
--- a/src/views/system/announcement/index.vue
+++ b/src/views/system/announcement/index.vue
@@ -16,6 +16,9 @@
     'announcement_status_enum',
   );
 
+  const queryFormRef = ref();
+  const formRef = ref();
+  const tableRef = ref();
   const dataList = ref<DataRecord[]>([]);
   const dataDetail = ref<DataRecord>({});
   const total = ref(0);
@@ -97,7 +100,7 @@
    */
   const reset = () => {
     form.value = {};
-    proxy.$refs.formRef?.resetFields();
+    formRef.value?.resetFields();
   };
 
   /**
@@ -105,14 +108,14 @@
    */
   const handleCancel = () => {
     visible.value = false;
-    proxy.$refs.formRef.resetFields();
+    formRef.value.resetFields();
   };
 
   /**
    * 确定
    */
   const handleOk = () => {
-    proxy.$refs.formRef.validate((valid: any) => {
+    formRef.value.validate((valid: any) => {
       if (!valid) {
         if (form.value.id !== undefined) {
           update(form.value, form.value.id).then((res) => {
@@ -185,7 +188,7 @@
     del(ids).then((res) => {
       proxy.$message.success(res.msg);
       getList();
-      proxy.$refs.tableRef.selectAll(false);
+      tableRef.value.selectAll(false);
     });
   };
 
@@ -228,7 +231,7 @@
    * 重置
    */
   const resetQuery = () => {
-    proxy.$refs.queryRef.resetFields();
+    queryFormRef.value.resetFields();
     handleQuery();
   };
 
@@ -267,7 +270,7 @@
       <div class="header">
         <!-- 搜索栏 -->
         <div v-if="showQuery" class="header-query">
-          <a-form ref="queryRef" :model="queryParams" layout="inline">
+          <a-form ref="queryFormRef" :model="queryParams" layout="inline">
             <a-form-item field="title" hide-label>
               <a-input
                 v-model="queryParams.title"
diff --git a/src/views/system/config/components/basic-setting.vue b/src/views/system/config/components/basic-setting.vue
index eb05165..a198278 100644
--- a/src/views/system/config/components/basic-setting.vue
+++ b/src/views/system/config/components/basic-setting.vue
@@ -12,6 +12,7 @@
   import { useAppStore } from '@/store';
 
   const { proxy } = getCurrentInstance() as any;
+  const formRef = ref();
   const dataList = ref<DataRecord[]>([]);
   const isEdit = ref(false);
   const logoFile = ref<FileItem>({ uid: '-1' });
@@ -81,7 +82,7 @@
    * 保存
    */
   const handleSave = () => {
-    proxy.$refs.formRef.validate((valid: any) => {
+    formRef.value.validate((valid: any) => {
       if (!valid) {
         const optionList: DataRecord[] = Object.entries(form.value).map(
           (item) => {
diff --git a/src/views/system/dept/index.vue b/src/views/system/dept/index.vue
index 3b35679..27b838d 100644
--- a/src/views/system/dept/index.vue
+++ b/src/views/system/dept/index.vue
@@ -15,6 +15,9 @@
   const { proxy } = getCurrentInstance() as any;
   const { dis_enable_status_enum } = proxy.useDict('dis_enable_status_enum');
 
+  const queryFormRef = ref();
+  const formRef = ref();
+  const tableRef = ref();
   const dataList = ref<DataRecord[]>([]);
   const dataDetail = ref<DataRecord>({});
   const ids = ref<Array<number>>([]);
@@ -64,7 +67,7 @@
       .then((res) => {
         dataList.value = res.data;
         setTimeout(() => {
-          proxy.$refs.tableRef.expandAll();
+          tableRef.value.expandAll();
         }, 0);
       })
       .finally(() => {
@@ -110,7 +113,7 @@
     form.value = {
       sort: 999,
     };
-    proxy.$refs.formRef?.resetFields();
+    formRef.value?.resetFields();
   };
 
   /**
@@ -118,14 +121,14 @@
    */
   const handleCancel = () => {
     visible.value = false;
-    proxy.$refs.formRef.resetFields();
+    formRef.value.resetFields();
   };
 
   /**
    * 确定
    */
   const handleOk = () => {
-    proxy.$refs.formRef.validate((valid: any) => {
+    formRef.value.validate((valid: any) => {
       if (!valid) {
         if (form.value.id !== undefined) {
           update(form.value, form.value.id).then((res) => {
@@ -197,7 +200,7 @@
     del(ids).then((res) => {
       proxy.$message.success(res.msg);
       getList();
-      proxy.$refs.tableRef.selectAll(false);
+      tableRef.value.selectAll(false);
     });
   };
 
@@ -208,7 +211,7 @@
     if (rowKeys.find((key: any) => key === rowKey)) {
       if (record.children) {
         record.children.forEach((r) => {
-          proxy.$refs.tableRef.select(r.id);
+          tableRef.value.select(r.id);
           rowKeys.push(r.id);
           if (r.children) {
             handleSelect(rowKeys, rowKey, r);
@@ -221,7 +224,7 @@
           rowKeys.findIndex((key: number | undefined) => key === r.id),
           1,
         );
-        proxy.$refs.tableRef.select(r.id, false);
+        tableRef.value.select(r.id, false);
         if (r.children) {
           handleSelect(rowKeys, rowKey, r);
         }
@@ -297,7 +300,7 @@
    * 重置
    */
   const resetQuery = () => {
-    proxy.$refs.queryRef.resetFields();
+    queryFormRef.value.resetFields();
     handleQuery();
   };
 </script>
@@ -316,7 +319,7 @@
       <div class="header">
         <!-- 搜索栏 -->
         <div v-if="showQuery" class="header-query">
-          <a-form ref="queryRef" :model="queryParams" layout="inline">
+          <a-form ref="queryFormRef" :model="queryParams" layout="inline">
             <a-form-item field="name" hide-label>
               <a-input
                 v-model="queryParams.name"
diff --git a/src/views/system/dict/index.vue b/src/views/system/dict/index.vue
index ee8e274..362bebf 100644
--- a/src/views/system/dict/index.vue
+++ b/src/views/system/dict/index.vue
@@ -14,6 +14,9 @@
 
   const { proxy } = getCurrentInstance() as any;
 
+  const queryFormRef = ref();
+  const formRef = ref();
+  const tableRef = ref();
   const dataList = ref<DataRecord[]>([]);
   const total = ref(0);
   const ids = ref<Array<number>>([]);
@@ -129,7 +132,7 @@
    */
   const reset = () => {
     form.value = {};
-    proxy.$refs.formRef?.resetFields();
+    formRef.value?.resetFields();
   };
 
   /**
@@ -137,14 +140,14 @@
    */
   const handleCancel = () => {
     visible.value = false;
-    proxy.$refs.formRef.resetFields();
+    formRef.value.resetFields();
   };
 
   /**
    * 确定
    */
   const handleOk = () => {
-    proxy.$refs.formRef.validate((valid: any) => {
+    formRef.value.validate((valid: any) => {
       if (!valid) {
         if (form.value.id !== undefined) {
           update(form.value, form.value.id).then((res) => {
@@ -191,7 +194,7 @@
     del(ids).then((res) => {
       proxy.$message.success(res.msg);
       getList();
-      proxy.$refs.tableRef.selectAll(false);
+      tableRef.value.selectAll(false);
     });
   };
 
@@ -223,7 +226,7 @@
    * 查询
    */
   const handleQuery = () => {
-    proxy.$refs.tableRef.selectAll(false);
+    tableRef.value.selectAll(false);
     getList();
   };
 
@@ -231,7 +234,7 @@
    * 重置
    */
   const resetQuery = () => {
-    proxy.$refs.queryRef.resetFields();
+    queryFormRef.value.resetFields();
     handleQuery();
   };
 
@@ -272,7 +275,7 @@
           <div class="header">
             <!-- 搜索栏 -->
             <div v-if="showQuery" class="header-query">
-              <a-form ref="queryRef" :model="queryParams" layout="inline">
+              <a-form ref="queryFormRef" :model="queryParams" layout="inline">
                 <a-form-item field="name" hide-label>
                   <a-input
                     v-model="queryParams.name"
diff --git a/src/views/system/dict/item.vue b/src/views/system/dict/item.vue
index c28cb9c..8baba6e 100644
--- a/src/views/system/dict/item.vue
+++ b/src/views/system/dict/item.vue
@@ -17,6 +17,8 @@
     },
   });
   const { proxy } = getCurrentInstance() as any;
+  const formRef = ref();
+  const tableRef = ref();
   const dataList = ref<DataRecord[]>([]);
   const colors = ref(['primary', 'success', 'warning', 'error', 'default']);
   const total = ref(0);
@@ -95,7 +97,7 @@
       sort: 999,
       dictId: dictId.value,
     };
-    proxy.$refs.formRef?.resetFields();
+    formRef.value?.resetFields();
   };
 
   /**
@@ -103,14 +105,14 @@
    */
   const handleCancel = () => {
     visible.value = false;
-    proxy.$refs.formRef.resetFields();
+    formRef.value.resetFields();
   };
 
   /**
    * 确定
    */
   const handleOk = () => {
-    proxy.$refs.formRef.validate((valid: any) => {
+    formRef.value.validate((valid: any) => {
       if (!valid) {
         if (form.value.id !== undefined) {
           update(form.value, form.value.id).then((res) => {
diff --git a/src/views/system/file/main/FileMain/index.vue b/src/views/system/file/main/FileMain/index.vue
index 261c95f..abff1ab 100644
--- a/src/views/system/file/main/FileMain/index.vue
+++ b/src/views/system/file/main/FileMain/index.vue
@@ -28,6 +28,7 @@
   const { proxy } = getCurrentInstance() as any;
   const route = useRoute();
   const fileStore = useFileStore();
+  const queryFormRef = ref();
   const loading = ref(false);
   // 文件列表数据
   const fileList = ref<FileItem[]>([]);
@@ -212,7 +213,7 @@
    * 重置
    */
   const resetQuery = () => {
-    proxy.$refs.queryRef.resetFields();
+    queryFormRef.value.resetFields();
     handleQuery();
   };
 
@@ -393,7 +394,7 @@
     <a-row justify="space-between" class="row-operate">
       <!-- 左侧区域 -->
       <a-space wrap>
-        <a-form ref="queryRef" :model="queryParams" layout="inline">
+        <a-form ref="queryFormRef" :model="queryParams" layout="inline">
           <a-form-item hide-label>
             <a-upload
               v-permission="['system:file:upload']"
diff --git a/src/views/system/menu/index.vue b/src/views/system/menu/index.vue
index 10d0a20..9a804c7 100644
--- a/src/views/system/menu/index.vue
+++ b/src/views/system/menu/index.vue
@@ -15,6 +15,9 @@
   const { proxy } = getCurrentInstance() as any;
   const { dis_enable_status_enum } = proxy.useDict('dis_enable_status_enum');
 
+  const queryFormRef = ref();
+  const formRef = ref();
+  const tableRef = ref();
   const dataList = ref<DataRecord[]>([]);
   const ids = ref<Array<number>>([]);
   const title = ref('');
@@ -107,7 +110,7 @@
       isHidden: false,
       sort: 999,
     };
-    proxy.$refs.formRef?.resetFields();
+    formRef.value?.resetFields();
   };
 
   /**
@@ -115,14 +118,14 @@
    */
   const handleCancel = () => {
     visible.value = false;
-    proxy.$refs.formRef.resetFields();
+    formRef.value.resetFields();
   };
 
   /**
    * 确定
    */
   const handleOk = () => {
-    proxy.$refs.formRef.validate((valid: any) => {
+    formRef.value.validate((valid: any) => {
       if (!valid) {
         if (form.value.id !== undefined) {
           update(form.value, form.value.id).then((res) => {
@@ -170,7 +173,7 @@
     del(ids).then((res) => {
       proxy.$message.success(res.msg);
       getList();
-      proxy.$refs.tableRef.selectAll(false);
+      tableRef.value.selectAll(false);
     });
   };
 
@@ -181,7 +184,7 @@
     if (rowKeys.find((key: any) => key === rowKey)) {
       if (record.children) {
         record.children.forEach((r) => {
-          proxy.$refs.tableRef.select(r.id);
+          tableRef.value.select(r.id);
           rowKeys.push(r.id);
           if (r.children) {
             handleSelect(rowKeys, rowKey, r);
@@ -194,7 +197,7 @@
           rowKeys.findIndex((key: number | undefined) => key === r.id),
           1,
         );
-        proxy.$refs.tableRef.select(r.id, false);
+        tableRef.value.select(r.id, false);
         if (r.children) {
           handleSelect(rowKeys, rowKey, r);
         }
@@ -231,7 +234,7 @@
    */
   const handleExpandAll = () => {
     expandAll.value = !expandAll.value;
-    proxy.$refs.tableRef.expandAll(expandAll.value);
+    tableRef.value.expandAll(expandAll.value);
   };
 
   /**
@@ -300,7 +303,7 @@
    * 重置
    */
   const resetQuery = () => {
-    proxy.$refs.queryRef.resetFields();
+    queryFormRef.value.resetFields();
     handleQuery();
   };
 </script>
@@ -320,7 +323,7 @@
       <div class="header">
         <!-- 搜索栏 -->
         <div v-if="showQuery" class="header-query">
-          <a-form ref="queryRef" :model="queryParams" layout="inline">
+          <a-form ref="queryFormRef" :model="queryParams" layout="inline">
             <a-form-item field="title" hide-label>
               <a-input
                 v-model="queryParams.title"
diff --git a/src/views/system/message/index.vue b/src/views/system/message/index.vue
index e3431e3..4943115 100644
--- a/src/views/system/message/index.vue
+++ b/src/views/system/message/index.vue
@@ -3,6 +3,8 @@
 
   const { proxy } = getCurrentInstance() as any;
   const { message_type_enum } = proxy.useDict('message_type_enum');
+  const queryFormRef = ref();
+  const tableRef = ref();
   const dataList = ref<DataRecord[]>([]);
   const dataDetail = ref<DataRecord>({
     id: 0,
@@ -99,7 +101,7 @@
     del(ids).then((res) => {
       proxy.$message.success(res.msg);
       getList();
-      proxy.$refs.tableRef.selectAll(false);
+      tableRef.value.selectAll(false);
     });
   };
 
@@ -130,7 +132,7 @@
     read(ids).then((res) => {
       proxy.$message.success(res.msg);
       getList();
-      proxy.$refs.tableRef.selectAll(false);
+      tableRef.value.selectAll(false);
     });
   };
 
@@ -160,7 +162,7 @@
    * 重置
    */
   const resetQuery = () => {
-    proxy.$refs.queryRef.resetFields();
+    queryFormRef.value.resetFields();
     handleQuery();
   };
 
@@ -199,7 +201,7 @@
       <div class="header">
         <!-- 搜索栏 -->
         <div v-if="showQuery" class="header-query">
-          <a-form ref="queryRef" :model="queryParams" layout="inline">
+          <a-form ref="queryFormRef" :model="queryParams" layout="inline">
             <a-form-item field="title" hide-label>
               <a-input
                 v-model="queryParams.title"
diff --git a/src/views/system/role/index.vue b/src/views/system/role/index.vue
index 87c7ce4..a0e378c 100644
--- a/src/views/system/role/index.vue
+++ b/src/views/system/role/index.vue
@@ -18,6 +18,9 @@
     'dis_enable_status_enum',
   );
 
+  const queryFormRef = ref();
+  const formRef = ref();
+  const tableRef = ref();
   const dataList = ref<DataRecord[]>([]);
   const dataDetail = ref<DataRecord>({});
   const total = ref(0);
@@ -170,7 +173,7 @@
       dataScope: 4,
       sort: 999,
     };
-    proxy.$refs.formRef?.resetFields();
+    formRef.value?.resetFields();
   };
 
   /**
@@ -178,7 +181,7 @@
    */
   const handleCancel = () => {
     visible.value = false;
-    proxy.$refs.formRef.resetFields();
+    formRef.value.resetFields();
   };
 
   /**
@@ -224,7 +227,7 @@
    * 确定
    */
   const handleOk = () => {
-    proxy.$refs.formRef.validate((valid: any) => {
+    formRef.value.validate((valid: any) => {
       if (!valid) {
         if (form.value.id !== undefined) {
           form.value.menuIds = getMenuAllCheckedKeys();
@@ -302,7 +305,7 @@
     del(ids).then((res) => {
       proxy.$message.success(res.msg);
       getList();
-      proxy.$refs.tableRef.selectAll(false);
+      tableRef.value.selectAll(false);
     });
   };
 
@@ -385,7 +388,7 @@
    * 重置
    */
   const resetQuery = () => {
-    proxy.$refs.queryRef.resetFields();
+    queryFormRef.value.resetFields();
     handleQuery();
   };
 
@@ -424,7 +427,7 @@
       <div class="header">
         <!-- 搜索栏 -->
         <div v-if="showQuery" class="header-query">
-          <a-form ref="queryRef" :model="queryParams" layout="inline">
+          <a-form ref="queryFormRef" :model="queryParams" layout="inline">
             <a-form-item field="name" hide-label>
               <a-input
                 v-model="queryParams.name"
diff --git a/src/views/system/user/center/components/basic-info.vue b/src/views/system/user/center/components/basic-info.vue
index 3ff9ab0..0c2bcd0 100644
--- a/src/views/system/user/center/components/basic-info.vue
+++ b/src/views/system/user/center/components/basic-info.vue
@@ -7,6 +7,7 @@
   const { proxy } = getCurrentInstance() as any;
 
   const { t } = useI18n();
+  const formRef = ref();
   const userStore = useUserStore();
   const loading = ref(false);
 
@@ -46,7 +47,7 @@
    */
   const handleSave = () => {
     if (loading.value) return;
-    proxy.$refs.formRef.validate((valid: any) => {
+    formRef.value.validate((valid: any) => {
       if (!valid) {
         loading.value = true;
         updateBasicInfo({
@@ -68,7 +69,7 @@
    * 重置
    */
   const handleReset = () => {
-    proxy.$refs.formRef.resetFields();
+    formRef.value.resetFields();
   };
 </script>
 
diff --git a/src/views/system/user/center/components/security-settings/update-email.vue b/src/views/system/user/center/components/security-settings/update-email.vue
index 152acbb..632a93b 100644
--- a/src/views/system/user/center/components/security-settings/update-email.vue
+++ b/src/views/system/user/center/components/security-settings/update-email.vue
@@ -9,6 +9,7 @@
   const { proxy } = getCurrentInstance() as any;
   const { t } = useI18n();
   const userStore = useUserStore();
+  const formRef = ref();
   const captchaTime = ref(60);
   const captchaTimer = ref();
   const captchaLoading = ref(false);
@@ -72,7 +73,7 @@
    */
   const handleSendCaptcha = () => {
     if (captchaLoading.value) return;
-    proxy.$refs.formRef.validateField('newEmail', (valid: any) => {
+    formRef.value.validateField('newEmail', (valid: any) => {
       if (!valid) {
         captchaLoading.value = true;
         captchaBtnNameKey.value = 'userCenter.securitySettings.captcha.ing';
@@ -107,7 +108,7 @@
    */
   const handleCancel = () => {
     visible.value = false;
-    proxy.$refs.formRef.resetFields();
+    formRef.value.resetFields();
     resetCaptcha();
   };
 
@@ -115,7 +116,7 @@
    * 修改
    */
   const handleUpdate = () => {
-    proxy.$refs.formRef.validate((valid: any) => {
+    formRef.value.validate((valid: any) => {
       if (!valid) {
         updateEmail({
           newEmail: form.newEmail,
diff --git a/src/views/system/user/center/components/security-settings/update-phone.vue b/src/views/system/user/center/components/security-settings/update-phone.vue
index 2108ec3..a066e9f 100644
--- a/src/views/system/user/center/components/security-settings/update-phone.vue
+++ b/src/views/system/user/center/components/security-settings/update-phone.vue
@@ -9,6 +9,7 @@
   const { proxy } = getCurrentInstance() as any;
   const { t } = useI18n();
   const userStore = useUserStore();
+  const formRef = ref();
   const captchaTime = ref(60);
   const captchaTimer = ref();
   const captchaLoading = ref(false);
@@ -74,7 +75,7 @@
    */
   const handleOpenBehaviorCaptcha = () => {
     if (captchaLoading.value) return;
-    proxy.$refs.formRef.validateField('newPhone', (valid: any) => {
+    formRef.value.validateField('newPhone', (valid: any) => {
       if (!valid) {
         proxy.$refs.verifyRef.show();
       }
@@ -86,7 +87,7 @@
    */
   const handleSendCaptcha = (captchaParam: BehaviorCaptchaReq) => {
     if (captchaLoading.value) return;
-    proxy.$refs.formRef.validateField('newPhone', (valid: any) => {
+    formRef.value.validateField('newPhone', (valid: any) => {
       if (!valid) {
         captchaLoading.value = true;
         captchaBtnNameKey.value = 'userCenter.securitySettings.captcha.ing';
@@ -121,7 +122,7 @@
    */
   const handleCancel = () => {
     visible.value = false;
-    proxy.$refs.formRef.resetFields();
+    formRef.value.resetFields();
     resetCaptcha();
   };
 
@@ -129,7 +130,7 @@
    * 修改
    */
   const handleUpdate = () => {
-    proxy.$refs.formRef.validate((valid: any) => {
+    formRef.value.validate((valid: any) => {
       if (!valid) {
         updatePhone({
           newPhone: form.newPhone,
diff --git a/src/views/system/user/center/components/security-settings/update-pwd.vue b/src/views/system/user/center/components/security-settings/update-pwd.vue
index e21acaf..b2f4b19 100644
--- a/src/views/system/user/center/components/security-settings/update-pwd.vue
+++ b/src/views/system/user/center/components/security-settings/update-pwd.vue
@@ -9,6 +9,7 @@
 
   const { t } = useI18n();
   const userStore = useUserStore();
+  const formRef = ref();
   const visible = ref(false);
 
   // 表单数据
@@ -84,14 +85,14 @@
    */
   const handleCancel = () => {
     visible.value = false;
-    proxy.$refs.formRef.resetFields();
+    formRef.value.resetFields();
   };
 
   /**
    * 修改
    */
   const handleUpdate = () => {
-    proxy.$refs.formRef.validate((valid: any) => {
+    formRef.value.validate((valid: any) => {
       if (!valid) {
         updatePassword({
           oldPassword: encryptByRsa(form.oldPassword) || '',
diff --git a/src/views/system/user/index.vue b/src/views/system/user/index.vue
index ac3c552..8eb2d52 100644
--- a/src/views/system/user/index.vue
+++ b/src/views/system/user/index.vue
@@ -21,6 +21,9 @@
   const { proxy } = getCurrentInstance() as any;
   const { dis_enable_status_enum } = proxy.useDict('dis_enable_status_enum');
 
+  const queryFormRef = ref();
+  const formRef = ref();
+  const tableRef = ref();
   const dataList = ref<DataRecord[]>([]);
   const dataDetail = ref<DataRecord>({});
   const total = ref(0);
@@ -191,7 +194,7 @@
     form.value = {
       gender: 1,
     };
-    proxy.$refs.formRef?.resetFields();
+    formRef.value?.resetFields();
   };
 
   /**
@@ -201,7 +204,7 @@
     visible.value = false;
     resetPasswordVisible.value = false;
     userRoleVisible.value = false;
-    proxy.$refs.formRef?.resetFields();
+    formRef.value?.resetFields();
     proxy.$refs.resetPasswordFormRef?.resetFields();
     proxy.$refs.userRoleFormRef?.resetFields();
   };
@@ -210,7 +213,7 @@
    * 确定
    */
   const handleOk = () => {
-    proxy.$refs.formRef.validate((valid: any) => {
+    formRef.value.validate((valid: any) => {
       if (!valid) {
         if (form.value.id !== undefined) {
           update(form.value, form.value.id).then((res) => {
@@ -328,7 +331,7 @@
     del(ids).then((res) => {
       proxy.$message.success(res.msg);
       getList();
-      proxy.$refs.tableRef.selectAll(false);
+      tableRef.value.selectAll(false);
     });
   };
 
@@ -424,7 +427,7 @@
    * 重置
    */
   const resetQuery = () => {
-    proxy.$refs.queryRef.resetFields();
+    queryFormRef.value.resetFields();
     handleQuery();
   };
 
@@ -487,7 +490,7 @@
           <div class="header">
             <!-- 搜索栏 -->
             <div v-if="showQuery" class="header-query">
-              <a-form ref="queryRef" :model="queryParams" layout="inline">
+              <a-form ref="queryFormRef" :model="queryParams" layout="inline">
                 <a-form-item field="username" hide-label>
                   <a-input
                     v-model="queryParams.username"
diff --git a/src/views/tool/generator/index.vue b/src/views/tool/generator/index.vue
index 5664c14..0490dd2 100644
--- a/src/views/tool/generator/index.vue
+++ b/src/views/tool/generator/index.vue
@@ -25,6 +25,8 @@
     'query_type_enum',
   );
 
+  const queryFormRef = ref();
+  const formRef = ref();
   const { copy, copied } = useClipboard();
   const extensions = [java(), javascript()];
   const tableList = ref<TableRecord[]>([]);
@@ -129,7 +131,7 @@
    * 确定
    */
   const handleOk = () => {
-    proxy.$refs.formRef.validate((valid: any) => {
+    formRef.value.validate((valid: any) => {
       if (!valid) {
         config.value.fieldConfigs = fieldConfigList.value;
         config.value.genConfig = form.value;
@@ -147,7 +149,7 @@
    */
   const handleCancel = () => {
     visible.value = false;
-    proxy.$refs.formRef?.resetFields();
+    formRef.value.resetFields();
     fieldConfigList.value = [];
   };
 
@@ -219,7 +221,7 @@
    * 重置
    */
   const resetQuery = () => {
-    proxy.$refs.queryRef.resetFields();
+    queryFormRef.value.resetFields();
     handleQuery();
   };
 
@@ -258,7 +260,7 @@
       <div class="header">
         <!-- 搜索栏 -->
         <div v-if="showQuery" class="header-query">
-          <a-form ref="queryRef" :model="queryParams" layout="inline">
+          <a-form ref="queryFormRef" :model="queryParams" layout="inline">
             <a-form-item field="tableName" hide-label>
               <a-input
                 v-model="queryParams.tableName"