Skip to content

X
x-learn
提交 cfbe9bd0 authored 作者: 王鹏飞's avatar 王鹏飞
浏览文件
操作

增加考试路由跳转

上级 33707f35
隐藏空白字符变更
内嵌 并排
正在显示 包含 17 行增加 和 3130 行删除
.config.dev.js
浏览文件 @ cfbe9bd0
module.exports = { module.exports = {
domain: 'dev.ezijing.com', domain: 'dev.ezijing.com',
url: 'https://transport2.ezijing.com/api', url: 'https://transport.ezijing.com/api',
webpack: { webpack: {
externals: { externals: {
CKEDITOR: 'window.CKEDITOR', CKEDITOR: 'window.CKEDITOR',
......
src/pages/course/learn/tag.vue
浏览文件 @ cfbe9bd0
...@@ -56,8 +56,7 @@ export default { ...@@ -56,8 +56,7 @@ export default {
}, },
// 去知识点考试页面 // 去知识点考试页面
toExamPage() { toExamPage() {
const path = `/exam/courseNodeExam?tag_id=${this.detail.id}` this.$router.push({ path: '/course/exam/examSite', query: { tag_id: this.detail.id } })
this.$router.push({ path })
}, },
// 去课程视频页面 // 去课程视频页面
toCourseVideo() { toCourseVideo() {
......
src/pages/course/test/components/CourseChapter.vue
浏览文件 @ cfbe9bd0
...@@ -6,11 +6,15 @@ ...@@ -6,11 +6,15 @@
<li v-for="subItem in item.children" :key="subItem.id"> <li v-for="subItem in item.children" :key="subItem.id">
<div class="name">{{ subItem.name }}</div> <div class="name">{{ subItem.name }}</div>
<div class="buttons"> <div class="buttons">
<el-button round size="mini" v-if="subItem.status === '100'">测试</el-button> <el-button round size="mini" v-if="subItem.status === '100'" @click="toExamPage(subItem, 1)">
<el-button round size="mini" v-if="['0', '3'].includes(subItem.status)">继续测试</el-button> 测试
</el-button>
<el-button round size="mini" v-if="['0', '3'].includes(subItem.status)" @click="toExamPage(subItem, 2)">
继续测试
</el-button>
<template v-if="['1', '2'].includes(subItem.status)"> <template v-if="['1', '2'].includes(subItem.status)">
<el-button round size="mini">重新测试</el-button> <el-button round size="mini" @click="toExamPage(subItem, 1)">重新测试</el-button>
<el-button round size="mini">报告</el-button> <el-button round size="mini" @click="toExamPage(subItem, 3)">报告</el-button>
</template> </template>
</div> </div>
</li> </li>
...@@ -54,6 +58,12 @@ export default { ...@@ -54,6 +58,12 @@ export default {
.finally(() => { .finally(() => {
this.loaded = true this.loaded = true
}) })
},
toExamPage(data, type) {
this.$router.push({
path: '/course/exam/chapter',
query: { course_id: this.courseId, chapter_id: data.id, type }
})
} }
}, },
beforeMount() { beforeMount() {
......
src/pages/course/test/item.vue
浏览文件 @ cfbe9bd0
...@@ -57,7 +57,7 @@ export default { ...@@ -57,7 +57,7 @@ export default {
}) })
}, },
onTagClick(data) { onTagClick(data) {
console.log(data) this.$router.push({ path: '/course/exam/examSite', query: { tag_id: data.id } })
} }
}, },
beforeMount() { beforeMount() {
......
src/pages/my/test/answerCard.vue deleted 100644 → 0
浏览文件 @ 33707f35
<template>
<div class="card_box">
<div class="head" id="top-view2">
<i class="el-icon-arrow-left"></i>
</div>
<div id="bottom-view2">
<div class="card_con">
<div class="flag">
<ul>
<li>
<div class="circle active1"></div>
<div class="txt">正确</div>
</li>
<li>
<div class="circle active2"></div>
<div class="txt">错误</div>
</li>
<!-- <li>
<div class="circle active3"></div>
<div class="txt">未答</div>
</li> -->
</ul>
</div>
<div class="question">
<div class="tips" v-if="$route.query.type == 1">按答题时间排序，最新错题在前面</div>
<div class="tips" v-if="$route.query.type == 2">按答题时间排序，最新收藏题在前面</div>
<ul>
<template v-for="(item, index) in dataList">
<li @click="goQuestionDetail(item.question_id)" :class="item.answer == 1 ? 'active1' : item.answer == 2 ? 'active2' : 'active3'" :key="index">
<div class="circle">{{ index + 1 }}</div>
<div class="txt">{{ questionType[item.question_type] }}</div>
</li>
</template>
</ul>
<van-empty description="暂无内容" v-if="dataList.length == 0"/>
<div class="tips" v-if="$route.query.type == 3">未做试题剩余{{unDo}}题</div>
</div>
</div>
</div>
<div class="clear-btn" v-if="this.$route.query.type != 3">
<div class="btn" @click="clearQuestion">清空记录，重新答题</div>
</div>
<div class="exam_submit" v-if="isPopShow">
<div class="pop">
<div class="tit"></div>
<div class="txt">您确定要清空当前做题记录并重新开始吗？</div>
<div class="btn_box">
<div class="btn" @click="isPopShow = false">取消</div>
<div class="btn btn2" @click="clearQuestion">清空</div>
</div>
</div>
</div>
</div>
</template>
<script>
import { Toast } from 'vant'
import * as api from '@/api/my.js'
export default {
components: {
[Toast.name]: Toast
},
mounted() {
this.initData()
},
data() {
return {
unDo: 0,
questionType: {
1: '单选题',
2: '多选题',
5: '案例题',
6: '判断题'
},
dataList: [],
isPopShow: false
}
},
methods: {
clearQuestion() {
const param = {
type: this.$route.query.type,
question_type: this.$route.query.questionType,
clear: 1
}
api.cacheQuestion(param).then(res => {
Toast('清空成功')
window.localStorage.cachequestion = JSON.stringify([])
this.initData()
})
},
goQuestionDetail(id) {
const index = this.dataList.findIndex(item => { return item.question_id === id })
window.localStorage.myQuestionDetileId = id
this.$router.push({
name: 'questionsDetails',
query: {
type: this.$route.query.type,
questionType: this.$route.query.questionType,
page: parseInt(index / 30) + 1
}
})
},
initData() {
Toast.loading({
message: '加载中...',
duration: 5000,
loadingType: 'spinner'
})
api.getAllQuestion({ type: parseInt(this.$route.query.type) === 3 ? 0 : this.$route.query.type, question_type: this.$route.query.questionType })
.then(res => {
this.dataList = res.list
this.unDo = res.un_do
Toast.clear()
})
.catch(() => {
this.dataList = []
})
}
}
}
</script>
<style lang="scss" scoped>
.exam_submit{
position: fixed;
top: 0;
left: 0;
z-index: 999999;
width: 100%;
height: 100%;
background: rgba(0,0,0,0.6);
.pop{
width: 5.9rem;
position: absolute;
top: 50%;
left: 50%;
-webkit-transform: translate(-50%,-50%);
background:rgba(255,255,255,1);
border-radius:.12rem;
padding: 0.4rem 0;
.tit{
font-weight:bold;
color:rgba(34,34,34,1);
font-size:.3rem;
text-align: center;
line-height: 100%;
}
.txt{
color:rgba(34,34,34,1);
font-size:.3rem;
text-align: center;
line-height: 100%;
margin-top: .8rem;
}
.btn_box{
padding:0 0.2rem;
display: flex;
margin-top: .8rem;
.btn{
width:2.6rem;
height:.7rem;
background:#C62245;
border-radius:.12rem;
text-align: center;
line-height: .7rem;
color: #fff;
font-size: .3rem;
}
.btn2{
margin-left: auto;
}
}
}
}
.card_box{
width: 100%;
height: 100%;
background: #fff;
.card_con{
padding: 0 .4rem;
overflow-y: scroll;
.flag{
border-bottom: 0.01rem solid #EEEEEE;
ul{
list-style: none;
margin: 0;
padding: 0;
display: flex;
justify-content: center;
li{
margin: 0 .4rem 0.1rem .4rem;
text-align: center;
.circle{
width: .6rem;
height: .6rem;
border-radius: 50%;
font-size: .26rem;
text-align: center;
line-height: .6rem;
color: #fff;
}
.active1{
background: #67C23A;
}
.active2{
background:#FA5555;
}
.active3{
background:rgba(204,204,204,1);
}
.txt{
color: #222222;
font-size: .26rem;
margin-top: 0.1rem;
}
}
}
}
.question{
.tips{
margin-top: .4rem;
font-size: .26rem;
color:rgba(51,51,51,1);
margin-left: .6rem;
}
.title{
font-size: .3rem;
color: #333333;
margin-top: .1rem;
margin-bottom: .4rem;
}
ul{
list-style: none;
margin-top: .5rem;
padding: 0 0.6rem;
border-bottom: 0.01rem solid #EEEEEE;
display: flex;
flex-wrap: wrap;
li{
position: relative;
width: .6rem;
height: .6rem;
text-align: center;
margin-right: .6rem;
margin-bottom: .4rem;
padding-bottom: .38rem;
.circle{
width: .6rem;
height: .6rem;
border-radius: 50%;
font-size: .26rem;
line-height: .6rem;
color: #fff;
}
.txt{
position: absolute;
bottom: 0;
left: 50%;
-webkit-transform: translateX(-50%);
font-size: .2rem;
color: #333;
margin-top: .1rem;
line-height: 100%;
white-space:nowrap
}
}
:nth-child(5n+5){
margin: 0;
}
.active1{
.circle{
background: #67C23A;
}
}
.active2{
.circle{
background:#FA5555;
}
}
.active3{
.circle{
background:rgba(204,204,204,1);
}
}
}
}
}
}
.head{
color: #222;
display: flex;
padding: .4rem 0;
align-items: center;
i{
font-size: .35rem;
margin-left: .28rem;
}
.title{
margin-left: .03rem;
font-size: .3rem;
}
}
#bottom-view2{
overflow: scroll;
}
.card_box{
padding-bottom: .9rem;
}
.clear-btn{
position: fixed;
bottom: 0;
left: 0;
width:100%;
height:1rem;
background:rgba(255,255,255,1);
box-shadow:0rem 0rem .06rem 0rem rgba(0,0,0,0.05);
.btn{
width:6.7rem;
height:.7rem;
background:rgba(198,34,69,1);
border-radius:.12rem;
font-size:.3rem;
text-align: center;
line-height: .7rem;
color: #fff;
margin: .15rem auto;
}
}
</style>
src/pages/my/test/collectQuestions.vue deleted 100644 → 0
浏览文件 @ 33707f35
<template>
<div>
<div id="top-view">
<div class="exam-con">
<div class="sele" @click="screen.isShow = true">
<div class="title">选择题型</div>
<div class="txt">
<div class="t">{{ screen.checkedText }}</div>
<van-icon name="arrow" />
</div>
</div>
</div>
</div>
<div class="question-box" id="bottom-view">
<ul>
<template v-for="(item, index) in question.list">
<li :data-id="item.question_id" :key="index" @click="listClick(item.question_id)" ref="liDom">
<img src="../../assets/images/que-type1.png" alt="" v-if="item.question_type == '6'">
<img src="../../assets/images/que-type2.png" alt="" v-if="item.question_type == '5'">
<img src="../../assets/images/que-type3.png" alt="" v-if="item.question_type == '2'">
<img src="../../assets/images/que-type4.png" alt="" v-if="item.question_type == '1'">
<div class="text" v-html="item.question_content"></div>
<template v-if="!batchDel.selectShow">
<div class="del">
<div class="dels" @click.prevent.stop.stop="del(item.question_id, 1)"></div>
<!-- <div :class="item.is_collection ? 'collect active' : 'collect'" @click.prevent.stop.stop="collectQuestion(item.question_id)"></div> -->
</div>
</template>
<template v-else>
<div :class="batchDel.countData.find(id => { return id === item.question_id }) ? 'opt active' : 'opt'"></div>
</template>
</li>
</template>
</ul>
<van-empty description="暂无内容" v-if="question.list.length == 0"/>
<div class="loading" v-if="isLogding">
<div class="icon">
<van-loading color="#1989fa" />
</div>
</div>
</div>
<div class="sele-pop" v-if="screen.isShow">
<div class="picker">
<van-picker
show-toolbar
:columns="screen.columns"
@confirm="onConfirm"
@cancel="onCancel"
/>
</div>
</div>
<div class="btn-box" id="btn-box">
<template v-if="!batchDel.selectShow">
<div :class="question.list.length != 0 ? 'w-btn' : 'w-btn col2'" @click="batchToolShow">批量管理</div>
<div class="w-btn col" @touchmove.prevent="delBtn = false">删除</div>
</template>
<template v-else>
<div class="z-btn" @click="batchDel.selectShow = false">返回</div>
<div class="z-btn mar" @click="allSelect">{{ batchDel.isAllSelect ? '取消全选' : '全选' }}</div>
<div :class="!batchDel.isDelBtn ? 'z-btn col' : 'z-btn'" @click="!batchDel.isDelBtn ? batchDel.isPopShow = false : batchDel.isPopShow = true">删除</div>
</template>
</div>
<div class="exam_submit" v-if="batchDel.isPopShow">
<div class="pop">
<div class="tit"></div>
<div class="txt">确认删除</div>
<div class="btn_box">
<div class="btn" @click="batchDel.isPopShow = false">取消</div>
<div class="btn btn2" @click="batchDelClick">确定</div>
</div>
</div>
</div>
</div>
</template>
<script>
import * as api from '@/api/my.js'
import { Toast } from 'vant'
export default {
metaInfo: {
title: '收藏试题'
},
components: {
[Toast.name]: Toast
},
data() {
return {
delBtn: false,
batchDel: {
selectShow: false,
isDelBtn: false,
countData: [],
isAllSelect: false,
isPopShow: false
},
screen: {
isShow: false,
checkedText: '全部',
columns: ['全部', '单选题', '多选题', '判断题', '案例题'],
screenVal: '0'
},
question: {
list: []
},
activeClass: '0',
changeGroup: false,
isLogding: false,
params: {
type: 2,
page: 1,
page_size: 30
},
scrollFlag: false
}
},
methods: {
batchToolShow() {
this.question.list.length ? this.batchDel.selectShow = true : Toast('没有可操作项')
},
batchDelClick() {
this.batchDel.isDelBtn ? this.del(this.batchDel.countData) : Toast('请选择删除内容')
},
lookup(array, value) {
const arr = array.concat([])
arr.push(value)
arr.sort((a, b) => {
return a - b
})
const index = arr.indexOf(value)
if (index === 0) {
return arr[index + 1]
} else if (index === array.length - 1) {
return arr[index - 1]
}
const resultIndex =
arr[index] - arr[index - 1] > arr[index + 1] - arr[index]
? index + 1
: index - 1
return arr[resultIndex]
},
allSelect() {
const topView = document.getElementById('top-view')
const btnBox = document.getElementById('btn-box')
const scrollH = (document.documentElement.scrollTop || document.body.scrollTop) + document.documentElement.clientHeight
const clientDomH = scrollH - (this.computedStyle(topView, 'height') + this.computedStyle(btnBox, 'height'))
let countNum = 0
const cumulativeValue = []
const cumulativeObj = {}
this.$refs.liDom.map((item, index) => {
countNum += item.clientHeight
cumulativeObj[countNum] = item.getAttribute('data-id')
cumulativeValue.push(countNum)
})
this.scrollFlag = true
if (countNum < clientDomH) {
// 直接全选
if (this.batchDel.countData.length === this.question.list.length) {
this.batchDel.countData = []
this.batchDel.isDelBtn = false
this.batchDel.isAllSelect = false
} else {
this.batchDel.countData = []
this.question.list.map(item => {
this.batchDel.countData.push(item.question_id)
})
this.batchDel.isDelBtn = true
this.batchDel.isAllSelect = true
}
return false
}
if (this.batchDel.isAllSelect) {
this.batchDel.countData = []
this.batchDel.isDelBtn = false
} else {
const getId = cumulativeObj[this.lookup(cumulativeValue, clientDomH)]
const listItem = this.question.list
for (let i = 0; i < listItem.length; i++) {
if (listItem[i].question_id === getId) {
this.batchDel.countData.push(listItem[i].question_id)
break
} else {
this.batchDel.countData.push(listItem[i].question_id)
}
}
this.batchDel.isDelBtn = true
}
this.batchDel.isAllSelect = !this.batchDel.isAllSelect
},
computedStyle(dom, style) {
return parseInt(window.getComputedStyle(dom, null)[style])
},
listClick(id, index) {
this.batchDel.selectShow ? this.selectOpt(id) : this.goDetails(id, index)
},
goDetails(id, index) {
const pageCount = (index / 50).toString()
let num = 1
pageCount.indexOf('.') === -1 ? num = pageCount : num = parseInt(pageCount) + 1
window.localStorage.myQuestionDetileId = id
window.localStorage.cachequestion = JSON.stringify([])
this.$router.push({
path: '/my/questionsDetails',
query: {
page: parseInt(num) === 0 ? 1 : num,
type: 2,
questionType: this.screen.screenVal
}
})
},
selectOpt(id) {
const isArr = this.batchDel.countData.findIndex(item => { return item === id })
const length = this.batchDel.countData.length
length === 0
? this.batchDel.countData.push(id)
: isArr === -1
? this.batchDel.countData.push(id)
: this.batchDel.countData.splice(isArr, 1)
this.batchDel.countData.length === 0
? this.batchDel.isDelBtn = false
: this.batchDel.isDelBtn = true
},
onCancel() {
this.screen.isShow = false
},
handleScroll(e) {
const contentH = document.getElementsByTagName('body')[0].offsetHeight
const clientH = document.documentElement.clientHeight
const pageScrollH = document.documentElement.scrollTop || document.body.scrollTop
if (this.scrollFlag) { return false }
if (contentH - clientH === pageScrollH) {
this.scrollFlag = true
this.isLogding = true
this.params.page = this.params.page + 1
this.initData()
}
},
del(ids, n) {
const idGroup = Array.isArray(ids) ? ids : [ids]
const param = {
question_id: idGroup.toString(),
type: 2
}
api.deleteQuestion(param).then(res => {
if (res.code === 0) {
if (n === 1) {
idGroup.map(id => {
const index = this.question.list.findIndex(item => { return item.question_id === id })
this.question.list.splice(index, 1)
})
this.initData()
} else {
this.params.page = 1
this.initData(2)
document.documentElement.scrollTop = 0
}
if (this.question.list.length === 0) {
this.clear()
}
this.batchDel.selectShow = false
this.batchDel.isDelBtn = false
this.batchDel.isPopShow = false
this.batchDel.isAllSelect = false
Toast('删除成功')
}
})
},
collectQuestion(queId) {
// const idGroup = Array.isArray(ids) ? ids : [ids]
const queIds = Array.isArray(queId) ? queId : [queId]
queIds.map(id => {
const items = this.question.list.find(item => { return item.question_id === queId })
items.is_collection ? this.removeColl(queIds, () => {
Toast('取消收藏')
items.is_collection = false
}) : this.addColl(queIds, () => {
Toast('收藏成功')
items.is_collection = true
})
})
},
addColl(idGroup, callback) {
api.collectQuestion({ question_id: idGroup.toString() }).then(res => {
if (res.code === 0) {
callback()
}
})
},
removeColl(idGroup, callback) {
api.deleteQuestion({ type: 2, question_id: idGroup.toString() }).then(res => {
if (res.code === 0) {
callback()
}
})
},
tab(e) {
if (e === '0') {
this.params = {
type: 1,
page: 1,
page_size: 30
}
} else {
this.params = {
type: 3,
page: 1,
page_size: 30
}
}
this.screen.checkedText = '全部'
this.activeClass = e
this.clear()
document.getElementById('bottom-view').scrollTop = 0
this.initData()
},
onConfirm(value, index) {
const n = {
0: 0,
1: 1,
2: 2,
3: 6,
4: 5
}
this.params = {
type: 2,
question_type: n[index],
page: 1,
page_size: 30
}
this.screen.screenVal = n[index]
this.screen.checkedText = value
this.clear()
this.screen.isShow = false
this.initData()
},
clear() {
this.batchDel.selectShow = false
this.batchDel.isDelBtn = false
this.batchDel.countData = []
this.question.list = []
},
initData(isDel) {
api.getMyQuestion(this.params).then(res => {
if (!isDel) {
if (this.question.list.length === 0) {
res.list.map(item => {
this.question.list.push(item)
})
}
}
if (isDel === 2) {
this.question.list = res.list
}
this.question.total = res.total
this.question.errorTotal = res.error_total
// this.scrollDom()
if (res.list.length === 0) {
// Toast('没有更多了')
} else {
this.scrollFlag = false
}
this.isLogding = false
this.$forceUpdate()
})
}
},
mounted() {
this.initData()
window.addEventListener('scroll', this.handleScroll, true)
}
}
</script>
<style lang="scss" scoped>
.exam_submit{
position: fixed;
top: 0;
left: 0;
z-index: 999999;
width: 100%;
height: 100%;
background: rgba(0,0,0,0.6);
.pop{
width: 5.9rem;
position: absolute;
top: 50%;
left: 50%;
-webkit-transform: translate(-50%,-50%);
background:rgba(255,255,255,1);
border-radius:.12rem;
padding: 0.4rem 0;
.tit{
font-weight:bold;
color:rgba(34,34,34,1);
font-size:.3rem;
text-align: center;
line-height: 100%;
}
.txt{
color:rgba(34,34,34,1);
font-size:.3rem;
text-align: center;
line-height: 100%;
margin-top: .8rem;
}
.btn_box{
padding:0 0.2rem;
display: flex;
margin-top: .8rem;
.btn{
width:2.6rem;
height:.7rem;
background:#C62245;
border-radius:.12rem;
text-align: center;
line-height: .7rem;
color: #fff;
font-size: .3rem;
}
.btn2{
margin-left: auto;
}
}
}
}
.btn-box{
position: fixed;
bottom: 0;
left: 0;
width:100%;
height:1rem;
background:rgba(255,255,255,1);
box-shadow:0 0 .06rem 0 rgba(0,0,0,0.05);
display: flex;
padding: 0 .4rem;
.w-btn{
width:3rem;
height:.7rem;
background:#C62245;
border-radius:.12rem;
font-size:.3rem;
text-align: center;
line-height: .7rem;
color:rgba(255,255,255,1);
margin-top: .15rem;
}
.z-btn{
width:2.1rem;
height:.7rem;
background:#C62245;
border-radius:.12rem;
font-size: .3rem;
text-align: center;
line-height: .7rem;
margin: .15rem 0;
color: #fff;
}
.z-btn.mar{
margin: .15rem .2rem;
}
.z-btn.col{
background:rgba(247,247,247,1);
color:rgba(204,204,204,1);
}
.w-btn.col{
background:rgba(247,247,247,1);
color:rgba(204,204,204,1);
margin-left: .7rem;
}
.w-btn.col2{
background:rgba(247,247,247,1);
color:rgba(204,204,204,1);
}
}
.top-tab{
width: 6.7rem;
height: 1.76rem;
margin: 0 auto;
display: flex;
.btn{
margin-left: 1rem;
height: 100%;
.num{
text-align: center;
line-height: 100%;
font-size:.46rem;
padding-top: .4rem;
color: #999;
}
.txt{
line-height: 100%;
font-size: .3rem;
margin-top: .2rem;
color: #999;
}
}
.active{
border-bottom: 0.06rem solid rgba(43,124,233,1);
.num{
color:rgba(43,124,233,1);
}
.txt{
color:rgba(43,124,233,1);
}
}
.right{
margin-left: auto;
margin-right: 1rem;
}
}
.exam-con{
padding: 0 .4rem;
.sele{
border-bottom: 0.01rem solid #eee;
height: 1.06rem;
display: flex;
align-items: center;
font-weight: bold;
// margin-top: .4rem;
.title{
font-size: .26rem;
color: #222;
}
.txt{
font-size: .26rem;
margin-left: auto;
display: flex;
align-items: center;
}
}
}
.sele-pop{
position: fixed;
top: 0;
left: 0;
background: rgba(0,0,0,0.8);
width: 100%;
height: 100%;
z-index: 99;
.picker{
width: 100%;
position: absolute;
bottom: 0;
left: 0;
}
}
.question-box{
overflow-y: scroll;
padding: 0 .4rem;
ul{
padding-bottom: 1rem;
li{
position: relative;
border-bottom: 0.01rem solid #eee;
display: flex;
padding: .4rem 0;
img{
width: .48rem;
height: .6rem;
}
.text{
width: 5.2rem;
line-height:.34rem;
font-size: .26rem;
color:rgba(34,34,34,1);
margin-left: .2rem;
text-align: justify;
}
.del{
margin-left: auto;
font-size:.26rem;
color: #999;
line-height: 100%;
.dels{
width: .41rem;
height: .44rem;
background: url('../../assets/images/del.png');
background-size: 100% 100%;
}
.collect{
width: .44rem;
height: .44rem;
background: url('../../assets/images/collect.png');
background-size: 100% 100%;
margin-top: .2rem;
}
.active{
background: url('../../assets/images/collect2.png');
background-size: 100% 100%;
}
}
.opt{
position: absolute;
top: 50%;
right: 0;
-webkit-transform: translateY(-50%);
width:.44rem;
height:.44rem;
background:rgba(204,204,204,1);
border-radius: 50%;
}
.opt.active{
background: url('../../assets/images/zq-icon.png');
background-size: 100% 100%;
background-color: none;
}
}
}
}
.loading{
position: relative;
width: 100%;
padding-bottom: .4rem;
.icon{
position: absolute;
left: 50%;
top: 0;
-webkit-transform: translateX(-50%);
}
}
</style>
src/pages/my/test/errorQuestionList.vue deleted 100644 → 0
浏览文件 @ 33707f35
<template>
<div>
<div id="top-view">
<div class="top-tab">
<div :class="activeClass == '0' ? 'left btn active' : 'left btn'" @click="tab('0')">
<div class="num">{{ question.errorTotal }}</div>
<div class="txt">错题总数</div>
</div>
</div>
<div class="exam-con">
<div class="sele" @click="screen.isShow = true">
<div class="title">选择题型</div>
<div class="txt">
<div class="t">{{ screen.checkedText }}</div>
<van-icon name="arrow" />
</div>
</div>
</div>
</div>
<div class="question-box" id="bottom-view">
<ul>
<template v-for="(item, index) in question.list">
<li :data-id="item.question_id" :key="index" @click="listClick(item.question_id, index)" ref="liDom">
<img src="../../assets/images/que-type1.png" alt="" v-if="item.question_type == '6'">
<img src="../../assets/images/que-type2.png" alt="" v-if="item.question_type == '5'">
<img src="../../assets/images/que-type3.png" alt="" v-if="item.question_type == '2'">
<img src="../../assets/images/que-type4.png" alt="" v-if="item.question_type == '1'">
<div class="text" v-html="item.question_content"></div>
<template v-if="!batchDel.selectShow">
<div class="del">
<div class="dels" @click.prevent.stop.stop="del(item.question_id, 1)"></div>
<div :class="item.is_collection ? 'collect active' : 'collect'" @click.prevent.stop.stop="collectQuestion(item.question_id)"></div>
</div>
</template>
<template v-else>
<div :class="batchDel.countData.find(id => { return id === item.question_id }) ? 'opt active' : 'opt'"></div>
</template>
</li>
</template>
</ul>
<van-empty description="暂无内容" v-if="question.list.length == 0"/>
<div class="loading" v-if="isLogding">
<div class="icon">
<van-loading color="#1989fa" />
</div>
</div>
</div>
<div class="sele-pop" v-if="screen.isShow">
<div class="picker">
<van-picker
show-toolbar
:columns="screen.columns"
@confirm="onConfirm"
@cancel="onCancel"
/>
</div>
</div>
<div class="btn-box" id="btn-box">
<template v-if="!batchDel.selectShow">
<div :class="question.list.length != 0 ? 'w-btn' : 'w-btn col2'" @click="batchToolShow">批量管理</div>
<div class="w-btn col" @touchmove.prevent="delBtn = false">删除</div>
</template>
<template v-else>
<div class="z-btn" @click="batchDel.selectShow = false">返回</div>
<div class="z-btn mar" @click="allSelect">{{ batchDel.isAllSelect ? '取消全选' : '全选' }}</div>
<div :class="!batchDel.isDelBtn ? 'z-btn col' : 'z-btn'" @click="!batchDel.isDelBtn ? batchDel.isPopShow = false : batchDel.isPopShow = true">删除</div>
</template>
</div>
<div class="exam_submit" v-if="batchDel.isPopShow">
<div class="pop">
<div class="tit"></div>
<div class="txt">确认删除</div>
<div class="btn_box">
<div class="btn" @click="batchDel.isPopShow = false">取消</div>
<div class="btn btn2" @click="batchDelClick">确定</div>
</div>
</div>
</div>
</div>
</template>
<script>
import * as api from '@/api/my.js'
import { Toast } from 'vant'
export default {
metaInfo: {
title: '我的错题'
},
components: {
[Toast.name]: Toast
},
data() {
return {
delBtn: false,
batchDel: {
selectShow: false,
isDelBtn: false,
countData: [],
isAllSelect: false,
isPopShow: false
},
screen: {
isShow: false,
checkedText: '全部',
columns: ['全部', '单选题', '多选题', '判断题', '案例题'],
screenVal: '0'
},
question: {
list: []
},
activeClass: '0',
changeGroup: false,
isLogding: false,
params: {
type: 1,
page: 1,
page_size: 30
},
scrollFlag: false
}
},
methods: {
batchToolShow() {
this.question.list.length ? this.batchDel.selectShow = true : Toast('没有可操作项')
},
batchDelClick() {
this.batchDel.isDelBtn ? this.del(this.batchDel.countData) : Toast('请选择删除内容')
},
lookup(array, value) {
const arr = array.concat([])
arr.push(value)
arr.sort((a, b) => {
return a - b
})
const index = arr.indexOf(value)
if (index === 0) {
return arr[index + 1]
} else if (index === array.length - 1) {
return arr[index - 1]
}
const resultIndex =
arr[index] - arr[index - 1] > arr[index + 1] - arr[index]
? index + 1
: index - 1
return arr[resultIndex]
},
allSelect() {
const topView = document.getElementById('top-view')
const btnBox = document.getElementById('btn-box')
const scrollH = (document.documentElement.scrollTop || document.body.scrollTop) + document.documentElement.clientHeight
const clientDomH = scrollH - (this.computedStyle(topView, 'height') + this.computedStyle(btnBox, 'height'))
let countNum = 0
const cumulativeValue = []
const cumulativeObj = {}
this.$refs.liDom.map((item, index) => {
countNum += item.clientHeight
cumulativeObj[countNum] = item.getAttribute('data-id')
cumulativeValue.push(countNum)
})
this.scrollFlag = true
if (countNum < clientDomH) {
// 直接全选
if (this.batchDel.countData.length === this.question.list.length) {
this.batchDel.countData = []
this.batchDel.isDelBtn = false
this.batchDel.isAllSelect = false
} else {
this.batchDel.countData = []
this.question.list.map(item => {
this.batchDel.countData.push(item.question_id)
})
this.batchDel.isDelBtn = true
this.batchDel.isAllSelect = true
}
return false
}
if (this.batchDel.isAllSelect) {
this.batchDel.countData = []
this.batchDel.isDelBtn = false
} else {
const getId = cumulativeObj[this.lookup(cumulativeValue, clientDomH)]
const listItem = this.question.list
for (let i = 0; i < listItem.length; i++) {
if (listItem[i].question_id === getId) {
this.batchDel.countData.push(listItem[i].question_id)
break
} else {
this.batchDel.countData.push(listItem[i].question_id)
}
}
this.batchDel.isDelBtn = true
}
this.batchDel.isAllSelect = !this.batchDel.isAllSelect
},
computedStyle(dom, style) {
return parseInt(window.getComputedStyle(dom, null)[style])
},
listClick(id, index) {
this.batchDel.selectShow ? this.selectOpt(id) : this.goDetails(id, index)
},
goDetails(id, index) {
const pageCount = (index / 50).toString()
let num = 1
pageCount.indexOf('.') === -1 ? num = pageCount : num = parseInt(pageCount) + 1
window.localStorage.myQuestionDetileId = id
window.localStorage.cachequestion = JSON.stringify([])
this.$router.push({
path: '/my/questionsDetails',
query: {
page: parseInt(num) === 0 ? 1 : num,
type: this.activeClass === '0' ? 1 : 3,
questionType: this.screen.screenVal
}
})
},
selectOpt(id) {
const isArr = this.batchDel.countData.findIndex(item => { return item === id })
const length = this.batchDel.countData.length
length === 0
? this.batchDel.countData.push(id)
: isArr === -1
? this.batchDel.countData.push(id)
: this.batchDel.countData.splice(isArr, 1)
this.batchDel.countData.length === 0
? this.batchDel.isDelBtn = false
: this.batchDel.isDelBtn = true
},
onCancel() {
this.screen.isShow = false
},
handleScroll(e) {
const contentH = document.getElementsByTagName('body')[0].offsetHeight
const clientH = document.documentElement.clientHeight
const pageScrollH = document.documentElement.scrollTop || document.body.scrollTop
if (this.scrollFlag) { return false }
if (contentH - clientH === pageScrollH) {
this.scrollFlag = true
this.isLogding = true
this.params.page = this.params.page + 1
this.initData()
}
},
del(ids, n) {
const idGroup = Array.isArray(ids) ? ids : [ids]
const param = {
question_id: idGroup.toString(),
type: this.activeClass === '0' ? 1 : 3
}
api.deleteQuestion(param).then(res => {
if (res.code === 0) {
if (n === 1) {
idGroup.map(id => {
const index = this.question.list.findIndex(item => { return item.question_id === id })
this.question.list.splice(index, 1)
})
this.initData()
} else {
this.params.page = 1
this.initData(2)
document.documentElement.scrollTop = 0
}
if (this.question.list.length === 0) {
this.clear()
}
this.batchDel.selectShow = false
this.batchDel.isDelBtn = false
this.batchDel.isPopShow = false
this.batchDel.isAllSelect = false
Toast('删除成功')
}
})
},
collectQuestion(queId) {
// const idGroup = Array.isArray(ids) ? ids : [ids]
const queIds = Array.isArray(queId) ? queId : [queId]
queIds.map(id => {
const items = this.question.list.find(item => { return item.question_id === queId })
items.is_collection ? this.removeColl(queIds, () => {
Toast('取消收藏')
items.is_collection = false
}) : this.addColl(queIds, () => {
Toast('收藏成功')
items.is_collection = true
})
})
},
addColl(idGroup, callback) {
api.collectQuestion({ question_id: idGroup.toString() }).then(res => {
if (res.code === 0) {
callback()
}
})
},
removeColl(idGroup, callback) {
api.deleteQuestion({ type: 2, question_id: idGroup.toString() }).then(res => {
if (res.code === 0) {
callback()
}
})
},
tab(e) {
if (e === '0') {
this.params = {
type: 1,
page: 1,
page_size: 30
}
} else {
this.params = {
type: 3,
page: 1,
page_size: 30
}
}
this.screen.checkedText = '全部'
this.activeClass = e
this.clear()
document.getElementById('bottom-view').scrollTop = 0
this.initData()
},
onConfirm(value, index) {
const n = {
0: 0,
1: 1,
2: 2,
3: 6,
4: 5
}
this.params = {
type: this.activeClass === '0' ? 1 : 3,
question_type: n[index],
page: 1,
page_size: 30
}
this.screen.screenVal = n[index]
this.screen.checkedText = value
this.clear()
this.screen.isShow = false
this.initData()
},
clear() {
this.batchDel.selectShow = false
this.batchDel.isDelBtn = false
this.batchDel.countData = []
this.question.list = []
},
initData(isDel) {
api.getMyQuestion(this.params).then(res => {
if (!isDel) {
if (this.question.list.length === 0) {
res.list.map(item => {
this.question.list.push(item)
})
}
}
if (isDel === 2) {
this.question.list = res.list
}
this.question.total = res.total
this.question.errorTotal = res.error_total
// this.scrollDom()
if (res.list.length === 0) {
// Toast('没有更多了')
} else {
this.scrollFlag = false
}
this.isLogding = false
this.$forceUpdate()
})
}
},
mounted() {
this.initData()
window.addEventListener('scroll', this.handleScroll, true)
}
}
</script>
<style lang="scss" scoped>
.exam_submit{
position: fixed;
top: 0;
left: 0;
z-index: 999999;
width: 100%;
height: 100%;
background: rgba(0,0,0,0.6);
.pop{
width: 5.9rem;
position: absolute;
top: 50%;
left: 50%;
-webkit-transform: translate(-50%,-50%);
background:rgba(255,255,255,1);
border-radius:.12rem;
padding: 0.4rem 0;
.tit{
font-weight:bold;
color:rgba(34,34,34,1);
font-size:.3rem;
text-align: center;
line-height: 100%;
}
.txt{
color:rgba(34,34,34,1);
font-size:.3rem;
text-align: center;
line-height: 100%;
margin-top: .8rem;
}
.btn_box{
padding:0 0.2rem;
display: flex;
margin-top: .8rem;
.btn{
width:2.6rem;
height:.7rem;
background:#C62245;
border-radius:.12rem;
text-align: center;
line-height: .7rem;
color: #fff;
font-size: .3rem;
}
.btn2{
margin-left: auto;
}
}
}
}
.btn-box{
position: fixed;
bottom: 0;
left: 0;
width:100%;
height:1rem;
background:rgba(255,255,255,1);
box-shadow:0 0 .06rem 0 rgba(0,0,0,0.05);
display: flex;
padding: 0 .4rem;
.w-btn{
width:3rem;
height:.7rem;
background:#C62245;
border-radius:.12rem;
font-size:.3rem;
text-align: center;
line-height: .7rem;
color:rgba(255,255,255,1);
margin-top: .15rem;
}
.z-btn{
width:2.1rem;
height:.7rem;
background:#C62245;
border-radius:.12rem;
font-size: .3rem;
text-align: center;
line-height: .7rem;
margin: .15rem 0;
color: #fff;
}
.z-btn.mar{
margin: .15rem .2rem;
}
.z-btn.col{
background:rgba(247,247,247,1);
color:rgba(204,204,204,1);
}
.w-btn.col{
background:rgba(247,247,247,1);
color:rgba(204,204,204,1);
margin-left: .7rem;
}
.w-btn.col2{
background:rgba(247,247,247,1);
color:rgba(204,204,204,1);
}
}
.top-tab{
width: 6.7rem;
height: 1.76rem;
margin: 0 auto;
display: flex;
.btn{
margin: 0 auto;
height: 100%;
.num{
text-align: center;
line-height: 100%;
font-size:.46rem;
padding-top: .4rem;
color: #999;
}
.txt{
line-height: 100%;
font-size: .3rem;
margin-top: .2rem;
color: #999;
}
}
.active{
// border-bottom: 0.06rem solid #C62245;
.num{
color:#C62245;
}
.txt{
color:#C62245;
}
}
.right{
margin-left: auto;
margin-right: 1rem;
}
}
.exam-con{
padding: 0 .4rem;
.sele{
border-bottom: 0.01rem solid #eee;
height: 1.06rem;
display: flex;
align-items: center;
font-weight: bold;
// margin-top: .4rem;
.title{
font-size: .26rem;
color: #222;
}
.txt{
font-size: .26rem;
margin-left: auto;
display: flex;
align-items: center;
}
}
}
.sele-pop{
position: fixed;
top: 0;
left: 0;
background: rgba(0,0,0,0.8);
width: 100%;
height: 100%;
z-index: 99;
.picker{
width: 100%;
position: absolute;
bottom: 0;
left: 0;
}
}
.question-box{
overflow-y: scroll;
padding: 0 .4rem;
ul{
padding-bottom: 1rem;
li{
position: relative;
border-bottom: 0.01rem solid #eee;
display: flex;
padding: .4rem 0;
img{
width: .48rem;
height: .6rem;
}
.text{
width: 5.2rem;
line-height:.34rem;
font-size: .26rem;
color:rgba(34,34,34,1);
margin-left: .2rem;
text-align: justify;
}
.del{
margin-left: auto;
font-size:.26rem;
color: #999;
line-height: 100%;
.dels{
width: .41rem;
height: .44rem;
background: url('../../assets/images/del.png');
background-size: 100% 100%;
}
.collect{
width: .44rem;
height: .44rem;
background: url('../../assets/images/collect.png');
background-size: 100% 100%;
margin-top: .2rem;
}
.active{
background: url('../../assets/images/collect2.png');
background-size: 100% 100%;
}
}
.opt{
position: absolute;
top: 0.4rem;
right: 0;
// -webkit-transform: translateY(-50%);
width:.44rem;
height:.44rem;
background:rgba(204,204,204,1);
border-radius: 50%;
}
.opt.active{
background: url('../../assets/images/zq-icon.png');
background-size: 100% 100%;
background-color: none;
}
}
}
}
.loading{
position: relative;
width: 100%;
padding-bottom: .4rem;
.icon{
position: absolute;
left: 50%;
top: 0;
-webkit-transform: translateX(-50%);
}
}
</style>
src/pages/my/test/index.vue deleted 100644 → 0
浏览文件 @ 33707f35
<template>
<app-container> </app-container>
</template>
<script>
import AppContainer from '@/components/AppContainer'
export default {
components: { AppContainer }
}
</script>
src/pages/my/test/questionsDetails.vue deleted 100644 → 0
浏览文件 @ 33707f35
<template>
<div>
<div class="exam-box">
<div class="topic-box">
<van-empty description="暂无内容" v-if="isEmpty"/>
<swiper ref="mySwiper" :options="swiperOptions">
<template v-for="(item, index) in questionData.list">
<swiper-slide :key="index" :data-id="item.question_id">
<div id="top-view">
<div class="tool-box">
<div class="time">{{ item.sheet_time }}</div>
<div class="tool-all">
<div class="tag-box" @click="goAnswerCard">
<span style="margin-right:.4rem">答题卡</span>
</div>
<div v-if="$route.query.type != 2" :class="item.is_collection ? 'icon1 active' : 'icon1'" @click="collectQuestion(item.question_id)"></div>
<div class="icon2" @click="delQuestion(item.question_id)"></div>
</div>
</div>
</div>
<div class="title">
<div class="type">{{ other.type[item.question_type] }}</div>
<div class="count">{{ item.num }}/{{ $route.query.type == 1 || $route.query.type == undefined ? questionData.error_total : $route.query.type == 2 ? questionData.collection_total : questionData.total }}</div>
</div>
<div class="topic-bt" v-if="item.question_type == '5'" v-html="item.common_content"></div>
<div class="topic" v-html="item.question_content"></div>
<ul class="option">
<template v-for="(opt, optIndex) in item.question_options">
<template v-if="$route.query.type != 3">
<template v-if="item.question_type == 2 || item.question_type == 5 && item.answer_count > 1">
<li
:key="opt.id"
@click="selectOptions(item, opt)"
:class="findData(item, 'isSelect') && item.user_answer.length && item.question_answer.find(id => { return id === opt.id })
? 'active2'
: cacheOption.find(cItem => {
return cItem.answer.find(aItem => { return aItem == opt.id })
})
? 'active'
: ''"
>
<van-icon class="icon" name="checked" v-if="findData(item, 'isSelect') && item.question_answer.find(id => { return id === opt.id })"/>
<div>
<span v-if="!(findData(item, 'isSelect') && item.question_answer.find(id => { return id === opt.id }))">{{ A_Z[optIndex] }}.</span>
{{ opt.option }}
</div>
</li>
</template>
<template v-else>
<li
:key="opt.id"
@click="selectOptions(item, opt)"
:class="cacheOption.find(id => { return id.id === item.question_id }) && item.question_answer.find(id => { return id === opt.id })
? 'active2'
: cacheOption.find(cItem => {
return cItem.answer.find(aItem => { return aItem == opt.id })
})
? 'active'
: ''"
>
<van-icon class="icon" name="checked" v-if="cacheOption.find(id => { return id.id === item.question_id }) && item.question_answer.find(id => { return id === opt.id })"/>
<div>
<span v-if="!(cacheOption.find(id => { return id.id === item.question_id }) && item.question_answer.find(id => { return id === opt.id }))">{{ A_Z[optIndex] }}.</span>
{{ opt.option }}
</div>
</li>
</template>
</template>
<template v-else>
<li
:key="opt.id+'=-='"
@click="selectOptions(item, opt)"
:class="item.question_answer.find(id => { return id === opt.id })
? 'active2'
: item.user_answer.find(id => { return id === opt.id })
? 'active'
: ''"
>
<van-icon class="icon" name="checked" v-if="item.user_answer.length != 0 && item.question_answer.find(id => { return id === opt.id })"/>
<div>
<span v-if="!(item.question_answer.find(id => { return id === opt.id }))">{{ A_Z[optIndex] }}.</span>
{{ opt.option }}
</div>
</li>
</template>
</template>
</ul>
<div class="com-btn" @click="confirmSelect(item)" v-if="$route.query.type != 3 && (item.question_type == 2 || item.question_type == 5 && item.answer_count > 1)">确认答案</div>
<template v-if="$route.query.type != 3">
<template v-if="item.question_type == 2 || item.question_type == 5 && item.answer_count > 1">
<div class="analy" v-show="findData(item, 'isSelect') && item.user_answer.length">
<div class="tit">答案解析</div>
<div class="txt">正确答案：
<span>
{{
item.question_answer.map((i, index) => {
return A_Z[item.question_options.findIndex(id => { return id.id === i })]
}).sort().toString().replace(new RegExp(',', 'g'), '')
}}
</span>
</div>
<div class="txt">您的答案：
<span>
{{
findData(item, 'answer').map((i, index) => {
return A_Z[item.question_options.findIndex(id => { return id.id === i })]
}).sort().toString().replace(new RegExp(',', 'g'), '')
}}
</span>
</div>
<div class="exp">
<p class="name">解析：</p>
<p class="nr" v-html="item.question_analysis"></p>
</div>
</div>
</template>
<template v-else>
<div class="analy" v-show="isAnalysis || cacheOption.find(id => { return id.id === item.question_id })">
<div class="tit">答案解析</div>
<div class="txt">正确答案：
<span>
{{
item.question_answer.map((i, index) => {
return A_Z[item.question_options.findIndex(id => { return id.id === i })]
}).toString().replace(new RegExp(',', 'g'), '')
}}
</span>
</div>
<div class="txt">您的答案：
<span>
{{
item.user_answer.map((i, index) => {
return A_Z[item.question_options.findIndex(id => { return id.id === i })]
}).toString().replace(new RegExp(',', 'g'), '')
}}
</span>
</div>
<div class="exp">
<p class="name">解析：</p>
<p class="nr" v-html="item.question_analysis"></p>
</div>
</div>
</template>
</template>
<template v-else>
<div class="analy">
<div class="tit">答案解析</div>
<div class="txt">正确答案：
<span>
{{
item.question_answer.map((i, index) => {
return A_Z[item.question_options.findIndex(id => { return id.id === i })]
}).toString().replace(new RegExp(',', 'g'), '')
}}
</span>
</div>
<div class="txt">您的答案：
<span>
{{
item.user_answer.map((i, index) => {
return A_Z[item.question_options.findIndex(id => { return id.id === i })]
}).toString().replace(new RegExp(',', 'g'), '')
}}
</span>
</div>
<div class="exp">
<p class="name">解析：</p>
<p class="nr" v-html="item.question_analysis"></p>
</div>
</div>
</template>
</swiper-slide>
</template>
</swiper>
</div>
<template v-if="!isEmpty">
<div class="btn-box" id="bottom-view">
<div :class="$route.query.type == 2 ? 'padd new' : 'padd'">
<!-- <div class="ysc" v-if="$route.query.type == 2">已收藏</div> -->
<!-- <div class="analysis" @click="isAnalysis = !isAnalysis" v-if="$route.query.type == 1 || $route.query.type == 2">查看解析</div> -->
<div class="btn left" @click="switchQuestions('left')" v-if="isBtnShow.currentPage != 1">上一题</div>
<div class="btn right" @click="switchQuestions('right')" v-if="isBtnShow.currentPage != isBtnShow.pageCount">下一题</div>
</div>
</div>
</template>
</div>
</div>
</template>
<script>
import * as api from '@/api/my.js'
import { Toast, Dialog } from 'vant'
import { Swiper, SwiperSlide, directive } from 'vue-awesome-swiper'
// import card from '../../components/answerCard.vue'
import 'swiper/css/swiper.css'
export default {
beforeDestroy() {
// window.localStorage.isCache = false
clearInterval(this.cacheTime)
},
metaInfo() {
return {
title: parseInt(this.$route.query.type) === 1
? '我的错题'
: parseInt(this.$route.query.type) === 2
? '收藏试题'
: '已做试题'
}
},
components: {
[Toast.name]: Toast,
Swiper,
SwiperSlide,
[Dialog.name]: Dialog
},
directives: {
swiper: directive
},
data() {
const _this = this
return {
isEmpty: false,
storageCheckOption: [],
cacheOption: [],
isBtnShow: {
currentPage: 1,
pageCount: 1
},
cacheTime: null,
cacheList: {},
prevQuestionId: '',
pages: 0,
isMove: true,
other: {
type: {
1: '单选题',
2: '多选题',
5: '案例题',
6: '判断题'
}
},
A_Z: ['A', 'B', 'C', 'D', 'E', 'F'],
questionData: {
list: []
},
isAnalysis: false,
swiperOptions: {
observer: true,
observeParents: true,
notNextTick: true,
autoHeight: true,
on: {
init() {
setTimeout(() => {
const qId = _this.swiper.slides[_this.swiper.activeIndex].attributes['data-id'].nodeValue
const item = _this.questionData.list.find(item => { return item.question_id === qId })
if (item.num % 30 === 0) {
_this.nextQuestionLoading()
}
if ((item.num - 1) % 30 === 0) {
_this.prevQuestionLoading()
}
_this.isBtnShow.currentPage = item.num
// _this.sildesHeightCount()
_this.cacheOption = JSON.parse(window.localStorage.cachequestion)
}, 500)
},
slideChangeTransitionStart: function() {
_this.switchPages()
},
slidePrevTransitionEnd: function() {
if (this.activeIndex === 0) {
_this.prevQuestionLoading()
}
},
slideNextTransitionEnd: function() {
if (this.activeIndex === this.slides.length - 1) {
_this.nextQuestionLoading()
}
}
}
}
}
},
created() {
parseInt(this.$route.query.type) === 3 ? this.isAnalysis = true : this.isAnalysis = false
},
mounted() {
this.pages = this.$route.query.page
this.initData(this.pages)
},
computed: {
swiper() {
return this.$refs.mySwiper.$swiper
},
findData() {
return function (item, callValue) {
const data = this.cacheOption.find(id => { return id.id === item.question_id })
if (data) {
return data[callValue] || (false)
}
return callValue === 'answer' ? [] : false
}
}
},
methods: {
// 缓存试题
cacheQuestion() {
const param = {
type: this.$route.query.type === undefined ? 1 : this.$route.query.type,
question_type: this.$route.query.questionType === undefined ? '' : this.$route.query.questionType,
answer: JSON.stringify(this.cacheList)
}
api.cacheQuestion(param).then(res => {})
},
// init到最后一题加载
nextQuestionLoading() {
Toast.loading({
message: '加载中...',
duration: 1000,
loadingType: 'spinner'
})
const qId = this.swiper.slides[this.swiper.activeIndex].attributes['data-id'].nodeValue
const item = this.questionData.list.find(item => { return item.question_id === qId })
this.prevQuestionId = item.question_id
this.initData(parseInt(item.num / 30) + 1)
},
// init到第一题加载
prevQuestionLoading() {
Toast.loading({
message: '加载中...',
duration: 1000,
loadingType: 'spinner'
})
const qId = this.swiper.slides[this.swiper.activeIndex].attributes['data-id'].nodeValue
const item = this.questionData.list.find(item => { return item.question_id === qId })
this.prevQuestionId = item.question_id
this.initData(parseInt(item.num / 30), true)
},
// 跳转答题卡
goAnswerCard() {
this.cacheQuestion()
clearInterval(this.cacheTime)
this.$router.push({
name: 'answerCard',
query: {
type: this.$route.query.type === undefined ? 1 : this.$route.query.type,
questionType: this.$route.query.questionType === undefined ? '' : this.$route.query.questionType
}
})
},
// 收藏试题
collectQuestion(queId) {
const queIds = Array.isArray(queId) ? queId : [queId]
queIds.map(id => {
const items = this.questionData.list.find(item => { return item.question_id === queId })
items.is_collection ? this.removeColl(queIds, () => {
Toast('取消收藏')
items.is_collection = false
}) : this.addColl(queIds, () => {
Toast('收藏成功')
items.is_collection = true
})
})
},
addColl(idGroup, callback) {
api.collectQuestion({ question_id: idGroup.toString() }).then(res => {
if (res.code === 0) {
callback()
}
})
},
removeColl(idGroup, callback) {
api.deleteQuestion({ type: 2, question_id: idGroup.toString() }).then(res => {
if (res.code === 0) {
callback()
}
})
},
// 删除试题
delQuestion(ids) {
const idGroup = Array.isArray(ids) ? ids : [ids]
const param = {
question_id: idGroup.toString(),
type: this.$route.query.type
}
api.deleteQuestion(param).then(res => {
if (res.code === 0) {
const isNext = this.questionData.list[this.questionData.list.findIndex(item => { return item.question_id === ids }) + 1]
isNext === undefined ? this.swiper.slidePrev() : this.swiper.slideNext()
if (this.swiper.slides.length !== 1) {
this.$router.replace({
path: '/my/questionsDetails',
query: {
id: this.swiper.slides[this.swiper.activeIndex].attributes['data-id'].nodeValue,
page: this.$route.query.page,
type: this.$route.query.type,
questionType: this.$route.query.questionType
}
})
} else {
this.isEmpty = true
this.swiper.slides.remove()
}
}
})
},
// 切换上一题下一题
switchQuestions(e) {
if (e === 'left') {
this.swiper.slidePrev()
} else {
this.swiper.slideNext()
}
},
switchPages() {
document.scrollingElement.scrollTop = 0
const qId = this.swiper.slides[this.swiper.activeIndex].attributes['data-id'].nodeValue
window.localStorage.myQuestionDetileId = qId
const itemNum = this.questionData.list.find(item => { return item.question_id === qId })
this.isBtnShow.currentPage = itemNum.num
parseInt(this.$route.query.type) === 3 ? this.isAnalysis = true : this.isAnalysis = false
// this.sildesHeightCount()
},
sildesHeightCount() {
// slides高度重新赋值
const computedStyle = window.getComputedStyle(this.swiper.slides[this.swiper.activeIndex], null)
const topView = document.getElementById('top-view').clientHeight
const bottomView = document.getElementById('bottom-view').clientHeight
const slidesClentH = document.body.clientHeight - topView - bottomView
const slidesH = this.swiper.slides[this.swiper.activeIndex].clientHeight
const countNum = slidesClentH - slidesH
const sliedsRealH = slidesClentH - (slidesH - parseInt(computedStyle.paddingBottom))
if (countNum > 0) {
this.swiper.slides[this.swiper.activeIndex].style.paddingBottom = `${sliedsRealH}px`
} else {
this.swiper.slides[this.swiper.activeIndex].style.paddingBottom = '1.2rem'
}
},
confirmSelect(item) {
// 后台缓存
this.cacheList[item.question_id] = this.storageCheckOption
const data = this.cacheOption.find(d => { return d.id === item.question_id })
data.isSelect = true
window.localStorage.cachequestion = JSON.stringify(this.cacheOption)
},
// 选择选项
selectOptions(item, opt) {
if (parseInt(this.$route.query.type) === 3) {
return false
}
if (parseInt(item.question_type) === 1 || parseInt(item.question_type) === 6 || (parseInt(item.question_type) === 5 && item.answer_count === 1)) {
const datas = this.cacheOption.find(data => { return data.id === item.question_id })
if (datas) {
return false
}
item.isSelect = true
// 后台缓存
item.user_answer = [opt.id]
// 前端缓存
datas ? datas.answer = [opt.id] : this.cacheOption.push({
id: item.question_id,
answer: [opt.id],
isSelect: false
})
this.cacheList[item.question_id] = item.user_answer
window.localStorage.cachequestion = JSON.stringify(this.cacheOption)
} else {
const datas = this.cacheOption.find(d => { return d.id === item.question_id })
if (datas) {
if (datas.isSelect) {
return false
}
}
const stotageInde = this.storageCheckOption.findIndex(i => { return i === opt.id })
stotageInde === -1 ? this.storageCheckOption.push(opt.id) : this.storageCheckOption.splice(stotageInde, 1)
// 后台缓存
const fIndex = item.user_answer.findIndex(id => { return id === opt.id })
fIndex === -1 ? item.user_answer.push(opt.id) : item.user_answer.splice(fIndex, 1)
// 前端缓存
if (!datas) {
this.cacheOption.push({
id: item.question_id,
answer: [opt.id],
isSelect: false
})
} else {
const index = datas.answer.findIndex(d => { return d === opt.id })
index === -1 ? datas.answer.push(opt.id) : datas.answer.splice(index, 1)
}
}
},
// 初始化数据 || 翻页请求数据
initData(pages, isPush) {
const params = {
type: this.$route.query.type === undefined ? 1 : this.$route.query.type,
question_type: this.$route.query.questionType === undefined ? '' : this.$route.query.questionType,
page: pages,
page_size: 30
}
api.getMyQuestion(params).then(res => {
this.questionData.error_total = res.error_total
this.questionData.total = res.total
this.questionData.collection_total = res.collection_total
parseInt(this.$route.query.type) === 1
? this.isBtnShow.pageCount = res.error_total
: parseInt(this.$route.query.type) === 2
? this.isBtnShow.pageCount = res.collection_total
: this.isBtnShow.pageCount = res.total
const list = []
res.list.map(item => {
const isCf = this.questionData.list.findIndex(i => { return i.question_id === item.question_id })
isCf === -1 && list.push(item)
})
this.moveLoading(list, isPush)
this.$nextTick(() => {
if (this.isMove) {
this.isMove = false
const goIndex = this.questionData.list.findIndex(item => { return item.question_id === window.localStorage.myQuestionDetileId })
this.swiper.slideTo(goIndex, 0, false)
}
})
if (this.$route.query.type !== 3) {
clearInterval(this.cacheTime)
this.cacheTime = setInterval(() => {
this.cacheQuestion()
}, 3000)
}
})
},
// 请求回来试题后删除多余的试题
moveLoading(list, isPush) {
if (isPush) {
this.questionData.list = [...list, ...this.questionData.list]
if (this.questionData.list.length >= 90) {
for (let i = 0; i < 30; i++) {
this.questionData.list.splice(this.questionData.list.length - 1, 1)
}
}
const goIndex = this.questionData.list.findIndex(i => { return i.question_id === this.prevQuestionId })
if (!this.isMove) {
setTimeout(() => {
this.swiper.slideTo(goIndex, 0, false)
}, 500)
}
} else {
this.questionData.list = [...this.questionData.list, ...list]
if (this.questionData.list.length >= 90) {
for (let i = 0; i < 30; i++) {
this.questionData.list.splice(0, 1)
}
}
const goIndex = this.questionData.list.findIndex(i => { return i.question_id === this.prevQuestionId })
if (!this.isMove) {
setTimeout(() => {
this.swiper.slideTo(goIndex, 0, false)
}, 500)
}
}
}
}
}
</script>
<style lang="scss">
.exam-box{
.swiper-wrapper{
padding-bottom: env(safe-area-inset-bottom);
.swiper-slide{
padding-bottom: 1.2rem;
}
}
.head{
color: #222;
display: flex;
padding: .4rem 0;
align-items: center;
i{
font-size: .35rem;
margin-left: .28rem;
}
.title{
margin-left: .03rem;
font-size: .3rem;
}
}
.tool-box{
width: 6.7rem;
border-bottom: .01rem solid rgba(238,238,238,1);
padding: .35rem 0;
display: flex;
align-items: center;
margin: 0 auto;
color: #222;
.tool-all{
margin-left: auto;
display: flex;
.icon1{
width: .44rem;
height: .44rem;
background: url('../../assets/images/collect.png');
background-size: 100% 100%;
margin-right: .53rem;
}
.icon1.active{
background: url('../../assets/images/collect2.png');
background-size: 100% 100%;
}
.icon2{
width: .41rem;
height: .44rem;
background: url('../../assets/images/del.png');
background-size: 100% 100%;
}
}
.time{
font-size: .3rem;
}
.tag-box{
margin-left: auto;
display: flex;
span{
padding: .1rem .2rem;
font-size: .2rem;
color: #fff;
background: #F47885;
border-radius: .25rem;
margin-left: .2rem;
}
.active{
background: #FF8000;
}
}
}
.topic-box{
width: 100%;
margin: 0 auto;
font-size: .3rem;
color: #222;
overflow-y: scroll;
.title{
padding: .4rem;
display: flex;
align-items: center;
.count{
margin-left: auto;
}
}
.topic{
font-size: .26rem;
line-height: .4rem;
padding: 0 .4rem;
span{
width: 100%;
display: block;
}
img{
width: 100%;
display: block;
}
}
.topic-bt{
font-size: .26rem;
line-height: .4rem;
padding: 0 .4rem;
// font-weight: bold;
margin-bottom: .2rem;
span{
width: 100%;
display: block;
}
img{
width: 100%;
display: block;
}
}
.option{
list-style: none;
margin: .35rem 0 0 0;
padding: 0 .4rem;
li{
background:rgba(247,247,247,1);
border-radius: .2rem;
font-weight: bold;
padding: .35rem .2rem;
margin-bottom: .2rem;
word-wrap:break-word;
display: flex;
align-items: center;
}
.icon{
color: #5CB9A2;
font-size: .3rem;
margin-right: .1rem;
}
.active{
color: #5F95DE;
background:#DDF1FF;
}
.active2{
// padding-left: ;
color: #40A38B;
background: #E4F9ED;
}
}
.analy{
font-size: .3rem;
color: #222;
padding: 0.2rem .4rem 1.2rem .4rem;
.tit{
font-weight: bold;
line-height: 100%;
}
.txt{
line-height: 100%;
margin-top: .4rem;
span{
font-weight: bold;
}
}
.exp{
margin-top: .4rem;
overflow: hidden;
p{
float: left;
}
.nr{
// width: 5.8rem;
p{
width: 100%;
}
img{
width: 100%;
}
}
}
}
}
.topic-box.hide{
overflow: hidden;
}
.btn-box{
position: fixed;
bottom: 0;
left: 0;
height: 1rem;
box-shadow:0px 0px 6px 0px rgba(0,0,0,0.05);
background: #fff;
color: #222;
font-size: .3rem;
width: 100%;
z-index: 99;
padding-bottom: env(safe-area-inset-bottom);
.padd{
display: flex;
padding: 0 .4rem;
align-items: center;
height: 100%;
}
.analysis{
white-space: nowrap;
margin-right: .3rem;
}
.btn{
width:3rem;
height:.7rem;
background:#C62245;
border-radius:.12rem;
text-align: center;
line-height: .7rem;
color: #fff;
}
.new{
.btn{
width:2.4rem;
height:.7rem;
}
.ysc{
color: #ccc;
margin-right: .4rem;
}
.analysis{
margin-left: .4rem;
margin-right: .4rem;
}
}
.left{
margin-right: .4rem;
}
.right{
margin-left: auto;
// background:rgba(255,103,103,1);
}
}
.exam_submit{
position: fixed;
top: 0;
left: 0;
z-index: 999999;
width: 100%;
height: 100%;
background: rgba(0,0,0,0.6);
.pop{
width: 5.9rem;
position: absolute;
top: 50%;
left: 50%;
-webkit-transform: translate(-50%,-50%);
background:rgba(255,255,255,1);
border-radius:.12rem;
padding: 0.4rem 0;
.tit{
font-weight:bold;
color:rgba(34,34,34,1);
font-size:.3rem;
text-align: center;
line-height: 100%;
}
.txt{
color:rgba(34,34,34,1);
font-size:.3rem;
text-align: center;
line-height: 100%;
margin-top: .8rem;
}
.btn_box{
padding:0 0.2rem;
display: flex;
margin-top: .8rem;
.btn{
width:2.6rem;
height:.7rem;
background:rgba(43,124,233,1);
border-radius:.12rem;
text-align: center;
line-height: .7rem;
color: #fff;
font-size: .3rem;
}
.btn2{
margin-left: auto;
}
}
}
}
.exam-end-pop{
position: fixed;
top: 0;
left: 0;
z-index: 999999;
width: 100%;
height: 100%;
background: rgba(0,0,0,0.6);
.pop{
width: 5.9rem;
position: absolute;
top: 50%;
left: 50%;
-webkit-transform: translate(-50%,-50%);
background:rgba(255,255,255,1);
border-radius:.12rem;
padding: .4rem 0;
.tit{
font-size: .3rem;
color: #222;
text-align: center;
font-weight: bold;
}
img{
width: 1.59rem;
height: 1.35rem;
display: block;
margin: 0.4rem auto 0.2rem auto;
}
.txt{
color: #222;
font-size: .3rem;
line-height: 100%;
text-align: center;
}
.btn{
margin: .4rem auto 0 auto;
width:5.5rem;
height:.7rem;
background:rgba(255,103,103,1);
border-radius:.12rem;
text-align: center;
line-height: .7rem;
color: #fff;
font-size: .3rem;
}
}
}
}
.com-btn{
width:6.7rem;
height:.7rem;
background:rgba(244,120,133,1);
border-radius:.12rem;
margin: 0 auto;
text-align: center;
line-height: .7rem;
font-size: .3rem;
color: #fff;
}
</style>
src/pages/my/test/questionsList.vue deleted 100644 → 0
浏览文件 @ 33707f35
<template>
<div>
<div id="top-view">
<div class="top-tab">
<div :class="activeClass == '0' ? 'left btn active' : 'left btn'" @click="tab('0')">
<div class="num">{{ question.errorTotal }}</div>
<div class="txt">错题总数</div>
</div>
<div :class="activeClass == '1' ? 'right btn active' : 'right btn'" @click="tab('1')">
<div class="num">{{ question.total }}</div>
<div class="txt">做题总数</div>
</div>
</div>
<div class="exam-con">
<div class="sele" @click="screen.isShow = true">
<div class="title">选择题型</div>
<div class="txt">
<div class="t">{{ screen.checkedText }}</div>
<van-icon name="arrow" />
</div>
</div>
</div>
</div>
<div class="question-box" id="bottom-view">
<ul>
<template v-for="(item, index) in question.list">
<li :data-id="item.question_id" :key="index" @click="listClick(item.question_id, index)" ref="liDom">
<img src="../../assets/images/que-type1.png" alt="" v-if="item.question_type == '6'">
<img src="../../assets/images/que-type2.png" alt="" v-if="item.question_type == '5'">
<img src="../../assets/images/que-type3.png" alt="" v-if="item.question_type == '2'">
<img src="../../assets/images/que-type4.png" alt="" v-if="item.question_type == '1'">
<div class="text" v-html="item.question_content"></div>
<template v-if="!batchDel.selectShow">
<div class="del">
<div class="dels" @click.prevent.stop.stop="del(item.question_id, 1)"></div>
<div :class="item.is_collection ? 'collect active' : 'collect'" @click.prevent.stop.stop="collectQuestion(item.question_id)"></div>
</div>
</template>
<template v-else>
<div :class="batchDel.countData.find(id => { return id === item.question_id }) ? 'opt active' : 'opt'"></div>
</template>
</li>
</template>
</ul>
<van-empty description="暂无内容" v-if="question.list.length == 0"/>
<div class="loading" v-if="isLogding">
<div class="icon">
<van-loading color="#1989fa" />
</div>
</div>
</div>
<div class="sele-pop" v-if="screen.isShow">
<div class="picker">
<van-picker
show-toolbar
:columns="screen.columns"
@confirm="onConfirm"
@cancel="onCancel"
/>
</div>
</div>
<div class="btn-box" id="btn-box">
<template v-if="!batchDel.selectShow">
<div :class="question.list.length != 0 ? 'w-btn' : 'w-btn col2'" @click="batchToolShow">批量管理</div>
<div class="w-btn col" @touchmove.prevent="delBtn = false">删除</div>
</template>
<template v-else>
<div class="z-btn" @click="batchDel.selectShow = false">返回</div>
<div class="z-btn mar" @click="allSelect">{{ batchDel.isAllSelect ? '取消全选' : '全选' }}</div>
<div :class="!batchDel.isDelBtn ? 'z-btn col' : 'z-btn'" @click="!batchDel.isDelBtn ? batchDel.isPopShow = false : batchDel.isPopShow = true">删除</div>
</template>
</div>
<div class="exam_submit" v-if="batchDel.isPopShow">
<div class="pop">
<div class="tit"></div>
<div class="txt">确认删除</div>
<div class="btn_box">
<div class="btn" @click="batchDel.isPopShow = false">取消</div>
<div class="btn btn2" @click="batchDelClick">确定</div>
</div>
</div>
</div>
</div>
</template>
<script>
import * as api from '@/api/my.js'
import { Toast, Empty } from 'vant'
export default {
metaInfo: {
title: '已做试题'
},
components: {
[Toast.name]: Toast,
[Empty.name]: Empty
},
data() {
return {
batchDel: {
delBtn: false,
selectShow: false,
isDelBtn: false,
countData: [],
isAllSelect: false,
isPopShow: false
},
screen: {
isShow: false,
checkedText: '全部',
columns: ['全部', '单选题', '多选题', '判断题', '案例题'],
screenVal: '0'
},
question: {
list: []
},
activeClass: '0',
changeGroup: false,
isLogding: false,
params: {
type: 1,
page: 1,
page_size: 30
},
scrollFlag: false
}
},
methods: {
batchToolShow() {
this.question.list.length ? this.batchDel.selectShow = true : Toast('没有可操作项')
},
batchDelClick() {
this.batchDel.isDelBtn ? this.del(this.batchDel.countData) : Toast('请选择删除内容')
},
lookup(array, value) {
const arr = array.concat([])
arr.push(value)
arr.sort((a, b) => {
return a - b
})
const index = arr.indexOf(value)
if (index === 0) {
return arr[index + 1]
} else if (index === array.length - 1) {
return arr[index - 1]
}
const resultIndex =
arr[index] - arr[index - 1] > arr[index + 1] - arr[index]
? index + 1
: index - 1
return arr[resultIndex]
},
allSelect() {
const topView = document.getElementById('top-view')
const btnBox = document.getElementById('btn-box')
const scrollH = (document.documentElement.scrollTop || document.body.scrollTop) + document.documentElement.clientHeight
const clientDomH = scrollH - (this.computedStyle(topView, 'height') + this.computedStyle(btnBox, 'height'))
let countNum = 0
const cumulativeValue = []
const cumulativeObj = {}
this.$refs.liDom.map((item, index) => {
countNum += item.clientHeight
cumulativeObj[countNum] = item.getAttribute('data-id')
cumulativeValue.push(countNum)
})
this.scrollFlag = true
if (countNum < clientDomH) {
// 直接全选
if (this.batchDel.countData.length === this.question.list.length) {
this.batchDel.countData = []
this.batchDel.isDelBtn = false
this.batchDel.isAllSelect = false
} else {
this.batchDel.countData = []
this.question.list.map(item => {
this.batchDel.countData.push(item.question_id)
})
this.batchDel.isDelBtn = true
this.batchDel.isAllSelect = true
}
return false
}
if (this.batchDel.isAllSelect) {
this.batchDel.countData = []
this.batchDel.isDelBtn = false
} else {
const getId = cumulativeObj[this.lookup(cumulativeValue, clientDomH)]
const listItem = this.question.list
for (let i = 0; i < listItem.length; i++) {
if (listItem[i].question_id === getId) {
this.batchDel.countData.push(listItem[i].question_id)
break
} else {
this.batchDel.countData.push(listItem[i].question_id)
}
}
this.batchDel.isDelBtn = true
}
this.batchDel.isAllSelect = !this.batchDel.isAllSelect
},
computedStyle(dom, style) {
return parseInt(window.getComputedStyle(dom, null)[style])
},
listClick(id, index) {
this.batchDel.selectShow ? this.selectOpt(id) : this.goDetails(id, index)
},
goDetails(id, index) {
const pageCount = (index / 50).toString()
let num = 1
pageCount.indexOf('.') === -1 ? num = pageCount : num = parseInt(pageCount) + 1
window.localStorage.myQuestionDetileId = id
window.localStorage.cachequestion = JSON.stringify([])
this.$router.push({
path: '/my/questionsDetails',
query: {
page: parseInt(num) === 0 ? 1 : num,
type: this.activeClass === '0' ? 1 : 3,
questionType: this.screen.screenVal
}
})
},
selectOpt(id) {
const isArr = this.batchDel.countData.findIndex(item => { return item === id })
const length = this.batchDel.countData.length
length === 0
? this.batchDel.countData.push(id)
: isArr === -1
? this.batchDel.countData.push(id)
: this.batchDel.countData.splice(isArr, 1)
this.batchDel.countData.length === 0
? this.batchDel.isDelBtn = false
: this.batchDel.isDelBtn = true
},
onCancel() {
this.screen.isShow = false
},
handleScroll(e) {
const contentH = document.getElementsByTagName('body')[0].offsetHeight
const clientH = document.documentElement.clientHeight
const pageScrollH = document.documentElement.scrollTop || document.body.scrollTop
if (this.scrollFlag) { return false }
if (contentH - clientH === pageScrollH) {
this.scrollFlag = true
this.isLogding = true
this.params.page = this.params.page + 1
this.initData()
}
},
del(ids, n) {
const idGroup = Array.isArray(ids) ? ids : [ids]
const param = {
question_id: idGroup.toString(),
type: this.activeClass === '0' ? 1 : 3
}
api.deleteQuestion(param).then(res => {
if (res.code === 0) {
if (n === 1) {
idGroup.map(id => {
const index = this.question.list.findIndex(item => { return item.question_id === id })
this.question.list.splice(index, 1)
})
this.initData()
} else {
this.params.page = 1
this.initData(2)
document.documentElement.scrollTop = 0
}
if (this.question.list.length === 0) {
this.clear()
}
this.batchDel.selectShow = false
this.batchDel.isDelBtn = false
this.batchDel.isPopShow = false
this.batchDel.isAllSelect = false
Toast('删除成功')
}
})
},
collectQuestion(queId) {
// const idGroup = Array.isArray(ids) ? ids : [ids]
const queIds = Array.isArray(queId) ? queId : [queId]
queIds.map(id => {
const items = this.question.list.find(item => { return item.question_id === queId })
items.is_collection ? this.removeColl(queIds, () => {
Toast('取消收藏')
items.is_collection = false
}) : this.addColl(queIds, () => {
Toast('收藏成功')
items.is_collection = true
})
})
},
addColl(idGroup, callback) {
api.collectQuestion({ question_id: idGroup.toString() }).then(res => {
if (res.code === 0) {
callback()
}
})
},
removeColl(idGroup, callback) {
api.deleteQuestion({ type: 2, question_id: idGroup.toString() }).then(res => {
if (res.code === 0) {
callback()
}
})
},
tab(e) {
if (e === '0') {
this.params = {
type: 1,
page: 1,
page_size: 30
}
} else {
this.params = {
type: 3,
page: 1,
page_size: 30
}
}
this.screen.checkedText = '全部'
this.activeClass = e
this.clear()
document.getElementById('bottom-view').scrollTop = 0
this.initData()
},
onConfirm(value, index) {
const n = {
0: 0,
1: 1,
2: 2,
3: 6,
4: 5
}
this.params = {
type: this.activeClass === '0' ? 1 : 3,
question_type: n[index],
page: 1,
page_size: 30
}
this.screen.screenVal = n[index]
this.screen.checkedText = value
this.clear()
this.screen.isShow = false
this.initData()
},
clear() {
this.batchDel.isAllSelect = false
this.batchDel.selectShow = false
this.batchDel.isDelBtn = false
this.batchDel.countData = []
this.question.list = []
},
initData(isDel) {
api.getMyQuestion(this.params).then(res => {
if (!isDel) {
if (this.question.list.length === 0) {
res.list.map(item => {
this.question.list.push(item)
})
}
}
if (isDel === 2) {
this.question.list = res.list
}
this.question.total = res.total
this.question.errorTotal = res.error_total
// this.scrollDom()
if (res.list.length === 0) {
// Toast('没有更多了')
} else {
this.scrollFlag = false
}
this.isLogding = false
this.$forceUpdate()
})
}
},
mounted() {
this.initData()
window.addEventListener('scroll', this.handleScroll, true)
}
}
</script>
<style lang="scss" scoped>
.exam_submit{
position: fixed;
top: 0;
left: 0;
z-index: 999999;
width: 100%;
height: 100%;
background: rgba(0,0,0,0.6);
.pop{
width: 5.9rem;
position: absolute;
top: 50%;
left: 50%;
-webkit-transform: translate(-50%,-50%);
background:rgba(255,255,255,1);
border-radius:.12rem;
padding: 0.4rem 0;
.tit{
font-weight:bold;
color:rgba(34,34,34,1);
font-size:.3rem;
text-align: center;
line-height: 100%;
}
.txt{
color:rgba(34,34,34,1);
font-size:.3rem;
text-align: center;
line-height: 100%;
margin-top: .8rem;
}
.btn_box{
padding:0 0.2rem;
display: flex;
margin-top: .8rem;
.btn{
width:2.6rem;
height:.7rem;
background:#C62245;
border-radius:.12rem;
text-align: center;
line-height: .7rem;
color: #fff;
font-size: .3rem;
}
.btn2{
margin-left: auto;
}
}
}
}
.btn-box{
position: fixed;
bottom: 0;
left: 0;
width:100%;
height:1rem;
background:rgba(255,255,255,1);
box-shadow:0 0 .06rem 0 rgba(0,0,0,0.05);
display: flex;
padding: 0 .4rem;
.w-btn{
width:3rem;
height:.7rem;
background:#C62245;
border-radius:.12rem;
font-size:.3rem;
text-align: center;
line-height: .7rem;
color:rgba(255,255,255,1);
margin-top: .15rem;
}
.z-btn{
width:2.1rem;
height:.7rem;
background:#C62245;
border-radius:.12rem;
font-size: .3rem;
text-align: center;
line-height: .7rem;
margin: .15rem 0;
color: #fff;
}
.z-btn.mar{
margin: .15rem .2rem;
}
.z-btn.col{
background:rgba(247,247,247,1);
color:rgba(204,204,204,1);
}
.w-btn.col{
background:rgba(247,247,247,1);
color:rgba(204,204,204,1);
margin-left: .7rem;
}
.w-btn.col2{
background:rgba(247,247,247,1);
color:rgba(204,204,204,1);
}
}
.top-tab{
width: 6.7rem;
height: 1.76rem;
margin: 0 auto;
display: flex;
.btn{
margin-left: 1rem;
height: 100%;
.num{
text-align: center;
line-height: 100%;
font-size:.46rem;
padding-top: .4rem;
color: #999;
}
.txt{
line-height: 100%;
font-size: .3rem;
margin-top: .2rem;
color: #999;
}
}
.active{
border-bottom: 0.06rem solid #C62245;
.num{
color:#C62245;
}
.txt{
color:#C62245;
}
}
.right{
margin-left: auto;
margin-right: 1rem;
}
}
.exam-con{
padding: 0 .4rem;
.sele{
border-bottom: 0.01rem solid #eee;
height: 1.06rem;
display: flex;
align-items: center;
font-weight: bold;
margin-top: .4rem;
.title{
font-size: .26rem;
color: #222;
}
.txt{
font-size: .26rem;
margin-left: auto;
display: flex;
align-items: center;
}
}
}
.sele-pop{
position: fixed;
top: 0;
left: 0;
background: rgba(0,0,0,0.8);
width: 100%;
height: 100%;
z-index: 99;
.picker{
width: 100%;
position: absolute;
bottom: 0;
left: 0;
}
}
.question-box{
overflow-y: scroll;
padding: 0 .4rem;
ul{
padding-bottom: 1rem;
li{
position: relative;
border-bottom: 0.01rem solid #eee;
display: flex;
padding: .4rem 0;
img{
width: .48rem;
height: .6rem;
}
.text{
width: 5.2rem;
line-height:.34rem;
font-size: .26rem;
color:rgba(34,34,34,1);
margin-left: .2rem;
text-align: justify;
}
.del{
margin-left: auto;
font-size:.26rem;
color: #999;
line-height: 100%;
.dels{
width: .41rem;
height: .44rem;
background: url('../../assets/images/del.png');
background-size: 100% 100%;
}
.collect{
width: .44rem;
height: .44rem;
background: url('../../assets/images/collect.png');
background-size: 100% 100%;
margin-top: .2rem;
}
.active{
background: url('../../assets/images/collect2.png');
background-size: 100% 100%;
}
}
.opt{
position: absolute;
top: 50%;
right: 0;
-webkit-transform: translateY(-50%);
width:.44rem;
height:.44rem;
background:rgba(204,204,204,1);
border-radius: 50%;
}
.opt.active{
background: url('../../assets/images/zq-icon.png');
background-size: 100% 100%;
background-color: none;
}
}
}
}
.loading{
position: relative;
width: 100%;
padding-bottom: .4rem;
.icon{
position: absolute;
left: 50%;
top: 0;
-webkit-transform: translateX(-50%);
}
}
</style>
Markdown 格式
0% 或
您添加了 0 人 到此讨论。请谨慎行事。
请先完成此评论的编辑！
请 注册 或者 后发表评论