<%@ page language="java" pageEncoding="UTF-8"%>
<%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core"%>
<%@ taglib prefix="tags" tagdir="/WEB-INF/tags"%>
<c:set var="ctx" value="${pageContext.request.contextPath}"/>
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html lang="en">
<head>
<title>全网监控智能分析平台</title>
<script type="text/javascript"
src="${ctx}/static/js/modernizr.custom.js"></script>
<script type="text/javascript">
</script>
<style type="text/css">
/*test折线图样式控制 */
.dygraph-axis-label-x{
/* color:red; */
transform: rotate(-90deg);
/* -webkit-transform:rotate(-90deg); // Safari 和 Chrome
*/ height:50px;
}
div.tooltip1 {
padding-right: 5px;
padding-left: 5px;
z-index: 1000;
min-height: 1em;
background-color: #a1d8f7;
padding-bottom: 5px;
font: 14px 'Microsoft YaHei', Arial, 宋体, Tahoma, Sans-Serif;
border-style:solid;border-width:1px; border-color:#a1d8f7;
color: #000;
padding-top: 5px;
position: absolute;
text-align: center;
word-wrap: break-word;
-moz-border-radius: 3px;
-khtml-border-radius: 3px;
-webkit-border-radius: 3px;
border-radius: 3px;
}
#tiplayer {
padding-right: 5px;
padding-left: 5px;
z-index: 1000;
min-height: 1em;
background-color: #a1d8f7;
padding-bottom: 5px;
font: 14px 'Microsoft YaHei', Arial, 宋体, Tahoma, Sans-Serif;
border-style:solid;border-width:1px; border-color:#a1d8f7;
color: #000;
padding-top: 5px;
position: absolute;
text-align: center;
word-wrap: break-word;
-moz-border-radius: 3px;
-khtml-border-radius: 3px;
-webkit-border-radius: 3px;
border-radius: 3px;
}
#show_06 a.large {
width: 1px;
height: 1px;
border: 0px;
display: block;
left: -1px;
top: -1px;
position: absolute;
}
.bgbg2{background:#fff; text-align:center;padding-left:5px;}
</style>
</head>
<body>
<div id="sticky-wrap"></div>
<div>
<div class="container">
<ol class="breadcrumb">
<li><a href="${ctx}/index">首页</a>
</li>
<li>运营支撑</li>
<li class="active">配置项分析</li>
</ol>
</div>
</div>
<div id="main-container main-tab-container">
<div id="content" class="container">
<div class="tab-bar-bt">
<ul class="nav nav-tabs">
<li class="active"><a id="a_home" href="#home"data-toggle="tab">总领</a> </li>
<li><a id="a_profile" href="${ctx}/AnalysisSupport/PzxNumCount">数量统计</a> </li>
<li><a id="a_profile1" href="${ctx}/AnalysisSupport/PzxAnalysisLifeCycle">生命周期统计</a> </li>
<li><a id="a_profile2" href="${ctx}/AnalysisSupport/PzxAttribute" >属性统计</a> </li>
<li><a id="a_profile3" href="${ctx}/AnalysisSupport/PzxDetail">明细分析</a> </li>
<li><a id="a_profile4" href="${ctx}/AnalysisSupport/PzxAttributeDetail">属性明细分析</a> </li>
</ul>
</div>
<div class="section">
<div class="tab-content">
<!-- ------------------------------------------------ 配置项分析总领页面 ---------------------------------------------------------------- -->
<div class="tab-pane fade in active" id="home">
<div class="row me-row">
<div id="slidePushMenus" class="cbp-spmenu-push">
<!-- 筛选项内容 -->
<div class="slideMenu" id="cbp-spmenu-s1" style="">
<div class="form">
<tags:PZX_Detail_Period />
<tags:PZX_Ifkey />
<button type="button" class="btn btn-primary" onclick="Submit()">提交</button>
<button type="button" class="btn btn-warning" onclick="reset()">重置</button>
</div>
</div>
<div class="main col-xs-12">
<div id="mainm" class="mainm"></div>
<div class="content clearfix">
<div class="block clearfix">
<button id="showLeftPush"
class="menu-trigger btn btn-default" onclick="toggleMenu('slidePushMenus')">
<span class="glyphicon glyphicon-list"></span>
</button>
<div class="slide-menu-tags">
<span id="PeriodTag" class="label label-info" data-placement="bottom">最近一年</span>
<span id="IfKeyTag" class="label label-info" data-placement="bottom">是否关键(全部)</span>
<span id="P" data-placement="bottom">
</span>
</div>
<div class="bt-list-import">
<a href="#" id="upload" class=""> <span
class="glyphicon glyphicon-import"></span> <span
class="glyphicon-class">导出报表</span> </a>
</div>
</div>
<div class="row" id="row">
<div class="col-xs-6" style="width:680px">
<div class="panel panel-default" >
<div class="panel-heading" >配置项总数
<div id="backall" class="btn-group btn-group-cog">
<input type="button" id="backall" value="全国"style="margin-top:-5px;margin-right:-15px;"class="btn btn-primary" >
</div>
</div>
<div class="panel-body" style="height:500px">
<!-- <div name="loading" class="loading"><img src="${ctx}/static/images/loading.gif"/></div> -->
<iframe id="total" name="total" style="height:480px" scrolling="no"></iframe>
</div>
</div>
</div>
<div class="col-xs-6" style="width:415px">
<div class="panel panel-default">
<div class="panel-heading">
<span id="PzxDiv">全国</span>配置项数量分布
<div class="btn-group btn-group-cog" style="">
<button type="button" id="largeRep" class="btn btn-default dropdown-toggle btn-control-cog" >
<span class="glyphicon glyphicon-zoom-in"></span>
</button><input id="largeRepSrc" type="hidden" value="" />
</div>
</div>
<div class="panel-body" style="height:265px">
<!-- <div name="loading" class="loading"><img src="${ctx}/static/images/loading.gif"/></div> -->
<iframe id="numcount" name="numcount" scrolling="no" style="height:265px"></iframe>
</div>
</div>
<div style="height:215px;overflow-y:auto;">
<div class="panel panel-default">
<div class="panel-heading">
<span id="hardwareDiv">全国</span>系统硬件厂商分布</div> <!-- 创建时间改为厂商 -->
<div class="panel-body"style="height:172px">
<!-- <div name="loading" class="loading"><img src="${ctx}/static/images/loading.gif"/></div> -->
<iframe id="hardware" name="hardware" scrolling="no"></iframe>
</div>
</div>
<div class="panel panel-default">
<div class="panel-heading">
<span id="softwareDiv">全国</span>系统软件厂商分布</div> <!-- 创建时间改为厂商 -->
<div class="panel-body"style="height:172px">
<!-- <div name="loading" class="loading"><img src="${ctx}/static/images/loading.gif"/></div> -->
<iframe id="software" name="software" scrolling="no"></iframe>
</div>
</div>
<div class="panel panel-default">
<div class="panel-heading">
<span id="nationalizeDiv">全国</span>系统硬件国有化占比</div>
<div class="panel-body"style="height:172px">
<!-- <div name="loading" class="loading"><img src="${ctx}/static/images/loading.gif"/></div> -->
<iframe id="nationalize" name="nationalize" scrolling="no"></iframe>
</div>
</div>
<div class="panel panel-default">
<div class="panel-heading">
<span id="softnationalizeDiv">全国</span>系统软件国有化占比</div>
<div class="panel-body"style="height:172px">
<!-- <div name="loading" class="loading"><img src="${ctx}/static/images/loading.gif"/></div> -->
<iframe id="softnationalize" name="softnationalize" scrolling="no"></iframe>
</div>
</div>
</div>
</div>
<div id="yw_llq" class="col-xs-12">
<div class="panel panel-default">
<div class="panel-heading ">
<span id="pzxChangeDiv">全国</span>配置项变化分析
</div>
<div class="panel-body"style="height:380px">
<!-- <div name="loading" class="loading"><img src="${ctx}/static/images/loading.gif"/></div> -->
<!-- <iframe id="pzxchange" name="pzxchange" scrolling="no"></iframe> -->
<div id="boxplot1"></div>
<input type="hidden" id="pzxAnalysisJsonId" value='${PzxAnalysisJson}'>
</div>
</div>
<!-- pentaho画的折线图 start
<div class="panel panel-default">
<div class="panel-heading ">
<span id="hardwareChangeDiv">全国</span>配置项数量变化
<div id="confirmDiv" class="btn-group btn-group-cog">
<input type="button" id="confirmButton" value="确认"style="margin-right:-15px;"class="btn btn-primary" >
</div>
<div id="changeDiv" class="btn-group btn-group-cog">
<label>变更状态</label>
<select class="slide-menu-select" id="changeid" name="changename">
<option value="-2" selected>全选</option>
<option value="1" ><a href="#">增加</a></option>
<option value="2" ><a href="#">删除</a></option>
<option value="3"><a href="#">修改</a></option>
</select>
</div>
<div id="typeDiv" class="btn-group btn-group-cog">
<label>配置项类别</label>
<select class="slide-menu-select" id="typeid" name="typename">
<option value="-2" selected>全选</option>
<c:forEach items="${type}" var="type">
<option value="${type.ciCategoryId}"><a href="#">${type.ciCategoryName}</a></option>
</c:forEach>
</select>
</div>
<div id="classDiv" class="btn-group btn-group-cog">
<label>配置项大类</label>
<select class="slide-menu-select" id="classid" name="classname">
<c:forEach items="${pzxcategory}" var="pzxcategory">
<c:choose>
<c:when test="${pzxcategory=='系统硬件'}">
<option value="${pzxcategory}" selected><a href="#">${pzxcategory}</a></option>
</c:when>
<c:otherwise>
<option value="${pzxcategory}"><a href="#">${pzxcategory}</a></option>
</c:otherwise>
</c:choose>
</c:forEach>
</select>
</div>
<div id="cycleDiv" class="btn-group btn-group-cog">
<label>时间周期</label>
<select class="slide-menu-select" id="timecycle" name="timecycle">
<option value="1" title="日" selected><a href="#">日</a></option>
<option value="2" title="月"><a href="#">月</a></option>
<option value="3" title="年"><a href="#">年</a></option>
</select>
</div>
</div>
<div class="panel-body"style="height:320px">
<div name="loading" class="loading"><img src="${ctx}/static/images/loading.gif"/></div>
<iframe id="hardwarechang" name="hardwarechang"style="height:310px" scrolling="no"></iframe>
</div>
</div>
pentaho画的折线图 end-->
<!-- 测试折线图 start -->
<div class="panel panel-default">
<div class="panel-heading ">
<span id="testDiv">全国</span>配置项数量变化
<!-- Dygraph.js画折线图筛选项 start -->
<div id="confirmDiv2" class="btn-group btn-group-cog">
<input type="button" id="confirmButton2" value="确认"style="margin-top:-5px;margin-right:-15px;"class="btn btn-primary" >
</div>
<div id="changeDiv2" class="btn-group btn-group-cog">
<label>变更状态</label>
<select class="slide-menu-select" id="changeid2" name="changename">
<option value="1,2,3,4,5,6" selected>全选</option>
<option value="1" ><a href="#">新增</a></option>
<option value="2" ><a href="#">删除</a></option>
<option value="3"><a href="#">修改</a></option>
<option value="4" ><a href="#">一致</a></option>
<option value="5" ><a href="#">一致修改</a></option>
<option value="6"><a href="#">一致删除</a></option>
</select>
</div>
<div id="typeDiv2" class="btn-group btn-group-cog">
<label>配置项类别</label>
<select class="slide-menu-select" id="typeid2" name="typename">
<option value="-2" selected>全选</option>
<c:forEach items="${type}" var="type">
<option value="${type.ciCategoryId}"><a href="#">${type.ciCategoryName}</a></option>
</c:forEach>
</select>
</div>
<div id="classDiv2" class="btn-group btn-group-cog">
<label>配置项大类</label>
<select class="slide-menu-select" id="classid2" name="classname">
<c:forEach items="${pzxcategory}" var="pzxcategory">
<c:choose>
<c:when test="${pzxcategory=='系统硬件'}">
<option value="${pzxcategory}" selected><a href="#">${pzxcategory}</a></option>
</c:when>
<c:otherwise>
<option value="${pzxcategory}"><a href="#">${pzxcategory}</a></option>
</c:otherwise>
</c:choose>
</c:forEach>
</select>
</div>
<!--
<div id="cycleDiv2" class="btn-group btn-group-cog">
<label>时间周期</label>
<select class="slide-menu-select" id="timecycle2" name="timecycle">
<option value="1" title="日" ><a href="#">日</a></option>
<option value="2" title="月" selected><a href="#">月</a></option>
</select>
</div>
-->
<!-- Dygraph.js画折线图筛选项 end -->
</div>
<div class="panel-body"style="height:380px">
<!-- <div name="loading" class="loading"><img src="${ctx}/static/images/loading.gif"/></div> -->
<!-- <iframe id="pzxchange" name="pzxchange" scrolling="no"></iframe> -->
<div id="test" style="height:340px;width:1050px;"></div>
<image id="imgExport2" style="height:280px;width:700px;" />
<input type="hidden" id="testJsonId" value='${testJson}'>
</div>
</div>
<!--测试 end -->
</div>
<canvas id="canvas"></canvas>
</div>
</div>
</div>
</div>
</div>
</div>
<!-- <div class="tab-pane fade" id="statistics">
<div class="row me-row">
</div>
</div>
-->
<form action="#" method="get" id="listForm">
<input type="hidden" id="CurTabId" name="CurTabId" value="${CurTabId}" /> </form>
<form id='pForm' action='${ctx}/MonitorOperation/WarnAnalysisDetail' method='get' target='_blank'><input type='hidden' name="ProvinceTag"/></form>
<form id="export" action="#" method="post">
<input type="hidden" id="imagesrc" name="imagesrc" value="">
<input type="hidden" id="pngsrc" name="pngsrc" value="">
</form>
</div>
</div>
</div>
</div>
<script type="text/javascript" src="${ctx}/static/js/d3.v3.min.js"></script>
<script type="text/javascript" src="${ctx}/static/js/d3.tip.js"></script>
<script type="text/javascript" src="${ctx}/static/js/pzxBox.js"></script>
<script type="text/javascript" src="${ctx}/static/js/pzxAnalysisBoxplot.js"></script>
<script type="text/javascript" src="${ctx}/static/js/dygraph-combined.js"></script>
<script type="text/javascript" src="${ctx}/static/js/dygraph-extra.js"></script>
<script type="text/javascript" src="${ctx}/static/js/canvg.js"></script>
<script type="text/javascript">
var jssrc;
initDateStats();
$(function(){
var IfKeyTag="'0','1'";
// alert(getStatsPeriodStr());
$("#total").attr("src","${biserver_config}path=analysissupport&action=Pzx_analysis_bar_drill.xaction&driEnable=true&driLink=drillpzx&height=360&width=500&PeriodTag="+getStatsPeriodStr()+"&IfKeyTag="+IfKeyTag);
// alert(document.getElementById("total").src);
var ProvinceTag="'上海','云南','内蒙','北京','吉林','四川','天津','宁夏','安徽','山东','山西','广东','广西','新疆','江苏','江西','河北','河南','浙江','海南','湖北','湖南','甘肃','福建','西藏','贵州','辽宁','重庆','陕西','青海','黑龙江'";
$("#numcount").attr("src","${biserver_config}path=analysissupport&action=pzx_num_spread.xaction&height=188&width=280&ProvinceTag="+encodeURI(ProvinceTag)+"&PeriodTag="+getStatsPeriodStr()+"&IfKeyTag="+IfKeyTag);
//alert(document.getElementById("numcount").src);
//alert(encodeURI("上海"));
$('#largeRepSrc').val("${biserver_config}path=analysissupport&action=pzx_num_spread.xaction&ProvinceTag="+encodeURI(ProvinceTag)+"&PeriodTag="+getStatsPeriodStr()+"&IfKeyTag="+IfKeyTag);
var classtag="'系统硬件'";
var others="'其他'";
$("#hardware").attr("src","${biserver_config}path=analysissupport&action=pzx_hardware.xaction&height=118&width=260&ProvinceTag="+encodeURI(ProvinceTag)+"&PeriodTag="+getStatsPeriodStr()+"&ClassTag="+encodeURI(classtag)+"&IfKeyTag="+IfKeyTag+"&OthersTag="+encodeURI(others));
var classtag2="'系统软件'";
$("#software").attr("src","${biserver_config}path=analysissupport&action=pzx_hardware.xaction&height=118&width=260&ProvinceTag="+encodeURI(ProvinceTag)+"&PeriodTag="+getStatsPeriodStr()+"&ClassTag="+encodeURI(classtag2)+"&IfKeyTag="+IfKeyTag+"&OthersTag="+encodeURI(others));
var state="'国有化'";
var notstate="'非国有化'";
$("#nationalize").attr("src","${biserver_config}path=analysissupport&action=pzx_hardware_state_pie.xaction&height=118&width=260&ProvinceTag="+encodeURI(ProvinceTag)+"&PeriodTag="+getStatsPeriodStr()+"&ClassTag="+encodeURI(classtag)+"&State="+encodeURI(state)+"&NotState="+encodeURI(notstate)+"&IfKeyTag="+IfKeyTag);
$("#softnationalize").attr("src","${biserver_config}path=analysissupport&action=pzx_hardware_state_pie.xaction&height=118&width=260&ProvinceTag="+encodeURI(ProvinceTag)+"&PeriodTag="+getStatsPeriodStr()+"&ClassTag="+encodeURI(classtag2)+"&State="+encodeURI(state)+"&NotState="+encodeURI(notstate)+"&IfKeyTag="+IfKeyTag);
var jsondata=document.getElementById("pzxAnalysisJsonId").value;
var period=1;
var provinceName="全国";
var IfKeyTag2="0,1";
svgVirBarChart(jsondata,period,provinceName,IfKeyTag2);
$("canvas").hide();
//导出svg矢量图 end
// alert($("#timecycle").val());
// alert($("#classid").val());
// alert($("#typeid").val());
// alert($("#changeid").val());
/*pentaho画折线图 start
var Flag=1;
var PeriodTag=getStatsPeriodStr();
var CycleTag=0;
var ClassTag="'系统硬件'";
var TypeTag=0;
var ChangeTag=0;
var ProvinceTag=0;
$("#hardwarechang").attr("src","${biserver_config}path=analysissupport&action=pzx_analysis_line.xaction&height=220&width=800&Flag="+Flag+"&CycleTag="+CycleTag+"&ProvinceTag="+encodeURI(ProvinceTag)+"&PeriodTag="+PeriodTag+"&ClassTag="+encodeURI(ClassTag)+"&TypeTag="+TypeTag+"&ChangeTag="+ChangeTag);
pentaho画折线图 end */
//js画折线图-------------
// alert('"'+document.getElementById("testJsonId").value.replace(/\"/g, "")+'"');
// g = new Dygraph(document.getElementById("test"),
// '"'+document.getElementById("testJsonId").value.replace(/\"/g, "")+'"'
// );
// alert(document.getElementById("testJsonId").value.replace(/\"/g, ""));
var str=eval(document.getElementById("testJsonId").value);
// alert(str);
// alert(document.getElementById("testJsonId").value);
var myarray=new Array();
myarray=document.getElementById("testJsonId").value.replace(/\"/g, "").split("@");
var data="日期:,变化数量\n";
for(var i=0;i<myarray.length;i++){
data+=myarray[i]+"\n";
}
// alert(data);
// alert(document.getElementById("testJsonId").value.replace(/\"/g,""));
// console.log(document.getElementById("testJsonId").value.replace(/\"/g, ""));
g = new Dygraph(document.getElementById("test"),
// "Date,NUM"+document.getElementById("testJsonId").value.replace(/\"/g,"")
//"${tcx}/CmszMonitorAnalysis/ywglPicPath/testline.csv",
data,
{
legend: 'always',
// title: '配置项数量变化分布',
labelsDivStyles: {
}
}
);
//end js画折线图 --------
Dygraph.Export.asPNG(g, imgExport2);
$('#imgExport2').hide();
//$('#imgExport2').show();
jssrc=$("#imgExport2").attr("src");
//alert(jssrc);
$("#imagesrc").val(jssrc);
//alert($("#imagesrc").val());
});
function drillpzx(provincename){
document.getElementById("PzxDiv").innerText =provincename;
$("#numcount").attr("src","${biserver_config}path=analysissupport&action=pzx_num_spread.xaction&height=188&width=280&ProvinceTag="+encodeURI("'"+provincename+"'")+"&PeriodTag="+getStatsPeriodStr()+"&IfKeyTag="+getIfkey());
$('#largeRepSrc').val("${biserver_config}path=analysissupport&action=pzx_num_spread.xaction&ProvinceTag="+encodeURI("'"+provincename+"'")+"&PeriodTag="+getStatsPeriodStr()+"&IfKeyTag="+getIfkey());
var classtag="'系统硬件'";
var others="'其他'";
document.getElementById("hardwareDiv").innerText =provincename;
$("#hardware").attr("src","${biserver_config}path=analysissupport&action=pzx_hardware.xaction&height=118&width=260&ProvinceTag="+encodeURI("'"+provincename+"'")+"&PeriodTag="+getStatsPeriodStr()+"&ClassTag="+encodeURI(classtag)+"&IfKeyTag="+getIfkey()+"&OthersTag="+encodeURI(others));
document.getElementById("softwareDiv").innerText =provincename;
var classtag2="'系统软件'";
$("#software").attr("src","${biserver_config}path=analysissupport&action=pzx_hardware.xaction&height=118&width=260&ProvinceTag="+encodeURI("'"+provincename+"'")+"&PeriodTag="+getStatsPeriodStr()+"&ClassTag="+encodeURI(classtag2)+"&IfKeyTag="+getIfkey()+"&OthersTag="+encodeURI(others));
document.getElementById("nationalizeDiv").innerText =provincename;
var state="'国有化'";
var notstate="'非国有化'";
$("#nationalize").attr("src","${biserver_config}path=analysissupport&action=pzx_hardware_state_pie.xaction&height=118&width=260&ProvinceTag="+encodeURI("'"+provincename+"'")+"&PeriodTag="+getStatsPeriodStr()+"&ClassTag="+encodeURI(classtag)+"&State="+encodeURI(state)+"&NotState="+encodeURI(notstate)+"&IfKeyTag="+getIfkey());
document.getElementById("softnationalizeDiv").innerText =provincename;
$("#softnationalize").attr("src","${biserver_config}path=analysissupport&action=pzx_hardware_state_pie.xaction&height=118&width=260&ProvinceTag="+encodeURI("'"+provincename+"'")+"&PeriodTag="+getStatsPeriodStr()+"&ClassTag="+encodeURI(classtag2)+"&State="+encodeURI(state)+"&NotState="+encodeURI(notstate)+"&IfKeyTag="+getIfkey());
document.getElementById("pzxChangeDiv").innerText =provincename;
var jsondata=2;
var period=getStatsPeriodStr();
$("#boxplot1").empty();
svgVirBarChart(jsondata,period,provincename,getIfkey().replace(/\'/g,""));
$("canvas").hide();
/*pentaho画折线图 start
document.getElementById("hardwareChangeDiv").innerText =provincename;
var Flag=2;
var PeriodTag=getStatsPeriodStr();
var CycleTag=0;
var ClassTag="'系统硬件'";
var TypeTag=0;
var ChangeTag=0;
var ProvinceTag="'"+provincename+"'";
// pzx_hardware.xaction
$("#hardwarechang").attr("src","${biserver_config}path=analysissupport&action=pzx_analysis_line.xaction&height=220&width=800&Flag="+Flag+"&CycleTag="+CycleTag+"&ProvinceTag="+encodeURI(ProvinceTag)+"&PeriodTag="+PeriodTag+"&ClassTag="+encodeURI(ClassTag)+"&TypeTag="+TypeTag+"&ChangeTag="+ChangeTag);
end */
// js画折线图
document.getElementById("testDiv").innerText =provincename;
var href="../AnalysisSupport/PzxAnalysis/findPzxChangeNumByPeriodAndPro?periodTag="+period+"&provinceTag="+provincename+"&IfKeyTag="+getIfkey().replace(/\'/g,"");
$.ajax({
type : 'GET',
contentType : 'application/json',
url: encodeURI(encodeURI(href)),
dataType : 'text',
// async: false, //异步操作的属性
beforeSend: function(data) {
},
success: function(data) {
var csvdata="日期:,变化数量";
for(var i=0;i<data.length;i++){
if(data[i]=='\"'){
data=data.replace('\"','\'');
}
}
data = eval("(" + data + ")");
for(var j=0;j<data.length;j++){
if(j%2==0){
csvdata+="\n"+data[j];
}else{
csvdata+=","+data[j];
}
}
g = new Dygraph(document.getElementById("test"),
csvdata,
{
legend: 'always',
// title: '配置项数量变化分布',
labelsDivStyles: {
}
}
);
Dygraph.Export.asPNG(g, imgExport2);
$('#imgExport2').hide();
//$('#imgExport2').show();
jssrc=$("#imgExport2").attr("src");
//alert(jssrc);
$("#imagesrc").val(jssrc);
}
});
}
//筛选控件提交1
function Submit() {
toggleMenu('slidePushMenus');
//时间筛选项
$('#PeriodTag').text("时间范围").attr('data-original-title',getStatsPeriodStr()).tooltip();
$('#IfKeyTag').text("是否关键").attr('data-original-title',getIfKeyTitle()).tooltip();
$("#total").attr("src","${biserver_config}path=analysissupport&action=Pzx_analysis_bar_drill.xaction&driEnable=true&driLink=drillpzx&height=360&width=500&PeriodTag="+getStatsPeriodStr()+"&IfKeyTag="+getIfkey());
var ProvinceTag="'上海','云南','内蒙','北京','吉林','四川','天津','宁夏','安徽','山东','山西','广东','广西','新疆','江苏','江西','河北','河南','浙江','海南','湖北','湖南','甘肃','福建','西藏','贵州','辽宁','重庆','陕西','青海','黑龙江'";
document.getElementById("PzxDiv").innerText ="全国";
$("#numcount").attr("src","${biserver_config}path=analysissupport&action=pzx_num_spread.xaction&height=188&width=280&ProvinceTag="+encodeURI(ProvinceTag)+"&PeriodTag="+getStatsPeriodStr()+"&IfKeyTag="+getIfkey());
$('#largeRepSrc').val("${biserver_config}path=analysissupport&action=pzx_num_spread.xaction&ProvinceTag="+encodeURI(ProvinceTag)+"&PeriodTag="+getStatsPeriodStr()+"&IfKeyTag="+getIfkey());
var classtag="'系统硬件'";
var others="'其他'";
document.getElementById("hardwareDiv").innerText ="全国";
$("#hardware").attr("src","${biserver_config}path=analysissupport&action=pzx_hardware.xaction&height=118&width=260&ProvinceTag="+encodeURI(ProvinceTag)+"&PeriodTag="+getStatsPeriodStr()+"&ClassTag="+encodeURI(classtag)+"&IfKeyTag="+getIfkey()+"&OthersTag="+encodeURI(others));
document.getElementById("softwareDiv").innerText ="全国";
var classtag2="'系统软件'";//实际情况中要改为'系统软件'
$("#software").attr("src","${biserver_config}path=analysissupport&action=pzx_hardware.xaction&height=118&width=260&ProvinceTag="+encodeURI(ProvinceTag)+"&PeriodTag="+getStatsPeriodStr()+"&ClassTag="+encodeURI(classtag2)+"&IfKeyTag="+getIfkey()+"&OthersTag="+encodeURI(others));
document.getElementById("nationalizeDiv").innerText ="全国";
var state="'国有化'";
var notstate="'非国有化'";
$("#nationalize").attr("src","${biserver_config}path=analysissupport&action=pzx_hardware_state_pie.xaction&height=118&width=260&ProvinceTag="+encodeURI(ProvinceTag)+"&PeriodTag="+getStatsPeriodStr()+"&ClassTag="+encodeURI(classtag)+"&State="+encodeURI(state)+"&NotState="+encodeURI(notstate)+"&IfKeyTag="+getIfkey());
document.getElementById("softnationalizeDiv").innerText ="全国";
$("#softnationalize").attr("src","${biserver_config}path=analysissupport&action=pzx_hardware_state_pie.xaction&height=118&width=260&ProvinceTag="+encodeURI(ProvinceTag)+"&PeriodTag="+getStatsPeriodStr()+"&ClassTag="+encodeURI(classtag2)+"&State="+encodeURI(state)+"&NotState="+encodeURI(notstate)+"&IfKeyTag="+getIfkey());
var data=1;
var period=getStatsPeriodStr();
var provinceName="全国";
$("#boxplot1").empty();
document.getElementById("pzxChangeDiv").innerText ="全国";
svgVirBarChart(data,period,provinceName,getIfkey().replace(/\'/g,""));
$("canvas").hide();
var Flag=1;
var PeriodTag=getStatsPeriodStr();
var CycleTag=0;
var ClassTag="'系统硬件'";
var TypeTag=0;
var ChangeTag=0;
var ProvinceTag=0;
/*pentaho画折线图 start
$("#hardwarechang").attr("src","${biserver_config}path=analysissupport&action=pzx_analysis_line.xaction&height=220&width=800&Flag="+Flag+"&CycleTag="+CycleTag+"&ProvinceTag="+encodeURI(ProvinceTag)+"&PeriodTag="+PeriodTag+"&ClassTag="+encodeURI(ClassTag)+"&TypeTag="+TypeTag+"&ChangeTag="+ChangeTag);
pentaho画折线图 end */
$("#test").empty();
document.getElementById("testDiv").innerText ="全国";
var href="../AnalysisSupport/PzxAnalysis/findPzxChangeNumByPeriod?periodTag="+period+"&IfKeyTag="+getIfkey().replace(/\'/g,"");
$.ajax({
type : 'GET',
contentType : 'application/json',
url: href,
dataType : 'text',
// async: false, //异步操作的属性
beforeSend: function(data) {
},
success: function(data) {
var csvdata="日期:,变化数量";
for(var i=0;i<data.length;i++){
if(data[i]=='\"'){
data=data.replace('\"','\'');
}
}
data = eval("(" + data + ")");
for(var j=0;j<data.length;j++){
if(j%2==0){
csvdata+="\n"+data[j];
}else{
csvdata+=","+data[j];
}
}
g = new Dygraph(document.getElementById("test"),
csvdata,
{
legend: 'always',
// title: '配置项数量变化分布',
labelsDivStyles: {
}
}
);
Dygraph.Export.asPNG(g, imgExport2);
$('#imgExport2').hide();
//$('#imgExport2').show();
jssrc=$("#imgExport2").attr("src");
//alert(jssrc);
$("#imagesrc").val(jssrc);
}
});
}
//第一个筛选项页面重置函数
function reset() {
initDateStats();//用于初始化时间控件的默认时间值
$('#ifKey')[0].selectedIndex = 0;
}
var timestamp = Date.parse(new Date());//时间戳,用于从服务器得到最新的数据
/* pentaho 做的折线图中的筛选项的联动 start
$("#classid").change(function(){
$("#typeid").empty();
$("#typeid").append("");
var ciclass=$("#classid").val();
$.ajax({
type : 'GET',
contentType : 'application/json',
url: encodeURI(encodeURI('${ctx}/AnalysisSupport/PzxAnalysis/findCiCategoryTag/'+ciclass+'/'+timestamp)),
dataType : 'text',
beforeSend: function(data) {},
success: function(data) {
for(var i=0;i<data.length;i++){
if(data[i]=='\"'){
data=data.replace('\"','\'');
}
}
data=eval("("+ data +")");//获取从后台返回的数据,通常是Json格式
$("#typeid").append('<option value="'+-2+'">全选</option>');
for(var t=0;t<data.length;t=t+2){
$("#typeid").append('<option value="'+data[t]+'" title="'+data[t+1]+'">'+data[t+1]+'</option>');
}
}
});
});
end */
$("#classid2").change(function(){
$("#typeid2").empty();
$("#typeid2").append("");
var ciclass=$("#classid2").val();
$.ajax({
type : 'GET',
contentType : 'application/json',
url: encodeURI(encodeURI('${ctx}/AnalysisSupport/PzxAnalysis/findCiCategoryTag/'+ciclass+'/'+timestamp)),
dataType : 'text',
beforeSend: function(data) {},
success: function(data) {
for(var i=0;i<data.length;i++){
if(data[i]=='\"'){
data=data.replace('\"','\'');
}
}
data=eval("("+ data +")");//获取从后台返回的数据,通常是Json格式
$("#typeid2").append('<option value="'+-2+'">全选</option>');
for(var t=0;t<data.length;t=t+2){
$("#typeid2").append('<option value="'+data[t]+'" title="'+data[t+1]+'">'+data[t+1]+'</option>');
}
}
});
});
/* pentaho 做的折线图中的确认按钮 start
$("#confirmButton").click(function(){
// alert($("#timecycle").val());
// alert($("#classid").val());
// alert($("#typeid").val());
// alert($("#changeid").val());
var Flag=3;
var PeriodTag=getStatsPeriodStr();
var CycleTag=$("#timecycle").val();
var ClassTag="'"+$("#classid").val()+"'";
var TypeTag=$("#typeid").val();
var ChangeTag=$("#changeid").val();
var ProvinceTag;
if(document.getElementById("hardwareChangeDiv").innerText=="全国"){
ProvinceTag=-2;
}else{
ProvinceTag="'"+document.getElementById("hardwareChangeDiv").innerText+"'";
}
if(CycleTag!=3){
$("#hardwarechang").attr("src","${biserver_config}path=analysissupport&action=pzx_analysis_line.xaction&height=220&width=800&Flag="+Flag+"&CycleTag="+CycleTag+"&ProvinceTag="+encodeURI(ProvinceTag)+"&PeriodTag="+PeriodTag+"&ClassTag="+encodeURI(ClassTag)+"&TypeTag="+TypeTag+"&ChangeTag="+ChangeTag);
}else{
$("#hardwarechang").attr("src","${biserver_config}path=analysissupport&action=pzx_analysis_lineyear.xaction&height=220&width=800&Flag="+Flag+"&CycleTag="+CycleTag+"&ProvinceTag="+encodeURI(ProvinceTag)+"&PeriodTag="+PeriodTag+"&ClassTag="+encodeURI(ClassTag)+"&TypeTag="+TypeTag+"&ChangeTag="+ChangeTag);
}
});
pentaho 做的折线图中的确认按钮 end*/
$("#confirmButton2").click(function(){
var periodTag=getStatsPeriodStr();
var cycleTag=2;
var classTag=$("#classid2").val();
var typeTag=$("#typeid2").val();
var changeTag=$("#changeid2").val();
var provinceTag=document.getElementById("testDiv").innerText;
// alert(periodTag+","+cycleTag+","+classTag+","+typeTag+","+provinceTag+","+changeTag);
$("#test").empty();
var href="../AnalysisSupport/PzxAnalysis/findPzxChangeNumByConfirm?cycleTag="+cycleTag+"&classTag="+classTag+"&typeTag="+typeTag+"&changeTag="+changeTag+"&provinceTag="+provinceTag+"&IfKeyTag="+getIfkey().replace(/\'/g,"");
$.ajax({
type : 'GET',
contentType : 'application/json',
url: encodeURI(encodeURI(href))+"&periodTag="+periodTag,
dataType : 'text',
// async: false, //异步操作的属性
beforeSend: function(data) {
},
success: function(data) {
var csvdata="日期:,变化数量";
for(var i=0;i<data.length;i++){
if(data[i]=='\"'){
data=data.replace('\"','\'');
}
}
data = eval("(" + data + ")");
for(var j=0;j<data.length;j++){
if(j%2==0){
csvdata+="\n"+data[j];
}else{
csvdata+=","+data[j];
}
}
g = new Dygraph(document.getElementById("test"),
csvdata,
{
legend: 'always',
// title: '配置项数量变化分布',
labelsDivStyles: {
}
}
);
Dygraph.Export.asPNG(g, imgExport2);
$('#imgExport2').hide();
//$('#imgExport2').show();
jssrc=$("#imgExport2").attr("src");
//alert(jssrc);
$("#imagesrc").val(jssrc);
}
});
});
$('#largeRep').click(function (){
$.dialog({
title:'',
content:"<div class='dialog-p' style='height:600px;width:990px'><div name='loading' class='loading' style='height: 90%;width: 95%;'><img src='${ctx}/static/images/loading.gif'/></div><iframe id='largeIf' style='height:100%;padding: 7px;' scrolling='no' src=''></iframe></div>",
lock: true,
initialize:function(){
$('#largeIf').attr('src',$('#largeRepSrc').val()+"&height=430&width=720&limit=false")
$('#largeIf').load( function(){ $(this).parent().find('.loading').fadeOut("fast"); });
}
})
});
$("#upload").click(function(){
//导出svg矢量图 start
canvg('canvas',$("#boxplot1").html());
var img = canvas.toDataURL("image/png");
//alert(img);
console.log(img);
$("#pngsrc").val(img);
//导出svg矢量图 end
//var temi = $(this).attr("id").charAt($(this).attr("id").length-1);
//alert(temi);
var picArr = new Array();
$("#home").find("iframe").each(function(){
//alert($(this).attr("id"));
// picArr.push($(window.frames[$(this).attr("id")].document).find("img").attr("src").substr(24));
var tmpArr = new Array();
var tmpStr = $(window.frames[$(this).attr("id")].document).find("img").attr("src");
tmpArr = tmpStr.split("?image=");
picArr.push(tmpArr[1]);
});
var picStr = picArr.join(",");
$.dialog({
id: "export",
title: "请选择导出文件类型",
content: "<div style='position:relative;height:40px;margin:0 0 0 11px;'><div class='form-horizontal'>"
+"<div class='form-group'><div class='col-sm-4'><label class='radio-inline'><input type='radio' name='expradio' class='expradio' value='word' checked/>Word</label></div>"
+"<div class='col-sm-4'><label class='radio-inline'><input type='radio' name='expradio' class='expradio' value='excel'/>Excel</label></div>"
+"<div class='col-sm-4'><label class='radio-inline'><input type='radio' name='expradio' class='expradio' value='pdf'/>Pdf</label></div></div>"
+"</div></div>",
width: 276,
height: 140,
initialize: function () {
$(".d-buttons input:first").css({
"color": "#ffffff",
"background": "#428bca",
"border-color": "#357ebd"
});
},
button: [{
value: "确定",
callback: function () {
//alert(picStr);
//alert($('input[name="expradio"]:checked').val());
var listForm=$("#export");
//alert("${ctx}/AnalysisSupport/PzxAnalysis/"+$('input[name="expradio"]:checked').val()+"?picStr="+picStr);
//+"&jsPicName="+jsPicName+"&jsPicSrc="+jsPicSrc
listForm.attr("action","${ctx}/AnalysisSupport/PzxAnalysis/"+$('input[name="expradio"]:checked').val()+"?picStr="+picStr);
listForm.submit();
listForm.attr("action","#");
}
},{
value: "取消",
callback: function () {}
}],
lock: false
});
});
$("#backall").click(function(){
var IfKeyTag=getIfkey();
document.getElementById("PzxDiv").innerText ="全国";
document.getElementById("hardwareDiv").innerText ="全国";
document.getElementById("softwareDiv").innerText ="全国";
document.getElementById("nationalizeDiv").innerText ="全国";
document.getElementById("softnationalizeDiv").innerText ="全国";
document.getElementById("pzxChangeDiv").innerText ="全国";
document.getElementById("testDiv").innerText ="全国";
var ProvinceTag="'上海','云南','内蒙','北京','吉林','四川','天津','宁夏','安徽','山东','山西','广东','广西','新疆','江苏','江西','河北','河南','浙江','海南','湖北','湖南','甘肃','福建','西藏','贵州','辽宁','重庆','陕西','青海','黑龙江'";
$("#numcount").attr("src","${biserver_config}path=analysissupport&action=pzx_num_spread.xaction&height=188&width=280&ProvinceTag="+encodeURI(ProvinceTag)+"&PeriodTag="+getStatsPeriodStr()+"&IfKeyTag="+IfKeyTag);
//alert(document.getElementById("numcount").src);
//alert(encodeURI("上海"));
$('#largeRepSrc').val("${biserver_config}path=analysissupport&action=pzx_num_spread.xaction&ProvinceTag="+encodeURI(ProvinceTag)+"&PeriodTag="+getStatsPeriodStr()+"&IfKeyTag="+IfKeyTag);
var classtag="'系统硬件'";
var others="'其他'";
$("#hardware").attr("src","${biserver_config}path=analysissupport&action=pzx_hardware.xaction&height=118&width=260&ProvinceTag="+encodeURI(ProvinceTag)+"&PeriodTag="+getStatsPeriodStr()+"&ClassTag="+encodeURI(classtag)+"&IfKeyTag="+IfKeyTag+"&OthersTag="+encodeURI(others));
var classtag2="'系统软件'";
$("#software").attr("src","${biserver_config}path=analysissupport&action=pzx_hardware.xaction&height=118&width=260&ProvinceTag="+encodeURI(ProvinceTag)+"&PeriodTag="+getStatsPeriodStr()+"&ClassTag="+encodeURI(classtag2)+"&IfKeyTag="+IfKeyTag+"&OthersTag="+encodeURI(others));
var state="'国有化'";
var notstate="'非国有化'";
$("#nationalize").attr("src","${biserver_config}path=analysissupport&action=pzx_hardware_state_pie.xaction&height=118&width=260&ProvinceTag="+encodeURI(ProvinceTag)+"&PeriodTag="+getStatsPeriodStr()+"&ClassTag="+encodeURI(classtag)+"&State="+encodeURI(state)+"&NotState="+encodeURI(notstate)+"&IfKeyTag="+IfKeyTag);
$("#softnationalize").attr("src","${biserver_config}path=analysissupport&action=pzx_hardware_state_pie.xaction&height=118&width=260&ProvinceTag="+encodeURI(ProvinceTag)+"&PeriodTag="+getStatsPeriodStr()+"&ClassTag="+encodeURI(classtag2)+"&State="+encodeURI(state)+"&NotState="+encodeURI(notstate)+"&IfKeyTag="+IfKeyTag);
var data=1;
var period=getStatsPeriodStr();
var provinceName="全国";
$("#boxplot1").empty();
svgVirBarChart(data,period,provinceName,getIfkey().replace(/\'/g,""));
$("#test").empty();
var href="../AnalysisSupport/PzxAnalysis/findPzxChangeNumByPeriod?periodTag="+period+"&IfKeyTag="+getIfkey().replace(/\'/g,"");
$.ajax({
type : 'GET',
contentType : 'application/json',
url: href,
dataType : 'text',
// async: false, //异步操作的属性
beforeSend: function(data) {
},
success: function(data) {
var csvdata="日期:,变化数量";
for(var i=0;i<data.length;i++){
if(data[i]=='\"'){
data=data.replace('\"','\'');
}
}
data = eval("(" + data + ")");
for(var j=0;j<data.length;j++){
if(j%2==0){
csvdata+="\n"+data[j];
}else{
csvdata+=","+data[j];
}
}
g = new Dygraph(document.getElementById("test"),
csvdata,
{
legend: 'always',
// title: '配置项数量变化分布',
labelsDivStyles: {
}
}
);
}
});
});
</script>
</body>
</html>