<template>
	<view class="tainer" :style="{height:containerHeight+'rpx'}">
		<template v-if="auth == 'true'">
		<view v-if="showReport">
			<view class="school-report-header-bg">
			</view>
			<view class="school-report-header-position">
				<view class="school-report-header">
					<view class="school-report-header-item">
						<view class="user-avatar">
						</view>
						<!-- <view class="user-info"> -->
							<view class="user-name">
								{{userInfo.userName}}
							</view>
							<!-- <view class="class-name">
								<text>{{userInfo.gradeName}} {{userInfo.className}}</text>
							</view> -->
						<!-- </view> -->
					</view>
					<view class="school-report-header-item">
						<view class="school-report-screen">
							<view class="school-report-screen-item">
								<view class="school-report-type">
									<picker @change="schoolReportChange" :value="reportTypeIndex"
										:range="reportTypeArr">
										<view class="uni-input">{{reportTypeArr[reportTypeIndex]}}</view>
									</picker>
								</view>
								<view class="triangle">
								</view>
							</view>
							<view class="school-report-screen-item-two">
								<view class="school-report-date">
									<picker @change="dataRangeChange" :value="dataRangeIndex" :range="dataRangeArr"
										range-key="week">
										<view class="uni-input">{{dataRangeArr[dataRangeIndex].weekstr||""}}</view>
									</picker>
								</view>
								<view class="triangle">
								</view>
							</view>
						</view>
					</view>
				</view>
				<view class="school-report-context-tab">
					<view class="school-report-context-tab-item">
						<!-- <view v-if="isService" class="school-report-context-tab-item-one"
							:class="tabIndex==1?'active':''" @tap="tabTap(1)">
							<view class="tab-title"><text>消费报告</text></view>
							<view :class="tabIndex==1?'active-bottomline':''">
							</view>
						</view>
						<view v-if="isAttendanceService" class="school-report-context-tab-item-one"
							:class="tabIndex==2?'active':''" @tap="tabTap(2)">
							<view class="tab-title"><text>出入校报告</text></view>
							<view :class="tabIndex==2?'active-bottomline':''">
							</view>
						</view>
						<view v-if="isPubTalkService" class="school-report-context-tab-item-one"
							:class="tabIndex==3?'active':''" @tap="tabTap(3)">
							<view class="tab-title"><text>公话报告</text></view>
							<view :class="tabIndex==3?'active-bottomline':''">
							</view>
						</view> -->
					</view>
					<view class="school-report-context-tab-item-two">
						<view class="share-button" @tap="shareHandler">
							<view class="share-button-img">
							</view>
							<view class="share-button-txt">
								<text>分享</text>
							</view>
						</view>
					</view>
				</view>
			</view>
			<view v-if="tabIndex" class="school-report-context">
				<!-- <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="['consumer-report-img','attendance-report-img','pubTalk-report-img'][tabIndex-1]">
						</view>
						<!-- 消费报告 -->
						<view v-show="tabIndex==1&&consumerDetailCalculateObj.totalData>0"
							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">
									</view>
								</view>
								<view class="school-report-context-card-one-context-txt">
									<text v-if="diningSituations.cateringLevel">共<text
											class="txt-important">{{diningSituations.notCateringNumber}}</text>次未吃{{diningSituations.notCateringType}},请提醒<text
											class="txt-important">{{userInfo.userName}}</text>
										{{diningSituations.clues}}</text>
									<text v-else>恭喜<text
											class="txt-important">{{userInfo.userName}}</text>荣获“快乐干饭人”称号，快乐要和家人一起分享哦</text>
								</view>
							</view> -->
							<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">
									</view>
								</view>
								<view class="school-report-context-card-one-context-txt">
                  本{{['月','周'][reportTypeIndex]}}生活费
                  <text class="txt-important">{{consumerDetailCalculateObj.totalData}}</text> 元，
                  <text v-if="consumerSummaryAmountOBj.gtgraderate >= 80">{{consumerSummaryAmountOBj.gtgraderate}}<text class="txt-important">超过了</text>同年级 <text class="txt-important">80%</text>的学生。要注意引导孩子习惯，培养健康的消费观念哦~</text>
                  <text v-else-if="consumerSummaryAmountOBj.gtgraderate >= 60 && consumerSummaryAmountOBj.gtgraderate < 80">{{consumerSummaryAmountOBj.gtgraderate}}<text class="txt-important">超过了</text>同年级 <text class="txt-important">60%</text>的学生。要注意引导孩子习惯，培养健康的消费观念哦~</text>
                  <text v-else-if="consumerSummaryAmountOBj.gtgraderate >= 40 && consumerSummaryAmountOBj.gtgraderate < 60">与同年级的学生基本持平。请继续关注在校消费情况，引导孩子消费习惯哦~</text>
                  <text v-else-if="consumerSummaryAmountOBj.gtgraderate >= 20 && consumerSummaryAmountOBj.gtgraderate < 40"><text class="txt-important">低于</text>同年级60%的学生。请继续关注在校消费情况，引导孩子消费习惯哦~</text>
                  <text v-else-if="consumerSummaryAmountOBj.gtgraderate < 20"><text class="txt-important">低于</text>同年级80%的学生。要注意引导孩子习惯，培养健康的消费观念哦~</text>
									<!-- 本{{['月','周'][reportTypeIndex]}}就餐<text
										class="txt-important">{{consumerDetailCalculateObj.cateringNumber}}</text>次，未就餐<text
										class="txt-important">{{consumerDetailCalculateObj.notCateringNumber}}</text>次。早午晚餐消费<text
										class="txt-important">{{consumerDetailCalculateObj.canteenData}}</text>元，生活费总花费<text
										class="txt-important">{{consumerDetailCalculateObj.totalData}}</text>元 -->
								</view>
							</view>
							<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">
									</view>
								</view>
								<!--<view class="school-report-context-card-one-context-txt">
									<!-- <text v-if="isEatLow">正餐消费占比<text
											class="txt-important-two">过低</text>,请及时调整饮食习惯</text>
									<text v-else>饮食较<text class="txt-important-two">均衡</text>，继续保持哦</text> 
                  食堂消费 <text class="txt-important"> {{consumerSummaryAmountOBj.canteenamount}} </text>元，超市和其他场景消费 <text class="txt-important"> 510.5</text>元。孩子在食堂消费 <text class="txt-important">占比过低</text>，要注意均衡饮食习惯哦~
								</view> -->
                <view class="school-report-context-card-one-context-txt" v-if="isEatLow">  食堂消费<text
											class="txt-important"> {{consumerSummaryAmountOBj.canteenamount}} </text> 元，超市和其他场景消费 <text
											class="txt-important">{{consumerSummaryAmountOBj.superAndOtherAmount}}</text>元。孩子在食堂消费<text
											class="txt-important">占比过低</text>，要注意均衡饮食习惯哦~</view>
									<view v-else>食堂消费 <text
											class="txt-important"> {{consumerSummaryAmountOBj.canteenamount}} </text> 元，超市和其他场景消费<text
											class="txt-important"> {{consumerSummaryAmountOBj.superAndOtherAmount}}</text> 元。按时就餐均衡饮食，要继续保持哦~</view>
							</view>
							<!-- <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">
									</view>
								</view>
								<view class="school-report-context-card-one-context-txt">
									消费 <text
										class="txt-important">{{consumerAmountObj.consumergrossamount}}</text>元,超过全校
									<text class="txt-important">{{consumerAmountObj.gtgraderate}}%</text>
									的同学<text v-if="isReasonable">,请及时评估生活费是否合理</text>
								</view>
							</view> -->
							<view class="school-report-context-card-one-context-item"  v-if="cateringAbnormalGroupList.length">
								<view class="school-report-context-card-one-context-dot">
									<view class="school-report-context-card-one-context-dot-item">
									</view>
								</view>
								<view class="school-report-context-card-one-context-txt">
									<!-- <text v-if="isAbnormal"><text
											class="txt-important-two">{{consumerTrend.clues}}</text>的消费金额存在异常,请及时关注</text>
									<text v-else>每日消费金额较稳定，继续保持哦</text> -->
                  本{{['月','周'][reportTypeIndex]}}有<text class="txt-important"> {{cateringAbnormalGroupList.length}}</text>天存在就餐异常情况（<text class="txt-important">{{dateForStr}}</text>），请家长及时关注，多和孩子聊聊吧~
								</view>
							</view>
							<!-- <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">
									</view>
								</view>
								<view v-if="!abnormalStr" class="school-report-context-card-one-context-txt">
									早、中、晚餐就餐时间较稳定，按时吃饭，自律如昔，你就赢了大多数人
								</view>
								<view v-else class="school-report-context-card-one-context-txt">
									<text class="txt-important">{{abnormalStr}}</text>的就餐时间跟同班同学相差超20分钟，如果快乐很难，那么按时吃饭
								</view>
							</view>
							<view
								class="school-report-context-card-one-context-item school-report-context-card-one-context-item-last">
								<view class="school-report-context-card-one-context-dot">
									<view class="school-report-context-card-one-context-dot-item">
									</view>
								</view>
								<view v-if="!mealPalArr.length" class="school-report-context-card-one-context-txt">
									独立的<text class="txt-important">{{userInfo.userName}}</text>很棒，偶尔也可以叫上朋友一起吃饭哦</text>
								</view>
								<view v-else-if="mealPalArr.length==1"
									class="school-report-context-card-one-context-txt">
									最佳饭友非<text class="txt-important">{{mealPalStr}}</text>莫属，有饭友吃嘛嘛香</text>
								</view>
								<view v-else class="school-report-context-card-one-context-txt">
									最佳干饭组合，赶快叫上<text class="txt-important">{{mealPalStr}}</text>一起吃饭吧</text>
								</view>
							</view> -->
						</view>
						<view v-show="tabIndex==1&&consumerDetailCalculateObj.totalData<=0"
							class="school-report-context-card-one-context">
							<view class="school-report-context-card-one-context-nodata">
								<view class="card-one-nodata-img">
									<image :src="ImgUrl+'SchoolReport/defaultnull.png'" mode=""></image>
								</view>
								<view class="card-one-nodata-txt">
									<text>孩子本{{['月','周'][reportTypeIndex]}}无消费记录</text>
								</view>
							</view>
						</view>

						<!-- 出入校报告 -->
						<!-- <view v-show="tabIndex==2" class="attendance-report-context-card-one-context">
							<view class="attendance-report-context-card-one-context-item">
								<text v-if="attendanceReport.abnormalNum&&attendanceReport.abnormalNum!=-1">共<text
										class="txt-important">{{attendanceReport.abnormalNum}}</text>天出入异常，请及时关注</text>
								<text v-else-if="attendanceReport.abnormalNum==-1">风雨无阻上学路,继续加油哦</text>
								<text v-else>恭喜<text
										class="txt-important">{{userInfo.userName}}</text>荣获全勤好学生，风雨无阻上学路</text>
							</view>
						</view> -->
						<!-- 公话报告 -->
						<!-- <view v-show="tabIndex==3" class="pubTalk-report-context-card-one-context">
							<view class="pubTalk-report-context-card-one-context-item" v-if="pubTalkReport.talkText1">
								<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">{{pubTalkReport.talkText1}}</text>沟通，共通话<text
											class="txt-important">{{pubTalkReport.talkText2}}次{{pubTalkReport.talkText3}}分钟</text>，超过全校<text
											class="txt-important">{{pubTalkReport.talkText4}}</text>的同学</text>
								</view>
							</view>
							<view class="pubTalk-report-context-card-one-context-item" v-else>
								<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 class="txt-important">有事没事记得和家人多联系哦~</text>
								</view>
							</view>
							<view class="pubTalk-report-context-card-one-context-item" v-if="pubTalkReport.talkText5">
								<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">{{pubTalkReport.talkText5}}</text>沟通最少，共通话<text
											class="txt-important">{{pubTalkReport.talkText6}}次{{pubTalkReport.talkText7}}分钟</text>，超过全校<text
											class="txt-important">{{pubTalkReport.talkText8}}</text>的同学</text>
								</view>
							</view>
							<view
								class="pubTalk-report-context-card-one-context-item pubTalk-report-context-card-one-context-item-last"
								v-if="pubTalkReport.talkText9">
								<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">{{pubTalkReport.talkText9}}</text>是默默的守护，有时也不要忘记多和<text
											class="txt-important">{{pubTalkReport.talkText9}}</text>进行交流</text>
								</view>
							</view>
						</view> -->
					</view>
          <!-- 生活费额度 -->
          <view v-show="tabIndex==1&&isOpen" class="school-report-context-card-four">
						<view class="school-report-context-card-title">
							<view class="school-report-context-card-title-img school-report-context-card-title-img1">
								<text></text>
							</view>
						</view>
						<view class="school-report-context-card-four-conclusion">
							<view class="school-report-context-card-four-conclusion-item"
								:class="consumerDetailCalculateObj.totalData>0?'':'card-four-conclusion-nodata'" v-if="consumerDetailCalculateObj.totalData>0">
								<!-- <text>消费<text
										class="consume-total">{{consumerAmountObj.consumergrossamount}}</text>元，超过同年级<text
										class="consume-total">{{consumerAmountObj.gtgraderate}}%</text>的同学<text
										v-if="isReasonable">，请及时评估生活费是否合理</text></text> -->
								<!-- <text v-if="consumerDetailCalculateObj.totalData>0">消费总额<text
										class="consume-total">{{livingExpensesAllowance.userConsumeAmount}}</text>元<text
										v-if="livingExpensesAllowance.gradeAverageAmount>0">，同比上{{['月','周'][reportTypeIndex]}}<text
											class="consume-total">{{livingExpensesAllowance.lastMonthRateStr}}
											<van-icon :class="livingExpensesAllowance.lastMonthRate>0?'livingCostUp':''"
												name="down" />
										</text>
									</text>
								</text> -->
                <text >
                  本{{['月','周'][reportTypeIndex]}}生活费<text class="consume-total">{{consumerDetailCalculateObj.totalData}}</text> 元，
                  <template v-if="consumerSummaryAmountOBj.gtgraderate >= 80">{{consumerSummaryAmountOBj.gtgraderate}}<text class="consume-total">超过了</text>同年级 <text class="consume-total">80%</text>的学生。要注意引导孩子习惯，培养健康的消费观念哦~</template>
                  <template v-else-if="consumerSummaryAmountOBj.gtgraderate >= 60 && consumerSummaryAmountOBj.gtgraderate < 80">{{consumerSummaryAmountOBj.gtgraderate}}<text class="consume-total">超过了</text>同年级 <text class="consume-total">60%</text>的学生。要注意引导孩子习惯，培养健康的消费观念哦~</template>
                  <template v-else-if="consumerSummaryAmountOBj.gtgraderate >= 40 && consumerSummaryAmountOBj.gtgraderate < 60">与同年级的学生基本持平。请继续关注在校消费情况，引导孩子消费习惯哦~</template>
                  <template v-else-if="consumerSummaryAmountOBj.gtgraderate >= 20 && consumerSummaryAmountOBj.gtgraderate < 40"><text class="consume-total">低于</text>同年级60%的学生。请继续关注在校消费情况，引导孩子消费习惯哦~</template>
                  <template v-else-if="consumerSummaryAmountOBj.gtgraderate < 20"><text class="consume-total">低于</text>同年级80%的学生。要注意引导孩子习惯，培养健康的消费观念哦~</template>
                </text>
								<!-- <text v-else>
									孩子本{{['月','周'][reportTypeIndex]}}无消费记录
								</text> -->
							</view>
              <view class="school-report-context-card-one-context-nodata" v-if="!consumerDetailCalculateObj.totalData" style="padding-top: 50rpx; margin-bottom: 74rpx;">
								<view class="card-one-nodata-img">
									<image :src="ImgUrl+'SchoolReport/defaultnull.png'" mode=""></image>
								</view>
								<view class="card-one-nodata-txt">
									<text>孩子本{{['月','周'][reportTypeIndex]}}无消费记录</text>
								</view>
							</view>
						</view>
            <view class="school-report-context-card-four-conclusion-chart">
              <view class="title">
                <view class="firstCol"></view>
                <view class="lastCol">
                  <view>本人</view>
                  <view>年级</view>
                  <view>全校</view>
                </view>
              </view>
              <view class="picture">
                <view class="left">
                  <image :src="ImgUrl+'SchoolReport/costReportIMG15.png'" class="leftImg"></image>
                </view>
                <view class="right">
                  <view class="rightBar">
                      <image :src="ImgUrl+'SchoolReport/costReportIMG16.png'" class="costReportIMG16"></image>
                      <image :src="ImgUrl+'SchoolReport/costReportIMG17.png'" class="costReportIMG17"></image>
                      <image :src="ImgUrl+'SchoolReport/costReportIMG18.png'" class="costReportIMG18"></image>
                  </view>
                </view>
              </view>
              <view class="picture data">
                <view class="left">
                  总计
                </view>
                <view class="right">
                  <view class="rightBar">
                      <view class="line" v-if="consumerSummaryAmountOBj.consumergrossamount">
                        <view >{{consumerSummaryAmountOBj.consumergrossamount_[0]}}</view><view>.{{consumerSummaryAmountOBj.consumergrossamount_[1]}}</view>
                      </view>
                      <view class="line_" v-else>--</view>
                      <view class="line" v-if="consumerSummaryAmountOBj.gradeavgamount">
                        <view>{{consumerSummaryAmountOBj.gradeavgamount_[0]}}</view><view>.{{consumerSummaryAmountOBj.gradeavgamount_[1]}}</view>
                      </view>
                       <view class="line_" v-else>--</view>
                      <view class="line" v-if="consumerSummaryAmountOBj.schoolavgamount">
                        <view>{{consumerSummaryAmountOBj.schoolavgamount_[0]}}</view><view>.{{consumerSummaryAmountOBj.schoolavgamount_[1]}}</view></view>
                       <view class="line_" v-else>--</view>
                  </view>
                </view>
              </view>
              <view class="picture data lastLine">
                <view class="left">
                  较上{{['月','周'][reportTypeIndex]}}
                </view>
                <view class="right">
                  <view class="rightBar">
                      <view class="red" v-if="consumerAmountObj.lastMonthIncreaseRate > 0">+{{consumerAmountObj.lastMonthIncreaseRate}}%↑</view>
                      <view class="green" v-else-if="consumerAmountObj.lastMonthIncreaseRate < 0">{{consumerAmountObj.lastMonthIncreaseRate}}%↓</view>
                      <view class="grey" v-else-if="consumerAmountObj.lastMonthIncreaseRate == 0">持平</view>
                      <view class="grey" v-else>--</view>
                      <view class="red" v-if="consumerAmountObj.gradeLastMonthIncreaseRate > 0">+{{consumerAmountObj.gradeLastMonthIncreaseRate}}%↑</view>
                      <view class="green" v-else-if="consumerAmountObj.gradeLastMonthIncreaseRate < 0">{{consumerAmountObj.gradeLastMonthIncreaseRate}}%↓</view>
                      <view class="grey"  v-else-if="consumerAmountObj.gradeLastMonthIncreaseRate == 0">持平</view>
                       <view class="grey" v-else>--</view>
                      <view class="red" v-if="consumerAmountObj.schoolLastMonthIncreaseRate > 0">+{{consumerAmountObj.schoolLastMonthIncreaseRate}}%↑</view>
                      <view class="green" v-else-if="consumerAmountObj.schoolLastMonthIncreaseRate < 0">-{{consumerAmountObj.schoolLastMonthIncreaseRate}}%↓</view>
                      <view class="grey" v-else-if="consumerAmountObj.schoolLastMonthIncreaseRate == 0">持平</view>
                       <view class="grey" v-else>--</view>
                  </view>
                </view>
              </view>
              <view class="dotLine"></view>
              <view class="dotLine dotLine2"></view>
            </view>
            <view class="school-report-context-card-four-conclusion-meal">
              <view class="left">
                 <image :src="ImgUrl+'SchoolReport/costReportIMG19.png'" class="left"></image>
                 <view class="txt">早餐</view>
              </view>
              <view class="right">
                <view class="firstLine">
                  <view class="firstCol">合计</view>
                  <view class="lastCol">
                    <view>{{consumerAmountObj.campusMealTypeConsumerSummaryList && consumerAmountObj.campusMealTypeConsumerSummaryList.length && consumerAmountObj.campusMealTypeConsumerSummaryList[0].mealTypeTotalAmount ? consumerAmountObj.campusMealTypeConsumerSummaryList[0].mealTypeTotalAmount : '--'}}</view>
                    <view>{{consumerAmountObj.campusMealTypeConsumerSummaryList && consumerAmountObj.campusMealTypeConsumerSummaryList.length && consumerAmountObj.campusMealTypeConsumerSummaryList[0].gradeMealTypeTotalAmount ? consumerAmountObj.campusMealTypeConsumerSummaryList[0].gradeMealTypeTotalAmount : '--'}}</view>
                    <view>{{consumerAmountObj.campusMealTypeConsumerSummaryList && consumerAmountObj.campusMealTypeConsumerSummaryList.length && consumerAmountObj.campusMealTypeConsumerSummaryList[0].schoolMealTypeTotalAmount ? consumerAmountObj.campusMealTypeConsumerSummaryList[0].schoolMealTypeTotalAmount : '--'}}</view>
                  </view>
                </view>
                <view class="secondLine">
                  <view class="firstCol">餐均</view>
                  <view  class="lastCol">
                    <view>{{consumerAmountObj.campusMealTypeConsumerSummaryList && consumerAmountObj.campusMealTypeConsumerSummaryList.length && consumerAmountObj.campusMealTypeConsumerSummaryList[0].mealTypeAvgAmount ? consumerAmountObj.campusMealTypeConsumerSummaryList[0].mealTypeAvgAmount : '--'}}</view>
                    <view>{{consumerAmountObj.campusMealTypeConsumerSummaryList && consumerAmountObj.campusMealTypeConsumerSummaryList.length && consumerAmountObj.campusMealTypeConsumerSummaryList[0].gradeMealTypeAvgAmount ? consumerAmountObj.campusMealTypeConsumerSummaryList[0].gradeMealTypeAvgAmount : '--'}}</view>
                    <view>{{consumerAmountObj.campusMealTypeConsumerSummaryList && consumerAmountObj.campusMealTypeConsumerSummaryList.length && consumerAmountObj.campusMealTypeConsumerSummaryList[0].schoolMealTypeAvgAmount ? consumerAmountObj.campusMealTypeConsumerSummaryList[0].schoolMealTypeAvgAmount : '--'}}</view>
                  </view>
                </view>
              </view>
              <view class="dotLine"></view>
              <view class="dotLine dotLine2"></view>
            </view>
            <view class="school-report-context-card-four-conclusion-meal">
              <view class="left">
                 <image :src="ImgUrl+'SchoolReport/costReportIMG20.png'" class="left"></image>
                 <view class="txt">午餐</view>
              </view>
              <view class="right">
                <view class="firstLine">
                  <view class="firstCol">合计</view>
                  <view class="lastCol">
                    <view>{{consumerAmountObj.campusMealTypeConsumerSummaryList && consumerAmountObj.campusMealTypeConsumerSummaryList.length && consumerAmountObj.campusMealTypeConsumerSummaryList[1].mealTypeTotalAmount ? consumerAmountObj.campusMealTypeConsumerSummaryList[1].mealTypeTotalAmount : '--'}}</view>
                    <view>{{consumerAmountObj.campusMealTypeConsumerSummaryList && consumerAmountObj.campusMealTypeConsumerSummaryList.length && consumerAmountObj.campusMealTypeConsumerSummaryList[1].gradeMealTypeTotalAmount ? consumerAmountObj.campusMealTypeConsumerSummaryList[1].gradeMealTypeTotalAmount : '--'}}</view>
                    <view>{{consumerAmountObj.campusMealTypeConsumerSummaryList && consumerAmountObj.campusMealTypeConsumerSummaryList.length && consumerAmountObj.campusMealTypeConsumerSummaryList[1].schoolMealTypeTotalAmount ? consumerAmountObj.campusMealTypeConsumerSummaryList[1].schoolMealTypeTotalAmount : '--'}}</view>
                  </view>
                </view>
                <view class="secondLine">
                  <view class="firstCol">餐均</view>
                  <view  class="lastCol">
                    <view>{{consumerAmountObj.campusMealTypeConsumerSummaryList && consumerAmountObj.campusMealTypeConsumerSummaryList.length && consumerAmountObj.campusMealTypeConsumerSummaryList[1].mealTypeAvgAmount ? consumerAmountObj.campusMealTypeConsumerSummaryList[1].mealTypeAvgAmount : '--'}}</view>
                    <view>{{consumerAmountObj.campusMealTypeConsumerSummaryList && consumerAmountObj.campusMealTypeConsumerSummaryList.length && consumerAmountObj.campusMealTypeConsumerSummaryList[1].gradeMealTypeAvgAmount ? consumerAmountObj.campusMealTypeConsumerSummaryList[1].gradeMealTypeAvgAmount : '--'}}</view>
                    <view>{{consumerAmountObj.campusMealTypeConsumerSummaryList && consumerAmountObj.campusMealTypeConsumerSummaryList.length && consumerAmountObj.campusMealTypeConsumerSummaryList[1].schoolMealTypeAvgAmount ? consumerAmountObj.campusMealTypeConsumerSummaryList[1].schoolMealTypeAvgAmount : '--'}}</view>
                  </view>
                </view>
              </view>
              <view class="dotLine"></view>
              <view class="dotLine dotLine2"></view>
            </view>
            <view class="school-report-context-card-four-conclusion-meal">
              <view class="left">
                 <image :src="ImgUrl+'SchoolReport/costReportIMG21.png'" class="left"></image>
                 <view class="txt">晚餐</view>
              </view>
              <view class="right">
                <view class="firstLine">
                  <view class="firstCol">合计</view>
                  <view class="lastCol">
                    <view>{{consumerAmountObj.campusMealTypeConsumerSummaryList && consumerAmountObj.campusMealTypeConsumerSummaryList.length && consumerAmountObj.campusMealTypeConsumerSummaryList[2].mealTypeTotalAmount ? consumerAmountObj.campusMealTypeConsumerSummaryList[2].mealTypeTotalAmount : '--'}}</view>
                    <view>{{consumerAmountObj.campusMealTypeConsumerSummaryList && consumerAmountObj.campusMealTypeConsumerSummaryList.length && consumerAmountObj.campusMealTypeConsumerSummaryList[2].gradeMealTypeTotalAmount ? consumerAmountObj.campusMealTypeConsumerSummaryList[2].gradeMealTypeTotalAmount : '--'}}</view>
                    <view>{{consumerAmountObj.campusMealTypeConsumerSummaryList && consumerAmountObj.campusMealTypeConsumerSummaryList.length && consumerAmountObj.campusMealTypeConsumerSummaryList[2].schoolMealTypeTotalAmount ? consumerAmountObj.campusMealTypeConsumerSummaryList[2].schoolMealTypeTotalAmount : '--'}}</view>
                  </view>
                </view>
                <view class="secondLine">
                  <view class="firstCol">餐均</view>
                  <view  class="lastCol">
                    <view>{{consumerAmountObj.campusMealTypeConsumerSummaryList && consumerAmountObj.campusMealTypeConsumerSummaryList.length && consumerAmountObj.campusMealTypeConsumerSummaryList[2].mealTypeAvgAmount ? consumerAmountObj.campusMealTypeConsumerSummaryList[2].mealTypeAvgAmount : '--'}}</view>
                    <view>{{consumerAmountObj.campusMealTypeConsumerSummaryList && consumerAmountObj.campusMealTypeConsumerSummaryList.length && consumerAmountObj.campusMealTypeConsumerSummaryList[2].gradeMealTypeAvgAmount ? consumerAmountObj.campusMealTypeConsumerSummaryList[2].gradeMealTypeAvgAmount : '--'}}</view>
                    <view>{{consumerAmountObj.campusMealTypeConsumerSummaryList && consumerAmountObj.campusMealTypeConsumerSummaryList.length && consumerAmountObj.campusMealTypeConsumerSummaryList[2].schoolMealTypeAvgAmount ? consumerAmountObj.campusMealTypeConsumerSummaryList[2].schoolMealTypeAvgAmount : '--'}}</view>
                  </view>
                </view>
              </view>
              <view class="dotLine"></view>
              <view class="dotLine dotLine2"></view>
            </view>
            <view class="school-report-context-card-four-conclusion-meal otherMeal">
              <view class="left">
                 <image :src="ImgUrl+'SchoolReport/costReportIMG22.png'" class="left"></image>
                 <view class="txt">其他</view>
              </view>
              <view class="right">
                <view class="firstLine">
                  <view class="firstCol">合计</view>
                   <view class="lastCol">
                    <view>{{consumerAmountObj.campusMealTypeConsumerSummaryList && consumerAmountObj.campusMealTypeConsumerSummaryList.length && consumerAmountObj.campusMealTypeConsumerSummaryList[3].mealTypeTotalAmount ? consumerAmountObj.campusMealTypeConsumerSummaryList[3].mealTypeTotalAmount : '--'}}</view>
                    <view>{{consumerAmountObj.campusMealTypeConsumerSummaryList && consumerAmountObj.campusMealTypeConsumerSummaryList.length && consumerAmountObj.campusMealTypeConsumerSummaryList[3].gradeMealTypeTotalAmount ? consumerAmountObj.campusMealTypeConsumerSummaryList[3].gradeMealTypeTotalAmount : '--'}}</view>
                    <view>{{consumerAmountObj.campusMealTypeConsumerSummaryList && consumerAmountObj.campusMealTypeConsumerSummaryList.length && consumerAmountObj.campusMealTypeConsumerSummaryList[3].schoolMealTypeTotalAmount ? consumerAmountObj.campusMealTypeConsumerSummaryList[3].schoolMealTypeTotalAmount : '--'}}</view>
                  </view>
                </view>
              </view>
              <view class="dotLine"></view>
              <view class="dotLine dotLine2"></view>
            </view>
						<!-- <view class="consume-total-img">
							<view class="school-average" :style="{height:schoolAverageHeight+'rpx'}">
								<view class="school-average-num">
									<text>{{livingExpensesAllowance.schoolAverageAmount}}</text>
								</view>
								<view class="school-average-img">
									<image :src="ImgUrl+'SchoolReport/greenArrow.png'" mode=""></image>
								</view>
							</view>
							<view class="school-average last-month" :style="{height:gradeAverageHeight+'rpx'}">
								<view class="school-average-num">
									<text>{{livingExpensesAllowance.gradeAverageAmount}}</text>
								</view>
								<view class="school-average-img">
									<image :src="ImgUrl+'SchoolReport/greenArrow.png'" mode=""></image>
								</view>
							</view>
							<view class="user-consume" :style="{height:userConsumeHeight+'rpx'}">
								<view class="user-consume-num">
									<text>{{livingExpensesAllowance.userConsumeAmount}}</text>
								</view>
								<view class="user-consume-img">
									<image :src="ImgUrl+'SchoolReport/yellowArrow.png'" mode=""></image>
								</view>
							</view>
						</view>
						<view class="consume-total-img-des">
							<view class="consume-total-img-des-item" style="margin-left: 20rpx;">
								<text>上上{{['月','周'][reportTypeIndex]}}</text>
							</view>
							<view class="consume-total-img-des-item consume-des">
								<text>上{{['月','周'][reportTypeIndex]}}</text>
							</view>
							<view class="consume-total-img-des-item">
								<text>本{{['月','周'][reportTypeIndex]}}</text>
							</view>
						</view> -->
					</view>
          <!-- 就餐异常情况 -->
          <view v-show="tabIndex==1&&isOpen" class="school-report-context-card-two">  
            <!-- :style="{height:consumerDetailCalculateObj.totalData>0?'876rpx':'916rpx'}" -->
						<view class="school-report-context-card-title">
							<view class="school-report-context-card-title-img school-report-context-card-title-img2">
								<text></text>
							</view>
						</view>
            <view class="school-report-context-card-one-context-txt" v-if="cateringAbnormalGroupList.length">
                本{{['月','周'][reportTypeIndex]}}有<text class="txt-important"> {{cateringAbnormalGroupList.length}}</text>天存在就餐异常情况（<text class="txt-important">{{dateForStr}}</text>），请家长及时关注，多和孩子聊聊吧~
              </view>
            <view v-else class="school-report-context-card-one-context-txt">
							<text>暂无就餐异常情况，习惯很棒，要继续保持哦~</text>
						</view>
						<!-- <view class="school-report-context-card-two-conclusion"
							:style="{'margin-top': consumerDetailCalculateObj.totalData>0?'40rpx':''}">
							<view class="school-report-context-card-two-conclusion-txt">
								<text
									v-show="consumerDetailCalculateObj.totalData>0">本{{['月','周'][reportTypeIndex]}}共<text
										class="abnormal-days">{{diningSituations.notRepastDay}}</text>天未就餐</text>
							</view>
							<view class="school-report-context-card-two-conclusion-logo">
								<view class="school-report-context-card-two-conclusion-logo-item">
									<view class="school-report-context-card-two-conclusion-logo-item-dot">
									</view>
								</view>
								<view
									class="school-report-context-card-two-conclusion-logo-item school-report-context-card-two-conclusion-logo-item-right">
									<text>未就餐</text>
								</view>
							</view>
						</view> -->
						<view class="school-report-context-card-two-calendar">
							<van-calendar v-show="tabIndex==1" :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"
								  @select="dateSelect" />   <!--:style="{ height: '640rpx' }" -->
              <view class="zan"  v-if="!cateringAbnormalGroupList.length"><image :src="ImgUrl+'SchoolReport/costReportIMG27.png'" class="costReportIMG27"></image></view>
						</view>
            <view class="school-report-context-card-two-exception" v-if="cateringAbnormalGroupList_.length">
              <view class="space"><image :src="ImgUrl+'SchoolReport/costReportIMG23.png'" class="arrow"></image></view>
              <view class="exceptionContent" >
                <view v-for="group in cateringAbnormalGroupList_"
									:key="group.statisticalDate">
                <view class="date"><view class="dateBlock">{{diningSituations.diningSituationsDate}}</view></view>
                <view class="breakfast" v-if="group.zaoGroupInfo.isMessage">
                  <view>早餐</view>
                  <view class="mealtype"> 
                    <view class="firstLine"  v-if="group.zaoGroupInfo.unrecorded">
                      <image :src="ImgUrl+'SchoolReport/costReportIMG24.png'" class="img costReportIMG24"></image>
                      <view>无就餐记录</view>
                    </view>
                    <view class="firstLine"  v-if="group.zaoGroupInfo.abnormalTimeMessage">
                      <image :src="ImgUrl+'SchoolReport/costReportIMG25.png'" class="img costReportIMG25"></image>
                      <view>{{group.zaoGroupInfo.abnormalTimeMessage}}</view>
                    </view>
                     <view class="secondLine" v-for="item in group.zaoGroupInfo.abnormalTimeList"
														:key="item.abnormalTime">
                      <view>{{item.abnormalTime}}</view>
                      <view class="ml12">{{item.businessName}}</view>
                      <view class="ml16">{{item.abnormalMntStr}}</view>
                    </view>
                    <view class="firstLine"  v-if="group.zaoGroupInfo.abnormalMntMessage">
                      <image :src="ImgUrl+'SchoolReport/costReportIMG26.png'" class="img costReportIMG25"></image>
                      <view>{{group.zaoGroupInfo.abnormalMntMessage}}</view>
                    </view>
                     <view class="secondLine" v-for="money in group.zaoGroupInfo.abnormalMntList"
														:key="money.abnormalTime">
                      <view>{{money.abnormalTime}}</view>
                      <view class="ml12">{{money.businessName}}</view>
                      <view class="ml16">{{money.abnormalMntStr}}</view>
                    </view>
                    </view>
                  </view>
                <view class="breakfast" v-if="group.wuGroupInfo.isMessage">
                  <view>午餐</view>
                  <view class="mealtype"> 
                    <view class="firstLine"  v-if="group.wuGroupInfo.unrecorded">
                      <image :src="ImgUrl+'SchoolReport/costReportIMG24.png'" class="img costReportIMG24"></image>
                      <view>无就餐记录</view>
                    </view>
                    <view class="firstLine"  v-if="group.wuGroupInfo.abnormalTimeMessage">
                      <image :src="ImgUrl+'SchoolReport/costReportIMG25.png'" class="img costReportIMG25"></image>
                      <view>{{group.wuGroupInfo.abnormalTimeMessage}}</view>
                    </view>
                     <view class="secondLine" v-for="item in group.wuGroupInfo.abnormalTimeList"
														:key="item.abnormalTime">
                      <view>{{item.abnormalTime}}</view>
                      <view class="ml12">{{item.businessName}}</view>
                      <view class="ml16">{{item.abnormalMntStr}}</view>
                    </view>
                    <view class="firstLine"  v-if="group.wuGroupInfo.abnormalMntMessage">
                      <image :src="ImgUrl+'SchoolReport/costReportIMG26.png'" class="img costReportIMG25"></image>
                      <view>{{group.wuGroupInfo.abnormalMntMessage}}</view>
                    </view>
                     <view class="secondLine" v-for="money in group.wuGroupInfo.abnormalMntList"
														:key="money.abnormalTime">
                      <view>{{money.abnormalTime}}</view>
                      <view class="ml12">{{money.businessName}}</view>
                      <view class="ml16">{{money.abnormalMntStr}}</view>
                    </view>
                    </view>
                  </view>
                  <view class="breakfast" v-if="group.wanGroupInfo.isMessage">
                  <view>晚餐</view>
                  <view class="mealtype"> 
                    <view class="firstLine"  v-if="group.wanGroupInfo.unrecorded">
                      <image :src="ImgUrl+'SchoolReport/costReportIMG24.png'" class="img costReportIMG24"></image>
                      <view>无就餐记录</view>
                    </view>
                    <view class="firstLine"  v-if="group.wanGroupInfo.abnormalTimeMessage">
                      <image :src="ImgUrl+'SchoolReport/costReportIMG25.png'" class="img costReportIMG25"></image>
                      <view>{{group.wanGroupInfo.abnormalTimeMessage}}</view>
                    </view>
                     <view class="secondLine" v-for="item in group.wanGroupInfo.abnormalTimeList"
														:key="item.abnormalTime">
                      <view>{{item.abnormalTime}}</view>
                      <view class="ml12">{{item.businessName}}</view>
                      <view class="ml16">{{item.abnormalMntStr}}</view>
                    </view>
                    <view class="firstLine"  v-if="group.wanGroupInfo.abnormalMntMessage">
                      <image :src="ImgUrl+'SchoolReport/costReportIMG26.png'" class="img costReportIMG25"></image>
                      <view>{{group.wanGroupInfo.abnormalMntMessage}}</view>
                    </view>
                     <view class="secondLine" v-for="money in group.wanGroupInfo.abnormalMntList"
														:key="money.abnormalTime">
                      <view>{{money.abnormalTime}}</view>
                      <view class="ml12">{{money.businessName}}</view>
                      <view class="ml16">{{money.abnormalMntStr}}</view>
                    </view>
                    </view>
                  </view>
                </view>
                <view class="tips">
									<view class="what">
										<image :src="ImgUrl+'wechatXZF/question.png'" class="question">
											<view>什么是消费异常提醒？</view>
									</view>
									<view class="tipBlock">
										<view class="dotLine">在校消费超出学校建议范围时触发提醒，结果仅供参考：</view>
										<view class="dotLine">
											<view class="dot"></view>无就餐记录：餐别范围内无消费记录
										</view>
										<view class="dotLine">
											<view class="dot"></view>就餐时间异常：用餐时间早于/晚于学校的建议范围
										</view>
										<view class="dotLine">
											<view class="dot"></view>就餐金额提醒：餐别消费金额超出学校的建议范围
										</view>
									</view>
								</view>
              </view>
            </view>
						<!-- <view class="school-report-context-card-two-details">
							<view class="school-report-context-card-two-details-item">
								<view class="school-report-context-card-two-details-date">
									<text>{{diningSituations.diningSituationsDate}}</text>
								</view>
								<view class="school-report-context-card-two-details-meal">
									<view class="school-report-context-card-two-details-meal-txt">
										<text>早餐</text>
									</view>
									<view class="school-report-context-card-two-details-meal-logo">
										<view v-if="diningSituations.notRepastDetails.breakfastStatus==1"
											class="school-report-context-card-two-details-meal-img">
											<image :src="ImgUrl+'SchoolReport/eatted.png'" mode=""></image>
										</view>
										<view v-else-if="diningSituations.notRepastDetails.breakfastStatus==0"
											class="school-report-context-card-two-details-meal-noeat">
											<text>缺</text>
										</view>
									</view>
									<view class="school-report-context-card-two-details-meal-txt">
										<text>中餐</text>
									</view>
									<view
										class="school-report-context-card-two-details-meal-logo school-report-context-card-two-details-meal-logo-two">
										<view v-if="diningSituations.notRepastDetails.lunchStatus==1"
											class="school-report-context-card-two-details-meal-img">
											<image :src="ImgUrl+'SchoolReport/eatted.png'" mode=""></image>
										</view>
										<view v-else-if="diningSituations.notRepastDetails.lunchStatus==0"
											class="school-report-context-card-two-details-meal-noeat">
											<text>缺</text>
										</view>
									</view>
									<view class="school-report-context-card-two-details-meal-txt">
										<text>晚餐</text>
									</view>
									<view
										class="school-report-context-card-two-details-meal-logo school-report-context-card-two-details-meal-logo-three">
										<view v-if="diningSituations.notRepastDetails.supperStatus==1"
											class="school-report-context-card-two-details-meal-img">
											<image :src="ImgUrl+'SchoolReport/eatted.png'" mode=""></image>
										</view>
										<view v-else-if="diningSituations.notRepastDetails.supperStatus==0"
											class="school-report-context-card-two-details-meal-noeat">
											<text>缺</text>
										</view>
									</view>
								</view>
							</view>
						</view> -->
					</view>
          <!-- 消费偏好 -->
          <view class="school-report-context-card-three">
						<view class="school-report-context-card-title">
							<view class="school-report-context-card-title-img school-report-context-card-title-img3">
								<text></text>
							</view>
						</view>
						<view class="school-report-context-card-three-conclusion">
							<view class="school-report-context-card-three-conclusion-item"  v-if="consumerSummaryAmountOBj.canteenamount || consumerSummaryAmountOBj.superAndOtherAmount">
								<text>
									<!-- <text v-if="isEatLow">正餐消费占比<text
											class="school-report-context-card-three-conclusion-item-describe">过低</text>,请及时调整饮食习惯</text> -->
                  <text v-if="isEatLow">  食堂消费<text
											class="school-report-context-card-three-conclusion-item-describe"> {{consumerSummaryAmountOBj.canteenamount}} </text> 元，超市和其他场景消费 <text
											class="school-report-context-card-three-conclusion-item-describe">{{consumerSummaryAmountOBj.superAndOtherAmount}}</text>元。孩子在食堂消费<text
											class="school-report-context-card-three-conclusion-item-describe">占比过低</text>，要注意均衡饮食习惯哦~</text>
									<text v-else>食堂消费 <text
											class="school-report-context-card-three-conclusion-item-describe"> {{consumerSummaryAmountOBj.canteenamount}} </text> 元，超市和其他场景消费<text
											class="school-report-context-card-three-conclusion-item-describe"> {{consumerSummaryAmountOBj.superAndOtherAmount}}</text> 元。按时就餐均衡饮食，要继续保持哦~</text>
								</text>
								<!-- <text v-else>
									所选日期内暂无消费
								</text> -->
							</view>
              <view class="school-report-context-card-one-context-nodata" v-else>
								<view class="card-one-nodata-img">
									<image :src="ImgUrl+'SchoolReport/defaultnull.png'" mode=""></image>
								</view>
								<view class="card-one-nodata-txt">
									<text>孩子本{{['月','周'][reportTypeIndex]}}无消费记录</text>
								</view>
							</view>
						</view>
						<view id="consumer-preferences-pie" ref="consumer-preferences-pie" style="width: 100%; height: 205px;" v-if="consumerSummaryAmountOBj.canteenamount || consumerSummaryAmountOBj.superAndOtherAmount">
              &nbsp;
						</view>
					</view>
					<!-- 消费明细 -->
					<view v-show="tabIndex==1" class="school-report-context-card-eight"> <!--:style="{height:isOpen?'1431rpx':'882rpx'}" -->
						<view class="school-report-context-card-title">
							<view class="school-report-context-card-title-img school-report-context-card-title-img4">
								<text></text>
							</view>
						</view>
						<view class="school-report-context-card-eight-conclusion" v-if="consumerDetailCalculateObj.totalData>0">
							<view 
								class="school-report-context-card-eight-conclusion-item">
								<text>本{{['月','周'][reportTypeIndex]}}食堂<text
										class="txt-important">{{consumerDetailCalculateObj.canteenData}}</text>元，总消费<text
										class="txt-important">{{consumerDetailCalculateObj.totalData}}</text>元</text>
							</view>
							<!-- <view v-else
								class="school-report-context-card-eight-conclusion-item eight-conclusion-nodata">
								<text>所选日期内暂无消费</text>
							</view> -->
						</view>
            <view class="school-report-context-card-one-context-nodata" v-else style="padding-top: 118rpx; padding-bottom: 121rpx;">
								<view class="card-one-nodata-img">
									<image :src="ImgUrl+'SchoolReport/defaultnull.png'" mode=""></image>
								</view>
								<view class="card-one-nodata-txt">
									<text>孩子本{{['月','周'][reportTypeIndex]}}无消费记录</text>
								</view>
							</view>
						<view class="school-report-context-card-eight-details"  v-if="consumerDetailCalculateObj.totalData>0">
							<view class="consumer-details-header">
								<view v-for="(item,index) in consumerDetailsHeaderList" :key="index"
									class="consumer-details-header-item">
									<text>{{item}}</text>
								</view>
							</view>
							<view v-if="isOpen" class="consumer-details-body-box">
								<view v-for="(item,index) in campusConsumerDetailObj.campusConsumerDetailList"
									:key="index" class="consumer-details-body"
									:style="{background:Number.isInteger(index/2)?'#FFFFFF':'#F8F8F7'}">
									<view class="consumer-details-body-item" v-for="(e,i) in item.consumerDetailsArr"
										:class="i?'':'consumer-details-body-data'" :key="i">
										<text>{{e}}</text>
									</view>
								</view>
							</view>
							<view v-else class="consumer-details-body-box">
								<view class="consumer-details-body" style="background: #FFFFFF;">
									<view class="consumer-details-body-item"
										v-for="(e,i) in campusConsumerDetailObj.campusConsumerDetailList[0].consumerDetailsArr"
										:key="i" :class="i?'':'consumer-details-body-data'">
										<text>{{e}}</text>
									</view>
								</view>
								<view class="consumer-details-body" style="background: #F8F8F7;">
									<view class="consumer-details-body-item"
										v-for="(e,i) in campusConsumerDetailObj.campusConsumerDetailList[1].consumerDetailsArr"
										:key="i" :class="i?'':'consumer-details-body-data'">
										<text>{{e}}</text>
									</view>
								</view>
							</view>
							<view v-if="isOpen&&campusConsumerDetailObj.campusConsumerDetailList.length>7"
								class="consumer-details-body-notice-box">
								<view class="consumer-details-body-notice">
									<view class="consumer-details-body-notice-txt">
										<text>滑动查看更多</text>
									</view>
									<view class="consumer-details-body-notice-icon">
										<image :src="ImgUrl+'SchoolReport/slide.png'" mode=""></image>
									</view>
								</view>
							</view>
							<view style="height: 40rpx;"
								v-if="isOpen&&campusConsumerDetailObj.campusConsumerDetailList.length<=7">
							</view>
							<view
								v-for="(item,index) in campusConsumerDetailObj.campusConsumerDetailCalculateList"
								:key="index" class="consumer-details-sum">
								<view v-for="(e,i) in item.consumerDetailsSumArr" class="consumer-details-sum-item"
									:key="i" :class="i?'':'consumer-details-sum-type'">
									<text
										:style="{color:item.calculateType=='较上'?trendColorList[i]:'','font-size':item.calculateType=='较上'&&i!=0?'20rpx':''}">
										{{e}} </text>
									<template v-if="item.calculateType=='较上'&&i == 0">
										<span>{{['月','周'][reportTypeIndex]}}</span>
									</template>
									<template v-if="i == 0"><span
											class="type-unit">{{unitTypeList[index]}}</span></template>
								</view>
							</view>
						</view>
					</view>
					
					
					
					<!-- <view v-show="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>
							</view>
						</view>
						<view class="school-report-context-card-five-conclusion">
							<view v-if="consumerDetailCalculateObj.totalData>0"
								class="school-report-context-card-five-conclusion-item">
								<text v-if="isAbnormal"><text
										class="abnormal-date">{{consumerTrend.clues}}</text>的消费金额存在异常,请及时关注</text>
								<text v-else>每日消费金额较稳定，继续保持哦</text>
							</view>
							<view v-else
								class="school-report-context-card-five-conclusion-item card-five-conclusion-nodata">
								<text>所选日期内暂无消费</text>
							</view>
						</view>
						<view id="consumer-trend-line">
						</view>
						<view class="consumer-trend-line-icon">
							<view class="consumer-trend-line-icon-item">
								<view class="consumer-trend-line-icon-logo">
									<view class="consumer-trend-line-icon-logo-left">
									</view>
									<view class="consumer-trend-line-icon-logo-middle">
									</view>
									<view class="consumer-trend-line-icon-logo-right">
									</view>
								</view>
								<view class="consumer-trend-line-icon-txt">
									<text>消费金额</text>
								</view>
							</view>
						</view>
					</view> -->
					<!-- <view v-show="tabIndex==1&&isOpen" class="school-report-context-card-six">
						<view class="school-report-context-card-title">
							<view class="school-report-context-card-title-img">
								<text>就餐时间趋势</text>
							</view>
						</view>
						<view class="school-report-context-card-six-conclusion">
							<view class="school-report-context-card-six-conclusion-item">
								<text v-if="!abnormalStr">早、中、晚餐就餐时间较稳定，按时吃饭，自律如昔，你就赢了大多数人</text>
								<text v-else>
									<text class="abnormal-date">{{abnormalStr}}</text>的就餐时间跟同班同学相差超20分钟，如果快乐很难，那么按时吃饭
								</text>
							</view>
						</view>
						<view v-if="mealtypeArr.indexOf(1)!=-1" class="mealtime-trends">
							<view class="mealtime-trends-theme">
								<view class="meal-type">
									<text>早餐</text>
								</view>
								<view class="user-meal-time">
									<view class="user-meal-time-logo">
										<view class="user-meal-time-logo-left">
										</view>
										<view class="user-meal-time-logo-middle">
										</view>
										<view class="user-meal-time-logo-right">
										</view>
									</view>
									<view class="user-meal-time-txt">
										<text>就餐时间</text>
									</view>
								</view>
								<view class="class-meal-time">
									<view class="user-meal-time-logo">
										<view class="user-meal-time-logo-left" style="background: rgba(0, 0, 0, 0.5)">
										</view>
										<view class="user-meal-time-logo-middle"
											style="border: 3rpx solid rgba(0, 0, 0, 0.5)">
										</view>
										<view class="user-meal-time-logo-right" style="background: rgba(0, 0, 0, 0.5)">
										</view>
									</view>
									<view class="user-meal-time-txt">
										<text>班级集中就餐时间</text>
									</view>
								</view>
							</view>
						</view>
						<view v-if="mealtypeArr.indexOf(1)!=-1" id="breakfast-time-line">
						</view>
						<view v-if="mealtypeArr.indexOf(2)!=-1" class="mealtime-trends"
							style="position: relative;top:-134rpx">
							<view class="mealtime-trends-theme">
								<view class="meal-type">
									<text>中餐</text>
								</view>
								<view class="user-meal-time">
									<view class="user-meal-time-logo">
										<view class="user-meal-time-logo-left">
										</view>
										<view class="user-meal-time-logo-middle">
										</view>
										<view class="user-meal-time-logo-right">
										</view>
									</view>
									<view class="user-meal-time-txt">
										<text>就餐时间</text>
									</view>
								</view>
								<view class="class-meal-time">
									<view class="user-meal-time-logo">
										<view class="user-meal-time-logo-left" style="background: rgba(0, 0, 0, 0.5)">
										</view>
										<view class="user-meal-time-logo-middle"
											style="border: 3rpx solid rgba(0, 0, 0, 0.5)">
										</view>
										<view class="user-meal-time-logo-right" style="background: rgba(0, 0, 0, 0.5)">
										</view>
									</view>
									<view class="user-meal-time-txt">
										<text>班级集中就餐时间</text>
									</view>
								</view>
							</view>
						</view>
						<view v-if="mealtypeArr.indexOf(2)!=-1" id="lunch-time-line">
						</view>
						<view v-if="mealtypeArr.indexOf(3)!=-1" class="mealtime-trends"
							style="position: relative;top:-286rpx">
							<view class="mealtime-trends-theme">
								<view class="meal-type">
									<text>晚餐</text>
								</view>
								<view class="user-meal-time">
									<view class="user-meal-time-logo">
										<view class="user-meal-time-logo-left">
										</view>
										<view class="user-meal-time-logo-middle">
										</view>
										<view class="user-meal-time-logo-right">
										</view>
									</view>
									<view class="user-meal-time-txt">
										<text>就餐时间</text>
									</view>
								</view>
								<view class="class-meal-time">
									<view class="user-meal-time-logo">
										<view class="user-meal-time-logo-left" style="background: rgba(0, 0, 0, 0.5)">
										</view>
										<view class="user-meal-time-logo-middle"
											style="border: 3rpx solid rgba(0, 0, 0, 0.5)">
										</view>
										<view class="user-meal-time-logo-right" style="background: rgba(0, 0, 0, 0.5)">
										</view>
									</view>
									<view class="user-meal-time-txt">
										<text>班级集中就餐时间</text>
									</view>
								</view>
							</view>
						</view>
						<view v-if="mealtypeArr.indexOf(3)!=-1" id="dinner-time-line">
						</view>
					</view>
					<view v-show="tabIndex==1&&isOpen" class="school-report-context-card-seven">
						<view class="school-report-context-card-title">
							<view class="school-report-context-card-title-img">
								<text>饭友分析</text>
							</view>
						</view>
						<view class="school-report-context-card-seven-conclusion">
							<view class="school-report-context-card-seven-conclusion-item">
								<text v-if="!mealPalArr.length">
									独立的<text class="abnormal-date">{{userInfo.userName}}</text>很棒，偶尔也可以叫上朋友一起吃饭哦</text>
								</text>
								<text v-else-if="mealPalArr.length==1">
									最佳饭友非<text class="abnormal-date">{{mealPalStr}}</text>莫属，有饭友吃嘛嘛香</text>
								</text>
								<text v-else>
									最佳干饭组合，赶快叫上<text class="abnormal-date">{{mealPalStr}}</text>一起吃饭吧</text>
								</text>
							</view>
						</view>
						<view class="meal-pal-bar-unit">
							<view class="meal-pal-bar-unit-item">
								<view class="meal-pal-bar-icon">
								</view>
								<view class="meal-pal-bar-txt">
									<text>一起就餐天数</text>
								</view>
							</view>
						</view>
						<view id="meal-pal-bar">
						</view>
					</view> -->
					<!-- 出入校报告 -->
					<!-- <view v-show="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 v-if="attendanceReport.abnormalNum!=-1">本{{['月','周'][reportTypeIndex]}}共<text
										class="abnormal-days">{{attendanceReport.abnormalNum}}</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 v-show="tabIndex==2" :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>
									<span v-if="item.topInfo=='冠军'" class="mark-yellow">冠军</span>
									<span v-if="item.topInfo=='进步'" class="mark-yellow">进步</span>
								</template>
							</van-calendar>
						</view>
					</view>
					<view v-if="tabIndex==2&&isAttendanceOpen" class="attendance-report-context-details"
						:style="{height:attendanceReportDatail.length?858:620+'rpx',overflow:attendanceReportDatail.length?'scroll':'none',top:attendanceReportDatail.length?-30:0+'rpx'}">
						<view v-for="(detailItem,detailIndex) in attendanceReportDatail" :key="detailIndex">
							<view v-if="detailItem.attendIntervalType&&detailItem.attendIntervalType!=-1"
								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>{{detailItem.attendIntervalName}}</text>
										</view>
									</view>
									<view v-if="detailIndex==0" class="attendance-report-context-card-two-details-date">
										<text>{{attendanceSituations.attendanceDate}}</text>
									</view>
								</view>
							</view>
							<view v-else-if="detailItem.attendIntervalType==-1"
								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>
									<view class="attendance-report-context-card-two-details-date">
										<text>{{attendanceSituations.attendanceDate}}</text>
									</view>
								</view>
							</view>
							<view v-if="attendanceReportDatail.length" class="attendance-report-context-card-three">
								<view v-for="(item,index) in detailItem.attendDetailReportDTOList" :key="index">
									<view class="attendance-report-details">
										<view class="dashed-line-box">
											<view v-if="index" class="dashed-line">
											</view>
											<view v-else class="dashed-line-first">
											</view>
											<view v-if="index" class="attendance-report-dot"
												:style="{border:item.border}">
											</view>
											<view v-else class="attendance-report-dot-first"
												:style="{border:item.border}">
											</view>
										</view>
										<view class="attendance-report-details-item-box"
											:style="{top: 18+index*170+'rpx'}">
											<view class="attendance-report-details-item">
												<view class="attendance-report-time">
													<view class="attendance-report-time-txt">
														<text>{{item.iotTypeName}}</text>
													</view>
													<view class="attendance-report-time-item">
														<text>{{item.timeContent}}</text>
													</view>
													<view v-if="item.describeContent=='当日早到冠军'" class="early-champions">
														<view class="early-champions-img">
														</view>
														<view class="early-champions-txt">
															<text>早到冠军</text>
														</view>
													</view>
													<view v-else-if="item.describeContent=='非常不错哦，比昨天早到'"
														class="early-champions" style="width: 368rpx">
														<view class="progress-img">
														</view>
														<view class="early-champions-txt">
															<text>非常不错哦，比昨天早到</text>
														</view>
													</view>
												</view>
												<view class="attendance-report-time-details">
													<view
														v-if="item.describeContent!='当日早到冠军'&&item.describeContent!='非常不错哦，比昨天早到'"
														class="attendance-report-time-details-item">
														<text>{{item.describeContent}}</text>
													</view>
													<view class="attendance-report-time-details-icon">
													</view>
												</view>
											</view>
											<view class="attendance-report-details-img-item">
												<view class="attendance-report-details-img-box">
													<image v-if="item.attendImage" :src="item.attendImage" mode=""
														@click="imageClick(item.attendImage)">
													</image>
												</view>
											</view>
										</view>
									</view>
								</view>
							</view>
						</view>
						<view v-if="!attendanceReportDatail.length" class="noAttendanceReportDatail">
							<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>
									<view class="attendance-report-context-card-two-details-date">
										<text>{{attendanceSituations.attendanceDate}}</text>
									</view>
								</view>
							</view>
							<view class="noAttendanceReportDatailImg">
							</view>
						</view>
					</view>
					<van-dialog v-model="imageDialogShow" width="620rpx">
						<view class="image-dialog">
							<image :src="imageDialogSrc" mode=""></image>
						</view>
					</van-dialog> -->
					<!-- 公话报告 -->
					<!-- <view v-show="tabIndex==3" class="pubTalk-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="call-number-bar-unit">
							<text>（次）</text>
						</view>
						<view id="call-number-bar">
						</view>
					</view>
					<view v-show="tabIndex==3&&isPubTalkOpen" class="pubTalk-report-context-card-three">
						<view class="school-report-context-card-title">
							<view class="school-report-context-card-title-img">
								<text>通话时长</text>
							</view>
						</view>
						<view class="call-duration-bar-unit">
							<text>（min）</text>
						</view>
						<view id="call-duration-bar">
						</view>
					</view>
					<view v-show="tabIndex==3&&isPubTalkOpen" class="pubTalk-report-context-card-four">
						<view class="school-report-context-card-title">
							<view class="school-report-context-card-title-img">
								<text>亲子留言</text>
							</view>
						</view>
						<view class="leave-message-summary" v-if="pubTalkReport.messageText1">
							<text><text class="txt-important">{{pubTalkReport.messageText1}}</text> 最喜欢和你留言，共 <text
									class="txt-important">{{pubTalkReport.messageText2}}</text> 次，超过全校<text
									class="txt-important">{{pubTalkReport.messageText3}}</text>的同学</text>
						</view>
						<view class="leave-message-summary" v-else>
							<text class="txt-important">想家人了可以多多留言哦~</text>
						</view>
						<view class="leave-message-summary leave-message-less-summary"
							v-if="pubTalkReport.messageText4">
							<text><text class="txt-important">{{pubTalkReport.messageText4}}</text> 留言最少，共 <text
									class="txt-important">{{pubTalkReport.messageText5}}</text> 次，超过全校<text
									class="txt-important">{{pubTalkReport.messageText6}}</text>的同学</text>
						</view>
						<view class="leave-message-bar-unit">
							<text>（次）</text>
						</view>
						<view id="leave-message-bar">
						</view>
					</view> -->
					<view v-if="tabIndex&&flag!=tabIndex" class="school-report-footer">
						<view class="school-report-footer-item">
							<view class="school-report-footer-item-txt">
								<text>到期后将无法查看完整报告</text>
							</view>
							<view class="school-report-validity">
								<text>有效期至<text class="validity-date">{{memberInfo.invalidDateStr}}</text>,剩余<text
										class="validity-date">{{memberInfo.differDay}}</text>天</text>
							</view>
						</view>
						<view class="school-report-footer-item-two">
							<view class="school-report-footer-item-btn" @tap="openAzMenber" v-if="from == 'wechat'">
								<text>延长权益</text>
							</view>
              <view class="school-report-footer-item-btn" @tap="openAzMenber_" v-else-if="from == 'alipay'">
								<text>延长权益</text>
							</view>
						</view>
					</view>
				</view>
			</view>
			<!-- <view v-if="tabIndex&&flag==tabIndex" class="no-open"
				:style="{height:[860,845,891][tabIndex-1]+'rpx',top:[1426,1099,pubTalkNoopenHeight][tabIndex-1]+'rpx'}">
				<view class="no-open-solution" @tap="equityPay">
					<view class="no-open-solution-txt">
						<!-- <text>最低{{memberInfo.leastAmount}}元/天开通，查看完整{{['消费','出入校','公话'][tabIndex-1]}}报告</text> >
					    <text>开通消费服务，查看完整消费报告</text>
					</view>
					<view class="no-open-solution-item">
					</view>
				</view>
				<view class="open-results">
					<!-- 消费报告 >
					<view v-if="tabIndex==1" class="open-results-title consume-open-results-title">
						<text>开通后，掌握消费动态、更省心</text>
					</view>
					<view v-else class="open-results-title">
						<text>开通后，你将解锁</text>
					</view>
					<view class="open-results-items" :class="tabIndex==1?'consume-open-results-items':''">
						<view v-if="tabIndex==2||tabIndex==3" class="open-results-items-summary">
							<view class="summary-item">
								<text>{{['实时推送','音视频通话'][tabIndex-2]}}</text>
							</view>
							<view class="summary-item-icon"
								:class="['attendance-report-icon','pubTalk-report-icon'][tabIndex-2]">
								<text>+</text>
							</view>
							<view class="summary-item">
								<text>{{['月','周'][reportTypeIndex]}}{{['度出入校报告','度公话报告'][tabIndex-2]}}</text>
							</view>
						</view>
						<!-- 消费报告 >
						<view v-if="tabIndex==1" class="consume-open-results-items-details">
							<view class="consume-open-results-items-details-item">
								<view class="details-item-left">
									<view class="details-item-up">
										<text>孩子是否缺餐？</text>
									</view>
									<view class="details-item-down">
										<view class="dining-situations-img">
										</view>
										<view class="details-item-down-txt">
											<text>【就餐情况】告诉你</text>
										</view>
									</view>
								</view>
								<view class="details-item-left">
									<view class="details-item-up">
										<text>钱花哪里了？</text>
									</view>
									<view class="details-item-down">
										<view class="consumer-trend-img">
										</view>
										<view class="details-item-down-txt">
											<text>【消费明细】告诉你</text>
										</view>
									</view>
								</view>
								<!-- <view class="details-item-left">
									<view class="details-item-up">
										<text>孩子在校交友了？</text>
									</view>
									<view class="details-item-down">
										<view class="meal-pal-img">
										</view>
										<view class="details-item-down-txt">
											<text>【饭友分析】告诉你</text>
										</view>
									</view>
								</view> >
							</view>
							<view class="consume-open-results-items-details-item">
								<view class="details-item-left">
									<view class="details-item-up">
										<text>消费偏高还是偏低？</text>
									</view>
									<view class="details-item-down">
										<view class="consumer-num-img">
										</view>
										<view class="details-item-down-txt">
											<text>【生活费额度】直观看</text>
										</view>
									</view>
								</view>
								<view class="details-item-left">
									<view class="details-item-up">
										<text>孩子正餐超市消费多？</text>
									</view>
									<view class="details-item-down">
										<view class="consumer-preference-img">
										</view>
										<view class="details-item-down-txt">
											<text>【消费偏好】直观看</text>
										</view>
									</view>
								</view>
							</view>
							<!-- <view class="consume-open-results-items-details-item">
								<view class="details-item-left">
									<view class="details-item-up">
										<text>担心孩子被迫高额消费？</text>
									</view>
									<view class="details-item-down">
										<view class="consumer-trend-img">
										</view>
										<view class="details-item-down-txt">
											<text>【消费趋势】告诉你</text>
										</view>
									</view>
								</view>
								<view class="details-item-left">
									<view class="details-item-up">
										<text>孩子是否准时就餐？</text>
									</view>
									<view class="details-item-down">
										<view class="time-trends-img">
										</view>
										<view class="details-item-down-txt">
											<text>【就餐时间趋势】告诉你</text>
										</view>
									</view>
								</view>
							</view> >
						</view>
						<view v-else class="open-results-items-details">
							<!-- 出入校报告 >
							<view v-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> -->
		</view>
		<view v-else class="nodata" @click="nodataClick">
			<view class="nodataImg">
				<img style="width: 100%" :src="ImgUrl+'images/purchaseChart.gif'" />
			</view>
			<view class="nodataTxt">
				<text>当前为使用高峰期，请稍后再试</text>
			</view>
		</view>
		</template>
		<template v-else>
			<view class="costReport">
				<image :src="ImgUrl+'SchoolReport/costReport1.png'" class="costReportIMG1"></image>
				<image :src="ImgUrl+'SchoolReport/costReportIMG2.png'" class="costReportIMG2"></image>
				<image :src="ImgUrl+'SchoolReport/costReportIMG3.png'" class="costReportIMG3"></image>
				<image :src="ImgUrl+'SchoolReport/costReportIMG4.png'" class="costReportIMG4"></image>
				<image :src="ImgUrl+'SchoolReport/costReportIMG5.png'" class="costReportIMG5"></image>
				<image :src="ImgUrl+'SchoolReport/costReportIMG6.png'" class="costReportIMG6"></image>
			</view>
		</template>		
		<van-dialog v-model="dialogShow" :showConfirmButton="false" close-on-click-overlay
			style="width: 90%;background: linear-gradient(225deg, #0ADD80 0%, #04B871 100%);margin: 100rpx 0 0;">
			<view class="htmlCanvasTxt">
				<view class="htmlCanvasTxt1">
					<text>长按下方图片分享</text>
				</view>
				<view class="htmlCanvasTxt2">
					<text>您可以分享给好友，或者保存到手机</text>
				</view>
			</view>
			<view class="htmlCanvasBox">
				<view class="htmlCanvas" id="htmlCanvas" ref="imgCanvas">
				</view>
			</view>
		</van-dialog>
	</view>
	</view>
