From a540b4b484328ae1eaf58404b59c5737c9d7c3ee Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?=E5=BE=90=E9=A3=9E=E6=B4=8B?=
 <15778543+xufeiyang6017@user.noreply.gitee.com>
Date: Wed, 7 Jan 2026 13:41:15 +0800
Subject: [PATCH] =?UTF-8?q?=E6=9B=B4=E6=96=B0=E5=95=86=E5=93=81=E7=9B=B8?=
 =?UTF-8?q?=E5=85=B3=E9=A1=B5=E9=9D=A2?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 pages/goods-update/goods-update.wxml |  71 ++---
 pages/goods-update/goods-update.wxss | 378 ++++++++++++++++++++++++++-
 pages/goods/index.wxml               | 120 ++++-----
 pages/goods/index.wxss               |  10 +-
 4 files changed, 475 insertions(+), 104 deletions(-)

diff --git a/pages/goods-update/goods-update.wxml b/pages/goods-update/goods-update.wxml
index e777584..db972c6 100644
--- a/pages/goods-update/goods-update.wxml
+++ b/pages/goods-update/goods-update.wxml
@@ -52,24 +52,24 @@
 
     <!-- 商品基本信息 -->
     <view class="goods-info">
-      <view style="display: flex; align-items: center; justify-content: space-between; margin-bottom: 10rpx;">
-        <view style="display: flex; align-items: center; flex: 1;">
-          <view style="display: inline-block; margin-right: 10rpx; font-size: 18rpx; color: #fff; background: rgba(218, 165, 32, 0.8); padding: 4rpx 10rpx; border-radius: 15rpx; vertical-align: middle; backdrop-filter: blur(10rpx); border: 1rpx solid rgba(255, 255, 255, 0.3); box-shadow: 0 4rpx 12rpx rgba(0, 0, 0, 0.15), inset 0 1rpx 0 rgba(255, 255, 255, 0.5); text-shadow: 0 1rpx 2rpx rgba(0, 0, 0, 0.2); font-weight: bold; margin-top: -20rpx;">{{goodsDetail.supplyStatus || '暂无状态'}}</view>
+      <view class="goods-header">
+        <view class="goods-name-container">
+          <view class="supply-status-badge">{{goodsDetail.supplyStatus || '暂无状态'}}</view>
           <text class="goods-name">{{goodsDetail.name}}</text>
-          <span style="vertical-align: middle; font-size: 20rpx; color: white; background: linear-gradient(135deg, #4a90e2 0%, #2b66f0 50%, #1a4bbd 100%); padding: 4rpx 8rpx; clip-path: polygon(50% 0%, 70% 10%, 100% 30%, 100% 70%, 70% 90%, 50% 100%, 30% 90%, 0% 70%, 0% 30%, 30% 10%); margin-left: 8rpx; box-shadow: 0 2rpx 4rpx rgba(0, 0, 0, 0.3), inset 0 1rpx 2rpx rgba(255, 255, 255, 0.5); text-shadow: 0 1rpx 2rpx rgba(0, 0, 0, 0.5); font-weight: bold; margin-top: -20rpx;">V</span>
+          <span class="verified-badge">V</span>
         </view>
-        <view style="display: flex; align-items: flex-start;">
-          <view class="source-type-badge" style="display: flex; align-items: center; justify-content: center; margin-right: 10rpx;">
+        <view class="source-type-container">
+          <view class="source-type-badge">
             <text style="color: {{goodsDetail.sourceTypeColor}}; font-weight: bold;">{{goodsDetail.sourceType || '暂无'}}</text>
           </view>
         </view>
       </view>
-      <view class="goods-price" style="position: relative; display: flex; align-items: center; justify-content: space-between;">
-        <view style="display: flex; align-items: center;">
+      <view class="goods-price">
+        <view class="price-item">
           <text class="price-symbol">销售价格:</text>
           <text class="price-value">{{goodsDetail.price || '暂无'}}</text>
         </view>
-        <view style="display: flex; align-items: center;">
+        <view class="price-item">
           <text class="price-symbol">采购价格:</text>
           <text class="price-value">{{goodsDetail.costprice || '暂无'}}</text>
         </view>
