ylj/ahyd_DIB
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

update

Browse Source
This commit is contained in:
cclu 2023-11-21 18:31:56 +08:00
parent bbe78c3b54
commit 4383a48d0b
5 changed files with 2188 additions and 265 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

1
pages/revenue/component/otherCharts.vue
View File

@ -59,7 +59,6 @@ export default {
methods:{
drawCharts(id,data){
if (this.name){
console.log('this.name',this.name)
const ctx = uni.createCanvasContext(id, this);
let _this = this
uChartsInstance[id] = new uCharts({

1
pages/revenue/component/yearCharts.vue
View File

@ -111,7 +111,6 @@ export default {
uni.canvasToTempFilePath({
canvasId:id,
complete:(res)=>{
console.log('res',res)
if (res.tempFilePath){
uni.getFileSystemManager().readFile({
filePath: res.tempFilePath,

1881
pages/revenue/data.js Normal file
View File

File diff suppressed because it is too large Load Diff

553
pages/revenue/incomeDetail.vue
View File

@ -1,140 +1,104 @@
<template>
<view class="main">
<view class="meng" v-if="showMeng" @click="handleAllNotice"></view>
<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>
<text class="pageTitle">收入详情</text>
</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/4stDownArrow.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/4stDownArrow.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"
@click="handleChangePageTab(item.value)">{{item.label}}</view>
</view>
</view>
<view class="contentDetail">
<view class="detailItem">
<view class="detailItem" v-for="(item,index) in pageList" :key="index">
<view class="itemTop">
<view class="itemTitle">服务区自营小计</view>
<view class="itemTitle">{{item.itemTitle}}</view>
<image class="monthSumBg" src="https://eshangtech.com/ShopICO/ahyd-BID/revenueBox/allInCome.png"/>
<view class="itemBox">
<view class="leftChar">
<OtherCharts :success="number" :colorList="['#FC7909', '#FEE4CE']"/>
<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 class="progressBox">
<view class="progressTop">
<span class="progressLabel">本月占比:</span>
<span class="progressValue">{{`${item.monthRate||'-'}%`}}</span>
</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 class="progress">
<view class="have" :style="{width:item.monthRate>100?'100%':`${item.monthRate}%`}"></view>
</view>
</view>
<view class="progressBox" style="margin-top: 12px">
<view class="progressTop">
<span class="progressLabel">累计完成进度占比:</span>
<span class="progressValue">{{`${item.accumulateRate||'-'}%`}}</span>
</view>
<view class="progress">
<view class="have" :style="{width:item.accumulateRate>100?'100%':`${item.accumulateRate}%`}"></view>
</view>
</view>
</view>
</view>
<view class="contentBox">
<view class="contentItem" v-for="(item,index) in 10" :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 class="listBox">
<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)">?</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 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 class="subItemBottom">
<view class="bottomItem">
<span class="bottomLabel">本月占比:</span>
<span class="bottomValue">{{`${subItem.monthRate||'-'}%`}}</span>
</view>
<view class="bottomItem" style="text-align: right">
<span class="bottomLabel">累计占比:</span>
<span class="bottomValue">{{`${subItem.accumulateRate||'-'}%`}}</span>
</view>
</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/allInCome.png"/>
<view class="itemBox">
<view class="leftChar">
<OtherCharts :success="number" :colorList="['#FC7909', '#FEE4CE']"/>
<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>
</template>
<script>
import OtherCharts from './component/otherCharts.vue'
import inComeData from './data'
export default {
components:{OtherCharts},
data(){
@ -144,10 +108,42 @@ export default {
menu:{},
number:0,
pageTab:[{label:'自营收入',value:1},{label:'其他收入',value:2}],
selectTab:1
selectTab: 0,
typeList:[{label:'按告警情况排序',value:0},{label:'按累计完成进度占比数排序',value:1},{label:'按本月完成进度占比数排序',value:2}],
typeValue: 0,
pageData: {},// 页面数据
pageList: [],// 页面遍历的数据
single:'', // 时间选择器选择的时间
month:'',// 当前月份
startDate:'',// 开始时间
endData:'', // 结束时间
firstIndex: null,// 第一层索引
secondIndex: null,// 第二层索引
showMeng: false,// 页面最大的蒙层
// selectType:0,// 1是自营 2是其他
}
},
onLoad(){
onLoad(query){
console.log('query',query)
console.log('inComeData',inComeData)
this.selectTab = Number(query.type)
if (query.month){
this.month = Number(query.month)
inComeData.forEach(item=>{
if (item.month === Number(query.month)){
this.pageData = item
this.pageList = this.selectTab===1?item.supportList:item.otherList
}
})
}
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()
this.windowHeight = systemInfo.windowHeight
@ -160,14 +156,55 @@ export default {
},100)
},
methods:{
// 返回按钮的方法
// 返回按钮的方法
handleBack(){
uni.navigateBack({
delta: 1
});
},
handleChangePageTab(value){
console.log('value',value)
this.selectTab = value
this.pageList = this.selectTab===1?this.pageData.supportList:this.pageData.otherList
},
// 改变类型的方法
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
inComeData.forEach(item=>{
if (item.month === y){
this.pageData = item
this.pageList = this.selectTab===1?item.supportList:item.otherList
}
})
console.log('pageData',this.pageData)
console.log('pageList',this.pageList)
},
// 显示提示框
handleShowNotice(index,subIndex){
this.firstIndex = index
this.secondIndex = subIndex
this.showMeng = true
},
// 取消显示提示框
handleCancelNotice(){
this.firstIndex = null
this.secondIndex = null
this.showMeng = false
},
// 关闭页面最大的蒙层
handleAllNotice(){
this.showMeng = false
this.firstIndex = null
this.secondIndex = null
}
}
}
@ -178,15 +215,24 @@ export default {
.main{
width: 100%;
min-height: 100vh;
.meng{
width: 100vw;
height: 100vh;
position: fixed;
top: 0;left: 0;
z-index: 20;
}
.header{
width: 100%;
height: 328rpx;
height: 420rpx;
background: linear-gradient(180deg, #FFE6C2 0%, rgba(255,230,194,0) 100%);
.headerTop{
width: 100%;
position: absolute;
position: fixed;
display: flex;
align-items: center;
align-items: flex-end;
z-index: 99;
background: linear-gradient(180deg, #FFE6C2 0%, #FAECD9 100%);
.backIcon{
width: 48rpx;
height: 48rpx;
@ -203,6 +249,43 @@ export default {
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: #783F0F;
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: #783F0F;
line-height: 68rpx;
}
.timeIcon{
margin-left: 6px;
width: 24rpx;
height: 24rpx;
}
}
}
.incomeTab{
width: 100%;
position: absolute;
@ -259,7 +342,6 @@ export default {
margin-bottom: 24rpx;
.itemTop{
width: 100%;
height: 400rpx;
box-sizing: border-box;
padding: 22rpx 24rpx;
background: linear-gradient(180deg, #FEF4E6 0%, #FDFAF4 100%);
@ -286,163 +368,134 @@ export default {
background: #fff;
border-radius: 12rpx;
box-sizing: border-box;
padding: 32rpx;
padding: 16rpx 32rpx;
margin-top: 22rpx;
display: flex;
.leftChar{
width: 224rpx;
height: 100%;
margin-bottom: 8rpx;
display: flex;
flex-direction: column;
.rateText{
font-size: 40rpx;
font-family: DINAlternate-Bold, DINAlternate;
font-weight: bold;
color: #FE7500;
line-height: 48rpx;
}
}
.rightDetail{
flex: 1;
.messageBox{
.progressBox{
width: 100%;
.progressTop{
width: 100%;
display: flex;
align-items: center;
justify-content: space-between;
.success{
display: flex;
flex-direction: column;
.revenueValue{
font-size: 32rpx;
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;
}
}
.progressLabel{
font-size: 28rpx;
font-family: PingFangSC-Regular, PingFang SC;
font-weight: 400;
color: #786B6C;
line-height: 40rpx;
}
.rateBox{
display: flex;
flex-direction: column;
.rateValue{
font-size: 32rpx;
font-family: DINAlternate-Bold, DINAlternate;
font-weight: bold;
color: #E83944;
line-height: 36rpx;
}
.rateLabel{
font-size: 24rpx;
font-family: PingFangSC-Regular, PingFang SC;
font-weight: 400;
color: #786B6C;
line-height: 36rpx;
margin-top: 4rpx;
}
.progressValue{
font-size: 36rpx;
font-family: Alimama ShuHeiTi;
font-weight: bold;
color: #EC6C00;
line-height: 44rpx;
}
}
.progress{
margin-top: 8px;
width: 100%;
height: 12px;
border-radius: 6px;
background: #FEE4CE;
position: relative;
overflow: hidden;
.have{
position: absolute;
top: 0;left: 0;
border-radius: 6px;
background: #FC7909;
height: 100%;
}
}
}
}
}
.contentBox{
width: 100%;
background: #fff;
box-sizing: border-box;
padding: 0 24rpx;
.contentItem{
.listBox{
width: 100%;
.topItem{
width: 100%;
display: flex;
align-items: center;
margin-bottom: 24rpx;
.index{
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{
margin-top: 12px;
.listBoxItem{
position: relative;
margin-bottom: 12rpx;
.subItemTop{
display: flex;
flex-direction: column;
.smallItemValue{
margin-bottom: 4rpx;
font-size: 32rpx;
font-family: DINAlternate-Bold, DINAlternate;
font-weight: bold;
color: #160002;
line-height: 36rpx;
}
.smallItemLabel{
align-items: center;
.index{
display: inline-block;
width: 36rpx;
height: 32rpx;
font-size: 24rpx;
font-family: PingFangSC-Regular, PingFang SC;
font-weight: 400;
color: #786B6C;
line-height: 36rpx;
.unit{
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;
}
.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;
}
.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;
line-height: 36rpx;
margin-left: 4rpx;
font-size: 12px;
font-weight: 500;
}
}
}
.otherItem{
.subItemBottom{
width: 100%;
display: flex;
flex-direction: column;
.otherValue{
font-size: 32rpx;
font-family: DINAlternate-Bold, DINAlternate;
font-weight: bold;
color: #E83944;
line-height: 36rpx;
margin-bottom: 4rpx;
}
.otherLabel{
font-size: 24rpx;
font-family: PingFangSC-Regular, PingFang SC;
font-weight: 400;
color: #786B6C;
line-height: 36rpx;
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: #EC6C00;
line-height: 32rpx;
margin-left: 4rpx;
}
}
}
}

17
pages/revenue/index.vue
View File

@ -356,7 +356,7 @@
</view>
</view>
</view>
<view class="leftRight" @click="handleGoInComeDetail">
<view class="leftRight" @click="handleGoInComeDetail(1)">
<text class="more">查看更多</text>
<image class="moreIcon" src="https://eshangtech.com/ShopICO/ahyd-BID/revenueBox/moreIcon.svg" />
</view>
@ -454,7 +454,7 @@
</view>
</view>
</view>
<view class="leftRight" @click="handleGoInComeDetail">
<view class="leftRight" @click="handleGoInComeDetail(2)">
<text class="more">查看更多</text>
<image class="moreIcon" src="https://eshangtech.com/ShopICO/ahyd-BID/revenueBox/moreIcon.svg" />
</view>
@ -1118,7 +1118,6 @@ export default {
methods:{
// 点击出现备注
handleShowNotice(type){
console.log('type',type)
switch (type){
case 'showCost':
this.showCost = !this.showCost
@ -1259,9 +1258,9 @@ export default {
})
},
// 进入收入详情
handleGoInComeDetail(){
handleGoInComeDetail(type){
uni.navigateTo({
url: '/pages/revenue/incomeDetail'
url: `/pages/revenue/incomeDetail?month=${this.thisMonth}&type=${type}`
});
},
// 进入支出详情
@ -1281,17 +1280,14 @@ export default {
month:this.thisMonth
}
const data = await request.$webGet('/CommercialApi/Budget/GetBudgetMainShow',req)
console.log('data',data)
this.pageDetail = data.Result_Data
uni.hideLoading()
},
// 修改时间的事件
bindDateChange(e){
console.log('e',e)
this.single = e.detail.value
this.thisYear = e.detail.value.split('-')[0]
this.thisMonth = e.detail.value.split('-')[1]
console.log('this.thisMonth',this.thisMonth)
if (this.thisMonth.indexOf('7')!==-1){
this.selectMonth = 0
}else if(this.thisMonth.indexOf('8')!==-1){
@ -1299,25 +1295,20 @@ export default {
}else if(this.thisMonth.indexOf('9')!==-1){
this.selectMonth = 2
}
console.log('selectMonth',this.selectMonth)
this.currentResult = this.monthResult[this.selectMonth]
this.handleGetData()
},
// 收入合计点击子项出现的悬浮框
incomeChildrenShow(item){
console.log('item',item)
this.childrenShow = true
if (item==='自营收入小计'){
this.handleShowNotice('userRevenueSmallSum')
}else{
this.handleShowNotice('otherSmallSum')
}
console.log('userRevenueSmallSum',this.userRevenueSmallSum)
console.log('otherSmallSum',this.otherSmallSum)
},
// 滑动swiper的方法
handleChangeSwiper(e){
console.log('e',e)
this.selectMonth = e.target.current
this.thisMonth = this.monthList[this.selectMonth]
this.single = `${this.thisYear}-${this.thisMonth<10?'0'+this.thisMonth:this.thisMonth}`