resolve some css

src/components/menu.vue

@@ -49,10 +49,10 @@ export default {
           },
           {
             name:"健康",
-            link:'index/',
+            // link:'index/',
             isDisabel: false,
             children:[
-              {name:"传感器读值", isDisabel: false},
+              {name:"传感器读值", link:'sensor_history', isDisabel: false},
               {name:"事件日志", isDisabel: false},
               {name:"系统日志", isDisabel: false},
               {name:"BSOD屏幕", isDisabel: false},
@@ -135,3 +135,14 @@ export default {
 }
 </script>
 
+<style lang='scss' scoped>
+  .menu-contente{
+    /*position: fixed;*/
+    width: 1180px;
+    /*top: 0px;
+    left: 0px;
+    right: 0px;*/
+    margin-left:auto;
+    margin-right:auto;
+  }
+</style>

src/router/index.js

@@ -13,7 +13,7 @@ const router = new Router({
     routes: [
         {
             path: '/',
-            redirect: '/index'
+            redirect: '/index/dashbord'
         },
         {
             path: '/index',
@@ -27,9 +27,12 @@ const router = new Router({
                 { 
                     path: 'fan',  component: r => require.ensure([], () => r(require('../views/fan')), 'fan'),
                 },
-                 { 
+                { 
                     path: 'fru_info',  component: r => require.ensure([], () => r(require('../views/FRUInfo')), 'fan'),
                 },
+                { 
+                    path: 'sensor_history',  component: r => require.ensure([], () => r(require('../views/SensorHistory')), 'sensor_history'),
+                },
             ]
         },
         {

src/views/FRUInfo.vue

@@ -1,35 +1,182 @@
 <template>
 	<div class="dashboard_box" style="width: 1180px;margin: auto;">
-		<table class="table">
-			<thead>
-				<tr>
-					<th>名称</th>
-					<th>速度(RPM)</th>
-					<th style="width: 200px">模式</th>
-					<th style="width: 200px">任务(%)</th>
-					<th style="width: 120px;">操作</th>
-				</tr>
-			</thead>
-			<tbody id="tableContent">
-				<tr v-for='item in fanList'>
-	                <td>{{item.name}}</td>
-	                <td>{{item.speed}}RPM</td>
-	                <td>
-	                    <select v-model='item.model' class="form-control">
-	                        <option value="1" >自动</option>
-	                        <option value="2">手动</option>
-	                    </select>
-	                </td>
-	                <td>
-	                    <input type="text" v-model='item.duty' class="form-control">
-	                </td>
-	                <td>
-	                   <Button type="primary" @click='set(item)'>设置</Button>
-	                </td>
-            	</tr>
+		<div class="dashboard_box">
+        <h3>
+           Field Replaceable Unit(FRU)
+
+        </h3>
+        <p style="display:none">
+           This page gives detailed information for the various FRU devices present in this system.
+
+        </p>
+
+        <h4 style="display:none">
+           Basic Information:
+
+        </h4>
+        <div style="display:none" class="subSection">
+            <table cellspacing="0" cellpadding="6" border="0" width="700">
+                <tbody><tr><td width="40%"><strong>
+                  FRU Device ID
+
+                </strong></td>
+                    <td><select id="_FRUDeviceID" class="classicTxtBox"></select></td></tr>
+                <tr><td><strong>
+                   FRU Device Name
+
+                </strong></td>
+                    <td><label id="_FRUDeviceName" class="classicTxtBox"></label></td></tr>
+            </tbody></table>
+        </div>
         
-			</tbody>
-		</table>
+        <h4>
+         Chassis Information:
+
+        </h4>
+        <div class="subSection">
+            <table cellspacing="0" cellpadding="6" border="0" width="700">
+                <tbody><tr><td width="40%"><strong>
+                  Chassis Information Area Format Version
+
+                </strong></td>
+                    <td><label id="_CI_ChassisInfoAreaFormatVersion" class="classicTxtBox"></label></td></tr>
+                <tr><td><strong>
+                Chassis Type
+
+                </strong></td>
+                    <td><label id="_CI_ChassisType" class="classicTxtBox"></label></td></tr>
+                <tr><td><strong>
+                   Chassis Part Number
+
+                </strong></td>
+                    <td><label id="_CI_ChassisPartNum" class="classicTxtBox"></label></td></tr>
+                <tr><td><strong>
+                   Chassis Serial Number
+
+                </strong></td>
+                    <td><label id="_CI_ChassisSerialNum" class="classicTxtBox"></label></td></tr>
+                <tr><td><strong>
+                   Chassis Extra
+
+                </strong></td>
+                    <td><label id="_CI_CustomFields" class="classicTxtBox"></label></td></tr>
+            </tbody></table>
+        </div>
+
+        <h4>
+          Board Information:
+
+        </h4>
+        <div class="subSection">
+            <table cellspacing="0" cellpadding="6" border="0" width="700">
+                <tbody><tr><td width="40%"><strong>
+                  Board Information Area Format Version
+
+                </strong></td>
+                    <td><label id="_BI_BoardInfoAreaFormatVersion" class="classicTxtBox"></label></td></tr>
+                <tr><td><strong>
+                  Language
+
+                </strong></td>
+                    <td><label id="_BI_Language" class="classicTxtBox"></label></td></tr>
+                <tr><td><strong>
+                    Manufacture Date Time
+
+                </strong></td>
+                    <td><label id="_BI_MfgDateTime" class="classicTxtBox"></label></td></tr>
+                <tr><td><strong>
+                  Board Manufacturer
+
+                </strong></td>
+                    <td><label id="_BI_BoardMfr" class="classicTxtBox"></label></td></tr>
+                <tr><td><strong>
+                   Board Product Name
+
+                </strong></td>
+                    <td><label id="_BI_BoardProductName" class="classicTxtBox"></label></td></tr>
+                <tr><td><strong>
+                   Board Serial Number
+
+                </strong></td>
+                    <td><label id="_BI_BoardSerialNum" class="classicTxtBox"></label></td></tr>
+                <tr><td><strong>
+                    Board Part Number
+
+                </strong></td>
+                    <td><label id="_BI_BoardPartNum" class="classicTxtBox"></label></td></tr>
+                <tr><td><strong>
+                    FRU File ID
+
+                </strong></td>
+                    <td><label id="_BI_FRUFileID" class="classicTxtBox"></label></td></tr>
+                <tr><td><strong>
+                   Board Extra
+
+                </strong></td>
+                    <td><label id="_BI_CustomFields" class="classicTxtBox"></label></td></tr>
+            </tbody></table>
+        </div>
+
+        <h4>
+          Product Information:
+
+        </h4>
+        <div class="subSection">
+            <table cellspacing="0" cellpadding="6" border="0" width="700">
+                <tbody><tr><td width="40%"><strong>
+                   Product Information Area Format Version
+
+                </strong></td>
+                    <td><label id="_PI_ProductInfoAreaFormatVersion" class="classicTxtBox"></label></td></tr>
+                <tr><td><strong>
+                   </script>Language
+
+                </strong></td>
+                    <td><label id="_PI_Language" class="classicTxtBox"></label></td></tr>
+                <tr><td><strong>
+                    Manufacturer Name
+
+                </strong></td>
+                    <td><label id="_PI_MfrName" class="classicTxtBox"></label></td></tr>
+                <tr><td><strong>
+                  Product Name
+
+                </strong></td>
+                    <td><label id="_PI_ProductName" class="classicTxtBox"></label></td></tr>
+                <tr><td><strong>
+                   Product Part Number
+
+                </strong></td>
+                    <td><label id="_PI_ProductPartNum" class="classicTxtBox"></label></td></tr>
+                <tr><td><strong>
+                   Product Version
+
+                </strong></td>
+                    <td><label id="_PI_ProductVersion" class="classicTxtBox"></label></td></tr>
+                <tr><td><strong>
+                  Product Serial Number
+
+                </strong></td>
+                    <td><label id="_PI_ProductSerialNum" class="classicTxtBox"></label></td></tr>
+                <tr><td><strong>
+                  Asset Tag
+
+                </strong></td>
+                    <td><label id="_PI_AssetTag" class="classicTxtBox"></label></td></tr>
+                <tr><td><strong>
+                 FRU File ID
+
+                </strong></td>
+                    <td><label id="_PI_FRUFileID" class="classicTxtBox"></label></td></tr>
+                <tr><td><strong>
+                   Product Extra
+
+                </strong></td>
+                    <td><label id="_PI_CustomFields" class="classicTxtBox"></label></td></tr>
+            </tbody></table>
+        </div>
+    </div>
+		
 	</div>
 </template>
 <script>
@@ -65,111 +212,44 @@ input {
 	margin: 0;
 }
 
-.dashboard_box {
-	background: -webkit-linear-gradient(bottom, #FFFFFF, #D1E3FF);
-	/* Safari 5.1 - 6.0 */
-	background: -o-linear-gradient(top, #FFFFFF, #D1E3FF);
-	/* Opera 11.1 - 12.0 */
-	background: -moz-linear-gradient(top, #FFFFFF, #D1E3FF);
-	/* Firefox 3.6 - 15 */
-	background: linear-gradient(to top, #FFFFFF, #D1E3FF);
-	height: 100%;
-	overflow-y: auto;
-	/*margin-top:30px;*/
-}
-
-.table {
-	border-spacing: 0;
-	border-collapse: collapse;
-	width: 100%;
-	max-width: 100%;
-	font-size:13px;
-}
-
-.table td,
-.table th {
-	padding: 8px;
-	text-align: center;
-}
-
-.form-control {
-	display: block;
-	width: 100%;
-	height: 30px;
-	line-height: 30px;
-	padding: 4px 12px;
-	font-size: 13px;
-	background: transparent;
-	border: 1px solid #1874FF;
-	color: #003C97;
-	-webkit-box-shadow: inset 0 1px 1px rgba(0, 0, 0, .075);
-	box-shadow: inset 0 1px 1px rgba(0, 0, 0, .075);
-	-webkit-transition: border-color ease-in-out .15s, -webkit-box-shadow ease-in-out .15s;
-	-o-transition: border-color ease-in-out .15s, box-shadow ease-in-out .15s;
-	transition: border-color ease-in-out .15s, box-shadow ease-in-out .15s;
-}
-
-.form-control:focus {
-	border-color: #66afe9;
-	outline: 0;
-	-webkit-box-shadow: inset 0 1px 1px rgba(0, 0, 0, .075), 0 0 8px rgba(102, 175, 233, .6);
-	box-shadow: inset 0 1px 1px rgba(0, 0, 0, .075), 0 0 8px rgba(102, 175, 233, .6);
-}
-
-.btn {
-	display: inline-block;
-	padding: 4px 20px;
-	margin-bottom: 0;
-	font-size: 13px;
-	font-weight: 400;
-	line-height: 1.42857143;
-	text-align: center;
-	white-space: nowrap;
-	vertical-align: middle;
-	-ms-touch-action: manipulation;
-	touch-action: manipulation;
-	cursor: pointer;
-	-webkit-user-select: none;
-	-moz-user-select: none;
-	-ms-user-select: none;
-	user-select: none;
-	background-image: none;
-	border: 1px solid transparent;
-}
-
-.btn:focus {
-	outline: none;
-}
-
-.btn-primary {
-	color: #fff;
-	background-color: #1874FF;
-	border-color: #1874FF;
-	border-radius: 3px;
+table {
+    font-size: 12px;
 }
 
-.btn-primary:hover {
-	color: #fff;
-	background-color: #0364F7;
-	border-color: #0364F7;
+tr {
+    height: 26px;
 }
-
-.dashboard_box table tr:nth-of-type(odd) {
-	background-color: rgba(24, 116, 255, 0.06);
-	;
-}
-
-.dashboard_box table thead tr {
-	background-color: transparent !important;
+td{
+    width: 40%;
 }
-
-.dashboard_box table tr td {
-	color: #003C97;
+.dashboard_box {
+	width: 1180px;
+    margin: auto;
+    margin-top: 10px;
+    /* background: #040C19; */
+    padding: 10px 0;
+    color: #fff;
+    h3 {
+	    color: #fff;
+	    margin-bottom: 0;
+	    padding-bottom: 5px;
+	}
 }
-
-.dashboard_box table tr th {
-	color: #022B7D;
-	padding: 14px 8px;
-	font-weight: normal;
+h4 {
+    font-size: 15px;
+    width: auto;
+    margin: 3px;
+    padding: 2px;
+}
+h3 {
+    color: #fff;
+    font-size: 20px;
+    padding-bottom: 0px;
+    /*margin-top: 5px;*/
+    border-bottom: 1px solid #000;
+}
+.subSection {
+    padding: 20px;
+    padding-top: 0px;
 }
 </style>

src/views/SensorHistory.vue

@@ -0,0 +1,119 @@
+<template>
+	<div class="dashboard_box" style="width: 1180px;margin: auto;">
+		<div class="dashboard_box">
+			<h3>
+				传感器读值
+			</h3>
+			<p>
+				所有传感器相关的信息都在这里显示。在一条记录上双击去触发特定传感器的开和关。
+			</p>
+			<Row>
+				<Col :span='12'>
+				<select id="_sensorType">
+					<option value="0">All Sensors</option>
+					<option value="1">Temperature Sensors</option>
+					<option value="2">Voltage Sensors</option>
+					<option value="3">Current Sensors</option>
+				</select>
+				</Col>
+				<Col style='font-size:12px;text-align: right;' :span='12'>
+					<strong> Sensor Count:  </strong>14 sensors
+				</Col>
+			</Row>
+		</div>
+	</div>
+</template>
+<script>
+export default {
+	name: 'dashbord1',
+	data() {
+		return {
+			fanList: [
+				{ name: 'fan1', speed: 1000, model: 1, duty: 56.3 },
+				{ name: 'fan2', speed: 1000, model: 1, duty: 56.3 },
+				{ name: 'fan3', speed: 1000, model: 2, duty: 56.3 },
+				{ name: 'fan4', speed: 1000, model: 2, duty: 56.3 },
+				{ name: 'fan5', speed: 1000, model: 1, duty: 56.3 }
+			]
+		}
+	},
+	created() {
+		console.log("111111111111111111")
+	},
+	methods: {
+		set(item) {
+			console.log(item)
+		}
+	}
+}
+</script>
+<style lang="scss" scoped>
+* {
+	box-sizing: border-box;
+}
+
+input {
+	margin: 0;
+}
+
+table {
+	font-size: 12px;
+}
+
+tr {
+	height: 26px;
+}
+
+td {
+	width: 40%;
+}
+
+.dashboard_box {
+	width: 1180px;
+	margin: auto;
+	margin-top: 10px;
+	/* background: #040C19; */
+	padding: 10px 0;
+	color: #fff;
+
+	h3 {
+		color: #fff;
+		margin-bottom: 0;
+		padding-bottom: 5px;
+	}
+
+	p {
+		padding: 10px 0;
+		font-size: 12px;
+	}
+}
+
+h4 {
+	font-size: 15px;
+	width: auto;
+	margin: 3px;
+	padding: 2px;
+}
+
+h3 {
+	color: #fff;
+	font-size: 20px;
+	padding-bottom: 0px;
+	/*margin-top: 5px;*/
+	border-bottom: 1px solid #000;
+}
+
+select {
+	border-radius: 3px;
+	height: 34px;
+	padding: 0 10px;
+	background: #fff;
+	border: 1px solid #1874FF;
+	color: #003C97;
+	-webkit-box-shadow: inset 0 1px 1px rgba(0, 0, 0, .075);
+	box-shadow: inset 0 1px 1px rgba(0, 0, 0, .075);
+	-webkit-transition: border-color ease-in-out .15s, -webkit-box-shadow ease-in-out .15s;
+	-o-transition: border-color ease-in-out .15s, box-shadow ease-in-out .15s;
+	transition: border-color ease-in-out .15s, box-shadow ease-in-out .15s;
+}
+</style>

src/views/dashbord.vue

@@ -167,18 +167,6 @@
 				</Row>
 			</div>
 		</div>
-		<!-- <Row type="flex" justify="start" align="top"  >
-			<Col span="8">
-				
-			</Col>
-
-			<Col span="10" >
-				
-			</Col>
-			<Col span="6">
-				
-			</Col>
-		</Row> -->
 	</div>
 </template>
 <script>
@@ -302,7 +290,7 @@ export default {
 <style lang='scss' scoped>
 .dashbord-context {
 	color: #fff;
-	overflow-x: scroll;
+	/*overflow-x: scroll;*/
 	padding-bottom: 30px;
 	.dashboard_box_h3 {
 		border-bottom: none;

src/views/index.vue

@@ -3,8 +3,10 @@
       <Header></Header>
       <div class='dashbord-contanier'>
           <Menu></Menu>
-          <div class="content">
-              <router-view></router-view>
+          <div style="width:1180px;overflow:hidden">
+            <div class="content">
+                <router-view></router-view>
+            </div>
           </div>
       </div>
   </div>
@@ -31,11 +33,18 @@ export default {
   
 }
 .dashbord-contanier{
-  height: 800px;
+  
   margin: 10 auto;
 
 }
 .content{
+  width: 1200px;
   margin: 10px auto;
+  height: 800px;
+  overflow-y: scroll;
+  overflow-x: hidden;
+}
+.content::-webkit-scrollbar {
+    /*display: none;*/
 }
 </style>