feat(hexiao): 新增门店名称搜索功能并优化样式

- 在核销记录页面新增门店名称搜索框，支持输入搜索和清空功能
- 更新表格渲染逻辑以适配新的搜索条件
- 为搜索框和标签页添加过渡动画和响应式样式
- 优化查询按钮和标签页的视觉效果及交互反馈
- 添加媒体查询以适配小屏幕设备显示效果
- 清空搜索条件时自动触发重新查询操作

pages/hexiao/ywy/hexiao_record.vue

@@ -20,6 +20,21 @@
               </view>
             </u-col>
           </u-row>
+
+          <!-- 新增：门店名称搜索框 -->
+          <u-row customStyle="margin-bottom: 10px" gutter="20" v-if="currentTab === 3">
+            <u-col span="12">
+              <u--input
+                  v-model="storeNameQuery"
+                  placeholder="请输入门店名称"
+                  prefixIcon="search"
+                  prefixIconStyle="font-size: 22px;color: #909399"
+                  @confirm="handleSearch"
+                  @clear="handleSearch"
+                  clearable
+              ></u--input>
+            </u-col>
+          </u-row>
         </view>
       </view>
       <view class="tabs-wrapper">
@@ -53,37 +68,37 @@
           <!-- 表格内容 -->
           <view class="table-body">
 
-              <!-- 每个门店的第一行 -->
-              <view class="table-row" v-for="(store, storeIndex) in summaryList" :key="storeIndex">
-                <view class="table-cell store-col">
-                  <view class="store-name-cell">
-                    <uni-icons type="shop" size="16" color="#3c82f8"></uni-icons>
-                    <text class="store-name-text">{{ store.storeName }}</text>
+            <!-- 每个门店的第一行 -->
+            <view class="table-row" v-for="(store, storeIndex) in summaryList" :key="storeIndex">
+              <view class="table-cell store-col">
+                <view class="store-name-cell">
+                  <uni-icons type="shop" size="16" color="#3c82f8"></uni-icons>
+                  <text class="store-name-text">{{ store.storeName }}</text>
+                </view>
+              </view>
+              <view>
+                <view class="table-row-cl2" v-for="(item, itemIndex) in store.writeOffRecordDetailVos" :key="itemIndex">
+                  <view class="table-cell product-col">
+                    <text>{{ item.item }}</text>
+                  </view>
+                  <view class="table-cell number-col">
+                    <text>{{ item.writeOffAmount }}</text>
                   </view>
                 </view>
-                <view>
-                  <view class="table-row-cl2" v-for="(item, itemIndex) in store.writeOffRecordDetailVos" :key="itemIndex">
-                    <view class="table-cell product-col">
-                      <text>{{ item.item }}</text>
-                    </view>
-                    <view class="table-cell number-col">
-                      <text>{{ item.writeOffAmount }}</text>
-                    </view>
+                <view class="table-row-cl2 ">
+                  <view class="table-cell product-col">
+                    <text>汇总</text>
                   </view>
-                  <view class="table-row-cl2 ">
-                    <view class="table-cell product-col">
-                      <text>汇总</text>
-                    </view>
-                    <view class="table-cell number-col">
-                      <text style="color: orange;">{{ store.summaryCount }}</text>
-                    </view>
+                  <view class="table-cell number-col">
+                    <text style="color: orange;">{{ store.summaryCount }}</text>
                   </view>
-
                 </view>
 
-
               </view>
 
+
+            </view>
+
           </view>
 
         </view>
@@ -167,6 +182,7 @@ export default {
       timeShow: false,
       startTimeXd: "",
       mode: 'range',
+      storeNameQuery: '', // 新增：门店名称查询条件
       searchQuery: '',
       tabs: [
         { name: '待核销', key: 'pending', id: 0 },
@@ -177,9 +193,9 @@ export default {
       currentTab: 0,
       recordList: [],
       summaryList: [
-          {
-            writeOffRecordDetailVos:[]
-          }
+        {
+          writeOffRecordDetailVos:[]
+        }
       ], // 门店汇总数据
       grandTotal: 0, // 总计数量
       pagination: { page: 1, limit: 10 },
@@ -247,7 +263,8 @@ export default {
       try {
         const params = {
           startTime: this.startTime,
-          endTime: this.endTime
+          endTime: this.endTime,
+          storeName: this.storeNameQuery // 新增：门店名称参数
         };
 
         const res = await queryStoreSummary(params);
@@ -290,6 +307,7 @@ export default {
       }
       data.startTime = this.startTime;
       data.endTime = this.endTime;
+      data.storeName = this.storeNameQuery; // 新增：门店名称参数
       data.pageIndex = this.pagination.page
       data.pageSize = this.pagination.limit
 
@@ -326,6 +344,7 @@ export default {
       this.startTime = "";
       this.endTime = "";
       this.startTimeXd = "";
+      this.storeNameQuery = ""; // 清空门店名称查询
       this.handleSearch()
     },
 
@@ -377,12 +396,31 @@ export default {
 .search-wrapper {
   padding: 20rpx;
   background-color: #ffffff;
+  box-shadow: 0 2rpx 10rpx rgba(0, 0, 0, 0.05);
+}
+
+.query {
+  .u-row {
+    margin-bottom: 16rpx !important;
+
+    &:last-child {
+      margin-bottom: 0 !important;
+    }
+  }
+
+  .u-col {
+    display: flex;
+    align-items: center;
+  }
 }
 
 .tabs-wrapper {
   display: flex;
   background-color: #ffffff;
   border-bottom: 1rpx solid #f0f0f0;
+  box-shadow: 0 2rpx 10rpx rgba(0, 0, 0, 0.05);
+  margin-top: 4rpx;
+
   .tab-item {
     flex: 1;
     text-align: center;
@@ -390,9 +428,12 @@ export default {
     font-size: 28rpx;
     color: #666;
     position: relative;
+    transition: all 0.3s ease;
+
     &.active {
       color: #3c82f8;
       font-weight: 500;
+
       &::after {
         content: '';
         position: absolute;
@@ -403,11 +444,39 @@ export default {
         height: 6rpx;
         background-color: #3c82f8;
         border-radius: 3rpx;
+        transition: all 0.3s ease;
       }
     }
+
+    &:active {
+      background-color: rgba(60, 130, 248, 0.05);
+    }
+  }
+}
+
+.query-btn {
+  background-color: #409eff;
+  color: #fff;
+  padding: 20rpx;
+  border-radius: 10rpx;
+  height: 34rpx;
+  display: flex;
+  justify-content: center;
+  align-items: center;
+  transition: all 0.3s ease;
+
+  &:active {
+    background-color: #3080e0;
+    transform: scale(0.98);
   }
 }
 
+.query-btn-text {
+  font-weight: 400;
+  font-size: 30rpx;
+  color: #F5F5F5;
+}
+
 /* 门店汇总样式 - 表格形式 */
 .store-summary-container {
   //flex: 1;
@@ -639,26 +708,35 @@ export default {
   line-height: 60rpx;
   border-radius: 30rpx;
   margin: 0;
+  transition: all 0.3s ease;
+
+  &:active {
+    background-color: #2c72e8;
+    transform: scale(0.98);
+  }
+
   &::after { border: none; }
 }
 
-.query-btn {
-  background-color: #409eff;
-  color: #fff;
-  padding: 20rpx;
-  border-radius: 10rpx;
-  height: 34rpx;
+.table-row-cl2{
   display: flex;
-  justify-content: center;
-  align-items: center;
 }
 
-.query-btn-text {
-  font-weight: 400;
-  font-size: 30rpx;
-  color: #F5F5F5;
-}
-.table-row-cl2{
-  display: flex;
+/* 响应式调整 */
+@media (max-width: 375px) {
+  .search-wrapper {
+    padding: 15rpx;
+  }
+
+  .tabs-wrapper {
+    .tab-item {
+      font-size: 26rpx;
+      padding: 20rpx 0;
+    }
+  }
+
+  .query-btn-text {
+    font-size: 28rpx;
+  }
 }
 </style>