first commit
This commit is contained in:
583
WebRoot/jsp/efficiency/constituteView.jsp
Normal file
583
WebRoot/jsp/efficiency/constituteView.jsp
Normal file
@ -0,0 +1,583 @@
|
||||
<%@ page language="java" pageEncoding="UTF-8" %>
|
||||
<%@ taglib uri="http://java.sun.com/jstl/core_rt" prefix="c" %>
|
||||
<%@ taglib uri="http://java.sun.com/jsp/jstl/functions" prefix="fn" %>
|
||||
<%@ taglib uri="http://java.sun.com/jsp/jstl/fmt" prefix="fmt" %>
|
||||
<%@ page import="com.sipai.entity.base.ServerObject" %>
|
||||
<%@ taglib uri="http://www.springsecurity.org/jsp" prefix="security" %>
|
||||
<%@page import="com.sipai.entity.scada.MPoint" %>
|
||||
<%request.setAttribute("Flag_Enable", MPoint.Flag_Enable);%>
|
||||
<%request.setAttribute("Flag_Disable", MPoint.Flag_Disable);%>
|
||||
<!DOCTYPE html>
|
||||
<!-- <html lang="zh-CN"> -->
|
||||
<!-- BEGIN HEAD -->
|
||||
<head>
|
||||
<title><%= ServerObject.atttable.get("TOPTITLE")%>
|
||||
</title>
|
||||
|
||||
<!-- 引用页头及CSS页-->
|
||||
<jsp:include page="/jsp/inc.jsp"></jsp:include>
|
||||
<!-- echarts-->
|
||||
<script type="text/javascript" src="<%=request.getContextPath()%>/plugins/echarts/echarts.4.1.0.min.js"
|
||||
charset="utf-8"></script>
|
||||
<!-- 引入daterangepicker-->
|
||||
<link rel="stylesheet" href="<%=request.getContextPath()%>/plugins/bootstrap-daterangepicker/daterangepicker.css"/>
|
||||
<script type="text/javascript" src="<%=request.getContextPath()%>/plugins/bootstrap-daterangepicker/moment.min.js"
|
||||
charset="utf-8"></script>
|
||||
<script type="text/javascript"
|
||||
src="<%=request.getContextPath()%>/plugins/bootstrap-daterangepicker/daterangepicker.js"
|
||||
charset="utf-8"></script>
|
||||
<!-- bootstrap switch -->
|
||||
<link rel="stylesheet"
|
||||
href="<%=request.getContextPath()%>/node_modules/bootstrap-switch/dist/css/bootstrap3/bootstrap-switch.min.css"/>
|
||||
<script type="text/javascript"
|
||||
src="<%=request.getContextPath()%>/node_modules/bootstrap-switch/dist/js/bootstrap-switch.min.js"
|
||||
charset="utf-8"></script>
|
||||
|
||||
<script type="text/javascript">
|
||||
var beginTimeStore = '';
|
||||
var endTimeStore = '';
|
||||
$(function () {
|
||||
|
||||
var tree = false;
|
||||
|
||||
//判断是否有配置
|
||||
$.post(ext.contextPath + '/efficiency/constituteConfigureScheme/getTreeJson.do', {
|
||||
unitId: unitId
|
||||
}, function (result) {
|
||||
console.log(result)
|
||||
if (result.length > 0) {
|
||||
document.getElementById('closeImage').style.display = 'block'
|
||||
document.getElementById('openImage').style.display = 'none'
|
||||
|
||||
var windowghight = $(window).height();
|
||||
$('#mainDiv').attr("style", "height:" + windowghight + "px;width:100%;padding-top:20px;");
|
||||
|
||||
beginTimeStore = moment().subtract(30, 'days').format('YYYY-MM-DD HH:mm');
|
||||
endTimeStore = moment().subtract(0, 'days').format('YYYY-MM-DD HH:mm');
|
||||
|
||||
var locale = {
|
||||
"format": 'YYYY-MM-DD HH:mm',
|
||||
"separator": "~",
|
||||
"applyLabel": "确定",
|
||||
"cancelLabel": "取消",
|
||||
"fromLabel": "起始时间",
|
||||
"toLabel": "结束时间'",
|
||||
"customRangeLabel": "自定义",
|
||||
"weekLabel": "W",
|
||||
"daysOfWeek": ["日", "一", "二", "三", "四", "五", "六"],
|
||||
"monthNames": ["一月", "二月", "三月", "四月", "五月", "六月", "七月", "八月", "九月", "十月", "十一月", "十二月"],
|
||||
"firstDay": 1
|
||||
};
|
||||
$('#reservationtime').daterangepicker({
|
||||
timePicker: false,
|
||||
timePicker24Hour: false,
|
||||
linkedCalendars: false,
|
||||
autoUpdateInput: false,
|
||||
showDropdowns: true,
|
||||
locale: locale,
|
||||
//汉化按钮部分
|
||||
ranges: {
|
||||
'本月': [moment().startOf('month'), moment().endOf('month').subtract(0, 'month')],
|
||||
'上月': [moment().subtract(1, 'month').startOf('month'), moment().subtract(1, 'month').endOf('month').subtract(0, 'month')]
|
||||
},
|
||||
startDate: beginTimeStore,
|
||||
endDate: endTimeStore
|
||||
}, function (start, end, label) {
|
||||
beginTimeStore = start.format(this.locale.format);
|
||||
endTimeStore = end.format(this.locale.format);
|
||||
if (!this.startDate) {
|
||||
this.element.val('');
|
||||
} else {
|
||||
this.element.val(this.startDate.format(this.locale.format) + this.locale.separator + this.endDate.format(this.locale.format));
|
||||
}
|
||||
// dosearch();
|
||||
});
|
||||
$('#reservationtime').val(beginTimeStore + locale.separator + endTimeStore);
|
||||
|
||||
|
||||
$("#schemeTree").empty();
|
||||
var selelct_ = $("#schemeTree").select2({
|
||||
data: result,
|
||||
cache: false,
|
||||
placeholder: '请选择',//默认文字提示
|
||||
allowClear: false,//允许清空
|
||||
escapeMarkup: function (markup) {
|
||||
return markup;
|
||||
}, // 自定义格式化防止xss注入
|
||||
language: "zh-CN",
|
||||
minimumInputLength: 0,
|
||||
minimumResultsForSearch: 10,//数据超过十个启用搜索框
|
||||
formatResult: function formatRepo(repo) {
|
||||
return repo.text;
|
||||
}, // 函数用来渲染结果
|
||||
formatSelection: function formatRepoSelection(repo) {
|
||||
return repo.text;
|
||||
} // 函数用于呈现当前的选择
|
||||
});
|
||||
$(".select2-selection--single").css({'height': '30px', 'paddingTop': '4px'})
|
||||
selelct_.val(result[0].id).trigger("change");
|
||||
selelct_.on("change", function (e) {
|
||||
dosearch();
|
||||
});
|
||||
|
||||
dosearch();
|
||||
} else {
|
||||
document.getElementById('db').style.display = 'none'
|
||||
document.getElementById('fx').style.display = 'none'
|
||||
document.getElementById('openImage').style.display = 'block'
|
||||
document.getElementById('closeImage').style.display = 'none'
|
||||
}
|
||||
}, 'json');
|
||||
|
||||
|
||||
});
|
||||
|
||||
function dosearch() {
|
||||
dodata1();
|
||||
dochart2(0);
|
||||
}
|
||||
|
||||
|
||||
var color = [
|
||||
"#2ec7c9",
|
||||
"#b6a2de",
|
||||
"#5ab1ef",
|
||||
"#ffb980",
|
||||
"#d87a80",
|
||||
"#8d98b3",
|
||||
"#e5cf0d",
|
||||
"#97b552",
|
||||
"#95706d",
|
||||
"#dc69aa",
|
||||
"#07a2a4",
|
||||
"#9a7fd1",
|
||||
"#588dd5",
|
||||
"#f5994e",
|
||||
"#c05050",
|
||||
"#59678c",
|
||||
"#c9ab00",
|
||||
"#7eb00a",
|
||||
"#6f5553",
|
||||
"#c14089"
|
||||
];
|
||||
|
||||
var jsondata1 = ""
|
||||
|
||||
function dodata1() {
|
||||
$.post(ext.contextPath + '/efficiency/constitute/getCompanyEnergy.do', {
|
||||
unitId: unitId,
|
||||
sid:$('#schemeTree').val(),
|
||||
sdt: beginTimeStore,
|
||||
edt: endTimeStore
|
||||
}, function (result) {
|
||||
// console.log(result);
|
||||
jsondata1 = result;
|
||||
dochart1(-1);
|
||||
dotable1();
|
||||
dotable2(0);
|
||||
}, 'json');
|
||||
|
||||
}
|
||||
|
||||
let option1 = "";
|
||||
let myChart1 = "";
|
||||
|
||||
function dochart1(num) {
|
||||
var legendData = [];
|
||||
var seriesData1 = [];
|
||||
var seriesData2 = [];
|
||||
|
||||
if (num == -1) {
|
||||
for (var i = 0; i < jsondata1.length; i++) {
|
||||
legendData.push(jsondata1[i].name);
|
||||
seriesData1.push({
|
||||
value: jsondata1[i].value,
|
||||
name: jsondata1[i].name
|
||||
})
|
||||
for (var j = 0; j < jsondata1[i].children.length; j++) {
|
||||
legendData.push(jsondata1[i].children[j].name);
|
||||
seriesData2.push({
|
||||
value: jsondata1[i].children[j].value,
|
||||
name: jsondata1[i].children[j].name
|
||||
})
|
||||
}
|
||||
}
|
||||
} else {
|
||||
legendData.push(jsondata1[num].name);
|
||||
seriesData1.push({
|
||||
value: jsondata1[num].value,
|
||||
name: jsondata1[num].name
|
||||
})
|
||||
for (var j = 0; j < jsondata1[num].children.length; j++) {
|
||||
legendData.push(jsondata1[num].children[j].name);
|
||||
seriesData2.push({
|
||||
value: jsondata1[num].children[j].value,
|
||||
name: jsondata1[num].children[j].name
|
||||
})
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
myChart1 = echarts.init(document.getElementById("chart1"));
|
||||
option1 = {
|
||||
color: color,
|
||||
tooltip: {
|
||||
trigger: 'item',
|
||||
formatter: '{a} <br/>{b}: {c} ({d}%)'
|
||||
},
|
||||
legend: {
|
||||
show: true,
|
||||
type: 'scroll',
|
||||
orient: 'vertical',
|
||||
left: 10,
|
||||
data: legendData
|
||||
},
|
||||
series: [
|
||||
{
|
||||
name: '全厂能耗(kWh)',
|
||||
type: 'pie',
|
||||
selectedMode: 'single',
|
||||
center: ['55%', '50%'],
|
||||
radius: [0, '40%'],
|
||||
label: {
|
||||
normal: {
|
||||
position: 'inner'
|
||||
}
|
||||
},
|
||||
labelLine: {
|
||||
normal: {
|
||||
show: false
|
||||
}
|
||||
},
|
||||
data: seriesData1
|
||||
},
|
||||
{
|
||||
name: '全厂能耗(kWh)',
|
||||
type: 'pie',
|
||||
center: ['55%', '50%'],
|
||||
radius: ['50%', '65%'],
|
||||
// label: {
|
||||
// normal: {
|
||||
// formatter: ' {b|{b}：}\n {per|{d}%}',
|
||||
// backgroundColor: '#eee',
|
||||
// borderColor: '#aaa',
|
||||
// borderWidth: 1,
|
||||
// borderRadius: 4,
|
||||
// rich: {
|
||||
// b: {
|
||||
// fontSize: 12,
|
||||
// align: 'left',
|
||||
// lineHeight: 20
|
||||
// },
|
||||
// per: {
|
||||
// align: 'left',
|
||||
// color: '#eee',
|
||||
// backgroundColor: '#334455',
|
||||
// padding: [2, 4],
|
||||
// borderRadius: 2
|
||||
// }
|
||||
// }
|
||||
// }
|
||||
// },
|
||||
data: seriesData2
|
||||
}
|
||||
]
|
||||
};
|
||||
myChart1.setOption(option1, true);
|
||||
}
|
||||
|
||||
function dochart2(num) {
|
||||
$.post(ext.contextPath + '/efficiency/constitute/getLineData.do', {
|
||||
unitId: unitId,
|
||||
sid:$('#schemeTree').val(),
|
||||
sdt: beginTimeStore,
|
||||
edt: endTimeStore,
|
||||
num: num
|
||||
}, function (result) {
|
||||
var series = [];
|
||||
var yAxis = [];
|
||||
var legenddata = [];
|
||||
|
||||
for (var i = 0; i < result.length; i++) {
|
||||
series.push({
|
||||
data: result[i].data,
|
||||
symbol: 'none',
|
||||
name: result[i].parmname,
|
||||
type: 'line',
|
||||
lineStyle: {
|
||||
width: 2
|
||||
}
|
||||
})
|
||||
legenddata.push(result[i].parmname);
|
||||
}
|
||||
yAxis.push({
|
||||
type: 'value',
|
||||
name: false,
|
||||
splitLine: {
|
||||
show: false//是否显示分隔线。默认数值轴显示，类目轴不显示。
|
||||
},
|
||||
scale: true//设置成 true 后坐标刻度不会强制包含零刻度。
|
||||
});
|
||||
|
||||
var myChart = echarts.init(document.getElementById("chart2"));
|
||||
var option = {
|
||||
color: color,
|
||||
animation: false,
|
||||
legend: {
|
||||
type: 'scroll',
|
||||
data: legenddata,
|
||||
left: 'center'
|
||||
},
|
||||
grid: {
|
||||
left: '4%', // 与容器左侧的距离
|
||||
right: '4%', // 与容器右侧的距离
|
||||
top: '8%', // 与容器顶部的距离
|
||||
//bottom: '5%', // 与容器底部的距离
|
||||
containLabel: true
|
||||
},
|
||||
// toolbox: {
|
||||
// feature: {
|
||||
// saveAsImage: {show: true}
|
||||
// }
|
||||
// },
|
||||
xAxis: {
|
||||
type: 'time'
|
||||
},
|
||||
yAxis: yAxis,
|
||||
series: series,
|
||||
tooltip: {
|
||||
trigger: 'axis',
|
||||
formatter: function (params, ticket, callback) {
|
||||
var htmlStr = '';
|
||||
for (var i = 0; i < params.length; i++) {
|
||||
var param = params[i];
|
||||
// console.log(param);
|
||||
var xName = param.name;//x轴的名称
|
||||
var seriesName = param.seriesName;//图例名称
|
||||
var xvalue = param.value[0];//x轴值
|
||||
var yvalue = param.value[1];//y轴值
|
||||
var remarkvalue = param.value[2];//备注轴值
|
||||
var color = param.color;//图例颜色
|
||||
var dataIndex = param.dataIndex;
|
||||
var seriesIndex = param.seriesIndex;
|
||||
htmlStr += '<div>';
|
||||
if (i == 0) {
|
||||
htmlStr += xvalue + '<br/>';
|
||||
}
|
||||
htmlStr += '<span style="margin-right:5px;display:inline-block;width:10px;height:10px;border-radius:5px;background-color:' + color + ';"></span>';
|
||||
htmlStr += seriesName + ':' + yvalue + '';
|
||||
htmlStr += '</div>';
|
||||
}
|
||||
return htmlStr;
|
||||
}
|
||||
// alwaysShowContent:true,
|
||||
},
|
||||
dataZoom: [{
|
||||
type: 'inside',
|
||||
start: 0,
|
||||
end: 100
|
||||
}, {
|
||||
start: 0,
|
||||
end: 100,
|
||||
handleIcon: 'M10.7,11.9v-1.3H9.3v1.3c-4.9,0.3-8.8,4.4-8.8,9.4c0,5,3.9,9.1,8.8,9.4v1.3h1.3v-1.3c4.9-0.3,8.8-4.4,8.8-9.4C19.5,16.3,15.6,12.2,10.7,11.9z M13.3,24.4H6.7V23h6.6V24.4z M13.3,19.6H6.7v-1.4h6.6V19.6z',
|
||||
handleSize: '60%',
|
||||
height: '25px',
|
||||
handleStyle: {
|
||||
color: '#fff',
|
||||
shadowBlur: 3,
|
||||
shadowColor: 'rgba(0, 0, 0, 0.6)',
|
||||
shadowOffsetX: 2,
|
||||
shadowOffsetY: 2
|
||||
}
|
||||
}]
|
||||
};
|
||||
// console.log(option);
|
||||
myChart.setOption(option, true);
|
||||
|
||||
}, 'json');
|
||||
}
|
||||
|
||||
function dotable1() {
|
||||
var html = "";
|
||||
html += "<table style='height:100%;width: 100%;border-collapse: collapse;'>";
|
||||
html += "<tr style='width:100%;height:40px;background-color:#E3E4E6;'>";
|
||||
html += "<td align='center' style='width: 20%;border: 1px solid #e4e4e4;'>用能单位</td>";
|
||||
html += "<td align='center' style='width: 20%;border: 1px solid #e4e4e4;'>实际值</td>";
|
||||
html += "<td align='center' style='width: 20%;border: 1px solid #e4e4e4;'>基准值</td>";
|
||||
html += "<td align='center' style='width: 20%;border: 1px solid #e4e4e4;'>节约值</td>";
|
||||
html += "<td align='center' style='width: 20%;border: 1px solid #e4e4e4;'>节约率(%)</td>";
|
||||
html += "</tr>";
|
||||
for (var i = 0; i < jsondata1.length; i++) {
|
||||
var name = jsondata1[i].name;
|
||||
if(jsondata1[i].unit!=''&&jsondata1[i].unit!=null){
|
||||
name+="("+jsondata1[i].unit+")";
|
||||
}
|
||||
var value = Number(jsondata1[i].value).toFixed(2);
|
||||
var lastvalue = Number(jsondata1[i].lastvalue).toFixed(2);
|
||||
var diffvalue = 0;
|
||||
if (lastvalue > 0) {
|
||||
diffvalue = (lastvalue - value).toFixed(2);
|
||||
}
|
||||
html += "<tr style='width:100%;height:60px;cursor:pointer;' onclick='dochange(" + i + ")'>";
|
||||
html += " <td align='center' style='width: 20%;border: 1px solid #e4e4e4;'>" + name + "</td> ";
|
||||
html += " <td align='center' style='width: 20%;border: 1px solid #e4e4e4;'>" + value + "</td> ";
|
||||
html += " <td align='center' style='width: 20%;border: 1px solid #e4e4e4;'>" + lastvalue + "</td> ";
|
||||
html += " <td align='center' style='width: 20%;border: 1px solid #e4e4e4;'>" + diffvalue + "</td> ";
|
||||
let outValue = 0;
|
||||
if (lastvalue > 0) {
|
||||
outValue = (((lastvalue - value) / lastvalue) * 100).toFixed(2);
|
||||
}
|
||||
html += " <td align='center' style='width: 20%;border: 1px solid #e4e4e4;'>" + outValue + "</td> ";
|
||||
html += "</tr>";
|
||||
}
|
||||
html += "</table>";
|
||||
$('#table1').html(html);
|
||||
}
|
||||
|
||||
function dotable2(num) {
|
||||
// console.log(jsondata1);
|
||||
var html = "";
|
||||
html += "<table style='height:100%;width: 100%;border-collapse: collapse;'>";
|
||||
html += "<tr style='width:100%;height:40px;background-color:#E3E4E6;'>";
|
||||
html += "<td align='center' style='width: 20%;border: 1px solid #e4e4e4;'>用能单位</td>";
|
||||
html += "<td align='center' style='width: 20%;border: 1px solid #e4e4e4;'>实际值</td>";
|
||||
html += "<td align='center' style='width: 20%;border: 1px solid #e4e4e4;'>基准值</td>";
|
||||
html += "<td align='center' style='width: 20%;border: 1px solid #e4e4e4;'>节约值</td>";
|
||||
html += "<td align='center' style='width: 20%;border: 1px solid #e4e4e4;'>节约率(%)</td>";
|
||||
html += "</tr>";
|
||||
for (var i = 0; i < jsondata1[num].children.length; i++) {
|
||||
var name = jsondata1[num].children[i].name;
|
||||
if(jsondata1[num].children[i].unit!=''&&jsondata1[num].children[i].unit!=null){
|
||||
name+="("+jsondata1[num].children[i].unit+")";
|
||||
}
|
||||
var value = Number(jsondata1[num].children[i].value).toFixed(2);
|
||||
var lastvalue = Number(jsondata1[num].children[i].lastvalue).toFixed(2);
|
||||
var diffvalue = 0;
|
||||
if (lastvalue > 0) {
|
||||
diffvalue = (lastvalue - value).toFixed(2);
|
||||
}
|
||||
html += "<tr style='width:100%;height:60px;' >";
|
||||
html += " <td align='center' style='width: 20%;border: 1px solid #e4e4e4;cursor:pointer;' onclick='showDetail(\"" + jsondata1[num].children[i].id + "\");'>" + name + "</td> ";
|
||||
html += " <td align='center' style='width: 20%;border: 1px solid #e4e4e4;'>" + value + "</td> ";
|
||||
html += " <td align='center' style='width: 20%;border: 1px solid #e4e4e4;'>" + lastvalue + "</td> ";
|
||||
html += " <td align='center' style='width: 20%;border: 1px solid #e4e4e4;'>" + diffvalue + "</td> ";
|
||||
let outValue = 0;
|
||||
if (lastvalue > 0) {
|
||||
outValue = (((lastvalue - value) / lastvalue) * 100).toFixed(2);
|
||||
}
|
||||
html += " <td align='center' style='width: 20%;border: 1px solid #e4e4e4;'>" + outValue + "</td> ";
|
||||
html += "</tr>";
|
||||
}
|
||||
html += "</table>";
|
||||
$('#table2').html(html);
|
||||
}
|
||||
|
||||
function showDetail(id) {
|
||||
$.post(ext.contextPath + '/efficiency/constitute/getDetailDataView.do', {
|
||||
id: id,
|
||||
sdt: beginTimeStore,
|
||||
edt: endTimeStore
|
||||
}, function (data) {
|
||||
$("#detailDataDiv").html(data);
|
||||
openModal("detailDataModal");
|
||||
});
|
||||
}
|
||||
|
||||
function dochange(num) {
|
||||
dochart1(num);
|
||||
dochart2(num);
|
||||
dotable2(num);
|
||||
}
|
||||
|
||||
function changeOp2LIsHidden(obj) {
|
||||
var value = $(obj).val();
|
||||
if (value == '0') {
|
||||
option1.legend.show = true;
|
||||
} else {
|
||||
option1.legend.show = false;
|
||||
}
|
||||
|
||||
myChart1.setOption(option1, true);
|
||||
}
|
||||
</script>
|
||||
|
||||
</head>
|
||||
<body class="hold-transition ${cu.themeclass} sidebar-mini" style="overflow: hidden;">
|
||||
<div class="box box-solid">
|
||||
<div id="mainDiv" class="box-body ">
|
||||
<div id="detailDataDiv"></div>
|
||||
<div style="width: 100%;height:45px;float: left;">
|
||||
<div class="form-group form-inline" style="padding-left:10px;">
|
||||
<div class="form-group" style="height: 40px;line-height: 40px;">
|
||||
<label class="input-lable"> 方案:</label>
|
||||
<div class="input-group " style="width: 180px;">
|
||||
<select id="schemeTree" name="schemeTree" class="select2"
|
||||
style="height: 30px;padding: 0px 10px;width: 100%;">
|
||||
</select>
|
||||
</div>
|
||||
</div>
|
||||
<div class="form-group" style="height: 40px;line-height: 40px;">
|
||||
<label class="input-lable"> 日期:</label>
|
||||
<div class="input-group ">
|
||||
<div class="input-group pull-right input-group-sm">
|
||||
<div class="input-group-addon">
|
||||
<i class="fa fa-clock-o"></i>
|
||||
</div>
|
||||
<input type="text" class="form-control" id="reservationtime" style="width:225px">
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="form-group" style="height: 40px;line-height: 40px;">
|
||||
<button type="button" class="btn btn-default" onclick="dosearch();"><i class="fa fa-search"></i> 查询
|
||||
</button>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div id="openImage">
|
||||
<img style="width: 100%; height: 100%" src="<%=request.getContextPath()%>/IMG/nengxiaoBack.png"/>
|
||||
</div>
|
||||
<div id="closeImage" style="width: 100%;height:calc(100% - 45px);float: left;">
|
||||
<div id="db" style="width: 45%;height:100%;float: left;">
|
||||
<div style="width: 100%;height: 65%;float: left;border:1px solid gray;padding:5px;">
|
||||
<div style="width: 100%;height: 30px;float: left;background:#E3E4E6;border:1px solid #e4e4e4;line-height: 30px;font-size: 14px;font-weight:bold;padding-left: 10px;">
|
||||
<div style="width: 200px;height:100%;float: left;">
|
||||
能耗对比分析
|
||||
</div>
|
||||
<%-- <div style="width: 180px;height:100%;float: right;font-weight:400;">--%>
|
||||
<%-- <div style="width: 80px;height:100%;float: left;">图例切换</div>--%>
|
||||
<%-- <div style="width: 100px;height:100%;float: left;font-weight:400;">--%>
|
||||
<%-- <select id="op2LIsHidden" name="op2LIsHidden" class="select2"--%>
|
||||
<%-- style="height: 30px;padding: 0px 10px;"--%>
|
||||
<%-- onchange="changeOp2LIsHidden(this);">--%>
|
||||
<%-- <option value="0" selected>显示</option>--%>
|
||||
<%-- <option value="1">隐藏</option>--%>
|
||||
<%-- </select>--%>
|
||||
<%-- </div>--%>
|
||||
<%-- </div>--%>
|
||||
</div>
|
||||
<div style="width: 100%;height:calc(100% - 35px);float: left;border:1px solid #e4e4e4;margin-top: 5px;">
|
||||
<div id="chart1" style="height: 100%;"></div>
|
||||
</div>
|
||||
</div>
|
||||
<div style="width: 100%;height: 35%;float: left;border:1px solid gray;padding: 5px;">
|
||||
<div id="table1" style="height:100%;width: 100%;overflow:auto;"></div>
|
||||
</div>
|
||||
</div>
|
||||
<div id="fx" style="width: 55%;height: 100%;float: left;">
|
||||
<div style="width: 100%;height: 50%;float: left;border:1px solid gray;padding:5px;">
|
||||
<div style="width: 100%;height: 30px;float: left;background:#E3E4E6;border:1px solid #e4e4e4;line-height: 30px;font-size: 14px;font-weight:bold;padding-left: 10px;">
|
||||
能耗趋势分析
|
||||
</div>
|
||||
<div style="width: 100%;height:calc(100% - 35px);float: left;border:1px solid #e4e4e4;margin-top: 5px;">
|
||||
<div id="chart2" style="height: 100%;"></div>
|
||||
</div>
|
||||
</div>
|
||||
<div style="width: 100%;height: 50%;float: left;border:1px solid gray;padding:5px;">
|
||||
<div id="table2" style="height:100%;width: 100%;overflow:auto;"></div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</body>
|
||||
</html>
|
||||
Reference in New Issue
Block a user