From 2599f0e6f387c41e60c1477100f00751368d4fa3 Mon Sep 17 00:00:00 2001
From: yujialong <479214531@qq.com>
Date: Tue, 4 Jul 2023 15:05:53 +0800
Subject: [PATCH] =?UTF-8?q?=E6=B7=BB=E5=8A=A0vscode?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 src/components/TestPanel.vue   | 279 +++++++++++++++++---
 src/components/codemirror.vue  |  12 +-
 src/components/quill/index.vue | 455 +++++++++++++++++----------------
 src/config/index.js            |   4 +-
 src/store/index.js             |  14 +-
 src/styles/common.scss         |  40 +--
 src/views/Home.vue             |  14 +-
 7 files changed, 521 insertions(+), 297 deletions(-)

diff --git a/src/components/TestPanel.vue b/src/components/TestPanel.vue
index 5c64a3f..2e1e940 100644
--- a/src/components/TestPanel.vue
+++ b/src/components/TestPanel.vue
@@ -44,6 +44,8 @@
             </div>
           </div>
           <div>
+            <el-button @click="toggleReport"
+                       v-if="$parent.language && !isSubmit && !competitionId">填写实验报告</el-button>
             <el-button @click="toReport"
                        v-if="isSubmit && !competitionId">查看实验报告</el-button>
             <el-button class="reload"
@@ -56,7 +58,42 @@
           </div>
         </div>
       </el-header>
-      <el-container>
+      <div class="report-wrap"
+           v-if="reportVisible">
+        <i class="el-icon-caret-top close-report"></i>
+        <el-table class="report-table"
+                  :data="taskList"
+                  :max-height="tableHeight">
+          <el-table-column prop="name"
+                           label="判分点"
+                           width="210"
+                           align="center"></el-table-column>
+          <el-table-column prop="score"
+                           label="答案"
+                           align="center">
+            <template slot-scope="scope">
+              <codemirror v-model="scope.row.code"
+                          :options="cmOption"
+                          class="code-mirror"
+                          :ref="'codemirror' + scope.$index"
+                          @ready="ready"></codemirror>
+            </template>
+          </el-table-column>
+          <el-table-column prop="score"
+                           label="运行结果"
+                           align="center">
+            <template slot-scope="scope">
+              <quill class="quill"
+                     :tools="false"
+                     :border="true"
+                     v-model="scope.row.codeResult"
+                     :height="300"
+                     :index="1" />
+            </template>
+          </el-table-column>
+        </el-table>
+      </div>
+      <el-container v-else>
         <el-aside width="30%">
           <div class="aside-header">
             <div :class="['p-title color', 'system' + systemId]">
@@ -78,7 +115,8 @@
                 <el-col :span="24">
                   <el-card shadow="never"
                            :border="false">
-                    <el-table :data="taskList"
+                    <el-table class="task-table"
+                              :data="taskList"
                               :stripe="true">
                       <el-table-column type="index"></el-table-column>
                       <el-table-column prop="name"
@@ -121,7 +159,8 @@
           </div>
         </el-aside>
         <el-main>
-          <el-tabs v-model="pannelTab"
+          <el-tabs class="info-tab"
+                   v-model="pannelTab"
                    type="card">
             <el-tab-pane label="项目背景"
                          name="first">
@@ -145,7 +184,7 @@
               </el-collapse>
             </el-tab-pane>
             <el-tab-pane label="实验提示"
-                         name="fifth"
+                         name="third"
                          v-if="hintOpen">
               <div class="ql-editor"
                    v-html="experimentHint"></div>
@@ -172,12 +211,54 @@
 
 <script>
 import newmain from "../util/newMain";
+import quill from "@/components/quill";
 import util from '@/util'
 import Config from '@/config'
 import Cookie from 'js-cookie'
 import 'quill/dist/quill.core.css';
 import 'quill/dist/quill.snow.css';
 import 'quill/dist/quill.bubble.css';
