220 lines
5.3 KiB
Vue
220 lines
5.3 KiB
Vue
<template>
|
|
<el-dialog :visible.sync="dialogVisible" :before-close="handleClose" title="实操试题" width="80%">
|
|
<query-list-page ref="user" :pager-config="pagerConfig" :query-form="queryForm" :query-list="queryList" />
|
|
</el-dialog>
|
|
|
|
</template>
|
|
|
|
<script>
|
|
import { getPracticeList } from '@/api/race';
|
|
export default {
|
|
mixins: [
|
|
// WindowResizeHandler
|
|
],
|
|
props: {
|
|
operateIndexList: {
|
|
type: Array,
|
|
default() {
|
|
return [];
|
|
}
|
|
}
|
|
},
|
|
data() {
|
|
return {
|
|
index: 0,
|
|
height: 0,
|
|
loading: false,
|
|
dialogVisible: false,
|
|
pagerConfig: {
|
|
pageSize: 'pageSize',
|
|
pageIndex: 'pageNum'
|
|
},
|
|
queryForm: {
|
|
reset: true,
|
|
labelWidth: '80px',
|
|
queryObject: {}
|
|
},
|
|
queryList: {
|
|
query: getPracticeList,
|
|
beforeQuery: this.beforeQuery,
|
|
// data:[
|
|
// {id:1, raceId:2, name:'行调进行扣车操作', creatorName:'水墨'},
|
|
// {id:2, raceId:4, name:'行调进行扣车操作', creatorName:'zyy'},
|
|
// {id:3, raceId:3, name:'行调进行扣车操作', creatorName:'水墨'}
|
|
// ],
|
|
selectCheckShow: false,
|
|
indexShow: true,
|
|
columns: [
|
|
{
|
|
title: '实操名称',
|
|
prop: 'name',
|
|
width: '400'
|
|
},
|
|
{
|
|
title: '实操描述',
|
|
prop: 'description'
|
|
},
|
|
{
|
|
type: 'button',
|
|
title: '操 作',
|
|
width: '420',
|
|
buttons: [
|
|
{
|
|
name: '添加',
|
|
handleClick: this.addQuestion,
|
|
showControl: (row) => { return !row.paper; },
|
|
type: 'success'
|
|
},
|
|
{
|
|
name: '移出',
|
|
handleClick: this.removeQuestion,
|
|
showControl: (row) => { return row.paper; },
|
|
type: 'warning'
|
|
}
|
|
]
|
|
}
|
|
]
|
|
}
|
|
};
|
|
},
|
|
computed: {
|
|
},
|
|
watch: {
|
|
|
|
},
|
|
methods: {
|
|
loadInitData() {
|
|
this.$nextTick(() => {
|
|
this.queryList.reload();
|
|
});
|
|
},
|
|
doShow() {
|
|
this.dialogVisible = true;
|
|
this.loadInitData();
|
|
},
|
|
handleClose() {
|
|
this.dialogVisible = false;
|
|
},
|
|
addQuestion(index, row) {
|
|
this.$set(row, 'paper', true);
|
|
this.$emit('addQuestion', row);
|
|
},
|
|
beforeQuery(params) {
|
|
params.mapId = this.$route.query.mapId;
|
|
return params;
|
|
},
|
|
afterQuery(data) {
|
|
if (data && data.list) {
|
|
const that = this;
|
|
const list = data.list;
|
|
if (list) {
|
|
list.map(elem => {
|
|
this.$set(elem, 'paper', that.operateIndexList.includes(elem.id));
|
|
});
|
|
}
|
|
}
|
|
return data;
|
|
},
|
|
removeQuestion(index, row) {
|
|
this.$set(row, 'paper', false);
|
|
this.$emit('removeQuestion', row);
|
|
},
|
|
answerTags(row) {
|
|
const answer = [];
|
|
row.optionList.forEach((el, i) => {
|
|
switch (row.type) {
|
|
case 'select':
|
|
if (el.correct) {
|
|
answer.push(this.$asc2chart(i + 65));
|
|
}
|
|
break;
|
|
case 'judge':
|
|
if (el.correct) {
|
|
answer.push(el.content);
|
|
}
|
|
break;
|
|
}
|
|
});
|
|
return answer;
|
|
}
|
|
}
|
|
};
|
|
|
|
</script>
|
|
<style lang="scss" scoped>
|
|
.layer-center {
|
|
width: 900px;
|
|
height: 100%;
|
|
margin: auto;
|
|
background: #fff;
|
|
}
|
|
|
|
.quiz {
|
|
background: #eee;
|
|
height: 100%;
|
|
|
|
&::-webkit-scrollbar {
|
|
display:none
|
|
}
|
|
|
|
&__card {
|
|
height: 100%;
|
|
.dir-item {
|
|
padding-left: 25px;
|
|
}
|
|
|
|
.dir-caption {
|
|
padding-left: 10px;
|
|
line-height: 26px;
|
|
background: #f1f1f1;
|
|
}
|
|
|
|
}
|
|
|
|
&__container {
|
|
height: 100%;
|
|
|
|
&-header {
|
|
height: auto !important;
|
|
|
|
.title {
|
|
font-size: 24px;
|
|
line-height: 60px;
|
|
font-weight: bold;
|
|
text-align: center;
|
|
}
|
|
|
|
.notes {
|
|
color:#606266;
|
|
white-space: nowrap;
|
|
overflow: hidden;
|
|
text-overflow: ellipsis;
|
|
margin: 0 20px;
|
|
}
|
|
}
|
|
|
|
&-main {
|
|
.section {
|
|
padding: 5px 20px;
|
|
.caption {
|
|
line-height: 26px;
|
|
}
|
|
.context {
|
|
}
|
|
}
|
|
}
|
|
|
|
&-footer {
|
|
text-align: right;
|
|
position: sticky;
|
|
bottom: 0px;
|
|
padding: 40px ;
|
|
.buttons {
|
|
position: relative;
|
|
bottom: 20px;
|
|
}
|
|
}
|
|
}
|
|
}
|
|
</style>
|