美化搜索框样式并删除冗余文件

pages/buyer/index.js

@@ -1067,24 +1067,6 @@ 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

pages/buyer/index.wxml

@@ -1,12 +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 class="search-bar-container">
+<view class="search-bar">
-  <view class="search-box">
+  <view class="search-container">
-    <image class="search-icon" src="/images/logo.svg" mode="aspectFit"></image>
+    <view class="search-icon">🔍</view>
     <input 
       class="search-input"
-      placeholder="搜索商品名称或品种" 
+      placeholder="输入商品名称或品种" 
       bindinput="onSearchInput" 
       bindconfirm="searchGoods"
       value="{{searchKeyword}}"
@@ -15,7 +14,7 @@
 </view>
 
 <!-- 商品列表 -->
-<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 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 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;">

pages/buyer/index.wxss

@@ -5,49 +5,52 @@
 }
 
 /* 搜索框样式 */
-.search-bar-container {
+.search-bar {
   position: fixed;
   top: 0;
   left: 0;
   right: 0;
   padding: 20rpx;
-  background-color: #ffffff;
+  background-color: transparent;
-  z-index: 1000;
+  z-index: 100;
-  box-shadow: 0 2rpx 20rpx rgba(0, 0, 0, 0.08);
   box-sizing: border-box;
 }
 
-.search-box {
+.search-container {
-  width: 90%;
   display: flex;
   align-items: center;
-  background-color: #f7f8fa;
+  border: 1rpx solid rgba(0, 0, 0, 0.08);
-  border-radius: 50rpx;
+  border-radius: 40rpx;
+  background-color: white;
   padding: 0 30rpx;
   margin: 0 auto;
-  height: 88rpx;
+  width: 90%;
+  height: 80rpx;
+  box-sizing: border-box;
   transition: all 0.3s ease;
 }
 
-.search-box:focus-within {
+.search-container:focus-within {
-  background-color: #ffffff;
+  border-color: #07c160;
-  box-shadow: 0 4rpx 24rpx rgba(0, 0, 0, 0.12);
+  background-color: white;
-  transform: translateY(-2rpx);
+  box-shadow: 0 0 0 4rpx rgba(7, 193, 96, 0.1);
 }
 
 .search-icon {
-  width: 40rpx;
+  font-size: 30rpx;
-  height: 40rpx;
+  color: #999;
   margin-right: 20rpx;
-  opacity: 0.4;
 }
 
 .search-input {
   flex: 1;
-  height: 100%;
+  font-size: 30rpx;
-  font-size: 32rpx;
   color: #333;
   background-color: transparent;
+  border: none;
+  outline: none;
+  height: 60rpx;
+  line-height: 60rpx;
 }
 
 .search-input::placeholder {

pages/seller/index.js

@@ -237,16 +237,6 @@ Page({
     });
   },
 
-  // 清除搜索
-  clearSearch() {
-    this.setData({
-      searchKeyword: ''
-    }, () => {
-      // 重新加载所有数据
-      this.loadSupplies();
-    });
-  },
-
   // 处理搜索输入
   onSearchInput(e) {
     this.setData({

pages/seller/index.wxml

@@ -23,15 +23,14 @@
   <!-- 搜索框 -->
   <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>
   

pages/seller/index.wxss

@@ -23,67 +23,6 @@ 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;