From fa0414b2f44aa07c282b73195f7ea2ef3ab1eb74 Mon Sep 17 00:00:00 2001
From: czt <czt18638530771@163.com>
Date: 星期四, 25 十二月 2025 19:19:53 +0800
Subject: [PATCH] 首页大屏数据交互2
---
fzzy-igdss-web/src/main/resources/templates/group/index.html | 389 +++++++++++++++++++++++++++++++++++++++++--------------
1 files changed, 290 insertions(+), 99 deletions(-)
diff --git a/fzzy-igdss-web/src/main/resources/templates/group/index.html b/fzzy-igdss-web/src/main/resources/templates/group/index.html
index bee2800..5dddee8 100644
--- a/fzzy-igdss-web/src/main/resources/templates/group/index.html
+++ b/fzzy-igdss-web/src/main/resources/templates/group/index.html
@@ -17,6 +17,87 @@
display: block;
margin: 0 auto;
}
+
+ .item4 {
+ height: 280px;
+ width: 100%;
+ float: left;
+ }
+
+ .bgt {
+ background-position: top left;
+ background-size: 100% 100%;
+ background-repeat: no-repeat;
+ position: relative;
+ }
+
+ .item_cont .bd {
+ padding: 10px;
+ overflow: hidden;
+ position: relative;
+ /*padding-left: 60px;*/
+ }
+
+ .item_cont .bd .year {
+ width: 49px;
+ height: 26px;
+ border: 1px solid #21B1FF;
+ border-radius: 5px;
+ position: absolute;
+ bottom: 35px;
+ text-align: center;
+ z-index: 22;
+ left: 5px;
+ font-size: 12px;
+ line-height: 26px;
+ background: #05152f;
+ color: #fff;
+ }
+
+ .item_cont .bd ul li {
+ margin: 0 18px;
+ overflow: hidden;
+ text-align: center;
+ position: relative;
+ }
+
+ .item_cont .bd ul li .pic {
+ border: 3px solid #3288FF;
+ border-radius: 10px;
+ margin-bottom: 50px;
+ }
+
+ .item_cont .bd ul li img {
+ width: 240px;
+ height: 160px;
+ border-radius: 8px;
+
+ }
+
+ .item_cont .bd::after {
+ content: "";
+ width: 99.2%;
+ position: absolute;
+ bottom: 65px;
+ left: 5px;
+ z-index: 1;
+ border-bottom: 1px dashed #3288FF;
+ }
+
+ .item_cont .bd ul li .tit{
+ color: #FFFFFF;
+ }
+
+ .item_cont .bd ul li::after {
+ content: "";
+ width: 29px;
+ height: 53px;
+ position: absolute;
+ bottom: 40px;
+ left: 45%;
+ z-index: 0;
+ background: url(/img/web/group/icon_dot4.png) no-repeat bottom 0 center;
+ }
</style>
</head>
<body style="overflow:hidden;">
@@ -24,7 +105,8 @@
<div class="container">
<div class="i-top">
<h1 ondblclick="changeScreen()" class="i-top-tit"><span th:text="${sysName}">鏅烘収绮簱璐ㄦ娂鐩戠澶у睆</span></h1>
- <p ondblclick="changeScreen()" class="i-top-p" id="sloganText">鏂扮枂浼婂畞鍐滄潙鍟嗕笟閾惰鑲′唤鏈夐檺鍏徃鈥斺�旀櫤鎱х洃绠″钩鍙�</p>
+ <p ondblclick="changeScreen()" class="i-top-p" id="sloganText">
+ 鏂扮枂浼婂畞鍐滄潙鍟嗕笟閾惰鑲′唤鏈夐檺鍏徃鈥斺�旀櫤鎱х洃绠″钩鍙�</p>
<div class="i-navBar">
<a href="javaScript:;" onclick="changePage('index')" class="i-nav3 active">棣栭〉</a>
<a href="javaScript:;" onclick="changePage('gis')" class="i-nav4">GIS鐩戠</a>
@@ -57,15 +139,15 @@
</li>
<li>
<h3>搴撶偣锛堜釜锛�</h3>
- <p id="deptAreaNum">0</p>
+ <p id="deptNum">0</p>
</li>
<li>
<h3>浠撳簱锛堜釜锛�</h3>
- <p id="depotSum">0</p>
+ <p id="depotNum">0</p>
</li>
<li>
- <h3>绛掍粨锛堜釜锛�</h3>
- <p id="depotOilSum">0</p>
+ <h3>璐ㄦ娂浠擄紙涓級</h3>
+ <p id="depotBankNum">0</p>
</li>
</ul>
@@ -73,67 +155,77 @@
</div><!-- i-m1 end -->
<div class="left-m2">
- <div class="panel-title" id="panel-title">鐩戠鍔ㄦ�佷俊鎭�</div>
+ <div class="panel-title" id="panel-title">搴撳尯AI浜嬩欢淇℃伅</div>
<div class="panel-content">
<div class="panel-content-head">
- <span class="head-item">鎵�灞炲簱鐐�</span>
+ <span class="head-item" style="flex: 1.5;">鎵�灞炲簱鐐�</span>
<span class="head-item">褰撴棩鍒嗘瀽</span>
- <span class="head-item">杩戜竷澶╃疮璁℃鏁�</span>
+ <span class="head-item">鏃ユ湡</span>
</div>
<div class="panel-content-body" id="inventoryInfoBox">
<div id="inventoryInfo">
- <div class="panel-content-body-tr">
- <span class="body-item">搴撳尯1</span>
- <span class="body-item">褰撴棩鍒嗘瀽涓�鍒囨甯�</span>
- <span class="body-item" style="flex: 0.3;">04/22</span>
- </div>
- <div class="panel-content-body-tr">
- <span class="body-item">搴撳尯2</span>
- <span class="body-item">褰撴棩鍒嗘瀽涓�鍒囨甯�</span>
- <span class="body-item" style="flex: 0.3;">04/22</span>
- </div>
- <div class="panel-content-body-tr">
- <span class="body-item">搴撳尯3</span>
- <span class="body-item">褰撴棩鍒嗘瀽涓�鍒囨甯�</span>
- <span class="body-item" style="flex: 0.3;">04/22</span>
- </div>
- <div class="panel-content-body-tr">
- <span class="body-item">搴撳尯4</span>
- <span class="body-item">褰撴棩鍒嗘瀽涓�鍒囨甯�</span>
- <span class="body-item" style="flex: 0.3;">04/22</span>
- </div>
- <div class="panel-content-body-tr">
- <span class="body-item">搴撳尯5</span>
- <span class="body-item">褰撴棩鍒嗘瀽涓�鍒囨甯�</span>
- <span class="body-item" style="flex: 0.3;">04/22</span>
- </div>
- <div class="panel-content-body-tr">
- <span class="body-item">搴撳尯6</span>
- <span class="body-item">褰撴棩鍒嗘瀽涓�鍒囨甯�</span>
- <span class="body-item" style="flex: 0.3;">04/22</span>
- </div>
- <div class="panel-content-body-tr">
- <span class="body-item">搴撳尯7</span>
- <span class="body-item">褰撴棩鍒嗘瀽涓�鍒囨甯�</span>
- <span class="body-item" style="flex: 0.3;">04/22</span>
- </div>
- <div class="panel-content-body-tr">
- <span class="body-item">搴撳尯8</span>
- <span class="body-item">褰撴棩鍒嗘瀽涓�鍒囨甯�</span>
- <span class="body-item" style="flex: 0.3;">04/22</span>
- </div>
- <div class="panel-content-body-tr">
- <span class="body-item">搴撳尯9</span>
- <span class="body-item">褰撴棩鍒嗘瀽涓�鍒囨甯�</span>
- <span class="body-item" style="flex: 0.3;">04/22</span>
- </div>
- <div class="panel-content-body-tr">
- <span class="body-item">搴撳尯10</span>
- <span class="body-item">褰撴棩鍒嗘瀽涓�鍒囨甯�</span>
- <span class="body-item" style="flex: 0.3;">04/22</span>
- </div>
+<!-- <div class="panel-content-body-tr">-->
+<!-- <span class="body-item sp">浼婂畞鍘垮悍杈惧啘涓氬彂灞曟湁闄愬叕鍙�</span>-->
+<!-- <span class="body-item">褰撴棩涓�鍒囨甯�</span>-->
+<!-- <span class="body-item" >杩�7鏃ヤ竴鍒囨甯�</span>-->
+<!-- </div>-->
+<!-- <div class="panel-content-body-tr">-->
+<!-- <span class="body-item sp">浼婂畞鍘挎亽杈惧啘涓氬彂灞曟湁闄愬叕鍙�</span>-->
+<!-- <span class="body-item">褰撴棩涓�鍒囨甯�</span>-->
+<!-- <span class="body-item" >杩�7鏃ヤ竴鍒囨甯�</span>-->
+<!-- </div>-->
+<!-- <div class="panel-content-body-tr">-->
+<!-- <span class="body-item sp">浼婂畞鍘胯壘瑗跨儹鏅儤骞插巶</span>-->
+<!-- <span class="body-item">褰撴棩涓�鍒囨甯�</span>-->
+<!-- <span class="body-item" >杩�7鏃ヤ竴鍒囨甯�</span>-->
+<!-- </div>-->
+<!-- <div class="panel-content-body-tr">-->
+<!-- <span class="body-item sp">灏煎嫆鍏嬪幙鏈ㄦ柉涔℃綐鍒氱儤骞插巶</span>-->
+<!-- <span class="body-item">褰撴棩涓�鍒囨甯�</span>-->
+<!-- <span class="body-item" >杩�7鏃ヤ竴鍒囨甯�</span>-->
+<!-- </div>-->
+<!-- <div class="panel-content-body-tr">-->
+<!-- <span class="body-item sp">鏂扮枂浼婂畞淇濆仴楗叉枡鏈夐檺鍏徃搴撳尯</span>-->
+<!-- <span class="body-item">褰撴棩涓�鍒囨甯�</span>-->
+<!-- <span class="body-item" >杩�7鏃ヤ竴鍒囨甯�</span>-->
+<!-- </div>-->
+<!-- <div class="panel-content-body-tr">-->
+<!-- <span class="body-item sp">浼婂畞鍘垮嚡婧愮帀绫崇妞嶅啘姘戜笓涓氬悎浣滅ぞ</span>-->
+<!-- <span class="body-item">褰撴棩涓�鍒囨甯�</span>-->
+<!-- <span class="body-item" >杩�7鏃ヤ竴鍒囨甯�</span>-->
+<!-- </div>-->
+<!-- <div class="panel-content-body-tr">-->
+<!-- <span class="body-item sp">浼婂畞鍘跨帀婧愬啘鍓骇鍝佽喘閿�涓撲笟鍚堜綔绀�</span>-->
+<!-- <span class="body-item">褰撴棩涓�鍒囨甯�</span>-->
+<!-- <span class="body-item" >杩�7鏃ヤ竴鍒囨甯�</span>-->
+<!-- </div>-->
+<!-- <div class="panel-content-body-tr">-->
+<!-- <span class="body-item sp">鏂扮枂鐗熸皬璋烽噾鍐滀笟绉戞妧鏈夐檺璐ｄ换鍏徃搴撳尯</span>-->
+<!-- <span class="body-item">褰撴棩涓�鍒囨甯�</span>-->
+<!-- <span class="body-item" >杩�7鏃ヤ竴鍒囨甯�</span>-->
+<!-- </div>-->
+<!-- <div class="panel-content-body-tr">-->
+<!-- <span class="body-item sp">鏂扮枂骞挎嘲闅嗗啘涓氬彂灞曟湁闄愬叕鍙�</span>-->
+<!-- <span class="body-item">褰撴棩涓�鍒囨甯�</span>-->
+<!-- <span class="body-item" >杩�7鏃ヤ竴鍒囨甯�</span>-->
+<!-- </div>-->
+<!-- <div class="panel-content-body-tr">-->
+<!-- <span class="body-item sp">浼婂畞鍘垮箍绮晢璐告湁闄愬叕鍙稿簱鍖�</span>-->
+<!-- <span class="body-item">褰撴棩涓�鍒囨甯�</span>-->
+<!-- <span class="body-item" >杩�7鏃ヤ竴鍒囨甯�</span>-->
+<!-- </div>-->
+<!-- <div class="panel-content-body-tr">-->
+<!-- <span class="body-item sp">鏄嫃75鍥�</span>-->
+<!-- <span class="body-item">褰撴棩涓�鍒囨甯�</span>-->
+<!-- <span class="body-item" >杩�7鏃ヤ竴鍒囨甯�</span>-->
+<!-- </div>-->
+<!-- <div class="panel-content-body-tr">-->
+<!-- <span class="body-item sp">鏄嫃77鍥�</span>-->
+<!-- <span class="body-item">褰撴棩涓�鍒囨甯�</span>-->
+<!-- <span class="body-item" >杩�7鏃ヤ竴鍒囨甯�</span>-->
+<!-- </div>-->
</div>
</div>
</div>
@@ -171,7 +263,7 @@
<h3>鏁ｇ伯 (鍚�)</h3>
</li>
<li>
- <p id="oilSum">0</p>
+ <p id="packFoodSum">0</p>
<h3>鎴愬搧 (鍚�)</h3>
</li>
</ul>
@@ -184,33 +276,33 @@
<div class="panel-title">搴撶偣淇℃伅</div>
<div class="right-topInfo-address">
<i class="i-icon32"><img th:src="@{/img/web/group/icon-address.png}" alt=""></i>
- <span id="cityAndCounty">涔岄瞾鏈ㄩ綈甯�</span>
+ <span id="county">涔岄瞾鏈ㄩ綈甯�</span>
</div>
<div class="panel-content">
- <h2 class="right-topInfo-kd-h" id="deptAreaName">搴撳尯1</h2>
+ <h2 class="right-topInfo-kd-h" id="deptName">搴撳尯1</h2>
<div class="right-topInfo-kd">
<div class="right-topInfo-kd-item">
- <h3>褰撴棩鍏ュ簱鏁帮紙涓級</h3>
- <p id="depotNum">0</p>
+ <h3>褰撴棩鍏ュ簱鍗曟暟锛堜釜锛�</h3>
+ <p id="inNum">0</p>
</div>
<div class="right-topInfo-kd-item">
- <h3>褰撴棩鍑哄簱鏁帮紙涓級</h3>
- <p id="depotOilNum">0</p>
+ <h3>褰撴棩鍑哄簱鍗曟暟锛堜釜锛�</h3>
+ <p id="outNum">0</p>
</div>
</div>
<ul class="right-topInfo-kd-list right-topInfo-jg">
<li>
- <p id="foodNum">0</p>
+ <p id="depotNumber">0</p>
<h3>浠撳簱鏁帮紙涓級</h3>
</li>
<li>
- <p id="oilNum">0</p>
- <h3>鍌ㄧ伯鏁帮紙鍚級</h3>
+ <p id="depotBankNumber">0</p>
+ <h3>璐ㄦ娂浠撴暟锛堜釜锛�</h3>
</li>
<li>
- <p id="area">0</p>
- <h3>鍗犲湴闈㈢Н锛坢虏锛�</h3>
+ <p id="storageNum">0</p>
+ <h3>搴撳瓨鏁帮紙鍚級</h3>
</li>
</ul>
</div>
@@ -221,35 +313,131 @@
</div><!-- right-top end -->
<div class="right-bottom bottom-container">
- <div class="panel-title" id="pieCharTitle">鏁伴噺缁熻</div>
+ <div class="panel-title" id="pieCharTitle">鎶撴媿璺熻釜</div>
+ <!-- <div class="panel-content" style="position: relative;">-->
+ <!-- <div class="tubiao-Carousel">-->
+ <div class="item4 bgt follow">
+ <div class="item_cont">
+ <div class="bd">
+<!-- <div class="year">2025骞�</div>-->
+ <div class="tempWrap" style="overflow:hidden; position:relative; width:100%">
+ <ul id="snapList" style="width: 2280px; position: relative; overflow: hidden; padding: 0px; margin: 0px; left: -980px;">
+<!-- <li style="float: left; width: 246px;">-->
+<!-- <div class="item">-->
+<!-- <div class="pic">-->
+<!-- <img th:src="@{/img/web/group/pic2.jpg}" alt="">-->
+<!-- </div>-->
+<!-- <div class="tit">11-15 15:00:20</div>-->
+<!-- <div class="tit">浼婂畞鍘垮悍杈惧啘涓氬彂灞曟湁闄愬叕鍙�</div>-->
+<!-- </div>-->
+<!-- </li>-->
+<!-- <li style="float: left; width: 246px;">-->
+<!-- <div class="item">-->
+<!-- <div class="pic">-->
+<!-- <img th:src="@{/img/web/group/pic1.jpg}" alt="">-->
+<!-- </div>-->
+<!-- <div class="tit">11-15 15:00:20</div>-->
+<!-- <div class="tit">浼婂畞鍘垮悍杈惧啘涓氬彂灞曟湁闄愬叕鍙�</div>-->
+<!-- </div>-->
+<!-- </li>-->
+<!-- <li style="float: left; width: 246px;">-->
+<!-- <div class="item">-->
+<!-- <div class="pic">-->
+<!-- <img th:src="@{/img/web/group/pic2.jpg}" alt="">-->
+<!-- </div>-->
+<!-- <div class="tit">11-15 15:00:20</div>-->
+<!-- <div class="tit">浼婂畞鍘垮悍杈惧啘涓氬彂灞曟湁闄愬叕鍙�</div>-->
+<!-- </div>-->
+<!-- </li>-->
+<!-- <li style="float: left; width: 246px;">-->
+<!-- <div class="item">-->
+<!-- <div class="pic">-->
+<!-- <img th:src="@{/img/web/group/pic3.jpg}" alt="">-->
+<!-- </div>-->
+<!-- <div class="tit">11-15 15:00:20</div>-->
+<!-- <div class="tit">浼婂畞鍘垮悍杈惧啘涓氬彂灞曟湁闄愬叕鍙�</div>-->
+<!-- </div>-->
+<!-- </li>-->
+<!-- <li style="float: left; width: 246px;">-->
+<!-- <div class="item">-->
+<!-- <div class="pic">-->
+<!-- <img th:src="@{/img/web/group/pic4.jpg}" alt="">-->
+<!-- </div>-->
+<!-- <div class="tit">11-15 15:00:20</div>-->
+<!-- <div class="tit">浼婂畞鍘垮悍杈惧啘涓氬彂灞曟湁闄愬叕鍙�</div>-->
+<!-- </div>-->
+<!-- </li>-->
+<!-- <li style="float: left; width: 246px;">-->
+<!-- <div class="item">-->
+<!-- <div class="pic">-->
+<!-- <img th:src="@{/img/web/group/pic1.jpg}" alt="">-->
+<!-- </div>-->
+<!-- <div class="tit">11-15 15:00:20</div>-->
+<!-- <div class="tit">浼婂畞鍘垮悍杈惧啘涓氬彂灞曟湁闄愬叕鍙�</div>-->
+<!-- </div>-->
+<!-- </li>-->
+<!-- <li style="float: left; width: 246px;">-->
+<!-- <div class="item">-->
+<!-- <div class="pic">-->
+<!-- <img th:src="@{/img/web/group/pic2.jpg}" alt="">-->
+<!-- </div>-->
+<!-- <div class="tit">11-15 15:00:20</div>-->
+<!-- <div class="tit">浼婂畞鍘垮悍杈惧啘涓氬彂灞曟湁闄愬叕鍙�</div>-->
+<!-- </div>-->
+<!-- </li>-->
+<!-- <li style="float: left; width: 246px;">-->
+<!-- <div class="item">-->
+<!-- <div class="pic">-->
+<!-- <img th:src="@{/img/web/group/pic1.jpg}" alt="">-->
+<!-- </div>-->
+<!-- <div class="tit">11-15 15:00:20</div>-->
+<!-- <div class="tit">浼婂畞鍘垮悍杈惧啘涓氬彂灞曟湁闄愬叕鍙�</div>-->
+<!-- </div>-->
+<!-- </li>-->
+<!-- <li style="float: left; width: 246px;">-->
+<!-- <div class="item">-->
+<!-- <div class="pic">-->
+<!-- <img th:src="@{/img/web/group/pic2.jpg}" alt="">-->
+<!-- </div>-->
+<!-- <div class="tit">11-15 15:00:20</div>-->
+<!-- <div class="tit">浼婂畞鍘垮悍杈惧啘涓氬彂灞曟湁闄愬叕鍙�</div>-->
+<!-- </div>-->
+<!-- </li>-->
+<!-- <li style="float: left; width: 246px;">-->
+<!-- <div class="item">-->
+<!-- <div class="pic">-->
+<!-- <img th:src="@{/img/web/group/pic3.jpg}" alt="">-->
+<!-- </div>-->
+<!-- <div class="tit">11-15 15:00:20</div>-->
+<!-- <div class="tit">浼婂畞鍘垮悍杈惧啘涓氬彂灞曟湁闄愬叕鍙�</div>-->
+<!-- </div>-->
+<!-- </li>-->
+<!-- <li style="float: left; width: 246px;">-->
+<!-- <div class="item">-->
+<!-- <div class="pic">-->
+<!-- <img th:src="@{/img/web/group/pic4.jpg}" alt="">-->
+<!-- </div>-->
+<!-- <div class="tit">11-15 15:00:20</div>-->
+<!-- <div class="tit">浼婂畞鍘垮悍杈惧啘涓氬彂灞曟湁闄愬叕鍙�</div>-->
+<!-- </div>-->
+<!-- </li>-->
+<!-- <li style="float: left; width: 246px;">-->
+<!-- <div class="item">-->
+<!-- <div class="pic">-->
+<!-- <img th:src="@{/img/web/group/pic1.jpg}" alt="">-->
+<!-- </div>-->
+<!-- <div class="tit">11-15 15:00:20</div>-->
+<!-- <div class="tit">浼婂畞鍘垮悍杈惧啘涓氬彂灞曟湁闄愬叕鍙�</div>-->
+<!-- </div>-->
+<!-- </li>-->
- <div class="panel-content" style="position: relative;">
- <div class="tubiao-Carousel">
-
- <div class="stats-chart-box">
- <div class="chart-item">
- <div class="chart-item-title">鍝佺</div>
- <div class="chart-box" id="pieVarietyChart" style="height: 266px; width:256px"></div>
- </div>
- <div class="chart-item">
- <div class="chart-item-title">鎬ц川</div>
- <div class="chart-box" id="pieTypeChart" style="height: 266px; width:256px"></div>
- </div>
- <div class="chart-item">
- <div class="chart-item-title">绛夌骇</div>
- <div class="chart-box" id="pieLevelChart" style="height: 266px; width:256px"></div>
- </div>
- <div class="chart-item">
- <div class="chart-item-title">骞翠唤</div>
- <div class="chart-box" id="pieYearChart" style="height: 266px; width:256px"></div>
- </div>
- <div class="chart-item">
- <div class="chart-item-title">鍦板煙鍒掑垎</div>
- <div class="chart-box" id="pieAreaChart" style="height: 266px; width:256px"></div>
+ </ul>
</div>
</div>
- </div><!-- tubiao-Carousel end -->
+ </div>
</div>
+ <!-- </div><!– tubiao-Carousel end –>-->
+ <!-- </div>-->
</div><!-- right-bottom end -->
@@ -261,18 +449,21 @@
</div>
<script th:src="@{/js/jquery.min.js}"></script>
+<script th:src="@{/js/jquery.countup.min.js}"></script>
+<script th:src="@{/js/jquery.SuperSlide.js}"></script>
+<script th:src="@{/js/jquery.waypoints.min.js}"></script>
<script th:src="@{/js/plugins/echarts/echarts.js}"></script>
<script th:src="@{/ajax/libs/layer/layer.js}"></script>
<script th:src="@{/common/constant.js}"></script>
<script th:src="@{/common/igds-common.js}"></script>
<script th:src="@{/group/mapList.js}"></script>
<script th:src="@{/group/index.js}"></script>
-<script th:inline="javascript">
- var userId = [[${loginUser.loginName}]];
- var companyId = [[${loginUser.companyId}]];
+<script th:inline="javascript"> var userId = [[${loginUser.loginName}]];
+var companyId = [[${loginUser.companyId}]];
+
var deptId = [[${deptId}]];
var dicSlogan = [[${dicSlogan}]];
- var deptList = [[${deptList}]];
+ var deptAllList = [[${deptAllList}]];
var bizType = [[${bizType}]];
var bizTag = [[${bizTag}]];
</script>
--
Gitblit v1.9.3