[fix][V]:完善实验室申请页面

master
Romesum 5 years ago
parent 3ad5744b56
commit caa048e9f2

@ -25,6 +25,9 @@
const doubleVal=[2,4,6,8,10,12,14,16,18];
export default {
name: "weekSelection",
props:{
ableList:{default: allVal}
},
data(){
return{
checkedValue:[],
@ -32,7 +35,6 @@
isIndeterminate1:true,
isIndeterminate2:true,
isIndeterminate3:true,
ableList:[1,2,3,4,5,6],
checkOption:[1,2,3,4,5,6,7,8,9,10,11,12,13,14,15,16,17,18]
}
},

@ -2,97 +2,89 @@
<div>
<el-container>
<!-- 标题栏-->
<!-- 标题栏-->
<el-header style="padding: 0">
<nav-bar></nav-bar>
</el-header>
<el-main>
<!-- /和学期-->
<!-- /和学期-->
<time-select ref="timeSelection"></time-select>
<!-- 表格查询申请记录-->
<!-- 表格查询申请记录-->
<el-header>
<div>
<el-input type="text" style="max-width: 400px;float: left" placeholder="请输入查询关键字" ><el-button slot="append" icon="el-icon-search"></el-button></el-input>
<el-input type="text" style="max-width: 400px;float: left" placeholder="请输入查询关键字">
<el-button slot="append" icon="el-icon-search"></el-button>
</el-input>
<el-button style="float: right" class="el-button--danger" @click="toMyRecord"></el-button>
</div>
</el-header>
<el-table :data="tableData" border ref="detailtb" height="500px">
<el-table-column prop="position" label="实验室地点">
</el-table-column>
<el-table-column prop="name" label="实验室名称">
</el-table-column>
<el-table-column prop="capacity" label="可容纳人数">
</el-table-column>
<el-table-column prop="status" label="状态">
</el-table-column>
<el-table-column prop="nickname" label="管理员">
</el-table-column>
<el-table-column prop="position" label="实验室地点"></el-table-column>
<el-table-column prop="name" label="实验室名称"></el-table-column>
<el-table-column prop="capacity" label="可容纳人数"></el-table-column>
<el-table-column prop="software" label="软件"></el-table-column>
<el-table-column prop="nickname" label="管理员"></el-table-column>
<el-table-column prop="tel" label="管理员联系电话"></el-table-column>
<el-table-column fixed="right"
label="操作"
width="212">
<template slot-scope="scope">
<el-button @click="" type="text" size="medium" @click="checkDetail(scope.row)"></el-button>
<el-button @click="" type="text" size="medium" @click="checkDetail(scope.row)">
</el-button>
<el-button @click="clickLabApply(scope.row)" type="text" size="medium">申请</el-button>
</template>>
</template>
>
</el-table-column>
</el-table>
</el-main>
<!-- 填写申请课室表单信息-->
<!-- 填写申请课室表单信息-->
<el-dialog title="请填写以下申请信息" :visible.sync="formDialog" :close-on-click-modal="false">
<el-form :model="form" :inline="true" label-width="100px" ref="courseForm">
<el-form-item label="课程名称" prop="course_name" :rules="[{ required: true, message: '请输入课程名称', trigger: 'blur' }]">
<el-select v-model="form.course_name" @change="selectChange">
<el-option v-for="item in courseOption" :key="item.uc_id" :label="item.name" :value="item.uc_id"></el-option>
<el-form-item label="课程名称" prop="course_name"
:rules="[{ required: true, message: '请选择课程', trigger: 'blur' }]">
<el-select v-model="form.ucId" @change="selectChange">
<el-option v-for="item in courseOption" :key="item.ucId" :label="item.name"
:value="item.ucId"></el-option>
</el-select>
</el-form-item>
<el-form-item label="地址" >
<el-form-item label="地址">
<el-input v-model="form.position" disabled></el-input>
</el-form-item>
<el-form-item label="申请时间" prop="date" >
<el-input v-model="form.date" disabled></el-input>
</el-form-item>
<el-form-item label="实验室名称">
<el-input v-model="form.name" disabled></el-input>
</el-form-item>
<el-form-item label="姓名" prop="nickname" :rules="[{ required: true, message: '请输入您的姓名', trigger: 'blur' }]">
<el-form-item label="姓名" prop="nickname">
<el-input v-model="form.nickname" disabled></el-input>
</el-form-item>
<el-form-item label="手机号" prop="tel" :rules="[
{ required: true, message: '请输入您的手机号', trigger: 'blur' },
{type:'number',message: '请输入11位有效数字',trigger: 'blur'}]">
<el-form-item label="手机号" prop="tel">
<el-input v-model="form.tel" disabled></el-input>
</el-form-item>
<el-form-item label="使用班级" prop="class" :rules="[{ required: true, message: '请填写使用的班级', trigger: 'blur' }]">
<el-form-item label="使用班级" prop="class">
<el-input v-model="form.class" disabled></el-input>
</el-form-item>
<el-form-item label="班级人数" prop="population" :rules="[{ required: true, message: '填写班级人数', trigger: 'blur' }]">
<el-form-item label="班级人数" prop="population">
<el-input v-model="form.population" disabled></el-input>
</el-form-item>
<el-form-item label="备注" prop="remind"><el-input v-model="form.remind" placeholder="请输入备注"></el-input></el-form-item>
</el-form>
<div slot="footer">
<el-button type="primary" @click="setTime"></el-button>
<el-button @click="cancelAppy"></el-button>
</div>
</el-dialog>
<!-- 表格节数选择-->
<el-dialog :visible.sync="courseDialog" append-to-body :close-on-click-modal="false" v-if="tableAlive" >
<!-- 表格节数选择-->
<el-dialog :title="form.position+' '+form.name" :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>
<span slot="footer" class="dialog-footer">
<el-button @click="cancelSetWeeks"> </el-button>
<el-button type="primary" @click="setWeeks"> </el-button>
</span>
</el-dialog>
<!-- checkbox:周次选择-->
<el-dialog :visible.sync="weekDialog" title="请选择周数" width="400px" :close-on-click-modal="false" >
<week-selection @add="addWeek" @cancel="cancelSelection" ref="weekSelection" ></week-selection>
<!-- checkbox:周次选择-->
<el-dialog :visible.sync="weekDialog" title="请选择周数" width="400px" :close-on-click-modal="false">
<week-selection @add="addWeek" @cancel="cancelSelection" ref="weekSelection" :able-list="ableList"></week-selection>
</el-dialog>
</el-container>
</div>
</template>
@ -103,58 +95,61 @@
import timeSelect from "~/components/timeSelect";
import {get, post, stop} from "~/utils";
import {showDialog, showFail, showSuccess} from "~/utils/dialog";
export default {
name: "applyLab",
components:{
tb_course,
navBar,
weekSelection,
timeSelect
components: {
tb_course, navBar, weekSelection, timeSelect
},
data(){
return{
user:{},
lab:{},
data() {
return {
user: {},
lab: {},
ableList:[],
tableAlive: false, //
tableData: [{}],
checkOption: [],
tableAlive:false, //
tableData:[{}],
checkOption :[],
formDialog: false,
courseDialog: false,
weekDialog: false,
formDialog:false,
courseDialog:false,
weekDialog:false,
perTargetValue: '',
aWeekValue: [],
allWeeksValue: [],
perTargetValue:'',
aWeekValue:[],
allWeeksValue:[],
form:{
position:'',
name:'',
form: {
position: '',
name: '',
date: '',
nickname:'',
tel:'',
course_name:'',
class:'',
population:'',
schedule:'',
remind:'无'
nickname: '',
tel: '',
course_name: '',
class: '',
population: '',
schedule: '',
remind: '无'
},
courseOption:[]
courseOption: []
}
},
methods:{
methods: {
//
cellStyle:function({row, column, rowIndex, columnIndex}){
if (column.label!=''){
cellStyle: function ({row, column, rowIndex, columnIndex}) {
if (column.label != '') {
return 'cursor:pointer'
}
},
//
cellClick(row, column, cell, event) {
console.log(row.index)
this.aWeekValue.push(row.index,column.index)
async cellClick(row, column, cell, event) {
this.form.day = column.index
this.form.time = row.index
this.form.year = this.$refs.timeSelection.year
this.form.semester = this.$refs.timeSelection.semester
this.ableList = await get("lb/labTime/getWeeksAbleBook",this.form)
this.aWeekValue.push(row.index, column.index)
//()使disable
// let position = this.lab.position
// let rowIndex = row.index
@ -169,142 +164,141 @@
// console.log(row.index)
// console.log(column.index)
if (column.label!='') {
this.weekDialog=true
this.perTargetValue=event.target //targettarget
if (column.label != '') {
this.weekDialog = true
this.perTargetValue = event.target //targettarget
}
},
//
clickLabApply(row){
this.lab=row
this.form={
position:'',
name:'',
date: '',
nickname:'',
tel:'',
course_name:'',
class:'',
population:'',
schedule:'',
remind:'无'
clickLabApply(row) {
console.log(row)
this.lab = row
this.form = {
labId: row.lab_id,
position: row.position,
name: row.name,
nickname: this.user.nickname,
tel: this.user.tel,
class: '',
population: '',
remind: '无'
}
this.formDialog=true
this.formDialog = true
},
//
checkDetail(row){
this.$router.push('/labApplyDetail/'+row.position) //使
checkDetail(row) {
this.$router.push('/labApplyDetail/' + row.position) //使
},
//
selectChange(){
console.log('aaaaaa')
var d=new Date()
// this.form.position= this.lab.position //
// this.form.name= this.lab.name //
this.form.date=d.getFullYear()+'/'+(d.getMonth()+1)+'/'+d.getDate() //
// this.form.nickname= this.user.nickname //
// this.form.tel= this.user.tel //
// this.form.class= this.courseOption.class //
// this.form.population= this.courseOption.population //
async selectChange(uc_id) {
let course = await get("lb/usercourse/findusercourse/" + uc_id)
this.form.class = course.classes
this.form.population = course.population
},
//
async addWeek() {
this.weekDialog=false
var targetValue = this.$refs.weekSelection.checkedValue
await showDialog("确认设置此时间段吗?",this)
if(targetValue.length!==0){
this.perTargetValue.textContent='【'+targetValue+'】周'
this.weekDialog = false
const targetValue = this.$refs.weekSelection.checkedValue
this.form.weeks = targetValue
await showDialog("确认提交选择该时间段吗?", this)
console.log(this.form)
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.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.aWeekValue = []
this.$refs.weekSelection.checkedValue = [] //
// console.log(this.allWeeksValue)
//
await post('lb/labRecord/updateWeeks', this.form);
},
//
async cancelSelection() {
for (let i=0;i<this.allWeeksValue.length;i++){
if (this.aWeekValue[0]===this.allWeeksValue[i][0] && this.aWeekValue[1]===this.allWeeksValue[i][1]){
this.allWeeksValue.splice(i,1)
for (let i = 0; i < this.allWeeksValue.length; i++) {
if (this.aWeekValue[0] === this.allWeeksValue[i][0] && this.aWeekValue[1] === this.allWeeksValue[i][1]) {
this.allWeeksValue.splice(i, 1)
console.log(this.allWeeksValue)
}
}
this.aWeekValue=[]
this.perTargetValue.style.backgroundColor=''
this.perTargetValue.textContent=''
this.aWeekValue = []
this.perTargetValue.style.backgroundColor = ''
this.perTargetValue.textContent = ''
//allWeeksValue
// if (this.perTargetValue!=''){
// this.allWeeksValue.pop()
// }
this.weekDialog=false
this.weekDialog = false
},
//
async setWeeks () {
async setWeeks() {
console.log(this.allWeeksValue)
await post('/lb_teacher_applyLab',{
weeks:this.allWeeksValue,
year:this.$refs.timeSelection.year,
semester:this.$refs.timeSelection.semester,
position:this.form.position,
name:this.form.name,
await post('/lb_teacher_applyLab', {
weeks: this.allWeeksValue,
year: this.$refs.timeSelection.year,
semester: this.$refs.timeSelection.semester,
position: this.form.position,
name: this.form.name,
date: this.form.date,
nickname:this.form.nickname,
tel:this.form.tel,
course_name:this.form.course_name,
class:this.form.class,
population:this.form.population,
remind:this.form.remind
nickname: this.form.nickname,
tel: this.form.tel,
course_name: this.form.course_name,
class: this.form.class,
population: this.form.population,
remind: this.form.remind
})
// this.form.schedule=this.allWeeksValue.toString()
this.courseDialog=false
this.courseDialog = false
// console.log(this.$refs.times)
this.tableAlive=false
this.tableAlive = false
},
//
cancelSetWeeks:function () {
this.allWeeksValue=[]
this.form.schedule=""
this.courseDialog=false
this.formDialog=true
cancelSetWeeks: function () {
this.allWeeksValue = []
this.form.schedule = ""
this.courseDialog = false
this.formDialog = true
console.log(this.allWeeksValue)
this.tableAlive=false //
this.tableAlive = false //
},
setTime:function () {
this.tableAlive=true
setTime: function () {
this.tableAlive = true
alert('这里本来要验证的,为了方便查看表格,暂无设置,需要验证请把代码行注释解除掉')
this.courseDialog=true
this.courseDialog = true
// this.$refs.courseForm.validate(()=>{
// if (vailid){
// this.courseDialog=true
// }
// })
this.formDialog=false
this.formDialog = false
},
cancelAppy:function () {
this.formDialog=false
cancelAppy: function () {
this.formDialog = false
},
//
toMyRecord(){
this.$router.push('/teacher/myApplyRecord/'+this.user.u_id) //user.u_id
toMyRecord() {
this.$router.push('/teacher/myApplyRecord/' + this.user.u_id) //user.u_id
},
async loadCourse() {
this.courseOption = await get("lb/usercourse/findbyyearandsemester/" + this.$refs.timeSelection.year + "/" + this.$refs.timeSelection.semester)
}
},
//mouted
async mounted() {
this.courseOption = get('',this.u_id) //id
// this.courseOption = get('',this.u_id) //id
//
this.courseOption=[{
this.courseOption = [{
year: '1819',
semester: '2',
uc_id: '12345677',
@ -315,11 +309,9 @@
isHaveDocuments: '1',
remind: '无',
}]
// console.log(this.$refs.detailtb)
console.log('this is mouted')
console.log(this.$refs.weekSelection)
var d = new Date()
this.tableData = await get('/lb/lab/getLabList')
this.user = await get('lb/user/getUserInfo')
await this.loadCourse()
}
}
</script>

Loading…
Cancel
Save