zc_saas_h5/pages5/examBank/index.vue

<template>
	<view class="questionBank">
		<uni-nav-bar @clickLeft="clickLeft" left-icon="back" ref="navbar" :statusBar="true"
			:title="examData.examName"></uni-nav-bar>
		<swiper class="swiper" :current="current" @change="swiperChange">
			<swiper-item v-for="(bank, bankIndex) in questionList" :key="bankIndex">
				<view class="pageContent">
					<view class="pad_8 titBox">
						<view class="firstLetter">
							<view class="leftLetters">
								<view class="btnType">
									<text v-if="bank.type == 1">单选</text>
									<text v-if="bank.type == 2">多选</text>
									<text v-if="bank.type == 3">判断</text>
									<text v-if="bank.type == 4">案例</text>
									<text v-if="bank.type == 5">简答</text>
								</view>
								<text>{{ bankIndex + 1 }}/{{ questionList.length }}</text>
							</view>
							<view style="color: #666; font-size: 28rpx">{{
                countdown(lastTime)
              }}</view>
						</view>
						<view class="titles" @click="showPhoto(bank.content)"><rich-text
								:nodes="bank.content"></rich-text></view>
					</view>

					<template v-if="bank.type == 1">
						<view class="pad_8 titBox no-margin">
							<view v-if="!bank.ques">
								<view v-for="(item, index) in bank.jsonStr" :key="index" class="lisSty"
									@click="radioSelect(item.optionsId, bankIndex)">
									<view class="activeTI">{{ ast[index] }}</view>
									<view class="flex_auto">{{ item.content }}
										<view v-if="item.imgUrl">
											<image style="width: 600rpx" mode="widthFix"
												:src="$method.splitImgHost(item.imgUrl)"></image>
										</view>
									</view>
								</view>
							</view>
							<view v-if="bank.ques">
								<view v-for="(item, index) in bank.jsonStr" :key="index" class="lisSty"
									@click="radioSelect(item.optionsId, bankIndex)">
									<text :class="{
                      right:
                        bankType == 1 &&
                        (item.optionsId == bank.ques ||
                          item.optionsId == bank.ans),
                      wrong:
                        bankType == 1 &&
                        item.optionsId == bank.ques &&
                        bank.ques != bank.ans,
                      user_choose: bankType == 2 && item.optionsId == bank.ques,
                    }" class="activeTI">
										{{ ast[index] }}
									</text>
									<view class="flex_auto">
										{{ item.content }}
										<view v-if="item.imgUrl">
											<image style="width: 600rpx" mode="widthFix"
												:src="$method.splitImgHost(item.imgUrl)"></image>
										</view>
									</view>
								</view>
							</view>
						</view>
						<view v-if="bankType == 1 && bank.ques">
							<view class="pad_8 answer">
								<view>题目答案：{{ ast[bank.ans - 1] }} </view>
								<view>我的答案：{{ ast[bank.ques - 1] }}</view>
							</view>
							<view class="pad_8 answerInfos">
								<view class="answerTitle">答案解析</view>
								<view class="answerContent"><rich-text :nodes="bank.analysisContent"></rich-text></view>
							</view>
						</view>
					</template>

					<template v-if="bank.type == 2">
						<view class="pad_8 titBox no-margin">
							<view v-if="!bank.ques">
								<view v-for="(item, index) in bank.jsonStr" :key="index" class="lisSty"
									@click="checkboxSelect(item.optionsId, bankIndex, index)">
									<view :class="{ checked: item.checked }" class="activeTI">{{
                    ast[index]
                  }}</view>
									<view class="flex_auto">
										{{ item.content }}
										<view v-if="item.imgUrl">
											<image style="width: 600rpx" mode="widthFix"
												:src="$method.splitImgHost(item.imgUrl)"></image>
										</view>
									</view>
								</view>
							</view>
							<view v-if="bank.ques">
								<view v-for="(item, index) in bank.jsonStr" :key="index" class="lisSty"
									@click="checkboxSelect(item.optionsId, bankIndex, index)">
									<text :class="{
                      right:
                        bankType == 1 &&
                        (bank.ques.indexOf(item.optionsId) != -1 ||
                          bank.ans.indexOf(item.optionsId) != -1),
                      wrong:
                        bankType == 1 &&
                        bank.ques.indexOf(item.optionsId) != -1 &&
                        bank.ans.indexOf(item.optionsId) == -1,
                      user_choose: bankType == 2 && item.checked,
                    }" class="activeTI">
										{{ ast[index] }}
									</text>
									<view class="flex_auto">
										{{ item.content }}
										<view v-if="item.imgUrl">
											<image style="width: 600rpx" mode="widthFix"
												:src="$method.splitImgHost(item.imgUrl)"></image>
										</view>
									</view>
								</view>
							</view>
							<view v-if="bankType == 2 || (bankType == 1 && !bank.ques)" class="submit_checkbox"
								:class="{ disabled: !isCheckboxChecked(bank.jsonStr) }"
								@click="checkboxSubmit(bankIndex)">确认答案</view>
						</view>
						<view v-if="bankType == 1 && bank.ques">
							<view class="pad_8 answer">
								<view>
									题目答案：
									<text v-for="(ansItem, ansIndex) in bank.ans"
										:key="ansIndex">{{ ast[ansItem - 1] }}</text>
								</view>
								<view>
									我的答案：
									<text v-for="(quesItem, quesIndex) in bank.ques"
										:key="quesIndex">{{ ast[quesItem - 1] }}</text>
								</view>
							</view>
							<view class="pad_8 answerInfos">
								<view class="answerTitle">答案解析</view>
								<view class="answerContent"><rich-text :nodes="bank.analysisContent"></rich-text></view>
							</view>
						</view>
					</template>

					<template v-if="bank.type == 3">
						<view class="pad_8 titBox no-margin">
							<view v-if="!bank.ques">
								<view v-for="(item, index) in judge" :key="index" class="lisSty"
									@click="judgeSelect(index, bankIndex)">
									<view class="activeTI">{{ ast[index] }}</view>
									<view class="flex_auto">
										{{ item }}
										<view v-if="item.imgUrl">
											<image style="width: 600rpx" mode="widthFix"
												:src="$method.splitImgHost(item.imgUrl)"></image>
										</view>
									</view>
								</view>
							</view>
							<view v-if="bank.ques">
								<view v-for="(item, index) in judge" :key="index" class="lisSty"
									@click="judgeSelect(index, bankIndex)">
									<text :class="{
                      right:
                        bankType == 1 &&
                        (index == (bank.ques == 1 ? 0 : 1) ||
                          index != bank.ans),
                      wrong:
                        bankType == 1 &&
                        index == (bank.ques == 1 ? 0 : 1) &&
                        bank.ques != bank.ans,
                      user_choose:
                        bankType == 2 && index == (bank.ques == 1 ? 0 : 1),
                    }" class="activeTI">
										{{ ast[index] }}
									</text>
									<view class="flex_auto">
										{{ item }}
										<view v-if="item.imgUrl">
											<image style="width: 600rpx" mode="widthFix"
												:src="$method.splitImgHost(item.imgUrl)"></image>
										</view>
									</view>
								</view>
							</view>
						</view>
						<view v-if="bankType == 1 && bank.ques">
							<view class="pad_8 answer">
								<view>题目答案：{{ ast[bank.ans == 1 ? 0 : 1] }}</view>
								<view>我的答案：{{ ast[bank.ques == 1 ? 0 : 1] }}</view>
							</view>
							<view class="pad_8 answerInfos">
								<view class="answerTitle">答案解析</view>
								<view class="answerContent"><rich-text :nodes="bank.analysisContent"></rich-text></view>
							</view>
						</view>
					</template>

					<!-- 简答题 -->
					<template v-if="bank.type == 5">
						<view class="pad_8 titBox">
							<view class="ans">
								<view class="ans_input" v-if="
                    bankType == 2 ||
                    (bankType == 1 &&
                      (!bank.ques ||
                        (!bank.ques.imageList.length && !bank.ques.text)))
                  ">
									<view class="top flex">
										<image :data-index="bankIndex" class="icon" @click="chooseImg(bankIndex)"
											src="/static/camera.png" mode=""></image>
										<view class="progress">{{ bank.ansText.imageList.length || "0" }}/4</view>
										<view class="submit" :class="{ disabled: !bank.ansText.text && hasImgs(bank) }"
											@click="submitAns(bankIndex)">确认答案</view>
									</view>
									<view class="textarea">
										<textarea v-model="bank.ansText.text" placeholder="在此输入答案"></textarea>
									</view>
									<view class="imgs">
										<view class="img" v-for="(img, imgIndex) in bank.ansText.imageList"
											:key="imgIndex">
											<text @click="deleteImg(imgIndex, bankIndex)">x</text>
											<image :src="$method.splitImgHost(img, true)"></image>
										</view>
									</view>
								</view>
								<view class="ans_submit answerInfos" v-if="
                    bankType == 1 &&
                    bank.ques &&
                    (bank.ques.imageList.length || bank.ques.text)
                  ">
									<view class="answerTitle">我的答案:</view>
									{{ bank.ques.text }}
									<view class="imgs">
										<image class="img" :key="quesIndex"
											v-for="(ques, quesIndex) in bank.ques.imageList"
											:src="$method.splitImgHost(ques, true)"></image>
									</view>
								</view>
							</view>
						</view>

						<view v-if="
                bankType == 1 &&
                bank.ques &&
                (bank.ques.imageList.length || bank.ques.text)
              ">
							<view class="pad_8 answerInfos">
								<view class="answerTitle">答案解析:</view>
								<view class="answerContent"><rich-text :nodes="bank.analysisContent"></rich-text></view>
							</view>
						</view>
					</template>

					<!-- 案例题 -->
					<template v-if="bank.type == 4">
						<view class="tabs">
							<view class="tab" :class="{ current: tabIndex == bank.current }" :key="tabIndex"
								v-for="(tab, tabIndex) in bank.jsonStr" @click="tabSelect(tabIndex, bankIndex)">
								问题{{ tabIndex + 1 }}
							</view>
						</view>

						<view v-for="(ansItem, ansIndex) in bank.jsonStr" v-if="bank.current == ansIndex"
							:key="ansIndex">
							<template v-if="ansItem.type == 1">
								<view class="pad_8 titBox">
									<view class="leftLetters">
										<view class="btnType">
											<text>单选</text>
										</view>
									</view>
									<view class="titles"><rich-text :nodes="ansItem.content"></rich-text></view>
									<view v-if="!bank.ques[ansIndex]">
										<view v-for="(option, childIndex) in ansItem.optionsList" :key="childIndex"
											class="lisSty" @click="
                        radioSelectChild(option.optionsId, ansIndex, bankIndex)
                      ">
											<view class="activeTI">{{ ast[childIndex] }}</view>
											<view class="flex_auto">
												<rich-text class="textChild" :nodes="option.content"></rich-text>
												<view v-if="option.imgUrl">
													<image style="width: 600rpx" mode="widthFix"
														:src="$method.splitImgHost(option.imgUrl)"></image>
												</view>
											</view>
										</view>
									</view>
									<view v-if="bank.ques[ansIndex]">
										<view v-for="(option, childIndex) in ansItem.optionsList" :key="childIndex"
											class="lisSty" @click="
                        radioSelectChild(option.optionsId, ansIndex, bankIndex)
                      ">
											<text :class="{
                          right:
                            bankType == 1 &&
                            (option.optionsId == bank.ques[ansIndex] ||
                              option.optionsId == bank.ans[ansIndex]),
                          wrong:
                            bankType == 1 &&
                            option.optionsId == bank.ques[ansIndex] &&
                            bank.ques[ansIndex] != bank.ans[ansIndex],
                          user_choose:
                            bankType == 2 &&
                            option.optionsId == bank.ques[ansIndex],
                        }" class="activeTI">
												{{ ast[childIndex] }}
											</text>
											<view class="flex_auto">
												<rich-text :nodes="option.content"></rich-text>
												<view v-if="option.imgUrl">
													<image style="width: 600rpx" mode="widthFix"
														:src="$method.splitImgHost(option.imgUrl)"></image>
												</view>
											</view>
										</view>
									</view>
								</view>

								<view v-if="bankType == 1 && bank.ques[ansIndex]">
									<view class="pad_8 answer">
										<view>题目答案：{{ ast[bank.ans[ansIndex] - 1] }}</view>
										<view>我的答案：{{ ast[bank.ques[ansIndex] - 1] }}</view>
									</view>
									<view class="pad_8 answerInfos">
										<view class="answerTitle">答案解析</view>
										<view class="answerContent"><rich-text
												:nodes="option.analysisContent"></rich-text></view>
									</view>
								</view>
							</template>

							<template v-if="ansItem.type == 2">
								<view class="pad_8 titBox">
									<view class="leftLetters">
										<view class="btnType">
											<text>多选</text>
										</view>
									</view>
									<view class="titles"><rich-text :nodes="ansItem.content"></rich-text></view>
									<view v-if="!bank.ques[ansIndex]">
										<view v-for="(option, childindex) in ansItem.optionsList" :key="childindex"
											class="lisSty" @click="
                        checkboxSelectChild(bankIndex, ansIndex, childindex)
                      ">
											<view :class="{ checked: option.checked }" class="activeTI">
												{{ ast[childindex] }}</view>
											<view class="flex_auto">
												<rich-text :nodes="option.content"></rich-text>
												<view v-if="option.imgUrl">
													<image style="width: 600rpx" mode="widthFix"
														:src="$method.splitImgHost(option.imgUrl)"></image>
												</view>
											</view>
										</view>
									</view>
									<view v-if="
                      bankType == 2 || (bankType == 1 && !bank.ques[ansIndex])
                    " class="submit_checkbox" :class="{
                      disabled: !isCheckboxChecked(ansItem.optionsList),
                    }" @click="checkboxSubmitChild(bankIndex, ansIndex)">确认答案</view>
									<view v-if="bank.ques && bank.ques[ansIndex]">
										<view v-for="(option, childindex) in ansItem.optionsList" :key="childindex"
											class="lisSty" @click="
                        checkboxSelectChild(bankIndex, ansIndex, childindex)
                      ">
											<text :class="{
                          right:
                            bankType == 1 && right(bankIndex, ansIndex, option),
                          wrong:
                            bankType == 1 && wrong(bankIndex, ansIndex, option),
                          user_choose: bankType == 2 && option.checked,
                        }" class="activeTI">
												{{ ast[childindex] }}
											</text>
											<view class="flex_auto">
												<rich-text :nodes="option.content"></rich-text>
												<view v-if="option.imgUrl">
													<image style="width: 600rpx" mode="widthFix"
														:src="$method.splitImgHost(option.imgUrl)"></image>
												</view>
											</view>
										</view>
									</view>
								</view>
								<view v-if="bankType == 1 && bank.ques[ansIndex]">
									<view class="pad_8 answer">
										<view>
											题目答案：
											<text :key="ansItemIndex1"
												v-for="(ansItem1, ansItemIndex1) in bank.ans[ansIndex]">{{ ast[ansItem1 - 1] }}</text>
										</view>
										<view>
											我的答案：
											<text :key="quesItemIndex"
												v-for="(quesItem, quesItemIndex) in bank.ques[ansIndex]">{{ ast[quesItem - 1] }}</text>
										</view>
									</view>
									<view class="pad_8 answerInfos">
										<view class="answerTitle">答案解析</view>
										<view class="answerContent"><rich-text
												:nodes="ansItem.analysisContent"></rich-text></view>
									</view>
								</view>
							</template>

							<template v-if="ansItem.type == 3">
								<view class="pad_8 titBox">
									<view class="leftLetters">
										<view class="btnType">
											<text>判断</text>
										</view>
									</view>
									<view class="titles"><rich-text :nodes="ansItem.content"></rich-text></view>
									<view v-if="!bank.ques[ansIndex]">
										<view v-for="(option, childindex) in judge" :key="childindex" class="lisSty"
											@click="judgeSelectChild(ansIndex, childindex, bankIndex)">
											<view class="activeTI">{{ ast[childindex] }}</view>
											<view class="flex_auto">
												{{ option }}
												<view v-if="option.imgUrl">
													<image style="width: 600rpx" mode="widthFix"
														:src="$method.splitImgHost(option.imgUrl)"></image>
												</view>
											</view>
										</view>
									</view>
									<view v-if="bank.ques[ansIndex]">
										<view v-for="(option, childindex) in judge" :key="childindex" class="lisSty"
											@click="judgeSelectChild(ansIndex, childindex, bankIndex)">
											<text :class="{
                          right:
                            bankType == 1 &&
                            (childindex == (bank.ques[ansIndex] == 1 ? 0 : 1) ||
                              childindex != bank.ans[ansIndex]),
                          wrong:
                            bankType == 1 &&
                            childindex == (bank.ques[ansIndex] == 1 ? 0 : 1) &&
                            bank.ques[ansIndex] != bank.ans[ansIndex],
                          user_choose:
                            bankType == 2 &&
                            childindex == (bank.ques[ansIndex] == 1 ? 0 : 1),
                        }" class="activeTI">
												{{ ast[childindex] }}
											</text>
											<view class="flex_auto">
												{{ option }}
												<view v-if="option.imgUrl">
													<image style="width: 600rpx" mode="widthFix"
														:src="$method.splitImgHost(option.imgUrl)"></image>
												</view>
											</view>
										</view>
									</view>
								</view>
								<view v-if="bankType == 1 && bank.ques[ansIndex]">
									<view class="pad_8 answer">
										<view>题目答案：{{
                        ast[bank.ans[ansIndex] == 1 ? 0 : 1]
                      }}</view>
										<view>我的答案：{{
                        ast[bank.ques[ansIndex] == 1 ? 0 : 1]
                      }}</view>
									</view>
									<view class="pad_8 answerInfos">
										<view class="answerTitle">答案解析</view>
										<view class="answerContent"><rich-text
												:nodes="ansItem.analysisContent"></rich-text></view>
									</view>
								</view>
							</template>

							<!-- 简答题 -->
							<template v-if="ansItem.type == 5">
								<view class="pad_8 titBox_title">
									<view class="leftLetters">
										<view class="btnType">
											<text>简答</text>
										</view>
									</view>
									<view><rich-text :nodes="ansItem.content"></rich-text></view>
								</view>
								<view class="pad_8 titBox_title">
									<view class="ans">
										<view class="ans_input" v-if="
                        bankType == 2 ||
                        (bankType == 1 &&
                          (!bank.ques[ansIndex] ||
                            (!bank.ques[ansIndex].text &&
                              !bank.ques[ansIndex].imageList.length)))
                      ">
											<view class="top flex">
												<image class="icon" @click="chooseImgChild(bankIndex, ansIndex)"
													src="/static/camera.png" mode=""></image>
												<view class="progress">{{ ansItem.ansText.imageList.length || "0" }}/4
												</view>
												<view class="submit" :class="{
                            disabled: !ansItem.ansText.text && hasImgs(ansItem),
                          }" @click="submitAnsChild(bankIndex, ansIndex)">确认答案</view>
											</view>
											<view class="textarea">
												<textarea v-model="ansItem.ansText.text"
													placeholder="在此输入答案"></textarea>
											</view>
											<view class="imgs">
												<view class="img" v-for="(img, imgIndex) in ansItem.ansText.imageList"
													:key="imgIndex">
													<text @click="
                              deleteImgChild(imgIndex, bankIndex, ansIndex)
                            ">x</text>
													<image :src="$method.splitImgHost(img, true)"></image>
												</view>
											</view>
										</view>
										<view class="ans_submit answerInfos" v-if="
                        bankType == 1 &&
                        bank.ques[ansIndex] &&
                        (bank.ques[ansIndex].imageList.length ||
                          bank.ques[ansIndex].text)
                      ">
											<view class="answerTitle">我的答案</view>
											{{ bank.ques[ansIndex].text || "" }}
											<view class="imgs">
												<image class="img" v-for="(ques, quesIndex) in bank.ques[ansIndex]
                            .imageList" :key="quesIndex" :src="$method.splitImgHost(ques, true)"></image>
											</view>
										</view>
									</view>
								</view>
								<view v-if="
                    bankType == 1 &&
                    (bank.ques[ansIndex].imageList.length ||
                      bank.ques[ansIndex].text)
                  ">
									<view class="pad_8 answerInfos">
										<view class="answerTitle">答案解析</view>
										<view class="answerContent"><rich-text
												:nodes="ansItem.analysisContent"></rich-text></view>
									</view>
								</view>
							</template>
						</view>
					</template>
				</view>
			</swiper-item>
		</swiper>
		<bank-bom :isShowCollect="false" :questionList="questionList" :bankType="bankType" :current.sync="current"
			@submit="pdsubmit"></bank-bom>
		<view class="dialog" v-if="showDialog">
			<image class="pointer" src="/static/pointer.png" mode=""></image>
			<view class="text">左右滑动切换上下题</view>
			<view class="btn" @click="showDialog = false">我知道了</view>
		</view>

		<view class="dialog-arrow" v-if="showArrow">
			<image class="pointer" src="/static/arrow-left.png" mode=""></image>
			<view class="text">您当前正在测试， 若想退出请点击左上角返回按钮。</view>
			<view class="btn" @click="showArrow = false">我知道了</view>
		</view>

		<view class="dialog_wrap" v-if="testOver">
			<view class="bg"></view>
			<view class="dialog">
				<view class="title">温馨提示</view>
				<view class="content">
					<view>您已完成所有题目，</view>
					<view>快去交卷吧！</view>
				</view>
				<view class="btns">
					<view class="btn" @click="noSubmit()">暂不交卷</view>
					<view class="btn active" @click="submitNow()">立即交卷</view>
				</view>
			</view>
		</view>

		<view class="dialog_wrap" v-if="isLastCount">
			<view class="bg"></view>
			<view class="dialog">
				<view class="title">温馨提示</view>
				<view class="content">
					<view>您当前正在测试，还剩{{ lastCount }}道题未完成，离开视为交卷</view>
				</view>
				<view class="btns">
					<view class="btn" @click="noLeave()">暂不离开</view>
					<view class="btn active" @click="leaveNow()">继续离开</view>
				</view>
			</view>
		</view>
		<u-popup v-model="showpopups" mode="center" border-radius="24" height="439rpx" width="640rpx"
			:mask-close-able="false">
			<view class="popboxs">
				<view class="classTops">温馨提示</view>
				<view class="textStys">
					{{
            cgType === 7
              ? "您还未交卷,确定结束做题吗？"
              : cgType === 8
              ? `您还有${lastCount}道题未作答， 现在继续作答，还是下次继续？`
              : cgType === 6
              ? `您还有${lastCount}道题未作答， 您确定要交卷吗？`
              : cgType == 9
              ? `您已完成所有题目，快去交卷吧！`
              : ""
          }}
				</view>
				<view class="classFootsty" v-if="cgType === 6">
					<view class="btnsty btns1" @click="submit">立即交卷</view>
					<view class="btnsty btns2" @click="showpopups = false">继续做题</view>
				</view>
				<view class="classFootsty" v-if="cgType === 7">
					<view class="btnsty btns1" @click="backPages">下次继续</view>
					<view class="btnsty btns2" @click="submit">结束做题</view>
				</view>
				<view class="classFootsty" v-if="cgType === 8">
					<view class="btnsty btns1" @click="backPages()">下次继续</view>
					<view class="btnsty btns2" @click="showpopups = false">继续作答</view>
				</view>
				<view class="classFootsty" v-if="cgType === 9">
					<view class="btnsty btns1" @click="showpopups = false">暂不交卷</view>
					<view class="btnsty btns2" @click="submit">立即交卷</view>
				</view>
			</view>
		</u-popup>
	</view>
