修改 调整列宽 增加日期选择控件

src/main/resources/templates/admin/common/common.html

@@ -37,7 +37,6 @@
 
 
 
-
     <!--<script type="text/javascript" th:src="@{/js/lib/jquery-1.11.0.min.js}"></script>-->
     <script type="text/javascript" th:src="@{/home/plugin/jquery-1.11.3.min.js}"></script>
     <script type="text/javascript" th:src="@{/js/lib/jquery.serializejson.min.js}"></script>
@@ -67,6 +66,7 @@
     <!--<script type="text/javascript" th:src="@{/js/common/bootstrap.min.js}"></script>-->
     <link rel="stylesheet" type="text/css" th:href="@{/home/css/jquery.dropdown.min.css}" />
     <script th:src="@{/js/common/jquery.dropdown.min.js}"></script>
+<!--    <script src="https://cdnjs.cloudflare.com/ajax/libs/echarts/4.6.0/echarts.js" integrity="sha256-7EiwL8B98LLHL+HK590Nc9KF77prJ4aboPd/3fKiQ88=" crossorigin="anonymous"></script>-->
     <script th:src="@{/js/common/echarts.js}"></script>
     <!--[if lte IE 8]>
     <script th:src="@{/home/plugin/html5shiv.min.js}" type="text/javascript"></script>

src/main/resources/templates/admin/government/land_statistic/plate.html

@@ -143,7 +143,7 @@
             border: 1px solid #e2e3e3;
             border-right: none;
             background-color: #ffffff;
-            padding: 8px 20px;
+            padding: 4px 20px;
             cursor: pointer;
         }
 
@@ -177,7 +177,7 @@
             *zoom: 1; /*ie6清除浮动的方式 *号只有IE6-IE7执行，其他浏览器不执行*/
         }
 
