4321 lines
158 KiB
Vue
4321 lines
158 KiB
Vue
<template>
|
||
<view class="main">
|
||
<view class="meng" v-if="showRealBox" @click="changeShowRealBox"></view>
|
||
<view class="meng" v-if="showHaveNotice" @click.stop="handleShowHaveNoticeBox"></view>
|
||
<!-- 根据要显示的内容 切换高度 -->
|
||
<view :class="1<=selectMonth && selectMonth<=3?'header':4<=selectMonth && selectMonth<=6?'header secondHeader':7<=selectMonth && selectMonth<=9?'header thirdHeader':'header forthHeader'"
|
||
:style="{height:loadMore?`calc(${(776/750)*phoneWidth + 260}px)`:`calc(${(776/750)*phoneWidth - 10}px)`}">
|
||
<!-- 时间选择 -->
|
||
<div class="headerTop"
|
||
:style="{ height: menu.bottom + 5 + 'px'}">
|
||
<view class="selectTime" :style="{ top: menu.top + (menu.height - 22) / 2 + 'px' }">
|
||
<image class="dateIcon" :src="1<=selectMonth && selectMonth<=3?'https://eshangtech.com/ShopICO/ahyd-BID/newIndex/1stDateTime.svg':4<=selectMonth && selectMonth<=6?'https://eshangtech.com/ShopICO/ahyd-BID/newIndex/2stDateTime.svg':7<=selectMonth && selectMonth<=9?'https://eshangtech.com/ShopICO/ahyd-BID/newIndex/3stDateTime.svg':'https://eshangtech.com/ShopICO/ahyd-BID/newIndex/4stDateTime.svg'"></image>
|
||
<!-- <picker mode="date" :value="single" @change="bindDateChange" >-->
|
||
<picker mode="date" fields="month" :value="single" :start="startDate" :end="endData" @change="bindDateChange" >
|
||
<view class="time">
|
||
<!-- <text class="day" >{{ thisDay }}</text>-->
|
||
<view class="uni-input" :style="{color: 1<=selectMonth && selectMonth<=3?'#B33115':4<=selectMonth && selectMonth<=6?'#025B93':7<=selectMonth && selectMonth<=9?'#2249A2':'#783F0F'}" style="background: transparent;padding: 0;height:100%">{{ single }}</view>
|
||
<image class="icon" :src="1<=selectMonth && selectMonth<=3?'https://eshangtech.com/ShopICO/ahyd-BID/newIndex/1stDownArrow.svg':4<=selectMonth && selectMonth<=6?'https://eshangtech.com/ShopICO/ahyd-BID/newIndex/2stDownArrow.svg':7<=selectMonth && selectMonth<=9?'https://eshangtech.com/ShopICO/ahyd-BID/newIndex/3stDownArrow.svg':'https://eshangtech.com/ShopICO/ahyd-BID/newIndex/4stDownArrow.svg'"></image>
|
||
</view>
|
||
</picker>
|
||
</view>
|
||
</div>
|
||
|
||
<!-- ,height:loadMore?'200px':'38px'-->
|
||
<div class="storeDetail" :style="{ top: menu.bottom + 13 + 'px',left:0 + 'px'}">
|
||
<swiper class="detailBox" previous-margin="40rpx" next-margin="20rpx" :style="{height: loadMore?`1030rpx`:`508rpx`}" @change="handleChangeSelect" :current="selectDetail">
|
||
<block v-for="(item,index) in nowMonth" :key="index">
|
||
<swiper-item :item-id="index" :data-item-id="index" :class="selectMonth===index+1?'detailItemBox':'noSelectItemBox'">
|
||
<view class="box" :style="{height: loadMore?selectMonth===index+1 ?`1030rpx`:'230px':selectMonth===index+1?`508rpx`:'230px',background:0<=index && index<=2?'#FEB39F':3<=index && index<=5?'#8AC9EA':6<=index && index<=8?'#93B2EF':'#DDB795'}">
|
||
<view class="top" :style="{background:0<=index && index<=2?'linear-gradient(135deg, #FFE5CA 0%, #FFFFFF 29%, #FFFFFF 69%, #FFDCD5 100%)':3<=index && index<=5?'linear-gradient(135deg, #D4F7FF 0%, #FFFFFF 29%, #FFFFFF 69%, #CEECFF 100%)':6<=index && index<=8?'linear-gradient(135deg, #D5E8FF 0%, #FFFFFF 29%, #FFFFFF 69%, #D3E0FF 100%)':'linear-gradient(135deg, #FEEBD1 0%, #FFFFFF 29%, #FFFFFF 69%, #FFE7D4 100%)'}">
|
||
<view class="statistics">
|
||
<image class="staticImg" :src="1<=selectMonth && selectMonth<=3?'https://eshangtech.com/ShopICO/ahyd-BID/newIndex/1stStaticIcon.svg':4<=selectMonth && selectMonth<=6?'https://eshangtech.com/ShopICO/ahyd-BID/newIndex/2stStaticIcon.svg':7<=selectMonth && selectMonth<=9?'https://eshangtech.com/ShopICO/ahyd-BID/newIndex/3stStaticIcon.svg':'https://eshangtech.com/ShopICO/ahyd-BID/newIndex/4stStaticIcon.svg'"/>
|
||
<text class="staticTitle">营收统计</text>
|
||
<image class="staticIcon" :src="1<=selectMonth && selectMonth<=3?'https://eshangtech.com/ShopICO/ahyd-BID/newIndex/1stStaticMore.svg':4<=selectMonth && selectMonth<=6?'https://eshangtech.com/ShopICO/ahyd-BID/newIndex/2stStaticMore.svg':7<=selectMonth && selectMonth<=9?'https://eshangtech.com/ShopICO/ahyd-BID/newIndex/3stStaticMore.svg':'https://eshangtech.com/ShopICO/ahyd-BID/newIndex/4stStaticMore.svg'"/>
|
||
</view>
|
||
<view class="revenueBox" v-show="selectMonth===index+1">
|
||
<view class="revenueTop">
|
||
<view class="revenueTopLeft">
|
||
<text class="revenueNumber">{{showTableData.CashPayChange?$util.fmoney(showTableData.CashPayChange,2):'0.00'}}</text>
|
||
<view class="moreIcon" @click="changeShowRealBox">?
|
||
<view v-if="showRealBox" class="realBox" @click.stop="changeShowRealBox">
|
||
<view><text class="label">对客营收：</text>{{showTableData.CashPay?$util.fmoney(showTableData.CashPay,2):'-'}}</view>
|
||
<view><text class="label">自营收入：</text>{{typeList && typeList.length>0?$util.fmoney(typeList[0].value,2) : '-'}}</view>
|
||
<view><text class="label">外租收入：</text>{{typeList && typeList.length>0?$util.fmoney(typeList[1].value,2) : '-'}}</view>
|
||
</view>
|
||
</view>
|
||
</view>
|
||
<view class="revenueTopRight" v-if="showTableData.add">
|
||
<!--/static/images/examine/reduce.svg-->
|
||
<image class="addReduce" :src="Number(showTableData.add)>0?'/static/images/examine/add.svg':Number(showTableData.add)<0?'/static/images/examine/reduce.svg':''"/>
|
||
<text class="addValue">{{showTableData.add?showTableData.add:'-'}}%</text>
|
||
</view>
|
||
</view>
|
||
<view class="revenueNav">
|
||
<text class="leftNav">{{selectMonth}}月对客营收<text class="unit">/万元</text></text>
|
||
<text class="rightNav">同比</text>
|
||
</view>
|
||
|
||
<view class="progress" @click="handleShowHaveNoticeBox" :style="{background:1<=selectMonth && selectMonth<=3?'#FFAB30':4<=selectMonth && selectMonth<=6?'#5DC1E0':7<=selectMonth && selectMonth<=9?'#7CADF8':'#DCA858'}">
|
||
<view class="have" :style="{width:progressObj.owner+'%',background:1<=selectMonth && selectMonth<=3?'#DB573B':4<=selectMonth && selectMonth<=6?'#137BBD':7<=selectMonth && selectMonth<=9?'#3663CB':'#A66A37'}"></view>
|
||
<view class="haveNoticeBox" v-if="showHaveNotice" @click.stop="handleShowHaveNoticeBox">
|
||
<text class="label">自营:<text class="value">{{progressObj.owner}}%，</text></text>
|
||
<text class="label">外租:<text class="value">{{progressObj.other}}%</text></text>
|
||
</view>
|
||
|
||
</view>
|
||
|
||
<view class="message">
|
||
<view class="smallDetailItem" style="margin-right: 14px">
|
||
<view class="messageTop">
|
||
<view class="type" :style="{background:1<=selectMonth && selectMonth<=3?'#DB573B':4<=selectMonth && selectMonth<=6?'#137BBD':7<=selectMonth && selectMonth<=9?'#3663CB':'#A66A37'}"></view>
|
||
<text class="typeTitle">自营收入<text class="unit">/万元</text></text>
|
||
</view>
|
||
<view class="middle" v-if="monthAdd">
|
||
<text class="money">{{typeList[0].showValue?$util.fmoney(typeList[0].showValue,2):''}}</text>
|
||
<view class="addItem">{{monthAdd || ''}}%</view>
|
||
</view>
|
||
<view class="messageBottom" v-if="typeList && typeList[0].add">
|
||
<text class="addText">{{typeList[0].add?typeList[0].add:''}}</text>
|
||
<text class="addType">同比</text>
|
||
</view>
|
||
</view>
|
||
|
||
<view class="smallDetailItem">
|
||
<view class="messageTop">
|
||
<view class="type" :style="{background:1<=selectMonth && selectMonth<=3?'#FFAB30':4<=selectMonth && selectMonth<=6?'#5DC1E0':7<=selectMonth && selectMonth<=9?'#7CADF8':'#DCA858'}"></view>
|
||
<text class="typeTitle">外租收入<text class="unit">/万元</text></text>
|
||
</view>
|
||
<view class="middle">
|
||
<text class="money">{{typeList[1].showValue?$util.fmoney(typeList[1].showValue,2):''}}</text>
|
||
<!-- <view class="addItem">+13.18%</view>-->
|
||
</view>
|
||
<view class="messageBottom" v-if="typeList && typeList[1].add">
|
||
<text class="addText">{{typeList[1].add?typeList[1].add:''}}</text>
|
||
<text class="addType">同比</text>
|
||
</view>
|
||
</view>
|
||
</view>
|
||
</view>
|
||
<view class="revenueBox" v-show="selectMonth!==index+1">
|
||
<view class="revenueTop">
|
||
<view class="revenueTopLeft">
|
||
<text class="revenueNumber">-</text>
|
||
<view class="moreIcon" @click="changeShowRealBox">?
|
||
<view v-if="showRealBox" class="realBox" @click.stop="changeShowRealBox">
|
||
<view><text class="label">对客营收：</text>-</view>
|
||
<view><text class="label">自营收入：</text>-</view>
|
||
<view><text class="label">外租收入：</text>-</view>
|
||
</view>
|
||
</view>
|
||
</view>
|
||
<view class="revenueTopRight">
|
||
<!--/static/images/examine/reduce.svg-->
|
||
<!-- <image class="addReduce" :src="showTableData.add>0?'/static/images/examine/add.svg':showTableData.add>0?'/static/images/examine/reduce.svg':''"/>-->
|
||
<!-- <text class="addValue">-</text>-->
|
||
</view>
|
||
</view>
|
||
<view class="revenueNav">
|
||
<text class="leftNav">-月对客营收<text class="unit">/万元</text></text>
|
||
<text class="rightNav">同比</text>
|
||
</view>
|
||
|
||
<view class="progress" :style="{background:1<=selectMonth && selectMonth<=3?'#FFAB30':4<=selectMonth && selectMonth<=6?'#5DC1E0':7<=selectMonth && selectMonth<=9?'#7CADF8':'#DCA858'}">
|
||
<view class="have" :style="{background:1<=selectMonth && selectMonth<=3?'#DB573B':4<=selectMonth && selectMonth<=6?'#137BBD':7<=selectMonth && selectMonth<=9?'#3663CB':'#A66A37'}"></view>
|
||
</view>
|
||
|
||
<view class="message">
|
||
<view class="smallDetailItem" style="margin-right: 14px">
|
||
<view class="messageTop">
|
||
<view class="type" :style="{background:1<=selectMonth && selectMonth<=3?'#DB573B':4<=selectMonth && selectMonth<=6?'#137BBD':7<=selectMonth && selectMonth<=9?'#3663CB':'#A66A37'}"></view>
|
||
<text class="typeTitle">自营收入<text class="unit">/万元</text></text>
|
||
</view>
|
||
<view class="middle">
|
||
<text class="money">-</text>
|
||
<view class="addItem">-</view>
|
||
</view>
|
||
<view class="messageBottom">
|
||
<text class="addText">-</text>
|
||
<text class="addType">同比</text>
|
||
</view>
|
||
</view>
|
||
|
||
<view class="smallDetailItem">
|
||
<view class="messageTop">
|
||
<view class="type" :style="{background:1<=selectMonth && selectMonth<=3?'#FFAB30':4<=selectMonth && selectMonth<=6?'#5DC1E0':7<=selectMonth && selectMonth<=9?'#7CADF8':'#DCA858'}"></view>
|
||
<text class="typeTitle">外租收入<text class="unit">/万元</text></text>
|
||
</view>
|
||
<view class="middle">
|
||
<text class="money">-</text>
|
||
<!-- <view class="addItem">+13.18%</view>-->
|
||
</view>
|
||
<view class="messageBottom">
|
||
<text class="addText">-</text>
|
||
<text class="addType">同比</text>
|
||
</view>
|
||
</view>
|
||
</view>
|
||
</view>
|
||
</view>
|
||
<view class="bottom" v-if="!loadMore" @click="handleChangeLoadMore" :style="{background:0<=index && index<=2?'#FEB39F':3<=index && index<=5?'#8AC9EA':6<=index && index<=8?'#93B2EF':'#DDB795'}">
|
||
<text class="searchText">查看更多</text>
|
||
<image class="searchIcon" :style="{height:'16px',transform: loadMore?'rotate(180deg)':''}" :src="1<=selectMonth && selectMonth<=3?'https://eshangtech.com/ShopICO/ahyd-BID/newIndex/1stUp.svg':4<=selectMonth && selectMonth<=6?'https://eshangtech.com/ShopICO/ahyd-BID/newIndex/2stUp.svg':7<=selectMonth && selectMonth<=9?'https://eshangtech.com/ShopICO/ahyd-BID/newIndex/3stUp.svg':'https://eshangtech.com/ShopICO/ahyd-BID/newIndex/4stUp.svg'"/>
|
||
</view>
|
||
<div class="otherDetail" v-else>
|
||
<view class="detail" v-show="selectMonth===index+1">
|
||
<view class="detailMessage">
|
||
<view class="otherDetailTop">
|
||
<view class="otherDetailTopLeft">
|
||
<view class="yearAll">{{showTableData.allRevenueYear?showTableData.allRevenueYear:''}}</view>
|
||
<view class="yearLabel">年度累计<text class="unit">/亿元</text></view>
|
||
</view>
|
||
|
||
<view class="otherDetailRight">
|
||
<view class="otherDetailAddBox">
|
||
<image class="otherDetailAddIcon" :src="Number(showTableData.yearYoY)>0?'/static/images/examine/add.svg':Number(yesObj.yearYOY)<0?'/static/images/examine/reduce.svg':''"/>
|
||
<text class="otherDetailAddValue">{{showTableData.yearYoY?showTableData.yearYoY+'%':''}}</text>
|
||
</view>
|
||
<view class="otherDetailAddLabel">同比</view>
|
||
</view>
|
||
</view>
|
||
|
||
<view class="otherDetailMiddle">
|
||
<view class="middleItem" style="margin-bottom: 16rpx">
|
||
<text class="itemLabel">对客营收<text class="itemText">/环比</text></text>
|
||
<text class="itemValue">{{showTableData.customerQoQ?showTableData.customerQoQ:''}}</text>
|
||
</view>
|
||
<view class="middleItem" style="margin-bottom: 16rpx">
|
||
<text class="itemLabel">自营收入<text class="itemText">/环比</text></text>
|
||
<text class="itemValue">{{typeList[0].addQOQ?typeList[0].addQOQ:''}}</text>
|
||
</view>
|
||
<view class="middleItem">
|
||
<text class="itemLabel">外租收入<text class="itemText">/环比</text></text>
|
||
<text class="itemValue">{{typeList[1].addQOQ?typeList[1].addQOQ:''}}</text>
|
||
</view>
|
||
</view>
|
||
|
||
<view class="otherDetailBottom">
|
||
<view class="bottomItem" style="margin-bottom: 16rpx">
|
||
<view class="itemLeft">
|
||
<image class="leftIcon" :src="1<=selectMonth && selectMonth<=3?'https://eshangtech.com/ShopICO/ahyd-BID/newIndex/1stEntryCar.svg':4<=selectMonth && selectMonth<=6?'https://eshangtech.com/ShopICO/ahyd-BID/newIndex/2stEntryCar.svg':7<=selectMonth && selectMonth<=9?'https://eshangtech.com/ShopICO/ahyd-BID/newIndex/3stEntryCar.svg':'https://eshangtech.com/ShopICO/ahyd-BID/newIndex/4stEntryCar.svg'"/>
|
||
<text class="itemTitle">入区车流</text>
|
||
</view>
|
||
<view class="itemCenter">
|
||
<text class="itemValue">{{trafficYOYObj.Vehicle_GrowthRate?trafficYOYObj.Vehicle_GrowthRate>0?'+'+trafficYOYObj.Vehicle_GrowthRate+'%':trafficYOYObj.Vehicle_GrowthRate+'%':'-'}}</text>
|
||
<text class="itemText">/同比</text>
|
||
</view>
|
||
<view class="itemRight">
|
||
<text class="itemValue">{{trafficQOQObj.Vehicle_GrowthRate?trafficQOQObj.Vehicle_GrowthRate>0?'+'+trafficQOQObj.Vehicle_GrowthRate+'%':trafficQOQObj.Vehicle_GrowthRate+'%':'-'}}</text>
|
||
<text class="itemText">/环比</text>
|
||
</view>
|
||
</view>
|
||
|
||
<view class="bottomItem" style="margin-bottom: 16rpx">
|
||
<view class="itemLeft">
|
||
<image class="leftIcon" :src="1<=selectMonth && selectMonth<=3?'https://eshangtech.com/ShopICO/ahyd-BID/newIndex/1stEntryRate.svg':4<=selectMonth && selectMonth<=6?'https://eshangtech.com/ShopICO/ahyd-BID/newIndex/2stEntryRate.svg':7<=selectMonth && selectMonth<=9?'https://eshangtech.com/ShopICO/ahyd-BID/newIndex/3stEntryRate.svg':'https://eshangtech.com/ShopICO/ahyd-BID/newIndex/4stEntryRate.svg'"/>
|
||
<text class="itemTitle">入区率</text>
|
||
</view>
|
||
<view class="itemCenter">
|
||
<text class="itemValue">{{trafficYOYObj.Entry_GrowthRate?trafficYOYObj.Entry_GrowthRate>0?'+'+trafficYOYObj.Entry_GrowthRate+'%':trafficYOYObj.Entry_GrowthRate+'%':'-'}}</text>
|
||
<text class="itemText">/同比</text>
|
||
</view>
|
||
<view class="itemRight">
|
||
<text class="itemValue">{{trafficQOQObj.Entry_GrowthRate?trafficQOQObj.Entry_GrowthRate>0?'+'+trafficQOQObj.Entry_GrowthRate+'%':trafficQOQObj.Entry_GrowthRate+'%':'-'}}</text>
|
||
<text class="itemText">/环比</text>
|
||
</view>
|
||
</view>
|
||
|
||
<view class="bottomItem">
|
||
<view class="itemLeft">
|
||
<image class="leftIcon" :src="1<=selectMonth && selectMonth<=3?'https://eshangtech.com/ShopICO/ahyd-BID/newIndex/1stEntryFix.svg':4<=selectMonth && selectMonth<=6?'https://eshangtech.com/ShopICO/ahyd-BID/newIndex/2stEntryFix.svg':7<=selectMonth && selectMonth<=9?'https://eshangtech.com/ShopICO/ahyd-BID/newIndex/3stEntryFix.svg':'https://eshangtech.com/ShopICO/ahyd-BID/newIndex/4stEntryFix.svg'"/>
|
||
<text class="itemTitle">停留时长</text>
|
||
</view>
|
||
<view class="itemCenter">
|
||
<text class="itemValue">{{trafficYOYObj.StayTimes_GrowthRate?trafficYOYObj.StayTimes_GrowthRate>0?'+'+trafficYOYObj.StayTimes_GrowthRate+'%':trafficYOYObj.StayTimes_GrowthRate+'%':'-'}}</text>
|
||
<text class="itemText">/同比</text>
|
||
</view>
|
||
<view class="itemRight">
|
||
<text class="itemValue">{{trafficQOQObj.StayTimes_GrowthRate?trafficQOQObj.StayTimes_GrowthRate>0?'+'+trafficQOQObj.StayTimes_GrowthRate+'%':trafficQOQObj.StayTimes_GrowthRate+'%':'-'}}</text>
|
||
<text class="itemText">/环比</text>
|
||
</view>
|
||
</view>
|
||
</view>
|
||
</view>
|
||
</view>
|
||
<view class="detail" v-show="selectMonth!==index+1">
|
||
<view class="detailItem">
|
||
<p class="price">-</p>
|
||
<p class="itemName">长款金额<text class="itemUnit">/元</text></p>
|
||
</view>
|
||
<view class="detailItem">
|
||
<p class="price">-</p>
|
||
<p class="itemName">短款金额<text class="itemUnit">/元</text></p>
|
||
</view>
|
||
<view class="detailItem">
|
||
<p class="price">-</p>
|
||
<p class="itemName">优惠金额<text class="itemUnit">/元</text></p>
|
||
</view>
|
||
<view class="detailItem">
|
||
<p class="price" :style="{color:isBig?'red':''}">-</p>
|
||
<div class="itemName" style="display: flex;align-items: center">
|
||
<text>门店上传</text>
|
||
</div>
|
||
</view>
|
||
<view class="detailItem">
|
||
<p class="price">-</p>
|
||
<p class="itemName">商品出售<text class="itemUnit">/件</text></p>
|
||
</view>
|
||
<view class="detailItem">
|
||
<p class="price">-</p>
|
||
<p class="itemName">商品均价<text class="itemUnit">/元</text></p>
|
||
</view>
|
||
<view class="detailItem">
|
||
<p class="price">-</p>
|
||
<p class="itemName">日均入区<text class="itemUnit">/辆</text></p>
|
||
</view>
|
||
<view class="detailItem">
|
||
<p class="price">-</p>
|
||
<p class="itemName">入区率<text class="itemUnit">/%</text></p>
|
||
</view>
|
||
<view class="detailItem">
|
||
<p class="price">-</p>
|
||
<p class="itemName">停留时长<text class="itemUnit">/分钟</text></p>
|
||
</view>
|
||
</view>
|
||
</div>
|
||
<div class="noShowMoreBox" @click="handleChangeLoadMore" >
|
||
<image v-if="loadMore" class="noShowMore" src="https://eshangtech.com/ShopICO/ahyd-BID/home/downLoad.svg"/>
|
||
</div>
|
||
<view class="monthBox" >{{index+1}}月</view>
|
||
</view>
|
||
</swiper-item>
|
||
</block>
|
||
</swiper>
|
||
</div>
|
||
</view>
|
||
|
||
<view class="funEntry">
|
||
<!-- 五个有背景的导航栏-->
|
||
<view class="funBox">
|
||
<view class="firstBox">
|
||
<view class="yesterday" @click="handlePage">
|
||
<view class="dayTop">
|
||
<text class="dayTitle">昨日营收<text class="unit">/万元</text></text>
|
||
<text class="uploadNumber" v-show="selectMonth===nowMonth">{{yesObj.Revenue_Upload?yesObj.Revenue_Upload:'-'}}/{{yesObj.TotalShopCount?yesObj.TotalShopCount:'-'}}</text>
|
||
</view>
|
||
<view class="valueBox">
|
||
<text class="value" v-show="selectMonth===nowMonth">{{yesObj.CashPay?yesObj.CashPay:''}}</text>
|
||
<view class="addBox" v-if="selectMonth===nowMonth">
|
||
<!-- /static/images/examine/reduce.svg-->
|
||
<image class="addIcon" :src="showTableData.compared>0?'/static/images/examine/add.svg':showTableData.compared<0?'/static/images/examine/reduce.svg':''"/>
|
||
<text class="addValue">{{showTableData.compared?showTableData.compared>0?'+'+showTableData.compared+'%':showTableData.compared+'%':'-'}}</text>
|
||
</view>
|
||
<view class="addBox" v-else>
|
||
<image class="noData" src="https://eshangtech.com/ShopICO/ahyd-BID/newIndex/noData.svg"/>
|
||
<!-- <text class="noDataText">暂无数据</text>-->
|
||
</view>
|
||
</view>
|
||
<view class="timeBox">
|
||
<image class="timeIcon" src="https://eshangtech.com/ShopICO/ahyd-BID/newIndex/1stTimeIcon.svg"/>
|
||
<text class="timeText" v-show="selectMonth===nowMonth">{{lastDay}}</text>
|
||
</view>
|
||
<image class="typeImg" src="https://eshangtech.com/ShopICO/ahyd-BID/newIndex/1stTypeImg.svg"/>
|
||
</view>
|
||
|
||
<view class="report" @click="handleGoOperate">
|
||
<text class="reportTitle">经营报表</text>
|
||
<image class="timeIcon" src="https://eshangtech.com/ShopICO/ahyd-BID/newIndex/2stTimeIcon.svg"/>
|
||
<image class="typeImg" src="https://eshangtech.com/ShopICO/ahyd-BID/newIndex/2stTypeImg.svg"/>
|
||
</view>
|
||
</view>
|
||
|
||
<view class="secondView">
|
||
<view class="funItemView" @click="changeShowPortrait" style="margin-right: 9px;background-image: url('https://eshangtech.com/ShopICO/ahyd-BID/newIndex/funThird.svg')">
|
||
<text class="funItemTitle" style="color: #287D66;">数字画像</text>
|
||
<image class="timeIcon" src="https://eshangtech.com/ShopICO/ahyd-BID/newIndex/3stTimeIcon.svg"/>
|
||
<image class="typeImg" src="https://eshangtech.com/ShopICO/ahyd-BID/newIndex/3stTypeImg.svg"/>
|
||
</view>
|
||
<view class="funItemView" @click="handleFestival" style="margin-right: 9px;background-image: url('https://eshangtech.com/ShopICO/ahyd-BID/newIndex/funFourth.svg')">
|
||
<text class="funItemTitle" style="color: #D25E00;">经营品牌库</text>
|
||
<image class="timeIcon" src="https://eshangtech.com/ShopICO/ahyd-BID/newIndex/4stTimeIcon.svg"/>
|
||
<image class="typeImg" src="https://eshangtech.com/ShopICO/ahyd-BID/newIndex/4stTypeImg.svg"/>
|
||
</view>
|
||
<view class="funItemView" style="background-image: url('https://eshangtech.com/ShopICO/ahyd-BID/newIndex/funFifth.svg')" @click="handleMoney">
|
||
<text class="funItemTitle" style="color: #7C46CD;">财务报表</text>
|
||
<image class="timeIcon" src="https://eshangtech.com/ShopICO/ahyd-BID/newIndex/5stTimeIcon.svg"/>
|
||
<image class="typeImg" src="https://eshangtech.com/ShopICO/ahyd-BID/newIndex/5stTypeImg.svg"/>
|
||
</view>
|
||
</view>
|
||
|
||
</view>
|
||
<!-- 四个画像-->
|
||
<div class="funList" v-if="showPortrait">
|
||
<view class="san"></view>
|
||
|
||
<div class="funItem" v-for="(item,index) in tabTypeList" :key="index" @click="handleGoTab(item)">
|
||
<view class="iconBox">
|
||
<image class="funItemIcon" :src="item.imgUrl"/>
|
||
</view>
|
||
<text class="funItemText">{{item.name}}</text>
|
||
</div>
|
||
</div>
|
||
<!-- 车流预警-->
|
||
<view class="carWarning" v-if="special">
|
||
<div class="carWarningTop">
|
||
<div class="warningBox" @click="handleGoWarning">
|
||
<image class="warningIcon" src="https://eshangtech.com/ShopICO/ahyd-BID/home/carIcon.svg"/>
|
||
<div class="trafficBox" >
|
||
<text class="trafficCar">车流预警</text>
|
||
<image class="moreIcon" src="https://eshangtech.com/ShopICO/ahyd-BID/newIndex/carMoreIcon.svg"/>
|
||
</div>
|
||
</div>
|
||
<div class="moreStoreBox" @click="handleGoWarning">
|
||
<!-- <span class="moreText">更多记录</span>-->
|
||
<!-- <image class="moreIcon" src="https://eshangtech.com/ShopICO/ahyd-BID/commercial/rightArrow.svg"/>-->
|
||
</div>
|
||
</div>
|
||
<div class="contentList" >
|
||
<div class="contentItem" v-for="(item,index) in warningList" :key="index">
|
||
<div class="index">
|
||
<div class="boxBg" v-if="index<=2"></div>
|
||
<span class="indexText" :style="{fontWeight:index<=2?'bold':'normal',color:index<=2?'#160002':'#786B6C'}">{{index + 1}}</span>
|
||
</div>
|
||
<div class="serviceBox">
|
||
<span class="name">{{item.name}}</span>
|
||
<span class="position">{{item.SERVERPART_REGION}}区</span>
|
||
</div>
|
||
<div class="numberBox">
|
||
<span class="number">{{item.VEHICLE_COUNT}}</span>
|
||
<span class="unit">/辆</span>
|
||
</div>
|
||
<div class="addBox">
|
||
<image class="addIcon" :src="Number(item.VEHICLE_RATE)>100?'/static/images/examine/add.svg':Number(item.VEHICLE_RATE)===100?'':'/static/images/examine/reduce.svg'"/>
|
||
<span class="add">{{item.VEHICLE_RATE}}%</span>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</view>
|
||
|
||
<!-- 人流预警-->
|
||
<view class="peopleWarning" v-if="false">
|
||
<div class="carWarningTop">
|
||
<div class="warningBox">
|
||
<image class="warningIcon" src="https://eshangtech.com/ShopICO/ahyd-BID/newIndex/personIcon.svg"/>
|
||
<div class="trafficBox">
|
||
<text class="trafficCar">人流预警</text>
|
||
<image class="moreIcon" src="https://eshangtech.com/ShopICO/ahyd-BID/newIndex/personMoreIcon.svg"/>
|
||
</div>
|
||
</div>
|
||
<div class="moreStoreBox" @click="handleGoWarning">
|
||
<!-- <span class="moreText">更多记录</span>-->
|
||
<!-- <image class="moreIcon" src="https://eshangtech.com/ShopICO/ahyd-BID/commercial/rightArrow.svg"/>-->
|
||
</div>
|
||
</div>
|
||
<div class="contentList" >
|
||
<div class="contentItem" v-for="(item,index) in warningList" :key="index">
|
||
<div class="index">
|
||
<div class="boxBg" v-if="index<=2"></div>
|
||
<span class="indexText" :style="{fontWeight:index<=2?'bold':'normal',color:index<=2?'#160002':'#786B6C'}">{{index + 1}}</span>
|
||
</div>
|
||
<div class="serviceBox">
|
||
<span class="name">{{item.name}}</span>
|
||
<span class="position">{{item.SERVERPART_REGION}}区</span>
|
||
</div>
|
||
<div class="numberBox">
|
||
<span class="number">{{item.VEHICLE_COUNT}}</span>
|
||
<span class="unit">/人</span>
|
||
</div>
|
||
<div class="addBox">
|
||
<image class="addIcon" :src="Number(item.VEHICLE_RATE)>100?'/static/images/examine/add.svg':Number(item.VEHICLE_RATE)===100?'':'/static/images/examine/reduce.svg'"/>
|
||
<span class="add">{{item.VEHICLE_RATE}}%</span>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</view>
|
||
|
||
<!-- 巡检考核-->
|
||
<view class="patrolInspection">
|
||
<view class="patrolTitle">巡检考核</view>
|
||
|
||
<view class="contentBox">
|
||
<view class="contentFirst" style="border-bottom: 2rpx solid #F7F4F4">
|
||
<view class="firstTop">
|
||
<view class="left">
|
||
<image class="topIcon" src="https://eshangtech.com/ShopICO/ahyd-BID/newIndex/examineQuestion.svg"/>
|
||
<text class="topText">日常巡检</text>
|
||
</view>
|
||
<view class="right" @click="handleGoExamine(2)">
|
||
<text class="moreText">查看更多</text>
|
||
<image class="moreIcon" src="https://eshangtech.com/ShopICO/ahyd-BID/commercial/rightArrow.svg"/>
|
||
</view>
|
||
</view>
|
||
<view class="firstBox">
|
||
<view class="boxItem">
|
||
<text class="itemValue">{{dailyExamineObj.RectifyCount||'0'}}</text>
|
||
<text class="itemLabel">整改中<text class="unit">/个</text></text>
|
||
</view>
|
||
|
||
<view class="boxItem">
|
||
<text class="itemValue">{{dailyExamineObj.UnRectifyCount||'0' }}</text>
|
||
<text class="itemLabel">未整改<text class="unit">/个</text></text>
|
||
</view>
|
||
|
||
<view class="boxItem">
|
||
<view class="canva"></view>
|
||
<view class="detailBox">
|
||
<view class="detailValue">{{dailyExamineObj.CompleteRate?dailyExamineObj.CompleteRate + '%' :'-' }}</view>
|
||
<view class="detailLabel">达标率<text class="unit">/全省</text></view>
|
||
</view>
|
||
</view>
|
||
</view>
|
||
</view>
|
||
|
||
<view class="contentFirst">
|
||
<view class="firstTop" style="margin-top: 32rpx">
|
||
<view class="left">
|
||
<image class="topIcon" src="https://eshangtech.com/ShopICO/ahyd-BID/newIndex/examinePosition.svg"/>
|
||
<text class="topText">考核管理</text>
|
||
</view>
|
||
<view class="right" @click="handleGoExamine(1)">
|
||
<text class="moreText">查看更多</text>
|
||
<image class="moreIcon" src="https://eshangtech.com/ShopICO/ahyd-BID/commercial/rightArrow.svg"/>
|
||
</view>
|
||
</view>
|
||
<view class="secondBox" >
|
||
<view class="secondItem">
|
||
<image class="itemImg" src="https://eshangtech.com/ShopICO/ahyd-BID/newIndex/good.svg"/>
|
||
<view class="secondDetail">
|
||
<text class="labelValue">{{examineObj.A || '0'}}</text>
|
||
<text class="labelTitle">优秀<text class="unit">/个</text></text>
|
||
</view>
|
||
</view>
|
||
<view class="secondItem">
|
||
<image class="itemImg" src="https://eshangtech.com/ShopICO/ahyd-BID/newIndex/normal.svg"/>
|
||
<view class="secondDetail">
|
||
<text class="labelValue">{{examineObj.B || '0'}}</text>
|
||
<text class="labelTitle">良好<text class="unit">/个</text></text>
|
||
</view>
|
||
</view>
|
||
<view class="secondItem">
|
||
<image class="itemImg" src="https://eshangtech.com/ShopICO/ahyd-BID/newIndex/bad.svg"/>
|
||
<view class="secondDetail">
|
||
<text class="labelValue">{{examineObj.C || '0'}}</text>
|
||
<text class="labelTitle">一般<text class="unit">/个</text></text>
|
||
</view>
|
||
</view>
|
||
</view>
|
||
</view>
|
||
</view>
|
||
</view>
|
||
|
||
<!-- 自营计划-->
|
||
<view class="selfPlan">
|
||
<view class="selfPlanTitle">自营计划</view>
|
||
|
||
<view class="content">
|
||
<view class="contentItem" style="border-bottom: 2rpx solid #F6F6F7;padding-bottom: 32rpx" >
|
||
<view class="contentTop">
|
||
<view class="contentLeft">
|
||
<image class="dateImg" src="https://eshangtech.com/ShopICO/ahyd-BID/newIndex/monthIcon.svg"/>
|
||
<text class="smallTitle">本月计划</text>
|
||
</view>
|
||
<view class="contentRight" @click="handlePlanPageGo('month')">
|
||
<text class="moreText">查看更多</text>
|
||
<image class="moreIcon" src="https://eshangtech.com/ShopICO/ahyd-BID/commercial/rightArrow.svg"/>
|
||
</view>
|
||
</view>
|
||
|
||
<view class="contentBottom">
|
||
<view class="canvaBox">
|
||
<MonthCharts :success="plan.percentageMonth"/>
|
||
</view>
|
||
|
||
<view class="messageBox">
|
||
<view class="messageTop">
|
||
<image class="topIcon" :src="Number(plan.MonthGrowth_Rate)>0?'/static/images/examine/add.svg':Number(plan.MonthGrowth_Rate)<0?'/static/images/examine/reduce.svg':''"/>
|
||
<text class="messageValue">{{monthAdd}}%</text>
|
||
<text class="messageDesc">(比计划)</text>
|
||
</view>
|
||
|
||
<view class="messageBottom">
|
||
<view class="bottomItem">
|
||
<view class="itemValue">{{plan.RevenueMonth_Amount?plan.RevenueMonth_Amount:'-'}}</view>
|
||
<view class="itemLabel">已完成<text class="unit">/万元</text></view>
|
||
</view>
|
||
<view class="bottomItem">
|
||
<view class="itemValue">{{plan.BudgetMonth_Amount?plan.BudgetMonth_Amount:'-'}}</view>
|
||
<view class="itemLabel">计划<text class="unit">/万元</text></view>
|
||
</view>
|
||
<view class="bottomItem">
|
||
<view class="itemValue">{{plan.MonthYOY_Rate?plan.MonthYOY_Rate>0?`+${plan.MonthYOY_Rate}%`:`${plan.MonthYOY_Rate}%`:'-'}}</view>
|
||
<view class="itemLabel">同比</view>
|
||
</view>
|
||
</view>
|
||
</view>
|
||
</view>
|
||
</view>
|
||
<view class="contentItem" style="margin-top: 32rpx" >
|
||
<view class="contentTop">
|
||
<view class="contentLeft">
|
||
<image class="dateImg" src="https://eshangtech.com/ShopICO/ahyd-BID/newIndex/yearIcon.svg"/>
|
||
<text class="smallTitle">本年计划</text>
|
||
</view>
|
||
<view class="contentRight" @click="handlePlanPageGo('year')">
|
||
<text class="moreText">查看更多</text>
|
||
<image class="moreIcon" src="https://eshangtech.com/ShopICO/ahyd-BID/commercial/rightArrow.svg"/>
|
||
</view>
|
||
</view>
|
||
|
||
<view class="contentBottom">
|
||
<view class="canvaBox">
|
||
<MonthCharts :success="plan.percentageYear"/>
|
||
</view>
|
||
|
||
<view class="messageBox">
|
||
<view class="messageTop">
|
||
<image class="topIcon" :src="Number(yearAdd)>0?'/static/images/examine/add.svg':Number(yearAdd)<0?'/static/images/examine/reduce.svg':''"/>
|
||
<text class="messageValue">{{yearAdd}}%</text>
|
||
<text class="messageDesc">(比计划)</text>
|
||
</view>
|
||
|
||
<view class="messageBottom">
|
||
<view class="bottomItem">
|
||
<view class="itemValue">{{plan.RevenueYear_Amount?plan.RevenueYear_Amount:'-'}}</view>
|
||
<view class="itemLabel">已完成<text class="unit">/{{ plan.revenueType==='yi'?'亿元':'万元' }}</text></view>
|
||
</view>
|
||
<view class="bottomItem">
|
||
<view class="itemValue">{{plan.BudgetYear_Amount?plan.BudgetYear_Amount:'-'}}</view>
|
||
<view class="itemLabel">计划<text class="unit">/{{ plan.budgetType==='yi'?'亿元':'万元' }}</text></view>
|
||
</view>
|
||
<view class="bottomItem">
|
||
<view class="itemValue">{{plan.YearYOY_Rate?plan.YearYOY_Rate>0?`+${plan.YearYOY_Rate}%`:`${plan.YearYOY_Rate}%`:'-'}}</view>
|
||
<view class="itemLabel">同比</view>
|
||
</view>
|
||
</view>
|
||
</view>
|
||
</view>
|
||
</view>
|
||
</view>
|
||
</view>
|
||
|
||
<!-- 营收占比-->
|
||
<view class="proportion">
|
||
<view class="proportionTitle">营收占比</view>
|
||
|
||
<view class="contentPropor">
|
||
<view class="tabs">
|
||
<view
|
||
v-for="(item, index) in propOfRevenList"
|
||
:key="index"
|
||
:class="selectTab === item.value ? 'active tabItem' : 'tabItem'"
|
||
@click="handleSelectTab(item.value)">
|
||
{{ item.name }}
|
||
</view>
|
||
</view>
|
||
|
||
<view class="chart">
|
||
<div v-show="selectTab===1" v-if="regionProgress.length>0">
|
||
<div>
|
||
<div class="operation-c-list" v-for="(item,o) in regionProgress" :key="o">
|
||
<div class="top">
|
||
<div class="left">
|
||
<div class="icon">
|
||
<image :src="o===0?'https://eshangtech.com/ShopICO/ahyd-BID/index/No1.svg':o===1?'https://eshangtech.com/ShopICO/ahyd-BID/index/No2.svg':o===2?'https://eshangtech.com/ShopICO/ahyd-BID/index/No3.svg':'https://eshangtech.com/ShopICO/ahyd-BID/index/No4.svg'"></image>
|
||
<text>{{o+1}}</text>
|
||
</div>
|
||
<p class="name">{{item.name}}</p>
|
||
</div>
|
||
<p class="price">{{$util.fmoney(item.value,2)}}</p>
|
||
</div>
|
||
<div class="bottom">
|
||
<div class="bar">
|
||
<div class="progress" :style="{width:item.percentage+'%'}"></div>
|
||
</div>
|
||
<p class="number">{{item.percentage+'%'}}</p>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
<div v-show="selectTab===2" v-if="areaProgress.length>0">
|
||
<div>
|
||
<div class="operation-c-list" v-for="(item,o) in areaProgress" :key="o">
|
||
<div class="top">
|
||
<div class="left">
|
||
<div class="icon">
|
||
<image :src="o===0?'https://eshangtech.com/ShopICO/ahyd-BID/index/No1.svg':o===1?'https://eshangtech.com/ShopICO/ahyd-BID/index/No2.svg':o===2?'https://eshangtech.com/ShopICO/ahyd-BID/index/No3.svg':'https://eshangtech.com/ShopICO/ahyd-BID/index/No4.svg'"></image>
|
||
<text>{{o+1}}</text>
|
||
</div>
|
||
<p class="name">{{item.name}}</p>
|
||
</div>
|
||
<p class="price">{{$util.fmoney(item.value,2)}}</p>
|
||
</div>
|
||
<div class="bottom">
|
||
<div class="bar">
|
||
<div class="progress" :style="{width:item.percentage+'%'}"></div>
|
||
</div>
|
||
<p class="number">{{item.percentage+'%'}}</p>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</view>
|
||
</view>
|
||
</view>
|
||
</view>
|
||
|
||
|
||
<!--通知框-->
|
||
<div class="notice" v-if="isShow" style="bottom: 200px;">
|
||
<view class="left">
|
||
<image class="icon" src="https://eshangtech.com/ShopICO/ahyd-BID/index/warning.svg"></image>
|
||
<view class="text">
|
||
<p class="name">{{isShowTitle}}个投诉建议</p>
|
||
</view>
|
||
</view>
|
||
<view class="right" @click="handleSearch('other')">去查看</view>
|
||
</div>
|
||
<!-- 弹出框-->
|
||
<uni-popup ref="popup" :show="popupShow" :type="popupType" :round="popup" @hidePopup="closePop">
|
||
<div class="popupIndex">
|
||
<div class="popupTop">未上传门店: </div>
|
||
<div class="bodyList">
|
||
<div class="item" v-for="(item,index) in bodyList" :key="index">
|
||
<div class="index">{{index + 1<10 ? '0' + (index + 1):index + 1}}</div>
|
||
<div class="title">{{item.Serverpart_Name}}{{item.ServerpartShop_Name}}</div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</uni-popup>
|
||
<!-- 底部导航栏-->
|
||
<Tabbar ref="tabbar" :page="page"></Tabbar>
|
||
</view>
|
||
</template>
|
||
|
||
<script>
|
||
import {getThisDay, handleYesterday, timestampToTime, timestampToTimeMonth} from "../../util/dateTime";
|
||
import {
|
||
mapActions,
|
||
mapGetters,
|
||
mapState
|
||
} from 'vuex';
|
||
import request from '@/util/index.js'
|
||
import uCharts from '@/components/u-charts.js';
|
||
import uniPopup from "../../components/uni-popup.vue";
|
||
import Tabbar from "../../components/tabbar/tabbar.vue";
|
||
import anhuiYestodayRevenueData from "../everdayRenven/components/anhuiYestodayRevenueData";
|
||
import MonthCharts from "./components/monthCharts.vue";
|
||
var rincanvas = {};
|
||
export default {
|
||
components: {MonthCharts, Tabbar,uniPopup},
|
||
data() {
|
||
const lastDay = this.$util.cutDate(new Date(), 'YYYY-MM-DD', -1)
|
||
const nowDay = this.$util.cutDate(new Date(), 'MM月DD日')
|
||
return {
|
||
statusBarHeight:'',// 每个手机的状态栏高度
|
||
page:'/pages/index/index',
|
||
bodyList:[],//列表
|
||
menu:'', // 胶囊按钮高度
|
||
startDate:'',// 开始时间
|
||
endData:'', // 结束时间
|
||
popupType:'center',
|
||
popupShow:false,
|
||
popup:true,
|
||
tabTypeList:[
|
||
{ imgUrl: 'https://eshangtech.com/ShopICO/ahyd-BID/index/car.svg', path: '/pages/commercialBI/carPortrait', name: '车流画像'},
|
||
{ imgUrl: '/static/images/index/guest.svg', path: '/pages/commercialBI/guestPortrait', name: '客群画像' },
|
||
{ imgUrl: '/static/images/index/business_icon.svg', path: '/pages/commercialBI/managePortrait', name: '经营画像' },
|
||
{ imgUrl: '/static/images/index/trade.svg', path: '/pages/commercialBI/businessPortrait', name: '交易画像' }
|
||
],
|
||
// { imgUrl: '/static/images/index/brand.svg', path: '/pages/commercialBI/formatPortrait', name: '业态品牌' }
|
||
detailTypeList:[{ name: '分润门店', unit: '/个', value: '-',yesterValue:'-', add: '', imgIcon: '/static/images/index/store.svg' },
|
||
{ name: '驿达分润', unit: '/元', value: '-',yesterValue:'-', imgIcon: '/static/images/index/yidaFenrun.svg' },
|
||
{ name: '订单配送', unit: '/单', value: '-',yesterValue:'-', add: '', imgIcon: '/static/images/index/orderDelivery.svg' },
|
||
{ name: '采购金额', unit: '/元', value: '-',yesterValue:'-', imgIcon: '/static/images/index/purchaseAmount.svg' },],
|
||
propOfRevenList:[
|
||
// { name: '经营模式', value: 1 },
|
||
{ name: '区域营收', value: 2 },
|
||
{ name: '经营业态', value: 1 }],
|
||
selectTab:2, // 选项卡的指针
|
||
monthAmountAdd:'',//月累计
|
||
yearAmountAdd:'',//年累计
|
||
mobileData :{}, // 移动支付分账接口返回的数据
|
||
single:'', // 时间选择器选择的时间
|
||
monthAdd: null,//月每天的相对增加
|
||
yearAdd:'', // 年度计划增加的百分比
|
||
thisDay:'', // 显示的星期几
|
||
isBig:false,//判断门店上传的前一个数字是否比后一个数字大
|
||
allShopCount: 0,//门店总数
|
||
theRequest: null,
|
||
lastDay: lastDay, // 该页面的最近有效日期
|
||
nowDay: nowDay, // 当天时间
|
||
buyPriceYes:'',//昨日采购金额
|
||
regionList: null,
|
||
nowTab: 1,
|
||
showNotice:false,
|
||
showNoticeYear:false,
|
||
priceMove:false,//价格出现的动画效果
|
||
carInfo:{},//车流信息
|
||
regionProgress: null,
|
||
areaProgress: null,
|
||
modelProgress: null,
|
||
showTableData:{
|
||
},
|
||
monthPrice:0,//月度累计分润
|
||
yesterdayBillCount:0,//昨日累计配送
|
||
lastDayBillCount:0,//当前日的配送
|
||
buyPriceMonth:0,//月度的采购金额
|
||
totalData:null,
|
||
option:{},//onLoad里面的option
|
||
isShow:false, //投诉建议是否显示
|
||
isShowTitle:0,//投诉建议条数
|
||
isShowId:0,//投诉id
|
||
plan:{},//月度和年度接口的返回参数 一起的
|
||
ShareShopCountYes:0,//昨日的店铺数
|
||
yesterdayAllPay:0,//前一天的营收总额
|
||
noChangeLastDay: lastDay,
|
||
wechatPushSalesList: null, // 甘肃单品排行数据
|
||
seat:{},//用户经纬度信息
|
||
nearServiceInfo:{
|
||
SERVERPART_NAME:"广德服务区",
|
||
SPREGIONTYPE_NAME:"芜湖片区",
|
||
Serverpart_ID:524
|
||
},//最近服务区的有用信息
|
||
monthNoticeText:'',
|
||
yearNoticeText:'',
|
||
isSuccess:false,//首页这些接口是否全部调用成功
|
||
isReturn : true,
|
||
isSuggestion:false,//可不可以看意见
|
||
loadMore:false,// 是否展示更多
|
||
special:false,
|
||
allTrafficList:[],// 车流数据数组
|
||
showTrafficList:[],// 显示在页面上车流数据
|
||
warningList:[],// 预警列表
|
||
selectDetail:0,// 选中的统计标签
|
||
nowMonth:0,// 当前的月份
|
||
selectMonth:0,//选择的月份
|
||
useInfo:{},//用户信息
|
||
showRealBox:false,// 是否显示对客营收的完整数据
|
||
yesObj:{},// 昨日营收数据
|
||
typeList:[],//自营和外租的数据
|
||
showPortrait:false,// 是否显示五个画像的框
|
||
examineObj:{},// 考核详情
|
||
dailyExamineObj:{},//巡检数据详情
|
||
stopSwiper:false,// 阻止swiper调用
|
||
phoneWidth:0,// 手机的宽度
|
||
progressObj:{},//自营和外租的占比
|
||
showHaveNotice:false,// 显示月份详情卡片的进度条点击显示的内容
|
||
trafficQOQObj:{},// 环比对象
|
||
trafficYOYObj:{},// 同比对象
|
||
}
|
||
},
|
||
watch:{
|
||
user:{
|
||
// 新用户刚进来的时候可能onLoad会执行不了 监听他的user变化确保能请求
|
||
handler:function (value){
|
||
let userInfo = uni.getStorageSync('vuex')
|
||
userInfo = JSON.parse(userInfo)
|
||
if (this.isReturn===true){
|
||
// 无权限就会跳转到无数据的页面
|
||
if (userInfo.userData.AuthorityInfo['89a1f248-2113-4d57-84b1-c2e6edb9e8ee']===1){
|
||
this.isReturn = false
|
||
}else{
|
||
uni.redirectTo({
|
||
url:`/pages/commercialBI/noData?type=noAuthor`
|
||
})
|
||
}
|
||
|
||
if (userInfo.userData.AuthorityInfo['e2fb458b-d1bd-48fa-805e-fc93dc71efb7'] === 1 || userInfo.userData.AuthorityInfo['ea2fc404-d924-4c88-98de-1f4d96137745'] === 1){
|
||
this.getSuggestion()
|
||
}
|
||
// 拿到用户当前的经纬度位置
|
||
this.seat = uni.getStorageSync('seatInfo')
|
||
if (!this.seat){
|
||
//获取用户的经纬度位置存在stroge里面
|
||
wx.getFuzzyLocation({
|
||
type:'gcj02',
|
||
altitude:true,
|
||
success: (res) =>{
|
||
let seatInfo = {
|
||
latitude:res.latitude,
|
||
longitude:res.longitude
|
||
}
|
||
uni.setStorageSync('seatInfo', seatInfo);
|
||
this.seat = seatInfo
|
||
}
|
||
})
|
||
}else{
|
||
//拿到最近服务区的数据
|
||
this.nearestService()
|
||
}
|
||
if (!this.isReturn){
|
||
this.getData(this.option)
|
||
this.handleNoticeMonth()
|
||
this.handleNoticeYear()
|
||
}
|
||
}
|
||
},
|
||
deep:true
|
||
},
|
||
seat:{
|
||
handler(value){
|
||
if (value.latitude && value.longitude){
|
||
this.nearestService()
|
||
}
|
||
}
|
||
}
|
||
},
|
||
computed: {
|
||
...mapState({
|
||
'PushAuthority': (state) => state.userData.PushAuthority,
|
||
'ProvinceCode': (state) => state.userData.ProvinceCode,
|
||
toDoMsg:(state)=>{return state.toDoMsg},
|
||
}),
|
||
hasSeverpartIndexAuthority() {
|
||
let theRequest = this.theRequest
|
||
if (this.theRequest && theRequest.ProvinceCode && this.PushAuthority) {
|
||
return this.PushAuthority.some(n =>
|
||
n.ProvinceCode == theRequest.ProvinceCode && n.ShopAnalysisType == 1
|
||
)
|
||
}
|
||
return false
|
||
},
|
||
...mapGetters({'user':'getUser'})
|
||
},
|
||
onLoad(option){
|
||
// 顶部显示的时间
|
||
this.single = timestampToTimeMonth((new Date(this.lastDay).getTime()))
|
||
// 获取手机参数对页面进行适配 主要是用于拿到胶囊的位置
|
||
let systemInfo = uni.getSystemInfoSync()
|
||
this.statusBarHeight = Number(systemInfo.statusBarHeight)
|
||
this.menu = uni.getMenuButtonBoundingClientRect()
|
||
// 拿到用户手机的宽 用设计图的宽高比去设定上半部的高度
|
||
this.phoneWidth = systemInfo.windowWidth
|
||
// 拿到昨天的时间戳
|
||
const date = new Date(this.lastDay)
|
||
// 拿到选择日期的月份
|
||
this.nowMonth = date.getMonth() + 1
|
||
// 默认选择的月份
|
||
this.selectMonth = date.getMonth() + 1
|
||
// 设置顶部时间选择器的开始时间 因为不能选去年数据 所以只能从当前日期的年份开始计算
|
||
this.startDate = `${date.getFullYear()}-01`
|
||
// 顶部卡片滚动的第几个 月份减1 就是卡片的index
|
||
this.selectDetail = this.nowMonth - 1
|
||
// 设置顶部选时间的显示 结束时间不能是大于等于今天
|
||
this.endData = new Date()
|
||
// 星期几
|
||
this.thisDay = getThisDay(date.getDay())
|
||
// 把时间存起来给全部页面都能拿到
|
||
uni.setStorageSync('lastDay',this.lastDay)
|
||
// 小程序进来存起来的用户信息
|
||
let userInfo = uni.getStorageSync('vuex')
|
||
userInfo = JSON.parse(userInfo)
|
||
this.useInfo = JSON.parse(JSON.stringify(userInfo))
|
||
// 判断有没有权限
|
||
if (userInfo.userData.AuthorityInfo['89a1f248-2113-4d57-84b1-c2e6edb9e8ee']===1){
|
||
this.isReturn = false
|
||
}else{
|
||
uni.redirectTo({
|
||
url:`/pages/commercialBI/noData?type=noAuthor`
|
||
})
|
||
}
|
||
if (!this.isReturn){
|
||
let userInfo = uni.getStorageSync('vuex')
|
||
userInfo = JSON.parse(userInfo)
|
||
// 判断是否有投诉建议的悬浮框弹出
|
||
if (userInfo.userData.AuthorityInfo['e2fb458b-d1bd-48fa-805e-fc93dc71efb7'] === 1 || userInfo.userData.AuthorityInfo['ea2fc404-d924-4c88-98de-1f4d96137745'] === 1){
|
||
this.getSuggestion()
|
||
}
|
||
//拿到option的值
|
||
this.option = option
|
||
// 获取数据的方法
|
||
if (this.user.Membership_Id){
|
||
this.getData(option)
|
||
}
|
||
// 判断缓存中是否有位置信息 没有的话 向用户请求 拿到用户当前位置
|
||
// 拿到当前位置之后去请求离当前位置最近的服务区 作为第一次进入小程序自动选中的服务区
|
||
// 在用户选择服务区之后就会有当前服务区
|
||
// 用户的当前坐标,如果没有就重新请求坐标 有了就去调最近的服务区
|
||
this.seat = uni.getStorageSync('seatInfo')
|
||
if (!this.seat){
|
||
//获取用户的经纬度位置存在stroge里面
|
||
wx.getFuzzyLocation({
|
||
type:'gcj02',
|
||
altitude:true,
|
||
success: (res) =>{
|
||
let seatInfo = {
|
||
latitude:res.latitude,
|
||
longitude:res.longitude
|
||
}
|
||
uni.setStorageSync('seatInfo', seatInfo);
|
||
this.seat = seatInfo
|
||
}
|
||
})
|
||
}else{
|
||
//拿到最近服务区的数据
|
||
this.nearestService()
|
||
}
|
||
//问号显示的内容 月份的数据请求 和 年份的数据请求
|
||
this.handleNoticeMonth()
|
||
this.handleNoticeYear()
|
||
// 如果十秒之后 isSuccess 没有变成true 说明接口有慢的或者报错了 才出现提示
|
||
setTimeout(()=>{
|
||
if (!this.isSuccess){
|
||
uni.showToast({
|
||
title: '加载失败,请下拉刷新重新加载',
|
||
icon: 'none',
|
||
duration: 3000
|
||
})
|
||
}
|
||
},10000)
|
||
}
|
||
},
|
||
onShow(){
|
||
// 隐藏掉小程序本身自带的 tabbar 让自定义的tabbar出现
|
||
uni.hideTabBar()
|
||
},
|
||
onHide(){
|
||
// 离开页面投诉建议的悬浮框隐藏掉
|
||
this.isShow = false
|
||
this.selectTab = 1
|
||
},
|
||
onUnload() {
|
||
this.$util.addUserBehavior()
|
||
},
|
||
onPullDownRefresh:function(){
|
||
if (!this.isReturn){
|
||
this.getData(this.option)
|
||
}
|
||
uni.stopPullDownRefresh();
|
||
},
|
||
methods:{
|
||
...mapActions(['memberLogin','getLoginCode']),
|
||
// 点击月份详情卡片进度条 显示的详情
|
||
handleShowHaveNoticeBox(){
|
||
this.showHaveNotice = !this.showHaveNotice
|
||
},
|
||
changeShowRealBox(){
|
||
this.showRealBox=!this.showRealBox
|
||
},
|
||
handleGoOtherFun(val){
|
||
if (val===1){
|
||
this.$util.toNextRoute('navigateTo', `/pages/map/detail?isPicker=${true}&come=index`)
|
||
}else if(val===2){
|
||
this.$util.toNextRoute('navigateTo', '/pages/examine/index?come=index')
|
||
}
|
||
},
|
||
handleChangeLoadMore(){
|
||
this.loadMore = !this.loadMore
|
||
},
|
||
handleGoCarBi(){
|
||
this.$util.toNextRoute('navigateTo', `/pages/commercialBI/carPortrait?mustAllProvince=${true}`)
|
||
},
|
||
handleGoWarning(){
|
||
this.$util.toNextRoute('navigateTo', `/pages/commercialBI/specialCase`)
|
||
},
|
||
//门店上传后面感叹号的点击事件
|
||
handleStoreUpload(){
|
||
this.popupShow = true
|
||
},
|
||
closePop(){
|
||
this.popupShow = false
|
||
},
|
||
async getSuggestion(){
|
||
let req = {
|
||
ModuleGuids:'e2fb458b-d1bd-48fa-805e-fc93dc71efb7,ea2fc404-d924-4c88-98de-1f4d96137745',
|
||
ProvinceCode:'340000'
|
||
}
|
||
const data = await request.$webGet('CommercialApi/Suggestion/GetMemberUnreadData',req)
|
||
if (data.Result_Data.data){
|
||
if (data.Result_Data.data !== '0'){
|
||
this.isShow = true
|
||
this.isShowTitle = data.Result_Data.data
|
||
this.isShowId = data.Result_Data.key
|
||
}
|
||
}
|
||
},
|
||
async handleNoticeMonth(){
|
||
let date = new Date(this.lastDay)
|
||
let y = date.getFullYear()
|
||
let m = date.getMonth() + 1
|
||
if(m<10){
|
||
m = '0'+m
|
||
}
|
||
//本月的
|
||
let req = {
|
||
SearchParameter:{
|
||
// STATISTICS_DATE:`${y}-${m}`,
|
||
ANALYSISINS_TYPE:'1011',
|
||
ANALYSISINS_FORMAT:'3000'
|
||
},
|
||
PageIndex:1,
|
||
PageSize:10
|
||
}
|
||
const data = await request.$webPost('CommercialApi/Analysis/GetANALYSISINSList',req)
|
||
this.monthNoticeText = data.Result_Data.List[0]?data.Result_Data.List[0].ANALYSIS_CONTENT:''
|
||
},
|
||
async handleNoticeYear(){
|
||
let date = new Date(this.lastDay)
|
||
let y = date.getFullYear()
|
||
let m = date.getMonth() + 1
|
||
if(m<10){
|
||
m = '0'+m
|
||
}
|
||
//本年
|
||
let reqYear = {
|
||
SearchParameter:{
|
||
// STATISTICS_DATE:`${y}`,
|
||
ANALYSISINS_TYPE:'1012',
|
||
ANALYSISINS_FORMAT:'3000'
|
||
},
|
||
PageIndex:1,
|
||
PageSize:10
|
||
}
|
||
const totalData = await request.$webPost('CommercialApi/Analysis/GetANALYSISINSList',reqYear)
|
||
if (totalData.Result_Data.List[0]){
|
||
this.yearNoticeText = totalData.Result_Data.List[0].ANALYSIS_CONTENT
|
||
}
|
||
},
|
||
async nearestService(){
|
||
let seat = uni.getStorageSync('seatInfo');
|
||
let req = {
|
||
longitude:seat.longitude,
|
||
Province_Code:'340000',
|
||
latitude:seat.latitude,
|
||
}
|
||
// const data = await request.$webGet('CommercialApi/BaseInfo/GetServerpartList',req)
|
||
// let res = {
|
||
// SERVERPART_NAME:data.Result_Data.List[0].SERVERPART_NAME,//服务区
|
||
// SPREGIONTYPE_NAME:data.Result_Data.List[0].SPREGIONTYPE_NAME,//片区
|
||
// SPRegionType_ID:data.Result_Data.List[0].SPREGIONTYPE_ID,//片区id
|
||
// Serverpart_ID:data.Result_Data.List[0].SERVERPART_ID,//服务区id
|
||
// longitude:data.Result_Data.List[0].SERVERPART_X,
|
||
// latitude:data.Result_Data.List[0].SERVERPART_Y,
|
||
// }
|
||
let res = {
|
||
SERVERPART_NAME: '安徽驿达',//服务区
|
||
SPREGIONTYPE_NAME: '安徽驿达',//片区
|
||
Serverpart_ID: null,
|
||
SPRegionType_ID: null,
|
||
longitude:'117.200927',
|
||
latitude:'31.832905',
|
||
}
|
||
uni.setStorageSync('nearService',res)
|
||
this.nearServiceInfo = res
|
||
},
|
||
handleShowNotice(){
|
||
this.showNotice = true
|
||
},
|
||
handleNoShowNotice(){
|
||
this.showNotice = false
|
||
},
|
||
handleShowNoticeYear(){
|
||
this.showNoticeYear = true
|
||
},
|
||
handleNoShowNoticeYear(){
|
||
this.showNoticeYear = false
|
||
},
|
||
handlePlanPageGo(type){
|
||
// this.$util.toNextRoute('navigateTo', `/pages/commercialBI/yearPlan`)
|
||
if (!this.isReturn){
|
||
this.$util.toNextRoute('navigateTo', `/pages/commercialBI/planMonth?lastDay=${this.lastDay}&type=${type}`)
|
||
}else{
|
||
uni.showToast({
|
||
title: '暂无权限请联系管理员',
|
||
icon: 'none'
|
||
})
|
||
}
|
||
},
|
||
handlePage(){
|
||
if (!this.isReturn){
|
||
if (this.selectMonth===this.nowMonth){
|
||
this.$util.toNextRoute('navigateTo', `/pages/everdayRenven/index?time=${this.lastDay}`)
|
||
}
|
||
}else{
|
||
uni.showToast({
|
||
title: '暂无权限请联系管理员',
|
||
icon: 'none'
|
||
})
|
||
}
|
||
},
|
||
handleGoTab(item){
|
||
if (!this.isReturn){
|
||
this.$util.toNextRoute('navigateTo', `${item.path}?time=${this.lastDay}&serviceInfo=${JSON.stringify(this.nearServiceInfo)}`)
|
||
} else{
|
||
uni.showToast({
|
||
title: '暂无权限请联系管理员',
|
||
icon: 'none'
|
||
})
|
||
}
|
||
},
|
||
// option是请求的参数 type是否是切换时间
|
||
getData(option,type){
|
||
//老代码
|
||
if (this.user.Membership_Id){
|
||
uni.showLoading({
|
||
title: '正在加载...'
|
||
})
|
||
}
|
||
//判断是否从推送进来
|
||
if (option.ProvinceCode) { // 从推送进入
|
||
this.theRequest = option
|
||
option.time = this.$util.cutDate(option.time, 'YYYY-MM-DD')
|
||
option.month = this.$util.cutDate(option.time, 'YYYYMM')
|
||
if (!type){
|
||
this.lastDay = this.$util.cutDate(option.time, 'YYYY-MM-DD')
|
||
//修改时间选择器里面的时间
|
||
this.single = timestampToTimeMonth((new Date(this.lastDay).getTime()))
|
||
// //显示当前选择的时间是星期几
|
||
// const date = new Date(this.lastDay)
|
||
// this.thisDay = getThisDay(date.getDay())
|
||
}
|
||
// 老项目的请求数据的那部分
|
||
this.initData()
|
||
//根据新页面请求数据的方法
|
||
this.initYesterdayData(type)
|
||
//车流分析
|
||
this.getCarInfo()
|
||
//月度计划、年度计划
|
||
this.monthYearPlan()
|
||
// 预警信息 有值会显示车流预警
|
||
this.handleGetWarningList()
|
||
// 获取月度考核数据
|
||
this.handleGetExamine()
|
||
// 获取巡检数据
|
||
this.handleGetDailyPatrol()
|
||
// 获取全省平均车流量
|
||
this.handleGetAllCarTraffic()
|
||
} else if (this.user.Membership_Id){ // 默认
|
||
// 不是从推送进来 走正常的请求方法
|
||
// if (!this.PushAuthority){return}
|
||
// if (this.PushAuthority.length > 0) {
|
||
// 定义initData中的入参
|
||
this.theRequest = this.defaultMsg() || {}
|
||
this.theRequest.time = this.lastDay
|
||
this.theRequest.month = this.$util.cutDate(this.lastDay, 'YYYYMM')
|
||
// 请求数据的方法 initData是老项目中的接口，形参true传入 可以让两个没用到的接口不调用
|
||
this.initData()
|
||
// 请求用的到的 昨日的数据
|
||
this.initYesterdayData(type)
|
||
//车流分析
|
||
this.getCarInfo()
|
||
//月度计划、年度计划
|
||
this.monthYearPlan()
|
||
// 是否显示预警信息
|
||
this.handleGetWarningList()
|
||
// 获取月度考核数据
|
||
this.handleGetExamine()
|
||
// 获取巡检数据
|
||
this.handleGetDailyPatrol()
|
||
// 获取全省平均车流量
|
||
this.handleGetAllCarTraffic()
|
||
}
|
||
|
||
// 老代码 不知道干啥用的
|
||
this.nowTab = this.theRequest.ProvinceCode == 340000 ? 1 : 2
|
||
if (this.theRequest.GroupType == 1010) {
|
||
this.getDetail(this.theRequest)
|
||
}
|
||
// 若省份为甘肃，则加载甘肃单品排行
|
||
if (this.theRequest.ProvinceCode == 620000) {
|
||
|
||
this.getRankContent()
|
||
}
|
||
},
|
||
handleGetWarningList(){
|
||
const date = new Date()
|
||
// 拿到当前小时的前一小时
|
||
let h = date.getHours() - 1
|
||
let y = date.getFullYear()
|
||
let m = date.getMonth() + 1
|
||
if (m<10){
|
||
m = '0'+m
|
||
}
|
||
let d = date.getDate()
|
||
if (d<10){
|
||
d = '0'+d
|
||
}
|
||
const req= {
|
||
// this.single
|
||
StatisticsDate: `${y}-${m}-${d}`,
|
||
StatisticsHour:h,
|
||
StatisticsType:1,
|
||
ShowCount:20
|
||
}
|
||
request.$webGet('CommercialApi/BigData/GetBayonetWarning',req).then(res=>{
|
||
if (res.Result_Data.List.length>0){
|
||
this.special = true
|
||
}
|
||
res.Result_Data.List.forEach(item=>{
|
||
item.name = item.SERVERPART_NAME.split('服务区')[0]
|
||
})
|
||
let list = JSON.parse(JSON.stringify(res.Result_Data.List))
|
||
for (let i=0;i<=list.length - 1;i++){
|
||
for (let j=0;j<=list.length - i - 1 ;j++){
|
||
if (list[j] && list[j + 1] && list[j].VEHICLE_COUNT!==null && list[j+1].VEHICLE_COUNT!==null){
|
||
if (list[j].VEHICLE_COUNT < list[j+1].VEHICLE_COUNT ){
|
||
let temp = list[j]
|
||
list[j] = list[j + 1]
|
||
list[j + 1] = temp
|
||
}
|
||
}
|
||
}
|
||
}
|
||
this.warningList = list.slice(0,3)
|
||
})
|
||
},
|
||
handleReg(){
|
||
this.$util.toNextRoute('redirectTo', '/pages/register/register')
|
||
},
|
||
// 跳转到经营报表
|
||
handleGoOperate(){
|
||
this.$util.toNextRoute('navigateTo', `/pages/operatingStatements/index?time=${this.single}`)
|
||
},
|
||
changeShowPortrait(){
|
||
this.showPortrait = !this.showPortrait
|
||
},
|
||
handleFestival(){
|
||
this.$util.toNextRoute('navigateTo', `/pages/commercialBI/formatPortrait?time=${this.lastDay}&serviceInfo=${JSON.stringify(this.nearServiceInfo)}`)
|
||
// uni.showToast({title: '栏目建设中', icon: 'none'})
|
||
},
|
||
handleMoney(){
|
||
this.$util.toNextRoute('navigateTo', `/pages/revenue/index`)
|
||
},
|
||
handleSearch(type){
|
||
if (type ==='special'){
|
||
if(!this.isReturn){
|
||
this.special=false
|
||
this.$util.toNextRoute('navigateTo', '/pages/commercialBI/specialCase')
|
||
}
|
||
}else{
|
||
let req = {
|
||
SuggestionIds:this.isShowId
|
||
}
|
||
request.$webGet('CommercialApi/Suggestion/RecordReadingLog',req).then(()=>{
|
||
this.$util.toNextRoute('navigateTo', '/pages/suggestion/suggestion')
|
||
})
|
||
}
|
||
|
||
},
|
||
// 改变时间触发的方法 ，改变页面的内容数据
|
||
onRefresh(type){
|
||
// 有权限就让他刷新 不没权限的时候下拉刷新不会调用
|
||
if (!this.isReturn){
|
||
this.getData(this.option,type)
|
||
}
|
||
},
|
||
getUnUpLoadList(){
|
||
let req = {pushProvinceCode:'340000',
|
||
Statistics_Date:this.lastDay}
|
||
request.$webGet('CommercialApi/Revenue/GetRevenuePushList',req).then(res=>{
|
||
let list = []
|
||
res.Result_Data.List.forEach(item=>{
|
||
if (item.Revenue_Upload === 0 || !item.Revenue_Upload){
|
||
list.push(item)
|
||
}
|
||
})
|
||
this.bodyList = list
|
||
this.allShopCount = res.Result_Data.List.length
|
||
})
|
||
},
|
||
monthYearPlan(){
|
||
let monthDate
|
||
const nowDate = new Date(this.lastDay)
|
||
if (this.selectMonth === nowDate.getMonth()+1){
|
||
monthDate= {
|
||
Province_Code:'340000',
|
||
Statistics_Date:this.lastDay
|
||
}
|
||
}else{
|
||
let day = this.$util.getThisMonthDay(this.single)
|
||
const date = new Date(this.single)
|
||
let y = date.getFullYear()
|
||
let m = date.getMonth() + 1
|
||
if(m<10){
|
||
m='0'+m
|
||
}
|
||
monthDate= {
|
||
Province_Code:'340000',
|
||
Statistics_Date:`${y}-${m}-${day}`
|
||
}
|
||
}
|
||
request.$webGet('CommercialApi/Revenue/GetRevenueBudget',monthDate).then(res=>{
|
||
// 赋值给data中的这个对象 在请求完之后会进行统一的数据处理
|
||
this.plan = res.Result_Data
|
||
this.plan.percentageMonth = res.Result_Data.MonthBudget_Degree
|
||
this.plan.percentageYear = res.Result_Data.YearBudget_Degree
|
||
this.monthAdd = this.plan.MonthGrowth_Rate>0?`+${this.plan.MonthGrowth_Rate}`:`${this.plan.MonthGrowth_Rate}`
|
||
this.yearAdd = this.plan.YearGrowth_Rate>0?`+${this.plan.YearGrowth_Rate}`:`${this.plan.YearGrowth_Rate}`
|
||
//处理数据
|
||
let flag1
|
||
flag1 = (res.Result_Data.RevenueMonth_Amount / 10000).toString().indexOf('.')
|
||
this.plan.RevenueMonth_Amount = (res.Result_Data.RevenueMonth_Amount / 10000).toString().substring(0,flag1)
|
||
this.plan.RevenueMonth_Amount = this.$util.noDecimal(this.plan.RevenueMonth_Amount)
|
||
let flag2
|
||
flag2 = (res.Result_Data.BudgetMonth_Amount / 10000).toString().indexOf('.')
|
||
this.plan.BudgetMonth_Amount = (res.Result_Data.BudgetMonth_Amount / 10000).toString().substring(0,flag2)
|
||
this.plan.BudgetMonth_Amount= this.$util.noDecimal(this.plan.BudgetMonth_Amount)
|
||
|
||
|
||
let revenueType = ''
|
||
let flag3
|
||
if (res.Result_Data.RevenueYear_Amount>100000000){
|
||
revenueType='yi'
|
||
flag3 = (res.Result_Data.RevenueYear_Amount/ 100000000).toString().indexOf('.')
|
||
this.plan.RevenueYear_Amount = (res.Result_Data.RevenueYear_Amount/ 100000000).toString().substring(0,flag3+3)
|
||
}else{
|
||
revenueType='wan'
|
||
flag3 = (res.Result_Data.RevenueYear_Amount/ 10000).toString().indexOf('.')
|
||
this.plan.RevenueYear_Amount = (res.Result_Data.RevenueYear_Amount/ 10000).toString().substring(0,flag3+3)
|
||
}
|
||
let budgetType=''
|
||
let flag4
|
||
if (res.Result_Data.BudgetYear_Amount>100000000){
|
||
budgetType='yi'
|
||
flag4 = ( res.Result_Data.BudgetYear_Amount/ 100000000).toString().indexOf('.')
|
||
this.plan.BudgetYear_Amount = (res.Result_Data.BudgetYear_Amount/ 100000000).toString().substring(0,flag4+3)
|
||
}else{
|
||
budgetType='wan'
|
||
flag4 = ( res.Result_Data.BudgetYear_Amount/ 100000000).toString().indexOf('.')
|
||
this.plan.BudgetYear_Amount = (res.Result_Data.BudgetYear_Amount/ 10000).toString().substring(0,flag4+3)
|
||
}
|
||
this.plan.revenueType = revenueType
|
||
this.plan.budgetType = budgetType
|
||
})
|
||
},
|
||
handleChangeSelect(e){
|
||
if (!this.stopSwiper){
|
||
this.selectMonth = e.detail.current + 1
|
||
this.selectDetail = e.detail.current
|
||
const date = new Date(this.lastDay)
|
||
let y = date.getFullYear()
|
||
let m = e.detail.current + 1
|
||
if(m<10){
|
||
m='0'+m
|
||
}
|
||
this.single = `${y}-${m}`
|
||
let day
|
||
if (this.selectMonth === date.getMonth()+1){
|
||
day = date.getDate()<10?'0'+date.getDate():date.getDate()
|
||
}else{
|
||
day = this.$util.getThisMonthDay(this.single)
|
||
}
|
||
this.showTableData = null
|
||
this.yesObj = null
|
||
this.typeList = []
|
||
this.carInfo = null
|
||
this.examineObj = null
|
||
this.dailyExamineObj = null
|
||
this.monthAdd = null
|
||
// 月份详情卡片的详情
|
||
this.initYesterdayData(this.selectMonth!==date.getMonth()+1)
|
||
// 自营计划
|
||
this.monthYearPlan(`${y}-${m}-${day}`)
|
||
// 切换月份的车流量变化
|
||
// 是当前月份传入日期 不是当前日期传入月份
|
||
let carDate
|
||
if (this.selectMonth === date.getMonth()+1){
|
||
carDate = this.lastDay
|
||
}else{
|
||
carDate = `${y}${m}`
|
||
}
|
||
this.getCarInfo(carDate)
|
||
// 切换考核的数据
|
||
this.handleGetExamine()
|
||
// 切换日常巡检数据
|
||
|
||
this.handleGetDailyPatrol()
|
||
}
|
||
},
|
||
getCarInfo(date){
|
||
const data = {
|
||
Statistics_Date:date?date:this.lastDay,
|
||
Province_Code:'340000'
|
||
}
|
||
request.$webGet('CommercialApi/Revenue/GetAvgBayonetAnalysis',data).then(res=>{
|
||
// 赋值给data中的这个对象 在请求完之后会进行统一的数据处理
|
||
this.carInfo = res.Result_Data
|
||
this.carInfo.Vehicle_Count = res.Result_Data.Vehicle_Count?res.Result_Data.Vehicle_Count:'-'
|
||
})
|
||
},
|
||
// 获取月度考核数据
|
||
handleGetExamine(){
|
||
let date = this.$util.cutDate(this.single, 'YYYYMM')
|
||
const req = {
|
||
DataType:1,
|
||
StartMonth: date,
|
||
EndMonth: date,
|
||
provinceCode:this.useInfo.userData.ProvinceCode || '340000'
|
||
}
|
||
|
||
request.$webGet('CommercialApi/Examine/GetExamineAnalysis',req).then(res=>{
|
||
let obj={
|
||
A:0,
|
||
B:0,
|
||
C:0
|
||
}
|
||
res.Result_Data.List.forEach(item=>{
|
||
if(item.data==="A"){
|
||
obj.A+=Number(item.value)
|
||
}else if(item.data==="B"){
|
||
obj.B+=Number(item.value)
|
||
}else if(item.data==="C"){
|
||
obj.C+=Number(item.value)
|
||
}
|
||
})
|
||
this.examineObj = obj
|
||
|
||
})
|
||
},
|
||
// 获得日常巡检数据
|
||
handleGetDailyPatrol(){
|
||
const date = new Date(this.lastDay)
|
||
let obj ={
|
||
start:'',
|
||
end:''
|
||
}
|
||
if (this.selectMonth === date.getMonth()+1){
|
||
obj = null
|
||
}else{
|
||
const date = new Date(this.single)
|
||
let y = date.getFullYear()
|
||
let m = date.getMonth() + 1
|
||
if(m<10){
|
||
m='0'+m
|
||
}
|
||
obj.start = `${y}-${m}-01`
|
||
let d = this.$util.getThisMonthDay(this.single)
|
||
if (d<10){
|
||
d = '0'+ d
|
||
}
|
||
obj.end = `${y}-${m}-${d}`
|
||
}
|
||
const req = {
|
||
StartDate:obj && obj.start?obj.start:this.lastDay,
|
||
EndDate:obj && obj.end?obj.end:this.lastDay,
|
||
provinceCode:this.useInfo.userData.ProvinceCode || '340000'
|
||
}
|
||
request.$webGet('CommercialApi/Examine/GetPatrolAnalysis',req).then(res=>{
|
||
this.dailyExamineObj = res.Result_Data
|
||
})
|
||
},
|
||
// 跳转到考核
|
||
handleGoExamine(type){
|
||
this.$util.toNextRoute('navigateTo', `/pages/examine/index?come=index&type=${type}&time=${this.single}`)
|
||
},
|
||
async initYesterdayData(type){
|
||
// type 判断如果是滑动的 就是true 日期就传空 别的地方调用 默认传入时间
|
||
let flag3 = false
|
||
// 获取营收推送汇总数据 老的
|
||
// const allPriceData = {
|
||
// pushProvinceCode:'340000',
|
||
// Statistics_Date:this.lastDay,
|
||
// ShowCompareRate: true,
|
||
// ShowYearRevenue: true
|
||
// }
|
||
const nowDate = new Date(this.lastDay)
|
||
let month = JSON.parse(JSON.stringify(this.selectMonth))
|
||
if (month<10){
|
||
month = '0'+ month
|
||
}
|
||
let req
|
||
if (type){
|
||
if (nowDate.getMonth() + 1 === this.selectMonth ){
|
||
req = {
|
||
pushProvinceCode:this.useInfo.userData.ProvinceCode || '340000',
|
||
StatisticsMonth:`${nowDate.getFullYear()}${month}`,
|
||
StatisticsDate:this.lastDay
|
||
}
|
||
}else{
|
||
req = {
|
||
pushProvinceCode:this.useInfo.userData.ProvinceCode || '340000',
|
||
StatisticsMonth:`${nowDate.getFullYear()}${month}`
|
||
}
|
||
}
|
||
|
||
}else{
|
||
req = {
|
||
pushProvinceCode:this.useInfo.userData.ProvinceCode || '340000',
|
||
StatisticsMonth:`${nowDate.getFullYear()}${month}`,
|
||
StatisticsDate:type?null:this.lastDay
|
||
}
|
||
}
|
||
uni.showLoading({
|
||
title: '正在加载...'
|
||
})
|
||
request.$webGet('CommercialApi/Revenue/GetSummaryRevenueMonth',req).then(lastData=>{
|
||
flag3 = true
|
||
let result = lastData.Result_Data
|
||
let progressAll = 0
|
||
|
||
result.BusinessTypeList.forEach(item=>{
|
||
progressAll+=Number(item.value)
|
||
let index = (item.value /10000).toString().indexOf('.')
|
||
item.showValue =(item.value /10000).toString().substring(0,index+3)
|
||
// 同比
|
||
if (item.data){
|
||
let number = ((item.value - item.data)/item.data)*100
|
||
if (number>0){
|
||
item.add ='+'+number.toFixed(2)+'%'
|
||
}else if(number<0){
|
||
item.add =number.toFixed(2)+'%'
|
||
}else{
|
||
item.add = null
|
||
}
|
||
}
|
||
// 环比
|
||
if(item.key){
|
||
let number = ((item.value - item.key)/item.key)*100
|
||
if (number>0){
|
||
item.addQOQ ='+'+number.toFixed(2)+'%'
|
||
}else if(number<0){
|
||
item.addQOQ =number.toFixed(2)+'%'
|
||
}else{
|
||
item.addQOQ = null
|
||
}
|
||
}
|
||
})
|
||
this.typeList = result.BusinessTypeList
|
||
|
||
this.progressObj={
|
||
owner:Number(((this.typeList[0].value / progressAll)*100).toFixed(2)),
|
||
other:100-Number(((this.typeList[0].value / progressAll)*100).toFixed(2))
|
||
}
|
||
|
||
// 计算百分比
|
||
this.regionProgress = result.BusinessTradeList
|
||
let all = 0
|
||
this.regionProgress.forEach(item=>{
|
||
all +=Number(item.value)
|
||
})
|
||
this.regionProgress.forEach(item=>{
|
||
item.percentage = ((item.value / all)*100).toFixed(2)
|
||
})
|
||
// 计算百分比
|
||
this.areaProgress = result.SPRegionList
|
||
let all2 = 0
|
||
this.areaProgress.forEach(item=>{
|
||
all2 +=Number(item.value)
|
||
})
|
||
this.areaProgress.forEach(item=>{
|
||
item.percentage = ((item.value / all2)*100).toFixed(2)
|
||
})
|
||
|
||
|
||
this.showTableData = result.MonthRevenueModel
|
||
if (this.showTableData.RevenueYOY){
|
||
this.showTableData.add = Number(((this.showTableData.CashPay-this.showTableData.RevenueYOY)/this.showTableData.RevenueYOY*100).toFixed(2))
|
||
this.showTableData.add = this.showTableData.add>0?'+'+this.showTableData.add:this.showTableData.add
|
||
}
|
||
if (this.showTableData.YearRevenueAmount){
|
||
console.log('result.MonthRevenueModel',result.MonthRevenueModel)
|
||
// 不四舍五入的截取年度累计
|
||
let index = (result.MonthRevenueModel.YearRevenueAmount / 100000000).toString().indexOf('.')
|
||
this.showTableData.allRevenueYear = (result.MonthRevenueModel.YearRevenueAmount / 100000000).toString().substring(0,index+3)
|
||
// 同比去年的年度累计
|
||
let yearYoY = (((result.MonthRevenueModel.YearRevenueAmount - result.MonthRevenueModel.YearRevenueYOY) / result.MonthRevenueModel.YearRevenueYOY)*100).toFixed(2)
|
||
console.log('yearYoY',yearYoY)
|
||
this.showTableData.yearYoY = Number(yearYoY)
|
||
}
|
||
if (this.showTableData.RevenueQOQ){
|
||
// 对客的环比
|
||
let customerQoQ = (((result.MonthRevenueModel.CashPay - result.MonthRevenueModel.RevenueQOQ) / result.MonthRevenueModel.RevenueQOQ)*100).toFixed(2)
|
||
console.log('customerQoQ',customerQoQ)
|
||
this.showTableData.customerQoQ = Number(customerQoQ)>0?'+'+customerQoQ+'%':Number(customerQoQ)<0?'-'+customerQoQ+'%':''
|
||
|
||
}
|
||
|
||
this.yesObj = result.RevenuePushModel
|
||
if (this.yesObj){
|
||
let indexYes = (result.RevenuePushModel.CashPay / 10000).toString().indexOf('.')
|
||
this.yesObj.CashPay = (result.RevenuePushModel.CashPay / 10000).toString().substring(0,indexYes+3)
|
||
|
||
}
|
||
|
||
if (result.GrowthRate){
|
||
this.showTableData.compared = result.GrowthRate
|
||
}
|
||
if (flag3){
|
||
// uni.hideLoading()
|
||
this.todayAmount()
|
||
}
|
||
})
|
||
|
||
// const lastData = await request.$webGet('CommercialApi/Revenue/GetSummaryRevenue',allPriceData)
|
||
// flag3 = true
|
||
// let result = lastData.Result_Data
|
||
// // 接口返回的数据中有三个数组的结构 排除掉不是数组的几项 对数组进行操作
|
||
// for(let key in result){
|
||
// if (key!=='RevenuePushModel' && key!=='GrowthRate' && key!=='MonthRevenueAmount' && key!=='YearRevenueAmount'){
|
||
// let all = 0
|
||
// // 先算出全部的总额数量 用来计算百分比
|
||
// result[key].forEach(item=>{
|
||
// all += Number(item.value)
|
||
// })
|
||
// // 把百分比计算出来加到每一项中
|
||
// result[key].map(item=>{
|
||
// item.percentage = ((Number(item.value)/all)*100).toFixed(2)
|
||
// })
|
||
// // 格式化掉处理的数据
|
||
// result[key].forEach(item=>{
|
||
// item.value = _this.$util.fmoney(item.value)
|
||
// })
|
||
// }
|
||
// }
|
||
// this.monthAmountAdd = this.$util.fmoney(result.MonthRevenueAmount)
|
||
// this.yearAmountAdd = result.YearRevenueAmount?this.$util.fmoney(result.YearRevenueAmount):'-'
|
||
// this.modelProgress = result.BusinessTypeList
|
||
// 只有当前面的接口通了 才能一起处理数据的方法
|
||
},
|
||
//获取全省平均车流量
|
||
handleGetAllCarTraffic(){
|
||
const date = new Date(this.lastDay)
|
||
let time
|
||
if (this.selectMonth === date.getMonth()+1){
|
||
time = this.lastDay
|
||
}else{
|
||
const date = new Date(this.single)
|
||
let y = date.getFullYear()
|
||
let m = date.getMonth() + 1
|
||
if(m<10){
|
||
m='0'+m
|
||
}
|
||
time = `${y}${m}`
|
||
}
|
||
const req = {
|
||
Province_Code:this.useInfo.userData.ProvinceCode || '340000',
|
||
Statistics_Date:time
|
||
}
|
||
request.$webGet('CommercialApi/Revenue/GetProvinceAvgBayonetAnalysis',req).then(res=>{
|
||
console.log('res',res)
|
||
res.Result_Data.List.forEach(item=>{
|
||
if (item.Serverpart_Name==='QOQ'){
|
||
this.trafficQOQObj = item
|
||
}else if(item.Serverpart_Name==='YOY'){
|
||
this.trafficYOYObj = item
|
||
}
|
||
})
|
||
})
|
||
},
|
||
defaultMsg() {
|
||
let option = null
|
||
let _this = this
|
||
if (this.PushAuthority && this.PushAuthority.length > 1) {
|
||
option = this.PushAuthority.find(n => n.ProvinceCode === _this.ProvinceCode)
|
||
}else if(this.user.Membership_Id){
|
||
option = {GroupType: 1000,
|
||
ProvinceCode: 340000,
|
||
ServerpartIds: "",
|
||
ShopAnalysisType: 1}
|
||
}else {
|
||
|
||
}
|
||
return {
|
||
...option
|
||
}
|
||
},
|
||
handleSelectTab(value){
|
||
this.selectTab = value
|
||
},
|
||
// 顶部的时间组件切换时间触发的方法
|
||
bindDateChange(e){
|
||
this.showTableData = null
|
||
this.yesObj = null
|
||
this.typeList = []
|
||
this.carInfo = null
|
||
this.examineObj = null
|
||
this.dailyExamineObj = null
|
||
this.monthAdd = null
|
||
|
||
// 阻止调用swiper的滚动
|
||
this.stopSwiper = true
|
||
let isOnRefresh = false
|
||
const date = new Date(e.detail.value)
|
||
this.selectMonth = date.getMonth() + 1
|
||
this.selectDetail = date.getMonth()
|
||
// this.stopSwiper = false
|
||
|
||
|
||
const realDate = new Date(this.lastDay)
|
||
const realMonth = realDate.getMonth()+1
|
||
if (this.selectMonth>realMonth){
|
||
isOnRefresh = false
|
||
}else{
|
||
isOnRefresh = true
|
||
}
|
||
|
||
// let isOnRefresh = false
|
||
// let startTime = new Date(this.startDate).getTime()- 8 * 3600 * 1000
|
||
// let endTime = new Date(this.noChangeLastDay).getTime() - 8 * 3600 * 1000 //结束时间戳
|
||
// const date = new Date(e.detail.value).getTime() - 8 * 3600 * 1000
|
||
// let startDate = new Date(this.startDate)
|
||
// let startMonth = startDate.getMonth() + 1
|
||
// let startDay = startDate.getDate()
|
||
// let endDate = new Date(this.noChangeLastDay)
|
||
// let endMonth = endDate.getMonth() + 1
|
||
// let endDay = endDate.getDate()
|
||
|
||
|
||
|
||
// 判断是否是在限制的时间内
|
||
// isOnRefresh 是判断有没有限制条件的关键参数
|
||
// if (date > endTime || date < startTime){
|
||
// isOnRefresh = false
|
||
// }else{
|
||
// isOnRefresh = true
|
||
// }
|
||
|
||
// const nowDate = new Date()
|
||
// let y = nowDate.getFullYear()
|
||
// let m = nowDate.getMonth() +1
|
||
// if (m<10){
|
||
// m= '0'+m
|
||
// }
|
||
// let d = nowDate.getDate()
|
||
// if (d<10){
|
||
// d= '0'+d
|
||
// }
|
||
// let nowDay = new Date(`${y}-${m}-${d}`).getTime()- 8 * 3600 * 1000
|
||
// if (nowDay<=date){
|
||
// isOnRefresh = false
|
||
// }else{
|
||
// isOnRefresh = true
|
||
// }
|
||
// 符合要求的时间可以请求数据 不符合的弹出提示
|
||
if (isOnRefresh){
|
||
this.single = timestampToTimeMonth(date)
|
||
// this.lastDay = e.detail.value
|
||
// uni.setStorageSync('lastDay',this.lastDay)
|
||
// this.thisDay = getThisDay(new Date(e.detail.value).getDay())
|
||
this.onRefresh(true)
|
||
|
||
}else{
|
||
// uni.showModal({
|
||
// title: `数据看板仅支持查看${endMonth}.${endDay+1}之前的数据,更多数据请登陆商业综合平台查看`,
|
||
// // title: `数据看板仅支持查看${startMonth}.${startDay}-${endMonth}.${endDay}的数据,更多数据请登陆商业综合平台查看`,
|
||
// icon:'none',
|
||
// showCancel: fainitYesterdayDatalse,
|
||
// duration:3000
|
||
// });
|
||
}
|
||
},
|
||
async initData() { // 初始化营收数据
|
||
this.priceMove = true
|
||
},
|
||
// 请求完最后处理数据的方法 拿到项目就已经是有一堆请求的了 只能最后处理数据
|
||
todayAmount() {
|
||
let _this = this
|
||
// 由于处理数据的时间 必须在全部接口请求完毕 所以加个延时器
|
||
// 由于页面大部分的内容采用渲染的格式 这样的方法是最快的对原数据进行赋值 对照data里面的几个主要的数组看就能看明白
|
||
// 门店上传的前后数字计算来决定样式
|
||
if(this.showTableData.Revenue_Upload >= this.showTableData.TotalShopCount){
|
||
this.isBig = false
|
||
}else{
|
||
this.isBig = true
|
||
}
|
||
// 计算相对于昨日的增长率
|
||
// this.showTableData.compared = (((Number(this.showTableData.CashPay) - this.yesterdayAllPay) / this.yesterdayAllPay) * 100).toFixed(2)
|
||
// 客单均价
|
||
this.showTableData.averagePrice = (Number(this.showTableData.CashPay) / Number(this.showTableData.TicketCount)).toFixed(2)
|
||
// 商品均价
|
||
this.showTableData.countave = (Number(this.showTableData.CashPay) / Number(this.showTableData.TotalCount)).toFixed(2)
|
||
// 处理所有数据 变成有千分号和小数点的数据
|
||
|
||
if (this.showTableData.UnUpLoadShopList && this.showTableData.UnUpLoadShopList.length>0){
|
||
let list =[]
|
||
this.showTableData.UnUpLoadShopList.forEach(item=>{
|
||
if (item.Revenue_Upload === 0 || !item.Revenue_Upload){
|
||
list.push(item)
|
||
}
|
||
})
|
||
this.bodyList = list
|
||
}
|
||
let index1= (this.showTableData.CashPay / 10000).toString().indexOf('.')
|
||
this.showTableData.CashPayChange = (this.showTableData.CashPay / 10000).toString().substring(0,index1+3)
|
||
|
||
|
||
// for (let key in this.showTableData){
|
||
// if (this.showTableData[key]){
|
||
// // 在有值的前提下
|
||
// // 是第一个if里面的参数 不会被处理 是第二个if里面的参数 会被处理千分号 但是没有小数点 不在第一第二个if里面的字段会被处理 保留两位小数
|
||
// if (key==='uploadState' || key==='Revenue_Upload' || key==='TotalShopCount' || key==='UnUpLoadShopList'){
|
||
// this.showTableData[key] = this.showTableData[key]
|
||
// }else if(key ==='TicketCount'){
|
||
// this.showTableData[key] = this.$util.noDecimal(this.showTableData[key],0)
|
||
// }else{
|
||
// this.showTableData[key] = this.$util.fmoney(this.showTableData[key], 2)
|
||
// }
|
||
// }
|
||
// }
|
||
uni.hideLoading()
|
||
this.isSuccess = true
|
||
this.stopSwiper = false
|
||
_this.$forceUpdate()
|
||
},
|
||
getDetail(obj) {
|
||
let _this = this
|
||
this.$request.$webGet('CommercialApi/Revenue/GetServerpartEndAccountList', {
|
||
Serverpart_ID: obj.ServerpartIds,
|
||
pushProvinceCode: obj.ProvinceCode,
|
||
Statistics_Date: obj.time,
|
||
|
||
}).then(res => {
|
||
if (res.Result_Code != 100) return
|
||
res.Result_Data.ShopEndaccountList.map(n => {
|
||
n.show = false
|
||
n.detail = this.getListDetail(n)
|
||
})
|
||
|
||
_this.regionList = res.Result_Data.ShopEndaccountList
|
||
})
|
||
},
|
||
async getRankContent() { // 甘肃需要单品排行显示
|
||
const {
|
||
ProvinceCode,
|
||
time
|
||
} = this.theRequest
|
||
|
||
const data = await this.$request.$webGet('CommercialApi/Revenue/GetWechatPushSalesList', {
|
||
pushProvinceCode: ProvinceCode,
|
||
Statistics_Date: time
|
||
})
|
||
|
||
if (data.Result_Code === 100 && data.Result_Data.TotalCount > 0) {
|
||
this.wechatPushSalesList = {}
|
||
data.Result_Data.List.forEach(n => {
|
||
this.wechatPushSalesList[n.Data_Type]= n.GoodsList
|
||
})
|
||
|
||
} else {
|
||
this.wechatPushSalesList = {}
|
||
}
|
||
this.$forceUpdate()
|
||
},
|
||
}
|
||
}
|
||
</script>
|
||
|
||
<style scoped lang="scss">
|
||
$iphoneHeight: env(safe-area-inset-bottom);
|
||
@import '/static/public/font2/stylesheet.css';
|
||
.main {
|
||
width: 100%;
|
||
box-sizing: border-box;
|
||
padding-bottom: calc( 45px + env(safe-area-inset-bottom));
|
||
.meng{
|
||
width: 100vw;
|
||
height: 100vh;
|
||
position: fixed;
|
||
top: 0;left: 0;
|
||
z-index: 20;
|
||
}
|
||
.header {
|
||
width: 100%;
|
||
background: linear-gradient(315deg, #FF8670 0%, #FFDCA8 100%);
|
||
box-sizing: border-box;
|
||
padding: 0 16px;
|
||
position: relative;
|
||
//.headerBg {
|
||
// width: 100%;
|
||
// height: 100%;
|
||
// position: absolute;
|
||
// left: 0;
|
||
// top: 0;
|
||
//}
|
||
.headerTop{
|
||
width: 100%;
|
||
background: linear-gradient(315deg, #FFAF95 0%, #FFD6A6 100%);
|
||
position: fixed;
|
||
top: 0;left:0;
|
||
box-sizing: border-box;
|
||
padding: 0 15px;
|
||
z-index:9999999;
|
||
.selectTime {
|
||
position: absolute;
|
||
display: flex;
|
||
align-items: center;
|
||
.dateIcon {
|
||
width: 16px;
|
||
height: 16px;
|
||
margin-right: 4px;
|
||
}
|
||
.time {
|
||
display: flex;
|
||
align-items: center;
|
||
margin-right: 4px;
|
||
.day {
|
||
font-size: 32rpx;
|
||
font-family: PingFangSC-Regular, PingFang SC;
|
||
font-weight: 400;
|
||
color: #782717;
|
||
line-height: 44rpx;
|
||
margin-right: 4px;
|
||
}
|
||
.uni-input {
|
||
font-size: 32rpx;
|
||
font-family: PingFangSC-Semibold, PingFang SC;
|
||
font-weight: 600;
|
||
color: #2249A2;
|
||
line-height: 44rpx;
|
||
}
|
||
.icon {
|
||
width: 12px;
|
||
height: 12px;
|
||
margin-left: 16rpx;
|
||
}
|
||
}
|
||
}
|
||
}
|
||
|
||
|
||
.storeDetail{
|
||
width: 100%;
|
||
position: absolute;
|
||
.storeName{
|
||
font-size: 14px;
|
||
font-family: PingFangSC-Regular, PingFang SC;
|
||
font-weight: 400;
|
||
color: #782717;
|
||
line-height: 20px;
|
||
.num{
|
||
font-weight: 600;
|
||
margin-left: 8px;
|
||
}
|
||
}
|
||
.detailBox{
|
||
width: 100%;
|
||
//background: rgba(254, 255, 254, 0.3);
|
||
//margin-top: 8px;
|
||
white-space: nowrap;
|
||
.detailItemBox{
|
||
width:100%!important;
|
||
display: inline-block;
|
||
.box{
|
||
width: calc(100% - 10px)!important;
|
||
display: inline-block;
|
||
border-radius: 32rpx;
|
||
overflow: hidden;
|
||
position: relative;
|
||
background: rgba(254, 192, 168,0.8);
|
||
.top{
|
||
width: 100%;
|
||
height: 436rpx;
|
||
background: linear-gradient(135deg, #FFE5CA 0%, #FFFFFF 29%, #FFFFFF 69%, #FFDCD5 100%);
|
||
border-bottom-right-radius: 32rpx;
|
||
border-bottom-left-radius: 32rpx;
|
||
box-sizing: border-box;
|
||
padding: 12px 16px;
|
||
.statistics{
|
||
display: flex;
|
||
align-items: center;
|
||
.staticImg{
|
||
width: 50rpx;
|
||
height: 40rpx;
|
||
}
|
||
.staticTitle{
|
||
font-size: 28rpx;
|
||
font-family: PingFangSC-Semibold, PingFang SC;
|
||
font-weight: 600;
|
||
color: #160002;
|
||
line-height: 40rpx;
|
||
margin: 0 4px;
|
||
}
|
||
.staticIcon{
|
||
width: 32rpx;
|
||
height: 32rpx;
|
||
opacity: 0.25;
|
||
}
|
||
}
|
||
.revenueBox{
|
||
.revenueTop{
|
||
margin-top: 12px;
|
||
display: flex;
|
||
align-items: center;
|
||
justify-content: space-between;
|
||
.revenueTopLeft{
|
||
display: flex;
|
||
align-items: center;
|
||
.revenueNumber{
|
||
font-size: 48rpx;
|
||
font-family: DINAlternate-Bold, DINAlternate;
|
||
font-weight: bold;
|
||
color: #160002;
|
||
line-height: 56rpx;
|
||
}
|
||
.moreIcon{
|
||
width: 12px;
|
||
height: 12px;
|
||
display: flex;
|
||
align-items: center;
|
||
justify-content: center;
|
||
border: 2px solid #A69E9F;
|
||
border-radius: 50%;
|
||
color: #A69E9F;
|
||
font-size: 12px;
|
||
font-weight: 600;
|
||
margin-left: 6px;
|
||
position: relative;
|
||
.realBox{
|
||
position: absolute;
|
||
left: 0;top: 0;
|
||
display: inline-block;
|
||
padding: 5px 10px;
|
||
background: #fff;
|
||
border-radius: 10rpx;
|
||
box-shadow: 0rpx 0rpx 40rpx 0rpx rgba(244, 138, 143, 0.21);
|
||
z-index:9;
|
||
}
|
||
|
||
}
|
||
}
|
||
.revenueTopRight{
|
||
display: flex;
|
||
align-items: center;
|
||
.addReduce{
|
||
width: 28rpx;
|
||
height: 28rpx;
|
||
margin-right: 4px;
|
||
border-radius: 50%;
|
||
}
|
||
.addValue{
|
||
font-size: 36rpx;
|
||
font-family: DINAlternate-Bold, DINAlternate;
|
||
font-weight: bold;
|
||
color: #E83944;
|
||
line-height: 40rpx;
|
||
}
|
||
}
|
||
|
||
}
|
||
.revenueNav{
|
||
display: flex;
|
||
align-items: center;
|
||
justify-content: space-between;
|
||
.leftNav{
|
||
margin-top: 2px;
|
||
font-size: 28rpx;
|
||
font-family: PingFangSC-Regular, PingFang SC;
|
||
font-weight: 400;
|
||
color: #160002;
|
||
line-height: 40rpx;
|
||
.unit{
|
||
font-size: 28rpx;
|
||
font-family: PingFangSC-Regular, PingFang SC;
|
||
font-weight: 400;
|
||
color: #A69E9F;
|
||
line-height: 40rpx;
|
||
margin-left: 2px;
|
||
}
|
||
}
|
||
.rightNav{
|
||
font-size: 28rpx;
|
||
font-family: PingFangSC-Regular, PingFang SC;
|
||
font-weight: 400;
|
||
color: #A69E9F;
|
||
line-height: 40rpx;
|
||
margin-right: 64rpx;
|
||
}
|
||
}
|
||
.progress{
|
||
width: 100%;
|
||
height: 24rpx;
|
||
border-radius: 12rpx;
|
||
background: #FFAB30;
|
||
margin-top: 24rpx;
|
||
//overflow: hidden;
|
||
position: relative;
|
||
.have{
|
||
position: absolute;
|
||
top: 0;left: 0;
|
||
width: 60%;
|
||
background: #DB573B;
|
||
height: 100%;
|
||
border-radius: 12rpx;
|
||
}
|
||
.haveNoticeBox{
|
||
position: absolute;
|
||
bottom: 13px;left: 50%;
|
||
transform: translateX(-50%);
|
||
display: inline-block;
|
||
padding: 5px 10px;
|
||
background: #fff;
|
||
border-radius: 10rpx;
|
||
box-shadow: 0rpx 0rpx 40rpx 0rpx rgba(244, 138, 143, 0.21);
|
||
z-index:9;
|
||
}
|
||
}
|
||
.message{
|
||
width: 100%;
|
||
display: flex;
|
||
margin-top: 32rpx;
|
||
.smallDetailItem{
|
||
width: 50%;
|
||
.messageTop{
|
||
display: flex;
|
||
align-items: center;
|
||
.type{
|
||
width: 24rpx;
|
||
height: 12rpx;
|
||
border-radius: 6rpx;
|
||
margin-right: 6px;
|
||
}
|
||
.typeTitle{
|
||
font-size: 28rpx;
|
||
font-family: PingFangSC-Regular, PingFang SC;
|
||
font-weight: 400;
|
||
color: #160002;
|
||
line-height: 40rpx;
|
||
.unit{
|
||
font-size: 28rpx;
|
||
font-family: PingFangSC-Regular, PingFang SC;
|
||
font-weight: 400;
|
||
color: #A69E9F;
|
||
line-height: 40rpx;
|
||
margin-left: 2px;
|
||
}
|
||
}
|
||
}
|
||
.middle{
|
||
margin-top: 6px;
|
||
margin-left: 20px;
|
||
display: flex;
|
||
align-items: center;
|
||
.money{
|
||
font-size: 36rpx;
|
||
font-family: DINAlternate-Bold, DINAlternate;
|
||
font-weight: bold;
|
||
color: #160002;
|
||
line-height: 44rpx;
|
||
}
|
||
.addItem{
|
||
margin-left: 6px;
|
||
display: inline-block;
|
||
padding: 2px 4px;
|
||
font-size: 28rpx;
|
||
font-family: DINAlternate-Bold, DINAlternate;
|
||
font-weight: bold;
|
||
color: #E83944;
|
||
line-height: 32rpx;
|
||
background: rgba(232, 57, 68, 0.1);
|
||
border-radius: 18rpx;
|
||
}
|
||
}
|
||
.messageBottom{
|
||
margin-left: 20px;
|
||
display: flex;
|
||
align-items: center;
|
||
.addText{
|
||
font-size: 28rpx;
|
||
font-family: DINAlternate-Bold, DINAlternate;
|
||
font-weight: bold;
|
||
color: #E83944;
|
||
line-height: 32rpx
|
||
}
|
||
.addType{
|
||
font-size: 28rpx;
|
||
font-family: PingFangSC-Regular, PingFang SC;
|
||
font-weight: 400;
|
||
color: #A69E9F;
|
||
line-height: 40rpx;
|
||
margin-left: 4px;
|
||
}
|
||
}
|
||
}
|
||
}
|
||
}
|
||
}
|
||
.bottom{
|
||
width: 100%;
|
||
height: 72rpx;
|
||
background: rgba(254, 192, 168,0.8);
|
||
box-sizing: border-box;
|
||
padding: 16rpx 32rpx;
|
||
display: flex;
|
||
justify-content: space-between;
|
||
align-items: center;
|
||
.searchText{
|
||
font-size: 28rpx;
|
||
font-family: PingFangSC-Regular, PingFang SC;
|
||
font-weight: 400;
|
||
color: #B33115;
|
||
line-height: 40rpx;
|
||
}
|
||
.searchIcon{
|
||
width: 25px;
|
||
height: 14px;
|
||
}
|
||
}
|
||
.otherDetail{
|
||
width: 100%;
|
||
.detail{
|
||
width: 100%;
|
||
height: 290px;
|
||
box-sizing: border-box;
|
||
padding: 16px;
|
||
border-radius: 8rpx;
|
||
//margin-top: 12px;
|
||
.detailMessage{
|
||
width: 100%;
|
||
height: 100%;
|
||
.otherDetailTop{
|
||
width: 100%;
|
||
display: flex;
|
||
align-items: center;
|
||
justify-content: space-between;
|
||
.otherDetailTopLeft{
|
||
.yearAll{
|
||
font-size: 40rpx;
|
||
font-family: DINAlternate-Bold, DINAlternate;
|
||
font-weight: bold;
|
||
color: #6D1301;
|
||
line-height: 40rpx;
|
||
}
|
||
.yearLabel{
|
||
margin-top: 4rpx;
|
||
font-size: 28rpx;
|
||
font-family: PingFangSC-Regular, PingFang SC;
|
||
font-weight: 400;
|
||
color: #6D1301;
|
||
line-height: 40rpx;
|
||
.unit{
|
||
font-size: 28rpx;
|
||
font-family: PingFangSC-Regular, PingFang SC;
|
||
font-weight: 400;
|
||
color: #C5846F;
|
||
line-height: 40rpx;
|
||
margin-left: 4rpx;
|
||
}
|
||
}
|
||
}
|
||
.otherDetailRight{
|
||
.otherDetailAddBox{
|
||
display: flex;
|
||
align-items: center;
|
||
.otherDetailAddIcon{
|
||
width: 28rpx;
|
||
height: 28rpx;
|
||
margin-right: 6rpx;
|
||
}
|
||
.otherDetailAddValue{
|
||
font-size: 36rpx;
|
||
font-family: DINAlternate-Bold, DINAlternate;
|
||
font-weight: bold;
|
||
color: #E83944;
|
||
line-height: 40rpx;
|
||
}
|
||
}
|
||
.otherDetailAddLabel{
|
||
font-size: 28rpx;
|
||
font-family: PingFangSC-Regular, PingFang SC;
|
||
font-weight: 400;
|
||
color: #6D1301;
|
||
line-height: 40rpx;
|
||
text-align: right;
|
||
}
|
||
}
|
||
}
|
||
|
||
.otherDetailMiddle{
|
||
margin-top: 42rpx;
|
||
.middleItem{
|
||
width: 100%;
|
||
display: flex;
|
||
align-items: center;
|
||
justify-content: space-between;
|
||
.itemLabel{
|
||
font-size: 28rpx;
|
||
font-family: PingFangSC-Regular, PingFang SC;
|
||
font-weight: 400;
|
||
color: #6D1301;
|
||
line-height: 40rpx;
|
||
.itemText{
|
||
width: 70rpx;
|
||
height: 40rpx;
|
||
font-size: 28rpx;
|
||
font-family: PingFangSC-Regular, PingFang SC;
|
||
font-weight: 400;
|
||
color: #C5836E;
|
||
line-height: 40rpx;
|
||
}
|
||
}
|
||
.itemValue{
|
||
font-size: 32rpx;
|
||
font-family: DINAlternate-Bold, DINAlternate;
|
||
font-weight: bold;
|
||
color: #6D1301;
|
||
line-height: 40rpx;
|
||
}
|
||
}
|
||
}
|
||
|
||
.otherDetailBottom{
|
||
margin-top: 40rpx;
|
||
.bottomItem{
|
||
display: flex;
|
||
align-items: center;
|
||
justify-content: space-between;
|
||
.itemLeft{
|
||
width: 140rpx;
|
||
display: flex;
|
||
align-items: center;
|
||
.leftIcon{
|
||
width: 32rpx;
|
||
height: 32rpx;
|
||
margin-right: 8rpx;
|
||
}
|
||
.itemTitle{
|
||
font-size: 26rpx;
|
||
font-family: PingFangSC-Regular, PingFang SC;
|
||
font-weight: 400;
|
||
color: #6D1301;
|
||
line-height: 40rpx;
|
||
text-align: left;
|
||
}
|
||
}
|
||
.itemCenter,.itemRight{
|
||
width: calc((100% - 140rpx)/2);
|
||
.itemValue{
|
||
font-size: 28rpx;
|
||
font-family: DINAlternate-Bold, DINAlternate;
|
||
font-weight: bold;
|
||
color: #6D1301;
|
||
line-height: 40rpx;
|
||
}
|
||
.itemText{
|
||
font-size: 26rpx;
|
||
font-family: PingFangSC-Regular, PingFang SC;
|
||
font-weight: 400;
|
||
color: #6D1301;
|
||
line-height: 40rpx;
|
||
margin-left: 4rpx;
|
||
}
|
||
}
|
||
.itemCenter{
|
||
text-align: right;
|
||
}
|
||
.itemRight{
|
||
text-align: right;
|
||
}
|
||
}
|
||
}
|
||
}
|
||
}
|
||
}
|
||
.noShowMoreBox{
|
||
width: 100%;
|
||
display: flex;
|
||
align-items: center;
|
||
justify-content: center;
|
||
position: absolute;
|
||
left: 0;bottom: 10px;
|
||
.noShowMore{
|
||
width: 25px;
|
||
height: 14px;
|
||
}
|
||
}
|
||
.monthBox{
|
||
display: inline-block;
|
||
position: absolute;
|
||
right: 1px;top: 1px;
|
||
padding: 4rpx 26rpx;
|
||
font-size: 28rpx;
|
||
font-family: PingFangSC-Semibold, PingFang SC;
|
||
font-weight: 600;
|
||
color: #B33115;
|
||
line-height: 40rpx;
|
||
background: #FFD2C4;
|
||
border-radius: 0rpx 30rpx 0rpx 30rpx;
|
||
}
|
||
}
|
||
}
|
||
.noSelectItemBox{
|
||
display: inline-block;
|
||
margin-top: 12px;
|
||
.box{
|
||
width: calc(100% - 10px)!important;
|
||
height: 100%;
|
||
display: inline-block;
|
||
border-radius: 32rpx;
|
||
overflow: hidden;
|
||
background: rgba(254, 192, 168,0.8);
|
||
.top{
|
||
width: 100%;
|
||
height: 80%;
|
||
background: linear-gradient(135deg, #FFE5CA 0%, #FFFFFF 29%, #FFFFFF 69%, #FFDCD5 100%);
|
||
border-bottom-right-radius: 32rpx;
|
||
border-bottom-left-radius: 32rpx;
|
||
box-sizing: border-box;
|
||
padding: 12px 16px;
|
||
.statistics{
|
||
display: flex;
|
||
align-items: center;
|
||
.staticImg{
|
||
width: 50rpx;
|
||
height: 40rpx;
|
||
}
|
||
.staticTitle{
|
||
font-size: 28rpx;
|
||
font-family: PingFangSC-Semibold, PingFang SC;
|
||
font-weight: 600;
|
||
color: #160002;
|
||
line-height: 40rpx;
|
||
margin: 0 4px;
|
||
}
|
||
.staticIcon{
|
||
width: 32rpx;
|
||
height: 32rpx;
|
||
}
|
||
}
|
||
.revenueBox{
|
||
.revenueTop{
|
||
display: flex;
|
||
align-items: center;
|
||
justify-content: space-between;
|
||
.revenueTopLeft{
|
||
display: flex;
|
||
align-items: center;
|
||
.revenueNumber{
|
||
font-size: 48rpx;
|
||
font-family: DINAlternate-Bold, DINAlternate;
|
||
font-weight: bold;
|
||
color: #160002;
|
||
line-height: 56rpx;
|
||
}
|
||
|
||
}
|
||
.revenueTopRight{
|
||
display: flex;
|
||
align-items: center;
|
||
.addReduce{
|
||
width: 28rpx;
|
||
height: 28rpx;
|
||
margin-right: 4px;
|
||
border-radius: 50%;
|
||
}
|
||
.addValue{
|
||
font-size: 36rpx;
|
||
font-family: DINAlternate-Bold, DINAlternate;
|
||
font-weight: bold;
|
||
color: #E83944;
|
||
line-height: 40rpx;
|
||
}
|
||
}
|
||
|
||
}
|
||
.revenueNav{
|
||
display: flex;
|
||
align-items: center;
|
||
justify-content: space-between;
|
||
.leftNav{
|
||
font-size: 28rpx;
|
||
font-family: PingFangSC-Regular, PingFang SC;
|
||
font-weight: 400;
|
||
color: #160002;
|
||
line-height: 40rpx;
|
||
.unit{
|
||
font-size: 28rpx;
|
||
font-family: PingFangSC-Regular, PingFang SC;
|
||
font-weight: 400;
|
||
color: #A69E9F;
|
||
line-height: 40rpx;
|
||
margin-left: 2px;
|
||
}
|
||
}
|
||
.rightNav{
|
||
font-size: 28rpx;
|
||
font-family: PingFangSC-Regular, PingFang SC;
|
||
font-weight: 400;
|
||
color: #A69E9F;
|
||
line-height: 40rpx;
|
||
margin-right: 64rpx;
|
||
}
|
||
}
|
||
.progress{
|
||
width: 100%;
|
||
margin: 6px 0;
|
||
height: 24rpx;
|
||
border-radius: 12rpx;
|
||
background: #FFAB30;
|
||
overflow: hidden;
|
||
position: relative;
|
||
.have{
|
||
position: absolute;
|
||
top: 0;left: 0;
|
||
width: 60%;
|
||
background: #DB573B;
|
||
height: 100%;
|
||
border-radius: 12rpx;
|
||
}
|
||
}
|
||
.message{
|
||
width: 100%;
|
||
display: flex;
|
||
.smallDetailItem{
|
||
width: 50%;
|
||
.messageTop{
|
||
display: flex;
|
||
align-items: center;
|
||
.type{
|
||
width: 24rpx;
|
||
height: 12rpx;
|
||
background: #DB573B;
|
||
border-radius: 6rpx;
|
||
margin-right: 6px;
|
||
}
|
||
.typeTitle{
|
||
font-size: 28rpx;
|
||
font-family: PingFangSC-Regular, PingFang SC;
|
||
font-weight: 400;
|
||
color: #160002;
|
||
line-height: 40rpx;
|
||
.unit{
|
||
font-size: 28rpx;
|
||
font-family: PingFangSC-Regular, PingFang SC;
|
||
font-weight: 400;
|
||
color: #A69E9F;
|
||
line-height: 40rpx;
|
||
margin-left: 2px;
|
||
}
|
||
}
|
||
}
|
||
.middle{
|
||
margin-top: 6px;
|
||
margin-left: 20px;
|
||
display: flex;
|
||
align-items: center;
|
||
.money{
|
||
font-size: 36rpx;
|
||
font-family: DINAlternate-Bold, DINAlternate;
|
||
font-weight: bold;
|
||
color: #160002;
|
||
line-height: 44rpx;
|
||
}
|
||
.addItem{
|
||
margin-left: 6px;
|
||
display: inline-block;
|
||
padding: 2px 4px;
|
||
font-size: 28rpx;
|
||
font-family: DINAlternate-Bold, DINAlternate;
|
||
font-weight: bold;
|
||
color: #E83944;
|
||
line-height: 32rpx;
|
||
background: rgba(232, 57, 68, 0.1);
|
||
border-radius: 18rpx;
|
||
}
|
||
}
|
||
.messageBottom{
|
||
margin-left: 20px;
|
||
display: flex;
|
||
align-items: center;
|
||
.addText{
|
||
font-size: 28rpx;
|
||
font-family: DINAlternate-Bold, DINAlternate;
|
||
font-weight: bold;
|
||
color: #E83944;
|
||
line-height: 32rpx
|
||
}
|
||
.addType{
|
||
font-size: 28rpx;
|
||
font-family: PingFangSC-Regular, PingFang SC;
|
||
font-weight: 400;
|
||
color: #A69E9F;
|
||
line-height: 40rpx;
|
||
margin-left: 4px;
|
||
}
|
||
}
|
||
}
|
||
}
|
||
}
|
||
}
|
||
.bottom{
|
||
width: 100%;
|
||
height: 20%;
|
||
background: rgba(254, 192, 168,0.8);
|
||
box-sizing: border-box;
|
||
padding: 16rpx 32rpx;
|
||
display: flex;
|
||
justify-content: space-between;
|
||
align-items: center;
|
||
.searchText{
|
||
font-size: 28rpx;
|
||
font-family: PingFangSC-Regular, PingFang SC;
|
||
font-weight: 400;
|
||
color: #B33115;
|
||
line-height: 40rpx;
|
||
}
|
||
.searchIcon{
|
||
width: 25px;
|
||
height: 16px;
|
||
}
|
||
}
|
||
.otherDetail{
|
||
width: 100%;
|
||
.detail{
|
||
width: 100%;
|
||
height: 190px;
|
||
box-sizing: border-box;
|
||
padding: 16px 0;
|
||
border-radius: 8rpx;
|
||
//margin-top: 12px;
|
||
.detailItem {
|
||
width: 33%;
|
||
box-sizing: border-box;
|
||
padding-left: 16px;
|
||
height: 42px;
|
||
text-align: left;
|
||
float: left;
|
||
margin-bottom: 16px;
|
||
.itemName {
|
||
font-size: 14px;
|
||
font-family: PingFangSC-Regular, PingFang SC;
|
||
font-weight: 400;
|
||
color: #782717;
|
||
opacity: 0.8;
|
||
line-height: 40rpx;
|
||
margin-bottom: 2px;
|
||
.prompt{
|
||
width: 12px;
|
||
height: 12px;
|
||
border: 1px solid #782717;
|
||
border-radius:50%;
|
||
display: flex;
|
||
align-items: center;
|
||
justify-content: center;
|
||
font-size: 10px;
|
||
font-family: PingFangSC-Regular, PingFang SC;
|
||
font-weight: 600;
|
||
color: #782717;
|
||
}
|
||
.itemUnit {
|
||
font-size: 28rpx;
|
||
font-family: PingFangSC-Regular, PingFang SC;
|
||
font-weight: 400;
|
||
color: #C8806C;
|
||
line-height: 40rpx;
|
||
margin-left: 2px;
|
||
}
|
||
}
|
||
.price {
|
||
font-size: 16px;
|
||
font-family: DINAlternate-Bold, DINAlternate;
|
||
font-weight: bold;
|
||
color: #782717;
|
||
line-height: 40rpx;
|
||
}
|
||
}
|
||
}
|
||
}
|
||
.noShowMoreBox{
|
||
width: 100%;
|
||
display: flex;
|
||
align-items: center;
|
||
justify-content: center;
|
||
position: absolute;
|
||
left: 0;bottom: 30px;
|
||
.noShowMore{
|
||
width: 25px;
|
||
height: 14px;
|
||
}
|
||
}
|
||
}
|
||
}
|
||
.detailBottom{
|
||
width: 100%;
|
||
position: relative;
|
||
background: #FEB7A2;
|
||
.searchBox{
|
||
width: 100%;
|
||
height: 38px;
|
||
box-sizing: border-box;
|
||
padding: 0 16px;
|
||
display: flex;
|
||
align-items: center;
|
||
justify-content: space-between;
|
||
.searchText{
|
||
font-size: 14px;
|
||
font-family: PingFangSC-Regular, PingFang SC;
|
||
font-weight: 400;
|
||
color: #AD6753;
|
||
line-height: 20px;
|
||
}
|
||
.searchIcon{
|
||
width: 26px;
|
||
height: 14px;
|
||
}
|
||
}
|
||
.otherDetail{
|
||
width: 100%;
|
||
height: 100%;
|
||
.detail{
|
||
width: 100%;
|
||
height: 190px;
|
||
box-sizing: border-box;
|
||
padding: 16px 0;
|
||
border-radius: 8rpx;
|
||
margin-top: 12px;
|
||
.detailItem {
|
||
width: 33%;
|
||
box-sizing: border-box;
|
||
padding-left: 16px;
|
||
height: 42px;
|
||
text-align: left;
|
||
float: left;
|
||
margin-bottom: 16px;
|
||
.itemName {
|
||
font-size: 14px;
|
||
font-family: PingFangSC-Regular, PingFang SC;
|
||
font-weight: 400;
|
||
color: #782717;
|
||
opacity: 0.8;
|
||
line-height: 40rpx;
|
||
margin-bottom: 2px;
|
||
.prompt{
|
||
width: 12px;
|
||
height: 12px;
|
||
border: 1px solid #782717;
|
||
border-radius:50%;
|
||
display: flex;
|
||
align-items: center;
|
||
justify-content: center;
|
||
font-size: 10px;
|
||
font-family: PingFangSC-Regular, PingFang SC;
|
||
font-weight: 600;
|
||
color: #782717;
|
||
}
|
||
.itemUnit {
|
||
font-size: 28rpx;
|
||
font-family: PingFangSC-Regular, PingFang SC;
|
||
font-weight: 400;
|
||
color: #C8806C;
|
||
line-height: 40rpx;
|
||
margin-left: 2px;
|
||
}
|
||
}
|
||
.price {
|
||
font-size: 16px;
|
||
font-family: DINAlternate-Bold, DINAlternate;
|
||
font-weight: bold;
|
||
color: #782717;
|
||
line-height: 40rpx;
|
||
}
|
||
}
|
||
}
|
||
}
|
||
|
||
}
|
||
}
|
||
}
|
||
.other {
|
||
width: calc(100% - 32px);
|
||
position: absolute;
|
||
top: 104px;
|
||
.topTitle{
|
||
width: 100%;
|
||
display: flex;
|
||
justify-content: space-between;
|
||
align-items: flex-start;
|
||
.title {
|
||
font-size: 28rpx;
|
||
font-family: PingFangSC-Semibold, PingFang SC;
|
||
font-weight: 600;
|
||
color: #782717;
|
||
line-height: 40rpx;
|
||
}
|
||
.text {
|
||
font-size: 28rpx;
|
||
font-family: PingFangSC-Regular, PingFang SC;
|
||
font-weight: 400;
|
||
color: #782717;
|
||
line-height: 40rpx;
|
||
margin-left: 8px;
|
||
}
|
||
.smallTitle{
|
||
font-size: 14px;
|
||
font-family: PingFangSC-Regular, PingFang SC;
|
||
font-weight: 400;
|
||
color: #782717;
|
||
line-height: 20px;
|
||
margin-right: 4px;
|
||
.month{
|
||
margin-left: 4px;
|
||
font-size: 14px;
|
||
font-family: PingFangSC-Regular, PingFang SC;
|
||
font-weight: 400;
|
||
color: #c97e64;
|
||
line-height: 20px;
|
||
}
|
||
}
|
||
}
|
||
|
||
@keyframes allPriceAnimation {
|
||
0%{
|
||
transform: translateY(30px);
|
||
}
|
||
100%{
|
||
transform: translateY(0px);
|
||
}
|
||
}
|
||
|
||
.box {
|
||
display: flex;
|
||
align-items: center;
|
||
.priceBox{
|
||
width: 100%;
|
||
display: flex;
|
||
align-items: center;
|
||
justify-content: flex-start;
|
||
margin: 6px 0 0;
|
||
.allPrice {
|
||
font-size: 56rpx;
|
||
font-family: DINAlternate-Bold, DINAlternate;
|
||
font-weight: bold;
|
||
color: #782717;
|
||
line-height: 64rpx;
|
||
margin-top: 4px;
|
||
}
|
||
.allPriceMove{
|
||
animation: allPriceAnimation 2s;
|
||
}
|
||
}
|
||
.start {
|
||
width: 14px;
|
||
height: 14px;
|
||
margin-left: 8px;
|
||
}
|
||
}
|
||
|
||
.addBox {
|
||
width: 100%;
|
||
margin-top: 6px;
|
||
display: flex;
|
||
justify-content: space-between;
|
||
align-items: center;
|
||
.smallTitle{
|
||
font-size: 14px;
|
||
font-family: PingFangSC-Regular, PingFang SC;
|
||
font-weight: 400;
|
||
color: #782717;
|
||
line-height: 20px;
|
||
margin-right: 4px;
|
||
.month{
|
||
margin-left: 4px;
|
||
font-size: 14px;
|
||
font-family: PingFangSC-Regular, PingFang SC;
|
||
font-weight: 400;
|
||
color: #c97e64;
|
||
line-height: 20px;
|
||
}
|
||
}
|
||
.right{
|
||
display: flex;
|
||
align-items: center;
|
||
.arrowTop {
|
||
width: 14px;
|
||
height: 14px;
|
||
margin-right: 4px;
|
||
}
|
||
.text {
|
||
font-size: 14px;
|
||
font-family: PingFangSC-Regular, PingFang SC;
|
||
font-weight: 400;
|
||
color: #782717;
|
||
line-height: 20px;
|
||
margin-right: 4px;
|
||
}
|
||
.compare {
|
||
font-size: 14px;
|
||
font-family: PingFangSC-Regular, PingFang SC;
|
||
font-weight: 400;
|
||
color: #c97e64;
|
||
line-height: 20px;
|
||
}
|
||
}
|
||
}
|
||
.type {
|
||
width: 100%;
|
||
height: 45px;
|
||
margin-top: 8px;
|
||
.item {
|
||
width: 50%;
|
||
display: flex;
|
||
align-items: center;
|
||
float: left;
|
||
.leftImg {
|
||
width: 36px;
|
||
height: 36px;
|
||
border-radius: 50%;
|
||
overflow: hidden;
|
||
margin-right: 8px;
|
||
background: #fff;
|
||
image {
|
||
width: 100%;
|
||
height: 100%;
|
||
}
|
||
}
|
||
.right {
|
||
.typeName {
|
||
font-size: 28rpx;
|
||
font-family: PingFangSC-Regular, PingFang SC;
|
||
font-weight: 400;
|
||
color: #782717;
|
||
line-height: 40rpx;
|
||
.unit {
|
||
font-size: 28rpx;
|
||
font-family: PingFangSC-Regular, PingFang SC;
|
||
font-weight: 400;
|
||
color: #c97a63;
|
||
line-height: 40rpx;
|
||
margin-left: 4px;
|
||
}
|
||
}
|
||
.price {
|
||
font-size: 36rpx;
|
||
font-family: DINAlternate-Bold, DINAlternate;
|
||
font-weight: bold;
|
||
color: #782717;
|
||
line-height: 44rpx;
|
||
margin-top: 2px;
|
||
}
|
||
}
|
||
}
|
||
}
|
||
.detail {
|
||
width: 100%;
|
||
height: 190px;
|
||
box-sizing: border-box;
|
||
padding: 16px 0;
|
||
background: linear-gradient(135deg, #fff2df 0%, #ffe3e5 100%);
|
||
box-shadow: 0rpx 0rpx 40rpx 0rpx rgba(244, 138, 143, 0.21);
|
||
border-radius: 8rpx;
|
||
margin-top: 12px;
|
||
margin-bottom: 16px;
|
||
.detailItem {
|
||
width: 33%;
|
||
box-sizing: border-box;
|
||
padding-left: 16px;
|
||
height: 42px;
|
||
text-align: left;
|
||
float: left;
|
||
margin-bottom: 16px;
|
||
.itemName {
|
||
font-size: 14px;
|
||
font-family: PingFangSC-Regular, PingFang SC;
|
||
font-weight: 400;
|
||
color: #782717;
|
||
opacity: 0.8;
|
||
line-height: 40rpx;
|
||
margin-bottom: 2px;
|
||
.prompt{
|
||
width: 12px;
|
||
height: 12px;
|
||
border: 1px solid #782717;
|
||
border-radius:50%;
|
||
display: flex;
|
||
align-items: center;
|
||
justify-content: center;
|
||
font-size: 10px;
|
||
font-family: PingFangSC-Regular, PingFang SC;
|
||
font-weight: 600;
|
||
color: #782717;
|
||
}
|
||
.itemUnit {
|
||
font-size: 28rpx;
|
||
font-family: PingFangSC-Regular, PingFang SC;
|
||
font-weight: 400;
|
||
color: #c99f8f;
|
||
line-height: 40rpx;
|
||
}
|
||
}
|
||
.price {
|
||
font-size: 16px;
|
||
font-family: DINAlternate-Bold, DINAlternate;
|
||
font-weight: bold;
|
||
color: #782717;
|
||
line-height: 40rpx;
|
||
}
|
||
}
|
||
}
|
||
}
|
||
.more{
|
||
width: calc(100% - 32px);
|
||
display: flex;
|
||
justify-content: center;
|
||
position: absolute;
|
||
bottom: 12px;
|
||
padding-bottom: 12px;
|
||
.img{
|
||
width: 16px;
|
||
height: 16px;
|
||
}
|
||
.rate{
|
||
transform: rotate(180deg)!important;
|
||
}
|
||
}
|
||
}
|
||
|
||
.secondHeader{
|
||
background: linear-gradient(315deg, #69BDE6 0%, #9BE2F5 100%)!important;
|
||
.headerTop{
|
||
background: linear-gradient(315deg, #69BDE6 0%, #9BE2F5 100%)!important;
|
||
}
|
||
.storeDetail{
|
||
.detailItemBox{
|
||
.box{
|
||
.bottom{
|
||
.searchText{
|
||
color: #025B93!important;
|
||
}
|
||
}
|
||
.monthBox{
|
||
background: linear-gradient(134deg, #A6DDFF 0%, #BCEFFF 100%)!important;
|
||
color: #025B93!important;
|
||
}
|
||
.otherDetail{
|
||
.detail{
|
||
.yearAll{
|
||
color: #013F66!important;
|
||
}
|
||
.yearLabel{
|
||
color: #013F66!important;
|
||
.unit{
|
||
color: #649BB9!important;
|
||
}
|
||
}
|
||
.otherDetailAddLabel{
|
||
color: #5E97B7!important;
|
||
}
|
||
.itemLabel{
|
||
color: #013F66!important;
|
||
.itemText{
|
||
color: #6199B9!important;
|
||
}
|
||
}
|
||
.itemValue{
|
||
color: #013F66!important;
|
||
}
|
||
.itemTitle{
|
||
color: #013F66!important;
|
||
}
|
||
.itemText{
|
||
color: #5B95B7!important;
|
||
}
|
||
}
|
||
}
|
||
}
|
||
}
|
||
}
|
||
}
|
||
.thirdHeader{
|
||
background: linear-gradient(315deg, #4876E1 0%, #AFD2FD 100%)!important;
|
||
.headerTop{
|
||
background: linear-gradient(315deg, #769FEE 0%, #A9CCFB 100%)!important;
|
||
}
|
||
.storeDetail{
|
||
.detailItemBox{
|
||
.box{
|
||
.bottom{
|
||
.searchText{
|
||
color: #2249A2!important;
|
||
}
|
||
}
|
||
.monthBox{
|
||
background: linear-gradient(134deg, #B9CEFF 0%, #CADFFF 100%)!important;
|
||
color: #2249A2!important;
|
||
}
|
||
.otherDetail{
|
||
.detail{
|
||
.yearAll{
|
||
color: #002780!important;
|
||
}
|
||
.yearLabel{
|
||
color: #002780!important;
|
||
.unit{
|
||
color: #6786C5!important;
|
||
}
|
||
}
|
||
.otherDetailAddLabel{
|
||
color: #6483C4!important;
|
||
}
|
||
.itemLabel{
|
||
color: #002780!important;
|
||
.itemText{
|
||
color: #6786C5!important;
|
||
}
|
||
}
|
||
.itemValue{
|
||
color: #002780!important;
|
||
}
|
||
.itemTitle{
|
||
color: #002780!important;
|
||
}
|
||
.itemText{
|
||
color: #6786C5!important;
|
||
}
|
||
}
|
||
}
|
||
}
|
||
}
|
||
}
|
||
}
|
||
.forthHeader{
|
||
background: linear-gradient(315deg, #D9A879 0%, #F6D6AC 100%)!important;
|
||
.headerTop{
|
||
background: linear-gradient(315deg, #D9A879 0%, #F6D6AC 100%)!important;
|
||
}
|
||
.storeDetail{
|
||
.detailItemBox{
|
||
.box{
|
||
.bottom{
|
||
.searchText{
|
||
color: #783F0F!important;
|
||
}
|
||
}
|
||
.monthBox{
|
||
background: linear-gradient(134deg, #FFCDA3 0%, #FFE8CA 100%)!important;
|
||
color: #783F0F!important;
|
||
}
|
||
.otherDetail{
|
||
.detail{
|
||
.yearAll{
|
||
color: #572800!important;
|
||
}
|
||
.yearLabel{
|
||
color: #572800!important;
|
||
.unit{
|
||
color: #B08C6B!important;
|
||
}
|
||
}
|
||
.otherDetailAddLabel{
|
||
color: #AC8766!important;
|
||
}
|
||
.itemLabel{
|
||
color:#572800!important;
|
||
.itemText{
|
||
color: #B08C6B!important;
|
||
}
|
||
}
|
||
.itemValue{
|
||
color: #572800!important;
|
||
}
|
||
.itemTitle{
|
||
color: #572800!important;
|
||
}
|
||
.itemText{
|
||
color: #B08C6B!important;
|
||
}
|
||
}
|
||
}
|
||
}
|
||
}
|
||
}
|
||
}
|
||
.funEntry{
|
||
width: 100%;
|
||
//height: 208px;
|
||
//background-image: url("https://eshangtech.com/ShopICO/ahyd-BID/home/funEntryBg.png");
|
||
background-repeat: no-repeat;
|
||
background-size: 100% 100%;
|
||
box-sizing: border-box;
|
||
padding: 20px 0 40px 0;
|
||
transform: translateY(-16px);
|
||
background-color: #fff;
|
||
border-top-right-radius: 16px;
|
||
border-top-left-radius: 16px;
|
||
.funBox{
|
||
width: calc(100% - 64rpx);
|
||
margin-left: 32rpx;
|
||
height: 378rpx;
|
||
margin-bottom: 16px;
|
||
.firstBox{
|
||
display: flex;
|
||
margin-bottom: 18rpx;
|
||
.yesterday{
|
||
display: inline-block;
|
||
width: 450rpx;
|
||
height: 212rpx;
|
||
background: linear-gradient(135deg, #D7ECFF 0%, #E8F1FF 38%, #E7F2FF 60%, #E1EDFE 79%, #C2DCFE 100%);
|
||
margin-right: 18rpx;
|
||
border-radius: 20rpx;
|
||
box-sizing: border-box;
|
||
padding: 20rpx 24rpx;
|
||
position: relative;
|
||
overflow: hidden;
|
||
.dayTop{
|
||
display: flex;
|
||
justify-content: space-between;
|
||
align-items: center;
|
||
.dayTitle{
|
||
font-size: 32rpx;
|
||
font-family: Alimama ShuHeiTi;
|
||
font-weight: bold;
|
||
color: #0F62D9;
|
||
line-height: 40rpx;
|
||
.unit{
|
||
margin-left: 4px;
|
||
font-size: 28rpx;
|
||
font-family: PingFangSC-Regular, PingFang SC;
|
||
font-weight: 400;
|
||
color: #8BB7F5;
|
||
line-height: 40rpx;
|
||
}
|
||
}
|
||
.uploadNumber{
|
||
font-size: 28rpx;
|
||
font-family: PingFangSC-Regular, PingFang SC;
|
||
font-weight: 400;
|
||
color: #0561E5;
|
||
line-height: 40rpx;
|
||
}
|
||
}
|
||
.valueBox{
|
||
display: flex;
|
||
align-items: center;
|
||
margin-top: 16rpx;
|
||
.value{
|
||
font-size: 40rpx;
|
||
font-family: DINAlternate-Bold, DINAlternate;
|
||
font-weight: bold;
|
||
color: #001635;
|
||
line-height: 48rpx;
|
||
}
|
||
.addBox{
|
||
display: flex;
|
||
align-items: center;
|
||
margin-left: 16rpx;
|
||
.addIcon{
|
||
width: 28rpx;
|
||
height: 28rpx;
|
||
}
|
||
.addValue{
|
||
font-size: 32rpx;
|
||
font-family: DINAlternate-Bold, DINAlternate;
|
||
font-weight: bold;
|
||
color: #E83944;
|
||
line-height: 40rpx;
|
||
}
|
||
.noData{
|
||
width: 40rpx;
|
||
height: 40rpx;
|
||
}
|
||
.noDataText{
|
||
font-size: 28rpx;
|
||
font-family: PingFangSC-Regular, PingFang SC;
|
||
font-weight: 600;
|
||
color: #0561E5;
|
||
margin-left: 8rpx;
|
||
}
|
||
}
|
||
}
|
||
.timeBox{
|
||
display: flex;
|
||
align-items: center;
|
||
margin-top: 32rpx;
|
||
.timeIcon{
|
||
width: 32rpx;
|
||
height: 32rpx;
|
||
margin-right: 12rpx;
|
||
}
|
||
.timeText{
|
||
font-size: 24rpx;
|
||
font-family: PingFangSC-Regular, PingFang SC;
|
||
font-weight: 400;
|
||
color: #90BFFF;
|
||
line-height: 34rpx;
|
||
}
|
||
}
|
||
.typeImg{
|
||
width: 52px;
|
||
height: 52px;
|
||
position: absolute;
|
||
right: 0;bottom: 0;
|
||
}
|
||
}
|
||
.report{
|
||
display: inline-block;
|
||
background-image: url("https://eshangtech.com/ShopICO/ahyd-BID/newIndex/funSecond.svg");
|
||
background-repeat: no-repeat;
|
||
background-size: 100% 100%;
|
||
width: 218rpx;
|
||
height: 212rpx;
|
||
border-radius: 20rpx;
|
||
box-sizing: border-box;
|
||
padding: 20rpx 24rpx;
|
||
position: relative;
|
||
overflow: hidden;
|
||
.reportTitle{
|
||
font-size: 32rpx;
|
||
font-family: Alimama ShuHeiTi;
|
||
font-weight: bold;
|
||
color: #0283B5;
|
||
line-height: 40rpx;
|
||
display: block;
|
||
}
|
||
.timeIcon{
|
||
width: 32rpx;
|
||
height: 32rpx;
|
||
margin-top: 96rpx;
|
||
}
|
||
.typeImg{
|
||
width: 52px;
|
||
height: 52px;
|
||
position: absolute;
|
||
bottom: 0;right: 0;
|
||
}
|
||
}
|
||
}
|
||
.secondView{
|
||
width: 100%;
|
||
height: 148rpx;
|
||
display: flex;
|
||
justify-content: space-between;
|
||
.funItemView{
|
||
display: inline-block;
|
||
background-repeat: no-repeat;
|
||
background-size: 100% 100%;
|
||
width:216rpx;
|
||
height: 148rpx;
|
||
border-radius: 20rpx;
|
||
box-sizing: border-box;
|
||
padding: 20rpx 24rpx;
|
||
position: relative;
|
||
overflow: hidden;
|
||
.funItemTitle{
|
||
font-size: 32rpx;
|
||
font-family: Alimama ShuHeiTi;
|
||
font-weight: bold;
|
||
line-height: 40rpx;
|
||
display: block;
|
||
}
|
||
.timeIcon{
|
||
width: 32rpx;
|
||
height: 32rpx;
|
||
margin-top: 32rpx;
|
||
}
|
||
.typeImg{
|
||
width: 80rpx;
|
||
height: 80rpx;
|
||
position: absolute;
|
||
right: 0;bottom: 0;
|
||
}
|
||
}
|
||
}
|
||
|
||
}
|
||
|
||
.funList{
|
||
width: calc(100% - 64rpx);
|
||
box-sizing: border-box;
|
||
margin-left: 32rpx;
|
||
padding: 24rpx;
|
||
display: flex;
|
||
justify-content: space-between;
|
||
background: #F3F4F4;
|
||
border-radius: 16rpx;
|
||
position: relative;
|
||
.san{
|
||
width: 16px;
|
||
height: 16px;
|
||
position: absolute;
|
||
top: -8px;left: 108rpx;
|
||
background: #F3F4F4;
|
||
transform: rotate(-45deg);
|
||
}
|
||
.funItem{
|
||
width: 25%;
|
||
display: flex;
|
||
flex-direction: column;
|
||
align-items: center;
|
||
.iconBox{
|
||
width: 96rpx;
|
||
height: 96rpx;
|
||
background: #FFFFFF;
|
||
display: flex;
|
||
align-items: center;
|
||
justify-content: center;
|
||
border-radius: 50%;
|
||
margin-bottom: 16rpx;
|
||
.funItemIcon{
|
||
width: 60rpx;
|
||
height: 60rpx;
|
||
}
|
||
}
|
||
.funItemText{
|
||
font-size: 24rpx;
|
||
font-family: PingFangSC-Regular, PingFang SC;
|
||
font-weight: 400;
|
||
color: #160002;
|
||
line-height: 32rpx;
|
||
}
|
||
}
|
||
}
|
||
|
||
.otherFunBox{
|
||
width: 100%;
|
||
box-sizing: border-box;
|
||
padding: 0 16px;
|
||
display: flex;
|
||
margin-top: 20px;
|
||
.otherFunItem{
|
||
width: calc((100% - 9px)/2);
|
||
height: 72px;
|
||
background-repeat: no-repeat;
|
||
background-size: 100% 100%;
|
||
position: relative;
|
||
.itemTitle{
|
||
position: absolute;
|
||
left: 12px;
|
||
top: 10px;
|
||
font-size: 16px;
|
||
font-family: PingFangSC-Medium, PingFang SC;
|
||
font-weight: 600;
|
||
color: #0D4CDE;
|
||
line-height: 22px
|
||
}
|
||
.itemImg{
|
||
position: absolute;
|
||
top: 18px;right: 17px;
|
||
width: 35px;
|
||
height: 35px;
|
||
}
|
||
.nowBox{
|
||
position: absolute;
|
||
bottom: 14px;
|
||
left: 12px;
|
||
display: flex;
|
||
align-items: center;
|
||
.nowText{
|
||
font-size: 12px;
|
||
font-family: PingFangSC-Regular, PingFang SC;
|
||
font-weight: 400;
|
||
color: #638EEB;
|
||
line-height: 12px
|
||
}
|
||
.searchIcon{
|
||
width: 12px;
|
||
height: 12px;
|
||
margin-left: 4px;
|
||
}
|
||
}
|
||
}
|
||
}
|
||
|
||
.carWarning{
|
||
width:calc(100% - 32px);
|
||
margin-left: 16px;
|
||
margin-top: 20px;
|
||
background-image: url("https://eshangtech.com/ShopICO/ahyd-BID/home/warningBg.svg");
|
||
background-repeat: no-repeat;
|
||
background-size: cover;
|
||
box-sizing: border-box;
|
||
padding: 12px 16px;
|
||
border-radius: 16rpx;
|
||
position: relative;
|
||
.carWarningTop{
|
||
width: 100%;
|
||
display: flex;
|
||
justify-content: space-between;
|
||
align-items: center;
|
||
.moreStoreBox{
|
||
display: flex;
|
||
align-items: center;
|
||
.moreText{
|
||
|
||
}
|
||
.moreIcon{
|
||
width: 18px;
|
||
height: 18px;
|
||
}
|
||
}
|
||
.warningBox{
|
||
width: 150px;
|
||
height: 36px;
|
||
position: relative;
|
||
.warningIcon{
|
||
position: absolute;
|
||
left: 0;top: 0;
|
||
width: 36px;
|
||
height: 36px;
|
||
z-index: 2;
|
||
}
|
||
.trafficBox{
|
||
position: absolute;
|
||
left: 28px;top: 3px;
|
||
z-index: 1;
|
||
width: 120px;
|
||
height: 30px;
|
||
background: #D4F0F5;
|
||
border-top-right-radius: 15px;
|
||
border-bottom-right-radius: 15px;
|
||
box-sizing: border-box;
|
||
padding: 4px 12px;
|
||
display: flex;
|
||
align-items: center;
|
||
.trafficCar{
|
||
font-size: 16px;
|
||
font-family: PingFangSC-Medium, PingFang SC;
|
||
font-weight: 600;
|
||
color: #007DA5;
|
||
line-height: 16px;
|
||
}
|
||
.moreIcon{
|
||
margin-left: 16rpx;
|
||
width: 32rpx;
|
||
height: 32rpx;
|
||
}
|
||
}
|
||
}
|
||
}
|
||
.contentList{
|
||
width: 100%;
|
||
border-radius: 8px;
|
||
.contentItem{
|
||
padding: 6px 0;
|
||
display: flex;
|
||
justify-content: space-between;
|
||
align-items: center;
|
||
.index{
|
||
width: 12px;
|
||
height: 12px;
|
||
position: relative;
|
||
.boxBg{
|
||
width: 12px;
|
||
height: 12px;
|
||
background: #10BFCE;
|
||
filter: blur(4px);
|
||
position: absolute;
|
||
top: 0;left: 0;
|
||
}
|
||
.indexText{
|
||
position: absolute;
|
||
top: 50%;left: 50%;
|
||
transform: translate(-50%,-50%);
|
||
z-index: 2;
|
||
font-size: 16px;
|
||
font-family: DingTalk-JinBuTi, DingTalk;
|
||
font-weight: normal;
|
||
color: #160002;
|
||
line-height: 20px;
|
||
}
|
||
}
|
||
.serviceBox{
|
||
width: 35%;
|
||
display: inline-block;
|
||
margin-left: 8px;
|
||
.name{
|
||
font-size: 14px;
|
||
font-family: PingFangSC-Semibold, PingFang SC;
|
||
font-weight: 600;
|
||
color: #160002;
|
||
line-height: 26px;
|
||
}
|
||
.position{
|
||
font-size: 12px;
|
||
font-family: PingFangSC-Regular, PingFang SC;
|
||
font-weight: 400;
|
||
color: #786B6C;
|
||
line-height: 20px;
|
||
margin-left: 4rpx;
|
||
}
|
||
}
|
||
.numberBox{
|
||
width: 30%;
|
||
.number{
|
||
font-size: 16px;
|
||
font-family: DINAlternate-Bold, DINAlternate;
|
||
font-weight: bold;
|
||
color: #160002;
|
||
line-height: 24px;
|
||
}
|
||
.unit{
|
||
font-size: 14px;
|
||
font-family: PingFangSC-Regular, PingFang SC;
|
||
font-weight: 400;
|
||
color: #A69E9F;
|
||
line-height: 20px;
|
||
margin-left: 2px;
|
||
}
|
||
}
|
||
.addBox{
|
||
width: calc(30% - 20px);
|
||
display: flex;
|
||
align-items: center;
|
||
.addIcon{
|
||
width: 14px;
|
||
height: 14px;
|
||
}
|
||
.add{
|
||
font-size: 16px;
|
||
font-family: DINAlternate-Bold, DINAlternate;
|
||
font-weight: bold;
|
||
color: #E83944;
|
||
line-height: 24px;
|
||
}
|
||
}
|
||
}
|
||
}
|
||
}
|
||
|
||
.peopleWarning{
|
||
width:calc(100% - 32px);
|
||
margin-left: 16px;
|
||
margin-top: 32rpx;
|
||
background-image: url("https://eshangtech.com/ShopICO/ahyd-BID/newIndex/personWarningBg.svg");
|
||
background-repeat: no-repeat;
|
||
background-size: cover;
|
||
box-sizing: border-box;
|
||
padding: 12px 16px;
|
||
border-radius: 16rpx;
|
||
position: relative;
|
||
.carWarningTop{
|
||
width: 100%;
|
||
display: flex;
|
||
justify-content: space-between;
|
||
align-items: center;
|
||
.moreStoreBox{
|
||
display: flex;
|
||
align-items: center;
|
||
.moreText{
|
||
|
||
}
|
||
.moreIcon{
|
||
width: 18px;
|
||
height: 18px;
|
||
}
|
||
}
|
||
.warningBox{
|
||
width: 150px;
|
||
height: 36px;
|
||
position: relative;
|
||
.warningIcon{
|
||
position: absolute;
|
||
left: 0;top: 0;
|
||
width: 36px;
|
||
height: 36px;
|
||
z-index: 2;
|
||
}
|
||
.trafficBox{
|
||
position: absolute;
|
||
left: 28px;top: 3px;
|
||
z-index: 1;
|
||
width: 120px;
|
||
height: 30px;
|
||
background: #DDEAFF;
|
||
border-top-right-radius: 15px;
|
||
border-bottom-right-radius: 15px;
|
||
box-sizing: border-box;
|
||
padding: 4px 16px;
|
||
display: flex;
|
||
align-items: center;
|
||
.trafficCar{
|
||
font-size: 16px;
|
||
font-family: PingFangSC-Medium, PingFang SC;
|
||
font-weight: 600;
|
||
color: #007DA5;
|
||
line-height: 16px;
|
||
}
|
||
.moreIcon{
|
||
margin-left: 16rpx;
|
||
width: 32rpx;
|
||
height: 32rpx;
|
||
}
|
||
}
|
||
}
|
||
}
|
||
.contentList{
|
||
width: 100%;
|
||
border-radius: 8px;
|
||
.contentItem{
|
||
padding: 6px 0;
|
||
display: flex;
|
||
justify-content: space-between;
|
||
align-items: center;
|
||
.index{
|
||
width: 12px;
|
||
height: 12px;
|
||
position: relative;
|
||
.boxBg{
|
||
width: 12px;
|
||
height: 12px;
|
||
background: #10BFCE;
|
||
filter: blur(4px);
|
||
position: absolute;
|
||
top: 0;left: 0;
|
||
}
|
||
.indexText{
|
||
position: absolute;
|
||
top: 50%;left: 50%;
|
||
transform: translate(-50%,-50%);
|
||
z-index: 2;
|
||
font-size: 16px;
|
||
font-family: DingTalk-JinBuTi, DingTalk;
|
||
font-weight: normal;
|
||
color: #160002;
|
||
line-height: 20px;
|
||
}
|
||
}
|
||
.serviceBox{
|
||
width: 35%;
|
||
display: inline-block;
|
||
margin-left: 8px;
|
||
.name{
|
||
font-size: 28rpx;
|
||
font-family: PingFangSC-Semibold, PingFang SC;
|
||
font-weight: 600;
|
||
color: #160002;
|
||
line-height: 40rpx;
|
||
}
|
||
.position{
|
||
font-size: 24rpx;
|
||
font-family: PingFangSC-Regular, PingFang SC;
|
||
font-weight: 400;
|
||
color: #786B6C;
|
||
line-height: 36rpx;
|
||
margin-left: 4rpx;
|
||
}
|
||
}
|
||
.numberBox{
|
||
width: 30%;
|
||
.number{
|
||
font-size: 16px;
|
||
font-family: DINAlternate-Bold, DINAlternate;
|
||
font-weight: bold;
|
||
color: #160002;
|
||
line-height: 24px;
|
||
}
|
||
.unit{
|
||
font-size: 14px;
|
||
font-family: PingFangSC-Regular, PingFang SC;
|
||
font-weight: 400;
|
||
color: #A69E9F;
|
||
line-height: 20px;
|
||
margin-left: 2px;
|
||
}
|
||
}
|
||
.addBox{
|
||
width: calc(30% - 20px);
|
||
display: flex;
|
||
align-items: center;
|
||
.addIcon{
|
||
width: 14px;
|
||
height: 14px;
|
||
}
|
||
.add{
|
||
font-size: 16px;
|
||
font-family: DINAlternate-Bold, DINAlternate;
|
||
font-weight: bold;
|
||
color: #E83944;
|
||
line-height: 24px;
|
||
}
|
||
}
|
||
}
|
||
}
|
||
}
|
||
|
||
.patrolInspection{
|
||
width: calc(100% - 64rpx);
|
||
margin-left: 32rpx;
|
||
margin-top: 32rpx;
|
||
height: 532rpx;
|
||
background: #FFF2E5;
|
||
border-radius: 20rpx;
|
||
box-sizing: border-box;
|
||
padding: 20rpx 24rpx;
|
||
.patrolTitle{
|
||
font-size: 32rpx;
|
||
font-family: Alimama ShuHeiTi;
|
||
font-weight: bold;
|
||
color: #EC6C00;
|
||
line-height: 38rpx;
|
||
}
|
||
.contentBox{
|
||
width: 100%;
|
||
height: 430rpx;
|
||
background: #FFFFFF;
|
||
border-radius: 20rpx;
|
||
margin-top: 20rpx;
|
||
box-sizing: border-box;
|
||
padding: 32rpx 24rpx;
|
||
.contentFirst{
|
||
.firstTop{
|
||
display: flex;
|
||
justify-content: space-between;
|
||
.left{
|
||
display: flex;
|
||
align-items: center;
|
||
.topIcon{
|
||
width: 50rpx;
|
||
height: 50rpx;
|
||
}
|
||
.topText{
|
||
font-size: 28rpx;
|
||
font-family: PingFangSC-Semibold, PingFang SC;
|
||
font-weight: 600;
|
||
color: #160002;
|
||
line-height: 40rpx;
|
||
margin-left: 4rpx;
|
||
}
|
||
}
|
||
.right{
|
||
display: flex;
|
||
align-items: center;
|
||
.moreText{
|
||
font-size: 24rpx;
|
||
font-family: PingFangSC-Regular, PingFang SC;
|
||
font-weight: 400;
|
||
color: #A69E9F;
|
||
line-height: 36rpx;
|
||
}
|
||
.moreIcon{
|
||
width: 20rpx;
|
||
height: 40rpx;
|
||
}
|
||
}
|
||
}
|
||
.firstBox{
|
||
display: flex;
|
||
justify-content: space-between;
|
||
margin-top: 22rpx;
|
||
padding-bottom: 32rpx;
|
||
.boxItem{
|
||
display: flex;
|
||
flex-direction: column;
|
||
.itemValue{
|
||
font-size: 36rpx;
|
||
font-family: DINAlternate-Bold, DINAlternate;
|
||
font-weight: bold;
|
||
color: #020E1A;
|
||
line-height: 44rpx;
|
||
}
|
||
.itemLabel{
|
||
font-size: 24rpx;
|
||
font-family: PingFangSC-Regular, PingFang SC;
|
||
font-weight: 400;
|
||
color: #786B6C;
|
||
line-height: 36rpx;
|
||
.unit{
|
||
font-size: 24rpx;
|
||
font-family: PingFangSC-Regular, PingFang SC;
|
||
font-weight: 400;
|
||
color: #A69E9F;
|
||
line-height: 36rpx;
|
||
margin-left: 2rpx;
|
||
}
|
||
}
|
||
.detailBox{
|
||
.detailValue{
|
||
font-size: 36rpx;
|
||
font-family: DINAlternate-Bold, DINAlternate;
|
||
font-weight: bold;
|
||
color: #E83944;
|
||
line-height: 44rpx;
|
||
}
|
||
.detailLabel{
|
||
font-size: 24rpx;
|
||
font-family: PingFangSC-Regular, PingFang SC;
|
||
font-weight: 400;
|
||
color: #786B6C;
|
||
line-height: 36rpx;
|
||
.unit{
|
||
font-size: 24rpx;
|
||
font-family: PingFangSC-Regular, PingFang SC;
|
||
font-weight: 400;
|
||
color: #A69E9F;
|
||
line-height: 36rpx;
|
||
margin-left: 4rpx;
|
||
}
|
||
}
|
||
}
|
||
}
|
||
}
|
||
.secondBox{
|
||
display: flex;
|
||
justify-content: space-between;
|
||
margin-top: 28rpx;
|
||
.secondItem{
|
||
display: flex;
|
||
.itemImg{
|
||
width: 80rpx;
|
||
height: 80rpx;
|
||
}
|
||
.secondDetail{
|
||
display: flex;
|
||
flex-direction: column;
|
||
margin-left: 16rpx;
|
||
.labelValue{
|
||
font-size: 36rpx;
|
||
font-family: DINAlternate-Bold, DINAlternate;
|
||
font-weight: bold;
|
||
color: #020E1A;
|
||
line-height: 44rpx;
|
||
}
|
||
.labelTitle{
|
||
font-size: 24rpx;
|
||
font-family: PingFangSC-Regular, PingFang SC;
|
||
font-weight: 400;
|
||
color: #786B6C;
|
||
line-height: 36rpx;
|
||
.unit{
|
||
font-size: 24rpx;
|
||
font-family: PingFangSC-Regular, PingFang SC;
|
||
font-weight: 400;
|
||
color: #A69E9F;
|
||
line-height: 36rpx
|
||
}
|
||
}
|
||
}
|
||
}
|
||
}
|
||
}
|
||
}
|
||
}
|
||
|
||
.selfPlan{
|
||
width: calc(100% - 64rpx);
|
||
height: 630rpx;
|
||
padding: 20rpx 24rpx;
|
||
box-sizing: border-box;
|
||
background: #E8F2FF;
|
||
border-radius: 16rpx;
|
||
margin-left: 32rpx;
|
||
margin-top: 32rpx;
|
||
.selfPlanTitle{
|
||
font-size: 32rpx;
|
||
font-family: Alimama ShuHeiTi;
|
||
font-weight: bold;
|
||
color: #4157E6;
|
||
line-height: 38rpx;
|
||
}
|
||
|
||
.content{
|
||
width: 100%;
|
||
height: 530rpx;
|
||
background: #fff;
|
||
margin-top: 20rpx;
|
||
border-radius: 20rpx;
|
||
box-sizing: border-box;
|
||
padding: 32rpx 24rpx;
|
||
.contentItem{
|
||
.contentTop{
|
||
width: 100%;
|
||
display: flex;
|
||
justify-content: space-between;
|
||
.contentLeft{
|
||
display: flex;
|
||
align-items: center;
|
||
.dateImg{
|
||
width: 40rpx;
|
||
height: 40rpx;
|
||
}
|
||
.smallTitle{
|
||
font-size: 28rpx;
|
||
font-family: PingFangSC-Semibold, PingFang SC;
|
||
font-weight: 600;
|
||
color: #160002;
|
||
line-height: 40rpx;
|
||
margin-left: 4rpx;
|
||
}
|
||
}
|
||
.contentRight{
|
||
display: flex;
|
||
align-items: center;
|
||
.moreText{
|
||
font-size: 24rpx;
|
||
font-family: PingFangSC-Regular, PingFang SC;
|
||
font-weight: 400;
|
||
color: #A69E9F;
|
||
line-height: 36rpx;
|
||
}
|
||
.moreIcon{
|
||
width: 20rpx;
|
||
height: 40rpx;
|
||
margin-left: 4rpx;
|
||
}
|
||
}
|
||
}
|
||
.contentBottom{
|
||
margin-top: 24rpx;
|
||
display: flex;
|
||
.canvaBox{
|
||
width: 136rpx;
|
||
height: 136rpx;
|
||
}
|
||
.messageBox{
|
||
flex: 1;
|
||
margin-left: 32rpx;
|
||
.messageTop{
|
||
width: 100%;
|
||
display: flex;
|
||
align-items: center;
|
||
.topIcon{
|
||
width: 28rpx;
|
||
height: 28rpx;
|
||
}
|
||
.messageValue{
|
||
font-size: 36rpx;
|
||
font-family: DINAlternate-Bold, DINAlternate;
|
||
font-weight: bold;
|
||
color: #E83944;
|
||
line-height: 44rpx;
|
||
}
|
||
.messageDesc{
|
||
font-size: 24rpx;
|
||
font-family: PingFangSC-Regular, PingFang SC;
|
||
font-weight: 400;
|
||
color: #A69E9F;
|
||
line-height: 36rpx;
|
||
margin-left: 8rpx;
|
||
}
|
||
}
|
||
.messageBottom{
|
||
width: 100%;
|
||
margin-top: 16rpx;
|
||
display: flex;
|
||
justify-content: space-between;
|
||
.bottomItem{
|
||
.itemValue{
|
||
font-size: 32rpx;
|
||
font-family: DINAlternate-Bold, DINAlternate;
|
||
font-weight: bold;
|
||
color: #020E1A;
|
||
line-height: 40rpx;
|
||
}
|
||
.itemLabel{
|
||
font-size: 24rpx;
|
||
font-family: PingFangSC-Regular, PingFang SC;
|
||
font-weight: 400;
|
||
color: #786B6C;
|
||
line-height: 36rpx;
|
||
.unit{
|
||
font-size: 24rpx;
|
||
font-family: PingFangSC-Regular, PingFang SC;
|
||
font-weight: 400;
|
||
color: #A69E9F;
|
||
line-height: 36rpx;
|
||
}
|
||
}
|
||
}
|
||
}
|
||
}
|
||
}
|
||
}
|
||
}
|
||
}
|
||
|
||
.proportion{
|
||
width: calc(100% - 64rpx);
|
||
margin-left: 32rpx;
|
||
border-radius: 20rpx;
|
||
background: #E6F6F7;
|
||
margin-top: 34rpx;
|
||
box-sizing: border-box;
|
||
padding: 20rpx 24rpx;
|
||
.proportionTitle{
|
||
font-size: 32rpx;
|
||
font-family: Alimama ShuHeiTi;
|
||
font-weight: bold;
|
||
color: #02858B;
|
||
line-height: 38rpx;
|
||
}
|
||
.contentPropor{
|
||
width: 100%;
|
||
background: #fff;
|
||
border-radius: 20rpx;
|
||
margin-top: 20rpx;
|
||
box-sizing: border-box;
|
||
padding: 24rpx;
|
||
.tabs{
|
||
width: 100%;
|
||
.tabItem{
|
||
display: inline-block;
|
||
padding: 8rpx 24rpx;
|
||
font-size: 28rpx;
|
||
font-family: PingFangSC-Semibold, PingFang SC;
|
||
font-weight: 400;
|
||
color: #160002;
|
||
line-height: 40rpx;
|
||
border-radius: 28rpx;
|
||
}
|
||
.active{
|
||
background: #E5F2F3;
|
||
color: #02858B;
|
||
font-weight: 600;
|
||
}
|
||
}
|
||
.chart{
|
||
width: 100%;
|
||
margin-top: 12px;
|
||
.operation-c-list{
|
||
width:100%;
|
||
margin-bottom: 12px;
|
||
.top{
|
||
width: 100%;
|
||
margin-bottom: 2px;
|
||
display: flex;
|
||
justify-content: space-between;
|
||
align-items: center;
|
||
.left{
|
||
display: flex;
|
||
justify-content: space-between;
|
||
.icon{
|
||
width: 20px;
|
||
height: 20px;
|
||
position: relative;
|
||
margin-right: 8px;
|
||
display: flex;
|
||
justify-content: center;
|
||
align-items: center;
|
||
image{
|
||
width: 100%;
|
||
height: 100%;
|
||
position: absolute;
|
||
top: 0;left: 0;
|
||
}
|
||
text{
|
||
z-index:99;
|
||
font-size: 24rpx;
|
||
font-family: DINAlternate-Bold, DINAlternate;
|
||
font-weight: bold;
|
||
color: #FFFFFF;
|
||
}
|
||
}
|
||
.name{
|
||
font-size: 32rpx;
|
||
font-family: PingFangSC-Regular, PingFang SC;
|
||
font-weight: 400;
|
||
color: #160002;
|
||
line-height: 40rpx;
|
||
}
|
||
}
|
||
}
|
||
.bottom{
|
||
display: flex;
|
||
justify-content: space-between;
|
||
.bar{
|
||
width: 352rpx;
|
||
height: 16rpx;
|
||
background: #EBEEEE;
|
||
border-radius: 10rpx;
|
||
position: relative;
|
||
.progress{
|
||
position: absolute;
|
||
top: 0;left: 0;
|
||
background: #02858B;
|
||
height: 100%;
|
||
border-radius: 10rpx;
|
||
}
|
||
}
|
||
.number{
|
||
font-size: 28rpx;
|
||
font-family: PingFangSC-Regular, PingFang SC;
|
||
font-weight: 400;
|
||
color: #786B6C;
|
||
line-height: 40rpx;
|
||
}
|
||
}
|
||
}
|
||
}
|
||
|
||
}
|
||
}
|
||
}
|
||
|
||
|
||
|
||
|
||
.notice{
|
||
position: fixed;
|
||
bottom: 120px;
|
||
left: 5%;
|
||
width: 90%;
|
||
padding: 10px 10px;
|
||
box-sizing: border-box;
|
||
border-radius: 10px;
|
||
z-index:999999;
|
||
background: #2c71f9;
|
||
display: flex;
|
||
justify-content: space-between;
|
||
align-items: center;
|
||
.left {
|
||
display: flex;
|
||
align-items: center;
|
||
.icon {
|
||
width: 40px;
|
||
height: 40px;
|
||
margin-right: 10px;
|
||
}
|
||
.text {
|
||
margin-left: 8px;
|
||
.name {
|
||
font-size: 14px;
|
||
font-family: PingFangSC-Semibold, PingFang SC;
|
||
font-weight: 600;
|
||
color: #ffffff;
|
||
line-height: 20px;
|
||
}
|
||
.desc {
|
||
font-size: 12px;
|
||
font-family: PingFangSC-Regular, PingFang SC;
|
||
font-weight: 400;
|
||
color: #B5CDFC;
|
||
line-height: 18px;
|
||
}
|
||
}
|
||
}
|
||
.right {
|
||
border: 1px solid #fff;
|
||
padding: 2px 6px;
|
||
font-size: 14px;
|
||
font-family: PingFangSC-Regular, PingFang SC;
|
||
font-weight: 400;
|
||
border-radius: 11px;
|
||
color: #ffffff;
|
||
}
|
||
}
|
||
.popupIndex {
|
||
position: fixed;
|
||
top: 30%;
|
||
left: 10%;
|
||
width: 80%;
|
||
height: 250px;
|
||
background: #fff;
|
||
border-radius: 8px;
|
||
overflow: hidden;
|
||
padding: 0 16px;
|
||
box-sizing: border-box;
|
||
.popupTop{
|
||
box-sizing: border-box;
|
||
height: 60px;
|
||
font-size: 15px;
|
||
font-weight: 600;
|
||
color: #333;
|
||
text-align: left;
|
||
width: 100%;
|
||
padding: 16px 0;
|
||
background-color: #fff;
|
||
}
|
||
.bodyList{
|
||
width: 100%;
|
||
height: 190px;
|
||
box-sizing: border-box;
|
||
.item{
|
||
width: 100%;
|
||
border-bottom: 1px solid #efefef;
|
||
padding: 5px 0;
|
||
display: flex;
|
||
align-items: center;
|
||
.index{
|
||
height: 16px;
|
||
color: #E1B582;
|
||
border: 1px solid #E1B582;
|
||
border-radius: 4px;
|
||
padding: 0 6px;
|
||
margin-right: 6px;
|
||
font-size: 12px;
|
||
line-height: 16px;
|
||
}
|
||
}
|
||
}
|
||
}
|
||
}
|
||
|
||
</style>
|