Commit a672cd3c authored by 罗超's avatar 罗超
parents 100cd38a 52e0309e
...@@ -14,7 +14,7 @@ ...@@ -14,7 +14,7 @@
"@riophae/vue-treeselect": "^0.4.0", "@riophae/vue-treeselect": "^0.4.0",
"ali-oss": "^6.12.0", "ali-oss": "^6.12.0",
"axios": "^0.18.1", "axios": "^0.18.1",
"browser-md5-file": "^1.1.1", "browser-md5-file": "^1.0.0",
"co": "^4.6.0", "co": "^4.6.0",
"core-js": "^3.6.5", "core-js": "^3.6.5",
"cos-js-sdk-v5": "^1.1.5", "cos-js-sdk-v5": "^1.1.5",
...@@ -32,7 +32,7 @@ ...@@ -32,7 +32,7 @@
"relation-graph": "^1.0.8", "relation-graph": "^1.0.8",
"v-viewer": "^1.5.1", "v-viewer": "^1.5.1",
"vue-amap": "^0.5.10", "vue-amap": "^0.5.10",
"vue-draggable-resizable": "^1.7.5", "vue-draggable-resizable": "^1.7.2",
"vue-easytable": "^1.7.2", "vue-easytable": "^1.7.2",
"vue-i18n": "^8.0.0", "vue-i18n": "^8.0.0",
"vue-inline-svg": "^2.0.0", "vue-inline-svg": "^2.0.0",
......
...@@ -30,7 +30,7 @@ export function getSchoolAndRoomNav(data) { ...@@ -30,7 +30,7 @@ export function getSchoolAndRoomNav(data) {
*/ */
export function getClassRoomTimeList(data) { export function getClassRoomTimeList(data) {
return request({ return request({
url: '/ClassRoom/GetClassRoomTimeList', url: '/ClassRoom/GetNewClassRoomTimeList',
method: 'post', method: 'post',
data data
}) })
......
...@@ -167,7 +167,7 @@ ...@@ -167,7 +167,7 @@
<div class="col-3 "> <div class="col-3 ">
<q-select @input="resetSearch" standout="bg-primary text-white" v-model="msg.SelectIsEnd" <q-select @input="resetSearch" standout="bg-primary text-white" v-model="msg.SelectIsEnd"
class="col-6 q-pr-lg q-pr-lg" :options="statusOpts" emit-value map-options label="状态" class="col-6 q-pr-lg q-pr-lg" :options="statusOpts" emit-value map-options label="状态"
@change="resetSearch" /> />
</div> </div>
</div> </div>
</div> </div>
...@@ -208,12 +208,15 @@ ...@@ -208,12 +208,15 @@
<template v-slot:body-cell-AgeAndPeopleNum="props"> <template v-slot:body-cell-AgeAndPeopleNum="props">
<q-td :props="props"> <q-td :props="props">
<div> <div>
<div>{{props.row.AgeLimit ==1?'不区分年龄':'区分年龄'}}</div> <!-- <div>{{props.row.AgeLimit ==1?'不区分年龄':'区分年龄'}}</div>
<div v-if="props.row.AgeLimit==0">范围:{{props.row.StartAge}}岁~{{props.row.EndAge}}</div> <div v-if="props.row.AgeLimit==0">范围:{{props.row.StartAge}}岁~{{props.row.EndAge}}</div>-->
<div>报名人数</div> <!-- <div>报名人数</div> -->
<div v-if="props.row.Distinguish ==1">总人数:{{props.row.ManNum}}</div> <div v-if="props.row.Distinguish ==1">总人数:{{props.row.ManNum}}</div>
<div v-if="props.row.Distinguish ==0">男性:{{props.row.ManNum}}<span <div v-if="props.row.Distinguish ==0">男性:{{props.row.ManNum}}<span
style="margin-left:10px">女性:{{props.row.WoManNum}}</span> </div> style="margin-left:10px">女性:{{props.row.WoManNum}}</span> </div>
<div >
已报入:{{props.row.JoinNum}}
</div>
</div> </div>
</q-td> </q-td>
</template> </template>
...@@ -368,7 +371,7 @@ ...@@ -368,7 +371,7 @@
}, },
{ {
name: "AgeAndPeopleNum", name: "AgeAndPeopleNum",
label: "年龄和报名人数", label: "总人数/已报入",
align: "left" align: "left"
}, },
{ {
......
<style lang="scss" scoped>
@import "./css/comSummary.css";
.td-item{
// min-width: 160px;
width: 195px;
position: relative;
margin-left:9px;
border-radius: 4px;
box-shadow: 0px 4px 40px 0px rgba(2, 44, 66, 0.1);
// margin-bottom: 20px;
padding: 10px;
background-color: #fff;
.ClassStatus{
position: absolute;
top: 0;
right: 0px;
}
.name{
font-size: 14px;
font-family: PingFang SC;
font-weight: 500;
color: #111111;
margin-bottom: 10px;
}
.time{
font-size: 12px;
font-family: PingFang SC;
font-weight: 500;
color: #999999;
}
}
.td-bg{
background-color: #F1F6FB;
}
.flexOne .el-timeline{
padding-left: 5px;
}
.tbody{
// width: calc(100% + 10px);
width: 1680px;
padding-right: 10px;
height: calc(100vh - 200px);
box-sizing: border-box;
overflow-y: scroll;
overflow-x: hidden;
}
.body-td{
position: relative;
}
.tbody::-webkit-scrollbar{
width:10px;
height:10px;
/**/
}
.tbody::-webkit-scrollbar-track{
background: rgb(239, 239, 239);
border-radius:2px;
}
.tbody::-webkit-scrollbar-thumb{
background: #bfbfbf;
border-radius:10px;
}
.tbody::-webkit-scrollbar-thumb:hover{
background: #333;
}
.mainSummary th:first-child,
td:first-child {
position: sticky;
left: 0;
z-index: 1;
}
</style>
<template> <template>
<div class="flexOne comSummary"> <div class="flexOne comSummary MainPlan">
<div class="mainSummary"> <div>
<!-- <table> <table class="ClassPlanTable plantHead" style="border-collapse:collapse;width:100%;margin:15px 0 0 0;">
<colgroup> <thead>
<col style="width: 80px;" /> <tr>
<col /> <th colspan="16">教室使用记录</th>
</colgroup> </tr>
<thead> <tr>
<tr><th>序号</th><th>内容</th></tr> <th>周一</th>
</thead> <th>周二</th>
</table> --> <th>周三</th>
<table class="summaryTable" cellspacing="0"> <th>周四</th>
<colgroup> <th>周五</th>
<col width='105px'/> <th>周六</th>
<col width='10px'/> <th>周日</th>
<col width='215px'/> </tr>
<col width='215px'/> </thead>
<col width='215px'/> </table>
<col width='215px'/> <div class="planTabDiv" ref="planTabDiv">
<col width='215px'/> <table class="ClassPlanTable" ref="PlanTable" style="border-collapse:collapse;margin-top:0;">
<col width='215px'/> <tbody>
<col width='215px'/> <tr v-for="(item,index) in tbodayData.fridayList" :key="index">
<col width='10px'/> <td>
</colgroup> <div class="plan_ClassDate">{{tbodayData.mondayList[index].ClassDate}}</div>
<thead> <mateitem @unusual="taggleUserHistory" v-if="tbodayData.mondayList&&tbodayData.mondayList[index].SubList"
<th class=""> :dayData="tbodayData.mondayList[index]"></mateitem>
<div class="leftDay"> </td>
<div class="leftDayTop"> <td>
<!-- <span class="yearCircle"></span> --> <div class="plan_ClassDate">{{tbodayData.tuesdayList[index].ClassDate}}</div>
{{nowYear}} <mateitem @unusual="taggleUserHistory" v-if="tbodayData.tuesdayList&&tbodayData.tuesdayList[index].SubList"
<!-- <span class="yearCircle"></span> --> :dayData="tbodayData.tuesdayList[index]"></mateitem>
<!-- <div class="rili LI1"></div> </td>
<div class="rili LI2"></div> --> <td>
</div> <div class="plan_ClassDate">{{tbodayData.wednesdayList[index].ClassDate}}</div>
<span class="monthNum">{{nowMonth}}</span> <mateitem @unusual="taggleUserHistory" v-if="tbodayData.wednesdayList&&tbodayData.wednesdayList[index].SubList"
<!-- <span class="monthLis">{{$t('pub.month')}}</span> --> :dayData="tbodayData.wednesdayList[index]"></mateitem>
</div> </td>
<td>
</th> <div class="plan_ClassDate">{{tbodayData.thursdayList[index].ClassDate}}</div>
<th style="width:10px"> <mateitem @unusual="taggleUserHistory" v-if="tbodayData.thursdayList&&tbodayData.thursdayList[index].SubList"
<div class="Arrow" @click="leftClick()"> :dayData="tbodayData.thursdayList[index]"></mateitem>
<i class="iconfont icon-previewleft"></i> </td>
</div> <td>
</th> <div class="plan_ClassDate">{{tbodayData.fridayList[index].ClassDate}}</div>
<th v-for="(k,index) in Calendar" :key="k.subCode" :width="180" :class="{'redType':k.Week=='日'||k.Week=='六','ckedTd':index==columnLine&&dataList!=''}" @click="getDayInfo(k.CurrentYear,k.CurrentMonth,k.CurrentDay)" @mouseover="columnsMouseOver(index)"> <mateitem @unusual="taggleUserHistory" v-if="tbodayData.fridayList&&tbodayData.fridayList[index].SubList"
<div slot="reference"> :dayData="tbodayData.fridayList[index]"></mateitem>
<div class="_week">{{k.Week}}</div> </td>
<div class="_monthDay" v-if="k.CurrentDay==1"> <td>
<span>{{k.CurrentMonthCn}}<br/>{{$t('pub.month')}}</span> <div class="plan_ClassDate">{{tbodayData.saturdayList[index].ClassDate}}</div>
</div> <mateitem @unusual="taggleUserHistory" v-if="tbodayData.saturdayList&&tbodayData.saturdayList[index].SubList"
<div class="_day" v-else>{{k.CurrentDay}}</div> :dayData="tbodayData.saturdayList[index]"></mateitem>
<!-- <div class="_longli">{{k.LunarDayCn}}</div> --> </td>
</div> <td>
<div class="_lineSummary" v-if="index==columnLine&&dataList!=''"></div> <div class="plan_ClassDate">{{tbodayData.sundayList[index].ClassDate}}</div>
</th> <mateitem @unusual="taggleUserHistory" v-if="tbodayData.sundayList&&tbodayData.sundayList[index].SubList"
<th style="width:10px"> :dayData="tbodayData.sundayList[index]"></mateitem>
<div class="Arrow" @click="rightClick()"> </td>
<i class="iconfont icon-arrow-right"></i> </tr>
</div> </tbody>
</th> </table>
</thead> </div>
</div>
</table> <UserHistory ref="history" :classroomId="classroomUserId"></UserHistory>
<div class="tbody" style="width:1680px" > </div>
<colgroup>
<col width='140px'/>
<col width='215px'/>
<col width='215px'/>
<col width='215px'/>
<col width='215px'/>
<col width='215px'/>
<col width='215px'/>
<col width='215px'/>
<col/>
</colgroup>
<tbody>
<tr>
<td style="width:50px;text-align:center;padding-top:8px; width:140px">
<el-timeline :reverse="reverse">
<el-timeline-item
v-for="(activity, index) in activities"
:key="index"
color="#D9F3FF"
:timestamp="activity.timestamp">
<!-- {{activity.timestamp}} -->
</el-timeline-item>
</el-timeline>
</td>
<td v-for="(item,index) in tbodayData" class="body-td" :class="{'td-bg':index%2==0}" >
<div v-for="(_item,_index) in item.InfoList" class="absolute" :style="{'top':_item.offSetTop+'px','z-index':_index}">
<div class="td-item" v-if="_item.Type===0" @click="goCourseInfo(_item)" :style="{'height':_item.height}">
<img src="../../../assets/images/classroom/useing.png" alt="" class="ClassStatus" v-if="_item.ClassStatus===1">
<img src="../../../assets/images/classroom/not-use.png" alt="" class="ClassStatus" v-if="_item.ClassStatus!==1">
<span class="name">{{_item.Title}}</span>
<div class="time">{{_item.StartTime}}-{{_item.EndTime}}</div>
</div>
<div class="td-item" v-if="_item.Type===1" @click="taggleUserHistory(_item)" :style="{'height':_item.height}">
<span class="name">{{_item.Title}}</span>
<div class="time">{{_item.StartTime}}-{{_item.EndTime}}</div>
</div>
</div>
</td>
<td></td>
</tr>
</tbody>
</div>
</div>
<UserHistory ref="history" :classroomId="classroomUserId" ></UserHistory>
</div>
</template> </template>
<script> <script>
import lunarCalendar from "./js/lunarCalendar" import lunarCalendar from "./js/lunarCalendar"
import UserHistory from "./userHistory" import UserHistory from "./userHistory"
export default { import mateitem from "./mateitem.vue"
props:{ export default {
tbodayData:{ props: {
type:Array, tbodayData: {
type: [Array,Object],
},
startT:{
type:String,
default:''
}
},
components:{
UserHistory
},
watch:{
tbodayData:{
handler(val){
val.forEach(e=>{
e.InfoList.forEach(_e=>{
_e.height=_e.IntervalNum*41+'px'
let gap= this.getGap("09:30",_e.StartTime,15)
_e.offSetTop=gap*41
})
})
},
deep:true
},
startT:{
handler(val){
if(val){
this.msg.StartDate=val;
let startYear = this.msg.StartDate.split("-")[0];
let startMonth = this.msg.StartDate.split("-")[1];
var data = lunarCalendar.initLunar(
startYear,
startMonth,
this.dayNum,
val
);
this.CalendarDataArray = data;
this.QStartDate = data[0].CurrentDate;
this.QEndDate = data[data.length - 1].CurrentDate;
this.Calendar = this.CalendarDataArray.slice(0,7);
}
}
},
msg:{
handler(val){
if(val){
let t=Date.parse(val.StartDate)
let d= new Date(t)
let m=d.getMonth()+1
this.nowMonth=m
this.$emit("change",this.msg.StartDate);
}
},
deep:true
}
},
data() {
return {
msg: {
StartDate: new Date().Format("yyyy-MM-dd"),
EndDate: ""
}, },
loading: true, startT: {
dataList: "", type: String,
tempDataList: [], default: ''
Calendar: "", //绑定数据的日历 }
CalendarDataArray: [], //存放数据的日历
infoList: "",
dayList: "",
nowYear: "",
nowMonth: "",
QStartDate: "",
QEndDate: "",
dayNum: 7, //默认加载天数
columnLine: -1,
reverse: false,
activities: [{//时间线数据
timestamp: '09:30'
}, {
timestamp: '09:45'
}, {
timestamp: '10:00'
},{
timestamp: '10:15'
},{
timestamp: '10:30'
},{
timestamp: '10:45'
},{
timestamp: '11:00'
},{
timestamp: '11:15'
},{
timestamp: '11:30'
},{
timestamp: '11:45'
},{
timestamp: '12:00'
},{
timestamp: '12:15'
},{
timestamp: '12:30'
},{
timestamp: '12:45'
},{
timestamp: '13:00'
},{
timestamp: '13:15'
},{
timestamp: '13:30'
},{
timestamp: '13:45'
},{
timestamp: '14:00'
},{
timestamp: '14:15'
},{
timestamp: '14:30'
},{
timestamp: '14:45'
},{
timestamp: '15:00'
},{
timestamp: '15:15'
},{
timestamp: '15:30'
},{
timestamp: '15:45'
},{
timestamp: '16:00'
},{
timestamp: '16:15'
},{
timestamp: '16:30'
},{
timestamp: '16:45'
},{
timestamp: '17:00'
},{
timestamp: '17:15'
},{
timestamp: '17:30'
},{
timestamp: '17:45'
},{
timestamp: '18:00'
},{
timestamp: '18:15'
},{
timestamp: '18:30'
},{
timestamp: '18:45'
},{
timestamp: '19:00'
},{
timestamp: '19:15'
},{
timestamp: '19:30'
},{
timestamp: '19:45'
},{
timestamp: '20:00'
},{
timestamp: '20:15'
},{
timestamp: '20:45'
},{
timestamp: '21:00'
},{
timestamp: '21:15'
},{
timestamp: '21:30'
},],
classroomUserId:""
};
},
methods: {
taggleUserHistory(i){
this.classroomUserId=i.Id
this.$refs.history.changeShow()
},
goCourseInfo(i){
this.$router.push({
path:"/classroom/courseInfo",
query:{
id:i.Id
}
})
}, },
//初始化日历数据 components: {
initData() { UserHistory,
let startYear = this.msg.StartDate.split("-")[0]; mateitem
let startMonth = this.msg.StartDate.split("-")[1];
var data = lunarCalendar.initLunar(
startYear,
startMonth,
this.dayNum
);
this.CalendarDataArray = data;
this.QStartDate = data[0].CurrentDate;
this.QEndDate = data[data.length - 1].CurrentDate;
this.Calendar = this.CalendarDataArray.slice(0,7);
}, },
data() {
//左侧点击 return {
leftClick() { classroomUserId: ""
var tempStartDate = lunarCalendar.changeLunar(this.QStartDate, -1); };
this.CalendarDataArray.unshift(tempStartDate);
this.nowYear = tempStartDate.CurrentYear;
// this.nowMonth = tempStartDate.CurrentMonth;
this.CalendarDataArray.pop(); //删除最后一个元素
this.Calendar = this.CalendarDataArray.slice(0,7);
this.QStartDate = tempStartDate.CurrentDate;
this.QEndDate = this.CalendarDataArray[
this.CalendarDataArray.length - 1
].CurrentDate;
this.msg.StartDate = tempStartDate.CurrentDate;
this.msg.EndDate = this.CalendarDataArray[
this.CalendarDataArray.length - 1
].CurrentDate;
// this.getList();
}, },
//右侧点击事件
rightClick() {
var tempEndDate = lunarCalendar.changeLunar(this.QEndDate, 1);
this.CalendarDataArray.push(tempEndDate);
this.nowYear = tempEndDate.CurrentYear;
// this.nowMonth = tempEndDate.CurrentMonth;
this.CalendarDataArray.shift(); //删除第一个元素
this.Calendar = this.CalendarDataArray.slice(0,7);
this.QStartDate = this.CalendarDataArray[0].CurrentDate;
this.QEndDate = tempEndDate.CurrentDate;
this.msg.StartDate = this.CalendarDataArray[0].CurrentDate;
this.msg.EndDate = tempEndDate.CurrentDate;
// this.getList(); methods: {
}, taggleUserHistory(i) {
columnsMouseOver(obj) { this.classroomUserId = i.Id
this.columnLine = obj; this.$refs.history.changeShow()
}, },
getEndDay() {
var date1 = this.msg.StartDate;
var date2 = new Date(date1);
var c = date2.getDate();
var d = new Date(date2.setDate(c + 24));
this.msg.EndDate = d.Format("yyyy-MM-dd");
}, },
getDayInfo(Y, M, D) {
}, mounted() {
/**
* //计算间隔多少个分钟
* @param s 开始时间
* e 结束时间
* gap 间隔分钟
*/
getGap(s,e,gap){
let stimeArr=s.split(':')
let stime=parseInt(stimeArr[0])*60+parseInt(stimeArr[1])
let etimeArr=e.split(":")
let etime=parseInt(etimeArr[0])*60+parseInt(etimeArr[1])
let res=(etime-stime)/gap
return res
} }
}, };
</script>
<style>
.MainPlan .ClassPlanTable {
width: 100%;
color: #000;
}
.ClassPlanTable th,
.ClassPlanTable td {
border: 1px solid #d1d1d1;
height: 40px;
}
.MainPlan td {
vertical-align: top;
padding: 5px;
width: 14%;
}
.MainPlan {
margin: 20px;
}
.MainPlan .plan_ClassDate {
height: 30px;
line-height: 30px;
font-size: 15px;
font-weight: bold;
}
mounted() { .MainPlan .plantHead th {
this.initData(); border-bottom: 0;
this.getEndDay();
let nowDate = new Date().Format("yyyy-MM-dd");
this.nowYear = nowDate.split("-")[0];
this.nowMonth = parseInt(nowDate.split("-")[1]);
} }
};
</script> .MainPlan .planTabDiv {
\ No newline at end of file max-height: calc(100vh - 280px);
height: calc(100vh - 280px);
overflow-y: overlay;
/* margin-right: -3px; */
}
.planTabDiv::-webkit-scrollbar {
width: 3px;
height: 3px;
background-color: #F5F5F5;
}
/*!*定义滚动条轨道 内阴影+圆角*!*/
.planTabDiv::-webkit-scrollbar-track {
-webkit-box-shadow: inset 0 0 6px rgba(0, 0, 0, 0.3);
border-radius: 10px;
background-color: #F5F5F5;
}
/*!*定义滑块 内阴影+圆角*!*/
.planTabDiv::-webkit-scrollbar-thumb {
border-radius: 10px;
-webkit-box-shadow: -webkit-gradient(linear, 0 0, 0 100%, color-stop(.5, rgba(255, 255, 255, .2)), color-stop(.5, transparent), to(transparent));
background-color: #0ae;
}
.MainPlan .el-collapse-item__header {
font-size: 12px;
line-height: normal;
color: #000;
}
.MainPlan .plan_Inner {
font-size: 12px;
color: #000;
display: flex;
margin-top: 5px;
}
.MainPlan .plan_LeftTitle {
width: 60px;
text-align: right;
flex-shrink: 0
}
.MainPlan .plan_RightInner {
width: 100%;
}
.MainPlan .commonTimeStr {
display: inline-block;
color: #fff;
padding: 1px 3px;
border-radius: 5px;
}
.MainPlan .greenTime {
background-color: green;
}
.MainPlan .blueTime {
background-color: blue;
}
.MainPlan .orangeTime {
background-color: orange;
}
.MainPlan .plan_Tdiv {
text-overflow: ellipsis;
overflow: hidden;
word-break: break-all;
}
</style>
<template> <template>
<div class="page-body con"> <div class="page-body con">
<div class="left"> <div class="page-search row items-center">
<div class="col row wrap q-mr-lg q-col-gutter-md">
<div class="col-3">
<q-select @input="schoolChange" standout="bg-primary text-white" option-value="Key" option-label="SchoolName"
v-model="msg.SchoolId" :options="schoolopt" emit-value map-options label="关联校区" />
</div>
<div class="col-3">
<q-select @input="getClassRoomTimeList" standout="bg-primary text-white" option-value="RoomId"
option-label="RoomName" v-model="msg.ClassRoomId" :options="classroomopt" emit-value map-options
label="关联教室" @filter="filterFn">
<template v-slot:no-option>
<q-item>
<q-item-section class="text-grey">
未找到相关数据
</q-item-section>
</q-item>
</template>
</q-select>
</div>
<div class="col-3 Sysuser_Date">
<q-field filled>
 <template v-slot:control>
<el-date-picker v-model="msg.StartTime" type="date" placeholder="开始日期" value-format="yyyy-MM-dd"
@change="changedate">
</el-date-picker>    
</template>
</q-field>
</div>
</div>
</div>
<!-- <div class="left">
<div class="dateModel col-5 q-mb-sm cursor-pointer shadow-1"> <div class="dateModel col-5 q-mb-sm cursor-pointer shadow-1">
<!-- <div class="q-mb-sm">开始日期:{{dateModel}}</div>
<q-btn label="重新选择" color="primary" size="sm" >
<q-popup-proxy transition-show="scale" transition-hide="scale">
<q-date now-btn v-model="dateModel" minimal mask="YYYY-MM-DD" @input="dateChoose">
<div class="row items-center justify-end">
<q-btn v-close-popup label="关闭" color="primary q-px-md" flat />
</div>
</q-date>
</q-popup-proxy>
</q-btn> -->
<el-date-picker <el-date-picker
v-model="dateModel" v-model="dateModel"
type="date" type="date"
...@@ -22,204 +41,235 @@ ...@@ -22,204 +41,235 @@
</div> </div>
<ClassroomNav :NavData="navData" :activeNav="msg.RoomId" :activeFaNav="msg.SchoolId" @success="successNav"/> <ClassroomNav :NavData="navData" :activeNav="msg.RoomId" :activeFaNav="msg.SchoolId" @success="successNav"/>
</div> </div> -->
<div class="right"> <div class="right">
<Calendar :tbodayData="tbodayData" :startT="dateModel" @change="CalendarChange"></Calendar> <Calendar :tbodayData="tbodayData"></Calendar>
</div> </div>
</div> </div>
</template> </template>
<script> <script>
import ClassroomNav from "./components/classroomNav"; import ClassroomNav from "./components/classroomNav";
import Calendar from './components/scenicSummary.vue' import Calendar from './components/scenicSummary.vue'
import { import {
getSchoolAndRoomNav, getSchoolAndRoomNav,
getClassRoomTimeList getClassRoomTimeList
} from '../../api/classroom/index'; } from '../../api/classroom/index';
export default { export default {
meta: { meta: {
title: "使用记录" title: "使用记录"
}, },
components:{ components: {
ClassroomNav, ClassroomNav,
Calendar, Calendar,
}, },
data() { data() {
return { return {
dateModel1:"", dateModel: "",
dateModel:"",
loading: true, loading: true,
schoolId:0, schoolId: 0,
navData:[], navData: [],
msg:{ msg: {
RoomId:0, ClassRoomId: 0,
SchoolId:0, SchoolId: 0,
StartTime:"2020-07-08", StartTime: "",
EndTime:"" EndTime: ""
}, },
tbodayData:[] tbodayData: [],
schoolopt: [],
classroomopt: [],
}; };
}, },
created(){ created() {
if(this.$route.query.key){
this.msg.SchoolId=this.$route.query.key if (this.$route.query.key) {
this.msg.SchoolId = this.$route.query.key
} }
if(this.$route.query.roomId){ if (this.$route.query.roomId) {
this.msg.RoomId=this.$route.query.roomId this.msg.ClassRoomId = this.$route.query.roomId
} }
let d=new Date(); let d = new Date();
let year =d.getFullYear(); let year = d.getFullYear();
let month=d.getMonth()+1; let month = d.getMonth() + 1;
month=month<10?'0'+month:month; month = month < 10 ? '0' + month : month;
let day=d.getDate(); let day = d.getDate();
day=day<10?'0'+day:day; day = day < 10 ? '0' + day : day;
let today=year+'-'+month+'-'+day; let today = year + '-' + month + '-' + day;
this.msg.StartTime=today; this.msg.StartTime = today;
this.dateModel=today; this.dateModel = today;
let endDate = new Date(d.getTime() + 6 * 24 * 60 * 60 * 1000); this.getEndTime(today)
let endYear = endDate.getFullYear(); this.getNavList();
let enDMonth = endDate.getMonth() + 1
if (enDMonth < 10) {
enDMonth = '0' + enDMonth
}
let endDay = endDate.getDate()
if (endDay < 10) {
endDay = '0' + endDay
}
let end = endYear + '-' + enDMonth + '-' + endDay
this.msg.EndTime = end;
}, },
mounted(){ methods: {
//筛选教室
this.getNavList(); filterFn(val, update) {
// this.getClassRoomTimeList(); update(() => {
}, if (val === '') {
methods:{ this.classroomopt = JSON.parse(JSON.stringify(this.classroomopt))
} else {
const needle = val.toLowerCase();
this.classroomopt = this.classroomopt.filter(v => v.RoomName.toLowerCase().indexOf(needle) > -1);
}
})
},
// 获取校区教室导航列表 // 获取校区教室导航列表
getNavList() { getNavList() {
let that=this getSchoolAndRoomNav({}).then(res => {
getSchoolAndRoomNav({}).then(res => { if (res.Code === 1) {
if(res.Code===1){ this.navData = res.Data
this.navData=res.Data this.schoolopt = res.Data
if(!this.$route.query.key){ this.schoolChange2(this.msg.SchoolId)
this.msg.SchoolId=this.navData[0].Key }
} }).catch(() => {
if(!this.$route.query.roomId){
this.msg.RoomId=this.navData[0].RoomList[0].RoomId })
} },
that.getClassRoomTimeList() schoolChange(val) {
} let res = this.schoolopt.filter(item => {
}).catch(() => { return item.Key == val
})
}) if (res.length > 0) {
}, let obj = {
//获取教室使用记录 RoomName: "不限",
getClassRoomTimeList() { RoomId: 0
getClassRoomTimeList(this.msg).then(res => { }
this.loading = false this.classroomopt = [obj, ...res[0].RoomList]
if(res.Code===1){ }
this.tbodayData=res.Data this.msg.ClassRoomId=0
} this.getClassRoomTimeList()
}).catch(() => {
this.loading = false; },
}) schoolChange2(val) {
}, let res = this.schoolopt.filter(item => {
//选择校区教室导航 return item.Key == val
successNav(val){ })
if (res.length > 0) {
this.msg.RoomId=val.RoomId let obj = {
this.msg.SchoolId=val.schoolId RoomName: "不限",
this.getClassRoomTimeList(); RoomId: 0
this.$forceUpdate() }
}, this.classroomopt = [obj, ...res[0].RoomList]
dateChoose(value, reason, details){ }
this.getClassRoomTimeList()
},
//获取结束日期 },
getEndTime(date){ //获取教室使用记录
let d=Date.parse(date) getClassRoomTimeList() {
let endDate = new Date(d + 6 * 24 * 60 * 60 * 1000); getClassRoomTimeList(this.msg).then(res => {
let endYear = endDate.getFullYear(); this.loading = false
let enDMonth = endDate.getMonth() + 1 if (res.Code === 1) {
if (enDMonth < 10) { this.tbodayData = res.Data
enDMonth = '0' + enDMonth
}
let endDay = endDate.getDate()
if (endDay < 10) {
endDay = '0' + endDay
}
let end = endYear + '-' + enDMonth + '-' + endDay
this.msg.EndTime = end;
},
//切换日历
CalendarChange(val){
let arr=val.split('-');
if(arr[1].length==1){
let month=parseInt(arr[1])
if(month<10){
arr[1]='0'+arr[1]
}
} }
let newVal= arr.join("-") }).catch(() => {
this.dateModel=newVal this.loading = false;
this.msg.StartTime=newVal })
this.getEndTime(newVal) },
this.getClassRoomTimeList(); //选择校区教室导航
this.$forceUpdate() successNav(val) {
this.msg.ClassRoomId = val.RoomId
this.msg.SchoolId = val.schoolId
this.getClassRoomTimeList();
this.$forceUpdate()
},
dateChoose(value, reason, details) {
},
//获取结束日期
getEndTime(date) {
let d = Date.parse(date)
let endDate = new Date(d + 29 * 24 * 60 * 60 * 1000);
let endYear = endDate.getFullYear();
let enDMonth = endDate.getMonth() + 1
if (enDMonth < 10) {
enDMonth = '0' + enDMonth
}
let endDay = endDate.getDate()
if (endDay < 10) {
endDay = '0' + endDay
}
let end = endYear + '-' + enDMonth + '-' + endDay
this.msg.EndTime = end;
},
changedate(val) {
if(!val){
val=this.dateModel
} }
this.getEndTime(val)
this.getClassRoomTimeList()
}
} }
}; };
</script> </script>
<style lang="scss" scoped> <style lang="scss">
.con{ .con {
padding: 5px !important; padding: 5px !important;
display: flex; // display: flex;
height: calc( 100vh - 80px); height: calc(100vh - 80px);
.left{ .left {
width: 170px; width: 170px;
background-color: rgb(245, 246, 247); background-color: rgb(245, 246, 247);
min-height: 100%; min-height: 100%;
} }
.right{
box-sizing: border-box; .right {
width: calc(100% + 10px); box-sizing: border-box;
padding-right: 10px; // width: calc(100% + 10px);
height: calc(100vh - 100px); width: 100%;
padding-right: 10px;
height: calc(100vh - 180px);
// height: 900px; // height: 900px;
overflow-x: scroll; // overflow-x: scroll;
overflow-y: hidden; overflow-y: hidden;
} }
} }
.right::-webkit-scrollbar{
width:10px; .right::-webkit-scrollbar {
height:10px; width: 10px;
/**/ height: 10px;
} /**/
.right::-webkit-scrollbar-track{ }
background: rgb(239, 239, 239);
border-radius:2px; .right::-webkit-scrollbar-track {
} background: rgb(239, 239, 239);
.right::-webkit-scrollbar-thumb{ border-radius: 2px;
background: #bfbfbf; }
border-radius:10px;
} .right::-webkit-scrollbar-thumb {
.right::-webkit-scrollbar-thumb:hover{ background: #bfbfbf;
background: #333; border-radius: 10px;
} }
// .right::-webkit-scrollbar-corner{
// background: #179a16; .right::-webkit-scrollbar-thumb:hover {
// } background: #333;
}
.dateModel{
// height: 50px; // .right::-webkit-scrollbar-corner{
padding: 20px 10px; // background: #179a16;
display: flex; // }
flex-wrap: wrap;
justify-content: center; .dateModel {
align-content: space-around; // height: 50px;
} padding: 20px 10px;
display: flex;
flex-wrap: wrap;
justify-content: center;
align-content: space-around;
}
.Sysuser_Date .el-input {
width: 100%;
border: none;
background-color: transparent;
}
.Sysuser_Date .el-input__inner {
width: 100%;
border: none;
background-color: transparent;
}
</style> </style>
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