feat: 样式优化

src/views/stationData/transfer/components/deviceDrawer.vue

@@ -22,16 +22,17 @@
              element-loading-text="数据加载中请耐心等待..."
         >
           <div
-            class="absolute inset-0 z-[99] flex items-center justify-center bg-white/80 backdrop-blur-sm"
+            class="absolute inset-0 z-[99] flex items-center justify-center bg-white/80 backdrop-blur-sm transition-opacity duration-300"
             v-if="isFetching"
           >
-            <div class="w-full max-w-[600px] space-y-10 p-6">
+            <div class="w-full max-w-[700px] mx-auto px-4 sm:px-6 lg:px-8">
-              <el-scrollbar height="70vh" max-height="600px">
+              <el-scrollbar height="70vh" max-height="600px" class="pr-2">
-                <div
+                <div class="space-y-4 md:space-y-6">
-                  v-for="deviceInfo in pointInfoData"
+                  <div
-                  :key="deviceInfo.id"
+                    v-for="deviceInfo in pointInfoData"
-                  class="space-y-3 text-center bg-white/90 p-5 rounded-xl shadow"
+                    :key="deviceInfo.id"
-                >
+                    class="space-y-3 text-center bg-white/95 backdrop-blur-sm p-6 rounded-xl shadow-lg border border-gray-100 hover:shadow-xl transition-shadow duration-200"
+                  >
                   <div class="font-semibold text-gray-700 text-lg">
                     {{ chartGroupMap?.get(deviceInfo.id)?.cnName }} 数据加载中…
                   </div>
@@ -53,7 +54,7 @@
                       }}</span>
                   </div>
                 </div>
-
+                </div>
               </el-scrollbar>
             </div>
           </div>