|
|
@@ -0,0 +1,398 @@
|
|
|
+<template>
|
|
|
+ <view class="Parsing">
|
|
|
+ <view class="pageStyle">
|
|
|
+ <view class="toptitle">
|
|
|
+ <view class="lefttoptitle">{{ nowPageData.type === 1 ? '单选' : nowPageData.type === 2 ? '多选' : nowPageData.type === 3 ? '判断' : '案例' }}</view>
|
|
|
+ <view class="righttoptitle">
|
|
|
+ <span class="spans">{{ numIndex + 1 }}</span>
|
|
|
+ /{{ list.length }}
|
|
|
+ </view>
|
|
|
+ </view>
|
|
|
+ <view class="title">{{ nowPageData.content }}</view>
|
|
|
+ <view class="imgBox" v-if="nowPageData.imgUrl !== null && nowPageData.imgUrl">
|
|
|
+ <image :src="$method.splitImgHost(nowPageData.imgUrl)" mode="aspectFit" @click="seeBigImage(nowPageData.imgUrl)"></image>
|
|
|
+ </view>
|
|
|
+ <view v-if="nowPageData.type === 4" class="contentList">
|
|
|
+ <!-- 案例题start -->
|
|
|
+
|
|
|
+ <view class="pageStyle" v-for="(items, index) in nowPageData.jsonStr">
|
|
|
+ <view class="toptitle">
|
|
|
+ <view class="lefttoptitle">{{ items.type === 1 ? '单选' : items.type === 2 ? '多选' : items.type === 3 ? '判断' : '案例' }}</view>
|
|
|
+ </view>
|
|
|
+ <view class="title">{{ items.content }}</view>
|
|
|
+ <view class="imgBox" v-if="items.imgUrl !== null && items.imgUrl">
|
|
|
+ <image :src="$method.splitImgHost(items.imgUrl)" mode="aspectFit" @click="seeBigImage(items.imgUrl)"></image>
|
|
|
+ </view>
|
|
|
+ <view class="contentList">
|
|
|
+ <view class="listCen" v-for="(item, index) in items.answer" :key="index" :class="item.optionAnswer === 1 ? 'activeBtn' : ''">
|
|
|
+ <view>{{ alphabet[index] }}.</view>
|
|
|
+ <view>
|
|
|
+ <view>{{ item.content }}</view>
|
|
|
+ <view class="imgBox" v-if="item.imgUrl !== null && item.imgUrl">
|
|
|
+ <image :src="$method.splitImgHost(item.imgUrl)" mode="aspectFit" @click="seeBigImage(item.imgUrl)"></image>
|
|
|
+ </view>
|
|
|
+ </view>
|
|
|
+ </view>
|
|
|
+ </view>
|
|
|
+ <view style="font-weight: bold;margin-top: 20rpx;">正确答案: {{ comswet[index] }}</view>
|
|
|
+ <view class="jx">
|
|
|
+ 答案解析：
|
|
|
+ <view class="jxlis"></view>
|
|
|
+ </view>
|
|
|
+ <view class="answerJX">{{ items.analysisContent }}</view>
|
|
|
+ </view>
|
|
|
+
|
|
|
+ <!-- 案例题end -->
|
|
|
+ </view>
|
|
|
+ <view v-else class="contentList">
|
|
|
+ <view class="listCen" v-for="(item, index) in nowPageData.jsonStr" :key="index" :class="item.optionAnswer === 1 ? 'activeBtn' : ''">
|
|
|
+ <view>{{ alphabet[index] }}.</view>
|
|
|
+ <view>
|
|
|
+ <view>{{ item.content }}</view>
|
|
|
+ <view class="imgBox" v-if="item.imgUrl !== null && item.imgUrl">
|
|
|
+ <image :src="$method.splitImgHost(item.imgUrl)" mode="aspectFit" @click="seeBigImage(item.imgUrl)"></image>
|
|
|
+ </view>
|
|
|
+ </view>
|
|
|
+ </view>
|
|
|
+ </view>
|
|
|
+ <view v-if="nowPageData.type !== 4" style="font-weight: bold;margin-top: 20rpx;">正确答案: {{ comans }}</view>
|
|
|
+ <view class="jx">
|
|
|
+ 答案解析：
|
|
|
+ <view class="jxlis"></view>
|
|
|
+ </view>
|
|
|
+ <view class="answerJX">{{ nowPageData.analysisContent }}</view>
|
|
|
+ </view>
|
|
|
+ <view class="footer_tab">
|
|
|
+ <u-line color="#D6D6DB" />
|
|
|
+ <u-row gutter="16">
|
|
|
+ <u-col span="4">
|
|
|
+ <view class="box">
|
|
|
+ <view style="text-align: center;margin-left: 30rpx;position: absolute;left: 20rpx;" v-if="numIndex !== 0" @click="backPage">
|
|
|
+ <u-icon name="arrow-leftward" color="#333" size="38"></u-icon>
|
|
|
+ <view class="sc_t">上一题</view>
|
|
|
+ </view>
|
|
|
+ </view>
|
|
|
+ </u-col>
|
|
|
+ <u-col span="4">
|
|
|
+ <view class="box">
|
|
|
+ <view style="text-align: center;" @click="menu">
|
|
|
+ <image src="/static/up.png" style="width: 58rpx;height: 22rpx;"></image>
|
|
|
+ <view class="sc_t">答题卡</view>
|
|
|
+ </view>
|
|
|
+ </view>
|
|
|
+ </u-col>
|
|
|
+ <u-col span="4">
|
|
|
+ <view class="box">
|
|
|
+ <view style="text-align: center;margin-right: 30rpx;position: absolute;right: 20rpx;" v-if="numIndex !== list.length - 1" @click="nextPage">
|
|
|
+ <u-icon name="arrow-rightward" color="#333" size="38"></u-icon>
|
|
|
+ <view class="sc_t">下一题</view>
|
|
|
+ </view>
|
|
|
+ </view>
|
|
|
+ </u-col>
|
|
|
+ </u-row>
|
|
|
+ </view>
|
|
|
+ <u-popup v-model="show" mode="bottom" :safe-area-inset-bottom="true">
|
|
|
+ <view class="popup_box">
|
|
|
+ <scroll-view scroll-y="true" class="popup_list">
|
|
|
+ <view v-for="(item, index) in list" :key="index" class="btn_num" :class="numIndex === index ? 'btn_bac2' : 'btn_bac1'" @click="changeMt(index)">
|
|
|
+ <text class="">{{ index + 1 }}</text>
|
|
|
+ </view>
|
|
|
+ </scroll-view>
|
|
|
+ </view>
|
|
|
+ </u-popup>
|
|
|
+ </view>
|
|
|
+</template>
|
|
|
+
|
|
|
+<script>
|
|
|
+export default {
|
|
|
+ data() {
|
|
|
+ return {
|
|
|
+ numIndex: 0,
|
|
|
+ type: 1,
|
|
|
+ show: false,
|
|
|
+ list: [],
|
|
|
+ bankSectionId: null,
|
|
|
+ examId: null,
|
|
|
+ errorArrayList: [],
|
|
|
+ nowPageData: {},
|
|
|
+ comans: '', //除案例题外的正确答案
|
|
|
+ comswet: [], //案例题的正确答案
|
|
|
+ alphabet: 'ABCDEFGHIJKLMNOPQRSTUVWXYZ',
|
|
|
+ allItem: false //是否全部解析
|
|
|
+ };
|
|
|
+ },
|
|
|
+ onLoad(option) {
|
|
|
+ console.log(option.allItem);
|
|
|
+ this.type = option.type;
|
|
|
+ if (option.bankSectionId !== null) {
|
|
|
+ this.bankSectionId = option.bankSectionId;
|
|
|
+ }
|
|
|
+ if (option.examId !== null) {
|
|
|
+ this.examId = option.examId;
|
|
|
+ }
|
|
|
+ if (option.allItem === 'true') {
|
|
|
+ this.allItem = true;
|
|
|
+ }
|
|
|
+ this.errorArrayList = decodeURIComponent(option.errorArrayList)
|
|
|
+ .split(',')
|
|
|
+ .map(Number);
|
|
|
+ this.getTitleInit();
|
|
|
+ },
|
|
|
+ onShow() {},
|
|
|
+ methods: {
|
|
|
+ nextPage() {
|
|
|
+ var int = this.numIndex + 1;
|
|
|
+ this.changeMt(int);
|
|
|
+ },
|
|
|
+ backPage() {
|
|
|
+ var int = this.numIndex - 1;
|
|
|
+ this.changeMt(int);
|
|
|
+ },
|
|
|
+ // 切换题目
|
|
|
+ changeMt(int) {
|
|
|
+ this.numIndex = int;
|
|
|
+ this.intPageNowPageData(int);
|
|
|
+ this.chanInts(this.list);
|
|
|
+ this.show = false;
|
|
|
+ },
|
|
|
+ intPageNowPageData(int) {
|
|
|
+ var self = this;
|
|
|
+ self.nowPageData = self.list[int];
|
|
|
+ },
|
|
|
+ //预览图片
|
|
|
+ seeBigImage(url) {
|
|
|
+ var urlarr = [];
|
|
|
+ urlarr.push(this.$method.splitImgHost(url));
|
|
|
+ uni.previewImage({
|
|
|
+ urls: urlarr
|
|
|
+ });
|
|
|
+ },
|
|
|
+ getTitleInit() {
|
|
|
+ var self = this;
|
|
|
+ if (self.bankSectionId !== 'null') {
|
|
|
+ var data = {
|
|
|
+ bankSectionId: this.bankSectionId
|
|
|
+ };
|
|
|
+ }
|
|
|
+ if (self.examId !== 'null') {
|
|
|
+ var data = {
|
|
|
+ examId: self.examId
|
|
|
+ };
|
|
|
+ }
|
|
|
+ self.$api.questiondetailList(data).then(res => {
|
|
|
+ if (self.allItem === true) {
|
|
|
+ res.data.rows.forEach((item, index) => {
|
|
|
+ item.jsonStr = JSON.parse(item.jsonStr);
|
|
|
+ });
|
|
|
+ self.list = res.data.rows;
|
|
|
+ self.nowPageData = res.data.rows[self.numIndex];
|
|
|
+ self.chanInts(res.data.rows);
|
|
|
+ } else {
|
|
|
+ var listArrays = [];
|
|
|
+ res.data.rows.forEach((ite, ind) => {
|
|
|
+ if (self.errorArrayList.indexOf(ite.questionId) !== -1) {
|
|
|
+ listArrays.push(ite);
|
|
|
+ }
|
|
|
+ });
|
|
|
+ listArrays.forEach((item, index) => {
|
|
|
+ item.jsonStr = JSON.parse(item.jsonStr);
|
|
|
+ });
|
|
|
+ self.list = listArrays;
|
|
|
+ self.nowPageData = listArrays[self.numIndex];
|
|
|
+ self.chanInts(listArrays);
|
|
|
+ }
|
|
|
+ });
|
|
|
+ },
|
|
|
+ chanInts(res) {
|
|
|
+ var a = [];
|
|
|
+ var self = this;
|
|
|
+ if (res[self.numIndex].type === 4) {
|
|
|
+ res[self.numIndex].jsonStr.forEach((item,index) => {
|
|
|
+ if(item.type === 3){
|
|
|
+ if (item.answerQuestion === 1) {
|
|
|
+ a[index] = '正确'
|
|
|
+ } else {
|
|
|
+ a[index] = '错误'
|
|
|
+ }
|
|
|
+ }else{
|
|
|
+ var aras = []
|
|
|
+ item.answer.forEach((items, indexs) => {
|
|
|
+ if (items.optionAnswer === 1) {
|
|
|
+ aras.push(self.alphabet[indexs])
|
|
|
+ }
|
|
|
+ });
|
|
|
+ a[index] = aras.toString()
|
|
|
+ }
|
|
|
+ self.comswet = a
|
|
|
+ })
|
|
|
+ } else {
|
|
|
+ if (res[self.numIndex].type === 3) {
|
|
|
+ if (res[self.numIndex].answerQuestion === 1) {
|
|
|
+ a.push('正确');
|
|
|
+ } else {
|
|
|
+ a.push('错误');
|
|
|
+ }
|
|
|
+ } else {
|
|
|
+ res[self.numIndex].jsonStr.forEach((items, indexs) => {
|
|
|
+ if (items.optionAnswer === 1) {
|
|
|
+ a.push(self.alphabet[indexs]);
|
|
|
+ }
|
|
|
+ });
|
|
|
+ }
|
|
|
+ self.comans = a.toString();
|
|
|
+ }
|
|
|
+ },
|
|
|
+ menu() {
|
|
|
+ this.show = true;
|
|
|
+ }
|
|
|
+ }
|
|
|
+};
|
|
|
+</script>
|
|
|
+<style>
|
|
|
+::-webkit-scrollbar {
|
|
|
+ width: 0;
|
|
|
+ height: 0;
|
|
|
+ color: transparent;
|
|
|
+}
|
|
|
+.u-drawer-content-visible {
|
|
|
+ border-radius: 32rpx 32rpx 0rpx 0rpx;
|
|
|
+ overflow: hidden;
|
|
|
+}
|
|
|
+</style>
|
|
|
+<style scope>
|
|
|
+.activeBtn {
|
|
|
+ background-color: #f7fff7 !important;
|
|
|
+ border-color: #09bb07 !important;
|
|
|
+}
|
|
|
+.imgBox {
|
|
|
+ text-align: center;
|
|
|
+}
|
|
|
+.imgBox > image {
|
|
|
+ max-height: 300rpx;
|
|
|
+}
|
|
|
+.pageStyle {
|
|
|
+ padding: 20rpx 32rpx 100rpx;
|
|
|
+}
|
|
|
+.toptitle {
|
|
|
+ display: flex;
|
|
|
+ align-items: center;
|
|
|
+ justify-content: space-between;
|
|
|
+ font-size: 28rpx;
|
|
|
+ margin-bottom: 25rpx;
|
|
|
+}
|
|
|
+.listCen {
|
|
|
+ display: flex;
|
|
|
+ font-size: 34rpx;
|
|
|
+ color: #333;
|
|
|
+ background-color: #f7fbff;
|
|
|
+ margin-bottom: 8rpx;
|
|
|
+ border-radius: 16rpx;
|
|
|
+ padding: 15rpx 18rpx;
|
|
|
+ border: 2rpx solid transparent;
|
|
|
+}
|
|
|
+.jx {
|
|
|
+ position: relative;
|
|
|
+ color: #333333;
|
|
|
+ font-size: 30rpx;
|
|
|
+}
|
|
|
+.jx > .jxlis {
|
|
|
+ position: absolute;
|
|
|
+ top: 50%;
|
|
|
+ left: 0;
|
|
|
+ width: 118rpx;
|
|
|
+ height: 8rpx;
|
|
|
+ background-color: rgba(50, 70, 123, 0.2);
|
|
|
+}
|
|
|
+.answerJX {
|
|
|
+ color: #333333;
|
|
|
+ font-size: 30rpx;
|
|
|
+}
|
|
|
+.lefttoptitle {
|
|
|
+ border-radius: 10rpx;
|
|
|
+ border: 1rpx solid #32467b;
|
|
|
+ height: 36rpx;
|
|
|
+ line-height: 36rpx;
|
|
|
+ padding: 0rpx 8rpx;
|
|
|
+ text-align: center;
|
|
|
+ color: #32467b;
|
|
|
+ background: rgba(50, 70, 123, 0.1);
|
|
|
+}
|
|
|
+.pageStyle > .title {
|
|
|
+ margin-bottom: 25rpx;
|
|
|
+}
|
|
|
+.righttoptitle {
|
|
|
+ color: #999;
|
|
|
+}
|
|
|
+.righttoptitle > .spans {
|
|
|
+ color: #32467b;
|
|
|
+}
|
|
|
+.btn_bac2 {
|
|
|
+ background: #32467b;
|
|
|
+ color: #fff;
|
|
|
+}
|
|
|
+.btn_bac1 {
|
|
|
+ background: #f7f8ff;
|
|
|
+ color: #666666;
|
|
|
+}
|
|
|
+.btn_num::before {
|
|
|
+ content: '';
|
|
|
+ padding-top: 100%;
|
|
|
+ display: block;
|
|
|
+}
|
|
|
+.btn_num text {
|
|
|
+ font-size: 24rpx;
|
|
|
+ width: 100%;
|
|
|
+ display: inline-block;
|
|
|
+ text-align: center;
|
|
|
+ top: 50%;
|
|
|
+ position: absolute;
|
|
|
+ height: 30rpx;
|
|
|
+ line-height: 30rpx;
|
|
|
+ margin-top: -15rpx;
|
|
|
+}
|
|
|
+.btn_num {
|
|
|
+ border-radius: 32rpx;
|
|
|
+ width: 16%;
|
|
|
+ margin: 2%;
|
|
|
+ display: inline-block;
|
|
|
+ position: relative;
|
|
|
+}
|
|
|
+.popup_list {
|
|
|
+ border-radius: 32rpx 32rpx 0rpx 0rpx;
|
|
|
+ height: 899rpx;
|
|
|
+ background: #f2f3f6;
|
|
|
+ padding-bottom: 30rpx;
|
|
|
+}
|
|
|
+.popup_box {
|
|
|
+ height: 899rpx;
|
|
|
+ box-shadow: 0rpx 0rpx 16rpx 4rpx rgba(145, 156, 178, 0.1);
|
|
|
+ border-radius: 32rpx 32rpx 0rpx 0rpx;
|
|
|
+ background: #f2f3f6;
|
|
|
+ padding: 30rpx;
|
|
|
+}
|
|
|
+.sc_t {
|
|
|
+ font-size: 22rpx;
|
|
|
+ color: #000000;
|
|
|
+}
|
|
|
+.box {
|
|
|
+ height: 95rpx;
|
|
|
+ display: flex;
|
|
|
+ flex-direction: column;
|
|
|
+ justify-content: center;
|
|
|
+ position: relative;
|
|
|
+}
|
|
|
+.sc {
|
|
|
+ width: 29rpx;
|
|
|
+ height: 29rpx;
|
|
|
+}
|
|
|
+.footer_tab {
|
|
|
+ position: fixed;
|
|
|
+ bottom: 0;
|
|
|
+ height: 96rpx;
|
|
|
+ width: 100%;
|
|
|
+ background-color: #ffffff;
|
|
|
+}
|
|
|
+page {
|
|
|
+ background: #ffffff;
|
|
|
+}
|
|
|
+</style>
|
