实训案例管理新增初始页面整理

zqqdev
CherrysChang 5 years ago
parent c6e7e82243
commit f0094b618e
  1. 3
      src/main.js
  2. 82
      src/views/train/case-detail.vue

@ -46,10 +46,9 @@ const router = new VueRouter({
router.beforeEach((to, from, next) => { router.beforeEach((to, from, next) => {
//NProgress.start(); //NProgress.start();
// debugger;
let user = JSON.parse(sessionStorage.getItem('user')); let user = JSON.parse(sessionStorage.getItem('user'));
if (!user && to.path != '/login') { if (!user && to.path != '/login') {
if(to.path == '/train'){//暂时这么写,user是需要有值的,这里先方便页面 if(/train/.test(to.path)){//暂时这么写,user是需要有值的,这里先方便页面
next() next()
}else{ }else{
next({ path: '/login' }) next({ path: '/login' })

@ -1,26 +1,20 @@
<template> <template>
<div class="caseInputForm"> <div class="caseInputForm">
<el-form :inline="true" :model="dataForm" :rules="dataRule" ref="dataForm" class="demo-form-inline" label-width="90px"> <el-form :model="dataForm" :rules="dataRule" ref="dataForm" class="demo-form-inline" label-width="90px">
<el-card class="box-card"> <el-card class="box-card">
<div slot="header"> <div slot="header">
<span class="item-title-font"><i class="el-icon-minus icon-minus-rotated"></i>实训信息</span> <span class="item-title-font"><i class="el-icon-minus icon-minus-rotated"></i>实训信息</span>
<el-button type="primary" style="float: right;" size="medium" @click="goBackList">返回</el-button> <el-button type="primary" style="float: right;" size="medium" @click="goBackList">返回</el-button>
</div> </div>
<el-row :gutter="20"> <el-form-item label="实训名称" prop="name">
<el-col :span="8"> <el-input v-model.trim="dataForm.name" :disabled="formAction==2" placeholder="实训名称" style="width: 360px;"></el-input>
<el-form-item label="实训名称" prop="name"> </el-form-item>
<el-input v-model.trim="dataForm.name" :disabled="formAction==2" placeholder="实训名称" style="width: 280px;"></el-input> <el-form-item label="实训用途" prop="type">
</el-form-item> <el-select v-model="dataForm.type" placeholder="实训用途" :disabled="formAction==2" style="width: 360px;">
</el-col> <el-option label="考核" value="1"></el-option>
<el-col :span="8"> <el-option label="练习" value="2"></el-option>
<el-form-item label="实训用途" prop="type"> </el-select>
<el-select v-model="dataForm.type" placeholder="实训用途" :disabled="formAction==2"> </el-form-item>
<el-option label="考核" value="1"></el-option>
<el-option label="练习" value="2"></el-option>
</el-select>
</el-form-item>
</el-col>
</el-row>
</el-card> </el-card>
<el-card class="box-card"> <el-card class="box-card">
<div slot="header"> <div slot="header">
@ -28,57 +22,63 @@
<!--<span style="float: right;vertical-align: middle;line-height: 29px;">合计{{dataForm.totalScore}} </span>--> <!--<span style="float: right;vertical-align: middle;line-height: 29px;">合计{{dataForm.totalScore}} </span>-->
</div> </div>
<div class="target-set"> <div class="target-set">
<el-row :gutter="20"> <el-row :gutter="20" type="flex">
<el-col :span="1" style="text-align:center;padding-top: 182px;width: 76px;">量化指标</el-col> <el-col :span="1" style="text-align:center;padding-top: 182px;width: 88px;" class="item-required">量化指标</el-col>
<el-col :span="7"> <el-col :span="7">
<el-table ref="leftTable" :data="tableData.filter(data => !searchName || data.name.toLowerCase().includes(searchName.toLowerCase()))" <el-table ref="leftTable" :data="tableData.filter(data => !searchName || data.name.toLowerCase().includes(searchName.toLowerCase()))"
height="400" border highlight-current-row tooltip-effect="dark" @selection-change="handleSelectionChange"> height="400" border highlight-current-row tooltip-effect="dark" @selection-change="handleSelectionChange">
<el-table-column type="selection" width="55"></el-table-column> <el-table-column type="selection" width="55"></el-table-column>
<el-table-column label="未选择 10/10"> <el-table-column header-align="right" label="未选择 10/10">
<el-table-column prop="name" label="名称" show-overflow-tooltip> <el-table-column prop="name" label="名称" show-overflow-tooltip>
<template slot="header" slot-scope="scope"> <template slot="header" slot-scope="scope">
<el-input v-model="searchName" size="mini" placeholder="输入指标名称模糊搜索"/> <el-input v-model="searchName" placeholder="输入指标名称模糊搜索"/>
</template> </template>
</el-table-column> </el-table-column>
</el-table-column> </el-table-column>
</el-table> </el-table>
</el-col> </el-col>
<el-col :span="1" style="text-align:center;padding-top: 160px;"> <el-col :span="1" style="text-align:center;padding: 160px 0 0 0;width: 24px;">
<el-button @click="addStaff" size="mini" type="primary" icon="el-icon-arrow-right" circle></el-button> <el-button @click="addStaff" size="mini" type="primary" icon="el-icon-arrow-right" circle></el-button>
<el-button @click="removeStaff" size="mini" type="primary" icon="el-icon-arrow-left" circle style="margin-left: 0;margin-top: 10px;"></el-button> <el-button @click="removeStaff" size="mini" type="primary" icon="el-icon-arrow-left" circle style="margin:10px 0 0 0;"></el-button>
</el-col> </el-col>
<el-col :span="14"> <el-col :span="14" class="rightTable">
<el-table ref="rightTable" :data="tableData" height="400" border highlight-current-row tooltip-effect="dark" @selection-change="handleSelectionChange"> <el-table ref="rightTable" :data="tableData" height="400" border highlight-current-row tooltip-effect="dark" @selection-change="handleSelectionChange">
<el-table-column type="selection" width="55"></el-table-column> <el-table-column type="selection" width="55"></el-table-column>
<el-table-column label="已选择 0/10,剩余可配置分数 90 分"> <el-table-column header-align="right" label="已选择 0/10,剩余可配置分数 90 分">
<el-table-column prop="name" label="名称"></el-table-column> <el-table-column prop="name" label="名称"></el-table-column>
<el-table-column prop="target" label="任务目标" width="256"> <el-table-column prop="target" label="任务目标" width="226">
<template slot-scope="scope"> <template slot-scope="scope">
<el-form-item :prop="'tradeList.'+scope.$index+'.score'" :rules="dataRule.score" class="score-input" > <el-form-item :prop="'tradeList.'+scope.$index+'.score'" :rules="dataRule.score" class="score-input" >
<el-select size="small" style="width: 100px;"> <el-select size="small" style="width: 100px;">
<el-option label="大于" value="1"></el-option> <el-option label="大于" value="1"></el-option>
<el-option label="小于" value="2"></el-option> <el-option label="小于" value="2"></el-option>
</el-select> </el-select>
<el-input size="small" v-model.trim="scope.row.score" :disabled="formAction == 2" style="width: 120px;"> <el-input size="small" v-model.trim="scope.row.score" :disabled="formAction == 2" style="width: 100px;">
<template slot="append">%</template> <i slot="suffix">%</i>
</el-input> </el-input>
</el-form-item> </el-form-item>
</template> </template>
</el-table-column> </el-table-column>
<el-table-column prop="score" label="分数" width="160"> <el-table-column prop="score" label="分数" width="120">
<template slot-scope="scope"> <template slot-scope="scope">
<el-form-item :prop="'tradeList.'+scope.$index+'.score'" :rules="dataRule.score" class="score-input"> <el-form-item :prop="'tradeList.'+scope.$index+'.score'" :rules="dataRule.score" class="score-input">
<el-input size="small" v-model.trim="scope.row.score" :disabled="formAction == 2" style="width: 120px;"></el-input> <el-input size="small" v-model.trim="scope.row.score" :disabled="formAction == 2" style="width: 100px;"><i slot="suffix"></i></el-input>
</el-form-item> </el-form-item>
</template> </template>
</el-table-column> </el-table-column>
<el-table-column fixed="right" label="操作" width="50">
<template slot-scope="scope">
<el-button @click.native.prevent="deleteRow(scope.$index, tableData)" type="text" size="small">移除</el-button>
<!--<el-button type="danger" size="mini" icon="el-icon-delete" circle @click.native.prevent="deleteRow(scope.$index, tableData)"></el-button>-->
</template>
</el-table-column>
</el-table-column> </el-table-column>
</el-table> </el-table>
</el-col> </el-col>
</el-row> </el-row>
</div> </div>
</el-card> </el-card>
<div style="text-align: center;"> <div class="form-btn" style="text-align: center;">
<el-form-item> <el-form-item>
<el-button type="primary" @click="doAddCaseData()">确定</el-button> <el-button type="primary" @click="doAddCaseData()">确定</el-button>
<el-button @click="goBackList">取消</el-button> <el-button @click="goBackList">取消</el-button>
@ -446,11 +446,22 @@
content: ''; content: '';
} }
.target-set{ .target-set{
/*.el-table__header .el-table-column--selection .cell .el-checkbox:after {*/
/* content: "全选";*/
/*}*/
.score-input { .score-input {
margin-bottom: 0px; margin-bottom: 0px;
/deep/ .el-form-item__error { /deep/ .el-form-item__error {
position: unset; position: unset;
} }
.el-form-item__content{
margin-left: 0 !important;
}
}
.rightTable{
.el-table td{
padding: 3px 0;
}
} }
} }
@ -470,6 +481,17 @@
vertical-align: middle; vertical-align: middle;
line-height: 29px; line-height: 29px;
} }
.item-required:before{
content: '*';
color: #F56C6C;
margin-right: 4px;
}
}
.form-btn{
.el-form-item__content{
margin-left: 0 !important;
}
} }
} }
</style> </style>
Loading…
Cancel
Save