Skip to content

X
xzf_uniapp-wechat-web
Commit 2475955f authored by aifen@azjy1.onexmail.com's avatar aifen@azjy1.onexmail.com
Browse files
Options

校园报告—门禁报告2

parent be4007a0
Hide whitespace changes
Inline Side-by-side
Showing with 287 additions and 37 deletions
src/pages/SchoolReport/SchoolReport.vue
View file @ 2475955f
......@@ -332,13 +332,70 @@
</view>
<!-- 门禁报告 -->
<view v-if="tabIndex==2" class="attendance-report-context-card-two">
<view class="school-report-context-card-title">
<view class="school-report-context-card-title-img">
<text>出勤情况</text>
</view>
</view>
<view class="attendance-report-context-card-two-conclusion">
<view class="attendance-report-context-card-two-conclusion-txt">
<text>本{{['月','周'][reportTypeIndex]}}共<text class="abnormal-days">4</text>天出勤异常</text>
</view>
<view class="attendance-report-context-card-two-conclusion-logo">
<view class="attendance-report-context-card-two-conclusion-logo-item">
<view class="attendance-report-context-card-two-conclusion-logo-item-dot leave">
</view>
<view class="attendance-report-context-card-two-conclusion-logo-item-txt">
<text>请假</text>
</view>
</view>
<view class="attendance-report-context-card-two-conclusion-logo-item">
<view class="attendance-report-context-card-two-conclusion-logo-item-dot">
</view>
<view class="attendance-report-context-card-two-conclusion-logo-item-txt">
<text>异常</text>
</view>
</view>
</view>
</view>
<view class="attendance-report-context-card-two-calendar">
<van-calendar :formatter="formatter" :min-date="minDate" :max-date="maxDate"
:default-date="minDate" :row-height="44" :show-title="false" :show-subtitle="false"
:show-mark="false" :poppable="false" :show-confirm="false" :style="{ height: '575rpx' }"
@select="attendanceDateSelect">
<template #top-info="item">
<span v-if="item.topInfo=='请假'" class="mark-green">请假</span>
<span v-if="item.topInfo=='迟到'" class="mark-orange">迟到</span>
<span v-if="item.topInfo=='旷课'" class="mark-orange">旷课</span>
<span v-if="item.topInfo=='早退'" class="mark-orange">早退</span>
</template>
</van-calendar>
</view>
</view>
<!-- 公话报告 -->
<view class="school-report-context-card-title">
<view class="school-report-context-card-title-img">
<text>出勤情况</text>
<view class="attendance-report-context-card-two-details">
<view class="attendance-report-context-card-two-details-item">
<view class="attendance-report-context-card-two-details-time">
<view class="attendance-report-context-card-two-details-time-img">
</view>
<view class="attendance-report-context-card-two-details-time-txt txt-details">
<text>考勤时间</text>
</view>
<view class="attendance-report-context-card-two-details-time-txt">
<text>08:00-22:00</text>
</view>
</view>
<view class="attendance-report-context-card-two-details-date">
<text>{{diningSituations.diningSituationsDate}}</text>
</view>
</view>
</view>
<view class="attendance-report-context-card-three">
<view class="dashed-line">
</view>
</view>
<!-- 公话报告 -->
<view class="">
</view>
<view v-if="isOpen" class="school-report-footer">
<view class="school-report-footer-item">
......@@ -376,7 +433,8 @@
<view class="summary-item">
<text>{{['月度消费报告','实时推送','音视频通话'][tabIndex-1]}}</text>
</view>
<view class="summary-item-icon" :class="['consumer-report-icon','attendance-report-icon','pubTalk-report-icon'][tabIndex-1]">
<view class="summary-item-icon"
:class="['consumer-report-icon','attendance-report-icon','pubTalk-report-icon'][tabIndex-1]">
<text>+</text>
</view>
<view class="summary-item">
......@@ -738,17 +796,33 @@
const date = day.date.getDate();
const datestr = date < 10 ? '0' + date : date;
const sum = year + '-' + monthstr + '-' + datestr;
const contrastList = this.diningSituations.notRepastDetailsDTOS.filter(e => e
.dayNotEatNumber != 0);
contrastList.forEach(item => {
if (sum == item.repastDate) {
const breakfastTxt = item.breakfastStatus ? '' : '早';
const lunchTxt = item.lunchStatus ? '' : '中';
const supperTxt = item.supperStatus ? '' : '晚';
day.topInfo = breakfastTxt + lunchTxt + supperTxt;
day.className = 'notice-day'
if (this.tabIndex == 1) { // 消费报告
const contrastList = this.diningSituations.notRepastDetailsDTOS.filter(e => e
.dayNotEatNumber != 0);
contrastList.forEach(item => {
if (sum == item.repastDate) {
const breakfastTxt = item.breakfastStatus ? '' : '早';
const lunchTxt = item.lunchStatus ? '' : '中';
const supperTxt = item.supperStatus ? '' : '晚';
day.topInfo = breakfastTxt + lunchTxt + supperTxt;
day.className = 'notice-day'
}
})
} else { // 门禁报告
if (sum == '2022-05-04') {
day.topInfo = '迟到';
day.className = 'late-day';
} else if (sum == '2022-05-09') {
day.topInfo = '请假';
day.className = 'leave-day'
} else if (sum == '2022-05-14') {
day.topInfo = '旷课';
day.className = 'late-day';
} else if (sum == '2022-05-16') {
day.topInfo = '早退';
day.className = 'late-day';
}
})
}
return day;
},
formatDate(date) {
......@@ -762,6 +836,9 @@
var dateStr =
`${date.getFullYear()}-${date.getMonth()<9?'0'+(date.getMonth()+1):date.getMonth()+1}-${date.getDate()<10?'0'+date.getDate():date.getDate()}`;;
this.queryNotRepastDetails(dateStr, dateStr, 1);
},
attendanceDateSelect(date) {
},
piechart: function() {
var myChart = echarts.init(document.getElementById('consumer-preferences-pie'));
......@@ -1439,12 +1516,12 @@
height: 452rpx;
background: no-repeat center/100% url(../../static/images/pubTalkReportBg.png);
}
.school-report-context-card-title {
height: 62rpx;
display: flex;
justify-content: center;
.school-report-context-card-title-img {
width: 318rpx;
background: no-repeat center/100% url(../../static/images/cardBg.png);
......@@ -1458,8 +1535,7 @@
align-items: center;
}
}
// 消费报告
.school-report-context-card {
width: 100%;
background: #E5F8F1;
......@@ -1781,6 +1857,180 @@
}
}
.attendance-report-context-card-two {
height: 748rpx;
background: #FFFFFF;
border-radius: 16rpx 16rpx 0 0;
.attendance-report-context-card-two-conclusion {
height: 40rpx;
padding: 0 30rpx 0;
box-sizing: border-box;
margin: 36rpx 0 29rpx;
display: flex;
justify-content: space-between;
.attendance-report-context-card-two-conclusion-txt {
font-size: 32rpx;
font-family: PingFangSC-Medium, PingFang SC;
font-weight: 500;
color: rgba(0, 0, 0, 0.85);
line-height: 40rpx;
.abnormal-days {
color: #F9793F;
margin: 0 5rpx;
}
}
.attendance-report-context-card-two-conclusion-logo {
width: 190rpx;
display: flex;
justify-content: space-between;
.attendance-report-context-card-two-conclusion-logo-item {
display: flex;
align-items: center;
.attendance-report-context-card-two-conclusion-logo-item-dot {
width: 12rpx;
height: 12rpx;
background: #F9793F;
border-radius: 12rpx;
&.leave {
background: #04B871;
}
}
.attendance-report-context-card-two-conclusion-logo-item-txt {
font-size: 28rpx;
font-family: PingFangSC-Medium, PingFang SC;
font-weight: 500;
color: rgba(0, 0, 0, 0.5);
margin-left: 14rpx;
}
}
}
}
.attendance-report-context-card-two-calendar {
height: 575rpx;
.mark-green {
color: #04B871;
}
.mark-orange {
color: #F9793F;
}
/deep/ .van-calendar__month-title {
display: none;
}
/deep/ .van-calendar__days {
margin: 10rpx 0 0;
}
/deep/ .van-calendar__day {
margin: 0 0 8rpx;
}
/deep/ .van-calendar__selected-day {
background: rgba(0, 0, 0, .1);
color: #F9793F;
}
/deep/ .van-calendar__top-info {
top: 0;
font-size: 20rpx;
font-family: PingFangSC-Regular, PingFang SC;
font-weight: 400;
color: #F9793F;
line-height: 28rpx;
margin: 0 0 4rpx;
}
/deep/ .late-day {
color: #F9793F;
background: rgba(249, 121, 63, .1);
border-radius: 8rpx;
width: 88rpx;
height: 88rpx;
margin-left: 10rpx;
}
/deep/ .leave-day {
color: #04B871;
background: rgba(4, 184, 113, .09);
border-radius: 8rpx;
width: 88rpx;
height: 88rpx;
margin-left: 10rpx;
}
}
}
.attendance-report-context-card-two-details {
position: relative;
top: -30rpx;
height: 146rpx;
background: no-repeat center/100% url(../../static/images/diningSituations.png);
padding: 57rpx 39rpx 0 34rpx;
box-sizing: border-box;
.attendance-report-context-card-two-details-item {
height: 50rpx;
display: flex;
justify-content: space-between;
.attendance-report-context-card-two-details-time {
display: flex;
align-items: center;
.attendance-report-context-card-two-details-time-img {
width: 25rpx;
height: 25rpx;
background: no-repeat center/100% url(../../static/images/attendanceTime.png);
}
.attendance-report-context-card-two-details-time-txt {
font-size: 28rpx;
font-family: PingFangSC-Medium, PingFang SC;
font-weight: 500;
color: rgba(0, 0, 0, 0.85);
&.txt-details {
margin: 0 16rpx 0 13rpx;
}
}
}
.attendance-report-context-card-two-details-date {
width: 130rpx;
height: 43rpx;
border-radius: 4rpx;
border: 1rpx solid #04B871;
font-size: 28rpx;
font-family: FontName;
color: #04B871;
display: flex;
justify-content: center;
align-items: center;
}
}
}
.attendance-report-context-card-three {
.dashed-line{
height: 66rpx;
border: 2rpx dashed rgba(0, 0, 0, 0.25);
}
}
.school-report-context-card-three {
height: 526rpx;
background: #FFFFFF;
......@@ -2047,10 +2297,10 @@
}
}
}
// 门禁报告
}
.no-open {
......@@ -2128,16 +2378,16 @@
font-size: 40rpx;
line-height: 45rpx;
}
.consumer-report-icon{
.consumer-report-icon {
margin: 0 45rpx 0 70rpx;
}
.attendance-report-icon{
.attendance-report-icon {
margin: 0 35rpx 0 134rpx;
}
.pubTalk-report-icon{
.pubTalk-report-icon {
margin: 0 35rpx 0 102rpx;
}
}
......@@ -2257,29 +2507,29 @@
background: no-repeat center/100% url(../../static/images/callCount.png);
margin: 0 31rpx 0 165rpx;
}
.leave-word-img{
.leave-word-img {
width: 30rpx;
height: 28rpx;
background: no-repeat center/100% url(../../static/images/leaveWord.png);
margin-right: 22rpx;
}
.call-duration-img{
.call-duration-img {
width: 31rpx;
height: 35rpx;
background: no-repeat center/100% url(../../static/images/callDuration.png);
margin: 0 23rpx 0 165rpx;
}
.face-call-img{
.face-call-img {
width: 32rpx;
height: 31rpx;
background: no-repeat center/100% url(../../static/images/faceCall.png);
margin-right: 21rpx;
}
.leave-word-analysis-img{
.leave-word-analysis-img {
width: 31rpx;
height: 31rpx;
background: no-repeat center/100% url(../../static/images/leaveWordAnalysis.png);
......
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