Merge remote-tracking branch 'origin/tx'
This commit is contained in:
commit
fb38a6dfa5
|
|
@ -38,7 +38,14 @@ export function getArealist() {
|
||||||
|
|
||||||
})
|
})
|
||||||
}
|
}
|
||||||
|
// 获取首页统计
|
||||||
|
export function getAdminStatistics() {
|
||||||
|
return request({
|
||||||
|
url: '/index/admim/statistics',
|
||||||
|
method: 'get',
|
||||||
|
|
||||||
|
})
|
||||||
|
}
|
||||||
// 修改运营区
|
// 修改运营区
|
||||||
export function updateArea(data) {
|
export function updateArea(data) {
|
||||||
return request({
|
return request({
|
||||||
|
|
|
||||||
|
|
@ -1,99 +1,621 @@
|
||||||
<template>
|
<template>
|
||||||
<div class="app-container home">
|
<div class="page">
|
||||||
<div v-if="userName != 'admin' " >
|
<div class="info_li">
|
||||||
<span>可用余额: </span><span style="color: red;font-weight: 700">{{balance}}</span> 元
|
<div class="card1">
|
||||||
|
<div class="txt">运营商数</div>
|
||||||
|
<div class="num">{{StatisticsInfo.operatorCount }}</div>
|
||||||
|
<div class="txt1">独立小程序：{{StatisticsInfo.appCount }}</div>
|
||||||
|
<img src="https://lxnapi.ccttiot.com/bike/img/static/uZdZtiQN8BGMcSEamOmj" alt="">
|
||||||
|
</div>
|
||||||
|
<div class="card1" style="background: linear-gradient( 270deg, #A6A6E7 0%, rgba(166,166,231,0.44) 100%);">
|
||||||
|
<div class="txt">商户总余额</div>
|
||||||
|
<div class="num">{{StatisticsInfo.totalBalance }}</div>
|
||||||
|
<div class="txt1">已提现金额：{{ StatisticsInfo.withdrawn }}</div>
|
||||||
|
<img src="https://lxnapi.ccttiot.com/bike/img/static/uy7fzOouY8czRqSuh76D" alt=""
|
||||||
|
style="width: 6.42rem;height: 7rem;">
|
||||||
|
</div>
|
||||||
|
<div class="card1" style="background: linear-gradient( 270deg, #64B6A7 0%, rgba(100,182,167,0.44) 100%);">
|
||||||
|
<div class="txt">运营区数</div>
|
||||||
|
<div class="num">{{StatisticsInfo.areaCount }}</div>
|
||||||
|
<div class="txt1">已提现金额：{{StatisticsInfo.otalOrderCount }}</div>
|
||||||
|
<img src="https://lxnapi.ccttiot.com/bike/img/static/uErTaNSlejRXjjzHAdym" alt="">
|
||||||
|
</div>
|
||||||
|
<div class="card1" style="background: linear-gradient( 270deg, #60ADFD 0%, rgba(148,198,250,0.5) 100%), #FFFFFF;">
|
||||||
|
<div class="txt">车辆总数</div>
|
||||||
|
<div class="num">{{StatisticsInfo.vehicleVo.allNum }}</div>
|
||||||
|
<div class="txt1">车辆型号：{{StatisticsInfo.modelCount }}</div>
|
||||||
|
<img src="https://lxnapi.ccttiot.com/bike/img/static/uTBhrhUajBERKs81lJSe" alt=""
|
||||||
|
style="width: 7.33rem;height: 6.08rem;">
|
||||||
|
</div>
|
||||||
|
<div class="card1"
|
||||||
|
style="background: linear-gradient( 270deg, #FFB2B2 0%, rgba(255,178,178,0.36) 100%), #FFFFFF;">
|
||||||
|
<div class="txt">用户总数</div>
|
||||||
|
<div class="num">{{StatisticsInfo.userCount }}</div>
|
||||||
|
<div class="txt1">今日新增：{{StatisticsInfo.todayUserCount }}</div>
|
||||||
|
<img src="https://lxnapi.ccttiot.com/bike/img/static/uyqanVA0Qi2ZWg0cNmwg" alt=""
|
||||||
|
style="width: 7.33rem;height: 7.42rem;">
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div class="info_li" style="margin-top: 1.25rem;">
|
||||||
|
<div class="card2">
|
||||||
|
<div class="txt">今日订单数</div>
|
||||||
|
<div class="num">{{StatisticsInfo.todayOrderCount }}</div>
|
||||||
|
<div class="txt1">总订单数：{{StatisticsInfo.totalOrderCount }}</div>
|
||||||
|
<img src="https://lxnapi.ccttiot.com/bike/img/static/uNs2VyDSLLmF11ydeaFN" alt="">
|
||||||
|
</div>
|
||||||
|
<div class="card2">
|
||||||
|
<div class="txt">今日订单金额</div>
|
||||||
|
<div class="num">{{StatisticsInfo.todayOrderFee }}</div>
|
||||||
|
<div class="txt1">订单总金额：{{StatisticsInfo.totalOrderFee }}</div>
|
||||||
|
<img src="https://lxnapi.ccttiot.com/bike/img/static/uxbM4kTP9Jdzi4suo83W" alt="">
|
||||||
|
</div>
|
||||||
|
<div class="card2">
|
||||||
|
<div class="txt">今日退款金额</div>
|
||||||
|
<div class="num">{{StatisticsInfo.todayRefundFee }}</div>
|
||||||
|
<div class="txt1">总退款金额：{{StatisticsInfo.totalRefundFee }}</div>
|
||||||
|
<img src="https://lxnapi.ccttiot.com/bike/img/static/uwJ6enKaUs6qMMXC7xEt" alt="">
|
||||||
|
</div>
|
||||||
|
<div class="card2">
|
||||||
|
<div class="txt">待付款订单金额</div>
|
||||||
|
<div class="num">{{StatisticsInfo.unpaidOrderFee }}</div>
|
||||||
|
<div class="txt1">待付款订单数：{{StatisticsInfo.unpaidOrderCount }}</div>
|
||||||
|
<img src="https://lxnapi.ccttiot.com/bike/img/static/un9hBy1mNXjAsRnrSt14" alt="">
|
||||||
|
</div>
|
||||||
|
<div class="card2">
|
||||||
|
<div class="txt">待审核还车押金扣款</div>
|
||||||
|
<div class="num">{{StatisticsInfo.returnOrderDeductFee }}</div>
|
||||||
|
<div class="txt1">还车待审核订单数:{{StatisticsInfo.returnOrderCount }}</div>
|
||||||
|
<img src="https://lxnapi.ccttiot.com/bike/img/static/uBV6yOFFWUvTValGnmfw" alt="">
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div class="cont_box">
|
||||||
|
<div class="echart_box">
|
||||||
|
<div class="tit"> 营收统计</div>
|
||||||
|
<div class="echarts_cont">
|
||||||
|
<div id="myChart" style="width: 100%;height: 100%;"></div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div class="right_box">
|
||||||
|
<div class="right_box_top">
|
||||||
|
<div class="info_li">
|
||||||
|
<div class="card2">
|
||||||
|
<div class="txt">今日支付手续费</div>
|
||||||
|
<div class="num">{{StatisticsInfo.todayHandlingFee }}</div>
|
||||||
|
<div class="txt1">总支付手续费：{{StatisticsInfo.totalHandlingFee }}</div>
|
||||||
|
<img src="https://lxnapi.ccttiot.com/bike/img/static/uNs2VyDSLLmF11ydeaFN" alt="">
|
||||||
|
</div>
|
||||||
|
<div class="card2">
|
||||||
|
<div class="txt">今日服务费</div>
|
||||||
|
<div class="num">{{StatisticsInfo.todayServiceFee }}</div>
|
||||||
|
<div class="txt1">总服务费：{{StatisticsInfo.totalServiceFee }}</div>
|
||||||
|
<img src="https://lxnapi.ccttiot.com/bike/img/static/uxbM4kTP9Jdzi4suo83W" alt="">
|
||||||
|
</div>
|
||||||
|
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div class="car_info_box">
|
||||||
|
<div class="tit">车辆统计</div>
|
||||||
|
|
||||||
|
<div class="info_li">
|
||||||
|
<div class="info_cont">
|
||||||
|
<div class="info_cont_top">
|
||||||
|
<img src="https://lxnapi.ccttiot.com/bike/img/static/uUSztvtXXdRtxHzQVWgH" alt="">投放中（辆）
|
||||||
|
</div>
|
||||||
|
<div class="info_cont_txt">
|
||||||
|
{{ StatisticsInfo.vehicleVo.inOperation }}
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div class="info_cont">
|
||||||
|
<div class="info_cont_top">
|
||||||
|
<img src="https://lxnapi.ccttiot.com/bike/img/static/uUAe2gRT4blxwsIKs0id" alt="">骑行中（辆）
|
||||||
|
</div>
|
||||||
|
<div class="info_cont_txt">
|
||||||
|
{{ StatisticsInfo.vehicleVo.ridingNum }}
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div class="info_cont">
|
||||||
|
<div class="info_cont_top">
|
||||||
|
<img src="https://lxnapi.ccttiot.com/bike/img/static/uAoVo6LxxZ4PthTHZtiH" alt="">仓库中（辆）
|
||||||
|
</div>
|
||||||
|
<div class="info_cont_txt">
|
||||||
|
{{ StatisticsInfo.vehicleVo.inStashNum }}
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div class="info_li">
|
||||||
|
<div class="info_cont">
|
||||||
|
<div class="info_cont_top">
|
||||||
|
<img src="https://lxnapi.ccttiot.com/bike/img/static/uxx6Ajx0ne7Ho6LH8Bfg" alt="">禁用中（辆）
|
||||||
|
</div>
|
||||||
|
<div class="info_cont_txt">
|
||||||
|
{{ StatisticsInfo.vehicleVo.disabledNum }}
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div class="info_cont">
|
||||||
|
<div class="info_cont_top">
|
||||||
|
<img src="https://lxnapi.ccttiot.com/bike/img/static/uUgJO8VOMNI48H7ab5yU" alt="">调度中（辆）
|
||||||
|
</div>
|
||||||
|
<div class="info_cont_txt">
|
||||||
|
{{ StatisticsInfo.vehicleVo.dispatchNum }}
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div class="info_cont">
|
||||||
|
<div class="info_cont_top">
|
||||||
|
<img src="https://lxnapi.ccttiot.com/bike/img/static/uAKVUuosyqvFJx5Ynjbp" alt="">离线（辆）
|
||||||
|
</div>
|
||||||
|
<div class="info_cont_txt">
|
||||||
|
{{ StatisticsInfo.vehicleVo.offlineNum }}
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
|
||||||
|
</div>
|
||||||
|
<div class="bot_box">
|
||||||
|
<div class="tit">运维状态</div>
|
||||||
|
<div class="cont_box">
|
||||||
|
|
||||||
|
<div class="cont_li">
|
||||||
|
<div class="cont_li_top">
|
||||||
|
<img src="https://lxnapi.ccttiot.com/bike/img/static/uDOL2U9faZ5ku81NTPnU" alt="">4g解锁失败
|
||||||
|
</div>
|
||||||
|
<div class="cont_li_bot">
|
||||||
|
{{ StatisticsInfo.operationVo.failedUnlockCount }}
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div class="cont_li">
|
||||||
|
<div class="cont_li_top">
|
||||||
|
<img src="https://lxnapi.ccttiot.com/bike/img/static/uuCZPQA3uCAJsAqca8Bv" alt="">蓝牙解锁数
|
||||||
|
</div>
|
||||||
|
<div class="cont_li_bot">
|
||||||
|
{{ StatisticsInfo.operationVo.bluetoothUnlockCount}}
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div class="cont_li">
|
||||||
|
<div class="cont_li_top">
|
||||||
|
<img src="https://lxnapi.ccttiot.com/bike/img/static/uwGblBABW5uKSVzW4FjE" alt="">设备离线率
|
||||||
|
</div>
|
||||||
|
<div class="cont_li_bot">
|
||||||
|
{{ StatisticsInfo.operationVo.deviceOfflineRate }}%
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div class="cont_li">
|
||||||
|
<div class="cont_li_top">
|
||||||
|
<img src="https://lxnapi.ccttiot.com/bike/img/static/uDOL2U9faZ5ku81NTPnU" alt="">异常排查车辆
|
||||||
|
</div>
|
||||||
|
<div class="cont_li_bot">
|
||||||
|
{{ StatisticsInfo.operationVo.faultOrderCount }}
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div class="cont_li">
|
||||||
|
<div class="cont_li_top">
|
||||||
|
<img src="https://lxnapi.ccttiot.com/bike/img/static/uuCZPQA3uCAJsAqca8Bv" alt="">待换电
|
||||||
|
</div>
|
||||||
|
<div class="cont_li_bot">
|
||||||
|
{{ StatisticsInfo.operationVo.replacementOrderCount }}
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div class="cont_li">
|
||||||
|
<div class="cont_li_top">
|
||||||
|
<img src="https://lxnapi.ccttiot.com/bike/img/static/uwGblBABW5uKSVzW4FjE" alt="">待维修
|
||||||
|
</div>
|
||||||
|
<div class="cont_li_bot">
|
||||||
|
{{ StatisticsInfo.operationVo.repairCount }}
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
</template>
|
</template>
|
||||||
|
|
||||||
<script>
|
<script>
|
||||||
import { getBalance } from '@/api/system/dept'
|
|
||||||
|
|
||||||
|
import { getAdminStatistics } from '@/api/system/area'
|
||||||
|
import * as echarts from 'echarts';
|
||||||
export default {
|
export default {
|
||||||
name: "Index",
|
name: "Index",
|
||||||
data() {
|
data() {
|
||||||
return {
|
return {
|
||||||
// 版本号
|
StatisticsInfo: {},
|
||||||
version: "3.8.7",
|
chartInstance:null
|
||||||
balance: null,
|
|
||||||
userName: null
|
|
||||||
};
|
};
|
||||||
},
|
},
|
||||||
created() {
|
created() {
|
||||||
this.userName = this.$store.state.user.name;
|
|
||||||
getBalance().then(response => {
|
},
|
||||||
this.balance = response.data;
|
mounted() {
|
||||||
});
|
this.AdminStatistics();
|
||||||
|
window.addEventListener('resize', this.handleResize);
|
||||||
|
},
|
||||||
|
beforeDestroy() {
|
||||||
|
window.removeEventListener('resize', this.handleResize);
|
||||||
|
if (this.chartInstance) {
|
||||||
|
this.chartInstance.dispose();
|
||||||
|
}
|
||||||
},
|
},
|
||||||
methods: {
|
methods: {
|
||||||
goTarget(href) {
|
AdminStatistics() {
|
||||||
window.open(href, "_blank");
|
getAdminStatistics().then(response => {
|
||||||
|
this.StatisticsInfo = response.data;
|
||||||
|
this.StatisticsInfo.incomeVoList.reverse();
|
||||||
|
setTimeout(() => {
|
||||||
|
this.drawLine()
|
||||||
|
}, 1000);
|
||||||
|
|
||||||
|
console.log("areaOptions", this.areaOptions);
|
||||||
|
});
|
||||||
|
},
|
||||||
|
drawLine() {
|
||||||
|
this.chartInstance = echarts.init(document.getElementById("myChart"));
|
||||||
|
// 设置图表的配置项和数据
|
||||||
|
this.chartInstance.setOption({
|
||||||
|
grid: {
|
||||||
|
left: 60,
|
||||||
|
right: 50,
|
||||||
|
top: 10,
|
||||||
|
bottom: 20,
|
||||||
|
},
|
||||||
|
tooltip: {
|
||||||
|
trigger: 'axis'
|
||||||
|
},
|
||||||
|
legend: {
|
||||||
|
data: ['订单金额', '订单']
|
||||||
|
},
|
||||||
|
xAxis: {
|
||||||
|
type: 'category',
|
||||||
|
boundaryGap: false,
|
||||||
|
data: this.StatisticsInfo.incomeVoList.map(item => item.day)
|
||||||
|
},
|
||||||
|
yAxis: [
|
||||||
|
{
|
||||||
|
type: 'value',
|
||||||
|
name: '订单金额',
|
||||||
|
position: 'left',
|
||||||
|
axisLine: {
|
||||||
|
lineStyle: {
|
||||||
|
color: '#5470C6'
|
||||||
|
}
|
||||||
|
},
|
||||||
|
axisLabel: {
|
||||||
|
formatter: '{value} 元'
|
||||||
|
}
|
||||||
|
},
|
||||||
|
{
|
||||||
|
type: 'value',
|
||||||
|
name: '订单',
|
||||||
|
position: 'right',
|
||||||
|
axisLine: {
|
||||||
|
lineStyle: {
|
||||||
|
color: '#91CC75'
|
||||||
|
}
|
||||||
|
},
|
||||||
|
axisLabel: {
|
||||||
|
formatter: '{value}'
|
||||||
|
}
|
||||||
|
}
|
||||||
|
],
|
||||||
|
series: [
|
||||||
|
{
|
||||||
|
name: '订单金额',
|
||||||
|
type: 'line',
|
||||||
|
data: this.StatisticsInfo.incomeVoList.map(item => item.orderFee),
|
||||||
|
yAxisIndex: 0,
|
||||||
|
itemStyle: {
|
||||||
|
color: '#5470C6'
|
||||||
|
},
|
||||||
|
smooth: true
|
||||||
|
},
|
||||||
|
{
|
||||||
|
name: '订单',
|
||||||
|
type: 'line',
|
||||||
|
data: this.StatisticsInfo.incomeVoList.map(item => item.orderNum),
|
||||||
|
yAxisIndex: 1,
|
||||||
|
itemStyle: {
|
||||||
|
color: '#91CC75'
|
||||||
|
},
|
||||||
|
smooth: true
|
||||||
|
}
|
||||||
|
]
|
||||||
|
});
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
};
|
};
|
||||||
</script>
|
</script>
|
||||||
|
|
||||||
<style scoped lang="scss">
|
<style scoped lang="scss">
|
||||||
.home {
|
.page {
|
||||||
blockquote {
|
padding: 1.92rem;
|
||||||
padding: 10px 20px;
|
background: #F7F8FA;
|
||||||
margin: 0 0 20px;
|
width: 100%;
|
||||||
font-size: 17.5px;
|
// height: 100vh;
|
||||||
border-left: 5px solid #eee;
|
display: flex;
|
||||||
}
|
flex-direction: column;
|
||||||
hr {
|
|
||||||
margin-top: 20px;
|
.cont_box {
|
||||||
margin-bottom: 20px;
|
width: 100%;
|
||||||
border: 0;
|
margin-top: 1.33rem;
|
||||||
border-top: 1px solid #eee;
|
display: flex;
|
||||||
}
|
flex-wrap: nowrap;
|
||||||
.col-item {
|
|
||||||
margin-bottom: 20px;
|
.echart_box {
|
||||||
|
padding: 1.08rem;
|
||||||
|
margin-right: 1.17rem;
|
||||||
|
width: 59%;
|
||||||
|
height: 31.83rem;
|
||||||
|
background: #FFFFFF;
|
||||||
|
border-radius: 0rem 0rem 0rem 0rem;
|
||||||
|
|
||||||
|
.echarts_cont {
|
||||||
|
width: 100%;
|
||||||
|
height: 27.17rem;
|
||||||
|
/* 可以设置为百分比或视口单位 */
|
||||||
|
}
|
||||||
|
|
||||||
|
.tit {
|
||||||
|
font-weight: 500;
|
||||||
|
font-size: 1.33rem;
|
||||||
|
color: #1D252F;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
.right_box {
|
||||||
|
display: flex;
|
||||||
|
width: 39%;
|
||||||
|
flex-wrap: wrap;
|
||||||
|
|
||||||
|
.right_box_top {
|
||||||
|
width: 100%;
|
||||||
|
|
||||||
|
.info_li {
|
||||||
|
width: 100%;
|
||||||
|
display: flex;
|
||||||
|
flex-wrap: nowrap;
|
||||||
|
// justify-content: space-between;
|
||||||
|
height: 10.42rem;
|
||||||
|
|
||||||
|
.card2:last-child {
|
||||||
|
margin-right: 0;
|
||||||
|
}
|
||||||
|
|
||||||
|
.card2 {
|
||||||
|
margin-right: 3%;
|
||||||
|
padding: 1.42rem 1.75rem 1.33rem;
|
||||||
|
position: relative;
|
||||||
|
width: 49%;
|
||||||
|
height: 10.42rem;
|
||||||
|
background: #fff;
|
||||||
|
border-radius: 0rem 0rem 0rem 0rem;
|
||||||
|
|
||||||
|
.txt {
|
||||||
|
font-weight: 500;
|
||||||
|
font-size: 1.33rem;
|
||||||
|
color: #1D252F;
|
||||||
|
}
|
||||||
|
|
||||||
|
.num {
|
||||||
|
margin-top: 1.08rem;
|
||||||
|
margin-bottom: 0.44rem;
|
||||||
|
font-weight: 500;
|
||||||
|
font-size: 2rem;
|
||||||
|
color: #1D252F;
|
||||||
|
}
|
||||||
|
|
||||||
|
.txt1 {
|
||||||
|
font-size: 1.17rem;
|
||||||
|
color: #1D252F;
|
||||||
|
line-height: 1.58rem;
|
||||||
|
}
|
||||||
|
|
||||||
|
img {
|
||||||
|
position: absolute;
|
||||||
|
right: 2.75rem;
|
||||||
|
top: 1.42rem;
|
||||||
|
width: 4.5rem;
|
||||||
|
height: 4.5rem;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
.car_info_box {
|
||||||
|
margin-top: 1.17rem;
|
||||||
|
padding: 0.75rem 1.67rem;
|
||||||
|
width: 100%;
|
||||||
|
height: 20.25rem;
|
||||||
|
background: #FFFFFF;
|
||||||
|
border-radius: 0rem 0rem 0rem 0rem;
|
||||||
|
|
||||||
|
.tit {
|
||||||
|
font-weight: 500;
|
||||||
|
font-size: 1.33rem;
|
||||||
|
color: #1D252F;
|
||||||
|
}
|
||||||
|
|
||||||
|
.info_li {
|
||||||
|
margin-top: 1.25rem;
|
||||||
|
display: flex;
|
||||||
|
flex-wrap: nowrap;
|
||||||
|
width: 100%;
|
||||||
|
height: 40%;
|
||||||
|
.info_cont {
|
||||||
|
width: 33%;
|
||||||
|
|
||||||
|
.info_cont_top {
|
||||||
|
img {
|
||||||
|
width: 1.33rem;
|
||||||
|
height: 1.33rem;
|
||||||
|
margin-right: 0.58rem;
|
||||||
|
}
|
||||||
|
|
||||||
|
display: flex;
|
||||||
|
flex-wrap: nowrap;
|
||||||
|
justify-content: center;
|
||||||
|
align-items: center;
|
||||||
|
width: 100%;
|
||||||
|
font-weight: 500;
|
||||||
|
font-size: 1.33rem;
|
||||||
|
color: #757575;
|
||||||
|
}
|
||||||
|
|
||||||
|
.info_cont_txt {
|
||||||
|
margin-top: 0.33rem;
|
||||||
|
width: 100%;
|
||||||
|
text-align: center;
|
||||||
|
font-weight: 500;
|
||||||
|
font-size: 2rem;
|
||||||
|
color: #3D3D3D;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
}
|
}
|
||||||
|
|
||||||
ul {
|
.bot_box {
|
||||||
padding: 0;
|
margin-bottom: 2rem;
|
||||||
margin: 0;
|
padding: 1.08rem;
|
||||||
}
|
margin-top: 1.33rem;
|
||||||
|
width: 100%;
|
||||||
|
height: 12.42rem;
|
||||||
|
background: #FFFFFF;
|
||||||
|
border-radius: 0rem 0rem 0rem 0rem;
|
||||||
|
|
||||||
font-family: "open sans", "Helvetica Neue", Helvetica, Arial, sans-serif;
|
.tit {
|
||||||
font-size: 13px;
|
width: 100%;
|
||||||
color: #676a6c;
|
font-weight: 500;
|
||||||
overflow-x: hidden;
|
font-size: 1.33rem;
|
||||||
|
color: #1D252F;
|
||||||
|
}
|
||||||
|
|
||||||
ul {
|
.cont_box {
|
||||||
list-style-type: none;
|
width: 100%;
|
||||||
}
|
height: 5.67rem;
|
||||||
|
|
||||||
h4 {
|
.cont_li {
|
||||||
margin-top: 0px;
|
width: 16.6%;
|
||||||
}
|
height: 5.67rem;
|
||||||
|
border-right: 1px solid #D8D8D8;
|
||||||
|
|
||||||
h2 {
|
.cont_li_top {
|
||||||
margin-top: 10px;
|
width: 100%;
|
||||||
font-size: 26px;
|
display: flex;
|
||||||
font-weight: 100;
|
flex-wrap: nowrap;
|
||||||
}
|
justify-content: center;
|
||||||
|
align-items: center;
|
||||||
|
|
||||||
p {
|
img {
|
||||||
margin-top: 10px;
|
margin-right: 0.83rem;
|
||||||
|
width: 1.29rem;
|
||||||
|
height: 1.13rem;
|
||||||
|
}
|
||||||
|
|
||||||
b {
|
font-weight: 700;
|
||||||
font-weight: 700;
|
font-size: 1.33rem;
|
||||||
|
color: #3D3D3D;
|
||||||
|
|
||||||
|
}
|
||||||
|
|
||||||
|
.cont_li_bot {
|
||||||
|
margin-top: 1.17rem;
|
||||||
|
width: 100%;
|
||||||
|
text-align: center;
|
||||||
|
font-weight: 500;
|
||||||
|
font-size: 1.67rem;
|
||||||
|
color: #3D3D3D;
|
||||||
|
}
|
||||||
|
|
||||||
|
}
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
.update-log {
|
.info_li {
|
||||||
ol {
|
display: flex;
|
||||||
display: block;
|
flex-wrap: nowrap;
|
||||||
list-style-type: decimal;
|
// justify-content: space-between;
|
||||||
margin-block-start: 1em;
|
height: 10.42rem;
|
||||||
margin-block-end: 1em;
|
|
||||||
margin-inline-start: 0;
|
.card2 {
|
||||||
margin-inline-end: 0;
|
margin-right: 1%;
|
||||||
padding-inline-start: 40px;
|
padding: 1.42rem 1.75rem 1.33rem;
|
||||||
|
position: relative;
|
||||||
|
width: 20%;
|
||||||
|
height: 10.42rem;
|
||||||
|
background: #fff;
|
||||||
|
border-radius: 0rem 0rem 0rem 0rem;
|
||||||
|
|
||||||
|
.txt {
|
||||||
|
font-weight: 500;
|
||||||
|
font-size: 1.33rem;
|
||||||
|
color: #1D252F;
|
||||||
|
}
|
||||||
|
|
||||||
|
.num {
|
||||||
|
margin-top: 1.08rem;
|
||||||
|
margin-bottom: 0.44rem;
|
||||||
|
font-weight: 500;
|
||||||
|
font-size: 2rem;
|
||||||
|
color: #1D252F;
|
||||||
|
}
|
||||||
|
|
||||||
|
.txt1 {
|
||||||
|
font-size: 1.17rem;
|
||||||
|
color: #1D252F;
|
||||||
|
line-height: 1.58rem;
|
||||||
|
}
|
||||||
|
|
||||||
|
img {
|
||||||
|
position: absolute;
|
||||||
|
right: 2.75rem;
|
||||||
|
top: 1.42rem;
|
||||||
|
width: 4.5rem;
|
||||||
|
height: 4.5rem;
|
||||||
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
|
.card1 {
|
||||||
|
margin-right: 1%;
|
||||||
|
padding: 1.42rem 1.75rem 1.33rem;
|
||||||
|
position: relative;
|
||||||
|
width: 20%;
|
||||||
|
height: 10.42rem;
|
||||||
|
background: linear-gradient(270deg, #60ADFD 0%, rgba(148, 198, 250, 0.5) 100%);
|
||||||
|
border-radius: 0rem 0rem 0rem 0rem;
|
||||||
|
|
||||||
|
.txt {
|
||||||
|
font-weight: 500;
|
||||||
|
font-size: 1.33rem;
|
||||||
|
color: #FFFFFF;
|
||||||
|
}
|
||||||
|
|
||||||
|
.num {
|
||||||
|
margin-top: 1.08rem;
|
||||||
|
margin-bottom: 0.44rem;
|
||||||
|
font-weight: 500;
|
||||||
|
font-size: 2rem;
|
||||||
|
color: #FFFFFF;
|
||||||
|
}
|
||||||
|
|
||||||
|
.txt1 {
|
||||||
|
font-size: 1.17rem;
|
||||||
|
color: #FFFFFF;
|
||||||
|
line-height: 1.58rem;
|
||||||
|
}
|
||||||
|
|
||||||
|
img {
|
||||||
|
position: absolute;
|
||||||
|
right: 0;
|
||||||
|
bottom: 0;
|
||||||
|
width: 7rem;
|
||||||
|
height: 7.25rem;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
</style>
|
</style>
|
||||||
|
|
||||||
|
|
|
||||||
|
|
@ -60,7 +60,7 @@
|
||||||
<!-- 代付款订单数 -->
|
<!-- 代付款订单数 -->
|
||||||
<div class="top_cont">
|
<div class="top_cont">
|
||||||
<div class="cont_left">
|
<div class="cont_left">
|
||||||
<div class="cont_left_top">代付款订单数</div>
|
<div class="cont_left_top">付款订单数</div>
|
||||||
<div class="cont_left_cent">{{StatisticsInfo.unpaidOrderCount}}</div>
|
<div class="cont_left_cent">{{StatisticsInfo.unpaidOrderCount}}</div>
|
||||||
<div class="cont_left_bot">待付款订单金额：{{StatisticsInfo.unpaidOrderFee}}</div>
|
<div class="cont_left_bot">待付款订单金额：{{StatisticsInfo.unpaidOrderFee}}</div>
|
||||||
</div>
|
</div>
|
||||||
|
|
@ -117,12 +117,14 @@
|
||||||
<div class="echart_box">
|
<div class="echart_box">
|
||||||
<div class="tit"> 营收统计</div>
|
<div class="tit"> 营收统计</div>
|
||||||
<div class="echarts_cont">
|
<div class="echarts_cont">
|
||||||
<div id="myChart" style="width: 65rem;height: 19.17rem;"></div>
|
<div id="myChart" style="width: 100%;height: 19.17rem;"></div>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
<div class="car_info_box">
|
<div class="car_info_box">
|
||||||
<div class="tit">车辆统计</div>
|
<!-- <div class="tit">车辆统计</div> -->
|
||||||
<div class="info_li">
|
<div class="tit" style="margin-top: 1rem;font-weight: 700;">仓库中的车辆: {{StatisticsInfo.vehicleVo.inStashNum}}</div>
|
||||||
|
<div class="tit" style="margin-top: 1.5rem;font-weight: 700;">投放中：{{StatisticsInfo.vehicleVo.inOperation}} <span style="color: #ccc;">(含离线 {{StatisticsInfo.vehicleVo.offlineNum}})</span></div>
|
||||||
|
<!-- <div class="info_li">
|
||||||
<div class="info_cont">
|
<div class="info_cont">
|
||||||
<div class="info_cont_top">
|
<div class="info_cont_top">
|
||||||
<img src="https://lxnapi.ccttiot.com/bike/img/static/uwDG51FnJQGuEXLn2SYQ" alt="" style="height: 1rem;">车辆总数（辆）
|
<img src="https://lxnapi.ccttiot.com/bike/img/static/uwDG51FnJQGuEXLn2SYQ" alt="" style="height: 1rem;">车辆总数（辆）
|
||||||
|
|
@ -147,7 +149,7 @@
|
||||||
{{StatisticsInfo.vehicleVo.disabledNum}}
|
{{StatisticsInfo.vehicleVo.disabledNum}}
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div> -->
|
||||||
<div class="info_li">
|
<div class="info_li">
|
||||||
<div class="info_cont">
|
<div class="info_cont">
|
||||||
<div class="info_cont_top">
|
<div class="info_cont_top">
|
||||||
|
|
@ -185,18 +187,18 @@
|
||||||
</div>
|
</div>
|
||||||
<div class="info_cont">
|
<div class="info_cont">
|
||||||
<div class="info_cont_top">
|
<div class="info_cont_top">
|
||||||
<img src="https://lxnapi.ccttiot.com/bike/img/static/uAKVUuosyqvFJx5Ynjbp" alt="">离线（辆）
|
<img src="https://lxnapi.ccttiot.com/bike/img/static/uxx6Ajx0ne7Ho6LH8Bfg" alt="">禁用中（辆）
|
||||||
</div>
|
</div>
|
||||||
<div class="info_cont_txt">
|
<div class="info_cont_txt">
|
||||||
{{StatisticsInfo.vehicleVo.offlineNum}}
|
{{StatisticsInfo.vehicleVo.disabledNum}}
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
<div class="info_cont">
|
<div class="info_cont">
|
||||||
<div class="info_cont_top">
|
<div class="info_cont_top">
|
||||||
<img src="https://lxnapi.ccttiot.com/bike/img/static/uAoVo6LxxZ4PthTHZtiH" alt="">仓库中（辆）
|
<img src="https://lxnapi.ccttiot.com/bike/img/static/uwDG51FnJQGuEXLn2SYQ" alt="" style="height: 1rem;">车辆总数（辆）
|
||||||
</div>
|
</div>
|
||||||
<div class="info_cont_txt">
|
<div class="info_cont_txt">
|
||||||
{{StatisticsInfo.vehicleVo.inStashNum}}
|
{{StatisticsInfo.vehicleVo.allNum}}
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
|
|
@ -307,7 +309,7 @@ export default {
|
||||||
this.StatisticsInfo.incomeVoList.reverse();
|
this.StatisticsInfo.incomeVoList.reverse();
|
||||||
setTimeout(() => {
|
setTimeout(() => {
|
||||||
this.drawLine()
|
this.drawLine()
|
||||||
}, 800);
|
}, 1000);
|
||||||
|
|
||||||
console.log("areaOptions", this.areaOptions);
|
console.log("areaOptions", this.areaOptions);
|
||||||
});
|
});
|
||||||
|
|
@ -317,7 +319,7 @@ export default {
|
||||||
// 设置图表的配置项和数据
|
// 设置图表的配置项和数据
|
||||||
myChart.setOption({
|
myChart.setOption({
|
||||||
grid: {
|
grid: {
|
||||||
left: 50,
|
left: 60,
|
||||||
right: 50,
|
right: 50,
|
||||||
top: 10,
|
top: 10,
|
||||||
bottom: 20,
|
bottom: 20,
|
||||||
|
|
@ -344,7 +346,7 @@ export default {
|
||||||
}
|
}
|
||||||
},
|
},
|
||||||
axisLabel: {
|
axisLabel: {
|
||||||
formatter: '{value} K'
|
formatter: '{value} 元'
|
||||||
}
|
}
|
||||||
},
|
},
|
||||||
{
|
{
|
||||||
|
|
@ -487,7 +489,9 @@ export default {
|
||||||
height: 23.17rem;
|
height: 23.17rem;
|
||||||
background: #FFFFFF;
|
background: #FFFFFF;
|
||||||
border-radius: 0rem 0rem 0rem 0rem;
|
border-radius: 0rem 0rem 0rem 0rem;
|
||||||
|
.echarts_cont{
|
||||||
|
width: 100%;
|
||||||
|
}
|
||||||
.tit {
|
.tit {
|
||||||
font-weight: 500;
|
font-weight: 500;
|
||||||
font-size: 1.33rem;
|
font-size: 1.33rem;
|
||||||
|
|
@ -510,14 +514,15 @@ export default {
|
||||||
}
|
}
|
||||||
|
|
||||||
.info_li {
|
.info_li {
|
||||||
|
|
||||||
margin-top: 1.25rem;
|
margin-top: 1.25rem;
|
||||||
display: flex;
|
display: flex;
|
||||||
flex-wrap: nowrap;
|
flex-wrap: nowrap;
|
||||||
width: 100%;
|
width: 100%;
|
||||||
|
// height: 30%;
|
||||||
.info_cont {
|
.info_cont {
|
||||||
width: 33%;
|
width: 33%;
|
||||||
|
margin-top: 1rem;
|
||||||
.info_cont_top {
|
.info_cont_top {
|
||||||
img {
|
img {
|
||||||
width: 1.33rem;
|
width: 1.33rem;
|
||||||
|
|
@ -527,7 +532,7 @@ export default {
|
||||||
|
|
||||||
display: flex;
|
display: flex;
|
||||||
flex-wrap: nowrap;
|
flex-wrap: nowrap;
|
||||||
justify-content: center;
|
// justify-content: center;
|
||||||
align-items: center;
|
align-items: center;
|
||||||
width: 100%;
|
width: 100%;
|
||||||
font-weight: 500;
|
font-weight: 500;
|
||||||
|
|
@ -536,9 +541,9 @@ export default {
|
||||||
}
|
}
|
||||||
|
|
||||||
.info_cont_txt {
|
.info_cont_txt {
|
||||||
margin-top: 0.33rem;
|
margin-top: 0.53rem;
|
||||||
width: 100%;
|
width: 100%;
|
||||||
text-align: center;
|
// text-align: center;
|
||||||
font-weight: 500;
|
font-weight: 500;
|
||||||
font-size: 2rem;
|
font-size: 2rem;
|
||||||
color: #3D3D3D;
|
color: #3D3D3D;
|
||||||
|
|
@ -692,13 +697,14 @@ export default {
|
||||||
|
|
||||||
.tops_right_bot_cont_left {
|
.tops_right_bot_cont_left {
|
||||||
.tit {
|
.tit {
|
||||||
font-weight: 500;
|
font-weight: 700;
|
||||||
font-size: 1.33rem;
|
font-size: 1.33rem;
|
||||||
color: #1D252F;
|
color: #1D252F;
|
||||||
}
|
}
|
||||||
|
|
||||||
.txt {
|
.txt {
|
||||||
font-weight: 500;
|
margin-top: 0.5rem;
|
||||||
|
font-weight:500;
|
||||||
font-size: 2rem;
|
font-size: 2rem;
|
||||||
color: #1D2129;
|
color: #1D2129;
|
||||||
}
|
}
|
||||||
|
|
|
||||||
Loading…
Reference in New Issue
Block a user