From 983fe17c0dbaadf9146230fb7267bbc34b5304f7 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: Thu, 4 Dec 2025 13:05:36 +0800
Subject: [PATCH] =?UTF-8?q?=E7=BE=8E=E5=8C=96buyer=E9=A1=B5=E9=9D=A2?=
 =?UTF-8?q?=E6=90=9C=E7=B4=A2=E6=A1=86=EF=BC=8C=E6=B7=BB=E5=8A=A0=E7=8E=B0?=
 =?UTF-8?q?=E4=BB=A3=E6=A0=B7=E5=BC=8F=E5=92=8C=E7=BD=AE=E9=A1=B6=E6=98=BE?=
 =?UTF-8?q?=E7=A4=BA?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 pages/buyer/index.js    | 18 ++++++++++++
 pages/buyer/index.wxml  |  9 +++---
 pages/buyer/index.wxss  | 51 ++++++++++++++++++++++++++++++++++
 pages/seller/index.js   | 10 +++++++
 pages/seller/index.wxml |  3 +-
 pages/seller/index.wxss | 61 +++++++++++++++++++++++++++++++++++++++++
 6 files changed, 147 insertions(+), 5 deletions(-)

diff --git a/pages/buyer/index.js b/pages/buyer/index.js
index 044b6af..6608e8a 100644
--- a/pages/buyer/index.js
+++ b/pages/buyer/index.js
@@ -1067,6 +1067,24 @@ Page({
     });
   },
 
+  // 清除搜索
+  clearSearch() {
+    this.setData({
+      searchKeyword: '',
+      page: 1,
+      hasMoreData: true,
+      selectedCategory: '全部'
+    }, () => {
+      // 重新加载第一页数据
+      this.loadGoods().then(() => {
+        console.log('清除搜索后数据加载完成');
+      }).catch(err => {
+        console.error('清除搜索后数据加载失败:', err);
+        this.fallbackToLocalStorageWithPagination();
+      });
+    });
+  },
+
   // 搜索输入处理
   onSearchInput(e) {
     const searchKeyword = e.detail.value
diff --git a/pages/buyer/index.wxml b/pages/buyer/index.wxml
index 430eed1..7dcc0c1 100644
--- a/pages/buyer/index.wxml
+++ b/pages/buyer/index.wxml
@@ -1,10 +1,11 @@
 <view class="container" style="align-items: flex-start; padding: 20rpx; width: 100%; max-width: 100vw; overflow-x: hidden; position: relative; box-sizing: border-box;">
 
 <!-- 搜索框 -->
-<view style="position: fixed; top: 0; left: 0; right: 0; padding: 20rpx; background-color: white; z-index: 100; box-shadow: 0 2rpx 10rpx rgba(0,0,0,0.1); box-sizing: border-box;">
-  <view style="width: 90%; display: flex; border: 1rpx solid #ddd; border-radius: 40rpx; overflow: hidden; margin: 0 auto;">
+<view class="search-bar-container">
+  <view class="search-box">
+    <image class="search-icon" src="/images/logo.svg" mode="aspectFit"></image>
     <input 
-      style="width: 100%; padding: 20rpx 30rpx;"
+      class="search-input"
       placeholder="搜索商品名称或品种" 
       bindinput="onSearchInput" 
       bindconfirm="searchGoods"
@@ -14,7 +15,7 @@
 </view>
 
 <!-- 商品列表 -->
-<view class="goods-list" style="width: 100%; display: flex; flex-direction: column; align-items: flex-start; min-height: 400rpx; margin-top: 120rpx;" bindscrolltolower="onReachBottom" bindscroll="onScroll">
+<view class="goods-list" style="width: 100%; display: flex; flex-direction: column; align-items: flex-start; min-height: 400rpx; margin-top: 160rpx;" bindscrolltolower="onReachBottom" bindscroll="onScroll">
   <view wx:if="{{filteredGoods.length > 0}}" wx:for="{{filteredGoods}}" wx:key="id" wx:for-item="item" wx:for-index="index" class="card" style="width: 100%; margin-top: 0; margin-bottom: 20rpx;">
     <!-- 图片和信息1:1比例并排显示 -->
     <view style="display: flex; width: 100%; border-radius: 8rpx; overflow: hidden; background-color: #f5f5f5;">
diff --git a/pages/buyer/index.wxss b/pages/buyer/index.wxss
index 02c7865..d0b7a52 100644
--- a/pages/buyer/index.wxss
+++ b/pages/buyer/index.wxss
@@ -4,6 +4,57 @@
   background-color: #f5f5f5;
 }
 