+
+import { codemirror } from "vue-codemirror";
+import "codemirror/theme/ambiance.css"; // 这里引入的是主题样式
+import "codemirror/mode/javascript/javascript.js";
+import "codemirror/mode/python/python.js";
+import "codemirror/lib/codemirror.css";
+// require active-line.js
+import "codemirror/addon/selection/active-line.js";
+// styleSelectedText
+import "codemirror/addon/selection/mark-selection.js";
+// hint
+import "codemirror/addon/hint/show-hint.js";
+import "codemirror/addon/hint/sql-hint.js";
+import "codemirror/addon/hint/show-hint.css";
+import "codemirror/addon/hint/javascript-hint.js";
+// highlightSelectionMatches
+import "codemirror/addon/scroll/annotatescrollbar.js";
+import "codemirror/addon/search/matchesonscrollbar.js";
+import "codemirror/addon/search/match-highlighter.js";
+// keyMap
+import "codemirror/mode/clike/clike.js";
+import "codemirror/mode/sql/sql.js";
+import "codemirror/addon/edit/matchbrackets.js";
+import "codemirror/addon/comment/comment.js";
+import "codemirror/addon/dialog/dialog.js";
+import "codemirror/addon/dialog/dialog.css";
+import "codemirror/addon/search/searchcursor.js";
+import "codemirror/addon/search/search.js";
+import "codemirror/keymap/sublime.js";
+// foldGutter
+import "codemirror/addon/fold/foldgutter.css";
+import "codemirror/addon/fold/brace-fold.js";
+import "codemirror/addon/fold/comment-fold.js";
+import "codemirror/addon/fold/foldcode.js";
+import "codemirror/addon/fold/foldgutter.js";
+import "codemirror/addon/fold/indent-fold.js";
+import "codemirror/addon/fold/markdown-fold.js";
+import "codemirror/addon/fold/xml-fold.js";
+// 编辑的主题文件
+import "codemirror/theme/monokai.css";
+import "codemirror/theme/base16-light.css";
 export default {
   data () {
     return {
@@ -221,9 +302,43 @@ export default {
       pannelTab: 'first', // 面板信息切换值
       isSelected: false, // 是否选择过项目的标识，选择了会置为true
       statusTimer: null, // 查询考核状态定时器
-      reportId: ''
+      reportId: '',
+
+      cmOption: {
+        scrollbarStyle: "native",
+        tabSize: 2, // tab
+        styleActiveLine: true, // 高亮选中行
+        lineNumbers: true, // 显示行号
+        styleSelectedText: true,
+        line: true,
+        foldGutter: true, // 块槽
+        gutters: ["CodeMirror-linenumbers", "CodeMirror-foldgutter"],
+        highlightSelectionMatches: { showToken: /\w/, annotateScrollbar: true }, // 可以启用该选项来突出显示当前选中的内容的所有实例
+        mode: 'python',
+        lineWrapping: true, //代码折叠
+        autoCloseTags: true,// 自动闭合标签
+        autoCloseBrackets: true,// 自动闭合括号
+        // hint.js options
+        hintOptions: {
+          // 当匹配只有一项的时候是否自动补全
+          completeSingle: false
+        },
+        // 快捷键 可提供三种模式 sublime、emacs、vim
+        keyMap: "sublime",
+        matchBrackets: true,
+        showCursorWhenSelecting: true,
+        // theme: "monokai" // 主题
+      },
+      reportTab: '',
+      reportPoints: [],
+      reportVisible: false,
+      tableHeight: 0
     };
   },
+  components: {
+    codemirror,
+    quill
+  },
   mounted () {
     // 2：竞赛，1：考核，0：练习
     this.projectPermissions = this.assessmentId ?
@@ -256,6 +371,7 @@ export default {
       }
     }
     this.drag()
+    this.tableHeight = window.innerHeight - 360
   },
   methods: {
     // 获取项目列表
@@ -319,6 +435,14 @@ export default {
           this.$parent.getModelStatus(systemId)
           this.curReq = curReq // 实验要求默认全部展开，通过judgmentId来选中item
           this.points = points
+
+          const reportPoints = JSON.parse(JSON.stringify(points))
+          points.forEach(e => {
+            e.codeResult = ''
+          })
+          this.reportPoints = reportPoints
+          if (points.length) this.reportTab = reportPoints[0].judgmentId + ''
+          console.log("🚀 ~ file: TestPanel.vue:423 ~ returnnewPromise ~ this.reportTab:", points, this.reportTab)
           this.taskList = points // 实验任务
           this.judgmentId = points[0].judgmentId // 默认取第一个判分点
           this.experimentTarget = project.experimentTarget
@@ -532,12 +656,24 @@ export default {
       this.countVal = 0
       this.grade = '00'
       this.pannelTab = 'first'
+      this.clearReport()
       this.$emit('recoveryCode') // 切换实训项目后回到第一个判分点
     },
+    // 切换实验报告输入
+    toggleReport () {
+      this.reportVisible = !this.reportVisible
+    },
+    // 清空实验报告填写里的内容
+    clearReport () {
+      this.taskList.forEach(e => {
+        e.code = ''
+        e.codeResult = ''
+      })
+    },
     // 查看实验报告
     toReport () {
       Cookie.set('doneProjectId', this.projectId) // 进入实验报告之前先存储当前项目id,从实验报告返回来后把这个id恢复
-      this.$router.push(`/report?reportId=${this.reportId}`)
+      this.$router.push(`/report?reportId=${this.$store.state.reportId}`)
     },
     //重新开始
     reload () {
@@ -556,31 +692,70 @@ export default {
       this.$emit('tell', this.projectId, this.curSystemId, points)
       this.$emit('recoveryCode')
       this.startCount()
+      this.clearReport()
+    },
+    // 页面加载完后重置编辑框大小
+    ready () {
+      for (let i = 0; i < this.points.length; i++) {
+        const code = this.$refs['codemirror' + i][0].codemirror
+        console.log('ready', code)
+
+        // code && code.setSize('auto', 'calc(100vh - 150px)')
+        code && code.setSize('auto', '300px')
+      }
     },
     // 提交询问
     confirmSubmit () {
+      const isVscode = this.$parent.language // 是否选择了vscode
+      const { taskList } = this
       const pointList = this.$parent.workbench
       let msg = '此操作将视为结束考试，是否继续？'
-      if (pointList.find(e => !e.codeId && e.code)) msg = '有代码没有运行，该代码将不得分，确定提交？'
+      if (!isVscode && pointList.find(e => !e.codeId && e.code)) msg = '有代码没有运行，该代码将不得分，确定提交？'
+      if (isVscode && !taskList.find(e => e.code || e.codeResult)) msg = '实验报告未填写，实验成绩为零，是否确认提交？'
       this.$confirm(msg, '提示', {
         confirmButtonText: '确定',
         cancelButtonText: '取消',
         type: 'warning',
         center: true
       }).then(() => {
-        // 如果全部都没运行直接点提交，则主动运行一个空代码。（不然会造成上次运行的结果，这次进来不运行直接提交的话，会无法取到运行结果）
-        if (!pointList.find(e => e.codeId)) {
-          this.$post(this.api.runPythonCode, {
-            code: '',
-            bcId: pointList[0].judgmentId,
-            cid: this.courseId,
-            projectId: this.projectId
-          }).then(({ codeId }) => {
-            this.$parent.workbench[0].codeId = codeId
+        // vscode类型的产品提交前需要自动运行每个判分点的代码以获取codeId
+        if (isVscode) {
+          const promises = []
+          taskList.map(async (e, i) => {
+            (e.code || e.codeResult) && promises.push(new Promise(async (resolve, reject) => {
+              const { code, codeId } = await this.$post(this.api.runPythonCode, {
+                code: e.code,
+                bcId: e.judgmentId,
+                cid: this.courseId,
+                projectId: this.projectId,
+                userAnswer: e.codeResult || null,
+                type: 1
+              })
+              this.$parent.workbench[i].codeId = codeId
+              this.$parent.workbench[i].answer = e.codeResult
+              this.$parent.workbench[i].retResult = 1
+              resolve()
+            }))
+          })
+          Promise.all(promises).then(_ => {
             this.submit()
-          }).catch(err => { })
+          })
         } else {
-          this.submit()
+          // 如果全部都没运行直接点提交，则主动运行一个空代码。（不然会造成上次运行的结果，这次进来不运行直接提交的话，会无法取到运行结果）
+          if (!pointList.find(e => e.codeId)) {
+            this.$post(this.api.runPythonCode, {
+              code: '',
+              bcId: pointList[0].judgmentId,
+              cid: this.courseId,
+              projectId: this.projectId,
+              type: 0
+            }).then(({ codeId }) => {
+              this.$parent.workbench[0].codeId = codeId
+              this.submit()
+            }).catch(err => { })
+          } else {
+            this.submit()
+          }
         }
       }).catch(() => { })
     },
@@ -632,6 +807,7 @@ export default {
         localStorage.removeItem('codeCache')
         this.setSubmit(true)
         clearInterval(this.statusTimer)
+        this.reportVisible = false
         let list = retInfo
         let taskList = this.taskList
         let score = 0
@@ -648,6 +824,7 @@ export default {
         })
         this.grade = util.handleZero(score) // 前置加0(竞赛不显示分数)
         this.reportId = reportId
+        this.$store.commit('setReportId', reportId)
         this.editReport(reportId)
         // 如果是竞赛，并且勾选了公布成绩详情的选项，则弹框提示
         this.competitionId && this.resultsDetails == 0 && this.$alert('提交成功，成绩将在' + this.resultAnnouncementTime + '小时后发布，请去参赛信息模块查看', '提示', {
@@ -743,6 +920,7 @@ export default {
       let gap = 10 // 缝隙：小于缝隙时，则吸附
       let parent = document.body
       document.querySelector('#header').onmousedown = e => {
+        console.log("🚀 ~ file: TestPanel.vue:746 ~ document.querySelector ~ e:", e)
         var x = e.clientX - el.offsetLeft
         var y = e.clientY - el.offsetTop
         var left = 0
@@ -840,11 +1018,6 @@ export default {
 /deep/.el-collapse-item__header {
   border-bottom: none;
 }
-/deep/.el-tabs__content {
-  margin: 0 20px;
-  max-height: calc(60vh - 70px);
-  overflow: auto;
-}
 /deep/.el-icon-s-ticket:before {
   padding: 5px;
   font-size: 16px;
@@ -852,28 +1025,33 @@ export default {
 /deep/.el-collapse-item__arrow {
   margin: 0 5px 0 0;
 }
-/deep/.el-tabs__item {
-  font-size: 16px;
-}
-/deep/.el-tabs--card > .el-tabs__header .el-tabs__nav {
-  border: none;
-}
-/deep/.el-tabs--card > .el-tabs__header .el-tabs__item {
-  border-left: none;
-}
-/deep/.el-tabs--card > .el-tabs__header {
-  border-bottom: none;
+/deep/.info-tab.el-tabs--card {
+  .el-tabs__item {
+    font-size: 16px;
+  }
+  .el-tabs__item.is-active {
+    color: #fff;
+  }
+  .el-tabs__header .el-tabs__nav {
+    border: none;
+  }
+  .el-tabs__header .el-tabs__item {
+    border-left: none;
+  }
+  .el-tabs__header {
+    padding: 5px 20px;
+    border-bottom: none;
+  }
+  & > .el-tabs__content {
+    margin: 0 20px;
+    max-height: calc(60vh - 70px);
+    overflow: auto;
+  }
 }
 /deep/.el-collapse {
   border-bottom: none;
   border-top: none;
 }
-/deep/.el-tabs__item.is-active {
-  color: #fff;
-}
-/deep/.el-tabs__header {
-  padding: 5px 20px;
-}
 .el-aside {
   margin-bottom: 10px;
   color: #333;
@@ -924,7 +1102,7 @@ export default {
 /deep/.el-card__body {
   padding: 0;
 }
-/deep/.el-table {
+/deep/.task-table {
   font-size: 12px;
   thead {
     color: #fff;
@@ -975,6 +1153,7 @@ export default {
   }
 }
 .panel {
+  z-index: 1000;
   position: relative;
   top: 200px;
   bottom: 20px;
@@ -1020,4 +1199,22 @@ export default {
     opacity: 0.9;
   }
 }
+/deep/.report-table.el-table {
+  th {
+    background-color: #c6daff !important;
+  }
+}
+.report-wrap {
+  position: relative;
+  padding-top: 5px;
+}
+.close-report {
+  z-index: 2;
+  position: absolute;
+  top: -21px;
+  right: 296px;
+  font-size: 32px;
+  color: #c6daff;
+  cursor: pointer;
+}
 </style>
\ No newline at end of file
diff --git a/src/components/codemirror.vue b/src/components/codemirror.vue
index 574fb8c..23a1e4a 100644
--- a/src/components/codemirror.vue
+++ b/src/components/codemirror.vue
@@ -397,7 +397,8 @@ export default {
           code: this.sourceCode,
           bcId: this.judgmentId,
           cid: this.courseId,
-          projectId: this.projectId
+          projectId: this.projectId,
+          type: 0
         }, {
           headers: {
             token: this.token
@@ -465,7 +466,8 @@ export default {
               code,
               bcId,
               cid,
-              projectId
+              projectId,
+              type: 0
             }).then(res => {
               const data = res.code
               const result = data.runResult
@@ -501,7 +503,8 @@ export default {
               code,
               bcId,
               cid,
-              projectId
+              projectId,
+              type: 0
             }).then(res => {
               const data = res.code
               const photo = data.photoUrl
@@ -608,9 +611,6 @@ export default {
 <style lang="scss" scoped>
 .code-wrap {
   position: relative;
-  .code-mirror {
-    line-height: 30px;
-  }
 }
 .left {
   position: relative;
diff --git a/src/components/quill/index.vue b/src/components/quill/index.vue
index c096b55..855117b 100644
--- a/src/components/quill/index.vue
+++ b/src/components/quill/index.vue
@@ -1,17 +1,20 @@
 <template>
-    <div class="quill" ref="quill" :class="classes">
-        <div ref="editor" :style="styles" v-loading="loading"></div>
+  <div class="quill"
+       ref="quill"
+       :class="classes">
+    <div ref="editor"
+         :style="styles"
+         v-loading="loading"></div>
 
-        <el-upload
-            :headers="headers"
-            :action="this.api.fileuploadOss"
-            :before-upload="beforeUpload"
-            :on-success="editorUploadSuccess"
-            style="display: none"
-        >
-            <el-button :id="'editorUpload' + index" type="primary">点击上传</el-button>
-        </el-upload>
-    </div>
+    <el-upload :headers="headers"
+               :action="this.api.fileuploadOss"
+               :before-upload="beforeUpload"
+               :on-success="editorUploadSuccess"
+               style="display: none">
+      <el-button :id="'editorUpload' + index"
+                 type="primary">点击上传</el-button>
+    </el-upload>
+  </div>
 </template>
 
 <script>
@@ -22,236 +25,244 @@ import "quill/dist/quill.bubble.css";
 import toolbarOptions from "./options";
 import Cookie from 'js-cookie'
 export default {
-    name: "quill",
-    props: {
-        value: {
-            type: String,
-            default: ""
-        },
-        readonly: {
-            type: Boolean,
-            default: false
-        },
-        toTop: {
-            type: Boolean,
-            default: true
-        },
-        border: {
-            type: Boolean,
-            default: false
-        },
-        height: {
-            type: Number
-        },
-        minHeight: {
-            type: Number
-        },
-        /*
-         * 原本的readOnly失效,对比其他项目，发现是quill版本不同导致，
-         * 使用props传入elseRead = 'true'，手动隐藏工具栏
-         */
-        elseRead: {
-            type: String, default: "false"
-        },
-        // 当前富文本的索引。一个页面引入多个富文本的时候会无法获取到对应的实例，所以通过在父级存储实例的方式来保存
-        index: {
-            type: Number,
-            default: 0
-        },
+  name: "quill",
+  props: {
+    value: {
+      type: String,
+      default: ""
     },
-    data() {
-        const that = this
-        return {
-            headers: {
-                token: Cookie.get('admin-token')
-            },
-            Quill: null,
-            currentValue: "",
-            options: {
-                theme: "snow",
-                bounds: document.body,
-                debug: "warn",
-                modules: {
-                    toolbar: {
-                        container: toolbarOptions,
-                        handlers: {
-                            "image": function(value) {
-                                if (value) {
-                                    // 调用iview图片上传
-                                    document.querySelector("#editorUpload" + that.index).click();
-                                } else {
-                                    this.Quill.format("image", false);
-                                }
-                            }
-                        }
-                    }
-                },
-                placeholder: "",
-                readOnly: this.readonly
-            },
-            loading: false
-        };
+    readonly: {
+      type: Boolean,
+      default: false
     },
-    computed: {
-        classes() {
-            return [
-                {
-                    "quill-no-border": !this.border
-                }
-            ];
-        },
-        styles() {
-            let style = {};
-            if (this.minHeight) {
-                style.minHeight = `${this.minHeight}px`;
-            }
-            if (this.height) {
-                style.height = `${this.height}px`;
-            }
-            return style;
-        }
-
+    toTop: {
+      type: Boolean,
+      default: true
     },
-    watch: {
-        value: {
-            handler(val) {
-                if (val !== this.currentValue) {
-                    this.currentValue = val;
-                    if (this.Quill) {
-                        this.Quill.pasteHTML(this.value);
-                    }
-                }
-            },
-            immediate: true
-        }
+    border: {
+      type: Boolean,
+      default: false
     },
-    mounted() {
-        this.init();
-        // 处理工具栏隐藏样式
-        if (this.elseRead === "true") {
-            let children = this.$refs.quill.children[0].style;
-            children.padding = "0";
-            children.overflow = "hidden";
-            children.height = "0";
-            children.borderTop = "0";
-        }
+    height: {
+      type: Number
     },
-    beforeDestroy() {
-        // 在组件销毁后销毁实例
-        this.Quill = null;
+    minHeight: {
+      type: Number
     },
-    methods: {
-        init () {
-            const editor = this.$refs.editor;
-            // 初始化编辑器
-            this.Quill = new Quill(editor, this.options);
-            const ins = this.Quill
-            // 默认值
-            ins.pasteHTML(this.currentValue);
-            if(this.toTop){
-                this.$nextTick(() => {
-                    window.scrollTo(0,0)
-                })
-            }
-            // 绑定事件
-            ins.on('text-change', (delta, oldDelta, source) => {
-                const html = this.$refs.editor.children[0].innerHTML;
-                const text = ins.getText();
-                const quill = this.Quill;
-                // 更新内部的值
-                this.currentValue = html;
-                // 发出事件 v-model
-                this.$emit('input', html);
-                // 发出事件
-                this.$emit('on-change', { html, text, quill });
-            });
-            // 将一些 quill 自带的事件传递出去
-            ins.on('text-change', (delta, oldDelta, source) => {
-                this.$emit('on-text-change', delta, oldDelta, source);
-            });
-            ins.on('selection-change', (range, oldRange, source) => {
-                this.$emit('on-selection-change', range, oldRange, source);
-            });
-            ins.on('editor-change', (eventName, ...args) => {
-                this.$emit('on-editor-change', eventName, ...args);
-            });
-            // 监听粘贴事件
-            ins.root.addEventListener('paste', evt => {
-                if (evt.clipboardData && evt.clipboardData.files && evt.clipboardData.files.length) {
-                    evt.preventDefault();
-                    // 检测是否粘贴的是图片
-                    [].forEach.call(evt.clipboardData.files, file => {
-                        if (!file.type.match(/^image\/(gif|jpe?g|a?png|bmp)/i)) {
-                            return
-                        }
-                        const param = new FormData()
-                        param.append('file', file)
-                        // 把图片上传到服务器，不然会直接把base64存到数据库
-                        this.$post(this.api.fileupload, param, {
-                            headers: { "Content-Type": "multipart/form-data" }
-                        }).then(res => {
-                            var range = ins.getSelection()
-                            if (range) {
-                                //  在当前光标位置插入图片
-                                ins.insertEmbed(range.index, 'image', res.data.filesResult.fileUrl)
-                                //  将光标移动到图片后面
-                                ins.setSelection(range.index + 1)
-                            }
-                        }).catch(res => {})
-                    });
+    /*
+     * 原本的readOnly失效,对比其他项目，发现是quill版本不同导致，
+     * 使用props传入elseRead = 'true'，手动隐藏工具栏
+     */
+    elseRead: {
+      type: String, default: "false"
+    },
+    // 当前富文本的索引。一个页面引入多个富文本的时候会无法获取到对应的实例，所以通过在父级存储实例的方式来保存
+    index: {
+      type: Number,
+      default: 0
+    },
+    // 显示工具
+    tools: {
+      type: Boolean,
+      default: true
+    },
+  },
+  data () {
+    const that = this
+    return {
+      headers: {
+        token: Cookie.get('admin-token')
+      },
+      Quill: null,
+      currentValue: "",
+      options: {
+        theme: "snow",
+        bounds: document.body,
+        debug: "warn",
+        modules: {
+          toolbar: {
+            container: toolbarOptions,
+            handlers: {
+              "image": function (value) {
+                if (value) {
+                  // 调用iview图片上传
+                  document.querySelector("#editorUpload" + that.index).click();
+                } else {
+                  this.Quill.format("image", false);
                 }
-            }, false)
-        },
-        beforeUpload(file) {
-            this.loading = true;
+              }
+            }
+          }
         },
-        editorUploadSuccess(res) {
-            // 获取富文本组件实例
-            let quill = this.Quill;
-            // 如果上传成功
-            if (res.data.filesResult.fileUrl) {
-                // 获取光标所在位置
-                let length = quill.getSelection().index;
-                // 插入图片，res为服务器返回的图片链接地址
-                quill.insertEmbed(length, "image", res.data.filesResult.fileUrl);
-                // 调整光标到最后
-                quill.setSelection(length + 1);
-            } else {
-                this.$message.error('图片插入失败')
+        placeholder: "",
+        readOnly: this.readonly
+      },
+      loading: false
+    };
+  },
+  computed: {
+    classes () {
+      return [
+        {
+          "quill-no-border": !this.border,
+          'bd': !this.tools
+        }
+      ];
+    },
+    styles () {
+      let style = {};
+      if (this.minHeight) {
+        style.minHeight = `${this.minHeight}px`;
+      }
+      if (this.height) {
+        style.height = `${this.height}px`;
+      }
+      return style;
+    }
+
+  },
+  watch: {
+    value: {
+      handler (val) {
+        if (val !== this.currentValue) {
+          this.currentValue = val;
+          if (this.Quill) {
+            this.Quill.pasteHTML(this.value);
+          }
+        }
+      },
+      immediate: true
+    }
+  },
+  mounted () {
+    this.init();
+    // 处理工具栏隐藏样式
+    if (this.elseRead === "true") {
+      let children = this.$refs.quill.children[0].style;
+      children.padding = "0";
+      children.overflow = "hidden";
+      children.height = "0";
+      children.borderTop = "0";
+    }
+  },
+  beforeDestroy () {
+    // 在组件销毁后销毁实例
+    this.Quill = null;
+  },
+  methods: {
+    init () {
+      const editor = this.$refs.editor;
+      // 初始化编辑器
+      this.Quill = new Quill(editor, this.tools ? this.options : []);
+      const ins = this.Quill
+      // 默认值
+      ins.pasteHTML(this.currentValue);
+      if (this.toTop) {
+        this.$nextTick(() => {
+          window.scrollTo(0, 0)
+        })
+      }
+      // 绑定事件
+      ins.on('text-change', (delta, oldDelta, source) => {
+        const html = this.$refs.editor.children[0].innerHTML;
+        const text = ins.getText();
+        const quill = this.Quill;
+        // 更新内部的值
+        this.currentValue = html;
+        // 发出事件 v-model
+        this.$emit('input', html);
+        // 发出事件
+        this.$emit('on-change', { html, text, quill });
+      });
+      // 将一些 quill 自带的事件传递出去
+      ins.on('text-change', (delta, oldDelta, source) => {
+        this.$emit('on-text-change', delta, oldDelta, source);
+      });
+      ins.on('selection-change', (range, oldRange, source) => {
+        this.$emit('on-selection-change', range, oldRange, source);
+      });
+      ins.on('editor-change', (eventName, ...args) => {
+        this.$emit('on-editor-change', eventName, ...args);
+      });
+      // 监听粘贴事件
+      ins.root.addEventListener('paste', evt => {
+        if (evt.clipboardData && evt.clipboardData.files && evt.clipboardData.files.length) {
+          evt.preventDefault();
+          // 检测是否粘贴的是图片
+          [].forEach.call(evt.clipboardData.files, file => {
+            if (!file.type.match(/^image\/(gif|jpe?g|a?png|bmp)/i)) {
+              return
             }
-            this.loading = false;
+            const param = new FormData()
+            param.append('file', file)
+            // 把图片上传到服务器，不然会直接把base64存到数据库
+            this.$post(this.api.fileuploadOss, param, {
+              headers: { "Content-Type": "multipart/form-data" }
+            }).then(res => {
+              var range = ins.getSelection()
+              if (range) {
+                //  在当前光标位置插入图片
+                ins.insertEmbed(range.index, 'image', res.data.filesResult.fileUrl)
+                //  将光标移动到图片后面
+                ins.setSelection(range.index + 1)
+              }
+            }).catch(res => { })
+          });
         }
+      }, false)
+    },
+    beforeUpload (file) {
+      this.loading = true;
+    },
+    editorUploadSuccess (res) {
+      // 获取富文本组件实例
+      let quill = this.Quill;
+      // 如果上传成功
+      if (res.data.filesResult.fileUrl) {
+        // 获取光标所在位置
+        let length = quill.getSelection().index;
+        // 插入图片，res为服务器返回的图片链接地址
+        quill.insertEmbed(length, "image", res.data.filesResult.fileUrl);
+        // 调整光标到最后
+        quill.setSelection(length + 1);
+      } else {
+        this.$message.error('图片插入失败')
+      }
+      this.loading = false;
     }
+  }
 };
 </script>
 <style lang="scss" scoped>
 .quill-no-border {
-    .ql-toolbar.ql-snow {
-        border: none;
-        border-bottom: 1px solid #e8eaec;
-    }
+  .ql-toolbar.ql-snow {
+    border: none;
+    border-bottom: 1px solid #e8eaec;
+  }
 
-    .ql-container.ql-snow {
-        border: none;
-    }
+  .ql-container.ql-snow {
+    border: none;
+  }
+}
+.bd {
+  border: 1px solid #ebeef5;
 }
 
 .else {
-    .ql-toolbar.ql-snow {
-        height: 0;
-        overflow: hidden;
-        padding: 0;
-        border-top: 0;
-    }
+  .ql-toolbar.ql-snow {
+    height: 0;
+    overflow: hidden;
+    padding: 0;
+    border-top: 0;
+  }
 }
 /deep/.ql-snow {
-    position: relative;
-    .ql-tooltip {
-        position: absolute !important;
-        top: 10px !important;
-        left: 10px !important;
-        transform: translateY(10px);
-    }
+  position: relative;
+  .ql-tooltip {
+    position: absolute !important;
+    top: 10px !important;
+    left: 10px !important;
+    transform: translateY(10px);
+  }
 }
-
 </style>
diff --git a/src/config/index.js b/src/config/index.js
index ba0bfdc..af087bf 100644
--- a/src/config/index.js
+++ b/src/config/index.js
@@ -10,9 +10,9 @@ let host = location.origin + '/'
 let bankPath = `${location.origin}/banksystem` // 银行系统
 // 121.37.12.51 | 192.168.31.151
 if (isDev) {
-  host = 'http://192.168.31.152:9000/'
+  // host = 'http://192.168.31.152:9000/'
   // host = 'http://192.168.31.53:9000/'
-  // host = 'http://121.37.12.51:9000/'
+  host = 'http://121.37.12.51:9000/'
   // host = 'https://occupationlab.com/'
   bankPath = `http://${location.hostname}:8093`
 } else if (isPro) {
diff --git a/src/store/index.js b/src/store/index.js
index 8ddd250..ea9df33 100644
--- a/src/store/index.js
+++ b/src/store/index.js
@@ -2,7 +2,17 @@ import Vue from 'vue';
 import Vuex from 'vuex';
 Vue.use(Vuex);
 const store = new Vuex.Store({
-  state: {},
-  mutations: {}
+  state: {
+		language: 0,
+		reportId: ''
+	},
+  mutations: {
+		setLanguage: (state, id) => {
+			state.language = id
+		},
+		setReportId: (state, id) => {
+			state.reportId = id
+		},
+	}
 });
 export default store;
\ No newline at end of file
diff --git a/src/styles/common.scss b/src/styles/common.scss
index d5cadad..facf3f7 100644
--- a/src/styles/common.scss
+++ b/src/styles/common.scss
@@ -1,7 +1,7 @@
 .flex {
   display: flex;
 }
-.break-all{
+.break-all {
   word-break: break-all;
 }
 .c-p {
@@ -35,29 +35,30 @@ input::-ms-input-placeholder {
 }
 body .cus-table.el-table {
   border-radius: 4px;
-  th{
-    background-color: #E8F0FF !important;
-    .cell{
+  th {
+    background-color: #e8f0ff !important;
+    .cell {
       color: #222326;
       font-weight: normal;
-      .el-checkbox{
-        &:before{
+      .el-checkbox {
+        &:before {
           opacity: 1;
         }
       }
     }
   }
-  th, td{
+  th,
+  td {
     padding: 10px 0;
-    border-bottom-color: #E1E6F2;
+    border-bottom-color: #e1e6f2;
     .cell {
       font-size: 12px;
     }
   }
-  &.el-table--striped .el-table__body tr.el-table__row--striped td{
-    background-color: #FAFBFF !important;
+  &.el-table--striped .el-table__body tr.el-table__row--striped td {
+    background-color: #fafbff !important;
   }
-  .el-button--text{
+  .el-button--text {
     padding: 0;
   }
 }
@@ -74,7 +75,10 @@ body .cus-table.el-table {
 .pagination {
   margin: 20px 0;
   text-align: center;
-  button,.number,.more,.el-input__inner{
+  button,
+  .number,
+  .more,
+  .el-input__inner {
     min-width: 32px !important;
     height: 32px !important;
     line-height: 32px;
@@ -83,11 +87,15 @@ body .cus-table.el-table {
     border: 1px solid #ccc !important;
     border-radius: 2px !important;
   }
-  button i{
+  button i {
     color: #333;
   }
-  .active{
+  .active {
     color: #fff !important;
-    background-color: #007eff!important;
+    background-color: #007eff !important;
   }
-}
\ No newline at end of file
+}
+.code-mirror {
+  text-align: left;
+  line-height: 30px;
+}
diff --git a/src/views/Home.vue b/src/views/Home.vue
index a01d5d1..dff7d9d 100644
--- a/src/views/Home.vue
+++ b/src/views/Home.vue
@@ -60,14 +60,9 @@
                       :retResult.sync="item.retResult"
                       :modelIsShow.sync="modelIsShow"
                       @cache="leavePage"></codemirror>
-          <!-- <img v-else
-               src="@/assets/images/vscode.png"
-               alt=""
-               width="100%"
-               height="700"> -->
           <iframe v-else
                   class="vscode"
-                  src="https://vscode.occupationlab.com/"
+                  :src="Config.isPro ? 'https://vscode.occupationlab.com/' : 'http://121.37.12.51:8088/?folder=/home/coder'"
                   frameborder="0"
                   width="100%"></iframe>
         </el-tab-pane>
@@ -88,9 +83,11 @@ import testPanel from "../components/TestPanel";
 import codemirror from "../components/codemirror";
 import Cookie from 'js-cookie'
 import { Loading } from 'element-ui'
+import Config from '@/config'
 export default {
   data () {
     return {
+      Config,
       loaded: false, // 页面是否加载完的标识，页面默认隐藏，一进来先显示加载条，接口加载完后再显示页面，不然一开始会一闪而过没有样式的页面
       loadIns: null, // loading实例
       competitionId: Cookie.get('admin-competitionId'),
@@ -99,6 +96,7 @@ export default {
       curriculumName: Cookie.get('admin-curriculumName') ? unescape(Cookie.get('admin-curriculumName')) : 'python', // 课程名称
       assessmentId: Cookie.get('admin-assessmentId'), // 考核id
       mallId: Cookie.get('admin-mallId'),
+      language: +Cookie.get('admin-language') || 0, // 编程语言
       projectId: '',
       systemId: '',
       modelIsShow: false, // 导入模型按钮是否显示
@@ -113,7 +111,6 @@ export default {
           name: 'Vscode'
         },
       ],
-      language: 0, // 编程语言
       curTab: '', // 选中后绑定的对象
       workbench: [], // 判分点切换列表
       codeKey: 1 // 编辑器索引
@@ -174,7 +171,8 @@ export default {
     },
     // 编程语言选择回调
     languageChange (id) {
-
+      Cookie.set('admin-language', id)
+      this.$refs.mainindex.reportVisible = false
     },
     // 跳转我的数据
     toData () {