Skip to content

C
confucius
Commit 649d2135 authored by zhengke's avatar zhengke
Browse files
Options

修改

parent 033ad8aa
Hide whitespace changes
Inline Side-by-side
Showing with 184 additions and 156 deletions
src/App.vue
View file @ 649d2135
......@@ -12,7 +12,7 @@ export default {
<style>
@import url('~assets/css/font.css');
@import url('//at.alicdn.com/t/font_2077629_2ushkr6o1zh.css');
@import url('//at.alicdn.com/t/font_2077629_ftvlxetznib.css');
html,
body,
......
src/components/course/lesson-form.vue
View file @ 649d2135
......@@ -87,161 +87,185 @@
text-align: center;
border-radius: 50%;
}
</style><template>
<div class="lesson_Form">
<div class="calenderHeader">
<div>
<el-radio-group v-model="checkedDays" size="mini">
<el-radio-button label="日"></el-radio-button>
<el-radio-button label="月"></el-radio-button>
<el-radio-button style="margin-left:20px;border-left:1px solid #DCDFE6;" label="今天"></el-radio-button>
</el-radio-group>
</div>
<div>
<q-btn color="accent q-px-md" class="q-mr-md" icon="add" size="12px" label="新增日程" @click="addNew()">
<q-popup-proxy>
<q-banner v-if="isShowMenu">
<div class="calenderDialog">
<div style="margin:10px 0 15px 0;">新增课程安排</div>
<q-select filled stack-label option-value="TId" option-label="TeacherName" v-model="addMsg.TeacherId"
ref="Teacher_Id" :options="TeacherList" label="关联教师" :dense="false" class="col-6 q-pb-lg" emit-value
map-options />
<q-input filled v-model="addMsg.ClassDate" class="col-6 q-pb-lg" mask="date" label="上课时间">
<template v-slot:append>
<q-icon name="event" class="cursor-pointer">
<q-popup-proxy ref="qDateProxy1" transition-show="scale" transition-hide="scale">
<q-date v-model="addMsg.ClassDate" @input="() => $refs.qDateProxy1.hide()" />
</q-popup-proxy>
</q-icon>
</template>
</q-input>
<q-toggle size="md" label="更多设置" left-label color="primary" :false-value="0" :true-value="1"
v-model="isSetMore" />
<template v-if="isSetMore==1">
<q-select filled stack-label option-value="RoomId" option-label="RoomName"
v-model="addMsg.ClassRoomId" ref="ClassRoomId" :options="ClassRoomList" label="关联教室" :dense="false"
class="col-6 q-pb-lg" emit-value map-options />
<div style="display:flex;justify-content:flex-end;margin-bottom:20px;">
<q-btn @click="addStep()" size="10px" round color="primary" icon="iconfont icon-img_haha" />
</div>
<div class="row wrap" style="position:relative;" v-for="(subItem,subIndex) in addMsg.PlanTimeList">
<div class="col-6">
<q-input filled stack-label maxlength="20" :dense="false" v-model="subItem.StartTime"
ref="StartTime" class="col-6 q-pr-lg q-pb-lg" label="" :rules="[val => !!val || '请填写开始时间']" />
</div>
<div class="col-6">
<q-input filled stack-label maxlength="20" :dense="false" v-model="subItem.EndTime" ref="EndTime"
class="col-6 q-pr-lg q-pb-lg" label="" :rules="[val => !!val || '请填写开始时间']" />
.StudentInfo_List{
display: flex;
justify-content: space-between;
}
</style>
<template>
<div v-if="!isShowSign">
<div class="lesson_Form">
<div class="calenderHeader">
<div>
<el-radio-group v-model="checkedDays" size="mini">
<el-radio-button label="日"></el-radio-button>
<el-radio-button label="月"></el-radio-button>
<!-- <el-radio-button style="margin-left:20px;border-left:1px solid #DCDFE6;" label="今天"></el-radio-button> -->
</el-radio-group>
</div>
<div>
<q-btn color="accent q-px-md" class="q-mr-md" icon="add" size="12px" label="新增日程" @click="addNew()">
<q-popup-proxy>
<q-banner v-if="isShowMenu">
<div class="calenderDialog">
<div style="margin:10px 0 15px 0;">新增课程安排</div>
<q-select filled stack-label option-value="TId" option-label="TeacherName" v-model="addMsg.TeacherId"
ref="Teacher_Id" :options="TeacherList" label="关联教师" :dense="false" class="col-6 q-pb-lg" emit-value
map-options />
<q-input filled v-model="addMsg.ClassDate" class="col-6 q-pb-lg" mask="date" label="上课时间">
<template v-slot:append>
<q-icon name="event" class="cursor-pointer">
<q-popup-proxy ref="qDateProxy1" transition-show="scale" transition-hide="scale">
<q-date v-model="addMsg.ClassDate" @input="() => $refs.qDateProxy1.hide()" />
</q-popup-proxy>
</q-icon>
</template>
</q-input>
<q-toggle size="md" label="更多设置" left-label color="primary" :false-value="0" :true-value="1"
v-model="isSetMore" />
<template v-if="isSetMore==1">
<q-select filled stack-label option-value="RoomId" option-label="RoomName"
v-model="addMsg.ClassRoomId" ref="ClassRoomId" :options="ClassRoomList" label="关联教室" :dense="false"
class="col-6 q-pb-lg" emit-value map-options />
<div style="display:flex;justify-content:flex-end;margin-bottom:20px;">
<q-btn @click="addStep()" size="10px" round color="primary" icon="iconfont icon-img_haha" />
</div>
<div class="delBtnStyle">
<i @click="delStep(subIndex)" class="iconfont icon-guanbi"></i>
<div class="row wrap" style="position:relative;" v-for="(subItem,subIndex) in addMsg.PlanTimeList">
<div class="col-6">
<q-input filled stack-label maxlength="20" :dense="false" v-model="subItem.StartTime"
ref="StartTime" class="col-6 q-pr-lg q-pb-lg" label="" :rules="[val => !!val || '请填写开始时间']" />
</div>
<div class="col-6">
<q-input filled stack-label maxlength="20" :dense="false" v-model="subItem.EndTime" ref="EndTime"
class="col-6 q-pr-lg q-pb-lg" label="" :rules="[val => !!val || '请填写开始时间']" />
</div>
<div class="delBtnStyle">
<i @click="delStep(subIndex)" class="iconfont icon-guanbi"></i>
</div>
</div>
</div>
</template>
<q-card-actions align="right" class="bg-white">
<q-btn label="取消" flat color="grey-10" @click="isShowMenu=false" style="font-weight:400 !important" />
<q-btn label="确认" color="accent q-px-md" style="font-weight:400 !important" @click="saveSteps" />
</q-card-actions>
</div>
</q-banner>
</q-popup-proxy>
</q-btn>
</template>
<q-card-actions align="right" class="bg-white">
<q-btn label="取消" flat color="grey-10" @click="isShowMenu=false" style="font-weight:400 !important" />
<q-btn label="确认" color="accent q-px-md" style="font-weight:400 !important" @click="saveSteps" />
</q-card-actions>
</div>
</q-banner>
</q-popup-proxy>
</q-btn>
</div>
</div>
</div>
<el-calendar v-model="value" id="calendar">
<!-- 这里使用的是 2.5 slot 语法，对于新项目请使用 2.6 slot 语法-->
<template slot="dateCell" slot-scope="{date, data}">
<!--自定义内容-->
<div class="calendar-day">{{ data.day.split('-').slice(2).join('-') }}</div>
<div v-for="item in calendarData">
<div v-if="item.ClassDateStr==data.day">
<div class="calendarTop">
<div>{{item.RoomName}}</div>
<div>
<i class="iconfont icon-edit" @click.stop="getInfo(item)">
<q-popup-proxy>
<q-banner v-if="isShowEdit">
<div class="calenderDialog">
<div style="margin:10px 0 15px 0;">{{item.ClassDateStr}}课程安排</div>
<q-select filled stack-label option-value="TId" option-label="TeacherName"
v-model="addMsg.TeacherId" ref="Teacher_Id" :options="TeacherList" label="关联教师" :dense="false"
class="col-6 q-pb-lg" emit-value map-options />
<!-- <div class="calenderClassDate">
<div>上课时间:{{item.ClassDateStr}}</div>
<div>
<i class="iconfont icon-zhuanhuan1"></i><span style="color:#2961fe;cursor:pointer;" @click="isShowCanlder=true;">变更时间</span>
</div>
</div> -->
<q-input filled v-model="addMsg.ClassDate" class="col-6 q-pb-lg" mask="date" label="上课时间">
<template v-slot:append>
<q-icon name="event" class="cursor-pointer">
<q-popup-proxy ref="qDateProxy3" transition-show="scale" transition-hide="scale">
<q-date v-model="addMsg.ClassDate" @input=' () => $refs.qDateProxy3[0].hide()' />
</q-popup-proxy>
</q-icon>
</template>
</q-input>
<q-toggle size="md" label="更多设置" left-label color="primary" :false-value="0" :true-value="1"
v-model="isSetMoreTwo" />
<template v-if="isSetMoreTwo==1">
<q-select filled stack-label option-value="RoomId" option-label="RoomName"
v-model="addMsg.ClassRoomId" ref="ClassRoomId" :options="ClassRoomList" label="关联教室"
:dense="false" class="col-6 q-pb-lg" emit-value map-options />
<div style="display:flex;justify-content:flex-end;margin-bottom:20px;">
<q-btn @click="addStep()" size="10px" round color="primary" icon="iconfont icon-img_haha" />
</div>
<div class="row wrap" style="position:relative;"
v-for="(subItem,subIndex) in addMsg.PlanTimeList">
<div class="col-6">
<q-input filled stack-label maxlength="20" :dense="false" v-model="subItem.StartTime"
ref="StartTime" class="col-6 q-pr-lg q-pb-lg" label=""
:rules="[val => !!val || '请填写开始时间']" />
<el-calendar v-model="value" id="calendar">
<!-- 这里使用的是 2.5 slot 语法，对于新项目请使用 2.6 slot 语法-->
<template slot="dateCell" slot-scope="{date, data}">
<!--自定义内容-->
<div class="calendar-day">{{ data.day.split('-').slice(2).join('-') }}</div>
<div v-for="item in calendarData" @click="getClicked(item)">
<div v-if="item.ClassDateStr==data.day">
<div class="calendarTop">
<div>{{item.RoomName}}</div>
<div>
<i class="iconfont icon-edit" @click.stop="getInfo(item)">
<q-popup-proxy>
<q-banner v-if="isShowEdit">
<div class="calenderDialog">
<div style="margin:10px 0 15px 0;">{{item.ClassDateStr}}课程安排</div>
<q-select filled stack-label option-value="TId" option-label="TeacherName"
v-model="addMsg.TeacherId" ref="Teacher_Id" :options="TeacherList" label="关联教师" :dense="false"
class="col-6 q-pb-lg" emit-value map-options />
<!-- <div class="calenderClassDate">
<div>上课时间:{{item.ClassDateStr}}</div>
<div>
<i class="iconfont icon-zhuanhuan1"></i><span style="color:#2961fe;cursor:pointer;" @click="isShowCanlder=true;">变更时间</span>
</div>
<div class="col-6">
<q-input filled stack-label maxlength="20" :dense="false" v-model="subItem.EndTime"
ref="EndTime" class="col-6 q-pr-lg q-pb-lg" label=""
:rules="[val => !!val || '请填写开始时间']" />
</div> -->
<q-input filled v-model="addMsg.ClassDate" class="col-6 q-pb-lg" mask="date" label="上课时间">
<template v-slot:append>
<q-icon name="event" class="cursor-pointer">
<q-popup-proxy ref="qDateProxy3" transition-show="scale" transition-hide="scale">
<q-date v-model="addMsg.ClassDate" @input=' () => $refs.qDateProxy3[0].hide()' />
</q-popup-proxy>
</q-icon>
</template>
</q-input>
<q-toggle size="md" label="更多设置" left-label color="primary" :false-value="0" :true-value="1"
v-model="isSetMoreTwo" />
<template v-if="isSetMoreTwo==1">
<q-select filled stack-label option-value="RoomId" option-label="RoomName"
v-model="addMsg.ClassRoomId" ref="ClassRoomId" :options="ClassRoomList" label="关联教室"
:dense="false" class="col-6 q-pb-lg" emit-value map-options />
<div style="display:flex;justify-content:flex-end;margin-bottom:20px;">
<q-btn @click="addStep()" size="10px" round color="primary" icon="iconfont icon-img_haha" />
</div>
<div class="delBtnStyle">
<i @click="delStep(subIndex)" class="iconfont icon-guanbi"></i>
<div class="row wrap" style="position:relative;"
v-for="(subItem,subIndex) in addMsg.PlanTimeList">
<div class="col-6">
<q-input filled stack-label maxlength="20" :dense="false" v-model="subItem.StartTime"
ref="StartTime" class="col-6 q-pr-lg q-pb-lg" label=""
:rules="[val => !!val || '请填写开始时间']" />
</div>
<div class="col-6">
<q-input filled stack-label maxlength="20" :dense="false" v-model="subItem.EndTime"
ref="EndTime" class="col-6 q-pr-lg q-pb-lg" label=""
:rules="[val => !!val || '请填写开始时间']" />
</div>
<div class="delBtnStyle">
<i @click="delStep(subIndex)" class="iconfont icon-guanbi"></i>
</div>
</div>
</div>
</template>
<q-card-actions align="right" class="bg-white">
<q-btn label="取消" flat color="grey-10" @click="isShowEdit=false"
style="font-weight:400 !important" />
<q-btn label="确认" color="accent q-px-md" style="font-weight:400 !important"
@click="saveSteps" />
</q-card-actions>
</div>
</q-banner>
</q-popup-proxy>
</i>
<i class="iconfont icon-guanbi" style="margin-left:5px;" @click.stop="delInfo(item)"></i>
</template>
<q-card-actions align="right" class="bg-white">
<q-btn label="取消" flat color="grey-10" @click="isShowEdit=false"
style="font-weight:400 !important" />
<q-btn label="确认" color="accent q-px-md" style="font-weight:400 !important"
@click="saveSteps" />
</q-card-actions>
</div>
</q-banner>
</q-popup-proxy>
</i>
<i class="iconfont icon-guanbi" style="margin-left:5px;" @click.stop="delInfo(item)"></i>
</div>
</div>
</div>
<div class="calendarInner">
<div v-for="(subItem,subIndex) in item.TimeList">
{{subIndex+1}}节课 {{subItem.StartTime}}-{{subItem.EndTime}}
<div class="calendarInner">
<div v-for="(subItem,subIndex) in item.TimeList">
{{subIndex+1}}节课 {{subItem.StartTime}}-{{subItem.EndTime}}
</div>
</div>
</div>
<div class="caldendarTeacher">
<div style="margin-right:5px;">{{item.TeacherName}}</div>
<div>
<q-avatar size="sm" v-if="item.UserIcon">
<img :src="item.UserIcon" />
</q-avatar>
<q-avatar size="sm" color="teal-10" text-color="white" v-if="!item.UserIcon">
{{GetFirst(item.TeacherName)}}</q-avatar>
<div class="caldendarTeacher">
<div style="margin-right:5px;">{{item.TeacherName}}</div>
<div>
<q-avatar size="sm" v-if="item.UserIcon">
<img :src="item.UserIcon" />
</q-avatar>
<q-avatar size="sm" color="teal-10" text-color="white" v-if="!item.UserIcon">
{{GetFirst(item.TeacherName)}}</q-avatar>
</div>
</div>
</div>
<div v-else></div>
</div>
<div v-else></div>
</template>
</el-calendar>
</div>
</div>
<div v-else>
<div>
<div><i class="iconfont icon-zuo1"></i>返回</div>
<div class="StudentInfo_List">
<div>
<div>授课老师</div>
<div>李琴</div>
</div>
<div>
<div>授课时间</div>
<div>2020年11月10日</div>
</div>
</template>
</el-calendar>
<div>
<div>教室</div>
<div>财务二教</div>
</div>
</div>
</div>
</div>
</template>
......@@ -292,25 +316,32 @@
isShowMenu: false, //是否显示弹出
isShowEdit: false, //是否显示修改弹出
isShowCanlder: false, //是否显示日历修改日期
isShowSign:false
}
},
created() {
this.$nextTick(() => {
// 点击上个月
var d = new Date(this.value);
var datetime = d.getFullYear() + '-' + (d.getMonth() + 1);
let prevBtn1 = document.querySelector('.el-calendar__button-group .el-button-group>button:nth-child(1)');
prevBtn1.addEventListener('click', () => {
var d = new Date(this.value);
var datetime = d.getFullYear() + '-' + (d.getMonth() + 1);
this.getClassPlan(datetime);
})
// 点击今天
let prevBtn2 = document.querySelector('.el-calendar__button-group .el-button-group>button:nth-child(2)');
prevBtn2.addEventListener('click', () => {
var d = new Date(this.value);
var datetime = d.getFullYear() + '-' + (d.getMonth() + 1);
this.getClassPlan(datetime);
})
// 点击下个月
let prevBtn3 = document.querySelector('.el-calendar__button-group .el-button-group>button:nth-child(3)');
prevBtn3.addEventListener('click', () => {
var d = new Date(this.value);
var datetime = d.getFullYear() + '-' + (d.getMonth() + 1);
this.getClassPlan(datetime);
})
})
......@@ -340,7 +371,6 @@
QMonth: datetime
};
quertClassPlan(msg).then(res => {
console.log("res", res);
if (res.Code == 1) {
this.calendarData = res.Data;
}
......@@ -351,7 +381,6 @@
getTeacherDropDownList({}).then(res => {
if (res.Code == 1) {
this.TeacherList = res.Data;
console.log(this.TeacherList, 'this.TeacherList');
}
})
},
......@@ -375,8 +404,6 @@
},
//删除
delStep(index) {
// this.isShowMenu=true;
console.log(this.isShowMenu, 'this.isShowMenu');
this.addMsg.PlanTimeList.splice(index, 1);
},
//点击新增
......@@ -406,11 +433,9 @@
this.addMsg.ClassPlanId = Obj.ClassPlanId;
this.addMsg.ClassId = Obj.ClassId;
this.addMsg.ClassDate = Obj.ClassDate;
// this.addMsg.ClassDateStr = Obj.ClassDateStr;
this.addMsg.ClassRoomId = Obj.ClassRoomId;
this.addMsg.TeacherId = Obj.TeacherId;
this.addMsg.PlanTimeList = Obj.TimeList;
console.log(item, '数据来了');
},
//日历点击删除
delInfo(item) {
......@@ -437,10 +462,13 @@
})
});
},
getCanlder() {
// this.isShowEdit=true;
// this.isShowCanlder=false;
},
//点击日历
getClicked(item){
console.log(item,'rili');
if(item.IsEndDate){
this.isShowSign=true;
}
}
},
}
......
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment