货盘页导航栏去除，修复奇数个商品样式错误，修改触底加载

pages/products/components/ProductGrid.vue

@@ -13,7 +13,7 @@
     </view>
 
     <!-- 商品网格滚动区 -->
-    <scroll-view scroll-y class="product-scroll">
+    <scroll-view scroll-y class="product-scroll" :lower-threshold="100" :scroll-top="scrollTopVal" :scroll-with-animation="false" @scrolltolower="onScrollToLower">
       <view class="product-grid" v-if="list.length > 0">
         <view
           class="product-card"
@@ -51,24 +51,11 @@
         <text class="empty-text">没有找到相关商品</text>
       </view>
 
-      <!-- 分页 -->
-      <view class="pagination" v-if="total > 0">
-        <text class="page-info">显示 {{ start }}-{{ end }} 共 {{ total }} 个产品</text>
-        <view class="page-controls">
-          <view class="page-btn" :class="{ disabled: current === 1 }" @tap="onPrev">上一页</view>
-          <view
-            class="page-num"
-            :class="{ active: current === item }"
-            v-for="(item, index) in pageNumbers"
-            :key="index"
-            @tap="onGoPage(item)"
-          >{{ item }}</view>
-          <view class="page-btn" :class="{ disabled: current === totalPages }" @tap="onNext">下一页</view>
-        </view>
-        <view class="page-size"><text>{{ pageSize }}/页</text></view>
+      <!-- 底部加载提示 -->
+      <view class="load-tip" v-if="list.length > 0">
+        <text v-if="loading">加载中...</text>
+        <text v-else-if="!hasMore">没有更多了</text>
       </view>
-
-      <view class="loading-more" v-if="loading"><text>加载中...</text></view>
     </scroll-view>
   </view>
 </template>
@@ -80,31 +67,25 @@ export default {
     list: { type: Array, default: () => [] },
     subCategories: { type: Array, default: () => [] },
     activeSubId: { type: [String, Number], default: '' },
-    total: { type: Number, default: 0 },
-    current: { type: Number, default: 1 },
-    pageSize: { type: Number, default: 10 },
-    totalPages: { type: Number, default: 1 },
-    pageNumbers: { type: Array, default: () => [] },
-    start: { type: Number, default: 1 },
-    end: { type: Number, default: 10 },
-    loading: { type: Boolean, default: false }
+    hasMore: { type: Boolean, default: true },
+    loading: { type: Boolean, default: false },
+    scrollTopVal: { type: Number, default: 0 }
   },
   methods: {
     selectSub(id) { this.$emit('sub-select', id) },
     onTapProduct(item) { this.$emit('product-click', item) },
-    onPrev() { if (this.current > 1) this.$emit('page-change', this.current - 1) },
-    onNext() { if (this.current < this.totalPages) this.$emit('page-change', this.current + 1) },
-    onGoPage(page) { this.$emit('page-change', page) }
+    onScrollToLower() { this.$emit('scroll-to-lower') }
   }
 }
 </script>
 
 <style scoped>
-/* 右侧内容区 - 上下分:顶部条件 + 下方滚动 */
+/* 右侧内容区 - 上下分:顶部条件 + 下方滚动
+   flex:1 与 height:100% 冲突，二选一（保留 flex:1） */
 .right-content {
   flex: 1;
   min-width: 0;
-  height: 100%;
+  min-height: 0;
   display: flex;
   flex-direction: column;
   background: #f2f2f2;
@@ -135,22 +116,23 @@ export default {
   color: #ff6800;
 }
 
-/* 滚动商品区 */
+/* 滚动商品区 - uni-app scroll-view 在 flex 布局里必须同时有 flex:1 + height:0
+   仅 min-height:0 无法让部分端的 scroll-view 正确计算内部 viewport 高度 */
 .product-scroll {
   flex: 1;
+  height: 0;
   min-height: 0;
   overflow: hidden;
 }
 
-/* 商品网格 - 2列自适应(避免宽度+间距同时固定导致挤压) */
+/* 商品网格 - 固定2列 grid，不会因商品个数变化而拉伸占行 */
 .product-grid {
-  display: flex;
-  flex-wrap: wrap;
+  display: grid;
+  grid-template-columns: repeat(2, 1fr);
   gap: 16rpx;
   padding: 20rpx;
 }
 .product-card {
-  flex: 1 1 calc(50% - 8rpx);
   min-width: 0;
   background: #ffffff;
   border-radius: 12rpx;
@@ -212,53 +194,8 @@ export default {
   line-height: 1.2;
 }
 
-/* 分页 */
-.pagination {
-  padding: 32rpx 20rpx;
-  display: flex;
-  flex-direction: column;
-  align-items: center;
-  gap: 20rpx;
-}
-.page-info {
-  font-size: 22rpx;
-  color: #999999;
-}
-.page-controls {
-  display: flex;
-  align-items: center;
-  gap: 12rpx;
-}
-.page-btn {
-  padding: 10rpx 20rpx;
-  font-size: 24rpx;
-  color: #666666;
-  background: #f5f5f5;
-  border-radius: 8rpx;
-}
-.page-btn.disabled {
-  color: #cccccc;
-}
-.page-num {
-  width: 56rpx;
-  height: 56rpx;
-  display: flex;
-  align-items: center;
-  justify-content: center;
-  font-size: 24rpx;
-  color: #666666;
-  background: #f5f5f5;
-  border-radius: 8rpx;
-}
-.page-num.active {
-  background: #ff6800;
-  color: #ffffff;
-}
-.page-size {
-  font-size: 22rpx;
-  color: #999999;
-}
-.loading-more {
+/* 底部加载提示 */
+.load-tip {
   padding: 32rpx;
   text-align: center;
   font-size: 24rpx;

pages/products/components/SearchBar.vue

@@ -1,6 +1,6 @@
 <template>
   <!-- 搜索栏 -->
-  <view class="search-bar">
+  <view class="search-bar" :style="{ paddingTop: statusBarHeight + 'px' }">
     <view class="search-input-wrap">
       <text class="search-icon">🔍</text>
       <input
@@ -28,6 +28,19 @@ export default {
       default: ''
     }
   },
+  data() {
+    return {
+      statusBarHeight: 20
+    }
+  },
+  created() {
+    try {
+      const sysInfo = uni.getSystemInfoSync()
+      this.statusBarHeight = sysInfo.statusBarHeight || 20
+    } catch (e) {
+      this.statusBarHeight = 20
+    }
+  },
   methods: {
     onInput(e) {
       this.$emit('input', e.detail.value)
@@ -50,6 +63,7 @@ export default {
   padding: 20rpx 32rpx;
   background: #ffffff;
   border-bottom: 2rpx solid #f5f5f5;
+  box-sizing: border-box;
 }
 .search-input-wrap {
   flex: 1;