diff --git a/src/views/contest/contestList.vue b/src/views/contest/contestList.vue
index feb46769d..a9a570372 100644
--- a/src/views/contest/contestList.vue
+++ b/src/views/contest/contestList.vue
@@ -1,13 +1,135 @@
 <template>
-	<div>任务列表</div>
+  <div class="trainingPlatform" :style="'padding-left:'+(widthLeft)+'px'">
+    <div class="trainingPubMapList" :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>
+      <el-tabs v-model="activeModuleName" class="tabs-box" type="border-card">
+        <template v-for="(mod, modIndex) in moduleList">
+          <el-tab-pane :key="modIndex" :label="mod.moduleName" :name="mod.customModuleId+''">
+            <el-card>
+              <div>考试时间：{{ mod.duration }}</div>
+              <el-tree
+                :data="taskTreeDatas"
+                node-key="id"
+                default-expand-all
+                :expand-on-click-node="false"
+              />
+            </el-card>
+            <el-button type="primary" @click="beginExercise(mod.customModuleId)">开始训练</el-button>
+          </el-tab-pane>
+        </template>
+      </el-tabs>
+    </div>
+  </div>
 </template>
 
 <script>
+import paperList from './paperList';
+import drapLeft from '@/views/components/drapLeft/index';
+import localStore from 'storejs';
+import { getPaperDetail} from '@/api/contest';
+let id = 1;
+
 export default {
-	name: "contestList"
-}
+    name: 'TrainingPlatform',
+    components: {
+        paperList,
+        drapLeft
+    },
+    data() {
+        return {
+            widthLeft: 450,
+            paperName:'试卷',
+            paperId:'',
+            activeModuleName:'',
+            moduleList:[],
+            taskTreeDatas:[]
+        };
+    },
+    computed: {
+        width() {
+            return this.$store.state.app.width;
+        }
+    },
+    mounted() {
+        this.widthLeft = Number(localStore.get('LeftWidth')) ? Number(localStore.get('LeftWidth')) : 450;
+    },
+    methods: {
+        drapWidth(width) {
+            this.widthLeft = Number(width);
+        },
+        changeModuleData(paper) {
+            this.paperName = paper.name;
+            this.paperId = paper.id;
+            getPaperDetail(paper.id).then((res) => {
+                console.log(res);
+                this.moduleList = res.data.moduleVo.modules;
+                this.activeModuleName = this.moduleList[0].customModuleId + '';
+                const data = this.moduleList.map(moduleItem=>{
+                    let children = [];
+                    if (moduleItem.group.length) {
+                        children = moduleItem.group.map(taskCatalog=> this.transformTree(taskCatalog));
+                    }
+                    return {
+                        id:id++,
+                        label:moduleItem.moduleName,
+                        duration:moduleItem.duration,
+                        moduleScoreRuleId:moduleItem.moduleScoreRuleId,
+                        type:'module',
+                        children
+                    };
+                });
+                this.taskTreeDatas = data[0].children;
+            }).catch(error => {
+                this.$message.error(error.message);
+            });
+        },
+        beginExercise(moduleId) {
+            this.$router.push({path: '/contest/detail', query:{paperId:this.paperId, moduleId }});
+        },
+        transformTree(data) {
+            const result = {label:data.name, children:[], id:id++, type:'taskCatalog' };
+            if (data.group.length) {
+                const changeGroup = data.group.map(taskCatalog=>
+                    this.transformTree(taskCatalog)
+                );
+                result.children.push(...changeGroup);
+            }
+            return result;
+        }
+    }
+};
 </script>
-
-<style scoped>
-
+<style lang="scss" scoped>
+    .trainingPlatform {
+        position: relative;
+        height: 100%;
+        width: 100%;
+        overflow: hidden;
+    }
+    .trainingPubMapList {
+        position:absolute;
+        left:0;
+        top:0;
+        height: 100%;
+		background: #00172E;
+    }
+	.tabs-box{
+	height: calc(100% - 30px);
+	margin: 0 10px;
+	overflow-y: auto;
+	background: transparent;
+	&::-webkit-scrollbar{
+		background: #06284a;
+	}
+	&::-webkit-scrollbar-thumb{
+		background: #0c0909;
+	}
+	&::-webkit-scrollbar-track{
+		background: #06284a;
+	}
+}
 </style>
