|
|
@ -6,8 +6,21 @@ |
|
|
<th:block th:include="include :: header('执法投诉统计')"/> |
|
|
<th:block th:include="include :: header('执法投诉统计')"/> |
|
|
<link type="text/css" href="/css/stat1.css" rel="stylesheet"/> |
|
|
<link type="text/css" href="/css/stat1.css" rel="stylesheet"/> |
|
|
<style> |
|
|
<style> |
|
|
|
|
|
.row { |
|
|
|
|
|
width: 100%; |
|
|
|
|
|
height: 100%; |
|
|
|
|
|
} |
|
|
|
|
|
|
|
|
|
|
|
.search-collapse { |
|
|
|
|
|
position: relative; |
|
|
|
|
|
width: 100%; |
|
|
|
|
|
height: 100%; |
|
|
|
|
|
} |
|
|
|
|
|
|
|
|
.tab-content { |
|
|
.tab-content { |
|
|
display: none; |
|
|
display: none; |
|
|
|
|
|
width: 100%; |
|
|
|
|
|
height: calc(100% - 50px); |
|
|
} |
|
|
} |
|
|
|
|
|
|
|
|
.tab-content.active { |
|
|
.tab-content.active { |
|
|
@ -17,13 +30,19 @@ |
|
|
.cont-two { |
|
|
.cont-two { |
|
|
display: flex; |
|
|
display: flex; |
|
|
justify-content: space-around; |
|
|
justify-content: space-around; |
|
|
width: 90%; |
|
|
width: 100%; |
|
|
|
|
|
height: 90%; |
|
|
} |
|
|
} |
|
|
|
|
|
|
|
|
.cont-two .bootstrap-table { |
|
|
/*.cont-two .bootstrap-table { |
|
|
margin-left: -1.5%; |
|
|
margin-left: -0.5%; |
|
|
|
|
|
}*/ |
|
|
|
|
|
|
|
|
|
|
|
.cont-two .chart-box { |
|
|
|
|
|
margin: 0 0 0 10%; |
|
|
} |
|
|
} |
|
|
|
|
|
|
|
|
|
|
|
|
|
|
</style> |
|
|
</style> |
|
|
</head> |
|
|
</head> |
|
|
<body> |
|
|
<body> |
|
|
@ -87,15 +106,7 @@ |
|
|
<a class="btn btn-success btn-sm" onclick="searchComplaint1()"><i class="fa fa-search"></i> 搜索</a> |
|
|
<a class="btn btn-success btn-sm" onclick="searchComplaint1()"><i class="fa fa-search"></i> 搜索</a> |
|
|
<a class="btn btn-reset btn-sm" onclick="complaintRest(1)"><i class="fa fa-refresh"></i> 重置</a> |
|
|
<a class="btn btn-reset btn-sm" onclick="complaintRest(1)"><i class="fa fa-refresh"></i> 重置</a> |
|
|
<a class="btn btn-warning btn-sm" onclick="complaintDownload1()"><i class="fa fa-share-square-o"></i> 导出</a> |
|
|
<a class="btn btn-warning btn-sm" onclick="complaintDownload1()"><i class="fa fa-share-square-o"></i> 导出</a> |
|
|
<a id="closeButton" onclick="closeC()">关闭</a> |
|
|
|
|
|
</li> |
|
|
</li> |
|
|
<!--<ul> |
|
|
|
|
|
<li id="complaintA" th:fragment="complaintA"> |
|
|
|
|
|
<p th:text="|${year}年|"></p> |
|
|
|
|
|
<p th:text="|投诉数量 ${Number1}|"></p> |
|
|
|
|
|
<p th:text="|投诉对象 ${Number2}|"></p> |
|
|
|
|
|
</li> |
|
|
|
|
|
</ul>--> |
|
|
|
|
|
</ul> |
|
|
</ul> |
|
|
<div class="static-content"> |
|
|
<div class="static-content"> |
|
|
<ul> |
|
|
<ul> |
|
|
@ -110,7 +121,8 @@ |
|
|
</div> |
|
|
</div> |
|
|
</form> |
|
|
</form> |
|
|
<div class="col-sm-12 select-table table-bordered"> |
|
|
<div class="col-sm-12 select-table table-bordered"> |
|
|
<div id="detail" style="width: 500px; margin-left: 528px;margin-top: 111px;position: absolute;"> |
|
|
<div id="detail" class="detail-list"> |
|
|
|
|
|
<span id="closeButton" class="detail-close" onclick="closeC()">×</span> |
|
|
<table id="bootstrap-table"></table> |
|
|
<table id="bootstrap-table"></table> |
|
|
</div> |
|
|
</div> |
|
|
<table id="bootstrap-table1"></table> |
|
|
<table id="bootstrap-table1"></table> |
|
|
@ -182,7 +194,11 @@ |
|
|
</form> |
|
|
</form> |
|
|
<div class="cont-two"> |
|
|
<div class="cont-two"> |
|
|
<table id="bootstrap-table2" style="width: 750px;"></table> |
|
|
<table id="bootstrap-table2" style="width: 750px;"></table> |
|
|
<div id="container" style="width: 600px;height:450px;"></div> |
|
|
<!--<div id="container" style="width: 600px;height:450px;"></div>--> |
|
|
|
|
|
<div class="chart-box"> |
|
|
|
|
|
<h3 class="chart-title">投诉类型数量及占比</h3> |
|
|
|
|
|
<div id="echartComplaint" style="width: 600px;height:600px;"></div> |
|
|
|
|
|
</div> |
|
|
</div> |
|
|
</div> |
|
|
</div> |
|
|
</div> |
|
|
</div> |
|
|
</div> |
|
|
@ -193,7 +209,7 @@ |
|
|
<script th:inline="javascript"> |
|
|
<script th:inline="javascript"> |
|
|
var prefix = ctx + "code/complaintStatic"; |
|
|
var prefix = ctx + "code/complaintStatic"; |
|
|
var caseType=[[${@dict.getType('caseType')}]]; |
|
|
var caseType=[[${@dict.getType('caseType')}]]; |
|
|
var myChart = echarts.init(document.getElementById('container')); |
|
|
/*var myChart = echarts.init(document.getElementById('container'));*/ |
|
|
var pieData; |
|
|
var pieData; |
|
|
var deptName; |
|
|
var deptName; |
|
|
window.onload = function () { |
|
|
window.onload = function () { |
|
|
@ -385,7 +401,7 @@ |
|
|
} |
|
|
} |
|
|
}) |
|
|
}) |
|
|
} |
|
|
} |
|
|
function rTable(name,n){ |
|
|
/*function rTable(name,n){ |
|
|
var currentId=$('form').eq(n-1).attr('id') |
|
|
var currentId=$('form').eq(n-1).attr('id') |
|
|
var params = $.common.formToJSON(currentId); |
|
|
var params = $.common.formToJSON(currentId); |
|
|
$.ajax({ |
|
|
$.ajax({ |
|
|
@ -427,7 +443,7 @@ |
|
|
console.error("请求失败：",status,error); |
|
|
console.error("请求失败：",status,error); |
|
|
} |
|
|
} |
|
|
}) |
|
|
}) |
|
|
} |
|
|
}*/ |
|
|
function timeType1() { |
|
|
function timeType1() { |
|
|
var dateSearch = document.getElementById("dateSearch"); |
|
|
var dateSearch = document.getElementById("dateSearch"); |
|
|
console.log(dateSearch.value) |
|
|
console.log(dateSearch.value) |
|
|
@ -521,6 +537,63 @@ |
|
|
} |
|
|
} |
|
|
}) |
|
|
}) |
|
|
} |
|
|
} |
|
|
|
|
|
|
|
|
|
|
|
/*******echarts:投诉类型/占比*********/ |
|
|
|
|
|
|
|
|
|
|
|
const ecsh = echarts.init(document.getElementById("echartComplaint")); |
|
|
|
|
|
const optionsh = { |
|
|
|
|
|
tooltip: { |
|
|
|
|
|
trigger: 'item', |
|
|
|
|
|
formatter: '{b}: {c} ({d}%)' |
|
|
|
|
|
}, |
|
|
|
|
|
/*legend: { |
|
|
|
|
|
x : 'left', |
|
|
|
|
|
y : 'center', |
|
|
|
|
|
itemGap: 20, |
|
|
|
|
|
orient: 'vercital' |
|
|
|
|
|
},*/ |
|
|
|
|
|
color: ['#1f74f1', '#79e24a', '#41d5d3', '#f59036', '#fed100', '#ababac'], |
|
|
|
|
|
series: [{ |
|
|
|
|
|
top: '10%', |
|
|
|
|
|
left: '20%', |
|
|
|
|
|
type: 'pie', |
|
|
|
|
|
name: '名称', |
|
|
|
|
|
radius: ['20%', '28%'], |
|
|
|
|
|
center: ['50%', '25%'], |
|
|
|
|
|
label: { |
|
|
|
|
|
formatter: '{b}: {c} ({d}%)', |
|
|
|
|
|
borderWidth: 1, |
|
|
|
|
|
borderRadius: 4, |
|
|
|
|
|
color: '#4F4F4F', |
|
|
|
|
|
fontFamily: 'PingFangSC-Regular', |
|
|
|
|
|
fontSize: '14', |
|
|
|
|
|
rich: { |
|
|
|
|
|
a: { |
|
|
|
|
|
color: '#4F4F4F', |
|
|
|
|
|
lineHeight: 18, |
|
|
|
|
|
align: 'center' |
|
|
|
|
|
} |
|
|
|
|
|
} |
|
|
|
|
|
}, |
|
|
|
|
|
data: [ |
|
|
|
|
|
{value: 18, name: '违法执法'}, |
|
|
|
|
|
{value: 28, name: '违规执法'}, |
|
|
|
|
|
{value: 22, name: '执法不文明'}, |
|
|
|
|
|
{value: 12, name: '选择性执法'}, |
|
|
|
|
|
{value: 10, name: '其他'}, |
|
|
|
|
|
{value: 10, name: '入企不扫码'}, |
|
|
|
|
|
], |
|
|
|
|
|
}] |
|
|
|
|
|
}; |
|
|
|
|
|
ecsh.clear(); |
|
|
|
|
|
ecsh.setOption(optionsh); |
|
|
|
|
|
|
|
|
|
|
|
// 使用刚指定的配置项和数据显示图表。 |
|
|
|
|
|
myChart.setOption(option); |
|
|
|
|
|
window.addEventListener("resize",function(){ |
|
|
|
|
|
myChart.resize(); |
|
|
|
|
|
}); |
|
|
|
|
|
|
|
|
</script> |
|
|
</script> |
|
|
</body> |
|
|
</body> |
|
|
</html> |
|
|
</html> |
chenrui
2 years ago