add隐藏看板

css/index.css

@@ -55,6 +55,34 @@ body {
   box-sizing: border-box;
 }
 
+.view-btn {
+  position: absolute;
+  top: 80px;
+  background-color: #283963;
+  width: 30px;
+  height: 30px;
+  border: 2px solid #4270e4;
+  cursor: pointer;
+  border-radius: 4px;
+}
+.view-btn>.icon{
+  width: 20px;
+  height: 20px;
+  margin: 5px;
+  background: url(../imgs/hide.png) no-repeat;
+  background-size: 100%;
+}
+.view-btn.btn-active>.icon{
+  background: url(../imgs/show.png) no-repeat;
+  background-size: 100%;
+}
+.view-btn.view-btn_left{
+  left: 5px;
+}
+.view-btn.view-btn_right{
+  right: 5px;
+}
+
 .view {
   width: 320px;
   height: 85%;

index.html

@@ -282,7 +282,7 @@
 				    </thead>
 				  </table>
 				  <div style="height: 270px;overflow: auto;">
-					<table style="">
+					<table>
 										  <colgroup>
 					    <col style="width: 110px;">
 					    <col style="width: 150px;">
@@ -372,6 +372,9 @@
       <div class="main_header" >实时生产预警和安全预警</div>
        <div id="webgl-output"></div>
       <!-- 左右两侧内容 -->
+			<div class="view-btn view-btn_left btn-active">
+				<div class="icon"></div>
+			</div>
       <div class="view view_left">
         <div class="item">
           <div class="item_header" >
@@ -415,6 +418,9 @@
           <div class="item_wrap" id="torque"></div>
         </div>
       </div>
+			<div class="view-btn view-btn_right btn-active">
+				<div class="icon"></div>
+			</div>
       <div class="view view_right">
         <div class="item">
           <div class="item_header" >
@@ -481,6 +487,16 @@
 	}]
 	var twotable = []
 	var oldvararr = []
+	$(".view-btn_left").click(function(){
+		let viewDis = $(".view_left").css('display')
+		$(".view_left").css('display', viewDis === 'none' ? 'flex' : 'none')
+		$(".view-btn_left").toggleClass('btn-active')
+	})
+	$(".view-btn_right").click(function(){
+		let viewDis = $(".view_right").css('display')
+		$(".view_right").css('display', viewDis === 'none' ? 'flex' : 'none')
+		$(".view-btn_right").toggleClass('btn-active')
+	})
 	</script>
 <script src="./new_file.js"></script>
 <script> new Ripple({