update
This commit is contained in:
parent
6e21bca02c
commit
eb9eea4b1e
12
pages.json
12
pages.json
@ -82,6 +82,18 @@
|
||||
}
|
||||
]
|
||||
},
|
||||
{
|
||||
"root": "pages/revenue",
|
||||
"pages": [
|
||||
{
|
||||
"path": "index",
|
||||
"style": {
|
||||
"navigationBarTitleText": "",
|
||||
"navigationStyle": "custom"
|
||||
}
|
||||
}
|
||||
]
|
||||
},
|
||||
{ // 商业BI
|
||||
"root": "pages/commercialBI",
|
||||
"pages": [
|
||||
|
||||
@ -36,7 +36,7 @@
|
||||
<text class="typeItem">{{detail.BUSINESSTRADE_NAME}}</text>
|
||||
<text class="typeItem">{{detail.BRAND_TYPENAME}}</text>
|
||||
</div>
|
||||
<div class="suggest" v-if="detail.MerchantName">
|
||||
<div class="suggest" @click="handleShopDetail(detail)" v-if="detail.MerchantName">
|
||||
{{detail.MerchantName || ''}}
|
||||
<!-- <text class="value">{{detail.COMMISSION_RATIO}}</text>-->
|
||||
<!-- <text class="text">建议提成比例</text>-->
|
||||
@ -181,12 +181,12 @@ export default {
|
||||
},
|
||||
handleShopDetail(item){
|
||||
console.log('item',item)
|
||||
// if (item.COOPMERCHANTS_ID && item.COOPMERCHANTS_ID!=='-1'){
|
||||
// uni.navigateTo({
|
||||
// url:`/pages/commercialBI/shopDetail?id=${item.COOPMERCHANTS_ID}&COOPMERCHANTSID=${item.COOPMERCHANTS_ID_Encrypted}`
|
||||
// })
|
||||
// }
|
||||
if (item.MerchantID && item.MerchantID!=='-1'){
|
||||
uni.navigateTo({
|
||||
url:`/pages/commercialBI/shopDetail?id=${item.MerchantID}&COOPMERCHANTSID=${item.MerchantID_Encrypt}`
|
||||
})
|
||||
}
|
||||
},
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
@ -66,7 +66,9 @@
|
||||
</div>
|
||||
<view style="display: flex;justify-content: flex-end">
|
||||
<div class="suggest" @click.stop="handleShopDetail(item)" v-if="item.MerchantName">
|
||||
<view style="margin-left: 20%;width: 80%;display: inline-block;">
|
||||
{{item.MerchantName || ''}}
|
||||
</view>
|
||||
<!-- <text class="value">{{item.COMMISSION_RATIO || '-'}}</text>-->
|
||||
<!-- <text class="text">建议提成比例</text>-->
|
||||
</div>
|
||||
@ -611,6 +613,9 @@ export default {
|
||||
}
|
||||
.suggest{
|
||||
display: inline-block;
|
||||
box-sizing: border-box;
|
||||
width: 100%;
|
||||
//width: 80%;
|
||||
min-height: 25px;
|
||||
padding: 0 8px;
|
||||
background: linear-gradient(90deg, RGBA(222, 231, 255, 1) 0%, RGBA(241, 246, 255, 1) 100%);
|
||||
|
||||
@ -78,7 +78,7 @@
|
||||
<div class="businessProject" >
|
||||
<div class="top">
|
||||
<text class="projectTitle">经营项目</text>
|
||||
<text v-if="serviceList && serviceList.length>0" class="number">({{`${serviceList.length}`}})</text>
|
||||
<text v-if="projectLong" class="number">({{projectLong}})</text>
|
||||
</div>
|
||||
<scroll-view class="list" scroll-y="true" :scroll-with-animation="true">
|
||||
<!-- @click="handleShopDetail(item)"-->
|
||||
@ -185,7 +185,8 @@ export default {
|
||||
4: '特产、工艺品等其他类',
|
||||
5: '汽修类',
|
||||
},
|
||||
personList:[]
|
||||
personList:[],
|
||||
projectLong: 0
|
||||
}
|
||||
},
|
||||
onLoad(query){
|
||||
@ -251,6 +252,7 @@ export default {
|
||||
console.log('list',data)
|
||||
this.serviceList = data.Result_Data.AccountReceivablesList
|
||||
if (this.serviceList && this.serviceList.length>0){
|
||||
this.projectLong = this.serviceList.length
|
||||
this.serviceList.forEach(item=>{
|
||||
const nowDay = new Date().getTime()
|
||||
const startDay = new Date(item.PROJECT_STARTDATE).getTime()
|
||||
|
||||
@ -234,22 +234,6 @@
|
||||
<view class="detailLabel">整改结果</view>
|
||||
</view>
|
||||
</view>
|
||||
<!-- <view class="itemBox" v-else>-->
|
||||
<!-- <view class="detailItem" >-->
|
||||
<!-- <view class="detailValue">-->
|
||||
<!-- <view class="detailValue"><image class="right" src="/static/images/examine/gou.svg"/></view>-->
|
||||
<!-- </view>-->
|
||||
<!-- <view class="detailLabel">情况及问题</view>-->
|
||||
<!-- </view>-->
|
||||
<!-- <view class="detailItem">-->
|
||||
<!-- <view class="detailValue"><image class="right" src="/static/images/examine/gou.svg"/></view>-->
|
||||
<!-- <view class="detailLabel">整改期限</view>-->
|
||||
<!-- </view>-->
|
||||
<!-- <view class="detailItem">-->
|
||||
<!-- <view class="detailValue"><image class="right" src="/static/images/examine/gou.svg"/></view>-->
|
||||
<!-- <view class="detailLabel">整改结果</view>-->
|
||||
<!-- </view>-->
|
||||
<!-- </view>-->
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
|
||||
@ -166,14 +166,14 @@
|
||||
<view class="detailMessage">
|
||||
<view class="otherDetailTop">
|
||||
<view class="otherDetailTopLeft">
|
||||
<view class="yearAll">126.32</view>
|
||||
<view class="yearAll">{{showTableData.allRevenueYear?showTableData.allRevenueYear:''}}</view>
|
||||
<view class="yearLabel">年度累计<text class="unit">/亿元</text></view>
|
||||
</view>
|
||||
|
||||
<view class="otherDetailRight">
|
||||
<view class="otherDetailAddBox">
|
||||
<image class="otherDetailAddIcon"/>
|
||||
<text class="otherDetailAddValue">11.07%</text>
|
||||
<image class="otherDetailAddIcon" :src="Number(showTableData.yearYoY)>0?'/static/images/examine/add.svg':Number(yesObj.yearYOY)<0?'/static/images/examine/reduce.svg':''"/>
|
||||
<text class="otherDetailAddValue">{{showTableData.yearYoY?showTableData.yearYoY+'%':''}}</text>
|
||||
</view>
|
||||
<view class="otherDetailAddLabel">同比</view>
|
||||
</view>
|
||||
@ -182,60 +182,60 @@
|
||||
<view class="otherDetailMiddle">
|
||||
<view class="middleItem" style="margin-bottom: 16rpx">
|
||||
<text class="itemLabel">对客营收<text class="itemText">/环比</text></text>
|
||||
<text class="itemValue">+19.54%</text>
|
||||
<text class="itemValue">{{showTableData.customerQoQ?showTableData.customerQoQ:''}}</text>
|
||||
</view>
|
||||
<view class="middleItem" style="margin-bottom: 16rpx">
|
||||
<text class="itemLabel">自营收入<text class="itemText">/环比</text></text>
|
||||
<text class="itemValue">+19.54%</text>
|
||||
<text class="itemValue">{{typeList[0].addQOQ?typeList[0].addQOQ:''}}</text>
|
||||
</view>
|
||||
<view class="middleItem">
|
||||
<text class="itemLabel">外租收入<text class="itemText">/环比</text></text>
|
||||
<text class="itemValue">+19.54%</text>
|
||||
<text class="itemValue">{{typeList[1].addQOQ?typeList[1].addQOQ:''}}</text>
|
||||
</view>
|
||||
</view>
|
||||
|
||||
<view class="otherDetailBottom">
|
||||
<view class="bottomItem" style="margin-bottom: 16rpx">
|
||||
<view class="itemLeft">
|
||||
<image class="leftIcon"/>
|
||||
<image class="leftIcon" :src="1<=selectMonth && selectMonth<=3?'https://eshangtech.com/ShopICO/ahyd-BID/newIndex/1stEntryCar.svg':4<=selectMonth && selectMonth<=6?'https://eshangtech.com/ShopICO/ahyd-BID/newIndex/2stEntryCar.svg':7<=selectMonth && selectMonth<=9?'https://eshangtech.com/ShopICO/ahyd-BID/newIndex/3stEntryCar.svg':'https://eshangtech.com/ShopICO/ahyd-BID/newIndex/4stEntryCar.svg'"/>
|
||||
<text class="itemTitle">入区车流</text>
|
||||
</view>
|
||||
<view class="itemCenter">
|
||||
<text class="itemValue">+198.54%</text>
|
||||
<text class="itemValue">{{trafficYOYObj.Vehicle_GrowthRate?trafficYOYObj.Vehicle_GrowthRate>0?'+'+trafficYOYObj.Vehicle_GrowthRate+'%':trafficYOYObj.Vehicle_GrowthRate+'%':'-'}}</text>
|
||||
<text class="itemText">/同比</text>
|
||||
</view>
|
||||
<view class="itemRight">
|
||||
<text class="itemValue">+198.54%</text>
|
||||
<text class="itemValue">{{trafficQOQObj.Vehicle_GrowthRate?trafficQOQObj.Vehicle_GrowthRate>0?'+'+trafficQOQObj.Vehicle_GrowthRate+'%':trafficQOQObj.Vehicle_GrowthRate+'%':'-'}}</text>
|
||||
<text class="itemText">/环比</text>
|
||||
</view>
|
||||
</view>
|
||||
|
||||
<view class="bottomItem" style="margin-bottom: 16rpx">
|
||||
<view class="itemLeft">
|
||||
<image class="leftIcon"/>
|
||||
<image class="leftIcon" :src="1<=selectMonth && selectMonth<=3?'https://eshangtech.com/ShopICO/ahyd-BID/newIndex/1stEntryRate.svg':4<=selectMonth && selectMonth<=6?'https://eshangtech.com/ShopICO/ahyd-BID/newIndex/2stEntryRate.svg':7<=selectMonth && selectMonth<=9?'https://eshangtech.com/ShopICO/ahyd-BID/newIndex/3stEntryRate.svg':'https://eshangtech.com/ShopICO/ahyd-BID/newIndex/4stEntryRate.svg'"/>
|
||||
<text class="itemTitle">入区率</text>
|
||||
</view>
|
||||
<view class="itemCenter">
|
||||
<text class="itemValue">+198.54%</text>
|
||||
<text class="itemValue">{{trafficYOYObj.Entry_GrowthRate?trafficYOYObj.Entry_GrowthRate>0?'+'+trafficYOYObj.Entry_GrowthRate+'%':trafficYOYObj.Entry_GrowthRate+'%':'-'}}</text>
|
||||
<text class="itemText">/同比</text>
|
||||
</view>
|
||||
<view class="itemRight">
|
||||
<text class="itemValue">+198.54%</text>
|
||||
<text class="itemValue">{{trafficQOQObj.Entry_GrowthRate?trafficQOQObj.Entry_GrowthRate>0?'+'+trafficQOQObj.Entry_GrowthRate+'%':trafficQOQObj.Entry_GrowthRate+'%':'-'}}</text>
|
||||
<text class="itemText">/环比</text>
|
||||
</view>
|
||||
</view>
|
||||
|
||||
<view class="bottomItem">
|
||||
<view class="itemLeft">
|
||||
<image class="leftIcon"/>
|
||||
<image class="leftIcon" :src="1<=selectMonth && selectMonth<=3?'https://eshangtech.com/ShopICO/ahyd-BID/newIndex/1stEntryFix.svg':4<=selectMonth && selectMonth<=6?'https://eshangtech.com/ShopICO/ahyd-BID/newIndex/2stEntryFix.svg':7<=selectMonth && selectMonth<=9?'https://eshangtech.com/ShopICO/ahyd-BID/newIndex/3stEntryFix.svg':'https://eshangtech.com/ShopICO/ahyd-BID/newIndex/4stEntryFix.svg'"/>
|
||||
<text class="itemTitle">停留时长</text>
|
||||
</view>
|
||||
<view class="itemCenter">
|
||||
<text class="itemValue">+198.54%</text>
|
||||
<text class="itemValue">{{trafficYOYObj.StayTimes_GrowthRate?trafficYOYObj.StayTimes_GrowthRate>0?'+'+trafficYOYObj.StayTimes_GrowthRate+'%':trafficYOYObj.StayTimes_GrowthRate+'%':'-'}}</text>
|
||||
<text class="itemText">/同比</text>
|
||||
</view>
|
||||
<view class="itemRight">
|
||||
<text class="itemValue">+198.54%</text>
|
||||
<text class="itemValue">{{trafficQOQObj.StayTimes_GrowthRate?trafficQOQObj.StayTimes_GrowthRate>0?'+'+trafficQOQObj.StayTimes_GrowthRate+'%':trafficQOQObj.StayTimes_GrowthRate+'%':'-'}}</text>
|
||||
<text class="itemText">/环比</text>
|
||||
</view>
|
||||
</view>
|
||||
@ -340,7 +340,7 @@
|
||||
<image class="timeIcon" src="https://eshangtech.com/ShopICO/ahyd-BID/newIndex/4stTimeIcon.svg"/>
|
||||
<image class="typeImg" src="https://eshangtech.com/ShopICO/ahyd-BID/newIndex/4stTypeImg.svg"/>
|
||||
</view>
|
||||
<view class="funItemView" style="background-image: url('https://eshangtech.com/ShopICO/ahyd-BID/newIndex/funFifth.svg')">
|
||||
<view class="funItemView" style="background-image: url('https://eshangtech.com/ShopICO/ahyd-BID/newIndex/funFifth.svg')" @click="handleMoney">
|
||||
<text class="funItemTitle" style="color: #7C46CD;">财务报表</text>
|
||||
<image class="timeIcon" src="https://eshangtech.com/ShopICO/ahyd-BID/newIndex/5stTimeIcon.svg"/>
|
||||
<image class="typeImg" src="https://eshangtech.com/ShopICO/ahyd-BID/newIndex/5stTypeImg.svg"/>
|
||||
@ -804,6 +804,8 @@ export default {
|
||||
phoneWidth:0,// 手机的宽度
|
||||
progressObj:{},//自营和外租的占比
|
||||
showHaveNotice:false,// 显示月份详情卡片的进度条点击显示的内容
|
||||
trafficQOQObj:{},// 环比对象
|
||||
trafficYOYObj:{},// 同比对象
|
||||
}
|
||||
},
|
||||
watch:{
|
||||
@ -1180,6 +1182,8 @@ export default {
|
||||
this.handleGetExamine()
|
||||
// 获取巡检数据
|
||||
this.handleGetDailyPatrol()
|
||||
// 获取全省平均车流量
|
||||
this.handleGetAllCarTraffic()
|
||||
} else if (this.user.Membership_Id){ // 默认
|
||||
// 不是从推送进来 走正常的请求方法
|
||||
// if (!this.PushAuthority){return}
|
||||
@ -1202,6 +1206,8 @@ export default {
|
||||
this.handleGetExamine()
|
||||
// 获取巡检数据
|
||||
this.handleGetDailyPatrol()
|
||||
// 获取全省平均车流量
|
||||
this.handleGetAllCarTraffic()
|
||||
}
|
||||
|
||||
// 老代码 不知道干啥用的
|
||||
@ -1271,6 +1277,9 @@ export default {
|
||||
this.$util.toNextRoute('navigateTo', `/pages/commercialBI/formatPortrait?time=${this.lastDay}&serviceInfo=${JSON.stringify(this.nearServiceInfo)}`)
|
||||
// uni.showToast({title: '栏目建设中', icon: 'none'})
|
||||
},
|
||||
handleMoney(){
|
||||
this.$util.toNextRoute('navigateTo', `/pages/revenue/index`)
|
||||
},
|
||||
handleSearch(type){
|
||||
if (type ==='special'){
|
||||
if(!this.isReturn){
|
||||
@ -1542,6 +1551,7 @@ export default {
|
||||
progressAll+=Number(item.value)
|
||||
let index = (item.value /10000).toString().indexOf('.')
|
||||
item.showValue =(item.value /10000).toString().substring(0,index+3)
|
||||
// 同比
|
||||
if (item.data){
|
||||
let number = ((item.value - item.data)/item.data)*100
|
||||
if (number>0){
|
||||
@ -1552,6 +1562,17 @@ export default {
|
||||
item.add = null
|
||||
}
|
||||
}
|
||||
// 环比
|
||||
if(item.key){
|
||||
let number = ((item.value - item.key)/item.key)*100
|
||||
if (number>0){
|
||||
item.addQOQ ='+'+number.toFixed(2)+'%'
|
||||
}else if(number<0){
|
||||
item.addQOQ =number.toFixed(2)+'%'
|
||||
}else{
|
||||
item.addQOQ = null
|
||||
}
|
||||
}
|
||||
})
|
||||
this.typeList = result.BusinessTypeList
|
||||
|
||||
@ -1585,12 +1606,29 @@ export default {
|
||||
this.showTableData.add = Number(((this.showTableData.CashPay-this.showTableData.RevenueYOY)/this.showTableData.RevenueYOY*100).toFixed(2))
|
||||
this.showTableData.add = this.showTableData.add>0?'+'+this.showTableData.add:this.showTableData.add
|
||||
}
|
||||
if (this.showTableData.YearRevenueAmount){
|
||||
console.log('result.MonthRevenueModel',result.MonthRevenueModel)
|
||||
// 不四舍五入的截取年度累计
|
||||
let index = (result.MonthRevenueModel.YearRevenueAmount / 100000000).toString().indexOf('.')
|
||||
this.showTableData.allRevenueYear = (result.MonthRevenueModel.YearRevenueAmount / 100000000).toString().substring(0,index+3)
|
||||
// 同比去年的年度累计
|
||||
let yearYoY = (((result.MonthRevenueModel.YearRevenueAmount - result.MonthRevenueModel.YearRevenueYOY) / result.MonthRevenueModel.YearRevenueYOY)*100).toFixed(2)
|
||||
console.log('yearYoY',yearYoY)
|
||||
this.showTableData.yearYoY = Number(yearYoY)
|
||||
}
|
||||
if (this.showTableData.RevenueQOQ){
|
||||
// 对客的环比
|
||||
let customerQoQ = (((result.MonthRevenueModel.CashPay - result.MonthRevenueModel.RevenueQOQ) / result.MonthRevenueModel.RevenueQOQ)*100).toFixed(2)
|
||||
console.log('customerQoQ',customerQoQ)
|
||||
this.showTableData.customerQoQ = Number(customerQoQ)>0?'+'+customerQoQ+'%':Number(customerQoQ)<0?'-'+customerQoQ+'%':''
|
||||
|
||||
}
|
||||
|
||||
this.yesObj = result.RevenuePushModel
|
||||
if (this.yesObj){
|
||||
let indexYes = (result.RevenuePushModel.CashPay / 10000).toString().indexOf('.')
|
||||
this.yesObj.CashPay = (result.RevenuePushModel.CashPay / 10000).toString().substring(0,indexYes+3)
|
||||
|
||||
}
|
||||
|
||||
if (result.GrowthRate){
|
||||
@ -1627,7 +1665,36 @@ export default {
|
||||
// this.yearAmountAdd = result.YearRevenueAmount?this.$util.fmoney(result.YearRevenueAmount):'-'
|
||||
// this.modelProgress = result.BusinessTypeList
|
||||
// 只有当前面的接口通了 才能一起处理数据的方法
|
||||
|
||||
},
|
||||
//获取全省平均车流量
|
||||
handleGetAllCarTraffic(){
|
||||
const date = new Date(this.lastDay)
|
||||
let time
|
||||
if (this.selectMonth === date.getMonth()+1){
|
||||
time = this.lastDay
|
||||
}else{
|
||||
const date = new Date(this.single)
|
||||
let y = date.getFullYear()
|
||||
let m = date.getMonth() + 1
|
||||
if(m<10){
|
||||
m='0'+m
|
||||
}
|
||||
time = `${y}${m}`
|
||||
}
|
||||
const req = {
|
||||
Province_Code:this.useInfo.userData.ProvinceCode || '340000',
|
||||
Statistics_Date:time
|
||||
}
|
||||
request.$webGet('CommercialApi/Revenue/GetProvinceAvgBayonetAnalysis',req).then(res=>{
|
||||
console.log('res',res)
|
||||
res.Result_Data.List.forEach(item=>{
|
||||
if (item.Serverpart_Name==='QOQ'){
|
||||
this.trafficQOQObj = item
|
||||
}else if(item.Serverpart_Name==='YOY'){
|
||||
this.trafficYOYObj = item
|
||||
}
|
||||
})
|
||||
})
|
||||
},
|
||||
defaultMsg() {
|
||||
let option = null
|
||||
|
||||
1703
pages/newamine/index.vue
Normal file
1703
pages/newamine/index.vue
Normal file
File diff suppressed because it is too large
Load Diff
81
pages/revenue/component/yearCharts.vue
Normal file
81
pages/revenue/component/yearCharts.vue
Normal file
@ -0,0 +1,81 @@
|
||||
<template>
|
||||
<view style="width: 68rpx;height: 68rpx">
|
||||
<canvas style="width: 68rpx;height: 68rpx" canvas-id="month" id="month"/>
|
||||
</view>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import uCharts from '@/components/u-charts.js';
|
||||
|
||||
var uChartsInstance = {};
|
||||
export default {
|
||||
name: "YearCharts",
|
||||
data() {
|
||||
return {}
|
||||
},
|
||||
props: {
|
||||
success: {
|
||||
type: Number,
|
||||
default: 0
|
||||
}
|
||||
},
|
||||
watch: {
|
||||
success: {
|
||||
handler(value) {
|
||||
console.log('value111', value)
|
||||
let success = Number(value) > 100 ? 100 : Number(value)
|
||||
let error = Number(100 - value) < 0 ? 0 : Number(100 - value)
|
||||
let res = {
|
||||
series: [{
|
||||
data: [{name: '已完成', value: success}, {name: '未完成', value: error}]
|
||||
}]
|
||||
}
|
||||
console.log('res',res)
|
||||
this.drawCharts('month', res)
|
||||
}
|
||||
}
|
||||
},
|
||||
methods: {
|
||||
drawCharts(id, data) {
|
||||
const ctx = uni.createCanvasContext(id, this);
|
||||
let _this = this
|
||||
uChartsInstance[id] = new uCharts({
|
||||
type: "ring",
|
||||
context: ctx,
|
||||
width: 34,
|
||||
height: 34,
|
||||
series: data.series,
|
||||
animation: true,
|
||||
rotate: false,
|
||||
rotateLock: false,
|
||||
background: "#FFFFFF",
|
||||
color: ["#018ABD", "#CCE8F2"],
|
||||
padding: [0,0,0,0],
|
||||
dataLabel: false,
|
||||
enableScroll: false,
|
||||
legend: {
|
||||
show: false,
|
||||
position: "right",
|
||||
lineHeight: 25
|
||||
},
|
||||
extra: {
|
||||
ring: {
|
||||
ringWidth: 4,
|
||||
activeOpacity: 0.5,
|
||||
activeRadius: 10,
|
||||
offsetAngle: -90,
|
||||
labelWidth: 0,
|
||||
border: false,
|
||||
borderWidth: 3,
|
||||
customRadius: 17,
|
||||
borderColor: "#FFFFFF"
|
||||
}
|
||||
}
|
||||
});
|
||||
},
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style lang="scss" scoped>
|
||||
</style>
|
||||
364
pages/revenue/index.vue
Normal file
364
pages/revenue/index.vue
Normal file
@ -0,0 +1,364 @@
|
||||
<template>
|
||||
<view class="main">
|
||||
<view class="header">
|
||||
<view class="headerTop" :style="{top: menu.top + 'px',height:menu.height + 'px'}">
|
||||
<image @click="handleBack" class="backIcon" src="https://eshangtech.com/ShopICO/ahyd-BID/examine/leftArrowWhite.svg"></image>
|
||||
</view>
|
||||
|
||||
<view class="pageTitle" :style="{top: (menu.bottom+18) +'px'}">收支预测</view>
|
||||
|
||||
<view class="headerDetail" :style="{top: (menu.bottom+68) +'px'}">
|
||||
<view class="detailBox">
|
||||
<view class="detailPage">月度累计收支金额</view>
|
||||
|
||||
<view class="moneyBox">
|
||||
<view class="moneyItem">
|
||||
<view class="itemTop">
|
||||
<view class="itemChart">
|
||||
<YearCharts :success="number"/>
|
||||
</view>
|
||||
<view class="itemMessage">
|
||||
<text class="itemRate">32.54%</text>
|
||||
<text class="itemLabel">成本比</text>
|
||||
</view>
|
||||
</view>
|
||||
<view class="successBox">
|
||||
<text class="successNumber">119.01</text>
|
||||
<text class="successTime">2022年完成<text class="successUnit">/万元</text></text>
|
||||
</view>
|
||||
</view>
|
||||
|
||||
<view class="moneyItem">
|
||||
<view class="itemTop">
|
||||
<view class="itemChart">
|
||||
<YearCharts :success="number"/>
|
||||
</view>
|
||||
<view class="itemMessage">
|
||||
<text class="itemRate">32.54%</text>
|
||||
<text class="itemLabel">成本比</text>
|
||||
</view>
|
||||
</view>
|
||||
<view class="successBox">
|
||||
<text class="successNumber">119.01</text>
|
||||
<text class="successTime">2022年完成<text class="successUnit">/万元</text></text>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
|
||||
<view class="content">
|
||||
<view class="profitYear">
|
||||
<view class="itemBox">
|
||||
<view class="itemBoxTitle">年度累计利润</view>
|
||||
|
||||
<view class="itemDetailBox">
|
||||
<view class="detailBoxTop">
|
||||
<text class="successLabel">完成率</text>
|
||||
<text class="successValue">34.63%</text>
|
||||
</view>
|
||||
|
||||
<view class="progress">
|
||||
<view class="have" :style="{width:'36%'}"></view>
|
||||
</view>
|
||||
|
||||
<view class="yearDetail">
|
||||
<view class="yearItem">
|
||||
<view class="itemValue">119.01</view>
|
||||
<text class="itemLabel">2022年完成<text class="itemUnit">/万元</text></text>
|
||||
</view>
|
||||
|
||||
<view class="yearItem">
|
||||
<view class="itemValue">300.00</view>
|
||||
<text class="itemLabel">2023年预计<text class="itemUnit">/万元</text></text>
|
||||
</view>
|
||||
|
||||
<view class="yearItem">
|
||||
<view class="itemValue">12.84%</view>
|
||||
<text class="itemLabel">计划比</text>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
</template>
|
||||
<script>
|
||||
import YearCharts from "./component/yearCharts.vue";
|
||||
export default {
|
||||
components:{YearCharts},
|
||||
data(){
|
||||
return {
|
||||
windowHeight: null,
|
||||
statusBarHeight: null,
|
||||
menu:{},
|
||||
number:0
|
||||
}
|
||||
},
|
||||
onLoad(){
|
||||
// 获取手机参数对页面进行适配
|
||||
let systemInfo = uni.getSystemInfoSync()
|
||||
this.windowHeight = systemInfo.windowHeight
|
||||
this.statusBarHeight = Number(systemInfo.statusBarHeight)
|
||||
this.menu = uni.getMenuButtonBoundingClientRect()
|
||||
console.log('this.menu',this.menu)
|
||||
let _this = this
|
||||
setTimeout(()=>{
|
||||
_this.number = 40
|
||||
},100)
|
||||
},
|
||||
methods:{
|
||||
// 返回按钮的方法
|
||||
handleBack(){
|
||||
uni.switchTab({
|
||||
url: '/pages/index/index'
|
||||
})
|
||||
// if (this.come==='index'){
|
||||
//
|
||||
// }else{
|
||||
// uni.switchTab({
|
||||
// url: '/pages/userCenter/userCenter'
|
||||
// })
|
||||
// }
|
||||
},
|
||||
}
|
||||
}
|
||||
</script>
|
||||
<style scoped lang="scss">
|
||||
@import '/static/public/font/stylesheet.css';
|
||||
.main{
|
||||
width: 100%;
|
||||
min-height: 100vh;
|
||||
.header{
|
||||
width: 100%;
|
||||
height: 664rpx;
|
||||
background-image: url("https://eshangtech.com/ShopICO/ahyd-BID/revenueBox/revenyeBg.png");
|
||||
background-repeat: no-repeat;
|
||||
background-size: 100% 560rpx;
|
||||
position: relative;
|
||||
.headerTop{
|
||||
width: 100%;
|
||||
position: absolute;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
.backIcon{
|
||||
width: 48rpx;
|
||||
height: 48rpx;
|
||||
margin-left: 32rpx;
|
||||
}
|
||||
}
|
||||
.pageTitle{
|
||||
position: absolute;
|
||||
left: 32rpx;
|
||||
font-size: 56rpx;
|
||||
font-family: Alimama ShuHeiTi;
|
||||
font-weight: bold;
|
||||
color: #FFFFFF;
|
||||
line-height: 68rpx;
|
||||
}
|
||||
|
||||
.headerDetail{
|
||||
position: absolute;
|
||||
width: calc(100% - 64rpx);
|
||||
left: 32rpx;
|
||||
background: #FFFFFF;
|
||||
border-radius: 16rpx;
|
||||
box-sizing: border-box;
|
||||
padding: 4rpx;
|
||||
.detailBox{
|
||||
width: 100%;
|
||||
box-sizing: border-box;
|
||||
padding: 22rpx 24rpx;
|
||||
background: linear-gradient(180deg, #E9F5FA 0%, #FBFDFE 100%);
|
||||
border-radius: 16rpx;
|
||||
.detailPage{
|
||||
font-size: 36rpx;
|
||||
font-family: Alimama ShuHeiTi;
|
||||
font-weight: bold;
|
||||
color: #018ABD;
|
||||
line-height: 44rpx;
|
||||
}
|
||||
.moneyBox{
|
||||
width: 100%;
|
||||
height: 248rpx;
|
||||
background: #fff;
|
||||
margin-top: 22rpx;
|
||||
border-radius: 12rpx;
|
||||
box-sizing: border-box;
|
||||
padding: 32rpx;
|
||||
display: flex;
|
||||
.moneyItem{
|
||||
width: 50%;
|
||||
height: 100%;
|
||||
.itemTop{
|
||||
width: 100%;
|
||||
height: 68rpx;
|
||||
display: flex;
|
||||
box-sizing: border-box;
|
||||
.itemChart{
|
||||
margin-top: 8rpx;
|
||||
width: 68rpx;
|
||||
height: 68rpx;
|
||||
}
|
||||
.itemMessage{
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
margin-left: 16rpx;
|
||||
.itemRate{
|
||||
font-size: 40rpx;
|
||||
font-family: DINAlternate-Bold, DINAlternate;
|
||||
font-weight: bold;
|
||||
color: #018ABD;
|
||||
line-height: 48rpx;
|
||||
}
|
||||
.itemLabel{
|
||||
font-size: 24rpx;
|
||||
font-family: PingFangSC-Regular, PingFang SC;
|
||||
font-weight: 400;
|
||||
color: #786B6C;
|
||||
line-height: 36rpx;
|
||||
}
|
||||
}
|
||||
}
|
||||
.successBox{
|
||||
margin-top: 32rpx;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
.successNumber{
|
||||
font-size: 32rpx;
|
||||
font-family: DINAlternate-Bold, DINAlternate;
|
||||
font-weight: bold;
|
||||
color: #160002;
|
||||
line-height: 36rpx;
|
||||
margin-bottom: 4rpx;
|
||||
}
|
||||
.successTime{
|
||||
font-size: 24rpx;
|
||||
font-family: PingFangSC-Regular, PingFang SC;
|
||||
font-weight: 400;
|
||||
color: #786B6C;
|
||||
line-height: 36rpx;
|
||||
.successUnit{
|
||||
font-size: 24rpx;
|
||||
font-family: PingFangSC-Regular, PingFang SC;
|
||||
font-weight: 400;
|
||||
color: #A69E9F;
|
||||
line-height: 36rpx;
|
||||
margin-left: 4rpx;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.content{
|
||||
width: 100%;
|
||||
box-sizing: border-box;
|
||||
padding: 24rpx 36rpx 0;
|
||||
background: #F5F5F5;
|
||||
.profitYear{
|
||||
width: 100%;
|
||||
height: 368rpx;
|
||||
background: #fff;
|
||||
box-sizing: border-box;
|
||||
padding: 4rpx;
|
||||
border-radius: 16rpx;
|
||||
.itemBox{
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
background: linear-gradient(180deg, #EDEEFF 0%, #F8F9FF 100%);;
|
||||
border-radius: 16rpx;
|
||||
box-sizing: border-box;
|
||||
padding: 22rpx 24rpx;
|
||||
.itemBoxTitle{
|
||||
font-size: 36rpx;
|
||||
font-family: Alimama ShuHeiTi;
|
||||
font-weight: bold;
|
||||
color: #474EF4;
|
||||
line-height: 44rpx;
|
||||
}
|
||||
.itemDetailBox{
|
||||
width: 100%;
|
||||
height: 256rpx;
|
||||
background: #FFFFFF;
|
||||
border-radius: 12rpx;
|
||||
margin-top: 22rpx;
|
||||
box-sizing: border-box;
|
||||
padding: 32rpx;
|
||||
.detailBoxTop{
|
||||
width: 100%;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: space-between;
|
||||
.successLabel{
|
||||
font-size: 28rpx;
|
||||
font-family: PingFangSC-Regular, PingFang SC;
|
||||
font-weight: 400;
|
||||
color: #786B6C;
|
||||
line-height: 40rpx;
|
||||
}
|
||||
.successValue{
|
||||
font-size: 40rpx;
|
||||
font-family: DINAlternate-Bold, DINAlternate;
|
||||
font-weight: bold;
|
||||
color: #575EF9;
|
||||
line-height: 48rpx;
|
||||
}
|
||||
}
|
||||
.progress{
|
||||
width: 100%;
|
||||
height: 24rpx;
|
||||
background: rgba(221, 223, 254, 0.2);
|
||||
border-radius: 12rpx;
|
||||
position: relative;
|
||||
margin-top: 12rpx;
|
||||
.have{
|
||||
position: absolute;
|
||||
top: 0;left: 0;
|
||||
height: 100%;
|
||||
background: #575EF9;
|
||||
border-radius: 12rpx;
|
||||
}
|
||||
}
|
||||
.yearDetail{
|
||||
width: 100%;
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
margin-top: 32rpx;
|
||||
.yearItem{
|
||||
.itemValue{
|
||||
font-size: 32rpx;
|
||||
font-family: DINAlternate-Bold, DINAlternate;
|
||||
font-weight: bold;
|
||||
color: #160002;
|
||||
line-height: 36rpx;
|
||||
}
|
||||
.itemLabel{
|
||||
font-size: 24rpx;
|
||||
font-family: PingFangSC-Regular, PingFang SC;
|
||||
font-weight: 400;
|
||||
color: #786B6C;
|
||||
line-height: 36rpx;
|
||||
margin-top: 4rpx;
|
||||
.itemUnit{
|
||||
margin-left: 4rpx;
|
||||
font-size: 24rpx;
|
||||
font-family: PingFangSC-Regular, PingFang SC;
|
||||
font-weight: 400;
|
||||
color: #A69E9F;
|
||||
line-height: 36rpx;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
</style>
|
||||
BIN
static/images/revenueBox/revenyeBg.png
Normal file
BIN
static/images/revenueBox/revenyeBg.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 185 KiB |
Loading…
x
Reference in New Issue
Block a user