This commit is contained in:
duxp 2023-09-19 10:58:36 +08:00
parent 6c4e907587
commit e4bc22bfbd
2 changed files with 75 additions and 53 deletions

View File

@ -21,19 +21,48 @@
.main_wrap .main_left .main_left_item {
width: 100%;
height: 35vh;
height: 30vh;
padding: 10px;
box-sizing: border-box;
/*background-color: rgba(11, 40, 49, 0.2);*/
}
.main_wrap .main_center .main_center_item, .main_wrap .main_right .main_right_item {
.main_wrap .main_right .main_right_item{
width: 100%;
height: 70vh;
height: 60vh;
box-sizing: border-box;
padding: 10px;
position: relative;
}
.main_wrap .main_right .main_right_item_two{
width: 100%;
height: 40vh;
box-sizing: border-box;
padding: 10px;
position: relative;
}
.main_wrap .main_right .main_right_item_two .main_right_item_two_div{
width: 100%;
height: 35vh;
}
.main_wrap .main_center .main_center_item{
width: 100%;
height: 60vh;
box-sizing: border-box;
padding: 10px;
position: relative;
}
.main_wrap .main_left .main_left_item:nth-child(2) {
margin: 3vh 0;
}
.main_wrap .main_left .main_left_item .btn_echarts_wrap {
width: 100%;
height: 25vh;
}
.main_wrap .main_left .main_left_item .echarts_wrap {
width: 100%;
height: 28vh;
}
.main_wrap .main_center .main_center_item .rain {
position: absolute;
@ -252,9 +281,9 @@
/*background-color: rgba(11, 40, 49, 0.2);*/
}
.main_wrap .main_footer {
.main_wrap .main_center .main_footer {
width: 100%;
height: 30vh;
height: 40vh;
box-sizing: border-box;
padding: 10px;
/*background-color: rgba(11, 40, 49, 0.2);*/
@ -287,24 +316,14 @@
margin-right: 5px;
}
.main_wrap .btn_echarts_wrap {
.main_wrap .main_center .main_footer .echarts_footer_wrap {
width: 100%;
height: 25vh;
}
.main_wrap .echarts_wrap {
width: 100%;
height: 28vh;
}
.main_wrap .echarts_footer_wrap {
width: 100%;
height: 24vh;
height: 34vh;
}
.main_wrap .echarts_right_top_wrap{
width: 100%;
height: 60vh;
height: 52vh;
}
.main_footer_center{
width: 100%;

View File

@ -34,12 +34,12 @@
</div>
<div class="echarts_wrap" id="center_left_echarts"></div>
</div>
<div class="main_footer">
<div class="main_left_item">
<div class="echarts_title">
<span></span>
<span>重点工作进度</span>
</div>
<div class="center_footer_content" id="center_footer_one"></div>
<div class="echarts_wrap" id="center_footer_one"></div>
</div>
</div>
<div class="main_center">
@ -113,7 +113,7 @@
<span class="trade_all_num">全年累计交易数0</span>
<span class="trade_all_money" style="margin-left: 20px">全年累计交易额0万元</span>
</div>
<div class="center_footer_content" style="height: 20vh" id="center_footer_two">
<div class="center_footer_content" style="height: 30vh" id="center_footer_two">
</div>
</div>
</div>
@ -132,12 +132,12 @@
</div>
<div class="echarts_right_top_wrap" id="top_right_echarts"></div>
</div>
<div class="main_footer">
<div class="main_right_item_two">
<div class="echarts_title">
<span></span>
<span onclick="openTab(4)">季度考核指标</span>
</div>
<div class="echarts_footer_wrap" id="bottom_right_echarts"></div>
<div class="main_right_item_two_div" id="bottom_right_echarts"></div>
</div>
</div>
</div>
@ -711,35 +711,49 @@
dataType:'json',
success(res){
let _data = res.data;
let _yData = [],_sData1 = [],_sData2 = [];
let _yData = _data.type,_sData = [];
let _allNumData = _data.data;
$('.trade_month_num').text('当月累计交易数:'+_data.monthCount);
$('.trade_month_money').text('当月累计交易额:'+_data.monthMoney.toFixed(2)+'万元');
$('.trade_all_num').text('全年累计交易数:'+_data.yearCount);
$('.trade_all_money').text('全年累计交易额:'+_data.yearMoney.toFixed(2)+'万元');
_data.list.forEach(item => {
_yData.push(item.month);
_sData1.push(item.count);
_sData2.push(item.trade.toFixed(2))
_data.data.forEach(item => {
_sData.push({
name: item.name,
type: 'bar',
stack: 'total',
// label: {
// show: true,
// formatter:function(params){
// return params.value.toFixed(2)+'万元';
// }
// },
emphasis: {
focus: 'series'
},
data: item.array
})
})
let chart = echarts.init(document.getElementById('center_footer_two'));
let option = {
color:['#02abe0','#05f3b4'],
tooltip: {
trigger: 'axis',
axisPointer: {
type: 'shadow'
},
trigger: 'item',
formatter:function(params){
let _data = params[0].name+'<br/>';
params.forEach((item,index) => {
if(index === 0){
_data+=item.marker+' '+item.seriesName+''+item.data+'<br/>';
}else{
_data+=item.marker+' '+item.seriesName+''+item.data+'万元';
let _retTips = params.marker+' '+params.seriesName+'<br/>交易额:'+params.value.toFixed(2)+'万元<br/>';
_allNumData.forEach(item => {
if(item.name === params.seriesName){
Object.keys(item.obj1).forEach(key => {
if(params.name === String(key)){
_retTips+='交易数:'+item.obj1[key]
}
})
}
})
return _data;
return _retTips;
}
},
legend: {
type:'scroll',
bottom:'bottom',
textStyle: {
color: "#ffffff"
@ -766,18 +780,7 @@
color:'#fff'
}
},
series: [
{
name: '交易数',
type: 'bar',
data: _sData1
},
{
name: '交易额',
type: 'bar',
data: _sData2
}
]
series: _sData
};
// 使用刚指定的配置项和数据显示图表。
chart.setOption(option);