Blizzard
128 lines
4.5 KiB
Plaintext
128 lines
4.5 KiB
Plaintext
<!--pages/wiki/identify/index.wxml-->
|
|
<view class="identify-page">
|
|
|
|
<!-- Loading State -->
|
|
<view wx:if="{{isLoading}}" class="state-container">
|
|
<view class="state-card">
|
|
<view class="loading-image-wrap">
|
|
<image src="{{imagePath}}" mode="aspectFill" class="loading-preview" bindtap="previewImage" />
|
|
<view class="scan-line"></view>
|
|
</view>
|
|
<view class="loading-info">
|
|
<view class="loading-dots">
|
|
<view class="dot dot1"></view>
|
|
<view class="dot dot2"></view>
|
|
<view class="dot dot3"></view>
|
|
</view>
|
|
<text class="state-title">正在识别中...</text>
|
|
<text class="state-hint">AI 正在分析植物特征</text>
|
|
</view>
|
|
</view>
|
|
</view>
|
|
|
|
<!-- Error State -->
|
|
<view wx:elif="{{hasError}}" class="state-container">
|
|
<view class="state-card">
|
|
<view class="error-icon-wrap">
|
|
<t-icon name="close-circle" size="96rpx" color="#EF5350" />
|
|
</view>
|
|
<text class="state-title">识别失败</text>
|
|
<text class="state-hint">请检查网络连接后重试</text>
|
|
<view class="state-actions">
|
|
<view class="action-btn primary" bindtap="handleRetry">
|
|
<t-icon name="refresh" size="32rpx" color="#fff" />
|
|
<text>重新识别</text>
|
|
</view>
|
|
<view class="action-btn outline" bindtap="handleReselect">
|
|
<t-icon name="arrow-left" size="32rpx" color="#558B2F" />
|
|
<text>返回重选</text>
|
|
</view>
|
|
</view>
|
|
</view>
|
|
</view>
|
|
|
|
<!-- Results State -->
|
|
<scroll-view wx:else scroll-y class="results-scroll" enhanced show-scrollbar="{{false}}">
|
|
|
|
<!-- Hero Section: Image + Top Result -->
|
|
<view class="hero-section">
|
|
<image src="{{imagePath}}" mode="aspectFill" class="hero-image" bindtap="previewImage" />
|
|
<view class="hero-gradient"></view>
|
|
|
|
<view wx:if="{{topResult}}" class="hero-overlay">
|
|
<view class="hero-badge">
|
|
<t-icon name="check-circle" size="28rpx" color="#fff" />
|
|
<text>匹配度 {{topResult.percent}}%</text>
|
|
</view>
|
|
<text class="hero-plant-name">{{topResult.name}}</text>
|
|
</view>
|
|
</view>
|
|
|
|
<!-- Top Result Detail Card -->
|
|
<view wx:if="{{topResult}}" class="detail-card-wrapper">
|
|
<view class="detail-card">
|
|
<view class="detail-card-header">
|
|
<view class="result-rank best">1</view>
|
|
<view class="result-name-area">
|
|
<text class="result-main-name">{{topResult.name}}</text>
|
|
<text class="confidence-text">置信度 {{topResult.percent}}%</text>
|
|
</view>
|
|
</view>
|
|
|
|
<!-- Confidence Bar -->
|
|
<view class="confidence-bar-wrap">
|
|
<view class="confidence-bar-bg">
|
|
<view class="confidence-bar-fill" style="width: {{topResult.percent}}%;"></view>
|
|
</view>
|
|
</view>
|
|
|
|
<text wx:if="{{topResult.description}}" class="result-description">{{topResult.description}}</text>
|
|
|
|
<view class="detail-card-actions">
|
|
<view class="action-btn primary" bindtap="searchInWiki" data-name="{{topResult.name}}">
|
|
<t-icon name="search" size="32rpx" color="#fff" />
|
|
<text>在百科中搜索</text>
|
|
</view>
|
|
</view>
|
|
</view>
|
|
</view>
|
|
|
|
<!-- Other Results -->
|
|
<view wx:if="{{results.length > 1}}" class="other-section">
|
|
<text class="section-title">其他可能的结果</text>
|
|
<view class="other-list">
|
|
<view
|
|
wx:for="{{results}}"
|
|
wx:key="index"
|
|
wx:if="{{index > 0}}"
|
|
class="other-item"
|
|
bindtap="searchInWiki"
|
|
data-name="{{item.name}}"
|
|
>
|
|
<view class="result-rank normal">{{index + 1}}</view>
|
|
<view class="other-item-info">
|
|
<text class="other-item-name">{{item.name}}</text>
|
|
<view class="mini-bar-wrap">
|
|
<view class="mini-bar-bg">
|
|
<view class="mini-bar-fill" style="width: {{item.percent > 1 ? item.percent : 1}}%;"></view>
|
|
</view>
|
|
<text class="mini-bar-text">{{item.percent}}%</text>
|
|
</view>
|
|
</view>
|
|
<t-icon name="chevron-right" size="36rpx" color="#D1D5DB" />
|
|
</view>
|
|
</view>
|
|
</view>
|
|
|
|
<!-- Bottom Actions -->
|
|
<view class="bottom-section">
|
|
<view class="action-btn outline full" bindtap="handleReselect">
|
|
<t-icon name="refresh" size="32rpx" color="#558B2F" />
|
|
<text>重新识别</text>
|
|
</view>
|
|
</view>
|
|
|
|
<view style="height: 80rpx;"></view>
|
|
</scroll-view>
|
|
</view>
|