先传一版
This commit is contained in:
parent
4383a48d0b
commit
d7525d0584
@ -127,7 +127,9 @@ import request from '@/util/index.js'
|
|||||||
serverpartId: obj.id,
|
serverpartId: obj.id,
|
||||||
provinceCode: obj.pcode,
|
provinceCode: obj.pcode,
|
||||||
SearchKeyName:_this.pageOption.searchKey,
|
SearchKeyName:_this.pageOption.searchKey,
|
||||||
SearchKeyValue:_this.pageOption.searchValue
|
SearchKeyValue:_this.pageOption.searchValue,
|
||||||
|
BusinessType:_this.pageOption.BusinessTypeValue?_this.pageOption.BusinessTypeValue:'',
|
||||||
|
SettlementMode:_this.pageOption.SettlementModeValue?_this.pageOption.SettlementModeValue:'',
|
||||||
}).then(res=>{
|
}).then(res=>{
|
||||||
console.log('res',res)
|
console.log('res',res)
|
||||||
if(res.Result_Code==100) {
|
if(res.Result_Code==100) {
|
||||||
|
|||||||
@ -2,6 +2,7 @@
|
|||||||
<view class="page-body">
|
<view class="page-body">
|
||||||
<!-- 日期筛选 -->
|
<!-- 日期筛选 -->
|
||||||
<div class="ai-center screen-box" style="padding-bottom: 8rpx">
|
<div class="ai-center screen-box" style="padding-bottom: 8rpx">
|
||||||
|
<!-- <view class="searchBtn" @click="handleSelect">查询筛选</view>-->
|
||||||
<!-- 搜索框内容 -->
|
<!-- 搜索框内容 -->
|
||||||
<div style="display: flex;align-items: center;justify-content: space-between;padding: 10rpx 0">
|
<div style="display: flex;align-items: center;justify-content: space-between;padding: 10rpx 0">
|
||||||
<div class="search_box">
|
<div class="search_box">
|
||||||
@ -9,7 +10,7 @@
|
|||||||
<input v-model="searchText" confirm-type="search" @confirm="getList" placeholder="请输入关键字" class="select_input" clear/>
|
<input v-model="searchText" confirm-type="search" @confirm="getList" placeholder="请输入关键字" class="select_input" clear/>
|
||||||
<img src="/static/images/recons/delete.svg" alt="" class="delete" @click="handleDelete">
|
<img src="/static/images/recons/delete.svg" alt="" class="delete" @click="handleDelete">
|
||||||
</div>
|
</div>
|
||||||
<div class="select_btn" @click="handleSelect" v-if="false">
|
<div class="select_btn" @click="handleSelect" >
|
||||||
<img src="/static/images/recons/select_icon.svg" alt="" class="select_icon">
|
<img src="/static/images/recons/select_icon.svg" alt="" class="select_icon">
|
||||||
筛选
|
筛选
|
||||||
</div>
|
</div>
|
||||||
@ -26,7 +27,21 @@
|
|||||||
<text class="uni-icon uni-icon-arrowdown"></text>
|
<text class="uni-icon uni-icon-arrowdown"></text>
|
||||||
</picker>
|
</picker>
|
||||||
</div>
|
</div>
|
||||||
|
<!-- BusinessType【经营模式】 SettlementMode【结算模式】 -->
|
||||||
|
<!-- <view class="searchBox">-->
|
||||||
|
<!-- <view class="searchItem">-->
|
||||||
|
<!-- <span class="searchLabel">经营模式</span>-->
|
||||||
|
<!-- <picker mode="selector" :range="BusinessTypeList" :value="BusinessTypeIndex" range-key="label">-->
|
||||||
|
<!-- {{BusinessTypeList[BusinessTypeIndex].label}}-->
|
||||||
|
<!-- </picker>-->
|
||||||
|
<!-- </view>-->
|
||||||
|
<!-- <view class="searchItem">-->
|
||||||
|
<!-- <span class="searchLabel">结算模式</span>-->
|
||||||
|
<!-- <picker mode="selector" :range="SettlementModeList" :value="SettlementModeIndex" range-key="label">-->
|
||||||
|
<!-- {{SettlementModeList[SettlementModeIndex].label}}-->
|
||||||
|
<!-- </picker>-->
|
||||||
|
<!-- </view>-->
|
||||||
|
<!-- </view>-->
|
||||||
</div>
|
</div>
|
||||||
<template v-if="!pageData.isLoading && pageData.msg && pageData.msg.Total_Revenue">
|
<template v-if="!pageData.isLoading && pageData.msg && pageData.msg.Total_Revenue">
|
||||||
<view class="uni-flex ai-center head-card" >
|
<view class="uni-flex ai-center head-card" >
|
||||||
@ -68,12 +83,22 @@
|
|||||||
<text>经营报表</text>
|
<text>经营报表</text>
|
||||||
</view>
|
</view>
|
||||||
<view class="modleText" v-if="pageData.msg.SearchResult">
|
<view class="modleText" v-if="pageData.msg.SearchResult">
|
||||||
<div v-for="(item,index) in pageData.msg.SearchResult" :key="index">
|
<div v-if="BusinessTypeValue!==0 || SettlementModeValue!==0">
|
||||||
|
<span class="text">{{pageData.msg.SearchResult[0]}}</span>
|
||||||
|
<view class="text" v-if="BusinessTypeValue!==0">{{`经营模式: ${BusinessTypeList.filter(item=> item.value===BusinessTypeValue)[0].label}`}}</view>
|
||||||
|
<view class="text" v-if="SettlementModeValue!==0">{{`结算模式: ${SettlementModeList.filter(item=> item.value===SettlementModeValue)[0].label}`}}</view>
|
||||||
|
</div>
|
||||||
|
<div v-else>
|
||||||
|
<div v-for="(item,index) in pageData.msg.SearchResult" :key="index">
|
||||||
<span class="text" v-for="(subItem,subIndex) in item" :key="subIndex">
|
<span class="text" v-for="(subItem,subIndex) in item" :key="subIndex">
|
||||||
<span class="text" style="color:red" v-if="item.length>1 && subItem.indexOf('：')===-1">{{searchText}}</span>
|
<span class="text" style="color:red" v-if="item.length>1 && subItem.indexOf('：')===-1">{{searchText}}</span>
|
||||||
{{subItem}}
|
{{subItem}}
|
||||||
</span>
|
</span>
|
||||||
|
</div>
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
</view>
|
</view>
|
||||||
<view class="bg-white" v-if="ServerpartList.length>0">
|
<view class="bg-white" v-if="ServerpartList.length>0">
|
||||||
<view class="region-area-title uni-flex ai-center jc-between" v-show="pageData.msg.Province_ExternalAmount" :class="{'active':pageData.insideShow}" @tap="pageData.insideShow=!pageData.insideShow">
|
<view class="region-area-title uni-flex ai-center jc-between" v-show="pageData.msg.Province_ExternalAmount" :class="{'active':pageData.insideShow}" @tap="pageData.insideShow=!pageData.insideShow">
|
||||||
@ -155,28 +180,65 @@
|
|||||||
|
|
||||||
|
|
||||||
<uni-popup ref="popup" type="bottom" style="background: #fff" :maskClick="false">
|
<uni-popup ref="popup" type="bottom" style="background: #fff" :maskClick="false">
|
||||||
<div class="popupBox" style="box-sizing:border-box;height: 170px">
|
<div class="popupBox" style="box-sizing:border-box;height: 430px">
|
||||||
<div style="display: flex;align-items: center;justify-content: space-between">
|
<div style="display: flex;align-items: center;justify-content: space-between">
|
||||||
<text class="title">请选择查询项</text>
|
<text class="title">查询配置</text>
|
||||||
<img src="/static/images/recons/delete.svg" alt="" class="delete" @click="handleClosePopup">
|
<img src="/static/images/recons/delete.svg" alt="" class="delete" @click="handleClosePopup">
|
||||||
</div>
|
</div>
|
||||||
<div class="checkBox" v-if="isScreen">
|
<div class="popupContent">
|
||||||
<checkbox-group @change="handleChangeCheckBox">
|
<div class="search_box">
|
||||||
<label>
|
<img src="/static/images/recons/search_icon.svg" alt="" class="search_icon">
|
||||||
<checkbox value="MerchantName" :checked="checkBoxValue.filter(item=>item==='MerchantName').length>0"/>商户
|
<input v-model="searchText" confirm-type="search" @confirm="getList" placeholder="可以查询门店/服务区/品牌/商家等信息" class="select_input" clear/>
|
||||||
</label>
|
<img src="/static/images/recons/delete.svg" alt="" class="delete" @click="handleDelete">
|
||||||
<label>
|
</div>
|
||||||
<checkbox value="Brand" :checked="checkBoxValue.filter(item=>item==='Brand').length>0"/>品牌
|
<view class="popupTitle">日期选择</view>
|
||||||
</label>
|
<view class="timeList">
|
||||||
<label>
|
<view :class="selectTime===item.value?'timeItem timeSelectItem':'timeItem'" v-for="(item,index) in timeTypeList" :key="index" @click="handleChangeTime(item.value)">{{item.label}}</view>
|
||||||
<checkbox value="Shop" :checked="checkBoxValue.filter(item=>item==='Shop').length>0"/>门店
|
</view>
|
||||||
</label>
|
<view class="timeList">
|
||||||
</checkbox-group>
|
<view :class="selectTimeOther?'timeItem timeSelectItem':'timeItem'" @click="handleTimeOther">自定义</view>
|
||||||
|
</view>
|
||||||
|
<view class="popupTitle">经营模式</view>
|
||||||
|
<view class="timeList">
|
||||||
|
<view :class="BusinessTypeValue===item.value?'timeItem timeSelectItem':'timeItem'" v-for="(item,index) in BusinessTypeList" :key="index" @click="handleChangeBusiness(item.value)">{{item.label}}</view>
|
||||||
|
</view>
|
||||||
|
<view class="popupTitle">结算模式</view>
|
||||||
|
<view class="timeList">
|
||||||
|
<view :class="SettlementModeValue===item.value?'timeItem timeSelectItem':'timeItem'" v-for="(item,index) in SettlementModeList" :key="index" @click="handleChangeSettlement(item.value)">{{item.label}}</view>
|
||||||
|
</view>
|
||||||
</div>
|
</div>
|
||||||
|
<!-- <div class="checkBox" v-if="isScreen">-->
|
||||||
|
<!-- <checkbox-group @change="handleChangeCheckBox">-->
|
||||||
|
<!-- <label>-->
|
||||||
|
<!-- <checkbox value="MerchantName" :checked="checkBoxValue.filter(item=>item==='MerchantName').length>0"/>商户-->
|
||||||
|
<!-- </label>-->
|
||||||
|
<!-- <label>-->
|
||||||
|
<!-- <checkbox value="Brand" :checked="checkBoxValue.filter(item=>item==='Brand').length>0"/>品牌-->
|
||||||
|
<!-- </label>-->
|
||||||
|
<!-- <label>-->
|
||||||
|
<!-- <checkbox value="Shop" :checked="checkBoxValue.filter(item=>item==='Shop').length>0"/>门店-->
|
||||||
|
<!-- </label>-->
|
||||||
|
<!-- </checkbox-group>-->
|
||||||
|
<!-- </div>-->
|
||||||
<div class="btn" @click="handleConfirmCheckChange">确认</div>
|
<div class="btn" @click="handleConfirmCheckChange">确认</div>
|
||||||
</div>
|
</div>
|
||||||
</uni-popup>
|
</uni-popup>
|
||||||
|
<uni-popup ref="timePopup" type="center" style="background: #fff">
|
||||||
|
<div class="timePopup">
|
||||||
|
<div style="display: flex;margin-left: 10%">
|
||||||
|
<picker mode="date" @change="handleChangeTimePopup($event,0)" :value="searchTimePopup[0]" :end="pageData.endDate" start="2018-12-01" class="screen-unit">
|
||||||
|
<text style="font-size: 32rpx">{{searchTimePopup[0]}}</text>
|
||||||
|
<text class="uni-icon uni-icon-arrowdown"></text>
|
||||||
|
</picker>
|
||||||
|
<text class="mr20">至</text>
|
||||||
|
<picker mode="date" @change="handleChangeTimePopup($event,0)" :value="searchTimePopup[1]" :end="pageData.endDate" start="2018-12-01" class="screen-unit">
|
||||||
|
<text style="font-size: 32rpx">{{searchTimePopup[1]}}</text>
|
||||||
|
<text class="uni-icon uni-icon-arrowdown"></text>
|
||||||
|
</picker>
|
||||||
|
</div>
|
||||||
|
<div class="btn" @click="handleTimePopup">确认</div>
|
||||||
|
</div>
|
||||||
|
</uni-popup>
|
||||||
</view>
|
</view>
|
||||||
|
|
||||||
</template>
|
</template>
|
||||||
@ -184,6 +246,7 @@
|
|||||||
<script>
|
<script>
|
||||||
import {mapState} from 'vuex'
|
import {mapState} from 'vuex'
|
||||||
import request from '@/util/index.js'
|
import request from '@/util/index.js'
|
||||||
|
import {wrapTreeNode} from "../../util/dateTime";
|
||||||
export default {
|
export default {
|
||||||
|
|
||||||
data() {
|
data() {
|
||||||
@ -209,20 +272,72 @@
|
|||||||
searchText:'',// 搜索框内容
|
searchText:'',// 搜索框内容
|
||||||
requestText:'',// 已经请求过接口的查询框内容
|
requestText:'',// 已经请求过接口的查询框内容
|
||||||
isScreen:false,// 显示popup里面的内容
|
isScreen:false,// 显示popup里面的内容
|
||||||
checkBoxValue:['MerchantName','Brand','Shop'],// 查询的字段放接口里的
|
checkBoxValue:['MerchantName','Brand','Shop','Serverpart'],// 查询的字段放接口里的
|
||||||
checkChange:['MerchantName','Brand','Shop'],// checkBox里面选择了 但是没点确定的
|
checkChange:['MerchantName','Brand','Shop','Serverpart'],// checkBox里面选择了 但是没点确定的
|
||||||
}
|
BusinessTypeList:[],// 经营模式列表
|
||||||
|
BusinessTypeValue:0,// 经营模式的选择项
|
||||||
|
SettlementModeList:[],// 结算模式列表
|
||||||
|
SettlementModeValue:0,// 结算模式的选择项
|
||||||
|
timeTypeList:[{label:'近1周',value:1},{label:'近1月',value:2},{label:'近3月',value:3},{label:'近半年',value:4}],
|
||||||
|
selectTime:0,
|
||||||
|
selectTimeOther:false,
|
||||||
|
timePopup:false,
|
||||||
|
searchTimePopup: [null,null],
|
||||||
|
}
|
||||||
},
|
},
|
||||||
computed:{
|
computed:{
|
||||||
...mapState({'ProvinceCode':(state)=>{return state.userData.ProvinceCode}}),
|
...mapState({'ProvinceCode':(state)=>{return state.userData.ProvinceCode}}),
|
||||||
},
|
},
|
||||||
methods: {
|
methods: {
|
||||||
|
// 自定义时间选框里面的选择
|
||||||
|
handleChangeTimePopup(e,index){
|
||||||
|
console.log('e',e)
|
||||||
|
console.log('index',index)
|
||||||
|
this.searchTimePopup[index] = e.detail.value
|
||||||
|
this.$forceUpdate()
|
||||||
|
},
|
||||||
|
// 自定义时间选框的确定
|
||||||
|
handleTimePopup(){
|
||||||
|
console.log('this.searchTimePopup',this.searchTimePopup)
|
||||||
|
this.pageData.searchTime = this.searchTimePopup
|
||||||
|
this.$refs.timePopup.close()
|
||||||
|
},
|
||||||
|
// 选择了经营模式
|
||||||
|
handleChangeSettlement(value){
|
||||||
|
this.SettlementModeValue = value
|
||||||
|
},
|
||||||
|
// 选择了经营模式
|
||||||
|
handleChangeBusiness(value){
|
||||||
|
this.BusinessTypeValue = value
|
||||||
|
},
|
||||||
|
// 选择了自定义时间
|
||||||
|
handleTimeOther(){
|
||||||
|
this.searchTimePopup = JSON.parse(JSON.stringify(this.pageData.searchTime))
|
||||||
|
this.$refs.timePopup.open()
|
||||||
|
this.selectTimeOther = true
|
||||||
|
this.selectTime = 0
|
||||||
|
},
|
||||||
|
// 改变选择的时间
|
||||||
|
handleChangeTime(value){
|
||||||
|
this.selectTimeOther = false
|
||||||
|
this.selectTime = value
|
||||||
|
},
|
||||||
|
async handleEnumeration(text){
|
||||||
|
const req ={
|
||||||
|
FieldExplainField: text,
|
||||||
|
sessionName: text,
|
||||||
|
FieldEnumStatus:true
|
||||||
|
}
|
||||||
|
const data = await request.$webGet('EShangApiMain/FrameWork/GetFieldEnumTree',req)
|
||||||
|
let list = wrapTreeNode(data.Result_Data.List)
|
||||||
|
console.log('list',list)
|
||||||
|
return list
|
||||||
|
},
|
||||||
handleChangeCheckBox(e){
|
handleChangeCheckBox(e){
|
||||||
this.checkChange = e.detail.value
|
this.checkChange = e.detail.value
|
||||||
},
|
},
|
||||||
handleConfirmCheckChange(){
|
handleConfirmCheckChange(){
|
||||||
this.checkBoxValue = this.checkChange
|
this.checkBoxValue = this.checkChange
|
||||||
console.log('checkBoxValue',this.checkBoxValue)
|
|
||||||
this.$refs.popup.close()
|
this.$refs.popup.close()
|
||||||
this.isScreen= false
|
this.isScreen= false
|
||||||
this.getList()
|
this.getList()
|
||||||
@ -231,6 +346,10 @@
|
|||||||
this.checkChange = this.checkBoxValue
|
this.checkChange = this.checkBoxValue
|
||||||
this.$refs.popup.close()
|
this.$refs.popup.close()
|
||||||
this.isScreen= false
|
this.isScreen= false
|
||||||
|
this.BusinessTypeValue = 0
|
||||||
|
this.SettlementModeValue = 0
|
||||||
|
this.selectTime = 0
|
||||||
|
this.getList()
|
||||||
},
|
},
|
||||||
handleDelete(){
|
handleDelete(){
|
||||||
this.searchText = ''
|
this.searchText = ''
|
||||||
@ -238,7 +357,6 @@
|
|||||||
handleSelect(){
|
handleSelect(){
|
||||||
this.$refs.popup.open()
|
this.$refs.popup.open()
|
||||||
this.isScreen= true
|
this.isScreen= true
|
||||||
console.log('111')
|
|
||||||
},
|
},
|
||||||
toTrend(){
|
toTrend(){
|
||||||
this.$util.toNextRoute('navigateTo','/pages/operatingStatements/operatingTrend?time='+this.pageData.searchTime[1])
|
this.$util.toNextRoute('navigateTo','/pages/operatingStatements/operatingTrend?time='+this.pageData.searchTime[1])
|
||||||
@ -265,7 +383,10 @@
|
|||||||
},
|
},
|
||||||
toDetail(item){
|
toDetail(item){
|
||||||
console.log('item',item)
|
console.log('item',item)
|
||||||
this.$util.toNextRoute('navigateTo', '/pages/operatingStatements/detail?pcode='+item.Province_Code+'&id=' + item.Serverpart_Id + '&st=' + this.pageData.searchTime[0]+ '&et=' + this.pageData.searchTime[1]+'&searchKey='+JSON.parse(JSON.stringify(this.checkBoxValue)) + '&searchValue='+this.requestText)
|
this.$util.toNextRoute('navigateTo', '/pages/operatingStatements/detail?pcode='+item.Province_Code+'&id=' +
|
||||||
|
item.Serverpart_Id + '&st=' + this.pageData.searchTime[0]+ '&et=' + this.pageData.searchTime[1]+
|
||||||
|
'&searchKey='+JSON.parse(JSON.stringify(this.checkBoxValue)) + '&searchValue='+this.requestText+
|
||||||
|
'&BusinessTypeValue='+this.BusinessTypeValue+'&SettlementModeValue='+this.SettlementModeValue)
|
||||||
item.visited = true
|
item.visited = true
|
||||||
this.$forceUpdate()
|
this.$forceUpdate()
|
||||||
},
|
},
|
||||||
@ -284,14 +405,19 @@
|
|||||||
searchName = item
|
searchName = item
|
||||||
}
|
}
|
||||||
})
|
})
|
||||||
// _this.$request.$webGet('WeChat/GetRevenueReport',{
|
let req;
|
||||||
request.$webGet('CommercialApi/Revenue/GetRevenueReport',{
|
req = {
|
||||||
startTime: searchTime[0],
|
startTime: searchTime[0],
|
||||||
endTime: searchTime[1],
|
endTime: searchTime[1],
|
||||||
SearchKeyName:searchName,
|
SearchKeyName:searchName,
|
||||||
SearchKeyValue:this.searchText
|
SearchKeyValue:this.searchText,
|
||||||
// additionalCode: this.ProvinceCode=='330000' ? '451200,630000' :''
|
BusinessType:this.BusinessTypeValue?this.BusinessTypeValue:'',
|
||||||
}).then(res=>{
|
SettlementMode:this.SettlementModeValue?this.SettlementModeValue:'',
|
||||||
|
// additionalCode: this.ProvinceCode=='330000' ? '451200,630000' :''
|
||||||
|
}
|
||||||
|
console.log('req',req)
|
||||||
|
// _this.$request.$webGet('WeChat/GetRevenueReport',{
|
||||||
|
request.$webGet('CommercialApi/Revenue/GetRevenueReport',req).then(res=>{
|
||||||
console.log('res',res)
|
console.log('res',res)
|
||||||
if(res.Result_Code==100) {
|
if(res.Result_Code==100) {
|
||||||
_this.pageData.msg = res.Result_Data
|
_this.pageData.msg = res.Result_Data
|
||||||
@ -307,15 +433,15 @@
|
|||||||
}
|
}
|
||||||
|
|
||||||
// _this.pageData.msg.SearchResult
|
// _this.pageData.msg.SearchResult
|
||||||
if (res.Result_Data.SearchResult){
|
if (this.BusinessTypeValue === 0 && this.SettlementModeValue === 0){
|
||||||
let newList = []
|
if (res.Result_Data.SearchResult){
|
||||||
res.Result_Data.SearchResult.forEach(item=>{
|
let newList = []
|
||||||
console.log('item.split(this.searchText)',item.split(this.searchText))
|
res.Result_Data.SearchResult.forEach(item=>{
|
||||||
newList.push(item.split(this.searchText))
|
newList.push(item.split(this.searchText))
|
||||||
_this.pageData.msg.SearchResult = newList
|
_this.pageData.msg.SearchResult = newList
|
||||||
})
|
})
|
||||||
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
_this.ServerpartList = res.Result_Data.revenueRegionModels
|
_this.ServerpartList = res.Result_Data.revenueRegionModels
|
||||||
}else if(res.Result_Code==200 || res.Result_Code==999){
|
}else if(res.Result_Code==200 || res.Result_Code==999){
|
||||||
_this.noDataText = '暂无数据'
|
_this.noDataText = '暂无数据'
|
||||||
@ -331,10 +457,12 @@
|
|||||||
uni.hideLoading()
|
uni.hideLoading()
|
||||||
_this.pageData.isLoading =false
|
_this.pageData.isLoading =false
|
||||||
_this.$forceUpdate()
|
_this.$forceUpdate()
|
||||||
|
console.log('this.BusinessTypeValue',this.BusinessTypeValue)
|
||||||
|
console.log('this.SettlementModeValue',this.SettlementModeValue)
|
||||||
})
|
})
|
||||||
}
|
}
|
||||||
},
|
},
|
||||||
onLoad(query) {
|
async onLoad(query) {
|
||||||
// uni.showLoading({
|
// uni.showLoading({
|
||||||
// title:'正在加载...',
|
// title:'正在加载...',
|
||||||
// mask:true
|
// mask:true
|
||||||
@ -366,6 +494,9 @@
|
|||||||
this.pageData.searchTime = time
|
this.pageData.searchTime = time
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
this.BusinessTypeList = await this.handleEnumeration('BUSINESS_TYPE')
|
||||||
|
this.SettlementModeList = await this.handleEnumeration('SETTLEMENT_MODES')
|
||||||
|
console.log('BusinessTypeList',this.BusinessTypeList)
|
||||||
this.getList()
|
this.getList()
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
@ -423,10 +554,71 @@
|
|||||||
background: #fff;
|
background: #fff;
|
||||||
box-sizing: border-box;
|
box-sizing: border-box;
|
||||||
padding: 24rpx;
|
padding: 24rpx;
|
||||||
|
.popupContent{
|
||||||
|
margin-top: 24rpx;
|
||||||
|
.search_box {
|
||||||
|
position: relative;
|
||||||
|
width: 100%;
|
||||||
|
height: 72rpx;
|
||||||
|
background: #F2F4F5;
|
||||||
|
display: flex;
|
||||||
|
flex-direction: row;
|
||||||
|
align-items: center;
|
||||||
|
border-radius: 36rpx;
|
||||||
|
img {
|
||||||
|
width: 35rpx;
|
||||||
|
height: 35rpx;
|
||||||
|
margin: auto 16rpx auto 24rpx;
|
||||||
|
}
|
||||||
|
.select_input {
|
||||||
|
width: 80%;
|
||||||
|
border: none;
|
||||||
|
height: 40rpx;
|
||||||
|
font-size: 28rpx;
|
||||||
|
}
|
||||||
|
.delete{
|
||||||
|
width: 20px;
|
||||||
|
height: 20px;
|
||||||
|
position: absolute;
|
||||||
|
right: 0%;
|
||||||
|
z-index: 99;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
.popupTitle{
|
||||||
|
font-size: 32rpx;
|
||||||
|
font-family: PingFangSC-Regular, PingFang SC;
|
||||||
|
font-weight: bold;
|
||||||
|
line-height: 40rpx;
|
||||||
|
margin-top: 24rpx;
|
||||||
|
}
|
||||||
|
.timeList{
|
||||||
|
width: 100%;
|
||||||
|
display: flex;
|
||||||
|
align-items: center;
|
||||||
|
flex-flow: wrap;
|
||||||
|
justify-content: space-between;
|
||||||
|
padding: 12rpx 0;
|
||||||
|
.timeItem{
|
||||||
|
width: 22%;
|
||||||
|
box-sizing: border-box;
|
||||||
|
text-align: center;
|
||||||
|
background: #ffffff;
|
||||||
|
border: 1rpx solid #efefef;
|
||||||
|
margin-bottom: 8rpx;
|
||||||
|
}
|
||||||
|
.timeSelectItem{
|
||||||
|
background: #e8f3fd;
|
||||||
|
border: 1rpx solid #e8f3fd;
|
||||||
|
color: #4D95F0;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
|
||||||
.title{
|
.title{
|
||||||
font-size: 32rpx;
|
font-size: 32rpx;
|
||||||
font-family: PingFangSC-Regular, PingFang SC;
|
font-family: PingFangSC-Regular, PingFang SC;
|
||||||
font-weight: 400;
|
font-weight: bold;
|
||||||
line-height: 40rpx;
|
line-height: 40rpx;
|
||||||
}
|
}
|
||||||
.delete{
|
.delete{
|
||||||
@ -450,6 +642,28 @@
|
|||||||
padding-bottom: 0px!important;
|
padding-bottom: 0px!important;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
.timePopup{
|
||||||
|
width: 80vw;
|
||||||
|
height: 130px;
|
||||||
|
background: #fff;
|
||||||
|
box-sizing: border-box;
|
||||||
|
border-radius: 16rpx;
|
||||||
|
padding: 24rpx;
|
||||||
|
display: flex;
|
||||||
|
flex-direction: column;
|
||||||
|
justify-content: center;
|
||||||
|
.btn{
|
||||||
|
width: calc(100% - 48px);
|
||||||
|
margin-left: 24px;
|
||||||
|
padding: 15rpx 0;
|
||||||
|
text-align: center;
|
||||||
|
border-radius: 16rpx;
|
||||||
|
color:#fff;
|
||||||
|
background: #0A98D5;
|
||||||
|
margin-top: 30rpx;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
.screen-box {
|
.screen-box {
|
||||||
background-color: #fff;
|
background-color: #fff;
|
||||||
padding: 0 20rpx;
|
padding: 0 20rpx;
|
||||||
@ -458,6 +672,36 @@
|
|||||||
left: 0;
|
left: 0;
|
||||||
z-index: 9;
|
z-index: 9;
|
||||||
}
|
}
|
||||||
|
.screen-box .searchBtn{
|
||||||
|
margin-top: 12rpx;
|
||||||
|
box-sizing: border-box;
|
||||||
|
padding: 2rpx 10rpx;
|
||||||
|
border-radius: 6rpx;
|
||||||
|
background: rgba(22, 155, 213, 1);
|
||||||
|
color: #fff;
|
||||||
|
display: inline-block;
|
||||||
|
}
|
||||||
|
.screen-box .searchBox{
|
||||||
|
width: 100%;
|
||||||
|
display: flex;
|
||||||
|
justify-content: space-between;
|
||||||
|
align-items: center;
|
||||||
|
}
|
||||||
|
.screen-box .searchBox .searchItem{
|
||||||
|
display: flex;
|
||||||
|
width: 50%;
|
||||||
|
align-items: center;
|
||||||
|
}
|
||||||
|
.searchBox .searchItem .searchLabel{
|
||||||
|
margin-right: 16rpx;
|
||||||
|
font-size: 16px;
|
||||||
|
font-family: DINAlternate-Bold, DINAlternate;
|
||||||
|
font-weight: bold;
|
||||||
|
line-height: 40rpx;
|
||||||
|
}
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
.screen-box .screen-unit {
|
.screen-box .screen-unit {
|
||||||
display: flex;
|
display: flex;
|
||||||
align-items: center;
|
align-items: center;
|
||||||
@ -484,7 +728,7 @@
|
|||||||
vertical-align: middle;
|
vertical-align: middle;
|
||||||
}
|
}
|
||||||
.head-card {
|
.head-card {
|
||||||
padding: 40rpx 26rpx;
|
padding: 12rpx 26rpx 40rpx;
|
||||||
background-color: #fff;
|
background-color: #fff;
|
||||||
}
|
}
|
||||||
.head-card>view {
|
.head-card>view {
|
||||||
|
|||||||
File diff suppressed because it is too large
Load Diff
21284
pages/revenue/expenditureData.js
Normal file
21284
pages/revenue/expenditureData.js
Normal file
File diff suppressed because it is too large
Load Diff
@ -1,138 +1,187 @@
|
|||||||
<template>
|
<template>
|
||||||
<view class="main">
|
<view class="main">
|
||||||
|
<view class="meng" v-if="showMeng" @click="handleAllNotice"></view>
|
||||||
<view class="header">
|
<view class="header">
|
||||||
<view class="headerTop" :style="{top: menu.top + 'px',height:menu.height + 'px'}">
|
<view class="headerTop" :style="{height:(menu.top+menu.height) + 'px'}">
|
||||||
<image @click="handleBack" class="backIcon" src="https://eshangtech.com/ShopICO/ahyd-BID/commercial/navigation-left.svg"></image>
|
<image @click="handleBack" class="backIcon" src="https://eshangtech.com/ShopICO/ahyd-BID/commercial/navigation-left.svg"></image>
|
||||||
<text class="pageTitle">支出详情</text>
|
<text class="pageTitle">支出详情</text>
|
||||||
</view>
|
</view>
|
||||||
|
|
||||||
<view class="incomeTab" :style="{top:(menu.bottom + 18) + 'px'}">
|
<view class="detailType" :style="{top:(menu.bottom + 18) + 'px'}">
|
||||||
|
<picker :range="typeList" :value="typeValue" range-key="label" @change="handleChangeType">
|
||||||
|
<span class="typeText">{{ typeList[typeValue].label }}</span>
|
||||||
|
<image class="downIcon" src="https://eshangtech.com/ShopICO/ahyd-BID/newIndex/3stDownArrow.svg"/>
|
||||||
|
</picker>
|
||||||
|
<view class="timeBox" >
|
||||||
|
<picker mode="date" fields="month" :value="single" :start="startDate" :end="endData" @change="bindDateChange" >
|
||||||
|
<text class="timeText">{{single}}</text>
|
||||||
|
<image class="timeIcon" src="https://eshangtech.com/ShopICO/ahyd-BID/newIndex/3stDownArrow.svg"/>
|
||||||
|
</picker>
|
||||||
|
</view>
|
||||||
|
</view>
|
||||||
|
|
||||||
|
<view class="incomeTab" :style="{top:(menu.bottom + 60) + 'px'}">
|
||||||
<view :class="selectTab===item.value?'selectItem incomeItem':'incomeItem'" v-for="(item,index) in pageTab" :key="index"
|
<view :class="selectTab===item.value?'selectItem incomeItem':'incomeItem'" v-for="(item,index) in pageTab" :key="index"
|
||||||
@click="handleChangePageTab(item.value)">{{item.label}}</view>
|
@click="handleChangePageTab(item.value)">{{item.label}}</view>
|
||||||
</view>
|
</view>
|
||||||
</view>
|
</view>
|
||||||
|
|
||||||
<view class="contentDetail">
|
<view class="contentDetail">
|
||||||
<view class="detailItem">
|
<view class="detailItem" v-for="(item,index) in pageList" :key="index">
|
||||||
<view class="itemTop">
|
<view class="itemTop">
|
||||||
<view class="itemTitle">服务区自营小计</view>
|
<view class="itemTitle">{{item.itemTitle}}</view>
|
||||||
<image class="monthSumBg" src="https://eshangtech.com/ShopICO/ahyd-BID/revenueBox/expenditure.png"/>
|
<image class="monthSumBg" src="https://eshangtech.com/ShopICO/ahyd-BID/revenueBox/expenditure.png"/>
|
||||||
<view class="itemBox">
|
<view class="itemBox">
|
||||||
<view class="leftChar">
|
<view class="progressBox">
|
||||||
<OtherCharts :success="number" :colorList="['#1679FF', '#E7F1FF']"/>
|
<view class="progressTop">
|
||||||
<text class="rateText">39.67%</text>
|
<span class="progressLabel">本月占比:</span>
|
||||||
|
<span class="progressValue">{{`${item.monthRate||'-'}%`}}</span>
|
||||||
|
</view>
|
||||||
|
<view class="progress">
|
||||||
|
<view class="have" :style="{width:item.monthRate>100?'100%':`${item.monthRate}%`}"></view>
|
||||||
|
</view>
|
||||||
</view>
|
</view>
|
||||||
<view class="rightDetail">
|
|
||||||
<view class="messageBox">
|
<view class="progressBox" style="margin-top: 12px">
|
||||||
<view class="success">
|
<view class="progressTop">
|
||||||
<text class="revenueValue">119.01</text>
|
<span class="progressLabel">累计完成进度占比:</span>
|
||||||
<text class="revenueLabel">2022年完成<text class="revenueUnit">/万元</text></text>
|
<span class="progressValue">{{`${item.accumulateRate||'-'}%`}}</span>
|
||||||
</view>
|
</view>
|
||||||
<view class="rateBox">
|
<view class="progress">
|
||||||
<text class="rateValue">32.54%</text>
|
<view class="have" :style="{width:item.accumulateRate>100?'100%':`${item.accumulateRate}%`}"></view>
|
||||||
<text class="rateLabel">成本比</text>
|
</view>
|
||||||
|
</view>
|
||||||
|
</view>
|
||||||
|
|
||||||
|
<view class="listBox" v-if="item.list && item.list.length>0">
|
||||||
|
<view class="listBoxItem" v-for="(subItem,subIndex) in item.list[typeValue]" :key="subIndex">
|
||||||
|
<view class="subItemTop">
|
||||||
|
<view class="index" :style="{background:`url(${subIndex===0?'https://eshangtech.com/ShopICO/ahyd-BID/revenueBox/secondBg.svg':subIndex===1?'https://eshangtech.com/ShopICO/ahyd-BID/revenueBox/thirdBg.svg':'https://eshangtech.com/ShopICO/ahyd-BID/revenueBox/otherBg.svg'})`}">{{subIndex + 1}}</view>
|
||||||
|
<span class="subItemName">{{subItem.name}}</span>
|
||||||
|
<view class="notice" @click="handleShowNotice(index,subIndex,-1,-1)">?</view>
|
||||||
|
<view class="noticeBox" v-if="firstIndex===index && secondIndex===subIndex && !(thirdIndexs>=0) && !(fourthIndexs>=0)" @click="handleCancelNotice">
|
||||||
|
<view>
|
||||||
|
<view class="noticeItem">
|
||||||
|
<span class="noticeLabel">本月预算:</span>
|
||||||
|
<span class="noticeValue">{{subItem.budgetMonth||'-'}}万元</span>
|
||||||
|
</view>
|
||||||
|
<view class="noticeItem">
|
||||||
|
<span class="noticeLabel">年度预算:</span>
|
||||||
|
<span class="noticeValue">{{subItem.budgetYear||'-'}}万元</span>
|
||||||
|
</view>
|
||||||
|
<view class="noticeItem">
|
||||||
|
<span class="noticeLabel">本月执行:</span>
|
||||||
|
<span class="noticeValue">{{subItem.monthExecute||'-'}}万元</span>
|
||||||
|
</view>
|
||||||
|
<view class="noticeItem">
|
||||||
|
<span class="noticeLabel">累计执行:</span>
|
||||||
|
<span class="noticeValue">{{subItem.accumulateExecute||'-'}}万元</span>
|
||||||
|
</view>
|
||||||
|
</view>
|
||||||
</view>
|
</view>
|
||||||
</view>
|
</view>
|
||||||
<view class="messageBox" style="margin-top: 32rpx">
|
<view class="subItemBottom" v-if="subItem.monthRate || subItem.accumulateRate">
|
||||||
<view class="success">
|
|
||||||
<text class="revenueValue">119.01</text>
|
<view class="bottomItem">
|
||||||
<text class="revenueLabel">2022年完成<text class="revenueUnit">/万元</text></text>
|
<span v-if="subItem.monthRate" class="bottomLabel">本月占比:</span>
|
||||||
|
<span v-if="subItem.monthRate" class="bottomValue">{{`${subItem.monthRate||'-'}%`}}</span>
|
||||||
</view>
|
</view>
|
||||||
<view class="rateBox">
|
|
||||||
<text class="rateValue">32.54%</text>
|
<view class="bottomItem" style="text-align: right">
|
||||||
<text class="rateLabel">成本比</text>
|
<span v-if="subItem.accumulateRate" class="bottomLabel">累计占比:</span>
|
||||||
|
<span v-if="subItem.accumulateRate" class="bottomValue">{{`${subItem.accumulateRate||'-'}%`}}</span>
|
||||||
|
</view>
|
||||||
|
</view>
|
||||||
|
|
||||||
|
<view class="thirdItemBox" v-if="subItem.list && subItem.list.length>0">
|
||||||
|
<view class="thirdItem" v-for="(thirdItem,thirdIndex) in subItem.list[typeValue]" :key="thirdIndex">
|
||||||
|
<view class="thirdItemTop">
|
||||||
|
<view class="index" :style="{backgroundImage:`url(${thirdIndex===0?'https://eshangtech.com/ShopICO/ahyd-BID/revenueBox/thirdFirst.svg':thirdIndex===1?'https://eshangtech.com/ShopICO/ahyd-BID/revenueBox/thirdSecond.svg':'https://eshangtech.com/ShopICO/ahyd-BID/revenueBox/thirdOther.svg'})`}">{{thirdIndex + 1}}</view>
|
||||||
|
<span class="subItemName">{{thirdItem.name}}</span>
|
||||||
|
<view class="notice" @click="handleShowNotice(index,subIndex,thirdIndex,-1)">?</view>
|
||||||
|
<view class="noticeBox" v-if="firstIndex===index && secondIndex===subIndex && thirdIndexs===thirdIndex&& thirdIndexs===thirdIndex && !(fourthIndexs>=0)" @click="handleCancelNotice">
|
||||||
|
<view>
|
||||||
|
<view class="noticeItem">
|
||||||
|
<span class="noticeLabel">本月预算:</span>
|
||||||
|
<span class="noticeValue">{{thirdItem.budgetMonth||'-'}}万元</span>
|
||||||
|
</view>
|
||||||
|
<view class="noticeItem">
|
||||||
|
<span class="noticeLabel">年度预算:</span>
|
||||||
|
<span class="noticeValue">{{thirdItem.budgetYear||'-'}}万元</span>
|
||||||
|
</view>
|
||||||
|
<view class="noticeItem">
|
||||||
|
<span class="noticeLabel">本月执行:</span>
|
||||||
|
<span class="noticeValue">{{thirdItem.monthExecute||'-'}}万元</span>
|
||||||
|
</view>
|
||||||
|
<view class="noticeItem">
|
||||||
|
<span class="noticeLabel">累计执行:</span>
|
||||||
|
<span class="noticeValue">{{thirdItem.accumulateExecute||'-'}}万元</span>
|
||||||
|
</view>
|
||||||
|
</view>
|
||||||
|
</view>
|
||||||
|
</view>
|
||||||
|
<view class="thirdItemBottom" v-if="thirdItem.monthRate || thirdItem.accumulateRate">
|
||||||
|
<view class="bottomItem">
|
||||||
|
<span v-if="thirdItem.monthRate" class="bottomLabel">本月占比:</span>
|
||||||
|
<span v-if="thirdItem.monthRate" class="bottomValue">{{`${thirdItem.monthRate||'-'}%`}}</span>
|
||||||
|
</view>
|
||||||
|
<view class="bottomItem" style="text-align: right">
|
||||||
|
<span v-if="thirdItem.accumulateRate" class="bottomLabel">累计占比:</span>
|
||||||
|
<span v-if="thirdItem.accumulateRate" class="bottomValue">{{`${thirdItem.accumulateRate||'-'}%`}}</span>
|
||||||
|
</view>
|
||||||
|
</view>
|
||||||
|
<view class="fourthItemBox" v-if="thirdItem.list && thirdItem.list.length>0">
|
||||||
|
<view class="fourthItem" v-for="(fourthItem,fourthIndex) in thirdItem.list[typeValue]" :key="fourthIndex">
|
||||||
|
<view class="fourthItemTop">
|
||||||
|
<view class="index" :style="{backgroundImage:`url(${fourthIndex===0?'https://eshangtech.com/ShopICO/ahyd-BID/revenueBox/fourthFirst.svg':fourthIndex===1?'https://eshangtech.com/ShopICO/ahyd-BID/revenueBox/fourthSecond.svg':'https://eshangtech.com/ShopICO/ahyd-BID/revenueBox/fourthther.svg'})`}">{{fourthIndex + 1}}</view>
|
||||||
|
<span class="subItemName">{{fourthItem.name}}</span>
|
||||||
|
<view class="notice" @click="handleShowNotice(index,subIndex,thirdIndex,fourthIndex)">?</view>
|
||||||
|
<view class="noticeBox" v-if="firstIndex===index && secondIndex===subIndex && thirdIndexs===thirdIndex && fourthIndexs===fourthIndex" @click="handleCancelNotice">
|
||||||
|
<view>
|
||||||
|
<view class="noticeItem">
|
||||||
|
<span class="noticeLabel">本月预算:</span>
|
||||||
|
<span class="noticeValue">{{fourthItem.budgetMonth||'-'}}万元</span>
|
||||||
|
</view>
|
||||||
|
<view class="noticeItem">
|
||||||
|
<span class="noticeLabel">年度预算:</span>
|
||||||
|
<span class="noticeValue">{{fourthItem.budgetYear||'-'}}万元</span>
|
||||||
|
</view>
|
||||||
|
<view class="noticeItem">
|
||||||
|
<span class="noticeLabel">本月执行:</span>
|
||||||
|
<span class="noticeValue">{{fourthItem.monthExecute||'-'}}万元</span>
|
||||||
|
</view>
|
||||||
|
<view class="noticeItem">
|
||||||
|
<span class="noticeLabel">累计执行:</span>
|
||||||
|
<span class="noticeValue">{{fourthItem.accumulateExecute||'-'}}万元</span>
|
||||||
|
</view>
|
||||||
|
</view>
|
||||||
|
</view>
|
||||||
|
</view>
|
||||||
|
<view class="fourthItemBottom" v-if="fourthItem.monthRate || fourthItem.accumulateRate">
|
||||||
|
<view class="bottomItem">
|
||||||
|
<span v-if="fourthItem.monthRate" class="bottomLabel">本月占比:</span>
|
||||||
|
<span v-if="fourthItem.monthRate" class="bottomValue">{{`${fourthItem.monthRate||'-'}%`}}</span>
|
||||||
|
</view>
|
||||||
|
<view class="bottomItem" style="text-align: right">
|
||||||
|
<span v-if="fourthItem.accumulateRate" class="bottomLabel">累计占比:</span>
|
||||||
|
<span v-if="fourthItem.accumulateRate" class="bottomValue">{{`${fourthItem.accumulateRate||'-'}%`}}</span>
|
||||||
|
</view>
|
||||||
|
</view>
|
||||||
|
</view>
|
||||||
|
</view>
|
||||||
</view>
|
</view>
|
||||||
</view>
|
</view>
|
||||||
</view>
|
</view>
|
||||||
</view>
|
</view>
|
||||||
</view>
|
</view>
|
||||||
|
|
||||||
<view class="contentBox">
|
|
||||||
<view class="contentItem" v-for="(item,index) in 3" :key="index">
|
|
||||||
<view class="topItem">
|
|
||||||
<view class="index" :style="{background:`url(${index===0?'https://eshangtech.com/ShopICO/ahyd-BID/revenueBox/secondBg.svg':index===1?'https://eshangtech.com/ShopICO/ahyd-BID/revenueBox/thirdBg.svg':'https://eshangtech.com/ShopICO/ahyd-BID/revenueBox/otherBg.svg'})`}">{{index + 1}}</view>
|
|
||||||
<view class="smallItemName">餐饮小吃</view>
|
|
||||||
</view>
|
|
||||||
<view class="bottomItem">
|
|
||||||
<view class="smallItem">
|
|
||||||
<text class="smallItemValue">46.47</text>
|
|
||||||
<text class="smallItemLabel">2022年完成<text class="unit">/万元</text></text>
|
|
||||||
</view>
|
|
||||||
<view class="smallItem">
|
|
||||||
<text class="smallItemValue">100.00</text>
|
|
||||||
<text class="smallItemLabel">2023年预计<text class="unit">/万元</text></text>
|
|
||||||
</view>
|
|
||||||
<view class="otherItem">
|
|
||||||
<text class="otherValue">46.47%</text>
|
|
||||||
<text class="otherLabel">完成率</text>
|
|
||||||
</view>
|
|
||||||
</view>
|
|
||||||
</view>
|
|
||||||
</view>
|
|
||||||
</view>
|
|
||||||
|
|
||||||
<view class="detailItem">
|
|
||||||
<view class="itemTop">
|
|
||||||
<view class="itemTitle">分公司收入小计</view>
|
|
||||||
<image class="monthSumBg" src="https://eshangtech.com/ShopICO/ahyd-BID/revenueBox/expenditure.png"/>
|
|
||||||
<view class="itemBox">
|
|
||||||
<view class="leftChar">
|
|
||||||
<OtherCharts :success="number" :colorList="['#1679FF', '#E7F1FF']"/>
|
|
||||||
<text class="rateText">39.67%</text>
|
|
||||||
</view>
|
|
||||||
<view class="rightDetail">
|
|
||||||
<view class="messageBox">
|
|
||||||
<view class="success">
|
|
||||||
<text class="revenueValue">119.01</text>
|
|
||||||
<text class="revenueLabel">2022年完成<text class="revenueUnit">/万元</text></text>
|
|
||||||
</view>
|
|
||||||
<view class="rateBox">
|
|
||||||
<text class="rateValue">32.54%</text>
|
|
||||||
<text class="rateLabel">成本比</text>
|
|
||||||
</view>
|
|
||||||
</view>
|
|
||||||
<view class="messageBox" style="margin-top: 32rpx">
|
|
||||||
<view class="success">
|
|
||||||
<text class="revenueValue">119.01</text>
|
|
||||||
<text class="revenueLabel">2022年完成<text class="revenueUnit">/万元</text></text>
|
|
||||||
</view>
|
|
||||||
<view class="rateBox">
|
|
||||||
<text class="rateValue">32.54%</text>
|
|
||||||
<text class="rateLabel">成本比</text>
|
|
||||||
</view>
|
|
||||||
</view>
|
|
||||||
</view>
|
|
||||||
</view>
|
|
||||||
</view>
|
|
||||||
|
|
||||||
<view class="contentBox">
|
|
||||||
<view class="contentItem" v-for="(item,index) in 3" :key="index">
|
|
||||||
<view class="topItem">
|
|
||||||
<view class="index" :style="{background:`url(${index===0?'https://eshangtech.com/ShopICO/ahyd-BID/revenueBox/secondBg.svg':index===1?'https://eshangtech.com/ShopICO/ahyd-BID/revenueBox/thirdBg.svg':'https://eshangtech.com/ShopICO/ahyd-BID/revenueBox/otherBg.svg'})`}">{{index + 1}}</view>
|
|
||||||
<view class="smallItemName">餐饮小吃</view>
|
|
||||||
</view>
|
|
||||||
<view class="bottomItem">
|
|
||||||
<view class="smallItem">
|
|
||||||
<text class="smallItemValue">46.47</text>
|
|
||||||
<text class="smallItemLabel">2022年完成<text class="unit">/万元</text></text>
|
|
||||||
</view>
|
|
||||||
<view class="smallItem">
|
|
||||||
<text class="smallItemValue">100.00</text>
|
|
||||||
<text class="smallItemLabel">2023年预计<text class="unit">/万元</text></text>
|
|
||||||
</view>
|
|
||||||
<view class="otherItem">
|
|
||||||
<text class="otherValue">46.47%</text>
|
|
||||||
<text class="otherLabel">完成率</text>
|
|
||||||
</view>
|
|
||||||
</view>
|
|
||||||
</view>
|
|
||||||
</view>
|
|
||||||
</view>
|
</view>
|
||||||
</view>
|
</view>
|
||||||
</view>
|
</view>
|
||||||
</template>
|
</template>
|
||||||
<script>
|
<script>
|
||||||
import OtherCharts from "./component/otherCharts.vue";
|
import OtherCharts from "./component/otherCharts.vue";
|
||||||
|
import outData from './expenditureData'
|
||||||
|
|
||||||
export default {
|
export default {
|
||||||
components:{OtherCharts},
|
components:{OtherCharts},
|
||||||
@ -142,11 +191,45 @@ export default {
|
|||||||
statusBarHeight: null,
|
statusBarHeight: null,
|
||||||
menu:{},
|
menu:{},
|
||||||
number:0,
|
number:0,
|
||||||
pageTab:[{label:'管理费用',value:1},{label:'销售费用',value:2},{label:'运营成本',value:3},{label:'其他费用',value:4}],
|
pageTab:[{label:'运营成本',value:1},{label:'管理费用',value:2},{label:'销售费用',value:3},{label:'财务费用',value:4}],
|
||||||
selectTab:1
|
selectTab:1,
|
||||||
|
typeList:[{label:'按告警情况排序',value:0},{label:'按累计完成进度占比数排序',value:1},{label:'按本月完成进度占比数排序',value:2}],
|
||||||
|
typeValue: 2,
|
||||||
|
pageData: {},// 页面数据
|
||||||
|
pageList: [],// 页面遍历的数据
|
||||||
|
single:'', // 时间选择器选择的时间
|
||||||
|
month:'',// 当前月份
|
||||||
|
startDate:'',// 开始时间
|
||||||
|
endData:'', // 结束时间
|
||||||
|
firstIndex:null,
|
||||||
|
secondIndex:null,
|
||||||
|
thirdIndexs:null,
|
||||||
|
fourthIndexs:null,
|
||||||
|
showMeng:false
|
||||||
}
|
}
|
||||||
},
|
},
|
||||||
onLoad(){
|
onLoad(query){
|
||||||
|
this.selectTab = Number(query.type)
|
||||||
|
if (query.month){
|
||||||
|
this.month = Number(query.month)
|
||||||
|
outData.forEach(item=>{
|
||||||
|
if (item.month === Number(query.month)){
|
||||||
|
this.pageData = item
|
||||||
|
this.pageList = this.selectTab===1?item.costList:this.selectTab===2?item.managerList:this.selectTab===3?item.sellingList:this.selectTab===4?item.financialList:''
|
||||||
|
console.log('pageData',this.pageData)
|
||||||
|
console.log('pageList',this.pageList)
|
||||||
|
}
|
||||||
|
})
|
||||||
|
}
|
||||||
|
const date = new Date()
|
||||||
|
let y = date.getFullYear()
|
||||||
|
let m = date.getMonth()+1
|
||||||
|
this.thisYear = y
|
||||||
|
this.startDate = `${y}-07`
|
||||||
|
this.endData = `${y}-10`
|
||||||
|
this.single = `${y}-${this.month}`
|
||||||
|
|
||||||
|
|
||||||
// 获取手机参数对页面进行适配
|
// 获取手机参数对页面进行适配
|
||||||
let systemInfo = uni.getSystemInfoSync()
|
let systemInfo = uni.getSystemInfoSync()
|
||||||
this.windowHeight = systemInfo.windowHeight
|
this.windowHeight = systemInfo.windowHeight
|
||||||
@ -166,7 +249,49 @@ export default {
|
|||||||
});
|
});
|
||||||
},
|
},
|
||||||
handleChangePageTab(value){
|
handleChangePageTab(value){
|
||||||
|
console.log('value',value)
|
||||||
this.selectTab = value
|
this.selectTab = value
|
||||||
|
this.pageList = this.selectTab===1?this.pageData.costList:this.selectTab===2?this.pageData.managerList:this.selectTab===3?this.pageData.sellingList:this.selectTab===4?this.pageData.financialList:''
|
||||||
|
},
|
||||||
|
// 改变类型的方法
|
||||||
|
handleChangeType(e){
|
||||||
|
console.log('e',e)
|
||||||
|
this.typeValue = Number(e.detail.value)
|
||||||
|
},
|
||||||
|
// 修改时间的事件
|
||||||
|
bindDateChange(e){
|
||||||
|
console.log('e',e)
|
||||||
|
this.single = e.detail.value
|
||||||
|
const date = new Date(this.single)
|
||||||
|
const y = date.getMonth() + 1
|
||||||
|
this.month = y
|
||||||
|
outData.forEach(item=>{
|
||||||
|
if (item.month === y){
|
||||||
|
this.pageData = item
|
||||||
|
this.pageList = this.selectTab===1?item.costList:this.selectTab===2?item.managerList:this.selectTab===3?item.sellingList:this.selectTab===4?item.financialList:''
|
||||||
|
}
|
||||||
|
})
|
||||||
|
},
|
||||||
|
handleShowNotice(index,subIndex,thirdIndex,fourthIndex){
|
||||||
|
this.firstIndex = index
|
||||||
|
this.secondIndex = subIndex
|
||||||
|
this.thirdIndexs = thirdIndex
|
||||||
|
this.fourthIndexs = fourthIndex
|
||||||
|
this.showMeng = true
|
||||||
|
},
|
||||||
|
handleCancelNotice(){
|
||||||
|
this.showMeng = false
|
||||||
|
this.firstIndex = '-'
|
||||||
|
this.secondIndex = '-'
|
||||||
|
this.thirdIndexs = '-'
|
||||||
|
this.fourthIndexs = '-'
|
||||||
|
},
|
||||||
|
handleAllNotice(){
|
||||||
|
this.showMeng = false
|
||||||
|
this.firstIndex = null
|
||||||
|
this.secondIndex = null
|
||||||
|
this.thirdIndexs = null
|
||||||
|
this.fourthIndexs = null
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
@ -177,15 +302,24 @@ export default {
|
|||||||
.main{
|
.main{
|
||||||
width: 100%;
|
width: 100%;
|
||||||
min-height: 100vh;
|
min-height: 100vh;
|
||||||
|
.meng{
|
||||||
|
width: 100vw;
|
||||||
|
height: 100vh;
|
||||||
|
position: fixed;
|
||||||
|
top: 0;left: 0;
|
||||||
|
z-index: 20;
|
||||||
|
}
|
||||||
.header{
|
.header{
|
||||||
width: 100%;
|
width: 100%;
|
||||||
height: 328rpx;
|
height: 395rpx;
|
||||||
background: linear-gradient(180deg, #D4E5FD 0%, #F5F5F5 100%);
|
background: linear-gradient(180deg, #D4E5FD 0%, #F5F5F5 100%);
|
||||||
.headerTop{
|
.headerTop{
|
||||||
width: 100%;
|
width: 100%;
|
||||||
position: absolute;
|
position: fixed;
|
||||||
display: flex;
|
display: flex;
|
||||||
align-items: center;
|
align-items: flex-end;
|
||||||
|
z-index: 99;
|
||||||
|
background: linear-gradient(180deg, #D4E5FD 0%, #DEE9F9 100%);
|
||||||
.backIcon{
|
.backIcon{
|
||||||
width: 48rpx;
|
width: 48rpx;
|
||||||
height: 48rpx;
|
height: 48rpx;
|
||||||
@ -202,6 +336,43 @@ export default {
|
|||||||
transform: translateX(-50%);
|
transform: translateX(-50%);
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
.detailType{
|
||||||
|
width: 100%;
|
||||||
|
position: absolute;
|
||||||
|
display: flex;
|
||||||
|
align-items: center;
|
||||||
|
justify-content: space-between;
|
||||||
|
box-sizing: border-box;
|
||||||
|
padding: 0 32rpx;
|
||||||
|
.typeText{
|
||||||
|
font-size: 32rpx;
|
||||||
|
font-family: Alimama ShuHeiTi;
|
||||||
|
font-weight: bold;
|
||||||
|
color: #7CADF8;
|
||||||
|
line-height: 68rpx;
|
||||||
|
}
|
||||||
|
.downIcon{
|
||||||
|
width: 12px;
|
||||||
|
height: 12px;
|
||||||
|
margin-left: 8px;
|
||||||
|
}
|
||||||
|
.timeBox{
|
||||||
|
display: flex;
|
||||||
|
align-items: center;
|
||||||
|
.timeText{
|
||||||
|
font-size: 32rpx;
|
||||||
|
font-family: Alimama ShuHeiTi;
|
||||||
|
font-weight: bold;
|
||||||
|
color: #7CADF8;
|
||||||
|
line-height: 68rpx;
|
||||||
|
}
|
||||||
|
.timeIcon{
|
||||||
|
margin-left: 6px;
|
||||||
|
width: 24rpx;
|
||||||
|
height: 24rpx;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
.incomeTab{
|
.incomeTab{
|
||||||
width: 100%;
|
width: 100%;
|
||||||
position: absolute;
|
position: absolute;
|
||||||
@ -258,7 +429,6 @@ export default {
|
|||||||
margin-bottom: 24rpx;
|
margin-bottom: 24rpx;
|
||||||
.itemTop{
|
.itemTop{
|
||||||
width: 100%;
|
width: 100%;
|
||||||
height: 400rpx;
|
|
||||||
box-sizing: border-box;
|
box-sizing: border-box;
|
||||||
padding: 22rpx 24rpx;
|
padding: 22rpx 24rpx;
|
||||||
background: linear-gradient(180deg, #F1F7FF 0%, #FDFEFF 100%);
|
background: linear-gradient(180deg, #F1F7FF 0%, #FDFEFF 100%);
|
||||||
@ -285,164 +455,343 @@ export default {
|
|||||||
background: #fff;
|
background: #fff;
|
||||||
border-radius: 12rpx;
|
border-radius: 12rpx;
|
||||||
box-sizing: border-box;
|
box-sizing: border-box;
|
||||||
padding: 32rpx;
|
padding: 16rpx 32rpx;
|
||||||
margin-top: 22rpx;
|
margin-top: 22rpx;
|
||||||
display: flex;
|
.progressBox{
|
||||||
.leftChar{
|
width: 100%;
|
||||||
width: 224rpx;
|
.progressTop{
|
||||||
height: 100%;
|
width: 100%;
|
||||||
margin-bottom: 8rpx;
|
|
||||||
display: flex;
|
|
||||||
flex-direction: column;
|
|
||||||
align-items: center;
|
|
||||||
justify-content: center;
|
|
||||||
.rateText{
|
|
||||||
font-size: 40rpx;
|
|
||||||
font-family: DINAlternate-Bold, DINAlternate;
|
|
||||||
font-weight: bold;
|
|
||||||
color: #1679FF;
|
|
||||||
line-height: 48rpx;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
.rightDetail{
|
|
||||||
flex: 1;
|
|
||||||
.messageBox{
|
|
||||||
display: flex;
|
display: flex;
|
||||||
|
align-items: center;
|
||||||
justify-content: space-between;
|
justify-content: space-between;
|
||||||
.success{
|
.progressLabel{
|
||||||
display: flex;
|
font-size: 28rpx;
|
||||||
flex-direction: column;
|
font-family: PingFangSC-Regular, PingFang SC;
|
||||||
|
font-weight: 400;
|
||||||
.revenueValue{
|
color: #786B6C;
|
||||||
font-size: 32rpx;
|
line-height: 40rpx;
|
||||||
font-family: DINAlternate-Bold, DINAlternate;
|
|
||||||
font-weight: bold;
|
|
||||||
color: #160002;
|
|
||||||
line-height: 36rpx;
|
|
||||||
}
|
|
||||||
.revenueLabel{
|
|
||||||
font-size: 24rpx;
|
|
||||||
font-family: PingFangSC-Regular, PingFang SC;
|
|
||||||
font-weight: 400;
|
|
||||||
color: #786B6C;
|
|
||||||
line-height: 36rpx;
|
|
||||||
margin-top: 4rpx;
|
|
||||||
.revenueUnit{
|
|
||||||
font-size: 24rpx;
|
|
||||||
font-family: PingFangSC-Regular, PingFang SC;
|
|
||||||
font-weight: 400;
|
|
||||||
color: #A69E9F;
|
|
||||||
line-height: 36rpx;
|
|
||||||
margin-left: 4rpx;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
}
|
}
|
||||||
.rateBox{
|
.progressValue{
|
||||||
display: flex;
|
font-size: 36rpx;
|
||||||
flex-direction: column;
|
font-family: Alimama ShuHeiTi;
|
||||||
.rateValue{
|
font-weight: bold;
|
||||||
font-size: 32rpx;
|
color: #1679FF;
|
||||||
font-family: DINAlternate-Bold, DINAlternate;
|
line-height: 44rpx;
|
||||||
font-weight: bold;
|
}
|
||||||
color: #E83944;
|
}
|
||||||
line-height: 36rpx;
|
.progress{
|
||||||
}
|
margin-top: 8px;
|
||||||
.rateLabel{
|
width: 100%;
|
||||||
font-size: 24rpx;
|
height: 12px;
|
||||||
font-family: PingFangSC-Regular, PingFang SC;
|
border-radius: 6px;
|
||||||
font-weight: 400;
|
background: #E7F1FF;
|
||||||
color: #786B6C;
|
position: relative;
|
||||||
line-height: 36rpx;
|
overflow: hidden;
|
||||||
margin-top: 4rpx;
|
.have{
|
||||||
}
|
position: absolute;
|
||||||
|
top: 0;left: 0;
|
||||||
|
border-radius: 6px;
|
||||||
|
background: #1679FF;
|
||||||
|
height: 100%;
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
}
|
.listBox{
|
||||||
.contentBox{
|
|
||||||
width: 100%;
|
|
||||||
background: #fff;
|
|
||||||
box-sizing: border-box;
|
|
||||||
padding: 0 24rpx;
|
|
||||||
.contentItem{
|
|
||||||
width: 100%;
|
width: 100%;
|
||||||
.topItem{
|
margin-top: 12px;
|
||||||
display: flex;
|
.listBoxItem{
|
||||||
align-items: center;
|
position: relative;
|
||||||
margin-bottom: 24rpx;
|
margin-bottom: 12rpx;
|
||||||
.index{
|
.subItemTop{
|
||||||
display: inline-block;
|
|
||||||
width: 36rpx;
|
|
||||||
height: 32rpx;
|
|
||||||
font-size: 24rpx;
|
|
||||||
font-family: PingFangSC-Regular, PingFang SC;
|
|
||||||
font-weight: 400;
|
|
||||||
color: #FEFFFF;
|
|
||||||
line-height: 32rpx;
|
|
||||||
text-align: center;
|
|
||||||
box-sizing: border-box;
|
|
||||||
padding-right: 4rpx;
|
|
||||||
}
|
|
||||||
.smallItemName{
|
|
||||||
font-size: 28rpx;
|
|
||||||
font-family: PingFangSC-Semibold, PingFang SC;
|
|
||||||
font-weight: 600;
|
|
||||||
color: #160002;
|
|
||||||
line-height: 40rpx;
|
|
||||||
margin-left: 4rpx;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
.bottomItem{
|
|
||||||
width: 100%;
|
|
||||||
display: flex;
|
|
||||||
justify-content: space-between;
|
|
||||||
padding-bottom: 32rpx;
|
|
||||||
border-bottom: 1px solid #F7F4F4;
|
|
||||||
.smallItem{
|
|
||||||
display: flex;
|
display: flex;
|
||||||
flex-direction: column;
|
align-items: center;
|
||||||
.smallItemValue{
|
.index{
|
||||||
margin-bottom: 4rpx;
|
display: inline-block;
|
||||||
font-size: 32rpx;
|
width: 36rpx;
|
||||||
font-family: DINAlternate-Bold, DINAlternate;
|
height: 32rpx;
|
||||||
font-weight: bold;
|
|
||||||
color: #160002;
|
|
||||||
line-height: 36rpx;
|
|
||||||
}
|
|
||||||
.smallItemLabel{
|
|
||||||
font-size: 24rpx;
|
font-size: 24rpx;
|
||||||
font-family: PingFangSC-Regular, PingFang SC;
|
font-family: PingFangSC-Regular, PingFang SC;
|
||||||
font-weight: 400;
|
font-weight: 400;
|
||||||
color: #786B6C;
|
color: #FEFFFF;
|
||||||
line-height: 36rpx;
|
line-height: 32rpx;
|
||||||
.unit{
|
text-align: center;
|
||||||
font-size: 24rpx;
|
box-sizing: border-box;
|
||||||
|
padding-right: 4rpx;
|
||||||
|
}
|
||||||
|
.subItemName{
|
||||||
|
font-size: 28rpx;
|
||||||
|
font-family: PingFangSC-Semibold, PingFang SC;
|
||||||
|
font-weight: 600;
|
||||||
|
color: #160002;
|
||||||
|
line-height: 40rpx;
|
||||||
|
margin-left: 8px;
|
||||||
|
}
|
||||||
|
.notice{
|
||||||
|
margin-left: 8rpx;
|
||||||
|
width: 12px;
|
||||||
|
height: 12px;
|
||||||
|
display: flex;
|
||||||
|
align-items: center;
|
||||||
|
justify-content: center;
|
||||||
|
border: 2px solid #A69E9F;
|
||||||
|
border-radius: 50%;
|
||||||
|
color: #A69E9F;
|
||||||
|
font-size: 12px;
|
||||||
|
font-weight: 500;
|
||||||
|
position: relative;
|
||||||
|
z-index: 21;
|
||||||
|
}
|
||||||
|
.noticeBox{
|
||||||
|
position: absolute;
|
||||||
|
top: 10px;
|
||||||
|
z-index: 99;
|
||||||
|
background: #fff;
|
||||||
|
border-radius: 12rpx;
|
||||||
|
box-sizing: border-box;
|
||||||
|
padding: 12rpx 0;
|
||||||
|
display: block;
|
||||||
|
width: 300px;
|
||||||
|
box-shadow: 0rpx 4rpx 12rpx 0rpx rgba(166, 158, 159, 0.3);
|
||||||
|
.noticeTitle{
|
||||||
|
font-size: 28rpx;
|
||||||
|
font-family: PingFangSC-Semibold, PingFang SC;
|
||||||
|
font-weight: 600;
|
||||||
|
color: #160002;
|
||||||
|
line-height: 40rpx;
|
||||||
|
margin-left: 8px;
|
||||||
|
}
|
||||||
|
.noticeItem{
|
||||||
|
display: inline-block;
|
||||||
|
width: 140px;
|
||||||
|
color: #A69E9F;
|
||||||
|
font-size: 12px;
|
||||||
|
font-weight: 500;
|
||||||
|
box-sizing: border-box;
|
||||||
|
padding-left: 24rpx;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
.subItemBottom{
|
||||||
|
width: 100%;
|
||||||
|
display: flex;
|
||||||
|
justify-content: space-between;
|
||||||
|
align-items: center;
|
||||||
|
.bottomItem{
|
||||||
|
width: 50%;
|
||||||
|
.bottomLabel{
|
||||||
|
font-size: 28rpx;
|
||||||
font-family: PingFangSC-Regular, PingFang SC;
|
font-family: PingFangSC-Regular, PingFang SC;
|
||||||
font-weight: 400;
|
font-weight: 400;
|
||||||
color: #A69E9F;
|
color: #786B6C;
|
||||||
line-height: 36rpx;
|
line-height: 32rpx;
|
||||||
|
}
|
||||||
|
.bottomValue{
|
||||||
|
font-size: 30rpx;
|
||||||
|
font-family: Alimama ShuHeiTi;
|
||||||
|
font-weight: bold;
|
||||||
|
color: #1679FF;
|
||||||
|
line-height: 32rpx;
|
||||||
margin-left: 4rpx;
|
margin-left: 4rpx;
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
.otherItem{
|
.thirdItemBox{
|
||||||
display: flex;
|
width: 100%;
|
||||||
flex-direction: column;
|
box-sizing: border-box;
|
||||||
.otherValue{
|
padding-left: 24rpx;
|
||||||
font-size: 32rpx;
|
.thirdItemTop{
|
||||||
font-family: DINAlternate-Bold, DINAlternate;
|
position: relative;
|
||||||
font-weight: bold;
|
display: flex;
|
||||||
color: #E83944;
|
align-items: center;
|
||||||
line-height: 36rpx;
|
.index{
|
||||||
margin-bottom: 4rpx;
|
display: inline-block;
|
||||||
|
width: 40rpx;
|
||||||
|
height: 40rpx;
|
||||||
|
font-size: 24rpx;
|
||||||
|
line-height: 40rpx;
|
||||||
|
text-align: center;
|
||||||
|
font-family: PingFangSC-Regular, PingFang SC;
|
||||||
|
font-weight: 400;
|
||||||
|
color: #FEFFFF;
|
||||||
|
box-sizing: border-box;
|
||||||
|
background-size: 100% 100%;
|
||||||
|
}
|
||||||
|
.subItemName{
|
||||||
|
font-size: 28rpx;
|
||||||
|
font-family: PingFangSC-Semibold, PingFang SC;
|
||||||
|
font-weight: 600;
|
||||||
|
color: #160002;
|
||||||
|
line-height: 40rpx;
|
||||||
|
margin-left: 8px;
|
||||||
|
}
|
||||||
|
.notice{
|
||||||
|
margin-left: 8rpx;
|
||||||
|
width: 12px;
|
||||||
|
height: 12px;
|
||||||
|
display: flex;
|
||||||
|
align-items: center;
|
||||||
|
justify-content: center;
|
||||||
|
border: 2px solid #A69E9F;
|
||||||
|
border-radius: 50%;
|
||||||
|
color: #A69E9F;
|
||||||
|
font-size: 12px;
|
||||||
|
font-weight: 500;
|
||||||
|
position: relative;
|
||||||
|
z-index: 21;
|
||||||
|
}
|
||||||
|
.noticeBox{
|
||||||
|
position: absolute;
|
||||||
|
top: 10px;
|
||||||
|
z-index: 99;
|
||||||
|
background: #fff;
|
||||||
|
border-radius: 12rpx;
|
||||||
|
box-sizing: border-box;
|
||||||
|
padding: 12rpx 0;
|
||||||
|
display: block;
|
||||||
|
width: 300px;
|
||||||
|
box-shadow: 0rpx 4rpx 12rpx 0rpx rgba(166, 158, 159, 0.3);
|
||||||
|
.noticeTitle{
|
||||||
|
font-size: 28rpx;
|
||||||
|
font-family: PingFangSC-Semibold, PingFang SC;
|
||||||
|
font-weight: 600;
|
||||||
|
color: #160002;
|
||||||
|
line-height: 40rpx;
|
||||||
|
margin-left: 8px;
|
||||||
|
}
|
||||||
|
.noticeItem{
|
||||||
|
display: inline-block;
|
||||||
|
width: 140px;
|
||||||
|
color: #A69E9F;
|
||||||
|
font-size: 12px;
|
||||||
|
font-weight: 500;
|
||||||
|
box-sizing: border-box;
|
||||||
|
padding-left: 24rpx;
|
||||||
|
}
|
||||||
|
}
|
||||||
}
|
}
|
||||||
.otherLabel{
|
.thirdItemBottom{
|
||||||
font-size: 24rpx;
|
width: 100%;
|
||||||
font-family: PingFangSC-Regular, PingFang SC;
|
display: flex;
|
||||||
font-weight: 400;
|
justify-content: space-between;
|
||||||
color: #786B6C;
|
align-items: center;
|
||||||
line-height: 36rpx;
|
.bottomItem{
|
||||||
|
width: 50%;
|
||||||
|
.bottomLabel{
|
||||||
|
font-size: 28rpx;
|
||||||
|
font-family: PingFangSC-Regular, PingFang SC;
|
||||||
|
font-weight: 400;
|
||||||
|
color: #786B6C;
|
||||||
|
line-height: 32rpx;
|
||||||
|
}
|
||||||
|
.bottomValue{
|
||||||
|
font-size: 30rpx;
|
||||||
|
font-family: Alimama ShuHeiTi;
|
||||||
|
font-weight: bold;
|
||||||
|
color: #1679FF;
|
||||||
|
line-height: 32rpx;
|
||||||
|
margin-left: 4rpx;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
.fourthItemBox{
|
||||||
|
width: 100%;
|
||||||
|
box-sizing: border-box;
|
||||||
|
padding-left: 24rpx;
|
||||||
|
.fourthItemTop{
|
||||||
|
position: relative;
|
||||||
|
display: flex;
|
||||||
|
align-items: center;
|
||||||
|
.index{
|
||||||
|
display: inline-block;
|
||||||
|
width: 40rpx;
|
||||||
|
height: 40rpx;
|
||||||
|
font-size: 24rpx;
|
||||||
|
line-height: 40rpx;
|
||||||
|
text-align: center;
|
||||||
|
font-family: PingFangSC-Regular, PingFang SC;
|
||||||
|
font-weight: 400;
|
||||||
|
color: #FEFFFF;
|
||||||
|
box-sizing: border-box;
|
||||||
|
background-size: 100% 100%;
|
||||||
|
}
|
||||||
|
.subItemName{
|
||||||
|
font-size: 28rpx;
|
||||||
|
font-family: PingFangSC-Semibold, PingFang SC;
|
||||||
|
font-weight: 600;
|
||||||
|
color: #160002;
|
||||||
|
line-height: 40rpx;
|
||||||
|
margin-left: 8px;
|
||||||
|
}
|
||||||
|
.notice{
|
||||||
|
margin-left: 8rpx;
|
||||||
|
width: 12px;
|
||||||
|
height: 12px;
|
||||||
|
display: flex;
|
||||||
|
align-items: center;
|
||||||
|
justify-content: center;
|
||||||
|
border: 2px solid #A69E9F;
|
||||||
|
border-radius: 50%;
|
||||||
|
color: #A69E9F;
|
||||||
|
font-size: 12px;
|
||||||
|
font-weight: 500;
|
||||||
|
position: relative;
|
||||||
|
z-index: 21;
|
||||||
|
}
|
||||||
|
.noticeBox{
|
||||||
|
position: absolute;
|
||||||
|
top: 10px;
|
||||||
|
z-index: 99;
|
||||||
|
background: #fff;
|
||||||
|
border-radius: 12rpx;
|
||||||
|
box-sizing: border-box;
|
||||||
|
padding: 12rpx 0;
|
||||||
|
display: block;
|
||||||
|
width: 300px;
|
||||||
|
box-shadow: 0rpx 4rpx 12rpx 0rpx rgba(166, 158, 159, 0.3);
|
||||||
|
.noticeTitle{
|
||||||
|
font-size: 28rpx;
|
||||||
|
font-family: PingFangSC-Semibold, PingFang SC;
|
||||||
|
font-weight: 600;
|
||||||
|
color: #160002;
|
||||||
|
line-height: 40rpx;
|
||||||
|
margin-left: 8px;
|
||||||
|
}
|
||||||
|
.noticeItem{
|
||||||
|
display: inline-block;
|
||||||
|
width: 140px;
|
||||||
|
color: #A69E9F;
|
||||||
|
font-size: 12px;
|
||||||
|
font-weight: 500;
|
||||||
|
box-sizing: border-box;
|
||||||
|
padding-left: 24rpx;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
.fourthItemBottom{
|
||||||
|
width: 100%;
|
||||||
|
display: flex;
|
||||||
|
justify-content: space-between;
|
||||||
|
align-items: center;
|
||||||
|
.bottomItem{
|
||||||
|
width: 50%;
|
||||||
|
.bottomLabel{
|
||||||
|
font-size: 28rpx;
|
||||||
|
font-family: PingFangSC-Regular, PingFang SC;
|
||||||
|
font-weight: 400;
|
||||||
|
color: #786B6C;
|
||||||
|
line-height: 32rpx;
|
||||||
|
}
|
||||||
|
.bottomValue{
|
||||||
|
font-size: 30rpx;
|
||||||
|
font-family: Alimama ShuHeiTi;
|
||||||
|
font-weight: bold;
|
||||||
|
color: #1679FF;
|
||||||
|
line-height: 32rpx;
|
||||||
|
margin-left: 4rpx;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|||||||
@ -19,6 +19,7 @@
|
|||||||
</picker>
|
</picker>
|
||||||
</view>
|
</view>
|
||||||
</view>
|
</view>
|
||||||
|
|
||||||
<view class="incomeTab" :style="{top:(menu.bottom + 60) + 'px'}">
|
<view class="incomeTab" :style="{top:(menu.bottom + 60) + 'px'}">
|
||||||
<view :class="selectTab===item.value?'selectItem incomeItem':'incomeItem'" v-for="(item,index) in pageTab" :key="index"
|
<view :class="selectTab===item.value?'selectItem incomeItem':'incomeItem'" v-for="(item,index) in pageTab" :key="index"
|
||||||
@click="handleChangePageTab(item.value)">{{item.label}}</view>
|
@click="handleChangePageTab(item.value)">{{item.label}}</view>
|
||||||
@ -28,9 +29,32 @@
|
|||||||
<view class="contentDetail">
|
<view class="contentDetail">
|
||||||
<view class="detailItem" v-for="(item,index) in pageList" :key="index">
|
<view class="detailItem" v-for="(item,index) in pageList" :key="index">
|
||||||
<view class="itemTop">
|
<view class="itemTop">
|
||||||
<view class="itemTitle">{{item.itemTitle}}</view>
|
<view class="titleTop">
|
||||||
|
<view class="itemTitle">{{item.itemTitle}}</view>
|
||||||
|
<view class="notice" @click="handleShowNotice(index)">?</view>
|
||||||
|
<view class="noticeBox" v-if="firstIndex===index && item.list[typeValue].length>0" @click="handleCancelNotice">
|
||||||
|
<view v-for="(subItem,subIndex) in item.list[typeValue]" :key="subIndex">
|
||||||
|
<view class="noticeTitle">{{subItem.name}}</view>
|
||||||
|
<view class="noticeItem">
|
||||||
|
<span class="noticeLabel">本月预算:</span>
|
||||||
|
<span class="noticeValue">{{subItem.budgetMonth||'-'}}万元</span>
|
||||||
|
</view>
|
||||||
|
<view class="noticeItem">
|
||||||
|
<span class="noticeLabel">年度预算:</span>
|
||||||
|
<span class="noticeValue">{{subItem.budgetYear||'-'}}万元</span>
|
||||||
|
</view>
|
||||||
|
<view class="noticeItem">
|
||||||
|
<span class="noticeLabel">本月执行:</span>
|
||||||
|
<span class="noticeValue">{{subItem.monthExecute||'-'}}万元</span>
|
||||||
|
</view>
|
||||||
|
<view class="noticeItem">
|
||||||
|
<span class="noticeLabel">累计执行:</span>
|
||||||
|
<span class="noticeValue">{{subItem.accumulateExecute||'-'}}万元</span>
|
||||||
|
</view>
|
||||||
|
</view>
|
||||||
|
</view>
|
||||||
|
</view>
|
||||||
<image class="monthSumBg" src="https://eshangtech.com/ShopICO/ahyd-BID/revenueBox/allInCome.png"/>
|
<image class="monthSumBg" src="https://eshangtech.com/ShopICO/ahyd-BID/revenueBox/allInCome.png"/>
|
||||||
|
|
||||||
<view class="itemBox">
|
<view class="itemBox">
|
||||||
<view class="progressBox">
|
<view class="progressBox">
|
||||||
<view class="progressTop">
|
<view class="progressTop">
|
||||||
@ -58,34 +82,15 @@
|
|||||||
<view class="subItemTop">
|
<view class="subItemTop">
|
||||||
<view class="index" :style="{background:`url(${subIndex===0?'https://eshangtech.com/ShopICO/ahyd-BID/revenueBox/secondBg.svg':subIndex===1?'https://eshangtech.com/ShopICO/ahyd-BID/revenueBox/thirdBg.svg':'https://eshangtech.com/ShopICO/ahyd-BID/revenueBox/otherBg.svg'})`}">{{subIndex + 1}}</view>
|
<view class="index" :style="{background:`url(${subIndex===0?'https://eshangtech.com/ShopICO/ahyd-BID/revenueBox/secondBg.svg':subIndex===1?'https://eshangtech.com/ShopICO/ahyd-BID/revenueBox/thirdBg.svg':'https://eshangtech.com/ShopICO/ahyd-BID/revenueBox/otherBg.svg'})`}">{{subIndex + 1}}</view>
|
||||||
<span class="subItemName">{{subItem.name}}</span>
|
<span class="subItemName">{{subItem.name}}</span>
|
||||||
<view class="notice" @click="handleShowNotice(index,subIndex)">?</view>
|
|
||||||
<view class="noticeBox" v-if="firstIndex===index && secondIndex === subIndex" @click="handleCancelNotice">
|
|
||||||
<view class="noticeItem">
|
|
||||||
<span class="noticeLabel">本月预算:</span>
|
|
||||||
<span class="noticeValue">{{subItem.budgetMonth||'-'}}万元</span>
|
|
||||||
</view>
|
|
||||||
<view class="noticeItem">
|
|
||||||
<span class="noticeLabel">年度预算:</span>
|
|
||||||
<span class="noticeValue">{{subItem.budgetYear||'-'}}万元</span>
|
|
||||||
</view>
|
|
||||||
<view class="noticeItem">
|
|
||||||
<span class="noticeLabel">本月执行:</span>
|
|
||||||
<span class="noticeValue">{{subItem.monthExecute||'-'}}万元</span>
|
|
||||||
</view>
|
|
||||||
<view class="noticeItem">
|
|
||||||
<span class="noticeLabel">累计执行:</span>
|
|
||||||
<span class="noticeValue">{{subItem.accumulateExecute||'-'}}万元</span>
|
|
||||||
</view>
|
|
||||||
</view>
|
|
||||||
</view>
|
</view>
|
||||||
<view class="subItemBottom">
|
<view class="subItemBottom" v-if="subItem.monthRate || subItem.accumulateRate">
|
||||||
<view class="bottomItem">
|
<view class="bottomItem">
|
||||||
<span class="bottomLabel">本月占比:</span>
|
<span v-if="subItem.monthRate" class="bottomLabel">本月占比:</span>
|
||||||
<span class="bottomValue">{{`${subItem.monthRate||'-'}%`}}</span>
|
<span v-if="subItem.monthRate" class="bottomValue">{{`${subItem.monthRate||'-'}%`}}</span>
|
||||||
</view>
|
</view>
|
||||||
<view class="bottomItem" style="text-align: right">
|
<view class="bottomItem" style="text-align: right">
|
||||||
<span class="bottomLabel">累计占比:</span>
|
<span v-if="subItem.accumulateRate" class="bottomLabel">累计占比:</span>
|
||||||
<span class="bottomValue">{{`${subItem.accumulateRate||'-'}%`}}</span>
|
<span v-if="subItem.accumulateRate" class="bottomValue">{{`${subItem.accumulateRate||'-'}%`}}</span>
|
||||||
</view>
|
</view>
|
||||||
</view>
|
</view>
|
||||||
</view>
|
</view>
|
||||||
@ -110,7 +115,7 @@ export default {
|
|||||||
pageTab:[{label:'自营收入',value:1},{label:'其他收入',value:2}],
|
pageTab:[{label:'自营收入',value:1},{label:'其他收入',value:2}],
|
||||||
selectTab: 0,
|
selectTab: 0,
|
||||||
typeList:[{label:'按告警情况排序',value:0},{label:'按累计完成进度占比数排序',value:1},{label:'按本月完成进度占比数排序',value:2}],
|
typeList:[{label:'按告警情况排序',value:0},{label:'按累计完成进度占比数排序',value:1},{label:'按本月完成进度占比数排序',value:2}],
|
||||||
typeValue: 0,
|
typeValue: 2,
|
||||||
pageData: {},// 页面数据
|
pageData: {},// 页面数据
|
||||||
pageList: [],// 页面遍历的数据
|
pageList: [],// 页面遍历的数据
|
||||||
single:'', // 时间选择器选择的时间
|
single:'', // 时间选择器选择的时间
|
||||||
@ -189,22 +194,19 @@ export default {
|
|||||||
console.log('pageList',this.pageList)
|
console.log('pageList',this.pageList)
|
||||||
},
|
},
|
||||||
// 显示提示框
|
// 显示提示框
|
||||||
handleShowNotice(index,subIndex){
|
handleShowNotice(index){
|
||||||
this.firstIndex = index
|
this.firstIndex = index
|
||||||
this.secondIndex = subIndex
|
|
||||||
this.showMeng = true
|
this.showMeng = true
|
||||||
},
|
},
|
||||||
// 取消显示提示框
|
// 取消显示提示框
|
||||||
handleCancelNotice(){
|
handleCancelNotice(){
|
||||||
this.firstIndex = null
|
this.firstIndex = null
|
||||||
this.secondIndex = null
|
|
||||||
this.showMeng = false
|
this.showMeng = false
|
||||||
},
|
},
|
||||||
// 关闭页面最大的蒙层
|
// 关闭页面最大的蒙层
|
||||||
handleAllNotice(){
|
handleAllNotice(){
|
||||||
this.showMeng = false
|
this.showMeng = false
|
||||||
this.firstIndex = null
|
this.firstIndex = null
|
||||||
this.secondIndex = null
|
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
@ -347,12 +349,60 @@ export default {
|
|||||||
background: linear-gradient(180deg, #FEF4E6 0%, #FDFAF4 100%);
|
background: linear-gradient(180deg, #FEF4E6 0%, #FDFAF4 100%);
|
||||||
border-radius: 12rpx 12rpx 0rpx 0rpx;
|
border-radius: 12rpx 12rpx 0rpx 0rpx;
|
||||||
position: relative;
|
position: relative;
|
||||||
.itemTitle{
|
.titleTop{
|
||||||
font-size: 36rpx;
|
display: flex;
|
||||||
font-family: Alimama ShuHeiTi;
|
align-items: center;
|
||||||
font-weight: bold;
|
.notice{
|
||||||
color: #EC6C00;
|
margin-left: 8rpx;
|
||||||
line-height: 44rpx;
|
width: 12px;
|
||||||
|
height: 12px;
|
||||||
|
display: flex;
|
||||||
|
align-items: center;
|
||||||
|
justify-content: center;
|
||||||
|
border: 2px solid #A69E9F;
|
||||||
|
border-radius: 50%;
|
||||||
|
color: #A69E9F;
|
||||||
|
font-size: 12px;
|
||||||
|
font-weight: 500;
|
||||||
|
position: relative;
|
||||||
|
z-index: 9;
|
||||||
|
}
|
||||||
|
.noticeBox{
|
||||||
|
position: absolute;
|
||||||
|
top: 10px;
|
||||||
|
z-index: 9;
|
||||||
|
background: #fff;
|
||||||
|
border-radius: 12rpx;
|
||||||
|
box-sizing: border-box;
|
||||||
|
padding: 12rpx 0;
|
||||||
|
display: block;
|
||||||
|
width: 300px;
|
||||||
|
box-shadow: 0rpx 4rpx 12rpx 0rpx rgba(166, 158, 159, 0.3);
|
||||||
|
.noticeTitle{
|
||||||
|
font-size: 28rpx;
|
||||||
|
font-family: PingFangSC-Semibold, PingFang SC;
|
||||||
|
font-weight: 600;
|
||||||
|
color: #160002;
|
||||||
|
line-height: 40rpx;
|
||||||
|
margin-left: 8px;
|
||||||
|
}
|
||||||
|
.noticeItem{
|
||||||
|
display: inline-block;
|
||||||
|
width: 140px;
|
||||||
|
color: #A69E9F;
|
||||||
|
font-size: 12px;
|
||||||
|
font-weight: 500;
|
||||||
|
box-sizing: border-box;
|
||||||
|
padding-left: 24rpx;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
.itemTitle{
|
||||||
|
font-size: 36rpx;
|
||||||
|
font-family: Alimama ShuHeiTi;
|
||||||
|
font-weight: bold;
|
||||||
|
color: #EC6C00;
|
||||||
|
line-height: 44rpx;
|
||||||
|
}
|
||||||
}
|
}
|
||||||
.monthSumBg{
|
.monthSumBg{
|
||||||
position: absolute;
|
position: absolute;
|
||||||
@ -441,38 +491,6 @@ export default {
|
|||||||
line-height: 40rpx;
|
line-height: 40rpx;
|
||||||
margin-left: 8px;
|
margin-left: 8px;
|
||||||
}
|
}
|
||||||
.notice{
|
|
||||||
margin-left: 8rpx;
|
|
||||||
width: 12px;
|
|
||||||
height: 12px;
|
|
||||||
display: flex;
|
|
||||||
align-items: center;
|
|
||||||
justify-content: center;
|
|
||||||
border: 2px solid #A69E9F;
|
|
||||||
border-radius: 50%;
|
|
||||||
color: #A69E9F;
|
|
||||||
font-size: 12px;
|
|
||||||
font-weight: 500;
|
|
||||||
}
|
|
||||||
.noticeBox{
|
|
||||||
position: absolute;
|
|
||||||
bottom: -10px;
|
|
||||||
z-index: 9;
|
|
||||||
background: #fff;
|
|
||||||
border-radius: 12rpx;
|
|
||||||
box-sizing: border-box;
|
|
||||||
padding: 12rpx;
|
|
||||||
display: block;
|
|
||||||
width: 300px;
|
|
||||||
box-shadow: 0rpx 4rpx 12rpx 0rpx rgba(166, 158, 159, 0.3);
|
|
||||||
.noticeItem{
|
|
||||||
display: inline-block;
|
|
||||||
width: 140px;
|
|
||||||
color: #A69E9F;
|
|
||||||
font-size: 12px;
|
|
||||||
font-weight: 500;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
}
|
}
|
||||||
.subItemBottom{
|
.subItemBottom{
|
||||||
width: 100%;
|
width: 100%;
|
||||||
|
|||||||
@ -332,7 +332,7 @@
|
|||||||
</view>
|
</view>
|
||||||
<view class="itemDetailSubtotal">
|
<view class="itemDetailSubtotal">
|
||||||
<view class="itemSmallBox">
|
<view class="itemSmallBox">
|
||||||
<view class="xian"></view>
|
<!-- <view class="xian"></view>-->
|
||||||
<view class="itemSmallTop">
|
<view class="itemSmallTop">
|
||||||
<view class="leftBox">
|
<view class="leftBox">
|
||||||
<view class="smallIcon">
|
<view class="smallIcon">
|
||||||
@ -371,11 +371,11 @@
|
|||||||
<view class="rightTopItem">
|
<view class="rightTopItem">
|
||||||
<view class="itemDetail">
|
<view class="itemDetail">
|
||||||
<!-- <view class="detailValue" style="font-size: 26rpx">{{$util.fmoney(item.ThisYearTotal/10000,2)}}</view>-->
|
<!-- <view class="detailValue" style="font-size: 26rpx">{{$util.fmoney(item.ThisYearTotal/10000,2)}}</view>-->
|
||||||
<view class="detailValue" style="font-size: 26rpx">{{currentResult.selfThisYear || '-'}}</view>
|
<view class="detailValue" >{{currentResult.selfThisYear || '-'}}</view>
|
||||||
<view class="detailTitle">本年累计<text class="detailTitleUnit">/万元</text></view>
|
<view class="detailTitle">本年累计<text class="detailTitleUnit">/万元</text></view>
|
||||||
</view>
|
</view>
|
||||||
<view class="itemDetail">
|
<view class="itemDetail">
|
||||||
<view class="detailValue" style="font-size: 26rpx;display: flex;align-items: center">
|
<view class="detailValue" style="text-align: right">
|
||||||
<!-- {{$util.fmoney(item.ThisMonthIncome/10000,2)}}-->
|
<!-- {{$util.fmoney(item.ThisMonthIncome/10000,2)}}-->
|
||||||
{{currentResult.selfThisMonth || '-'}}
|
{{currentResult.selfThisMonth || '-'}}
|
||||||
</view>
|
</view>
|
||||||
@ -391,10 +391,10 @@
|
|||||||
<view class="detailValue">{{currentResult.selfThisYearBudget || '-'}}</view>
|
<view class="detailValue">{{currentResult.selfThisYearBudget || '-'}}</view>
|
||||||
<view class="detailTitle">年度预算<text class="detailTitleUnit">/万元</text></view>
|
<view class="detailTitle">年度预算<text class="detailTitleUnit">/万元</text></view>
|
||||||
</view>
|
</view>
|
||||||
<view class="itemRight">
|
<view class="itemRight" style="text-align: right">
|
||||||
<!-- <view class="rightValue">{{ `${item.ThisMonthIncomeRate||''}%` }}</view>-->
|
<!-- <view class="rightValue">{{ `${item.ThisMonthIncomeRate||''}%` }}</view>-->
|
||||||
<view class="rightValue">{{ `${currentResult.selfThisMonthRate || '-'}%` }}</view>
|
<view class="rightValue">{{ `${currentResult.selfThisMonthRate || '-'}%` }}</view>
|
||||||
<view class="rightLabel" style="display: flex;align-items: center">本月占比</view>
|
<view class="rightLabel">本月占比</view>
|
||||||
</view>
|
</view>
|
||||||
</view>
|
</view>
|
||||||
</view>
|
</view>
|
||||||
@ -430,7 +430,7 @@
|
|||||||
</view>
|
</view>
|
||||||
|
|
||||||
<view class="itemSmallBox">
|
<view class="itemSmallBox">
|
||||||
<view class="xian"></view>
|
<!-- <view class="xian"></view>-->
|
||||||
<view class="itemSmallTop">
|
<view class="itemSmallTop">
|
||||||
<view class="leftBox">
|
<view class="leftBox">
|
||||||
<view class="smallIcon">
|
<view class="smallIcon">
|
||||||
@ -470,15 +470,15 @@
|
|||||||
<view class="rightTopItem">
|
<view class="rightTopItem">
|
||||||
<view class="itemDetail">
|
<view class="itemDetail">
|
||||||
<!-- <view class="detailValue" style="font-size: 26rpx">{{$util.fmoney(item.ThisYearTotal/10000,2)}}</view>-->
|
<!-- <view class="detailValue" style="font-size: 26rpx">{{$util.fmoney(item.ThisYearTotal/10000,2)}}</view>-->
|
||||||
<view class="detailValue" style="font-size: 26rpx">{{currentResult.otherThisYear || '-'}}</view>
|
<view class="detailValue" >{{currentResult.otherThisYear || '-'}}</view>
|
||||||
<view class="detailTitle">本年累计<text class="detailTitleUnit">/万元</text></view>
|
<view class="detailTitle">本年累计<text class="detailTitleUnit">/万元</text></view>
|
||||||
</view>
|
</view>
|
||||||
<view class="itemDetail">
|
<view class="itemDetail" >
|
||||||
<view class="detailValue" style="font-size: 26rpx;display: flex;align-items: center">
|
<view class="detailValue" style="text-align: right">
|
||||||
<!-- {{$util.fmoney(item.ThisMonthIncome/10000,2)}}-->
|
<!-- {{$util.fmoney(item.ThisMonthIncome/10000,2)}}-->
|
||||||
{{currentResult.otherThisMonth || '-'}}
|
{{currentResult.otherThisMonth || '-'}}
|
||||||
</view>
|
</view>
|
||||||
<view class="detailTitle">
|
<view class="detailTitle" style="text-align: right">
|
||||||
{{ `${thisMonth}月累计` }}
|
{{ `${thisMonth}月累计` }}
|
||||||
<text class="detailTitleUnit">/万元</text>
|
<text class="detailTitleUnit">/万元</text>
|
||||||
</view>
|
</view>
|
||||||
@ -490,10 +490,10 @@
|
|||||||
<view class="detailValue">{{currentResult.otherThisYearBudget || '-'}}</view>
|
<view class="detailValue">{{currentResult.otherThisYearBudget || '-'}}</view>
|
||||||
<view class="detailTitle">年度预算<text class="detailTitleUnit">/万元</text></view>
|
<view class="detailTitle">年度预算<text class="detailTitleUnit">/万元</text></view>
|
||||||
</view>
|
</view>
|
||||||
<view class="itemRight">
|
<view class="itemRight" style="text-align: right">
|
||||||
<!-- <view class="rightValue">{{ `${item.ThisMonthIncomeRate||''}%` }}</view>-->
|
<!-- <view class="rightValue">{{ `${item.ThisMonthIncomeRate||''}%` }}</view>-->
|
||||||
<view class="rightValue">{{ `${currentResult.otherThisMonthRate||'-'}%` }}</view>
|
<view class="rightValue" >{{ `${currentResult.otherThisMonthRate||'-'}%` }}</view>
|
||||||
<view class="rightLabel" style="display: flex;align-items: center">本月占比</view>
|
<view class="rightLabel" >本月占比</view>
|
||||||
</view>
|
</view>
|
||||||
</view>
|
</view>
|
||||||
</view>
|
</view>
|
||||||
@ -556,7 +556,7 @@
|
|||||||
<view class="rateText">支出比</view>
|
<view class="rateText">支出比</view>
|
||||||
</view>
|
</view>
|
||||||
</view>
|
</view>
|
||||||
<view class="rightBoxTop">
|
<view class="rightBoxTop" style="margin-top: 16px">
|
||||||
<view class="itemTop">
|
<view class="itemTop">
|
||||||
<!-- <text class="itemTopValue">{{$util.fmoney(pageDetail.Cost.ThisYearBudget/10000,2) }}</text>-->
|
<!-- <text class="itemTopValue">{{$util.fmoney(pageDetail.Cost.ThisYearBudget/10000,2) }}</text>-->
|
||||||
<text class="itemTopValue">{{currentResult.expenditureThisYearBudget}}</text>
|
<text class="itemTopValue">{{currentResult.expenditureThisYearBudget}}</text>
|
||||||
@ -580,7 +580,7 @@
|
|||||||
</view>
|
</view>
|
||||||
<view class="smallTitle">{{ item.name }}</view>
|
<view class="smallTitle">{{ item.name }}</view>
|
||||||
</view>
|
</view>
|
||||||
<view class="leftRight" @click="handleGoExpenditure">
|
<view class="leftRight" @click="handleGoExpenditure(index+1)">
|
||||||
<text class="more">查看更多</text>
|
<text class="more">查看更多</text>
|
||||||
<image class="moreIcon" src="https://eshangtech.com/ShopICO/ahyd-BID/revenueBox/moreIcon.svg" />
|
<image class="moreIcon" src="https://eshangtech.com/ShopICO/ahyd-BID/revenueBox/moreIcon.svg" />
|
||||||
</view>
|
</view>
|
||||||
@ -982,7 +982,7 @@ export default {
|
|||||||
expenditureCostThisRate:'10.44%',// 营业成本小计本月占比
|
expenditureCostThisRate:'10.44%',// 营业成本小计本月占比
|
||||||
},
|
},
|
||||||
{
|
{
|
||||||
name:'其他费用小计',// 名称
|
name:'财务费用小计',// 名称
|
||||||
expenditureCostRate:59.46,// 营业成本小计完成率
|
expenditureCostRate:59.46,// 营业成本小计完成率
|
||||||
expenditureCostThisYear:'437.00',// 营业成本小计本年累计
|
expenditureCostThisYear:'437.00',// 营业成本小计本年累计
|
||||||
expenditureCostThisMonth:'-36.00',// 营业成本小计本月累计
|
expenditureCostThisMonth:'-36.00',// 营业成本小计本月累计
|
||||||
@ -1069,7 +1069,7 @@ export default {
|
|||||||
expenditureCostThisRate:'9.91%',// 营业成本小计本月占比
|
expenditureCostThisRate:'9.91%',// 营业成本小计本月占比
|
||||||
},
|
},
|
||||||
{
|
{
|
||||||
name:'其他费用小计',// 名称
|
name:'财务费用小计',// 名称
|
||||||
expenditureCostRate:60.40,// 营业成本小计完成率
|
expenditureCostRate:60.40,// 营业成本小计完成率
|
||||||
expenditureCostThisYear:'456.00',// 营业成本小计本年累计
|
expenditureCostThisYear:'456.00',// 营业成本小计本年累计
|
||||||
expenditureCostThisMonth:'18.00',// 营业成本小计本月累计
|
expenditureCostThisMonth:'18.00',// 营业成本小计本月累计
|
||||||
@ -1264,9 +1264,9 @@ export default {
|
|||||||
});
|
});
|
||||||
},
|
},
|
||||||
// 进入支出详情
|
// 进入支出详情
|
||||||
handleGoExpenditure(){
|
handleGoExpenditure(type){
|
||||||
uni.navigateTo({
|
uni.navigateTo({
|
||||||
url: '/pages/revenue/expenditureDetail'
|
url: `/pages/revenue/expenditureDetail?month=${this.thisMonth}&type=${type}`
|
||||||
});
|
});
|
||||||
},
|
},
|
||||||
// 请求数据的方法
|
// 请求数据的方法
|
||||||
@ -2278,20 +2278,20 @@ export default {
|
|||||||
}
|
}
|
||||||
|
|
||||||
.itemSmallDetail{
|
.itemSmallDetail{
|
||||||
width: calc(100% - 116rpx - 28rpx);
|
width: calc(100% - 48rpx);
|
||||||
height: 248rpx;
|
height: 248rpx;
|
||||||
margin-top: 30rpx;
|
margin-top: 30rpx;
|
||||||
background: #F9F5F1;
|
background: #F9F5F1;
|
||||||
border-radius: 8rpx;
|
border-radius: 8rpx;
|
||||||
margin-left: 116rpx;
|
margin-left: 24rpx;
|
||||||
box-sizing: border-box;
|
box-sizing: border-box;
|
||||||
padding: 32rpx 16rpx 32rpx 30rpx;
|
|
||||||
display: flex;
|
display: flex;
|
||||||
justify-content: space-between;
|
justify-content: space-between;
|
||||||
.itemSmallLeftBox{
|
.itemSmallLeftBox{
|
||||||
width: 128rpx;
|
width: 224rpx;
|
||||||
height: 100%;
|
height: 100%;
|
||||||
border-radius: 8rpx;
|
box-sizing: border-box;
|
||||||
|
padding: 32rpx 48rpx 0;
|
||||||
.leftValue{
|
.leftValue{
|
||||||
display: inline-block;
|
display: inline-block;
|
||||||
margin-top: 8rpx;
|
margin-top: 8rpx;
|
||||||
@ -2324,7 +2324,9 @@ export default {
|
|||||||
}
|
}
|
||||||
}
|
}
|
||||||
.itemSmallRightBox{
|
.itemSmallRightBox{
|
||||||
width: calc(100% - 168rpx);
|
width: calc(100% - 224rpx);
|
||||||
|
box-sizing: border-box;
|
||||||
|
padding: 32rpx;
|
||||||
.rightTopItem{
|
.rightTopItem{
|
||||||
width: 100%;
|
width: 100%;
|
||||||
display: flex;
|
display: flex;
|
||||||
@ -2333,7 +2335,7 @@ export default {
|
|||||||
display: inline-block;
|
display: inline-block;
|
||||||
width: 50%;
|
width: 50%;
|
||||||
.detailValue{
|
.detailValue{
|
||||||
font-size: 26rpx;
|
font-size: 32rpx;
|
||||||
font-family: DINAlternate-Bold, DINAlternate;
|
font-family: DINAlternate-Bold, DINAlternate;
|
||||||
font-weight: bold;
|
font-weight: bold;
|
||||||
color: #160002;
|
color: #160002;
|
||||||
@ -2364,7 +2366,7 @@ export default {
|
|||||||
}
|
}
|
||||||
}
|
}
|
||||||
.detailTitle{
|
.detailTitle{
|
||||||
font-size: 22rpx;
|
font-size: 24rpx;
|
||||||
font-family: PingFangSC-Regular, PingFang SC;
|
font-family: PingFangSC-Regular, PingFang SC;
|
||||||
font-weight: 400;
|
font-weight: 400;
|
||||||
color: #786B6C;
|
color: #786B6C;
|
||||||
@ -2404,14 +2406,14 @@ export default {
|
|||||||
display: inline-block;
|
display: inline-block;
|
||||||
width: 50%;
|
width: 50%;
|
||||||
.rightValue{
|
.rightValue{
|
||||||
font-size: 26rpx;
|
font-size: 32rpx;
|
||||||
font-family: DINAlternate-Bold, DINAlternate;
|
font-family: DINAlternate-Bold, DINAlternate;
|
||||||
font-weight: bold;
|
font-weight: bold;
|
||||||
color: #E83944;
|
color: #E83944;
|
||||||
line-height: 36rpx;
|
line-height: 36rpx;
|
||||||
}
|
}
|
||||||
.rightLabel{
|
.rightLabel{
|
||||||
font-size: 22rpx;
|
font-size: 24rpx;
|
||||||
font-family: PingFangSC-Regular, PingFang SC;
|
font-family: PingFangSC-Regular, PingFang SC;
|
||||||
font-weight: 400;
|
font-weight: 400;
|
||||||
color: #786B6C;
|
color: #786B6C;
|
||||||
@ -2448,8 +2450,8 @@ export default {
|
|||||||
}
|
}
|
||||||
|
|
||||||
.smallSum{
|
.smallSum{
|
||||||
width: calc(100% - 116rpx - 28rpx);
|
width: calc(100% - 48rpx);
|
||||||
margin-left: 116rpx;
|
margin-left: 24rpx;
|
||||||
.smallSumItem{
|
.smallSumItem{
|
||||||
margin-top: 24rpx;
|
margin-top: 24rpx;
|
||||||
width: 100%;
|
width: 100%;
|
||||||
@ -2601,10 +2603,11 @@ export default {
|
|||||||
}
|
}
|
||||||
.rightBox{
|
.rightBox{
|
||||||
width: calc(100% - 224rpx);
|
width: calc(100% - 224rpx);
|
||||||
|
box-sizing: border-box;
|
||||||
|
padding: 32rpx;
|
||||||
.rightBoxTop{
|
.rightBoxTop{
|
||||||
width: 100%;
|
width: 100%;
|
||||||
box-sizing: border-box;
|
box-sizing: border-box;
|
||||||
padding: 32rpx;
|
|
||||||
display: flex;
|
display: flex;
|
||||||
justify-content: space-between;
|
justify-content: space-between;
|
||||||
align-items: center;
|
align-items: center;
|
||||||
@ -2710,20 +2713,20 @@ export default {
|
|||||||
}
|
}
|
||||||
|
|
||||||
.itemSmallDetail{
|
.itemSmallDetail{
|
||||||
width: calc(100% - 100rpx - 28rpx);
|
width: calc(100% - 48rpx);
|
||||||
height: 248rpx;
|
height: 248rpx;
|
||||||
margin-top: 30rpx;
|
margin-top: 30rpx;
|
||||||
background: #F8FAFD;
|
background: #F8FAFD;
|
||||||
border-radius: 8rpx;
|
border-radius: 8rpx;
|
||||||
margin-left: 100rpx;
|
margin-left: 24rpx;
|
||||||
box-sizing: border-box;
|
box-sizing: border-box;
|
||||||
padding: 32rpx 30rpx;
|
|
||||||
display: flex;
|
display: flex;
|
||||||
justify-content: space-between;
|
justify-content: space-between;
|
||||||
.itemSmallLeftBox{
|
.itemSmallLeftBox{
|
||||||
width: 128rpx;
|
width: 224rpx;
|
||||||
height: 100%;
|
height: 100%;
|
||||||
border-radius: 8rpx;
|
box-sizing: border-box;
|
||||||
|
padding: 32rpx 48rpx 0;
|
||||||
.leftValue{
|
.leftValue{
|
||||||
margin-top: 4rpx;
|
margin-top: 4rpx;
|
||||||
font-size: 40rpx;
|
font-size: 40rpx;
|
||||||
@ -2734,9 +2737,9 @@ export default {
|
|||||||
}
|
}
|
||||||
}
|
}
|
||||||
.itemSmallRightBox{
|
.itemSmallRightBox{
|
||||||
width: calc(100% - 148rpx);
|
width: calc(100% - 224rpx);
|
||||||
padding-left: 12rpx;
|
|
||||||
box-sizing: border-box;
|
box-sizing: border-box;
|
||||||
|
padding: 32rpx;
|
||||||
.rightTopItem{
|
.rightTopItem{
|
||||||
width: 100%;
|
width: 100%;
|
||||||
display: flex;
|
display: flex;
|
||||||
@ -2750,7 +2753,7 @@ export default {
|
|||||||
line-height: 36rpx;
|
line-height: 36rpx;
|
||||||
}
|
}
|
||||||
.detailTitle{
|
.detailTitle{
|
||||||
font-size: 22rpx;
|
font-size: 24rpx;
|
||||||
font-family: PingFangSC-Regular, PingFang SC;
|
font-family: PingFangSC-Regular, PingFang SC;
|
||||||
font-weight: 400;
|
font-weight: 400;
|
||||||
color: #786B6C;
|
color: #786B6C;
|
||||||
@ -2768,7 +2771,7 @@ export default {
|
|||||||
text-align: right;
|
text-align: right;
|
||||||
}
|
}
|
||||||
.rightLabel{
|
.rightLabel{
|
||||||
font-size: 22rpx;
|
font-size: 24rpx;
|
||||||
font-family: PingFangSC-Regular, PingFang SC;
|
font-family: PingFangSC-Regular, PingFang SC;
|
||||||
font-weight: 400;
|
font-weight: 400;
|
||||||
color: #786B6C;
|
color: #786B6C;
|
||||||
|
|||||||
1
static/images/revenueBox/fourthFirst.svg
Normal file
1
static/images/revenueBox/fourthFirst.svg
Normal file
@ -0,0 +1 @@
|
|||||||
|
<?xml version="1.0" standalone="no"?><!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN" "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd"><svg t="1700641776701" class="icon" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg" p-id="6212" xmlns:xlink="http://www.w3.org/1999/xlink" width="200" height="200"><path d="M781.186088 616.031873q17.338645 80.573705 30.59761 145.848606 6.119522 27.537849 11.219124 55.075697t9.689243 49.976096 7.649402 38.247012 4.079681 19.888446q3.059761 20.398406-9.179283 27.027888t-27.537849 6.629482q-5.099602 0-14.788845-3.569721t-14.788845-5.609562l-266.199203-155.027888q-72.414343 42.836653-131.569721 76.494024-25.498008 14.278884-50.486056 28.557769t-45.386454 26.517928-35.187251 20.398406-19.888446 10.199203q-10.199203 5.099602-20.908367 3.569721t-19.378486-7.649402-12.749004-14.788845-2.039841-17.848606q1.01992-4.079681 5.099602-19.888446t9.179283-37.737052 11.729084-48.446215 13.768924-54.055777q15.298805-63.23506 34.677291-142.788845-60.175299-52.015936-108.111554-92.812749-20.398406-17.338645-40.286853-34.167331t-35.697211-30.59761-26.007968-22.438247-11.219124-9.689243q-12.239044-11.219124-20.908367-24.988048t-6.629482-28.047809 11.219124-22.438247 20.398406-10.199203l315.155378-28.557769 117.290837-273.338645q6.119522-16.318725 17.338645-28.047809t30.59761-11.729084q10.199203 0 17.848606 4.589641t12.749004 10.709163 8.669323 12.239044 5.609562 10.199203l114.231076 273.338645 315.155378 29.577689q20.398406 5.099602 28.557769 12.239044t8.159363 22.438247q0 14.278884-8.669323 24.988048t-21.928287 26.007968z" p-id="6213" fill="#FF7831"></path></svg>
|
||||||
|
After Width: | Height: | Size: 1.6 KiB |
1
static/images/revenueBox/fourthSecond.svg
Normal file
1
static/images/revenueBox/fourthSecond.svg
Normal file
@ -0,0 +1 @@
|
|||||||
|
<?xml version="1.0" standalone="no"?><!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN" "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd"><svg t="1700641776701" class="icon" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg" p-id="6212" xmlns:xlink="http://www.w3.org/1999/xlink" width="200" height="200"><path d="M781.186088 616.031873q17.338645 80.573705 30.59761 145.848606 6.119522 27.537849 11.219124 55.075697t9.689243 49.976096 7.649402 38.247012 4.079681 19.888446q3.059761 20.398406-9.179283 27.027888t-27.537849 6.629482q-5.099602 0-14.788845-3.569721t-14.788845-5.609562l-266.199203-155.027888q-72.414343 42.836653-131.569721 76.494024-25.498008 14.278884-50.486056 28.557769t-45.386454 26.517928-35.187251 20.398406-19.888446 10.199203q-10.199203 5.099602-20.908367 3.569721t-19.378486-7.649402-12.749004-14.788845-2.039841-17.848606q1.01992-4.079681 5.099602-19.888446t9.179283-37.737052 11.729084-48.446215 13.768924-54.055777q15.298805-63.23506 34.677291-142.788845-60.175299-52.015936-108.111554-92.812749-20.398406-17.338645-40.286853-34.167331t-35.697211-30.59761-26.007968-22.438247-11.219124-9.689243q-12.239044-11.219124-20.908367-24.988048t-6.629482-28.047809 11.219124-22.438247 20.398406-10.199203l315.155378-28.557769 117.290837-273.338645q6.119522-16.318725 17.338645-28.047809t30.59761-11.729084q10.199203 0 17.848606 4.589641t12.749004 10.709163 8.669323 12.239044 5.609562 10.199203l114.231076 273.338645 315.155378 29.577689q20.398406 5.099602 28.557769 12.239044t8.159363 22.438247q0 14.278884-8.669323 24.988048t-21.928287 26.007968z" p-id="6213" fill="#FE9F17"></path></svg>
|
||||||
|
After Width: | Height: | Size: 1.6 KiB |
1
static/images/revenueBox/fourthther.svg
Normal file
1
static/images/revenueBox/fourthther.svg
Normal file
@ -0,0 +1 @@
|
|||||||
|
<?xml version="1.0" standalone="no"?><!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN" "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd"><svg t="1700641776701" class="icon" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg" p-id="6212" xmlns:xlink="http://www.w3.org/1999/xlink" width="200" height="200"><path d="M781.186088 616.031873q17.338645 80.573705 30.59761 145.848606 6.119522 27.537849 11.219124 55.075697t9.689243 49.976096 7.649402 38.247012 4.079681 19.888446q3.059761 20.398406-9.179283 27.027888t-27.537849 6.629482q-5.099602 0-14.788845-3.569721t-14.788845-5.609562l-266.199203-155.027888q-72.414343 42.836653-131.569721 76.494024-25.498008 14.278884-50.486056 28.557769t-45.386454 26.517928-35.187251 20.398406-19.888446 10.199203q-10.199203 5.099602-20.908367 3.569721t-19.378486-7.649402-12.749004-14.788845-2.039841-17.848606q1.01992-4.079681 5.099602-19.888446t9.179283-37.737052 11.729084-48.446215 13.768924-54.055777q15.298805-63.23506 34.677291-142.788845-60.175299-52.015936-108.111554-92.812749-20.398406-17.338645-40.286853-34.167331t-35.697211-30.59761-26.007968-22.438247-11.219124-9.689243q-12.239044-11.219124-20.908367-24.988048t-6.629482-28.047809 11.219124-22.438247 20.398406-10.199203l315.155378-28.557769 117.290837-273.338645q6.119522-16.318725 17.338645-28.047809t30.59761-11.729084q10.199203 0 17.848606 4.589641t12.749004 10.709163 8.669323 12.239044 5.609562 10.199203l114.231076 273.338645 315.155378 29.577689q20.398406 5.099602 28.557769 12.239044t8.159363 22.438247q0 14.278884-8.669323 24.988048t-21.928287 26.007968z" p-id="6213" fill="#BCC2C9"></path></svg>
|
||||||
|
After Width: | Height: | Size: 1.6 KiB |
1
static/images/revenueBox/thirdFirst.svg
Normal file
1
static/images/revenueBox/thirdFirst.svg
Normal file
@ -0,0 +1 @@
|
|||||||
|
<?xml version="1.0" standalone="no"?><!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN" "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd"><svg t="1700641887469" class="icon" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg" p-id="7424" xmlns:xlink="http://www.w3.org/1999/xlink" width="200" height="200"><path d="M514.048 128q79.872 0 149.504 30.208t121.856 82.432 82.432 122.368 30.208 150.016q0 78.848-30.208 148.48t-82.432 121.856-121.856 82.432-149.504 30.208-149.504-30.208-121.856-82.432-82.432-121.856-30.208-148.48q0-79.872 30.208-150.016t82.432-122.368 121.856-82.432 149.504-30.208z" p-id="7425" fill="#FF7831"></path></svg>
|
||||||
|
After Width: | Height: | Size: 654 B |
1
static/images/revenueBox/thirdOther.svg
Normal file
1
static/images/revenueBox/thirdOther.svg
Normal file
@ -0,0 +1 @@
|
|||||||
|
<?xml version="1.0" standalone="no"?><!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN" "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd"><svg t="1700641887469" class="icon" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg" p-id="7424" xmlns:xlink="http://www.w3.org/1999/xlink" width="200" height="200"><path d="M514.048 128q79.872 0 149.504 30.208t121.856 82.432 82.432 122.368 30.208 150.016q0 78.848-30.208 148.48t-82.432 121.856-121.856 82.432-149.504 30.208-149.504-30.208-121.856-82.432-82.432-121.856-30.208-148.48q0-79.872 30.208-150.016t82.432-122.368 121.856-82.432 149.504-30.208z" p-id="7425" fill="#BCC2C9"></path></svg>
|
||||||
|
After Width: | Height: | Size: 654 B |
1
static/images/revenueBox/thirdSecond.svg
Normal file
1
static/images/revenueBox/thirdSecond.svg
Normal file
@ -0,0 +1 @@
|
|||||||
|
<?xml version="1.0" standalone="no"?><!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN" "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd"><svg t="1700641887469" class="icon" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg" p-id="7424" xmlns:xlink="http://www.w3.org/1999/xlink" width="200" height="200"><path d="M514.048 128q79.872 0 149.504 30.208t121.856 82.432 82.432 122.368 30.208 150.016q0 78.848-30.208 148.48t-82.432 121.856-121.856 82.432-149.504 30.208-149.504-30.208-121.856-82.432-82.432-121.856-30.208-148.48q0-79.872 30.208-150.016t82.432-122.368 121.856-82.432 149.504-30.208z" p-id="7425" fill="#FEAC37"></path></svg>
|
||||||
|
After Width: | Height: | Size: 654 B |
Loading…
x
Reference in New Issue
Block a user