feat: 样式修改
This commit is contained in:
@@ -0,0 +1,103 @@
|
||||
<view class="history-page">
|
||||
|
||||
<!-- Loading -->
|
||||
<view wx:if="{{loading && records.length === 0}}" class="loading-wrap">
|
||||
<t-loading theme="circular" size="48rpx" text="加载中..." />
|
||||
</view>
|
||||
|
||||
<!-- Empty -->
|
||||
<view wx:elif="{{!loading && records.length === 0}}" class="empty-wrap">
|
||||
<view class="empty-icon">
|
||||
<t-icon name="scan" size="120rpx" color="#D1D5DB" />
|
||||
</view>
|
||||
<text class="empty-title">暂无识别记录</text>
|
||||
<text class="empty-hint">去百科页面拍照识别植物吧</text>
|
||||
</view>
|
||||
|
||||
<!-- Record List -->
|
||||
<view wx:else class="record-list">
|
||||
<view wx:for="{{records}}" wx:key="id" class="record-card" bindtap="toggleExpand" data-id="{{item.id}}">
|
||||
|
||||
<!-- Card Header -->
|
||||
<view class="card-header">
|
||||
<view class="card-thumb">
|
||||
<t-image
|
||||
wx:if="{{item.topImage}}"
|
||||
src="{{item.topImage}}"
|
||||
mode="aspectFill"
|
||||
width="120rpx"
|
||||
height="120rpx"
|
||||
shape="round"
|
||||
/>
|
||||
<view wx:else class="thumb-placeholder">
|
||||
<t-icon name="image" size="48rpx" color="#D1D5DB" />
|
||||
</view>
|
||||
</view>
|
||||
|
||||
<view class="card-info">
|
||||
<view class="card-name-row">
|
||||
<text class="card-name">{{item.topName}}</text>
|
||||
<view class="score-badge" style="background: {{item.topScore >= 80 ? '#E8F5E9' : item.topScore >= 50 ? '#FFF8E1' : '#FBE9E7'}}; color: {{item.topScore >= 80 ? '#2E7D32' : item.topScore >= 50 ? '#F57F17' : '#D84315'}}">
|
||||
{{item.topScore}}%
|
||||
</view>
|
||||
</view>
|
||||
<text class="card-time">{{item.time}}</text>
|
||||
<view wx:if="{{item.otherResults.length > 0}}" class="other-hint">
|
||||
<text>还可能是: </text>
|
||||
<text wx:for="{{item.otherResults}}" wx:for-item="other" wx:key="name" class="other-name">{{other.name}}{{index < item.otherResults.length - 1 ? '、' : ''}}</text>
|
||||
</view>
|
||||
</view>
|
||||
|
||||
<view class="expand-arrow {{expandedId === item.id ? 'expanded' : ''}}">
|
||||
<t-icon name="chevron-down" size="32rpx" color="#C5C5C5" />
|
||||
</view>
|
||||
</view>
|
||||
|
||||
<!-- Expanded Detail -->
|
||||
<view wx:if="{{expandedId === item.id}}" class="card-detail">
|
||||
<!-- Description -->
|
||||
<view wx:if="{{item.topDesc}}" class="detail-desc">
|
||||
<text class="desc-text">{{item.topDesc}}</text>
|
||||
</view>
|
||||
|
||||
<!-- All Results -->
|
||||
<view class="detail-results">
|
||||
<text class="detail-label">识别结果排名</text>
|
||||
<view class="result-bars">
|
||||
<!-- Top result -->
|
||||
<view class="result-bar-item">
|
||||
<text class="bar-name">{{item.topName}}</text>
|
||||
<view class="bar-track">
|
||||
<view class="bar-fill top" style="width: {{item.topScore}}%"></view>
|
||||
</view>
|
||||
<text class="bar-score">{{item.topScore}}%</text>
|
||||
</view>
|
||||
<!-- Other results -->
|
||||
<view wx:for="{{item.otherResults}}" wx:for-item="other" wx:key="name" class="result-bar-item">
|
||||
<text class="bar-name">{{other.name}}</text>
|
||||
<view class="bar-track">
|
||||
<view class="bar-fill" style="width: {{other.score}}%"></view>
|
||||
</view>
|
||||
<text class="bar-score">{{other.score}}%</text>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
|
||||
<view class="detail-meta">
|
||||
<t-icon name="time" size="24rpx" color="#9CA3AF" />
|
||||
<text class="meta-text">{{item.dateStr}}</text>
|
||||
</view>
|
||||
</view>
|
||||
|
||||
</view>
|
||||
|
||||
<!-- Load More -->
|
||||
<view wx:if="{{loading && records.length > 0}}" class="load-more">
|
||||
<t-loading theme="circular" size="36rpx" text="加载更多..." />
|
||||
</view>
|
||||
<view wx:elif="{{!hasMore && records.length > 0}}" class="no-more">
|
||||
<text>— 没有更多了 —</text>
|
||||
</view>
|
||||
</view>
|
||||
|
||||
</view>
|
||||
Reference in New Issue
Block a user