优化商品列表：左侧分类栏+右侧商品

src/pages/product/list.vue

@@ -39,41 +39,43 @@
       <!-- 右侧商品列表 -->
       <scroll-view scroll-y class="product-scroll">
         <view class="product-list">
-      <view 
-        v-for="item in products" 
-        :key="item.productId" 
-        class="product-card"
-        @click="viewDetail(item)"
-      >
-        <view class="product-image">
-          <text class="product-emoji">📦</text>
-        </view>
-        <view class="product-content">
-          <text class="product-name">{{ item.name }}</text>
-          <text class="product-spec">{{ item.spec || '-' }}</text>
-          <view class="product-footer">
-            <view class="price-wrapper">
-              <text class="price">¥{{ item.price }}</text>
-              <text class="unit">/{{ item.unit }}</text>
+          <view 
+            v-for="item in products" 
+            :key="item.productId" 
+            class="product-card"
+            @click="viewDetail(item)"
+          >
+            <view class="product-image">
+              <Icon name="product" :size="60" color="#fff" />
             </view>
-            <view class="stock-badge">
-              <text class="stock-label">库存</text>
-              <text class="stock-value">{{ getStock(item.productId) }}</text>
+            <view class="product-content">
+              <text class="product-name">{{ item.name }}</text>
+              <text class="product-spec">{{ item.spec || '-' }}</text>
+              <view class="product-footer">
+                <view class="price-wrapper">
+                  <text class="price">¥{{ item.price }}</text>
+                  <text class="unit">/{{ item.unit }}</text>
+                </view>
+                <view class="stock-badge">
+                  <text class="stock-label">库存</text>
+                  <text class="stock-value">{{ getStock(item.productId) }}</text>
+                </view>
+              </view>
             </view>
           </view>
+          
+          <!-- 空状态 -->
+          <view v-if="products.length === 0" class="empty">
+            <Icon name="product" :size="80" color="#ccc" />
+            <text class="empty-text">暂无商品</text>
+          </view>
         </view>
-      </view>
 
-      <!-- 空状态 -->
-      <view v-if="products.length === 0" class="empty">
-        <text class="empty-icon">📭</text>
-        <text class="empty-text">暂无商品</text>
-      </view>
-    </view>
-
-    <!-- 加载更多 -->
-    <view v-if="products.length > 0" class="load-more">
-      <text>{{ loading ? '加载中...' : (hasMore ? '上拉加载更多' : '没有更多了') }}</text>
+        <!-- 加载更多 -->
+        <view v-if="products.length > 0" class="load-more">
+          <text>{{ loading ? '加载中...' : (hasMore ? '上拉加载更多' : '没有更多了') }}</text>
+        </view>
+      </scroll-view>
     </view>
   </view>
 </template>
@@ -159,7 +161,6 @@ export default {
 </script>
 
 <style>
-/* 全局 */
 .page {
   min-height: 100vh;
   background: #f8f9fa;
@@ -180,15 +181,11 @@ export default {
   height: 80rpx;
 }
 
-.search-icon {
-  font-size: 32rpx;
-  margin-right: 16rpx;
-}
-
 .search-input {
   flex: 1;
   font-size: 28rpx;
   color: #333;
+  margin-left: 16rpx;
 }
 
 .placeholder {
@@ -198,8 +195,7 @@ export default {
 /* 左侧分类 + 右侧商品布局 */
 .content-wrapper {
   display: flex;
-  flex: 1;
-  overflow: hidden;
+  height: calc(100vh - 130rpx);
 }
 
 /* 左侧分类侧边栏 */
@@ -228,14 +224,6 @@ export default {
 /* 右侧商品列表 */
 .product-scroll {
   flex: 1;
-  height: calc(100vh - 180rpx);
-  background: #f8f9fa;
-}
-
-/* 右侧商品列表 */
-.product-scroll {
-  flex: 1;
-  height: calc(100vh - 180rpx);
   background: #f8f9fa;
 }
 
@@ -272,10 +260,6 @@ export default {
   justify-content: center;
 }
 
-.product-emoji {
-  font-size: 80rpx;
-}
-
 .product-content {
   padding: 20rpx;
 }
@@ -350,14 +334,10 @@ export default {
   align-items: center;
 }
 
-.empty-icon {
-  font-size: 100rpx;
-  margin-bottom: 20rpx;
-}
-
 .empty-text {
   font-size: 28rpx;
   color: #999;
+  margin-top: 20rpx;
 }
 
 /* 加载更多 */