p35z7urxv
/
pqa2fspn3
1
0
Fork 0
Code Issues Pull Requests Releases Wiki Activity

[feat][V]:完善实验室管理页面并对接完成

Browse Source
master
Romesum 5 years ago
parent c60fc16cdc
commit 9670802c4c
3 changed files with 145 additions and 101 deletions
Show Stats Download Patch File Download Diff File

4
element-vue/src/components/supManager/addLab.vue
Unescape View File

@ -55,13 +55,9 @@
</template> </template>
<script> <script>
import setLabTime from "~/components/supManager/setLabTime";
import {get} from "~/utils"; import {get} from "~/utils";
export default { export default {
components: {
setLabTime
},
data() { data() {
return { return {
setLabTimeDialog: false, setLabTimeDialog: false,

73
element-vue/src/components/supManager/labManage.vue
Unescape View File

@ -1,19 +1,20 @@
<template> <template>
<div style="width: 100%;padding: 20px"> <div style="width: 100%;padding: 20px">
<el-form :model="time" :inline="true" style="width: 100%;margin-top: 30px"> <el-form :model="time" :inline="true" style="width: 100%">
<!-- <span style="width: 10% ;:-20px">可预约时间段:--> <!-- <span style="width: 10% ;:-20px">可预约时间段:-->
<!-- </span>--> <!-- </span>-->
<el-form-item label="学年" style="width: 20% ;"> <el-form-item label="学年" style="width: 20% ;">
<el-select v-model="time.year" style=""> <el-select v-model="time.year" style="">
<el-option label="2017-2018" value="0"></el-option> <el-option label="2017-2018" value="2017"></el-option>
<el-option label="2018-2019" value="1"></el-option> <el-option label="2018-2019" value="2018"></el-option>
<el-option label="2019-2020" value="2"></el-option> <el-option label="2019-2020" value="2019"></el-option>
<el-option label="2020-2021" value="2020"></el-option>
</el-select> </el-select>
</el-form-item> </el-form-item>
<el-form-item label="学期" style="width: 20%"> <el-form-item label="学期" style="width: 20%">
<el-select v-model="time.semester" style=""> <el-select v-model="time.semester" style="">
<el-option label="第一学期" value="0"></el-option> <el-option label="第一学期" :value="1"></el-option>
<el-option label="第二学期" value="1"></el-option> <el-option label="第二学期" :value="2"></el-option>
</el-select> </el-select>
</el-form-item> </el-form-item>
<!-- <el-form-item label="周次" style="width: 5%">--> <!-- <el-form-item label="周次" style="width: 5%">-->
@ -103,16 +104,18 @@
<template slot-scope="scope"> <template slot-scope="scope">
<el-button @click="editLab(scope.row)" type="primary" size="mini" plain icon="el-icon-edit">编辑 <el-button @click="editLab(scope.row)" type="primary" size="mini" plain icon="el-icon-edit">编辑
</el-button> </el-button>
<!-- <el-button @click="deleteLab(scope.row.lab_id)" type="danger" size="mini" plain--> <!-- <el-button @click="deleteLab(scope.row.lab_id)" type="danger" size="mini" plain-->
<!-- icon="el-icon-delete">删除--> <!-- icon="el-icon-delete">删除-->
<!-- </el-button>--> <!-- </el-button>-->
<el-button @click="schedulePreview(scope.row.lab_id)" size="mini" plain>查看课表</el-button> <el-button @click="schedulePreview(scope.row.lab_id)" size="mini" plain>查看课表</el-button>
<el-button @click="editSchedule(scope.row.lab_id)" type="primary" size="mini" icon="el-icon-edit" plain>修改可预约时间段 <el-button @click="editSchedule(scope.row.lab_id)" type="primary" size="mini" icon="el-icon-edit"
plain>修改可预约时间段
</el-button> </el-button>
</template> </template>
</el-table-column> </el-table-column>
</el-table> </el-table>
<add-lab ref="addLab" @confirm="submit"></add-lab> <add-lab ref="addLab" @confirm="submit"></add-lab>
<set-lab-time ref="setLabTime"></set-lab-time>
</div> </div>
</template> </template>
@ -121,21 +124,19 @@
import addLab from "~/components/supManager/addLab" ; import addLab from "~/components/supManager/addLab" ;
import {get, post} from "~/utils"; import {get, post} from "~/utils";
import {showDialog, showFail, showSuccess} from "~/utils/dialog"; import {closeLoading, showDialog, showDialogWithReject, showFail, showLoading, showSuccess} from "~/utils/dialog";
import setLabTime from "~/components/supManager/setLabTime";
export default { export default {
components: {addLab}, components: {addLab, setLabTime},
data() { data() {
return { return {
edit: false, edit: false,
// form: { setLabTimeDialog: false,
// type: '0', form: {},
// position: '0',
// status: '0',
// },
time: { time: {
year: '0', year: '2019',
semester: '0' semester: 2
}, },
search: '', search: '',
tableData: [], tableData: [],
@ -165,6 +166,7 @@
this.$refs.addLab.form.managerId = this.$refs.addLab.form.manager_id this.$refs.addLab.form.managerId = this.$refs.addLab.form.manager_id
if (this.$refs.addLab.form.lab_id) { if (this.$refs.addLab.form.lab_id) {
// 编辑 // 编辑
await showDialog('确认要编辑吗？',this)
this.$refs.addLab.form.labId = this.$refs.addLab.form.lab_id this.$refs.addLab.form.labId = this.$refs.addLab.form.lab_id
await post('lb/lab/updateLab', this.$refs.addLab.form).then(async () => { await post('lb/lab/updateLab', this.$refs.addLab.form).then(async () => {
await this.load() await this.load()
@ -175,16 +177,31 @@
} else { } else {
// 新增 // 新增
await post('lb/lab/addLab', this.$refs.addLab.form).then(async () => { await showDialog('确认要新增吗？',this)
await this.load() await showDialogWithReject('是否需要为该实验室添加'+parseInt(this.time.year)+'-'+(parseInt(this.time.year)+1)+'学年第'+this.time.semester+'学期16周的所有时间段？',this).then(async()=>{
showSuccess('新增成功', this) this.$refs.addLab.form.fastInsert = true
}).catch(() => { this.$refs.addLab.form.year = this.time.year
showFail('新增失败', this) this.$refs.addLab.form.semester = this.time.semester
console.log(this.$refs.addLab.form)
await this.addLab()
}).catch(async()=>{
this.$refs.addLab.form.fastInsert = false
await this.addLab()
}) })
} }
this.$refs.addLab.addLabDialog = false this.$refs.addLab.addLabDialog = false
}, },
async addLab(){
const loading = showLoading('正在新增...', this)
const newLab = await post('lb/lab/addLab', this.$refs.addLab.form).then(async () => {
await this.load()
showSuccess('新增成功', this)
closeLoading(loading)
}).catch(() => {
closeLoading(loading)
showFail('新增失败', this)
})
},
// async deleteLab(labId) { // async deleteLab(labId) {
// await showDialog("确定要删除吗？", this) // await showDialog("确定要删除吗？", this)
// await post('lb/lab/deleteLab', {labId}).then(async () => { // await post('lb/lab/deleteLab', {labId}).then(async () => {
@ -197,8 +214,10 @@
async schedulePreview() { async schedulePreview() {
await showFail('尚未开发', this) await showFail('尚未开发', this)
}, },
async editSchedule() { async editSchedule(lab_id) {
console.log(this.$refs.setLabTime)
this.$refs.setLabTime.form.labId = lab_id
this.$refs.setLabTime.setLabTimeDialog = true
} }
}, },
computed: { computed: {

169
element-vue/src/components/supManager/setLabTime.vue
Unescape View File

@ -1,8 +1,9 @@
<template> <template>
<div> <div>
<el-dialog :visible="setLabTimeDialog" @close="setLabTimeDialog=false">
<el-form :model="form"> <el-form :model="form">
<el-form-item label="学年："> <el-form-item label="学年：">
<el-select v-model="form.year" size="small" > <el-select v-model="form.year" size="small">
<el-option <el-option
v-for="item in selectOptions1" v-for="item in selectOptions1"
:key="item.value" :key="item.value"
@ -13,7 +14,7 @@
</el-select> </el-select>
</el-form-item> </el-form-item>
<el-form-item label="学期："> <el-form-item label="学期：">
<el-select v-model="form.semester" size="small" > <el-select v-model="form.semester" size="small">
<el-option <el-option
v-for="item in selectOptions2" v-for="item in selectOptions2"
:key="item.value" :key="item.value"
@ -25,12 +26,14 @@
</el-form-item> </el-form-item>
<el-form-item label="星期："> <el-form-item label="星期：">
<el-input v-model="form.time" @focus="showCourseDialog" placeholder="点我设置" style="width: 200px" >点击设置</el-input> <el-input v-model="form.time" @focus="showCourseDialog" placeholder="点我设置" style="width: 200px">点击设置
</el-input>
</el-form-item> </el-form-item>
</el-form> </el-form>
</el-dialog>
<!-- 表格：节数选择--> <!-- 表格：节数选择-->
<el-dialog :visible.sync="courseDialog" append-to-body :close-on-click-modal="false" v-if="tableAlive" > <el-dialog :visible.sync="courseDialog" append-to-body :close-on-click-modal="false" v-if="tableAlive">
<tb_course :cClick="cellClick" :cStyle="cellStyle" table-label="点击相应的位置选取时间段" ref="times"></tb_course> <tb_course :cClick="cellClick" :cStyle="cellStyle" table-label="点击相应的位置选取时间段" ref="times"></tb_course>
<span slot="footer" class="dialog-footer"> <span slot="footer" class="dialog-footer">
<el-button @click="cancelSetWeeks">取 消</el-button> <el-button @click="cancelSetWeeks">取 消</el-button>
@ -38,9 +41,11 @@
</span> </span>
</el-dialog> </el-dialog>
<!-- checkbox:周次选择--> <!-- checkbox:周次选择-->
<el-dialog :visible.sync="weekDialog" title="请选择周数" width="400px" :close-on-click-modal="false" append-to-body> <el-dialog :visible.sync="weekDialog" title="请选择周数" width="400px" :close-on-click-modal="false" append-to-body>
<week-selection @add="addWeek" @cancel="cancelSelection" ref="weekSelection" ></week-selection> <week-selection @add="addWeek" @cancel="cancelSelection" ref="weekSelection"
:able-list="ableList"></week-selection>
</el-dialog> </el-dialog>
</div> </div>
</template> </template>
@ -49,33 +54,39 @@
import tb_course from "~/components/tb_course"; import tb_course from "~/components/tb_course";
import {get, post, stop} from "~/utils"; import {get, post, stop} from "~/utils";
import {showDialog, showFail, showSuccess} from "~/utils/dialog"; import {showDialog, showFail, showSuccess} from "~/utils/dialog";
export default { export default {
name: "setLabTime", components: {weekSelection, tb_course},
components:{weekSelection,tb_course}, data() {
data(){ return {
return{ form: {
form:{ year: '2019',
year:2019, semester: 2
semester:2,
time:"",
}, },
allWeeksValue:[], setLabTimeDialog: false,
aWeekValue:[], ableList: [],
courseDialog:false, weekDisable:[],
tableAlive:false, //用于重载表格 allWeeksValue: [],
weekDialog:false, aWeekValue: [],
courseDialog: false,
tableAlive: false, //用于重载表格
weekDialog: false,
selectOptions1: [ selectOptions1: [
{ {
value: 2017, value: '2017',
label: '2017-2018年' label: '2017-2018年'
}, },
{ {
value: 2018, value: '2018',
label: '2018-2019年' label: '2018-2019年'
}, },
{ {
value: 2019, value: '2019',
label: '2019-2020年' label: '2019-2020年'
},
{
value: '2020',
label: '2020-2021年'
} }
], ],
selectOptions2: [ selectOptions2: [
@ -90,90 +101,108 @@
], ],
} }
}, },
methods:{ methods: {
//设置周次与节次 //设置周次与节次
showCourseDialog(){ async showCourseDialog() {
console.log('嘿') this.tableAlive = true
this.tableAlive=true this.courseDialog = true
this.courseDialog=true
}, },
//表格中每个格子的风格 //表格中每个格子的风格
cellStyle:function({row, column, rowIndex, columnIndex}){ cellStyle: function ({row, column, rowIndex, columnIndex}) {
if (column.label!=''){ if (column.label != '') {
return 'cursor:pointer' return 'cursor:pointer'
} }
}, },
//点击格子促发的函数 //点击格子促发的函数
cellClick(row, column, cell, event) { async cellClick(row, column, cell, event) {
console.log(row.index) this.form.weeks = null
if (column.label!='') { this.form.day = column.index
this.weekDialog=true this.form.time = row.index
this.perTargetValue=event.target //用target对表格进行定位并保存致target对象 this.form.uc_id = 0
console.log(this.aWeekValue,this.allWeeksValue) console.log(this.form)
this.aWeekValue.push(row.index,column.index) const weekAll = await get('lb/labTime/getWeeks', this.form)
} const weekAble = await get("lb/labTime/getWeeksAbleBook", this.form)
this.weekDisable = weekAll.filter(elem => !(weekAble.indexOf(elem) > -1))
this.ableList = [1,2,3,4,5,6,7,8,9,10,11,12,13,14,15,16,17,18].filter(elem=> !(this.weekDisable.indexOf(elem) > -1))
this.weekDialog = true
// if (column.label != '') {
// this.weekDialog = true
// this.perTargetValue = event.target //用target对表格进行定位并保存致target对象
// // console.log(this.aWeekValue, this.allWeeksValue)
// this.aWeekValue.push(row.index, column.index)
// }
}, },
//添加已选择的的周数 //添加已选择的的周数
async addWeek() { async addWeek() {
this.weekDialog=false console.log(this.form)
this.weekDialog = false
var targetValue = this.$refs.weekSelection.checkedValue var targetValue = this.$refs.weekSelection.checkedValue
if(targetValue.length!==0){ this.form.weeks = targetValue
this.perTargetValue.textContent='【'+targetValue+'】周' //提交
this.aWeekValue.push(targetValue) //单个节数时间段添加完成，包括[rowIndex,column,targetValue] await showDialog("确认设置此时间段可预约吗？", this)
this.allWeeksValue.push(this.aWeekValue) //把单个格子选择的时间段添加到allWeeksValue中 for(let i in this.weekDisable){
this.perTargetValue.style.backgroundColor='lightyellow' this.form.weeks.push(this.weekDisable[i])
for (let i=0;i<this.allWeeksValue.length;i++){
for (let j=i+1;j<this.allWeeksValue.length;j++){
if (this.allWeeksValue[i][0]===this.allWeeksValue[j][0]&&this.allWeeksValue[i][1]===this.allWeeksValue[j][1]){
this.allWeeksValue.splice(i,1)
}
}
}
} }
this.aWeekValue=[] console.log(this.form)
await post('lb/labTime/updateLabTime', this.form)
await showSuccess("设置成功",this)
// if (targetValue.length !== 0) {
// this.perTargetValue.textContent = '【' + targetValue + '】周'
// this.aWeekValue.push(targetValue) //单个节数时间段添加完成，包括[rowIndex,column,targetValue]
// this.allWeeksValue.push(this.aWeekValue) //把单个格子选择的时间段添加到allWeeksValue中
// this.perTargetValue.style.backgroundColor = 'lightyellow'
// for (let i = 0; i < this.allWeeksValue.length; i++) {
// for (let j = i + 1; j < this.allWeeksValue.length; j++) {
// if (this.allWeeksValue[i][0] === this.allWeeksValue[j][0] && this.allWeeksValue[i][1] === this.allWeeksValue[j][1]) {
// this.allWeeksValue.splice(i, 1)
// }
// }
// }
//
// }
// this.aWeekValue = []
// this.$refs.weekSelection.checkedValue=[] //将周数选择器已选择选项置空 // this.$refs.weekSelection.checkedValue=[] //将周数选择器已选择选项置空
// console.log(this.allWeeksValue) // console.log(this.allWeeksValue)
}, },
//取消一个格子已选择这些周数 //取消一个格子已选择这些周数
async cancelSelection() { async cancelSelection() {
for (let i=0;i<this.allWeeksValue.length;i++){ for (let i = 0; i < this.allWeeksValue.length; i++) {
if (this.aWeekValue[0]===this.allWeeksValue[i][0] && this.aWeekValue[1]===this.allWeeksValue[i][1]){ if (this.aWeekValue[0] === this.allWeeksValue[i][0] && this.aWeekValue[1] === this.allWeeksValue[i][1]) {
this.allWeeksValue.splice(i,1) this.allWeeksValue.splice(i, 1)
console.log(this.allWeeksValue) console.log(this.allWeeksValue)
} }
} }
this.aWeekValue=[] this.aWeekValue = []
this.perTargetValue.style.backgroundColor='' this.perTargetValue.style.backgroundColor = ''
this.perTargetValue.textContent='' this.perTargetValue.textContent = ''
//此处再设置将allWeeksValue里边减去这个表格原本的内容，要怎么删去呢，思考一下。 //此处再设置将allWeeksValue里边减去这个表格原本的内容，要怎么删去呢，思考一下。
// if (this.perTargetValue!=''){ // if (this.perTargetValue!=''){
// this.allWeeksValue.pop() // this.allWeeksValue.pop()
// } // }
this.weekDialog=false this.weekDialog = false
}, },
//确定所有格子已选择的周数 //确定所有格子已选择的周数
async setWeeks () { async setWeeks() {
console.log(this.$refs.times) console.log(this.$refs.times)
console.log(this.allWeeksValue) console.log(this.allWeeksValue)
// this.form.schedule=this.allWeeksValue.toString() // this.form.schedule=this.allWeeksValue.toString()
this.courseDialog=false this.courseDialog = false
// console.log(this.$refs.times) // console.log(this.$refs.times)
this.tableAlive=false this.tableAlive = false
if (this.allWeeksValue.length!==0){ if (this.allWeeksValue.length !== 0) {
this.form.time='已设置，点击修改' this.form.time = '已设置，点击修改'
} }
}, },
//取消所有已选择的周数 //取消所有已选择的周数
cancelSetWeeks:function () { cancelSetWeeks: function () {
this.allWeeksValue=[] this.allWeeksValue = []
this.form.schedule="" this.form.schedule = ""
this.courseDialog=false this.courseDialog = false
this.formDialog=true this.formDialog = true
console.log(this.allWeeksValue) console.log(this.allWeeksValue)
this.tableAlive=false //表格失活 this.tableAlive = false //表格失活
} }
} }
} }

Write Preview
Loading…
Cancel
Save