mini_read_space_front/pages/search/search.wxml

<!--pages/search/search.wxml-->
<view class="container">
  <!-- 顶部标题栏 -->
  <view class="header">
    <view class="back-btn" bindtap="goBack">
      <view class="icon-back">
        <view class="icon-back-arrow"></view>
      </view>
    </view>
    <text class="title">搜索</text>
  </view>

  <!-- 搜索框 -->
    <view class="search-box">
      <icon type="search" size="20" color="#999"/>
      <input 
        type="text" 
        placeholder="请输入书名/口令搜索" 
        placeholder-class="placeholder"
        value="{{keyword}}"
        bindinput="handleInput"
        bindconfirm="search"
        confirm-type="search"
        focus="true"
      />
      <icon wx:if="{{keyword}}" type="clear" size="20" color="#999" catchtap="clearSearch"/>
      <view wx:if="{{keyword}}" bindtap="search" class="search-btn">搜索</view>
    </view>
    

  <!-- 搜索结果 -->
  <scroll-view 
    scroll-y 
    class="search-result"
    bindscrolltolower="onScrollToLower"
    lower-threshold="50"
  >
    <!-- 书籍列表 -->
    <view class="book-list">
      <view class="book-item" 
        wx:for="{{bookList}}" 
        wx:key="id"
        bindtap="handleBookTap"
        data-id="{{item.id}}"
        data-wxbookid="{{item.wxBookId}}"
      >
        <image class="book-cover" src="{{item.cover}}" mode="aspectFill"/>
        <view class="book-info">
          <!-- 标题显示，带关键字高亮 -->
          <view class="book-title">
            <block wx:if="{{item.titleContainsKeyword}}">
              <text>{{item.titleBeforeKeyword}}</text>
              <text class="highlight">{{item.titleKeyword}}</text>
              <text>{{item.titleAfterKeyword}}</text>
            </block>
            <block wx:else>
              <text>{{item.title}}</text>
            </block>
          </view>
          <text class="book-desc">{{item.brief}}</text>
          <text class="book-author">{{item.author || '未知作者'}}</text>
        </view>
      </view>
    </view>
    
    <!-- 加载状态 -->
    <view class="loading" wx:if="{{loading}}">
      <text>加载中...</text>
    </view>
    
    <!-- 没有更多数据 -->
    <view class="no-more" wx:if="{{!loading && !hasMore && bookList.length > 0}}">
      <text>没有更多了</text>
    </view>
    
    <!-- 搜索结果为空 -->
    <view class="empty" wx:if="{{!loading && bookList.length === 0 && keyword}}">
      <text>未找到相关结果</text>
    </view>
  </scroll-view>
</view>