|
|
@@ -1,6 +1,17 @@
|
|
|
<template>
|
|
|
- <view >
|
|
|
- <view class="footer_tab">
|
|
|
+ <view>
|
|
|
+ <view class="contentList">
|
|
|
+ <view class="headerTitle">
|
|
|
+ <view class="leftIcon" v-for="(item, index) in titleS" :key="index" v-if="item.value === list[nowPageData].type">
|
|
|
+ <span >{{ item.label }}</span>
|
|
|
+ </view>
|
|
|
+ <view class="right">
|
|
|
+ 1
|
|
|
+ <span class="lengNum">/10</span>
|
|
|
+ </view>
|
|
|
+ </view>
|
|
|
+ </view>
|
|
|
+ <view class="footer_tab">
|
|
|
<u-line color="#D6D6DB" />
|
|
|
<u-row gutter="16">
|
|
|
<u-col span="4">
|
|
|
@@ -30,10 +41,10 @@
|
|
|
</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="index%2==0?'btn_bac2':'btn_bac1'">
|
|
|
- <text class="">{{index}}</text>
|
|
|
+ <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="index % 2 == 0 ? 'btn_bac2' : 'btn_bac1'">
|
|
|
+ <text class="">{{ index + 1 }}</text>
|
|
|
</view>
|
|
|
</scroll-view>
|
|
|
</view>
|
|
|
@@ -42,110 +53,152 @@
|
|
|
</template>
|
|
|
|
|
|
<script>
|
|
|
- export default {
|
|
|
- data() {
|
|
|
- return {
|
|
|
- type:1,
|
|
|
- show:false,
|
|
|
- list:[1,2,3,4,5,6,7,2,3,4,5,6,7,2,3,4,5,6,7,2,3,4,5,
|
|
|
- 6,1,2,3,4,5,6,7,2,3,4,5,6,7,2,3,4,5,6,7,2,3,4,5,6,7]
|
|
|
+export default {
|
|
|
+ data() {
|
|
|
+ return {
|
|
|
+ type: 1,
|
|
|
+ show: false,
|
|
|
+ list: [],
|
|
|
+ nowPageData: 0,
|
|
|
+ titleS: [
|
|
|
+ {
|
|
|
+ label: '单选题',
|
|
|
+ value: 1
|
|
|
+ },
|
|
|
+ {
|
|
|
+ label: '多选题',
|
|
|
+ value: 2
|
|
|
+ }
|
|
|
+ ]
|
|
|
+ };
|
|
|
+ },
|
|
|
+ onLoad(option) {
|
|
|
+ this.titleListFn(option);
|
|
|
+ },
|
|
|
+ onShow() {},
|
|
|
+ methods: {
|
|
|
+ titleListFn(option) {
|
|
|
+ if (option.bankSectionId) {
|
|
|
+ var data = {
|
|
|
+ bankSectionId: option.bankSectionId
|
|
|
+ };
|
|
|
}
|
|
|
+ if (option.examId) {
|
|
|
+ var data = {
|
|
|
+ examId: option.examId
|
|
|
+ };
|
|
|
+ }
|
|
|
+ this.$api.questiondetailList(data).then(res => {
|
|
|
+ this.list = res.data.rows;
|
|
|
+ });
|
|
|
},
|
|
|
- onLoad(option) {
|
|
|
- this.type = option.type
|
|
|
- console.log(this.type)
|
|
|
- },
|
|
|
- onShow(){
|
|
|
- },
|
|
|
- methods: {
|
|
|
- menu(){
|
|
|
- this.show = true
|
|
|
- },
|
|
|
-
|
|
|
- },
|
|
|
-
|
|
|
+ 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;
|
|
|
- }
|
|
|
+::-webkit-scrollbar {
|
|
|
+ width: 0;
|
|
|
+ height: 0;
|
|
|
+ color: transparent;
|
|
|
+}
|
|
|
+.u-drawer-content-visible {
|
|
|
+ border-radius: 32rpx 32rpx 0rpx 0rpx;
|
|
|
+ overflow: hidden;
|
|
|
+}
|
|
|
</style>
|
|
|
<style scope>
|
|
|
- .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;
|
|
|
- }
|
|
|
+.contentList {
|
|
|
+ padding: 0rpx 32rpx;
|
|
|
+}
|
|
|
+.contentList > .headerTitle {
|
|
|
+ display: flex;
|
|
|
+ align-items: center;
|
|
|
+ justify-content: space-between;
|
|
|
+ color: #32467b;
|
|
|
+}
|
|
|
+.headerTitle > .leftIcon {
|
|
|
+ padding: 0rpx 10rpx;
|
|
|
+ height: 36rpx;
|
|
|
+ line-height: 36rpx;
|
|
|
+ border: 1rpx solid #32467b;
|
|
|
+ font-size: 28rpx;
|
|
|
+ border-radius: 10rpx;
|
|
|
+ background-color: rgba(50, 70, 123, 0.1);
|
|
|
+}
|
|
|
+.headerTitle > .right > .lengNum {
|
|
|
+ font-size: 28rpx;
|
|
|
+ color: #999999;
|
|
|
+}
|
|
|
+.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;
|
|
|
- }
|
|
|
+ background: #ffffff;
|
|
|
+}
|
|
|
</style>
|