perf: ✨ Adjust the position of the wireless connection screen

src/layouts/default/index.vue

@@ -1,6 +1,6 @@
 <template>
   <div
-    class="absolute inset-0 h-full flex flex-col px-4 pb-4 pt-1 space-y-4 overflow-hidden"
+    class="absolute inset-0 h-full flex flex-col px-4 pt-1 space-y-4 overflow-hidden"
   >
     <div
       class="flex items-center flex-none border-b border-gray-200 dark:border-gray-700 pb-1"

src/pages/device/index.vue

@@ -1,32 +1,12 @@
 <template>
   <div class="h-full flex flex-col">
-    <div class="flex-none flex items-center py-1 overflow-x-auto">
-      <div class="flex-none">
-        <WirelessGroup ref="wirelessGroupRef" v-bind="{ handleRefresh }" />
-      </div>
-
-      <div class="w-px h-7 !mx-4 bg-gray-200 dark:bg-gray-600 flex-none"></div>
-
-      <div class="flex-1 w-0 space-x-2">
-        <el-button
-          type="primary"
-          plain
-          :icon="loading ? '' : 'Refresh'"
-          :loading="loading"
-          @click="handleRefresh"
-        >
-          {{ $t('device.refresh.name') }}
-        </el-button>
-      </div>
-    </div>
-
     <BatchActions
       class="overflow-hidden transition-all"
-      :class="isMultipleRow ? 'h-12 opacity-100 mt-3' : 'h-0 opacity-0 mt-0'"
+      :class="isMultipleRow ? 'h-12 opacity-100' : 'h-0 opacity-0'"
       :devices="selectionRows"
     />
 
-    <div class="pt-4 flex-1 h-0 overflow-hidden">
+    <div class="flex-1 h-0 overflow-hidden">
       <el-table
         ref="elTable"
         v-loading="loading && !deviceList.length"
@@ -112,6 +92,25 @@
         </el-table-column>
       </el-table>
     </div>
+
+    <div class="flex-none flex items-center py-1 overflow-x-auto py-2">
+      <div class="flex-none">
+        <WirelessGroup ref="wirelessGroupRef" v-bind="{ handleRefresh }" />
+      </div>
+
+      <div class="flex-1 w-0 space-x-2 flex items-center justify-end">
+        <EleTooltipButton
+          type="default"
+          :icon="loading ? '' : 'Refresh'"
+          :loading="loading"
+          placement="right"
+          circle
+          :content="$t('device.refresh.name')"
+          @click="handleRefresh"
+        >
+        </EleTooltipButton>
+      </div>
+    </div>
   </div>
 </template>
 

src/pages/preference/components/ScopeSelect/index.vue

@@ -3,7 +3,7 @@
     :placeholder="$t('preferences.scope.placeholder')"
     :no-data-text="$t('preferences.scope.no-data')"
     filterable
-    class="!w-90"
+    class="!w-72"
   >
     <template #prefix>
       <el-tooltip class="" effect="dark" placement="bottom-start">