-        .chartContent{
+        .chartContent {
             padding-left: 20px;
             padding-right: 20px;
             border-bottom: 1px solid #ded7d5;
@@ -216,9 +216,15 @@
     </div>
 </div>
 <div class="date_tab_list clearfix">
-    <span class="date_tab_item" data-type="-7">7天</span>
+    <span class="date_tab_item active_date" data-type="-7">7天</span>
     <span class="date_tab_item" data-type="-14">14天</span>
-    <span class="date_tab_item" style="border-right: 1px solid #e2e3e3;" data-type="-30">30天</span>
+    <span class="date_tab_item" data-type="-30">30天</span>
+    <input class="Wdate input-text" type="text" th:id="daily_monthly_start_time" th:name="daily_monthly_start_time"
+           style="float:left; width: 150px;border-right: none;"
+           onclick="WdatePicker({dateFmt:'yyyy-MM-dd',maxDate:'#F{$dp.$D(\'daily_monthly_end_time\')}',isShowClear:true,readOnly:true,onpicked: function(){invokeGetDailyStatisticAndGetTypeStatistic()} })"/>
+    <input class="Wdate input-text" type="text" th:id="daily_monthly_end_time" th:name="daily_monthly_end_time"
+           style="float:left; width: 150px;"
+           onclick="WdatePicker({dateFmt:'yyyy-MM-dd',minDate:'#F{$dp.$D(\'daily_monthly_start_time\')}',isShowClear:true,readOnly:true,onpicked: function(){invokeGetDailyStatisticAndGetTypeStatistic()} })"/>
 </div>
 <div class="chartContent">
     <div class="title">每日统计</div>
@@ -230,15 +236,18 @@
 </div>
 <div class="chartContent">
     <div class="title">月度审核统计表</div>
-    <input class="Wdate input-text" type="text" th:id="monthly_start_time" th:name="monthly_start_time"
-           style="float:left; width: 150px;"
-           onclick="WdatePicker({dateFmt:'yyyy-MM-dd',maxDate:'#F{$dp.$D(\'monthly_end_time\')}',isShowClear:true,readOnly:true,onpicked: function(){getMontylyApproveStatistic()} })"/>
-    <input class="Wdate input-text" type="text" th:id="monthly_end_time" th:name="monthly_end_time"
-           style="float:left; width: 150px;"
-           onclick="WdatePicker({dateFmt:'yyyy-MM-dd',minDate:'#F{$dp.$D(\'monthly_start_time\')}',isShowClear:true,readOnly:true,onpicked: function(){getMontylyApproveStatistic()} })"/>
-    <a th:onclick="'javascript:exportMonthlyStatistic();'"
-       class="btn btn-secondary radius" type="button">导出</a>
-    <div class="table001" style="width: 96%; margin-left: 2%;margin-top:15px;">
+    <div>
+        <input class="Wdate input-text" type="text" th:id="monthly_start_time" th:name="monthly_start_time"
+               style="float:left; width: 150px;margin-right: 5px;"
+               onclick="WdatePicker({dateFmt:'yyyy-MM-dd',maxDate:'#F{$dp.$D(\'monthly_end_time\')}',isShowClear:true,readOnly:true,onpicked: function(){getMontylyApproveStatistic()} })"/>
+        <input class="Wdate input-text" type="text" th:id="monthly_end_time" th:name="monthly_end_time"
+               style="float:left; width: 150px;margin-right: 5px;"
+               onclick="WdatePicker({dateFmt:'yyyy-MM-dd',minDate:'#F{$dp.$D(\'monthly_start_time\')}',isShowClear:true,readOnly:true,onpicked: function(){getMontylyApproveStatistic()} })"/>
+        <a th:onclick="'javascript:exportMonthlyStatistic();'"
+           class="btn btn-secondary radius" type="button">导出</a>
+    </div>
+    <div class="table001" style="margin-top:15px;">
+        <!--    <div class="table001" style="width: 96%; margin-left: 2%;margin-top:15px;">-->
         <table id="monthly_approve_statistic" th:fragment="approve_statistic_monthly">
             <thead>
             <tr>
@@ -327,7 +336,7 @@
                     //     processingData.push(argument.value);
                     //     // console.log(argument)
                     // }
-                    processingArray.forEach(function (argument){
+                    processingArray.forEach(function (argument) {
                         processingXAxisData.push(argument.name);
                         processingData.push(argument.value);
                     })
@@ -356,14 +365,14 @@
             },
             success: function (result) {
                 if (result.success) {
-                    console.log(result.obj)
+                    // console.log(result.obj)
                     var data = result.obj.data
                     var xAxisName = result.obj.xAxisName;
                     var legendData = new Array();
                     // for (var argument of data) {
                     //     legendData.push(argument.name);
                     // }
-                    data.forEach(function (argument){
+                    data.forEach(function (argument) {
                         legendData.push(argument.name);
                     })
 
@@ -396,7 +405,7 @@
                     // for (var argument of data) {
                     //     legendData.push(argument.name);
                     // }
-                    data.forEach(function (argument){
+                    data.forEach(function (argument) {
                         legendData.push(argument.name);
                     })
 
@@ -452,7 +461,7 @@
                                 // for (var obj of data) {
                                 //     num += obj.value;
                                 // }
-                                data.forEach(function(obj){
+                                data.forEach(function (obj) {
                                     num += obj.value;
                                 })
                                 return num;
@@ -730,8 +739,13 @@
             + start_time + "&end_time=" + end_time + "&street_id=" + streetId);
     }
 
-    //全局修改时间
-    function renderTime() {
+    //调用每日统计和周期统计
+    function invokeGetDailyStatisticAndGetTypeStatistic() {
+
+        startTime = $('#daily_monthly_start_time').val();
+        endTime = $('#daily_monthly_end_time').val();
+        console.log(startTime)
+
         getDailyStatistic(streetId, startTime, endTime);
         getTypeStatistic(streetId, startTime, endTime);
     }
@@ -792,8 +806,10 @@
             var time2 = year2 + "-" + month2 + "-" + day2;
             // console.log(time2);
             startTime = time2;
+            $('#daily_monthly_start_time').val(startTime);
+            $('#daily_monthly_end_time').val(endTime);
 
-            renderTime()
+            invokeGetDailyStatisticAndGetTypeStatistic()
             return time2;
         }
 

src/main/resources/templates/admin/government/land_statistic/region.html

@@ -182,7 +182,7 @@
             *zoom: 1; /*ie6清除浮动的方式 *号只有IE6-IE7执行，其他浏览器不执行*/
         }
 
-        .chartContent{
+        .chartContent {
             padding-left: 20px;
             padding-right: 20px;
             border-bottom: 1px solid #ded7d5;
@@ -238,15 +238,18 @@
 </div>
 <div class="chartContent">
     <div class="title">月度审核统计表</div>
-    <input class="Wdate input-text" type="text" th:id="monthly_start_time" th:name="monthly_start_time"
-           style="float:left; width: 150px;"
-           onclick="WdatePicker({dateFmt:'yyyy-MM-dd',maxDate:'#F{$dp.$D(\'monthly_end_time\')}',isShowClear:true,readOnly:true,onpicked: function(){getMontylyApproveStatistic()} })"/>
-    <input class="Wdate input-text" type="text" th:id="monthly_end_time" th:name="monthly_end_time"
-           style="float:left; width: 150px;"
-           onclick="WdatePicker({dateFmt:'yyyy-MM-dd',minDate:'#F{$dp.$D(\'monthly_start_time\')}',isShowClear:true,readOnly:true,onpicked: function(){getMontylyApproveStatistic()} })"/>
-    <a th:onclick="'javascript:exportMonthlyStatistic();'"
-       class="btn btn-secondary radius" type="button">导出</a>
-    <div class="table001" style="width: 96%; margin-left: 2%;margin-top:15px;">
+    <div>
+        <input class="Wdate input-text" type="text" th:id="monthly_start_time" th:name="monthly_start_time"
+               style="float:left; width: 150px;margin-right: 5px;"
+               onclick="WdatePicker({dateFmt:'yyyy-MM-dd',maxDate:'#F{$dp.$D(\'monthly_end_time\')}',isShowClear:true,readOnly:true,onpicked: function(){getMontylyApproveStatistic()} })"/>
+        <input class="Wdate input-text" type="text" th:id="monthly_end_time" th:name="monthly_end_time"
+               style="float:left; width: 150px;margin-right: 5px;"
+               onclick="WdatePicker({dateFmt:'yyyy-MM-dd',minDate:'#F{$dp.$D(\'monthly_start_time\')}',isShowClear:true,readOnly:true,onpicked: function(){getMontylyApproveStatistic()} })"/>
+        <a th:onclick="'javascript:exportMonthlyStatistic();'"
+           class="btn btn-secondary radius" type="button">导出</a>
+    </div>
+    <div class="table001" style="margin-top:15px;">
+        <!--        <div class="table001" style="width: 96%; margin-left: 2%;margin-top:15px;">-->
         <table id="monthly_approve_statistic" th:fragment="approve_statistic_monthly">
             <thead>
             <tr>
@@ -301,17 +304,19 @@
 </div>
 <div class="chartContent">
     <div class="title">板块统计表</div>
-    <input class="Wdate input-text" type="text" th:id="plate_start_time" th:name="plate_start_time"
-           style="float:left; width: 150px;"
-           onclick="WdatePicker({dateFmt:'yyyy-MM-dd',maxDate:'#F{$dp.$D(\'plate_end_time\')}',isShowClear:true,readOnly:true,onpicked: function(){getPlateStatistic()} })"/>
-    <input class="Wdate input-text" type="text" th:id="plate_end_time" th:name="plate_end_time"
-           style="float:left; width: 150px;"
-           onclick="WdatePicker({dateFmt:'yyyy-MM-dd',minDate:'#F{$dp.$D(\'plate_start_time\')}',isShowClear:true,readOnly:true,onpicked: function(){getPlateStatistic()} })"/>
-    <a th:onclick="'javascript:exportPlateStatistic();'"
-       class="btn btn-secondary radius" type="button">导出</a>
-
+    <div>
+        <input class="Wdate input-text" type="text" th:id="plate_start_time" th:name="plate_start_time"
+               style="float:left; width: 150px;margin-right: 5px;"
+               onclick="WdatePicker({dateFmt:'yyyy-MM-dd',maxDate:'#F{$dp.$D(\'plate_end_time\')}',isShowClear:true,readOnly:true,onpicked: function(){getPlateStatistic()} })"/>
+        <input class="Wdate input-text" type="text" th:id="plate_end_time" th:name="plate_end_time"
+               style="float:left; width: 150px;margin-right: 5px;"
+               onclick="WdatePicker({dateFmt:'yyyy-MM-dd',minDate:'#F{$dp.$D(\'plate_start_time\')}',isShowClear:true,readOnly:true,onpicked: function(){getPlateStatistic()} })"/>
+        <a th:onclick="'javascript:exportPlateStatistic();'"
+           class="btn btn-secondary radius" type="button">导出</a>
+    </div>
     <div id="plate_approve_statistic" th:fragment="approve_statistic_plate" style="margin-top: 15px;">
-        <div class="tableHead" style="width: 96%; margin-left: 2%;">
+        <div class="tableHead">
+            <!--        <div class="tableHead" style="width: 96%; margin-left: 2%;">-->
             <div class="tableHeadLi" style="width:9%;" th:each="model,iterStat:${head}" th:object="${model}"
                  th:if="${iterStat.index==0}">&nbsp;
             </div>
@@ -329,7 +334,8 @@
             <!--            <div class="tableHeadLi" style="width:10%;">区外</div>-->
             <!--            <div class="tableHeadLi" style="width:10%;">合计</div>-->
         </div>
-        <div class="tableBody" style="width: 96%; margin-left: 2%;">
+        <div class="tableBody">
+            <!--        <div class="tableBody" style="width: 96%; margin-left: 2%;">-->
             <div class="tableBodyLi" th:each="model,iterStat:${data}" th:object="${model}">
                 <div class="liHead">
                     <div class="liHeadTopTd" style="width:9%;">
@@ -386,7 +392,7 @@
                     //     processingData.push(argument.value);
                     //     // console.log(argument)
                     // }
-                    processingArray.forEach(function(argument){
+                    processingArray.forEach(function (argument) {
                         processingXAxisData.push(argument.name);
                         processingData.push(argument.value);
                     })
@@ -422,7 +428,7 @@
                     // for (var argument of data) {
                     //     legendData.push(argument.name);
                     // }
-                    data.forEach(function(argument){
+                    data.forEach(function (argument) {
                         legendData.push(argument.name);
                     })
                     renderMonthlyTypeBar(legendData, xAxisName, data);
@@ -454,7 +460,7 @@
                     // for (var argument of data) {
                     //     legendData.push(argument.name);
                     // }
-                    data.forEach(function(argument){
+                    data.forEach(function (argument) {
                         legendData.push(argument.name);
                     })
 
@@ -510,7 +516,7 @@
                                 // for (var obj of data) {
                                 //     num += obj.value;
                                 // }
-                                data.forEach(function(obj){
+                                data.forEach(function (obj) {
                                     num += obj.value;
                                 })
                                 return num;
@@ -627,6 +633,9 @@
                 bottom: 10,
                 data: legendData
             },
+            grid: {
+                containLabel: true
+            },
             series: [
                 {
                     name: title,
@@ -637,7 +646,7 @@
                         normal: {
                             show: true,
                             zlevel: 0,
-                            position: 'top',
+                            position: 'outside',
                             formatter: '{b}: {c}'
                             // formatter: function () {
                             //     var num = 0;
@@ -657,7 +666,7 @@
                     },
                     labelLine: {
                         normal: {
-                            show: false
+                            show: true
                         }
                     },
                     data: data