From 0a6e32dbdb5d505536d33a3539f7b9fcfba1cffe Mon Sep 17 00:00:00 2001
From: GuangrongFu <fu.guangrong@zte.com.cn>
Date: Mon, 30 Jul 2018 11:06:58 +0800
Subject: Added Menu Items

Change-Id: Iab5d4c3be6e3db846bb0077221ec7d7ecbeb0315
Issue-ID: HOLMES-150
Signed-off-by: GuangrongFu <fu.guangrong@zte.com.cn>
---
 rulemgt-frontend/src/default.html | 47 ++++++++++++++++++++++++---------------
 1 file changed, 29 insertions(+), 18 deletions(-)

(limited to 'rulemgt-frontend/src/default.html')
diff --git a/rulemgt-frontend/src/default.html b/rulemgt-frontend/src/default.html
index beab509..33280b7 100644
--- a/rulemgt-frontend/src/default.html
+++ b/rulemgt-frontend/src/default.html
@@ -17,10 +17,12 @@
 <html>
 
 <head>
-    <!-- <base href=""> -->
+    <base href="/iui/holmes/">
     <meta charset="UTF-8">
     <meta name="viewport" content="width=device-width, initial-scale=1">
     <script src="./assets/thirdparty/js/jquery_1.12.4.min.js"></script>
+    <link rel="stylesheet" href="https://use.fontawesome.com/releases/v5.2.0/css/all.css" integrity="sha384-hWVjflwFxL6sNzntih27bfxkr27PmbbK/iSvJ+a4+0owXq79v+lsFkW54bOGbiDQ"
+        crossorigin="anonymous">
 
     <style type="text/css">
         .header {
@@ -59,21 +61,20 @@
 
         .body {
             min-height: 500px;
-            height: 500px;
             padding: 0;
         }
 
         body {
             margin: 0;
-            overflow: auto;
         }
 
         iframe {
             margin: 0;
+            border: none;
         }
 
         .menu-item {
-            height: 135px;
+            height: 120px;
             color: #aaa;
             text-align: center;
         }
@@ -84,22 +85,22 @@
         }
 
         .menu-item-title {
-            height: 50px;
-            line-height: 50px;
+            height: 45px;
+            line-height: 25px;
             font-family: Arial, Helvetica, sans-serif;
             font-weight: bold;
         }
 
         .menu-icon {
-            height: 85px;
-            line-height: 85px;
+            height: 75px;
+            line-height: 90px;
+            font-size: 35px;
         }
 
         .active {
             color: #FFF;
             background-color: #424e57;
         }
-
     </style>
 </head>
 
@@ -114,31 +115,41 @@
     </div>
     <div class="body">
         <div class="sidebar fl">
-            <div class="menu-item active">
+            <div class="menu-item active" id="rule-mgmt">
                 <div class="menu-icon">
-                    icon
+                    <i class="fas fa-file-alt"></i>
                 </div>
                 <div class="menu-item-title">Rules</div>
             </div>
         </div>
         <div class="main fl">
-            <iframe src="/iui/holmes/index.html"></iframe>
+            <iframe src="/iui/holmes/#/alarmRule"></iframe>
         </div>
     </div>
 
     <script type="text/javascript">
+
+        var menus = {
+            "rule-mgmt": "/iui/holmes/#/alarmRule"
+        }
+
         function adjustSizes() {
-            var height = $(window).height() - $(".header").height();
-                $(".sidebar").height(height);
-                $("iframe").height(height);
-                $("iframe").width($(window).width() - $(".sidebar").width());
+            var height = $(window).height() - $(".header").outerHeight() - 4;
+            $(".sidebar").height(height);
+            $("iframe").height(height);
+            $(".main").height(height);
+            $("iframe").width($(window).width() - $(".sidebar").width());
         }
 
-        $(function(){
-            $(window).on("resize", function(){
+        $(function () {
+            $(window).on("resize", function () {
                 adjustSizes();
             });
             adjustSizes();
+
+            $(".menu-item").on("click", function () {
+                $("iframe")[0].src = menus[$(this).attr("id")];
+            })
         });
     </script>
 </body>
-- 
cgit 1.2.3-korg

