Skip to content

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

校园报告—门禁报告

parent 469813d9
Show whitespace changes
Inline Side-by-side
Showing with 341 additions and 51 deletions
src/pages/SchoolReport/SchoolReport.vue
View file @ aad06253
......@@ -41,13 +41,16 @@
<view class="school-report-context">
<view class="school-report-context-tab">
<view class="school-report-context-tab-item">
<view class="school-report-context-tab-item-one" :class="tabIndex==1?'active':''" @tap="tabTap(1)">
<view class="school-report-context-tab-item-one" :class="tabIndex==1?'active':''"
@tap="tabTap(1)">
<text>消费报告</text>
</view>
<view class="school-report-context-tab-item-one" :class="tabIndex==2?'active':''" @tap="tabTap(2)">
<view class="school-report-context-tab-item-one" :class="tabIndex==2?'active':''"
@tap="tabTap(2)">
<text>门禁报告</text>
</view>
<view class="school-report-context-tab-item-one" :class="tabIndex==3?'active':''" @tap="tabTap(3)">
<view class="school-report-context-tab-item-one" :class="tabIndex==3?'active':''"
@tap="tabTap(3)">
<text>公话报告</text>
</view>
</view>
......@@ -61,13 +64,14 @@
</view>
</view>
</view>
<view class="school-report-context-bgImg">
<view :class="['consumer-report-bgImg','attendance-report-bgImg','pubTalk-report-bgImg'][tabIndex-1]">
</view>
<view class="school-report-context-card">
<view class="school-report-context-card-one">
<view class="school-report-context-card-one-img">
<view class="school-report-context-card-one" :style="{height:[598,256,525][tabIndex-1]+'rpx'}">
<view :class="['consumer-report-img','attendance-report-img','pubTalk-report-img'][tabIndex-1]">
</view>
<view class="school-report-context-card-one-context">
<!-- 消费报告 -->
<view v-if="tabIndex==1" class="school-report-context-card-one-context">
<view class="school-report-context-card-one-context-item">
<view class="school-report-context-card-one-context-dot">
<view class="school-report-context-card-one-context-dot-item">
......@@ -117,9 +121,51 @@
</view>
</view>
</view>
<!-- 门禁报告 -->
<view v-else-if="tabIndex==2" class="attendance-report-context-card-one-context">
<view class="attendance-report-context-card-one-context-item">
<text>共<text class="txt-important">4</text>天出勤异常，请及时关注</text>
<!-- <text>恭喜<text
class="txt-important">{{userInfo.userName}}</text>荣获全勤好学生，风雨无阻上学路</text> -->
</view>
<view class="school-report-context-card-two">
</view>
<!-- 公话报告 -->
<view v-else class="pubTalk-report-context-card-one-context">
<view class="pubTalk-report-context-card-one-context-item">
<view class="pubTalk-report-context-card-one-context-dot">
<view class="pubTalk-report-context-card-one-context-dot-item">
</view>
</view>
<view class="pubTalk-report-context-card-one-context-txt">
<text>最喜欢和<text class="txt-important">妈妈</text>沟通，共通话<text class="txt-important">16次
52分钟</text>，超过全校<text class="txt-important">96%</text>的同学</text>
</view>
</view>
<view class="pubTalk-report-context-card-one-context-item">
<view class="pubTalk-report-context-card-one-context-dot">
<view class="pubTalk-report-context-card-one-context-dot-item">
</view>
</view>
<view class="pubTalk-report-context-card-one-context-txt">
<text>跟<text class="txt-important">爷爷</text>沟通最少，共通话<text class="txt-important">1次
10分钟</text>，超过全校<text class="txt-important">10%</text>的同学</text>
</view>
</view>
<view
class="pubTalk-report-context-card-one-context-item pubTalk-report-context-card-one-context-item-last">
<view class="pubTalk-report-context-card-one-context-dot">
<view class="pubTalk-report-context-card-one-context-dot-item">
</view>
</view>
<view class="pubTalk-report-context-card-one-context-txt">
<text><text class="txt-important">爸爸</text>是默默的守护，有时也不要忘记多和<text
class="txt-important">爸爸</text>进行交流</text>
</view>
</view>
</view>
</view>
<!-- 消费报告 -->
<view v-if="tabIndex==1" class="school-report-context-card-two">
<view class="school-report-context-card-title">
<view class="school-report-context-card-title-img">
<text>就餐情况</text>
......@@ -195,7 +241,7 @@
</view>
</view>
</view>
<view v-if="isOpen" class="school-report-context-card-three">
<view v-if="tabIndex==1&&isOpen" class="school-report-context-card-three">
<view class="school-report-context-card-title">
<view class="school-report-context-card-title-img">
<text>消费偏好</text>
......@@ -212,7 +258,7 @@
<view id="consumer-preferences-pie">
</view>
</view>
<view v-if="isOpen" class="school-report-context-card-four">
<view v-if="tabIndex==1&&isOpen" class="school-report-context-card-four">
<view class="school-report-context-card-title">
<view class="school-report-context-card-title-img">
<text>消费总额</text>
......@@ -253,7 +299,7 @@
</view>
</view>
</view>
<view v-if="isOpen" class="school-report-context-card-five">
<view v-if="tabIndex==1&&isOpen" class="school-report-context-card-five">
<view class="school-report-context-card-title">
<view class="school-report-context-card-title-img">
<text>消费趋势</text>
......@@ -290,8 +336,9 @@
<text>到期后将无法查看完整报告</text>
</view>
<view class="school-report-validity">
<text>有效期至<text class="validity-date">{{memberInfo.invalidDateStr}}</text>,剩余<text
class="validity-date">{{memberInfo.differDay}}天</text></text>
<text>有效期至<text
class="validity-date">{{[memberInfo.invalidDateStr,'2023年12月31日','2024年12月31日'][tabIndex-1]}}</text>,剩余<text
class="validity-date">{{[memberInfo.differDay,9,10][tabIndex-1]}}天</text></text>
</view>
</view>
<view class="school-report-footer-item-two">
......@@ -303,11 +350,11 @@
</view>
</view>
<view v-if="!isOpen" class="no-open">
<view class="no-open-solution">
<view class="no-open-solution" @tap="equityPay">
<view class="no-open-solution-txt">
<text>最低 {{memberInfo.leastAmount}}元/天开通，查看完整消费报告</text>
<text>最低{{[memberInfo.leastAmount,0.1,0.3][tabIndex-1]}}元/天开通，查看完整{{['消费','门禁','公话'][tabIndex-1]}}报告</text>
</view>
<view class="no-open-solution-item" @tap="equityPay">
<view class="no-open-solution-item">
</view>
</view>
<view class="open-results">
......@@ -317,16 +364,18 @@
<view class="open-results-items">
<view class="open-results-items-summary">
<view class="summary-item">
<text>月度消费报告</text>
<text>{{['月度消费报告','实时推送','音视频通话'][tabIndex-1]}}</text>
</view>
<view class="summary-item-icon">
<text>+</text>
</view>
<view class="summary-item">
<text>消费总结</text>
<text>{{['消费总结','月度门禁报告','月度公话报告'][tabIndex-1]}}</text>
</view>
</view>
<view class="open-results-items-details">
<!-- 消费报告 -->
<view v-if="tabIndex==1">
<view class="open-results-items-details-item">
<view class="dining-situations-img">
</view>
......@@ -366,6 +415,87 @@
</view>
</view>
</view>
<!-- 门禁报告 -->
<view v-else-if="tabIndex==2">
<view class="open-results-items-details-item">
<view class="admission-notice-img">
</view>
<view class="open-results-items-details-item-txt">
<text>出入校通知</text>
</view>
<view class="admission-analysis-img">
</view>
<view class="open-results-items-details-item-txt">
<text>出勤情况分析</text>
</view>
</view>
<view class="open-results-items-details-item">
<view class="admission-record-img">
</view>
<view class="open-results-items-details-item-txt">
<text>出入校记录</text>
</view>
</view>
<view class="open-results-items-details-item">
<view class="admission-image-img">
</view>
<view class="open-results-items-details-item-txt">
<text>出入校图片</text>
</view>
</view>
</view>
<!-- 公话报告 -->
<view v-else>
<view class="open-results-items-details-item">
<view class="video-call-img">
</view>
<view class="open-results-items-details-item-txt">
<text>视频通话</text>
</view>
<view class="communication-advice-img">
</view>
<view class="open-results-items-details-item-txt">
<text>家庭沟通建议</text>
</view>
</view>
<view class="open-results-items-details-item">
<view class="voice-call-img">
</view>
<view class="open-results-items-details-item-txt">
<text>语音通话</text>
</view>
<view class="call-count-img">
</view>
<view class="open-results-items-details-item-txt">
<text>通话次数分析</text>
</view>
</view>
<!-- <view class="open-results-items-details-item">
<view class="leave-word-img">
</view>
<view class="open-results-items-details-item-txt">
<text>亲子留言</text>
</view>
<view class="call-duration-img">
</view>
<view class="open-results-items-details-item-txt">
<text>通话时长分析</text>
</view>
</view>
<view class="open-results-items-details-item">
<view class="face-call-img">
</view>
<view class="open-results-items-details-item-txt">
<text>刷脸通话</text>
</view>
<view class="leave-word-analysis-img">
</view>
<view class="open-results-items-details-item-txt">
<text>家庭留言分析</text>
</view>
</view> -->
</view>
</view>
</view>
</view>
</view>
......@@ -416,7 +546,7 @@
maxDate: new Date(),
imgUrl: '', // 存储base64图片
dialogShow: false,
tabIndex:1,
tabIndex: 1,
// 就餐情况
diningSituations: {
diningSituationsDate: '',
......@@ -442,6 +572,7 @@
lineDatas: [],
// 会员信息
isOpen: false,
isOpen: true,
memberInfo: {
leastAmount: '',
invalidDateStr: '',
......@@ -485,8 +616,8 @@
}
},
methods: {
tabTap:function(num){
this.tabIndex=num;
tabTap: function(num) {
this.tabIndex = num;
},
toImage: function() {
this.$nextTick(() => {
......@@ -1112,8 +1243,17 @@
}
},
equityPay: function() {
jWeixin.miniProgram.redirectTo({
jWeixin.miniProgram.switchTab({
url: `/pages/UserMain/main`,
success: function success() {
console.log('skip success')
},
fail: function fail(_fail) {
console.warn(_fail);
uni.showModal({
content: JSON.stringify(_fail)
});
}
});
},
},
......@@ -1266,12 +1406,24 @@
}
}
.school-report-context-bgImg {
.consumer-report-bgImg {
width: 100%;
height: 452rpx;
background: no-repeat center/100% url(../../static/images/consumeReportBg.png);
}
.attendance-report-bgImg {
width: 100%;
height: 452rpx;
background: no-repeat center/100% url(../../static/images/attendanceReportBg.png);
}
.pubTalk-report-bgImg {
width: 100%;
height: 452rpx;
background: no-repeat center/100% url(../../static/images/pubTalkReportBg.png);
}
.school-report-context-card {
width: 100%;
background: #E5F8F1;
......@@ -1282,12 +1434,11 @@
.school-report-context-card-one {
width: 100%;
height: 598rpx;
background: #FFFFFF;
border-radius: 16rpx;
margin-bottom: 40rpx;
.school-report-context-card-one-img {
.consumer-report-img {
width: 428rpx;
height: 428rpx;
background: no-repeat center/100% url(../../static/images/consumeReport.png);
......@@ -1296,6 +1447,24 @@
left: 160rpx;
}
.attendance-report-img {
width: 428rpx;
height: 428rpx;
background: no-repeat center/100% url(../../static/images/attendanceReport.png);
position: absolute;
top: -172rpx;
left: 160rpx;
}
.pubTalk-report-img {
width: 428rpx;
height: 428rpx;
background: no-repeat center/100% url(../../static/images/pubTalkReport.png);
position: absolute;
top: -172rpx;
left: 160rpx;
}
.school-report-context-card-one-context {
width: 613rpx;
margin: 0 30rpx 0 47rpx;
......@@ -1338,6 +1507,69 @@
}
}
}
.attendance-report-context-card-one-context {
padding: 163rpx 0 0;
box-sizing: border-box;
.attendance-report-context-card-one-context-item {
height: 40rpx;
font-size: 28rpx;
font-family: PingFangSC-Medium, PingFang SC;
font-weight: 500;
color: rgba(0, 0, 0, 0.85);
display: flex;
justify-content: center;
.txt-important {
color: #04B871;
margin: 0 4rpx;
}
}
}
.pubTalk-report-context-card-one-context {
width: 613rpx;
margin: 0 30rpx 0 47rpx;
position: absolute;
top: 163rpx;
.pubTalk-report-context-card-one-context-item {
margin: 0 0 32rpx;
display: flex;
.pubTalk-report-context-card-one-context-dot {
height: 40rpx;
display: flex;
align-items: center;
.pubTalk-report-context-card-one-context-dot-item {
width: 10rpx;
height: 10rpx;
background: #04B871;
border-radius: 10rpx;
margin-right: 16rpx;
}
}
.pubTalk-report-context-card-one-context-txt {
line-height: 40rpx;
.txt-important {
color: #04B871;
margin: 0 4rpx;
}
.txt-important-two {
color: #04B871;
}
}
&.pubTalk-report-context-card-one-context-item-last {
margin: 0;
}
}
}
}
.school-report-context-card-title {
......@@ -1933,6 +2165,64 @@
background: no-repeat center/100% url(../../static/images/consumerTrend.png);
margin-right: 25rpx;
}
// 门禁报告
.admission-notice-img {
width: 30rpx;
height: 27rpx;
background: no-repeat center/100% url(../../static/images/admissionNotice.png);
margin-right: 23rpx;
}
.admission-analysis-img {
width: 30rpx;
height: 32rpx;
background: no-repeat center/100% url(../../static/images/admissionAnalysis.png);
margin: 0 25rpx 0 112rpx;
}
.admission-record-img {
width: 29rpx;
height: 31rpx;
background: no-repeat center/100% url(../../static/images/admissionRecord.png);
margin-right: 24rpx;
}
.admission-image-img {
width: 29rpx;
height: 29rpx;
background: no-repeat center/100% url(../../static/images/admissionImage.png);
margin-right: 24rpx;
}
// 公话报告
.video-call-img {
width: 31rpx;
height: 24rpx;
background: no-repeat center/100% url(../../static/images/videoCall.png);
margin-right: 21rpx;
}
.communication-advice-img {
width: 38rpx;
height: 31rpx;
background: no-repeat center/100% url(../../static/images/communicationAdvice.png);
margin: 0 24rpx 0 112rpx;
}
.voice-call-img{
width: 25rpx;
height: 34rpx;
background: no-repeat center/100% url(../../static/images/voiceCall.png);
margin-right: 26rpx;
}
.call-count-img{
width: 30rpx;
height: 30rpx;
background: no-repeat center/100% url(../../static/images/callCount.png);
margin: 0 31rpx 0 112rpx;
}
}
}
}
......
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