|
|
@@ -0,0 +1,217 @@
|
|
|
+<template>
|
|
|
+ <view id="questionBank">
|
|
|
+ <view class="pageContent">
|
|
|
+ <view class="pad_8 titBox">
|
|
|
+ <view class="firstLetter">
|
|
|
+ <view class="leftLetters">
|
|
|
+ <view class="btnType">单选</view>
|
|
|
+ <text>1/10</text>
|
|
|
+ </view>
|
|
|
+ <view style="color: #666;font-size: 28rpx;">03:25:06</view>
|
|
|
+ <view class="leftLetters"></view>
|
|
|
+ </view>
|
|
|
+ <view class="titles">建造师执业资格注册的有效期一般为（ ）年。</view>
|
|
|
+ <view class="">
|
|
|
+ <view v-for="(item, index) in bankList" :key="index" class="lisSty">
|
|
|
+ <text class="activeTI">{{ ast[index] }}</text>
|
|
|
+ {{ item.label }}
|
|
|
+ </view>
|
|
|
+ </view>
|
|
|
+ </view>
|
|
|
+ <view class="pad_8 answer">
|
|
|
+ <view>正确答案：C</view>
|
|
|
+ <view>我的答案：B</view>
|
|
|
+ </view>
|
|
|
+ <view class="pad_8 answerInfos">
|
|
|
+ <view class="answerTitle">答案解析</view>
|
|
|
+ <view class="answerContent">
|
|
|
+ 建造师执业资格注册有效期一般为3年，有效期满前3个月，持证者应到原注册管理机构办理再次注册手续。在注册有效期内，变更执业单位者，应当及时办理变更手续。
|
|
|
+ </view>
|
|
|
+ </view>
|
|
|
+ </view>
|
|
|
+ <view class="footer_btn">
|
|
|
+ <view>收藏</view>
|
|
|
+ <view @click="openFooterTab">答题卡</view>
|
|
|
+ <view>交卷</view>
|
|
|
+ </view>
|
|
|
+ <u-popup v-model="show" mode="bottom" border-radius="14" height="680rpx">
|
|
|
+ <view class="popupView">
|
|
|
+ <view class="popupTops">
|
|
|
+ <view class="topIcon"></view>
|
|
|
+ 点击编号即可跳转至对应题目
|
|
|
+ </view>
|
|
|
+ <view class="popupContent">
|
|
|
+ <scroll-view scroll-y="true" style="height: 506rpx;">
|
|
|
+ <view class="boxSty">
|
|
|
+ <view v-for="(item, index) in 23" :key="index" class="liListSty">{{ index + 1 }}</view>
|
|
|
+ </view>
|
|
|
+ </scroll-view>
|
|
|
+ </view>
|
|
|
+ </view>
|
|
|
+ </u-popup>
|
|
|
+ </view>
|
|
|
+</template>
|
|
|
+
|
|
|
+<script>
|
|
|
+export default {
|
|
|
+ data() {
|
|
|
+ return {
|
|
|
+ ast: ['A', 'B', 'C', 'D', 'E', 'F', 'G'],
|
|
|
+ show: false,
|
|
|
+ bankList: [
|
|
|
+ {
|
|
|
+ label: '我是选项一',
|
|
|
+ value: 1
|
|
|
+ },
|
|
|
+ {
|
|
|
+ label: '我是选项二',
|
|
|
+ value: 2
|
|
|
+ },
|
|
|
+ {
|
|
|
+ label: '我是选项三',
|
|
|
+ value: 3
|
|
|
+ },
|
|
|
+ {
|
|
|
+ label: '我是选项四',
|
|
|
+ value: 4
|
|
|
+ }
|
|
|
+ ]
|
|
|
+ };
|
|
|
+ },
|
|
|
+ methods: {
|
|
|
+ openFooterTab() {
|
|
|
+ this.show = true;
|
|
|
+ }
|
|
|
+ }
|
|
|
+};
|
|
|
+</script>
|
|
|
+
|
|
|
+<style lang="scss" scoped>
|
|
|
+.lisSty {
|
|
|
+ margin-bottom: 16rpx;
|
|
|
+}
|
|
|
+.activeTI {
|
|
|
+ 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;
|
|
|
+}
|
|
|
+.titles {
|
|
|
+ margin-bottom: 24rpx;
|
|
|
+}
|
|
|
+.titBox {
|
|
|
+ padding: 41rpx 25rpx 24rpx 25rpx;
|
|
|
+}
|
|
|
+.firstLetter {
|
|
|
+ display: flex;
|
|
|
+ justify-content: space-between;
|
|
|
+ align-items: center;
|
|
|
+ margin-bottom: 30rpx;
|
|
|
+ .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;
|
|
|
+ }
|
|
|
+ }
|
|
|
+}
|
|
|
+.popupView {
|
|
|
+ height: 100%;
|
|
|
+ padding-bottom: 100rpx;
|
|
|
+ .popupTops {
|
|
|
+ height: 77rpx;
|
|
|
+ border-bottom: 1rpx solid #eee;
|
|
|
+ text-align: center;
|
|
|
+ line-height: 77rpx;
|
|
|
+ font-size: 24rpx;
|
|
|
+ color: #999;
|
|
|
+ position: relative;
|
|
|
+ .topIcon {
|
|
|
+ position: absolute;
|
|
|
+ top: 10rpx;
|
|
|
+ left: 50%;
|
|
|
+ transform: translateX(-50%);
|
|
|
+ width: 80rpx;
|
|
|
+ height: 8rpx;
|
|
|
+ background-color: #999;
|
|
|
+ border-radius: 4rpx;
|
|
|
+ }
|
|
|
+ }
|
|
|
+ .popupContent {
|
|
|
+ }
|
|
|
+}
|
|
|
+.pageContent {
|
|
|
+ background-color: #eaeef1;
|
|
|
+ min-height: 100vh;
|
|
|
+ padding-top: 8rpx;
|
|
|
+ padding-bottom: 100rpx;
|
|
|
+}
|
|
|
+.pad_8 {
|
|
|
+ background-color: #fff;
|
|
|
+ margin: 0rpx 8rpx 8rpx;
|
|
|
+ border-radius: 16rpx;
|
|
|
+}
|
|
|
+.answer {
|
|
|
+ height: 80rpx;
|
|
|
+ line-height: 80rpx;
|
|
|
+ padding: 0rpx 24rpx;
|
|
|
+ display: flex;
|
|
|
+ align-items: center;
|
|
|
+ justify-content: space-between;
|
|
|
+ color: #666;
|
|
|
+ font-size: 30rpx;
|
|
|
+}
|
|
|
+.footer_btn {
|
|
|
+ background-color: #fff;
|
|
|
+ z-index: 10078;
|
|
|
+ position: fixed;
|
|
|
+ bottom: 0rpx;
|
|
|
+ display: flex;
|
|
|
+ align-items: center;
|
|
|
+ justify-content: space-between;
|
|
|
+ width: 100%;
|
|
|
+ height: 98rpx;
|
|
|
+ padding: 0rpx 38rpx;
|
|
|
+ border-top: 1rpx solid #eee;
|
|
|
+}
|
|
|
+.boxSty {
|
|
|
+ padding: 44rpx 41rpx 0rpx;
|
|
|
+}
|
|
|
+.liListSty {
|
|
|
+ width: 88rpx;
|
|
|
+ height: 88rpx;
|
|
|
+ border-radius: 32rpx;
|
|
|
+ background-color: #ff3b30;
|
|
|
+ text-align: center;
|
|
|
+ line-height: 88rpx;
|
|
|
+ color: #fff;
|
|
|
+ font-size: 32rpx;
|
|
|
+ float: left;
|
|
|
+ margin: 20rpx 23rpx;
|
|
|
+}
|
|
|
+.answerInfos {
|
|
|
+ padding: 25rpx 25rpx 25rpx 23rpx;
|
|
|
+}
|
|
|
+.answerTitle {
|
|
|
+ margin-bottom: 28rpx;
|
|
|
+ color: #666;
|
|
|
+ font-size: 30rpx;
|
|
|
+}
|
|
|
+.answerContent {
|
|
|
+ font-size: 30rpx;
|
|
|
+ color: #666;
|
|
|
+}
|
|
|
+</style>
|
