总览优化

hdApp/src/admin/home/workbench.vue

@@ -185,16 +185,19 @@
       </view>
 
       <template v-if="lookMoney == 1">
-        <view class="module-com total-wrap">
-          <view class="total-tit">总览</view>
-          <view class="total-blo">
-            <view class="total-list" v-for="(item, index) in overview" :key="index" @click="pageTo(item)">
-              <view class="list-num">{{ $util.numberFormat(item.value) }}</view>
-              <view class="app-color-3">{{ item.name }}</view>
+        <view class="module-com overview-module">
+          <view class="overview-header">
+            <view class="overview-title">总览</view>
+          </view>
+          <view class="overview-grid">
+            <view class="overview-item" v-for="(item, index) in overview" :key="index" @click="pageTo(item)">
+              <view class="item-value">{{ $util.numberFormat(item.value) }}</view>
+              <view class="item-label">{{ item.name }}</view>
             </view>
           </view>
         </view>
       </template>
+
     </view>
     <view class="order-page" v-else>
       <view class="ghs_list_page flex-col">
@@ -900,58 +903,87 @@ export default {
     }
   }
 }
-// 总览
-.total-wrap,
-.order-wrap {
-	.total-tit {
-		padding: 18upx 0 18upx 20upx;
-		border-bottom: 1upx solid $borderColor;
-		font-weight: 600;
-		font-size: 24upx;
-		color: #333333;
-	}
-	.total-blo {
-		@include disFlex(center, space-between);
-		flex-wrap: wrap;
-		padding: 20upx 0 0;
-		.total-list {
-			width: 33%;
-			text-align: center;
-			margin: 20upx 0upx;
-			border-right: 1upx solid $borderColor;
-			.list-num {
-				margin-bottom: 8upx;
-				font-size:26upx;
-				font-weight: bold;
-			}
-		}
-		.total-list:nth-child(3n) {
-			border-right: none;
-		}
-		.total-list:nth-child(n + 4) {
-			padding-bottom: 0;
-		}
-
-		.total-list2 {
-			width: 24%;
-			text-align: center;
-			margin: 20upx 0upx;
-			border-right: 1upx solid $borderColor;
-			.list-num {
-				margin-top:10upx;
-				margin-bottom:8upx;
-				font-size:26upx;
-				font-weight:normal;
-			}
-		}
-		.total-list2:nth-child(4n) {
-			border-right: none;
-		}
-		.total-list2:nth-child(n + 4) {
-			padding-bottom: 0;
-		}
-
-	}
+// 数据总览模块
+.overview-module {
+  background: #ffffff;
+  border-radius: 16upx;
+  padding: 0;
+  overflow: hidden;
+  
+  .overview-header {
+    background: linear-gradient(135deg, #f8fafb 0%, #ffffff 100%);
+    padding: 30upx 30upx 20upx;
+    border-bottom: 1upx solid #f0f0f0;
+    
+    .overview-title {
+      font-size: 32upx;
+      font-weight: 600;
+      color: #333;
+      margin-bottom: 8upx;
+    }
+    
+    .overview-subtitle {
+      font-size: 24upx;
+      color: #999;
+    }
+  }
+  
+  .overview-grid {
+    display: flex;
+    flex-wrap: wrap;
+    padding: 10upx;
+    
+    .overview-item {
+      width: 33.33%;
+      padding: 30upx 0;
+      text-align: center;
+      position: relative;
+      transition: all 0.3s ease;
+      
+      &:not(:nth-child(3n)) {
+        &::after {
+          content: '';
+          position: absolute;
+          right: 0;
+          top: 50%;
+          transform: translateY(-50%);
+          width: 1upx;
+          height: 60upx;
+          background: #f0f0f0;
+        }
+      }
+      
+      &:nth-child(n+4) {
+        &::before {
+          content: '';
+          position: absolute;
+          left: 15%;
+          right: 15%;
+          top: 0;
+          height: 1upx;
+          background: #f0f0f0;
+        }
+      }
+      
+      &:active {
+        background: #f8fafb;
+      }
+      
+      .item-value {
+        font-size: 36upx;
+        font-weight: 600;
+        color: #22C55E;
+        margin-bottom: 10upx;
+        line-height: 1;
+      }
+      
+      .item-label {
+        font-size: 26upx;
+        color: #666;
+        line-height: 1;
+      }
+    }
+  }
 }
 // 新的花束花礼和盆栽花材样式
 .flower-module {