</template>

<script>
// 在H5页面中
if (window.AlipayJSBridge) {
  AlipayJSBridge.call("onBackPressed", {
    // 回调函数
    onBackPressed: function () {
      // 处理返回事件
      console.log("用户点击了返回按钮");
      my.navigateTo({
        url: "/pages/home/home",
      });
      // 可以选择直接关闭当前页面
      // AlipayJSBridge.call('closeWebview');
    },
  });
}
import { requestPost } from "../ApplyConsumption/common/request.js";
var gHost = "https://" + window.location.host;
var envVersion = "release";
var azAppId = "wx5decb3fc29c94953";
if (window.location.protocol != "https:") {
  gHost = "https://uat-pay.xiaopay.net";
  envVersion = "trial";
  azAppId = "wx008a4a07f3d9f7a7";
}
let az_gHost = "https://" + window.location.host;
if (window.location.protocol != "https:") {
  az_gHost = "https://uat-az-cloud-api.xiaopay.net";
  envVersion = "trial";
  azAppId = "wx008a4a07f3d9f7a7";
}
if (window.location.host == "fpdev.xiaopay.net") {
  az_gHost = "https://dev-az-cloud-api.xiaopay.net";
  envVersion = "trial";
  azAppId = "wx008a4a07f3d9f7a7";
}
if (
  window.location.host == "uat.xiaopay.net" ||
  window.location.host == "uat-pay.xiaopay.net"
) {
  az_gHost = "https://uat-az-cloud-api.xiaopay.net";
  envVersion = "trial";
  azAppId = "wx008a4a07f3d9f7a7";
}
if (window.location.host == "pay.xiaopay.net") {
  az_gHost = "https://az-cloud-api.xiaopay.net";
  envVersion = "release";
  azAppId = "wx5decb3fc29c94953";
}
//获取参数
function getQueryParams(params) {
  let href = window.location.href;
  let query = href.substring(href.indexOf("?") + 1);
  let vars = query.split("&");
  for (var i = 0; i < vars.length; i++) {
    let pair = vars[i].split("=");
    if (pair[0] == params) {
      return pair[1];
    }
  }
  return false;
}
// 时间处理模块
import dayjs from "dayjs";
import moment from "moment";
export default {
  name: "SchoolReport",
  data() {
    return {
      // 消费偏好对象
      consumerSummaryAmountOBj: {},
      ImgUrl: this.$ImgUrl,
      showReport: true,
      nodataImgUrl: this.$ImgUrl,
      userInfo: {},
      reportTypeIndex: 0,
      reportTypeArr: ["月报", "周报"],
      dataRangeIndex: 0,
      dataRangeArr: [
        {
          week: "",
          weekstr: "",
          startDate: "",
          endDate: "",
        },
      ],
      minDate: new Date("1970/01/01"),
      maxDate: new Date(),
      imgUrl: "", // 存储base64图片
      dialogShow: false,
      tabIndex: 0,
      // 消费明细
      campusConsumerDetailObj: {
        campusConsumerDetailList: [],
        campusConsumerDetailCalculateList: [],
      },
      consumerDetailsHeaderList: [
        "日期",
        "早餐",
        "午餐",
        "晚餐",
        "其他",
        "合计",
      ],
      consumerDetailCalculateObj: {
        canteenData: "", // 食堂消费
        totalData: "", // 总消费
        cateringNumber: "", // 就餐次数
        notCateringNumber: "", //未就餐次数
      },
      trendColorList: [],
      unitTypeList: ["(次)", "(次)", "(元)", "", "(元)"],
      // 就餐情况
      diningSituations: {
        diningSituationsDate: "",
        diningSituationsRequestDate: "",
        notRepastDay: "",
        notRepastDetails: {},
        notRepastDetailsDTOS: [],
        cateringLevel: "",
        notCateringNumber: "",
        notCateringType: "",
      },
      // 消费偏好
      pieDatas: [],
      isEatLow: false,
      // 生活费额度
      livingExpensesAllowance: {
        lastMonthRateStr: "",
        lastMonthRate: "",
        userConsumeAmount: "", //本月
        gradeAverageAmount: "", //上月
        schoolAverageAmount: "", //上上月
      },
      consumerAmountObj: [],
      isReasonable: false,
      schoolAverageHeight: "",
      userConsumeHeight: "",
      gradeAverageHeight: "",
      // 消费趋势
      consumerTrend: {},
      isAbnormal: false,
      lineDatas: [],
      // 饭友分析
      mealPalData: [],
      mealPalArr: [],
      mealPalStr: "",
      // 就餐时间趋势
      breakfastAbnormalStr: "",
      lunchAbnormalStr: "",
      dinnerAbnormalStr: "",
      mealtypeArr: [],
      mealtimeTrendsData: [],
      // 出入校报告数据
      attendanceSituations: {
        attendanceDate: "",
        abnomalDateList: [],
      },
      imageDialogShow: false,
      imageDialogSrc: "",
      // 公话报告数据
      pubTalkReport: {
        // 通话次数
        callNumberInfoList: [],
        // 通话时长
        callDurationInfoList: [],
        // 亲子留言
        leaveMessageInfoList: [],
      },
      // 出入校报告数据
      attendanceReport: {
        abnormalNum: 0,
        abnomalDateList: [],
      },
      attendanceReportDatail: [],
      // 会员信息
      queryMemberServcieItemList: [],
      // 消费
      isOpen: true,
      isService: false,
      // 出入校
      isAttendanceOpen: false,
      isAttendanceService: false,
      // 公话
      isPubTalkOpen: false,
      isPubTalkService: false,
      flag: 0,
      memberInfo: {
        leastAmount: "",
        invalidDateStr: "",
        differDay: "",
      },
      containerHeight: "",
      pubTalkSummaryHeight: 275,
      pubTalkNoopenHeight: 1260,
      isnodataClick: false,
      auth: false, // 消费报告  用户鉴权
      cateringAbnormalGroupList: [], //就餐异常列表
      cateringAbnormalGroupList_: [], // 当日就餐异常列表
      dateForStr: "",
      from: "wechat",
      homeDataInfo: {},
      usertype: "",
    };
  },
  computed: {
    abnormalStr() {
      if (this.mealtypeArr.length) {
        var breakfastAbnormalStr = this.mealtimeAbnormalDate(1);
        var lunchAbnormalStr = this.mealtimeAbnormalDate(2);
        var dinnerAbnormalStr = this.mealtimeAbnormalDate(3);
        var str1 = breakfastAbnormalStr ? breakfastAbnormalStr + "早餐" : "";
        var str2 = lunchAbnormalStr ? lunchAbnormalStr + "中餐" : "";
        var str3 = dinnerAbnormalStr ? dinnerAbnormalStr + "晚餐" : "";
        var str = str1
          ? str1 +
            (str2
              ? "、" + str2 + (str3 ? "、" + str3 : "")
              : str3
              ? "、" + str3
              : "")
          : str2
          ? str2 + (str3 ? "、" + str3 : "")
          : str3
          ? str3
          : "";
      } else {
        var str = "";
      }
      return str;
    },
  },
  async mounted() {
    await this.init();
  },
  methods: {
    async init() {
      const self = this;
      // 消费报告用户鉴权
      this.homeDataInfo = JSON.parse(sessionStorage.getItem("HomeDataInfo"));
      this.auth = getQueryParams("auth");
      this.from = getQueryParams("from") || "wechat";
      this.usertype = getQueryParams("userType");
      console.log(
        this.auth == "false",
        "个人用户鉴权",
        this.from,
        this.homeDataInfo,
        "aaaaaa",
        this.usertype
      );
      if (this.isPeakPeriod() && !this.isnodataClick) {
        this.showReport = false;
        return;
      }
      this.showReport = true;
      // 有无消费报告入口
      //   if (new Date().getTime() <= new Date("2022/06/30").getTime()) {
      //     this.isService = true;
      //   } else {
      //     this.queryMemberServcieItem().then(() => {
      //       if (this.queryMemberServcieItemList.length) {
      //         this.isService =
      //           this.queryMemberServcieItemList.indexOf(1002) == -1
      //             ? false
      //             : true;
      //       }
      //     });
      //   }
      // 有无进出校、公话入口
      //   this.queryMemberServcieItem().then(() => {
      //     if (this.queryMemberServcieItemList.length) {
      //       this.isAttendanceService =
      //         this.queryMemberServcieItemList.indexOf(3002) == -1 ? false : true;
      //       this.isPubTalkService =
      //         this.queryMemberServcieItemList.indexOf(2002) == -1 ? false : true;
      //     }
      //   });
      // 消费报告
      //   this.queryIsDredgeMember(1002).then(() => {
      // if (this.isOpen) {
      // if (true) {
      if (this.from == "alipay") {
        // 支付宝消费会员到期日
        await this.QueryProductContractItemDetailResp();
        console.log(this.memberInfo, "this.memberInfo");
      } else {
        // 微信消费会员到期日
        await this.queryMemberValidTime(1002);
      }
      // this.queryConsumerSummaryAmount(1).then(()=>{
      //   self.piechart();
      // });
      // this.$nextTick(() => {
      //   self.piechart();
      // });
      if (
        new Date(this.memberInfo.invalidDate).getTime() <=
        new Date("2022/06/30").getTime()
      ) {
        this.flag = 0;
        this.tabIndex = 1;
        this.memberInfo.invalidDateStr = "2022年6月30日";
        this.memberInfo.differDay =
          dayjs("2022/06/30").diff(dayjs(), "day") + 1;
        this.containerHeight = 4200;
      } else {
        this.tabIndex = 1;
      }

      let tmpArr = [];
      // 获取时间
      for (let i = 1; i <= 11; i++) {
        let startWeek = dayjs().subtract(i, "month").startOf("month");
        let endWeek =
          dayjs().$d.getTime() >
          dayjs().subtract(i, "month").endOf("month").$d.getTime()
            ? dayjs().subtract(i, "month").endOf("month")
            : dayjs();
        tmpArr.push({
          week:
            startWeek.format("YYYY/MM/DD") + "~" + endWeek.format("YYYY/MM/DD"),
          weekstr: startWeek.format("MM/DD") + "~" + endWeek.format("MM/DD"),
          startDate: startWeek.format("YYYY-MM-DD"),
          endDate: endWeek.format("YYYY-MM-DD"),
        });
      }
      this.dataRangeArr = tmpArr;
      this.minDate = new Date(this.dataRangeArr[this.dataRangeIndex].startDate);
      this.maxDate = new Date(this.dataRangeArr[this.dataRangeIndex].endDate);
      this.diningSituations.diningSituationsRequestDate =
        this.dataRangeArr[this.dataRangeIndex].startDate;
      this.diningSituations.diningSituationsDate = this.formatDate(
        this.minDate
      );
      this.queryConsumerSummaryAmount(1).then(() => {
        self.piechart();
      });

      this.queryLivingCostsAmount();
      // this.queryDayConsumerTrend(1).then((e) =>
      //   // this.linechart(this.reportTypeIndex)
      // );
      this.queryDayConsumerTrend();
      this.queryNotRepastDetails(
        this.dataRangeArr[this.dataRangeIndex].startDate,
        this.dataRangeArr[this.dataRangeIndex].endDate
      ).then(() => {
        if (this.diningSituations.notRepastDetailsDTOS) {
          let today = this.diningSituations.notRepastDetailsDTOS.filter(
            (e) => e.repastDate === tmpDate
          )[0];
          this.diningSituations.notRepastDetails = today;
        } else {
          this.diningSituations.notRepastDetails = {};
        }
      });
      await this.getCateringAbnormalGroupList();
      let arr = this.cateringAbnormalGroupList;
      let str = "";
      arr.forEach((x) => {
        let date = moment(x.date).format("M.D");
        str = str + date + ",";
      });
      str = str.substring(0, str.length - 1);
      this.dateForStr = str;
      console.log(this.cateringAbnormalGroupList, "bbbbbbbbbbbbbbbbbbbbbbb");
      this.attendanceSituations.attendanceDate = this.formatDate(this.minDate);
      // 查询用户信息
      this.queryCampusStudentInfo();
      let tmpDate = this.formatDateTwo(this.minDate);
      // 查询消费明细
      this.queryConsumerDetail(
        this.dataRangeArr[this.dataRangeIndex].startDate,
        this.dataRangeArr[this.dataRangeIndex].endDate
      );
      //   if (this.isPubTalkService) {
      //     this.getPubTalkReport();
      //   }
    },
    // 当天11：00 ~ 13：00属于高峰期
    isPeakPeriod() {
      let first = this.timeIn("11:00:00", "11:01:00");
      return first;
    },
    nodataClick: function () {
      this.isnodataClick = true;
      this.init();
    },
    /*在某段时间内*/
    timeIn(s, e) {
      let t = moment().format("YYYY-MM-DD");
      if (
        moment(t + " " + s).diff(moment()) < 0 &&
        moment(t + " " + e).diff(moment()) > 0
      ) {
        return true;
      }
      return false;
    },
    tabTap: function (num) {
      this.tabIndex = num;
      this.tabTapHandler(this.tabIndex);
    },
    tabTapHandler: async function (num, flag) {
      let self = this;
      this.minDate = new Date(this.dataRangeArr[this.dataRangeIndex].startDate);
      this.maxDate = new Date(this.dataRangeArr[this.dataRangeIndex].endDate);
      if (num == 1) {
        // await this.queryConsumerSummaryAmount(1);
        // this.$nextTick(() => {
        //   self.piechart();
        // });
        await this.getCateringAbnormalGroupList();
        this.diningSituations.diningSituationsDate = this.formatDate(
          this.minDate
        );
        this.cateringAbnormalGroupList_ = [];
        if (this.cateringAbnormalGroupList.length) {
          console.log(
            this.cateringAbnormalGroupList,
            "ddddddddddddddddddddddddddddd"
          );
          let arr = this.cateringAbnormalGroupList;
          this.cateringAbnormalGroupList_ = arr.filter(
            (x) =>
              x.statisticalDate ==
              self.dataRangeArr[self.dataRangeIndex].startDate
          );
          let str = "";
          arr.forEach((x) => {
            let date = moment(x.date).format("M.D");
            str = str + date + ",";
          });
          str = str.substring(0, str.length - 1);
          this.dateForStr = str;
        }
        this.diningSituations.diningSituationsRequestDate =
          this.dataRangeArr[this.dataRangeIndex].startDate;
        let tmpDate = this.formatDateTwo(this.minDate);
        this.queryConsumerDetail(
          this.dataRangeArr[this.dataRangeIndex].startDate,
          this.dataRangeArr[this.dataRangeIndex].endDate
        );
        this.queryConsumerSummaryAmount(1).then(() => {
          self.piechart();
        });
        // this.queryConsumerSummaryAmount();
        // this.queryIsDredgeMember(1002, 1).then(() => {
        //   if (this.isOpen) {
        // if (true) {

        this.queryLivingCostsAmount();
        // this.queryDayConsumerTrend(1).then((e) =>
        //   // this.linechart(this.reportTypeIndex)
        // );
        this.queryDayConsumerTrend();
        this.queryNotRepastDetails(
          this.dataRangeArr[this.dataRangeIndex].startDate,
          this.dataRangeArr[this.dataRangeIndex].endDate
        ).then(() => {
          if (this.diningSituations.notRepastDetailsDTOS) {
            let today = this.diningSituations.notRepastDetailsDTOS.filter(
              (e) => e.repastDate === tmpDate
            )[0];
            this.diningSituations.notRepastDetails = today;
          } else {
            this.diningSituations.notRepastDetails = {};
          }
        });
        // this.queryMealPalAnalyse().then(() => this.mealPalBarchart());
        // this.queryRepastTimeTrend().then(() => {
        // 	if (this.mealtypeArr.indexOf(1) != -1) {
        // 		this.breakfastTimeLinechart(this.reportTypeIndex,
        // 			'breakfast-time-line',
        // 			1);
        // 	}
        // 	if (this.mealtypeArr.indexOf(2) != -1) {
        // 		this.breakfastTimeLinechart(this.reportTypeIndex,
        // 			'lunch-time-line',
        // 			2);
        // 	}
        // 	if (this.mealtypeArr.indexOf(3) != -1) {
        // 		this.breakfastTimeLinechart(this.reportTypeIndex,
        // 			'dinner-time-line',
        // 			3);
        // 	}
        // })
        // } else {
        //   this.queryConsumerSummaryAmount();
        //   this.queryDayConsumerTrend();
        // }
        // });
      } else if (num == 2) {
        if (flag) {
          this.attendanceSituations.attendanceDate = this.formatDate(
            this.minDate
          );
          this.statisAttendanceAbnormal();
          this.attendanceReprotDatail(
            this.dataRangeArr[this.dataRangeIndex].startDate
          );
        } else {
          this.memberInfo.differDay = "";
          this.memberInfo.invalidDateStr = "";
          this.memberInfo.leastAmount = "";
          this.queryIsDredgeMember(3002).then(() => {
            this.attendanceSituations.attendanceDate = this.formatDate(
              this.minDate
            );
            this.statisAttendanceAbnormal();
            if (this.isAttendanceOpen) {
              this.attendanceReprotDatail(
                this.dataRangeArr[this.dataRangeIndex].startDate
              ).then((e) => {
                if (this.attendanceReportDatail.length) {
                  this.containerHeight = 2762;
                } else {
                  this.containerHeight = 2524;
                }
              });
            }
          });
        }
      } else {
        if (flag) {
          if (this.isPubTalkOpen) {
            this.getPubTalkReport().then(() => {
              this.$nextTick(() => {
                this.callNumberBarchart();
                this.callDurationBarchart();
                // this.leaveMessageBarchart();
              });
            });
          } else {
            this.getPubTalkReport().then(() => {
              this.$nextTick(() => {
                this.callNumberBarchart();
              });
            });
          }
        } else {
          this.memberInfo.differDay = "";
          this.memberInfo.invalidDateStr = "";
          this.memberInfo.leastAmount = "";
          this.getPubTalkReport().then(() => {
            this.queryIsDredgeMember(2002).then((e) => {
              if (this.isPubTalkOpen) {
                this.$nextTick(() => {
                  this.callNumberBarchart();
                  this.callDurationBarchart();
                  // this.leaveMessageBarchart();
                });
              } else {
                this.$nextTick(() => {
                  this.callNumberBarchart();
                });
              }
            });
          });
        }
      }
    },
    toImage: function () {
      this.$nextTick(() => {
        html2canvas(document.getElementsByClassName("tainer")[0], {
          useCORS: true,
          // 解决截图不完整问题
          scale: 1,
          height: document.getElementsByClassName("tainer")[0].scrollHeight,
          windowHeight:
            document.getElementsByClassName("tainer")[0].scrollHeight,
        }).then((canvas) => {
          let htmlCanvas = document.getElementById("htmlCanvas");
          let url = canvas.toDataURL("image/png");
          this.imgUrl = url;
          let img = document.createElement("img");
          img.setAttribute("src", this.imgUrl);
          img.setAttribute("class", "htmlCanvasImg");
          img.style.width = "83vw";
          img.style.borderRadius = "15px";
          htmlCanvas.appendChild(img);
        });
      });
    },
    shareHandler: function () {
      uni.showLoading({
        title: "请稍后",
        mask: true,
      });
      let htmlCanvasImg = document.getElementsByClassName("htmlCanvasImg")[0];
      if (htmlCanvasImg) {
        htmlCanvasImg.parentNode.removeChild(htmlCanvasImg);
      }
      this.toImage();
      this.dialogShow = true;
      uni.hideLoading();
    },
    schoolReportChange: function (e) {
      this.reportTypeIndex = e.target.value;
      console.log(e.target.value, "e.target.valuee.target.valuee.target.value");
      this.getDataRangeArr(this.reportTypeIndex);
    },
    dataRangeChange: function (e) {
      this.dataRangeIndex = e.target.value;
      this.getDataRangeArr(this.reportTypeIndex);
    },
    getDataRangeArr: async function (num) {
      if (num) {
        // 一年 52周   周报
        let tmpArr = [];
        for (let i = 1; i <= 52; i++) {
          let startWeek = dayjs().subtract(i, "week").startOf("week");
          let endWeek =
            dayjs().$d.getTime() >
            dayjs().subtract(i, "week").endOf("week").$d.getTime()
              ? dayjs().subtract(i, "week").endOf("week")
              : dayjs();
          tmpArr.push({
            week:
              startWeek.format("YYYY/MM/DD") +
              "~" +
              endWeek.format("YYYY/MM/DD"),
            weekstr: startWeek.format("MM/DD") + "~" + endWeek.format("MM/DD"),
            startDate: startWeek.format("YYYY-MM-DD"),
            endDate: endWeek.format("YYYY-MM-DD"),
          });
        }
        this.dataRangeArr = tmpArr;
      } else {
        // 一年 12个月  月报
        let tmpArr = [];
        for (let i = 1; i <= 11; i++) {
          let startWeek = dayjs().subtract(i, "month").startOf("month");
          let endWeek =
            dayjs().$d.getTime() >
            dayjs().subtract(i, "month").endOf("month").$d.getTime()
              ? dayjs().subtract(i, "month").endOf("month")
              : dayjs();
          tmpArr.push({
            week:
              startWeek.format("YYYY/MM/DD") +
              "~" +
              endWeek.format("YYYY/MM/DD"),
            weekstr: startWeek.format("MM/DD") + "~" + endWeek.format("MM/DD"),
            startDate: startWeek.format("YYYY-MM-DD"),
            endDate: endWeek.format("YYYY-MM-DD"),
          });
        }
        this.dataRangeArr = tmpArr;
      }
      this.tabTapHandler(this.tabIndex, 1);
    },
    formatter(day) {
      const year = day.date.getFullYear();
      const month = day.date.getMonth() + 1;
      const monthstr = month < 10 ? "0" + month : month;
      const date = day.date.getDate();
      const datestr = date < 10 ? "0" + date : date;
      const sum = year + "-" + monthstr + "-" + datestr;
      if (this.tabIndex == 1) {
        // 消费报告
        if (this.diningSituations.notRepastDetailsDTOS) {
          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;
              if (day.topInfo) {
                day.className = "notice-day";
              }
            }
          });
        }
      } else if (this.tabIndex == 2) {
        // 出入校报告
        if (
          this.attendanceReport.abnomalDateList &&
          this.attendanceReport.abnomalDateList.length
        ) {
          const abnomalList = this.attendanceReport.abnomalDateList.filter(
            (e) =>
              e.abnomalType == 2 || e.abnomalType == 3 || e.abnomalType == 5
          );
          const leaveList = this.attendanceReport.abnomalDateList.filter(
            (e) => e.abnomalType == 4
          );
          const championList = this.attendanceReport.abnomalDateList.filter(
            (e) => e.abnomalType == 6
          );
          const progressList = this.attendanceReport.abnomalDateList.filter(
            (e) => e.abnomalType == 7
          );
          // 迟到 早退 未到校
          abnomalList.forEach((item) => {
            if (sum == item.attendDate.slice(0, 10)) {
              var topInfo =
                item.abnomalType == 5 ? "未到校" : item.abnomaleName;
              day.topInfo = topInfo;
              day.className = "late-day";
            }
          });
          // 请假
          leaveList.forEach((item) => {
            if (sum == item.attendDate.slice(0, 10)) {
              day.topInfo = item.abnomaleName;
              day.className = "leave-day";
            }
          });
          // 冠军
          championList.forEach((item) => {
            if (sum == item.attendDate.slice(0, 10)) {
              day.topInfo = item.abnomaleName;
              day.className = "champion-day";
            }
          });
          // 进步
          progressList.forEach((item) => {
            if (sum == item.attendDate.slice(0, 10)) {
              day.topInfo = item.abnomaleName;
              day.className = "progress-day";
            }
          });
        }
      }
      return day;
    },
    formatDate(date) {
      return `${date.getMonth() + 1}月${date.getDate()}日`;
    },
    formatDateTwo(date) {
      return `${date.getFullYear()}-${
        date.getMonth() < 9 ? "0" + (date.getMonth() + 1) : date.getMonth() + 1
      }-${date.getDate() < 10 ? "0" + date.getDate() : date.getDate()}`;
    },
    formatDateThree(date) {
      return date.slice(5, 7) + "/" + date.slice(8);
    },
    async dateSelect(date) {
      this.diningSituations.diningSituationsDate = this.formatDate(date);
      var dateStr = `${date.getFullYear()}-${
        date.getMonth() < 9 ? "0" + (date.getMonth() + 1) : date.getMonth() + 1
      }-${date.getDate() < 10 ? "0" + date.getDate() : date.getDate()}`;
      if (this.diningSituations.notRepastDetailsDTOS) {
        let today = this.diningSituations.notRepastDetailsDTOS.filter(
          (e) => e.repastDate === dateStr
        )[0];
        this.diningSituations.notRepastDetails = today;
      } else {
        this.diningSituations.notRepastDetails = {};
      }
      console.log(
        dateStr,
        "eeeeeeeeeeeeeeeeeeeeeeeeee",
        this.cateringAbnormalGroupList
      );
      this.cateringAbnormalGroupList_ = [];
      if (this.cateringAbnormalGroupList.length) {
        this.cateringAbnormalGroupList_ = this.cateringAbnormalGroupList.filter(
          (x) => x.statisticalDate == dateStr
        );
      }
    },
    //  用户消费异常列表分组信息
    async getCateringAbnormalGroupList() {
      let self = this;
      let params = {
        schoolId: getQueryParams("schoolId"),
        userId: getQueryParams("userId"),
        startDate: this.dataRangeArr[this.dataRangeIndex].startDate,
        endDate: this.dataRangeArr[this.dataRangeIndex].endDate,
        timeType: this.reportTypeIndex == 0 ? 2 : 1,
        statisticalMonth: moment(
          this.dataRangeArr[this.dataRangeIndex].startDate
        ).format("YYYYMM"),
        userType: this.usertype,
      };
      console.log(
        this.dataRangeArr[this.dataRangeIndex].startDate,
        "datetets111111111111111",
        this.dataRangeArr[this.dataRangeIndex].endDate
      );
      try {
        let data = {};
        if (this.from == "wechat") {
          data = await this.$http.post(
            {
              header: {
                "Content-Type": "application/x-www-form-urlencoded",
              },
              url:
                gHost +
                "/report-push/cateringAbnormal/getCateringAbnormalGroupList",
            },
            params
          );
          self.cateringAbnormalGroupList = [];
          if (data.code == 10000) {
            let res = data.data;
            self.cateringAbnormalGroupList = res;
          }
        } else if (this.from == "alipay") {
          data = await this.$http.post(
            {
              header: {
                "Content-Type": "application/x-www-form-urlencoded",
              },
              url: `${az_gHost}/cloud-gateway/bill/cateringAbnormal/getCateringAbnormalGroupListV2`,
            },
            params
          );
          self.cateringAbnormalGroupList = [];
          if (data.code == 200) {
            let res = data.obj;
            self.cateringAbnormalGroupList = res;
          }
        }

        // await $.ajax({
        //   url:
        //     gHost +
        //     "/report-push/cateringAbnormal/getCateringAbnormalGroupList",
        //   type: "POST",
        //   contentType: "application/x-www-form-urlencoded",
        //   data: params,
        //   success: function (data) {
        //     self.cateringAbnormalGroupList = [];
        //     if (data.code == 10000) {
        //       let res = data.data;
        //       self.cateringAbnormalGroupList = res;
        //       console.log(
        //         self.cateringAbnormalGroupList,
        //         "aaaaaaaaaaaaaaaaaaaaaaaa"
        //       );
        //       // if (res.length) {
        //       //   this.lastMeal =
        //       //     new Date(res[0].statisticalDate).getMonth() +
        //       //     1 +
        //       //     "月" +
        //       //     new Date(res[0].statisticalDate).getDate() +
        //       //     "日";
        //       // }
        //     }
        //   },
        // });
      } catch (e) {
        console.log(e);
      }
    },
    attendanceDateSelect(date) {
      this.attendanceSituations.attendanceDate = this.formatDate(date);
      this.attendanceReprotDatail(this.formatDateTwo(date));
    },
    piechart() {
      const self = this;
      this.$nextTick(() => {
        let arr = this.pieDatas;
        let domChart = document.getElementById("consumer-preferences-pie");
        if (!domChart) {
          return;
        }
        let myChart = echarts.init(domChart);
        console.log(myChart, "zzzzzzzzzzzzzzzzz");
        let option = {
          tooltip: {
            trigger: "item",
          },
          series: arr.map(function (data, idx) {
            return {
              type: "pie",
              radius: ["33", "58"],
              data: data,
              itemStyle: {
                borderColor: "#fff",
                borderWidth: 3,
              },
              label: {
                formatter: function (e) {
                  return e.name + "\n" + e.value + "元";
                },
                padding: [0, 2],
                rich: {
                  color: "rgba(0, 0, 0, 0.85)",
                  fontSize: 12,
                  fontFamily: "PingFangSC-Regular, PingFang SC",
                  fontWeight: 400,
                  lineHeight: 17,
                },
              },
            };
          }),
          color: ["#00C47C", "#F6C723", "#FF8646"],
        };
        option && myChart.setOption(option);
        window.addEventListener("resize", function () {
          myChart.resize();
        });
      });
    },
    // 获取某月的所有周六
    getMonthSaturdayDate: function (year, month) {
      const lastDay = new Date(year, month, 0).getDate();
      const startDay = new Date(year, month, 1).getDate();
      const allDate = [];
      for (var i = startDay; i <= lastDay; i++) {
        allDate[i - 1] =
          i < 10
            ? year + "-" + month + "-" + "0" + i
            : year + "-" + month + "-" + i;
      }
      const saturdayDate =
        (allDate.length || []) &&
        allDate.filter((e) => {
          const date = new Date(e);
          if (date.getDay() == 6) {
            return true;
          }
        });
      return saturdayDate;
    },
    linechart: function (num) {
      var mySize = document.getElementById("consumer-trend-line");
      mySize.style.width = 360 + "px";
      mySize.style.height = 260 + "px";
      var myLineChart = echarts.init(mySize);
      var xdata = this.lineDatas.map((v) => v.name);
      var year = this.dataRangeArr[this.dataRangeIndex].startDate.slice(0, 4);
      var month = this.dataRangeArr[this.dataRangeIndex].startDate.slice(5, 7);
      var saturdayList = this.getMonthSaturdayDate(year, month);
      switch (num) {
        case 0:
          var seriesData = [];
          this.lineDatas.map((v) => {
            if (v.isException == 1) {
              if (
                v.date == this.formatDateTwo(new Date(year, month, 0)) ||
                saturdayList.includes(v.date)
              ) {
                seriesData.push(
                  Object.assign(v, {
                    itemStyle: {
                      color: "#0BDB7E",
                      borderWidth: 1.5,
                    },
                  })
                );
              } else {
                seriesData.push(
                  Object.assign(v, {
                    itemStyle: {
                      color: "#0BDB7E",
                      borderWidth: 1.5,
                    },
                    symbol: "none",
                  })
                );
              }
            } else {
              if (
                v.date == this.formatDateTwo(new Date(year, month, 0)) ||
                saturdayList.includes(v.date)
              ) {
                seriesData.push(
                  Object.assign(v, {
                    itemStyle: {
                      color: "#FF8646",
                      borderWidth: 1.5,
                    },
                  })
                );
              } else {
                seriesData.push(
                  Object.assign(v, {
                    itemStyle: {
                      color: "#FF8646",
                      borderWidth: 1.5,
                    },
                    symbol: "none",
                  })
                );
              }
            }
          });
          break;
        case 1:
          var seriesData = [];
          this.lineDatas.map((v) => {
            if (v.isException == 1) {
              seriesData.push(
                Object.assign(v, {
                  itemStyle: {
                    color: "#0BDB7E",
                    borderWidth: 1.5,
                  },
                })
              );
            } else {
              seriesData.push(
                Object.assign(v, {
                  itemStyle: {
                    color: "#FF8646",
                    borderWidth: 1.5,
                  },
                })
              );
            }
          });
          break;
      }
      var option = {
        xAxis: {
          type: "category",
          data: xdata,
        },
        yAxis: {
          type: "value",
        },
        series: [
          {
            data: seriesData,
            type: "line",
            smooth: true,
            areaStyle: {
              color:
                "linear-gradient(180 deg, #0DDE7E 0%, rgba(4, 205, 124, 0) 100%)",
              opacity: 0.2,
            },
            lineStyle: {
              color: "#0BDB7E",
            },
          },
        ],
        tooltip: {
          trigger: "axis",
          axisPointer: {
            type: "shadow",
            shadowStyle: {
              color: "transparent",
            },
          },
          extraCssText: `width:109px;height:55px;line-height:33rpx;background: no-repeat center/100% url(./static/images/consumeTrendbgm.png);

font-size:24rpx;font-family: PingFangSC-Medium, PingFang SC;font-weight: 500;

color: #FF8646;padding:13rpx 12rpx 30rpx 17rpx;`,
          confine: true,
          position: function (pt) {
            return [pt[0] - 27, pt[1] - 73];
          },
          formatter: function (data) {
            let desp = ["", "消费金额偏高", "消费金额偏低"][
              data[0].data.isException - 1
            ];
            return data[0].name + "消费" + data[0].value + "元" + "<br>" + desp;
          },
        },
      };
      option && myLineChart.setOption(option);
      window.addEventListener("resize", function () {
        myLineChart.resize();
      });
    },
    // 就餐时间趋势
    breakfastTimeLinechart: function (num, eleId, mealtype) {
      var mySize = document.getElementById(eleId);
      mySize.style.width = 350 + "px";
      mySize.style.height = 260 + "px";
      var myBreakfastTimeLineChart = echarts.init(mySize);
      var cateringList =
        (this.mealtimeTrendsData.length || []) &&
        this.mealtimeTrendsData.filter((e) => e.mealtype == mealtype)[0]
          .cateringList;
      var breakfastTimeData = JSON.parse(JSON.stringify(cateringList));
      var breakfastTimeDataTwo = JSON.parse(JSON.stringify(cateringList));
      breakfastTimeData.forEach((e) => {
        if ("itemStyle" in e) delete e.itemStyle;
        if ("symbol" in e) delete e.symbol;
        if ("symbolSize" in e) delete e.symbolSize;
        if (e.classmealtime.indexOf("2022/07/01") == -1) {
          e.classmealtime = "2022/07/01 " + e.classmealtime;
        }
        e.value = e.classmealtime;
      });
      breakfastTimeDataTwo.forEach((e) => {
        if ("itemStyle" in e) delete e.itemStyle;
        if ("symbol" in e) delete e.symbol;
        if ("symbolSize" in e) delete e.symbolSize;
        if (e.usermealtime.indexOf("2022/07/01") == -1) {
          e.usermealtime = "2022/07/01 " + e.usermealtime;
        }
        e.value = e.usermealtime;
      });
      var xInterval = this.reportTypeIndex ? 0 : 6;
      var yMidPoint =
        "2022/07/01 " + (this.mealtimeTrendsData.length || []) &&
        this.mealtimeTrendsData.filter((e) => e.mealtype == 1)[0].earliestTime;
      var maxDate = new Date(yMidPoint).setHours(
        new Date(yMidPoint).getHours() == 23
          ? "00"
          : new Date(yMidPoint).getHours() + 1
      );
      var minDate = new Date(yMidPoint).setHours(
        new Date(yMidPoint).getHours() == 0
          ? 23
          : new Date(yMidPoint).getHours() - 1
      );
      var xdata = breakfastTimeData.map((e) => e.repasttime.slice(5));
      var year = this.dataRangeArr[this.dataRangeIndex].startDate.slice(0, 4);
      var month = this.dataRangeArr[this.dataRangeIndex].startDate.slice(5, 7);
      var saturdayList = this.getMonthSaturdayDate(year, month);
      var seriesDataOne = [];
      var seriesDataTwo = [];
      switch (num) {
        case 0: // 月报
          breakfastTimeData.map((v) => {
            if (v.repastType == 1) {
              if (
                v.repasttime == this.formatDateTwo(new Date(year, month, 0)) ||
                saturdayList.includes(v.repasttime)
              ) {
                // 第1/2/3/4周的最后一天+月末最后一天
                seriesDataOne.push(
                  Object.assign(v, {
                    itemStyle: {
                      color: "rgba(0, 0, 0, 0.5)",
                      borderWidth: 1.5,
                    },
                    symbolSize: 4,
                  })
                );
              } else {
                seriesDataOne.push(
                  Object.assign(v, {
                    itemStyle: {
                      color: "rgba(0, 0, 0, 0.5)",
                      borderWidth: 1.5,
                    },
                    symbol: "none",
                  })
                );
              }
            } else {
              if (
                v.repasttime == this.formatDateTwo(new Date(year, month, 0)) ||
                saturdayList.includes(v.repasttime)
              ) {
                seriesDataOne.push(
                  Object.assign(v, {
                    itemStyle: {
                      color: "rgba(0, 0, 0, 0.5)",
                      borderWidth: 1.5,
                    },
                    symbolSize: 4,
                  })
                );
              } else {
                seriesDataOne.push(
                  Object.assign(v, {
                    itemStyle: {
                      color: "#FF8646",
                      borderWidth: 1.5,
                    },
                    symbol: "none",
                  })
                );
              }
            }
          });
          breakfastTimeDataTwo.map((v) => {
            if (v.repastType == 1) {
              if (
                v.repasttime == this.formatDateTwo(new Date(year, month, 0)) ||
                saturdayList.includes(v.repasttime)
              ) {
                seriesDataTwo.push(
                  Object.assign(v, {
                    itemStyle: {
                      color: "#0BDB7E",
                      borderWidth: 1.5,
                    },
                    symbolSize: 4,
                  })
                );
              } else {
                seriesDataTwo.push(
                  Object.assign(v, {
                    itemStyle: {
                      color: "#0BDB7E",
                      borderWidth: 1.5,
                    },
                    symbol: "none",
                  })
                );
              }
            } else {
              if (
                v.repasttime == this.formatDateTwo(new Date(year, month, 0)) ||
                saturdayList.includes(v.repasttime)
              ) {
                seriesDataTwo.push(
                  Object.assign(v, {
                    itemStyle: {
                      color: "#0BDB7E",
                      borderWidth: 1.5,
                    },
                    symbolSize: 4,
                  })
                );
              } else {
                seriesDataTwo.push(
                  Object.assign(v, {
                    itemStyle: {
                      color: "#FF8646",
                      borderWidth: 1.5,
                    },
                    symbol: "none",
                  })
                );
              }
            }
          });
          break;
        case 1: // 周报
          breakfastTimeData.map((v) => {
            if (v.repastType == 1) {
              seriesDataOne.push(
                Object.assign(v, {
                  itemStyle: {
                    color: "rgba(0, 0, 0, 0.5)",
                    borderWidth: 1.5,
                  },
                  symbolSize: 4,
                })
              );
            } else {
              seriesDataOne.push(
                Object.assign(v, {
                  itemStyle: {
                    color: "#FF8646",
                    borderWidth: 1.5,
                  },
                  symbolSize: 4,
                })
              );
            }
          });
          breakfastTimeDataTwo.map((v) => {
            if (v.repastType == 1) {
              seriesDataTwo.push(
                Object.assign(v, {
                  itemStyle: {
                    color: "#0BDB7E",
                    borderWidth: 1.5,
                  },
                  symbolSize: 4,
                })
              );
            } else {
              seriesDataTwo.push(
                Object.assign(v, {
                  itemStyle: {
                    color: "#FF8646",
                    borderWidth: 1.5,
                  },
                  symbolSize: 4,
                })
              );
            }
          });
          break;
      }
      var option = {
        xAxis: {
          type: "category",
          data: xdata,
          axisLabel: {
            interval: xInterval,
          },
        },
        yAxis: {
          type: "time",
          axisLabel: {
            margin: 2,
            formatter: function (value) {
              return moment(value).format("YYYY-MM-DD HH:mm").slice(11);
            },
          },
          max: function (value) {
            if (
              new Date(maxDate).getMinutes() > 0 &&
              new Date(maxDate).getMinutes() < 30
            ) {
              return new Date(maxDate).setMinutes(30);
            } else {
              return maxDate;
            }
          },
          min: minDate,
          minInterval: 2400 * 1000,
          maxInterval: 2400 * 1000,
        },
        series: [
          {
            data: seriesDataOne,
            type: "line",
            smooth: true,
            lineStyle: {
              color: "rgba(0, 0, 0, 0.5)",
            },
          },
          {
            data: seriesDataTwo,
            type: "line",
            smooth: true,
            lineStyle: {
              color: "#0BDB7E",
            },
          },
        ],
        tooltip: {
          trigger: "axis",
          axisPointer: {
            type: "shadow",
            shadowStyle: {
              color: "transparent",
            },
          },
          extraCssText: `width:150px;height:30px;line-height:33rpx;background: no-repeat center/100% url(./static/images/breakfastTimeBg.png);

					font-size:24rpx;font-family: PingFangSC-Medium, PingFang SC;font-weight: 500;

					color: #FF8646;padding:23px 0 30px 12px;box-sizing:border-box;`,
          confine: true,
          position: function (pt) {
            return [pt[0] - 30, pt[1] - 5];
          },
          formatter: function (data) {
            if (data[0].data.repastType == 2 && data[0].data.symbolSize) {
              return `${
                new Date(data[0].data.repasttime).getMonth() + 1
              }月${new Date(data[0].data.repasttime).getDate()}日就餐时间较晚`;
            } else if (
              data[0].data.repastType == 3 &&
              data[0].data.symbolSize
            ) {
              return `${
                new Date(data[0].data.repasttime).getMonth() + 1
              }月${new Date(data[0].data.repasttime).getDate()}日就餐时间较早`;
            }
          },
        },
      };
      option && myBreakfastTimeLineChart.setOption(option);
      window.addEventListener("resize", function () {
        myBreakfastTimeLineChart.resize();
      });
    },
    mealPalBarchart: function () {
      var mySize = document.getElementById("meal-pal-bar");
      mySize.style.width = 300 + "px";
      mySize.style.height = 280 + "px";
      var myMealPalBarchart = echarts.init(mySize);
      var ydata = this.mealPalArr;
      var seriesData = this.mealPalData.map((v) => v.mealnumber);
      var seriesDataMax = Math.max(...seriesData);
      var option = {
        xAxis: {
          type: "value",
          interval: Math.ceil(seriesDataMax / 5),
          axisLabel: {
            formatter: "{value}天",
          },
          splitLine: {
            show: true,
            lineStyle: {
              color: ["#979797"],
              width: 0.5,
              type: "solid",
            },
          },
        },
        yAxis: {
          type: "category",
          data: ydata,
          axisLabel: {
            show: true,
            textStyle: {
              color: "#000000",
              fontSize: 12,
            },
          },
          axisLine: {
            show: true,
            lineStyle: {
              color: ["#979797"],
              width: 0.5,
              type: "solid",
            },
          },
        },
        series: [
          {
            data: seriesData,
            type: "bar",
            itemStyle: {
              color: new this.$echarts.graphic.LinearGradient(0, 0, 1, 0, [
                {
                  offset: 0,
                  color: "#04B871",
                },
                {
                  offset: 1,
                  color: "#07D66A",
                },
              ]),
              barBorderRadius: [0, 8, 8, 0],
            },
            label: {
              show: true,
              position: "right",
              color: "#04B871",
              fontSize: "14px",
              formatter: (params) => {
                return params.value + "天";
              },
            },
            barWidth: 25,
          },
        ],
      };
      option && myMealPalBarchart.setOption(option);
      window.addEventListener("resize", function () {
        myMealPalBarchart.resize();
      });
    },
    callNumberBarchart: function () {
      var mySize = document.getElementById("call-number-bar");
      mySize.style.width = 350 + "px";
      mySize.style.height = 260 + "px";
      var myCallNumberBarchart = echarts.init(mySize);
      var xdata = this.pubTalkReport.callNumberInfoList.map((v) => v.nickname);
      var seriesData = this.pubTalkReport.callNumberInfoList.map(
        (v) => v.callNumber
      );
      var option = {
        xAxis: {
          type: "category",
          data: xdata,
          axisLabel: {
            show: true,
            interval: 0,
            textStyle: {
              color: "rgba(0, 0, 0, 0.5)",
              fontSize: 12,
            },
            formatter: function (params) {
              var newParamsName = "";
              var tempParamsName = "";
              var paramsNameNumber = params.length;
              var provideNumber = 2;
              var rowNumber = Math.ceil(paramsNameNumber / provideNumber);
              if (paramsNameNumber > provideNumber) {
                for (var p = 0; p < rowNumber; p++) {
                  var tempStr = "";
                  var start = p * provideNumber;
                  var end = start + provideNumber;
                  if (p == rowNumber - 1) {
                    tempStr = params.substring(start, paramsNameNumber);
                  } else {
                    tempStr = params.substring(start, end) + "\n";
                  }
                  tempParamsName += tempStr;
                }
              } else {
                tempParamsName = params;
              }
              if (tempParamsName.length > 9) {
                newParamsName = tempParamsName.substring(0, 10) + "...";
              } else {
                newParamsName = tempParamsName;
              }
              return newParamsName;
            },
          },
        },
        yAxis: {
          type: "value",
          min: 0,
          max: function (value) {
            return Math.ceil(value.max) + 1;
          },
          minInterval: 1,
        },
        series: [
          {
            data: seriesData,
            type: "bar",
            itemStyle: {
              color: "#FF9523",
              barBorderRadius: [5, 5, 0, 0],
            },
            label: {
              show: true,
              position: "top",
              color: "#FE931F",
              fontSize: "14px",
              formatter: (params) => {
                return params.value[params.encode.x[0]];
              },
            },
            barWidth: 25,
          },
        ],
      };
      option && myCallNumberBarchart.setOption(option);
      window.addEventListener("resize", function () {
        myCallNumberBarchart.resize();
      });
    },
    callDurationBarchart: function () {
      var mySize = document.getElementById("call-duration-bar");
      mySize.style.width = 340 + "px";
      mySize.style.height = 260 + "px";
      var myCallDurationBarchart = echarts.init(mySize);
      var xdata = this.pubTalkReport.callDurationInfoList.map(
        (v) => v.nickname
      );
      var seriesData = this.pubTalkReport.callDurationInfoList.map(
        (v) => v.duration
      );
      var option = {
        xAxis: {
          type: "category",
          data: xdata,
          axisLabel: {
            show: true,
            interval: 0,
            textStyle: {
              color: "rgba(0, 0, 0, 0.5)",
              fontSize: 12,
            },
            formatter: function (params) {
              var newParamsName = "";
              var tempParamsName = "";
              var paramsNameNumber = params.length;
              var provideNumber = 2;
              var rowNumber = Math.ceil(paramsNameNumber / provideNumber);
              if (paramsNameNumber > provideNumber) {
                for (var p = 0; p < rowNumber; p++) {
                  var tempStr = "";
                  var start = p * provideNumber;
                  var end = start + provideNumber;
                  if (p == rowNumber - 1) {
                    tempStr = params.substring(start, paramsNameNumber);
                  } else {
                    tempStr = params.substring(start, end) + "\n";
                  }
                  tempParamsName += tempStr;
                }
              } else {
                tempParamsName = params;
              }
              if (tempParamsName.length > 9) {
                newParamsName = tempParamsName.substring(0, 10) + "...";
              } else {
                newParamsName = tempParamsName;
              }
              return newParamsName;
            },
          },
        },
        yAxis: {
          type: "value",
          min: 0,
          max: function (value) {
            return Math.ceil(value.max);
          },
          minInterval: 1,
        },
        series: [
          {
            data: seriesData,
            type: "bar",
            itemStyle: {
              color: "#D59F00",
              barBorderRadius: [5, 5, 0, 0],
            },
            label: {
              show: true,
              position: "top",
              color: "#D59F00",
              fontSize: "14px",
              formatter: (params) => {
                return params.value[params.encode.x[0]];
              },
            },
            barWidth: 25,
          },
        ],
      };
      option && myCallDurationBarchart.setOption(option);
      window.addEventListener("resize", function () {
        myCallDurationBarchart.resize();
      });
    },
    leaveMessageBarchart: function () {
      var mySize = document.getElementById("leave-message-bar");
      mySize.style.width = 350 + "px";
      mySize.style.height = 260 + "px";
      var myLeaveMessageBarchart = echarts.init(mySize);
      var xdata = this.pubTalkReport.leaveMessageInfoList.map(
        (v) => v.nickname
      );
      var seriesData = this.pubTalkReport.leaveMessageInfoList.map(
        (v) => v.leaveMessageNumber
      );
      var option = {
        xAxis: {
          type: "category",
          data: xdata,
          axisLabel: {
            show: true,
            interval: 0,
            textStyle: {
              color: "rgba(0, 0, 0, 0.5)",
              fontSize: 12,
            },
            formatter: function (params) {
              var newParamsName = "";
              var tempParamsName = "";
              var paramsNameNumber = params.length;
              var provideNumber = 2;
              var rowNumber = Math.ceil(paramsNameNumber / provideNumber);
              if (paramsNameNumber > provideNumber) {
                for (var p = 0; p < rowNumber; p++) {
                  var tempStr = "";
                  var start = p * provideNumber;
                  var end = start + provideNumber;
                  if (p == rowNumber - 1) {
                    tempStr = params.substring(start, paramsNameNumber);
                  } else {
                    tempStr = params.substring(start, end) + "\n";
                  }
                  tempParamsName += tempStr;
                }
              } else {
                tempParamsName = params;
              }
              if (tempParamsName.length > 9) {
                newParamsName = tempParamsName.substring(0, 10) + "...";
              } else {
                newParamsName = tempParamsName;
              }
              return newParamsName;
            },
          },
        },
        yAxis: {
          type: "value",
          min: 0,
          max: function (value) {
            return Math.ceil(value.max);
          },
          minInterval: 1,
        },
        series: [
          {
            data: seriesData,
            type: "bar",
            itemStyle: {
              color: "#00AB6C",
              barBorderRadius: [5, 5, 0, 0],
            },
            label: {
              show: true,
              position: "top",
              color: "#00AB6C",
              fontSize: "14px",
              formatter: (params) => {
                return params.value[params.encode.x[0]];
              },
            },
            barWidth: 25,
          },
        ],
      };
      option && myLeaveMessageBarchart.setOption(option);
      window.addEventListener("resize", function () {
        myLeaveMessageBarchart.resize();
      });
    },
    // 查询学生信息
    async queryCampusStudentInfo() {
      try {
        // let url = gHost +
        //       "/report-push/campus-consumer-report/queryCampusStudentInfo"
        // if(this.from == 'alipay'){
        //   url = `${az_gHost}/cloud-gateway/bill/campusConsumerReport/queryCampusStudentInfo`
        // }
        let params = {
          schoolId: getQueryParams("schoolId"),
          userId: getQueryParams("userId"),
          statisticalMonth: moment(
            this.dataRangeArr[this.dataRangeIndex].startDate
          ).format("YYYYMM"),
          userType: this.usertype,
        };
        let data = {};
        if (this.from == "wechat") {
          data = await this.$http.get(
            {
              url:
                gHost +
                "/report-push/campus-consumer-report/queryCampusStudentInfo",
            },
            params
          );
        } else if (this.from == "alipay") {
          data = await this.$http.get(
            {
              header: {
                "Content-Type": "application/x-www-form-urlencoded",
              },
              url: `${az_gHost}/cloud-gateway/bill/campusConsumerReport/queryCampusStudentInfo`,
            },
            params
          );
        }
        // let data = await this.$http.get(
        //   {
        //     url:
        //       url
        //   },
        //   {
        //     schoolId: getQueryParams("schoolId"),
        //     userId: getQueryParams("userId"),
        //     statisticalMonth: moment(
        //       this.dataRangeArr[this.dataRangeIndex].startDate
        //     ).format("YYYYMM"),
        //     userType: this.usertype,
        //   }
        // );
        if (data.code != 200) {
          uni.showToast({
            icon: "none",
            mask: true,
            title: data.msg,
          });
          return;
        }
        this.userInfo = data.obj || {};
      } catch (e) {
        //TODO handle the exception
        console.log(e);
        // uni.showToast({
        //   icon: "none",
        //   mask: true,
        //   title: e.message,
        // });
      }
    },
    sortCalculateType: function (a, b) {
      return a.calculateType - b.calculateType;
    },
    // 获取日期数组
    enumerateDaysBetweenDates: function (startDate, endDate) {
      // startDate必须小于endDate，且二者不相等
      let daysList = [];
      let SDate = moment(startDate);
      let EDate = moment(endDate);
      let xt;
      daysList.push(SDate.format("MM/DD"));
      while (SDate.add(1, "days").isBefore(EDate)) {
        // 注意这里add方法处理后SDate对象已经改变。
        daysList.push(SDate.format("MM/DD"));
      }
      daysList.push(EDate.format("MM/DD"));
      return daysList;
    },
    // 查询消费明细
    async queryConsumerDetail(startDate, endDate) {
      try {
        let params = {
          schoolId: getQueryParams("schoolId"),
          userId: getQueryParams("userId"),
          startDate,
          endDate,
          timeType: this.reportTypeIndex == 0 ? 2 : 1,
          statisticalMonth: moment(
            this.dataRangeArr[this.dataRangeIndex].startDate
          ).format("YYYYMM"),
          userType: this.usertype,
        };
        let data = {};
        if (this.from == "wechat") {
          data = await this.$http.get(
            {
              url:
                gHost +
                "/report-push/campus-consumer-report/queryConsumerDetail",
            },
            params
          );
        } else if (this.from == "alipay") {
          data = await this.$http.get(
            {
              header: {
                "Content-Type": "application/x-www-form-urlencoded",
              },
              url: `${az_gHost}/cloud-gateway/bill/campusConsumerReport/queryConsumerDetail`,
            },
            params
          );
        }

        if (data.code == 200) {
          this.campusConsumerDetailObj = {};
          this.campusConsumerDetailObj.campusConsumerDetailList = [];
          this.trendColorList = [];
          this.consumerDetailCalculateObj.canteenData = 0;
          this.consumerDetailCalculateObj.totalData = 0;
          this.consumerDetailCalculateObj.cateringNumber = 0;
          this.consumerDetailCalculateObj.notCateringNumber = 0;
          if (!data.obj) {
            return;
          }
          if (
            data.obj &&
            data.obj.campusConsumerDetailList &&
            Array.isArray(data.obj.campusConsumerDetailList) &&
            data.obj.campusConsumerDetailList.length &&
            data.obj.campusConsumerDetailCalculateList &&
            Array.isArray(data.obj.campusConsumerDetailCalculateList) &&
            data.obj.campusConsumerDetailCalculateList.length
          ) {
            this.campusConsumerDetailObj = data.obj;
            this.campusConsumerDetailObj.campusConsumerDetailList.forEach(
              (e) => {
                e.currentDate = this.formatDateThree(e.currentDate);
                e.consumerDetailsArr = Object.values(e);
              }
            );
            this.campusConsumerDetailObj.campusConsumerDetailCalculateList.sort(
              this.sortCalculateType
            );
            let tmpColorList = [""];
            this.campusConsumerDetailObj.campusConsumerDetailCalculateList.forEach(
              (e, index) => {
                e.calculateType = ["就餐", "未就餐", "均值", "较上", "总计"][
                  e.calculateType - 1
                ];
                if (e.calculateType == "较上") {
                  for (let item in e) {
                    if (item != "calculateType") {
                      if (e[item] > 0) {
                        tmpColorList.push("#FA2B00");
                      } else if (e[item] < 0) {
                        tmpColorList.push("#00A367");
                      } else {
                        tmpColorList.push("");
                      }
                      e[item] =
                        e[item] >= 1000
                          ? "-"
                          : e[item] > 0
                          ? e[item] + "%↑"
                          : e[item] < 0
                          ? e[item].toString().slice(1) + "%↓"
                          : "-";
                    }
                  }
                }
                this.trendColorList = JSON.parse(JSON.stringify(tmpColorList));
                e.consumerDetailsSumArr = Object.values(e);
              }
            );
            if (
              this.campusConsumerDetailObj.campusConsumerDetailCalculateList[4]
            ) {
              // 食堂消费=总消费-其他消费
              this.consumerDetailCalculateObj.canteenData =
                this.campusConsumerDetailObj
                  .campusConsumerDetailCalculateList[4].totalAmount -
                this.campusConsumerDetailObj
                  .campusConsumerDetailCalculateList[4].otherAmount;
              // 总消费
              this.consumerDetailCalculateObj.totalData =
                this.campusConsumerDetailObj.campusConsumerDetailCalculateList[4].totalAmount;
            }
            if (
              this.campusConsumerDetailObj.campusConsumerDetailCalculateList[0]
            ) {
              // 就餐次数
              this.consumerDetailCalculateObj.cateringNumber =
                this.campusConsumerDetailObj.campusConsumerDetailCalculateList[0].totalAmount;
            }
            if (
              this.campusConsumerDetailObj.campusConsumerDetailCalculateList[1]
            ) {
              // 未就餐次数
              this.consumerDetailCalculateObj.notCateringNumber =
                this.campusConsumerDetailObj.campusConsumerDetailCalculateList[1].totalAmount;
            }
          }
        } else if (data.code == 500) {
          // 暂无消费数据
          let tmpDetailList = [];
          let dateList = this.enumerateDaysBetweenDates(startDate, endDate);
          dateList.forEach((e) => {
            tmpDetailList.push({
              currentDate: e,
              breakfastAmount: 0,
              lunchAmount: 0,
              supperAmount: 0,
              otherAmount: 0,
              totalAmount: 0,
              consumerDetailsArr: [e, 0, 0, 0, 0, 0],
            });
          });
          this.campusConsumerDetailObj.campusConsumerDetailList = JSON.parse(
            JSON.stringify(tmpDetailList)
          );
          let tmpCalculatList = [];
          let calculateTypeList = ["就餐", "未就餐", "均值", "较上", "总计"];
          calculateTypeList.forEach((e) => {
            if (e == "较上") {
              tmpCalculatList.push({
                calculateType: e,
                breakfastAmount: "-",
                lunchAmount: "-",
                supperAmount: "-",
                otherAmount: "-",
                totalAmount: "-",
                consumerDetailsSumArr: [e, "-", "-", "-", "-", "-"],
              });
            } else {
              tmpCalculatList.push({
                calculateType: e,
                breakfastAmount: 0,
                lunchAmount: 0,
                supperAmount: 0,
                otherAmount: 0,
                totalAmount: 0,
                consumerDetailsSumArr: [e, 0, 0, 0, 0, 0],
              });
            }
          });
          this.campusConsumerDetailObj.campusConsumerDetailCalculateList =
            JSON.parse(JSON.stringify(tmpCalculatList));
          this.trendColorList = ["", "", "", "", "", ""];
          this.consumerDetailCalculateObj = {
            canteenData: "", // 食堂消费
            totalData: "", // 总消费
            cateringNumber: "", // 就餐次数
            notCateringNumber: "", //未就餐次数
          };
        } else {
          uni.showToast({
            icon: "none",
            mask: true,
            title: data.msg,
          });
          return;
        }
      } catch (e) {
        //TODO handle the exception
        console.log(e);
        // uni.showToast({
        //   icon: "none",
        //   mask: true,
        //   title: e.message,
        // });
      }
    },
    // 查询就餐情况
    async queryNotRepastDetails(startDate, endDate) {
      try {
        // let data = await this.$http.get(
        //   {
        //     url:
        //       gHost +
        //       "/report-push/campus-consumer-report/queryNotRepastDetails",
        //   },

        // );
        let params = {
          schoolId: getQueryParams("schoolId"),
          userId: getQueryParams("userId"),
          startDate,
          endDate,
          timeType: this.reportTypeIndex == 0 ? 2 : 1,
          statisticalMonth: moment(
            this.dataRangeArr[this.dataRangeIndex].startDate
          ).format("YYYYMM"),
          userType: this.usertype,
        };
        let data = {};
        if (this.from == "wechat") {
          data = await this.$http.get(
            {
              url:
                gHost +
                "/report-push/campus-consumer-report/queryNotRepastDetails",
            },
            params
          );
          // if (data.code != 200) {
          //   uni.showToast({
          //     icon: "none",
          //     mask: true,
          //     title: data.msg,
          //   });
          //   return;
          // }
          // if (!data.obj) {
          //   this.diningSituations = {};
          //   return;
          // }
          // this.diningSituations.notRepastDay = data.obj.notRepastDay;
          // this.diningSituations.notRepastDetailsDTOS =
          //   data.obj.notRepastDetailsDTOS;
        } else if (this.from == "alipay") {
          data = await this.$http.get(
            {
              header: {
                "Content-Type": "application/x-www-form-urlencoded",
              },
              url: `${az_gHost}/cloud-gateway/bill/campusConsumerReport/queryNotRepastDetails`,
            },
            params
          );
        }
        if (data.code != 200) {
          uni.showToast({
            icon: "none",
            mask: true,
            title: data.msg,
          });
          return;
        }
        if (!data.obj) {
          this.diningSituations = {};
          return;
        }
        this.diningSituations.notRepastDay = data.obj.notRepastDay;
        this.diningSituations.notRepastDetailsDTOS =
          data.obj.notRepastDetailsDTOS;
        // this.diningSituations.cateringLevel = data.obj.cateringLevel;
        // this.diningSituations.notCateringNumber = data.obj.notCateringNumber;
        // this.diningSituations.notCateringType = this.diningSituations
        //   .cateringLevel
        //   ? ["早餐", "午餐", "晚餐"][this.diningSituations.cateringLevel - 1]
        //   : "";
        // this.diningSituations.clues = this.diningSituations.cateringLevel
        //   ? [
        //       "早餐吃好，一天才能活力满满哦",
        //       "及时补充能量，下午才能集中精神学习哦",
        //       "晚餐好好吃，身体才能更健康",
        //     ][this.diningSituations.cateringLevel - 1]
        //   : "";
      } catch (e) {
        //TODO handle the exception
        console.log(e);
        // uni.showToast({
        //   icon: "none",
        //   mask: true,
        //   title: e.message,
        // });
      }
    },
    // 三对象排序
    numsort(obj1, obj2, obj3) {
      var temp;
      if (obj1.num > obj2.num) {
        temp = JSON.parse(JSON.stringify(obj1));
        obj1 = JSON.parse(JSON.stringify(obj2));
        obj2 = JSON.parse(JSON.stringify(temp));
      }
      if (obj2.num > obj3.num) {
        temp = JSON.parse(JSON.stringify(obj2));
        obj2 = JSON.parse(JSON.stringify(obj3));
        obj3 = JSON.parse(JSON.stringify(temp));
      }
      if (obj1.num > obj2.num) {
        temp = JSON.parse(JSON.stringify(obj1));
        obj1 = JSON.parse(JSON.stringify(obj2));
        obj2 = JSON.parse(JSON.stringify(temp));
      }
      return [
        {
          name: obj1.name,
          value: obj1.num,
          tag: 0,
        },
        {
          name: obj2.name,
          value: obj2.num,
          tag: 1,
        },
        {
          name: obj3.name,
          value: obj3.num,
          tag: 2,
        },
      ];
    },
    // 数组中数据的个数
    counterArray(arr) {
      var obj = {};
      arr.forEach(function (v, k) {
        if (obj[v]) {
          obj[v]++;
        } else {
          obj[v] = 1;
        }
      });
      return obj;
    },
    // 查询消费总额及学生消费偏好类型
    async queryConsumerSummaryAmount(num) {
      try {
        const self = this;
        let params = {
          schoolId: getQueryParams("schoolId"),
          userId: getQueryParams("userId"),
          startDate: this.dataRangeArr[this.dataRangeIndex].startDate,
          endDate: this.dataRangeArr[this.dataRangeIndex].endDate,
          timeType: this.reportTypeIndex == 0 ? 2 : 1,
          statisticalMonth: moment(
            this.dataRangeArr[this.dataRangeIndex].startDate
          ).format("YYYYMM"),
          userType: this.usertype,
        };
        let data = {};
        if (this.from == "wechat") {
          data = await this.$http.get(
            {
              url:
                gHost +
                "/report-push/campus-consumer-report/queryConsumerSummaryAmount",
            },
            params
          );
        } else if (this.from == "alipay") {
          data = await this.$http.get(
            {
              header: {
                "Content-Type": "application/x-www-form-urlencoded",
              },
              url: `${az_gHost}/cloud-gateway/bill/campusConsumerReport/queryConsumerSummaryAmount`,
            },
            params
          );
        }
        if (data.code != 200) {
          uni.showToast({
            icon: "none",
            mask: true,
            title: data.msg,
          });
          return;
        }
        if (!data.obj) return;
        if (data.obj.length) {
          const tmpObj = data.obj[0];
          tmpObj.consumergrossamount_ = (tmpObj.consumergrossamount + "").split(
            "."
          );
          tmpObj.gradeavgamount_ = (tmpObj.gradeavgamount + "").split(".");
          tmpObj.schoolavgamount_ = (tmpObj.schoolavgamount + "").split(".");
          this.consumerSummaryAmountOBj = JSON.parse(JSON.stringify(tmpObj));
          // 超市和其它场景消费金额
          this.consumerSummaryAmountOBj.superAndOtherAmount =
            tmpObj.supermarketamount + tmpObj.otheramount;
          this.isEatLow =
            tmpObj.canteenamount / tmpObj.consumergrossamount < 0.5
              ? true
              : false;
          this.pieDatas = [];
          if (num) {
            this.pieDatas = [
              [
                {
                  name: "食堂",
                  value: tmpObj.canteenamount,
                },
                {
                  name: "超市",
                  value: tmpObj.supermarketamount,
                },
                {
                  name: "其他",
                  value: tmpObj.otheramount,
                },
              ],
            ];
          }
          // this.$nextTick(() => {
          //   self.piechart()
          // })
          // this.consumerAmountObj = tmpObj;
          // this.isReasonable = this.consumerAmountObj.gtgraderate >= 40 && this
          // 	.consumerAmountObj.gtgraderate <=
          // 	60 ? false : true;
          // const sortArr = this.numsort({
          // 	name: 'schoolAverageHeight',
          // 	num: this.consumerAmountObj.schoolavgamount
          // }, {
          // 	name: 'userConsumeHeight',
          // 	num: this.consumerAmountObj.consumergrossamount
          // }, {
          // 	name: 'gradeAverageHeight',
          // 	num: this.consumerAmountObj.gradeavgamount
          // });
          // const tempArr = [this.consumerAmountObj.schoolavgamount, this
          // 	.consumerAmountObj
          // 	.consumergrossamount,
          // 	this.consumerAmountObj.gradeavgamount
          // ];
          // const heightArr = Object.keys(this.counterArray(tempArr)).length == 1 ? [
          // 	139, 139, 139
          // ] : (
          // 	Object.keys(this.counterArray(tempArr)).length == 2 ? [139, 139,
          // 		160
          // 	] : [139, 160, 192]
          // );
          // sortArr.forEach(e => {
          // 	this[e.name] = heightArr[e.tag]
          // })
        }
      } catch (e) {
        //TODO handle the exception
        console.log(e);
        // uni.showToast({
        //   icon: "none",
        //   mask: true,
        //   title: e.message,
        // });
      }
    },
    livingCostType: function (a, b) {
      return a.livingCostType - b.livingCostType;
    },
    // 查询生活费额度
    async queryLivingCostsAmount() {
      try {
        // let url = gHost +
        //       "/report-push/campus-consumer-report/queryLivingCostsAmount";
        // if(this.from == 'alipay'){
        //   url = az_gHost + '/bill/campusConsumerReport/queryLivingCostsAmount'
        // }
        let params = {
          schoolId: getQueryParams("schoolId"),
          userId: getQueryParams("userId"),
          startDate: this.dataRangeArr[this.dataRangeIndex].startDate,
          endDate: this.dataRangeArr[this.dataRangeIndex].endDate,
          timeType: this.reportTypeIndex == 0 ? 2 : 1,
          statisticalMonth: moment(
            this.dataRangeArr[this.dataRangeIndex].startDate
          ).format("YYYYMM"),
          userType: this.usertype,
        };
        let data = {};
        if (this.from == "wechat") {
          data = await this.$http.get(
            {
              url:
                gHost +
                "/report-push/campus-consumer-report/queryLivingCostsAmount",
            },
            params
          );
        } else if (this.from == "alipay") {
          data = await this.$http.get(
            {
              header: {
                "Content-Type": "application/x-www-form-urlencoded",
              },
              url: `${az_gHost}/cloud-gateway/bill/campusConsumerReport/queryLivingCostsAmount`,
            },
            params
          );
        }
        // let data = await this.$http.get(
        //   {
        //     url:
        //       url,
        //   },
        //   params
        // );
        if (data.code != 200) {
          uni.showToast({
            icon: "none",
            mask: true,
            title: data.msg,
          });
          return;
        }
        if (!data.obj) return;
        if (data.obj) {
          this.consumerAmountObj = data.obj;
          // 分别取出早餐，午餐，晚餐，其他
          let nullObj = {
            mealTypeTotalAmount: 0,
            gradeMealTypeTotalAmount: 0,
            schoolMealTypeTotalAmount: 0,
            mealTypeAvgAmount: 0,
            gradeMealTypeAvgAmount: 0,
            schoolMealTypeAvgAmount: 0,
          };
          let array_ = data.obj.campusMealTypeConsumerSummaryList;
          // if (array_.length) {
          this.consumerAmountObj.campusMealTypeConsumerSummaryList = [];
          let newArr = [];

          // 早餐 mealType = 1
          let arr =
            ((array_ && array_.length) || []) &&
            array_.filter((x) => x.mealType == 1);
          if (arr.length) {
            newArr.push(arr[0]);
          } else {
            newArr.push(nullObj);
          }
          // 午餐 mealType = 2
          let arr1 =
            ((array_ && array_.length) || []) &&
            array_.filter((x) => x.mealType == 2);
          if (arr1.length) {
            newArr.push(arr1[0]);
          } else {
            newArr.push(nullObj);
          }

          // 晚餐 mealType = 3
          let arr2 =
            ((array_ && array_.length) || []) &&
            array_.filter((x) => x.mealType == 3);
          if (arr2.length) {
            newArr.push(arr2[0]);
          } else {
            newArr.push(nullObj);
          }

          // 其他 mealType = 4 夜宵 mealType = 5 夜夜宵
          let arr3 =
            ((array_ && array_.length) || []) &&
            array_.filter((x) => x.mealType == 4);
          let arr4 =
            ((array_ && array_.length) || []) &&
            array_.filter((x) => x.mealType == 5);
          if (arr3.length) {
            let obj = JSON.parse(JSON.stringify(arr3[0]));
            if (arr4.length) {
              obj.mealTypeTotalAmount =
                obj.mealTypeTotalAmount + arr[4].mealTypeTotalAmount;
              obj.gradeMealTypeTotalAmount =
                obj.gradeMealTypeTotalAmount + arr[4].gradeMealTypeTotalAmount;
              obj.schoolMealTypeTotalAmount =
                obj.schoolMealTypeTotalAmount +
                arr[4].schoolMealTypeTotalAmount;
            }
            newArr.push(obj);
          } else if (arr4.length) {
            let obj = JSON.parse(JSON.stringify(arr4[0]));
            if (arr3.length) {
              obj.mealTypeTotalAmount =
                obj.mealTypeTotalAmount + arr[3].mealTypeTotalAmount;
              obj.gradeMealTypeTotalAmount =
                obj.gradeMealTypeTotalAmount + arr[3].gradeMealTypeTotalAmount;
              obj.schoolMealTypeTotalAmount =
                obj.schoolMealTypeTotalAmount +
                arr[3].schoolMealTypeTotalAmount;
            }
            newArr.push(obj);
          }
          if (arr3.length == 0 && arr4.length == 0) {
            newArr.push(nullObj);
          }
          this.consumerAmountObj.campusMealTypeConsumerSummaryList = newArr;
          console.log(this.consumerAmountObj.campusMealTypeConsumerSummaryList);
          // } else {
          //   this.consumerAmountObj.campusMealTypeConsumerSummaryList = [];
          // }
          // return;
          // this.consumerAmountObj.sort(this.livingCostType);
          // const sortArr = this.numsort(
          //   {
          //     name: "schoolAverageHeight",
          //     num: this.consumerAmountObj[2].livingCostAmount,
          //   },
          //   {
          //     name: "gradeAverageHeight",
          //     num: this.consumerAmountObj[1].livingCostAmount,
          //   },
          //   {
          //     name: "userConsumeHeight",
          //     num: this.consumerAmountObj[0].livingCostAmount,
          //   }
          // );
          // const tempArr = [
          //   this.consumerAmountObj[2].livingCostAmount,
          //   this.consumerAmountObj[1].livingCostAmount,
          //   this.consumerAmountObj[0].livingCostAmount,
          // ];
          // const heightArr =
          //   Object.keys(this.counterArray(tempArr)).length == 1
          //     ? [139, 139, 139]
          //     : Object.keys(this.counterArray(tempArr)).length == 2
          //     ? [139, 139, 160]
          //     : [139, 160, 192];
          // sortArr.forEach((e) => {
          //   this[e.name] = heightArr[e.tag];
          // });
          // if (this.consumerAmountObj[0]) {
          //   this.livingExpensesAllowance.userConsumeAmount =
          //     this.consumerAmountObj[0].livingCostAmount; //本月
          //   this.livingExpensesAllowance.lastMonthRate =
          //     this.consumerAmountObj[0].rate;
          //   this.livingExpensesAllowance.lastMonthRateStr =
          //     this.consumerAmountObj[0].rate > 0
          //       ? this.consumerAmountObj[0].rate + "%"
          //       : this.consumerAmountObj[0].rate < 0
          //       ? this.consumerAmountObj[0].rate.toString().slice(1) + "%"
          //       : 0 + "%";
          // }
          // if (this.consumerAmountObj[1]) {
          //   this.livingExpensesAllowance.gradeAverageAmount =
          //     this.consumerAmountObj[1].livingCostAmount; //上月
          // }
          // if (this.consumerAmountObj[2]) {
          //   this.livingExpensesAllowance.schoolAverageAmount =
          //     this.consumerAmountObj[2].livingCostAmount; //上上月
          // }
        }
      } catch (e) {
        //TODO handle the exception
        console.log(e);
        // uni.showToast({
        //   icon: "none",
        //   mask: true,
        //   title: e.message,
        // });
      }
    },
    // 日消费趋势
    async queryDayConsumerTrend(num) {
      try {
        // let url = gHost +
        //       "/report-push/campus-consumer-report/queryDayConsumerTrend";
        // if(this.from == 'alipay'){
        //   url = az_gHost + "/bill/campusConsumerReport/queryDayConsumerTrend"
        // }
        let params = {
          schoolId: getQueryParams("schoolId"),
          userId: getQueryParams("userId"),
          startDate: this.dataRangeArr[this.dataRangeIndex].startDate,
          endDate: this.dataRangeArr[this.dataRangeIndex].endDate,
          timeType: this.reportTypeIndex == 0 ? 2 : 1,
          statisticalMonth: moment(
            this.dataRangeArr[this.dataRangeIndex].startDate
          ).format("YYYYMM"),
          userType: this.usertype,
        };
        let data = {};
        if (this.from == "wechat") {
          data = await this.$http.get(
            {
              url:
                gHost +
                "/report-push/campus-consumer-report/queryDayConsumerTrend",
            },
            params
          );
        } else if (this.from == "alipay") {
          data = await this.$http.get(
            {
              header: {
                "Content-Type": "application/x-www-form-urlencoded",
              },
              url: `${az_gHost}/cloud-gateway/bill/campusConsumerReport/queryDayConsumerTrend`,
            },
            params
          );
        }
        // let data = await this.$http.get(
        //   {
        //     url:
        //       url,
        //   },
        //   {
        //     schoolId: getQueryParams("schoolId"),
        //     userId: getQueryParams("userId"),
        //     startDate: this.dataRangeArr[this.dataRangeIndex].startDate,
        //     endDate: this.dataRangeArr[this.dataRangeIndex].endDate,
        //     timeType: this.reportTypeIndex == 0 ? 2 : 1,
        //     statisticalMonth: moment(
        //       this.dataRangeArr[this.dataRangeIndex].startDate
        //     ).format("YYYYMM"),
        //     userType: this.usertype,
        //   }
        // );
        if (data.code != 200) {
          uni.showToast({
            icon: "none",
            mask: true,
            title: data.msg,
          });
          return;
        }
        if (!data.obj) return;
        var exceptionDate = data.obj.exceptionDate;
        this.isAbnormal = exceptionDate.length ? true : false;
        var clues = "";
        exceptionDate.forEach((item, index) =>
          item.slice(5, 6) == "0"
            ? (clues +=
                item.slice(6, 7) +
                "月" +
                item.slice(8, 10) +
                "日" +
                (index == exceptionDate.length - 1 ? "" : "、"))
            : (clues +=
                item.slice(5, 7) +
                "月" +
                item.slice(8, 10) +
                "日" +
                (index == exceptionDate.length - 1 ? "" : "、"))
        );
        this.consumerTrend.clues = clues;
        if (num) {
          var lineDatas = data.obj.dayConsumerAmount.map((item) =>
            Object.assign(item, {
              value: item.consumerAmount,
              name: item.date.slice(5),
            })
          );
          this.lineDatas = lineDatas;
        }
      } catch (e) {
        //TODO handle the exception
        console.log(e);
        // uni.showToast({
        //   icon: "none",
        //   mask: true,
        //   title: e.message,
        // });
      }
    },
    // 饭友分析
    async queryMealPalAnalyse() {
      try {
        let data = await this.$http.get(
          {
            url:
              gHost + "/report-push/campus-consumer-report/queryMealPalAnalyse",
          },
          {
            schoolId: getQueryParams("schoolId"),
            studentId: getQueryParams("userId"),
            startDate: this.dataRangeArr[this.dataRangeIndex].startDate,
            endDate: this.dataRangeArr[this.dataRangeIndex].endDate,
            timeType: this.reportTypeIndex == 0 ? 2 : 1,
          }
        );
        if (data.code != 200) {
          // uni.showToast({
          //   icon: "none",
          //   mask: true,
          //   title: data.message,
          // });
          return;
        }
        this.mealPalData = data.obj || [];
        this.mealPalArr = this.mealPalData.length
          ? this.mealPalData.map((v) => v.mealpalname.slice(0, 1) + "**")
          : [];
        this.mealPalStr = this.mealPalArr.length
          ? this.mealPalArr.join("、")
          : "";
      } catch (e) {
        //TODO handle the exception
        console.log(e);
        // uni.showToast({
        //   icon: "none",
        //   mask: true,
        //   title: e.message,
        // });
      }
    },
    // 异常就餐日期
    mealtimeAbnormalDate(mealtype) {
      // mealtype  1 早餐  2 中餐  3 晚餐
      var breakfastArr = this.mealtimeTrendsData.filter(
        (e) => e.mealtype == mealtype
      );
      var breakfastAbnormalArr = [];
      var breakfastAbnormalStr = "";
      if (breakfastArr.length && breakfastArr[0].cateringList) {
        breakfastAbnormalArr = breakfastArr[0].cateringList
          .filter((e) => e.repastType == 2 || e.repastType == 3)
          .map((e) =>
            e.repasttime.slice(8, 9)
              ? e.repasttime.slice(8)
              : e.repasttime.slice(8, 9)
          );
        if (breakfastAbnormalArr.length > 1) {
          for (var i = 0; i < breakfastAbnormalArr.length - 1; i++) {
            breakfastAbnormalStr += breakfastAbnormalArr[i] + "日、";
          }
          breakfastAbnormalStr +=
            breakfastAbnormalArr[breakfastAbnormalArr.length - 1] + "日";
        } else if (breakfastAbnormalArr.length == 1) {
          breakfastAbnormalStr +=
            breakfastAbnormalArr[breakfastAbnormalArr.length - 1] + "日";
        }
      }
      return breakfastAbnormalStr;
    },
    // 就餐时间趋势
    async queryRepastTimeTrend() {
      try {
        let data = await this.$http.get(
          {
            url:
              gHost +
              "/report-push/campus-consumer-report/queryRepastTimeTrend",
          },
          {
            schoolId: getQueryParams("schoolId"),
            userId: getQueryParams("userId"),
            startDate: this.dataRangeArr[this.dataRangeIndex].startDate,
            endDate: this.dataRangeArr[this.dataRangeIndex].endDate,
            timeType: this.reportTypeIndex == 0 ? 2 : 1,
          }
        );
        if (data.code != 200) {
          // uni.showToast({
          //   icon: "none",
          //   mask: true,
          //   title: data.message,
          // });
          return;
        }
        if (data.obj) {
          this.mealtimeTrendsData = data.obj;
        }
        if (
          data.obj &&
          data.obj.length &&
          data.obj.filter((e) => e.mealtype == 1).length &&
          data.obj.filter((e) => e.mealtype == 1)[0].cateringList
        ) {
          this.mealtypeArr.push(1);
        }
        if (
          data.obj &&
          data.obj.length &&
          data.obj.filter((e) => e.mealtype == 2).length &&
          data.obj.filter((e) => e.mealtype == 2)[0].cateringList
        ) {
          this.mealtypeArr.push(2);
        }
        if (
          data.obj &&
          data.obj.length &&
          data.obj.filter((e) => e.mealtype == 3).length &&
          data.obj.filter((e) => e.mealtype == 3)[0].cateringList
        ) {
          this.mealtypeArr.push(3);
        }
      } catch (e) {
        //TODO handle the exception
        console.log(e);
        // uni.showToast({
        //   icon: "none",
        //   mask: true,
        //   title: e.message,
        // });
      }
    },
    // 获取公话报告
    async getPubTalkReport() {
      try {
        let data = await this.$http.post(
          {
            url:
              gHost +
              "/report-push/vpt-web-report/pubTalkReport/getPubTalkReport",
          },
          {
            schoolId: getQueryParams("schoolId"),
            studentId: getQueryParams("userId"),
            startDate: this.dataRangeArr[this.dataRangeIndex].startDate,
            endDate: this.dataRangeArr[this.dataRangeIndex].endDate,
          }
        );
        if (data.code != 0) {
          // uni.showToast({
          //   icon: "none",
          //   mask: true,
          //   title: data.message,
          // });
          return;
        }
        this.pubTalkReport = data.data || {};
        if (!this.pubTalkReport.talkText5 && !this.pubTalkReport.talkText9) {
          this.pubTalkSummaryHeight = 275;
        } else if (
          this.pubTalkReport.talkText5 &&
          !this.pubTalkReport.talkText9
        ) {
          this.pubTalkSummaryHeight = 387;
        } else {
          this.pubTalkSummaryHeight = 525;
        }
      } catch (e) {
        //TODO handle the exception
        console.log(e);
        // uni.showToast({
        //   icon: "none",
        //   mask: true,
        //   title: e.message,
        // });
      }
    },
    // 出入校报告
    // 统计异常天数
    async statisAttendanceAbnormal() {
      try {
        let data = await this.$http.post(
          {
            url:
              gHost + "/report-push/attemdance-report/statisAttendanceAbnormal",
          },
          {
            schoolId: getQueryParams("schoolId"),
            userId: getQueryParams("userId"),
            startTime: this.dataRangeArr[this.dataRangeIndex].startDate,
            endTime: this.dataRangeArr[this.dataRangeIndex].endDate,
            classId: this.userInfo.classId,
          }
        );
        if (data.code != 200) {
          // uni.showToast({
          //   icon: "none",
          //   mask: true,
          //   title: data.message,
          // });
          return;
        }
        this.attendanceReport = data.data || {};
      } catch (e) {
        //TODO handle the exception
        console.log(e);
        // uni.showToast({
        //   icon: "none",
        //   mask: true,
        //   title: e.message,
        // });
      }
    },
    // 出入情况明细
    async attendanceReprotDatail(currentDate) {
      try {
        let data = await this.$http.post(
          {
            url:
              gHost + "/report-push/attemdance-report/attendanceReprotDatail",
          },
          {
            schoolId: getQueryParams("schoolId"),
            userId: getQueryParams("userId"),
            currentDate,
            classId: this.userInfo.classId,
          }
        );
        if (data.code != 200) {
          // uni.showToast({
          //   icon: "none",
          //   mask: true,
          //   title: data.message,
          // });
          return;
        }
        var tempList = data.data;
        if (tempList && tempList.length) {
          tempList.forEach((e) => {
            if (
              e.attendDetailReportDTOList &&
              e.attendDetailReportDTOList.length
            ) {
              e.attendDetailReportDTOList.forEach((c) => {
                c.border =
                  c.describeContent && c.describeContent != "当日早到冠军"
                    ? "4rpx solid #F9793F"
                    : "4rpx solid rgba(0, 0, 0, 0.25)";
              });
            }
          });
          this.attendanceReportDatail = tempList || [];
        } else {
          this.attendanceReportDatail = [];
        }
      } catch (e) {
        //TODO handle the exception
        console.log(e);
        // uni.showToast({
        //   icon: "none",
        //   mask: true,
        //   title: e.message,
        // });
      }
    },
    // 是否开通会员功能
    async queryIsDredgeMember(serviceItemCode, num) {
      try {
        let data = await this.$http.get(
          {
            url: gHost + "/report-push/member-info/queryIsDredgeMember",
          },
          {
            schoolId: getQueryParams("schoolId"),
            userId: getQueryParams("userId"),
            serviceItemCode,
          }
        );
        if (data.code != 200) {
          uni.showToast({
            icon: "none",
            mask: true,
            title: data.msg,
          });
          return;
        }
        switch (serviceItemCode) {
          case 1002:
            // this.isOpen = (data.obj && data.obj.status) || false;
            this.isOpen = true;
            if (!this.isOpen) {
              this.flag = 1;
            }
            break;
          case 2002:
            this.isPubTalkOpen = (data.obj && data.obj.status) || false;
            if (this.isPubTalkOpen) {
              if (this.from == "alipay") {
                // 支付宝消费会员到期日
                this.QueryProductContractItemDetailResp();
              } else {
                // 微信消费会员到期日
                this.queryMemberValidTime(serviceItemCode);
              }
              this.containerHeight = 2765 + this.pubTalkSummaryHeight;
              this.flag = 0;
            } else {
              this.queryMemberConsumerAmount(serviceItemCode);
              this.containerHeight = 1605 + this.pubTalkSummaryHeight;
              this.pubTalkNoopenHeight = 735 + this.pubTalkSummaryHeight;
              this.flag = 3;
            }
            break;
          case 3002:
            this.isAttendanceOpen = (data.obj && data.obj.status) || false;
            if (this.isAttendanceOpen) {
              if (this.from == "alipay") {
                // 支付宝消费会员到期日
                this.QueryProductContractItemDetailResp();
              } else {
                // 微信消费会员到期日
                this.queryMemberValidTime(serviceItemCode);
              }
              this.containerHeight = 2762;
              this.flag = 0;
            } else {
              this.queryMemberConsumerAmount(serviceItemCode);
              this.containerHeight = 1974;
              this.flag = 2;
            }
            break;
        }
        if (num == 1) {
          //   if (this.isOpen) {
          // if (true) {
          if (this.from == "alipay") {
            // 支付宝消费会员到期日
            this.QueryProductContractItemDetailResp();
          } else {
            // 微信消费会员到期日
            this.queryMemberValidTime(serviceItemCode);
          }
          this.containerHeight = 4200;
          this.flag = 0;
          // } else {
          //   this.queryMemberConsumerAmount(serviceItemCode);
          //   this.containerHeight = 2207;
          // }
        }
      } catch (e) {
        //TODO handle the exception
        console.log(e);
        // uni.showToast({
        //   icon: "none",
        //   mask: true,
        //   title: e.message,
        // });
      }
    },
    // 查询是否开通服务项（入口展示服务项）
    async queryMemberServcieItem() {
      try {
        let data = await this.$http.get(
          {
            url: gHost + "/report-push/member-info/queryMemberServcieItem",
          },
          {
            schoolId: getQueryParams("schoolId"),
            userId: getQueryParams("userId"),
          }
        );
        if (data.code != 200) {
          // uni.showToast({
          //   icon: "none",
          //   mask: true,
          //   title: data.msg,
          // });
          return;
        }
        const tempList = data.obj || [];
        if (tempList.length) {
          this.queryMemberServcieItemList = tempList.map((e) => e.serviceCode);
        } else {
          this.queryMemberServcieItemList = [];
        }
      } catch (e) {
        //TODO handle the exception
        console.log(e);
        // uni.showToast({
        //   icon: "none",
        //   mask: true,
        //   title: e.message,
        // });
      }
    },
    // 查询会员消费金额
    async queryMemberConsumerAmount(serviceItemCode) {
      try {
        let data = await this.$http.get(
          {
            url: gHost + "/report-push/member-info/queryMemberConsumerAmount",
          },
          {
            schoolId: getQueryParams("schoolId"),
            userId: getQueryParams("userId"),
            serviceItemCode,
          }
        );
        if (data.code != 200) {
          uni.showToast({
            icon: "none",
            mask: true,
            title: data.msg,
          });
          return;
        }
        this.memberInfo.leastAmount = data.obj.leastAmount;
      } catch (e) {
        //TODO handle the exception
        console.log(e);
        // uni.showToast({
        //   icon: "none",
        //   mask: true,
        //   title: e.message,
        // });
      }
    },
    // 查询消费会员权益项
    async QueryProductContractItemDetailResp(serviceItemCode = "1002") {
      const data = await requestPost(
        "/cgi-xpay/app/h5/QueryProductContractItemDetail",
        {
          accountId: this.homeDataInfo["accountId"],
          serviceItemCode,
        }
      );
      if (data["code"] != 200) {
        // await Dialog({
        //   title: "温馨提示",
        //   message: data["message"],
        //   confirmButtonText: "知道了",
        // });
        uni.showToast({
          icon: "none",
          mask: true,
          title: data.message,
        });
        return;
      }
      this.memberInfo.invalidDateStr = data.data.expiredDt
        ? moment(data.data.expiredDt).format("YYYY年MM月DD日")
        : "";
      this.memberInfo.differDay = data.data.daysRemaining || 0;
      this.memberInfo.invalidDate = data.data.expiredDt;
    },
    // 查询会员有效期
    async queryMemberValidTime(serviceItemCode) {
      try {
        let url = gHost + "/report-push/member-info/queryMemberValidTime";
        let data = await this.$http.get(
          {
            url: url,
          },
          {
            schoolId: getQueryParams("schoolId"),
            userId: getQueryParams("userId"),
            serviceItemCode,
          }
        );
        if (data.code != 200) {
          uni.showToast({
            icon: "none",
            mask: true,
            title: data.msg,
          });
          return;
        }
        this.memberInfo.differDay = data.obj.differDay;
        this.memberInfo.invalidDate = data.obj.invalidDate;
        if (data.obj.invalidDate) {
          let month =
            data.obj.invalidDate.slice(5, 6) == 0
              ? data.obj.invalidDate.slice(6, 7)
              : data.obj.invalidDate.slice(5, 7);
          let date =
            data.obj.invalidDate.slice(8, 9) == 0
              ? data.obj.invalidDate.slice(9)
              : data.obj.invalidDate.slice(8);
          this.memberInfo.invalidDateStr =
            data.obj.invalidDate.slice(0, 4) +
            "年" +
            month +
            "月" +
            date +
            "日";
        } else {
          this.memberInfo.invalidDateStr = "";
        }
      } catch (e) {
        //TODO handle the exception
        console.log(e);
        // uni.showToast({
        //   icon: "none",
        //   mask: true,
        //   title: e.message,
        // });
      }
    },
    // 跳转云平台权益中心-微信
    async openAzMenber() {
      jWeixin.miniProgram.navigateTo({
        url: "/pages_subpackB/pages/ToCloudOrder/ToCloudOrder",
      });
    },
    // 跳转云平台权益中心-支付宝
    async openAzMenber_() {
      my.navigateTo({
        url: "/pages/ToCloudOrder/ToCloudOrder",
      });
    },
    // equityPay: function () {
    //   // jWeixin.miniProgram.switchTab({
    //   //   url: `/pages/Member/main`,
    //   //   success: function success() {
    //   //     console.log("skip success");
    //   //   },
    //   //   fail: function fail(_fail) {
    //   //     console.warn(_fail);
    //   //     uni.showModal({
    //   //       content: JSON.stringify(_fail),
    //   //     });
    //   //   },
    //   // });
    //   jWeixin.miniProgram.navigateTo({
    //     url: "/pages/nationalCenterForLesbianRights/index?productId=3",
    //   });
    // },
    imageClick: function (src) {
      this.imageDialogSrc = src;
      this.imageDialogShow = true;
    },
  },
};
</script>

