162 lines
8.1 KiB
Plaintext
162 lines
8.1 KiB
Plaintext
<view class="container">
|
|
<!-- 新增的整体预览页面 -->
|
|
<view class="result-overview" wx:if="{{!showDetail}}">
|
|
<!-- 加载状态 -->
|
|
<view class="loading-container" wx:if="{{loading}}">
|
|
<view class="loading-content">
|
|
<view class="loading-spinner">
|
|
<view class="spinner-circle"></view>
|
|
</view>
|
|
<text class="loading-text">加载中...</text>
|
|
</view>
|
|
</view>
|
|
|
|
<block wx:else>
|
|
<!-- 顶部成绩展示 -->
|
|
<view class="score-section">
|
|
<view class="score-main">{{correctCount}}/{{totalCount}}</view>
|
|
<view class="score-desc {{isQualified ? 'qualified' : 'unqualified'}}">{{isQualified ? '恭喜达标' : '未达标'}}</view>
|
|
</view>
|
|
|
|
<!-- 答题情况统计 -->
|
|
<view class="stats-section">
|
|
<view class="stats-item">
|
|
<text class="stats-value">{{correctRate}}%</text>
|
|
<text class="stats-label">正确率</text>
|
|
</view>
|
|
<view class="stats-divider"></view>
|
|
<view class="stats-item">
|
|
<text class="stats-value">{{usedTime}}</text>
|
|
<text class="stats-label">用时</text>
|
|
</view>
|
|
</view>
|
|
|
|
<!-- 题目列表 -->
|
|
<view class="questions-list">
|
|
<view class="list-header">
|
|
<text class="header-title">答题情况</text>
|
|
<view class="status-legend">
|
|
<view class="legend-item">
|
|
<view class="legend-circle correct"></view>
|
|
<text>正确</text>
|
|
</view>
|
|
<view class="legend-item">
|
|
<view class="legend-circle wrong"></view>
|
|
<text>错误</text>
|
|
</view>
|
|
<view class="legend-item">
|
|
<view class="legend-circle unanswered"></view>
|
|
<text>未答</text>
|
|
</view>
|
|
</view>
|
|
</view>
|
|
<view class="question-items">
|
|
<view class="question-item" wx:for="{{questions}}" wx:key="id">
|
|
<view class="circle-index" bindtap="jumpToQuestion" data-index="{{index}}">
|
|
<view class="circle-bg"></view>
|
|
<view class="circle-arc {{item.cssClass}}"></view>
|
|
<text class="circle-text">{{index + 1}}</text>
|
|
</view>
|
|
</view>
|
|
</view>
|
|
</view>
|
|
|
|
<!-- 统一的底部按钮组 -->
|
|
<view class="bottom-btns">
|
|
<block wx:if="{{!showDetail}}">
|
|
<button class="btn-outline" bindtap="showAnalysis">查看解析</button>
|
|
<button class="btn-blue" bindtap="retakeQuiz">重新答题</button>
|
|
</block>
|
|
<block wx:else>
|
|
<button class="btn-outline" bindtap="showSummary">返回结算</button>
|
|
<button class="btn-blue" bindtap="retakeQuiz">重新答题</button>
|
|
</block>
|
|
</view>
|
|
</block>
|
|
</view>
|
|
|
|
<!-- 详细解析页面（与答题页相同的双层布局 + 解析） -->
|
|
<block wx:else>
|
|
<view class="container">
|
|
<!-- 加载状态 -->
|
|
<view class="loading-container" wx:if="{{loading}}">
|
|
<view class="loading-content">
|
|
<view class="loading-spinner">
|
|
<view class="spinner-circle"></view>
|
|
</view>
|
|
<text class="loading-text">加载中...</text>
|
|
</view>
|
|
</view>
|
|
|
|
<block wx:else>
|
|
<view class="detail-wrap" style="height: {{swiperHeight}}px;">
|
|
<!-- 背景层：仅当当前题目有关联材料时显示 -->
|
|
<view class="layer-back" wx:if="{{currentQuestionMaterial}}" style="height: {{swiperHeight}}px;">
|
|
<view class="material-title-fixed">
|
|
<text class="section-title">资料</text>
|
|
<view class="section-title-underline"></view>
|
|
</view>
|
|
<scroll-view scroll-y
|
|
class="material-scroll-below-title"
|
|
style="height: {{materialScrollHeight}}px;"
|
|
enhanced="{{true}}"
|
|
show-scrollbar="{{true}}"
|
|
bounces="{{true}}">
|
|
<view class="section section-material">
|
|
<view class="material-body">
|
|
<rich-text nodes="{{currentQuestionMaterial.content}}" selectable="{{true}}" class="material-rich"></rich-text>
|
|
</view>
|
|
</view>
|
|
<view class="material-placeholder"></view>
|
|
</scroll-view>
|
|
</view>
|
|
|
|
<!-- 前置层：问题面板 -->
|
|
<view class="movable-area panel-area" style="height: {{movableAreaHeight}}px;">
|
|
<view class="movable-panel question-panel-wrap" style="height: {{panelHeight}}px; transform: translateY({{panelY}}px);">
|
|
<!-- 仅当有材料时显示拖拽条 -->
|
|
<view class="panel-drag-handle"
|
|
wx:if="{{currentQuestionMaterial}}"
|
|
bindtouchstart="onPanelDragStart"
|
|
catchtouchmove="onPanelDragMove"
|
|
bindtouchend="onPanelDragEnd"
|
|
bindtouchcancel="onPanelDragEnd">
|
|
<view class="panel-drag-bar"></view>
|
|
</view>
|
|
<view class="section section-question">
|
|
<swiper class="content-swiper question-content-swiper"
|
|
current="{{currentQuestionIndex}}"
|
|
bindchange="onQuestionChange"
|
|
bindanimationfinish="onQuestionAnimationFinish">
|
|
<swiper-item wx:for="{{questions}}"
|
|
wx:key="id"
|
|
wx:for-index="qIndex"
|
|
wx:for-item="q"
|
|
class="content-swiper-item">
|
|
<view class="question-body">
|
|
<question-display
|
|
question="{{q}}"
|
|
question-index="{{qIndex}}"
|
|
answers="{{[]}}"
|
|
option-markers="{{optionMarkers}}"
|
|
show-analysis="{{true}}"
|
|
show-answer-icon="{{true}}"
|
|
clickable="{{false}}">
|
|
</question-display>
|
|
</view>
|
|
</swiper-item>
|
|
</swiper>
|
|
</view>
|
|
</view>
|
|
</view>
|
|
</view>
|
|
|
|
<!-- 底部按钮组 -->
|
|
<view class="bottom-btns">
|
|
<button class="btn-outline" bindtap="showSummary">返回结算</button>
|
|
<button class="btn-blue" bindtap="retakeQuiz">重新答题</button>
|
|
</view>
|
|
</block>
|
|
</view>
|
|
</block>
|
|
</view> |