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

68 lines
2.9 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.

<view class="page">
<view class="nav-bar" style="height: {{navBarHeight || (statusBarHeight + 44)}}px; padding-top: {{statusBarHeight || 44}}px; box-sizing: border-box;">
<view class="nav-inner safe-header-right">
<view class="nav-back" bindtap="goBack">← 返回</view>
<text class="nav-title">搜索</text>
</view>
</view>
<view class="search-box">
<view class="search-input-wrap">
<text class="search-icon">🔍</text>
<input class="search-input" placeholder="搜索章节标题或内容..." value="{{query}}" bindinput="onInput" focus="{{true}}" />
<view class="search-clear" wx:if="{{query}}" bindtap="clearQuery">×</view>
</view>
</view>
<scroll-view class="result-area" scroll-y>
<block wx:if="{{!query}}">
<view class="hot-section">
<text class="hot-label">热门搜索</text>
<view class="hot-tags">
<view class="hot-tag" wx:for="{{hotKeywords}}" wx:key="*this" data-keyword="{{item}}" bindtap="onKeywordTap">{{item}}</view>
</view>
</view>
</block>
<block wx:elif="{{isLoading}}">
<view class="loading-wrap">
<view class="loading-spinner"></view>
<text class="loading-text">搜索中...</text>
</view>
</block>
<block wx:elif="{{results.length > 0}}">
<view class="result-header">找到 {{results.length}} 个结果</view>
<view class="result-list">
<view class="result-item" wx:for="{{results}}" wx:key="id" data-id="{{item.id}}" bindtap="goToRead">
<view class="result-icon">📄</view>
<view class="result-body">
<view class="result-meta">
<text class="result-id">{{item.id}}</text>
<text class="tag-free" wx:if="{{item.isFree}}">免费</text>
<text class="tag-content" wx:if="{{item.matchType === 'content'}}">内容匹配</text>
</view>
<text class="result-title">{{item.title}}</text>
<text class="result-snippet" wx:if="{{item.snippet}}">{{item.snippet}}</text>
<text class="result-path" wx:if="{{item.partTitle}}">{{item.partTitle}} · {{item.chapterTitle}}</text>
</view>
<text class="result-arrow"></text>
</view>
</view>
<view class="keywords-section" wx:if="{{keywords.length > 0}}">
<text class="keywords-label">相关标签</text>
<view class="keywords-tags">
<view class="keyword-tag" wx:for="{{keywords}}" wx:for-item="kw" wx:key="*this" wx:if="{{kw}}" data-keyword="{{kw}}" bindtap="onKeywordTap">#{{kw}}</view>
</view>
</view>
</block>
<block wx:elif="{{query && !isLoading}}">
<view class="empty-wrap">
<text class="empty-icon">🔍</text>
<text class="empty-text">未找到相关内容</text>
<text class="empty-hint">试试其他关键词</text>
</view>
</block>
</scroll-view>
</view>