Skip to content

S
self-support
Commit 26039978 authored by Facius's avatar Facius
Browse files
Options

入驻考试页面高保真

parent 0fb0c16a
Show whitespace changes
Inline Side-by-side
Showing with 864 additions and 792 deletions
src/pages.json
View file @ 26039978
......@@ -145,7 +145,9 @@
{
"path": "pages/exam/index",
"style": {
"navigationBarTitleText": "入驻考试"
"navigationBarTitleText": "入驻考试",
"navigationStyle": "custom",
"disableScroll": true
}
},
{
......@@ -227,8 +229,8 @@
"query": "" //启动参数，在页面的onLoad函数里面得到
},
{
"name": "在线考试-old", //模式名称
"path": "pages/exam/start", //启动页面，必选
"name": "入驻考试", //模式名称
"path": "pages/exam/index", //启动页面，必选
"query": "" //启动参数，在页面的onLoad函数里面得到
},
{
......
src/pages/exam/index.vue
View file @ 26039978
<template>
<view class="backView">
<template v-if="isStart==false">
<Settle :index="2">
<!-- <template v-if="isStart==false">
<view class="noticeView">
<text class="noticeText">规则：系统随机出现20道考试题目，每道题5分，每题答题时间100秒，在规定时间内答对题目的记分。
</text>
......@@ -10,37 +11,45 @@
<text class="bottomTitle">开始考试答题</text>
</view>
</view>
</template>
<template v-if="isStart==true && currentItem">
<view class="bottom-padding">
<view class="numberView">
<text class="numberText">{{progress}}</text>
</template> -->
<!-- <template v-if="isStart==true && currentItem"> -->
<view class="bottom-padding" v-if="currentItem">
<view class="title-view">
<view class="title-text">
<text>{{ titleText[Math.max(0, currentItem.question.answerType - 1)] }}</text>
</view>
<view class="title-right-view">
<image class="timeIcon" src="/static/settle/time1@3x.png" mode=""></image>
<text class="timeText">倒计时：</text><text class="time-count-down">{{currentTime}}</text>
</view>
</view>
<view class="topicView">
<text class="topicText">{{currentItem.question.content}}</text>
</view>
<view class="itemBackView" v-for="(item,ikey) in currentItem.answerList" :key="ikey">
<view :class="['itemView',item.isSelect ? 'active':'']" @click="itemClick(item,ikey)">
<view :class="['itemView',item.isSelect ? 'active':'']" v-for="(item,ikey) in currentItem.answerList" :key="ikey" @click="itemClick(item,ikey)">
<view :class="item.isSelect ? 'itemIndexView' : 'itemIndexView grayBorder' ">
<text :class="item.isSelect ? 'itemIndexText whiteColor selectBackColor' : 'itemIndexText defaultColor' ">
<text
:class="item.isSelect ? 'itemIndexText whiteColor selectBackColor' : 'itemIndexText gray-color' ">
{{alphaArr[ikey]}}
</text>
</view>
<text :class="item.isSelect ? 'itemText selectedColor' : 'itemText defaultColor' ">{{contentFilter(item.content)}}</text>
<!--view></view-->
</view>
<view
:class="item.isSelect ? 'itemText selectedColor' : 'itemText defaultColor' ">{{contentFilter(item.content)}}</view>
</view>
<!--view class="itemView" v-for="(item,ikey) in currentItem.answerList":key="ikey">
<text :class="item.isSelect ? 'itemText selectedColor' : 'itemText defaultColor' "
@click="itemClick(item,ikey)">{{item.content}}</text>
</view-->
</view>
<!-- </template> -->
<template v-slot:bottom>
<view class="answerBottomView">
<view class="bottomLeftView">
<image class="timeIcon" :src="clock_url" mode=""></image>
<text class="timeText">倒计时：{{currentTime}}</text>
<view class="bottom-left-view">
<image class="bottom-icon" src="/static/settle/timu@3x.png" mode=""></image>
<text class="numberText">{{progress}}</text>
</view>
<view class="bottomRightView">
<view :class="isSelect ? 'nextBtn selectBackColor' : 'nextBtn defaultBackColor' "
......@@ -50,12 +59,11 @@
</view>
</view>
</view>
</template>
</Settle>
<view class="mask" v-show="isComplete">
<view class="box">
<image class="icon" src="@/static/settle/icon-success.png"></image>
<image class="icon" src="../../static/settle/chenggong@3x.png"></image>
<view class="txt">您已成功完成考试</view>
<button class="btn" @click="$u.debounce(goSignContract, 500)">
去提交
......@@ -66,10 +74,14 @@
</template>
<script>
import Settle from '@/components/settle/index.vue'
const globalUrl = process.uniEnv || {}
const systemApiUrl = globalUrl.systemUrl.apiUrl
const ucenterApiUrl = globalUrl.ucenterUrl.apiUrl
export default {
components: {
Settle
},
data() {
return {
examId: 2,
......@@ -83,11 +95,16 @@
progress: '',
bottomTitle: '下一题',
isStop: false,
clock_url:'https://qn-static.banshouhui.com/clock_exam.png',
examScore:0,
alphaArr:['A','B','C','D','E'],
timer:null,
isComplete:false, // 是否已经考试完成判定
clock_url: 'https://qn-static.banshouhui.com/clock_exam.png',
examScore: 0,
alphaArr: ['A', 'B', 'C', 'D', 'E'],
timer: null,
isComplete: false, // 是否已经考试完成判定
}
},
computed: {
titleText() {
return ['单选', '多选', '问答']
}
},
onLoad(e) {
......@@ -98,18 +115,18 @@
},
methods: {
goSignContract(){
goSignContract() {
const url = '/pages/settle/prompt'
uni.navigateTo({
url
url: url + '?pageIndex=' + '3'
})
},
contentFilter(txt){
if(!txt){
contentFilter(txt) {
if (!txt) {
return txt
}
let reg = /\w+\.?/;
const result = txt.replace(reg,'')
const result = txt.replace(reg, '')
return result
},
//开始考试 点击
......@@ -160,14 +177,14 @@
that.applyExam()
return
}
if(res.data.data.examStatus == 1){
if (res.data.data.examStatus == 1) {
console.log('111111111111111111111111111')
that.isComplete = true
that.examScore = res.data.data.examScore
that.postResult()
return
}
if (res.data.data.examStatus == 0 ) {
if (res.data.data.examStatus == 0) {
that.userExamId = res.data.data.id
that.getNext()
}
......@@ -301,6 +318,8 @@
that.handleData()
that.currentTime = 100
that.currentTime = 10000
that.isSelect = false
clearTimeout(this.timer)
that.startCounting()
......@@ -338,9 +357,9 @@
handleData: function() {
this.currentItem.answerList.forEach((item,index) => {
this.currentItem.answerList.forEach((item, index) => {
item.isSelect = false
this.$set(this.currentItem.answerList,index,item)
this.$set(this.currentItem.answerList, index, item)
})
},
......@@ -395,7 +414,7 @@
}
}
this.$set(this.currentItem.answerList[i],isSelect,item.isSelect)
this.$set(this.currentItem.answerList[i], isSelect, item.isSelect)
}
......@@ -420,7 +439,7 @@
nextClick: function() {
//判断有没有选
if (!this.isSelect){
if (!this.isSelect) {
return
}
......@@ -433,18 +452,18 @@
},
//上传考试结果
postResult: function () {
postResult: function() {
uni.showLoading({
title: '请稍候'
})
let that = this
uni.request({
url: ucenterApiUrl+'/v1/settled/update-settled-exam-score'
+'?access-token='+getApp().globalData.token,
url: ucenterApiUrl + '/v1/settled/update-settled-exam-score' +
'?access-token=' + getApp().globalData.token,
method: 'POST',
data: {
score:this.examScore || 0,
score: this.examScore || 0,
},
success: (res) => {
uni.hideLoading()
......@@ -509,7 +528,7 @@
//this.userAnswerIds = item.id + ',' + this.userAnswerIds
//answerType 题目类型，1单选，2多选，3简答，
if (this.currentItem.question.answerType== 2){//多选
if (this.currentItem.question.answerType == 2) { //多选
///*
......@@ -521,7 +540,7 @@
//*/
}else{//单选
} else { //单选
this.userAnswerIds = item.id
}
......@@ -548,11 +567,12 @@
<style lang="scss">
.backView {
background-color: #F3F3F3;
// position: absolute;
// top: 0;
// left: 0;
// width: 100%;
background-color: #F4F5F7;
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
display: flex;
flex-direction: column;
}
......@@ -585,45 +605,45 @@
}
.topicView {
margin-top: 60rpx;
margin-top: 40rpx;
width: 100%;
display: flex;
align-items: center;
margin-bottom: 40rpx;
}
.topicText {
color: #333333;
font-size: 36rpx;
padding-left: 28rpx;
padding-right: 36rpx;
padding-bottom: 20rpx;
font-size: 32rpx;
line-height: 48rpx;
font-weight: bold;
}
.itemBackView {
margin-top: 40rpx;
width: 100%;
display: flex;
justify-content: center;
align-items: center;
}
// .itemBackView {
// margin-top: 30rpx;
// width: 100%;
// display: flex;
// justify-content: center;
// align-items: center;
// }
.itemView {
background-color: #FFFFFF;
width: 690rpx;
margin-top: 30rpx;
background-color: #F4F5F7;
width: 100%;
padding: 40rpx 30rpx;
display: flex;
flex-direction: row;
align-items: center;
align-items: flex-start;
border-radius: 12rpx;
border:2rpx solid transparent;
&.active{
border:2rpx solid #2272FF;
border: 2rpx solid transparent;
font-size: 28rpx;
&.active {
background-color: #FFFFFF;
border: 2rpx solid #2272FF;
}
}
.itemIndexView {
margin-left: 30rpx;
width: 40rpx;
height: 40rpx;
border-radius: 8rpx;
......@@ -631,12 +651,17 @@
display: flex;
align-items: center;
justify-content: center;
flex-shrink:0
}
.grayBorder{
.grayBorder {
border: 2rpx solid #999999;
}
.gray-color {
color: #999999;
}
.itemIndexText {
border-radius: 8rpx;
width: 36rpx;
......@@ -650,9 +675,6 @@
.itemText {
margin-left: 20rpx;
font-size: 28rpx;
padding-top: 40rpx;
padding-bottom: 40rpx;
padding-right: 40rpx;
}
.bottomView {
......@@ -681,69 +703,87 @@
color: #FFFFFF;
}
.answerBottomView {
background-color: #FFFFFF;
width: 100%;
height: 200rpx;
// .answerBottomView {
// background-color: #FFFFFF;
// width: 100%;
// height: 200rpx;
// display: flex;
// flex-direction: row;
// align-items: center;
// justify-content: space-between;
// position: fixed;
// bottom: 0;
// }
.title-view {
display: flex;
flex-direction: row;
align-items: center;
justify-content: space-between;
position: fixed;
bottom: 0;
}
align-items: center;
.bottomLeftView{
height: 160rpx;
.title-text {
border-radius: 8rpx;
background-color: #FF930D;
font-size: 20rpx;
color: #FFFFFF;
width: 72rpx;
height: 40rpx;
display: flex;
flex-direction: row;
align-items: center;
justify-content: center;
}
.bottomRightView{
height: 160rpx;
.title-right-view {
display: flex;
flex-direction: row;
align-items: center;
}
.timeIcon {
margin-left: 30rpx;
width: 48rpx;
height: 48rpx;
margin-right: 12rpx;
width: 32rpx;
height: 32rpx;
}
.timeText {
margin-left: 10rpx;
font-size: 28rpx;
color: #333333;
}
.time-count-down {
width: 80rpx;
text-align: right;
}
}
}
.bottomRightView {
display: flex;
flex-direction: row;
align-items: center;
margin-right: 30rpx;
}
.nextBtn {
width: 400rpx;
width: 300rpx;
height: 104rpx;
border-radius: 52rpx;
margin-right: 30rpx;
display: flex;
align-items: center;
justify-content: center;
}
.defaultColor {
background-color: #FFFFFF;
color: #999999;
color: #333333;
}
.defaultBackColor {
background-color: #999999;
background-color: #D1D4D4;
}
.selectedColor {
color: #2272FF;
}
.whiteColor{
.whiteColor {
color: #FFFFFF;
}
......@@ -752,9 +792,35 @@
}
.bottom-padding {
padding-bottom: 180rpx;
margin-bottom: 188rpx;
background-color: #FFFFFF;
border-radius: 12rpx;
padding: 40rpx 30rpx 46rpx 30rpx;
}
.answerBottomView {
display: flex;
align-items: center;
justify-content: space-between;
.bottom-left-view {
display: flex;
align-items: center;
margin-left: 30rpx;
.bottom-icon {
width: 44rpx;
height: 44rpx;
}
.numberText {
color: #666666;
font-size: 32rpx;
margin-left: 30rpx;
}
}
}
.mask{
.mask {
position: fixed;
left: 0;
width: 100%;
......@@ -763,30 +829,34 @@
justify-content: center;
flex-direction: column;
align-items: center;
background: rgba(0,0,0,0.5);
background: rgba(0, 0, 0, 0.5);
}
.box{
.box {
width: 660rpx;
height:696rpx;
padding:0 70rpx;
height: 696rpx;
padding: 0 70rpx;
border-radius: 12rpx;
background-color: #fff;
.icon{
margin:80rpx auto 0 ;
.icon {
margin: 80rpx auto 0;
display: block;
width:192rpx;
height:192rpx;
width: 224rpx;
height: 224rpx;
}
.txt{
margin-top:78rpx;
margin-bottom:98rpx;
.txt {
margin-top: 20rpx;
margin-bottom: 98rpx;
font-weight: bold;
font-size: 48rpx;
line-height:66rpx ;
color: #666;
font-size: 40rpx;
line-height: 66rpx;
color: #2272FF;
text-align: center;
}
.btn{
.btn {
line-height: 104rpx;
border-radius: 52rpx;
background: #2272ff;
......
src/pages/settle/pay-ensure.vue
View file @ 26039978
......@@ -75,7 +75,7 @@
methods: {
successCallback() {
uni.navigateTo({
url: '/pages/settle/prompt'
url: '/pages/settle/prompt' + '?pageIndex=' + '4'
})
},
async getBaseInfo() {
......
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment