diff --git a/src/api/contest.js b/src/api/contest.js
index 482df6a2e..035846915 100644
--- a/src/api/contest.js
+++ b/src/api/contest.js
@@ -369,3 +369,10 @@ export function getSeasonContent(id) {
         method: 'get'
     });
 }
+
+export function getTheoryList() {
+    return request({
+        url: '/api/exercise/race/paper/questions',
+        method: 'get'
+    });
+}
diff --git a/src/i18n/langs/en/router.js b/src/i18n/langs/en/router.js
index 2cc718eb0..6684b44c2 100644
--- a/src/i18n/langs/en/router.js
+++ b/src/i18n/langs/en/router.js
@@ -1,110 +1,112 @@
 export default {
-	homePage: 'Home',
+    homePage: 'Home',
 
-	mapManage: 'Map',
-	skinManage: 'Skin management',
-	mapDraw: 'Map draw',
-	runPlanManage: 'Run plan',
-	productEdit: 'Product editor',
+    mapManage: 'Map',
+    skinManage: 'Skin management',
+    mapDraw: 'Map draw',
+    runPlanManage: 'Run plan',
+    productEdit: 'Product editor',
 
-	newDesignEditor: 'Editor',
-	newDesignEditorList: 'Editor List',
-	newDesignDraftEditorList: 'Draft Editor List',
-	uploadPdf: 'Upload Pdf',
-	fileManage: 'File Manage',
+    newDesignEditor: 'Editor',
+    newDesignEditorList: 'Editor List',
+    newDesignDraftEditorList: 'Draft Editor List',
+    uploadPdf: 'Upload Pdf',
+    fileManage: 'File Manage',
 
-	designhomePage: 'Public map',
-	designUserPage: 'Personal map',
-	newDesignUserPage: 'Personal map',
+    designhomePage: 'Public map',
+    designUserPage: 'Personal map',
+    newDesignUserPage: 'Personal map',
 
-	lessaonManage: 'Lesson',
-	lessonEdit: 'Lesson editor',
-	trainingRecord: 'Trainning recording',
-	trainingRule: 'Training rules',
-	trainingManage: 'Training management',
-	taskManage: 'Task management',
-	scriptManage: 'Script',
+    lessaonManage: 'Lesson',
+    lessonEdit: 'Lesson editor',
+    trainingRecord: 'Trainning recording',
+    trainingRule: 'Training rules',
+    trainingManage: 'Training management',
+    taskManage: 'Task management',
+    scriptManage: 'Script',
 
-	teachSystem: 'Teaching',
+    teachSystem: 'Teaching',
 
-	examSystem: 'Examination',
+    examSystem: 'Examination',
 
-	demonstrationSystem: 'Simulation',
+    demonstrationSystem: 'Simulation',
 
-	dpSystem: 'Large screen',
+    dpSystem: 'Large screen',
 
-	planSystem: 'Lian plan',
+    planSystem: 'Lian plan',
 
-	replayManage: 'Playback',
+    replayManage: 'Playback',
 
-	permissionManage: 'Permission',
-	selfPermission: 'My Permission',
+    permissionManage: 'Permission',
+    selfPermission: 'My Permission',
 
-	pulishManage: 'Publication',
-	publishMapManage: 'Publishing map management',
-	productStateManage: 'Product state management',
-	publishLessonManage: 'Publishing lesson management',
-	runPlanTemplateManage: 'Template plan management',
-	runPlanCommonManage: 'Loading Plan Managemen',
-	runPlanEveryDayManage: 'Daily plan Management',
-	examRuleManage: 'Management of examination rules',
+    pulishManage: 'Publication',
+    publishMapManage: 'Publishing map management',
+    productStateManage: 'Product state management',
+    publishLessonManage: 'Publishing lesson management',
+    runPlanTemplateManage: 'Template plan management',
+    runPlanCommonManage: 'Loading Plan Managemen',
+    runPlanEveryDayManage: 'Daily plan Management',
+    examRuleManage: 'Management of examination rules',
 
-	orderAuthorityManage: 'Order&Authority',
-	commodityManage: 'Commodity management',
-	orderManage: 'Order management',
-	authorityManage: 'authority management',
-	authorityTransferManage: 'Privilege distribution management',
-	userRulesManage: 'User Rights Statistics',
-	addCommodity: 'Adding goods',
-	addOrder: 'Adding orders',
-	addCoursePermissions: 'Adding course permissions',
+    orderAuthorityManage: 'Order&Authority',
+    commodityManage: 'Commodity management',
+    orderManage: 'Order management',
+    authorityManage: 'authority management',
+    authorityTransferManage: 'Privilege distribution management',
+    userRulesManage: 'User Rights Statistics',
+    addCommodity: 'Adding goods',
+    addOrder: 'Adding orders',
+    addCoursePermissions: 'Adding course permissions',
 
-	systemManage: 'System',
-	dataDictionary: 'Data dictionary',
-	dataDictionaryDetails: 'Data dictionary details',
-	userManage: 'user management',
-	loginUserManage: 'login user Manage',
-	cacheManage: 'cache management',
-	userTrainingManage: 'User training management',
-	userExamManage: 'User examination management',
-	userSimulationManage: 'User simulation management',
-	existingSimulation: 'Existence simulation management',
-	ibpDraw: 'Ibp Draw',
-	trainingPlatform: 'trainingPlatform',
-	releaseApplication: 'Release application',
-	courseApplication: 'Course release application',
-	scriptReleaseApplication: 'Script release application',
-	runGraphReleaseApplication: 'Run graph release application',
-	subsystemGeneration: 'Subsystem generation',
-	newsBulletin: 'New bulletin',
-	notificationBulletin: 'Systematic notification',
-	commandDictionary: 'Command dictionary',
-	configLine: 'Line management',
-	deviceManage: 'Device management',
-	iscsDraw: 'Iscs Draw',
-	iscsSystem: 'Iscs System',
-	studentManage: 'Student manage',
-	examDetail: 'Exam detail',
-	raceManage: 'Race manage',
-	practiceManage: 'Practice manage',
-	bankManage: 'Bank manage',
-	sceneManage: 'Scene manage',
-	companyManage: 'Company manage',
-	authorApply: 'Grant application',
-	AuthorList: 'Authorization code list',
-	questionsRuleManage: 'Question rule manage',
-	preTheoryData: 'Pre Theory Data',
-	boardManage: 'Message Board Manage',
-	publishIBPManage: 'publish IBP Manage',
-	publishISCSManage: 'publish ISCS Manage',
-	publishTrainingManage: 'publish Training Manage',
-	voiceTraining: 'Voice Training',
-	mapGroup: 'Map Group',
-	drawingMange: 'Drawing Mange',
-	projectServer: 'Project Server',
-	audioResourcesManage: 'Audio Resources Manage',
-	iscsDeviceManage: 'ISCS Device Manage',
-	iscsResourcesManage: 'ISCS Resources Manage',
-	projectManage: 'Project Manage',
-	frontProjectConfigManage: 'Front Project Config Manage',
-}
+    systemManage: 'System',
+    dataDictionary: 'Data dictionary',
+    dataDictionaryDetails: 'Data dictionary details',
+    userManage: 'user management',
+    loginUserManage: 'login user Manage',
+    cacheManage: 'cache management',
+    userTrainingManage: 'User training management',
+    userExamManage: 'User examination management',
+    userSimulationManage: 'User simulation management',
+    existingSimulation: 'Existence simulation management',
+    ibpDraw: 'Ibp Draw',
+    trainingPlatform: 'trainingPlatform',
+    releaseApplication: 'Release application',
+    courseApplication: 'Course release application',
+    scriptReleaseApplication: 'Script release application',
+    runGraphReleaseApplication: 'Run graph release application',
+    subsystemGeneration: 'Subsystem generation',
+    newsBulletin: 'New bulletin',
+    notificationBulletin: 'Systematic notification',
+    commandDictionary: 'Command dictionary',
+    configLine: 'Line management',
+    deviceManage: 'Device management',
+    iscsDraw: 'Iscs Draw',
+    iscsSystem: 'Iscs System',
+    studentManage: 'Student manage',
+    examDetail: 'Exam detail',
+    raceManage: 'Race manage',
+    practiceManage: 'Practice manage',
+    bankManage: 'Bank manage',
+    sceneManage: 'Scene manage',
+    companyManage: 'Company manage',
+    authorApply: 'Grant application',
+    AuthorList: 'Authorization code list',
+    questionsRuleManage: 'Question rule manage',
+    preTheoryData: 'Pre Theory Data',
+    boardManage: 'Message Board Manage',
+    publishIBPManage: 'publish IBP Manage',
+    publishISCSManage: 'publish ISCS Manage',
+    publishTrainingManage: 'publish Training Manage',
+    voiceTraining: 'Voice Training',
+    mapGroup: 'Map Group',
+    drawingMange: 'Drawing Mange',
+    projectServer: 'Project Server',
+    audioResourcesManage: 'Audio Resources Manage',
+    iscsDeviceManage: 'ISCS Device Manage',
+    iscsResourcesManage: 'ISCS Resources Manage',
+    projectManage: 'Project Manage',
+    frontProjectConfigManage: 'Front Project Config Manage',
+    training: 'Training',
+    theory: 'Theory'
+};
diff --git a/src/i18n/langs/zh/router.js b/src/i18n/langs/zh/router.js
index 5ec3d2e6e..17afe3355 100644
--- a/src/i18n/langs/zh/router.js
+++ b/src/i18n/langs/zh/router.js
@@ -1,114 +1,116 @@
 export default {
-	homePage: '首页',
+    homePage: '首页',
 
-	designhomePage: '公共地图',
-	designUserPage: '个人地图',
-	newDesignUserPage: '地图绘制',
-	newDesignEditor: '编辑器',
-	newDesignEditorList: '图文列表',
-	newDesignDraftEditorList: '文章草稿',
-	uploadPdf: 'PDF上传',
-	fileManage: '文件管理',
+    designhomePage: '公共地图',
+    designUserPage: '个人地图',
+    newDesignUserPage: '地图绘制',
+    newDesignEditor: '编辑器',
+    newDesignEditorList: '图文列表',
+    newDesignDraftEditorList: '文章草稿',
+    uploadPdf: 'PDF上传',
+    fileManage: '文件管理',
 
-	mapManage: '地图管理',
-	skinManage: '皮肤管理',
-	mapDraw: '地图绘制',
-	runPlanManage: '运行图管理',
-	productEdit: '产品编辑',
+    mapManage: '地图管理',
+    skinManage: '皮肤管理',
+    mapDraw: '地图绘制',
+    runPlanManage: '运行图管理',
+    productEdit: '产品编辑',
 
-	lessaonManage: '课程管理',
-	trainingRecord: '实训录制',
-	taskManage: '任务管理',
-	trainingRule: '操作定义',
-	trainingManage: '实训管理',
-	lessonEdit: '课程编辑',
-	scriptManage: '剧本管理',
+    lessaonManage: '课程管理',
+    trainingRecord: '实训录制',
+    taskManage: '任务管理',
+    trainingRule: '操作定义',
+    trainingManage: '实训管理',
+    lessonEdit: '课程编辑',
+    scriptManage: '剧本管理',
 
-	teachSystem: '教学系统',
+    teachSystem: '教学系统',
 
-	examSystem: '考试系统',
+    examSystem: '考试系统',
 
-	demonstrationSystem: '仿真系统',
+    demonstrationSystem: '仿真系统',
 
-	dpSystem: '大屏系统',
+    dpSystem: '大屏系统',
 
-	planSystem: '琏计划',
+    planSystem: '琏计划',
 
-	replayManage: '回放管理',
+    replayManage: '回放管理',
 
-	permissionManage: '权限管理',
-	selfPermission: '我的权限',
+    permissionManage: '权限管理',
+    selfPermission: '我的权限',
 
-	pulishManage: '发布内容管理',
-	publishMapManage: '发布地图管理',
-	productStateManage: '产品状态管理',
-	publishLessonManage: '发布课程管理',
-	runPlanTemplateManage: '模板运行图管理',
-	runPlanCommonManage: '加载计划运行图管理',
-	runPlanEveryDayManage: '每日运行图管理',
-	examRuleManage: '试卷规则管理',
+    pulishManage: '发布内容管理',
+    publishMapManage: '发布地图管理',
+    productStateManage: '产品状态管理',
+    publishLessonManage: '发布课程管理',
+    runPlanTemplateManage: '模板运行图管理',
+    runPlanCommonManage: '加载计划运行图管理',
+    runPlanEveryDayManage: '每日运行图管理',
+    examRuleManage: '试卷规则管理',
 
-	orderAuthorityManage: '订单权限管理',
-	commodityManage: '商品管理',
-	orderManage: '订单管理',
-	authorityManage: '权限管理',
-	authorityTransferManage: '权限分发管理',
-	userRulesManage: '用户权限统计',
-	addCommodity: '添加商品',
-	addOrder: '添加订单',
-	addCoursePermissions: '添加课程权限',
+    orderAuthorityManage: '订单权限管理',
+    commodityManage: '商品管理',
+    orderManage: '订单管理',
+    authorityManage: '权限管理',
+    authorityTransferManage: '权限分发管理',
+    userRulesManage: '用户权限统计',
+    addCommodity: '添加商品',
+    addOrder: '添加订单',
+    addCoursePermissions: '添加课程权限',
 
-	systemManage: '系统管理',
-	dataDictionary: '数据字典',
-	dataDictionaryDetails: '数据字典明细',
-	userManage: '用户管理',
-	loginUserManage: '在线用户管理',
-	cacheManage: '缓存管理',
-	userTrainingManage: '用户实训统计',
-	userExamManage: '用户考试统计',
-	userSimulationManage: '用户仿真统计',
-	existingSimulation: '存在仿真管理',
+    systemManage: '系统管理',
+    dataDictionary: '数据字典',
+    dataDictionaryDetails: '数据字典明细',
+    userManage: '用户管理',
+    loginUserManage: '在线用户管理',
+    cacheManage: '缓存管理',
+    userTrainingManage: '用户实训统计',
+    userExamManage: '用户考试统计',
+    userSimulationManage: '用户仿真统计',
+    existingSimulation: '存在仿真管理',
 
-	ibpDraw: 'Ibp盘绘制',
-	trainingPlatform: '实训平台',
-	releaseApplication: '发布申请',
-	courseApplication: '课程发布申请',
-	scriptReleaseApplication: '剧本发布申请',
-	runGraphReleaseApplication: '运行图发布申请',
-	subsystemGeneration: '子系统生成',
-	newsBulletin: '消息公告',
-	notificationBulletin: '系统通知',
-	commandDictionary: '指令字典',
-	configLine: '线路管理',
-	deviceManage: '设备管理',
-	iscsDraw: 'Iscs绘制',
-	iscsSystem: 'Iscs系统',
-	studentManage: '学生管理',
-	competitionManage: '竞赛管理',
-	refereeJManage: '仿真管理',
-	homeJsxt: '首页',
-	examDetail: '考试详情',
-	raceManage: '竞赛管理',
-	recaList: '报名列表',
-	bankManage: '题库列表',
-	practiceManage: '实操列表',
-	sceneManage: '场景列表',
-	companyManage: '组织管理',
-	authorApply: '授权申请',
-	AuthorList: '授权列表',
-	questionsRuleManage: '出题规则管理',
-	preTheoryData: '理论导入预处理',
-	boardManage: '留言板管理',
-	publishIBPManage: '发布IBP盘管理',
-	publishISCSManage: '发布ISCS管理',
-	publishTrainingManage: '发布实训管理',
-	voiceTraining: '语音训练',
-	mapGroup: '地图分组',
-	drawingMange: '图纸管理',
-	projectServer: '项目域名',
-	audioResourcesManage: '音频资源管理',
-	iscsDeviceManage: 'ISCS设备管理',
-	iscsResourcesManage: 'ISCS资源管理',
-	projectManage: '项目管理',
-	frontProjectConfigManage: '前端项目配置管理',
-}
+    ibpDraw: 'Ibp盘绘制',
+    trainingPlatform: '实训平台',
+    releaseApplication: '发布申请',
+    courseApplication: '课程发布申请',
+    scriptReleaseApplication: '剧本发布申请',
+    runGraphReleaseApplication: '运行图发布申请',
+    subsystemGeneration: '子系统生成',
+    newsBulletin: '消息公告',
+    notificationBulletin: '系统通知',
+    commandDictionary: '指令字典',
+    configLine: '线路管理',
+    deviceManage: '设备管理',
+    iscsDraw: 'Iscs绘制',
+    iscsSystem: 'Iscs系统',
+    studentManage: '学生管理',
+    competitionManage: '竞赛管理',
+    refereeJManage: '仿真管理',
+    homeJsxt: '首页',
+    examDetail: '考试详情',
+    raceManage: '竞赛管理',
+    recaList: '报名列表',
+    bankManage: '题库列表',
+    practiceManage: '实操列表',
+    sceneManage: '场景列表',
+    companyManage: '组织管理',
+    authorApply: '授权申请',
+    AuthorList: '授权列表',
+    questionsRuleManage: '出题规则管理',
+    preTheoryData: '理论导入预处理',
+    boardManage: '留言板管理',
+    publishIBPManage: '发布IBP盘管理',
+    publishISCSManage: '发布ISCS管理',
+    publishTrainingManage: '发布实训管理',
+    voiceTraining: '语音训练',
+    mapGroup: '地图分组',
+    drawingMange: '图纸管理',
+    projectServer: '项目域名',
+    audioResourcesManage: '音频资源管理',
+    iscsDeviceManage: 'ISCS设备管理',
+    iscsResourcesManage: 'ISCS资源管理',
+    projectManage: '项目管理',
+    frontProjectConfigManage: '前端项目配置管理',
+    training: '实训',
+    theory: '理论'
+};
diff --git a/src/router/index.js b/src/router/index.js
index e772868a4..f24a40d53 100644
--- a/src/router/index.js
+++ b/src/router/index.js
@@ -231,6 +231,7 @@ const ContestScoreEdit = () => import('@/views/contestDataManage/contestTaskScor
 const ContestList = () => import('@/views/contest/contestList');
 const ContestDetail = () => import('@/views/contest/contestDetail');
 const ScoringSettlement = () => import('@/views/contest/ScoringSettlement');
+const TheoryPage = () => import('@/views/contest/theory');
 
 // import { GenerateRouteProjectList } from '@/scripts/ProjectConfig';
 // import { getSessionStorage } from '@/utils/auth';
@@ -676,28 +677,6 @@ export const publicAsyncRoute = [
         path: '/pis',
         component: PisScreen,
         hidden: true
-    },
-    {
-        path: '/contest',
-        component: Layout,
-        hidden: true,
-        children: [
-            {
-                path: 'list',
-                component: ContestList,
-                hidden: true
-            },
-            {
-                path: 'detail',
-                component: ContestDetail,
-                hidden: true
-            },
-            {
-                path: 'scoringSettlement',
-                component: ScoringSettlement,
-                hidden: true
-            }
-        ]
     }
 ];
 // 城市轨道项目
