update
This commit is contained in:
parent
d977b6e328
commit
0003a55c0a
12
pages.json
12
pages.json
@ -132,6 +132,18 @@
|
||||
}
|
||||
]
|
||||
},
|
||||
{
|
||||
"root": "pages/revenueStatistics",
|
||||
"pages": [
|
||||
{
|
||||
"path": "index",
|
||||
"style": {
|
||||
"navigationBarTitleText": "",
|
||||
"navigationStyle": "custom"
|
||||
}
|
||||
}
|
||||
]
|
||||
},
|
||||
{
|
||||
"root": "pages/newamine",
|
||||
"pages": [
|
||||
|
||||
@ -4,7 +4,8 @@
|
||||
<commercial-type :have="3"/>
|
||||
</div>
|
||||
<header-top :bgUrl="bgUrl" :menu="menu" :bgColor="bgColor" :title="title" :analyseInfo="analyseInfo" :topBg="topBg" :page="page" :backType="backType"
|
||||
:serverpartName="serviceInfo.SERVERPART_NAME" :spregionTypeName="serviceInfo.SPREGIONTYPE_NAME" :serviceInfo="serviceInfo"/>
|
||||
:serverpartName="serviceInfo.SERVERPART_NAME" :spregionTypeName="serviceInfo.SPREGIONTYPE_NAME" :serviceInfo="serviceInfo"
|
||||
:topLeftBg="topLeftBg" :topLeftColor="topLeftColor" :iconObj="iconObj" :haveIconObj="haveIconObj" :detailBoxBg="detailBoxBg"/>
|
||||
|
||||
<div class="charts">
|
||||
<div class="chartsItem">
|
||||
@ -104,8 +105,22 @@ export default {
|
||||
labelList:['女性','高消费','喜爱奶茶','浙江','20-30岁','江苏'],//标签
|
||||
title:'交易画像',//页面标题
|
||||
bgColor:'180deg, #FFBA07 0%, #F38309 100%',
|
||||
bgUrl: 'https://eshangtech.com/ShopICO/ahyd-BID/commercial/businessPortraitBg.svg',//背景图片路径
|
||||
bgUrl: '/static/images/newCommercialBI/businessPortraitBg.svg',//背景图片路径
|
||||
page:'/pages/commercialBI/businessPortrait',
|
||||
|
||||
detailBoxBg:'linear-gradient(136deg, #F6F2E9 0%, #FFFFFF 100%);',
|
||||
topLeftBg:'linear-gradient(180deg, rgba(255, 186, 7, 0.2) 0%, rgba(243, 131, 9, 0.2) 100%)',// 类别背景
|
||||
topLeftColor:'#F38609',// 类别文字颜色
|
||||
iconObj:{
|
||||
car:'/static/images/newCommercialBI/businessCar.svg',
|
||||
charge:'/static/images/newCommercialBI/businessCharge.svg',
|
||||
bady:'/static/images/newCommercialBI/businessBady.svg',
|
||||
guestRoom:'/static/images/newCommercialBI/businessGuestRoom.svg'
|
||||
},
|
||||
haveIconObj:{
|
||||
have:'/static/images/newCommercialBI/businessHave.svg',
|
||||
noHave:'/static/images/newCommercialBI/businessNoHave.svg'
|
||||
},
|
||||
time: '',//跳转携带的时间
|
||||
menu: {},//手机配置信息
|
||||
transactionList:[],//交易分析数据
|
||||
|
||||
@ -2,10 +2,10 @@
|
||||
<div>
|
||||
<div style="position: fixed;right: 0;top: 15%;z-index:99999999999">
|
||||
<!-- 组件通过传入的have去判断组件在哪个页面 然后哪个页面的标志就不显示 -->
|
||||
<commercial-type :have="0"/>
|
||||
<commercial-type :have="0" :time="searchText"/>
|
||||
</div>
|
||||
<div class="main" v-if="isHaveData">
|
||||
<div v-if="!isShowAllProvince" class="header" :style="{backgroundImage: 'url('+ 'https://eshangtech.com/ShopICO/ahyd-BID/commercial/car.svg' +')'}">
|
||||
<div v-if="!isShowAllProvince" class="header" :style="{backgroundImage: 'url('+ '/static/images/newCommercialBI/car.svg' +')'}">
|
||||
<div class="analyse" v-if="analyseText">
|
||||
<text class="title">分析</text>
|
||||
<text class="content">{{analyseText}}</text>
|
||||
@ -33,13 +33,44 @@
|
||||
</view>
|
||||
</div>
|
||||
</div>
|
||||
<div class="other">
|
||||
<div class="label">
|
||||
<div v-for="(item,index) in labelList" :key="index" :class="index===0?'item0 item':index===1?'item1 item':index===2?'item2 item':index===3?'item3 item':index===4?'item4 item':'item'">
|
||||
{{item}}
|
||||
</div>
|
||||
</div>
|
||||
<!-- <div class="other">-->
|
||||
<!-- <div class="label">-->
|
||||
<!-- <div v-for="(item,index) in labelList" :key="index" :class="index===0?'item0 item':index===1?'item1 item':index===2?'item2 item':index===3?'item3 item':index===4?'item4 item':'item'">-->
|
||||
<!-- {{item}}-->
|
||||
<!-- </div>-->
|
||||
<!-- </div>-->
|
||||
<!-- </div>-->
|
||||
<div class="detailBox">
|
||||
<div class="detailTop">
|
||||
<div class="topLeft">A类</div>
|
||||
<div class="topRight">
|
||||
<span class="rightText">查看更多</span>
|
||||
<img class="moreIcon" src="https://eshangtech.com/ShopICO/ahyd-BID/commercial/rightArrow.svg"/>
|
||||
</div>
|
||||
</div>
|
||||
<div class="functionList">
|
||||
<div class="functionItem">
|
||||
<image class="haveFun" src="/static/images/newCommercialBI/carHave.svg"/>
|
||||
<image class="carIcon" src="/static/images/newCommercialBI/carCarIcon.svg"/>
|
||||
<text class="funText">司机之家</text>
|
||||
</div>
|
||||
<div class="functionItem">
|
||||
<image class="haveFun" src="/static/images/newCommercialBI/carHave.svg"/>
|
||||
<image class="carIcon" src="/static/images/newCommercialBI/carCharge.svg"/>
|
||||
<text class="funText">充电桩</text>
|
||||
</div>
|
||||
<div class="functionItem">
|
||||
<image class="haveFun" src="/static/images/newCommercialBI/carHave.svg"/>
|
||||
<image class="carIcon" src="/static/images/newCommercialBI/carBady.svg"/>
|
||||
<text class="funText">母婴室</text>
|
||||
</div>
|
||||
<div class="functionItem">
|
||||
<image class="haveFun" src="/static/images/newCommercialBI/carHave.svg"/>
|
||||
<image class="carIcon" src="/static/images/newCommercialBI/carGuestRoom.svg"/>
|
||||
<text class="funText">客房</text>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div v-if="isShowAllProvince" class="headerTop" >
|
||||
@ -1173,12 +1204,14 @@ export default {
|
||||
min-height: 100vh;
|
||||
.header{
|
||||
width: 100%;
|
||||
height: calc(1.056 * 100vw);
|
||||
height: 648rpx;
|
||||
//height: calc(1.056 * 100vw);
|
||||
padding: 0 16px;
|
||||
box-sizing: border-box;
|
||||
position: relative;
|
||||
background-repeat: no-repeat;
|
||||
background-size: cover;
|
||||
//background-size: cover;
|
||||
background-size: 100% 100%;
|
||||
.car{
|
||||
width: 100vw;
|
||||
height: 100%;
|
||||
@ -1369,6 +1402,70 @@ export default {
|
||||
height: 95px;
|
||||
}
|
||||
}
|
||||
.detailBox{
|
||||
width: 340rpx;
|
||||
height: 312rpx;
|
||||
background: linear-gradient(136deg, #F0F6FF 0%, #FFFFFF 100%);
|
||||
border-radius: 16rpx;
|
||||
margin-top: 32rpx;
|
||||
box-sizing: border-box;
|
||||
padding: 24rpx 32rpx;
|
||||
.detailTop{
|
||||
width: 100%;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: space-between;
|
||||
.topLeft{
|
||||
background: linear-gradient(180deg, rgba(49, 144, 255, 0.2) 0%, rgba(22, 87, 255, 0.2) 100%);
|
||||
border-radius: 8rpx;
|
||||
padding: 0 16rpx;
|
||||
font-size: 28rpx;
|
||||
font-family: PingFangSC, PingFang SC;
|
||||
font-weight: 400;
|
||||
color: #1E67FF;
|
||||
line-height: 40rpx;
|
||||
}
|
||||
.topRight{
|
||||
display: flex;
|
||||
align-items: center;
|
||||
.rightText{
|
||||
font-size: 28rpx;
|
||||
font-family: PingFangSC, PingFang SC;
|
||||
font-weight: 400;
|
||||
color: #A69E9F;
|
||||
line-height: 40rpx;
|
||||
}
|
||||
.moreIcon{
|
||||
width: 24rpx;
|
||||
height: 24rpx;
|
||||
}
|
||||
}
|
||||
}
|
||||
.functionList{
|
||||
.functionItem{
|
||||
margin-top: 16rpx;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
.haveFun{
|
||||
width: 32rpx;
|
||||
height: 32rpx;
|
||||
margin-right: 18rpx;
|
||||
}
|
||||
.carIcon{
|
||||
width: 32rpx;
|
||||
height: 32rpx;
|
||||
margin-right: 4rpx;
|
||||
}
|
||||
.funText{
|
||||
font-size: 28rpx;
|
||||
font-family: PingFangSC, PingFang SC;
|
||||
font-weight: 400;
|
||||
color: #6C737A;
|
||||
line-height: 40rpx;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
.headerTop{
|
||||
|
||||
@ -2,6 +2,7 @@
|
||||
<div class="typeBigList">
|
||||
<div class="item" v-for="(item,index) in showTypeList" :key="index" @click="handleGo(item.url)">
|
||||
<image class="icon" :src="item.img"/>
|
||||
<text class="text">{{item.text}}</text>
|
||||
</div>
|
||||
</div>
|
||||
</template>
|
||||
@ -13,11 +14,13 @@ export default {
|
||||
data(){
|
||||
return {
|
||||
typeList:[
|
||||
{img:'https://eshangtech.com/ShopICO/ahyd-BID/index/car.svg',url:'/pages/commercialBI/carPortrait'},
|
||||
{img:'https://eshangtech.com/ShopICO/ahyd-BID/index/guest.svg',url:'/pages/commercialBI/guestPortrait'},
|
||||
{img:'https://eshangtech.com/ShopICO/ahyd-BID/index/business_icon.svg',url:'/pages/commercialBI/managePortrait'},
|
||||
{img:'https://eshangtech.com/ShopICO/ahyd-BID/index/trade.svg',url:'/pages/commercialBI/businessPortrait'},
|
||||
{img:'https://eshangtech.com/ShopICO/ahyd-BID/index/brand.svg',url:'/pages/commercialBI/formatPortrait'},
|
||||
{img:'https://eshangtech.com/ShopICO/ahyd-BID/index/car.svg',url:'/pages/commercialBI/carPortrait',text:'车流'},
|
||||
{img:'https://eshangtech.com/ShopICO/ahyd-BID/index/guest.svg',url:'/pages/commercialBI/guestPortrait',text:'客群'},
|
||||
{img:'https://eshangtech.com/ShopICO/ahyd-BID/index/business_icon.svg',url:'/pages/commercialBI/managePortrait',text:'经营'},
|
||||
{img:'https://eshangtech.com/ShopICO/ahyd-BID/index/trade.svg',url:'/pages/commercialBI/businessPortrait',text:'交易'},
|
||||
{img:'https://eshangtech.com/ShopICO/ahyd-BID/index/brand.svg',url:'/pages/commercialBI/formatPortrait',text:'品牌'},
|
||||
{img:'/static/images/newCommercialBI/newExamineIcon.svg',url:`/pages/newamine/index?come=index&type=${1}&time=${this.time}`,text:'考核'},
|
||||
{img:'/static/images/newCommercialBI/inspectionIcon.svg',url:`/pages/newamine/index?come=index&type=${2}&time=${this.time}`,text:'巡检'},
|
||||
],
|
||||
showTypeList:[],
|
||||
selectIndex: 5,
|
||||
@ -28,6 +31,10 @@ export default {
|
||||
have:{
|
||||
type:Number,
|
||||
default:5
|
||||
},
|
||||
time:{
|
||||
type: String,
|
||||
default: ''
|
||||
}
|
||||
},
|
||||
watch:{
|
||||
@ -74,21 +81,30 @@ export default {
|
||||
.typeBigList{
|
||||
position: fixed;
|
||||
right: 0;
|
||||
top: 15%;
|
||||
top: 12%;
|
||||
.item{
|
||||
width: 45px;
|
||||
height: 40px;
|
||||
width: 150rpx;
|
||||
height: 80rpx;
|
||||
border-radius: 20px 0 0 20px;
|
||||
box-sizing: border-box;
|
||||
padding: 14rpx;
|
||||
background: rgba(255,255,255,0.8);
|
||||
display: flex;
|
||||
align-items: center;
|
||||
margin-bottom: 10px;
|
||||
border: 1px solid #ccc;
|
||||
.icon{
|
||||
width: 30px;
|
||||
height: 30px;
|
||||
width: 52.5rpx;
|
||||
height: 52.5rpx;
|
||||
border-radius: 50%;
|
||||
margin-left: 10px;
|
||||
margin-right: 10rpx;
|
||||
}
|
||||
.text{
|
||||
font-size: 24rpx;
|
||||
font-family: PingFangSC, PingFang SC;
|
||||
font-weight: 400;
|
||||
color: #786B6C;
|
||||
line-height: 36rpx;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
@ -24,17 +24,49 @@
|
||||
</view>
|
||||
</div>
|
||||
</div>
|
||||
<div class="label">
|
||||
<div :class="index===0?'labelItem labelItem0':index===1?'labelItem labelItem1':index===2?'labelItem labelItem2':index===3?'labelItem labelItem3':
|
||||
index===4?'labelItem labelItem4':index===5?'labelItem labelItem5':''" v-for="(item,index) in labelList" :key="index"
|
||||
:style="{background: 'linear-gradient('+bgColor+')'}"
|
||||
>{{ item }}</div>
|
||||
|
||||
<div class="detailBox" :style="{background: detailBoxBg}">
|
||||
<div class="detailTop">
|
||||
<div class="topLeft" :style="{background:topLeftBg,color:topLeftColor}">A类</div>
|
||||
<div class="topRight">
|
||||
<span class="rightText">查看更多</span>
|
||||
<img class="moreIcon" src="https://eshangtech.com/ShopICO/ahyd-BID/commercial/rightArrow.svg"/>
|
||||
</div>
|
||||
</div>
|
||||
<div class="functionList">
|
||||
<div class="functionItem">
|
||||
<image class="haveFun" :src="haveIconObj.have"/>
|
||||
<image class="carIcon" :src="iconObj.car"/>
|
||||
<text class="funText">司机之家</text>
|
||||
</div>
|
||||
<div class="functionItem">
|
||||
<image class="haveFun" :src="haveIconObj.have"/>
|
||||
<image class="carIcon" :src="iconObj.charge"/>
|
||||
<text class="funText">充电桩</text>
|
||||
</div>
|
||||
<div class="functionItem">
|
||||
<image class="haveFun" :src="haveIconObj.have"/>
|
||||
<image class="carIcon" :src="iconObj.bady"/>
|
||||
<text class="funText">母婴室</text>
|
||||
</div>
|
||||
<div class="functionItem">
|
||||
<image class="haveFun" :src="haveIconObj.have"/>
|
||||
<image class="carIcon" :src="iconObj.guestRoom"/>
|
||||
<text class="funText">客房</text>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<!-- <div class="label">-->
|
||||
<!-- <div :class="index===0?'labelItem labelItem0':index===1?'labelItem labelItem1':index===2?'labelItem labelItem2':index===3?'labelItem labelItem3':-->
|
||||
<!-- index===4?'labelItem labelItem4':index===5?'labelItem labelItem5':''" v-for="(item,index) in labelList" :key="index"-->
|
||||
<!-- :style="{background: 'linear-gradient('+bgColor+')'}"-->
|
||||
<!-- >{{ item }}</div>-->
|
||||
<!-- </div>-->
|
||||
</div>
|
||||
<div class="analyse" v-if="analyseText">
|
||||
<text class="title">分析</text>
|
||||
<text class="content">{{analyseText}}</text>
|
||||
</div>
|
||||
<!-- <div class="analyse" v-if="analyseText">-->
|
||||
<!-- <text class="title">分析</text>-->
|
||||
<!-- <text class="content">{{analyseText}}</text>-->
|
||||
<!-- </div>-->
|
||||
</div>
|
||||
</template>
|
||||
|
||||
@ -86,7 +118,35 @@ export default {
|
||||
analyseInfo:{
|
||||
type:Object,
|
||||
default:()=>{}
|
||||
}
|
||||
},
|
||||
iconObj:{
|
||||
type:Object,
|
||||
default:{
|
||||
car:'',
|
||||
charge:'',
|
||||
bady:'',
|
||||
guestRoom:''
|
||||
}
|
||||
},
|
||||
haveIconObj:{
|
||||
type:Object,
|
||||
default:{
|
||||
have:'',
|
||||
noHave:'',
|
||||
}
|
||||
},
|
||||
topLeftBg:{
|
||||
type:String,
|
||||
default:''
|
||||
},
|
||||
topLeftColor:{
|
||||
type:String,
|
||||
default:''
|
||||
},
|
||||
detailBoxBg:{
|
||||
type:String,
|
||||
default:''
|
||||
},
|
||||
},
|
||||
data() {
|
||||
return {
|
||||
@ -172,12 +232,14 @@ export default {
|
||||
<style scoped lang="scss">
|
||||
.header{
|
||||
width: 100%;
|
||||
height: calc(1.056 * 100vw);
|
||||
height: 648rpx;
|
||||
//height: calc(1.056 * 100vw);
|
||||
box-sizing: border-box;
|
||||
position: relative;
|
||||
padding: 0 16px;
|
||||
background-repeat: no-repeat;
|
||||
background-size: cover;
|
||||
//background-size: cover;
|
||||
background-size: 100% 100%;
|
||||
.headerTop{
|
||||
width: 100vw;
|
||||
position: fixed;
|
||||
@ -271,6 +333,69 @@ export default {
|
||||
}
|
||||
}
|
||||
}
|
||||
.detailBox{
|
||||
width: 340rpx;
|
||||
height: 312rpx;
|
||||
border-radius: 16rpx;
|
||||
margin-top: 32rpx;
|
||||
box-sizing: border-box;
|
||||
padding: 24rpx 32rpx;
|
||||
.detailTop{
|
||||
width: 100%;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: space-between;
|
||||
.topLeft{
|
||||
background: linear-gradient(180deg, rgba(49, 144, 255, 0.2) 0%, rgba(22, 87, 255, 0.2) 100%);
|
||||
border-radius: 8rpx;
|
||||
padding: 0 16rpx;
|
||||
font-size: 28rpx;
|
||||
font-family: PingFangSC, PingFang SC;
|
||||
font-weight: 400;
|
||||
color: #1E67FF;
|
||||
line-height: 40rpx;
|
||||
}
|
||||
.topRight{
|
||||
display: flex;
|
||||
align-items: center;
|
||||
.rightText{
|
||||
font-size: 28rpx;
|
||||
font-family: PingFangSC, PingFang SC;
|
||||
font-weight: 400;
|
||||
color: #A69E9F;
|
||||
line-height: 40rpx;
|
||||
}
|
||||
.moreIcon{
|
||||
width: 24rpx;
|
||||
height: 24rpx;
|
||||
}
|
||||
}
|
||||
}
|
||||
.functionList{
|
||||
.functionItem{
|
||||
margin-top: 16rpx;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
.haveFun{
|
||||
width: 32rpx;
|
||||
height: 32rpx;
|
||||
margin-right: 18rpx;
|
||||
}
|
||||
.carIcon{
|
||||
width: 32rpx;
|
||||
height: 32rpx;
|
||||
margin-right: 4rpx;
|
||||
}
|
||||
.funText{
|
||||
font-size: 28rpx;
|
||||
font-family: PingFangSC, PingFang SC;
|
||||
font-weight: 400;
|
||||
color: #6C737A;
|
||||
line-height: 40rpx;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
.label{
|
||||
width: calc(60% + 20px);
|
||||
height: 127px;
|
||||
|
||||
@ -4,7 +4,8 @@
|
||||
<commercial-type :have="1"/>
|
||||
</div>
|
||||
<header-top :bgUrl="bgUrl" :menu="menu" :topBg="topBg" :bgColor="bgColor" :title="title" :page="page" :backType="backType" :analyseInfo="analyseInfo"
|
||||
:serverpartName="serviceInfo.SERVERPART_NAME" :spregionTypeName="serviceInfo.SPREGIONTYPE_NAME" :serviceInfo="serviceInfo"/>
|
||||
:serverpartName="serviceInfo.SERVERPART_NAME" :spregionTypeName="serviceInfo.SPREGIONTYPE_NAME" :serviceInfo="serviceInfo"
|
||||
:topLeftBg="topLeftBg" :topLeftColor="topLeftColor" :iconObj="iconObj" :haveIconObj="haveIconObj" :detailBoxBg="detailBoxBg"/>
|
||||
|
||||
<div class="charts">
|
||||
<div class="chartsItem">
|
||||
@ -84,8 +85,23 @@ export default {
|
||||
topBg:'linear-gradient(180deg, #A1D0C1 0%, #B1D9CD 100%);',//顶部组件的悬浮背景色
|
||||
title:'客群画像',//页面标题
|
||||
bgColor:'180deg, #30C8ED 0%, #0B9353 100%',//标签背景颜色
|
||||
bgUrl:'https://eshangtech.com/ShopICO/ahyd-BID/commercial/guestPortraitBg.svg',//背景图片路径
|
||||
bgUrl:'/static/images/newCommercialBI/guestPortraitBg.svg',//背景图片路径
|
||||
page:'/pages/commercialBI/guestPortrait',
|
||||
|
||||
|
||||
detailBoxBg:'linear-gradient(136deg, #ECF6F6 0%, #FFFFFF 100%);',
|
||||
topLeftBg:'linear-gradient(180deg, rgba(48, 200, 237, 0.2) 0%, rgba(11, 147, 83, 0.2) 100%)',// 类别背景
|
||||
topLeftColor:'#0E9760',// 类别文字颜色
|
||||
iconObj:{
|
||||
car:'/static/images/newCommercialBI/carGuest.svg',
|
||||
charge:'/static/images/newCommercialBI/chargeGuest.svg',
|
||||
bady:'/static/images/newCommercialBI/badyGuest.svg',
|
||||
guestRoom:'/static/images/newCommercialBI/guestRoomGuest.svg'
|
||||
},
|
||||
haveIconObj:{
|
||||
have:'/static/images/newCommercialBI/haveGuest.svg',
|
||||
noHave:'/static/images/newCommercialBI/noHaveGuest.svg'
|
||||
},
|
||||
time:'',//跳转携带的时间
|
||||
menu:{},//手机配置信息
|
||||
customer:{}, // 客群分析第一个
|
||||
|
||||
@ -4,7 +4,8 @@
|
||||
<commercial-type :have="2"/>
|
||||
</div>
|
||||
<header-top :bgUrl="bgUrl" :menu="menu" :bgColor="bgColor" :title="title" :analyseInfo="analyseInfo" :topBg="topBg" :page="page" :backType="backType"
|
||||
:serverpartName="serviceInfo.SERVERPART_NAME" :spregionTypeName="serviceInfo.SPREGIONTYPE_NAME" :serviceInfo="serviceInfo"/>
|
||||
:serverpartName="serviceInfo.SERVERPART_NAME" :spregionTypeName="serviceInfo.SPREGIONTYPE_NAME" :serviceInfo="serviceInfo"
|
||||
:topLeftBg="topLeftBg" :topLeftColor="topLeftColor" :iconObj="iconObj" :haveIconObj="haveIconObj" :detailBoxBg="detailBoxBg"/>
|
||||
|
||||
<div class="charts">
|
||||
<div class="chartsItem">
|
||||
@ -205,8 +206,21 @@ export default {
|
||||
selectTab:0,//当前选中
|
||||
title:'经营画像',//页面标题
|
||||
bgColor: '180deg, #996CFF 0%, #5D43F8 100%',
|
||||
bgUrl: 'https://eshangtech.com/ShopICO/ahyd-BID/commercial/managePortraitBg.svg',//背景图片路径
|
||||
bgUrl: '/static/images/newCommercialBI/managePortraitBg.svg',//背景图片路径
|
||||
page:'/pages/commercialBI/managePortrait',
|
||||
detailBoxBg:'linear-gradient(136deg, #F3EFFE 0%, #FFFFFF 100%);',
|
||||
topLeftBg:'linear-gradient(180deg, rgba(153, 108, 255, 0.2) 0%, rgba(93, 67, 248, 0.2) 100%)',// 类别背景
|
||||
topLeftColor:'#6347F9',// 类别文字颜色
|
||||
iconObj:{
|
||||
car:'/static/images/newCommercialBI/carPortrait.svg',
|
||||
charge:'/static/images/newCommercialBI/chargePortraitBg.svg',
|
||||
bady:'/static/images/newCommercialBI/babyPortrait.svg',
|
||||
guestRoom:'/static/images/newCommercialBI/guestRoomPortrait.svg'
|
||||
},
|
||||
haveIconObj:{
|
||||
have:'/static/images/newCommercialBI/havePortrait.svg',
|
||||
noHave:'/static/images/newCommercialBI/noHavePortrait.svg'
|
||||
},
|
||||
time: '',//跳转携带的时间
|
||||
menu: {},//手机配置信息
|
||||
revenueList:[],//营收分析
|
||||
|
||||
@ -1,11 +1,122 @@
|
||||
<script setup>
|
||||
|
||||
</script>
|
||||
|
||||
<template>
|
||||
$END$
|
||||
<view class="rateMain">
|
||||
<image v-if="preferPath" style="width: 144rpx;height: 144rpx" :src="preferPath"></image>
|
||||
<canvas style="width: 144rpx;height: 144rpx;position:fixed;left: 100%" canvas-id="rate" id="rate"/>
|
||||
</view>
|
||||
</template>
|
||||
|
||||
<style scoped>
|
||||
<script>
|
||||
import uCharts from '@/components/u-charts.js';
|
||||
var uChartsInstance = {};
|
||||
export default {
|
||||
name: "rateCharts",
|
||||
data(){
|
||||
return {
|
||||
preferPath:'',
|
||||
}
|
||||
},
|
||||
props:{
|
||||
success:{
|
||||
type: Array,
|
||||
default:[]
|
||||
},
|
||||
colorList:{
|
||||
type: Array,
|
||||
default:[]
|
||||
}
|
||||
},
|
||||
watch:{
|
||||
success:{
|
||||
handler(value){
|
||||
this.preferPath = ''
|
||||
let sum = value[0] + value[1]
|
||||
let firstRate = Number(((value[0] / sum)*100).toFixed(2))
|
||||
let secondRate = 100 - Number(firstRate)
|
||||
let res = {
|
||||
series:[{
|
||||
data:[{name:'驿站营收',value:firstRate},{name:'未完成',value:secondRate}]
|
||||
}]
|
||||
}
|
||||
this.drawCharts('rate',res)
|
||||
},
|
||||
}
|
||||
},
|
||||
methods:{
|
||||
drawCharts(id,data){
|
||||
const ctx = uni.createCanvasContext(id, this);
|
||||
let _this = this
|
||||
uChartsInstance[id] = new uCharts({
|
||||
type: "ring",
|
||||
context: ctx,
|
||||
width: 72,
|
||||
height: 72,
|
||||
series: data.series,
|
||||
animation: false,
|
||||
rotate: false,
|
||||
rotateLock: false,
|
||||
background: "#FFFFFF",
|
||||
color: _this.colorList,
|
||||
padding: [5,5,5,5],
|
||||
dataLabel: false,
|
||||
enableScroll: false,
|
||||
legend: {
|
||||
show: false,
|
||||
position: "right",
|
||||
lineHeight: 25
|
||||
},
|
||||
title: {
|
||||
name: '分润占比',
|
||||
fontSize: 10,
|
||||
color: "#A69E9F"
|
||||
},
|
||||
extra: {
|
||||
ring: {
|
||||
ringWidth: 10,
|
||||
activeOpacity: 0.5,
|
||||
activeRadius: 10,
|
||||
offsetAngle: -90,
|
||||
labelWidth: 15,
|
||||
border: false,
|
||||
borderWidth: 3,
|
||||
customRadius:34,
|
||||
borderColor: "#FFFFFF"
|
||||
}
|
||||
}
|
||||
});
|
||||
setTimeout( ()=>{
|
||||
this.canvasToTempImage('rate')
|
||||
},500)
|
||||
},
|
||||
canvasToTempImage(id){
|
||||
uni.canvasToTempFilePath({
|
||||
canvasId:id,
|
||||
complete:(res)=>{
|
||||
if (res.tempFilePath){
|
||||
uni.getFileSystemManager().readFile({
|
||||
filePath: res.tempFilePath,
|
||||
encoding: 'base64',
|
||||
success: res => {
|
||||
let base64 = 'data:image/png;base64,' + res.data;
|
||||
this.preferPath = base64
|
||||
}
|
||||
})
|
||||
}
|
||||
}
|
||||
},this)
|
||||
},
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style lang="scss" scoped>
|
||||
.rateMain{
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
.month{
|
||||
width: 136rpx;
|
||||
height: 136rpx;
|
||||
position: fixed;
|
||||
left: 100%;
|
||||
}
|
||||
}
|
||||
</style>
|
||||
|
||||
@ -26,15 +26,17 @@
|
||||
|
||||
<!-- ,height:loadMore?'200px':'38px'-->
|
||||
<div class="storeDetail" :style="{ top: menu.bottom + 13 + 'px',left:0 + 'px'}">
|
||||
<swiper class="detailBox" previous-margin="40rpx" next-margin="20rpx" :style="{height: loadMore?`1030rpx`:`508rpx`}" @change="handleChangeSelect" :current="selectDetail">
|
||||
<swiper class="detailBox" previous-margin="40rpx" next-margin="20rpx" :style="{height: loadMore?`1290rpx`:`770rpx`}" @change="handleChangeSelect" :current="selectDetail">
|
||||
<block v-for="(item,index) in nowMonth" :key="index">
|
||||
<swiper-item :item-id="index" :data-item-id="index" :class="selectMonth===index+1?'detailItemBox':'noSelectItemBox'">
|
||||
<view class="box" :style="{height: loadMore?selectMonth===index+1 ?`1030rpx`:'230px':selectMonth===index+1?`508rpx`:'230px',background:0<=index && index<=2?'#FEB39F':3<=index && index<=5?'#8AC9EA':6<=index && index<=8?'#93B2EF':'#DDB795'}">
|
||||
<view class="box" :style="{height: loadMore?selectMonth===index+1 ?`1290rpx`:'770rpx':selectMonth===index+1?`770rpx`:'456rpx',background:0<=index && index<=2?'#FEB39F':3<=index && index<=5?'#8AC9EA':6<=index && index<=8?'#93B2EF':'#DDB795'}">
|
||||
<view class="top" :style="{background:0<=index && index<=2?'linear-gradient(135deg, #FFE5CA 0%, #FFFFFF 29%, #FFFFFF 69%, #FFDCD5 100%)':3<=index && index<=5?'linear-gradient(135deg, #D4F7FF 0%, #FFFFFF 29%, #FFFFFF 69%, #CEECFF 100%)':6<=index && index<=8?'linear-gradient(135deg, #D5E8FF 0%, #FFFFFF 29%, #FFFFFF 69%, #D3E0FF 100%)':'linear-gradient(135deg, #FEEBD1 0%, #FFFFFF 29%, #FFFFFF 69%, #FFE7D4 100%)'}">
|
||||
<view class="statistics">
|
||||
<image class="staticImg" :src="1<=selectMonth && selectMonth<=3?'https://eshangtech.com/ShopICO/ahyd-BID/newIndex/1stStaticIcon.svg':4<=selectMonth && selectMonth<=6?'https://eshangtech.com/ShopICO/ahyd-BID/newIndex/2stStaticIcon.svg':7<=selectMonth && selectMonth<=9?'https://eshangtech.com/ShopICO/ahyd-BID/newIndex/3stStaticIcon.svg':'https://eshangtech.com/ShopICO/ahyd-BID/newIndex/4stStaticIcon.svg'"/>
|
||||
<text class="staticTitle">营收统计</text>
|
||||
<image class="staticIcon" :src="1<=selectMonth && selectMonth<=3?'https://eshangtech.com/ShopICO/ahyd-BID/newIndex/1stStaticMore.svg':4<=selectMonth && selectMonth<=6?'https://eshangtech.com/ShopICO/ahyd-BID/newIndex/2stStaticMore.svg':7<=selectMonth && selectMonth<=9?'https://eshangtech.com/ShopICO/ahyd-BID/newIndex/3stStaticMore.svg':'https://eshangtech.com/ShopICO/ahyd-BID/newIndex/4stStaticMore.svg'"/>
|
||||
<view style="display: inline-block" @click="goToRevenueStatic">
|
||||
<view class="statistics">
|
||||
<image class="staticImg" :src="1<=selectMonth && selectMonth<=3?'https://eshangtech.com/ShopICO/ahyd-BID/newIndex/1stStaticIcon.svg':4<=selectMonth && selectMonth<=6?'https://eshangtech.com/ShopICO/ahyd-BID/newIndex/2stStaticIcon.svg':7<=selectMonth && selectMonth<=9?'https://eshangtech.com/ShopICO/ahyd-BID/newIndex/3stStaticIcon.svg':'https://eshangtech.com/ShopICO/ahyd-BID/newIndex/4stStaticIcon.svg'"/>
|
||||
<text class="staticTitle">营收统计</text>
|
||||
<image class="staticIcon" :src="1<=selectMonth && selectMonth<=3?'https://eshangtech.com/ShopICO/ahyd-BID/newIndex/1stStaticMore.svg':4<=selectMonth && selectMonth<=6?'https://eshangtech.com/ShopICO/ahyd-BID/newIndex/2stStaticMore.svg':7<=selectMonth && selectMonth<=9?'https://eshangtech.com/ShopICO/ahyd-BID/newIndex/3stStaticMore.svg':'https://eshangtech.com/ShopICO/ahyd-BID/newIndex/4stStaticMore.svg'"/>
|
||||
</view>
|
||||
</view>
|
||||
<view class="revenueBox" v-show="selectMonth===index+1">
|
||||
<view class="revenueTop">
|
||||
@ -59,43 +61,61 @@
|
||||
<text class="rightNav">同比</text>
|
||||
</view>
|
||||
|
||||
<view class="progress" @click="handleShowHaveNoticeBox" :style="{background:1<=selectMonth && selectMonth<=3?'#FFAB30':4<=selectMonth && selectMonth<=6?'#5DC1E0':7<=selectMonth && selectMonth<=9?'#7CADF8':'#DCA858'}">
|
||||
<view class="have" :style="{width:progressObj.owner+'%',background:1<=selectMonth && selectMonth<=3?'#DB573B':4<=selectMonth && selectMonth<=6?'#137BBD':7<=selectMonth && selectMonth<=9?'#3663CB':'#A66A37'}"></view>
|
||||
<view class="haveNoticeBox" v-if="showHaveNotice" @click.stop="handleShowHaveNoticeBox">
|
||||
<text class="label">自营:<text class="value">{{progressObj.owner}}%,</text></text>
|
||||
<text class="label">外租:<text class="value">{{progressObj.other}}%</text></text>
|
||||
<view class="newBox">
|
||||
<view class="progress" @click="handleShowHaveNoticeBox" :style="{background:1<=selectMonth && selectMonth<=3?'#FFAB30':4<=selectMonth && selectMonth<=6?'#5DC1E0':7<=selectMonth && selectMonth<=9?'#7CADF8':'#DCA858'}">
|
||||
<view class="have" :style="{width:progressObj.owner+'%',background:1<=selectMonth && selectMonth<=3?'#DB573B':4<=selectMonth && selectMonth<=6?'#137BBD':7<=selectMonth && selectMonth<=9?'#3663CB':'#A66A37'}"></view>
|
||||
<view class="haveNoticeBox" v-if="showHaveNotice" @click.stop="handleShowHaveNoticeBox">
|
||||
<text class="label">自营:<text class="value">{{progressObj.owner}}%,</text></text>
|
||||
<text class="label">外租:<text class="value">{{progressObj.other}}%</text></text>
|
||||
</view>
|
||||
|
||||
</view>
|
||||
|
||||
</view>
|
||||
|
||||
<view class="message">
|
||||
<view class="smallDetailItem" style="margin-right: 14px">
|
||||
<view class="messageTop">
|
||||
<view class="type" :style="{background:1<=selectMonth && selectMonth<=3?'#DB573B':4<=selectMonth && selectMonth<=6?'#137BBD':7<=selectMonth && selectMonth<=9?'#3663CB':'#A66A37'}"></view>
|
||||
<text class="typeTitle">自营收入<text class="unit">/万元</text></text>
|
||||
<view class="message">
|
||||
<view class="smallDetailItem" style="margin-right: 14px">
|
||||
<view class="messageTop">
|
||||
<view class="type" :style="{background:1<=selectMonth && selectMonth<=3?'#DB573B':4<=selectMonth && selectMonth<=6?'#137BBD':7<=selectMonth && selectMonth<=9?'#3663CB':'#A66A37'}"></view>
|
||||
<text class="typeTitle">自营收入<text class="unit">/万元</text></text>
|
||||
</view>
|
||||
<view class="middle" v-if="monthAdd">
|
||||
<text class="money">{{typeList[0].showValue?$util.fmoney(typeList[0].showValue,2):''}}</text>
|
||||
<view class="addItem">{{monthAdd || ''}}%</view>
|
||||
</view>
|
||||
<view class="messageBottom" v-if="typeList && typeList[0].add">
|
||||
<text class="addText">{{typeList[0].add?typeList[0].add:''}}</text>
|
||||
<text class="addType">同比</text>
|
||||
</view>
|
||||
</view>
|
||||
<view class="middle" v-if="monthAdd">
|
||||
<text class="money">{{typeList[0].showValue?$util.fmoney(typeList[0].showValue,2):''}}</text>
|
||||
<view class="addItem">{{monthAdd || ''}}%</view>
|
||||
</view>
|
||||
<view class="messageBottom" v-if="typeList && typeList[0].add">
|
||||
<text class="addText">{{typeList[0].add?typeList[0].add:''}}</text>
|
||||
<text class="addType">同比</text>
|
||||
|
||||
<view class="smallDetailItem">
|
||||
<view class="messageTop">
|
||||
<view class="type" :style="{background:1<=selectMonth && selectMonth<=3?'#FFAB30':4<=selectMonth && selectMonth<=6?'#5DC1E0':7<=selectMonth && selectMonth<=9?'#7CADF8':'#DCA858'}"></view>
|
||||
<text class="typeTitle">外租收入<text class="unit">/万元</text></text>
|
||||
</view>
|
||||
<view class="middle">
|
||||
<text class="money">{{typeList[1].showValue?$util.fmoney(typeList[1].showValue,2):''}}</text>
|
||||
<!-- <view class="addItem">+13.18%</view>-->
|
||||
</view>
|
||||
<view class="messageBottom" v-if="typeList && typeList[1].add">
|
||||
<text class="addText">{{typeList[1].add?typeList[1].add:''}}</text>
|
||||
<text class="addType">同比</text>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
|
||||
<view class="smallDetailItem">
|
||||
<view class="messageTop">
|
||||
<view class="type" :style="{background:1<=selectMonth && selectMonth<=3?'#FFAB30':4<=selectMonth && selectMonth<=6?'#5DC1E0':7<=selectMonth && selectMonth<=9?'#7CADF8':'#DCA858'}"></view>
|
||||
<text class="typeTitle">外租收入<text class="unit">/万元</text></text>
|
||||
<view class="moneyRate">
|
||||
<view class="leftBox">
|
||||
<rateCharts :success="moneyRateList" :colorList="['#A66A37','#DCA858']"/>
|
||||
</view>
|
||||
<view class="middle">
|
||||
<text class="money">{{typeList[1].showValue?$util.fmoney(typeList[1].showValue,2):''}}</text>
|
||||
<!-- <view class="addItem">+13.18%</view>-->
|
||||
</view>
|
||||
<view class="messageBottom" v-if="typeList && typeList[1].add">
|
||||
<text class="addText">{{typeList[1].add?typeList[1].add:''}}</text>
|
||||
<text class="addType">同比</text>
|
||||
<view class="rightBox">
|
||||
<view class="noticeItem">
|
||||
<view class="noticeTop"></view>
|
||||
<view class="noticeText">驿站营收<span class="noticeSmallText">/万元</span></view>
|
||||
<view class="noticeMoney">3,512.54</view>
|
||||
</view>
|
||||
<view class="noticeItem">
|
||||
<view class="noticeTop" style="background: #DCA858"></view>
|
||||
<view class="noticeText">商家营收<span class="noticeSmallText">/万元</span></view>
|
||||
<view class="noticeMoney">2,615.68</view>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
@ -123,40 +143,40 @@
|
||||
<text class="rightNav">同比</text>
|
||||
</view>
|
||||
|
||||
<view class="progress" :style="{background:1<=selectMonth && selectMonth<=3?'#FFAB30':4<=selectMonth && selectMonth<=6?'#5DC1E0':7<=selectMonth && selectMonth<=9?'#7CADF8':'#DCA858'}">
|
||||
<view class="have" :style="{background:1<=selectMonth && selectMonth<=3?'#DB573B':4<=selectMonth && selectMonth<=6?'#137BBD':7<=selectMonth && selectMonth<=9?'#3663CB':'#A66A37'}"></view>
|
||||
</view>
|
||||
|
||||
<view class="message">
|
||||
<view class="smallDetailItem" style="margin-right: 14px">
|
||||
<view class="messageTop">
|
||||
<view class="type" :style="{background:1<=selectMonth && selectMonth<=3?'#DB573B':4<=selectMonth && selectMonth<=6?'#137BBD':7<=selectMonth && selectMonth<=9?'#3663CB':'#A66A37'}"></view>
|
||||
<text class="typeTitle">自营收入<text class="unit">/万元</text></text>
|
||||
</view>
|
||||
<view class="middle">
|
||||
<text class="money">-</text>
|
||||
<view class="addItem">-</view>
|
||||
</view>
|
||||
<view class="messageBottom">
|
||||
<text class="addText">-</text>
|
||||
<text class="addType">同比</text>
|
||||
</view>
|
||||
<view class="progress" :style="{background:1<=selectMonth && selectMonth<=3?'#FFAB30':4<=selectMonth && selectMonth<=6?'#5DC1E0':7<=selectMonth && selectMonth<=9?'#7CADF8':'#DCA858'}">
|
||||
<view class="have" :style="{background:1<=selectMonth && selectMonth<=3?'#DB573B':4<=selectMonth && selectMonth<=6?'#137BBD':7<=selectMonth && selectMonth<=9?'#3663CB':'#A66A37'}"></view>
|
||||
</view>
|
||||
|
||||
<view class="smallDetailItem">
|
||||
<view class="messageTop">
|
||||
<view class="type" :style="{background:1<=selectMonth && selectMonth<=3?'#FFAB30':4<=selectMonth && selectMonth<=6?'#5DC1E0':7<=selectMonth && selectMonth<=9?'#7CADF8':'#DCA858'}"></view>
|
||||
<text class="typeTitle">外租收入<text class="unit">/万元</text></text>
|
||||
<view class="message">
|
||||
<view class="smallDetailItem" style="margin-right: 14px">
|
||||
<view class="messageTop">
|
||||
<view class="type" :style="{background:1<=selectMonth && selectMonth<=3?'#DB573B':4<=selectMonth && selectMonth<=6?'#137BBD':7<=selectMonth && selectMonth<=9?'#3663CB':'#A66A37'}"></view>
|
||||
<text class="typeTitle">自营收入<text class="unit">/万元</text></text>
|
||||
</view>
|
||||
<view class="middle">
|
||||
<text class="money">-</text>
|
||||
<view class="addItem">-</view>
|
||||
</view>
|
||||
<view class="messageBottom">
|
||||
<text class="addText">-</text>
|
||||
<text class="addType">同比</text>
|
||||
</view>
|
||||
</view>
|
||||
<view class="middle">
|
||||
<text class="money">-</text>
|
||||
<!-- <view class="addItem">+13.18%</view>-->
|
||||
|
||||
<view class="smallDetailItem">
|
||||
<view class="messageTop">
|
||||
<view class="type" :style="{background:1<=selectMonth && selectMonth<=3?'#FFAB30':4<=selectMonth && selectMonth<=6?'#5DC1E0':7<=selectMonth && selectMonth<=9?'#7CADF8':'#DCA858'}"></view>
|
||||
<text class="typeTitle">外租收入<text class="unit">/万元</text></text>
|
||||
</view>
|
||||
<view class="middle">
|
||||
<text class="money">-</text>
|
||||
<!-- <view class="addItem">+13.18%</view>-->
|
||||
</view>
|
||||
<view class="messageBottom">
|
||||
<text class="addText">-</text>
|
||||
<text class="addType">同比</text>
|
||||
</view>
|
||||
</view>
|
||||
<view class="messageBottom">
|
||||
<text class="addText">-</text>
|
||||
<text class="addType">同比</text>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
@ -335,37 +355,59 @@
|
||||
<!-- </view>-->
|
||||
</view>
|
||||
<view class="timeBox">
|
||||
<image class="timeIcon" src="https://eshangtech.com/ShopICO/ahyd-BID/newIndex/1stTimeIcon.svg"/>
|
||||
<image class="timeIcon" src="/static/images/newIndex2/1stTypeImg.svg"/>
|
||||
<!-- v-show="selectMonth===nowMonth"-->
|
||||
<text class="timeText" >{{lastDay}}</text>
|
||||
</view>
|
||||
<image class="typeImg" src="https://eshangtech.com/ShopICO/ahyd-BID/newIndex/1stTypeImg.svg"/>
|
||||
</view>
|
||||
|
||||
<view class="report" @click="handleGoOperate">
|
||||
<text class="reportTitle">经营报表</text>
|
||||
<image class="timeIcon" src="https://eshangtech.com/ShopICO/ahyd-BID/newIndex/2stTimeIcon.svg"/>
|
||||
<image class="typeImg" src="https://eshangtech.com/ShopICO/ahyd-BID/newIndex/2stTypeImg.svg"/>
|
||||
<view class="report" >
|
||||
<text class="reportTitle">服务区信息</text>
|
||||
<image class="timeIcon" src="/static/images/newIndex2/2stTypeImg.svg"/>
|
||||
<image class="typeImg" src="/static/images/newIndex2/serviceCar.svg"/>
|
||||
</view>
|
||||
|
||||
|
||||
</view>
|
||||
|
||||
<view class="secondView">
|
||||
<view class="funItemView" @click="changeShowPortrait" style="margin-right: 9px;background-image: url('https://eshangtech.com/ShopICO/ahyd-BID/newIndex/funThird.svg')">
|
||||
<text class="funItemTitle" style="color: #287D66;">数智统计</text>
|
||||
<image class="timeIcon" src="https://eshangtech.com/ShopICO/ahyd-BID/newIndex/3stTimeIcon.svg"/>
|
||||
|
||||
<view class="funItemView" @click="handleGoOperate" style="background: url('/static/images/newIndex2/newRevenueBg.svg')">
|
||||
<text class="funItemTitle" style="color: #0086C6;">经营报表</text>
|
||||
<image class="timeIcon" src="/static/images/newIndex2/3stTypeImg.svg"/>
|
||||
<image class="typeImg" src="https://eshangtech.com/ShopICO/ahyd-BID/newIndex/3stTypeImg.svg"/>
|
||||
</view>
|
||||
<view class="funItemView" @click="handleFestival" style="margin-right: 9px;background-image: url('https://eshangtech.com/ShopICO/ahyd-BID/newIndex/funFourth.svg')">
|
||||
<text class="funItemTitle" style="color: #D25E00;">经营品牌库</text>
|
||||
<image class="timeIcon" src="https://eshangtech.com/ShopICO/ahyd-BID/newIndex/4stTimeIcon.svg"/>
|
||||
<image class="typeImg" src="https://eshangtech.com/ShopICO/ahyd-BID/newIndex/4stTypeImg.svg"/>
|
||||
<view class="funItemView" @click="handleFestival" style="margin-right: 9px;background-image: url('/static/images/newIndex2/brandHouse.svg')">
|
||||
<text class="funItemTitle" style="color: #3F66DA;">经营品牌库</text>
|
||||
<image class="timeIcon" src="/static/images/newIndex2/4stTypeImg.svg"/>
|
||||
<image class="typeImg" src="https://eshangtech.com/ShopICO/ahyd-BID/newIndex/2stTypeImg.svg"/>
|
||||
|
||||
<!-- <image class="typeImg" src="https://eshangtech.com/ShopICO/ahyd-BID/newIndex/4stTypeImg.svg"/>-->
|
||||
</view>
|
||||
<view class="funItemView" style="background-image: url('https://eshangtech.com/ShopICO/ahyd-BID/newIndex/funFifth.svg')" @click="handleMoney">
|
||||
<text class="funItemTitle" style="color: #7C46CD;">财务报表</text>
|
||||
<image class="timeIcon" src="https://eshangtech.com/ShopICO/ahyd-BID/newIndex/5stTimeIcon.svg"/>
|
||||
<image class="timeIcon" src="/static/images/newIndex2/5stTypeImg.svg"/>
|
||||
<image class="typeImg" src="https://eshangtech.com/ShopICO/ahyd-BID/newIndex/5stTypeImg.svg"/>
|
||||
</view>
|
||||
</view>
|
||||
<view class="secondView" style="margin-top: 18rpx">
|
||||
<view class="funItemView" @click="changeShowPortrait" style="margin-right: 9px;background-image: url('/static/images/newIndex2/statisticsBg.svg')">
|
||||
<text class="funItemTitle" style="color: #287D66;">数智统计</text>
|
||||
<image class="timeIcon" src="/static/images/newIndex2/6stTypeImg.svg"/>
|
||||
<image class="typeImg" src="/static/images/newIndex2/computer.svg"/>
|
||||
</view>
|
||||
<view class="funItemView" @click="handleGoExamine(1)" style="margin-right: 9px;background-image: url('/static/images/newIndex2/sceneBg.svg')">
|
||||
<text class="funItemTitle" style="color: #EA7E28;">现场管理</text>
|
||||
<image class="timeIcon" src="/static/images/newIndex2/7stTypeImg.svg"/>
|
||||
<image class="typeImg" src="/static/images/newIndex2/officeBag.svg"/>
|
||||
</view>
|
||||
<view class="funItemView" @click="goToNational" style="background-image: url('/static/images/newIndex2/newFestivalBg.svg')">
|
||||
<text class="funItemTitle" style="color: #F15454;">节日特刊</text>
|
||||
<image class="timeIcon" src="/static/images/newIndex2/8stTypeImg.svg"/>
|
||||
<image class="typeImg" src="/static/images/newIndex2/festivalPage.svg"/>
|
||||
</view>
|
||||
</view>
|
||||
|
||||
</view>
|
||||
<!-- 四个画像-->
|
||||
@ -418,71 +460,41 @@
|
||||
</div>
|
||||
</div>
|
||||
</view>
|
||||
|
||||
|
||||
|
||||
<!-- 营收占比-->
|
||||
<view class="proportion">
|
||||
<view class="proportionTitle">营收占比</view>
|
||||
|
||||
<view class="contentPropor">
|
||||
<view class="tabs">
|
||||
<view
|
||||
v-for="(item, index) in propOfRevenList"
|
||||
:key="index"
|
||||
:class="selectTab === item.value ? 'active tabItem' : 'tabItem'"
|
||||
@click="handleSelectTab(item.value)">
|
||||
{{ item.name }}
|
||||
</view>
|
||||
</view>
|
||||
|
||||
<view class="chart">
|
||||
<div v-show="selectTab===1" v-if="regionProgress.length>0">
|
||||
<div>
|
||||
<div class="operation-c-list" v-for="(item,o) in regionProgress" :key="o">
|
||||
<div class="top">
|
||||
<div class="left">
|
||||
<div class="icon">
|
||||
<image :src="o===0?'https://eshangtech.com/ShopICO/ahyd-BID/index/No1.svg':o===1?'https://eshangtech.com/ShopICO/ahyd-BID/index/No2.svg':o===2?'https://eshangtech.com/ShopICO/ahyd-BID/index/No3.svg':'https://eshangtech.com/ShopICO/ahyd-BID/index/No4.svg'"></image>
|
||||
<text>{{o+1}}</text>
|
||||
</div>
|
||||
<p class="name">{{item.name}}</p>
|
||||
</div>
|
||||
<p class="price">{{$util.fmoney(item.value,2)}}</p>
|
||||
</div>
|
||||
<div class="bottom">
|
||||
<div class="bar">
|
||||
<div class="progress" :style="{width:item.percentage+'%'}"></div>
|
||||
</div>
|
||||
<p class="number">{{item.percentage+'%'}}</p>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<!-- 人流预警-->
|
||||
<view class="peopleWarning" >
|
||||
<div class="carWarningTop">
|
||||
<div class="warningBox">
|
||||
<image class="warningIcon" src="https://eshangtech.com/ShopICO/ahyd-BID/newIndex/personIcon.svg"/>
|
||||
<div class="trafficBox">
|
||||
<text class="trafficCar" style="color: #075FF0">人流预警</text>
|
||||
<image class="moreIcon" src="https://eshangtech.com/ShopICO/ahyd-BID/newIndex/personMoreIcon.svg"/>
|
||||
</div>
|
||||
<div v-show="selectTab===2" v-if="areaProgress.length>0">
|
||||
<div>
|
||||
<div class="operation-c-list" v-for="(item,o) in areaProgress" :key="o">
|
||||
<div class="top">
|
||||
<div class="left">
|
||||
<div class="icon">
|
||||
<image :src="o===0?'https://eshangtech.com/ShopICO/ahyd-BID/index/No1.svg':o===1?'https://eshangtech.com/ShopICO/ahyd-BID/index/No2.svg':o===2?'https://eshangtech.com/ShopICO/ahyd-BID/index/No3.svg':'https://eshangtech.com/ShopICO/ahyd-BID/index/No4.svg'"></image>
|
||||
<text>{{o+1}}</text>
|
||||
</div>
|
||||
<p class="name">{{item.name}}</p>
|
||||
</div>
|
||||
<p class="price">{{$util.fmoney(item.value,2)}}</p>
|
||||
</div>
|
||||
<div class="bottom">
|
||||
<div class="bar">
|
||||
<div class="progress" :style="{width:item.percentage+'%'}"></div>
|
||||
</div>
|
||||
<p class="number">{{item.percentage+'%'}}</p>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="moreStoreBox" @click="handleGoWarning">
|
||||
<!-- <span class="moreText">更多记录</span>-->
|
||||
<!-- <image class="moreIcon" src="https://eshangtech.com/ShopICO/ahyd-BID/commercial/rightArrow.svg"/>-->
|
||||
</div>
|
||||
</div>
|
||||
<div class="contentList" >
|
||||
<div class="contentItem" v-for="(item,index) in warningList" :key="index">
|
||||
<div class="index" >
|
||||
<div class="boxBg" v-if="index<=2"></div>
|
||||
<span class="indexText" :style="{fontWeight:index<=2?'bold':'normal',color:index<=2?'#160002':'#786B6C'}">{{index + 1}}</span>
|
||||
</div>
|
||||
</view>
|
||||
</view>
|
||||
<div class="serviceBox">
|
||||
<span class="name">{{item.name}}</span>
|
||||
<span class="position">{{item.SERVERPART_REGION}}区</span>
|
||||
</div>
|
||||
<div class="numberBox">
|
||||
<span class="number">{{item.VEHICLE_COUNT}}</span>
|
||||
<span class="unit">/人</span>
|
||||
</div>
|
||||
<div class="addBox">
|
||||
<image class="addIcon" :src="Number(item.VEHICLE_RATE)>100?'/static/images/examine/add.svg':Number(item.VEHICLE_RATE)===100?'':'/static/images/examine/reduce.svg'"/>
|
||||
<span class="add">{{item.VEHICLE_RATE}}%</span>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</view>
|
||||
|
||||
<!-- 自营计划-->
|
||||
@ -575,46 +587,77 @@
|
||||
</view>
|
||||
</view>
|
||||
|
||||
<!-- 营收占比-->
|
||||
<view class="proportion">
|
||||
<view class="proportionTitle">营收占比</view>
|
||||
|
||||
<!-- 人流预警-->
|
||||
<view class="peopleWarning" v-if="false">
|
||||
<div class="carWarningTop">
|
||||
<div class="warningBox">
|
||||
<image class="warningIcon" src="https://eshangtech.com/ShopICO/ahyd-BID/newIndex/personIcon.svg"/>
|
||||
<div class="trafficBox">
|
||||
<text class="trafficCar">人流预警</text>
|
||||
<image class="moreIcon" src="https://eshangtech.com/ShopICO/ahyd-BID/newIndex/personMoreIcon.svg"/>
|
||||
<view class="contentPropor">
|
||||
<view class="tabs">
|
||||
<view
|
||||
v-for="(item, index) in propOfRevenList"
|
||||
:key="index"
|
||||
:class="selectTab === item.value ? 'active tabItem' : 'tabItem'"
|
||||
@click="handleSelectTab(item.value)">
|
||||
{{ item.name }}
|
||||
</view>
|
||||
</view>
|
||||
|
||||
<view class="chart">
|
||||
<div v-show="selectTab===1" v-if="regionProgress.length>0">
|
||||
<div>
|
||||
<div class="operation-c-list" v-for="(item,o) in regionProgress" :key="o">
|
||||
<div class="top">
|
||||
<div class="left">
|
||||
<div class="icon">
|
||||
<image :src="o===0?'https://eshangtech.com/ShopICO/ahyd-BID/index/No1.svg':o===1?'https://eshangtech.com/ShopICO/ahyd-BID/index/No2.svg':o===2?'https://eshangtech.com/ShopICO/ahyd-BID/index/No3.svg':'https://eshangtech.com/ShopICO/ahyd-BID/index/No4.svg'"></image>
|
||||
<text>{{o+1}}</text>
|
||||
</div>
|
||||
<p class="name">{{item.name}}</p>
|
||||
</div>
|
||||
<p class="price">{{$util.fmoney(item.value,2)}}</p>
|
||||
</div>
|
||||
<div class="bottom">
|
||||
<div class="bar">
|
||||
<div class="progress" :style="{width:item.percentage+'%'}"></div>
|
||||
</div>
|
||||
<p class="number">{{item.percentage+'%'}}</p>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="moreStoreBox" @click="handleGoWarning">
|
||||
<!-- <span class="moreText">更多记录</span>-->
|
||||
<!-- <image class="moreIcon" src="https://eshangtech.com/ShopICO/ahyd-BID/commercial/rightArrow.svg"/>-->
|
||||
</div>
|
||||
</div>
|
||||
<div class="contentList" >
|
||||
<div class="contentItem" v-for="(item,index) in warningList" :key="index">
|
||||
<div class="index">
|
||||
<div class="boxBg" v-if="index<=2"></div>
|
||||
<span class="indexText" :style="{fontWeight:index<=2?'bold':'normal',color:index<=2?'#160002':'#786B6C'}">{{index + 1}}</span>
|
||||
<div v-show="selectTab===2" v-if="areaProgress.length>0">
|
||||
<div>
|
||||
<div class="operation-c-list" v-for="(item,o) in areaProgress" :key="o">
|
||||
<div class="top">
|
||||
<div class="left">
|
||||
<div class="icon">
|
||||
<image :src="o===0?'https://eshangtech.com/ShopICO/ahyd-BID/index/No1.svg':o===1?'https://eshangtech.com/ShopICO/ahyd-BID/index/No2.svg':o===2?'https://eshangtech.com/ShopICO/ahyd-BID/index/No3.svg':'https://eshangtech.com/ShopICO/ahyd-BID/index/No4.svg'"></image>
|
||||
<text>{{o+1}}</text>
|
||||
</div>
|
||||
<p class="name">{{item.name}}</p>
|
||||
</div>
|
||||
<p class="price">{{$util.fmoney(item.value,2)}}</p>
|
||||
</div>
|
||||
<div class="bottom">
|
||||
<div class="bar">
|
||||
<div class="progress" :style="{width:item.percentage+'%'}"></div>
|
||||
</div>
|
||||
<p class="number">{{item.percentage+'%'}}</p>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="serviceBox">
|
||||
<span class="name">{{item.name}}</span>
|
||||
<span class="position">{{item.SERVERPART_REGION}}区</span>
|
||||
</div>
|
||||
<div class="numberBox">
|
||||
<span class="number">{{item.VEHICLE_COUNT}}</span>
|
||||
<span class="unit">/人</span>
|
||||
</div>
|
||||
<div class="addBox">
|
||||
<image class="addIcon" :src="Number(item.VEHICLE_RATE)>100?'/static/images/examine/add.svg':Number(item.VEHICLE_RATE)===100?'':'/static/images/examine/reduce.svg'"/>
|
||||
<span class="add">{{item.VEHICLE_RATE}}%</span>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
<!-- 巡检考核-->
|
||||
<view class="patrolInspection">
|
||||
<view class="patrolInspection" v-if="false">
|
||||
<view class="patrolTitle">巡检考核</view>
|
||||
|
||||
<view class="contentBox">
|
||||
@ -687,8 +730,8 @@
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
<!--欢度国庆-->
|
||||
<div class="nationalDay" @click="goToNational">
|
||||
<!--节日特刊-->
|
||||
<div class="nationalDay" v-if="false" @click="goToNational">
|
||||
<div class="national">
|
||||
<div class="nationalTop">
|
||||
<div class="nationalTopLeft">
|
||||
@ -766,9 +809,10 @@ import uniPopup from "../../components/uni-popup.vue";
|
||||
import Tabbar from "../../components/tabbar/tabbar.vue";
|
||||
import anhuiYestodayRevenueData from "../everdayRenven/components/anhuiYestodayRevenueData";
|
||||
import MonthCharts from "./components/monthCharts.vue";
|
||||
import RateCharts from "./components/rateCharts.vue";
|
||||
var rincanvas = {};
|
||||
export default {
|
||||
components: {MonthCharts, Tabbar,uniPopup},
|
||||
components: {RateCharts, MonthCharts, Tabbar,uniPopup},
|
||||
data() {
|
||||
const lastDay = this.$util.cutDate(new Date(), 'YYYY-MM-DD', -1)
|
||||
const nowDay = this.$util.cutDate(new Date(), 'MM月DD日')
|
||||
@ -876,6 +920,7 @@ export default {
|
||||
trafficCurrentObj:{},// 当前月
|
||||
showMonthDetail:false,//月度车流的显示框
|
||||
yesObjCompared:'',//昨日营收的比较值
|
||||
moneyRateList:[]
|
||||
}
|
||||
},
|
||||
watch:{
|
||||
@ -970,6 +1015,9 @@ export default {
|
||||
},
|
||||
onLoad(option){
|
||||
const _this = this
|
||||
setTimeout(()=>{
|
||||
_this.moneyRateList = [3512.54,2615.68]
|
||||
},3000)
|
||||
// 顶部显示的时间
|
||||
this.single = timestampToTimeMonth((new Date(this.lastDay).getTime()))
|
||||
// 获取手机参数对页面进行适配 主要是用于拿到胶囊的位置
|
||||
@ -1092,6 +1140,10 @@ export default {
|
||||
this.nationalDayList[1].value = data.Result_Data.sumEntryCount?this.$util.fmoney(Number((data.Result_Data.sumEntryCount / 10000).toFixed(2))):''
|
||||
this.nationalDayList[2].value = data.Result_Data.GrowthList[0].Entry_GrowthRate>0?'+' + data.Result_Data.GrowthList[0].Entry_GrowthRate + '%':'-' + data.Result_Data.GrowthList[0].Entry_GrowthRate + '%'
|
||||
},
|
||||
// 跳转到营收统计
|
||||
goToRevenueStatic(){
|
||||
this.$util.toNextRoute('navigateTo', `/pages/revenueStatistics/index?time=${this.lastDay}`)
|
||||
},
|
||||
goToNational(){
|
||||
this.$util.toNextRoute('navigateTo', `/pages/nationalPage/index?time=${this.lastDay}`)
|
||||
},
|
||||
@ -2112,7 +2164,7 @@ $iphoneHeight: env(safe-area-inset-bottom);
|
||||
background: rgba(254, 192, 168,0.8);
|
||||
.top{
|
||||
width: 100%;
|
||||
height: 436rpx;
|
||||
height: 700rpx;
|
||||
background: linear-gradient(135deg, #FFE5CA 0%, #FFFFFF 29%, #FFFFFF 69%, #FFDCD5 100%);
|
||||
border-bottom-right-radius: 32rpx;
|
||||
border-bottom-left-radius: 32rpx;
|
||||
@ -2228,108 +2280,165 @@ $iphoneHeight: env(safe-area-inset-bottom);
|
||||
margin-right: 64rpx;
|
||||
}
|
||||
}
|
||||
.progress{
|
||||
.newBox{
|
||||
width: 100%;
|
||||
height: 24rpx;
|
||||
border-radius: 12rpx;
|
||||
background: #FFAB30;
|
||||
margin-top: 24rpx;
|
||||
//overflow: hidden;
|
||||
position: relative;
|
||||
.have{
|
||||
position: absolute;
|
||||
top: 0;left: 0;
|
||||
width: 60%;
|
||||
background: #DB573B;
|
||||
height: 100%;
|
||||
border-radius: 12rpx;
|
||||
}
|
||||
.haveNoticeBox{
|
||||
position: absolute;
|
||||
bottom: 13px;left: 50%;
|
||||
transform: translateX(-50%);
|
||||
display: inline-block;
|
||||
padding: 5px 10px;
|
||||
background: #fff;
|
||||
border-radius: 10rpx;
|
||||
box-shadow: 0rpx 0rpx 40rpx 0rpx rgba(244, 138, 143, 0.21);
|
||||
z-index:9;
|
||||
}
|
||||
}
|
||||
.message{
|
||||
width: 100%;
|
||||
display: flex;
|
||||
box-sizing: border-box;
|
||||
padding: 32rpx 16rpx;
|
||||
background: linear-gradient(135deg, #FFE3BA 0%, #FFF5E5 40%, #FFF1DB 78%, #FFDABC 100%); border-radius: 16rpx;
|
||||
margin-top: 32rpx;
|
||||
.smallDetailItem{
|
||||
width: 50%;
|
||||
.messageTop{
|
||||
display: flex;
|
||||
align-items: center;
|
||||
.type{
|
||||
width: 24rpx;
|
||||
height: 12rpx;
|
||||
border-radius: 6rpx;
|
||||
margin-right: 6px;
|
||||
.progress{
|
||||
width: 100%;
|
||||
height: 24rpx;
|
||||
border-radius: 12rpx;
|
||||
background: #FFAB30;
|
||||
//overflow: hidden;
|
||||
position: relative;
|
||||
.have{
|
||||
position: absolute;
|
||||
top: 0;left: 0;
|
||||
width: 60%;
|
||||
background: #DB573B;
|
||||
height: 100%;
|
||||
border-radius: 12rpx;
|
||||
}
|
||||
.haveNoticeBox{
|
||||
position: absolute;
|
||||
bottom: 13px;left: 50%;
|
||||
transform: translateX(-50%);
|
||||
display: inline-block;
|
||||
padding: 5px 10px;
|
||||
background: #fff;
|
||||
border-radius: 10rpx;
|
||||
box-shadow: 0rpx 0rpx 40rpx 0rpx rgba(244, 138, 143, 0.21);
|
||||
z-index:9;
|
||||
}
|
||||
}
|
||||
.message{
|
||||
width: 100%;
|
||||
display: flex;
|
||||
margin-top: 32rpx;
|
||||
.smallDetailItem{
|
||||
width: 50%;
|
||||
.messageTop{
|
||||
display: flex;
|
||||
align-items: center;
|
||||
.type{
|
||||
width: 24rpx;
|
||||
height: 12rpx;
|
||||
border-radius: 6rpx;
|
||||
margin-right: 6px;
|
||||
}
|
||||
.typeTitle{
|
||||
font-size: 28rpx;
|
||||
font-family: PingFangSC-Regular, PingFang SC;
|
||||
font-weight: 400;
|
||||
color: #160002;
|
||||
line-height: 40rpx;
|
||||
.unit{
|
||||
font-size: 28rpx;
|
||||
font-family: PingFangSC-Regular, PingFang SC;
|
||||
font-weight: 400;
|
||||
color: #A69E9F;
|
||||
line-height: 40rpx;
|
||||
margin-left: 2px;
|
||||
}
|
||||
}
|
||||
}
|
||||
.typeTitle{
|
||||
font-size: 28rpx;
|
||||
font-family: PingFangSC-Regular, PingFang SC;
|
||||
font-weight: 400;
|
||||
color: #160002;
|
||||
line-height: 40rpx;
|
||||
.unit{
|
||||
.middle{
|
||||
margin-top: 6px;
|
||||
margin-left: 20px;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
.money{
|
||||
font-size: 36rpx;
|
||||
font-family: DINAlternate-Bold, DINAlternate;
|
||||
font-weight: bold;
|
||||
color: #160002;
|
||||
line-height: 44rpx;
|
||||
}
|
||||
.addItem{
|
||||
margin-left: 6px;
|
||||
display: inline-block;
|
||||
padding: 2px 4px;
|
||||
font-size: 28rpx;
|
||||
font-family: DINAlternate-Bold, DINAlternate;
|
||||
font-weight: bold;
|
||||
color: #E83944;
|
||||
line-height: 32rpx;
|
||||
background: rgba(232, 57, 68, 0.1);
|
||||
border-radius: 18rpx;
|
||||
}
|
||||
}
|
||||
.messageBottom{
|
||||
margin-left: 20px;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
.addText{
|
||||
font-size: 28rpx;
|
||||
font-family: DINAlternate-Bold, DINAlternate;
|
||||
font-weight: bold;
|
||||
color: #E83944;
|
||||
line-height: 32rpx
|
||||
}
|
||||
.addType{
|
||||
font-size: 28rpx;
|
||||
font-family: PingFangSC-Regular, PingFang SC;
|
||||
font-weight: 400;
|
||||
color: #A69E9F;
|
||||
line-height: 40rpx;
|
||||
margin-left: 2px;
|
||||
margin-left: 4px;
|
||||
}
|
||||
}
|
||||
}
|
||||
.middle{
|
||||
margin-top: 6px;
|
||||
margin-left: 20px;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
.money{
|
||||
font-size: 36rpx;
|
||||
font-family: DINAlternate-Bold, DINAlternate;
|
||||
font-weight: bold;
|
||||
color: #160002;
|
||||
line-height: 44rpx;
|
||||
}
|
||||
.addItem{
|
||||
margin-left: 6px;
|
||||
display: inline-block;
|
||||
padding: 2px 4px;
|
||||
font-size: 28rpx;
|
||||
font-family: DINAlternate-Bold, DINAlternate;
|
||||
font-weight: bold;
|
||||
color: #E83944;
|
||||
line-height: 32rpx;
|
||||
background: rgba(232, 57, 68, 0.1);
|
||||
border-radius: 18rpx;
|
||||
}
|
||||
}
|
||||
.moneyRate{
|
||||
width: 100%;
|
||||
box-sizing: border-box;
|
||||
margin-top: 40rpx;
|
||||
height: 144rpx;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
.leftBox{
|
||||
width: 144rpx;
|
||||
height: 144rpx;
|
||||
margin-right: 16rpx;
|
||||
}
|
||||
.messageBottom{
|
||||
margin-left: 20px;
|
||||
.rightBox{
|
||||
flex: 1;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
.addText{
|
||||
font-size: 28rpx;
|
||||
font-family: DINAlternate-Bold, DINAlternate;
|
||||
font-weight: bold;
|
||||
color: #E83944;
|
||||
line-height: 32rpx
|
||||
}
|
||||
.addType{
|
||||
font-size: 28rpx;
|
||||
font-family: PingFangSC-Regular, PingFang SC;
|
||||
font-weight: 400;
|
||||
color: #A69E9F;
|
||||
line-height: 40rpx;
|
||||
margin-left: 4px;
|
||||
.noticeItem{
|
||||
width: 50%;
|
||||
.noticeTop{
|
||||
width: 24rpx;
|
||||
height: 12rpx;
|
||||
background: #A66A37;
|
||||
border-radius: 6rpx;
|
||||
margin-bottom: 8rpx;
|
||||
}
|
||||
.noticeText{
|
||||
font-size: 28rpx;
|
||||
font-family: PingFangSC, PingFang SC;
|
||||
font-weight: 400;
|
||||
color: #160002;
|
||||
line-height: 40rpx;
|
||||
margin-bottom: 6rpx;
|
||||
.noticeSmallText{
|
||||
font-size: 28rpx;
|
||||
font-family: PingFangSC, PingFang SC;
|
||||
font-weight: 400;
|
||||
color: #A69E9F;
|
||||
line-height: 40rpx;
|
||||
margin-left: 4rpx;
|
||||
}
|
||||
}
|
||||
.noticeMoney{
|
||||
font-size: 36rpx;
|
||||
font-family: DINAlternate, DINAlternate;
|
||||
font-weight: bold;
|
||||
color: #160002;
|
||||
line-height: 44rpx;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
@ -2543,7 +2652,7 @@ $iphoneHeight: env(safe-area-inset-bottom);
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
position: absolute;
|
||||
left: 0;bottom: 10px;
|
||||
left: 0;bottom: 8px;
|
||||
.noShowMore{
|
||||
width: 25px;
|
||||
height: 14px;
|
||||
@ -2666,101 +2775,101 @@ $iphoneHeight: env(safe-area-inset-bottom);
|
||||
margin-right: 64rpx;
|
||||
}
|
||||
}
|
||||
.progress{
|
||||
width: 100%;
|
||||
margin: 6px 0;
|
||||
height: 24rpx;
|
||||
border-radius: 12rpx;
|
||||
background: #FFAB30;
|
||||
overflow: hidden;
|
||||
position: relative;
|
||||
.have{
|
||||
position: absolute;
|
||||
top: 0;left: 0;
|
||||
width: 60%;
|
||||
background: #DB573B;
|
||||
height: 100%;
|
||||
.progress{
|
||||
width: 100%;
|
||||
margin: 6px 0;
|
||||
height: 24rpx;
|
||||
border-radius: 12rpx;
|
||||
background: #FFAB30;
|
||||
overflow: hidden;
|
||||
position: relative;
|
||||
.have{
|
||||
position: absolute;
|
||||
top: 0;left: 0;
|
||||
width: 60%;
|
||||
background: #DB573B;
|
||||
height: 100%;
|
||||
border-radius: 12rpx;
|
||||
}
|
||||
}
|
||||
}
|
||||
.message{
|
||||
width: 100%;
|
||||
display: flex;
|
||||
.smallDetailItem{
|
||||
width: 50%;
|
||||
.messageTop{
|
||||
display: flex;
|
||||
align-items: center;
|
||||
.type{
|
||||
width: 24rpx;
|
||||
height: 12rpx;
|
||||
background: #DB573B;
|
||||
border-radius: 6rpx;
|
||||
margin-right: 6px;
|
||||
.message{
|
||||
width: 100%;
|
||||
display: flex;
|
||||
.smallDetailItem{
|
||||
width: 50%;
|
||||
.messageTop{
|
||||
display: flex;
|
||||
align-items: center;
|
||||
.type{
|
||||
width: 24rpx;
|
||||
height: 12rpx;
|
||||
background: #DB573B;
|
||||
border-radius: 6rpx;
|
||||
margin-right: 6px;
|
||||
}
|
||||
.typeTitle{
|
||||
font-size: 28rpx;
|
||||
font-family: PingFangSC-Regular, PingFang SC;
|
||||
font-weight: 400;
|
||||
color: #160002;
|
||||
line-height: 40rpx;
|
||||
.unit{
|
||||
font-size: 28rpx;
|
||||
font-family: PingFangSC-Regular, PingFang SC;
|
||||
font-weight: 400;
|
||||
color: #A69E9F;
|
||||
line-height: 40rpx;
|
||||
margin-left: 2px;
|
||||
}
|
||||
}
|
||||
}
|
||||
.typeTitle{
|
||||
font-size: 28rpx;
|
||||
font-family: PingFangSC-Regular, PingFang SC;
|
||||
font-weight: 400;
|
||||
color: #160002;
|
||||
line-height: 40rpx;
|
||||
.unit{
|
||||
.middle{
|
||||
margin-top: 6px;
|
||||
margin-left: 20px;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
.money{
|
||||
font-size: 36rpx;
|
||||
font-family: DINAlternate-Bold, DINAlternate;
|
||||
font-weight: bold;
|
||||
color: #160002;
|
||||
line-height: 44rpx;
|
||||
}
|
||||
.addItem{
|
||||
margin-left: 6px;
|
||||
display: inline-block;
|
||||
padding: 2px 4px;
|
||||
font-size: 28rpx;
|
||||
font-family: DINAlternate-Bold, DINAlternate;
|
||||
font-weight: bold;
|
||||
color: #E83944;
|
||||
line-height: 32rpx;
|
||||
background: rgba(232, 57, 68, 0.1);
|
||||
border-radius: 18rpx;
|
||||
}
|
||||
}
|
||||
.messageBottom{
|
||||
margin-left: 20px;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
.addText{
|
||||
font-size: 28rpx;
|
||||
font-family: DINAlternate-Bold, DINAlternate;
|
||||
font-weight: bold;
|
||||
color: #E83944;
|
||||
line-height: 32rpx
|
||||
}
|
||||
.addType{
|
||||
font-size: 28rpx;
|
||||
font-family: PingFangSC-Regular, PingFang SC;
|
||||
font-weight: 400;
|
||||
color: #A69E9F;
|
||||
line-height: 40rpx;
|
||||
margin-left: 2px;
|
||||
margin-left: 4px;
|
||||
}
|
||||
}
|
||||
}
|
||||
.middle{
|
||||
margin-top: 6px;
|
||||
margin-left: 20px;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
.money{
|
||||
font-size: 36rpx;
|
||||
font-family: DINAlternate-Bold, DINAlternate;
|
||||
font-weight: bold;
|
||||
color: #160002;
|
||||
line-height: 44rpx;
|
||||
}
|
||||
.addItem{
|
||||
margin-left: 6px;
|
||||
display: inline-block;
|
||||
padding: 2px 4px;
|
||||
font-size: 28rpx;
|
||||
font-family: DINAlternate-Bold, DINAlternate;
|
||||
font-weight: bold;
|
||||
color: #E83944;
|
||||
line-height: 32rpx;
|
||||
background: rgba(232, 57, 68, 0.1);
|
||||
border-radius: 18rpx;
|
||||
}
|
||||
}
|
||||
.messageBottom{
|
||||
margin-left: 20px;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
.addText{
|
||||
font-size: 28rpx;
|
||||
font-family: DINAlternate-Bold, DINAlternate;
|
||||
font-weight: bold;
|
||||
color: #E83944;
|
||||
line-height: 32rpx
|
||||
}
|
||||
.addType{
|
||||
font-size: 28rpx;
|
||||
font-family: PingFangSC-Regular, PingFang SC;
|
||||
font-weight: 400;
|
||||
color: #A69E9F;
|
||||
line-height: 40rpx;
|
||||
margin-left: 4px;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
.bottom{
|
||||
@ -3365,7 +3474,7 @@ $iphoneHeight: env(safe-area-inset-bottom);
|
||||
.funBox{
|
||||
width: calc(100% - 64rpx);
|
||||
margin-left: 32rpx;
|
||||
height: 378rpx;
|
||||
height: 530rpx;
|
||||
margin-bottom: 16px;
|
||||
.firstBox{
|
||||
display: flex;
|
||||
@ -4001,7 +4110,7 @@ $iphoneHeight: env(safe-area-inset-bottom);
|
||||
.boxBg{
|
||||
width: 12px;
|
||||
height: 12px;
|
||||
background: #10BFCE;
|
||||
background: #589CFF;
|
||||
filter: blur(4px);
|
||||
position: absolute;
|
||||
top: 0;left: 0;
|
||||
|
||||
@ -24,7 +24,7 @@
|
||||
<text class="" v-if="pageMsg.Serverpart_N"> {{pageMsg.Serverpart_N}} ¥{{$util.fmoney(pageMsg.Serverpart_RevenueN,2)}}</text>
|
||||
</view>
|
||||
</view>
|
||||
<view class="page-list">
|
||||
<view class="page-list" >
|
||||
<!-- <view v-for="(dateItem,i) in pageMsg.revenueReportDetilsDates" :key="i">-->
|
||||
<!-- <text class="list-date"> {{// $util.cutDate(dateItem.Statistics_Date,'MM.DD')}}</text>-->
|
||||
<view class="cell-body uni-flex ai-center" v-for="(item,i) in pageMsg.ShopList" :key="i">
|
||||
|
||||
@ -109,6 +109,7 @@ export default {
|
||||
uni.canvasToTempFilePath({
|
||||
canvasId:id,
|
||||
complete:(res)=>{
|
||||
console.log('res',res)
|
||||
if (res.tempFilePath){
|
||||
uni.getFileSystemManager().readFile({
|
||||
filePath: res.tempFilePath,
|
||||
|
||||
@ -1,11 +1,626 @@
|
||||
<script setup>
|
||||
|
||||
</script>
|
||||
|
||||
<template>
|
||||
$END$
|
||||
<view class="main">
|
||||
<view class="top">
|
||||
<view class="header" :style="{height: menu.bottom + 5 +'px'}">
|
||||
<view class="headerContent" :style="{height: (menu.bottom - menu.top) + 'px'}">
|
||||
<image class="leftIcon" src="https://eshangtech.com/ShopICO/ahyd-BID/examine/leftArrowWhite.svg"/>
|
||||
<view class="headerTimeBox">
|
||||
<picker mode="date" fields="month" :value="searchText" :end="lastDay" @change="bindDateChange" >
|
||||
<view class="time">
|
||||
<image class="timeIcon" src="/static/images/newIndex2/timeIcon.svg"/>
|
||||
<view class="text">{{ searchText }}</view>
|
||||
<image class="icon" src="/static/images/newIndex2/timeUpDown.svg"></image>
|
||||
</view>
|
||||
</picker>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
<view class="pageTitle" :style="{top: menu.bottom + 5 + 12 +'px'}">营收统计</view>
|
||||
</view>
|
||||
|
||||
<view class="content">
|
||||
|
||||
<view class="revenueBox ydRevenue">
|
||||
<view class="revenueBoxHeader">
|
||||
<view class="headerTitle">驿达营收</view>
|
||||
<image class="revenueImg" src="https://eshangtech.com/ShopICO/ahyd-BID/nationalDay/revenueItemBg.png"/>
|
||||
<view class="revenueContent">
|
||||
<view class="sumBox">
|
||||
<image class="sumLogo" src="/static/images/newIndex2/sumLogo.svg"/>
|
||||
<view class="sumText">
|
||||
<view class="sumMoney">15,583.9</view>
|
||||
<view class="sumUnit">总计<span class="unit">/元</span></view>
|
||||
</view>
|
||||
</view>
|
||||
|
||||
<view class="revenueAmount">
|
||||
<view class="amountItem">
|
||||
<view class="itemTop">
|
||||
<view class="itemTopLeft">
|
||||
<image class="leftIcon" src="/static/images/newIndex2/amountReceived.svg"/>
|
||||
<view class="itemTitle">到账合计</view>
|
||||
<view class="itemUnit">/元</view>
|
||||
</view>
|
||||
<view class="itemTopRight">7126.85</view>
|
||||
</view>
|
||||
<view class="itemBottom">
|
||||
<view class="itemBottomItem">
|
||||
<view class="bottomItemTitle">业主自营</view>
|
||||
<view class="bottomItemValue">3178</view>
|
||||
</view>
|
||||
<view class="itemBottomItem">
|
||||
<view class="bottomItemTitle">自营提成</view>
|
||||
<view class="bottomItemValue">241.84</view>
|
||||
</view>
|
||||
<view class="itemBottomItem">
|
||||
<view class="bottomItemTitle">合租经营</view>
|
||||
<view class="bottomItemValue">2586.45</view>
|
||||
</view>
|
||||
<view class="itemBottomItem">
|
||||
<view class="bottomItemTitle">固定租金</view>
|
||||
<view class="bottomItemValue">1120.56</view>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
<view class="amountItem" style="margin-top: 56rpx">
|
||||
<view class="itemTop">
|
||||
<view class="itemTopLeft">
|
||||
<image class="leftIcon" src="/static/images/newIndex2/amountEntry.svg"/>
|
||||
<view class="itemTitle">入账合计</view>
|
||||
<view class="itemUnit">/元</view>
|
||||
</view>
|
||||
<view class="itemTopRight">7126.85</view>
|
||||
</view>
|
||||
<view class="itemBottom">
|
||||
<view class="itemBottomItem">
|
||||
<view class="bottomItemTitle">业主自营</view>
|
||||
<view class="bottomItemValue">3178</view>
|
||||
</view>
|
||||
<view class="itemBottomItem">
|
||||
<view class="bottomItemTitle">自营提成</view>
|
||||
<view class="bottomItemValue">241.84</view>
|
||||
</view>
|
||||
<view class="itemBottomItem">
|
||||
<view class="bottomItemTitle">合租经营</view>
|
||||
<view class="bottomItemValue">2586.45</view>
|
||||
</view>
|
||||
<view class="itemBottomItem">
|
||||
<view class="bottomItemTitle">固定租金</view>
|
||||
<view class="bottomItemValue">1120.56</view>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
<view class="amountItem" style="margin-top: 56rpx">
|
||||
<view class="itemTop">
|
||||
<view class="itemTopLeft">
|
||||
<image class="leftIcon" src="/static/images/newIndex2/receivable.svg"/>
|
||||
<view class="itemTitle">应收合计</view>
|
||||
<view class="itemUnit">/元</view>
|
||||
</view>
|
||||
<view class="itemTopRight">7126.85</view>
|
||||
</view>
|
||||
<view class="itemBottom">
|
||||
<view class="itemBottomItem">
|
||||
<view class="bottomItemTitle">业主自营</view>
|
||||
<view class="bottomItemValue">3178</view>
|
||||
</view>
|
||||
<view class="itemBottomItem">
|
||||
<view class="bottomItemTitle">自营提成</view>
|
||||
<view class="bottomItemValue">241.84</view>
|
||||
</view>
|
||||
<view class="itemBottomItem">
|
||||
<view class="bottomItemTitle">合租经营</view>
|
||||
<view class="bottomItemValue">2586.45</view>
|
||||
</view>
|
||||
<view class="itemBottomItem">
|
||||
<view class="bottomItemTitle">固定租金</view>
|
||||
<view class="bottomItemValue">1120.56</view>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
|
||||
<view class="revenueBox merchantRevenue" style="margin-top: 24rpx">
|
||||
<view class="revenueBoxHeader">
|
||||
<view class="headerTitle">商家营收</view>
|
||||
<image class="revenueImg" src="https://eshangtech.com/ShopICO/ahyd-BID/nationalDay/entryAdd.png"/>
|
||||
<view class="revenueContent">
|
||||
<view class="sumBox">
|
||||
<image class="sumLogo" src="/static/images/newIndex2/merchantsSum.svg"/>
|
||||
<view class="sumText">
|
||||
<view class="sumMoney">4,930.12</view>
|
||||
<view class="sumUnit">总计<span class="unit">/元</span></view>
|
||||
</view>
|
||||
</view>
|
||||
|
||||
<view class="revenueAmount">
|
||||
<view class="amountItem">
|
||||
<view class="itemTop">
|
||||
<view class="itemTopLeft">
|
||||
<image class="leftIcon" src="/static/images/newIndex2/merchantsAmount.svg"/>
|
||||
<view class="itemTitle">到账合计</view>
|
||||
<view class="itemUnit">/元</view>
|
||||
</view>
|
||||
<view class="itemTopRight">7126.85</view>
|
||||
</view>
|
||||
<view class="itemBottom">
|
||||
<view class="itemBottomItem">
|
||||
<view class="bottomItemTitle">业主自营</view>
|
||||
<view class="bottomItemValue">3178</view>
|
||||
</view>
|
||||
<view class="itemBottomItem">
|
||||
<view class="bottomItemTitle">自营提成</view>
|
||||
<view class="bottomItemValue">241.84</view>
|
||||
</view>
|
||||
<view class="itemBottomItem">
|
||||
<view class="bottomItemTitle">合租经营</view>
|
||||
<view class="bottomItemValue">2586.45</view>
|
||||
</view>
|
||||
<view class="itemBottomItem">
|
||||
<view class="bottomItemTitle">固定租金</view>
|
||||
<view class="bottomItemValue">1120.56</view>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
<view class="amountItem" style="margin-top: 56rpx">
|
||||
<view class="itemTop">
|
||||
<view class="itemTopLeft">
|
||||
<image class="leftIcon" src="/static/images/newIndex2/merchantsEntry.svg"/>
|
||||
<view class="itemTitle">入账合计</view>
|
||||
<view class="itemUnit">/元</view>
|
||||
</view>
|
||||
<view class="itemTopRight">7126.85</view>
|
||||
</view>
|
||||
<view class="itemBottom">
|
||||
<view class="itemBottomItem">
|
||||
<view class="bottomItemTitle">业主自营</view>
|
||||
<view class="bottomItemValue">3178</view>
|
||||
</view>
|
||||
<view class="itemBottomItem">
|
||||
<view class="bottomItemTitle">自营提成</view>
|
||||
<view class="bottomItemValue">241.84</view>
|
||||
</view>
|
||||
<view class="itemBottomItem">
|
||||
<view class="bottomItemTitle">合租经营</view>
|
||||
<view class="bottomItemValue">2586.45</view>
|
||||
</view>
|
||||
<view class="itemBottomItem">
|
||||
<view class="bottomItemTitle">固定租金</view>
|
||||
<view class="bottomItemValue">1120.56</view>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
<view class="amountItem" style="margin-top: 56rpx">
|
||||
<view class="itemTop">
|
||||
<view class="itemTopLeft">
|
||||
<image class="leftIcon" src="/static/images/newIndex2/merchantsReceivable.svg"/>
|
||||
<view class="itemTitle">应收合计</view>
|
||||
<view class="itemUnit">/元</view>
|
||||
</view>
|
||||
<view class="itemTopRight">7126.85</view>
|
||||
</view>
|
||||
<view class="itemBottom">
|
||||
<view class="itemBottomItem">
|
||||
<view class="bottomItemTitle">业主自营</view>
|
||||
<view class="bottomItemValue">3178</view>
|
||||
</view>
|
||||
<view class="itemBottomItem">
|
||||
<view class="bottomItemTitle">自营提成</view>
|
||||
<view class="bottomItemValue">241.84</view>
|
||||
</view>
|
||||
<view class="itemBottomItem">
|
||||
<view class="bottomItemTitle">合租经营</view>
|
||||
<view class="bottomItemValue">2586.45</view>
|
||||
</view>
|
||||
<view class="itemBottomItem">
|
||||
<view class="bottomItemTitle">固定租金</view>
|
||||
<view class="bottomItemValue">1120.56</view>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
|
||||
<view class="revenueBox otherData" style="margin-top: 24rpx">
|
||||
<view class="revenueBoxHeader">
|
||||
<view class="headerTitle">其他数据</view>
|
||||
<image class="revenueImg" src="https://eshangtech.com/ShopICO/ahyd-BID/revenueBox/expenditure.png"/>
|
||||
<view class="revenueContent">
|
||||
|
||||
|
||||
<view class="revenueAmount">
|
||||
<view class="amountItem">
|
||||
<view class="itemTop">
|
||||
<view class="itemTopLeft">
|
||||
<image class="leftIcon" src="/static/images/newIndex2/itemQuantity.svg"/>
|
||||
<view class="itemTitle">项目数量</view>
|
||||
<view class="itemUnit">/个</view>
|
||||
</view>
|
||||
<view class="itemTopRight">499</view>
|
||||
</view>
|
||||
<view class="itemBottom">
|
||||
<view class="itemBottomItem">
|
||||
<view class="bottomItemTitle">业主自营</view>
|
||||
<view class="bottomItemValue">102</view>
|
||||
</view>
|
||||
<view class="itemBottomItem">
|
||||
<view class="bottomItemTitle">自营提成</view>
|
||||
<view class="bottomItemValue">44</view>
|
||||
</view>
|
||||
<view class="itemBottomItem">
|
||||
<view class="bottomItemTitle">合租经营</view>
|
||||
<view class="bottomItemValue">220</view>
|
||||
</view>
|
||||
<view class="itemBottomItem">
|
||||
<view class="bottomItemTitle">固定租金</view>
|
||||
<view class="bottomItemValue">123</view>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
<view class="amountItem" style="margin-top: 56rpx">
|
||||
<view class="itemTop">
|
||||
<view class="itemTopLeft">
|
||||
<image class="leftIcon" src="/static/images/newIndex2/itemRate.svg"/>
|
||||
<view class="itemTitle">项目占比</view>
|
||||
<view class="itemUnit">/%</view>
|
||||
</view>
|
||||
<view class="itemTopRight">100%</view>
|
||||
</view>
|
||||
<view class="itemBottom">
|
||||
<view class="itemBottomItem">
|
||||
<view class="bottomItemTitle">业主自营</view>
|
||||
<view class="bottomItemValue">12%</view>
|
||||
</view>
|
||||
<view class="itemBottomItem">
|
||||
<view class="bottomItemTitle">自营提成</view>
|
||||
<view class="bottomItemValue">9%</view>
|
||||
</view>
|
||||
<view class="itemBottomItem">
|
||||
<view class="bottomItemTitle">合租经营</view>
|
||||
<view class="bottomItemValue">45%</view>
|
||||
</view>
|
||||
<view class="itemBottomItem">
|
||||
<view class="bottomItemTitle">固定租金</view>
|
||||
<view class="bottomItemValue">25%</view>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
<view class="amountItem" style="margin-top: 56rpx">
|
||||
<view class="itemTop">
|
||||
<view class="itemTopLeft">
|
||||
<image class="leftIcon" src="/static/images/newIndex2/customersRate.svg"/>
|
||||
<view class="itemTitle">对客占比</view>
|
||||
<view class="itemUnit">/%</view>
|
||||
</view>
|
||||
<view class="itemTopRight">100%</view>
|
||||
</view>
|
||||
<view class="itemBottom">
|
||||
<view class="itemBottomItem">
|
||||
<view class="bottomItemTitle">业主自营</view>
|
||||
<view class="bottomItemValue">44.59%</view>
|
||||
</view>
|
||||
<view class="itemBottomItem">
|
||||
<view class="bottomItemTitle">自营提成</view>
|
||||
<view class="bottomItemValue">3.41%</view>
|
||||
</view>
|
||||
<view class="itemBottomItem">
|
||||
<view class="bottomItemTitle">合租经营</view>
|
||||
<view class="bottomItemValue">36%</view>
|
||||
</view>
|
||||
<view class="itemBottomItem">
|
||||
<view class="bottomItemTitle">固定租金</view>
|
||||
<view class="bottomItemValue">16%</view>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
<view class="amountItem" style="margin-top: 56rpx">
|
||||
<view class="itemTop">
|
||||
<view class="itemTopLeft">
|
||||
<image class="leftIcon" src="/static/images/newIndex2/comprehensive.svg"/>
|
||||
<view class="itemTitle">综合提成</view>
|
||||
<view class="itemUnit">/%</view>
|
||||
</view>
|
||||
<view class="itemTopRight">100%</view>
|
||||
</view>
|
||||
<view class="itemBottom">
|
||||
<view class="itemBottomItem">
|
||||
<view class="bottomItemTitle">业主自营</view>
|
||||
<view class="bottomItemValue">0%</view>
|
||||
</view>
|
||||
<view class="itemBottomItem">
|
||||
<view class="bottomItemTitle">自营提成</view>
|
||||
<view class="bottomItemValue">0%</view>
|
||||
</view>
|
||||
<view class="itemBottomItem">
|
||||
<view class="bottomItemTitle">合租经营</view>
|
||||
<view class="bottomItemValue">32.4%</view>
|
||||
</view>
|
||||
<view class="itemBottomItem">
|
||||
<view class="bottomItemTitle">固定租金</view>
|
||||
<view class="bottomItemValue">77.6%</view>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
</template>
|
||||
<script>
|
||||
export default {
|
||||
data(){
|
||||
return {
|
||||
statusBarHeight:'',
|
||||
menu:{},
|
||||
lastDay:'',
|
||||
searchText:''
|
||||
}
|
||||
},
|
||||
onLoad(option){
|
||||
console.log('option',option)
|
||||
// 获取手机参数对页面进行适配 主要是用于拿到胶囊的位置
|
||||
let systemInfo = uni.getSystemInfoSync()
|
||||
this.statusBarHeight = Number(systemInfo.statusBarHeight)
|
||||
uni.setStorageSync('phoneInfo',systemInfo)
|
||||
this.menu = uni.getMenuButtonBoundingClientRect()
|
||||
console.log('statusBarHeight',this.statusBarHeight)
|
||||
console.log('menu',this.menu)
|
||||
if (option.time){
|
||||
const date = new Date(option.time)
|
||||
let y = date.getFullYear()
|
||||
let m = date.getMonth() + 1
|
||||
if (m<10){
|
||||
m = '0'+m
|
||||
}
|
||||
this.lastDay = option.time
|
||||
this.searchText = `${y}-${m}`
|
||||
}
|
||||
|
||||
<style scoped>
|
||||
}
|
||||
}
|
||||
</script>
|
||||
<style scoped lang="scss">
|
||||
@import '/static/public/revenueStatistics/stylesheet.css';
|
||||
.main{
|
||||
height: 100%;
|
||||
background: #f5f5f5;
|
||||
.top{
|
||||
width: 100%;
|
||||
height: 560rpx;
|
||||
position: relative;
|
||||
background: linear-gradient(#FF7F37 0%, #FDA03E 60%, #F5F5F5 100%);;
|
||||
.header{
|
||||
position: fixed;
|
||||
top: 0;left: 0;
|
||||
width: 100%;
|
||||
z-index: 9999;
|
||||
background: linear-gradient(#FF9434 0%,#FE9139 100%);
|
||||
box-sizing: border-box;
|
||||
.headerContent{
|
||||
width: 100%;
|
||||
box-sizing: border-box;
|
||||
padding: 0 32rpx;
|
||||
position: absolute;
|
||||
bottom: 5px;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
.leftIcon{
|
||||
width: 24px;
|
||||
height: 24px;
|
||||
}
|
||||
.headerTimeBox{
|
||||
margin-left: 24rpx;
|
||||
.time{
|
||||
display: flex;
|
||||
align-items: center;
|
||||
.timeIcon{
|
||||
width: 40rpx;
|
||||
height: 40rpx;
|
||||
margin-right: 8rpx;
|
||||
}
|
||||
.text{
|
||||
font-size: 32rpx;
|
||||
font-family: PingFangSC, PingFang SC;
|
||||
font-weight: 600;
|
||||
color: #FFFFFF;
|
||||
line-height: 44rpx;
|
||||
}
|
||||
.icon{
|
||||
width: 24rpx;
|
||||
height: 24rpx;
|
||||
margin-left: 16rpx;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
}
|
||||
.pageTitle{
|
||||
font-size: 56rpx;
|
||||
font-family: Alimama ShuHeiTi;
|
||||
font-weight: bold;
|
||||
color: #FFFFFF;
|
||||
line-height: 68rpx;
|
||||
position: absolute;
|
||||
left: 32rpx;
|
||||
}
|
||||
}
|
||||
.content{
|
||||
width: 100%;
|
||||
box-sizing: border-box;
|
||||
padding: 0 32rpx 48rpx;
|
||||
transform: translateY(-260rpx);
|
||||
.revenueBox{
|
||||
width: 100%;
|
||||
background:#fff;
|
||||
border-radius: 24rpx;
|
||||
box-sizing: border-box;
|
||||
padding: 4rpx;
|
||||
.revenueBoxHeader{
|
||||
width: 100%;
|
||||
height: 500px;
|
||||
border-radius: 12rpx 12rpx 0 0;
|
||||
box-sizing: border-box;
|
||||
padding: 22rpx 24rpx;
|
||||
position: relative;
|
||||
overflow: hidden;
|
||||
.headerTitle{
|
||||
font-size: 36rpx;
|
||||
font-family: Alimama ShuHeiTi;
|
||||
font-weight: bold;
|
||||
line-height: 44rpx;
|
||||
}
|
||||
.revenueImg{
|
||||
position: absolute;
|
||||
right: 0;top: 0;
|
||||
width: 266rpx;
|
||||
height: 208rpx;
|
||||
|
||||
}
|
||||
.revenueContent{
|
||||
position: absolute;
|
||||
z-index: 2;
|
||||
width: calc(100% - 48rpx);
|
||||
.sumBox{
|
||||
width: 100%;
|
||||
box-sizing: border-box;
|
||||
padding: 32rpx 24rpx;
|
||||
background: #fff;
|
||||
border-radius: 12rpx;
|
||||
margin-top: 22rpx;
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
.sumLogo{
|
||||
width: 96rpx;
|
||||
height: 96rpx;
|
||||
}
|
||||
.sumText{
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
align-items: flex-end;
|
||||
.sumMoney{
|
||||
font-size: 40rpx;
|
||||
font-family: DINAlternate, DINAlternate;
|
||||
font-weight: bold;
|
||||
color: #160002;
|
||||
line-height: 48rpx;
|
||||
}
|
||||
.sumUnit{
|
||||
margin-top: 8rpx;
|
||||
font-size: 28rpx;
|
||||
font-family: PingFangSC, PingFang SC;
|
||||
font-weight: 400;
|
||||
color: #160002;
|
||||
line-height: 40rpx;
|
||||
.unit{
|
||||
font-size: 28rpx;
|
||||
font-family: PingFangSC, PingFang SC;
|
||||
font-weight: 400;
|
||||
color: #A69E9F;
|
||||
line-height: 40rpx;
|
||||
margin-left: 4rpx;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
.revenueAmount{
|
||||
width: 100%;
|
||||
margin-top: 62rpx;
|
||||
.amountItem{
|
||||
.itemTop{
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: space-between;
|
||||
.itemTopLeft{
|
||||
display: flex;
|
||||
align-items: center;
|
||||
.leftIcon{
|
||||
width: 72rpx;
|
||||
height: 72rpx;
|
||||
margin-right: 16rpx;
|
||||
}
|
||||
.itemTitle{
|
||||
font-size: 32rpx;
|
||||
font-family: PingFangSC, PingFang SC;
|
||||
font-weight: 600;
|
||||
color: #160002;
|
||||
line-height: 44rpx;
|
||||
}
|
||||
.itemUnit{
|
||||
font-size: 28rpx;
|
||||
font-family: PingFangSC, PingFang SC;
|
||||
font-weight: 400;
|
||||
color: #A69E9F;
|
||||
margin-left: 4rpx;
|
||||
line-height: 40rpx;
|
||||
}
|
||||
}
|
||||
.itemTopRight{
|
||||
font-size: 40rpx;
|
||||
font-family: DINAlternate, DINAlternate;
|
||||
font-weight: bold;
|
||||
color: #160002;
|
||||
line-height: 40rpx;
|
||||
}
|
||||
}
|
||||
.itemBottom{
|
||||
margin-top: 24rpx;
|
||||
.itemBottomItem{
|
||||
width: 25%;
|
||||
display: inline-block;
|
||||
.bottomItemTitle{
|
||||
font-size: 28rpx;
|
||||
font-family: PingFangSC, PingFang SC;
|
||||
font-weight: 400;
|
||||
color: #A69E9F;
|
||||
line-height: 40rpx;
|
||||
margin-bottom: 4rpx;
|
||||
}
|
||||
.bottomItemValue{
|
||||
font-size: 32rpx;
|
||||
font-family: PingFangSC, PingFang SC;
|
||||
font-weight: 400;
|
||||
color: #160002;
|
||||
line-height: 40rpx;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
.ydRevenue{
|
||||
.revenueBoxHeader{
|
||||
background: linear-gradient(#FCF3E5 0%, #FDF6EC 22%,#FFFFFF 30%, #FFFFFF 100%);
|
||||
.headerTitle{
|
||||
color: #EC6C00;
|
||||
}
|
||||
}
|
||||
}
|
||||
.merchantRevenue{
|
||||
.revenueBoxHeader{
|
||||
background: linear-gradient(#E9F5F9 0%, #E9F5F9 22%,#FFFFFF 30%, #FFFFFF 100%);
|
||||
.headerTitle{
|
||||
color: #018ABD;
|
||||
}
|
||||
}
|
||||
}
|
||||
.otherData{
|
||||
.revenueBoxHeader{
|
||||
height: 530px;
|
||||
background: linear-gradient(#F1F7FF 0%, #FFFFFF 20% , #FFFFFF 100%);
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
</style>
|
||||
|
||||
@ -1,6 +1,6 @@
|
||||
@font-face {
|
||||
font-family: 'Alimama ShuHeiTi';
|
||||
src:url("/static/public/font2/uj4HAtspu5eH.woff");
|
||||
src:url("/static/public/font2/tzfy1e4Fbqbs.woff");
|
||||
font-weight: bold;
|
||||
font-style: normal;
|
||||
font-display: swap;
|
||||
|
||||
@ -1,6 +1,6 @@
|
||||
@font-face {
|
||||
font-family: 'Alimama ShuHeiTi';
|
||||
src:url("/static/public/font2/tzfy1e4Fbqbs.woff");
|
||||
src:url("/static/public/revenueStatistics/uKTjcNOXuZpJ.woff");
|
||||
font-weight: bold;
|
||||
font-style: normal;
|
||||
font-display: swap;
|
||||
|
||||
Loading…
x
Reference in New Issue
Block a user