diff --git a/src/views/contest/paperList.vue b/src/views/contest/paperList.vue
new file mode 100644
index 000000000..6728f352c
--- /dev/null
+++ b/src/views/contest/paperList.vue
@@ -0,0 +1,142 @@
+<template>
+  <div v-loading="loading" class="map-list-main">
+    <div id="trainingMapTree" class="left-map-list">
+      <div class="mapListName">
+        <el-form :inline="true" :model="formModel" class="demo-form-inline">
+          <el-form-item label="组别">
+            <el-select v-model="formModel.group" placeholder="请选择" clearable>
+              <el-option
+                v-for="item in groupOption"
+                :key="item.value"
+                :label="item.label"
+                :value="item.value"
+              />
+            </el-select>
+          </el-form-item>
+          <el-form-item label="赛季">
+            <el-select v-model="formModel.seasonId" placeholder="请选择" clearable>
+              <el-option
+                v-for="item in seasonOptions"
+                :key="item.id"
+                :label="item.code"
+                :value="item.id"
+              />
+            </el-select>
+            <el-form-item>
+              <el-button type="primary" @click="queryPaper">查询</el-button>
+            </el-form-item>
+          </el-form-item>
+        </el-form>
+      </div>
+      <el-menu
+        :default-active="defaultIndex"
+        class="el-menu-vertical-demo"
+        text-color="#fff"
+        active-text-color="#ffd04b"
+      >
+        <template v-for="(paper,paperIndex) in paperList">
+          <el-menu-item :key="paperIndex" :index="paper.name" @click="showPaperDetail(paper)">
+            {{ paper.name }}
+          </el-menu-item>
+        </template>
+      </el-menu>
+    </div>
+  </div>
+</template>
+<script>
+import { queryContestSeasonPaged, getPaperList} from '@/api/contest';
+export default {
+    name: 'DemonList',
+    components: {
+    },
+    data() {
+        return {
+            loading: true,
+            formModel: {
+                seasonId: '', // 所属赛季id
+                group:'' // 高职和中职
+            },
+            groupOption:[{
+                value: 'ZZ',
+                label: '中职'
+            }, {
+                value: 'GZ',
+                label: '高职'
+            }],
+            seasonOptions:[],
+            paperList:[],
+            defaultIndex: ''
+        };
+    },
+    mounted() {
+        this.loading = false;
+        queryContestSeasonPaged({pageSize:999}).then((res) => {
+            this.seasonOptions = res.data.list;
+        });
+        getPaperList({pageSize:999}).then((res) => {
+            this.paperList = res.data.list;
+        });
+    },
+    methods: {
+        queryPaper() {
+            const data = Object.assign({pageSize:999}, this.formModel);
+            getPaperList(data).then((res) => {
+                this.paperList = res.data.list;
+            });
+
+        },
+        showPaperDetail(paper) {
+            this.$emit('changeModuleData', paper);
+        }
+    }
+};
+</script>
+<style lang="scss" scoped>
+	.el-menu{
+		background-color: transparent;
+	}
+	.el-menu-item{
+		&:hover{
+			background: #00172E;
+		}
+		&:focus{
+			background-color: #00172E;
+		}
+	}
+    .mapListName{
+        padding: 10px 0 10px 17px;
+		background: #01468B;
+		position: sticky;
+		position: -webkit-sticky;
+		border-bottom: 1px solid #00172E;
+		top: 0;
+		z-index: 9;
+    }
+    .left-map-list{
+        width: 100%;
+		height: 100%;
+        flex: 1;
+        overflow-y: scroll;
+        padding-bottom: 10px;
+		background: linear-gradient(to bottom, #01468B, #00172E);
+		&::-webkit-scrollbar{
+			background: #06284a;
+		}
+		&::-webkit-scrollbar-thumb{
+			background: #0c0909;
+		}
+		&::-webkit-scrollbar-track{
+			background: #06284a;
+		}
+    }
+    .map-list-main{
+        height: 100%;
+        display:flex;
+        flex-direction:column;
+    }
+	/deep/{
+		.el-menu{
+			border-right-width: 0;
+		}
+	}
+</style>