@@ -140,12 +140,12 @@
     </view>
     
     <!-- 货源描述 -->
-    <view class="goods-description product-description" wx:if="{{goodsDetail.description || goodsDetail.remark || true}}">
-      <view class="gd-label-container">
-        <text class="gd-label">货源描述</text>
-      </view>
-      <view class="gd-content">
-        <text class="gd-value">{{goodsDetail.description || goodsDetail.remark || '暂无描述'}}</text>
+    <view class="goods-description" wx:if="{{goodsDetail.description || goodsDetail.remark || true}}">
+      <view class="wq-title">货源描述</view>
+      <view class="wq-list">
+        <view class="wq-item">
+          <text class="wq-text">{{goodsDetail.description || goodsDetail.remark || '暂无描述'}}</text>
+        </view>
       </view>
     </view>
 
@@ -198,28 +198,28 @@
   </view>
 
   <!-- 编辑货源弹窗（全屏） -->
-  <view class="modal" wx:if="{{showEditModal}}" style="position: fixed; top: 0; left: 0; right: 0; bottom: 0; background: white; z-index: 999;">
+  <view class="modal" wx:if="{{showEditModal}}">
     <!-- 顶部导航栏 -->
-    <view style="display: flex; justify-content: space-between; align-items: center; padding: 30rpx; border-bottom: 1rpx solid #eee; background-color: #fafafa; position: sticky; top: 0; z-index: 10;">
-      <view bindtap="hideEditModal" style="font-size: 32rpx; color: #666;">取消</view>
-      <view style="font-size: 32rpx; font-weight: bold; color: #333;">编辑货源</view>
-      <view bindtap="saveEdit" style="font-size: 32rpx; color: #07c160;">提交</view>
+    <view class="modal-header">
+      <view class="modal-btn cancel-btn" bindtap="hideEditModal">取消</view>
+      <view class="modal-title">编辑货源</view>
+      <view class="modal-btn confirm-btn" bindtap="saveEdit">提交</view>
     </view>
     
-    <scroll-view scroll-y="true" style="height: calc(100vh - 90rpx); overflow-y: auto; -webkit-overflow-scrolling: touch; padding: 40rpx 60rpx; box-sizing: border-box;">
+    <scroll-view scroll-y="true" style="height: calc(100vh - 160rpx); overflow-y: auto; -webkit-overflow-scrolling: touch; padding: 160rpx 60rpx 40rpx; box-sizing: border-box;">
         <view>
         
-        <view style="font-size: 28rpx; font-weight: 500; color: #333; margin-bottom: 12rpx; margin-left: 10rpx;">销售价格</view>
-        <input class="input" type="text" placeholder="请输入销售价格" bindinput="onEditInput" data-field="price" value="{{editSupply.price}}" style="width: 100%; height: 90rpx; line-height: 90rpx; padding: 0 24rpx; font-size: 30rpx; border: 2rpx solid #eee; border-radius: 12rpx; box-sizing: border-box; margin: 0 auto 30rpx; display: block;" placeholder-style="font-size: 24rpx; color: #999; text-align: left;"></input>
+        <view class="edit-form-label">销售价格</view>
+        <input class="edit-form-input" type="text" placeholder="请输入销售价格" bindinput="onEditInput" data-field="price" value="{{editSupply.price}}"></input>
         
-        <view style="font-size: 28rpx; font-weight: 500; color: #333; margin-bottom: 12rpx; margin-left: 10rpx;">联系人</view>
-        <view bindtap="openSalesPersonModal" style="width: 100%; height: 90rpx; line-height: 90rpx; padding: 0 24rpx; font-size: 30rpx; border: 2rpx solid #eee; border-radius: 12rpx; box-sizing: border-box; margin: 0 auto 30rpx; display: flex; align-items: center; justify-content: space-between; background: white;" placeholder-style="font-size: 24rpx; color: #999; text-align: left;">
-          <text style="{{editSupply.product_contact ? 'color: #333;' : 'color: #999;'}}">{{editSupply.product_contact || '请选择联系人'}}</text>
-          <text style="color: #999; font-size: 24rpx;">▼</text>
+        <view class="edit-form-label">联系人</view>
+        <view class="edit-form-select" bindtap="openSalesPersonModal">
+          <text class="select-text">{{editSupply.product_contact || '请选择联系人'}}</text>
+          <text class="select-arrow">▼</text>
         </view>
         