@@ -2212,6 +2191,54 @@ export const asyncRouter = [
         ]
     }
 ];
+export const dsxlRouter = [
+    {
+        path: '/contest',
+        component: Layout,
+        redirect: '/contest/list',
+        meta: {
+            i18n: 'router.training',
+            roles: [user]
+        },
+        children: [
+            {
+                path: 'list',
+                component: ContestList,
+                meta: {
+                    i18n: 'router.training'
+                }
+            },
+            {
+                path: 'detail',
+                component: ContestDetail,
+                hidden: true
+            },
+            {
+                path: 'scoringSettlement',
+                component: ScoringSettlement,
+                hidden: true
+            }
+        ]
+    },
+    {
+        path: '/theory',
+        component: Layout,
+        redirect: '/theory/list',
+        meta: {
+            i18n: 'router.theory',
+            roles: [user]
+        },
+        children: [
+            {
+                path: 'list',
+                component: TheoryPage,
+                meta: {
+                    i18n: 'router.theory'
+                }
+            }
+        ]
+    }
+];
 const createRouter = () => new Router({
     base: process.env.VUE_APP_PRO == 'local' ? '/' : '/cbtc/',
     mode: 'history', // require service support
diff --git a/src/store/modules/permission.js b/src/store/modules/permission.js
index da3a97803..a1e577e9a 100644
--- a/src/store/modules/permission.js
+++ b/src/store/modules/permission.js
@@ -1,5 +1,5 @@
 // import { loginInfo } from '@/scripts/ProjectConfig';
-import { userTrainingPlatform, admin, publicAsyncRoute, asyncRouter, constantRoutes, superAdmin, user } from '@/router/index';
+import { userTrainingPlatform, admin, publicAsyncRoute, asyncRouter, constantRoutes, superAdmin, user, dsxlRouter } from '@/router/index';
 import { getSessionStorage } from '@/utils/auth';
 import store from '@/store/index';
 
@@ -42,6 +42,8 @@ function resetAsyncRouter() {
     let list = publicAsyncRoute;
     if (getSessionStorage('project') !== 'dsxl') {
         list = [...list, ...asyncRouter];
+    } else {
+        list = [...list, ...dsxlRouter];
     }
     return list;
 }
diff --git a/src/views/contest/theory.vue b/src/views/contest/theory.vue
new file mode 100644
index 000000000..53ffc46eb
--- /dev/null
+++ b/src/views/contest/theory.vue
@@ -0,0 +1,281 @@
+<template>
+  <el-row class="container">
+    <el-col :span="5" class="container-left">
+      <div class="question-container">
+        <div v-for="(id,j) in idList" :key="id" class="question-box" :class="{'select-question':index===j}" @click="handleClick(j)">{{ j+1 }}</div>
+      </div>
+    </el-col>
+    <el-col :span="19" class="container-right">
+      <el-card v-loading="loading" class="box-card">
+        <div slot="header" style="text-align: center">
+          <span style="font-size: 28px;">{{ `第${index +1}题` }}</span>
+        </div>
+        <div class="question-title">[{{ questionData.typeString }}] {{ questionData.title }}</div>
+        <div class="options">
+          <component
+            :is="type === 2 ? 'el-checkbox-group' : 'el-radio-group'"
+            v-model="questionData.answer"
+            class="options-container"
+          >
+            <component
+              :is="type === 2 ? 'el-checkbox' : 'el-radio'"
+              v-for="el in questionData.options"
+              :key="el.value"
+              :disabled="showAnswer"
+              class="option"
+              :label="el.value"
+            >{{ el.label }}</component>
+          </component>
+        </div>
+        <div class="show-answer">
+          <span v-if="showAnswer" :class="isCorrect? 'correct': 'error'">{{ isCorrect ? '回答正确！' : `回答错误，正确答案应为:${tip}` }}</span>
+        </div>
+        <div class="footer">
+          <el-button type="primary" :disabled="index === 0" @click="navigate('-')">上一题</el-button>
+          <el-button type="primary" :disabled="showAnswer" @click="navigate()">确认</el-button>
+          <el-button
+            type="primary"
+            :disabled="index === idList.length - 1"
+            @click="navigate('+')"
+          >下一题</el-button>
+        </div>
+      </el-card>
+    </el-col>
+  </el-row>
+</template>
+
+<script>
+const types = {
+    select: '选择题',
+    judge: '判断题',
+    multi: '多选题'
+};
+import {getQuestionInfo } from '@/api/questionBank';
+import { getTheoryList } from '@/api/contest';
+export default {
+    name: 'Theory',
+    data() {
+        return {
+            loading: false,
+            showAnswer: false,
+            isCorrect: false,
+            questionData: {
+                title: '',
+                typeString: '',
+                options: [],
+                answer: ''
+            },
+            currentAnswer: '',
+            idList: [],
+            id: '',
+            type: 1,
+            index:0,
+            tip: ''
+        };
+    },
+    watch: {
+        id(val) {
+            if (val) {
+                this.getQuestionInfo(val);
+            }
+        }
+    },
+    mounted() {
+        this.getData();
+    },
+    beforeDestroy() {
+    },
+    methods: {
+        getData() {
+            this.loading = true;
+            getTheoryList().then(resp => {
+                this.idList = resp.data;
+                this.id = this.idList[this.index];
+            }).catch(() => {
+                this.$message.error('获取试题列表失败！');
+            });
+        },
+        getQuestionInfo(val) {
+            this.loading = true;
+            this.showAnswer = false;
+            this.isCorrect = false;
+            this.tip = '';
+            getQuestionInfo(val, {random: false}).then(res => {
+                const data = res.data;
+                this.questionData = {
+                    title: data.topic,
+                    typeString: types[data.type],
+                    options: data.optionList.map(opt => ({ label: opt.content, value: opt.id })),
+                    answer: data.type === 'multi' ? [] : NaN
+                };
+                if (data.type === 'multi') {
+                    this.type = 2;
+                } else {
+                    this.type = 1;
+                }
+                this.currentAnswer = data.answer;
+                this.loading = false;
+            }).catch(() => {
+                this.loading = false;
+                this.$message.error('获取试题详情失败！');
+            });
+        },
+        handleClick(j) {
+            this.index = j;
+            this.id = this.idList[this.index];
+        },
+        compareArrays(arr1, arr2) {
+            if (arr1.length !== arr2.length) {
+                return false;
+            }
+
+            for (let i = 0; i < arr1.length; i++) {
+                if (arr1[i] != arr2[i]) {
+                    return false;
+                }
+            }
+            return true;
+        },
+        navigate(direction) {
+            if (direction === '-') {
+                this.index--;
+                this.id = this.idList[this.index];
+            } else if (direction === '+') {
+                this.index++;
+                this.id = this.idList[this.index];
+            } else {
+                if (this.questionData.type === 'multi') {
+                    const an = this.currentAnswer.split(',');
+                    if (this.compareArrays(an, this.questionData.answer)) {
+                        this.isCorrect = false;
+                        this.showAnswer = true;
+                    } else {
+                        this.isCorrect = false;
+                        this.showAnswer = true;
+                        let op = '';
+                        this.questionData.options.forEach(ele => {
+                            const nId = ele.value + '';
+                            if (an.includes(nId)) {
+                                const nContent = op ? ';' + ele.label : ele.label;
+                                op += nContent;
+                            }
+                        });
+                        this.tip = op;
+                    }
+                } else {
+                    if (this.questionData.answer == this.currentAnswer) {
+                        this.isCorrect = true;
+                        this.showAnswer = true;
+                    } else {
+                        this.isCorrect = false;
+                        this.showAnswer = true;
+                        const op = this.questionData.options.find(ele => ele.value == this.currentAnswer);
+                        this.tip = op.label;
+                    }
+                }
+            }
+        }
+    }
+};
+</script>
+
+<style lang="scss" scoped>
+.show-answer {
+	height: 30px;
+	padding: 0 30px;
+	span {
+		font-size: 18px;
+	}
+	.correct {
+		color: green;
+	}
+	.error {
+		color: red;
+	}
+}
+.select-question {
+	border: 2px solid #8f079d !important;
+	color: #8f079d !important;
+	font-weight: bolder;
+}
+.question-container {
+	height: 100%;
+	overflow-y: auto;
+	display: flex;
+	flex-wrap: wrap;
+}
+.question-box {
+	border: 1px solid #fff;
+	margin: 10px;
+	display: inline-block;
+	color: #fff;
+	text-align: center;
+	line-height: 40px;
+	width: 40px;
+	height: 40px;
+	cursor: pointer;
+}
+.question-title {
+	padding: 30px;
+	font-size: 20px;
+}
+/deep/.el-checkbox{
+	color: #fff;
+}
+/deep/.el-radio{
+	color: #fff;
+}
+.options-container {
+	display: flex;
+	flex-direction: column;
+	padding: 30px;
+	font-size: 20px;
+	& > .option {
+		line-height: 2rem;
+		height: 2rem;
+		/deep/.el-radio__label{
+			font-size: 18px;
+		}
+		/deep/.el-checkbox__label{
+			font-size: 18px;
+		}
+
+	}
+}
+.footer {
+	display: flex;
+	justify-content: center;
+}
+.box-card {
+	color: #fff;
+	background-color: transparent;
+	height: 100%;
+	border: 1px solid #01468B;
+}
+.container {
+	background: linear-gradient(to bottom, #01468B, #00172E);
+	height: 100%;
+}
+.container-left{
+	height: 100%;
+	padding-top: 10px;
+}
+.container-right{
+	background: #00172E;
+	border: 1px solid #01468B;
+	height: 100%;
+	padding: 10px;
+}
+.custom-tree-node{
+	color: #fff;
+}
+.button-group {
+	width: 20.9%;
+	text-align: right;
+	padding: 10px;
+	border-top: 1px solid #01468B;
+	position: absolute;
+	bottom: 0;
+}
+
+</style>