Skip to content

C
center-exam-show
提交 d8488018 authored 作者: lihuihui's avatar lihuihui
浏览文件
操作

新增页面

上级 fa0bc3a7
显示空白字符变更
内嵌 并排
正在显示 包含 451 行增加 和 142 行删除
.config.dev.js
浏览文件 @ d8488018
module.exports = { module.exports = {
domain: 'dev.ezijing.com', domain: 'dev.ezijing.com',
url: 'https://ehall2.ezijing.com/api', url: 'https://x-learning2.ezijing.com/api',
isEnableToIphoneDebugger: false, isEnableToIphoneDebugger: false,
// apiBaseURL: '//demo-login.ezijing.com/', // apiBaseURL: '//demo-login.ezijing.com/',
webpack: { webpack: {
......
package-lock.json
浏览文件 @ d8488018
...@@ -10450,6 +10450,11 @@ ...@@ -10450,6 +10450,11 @@
"resolved": "https://registry.npm.taobao.org/vue-template-es2015-compiler/download/vue-template-es2015-compiler-1.9.1.tgz", "resolved": "https://registry.npm.taobao.org/vue-template-es2015-compiler/download/vue-template-es2015-compiler-1.9.1.tgz",
"integrity": "sha1-HuO8mhbsv1EYvjNLsV+cRvgvWCU=" "integrity": "sha1-HuO8mhbsv1EYvjNLsV+cRvgvWCU="
}, },
"vuex": {
"version": "3.5.1",
"resolved": "https://registry.npmjs.org/vuex/-/vuex-3.5.1.tgz",
"integrity": "sha512-w7oJzmHQs0FM9LXodfskhw9wgKBiaB+totOdb8sNzbTB2KDCEEwEs29NzBZFh/lmEK1t5tDmM1vtsO7ubG1DFw=="
},
"watchpack": { "watchpack": {
"version": "1.7.4", "version": "1.7.4",
"resolved": "https://registry.npm.taobao.org/watchpack/download/watchpack-1.7.4.tgz?cache=0&sync_timestamp=1600385436518&other_urls=https%3A%2F%2Fregistry.npm.taobao.org%2Fwatchpack%2Fdownload%2Fwatchpack-1.7.4.tgz", "resolved": "https://registry.npm.taobao.org/watchpack/download/watchpack-1.7.4.tgz?cache=0&sync_timestamp=1600385436518&other_urls=https%3A%2F%2Fregistry.npm.taobao.org%2Fwatchpack%2Fdownload%2Fwatchpack-1.7.4.tgz",
......
package.json
浏览文件 @ d8488018
...@@ -83,6 +83,7 @@ ...@@ -83,6 +83,7 @@
"vue-loader": "^15.9.3", "vue-loader": "^15.9.3",
"vue-meta-info": "^0.1.7", "vue-meta-info": "^0.1.7",
"vue-router": "^3.4.6", "vue-router": "^3.4.6",
"vue-template-compiler": "^2.6.12" "vue-template-compiler": "^2.6.12",
"vuex": "^3.5.1"
} }
} }
src/action/LoginAction.js 0 → 100644
浏览文件 @ d8488018
import BaseACTION from './base_action'
import { Login } from '@api'
export default class LoginAction extends BaseACTION {
/* 获取考试信息 */
getExamInfo (examId) { return Login.getExamInfo(examId).then(res => res) }
/* 进入考试 */
userLogin (obj) { return Login.userLogin(obj).then(res => res) }
/* 确认信息 */
confirmInfo (obj) { return Login.confirmInfo(obj).then(res => res) }
// /* post传输方式 */
// postTest (obj = {}) {
// return Login.postTest(obj).then(res => {
// return res || { test: 'OK' }
// }).catch(res => {
// return res || { test: 'OK' }
// })
// }
// /* 当前登录用户，检测是否该系统有权限 */
// getInfo () {
// return Login.getInfo().then(res => {
// return res || { test: 'OK' }
// }).catch(res => {
// return res || { test: 'OK' }
// })
// }
}
src/action/index.js
浏览文件 @ d8488018
import TestAction from './TestAction' import TestAction from './TestAction'
import LoginAction from './LoginAction'
const Test = new TestAction() const Test = new TestAction()
const Login = new LoginAction()
const cAction = { const cAction = {
Test Test,
Login
} }
export default cAction export default cAction
src/api/base_api.js
浏览文件 @ d8488018
...@@ -87,7 +87,7 @@ export default class API { ...@@ -87,7 +87,7 @@ export default class API {
if (res.code === 'ECONNABORTED') { if (res.code === 'ECONNABORTED') {
err = new Error('网络超时，请稍后重试') err = new Error('网络超时，请稍后重试')
} else if (res.response) { } else if (res.response) {
err = new Error(JSON.stringify(res.response)) res.response.data.code === 0 ? err = res.response.data : err = new Error(JSON.stringify(res.response))
} else { } else {
err = new Error('msg:' + res.message + 'stack:' + res.stack) err = new Error('msg:' + res.message + 'stack:' + res.stack)
err.code = 500 err.code = 500
......
src/api/index.js
浏览文件 @ d8488018
import TestAPI from './test_api' import TestAPI from './test_api'
import LoginAPI from './login_api'
const Test = new TestAPI(webConf) const Test = new TestAPI(webConf)
const Login = new LoginAPI(webConf)
export { export {
Test Test,
Login
} }
src/api/login_api.js 0 → 100644
浏览文件 @ d8488018
import BaseAPI from './base_api'
export default class TestAPI extends BaseAPI {
/**
* 获取考试信息
* @param {[string]} examId resource_id
*/
getExamInfo = (examId) => this.get(`/ehall/v1/exam/view/${examId}`, {})
/**
* 进入考试
*/
userLogin = (obj = {}) => this.post('/ehall/v1/user/login', obj, { headers: { 'Content-Type': 'application/x-www-form-urlencoded' } })
confirmInfo = (obj = {}) => this.post('/ehall/v1/user/confirm', obj, { headers: { 'Content-Type': 'application/x-www-form-urlencoded' } })
// /**
// * post传输方式
// * @param {[object]} obj
// */
// postTest = (obj = {}) => this.post('/passport/rest/login', obj, { headers: { 'Content-Type': 'application/x-www-form-urlencoded' } })
// /**
// * 当前登录用户，检测是否该系统有权限
// */
// getInfo = () => this.post('/user_center/get_user_info', {}, { headers: { 'Content-Type': 'application/x-www-form-urlencoded' } })
}
src/components/common/bus.js 0 → 100644
浏览文件 @ d8488018
import Vue from 'vue'
export default new Vue()
src/components/exam/answerCard.vue
浏览文件 @ d8488018
<template> <template>
<div> <div>
<div class="info"> <div class="info">
<img src="http://placehold.it/200x200/" alt=""> <div class="shape">
<img src="https://zws-imgs-pub.ezijing.com/static/public/f2f02f49c3a107e7bf3201c91e29894e.jpg" alt="">
</div>
<div class="right"> <div class="right">
<div class="name">啊啊啊</div> <div class="name">陈泽亚</div>
<div class="code">qweqwe123</div> <div class="code">CzY1689367</div>
</div> </div>
</div> </div>
<div class="order-num"> <div class="order-num">
<div class="tit">单选题</div> <div class="tit">单选题</div>
<ul> <ul>
<li class="stu1">1</li> <li
<li class="stu1">2</li> :class="questionParams.questionIndex === 0
<li class="stu1 stu2 stu3">3</li> ? questionParams.answerRecord['1'] ? 'stu1 stu2' : 'stu2'
<li>4</li> : questionParams.answerRecord['1'] ? 'stu1' : ''">1</li>
<li>5</li> <!-- stu1已答 stu2当前 stu3标记 -->
<li>6</li> <!-- questionParams.answerRecord['1'] ? 'stu1' : '' questionParams.questionIndex === 0 ? 'stu2' : ''-->
<li>7</li> <!-- <li class="stu1">1</li>
</ul>
<div class="tit">单选题</div>
<ul>
<li class="stu1">1</li>
<li class="stu1">2</li>
<li class="stu1 stu2 stu3">3</li>
<li>4</li>
<li>5</li>
<li>6</li>
<li>7</li>
<li class="stu1">1</li>
<li class="stu1">2</li> <li class="stu1">2</li>
<li class="stu1 stu2 stu3">3</li> <li class="stu1 stu2 stu3">3</li>
<li>4</li> <li>4</li> -->
<li>5</li> <!-- <li class="stu1">1</li>
<li>6</li>
<li>7</li>
<li class="stu1">1</li>
<li class="stu1">2</li> <li class="stu1">2</li>
<li class="stu1 stu2 stu3">3</li> <li class="stu1 stu2 stu3">3</li>
<li>4</li> <li>4</li> -->
<li>5</li>
<li>6</li>
<li>7</li>
<li class="stu1">1</li>
<li class="stu1">2</li>
<li class="stu1 stu2 stu3">3</li>
<li>4</li>
<li>5</li>
<li>6</li>
<li>7</li>
</ul> </ul>
<div class="tit">单选题</div> <div class="tit">多选题</div>
<ul> <ul>
<li class="stu1">1</li> <li
<li class="stu1">2</li> :class="questionParams.questionIndex === 1
<li class="stu1 stu2 stu3">3</li> ? questionParams.answerRecord['2'] ? questionParams.answerRecord['2'].answer.length ? 'stu1 stu2' : 'stu2' : 'stu2'
<li>4</li> : questionParams.answerRecord['2'] ? questionParams.answerRecord['2'].answer.length ? 'stu1' : '' : ''">2</li>
<li>5</li> </ul>
<li>6</li> <div class="tit">判断题</div>
<li>7</li> <ul>
<li class="stu1">1</li> <li
<li class="stu1">2</li> :class="questionParams.questionIndex === 2
<li class="stu1 stu2 stu3">3</li> ? questionParams.answerRecord['3'] ? 'stu1 stu2' : 'stu2'
<li>4</li> : questionParams.answerRecord['3'] ? 'stu1' : ''">3</li>
<li>5</li> </ul>
<li>6</li> <div class="tit">复合题</div>
<li>7</li> <ul>
<li class="stu1">1</li> <li
<li class="stu1">2</li> :class="questionParams.questionIndex === 3
<li class="stu1 stu2 stu3">3</li> ? questionParams.answerRecord['4'] ? 'stu1 stu2' : 'stu2'
<li>4</li> : questionParams.answerRecord['4'] ? 'stu1' : ''">4</li>
<li>5</li>
<li>6</li>
<li>7</li>
<li class="stu1">1</li>
<li class="stu1">2</li>
<li class="stu1 stu2 stu3">3</li>
<li>4</li>
<li>5</li>
<li>6</li>
<li>7</li>
</ul> </ul>
</div> </div>
<ul class="flag-tips"> <ul class="flag-tips">
...@@ -94,15 +62,25 @@ ...@@ -94,15 +62,25 @@
<div class="circle3"></div> <div class="circle3"></div>
<div class="txt">当前</div> <div class="txt">当前</div>
</li> </li>
<li> <!-- <li>
<div class="circle4"></div> <div class="circle4"></div>
<div class="txt">标记</div> <div class="txt">标记</div>
</li> </li> -->
</ul> </ul>
</div> </div>
</template> </template>
<script> <script>
import Bus from '../../components/common/bus.js'
export default { export default {
props: {
questionParams: { type: Object, default: () => {} },
changeTime: { type: Number, default: () => {} }
},
mounted() {
Bus.$on('monitoringChanges', target => {
this.$forceUpdate()
})
}
} }
</script> </script>
<style lang="scss" scoped> <style lang="scss" scoped>
...@@ -110,10 +88,16 @@ export default { ...@@ -110,10 +88,16 @@ export default {
display: flex; display: flex;
align-items: center; align-items: center;
height: 100px; height: 100px;
img{ .shape{
width: 60px; width: 60px;
height: 60px; height: 60px;
border-radius: 50%; border-radius: 50%;
overflow: hidden;
}
img{
width: 75px;
// transform: scale(1);
display: block;
} }
.right{ .right{
margin-left: 22px; margin-left: 22px;
......
src/components/exam/dialogComponent.vue
浏览文件 @ d8488018
<template> <template>
<div class="pop-box">
<div class="main"> <div class="main">
<p> <p>
{{title}} {{title}}
<!-- <slot name="title"></slot> -->
</p> </p>
<div class="prompt"> <div class="prompt">
{{prompt}} {{prompt}}
<!-- <slot name="prompt"></slot> -->
</div> </div>
<div class="button"> <div class="button">
<div> <div>
<slot name="button"></slot> <slot name="button"></slot>
</div> </div>
</div> </div>
<div class="out"></div> <div class="out" @click="close"></div>
</div>
</div> </div>
</template> </template>
<script> <script>
export default { export default {
props: ['title', 'prompt'] props: ['title', 'prompt'],
methods: {
close() {
this.$emit('close')
}
}
} }
</script> </script>
<style lang="scss" scoped> <style lang="scss" scoped>
.pop-box{
position: fixed;
top: 0;
left: 0;
width: 100%;
height: 100%;
background: rgba(0,0,0,.5);
}
.main{ .main{
position: relative; position: absolute;
top: 50%;
left: 50%;
-webkit-transform: translate(-50%, -50%);
width: 342px; width: 342px;
height: 220px; height: 220px;
background-color: #fff; background-color: #fff;
......
src/components/exam/question.vue
浏览文件 @ d8488018
...@@ -26,22 +26,29 @@ ...@@ -26,22 +26,29 @@
<!-- 复合题 --> <!-- 复合题 -->
<template v-if="questionData.type === 4"> <template v-if="questionData.type === 4">
<div class="case-que"> <div class="case-que">
<div class="stem">李克强在讲话中首先代表党中央、国务院，向受命名的地方和受表彰的单位与个人 <div class="stem">{{questionData.stem}}</div>
表示热烈祝贺，向人民解放军指战员、武警官兵、民兵预备役人员、部队职工，向烈军
属、伤残军人、转业复员退伍军人和军队离退休干部，向双拥工作战线的同志们致以诚
挚问候，向所有关心支持国防和军队建设的社会各界人士表示衷心感谢。
李克强说，党的十八大以来，在以习近平同志为核心的党中央坚强领导下，各地区
各有关部门积极支持和服务保障军队建设改革，进一步加大优抚安置保障，军队支援经
济社会发展积极有为，在参与重大自然灾害抢险救援和应对突发事件中当先锋，年面对
疫情，人民子弟兵闻令而动、敢打硬仗，广大军民携手同心、共克时艰，取得了抗击疫
情斗争重大战略成果，彰显了军政军民团结的强大力量。</div>
<ul class="topics" :style="{height: contentHeight - 60 + 'px'}"> <ul class="topics" :style="{height: contentHeight - 60 + 'px'}">
<li> <template v-for="(item, index) in questionData.list">
<li :key="'type4' + index">
<div class="title"> <div class="title">
<span>11.</span>将以下5个句子重新排列组合，排列组合最连贯的是。 <span>{{ item.orderNum }}.</span>{{ item.title }}
</div> </div>
<ul class="radio-option"> <!-- radio-option check-option --> <ul :class="item.type === 2 ? 'check-option' : 'radio-option'"><!-- radio-option check-option -->
<li class="active"> <template v-for="(items, cIndex) in item.opt">
<li
:key="'c' + cIndex"
@click="changeOptions(item.type, item.id, items.id)"
:class="questionParams.answerRecord[item.id]
? questionParams.answerRecord[item.id].answer.find(id => { return id === items.id })
? 'active'
: ''
: ''"
>
<div class="icon"></div>
<div class="txt">{{items.text}}</div>
</li>
</template>
<!-- <li class="active">
<div class="icon"></div> <div class="icon"></div>
<div class="txt">A.⑤④②③①</div> <div class="txt">A.⑤④②③①</div>
</li> </li>
...@@ -56,14 +63,15 @@ ...@@ -56,14 +63,15 @@
<li> <li>
<div class="icon"></div> <div class="icon"></div>
<div class="txt">A.⑤④②③①</div> <div class="txt">A.⑤④②③①</div>
</li> </li> -->
</ul> </ul>
</li> </li>
<li> </template>
<!-- <li>
<div class="title"> <div class="title">
<span>11.</span>将以下5个句子重新排列组合，排列组合最连贯的是。 <span>11.</span>将以下5个句子重新排列组合，排列组合最连贯的是。
</div> </div>
<ul class="check-option"> <!-- radio-option check-option --> <ul class="check-option"> radio-option check-option
<li class="active"> <li class="active">
<div class="icon"></div> <div class="icon"></div>
<div class="txt">A.⑤④②③①</div> <div class="txt">A.⑤④②③①</div>
...@@ -81,13 +89,14 @@ ...@@ -81,13 +89,14 @@
<div class="txt">A.⑤④②③①</div> <div class="txt">A.⑤④②③①</div>
</li> </li>
</ul> </ul>
</li> </li> -->
</ul> </ul>
</div> </div>
</template> </template>
</div> </div>
</template> </template>
<script> <script>
import Bus from '../../components/common/bus.js'
export default { export default {
props: { props: {
contentHeight: { type: Number, default: () => {} }, contentHeight: { type: Number, default: () => {} },
...@@ -125,6 +134,7 @@ export default { ...@@ -125,6 +134,7 @@ export default {
this.questionParams.answerRecord[id] = { answer: [cId] } this.questionParams.answerRecord[id] = { answer: [cId] }
} }
} }
Bus.$emit('monitoringChanges')
this.$forceUpdate() this.$forceUpdate()
} }
}, },
......
src/main.js
浏览文件 @ d8488018
...@@ -3,6 +3,7 @@ import VueRouter from 'vue-router' // 使用 vue-router ...@@ -3,6 +3,7 @@ import VueRouter from 'vue-router' // 使用 vue-router
import createRouter from './router' // router定义 import createRouter from './router' // router定义
import VueI18n from 'vue-i18n' // 使用 国际化 import VueI18n from 'vue-i18n' // 使用 国际化
import createI18n from './assets/languages' // 国际化定义 import createI18n from './assets/languages' // 国际化定义
import store from '@/store'
import App from './app.vue' // 初始化 vue页面 import App from './app.vue' // 初始化 vue页面
import './style.scss' // 公共样式 import './style.scss' // 公共样式
...@@ -40,4 +41,4 @@ router.beforeEach((to, from, next) => { ...@@ -40,4 +41,4 @@ router.beforeEach((to, from, next) => {
next() next()
}) })
window.G.$instance_vue = new Vue({ router, i18n, render: (h) => h(App) }).$mount('#app') window.G.$instance_vue = new Vue({ store, router, i18n, render: (h) => h(App) }).$mount('#app')
src/pages/exam/examAnswer.vue
浏览文件 @ d8488018
...@@ -4,11 +4,11 @@ ...@@ -4,11 +4,11 @@
<div class="head" id="head-h"> <div class="head" id="head-h">
<div class="title">全国统一高考试卷A</div> <div class="title">全国统一高考试卷A</div>
<div class="right"> <div class="right">
<div class="count">已答{{ questionParams.answeredCount }}/{{ questionParams.list.length + 1 }}</div> <div class="count">已答{{ questionParams.answeredCount }}/6</div>
<div class="time"> <!-- <div class="time">
<div class="icon"></div> <div class="icon"></div>
<div class="mun">60:00</div> <div class="mun">60:00</div>
</div> </div> -->
</div> </div>
</div> </div>
<div class="exam-main" :style="{height: this.contentHeight + 'px'}"> <div class="exam-main" :style="{height: this.contentHeight + 'px'}">
...@@ -19,7 +19,7 @@ ...@@ -19,7 +19,7 @@
></question> ></question>
</div> </div>
<div class="right"> <div class="right">
<answer-card></answer-card> <answer-card :questionParams="questionParams" :changeTime="changeTime"></answer-card>
</div> </div>
</div> </div>
<div class="foot" id="foot-h"> <div class="foot" id="foot-h">
...@@ -34,17 +34,22 @@ ...@@ -34,17 +34,22 @@
>下一题</div> >下一题</div>
</div> </div>
<div class="rigth-btn"> <div class="rigth-btn">
<div class="sign"> <!-- <div class="sign">
<div class="icon"></div> <div class="icon"></div>
<div class="txt">标记</div> <div class="txt">标记</div>
</div> </div> -->
<div class="end-exam-btn"> <div class="end-exam-btn">
<div class="btn">结束考试</div> <div class="btn" @click="isPopup = true">结束考试</div>
</div> </div>
</div> </div>
</div> </div>
</div> </div>
<!-- <dialog-component></dialog-component> --> <my-dia :title="title" :prompt="prompt" v-if="isPopup" @close="close">
<template v-slot:button>
<!-- <button>我知道了</button> -->
<button @click="close">好的</button>
</template>
</my-dia>
</div> </div>
</template> </template>
<script> <script>
...@@ -55,12 +60,16 @@ export default { ...@@ -55,12 +60,16 @@ export default {
components: { components: {
answerCard, answerCard,
question, question,
dialogComponent 'my-dia': dialogComponent
}, },
data() { data() {
return { return {
title: '提示',
prompt: '考试完成',
isPopup: false,
contentHeight: 0, contentHeight: 0,
// 题的数据所需的参数 // 题的数据所需的参数
changeTime: 0,
questionParams: { questionParams: {
answeredCount: 0, answeredCount: 0,
// 用户选择的选项 --- 提交后台的数据 // 用户选择的选项 --- 提交后台的数据
...@@ -141,27 +150,79 @@ export default { ...@@ -141,27 +150,79 @@ export default {
] ]
}, },
{ {
id: 4,
type: 4, type: 4,
stem: '将以下5个句子重新排列组合：',
list: [
{
id: 4,
type: 1,
orderNum: '4', orderNum: '4',
title: '将以下5个句子重新排列组合', title: '将以下5个句子重新排列组合： ',
des: '①宋代《新唐书音训》云：“京口在润州城东北甘露寺侧。<br/> ②这也就是李白《丁督护歌》中所描绘的“万人凿磐石，无由达江浒”的施工场面。<br/> ③而要开辟一条通京口的新漕路却是十分艰辛的。<br/> ④甘露寺正位于北固山，所以移徙这段漕路，势必要紧贴着北固山下与山根的顽石打交手战，这样的工程自非一日之功。<br/> ⑤瓜洲浦成为便利的津渡是由于它正对南岸江边的京口，而京口的漕路是在开元二十五年齐浣迁润州后才兴修的，换句话说，旧漕路原来并不通京口。 ',
opt: [
{
id: 1,
text: 'A、⑤④①③②'
},
{
id: 2,
text: 'B、④①②③⑤'
},
{
id: 3,
text: 'C、⑤③①④②'
},
{
id: 4,
text: 'D、④①③②⑤'
}
]
},
{
id: 5,
type: 2,
orderNum: '5',
title: '下列关于国际税法内容的陈述，正确的有（　）。',
des: '甘露寺正位于北固山，所以移徒这段漕路。', des: '甘露寺正位于北固山，所以移徒这段漕路。',
opt: [ opt: [
{ {
id: 1, id: 1,
text: '选项A' text: 'A、国际避税的基本方式就是跨国纳税人通过错用或滥用有关国家税法、国际税收协定，利用它们的差别、漏洞、特例和缺陷，规避纳税主体和纳税客体的纳税义务，不纳税或少纳税。'
}, },
{ {
id: 2, id: 2,
text: '选项B' text: 'B、税收情报交换是国际反避税的合作的主要内容'
}, },
{ {
id: 3, id: 3,
text: '选项C' text: 'C、加强国际税收合作，防止国际避税和逃税，这是国际税收协定的基本内容'
}, },
{ {
id: 4, id: 4,
text: '选项D' text: 'D、税收协定不能限制有关国家对跨国投资者提供更为优惠的税收待遇'
},
{
id: 5,
text: 'E、税收协定可以干预协约国对税法的修订和调整'
}
]
},
{
id: 6,
type: 3,
orderNum: '6',
title: '八月十五是中秋节？',
des: '甘露寺正位于北固山，所以移徒这段漕路。',
opt: [
{
id: 1,
text: 'A、正确'
},
{
id: 2,
text: 'B、错误'
}
]
} }
] ]
} }
...@@ -173,6 +234,9 @@ export default { ...@@ -173,6 +234,9 @@ export default {
this.contentHeight = parseInt(document.body.clientHeight - (this.getDom('head-h').offsetHeight + this.getDom('foot-h').offsetHeight)) this.contentHeight = parseInt(document.body.clientHeight - (this.getDom('head-h').offsetHeight + this.getDom('foot-h').offsetHeight))
}, },
methods: { methods: {
close() {
this.isPopup = false
},
getDom(id) { getDom(id) {
return document.getElementById(id) return document.getElementById(id)
}, },
...@@ -296,6 +360,7 @@ export default { ...@@ -296,6 +360,7 @@ export default {
justify-content: center; justify-content: center;
align-items: center; align-items: center;
.btn{ .btn{
cursor: pointer;
width: 200px; width: 200px;
height: 40px; height: 40px;
background: #EEEEEE; background: #EEEEEE;
......
src/pages/exam/examTime.vue
浏览文件 @ d8488018
...@@ -2,20 +2,52 @@ ...@@ -2,20 +2,52 @@
<div class="exam-t-box"> <div class="exam-t-box">
<div class="title">距离答题开始还有</div> <div class="title">距离答题开始还有</div>
<div class="time-count"> <div class="time-count">
<div class="time-block">32</div> <div class="time-block">{{date.num1}}</div>
<div class="time-block">32</div> <div class="time-block">{{date.num2}}</div>
<div class="spots"> <div class="spots">
<span></span> <span></span>
<span></span> <span></span>
</div> </div>
<div class="time-block">32</div> <div class="time-block">{{date.num3}}</div>
<div class="time-block">32</div> <div class="time-block">{{date.num4}}</div>
</div> </div>
<div class="tips-txt">倒计时结束后，系统会自动进入答题页面</div> <div class="tips-txt">倒计时结束后，系统会自动进入答题页面</div>
</div> </div>
</template> </template>
<script> <script>
export default { export default {
data() {
return {
date: {
num1: '0',
num2: '0',
num3: '0',
num4: '0'
}
}
},
mounted() {
setInterval(() => {
this.countDown()
}, 1000)
},
methods: {
countDown() {
// const date = JSON.parse(window.sessionStorage.getItem('examInfo')).start_time
const date = '2020-10-29 19:00:00'
const nowtime = new Date()
const endtime = new Date(date)
const lefttime = parseInt((endtime.getTime() - nowtime.getTime()) / 1000)
const td = `${this.addZero(parseInt(lefttime / 60 % 60))}${this.addZero(parseInt(lefttime % 60))}`
const arr = td.split('')
Object.keys(this.date).map((item, index) => {
this.date[item] = arr[index]
})
},
addZero(i) {
return i < 10 ? '0' + i : i + ''
}
}
} }
</script> </script>
<style lang="scss" scoped> <style lang="scss" scoped>
......
src/pages/login/confirmInfo.vue
浏览文件 @ d8488018
<template> <template>
<div class="confirm-mian"> <div class="confirm-mian">
<div class="con-info none"> <div class="con-info" v-if="!isTreaty">
<div class="head">全国统一高考试卷A</div> <div class="head">全国统一高考试卷A</div>
<div class="info-form"> <div class="info-form">
<div class="tit">基本信息确认</div> <div class="tit">基本信息确认</div>
<ul> <ul>
<li> <li>
<div class="name">姓名</div> <div class="name">姓名</div>
<input type="text"> <input type="text" v-model="form.name">
</li> </li>
<li> <li>
<div class="name">学号</div> <div class="name">学号</div>
<input type="text"> <input type="text" v-model="form.student_number">
</li> </li>
<li> <li>
<div class="name">性别</div> <div class="name">性别</div>
<div class="select-btn"> <div class="select-btn">
<div>男</div> <div :class="form.gender == 1 && 'active'" @click="selectGender(1)">男</div>
<div>女</div> <div :class="form.gender == 2 && 'active'" @click="selectGender(2)">女</div>
</div> </div>
</li> </li>
</ul> </ul>
<div class="confirm-btn">确定</div> <div class="confirm-btn" @click="confirmInfo">确定</div>
</div> </div>
</div> </div>
<div class="explain-box"> <div class="explain-box" v-if="isTreaty">
<div class="head">全国统一高考试卷A</div> <div class="head">全国统一高考试卷A</div>
<div class="exp-text"> <div class="exp-text">
<p>为保证本考试的公平性和严肃性，本次考试将会：</p> <!-- <p>为保证本考试的公平性和严肃性，本次考试将会：{{examInfo.config.promise_message}}</p> -->
<p v-html="examInfo.config.promise_message"></p>
</div> </div>
<div class="exp-btn"> <div class="exp-btn">
<div class="tips">点击“我同意”按钮接受以上内容。如果您不同意这些条款，将无法进行考试</div> <div class="tips">点击“我同意”按钮接受以上内容。如果您不同意这些条款，将无法进行考试</div>
<div class="btn-box"> <div class="btn-box">
<div>我同意</div> <div @click="agree">我同意</div>
<div>不同意</div> <div @click="disagree">不同意</div>
</div> </div>
</div> </div>
</div> </div>
</div> </div>
</template> </template>
<script> <script>
import action from '@action'
export default { export default {
data() {
return {
sInfo: JSON.parse(window.sessionStorage.getItem('studentInfo')),
examInfo: JSON.parse(window.sessionStorage.getItem('examInfo')),
form: {
name: '',
student_number: this.$store.state.studentInfo.student_number,
gender: 0
},
isTreaty: false
}
},
mounted() { mounted() {
console.log(document.body.clientHeight) this.defaultInto()
// console.log(this.isExamStatus(this.examInfo.start_time))
},
methods: {
agree() {
// 判断考试时间开始没有
this.isExamStatus(this.examInfo.start_time)
? (() => {
this.$router.push({
name: 'examTime'
})
})()
: (() => {
this.$router.push({
name: 'examAnswer'
})
})()
},
disagree() {
this.$router.push({
path: `/login/${this.examInfo.exam_id}`
})
},
// 判断进入考试页面还是倒计时页面
isExamStatus(date) {
const startDate = new Date(date).getTime()
const timestamp = Date.parse(new Date())
console.log(startDate - timestamp)
// new Date(curTime.setMinutes(curTime.getMinutes() + 10))
return !!(startDate > timestamp)
},
// 选择男女
selectGender(t) {
this.form.gender = t
},
// 默认信息获取
defaultInto() {
const key = Object.keys(this.form)
key.map(item => {
this.form[item] = this.sInfo.info[item]
})
},
// 确认信息
confirmInfo() {
const val = Object.values(this.form)
if (this.verification(val)) {
action.Login.confirmInfo(this.form).then(res => {
if (!res.code) {
this.isTreaty = true
}
}).catch(err => {
this.$alert(err.message, {
callback: action => {}
})
})
}
},
verification(val) {
for (let i = 0; i < val.length; i++) {
if (val[i] === '' || val[i] === 0 || val[i] === '0') {
this.$alert('请完善信息')
return false
}
}
return true
}
} }
} }
</script> </script>
...@@ -125,6 +204,11 @@ export default { ...@@ -125,6 +204,11 @@ export default {
&:nth-child(2){ &:nth-child(2){
margin-left: auto; margin-left: auto;
} }
&.active{
background: #C01540;
color: #fff;
border: none;
}
} }
} }
} }
......
src/pages/login/index.vue
浏览文件 @ d8488018
...@@ -2,47 +2,81 @@ ...@@ -2,47 +2,81 @@
<div class="login-box"> <div class="login-box">
<div class="content"> <div class="content">
<div class="mian-cont900"> <div class="mian-cont900">
<div class="title">全国统一高考试卷A</div> <div class="title">{{ data.name }}</div>
<div class="exam-time"> <div class="exam-time">
<div class="tit">考试时间</div> <div class="tit">考试时间</div>
<div class="line"></div> <div class="line"></div>
<div class="time"> <div class="time">
2020/06/09 8:24 - 2020/06/09 17:30 {{ data.start_time }} - {{ data.end_time }}
</div> </div>
</div> </div>
<div class="mian-form"> <div class="mian-form">
<!-- <div class="form prohibit"> --> <!-- <div class="form prohibit"> -->
<div class="form"> <div class="form">
<div class="tips" v-show="false">您登录的次数已超过最大限制</div> <div class="tips" v-show="false">您登录的次数已超过最大限制</div>
<input type="text" placeholder="请输入准考证号"> <input type="text" @click="fullScreen" v-model="examineeNumber" placeholder="请输入准考证号">
<!-- <input type="text" placeholder="请输入准考证号" readonly="readonly" class="prohibit"> --> <!-- <input type="text" placeholder="请输入准考证号" readonly="readonly" class="prohibit"> -->
<div class="btn">登录</div> <div class="btn" @click="login">登录</div>
<!-- <div class="btn prohibit">登录</div> --> <!-- <div class="btn prohibit">登录</div> -->
<div class="time-tips" v-show="false">距离开考还有：3:23:04</div> <div class="time-tips" v-show="false">距离开考还有：3:23:04</div>
</div> </div>
</div> </div>
<my-dia :title="title" :prompt="prompt"> </div>
<!-- <template v-slot:title>提示</template> --> </div>
<template v-slot:prompt></template> <!-- <my-dia :title="title" :prompt="prompt" :isPopup="isPopup" v-if="isPopup">
<template v-slot:button> <template v-slot:button>
<button>我知道了</button> <button>我知道了</button>
<button>好的</button> <button>好的</button>
</template> </template>
</my-dia> </my-dia> -->
</div>
</div>
</div> </div>
</template> </template>
<script> <script>
import DialogComponent from '../../components/exam/dialogComponent.vue' import action from '@action'
// import DialogComponent from '../../components/exam/dialogComponent.vue'
export default { export default {
components: { components: {
'my-dia': DialogComponent // 'my-dia': DialogComponent
}, },
data() { data() {
return { return {
title: '提示', title: '提示',
prompt: '从哪女快递费也琴女是儿是而发大V是阿女大是安抚大V vavgrrad' prompt: '从哪女快递费也琴女是儿是而发大V是阿女大是安抚大V vavgrrad',
data: '',
examineeNumber: '',
isPopup: true
}
},
mounted() {
action.Login.getExamInfo(this.$route.params.examId).then(res => {
// this.$store.commit('setExamInfo', res)
window.sessionStorage.setItem('examInfo', JSON.stringify(res))
this.data = res
console.log(this.$store.state)
}).finally(res => {
})
},
methods: {
fullScreen() {
const el = document.documentElement
const rfs = el.requestFullScreen || el.webkitRequestFullScreen || el.mozRequestFullScreen || el.msRequestFullscreen
if (typeof rfs !== 'undefined' && rfs) {
rfs.call(el)
}
return false
},
login() {
action.Login.userLogin({ examinee_number: this.examineeNumber }).then(res => {
// this.$store.commit('setStudentInfo', res)
window.sessionStorage.setItem('studentInfo', JSON.stringify(res))
this.$router.push({
name: 'confirmInfo'
})
}).catch(err => {
this.$alert(err.message, {
callback: action => {}
})
})
} }
} }
} }
......
src/router/routes.js
浏览文件 @ d8488018
export default [ export default [
{ path: '/', redirect: '/login' }, { path: '/', redirect: '/login/1' },
/* 测试页面 */ /* 测试页面 */
{ path: '/test', name: 'test', component: () => import('../pages/test.vue') }, { path: '/test', name: 'test', component: () => import('../pages/test.vue') },
/* 登录页面 */ /* 登录页面 */
{ path: '/login', name: 'login', component: () => import('../pages/login/index.vue') }, { path: '/login/:examId', component: () => import('../pages/login/index.vue') },
/* 确认信息 */ /* 确认信息 */
{ path: '/confirmInfo', name: 'confirmInfo', component: () => import('../pages/login/confirmInfo.vue') }, { path: '/confirmInfo', name: 'confirmInfo', component: () => import('../pages/login/confirmInfo.vue') },
/* 考试倒计时 */ /* 考试倒计时 */
......
src/store/index.js 0 → 100644
浏览文件 @ d8488018
import Vue from 'vue'
import Vuex from 'vuex'
Vue.use(Vuex)
export default new Vuex.Store({
state: {
examInfo: {},
studentInfo: {}
},
mutations: {
setExamInfo(state, info) {
state.examInfo = info
},
setStudentInfo(state, info) {
state.studentInfo = info
}
}
})
Markdown 格式
0% 或
您添加了 0 人 到此讨论。请谨慎行事。
请先完成此评论的编辑！
请 注册 或者 后发表评论