hookehuyr

fix(search): 统一 Tab 样式并优化搜索结果布局

- 将 Tab 样式统一为与 plan 页面一致(padding: 24rpx)
- 移除 Tab 的固定高度,改为自适应
- 优化搜索结果计数位置(从滚动区域内移到外部)
- 移除空状态图片,使用纯文字提示
- 调整列表容器布局,移除多余的 padding

Co-Authored-By: Claude Sonnet 4.5 <noreply@anthropic.com>
......@@ -45,20 +45,20 @@
</template>
</nut-tabs>
<!-- Result Count -->
<view v-if="searchResults.length > 0" class="text-[#6B7280] text-[24rpx] mb-[24rpx]">
找到 {{ searchResults.length }} 个相关结果
</view>
<!-- 可滚动列表区域 -->
<view
class="flex-1 min-h-0 overflow-y-auto px-[40rpx] pb-[calc(160rpx+env(safe-area-inset-bottom))] box-border"
class="flex-1 min-h-0 overflow-y-auto pb-[calc(160rpx+env(safe-area-inset-bottom))] box-border"
>
<!-- Search Results -->
<view
v-if="searchResults.length > 0"
:key="listRenderKey"
>
<!-- Result Count -->
<view class="text-[#6B7280] text-[24rpx] mb-[24rpx]">
找到 {{ searchResults.length }} 个相关结果
</view>
<!-- Results List -->
<view class="flex flex-col gap-[24rpx] pb-[40rpx]">
<!-- Product/Material Card -->
......@@ -112,11 +112,11 @@
<!-- Empty State (已搜索但无结果) -->
<view v-else-if="hasSearched && searchResults.length === 0" class="flex flex-col items-center justify-center py-[120rpx]">
<image
<!-- <image
class="w-[320rpx] h-[320rpx] mb-[40rpx]"
src="https://picsum.photos/seed/empty/320/320"
mode="aspectFit"
/>
/> -->
<view class="text-[#6B7280] text-[28rpx]">暂无搜索结果</view>
<view class="text-[#9CA3AF] text-[24rpx] mt-[12rpx]">试试其他关键词吧</view>
</view>
......@@ -406,7 +406,7 @@ watch(searchKeyword, (newVal) => {
.filter-tabs-wrapper {
display: flex;
overflow-x: auto;
padding: 0;
padding: 24rpx 24rpx;
gap: 24rpx;
transition: all 0.3s ease;
background-color: #F9FAFB;
......@@ -432,7 +432,6 @@ watch(searchKeyword, (newVal) => {
white-space: nowrap;
transition: all 0.3s ease;
flex-shrink: 0;
height: 64rpx;
}
.filter-tab-active {
......