parent
747726392c
commit
a56305d8a1
23 changed files with 3676 additions and 1241 deletions
|
After Width: | Height: | Size: 796 B |
|
After Width: | Height: | Size: 395 B |
@ -0,0 +1,386 @@ |
|||||||
|
<template> |
||||||
|
<div class="wrap"> |
||||||
|
<div class="left"> |
||||||
|
<codemirror |
||||||
|
v-model="codeVal" |
||||||
|
:options="cmOption" |
||||||
|
class="code-mirror" |
||||||
|
@ready="ready" |
||||||
|
ref="codemirror" |
||||||
|
></codemirror> |
||||||
|
<el-button |
||||||
|
class="run btn" |
||||||
|
type="primary" |
||||||
|
@click="runCode" |
||||||
|
>运行</el-button> |
||||||
|
</div> |
||||||
|
<div class="code-right answer"> |
||||||
|
<p class="text-wrapper">{{ runResult }}</p> |
||||||
|
<div class="pic-wrap" v-if="picSrcList.length"> |
||||||
|
<div class="pic-item" v-for="(img, i) in picSrcList" :key="i"> |
||||||
|
<el-image |
||||||
|
class="pic" |
||||||
|
:src="img" |
||||||
|
:preview-src-list="picSrcList"> |
||||||
|
</el-image> |
||||||
|
<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="@/assets/img/yes.png" alt />运行成功 |
||||||
|
</div> |
||||||
|
<div class="result-wrong" v-show="isError === 0"> |
||||||
|
<img src="@/assets/img/error.png" alt /> |
||||||
|
第{{errLine}}行出现错误 |
||||||
|
</div> |
||||||
|
</div> |
||||||
|
</div> |
||||||
|
</template> |
||||||
|
|
||||||
|
<script> |
||||||
|
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"; |
||||||
|
import { Loading } from 'element-ui'; |
||||||
|
export default { |
||||||
|
props: ['code', 'codeId', 'projectId', 'retResult', 'readOnly'], |
||||||
|
data() { |
||||||
|
return { |
||||||
|
codeVal: this.code, |
||||||
|
runResult: '', // 运行结果 |
||||||
|
isError: false, // 运行正确与否 |
||||||
|
errLine: '', // 错误代码的位置 |
||||||
|
picSrcList: [], |
||||||
|
loadIns: null, // loading实例 |
||||||
|
cmOption: { |
||||||
|
readOnly: this.readOnly, |
||||||
|
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" // 主题 |
||||||
|
} |
||||||
|
}; |
||||||
|
}, |
||||||
|
components: { |
||||||
|
codemirror |
||||||
|
}, |
||||||
|
watch: { |
||||||
|
codeVal(val) { |
||||||
|
this.$emit("update:code", val) |
||||||
|
} |
||||||
|
}, |
||||||
|
mounted() { |
||||||
|
|
||||||
|
}, |
||||||
|
methods: { |
||||||
|
// 页面加载完后重置编辑框大小 |
||||||
|
ready() { |
||||||
|
const code = this.$refs.codemirror.codemirror |
||||||
|
code.setSize("auto", "calc(100vh - 370px)"); |
||||||
|
code.on('keypress', function() { |
||||||
|
// 显示智能提示 |
||||||
|
code.showHint() |
||||||
|
}); |
||||||
|
}, |
||||||
|
// 运行代码 |
||||||
|
runCode() { |
||||||
|
let code = this.codeVal |
||||||
|
if (!code) { |
||||||
|
this.$message({ |
||||||
|
message: "警告哦，内容为空不可运行", |
||||||
|
type: "warning" |
||||||
|
}) |
||||||
|
} else { |
||||||
|
this.loadIns = Loading.service({ |
||||||
|
background: 'transparent' |
||||||
|
}) |
||||||
|
code = code.replace(/\.savefig\(([\u4e00-\u9fa5\w]*?['"])/mg, str => { |
||||||
|
return str + Date.now() |
||||||
|
}) |
||||||
|
// 把代码传给后端，在后端运行Python代码 |
||||||
|
this.$post(this.api.runPythonCode, { |
||||||
|
code |
||||||
|
}).then(res => { |
||||||
|
const data = res.code |
||||||
|
const photo = data.photoUrl |
||||||
|
const result = data.runResult |
||||||
|
this.$emit('cache') // 每次运行代码都要把代码传给后端做缓存 |
||||||
|
this.loadIns.close() |
||||||
|
this.picSrcList = [] |
||||||
|
if (photo) this.picSrcList = photo.split(',') |
||||||
|
let imgList = '' |
||||||
|
let firtImg = '' |
||||||
|
try { |
||||||
|
imgList = eval(result) |
||||||
|
} catch (error) {} |
||||||
|
if (imgList && imgList.length) firtImg = imgList[0] |
||||||
|
// 如果是下载图片的代码，则要显示图片和运行结果，不用显示对错，换成显示下载图片 |
||||||
|
if (photo) { |
||||||
|
this.isError = '' // 对错隐藏 |
||||||
|
const text = result.replace(photo, '') // 结果里包含了图片路径，所以要把图片路径给去掉 |
||||||
|
this.runResult = text |
||||||
|
this.picSrcList = photo.split(',') |
||||||
|
} else if (imgList instanceof Array && imgList.length && typeof firtImg === 'string' && (firtImg.includes('.jpg') || firtImg.includes('.png') || firtImg.includes('img'))) { |
||||||
|
/** |
||||||
|
* 这段是为要下载图片的项目案例写的，后端会返回图片名称的数组，前端负责循环这个数组，然后下载下来 |
||||||
|
* 只有该系统有这段代码，因为其他7个系统没有下载图片的项目，后续如果加了，直接把这段代码复制过去即可 |
||||||
|
*/ |
||||||
|
imgList.map((n,i) => { |
||||||
|
// util.downloadFile(`${i+1}.jpg`,n) |
||||||
|
}) |
||||||
|
this.isError = 0 |
||||||
|
this.runResult = '下载完成' |
||||||
|
} else { |
||||||
|
this.isError = data.retResult |
||||||
|
this.runResult = result |
||||||
|
this.errLine = parseInt(result.substring(result.indexOf("line") + 4, result.length)) |
||||||
|
} |
||||||
|
}).catch(res => { |
||||||
|
this.isError = false |
||||||
|
this.runResult = '' |
||||||
|
this.picSrcList = [] |
||||||
|
this.loadIns.close() |
||||||
|
res.status == 500 && this.$message.error('检测到代码里有非法代码，请检查是否有调用系统命令。') |
||||||
|
}) |
||||||
|
} |
||||||
|
}, |
||||||
|
// 下载图片 |
||||||
|
downloadPic(i) { |
||||||
|
this.$refs['picLink' + i][0].click() |
||||||
|
} |
||||||
|
} |
||||||
|
}; |
||||||
|
</script> |
||||||
|
|
||||||
|
<style lang="scss" scoped> |
||||||
|
::-webkit-scrollbar { |
||||||
|
width: 8px; |
||||||
|
height: 8px; |
||||||
|
} |
||||||
|
::-webkit-scrollbar-thumb { |
||||||
|
width: 5px; |
||||||
|
border-radius: 6px; |
||||||
|
background: rgba(173,173,173,.7); |
||||||
|
} |
||||||
|
.wrap { |
||||||
|
display: flex; |
||||||
|
} |
||||||
|
.left{ |
||||||
|
position: relative; |
||||||
|
width: calc(100% - 400px); |
||||||
|
} |
||||||
|
.text-wrapper { |
||||||
|
white-space: pre-wrap; |
||||||
|
} |
||||||
|
/deep/.answer { |
||||||
|
.el-tab-pane { |
||||||
|
padding: 0 10px; |
||||||
|
height: 340px; |
||||||
|
overflow: hidden; |
||||||
|
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; |
||||||
|
width: 90px; |
||||||
|
border: none; |
||||||
|
position: absolute; |
||||||
|
right: 0; |
||||||
|
background: rgba(255, 49, 49, 1); |
||||||
|
color: rgba(255, 255, 255, 1); |
||||||
|
&:hover, |
||||||
|
&:focus, |
||||||
|
&:active { |
||||||
|
background: rgba(255, 49, 49, 1); |
||||||
|
color: rgba(255, 255, 255, 1); |
||||||
|
} |
||||||
|
} |
||||||
|
} |
||||||
|
/deep/.CodeMirror-wrap pre.CodeMirror-line, |
||||||
|
.CodeMirror-wrap pre.CodeMirror-line-like { |
||||||
|
height: 30px; |
||||||
|
line-height: 30px; |
||||||
|
} |
||||||
|
.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; |
||||||
|
left: 20px; |
||||||
|
right: 20px; |
||||||
|
display: flex; |
||||||
|
align-items: center; |
||||||
|
bottom: 10px; |
||||||
|
padding: 5px 10px; |
||||||
|
img { |
||||||
|
width: 40px; |
||||||
|
height: 40px; |
||||||
|
margin-top: 5px; |
||||||
|
margin-right: 10px; |
||||||
|
} |
||||||
|
} |
||||||
|
.code-right { |
||||||
|
width: 500px; |
||||||
|
color: #fff; |
||||||
|
background: #1b1b1b; |
||||||
|
display: inline-block; |
||||||
|
position: relative; |
||||||
|
overflow-x: auto; |
||||||
|
p { |
||||||
|
font-size: 18px; |
||||||
|
margin: 10px; |
||||||
|
position: absolute; |
||||||
|
width: calc(100% - 14px); |
||||||
|
top: 0; |
||||||
|
bottom: -8px; |
||||||
|
overflow: auto; |
||||||
|
} |
||||||
|
} |
||||||
|
.pic-wrap { |
||||||
|
position: absolute; |
||||||
|
left: 0; |
||||||
|
right: 0; |
||||||
|
bottom: 5px; |
||||||
|
display: flex; |
||||||
|
max-width: calc(100% - 50px); |
||||||
|
margin: 0 auto; |
||||||
|
text-align: center; |
||||||
|
overflow: auto; |
||||||
|
.pic-item { |
||||||
|
margin: 0 5px 5px; |
||||||
|
&:only-child { |
||||||
|
.pic { |
||||||
|
width: 80%; |
||||||
|
} |
||||||
|
} |
||||||
|
} |
||||||
|
.pic { |
||||||
|
display: block; |
||||||
|
width: 100px; |
||||||
|
margin: 0 auto 10px; |
||||||
|
} |
||||||
|
} |
||||||
|
.code-mask{ |
||||||
|
z-index: 2; |
||||||
|
position: absolute; |
||||||
|
top: 0; |
||||||
|
left: 0; |
||||||
|
bottom: 0; |
||||||
|
right: 0; |
||||||
|
} |
||||||
|
.run{ |
||||||
|
z-index:99; |
||||||
|
position:absolute; |
||||||
|
right: 50px; |
||||||
|
bottom:15px; |
||||||
|
width:100px; |
||||||
|
color:#fff; |
||||||
|
} |
||||||
|
.download-btn{ |
||||||
|
color:#fff; |
||||||
|
} |
||||||
|
/deep/.answer-wrap{ |
||||||
|
pre{ |
||||||
|
width: 100%; |
||||||
|
white-space: pre-wrap; |
||||||
|
} |
||||||
|
img{ |
||||||
|
max-width: 100%; |
||||||
|
} |
||||||
|
} |
||||||
|
</style> |
||||||
File diff suppressed because it is too large
Load Diff
@ -0,0 +1,222 @@ |
|||||||
|
<template> |
||||||
|
<div class="wrap"> |
||||||
|
<el-card shadow="hover" |
||||||
|
class="m-b-20"> |
||||||
|
<div class="flex-between"> |
||||||
|
<el-page-header @back="back" |
||||||
|
:content="isDetail ? '查看源模型' : (id ? '编辑源模型' : '新增源模型')"></el-page-header> |
||||||
|
<div v-if="!isDetail"> |
||||||
|
<el-button type="primary" |
||||||
|
round |
||||||
|
v-preventReClick |
||||||
|
@click="submit(1)">发布</el-button> |
||||||
|
<el-button v-if="!postStatus" |
||||||
|
type="primary" |
||||||
|
round |
||||||
|
v-preventReClick |
||||||
|
@click="submit(0)">草稿</el-button> |
||||||
|
</div> |
||||||
|
</div> |
||||||
|
</el-card> |
||||||
|
|
||||||
|
<el-card shadow="hover"> |
||||||
|
<el-form label-width="80px" |
||||||
|
:disabled="isDetail"> |
||||||
|
<div class="item name"> |
||||||
|
<label>模型名称</label> |
||||||
|
<el-input placeholder="请输入模型名称" |
||||||
|
v-model="form.modelName" |
||||||
|
maxlength="25" |
||||||
|
style="width: 400px"></el-input> |
||||||
|
</div> |
||||||
|
<div class="item name"> |
||||||
|
<label>模型分类</label> |
||||||
|
<el-cascader :options="categoryList" |
||||||
|
v-model="categoryIdCus" |
||||||
|
:props="categoryProps" |
||||||
|
clearable> |
||||||
|
</el-cascader> |
||||||
|
</div> |
||||||
|
<div class="item code"> |
||||||
|
<label>模型代码</label> |
||||||
|
<codemirror :key="codeKey" |
||||||
|
:code.sync="form.modelDemo" |
||||||
|
:readOnly="isDetail"></codemirror> |
||||||
|
</div> |
||||||
|
</el-form> |
||||||
|
</el-card> |
||||||
|
</div> |
||||||
|
</template> |
||||||
|
|
||||||
|
<script> |
||||||
|
import codemirror from '@/components/codemirror' |
||||||
|
export default { |
||||||
|
components: { codemirror }, |
||||||
|
data () { |
||||||
|
return { |
||||||
|
systemId: +this.$route.query.systemId, |
||||||
|
categoryId: +this.$route.query.categoryId, |
||||||
|
id: +this.$route.query.id, |
||||||
|
postStatus: +this.$route.query.postStatus, |
||||||
|
isDetail: Boolean(this.$route.query.show), // 是否是查看 |
||||||
|
isModel: Boolean(this.$route.query.model), // 是否是从模型列表进来的，模型和源模型查询详情的接口不一样 |
||||||
|
categoryIdCus: [], |
||||||
|
form: { |
||||||
|
modelName: '', |
||||||
|
modelDemo: '' |
||||||
|
}, |
||||||
|
categoryList: [], |
||||||
|
categoryProps: { |
||||||
|
checkStrictly: true, |
||||||
|
label: 'categoryName', |
||||||
|
value: 'id' |
||||||
|
}, |
||||||
|
codeKey: 1, |
||||||
|
submiting: false, |
||||||
|
updateTime: 0 |
||||||
|
}; |
||||||
|
}, |
||||||
|
watch: { |
||||||
|
// 监听信息是否有更改,有的话页面离开的时候要询问是否要保存 |
||||||
|
form: { |
||||||
|
handler () { |
||||||
|
this.updateTime++ |
||||||
|
}, |
||||||
|
deep: true |
||||||
|
}, |
||||||
|
}, |
||||||
|
mounted () { |
||||||
|
this.getType() |
||||||
|
}, |
||||||
|
methods: { |
||||||
|
// 获取详情 |
||||||
|
async getData () { |
||||||
|
// 模型/源模型 |
||||||
|
const res = await this.$post(`${this.api[this.isModel ? 'referenceFindById' : 'modelFindById']}?id=${this.id}`) |
||||||
|
const { data } = res |
||||||
|
const { modelName, categoryId, modelDemo } = data |
||||||
|
this.form = { |
||||||
|
modelName, |
||||||
|
modelDemo |
||||||
|
} |
||||||
|
this.handleId(this.categoryList, categoryId) |
||||||
|
this.codeKey++ |
||||||
|
}, |
||||||
|
// 处理id |
||||||
|
handleId (list, id, parentId = []) { |
||||||
|
list.map(e => { |
||||||
|
// 取得父级id跟子级id的集合 |
||||||
|
if (id === e.id) { |
||||||
|
parentId.shift() // 全部的id要去掉 |
||||||
|
this.categoryIdCus = [...parentId, e.id] |
||||||
|
} else { |
||||||
|
e.children && this.handleId(e.children, id, [...parentId, e.id]) |
||||||
|
} |
||||||
|
}) |
||||||
|
}, |
||||||
|
// 获取分类 |
||||||
|
getType () { |
||||||
|
this.$post(this.api.sourceModelClassification).then(res => { |
||||||
|
const { data } = res |
||||||
|
// 没有子级，删除children属性 |
||||||
|
const handleLeaf = list => { |
||||||
|
list.map(e => { |
||||||
|
if (e.children.length) { |
||||||
|
handleLeaf(e.children) |
||||||
|
} else { |
||||||
|
delete e.children |
||||||
|
} |
||||||
|
}) |
||||||
|
} |
||||||
|
handleLeaf(data) |
||||||
|
this.categoryList = data[0].children |
||||||
|
if (this.id) { |
||||||
|
this.getData() |
||||||
|
} else { |
||||||
|
this.handleId(data, this.categoryId) |
||||||
|
} |
||||||
|
}).catch(res => { }) |
||||||
|
}, |
||||||
|
// 保存 |
||||||
|
submit (postStatus, fromBack) { |
||||||
|
if (this.submiting) return false |
||||||
|
const { modelName, categoryId, modelDemo } = this.form |
||||||
|
const categoryIdCus = this.categoryIdCus |
||||||
|
const id = this.id |
||||||
|
if (!modelName) return this.$message.error('请输入模型名称') |
||||||
|
if (categoryIdCus[0] === 1) return this.$message.error('请选择模型分类') |
||||||
|
if (postStatus) { |
||||||
|
if (!modelDemo) return this.$message.error('请输入模型代码') |
||||||
|
} |
||||||
|
this.submiting = true |
||||||
|
const data = { |
||||||
|
categoryId: categoryIdCus[categoryIdCus.length - 1], |
||||||
|
modelName, |
||||||
|
modelDemo, |
||||||
|
postStatus, |
||||||
|
systemId: this.systemId |
||||||
|
} |
||||||
|
if (id) { |
||||||
|
data.id = id |
||||||
|
this.$post(this.api.updateSysModelDemo, data).then(res => { |
||||||
|
this.$message.success('编辑成功') |
||||||
|
fromBack || this.$router.back() |
||||||
|
}).catch(res => { |
||||||
|
this.submiting = false |
||||||
|
}) |
||||||
|
} else { |
||||||
|
this.$post(this.api.saveAcademyModelDemo, data).then(res => { |
||||||
|
this.$message.success('新增成功') |
||||||
|
fromBack || this.$router.back() |
||||||
|
}).catch(res => { |
||||||
|
this.submiting = false |
||||||
|
}) |
||||||
|
} |
||||||
|
}, |
||||||
|
// 返回上一页 |
||||||
|
backPage () { |
||||||
|
this.$router.back() |
||||||
|
}, |
||||||
|
// 返回 |
||||||
|
back () { |
||||||
|
const id = this.id |
||||||
|
const updateTime = this.updateTime |
||||||
|
// 更改了信息才需要提示 |
||||||
|
if ((id && updateTime > 1) || (!id && updateTime)) { |
||||||
|
this.$confirm(`编辑的内容未保存，是否保存？`, '提示', { |
||||||
|
type: 'warning' |
||||||
|
}).then(() => { |
||||||
|
this.submit(this.postStatus ? 1 : 0, 1) |
||||||
|
this.backPage() |
||||||
|
}).catch(() => { |
||||||
|
this.backPage() |
||||||
|
}) |
||||||
|
} else { |
||||||
|
this.backPage() |
||||||
|
} |
||||||
|
} |
||||||
|
} |
||||||
|
}; |
||||||
|
</script> |
||||||
|
|
||||||
|
<style lang="scss" scoped> |
||||||
|
.item { |
||||||
|
display: flex; |
||||||
|
margin-bottom: 20px; |
||||||
|
label { |
||||||
|
padding: 0 15px 0 20px; |
||||||
|
} |
||||||
|
&.name { |
||||||
|
align-items: center; |
||||||
|
label { |
||||||
|
text-align: right; |
||||||
|
} |
||||||
|
} |
||||||
|
&.code { |
||||||
|
flex-direction: column; |
||||||
|
label { |
||||||
|
margin-bottom: 15px; |
||||||
|
} |
||||||
|
} |
||||||
|
} |
||||||
|
</style> |
||||||
@ -0,0 +1,56 @@ |
|||||||
|
<template> |
||||||
|
<div class="wrap"> |
||||||
|
<div class="line"> |
||||||
|
<span class="field">功能</span> |
||||||
|
<span class="field">操作</span> |
||||||
|
</div> |
||||||
|
<div class="line"> |
||||||
|
<span class="field">粘贴代码</span> |
||||||
|
<div class="field"> |
||||||
|
<el-switch v-model="isOpen" |
||||||
|
:active-text="isOpen ? '关闭' : '启用'" |
||||||
|
:active-value="0" |
||||||
|
:inactive-value="1" |
||||||
|
style="margin: 0 10px 0 10px" |
||||||
|
@change="switchOff(scope.row)"></el-switch> |
||||||
|
</div> |
||||||
|
</div> |
||||||
|
|
||||||
|
</div> |
||||||
|
</template> |
||||||
|
<script> |
||||||
|
export default { |
||||||
|
data () { |
||||||
|
return { |
||||||
|
systemId: this.$route.query.systemId, |
||||||
|
isOpen: 0 |
||||||
|
}; |
||||||
|
}, |
||||||
|
mounted () { }, |
||||||
|
methods: { |
||||||
|
|
||||||
|
switchOff (row) { |
||||||
|
// this.$get(`${this.api.updateIsOpen}?isOpen=${row.ccupationlabOpen}&projectId=${row.projectId}&platformId=${this.queryData.platformId}`).then(res => { |
||||||
|
// util.successMsg("更新启用状态成功"); |
||||||
|
// this.getData(); |
||||||
|
// }).catch(err => { |
||||||
|
// console.log(err); |
||||||
|
// }); |
||||||
|
}, |
||||||
|
} |
||||||
|
}; |
||||||
|
</script> |
||||||
|
<style lang="scss" scoped> |
||||||
|
.wrap { |
||||||
|
padding: 30px; |
||||||
|
} |
||||||
|
.line { |
||||||
|
display: flex; |
||||||
|
align-items: center; |
||||||
|
margin-bottom: 20px; |
||||||
|
text-align: center; |
||||||
|
.field { |
||||||
|
width: 100px; |
||||||
|
} |
||||||
|
} |
||||||
|
</style> |
||||||
@ -0,0 +1,73 @@ |
|||||||
|
<template> |
||||||
|
<div> |
||||||
|
<el-card shadow="hover" |
||||||
|
class="m-b-20"> |
||||||
|
<el-page-header :content="'系统后台 / '+ $route.query.name" |
||||||
|
@back="back"></el-page-header> |
||||||
|
</el-card> |
||||||
|
<div class="page" |
||||||
|
style="padding: 0"> |
||||||
|
<div class="tabs"> |
||||||
|
<a class="item" |
||||||
|
v-for="(item,index) in tabs" |
||||||
|
:key="index" |
||||||
|
:class="{active: index == active}" |
||||||
|
@click="tabChange(index)">{{ item }}</a> |
||||||
|
</div> |
||||||
|
|
||||||
|
<model v-if="active == 'model'"></model> |
||||||
|
<sourceModel v-else-if="active == 'sourceModel'"></sourceModel> |
||||||
|
<compiler v-else-if="active == 'compiler'"></compiler> |
||||||
|
</div> |
||||||
|
</div> |
||||||
|
</template> |
||||||
|
|
||||||
|
<script> |
||||||
|
import model from "./model"; |
||||||
|
import sourceModel from "./sourceModel"; |
||||||
|
import compiler from "./compiler"; |
||||||
|
export default { |
||||||
|
data () { |
||||||
|
return { |
||||||
|
active: this.$route.query.type || 'model', |
||||||
|
tabs: { |
||||||
|
model: "模型列表管理", |
||||||
|
sourceModel: "源模型管理", |
||||||
|
compiler: '编译器管理' |
||||||
|
} |
||||||
|
}; |
||||||
|
}, |
||||||
|
computed: { |
||||||
|
|
||||||
|
}, |
||||||
|
components: { |
||||||
|
model, |
||||||
|
sourceModel, |
||||||
|
compiler |
||||||
|
}, |
||||||
|
created () { }, |
||||||
|
methods: { |
||||||
|
tabChange (index) { |
||||||
|
this.active = index |
||||||
|
this.$router.push({ |
||||||
|
path: 'backstage', |
||||||
|
query: { |
||||||
|
...this.$route.query, |
||||||
|
page: 1, |
||||||
|
type: index, |
||||||
|
categoryId: '' |
||||||
|
} |
||||||
|
}) |
||||||
|
}, |
||||||
|
back () { |
||||||
|
this.$router.push('list') |
||||||
|
} |
||||||
|
} |
||||||
|
}; |
||||||
|
</script> |
||||||
|
|
||||||
|
<style lang="scss" scoped> |
||||||
|
.page { |
||||||
|
min-height: calc(100vh - 250px); |
||||||
|
} |
||||||
|
</style> |
||||||
@ -0,0 +1,308 @@ |
|||||||
|
<template> |
||||||
|
<div class="wrap"> |
||||||
|
<div class="side"> |
||||||
|
<org ref="tree" @initData="initData" @getData="getData"></org> |
||||||
|
</div> |
||||||
|
|
||||||
|
<div class="right"> |
||||||
|
<h6 class="p-title">筛选</h6> |
||||||
|
<div class="tool"> |
||||||
|
<ul class="filter"> |
||||||
|
<li> |
||||||
|
<el-input placeholder="请输入模型名称" prefix-icon="el-icon-search" v-model.trim="keyword" clearable></el-input> |
||||||
|
</li> |
||||||
|
</ul> |
||||||
|
<div> |
||||||
|
<el-button type="primary" round @click="add">导入模型</el-button> |
||||||
|
<el-button type="primary" round @click="batchDel">批量移除</el-button> |
||||||
|
</div> |
||||||
|
</div> |
||||||
|
|
||||||
|
<el-table :data="listData" class="table" ref="table" stripe header-align="center" @selection-change="handleSelectionChange"> |
||||||
|
<el-table-column type="selection" width="55" align="center"></el-table-column> |
||||||
|
<el-table-column type="index" label="序号" width="55" align="center"></el-table-column> |
||||||
|
<el-table-column prop="modelName" label="模型名称" align="center"></el-table-column> |
||||||
|
<el-table-column v-if="isTopLevel" prop="categoryName" label="分类" width="150" align="center"></el-table-column> |
||||||
|
<el-table-column prop="createTime" label="导入时间" align="center"></el-table-column> |
||||||
|
<el-table-column label="状态" align="center"> |
||||||
|
<template slot-scope="scope"> |
||||||
|
{{ scope.row.isOpen ? '禁用' : '启用' }} |
||||||
|
</template> |
||||||
|
</el-table-column> |
||||||
|
<el-table-column label="操作" width="200" align="center"> |
||||||
|
<template slot-scope="scope"> |
||||||
|
<el-button type="text" @click="show(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> |
||||||
|
</div> |
||||||
|
</div> |
||||||
|
|
||||||
|
<el-dialog title="请选择需要导入的模型" :visible.sync="modelVisible" width="500px" class="dialog" :close-on-click-modal="false"> |
||||||
|
<div class="model-wrap"> |
||||||
|
<el-tree |
||||||
|
v-if="modelData.length" |
||||||
|
:data="modelData" v-loading="modelLoading" |
||||||
|
ref="model" |
||||||
|
default-expand-all |
||||||
|
show-checkbox |
||||||
|
node-key="id" |
||||||
|
:props="{children: 'children', label: 'categoryName', isLeaf: 'leaf'}"> |
||||||
|
</el-tree> |
||||||
|
<div class="none" v-else>暂无可导入的模型</div> |
||||||
|
</div> |
||||||
|
<span slot="footer" class="dialog-footer"> |
||||||
|
<el-button @click="modelVisible = false">取 消</el-button> |
||||||
|
<el-button type="primary" @click="submit">确 定</el-button> |
||||||
|
</span> |
||||||
|
</el-dialog> |
||||||
|
</div> |
||||||
|
</template> |
||||||
|
<script> |
||||||
|
import org from "./modelType" |
||||||
|
export default { |
||||||
|
data() { |
||||||
|
return { |
||||||
|
systemId: this.$route.query.systemId, |
||||||
|
isTopLevel: true, // 是否是在顶级分类 |
||||||
|
listData: [], |
||||||
|
keyword: '', |
||||||
|
page: +this.$route.query.page || 1, |
||||||
|
pageSize: 10, |
||||||
|
total: 0, |
||||||
|
multipleSelection: [], |
||||||
|
modelVisible: false, |
||||||
|
modelLoading: false, |
||||||
|
modelData: [], |
||||||
|
submiting: false |
||||||
|
}; |
||||||
|
}, |
||||||
|
components: { |
||||||
|
org |
||||||
|
}, |
||||||
|
watch: { |
||||||
|
keyword: function(val) { |
||||||
|
clearTimeout(this.searchTimer); |
||||||
|
this.searchTimer = setTimeout(() => { |
||||||
|
this.initData() |
||||||
|
}, 500) |
||||||
|
} |
||||||
|
}, |
||||||
|
mounted() {}, |
||||||
|
methods: { |
||||||
|
getData() { |
||||||
|
const curNode = this.$refs.tree.$refs.tree.getCurrentNode() // 获取当前选中的分类 |
||||||
|
this.isTopLevel = !curNode.level && curNode.categoryName === '全部' |
||||||
|
// 如果是首级，要调另一个接口 |
||||||
|
if (this.isTopLevel) { |
||||||
|
this.$post(this.api.getAllModelList, { |
||||||
|
modelName: this.keyword, |
||||||
|
pageNum: this.page, |
||||||
|
pageSize: this.pageSize, |
||||||
|
systemId: this.systemId |
||||||
|
}).then(res => { |
||||||
|
this.listData = res.data.records |
||||||
|
this.total = res.data.total |
||||||
|
}).catch(res => {}) |
||||||
|
} else { |
||||||
|
this.$post(this.api.referenceDemoList, { |
||||||
|
modelName: this.keyword, |
||||||
|
pageNum: this.page, |
||||||
|
pageSize: this.pageSize, |
||||||
|
categoryId: curNode.id |
||||||
|
}).then(res => { |
||||||
|
this.listData = res.data.records |
||||||
|
this.total = res.data.total |
||||||
|
}).catch(res => {}) |
||||||
|
} |
||||||
|
}, |
||||||
|
initData() { |
||||||
|
this.$refs.table.clearSelection() |
||||||
|
this.page = 1 |
||||||
|
this.getData() |
||||||
|
}, |
||||||
|
// 导入模型 |
||||||
|
add() { |
||||||
|
if (!this.$refs.tree.orgList.length) return this.$message.error('请先添加模型分类') |
||||||
|
if (this.isTopLevel) return this.$message.error('请选择子分类进入导入模型') |
||||||
|
this.modelVisible = true |
||||||
|
this.modelLoading = true |
||||||
|
// 获取模型列表，用以跟源模型列表作比对，重复的不再显示 |
||||||
|
this.$post(this.api.getAllModelList, { |
||||||
|
pageNum: 1, |
||||||
|
pageSize: 10000, |
||||||
|
systemId: this.systemId |
||||||
|
}).then(res => { |
||||||
|
const modelList = res.data.records |
||||||
|
|
||||||
|
// 查询源模型分类 |
||||||
|
this.$post(this.api.sourceModelClassification).then(res => { |
||||||
|
let { data } = res |
||||||
|
const promises = [] |
||||||
|
const addType = list => { |
||||||
|
list.map((e, i) => { |
||||||
|
// 用promise储存以添加完后更新数据 |
||||||
|
promises.push(new Promise((resolve,reject) => { |
||||||
|
// 获取源模型列表 |
||||||
|
this.$post(this.api.sysModelDemoList, { |
||||||
|
pageNum: 1, |
||||||
|
pageSize: 10000, |
||||||
|
categoryId: e.id |
||||||
|
}).then(res => { |
||||||
|
const { records } = res.data |
||||||
|
const modelChildren = [] |
||||||
|
// 判重，重复的模型不再显示，通过模型的copyId和源模型的id作比对 |
||||||
|
records.map(n => { |
||||||
|
if (!modelList.find(e => e.copyId === n.id)) { |
||||||
|
n.categoryName = n.modelName |
||||||
|
modelChildren.push(n) |
||||||
|
} |
||||||
|
}) |
||||||
|
// 如果有未导入的模型，则添加到子级，否则设置为disabled |
||||||
|
if (modelChildren.length) { |
||||||
|
e.children = [...e.children, ...modelChildren] |
||||||
|
} else if (records.length) { |
||||||
|
e.disabled = true |
||||||
|
} |
||||||
|
resolve() |
||||||
|
}).catch(res => { |
||||||
|
reject() |
||||||
|
}) |
||||||
|
})) |
||||||
|
e.children && e.children.length && addType(e.children) |
||||||
|
}) |
||||||
|
} |
||||||
|
addType(data) |
||||||
|
// 筛选出disabled不为true的分类，因为没有模型的分类不需要展示 |
||||||
|
const handleType = list => { |
||||||
|
return list.filter((e, i) => { |
||||||
|
return !e.disabled |
||||||
|
}).map(e => { |
||||||
|
if (e.children) { |
||||||
|
e.children = handleType(e.children) |
||||||
|
} |
||||||
|
return e |
||||||
|
}) |
||||||
|
} |
||||||
|
Promise.all(promises).then(_ => { |
||||||
|
data = handleType(data) |
||||||
|
this.modelData = (data.length && data[0].children && data[0].children.length) ? data : [] |
||||||
|
this.modelLoading = false |
||||||
|
}).catch(res => {}) |
||||||
|
}).catch(res => {}) |
||||||
|
}).catch(res => {}) |
||||||
|
}, |
||||||
|
// 把删除了的分类去除 |
||||||
|
|
||||||
|
// 查看模型 |
||||||
|
show(row) { |
||||||
|
this.$router.push(`/addModel?categoryId=${this.$refs.tree.$refs.tree.getCurrentKey()}&id=${row.id}&show=1&model=1`) |
||||||
|
}, |
||||||
|
// 删除模型 |
||||||
|
del(row) { |
||||||
|
this.$confirm("确定要删除吗？", "提示", { |
||||||
|
type: "warning" |
||||||
|
}).then(() => { |
||||||
|
this.$post(this.api.deleteReferenceDemo, [row.id]).then(res => { |
||||||
|
this.$message.success("删除成功") |
||||||
|
this.getData() |
||||||
|
}).catch(res => {}) |
||||||
|
}).catch(() => {}) |
||||||
|
}, |
||||||
|
handleSelectionChange(val) { |
||||||
|
this.multipleSelection = val |
||||||
|
}, |
||||||
|
// 批量删除 |
||||||
|
batchDel() { |
||||||
|
if (this.multipleSelection.length) { |
||||||
|
this.$confirm("确定要删除吗？", "提示", { |
||||||
|
type: "warning" |
||||||
|
}).then(() => { |
||||||
|
let ids = this.multipleSelection.map(e => e.id) |
||||||
|
this.$post(this.api.deleteReferenceDemo, ids).then(res => { |
||||||
|
this.$refs.table.clearSelection() |
||||||
|
this.$message.success("删除成功") |
||||||
|
this.getData() |
||||||
|
}).catch(res => {}) |
||||||
|
}).catch(() => {}) |
||||||
|
} else { |
||||||
|
this.$message.error("请先选择模型 ！") |
||||||
|
} |
||||||
|
}, |
||||||
|
handleCurrentChange(val) { |
||||||
|
this.page = val |
||||||
|
this.$router.push({ |
||||||
|
path: 'backstage', |
||||||
|
query: { |
||||||
|
...this.$route.query, |
||||||
|
page: val |
||||||
|
} |
||||||
|
}) |
||||||
|
this.getData() |
||||||
|
}, |
||||||
|
// 导入模型提交 |
||||||
|
submit() { |
||||||
|
if (this.submiting) return false |
||||||
|
const data = [] |
||||||
|
const systemId = this.systemId |
||||||
|
if (this.$refs.model) { |
||||||
|
const list = this.$refs.model.getCheckedNodes() // 获取选择的分类模型 |
||||||
|
const categoryId = this.$refs.tree.$refs.tree.getCurrentKey() // 获取当前分类 |
||||||
|
if (!list.length) return this.$message.error('请选择模型') |
||||||
|
this.submiting = true |
||||||
|
list.map(e => { |
||||||
|
// 有categoryId的才是模型，只导入模型，不导入分类 |
||||||
|
e.categoryId && data.push({ |
||||||
|
systemId, |
||||||
|
categoryId, |
||||||
|
copyId: e.id |
||||||
|
}) |
||||||
|
}) |
||||||
|
this.$post(this.api.saveReferenceDemo, data).then(res => { |
||||||
|
this.modelVisible = false |
||||||
|
this.initData() |
||||||
|
setTimeout(() => { |
||||||
|
this.submiting = false |
||||||
|
}, 2000) |
||||||
|
}).catch(res => { |
||||||
|
this.submiting = false |
||||||
|
}) |
||||||
|
} else { |
||||||
|
this.submiting = false |
||||||
|
this.modelVisible = false |
||||||
|
} |
||||||
|
} |
||||||
|
} |
||||||
|
}; |
||||||
|
</script> |
||||||
|
<style lang="scss" scoped> |
||||||
|
.wrap { |
||||||
|
display: flex; |
||||||
|
min-height: calc(100vh - 310px); |
||||||
|
padding: 0 24px; |
||||||
|
.side { |
||||||
|
width: 300px; |
||||||
|
padding: 24px 10px 24px 0; |
||||||
|
margin-right: 24px; |
||||||
|
border-right: 1px solid rgba(0, 0, 0, 0.06); |
||||||
|
} |
||||||
|
.right { |
||||||
|
width: calc(100% - 374px); |
||||||
|
padding: 24px; |
||||||
|
} |
||||||
|
} |
||||||
|
.el-input__inner{ |
||||||
|
height: 32px; |
||||||
|
} |
||||||
|
.model-wrap { |
||||||
|
max-height: 400px; |
||||||
|
overflow: auto; |
||||||
|
.none { |
||||||
|
text-align: center; |
||||||
|
color: #8b8b8b; |
||||||
|
} |
||||||
|
} |
||||||
|
</style> |
||||||
@ -0,0 +1,321 @@ |
|||||||
|
<template> |
||||||
|
<div> |
||||||
|
<div> |
||||||
|
<div class="front-switch"> |
||||||
|
<el-switch v-model="modelIsShow" |
||||||
|
:active-value="0" |
||||||
|
:inactive-value="1" |
||||||
|
active-text="内置模型按钮前台展示" |
||||||
|
@change="changeModelStatus"></el-switch> |
||||||
|
</div> |
||||||
|
<div class="flex-between m-b-20"> |
||||||
|
<el-button type="text" |
||||||
|
icon="el-icon-refresh" |
||||||
|
@click="syncModel">同步原始模型列表</el-button> |
||||||
|
<el-button type="text" |
||||||
|
@click="addType(0)">添加</el-button> |
||||||
|
</div> |
||||||
|
<org-tree v-if="orgList.length" |
||||||
|
:data="orgList" |
||||||
|
default-expand-all |
||||||
|
ref="tree" |
||||||
|
node-key="id" |
||||||
|
highlight-current |
||||||
|
:expand-on-click-node="false" |
||||||
|
@node-click="getSingle" |
||||||
|
:props="{children: 'children', label: 'categoryName', isLeaf: 'leaf'}"> |
||||||
|
<span class="custom-tree-node" |
||||||
|
slot-scope="{ node, data }"> |
||||||
|
<span style="display: inline-block; margin-right: 20px">{{ node.label }}</span> |
||||||
|
<span> |
||||||
|
<el-button type="text" |
||||||
|
icon="el-icon-edit-outline" |
||||||
|
@click="editType(data)"> |
||||||
|
</el-button> |
||||||
|
<el-button type="text" |
||||||
|
icon="el-icon-circle-plus-outline" |
||||||
|
@click="addType(node, data)"> |
||||||
|
</el-button> |
||||||
|
<el-button type="text" |
||||||
|
icon="el-icon-delete" |
||||||
|
@click="delType(data)"> |
||||||
|
</el-button> |
||||||
|
</span> |
||||||
|
</span> |
||||||
|
</org-tree> |
||||||
|
<div class="none" |
||||||
|
v-else>暂无数据，请点击添加按钮添加模型分类</div> |
||||||
|
</div> |
||||||
|
|
||||||
|
<el-dialog :title="Form.id ? '编辑分类' : '新增分类'" |
||||||
|
:visible.sync="typeVisible" |
||||||
|
width="24%" |
||||||
|
center |
||||||
|
@close="closeDia" |
||||||
|
:close-on-click-modal="false"> |
||||||
|
<el-form ref="Form" |
||||||
|
:model="Form" |
||||||
|
:rules="rules"> |
||||||
|
<el-form-item prop="categoryName"> |
||||||
|
<el-input placeholder="请输入分类名称" |
||||||
|
v-model="Form.categoryName"></el-input> |
||||||
|
</el-form-item> |
||||||
|
</el-form> |
||||||
|
<span slot="footer" |
||||||
|
class="dialog-footer"> |
||||||
|
<el-button @click="typeVisible = false">取 消</el-button> |
||||||
|
<el-button type="primary" |
||||||
|
@click="submit">确 定</el-button> |
||||||
|
</span> |
||||||
|
</el-dialog> |
||||||
|
</div> |
||||||
|
</template> |
||||||
|
<script> |
||||||
|
import OrgTree from "@/components/org-tree/src/tree"; |
||||||
|
export default { |
||||||
|
props: ["Data"], |
||||||
|
data () { |
||||||
|
return { |
||||||
|
systemId: this.$route.query.systemId, |
||||||
|
modelIsShow: false, |
||||||
|
orgList: [], |
||||||
|
typeVisible: false, |
||||||
|
Form: { |
||||||
|
id: '', |
||||||
|
parentId: '', |
||||||
|
categoryName: '', |
||||||
|
level: '' |
||||||
|
}, |
||||||
|
rules: { |
||||||
|
categoryName: [ |
||||||
|
{ required: true, message: "请输入分类名称", trigger: "blur" } |
||||||
|
] |
||||||
|
} |
||||||
|
}; |
||||||
|
}, |
||||||
|
components: { |
||||||
|
OrgTree |
||||||
|
}, |
||||||
|
mounted () { |
||||||
|
this.getType() |
||||||
|
this.getModelStatus() |
||||||
|
}, |
||||||
|
methods: { |
||||||
|
// 获取分类 |
||||||
|
getType () { |
||||||
|
this.$post(`${this.api.modelClassList}?systemId=${this.systemId}`).then(res => { |
||||||
|
const { data } = res |
||||||
|
this.orgList = data |
||||||
|
data.length && this.$nextTick(() => { |
||||||
|
const categoryId = this.$route.query.categoryId |
||||||
|
this.$refs.tree.setCurrentKey(categoryId || data[0].id) |
||||||
|
this.$router.push({ |
||||||
|
path: 'backstage', |
||||||
|
query: { |
||||||
|
...this.$route.query, |
||||||
|
categoryId: this.$refs.tree.getCurrentKey() |
||||||
|
} |
||||||
|
}).catch(err => { }) |
||||||
|
this.$emit('getData') |
||||||
|
}) |
||||||
|
}).catch(res => { }) |
||||||
|
}, |
||||||
|
// 获取内置模型按钮展示状态 |
||||||
|
getModelStatus () { |
||||||
|
this.$post(`${this.api.checkIsShowBySystemId}?systemId=${this.systemId}`).then(res => { |
||||||
|
this.modelIsShow = res.isShow // 0为展示 1为不展示 |
||||||
|
}).catch(res => { }) |
||||||
|
}, |
||||||
|
// 改变内置模型按钮展示状态 |
||||||
|
changeModelStatus (val) { |
||||||
|
this.$post(`${this.api.modifyIsShowState}?systemId=${this.systemId}&isShow=${val}`).then(res => { }).catch(res => { }) |
||||||
|
}, |
||||||
|
getSingle () { |
||||||
|
this.$router.push({ |
||||||
|
path: 'backstage', |
||||||
|
query: { |
||||||
|
...this.$route.query, |
||||||
|
categoryId: this.$refs.tree.getCurrentKey() |
||||||
|
} |
||||||
|
}).catch(err => { }) |
||||||
|
this.$emit('initData') |
||||||
|
}, |
||||||
|
syncModelData () { |
||||||
|
// 同步原始模型前删除原有数据 |
||||||
|
this.$post(`${this.api.delModelInfoBySystemId}?systemId=${this.systemId}`).then(res => { |
||||||
|
this.$post(`${this.api.synchronizationMdel}?systemId=${this.systemId}`).then(res => { |
||||||
|
this.$router.push({ |
||||||
|
path: 'backstage', |
||||||
|
query: { |
||||||
|
...this.$route.query, |
||||||
|
categoryId: '' |
||||||
|
} |
||||||
|
}) |
||||||
|
this.getType() |
||||||
|
}) |
||||||
|
}).catch(() => { }) |
||||||
|
}, |
||||||
|
syncModel () { |
||||||
|
if (this.orgList.length) { |
||||||
|
this.$confirm('同步后当前的组织架构将会被删除，是否继续？', '提示', { |
||||||
|
type: 'warning' |
||||||
|
}).then(() => { |
||||||
|
this.syncModelData() |
||||||
|
}).catch(() => { }) |
||||||
|
} else { |
||||||
|
this.syncModelData() |
||||||
|
} |
||||||
|
}, |
||||||
|
// 添加分类和模型 |
||||||
|
async addData (id) { |
||||||
|
// 查询源模型分类 |
||||||
|
this.$post(this.api.sourceModelClassification).then(res => { |
||||||
|
const { data } = res |
||||||
|
const systemId = this.systemId |
||||||
|
const promises = [] |
||||||
|
// 递归添加源模型分类及模型 |
||||||
|
const addType = async (list, refId) => { |
||||||
|
for (const e of list) { |
||||||
|
// 用promise储存以添加完后更新数据 |
||||||
|
// promises.push(new Promise(async (resolve, reject) => { |
||||||
|
// 新增分类 |
||||||
|
await this.$post(this.api.saveReferenceCategory, { |
||||||
|
id: '', |
||||||
|
categoryName: e.categoryName, |
||||||
|
systemId, |
||||||
|
level: e.level, |
||||||
|
parentId: refId || id, |
||||||
|
founder: 1 |
||||||
|
}).then(async res => { |
||||||
|
const referenceCategoryId = res.referenceCategoryId // 把新增返回的id作为子级的parentId |
||||||
|
|
||||||
|
// 查询源模型列表 |
||||||
|
promises.push(new Promise((resolve1, reject1) => { |
||||||
|
this.$post(this.api.sysModelDemoList, { |
||||||
|
pageNum: 1, |
||||||
|
pageSize: 10000, |
||||||
|
categoryId: e.id |
||||||
|
}).then(res => { |
||||||
|
let { records } = res.data |
||||||
|
records = records.filter(e => e.postStatus && !e.isOpen) // 只同步已发布且启用的源模型 |
||||||
|
if (records.length) { |
||||||
|
const modelData = [] |
||||||
|
// 处理新增模型需要的参数 |
||||||
|
records.map(e => { |
||||||
|
modelData.push({ |
||||||
|
systemId, |
||||||
|
categoryId: referenceCategoryId, |
||||||
|
copyId: e.id |
||||||
|
}) |
||||||
|
}) |
||||||
|
// 新增模型 |
||||||
|
this.$post(this.api.saveReferenceDemo, modelData).then(res => { |
||||||
|
// resolve() |
||||||
|
resolve1() |
||||||
|
}).catch(res => { |
||||||
|
// reject() |
||||||
|
reject1() |
||||||
|
}) |
||||||
|
} else { |
||||||
|
// resolve() |
||||||
|
} |
||||||
|
e.children = [...e.children, ...records] |
||||||
|
}).catch(res => { |
||||||
|
// reject() |
||||||
|
}) |
||||||
|
})) |
||||||
|
|
||||||
|
// 如果有子级，则递归循环 |
||||||
|
this.$nextTick(() => { |
||||||
|
e.children && e.children.length && addType(e.children, res.referenceCategoryId) |
||||||
|
}) |
||||||
|
}).catch(res => { |
||||||
|
// reject() |
||||||
|
}) |
||||||
|
// })) |
||||||
|
} |
||||||
|
} |
||||||
|
addType(data[0].children, id) |
||||||
|
Promise.all(promises).then(_ => { |
||||||
|
setTimeout(this.getType, 500) |
||||||
|
}) |
||||||
|
}).catch(res => { }) |
||||||
|
}, |
||||||
|
// 添加分类 |
||||||
|
addType (node, data) { |
||||||
|
this.typeVisible = true |
||||||
|
this.Form.parentId = data ? data.id : 0 |
||||||
|
this.Form.level = node ? node.level : 0 |
||||||
|
}, |
||||||
|
// 编辑分类 |
||||||
|
editType (data) { |
||||||
|
this.Form.id = data.id |
||||||
|
this.Form.parentId = data ? data.parentId : 0 |
||||||
|
this.Form.categoryName = data.categoryName |
||||||
|
this.typeVisible = true |
||||||
|
}, |
||||||
|
// 保存分类 |
||||||
|
submit () { |
||||||
|
this.$refs['Form'].validate((valid) => { |
||||||
|
if (valid) { |
||||||
|
const form = this.Form |
||||||
|
const data = { |
||||||
|
id: form.id, |
||||||
|
parentId: form.parentId, |
||||||
|
categoryName: form.categoryName, |
||||||
|
systemId: this.systemId, |
||||||
|
founder: 1 |
||||||
|
} |
||||||
|
if (data.id) { |
||||||
|
this.$post(this.api.updateModelClass, data).then(res => { |
||||||
|
this.$message.success("编辑成功") |
||||||
|
this.typeVisible = false |
||||||
|
this.getType() |
||||||
|
}).catch(res => { }) |
||||||
|
} else { |
||||||
|
data.level = form.level |
||||||
|
this.$post(this.api.saveReferenceCategory, data).then(res => { |
||||||
|
this.$message.success("添加成功") |
||||||
|
this.typeVisible = false |
||||||
|
this.getType() |
||||||
|
}).catch(res => { }) |
||||||
|
} |
||||||
|
} |
||||||
|
}) |
||||||
|
}, |
||||||
|
closeDia () { |
||||||
|
this.$refs.Form.resetFields() |
||||||
|
this.Form = { |
||||||
|
id: '', |
||||||
|
parentId: '', |
||||||
|
categoryName: '' |
||||||
|
} |
||||||
|
}, |
||||||
|
// 删除分类 |
||||||
|
delType (item) { |
||||||
|
this.$confirm("确定要删除分类吗？", "提示", { |
||||||
|
type: "warning" |
||||||
|
}).then(() => { |
||||||
|
this.$post(`${this.api.deleteModelClass}?categoryId=${item.id}`).then(res => { |
||||||
|
this.$message.success("删除成功") |
||||||
|
this.$emit('initData') |
||||||
|
this.getType() |
||||||
|
}).catch(res => { }) |
||||||
|
}).catch(() => { }) |
||||||
|
} |
||||||
|
} |
||||||
|
}; |
||||||
|
</script> |
||||||
|
<style lang="scss" scoped> |
||||||
|
.front-switch { |
||||||
|
padding-bottom: 10px; |
||||||
|
margin-bottom: 5px; |
||||||
|
border-bottom: 1px solid #f0f0f0; |
||||||
|
} |
||||||
|
.none { |
||||||
|
margin-top: 20px; |
||||||
|
text-align: center; |
||||||
|
color: #909399; |
||||||
|
font-size: 12px; |
||||||
|
} |
||||||
|
</style> |
||||||
@ -0,0 +1,260 @@ |
|||||||
|
<template> |
||||||
|
<div class="wrap"> |
||||||
|
<div class="side"> |
||||||
|
<org ref="tree" |
||||||
|
@initData="initData" |
||||||
|
@getData="getData"></org> |
||||||
|
</div> |
||||||
|
|
||||||
|
<div class="right"> |
||||||
|
<h6 class="p-title">筛选</h6> |
||||||
|
<div class="tool"> |
||||||
|
<ul class="filter"> |
||||||
|
<li> |
||||||
|
<el-input placeholder="请输入模型名称" |
||||||
|
prefix-icon="el-icon-search" |
||||||
|
v-model.trim="keyword" |
||||||
|
clearable></el-input> |
||||||
|
</li> |
||||||
|
</ul> |
||||||
|
<div> |
||||||
|
<el-button type="primary" |
||||||
|
round |
||||||
|
@click="add">新增模型</el-button> |
||||||
|
<el-button type="primary" |
||||||
|
round |
||||||
|
@click="batchDel">批量删除</el-button> |
||||||
|
<el-button type="primary" |
||||||
|
round |
||||||
|
@click="batchOff(1)">批量禁用</el-button> |
||||||
|
<el-button type="primary" |
||||||
|
round |
||||||
|
@click="batchOff(0)">批量开启</el-button> |
||||||
|
</div> |
||||||
|
</div> |
||||||
|
|
||||||
|
<el-table :data="listData" |
||||||
|
class="table" |
||||||
|
ref="table" |
||||||
|
stripe |
||||||
|
header-align="center" |
||||||
|
@selection-change="handleSelectionChange"> |
||||||
|
<el-table-column type="selection" |
||||||
|
width="55" |
||||||
|
align="center"></el-table-column> |
||||||
|
<el-table-column type="index" |
||||||
|
label="序号" |
||||||
|
width="55" |
||||||
|
align="center"></el-table-column> |
||||||
|
<el-table-column prop="modelName" |
||||||
|
label="模型名称" |
||||||
|
align="center"></el-table-column> |
||||||
|
<el-table-column v-if="isTopLevel" |
||||||
|
prop="categoryName" |
||||||
|
label="分类" |
||||||
|
width="150" |
||||||
|
align="center"></el-table-column> |
||||||
|
<el-table-column prop="modifyName" |
||||||
|
label="编辑人" |
||||||
|
align="center"></el-table-column> |
||||||
|
<el-table-column prop="updateTime" |
||||||
|
label="最新编辑时间" |
||||||
|
width="150" |
||||||
|
align="center"></el-table-column> |
||||||
|
<el-table-column prop="workNumber" |
||||||
|
label="状态" |
||||||
|
width="100" |
||||||
|
align="center"> |
||||||
|
<template slot-scope="scope"> |
||||||
|
{{ scope.row.postStatus ? '已发布' : '草稿' }} |
||||||
|
</template> |
||||||
|
</el-table-column> |
||||||
|
<el-table-column label="操作" |
||||||
|
width="230"> |
||||||
|
<template slot-scope="scope"> |
||||||
|
<el-button type="text" |
||||||
|
@click="show(scope.row)">查看</el-button> |
||||||
|
<el-button type="text" |
||||||
|
@click="edit(scope.row)">编辑</el-button> |
||||||
|
<el-button type="text" |
||||||
|
@click="del(scope.row)">删除</el-button> |
||||||
|
<el-switch v-if="scope.row.postStatus" |
||||||
|
v-model="scope.row.isOpen" |
||||||
|
:active-value="0" |
||||||
|
:inactive-value="1" |
||||||
|
style="margin: 0 10px 0 5px" |
||||||
|
:active-text="scope.row.isOpen ? '禁用' : '启用'" |
||||||
|
@change="switchOff($event,scope.row,scope.$index)"></el-switch> |
||||||
|
</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> |
||||||
|
</div> |
||||||
|
</div> |
||||||
|
</div> |
||||||
|
</template> |
||||||
|
<script> |
||||||
|
import org from "./sourceType" |
||||||
|
export default { |
||||||
|
data () { |
||||||
|
return { |
||||||
|
systemId: this.$route.query.systemId, |
||||||
|
isTopLevel: true, // 是否是在顶级分类 |
||||||
|
listData: [], |
||||||
|
keyword: "", |
||||||
|
page: +this.$route.query.page || 1, |
||||||
|
pageSize: 10, |
||||||
|
total: 0, |
||||||
|
multipleSelection: [] |
||||||
|
}; |
||||||
|
}, |
||||||
|
components: { |
||||||
|
org |
||||||
|
}, |
||||||
|
watch: { |
||||||
|
keyword: function (val) { |
||||||
|
clearTimeout(this.searchTimer); |
||||||
|
this.searchTimer = setTimeout(() => { |
||||||
|
this.initData() |
||||||
|
}, 500) |
||||||
|
} |
||||||
|
}, |
||||||
|
mounted () { |
||||||
|
|
||||||
|
}, |
||||||
|
methods: { |
||||||
|
// 获取列表 |
||||||
|
getData () { |
||||||
|
const curNode = this.$refs.tree.$refs.tree.getCurrentNode() // 获取当前选中的分类 |
||||||
|
this.isTopLevel = !curNode.level |
||||||
|
// 如果是首级，要调另一个接口 |
||||||
|
if (!curNode.level) { |
||||||
|
this.$post(this.api.getAllModelListBySys, { |
||||||
|
modelName: this.keyword, |
||||||
|
pageNum: this.page, |
||||||
|
pageSize: this.pageSize |
||||||
|
}).then(res => { |
||||||
|
this.listData = res.data.records |
||||||
|
this.total = res.data.total |
||||||
|
}).catch(res => { }) |
||||||
|
} else { |
||||||
|
this.$post(this.api.queryTheModelOfOurSchool, { |
||||||
|
modelName: this.keyword, |
||||||
|
pageNum: this.page, |
||||||
|
pageSize: this.pageSize, |
||||||
|
categoryId: curNode.id, |
||||||
|
systemId: this.systemId |
||||||
|
}).then(res => { |
||||||
|
this.listData = res.data.records |
||||||
|
this.total = res.data.total |
||||||
|
}).catch(res => { }) |
||||||
|
} |
||||||
|
}, |
||||||
|
initData () { |
||||||
|
this.$refs.table.clearSelection() |
||||||
|
this.page = 1 |
||||||
|
this.getData() |
||||||
|
}, |
||||||
|
// 新增 |
||||||
|
add () { |
||||||
|
this.$router.push(`addModel?categoryId=${this.$refs.tree.$refs.tree.getCurrentKey()}&systemId=${this.systemId}`) |
||||||
|
}, |
||||||
|
// 批量删除 |
||||||
|
batchDel () { |
||||||
|
if (this.multipleSelection.length) { |
||||||
|
// 批量删除 |
||||||
|
let ids = this.multipleSelection.map(e => e.id) |
||||||
|
this.$confirm("确定要删除吗？", "提示", { |
||||||
|
type: "warning" |
||||||
|
}).then(() => { |
||||||
|
this.$post(this.api.deleteSysModelDemo, ids).then(res => { |
||||||
|
this.$message.success('删除成功') |
||||||
|
this.getData() |
||||||
|
}).catch(res => { }) |
||||||
|
}).catch(() => { }) |
||||||
|
} else { |
||||||
|
this.$message.error("请先选择模型 ！") |
||||||
|
} |
||||||
|
}, |
||||||
|
// 批量禁用启用 |
||||||
|
batchOff (isOpen) { |
||||||
|
const off = isOpen === 0 |
||||||
|
if (this.multipleSelection.length) { |
||||||
|
// 批量删除 |
||||||
|
let ids = this.multipleSelection.map(e => e.id) |
||||||
|
this.$confirm(`确定要${off ? '启用' : '禁用'}吗？`, "提示", { |
||||||
|
type: "warning" |
||||||
|
}).then(() => { |
||||||
|
this.$post(`${this.api.bulkDisable}?isOpen=${isOpen}`, ids).then(res => { |
||||||
|
this.$message.success(`${off ? '启用' : '禁用'}成功`) |
||||||
|
this.getData() |
||||||
|
}).catch(res => { }) |
||||||
|
}).catch(() => { }) |
||||||
|
} else { |
||||||
|
this.$message.error("请先选择模型 ！") |
||||||
|
} |
||||||
|
}, |
||||||
|
// 查看 |
||||||
|
show (row) { |
||||||
|
this.$router.push(`/addModel?categoryId=${this.$refs.tree.$refs.tree.getCurrentKey()}&id=${row.id}&show=1`) |
||||||
|
}, |
||||||
|
// 编辑 |
||||||
|
edit (row) { |
||||||
|
this.$router.push(`/addModel?categoryId=${this.$refs.tree.$refs.tree.getCurrentKey()}&id=${row.id}&postStatus=${row.postStatus}`) |
||||||
|
}, |
||||||
|
del (row) { |
||||||
|
this.$confirm("确定要删除吗？", "提示", { |
||||||
|
type: "warning" |
||||||
|
}).then(() => { |
||||||
|
this.$post(this.api.deleteSysModelDemo, [row.id]).then(res => { |
||||||
|
this.$message.success('删除成功') |
||||||
|
this.getData() |
||||||
|
}).catch(res => { }) |
||||||
|
}).catch(() => { }) |
||||||
|
}, |
||||||
|
switchOff (val, row, index) { |
||||||
|
this.$post(`${this.api.bulkDisable}?isOpen=${val}`, [row.id]).then(res => { |
||||||
|
this.$message.success(val ? '禁用成功' : '启用成功') |
||||||
|
}).catch(res => { }) |
||||||
|
}, |
||||||
|
handleSelectionChange (val) { |
||||||
|
this.multipleSelection = val |
||||||
|
}, |
||||||
|
handleCurrentChange (val) { |
||||||
|
this.page = val |
||||||
|
this.$router.push({ |
||||||
|
path: 'backstage', |
||||||
|
query: { |
||||||
|
...this.$route.query, |
||||||
|
page: val |
||||||
|
} |
||||||
|
}) |
||||||
|
this.getData() |
||||||
|
} |
||||||
|
} |
||||||
|
}; |
||||||
|
</script> |
||||||
|
<style lang="scss" scoped> |
||||||
|
.wrap { |
||||||
|
display: flex; |
||||||
|
padding: 0 24px; |
||||||
|
.side { |
||||||
|
width: 300px; |
||||||
|
padding: 24px 10px 24px 0; |
||||||
|
margin-right: 24px; |
||||||
|
border-right: 1px solid rgba(0, 0, 0, 0.06); |
||||||
|
} |
||||||
|
.right { |
||||||
|
width: calc(100% - 374px); |
||||||
|
padding: 24px; |
||||||
|
} |
||||||
|
} |
||||||
|
.el-input__inner { |
||||||
|
height: 32px; |
||||||
|
} |
||||||
|
</style> |
||||||
@ -0,0 +1,180 @@ |
|||||||
|
<template> |
||||||
|
<div> |
||||||
|
<div> |
||||||
|
<org-tree :data="orgList" |
||||||
|
default-expand-all |
||||||
|
ref="tree" |
||||||
|
node-key="id" |
||||||
|
highlight-current |
||||||
|
:expand-on-click-node="false" |
||||||
|
@node-click="getSingle" |
||||||
|
:props="{children: 'children', label: 'categoryName', isLeaf: 'leaf'}"> |
||||||
|
<span class="custom-tree-node" |
||||||
|
slot-scope="{ node, data }"> |
||||||
|
<span style="display: inline-block; margin-right: 20px">{{ node.label }}</span> |
||||||
|
<span> |
||||||
|
<el-button v-if="node.level > 1" |
||||||
|
type="text" |
||||||
|
icon="el-icon-edit-outline" |
||||||
|
@click="editType(data)"> |
||||||
|
</el-button> |
||||||
|
<el-button type="text" |
||||||
|
icon="el-icon-circle-plus-outline" |
||||||
|
@click="addType(node, data)"> |
||||||
|
</el-button> |
||||||
|
<el-button v-if="node.level > 1" |
||||||
|
type="text" |
||||||
|
icon="el-icon-delete" |
||||||
|
@click="delType(data)"> |
||||||
|
</el-button> |
||||||
|
</span> |
||||||
|
</span> |
||||||
|
</org-tree> |
||||||
|
</div> |
||||||
|
|
||||||
|
<el-dialog :title="Form.id ? '编辑分类' : '新增分类'" |
||||||
|
:visible.sync="typeVisible" |
||||||
|
width="24%" |
||||||
|
center |
||||||
|
@close="closeDia" |
||||||
|
:close-on-click-modal="false"> |
||||||
|
<el-form ref="Form" |
||||||
|
:model="Form" |
||||||
|
:rules="rules"> |
||||||
|
<el-form-item prop="categoryName"> |
||||||
|
<el-input placeholder="请输入分类名称" |
||||||
|
v-model="Form.categoryName"></el-input> |
||||||
|
</el-form-item> |
||||||
|
</el-form> |
||||||
|
<span slot="footer" |
||||||
|
class="dialog-footer"> |
||||||
|
<el-button @click="typeVisible = false">取 消</el-button> |
||||||
|
<el-button type="primary" |
||||||
|
@click="submit">确 定</el-button> |
||||||
|
</span> |
||||||
|
</el-dialog> |
||||||
|
</div> |
||||||
|
</template> |
||||||
|
<script> |
||||||
|
import OrgTree from "@/components/org-tree/src/tree"; |
||||||
|
export default { |
||||||
|
props: ["Data"], |
||||||
|
data () { |
||||||
|
return { |
||||||
|
systemId: this.$route.query.systemId, |
||||||
|
orgList: [], |
||||||
|
typeVisible: false, |
||||||
|
Form: { |
||||||
|
id: '', |
||||||
|
parentId: '', |
||||||
|
categoryName: '', |
||||||
|
level: '' |
||||||
|
}, |
||||||
|
rules: { |
||||||
|
categoryName: [ |
||||||
|
{ required: true, message: "请输入分类名称", trigger: "blur" } |
||||||
|
] |
||||||
|
} |
||||||
|
}; |
||||||
|
}, |
||||||
|
components: { |
||||||
|
OrgTree |
||||||
|
}, |
||||||
|
mounted () { |
||||||
|
this.getType() |
||||||
|
}, |
||||||
|
methods: { |
||||||
|
getType () { |
||||||
|
this.$post(`${this.api.schoolModelClassification}?systemId=${this.systemId}&type=1`).then(res => { |
||||||
|
const { data } = res |
||||||
|
this.orgList = data |
||||||
|
data.length && this.$nextTick(() => { |
||||||
|
const categoryId = this.$route.query.categoryId |
||||||
|
this.$refs.tree.setCurrentKey(categoryId || data[0].id) |
||||||
|
this.$router.push({ |
||||||
|
path: 'backstage', |
||||||
|
query: { |
||||||
|
...this.$route.query, |
||||||
|
categoryId: this.$refs.tree.getCurrentKey() |
||||||
|
} |
||||||
|
}).catch(err => { }) |
||||||
|
this.$emit('getData') |
||||||
|
}) |
||||||
|
}).catch(res => { }) |
||||||
|
}, |
||||||
|
getSingle () { |
||||||
|
this.$router.push({ |
||||||
|
path: 'backstage', |
||||||
|
query: { |
||||||
|
...this.$route.query, |
||||||
|
categoryId: this.$refs.tree.getCurrentKey() |
||||||
|
} |
||||||
|
}).catch(err => { }) |
||||||
|
this.$emit('initData') |
||||||
|
}, |
||||||
|
// 添加分类 |
||||||
|
addType (node, data) { |
||||||
|
this.typeVisible = true |
||||||
|
this.Form.parentId = data ? data.id : 0 |
||||||
|
this.Form.level = node ? node.level : 0 |
||||||
|
}, |
||||||
|
// 编辑分类 |
||||||
|
editType (data) { |
||||||
|
this.Form.id = data.id |
||||||
|
this.Form.parentId = data ? data.parentId : 0 |
||||||
|
this.Form.categoryName = data.categoryName |
||||||
|
this.typeVisible = true |
||||||
|
}, |
||||||
|
// 保存分类 |
||||||
|
submit () { |
||||||
|
this.$refs['Form'].validate((valid) => { |
||||||
|
if (valid) { |
||||||
|
const form = this.Form |
||||||
|
const data = { |
||||||
|
id: form.id, |
||||||
|
parentId: form.parentId, |
||||||
|
categoryName: form.categoryName, |
||||||
|
systemId: this.systemId |
||||||
|
} |
||||||
|
if (data.id) { |
||||||
|
this.$post(this.api.updateSourceModelCategory, data).then(res => { |
||||||
|
this.$message.success("编辑成功") |
||||||
|
this.typeVisible = false |
||||||
|
this.getType() |
||||||
|
}).catch(res => { }) |
||||||
|
} else { |
||||||
|
data.level = form.level |
||||||
|
this.$post(this.api.categorySave, data).then(res => { |
||||||
|
this.$message.success("添加成功") |
||||||
|
this.typeVisible = false |
||||||
|
this.getType() |
||||||
|
}).catch(res => { }) |
||||||
|
} |
||||||
|
} |
||||||
|
}) |
||||||
|
}, |
||||||
|
closeDia () { |
||||||
|
this.$refs.Form.resetFields() |
||||||
|
this.Form = { |
||||||
|
id: '', |
||||||
|
parentId: '', |
||||||
|
categoryName: '' |
||||||
|
} |
||||||
|
}, |
||||||
|
// 删除分类 |
||||||
|
delType (item) { |
||||||
|
this.$confirm("确定要删除分类吗？", "提示", { |
||||||
|
type: "warning" |
||||||
|
}).then(() => { |
||||||
|
this.$post(`${this.api.deleteSourceModelCategory}?categoryId=${item.id}`).then(res => { |
||||||
|
this.$message.success("删除成功") |
||||||
|
this.$emit('initData') |
||||||
|
this.getType() |
||||||
|
}).catch(res => { }) |
||||||
|
}).catch(() => { }) |
||||||
|
} |
||||||
|
} |
||||||
|
}; |
||||||
|
</script> |
||||||
|
<style lang="scss" scoped> |
||||||
|
</style> |
||||||
@ -0,0 +1,169 @@ |
|||||||
|
<template> |
||||||
|
<div> |
||||||
|
<div class="page"> |
||||||
|
<h6 class="p-title">筛选</h6> |
||||||
|
<div class="tool mul"> |
||||||
|
<ul class="filter"> |
||||||
|
<li> |
||||||
|
<label>系统类型</label> |
||||||
|
<el-select v-model="systemType" |
||||||
|
clearable |
||||||
|
placeholder="请选择系统类型" |
||||||
|
@change="initData"> |
||||||
|
<el-option v-for="(item,index) in systemTypeList" |
||||||
|
:key="index" |
||||||
|
:label="item.label" |
||||||
|
:value="item.value"></el-option> |
||||||
|
</el-select> |
||||||
|
</li> |
||||||
|
<li> |
||||||
|
<el-input placeholder="请输入系统名称" |
||||||
|
prefix-icon="el-icon-search" |
||||||
|
v-model.trim="systemSearch" |
||||||
|
clearable></el-input> |
||||||
|
</li> |
||||||
|
</ul> |
||||||
|
</div> |
||||||
|
|
||||||
|
<el-table :data="systemData" |
||||||
|
class="table" |
||||||
|
stripe |
||||||
|
header-align="center"> |
||||||
|
<el-table-column type="index" |
||||||
|
width="100" |
||||||
|
label="序号" |
||||||
|
align="center"> |
||||||
|
</el-table-column> |
||||||
|
<el-table-column prop="systemName" |
||||||
|
label="系统名称" |
||||||
|
align="center"></el-table-column> |
||||||
|
<el-table-column prop="type" |
||||||
|
label="系统类型" |
||||||
|
align="center"> |
||||||
|
<template slot-scope="scope"> |
||||||
|
{{ systemTypeKeys[scope.row.type] }} |
||||||
|
</template> |
||||||
|
</el-table-column> |
||||||
|
<el-table-column prop="state" |
||||||
|
label="系统状态" |
||||||
|
align="center"> |
||||||
|
<template slot-scope="scope"> |
||||||
|
{{ systemStatusKeys[scope.row.state] }} |
||||||
|
</template> |
||||||
|
</el-table-column> |
||||||
|
<el-table-column prop="payamount" |
||||||
|
label="系统后台" |
||||||
|
align="center"> |
||||||
|
<template slot-scope="scope"> |
||||||
|
<el-button type="text" |
||||||
|
@click="toBackstage(scope.row)" |
||||||
|
v-if="scope.row.systemId !== '11'" |
||||||
|
v-auth="'/configure:系统后台进入'">进入</el-button> |
||||||
|
</template> |
||||||
|
</el-table-column> |
||||||
|
</el-table> |
||||||
|
<div class="pagination"> |
||||||
|
<el-pagination background |
||||||
|
@current-change="handleCurrentChange" |
||||||
|
layout="total, prev, pager, next" |
||||||
|
:total="totals"> |
||||||
|
</el-pagination> |
||||||
|
</div> |
||||||
|
</div> |
||||||
|
|
||||||
|
</div> |
||||||
|
</template> |
||||||
|
|
||||||
|
<script> |
||||||
|
import Setting from "@/setting"; |
||||||
|
export default { |
||||||
|
data () { |
||||||
|
return { |
||||||
|
systemAttribution: "", |
||||||
|
systemType: "", |
||||||
|
systemSearch: "", |
||||||
|
searchTimer: null, |
||||||
|
systemData: [{}], |
||||||
|
totals: 0, |
||||||
|
systemBelongKeys: { |
||||||
|
1: '外部产品', |
||||||
|
0: '内部系统' |
||||||
|
}, |
||||||
|
systemTypeList: [ |
||||||
|
{ |
||||||
|
label: "编程类", |
||||||
|
value: 0 |
||||||
|
}, |
||||||
|
{ |
||||||
|
label: "流程类", |
||||||
|
value: 1 |
||||||
|
} |
||||||
|
], |
||||||
|
systemTypeKeys: { |
||||||
|
0: '编程类', |
||||||
|
1: '流程类' |
||||||
|
}, |
||||||
|
systemStatusKeys: { |
||||||
|
0: '运行中', |
||||||
|
1: '默认' |
||||||
|
}, |
||||||
|
pageNo: +this.$route.query.page || 1, |
||||||
|
pageSize: 10 |
||||||
|
}; |
||||||
|
}, |
||||||
|
watch: { |
||||||
|
systemSearch: function (val) { |
||||||
|
clearTimeout(this.searchTimer); |
||||||
|
this.searchTimer = setTimeout(() => { |
||||||
|
this.initData(); |
||||||
|
}, 500); |
||||||
|
} |
||||||
|
}, |
||||||
|
mounted () { |
||||||
|
this.getData(); |
||||||
|
}, |
||||||
|
methods: { |
||||||
|
initData () { |
||||||
|
this.pageNum = 1; |
||||||
|
this.getData(); |
||||||
|
}, |
||||||
|
getData () { |
||||||
|
let data = { |
||||||
|
belong: this.systemAttribution, |
||||||
|
type: this.systemType, |
||||||
|
systemName: this.systemSearch, |
||||||
|
pageNum: this.pageNo, |
||||||
|
pageSize: this.pageSize, |
||||||
|
supplierId: '' |
||||||
|
}; |
||||||
|
this.$post(this.api.getAllService, data).then(res => { |
||||||
|
this.systemData = res.serviceList.records; |
||||||
|
this.totals = res.serviceList.total; |
||||||
|
}).catch(res => { |
||||||
|
}); |
||||||
|
}, |
||||||
|
handleCurrentChange (val) { |
||||||
|
this.pageNo = val; |
||||||
|
this.$router.push(`list?page=${val}`) |
||||||
|
this.getData(); |
||||||
|
}, |
||||||
|
edit (row) { |
||||||
|
this.$router.push('configure'); |
||||||
|
}, |
||||||
|
// 进入系统后台 |
||||||
|
toBackstage (row) { |
||||||
|
this.$router.push(`backstage?systemId=${row.systemId}&show=1&name=${row.systemName}`) |
||||||
|
}, |
||||||
|
} |
||||||
|
}; |
||||||
|
</script> |
||||||
|
|
||||||
|
<style lang="scss" scoped> |
||||||
|
.card { |
||||||
|
min-height: calc(100vh - 300px); |
||||||
|
} |
||||||
|
.mag { |
||||||
|
margin-right: 20px; |
||||||
|
} |
||||||
|
</style> |
||||||
|
|
||||||
@ -1,108 +1,114 @@ |
|||||||
<template> |
<template> |
||||||
<!-- 报名人员 --> |
<!-- 报名人员 --> |
||||||
<div class="page-content" style="padding: 24px"> |
<div class="page-content" |
||||||
<el-collapse v-model="curStep"> |
style="padding: 24px"> |
||||||
<el-collapse-item v-for="(item, i) in list" :key="i" :title="item.stageName" :name="item.stageId"> |
<el-collapse v-if="list.length" |
||||||
<div class="line"> |
v-model="curStep"> |
||||||
<span>比赛方式：{{ item.methodName }}</span> |
<el-collapse-item v-for="(item, i) in list" |
||||||
<span>比赛形式：{{ item.competitionType ? '团队赛' : '个人赛' }}</span> |
:key="i" |
||||||
<span>赛制：{{ item.ruleName }}</span> |
:title="item.stageName" |
||||||
<span>状态：{{ item.status }}</span> |
:name="item.stageId"> |
||||||
<span>竞赛起止时间：{{ item.startTime + ' ~ ' + item.endTime }}</span> |
<div class="line"> |
||||||
<div> |
<span>比赛方式：{{ item.methodName }}</span> |
||||||
<el-button type="primary" @click="toRank(item, i)">排名</el-button> |
<span>比赛形式：{{ item.competitionType ? '团队赛' : '个人赛' }}</span> |
||||||
<el-button @click="toArch(item)">成绩管理</el-button> |
<span>赛制：{{ item.ruleName }}</span> |
||||||
</div> |
<span>状态：{{ item.status }}</span> |
||||||
|
<span>竞赛起止时间：{{ item.startTime + ' ~ ' + item.endTime }}</span> |
||||||
|
<div> |
||||||
|
<el-button type="primary" |
||||||
|
@click="toRank(item, i)">排名</el-button> |
||||||
|
<el-button @click="toArch(item)">成绩管理</el-button> |
||||||
</div> |
</div> |
||||||
</el-collapse-item> |
</div> |
||||||
</el-collapse> |
</el-collapse-item> |
||||||
</div> |
</el-collapse> |
||||||
|
</div> |
||||||
</template> |
</template> |
||||||
|
|
||||||
<script> |
<script> |
||||||
import util from "@/libs/util"; |
import util from "@/libs/util"; |
||||||
import Const from '@/const/match' |
import Const from '@/const/match' |
||||||
export default { |
export default { |
||||||
name: "matchArch", |
name: "matchArch", |
||||||
data() { |
data () { |
||||||
return { |
return { |
||||||
id: +this.$route.query.id, |
id: +this.$route.query.id, |
||||||
list: [], |
list: [], |
||||||
form: {}, |
form: {}, |
||||||
timer: null, |
timer: null, |
||||||
curStep: [] |
curStep: [] |
||||||
}; |
}; |
||||||
|
}, |
||||||
|
mounted () { |
||||||
|
this.$once('hook:beforeDestroy', function () { |
||||||
|
clearInterval(this.timer) |
||||||
|
}) |
||||||
|
this.getData() |
||||||
|
}, |
||||||
|
methods: { |
||||||
|
getData () { |
||||||
|
this.$post(`${this.api.getCompetition}?competitionId=${this.id}`).then(({ competition }) => { |
||||||
|
this.form = competition |
||||||
|
this.timer = setInterval(this.handleStatus, 1000) |
||||||
|
this.getArch() |
||||||
|
}).catch(err => { }) |
||||||
}, |
}, |
||||||
mounted() { |
getArch () { |
||||||
this.$once('hook:beforeDestroy', function() { |
this.$post(this.api.detailsOfCompetitionStage, { |
||||||
clearInterval(this.timer) |
pageNum: 1, |
||||||
}) |
pageSize: 100, |
||||||
this.getData() |
contestId: this.id, |
||||||
|
}).then(({ page }) => { |
||||||
|
const list = page.records |
||||||
|
list.map(e => { |
||||||
|
e.methodName = Const.methods.find(n => n.id === e.method).name |
||||||
|
e.ruleName = Const.rules.find(n => n.id === e.rule).name |
||||||
|
}) |
||||||
|
this.curStep = list.map(e => e.stageId) |
||||||
|
this.list = list |
||||||
|
}).catch(res => { }); |
||||||
}, |
}, |
||||||
methods: { |
// 报名时间、比赛时间、状态处理 |
||||||
getData() { |
handleStatus () { |
||||||
this.$post(`${this.api.getCompetition}?competitionId=${this.id}`).then(({ competition }) => { |
const now = new Date() |
||||||
this.form = competition |
this.form.competitionStage.map(e => { |
||||||
this.timer = setInterval(this.handleStatus, 1000) |
const startTime = new Date(e.startTime) |
||||||
this.getArch() |
const endTime = new Date(e.endTime) |
||||||
}).catch(err => {}) |
const item = this.list.find(n => n.stageId == e.stageId) |
||||||
}, |
if (item) { |
||||||
getArch() { |
if (now < startTime) { |
||||||
this.$post(this.api.detailsOfCompetitionStage, { |
this.$set(item, 'status', '未开始') |
||||||
pageNum: 1, |
} else if (now >= startTime && now <= endTime) { |
||||||
pageSize: 100, |
this.$set(item, 'status', '比赛中') |
||||||
contestId: this.id, |
} else if (now > endTime) { |
||||||
}).then(({ page }) => { |
this.$set(item, 'status', '已完成') |
||||||
const list = page.records |
|
||||||
list.map(e => { |
|
||||||
e.methodName = Const.methods.find(n => n.id === e.method).name |
|
||||||
e.ruleName = Const.rules.find(n => n.id === e.rule).name |
|
||||||
}) |
|
||||||
this.curStep = list.map(e => e.stageId) |
|
||||||
this.list = list |
|
||||||
}).catch(res => {}); |
|
||||||
}, |
|
||||||
// 报名时间、比赛时间、状态处理 |
|
||||||
handleStatus() { |
|
||||||
const now = new Date() |
|
||||||
this.form.competitionStage.map(e => { |
|
||||||
const startTime = new Date(e.startTime) |
|
||||||
const endTime = new Date(e.endTime) |
|
||||||
const item = this.list.find(n => n.stageId == e.stageId) |
|
||||||
if (item) { |
|
||||||
if (now < startTime) { |
|
||||||
this.$set(item, 'status', '未开始') |
|
||||||
} else if (now >= startTime && now <= endTime) { |
|
||||||
this.$set(item, 'status', '比赛中') |
|
||||||
} else if (now > endTime) { |
|
||||||
this.$set(item, 'status', '已完成') |
|
||||||
} |
|
||||||
} |
} |
||||||
}) |
} |
||||||
}, |
}) |
||||||
// 排名 |
}, |
||||||
toRank(row, i) { |
// 排名 |
||||||
this.$router.push(`rank?id=${this.id}&stageId=${row.stageId}&index=${i}&method=${row.method}&competitionType=${row.competitionType}&rule=${row.rule}`) |
toRank (row, i) { |
||||||
}, |
this.$router.push(`rank?id=${this.id}&stageId=${row.stageId}&index=${i}&method=${row.method}&competitionType=${row.competitionType}&rule=${row.rule}`) |
||||||
// 成绩管理 |
}, |
||||||
toArch(row) { |
// 成绩管理 |
||||||
this.$router.push(`archList?id=${this.id}&stageId=${row.stageId}&method=${row.method}&competitionType=${row.competitionType}`) |
toArch (row) { |
||||||
} |
this.$router.push(`archList?id=${this.id}&stageId=${row.stageId}&method=${row.method}&competitionType=${row.competitionType}`) |
||||||
} |
} |
||||||
|
} |
||||||
}; |
}; |
||||||
</script> |
</script> |
||||||
|
|
||||||
<style lang="scss" scoped> |
<style lang="scss" scoped> |
||||||
/deep/.el-collapse-item__header { |
/deep/.el-collapse-item__header { |
||||||
font-size: 16px; |
font-size: 16px; |
||||||
color: #333; |
color: #333; |
||||||
} |
} |
||||||
.line { |
.line { |
||||||
display: flex; |
display: flex; |
||||||
justify-content: space-around; |
justify-content: space-around; |
||||||
align-items: center; |
align-items: center; |
||||||
span { |
span { |
||||||
margin-right: 30px; |
margin-right: 30px; |
||||||
} |
} |
||||||
} |
} |
||||||
</style> |
</style> |
||||||
File diff suppressed because it is too large
Load Diff
@ -0,0 +1,35 @@ |
|||||||
|
import BasicLayout from "@/layouts/home"; |
||||||
|
|
||||||
|
const meta = {}; |
||||||
|
|
||||||
|
const pre = "expSystem-"; |
||||||
|
|
||||||
|
export default { |
||||||
|
path: "/expSystem", |
||||||
|
name: "expSystem", |
||||||
|
redirect: { |
||||||
|
name: `${pre}list` |
||||||
|
}, |
||||||
|
meta, |
||||||
|
component: BasicLayout, |
||||||
|
children: [ |
||||||
|
{ |
||||||
|
name: `${pre}list`, |
||||||
|
path: `list`, |
||||||
|
component: () => import("@/pages/expSystem/list"), |
||||||
|
meta: { title: "实验系统管理" } |
||||||
|
}, |
||||||
|
{ |
||||||
|
name: `${pre}backstage`, |
||||||
|
path: `backstage`, |
||||||
|
component: () => import("@/pages/expSystem/backstage"), |
||||||
|
meta: { title: "系统后台" } |
||||||
|
}, |
||||||
|
{ |
||||||
|
name: `${pre}addModel`, |
||||||
|
path: `addModel`, |
||||||
|
component: () => import("@/pages/expSystem/backstage/addModel"), |
||||||
|
meta: { title: "新增源模型" } |
||||||
|
} |
||||||
|
] |
||||||
|
}; |
||||||
Loading…
Reference in new issue