首页健康公示

src/views/Home.vue

@@ -7,8 +7,11 @@
       </el-breadcrumb-item>
     </el-breadcrumb>
     <el-divider></el-divider>
+    <el-card class="diagram_jkgs" style="padding-left:-10px">
+          <el-button style="font-size:24px" type="success" @click="openView">健康<br>公示</el-button>
+    </el-card>
     <el-card class="diagram_top">
-      <div class="ax_default xtsyqk_fyy">
+      <div class="ax_default3 xtsyqk_fyy">
         <div class="xtsyqk_fyy_60">
           <i class="el-icon-s-shop"></i>
           <span style="color:#01447D">
@@ -19,7 +22,7 @@
       </div>
     </el-card>
     <el-card class="diagram_top">
-      <div class="ax_default xtsyqk_fyy">
+      <div class="ax_default3 xtsyqk_fyy">
         <div class="xtsyqk_fyy_60">
           <i class="el-icon-s-custom"></i>
           <span style="color:#01447D">
@@ -40,7 +43,7 @@
         </div>
       </div>
     </el-card>
-    <el-card class="diagram_top">
+    <el-card class="diagram_extraWide">
       <div class="ax_default2 xtsyqk_fyy">
         <div class="xtsyqk_fyy_60">
           <i class="el-icon-search"></i>
@@ -52,7 +55,7 @@
         </div>
       </div>
     </el-card>
-    <el-card class="diagram_top">
+    <el-card class="diagram_extraWide">
       <div class="ax_default2 xtsyqk_fyy">
         <div class="xtsyqk_fyy_60">
           <i class="el-icon-warning-outline"></i>
@@ -131,7 +134,7 @@ export default {
         yAxis: {
           type: "value",
           min: 0,
-          name:"人数"
+          name: "人数"
           //max: this.yAxisMaxNum
         },
         color: ["green", "red"],
@@ -167,6 +170,9 @@ export default {
           }
         ]
       });
+    },
+    openView(){
+      window.open("http://www.sudaonline.net/ygjDemo/jkgs.html");
     }
   },
   async mounted() {
@@ -246,7 +252,7 @@ export default {
 
 .diagram_top {
   margin: 20px 20px;
-  width: 220px;
+  width: 140px;
   height: 120px;
   float: left;
 }
@@ -256,12 +262,25 @@ export default {
   height: 400px;
   float: left;
 }
+.diagram_extraWide{
+  margin: 20px 20px;
+  width: 220px;
+  height: 120px;
+  float: left;
+}
 .ax_default {
-  width: 280px;
+  width: 180px;
 }
-
 .ax_default2 {
   width: 320px;
 }
-</style>
+.diagram_jkgs {
+  margin: 20px 20px;
+  height: 120px;
+  float: left;
+}
+.ax_default3{
+  width: 170px;
+}
 
+</style>