You can not select more than 25 topics
Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
314 lines
10 KiB
314 lines
10 KiB
<template> |
|
<view class="enterpriseDetails_body"> |
|
<view class="header_car"> |
|
<view class="flex jb ac"> |
|
<view> |
|
<view class="flex "> |
|
<uni-icons v-if="routerIndex" color="#2866ff" custom-prefix="iconfont" type="iconjiayou" size="20"></uni-icons> |
|
<image v-if="!routerIndex" style="width: 60rpx; height: 60rpx;" src="../../../static/selegs.png"></image> |
|
<view class="header_text_left"> |
|
<view class="text_ov">{{routerIndex?dedata.siteName:dedata.companyName}}</view> |
|
<view class="small_text text_ov ">{{dedata.id}}</view> |
|
</view> |
|
<view v-if="!routerIndex" :style="{background:dedata.parentMark=='0'?'':'#BC853B'}" class="list_item_tip"> |
|
{{dedata.parentMark=='0'?'总公司':'子公司'}} |
|
</view> |
|
</view> |
|
<view class="flex header_text_top "> |
|
<uni-icons color="#2866ff" custom-prefix="iconfont" type="iconfengniao_shoujihao" size="20"> |
|
</uni-icons> |
|
<view class="header_text_left"> |
|
<view class="text_ov">{{dedata.siteContacts||'暂无'}} {{dedata.siteContactPhone||'暂无'}}</view> |
|
<view class="small_text text_ov">{{dedata.customerId||'暂无'}}</view> |
|
</view> |
|
</view> |
|
</view> |
|
<view v-if="routerIndex" class="t-icon"> |
|
<image style="width: 100%;height: 100%;" :src="dedata.siteImages?dedata.siteImages: '../../../static/selegs.png' " mode=""></image> |
|
</view> |
|
</view> |
|
<view @click="jump(2)" class="account"> |
|
<view class="yuan"></view> |
|
<view> |
|
<view style="text-align: center;">账户余额</view> |
|
<view style="text-align: center;">{{detailsData.gasStationBalance|price}}</view> |
|
</view> |
|
<view v-if="!routerIndex"> |
|
<view style="text-align: center;">企业余额</view> |
|
<view style="text-align: center;">{{detailsData.totalBalance|price}}</view> |
|
</view> |
|
<view> |
|
<uni-icons color="#FFFFFF" type="right" size="30"></uni-icons> |
|
</view> |
|
</view> |
|
</view> |
|
<view class="chart"> |
|
<view class="chartSeleBar"> |
|
<view v-for="(item,index) in chartSeleBarData" @click="chartSeleBarFn(item,index)" |
|
:class=" chartSeleIndex==index?'selechartSeleBar_item':'chartSeleBar_item' ">{{item.lable}}</view> |
|
</view> |
|
<view class="chart_scoll"> |
|
<swiper @change="swiperChange" :current='chartSeleIndex' class="swiper" :interval="1000" |
|
:duration="1000"> |
|
<swiper-item @tap.stop=''> |
|
<view class="swiper-item"> |
|
<view style="height:75%;"> |
|
<qiunDataCharts :canvas2d='true' canvasId='canvasIdw' inScrollView="true" type="area" |
|
:opts="{extra:{area:{type:'curve',addLine:true,gradient:true}}}" |
|
:chartData="Line" /> |
|
</view> |
|
<view |
|
style="height: 25%; display: flex; justify-content: space-around; align-items: center;"> |
|
<view class="swiper-item_table">今日</view> |
|
<view> <text class="numberoli">{{detailsData.todaySalesRose.toFixed(2)}}</text> L</view> |
|
<view> <text class="numberoli">{{detailsData.siteDayBalance|price}}</text> ￥</view> |
|
</view> |
|
</view> |
|
</swiper-item> |
|
<swiper-item> |
|
<view class="swiper-item"> |
|
<view style="height:75%;"> |
|
<qiunDataCharts :canvas2d='true' canvasId='canvasIdt' inScrollView="true" type="area" |
|
:opts="{extra:{area:{type:'curve',addLine:true,gradient:true}}}" |
|
:chartData="LineTwo" /> |
|
</view> |
|
<view |
|
style="height: 25%; display: flex; justify-content: space-around; align-items: center;"> |
|
<view class="swiper-item_table">今日</view> |
|
<!-- <view> <text class="numberoli">2987.5</text> L</view> --> |
|
<view> <text class="numberoli">{{chartsData.rechargeAmountOnTheDay|price}}</text> ￥</view> |
|
</view> |
|
</view> |
|
</swiper-item> |
|
</swiper> |
|
<!-- <view style="height: 70%;width: 100%; padding: 20rpx 0;"> |
|
<qiun-data-charts type="area" :opts="{extra:{area:{type:'curve',addLine:true,gradient:true}}}" :chartData="Line" /> |
|
</view> --> |
|
</view> |
|
<view class="footer"> |
|
<view @click="ishowFn()" class="footer_title">{{dedata.startTime|timeProcessing}} - |
|
{{dedata.endTime|timeProcessing}} |
|
</view> |
|
<view @click="jump(1)" class="footer_item"> |
|
<view |
|
style=" margin-top: 60rpx; margin-bottom:32rpx; display: flex;flex-direction: column;justify-content: center;align-items: center;"> |
|
<view class="iicombody"> |
|
<uni-icons custom-prefix="iconfont" type="iconwangdian1" size="30"></uni-icons> |
|
</view> |
|
<view>{{routerIndex?'企业':'油站'}}消费支出</view> |
|
</view> |
|
<view style="text-align: center;"> |
|
<text>{{income|price}}</text>￥ |
|
</view> |
|
</view> |
|
<view @click="jump(3)" class="footer_item"> |
|
<view |
|
style=" margin-top: 60rpx; margin-bottom:32rpx; display: flex;flex-direction: column;justify-content: center;align-items: center;"> |
|
<view class="iicombody"> |
|
<uni-icons custom-prefix="iconfont" type="iconwangdian1" size="30"></uni-icons> |
|
</view> |
|
<view>消费订单数量</view> |
|
</view> |
|
<view style="text-align: center;"> |
|
{{quantity}} |
|
</view> |
|
</view> |
|
</view> |
|
</view> |
|
<datePopup style="z-index: 9999999999999;" @datePopupChange='datePopupChange' v-model="isShow.date"></datePopup> |
|
</view> |
|
</template> |
|
|
|
<script> |
|
import sy from '@/api/sy' |
|
import datePopup from '../../components/datePopup.vue' |
|
import convertW from '../../components/convertW.js' |
|
import qiunDataCharts from '../../components/qiun-data-charts/components/qiun-data-charts/qiun-data-charts.vue' |
|
export default { |
|
components: { |
|
datePopup, |
|
qiunDataCharts |
|
}, |
|
data() { |
|
return { |
|
routerIndex:true, |
|
enterpriseData: null, |
|
isShow: { |
|
date: false |
|
}, |
|
dedata: null, |
|
chartsData: null, |
|
income: 0, |
|
quantity: 0, |
|
detailsData: null, |
|
chartSeleBarData: [{ |
|
lable: '近五日动销', |
|
value: 0 |
|
}, { |
|
lable: '近五次充值', |
|
value: 1 |
|
}], |
|
chartSeleIndex: 0, |
|
Line: {}, |
|
LineTwo: {} |
|
} |
|
}, |
|
onLoad(e) { |
|
console.log(e) |
|
|
|
let routes = getCurrentPages(); |
|
let routerIndex = routes[(routes.length - 2)].$page.fullPath.indexOf('?') != -1 ? |
|
routes[(routes.length - 2)].$page.fullPath.split('?')[0].split('/')[routes[(routes.length - 2)] |
|
.$page.fullPath.split('?')[0].split('/').length - 1] : |
|
routes[(routes.length - 2)].$page.fullPath.split('/')[routes[(routes.length - 2)].$page |
|
.fullPath.split('/').length - 1]; |
|
this.routerIndex= routerIndex =='enterpriseIndex'?false:true; |
|
console.log(routerIndex) |
|
console.log(this.routerIndex) |
|
if (e.jsData) { |
|
this.dedata = JSON.parse(e.jsData); |
|
this.getdata(JSON.parse(e.jsData)); |
|
} |
|
}, |
|
filters:{ |
|
timeProcessing(e){ |
|
return e?e.split(' ')[0]:e |
|
}, |
|
price(e=0.00){ |
|
// if(!e) e=0.00; |
|
return convertW.convertW(e) |
|
}, |
|
distinguish(e){ |
|
return this.routerIndex ?e.siteName:e.companyName |
|
} |
|
}, |
|
methods: { |
|
datePopupChange(e) { |
|
sy[(this.routerIndex ? 'queryBusinessIncome':'queryEnterpriseIncome')]({ |
|
[((this.routerIndex ? 'siteId':'companyId'))]: this.dedata.id, |
|
endTime: e[1], |
|
startTime: e[0] |
|
}).then(res => { |
|
this.enterpriseData = res.data |
|
this.income = res.data.enterpriseContributionAmount |
|
this.quantity = res.data.orderNumber |
|
this.dedata.startTime = e[0] |
|
this.dedata.endTime = e[1] |
|
}) |
|
console.log(e) |
|
}, |
|
ishowFn() { |
|
this.isShow.date = true |
|
}, |
|
chartsDataFn() { |
|
|
|
}, |
|
getdata(e) { |
|
sy[(this.routerIndex ? 'findSiteMovingPinVo':'findEnterpriSemovingPinVo')]({ |
|
[((this.routerIndex ? 'siteId':'companyId'))]:e.id |
|
}).then(res => { |
|
if (res.code !== 20000) return |
|
this.detailsData = res.data |
|
let arr = [] |
|
this.detailsData.createTime.forEach((item,index) => { |
|
arr.push(`${item.split('-')[1]}/${item.split('-')[2]}`) |
|
this.detailsData.money[index] = this.detailsData.money[index].toFixed(2) |
|
}) |
|
this.Line = { |
|
categories: arr, |
|
series: [{ |
|
name: "金额", |
|
data: this.detailsData.money |
|
}] |
|
} |
|
}) |
|
sy[(this.routerIndex ? 'checkTheFiveDayRechargeAmount':'queryRechargeCompanyFiveDays')]({ |
|
[((this.routerIndex ? 'siteId':'companyId'))]:e.id |
|
}).then(res => { |
|
this.chartsData = res.data |
|
let arrtwo = [] |
|
res.data.createTime.forEach((item,index) => { |
|
arrtwo.push(`${item.split('-')[1]}/${item.split('-')[2]}`) |
|
res.data.money[index] = res.data.money[index].toFixed(2) |
|
}) |
|
this.LineTwo = { |
|
categories: arrtwo, |
|
series: [{ |
|
name: "金额", |
|
data: res.data.money |
|
}] |
|
} |
|
}).catch(e=>{ |
|
console.log(e,'///') |
|
}) |
|
sy[(this.routerIndex ? 'queryBusinessIncome':'queryEnterpriseIncome')]({ |
|
[((this.routerIndex ? 'siteId':'companyId'))]: e.id, |
|
endTime: e.endTime, |
|
startTime: e.startTime |
|
}).then(res => { |
|
this.enterpriseData = res.data |
|
this.income = res.data.enterpriseContributionAmount |
|
this.quantity = res.data.orderNumber |
|
console.log(res, '收入') |
|
}) |
|
}, |
|
jump(e) { |
|
this.dedata.routerIndex=this.routerIndex; |
|
switch (e) { |
|
case 1: |
|
uni.navigateTo({ |
|
url: '../contribution/contribution?jsData=' + JSON.stringify(Object.assign(this |
|
.dedata, { |
|
liters: this.enterpriseData.liters, |
|
enterpriseContributionAmount: this.enterpriseData.enterpriseContributionAmount, |
|
...this.detailsData |
|
})) |
|
}) |
|
break; |
|
case 2: |
|
console.log(this.dedata,'rechargeRecordrechargeRecordrechargeRecordrechargeRecord') |
|
uni.navigateTo({ |
|
url: '../rechargeRecord/rechargeRecord?jsData=' + JSON.stringify(Object.assign(this |
|
.dedata, { |
|
routerIndex:this.routerIndex, |
|
gasStationBalance: this.detailsData.gasStationBalance, |
|
amountYesterday: this.detailsData.amountYesterday, |
|
...this.detailsData |
|
})) |
|
}) |
|
break; |
|
case 3: |
|
uni.navigateTo({ |
|
url: '../orderQuantity/orderQuantity?jsData=' + JSON.stringify(Object.assign(this |
|
.dedata, this.enterpriseData)) |
|
}) |
|
break; |
|
} |
|
|
|
}, |
|
swiperChange(e) { |
|
this.chartSeleIndex = e.detail.current |
|
}, |
|
chartSeleBarFn(item, index) { |
|
this.chartSeleIndex = index |
|
} |
|
} |
|
} |
|
</script> |
|
|
|
<style scoped> |
|
@import url("./enterpriseDetails.css"); |
|
.list_item_tip{ |
|
padding: 11rpx 14rpx; |
|
background-color:#9F43CC; |
|
color: #FFFFFF; |
|
font-size: 16rpx; |
|
width: fit-content; |
|
margin: 0 auto; |
|
height: fit-content; |
|
} |
|
.t-icon { |
|
width: 95rpx !important; |
|
height: 95rpx !important; |
|
} |
|
</style>
|
|
|