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

src/views/perfManage/customTarget/index.vue

@@ -1,18 +1,17 @@
 <script setup lang="ts">
 import { reactive, onMounted, ref, toRaw } from 'vue';
 import { PageContainer } from 'antdv-pro-layout';
-import { Form, message, Modal } 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 { Form, message, Modal } 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 { RESULT_CODE_SUCCESS } from '@/constants/result-constants';
 import useI18n from '@/hooks/useI18n';
 import useNeInfoStore from '@/store/modules/neinfo';
-import { parseObjLineToHump } from '@/utils/parse-utils';
 import {
   addCustom,
   delCustom,
-  getCustom,
   listCustom,
   updateCustom,
 } from '@/api/perfManage/customTarget';
@@ -208,9 +207,9 @@ function fnGetList(pageNum?: number) {
 /**对话框对象信息状态类型 */
 type ModalStateType = {
   /**详情框是否显示 */
-  visibleByView: boolean;
+  openByView: boolean;
   /**新增框或修改框是否显示 */
-  visibleByEdit: boolean;
+  openByEdit: boolean;
   /**标题 */
   title: string;
   /**网元类型设备对象 */
@@ -227,8 +226,8 @@ type ModalStateType = {
 
 /**对话框对象信息状态 */
 let modalState: ModalStateType = reactive({
-  visibleByView: false,
-  visibleByEdit: false,
+  openByView: false,
+  openByEdit: false,
   title: '',
   neType: [],
   neTypPerformance: [],
@@ -340,13 +339,13 @@ function fnModalVisibleByEdit(row?: any, id?: any) {
   if (!id) {
     modalStateFrom.resetFields();
     modalState.title = t('views.perfManage.customTarget.addCustom');
-    modalState.visibleByEdit = true;
+    modalState.openByEdit = true;
     fnSelectPerformanceInit(modalState.from.neType);
   } else {
     fnSelectPerformanceInit(row.neType);
     modalState.from = Object.assign(modalState.from, row);
     modalState.title = t('views.perfManage.customTarget.editCustom');
-    modalState.visibleByEdit = true;
+    modalState.openByEdit = true;
   }
 }
 
@@ -395,7 +394,7 @@ function fnModalOk() {
  * 进行表达规则校验
  */
 function fnModalCancel() {
-  modalState.visibleByEdit = false;
+  modalState.openByEdit = false;
   modalState.confirmLoading = false;
   modalStateFrom.resetFields();
   modalState.neType = [];
@@ -465,10 +464,7 @@ onMounted(() => {
       <a-form :model="queryParams" name="queryParams" layout="horizontal">
         <a-row :gutter="16">
           <a-col :lg="6" :md="12" :xs="24">
-            <a-form-item
-              :label="t('views.ne.common.neType')"
-              name="neType "
-            >
+            <a-form-item :label="t('views.ne.common.neType')" name="neType ">
               <a-auto-complete
                 v-model:value="queryParams.neType"
                 :options="neCascaderOptions"
@@ -609,7 +605,7 @@ onMounted(() => {
       :destroyOnClose="true"
       :keyboard="false"
       :mask-closable="false"
-      :visible="modalState.visibleByEdit"
+      v-model:open="modalState.openByEdit"
       :title="modalState.title"
       :confirm-loading="modalState.confirmLoading"
       @ok="fnModalOk"
@@ -621,7 +617,7 @@ onMounted(() => {
         :label-col="{ span: 6 }"
         :label-wrap="true"
       >
-        <a-row :gutter="16">
+        <a-row>
           <a-col :lg="12" :md="12" :xs="24">
             <a-form-item
               :label="t('views.ne.common.neType')"
@@ -640,7 +636,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.perfManage.customTarget.title')"
@@ -685,7 +681,7 @@ onMounted(() => {
           </a-input>
         </a-form-item>
 
-        <a-row :gutter="16">
+        <a-row>
           <a-col :lg="12" :md="12" :xs="24">
             <a-form-item
               name="perSelect"
@@ -712,7 +708,7 @@ onMounted(() => {
             </a-form-item>
           </a-col>
         </a-row>
-        <a-row :gutter="16">
+        <a-row>
           <a-col :lg="12" :md="12" :xs="24">
             <a-form-item
               :label="t('views.perfManage.customTarget.unit')"