Эх сурвалжийг харах

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

huZhiHao 5 жил өмнө
parent
commit
46f5ab89ce

+ 1 - 1
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>

+ 37 - 21
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;
@@ -219,9 +219,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">
 
@@ -236,15 +242,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>
@@ -333,7 +342,7 @@
                     //     processingData.push(argument.value);
                     //     // console.log(argument)
                     // }
-                    processingArray.forEach(function (argument){
+                    processingArray.forEach(function (argument) {
                         processingXAxisData.push(argument.name);
                         processingData.push(argument.value);
                     })
@@ -362,14 +371,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);
                     })
 
@@ -402,7 +411,7 @@
                     // for (var argument of data) {
                     //     legendData.push(argument.name);
                     // }
-                    data.forEach(function (argument){
+                    data.forEach(function (argument) {
                         legendData.push(argument.name);
                     })
 
@@ -458,7 +467,7 @@
                                 // for (var obj of data) {
                                 //     num += obj.value;
                                 // }
-                                data.forEach(function(obj){
+                                data.forEach(function (obj) {
                                     num += obj.value;
                                 })
                                 return num;
@@ -736,8 +745,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);
     }
@@ -798,8 +812,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;
         }
 

+ 51 - 41
src/main/resources/templates/admin/government/land_statistic/region.html

@@ -24,7 +24,7 @@
 
         .chartContent .chartLi {
             float: left;
-            height: 200px;
+            height: 300px;
             box-sizing: border-box;
         }
 
@@ -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>
@@ -287,7 +290,7 @@
                 <td th:text="*{useChangePassRate + '%'}"></td>
                 <td th:text="*{immovablesChangeApplyNum}"></td>
                 <td th:text="*{immovablesChangePassNum}"></td>
-                <td th:text="*{immovablesChangePassRate + '%'}"></td>
+                <td th:text="*{immovablesChangePassRate}"></td>
                 <td th:text="*{equityStructureChangeApplyNum}"></td>
                 <td th:text="*{equityStructureChangePassNum}"></td>
                 <td th:text="*{equityStructureChangePassRate}"></td>
@@ -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);
                     })
 
@@ -476,6 +482,7 @@
 
         // 指定图表的配置项和数据
         var option = {
+            color: ['#61A5E8', '#EECB5F'],
             title: {
                 text: title,
                 textStyle: {
@@ -493,7 +500,6 @@
                 bottom: 10,
                 data: legendData
             },
-            color: ['#61A5E8','#EECB5F'],
             series: [
                 {
                     name: title,
@@ -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;
@@ -545,6 +551,7 @@
 
         // 指定图表的配置项和数据
         option = {
+            color: ['#61A5E8'],
             title: {
                 text: title,
                 textStyle: {
@@ -608,6 +615,7 @@
 
         // 指定图表的配置项和数据
         var option = {
+            color: ['#7ECF51', '#B9646E', '#E3935D'],
             title: {
                 text: title,
                 textStyle: {
@@ -625,7 +633,9 @@
                 bottom: 10,
                 data: legendData
             },
-            color: ['#7ECF51', '#B9646E', '#E3935D'],
+            grid: {
+                containLabel: true
+            },
             series: [
                 {
                     name: title,
@@ -636,7 +646,7 @@
                         normal: {
                             show: true,
                             zlevel: 0,
-                            position: 'top',
+                            position: 'outside',
                             formatter: '{b}: {c}'
                             // formatter: function () {
                             //     var num = 0;
@@ -656,7 +666,7 @@
                     },
                     labelLine: {
                         normal: {
-                            show: false
+                            show: true
                         }
                     },
                     data: data
@@ -704,7 +714,7 @@
             //     currentIndex: 11,
             //     data: getMonth()
             // },
-            color: ['#61A5E8', '#E3935D', '#7ECF51', '#B9646E'],
+            color: ['#61A5E8', '#E3935D', '#7ECF51', '#B9464E'],
             tooltip: {
                 trigger: 'axis',
                 axisPointer: {
@@ -760,7 +770,7 @@
 
         // 指定图表的配置项和数据
         option = {
-            color: ['#7ECF51', '#B9646E', '#EECB5F'],
+            color: ['#7ECF51', '#B9464E', '#E3935D'],
             tooltip: {
                 trigger: 'axis',
                 axisPointer: {            // 坐标轴指示器,坐标轴触发有效
@@ -806,6 +816,14 @@
         $('#monthly_approve_statistic').load(url);
     }
 
+    //板块统计表
+    function getPlateStatistic() {
+        var start_time = $('#plate_start_time').val();
+        var end_time = $('#plate_end_time').val();
+        // 装载局部刷新返回的页面
+        $('#plate_approve_statistic').load(pagePath + "/land_statistic/approve/statistic/plate?start_time=" + start_time + "&end_time=" + end_time);
+    }
+
     //导出月度统计
     function exportMonthlyStatistic() {
         var start_time = $('#monthly_start_time').val();
@@ -820,14 +838,6 @@
         window.open(pagePath + "/land_statistic/approve/statistic/plate/export?start_time=" + start_time + "&end_time=" + end_time);
     }
 
-    //板块统计表
-    function getPlateStatistic() {
-        var start_time = $('#plate_start_time').val();
-        var end_time = $('#plate_end_time').val();
-        // 装载局部刷新返回的页面
-        $('#plate_approve_statistic').load(pagePath + "/land_statistic/approve/statistic/plate?start_time=" + start_time + "&end_time=" + end_time);
-    }
-
     $(document).on("click", ".liHead", function () {
         // console.log("点击了", $(this).next().is(":hidden"))
         if (!$(this).next().is(":hidden")) {