+/* 搜索框样式 */
+.search-bar-container {
+  position: fixed;
+  top: 0;
+  left: 0;
+  right: 0;
+  padding: 20rpx;
+  background-color: #ffffff;
+  z-index: 1000;
+  box-shadow: 0 2rpx 20rpx rgba(0, 0, 0, 0.08);
+  box-sizing: border-box;
+}
+
+.search-box {
+  width: 90%;
+  display: flex;
+  align-items: center;
+  background-color: #f7f8fa;
+  border-radius: 50rpx;
+  padding: 0 30rpx;
+  margin: 0 auto;
+  height: 88rpx;
+  transition: all 0.3s ease;
+}
+
+.search-box:focus-within {
+  background-color: #ffffff;
+  box-shadow: 0 4rpx 24rpx rgba(0, 0, 0, 0.12);
+  transform: translateY(-2rpx);
+}
+
+.search-icon {
+  width: 40rpx;
+  height: 40rpx;
+  margin-right: 20rpx;
+  opacity: 0.4;
+}
+
+.search-input {
+  flex: 1;
+  height: 100%;
+  font-size: 32rpx;
+  color: #333;
+  background-color: transparent;
+}
+
+.search-input::placeholder {
+  color: #999;
+  font-size: 30rpx;
+}
+
 .title {
   font-size: 36rpx;
   font-weight: bold;
diff --git a/pages/seller/index.js b/pages/seller/index.js
index f581ad8..11d8a85 100644
--- a/pages/seller/index.js
+++ b/pages/seller/index.js
@@ -237,6 +237,16 @@ Page({
     });
   },
 
+  // 清除搜索
+  clearSearch() {
+    this.setData({
+      searchKeyword: ''
+    }, () => {
+      // 重新加载所有数据
+      this.loadSupplies();
+    });
+  },
+
   // 处理搜索输入
   onSearchInput(e) {
     this.setData({
diff --git a/pages/seller/index.wxml b/pages/seller/index.wxml
index 5878b28..2e48cbd 100644
--- a/pages/seller/index.wxml
+++ b/pages/seller/index.wxml
@@ -23,14 +23,15 @@
   <!-- 搜索框 -->
   <view class="search-container">
     <view class="search-box">
+      <view class="search-icon">🔍</view>
       <input 
         class="search-input"
         placeholder="搜索货源名称或品种" 
         bindinput="onSearchInput" 
         bindconfirm="searchSupplies"
         value="{{searchKeyword}}"
-        style="width: 100%;"
       />
+      <view wx:if="searchKeyword" class="clear-icon" bindtap="clearSearch">✕</view>
     </view>
   </view>
   
diff --git a/pages/seller/index.wxss b/pages/seller/index.wxss
index 467a0f5..abfb65d 100644
--- a/pages/seller/index.wxss
+++ b/pages/seller/index.wxss
@@ -23,6 +23,67 @@ button {
   background-color: #fafafa;
 }
 
+/* 搜索框样式 */
+.search-container {
+  position: relative;
+  padding: 20rpx 0;
+  z-index: 10;
+  box-sizing: border-box;
+}
+
+.search-box {
+  width: 90%;
+  display: flex;
+  align-items: center;
+  background-color: #f8f9fa;
+  border: 2rpx solid #e9ecef;
+  border-radius: 50rpx;
+  padding: 0 20rpx;
+  margin: 0 auto;
+  transition: all 0.3s ease;
+}
+
+.search-box:focus-within {
+  border-color: #07c160;
+  box-shadow: 0 0 0 4rpx rgba(7, 193, 96, 0.1);
+  background-color: white;
+}
+
+.search-icon {
+  font-size: 28rpx;
+  color: #999;
+  margin-right: 16rpx;
+}
+
+.search-input {
+  flex: 1;
+  padding: 24rpx 0;
+  font-size: 28rpx;
+  color: #333;
+  background-color: transparent;
+  border: none;
+  outline: none;
+}
+
+.search-input::placeholder {
+  color: #ccc;
+}
+
+.clear-icon {
+  font-size: 24rpx;
+  color: #999;
+  padding: 8rpx;
+  border-radius: 50%;
+  background-color: #e9ecef;
+  cursor: pointer;
+  transition: all 0.2s ease;
+}
+
+.clear-icon:hover {
+  background-color: #dee2e6;
+  color: #666;
+}
+
 /* 页面标题栏 */
 .title-bar {
   display: flex;