Skip to content

L
learn-online-pc
提交 bb1317b0 authored 作者: zyx's avatar zyx
浏览文件
操作

update

上级 9baa4785
隐藏空白字符变更
内嵌 并排
正在显示 包含 870 行增加 和 0 行删除
client/src/pages/survey/index.css 0 → 100644
浏览文件 @ bb1317b0
/* 提交表单样式 */
.radio-group, .checkbox-group { float: left; width: 100%; }
.radio-group .radio, .checkbox-group .checkbox { display: block; margin-left: 0; font-size: 20px; line-height: 2; }
.radio-group .radio .el-radio__label, .checkbox-group .checkbox .el-checkbox__label { font-size: 20px; font-weight: 400; color: #313131; }
.radio-group .radio.is-checked .el-radio__label, .checkbox-group .checkbox.is-checked .el-checkbox__label { color: #a98c58; }
.radio-group .radio .el-radio__input { float: left; margin: 10px 0 0 5px; vertical-align: text-top; }
.radio-group .radio .el-radio__input .el-radio__inner { width: 20px; height: 20px; border-color: #313131; }
.radio-group .radio .el-radio__input.is-checked .el-radio__inner { background: transparent; border-color: #a98c58; }
.radio-group .radio .el-radio__input.is-checked .el-radio__inner::after { width: 9px; height: 9px; background: #a98c58; }
.checkbox-group .checkbox .el-checkbox__input { float: left; margin: 10px 0 0 5px; vertical-align: text-top; }
.checkbox-group .checkbox .el-checkbox__input .el-checkbox__inner { width: 20px; height: 20px; border-color: #313131; }
.checkbox-group .checkbox .el-checkbox__input.is-checked .el-checkbox__inner { background: transparent; border-color: #a98c58; }
.checkbox-group .checkbox .el-checkbox__input.is-checked .el-checkbox__inner::after { top: 2px; left: 5px; border-width: 2px; width: 5px; height: 9px; border-color: #a98c58; }
client/src/pages/survey/store/data.js 0 → 100644
浏览文件 @ bb1317b0
/**
* 格式 id 介绍
* 第一个 数字 表示第几题
* 第二个 数字 表示 PC 第几页
* 第三个 数字 表示 phone 第几页
* 后面可连续 追加
*/
const question = [{
id: '1-1-1',
type: 3, // 判别是 单选还是多选，评级
title: '教学评价：',
arr: [
{ id: '1-1-1-1', option: '教师授课语言的准确度、精练和生动性', star: 0 },
{ id: '2-1-1-1', option: '教师授课思路的清晰和连贯性', star: 0 },
{ id: '3-1-1-1', option: '老师准备的教学工具是否到位', star: 0 },
{ id: '4-1-1-1', option: '老师的专业知识和能力', star: 0 },
{ id: '5-1-1-1', option: '对老师教学的整体评价', star: 0 }
]
}, {
id: '2-1-2',
type: 3, // 判别是 单选还是多选，评级
title: '课程内容评价：',
arr: [
{ id: '1-2-1-2', option: '学到了有用的概念或工具', star: 0 },
{ id: '2-2-1-2', option: '内容逻辑清晰，重点突出', star: 0 },
{ id: '3-2-1-2', option: '课程安排的教学进度', star: 0 },
{ id: '4-2-1-2', option: '能够提升理论高度/拓展思维', star: 0 },
{ id: '5-2-1-2', option: '对课程的整体评价', star: 0 }
]
}, {
id: '3-1-3',
type: 3, // 判别是 单选还是多选，评级
title: '教务评价：',
arr: [
{ id: '1-3-1-3', option: '班主任老师的带班能力（对班级的管理、对学生学习的督促以及解决学生问题的能力等）', star: 0 },
{ id: '2-3-1-3', option: '班主任老师的专业度（对课程的了解、对学生的了解和解答问题的专业性）', star: 0 },
{ id: '3-3-1-3', option: '班主任老师的总体满意度', star: 0 }
]
}, {
id: '4-1-4',
type: 4, // 判别是 单选还是多选，评级
title: '对于本次课程，您的收获是什么？',
arr: [],
area: ''
}, {
id: '5-1-5',
type: 4, // 判别是 单选还是多选，评级
title: '对于本次课程，您对老师的教学有什么好的建议？',
arr: [],
area: ''
}, {
id: '6-1-6',
type: 4, // 判别是 单选还是多选，评级
title: '对于本次课程，您对课程安排有什么好的建议？',
arr: [],
area: ''
}, {
id: '7-1-7',
type: 4, // 判别是 单选还是多选，评级
title: '对于本次课程，您对教务管理、班级管理方面有什么建议？',
arr: [],
area: '',
submit: true
}]
export default {
question
}
client/src/pages/survey/survey.vue 0 → 100644
浏览文件 @ bb1317b0
<template>
<div class="survey-container">
<div class="header">
<div class="title">索菲亚MBA课程教学服务评估表</div>
<div class="sub-title">您好！为保证我们能够为您提供更优质的课程，提高教学质量及服务，请您对此次课程提出宝贵的意见和建议。感谢您对我们工作的支持！（请您选择星级，选中1颗星为1分，最高5颗星）。请用1（低）到5（高）为每一项打分，并加上任何您想写的评论。</div>
<!-- <img src="./logo-header.jpg" alt=""> -->
<div class="sub-left">课程名称：{{headerInfo.title}}
<!-- <div class="sub-right">授课人：{{}}</div> -->
</div>
</div>
<div class="progress">
<div class="cur-progress" :style="{ width: progress}"></div>
</div>
<div class="exam-box">
<template v-for='(item, index) in exam.group'>
<template v-if='item.type === 1'>
<div v-bind:key="index" class='q-group' @click="radioClick" :data-index='index'>
<div class='q-item'>{{item.title}}</div>
<el-radio-group class='radio-group' @change='radioChange' v-model="item.sel">
<template v-for='(item1, index1) in item.arr'>
<!-- checked='{{item1.selected}}' -->
<el-radio v-bind:key="index1" :label='index1' :disabled='!!item.cur' :class='["radio"]'>{{item1.option}}</el-radio>
<template v-if="item1.txt !== undefined && item1.selected">
<el-input v-bind:key="item1.id" v-model="item1.txt" placeholder="请说明"></el-input>
</template>
</template>
</el-radio-group>
</div>
</template>
<template v-if='item.type === 2'>
<div v-bind:key="index" class='q-group' @click="checkboxClick" :data-index='index'>
<div class='q-item'>{{item.title}}</div>
<el-checkbox-group class='checkbox-group' @change='checkboxChange' v-model="item.arrSel">
<template v-for='(item1, index1) in item.arr'>
<!-- value='{{index1}}' -->
<el-checkbox v-bind:key="item1.id" :label='index1' :disabled='!!item.cur' :class='["checkbox"]'>{{item1.option}}</el-checkbox>
<template v-if="item1.txt !== undefined && item1.selected">
<el-input v-bind:key="index1" v-model="item1.txt" placeholder="请说明"></el-input>
</template>
</template>
</el-checkbox-group>
</div>
</template>
<template v-if="item.type === 3 || item.type === 4">
<div v-bind:key="index" class='q-group'>
<div class='q-item'>{{item.title}}</div>
<template v-for='(item1, index1) in item.arr'>
<div v-bind:key="item1.id" class="star-item">
<div class="left-txt">{{item1.option}}</div>
<template v-if="item1.star !== undefined">
<div class="right-stars">
<i :class="['icon', (item1.star >= 1 ? 'el-icon-self-star_full' : 'el-icon-self-wujiaoxing')]" @click="setStar(index, 1, index1)" @mouseenter="hoverStar(index, 1, index1)"></i>
<i :class="['icon', (item1.star >= 2 ? 'el-icon-self-star_full' : 'el-icon-self-wujiaoxing')]" @click="setStar(index, 2, index1)" @mouseenter="hoverStar(index, 2, index1)"></i>
<i :class="['icon', (item1.star >= 3 ? 'el-icon-self-star_full' : 'el-icon-self-wujiaoxing')]" @click="setStar(index, 3, index1)" @mouseenter="hoverStar(index, 3, index1)"></i>
<i :class="['icon', (item1.star >= 4 ? 'el-icon-self-star_full' : 'el-icon-self-wujiaoxing')]" @click="setStar(index, 4, index1)" @mouseenter="hoverStar(index, 4, index1)"></i>
<i :class="['icon', (item1.star === 5 ? 'el-icon-self-star_full' : 'el-icon-self-wujiaoxing')]" @click="setStar(index, 5, index1)" @mouseenter="hoverStar(index, 5, index1)"></i>
</div>
</template>
</div>
</template>
<div style="width: 100%; height: 20px;"></div>
<template v-if='item.area !== undefined'>
<el-input
type="textarea"
:rows="4"
placeholder="还有哪些需要改进的方面"
v-model="item.area" @blur="leaveSave">
</el-input>
</template>
</div>
</template>
</template>
<div class="bottom">如果您在紫荆MBA学位课程的收获比较大，我们会非常感谢您帮助我们推荐和您一样优秀的学员加入到MBA的大家庭，具体请联系您所在班的班主任。</div>
<div :class="['btn', this.curPage > 1 ? '' : 'none']" @click="prevPage">上一页</div>
<template v-if="lastPage">
<div class="btn" @click="goSubmit">提交</div>
</template>
<template v-else>
<div class="btn" @click="nextPage">下一页</div>
</template>
</div>
</div>
</template>
<script>
import qData from './store/data'
import cAction from '@actions'
import Base64 from 'Base64'
import _ from 'lodash'
export default {
props: {
sid: { type: String, require: false },
cid: { type: String, require: false }
},
data () {
let _headerInfo = JSON.parse(window.localStorage.getItem('headerInfo') || '{}')
return {
dataQuestion: _.cloneDeep(qData.question),
headerInfo: _headerInfo,
exam: {
id: '',
semester_id: '',
title: '',
score: '',
work_contents: '',
group: []
},
// 提交时，传入的参数值
param: {
semester_id: '',
course_id: '',
raw: '' // base64
},
count: 0,
/* 进入页面记录初试时间 */
startTime: '',
setTime: null,
/* 当前 radio点击 */
radioCur: '',
/* 当前 checkbox点击 */
checkCur: '',
/* 记录当前页 */
curPage: 1,
/* 记录 区分选择项 */
selectId: '',
/* 记录页数进度 */
progress: '',
/* 总共题目数 */
total: 7,
/* 最后一页 */
lastPage: false
}
},
mounted () {
/* 读取本地缓存 */
let quesLocal = window.localStorage.getItem('quesLocal' + this.sid + this.cid)
let quesPage = window.localStorage.getItem('quesPage' + this.sid + this.cid)
let quesSelectId = window.localStorage.getItem('quesSelectId' + this.sid + this.cid)
if (quesLocal) {
qData.question = JSON.parse(quesLocal)
this.curPage = quesPage
this.selectId = quesSelectId
}
this.loadQuestion()
},
destroyed () {
qData.question = this.dataQuestion
},
methods: {
/* 提交数据 */
goSubmit () {
for (let i = 0; i < qData.question.length; i++) {
let _item = qData.question[i]
if (_item.type === 3) {
for (let j = 0; j < _item.arr.length; j++) {
if (_item.arr[j].star === 0) {
this.$message.error('尚有内容未填写，请填写完整每一项')
return
}
}
}
if (_item.type === 4) {
if (_item.area === '') {
this.$message.error('尚有内容未填写，请填写完整每一项')
return
}
}
}
const loading = this.$loading({ lock: true, text: '', spinner: '', background: 'rgba(255, 255, 255, 0.9)' })
cAction.chapterAction.updateSurveyAnswer({
semester_id: this.sid,
course_id: this.cid,
raw: Base64.encode(JSON.stringify(qData.question))
}).then(res => {
let a = 1
if (a) {
this.$message.success('感谢你的宝贵意见。')
/* 答题成功，清空本地缓存 */
window.localStorage.removeItem('quesLocal' + this.sid + this.cid)
window.localStorage.removeItem('quesPage' + this.sid + this.cid)
window.localStorage.removeItem('quesSelectId' + this.sid + this.cid)
loading.close()
setTimeout(() => {
this.$router.push({ path: `/app/my-learn/course-detail/${this.sid}/${this.cid}` })
}, 2000)
}
}).catch(e => {
/* 答题 记录计入本地缓存 */
window.localStorage.setItem('quesLocal' + this.sid + this.cid, JSON.stringify(qData.question))
window.localStorage.setItem('quesPage' + this.sid + this.cid, this.curPage)
window.localStorage.setItem('quesSelectId' + this.sid + this.cid, this.selectId)
this.$message.error('提交失败，请稍后刷新重试')
loading.close()
})
},
/* 按照id编号规则 放入 exam.group中 */
loadQuestion () {
this.exam.group = []
for (let i = 0; i < qData.question.length; i++) {
let exp = new RegExp('^\\d+-' + this.curPage, 'gi')
if (exp.test(qData.question[i].id)) {
this.exam.group.push(qData.question[i])
if (qData.question[i].submit) {
this.lastPage = true
} else {
this.lastPage = false
}
}
}
this.progress = ((this.curPage - 1) / this.total * 100) + '%'
},
/* 点击下一页 */
nextPage () {
for (let i = 0; i < this.exam.group.length; i++) {
if (!this.exam.group[i].flag) {
this.$message.error('本页尚有题目未填写')
return
}
}
this.curPage++
this.loadQuestion()
/* 答题 记录计入本地缓存 */
window.localStorage.setItem('quesLocal' + this.sid + this.cid, JSON.stringify(qData.question))
window.localStorage.setItem('quesPage' + this.sid + this.cid, this.curPage)
window.localStorage.setItem('quesSelectId' + this.sid + this.cid, this.selectId)
},
/* 点击上一页 */
prevPage () {
this.curPage--
this.loadQuestion()
},
/**
* 辅助 radio选择
*/
radioClick (e) {
this.radioCur = e.currentTarget.dataset.index
},
/**
* radio选择
* PC端 值会 返回 选择的 值
*/
radioChange (val) {
let i = this.radioCur
let arr = this.exam.group[i].arr
let value = val
for (let j = 0; j < arr.length; j++) {
arr[j]['selected'] = 0
}
arr[value].selected = 1
/* 记录 题目是否 已经选过 */
this.exam.group[i].flag = true
},
/**
* 辅助 checkbox选择
*/
checkboxClick (e) {
this.checkboxCur = e.currentTarget.dataset.index
},
/**
* checkbox选择
*/
checkboxChange (val) {
let i = this.checkboxCur
let arr = this.exam.group[i].arr
let value = val
for (let j = 0; j < arr.length; j++) {
arr[j]['selected'] = 0
}
for (let j = 0; j < value.length; j++) {
arr[value[j]].selected = 1
}
/* 记录 题目是否 已经选过 */
if (!value.length) {
this.exam.group[i].flag = false
} else {
this.exam.group[i].flag = true
}
},
/* hover选中星星 */
hoverStar (index, len, i) {
},
/* 点击选中星星 */
setStar (index, len, i) {
this.exam.group[index].arr[i].star = len
/* 答题 记录计入本地缓存 */
window.localStorage.setItem('quesLocal' + this.sid + this.cid, JSON.stringify(qData.question))
window.localStorage.setItem('quesPage' + this.sid + this.cid, this.curPage)
window.localStorage.setItem('quesSelectId' + this.sid + this.cid, this.selectId)
},
/* 内容离开保存 */
leaveSave () {
/* 答题 记录计入本地缓存 */
window.localStorage.setItem('quesLocal' + this.sid + this.cid, JSON.stringify(qData.question))
window.localStorage.setItem('quesPage' + this.sid + this.cid, this.curPage)
window.localStorage.setItem('quesSelectId' + this.sid + this.cid, this.selectId)
}
}
}
</script>
<style lang="scss" scoped>
@import './index.css';
.survey-container {
display: block;
max-width: 900px;
margin: 0 auto;
.bottom {
float: left;
margin-top: 20px;
font-size: 20px;
text-align: justify;
}
.header {
padding: 20px;
background: #ffffff;
.title {
font-size: 30px;
text-align: center;
margin-bottom: 10px;
}
.sub-title {
padding: 0 30px;
text-indent: 40px;
font-size: 16px;
text-align: justify;
margin-bottom: 20px;
}
.sub-left {
font-size: 20px;
padding-left: 30px;
.sub-right {
float: right;
}
}
width: 100%;
img {
display: block;
width: 100%;
}
}
.progress {
width: 100%;
height: 6px;
background: #b5b5b5;
.cur-progress {
display: block;
height: 100%;
background: #ebbb14;
}
}
.exam-box {
padding: 55px 8.7% 100px 8.7%;
background: #ffffff;
overflow: hidden;
/* 选择样式 */
.q-group {
padding: 20px 0 10px 0;
font-size: 20px;
color: #313131;
border-bottom: 1px dashed #dcdcdc;
overflow: hidden;
.q-item {
display: block;
font-weight: 700;
margin-bottom: 10px;
}
.star-item {
line-height: 2;
overflow: hidden;
.left-txt {
float: left;
width: 70%;
}
.right-stars {
float: right;
.icon {
font-size: 24px;
cursor: pointer;
&.el-icon-self-star_full {
color: #a98c58;
}
}
}
}
}
.q-group:last-child {
border-bottom: none;
}
.btn {
float: left;
width: 150px;
height: 42px;
margin-top: 50px;
margin-right: 25px;
text-align: center;
font-size: 18px;
line-height: 42px;
color: #eedfb1;
background: #b01b3c;
border-radius: 6px;
cursor: pointer;
&.none {
display: none;
}
}
}
}
</style>
client/src/pages/survey/surveyPhone.vue 0 → 100644
浏览文件 @ bb1317b0
<template>
<div class="survey-container">
<div class="header">
<!-- <img src="./logo-header-phone.jpg" alt=""> -->
{{headerInfo.title}}（课程评估）
</div>
<div class="progress">
<div class="cur-progress" :style="{ width: progress}"></div>
</div>
<div class="exam-box">
<template v-for='(item, index) in exam.group'>
<template v-if='item.type === 1'>
<div v-bind:key="index" class='q-group' @click="radioClick" :data-index='index'>
<div class='q-item'>{{item.title}}</div>
<el-radio-group class='radio-group' @change='radioChange' v-model="item.sel">
<template v-for='(item1, index1) in item.arr'>
<!-- checked='{{item1.selected}}' -->
<el-radio v-bind:key="index1" :label='index1' :disabled='!!item.cur' :class='["radio"]'>{{item1.option}}</el-radio>
<template v-if="item1.txt !== undefined && item1.selected">
<el-input v-bind:key="item1.id" v-model="item1.txt" placeholder="请说明"></el-input>
</template>
</template>
</el-radio-group>
</div>
</template>
<template v-if='item.type === 2'>
<div v-bind:key="index" class='q-group' @click="checkboxClick" :data-index='index'>
<div class='q-item'>{{item.title}}</div>
<el-checkbox-group class='checkbox-group' @change='checkboxChange' v-model="item.arrSel">
<template v-for='(item1, index1) in item.arr'>
<!-- value='{{index1}}' -->
<el-checkbox v-bind:key="item1.id" :label='index1' :disabled='!!item.cur' :class='["checkbox"]'>{{item1.option}}</el-checkbox>
<template v-if="item1.txt !== undefined && item1.selected">
<el-input v-bind:key="index1" v-model="item1.txt" placeholder="请说明"></el-input>
</template>
</template>
</el-checkbox-group>
</div>
</template>
<template v-if="item.type === 3">
<div v-bind:key="index" class='q-group'>
<div class='q-item'>{{item.title}}</div>
<template v-for='(item1, index1) in item.arr'>
<div v-bind:key="item1.id" class="star-item">
<div class="left-txt">{{item1.option}}</div>
<template v-if="item1.star !== undefined">
<div class="right-stars">
<i :class="['icon', (item1.star >= 1 ? 'el-icon-self-star_full' : 'el-icon-self-wujiaoxing')]" @click="setStar(1, index1)" @mouseenter="hoverStar(1, index1)"></i>
<i :class="['icon', (item1.star >= 2 ? 'el-icon-self-star_full' : 'el-icon-self-wujiaoxing')]" @click="setStar(2, index1)" @mouseenter="hoverStar(2, index1)"></i>
<i :class="['icon', (item1.star >= 3 ? 'el-icon-self-star_full' : 'el-icon-self-wujiaoxing')]" @click="setStar(3, index1)" @mouseenter="hoverStar(3, index1)"></i>
<i :class="['icon', (item1.star >= 4 ? 'el-icon-self-star_full' : 'el-icon-self-wujiaoxing')]" @click="setStar(4, index1)" @mouseenter="hoverStar(4, index1)"></i>
<i :class="['icon', (item1.star === 5 ? 'el-icon-self-star_full' : 'el-icon-self-wujiaoxing')]" @click="setStar(5, index1)" @mouseenter="hoverStar(5, index1)"></i>
</div>
</template>
</div>
</template>
<div style="width: 100%; height: 20px;"></div>
<el-input
type="textarea"
:rows="4"
placeholder="还有哪些需要改进的方面"
v-model="item.textarea">
</el-input>
</div>
</template>
</template>
<div class="btns-fix">
<div :class="['btn', this.curPage > 1 ? 'two c-btn' : 'none']" @click="prevPage">上一页</div>
<template v-if="lastPage">
<div :class="['btn', this.lastPage ? 'two' : '']" @click="goSubmit">提交</div>
</template>
<template v-else>
<div :class="['btn', this.curPage > 1 ? 'two' : '']" @click="nextPage">下一页</div>
</template>
</div>
</div>
</div>
</template>
<script>
import qData from './store/data'
import cAction from '@actions'
import Base64 from 'Base64'
import _ from 'lodash'
export default {
props: {
sid: { type: String, require: false },
cid: { type: String, require: false }
},
data () {
let _headerInfo = JSON.parse(window.localStorage.getItem('headerInfo') || '{}')
return {
dataQuestion: _.assignIn({}, qData.question),
headerInfo: _headerInfo,
exam: {
id: '',
semester_id: '',
title: '',
score: '',
work_contents: '',
group: []
},
// 提交时，传入的参数值
param: {
semester_id: '',
course_id: '',
raw: '' // base64
},
count: 0,
/* 进入页面记录初试时间 */
startTime: '',
setTime: null,
/* 当前 radio点击 */
radioCur: '',
/* 当前 checkbox点击 */
checkCur: '',
/* 记录当前页 */
curPage: 1,
/* 记录 区分选择项 */
selectId: '',
/* 记录页数进度 */
progress: '',
/* 总共题目数 */
total: 7,
/* 最后一页 */
lastPage: false
}
},
mounted () {
/* 读取本地缓存 */
let quesLocal = window.localStorage.getItem('quesLocal' + this.sid + this.cid)
let quesPage = window.localStorage.getItem('quesPage' + this.sid + this.cid)
let quesSelectId = window.localStorage.getItem('quesSelectId' + this.sid + this.cid)
if (quesLocal) {
qData.question = JSON.parse(quesLocal)
this.curPage = quesPage
this.selectId = quesSelectId
}
this.loadQuestion()
},
destroyed () {
qData.question = this.dataQuestion
},
methods: {
/* 提交数据 */
goSubmit () {
const loading = this.$loading({ lock: true, text: '', spinner: '', background: 'rgba(255, 255, 255, 0.9)' })
cAction.chapterAction.updateSurveyAnswer({
semester_id: this.sid,
course_id: this.cid,
raw: Base64.encode(JSON.stringify(qData.question))
}).then(res => {
if (res.id) {
this.$router.push({ path: `/result/${this.iphone}/${encodeURIComponent(this.email)}/${res.id}` })
}
/* 答题成功，清空本地缓存 */
window.localStorage.removeItem('quesLocal' + this.sid + this.cid)
window.localStorage.removeItem('quesPage' + this.sid + this.cid)
window.localStorage.removeItem('quesSelectId' + this.sid + this.cid)
loading.close()
}).catch(e => {
/* 答题 记录计入本地缓存 */
window.localStorage.setItem('quesLocal' + this.sid + this.cid, JSON.stringify(qData.question))
window.localStorage.setItem('quesPage' + this.sid + this.cid, this.curPage)
window.localStorage.setItem('quesSelectId' + this.sid + this.cid, this.selectId)
this.$message.error('提交失败，请稍后刷新重试')
loading.close()
})
},
/* 按照id编号规则 放入 exam.group中 */
loadQuestion () {
this.exam.group = []
for (let i = 0; i < qData.question.length; i++) {
let exp = new RegExp('$\\d+-' + this.curPage, 'gi')
if (exp.test(qData.question[i].id)) {
this.exam.group.push(qData.question[i])
if (qData.question[i].submit) {
this.lastPage = true
} else {
this.lastPage = false
}
}
}
this.progress = ((this.curPage - 1) / this.total * 100) + '%'
},
/* 点击下一页 */
nextPage () {
for (let i = 0; i < this.exam.group.length; i++) {
if (!this.exam.group[i].flag) {
this.$message.error('本页尚有题目未填写')
return
}
}
/* 做区分，需要特殊判断 */
if (this.curPage === 4) {
if (this.exam.group[0].arr[3].selected) {
this.selectId = '4-4'
} else {
this.selectId = '4-1'
}
}
this.curPage++
this.loadQuestion()
/* 答题 记录计入本地缓存 */
window.localStorage.setItem('quesLocal' + this.sid + this.cid, JSON.stringify(qData.question))
window.localStorage.setItem('quesPage' + this.sid + this.cid, this.curPage)
window.localStorage.setItem('quesSelectId' + this.sid + this.cid, this.selectId)
},
/* 点击上一页 */
prevPage () {
this.curPage--
if (this.curPage <= 4) {
this.selectId = ''
}
this.loadQuestion()
},
/**
* 辅助 radio选择
*/
radioClick (e) {
this.radioCur = e.currentTarget.dataset.index
},
/**
* radio选择
* PC端 值会 返回 选择的 值
*/
radioChange (val) {
let i = this.radioCur
let arr = this.exam.group[i].arr
let value = val
for (let j = 0; j < arr.length; j++) {
arr[j]['selected'] = 0
}
arr[value].selected = 1
/* 记录 题目是否 已经选过 */
this.exam.group[i].flag = true
},
/**
* 辅助 checkbox选择
*/
checkboxClick (e) {
this.checkboxCur = e.currentTarget.dataset.index
},
/**
* checkbox选择
*/
checkboxChange (val) {
let i = this.checkboxCur
let arr = this.exam.group[i].arr
let value = val
for (let j = 0; j < arr.length; j++) {
arr[j]['selected'] = 0
}
for (let j = 0; j < value.length; j++) {
arr[value[j]].selected = 1
}
/* 记录 题目是否 已经选过 */
if (!value.length) {
this.exam.group[i].flag = false
} else {
this.exam.group[i].flag = true
}
},
/* hover选中星星 */
hoverStar (len, i) {
},
/* 点击选中星星 */
setStar (len, i) {
this.exam.group[0].arr[i].star = len
}
}
}
</script>
<style lang="scss" scoped>
@import './index.css';
.survey-container {
display: block;
max-width: 640px;
height: 100%;
margin: 0 auto;
background: #ffffff;
.header {
font-size: 20px;
text-align: center;
padding: 20px;
background: #ffffff;
width: 100%;
img {
display: block;
width: 100%;
}
}
.progress {
width: 100%;
height: 6px;
background: #b5b5b5;
.cur-progress {
display: block;
height: 100%;
background: #ebbb14;
}
}
.exam-box {
position: relative;
padding: 20px 20px 70px 20px;
background: #ffffff;
overflow: hidden;
/* 选择样式 */
.q-group {
padding: 0;
font-size: 20px;
color: #313131;
overflow: hidden;
.q-item {
display: block;
font-weight: 700;
margin-bottom: 10px;
}
.star-item {
line-height: 2;
overflow: hidden;
.left-txt {
float: left;
width: 58%;
font-size: 18px;
line-height: 40px;
}
.right-stars {
float: right;
.icon {
font-size: 18px;
cursor: pointer;
&.el-icon-self-star_full {
color: #a98c58;
}
}
}
}
}
.q-group:last-child {
border-bottom: none;
}
.btns-fix {
position: fixed;
left: 0;
bottom: 0;
width: 100%;
.btn {
float: left;
width: 100%;
height: 50px;
text-align: center;
font-size: 18px;
line-height: 50px;
color: #eedfb1;
background: #b01b3c;
cursor: pointer;
&.none {
display: none;
}
&.two {
width: 50%;
}
&.c-btn {
background: #b5b5b5;
color: #ffffff;
}
}
}
}
}
</style>
Markdown 格式
0% 或
您添加了 0 人 到此讨论。请谨慎行事。
请先完成此评论的编辑！
请 注册 或者 后发表评论