yujialong 6 months ago
parent ac88afa39b
commit 05fd504802
  1. 7
      src/components/TestPanel.vue
  2. 318
      src/components/codemirror.vue
  3. 4
      src/config/index.js

@ -635,9 +635,8 @@ export default {
this.isSelected = true
await this.getEntryTime()
this.countVal = this.entryTime
this.getProDetail().then(() => {
await this.getProDetail()
this.getCache()
}).catch(res => { })
this.setSubmit(false)
this.grade = '00'
this.pannelTab = 'first'
@ -1209,6 +1208,10 @@ export default {
border-radius: 6px;
}
.actions {
z-index: 1001;
}
.submit {
width: 106px;
font-size: 16px;

@ -1,37 +1,18 @@
<template>
<div class="code-wrap flex">
<div class="left">
<codemirror v-model="codeVal"
:options="cmOption"
class="code-mirror"
@ready="ready"
ref="codemirror"></codemirror>
<div v-if="isSubmit"
class="code-mask"></div>
<codemirror v-model="codeVal" :options="cmOption" class="code-mirror" @ready="ready" ref="codemirror">
</codemirror>
<div v-if="isSubmit" class="code-mask"></div>
<div class="btns">
<template v-if="!pid">
<span class="el-icon-delete del"
@click="clearCode"></span>
<el-button v-if="isPrac"
class="btn"
type="danger"
@click="myCode">我的代码</el-button>
<el-button v-if="modelIsShow"
class="btn"
type="warning"
@click="importModel">导入模型</el-button>
<el-button class="run btn"
type="primary"
@click="runCode(false)"
:disabled="runEnable">运行</el-button>
<span class="el-icon-delete del" @click="clearCode"></span>
<el-button v-if="isPrac" class="btn" type="danger" @click="myCode">我的代码</el-button>
<el-button v-if="modelIsShow" class="btn" type="warning" @click="importModel">导入模型</el-button>
<el-button class="run btn" type="primary" @click="runCode(false)" :disabled="runEnable">运行</el-button>
</template>
<el-popconfirm v-else
title="确定终止运行本次代码?"
@confirm="stopRunCode">
<el-button slot="reference"
class="run"
type="danger"
:disabled="runEnable">终止运行</el-button>
<el-popconfirm v-else title="确定终止运行本次代码?" @confirm="stopRunCode">
<el-button slot="reference" class="run" type="danger" :disabled="runEnable">终止运行</el-button>
</el-popconfirm>
</div>
@ -39,50 +20,28 @@
<div class="line"></div>
<div class="code-right answer">
<p :class="['text-wrapper', 'pic-num' + picSrcList.length]">{{ runResult }}</p>
<div :class="['pic-wrap', {wrong: isError === 0}]"
v-if="picSrcList.length">
<div class="pic-item"
v-for="(img, i) in picSrcList"
:key="i">
<div :class="['pic-wrap', { wrong: isError === 0 }]" v-if="picSrcList.length">
<div class="pic-item" v-for="(img, i) in picSrcList" :key="i">
<div class="pic-inner">
<el-image class="pic"
:src="img"
:preview-src-list="picSrcList">
<el-image class="pic" :src="img" :preview-src-list="picSrcList">
</el-image>
</div>
<el-button class="download-btn btn"
type="primary"
size="mini"
@click="downloadPic(i)">下载图片</el-button>
<a :ref="'picLink' + i"
style="display: none;"
download="运行结果.png"
:href="img">下载图片</a>
<el-button class="download-btn btn" type="primary" size="mini" @click="downloadPic(i)">下载图片</el-button>
<a :ref="'picLink' + i" style="display: none;" download="运行结果.png" :href="img">下载图片</a>
</div>
</div>
<div class="result-right t-color"
v-show="isError">
<img :src="require(`@/assets/images/system/${$themeId}/yes.png`)"
alt />运行成功
<el-button class="tips-btn"
@click="exportResult">导出结果</el-button>
<div class="result-right t-color" v-show="isError">
<img :src="require(`@/assets/images/system/${$themeId}/yes.png`)" alt />运行成功
<el-button class="tips-btn" @click="exportResult">导出结果</el-button>
</div>
<div class="result-wrong"
v-show="isError === 0">
<img src="@/assets/images/error.png"
alt />
{{errLine}}行出现错误
<el-button class="tips-btn"
@click="getTips"
v-show="isPrac">提示</el-button>
<el-dialog title="答案提示"
center
:close-on-click-modal="false"
:visible.sync="tipsVisible">
<div class="result-wrong" v-show="isError === 0">
<img src="@/assets/images/error.png" alt />
{{ errLine }}行出现错误
<el-button class="tips-btn" @click="getTips" v-show="isPrac">提示</el-button>
<el-dialog title="答案提示" center :close-on-click-modal="false" :visible.sync="tipsVisible">
<el-tabs>
<el-tab-pane label="参考答案">
<div :class="['answer-wrap', {client: !fromManager}]"
v-html="correctAnswer"></div>
<div :class="['answer-wrap', { client: !fromManager }]" v-html="correctAnswer"></div>
</el-tab-pane>
</el-tabs>
</el-dialog>
@ -90,18 +49,10 @@
</div>
<!-- 导入模型 -->
<el-dialog title="请选择要导入的模型"
:visible.sync="modelVisible"
width="400px"
:close-on-click-modal="false"
<el-dialog title="请选择要导入的模型" :visible.sync="modelVisible" width="400px" :close-on-click-modal="false"
custom-class="model-dia">
<el-select class="w-100"
v-model="modelType"
size="mini">
<el-option v-for="item in modelOp"
:key="item.id"
:label="item.name"
:value="item.id">
<el-select class="w-100" v-model="modelType" size="mini">
<el-option v-for="item in modelOp" :key="item.id" :label="item.name" :value="item.id">
</el-option>
</el-select>
<!-- <el-radio-group v-model="modelType"
@ -115,161 +66,80 @@
</el-radio-group> -->
<!-- <el-divider></el-divider> -->
<div class="model-wrap">
<el-tree v-if="!modelType"
:data="schoolModel"
ref="tree"
default-expand-all
@check-change="treeCheckChange"
show-checkbox
:check-strictly="true"
node-key="id"
:props="{children: 'children', label: 'categoryName', isLeaf: 'leaf'}"
v-loading="modelLoading">
<el-tree v-if="!modelType" :data="schoolModel" ref="tree" default-expand-all @check-change="treeCheckChange"
show-checkbox :check-strictly="true" node-key="id"
:props="{ children: 'children', label: 'categoryName', isLeaf: 'leaf' }" v-loading="modelLoading">
</el-tree>
<el-tree v-if="modelType"
:data="systemModel"
ref="tree"
default-expand-all
@check-change="treeCheckChange"
show-checkbox
:check-strictly="true"
node-key="id"
:props="{children: 'children', label: 'categoryName', isLeaf: 'leaf'}"
v-loading="modelLoading">
<el-tree v-if="modelType" :data="systemModel" ref="tree" default-expand-all @check-change="treeCheckChange"
show-checkbox :check-strictly="true" node-key="id"
:props="{ children: 'children', label: 'categoryName', isLeaf: 'leaf' }" v-loading="modelLoading">
</el-tree>
</div>
<span slot="footer"
class="dialog-footer">
<el-button size="small"
@click="modelVisible = false">取消</el-button>
<el-button size="small"
type="primary"
@click="submit">导入</el-button>
<span slot="footer" class="dialog-footer">
<el-button size="small" @click="modelVisible = false">取消</el-button>
<el-button size="small" type="primary" @click="submit">导入</el-button>
</span>
</el-dialog>
<el-dialog title="我的代码"
:visible.sync="codeVisible"
width="1200px"
:close-on-click-modal="false"
<el-dialog title="我的代码" :visible.sync="codeVisible" width="1200px" :close-on-click-modal="false"
custom-class="code-dia">
<el-tooltip class="item"
content="列表中展示当前课程已提交的实验代码"
placement="right">
<i class="info el-icon-warning"
style="margin-right: 10px"></i>
<el-tooltip class="item" content="列表中展示当前课程已提交的实验代码" placement="right">
<i class="info el-icon-warning" style="margin-right: 10px"></i>
</el-tooltip>
<div class="tool">
<el-input style="width: 250px"
placeholder="请输入项目名称、判分点名称"
v-model="keyword"
suffix-icon="el-icon-search"
clearable
size="small"></el-input>
<el-input style="width: 250px" placeholder="请输入项目名称、判分点名称" v-model="keyword" suffix-icon="el-icon-search"
clearable size="small"></el-input>
<div class="action">
<el-button class="cus-btn"
type="primary"
size="small"
@click="delAll">批量删除</el-button>
<el-button class="cus-btn" type="primary" size="small" @click="delAll">批量删除</el-button>
</div>
</div>
<el-table :data="codeList"
class="cus-table"
ref="table"
stripe
max-height="400"
header-align="center"
<el-table :data="codeList" class="cus-table" ref="table" stripe max-height="400" header-align="center"
@selection-change="handleSelectionChange">
<el-table-column type="selection"
width="60"
align="center"></el-table-column>
<el-table-column type="index"
label="序号"
width="55"
align="center"></el-table-column>
<el-table-column prop="judgmentName"
label="判分点"
min-width="250"
align="center"
<el-table-column type="selection" width="60" align="center"></el-table-column>
<el-table-column type="index" label="序号" width="55" align="center"></el-table-column>
<el-table-column prop="judgmentName" label="判分点" min-width="250" align="center"
show-overflow-tooltip></el-table-column>
<el-table-column prop="projectName"
label="项目名称"
min-width="250"
align="center"
<el-table-column prop="projectName" label="项目名称" min-width="250" align="center"
show-overflow-tooltip></el-table-column>
<el-table-column prop="submitTime"
label="提交时间"
width="140"
align="center"></el-table-column>
<el-table-column prop="score"
label="是否得分"
width="80"
align="center"></el-table-column>
<el-table-column width="190"
label="操作"
align="center">
<el-table-column prop="submitTime" label="提交时间" width="140" align="center"></el-table-column>
<el-table-column prop="score" label="是否得分" width="80" align="center"></el-table-column>
<el-table-column width="190" label="操作" align="center">
<template slot-scope="scope">
<el-button type="text"
@click="showCode(scope.row)">查看代码</el-button>
<el-button type="text"
@click="importCode(scope.row)">插入代码</el-button>
<el-button type="text"
@click="del(scope.row)">删除</el-button>
<el-button type="text" @click="showCode(scope.row)">查看代码</el-button>
<el-button type="text" @click="importCode(scope.row)">插入代码</el-button>
<el-button type="text" @click="del(scope.row)">删除</el-button>
</template>
</el-table-column>
</el-table>
<div class="pagination">
<el-pagination background
layout="total,prev, pager, next"
:current-page="page"
@current-change="handleCurrentChange"
:total="total"></el-pagination>
<el-pagination background layout="total,prev, pager, next" :current-page="page"
@current-change="handleCurrentChange" :total="total"></el-pagination>
</div>
<span slot="footer"
class="dialog-footer">
<el-button size="small"
type="primary"
@click="codeVisible = false">关闭</el-button>
<span slot="footer" class="dialog-footer">
<el-button size="small" type="primary" @click="codeVisible = false">关闭</el-button>
</span>
</el-dialog>
<el-dialog :title="curRow.judgmentName"
:visible.sync="showVisible"
width="700px"
:close-on-click-modal="false"
<el-dialog :title="curRow.judgmentName" :visible.sync="showVisible" width="700px" :close-on-click-modal="false"
custom-class="code-dia">
<el-tabs class="code-tab"
v-model="showActive">
<el-tab-pane label="代码"
name="code">
<codemirror class="code"
v-model="curCode"
:options="cmOptionDia"></codemirror>
<el-tabs class="code-tab" v-model="showActive">
<el-tab-pane label="代码" name="code">
<codemirror class="code" v-model="curCode" :options="cmOptionDia"></codemirror>
</el-tab-pane>
<el-tab-pane label="结果"
name="result">
<el-tab-pane label="结果" name="result">
<div style="position: relative">
<div class="result"
v-html="curRow.runResults"></div>
<div v-if="curPhotoUrl.length"
class="pics">
<div class="pic-item"
v-for="(img, i) in curPhotoUrl"
:key="i">
<el-image class="pic"
:src="img"
:preview-src-list="curPhotoUrl">
<div class="result" v-html="curRow.runResults"></div>
<div v-if="curPhotoUrl.length" class="pics">
<div class="pic-item" v-for="(img, i) in curPhotoUrl" :key="i">
<el-image class="pic" :src="img" :preview-src-list="curPhotoUrl">
</el-image>
</div>
</div>
</div>
</el-tab-pane>
</el-tabs>
<span slot="footer"
class="dialog-footer">
<el-button size="small"
type="primary"
@click="showSubmit">插入代码</el-button>
<span slot="footer" class="dialog-footer">
<el-button size="small" type="primary" @click="showSubmit">插入代码</el-button>
</span>
</el-dialog>
</div>
@ -968,16 +838,20 @@ export default {
.code-wrap {
position: relative;
}
.left {
position: relative;
width: 60%;
}
.text-wrapper {
white-space: pre-wrap;
}
/deep/.CodeMirror-code {
font-family: 'Microsoft Yahei';
}
/deep/.answer {
.el-tab-pane {
padding: 0 10px;
@ -986,38 +860,48 @@ export default {
overflow-y: auto;
white-space: pre-wrap;
}
.el-dialog--center {
width: 500px;
height: 500px;
}
.el-dialog__title {
font-size: 22px;
font-weight: 500;
}
.el-tabs__nav-wrap::after {
background-color: #333;
}
.el-tabs__active-bar {
height: 0;
background-color: #fff;
}
.el-tabs__header {
background-color: #333;
}
.el-dialog--center .el-dialog__body {
padding: 0;
}
.el-tabs__item {
width: 80px;
color: #fff;
}
.el-tabs--top .el-tabs__item.is-top:nth-child(2) {
padding-left: 20px;
}
.el-tabs__item.is-active {
color: #fff !important;
background-color: #333 !important;
}
.tips-btn {
margin-top: 10px;
height: 40px;
@ -1027,6 +911,7 @@ export default {
right: 0;
background: rgba(255, 49, 49, 1);
color: rgba(255, 255, 255, 1);
&:hover,
&:focus,
&:active {
@ -1035,6 +920,7 @@ export default {
}
}
}
.del {
width: 40px;
margin: 0 10px;
@ -1044,17 +930,21 @@ export default {
border-radius: 50%;
background-color: #f00;
cursor: pointer;
&:hover {
opacity: 0.9;
}
}
.result-right {
background-color: rgba(43, 40, 22, 1);
}
.result-wrong {
background-color: rgba(43, 22, 22, 1);
color: #f00;
}
.result-wrong,
.result-right {
position: absolute;
@ -1063,6 +953,7 @@ export default {
display: flex;
bottom: 10px;
padding: 0 10px;
img {
width: 40px;
height: 40px;
@ -1070,6 +961,7 @@ export default {
margin-right: 10px;
}
}
.line {
z-index: 2;
position: absolute;
@ -1079,6 +971,7 @@ export default {
height: 100%;
cursor: e-resize;
}
.code-right {
width: 40%;
color: #fff;
@ -1086,6 +979,7 @@ export default {
display: inline-block;
position: relative;
overflow-x: auto;
p {
font-size: 18px;
margin: 10px;
@ -1094,13 +988,16 @@ export default {
height: calc(100vh - 387px);
overflow: auto;
}
.pic-num0 {
height: calc(100vh - 247px);
}
.pic-num1 {
height: calc(100vh - 520px);
}
}
.pic-wrap {
position: absolute;
left: 0;
@ -1111,24 +1008,30 @@ export default {
margin: 0 auto;
text-align: center;
overflow: auto;
&.wrong {
bottom: 60px;
}
.pic-item {
margin: 0 5px 5px;
.pic-inner {
height: 100px;
}
&:only-child {
.pic-inner {
height: auto;
}
.pic {
width: 50%;
max-height: none;
}
}
}
.pic {
display: block;
width: 100px;
@ -1137,6 +1040,7 @@ export default {
margin: 0 auto 10px;
}
}
.code-mask {
z-index: 2;
position: absolute;
@ -1145,6 +1049,7 @@ export default {
bottom: 0;
right: 0;
}
.btns {
z-index: 99;
position: absolute;
@ -1152,63 +1057,78 @@ export default {
bottom: 15px;
display: flex;
}
.run {
width: 100px;
color: #fff;
}
.download-btn {
color: #fff;
}
/deep/.answer-wrap {
&.client {
user-select: none;
}
pre {
width: 100%;
white-space: pre-wrap;
}
img {
max-width: 100%;
}
}
/deep/.model-dia {
.el-dialog__body {
padding: 0 20px;
}
.el-divider--horizontal {
margin: 15px 0;
}
}
.model-wrap {
max-height: 400px;
overflow: auto;
}
/deep/.code-dia {
.el-dialog__header {
padding: 0 40px 0 20px;
}
.el-dialog__body {
padding: 0 20px;
}
.info {
position: absolute;
top: 18px;
left: 100px;
color: #88aef5;
}
.code-tab {
.el-tabs__item.is-active {
color: #333 !important;
background-color: transparent;
}
}
.tool {
display: flex;
justify-content: space-between;
}
.code {
margin-top: 10px;
}
.result {
max-height: 300px;
font-size: 18px;
@ -1217,12 +1137,15 @@ export default {
color: #333;
overflow: auto;
}
.pics {
display: flex;
margin-top: 20px;
overflow: auto;
.pic-item {
margin: 0 5px 5px;
&:only-child {
.pic {
width: 50%;
@ -1230,6 +1153,7 @@ export default {
}
}
}
.pic {
display: block;
width: 100px;

@ -13,8 +13,8 @@ let host = location.origin + '/'
let bankPath = `${location.origin}/banksystem` // 银行系统
// 121.37.12.51 | 192.168.31.151
if (isDev) {
host = 'http://192.168.31.217:9000/'
// host = 'http://121.37.12.51:9000/'
// host = 'http://192.168.31.217:9000/'
host = 'http://121.37.12.51:9000/'
// host = 'https://occupationlab.com/'
bankPath = `http://${location.hostname}:8093`
} else if (isPro) {

Loading…
Cancel
Save