huoran
/
FE_occupationlab_server
4
0
Fork 0
Code Issues Pull Requests Packages Projects Releases 15 Wiki Activity
You can not select more than 25 topics Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
1 Commit
5 Branches
23 Tags
84 MiB
 
 
 
 
 
Tag: Branch: Tree: f00fa2247a
Branches Tags
${ item.name }
Create tag ${ searchTerm }
Create branch ${ searchTerm }
from 'f00fa2247a'
${ noResults }
FE_occupationlab_server/src/components/page/ReportConfig.vue

461 lines
19 KiB
Raw Blame History

<template>
<div>
<el-row :gutter="20">
<el-col :span="24">
<el-card shadow="hover" class="mgb20">
<div class="flex-between">
<div class="per_title" v-preventReClick @click="goback()">
<i class="el-icon-arrow-left"></i>
<span class="per_back">返回</span>
<span class="per_school">实验报告配置</span>
</div>
<div>
<el-button type="primary" size="small" round v-preventReClick>确定</el-button>
</div>
</div>
</el-card>
<el-card shadow="hover" class="mgb20">
<div>
<p class="mgb20">实验报告名称</p>
<el-input
placeholder="请输入实验报告名称"
clearable
maxlength="15"
class="inline-input"
></el-input>
</div>
</el-card>
<el-card shadow="hover" class="mgb20">
<div class="flex-center mgb20">
<p class="addhr_tag"></p>
<span>基本信息</span>
</div>
<div>
<el-form inline class="inline-form">
<div class="inner">
<el-form-item label="学生姓名">
<el-input placeholder="" size="small"></el-input>
</el-form-item>
<el-form-item label="学生学号">
<el-input placeholder="" size="small"></el-input>
</el-form-item>
<el-form-item label="学生班级">
<el-input placeholder="" size="small"></el-input>
</el-form-item>
</div>
<div class="inner">
<el-form-item label="实验名称">
<el-input placeholder="" size="small"></el-input>
</el-form-item>
<el-form-item label="实验学时">
<el-input placeholder="" size="small"></el-input>
</el-form-item>
</div>
</el-form>
</div>
</el-card>
<el-card shadow="hover" class="mgb20">
<div class="flex-between mgb20">
<div class="flex-center">
<p class="addhr_tag"></p>
<span>实验目的</span>
</div>
<div>
<span>得分：0/60</span>
<el-button class="ml10" type="primary" size="small" v-preventReClick>编辑</el-button>
</div>
</div>
<el-input type="textarea" rows="5" disabled></el-input>
</el-card>
<el-card shadow="hover" class="mgb20">
<div class="flex-between mgb20">
<div class="flex-center">
<p class="addhr_tag"></p>
<span>实验原理</span>
</div>
<div>
<span>得分：0/60</span>
<el-button class="ml10" type="primary" size="small" v-preventReClick>编辑</el-button>
</div>
</div>
<el-input type="textarea" rows="5" disabled></el-input>
</el-card>
<el-card shadow="hover" class="mgb20">
<div class="flex-between mgb20">
<div class="flex-center">
<p class="addhr_tag"></p>
<span>实验步骤</span>
</div>
<div>
<span>得分：0/60</span>
<el-button class="ml10" type="primary" size="small" v-preventReClick>编辑</el-button>
</div>
</div>
<el-input type="textarea" rows="5" disabled></el-input>
</el-card>
<el-card shadow="hover" class="mgb20">
<div class="flex-between mgb20">
<div class="flex-center">
<p class="addhr_tag"></p>
<span>实验结果分析</span>
</div>
<div>
<span>得分：0/60</span>
<el-button class="ml10" type="primary" size="small" v-preventReClick>编辑</el-button>
</div>
</div>
<div class="block">
<div class="flex-between mb10">
<p class="l-title">步骤1 判断平价关系确定交易方向</p>
<el-switch></el-switch>
</div>
<div class="inner">
<el-checkbox>日期</el-checkbox>
<el-checkbox>品种</el-checkbox>
</div>
<div>
<div class="flex-between">
<div class="inline-flex">
<el-checkbox></el-checkbox>
<span>设置结论选项</span>
<div class="input-wrap">
<div class="input" v-for="(item,index) in conclusion1" :key="index">
<el-input size="mini" v-model="item.val"></el-input>
<i class="plus el-icon-circle-plus-outline" @click="addColumn(1)"></i>
<i class="sub el-icon-remove-outline" v-if="conclusion1.length > 1" @click="delColumn(1,index)"></i>
</div>
</div>
</div>
<p>(0/0分)</p>
</div>
<div class="flex-between">
<div class="inline-flex">
<el-checkbox></el-checkbox>
<span>设置主观题</span>
<el-input size="mini"></el-input>
</div>
<p>(0/0分)</p>
</div>
</div>
</div>
<div class="block">
<div class="flex-between mb10">
<p class="l-title">步骤2 选择期货期权套利策略</p>
<el-switch></el-switch>
</div>
<div class="inner">
<el-checkbox>策略</el-checkbox>
<el-checkbox>套利组合</el-checkbox>
</div>
<div>
<div class="flex-between">
<div class="inline-flex">
<el-checkbox></el-checkbox>
<span>设置结论选项</span>
<div class="input-wrap">
<div class="input" v-for="(item,index) in conclusion2" :key="index">
<el-input size="mini" v-model="item.val"></el-input>
<i class="plus el-icon-circle-plus-outline" @click="addColumn(2)"></i>
<i class="sub el-icon-remove-outline" v-if="conclusion2.length > 1" @click="delColumn(2,index)"></i>
</div>
</div>
</div>
<p>(0/0分)</p>
</div>
<div class="flex-between">
<div class="inline-flex">
<el-checkbox></el-checkbox>
<span>设置主观题</span>
<el-input size="mini"></el-input>
</div>
<p>(0/0分)</p>
</div>
</div>
</div>
<div class="block">
<div class="flex-between mb10">
<p class="l-title">步骤3 判断平价关系确定交易方向</p>
<el-switch></el-switch>
</div>
<div class="inner">
<el-checkbox>策略</el-checkbox>
</div>
<div>
<div class="flex-between">
<div class="inline-flex">
<el-checkbox></el-checkbox>
<span>设置结论选项</span>
<div class="input-wrap">
<div class="input" v-for="(item,index) in conclusion3" :key="index">
<el-input size="mini" v-model="item.val"></el-input>
<i class="plus el-icon-circle-plus-outline" @click="addColumn(3)"></i>
<i class="sub el-icon-remove-outline" v-if="conclusion3.length > 1" @click="delColumn(3,index)"></i>
</div>
</div>
</div>
<p>(0/0分)</p>
</div>
<div class="flex-between">
<div class="inline-flex">
<el-checkbox></el-checkbox>
<span>设置主观题</span>
<el-input size="mini"></el-input>
</div>
<p>(0/0分)</p>
</div>
</div>
</div>
<div class="block">
<div class="flex-between mb10">
<p class="l-title">步骤4 选择期权期货套利策略</p>
<el-switch></el-switch>
</div>
<div class="inner">
<el-checkbox>策略</el-checkbox>
</div>
<div>
<div class="flex-between">
<div class="inline-flex">
<el-checkbox></el-checkbox>
<span>设置结论选项</span>
<div class="input-wrap">
<div class="input" v-for="(item,index) in conclusion4" :key="index">
<el-input size="mini" v-model="item.val"></el-input>
<i class="plus el-icon-circle-plus-outline" @click="addColumn(4)"></i>
<i class="sub el-icon-remove-outline" v-if="conclusion4.length > 1" @click="delColumn(4,index)"></i>
</div>
</div>
</div>
<p>(0/0分)</p>
</div>
<div class="flex-between">
<div class="inline-flex">
<el-checkbox></el-checkbox>
<span>设置主观题</span>
<el-input size="mini"></el-input>
</div>
<p>(0/0分)</p>
</div>
</div>
</div>
</el-card>
<el-card shadow="hover" class="mgb20">
<div class="flex-between mgb20">
<div class="flex-center">
<p class="addhr_tag"></p>
<span>实验结论</span>
</div>
<div>
<span>得分：0/60</span>
</div>
</div>
<el-input type="textarea" rows="5" placeholder="请填写实验结论"></el-input>
</el-card>
<el-card shadow="hover" class="mgb20">
<div class="flex-between mgb20">
<div class="flex-center">
<p class="addhr_tag"></p>
<span>总结与心得体会</span>
</div>
<div>
<span>得分：0/60</span>
</div>
</div>
<el-input type="textarea" rows="5" placeholder="请填写总结与心得体会"></el-input>
</el-card>
</el-col>
</el-row>
</div>
</template>
<script>
export default {
data (){
return {
form: {
systemName: '',
systemType: '',
systemAttribution: ''
},
rules: {
systemName:[
{ required: true, message: '请输入系统名称', trigger: 'blur' }
],
systemType:[
{ required: true, message: '请选择系统类型', trigger: 'change' }
],
systemAttribution:[
{ required: true, message: '请选择系统归属', trigger: 'change' }
]
},
conclusion1: [{val: ''}],
conclusion2: [{val: ''}],
conclusion3: [{val: ''}],
conclusion4: [{val: ''}],
conclusion5: [{val: ''}],
conclusion6: [{val: ''}],
conclusion7: [{val: ''}],
conclusion8: [{val: ''}],
}
},
mounted(){
if(this.configId){
this.getData()
}
},
methods: {
getData(){
let data = {
systemId: this.configId
}
this.$get(this.api.queryServiceConfigDetails,data).then((res) => {
this.form = {
systemName: res.message[0].systemName,
systemType: res.message[0].systemType,
systemAttribution: res.message[0].systemAttribution,
}
}).catch((res) => {
})
},
saveAdd(){
let data = {
systemId: this.configId,
systemName: this.form.systemName,
systemType: this.form.systemType,
systemAttribution: this.form.systemAttribution,
}
if(this.configId){
this.$post(this.api.updateServiceConfig,data).then((res) => {
this.$message.success('编辑成功');
this.$router.back()
}).catch((res) => {
})
}else{
this.$post(this.api.updateServiceConfig,data).then((res) => {
this.$message.success('添加成功');
this.$router.back()
}).catch((res) => {
})
}
},
goback() {
this.$confirm('确定返回？未更新的信息将不会保存。', '提示', {
type: 'warning'
})
.then(() => {
this.$router.back()
})
.catch(() => {});
},
addColumn(index){
if(this[`conclusion${index}`].length > 4){
this.$message.warning('最多添加5个');
}else{
this[`conclusion${index}`].push({val: ''})
}
},
delColumn(index,i){
this[`conclusion${index}`].splice(i,1)
}
}
}
</script>
<style lang="scss" scoped>
.ml10{
margin-left: 10px;
}
.mb10{
margin-bottom: 10px;
}
.inline-input{
width: 200px;
}
.inline-form{
display: flex;
flex-direction: column;
.inner{
display: inline-flex;
&:first-child{
margin-bottom: 15px;
}
.el-form-item{
width: 33.33%;
margin: 0 20px;
font-size: 12px;
}
}
}
.flex-center{
font-size: 14px;
}
.flex-between{
font-size: 12px;
}
.block{
padding: 10px;
margin-bottom: 15px;
background-color: #f5f5f5;
.l-title{
font-size: 14px;
font-weight: bold;
}
.inner{
min-height: 100px;
padding: 10px;
margin-bottom: 10px;
border-radius: 8px;
border: 1px solid #ccc;
background-color: #fff;
box-sizing: border-box;
}
.inline-flex{
display: inline-flex;
margin-bottom: 10px;
font-size: 12px;
.input-wrap{
.input{
margin-bottom: 5px;
}
}
span{
margin: 0 10px 0 5px;
}
.el-input{
width: 400px;
}
i{
font-size: 16px;
cursor: pointer;
&:hover{
opacity: .8;
}
}
.plus{
margin-left: 10px;
color: #63e600;
}
.sub{
margin-left: 5px;
color: #636363;
}
}
}
</style>