接口相关

src/components/Duration/Duration.js

@@ -31,12 +31,33 @@ const mixin = {
         xAxis: {
           type: 'category',
           boundaryGap: false,
-          data: ['周一', '周二', '周三', '周四', '周五', '周六', '周日'],
+          data: [
+            '呼叫',
+            '到场',
+            '评估',
+            '采血',
+            'CT',
+            '谈话',
+            '签字',
+            '注射',
+            '介入',
+            '手术',
+            '穿刺',
+            'DSA',
+            '溶栓',
+            '再通',
+            '支架',
+            '解脱',
+            '结束',
+          ],
           axisLabel: {
             textStyle: {
               fontWeight: 'normal',
               color: '#ccc', //标题颜色
             },
+            formatter: function(value) {
+              return value.split('').join('\n');
+            },
           },
         },
         yAxis: {
@@ -61,6 +82,7 @@ const mixin = {
           {
             name: '我院记录',
             type: 'line',
+            connectNulls: true,
             stack: '总量',
             symbolSize: 6,
             // symbol: 'star',
@@ -75,6 +97,7 @@ const mixin = {
           {
             name: '国际水准',
             type: 'line',
+            connectNulls: true,
             stack: '总量',
             symbolSize: 6,
             data: this.pointTimeInternation,
@@ -88,6 +111,7 @@ const mixin = {
           {
             name: '当前数据',
             type: 'line',
+            connectNulls: true,
             stack: '总量',
             symbolSize: 6,
             data: this.pointTimeCurrentList,

src/components/Map/Map.js

@@ -4,47 +4,53 @@ var option = {
       type: 'map3D',
       name: '山西',
       selectedMode: 'single', //地图高亮单选
-      boxDepth: 90, //地图倾斜度
+      boxDepth: 230, //地图倾斜度
-      regionHeight: 8, //地图高度
+      regionHeight: 6, //地图高度
       map: '山西',
       viewControl: {
-        distance: 150, //地图视角 控制初始大小
+        distance: 1000, //地图视角 控制初始大小
-        rotateSensitivity: 0, //禁止旋转
+        rotateSensitivity: 1, //禁止旋转
-        zoomSensitivity: 0, //禁止缩放
+        zoomSensitivity: 1, //禁止缩放
       },
       label: {
         show: true, //是否显示市
         textStyle: {
-          color: '#0a1640', //文字颜色
+          color: '#aaa', //文字颜色
           fontSize: 12, //文字大小
           backgroundColor: 'rgba(0,0,0,0)', //透明度0清空文字背景
         },
       },
       itemStyle: {
-        color: '#81d0f1', //地图颜色
+        color: 'rgb(18,57,90)', //地图颜色
-        borderWidth: 0.5, //分界线wdith
+        borderWidth: 1, //分界线wdith
         borderColor: '#459bca', //分界线颜色
       },
       emphasis: {
         label: {
           show: true, //是否显示高亮
-          textStyle: {
+          textStyle: { color: '#fff' }, //高亮文字颜色
-            color: '#fff', //高亮文字颜色
-          },
-        },
-        itemStyle: {
-          color: '#0489d6', //地图高亮颜色
         },
+        itemStyle: { color: '#A7820D' }, //地图高亮颜色
       },
-      //高亮市区  echarts  bug 不生效
+      data: [
-      regions: [
         {
           name: '运城市',
-          itemStyle: {
+          value: 0,
-            areaColor: '#f00',
+          label: { textStyle: { color: '#fff' } }, //高亮文字颜色
-          },
+          itemStyle: { color: '#A7820D' }, //地图高亮颜色
         },
       ],
+      //高亮市区  echarts  bug 不生效
+      // regions: [
+      //   {
+      //     name: '运城市',
+      //     value: 0,
+      //     itemStyle: {
+      //       areaColor: 'red',
+      //       label: { show: false },
+      //     },
+      //   },
+      // ],
     },
   ],
 };

src/components/Map/Map.vue

@@ -1,6 +1,6 @@
 <template>
   <div :style="{ width: 'width', height: 'height' }" class="chart-box">
-    <div id="myEchart" ref="myEchart" style="width: 100%;height:100%;"></div>
+    <div id="myEchart" ref="myEchart" style="width: 100%; height: 100%"></div>
   </div>
 </template>
 
@@ -22,6 +22,7 @@ export default {
     let hg = window.innerHeight;
     this.width = wh + 'px';
     this.height = hg + 'px';
+    console.log(this.width);
     console.log(this.height);
     window.onresize = () => {
       return (() => {
@@ -50,88 +51,4 @@ export default {
 };
 </script>
 
-<style lang="stylus" scoped>
+<style lang="stylus" scoped></style>
-/* 懒加载图标动画 */
-.demo-spin-icon-load {
-  animation: ani-demo-spin 1s linear infinite;
-}
-
-@keyframes ani-demo-spin {
-  from {
-    transform: rotate(0deg);
-  }
-
-  50% {
-    transform: rotate(180deg);
-  }
-
-  to {
-    transform: rotate(360deg);
-  }
-}
-
-/* 弹窗样式 */
-.layer {
-  position: absolute;
-  left: 400px;
-  top: 300px;
-  z-index: 100;
-  width: 360px;
-  height: 280px;
-  background: rgba(10, 22, 64, 0.9);
-  border-radius: 5px;
-  border: 1px solid #122253;
-  transform: translate(-100%, -100%);
-
-  .content {
-    width: 100%;
-    height: 100%;
-    position: relative;
-    text-align: center;
-
-    p {
-      font-size: 20px;
-      color: #fff;
-      line-height: 50px;
-    }
-
-    .col-item {
-      height: 41px;
-      margin-top: 20px;
-      border-right: 1px solid #172353;
-
-      .num {
-        color: #ebf8ff;
-        font-size: 18px;
-      }
-
-      .text {
-        color: #507ebc;
-        font-size: 12px;
-      }
-    }
-  }
-
-  .content::after {
-    content: '';
-    width: 120px;
-    height: 2px;
-    background: #FFCCFF;
-    position: absolute;
-    right: -120px;
-    top: 50%;
-    transform: translateY(-50%);
-  }
-
-  .content::before {
-    content: '';
-    width: 2px;
-    height: 80px;
-    background: #FFB800;
-    position: absolute;
-    right: -134px;
-    top: 136px;
-    transform: rotateZ(-20deg);
-  }
-}
-</style>

src/components/Sensor/Sensor.js

@@ -3,8 +3,8 @@ const mixin = {
   data() {
     return {
       series1: [10, 20, 30, 10, 20, 30, 10, 20, 30], // 传感器1
-      series2: [20, 30, 10, 20, 30, 10, 20, 30, 10], // 传感器1
+      series2: [20, 30, 10, 20, 30, 10, 20, 30, 10], // 传感器2
-      series3: [30, 10, 20, 30, 10, 20, 30, 10, 20], // 传感器1
+      series3: [30, 10, 20, 30, 10, 20, 30, 10, 20], // 传感器3
     };
   },
   computed: {
@@ -13,7 +13,7 @@ const mixin = {
       return {
         legend: {
           x: 'center',
-          y: 'top',
+          y: '8%',
           data: ['传感器1', '传感器2', '传感器3'],
           textStyle: {
             fontWeight: 'normal',

src/components/Statistics/Statistics.js

@@ -17,7 +17,7 @@ const mixin = {
         legend: [
           {
             x: 'center',
-            y: 'top',
+            y: '8%',
             data: ['本年', '去年'],
             textStyle: {
               fontWeight: 'normal',

src/router/index.js

@@ -11,12 +11,12 @@ const routes = [
     name: 'Home',
     component: Home,
   },
-  // 白框框显示内容界面
+  // 模拟按钮界面
-  // {
+  {
-  //   path: '/Index',
+    path: '/BtnPage',
-  //   name: 'Index',
+    name: 'BtnPage',
-  //   component: () => import(/* webpackChunkName: "Index" */ 'views/Index/Index.vue'),
+    component: () => import(/* webpackChunkName: "Index" */ 'views/BtnPage/BtnPage.vue'),
-  // },
+  },
 ];
 
 const router = new VueRouter({

src/views/BtnPage/BtnPage.vue

@@ -0,0 +1,49 @@
+<template>
+  <div class="wrap flex-1">
+    <a-button type="primary" v-for="(item, index) in nameList" :key="index"> {{ item }} </a-button>
+  </div>
+</template>
+
+<script>
+export default {
+  name: 'BtnPage',
+  data() {
+    return {
+      str: '模拟按钮界面',
+      nameList: [
+        '分诊区',
+        '急救医生',
+        '采血车',
+        'CT室',
+        '介入室',
+        '平车停放点',
+        '卒中中心门口',
+        '急救大楼门',
+        '抢救室门',
+        '走廊',
+        '心电图室门口',
+        '专用电梯口（一楼）',
+        '专用电梯口（四楼）',
+        'CCU导管室门口',
+        '急救护士',
+        '专科医生',
+        '专科护士',
+      ],
+    };
+  },
+  methods: {},
+};
+</script>
+
+<style lang="stylus" scoped>
+.wrap {
+  flex-wrap: wrap;
+  justify-content: center;
+  align-items: center;
+
+  button {
+    margin: 20px;
+    flex: 0 0 8%;
+  }
+}
+</style>