feat(接口管理): 接口管理API模块树高度修改

frontend/src/views/api-test/management/components/moduleTree.vue

@@ -75,7 +75,7 @@
       class="mb-[16px]"
       allow-clear
     />
-    <a-spin class="min-h-[400px] w-full" :loading="loading">
+    <a-spin class="w-full" :loading="loading">
       <MsTree
         v-model:focus-node-key="focusNodeKey"
         v-model:selected-keys="selectedKeys"
@@ -620,29 +620,23 @@
 
     padding: 8px 4px;
     border-radius: var(--border-radius-small);
-
     &:hover {
       background-color: rgb(var(--primary-1));
     }
-
     .folder-text {
       @apply flex flex-1 cursor-pointer items-center;
-
       .folder-icon {
         margin-right: 4px;
         color: var(--color-text-4);
       }
-
       .folder-name {
         color: var(--color-text-1);
       }
-
       .folder-count {
         margin-left: 4px;
         color: var(--color-text-4);
       }
     }
-
     .folder-text--active {
       .folder-icon,
       .folder-name,
@@ -651,7 +645,6 @@
       }
     }
   }
-
   :deep(#root ~ .arco-tree-node-drag-icon) {
     @apply hidden;
   }

frontend/src/views/api-test/management/index.vue

@@ -2,7 +2,7 @@
   <MsCard :min-width="1180" simple no-content-padding>
     <MsSplitBox :size="0.25" :max="0.5">
       <template #first>
-        <div class="p-[24px]">
+        <div class="p-[9px]">
           <moduleTree
             ref="moduleTreeRef"
             :active-node-id="activeApi?.id"
@@ -14,8 +14,8 @@
             @change-protocol="handleProtocolChange"
           />
         </div>
-        <div class="b-0 absolute w-full p-[24px]">
-          <a-divider class="!my-0 !mb-2" />
+        <div class="b-0 absolute w-full p-[9px]">
+          <a-divider class="!my-0 !mb-0" />
           <div class="case h-[38px]">
             <div class="flex items-center" :class="getActiveClass('recycle')" @click="setActiveFolder('recycle')">
               <MsIcon type="icon-icon_delete-trash_outlined" class="folder-icon" />
@@ -148,25 +148,20 @@
     padding: 8px 4px;
     border-radius: var(--border-radius-small);
     @apply flex cursor-pointer items-center justify-between;
-
     &:hover {
       background-color: rgb(var(--primary-1));
     }
-
     .folder-icon {
       margin-right: 4px;
       color: var(--color-text-4);
     }
-
     .folder-name {
       color: var(--color-text-1);
     }
-
     .folder-count {
       margin-left: 4px;
       color: var(--color-text-4);
     }
-
     .case-active {
       .folder-icon,
       .folder-name,
@@ -174,7 +169,6 @@
         color: rgb(var(--primary-5));
       }
     }
-
     .back {
       margin-right: 8px;
       width: 20px;
@@ -182,7 +176,6 @@
       border: 1px solid #ffffff;
       background: linear-gradient(90deg, rgb(var(--primary-9)) 3.36%, #ffffff 100%);
       box-shadow: 0 0 7px rgb(15 0 78 / 9%);
-
       .arco-icon {
         color: rgb(var(--primary-5));
       }
@@ -190,17 +183,13 @@
       @apply flex cursor-pointer items-center rounded-full;
     }
   }
-
   .recycle {
     @apply absolute bottom-0 bg-white pb-4;
-
     :deep(.arco-divider-horizontal) {
       margin: 8px 0;
     }
-
     .recycle-bin {
       @apply bottom-0 flex items-center bg-white;
-
       .recycle-count {
         margin-left: 4px;
         color: var(--color-text-4);