<style lang="scss" scoped>
uni-page-wrapper {
  background: #f0f1f1;
}
.costReport {
  width: 100%;
  display: flex;
  flex-direction: column;
  background: #f0f1f1;
  .costReportIMG1 {
    width: 750rpx;
    height: 1411rpx;
  }
  .costReportIMG2 {
    width: 690rpx;
    height: 1031rpx;
    margin: 0 auto;
    margin-bottom: 17rpx;
  }
  .costReportIMG3 {
    width: 691rpx;
    height: 1536rpx;
    margin: 0 auto;
    margin-bottom: 9rpx;
  }
  .costReportIMG4 {
    width: 691rpx;
    height: 594rpx;
    margin: 0 auto;
    margin-bottom: 8rpx;
  }
  .costReportIMG5 {
    width: 691rpx;
    height: 1434rpx;
    margin: 0 auto;
    margin-bottom: 163rpx;
  }
  .costReportIMG6 {
    width: 742rpx;
    height: 155rpx;
    margin: 0 auto;
    position: fixed;
    bottom: 0;
    left: 0;
    right: 0;
    background: #f0f1f1;
  }
}
.nodata {
  position: absolute;
  left: 50%;
  top: 0%;
  width: 100%;
  transform: translate(-50%, 0);

  .nodataImg {
    width: 100%;
    text-align: center;
  }

  .nodataTxt {
    margin-top: -100rpx;
    display: flex;
    justify-content: center;
    font-size: 30rpx;
    font-family: PingFang SC;
    font-weight: 500;
    color: #999999;
  }
}

