大赛训练第一个页面
This commit is contained in:
parent
a36b8e7c22
commit
65b77a3b60
@ -1,11 +1,11 @@
|
||||
<template>
|
||||
<div class="trainingPlatform" :style="'padding-left:'+(widthLeft)+'px'">
|
||||
<div class="trainingPubMapList" :style="{width: widthLeft+'px'}">
|
||||
<div class="contestPlatform" :style="'padding-left:'+(widthLeft)+'px'">
|
||||
<div class="contestPaperList" :style="{width: widthLeft+'px'}">
|
||||
<paper-list ref="paperList" @changeModuleData="changeModuleData" />
|
||||
<drap-left :width-left="widthLeft" @drapWidth="drapWidth" />
|
||||
</div>
|
||||
<div>
|
||||
<div style="height: 50px;text-align: center;line-height: 50px;font-size: 26px;font-weight: bolder;">{{ paperName }}</div>
|
||||
<div class="module-box">
|
||||
<div style="height: 50px;text-align: center;line-height: 50px;font-size: 26px;font-weight: bolder;color: #fff;">{{ paperName }}</div>
|
||||
<el-tabs v-model="activeModuleName" class="tabs-box" type="border-card" @tab-click="handleTabClick">
|
||||
<template v-for="(mod, modIndex) in moduleList">
|
||||
<el-tab-pane :key="modIndex" :label="mod.moduleName" :name="mod.customModuleId+''">
|
||||
@ -37,7 +37,9 @@
|
||||
<el-table-column label="评分标准" prop="criteria" />
|
||||
</el-table>
|
||||
</el-card>
|
||||
<el-button type="primary" size="medium" style="margin-top: 10px;" @click="beginExercise(mod.customModuleId)">开始训练</el-button>
|
||||
<div style="display: flex; justify-content: center;margin-top: 10px;">
|
||||
<el-button type="primary" size="medium" @click="beginExercise(mod.customModuleId)">开始训练</el-button>
|
||||
</div>
|
||||
</el-tab-pane>
|
||||
</template>
|
||||
</el-tabs>
|
||||
@ -157,19 +159,23 @@ export default {
|
||||
};
|
||||
</script>
|
||||
<style lang="scss" scoped>
|
||||
.trainingPlatform {
|
||||
.contestPlatform {
|
||||
position: relative;
|
||||
height: 100%;
|
||||
width: 100%;
|
||||
overflow: hidden;
|
||||
}
|
||||
.trainingPubMapList {
|
||||
.contestPaperList {
|
||||
position:absolute;
|
||||
left:0;
|
||||
top:0;
|
||||
height: 100%;
|
||||
background: #00172E;
|
||||
}
|
||||
.module-box{
|
||||
height: 100%;
|
||||
width: 100%;
|
||||
padding-bottom: 20px;
|
||||
background: #00172E;
|
||||
.tabs-box{
|
||||
height: calc(100% - 30px);
|
||||
margin: 0 10px;
|
||||
@ -184,5 +190,29 @@ export default {
|
||||
&::-webkit-scrollbar-track{
|
||||
background: #06284a;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
/deep/{
|
||||
.el-tabs__nav-scroll{
|
||||
background: #00172E;
|
||||
}
|
||||
.el-tabs--border-card>.el-tabs__header .el-tabs__item{
|
||||
color: #fff;
|
||||
border: solid 1px #01468B;
|
||||
}
|
||||
.el-tabs--border-card>.el-tabs__header .el-tabs__item.is-active{
|
||||
background: #01468B;
|
||||
}
|
||||
.el-tabs--border-card{
|
||||
border: solid 1px #01468B;
|
||||
}
|
||||
.el-table th.el-table__cell{
|
||||
background-color: #01468B;
|
||||
color: #fff;
|
||||
}
|
||||
.el-table--border, .el-table--group{
|
||||
border-width: 0;
|
||||
}
|
||||
}
|
||||
</style>
|
||||
|
@ -3,8 +3,8 @@
|
||||
<div id="trainingMapTree" class="left-paper-list">
|
||||
<div class="paperListName">
|
||||
<el-form :inline="true" :model="formModel" class="demo-form-inline">
|
||||
<el-form-item label="组别" :label-style="{ color: 'red' }">
|
||||
<el-select v-model="formModel.group" placeholder="请选择" clearable>
|
||||
<el-form-item label="组别">
|
||||
<el-select v-model="formModel.group" placeholder="请选择" clearable style="width: 200px;" @change="queryPaper">
|
||||
<el-option
|
||||
v-for="item in groupOption"
|
||||
:key="item.value"
|
||||
@ -14,7 +14,7 @@
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
<el-form-item label="赛季">
|
||||
<el-select v-model="formModel.seasonId" placeholder="请选择" clearable>
|
||||
<el-select v-model="formModel.seasonId" placeholder="请选择" clearable style="width: 200px;" @change="filterPaper">
|
||||
<el-option
|
||||
v-for="item in seasonOptions"
|
||||
:key="item.id"
|
||||
@ -22,9 +22,6 @@
|
||||
:value="item.id"
|
||||
/>
|
||||
</el-select>
|
||||
<el-form-item>
|
||||
<el-button type="primary" size="medium" @click="queryPaper">查询</el-button>
|
||||
</el-form-item>
|
||||
</el-form-item>
|
||||
</el-form>
|
||||
</div>
|
||||
@ -35,7 +32,7 @@
|
||||
active-text-color="#ffd04b"
|
||||
>
|
||||
<template v-for="(paper,paperIndex) in paperList">
|
||||
<el-menu-item :key="paperIndex" :index="paper.id+''" @click="showPaperDetail(paper)">
|
||||
<el-menu-item v-show="!formModel.seasonId||paper.seasonId==formModel.seasonId" :key="paperIndex" :index="paper.id+''" @click="showPaperDetail(paper)">
|
||||
{{ paper.name }}
|
||||
</el-menu-item>
|
||||
</template>
|
||||
@ -70,21 +67,34 @@ export default {
|
||||
},
|
||||
mounted() {
|
||||
this.loading = false;
|
||||
queryContestSeasonPaged({pageSize:999}).then((res) => {
|
||||
this.seasonOptions = res.data.list;
|
||||
});
|
||||
getPaperList({ group:'GZ', pageSize:999}).then((res) => {
|
||||
this.paperList = res.data.list;
|
||||
this.defaultIndex = this.paperList[0].id + '';
|
||||
this.$emit('changeModuleData', this.paperList[0]);
|
||||
});
|
||||
this.querySeason();
|
||||
},
|
||||
methods: {
|
||||
queryPaper() {
|
||||
const data = Object.assign({pageSize:999}, this.formModel);
|
||||
getPaperList(data).then((res) => {
|
||||
getPaperList({ group:this.formModel.group, pageSize:999}).then((res) => {
|
||||
this.paperList = res.data.list;
|
||||
});
|
||||
this.querySeason();
|
||||
},
|
||||
querySeason() {
|
||||
queryContestSeasonPaged({pageSize:999, group:this.formModel.group }).then((res) => {
|
||||
this.seasonOptions = res.data.list;
|
||||
});
|
||||
},
|
||||
filterPaper() {
|
||||
if (this.formModel.seasonId) {
|
||||
const paper = this.paperList.find(paper=>paper.seasonId == this.formModel.seasonId);
|
||||
this.defaultIndex = paper.id + '';
|
||||
this.$emit('changeModuleData', paper);
|
||||
} else {
|
||||
this.defaultIndex = this.paperList[0].id + '';
|
||||
this.$emit('changeModuleData', this.paperList[0]);
|
||||
}
|
||||
|
||||
},
|
||||
showPaperDetail(paper) {
|
||||
|
Loading…
Reference in New Issue
Block a user