排版改进

hdPad/src/pages/home/components/customList.vue

@@ -12,7 +12,7 @@
                     <image class="avatar-image" :src="item.avatar"></image>
                     <view class="customer-info">
                         <view class="customer-name">
-                            <text>{{ item.name }}</text>
+                            <text class="name-text">{{ item.name }}</text>
                             <text class="order-warning">超1周未下单</text>
                         </view>
                         <view class="customer-balance-level">
@@ -160,25 +160,30 @@ export default {
                     overflow: hidden;
                     
                     & .customer-name {
-                        font-size: 12upx;
-                        color: #333333;
-                        font-weight: bold;
-                        overflow: hidden;
-                        text-overflow: ellipsis;
-                        white-space: nowrap;
+                        font-size: 11upx;
                         margin-bottom: 2upx;
                         display: flex;
                         justify-content: space-between;
                         align-items: center;
                         
+                        & .name-text {
+                            color: #444444;
+                            font-weight: 600;
+                            max-width: 70%;
+                            overflow: hidden;
+                            text-overflow: ellipsis;
+                            white-space: nowrap;
+                        }
+                        
                         & .order-warning {
                             font-size: 9upx;
-                            color: #FF3B30;
+                            color: #E05050;
                             font-weight: normal;
-                            background-color: rgba(255, 59, 48, 0.1);
+                            background-color: rgba(224, 80, 80, 0.08);
                             padding: 0 3upx;
                             border-radius: 3upx;
                             margin-left: 5upx;
+                            flex-shrink: 0;
                         }
                     }
                     
@@ -190,13 +195,13 @@ export default {
                         
                         & .balance {
                             font-size: 10upx;
-                            color: #FF6600;
+                            color: #E67E22;
                         }
                         
                         & .level {
                             font-size: 10upx;
-                            color: #8B7500;
-                            background-color: rgba(255, 215, 0, 0.15);
+                            color: #7D6F00;
+                            background-color: rgba(255, 215, 0, 0.1);
                             border-radius: 3upx;
                             padding: 0 3upx;
                         }
@@ -206,15 +211,15 @@ export default {
                         display: flex;
                         justify-content: space-between;
                         align-items: center;
-                        color: #afaeae;
                         font-size: 10upx;
                         
                         & .mobile {
                             margin-right: 10upx;
+                            color: #666666;
                         }
                         
                         & .date {
-                            color: #afaeae;
+                            color: #888888;
                         }
                     }
                 }