-        <view style="font-size: 28rpx; font-weight: 500; color: #333; margin-bottom: 12rpx; margin-left: 10rpx;">联系电话</view>
-        <input class="input" type="number" placeholder="请输入联系电话" bindinput="onEditInput" data-field="contact_phone" value="{{editSupply.contact_phone}}" style="width: 100%; height: 90rpx; line-height: 90rpx; padding: 0 24rpx; font-size: 30rpx; border: 2rpx solid #eee; border-radius: 12rpx; box-sizing: border-box; margin: 0 auto 30rpx; display: block;" placeholder-style="font-size: 24rpx; color: #999; text-align: left;"></input>
+        <view class="edit-form-label">联系电话</view>
+        <input class="edit-form-input" type="number" placeholder="请输入联系电话" bindinput="onEditInput" data-field="contact_phone" value="{{editSupply.contact_phone}}"></input>
         
         <!-- 添加底部空白区域 -->
         <view style="height: 20vh; background: transparent;"></view>
@@ -228,10 +228,10 @@
   </view>
 
   <!-- 图片预览弹窗 -->
-  <view class="image-preview-mask" wx:if="{{showImagePreview}}" style="position: fixed; top: 0; left: 0; right: 0; bottom: 0; background: rgba(0, 0, 0, 0.9); display: flex; justify-content: center; align-items: center; z-index: 9999;" catchtouchmove="true" bindtap="closeImagePreview">
-    <view style="width: 100%; height: 100%; display: flex; justify-content: center; align-items: center;">
+  <view class="image-preview-mask" wx:if="{{showImagePreview}}" catchtouchmove="true" bindtap="closeImagePreview">
+    <view class="image-preview-content">
       <swiper 
-        style="width: 100%; height: 100%;" 
+        class="image-preview-swiper"
         current="{{previewImageIndex}}" 
         bindchange="onPreviewImageChange" 
         indicator-dots="true" 
@@ -242,7 +242,8 @@
             <image 
               src="{{item}}" 
               mode="aspectFit" 
-              style="width: 100%; height: 100%; transform: scale({{scale}}) translate({{offsetX}}px, {{offsetY}}px); transform-origin: center; transition: transform 0.1s;" 
+              class="preview-image"
+              style="transform: scale({{scale}}) translate({{offsetX}}px, {{offsetY}}px);" 
               bindtap="handleImageTap"
               bindtouchstart="handleTouchStart"
               bindtouchmove="handleTouchMove"
@@ -252,8 +253,8 @@
           </swiper-item>
         </block>
       </swiper>
-      <view style="position: absolute; top: 40rpx; right: 40rpx; color: white; font-size: 40rpx;">
-        <text bindtap="closeImagePreview" style="background: rgba(0,0,0,0.5); padding: 10rpx 20rpx; border-radius: 50%;">×</text>
+      <view class="image-preview-close">
+        <text bindtap="closeImagePreview">×</text>
       </view>
     </view>
   </view>
diff --git a/pages/goods-update/goods-update.wxss b/pages/goods-update/goods-update.wxss
index 33b55b5..a8c1297 100644
--- a/pages/goods-update/goods-update.wxss
+++ b/pages/goods-update/goods-update.wxss
@@ -152,6 +152,61 @@ video.slider-media .wx-video-volume-icon {
   margin-top: 0; /* 移除负外边距，让图片和信息自然衔接 */
 }
 
