3638 lines
132 KiB
Vue
3638 lines
132 KiB
Vue
<template>
|
||
<view class="main">
|
||
<!-- 根据要显示的内容 切换高度 -->
|
||
<view class="header" :style="{height:loadMore?`${menu.bottom+428}px`:`${menu.bottom+245}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="/static/images/index/dateTime.svg"></image>
|
||
<!-- <picker mode="date" :value="single" @change="bindDateChange" >-->
|
||
<picker mode="date" :value="single" :end="endData" @change="bindDateChange" >
|
||
<view class="time">
|
||
<text class="day">{{ thisDay }}</text>
|
||
<view class="uni-input" style="background: transparent;padding: 0;height:100%">{{ single }}</view>
|
||
<image class="icon" src="/static/images/index/arrow_bottom.svg"></image>
|
||
</view>
|
||
</picker>
|
||
</view>
|
||
</div>
|
||
<div class="storeDetail" :style="{ top: menu.bottom + 13 + 'px',height:loadMore?'200px':'38px'}">
|
||
<p class="storeName">门店上传<span class="num">{{showTableData.Revenue_Upload?showTableData.Revenue_Upload:'-'}}</span>/{{allShopCount?allShopCount:'-'}}</p>
|
||
<div class="detailBox">
|
||
<div class="detailTop">
|
||
<div class="top">
|
||
<div class="left">
|
||
<image class="icon" src="https://eshangtech.com/ShopICO/ahyd-BID/home/indexIcon.svg"/>
|
||
<div class="money">
|
||
<div class="moneyTop" @click="handlePage">
|
||
<p class="price">{{showTableData.CashPay || '0.00'}}</p>
|
||
<image class="moreIcon" src="https://eshangtech.com/ShopICO/ahyd-BID/home/indexMore.svg"/>
|
||
</div>
|
||
<p class="text">昨日累计<span class="unit">/元</span></p>
|
||
</div>
|
||
</div>
|
||
<div class="right">
|
||
<p class="add">{{showTableData.compared?showTableData.compared>0?`+${showTableData.compared}%`:showTableData.compared+'%':'-'}}</p>
|
||
<p class="addText">比昨日</p>
|
||
</div>
|
||
</div>
|
||
<div class="bottom">
|
||
<div class="bottomItem">
|
||
<p class="total">{{monthAmountAdd?monthAmountAdd:'-'}}</p>
|
||
<p class="totalLabel">本月累计<span class="labelUnit">/元</span></p>
|
||
</div>
|
||
<div class="bottomItem">
|
||
<p class="total">{{yearAmountAdd?yearAmountAdd:'-'}}</p>
|
||
<p class="totalLabel">年度累计<span class="labelUnit">/元</span></p>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
<div class="detailBottom" :style="{height: loadMore?'208px':'38px'}">
|
||
<div class="searchBox" v-if="!loadMore" @click="handleChangeLoadMore">
|
||
<text class="searchText">查看更多</text>
|
||
<image class="searchIcon" :style="{transform: loadMore?'':'rotate(180deg)'}" src="https://eshangtech.com/ShopICO/ahyd-BID/home/downLoad.svg"/>
|
||
</div>
|
||
<div class="otherDetail" v-else>
|
||
<view class="detail">
|
||
<view class="detailItem">
|
||
<p class="price">{{ showTableData.Different_Price_More?showTableData.Different_Price_More:'-' }}</p>
|
||
<p class="itemName">长款金额<text class="itemUnit">/元</text></p>
|
||
</view>
|
||
<view class="detailItem">
|
||
<p class="price">{{ showTableData.Different_Price_Less?showTableData.Different_Price_Less:'-' }}</p>
|
||
<p class="itemName">短款金额<text class="itemUnit">/元</text></p>
|
||
</view>
|
||
<view class="detailItem">
|
||
<p class="price">{{showTableData.TotalOffAmount?showTableData.TotalOffAmount:'-' }}</p>
|
||
<p class="itemName">优惠金额<text class="itemUnit">/元</text></p>
|
||
</view>
|
||
<view class="detailItem">
|
||
<p class="price" :style="{color:isBig?'red':''}">{{showTableData.Revenue_Upload?showTableData.Revenue_Upload:'-'}}/{{allShopCount?allShopCount:'-'}}</p>
|
||
<div class="itemName" style="display: flex;align-items: center">
|
||
<text>门店上传</text>
|
||
<div v-if="Number(showTableData.Revenue_Upload)<Number(allShopCount)" class="prompt" style="margin-left: 5px" @click="handleStoreUpload">!</div>
|
||
</div>
|
||
</view>
|
||
<view class="detailItem">
|
||
<p class="price">{{ showTableData.TotalCount?showTableData.TotalCount:'-' }}</p>
|
||
<p class="itemName">商品出售<text class="itemUnit">/件</text></p>
|
||
</view>
|
||
<view class="detailItem">
|
||
<p class="price">{{ showTableData.countave?showTableData.countave:'-' }}</p>
|
||
<p class="itemName">商品均价<text class="itemUnit">/元</text></p>
|
||
</view>
|
||
<view class="detailItem">
|
||
<p class="price" v-if="carInfo.Vehicle_Count">{{carInfo.Vehicle_Count?carInfo.Vehicle_Count:'-'}}</p>
|
||
<p class="price" v-else style="color:red;font-size: 14px;font-weight: 400">第三方未传</p>
|
||
<p class="itemName">日均入区<text class="itemUnit">/辆</text></p>
|
||
</view>
|
||
<view class="detailItem">
|
||
<p class="price">{{carInfo.Entry_Rate?carInfo.Entry_Rate :'-' }}</p>
|
||
<p class="itemName">入区率<text class="itemUnit">/%</text></p>
|
||
</view>
|
||
<view class="detailItem">
|
||
<p class="price">{{carInfo.Stay_Times?carInfo.Stay_Times:'-' }}</p>
|
||
<p class="itemName">停留时长<text class="itemUnit">/分钟</text></p>
|
||
</view>
|
||
</view>
|
||
</div>
|
||
<div class="naShowMoreBox" @click="handleChangeLoadMore" >
|
||
<image v-if="loadMore" class="noShowMore" src="https://eshangtech.com/ShopICO/ahyd-BID/home/downLoad.svg"/>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</view>
|
||
|
||
<view class="funEntry">
|
||
<div class="funList">
|
||
<div class="funItem" v-for="(item,index) in tabTypeList" :key="index" @click="handleGoTab(item)">
|
||
<image class="funItemIcon" :src="item.imgUrl"/>
|
||
<text class="funItemText">{{item.name}}</text>
|
||
</div>
|
||
</div>
|
||
|
||
<div class="otherFunBox">
|
||
<!-- 防止背景图变形 -->
|
||
<div class="otherFunItem" style="height:calc(((100vw - 9px)/2)/2.31);background-image: url('https://eshangtech.com/ShopICO/ahyd-BID/home/basic.svg')" @click="handleGoOtherFun(1)">
|
||
<p class="itemTitle">基础信息</p>
|
||
<image class="itemImg" src="https://eshangtech.com/ShopICO/ahyd-BID/home/food.svg"/>
|
||
<div class="nowBox">
|
||
<text class="nowText">立即查看</text>
|
||
<image class="searchIcon" src="https://eshangtech.com/ShopICO/ahyd-BID/home/blueArrow.svg"/>
|
||
</div>
|
||
</div>
|
||
|
||
<div class="otherFunItem" style="height:calc(((100vw - 9px)/2)/2.31);background-image: url('https://eshangtech.com/ShopICO/ahyd-BID/home/examine.svg');margin-left: 9px" @click="handleGoOtherFun(2)">
|
||
<p class="itemTitle" style="color: #5534D9">考核管理</p>
|
||
<image class="itemImg" src="https://eshangtech.com/ShopICO/ahyd-BID/home/mark.svg"/>
|
||
<div class="nowBox">
|
||
<text class="nowText" style="color: #907DE8">立即查看</text>
|
||
<image class="searchIcon" src="https://eshangtech.com/ShopICO/ahyd-BID/home/purpleArrow.svg"/>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</view>
|
||
|
||
|
||
<view class="carWarning" style="height: calc((100vw - 32px) / 2.15)" v-if="special">
|
||
<div class="carWarningTop">
|
||
<div class="warningBox">
|
||
<image class="warningIcon" src="https://eshangtech.com/ShopICO/ahyd-BID/home/carIcon.svg"/>
|
||
<div class="trafficBox">
|
||
<text class="trafficCar">车流预警</text>
|
||
</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"></div>
|
||
<span class="indexText">{{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?'https://eshangtech.com/ShopICO/ahyd-BID/index/addIcon.svg':Number(item.VEHICLE_RATE)===100?'':'https://eshangtech.com/ShopICO/ahyd-BID/index/reduce.svg'"/>
|
||
<span class="add">{{item.VEHICLE_RATE}}%</span>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</view>
|
||
|
||
|
||
<div class="flowRank">
|
||
<div class="flowTop">
|
||
<div class="bigTab">
|
||
<div class="tabItem" v-for="(item,index) in bigTab" :key="index" @click="handleChangeBigSelect(item.value)">
|
||
<image class="tabItemIcon" :src="item.imgUrl"/>
|
||
<text :class="selectBigTab===item.value?'selectTabItem':'tabItemText'">{{item.text}}</text>
|
||
</div>
|
||
<div class="moreStoreBox" @click="handleGoCarBi" v-if="selectBigTab===1">
|
||
<span class="moreText">更多记录</span>
|
||
<image class="moreIcon" src="https://eshangtech.com/ShopICO/ahyd-BID/commercial/rightArrow.svg"/>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
|
||
<div class="flowDetail" v-if="selectBigTab===1">
|
||
<div class="detailTop">
|
||
<div class="smallTab">
|
||
<div @click="handleChangeSmallSelect(item.value)" :class="selectSmallTab === item.value?'selectSmallItem smallTabItem':'smallTabItem'" v-for="(item,index) in smallTab" :key="index">{{item.text}}</div>
|
||
</div>
|
||
</div>
|
||
|
||
<div class="detailList">
|
||
<div class="detailItem" v-for="(item,index) in showTrafficList" :key="index">
|
||
<div class="itemLeft">
|
||
<span class="itemIndex" :style="{color: index===0?'#F0432C':index===1?'#FF842F':index===2?'#FFAC21':'#786B6C'}">{{index+1<10?`0${index+1}`:index+1}}</span>
|
||
<div class="itemBox">
|
||
<span class="itemName">{{item.Serverpart_Name}}</span>
|
||
<span class="itemArea">{{item.Serverpart_Region}}区</span>
|
||
</div>
|
||
</div>
|
||
<div class="itemRight">
|
||
<span class="carNumber">{{selectSmallTab===1?item.Vehicle_Count:selectSmallTab===2?item.SectionFlow_Count:item.Entry_Rate}}</span>
|
||
<span class="carUnit">{{selectSmallTab!==3?'/辆':'%'}}</span>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
|
||
<div class="flowDetail" v-if="selectBigTab===2">
|
||
<div class="thisYear" style="margin-top: 0" @click="handlePlanPageGo('year')">
|
||
<div class="titleTop">
|
||
<p class="title">年度自营计划</p>
|
||
<div class="question" @click.stop="handleShowNoticeYear">
|
||
<image src="/static/images/index/noticeQuestion.svg"></image>
|
||
</div>
|
||
<div v-if="showNoticeYear" class="titleTopNotice">{{yearNoticeText}}</div>
|
||
<div v-if="showNoticeYear" class="meng" @click.stop="handleNoShowNoticeYear"></div>
|
||
</div>
|
||
<view class="box">
|
||
<view class="top">
|
||
<view class="big">
|
||
<image class="icon" src="https://eshangtech.com/ShopICO/ahyd-BID/index/planYear.svg"></image>
|
||
</view>
|
||
<view class="text">
|
||
<view class="textTop">
|
||
<view class="left">
|
||
<p class="number">{{plan.percentageYear?plan.percentageYear + '%':'-'}}</p>
|
||
<p v-if="plan.percentageYear>=100" class="desc" style="color: #4E68FF"><image class="success" src="/static/images/index/yearSuccess.svg"></image></p>
|
||
</view>
|
||
<view class="right">
|
||
<text class="comparePlan">比计划: </text>
|
||
<div class="box2">
|
||
<image class="addIcon" :src="Number(yearAdd)>0?'https://eshangtech.com/ShopICO/ahyd-BID/index/addIcon.svg':'https://eshangtech.com/ShopICO/ahyd-BID/index/reduce.svg'"></image>
|
||
<p class="text">{{yearAdd?Math.abs(yearAdd) + '%':''}}</p>
|
||
</div>
|
||
</view>
|
||
</view>
|
||
<div class="progressPlan">
|
||
<div class="transYear" :style="{width:plan.percentageYear + '%'}"></div>
|
||
</div>
|
||
</view>
|
||
</view>
|
||
<view class="bottom">
|
||
<view class="success" style="margin-right: 39px">
|
||
<p class="text">年度已完成<text class="unit">/元</text></p>
|
||
<p class="money">{{plan.RevenueYear_Amount?plan.RevenueYear_Amount:'-'}}</p>
|
||
</view>
|
||
<view class="success">
|
||
<p class="text">年度计划<text class="unit">/元</text></p>
|
||
<p class="money">{{plan.BudgetYear_Amount?plan.BudgetYear_Amount:'-'}}</p>
|
||
</view>
|
||
</view>
|
||
</view>
|
||
</div>
|
||
|
||
<div class="thisMonth" @click="handlePlanPageGo('month')">
|
||
<div class="titleTop">
|
||
<p class="title">本月自营计划</p>
|
||
<div class="question" @click.stop="handleShowNotice">
|
||
<image src="/static/images/index/noticeQuestion.svg"></image>
|
||
</div>
|
||
<div v-if="showNotice" class="titleTopNotice">{{monthNoticeText}}</div>
|
||
<div v-if="showNotice" class="meng" @click.stop="handleNoShowNotice"></div>
|
||
</div>
|
||
<view class="box">
|
||
<view class="top">
|
||
<view class="big">
|
||
<image class="icon" src="https://eshangtech.com/ShopICO/ahyd-BID/index/thisMonth.svg"></image>
|
||
</view>
|
||
<view class="text">
|
||
<view class="textTop">
|
||
<view class="left">
|
||
<p class="number">{{plan.percentageMonth?plan.percentageMonth + '%':'-'}}</p>
|
||
<p v-if="plan.percentageMonth>=100" class="desc"><image class="success" src="/static/images/index/successMonth.svg"></image></p>
|
||
</view>
|
||
<view class="right">
|
||
<text class="comparePlan">比计划: </text>
|
||
<view class="box2">
|
||
<image class="addIcon" :src="Number(monthAdd)>0?'https://eshangtech.com/ShopICO/ahyd-BID/index/addIcon.svg':'https://eshangtech.com/ShopICO/ahyd-BID/index/reduce.svg'"></image>
|
||
<p class="text">{{monthAdd?Math.abs(monthAdd) + '%':'-'}}</p>
|
||
</view>
|
||
</view>
|
||
</view>
|
||
<div class="progressPlan">
|
||
<div class="trans" :style="{width:plan.percentageMonth + '%'}"></div>
|
||
</div>
|
||
</view>
|
||
</view>
|
||
<view class="bottom">
|
||
<view class="success" style="margin-right: 39px">
|
||
<p class="text">本月已完成<text class="unit">/元</text></p>
|
||
<p class="money">{{plan.RevenueMonth_Amount?plan.RevenueMonth_Amount:'-'}}</p>
|
||
</view>
|
||
<view class="success">
|
||
<p class="text">本月计划<text class="unit">/元</text></p>
|
||
<p class="money">{{plan.BudgetMonth_Amount?plan.BudgetMonth_Amount:'-'}}</p>
|
||
</view>
|
||
</view>
|
||
</view>
|
||
</div>
|
||
|
||
<div class="propOfReven">
|
||
<p class="title">营收占比</p>
|
||
<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">
|
||
<!-- 1、2、3就是对应的第几个标题选中 老项目复制的 -->
|
||
<div v-show="selectTab===1" v-if="modelProgress.length > 0 && theRequest.ProvinceCode==340000">
|
||
<div>
|
||
<div class="operation-c-list" v-for="(item,o) in modelProgress" :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">{{item.value}}</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="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">{{item.value}}</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===3" 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">{{item.value}}</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>
|
||
</div>
|
||
</div>
|
||
|
||
</div>
|
||
|
||
<!-- <view class="other">-->
|
||
<!-- <view v-if="user.Membership_Id" >-->
|
||
<!-- <view class="topTitle">-->
|
||
<!-- <p class="title">对客营收</p>-->
|
||
<!-- <view style="display: flex;flex-direction: column;text-align: right">-->
|
||
<!-- <text class="smallTitle">{{monthAmountAdd?monthAmountAdd:'-'}}<text class="month">({{thisMonth?thisMonth:'-'}}月累计)</text></text>-->
|
||
<!-- <text class="smallTitle">{{yearAmountAdd?yearAmountAdd:'-'}}<text class="month">(年度累计)</text></text>-->
|
||
<!-- </view>-->
|
||
<!-- <!– 移位置 不确定会不会加回去 先注释 –>-->
|
||
<!--<!– <span class="text">门店上传: <text style="margin-left: 4px" :style="{color:isBig?'red':''}">{{showTableData.Revenue_Upload?showTableData.Revenue_Upload:'-'}}/{{allShopCount?allShopCount:'-'}}</text></span>–>-->
|
||
<!-- </view>-->
|
||
<!-- <view class="box" @click="handlePage">-->
|
||
<!-- <view class="priceBox">-->
|
||
<!-- <p class="allPrice">{{showTableData.CashPay || '0.00'}}</p>-->
|
||
<!-- <image class="start" src="https://ahyd.eshangtech.com/UploadImageDir/ahyd_DIB/index/start.svg"></image>-->
|
||
<!-- </view>-->
|
||
<!-- </view>-->
|
||
<!-- <view class="addBox">-->
|
||
<!--<!– <text class="smallTitle">{{plan.RevenueMonth_Amount?plan.RevenueMonth_Amount:'-'}}<text class="month">({{thisMonth?thisMonth:'-'}}月累计)</text></text>–>-->
|
||
<!-- <view class="right">-->
|
||
<!-- <image class="arrowTop" :src="Number(showTableData.compared)>0?'https://eshangtech.com/ShopICO/ahyd-BID/index/addIcon.svg':'https://eshangtech.com/ShopICO/ahyd-BID/index/reduce.svg'"></image>-->
|
||
<!-- <text class="text">{{showTableData.compared?Math.abs(showTableData.compared) + '%':'-' + '%'}}</text>-->
|
||
<!-- <text class="compare">(相比昨日)</text>-->
|
||
<!-- </view>-->
|
||
<!-- </view>-->
|
||
<!-- </view>-->
|
||
<!-- <view v-if="!user.Membership_Id" class="title" style="font-size: 16px" @click="handleReg">去授权 </view>-->
|
||
<!-- <view class="type">-->
|
||
<!-- <view class="item">-->
|
||
<!-- <view class="leftImg">-->
|
||
<!-- <image src="/static/images/index/average.svg"></image>-->
|
||
<!-- </view>-->
|
||
<!-- <view class="right">-->
|
||
<!-- <p class="typeName">客单交易<text class="unit">/笔</text></p>-->
|
||
<!-- <p class="price">{{showTableData.TicketCount?showTableData.TicketCount:'-'}}</p>-->
|
||
<!-- </view>-->
|
||
<!-- </view>-->
|
||
<!-- <view class="item">-->
|
||
<!-- <view class="leftImg">-->
|
||
<!-- <image src="/static/images/index/business.svg"></image>-->
|
||
<!-- </view>-->
|
||
<!-- <view class="right">-->
|
||
<!-- <p class="typeName">客单均价<text class="unit">/元</text></p>-->
|
||
<!-- <p class="price">{{showTableData.averagePrice?showTableData.averagePrice:'-'}}</p>-->
|
||
<!-- </view>-->
|
||
<!-- </view>-->
|
||
<!-- </view>-->
|
||
<!-- <view class="detail" v-if="!loadMore">-->
|
||
<!-- <view class="detailItem">-->
|
||
<!-- <p class="itemName">-->
|
||
<!-- 长款金额<text class="itemUnit">/元</text>-->
|
||
<!-- </p>-->
|
||
<!-- <p class="price">{{ showTableData.Different_Price_More?showTableData.Different_Price_More:'-' }}</p>-->
|
||
<!-- </view>-->
|
||
<!-- <view class="detailItem">-->
|
||
<!-- <p class="itemName">-->
|
||
<!-- 短款金额<text class="itemUnit">/元</text>-->
|
||
<!-- </p>-->
|
||
<!-- <p class="price">{{ showTableData.Different_Price_Less?showTableData.Different_Price_Less:'-' }}</p>-->
|
||
<!-- </view>-->
|
||
<!-- <view class="detailItem">-->
|
||
<!-- <p class="itemName">-->
|
||
<!-- 优惠金额<text class="itemUnit">/元</text>-->
|
||
<!-- </p>-->
|
||
<!-- <p class="price">{{showTableData.TotalOffAmount?showTableData.TotalOffAmount:'-' }}</p>-->
|
||
<!-- </view>-->
|
||
<!-- <view class="detailItem">-->
|
||
<!-- <div class="itemName" style="display: flex;align-items: center">-->
|
||
<!-- <text>门店上传</text>-->
|
||
<!-- <div v-if="Number(showTableData.Revenue_Upload)<Number(allShopCount)" class="prompt" style="margin-left: 5px" @click="handleStoreUpload">!</div>-->
|
||
<!-- </div>-->
|
||
<!-- <p class="price" :style="{color:isBig?'red':''}">{{showTableData.Revenue_Upload?showTableData.Revenue_Upload:'-'}}/{{allShopCount?allShopCount:'-'}}</p>-->
|
||
<!-- </view>-->
|
||
<!--<!– <view class="detailItem">–>-->
|
||
<!--<!– <p class="itemName">–>-->
|
||
<!--<!– 分润到账<text class="itemUnit">/元</text>–>-->
|
||
<!--<!– </p>–>-->
|
||
<!--<!– <p class="price">{{detailTypeList[1].yesterValue?detailTypeList[1].yesterValue:'-' }}</p>–>-->
|
||
<!--<!– </view>–>-->
|
||
<!-- <view class="detailItem">-->
|
||
<!-- <p class="itemName">-->
|
||
<!-- 商品出售<text class="itemUnit">/件</text>-->
|
||
<!-- </p>-->
|
||
<!-- <p class="price">{{ showTableData.TotalCount?showTableData.TotalCount:'-' }}</p>-->
|
||
<!-- </view>-->
|
||
<!-- <view class="detailItem">-->
|
||
<!-- <p class="itemName">-->
|
||
<!-- 商品均价<text class="itemUnit">/元</text>-->
|
||
<!-- </p>-->
|
||
<!-- <p class="price">{{ showTableData.countave?showTableData.countave:'-' }}</p>-->
|
||
<!-- </view>-->
|
||
<!-- <view class="detailItem">-->
|
||
<!-- <p class="itemName">-->
|
||
<!-- 日均入区<text class="itemUnit">/辆</text>-->
|
||
<!-- </p>-->
|
||
<!-- <p class="price" v-if="carInfo.Vehicle_Count">{{carInfo.Vehicle_Count?carInfo.Vehicle_Count:'-'}}</p>-->
|
||
<!-- <p class="price" v-else style="color:red;font-size: 14px;font-weight: 400">第三方未传</p>-->
|
||
<!-- </view>-->
|
||
<!-- <view class="detailItem">-->
|
||
<!-- <p class="itemName">-->
|
||
<!-- 入区率<text class="itemUnit">/%</text>-->
|
||
<!-- </p>-->
|
||
<!-- <p class="price">{{carInfo.Entry_Rate?carInfo.Entry_Rate :'-' }}</p>-->
|
||
<!-- </view>-->
|
||
<!-- <view class="detailItem">-->
|
||
<!-- <p class="itemName">-->
|
||
<!-- 停留时长<text class="itemUnit">/分钟</text>-->
|
||
<!-- </p>-->
|
||
<!-- <p class="price">{{carInfo.Stay_Times?carInfo.Stay_Times:'-' }}</p>-->
|
||
<!-- </view>-->
|
||
|
||
<!-- </view>-->
|
||
<!-- </view>-->
|
||
<!-- <div class="more" @click="handleChangeLoadMore">-->
|
||
<!-- <image :class="loadMore?'img':'img rate'" src="/static/images/index/downArrow.svg"></image>-->
|
||
<!-- </div>-->
|
||
<!-- </view>-->
|
||
<!-- <!– 首页除顶部外,剩下的部分是自适应的高度,但是上移本身高度不变内容变了就会在底部留白,所以计算好内容的高度 在切换是否展示的时候 改变高度–>-->
|
||
<!-- <!– 暂无更优法 –>-->
|
||
<!-- <view class="menu">-->
|
||
<!-- <image class="topBg" src="https://eshangtech.com/ShopICO/ahyd-BID/index/menuBg.png"></image>-->
|
||
<!-- <view class="content">-->
|
||
<!-- <div class="tabType">-->
|
||
<!-- <view v-for="(item, index) in tabTypeList" :key="index" class="item" @click="handleGoTab(item)">-->
|
||
<!-- <view class="big">-->
|
||
<!-- <image class="img" :src="item.imgUrl"></image>-->
|
||
<!-- </view>-->
|
||
<!-- <text class="name">{{ item.name }}</text>-->
|
||
<!-- </view>-->
|
||
<!-- </div>-->
|
||
<!--<!– <div class="detailType">–>-->
|
||
<!--<!– <view v-for="(item, index) in detailTypeList" :key="index" class="item">–>-->
|
||
<!--<!– <view class="box">–>-->
|
||
<!--<!– <p class="title">–>-->
|
||
<!--<!– {{ item.name }}<text class="unit">{{ item.unit }}</text>–>-->
|
||
<!--<!– </p>–>-->
|
||
<!--<!– <p class="money" v-if="index===0 || index===2">{{ item.value }}</p>–>-->
|
||
<!--<!– <p class="money" v-else>{{ item.yesterValue }}</p>–>-->
|
||
<!--<!– <view v-if="index === 0 || index === 2" class="active">–>-->
|
||
<!--<!– <image v-if="Number(item.add)!==0" class="addIcon" :src="Number(item.add)>0?'https://eshangtech.com/ShopICO/ahyd-BID/index/addIcon.svg':'https://eshangtech.com/ShopICO/ahyd-BID/index/reduce.svg'"></image>–>-->
|
||
<!--<!– <text v-if="Number(item.add)!==0" class="add" :style="{color:Number(item.add)<0?'#07C160':'#FA5151'}">{{ item.add?Math.abs(item.add):'' }}</text>–>-->
|
||
<!--<!– <text v-if="Number(item.add)!==0" class="yesterday">(相比昨日)</text>–>-->
|
||
<!--<!– </view>–>-->
|
||
<!--<!– <view class="otherBox" v-else>–>-->
|
||
<!--<!– <view class="other">本月累计</view>–>-->
|
||
<!--<!– <text class="month">{{ item.value }}</text>–>-->
|
||
<!--<!– </view>–>-->
|
||
<!--<!– <image :src="item.imgIcon" class="imgIcon"></image>–>-->
|
||
<!--<!– </view>–>-->
|
||
<!--<!– </view>–>-->
|
||
<!--<!– </div>–>-->
|
||
|
||
|
||
<!-- <div class="thisMonth" @click="handlePlanPageGo('month')">-->
|
||
<!-- <div class="titleTop">-->
|
||
<!-- <p class="title">本月自营计划</p>-->
|
||
<!-- <div class="question" @click.stop="handleShowNotice">-->
|
||
<!-- <image src="/static/images/index/noticeQuestion.svg"></image>-->
|
||
<!-- </div>-->
|
||
<!-- <div v-if="showNotice" class="titleTopNotice">{{monthNoticeText}}</div>-->
|
||
<!-- <div v-if="showNotice" class="meng" @click.stop="handleNoShowNotice"></div>-->
|
||
<!-- </div>-->
|
||
<!-- <view class="box">-->
|
||
<!-- <view class="top">-->
|
||
<!-- <view class="big">-->
|
||
<!-- <image class="icon" src="https://eshangtech.com/ShopICO/ahyd-BID/index/thisMonth.svg"></image>-->
|
||
<!-- </view>-->
|
||
<!-- <view class="text">-->
|
||
<!-- <view class="textTop">-->
|
||
<!-- <view class="left">-->
|
||
<!-- <p class="number">{{plan.percentageMonth?plan.percentageMonth + '%':'-'}}</p>-->
|
||
<!-- <p v-if="plan.percentageMonth>=100" class="desc"><image class="success" src="/static/images/index/successMonth.svg"></image></p>-->
|
||
<!-- </view>-->
|
||
<!-- <view class="right">-->
|
||
<!-- <text class="comparePlan">比计划: </text>-->
|
||
<!-- <view class="box2">-->
|
||
<!-- <image class="addIcon" :src="Number(monthAdd)>0?'https://eshangtech.com/ShopICO/ahyd-BID/index/addIcon.svg':'https://eshangtech.com/ShopICO/ahyd-BID/index/reduce.svg'"></image>-->
|
||
<!-- <p class="text">{{monthAdd?Math.abs(monthAdd) + '%':'-'}}</p>-->
|
||
<!-- </view>-->
|
||
<!-- </view>-->
|
||
<!-- </view>-->
|
||
<!-- <div class="progressPlan">-->
|
||
<!-- <div class="trans" :style="{width:plan.percentageMonth + '%'}"></div>-->
|
||
<!-- <!– <div class=pro :style="{width:(100 - plan.percentageMonth)+ '%'}"></div>–>-->
|
||
<!-- <!– <view class="trans" :style="{width: plan.percentageMonth + '%'}"></view>–>-->
|
||
<!-- <!– <image class="img" src="https://eshangtech.com/ShopICO/ahyd-BID/index/progress_orange.png"></image>–>-->
|
||
<!-- <!– <div class=pro :style="{width:(100 - plan.percentageMonth)+ '%'}"></div>–>-->
|
||
<!-- </div>-->
|
||
<!-- </view>-->
|
||
<!-- </view>-->
|
||
<!-- <view class="bottom">-->
|
||
<!-- <view class="success" style="margin-right: 39px">-->
|
||
<!-- <p class="text">本月已完成<text class="unit">/元</text></p>-->
|
||
<!-- <p class="money">{{plan.RevenueMonth_Amount?plan.RevenueMonth_Amount:'-'}}</p>-->
|
||
<!-- </view>-->
|
||
<!-- <view class="success">-->
|
||
<!-- <p class="text">本月计划<text class="unit">/元</text></p>-->
|
||
<!-- <p class="money">{{plan.BudgetMonth_Amount?plan.BudgetMonth_Amount:'-'}}</p>-->
|
||
<!-- </view>-->
|
||
<!-- </view>-->
|
||
<!-- </view>-->
|
||
<!-- </div>-->
|
||
<!-- <div class="thisYear" style="margin-top: 0px" @click="handlePlanPageGo('year')">-->
|
||
<!-- <div class="titleTop">-->
|
||
<!-- <p class="title">年度自营计划</p>-->
|
||
<!-- <div class="question" @click.stop="handleShowNoticeYear">-->
|
||
<!-- <image src="/static/images/index/noticeQuestion.svg"></image>-->
|
||
<!-- </div>-->
|
||
<!-- <div v-if="showNoticeYear" class="titleTopNotice">{{yearNoticeText}}</div>-->
|
||
<!-- <div v-if="showNoticeYear" class="meng" @click.stop="handleNoShowNoticeYear"></div>-->
|
||
<!-- </div>-->
|
||
<!-- <view class="box">-->
|
||
<!-- <view class="top">-->
|
||
<!-- <view class="big">-->
|
||
<!-- <image class="icon" src="https://eshangtech.com/ShopICO/ahyd-BID/index/planYear.svg"></image>-->
|
||
<!-- </view>-->
|
||
<!-- <view class="text">-->
|
||
<!-- <view class="textTop">-->
|
||
<!-- <view class="left">-->
|
||
<!-- <p class="number">{{plan.percentageYear?plan.percentageYear + '%':'-'}}</p>-->
|
||
<!-- <p v-if="plan.percentageYear>=100" class="desc" style="color: #4E68FF"><image class="success" src="/static/images/index/yearSuccess.svg"></image></p>-->
|
||
<!-- </view>-->
|
||
<!-- <view class="right">-->
|
||
<!-- <text class="comparePlan">比计划: </text>-->
|
||
<!-- <div class="box2">-->
|
||
<!-- <image class="addIcon" :src="Number(yearAdd)>0?'https://eshangtech.com/ShopICO/ahyd-BID/index/addIcon.svg':'https://eshangtech.com/ShopICO/ahyd-BID/index/reduce.svg'"></image>-->
|
||
<!-- <p class="text">{{yearAdd?Math.abs(yearAdd) + '%':''}}</p>-->
|
||
<!-- </div>-->
|
||
<!-- </view>-->
|
||
<!-- </view>-->
|
||
<!-- <div class="progressPlan">-->
|
||
<!-- <div class="transYear" :style="{width:plan.percentageYear + '%'}"></div>-->
|
||
<!-- <!– <image class="img" :style="{width: plan.percentageYear + '%'}" src="https://eshangtech.com/ShopICO/ahyd-BID/index/progress_blue.png"></image>–>-->
|
||
<!-- <!– <div class=pro :style="{width:(100 - plan.percentageYear)+ '%'}"></div>–>-->
|
||
<!-- </div>-->
|
||
<!-- </view>-->
|
||
<!-- </view>-->
|
||
<!-- <view class="bottom">-->
|
||
<!-- <view class="success" style="margin-right: 39px">-->
|
||
<!-- <p class="text">年度已完成<text class="unit">/元</text></p>-->
|
||
<!-- <p class="money">{{plan.RevenueYear_Amount?plan.RevenueYear_Amount:'-'}}</p>-->
|
||
<!-- </view>-->
|
||
<!-- <view class="success">-->
|
||
<!-- <p class="text">年度计划<text class="unit">/元</text></p>-->
|
||
<!-- <p class="money">{{plan.BudgetYear_Amount?plan.BudgetYear_Amount:'-'}}</p>-->
|
||
<!-- </view>-->
|
||
<!-- </view>-->
|
||
<!-- </view>-->
|
||
<!-- </div>-->
|
||
|
||
|
||
|
||
<!-- <div class="propOfReven">-->
|
||
<!-- <p class="title">营收占比</p>-->
|
||
<!-- <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">-->
|
||
<!-- <!– 1、2、3就是对应的第几个标题选中 老项目复制的 –>-->
|
||
<!-- <div v-show="selectTab===1" v-if="modelProgress.length > 0 && theRequest.ProvinceCode==340000">-->
|
||
<!-- <div>-->
|
||
<!-- <div class="operation-c-list" v-for="(item,o) in modelProgress" :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">{{item.value}}</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="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">{{item.value}}</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===3" 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">{{item.value}}</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>-->
|
||
<!-- </div>-->
|
||
|
||
<!-- </view>-->
|
||
<!-- </view>-->
|
||
<!--<!– isShow–>-->
|
||
<!-- <div class="notice" v-if="special" style="background: rgba(203, 26, 26, 1)">-->
|
||
<!-- <view class="left">-->
|
||
<!-- <image class="icon" src="https://eshangtech.com/ShopICO/ahyd-BID/index/dangerous.svg"></image>-->
|
||
<!-- <view class="text">-->
|
||
<!-- <p class="name">五一流量预警</p>-->
|
||
<!--<!– <p class="desc"></p>–>-->
|
||
<!-- </view>-->
|
||
<!-- </view>-->
|
||
<!-- <view class="right" @click="handleSearch('special')">去查看</view>-->
|
||
<!-- </div>-->
|
||
|
||
<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.ShopName}}</div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</uni-popup>
|
||
<Tabbar ref="tabbar" :page="page"></Tabbar>
|
||
</view>
|
||
</template>
|
||
|
||
<script>
|
||
import {getThisDay, handleYesterday, timestampToTime} 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";
|
||
var rincanvas = {};
|
||
export default {
|
||
components: {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,
|
||
selectBigTab:1,
|
||
bigTab:[{imgUrl:'https://eshangtech.com/ShopICO/ahyd-BID/home/carTab.svg',text:'车流统计',value:1},
|
||
{imgUrl:'https://eshangtech.com/ShopICO/ahyd-BID/home/revenueTab.svg',text:'经营统计',value:2}],
|
||
smallTab:[{text:'服务区流量排名',value:1},{text:'断面流量排名',value:2},{text:'驶入率排名',value:3}],
|
||
selectSmallTab:1,
|
||
tabTypeList:[
|
||
{ imgUrl: 'https://eshangtech.com/ShopICO/ahyd-BID/home/customer.svg', path: '/pages/commercialBI/guestPortrait', name: '客群统计' },
|
||
{ imgUrl: 'https://eshangtech.com/ShopICO/ahyd-BID/home/operate.svg', path: '/pages/commercialBI/managePortrait', name: '经营统计' },
|
||
{ imgUrl: 'https://eshangtech.com/ShopICO/ahyd-BID/home/trade.svg', path: '/pages/commercialBI/businessPortrait', name: '交易统计' },
|
||
{ imgUrl: 'https://eshangtech.com/ShopICO/ahyd-BID/home/format.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: 3 }],
|
||
selectTab:1, // 选项卡的指针
|
||
monthAmountAdd:'',//月累计
|
||
yearAmountAdd:'',//年累计
|
||
mobileData :{}, // 移动支付分账接口返回的数据
|
||
single:'', // 时间选择器选择的时间
|
||
monthAdd:'',//月每天的相对增加
|
||
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:'',
|
||
thisMonth:0,//拿到当前月份
|
||
isSuccess:false,//首页这些接口是否全部调用成功
|
||
isReturn : true,
|
||
isSuggestion:false,//可不可以看意见
|
||
loadMore:false,// 是否展示更多
|
||
special:false,
|
||
allTrafficList:[],// 车流数据数组
|
||
showTrafficList:[],// 显示在页面上车流数据
|
||
warningList:[]// 预警列表
|
||
}
|
||
},
|
||
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 = timestampToTime((new Date(this.lastDay).getTime()))
|
||
// 获取手机参数对页面进行适配 主要是用于拿到胶囊的位置
|
||
let systemInfo = uni.getSystemInfoSync()
|
||
this.statusBarHeight = Number(systemInfo.statusBarHeight)
|
||
this.menu = uni.getMenuButtonBoundingClientRect()
|
||
// 获取最近有效日期的时间,以昨天为主
|
||
const date = new Date(this.lastDay)
|
||
//设置日期选择器的开始时间和结束时间
|
||
let y = date.getFullYear()
|
||
let m = date.getMonth() + 1
|
||
let d = date.getDate()
|
||
let howDay
|
||
let day
|
||
if (d - 8 <0){
|
||
let k = 8 - d
|
||
m = m - 1
|
||
if (m<10){
|
||
m = '0' + m
|
||
}
|
||
const time = `${y}-${m}`
|
||
howDay = this.$util.getThisMonthDay(time)
|
||
this.startDate = `${y}-${m}-${howDay - k}`
|
||
}else{
|
||
if (m<10){
|
||
m = '0' + m
|
||
}
|
||
if (d - 8 <10){
|
||
day = d - 8
|
||
day = '0' + day
|
||
}else{
|
||
day = d - 8
|
||
}
|
||
this.startDate = `${y}-${m}-${day}`
|
||
}
|
||
this.endData = new Date()
|
||
this.thisDay = getThisDay(date.getDay())
|
||
this.thisMonth = this.$util.getThisTimeMonth(this.lastDay)
|
||
// 把时间存起来给全部页面都能拿到
|
||
uni.setStorageSync('lastDay',this.lastDay)
|
||
// 小程序进来存起来的用户信息
|
||
let userInfo = uni.getStorageSync('vuex')
|
||
userInfo = JSON.parse(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()
|
||
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']),
|
||
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')
|
||
}
|
||
},
|
||
async handleGetTrafficList(){
|
||
uni.showLoading({
|
||
title: '正在加载...'
|
||
})
|
||
const requestParams = {
|
||
Statistics_Date: this.lastDay,
|
||
Province_Code: '340000',
|
||
GroupType: 1
|
||
}
|
||
const bayonetCount = await request.$webGet('CommercialApi/Revenue/GetSPBayonetList', requestParams)
|
||
let res = bayonetCount.Result_Data.List
|
||
res.forEach((item=>{
|
||
if (item.Vehicle_Count===null || item.SectionFlow_Count===null || item.Entry_Rate===null || item.Entry_Rate>100){
|
||
item.Vehicle_Count = 0
|
||
item.SectionFlow_Count = 0
|
||
item.Entry_Rate = 0
|
||
}
|
||
}))
|
||
let allList = []// 全部的
|
||
let list1 = JSON.parse(JSON.stringify(res)) // 服务区流量排名
|
||
let list2 = JSON.parse(JSON.stringify(res)) // 断面流量排名
|
||
let list3 = JSON.parse(JSON.stringify(res)) // 驶入率排名
|
||
// 排序
|
||
for (let i=0;i<=list1.length - 1;i++){
|
||
for (let j=0;j<=list1.length - i - 1 ;j++){
|
||
if (list1[j] && list1[j + 1] && list1[j].Vehicle_Count!==null && list1[j+1].Vehicle_Count!==null){
|
||
if (list1[j].Vehicle_Count < list1[j+1].Vehicle_Count ){
|
||
let temp = list1[j]
|
||
list1[j] = list1[j + 1]
|
||
list1[j + 1] = temp
|
||
}
|
||
}
|
||
}
|
||
}
|
||
for (let i=0;i<=list2.length-1;i++){
|
||
for (let j=0;j<=list2.length - i - 1;j++){
|
||
if (list2[j] && list2[j + 1] && list2[j].SectionFlow_Count!==null && list2[j+1].SectionFlow_Count !==null ){
|
||
if (list2[j].SectionFlow_Count < list2[j+1].SectionFlow_Count){
|
||
let temp = list2[j]
|
||
list2[j] = list2[j + 1]
|
||
list2[j + 1] = temp
|
||
}
|
||
}
|
||
}
|
||
}
|
||
for (let i=0;i<=list3.length-1;i++){
|
||
for (let j=0;j<=list3.length - i - 1;j++){
|
||
if (list3[j] && list3[j + 1] && list3[j].Entry_Rate!==null && list3[j+1].Entry_Rate!==null ){
|
||
if (list3[j].Entry_Rate < list3[j+1].Entry_Rate){
|
||
let temp = list3[j]
|
||
list3[j] = list3[j + 1]
|
||
list3[j + 1] = temp
|
||
}
|
||
}
|
||
}
|
||
}
|
||
// 截取前20
|
||
allList.push(list1.slice(0,20))
|
||
allList.push(list2.slice(0,20))
|
||
allList.push(list3.slice(0,20))
|
||
this.allTrafficList = allList
|
||
this.showTrafficList = this.allTrafficList[this.selectSmallTab - 1]
|
||
// uni.hideLoading()
|
||
},
|
||
handleChangeLoadMore(){
|
||
this.loadMore = !this.loadMore
|
||
},
|
||
handleChangeBigSelect(val){
|
||
this.selectBigTab = val
|
||
},
|
||
handleGoCarBi(){
|
||
this.$util.toNextRoute('navigateTo', `/pages/commercialBI/carPortrait?mustAllProvince=${true}`)
|
||
},
|
||
handleGoWarning(){
|
||
this.$util.toNextRoute('navigateTo', `/pages/commercialBI/specialCase`)
|
||
},
|
||
handleChangeSmallSelect(val){
|
||
this.selectSmallTab = val
|
||
this.showTrafficList = this.allTrafficList[val-1]
|
||
},
|
||
//门店上传后面感叹号的点击事件
|
||
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){
|
||
this.$util.toNextRoute('navigateTo', `/pages/everdayRenven/index?time=${this.lastDay}`)
|
||
}else{
|
||
uni.showToast({
|
||
title: '暂无权限请联系管理员',
|
||
icon: 'none'
|
||
})
|
||
}
|
||
},
|
||
handleGoTab(item){
|
||
console.log('this.isReturn',this.isReturn)
|
||
console.log('item',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 = timestampToTime((new Date(this.lastDay).getTime()))
|
||
//显示当前选择的时间是星期几
|
||
const date = new Date(this.lastDay)
|
||
this.thisDay = getThisDay(date.getDay())
|
||
}
|
||
// 老项目的请求数据的那部分
|
||
this.initData()
|
||
//根据新页面请求数据的方法
|
||
this.initYesterdayData()
|
||
//车流分析
|
||
this.getCarInfo()
|
||
//月度计划、年度计划
|
||
this.monthYearPlan()
|
||
//拿到未上传门点列表
|
||
this.getUnUpLoadList()
|
||
// 拿到车流数据
|
||
this.handleGetTrafficList()
|
||
// 预警信息 有值会显示车流预警
|
||
this.handleGetWarningList()
|
||
} 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()
|
||
//车流分析
|
||
this.getCarInfo()
|
||
//月度计划、年度计划
|
||
this.monthYearPlan()
|
||
//拿到未上传门点列表
|
||
this.getUnUpLoadList()
|
||
// 拿到车流数据
|
||
this.handleGetTrafficList()
|
||
// 是否显示预警信息
|
||
this.handleGetWarningList()
|
||
}
|
||
|
||
// 老代码 不知道干啥用的
|
||
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
|
||
const req= {
|
||
// this.single
|
||
StatisticsDate: this.single,
|
||
StatisticsHour:h,
|
||
StatisticsType:1,
|
||
ShowCount:20
|
||
}
|
||
request.$webGet('CommercialApi/BigData/GetBayonetWarning',req).then(res=>{
|
||
if (res.Result_Data.List.length>0){
|
||
this.special = true
|
||
}
|
||
console.log('this.special',this.special)
|
||
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)
|
||
console.log('this.warningList',this.warningList)
|
||
})
|
||
},
|
||
handleReg(){
|
||
this.$util.toNextRoute('redirectTo', '/pages/register/register')
|
||
},
|
||
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(){
|
||
const monthDate= {
|
||
Province_Code:'340000',
|
||
Statistics_Date:this.lastDay
|
||
}
|
||
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
|
||
this.yearAdd = res.Result_Data.YearGrowth_Rate
|
||
//处理数据
|
||
this.plan.RevenueMonth_Amount = this.$util.fmoney(res.Result_Data.RevenueMonth_Amount)
|
||
this.plan.BudgetMonth_Amount = this.$util.fmoney(res.Result_Data.BudgetMonth_Amount)
|
||
this.plan.RevenueYear_Amount = this.$util.fmoney(res.Result_Data.RevenueYear_Amount)
|
||
this.plan.BudgetYear_Amount = this.$util.fmoney(res.Result_Data.BudgetYear_Amount)
|
||
})
|
||
},
|
||
getCarInfo(){
|
||
const data = {
|
||
Statistics_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:'-'
|
||
})
|
||
},
|
||
async initYesterdayData(){
|
||
let flag1 = false
|
||
let flag2 = false
|
||
let flag3 = false
|
||
let _this = this
|
||
|
||
// 获取营收推送汇总数据
|
||
const allPriceData = {
|
||
pushProvinceCode:'340000',
|
||
Statistics_Date:this.lastDay,
|
||
ShowCompareRate: true,
|
||
ShowYearRevenue: true
|
||
}
|
||
uni.showLoading({
|
||
title: '正在加载...'
|
||
})
|
||
console.log(22222)
|
||
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
|
||
this.regionProgress = result.BusinessTradeList
|
||
this.areaProgress = result.SPRegionList
|
||
this.showTableData = result.RevenuePushModel
|
||
this.showTableData.compared = result.GrowthRate
|
||
// 只有接口全面通了 才可以处理数据显示
|
||
console.log('flag2',flag2)
|
||
console.log('flag3',flag3)
|
||
|
||
|
||
// 传入最近的有效日期就可以拿到当前有效日期的前一天的日期
|
||
let yesterday = handleYesterday(this.lastDay)
|
||
if ((yesterday.substr(yesterday.length-1,1)) === '0'){
|
||
let date = new Date(this.lastDay)
|
||
let y = date.getFullYear()
|
||
let m = date.getMonth() //不加1 反正要减1
|
||
let day = this.$util.getThisMonthDay(this.lastDay)
|
||
yesterday = `${y}-${m}-${day}`
|
||
}
|
||
// 定义入参 除了改变时间 别的和老项目一致
|
||
// const data = {
|
||
// Statistics_Date:yesterday,
|
||
// Statistics_Month:this.theRequest.month,
|
||
// Province_Code:this.theRequest.ProvinceCode,
|
||
// pushProvinceCode:this.theRequest.ProvinceCode,
|
||
// Serverpart_ID:this.theRequest.ServerpartIds?this.theRequest.ServerpartIds:'',
|
||
// SPRegionType_ID:this.theRequest.GroupType==1020?this.theRequest.ServerpartIds:''
|
||
// }
|
||
// request.$webGet('CommercialApi/Revenue/GetRevenuePushList',data).then(res=>{
|
||
// // 计算月总额 拿到昨日的全部对客营收 并拿到相对于昨日的增长比
|
||
// let cashPay = 0
|
||
// res.Result_Data.List.forEach(item=>{
|
||
// cashPay= Number(item.CashPay) + cashPay
|
||
// })
|
||
// // 赋值给data中的这个对象 在请求完之后会进行统一的数据处理
|
||
// _this.yesterdayAllPay = cashPay
|
||
// flag1 = true
|
||
// })
|
||
//昨日的分润门店
|
||
// request.$webGet('CommercialApi/Revenue/GetMobileShare',data).then(res=>{
|
||
// // 赋值给data中的这个对象 在请求完之后会进行统一的数据处理
|
||
// this.ShareShopCountYes = res.Result_Data.ShareShop_Count
|
||
// })
|
||
const date = new Date(this.lastDay)
|
||
const y = date.getFullYear()
|
||
let m = date.getMonth() + 1
|
||
if (m<10){
|
||
m = '0' + m
|
||
}
|
||
//一个月分润门店
|
||
// 如果前一天是上个月 那么拿到的月份还是上一个月的月份 然后结束时间就是前一天 开始时间是月份开始的第一天
|
||
const monthDate={
|
||
Province_Code:'340000',
|
||
StatisticsStartDate:`${y}-${m}-01`,
|
||
StatisticsEndDate:this.lastDay,
|
||
}
|
||
// request.$webGet('CommercialApi/Revenue/GetMobileShare',monthDate).then(res=>{
|
||
// // 赋值给data中的这个对象 在请求完之后会进行统一的数据处理
|
||
// this.monthPrice = res.Result_Data.Royalty_Price
|
||
// })
|
||
//这一日的订单配送
|
||
const todayData = {
|
||
Province_Code:'340000',
|
||
Statistics_Date: this.lastDay,
|
||
ShowCompareRate:true
|
||
}
|
||
console.log(11111)
|
||
const data = await request.$webGet('CommercialApi/Revenue/GetMallDeliver',todayData)
|
||
console.log(4444)
|
||
this.lastDayBillCount = data.Result_Data
|
||
this.detailTypeList[2].value = this.lastDayBillCount.DeliverBill_Count
|
||
this.detailTypeList[2].add = this.lastDayBillCount.DeliverBillGrowth_Count
|
||
this.detailTypeList[3].value = this.$util.fmoney(this.lastDayBillCount.MonthDeliver_Price)
|
||
this.detailTypeList[3].yesterValue = this.$util.fmoney(this.lastDayBillCount.Deliver_Price)
|
||
flag2 = true
|
||
// .then(res=>{
|
||
// // 赋值给data中的这个对象 在请求完之后会进行统一的数据处理
|
||
// this.lastDayBillCount = res.Result_Data
|
||
// this.detailTypeList[2].value = this.lastDayBillCount.DeliverBill_Count
|
||
// this.detailTypeList[2].add = this.lastDayBillCount.DeliverBillGrowth_Count
|
||
// this.detailTypeList[3].value = this.$util.fmoney(this.lastDayBillCount.MonthDeliver_Price)
|
||
// this.detailTypeList[3].yesterValue = this.$util.fmoney(this.lastDayBillCount.Deliver_Price)
|
||
// flag2 = true
|
||
// })
|
||
// 暂时调用不到的方法
|
||
//昨日的订单配送
|
||
// const deliveData = {
|
||
// Province_Code:'340000',
|
||
// Statistics_Date: yesterday
|
||
// }
|
||
// request.$webGet('CommercialApi/Revenue/GetMallDeliver',deliveData).then(res=>{
|
||
// // 赋值给data中的这个对象 在请求完之后会进行统一的数据处理
|
||
// this.yesterdayBillCount = res.Result_Data.DeliverBill_Count
|
||
// })
|
||
// //昨日采购金额
|
||
// const buyPriceYes = {
|
||
// Province_Code:'340000',
|
||
// Statistics_Date: yesterday
|
||
// }
|
||
// request.$webGet('CommercialApi/Revenue/GetMallDeliver',buyPriceYes).then(res=>{
|
||
// // 赋值给data中的这个对象 在请求完之后会进行统一的数据处理
|
||
// this.buyPriceYes = res.Result_Data.Deliver_Price
|
||
// })
|
||
|
||
// //一个月的采购金额
|
||
// const buyPrice = {
|
||
// Province_Code:'340000',
|
||
// StatisticsStartDate:`${y}-${m}-01`,
|
||
// StatisticsEndDate:this.lastDay
|
||
// }
|
||
// request.$webGet('CommercialApi/Revenue/GetMallDeliver',buyPrice).then(res=>{
|
||
// // 赋值给data中的这个对象 在请求完之后会进行统一f的数据处理
|
||
// this.buyPriceMonth = res.Result_Data.Deliver_Price
|
||
// })
|
||
|
||
|
||
// request.$webGet('CommercialApi/Revenue/GetSummaryRevenue',allPriceData).then(res=>{
|
||
// console.log(33333)
|
||
// flag3 = true
|
||
// // 赋值给data中的这个对象 在请求完之后会进行统一的数据处理
|
||
// let result = res.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
|
||
// this.regionProgress = result.BusinessTradeList
|
||
// this.areaProgress = result.SPRegionList
|
||
// this.showTableData = result.RevenuePushModel
|
||
// this.showTableData.compared = result.GrowthRate
|
||
// // 只有接口全面通了 才可以处理数据显示
|
||
// console.log('flag2',flag2)
|
||
// console.log('flag3',flag3)
|
||
//
|
||
//
|
||
// })
|
||
console.log(55555)
|
||
if (flag2 && flag3 ){
|
||
// uni.hideLoading()
|
||
this.todayAmount()
|
||
}
|
||
},
|
||
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){
|
||
let isOnRefresh = false
|
||
let startTime = new Date(this.startDate).getTime()
|
||
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()
|
||
// 判断是否是在限制的时间内
|
||
if (date > endTime || date < startTime){
|
||
isOnRefresh = false
|
||
}else{
|
||
isOnRefresh = true
|
||
}
|
||
// 符合要求的时间可以请求数据 不符合的弹出提示
|
||
if (isOnRefresh){
|
||
this.single = timestampToTime(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: `数据看板仅支持查看${startMonth}.${startDay}-${endMonth}.${endDay}的数据,更多数据请登陆商业综合平台查看`,
|
||
icon:'none',
|
||
showCancel: false,
|
||
duration:3000
|
||
});
|
||
}
|
||
},
|
||
async initData() { // 初始化营收数据
|
||
// const data = {
|
||
// pushProvinceCode:'340000',
|
||
// Statistics_Date:this.lastDay
|
||
// }
|
||
|
||
// //获取服务区门店商家数量列表(根据省份、服务区、区域、统计日期查询)
|
||
// const totalData = await request.$webGet('CommercialApi/BaseInfo/GetShopCountList',data)
|
||
// let all = 0
|
||
// totalData.Result_Data.List.forEach(item=>{
|
||
// all+=item.SHOP_REVENUECOUNT
|
||
// })
|
||
// // this.allShopCount = all
|
||
|
||
//获取移动支付分账数据
|
||
const shareData = {
|
||
Province_Code: '340000',
|
||
Statistics_Date: this.lastDay,
|
||
ShowCompareRate: true
|
||
}
|
||
const mobileShareData = await request.$webGet('CommercialApi/Revenue/GetMobileShare',shareData)
|
||
this.mobileData = mobileShareData.Result_Data
|
||
|
||
|
||
//mobileData 是移动支付分账接口返回来的全部数据
|
||
this.detailTypeList[0].value = this.mobileData.ShareShop_Count
|
||
this.detailTypeList[0].add = this.mobileData.ShareShopGrowth_Count
|
||
this.detailTypeList[1].value = this.$util.fmoney(this.mobileData.MonthRoyalty_Price)
|
||
this.detailTypeList[1].yesterValue = this.$util.fmoney(this.mobileData.Royalty_Price) //返回数据可能有问题
|
||
// 让金额的动画效果出来 设置在class里面
|
||
this.priceMove = true
|
||
//处理数据的方法
|
||
},
|
||
// 请求完最后处理数据的方法 拿到项目就已经是有一堆请求的了 只能最后处理数据
|
||
todayAmount() {
|
||
let _this = this
|
||
// 由于处理数据的时间 必须在全部接口请求完毕 所以加个延时器
|
||
setTimeout(()=>{
|
||
// 由于页面大部分的内容采用渲染的格式 这样的方法是最快的对原数据进行赋值 对照data里面的几个主要的数组看就能看明白
|
||
// 门店上传的前后数字计算来决定样式
|
||
if(this.showTableData.Revenue_Upload >= this.allShopCount){
|
||
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)
|
||
// 处理所有数据 变成有千分号和小数点的数据
|
||
for (let key in this.showTableData){
|
||
if (key==='uploadState' || key==='Revenue_Upload'){
|
||
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.$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);
|
||
.main {
|
||
width: 100%;
|
||
box-sizing: border-box;
|
||
padding-bottom: calc( 45px + env(safe-area-inset-bottom));
|
||
.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: 24rpx;
|
||
font-family: PingFangSC-Regular, PingFang SC;
|
||
font-weight: 400;
|
||
color: #ae664e;
|
||
line-height: 36rpx;
|
||
}
|
||
.icon {
|
||
width: 24px;
|
||
height: 16px;
|
||
}
|
||
}
|
||
}
|
||
}
|
||
.storeDetail{
|
||
width: calc(100% - 32px);
|
||
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%;
|
||
border-radius: 8px;
|
||
background: rgba(254, 255, 254, 0.3);
|
||
margin-top: 8px;
|
||
.detailTop{
|
||
width: 100%;
|
||
height: 152px;
|
||
border-radius: 8px;
|
||
background-image: url("https://eshangtech.com/ShopICO/ahyd-BID/home/headerBg.png");
|
||
background-repeat: no-repeat;
|
||
background-size: 100% 100%;
|
||
//background: linear-gradient(134deg, #FFE9CC 0%, #FFEFE0 30%, #FFE8E3 72%, #FFD0C6 100%);
|
||
box-sizing: border-box;
|
||
padding: 16px;
|
||
.top{
|
||
display: flex;
|
||
justify-content: space-between;
|
||
.left{
|
||
display: flex;
|
||
.icon{
|
||
width: 48px;
|
||
height: 48px;
|
||
margin-right: 8px;
|
||
}
|
||
.money{
|
||
.moneyTop{
|
||
display: flex;
|
||
align-items: center;
|
||
.price{
|
||
font-size: 20px;
|
||
font-family: DINAlternate-Bold, DINAlternate;
|
||
font-weight: bold;
|
||
color: #782717;
|
||
line-height: 28px;
|
||
}
|
||
.moreIcon{
|
||
width: 16px;
|
||
height: 16px;
|
||
margin-left: 5px;
|
||
}
|
||
}
|
||
.text{
|
||
font-size: 14px;
|
||
font-family: PingFangSC-Regular, PingFang SC;
|
||
font-weight: 400;
|
||
color: #934E3F;
|
||
line-height: 20px;
|
||
.unit{
|
||
color: #C99E90;
|
||
margin-left: 2px;
|
||
}
|
||
}
|
||
}
|
||
}
|
||
.right{
|
||
display: flex;
|
||
flex-direction: column;
|
||
align-items: flex-end;
|
||
.add{
|
||
font-size: 20px;
|
||
font-family: DINAlternate-Bold, DINAlternate;
|
||
font-weight: bold;
|
||
color: #E62C3B;
|
||
line-height: 28px
|
||
}
|
||
.addText{
|
||
font-size: 14px;
|
||
font-family: PingFangSC-Regular, PingFang SC;
|
||
font-weight: 400;
|
||
color: #C99E90;
|
||
line-height: 20px;
|
||
}
|
||
}
|
||
}
|
||
.bottom{
|
||
width: 100%;
|
||
display: flex;
|
||
margin-top: 25px;
|
||
.bottomItem{
|
||
width: 50%;
|
||
.total{
|
||
font-size: 18px;
|
||
font-family: DINAlternate-Bold, DINAlternate;
|
||
font-weight: bold;
|
||
color: #782717;
|
||
line-height: 24px
|
||
}
|
||
.totalLabel{
|
||
font-size: 14px;
|
||
font-family: PingFangSC-Regular, PingFang SC;
|
||
font-weight: 400;
|
||
color: #934E3F;
|
||
line-height: 20px;
|
||
.labelUnit{
|
||
color: #C99E90;
|
||
margin-left: 4px;
|
||
}
|
||
}
|
||
}
|
||
}
|
||
}
|
||
.detailBottom{
|
||
width: 100%;
|
||
position: relative;
|
||
.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;
|
||
}
|
||
}
|
||
}
|
||
}
|
||
.naShowMoreBox{
|
||
width: 100%;
|
||
display: flex;
|
||
align-items: center;
|
||
justify-content: center;
|
||
position: absolute;
|
||
left: 0;bottom: 12px;
|
||
.noShowMore{
|
||
width: 25px;
|
||
height: 14px;
|
||
}
|
||
}
|
||
}
|
||
}
|
||
}
|
||
.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;
|
||
}
|
||
}
|
||
}
|
||
.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 0 0;
|
||
.funList{
|
||
width: 100%;
|
||
box-sizing: border-box;
|
||
padding: 0 16px;
|
||
display: flex;
|
||
.funItem{
|
||
width: 25%;
|
||
display: flex;
|
||
flex-direction: column;
|
||
align-items: center;
|
||
.funItemIcon{
|
||
width: 48px;
|
||
height: 48px;
|
||
border-radius: 10px;
|
||
margin-bottom: 4px;
|
||
}
|
||
.funItemText{
|
||
font-size: 14px;
|
||
font-family: PingFangSC-Regular, PingFang SC;
|
||
font-weight: 400;
|
||
color: #160002;
|
||
line-height: 20px;
|
||
}
|
||
}
|
||
}
|
||
.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;
|
||
height: 159px;
|
||
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;
|
||
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: 112px;
|
||
height: 30px;
|
||
background: #D4F0F5;
|
||
border-top-right-radius: 15px;
|
||
border-bottom-right-radius: 15px;
|
||
box-sizing: border-box;
|
||
padding: 4px 16px;
|
||
.trafficCar{
|
||
font-size: 16px;
|
||
font-family: PingFangSC-Medium, PingFang SC;
|
||
font-weight: 600;
|
||
color: #007DA5;
|
||
line-height: 16px;
|
||
}
|
||
}
|
||
}
|
||
}
|
||
.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;
|
||
}
|
||
}
|
||
.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;
|
||
}
|
||
}
|
||
}
|
||
}
|
||
}
|
||
|
||
.flowRank{
|
||
width: 100%;
|
||
border-top-right-radius: 16px;
|
||
border-top-left-radius: 16px;
|
||
margin-top: 20px;
|
||
padding-bottom: 20px;
|
||
background: #fff;
|
||
.flowTop{
|
||
width: 100%;
|
||
height: 58px;
|
||
background: linear-gradient(180deg, rgba(0, 83, 255, 0.1) 0%, rgba(0,83,255,0) 100%);
|
||
box-sizing: border-box;
|
||
border-top-right-radius: 16px;
|
||
border-top-left-radius: 16px;
|
||
padding: 16px;
|
||
.bigTab{
|
||
display: flex;
|
||
position: relative;
|
||
.tabItem{
|
||
display: flex;
|
||
align-items: center;
|
||
margin-right: 33px;
|
||
.tabItemIcon{
|
||
width: 30px;
|
||
height: 20px;
|
||
}
|
||
.tabItemText{
|
||
font-size: 18px;
|
||
font-family: PingFangSC-Regular, PingFang SC;
|
||
font-weight: 400;
|
||
color: #786B6C;
|
||
line-height: 26px;
|
||
}
|
||
.selectTabItem{
|
||
font-size: 18px;
|
||
font-family: PingFangSC-Regular, PingFang SC;
|
||
font-weight: 600;
|
||
color: #190002;
|
||
}
|
||
}
|
||
.moreStoreBox{
|
||
position: absolute;
|
||
display: flex;
|
||
align-items: center;
|
||
right: 0;top: 4px;
|
||
.moreText{
|
||
|
||
}
|
||
.moreIcon{
|
||
width: 18px;
|
||
height: 18px;
|
||
}
|
||
}
|
||
}
|
||
}
|
||
|
||
.flowDetail{
|
||
width: calc(100% - 32px);
|
||
margin-left: 16px;
|
||
.detailTop{
|
||
width: 100%;
|
||
height: 32px;
|
||
border-bottom: 1px solid #F2F4F6;
|
||
.smallTab{
|
||
width: 100%;
|
||
display: flex;
|
||
align-items: center;
|
||
justify-content: space-between;
|
||
.smallTabItem{
|
||
font-size: 14px;
|
||
font-family: PingFangSC-Regular, PingFang SC;
|
||
font-weight: 400;
|
||
color: #786B6C;
|
||
line-height: 20px;
|
||
}
|
||
.selectSmallItem{
|
||
color: #160002!important;
|
||
font-weight: 600!important;
|
||
position: relative;
|
||
}
|
||
.selectSmallItem:after{
|
||
position: absolute;
|
||
content:'';
|
||
width: 18px;
|
||
height: 3px;
|
||
background: #116AFF;
|
||
border-radius: 2px;
|
||
left: 50%;
|
||
bottom: -12px;
|
||
transform: translateX(-9px);
|
||
}
|
||
}
|
||
}
|
||
.detailList{
|
||
width: 100%;
|
||
.detailItem{
|
||
width: 100%;
|
||
box-sizing: border-box;
|
||
padding: 8px 0;
|
||
display: flex;
|
||
align-items: center;
|
||
justify-content: space-between;
|
||
.itemLeft{
|
||
display: flex;
|
||
align-items: center;
|
||
.itemIndex{
|
||
font-size: 16px;
|
||
font-family: DINAlternate-Bold, DINAlternate;
|
||
font-weight: bold;
|
||
color: #786B6C;
|
||
line-height: 20px;
|
||
}
|
||
.itemBox{
|
||
margin-left: 12px;
|
||
.itemName{
|
||
font-size: 14px;
|
||
font-family: PingFangSC-Semibold, PingFang SC;
|
||
font-weight: 600;
|
||
color: #160002;
|
||
line-height: 20px
|
||
}
|
||
.itemArea{
|
||
margin-left: 4px;
|
||
font-size: 12px;
|
||
font-family: PingFangSC-Regular, PingFang SC;
|
||
font-weight: 400;
|
||
color: #786B6C;
|
||
line-height: 18px;
|
||
}
|
||
}
|
||
}
|
||
.itemRight{
|
||
display: flex;
|
||
align-items: center;
|
||
.carNumber{
|
||
font-size: 16px;
|
||
font-family: DINAlternate-Bold, DINAlternate;
|
||
font-weight: bold;
|
||
color: #160002;
|
||
line-height: 20px;
|
||
}
|
||
.carUnit{
|
||
font-size: 12px;
|
||
font-family: PingFangSC-Regular, PingFang SC;
|
||
font-weight: 400;
|
||
color: #A69E9F;
|
||
line-height: 18px;
|
||
margin-left: 2px;
|
||
}
|
||
}
|
||
}
|
||
}
|
||
.thisMonth,.thisYear{
|
||
width: 100%;
|
||
margin-top: 20px;
|
||
padding-bottom: 24px;
|
||
.titleTop{
|
||
display: flex;
|
||
align-items: center;
|
||
position: relative;
|
||
.title {
|
||
font-size: 32rpx;
|
||
font-family: PingFangSC-Semibold, PingFang SC;
|
||
font-weight: 600;
|
||
color: #160002;
|
||
line-height: 44rpx;
|
||
}
|
||
.question{
|
||
width: 16px;
|
||
height: 16px;
|
||
margin-left: 4px;
|
||
display: flex;
|
||
align-items: center;
|
||
image{
|
||
width: 100%;
|
||
height: 100%;
|
||
}
|
||
}
|
||
.titleTopNotice{
|
||
position: absolute;
|
||
padding: 12px;
|
||
left:35%;
|
||
width: 50vw;
|
||
background: #FFFFFF;
|
||
box-shadow: 0 10px 10px 0 rgba(22,0,2,0.1);
|
||
}
|
||
.meng{
|
||
width: 100vw;
|
||
height: 100vh;
|
||
position: fixed;
|
||
top: 0;left: 0;
|
||
}
|
||
}
|
||
.box {
|
||
width: 100%;
|
||
padding: 12px 16px;
|
||
box-sizing: border-box;
|
||
border-radius: 8px;
|
||
background: #f5f2f2;
|
||
margin-top: 12px;
|
||
.top {
|
||
width: 100%;
|
||
display: flex;
|
||
.big {
|
||
width: 40px;
|
||
height: 40px;
|
||
background: #ffffff;
|
||
border-radius: 8px;
|
||
border: 1px solid #ebebeb;
|
||
display: flex;
|
||
justify-content: center;
|
||
align-items: center;
|
||
margin-right: 8px;
|
||
.icon {
|
||
width: 20px;
|
||
height: 20px;
|
||
}
|
||
}
|
||
.text {
|
||
width: calc(100% - 60px);
|
||
padding: 2px 0;
|
||
.textTop{
|
||
display: flex;
|
||
align-items: center;
|
||
justify-content: space-between;
|
||
.left{
|
||
display: flex;
|
||
align-items: center;
|
||
.number {
|
||
font-size: 36rpx;
|
||
font-family: DINAlternate-Bold, DINAlternate;
|
||
font-weight: bold;
|
||
color: #150002;
|
||
line-height: 40rpx;
|
||
}
|
||
.desc{
|
||
display: flex;
|
||
align-items: center;
|
||
margin-left: 8px;
|
||
font-size: 14px;
|
||
color: #FF7043;
|
||
.success{
|
||
width: 20px;
|
||
height: 20px;
|
||
margin-right: 4px;
|
||
}
|
||
}
|
||
}
|
||
.right{
|
||
flex: 1;
|
||
display: flex;
|
||
justify-content: flex-end;
|
||
align-items: center;
|
||
.comparePlan{
|
||
font-size: 24rpx;
|
||
font-family: PingFangSC-Regular, PingFang SC;
|
||
font-weight: 400;
|
||
color: #a69e9f;
|
||
line-height: 36rpx;
|
||
white-space: nowrap;
|
||
}
|
||
.box2{
|
||
display: flex;
|
||
align-items: center;
|
||
.text{
|
||
font-size: 14px;
|
||
font-family: DINAlternate-Bold, DINAlternate;
|
||
color: #150002;
|
||
font-weight: bold;
|
||
|
||
line-height: 40rpx;
|
||
}
|
||
.addIcon {
|
||
width: 16px;
|
||
height: 16px;
|
||
margin-right: 2px;
|
||
}
|
||
}
|
||
}
|
||
}
|
||
|
||
.progressPlan{
|
||
width: 100%;
|
||
height: 8px;
|
||
border-radius: 5px;
|
||
background: #fff;
|
||
margin-top: 8px;
|
||
position: relative;
|
||
overflow: hidden;
|
||
.trans{
|
||
height: 8px;
|
||
position: absolute;
|
||
left: 0;top: 0;
|
||
border-top-right-radius: 4px;
|
||
border-bottom-right-radius: 4px;
|
||
background: url("https://eshangtech.com/ShopICO/ahyd-BID/index/progress_orange.png")no-repeat 100% 100%;
|
||
}
|
||
.transYear{
|
||
height: 8px;
|
||
position: absolute;
|
||
left: 0;top: 0;
|
||
border-top-right-radius: 4px;
|
||
border-bottom-right-radius: 4px;
|
||
background: url("https://eshangtech.com/ShopICO/ahyd-BID/index/progress_blue.png")no-repeat 100% 100%;
|
||
}
|
||
//.img{
|
||
// width: 100%;
|
||
// height: 100%;
|
||
// position: absolute;
|
||
// top: 0;
|
||
// left: 0;
|
||
// z-index:1;
|
||
//}
|
||
//.pro{
|
||
// height: 100%;
|
||
// position: absolute;
|
||
// top: 0;right: 0;
|
||
// background: #fff;
|
||
// z-index:2;
|
||
//}
|
||
|
||
}
|
||
}
|
||
}
|
||
.bottom {
|
||
display: flex;
|
||
margin-top: 16px;
|
||
padding-left: 48px;
|
||
.success {
|
||
.text {
|
||
font-size: 28rpx;
|
||
font-family: PingFangSC-Regular, PingFang SC;
|
||
font-weight: 400;
|
||
color: #786b6c;
|
||
line-height: 40rpx;
|
||
margin-bottom: 2px;
|
||
.unit {
|
||
font-size: 28rpx;
|
||
font-family: PingFangSC-Regular, PingFang SC;
|
||
font-weight: 400;
|
||
color: #a69e9f;
|
||
line-height: 40rpx;
|
||
margin-left: 2px;
|
||
}
|
||
}
|
||
.money {
|
||
font-size: 28rpx;
|
||
font-family: DINAlternate-Bold, DINAlternate;
|
||
font-weight: 600;
|
||
color: #160002;
|
||
line-height: 40rpx;
|
||
}
|
||
}
|
||
}
|
||
}
|
||
}
|
||
.propOfReven{
|
||
width: 100%;
|
||
margin-top: 28px;
|
||
.title {
|
||
font-size: 32rpx;
|
||
font-family: PingFangSC-Semibold, PingFang SC;
|
||
font-weight: 600;
|
||
color: #160002;
|
||
line-height: 44rpx;
|
||
text-align: left;
|
||
margin-bottom: 12px;
|
||
}
|
||
.tabs {
|
||
width: 100%;
|
||
height: 38px;
|
||
box-sizing: border-box;
|
||
padding: 4px;
|
||
background: #f2f1f1;
|
||
border-radius: 4px;
|
||
display: flex;
|
||
justify-content: space-between;
|
||
.tabItem {
|
||
font-size: 28rpx;
|
||
font-family: PingFangSC-Regular, PingFang SC;
|
||
font-weight: 400;
|
||
color: #786b6c;
|
||
padding: 5px 26px;
|
||
line-height: 40rpx;
|
||
}
|
||
.active {
|
||
font-size: 28rpx;
|
||
font-family: PingFangSC-Regular, PingFang SC;
|
||
font-weight: 400;
|
||
color: #160002;
|
||
line-height: 40rpx;
|
||
background: #fff;
|
||
border-radius: 4px;
|
||
}
|
||
}
|
||
.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;
|
||
}
|
||
}
|
||
.price{
|
||
font-size: 32rpx;
|
||
font-family: DINAlternate-Bold, DINAlternate;
|
||
font-weight: 600;
|
||
color: #160002;
|
||
line-height: 40rpx;
|
||
}
|
||
}
|
||
.bottom{
|
||
width: 100%;
|
||
display: flex;
|
||
justify-content: space-between;
|
||
align-items: center;
|
||
.bar{
|
||
width: 70%;
|
||
height: 8px;
|
||
background: #F5F2F2;
|
||
border-radius: 5px;
|
||
position: relative;
|
||
.progress{
|
||
height: 100%;
|
||
background: #1777FF;
|
||
border-radius: 5px;
|
||
opacity: 0.9;
|
||
position: absolute;
|
||
top: 0;left: 0;
|
||
}
|
||
}
|
||
.number{
|
||
font-size: 28rpx;
|
||
font-family: PingFangSC-Regular, PingFang SC;
|
||
font-weight: 400;
|
||
color: #786B6C;
|
||
line-height: 40rpx;
|
||
}
|
||
}
|
||
}
|
||
}
|
||
}
|
||
}
|
||
}
|
||
|
||
.menu {
|
||
width: 100vw;
|
||
position: relative;
|
||
box-sizing: border-box;
|
||
padding-top: 16px;
|
||
border-top-left-radius: 16px;
|
||
border-top-right-radius: 16px;
|
||
overflow: hidden;
|
||
background: #fff;
|
||
top: -16px;
|
||
z-index: 1;
|
||
|
||
.topBg {
|
||
position: absolute;
|
||
width: 100vw;
|
||
height: 104px;
|
||
top: 0;
|
||
left: 0;
|
||
z-index: 2;
|
||
}
|
||
.content {
|
||
padding: 0 16px;
|
||
margin: 0 auto;
|
||
z-index: 3;
|
||
.tabType{
|
||
width: 100%;
|
||
display: flex;
|
||
justify-content: space-between;
|
||
.item {
|
||
display: flex;
|
||
flex-direction: column;
|
||
justify-content: center;
|
||
align-items: center;
|
||
.big {
|
||
width: 48px;
|
||
height: 48px;
|
||
background: #ffffff;
|
||
border-radius: 50%;
|
||
display: flex;
|
||
justify-content: center;
|
||
align-items: center;
|
||
margin-bottom: 8px;
|
||
z-index: 10;
|
||
.img {
|
||
width: 30px;
|
||
height: 30px;
|
||
}
|
||
}
|
||
.name {
|
||
font-size: 24rpx;
|
||
font-family: PingFangSC-Regular, PingFang SC;
|
||
font-weight: 400;
|
||
color: #160002;
|
||
line-height: 32rpx;
|
||
}
|
||
}
|
||
}
|
||
.detailType{
|
||
width: 100%;
|
||
margin-top: 24px;
|
||
box-sizing: border-box;
|
||
display: flex;
|
||
flex-wrap: wrap;
|
||
.item {
|
||
width: calc((100% - 8px) / 2);
|
||
padding: 12px;
|
||
box-sizing: border-box;
|
||
background: #f9f6f6;
|
||
margin-bottom: 8px;
|
||
border-radius: 8px;
|
||
.box {
|
||
width: 100%;
|
||
height: 100%;
|
||
position: relative;
|
||
.imgIcon {
|
||
width: 30px;
|
||
height: 30px;
|
||
position: absolute;
|
||
top: 0;
|
||
right: 0;
|
||
}
|
||
.otherBox{
|
||
display: flex;
|
||
justify-content: space-between;
|
||
.other {
|
||
font-size: 24rpx;
|
||
font-family: PingFangSC-Regular, PingFang SC;
|
||
font-weight: 400;
|
||
color: #a69e9f;
|
||
line-height: 36rpx;
|
||
margin-left: 2px;
|
||
}
|
||
.month{
|
||
font-size: 24rpx;
|
||
font-family: DINAlternate-Bold, DINAlternate;
|
||
font-weight: bold;
|
||
color: #160002;
|
||
line-height: 40rpx;
|
||
}
|
||
}
|
||
|
||
.title {
|
||
font-size: 28rpx;
|
||
font-family: PingFangSC-Regular, PingFang SC;
|
||
font-weight: 400;
|
||
color: #786b6c;
|
||
line-height: 40rpx;
|
||
.unit {
|
||
font-size: 28rpx;
|
||
font-family: PingFangSC-Regular, PingFang SC;
|
||
font-weight: 400;
|
||
color: #a69e9f;
|
||
line-height: 40rpx;
|
||
margin-left: 2px;
|
||
}
|
||
}
|
||
.money {
|
||
font-size: 32rpx;
|
||
font-family: DINAlternate-Bold, DINAlternate;
|
||
font-weight: bold;
|
||
color: #160002;
|
||
line-height: 40rpx;
|
||
margin-top: 2px;
|
||
margin-bottom: 12px;
|
||
}
|
||
.active {
|
||
display: flex;
|
||
align-items: center;
|
||
.addIcon {
|
||
width: 16px;
|
||
height: 16px;
|
||
margin-right: 2px;
|
||
}
|
||
.add {
|
||
font-size: 24rpx;
|
||
font-family: PingFangSC-Regular, PingFang SC;
|
||
font-weight: 400;
|
||
color: #fa5151;
|
||
line-height: 32rpx;
|
||
}
|
||
.yesterday {
|
||
font-size: 24rpx;
|
||
font-family: PingFangSC-Regular, PingFang SC;
|
||
font-weight: 400;
|
||
color: #a69e9f;
|
||
line-height: 36rpx;
|
||
margin-left: 2px;
|
||
}
|
||
}
|
||
}
|
||
}
|
||
.item:nth-of-type(1),
|
||
.item:nth-of-type(3) {
|
||
margin-right: 8px;
|
||
}
|
||
.item:nth-of-type(3),
|
||
.item:nth-of-type(4) {
|
||
margin-bottom: 0px;
|
||
}
|
||
}
|
||
.propOfReven{
|
||
width: 100%;
|
||
margin-top: 28px;
|
||
.title {
|
||
font-size: 32rpx;
|
||
font-family: PingFangSC-Semibold, PingFang SC;
|
||
font-weight: 600;
|
||
color: #160002;
|
||
line-height: 44rpx;
|
||
text-align: left;
|
||
margin-bottom: 12px;
|
||
}
|
||
.tabs {
|
||
width: 100%;
|
||
height: 38px;
|
||
box-sizing: border-box;
|
||
padding: 4px;
|
||
background: #f2f1f1;
|
||
border-radius: 4px;
|
||
display: flex;
|
||
justify-content: space-between;
|
||
.tabItem {
|
||
font-size: 28rpx;
|
||
font-family: PingFangSC-Regular, PingFang SC;
|
||
font-weight: 400;
|
||
color: #786b6c;
|
||
padding: 5px 26px;
|
||
line-height: 40rpx;
|
||
}
|
||
.active {
|
||
font-size: 28rpx;
|
||
font-family: PingFangSC-Regular, PingFang SC;
|
||
font-weight: 400;
|
||
color: #160002;
|
||
line-height: 40rpx;
|
||
background: #fff;
|
||
border-radius: 4px;
|
||
}
|
||
}
|
||
.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;
|
||
}
|
||
}
|
||
.price{
|
||
font-size: 32rpx;
|
||
font-family: DINAlternate-Bold, DINAlternate;
|
||
font-weight: 600;
|
||
color: #160002;
|
||
line-height: 40rpx;
|
||
}
|
||
}
|
||
.bottom{
|
||
width: 100%;
|
||
display: flex;
|
||
justify-content: space-between;
|
||
align-items: center;
|
||
.bar{
|
||
width: 70%;
|
||
height: 8px;
|
||
background: #F5F2F2;
|
||
border-radius: 5px;
|
||
position: relative;
|
||
.progress{
|
||
height: 100%;
|
||
background: #1777FF;
|
||
border-radius: 5px;
|
||
opacity: 0.9;
|
||
position: absolute;
|
||
top: 0;left: 0;
|
||
}
|
||
}
|
||
.number{
|
||
font-size: 28rpx;
|
||
font-family: PingFangSC-Regular, PingFang SC;
|
||
font-weight: 400;
|
||
color: #786B6C;
|
||
line-height: 40rpx;
|
||
}
|
||
}
|
||
}
|
||
}
|
||
}
|
||
.thisMonth,.thisYear{
|
||
width: 100%;
|
||
margin-top: 28px;
|
||
padding-bottom: 24px;
|
||
.titleTop{
|
||
display: flex;
|
||
align-items: center;
|
||
position: relative;
|
||
.title {
|
||
font-size: 32rpx;
|
||
font-family: PingFangSC-Semibold, PingFang SC;
|
||
font-weight: 600;
|
||
color: #160002;
|
||
line-height: 44rpx;
|
||
}
|
||
.question{
|
||
width: 16px;
|
||
height: 16px;
|
||
margin-left: 4px;
|
||
display: flex;
|
||
align-items: center;
|
||
image{
|
||
width: 100%;
|
||
height: 100%;
|
||
}
|
||
}
|
||
.titleTopNotice{
|
||
position: absolute;
|
||
padding: 12px;
|
||
left:35%;
|
||
width: 50vw;
|
||
background: #FFFFFF;
|
||
box-shadow: 0 10px 10px 0 rgba(22,0,2,0.1);
|
||
}
|
||
.meng{
|
||
width: 100vw;
|
||
height: 100vh;
|
||
position: fixed;
|
||
top: 0;left: 0;
|
||
}
|
||
}
|
||
.box {
|
||
width: 100%;
|
||
padding: 12px 16px;
|
||
box-sizing: border-box;
|
||
border-radius: 8px;
|
||
background: #f5f2f2;
|
||
margin-top: 12px;
|
||
.top {
|
||
width: 100%;
|
||
display: flex;
|
||
.big {
|
||
width: 40px;
|
||
height: 40px;
|
||
background: #ffffff;
|
||
border-radius: 8px;
|
||
border: 1px solid #ebebeb;
|
||
display: flex;
|
||
justify-content: center;
|
||
align-items: center;
|
||
margin-right: 8px;
|
||
.icon {
|
||
width: 20px;
|
||
height: 20px;
|
||
}
|
||
}
|
||
.text {
|
||
width: calc(100% - 60px);
|
||
padding: 2px 0;
|
||
.textTop{
|
||
display: flex;
|
||
align-items: center;
|
||
justify-content: space-between;
|
||
.left{
|
||
display: flex;
|
||
align-items: center;
|
||
.number {
|
||
font-size: 36rpx;
|
||
font-family: DINAlternate-Bold, DINAlternate;
|
||
font-weight: bold;
|
||
color: #150002;
|
||
line-height: 40rpx;
|
||
}
|
||
.desc{
|
||
display: flex;
|
||
align-items: center;
|
||
margin-left: 8px;
|
||
font-size: 14px;
|
||
color: #FF7043;
|
||
.success{
|
||
width: 20px;
|
||
height: 20px;
|
||
margin-right: 4px;
|
||
}
|
||
}
|
||
}
|
||
.right{
|
||
flex: 1;
|
||
display: flex;
|
||
justify-content: flex-end;
|
||
align-items: center;
|
||
.comparePlan{
|
||
font-size: 24rpx;
|
||
font-family: PingFangSC-Regular, PingFang SC;
|
||
font-weight: 400;
|
||
color: #a69e9f;
|
||
line-height: 36rpx;
|
||
white-space: nowrap;
|
||
}
|
||
.box2{
|
||
display: flex;
|
||
align-items: center;
|
||
.text{
|
||
font-size: 14px;
|
||
font-family: DINAlternate-Bold, DINAlternate;
|
||
color: #150002;
|
||
font-weight: bold;
|
||
|
||
line-height: 40rpx;
|
||
}
|
||
.addIcon {
|
||
width: 16px;
|
||
height: 16px;
|
||
margin-right: 2px;
|
||
}
|
||
}
|
||
}
|
||
}
|
||
|
||
.progressPlan{
|
||
width: 100%;
|
||
height: 8px;
|
||
border-radius: 5px;
|
||
background: #fff;
|
||
margin-top: 8px;
|
||
position: relative;
|
||
overflow: hidden;
|
||
.trans{
|
||
height: 8px;
|
||
position: absolute;
|
||
left: 0;top: 0;
|
||
border-top-right-radius: 4px;
|
||
border-bottom-right-radius: 4px;
|
||
background: url("https://eshangtech.com/ShopICO/ahyd-BID/index/progress_orange.png")no-repeat 100% 100%;
|
||
}
|
||
.transYear{
|
||
height: 8px;
|
||
position: absolute;
|
||
left: 0;top: 0;
|
||
border-top-right-radius: 4px;
|
||
border-bottom-right-radius: 4px;
|
||
background: url("https://eshangtech.com/ShopICO/ahyd-BID/index/progress_blue.png")no-repeat 100% 100%;
|
||
}
|
||
//.img{
|
||
// width: 100%;
|
||
// height: 100%;
|
||
// position: absolute;
|
||
// top: 0;
|
||
// left: 0;
|
||
// z-index:1;
|
||
//}
|
||
//.pro{
|
||
// height: 100%;
|
||
// position: absolute;
|
||
// top: 0;right: 0;
|
||
// background: #fff;
|
||
// z-index:2;
|
||
//}
|
||
|
||
}
|
||
}
|
||
}
|
||
.bottom {
|
||
display: flex;
|
||
margin-top: 16px;
|
||
padding-left: 48px;
|
||
.success {
|
||
.text {
|
||
font-size: 28rpx;
|
||
font-family: PingFangSC-Regular, PingFang SC;
|
||
font-weight: 400;
|
||
color: #786b6c;
|
||
line-height: 40rpx;
|
||
margin-bottom: 2px;
|
||
.unit {
|
||
font-size: 28rpx;
|
||
font-family: PingFangSC-Regular, PingFang SC;
|
||
font-weight: 400;
|
||
color: #a69e9f;
|
||
line-height: 40rpx;
|
||
margin-left: 2px;
|
||
}
|
||
}
|
||
.money {
|
||
font-size: 28rpx;
|
||
font-family: DINAlternate-Bold, DINAlternate;
|
||
font-weight: 600;
|
||
color: #160002;
|
||
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>
|