This commit is contained in:
cclu 2023-09-28 18:41:45 +08:00
parent b98529c16a
commit 87bbc1d3fb
5 changed files with 767 additions and 92 deletions

View File

@ -176,7 +176,6 @@ export default {
position: "bottom",
lineHeight: 25,
float: 'center'
},
xAxis: {
disableGrid: true,

View File

@ -977,6 +977,7 @@ export default {
//
let systemInfo = uni.getSystemInfoSync()
this.statusBarHeight = Number(systemInfo.statusBarHeight)
uni.setStorageSync('phoneInfo',systemInfo)
this.menu = uni.getMenuButtonBoundingClientRect()
//
this.phoneWidth = systemInfo.windowWidth
@ -3593,6 +3594,7 @@ $iphoneHeight: env(safe-area-inset-bottom);
height: 286rpx;
margin-left: 32rpx;
border-radius: 16rpx;
margin-top: 24rpx;
background: linear-gradient(135deg, rgba(255, 238, 232, 1) 0%, rgba(255, 238, 231, 1) 79%, rgba(255, 221, 215, 1) 100%);
//background-image: url("https://eshangtech.com/ShopICO/ahyd-BID/nationalDay/indexBg.svg");
//background-repeat: no-repeat;

View File

@ -0,0 +1,160 @@
<template>
<div class="entryCarNumber">
<canvas class="entryCarNumber" canvas-id="entryCarNumber" id="entryCarNumber" @tap="handleTap"/>
</div>
</template>
<script>
import uCharts from '@/components/u-charts.js';
var uChartsInstance = {};
export default {
//
name: "entryCarNumber",
data() {
return {
trendsPath:'',
width:''
}
},
props: {
data: {
type: Object,
default: () => {}
}
},
watch: {
data: {
handler(value) {
this.trendsPath = ''
this.handleCarData(value)
},
immediate: true,
deep: true
}
},
methods:{
handleTap(e){
console.log('e',e)
uChartsInstance[e.target.id].showToolTip(e, {
formatter: (item, category, index, opts) => {
if (item.data){
return item.name + ":" + item.data + '万元';
}else{
return item.name + ":" + 0 + '万元';
}
// if (item.data){
// if (opts.series && opts.series.length>0){
// let text = ''
// opts.series.forEach(subItem=>{
// if (subItem.name===item.name){
// text= item.name + ":" + this.$util.noDecimal(subItem.real[index]) + '';
// }
// })
// return text
// }
// }else{
// return item.name + ":" + 0 + '';
// }
},
});
uChartsInstance[e.target.id].touchLegend(e);
},
//
handleCarData(value) {
let res = value
// let res = {
// categories: ["9.28","9.29","9.30","10.1","10.2","10.3","10.4","10.5","10.6","10.7"],
// series: [
// {
// name: "2022",
// data: [35,36,31,33,13,34,31,33,13,34]
// },
// {
// name: "2023",
// data: [18,27,21,24,6,28,21,24,6,28]
// }
// ]
// };
console.log('value22222222222',value)
let config = {
max:this.getSplitNumber(value.max)
}
this.drawCharts('entryCarNumber', res,config)
},
getSplitNumber(value){
if (value === 0){
return 5
}else{
let sum = Number(value) + Number(value) *0.2
return Number((sum / 1000).toFixed(0)) * 1000
}
},
drawCharts(id, data,config) {
const ctx = uni.createCanvasContext(id, this);
let _this = this
let phoneInfo = uni.getStorageSync('phoneInfo')
this.width = phoneInfo.screenWidth - 56
uChartsInstance[id] = new uCharts({
type: "area",
context: ctx,
width: _this.width ,
height: 213,
categories: data.categories,
series: data.series,
animation: false,
rotate: false,
rotateLock: false,
background: "#FFFFFF",
color: ["#1E80FF","#00B6FF"],
padding: [15, 15, 5, 5],
dataLabel: false,
enableScroll: false,
legend: {
show: true,
position: "bottom",
lineHeight: 25,
float: 'center'
},
xAxis: {
disableGrid: true
},
yAxis: {
gridType: "dash",
dashLength: 2,
splitNumber:4,
data: [
{
min: 0,
max:config.max
}
]
},
extra: {
area: {
type: "curve",
opacity: 0.2,
addLine: true,
width: 2,
gradient: true,
activeType: "hollow"
}
}
});
setTimeout( ()=>{
// this.canvasToTempImage('trends')
},2000)
},
}
}
</script>
<style scoped lang="scss">
.entryCarNumber{
width: 100%;
height: 200px;
.entryCarNumber{
width: 100%;
height: 100%;
}
}
</style>

View File

@ -0,0 +1,144 @@
<template>
<div class="main">
<canvas class="revenue" canvas-id="yearRevenue" id="yearRevenue" @tap="handleTap"/>
</div>
</template>
<script>
import uCharts from '@/components/u-charts.js';
var uChartsInstance = {};
export default {
//
name: "yearRevenue",
data() {
return {
trendsPath:'',
width:''
}
},
props: {
dataList: {
type: Object,
default: () => {}
}
},
watch: {
dataList: {
handler(value) {
this.trendsPath = ''
if (value){
this.handleCarData(value)
}
},
immediate: true,
deep: true
}
},
methods:{
handleTap(e){
console.log('e',e)
uChartsInstance[e.target.id].showToolTip(e, {
formatter: (item, category, index, opts) => {
if (item.data){
return item.name + ":" + this.$util.noDecimal(item.data) + '辆';
}else{
return item.name + ":" + 0 + '辆';
}
},
});
uChartsInstance[e.target.id].touchLegend(e);
},
//
handleCarData(value) {
let res = value
console.log('res',res)
// let res = {
// categories: ["9.28","9.29","9.30","10.1","10.2","10.3","10.4","10.5","10.6","10.7"],
// series: [
// {
// name: "2022",
// data: [35,36,31,33,13,34,31,33,13,34]
// },
// {
// name: "2023",
// data: [18,27,21,24,6,28,21,24,6,28]
// }
// ]
// };
let config = {
max:this.getSplitNumber(value.max)
}
this.drawCharts('yearRevenue', res,config)
},
getSplitNumber(value){
if (value === 0){
return 5
}else{
let sum = Number(value) + Number(value) *0.2
return Number((sum / 1000).toFixed(0)) * 1000
}
},
drawCharts(id, data,config) {
const ctx = uni.createCanvasContext(id, this);
let _this = this
let phoneInfo = uni.getStorageSync('phoneInfo')
this.width = phoneInfo.screenWidth - 28
uChartsInstance[id] = new uCharts({
type: "column",
context: ctx,
width: _this.width,
height: 208,
categories: data.categories,
series: data.series,
animation: false,
rotate: false,
rotateLock: false,
canvas2d: true,
background: "#FFFFFF",
color: ["#1E80FF", "#00B6FF","#ACB9CD"],
padding: [15, 40, 5, 0],
dataLabel: false,
legend: {
show: true,
position: "bottom",
lineHeight: 25,
float: 'center'
},
xAxis: {
disableGrid: true
},
yAxis: {
position:'right',
splitNumber:4,
data: [
{
min: 0,
max:config.max
}
]
},
extra: {
column: {
type: "group",
width: 5,
activeBgColor: "#000000",
activeBgOpacity: 0.08
}
}
});
},
}
}
</script>
<style scoped lang="scss">
.main{
width: 100%;
height: 200px;
.revenue{
width: 100%;
height: 100%;
position: relative;
z-index: 999;
}
}
</style>

View File

@ -1,7 +1,7 @@
<template>
<div class="main">
<div class="top">
<image class="topBg" src="https://eshangtech.com/ShopICO/ahyd-BID/nationalDay/pageBg.png"/>
<div class="top" :style="{height:menu.height + menu.top+212+'rpx'}">
<!-- <image class="topBg" src="https://eshangtech.com/ShopICO/ahyd-BID/nationalDay/pageBg.png"/>-->
<div class="header" :style="{height:menu.height + menu.top + 'px',top:0+'px'}">
<image :style="{bottom: ((statusBarHeight-24)/4)+'px' }" class="backArrow" src="https://eshangtech.com/ShopICO/ahyd-BID/examine/leftArrowWhite.svg" @click="handleBack"/>
</div>
@ -9,104 +9,111 @@
<p class="pageTitle" >欢度国庆</p>
</div>
</div>
<div class="pageContent">
<!-- 服务区当日营收 Top5-->
<div class="dailyRevenue">
<div class="dailyContent">
<image class="itemBg" src="https://eshangtech.com/ShopICO/ahyd-BID/nationalDay/revenueItemBg.png"/>
<div class="list">
<div class="listTop">
<p class="title">{{ dayName }}营收 Top5</p>
<div class="moreBox" @click="handleGoMore(1)">
<span class="text">查看更多</span>
<image class="moreIcon" src="https://eshangtech.com/ShopICO/ahyd-BID/commercial/rightArrow.svg"/>
</div>
</div>
<div class="listBox">
<div class="itemTop">
<image class="itemIcon" src="https://eshangtech.com/ShopICO/ahyd-BID/nationalDay/firstItemIcon.svg"/>
<div class="revenueBox">
<p class="revenueValue">{{ $util.fmoney(revenueSum,2) }}</p>
<p class="revenueText">总营收 <span>/</span></p>
<div class="pageContent" :style="{backgroundPositionY:-(menu.height + menu.top+200)+'rpx'}">
<div class="tabBox">
<div :class="selectTab===1?'tabItem selectTab':'tabItem'" @click="changeTab(1)">排行分析</div>
<div :class="selectTab===2?'tabItem selectTab':'tabItem'" @click="changeTab(2)">同比分析</div>
</div>
<div v-if="selectTab===1">
<!-- 服务区当日营收 Top5-->
<div class="dailyRevenue">
<div class="dailyContent">
<image class="itemBg" src="https://eshangtech.com/ShopICO/ahyd-BID/nationalDay/revenueItemBg.png"/>
<div class="list">
<div class="listTop">
<p class="title">{{ dayName }}营收 Top5</p>
<div class="moreBox" @click="handleGoMore(1)">
<span class="text">查看更多</span>
<image class="moreIcon" src="https://eshangtech.com/ShopICO/ahyd-BID/commercial/rightArrow.svg"/>
</div>
</div>
<div class="listItemTop" >
<div class="listTopItem" v-for="(item,index) in revenueList" :key="index">
<div class="itemLeft">
<image class="itemIcon" :src="'https://eshangtech.com/ShopICO/ahyd-BID/nationalDay/Top'+ (index +1) +'.png'" />
<!-- <span class="type">{{item.ShopRegionName}}</span>-->
<span class="name">{{item.Serverpart_Name.split('服务区')[0]}}</span>
</div>
<div class="itemRight">
<span class="itemValue">{{$util.fmoney(item.CashPay,2)}}<span class="unit">/</span></span>
<div class="listBox">
<div class="itemTop">
<image class="itemIcon" src="https://eshangtech.com/ShopICO/ahyd-BID/nationalDay/firstItemIcon.svg"/>
<div class="revenueBox">
<p class="revenueValue">{{ $util.fmoney(revenueSum,2) }}</p>
<p class="revenueText">总营收 <span>/</span></p>
</div>
</div>
<div class="listItemTop" >
<div class="listTopItem" v-for="(item,index) in revenueList" :key="index">
<div class="itemLeft">
<image class="itemIcon" :src="'https://eshangtech.com/ShopICO/ahyd-BID/nationalDay/Top'+ (index +1) +'.png'" />
<!-- <span class="type">{{item.ShopRegionName}}</span>-->
<span class="name">{{item.Serverpart_Name.split('服务区')[0]}}</span>
</div>
<div class="itemRight">
<span class="itemValue">{{$util.fmoney(item.CashPay,2)}}<span class="unit">/</span></span>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
<!-- 当日入区车流量 Top5-->
<div class="dailyEntry">
<div class="dailyContent">
<image class="itemBg" src="https://eshangtech.com/ShopICO/ahyd-BID/nationalDay/entryIcon.png"/>
<div class="list">
<div class="listTop">
<p class="title">{{dayName}}入区车流量 Top5</p>
<div class="moreBox" @click="handleGoMore(2)">
<span class="text">查看更多</span>
<image class="moreIcon" src="https://eshangtech.com/ShopICO/ahyd-BID/commercial/rightArrow.svg"/>
</div>
</div>
<div class="listBox">
<div class="itemTop">
<image class="itemIcon" src="https://eshangtech.com/ShopICO/ahyd-BID/nationalDay/pass.svg"/>
<div class="revenueBox">
<p class="revenueValue">{{$util.noDecimal(entrySum)}}</p>
<p class="revenueText">总车流量<span>/</span></p>
<!-- 当日入区车流量 Top5-->
<div class="dailyEntry">
<div class="dailyContent">
<image class="itemBg" src="https://eshangtech.com/ShopICO/ahyd-BID/nationalDay/entryIcon.png"/>
<div class="list">
<div class="listTop">
<p class="title">{{dayName}}入区车流量 Top5</p>
<div class="moreBox" @click="handleGoMore(2)">
<span class="text">查看更多</span>
<image class="moreIcon" src="https://eshangtech.com/ShopICO/ahyd-BID/commercial/rightArrow.svg"/>
</div>
</div>
<div class="listItemTop" >
<div class="listTopItem" v-for="(item,index) in entryCarList" :key="index">
<div class="itemLeft">
<image class="itemIcon" :src="'https://eshangtech.com/ShopICO/ahyd-BID/nationalDay/Top'+ (index +1) +'.png'" />
<span class="name">{{item.Serverpart_Name.split('服务区')[0]}}<span class="type">{{item.Serverpart_Region || ''}}</span></span>
</div>
<div class="itemRight">
<span class="itemValue">{{$util.noDecimal(item.Vehicle_Count) }}<span class="unit">/</span></span>
<div class="listBox">
<div class="itemTop">
<image class="itemIcon" src="https://eshangtech.com/ShopICO/ahyd-BID/nationalDay/pass.svg"/>
<div class="revenueBox">
<p class="revenueValue">{{$util.noDecimal(entrySum)}}</p>
<p class="revenueText">总车流量<span>/</span></p>
</div>
</div>
<div class="listItemTop" >
<div class="listTopItem" v-for="(item,index) in entryCarList" :key="index">
<div class="itemLeft">
<image class="itemIcon" :src="'https://eshangtech.com/ShopICO/ahyd-BID/nationalDay/Top'+ (index +1) +'.png'" />
<span class="name">{{item.Serverpart_Name.split('服务区')[0]}}<span class="type">{{item.Serverpart_Region || ''}}</span></span>
</div>
<div class="itemRight">
<span class="itemValue">{{$util.noDecimal(item.Vehicle_Count) }}<span class="unit">/</span></span>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
<!-- 当日入区车流量增幅 Top5-->
<div class="dailyEntryAdd">
<div class="dailyContent">
<image class="itemBg" src="https://eshangtech.com/ShopICO/ahyd-BID/nationalDay/entryAdd.png"/>
<div class="list">
<div class="listTop">
<p class="title">{{dayName}}入区车流量增幅 Top5</p>
<div class="moreBox" @click="handleGoMore(3)">
<span class="text">查看更多</span>
<image class="moreIcon" src="https://eshangtech.com/ShopICO/ahyd-BID/commercial/rightArrow.svg"/>
<!-- 当日入区车流量增幅 Top5-->
<div class="dailyEntryAdd">
<div class="dailyContent">
<image class="itemBg" src="https://eshangtech.com/ShopICO/ahyd-BID/nationalDay/entryAdd.png"/>
<div class="list">
<div class="listTop">
<p class="title">{{dayName}}入区车流量增幅 Top5</p>
<div class="moreBox" @click="handleGoMore(3)">
<span class="text">查看更多</span>
<image class="moreIcon" src="https://eshangtech.com/ShopICO/ahyd-BID/commercial/rightArrow.svg"/>
</div>
</div>
</div>
<div class="listBox">
<div class="listItemTop" >
<div class="listTopItem" v-for="(item,index) in addList" :key="index">
<div class="itemLeft">
<image class="itemIcon" :src="'https://eshangtech.com/ShopICO/ahyd-BID/nationalDay/Top'+ (index +1) +'.png'" />
<span class="name">{{item.Serverpart_Name.split('服务区')[0]}}<span class="type">{{item.Serverpart_Region || ''}}</span></span>
</div>
<div class="itemRight">
<image class="addIcon" src='/static/images/examine/add.svg'/>
<span class="itemValue">{{item.Entry_GrowthRate}}%</span>
<div class="listBox">
<div class="listItemTop" >
<div class="listTopItem" v-for="(item,index) in addList" :key="index">
<div class="itemLeft">
<image class="itemIcon" :src="'https://eshangtech.com/ShopICO/ahyd-BID/nationalDay/Top'+ (index +1) +'.png'" />
<span class="name">{{item.Serverpart_Name.split('服务区')[0]}}<span class="type">{{item.Serverpart_Region || ''}}</span></span>
</div>
<div class="itemRight">
<image class="addIcon" src='/static/images/examine/add.svg'/>
<span class="itemValue">{{item.Entry_GrowthRate}}%</span>
</div>
</div>
</div>
</div>
@ -114,16 +121,68 @@
</div>
</div>
</div>
<div v-if="selectTab===2" class="selectTab2">
<div class="detail">
<div class="detailTop">
<p class="tabTitle">营收同比</p>
<span class="timeText">{{showTimeText}}</span>
</div>
<div class="money">
<div class="moneyTop">
<p class="moneyTitle">2023年对客营收金额</p>
<!-- -->
<p class="sumMoney">{{ $util.fmoney(currentRevenue,2) }}</p>
</div>
<div class="moneyTop">
<p class="moneyTitle">2022年对客营收金额</p>
<p class="sumMoney">{{ $util.fmoney(compareRevenue,2) }}</p>
</div>
<div class="moneyTop">
<p class="moneyTitle">同期对比</p>
<p class="sumMoney">{{add}}%</p>
</div>
<div class="desc">
<div class="descLeft">
<p style="line-height: 36rpx">:</p>
</div>
<div class="descRight">
<p>2022年国庆假期为10.1-10.7,共7日</p>
<p>2023年双节假期为9.28-10.6,共8日</p>
<p></p>
</div>
</div>
</div>
</div>
<div class="detail">
<p class="tabTitle">入区车流量</p>
<span class="unit">单位</span>
<YearRevenue :dataList="carCompareList"/>
<p class="descText">入区车辆数按当期卡口设备的服务区计算的平均每日入区数量</p>
</div>
<div class="detail">
<p class="tabTitle">营收特征分析</p>
<span class="unit">单位万元</span>
<EntryCarNumber :data="compareRevenueList"/>
</div>
</div>
</div>
</div>
</template>
<script>
import request from '@/util/index.js'
import YearRevenue from "./components/yearRevenue.vue";
import EntryCarNumber from "./components/entryCarNumber.vue";
export default {
name: "index",
components: {EntryCarNumber, YearRevenue},
data(){
return {
selectTab:1,
statusBarHeight:0,
menu:{},
revenueList: [],//
@ -132,7 +191,17 @@ export default {
entrySum:0,//
addList:[],//
time:'',
dayName:''
dayName:'',
showTimeText:'',//
carCompareList:{},//
currentRevenue:0,//
compareRevenue:0,//
add:0,//
compareRevenueList:{},//
flagGetRevenue:false,//
flagGetCar:false,//
flagGetCarCompare:false,//
flagGetRevenueCompare:false,//
}
},
onLoad(query){
@ -149,6 +218,16 @@ export default {
})
this.time = query.time
const date = new Date(query.time)
if (new Date(query.time).getTime() > new Date('2023-09-27').getTime()){
const date = new Date(query.time)
let m = date.getMonth()+1
let d = date.getDate()
this.showTimeText = `9.28-${m}.${d}`
}else{
this.showTimeText = `9.28-9.28`
}
let y = date.getFullYear()
let m = date.getMonth() + 1
let d = date.getDate()
@ -160,6 +239,17 @@ export default {
this.handleGetCar(query.time)
},
methods:{
//
changeTab(num){
this.selectTab = num
if (num===2 && JSON.stringify(this.carCompareList)==='{}' || num===2 && JSON.stringify(this.compareRevenueList)==='{}'){
uni.showLoading({
title: '正在加载...'
})
this.handleGetCarCompare()
this.handleGetRevenueCompare()
}
},
handleGoMore(type){
uni.navigateTo({
url:`/pages/nationalPage/moreList?type=${type}&time=${this.time}&dayName=${this.dayName}`
@ -181,8 +271,8 @@ export default {
console.log('拿到营收排行',data)
this.revenueSum = data.Result_Data.OtherData
this.revenueList = data.Result_Data.List.slice(0,5)
if (this.entrySum && this.entryCarList && this.entryCarList.length>0 && this.addList && this.addList.length>0
&& this.revenueSum && this.revenueList && this.revenueList.length>0){
this.flagGetRevenue = true
if (this.flagGetRevenue && this.flagGetCar){
uni.hideLoading()
}
},
@ -194,7 +284,6 @@ export default {
ShowGrowthRate:true
}
const data = await request.$webGet('CommercialApi/BigData/GetBayonetGrowthAnalysis',req)
console.log('车流排行',data)
this.entrySum = data.Result_Data.sumEntryCount
this.entryCarList = data.Result_Data.EntryList.slice(0,5)
let list = []
@ -204,8 +293,113 @@ export default {
}
})
this.addList = list.slice(0,5)
if (this.entrySum && this.entryCarList && this.entryCarList.length>0 && this.addList && this.addList.length>0
&& this.revenueSum && this.revenueList && this.revenueList.length>0){
this.flagGetCar=true
if (this.flagGetRevenue && this.flagGetCar){
uni.hideLoading()
}
},
//
async handleGetCarCompare(){
const req = {
pushProvinceCode:this.useInfo.userData.ProvinceCode || '340000',
StatisticsStartDate:'2023/09/28',
StatisticsEndDate:'2023/10/07'
}
const data = await request.$webGet('CommercialApi/BigData/GetBayonetCompare',req)
console.log('compare',data)
let list = data.Result_Data
let compareList = []
let curList = []
let max = 0
data.Result_Data.compareList.forEach(item=>{
if (Number(item.value)>max){
max = Number(item.value)
}
compareList.push(Number(item.value))
})
data.Result_Data.curList.forEach(item=>{
if (Number(item.value)>max){
max = Number(item.value)
}
curList.push(Number(item.value))
})
let res = {
categories: ["9.28","9.29","9.30","10.1","10.2","10.3","10.4","10.5","10.6","10.7"],
series:[
{
name:"2022年",
data:compareList
},
{
name:"2023年",
data:curList
}
],
max:max
}
this.carCompareList = res
this.flagGetCarCompare= true
if (this.flagGetCarCompare && this.flagGetRevenueCompare){
uni.hideLoading()
}
},
//
async handleGetRevenueCompare(){
const req = {
pushProvinceCode:this.useInfo.userData.ProvinceCode || '340000',
StatisticsStartDate:'2023/09/28',
StatisticsEndDate:'2023/10/07',
StatisticsDate:this.time
}
const data = await request.$webGet('CommercialApi/Revenue/GetRevenueYOY',req)
console.log('22222',data)
this.currentRevenue = data.Result_Data.curRevenue
this.compareRevenue = data.Result_Data.compareRevenue
if (data.Result_Data.curRevenue && data.Result_Data.compareRevenue){
this.add = ((data.Result_Data.curRevenue / data.Result_Data.compareRevenue)*100).toFixed(2)
}
let list = data.Result_Data
let compareList = []
let realCompareList = []
let curList = []
let realCurList = []
let max =0
data.Result_Data.compareList.forEach(item=>{
let number = Number((item.value / 10000).toFixed(2))
if (number>max){
max = number
}
compareList.push(number)
realCompareList.push(item.value)
})
data.Result_Data.curList.forEach(item=>{
let number = Number((item.value / 10000).toFixed(2))
if (number>max){
max = number
}
curList.push(number)
realCurList.push(item.value)
})
let res = {
categories: ["9.28","9.29","9.30","10.1","10.2","10.3","10.4","10.5","10.6","10.7"],
series:[
{
name:"2022年",
data:compareList,
real:realCompareList
},
{
name:"2023年",
data:curList,
real:realCurList
}
],
max:max
}
this.compareRevenueList = res
console.log('this.compareRevenueList',this.compareRevenueList)
this.flagGetRevenueCompare=true
if (this.flagGetCarCompare && this.flagGetRevenueCompare){
uni.hideLoading()
}
}
@ -222,12 +416,16 @@ export default {
height: 100%;
.top{
width: 100%;
height: 560rpx;
position: relative;
background-image: url("https://eshangtech.com/ShopICO/ahyd-BID/nationalDay/pageBg.png");
background-repeat: no-repeat;
background-position: 0 0;
background-size: cover;
z-index:3;
.topBg{
width: 100%;
height: 100%;
z-index: 1;
z-index: 4;
}
.header{
position: fixed;
@ -268,7 +466,34 @@ export default {
width: 100%;
box-sizing: border-box;
padding: 0 32rpx 28rpx;
transform: translateY(-260rpx);
background-image: url("https://eshangtech.com/ShopICO/ahyd-BID/nationalDay/pageBg.png");
background-repeat: no-repeat;
background-size: contain;
//transform: translateY(-260rpx);
.tabBox{
width: 100%;
height: 76rpx;
background: #F6E8E5;
border-radius: 8rpx;
margin-bottom: 24rpx;
box-sizing: border-box;
padding: 8rpx;
.tabItem{
width: 50%;
height: 100%;
display: inline-block;
text-align: center;
line-height: 60rpx;
color: #786B6C;
}
.selectTab{
background: #fff;
border-radius: 8rpx;
color: #F95222;
}
}
.dailyRevenue{
width: 100%;
height: 680rpx;
@ -704,7 +929,152 @@ export default {
}
}
}
.selectTab2{
box-sizing: border-box;
padding: 24rpx;
background: #fff;
border-radius: 8rpx;
.detail{
margin-bottom: 24rpx;
.tabTitle{
font-size: 32rpx;
font-family: PingFangSC-Semibold, PingFang SC;
font-weight: 600;
color: #160002;
line-height: 40rpx;
margin-bottom: 12rpx;
}
.unit{
font-size: 24rpx;
font-family: PingFangSC-Regular, PingFang SC;
font-weight: 400;
color: #A69E9F;
line-height: 36rpx;
}
.descText{
font-size: 24rpx;
font-family: PingFangSC-Regular, PingFang SC;
font-weight: 400;
color: #A69E9F;
line-height: 36rpx;
margin-right: 8rpx;
}
.detailTop{
display: flex;
align-items: center;
justify-content: space-between;
.tabTitle{
font-size: 32rpx;
font-family: PingFangSC-Semibold, PingFang SC;
font-weight: 600;
color: #160002;
line-height: 40rpx;
margin-bottom: 12rpx;
}
.timeText{
font-size: 28rpx;
font-family: PingFangSC-Regular, PingFang SC;
font-weight: 400;
color: #A69E9F;
line-height: 40rpx
}
}
.money{
width:calc(100% - 32px);
padding: 18px 16px;
background: #F7F7F7;
border-radius: 4px;
.moneyTop{
display: flex;
align-items: center;
justify-content: space-between;
margin-bottom: 4px;
//.moneyTopItem{
// display: flex;
// align-items: center;
.moneyTitle{
font-size: 28rpx;
font-family: DINAlternate-Bold, DINAlternate;
font-weight: 400;
color: #160002;
line-height: 36rpx;
}
.icon{
width: 20px;
height: 20px;
margin-right: 8px;
}
.sumMoney{
font-size: 16px;
font-family: DINAlternate-Bold, DINAlternate;
font-weight: bold;
color: #341D00;
line-height: 24px;
.notice{
font-size: 14px;
font-family: PingFangSC-Regular, PingFang SC;
font-weight: 400;
color: #a69e9f;
line-height: 20px;
margin-left: 8rpx;
}
}
}
}
.desc{
display: flex;
align-items: flex-start;
justify-content: flex-end;
.descLeft{
font-size: 24rpx;
font-family: PingFangSC-Regular, PingFang SC;
font-weight: 400;
color: #A69E9F;
line-height: 36rpx;
margin-right: 8rpx;
}
.descRight{
p{
font-size: 24rpx;
font-family: PingFangSC-Regular, PingFang SC;
font-weight: 400;
color: #A69E9F;
line-height: 36rpx;
}
}
}
.bottom{
display: flex;
align-items: center;
margin-left: 24px;
.icon{
width: 14px;
height: 14px;
margin-right: 4px;
}
.add{
font-size: 14px;
font-family: PingFangSC-Regular, PingFang SC;
font-weight: 400;
color: #FA5151;
line-height: 20px;
margin-right: 4px;
}
.text{
font-size: 14px;
font-family: PingFangSC-Regular, PingFang SC;
font-weight: 400;
color: #A69E9F;
line-height: 20px;
}
}
}
}
}
}
}
</style>