update

src/views/indexSun/indexModal.vue

@@ -2,7 +2,7 @@
     <Dialog class="index-modal" :openVis="visible" width="60%" :title="dialogTitle" @close="closeDialog" :maskClosable="false">
         <template #container>
             <div v-if="useForm" class="form-container">
-                <Form :model="formRecord" :label-width="100" v-bind="formItemLayout">
+                <Form :model="formRecord" v-bind="formItemLayout">
                     <slot name="searchFirst"></slot>
                     <a-form-item v-for="(item, index) in firstForm" :label="item.label" :key="index">
                         <a-input :placeholder="item.placeholder" v-if="item.type == 'input'" v-model:value="formRecord[item.field]" />
@@ -22,11 +22,17 @@
                     <slot name="searchSecond"></slot>
                 </Form>
                 <div class="form-btn">
-                    <a-button @click="handleClicksearch">搜索</a-button>
-                    <a-button @click="handleClicksearch" style="margin-left: 10px">重置</a-button>
+                    <a-button @click="handleClicksearch" style="border-color: #00ccff">重置</a-button>
+                    <a-button
+                        @click="handleClicksearch"
+                        :loading="loading"
+                        style="margin-left: 10px; background: #00ccff; border-color: #00ccff; color: #ffffff"
+                    >
+                        搜索
+                    </a-button>
                 </div>
             </div>
-            <BasicTable ref="registerTable" class="table-container" :key="visible" :columns="column" :apiParams="formState" />
+            <BasicTable @table-load="tableLoad" ref="registerTable" class="table-container" :key="visible" :columns="column" :apiParams="formState" />
         </template>
     </Dialog>
 </template>
@@ -58,6 +64,7 @@
             default: () => [],
         },
     });
+    const loading = ref<boolean>(false);
     const formState = ref();
     const dialogTitle = ref('');
     const formRecord = ref({
@@ -83,6 +90,10 @@
         getField();
     });
 
+    function tableLoad(b: boolean) {
+        loading.value = b;
+    }
+
     function getField() {
         let result = {};
         props.firstForm.map((item) => {
@@ -114,7 +125,7 @@
             background: red !important;
         }
         .form-container {
-            margin: 10px 0;
+            margin: 10px;
             display: flex;
             justify-content: space-between;
             :deep(.ant-form-item-label > label) {
@@ -135,19 +146,25 @@
             }
             .form-btn {
                 flex: 1;
-                text-align: right;
-                padding-right: 20px;
+                padding-left: 20px;
                 :deep(.ant-btn) {
                     background: #082147;
                     border: 1px solid #00ccff;
                     color: #fff;
                     border-radius: 4px;
                 }
-                //margin: 0 15px;
             }
         }
         .table-container {
             margin: 0 10px;
         }
     }
+
+    :deep(.ant-form-item-label) {
+        width: auto !important;
+    }
+
+    :deep(.ant-form-item-control) {
+        margin-right: 20px !important;
+    }
 </style>