Skip to content
Projects
Groups
Snippets
Help
Loading...
Help
Submit feedback
Contribute to GitLab
Sign in
Toggle navigation
C
confucius
Project
Project
Details
Activity
Releases
Cycle Analytics
Repository
Repository
Files
Commits
Branches
Tags
Contributors
Graph
Compare
Charts
Issues
0
Issues
0
List
Board
Labels
Milestones
Merge Requests
0
Merge Requests
0
CI / CD
CI / CD
Pipelines
Jobs
Schedules
Charts
Wiki
Wiki
Snippets
Snippets
Members
Members
Collapse sidebar
Close sidebar
Activity
Graph
Charts
Create a new issue
Jobs
Commits
Issue Boards
Open sidebar
罗超
confucius
Commits
70001048
Commit
70001048
authored
Jul 07, 2021
by
罗超
Browse files
Options
Browse Files
Download
Email Patches
Plain Diff
1
parent
f97efb7c
Show whitespace changes
Inline
Side-by-side
Showing
4 changed files
with
446 additions
and
650 deletions
+446
-650
index.js
src/api/classroom/index.js
+1
-1
activityList.vue
src/pages/activity/activityList.vue
+9
-6
scenicSummary.vue
src/pages/classroom/components/scenicSummary.vue
+199
-456
useRecord.vue
src/pages/classroom/useRecord.vue
+237
-187
No files found.
src/api/classroom/index.js
View file @
70001048
...
@@ -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/Get
New
ClassRoomTimeList'
,
method
:
'post'
,
method
:
'post'
,
data
data
})
})
...
...
src/pages/activity/activityList.vue
View file @
70001048
...
@@ -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"
},
},
{
{
...
...
src/pages/classroom/components/scenicSummary.vue
View file @
70001048
<
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>
<col
style=
"width: 80px;"
/>
<col
/>
</colgroup>
<thead>
<tr><th>
序号
</th><th>
内容
</th></tr>
</thead>
</table>
-->
<table
class=
"summaryTable"
cellspacing=
"0"
>
<colgroup>
<col
width=
'105px'
/>
<col
width=
'10px'
/>
<col
width=
'215px'
/>
<col
width=
'215px'
/>
<col
width=
'215px'
/>
<col
width=
'215px'
/>
<col
width=
'215px'
/>
<col
width=
'215px'
/>
<col
width=
'215px'
/>
<col
width=
'10px'
/>
</colgroup>
<thead>
<thead>
<th
class=
""
>
<tr>
<div
class=
"leftDay"
>
<th
colspan=
"16"
>
教室使用记录
</th>
<div
class=
"leftDayTop"
>
</tr>
<!--
<span
class=
"yearCircle"
></span>
-->
<tr>
{{
nowYear
}}
年
<th>
周一
</th>
<!--
<span
class=
"yearCircle"
></span>
-->
<th>
周二
</th>
<!--
<div
class=
"rili LI1"
></div>
<th>
周三
</th>
<div
class=
"rili LI2"
></div>
-->
<th>
周四
</th>
</div>
<th>
周五
</th>
<span
class=
"monthNum"
>
{{
nowMonth
}}
</span>
<th>
周六
</th>
<!--
<span
class=
"monthLis"
>
{{
$t
(
'pub.month'
)
}}
</span>
-->
<th>
周日
</th>
</div>
</tr>
</th>
<th
style=
"width:10px"
>
<div
class=
"Arrow"
@
click=
"leftClick()"
>
<i
class=
"iconfont icon-previewleft"
></i>
</div>
</th>
<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)">
<div
slot=
"reference"
>
<div
class=
"_week"
>
{{
k
.
Week
}}
</div>
<div
class=
"_monthDay"
v-if=
"k.CurrentDay==1"
>
<span>
{{
k
.
CurrentMonthCn
}}
<br/>
{{
$t
(
'pub.month'
)
}}
</span>
</div>
<div
class=
"_day"
v-else
>
{{
k
.
CurrentDay
}}
</div>
<!--
<div
class=
"_longli"
>
{{
k
.
LunarDayCn
}}
</div>
-->
</div>
<div
class=
"_lineSummary"
v-if=
"index==columnLine&&dataList!=''"
></div>
</th>
<th
style=
"width:10px"
>
<div
class=
"Arrow"
@
click=
"rightClick()"
>
<i
class=
"iconfont icon-arrow-right"
></i>
</div>
</th>
</thead>
</thead>
</table>
</table>
<div
class=
"tbody"
style=
"width:1680px"
>
<div
class=
"planTabDiv"
ref=
"planTabDiv"
>
<colgroup>
<table
class=
"ClassPlanTable"
ref=
"PlanTable"
style=
"border-collapse:collapse;margin-top:0;"
>
<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>
<tbody>
<tr>
<tr
v-for=
"(item,index) in tbodayData.fridayList"
:key=
"index"
>
<td
style=
"width:50px;text-align:center;padding-top:8px; width:140px"
>
<td>
<el-timeline
:reverse=
"reverse"
>
<div
class=
"plan_ClassDate"
>
{{
tbodayData
.
mondayList
[
index
].
ClassDate
}}
</div>
<el-timeline-item
<mateitem
@
unusual=
"taggleUserHistory"
v-if=
"tbodayData.mondayList&&tbodayData.mondayList[index].SubList"
v-for=
"(activity, index) in activities"
:dayData=
"tbodayData.mondayList[index]"
></mateitem>
:key=
"index"
color=
"#D9F3FF"
:timestamp=
"activity.timestamp"
>
<!--
{{
activity
.
timestamp
}}
-->
</el-timeline-item>
</el-timeline>
</td>
</td>
<td
v-for=
"(item,index) in tbodayData"
class=
"body-td"
:class=
"
{'td-bg':index%2==0}" >
<td>
<div
v-for=
"(_item,_index) in item.InfoList"
class=
"absolute"
:style=
"
{'top':_item.offSetTop+'px','z-index':_index}">
<div
class=
"plan_ClassDate"
>
{{
tbodayData
.
tuesdayList
[
index
].
ClassDate
}}
</div>
<div
class=
"td-item"
v-if=
"_item.Type===0"
@
click=
"goCourseInfo(_item)"
:style=
"
{'height':_item.height}">
<mateitem
@
unusual=
"taggleUserHistory"
v-if=
"tbodayData.tuesdayList&&tbodayData.tuesdayList[index].SubList"
<img
src=
"../../../assets/images/classroom/useing.png"
alt=
""
class=
"ClassStatus"
v-if=
"_item.ClassStatus===1"
>
:dayData=
"tbodayData.tuesdayList[index]"
></mateitem>
<img
src=
"../../../assets/images/classroom/not-use.png"
alt=
""
class=
"ClassStatus"
v-if=
"_item.ClassStatus!==1"
>
</td>
<span
class=
"name"
>
{{
_item
.
Title
}}
</span>
<td>
<div
class=
"time"
>
{{
_item
.
StartTime
}}
-
{{
_item
.
EndTime
}}
</div>
<div
class=
"plan_ClassDate"
>
{{
tbodayData
.
wednesdayList
[
index
].
ClassDate
}}
</div>
</div>
<mateitem
@
unusual=
"taggleUserHistory"
v-if=
"tbodayData.wednesdayList&&tbodayData.wednesdayList[index].SubList"
<div
class=
"td-item"
v-if=
"_item.Type===1"
@
click=
"taggleUserHistory(_item)"
:style=
"
{'height':_item.height}">
:dayData=
"tbodayData.wednesdayList[index]"
></mateitem>
<span
class=
"name"
>
{{
_item
.
Title
}}
</span>
</td>
<div
class=
"time"
>
{{
_item
.
StartTime
}}
-
{{
_item
.
EndTime
}}
</div>
<td>
</div>
<div
class=
"plan_ClassDate"
>
{{
tbodayData
.
thursdayList
[
index
].
ClassDate
}}
</div>
</div>
<mateitem
@
unusual=
"taggleUserHistory"
v-if=
"tbodayData.thursdayList&&tbodayData.thursdayList[index].SubList"
:dayData=
"tbodayData.thursdayList[index]"
></mateitem>
</td>
<td>
<div
class=
"plan_ClassDate"
>
{{
tbodayData
.
fridayList
[
index
].
ClassDate
}}
</div>
<mateitem
@
unusual=
"taggleUserHistory"
v-if=
"tbodayData.fridayList&&tbodayData.fridayList[index].SubList"
:dayData=
"tbodayData.fridayList[index]"
></mateitem>
</td>
<td>
<div
class=
"plan_ClassDate"
>
{{
tbodayData
.
saturdayList
[
index
].
ClassDate
}}
</div>
<mateitem
@
unusual=
"taggleUserHistory"
v-if=
"tbodayData.saturdayList&&tbodayData.saturdayList[index].SubList"
:dayData=
"tbodayData.saturdayList[index]"
></mateitem>
</td>
<td>
<div
class=
"plan_ClassDate"
>
{{
tbodayData
.
sundayList
[
index
].
ClassDate
}}
</div>
<mateitem
@
unusual=
"taggleUserHistory"
v-if=
"tbodayData.sundayList&&tbodayData.sundayList[index].SubList"
:dayData=
"tbodayData.sundayList[index]"
></mateitem>
</td>
</td>
<td></td>
</tr>
</tr>
</tbody>
</tbody>
</table>
</div>
</div>
</div>
</div>
<UserHistory
ref=
"history"
:classroomId=
"classroomUserId"
></UserHistory>
<UserHistory
ref=
"history"
:classroomId=
"classroomUserId"
></UserHistory>
</div>
</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
:{
startT
:
{
handler
(
val
){
type
:
String
,
if
(
val
){
default
:
''
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
components
:
{
}
UserHistory
,
mateitem
},
},
data
()
{
data
()
{
return
{
return
{
msg
:
{
classroomUserId
:
""
StartDate
:
new
Date
().
Format
(
"yyyy-MM-dd"
),
EndDate
:
""
},
loading
:
true
,
dataList
:
""
,
tempDataList
:
[],
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
:
{
methods
:
{
taggleUserHistory
(
i
)
{
taggleUserHistory
(
i
)
{
this
.
classroomUserId
=
i
.
Id
this
.
classroomUserId
=
i
.
Id
this
.
$refs
.
history
.
changeShow
()
this
.
$refs
.
history
.
changeShow
()
},
},
goCourseInfo
(
i
){
this
.
$router
.
push
({
path
:
"/classroom/courseInfo"
,
query
:{
id
:
i
.
Id
}
})
},
//初始化日历数据
initData
()
{
let
startYear
=
this
.
msg
.
StartDate
.
split
(
"-"
)[
0
];
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
);
},
},
//左侧点击
mounted
()
{
leftClick
()
{
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();
}
},
};
columnsMouseOver
(
obj
)
{
this
.
columnLine
=
obj
;
},
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
)
{
},
</
script
>
/**
<
style
>
* //计算间隔多少个分钟
.MainPlan
.ClassPlanTable
{
* @param s 开始时间
width
:
100%
;
* e 结束时间
color
:
#000
;
* 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
}
}
},
mounted
()
{
.ClassPlanTable
th
,
this
.
initData
();
.ClassPlanTable
td
{
this
.
getEndDay
();
border
:
1px
solid
#d1d1d1
;
let
nowDate
=
new
Date
().
Format
(
"yyyy-MM-dd"
);
height
:
40px
;
this
.
nowYear
=
nowDate
.
split
(
"-"
)[
0
];
this
.
nowMonth
=
parseInt
(
nowDate
.
split
(
"-"
)[
1
]);
}
}
};
</
script
>
.MainPlan
td
{
\ No newline at end of file
vertical-align
:
top
;
padding
:
5px
;
width
:
14%
;
}
.MainPlan
{
margin
:
20px
;
}
.MainPlan
.plan_ClassDate
{
height
:
30px
;
line-height
:
30px
;
font-size
:
15px
;
font-weight
:
bold
;
}
.MainPlan
.plantHead
th
{
border-bottom
:
0
;
}
.MainPlan
.planTabDiv
{
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
>
src/pages/classroom/useRecord.vue
View file @
70001048
<
template
>
<
template
>
<div
class=
"page-body con"
>
<div
class=
"page-body con"
>
<div
class=
"left"
>
<div
class=
"page-search row items-center"
>
<div
class=
"dateModel col-5 q-mb-sm cursor-pointer shadow-1"
>
<div
class=
"col row wrap q-mr-lg q-col-gutter-md"
>
<!--
<div
class=
"q-mb-sm"
>
开始日期:
{{
dateModel
}}
</div>
<div
class=
"col-3"
>
<q-btn
label=
"重新选择"
color=
"primary"
size=
"sm"
>
<q-select
@
input=
"schoolChange"
standout=
"bg-primary text-white"
option-value=
"Key"
option-label=
"SchoolName"
<q-popup-proxy
transition-show=
"scale"
transition-hide=
"scale"
>
v-model=
"msg.SchoolId"
:options=
"schoolopt"
emit-value
map-options
label=
"关联校区"
/>
<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>
</div>
</q-date>
<div
class=
"col-3"
>
<q-select
@
input=
"getClassRoomTimeList"
standout=
"bg-primary text-white"
option-value=
"RoomId"
</q-popup-proxy>
option-label=
"RoomName"
v-model=
"msg.ClassRoomId"
:options=
"classroomopt"
emit-value
map-options
</q-btn>
-->
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">
<el-date-picker
<el-date-picker
v-model="dateModel"
v-model="dateModel"
type="date"
type="date"
...
@@ -22,9 +41,9 @@
...
@@ -22,9 +41,9 @@
</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>
...
@@ -40,107 +59,127 @@
...
@@ -40,107 +59,127 @@
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
.
roomId
){
this
.
msg
.
RoomId
=
this
.
$route
.
query
.
roomId
}
let
d
=
new
Date
();
let
year
=
d
.
getFullYear
();
let
month
=
d
.
getMonth
()
+
1
;
month
=
month
<
10
?
'0'
+
month
:
month
;
let
day
=
d
.
getDate
();
day
=
day
<
10
?
'0'
+
day
:
day
;
let
today
=
year
+
'-'
+
month
+
'-'
+
day
;
this
.
msg
.
StartTime
=
today
;
this
.
dateModel
=
today
;
let
endDate
=
new
Date
(
d
.
getTime
()
+
6
*
24
*
60
*
60
*
1000
);
let
endYear
=
endDate
.
getFullYear
();
let
enDMonth
=
endDate
.
getMonth
()
+
1
if
(
enDMonth
<
10
)
{
if
(
this
.
$route
.
query
.
key
)
{
enDMonth
=
'0'
+
enDMonth
this
.
msg
.
SchoolId
=
this
.
$route
.
query
.
key
}
}
let
endDay
=
endDate
.
getDate
()
if
(
this
.
$route
.
query
.
roomId
)
{
if
(
endDay
<
10
)
{
this
.
msg
.
ClassRoomId
=
this
.
$route
.
query
.
roomId
endDay
=
'0'
+
endDay
}
}
let
end
=
endYear
+
'-'
+
enDMonth
+
'-'
+
endDay
let
d
=
new
Date
();
this
.
msg
.
EndTime
=
end
;
let
year
=
d
.
getFullYear
();
let
month
=
d
.
getMonth
()
+
1
;
month
=
month
<
10
?
'0'
+
month
:
month
;
let
day
=
d
.
getDate
();
day
=
day
<
10
?
'0'
+
day
:
day
;
let
today
=
year
+
'-'
+
month
+
'-'
+
day
;
this
.
msg
.
StartTime
=
today
;
this
.
dateModel
=
today
;
this
.
getEndTime
(
today
)
this
.
getNavList
();
},
},
mounted
(){
methods
:
{
//筛选教室
filterFn
(
val
,
update
)
{
update
(()
=>
{
if
(
val
===
''
)
{
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
);
this
.
getNavList
();
}
// this.getClassRoomTimeList();
})
},
},
methods
:{
// 获取校区教室导航列表
// 获取校区教室导航列表
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
if
(
!
this
.
$route
.
query
.
key
){
this
.
schoolopt
=
res
.
Data
this
.
msg
.
SchoolId
=
this
.
navData
[
0
].
Key
this
.
schoolChange2
(
this
.
msg
.
SchoolId
)
}
}
if
(
!
this
.
$route
.
query
.
roomId
){
}).
catch
(()
=>
{
this
.
msg
.
RoomId
=
this
.
navData
[
0
].
RoomList
[
0
].
RoomId
})
},
schoolChange
(
val
)
{
let
res
=
this
.
schoolopt
.
filter
(
item
=>
{
return
item
.
Key
==
val
})
if
(
res
.
length
>
0
)
{
let
obj
=
{
RoomName
:
"不限"
,
RoomId
:
0
}
}
that
.
getClassRoomTimeList
()
this
.
classroomopt
=
[
obj
,
...
res
[
0
].
RoomList
]
}
}
}).
catch
(()
=>
{
this
.
msg
.
ClassRoomId
=
0
this
.
getClassRoomTimeList
()
},
schoolChange2
(
val
)
{
let
res
=
this
.
schoolopt
.
filter
(
item
=>
{
return
item
.
Key
==
val
})
})
if
(
res
.
length
>
0
)
{
let
obj
=
{
RoomName
:
"不限"
,
RoomId
:
0
}
this
.
classroomopt
=
[
obj
,
...
res
[
0
].
RoomList
]
}
this
.
getClassRoomTimeList
()
},
},
//获取教室使用记录
//获取教室使用记录
getClassRoomTimeList
()
{
getClassRoomTimeList
()
{
getClassRoomTimeList
(
this
.
msg
).
then
(
res
=>
{
getClassRoomTimeList
(
this
.
msg
).
then
(
res
=>
{
this
.
loading
=
false
this
.
loading
=
false
if
(
res
.
Code
===
1
)
{
if
(
res
.
Code
===
1
)
{
this
.
tbodayData
=
res
.
Data
this
.
tbodayData
=
res
.
Data
}
}
}).
catch
(()
=>
{
}).
catch
(()
=>
{
this
.
loading
=
false
;
this
.
loading
=
false
;
})
})
},
},
//选择校区教室导航
//选择校区教室导航
successNav
(
val
){
successNav
(
val
)
{
this
.
msg
.
ClassRoomId
=
val
.
RoomId
this
.
msg
.
RoomId
=
val
.
RoomId
this
.
msg
.
SchoolId
=
val
.
schoolId
this
.
msg
.
SchoolId
=
val
.
schoolId
this
.
getClassRoomTimeList
();
this
.
getClassRoomTimeList
();
this
.
$forceUpdate
()
this
.
$forceUpdate
()
},
},
dateChoose
(
value
,
reason
,
details
)
{
dateChoose
(
value
,
reason
,
details
)
{
},
},
//获取结束日期
//获取结束日期
getEndTime
(
date
)
{
getEndTime
(
date
)
{
let
d
=
Date
.
parse
(
date
)
let
d
=
Date
.
parse
(
date
)
let
endDate
=
new
Date
(
d
+
6
*
24
*
60
*
60
*
1000
);
let
endDate
=
new
Date
(
d
+
29
*
24
*
60
*
60
*
1000
);
let
endYear
=
endDate
.
getFullYear
();
let
endYear
=
endDate
.
getFullYear
();
let
enDMonth
=
endDate
.
getMonth
()
+
1
let
enDMonth
=
endDate
.
getMonth
()
+
1
if
(
enDMonth
<
10
)
{
if
(
enDMonth
<
10
)
{
...
@@ -153,73 +192,84 @@
...
@@ -153,73 +192,84 @@
let
end
=
endYear
+
'-'
+
enDMonth
+
'-'
+
endDay
let
end
=
endYear
+
'-'
+
enDMonth
+
'-'
+
endDay
this
.
msg
.
EndTime
=
end
;
this
.
msg
.
EndTime
=
end
;
},
},
//切换日历
changedate
(
val
)
{
CalendarChange
(
val
){
if
(
!
val
){
let
arr
=
val
.
split
(
'-'
);
val
=
this
.
dateModel
if
(
arr
[
1
].
length
==
1
){
}
let
month
=
parseInt
(
arr
[
1
])
this
.
getEndTime
(
val
)
if
(
month
<
10
){
this
.
getClassRoomTimeList
()
arr
[
1
]
=
'0'
+
arr
[
1
]
}
}
let
newVal
=
arr
.
join
(
"-"
)
this
.
dateModel
=
newVal
this
.
msg
.
StartTime
=
newVal
this
.
getEndTime
(
newVal
)
this
.
getClassRoomTimeList
();
this
.
$forceUpdate
()
}
}
}
}
};
};
</
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
{
.right
{
box-sizing
:
border-box
;
box-sizing
:
border-box
;
width
:
calc
(
100%
+
10px
);
// width: calc(100% + 10px);
width
:
100%
;
padding-right
:
10px
;
padding-right
:
10px
;
height
:
calc
(
100vh
-
10
0px
);
height
:
calc
(
100vh
-
18
0px
);
// 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
{
.
right
:
:-
webkit-scrollbar-track
{
background
:
rgb
(
239
,
239
,
239
);
background
:
rgb
(
239
,
239
,
239
);
border-radius
:
2px
;
border-radius
:
2px
;
}
}
.
right
:
:-
webkit-scrollbar-thumb
{
.
right
:
:-
webkit-scrollbar-thumb
{
background
:
#bfbfbf
;
background
:
#bfbfbf
;
border-radius
:
10px
;
border-radius
:
10px
;
}
}
.
right
:
:-
webkit-scrollbar-thumb
:
hover
{
.
right
:
:-
webkit-scrollbar-thumb
:
hover
{
background
:
#333
;
background
:
#333
;
}
}
// .right::-webkit-scrollbar-corner{
// background: #179a16;
// .right::-webkit-scrollbar-corner{
// }
// background: #179a16;
// }
.dateModel
{
.dateModel
{
// height: 50px;
// height: 50px;
padding
:
20px
10px
;
padding
:
20px
10px
;
display
:
flex
;
display
:
flex
;
flex-wrap
:
wrap
;
flex-wrap
:
wrap
;
justify-content
:
center
;
justify-content
:
center
;
align-content
:
space-around
;
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
>
Write
Preview
Markdown
is supported
0%
Try again
or
attach a new file
Attach a file
Cancel
You are about to add
0
people
to the discussion. Proceed with caution.
Finish editing this message first!
Cancel
Please
register
or
sign in
to comment