</template>

<script>
	import {
		mapGetters,
		mapActions
	} from "vuex";
	import BankBom from "../../components/common/BankBom.vue";
	import {
		goodsExamIsCanLearn,
		examClientCanLearn
	} from "@/utils/authority";
	export default {
		data() {
			return {
				subscribeId: 0,
				showpopups: false,
				examId: "",
				current: 0,
				questionList: [],
				ast: ["A", "B", "C", "D", "E", "F", "G"],
				judge: ["正确", "错误"],
				ans: [],
				ques: [],
				showDialog: false,
				bankList: [],
				collectList: [],
				recordId: "",
				isSubmit: false,
				lastTime: 0, //剩余考试时长
				allTimes: 0, //总考试时长
				timer: null,
				wrongList: [],
				bankType: 2, //试卷类型
				needBack: false, //是否是考试
				testOver: false,
				isLastCount: false, //是否有未答题目
				lastCount: 0, //剩余没有回答的题目数
				showArrow: false, //退出提示
				gradeId: "",
				examData: {},
				eachExamId: 0,
				normal: "",
				isAutoSubmit: false,
				cgType: 0, //对应设计稿弹窗编码
				examStartTime: 0,
				examEndTime: 0,
				simulateExamId: undefined,
				goodsId: undefined,
				orderGoodsId: undefined,
			};
		},
		async onLoad(option) {
			await goodsExamIsCanLearn(option.goodsid);
			this.examStartTime = option.examStartTime;
			this.examEndTime = option.examEndTime;
			this.subscribeId = option.subscribeId || "";
			this.current = +option.current || 0;
			this.eachExamId = option.eachExamId;
			this.examId = option.examId;
			this.allTimes = this.examEndTime - this.examStartTime || "";
			this.goodsId = option.goodsId;
			this.orderGoodsId = option.orderGoodsId;
			let isBack = option.isback;

			let showDialog = uni.getStorageSync("showDialog");

			if (showDialog) {
				this.showDialog = false;
			} else {
				this.showDialog = true;
				uni.setStorageSync("showDialog", "1");
			}

			//考试被迫返回
			if (isBack) {
				let app = getApp();
				let globalData = app.globalData;

				for (var k in globalData.bankData) {
					this[k] = globalData.bankData[k];
				}
				this.showArrow = true;

				this.timer = setInterval(() => {
					if (this.lastTime <= 0) {
						clearInterval(this.timer);
						uni.showToast({
							icon: "none",
							mask: true,
							title: "考试时间已到，系统将自动交卷",
							duration: 10000,
						});

						this.isAutoSubmit = true;

						this.submit();
						return;
					}
					this.lastTime--;
				}, 1000);
			} else {
				//进入页面
				await this.bankExam();
				await this.setSystemTime();
				this.goodsQuestionList();
			}
		},
		onUnload() {
			if (this.isSubmit) {
				clearInterval(this.timer);
				return;
			}
			//考试试卷 阻止ios手势返回，自动跳回答题页
			if (this.needBack) {
				let app = getApp();
				app.globalData.bankData = this.$data;
				clearInterval(this.timer);
				uni.navigateTo({
					url: "/pages2/bank/questionBank?examId=" +
						this.examId +
						"&eachExamId=" +
						this.eachExamId +
						"&isback=true" +
						"&subscribeId=" +
						this.subscribeId +
						"&examStartTime=" +
						this.examStartTime +
						"&examEndTime=" +
						this.examEndTime,
				});
			} else {
				//点击返回按钮确认允许退出，记录答题记录
				clearInterval(this.timer);

				this.mockRecordEdit();
			}
		},
		methods: {
			...mapActions(["setSystemTime"]),
			/**
			 * 是否有上传图片
			 */
			hasImgs(bank) {
				return bank.ansText.imageList.length == 0;
			},
			/**
			 * 获取试卷类型2考试,1练习
			 */
			bankExam() {
				return new Promise((resolve, reject) => {
					this.$api.bankExam(this.examId).then((res) => {
						const {
							examLimitClient,
							doType
						} = res.data.data;
						if (!examClientCanLearn(examLimitClient)) {
							return;
						}
						this.bankType = doType;
						this.examData = res.data.data;
						if (this.bankType == 2) {
							this.needBack = true;
						}
						resolve();
					});
				});
			},
			/**
			 * 点击后退按钮
			 */
			clickLeft() {
				if (this.bankType == 1) {
					let ansCount = this.questionOverNum(true); //已答题数
					this.lastCount = this.questionList.length - ansCount; //统计未答完的题数

					//所有题目答完
					if (this.lastCount == 0) {
						// this.testOver = true;
						this.cgType = 7;
						//未答完
					} else {
						this.cgType = 8;
						// this.isLastCount = true;
					}
					this.showpopups = true;
				} else if (this.bankType == 2) {
					let ansCount = this.questionOverNum(true); //已答题数
					this.lastCount = this.questionList.length - ansCount; //统计未答完的题数

					//所有题目答完
					if (this.lastCount == 0) {
						this.testOver = true;
						//未答完
					} else {
						this.isLastCount = true;
					}
				}
			},
			/**
			 * 返回上一页
			 */
			backPages() {
				this.needBack = false;
				uni.navigateBack({
					delta: 1,
				});
			},
			/**
			 * 获取已经回答的题目数
			 * hasSpecail (是否包含简答和案例)
			 */
			questionOverNum(hasSpecail) {
				let count = 0;
				this.questionList.forEach((item) => {
					if (item.type == 1 || item.type == 2 || item.type == 3) {
						if (item.ques) {
							count++;
						}
					} else if (item.type == 4) {
						//案例题
						if (hasSpecail) {
							let isOver = item.jsonStr.every((jsonItem, indexs) => {
								if (
									jsonItem.type == 1 ||
									jsonItem.type == 2 ||
									jsonItem.type == 3
								) {
									if (item.ques[indexs]) {
										return true;
									} else {
										return false;
									}
								} else if (jsonItem.type == 5) {
									if (
										item.ques[indexs] &&
										(item.ques[indexs].text || item.ques[indexs].imageList.length)
									) {
										console.log("chil");
										return true;
									} else {
										return false;
									}
								}
							});

							if (isOver) {
								count++;
								console.log(item, 444);
							}
						}
					} else if (item.type == 5) {
						//简答题
						if (hasSpecail) {
							if (item.ques && (item.ques.text || item.ques.imageList.length)) {
								console.log(5, item);
								count++;
							}
						}
					}
				});

				return count;
			},
			mockSubscribeEdit() {
				this.$api
					.mockSubscribeEdit({
						subscribeId: this.subscribeId,
						handStatus: this.isAutoSubmit ? 2 : 1,
					})
					.then((res) => {});
			},
			/**
			 * 是否做完所有题目
			 */
			isDoOver() {
				let questionOverNum = this.questionOverNum(true); //获取已经回答的题目数(包括简答和案例)
				if (this.questionList.length == questionOverNum) {
					//全部做完弹窗
					this.cgType = 9;
					this.showpopups = true;
				}
			},
			/**
			 * 暂不交卷
			 */
			noSubmit() {
				//设为允许退出页面
				this.needBack = false;
				uni.navigateBack({
					delta: 1,
				});
			},
			/**
			 * 不离开
			 */
			noLeave() {
				this.isLastCount = false;
			},
			/**
			 * 立即离开并交卷
			 */
			leaveNow() {
				this.needBack = false;
				this.isSubmit = true;
				this.submit(false);
				uni.navigateBack({
					delta: 1,
				});
			},
			/**
			 * 立即交卷
			 */
			submitNow() {
				console.log("sds");
				this.showpopups = false;
				this.needBack = false;
				this.submit();
			},
			/**
			 * 离开页面统计回答正确题数
			 */
			mockRecordEdit() {
				if (!this.isSubmit) {
					if (this.subscribeId) {
						this.mockSubscribeEdit();
					}
					let {
						doQuestionNum,
						doQuestionIds,
						rightQuestionNum,
						historyExamJson,
					} = this.$method.calculateScore(this.questionList);
					this.$api
						.mockRecordEdit({
							examId: this.examId,
							eachExamId: this.eachExamId,
							goodsId: this.goodsId,
							recordId: this.recordId,
							doQuestionIds,
							rightQuestionNum,
							status: 1,
							doQuestionNum,
							historyExamJson,
						})
						.then((res) => {});
				}
			},
			/**
			 * 记录总题数
			 * hasSpecial (是否包含简答和案例) true 包含  false 不包含
			 */
			mockRecord(hasSpecial) {
				let questionList = 0;
				// if(!hasSpecial) {
				this.questionList.forEach((item, index) => {
					if (item.type == 1 || item.type == 2 || item.type == 3) {
						questionList++;
					}
				});
				// } else {
				// 	questionList = this.questionList.length;
				// }

				this.$api
					.mockRecord({
						examId: this.examId,
						eachExamId: this.eachExamId,
						totalQuestionNum: questionList,
						allQuestionNum: this.questionList.length,
						doMode: this.doMode,
						simulateExamId: this.simulateExamId,
					})
					.then((res) => {
						this.recordId = res.data.data;
						//获取recordId 初始化先提交题目 以防突然下次继续做题退出报错
					});
			},
			/**
			 * @param {Object} second倒计时过滤器
			 */
			countdown(second) {
				if (second) {
					let h = parseInt((second / 60 / 60) % 24); //   计算小时
					let m = parseInt((second / 60) % 60); //   计算分数
					let s = parseInt(second % 60); //   计算当前秒数

					if (h < 10) h = "0" + h;
					if (m < 10) m = "0" + m;
					if (s < 10) s = "0" + s;

					return h + ":" + m + ":" + s;
				} else {
					return "";
				}
			},

			hideDialog() {
				this.showDialog = false;
			},
			noListTip(content = "该试卷暂无题目") {
				this.hideDialog();
				uni.showModal({
					showCancel: false,
					content,
					success: (k) => {
						if (k.confirm) {
							this.isSubmit = true;
							uni.navigateBack();
						}
					},
				});
			},
			/**
			 * 请求题目列表
			 */
			goodsQuestionList() {
				// app/common/bank/question/list
				this.$api[
					this.doMode == 3 ? "goodsRandomQuestionList" : "goodsQuestionList"
				]({
					examId: this.examId,
					goodsId: this.goodsId,
					orderGoodsId: this.orderGoodsId,
					from: 3,
				}).then((res) => {
					if (res.data.code == 500) {
						return this.noListTip("你已完成所有题目");
					}
					let data = res.data.data;
					if (this.doMode == 3) {
						this.simulateExamId = data.simulateExamId;
						data = data.questionList;
					}
					if (!data.length) {
						return this.noListTip();
					}

					if (this.subscribeId) {
						this.lastTime = this.examEndTime - this.sysTime;
						//考试时间到了自动交卷
						if (this.lastTime) {
							this.timer = setInterval(() => {
								if (this.lastTime <= 0) {
									clearInterval(this.timer);
									uni.showToast({
										icon: "none",
										mask: true,
										title: "考试时间已到，系统将自动交卷",
										duration: 5000,
									});

									this.isAutoSubmit = true;

									this.submit();
									return;
								}
								this.lastTime--;
							}, 1000);
						} else {}
					}

					data.forEach((item, index) => {
						// if (typeof item.jsonStr == 'string') {
						item.jsonStr = JSON.parse(item.jsonStr) || [];

						if (item.type == 2) {
							//多选
							item.jsonStr.forEach((str) => {
								str.optionsId = "" + str.optionsId;
							});
							let arr = item.answerQuestion.split(",");
							arr.forEach((a, i) => {
								arr[i] = "" + a;
							});
							item.ans = arr;
							item.analysisContent &&
								(item.analysisContent = item.analysisContent.replace(
									/<img/gi,
									'<img style="max-width:100%;"'
								));
							item.content &&
								(item.content = item.content.replace(
									/<img/gi,
									'<img style="max-width:100%;"'
								));
							return;
						} else if (item.type == 5) {
							//简答题
							item.ansText = {
								text: "",
								imageList: [],
							};

							item.ques = {
								text: "",
								imageList: [],
							};
							item.analysisContent &&
								(item.analysisContent = item.analysisContent.replace(
									/<img/gi,
									'<img style="max-width:100%;"'
								));
							item.content &&
								(item.content = item.content.replace(
									/<img/gi,
									'<img style="max-width:100%;"'
								));
						} else if (item.type == 4) {
							//案例题

							item.ques = [];
							item.current = 0;
							let ansArr = [];
							item.jsonStr.forEach((json, index) => {
								if (json.type == 1) {
									ansArr[index] = json.answerQuestion;
									json.content &&
										(json.content = json.content.replace(
											/<img/gi,
											'<img style="max-width:100%;"'
										));
								} else if (json.type == 2) {
									json.optionsList.forEach((str) => {
										str.optionsId = "" + str.optionsId;
									});
									let arr = json.answerQuestion.split(",");
									arr.forEach((a, i) => {
										arr[i] = "" + a;
									});
									ansArr[index] = arr;
									json.content &&
										(json.content = json.content.replace(
											/<img/gi,
											'<img style="max-width:100%;"'
										));
								} else if (json.type == 3) {
									ansArr[index] = json.answerQuestion;
									json.content &&
										(json.content = json.content.replace(
											/<img/gi,
											'<img style="max-width:100%;"'
										));
								} else if (json.type == 5) {
									ansArr[index] = {
										text: json.answerQuestion,
										imageList: [],
									};
									json.ansText = {
										text: "",
										imageList: [],
									};
									json.content &&
										(json.content = json.content.replace(
											/<img/gi,
											'<img style="max-width:100%;"'
										));
								}
							});

							item.analysisContent &&
								(item.analysisContent = item.analysisContent.replace(
									/<img/gi,
									'<img style="max-width:100%;"'
								));
							item.content &&
								(item.content = item.content.replace(
									/<img/gi,
									'<img style="max-width:100%;"'
								));
							item.ans = ansArr;
							return;
						}

						item.analysisContent &&
							(item.analysisContent = item.analysisContent.replace(
								/<img/gi,
								'<img style="max-width:100%;"'
							));
						item.content &&
							(item.content = item.content.replace(
								/<img/gi,
								'<img style="max-width:100%;"'
							));
						item.ans = item.answerQuestion;
						// }
					});

					this.questionList = data;

					this.lastCount = this.questionList.length;
					this.mockRecord();
				});
			},
			/**
			 * @param {Object} e单选点击
			 */
			radioSelect(optionsId, bindex) {
				// if (this.questionList[bindex].ques) return;
				// 类型为考试的可以重新在选择答案
				if (this.questionList[bindex].ques && this.bankType == 1) {
					return;
				}
				this.$set(this.questionList[bindex], "ques", optionsId);
				// if ((bindex + 1) < this.questionList.length) {
				//   this.current = bindex + 1
				// }
				console.log("改变后：", this.questionList[bindex].ques);
				this.isDoOver();
			},

			/**
			 * @param {Object} e案例单选点击
			 */
			radioSelectChild(optionsId, ansIndex, bindex) {
				// if (this.questionList[bindex].ques[ansIndex]) return;
				if (this.questionList[bindex].ques[ansIndex] && this.bankType == 1) {
					return;
				}
				this.$set(this.questionList[bindex].ques, ansIndex, optionsId);
				this.isDoOver();
			},

			/**
			 * @param {Object} 多选点击
			 */
			checkboxSelect(optionsId, bindex, index) {
				if (this.questionList[bindex].ques && this.bankType == 1) {
					return;
				}
				this.$set(
					this.questionList[bindex].jsonStr[index],
					"checked",
					!this.questionList[bindex].jsonStr[index].checked
				);
			},

			/**
			 * @param {Object} 案例多选点击
			 */
			checkboxSelectChild(bindex, ansIndex, childIndex) {
				if (this.questionList[bindex].ques[ansIndex] && this.bankType == 1) {
					return;
				}
				this.$set(
					this.questionList[bindex].jsonStr[ansIndex].optionsList[childIndex],
					"checked",
					!this.questionList[bindex].jsonStr[ansIndex].optionsList[childIndex]
					.checked
				);
			},

			isCheckboxChecked(arr) {
				return arr.some((item) => {
					if (item.checked) {
						return true;
					}
				});
			},

			/**
			 * @param {Object} 多选确认
			 */
			checkboxSubmit(bindex) {
				// if (this.questionList[bindex].ques) return;
				if (this.questionList[bindex].ques && this.bankType == 1) {
					return;
				}
				let arr = [];
				this.questionList[bindex].jsonStr.forEach((item) => {
					if (item.checked) {
						arr.push(item.optionsId);
					}
				});

				if (!arr.length) {
					delete this.questionList[bindex].ques;
					uni.showToast({
						title: "请选择答案",
						icon: "none",
					});
					return;
				}

				this.$set(this.questionList[bindex], "ques", arr);
				this.$u.toast("已确认答案");
				this.isDoOver();
				// 切换下一题
				if (
					this.bankType != 1 &&
					this.cgType != 9 &&
					bindex != this.questionList.length - 1
				) {
					this.current = bindex + 1;
					this.getCollectInfo(this.current);
				}
			},

			/**
			 * @param {Object} 案例多选确认
			 */
			checkboxSubmitChild(bindex, ansIndex) {
				// if (this.questionList[bindex].ques[ansIndex]) return;
				if (this.questionList[bindex].ques[ansIndex] && this.bankType == 1) {
					return;
				}
				let arr = [];
				this.questionList[bindex].jsonStr[ansIndex].optionsList.forEach(
					(item) => {
						if (item.checked) {
							arr.push(item.optionsId);
						}
					}
				);

				if (!arr.length) {
					delete this.questionList[bindex].ques[ansIndex];
					uni.showToast({
						title: "请选择答案",
						icon: "none",
					});
					return;
				}

				this.$set(this.questionList[bindex].ques, ansIndex, arr);
				this.$u.toast("已确认答案");
				this.isDoOver();
				// 切换下一题
				if (
					this.bankType != 1 &&
					this.cgType != 9 &&
					ansIndex != this.questionList[bindex].ques.length - 1
				) {
					this.questionList[bindex].current += 1;
				}
			},

			/**
			 * @param {Object} index
			 * @param {Object} bindex
			 * 判断题
			 */
			judgeSelect(index, bindex) {
				// if (this.questionList[bindex].ques) return;
				if (this.questionList[bindex].ques && this.bankType == 1) {
					return;
				}
				// 答案: 判断题1正确 0错误
				let value = index == 0 ? "1" : "0";
				// this.$set(this.questionList[bindex], "ques", index + "");
				this.$set(this.questionList[bindex], "ques", value);
				this.isDoOver();
			},

			/**
			 * @param {Object} ansindex
			 * @param {Object} childindex
			 * @param {Object} bindex
			 * 案例判断题
			 */
			judgeSelectChild(ansindex, childindex, bindex) {
				// if (this.questionList[bindex].ques[ansindex]) return;
				if (this.questionList[bindex].ques[ansindex] && this.bankType == 1) {
					return;
				}
				this.$set(
					this.questionList[bindex].ques,
					ansindex,
					childindex == 0 ? "1" : "0"
				);
				this.isDoOver();
			},

			openFooterTab() {
				this.show = true;
			},
			changeIndex(index) {
				this.current = index;
			},

			swiperChange(e) {
				this.current = e.detail.current;
			},

			pdsubmit() {
				// if (this.bankType == 1) {
				let ansCount = this.questionOverNum(true); //已答题数
				this.lastCount = this.questionList.length - ansCount; //统计未答完的题数
				//没有答完
				if (this.lastCount !== 0) {
					this.cgType = 6;
					this.showpopups = true;
					return;
				}
				// }

				if (this.bankType == 2) {
					if (this.lastTime > 0) {
						let lastTime = this.countdown(this.lastTime);
						uni.showModal({
							title: "提示",
							content: `时间还剩余${lastTime},确定交卷吗?`,
							confirmText: "交卷",
							cancelText: "继续答题",
							success: (res) => {
								if (res.confirm) {
									//确定
									this.submit();
								} else {
									//取消
								}
							},
						});
						return;
					}
				}
				this.submit();
			},
			/**
			 * 交卷
			 */
			submit(isShowTip = true) {
				let form = this.$method.calculateScore(this.questionList);
				if (this.subscribeId) {
					this.mockSubscribeEdit();
				}

				//交卷
				this.$api
					.mockRecordEdit({
						examId: this.examId,
						eachExamId: this.eachExamId,
						recordId: this.recordId,
						status: 1,
						examTime: parseInt(this.allTimes),
						doTime: parseInt(this.allTimes) - parseInt(this.lastTime),
						...form,
					})
					.then((res) => {
						this.isSubmit = true;
						if (res.data.code == 200) {
							if (!isShowTip) {
								return;
							}
							uni.showToast({
								title: "交卷成功",
								duration: 1000,
								icon: "none",
							});

							//错题集id提交（客观题）
							this.$api
								.mockWrongRecord({
									eachExamId: this.eachExamId,
									examId: this.examId,
									questionIds: form.questionIds,
									recordId: this.recordId,
									doMode: this.doMode,
								})
								.then((res) => {
									setTimeout(() => {
										uni.redirectTo({
											url: "/pages5/examReport/index?&examId=" +
												this.examId +
												"&id=" +
												this.recordId +
												"&eachExamId=" +
												this.eachExamId +
												"&subscribeId=" +
												this.subscribeId +
												"&doMode=" +
												this.doMode,
										});
									}, 1000);
								});
						}
					});

			},

			/**
			 * @param {Object} imgIndex
			 * @param {Object} bankIndex
			 * 删除简答图片
			 */
			deleteImg(imgIndex, bankIndex) {
				this.questionList[bankIndex].ansText.imageList.splice(imgIndex, 1);
			},

			/**
			 * @param {Object} imgIndex
			 * @param {Object} bankIndex
			 * @param {Object} ansIndex
			 * 删除案例题简答图片
			 */
			deleteImgChild(imgIndex, bankIndex, ansIndex) {
				this.questionList[bankIndex].jsonStr[ansIndex].ansText.imageList.splice(
					imgIndex,
					1
				);
			},

			/**
			 * @param {Object} bankindex
			 * 选择上传图片
			 */
			chooseImg(bankindex) {
				if (
					this.questionList[bankindex] &&
					this.questionList[bankindex].ansText &&
					this.questionList[bankindex].ansText.imageList.length >= 4
				) {
					uni.showToast({
						icon: "none",
						title: "最多选择4张",
					});
					return;
				}
				uni.chooseImage({
					count: 1, //默认9
					sizeType: ["compressed"], //可以指定是原图还是压缩图，默认二者都有
					sourceType: ["album", "camera"], //从相册选择
					success: (res) => {
						let self = this;
						// console.log(JSON.stringify(res.tempFilePaths));
						let img = res.tempFilePaths[0];
						uni.getImageInfo({
							src: img,
							success: async (res) => {
								let canvasWidth = res.width; //图片原始长宽
								let canvasHeight = res.height;
								if (canvasWidth > 1000 || canvasHeight > 1000) {
									uni.compressImage({
										src: img,
										quality: 75,
										width: "50%",
										height: "50%",
										success: async (rest) => {
											const dir = await self.uploadFile(rest
												.tempFilePath, 0);
											this.questionList[bankindex].ansText
												.imageList.push(dir);
										},
									});
								} else {
									const dir = await self.uploadFile(img, 0);
									this.questionList[bankindex].ansText.imageList.push(dir);
								}
							},
						});
					},
				});
			},

			/**
			 * @param {Object} bankindex
			 * @param {Object} ansindex
			 * 案例题选择上传图片
			 */
			chooseImgChild(bankindex, ansindex) {
				if (
					this.questionList[bankindex].jsonStr[ansindex] &&
					this.questionList[bankindex].jsonStr[ansindex].ansText &&
					this.questionList[bankindex].jsonStr[ansindex].ansText.imageList
					.length >= 4
				) {
					uni.showToast({
						icon: "none",
						title: "最多选择4张",
					});
					return;
				}
				uni.chooseImage({
					count: 1, //默认9
					sizeType: ["compressed"], //可以指定是原图还是压缩图，默认二者都有
					sourceType: ["album", "camera"], //从相册选择
					success: (res) => {
						let self = this;
						// console.log(JSON.stringify(res.tempFilePaths));
						let img = res.tempFilePaths[0];
						uni.getImageInfo({
							src: img,
							success: async (res) => {
								let canvasWidth = res.width; //图片原始长宽
								let canvasHeight = res.height;
								if (canvasWidth > 1000 || canvasHeight > 1000) {
									uni.compressImage({
										src: img,
										quality: 75,
										width: "50%",
										height: "50%",
										success: async (rest) => {
											const dir = await self.uploadFile(rest
												.tempFilePath, 0);
											this.questionList[bankindex].jsonStr[
												ansindex
											].ansText.imageList.push(dir);
										},
									});
								} else {
									const dir = await self.uploadFile(img, 0);
									this.questionList[bankindex].jsonStr[
										ansindex
									].ansText.imageList.push(dir);
								}
							},
						});
					},
				});
			},

			uploadFile(options, int) {
				var self = this;
				return new Promise((resolve, reject) => {
					var data = {
						orderGoodsId: this.orderGoodsId,
						imageStatus: int,
					};
					self.$api.aliyunpolicy(data).then((res) => {
						console.log(res.data, 6);
						if (res.data.code != 200) {
							self.$method.showToast("签名错误" + JSON.stringify(res.data));
							return;
						}
						var ossToken = res.data.data.resultContent;
						if (ossToken.host == null || ossToken.host == undefined) {
							self.$method.showToast("上传路径报错" + JSON.stringify(res.data));
							return;
						}
						uni.uploadFile({
							url: ossToken.host,
							name: "file",
							filePath: options,
							fileType: "image",
							header: {
								AuthorizationToken: "WX " + uni.getStorageSync("token"),
							},
							formData: {
								key: ossToken.dir,
								OSSAccessKeyId: ossToken.accessid,
								policy: ossToken.policy,
								Signature: ossToken.signature,
								callback: ossToken.callback,
								success_action_status: 200,
							},
							success: (result) => {
								// if (result.statusCode === 200) {
								resolve(ossToken.dir);
								// } else {
								//   uni.showToast({
								//     title: "上传失败",
								//     icon: "none",
								//   });
								//   return;
								// }
							},
							fail: (error) => {
								uni.showToast({
									title: "上传接口报错" + error,
									icon: "none",
								});
								return;
							},
						});
					});
				});
			},
			/**
			 * @param {Object} type
			 * @param {Object} bankindex
			 * 简答题答案确认
			 */
			submitAns(bankindex) {
				console.log(this.questionList[bankindex]);
				if (
					!this.questionList[bankindex].ansText.text &&
					!this.questionList[bankindex].ansText.imageList.length
				) {
					uni.showToast({
						title: "请输入内容或上传图片",
						duration: 2000,
						icon: "none",
					});
					return;
				}

				this.$set(this.questionList[bankindex], "ques", {
					imageList: this.questionList[bankindex].ansText.imageList || [],
					text: this.questionList[bankindex].ansText.text || "",
				});
				this.$u.toast("已确认答案");
				this.isDoOver();
			},

			/**
			 * @param {Object} bankindex
			 * @param {Object} ansindex
			 * 案例题简答答案确认
			 */
			submitAnsChild(bankindex, ansindex) {
				if (
					!this.questionList[bankindex].jsonStr[ansindex].ansText.text &&
					!this.questionList[bankindex].jsonStr[ansindex].ansText.imageList.length
				) {
					uni.showToast({
						title: "请输入内容或上传图片",
						duration: 2000,
						icon: "none",
					});
					return;
				}

				this.$set(this.questionList[bankindex].ques, ansindex, {
					imageList: this.questionList[bankindex].jsonStr[ansindex].ansText.imageList || [],
					text: this.questionList[bankindex].jsonStr[ansindex].ansText.text || "",
				});
				this.$u.toast("已确认答案");
				this.isDoOver();
			},

			right(bankIndex, ansIndex, option) {
				if (
					this.questionList[bankIndex].ques[ansIndex] &&
					this.questionList[bankIndex].ans[ansIndex]
				) {
					if (
						this.questionList[bankIndex].ques[ansIndex].indexOf(
							option.optionsId
						) != -1 ||
						this.questionList[bankIndex].ans[ansIndex].indexOf(
							option.optionsId
						) != -1
					) {
						return true;
					} else {
						return false;
					}
				} else {
					return false;
				}
			},

			wrong(bankIndex, ansIndex, option) {
				if (
					this.questionList[bankIndex].ques[ansIndex] &&
					this.questionList[bankIndex].ans[ansIndex]
				) {
					if (
						this.questionList[bankIndex].ques[ansIndex].indexOf(
							option.optionsId
						) != -1 &&
						this.questionList[bankIndex].ans[ansIndex].indexOf(
							option.optionsId
						) == -1
					) {
						return true;
					} else {
						return false;
					}
				} else {
					return false;
				}
			},

			tabSelect(index, bankindex) {
				this.$set(this.questionList[bankindex], "current", index);
			},

			showPhoto(contentStr) {
				// #ifdef H5
				return;
				// #endif
				if (contentStr && typeof contentStr == "string") {
					let reg = /<img[^>]*src[=\'\"\s]+([^\'\"]*)[\'\"]?[^>]*>/gi;
					let strArr = contentStr.match(reg);
					strArr.forEach((str, index) => {
						strArr[index] = str.replace(reg, "$1");
					});

					// 预览图片
					uni.previewImage({
						urls: strArr,
						longPressActions: {
							itemList: ["发送给朋友", "保存图片", "收藏"],
							success: function(data) {
								console.log(
									"选中了第" +
									(data.tapIndex + 1) +
									"个按钮,第" +
									(data.index + 1) +
									"张图片"
								);
							},
							fail: function(err) {
								console.log(err.errMsg);
							},
						},
					});
				}
			},
		},
		computed: {
			...mapGetters(["sysTime"]),
			doMode() {
				// 做题模式 1章卷 2随机练习 3模拟组卷
				return this.examData.simulateStatus ? 3 : undefined;
			},
		},
		components: {
			BankBom,
		},
	};
</script>

<style lang="scss" scoped>
	.questionBank {
		width: 100%;
		height: 100vh;
		display: flex;
		flex-direction: column;
	}

	.swiper {
		width: 100%;
		flex: 1;
	}

	.lisSty {
		margin-bottom: 16rpx;
		display: flex;
		align-items: center;

		.flex_auto {
			flex: 1;
			word-break: break-all;
		}
	}

	.activeTI {
		vertical-align: middle;
		display: inline-block;
		border: 1rpx solid #eee;
		border-radius: 50rpx;
		height: 48rpx;
		line-height: 46rpx;
		text-align: center;
		width: 48rpx;
		margin-right: 15rpx;
		color: #666;
		font-size: 30rpx;

		&.right {
			color: #fff;
			background: #36c75a;
		}

		&.wrong {
			color: #fff;
			background: #ff3b30;
		}

		&.checked,
		&.user_choose {
			color: #fff;
			background: #007aff;
		}
	}

	.submit_checkbox {
		position: fixed;
		left: 0;
		right: 0;
		bottom: 120rpx;
		margin: 20rpx auto;
		width: 526rpx;
		height: 80rpx;
		background: rgba(0, 122, 255, 1);
		color: #fff;
		text-align: center;
		line-height: 80rpx;
		font-size: 30rpx;
		border-radius: 40rpx;

		&.disabled {
			opacity: 0.6;
		}
	}

	.titles {
		overflow: hidden;
		margin-bottom: 24rpx;
	}

	.titBox {
		padding: 41rpx 25rpx 24rpx 25rpx;
	}

	.titBox_title {
		padding: 21rpx;
	}

	.tabs {
		margin: 10rpx;
		display: flex;

		.tab {
			margin: 0 4rpx;
			padding: 10rpx 13rpx;
			text-align: center;
			color: #007aff;
			font-size: 28rpx;
			border-radius: 16rpx;
			background: #fff;

			&.current {
				color: #fff;
				background: #007aff;
			}
		}
	}

	.ans {
		margin: 8rpx 8rpx 8rpx;

		.ans_input {
			border-radius: 16rpx;
			background: #fff;

			.top {
				border-bottom: 1rpx solid #eeeeee;
				padding: 16rpx;
				display: flex;
				align-items: center;

				.icon {
					margin-right: 20rpx;
					width: 40rpx;
					height: 38rpx;
				}

				.progress {
					flex: 1;
				}

				.submit {
					width: 168rpx;
					height: 48rpx;
					line-height: 48rpx;
					text-align: center;
					color: #fff;
					font-size: 30rpx;
					background: #007aff;
					border-radius: 24rpx;

					&.disabled {
						opacity: 0.6;
					}
				}
			}

			.textarea {
				textarea {
					width: 100%;
					height: 287rpx;
					padding: 10rpx;
				}
			}

			.imgs {
				overflow: hidden;
				display: flex;
				width: 100%;

				.img {
					width: 104rpx;
					height: 104rpx;
					border-radius: 8rpx;
					position: relative;
					margin: 20rpx;

					text {
						position: absolute;
						right: -15rpx;
						top: -15rpx;
						width: 30rpx;
						height: 30rpx;
						text-align: center;
						line-height: 30rpx;
						color: #fff;
						background: #ff3b30;
						border-radius: 50%;
					}

					image {
						width: 100%;
						height: 100%;
					}
				}
			}
		}

		.ans_submit {
			padding: 16rpx;
			border-radius: 16rpx;
			background: #fff;

			.imgs {
				overflow: hidden;
				display: flex;
				width: 100%;

				.img {
					width: 104rpx;
					height: 104rpx;
					border-radius: 8rpx;
					position: relative;
					margin: 20rpx;

					image {
						width: 100%;
						height: 100%;
					}
				}
			}
		}
	}

	.leftLetters {
		display: flex;
		align-items: center;
		width: 220rpx;

		.btnType {
			padding: 5rpx 10rpx;
			border: 1rpx solid #007aff;
			border-radius: 10rpx;
			background-color: rgba(0, 122, 255, 0.1);
			font-size: 28rpx;
			color: #007aff;
			margin-right: 15rpx;
		}
	}

	.firstLetter {
		display: flex;
		justify-content: space-between;
		align-items: center;
		margin-bottom: 30rpx;
	}

	.pageContent {
		position: relative;
		background-color: #eaeef1;
		height: 100%;
		padding-top: 8rpx;
		padding-bottom: 100rpx;
		overflow-y: scroll;
	}

	.pad_8 {
		background-color: #fff;
		margin: 0rpx 8rpx 8rpx;
		border-radius: 16rpx;

		&.no-margin {
			margin-top: -16rpx;
			border-radius: 0 0 16rpx 16rpx;
		}
	}

	.answer {
		height: 80rpx;
		line-height: 80rpx;
		padding: 0rpx 24rpx;
		display: flex;
		align-items: center;
		justify-content: space-between;
		color: #666;
		font-size: 30rpx;
	}

	.answerInfos {
		padding: 25rpx 25rpx 25rpx 23rpx;
	}

	.answerTitle {
		margin-bottom: 28rpx;
		color: #666;
		font-size: 30rpx;
	}

	.answerContent {
		font-size: 30rpx;
		color: #666;
	}

	.textChild {
		display: inline-block;
		vertical-align: middle;
	}

	.dialog {
		position: fixed;
		left: 0;
		top: 0;
		width: 100%;
		height: 100%;
		background-color: rgba(0, 0, 0, 0.8);
		display: flex;
		flex-direction: column;
		align-items: center;
		justify-content: center;
		z-index: 20000;

		.pointer {
			width: 338rpx;
			height: 240rpx;
		}

		.text {
			font-size: 32rpx;
			color: #ffffff;
			text-align: center;
		}

		.btn {
			width: 242rpx;
			height: 82rpx;
			border: 2rpx solid #ffffff;
			border-radius: 16rpx;
			text-align: center;
			line-height: 82rpx;
			margin: 41rpx auto;
			color: #fff;
			font-size: 32rpx;
		}
	}

	.dialog-arrow {
		padding-top: 124rpx;
		position: fixed;
		left: 0;
		top: 0;
		width: 100%;
		height: 100%;
		background-color: rgba(0, 0, 0, 0.8);
		z-index: 20000;

		.pointer {
			margin-left: 87rpx;
			display: block;
			width: 95rpx;
			height: 98rpx;
		}

		.text {
			padding-left: 177rpx;
			font-size: 32rpx;
			color: #ffffff;
		}

		.btn {
			width: 242rpx;
			height: 82rpx;
			border: 2rpx solid #ffffff;
			border-radius: 16rpx;
			text-align: center;
			line-height: 82rpx;
			margin: 500rpx auto 0;
			color: #fff;
			font-size: 32rpx;
		}
	}

	.dialog_wrap {
		position: fixed;
		left: 0;
		top: 0;
		width: 100%;
		height: 100%;
		z-index: 9999999999;

		.bg {
			background: rgba(0, 0, 0, 0.3);
			position: absolute;
			left: 0;
			top: 0;
			width: 100%;
			height: 100%;
		}

		.dialog {
			position: absolute;
			left: 50%;
			top: 50%;
			transform: translate3D(-50%, -50%, 0);
			width: 640rpx;
			height: 439rpx;
			background: #ffffff;
			border-radius: 24rpx;

			.title {
				font-size: 30rpx;
				font-weight: bold;
				color: #333333;
				line-height: 48rpx;
				text-align: center;
				margin-top: 40rpx;
			}

			.content {
				margin: 35rpx 35rpx 0;
				font-size: 30rpx;
				color: #666666;
				line-height: 48rpx;
			}

			.btns {
				margin-top: 35rpx;
				display: flex;
				align-items: center;
				justify-content: center;

				.btn {
					width: 200rpx;
					height: 80rpx;
					line-height: 80rpx;
					text-align: center;
					background: #f5f5f5;
					border-radius: 40rpx;
					font-size: 30rpx;
					color: rgba(0, 122, 255, 1);
					background: #f5f5f5;
					margin: 0 20rpx;

					&.active {
						color: #f5f5f5;
						background: rgba(0, 122, 255, 1);
					}
				}
			}
		}
	}

	.popboxs {
		width: 100%;
		height: 100%;
		display: flex;
		flex-direction: column;
		align-items: center;
	}

	.classTops {
		flex-shrink: 0;
		padding: 39rpx 0rpx 4rpx;
		font-weight: bold;
		color: #333;
		font-size: 30rpx;
	}

	.textStys {
		width: 100%;
		flex: 1;
		padding: 36rpx;
	}

	.classFootsty {
		flex-shrink: 0;
		display: flex;
		align-items: center;
		justify-content: center;
		padding: 10rpx 0rpx 40rpx;

		.btnsty {
			width: 200rpx;
			height: 80rpx;
			border-radius: 40rpx;
			font-weight: bold;
			font-size: 30rpx;
			text-align: center;
			line-height: 80rpx;
		}

		.btns1 {
			background-color: #f5f5f5;
			color: #007aff;
		}

		.btns2 {
			margin-left: 40rpx;
			background-color: #007aff;
			color: #ffffff;
		}
	}
</style>