From 8aeddcf766df9f7e3061d4d098b57afdf53db896 Mon Sep 17 00:00:00 2001 From: zhongshujie <2862698242@qq.com> Date: 星期四, 19 十二月 2024 15:28:07 +0800 Subject: [PATCH] 骨架屏及选择选中后自动跳转 --- packageBookService/pages/psychologyAnswer/questionList/index.wxml | 278 +++++++++++++++++++++++++++++++++++++++++++++++-------- 1 files changed, 237 insertions(+), 41 deletions(-) diff --git a/packageBookService/pages/psychologyAnswer/questionList/index.wxml b/packageBookService/pages/psychologyAnswer/questionList/index.wxml index d7fc744..ab7f1ef 100644 --- a/packageBookService/pages/psychologyAnswer/questionList/index.wxml +++ b/packageBookService/pages/psychologyAnswer/questionList/index.wxml @@ -1,31 +1,67 @@ <!--pages/bookServices/examination/questionList/index.wxml--> -<view class="question-list" style="background-color:{{isNight ? '#222' : '#fff'}}"> +<view + class="question-list" + style="background-color:{{isNight ? '#222' : '#fff'}}" +> <!-- 绛旈鎻愮ずtitle --> <view id="question-title" class="question-title" wx:if="{{questionTitle}}"> - <rich-text class="substance" nodes="{{questionTitle}}" space="emsp"></rich-text> + <rich-text + class="substance" + nodes="{{questionTitle}}" + space="emsp" + ></rich-text> </view> <!-- 棰樼洰鍒楄〃 --> - <swiper id="swiper" class="swiper" bindanimationfinish="changeSwiper" current="{{currentIndex}}" style="{{'height:'+height}}"> - <swiper-item wx:for="{{questionList}}" wx:for-index="index" wx:key="id" style="overflow-y: auto"> + <swiper + id="swiper" + class="swiper" + bindanimationfinish="changeSwiper" + current="{{currentIndex}}" + style="{{'height:'+height}}" + > + <swiper-item + wx:for="{{questionList}}" + wx:for-index="index" + wx:key="id" + style="overflow-y: auto" + > <!-- 棰樺共 --> - <view class="question-stem title-score" style="color: {{isNight ? '#fff' : '#000'}}; font-size: {{sliderValue || 32}}rpx;"> + <view + class="question-stem title-score" + style="color: {{isNight ? '#fff' : '#000'}}; font-size: {{sliderValue || 32}}rpx;" + > <!-- 棰樺彿 --> <text>{{index+1}}.</text> <!-- 鍚姏棰� --> <view wx:if="{{item.questionType == 'singleChoice' && item.src}}"> <rich-text nodes="{{item.stem.stemTxt }}" /> - <view style="margin-top: {{item.stem.stemTxt ? '10rpx' : ''}};" class="audio-play-box" bind:tap="audioPlay" data-src="{{item.src}}"> - <image src="{{isPlay ? '/static/images/resourceDetailsMyAudio/zanting@2x.png' : '/static/images/resourceDetailsMyAudio/play@2x.png'}}" mode="aspectFit"></image> + <view + style="margin-top: {{item.stem.stemTxt ? '10rpx' : ''}};" + class="audio-play-box" + bind:tap="audioPlay" + data-src="{{item.src}}" + > + <image + src="{{isPlay ? '/static/images/resourceDetailsMyAudio/zanting@2x.png' : '/static/images/resourceDetailsMyAudio/play@2x.png'}}" + mode="aspectFit" + ></image> </view> </view> <!-- 浠呮枃瀛� --> - <view class="title-content text-space" wx:elif="{{item.stemStyle == 'Txt' && item.questionType != 'completion'}}">{{item.stem.stemTxt}}</view> + <view + class="title-content text-space" + wx:elif="{{item.stemStyle == 'Txt' && item.questionType != 'completion'}}" + >{{item.stem.stemTxt}}</view + > <!-- 浠呭浘鐗� --> <view wx:elif="{{item.stemStyle == 'Image'}}" class="title-content"> <image src="{{item.stem.stemImage}}" mode="aspectFit" /> </view> <!-- 鍥剧墖鍔犳枃瀛� --> - <view wx:elif="{{item.stemStyle == 'TxtAndImage'}}" class="title-content text-space"> + <view + wx:elif="{{item.stemStyle == 'TxtAndImage'}}" + class="title-content text-space" + > <view>{{item.stem.stemTxt}}</view> <image src="{{item.stem.stemImage}}" mode="aspectFit" /> </view> @@ -35,19 +71,61 @@ </view> <!-- 濉┖棰� --> <view wx:if="{{item.questionType == 'completion'}}"> - <view class="completion-box" wx:for="{{item.stem}}" wx:for-item="inputItem" wx:for-index="inputIndex" wx:key="inputIndex"> - <t-input disabled="{{submitStatus}}" borderless bind:change="onChangeInput" data-value="{{item.option}}" data-id="{{item.id}}" data-index="{{inputItem.num}}" class="title-input {{isNight ? 'input-night-color' : ''}}" style="border: 2rpx solid rgba(220,220,220,1);border-radius: 12rpx;background-color:{{isNight ? '#000' : '#fff'}}; " placeholder-style="{{placeholderstyle}}" wx:if="{{inputItem.data == 'input'}}" placeholder="璇疯緭鍏ユ枃瀛�" value="{{item.userAnswer[inputItem.num]}}"></t-input> + <view + class="completion-box" + wx:for="{{item.stem}}" + wx:for-item="inputItem" + wx:for-index="inputIndex" + wx:key="inputIndex" + > + <t-input + disabled="{{submitStatus}}" + borderless + bind:change="onChangeInput" + data-value="{{item.option}}" + data-id="{{item.id}}" + data-index="{{inputItem.num}}" + class="title-input {{isNight ? 'input-night-color' : ''}}" + style="border: 2rpx solid rgba(220,220,220,1);border-radius: 12rpx;background-color:{{isNight ? '#000' : '#fff'}}; " + placeholder-style="{{placeholderstyle}}" + wx:if="{{inputItem.data == 'input'}}" + placeholder="璇疯緭鍏ユ枃瀛�" + value="{{item.userAnswer[inputItem.num]}}" + ></t-input> <text wx:else class="text-space">{{inputItem}}</text> </view> </view> </view> <!-- 绛旈鍖哄煙 --> - <view class="question-answer {{item.questionType == 'shortAnswer' ? 'textarea-center' : ''}}"> + <view + class="question-answer {{item.questionType == 'shortAnswer' ? 'textarea-center' : ''}}" + > <!-- 鍗曢�夐 --> - <t-radio-group wx:if="{{item.questionType == 'singleChoice' || item.questionType == 'judge'}}" defaultValue="{{item.userAnswer}}" disabled="{{submitStatus}}" bind:change="onChangeRadio" class="radio-group" data-id="{{item.id}}"> - <view wx:for="{{questionOptions && questionOptions.length ? questionOptions[item.optionIndex] : item.option}}" wx:for-item="contentItem" wx:for-index="contentIndex" wx:key="contentIndex"> - <t-radio value="{{contentItem.value}}" icon="none" placement="right" borderless style="background-color: {{isNight ? '#222' : '#fff'}}"> - <view style="font-size: {{sliderValue || 32}}rpx;" class="radio-item {{!submitStatus && item.userAnswer == contentItem.value ? 'radio-active' : isNight ? 'night' :''}} {{item.userAnswer == contentItem.value && submitStatus ? item.isRight ? 'radio-correct' : 'radio-error' :''}}"> + <t-radio-group + wx:if="{{item.questionType == 'singleChoice' || item.questionType == 'judge'}}" + defaultValue="{{item.userAnswer}}" + disabled="{{submitStatus}}" + bind:change="onChangeRadio" + class="radio-group" + data-id="{{item.id}}" + > + <view + wx:for="{{questionOptions && questionOptions.length ? questionOptions[item.optionIndex] : item.option}}" + wx:for-item="contentItem" + wx:for-index="contentIndex" + wx:key="contentIndex" + > + <t-radio + value="{{contentItem.value}}" + icon="none" + placement="right" + borderless + style="background-color: {{isNight ? '#222' : '#fff'}}" + > + <view + style="font-size: {{sliderValue || 32}}rpx;" + class="radio-item {{!submitStatus && item.userAnswer == contentItem.value ? 'radio-active' : isNight ? 'night' :''}} {{item.userAnswer == contentItem.value && submitStatus ? item.isRight ? 'radio-correct' : 'radio-error' :''}}" + > <!-- 浠呮枃瀛� --> <view wx:if="{{item.optionStyle == 'Txt'}}" class="text-space"> {{contentItem.value}}銆亄{contentItem.txt}} @@ -58,15 +136,25 @@ <image src="{{contentItem.img}}" mode="aspectFit" /> </view> <!-- 鏂囧瓧鍔犲浘鐗� --> - <view wx:if="{{item.optionStyle == 'TxtAndImage'}}" class="fl-center" class="TxtAndImage-box"> + <view + wx:if="{{item.optionStyle == 'TxtAndImage'}}" + class="fl-center" + class="TxtAndImage-box" + > <text class="text-space">{{contentItem.value}}銆�</text> <view class="radio-textimg">{{contentItem.txt}}</view> <image src="{{contentItem.img}}" mode="aspectFit" /> </view> <!-- 瀵屾枃鏈� --> - <view wx:if="{{item.optionStyle == 'RichText'}}" class="judge-rich-box"> + <view + wx:if="{{item.optionStyle == 'RichText'}}" + class="judge-rich-box" + > <text>{{contentItem.value}}銆�</text> - <rich-text nodes="{{ contentItem.txt}}" style="display: flex; align-items: center; width: 100%"></rich-text> + <rich-text + nodes="{{ contentItem.txt}}" + style="display: flex; align-items: center; width: 100%" + ></rich-text> </view> </view> </t-radio> @@ -74,10 +162,32 @@ </t-radio-group> <!-- 鐗规畩棰� --> <view wx:if="{{item.questionType == 'linkage'}}"> - <t-radio-group defaultValue="{{item.questionTab}}" disabled="{{submitStatus}}" bind:change="handeleOption" class="radio-group" data-value="{{item.questionTab}}" data-id="{{item.id}}"> - <view wx:if="{{item.optionData}}" wx:for="{{item.option}}" wx:for-item="contentItem" wx:for-index="contentIndex" wx:key="contentIndex"> - <t-radio value="{{contentItem.value}}" icon="none" placement="right" borderless style="background-color: {{isNight ? '#222' : '#fff'}}"> - <view style="font-size: {{sliderValue || 32}}rpx;" class="radio-item {{!submitStatus && item.questionTab == contentItem.value ? 'radio-active' : isNight ? 'night' :''}} {{item.questionTab == contentItem.value && submitStatus ? item.isRight ? 'radio-correct' : 'radio-error' :''}}"> + <t-radio-group + defaultValue="{{item.questionTab}}" + disabled="{{submitStatus}}" + bind:change="handeleOption" + class="radio-group" + data-value="{{item.questionTab}}" + data-id="{{item.id}}" + > + <view + wx:if="{{item.optionData}}" + wx:for="{{item.option}}" + wx:for-item="contentItem" + wx:for-index="contentIndex" + wx:key="contentIndex" + > + <t-radio + value="{{contentItem.value}}" + icon="none" + placement="right" + borderless + style="background-color: {{isNight ? '#222' : '#fff'}}" + > + <view + style="font-size: {{sliderValue || 32}}rpx;" + class="radio-item {{!submitStatus && item.questionTab == contentItem.value ? 'radio-active' : isNight ? 'night' :''}} {{item.questionTab == contentItem.value && submitStatus ? item.isRight ? 'radio-correct' : 'radio-error' :''}}" + > <!-- 浠呮枃瀛� --> <view class="text-space"> {{contentItem.value}}銆亄{contentItem.txt}} @@ -87,10 +197,31 @@ </view> </t-radio-group> <view class="title-content text-space">{{item.stem.stem}}</view> - <t-radio-group defaultValue="{{item.userAnswer}}" disabled="{{submitStatus}}" bind:change="onChangeRadio" class="radio-group" data-value="{{item.userAnswer}}" data-id="{{item.id}}"> - <view wx:for="{{item.optionData[item.questionTab]}}" wx:for-item="citem" wx:for-index="cindex" wx:key="cindex"> - <t-radio value="{{citem.value}}" icon="none" placement="right" borderless style="background-color: {{isNight ? '#222' : '#fff'}}"> - <view style="font-size: {{sliderValue || 32}}rpx;" class="radio-item {{!submitStatus && item.userAnswer == citem.value ? 'radio-active' : isNight ? 'night' :''}}{{item.userAnswer == citem.value && submitStatus ? item.isRight ? 'radio-correct' : 'radio-error' :''}}"> + <t-radio-group + defaultValue="{{item.userAnswer}}" + disabled="{{submitStatus}}" + bind:change="onChangeRadio" + class="radio-group" + data-value="{{item.userAnswer}}" + data-id="{{item.id}}" + > + <view + wx:for="{{item.optionData[item.questionTab]}}" + wx:for-item="citem" + wx:for-index="cindex" + wx:key="cindex" + > + <t-radio + value="{{citem.value}}" + icon="none" + placement="right" + borderless + style="background-color: {{isNight ? '#222' : '#fff'}}" + > + <view + style="font-size: {{sliderValue || 32}}rpx;" + class="radio-item {{!submitStatus && item.userAnswer == citem.value ? 'radio-active' : isNight ? 'night' :''}}{{item.userAnswer == citem.value && submitStatus ? item.isRight ? 'radio-correct' : 'radio-error' :''}}" + > <!-- 浠呮枃瀛� --> <view class="text-space"> {{citem.value}}銆亄{citem.txt}} @@ -102,35 +233,100 @@ </view> <!-- 澶氶�夐 --> - <t-checkbox-group class="checkbox-group" wx:elif="{{item.questionType == 'multipleChoice'}}" t-class="box" borderless bind:change="onChangeRadio" data-value="{{item.option}}" data-id="{{item.id}}" defaultValue="{{item.userAnswer}}"> - <view wx:for="{{item.option}}" wx:for-item="contentItem" wx:for-index="contentIndex" wx:key="contentIndex"> - <t-checkbox disabled="{{submitStatus}}" icon="rectangle" block="{{false}}" class="t-checkbox" value="{{contentItem.value}}" style="background-color:{{isNight ? '#222' :'#F9F9F9'}}; "> + <t-checkbox-group + class="checkbox-group" + wx:elif="{{item.questionType == 'multipleChoice'}}" + t-class="box" + borderless + bind:change="onChangeRadio" + data-value="{{item.option}}" + data-id="{{item.id}}" + defaultValue="{{item.userAnswer}}" + > + <view + wx:for="{{item.option}}" + wx:for-item="contentItem" + wx:for-index="contentIndex" + wx:key="contentIndex" + > + <t-checkbox + disabled="{{submitStatus}}" + icon="rectangle" + block="{{false}}" + class="t-checkbox" + value="{{contentItem.value}}" + style="background-color:{{isNight ? '#222' :'#F9F9F9'}}; " + > <!-- 浠呮枃瀛� --> - <view class="fl-center mh text-space" wx:if="{{item.optionStyle == 'Txt'}}" style="color:{{ isNight ? '#fff' : '#000'}};font-size:{{sliderValue || 32}}rpx;"> + <view + class="fl-center mh text-space" + wx:if="{{item.optionStyle == 'Txt'}}" + style="color:{{ isNight ? '#fff' : '#000'}};font-size:{{sliderValue || 32}}rpx;" + > <text>{{contentItem.value}}銆�</text> <text class="check-text-box">{{contentItem.txt}}</text> </view> <!-- 浠呭浘鐗� --> - <view wx:if="{{item.optionStyle == 'Image'}}" class="fl-center mh"> - <text style="color:{{ isNight ? '#fff' : '#000'}};font-size:{{sliderValue || 32}}rpx;">{{contentItem.value}}銆�</text> + <view + wx:if="{{item.optionStyle == 'Image'}}" + class="fl-center mh" + > + <text + style="color:{{ isNight ? '#fff' : '#000'}};font-size:{{sliderValue || 32}}rpx;" + >{{contentItem.value}}銆�</text + > <image src="{{contentItem.img}}" mode="aspectFit" /> </view> <!-- 鏂囧瓧鍔犲浘鐗� --> - <view wx:if="{{item.optionStyle == 'TxtAndImage'}}" class="fl-center mh text-space"> - <text style="color:{{ isNight ? '#fff' : '#000'}};font-size:{{sliderValue || 32}}rpx;">{{contentItem.value}}銆�</text> - <text style="color:{{ isNight ? '#fff' : '#000'}};font-size:{{sliderValue || 32}}rpx;">{{contentItem.txt}}</text> - <image src="{{contentItem.img}}" wx:if="{{contentItem.img}}" mode="aspectFit" /> + <view + wx:if="{{item.optionStyle == 'TxtAndImage'}}" + class="fl-center mh text-space" + > + <text + style="color:{{ isNight ? '#fff' : '#000'}};font-size:{{sliderValue || 32}}rpx;" + >{{contentItem.value}}銆�</text + > + <text + style="color:{{ isNight ? '#fff' : '#000'}};font-size:{{sliderValue || 32}}rpx;" + >{{contentItem.txt}}</text + > + <image + src="{{contentItem.img}}" + wx:if="{{contentItem.img}}" + mode="aspectFit" + /> </view> <!-- 瀵屾枃鏈� --> - <view wx:if="{{item.optionStyle == 'RichText'}}" class="check-rich-box mh"> + <view + wx:if="{{item.optionStyle == 'RichText'}}" + class="check-rich-box mh" + > <text>{{contentItem.value}}銆�</text> - <rich-text nodes="{{contentItem.txt}}" class="multipleChoice"></rich-text> + <rich-text + nodes="{{contentItem.txt}}" + class="multipleChoice" + ></rich-text> </view> </t-checkbox> </view> </t-checkbox-group> <!-- 绠�绛� 缈昏瘧 --> - <t-textarea disabled="{{submitStatus}}" value="{{item.userAnswer}}" bind:change="onChangeRadio" data-value="{{item.option}}" data-id="{{item.id}}" class="option-textarea {{isNight ? 'textarea-night-color' :''}}" wx:elif="{{item.questionType == 'shortAnswer'}}" t-class="external-class" placeholder="璇疯緭鍏ユ枃瀛�" bordered maxlength="500" disableDefaultPadding="{{true}}" indicator style="background-color:{{isNight ? '#000' : '#fff'}}; " /> + <t-textarea + disabled="{{submitStatus}}" + value="{{item.userAnswer}}" + bind:change="onChangeRadio" + data-value="{{item.option}}" + data-id="{{item.id}}" + class="option-textarea {{isNight ? 'textarea-night-color' :''}}" + wx:elif="{{item.questionType == 'shortAnswer'}}" + t-class="external-class" + placeholder="璇疯緭鍏ユ枃瀛�" + bordered + maxlength="500" + disableDefaultPadding="{{true}}" + indicator + style="background-color:{{isNight ? '#000' : '#fff'}}; " + /> </view> </swiper-item> <swiper-item wx:if="{{noData}}"> @@ -140,4 +336,4 @@ </view> </swiper-item> </swiper> -</view> \ No newline at end of file +</view> -- Gitblit v1.9.1