Files
soul-yongping/miniprogram/pages/search/search.wxml

116 lines
4.0 KiB
Plaintext
Raw Blame History

This file contains ambiguous Unicode characters

This file contains Unicode characters that might be confused with other characters. If you think that this is intentional, you can safely ignore this warning. Use the Escape button to reveal them.

<!--pages/search/search.wxml-->
<!--章节搜索页-->
<view class="page">
<!-- 自定义导航栏 -->
<view class="nav-bar" style="padding-top: {{statusBarHeight}}px;">
<view class="nav-content">
<view class="back-btn" bindtap="goBack">
<text class="back-icon">←</text>
</view>
<view class="search-input-wrap">
<view class="search-icon-small">🔍</view>
<input
class="search-input"
placeholder="搜索章节标题或内容..."
value="{{keyword}}"
bindinput="onInput"
bindconfirm="doSearch"
confirm-type="search"
focus="{{true}}"
/>
<view class="clear-btn" wx:if="{{keyword}}" bindtap="clearSearch">×</view>
</view>
<view class="search-btn" bindtap="doSearch">搜索</view>
</view>
</view>
<!-- 主内容区 -->
<view class="main-content" style="padding-top: {{statusBarHeight + 56}}px;">
<!-- 热门搜索(未搜索时显示) -->
<view class="hot-section" wx:if="{{!searched}}">
<text class="section-title">热门搜索</text>
<view class="hot-tags">
<view
class="hot-tag"
wx:for="{{hotKeywords}}"
wx:key="*this"
bindtap="onHotKeyword"
data-keyword="{{item}}"
>{{item}}</view>
</view>
</view>
<!-- 热门章节推荐(未搜索时显示) -->
<view class="hot-chapters" wx:if="{{!searched && hotChapters.length > 0}}">
<text class="section-title">热门章节</text>
<view class="chapter-list">
<view
class="chapter-item"
wx:for="{{hotChapters}}"
wx:key="id"
bindtap="goToRead"
data-id="{{item.id}}"
data-mid="{{item.mid}}"
>
<view class="chapter-rank">{{index + 1}}</view>
<view class="chapter-info">
<text class="chapter-title">{{item.title}}</text>
<text class="chapter-part">{{item.part}}</text>
</view>
<view class="chapter-tag {{item.tag === '免费' ? 'tag-free' : item.tag === '热门' ? 'tag-hot' : 'tag-new'}}">{{item.tag}}</view>
</view>
</view>
</view>
<!-- 搜索结果 -->
<view class="results-section" wx:if="{{searched}}">
<!-- 加载中 -->
<view class="loading-wrap" wx:if="{{loading}}">
<view class="loading-spinner"></view>
<text class="loading-text">搜索中...</text>
</view>
<!-- 结果列表 -->
<block wx:elif="{{results.length > 0}}">
<view class="results-header">
<text class="results-count">找到 {{total}} 个结果</text>
</view>
<view class="results-list">
<view
class="result-item"
wx:for="{{results}}"
wx:key="id"
bindtap="goToRead"
data-id="{{item.id}}"
data-mid="{{item.mid}}"
>
<view class="result-header">
<text class="result-chapter">{{item.chapterLabel}}</text>
<view class="result-tags">
<text class="tag tag-match" wx:if="{{item.matchType === 'title'}}">标题匹配</text>
<text class="tag tag-match" wx:elif="{{item.matchType === 'content'}}">内容匹配</text>
<text class="tag tag-free" wx:if="{{item.isFree}}">免费</text>
</view>
</view>
<text class="result-title">{{item.title}}</text>
<text class="result-part">{{item.part}}</text>
<view class="result-content" wx:if="{{item.matchedContent}}">
<text class="content-preview">{{item.matchedContent}}</text>
</view>
<view class="result-arrow">→</view>
</view>
</view>
</block>
<!-- 无结果 -->
<view class="empty-wrap" wx:elif="{{!loading}}">
<text class="empty-icon">🔍</text>
<text class="empty-text">未找到相关章节</text>
<text class="empty-hint">换个关键词试试</text>
</view>
</view>
</view>
</view>