.htmlCanvasTxt {
  height: 154rpx;
  width: 100%;
  padding: 42rpx 0 20rpx 29rpx;
  box-sizing: border-box;

  .htmlCanvasTxt1 {
    font-size: 32rpx;
    font-family: PingFangSC-Semibold, PingFang SC;
    font-weight: 600;
    color: #ffffff;
    line-height: 44rpx;
  }

  .htmlCanvasTxt2 {
    font-size: 26rpx;
    font-family: PingFangSC-Regular, PingFang SC;
    font-weight: 400;
    color: #ffffff;
    line-height: 44rpx;
  }
}

.htmlCanvasBox {
  overflow: scroll;
  height: 943rpx;
  border-radius: 30rpx;
  margin: 0 24rpx 25rpx;
}

.tainer {
  position: relative;
  background: #f0f1f1;

  .school-report-header-bg {
    width: 750rpx;
    height: 741rpx;
    background: no-repeat center/100%
      url(https://xiaopay2020.oss-cn-shenzhen.aliyuncs.com/static/weapp/SchoolReport/costReportIMG7.png);
    position: relative;
    margin-top: -80rpx;
  }

  .school-report-header-position {
    width: 100%;
    height: 120rpx;
    padding: 40rpx 0 0 32rpx;
    box-sizing: border-box;
    position: fixed;
    top: 0;
    left: 0;
    z-index: 1000;
    background: #fef1d7;

    .school-report-header {
      height: 65rpx;
      display: flex;
      justify-content: space-between;
      position: relative;
      background: #fef1d7;
      margin-bottom: 13rpx;
      margin-left: -32rpx;
      padding-left: 32rpx;

      .school-report-header-item {
        display: flex;

        .user-avatar {
          width: 64rpx;
          height: 65rpx;
          min-width: 64rpx;
          min-height: 65rpx;
          background: no-repeat center/100%
            url(https://xiaopay2020.oss-cn-shenzhen.aliyuncs.com/static/weapp/SchoolReport/avatar_.png);
        }

        // .user-info {
        //   display: flex;
        //   flex-direction: column;
        //   justify-content: space-between;
        //   margin-left: 18rpx;

        .user-name {
          margin-left: 18rpx;
          width: 200rpx;
          font-size: 34rpx;
          font-family: PingFangSC-Medium, PingFang SC;
          font-weight: 500;
          color: rgba(0, 0, 0, 0.85);
          white-space: nowrap;
          text-overflow: ellipsis;
          line-height: 65rpx;
        }

        .class-name {
          width: 200rpx;
          font-size: 28rpx;
          font-family: PingFangSC-Medium, PingFang SC;
          font-weight: 500;
          color: rgba(0, 0, 0, 0.25);
          white-space: nowrap;
          text-overflow: ellipsis;
        }
        // }

        .school-report-screen {
          display: flex;

          .school-report-screen-item {
            width: 156rpx;
            display: flex;
            justify-content: center;
            align-items: center;

            .school-report-type {
              font-size: 28rpx;
              font-family: PingFangSC-Medium, PingFang SC;
              font-weight: 500;
              color: #1b1b1b;
              margin-right: 12rpx;
            }

            .triangle {
              width: 21rpx;
              height: 10rpx;
              background: no-repeat center/100%
                url(https://xiaopay2020.oss-cn-shenzhen.aliyuncs.com/static/weapp/SchoolReport/grayTriangle.png);
            }
          }

          .school-report-screen-item-two {
            width: 270rpx;
            display: flex;
            justify-content: center;
            align-items: center;

            .school-report-date {
              font-size: 28rpx;
              font-family: PingFangSC-Medium, PingFang SC;
              font-weight: 500;
              color: #1b1b1b;
              margin-right: 17rpx;
            }

            .triangle {
              width: 21rpx;
              height: 10rpx;
              background: no-repeat center/100%
                url(https://xiaopay2020.oss-cn-shenzhen.aliyuncs.com/static/weapp/SchoolReport/grayTriangle.png);
            }
          }
        }
      }
    }

    .school-report-context-tab {
      height: 84rpx;
      box-sizing: border-box;
      display: flex;
      justify-content: space-between;

      .school-report-context-tab-item {
        display: flex;

        .school-report-context-tab-item-one {
          width: 172rpx;
          border-radius: 20rpx 20rpx 0rpx 0rpx;
          font-size: 30rpx;
          font-family: PingFangSC-Semibold, PingFang SC;
          color: rgba(0, 0, 0, 0.85);
          display: flex;
          align-items: center;
          flex-direction: column;

          &.active {
            background: #e4f9f2;
            font-weight: 600;
          }

          .tab-title {
            margin: 20rpx 0 10rpx;
          }

          .active-bottomline {
            width: 49rpx;
            height: 7rpx;
            background: #04b871;
            border-radius: 4rpx;
          }
        }
      }

      .school-report-context-tab-item-two {
        width: 155rpx;
        margin: 8rpx 0 0;

        .share-button {
          width: 155rpx;
          height: 64rpx;
          background: linear-gradient(#ff6d2e 0%, #ff9946 100%);
          border-radius: 32px 0px 0px 32px;
          display: flex;
          justify-content: center;
          align-items: center;
          margin-right: 38rpx;

          .share-button-img {
            width: 26rpx;
            height: 26rpx;
            background: no-repeat center/100%
              url(https://xiaopay2020.oss-cn-shenzhen.aliyuncs.com/static/weapp/SchoolReport/share_.png);
            margin-right: 11rpx;
          }

          .share-button-txt {
            font-size: 28rpx;
            font-family: PingFangSC-Semibold, PingFang SC;
            color: #fef1d7;
          }
        }
      }
    }
  }

  .school-report-context {
    width: 100%;
    display: flex;
    flex-direction: column;
    position: relative;
    background: #f0f1f1;
    .consumer-report-bgImg {
      width: 100%;
      height: 452rpx;
      background: no-repeat center/100%
        url(https://xiaopay2020.oss-cn-shenzhen.aliyuncs.com/static/weapp/SchoolReport/consumeReportBg.png);
    }

    .attendance-report-bgImg {
      width: 100%;
      height: 452rpx;
      background: no-repeat center/100%
        url(https://xiaopay2020.oss-cn-shenzhen.aliyuncs.com/static/weapp/SchoolReport/attendanceReportBg.png);
    }

    .pubTalk-report-bgImg {
      width: 100%;
      height: 452rpx;
      background: no-repeat center/100%
        url(https://xiaopay2020.oss-cn-shenzhen.aliyuncs.com/static/weapp/SchoolReport/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(https://xiaopay2020.oss-cn-shenzhen.aliyuncs.com/static/weapp/SchoolReport/cardBg.png);
      //   font-size: 32rpx;
      //   font-family: PingFangSC-Semibold, PingFang SC;
      //   font-weight: 600;
      //   color: rgba(0, 0, 0, 0.85);
      //   line-height: 45rpx;
      //   display: flex;
      //   justify-content: center;
      //   align-items: center;
      // }
      .school-report-context-card-title-img1 {
        width: 340rpx;
        height: 63rpx;
        background: no-repeat center/100%
          url(https://xiaopay2020.oss-cn-shenzhen.aliyuncs.com/static/weapp/SchoolReport/costReportIMG10.png);
      }
      .school-report-context-card-title-img2 {
        width: 340rpx;
        height: 63rpx;
        background: no-repeat center/100%
          url(https://xiaopay2020.oss-cn-shenzhen.aliyuncs.com/static/weapp/SchoolReport/costReportIMG11.png);
      }
      .school-report-context-card-title-img3 {
        width: 329rpx;
        height: 63rpx;
        background: no-repeat center/100%
          url(https://xiaopay2020.oss-cn-shenzhen.aliyuncs.com/static/weapp/SchoolReport/costReportIMG12.png);
      }
      .school-report-context-card-title-img4 {
        width: 328rpx;
        height: 62rpx;
        background: no-repeat center/100%
          url(https://xiaopay2020.oss-cn-shenzhen.aliyuncs.com/static/weapp/SchoolReport/costReportIMG13.png);
      }
    }
    .school-report-context-card-one-context-nodata {
      box-sizing: border-box;
      display: flex;
      align-items: center;
      flex-direction: column;
      padding: 80rpx 0 0;
      box-sizing: border-box;

      .card-one-nodata-img {
        width: 362rpx;
        height: 176rpx;

        image {
          width: 100%;
          height: 100%;
        }
      }

      .card-one-nodata-txt {
        height: 40rpx;
        font-size: 28rpx;
        font-family: PingFangSC-Regular, PingFang SC;
        font-weight: 400;
        color: rgba(0, 0, 0, 0.45);
        line-height: 40rpx;
        margin-top: -11rpx;
      }
    }
    .school-report-context-card {
      width: 100%;
      padding: 0 30rpx;
      margin-top: -73rpx;
      box-sizing: border-box;

      .school-report-context-card-one {
        width: 100%;
        background: #ffffff;
        border-radius: 16rpx;
        margin-bottom: 24rpx;
        height: 570rpx;
        display: flex;
        justify-content: center;
        position: relative;

        .consumer-report-img {
          width: 428rpx;
          height: 428rpx;
          background: no-repeat center/100%
            url(https://xiaopay2020.oss-cn-shenzhen.aliyuncs.com/static/weapp/SchoolReport/costReportIMG8.png);
          position: absolute;
          top: -170rpx;
        }

        .attendance-report-img {
          width: 428rpx;
          height: 428rpx;
          background: no-repeat center/100%
            url(https://xiaopay2020.oss-cn-shenzhen.aliyuncs.com/static/weapp/SchoolReport/attendanceReport.png);
          position: absolute;
          top: -172rpx;
          left: 160rpx;
        }

        .pubTalk-report-img {
          width: 428rpx;
          height: 428rpx;
          background: no-repeat center/100%
            url(https://xiaopay2020.oss-cn-shenzhen.aliyuncs.com/static/weapp/SchoolReport/pubTalkReport.png);
          position: absolute;
          top: -172rpx;
          left: 160rpx;
        }

        .school-report-context-card-one-context {
          align-self: center;
          margin-top: 121rpx;
          width: 100%;

          .school-report-context-card-one-context-item {
            display: inline-flex;
            line-height: 40rpx;

            .school-report-context-card-one-context-dot {
              margin-left: 27rpx;
              height: 40rpx;
              display: flex;
              align-items: center;

              .school-report-context-card-one-context-dot-item {
                width: 10rpx;
                height: 10rpx;
                background: #fbb535;
                border-radius: 10rpx;
                align-self: center;
                margin-right: 16rpx;
              }
            }

            .school-report-context-card-one-context-txt {
              line-height: 40rpx;
              margin-bottom: 22rpx;
              font-size: 28rpx;
              padding-right: 32rpx;

              .txt-important {
                color: #ef7b00;
                margin: 0 4rpx;
              }

              .txt-important-two {
                color: #ef7b00;
              }
            }

            &.school-report-context-card-one-context-item-last {
              margin: 0;
            }
          }
        }

        .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: #ef7b00;
              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: #ef7b00;
                border-radius: 10rpx;
                margin-right: 16rpx;
              }
            }

            .pubTalk-report-context-card-one-context-txt {
              line-height: 40rpx;

              .txt-important {
                color: #ef7b00;
                margin: 0 4rpx;
              }

              .txt-important-two {
                color: #ef7b00;
              }
            }

            &.pubTalk-report-context-card-one-context-item-last {
              margin: 0;
            }
          }
        }
      }

      .school-report-context-card-two {
        background: #ffffff;
        border-radius: 16rpx;
        margin-bottom: 40rpx;
        padding-bottom: 46rpx;
        .school-report-context-card-one-context-txt {
          line-height: 40rpx;
          font-size: 28rpx;
          padding: 0 32rpx;
          margin: 18rpx 0 22rpx;

          .txt-important {
            color: #ef7b00;
            margin: 0 4rpx;
          }

          .txt-important-two {
            color: #ef7b00;
          }
        }
        .school-report-context-card-nodata {
          height: 40rpx;
          font-size: 28rpx;
          font-family: PingFangSC-Medium, PingFang SC;
          font-weight: 500;
          color: #000000;
          line-height: 40rpx;
          margin: 40rpx 0 0;
          padding-left: 30rpx;
          margin-bottom: 31rpx;
        }

        .school-report-context-card-two-conclusion {
          height: 40rpx;
          padding: 0 40rpx 0 30rpx;
          box-sizing: border-box;
          margin: 0 0 32rpx;
          display: flex;
          justify-content: space-between;
          font-size: 28rpx;
          font-family: PingFangSC-Medium, PingFang SC;
          font-weight: 500;
          color: rgba(0, 0, 0, 0.85);

          .school-report-context-card-two-conclusion-txt {
            .abnormal-days {
              color: #f9793f;
              margin: 0 5rpx;
            }
          }

          .school-report-context-card-two-conclusion-logo {
            display: flex;

            .school-report-context-card-two-conclusion-logo-item {
              font-size: 28rpx;
              font-family: PingFangSC-Medium, PingFang SC;
              font-weight: 500;
              color: #f9793f;
              display: flex;
              align-items: center;

              .school-report-context-card-two-conclusion-logo-item-dot {
                width: 12rpx;
                height: 12rpx;
                background: #f9793f;
                border-radius: 12rpx;
              }

              &.school-report-context-card-two-conclusion-logo-item-right {
                margin-left: 14rpx;
              }
            }
          }
        }

        .school-report-context-card-two-calendar {
          position: relative;
          .zan {
            width: 276rpx;
            height: 277rpx;
            position: absolute;
            left: 50%;
            top: 50%;
            margin-top: -138.5rpx;
            margin-left: -138rpx;
            .costReportIMG27 {
              width: 276rpx;
              height: 277rpx;
            }
          }
          // height: 575rpx;
          // width: 690rpx;
          /deep/ .van-calendar__header {
            background: #faf8f7;
            box-shadow: none;
          }
          /deep/ .van-calendar__weekdays {
            background: #faf8f7;
            height: 74rpx;
          }

          /deep/ .van-calendar__weekday {
            text-align: left;
            padding-left: 30rpx;
            box-sizing: border-box;
            line-height: 74rpx !important;
          }

          /deep/ .van-calendar__weekday:first-of-type {
            color: rgba(0, 0, 0, 0.25);
          }

          /deep/ .van-calendar__weekday:last-of-type {
            color: rgba(0, 0, 0, 0.25);
          }

          /deep/ .van-calendar__month-title {
            display: none;
          }

          /deep/ .van-calendar__days {
            // margin: 20rpx 0 0;
            padding-left: 16rpx;
            text-align: center;
            padding-top: 20rpx;
            overflow: hidden;
          }

          /deep/ .van-calendar__day {
            margin: 0 0 8rpx;
            border-radius: 22rpx;
            display: flex;
            align-items: center;
          }

          /deep/ .van-calendar__selected-day {
            background: #fe7a34;
            color: white;
            display: flex;
            align-items: center;
            border-radius: 22rpx;
          }
          /deep/ .van-calendar__day.notice-day .van-calendar__selected-day {
            align-items: normal;
            line-height: 120rpx;
          }
          /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: 12rpx 0 4rpx;
          }
          /deep/ .van-calendar__selected-day .van-calendar__top-info {
            color: white !important;
          }
          /deep/ .notice-day {
            color: #f9793f;
            background: rgba(249, 121, 63, 0.1);
            border-radius: 22rpx;
            width: 84rpx;
            height: 84rpx;
            margin-right: 14rpx;
            display: flex;
            align-items: normal;
            line-height: 120rpx;
          }
        }
        .school-report-context-card-two-exception {
          margin-top: 24rpx;
          width: 100%;
          display: flex;
          flex-direction: column;
          .space {
            width: 100%;
            height: 22rpx;
            padding-left: 79rpx;
            .arrow {
              width: 31rpx;
              height: 22rpx;
            }
          }
          .exceptionContent {
            background: #faf8f7;
            border-radius: 0px 0px 16rpx 16rpx;
            display: flex;
            flex-direction: column;
            padding: 0 30rpx 46rpx 30rpx;
            .date {
              width: 100%;
              height: 43rpx;
              margin-top: 25rpx;
              margin-bottom: 34rpx;
              .dateBlock {
                width: 130rpx;
                height: 43rpx;
                border-radius: 4rpx;
                border: 1rpx solid #fe7a34;
                text-align: center;
                font-size: 28rpx;
                color: #fe7a34;
                line-height: 43rpx;
              }
            }
            .breakfast {
              width: 100%;

              display: inline-flex;
              line-height: 46rpx;
              font-weight: 500;
              font-size: 28rpx;
              color: rgba(0, 0, 0, 0.85);
              margin-bottom: 25rpx;
              .mealtype {
                display: flex;
                flex-direction: column;
                margin-left: 24rpx;

                .firstLine {
                  width: 100%;
                  height: 46rpx;
                  line-height: 46rpx;
                  font-size: 28rpx;
                  color: #f45a14;
                  display: inline-flex;
                  background: #ffe7db;
                  border-radius: 5rpx;
                  padding-left: 14rpx;
                  padding-right: 11rpx;
                }
                .img {
                  align-self: center;
                  margin-right: 10rpx;
                }
                .costReportIMG24 {
                  width: 28rpx;
                  height: 23rpx;
                }
                .costReportIMG25 {
                  width: 26rpx;
                  height: 26rpx;
                }
                .secondLine {
                  width: 100%;
                  height: 37rpx;
                  margin-top: 13rpx;
                  margin-bottom: 6rpx;
                  display: inline-flex;
                  font-size: 26rpx;
                  color: rgba(0, 0, 0, 0.85);
                  line-height: 37rpx;
                }
                .ml12 {
                  margin-left: 12rpx;
                }
                .ml16 {
                  margin-left: 16rpx;
                }
              }
            }
            .tips {
              margin: 0 auto;
              width: 622rpx;
              height: 218rpx;
              background: #f0f0f0;
              display: flex;
              flex-direction: column;
              border-radius: 16rpx;

              .what {
                margin-top: 18rpx;
                font-size: 26rpx;
                color: rgba(0, 0, 0, 0.85);
                height: 37rpx;
                line-height: 37rpx;
                padding-left: 25rpx;
                display: inline-flex;

                .question {
                  width: 24rpx;
                  height: 24rpx;
                  margin-right: 8rpx;
                  align-self: center;
                }
              }

              .tipBlock {
                margin-top: 9rpx;
                margin-left: 38rpx;
                width: calc(100% - 38rpx);
                display: flex;
                flex-direction: column;
                font-size: 22rpx;
                margin-top: 9rpx;
                line-height: 34rpx;
                color: rgba(0, 0, 0, 0.5);

                .dotLine {
                  height: 34rpx;
                  display: inline-flex;

                  .dot {
                    align-self: center;
                    width: 7rpx;
                    height: 7rpx;
                    border-radius: 50%;
                    background: rgba(0, 0, 0, 0.5);
                    margin-right: 10rpx;
                  }
                }
              }
            }
          }
        }
        .school-report-context-card-two-details {
          height: 132rpx;
          background: no-repeat center/100%
            url(https://xiaopay2020.oss-cn-shenzhen.aliyuncs.com/static/weapp/SchoolReport/diningSituations.png);
          padding: 55rpx 42rpx 30rpx 29rpx;
          box-sizing: border-box;
          border-radius: 0 0 16rpx 16rpx;

          .school-report-context-card-two-details-item {
            display: flex;
            height: 43rpx;

            .school-report-context-card-two-details-date {
              width: 130rpx;
              height: 43rpx;
              line-height: 43rpx;
              border-radius: 8rpx;
              border: 1rpx solid #04b871;
              font-size: 28rpx;
              font-family: FontName;
              font-weight: 700;
              font-style: italic;
              color: #04b871;
              margin-right: 65rpx;
              display: flex;
              justify-content: center;
              white-space: nowrap;
            }

            .school-report-context-card-two-details-meal {
              display: flex;

              .school-report-context-card-two-details-meal-txt {
                width: 56rpx;
                margin-right: 8rpx;
                font-size: 28rpx;
                font-family: PingFangSC-Medium, PingFang SC;
                font-weight: 500;
                color: rgba(0, 0, 0, 0.85);
                line-height: 40rpx;
              }

              .school-report-context-card-two-details-meal-logo {
                display: flex;
                align-items: center;
                margin-right: 48rpx;

                &.school-report-context-card-two-details-meal-logo-two {
                  margin-right: 56rpx;
                }

                &.school-report-context-card-two-details-meal-logo-three {
                  margin: 0;
                }

                .school-report-context-card-two-details-meal-img {
                  width: 48rpx;
                  height: 40rpx;

                  image {
                    height: 100%;
                    width: 100%;
                    max-height: 100%;
                    max-width: 100%;
                  }
                }

                .school-report-context-card-two-details-meal-noeat {
                  width: 40rpx;
                  height: 40rpx;
                  background: rgba(249, 121, 63, 0.17);
                  border-radius: 12rpx;
                  font-size: 24rpx;
                  font-family: PingFangSC-Medium, PingFang SC;
                  font-weight: 500;
                  color: #f9793f;
                  display: flex;
                  justify-content: center;
                  align-items: center;
                }
              }
            }
          }
        }
      }

      .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;
          width: 690rpx;

          .mark-green {
            color: #04b871;
          }

          .mark-orange {
            color: #f9793f;
          }

          .mark-yellow {
            color: #daa000;
          }

          /deep/ .van-calendar__weekdays {
            background: #f7faf8;
          }

          /deep/ .van-calendar__weekday {
            text-align: left;
            padding-left: 30rpx;
            box-sizing: border-box;
          }

          /deep/ .van-calendar__weekday:first-of-type {
            color: rgba(0, 0, 0, 0.25);
          }

          /deep/ .van-calendar__weekday:last-of-type {
            color: rgba(0, 0, 0, 0.25);
          }

          /deep/ .van-calendar__month-title {
            display: none;
          }

          /deep/ .van-calendar__days {
            margin: 10rpx 0 0;
          }

          /deep/ .van-calendar__day {
            margin: 0 0 8rpx;
            border-radius: 22rpx;
            display: flex;
            align-items: flex-end;
          }

          /deep/ .van-calendar__selected-day {
            background: rgba(0, 0, 0, 0.1);
            color: #f9793f;
            display: flex;
            align-items: flex-end;
            border-radius: 22rpx;
          }

          /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: 12rpx 0 4rpx;
          }

          /deep/ .late-day {
            color: #f9793f;
            background: rgba(249, 121, 63, 0.1);
            border-radius: 22rpx;
            width: 88rpx;
            height: 88rpx;
            margin-left: 10rpx;
          }

          /deep/ .leave-day {
            color: #04b871;
            background: rgba(4, 184, 113, 0.09);
            border-radius: 22rpx;
            width: 88rpx;
            height: 88rpx;
            margin-left: 10rpx;
          }

          /deep/ .champion-day {
            color: #daa000;
            background: url(https://xiaopay2020.oss-cn-shenzhen.aliyuncs.com/static/weapp/SchoolReport/champion.png)
              no-repeat -4rpx center/100%;
            border-radius: 22rpx;
            width: 88rpx;
            height: 88rpx;
            margin-left: 10rpx;
          }

          /deep/ .progress-day {
            color: #daa000;
            background: url(https://xiaopay2020.oss-cn-shenzhen.aliyuncs.com/static/weapp/SchoolReport/progress.png)
              no-repeat -2rpx center/100%;
            border-radius: 22rpx;
            width: 88rpx;
            height: 88rpx;
            margin-left: 10rpx;
          }
        }
      }

      .attendance-report-context-details {
        .attendance-report-context-card-two-details {
          position: relative;
          height: 146rpx;
          background: #f5f7f7;
          padding: 28rpx 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(https://xiaopay2020.oss-cn-shenzhen.aliyuncs.com/static/weapp/SchoolReport/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: 8rpx;
              border: 1rpx solid #04b871;
              font-size: 28rpx;
              font-family: FontName;
              font-weight: 700;
              font-style: italic;
              color: #04b871;
              display: flex;
              justify-content: center;
              align-items: center;
            }
          }
        }

        .attendance-report-context-card-three {
          background: #f5f7f7;
          margin: -40rpx 0 0;
          position: relative;
          border-radius: 0 0 16rpx 16rpx;

          .attendance-report-details {
            width: 572rpx;
            height: 168rpx;

            .dashed-line-box {
              position: relative;
              top: -40rpx;
              width: 16rpx;
              height: 212rpx;

              .dashed-line-first {
                width: 2rpx;
                height: 66rpx;
                border-left: 2rpx dashed rgba(0, 0, 0, 0.25);
                position: absolute;
                left: 44rpx;
              }

              .attendance-report-dot-first {
                width: 16rpx;
                height: 16rpx;
                background: #ffffff;
                border: 4rpx solid rgba(0, 0, 0, 0.25);
                border-radius: 16rpx;
                position: absolute;
                top: 66rpx;
                left: 34rpx;
              }

              .dashed-line {
                width: 2rpx;
                height: 146rpx;
                border-left: 2rpx dashed rgba(0, 0, 0, 0.25);
                position: absolute;
                left: 44rpx;
                top: -76rpx;
              }

              .attendance-report-dot {
                width: 16rpx;
                height: 16rpx;
                background: #ffffff;
                border: 4rpx solid rgba(0, 0, 0, 0.25);
                border-radius: 16rpx;
                position: absolute;
                top: 70rpx;
                left: 34rpx;
              }
            }

            .attendance-report-details-item-box {
              width: 83.5%;
              height: 156rpx;
              display: flex;
              flex-direction: column;
              position: absolute;
              margin-left: 71rpx;

              .attendance-report-details-item {
                height: 40rpx;
                display: flex;
                justify-content: space-between;

                .attendance-report-time {
                  display: flex;
                  font-size: 28rpx;
                  font-family: PingFangSC-Medium, PingFang SC;
                  font-weight: 500;
                  color: rgba(0, 0, 0, 0.85);
                  line-height: 40rpx;

                  .attendance-report-time-txt {
                    width: 56rpx;
                  }

                  .attendance-report-time-item {
                    color: #f9793f;
                    margin: 0 21rpx 0 15rpx;
                  }

                  .early-champions {
                    width: 183rpx;
                    background: #f7e4bb;
                    border-radius: 20rpx;
                    padding: 0 26rpx 0 23rpx;
                    box-sizing: border-box;
                    display: flex;
                    align-items: center;

                    .early-champions-img {
                      width: 32rpx;
                      height: 29rpx;
                      background: no-repeat center/100%
                        url(https://xiaopay2020.oss-cn-shenzhen.aliyuncs.com/static/weapp/SchoolReport/champions.png);
                      margin-right: 2rpx;
                    }

                    .progress-img {
                      width: 30rpx;
                      height: 29rpx;
                      background: no-repeat center/100%
                        url(https://xiaopay2020.oss-cn-shenzhen.aliyuncs.com/static/weapp/SchoolReport/progressIcon.png);
                      margin-right: 2rpx;
                    }

                    .early-champions-txt {
                      font-size: 24rpx;
                      font-family: PingFangSC-Regular, PingFang SC;
                      font-weight: 400;
                      color: #916610;
                    }
                  }
                }

                .attendance-report-time-details {
                  width: 212rpx;
                  display: flex;
                  align-items: center;
                  justify-content: flex-end;
                  margin: 0 0 11rpx;

                  .attendance-report-time-details-item {
                    font-size: 28rpx;
                    font-family: PingFangSC-Regular, PingFang SC;
                    font-weight: 400;
                    color: #f9793f;
                    line-height: 40rpx;
                    width: 165rpx;
                    height: 40rpx;
                    display: flex;
                    justify-content: flex-end;
                  }

                  .attendance-report-time-details-icon {
                    width: 21rpx;
                    height: 12rpx;
                    background: no-repeat center/100%
                      url(https://xiaopay2020.oss-cn-shenzhen.aliyuncs.com/static/weapp/SchoolReport/arrowUp.png);
                    // margin-left: 30rpx;
                  }
                }
              }

              .attendance-report-details-img-item {
                display: flex;
                justify-content: flex-end;
                width: 100%;
                height: 95rpx;
                margin: 14rpx 0 0;

                .attendance-report-details-img-box {
                  width: 155rpx;
                  height: 95rpx;

                  image {
                    width: 100%;
                    height: 100%;
                  }
                }
              }
            }
          }
        }

        .noAttendanceReportDatail {
          height: 620rpx;
          background: #f5f7f7;
          margin: -40rpx 0 0;
          border-radius: 0 0 16rpx 16rpx;

          .noAttendanceReportDatailImg {
            margin: 78rpx 0 0 107rpx;
            width: 474rpx;
            height: 235rpx;
            background: no-repeat center/100%
              url(https://xiaopay2020.oss-cn-shenzhen.aliyuncs.com/static/weapp/SchoolReport/noAttendanceReportDatailData.png);
          }
        }
      }

      .image-dialog {
        width: 620rpx;
        height: 800rpx;

        image {
          width: 100%;
          height: 100%;
        }
      }

      .pubTalk-report-context-card-two {
        height: 506rpx;
        background: #ffffff;
        border-radius: 16rpx;
        margin: 0 0 40rpx;

        .call-number-bar-unit {
          margin: 0 0 28rpx 28rpx;
          height: 33rpx;
          font-size: 24rpx;
          font-family: PingFangSC-Regular, PingFang SC;
          font-weight: 400;
          color: rgba(0, 0, 0, 0.5);
          line-height: 33rpx;
        }

        #call-number-bar {
          position: relative;
          top: -110rpx;
          left: 18rpx;
          z-index: 100;
        }
      }

      .pubTalk-report-context-card-three {
        height: 537rpx;
        background: #ffffff;
        border-radius: 16rpx;
        margin: 0 0 40rpx;

        .call-duration-bar-unit {
          margin: 0 0 28rpx 28rpx;
          height: 33rpx;
          font-size: 24rpx;
          font-family: PingFangSC-Regular, PingFang SC;
          font-weight: 400;
          color: rgba(0, 0, 0, 0.5);
          line-height: 33rpx;
        }

        #call-duration-bar {
          position: relative;
          top: -88rpx;
          left: 28rpx;
          z-index: 100;
        }
      }

      .pubTalk-report-context-card-four {
        height: 756rpx;
        background: #ffffff;
        border-radius: 16rpx;

        .leave-message-summary {
          height: 90rpx;
          margin: 42rpx 36rpx 0;
          font-size: 32rpx;
          font-family: PingFangSC-Medium, PingFang SC;
          font-weight: 500;
          color: rgba(0, 0, 0, 0.85);
          line-height: 45rpx;

          .txt-important {
            color: #ef7b00;
            margin: 0 4rpx;
          }

          &.leave-message-less-summary {
            margin: 0 36rpx 0;
          }
        }

        .leave-message-bar-unit {
          margin: 43rpx 0 28rpx 28rpx;
          height: 33rpx;
          font-size: 24rpx;
          font-family: PingFangSC-Regular, PingFang SC;
          font-weight: 400;
          color: rgba(0, 0, 0, 0.5);
          line-height: 33rpx;
        }

        #leave-message-bar {
          position: relative;
          top: -116rpx;
          left: 18rpx;
          z-index: 100;
        }
      }

      .school-report-context-card-three {
        height: 600rpx;
        background: #ffffff;
        border-radius: 16rpx;
        margin-bottom: 40rpx;

        .school-report-context-card-three-conclusion {
          margin: 40rpx 0 57rpx 0;

          .school-report-context-card-three-conclusion-item {
            height: 40rpx;
            font-size: 28rpx;
            font-family: PingFangSC-Medium, PingFang SC;
            font-weight: 500;
            color: rgba(0, 0, 0, 0.85);
            line-height: 40rpx;
            margin-left: 30rpx;
            padding-right: 47rpx;

            &.card-three-conclusion-nodata {
              text-align: center;
              margin: 0;
              color: orangered;
            }

            .school-report-context-card-three-conclusion-item-describe {
              color: #ef7b00;
            }
          }
        }

        #consumer-preferences-pie {
          height: 385rpx;
          top: -30rpx;
          z-index: 100;
        }
      }

      .school-report-context-card-four {
        // height: 1020rpx;
        background: #ffffff;
        border-radius: 16rpx;
        margin-bottom: 25rpx;
        padding-bottom: 57rpx;

        .school-report-context-card-four-conclusion {
          margin: 28rpx 0 29rpx;

          .school-report-context-card-four-conclusion-item {
            height: 80rpx;
            font-size: 28rpx;
            font-family: PingFangSC-Medium, PingFang SC;
            font-weight: 500;
            color: rgba(0, 0, 0, 0.85);
            line-height: 40rpx;
            margin: 0 40rpx 0 30rpx;

            &.card-four-conclusion-nodata {
              margin: 0;
              text-align: center;
              color: orangered;
            }

            .consume-total {
              color: #ef7b00;
              margin: 0 6rpx;
            }

            .livingCostUp {
              transform: rotate(180deg);
            }
          }
        }
        .school-report-context-card-four-conclusion-chart {
          height: 340rpx;
          background: #fff9f0;
          border-radius: 20rpx;
          margin: 0 24rpx;
          position: relative;
          .title {
            width: 642rpx;
            height: 76rpx;
            background: url(https://xiaopay2020.oss-cn-shenzhen.aliyuncs.com/static/weapp/SchoolReport/costReportIMG14.png)
              center/100% no-repeat;
            font-weight: 400;
            font-size: 26rpx;
            color: #915100;
            line-height: 76rpx;
            display: inline-flex;
            .firstCol {
              width: 98rpx;
              position: relative;
            }
            .lastCol {
              flex: 1;
              display: inline-flex;
              justify-content: space-between;
              padding-left: 92rpx;
              padding-right: 49rpx;
            }
          }
          .picture {
            width: 100%;
            height: 118rpx;
            margin-top: 18rpx;
            display: inline-flex;
            .left,
            .right {
              align-self: flex-end;
            }
            .left {
              margin-left: 27rpx;
              .leftImg {
                width: 90rpx;
                height: 96rpx;
              }
            }
            .right {
              margin-right: 13rpx;
              margin-left: 6rpx;
              height: 100%;
              border-bottom: 1rpx solid #ffc68b;
              flex: 1;
              .rightBar {
                height: 100%;
                padding-left: 44rpx;
                padding-right: 18rpx;
                display: flex;
                justify-content: space-between;
                .costReportIMG16 {
                  width: 91rpx;
                  height: 118rpx;
                  align-self: flex-end;
                }
                .costReportIMG17 {
                  width: 91rpx;
                  height: 74rpx;
                  align-self: flex-end;
                }
                .costReportIMG18 {
                  width: 91rpx;
                  height: 93rpx;
                  align-self: flex-end;
                }
              }
            }
          }
          .data {
            height: 51rpx;
            margin-top: 7rpx;
            .left {
              font-size: 22rpx;
              color: rgba(0, 0, 0, 0.85);
              align-self: center;
              width: 90rpx;
            }
            .right {
              border: none;
              font-weight: 500;
              font-size: 40rpx;
              color: rgba(0, 0, 0, 0.85);
              .rightBar {
                .line {
                  display: inline-flex;
                  width: 91rpx;
                  justify-content: center;
                  // view {
                  //   width: 91rpx;
                  //   text-align: center;
                  // }
                  view:first-child {
                    line-height: 40rpx;
                    align-self: flex-end;
                  }
                  view:last-child {
                    font-size: 30rpx;
                    line-height: 30rpx;
                    align-self: flex-end;
                  }
                }
                .line_ {
                  width: 91rpx;
                  text-align: center;
                  line-height: 51rpx;
                }
              }
            }
          }
          .lastLine {
            height: 30rpx;
            margin-top: 12rpx;
            .red,
            .green,
            .grey {
              align-self: center;
              width: 91rpx;
              justify-content: center;
              text-align: center;
            }
            .red {
              font-size: 22rpx;
              color: #ff4539;
              line-height: 22rpx;
            }
            .green {
              font-size: 22rpx;
              color: #00b157;
              line-height: 22rpx;
            }
            .grey {
              font-size: 22rpx;
              color: rgba(0, 0, 0, 0.5);
              line-height: 22rpx;
            }
          }
          .dotLine {
            width: 1rpx;
            height: 36rpx;
            background: #dcdcde;
            position: absolute;
            bottom: 56rpx;
            left: 302rpx;
          }
          .dotLine2 {
            right: 156rpx;
            left: auto;
          }
        }
        .school-report-context-card-four-conclusion-meal {
          padding: 0 24rpx;
          width: calc(100% - 48rpx);
          margin-top: 13rpx;
          display: inline-flex;
          justify-content: space-between;
          position: relative;
          .left {
            width: 76rpx;
            height: 106rpx;
            position: relative;
            .txt {
              position: absolute;
              width: 100%;
              text-align: center;
              bottom: 14rpx;
              font-size: 22rpx;
              color: rgba(0, 0, 0, 0.85);
              line-height: 30rpx;
            }
          }
          .right {
            flex: 1;
            margin-left: 6rpx;
            height: 106rpx;
            background: #fff9f0;
            border-radius: 12rpx;
            .lastCol {
              flex: 1;
              display: inline-flex;
              justify-content: space-between;
            }
            .firstLine {
              padding-right: 24rpx;
              display: inline-flex;
              justify-content: space-between;
              margin-top: 20rpx;
              font-weight: 500;
              font-size: 26rpx;
              color: rgba(0, 0, 0, 0.75);
              height: 26rpx;
              width: calc(100% - 24rpx);
              view {
                align-self: center;
              }

              .firstCol {
                padding-left: 19rpx;
                width: 84rpx;
                font-weight: 400;
                font-size: 20rpx;
                color: rgba(0, 0, 0, 0.5);
              }
            }
            .secondLine {
              margin-top: 16rpx;
              padding-right: 24rpx;
              width: calc(100% - 24rpx);
              height: 26rpx;
              display: inline-flex;
              justify-content: space-between;
              font-size: 24rpx;
              color: rgba(0, 0, 0, 0.75);
              view {
                align-self: center;
              }
              .firstCol {
                padding-left: 19rpx;
                width: 84rpx;
                font-weight: 400;
                font-size: 20rpx;
                color: rgba(0, 0, 0, 0.5);
              }
            }
          }
          .dotLine {
            width: 1rpx;
            height: 36rpx;
            background: #dcdcde;
            position: absolute;
            bottom: 39rpx;
            left: 328rpx;
          }
          .dotLine2 {
            right: 174rpx;
            left: auto;
          }
        }
        .otherMeal {
          .left {
            height: 66rpx;
            .txt {
              bottom: 19rpx;
            }
          }
          .right {
            height: 66rpx;
            .firstLine {
              align-self: center;
            }
          }
          .dotLine {
            bottom: 18rpx;
          }
        }
        .consume-total-img {
          height: 192rpx;
          display: flex;
          justify-content: center;
          align-items: flex-end;
          font-size: 28rpx;
          font-family: PingFangSC-Semibold, PingFang SC;
          font-weight: 600;
          color: #ffffff;
          line-height: 40rpx;

          .school-average {
            width: 110rpx;
            background: linear-gradient(360deg, #04b871 0%, #07d66a 100%);
            border-radius: 16rpx 16rpx 0 0;
            display: flex;
            flex-direction: column;
            align-items: center;
            padding: 14rpx 0 0;
            box-sizing: border-box;

            .school-average-img {
              width: 52rpx;
              height: 87rpx;
              margin: 2rpx 0 0;

              image {
                width: 100%;
                height: 100%;
                max-width: 100%;
                max-height: 100%;
              }
            }

            &.last-month {
              margin: 0 74rpx 0;
            }
          }

          .user-consume {
            width: 110rpx;
            background: linear-gradient(360deg, #f0662b 0%, #ff8646 100%);
            border-radius: 16rpx 16rpx 0 0;
            display: flex;
            flex-direction: column;
            align-items: center;
            padding: 14rpx 0 0;
            box-sizing: border-box;

            .user-consume-img {
              width: 52rpx;
              height: 87rpx;
              margin: 2rpx 0 0;

              image {
                width: 100%;
                height: 100%;
                max-width: 100%;
                max-height: 100%;
              }
            }
          }
        }

        .consume-total-img-des {
          margin: 16rpx 0 0;
          display: flex;
          padding-left: 100rpx;

          .consume-total-img-des-item {
            height: 40rpx;
            font-size: 28rpx;
            font-family: PingFangSC-Medium, PingFang SC;
            font-weight: 500;
            color: rgba(0, 0, 0, 0.5);
            line-height: 40rpx;

            &.consume-des {
              margin: 0 128rpx 0 116rpx;
            }
          }
        }
      }

      .school-report-context-card-five {
        height: 634rpx;
        background: #ffffff;
        border-radius: 16rpx;
        margin: 0 0 40rpx;
        position: relative;

        .school-report-context-card-five-conclusion {
          margin: 40rpx 0 0;

          .school-report-context-card-five-conclusion-item {
            margin: 0 40rpx 0 30rpx;
            height: 130rpx;
            font-size: 28rpx;
            font-family: PingFangSC-Medium, PingFang SC;
            font-weight: 500;
            color: rgba(0, 0, 0, 0.85);
            line-height: 40rpx;

            &.card-five-conclusion-nodata {
              margin: 0;
              text-align: center;
              color: orangered;
            }

            .abnormal-date {
              color: #04b871;
            }
          }
        }

        #consumer-trend-line {
          position: absolute;
          top: 120rpx;
          z-index: 100;
        }

        .consumer-trend-line-icon {
          position: absolute;
          top: 558rpx;
          left: 271rpx;
          height: 40rpx;

          .consumer-trend-line-icon-item {
            display: flex;
            align-items: center;

            .consumer-trend-line-icon-logo {
              display: flex;
              align-items: center;
              margin-right: 10rpx;

              .consumer-trend-line-icon-logo-left,
              .consumer-trend-line-icon-logo-right {
                width: 8rpx;
                height: 1rpx;
                background: #0bda7d;
              }

              .consumer-trend-line-icon-logo-middle {
                width: 12rpx;
                height: 12rpx;
                background: #ffffff;
                border: 3rpx solid #0bdb7e;
                border-radius: 12rpx;
              }
            }

            .consumer-trend-line-icon-txt {
              font-size: 28rpx;
              font-family: PingFangSC-Regular, PingFang SC;
              font-weight: 400;
              color: #8c8c8c;
              line-height: 40rpx;
            }
          }
        }
      }

      .school-report-context-card-six {
        height: 1590rpx;
        background: #ffffff;
        border-radius: 16rpx;
        margin: 0 0 40rpx;

        .school-report-context-card-six-conclusion {
          margin: 40rpx 0 57rpx;

          .school-report-context-card-six-conclusion-item {
            margin: 0 40rpx 0 30rpx;
            height: 120rpx;
            font-size: 28rpx;
            font-family: PingFangSC-Medium, PingFang SC;
            font-weight: 500;
            color: rgba(0, 0, 0, 0.85);
            line-height: 40rpx;

            .abnormal-date {
              color: #04b871;
            }
          }
        }

        .mealtime-trends {
          .mealtime-trends-theme {
            height: 42rpx;
            padding: 0 49rpx 0 30rpx;
            box-sizing: border-box;
            display: flex;

            .meal-type {
              font-size: 30rpx;
              font-family: PingFangSC-Medium, PingFang SC;
              font-weight: 500;
              color: rgba(0, 0, 0, 0.85);
              line-height: 42rpx;
            }

            .user-meal-time {
              width: 144rpx;
              display: flex;
              justify-content: space-between;
              align-items: center;
              margin: 0 32rpx 0 143rpx;
            }

            .class-meal-time {
              width: 234rpx;
              display: flex;
              justify-content: space-between;
              align-items: center;
            }

            .user-meal-time-logo {
              display: flex;
              align-items: center;
              margin-right: 10rpx;

              .user-meal-time-logo-left,
              .user-meal-time-logo-right {
                width: 8rpx;
                height: 1rpx;
                background: #0bda7d;
              }

              .user-meal-time-logo-middle {
                width: 12rpx;
                height: 12rpx;
                background: #ffffff;
                border: 3rpx solid #0bdb7e;
                border-radius: 12rpx;
              }
            }

            .user-meal-time-txt {
              font-size: 24rpx;
              font-family: PingFangSC-Regular, PingFang SC;
              font-weight: 400;
              color: #8c8c8c;
            }
          }
        }

        #breakfast-time-line {
          position: relative;
          top: -95rpx;
          left: 24rpx;
          z-index: 100;
        }

        #lunch-time-line {
          position: relative;
          top: -228rpx;
          left: 24rpx;
          z-index: 100;
        }

        #dinner-time-line {
          position: relative;
          top: -376rpx;
          left: 24rpx;
          z-index: 100;
        }
      }

      .school-report-context-card-seven {
        height: 645rpx;
        background: #ffffff;
        border-radius: 16rpx;
        margin: 0 0 40rpx;

        .school-report-context-card-seven-conclusion {
          margin: 40rpx 0 50rpx;

          .school-report-context-card-seven-conclusion-item {
            margin: 0 40rpx 0 30rpx;
            height: 40rpx;
            font-size: 28rpx;
            font-family: PingFangSC-Medium, PingFang SC;
            font-weight: 500;
            color: rgba(0, 0, 0, 0.85);
            line-height: 40rpx;

            .abnormal-date {
              color: #04b871;
            }
          }
        }

        .meal-pal-bar-unit {
          height: 33rpx;
          display: flex;
          justify-content: center;

          .meal-pal-bar-unit-item {
            width: 180rpx;
            display: flex;
            justify-content: space-between;
            align-items: center;

            .meal-pal-bar-icon {
              width: 20rpx;
              height: 20rpx;
              background: linear-gradient(360deg, #04b871 0%, #07d66a 100%);
              border-radius: 4rpx;
            }

            .meal-pal-bar-txt {
              font-size: 24rpx;
              font-family: PingFangSC-Regular, PingFang SC;
              font-weight: 400;
              color: #8c8c8c;
              line-height: 33rpx;
            }
          }
        }

        #meal-pal-bar {
          position: relative;
          top: -106rpx;
          left: 18rpx;
          z-index: 100;
        }
      }

      .school-report-context-card-eight {
        background: #ffffff;
        border-radius: 16rpx;
        margin: 0 0 40rpx;

        .school-report-context-card-eight-conclusion {
          margin: 40rpx 0 30rpx;

          .school-report-context-card-eight-conclusion-item {
            height: 40rpx;
            font-size: 28rpx;
            font-family: PingFangSC-Medium, PingFang SC;
            font-weight: 500;
            color: rgba(0, 0, 0, 0.85);
            line-height: 40rpx;
            padding-left: 30rpx;
            box-sizing: border-box;

            &.eight-conclusion-nodata {
              text-align: center;
              color: orangered;
              padding: 0;
            }

            .txt-important {
              color: #ef7b00;
              margin: 0 4rpx;
            }
          }
        }

        .school-report-context-card-eight-details {
          .consumer-details-header {
            height: 74rpx;
            background: #f0f0f0;
            padding: 19rpx 0;
            box-sizing: border-box;
            display: flex;
            justify-content: space-around;
            align-items: center;

            .consumer-details-header-item {
              font-size: 26rpx;
              font-family: PingFangSC-Medium, PingFang SC;
              font-weight: 500;
              color: rgba(0, 0, 0, 0.85);
            }
          }

          .consumer-details-body-box {
            max-height: 630rpx;
            overflow: auto;

            .consumer-details-body {
              height: 74rpx;
              border-radius: 47rpx;
              display: flex;
              margin: 16rpx 0 0;

              .consumer-details-body-item {
                width: calc(17%);
                text-align: center;
                font-size: 26rpx;
                font-family: PingFangSC-Regular, PingFang SC;
                font-weight: 400;
                color: rgba(0, 0, 0, 0.75);
                line-height: 74rpx;

                &.consumer-details-body-data {
                  font-family: DINPro-Medium, DINPro;
                  font-weight: 500;
                  color: rgba(0, 0, 0, 0.85);
                }
              }
            }
          }

          .consumer-details-body-notice-box {
            margin: 16rpx 0 23rpx;
            height: 40rpx;
            display: flex;
            justify-content: center;

            .consumer-details-body-notice {
              width: 225rpx;
              display: flex;
              justify-content: space-between;

              .consumer-details-body-notice-txt {
                font-size: 28rpx;
                font-family: PingFangSC-Regular, PingFang SC;
                font-weight: 400;
                color: rgba(0, 0, 0, 0.31);
                line-height: 40rpx;
              }

              .consumer-details-body-notice-icon {
                width: 38rpx;
                height: 29rpx;

                image {
                  width: 100%;
                  height: 100%;
                }
              }
            }
          }

          .consumer-details-sum {
            height: 74rpx;
            display: flex;
            margin: 0 0 16rpx;
            background: #f8f8f7;

            .consumer-details-sum-item {
              width: calc(16.4%);
              text-align: center;
              font-size: 26rpx;
              font-family: PingFangSC-Medium, PingFang SC;
              font-weight: 500;
              color: rgba(0, 0, 0, 0.65);
              line-height: 74rpx;

              &.consumer-details-sum-type {
                font-size: 24rpx;
                color: rgba(0, 0, 0, 0.85);
                text-align: left;
                padding-left: 12rpx;
                box-sizing: border-box;
              }

              .type-unit {
                font-size: 20rpx;
                font-family: PingFangSC-Regular, PingFang SC;
                font-weight: 400;
                color: rgba(0, 0, 0, 0.45);
                display: inline-block;
                position: absolute;
              }
            }

            .consumer-details-sum-item:first-of-type {
              width: calc(18%);
            }
          }
        }
      }

      .school-report-footer {
        margin-top: 21rpx;
        height: 170rpx;
        width: 708rpx;
        margin: 0 auto;
        background: no-repeat center/100%
          url(https://xiaopay2020.oss-cn-shenzhen.aliyuncs.com/static/weapp/SchoolReport/costReportIMG9.png);
        display: inline-flex;
        justify-content: space-between;

        .school-report-footer-item {
          display: flex;
          flex-direction: column;

          .school-report-footer-item-txt {
            margin-top: 34rpx;
            padding-left: 42rpx;
            font-size: 34rpx;
            font-family: PingFangSC-Medium, PingFang SC;
            font-weight: 500;
            font-size: 34rpx;
            color: #502d00;
            line-height: 48rpx;
          }

          .school-report-validity {
            padding-left: 42rpx;
            margin-top: 8rpx;
            width: 100%;
            font-size: 24rpx;
            font-family: PingFangSC-Medium, PingFang SC;
            font-weight: 500;
            font-weight: 500;
            color: rgba(123, 80, 53, 0.85);
            line-height: 33rpx;

            .validity-date {
              color: #f9793f;
            }
          }
        }

        .school-report-footer-item-two {
          display: flex;
          align-items: center;
          margin-right: 34rpx;

          .school-report-footer-item-btn {
            width: 180rpx;
            height: 61rpx;
            background: linear-gradient(360deg, #f0662b 0%, #ff8646 100%);
            border-radius: 49rpx;
            font-size: 28rpx;
            font-family: PingFangSC-Semibold, PingFang SC;
            font-weight: 600;
            color: #ffffff;
            display: flex;
            justify-content: center;
            align-items: center;
            align-self: center;
          }
        }
      }
    }

    // 出入校报告
  }

  .no-open {
    width: 100%;
    position: absolute;
    background: linear-gradient(
      180deg,
      rgba(255, 255, 255, 0) 0%,
      rgba(255, 255, 255, 0.97) 38%,
      #ffffff 100%
    );
    padding: 309rpx 30rpx 63rpx;
    box-sizing: border-box;
    z-index: 101;

    .no-open-solution {
      height: 40rpx;
      width: 100%;
      display: flex;
      align-items: center;
      margin: 0 0 40rpx;

      .no-open-solution-txt {
        margin: 0 9rpx 0 88rpx;
        font-size: 28rpx;
        font-family: PingFangSC-Medium, PingFang SC;
        font-weight: 500;
        color: #04b871;
        line-height: 40rpx;
      }

      .no-open-solution-item {
        width: 15rpx;
        height: 20rpx;
        background: no-repeat center/100%
          url(https://xiaopay2020.oss-cn-shenzhen.aliyuncs.com/static/weapp/SchoolReport/rightArrow.png);
      }
    }

    .open-results {
      border-radius: 16rpx;

      .open-results-title {
        width: 100%;
        height: 83rpx;
        background: url(https://xiaopay2020.oss-cn-shenzhen.aliyuncs.com/static/weapp/SchoolReport/openbgm.png)
          center/100% no-repeat;
        border-radius: 16rpx 16rpx 0 0;
        font-size: 28rpx;
        font-family: PingFangSC-Medium, PingFang SC;
        font-weight: 500;
        color: #21775c;
        display: flex;
        justify-content: center;
        align-items: center;

        &.consume-open-results-title {
          background: url(https://xiaopay2020.oss-cn-shenzhen.aliyuncs.com/static/weapp/SchoolReport/consumeOpenbgm.png)
            center/100% no-repeat;
        }
      }

      .open-results-items {
        width: 100%;
        height: 379rpx;
        background: #f6faf9;
        border-radius: 16rpx;
        padding: 32rpx 0 43rpx 73rpx;
        box-sizing: border-box;

        &.consume-open-results-items {
          padding: 44rpx 0 0 34rpx;
          box-sizing: border-box;
          // height: 473rpx;
          height: 340rpx;
        }

        .open-results-items-summary {
          width: 100%;
          height: 45rpx;
          display: flex;
          font-family: PingFangSC-Medium, PingFang SC;
          font-weight: 500;
          color: #217456;
          margin: 0 0 26rpx;

          .summary-item {
            font-size: 32rpx;
            line-height: 45rpx;
          }

          .summary-item-icon {
            font-size: 40rpx;
            line-height: 45rpx;
          }

          .attendance-report-icon {
            margin: 0 35rpx 0 134rpx;
          }

          .pubTalk-report-icon {
            margin: 0 35rpx 0 102rpx;
          }
        }

        .consume-open-results-items-details {
          .consume-open-results-items-details-item {
            display: flex;
            height: 80rpx;
            margin: 0 0 55rpx;

            .details-item-left {
              width: 313rpx;

              .details-item-up {
                font-size: 28rpx;
                font-family: PingFangSC-Medium, PingFang SC;
                font-weight: 500;
                color: #13664c;
                line-height: 40rpx;
              }

              .details-item-down {
                display: flex;
                align-items: center;

                .details-item-down-txt {
                  font-size: 24rpx;
                  font-family: PingFangSC-Regular, PingFang SC;
                  font-weight: 400;
                  color: rgba(19, 102, 76, 0.7);
                  line-height: 33rpx;
                }

                .dining-situations-img {
                  width: 26rpx;
                  height: 21rpx;
                  background: no-repeat center/100%
                    url(https://xiaopay2020.oss-cn-shenzhen.aliyuncs.com/static/weapp/SchoolReport/repast.png);
                }

                .meal-pal-img {
                  width: 26rpx;
                  height: 22rpx;
                  background: no-repeat center/100%
                    url(https://xiaopay2020.oss-cn-shenzhen.aliyuncs.com/static/weapp/SchoolReport/mealPal.png);
                }

                .consumer-num-img {
                  width: 22rpx;
                  height: 25rpx;
                  background: no-repeat center/100%
                    url(https://xiaopay2020.oss-cn-shenzhen.aliyuncs.com/static/weapp/SchoolReport/consumerNum.png);
                }

                .consumer-preference-img {
                  width: 25rpx;
                  height: 23rpx;
                  background: no-repeat center/100%
                    url(https://xiaopay2020.oss-cn-shenzhen.aliyuncs.com/static/weapp/SchoolReport/consumerPreference.png);
                }

                .consumer-trend-img {
                  width: 24rpx;
                  height: 24rpx;
                  background: no-repeat center/100%
                    url(https://xiaopay2020.oss-cn-shenzhen.aliyuncs.com/static/weapp/SchoolReport/consumerTrend.png);
                }

                .time-trends-img {
                  width: 25rpx;
                  height: 25rpx;
                  background: no-repeat center/100%
                    url(https://xiaopay2020.oss-cn-shenzhen.aliyuncs.com/static/weapp/SchoolReport/timeTrends.png);
                }
              }
            }
          }
        }

        .open-results-items-details {
          .open-results-items-details-item {
            width: 100%;
            height: 40rpx;
            margin: 0 0 24rpx;
            display: flex;
            align-items: center;

            .open-results-items-details-item-txt {
              font-size: 28rpx;
              font-family: PingFangSC-Regular, PingFang SC;
              font-weight: 400;
              color: #13664c;
              line-height: 40rpx;
            }

            // 出入校报告
            .admission-notice-img {
              width: 30rpx;
              height: 27rpx;
              background: no-repeat center/100%
                url(https://xiaopay2020.oss-cn-shenzhen.aliyuncs.com/static/weapp/SchoolReport/admissionNotice.png);
              margin-right: 23rpx;
            }

            .admission-analysis-img {
              width: 30rpx;
              height: 32rpx;
              background: no-repeat center/100%
                url(https://xiaopay2020.oss-cn-shenzhen.aliyuncs.com/static/weapp/SchoolReport/admissionAnalysis.png);
              margin: 0 25rpx 0 135rpx;
            }

            .admission-record-img {
              width: 29rpx;
              height: 31rpx;
              background: no-repeat center/100%
                url(https://xiaopay2020.oss-cn-shenzhen.aliyuncs.com/static/weapp/SchoolReport/admissionRecord.png);
              margin-right: 24rpx;
            }

            .admission-image-img {
              width: 29rpx;
              height: 29rpx;
              background: no-repeat center/100%
                url(https://xiaopay2020.oss-cn-shenzhen.aliyuncs.com/static/weapp/SchoolReport/admissionImage.png);
              margin-right: 24rpx;
            }

            // 公话报告
            .video-call-img {
              width: 31rpx;
              height: 24rpx;
              background: no-repeat center/100%
                url(https://xiaopay2020.oss-cn-shenzhen.aliyuncs.com/static/weapp/SchoolReport/videoCall.png);
              margin-right: 21rpx;
            }

            .communication-advice-img {
              width: 38rpx;
              height: 31rpx;
              background: no-repeat center/100%
                url(https://xiaopay2020.oss-cn-shenzhen.aliyuncs.com/static/weapp/SchoolReport/communicationAdvice.png);
              margin: 0 24rpx 0 165rpx;
            }

            .voice-call-img {
              width: 25rpx;
              height: 34rpx;
              background: no-repeat center/100%
                url(https://xiaopay2020.oss-cn-shenzhen.aliyuncs.com/static/weapp/SchoolReport/voiceCall.png);
              margin-right: 26rpx;
            }

            .call-count-img {
              width: 30rpx;
              height: 30rpx;
              background: no-repeat center/100%
                url(https://xiaopay2020.oss-cn-shenzhen.aliyuncs.com/static/weapp/SchoolReport/callCount.png);
              margin: 0 31rpx 0 165rpx;
            }

            .leave-word-img {
              width: 30rpx;
              height: 28rpx;
              background: no-repeat center/100%
                url(https://xiaopay2020.oss-cn-shenzhen.aliyuncs.com/static/weapp/SchoolReport/leaveWord.png);
              margin-right: 22rpx;
            }

            .call-duration-img {
              width: 31rpx;
              height: 35rpx;
              background: no-repeat center/100%
                url(https://xiaopay2020.oss-cn-shenzhen.aliyuncs.com/static/weapp/SchoolReport/callDuration.png);
              margin: 0 23rpx 0 165rpx;
            }

            .face-call-img {
              width: 32rpx;
              height: 31rpx;
              background: no-repeat center/100%
                url(https://xiaopay2020.oss-cn-shenzhen.aliyuncs.com/static/weapp/SchoolReport/faceCall.png);
              margin-right: 21rpx;
            }

            .leave-word-analysis-img {
              width: 31rpx;
              height: 31rpx;
              background: no-repeat center/100%
                url(https://xiaopay2020.oss-cn-shenzhen.aliyuncs.com/static/weapp/SchoolReport/leaveWordAnalysis.png);
              margin: 0 23rpx 0 165rpx;
            }
          }
        }
      }
    }
  }
}
</style>