+/* 商品头部信息 */
+.goods-header {
+  display: flex;
+  align-items: center;
+  justify-content: space-between;
+  margin-bottom: 10rpx;
+}
+
+.goods-name-container {
+  display: flex;
+  align-items: center;
+  flex: 1;
+}
+
+.supply-status-badge {
+  display: inline-block;
+  margin-right: 10rpx;
+  font-size: 18rpx;
+  color: #fff;
+  background: rgba(218, 165, 32, 0.8);
+  padding: 4rpx 10rpx;
+  border-radius: 15rpx;
+  vertical-align: middle;
+  backdrop-filter: blur(10rpx);
+  border: 1rpx solid rgba(255, 255, 255, 0.3);
+  box-shadow: 0 4rpx 12rpx rgba(0, 0, 0, 0.15), inset 0 1rpx 0 rgba(255, 255, 255, 0.5);
+  text-shadow: 0 1rpx 2rpx rgba(0, 0, 0, 0.2);
+  font-weight: bold;
+  margin-top: -20rpx;
+}
+
+.verified-badge {
+  vertical-align: middle;
+  font-size: 20rpx;
+  color: white;
+  background: linear-gradient(135deg, #4a90e2 0%, #2b66f0 50%, #1a4bbd 100%);
+  padding: 4rpx 8rpx;
+  clip-path: polygon(50% 0%, 70% 10%, 100% 30%, 100% 70%, 70% 90%, 50% 100%, 30% 90%, 0% 70%, 0% 30%, 30% 10%);
+  margin-left: 8rpx;
+  box-shadow: 0 2rpx 4rpx rgba(0, 0, 0, 0.3), inset 0 1rpx 2rpx rgba(255, 255, 255, 0.5);
+  text-shadow: 0 1rpx 2rpx rgba(0, 0, 0, 0.5);
+  font-weight: bold;
+  margin-top: -20rpx;
+}
+
+.source-type-container {
+  display: flex;
+  align-items: flex-start;
+}
+
+.price-item {
+  display: flex;
+  align-items: center;
+}
+
 .goods-info::after {
   content: '';
   position: absolute;
@@ -346,6 +401,31 @@ video.slider-media .wx-video-volume-icon {
   border: 1px solid #f0f0f0;
 }
 
+.gd-label-container {
+  margin-bottom: 8px;
+  padding-bottom: 4px;
+  border-bottom: 1px solid #e8f4ff;
+}
+
+.gd-label {
+  font-size: 16px;
+  font-weight: 600;
+  color: #262626;
+}
+
+.gd-content {
+  padding: 8px 0;
+}
+
+.gd-value {
+  font-size: 15px;
+  line-height: 1.5;
+  color: #595959;
+  font-weight: 400;
+  white-space: pre-wrap;
+  font-family: inherit;
+}
+
 .description-content {
   margin-top: 8px;
   padding: 8px 0;
@@ -357,6 +437,7 @@ video.slider-media .wx-video-volume-icon {
   color: #595959;
   font-weight: 400;
   white-space: pre-wrap;
+  font-family: inherit;
 }
 
 /* 联系信息 */
@@ -696,21 +777,22 @@ video.slider-media .wx-video-volume-icon {
 
 /* 同步 goods 页面的 product-description 样式 */
 .product-description {
-  font-size: 22rpx;
+  font-size: 28rpx;
   color: #666;
-  line-height: 1.4;
+  line-height: 1.6;
   overflow: hidden;
   text-overflow: ellipsis;
   display: -webkit-box;
   -webkit-line-clamp: 2;
   -webkit-box-orient: vertical;
-  margin: 6rpx 0;
+  margin: 12rpx 0;
   background: #fafafa;
-  padding: 6rpx;
+  padding: 12rpx;
   border-radius: 8rpx;
   border: 1rpx solid #f0f0f0;
   width: 100%;
   box-sizing: border-box;
+  font-family: inherit;
 }
 
 /* 联系信息 */
@@ -802,6 +884,117 @@ video.slider-media .wx-video-volume-icon {
   gap: 12rpx;
 }
 
+/* 编辑表单样式 */
+.edit-form-label {
+  font-size: 28rpx;
+  font-weight: 500;
+  color: #333;
+  margin-bottom: 12rpx;
+  margin-left: 10rpx;
+  font-family: inherit;
+}
+
+.edit-form-input {
+  width: 100%;
+  height: 90rpx;
+  line-height: 90rpx;
+  padding: 0 24rpx;
+  font-size: 30rpx;
+  border: 2rpx solid #eee;
+  border-radius: 12rpx;
+  box-sizing: border-box;
+  margin: 0 auto 30rpx;
+  display: block;
+  font-family: inherit;
+  color: #333;
+}
+
+.edit-form-input::placeholder {
+  font-size: 24rpx;
+  color: #999;
+  text-align: left;
+  font-family: inherit;
+}
+
+.edit-form-select {
+  width: 100%;
+  height: 90rpx;
+  line-height: 90rpx;
+  padding: 0 24rpx;
+  font-size: 30rpx;
+  border: 2rpx solid #eee;
+  border-radius: 12rpx;
+  box-sizing: border-box;
+  margin: 0 auto 30rpx;
+  display: flex;
+  align-items: center;
+  justify-content: space-between;
+  background: white;
+  font-family: inherit;
+}
+
+.select-text {
+  color: #333;
+  font-family: inherit;
+}
+
+.select-text:empty::before {
+  content: '请选择联系人';
+  color: #999;
+}
+
+.select-arrow {
+  color: #999;
+  font-size: 24rpx;
+  font-family: inherit;
+}
+
+/* 模态框样式 */
+.modal {
+  position: fixed;
+  top: 0;
+  left: 0;
+  right: 0;
+  bottom: 0;
+  background: white;
+  z-index: 999;
+}
+
+.modal-header {
+  display: flex;
+  justify-content: space-between;
+  align-items: center;
+  padding: 30rpx;
+  border-bottom: 1rpx solid #eee;
+  background-color: #ffffff;
+  position: fixed;
+  top: 0;
+  left: 0;
+  right: 0;
+  z-index: 1000;
+  box-shadow: 0 2rpx 8rpx rgba(0, 0, 0, 0.05);
+}
+
+.modal-btn {
+  font-size: 32rpx;
+  font-family: inherit;
+}
+
+.cancel-btn {
+  color: #666;
+}
+
+.modal-title {
+  font-size: 32rpx;
+  font-weight: bold;
+  color: #333;
+  font-family: inherit;
+}
+
+.confirm-btn {
+  color: #07c160;
+}
+
 .creator-item {
   display: flex;
   align-items: center;
@@ -875,6 +1068,183 @@ video.slider-media .wx-video-volume-icon {
   }
 }
 
+/* 模态弹窗通用样式 */
+.modal-overlay {
+  position: fixed;
+  top: 0;
+  left: 0;
+  right: 0;
+  bottom: 0;
+  background-color: rgba(0, 0, 0, 0.5);
+  display: flex;
+  justify-content: center;
+  align-items: center;
+  z-index: 9999;
+  catchtouchmove: true;
+}
+
+.modal-bottom {
+  position: fixed;
+  bottom: 0;
+  left: 0;
+  right: 0;
+  background: white;
+  border-radius: 20rpx 20rpx 0 0;
+  max-height: 80vh;
+}
+
+.modal-header-bar {
+  padding: 20rpx;
+  display: flex;
+  justify-content: space-between;
+  align-items: center;
+  border-bottom: 1rpx solid #eee;
+}
+
+.modal-header-btn {
+  font-size: 32rpx;
+  color: #333;
+  padding: 10rpx 20rpx;
+  font-family: inherit;
+}
+
+.modal-header-confirm-btn {
+  color: #07c160;
+}
+
+.modal-scroll-view {
+  max-height: 60vh;
+  padding: 0;
+  -webkit-overflow-scrolling: touch;
+}
+
+.modal-scroll-view::-webkit-scrollbar {
+  display: none;
+}
+
+/* 搜索框样式 */
+.modal-search-container {
+  padding: 20rpx;
+}
+
+.modal-search-box {
+  position: relative;
+  background: #f5f5f5;
+  border-radius: 40rpx;
+  padding: 0 30rpx;
+}
+
+.modal-search-input {
+  width: 100%;
+  height: 70rpx;
+  line-height: 70rpx;
+  font-size: 28rpx;
+  background: transparent;
+  font-family: inherit;
+}
+
+.modal-search-clear {
+  position: absolute;
+  right: 30rpx;
+  top: 50%;
+  transform: translateY(-50%);
+  color: #999;
+}
+
+/* 选择列表样式 */
+.modal-select-item {
+  padding: 32rpx 40rpx;
+  border-bottom: 1rpx solid #f0f0f0;
+  font-size: 32rpx;
+  color: #131413;
+  text-align: center;
+  font-family: inherit;
+}
+
+.modal-select-item.selected {
+  color: #07c160;
+}
+
+.modal-select-item-text {
+  font-size: 32rpx;
+  font-weight: 500;
+  font-family: inherit;
+}
+
+.modal-select-item-subtext {
+  font-size: 24rpx;
+  color: #999;
+  margin-top: 8rpx;
+  font-family: inherit;
+}
+
+/* 规格选择弹窗样式 */
+.spec-select-modal {
+  position: fixed;
+  top: 0;
+  left: 0;
+  right: 0;
+  bottom: 0;
+  background: rgba(0,0,0,0.5);
+  display: flex;
+  justify-content: center;
+  z-index: 9999;
+  catchtouchmove: true;
+}
+
+.spec-item {
+  padding: 30rpx 40rpx;
+  border-bottom: 1rpx solid #f0f0f0;
+  font-size: 28rpx;
+  color: #333;
+  text-align: left;
+  font-family: inherit;
+}
+
+.spec-item.selected {
+  color: #07c160;
+}
+
+/* 图片预览弹窗样式 */
+.image-preview-mask {
+  position: fixed;
+  top: 0;
+  left: 0;
+  right: 0;
+  bottom: 0;
+  background: rgba(0, 0, 0, 0.9);
+  display: flex;
+  justify-content: center;
+  align-items: center;
+  z-index: 9999;
+  catchtouchmove: true;
+}
+
+.image-preview-content {
+  width: 100%;
+  height: 100%;
+  display: flex;
+  justify-content: center;
+  align-items: center;
+}
+
+.image-preview-swiper {
+  width: 100%;
+  height: 100%;
+}
+
+.image-preview-close {
+  position: absolute;
+  top: 40rpx;
+  right: 40rpx;
+  color: white;
+  font-size: 40rpx;
+  background: rgba(0,0,0,0.5);
+  padding: 10rpx 20rpx;
+  border-radius: 50%;
+  font-family: inherit;
+}
+
 /* 登录弹窗样式 */
 .auth-modal-overlay {
   position: fixed;
diff --git a/pages/goods/index.wxml b/pages/goods/index.wxml
index a7ea5e9..0dbdda8 100644
--- a/pages/goods/index.wxml
+++ b/pages/goods/index.wxml
@@ -1,64 +1,4 @@
 <view class="container">
-  <!-- 页面标题 -->
-  <view class="page-title">
-    <text>内部货源管理</text>
-  </view>
-
-  <!-- 搜索框 -->
-  <view class="search-container">
-    <view class="search-box">
-      <input 
-        class="search-input"
-        placeholder="搜索货源名称或创建人" 
-        bindinput="onSearchInput" 
-        bindconfirm="searchGoods"
-        value="{{searchKeyword}}"
-      />
-      <view wx:if="{{searchKeyword}}" class="clear-icon" bindtap="clearSearch">✘</view>
-    </view>
-  </view>
-
-  <!-- 筛选按钮 -->
-  <view class="filter-container">
-    <view class="filter-buttons">
-      <view 
-        class="filter-btn {{activeFilter === 'all' ? 'active' : ''}}" 
-        bindtap="onFilterChange" 
-        data-filter="all"
-      >
-        全部
-      </view>
-      <view 
-        class="filter-btn {{activeFilter === 'small' ? 'active' : ''}}" 
-        bindtap="onFilterChange" 
-        data-filter="small"
-      >
-        小品种
-      </view>
-      <view 
-        class="filter-btn {{activeFilter === 'large' ? 'active' : ''}}" 
-        bindtap="onFilterChange" 
-        data-filter="large"
-      >
-        大贸易
-      </view>
-    </view>
-  </view>
-
-  <!-- 骨架屏加载 -->
-  <view wx:if="{{isLoading && goodsList.length === 0}}" class="skeleton-container">
-    <view class="skeleton-grid">
-      <view class="skeleton-grid-item" wx:for="{{[1,2,3,4,5,6,7,8]}}" wx:key="index">
-        <view class="skeleton-image"></view>
-        <view class="skeleton-title"></view>
-        <view class="skeleton-title short"></view>
-        <view class="skeleton-footer">
-          <view class="skeleton-price"></view>
-        </view>
-      </view>
-    </view>
-  </view>
-
   <!-- 商品列表区域 -->
   <view class="goods-section">
     <scroll-view 
@@ -72,6 +12,66 @@
       bindrefresherrefresh="onRefresherRefresh"
     >
       <view class="goods-list-container">
+        <!-- 页面标题 -->
+        <view class="page-title">
+          <text>内部货源管理</text>
+        </view>
+
+        <!-- 搜索框 -->
+        <view class="search-container">
+          <view class="search-box">
+            <input 
+              class="search-input"
+              placeholder="搜索货源名称或创建人" 
+              bindinput="onSearchInput" 
+              bindconfirm="searchGoods"
+              value="{{searchKeyword}}"
+            />
+            <view wx:if="{{searchKeyword}}" class="clear-icon" bindtap="clearSearch">✘</view>
+          </view>
+        </view>
+
+        <!-- 筛选按钮 -->
+        <view class="filter-container">
+          <view class="filter-buttons">
+            <view 
+              class="filter-btn {{activeFilter === 'all' ? 'active' : ''}}" 
+              bindtap="onFilterChange" 
+              data-filter="all"
+            >
+              全部
+            </view>
+            <view 
+              class="filter-btn {{activeFilter === 'small' ? 'active' : ''}}" 
+              bindtap="onFilterChange" 
+              data-filter="small"
+            >
+              小品种
+            </view>
+            <view 
+              class="filter-btn {{activeFilter === 'large' ? 'active' : ''}}" 
+              bindtap="onFilterChange" 
+              data-filter="large"
+            >
+              大贸易
+            </view>
+          </view>
+        </view>
+
+        <!-- 骨架屏加载 -->
+        <view wx:if="{{isLoading && goodsList.length === 0}}" class="skeleton-container">
+          <view class="skeleton-grid">
+            <view class="skeleton-grid-item" wx:for="{{[1,2,3,4,5,6,7,8]}}" wx:key="index">
+              <view class="skeleton-image"></view>
+              <view class="skeleton-title"></view>
+              <view class="skeleton-title short"></view>
+              <view class="skeleton-footer">
+                <view class="skeleton-price"></view>
+              </view>
+            </view>
+          </view>
+        </view>
+
         <!-- 网格布局 -->
         <view class="grid-container">
           <view 
diff --git a/pages/goods/index.wxss b/pages/goods/index.wxss
index bc5d223..18ab497 100644
--- a/pages/goods/index.wxss
+++ b/pages/goods/index.wxss
@@ -1,9 +1,9 @@
 .container {
   width: 100%;
-  padding: 20rpx;
   box-sizing: border-box;
   background-color: #f5f5f5;
-  min-height: 100vh;
+  height: 100vh;
+  overflow: hidden;
 }
 
 .page-title {
@@ -156,8 +156,8 @@
 /* 货源列表样式 - 网格布局 */
 .goods-section {
   width: 100%;
-  margin-top: 20rpx;
-  height: calc(100vh - 300rpx); /* 设置容器高度，确保scroll-view能正常滚动 */
+  height: 100vh;
+  box-sizing: border-box;
 }
 
 /* 滚动视图样式 */
@@ -168,7 +168,7 @@
 
 .goods-list-container {
   width: 100%;
-  padding: 0 10rpx;
+  padding: 20rpx;
   box-sizing: border-box;
 }