feat: 调整样式

This commit is contained in:
Blizzard
2026-02-14 11:31:44 +08:00
parent cbbe82ef63
commit d6f781a666
42 changed files with 827 additions and 293 deletions
+75 -67
View File
@@ -16,80 +16,88 @@
<!-- Record List -->
<view wx:else class="record-list">
<view wx:for="{{records}}" wx:key="id" class="record-card" bindtap="toggleExpand" data-id="{{item.id}}">
<t-swipe-cell wx:for="{{records}}" wx:key="id" class="record-swipe-cell">
<view 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}}%
<!-- 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>
<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 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>
</view>
<view class="detail-meta">
<t-icon name="time" size="24rpx" color="#9CA3AF" />
<text class="meta-text">{{item.dateStr}}</text>
</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>
</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>
<view slot="right" class="delete-action" catchtap="deleteLog" data-id="{{item.id}}">
<view class="delete-btn">
<t-icon name="delete" size="40rpx" color="#fff" />
</view>
</view>
</t-swipe-cell>
<!-- Load More -->
<view wx:if="{{loading && records.length > 0}}" class="load-more">