소스 검색

驱动和监控页面刷新问题

pengshengdong 2 달 전
부모
커밋
686ba4feaa

+ 6 - 1
dbsyncer-web/src/main/resources/public/content.html

@@ -2,6 +2,11 @@
 <html xmlns="http://www.w3.org/1999/xhtml"
       xmlns:th="http://www.thymeleaf.org" lang="zh-CN">
 
-<div id="initContainer" th:fragment="content"></div>
+
+<div id="initContainer0" th:fragment="content" class="contentDiv hidden"> </div>
+
+<div id="initContainer1" th:fragment="content" class="contentDiv hidden"> </div>
+
+<div id="initContainer2" th:fragment="content" class="contentDiv hidden"> </div>
 
 </html>

+ 7 - 7
dbsyncer-web/src/main/resources/public/nav.html

@@ -9,18 +9,18 @@
         </div>
         <div>
             <ul id="menu" class="nav navbar-nav">
-                <li class="active"><a href="javascript:void(0);" url="/index"><span
+                <li class="active"><a href="javascript:void(0);"  data-route="1" url="/index"><span
                         class="fa fa-tachometer"></span>驱动</a>
                 </li>
-                <li><a href="javascript:void(0);" url="/monitor"><span class="fa fa-line-chart"></span>监控</a></li>
-                <li><a href="javascript:void(0);" url="/plugin"><span class="fa fa-puzzle-piece" aria-hidden="true"></span>插件</a></li>
+                <li><a href="javascript:void(0);" url="/monitor" data-route="2"><span class="fa fa-line-chart"></span>监控</a></li>
+                <li><a href="javascript:void(0);" url="/plugin" data-route="0"><span class="fa fa-puzzle-piece" aria-hidden="true"></span>插件</a></li>
                 <li class="dropdown">
                     <a href="javascript:void(0);" class="dropdown-toggle" data-toggle="dropdown">配置<b class="caret"></b></a>
                     <ul class="dropdown-menu">
-                        <li><a href="javascript:void(0);" url="/system"><span class="fa fa-cog"></span>系统参数</a></li>
-                        <li><a href="javascript:void(0);" url="/user"><span class="fa fa-users"></span>用户管理</a></li>
-                        <li><a href="javascript:void(0);" url="/config"><span class="fa fa-file-code-o" aria-hidden="true"></span>配置管理</a></li>
-                        <li><a href="javascript:void(0);" url="/license"><span class="fa fa-key" aria-hidden="true"></span>授权许可</a></li>
+                        <li><a href="javascript:void(0);" url="/system" data-route="0"><span class="fa fa-cog"></span>系统参数</a></li>
+                        <li><a href="javascript:void(0);" url="/user" data-route="0"><span class="fa fa-users"></span>用户管理</a></li>
+                        <li><a href="javascript:void(0);" url="/config" data-route="0"><span class="fa fa-file-code-o" aria-hidden="true"></span>配置管理</a></li>
+                        <li><a href="javascript:void(0);" url="/license" data-route="0"><span class="fa fa-key" aria-hidden="true"></span>授权许可</a></li>
                     </ul>
                 </li>
             </ul>

+ 2 - 1
dbsyncer-web/src/main/resources/static/css/index/index.css

@@ -26,4 +26,5 @@
 
 .dbsyncer_driver_name { margin-bottom: 5px;}
 .dbsyncer_block_increment { background: -webkit-linear-gradient(left, #ffffff, #dffbdc);}
-.dbsyncer_block_full { background: -webkit-linear-gradient(left, #ffffff, #dcf5fb);}
+.dbsyncer_block_full { background: -webkit-linear-gradient(left, #ffffff, #dcf5fb);}
+.hidden {display: none;}

+ 14 - 4
dbsyncer-web/src/main/resources/static/js/common.js

@@ -3,8 +3,9 @@ var $location = (window.location + '').split('/');
 var $path = document.location.pathname;
 var $basePath = $location[0] + '//' + $location[2] + $path.substr(0, $path.substr(1).indexOf("/")+1);
 // 全局内容区域
-var $initContainer = $("#initContainer");
+var $initContainer = $(".contentDiv");
     $initContainer.css("min-height", $(window).height() - 125);
+
 // 监控定时器
 var timer;
 
@@ -33,7 +34,7 @@ function refreshLoginUser() {
 function backIndexPage(projectGroupId) {
     // 加载页面
     projectGroupId = (typeof projectGroupId === 'string') ? projectGroupId : '';
-    doLoader("/index?projectGroupId="+ projectGroupId +"&refresh=" + new Date().getTime());
+    doLoader("/index?projectGroupId="+ projectGroupId +"&refresh=" + new Date().getTime(),1);
 }
 
 // 美化SQL
@@ -194,10 +195,19 @@ $.fn.serializeJson = function () {
 };
 
 // 全局加载页面
-function doLoader(url){
+function doLoader(url,route=0){
     clearInterval(timer);
     // 加载页面
-    $initContainer.load($basePath + url, function (response, status, xhr) {
+    const contents = document.querySelectorAll('.contentDiv');
+    contents.forEach(function(content) {
+        content.classList.add('hidden');
+    });
+
+    const contentToShow = $('#initContainer' + route);
+    if (contentToShow) {
+        contentToShow.removeClass('hidden');
+    }
+    contentToShow.load($basePath + url, function (response, status, xhr) {
         if (status != 'success') {
             bootGrowl(response);
         }

+ 2 - 1
dbsyncer-web/src/main/resources/static/js/index.js

@@ -46,8 +46,9 @@ $(function () {
 
     // 绑定所有的菜单链接点击事件,根据不同的URL加载页面
     $("#menu li a[url]").click(function () {
+        var route = $(this).data('route');
         // 加载页面
-        doLoader($(this).attr("url"));
+        doLoader($(this).attr("url"),route);
     });
 
     // 头部导航栏选中切换事件