From 920ad7c1062549f8ff6e5034f84a90c725dc89dd Mon Sep 17 00:00:00 2001
From: doum <doum>
Date: 星期二, 23 九月 2025 16:40:27 +0800
Subject: [PATCH] H5静态化
---
server/src/main/resources/templates/components/nav.html | 429 +++++++++++++++++++++++++++++++++++++++++++++++++----
1 files changed, 394 insertions(+), 35 deletions(-)
diff --git a/server/src/main/resources/templates/components/nav.html b/server/src/main/resources/templates/components/nav.html
index 961ec98..9694f67 100644
--- a/server/src/main/resources/templates/components/nav.html
+++ b/server/src/main/resources/templates/components/nav.html
@@ -1,36 +1,395 @@
-<div class="nav">
- <div class="nav-logo">
- <img src="${webDomain}/assets/images/top_logo@2x.png" alt="${seo.imgalt!''}">
+<style>
+ .nav {
+ width: 1200px;
+ height: 70px;
+ margin: 0 auto;
+ display: flex;
+ align-items: center;
+ justify-content: space-between;
+ }
+ .nav-logo {
+ flex-shrink: 0;
+ width: 160px;
+ height: 52px;
+ margin-right: 80px;
+ }
+ .nav-logo img {
+ width: 100%;
+ height: 100%;
+ }
+ ul {
+ flex: 1;
+ height: 100%;
+ list-style-type: none;
+ display: flex;
+ align-content: center;
+ }
+ ul li a {
+ display: block;
+ }
+ ul li {
+ margin-right: 50px;
+ line-height: 70px;
+ position: relative;
+ }
+ ul li:hover .drop-down {
+ display: block;
+ }
+ ul li:last-child {
+ margin: 0 !important;
+ }
+ ul li .underline {
+ width: 30px;
+ height: 4px;
+ position: absolute;
+ bottom: 9px;
+ left: 50%;
+ transform: translate(-50%, 0);
+ background: #FF7900;
+ }
+
+ .fa {
+ position: fixed !important;
+ left: 0 !important;
+ width: 100vw !important;
+ height: calc(100vh - 70px) !important;
+ overflow-y: scroll !important;
+ padding: 30px 0 !important;
+ box-sizing: border-box !important;
+ }
+ .fa-content {
+ width: 1200px;
+ margin: 0 auto;
+ }
+ .fa-content-item {
+ width: 100%;
+ }
+ .fa-content-item-label {
+ display: inline;
+ font-weight: 600;
+ font-size: 18px;
+ color: #191B1F;
+ cursor: pointer;
+ }
+ .fa-content-item-label:hover {
+ color: #FF7900 !important;
+ }
+ .fa-content-item-list {
+ width: 100%;
+ display: flex;
+ align-items: center;
+ justify-content: space-between;
+ flex-wrap: wrap;
+ }
+ .fa-content-item-list-zw {
+ width: 250px;
+ height: 0;
+ }
+ .fa-content-item-list-row:hover {
+ background: rgba(255,121,0,0.06) !important;
+ }
+ .fa-content-item-list-row:hover .fa-content-item-list-row-info span:nth-child(1) {
+ color: #FF7900 !important;
+ font-weight: 500 !important;
+ }
+ .fa-content-item-list-row {
+ width: 250px;
+ height: 60px;
+ padding: 10px;
+ box-sizing: border-box;
+ background: rgba(255,255,255,0.06);
+ border-radius: 4px;
+ display: flex;
+ align-items: center;
+ margin-bottom: 20px;
+ cursor: pointer;
+ }
+ .fa-content-item-list-row img {
+ width: 36px;
+ height: 36px;
+ margin-right: 12px;
+ }
+ .fa-content-item-list-row-info {
+ display: flex;
+ flex-direction: column;
+ }
+ .fa-content-item-list-row-info span:nth-child(1) {
+ font-weight: 400;
+ font-size: 14px;
+ color: #191B1F;
+ line-height: normal;
+ }
+ .fa-content-item-list-row-info span:nth-child(2) {
+ font-weight: 400;
+ font-size: 12px;
+ color: #7B7F87;
+ line-height: normal;
+ }
+ .drop-down {
+ position: absolute;
+ top: 70px;
+ left: -50px;
+ width: 164px;
+ display: none;
+ background: #FFFFFF;
+ box-shadow: 0 7px 20px 0 rgba(0,0,0,0.1);
+ }
+ .drop-down-item {
+ width: 100%;
+ height: 50px;
+ display: flex;
+ align-items: center;
+ justify-content: center;
+ font-weight: 400;
+ font-size: 14px;
+ color: #222222;
+ cursor: pointer;
+ }
+ .drop-down-item:hover {
+ font-weight: 500;
+ color: #FF7900;
+ }
+
+ .nav-btn {
+ margin-left: 10px;
+ flex-shrink: 0;
+ .btn-code {
+ display:inline-block;
+ flex-shrink: 0;
+ width: 100px;
+ height: 44px;
+ line-height: 44px;
+ text-align: center;
+ border-radius: 22px;
+ border: 1px solid #FF7900;
+ font-weight: 500;
+ font-size: 16px;
+ color: #FF7900;
+ cursor: pointer;
+ }
+ .btn-use {
+ display:inline-block;
+ margin-left: 10px;
+ width: 100px;
+ height: 44px;
+ line-height: 44px;
+ text-align: center;
+ background: #FF7900;
+ border-radius: 22px;
+ font-weight: 500;
+ font-size: 16px;
+ color: #FFFFFF;
+ border: none;
+ cursor: pointer;
+ }
+ .btn-use:hover {
+ background: #FF8C24;
+ }
+ }
+ </style>
+<nav>
+ <div style="width: 100%; height: 70px; background: #ffffff;">
+ <div class="nav">
+ <div class="nav-logo">
+ <img src="${webDomain}/assets/images/top_logo@2x.png" alt="${seo.imgalt!''}">
+ </div>
+ <ul>
+ <li>
+ <a href="${webDomain}/index.html">棣栭〉</a>
+ <#if navIndex ==0></if><div class="underline"></div></#if>
+ </li>
+ <li>
+ <a href="javascript:void(0);">鏅烘収绯荤粺</a>
+ <#if navIndex == 1></if><div class="underline"></div></#if>
+ <div class="drop-down">
+ <a href="${webDomain}/intelligent_system.html" class="drop-down-item">鏅烘収鍦洪杩愯惀绯荤粺</a>
+ <a href="${webDomain}/operation.html" class="drop-down-item">鏅烘収鍦洪杩愮淮绯荤粺</a>
+ </div>
+ </li>
+ <li>
+ <a href="javascript:void(0);">瑙ｅ喅鏂规</a>
+ <#if navIndex == 2></if><div class="underline"></div></#if>
+ <!--<div class="drop-down">
+ <a href="${webDomain}/solution.html" class="drop-down-item">鏁版櫤浣撹偛鍦洪</a>
+ <a href="${webDomain}/solution-meadowlands.html" class="drop-down-item">24H鏅鸿兘鍦洪</a>
+ <a href="${webDomain}/solution-sport.html" class="drop-down-item">鏁版櫤浣撹偛骞冲彴</a>
+ <a href="${webDomain}/solution-scenicSpot.html" class="drop-down-item">鏅尯&娓镐箰鍥�</a>
+ <a href="${webDomain}/solution-space.html" class="drop-down-item">绌洪棿鏅烘収绠＄悊</a>
+ </div>-->
+ <div class="drop-down fa">
+ <div class="fa-content">
+ <div class="fa-content-item">
+ <a class="fa-content-item-label" href="${webDomain}/solution.html" class="drop-down-item">鏁版櫤浣撹偛鍦洪 ></a>
+ <div class="fa-content-item-list">
+ <a class="fa-content-item-list-row" href="${webDomain}/sozhtycg.html" >
+ <img src="${webDomain!''}/assets/icon/缁煎悎浣撹偛棣咢2x.png" alt="">
+ <div class="fa-content-item-list-row-info">
+ <span>缁煎悎浣撹偛鍦洪</span>
+ <span>鏅烘収杞‖浠朵竴浣撳寲</span>
+ </div>
+ </a>
+ <a class="fa-content-item-list-row" href="${webDomain}/soqmjszx.html">
+ <img src="${webDomain!''}/assets/icon/鍏ㄦ皯鍋ヨ韩@2x.png" alt="">
+ <div class="fa-content-item-list-row-info">
+ <span>鍏ㄦ皯鍋ヨ韩涓績</span>
+ <span>鍔ㄦ�佽皟搴︿紭浣撻獙</span>
+ </div>
+ </a>
+ <a class="fa-content-item-list-row" href="${webDomain}/soxytycg.html">
+ <img src="${webDomain!''}/assets/icon/鏍″洯@2x.png" alt="">
+ <div class="fa-content-item-list-row-info">
+ <span>鏍″洯浣撹偛鍦洪</span>
+ <span>浣撻獙鍗囩骇鍔╁姏鏁欏</span>
+ </div>
+ </a>
+ <a class="fa-content-item-list-row" href="${webDomain}/sobxtycg.html">
+ <img src="${webDomain!''}/assets/icon/鍐伴洩棣咢2x.png" alt="">
+ <div class="fa-content-item-list-row-info">
+ <span>鍐伴洩浣撹偛鍦洪</span>
+ <span>鏅虹澧炴晥鍗忓悓绠＄悊</span>
+ </div>
+ </a>
+ <a class="fa-content-item-list-row" href="${webDomain}/soyytycg.html">
+ <img src="${webDomain!''}/assets/icon/娓告吵棣咢2x.png" alt="">
+ <div class="fa-content-item-list-row-info">
+ <span>娓告吵浣撹偛鍦洪</span>
+ <span>淇濋殰瀹夊叏鏅烘帶璧嬭兘</span>
+ </div>
+ </a>
+ <a class="fa-content-item-list-row" href="${webDomain}/sozhtygy.html">
+ <img src="${webDomain!''}/assets/icon/浣撹偛鍏洯@2x.png" alt="">
+ <div class="fa-content-item-list-row-info">
+ <span>鏅烘収浣撹偛鍏洯</span>
+ <span>鍏ㄥぉ鍊欐櫤鎱ц繍鍔ㄧ┖闂�</span>
+ </div>
+ </a>
+ <div class="fa-content-item-list-zw"></div>
+ <div class="fa-content-item-list-zw"></div>
+ <div class="fa-content-item-list-zw"></div>
+ </div>
+ </div>
+
+ <div class="fa-content-item">
+ <a class="fa-content-item-label" href="${webDomain}/solution-meadowlands.html" class="drop-down-item">24H鏅鸿兘鍦洪 ></a>
+ <div class="fa-content-item-list">
+ <a class="fa-content-item-list-row" href="${webDomain}/so24zncg.html">
+ <img src="${webDomain!''}/assets/icon/24h鍦洪@2x.png" alt="">
+ <div class="fa-content-item-list-row-info">
+ <span>24H鏅鸿兘鍦洪</span>
+ <span>鍏ㄥぉ楂樻晥鏅鸿兘绠℃帶</span>
+ </div>
+ </a>
+ <a class="fa-content-item-list-row" href="${webDomain}/sowrzscg.html">
+ <img src="${webDomain!''}/assets/icon/鏃犱汉鍊煎畧@2x.png" alt="">
+ <div class="fa-content-item-list-row-info">
+ <span>鏃犱汉鍊煎畧鍦洪</span>
+ <span>闄嶆湰澧炴晥瀹夊叏杩愯惀</span>
+ </div>
+ </a>
+ <div class="fa-content-item-list-zw"></div>
+ <div class="fa-content-item-list-zw"></div>
+ <div class="fa-content-item-list-zw"></div>
+ </div>
+ </div>
+
+ <div class="fa-content-item">
+ <a class="fa-content-item-label" href="${webDomain}/solution-sport.html" class="drop-down-item">鏁版櫤浣撹偛骞冲彴 ></a>
+ <div class="fa-content-item-list">
+ <a class="fa-content-item-list-row" href="${webDomain}/sotylsyypt.html">
+ <img src="${webDomain!''}/assets/icon/杩為攣杩愯惀@2x.png" alt="">
+ <div class="fa-content-item-list-row-info">
+ <span>浣撹偛杩為攣杩愯惀骞冲彴</span>
+ <span>澶氬満棣嗙簿缁嗗寲绠＄悊</span>
+ </div>
+ </a>
+ <a class="fa-content-item-list-row" href="${webDomain}/sossjsztypt.html">
+ <img src="${webDomain!''}/assets/icon/鏁版櫤浣撹偛@2x.png" alt="">
+ <div class="fa-content-item-list-row-info">
+ <span>鐪佸競绾ф暟鏅轰綋鑲插钩鍙�</span>
+ <span>浼樺寲璧勬簮鍗囩骇鏈嶅姟</span>
+ </div>
+ </a>
+ <div class="fa-content-item-list-zw"></div>
+ <div class="fa-content-item-list-zw"></div>
+ <div class="fa-content-item-list-zw"></div>
+ </div>
+ </div>
+
+ <div class="fa-content-item">
+ <a class="fa-content-item-label" href="${webDomain}/solution-scenicSpot.html" class="drop-down-item">鏅尯&娓镐箰鍥� ></a>
+ <div class="fa-content-item-list">
+ <a class="fa-content-item-list-row" href="${webDomain}/soqzly.html">
+ <img src="${webDomain!''}/assets/icon/浜插瓙@2x.png" alt="">
+ <div class="fa-content-item-list-row-info">
+ <span>浜插瓙涔愬洯</span>
+ <span>鏁版櫤瀹跺涵濞变箰涓績</span>
+ </div>
+ </a>
+ <a class="fa-content-item-list-row" href="${webDomain}/solyjq.html">
+ <img src="${webDomain!''}/assets/icon/鏅尯@2x.png" alt="">
+ <div class="fa-content-item-list-row-info">
+ <span>鏃呮父鏅尯</span>
+ <span>澶氫笟鎬佹櫤鑳界粡钀ョ鐞�</span>
+ </div>
+ </a>
+ <div class="fa-content-item-list-zw"></div>
+ <div class="fa-content-item-list-zw"></div>
+ <div class="fa-content-item-list-zw"></div>
+ </div>
+ </div>
+ <div class="fa-content-item">
+ <a class="fa-content-item-label" href="${webDomain}/solution-space.html" class="drop-down-item">绌洪棿鏅烘収绠＄悊 ></a>
+ <div class="fa-content-item-list">
+ <a class="fa-content-item-list-row" href="${webDomain}/sogrwhg.html">
+ <img src="${webDomain!''}/assets/icon/宸ヤ汉鏂囧寲瀹獲2x.png" alt="">
+ <div class="fa-content-item-list-row-info">
+ <span>宸ヤ汉鏂囧寲瀹�</span>
+ <span>鏁板瓧璧嬭兘鍏叡鏈嶅姟</span>
+ </div>
+ </a>
+ <a class="fa-content-item-list-row" href="${webDomain}/soqyghg.html">
+ <img src="${webDomain!''}/assets/icon/宸ヤ細棣咢2x.png" alt="">
+ <div class="fa-content-item-list-row-info">
+ <span>浼佷笟宸ヤ細棣�</span>
+ <span>鍒涙柊鍙戝睍鏁板瓧宸ヤ細</span>
+ </div>
+ </a>
+ <a class="fa-content-item-list-row" href="${webDomain}/sowyycg.html">
+ <img src="${webDomain!''}/assets/icon/鏂囪壓婕斿嚭棣咢2x.png" alt="">
+ <div class="fa-content-item-list-row-info">
+ <span>鏂囪壓婕斿嚭棣�</span>
+ <span>浼樺寲鏈嶅姟璺冨崌鏁堣兘</span>
+ </div>
+ </a>
+ <div class="fa-content-item-list-zw"></div>
+ <div class="fa-content-item-list-zw"></div>
+ <div class="fa-content-item-list-zw"></div>
+ </div>
+ </div>
+ </div>
+ </div>
+ </li>
+ <li>
+ <a href="${webDomain}/alot.html">Alot鐗╄仈</a>
+ <#if navIndex == 3></if><div class="underline"></div></#if>
+ </li>
+ <li>
+ <a href="${webDomain}/dynamics.html">鏈�鏂板姩鎬�</a>
+ <#if navIndex ==4></if><div class="underline"></div></#if>
+ </li>
+ <li>
+ <a href="${webDomain}/about.html">鍏充簬鎴戜滑</a>
+ <#if navIndex ==5></if><div class="underline"></div></#if>
+ </li>
+ <li>
+ <a href="${webDomain}/aboutChannel.html">娓犻亾鍚堜綔</a>
+ <#if navIndex ==6></if><div class="underline"></div></#if>
+ </li>
+ </ul>
+ <div class="nav-btn">
+ <a href="${gitCodeUrl}" target="_blank" class="btn-code">鑾峰彇婧愮爜</a>
+ <a href="${webDomain}/aboutChannel.html" class="btn-use">鍏嶈垂璇曠敤</a>
+ </div>
+ </div>
</div>
- <ul>
- <li>
- <a href="${webDomain}/index.html">棣栭〉</a>
- <#if navIndex ==0></if><div class="underline"></div></#if>
- </li>
- <li>
- <a href="${webDomain}/intelligent_system.html">鏅烘収绯荤粺</a>
- <#if navIndex == 1></if><div class="underline"></div></#if>
- </li>
- <li>
- <a href="${webDomain}/solution.html">瑙ｅ喅鏂规</a>
- <#if navIndex == 2></if><div class="underline"></div></#if>
- </li>
- <li>
- <a href="${webDomain}/alot.html">Alot鐗╄仈</a>
- <#if navIndex == 3></if><div class="underline"></div></#if>
- </li>
- <li>
- <a href="${webDomain}/dynamics.html">鏈�鏂板姩鎬�</a>
- <#if navIndex ==4></if><div class="underline"></div></#if>
- </li>
- <li>
- <a href="${webDomain}/about.html">鍏充簬鎴戜滑</a>
- <#if navIndex ==5></if><div class="underline"></div></#if>
- </li>
- <li>
- <a href="${webDomain}/aboutChannel.html">娓犻亾鍚堜綔</a>
- <#if navIndex ==6></if><div class="underline"></div></#if>
- </li>
- </ul>
- <a href="${webDomain}/aboutChannel.html" class="nav-btn">鍏嶈垂璇曠敤</a>
-</div>
\ No newline at end of file
+</nav>
\ No newline at end of file
--
Gitblit v1.9.3