feat: 页面调整组件属性升级

src/views/system/dept/index.vue

@@ -1,10 +1,11 @@
 <script setup lang="ts">
 import { reactive, onMounted, toRaw } from 'vue';
 import { PageContainer } from 'antdv-pro-layout';
-import { message, Modal, Form } from 'ant-design-vue/lib';
-import { SizeType } from 'ant-design-vue/lib/config-provider';
-import { MenuInfo } from 'ant-design-vue/lib/menu/src/interface';
-import { ColumnsType } from 'ant-design-vue/lib/table';
+import { ProModal } from 'antdv-pro-modal';
+import { message, Modal, Form } from 'ant-design-vue/es';
+import { SizeType } from 'ant-design-vue/es/config-provider';
+import { MenuInfo } from 'ant-design-vue/es/menu/src/interface';
+import { ColumnsType } from 'ant-design-vue/es/table';
 import {
   listDept,
   getDept,
@@ -141,9 +142,9 @@ let treeDataAll: Record<string, any>[] = [];
 /**对话框对象信息状态类型 */
 type ModalStateType = {
   /**详情框是否显示 */
-  visibleByView: boolean;
+  openByView: boolean;
   /**新增框或修改框是否显示 */
-  visibleByEdit: boolean;
+  openByEdit: boolean;
   /**标题 */
   title: string;
   /**表单数据 */
@@ -156,8 +157,8 @@ type ModalStateType = {
 
 /**对话框对象信息状态 */
 let modalState: ModalStateType = reactive({
-  visibleByView: false,
-  visibleByEdit: false,
+  openByView: false,
+  openByEdit: false,
   title: '部门',
   from: {
     deptId: undefined,
@@ -235,7 +236,7 @@ function fnModalVisibleByVive(deptId: string | number) {
       }
       modalState.from = Object.assign(modalState.from, res.data);
       modalState.title = t('views.system.dept.classInfo');
-      modalState.visibleByView = true;
+      modalState.openByView = true;
     } else {
       message.error(t('common.getInfoFail'), 2);
     }
@@ -258,7 +259,7 @@ function fnModalVisibleByEdit(
     }
     modalState.treeData = treeDataAll;
     modalState.title = t('common.addText') + t('views.system.dept.classInfo');
-    modalState.visibleByEdit = true;
+    modalState.openByEdit = true;
   } else {
     if (modalState.confirmLoading) return;
     const hide = message.loading(t('common.loading'), 0);
@@ -286,7 +287,7 @@ function fnModalVisibleByEdit(
           }
           modalState.title =
             t('common.editText') + t('views.system.dept.classInfo');
-          modalState.visibleByEdit = true;
+          modalState.openByEdit = true;
         } else {
           message.error(t('common.getInfoFail'), 2);
         }
@@ -317,7 +318,7 @@ function fnModalOk() {
               content: t('common.msgSuccess', { msg: modalState.title }),
               duration: 2,
             });
-            modalState.visibleByEdit = false;
+            modalState.openByEdit = false;
             // 新增时清空上级部门树重新获取
             if (!from.deptId) {
               treeDataAll = [];
@@ -346,8 +347,8 @@ function fnModalOk() {
  * 进行表达规则校验
  */
 function fnModalCancel() {
-  modalState.visibleByEdit = false;
-  modalState.visibleByView = false;
+  modalState.openByEdit = false;
+  modalState.openByView = false;
   modalStateFrom.resetFields();
 }
 
@@ -605,7 +606,7 @@ onMounted(() => {
     <ProModal
       :drag="true"
       :width="800"
-      :visible="modalState.visibleByView"
+      :open="modalState.openByView"
       :title="modalState.title"
       @cancel="fnModalCancel"
     >
@@ -630,7 +631,7 @@ onMounted(() => {
             <template #suffixIcon></template>
           </a-tree-select>
         </a-form-item>
-        <a-row :gutter="16">
+        <a-row>
           <a-col :lg="12" :md="12" :xs="24">
             <a-form-item
               :label="t('views.system.dept.className')"
@@ -649,7 +650,7 @@ onMounted(() => {
           </a-col>
         </a-row>
 
-        <a-row :gutter="16">
+        <a-row>
           <a-col :lg="12" :md="12" :xs="24">
             <a-form-item :label="t('views.system.dept.status')" name="status">
               <DictTag
@@ -664,7 +665,7 @@ onMounted(() => {
             </a-form-item>
           </a-col>
         </a-row>
-        <a-row :gutter="16">
+        <a-row>
           <a-col :lg="24" :md="24" :xs="24">
             <a-form-item
               :label="t('views.system.dept.admin')"
@@ -701,7 +702,7 @@ onMounted(() => {
       :destroyOnClose="true"
       :keyboard="false"
       :mask-closable="false"
-      :visible="modalState.visibleByEdit"
+      :open="modalState.openByEdit"
       :title="modalState.title"
       :confirm-loading="modalState.confirmLoading"
       @ok="fnModalOk"
@@ -752,7 +753,7 @@ onMounted(() => {
           ></a-input>
         </a-form-item>
 
-        <a-row :gutter="16">
+        <a-row>
           <a-col :lg="12" :md="12" :xs="24">
             <a-form-item :label="t('views.system.dept.status')" name="status">
               <a-select
@@ -778,7 +779,7 @@ onMounted(() => {
           </a-col>
         </a-row>
 
-        <a-row :gutter="16">
+        <a-row>
           <a-col :span="24">
             <a-form-item
               :label="t('views.system.dept.admin')"