1436 lines
60 KiB
Vue
1436 lines
60 KiB
Vue
<template>
|
||
<div class="main">
|
||
<div class="top">
|
||
<p class="title" v-if="type === 'month'">{{ serviceInfo.name }}服务区自营计划</p>
|
||
<p class="title" v-if="type === 'year'">{{ serviceInfo.name }}服务区年度自营计划</p>
|
||
<div class="select">
|
||
<picker mode="date" fields="month" :value="single" :end="endData" @change="bindDateChange">
|
||
<view class="time">
|
||
<view class="uni-input" style="background: transparent;padding: 0;height:100%">{{ single }}
|
||
</view>
|
||
<image class="icon" src="/static/images/index/arrow_bottom.svg"></image>
|
||
</view>
|
||
</picker>
|
||
</div>
|
||
</div>
|
||
<view class="box" v-if="type === 'month'">
|
||
<view class="top">
|
||
<view class="big">
|
||
<image class="icon" src="https://eshangtech.com/ShopICO/ahyd-BID/index/thisMonth.svg"></image>
|
||
</view>
|
||
<view class="text">
|
||
<view class="textTop">
|
||
<view class="left">
|
||
<p class="number">{{ serviceInfo.Budget_Degree ? serviceInfo.Budget_Degree + '%' : '-' }}
|
||
</p>
|
||
<p v-if="serviceInfo.Budget_Degree >= 100" class="desc">
|
||
<image class="success" src="/static/images/index/successMonth.svg"></image>
|
||
</p>
|
||
</view>
|
||
<view class="right">
|
||
<text class="comparePlan">比计划： </text>
|
||
<view class="box2">
|
||
<image class="addIcon"
|
||
:src="Number(serviceInfo.Growth_Rate) > 0 ? 'https://eshangtech.com/ShopICO/ahyd-BID/index/addIcon.svg' : 'https://eshangtech.com/ShopICO/ahyd-BID/index/reduce.svg'">
|
||
</image>
|
||
<p class="text">{{ serviceInfo.Growth_Rate ? Math.abs(serviceInfo.Growth_Rate) + '%' :
|
||
'-' }}
|
||
</p>
|
||
</view>
|
||
</view>
|
||
</view>
|
||
<div class="progressPlan">
|
||
<div class="trans"
|
||
:style="{ width: serviceInfo.Budget_Degree > 100 ? '100%' : serviceInfo.Budget_Degree + '%' }">
|
||
</div>
|
||
</div>
|
||
</view>
|
||
</view>
|
||
<view class="bottom">
|
||
<view class="success" style="margin-right: 39px">
|
||
<p class="text">本月已完成<text class="unit">/元</text></p>
|
||
<p class="money">{{ serviceInfo.Revenue_Amount ? serviceInfo.Revenue_Amount : '-' }}</p>
|
||
</view>
|
||
<view class="success">
|
||
<p class="text">本月计划<text class="unit">/元</text></p>
|
||
<p class="money">{{ serviceInfo.Budget_Amount ? serviceInfo.Budget_Amount : '-' }}</p>
|
||
</view>
|
||
</view>
|
||
</view>
|
||
|
||
<view class="box" v-if="type === 'year'">
|
||
<view class="top">
|
||
<view class="big">
|
||
<image class="icon" src="https://eshangtech.com/ShopICO/ahyd-BID/index/planYear.svg"></image>
|
||
</view>
|
||
<view class="text">
|
||
<view class="textTop">
|
||
<view class="left">
|
||
<p class="number">{{ serviceInfo.Budget_Degree ? serviceInfo.Budget_Degree + '%' : '-' }}
|
||
</p>
|
||
<p v-if="serviceInfo.Budget_Degree >= 100" class="desc" style="color: #4E68FF">
|
||
<image class="success"
|
||
src="https://eshangtech.com/ShopICO/ahyd-BID/index/yearSuccess.svg"></image>
|
||
</p>
|
||
</view>
|
||
<view class="right">
|
||
<text class="comparePlan">比计划： </text>
|
||
<div class="box2">
|
||
<image class="addIcon"
|
||
:src="Number(serviceInfo.Growth_Rate) > 0 ? 'https://eshangtech.com/ShopICO/ahyd-BID/index/addIcon.svg' : 'https://eshangtech.com/ShopICO/ahyd-BID/index/reduce.svg'">
|
||
</image>
|
||
<p class="text">{{ serviceInfo.Growth_Rate ? Math.abs(serviceInfo.Growth_Rate) + '%' :
|
||
'' }}
|
||
</p>
|
||
</div>
|
||
</view>
|
||
</view>
|
||
<div class="progressPlan">
|
||
<div class="transYear" :style="{ width: serviceInfo.Budget_Degree + '%' }"></div>
|
||
<!-- <image class="img" :style="{width: plan.percentageYear + '%'}" src="https://eshangtech.com/ShopICO/ahyd-BID/index/progress_blue.png"></image>-->
|
||
<!-- <div class=pro :style="{width:(100 - plan.percentageYear)+ '%'}"></div>-->
|
||
</div>
|
||
</view>
|
||
</view>
|
||
<view class="bottom">
|
||
<view class="success" style="margin-right: 39px">
|
||
<p class="text">年度已完成<text class="unit">/元</text></p>
|
||
<p class="money">{{ serviceInfo.Revenue_Amount ? serviceInfo.Revenue_Amount : '-' }}</p>
|
||
</view>
|
||
<view class="success">
|
||
<p class="text">年度计划<text class="unit">/元</text></p>
|
||
<p class="money">{{ serviceInfo.Budget_Amount ? serviceInfo.Budget_Amount : '-' }}</p>
|
||
</view>
|
||
</view>
|
||
</view>
|
||
<p class="title" style="margin-top: 12px">{{ month }}月预算完成度</p>
|
||
<div class="list" v-if="type === 'month'">
|
||
<div class="item">
|
||
<!-- 三级遍历数组展示 -->
|
||
<div class="firstBox" v-for="(item, index) in dataList" :key="index">
|
||
|
||
<div class="valueBox" v-if="item.node.ShowRevenue_Amount"
|
||
style="display: flex;justify-content: space-between">
|
||
<p class="firstTitle">{{ item.node.ACCOUNT_CODE }}</p>
|
||
<div>
|
||
<p v-if="item.node.BUDGETDETAIL_AMOUNT" class="value" style="color:#a69e9f">
|
||
{{ item.node.BUDGETDETAIL_AMOUNT ? item.node.BUDGETDETAIL_AMOUNT : '' }}<text
|
||
v-if="item.node.BUDGETDETAIL_AMOUNT !== '-'"
|
||
style="margin-left: 4px;color:#a69e9f">{{ item.node.ACCOUNT_CODE === '毛利率' ? '%' :
|
||
'元' }}</text><text v-if="item.node.BUDGETDETAIL_AMOUNT !== '-'" class="type"
|
||
style="margin-left: 4px">(计划)</text></p>
|
||
<p class="value">{{ item.node.REVENUE_AMOUNT ? item.node.REVENUE_AMOUNT : '-' }}<text
|
||
v-if="item.node.REVENUE_AMOUNT" style="margin-left: 4px">{{ item.node.ACCOUNT_CODE
|
||
=== '毛利率' ? '%' : '元' }}</text><text v-if="item.node.REVENUE_AMOUNT" class="type"
|
||
style="margin-left: 4px">(实际)</text>
|
||
</p>
|
||
<view class="addBox" v-if="item.node.ShowGrowth_Rate">
|
||
<image class="addIcon"
|
||
:src="item.node.Growth_Rate > 0 ? 'https://eshangtech.com/ShopICO/ahyd-BID/index/addIcon.svg' : item.node.Growth_Rate < 0 ? 'https://eshangtech.com/ShopICO/ahyd-BID/index/reduce.svg' : ''">
|
||
</image>
|
||
<p class="text" style="margin-left: 4px">
|
||
{{ item.node.Growth_Rate ? Math.abs(item.node.Growth_Rate) + '%' : '-' }}</p>
|
||
<text class="type" style="margin-left: 4px">{{ item.node.Growth_Rate > 0 ? '(提升)' :
|
||
item.node.Growth_Rate
|
||
< 0 ? '(降低)' : '' }}</text>
|
||
</view>
|
||
</div>
|
||
</div>
|
||
|
||
<text class="firstTitle" v-if="!item.node.ShowRevenue_Amount">{{ item.node.ACCOUNT_CODE }}</text>
|
||
|
||
<div class="valueBox" v-if="item.node.BUDGETDETAIL_AMOUNT && !item.node.ShowRevenue_Amount">
|
||
<p class="value" style="color:#a69e9f">{{ item.node.BUDGETDETAIL_AMOUNT }}<text
|
||
style="margin-left: 4px;color:#a69e9f">{{ item.node.ACCOUNT_CODE === '毛利率' ? '%' : '元'
|
||
}}</text><text class="type" style="margin-left: 4px">(计划)</text></p>
|
||
<p class="value" v-if="item.node.ShowGrowth_Rate">
|
||
{{ item.node.REVENUE_AMOUNT ? item.node.REVENUE_AMOUNT : '-' }}<text
|
||
v-if="item.node.REVENUE_AMOUNT !== '-'" style="margin-left: 4px">{{
|
||
item.node.ACCOUNT_CODE === '毛利率' ? '%' : '元' }}</text><text
|
||
v-if="item.node.REVENUE_AMOUNT !== '-'" class="type"
|
||
style="margin-left: 4px">(实际)</text>
|
||
</p>
|
||
<view class="addBox" v-if="item.node.ShowGrowth_Rate">
|
||
<image class="addIcon"
|
||
:src="item.node.Growth_Rate > 0 ? 'https://eshangtech.com/ShopICO/ahyd-BID/index/addIcon.svg' : item.node.Growth_Rate < 0 ? 'https://eshangtech.com/ShopICO/ahyd-BID/index/reduce.svg' : ''">
|
||
</image>
|
||
<p class="text" style="margin-left: 4px">
|
||
{{ item.node.Growth_Rate ? Math.abs(item.node.Growth_Rate) + '%' : '-' }}</p>
|
||
<text class="type" style="margin-left: 4px">{{ item.node.Growth_Rate > 0 ? '(提升)' :
|
||
item.node.Growth_Rate < 0 ? '(降低)' : '-' }}</text>
|
||
</view>
|
||
</div>
|
||
|
||
<div v-if="item.children.length > 0" class="subBox" v-for="(subItem, subIndex) in item.children"
|
||
:key="subIndex" :style="subItem.children ? '' : 'display:flex;justify-content: space-between'">
|
||
|
||
<div class="valueBox" v-if="subItem.node.ShowRevenue_Amount"
|
||
style="display: flex;justify-content: space-between">
|
||
<p class="subTitle">{{ subItem.node.ACCOUNT_CODE }}</p>
|
||
<div>
|
||
<p v-if="subItem.node.BUDGETDETAIL_AMOUNT" class="value" style="color:#a69e9f">
|
||
{{ subItem.node.BUDGETDETAIL_AMOUNT ? subItem.node.BUDGETDETAIL_AMOUNT : '' }}<text
|
||
v-if="subItem.node.BUDGETDETAIL_AMOUNT !== '-'"
|
||
style="margin-left: 4px;color:#a69e9f">{{ item.node.ACCOUNT_CODE === '毛利率' ? '%'
|
||
: '元' }}</text><text v-if="subItem.node.BUDGETDETAIL_AMOUNT !== '-'"
|
||
class="type" style="margin-left: 4px">(计划)</text></p>
|
||
<p class="value">{{ subItem.node.REVENUE_AMOUNT ? subItem.node.REVENUE_AMOUNT : '-'
|
||
}}<text v-if="subItem.node.REVENUE_AMOUNT" style="margin-left: 4px">{{
|
||
item.node.ACCOUNT_CODE === '毛利率' ? '%' : '元' }}</text><text
|
||
v-if="subItem.node.REVENUE_AMOUNT" class="type"
|
||
style="margin-left: 4px">(实际)</text></p>
|
||
<view class="addBox" v-if="subItem.node.ShowGrowth_Rate">
|
||
<image class="addIcon"
|
||
:src="subItem.node.Growth_Rate > 0 ? 'https://eshangtech.com/ShopICO/ahyd-BID/index/addIcon.svg' : subItem.node.Growth_Rate < 0 ? 'https://eshangtech.com/ShopICO/ahyd-BID/index/reduce.svg' : ''">
|
||
</image>
|
||
<p class="text" style="margin-left: 4px">
|
||
{{ subItem.node.Growth_Rate ? Math.abs(subItem.node.Growth_Rate) + '%' : '-' }}
|
||
</p>
|
||
<text class="type" style="margin-left: 4px">{{ subItem.node.Growth_Rate > 0 ? '(提升)'
|
||
: subItem.node.Growth_Rate
|
||
< 0 ? '(降低)' : '' }}</text>
|
||
</view>
|
||
</div>
|
||
</div>
|
||
|
||
<p class="subTitle" v-if="!subItem.node.ShowRevenue_Amount">{{ subItem.node.ACCOUNT_CODE }}</p>
|
||
|
||
<div class="valueBox"
|
||
v-if="subItem.node.BUDGETDETAIL_AMOUNT && !subItem.node.ShowRevenue_Amount">
|
||
<p class="value" style="color:#a69e9f">
|
||
{{ subItem.node.BUDGETDETAIL_AMOUNT ? subItem.node.BUDGETDETAIL_AMOUNT : '' }}<text
|
||
v-if="subItem.node.BUDGETDETAIL_AMOUNT !== '-'"
|
||
style="margin-left: 4px;color:#a69e9f">{{ item.node.ACCOUNT_CODE === '毛利率' ? '%' :
|
||
'元' }}</text><text v-if="subItem.node.BUDGETDETAIL_AMOUNT !== '-'" class="type"
|
||
style="margin-left: 4px">(计划)</text></p>
|
||
<p v-if="subItem.node.ShowGrowth_Rate" class="value">
|
||
{{ subItem.node.REVENUE_AMOUNT ? subItem.node.REVENUE_AMOUNT : '-' }}<text
|
||
v-if="subItem.node.REVENUE_AMOUNT" style="margin-left: 4px">{{
|
||
item.node.ACCOUNT_CODE === '毛利率' ? '%' : '元' }}</text><text
|
||
v-if="subItem.node.REVENUE_AMOUNT" class="type" style="margin-left: 4px">(实际)</text>
|
||
</p>
|
||
|
||
<view class="addBox" v-if="subItem.node.ShowGrowth_Rate">
|
||
<image class="addIcon"
|
||
:src="subItem.node.Growth_Rate > 0 ? 'https://eshangtech.com/ShopICO/ahyd-BID/index/addIcon.svg' : subItem.node.Growth_Rate < 0 ? 'https://eshangtech.com/ShopICO/ahyd-BID/index/reduce.svg' : ''">
|
||
</image>
|
||
<p class="text" style="margin-left: 4px">
|
||
{{ subItem.node.Growth_Rate ? Math.abs(subItem.node.Growth_Rate) + '%' : '-' }}</p>
|
||
<text class="type" style="margin-left: 4px">{{ subItem.node.Growth_Rate > 0 ? '(提升)' :
|
||
subItem.node.Growth_Rate
|
||
< 0 ? '(降低)' : '' }}</text>
|
||
</view>
|
||
</div>
|
||
|
||
<div v-if="subItem.children.length > 0" class="thirdBox"
|
||
v-for="(thirdItem, thirdIndex) in subItem.children" :key="thirdIndex">
|
||
<text class="thirdTitle">{{ thirdItem.node.ACCOUNT_CODE }}</text>
|
||
|
||
<div class="valueBox" v-if="thirdItem.node.BUDGETDETAIL_AMOUNT">
|
||
<p class="value" style="color:#a69e9f">{{ thirdItem.node.BUDGETDETAIL_AMOUNT }}<text
|
||
style="margin-left: 4px;color:#a69e9f"
|
||
v-if="thirdItem.node.BUDGETDETAIL_AMOUNT !== '-'">{{ item.node.ACCOUNT_CODE ===
|
||
'毛利率' ? '%' : '元' }}</text><text
|
||
v-if="thirdItem.node.BUDGETDETAIL_AMOUNT !== '-'" class="type"
|
||
style="margin-left: 4px">(计划)</text></p>
|
||
<p class="value" v-if="thirdItem.node.ShowGrowth_Rate">
|
||
{{ thirdItem.node.REVENUE_AMOUNT ? thirdItem.node.REVENUE_AMOUNT : '-' }}<text
|
||
v-if="thirdItem.node.REVENUE_AMOUNT" style="margin-left: 4px">{{
|
||
item.node.ACCOUNT_CODE === '毛利率' ? '%' : '元' }}</text><text
|
||
v-if="thirdItem.node.REVENUE_AMOUNT" class="type"
|
||
style="margin-left: 4px">(实际)</text></p>
|
||
|
||
<view class="addBox" v-if="thirdItem.node.ShowGrowth_Rate">
|
||
<image class="addIcon"
|
||
:src="thirdItem.node.Growth_Rate > 0 ? 'https://eshangtech.com/ShopICO/ahyd-BID/index/addIcon.svg' : thirdItem.node.Growth_Rate < 0 ? 'https://eshangtech.com/ShopICO/ahyd-BID/index/reduce.svg' : ''">
|
||
</image>
|
||
<p class="text" style="margin-left: 4px">
|
||
{{ thirdItem.node.Growth_Rate ? Math.abs(thirdItem.node.Growth_Rate) + '%' : '-'
|
||
}}
|
||
</p>
|
||
<text class="type" style="margin-left: 4px">{{ thirdItem.node.Growth_Rate > 0 ?
|
||
'(提升)' : thirdItem.node.Growth_Rate
|
||
< 0 ? '(降低)' : '' }}</text>
|
||
</view>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
|
||
<div style="margin-top: 12px">
|
||
<div v-if="type === 'year'" class="monthList" v-for="(item, index) in dataList" :key="index"
|
||
@click="handleYearItem(item)">
|
||
<div class="top">
|
||
<div class="left">
|
||
<p class="title"><text class="name">{{ item.Statistics_Month }}</text>月</p>
|
||
<div class="value">{{ item.Budget_Degree }}%</div>
|
||
</div>
|
||
<div class="right">
|
||
<text class="comparePlan">比计划： </text>
|
||
<div class="box2">
|
||
<image class="addIcon"
|
||
:src="Number(item.Growth_Rate) > 0 ? 'https://eshangtech.com/ShopICO/ahyd-BID/index/addIcon.svg' : 'https://eshangtech.com/ShopICO/ahyd-BID/index/reduce.svg'">
|
||
</image>
|
||
<p class="text">{{ item.Growth_Rate ? Math.abs(item.Growth_Rate) + '%' : '' }}</p>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
<div class="progress">
|
||
<div class="have" :style="{ width: item.Budget_Degree + '%' }"></div>
|
||
</div>
|
||
<div class="bottom">
|
||
<div class="success">
|
||
<p class="text">已完成:</p>
|
||
<text class="money">{{ item.Revenue_Amount }}</text>
|
||
</div>
|
||
<div class="success">
|
||
<p class="text">计划: </p>
|
||
<text class="money">{{ item.Budget_Amount }}</text>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</template>
|
||
|
||
<script>
|
||
import request from '@/util/index.js'
|
||
export default {
|
||
name: "serviceDetail",
|
||
data() {
|
||
return {
|
||
serviceInfo: {},
|
||
month: '',
|
||
dataList: [],
|
||
single: '',//显示时间
|
||
endData: '',//截止日期
|
||
type: '',
|
||
isSelect: false,
|
||
optionTime: ''
|
||
}
|
||
},
|
||
onLoad(option) {
|
||
console.log('option', option)
|
||
if (option.select) {
|
||
this.isSelect = true
|
||
}
|
||
if (option.type === 'month') {
|
||
this.type = option.type
|
||
if (option.month) {
|
||
this.optionTime = option.month
|
||
this.month = option.month
|
||
}
|
||
if (!this.month) {
|
||
const date = new Date()
|
||
this.month = date.getMonth() + 1
|
||
}
|
||
if (this.month < 10) {
|
||
this.month = '0' + this.month
|
||
}
|
||
this.serviceInfo = JSON.parse(option.serviceInfo)
|
||
this.serviceInfo.Budget_Degree = this.$util.fmoney(this.serviceInfo.Budget_Degree)
|
||
this.getData()
|
||
} else {
|
||
this.type = option.type
|
||
this.serviceInfo = JSON.parse(option.serviceInfo)
|
||
this.getYearData()
|
||
}
|
||
|
||
},
|
||
onShow() {
|
||
if (this.type === 'month') {
|
||
uni.setNavigationBarTitle({
|
||
title: `${this.month}月${this.serviceInfo.SERVERPART_NAME || this.serviceInfo.Serverpart_Name}计划`,
|
||
})
|
||
} else {
|
||
uni.setNavigationBarTitle({
|
||
title: `${this.serviceInfo.SERVERPART_NAME || this.serviceInfo.Serverpart_Name}年度计划`,
|
||
})
|
||
}
|
||
if (this.month) {
|
||
const date = new Date()
|
||
let y = date.getFullYear()
|
||
let time = `${y}-${this.month}`
|
||
this.single = this.$util.getThisMonthHave(time)
|
||
} else {
|
||
let storeTime = uni.getStorageSync('lastDay')
|
||
if (storeTime) {
|
||
this.time = storeTime
|
||
}
|
||
this.single = this.$util.getThisMonthHave(this.time)
|
||
}
|
||
|
||
let nowTime = new Date()
|
||
let y = nowTime.getFullYear()
|
||
let month = nowTime.getMonth() + 1
|
||
if (month < 10) {
|
||
month = '0' + month
|
||
}
|
||
// 结束月份 给时间选择器
|
||
this.endData = `${y}-${month}`
|
||
},
|
||
onUnload() {
|
||
this.$util.addUserBehavior()
|
||
},
|
||
methods: {
|
||
handleYearItem(item) {
|
||
let currentService = uni.getStorageSync('currentService')
|
||
let service = {
|
||
Budget_Amount: item.Budget_Amount,
|
||
Budget_Degree: item.Budget_Degree,
|
||
Growth_Rate: item.Growth_Rate,
|
||
Revenue_Amount: item.Revenue_Amount,
|
||
Serverpart_ID: currentService.Serverpart_ID,
|
||
Serverpart_Name: currentService.SERVERPART_NAME
|
||
}
|
||
let num = service.Serverpart_Name.indexOf('服务区')
|
||
if (num !== -1) {
|
||
service.name = service.Serverpart_Name.slice(0, num)
|
||
service.unit = service.Serverpart_Name.slice(num, 100)
|
||
} else {
|
||
service.name = service.Serverpart_Name
|
||
}
|
||
let month = item.Statistics_Month
|
||
uni.navigateTo({
|
||
url: `/pages/commercialBI/serviceDetail?serviceInfo=${JSON.stringify(service)}&month=${month}&type=month`
|
||
})
|
||
},
|
||
// 时间选择器改变的时间
|
||
bindDateChange(e) {
|
||
const date = new Date(e.detail.value)
|
||
let m = date.getMonth() + 1
|
||
if (m < 10) {
|
||
m = '0' + m
|
||
}
|
||
this.month = m
|
||
this.single = e.detail.value
|
||
let d = this.$util.getThisMonthDay(e.detail.value)
|
||
this.endTime = e.detail.value + '-' + d
|
||
this.getData(e.detail.value)
|
||
//修改顶部服务区数据的方法
|
||
this.getServiceDate(e.detail.value)
|
||
if (this.type === 'month') {
|
||
uni.setNavigationBarTitle({
|
||
title: `${this.month}月${this.serviceInfo.SERVERPART_NAME || this.serviceInfo.Serverpart_Name}计划`,
|
||
})
|
||
} else {
|
||
uni.setNavigationBarTitle({
|
||
title: `${this.serviceInfo.SERVERPART_NAME || this.serviceInfo.Serverpart_Name}年度计划`,
|
||
})
|
||
}
|
||
},
|
||
// 获取服务区信息
|
||
async getServiceDate(time) {
|
||
let reqTime
|
||
let date = new Date(time)
|
||
let currentDate = new Date()
|
||
let nowMonth = currentDate.getMonth() + 1
|
||
let y = date.getFullYear()
|
||
let m = date.getMonth() + 1
|
||
if (m === nowMonth) {
|
||
let nowYear = currentDate.getFullYear()
|
||
let nodDay = currentDate.getDate()
|
||
if (nowMonth < 10) {
|
||
nowMonth = '0' + nowMonth
|
||
}
|
||
if (nodDay < 10) {
|
||
nodDay = '0' + nodDay
|
||
}
|
||
reqTime = `${nowYear}-${nowMonth}-${nodDay}`
|
||
} else {
|
||
let howDay = this.$util.getThisMonthDay(time)
|
||
if (m < 10) {
|
||
m = '0' + m
|
||
}
|
||
reqTime = `${y}-${m}-${howDay}`
|
||
}
|
||
let req = {
|
||
Province_Code: '340000',
|
||
Statistics_Date: reqTime,
|
||
Serverpart_ID: this.serviceInfo.Serverpart_ID,
|
||
SPRegionType_ID: this.serviceInfo.SPRegionType_ID
|
||
}
|
||
const data = await request.$webGet('CommercialApi/Revenue/GetRevenueBudget', req)
|
||
|
||
let service = {
|
||
Budget_Amount: this.$util.fmoney(data.Result_Data.BudgetMonth_Amount),
|
||
Budget_Degree: data.Result_Data.MonthBudget_Degree,
|
||
Growth_Rate: data.Result_Data.MonthGrowth_Rate,
|
||
Revenue_Amount: this.$util.fmoney(data.Result_Data.RevenueMonth_Amount),
|
||
Serverpart_ID: this.serviceInfo.Serverpart_ID,
|
||
Serverpart_Name: this.serviceInfo.Serverpart_Name
|
||
}
|
||
let num = service.Serverpart_Name.indexOf('服务区')
|
||
if (num !== -1) {
|
||
service.name = service.Serverpart_Name.slice(0, num)
|
||
service.unit = service.Serverpart_Name.slice(num, 100)
|
||
} else {
|
||
service.name = service.Serverpart_Name
|
||
}
|
||
this.serviceInfo = service
|
||
},
|
||
async getYearData() {
|
||
let storeServiceInfo = uni.getStorageSync('currentService')
|
||
let lastDay = uni.getStorageSync('lastDay')
|
||
let req = {
|
||
StatisticsDate: lastDay,
|
||
ProvinceCode: '340000',
|
||
StatisticsType: 3,
|
||
SPRegionTypeID: storeServiceInfo.SPRegionType_ID,
|
||
ServerpartID: storeServiceInfo.Serverpart_ID
|
||
}
|
||
const totalData = await request.$webGet('CommercialApi/Revenue/GetProvinceRevenueBudget', req)
|
||
this.dataList = totalData.Result_Data.RegionBudgetList
|
||
},
|
||
async getData(changeTime) {
|
||
let time = uni.getStorageSync('lastDay')
|
||
let date = ''
|
||
if (changeTime) {
|
||
date = new Date(changeTime)
|
||
} else {
|
||
date = new Date(time)
|
||
}
|
||
const nowDate = new Date()
|
||
let nowMonth = nowDate.getMonth() + 1
|
||
let y = date.getFullYear()
|
||
let m = this.month
|
||
let req = {}
|
||
if (nowMonth === Number(m)) {
|
||
req = {
|
||
BUDGETPROJECT_YEAR: y,
|
||
STATISTICS_MONTH: `${y}${m}`,
|
||
SERVERPART_ID: this.serviceInfo.Serverpart_ID,
|
||
ACCOUNT_CODE: '6001,6401,6402',
|
||
STATISTICS_DATE: time
|
||
}
|
||
} else {
|
||
let reqDate
|
||
let m
|
||
if (changeTime) {
|
||
reqDate = new Date(changeTime)
|
||
m = reqDate.getMonth() + 1
|
||
if (m < 10) {
|
||
m = '0' + m
|
||
}
|
||
} else {
|
||
reqDate = new Date()
|
||
m = this.month
|
||
}
|
||
let y = reqDate.getFullYear()
|
||
req = {
|
||
BUDGETPROJECT_YEAR: y,
|
||
STATISTICS_MONTH: `${y}${m}`,
|
||
SERVERPART_ID: this.serviceInfo.Serverpart_ID,
|
||
ACCOUNT_CODE: '6001,6401,6402',
|
||
}
|
||
}
|
||
const totalData = await request.$webGet('CommercialApi/Budget/GetBudgetProjectDetailList', req)
|
||
this.dataList = totalData.Result_Data.List
|
||
// 千分号格式化处理数字
|
||
this.dataList.forEach(item => {
|
||
if (item.children) {
|
||
item.children = this.editData(item.children)
|
||
if (item.node.ShowRevenue_Amount) {
|
||
item.node.BUDGETDETAIL_AMOUNT = item.node.BUDGETDETAIL_AMOUNT ? this.$util.fmoney(item.node.BUDGETDETAIL_AMOUNT) : ''
|
||
item.node.REVENUE_AMOUNT = this.$util.fmoney(item.node.REVENUE_AMOUNT)
|
||
}
|
||
} else {
|
||
if (item.node.BUDGETDETAIL_AMOUNT) {
|
||
item.node.BUDGETDETAIL_AMOUNT = item.node.BUDGETDETAIL_AMOUNT ? this.$util.fmoney(item.node.BUDGETDETAIL_AMOUNT) : ''
|
||
item.node.REVENUE_AMOUNT = this.$util.fmoney(item.node.REVENUE_AMOUNT)
|
||
} else {
|
||
item.node.BUDGETDETAIL_AMOUNT = '-'
|
||
}
|
||
}
|
||
})
|
||
// 强制刷新 感觉没用 放一下保险
|
||
this.$forceUpdate()
|
||
},
|
||
// 递归处理数据
|
||
editData(value) {
|
||
value.forEach(item => {
|
||
if (item.children) {
|
||
item.children = this.editData(item.children)
|
||
if (item.node.ShowRevenue_Amount) {
|
||
item.node.BUDGETDETAIL_AMOUNT = item.node.BUDGETDETAIL_AMOUNT ? this.$util.fmoney(item.node.BUDGETDETAIL_AMOUNT) : ''
|
||
item.node.REVENUE_AMOUNT = this.$util.fmoney(item.node.REVENUE_AMOUNT)
|
||
}
|
||
} else {
|
||
if (item.node.BUDGETDETAIL_AMOUNT) {
|
||
item.node.BUDGETDETAIL_AMOUNT = item.node.BUDGETDETAIL_AMOUNT ? this.$util.fmoney(item.node.BUDGETDETAIL_AMOUNT) : ''
|
||
item.node.REVENUE_AMOUNT = this.$util.fmoney(item.node.REVENUE_AMOUNT)
|
||
} else {
|
||
item.node.BUDGETDETAIL_AMOUNT = '-'
|
||
}
|
||
}
|
||
})
|
||
return value
|
||
}
|
||
}
|
||
}
|
||
</script>
|
||
|
||
<style scoped lang="scss">
|
||
.main {
|
||
width: 100%;
|
||
min-height: 100vh;
|
||
box-sizing: border-box;
|
||
padding: 0 16px;
|
||
|
||
.title {
|
||
font-size: 32rpx;
|
||
font-family: PingFangSC-Semibold, PingFang SC;
|
||
font-weight: 600;
|
||
color: #160002;
|
||
}
|
||
|
||
.top {
|
||
width: 100%;
|
||
display: flex;
|
||
align-items: center;
|
||
justify-content: space-between;
|
||
|
||
.title {
|
||
font-size: 32rpx;
|
||
font-family: PingFangSC-Semibold, PingFang SC;
|
||
font-weight: 600;
|
||
color: #160002;
|
||
}
|
||
|
||
.select {
|
||
margin-left: 8px;
|
||
display: inline-block;
|
||
|
||
.time {
|
||
display: flex;
|
||
align-items: center;
|
||
margin-right: 4px;
|
||
|
||
.day {
|
||
font-size: 32rpx;
|
||
font-family: PingFangSC-Regular, PingFang SC;
|
||
font-weight: 400;
|
||
color: #782717;
|
||
line-height: 44rpx;
|
||
margin-right: 4px;
|
||
}
|
||
|
||
.uni-input {
|
||
font-size: 14px;
|
||
font-family: PingFangSC-Regular, PingFang SC;
|
||
font-weight: 400;
|
||
color: #ae664e;
|
||
line-height: 36rpx;
|
||
}
|
||
|
||
.icon {
|
||
width: 24px;
|
||
height: 16px;
|
||
}
|
||
}
|
||
}
|
||
}
|
||
|
||
.box {
|
||
width: 100%;
|
||
padding: 12px 16px;
|
||
box-sizing: border-box;
|
||
border-radius: 8px;
|
||
background: #f5f2f2;
|
||
margin-top: 12px;
|
||
|
||
.top {
|
||
width: 100%;
|
||
display: flex;
|
||
|
||
.big {
|
||
width: 40px;
|
||
height: 40px;
|
||
background: #ffffff;
|
||
border-radius: 8px;
|
||
border: 1px solid #ebebeb;
|
||
display: flex;
|
||
justify-content: center;
|
||
align-items: center;
|
||
margin-right: 8px;
|
||
|
||
.icon {
|
||
width: 20px;
|
||
height: 20px;
|
||
}
|
||
}
|
||
|
||
.text {
|
||
width: calc(100% - 60px);
|
||
padding: 2px 0;
|
||
|
||
.textTop {
|
||
display: flex;
|
||
align-items: center;
|
||
justify-content: space-between;
|
||
|
||
.left {
|
||
display: flex;
|
||
align-items: center;
|
||
|
||
.number {
|
||
font-size: 36rpx;
|
||
font-family: DINAlternate-Bold, DINAlternate;
|
||
font-weight: bold;
|
||
color: #150002;
|
||
line-height: 40rpx;
|
||
}
|
||
|
||
.desc {
|
||
display: flex;
|
||
align-items: center;
|
||
margin-left: 8px;
|
||
font-size: 14px;
|
||
color: #FF7043;
|
||
|
||
.success {
|
||
width: 20px;
|
||
height: 20px;
|
||
margin-right: 4px;
|
||
}
|
||
}
|
||
}
|
||
|
||
.right {
|
||
flex: 1;
|
||
display: flex;
|
||
justify-content: flex-end;
|
||
align-items: center;
|
||
|
||
.comparePlan {
|
||
font-size: 24rpx;
|
||
font-family: PingFangSC-Regular, PingFang SC;
|
||
font-weight: 400;
|
||
color: #a69e9f;
|
||
line-height: 36rpx;
|
||
white-space: nowrap;
|
||
}
|
||
|
||
.box2 {
|
||
display: flex;
|
||
align-items: center;
|
||
|
||
.text {
|
||
font-size: 14px;
|
||
font-family: DINAlternate-Bold, DINAlternate;
|
||
color: #150002;
|
||
font-weight: bold;
|
||
|
||
line-height: 40rpx;
|
||
}
|
||
|
||
.addIcon {
|
||
width: 16px;
|
||
height: 16px;
|
||
margin-right: 2px;
|
||
}
|
||
}
|
||
}
|
||
}
|
||
|
||
.progressPlan {
|
||
width: 100%;
|
||
height: 8px;
|
||
border-radius: 5px;
|
||
background: #fff;
|
||
margin-top: 8px;
|
||
position: relative;
|
||
overflow: hidden;
|
||
|
||
.trans {
|
||
height: 8px;
|
||
position: absolute;
|
||
left: 0;
|
||
top: 0;
|
||
border-top-right-radius: 4px;
|
||
border-bottom-right-radius: 4px;
|
||
background: url("https://eshangtech.com/ShopICO/ahyd-BID/index/progress_orange.png")no-repeat 100% 100%;
|
||
}
|
||
|
||
.transYear {
|
||
height: 8px;
|
||
position: absolute;
|
||
left: 0;
|
||
top: 0;
|
||
border-top-right-radius: 4px;
|
||
border-bottom-right-radius: 4px;
|
||
background: url("https://eshangtech.com/ShopICO/ahyd-BID/index/progress_blue.png")no-repeat 100% 100%;
|
||
}
|
||
|
||
//.img{
|
||
// width: 100%;
|
||
// height: 100%;
|
||
// position: absolute;
|
||
// top: 0;
|
||
// left: 0;
|
||
// z-index:1;
|
||
//}
|
||
//.pro{
|
||
// height: 100%;
|
||
// position: absolute;
|
||
// top: 0;right: 0;
|
||
// background: #fff;
|
||
// z-index:2;
|
||
//}
|
||
|
||
}
|
||
}
|
||
}
|
||
|
||
.bottom {
|
||
display: flex;
|
||
margin-top: 16px;
|
||
padding-left: 48px;
|
||
|
||
.success {
|
||
.text {
|
||
font-size: 28rpx;
|
||
font-family: PingFangSC-Regular, PingFang SC;
|
||
font-weight: 400;
|
||
color: #786b6c;
|
||
line-height: 40rpx;
|
||
margin-bottom: 2px;
|
||
|
||
.unit {
|
||
font-size: 28rpx;
|
||
font-family: PingFangSC-Regular, PingFang SC;
|
||
font-weight: 400;
|
||
color: #a69e9f;
|
||
line-height: 40rpx;
|
||
margin-left: 2px;
|
||
}
|
||
}
|
||
|
||
.money {
|
||
font-size: 28rpx;
|
||
font-family: DINAlternate-Bold, DINAlternate;
|
||
font-weight: 600;
|
||
color: #160002;
|
||
line-height: 40rpx;
|
||
}
|
||
}
|
||
}
|
||
}
|
||
|
||
.list {
|
||
margin-top: 12px;
|
||
padding-bottom: 12px;
|
||
|
||
.item {
|
||
width: 100%;
|
||
box-sizing: border-box;
|
||
padding: 12px;
|
||
background: #F5F5F5;
|
||
margin-bottom: 12px;
|
||
border-radius: 8px;
|
||
|
||
.bigTitle {
|
||
font-size: 12px;
|
||
font-family: PingFangSC-Regular, PingFang SC;
|
||
font-weight: 400;
|
||
color: #a69e9f;
|
||
|
||
.name {
|
||
color: #150002;
|
||
font-size: 18px;
|
||
}
|
||
}
|
||
|
||
.firstBox {
|
||
margin-top: 8px;
|
||
|
||
.valueBox {
|
||
display: inline-block;
|
||
text-align: right;
|
||
|
||
.firstTitle {
|
||
display: inline-block;
|
||
width: 180px;
|
||
font-size: 16px;
|
||
font-family: PingFangSC-Semibold, PingFang SC;
|
||
font-weight: 600;
|
||
color: #160002;
|
||
line-height: 22px;
|
||
text-align: left;
|
||
}
|
||
|
||
.addBox {
|
||
display: flex;
|
||
align-items: center;
|
||
justify-content: flex-end;
|
||
|
||
.addIcon {
|
||
width: 16px;
|
||
height: 16px;
|
||
margin-right: 2px;
|
||
}
|
||
|
||
.type {
|
||
font-size: 12px;
|
||
font-family: PingFangSC-Regular, PingFang SC;
|
||
font-weight: 400;
|
||
color: #a69e9f;
|
||
line-height: 18px;
|
||
white-space: nowrap;
|
||
}
|
||
}
|
||
|
||
.value {
|
||
font-size: 14px;
|
||
font-family: PingFangSC-Semibold, PingFang SC;
|
||
color: #160002;
|
||
line-height: 22px;
|
||
padding-left: 10px;
|
||
|
||
.type {
|
||
font-size: 12px;
|
||
font-family: PingFangSC-Regular, PingFang SC;
|
||
font-weight: 400;
|
||
color: #a69e9f;
|
||
line-height: 18px;
|
||
white-space: nowrap;
|
||
}
|
||
}
|
||
}
|
||
|
||
.firstTitle {
|
||
display: inline-block;
|
||
width: 180px;
|
||
font-size: 16px;
|
||
font-family: PingFangSC-Semibold, PingFang SC;
|
||
font-weight: 600;
|
||
color: #160002;
|
||
line-height: 22px;
|
||
}
|
||
|
||
.boxTop {
|
||
display: flex;
|
||
justify-content: space-between;
|
||
|
||
.firstTitle {
|
||
display: inline-block;
|
||
width: 180px;
|
||
font-size: 16px;
|
||
font-family: PingFangSC-Semibold, PingFang SC;
|
||
font-weight: 600;
|
||
color: #160002;
|
||
line-height: 22px;
|
||
}
|
||
|
||
.amount {
|
||
display: inline-block;
|
||
text-align: right;
|
||
|
||
.addBox {
|
||
display: flex;
|
||
align-items: center;
|
||
justify-content: flex-end;
|
||
|
||
.addIcon {
|
||
width: 16px;
|
||
height: 16px;
|
||
margin-right: 2px;
|
||
}
|
||
|
||
.type {
|
||
font-size: 12px;
|
||
font-family: PingFangSC-Regular, PingFang SC;
|
||
font-weight: 400;
|
||
color: #a69e9f;
|
||
line-height: 18px;
|
||
white-space: nowrap;
|
||
}
|
||
}
|
||
|
||
.value {
|
||
font-size: 14px;
|
||
font-family: PingFangSC-Semibold, PingFang SC;
|
||
color: #160002;
|
||
line-height: 22px;
|
||
padding-left: 10px;
|
||
|
||
.type {
|
||
font-size: 12px;
|
||
font-family: PingFangSC-Regular, PingFang SC;
|
||
font-weight: 400;
|
||
color: #a69e9f;
|
||
line-height: 18px;
|
||
white-space: nowrap;
|
||
}
|
||
}
|
||
}
|
||
}
|
||
|
||
.valueBox {
|
||
display: inline-block;
|
||
text-align: right;
|
||
|
||
.addBox {
|
||
display: flex;
|
||
align-items: center;
|
||
justify-content: flex-end;
|
||
|
||
.addIcon {
|
||
width: 16px;
|
||
height: 16px;
|
||
margin-right: 2px;
|
||
}
|
||
|
||
.type {
|
||
font-size: 12px;
|
||
font-family: PingFangSC-Regular, PingFang SC;
|
||
font-weight: 400;
|
||
color: #a69e9f;
|
||
line-height: 18px;
|
||
white-space: nowrap;
|
||
}
|
||
}
|
||
|
||
.value {
|
||
font-size: 14px;
|
||
font-family: PingFangSC-Semibold, PingFang SC;
|
||
color: #160002;
|
||
line-height: 22px;
|
||
padding-left: 10px;
|
||
|
||
.type {
|
||
font-size: 12px;
|
||
font-family: PingFangSC-Regular, PingFang SC;
|
||
font-weight: 400;
|
||
color: #a69e9f;
|
||
line-height: 18px;
|
||
white-space: nowrap;
|
||
}
|
||
}
|
||
}
|
||
|
||
.subBox {
|
||
margin-top: 4px;
|
||
|
||
.valueBox {
|
||
display: inline-block;
|
||
text-align: right;
|
||
|
||
.subTitle {
|
||
font-size: 14px;
|
||
font-family: PingFangSC-Semibold, PingFang SC;
|
||
font-weight: 600;
|
||
color: #160002;
|
||
line-height: 22px;
|
||
padding-left: 10px;
|
||
display: inline-block;
|
||
width: 120px;
|
||
text-align: left;
|
||
}
|
||
|
||
.addBox {
|
||
display: flex;
|
||
align-items: center;
|
||
justify-content: flex-end;
|
||
|
||
.addIcon {
|
||
width: 16px;
|
||
height: 16px;
|
||
margin-right: 2px;
|
||
}
|
||
|
||
.type {
|
||
font-size: 12px;
|
||
font-family: PingFangSC-Regular, PingFang SC;
|
||
font-weight: 400;
|
||
color: #a69e9f;
|
||
line-height: 18px;
|
||
white-space: nowrap;
|
||
}
|
||
}
|
||
|
||
.value {
|
||
font-size: 14px;
|
||
font-family: PingFangSC-Semibold, PingFang SC;
|
||
color: #160002;
|
||
line-height: 22px;
|
||
padding-left: 10px;
|
||
|
||
.type {
|
||
font-size: 12px;
|
||
font-family: PingFangSC-Regular, PingFang SC;
|
||
font-weight: 400;
|
||
color: #a69e9f;
|
||
line-height: 18px;
|
||
white-space: nowrap;
|
||
}
|
||
}
|
||
}
|
||
|
||
.subTitle {
|
||
font-size: 14px;
|
||
font-family: PingFangSC-Semibold, PingFang SC;
|
||
font-weight: 600;
|
||
color: #160002;
|
||
line-height: 22px;
|
||
padding-left: 10px;
|
||
display: inline-block;
|
||
width: 120px;
|
||
}
|
||
|
||
.boxTop {
|
||
display: flex;
|
||
justify-content: space-between;
|
||
|
||
.subTitle {
|
||
font-size: 14px;
|
||
font-family: PingFangSC-Semibold, PingFang SC;
|
||
font-weight: 600;
|
||
color: #160002;
|
||
line-height: 22px;
|
||
padding-left: 10px;
|
||
display: inline-block;
|
||
width: 120px;
|
||
}
|
||
|
||
}
|
||
|
||
.thirdBox {
|
||
display: flex;
|
||
justify-content: space-between;
|
||
margin-bottom: 8px;
|
||
|
||
.thirdTitle {
|
||
font-size: 12px;
|
||
font-family: PingFangSC-Semibold, PingFang SC;
|
||
font-weight: 600;
|
||
color: #160002;
|
||
line-height: 22px;
|
||
padding-left: 30px;
|
||
display: inline-block;
|
||
width: 130px;
|
||
}
|
||
|
||
.boxTop {
|
||
display: flex;
|
||
justify-content: space-between;
|
||
|
||
.thirdTitle {
|
||
font-size: 12px;
|
||
font-family: PingFangSC-Semibold, PingFang SC;
|
||
font-weight: 600;
|
||
color: #160002;
|
||
line-height: 22px;
|
||
padding-left: 30px;
|
||
display: inline-block;
|
||
width: 130px;
|
||
}
|
||
|
||
.amount {
|
||
display: inline-block;
|
||
text-align: right;
|
||
|
||
.addBox {
|
||
display: flex;
|
||
align-items: center;
|
||
justify-content: flex-end;
|
||
|
||
.addIcon {
|
||
width: 16px;
|
||
height: 16px;
|
||
margin-right: 2px;
|
||
}
|
||
|
||
.type {
|
||
font-size: 12px;
|
||
font-family: PingFangSC-Regular, PingFang SC;
|
||
font-weight: 400;
|
||
color: #a69e9f;
|
||
line-height: 18px;
|
||
white-space: nowrap;
|
||
}
|
||
}
|
||
|
||
.value {
|
||
font-size: 14px;
|
||
font-family: PingFangSC-Semibold, PingFang SC;
|
||
color: #160002;
|
||
line-height: 22px;
|
||
padding-left: 10px;
|
||
|
||
.type {
|
||
font-size: 12px;
|
||
font-family: PingFangSC-Regular, PingFang SC;
|
||
font-weight: 400;
|
||
color: #a69e9f;
|
||
line-height: 18px;
|
||
white-space: nowrap;
|
||
}
|
||
}
|
||
}
|
||
}
|
||
|
||
.valueBox {
|
||
display: inline-block;
|
||
text-align: right;
|
||
|
||
.addBox {
|
||
display: flex;
|
||
align-items: center;
|
||
justify-content: flex-end;
|
||
|
||
.addIcon {
|
||
width: 16px;
|
||
height: 16px;
|
||
margin-right: 2px;
|
||
}
|
||
|
||
.type {
|
||
font-size: 12px;
|
||
font-family: PingFangSC-Regular, PingFang SC;
|
||
font-weight: 400;
|
||
color: #a69e9f;
|
||
line-height: 18px;
|
||
white-space: nowrap;
|
||
}
|
||
}
|
||
|
||
.value {
|
||
font-size: 14px;
|
||
font-family: PingFangSC-Semibold, PingFang SC;
|
||
color: #160002;
|
||
line-height: 22px;
|
||
padding-left: 10px;
|
||
|
||
.type {
|
||
font-size: 12px;
|
||
font-family: PingFangSC-Regular, PingFang SC;
|
||
font-weight: 400;
|
||
color: #a69e9f;
|
||
line-height: 18px;
|
||
white-space: nowrap;
|
||
}
|
||
}
|
||
}
|
||
|
||
.top {
|
||
display: flex;
|
||
align-items: center;
|
||
|
||
.thirdTitle {
|
||
font-size: 12px;
|
||
font-family: PingFangSC-Semibold, PingFang SC;
|
||
font-weight: 600;
|
||
color: #160002;
|
||
line-height: 22px;
|
||
padding-left: 30px;
|
||
}
|
||
|
||
.right {
|
||
flex: 1;
|
||
display: flex;
|
||
justify-content: flex-end;
|
||
align-items: center;
|
||
|
||
.comparePlan {
|
||
font-size: 24rpx;
|
||
font-family: PingFangSC-Regular, PingFang SC;
|
||
font-weight: 400;
|
||
color: #a69e9f;
|
||
white-space: nowrap;
|
||
}
|
||
|
||
.box2 {
|
||
display: flex;
|
||
align-items: center;
|
||
|
||
.text {
|
||
font-size: 14px;
|
||
font-family: DINAlternate-Bold, DINAlternate;
|
||
color: #150002;
|
||
font-weight: bold;
|
||
|
||
line-height: 40rpx;
|
||
}
|
||
|
||
.addIcon {
|
||
width: 16px;
|
||
height: 16px;
|
||
margin-right: 2px;
|
||
}
|
||
}
|
||
}
|
||
}
|
||
|
||
.progressPlan {
|
||
width: calc(100% - 30px);
|
||
box-sizing: border-box;
|
||
margin-left: 30px;
|
||
height: 8px;
|
||
border-radius: 5px;
|
||
background: #fff;
|
||
margin-top: 8px;
|
||
position: relative;
|
||
overflow: hidden;
|
||
|
||
.trans {
|
||
height: 8px;
|
||
position: absolute;
|
||
left: 0;
|
||
top: 0;
|
||
border-top-right-radius: 4px;
|
||
border-bottom-right-radius: 4px;
|
||
background: url("https://eshangtech.com/ShopICO/ahyd-BID/index/progress_orange.png")no-repeat 100% 100%;
|
||
}
|
||
|
||
.transYear {
|
||
height: 8px;
|
||
position: absolute;
|
||
left: 0;
|
||
top: 0;
|
||
border-top-right-radius: 4px;
|
||
border-bottom-right-radius: 4px;
|
||
background: url("https://eshangtech.com/ShopICO/ahyd-BID/index/progress_blue.png")no-repeat 100% 100%;
|
||
}
|
||
}
|
||
}
|
||
}
|
||
}
|
||
}
|
||
}
|
||
|
||
.monthList {
|
||
width: 100%;
|
||
box-sizing: border-box;
|
||
padding: 12px;
|
||
background: #F5F5F5;
|
||
margin-bottom: 12px;
|
||
border-radius: 8px;
|
||
|
||
.top {
|
||
display: flex;
|
||
align-items: center;
|
||
justify-content: space-between;
|
||
|
||
.left {
|
||
display: flex;
|
||
align-items: center;
|
||
|
||
.icon {
|
||
width: 20px;
|
||
height: 20px;
|
||
margin-right: 8px;
|
||
}
|
||
|
||
.title {
|
||
font-size: 12px;
|
||
font-family: PingFangSC-Regular, PingFang SC;
|
||
font-weight: 400;
|
||
color: #a69e9f;
|
||
line-height: 18px;
|
||
|
||
.name {
|
||
color: #150002;
|
||
font-size: 18px;
|
||
}
|
||
}
|
||
|
||
.value {
|
||
font-size: 14px;
|
||
font-family: DINAlternate-Bold, DINAlternate;
|
||
font-weight: bold;
|
||
color: #FF6D40;
|
||
line-height: 16px;
|
||
margin-left: 4px;
|
||
}
|
||
}
|
||
|
||
.right {
|
||
display: flex;
|
||
align-items: center;
|
||
|
||
.comparePlan {
|
||
font-size: 24rpx;
|
||
font-family: PingFangSC-Regular, PingFang SC;
|
||
font-weight: 400;
|
||
color: #a69e9f;
|
||
line-height: 36rpx;
|
||
white-space: nowrap;
|
||
}
|
||
|
||
.box2 {
|
||
display: flex;
|
||
align-items: center;
|
||
|
||
.text {
|
||
font-size: 14px;
|
||
font-family: DINAlternate-Bold, DINAlternate;
|
||
color: #150002;
|
||
font-weight: bold;
|
||
|
||
line-height: 40rpx;
|
||
}
|
||
|
||
.addIcon {
|
||
width: 16px;
|
||
height: 16px;
|
||
margin-right: 2px;
|
||
}
|
||
}
|
||
}
|
||
|
||
}
|
||
|
||
.progress {
|
||
width: 100%;
|
||
height: 8px;
|
||
background: #fff;
|
||
border-radius: 6px;
|
||
margin: 8px 0 16px;
|
||
position: relative;
|
||
overflow: hidden;
|
||
|
||
.have {
|
||
position: absolute;
|
||
height: 100%;
|
||
border-radius: 6px;
|
||
top: 0;
|
||
left: 0;
|
||
background: #778CFD;
|
||
}
|
||
}
|
||
|
||
.bottom {
|
||
display: flex;
|
||
justify-content: space-between;
|
||
margin-top: 16px;
|
||
|
||
.success {
|
||
width: calc(50% - 4px);
|
||
display: flex;
|
||
align-items: center;
|
||
|
||
.text {
|
||
font-size: 12px;
|
||
font-family: PingFangSC-Regular, PingFang SC;
|
||
font-weight: 400;
|
||
color: #a69e9f;
|
||
line-height: 20px;
|
||
}
|
||
|
||
.money {
|
||
margin-left: 8px;
|
||
font-size: 14px;
|
||
font-family: PingFangSC-Semibold, PingFang SC;
|
||
font-weight: 600;
|
||
color: #a69e9f;
|
||
line-height: 20px;
|
||
}
|
||
}
|
||
}
|
||
}
|
||
}
|
||
</style>
|