完善数据大屏的流程概况
This commit is contained in:
459816669@qq.com
parent
e57d8b26bf
commit
af323b8957
|
|
@ -82,17 +82,19 @@ a:hover{ color:#06c; text-decoration: none!important}
|
|||
.map2{ width:5.66rem; top:.85rem; left: .77rem; z-index: 3; opacity: 0.2; animation: myfirst 10s infinite linear;}
|
||||
.map3{ width:5.18rem; top:1.07rem; left: 1.13rem; z-index: 1;}
|
||||
|
||||
#echarts1,#echarts2,#echarts3,#echarts6,#echarts7,#echarts8{ position:relative;}
|
||||
#echarts1,#echarts9,#echarts2,#echarts3,#echarts6,#echarts7,#echarts8{ position:relative;}
|
||||
#echarts1:before,
|
||||
#echarts9:before,
|
||||
#echarts2:before,
|
||||
#echarts3:before,
|
||||
#echarts6:before,
|
||||
#echarts7:before,
|
||||
#echarts8:before{ position:absolute; content: "23124"; width: 100%; text-align: center; bottom: .15rem; color: #fff; opacity: .7; font-size: .18rem;}
|
||||
|
||||
#echarts1:before{ content: "平均单客价"}
|
||||
#echarts2:before{ content: "男消费"}
|
||||
#echarts3:before{ content: "女消费"}
|
||||
#echarts1:before{ content: "成功数"}
|
||||
#echarts9:before{ content: "失败数"}
|
||||
#echarts2:before{ content: "成功占比"}
|
||||
#echarts3:before{ content: "失败占比"}
|
||||
|
||||
#echarts6:before{ content: "新增会员"}
|
||||
#echarts7:before{ content: "新增领卡会员"}
|
||||
|
|
@ -132,7 +134,7 @@ a:hover{ color:#06c; text-decoration: none!important}
|
|||
.wrap{ height:2.54rem; overflow: hidden;}
|
||||
.wrap li{ line-height:.42rem; height:.42rem; font-size: .18rem; text-indent: .24rem; margin-bottom: .1rem; }
|
||||
.wrap li p{border: 1px solid rgba(25,186,139,.17);color: rgba(255,255,255,.6); }
|
||||
.sy{ float:left; width: 25%; height: 2.2rem; margin-top: -.25rem;}
|
||||
.sy{ float:left; width: 24%; height: 2.2rem; margin-top: -.25rem;}
|
||||
|
||||
|
||||
.adduser{ height:1.5rem; overflow: hidden;}
|
||||
|
|
|
|||
|
|
@ -74,7 +74,7 @@
|
|||
<div class="boxall" style="height: 2.65rem">
|
||||
<div class="alltitle">钉钉数据同步概况</div>
|
||||
<div class="sy" id="echarts1"></div>
|
||||
<div class="sy" id="echarts14"></div>
|
||||
<div class="sy" id="echarts9"></div>
|
||||
<div class="sy" id="echarts2"></div>
|
||||
<div class="sy" id="echarts3"></div>
|
||||
<div class="boxfoot"></div>
|
||||
|
|
@ -179,6 +179,7 @@
|
|||
myChart6.resize();
|
||||
myChart7.resize();
|
||||
myChart8.resize();
|
||||
myChart9.resize();
|
||||
})
|
||||
window.addEventListener("resize", function () {
|
||||
myChart1.resize();
|
||||
|
|
@ -187,6 +188,7 @@
|
|||
myChart6.resize();
|
||||
myChart7.resize();
|
||||
myChart8.resize();
|
||||
myChart9.resize();
|
||||
});
|
||||
</script>
|
||||
<script type="text/javascript">
|
||||
|
|
@ -354,9 +356,9 @@
|
|||
var myChart1 = echarts.init(document.getElementById('echarts1'));
|
||||
var v1 = [[${DingTalkSituation.failureNums}]];
|
||||
var v2 = [[${DingTalkSituation.successNums}]];
|
||||
|
||||
option0 = {
|
||||
//同步失败数
|
||||
var v3 = [[${DingTalkSituation.successRatio}]];
|
||||
var v4 = [[${DingTalkSituation.failureRatio}]];
|
||||
option1 = {
|
||||
series: [{
|
||||
type: 'pie',
|
||||
radius: ['70%', '80%'],
|
||||
|
|
@ -382,10 +384,8 @@
|
|||
]
|
||||
}]
|
||||
};
|
||||
var myChart14 = echarts.init(document.getElementById('echarts14'));
|
||||
var v1 = [[${DingTalkSituation.failureNums}]];
|
||||
var v2 = [[${DingTalkSituation.successNums}]];
|
||||
option1 = {
|
||||
var myChart9 = echarts.init(document.getElementById('echarts9'));
|
||||
option9 = {
|
||||
//同步失败数
|
||||
series: [{
|
||||
type: 'pie',
|
||||
|
|
@ -415,9 +415,6 @@
|
|||
|
||||
|
||||
var myChart3 = echarts.init(document.getElementById('echarts3'));
|
||||
var v1 = 298
|
||||
var v2 = 523
|
||||
var v3 = v1 + v2
|
||||
option2 = {
|
||||
|
||||
series: [{
|
||||
|
|
@ -430,27 +427,27 @@
|
|||
}
|
||||
},
|
||||
data: [{
|
||||
value: v1,
|
||||
name: '成功占比',
|
||||
value: v2,
|
||||
name: '成功数',
|
||||
label: {
|
||||
normal: {
|
||||
formatter: v1 + '',
|
||||
formatter: v2 + '',
|
||||
textStyle: {
|
||||
fontSize: 20,
|
||||
color: '#fff',
|
||||
color: '#fff ',
|
||||
}
|
||||
}
|
||||
}
|
||||
}, {
|
||||
value: v2,
|
||||
name: '失败占比',
|
||||
value: v1,
|
||||
name: '成功占比',
|
||||
label: {
|
||||
normal: {
|
||||
formatter: function (params) {
|
||||
return '占比' + Math.round(v1 / v3 * 100) + '%'
|
||||
return v3+ '%'
|
||||
},
|
||||
textStyle: {
|
||||
color: '#aaa',
|
||||
color: '#fff ',
|
||||
fontSize: 12
|
||||
}
|
||||
}
|
||||
|
|
@ -479,27 +476,27 @@
|
|||
}
|
||||
},
|
||||
data: [{
|
||||
value: v2,
|
||||
name: '失败占比',
|
||||
value: v1,
|
||||
name: '失败数',
|
||||
label: {
|
||||
normal: {
|
||||
formatter: v2 + '',
|
||||
formatter: v1+ '',
|
||||
textStyle: {
|
||||
fontSize: 20,
|
||||
color: '#fff',
|
||||
color: '#FF0000',
|
||||
}
|
||||
}
|
||||
}
|
||||
}, {
|
||||
value: v1,
|
||||
name: '成功占比',
|
||||
name: '失败占比',
|
||||
label: {
|
||||
normal: {
|
||||
formatter: function (params) {
|
||||
return '占比' + Math.round(v2 / v3 * 100) + '%'
|
||||
return v4 + '%'
|
||||
},
|
||||
textStyle: {
|
||||
color: '#aaa',
|
||||
color: '#FF0000',
|
||||
fontSize: 12
|
||||
}
|
||||
}
|
||||
|
|
@ -516,8 +513,8 @@
|
|||
}]
|
||||
};
|
||||
setTimeout(function () {
|
||||
myChart1.setOption(option0);
|
||||
myChart14.setOption(option1)
|
||||
myChart1.setOption(option1);
|
||||
myChart9.setOption(option9)
|
||||
myChart2.setOption(option2);
|
||||
myChart3.setOption(option3);
|
||||
}, 500);
|
||||
|
|
@ -561,17 +558,17 @@
|
|||
symbolSize: 60,
|
||||
color: 'rgba(73,188,247,.14)'
|
||||
}, {
|
||||
offset: [75, 75],
|
||||
offset: [93, 30],
|
||||
symbolSize: 60,
|
||||
color: 'rgba(73,188,247,.14)'
|
||||
},
|
||||
{
|
||||
offset: [75, 75],
|
||||
offset: [85, 75],
|
||||
symbolSize: 60,
|
||||
color: 'rgba(73,188,247,.14)'
|
||||
},
|
||||
{
|
||||
offset: [75, 75],
|
||||
offset: [26, 19],
|
||||
symbolSize: 60,
|
||||
color: 'rgba(73,188,247,.14)'
|
||||
}];
|
||||
|
|
|
|||
Loading…
Reference in New Issue