首页商品

pages/index/components/PodCatalog.vue

@@ -18,7 +18,7 @@
     </scroll-view>
 
     <!-- 产品网格 2列 -->
-    <view class="pod-grid">
+    <view class="pod-grid" v-if="products.length > 0">
       <view
         class="pod-card"
         v-for="(item, index) in products"
@@ -31,6 +31,11 @@
         <text class="pod-name">{{ item.name }}</text>
       </view>
     </view>
+    <!-- 空状态 -->
+    <view class="pod-empty" v-else>
+      <text class="empty-icon">📦</text>
+      <text class="empty-text">暂无商品</text>
+    </view>
 
     <!-- 更多产品 - 按钮带箭头 -->
     <view class="more-products" @tap="onMoreTap">
@@ -55,7 +60,7 @@ export default {
   },
   data() {
     return {
-      activeCountry: 'us'
+      activeCountry: ''
     }
   },
   methods: {
@@ -188,4 +193,21 @@ export default {
   width: 24rpx;
   height: 24rpx;
 }
+
+/* 空状态 */
+.pod-empty {
+  display: flex;
+  flex-direction: column;
+  align-items: center;
+  justify-content: center;
+  padding: 80rpx 0;
+}
+.empty-icon {
+  font-size: 80rpx;
+  margin-bottom: 20rpx;
+}
+.empty-text {
+  font-size: 26rpx;
+  color: #999999;
+}
 </style>