2021-04-30 10:28:37 +08:00
|
|
|
|
<%@ Page Language="C#" AutoEventWireup="true" CodeBehind="mainMenu_TestRun.aspx.cs" Inherits="FineUIPro.Web.mainMenu_TestRun" %>
|
|
|
|
|
|
|
|
|
|
|
|
<!DOCTYPE html>
|
|
|
|
|
|
<html>
|
|
|
|
|
|
<head id="Head1" runat="server">
|
|
|
|
|
|
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
|
|
|
|
|
|
<title>首页</title>
|
|
|
|
|
|
<link href="../res/index/css/reset.css" rel="stylesheet" />
|
|
|
|
|
|
<link href="../res/index/css/home.css" rel="stylesheet" />
|
|
|
|
|
|
<link href="../res/index/css/swiper-3.4.2.min.css" rel="stylesheet" />
|
|
|
|
|
|
<style type="text/css">
|
|
|
|
|
|
.top {
|
|
|
|
|
|
display: flex;
|
|
|
|
|
|
display: -webkit-flex;
|
|
|
|
|
|
overflow: hidden;
|
|
|
|
|
|
width: 100%;
|
|
|
|
|
|
height: 360px;
|
|
|
|
|
|
margin-bottom: 5px;
|
|
|
|
|
|
box-sizing: border-box;
|
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
|
|
.top .item {
|
|
|
|
|
|
flex: 1;
|
|
|
|
|
|
width: 50%;
|
|
|
|
|
|
float: left;
|
|
|
|
|
|
box-sizing: border-box;
|
|
|
|
|
|
margin: 0 10px 20px;
|
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
|
|
.bw-b {
|
|
|
|
|
|
width: 50%;
|
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
|
|
.bw-b-bottom-up {
|
|
|
|
|
|
box-sizing: border-box;
|
|
|
|
|
|
height: 340px;
|
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
|
|
.tab-wrap {
|
|
|
|
|
|
left: auto;
|
|
|
|
|
|
right: 15px;
|
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
|
|
.tab .t-item {
|
|
|
|
|
|
width: auto;
|
|
|
|
|
|
padding: 5px 10px;
|
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
|
|
.bottom-list {
|
|
|
|
|
|
height: 100px;
|
|
|
|
|
|
padding: 15px;
|
|
|
|
|
|
overflow: hidden;
|
|
|
|
|
|
color: #fff;
|
|
|
|
|
|
margin: 0 10px;
|
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
|
|
.bottom-list .bl-left {
|
|
|
|
|
|
float: left;
|
|
|
|
|
|
margin-right: 30px;
|
|
|
|
|
|
margin-left: 50px;
|
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
|
|
.bottom-list .bl-right {
|
|
|
|
|
|
float: right;
|
|
|
|
|
|
margin-right: 50px;
|
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
|
|
.tab .t-item {
|
|
|
|
|
|
font-size: 13px;
|
|
|
|
|
|
}
|
|
|
|
|
|
</style>
|
|
|
|
|
|
</head>
|
|
|
|
|
|
<body>
|
2024-02-08 18:10:24 +08:00
|
|
|
|
|
2021-04-30 10:28:37 +08:00
|
|
|
|
<div class="wrap">
|
2024-02-08 18:10:24 +08:00
|
|
|
|
<div class="bottom-wrap">
|
|
|
|
|
|
<div class="top">
|
|
|
|
|
|
<div class="item">
|
|
|
|
|
|
<div class="bw-b-bottom ptop6">
|
|
|
|
|
|
<div class="bw-b-bottom-up">
|
|
|
|
|
|
<div class="bw-item-content">
|
|
|
|
|
|
<div id='one' style="width: 100%; height: 100%;"></div>
|
|
|
|
|
|
</div>
|
|
|
|
|
|
</div>
|
|
|
|
|
|
</div>
|
|
|
|
|
|
</div>
|
|
|
|
|
|
<div class="item">
|
|
|
|
|
|
<div class="bw-b-bottom ptop6">
|
|
|
|
|
|
<div class="bw-b-bottom-up">
|
|
|
|
|
|
<div class="bw-item-content">
|
|
|
|
|
|
<div id='two' style="width: 100%; height: 100%;"></div>
|
|
|
|
|
|
</div>
|
|
|
|
|
|
</div>
|
|
|
|
|
|
</div>
|
|
|
|
|
|
</div>
|
|
|
|
|
|
</div>
|
|
|
|
|
|
</div>
|
|
|
|
|
|
</div>
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
<%--<div class="wrap">
|
2021-04-30 10:28:37 +08:00
|
|
|
|
<div class="bottom-wrap">
|
|
|
|
|
|
<div class="top">
|
|
|
|
|
|
<div class="item">
|
|
|
|
|
|
<div class="bw-b-bottom ptop6">
|
|
|
|
|
|
<div class="bw-b-bottom-up">
|
|
|
|
|
|
<div class="tab-wrap">
|
|
|
|
|
|
<div class="tab" data-value="1">
|
|
|
|
|
|
<div class="t-item active">施工分包商</div>
|
|
|
|
|
|
<div class="spline"></div>
|
|
|
|
|
|
<div class="t-item ">单位工程</div>
|
|
|
|
|
|
<div class="spline"></div>
|
|
|
|
|
|
<div class="t-item">专业</div>
|
|
|
|
|
|
</div>
|
|
|
|
|
|
</div>
|
|
|
|
|
|
<div class="bw-item-content">
|
|
|
|
|
|
<div id='one' style="width: 100%; height: 100%;"></div>
|
|
|
|
|
|
</div>
|
|
|
|
|
|
</div>
|
|
|
|
|
|
</div>
|
|
|
|
|
|
</div>
|
|
|
|
|
|
<div class="item">
|
|
|
|
|
|
<div class="bw-b-bottom ptop6">
|
|
|
|
|
|
<div class="bw-b-bottom-up">
|
|
|
|
|
|
<div class="tab-wrap">
|
|
|
|
|
|
<div class="tab" data-value="2">
|
|
|
|
|
|
<div class="t-item active">施工分包商</div>
|
|
|
|
|
|
<div class="spline"></div>
|
|
|
|
|
|
<div class="t-item ">单位工程</div>
|
|
|
|
|
|
<div class="spline"></div>
|
|
|
|
|
|
<div class="t-item">专业</div>
|
|
|
|
|
|
</div>
|
|
|
|
|
|
</div>
|
|
|
|
|
|
<div class="bw-item-content">
|
|
|
|
|
|
<div id='two' style="width: 100%; height: 100%;"></div>
|
|
|
|
|
|
</div>
|
|
|
|
|
|
</div>
|
|
|
|
|
|
</div>
|
|
|
|
|
|
</div>
|
|
|
|
|
|
</div>
|
|
|
|
|
|
</div>
|
|
|
|
|
|
<div class="bottom-wrap">
|
|
|
|
|
|
<div class="top">
|
|
|
|
|
|
<div class="item">
|
|
|
|
|
|
<div class="bw-b-bottom ptop6">
|
|
|
|
|
|
<div class="bw-b-bottom-up">
|
|
|
|
|
|
<div class="tab-wrap">
|
|
|
|
|
|
<div class="tab" data-value="3">
|
|
|
|
|
|
<div class="t-item active">施工分包商</div>
|
|
|
|
|
|
<div class="spline"></div>
|
|
|
|
|
|
<div class="t-item ">单位工程</div>
|
|
|
|
|
|
<div class="spline"></div>
|
|
|
|
|
|
<div class="t-item">专业</div>
|
|
|
|
|
|
<div class="spline"></div>
|
|
|
|
|
|
<div class="t-item">问题类别</div>
|
|
|
|
|
|
</div>
|
|
|
|
|
|
</div>
|
|
|
|
|
|
<div class="bw-item-content">
|
|
|
|
|
|
<div id='three' style="width: 100%; height: 100%;"></div>
|
|
|
|
|
|
</div>
|
|
|
|
|
|
</div>
|
|
|
|
|
|
</div>
|
|
|
|
|
|
</div>
|
|
|
|
|
|
<div class="item">
|
|
|
|
|
|
<div class="bw-b-bottom ptop6">
|
|
|
|
|
|
<div class="bw-b-bottom-up">
|
|
|
|
|
|
<div class="tab-wrap">
|
|
|
|
|
|
<div class="tab" data-value="4">
|
|
|
|
|
|
<div class="t-item active">主项</div>
|
|
|
|
|
|
<div class="spline"></div>
|
|
|
|
|
|
<div class="t-item">专业</div>
|
|
|
|
|
|
</div>
|
|
|
|
|
|
</div>
|
|
|
|
|
|
<div class="bw-item-content">
|
|
|
|
|
|
<div id='four' style="width: 100%; height: 100%;"></div>
|
|
|
|
|
|
</div>
|
|
|
|
|
|
</div>
|
|
|
|
|
|
</div>
|
|
|
|
|
|
</div>
|
|
|
|
|
|
</div>
|
|
|
|
|
|
</div>
|
|
|
|
|
|
<div class="bottom-wrap">
|
|
|
|
|
|
<div class="bw-b-bottom-up bottom-list">
|
|
|
|
|
|
<div class="bl-left">
|
|
|
|
|
|
<div>质量控制点：总数量200，已完成178，未完成22，完成百分比89%</div>
|
|
|
|
|
|
<div>质量问题：总数量100，已完成84，未完成16，完成百分比84%</div>
|
|
|
|
|
|
<div>设计变更：总数量65，已完成52，未完成13，完成百分比80%</div>
|
|
|
|
|
|
</div>
|
|
|
|
|
|
<div class="bl-right">
|
|
|
|
|
|
<div>工程联系单：总数量65，已完成56，未完成9 </div>
|
|
|
|
|
|
<div>工作联系单：总数量42，已完成35，未完成7 </div>
|
|
|
|
|
|
<div>施工方案：总数量34，已完成30，未完成4 </div>
|
|
|
|
|
|
</div>
|
|
|
|
|
|
</div>
|
|
|
|
|
|
</div>
|
2024-02-08 18:10:24 +08:00
|
|
|
|
</div>--%>
|
2021-04-30 10:28:37 +08:00
|
|
|
|
</body>
|
|
|
|
|
|
<script type="text/javascript" src="../res/index/js/jquery-3.4.1.min.js"></script>
|
|
|
|
|
|
<script type="text/javascript" src="../res/index/js/swiper-3.4.2.jquery.min.js"></script>
|
|
|
|
|
|
<script type="text/javascript" src="../res/index/js/echarts.min.js"></script>
|
|
|
|
|
|
<script type="text/javascript">
|
2024-02-08 18:10:24 +08:00
|
|
|
|
var oneArrStr = "<%=oneArrStr%>";
|
|
|
|
|
|
var oneDataStr = '<%=oneDataStr%>';
|
|
|
|
|
|
var oneNameData = [];
|
|
|
|
|
|
var oneArr = JSON.parse(oneArrStr);
|
|
|
|
|
|
var oneData = JSON.parse(oneDataStr);
|
|
|
|
|
|
$.each(oneData, function (inxex, item) {
|
|
|
|
|
|
var obj = { name: item };
|
|
|
|
|
|
oneNameData.push(obj);
|
|
|
|
|
|
});
|
|
|
|
|
|
//图1
|
|
|
|
|
|
var bar_data = oneArr;//模拟数据
|
|
|
|
|
|
var chart = echarts.init(document.getElementById('one'));
|
|
|
|
|
|
var option = {
|
|
|
|
|
|
title: {
|
|
|
|
|
|
text: '预试车进度信息',
|
|
|
|
|
|
textStyle: {
|
|
|
|
|
|
color: '#fff',
|
|
|
|
|
|
fontWeight: 'normal',
|
|
|
|
|
|
fontSize: 16
|
|
|
|
|
|
},
|
|
|
|
|
|
show: true
|
|
|
|
|
|
},
|
|
|
|
|
|
tooltip: {
|
|
|
|
|
|
formatter: '{a}:{c}%'//a 是series中每条数据name值，c 是data数值
|
|
|
|
|
|
},
|
2024-02-15 14:53:34 +08:00
|
|
|
|
//legend: {
|
|
|
|
|
|
// orient: 'vertical', // 'horizontal'
|
|
|
|
|
|
// data: oneData,
|
|
|
|
|
|
// textStyle: { // 图列内容样式
|
|
|
|
|
|
// color: '#fff', // 字体颜色
|
|
|
|
|
|
// },
|
|
|
|
|
|
// x: '70%',//图例位置，设置right发现图例和文字位置反了，设置一个数值就好了
|
|
|
|
|
|
// y: 'center'//延Y轴居中
|
|
|
|
|
|
//},
|
2024-02-08 18:10:24 +08:00
|
|
|
|
grid: {
|
|
|
|
|
|
left: '3%',
|
2024-02-15 14:53:34 +08:00
|
|
|
|
//right: '30%',
|
|
|
|
|
|
right: '0%',
|
2024-02-08 18:10:24 +08:00
|
|
|
|
top: '15%',
|
2024-02-15 14:53:34 +08:00
|
|
|
|
bottom: '5%',
|
2024-02-08 18:10:24 +08:00
|
|
|
|
containLabel: true,
|
|
|
|
|
|
backgroundColor: 'rgba(0,162,233, 0.01)',
|
|
|
|
|
|
},
|
|
|
|
|
|
xAxis: [ //横坐标
|
|
|
|
|
|
{
|
|
|
|
|
|
type: 'category',
|
2024-02-15 14:53:34 +08:00
|
|
|
|
data: oneData,
|
2024-02-08 18:10:24 +08:00
|
|
|
|
axisLine: {
|
|
|
|
|
|
lineStyle: {
|
|
|
|
|
|
color: "#fff",//横坐标线条颜色
|
|
|
|
|
|
}
|
2024-02-15 14:53:34 +08:00
|
|
|
|
},
|
|
|
|
|
|
axisLabel: {
|
|
|
|
|
|
interval: 0,
|
|
|
|
|
|
rotate: -90,
|
2024-02-08 18:10:24 +08:00
|
|
|
|
}
|
|
|
|
|
|
}
|
|
|
|
|
|
],
|
|
|
|
|
|
yAxis: [ //纵坐标
|
|
|
|
|
|
{
|
|
|
|
|
|
type: 'value',
|
|
|
|
|
|
axisLabel: {
|
|
|
|
|
|
show: true,
|
|
|
|
|
|
formatter: '{value}%',//给Y轴数值添加百分号
|
|
|
|
|
|
},
|
|
|
|
|
|
axisLine: {
|
|
|
|
|
|
lineStyle: {
|
|
|
|
|
|
color: "#fff",//纵坐标线条颜色
|
|
|
|
|
|
}
|
|
|
|
|
|
}
|
|
|
|
|
|
}
|
|
|
|
|
|
],
|
2024-02-15 14:53:34 +08:00
|
|
|
|
//dataZoom: [
|
|
|
|
|
|
// {
|
|
|
|
|
|
// type: "slider",//slider表示有滑动块的，
|
|
|
|
|
|
// show: true,
|
|
|
|
|
|
//// xAxisIndex: [0],//表示x轴折叠
|
|
|
|
|
|
// start: 1,//数据窗口范围的起始百分比,表示1%
|
|
|
|
|
|
// end: 70,//数据窗口范围的结束百分比,表示35%坐标
|
|
|
|
|
|
// bottom: "0",
|
|
|
|
|
|
// },
|
|
|
|
|
|
//],
|
|
|
|
|
|
series: [{
|
|
|
|
|
|
name: '进度率',
|
|
|
|
|
|
type: 'bar',
|
|
|
|
|
|
barWidth: 20,
|
|
|
|
|
|
data: oneArr,
|
|
|
|
|
|
label: {
|
|
|
|
|
|
show: true,
|
|
|
|
|
|
position: 'inside',
|
|
|
|
|
|
interval: 0,
|
|
|
|
|
|
rotate: -90,
|
|
|
|
|
|
formatter: function (params) {
|
|
|
|
|
|
if (params.value > 0) {
|
|
|
|
|
|
return params.value + '%';
|
|
|
|
|
|
} else {
|
|
|
|
|
|
return ' ';
|
|
|
|
|
|
}
|
|
|
|
|
|
},
|
|
|
|
|
|
},
|
|
|
|
|
|
itemStyle: {
|
|
|
|
|
|
normal: {
|
|
|
|
|
|
color: function (params) {
|
|
|
|
|
|
var colorList = ['#0287f8', '#33CCCC', '#58b1fc', '#2fb6f6', '#CC3366', '#00FF99', '#33FFFF', '#669900', '#CC0099', '#FF66FF', '#330099', '#00FFCC', '#FFFF33', '#FF9966', '#FF6633'];
|
|
|
|
|
|
return colorList[params.dataIndex]
|
2024-02-08 18:10:24 +08:00
|
|
|
|
},
|
|
|
|
|
|
}
|
|
|
|
|
|
}
|
2024-02-15 14:53:34 +08:00
|
|
|
|
}]
|
|
|
|
|
|
//series: oneNameData
|
2024-02-08 18:10:24 +08:00
|
|
|
|
};
|
2024-02-15 14:53:34 +08:00
|
|
|
|
//for (var i = 0; i < option.series.length; i++) {
|
|
|
|
|
|
// var style = { //定义柱状图的样式
|
|
|
|
|
|
// type: 'bar',
|
|
|
|
|
|
// barWidth: 20,
|
|
|
|
|
|
// normal: {
|
|
|
|
|
|
// label: {
|
|
|
|
|
|
// show: true,
|
|
|
|
|
|
// position: 'inside', //柱子下显示 数值
|
|
|
|
|
|
// interval: 0,
|
|
|
|
|
|
// rotate: -90,
|
|
|
|
|
|
// formatter: function (params) {
|
|
|
|
|
|
// if (params.value > 0) {
|
|
|
|
|
|
// return params.value + '%';
|
|
|
|
|
|
// } else {
|
|
|
|
|
|
// return ' ';
|
|
|
|
|
|
// }
|
|
|
|
|
|
// },
|
|
|
|
|
|
// }
|
|
|
|
|
|
// }
|
|
|
|
|
|
// };
|
|
|
|
|
|
// option.series[i].type = 'bar'; //每条数据指定类型为'bar'
|
|
|
|
|
|
// option.series[i].itemStyle = style; // series中每条数据都加的样式
|
|
|
|
|
|
// option.series[i].data = [bar_data[i]]; //series 中 data赋值
|
|
|
|
|
|
//};
|
2024-02-08 18:10:24 +08:00
|
|
|
|
chart.setOption(option);
|
|
|
|
|
|
|
2024-02-15 14:53:34 +08:00
|
|
|
|
|
2024-02-08 18:10:24 +08:00
|
|
|
|
var twoDataStr = '<%=twoDataStr%>';
|
|
|
|
|
|
var towData = JSON.parse(twoDataStr);
|
|
|
|
|
|
var data = towData.map((item, index) => item.Rate);
|
|
|
|
|
|
var chart1 = echarts.init(document.getElementById('two'));
|
|
|
|
|
|
var barWidth = 20;
|
|
|
|
|
|
var maxNum = 100;
|
|
|
|
|
|
option = {
|
|
|
|
|
|
grid: {
|
|
|
|
|
|
top: '10%',
|
|
|
|
|
|
left: '20%',
|
|
|
|
|
|
right: '10%',
|
|
|
|
|
|
bottom: '0%',
|
|
|
|
|
|
},
|
|
|
|
|
|
title: {
|
|
|
|
|
|
text: '试车进度信息',
|
|
|
|
|
|
textStyle: {
|
|
|
|
|
|
color: '#fff',
|
|
|
|
|
|
fontWeight: 'normal',
|
|
|
|
|
|
fontSize: 16
|
|
|
|
|
|
},
|
|
|
|
|
|
},
|
|
|
|
|
|
xAxis: {
|
|
|
|
|
|
show: false,
|
|
|
|
|
|
},
|
|
|
|
|
|
yAxis: {
|
|
|
|
|
|
data: towData.map((item, index) => item.Name),
|
|
|
|
|
|
splitLine: {
|
|
|
|
|
|
show: false,
|
|
|
|
|
|
},
|
|
|
|
|
|
axisLabel: {
|
|
|
|
|
|
textStyle: { fontSize: '80%', color: '#02afff' },
|
|
|
|
|
|
},
|
|
|
|
|
|
axisLine: {
|
|
|
|
|
|
show: false,
|
|
|
|
|
|
},
|
|
|
|
|
|
axisTick: false,
|
|
|
|
|
|
},
|
|
|
|
|
|
series: [
|
|
|
|
|
|
{
|
|
|
|
|
|
type: 'bar',
|
|
|
|
|
|
barWidth: barWidth,
|
|
|
|
|
|
zlevel: 2,
|
|
|
|
|
|
data: data.map(function (item) {
|
|
|
|
|
|
return {
|
|
|
|
|
|
value: item,
|
|
|
|
|
|
maxNum: maxNum,
|
|
|
|
|
|
};
|
|
|
|
|
|
}),
|
|
|
|
|
|
label: {
|
|
|
|
|
|
show: true,
|
|
|
|
|
|
position: 'inside',
|
|
|
|
|
|
align: 'left',
|
|
|
|
|
|
formatter: function (params) {
|
|
|
|
|
|
var percent = Number((params.data.value / params.data.maxNum) * 100).toFixed(2) + '%';
|
|
|
|
|
|
return percent;
|
|
|
|
|
|
},
|
|
|
|
|
|
color: '#fff',
|
|
|
|
|
|
fontSize: 12,
|
|
|
|
|
|
},
|
|
|
|
|
|
itemStyle: {
|
|
|
|
|
|
borderRadius: 10,
|
|
|
|
|
|
color: new echarts.graphic.LinearGradient(0, 1, 1, 1, [
|
|
|
|
|
|
{ offset: 0, color: '#395CFE' },
|
|
|
|
|
|
{ offset: 1, color: '#2EC7CF' },
|
|
|
|
|
|
]),
|
|
|
|
|
|
},
|
|
|
|
|
|
},
|
|
|
|
|
|
{
|
|
|
|
|
|
type: 'bar',
|
|
|
|
|
|
barWidth: barWidth,
|
|
|
|
|
|
barGap: '-100%',
|
|
|
|
|
|
data: data.map(function (item) {
|
|
|
|
|
|
return {
|
|
|
|
|
|
realValue: item,
|
|
|
|
|
|
value: maxNum,
|
|
|
|
|
|
};
|
|
|
|
|
|
}),
|
|
|
|
|
|
//label: {
|
|
|
|
|
|
// show: true,
|
|
|
|
|
|
// position: 'right',
|
|
|
|
|
|
// distance: 80,
|
|
|
|
|
|
// align: 'right',
|
|
|
|
|
|
// //formatter: function (params) {
|
|
|
|
|
|
// // return params.data.realValue + ' 件';
|
|
|
|
|
|
// //},
|
|
|
|
|
|
// color: '#02afff',
|
|
|
|
|
|
// fontSize: 18,
|
|
|
|
|
|
//},
|
|
|
|
|
|
itemStyle: {
|
|
|
|
|
|
borderRadius: 10,
|
|
|
|
|
|
color: 'rgba(3,169,244, 0.5)',
|
|
|
|
|
|
},
|
|
|
|
|
|
},
|
|
|
|
|
|
],
|
|
|
|
|
|
};
|
|
|
|
|
|
chart1.setOption(option);
|
|
|
|
|
|
|
|
|
|
|
|
</script>
|
|
|
|
|
|
|
|
|
|
|
|
<%--<script type="text/javascript">
|
2021-04-30 10:28:37 +08:00
|
|
|
|
function category_One(id, xArr, data) {
|
|
|
|
|
|
// 基于准备好的dom，初始化echarts实例
|
|
|
|
|
|
var myChart = echarts.init(document.getElementById(id))
|
|
|
|
|
|
// 指定图表的配置项和数据
|
|
|
|
|
|
var option = {
|
|
|
|
|
|
title: {
|
|
|
|
|
|
// left:'center',
|
|
|
|
|
|
text: '质量验收一次合格率 施工资料同步率',
|
|
|
|
|
|
textStyle: {
|
|
|
|
|
|
color: '#fff',
|
|
|
|
|
|
fontWeight: 'normal',
|
|
|
|
|
|
fontSize:16
|
|
|
|
|
|
},
|
|
|
|
|
|
show: true
|
|
|
|
|
|
},
|
|
|
|
|
|
tooltip: {},
|
|
|
|
|
|
legend: {
|
|
|
|
|
|
//data: ['销量'],
|
|
|
|
|
|
show: false
|
|
|
|
|
|
},
|
|
|
|
|
|
xAxis: {
|
|
|
|
|
|
axisTick: {
|
|
|
|
|
|
show: false
|
|
|
|
|
|
},
|
|
|
|
|
|
axisLine: {
|
|
|
|
|
|
lineStyle: {
|
|
|
|
|
|
color: 'rgba(255, 255, 255, 0.3)'
|
|
|
|
|
|
}
|
|
|
|
|
|
},
|
|
|
|
|
|
axisLabel: {
|
|
|
|
|
|
show: true,
|
|
|
|
|
|
textStyle: {
|
|
|
|
|
|
color: 'rgba(255, 255, 255, 0.8)'
|
|
|
|
|
|
}
|
|
|
|
|
|
},
|
|
|
|
|
|
type: 'category',
|
|
|
|
|
|
data: xArr,
|
|
|
|
|
|
boundaryGap: [0, 0.01],
|
|
|
|
|
|
},
|
|
|
|
|
|
yAxis: {
|
|
|
|
|
|
axisTick: {
|
|
|
|
|
|
show: false
|
|
|
|
|
|
},
|
|
|
|
|
|
axisLine: {
|
|
|
|
|
|
lineStyle: {
|
|
|
|
|
|
color: 'rgba(255, 255, 255, 0.3)'
|
|
|
|
|
|
}
|
|
|
|
|
|
},
|
|
|
|
|
|
axisLabel: {
|
|
|
|
|
|
show: true,
|
|
|
|
|
|
textStyle: {
|
|
|
|
|
|
color: 'rgba(255, 255, 255, 0.8)'
|
|
|
|
|
|
},
|
|
|
|
|
|
formatter: function (value, index) {
|
|
|
|
|
|
return (value * 100) + "%";
|
|
|
|
|
|
}
|
|
|
|
|
|
}
|
|
|
|
|
|
},
|
|
|
|
|
|
series: data,
|
|
|
|
|
|
grid: {
|
|
|
|
|
|
top: '25%',
|
|
|
|
|
|
left: '0%',
|
|
|
|
|
|
right: '0%',
|
|
|
|
|
|
bottom: '0%',
|
|
|
|
|
|
containLabel: true,
|
|
|
|
|
|
backgroundColor: 'rgba(0,162,233, 0.01)',
|
|
|
|
|
|
// borderColor: 'rgba(0,162,233, 1)'
|
|
|
|
|
|
},
|
|
|
|
|
|
backgroundColor: 'rgba(0,162,233, 0.01)',
|
|
|
|
|
|
textStyle: {
|
|
|
|
|
|
color: 'rgba(255, 255, 255, 0.3)'
|
|
|
|
|
|
}
|
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
|
|
// 使用刚指定的配置项和数据显示图表。
|
|
|
|
|
|
myChart.setOption(option)
|
|
|
|
|
|
}
|
|
|
|
|
|
var xArr = ["分包一", "分包二"]
|
|
|
|
|
|
var data = [
|
|
|
|
|
|
{
|
|
|
|
|
|
name: '质量一次性合格率',
|
|
|
|
|
|
type: 'bar',
|
|
|
|
|
|
data: [0.85, 0.82],
|
|
|
|
|
|
//itemStyle: { normal: { color: 'rgba(231,236,114,.9)' } }
|
|
|
|
|
|
},
|
|
|
|
|
|
{
|
|
|
|
|
|
name: '施工资料同步率',
|
|
|
|
|
|
type: 'bar',
|
|
|
|
|
|
data: [0.69, 0.65],
|
|
|
|
|
|
//itemStyle: { normal: { color: 'rgba(200,201,10, 1)' } }
|
|
|
|
|
|
}
|
|
|
|
|
|
]
|
|
|
|
|
|
category_One('one', xArr, data)
|
|
|
|
|
|
</script>
|
|
|
|
|
|
<script type="text/javascript">
|
|
|
|
|
|
function category_Two(id, xArr, data) {
|
|
|
|
|
|
// 基于准备好的dom，初始化echarts实例
|
|
|
|
|
|
var myChart = echarts.init(document.getElementById(id))
|
|
|
|
|
|
// 指定图表的配置项和数据
|
|
|
|
|
|
var option = {
|
|
|
|
|
|
title: {
|
|
|
|
|
|
// left:'center',
|
|
|
|
|
|
text: '施工进度',
|
|
|
|
|
|
textStyle: {
|
|
|
|
|
|
color: '#fff',
|
|
|
|
|
|
fontWeight: 'normal',
|
|
|
|
|
|
fontSize:16
|
|
|
|
|
|
},
|
|
|
|
|
|
show: true
|
|
|
|
|
|
},
|
|
|
|
|
|
tooltip: {},
|
|
|
|
|
|
legend: {
|
|
|
|
|
|
//data: ['销量'],
|
|
|
|
|
|
show: false
|
|
|
|
|
|
},
|
|
|
|
|
|
xAxis: {
|
|
|
|
|
|
axisTick: {
|
|
|
|
|
|
show: false
|
|
|
|
|
|
},
|
|
|
|
|
|
axisLine: {
|
|
|
|
|
|
lineStyle: {
|
|
|
|
|
|
color: 'rgba(255, 255, 255, 0.3)'
|
|
|
|
|
|
}
|
|
|
|
|
|
},
|
|
|
|
|
|
axisLabel: {
|
|
|
|
|
|
show: true,
|
|
|
|
|
|
textStyle: {
|
|
|
|
|
|
color: 'rgba(255, 255, 255, 0.8)'
|
|
|
|
|
|
}
|
|
|
|
|
|
},
|
|
|
|
|
|
type: 'category',
|
|
|
|
|
|
data: xArr,
|
|
|
|
|
|
boundaryGap: [0, 0.01],
|
|
|
|
|
|
},
|
|
|
|
|
|
yAxis: {
|
|
|
|
|
|
axisTick: {
|
|
|
|
|
|
show: false
|
|
|
|
|
|
},
|
|
|
|
|
|
axisLine: {
|
|
|
|
|
|
lineStyle: {
|
|
|
|
|
|
color: 'rgba(255, 255, 255, 0.3)'
|
|
|
|
|
|
}
|
|
|
|
|
|
},
|
|
|
|
|
|
axisLabel: {
|
|
|
|
|
|
show: true,
|
|
|
|
|
|
textStyle: {
|
|
|
|
|
|
color: 'rgba(255, 255, 255, 0.8)'
|
|
|
|
|
|
},
|
|
|
|
|
|
formatter: function (value, index) {
|
|
|
|
|
|
return (value * 100) + "%";
|
|
|
|
|
|
}
|
|
|
|
|
|
}
|
|
|
|
|
|
},
|
|
|
|
|
|
series: data,
|
|
|
|
|
|
grid: {
|
|
|
|
|
|
top: '25%',
|
|
|
|
|
|
left: '0%',
|
|
|
|
|
|
right: '0%',
|
|
|
|
|
|
bottom: '0%',
|
|
|
|
|
|
containLabel: true,
|
|
|
|
|
|
backgroundColor: 'rgba(0,162,233, 0.01)',
|
|
|
|
|
|
// borderColor: 'rgba(0,162,233, 1)'
|
|
|
|
|
|
},
|
|
|
|
|
|
backgroundColor: 'rgba(0,162,233, 0.01)',
|
|
|
|
|
|
textStyle: {
|
|
|
|
|
|
color: 'rgba(255, 255, 255, 0.3)'
|
|
|
|
|
|
}
|
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
|
|
// 使用刚指定的配置项和数据显示图表。
|
|
|
|
|
|
myChart.setOption(option)
|
|
|
|
|
|
}
|
|
|
|
|
|
var xArr = ["分包一", "分包二", "分包三"]
|
|
|
|
|
|
var data = [
|
|
|
|
|
|
{
|
|
|
|
|
|
name: '计划值',
|
|
|
|
|
|
type: 'bar',
|
|
|
|
|
|
data: [0.23, 0.35, 0.42],
|
|
|
|
|
|
//itemStyle: { normal: { color: 'rgba(200,201,10, 1)' } }
|
|
|
|
|
|
},
|
|
|
|
|
|
{
|
|
|
|
|
|
name: '实际值',
|
|
|
|
|
|
type: 'bar',
|
|
|
|
|
|
data: [0.2, 0.28, 0.35],
|
|
|
|
|
|
//itemStyle: { normal: { color: 'rgba(231,236,114,.9)' } }
|
|
|
|
|
|
},
|
|
|
|
|
|
{
|
|
|
|
|
|
name: '累计计划值',
|
|
|
|
|
|
type: 'line',
|
|
|
|
|
|
smooth: true,
|
|
|
|
|
|
data: [0.23, 0.58, 1],
|
|
|
|
|
|
//itemStyle: { normal: { color: 'rgba(200,201,10, 1)' } }
|
|
|
|
|
|
},
|
|
|
|
|
|
{
|
|
|
|
|
|
name: '累计实际值',
|
|
|
|
|
|
type: 'line',
|
|
|
|
|
|
smooth: true,
|
|
|
|
|
|
data: [0.2, 0.48, 0.83],
|
|
|
|
|
|
//itemStyle: { normal: { color: 'rgba(200,201,10, 1)' } }
|
|
|
|
|
|
}
|
|
|
|
|
|
]
|
|
|
|
|
|
category_Two('two', xArr, data)
|
|
|
|
|
|
</script>
|
|
|
|
|
|
<script type="text/javascript">
|
|
|
|
|
|
function category(id, xArr, data) {
|
|
|
|
|
|
// 基于准备好的dom，初始化echarts实例
|
|
|
|
|
|
var myChart = echarts.init(document.getElementById(id))
|
|
|
|
|
|
// 指定图表的配置项和数据
|
|
|
|
|
|
var option = {
|
|
|
|
|
|
title: {
|
|
|
|
|
|
// left:'center',
|
|
|
|
|
|
text: '设计变更',
|
|
|
|
|
|
textStyle: {
|
|
|
|
|
|
color: '#fff',
|
|
|
|
|
|
fontWeight: 'normal',
|
|
|
|
|
|
fontSize:16
|
|
|
|
|
|
},
|
|
|
|
|
|
show: true
|
|
|
|
|
|
},
|
|
|
|
|
|
tooltip: {},
|
|
|
|
|
|
legend: {
|
|
|
|
|
|
//data: ['销量'],
|
|
|
|
|
|
show: false
|
|
|
|
|
|
},
|
|
|
|
|
|
xAxis: {
|
|
|
|
|
|
axisTick: {
|
|
|
|
|
|
show: false
|
|
|
|
|
|
},
|
|
|
|
|
|
axisLine: {
|
|
|
|
|
|
lineStyle: {
|
|
|
|
|
|
color: 'rgba(255, 255, 255, 0.3)'
|
|
|
|
|
|
}
|
|
|
|
|
|
},
|
|
|
|
|
|
axisLabel: {
|
|
|
|
|
|
show: true,
|
|
|
|
|
|
textStyle: {
|
|
|
|
|
|
color: 'rgba(255, 255, 255, 0.8)'
|
|
|
|
|
|
}
|
|
|
|
|
|
},
|
|
|
|
|
|
type: 'category',
|
|
|
|
|
|
data: xArr
|
|
|
|
|
|
},
|
|
|
|
|
|
yAxis: {
|
|
|
|
|
|
axisTick: {
|
|
|
|
|
|
show: false
|
|
|
|
|
|
},
|
|
|
|
|
|
axisLine: {
|
|
|
|
|
|
lineStyle: {
|
|
|
|
|
|
color: 'rgba(255, 255, 255, 0.3)'
|
|
|
|
|
|
}
|
|
|
|
|
|
},
|
|
|
|
|
|
axisLabel: {
|
|
|
|
|
|
show: true,
|
|
|
|
|
|
textStyle: {
|
|
|
|
|
|
color: 'rgba(255, 255, 255, 0.8)'
|
|
|
|
|
|
}
|
|
|
|
|
|
}
|
|
|
|
|
|
},
|
|
|
|
|
|
series: [{
|
|
|
|
|
|
name: '数量',
|
|
|
|
|
|
type: 'bar',
|
|
|
|
|
|
data: data
|
|
|
|
|
|
}],
|
|
|
|
|
|
grid: {
|
|
|
|
|
|
top: '25%',
|
|
|
|
|
|
left: '0%',
|
|
|
|
|
|
right: '0%',
|
|
|
|
|
|
bottom: '0%',
|
|
|
|
|
|
containLabel: true,
|
|
|
|
|
|
backgroundColor: 'rgba(0,162,233, 0.01)',
|
|
|
|
|
|
// borderColor: 'rgba(0,162,233, 1)'
|
|
|
|
|
|
},
|
|
|
|
|
|
itemStyle: {
|
|
|
|
|
|
color: 'rgba(200,201,10, 1)'
|
|
|
|
|
|
},
|
|
|
|
|
|
backgroundColor: 'rgba(0,162,233, 0.01)',
|
|
|
|
|
|
textStyle: {
|
|
|
|
|
|
color: 'rgba(255, 255, 255, 0.3)'
|
|
|
|
|
|
}
|
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
|
|
// 使用刚指定的配置项和数据显示图表。
|
|
|
|
|
|
myChart.setOption(option)
|
|
|
|
|
|
}
|
|
|
|
|
|
var xArr = ["主项1", "主项2", "主项3", "主项4", "主项5", "主项6"]
|
|
|
|
|
|
var data = [12, 5, 28, 43, 22, 11]
|
|
|
|
|
|
category('four', xArr, data)
|
|
|
|
|
|
</script>
|
|
|
|
|
|
<script>
|
|
|
|
|
|
function pie(id, data) {
|
|
|
|
|
|
var myChartPie = echarts.init(document.getElementById(id));
|
|
|
|
|
|
|
|
|
|
|
|
optionPie = {
|
|
|
|
|
|
title: {
|
|
|
|
|
|
text: '质量问题',
|
|
|
|
|
|
textStyle: {
|
|
|
|
|
|
// fontSize:14,
|
|
|
|
|
|
fontWeight: 'normal',
|
|
|
|
|
|
fontSize:16,
|
|
|
|
|
|
color: '#fff'
|
|
|
|
|
|
|
|
|
|
|
|
}
|
|
|
|
|
|
, left: 0
|
|
|
|
|
|
, top: 0
|
|
|
|
|
|
},
|
|
|
|
|
|
tooltip: {
|
|
|
|
|
|
trigger: 'item',
|
|
|
|
|
|
formatter: "{a} <br/>{b}: {c} ({d}%)"
|
|
|
|
|
|
},
|
|
|
|
|
|
//legend: {
|
|
|
|
|
|
// show: false,
|
|
|
|
|
|
// data: ['已整改', '未整改'],
|
|
|
|
|
|
// color: ['#32A8FF', ' #02C800'],
|
|
|
|
|
|
// orient: 'vertical',
|
|
|
|
|
|
// x: 'right',
|
|
|
|
|
|
// y: 'top',
|
|
|
|
|
|
// textStyle: {
|
|
|
|
|
|
// color: ['#32A8FF', ' #02C800']
|
|
|
|
|
|
// }
|
|
|
|
|
|
//},
|
|
|
|
|
|
//graphic: {
|
|
|
|
|
|
// type: "text",
|
|
|
|
|
|
// left: "center",
|
|
|
|
|
|
// top: "center",
|
|
|
|
|
|
// style: {
|
|
|
|
|
|
// text: "进度80%",
|
|
|
|
|
|
// textAlign: "center",
|
|
|
|
|
|
// fill: "#fff",
|
|
|
|
|
|
// fontSize: 18,
|
|
|
|
|
|
// fontWeight: 700
|
|
|
|
|
|
// }
|
|
|
|
|
|
//},
|
|
|
|
|
|
series: [
|
|
|
|
|
|
{
|
|
|
|
|
|
name: '质量问题',
|
|
|
|
|
|
label: {
|
|
|
|
|
|
show: false
|
|
|
|
|
|
},
|
|
|
|
|
|
emphasis: {
|
|
|
|
|
|
label: {
|
|
|
|
|
|
show: true,
|
|
|
|
|
|
textStyle: {
|
|
|
|
|
|
// fontSize:14,
|
|
|
|
|
|
fontWeight: 'normal',
|
|
|
|
|
|
fontSize:16,
|
|
|
|
|
|
color: '#fff'
|
|
|
|
|
|
}
|
|
|
|
|
|
}
|
|
|
|
|
|
},
|
|
|
|
|
|
type: 'pie',
|
|
|
|
|
|
roseType: 'radius',
|
|
|
|
|
|
radius: [20, 160],
|
|
|
|
|
|
center: ['50%', '60%'],
|
|
|
|
|
|
// avoidLabelOverlap:false,
|
|
|
|
|
|
//color: ['#32A8FF', ' #02C800'],
|
|
|
|
|
|
data: data
|
|
|
|
|
|
}
|
|
|
|
|
|
]
|
|
|
|
|
|
};
|
|
|
|
|
|
//为echarts对象加载数据
|
|
|
|
|
|
myChartPie.setOption(optionPie);
|
|
|
|
|
|
}
|
|
|
|
|
|
var data = [{ value: 10, name: '分包一' },
|
|
|
|
|
|
{ value: 5, name: '分包二' },
|
|
|
|
|
|
{ value: 15, name: '分包三' },
|
|
|
|
|
|
{ value: 25, name: '分包四' },
|
|
|
|
|
|
{ value: 20, name: '分包五' },
|
|
|
|
|
|
{ value: 35, name: '分包六' }];
|
|
|
|
|
|
pie('three', data)
|
|
|
|
|
|
</script>
|
|
|
|
|
|
<script>
|
|
|
|
|
|
$(".tab .t-item").click(function () {
|
|
|
|
|
|
var $this = $(this)
|
|
|
|
|
|
var index = $this.index()
|
|
|
|
|
|
if ($this.hasClass('active') && index == 0) {
|
|
|
|
|
|
return
|
|
|
|
|
|
}
|
|
|
|
|
|
var $tab = $this.closest(".tab")
|
|
|
|
|
|
var value = $tab.attr("data-value")
|
|
|
|
|
|
$tab.find(".t-item").removeClass('active');
|
|
|
|
|
|
$this.addClass('active')
|
|
|
|
|
|
|
|
|
|
|
|
if (value == 1) {
|
|
|
|
|
|
|
|
|
|
|
|
var xArr = ["单位工程一", "单位工程二"]
|
|
|
|
|
|
var data = [
|
|
|
|
|
|
{
|
|
|
|
|
|
name: '质量一次性合格率',
|
|
|
|
|
|
type: 'bar',
|
|
|
|
|
|
data: [0.9, 0.85],
|
|
|
|
|
|
//itemStyle: { normal: { color: 'rgba(231,236,114,.9)' } }
|
|
|
|
|
|
},
|
|
|
|
|
|
{
|
|
|
|
|
|
name: '施工资料同步率',
|
|
|
|
|
|
type: 'bar',
|
|
|
|
|
|
data: [0.75, 0.65],
|
|
|
|
|
|
//itemStyle: { normal: { color: 'rgba(200,201,10, 1)' } }
|
|
|
|
|
|
}
|
|
|
|
|
|
]
|
|
|
|
|
|
if (index == 0) {
|
|
|
|
|
|
xArr = ["分包一", "分包二"]
|
|
|
|
|
|
data = [
|
|
|
|
|
|
{
|
|
|
|
|
|
name: '质量一次性合格率',
|
|
|
|
|
|
type: 'bar',
|
|
|
|
|
|
data: [0.85, 0.82],
|
|
|
|
|
|
//itemStyle: { normal: { color: 'rgba(231,236,114,.9)' } }
|
|
|
|
|
|
},
|
|
|
|
|
|
{
|
|
|
|
|
|
name: '施工资料同步率',
|
|
|
|
|
|
type: 'bar',
|
|
|
|
|
|
data: [0.69, 0.65],
|
|
|
|
|
|
//itemStyle: { normal: { color: 'rgba(200,201,10, 1)' } }
|
|
|
|
|
|
}
|
|
|
|
|
|
]
|
|
|
|
|
|
} else if (index == 4) {
|
|
|
|
|
|
xArr = ["建筑", "安装"]
|
|
|
|
|
|
data = [
|
|
|
|
|
|
{
|
|
|
|
|
|
name: '质量一次性合格率',
|
|
|
|
|
|
type: 'bar',
|
|
|
|
|
|
data: [0.83, 0.78],
|
|
|
|
|
|
//itemStyle: { normal: { color: 'rgba(231,236,114,.9)' } }
|
|
|
|
|
|
},
|
|
|
|
|
|
{
|
|
|
|
|
|
name: '施工资料同步率',
|
|
|
|
|
|
type: 'bar',
|
|
|
|
|
|
data: [0.64, 0.61],
|
|
|
|
|
|
//itemStyle: { normal: { color: 'rgba(200,201,10, 1)' } }
|
|
|
|
|
|
}
|
|
|
|
|
|
]
|
|
|
|
|
|
}
|
|
|
|
|
|
category_One('one', xArr, data)
|
|
|
|
|
|
}
|
|
|
|
|
|
else if (value == 2) {
|
|
|
|
|
|
var xArr = ["分包一", "分包二", "分包三"]
|
|
|
|
|
|
var data = [
|
|
|
|
|
|
{
|
|
|
|
|
|
name: '计划值',
|
|
|
|
|
|
type: 'bar',
|
|
|
|
|
|
data: [0.23, 0.35, 0.42],
|
|
|
|
|
|
//itemStyle: { normal: { color: 'rgba(200,201,10, 1)' } }
|
|
|
|
|
|
},
|
|
|
|
|
|
{
|
|
|
|
|
|
name: '实际值',
|
|
|
|
|
|
type: 'bar',
|
|
|
|
|
|
data: [0.2, 0.28, 0.35],
|
|
|
|
|
|
//itemStyle: { normal: { color: 'rgba(231,236,114,.9)' } }
|
|
|
|
|
|
},
|
|
|
|
|
|
{
|
|
|
|
|
|
name: '累计计划值',
|
|
|
|
|
|
type: 'line',
|
|
|
|
|
|
smooth: true,
|
|
|
|
|
|
data: [0.23, 0.58, 1],
|
|
|
|
|
|
//itemStyle: { normal: { color: 'rgba(200,201,10, 1)' } }
|
|
|
|
|
|
},
|
|
|
|
|
|
{
|
|
|
|
|
|
name: '累计实际值',
|
|
|
|
|
|
type: 'line',
|
|
|
|
|
|
smooth: true,
|
|
|
|
|
|
data: [0.2, 0.48, 0.83],
|
|
|
|
|
|
//itemStyle: { normal: { color: 'rgba(200,201,10, 1)' } }
|
|
|
|
|
|
}
|
|
|
|
|
|
]
|
|
|
|
|
|
if (index == 2) {
|
|
|
|
|
|
xArr = ["单位工程一", "单位工程二", "单位工程三"]
|
|
|
|
|
|
data = [
|
|
|
|
|
|
{
|
|
|
|
|
|
name: '计划值',
|
|
|
|
|
|
type: 'bar',
|
|
|
|
|
|
data: [0.20, 0.33, 0.47],
|
|
|
|
|
|
//itemStyle: { normal: { color: 'rgba(200,201,10, 1)' } }
|
|
|
|
|
|
},
|
|
|
|
|
|
{
|
|
|
|
|
|
name: '实际值',
|
|
|
|
|
|
type: 'bar',
|
|
|
|
|
|
data: [0.15, 0.25, 0.33],
|
|
|
|
|
|
//itemStyle: { normal: { color: 'rgba(231,236,114,.9)' } }
|
|
|
|
|
|
},
|
|
|
|
|
|
{
|
|
|
|
|
|
name: '累计计划值',
|
|
|
|
|
|
type: 'line',
|
|
|
|
|
|
smooth: true,
|
|
|
|
|
|
data: [0.20, 0.53, 1],
|
|
|
|
|
|
//itemStyle: { normal: { color: 'rgba(200,201,10, 1)' } }
|
|
|
|
|
|
},
|
|
|
|
|
|
{
|
|
|
|
|
|
name: '累计实际值',
|
|
|
|
|
|
type: 'line',
|
|
|
|
|
|
smooth: true,
|
|
|
|
|
|
data: [0.15, 0.4, 0.73],
|
|
|
|
|
|
//itemStyle: { normal: { color: 'rgba(200,201,10, 1)' } }
|
|
|
|
|
|
}
|
|
|
|
|
|
]
|
|
|
|
|
|
}
|
|
|
|
|
|
else if (index == 4) {
|
|
|
|
|
|
xArr = ["建筑", "安装"]
|
|
|
|
|
|
data = [
|
|
|
|
|
|
{
|
|
|
|
|
|
name: '计划值',
|
|
|
|
|
|
type: 'bar',
|
|
|
|
|
|
data: [0.45, 0.55],
|
|
|
|
|
|
//itemStyle: { normal: { color: 'rgba(200,201,10, 1)' } }
|
|
|
|
|
|
},
|
|
|
|
|
|
{
|
|
|
|
|
|
name: '实际值',
|
|
|
|
|
|
type: 'bar',
|
|
|
|
|
|
data: [0.36, 0.43],
|
|
|
|
|
|
//itemStyle: { normal: { color: 'rgba(231,236,114,.9)' } }
|
|
|
|
|
|
},
|
|
|
|
|
|
{
|
|
|
|
|
|
name: '累计计划值',
|
|
|
|
|
|
type: 'line',
|
|
|
|
|
|
smooth: true,
|
|
|
|
|
|
data: [0.45, 1],
|
|
|
|
|
|
//itemStyle: { normal: { color: 'rgba(200,201,10, 1)' } }
|
|
|
|
|
|
},
|
|
|
|
|
|
{
|
|
|
|
|
|
name: '累计实际值',
|
|
|
|
|
|
type: 'line',
|
|
|
|
|
|
smooth: true,
|
|
|
|
|
|
data: [0.36, 0.79],
|
|
|
|
|
|
//itemStyle: { normal: { color: 'rgba(200,201,10, 1)' } }
|
|
|
|
|
|
}
|
|
|
|
|
|
]
|
|
|
|
|
|
}
|
|
|
|
|
|
category_Two('two', xArr, data)
|
|
|
|
|
|
}
|
|
|
|
|
|
else if (value == 3) {
|
|
|
|
|
|
var data = [{ value: 10, name: '分包一' },
|
|
|
|
|
|
{ value: 5, name: '分包二' },
|
|
|
|
|
|
{ value: 15, name: '分包三' },
|
|
|
|
|
|
{ value: 25, name: '分包四' },
|
|
|
|
|
|
{ value: 20, name: '分包五' },
|
|
|
|
|
|
{ value: 35, name: '分包六' }];
|
|
|
|
|
|
if (index == 2) {
|
|
|
|
|
|
data = [{ value: 25, name: '单位工程一' },
|
|
|
|
|
|
{ value: 35, name: '单位工程二' },
|
|
|
|
|
|
{ value: 30, name: '单位工程三' }];
|
|
|
|
|
|
}
|
|
|
|
|
|
else if (index == 4) {
|
|
|
|
|
|
data = [{ value: 45, name: '建筑' },
|
|
|
|
|
|
{ value: 55, name: '安装' }];
|
|
|
|
|
|
}
|
|
|
|
|
|
else if (index == 6) {
|
|
|
|
|
|
data = [{ value: 35, name: '质量不合格' },
|
|
|
|
|
|
{ value: 65, name: '质量缺陷' }];
|
|
|
|
|
|
}
|
|
|
|
|
|
pie('three', data)
|
|
|
|
|
|
}
|
|
|
|
|
|
else if (value == 4) {
|
|
|
|
|
|
var xArr = ["主项一", "主项二", "主项三", "主项四", "主项五"]
|
|
|
|
|
|
var data = [12, 5, 28, 43, 22]
|
|
|
|
|
|
if (index == 2) {
|
|
|
|
|
|
xArr = ["建筑", "安装"]
|
|
|
|
|
|
data = [45, 65]
|
|
|
|
|
|
}
|
|
|
|
|
|
category('four', xArr, data)
|
|
|
|
|
|
}
|
|
|
|
|
|
})
|
|
|
|
|
|
</script>
|
|
|
|
|
|
<script>
|
|
|
|
|
|
var mySwiper = new Swiper('#swiper1', {
|
|
|
|
|
|
autoplay: 3000,//可选选项，自动滑动
|
|
|
|
|
|
direction: 'vertical',
|
|
|
|
|
|
loop: true,
|
|
|
|
|
|
slidesPerView: 6
|
|
|
|
|
|
})
|
|
|
|
|
|
|
|
|
|
|
|
var mySwiper = new Swiper('#swiper2', {
|
|
|
|
|
|
autoplay: 4000,//可选选项，自动滑动
|
|
|
|
|
|
direction: 'vertical',
|
|
|
|
|
|
loop: true,
|
|
|
|
|
|
slidesPerView: 6
|
|
|
|
|
|
})
|
2024-02-08 18:10:24 +08:00
|
|
|
|
</script>--%>
|
2021-04-30 10:28:37 +08:00
|
|
|
|
</html>
|
|
|
|
|
|
|
