diff --git a/package.json b/package.json
index 471cdb3..4d80891 100644
--- a/package.json
+++ b/package.json
@@ -64,7 +64,7 @@
     "html-webpack-plugin": "4.0.0-alpha",
     "mini-css-extract-plugin": "0.4.1",
     "node-notifier": "5.2.1",
-    "node-sass": "^4.12.0",
+    "node-sass": "^6.0.1",
     "optimize-css-assets-webpack-plugin": "5.0.0",
     "ora": "3.0.0",
     "path-to-regexp": "2.4.0",

diff --git a/package.json b/package.json
index 471cdb3..4d80891 100644
--- a/package.json
+++ b/package.json
@@ -64,7 +64,7 @@
     "html-webpack-plugin": "4.0.0-alpha",
     "mini-css-extract-plugin": "0.4.1",
     "node-notifier": "5.2.1",
-    "node-sass": "^4.12.0",
+    "node-sass": "^6.0.1",
     "optimize-css-assets-webpack-plugin": "5.0.0",
     "ora": "3.0.0",
     "path-to-regexp": "2.4.0",
diff --git a/src/components/BigData/Card/index.vue b/src/components/BigData/Card/index.vue
index 16e55f0..d71e609 100644
--- a/src/components/BigData/Card/index.vue
+++ b/src/components/BigData/Card/index.vue
@@ -79,19 +79,20 @@
 
     .card-panel-icon {
       float: left;
-      font-size: 48px;
+      font-size: 40px;
     }
 
     .card-panel-description {
-      float: left;
+      // float: left;
       font-weight: bold;
       margin: 26px;
-      margin-left: 10px;
+      // margin-left: 10px;
+      overflow: auto;
 
       .card-panel-text {
         line-height: 18px;
         color: rgba(0, 0, 0, 0.45);
-        font-size: 16px;
+        font-size: 14px;
         margin-bottom: 12px;
       }
 

diff --git a/package.json b/package.json
index 471cdb3..4d80891 100644
--- a/package.json
+++ b/package.json
@@ -64,7 +64,7 @@
     "html-webpack-plugin": "4.0.0-alpha",
     "mini-css-extract-plugin": "0.4.1",
     "node-notifier": "5.2.1",
-    "node-sass": "^4.12.0",
+    "node-sass": "^6.0.1",
     "optimize-css-assets-webpack-plugin": "5.0.0",
     "ora": "3.0.0",
     "path-to-regexp": "2.4.0",
diff --git a/src/components/BigData/Card/index.vue b/src/components/BigData/Card/index.vue
index 16e55f0..d71e609 100644
--- a/src/components/BigData/Card/index.vue
+++ b/src/components/BigData/Card/index.vue
@@ -79,19 +79,20 @@
 
     .card-panel-icon {
       float: left;
-      font-size: 48px;
+      font-size: 40px;
     }
 
     .card-panel-description {
-      float: left;
+      // float: left;
       font-weight: bold;
       margin: 26px;
-      margin-left: 10px;
+      // margin-left: 10px;
+      overflow: auto;
 
       .card-panel-text {
         line-height: 18px;
         color: rgba(0, 0, 0, 0.45);
-        font-size: 16px;
+        font-size: 14px;
         margin-bottom: 12px;
       }
 
diff --git a/src/components/BigData/Card1/index.vue b/src/components/BigData/Card1/index.vue
index d70262c..030b2dc 100644
--- a/src/components/BigData/Card1/index.vue
+++ b/src/components/BigData/Card1/index.vue
@@ -4,12 +4,28 @@
       <div :style="backgroundColor" class="card-panel-icon-wrapper">
         <svg-icon :icon-class="icon" class-name="card-panel-icon" />
       </div>
-      <div :style="{'padding-top':title.length===1?'20px':'0px'}" class="card-panel-description">
-        <div class="card-panel-text">
+      <div  class="card-panel-description">
+        <!-- <div class="card-panel-text">
           {{ title[0] }} <span class="card-panel-num">{{ context[0] }}</span>
         </div>
         <div class="card-panel-text" >
           {{ title[1] }} <span class="card-panel-num">{{ context[1] }}</span>
+        </div> -->
+        <div class="two" v-if="title.length===2">
+          <div class="card-panel-text">
+            {{ title[0] }} <span class="card-panel-num">{{ context[0] }}</span>
+          </div>
+          <div class="card-panel-text" >
+            {{ title[1] }} <span class="card-panel-num">{{ context[1] }}</span>
+          </div>
+        </div>
+        <div class="only" v-else>
+          <div class="card-panel-text">
+            {{ title[0] }}
+          </div>
+          <div class="card-panel-num" >
+            {{ context[0] }}
+          </div>
         </div>
       </div>
     </div>
@@ -82,27 +98,43 @@
 
     .card-panel-icon {
       float: left;
-      font-size: 48px;
+      font-size: 40px;
     }
 
     .card-panel-description {
       float: left;
       font-weight: bold;
       margin-top: 26px;
-      /*margin-left: 10px;*/
+      overflow: auto;
+      margin-left: 5px;
 
-      .card-panel-text {
-        line-height: 18px;
-        color: rgba(0, 0, 0, 0.45);
-        font-size: 16px;
-        margin-bottom: 12px;
+      .two{
+        .card-panel-text {
+          line-height: 18px;
+          color: rgba(0, 0, 0, 0.45);
+          font-size: 14px;
+          margin-bottom: 12px;
+        }
+
+        .card-panel-num {
+          font-size: 18px;
+          color: #666;
+          padding-left: 10px;
+          float: right;
+        }
       }
+      .only{
+        .card-panel-text {
+          line-height: 18px;
+          color: rgba(0, 0, 0, 0.45);
+          font-size: 14px;
+          margin-bottom: 12px;
+          padding-top: 0;
+        }
 
-      .card-panel-num {
-        font-size: 18px;
-        color: #666;
-        padding-left: 10px;
-        float: right;
+        .card-panel-num {
+          font-size: 20px;
+        }
       }
     }
   }

diff --git a/package.json b/package.json
index 471cdb3..4d80891 100644
--- a/package.json
+++ b/package.json
@@ -64,7 +64,7 @@
     "html-webpack-plugin": "4.0.0-alpha",
     "mini-css-extract-plugin": "0.4.1",
     "node-notifier": "5.2.1",
-    "node-sass": "^4.12.0",
+    "node-sass": "^6.0.1",
     "optimize-css-assets-webpack-plugin": "5.0.0",
     "ora": "3.0.0",
     "path-to-regexp": "2.4.0",
diff --git a/src/components/BigData/Card/index.vue b/src/components/BigData/Card/index.vue
index 16e55f0..d71e609 100644
--- a/src/components/BigData/Card/index.vue
+++ b/src/components/BigData/Card/index.vue
@@ -79,19 +79,20 @@
 
     .card-panel-icon {
       float: left;
-      font-size: 48px;
+      font-size: 40px;
     }
 
     .card-panel-description {
-      float: left;
+      // float: left;
       font-weight: bold;
       margin: 26px;
-      margin-left: 10px;
+      // margin-left: 10px;
+      overflow: auto;
 
       .card-panel-text {
         line-height: 18px;
         color: rgba(0, 0, 0, 0.45);
-        font-size: 16px;
+        font-size: 14px;
         margin-bottom: 12px;
       }
 
diff --git a/src/components/BigData/Card1/index.vue b/src/components/BigData/Card1/index.vue
index d70262c..030b2dc 100644
--- a/src/components/BigData/Card1/index.vue
+++ b/src/components/BigData/Card1/index.vue
@@ -4,12 +4,28 @@
       <div :style="backgroundColor" class="card-panel-icon-wrapper">
         <svg-icon :icon-class="icon" class-name="card-panel-icon" />
       </div>
-      <div :style="{'padding-top':title.length===1?'20px':'0px'}" class="card-panel-description">
-        <div class="card-panel-text">
+      <div  class="card-panel-description">
+        <!-- <div class="card-panel-text">
           {{ title[0] }} <span class="card-panel-num">{{ context[0] }}</span>
         </div>
         <div class="card-panel-text" >
           {{ title[1] }} <span class="card-panel-num">{{ context[1] }}</span>
+        </div> -->
+        <div class="two" v-if="title.length===2">
+          <div class="card-panel-text">
+            {{ title[0] }} <span class="card-panel-num">{{ context[0] }}</span>
+          </div>
+          <div class="card-panel-text" >
+            {{ title[1] }} <span class="card-panel-num">{{ context[1] }}</span>
+          </div>
+        </div>
+        <div class="only" v-else>
+          <div class="card-panel-text">
+            {{ title[0] }}
+          </div>
+          <div class="card-panel-num" >
+            {{ context[0] }}
+          </div>
         </div>
       </div>
     </div>
@@ -82,27 +98,43 @@
 
     .card-panel-icon {
       float: left;
-      font-size: 48px;
+      font-size: 40px;
     }
 
     .card-panel-description {
       float: left;
       font-weight: bold;
       margin-top: 26px;
-      /*margin-left: 10px;*/
+      overflow: auto;
+      margin-left: 5px;
 
-      .card-panel-text {
-        line-height: 18px;
-        color: rgba(0, 0, 0, 0.45);
-        font-size: 16px;
-        margin-bottom: 12px;
+      .two{
+        .card-panel-text {
+          line-height: 18px;
+          color: rgba(0, 0, 0, 0.45);
+          font-size: 14px;
+          margin-bottom: 12px;
+        }
+
+        .card-panel-num {
+          font-size: 18px;
+          color: #666;
+          padding-left: 10px;
+          float: right;
+        }
       }
+      .only{
+        .card-panel-text {
+          line-height: 18px;
+          color: rgba(0, 0, 0, 0.45);
+          font-size: 14px;
+          margin-bottom: 12px;
+          padding-top: 0;
+        }
 
-      .card-panel-num {
-        font-size: 18px;
-        color: #666;
-        padding-left: 10px;
-        float: right;
+        .card-panel-num {
+          font-size: 20px;
+        }
       }
     }
   }
diff --git a/src/views/dashboard/components/AlarmByDays.vue b/src/views/dashboard/components/AlarmByDays.vue
index cb5c283..ddfd8e3 100644
--- a/src/views/dashboard/components/AlarmByDays.vue
+++ b/src/views/dashboard/components/AlarmByDays.vue
@@ -65,6 +65,7 @@
           delete item.data
           return item
         })
+        
         this.chartData.rows = arr
       })
     },

diff --git a/package.json b/package.json
index 471cdb3..4d80891 100644
--- a/package.json
+++ b/package.json
@@ -64,7 +64,7 @@
     "html-webpack-plugin": "4.0.0-alpha",
     "mini-css-extract-plugin": "0.4.1",
     "node-notifier": "5.2.1",
-    "node-sass": "^4.12.0",
+    "node-sass": "^6.0.1",
     "optimize-css-assets-webpack-plugin": "5.0.0",
     "ora": "3.0.0",
     "path-to-regexp": "2.4.0",
diff --git a/src/components/BigData/Card/index.vue b/src/components/BigData/Card/index.vue
index 16e55f0..d71e609 100644
--- a/src/components/BigData/Card/index.vue
+++ b/src/components/BigData/Card/index.vue
@@ -79,19 +79,20 @@
 
     .card-panel-icon {
       float: left;
-      font-size: 48px;
+      font-size: 40px;
     }
 
     .card-panel-description {
-      float: left;
+      // float: left;
       font-weight: bold;
       margin: 26px;
-      margin-left: 10px;
+      // margin-left: 10px;
+      overflow: auto;
 
       .card-panel-text {
         line-height: 18px;
         color: rgba(0, 0, 0, 0.45);
-        font-size: 16px;
+        font-size: 14px;
         margin-bottom: 12px;
       }
 
diff --git a/src/components/BigData/Card1/index.vue b/src/components/BigData/Card1/index.vue
index d70262c..030b2dc 100644
--- a/src/components/BigData/Card1/index.vue
+++ b/src/components/BigData/Card1/index.vue
@@ -4,12 +4,28 @@
       <div :style="backgroundColor" class="card-panel-icon-wrapper">
         <svg-icon :icon-class="icon" class-name="card-panel-icon" />
       </div>
-      <div :style="{'padding-top':title.length===1?'20px':'0px'}" class="card-panel-description">
-        <div class="card-panel-text">
+      <div  class="card-panel-description">
+        <!-- <div class="card-panel-text">
           {{ title[0] }} <span class="card-panel-num">{{ context[0] }}</span>
         </div>
         <div class="card-panel-text" >
           {{ title[1] }} <span class="card-panel-num">{{ context[1] }}</span>
+        </div> -->
+        <div class="two" v-if="title.length===2">
+          <div class="card-panel-text">
+            {{ title[0] }} <span class="card-panel-num">{{ context[0] }}</span>
+          </div>
+          <div class="card-panel-text" >
+            {{ title[1] }} <span class="card-panel-num">{{ context[1] }}</span>
+          </div>
+        </div>
+        <div class="only" v-else>
+          <div class="card-panel-text">
+            {{ title[0] }}
+          </div>
+          <div class="card-panel-num" >
+            {{ context[0] }}
+          </div>
         </div>
       </div>
     </div>
@@ -82,27 +98,43 @@
 
     .card-panel-icon {
       float: left;
-      font-size: 48px;
+      font-size: 40px;
     }
 
     .card-panel-description {
       float: left;
       font-weight: bold;
       margin-top: 26px;
-      /*margin-left: 10px;*/
+      overflow: auto;
+      margin-left: 5px;
 
-      .card-panel-text {
-        line-height: 18px;
-        color: rgba(0, 0, 0, 0.45);
-        font-size: 16px;
-        margin-bottom: 12px;
+      .two{
+        .card-panel-text {
+          line-height: 18px;
+          color: rgba(0, 0, 0, 0.45);
+          font-size: 14px;
+          margin-bottom: 12px;
+        }
+
+        .card-panel-num {
+          font-size: 18px;
+          color: #666;
+          padding-left: 10px;
+          float: right;
+        }
       }
+      .only{
+        .card-panel-text {
+          line-height: 18px;
+          color: rgba(0, 0, 0, 0.45);
+          font-size: 14px;
+          margin-bottom: 12px;
+          padding-top: 0;
+        }
 
-      .card-panel-num {
-        font-size: 18px;
-        color: #666;
-        padding-left: 10px;
-        float: right;
+        .card-panel-num {
+          font-size: 20px;
+        }
       }
     }
   }
diff --git a/src/views/dashboard/components/AlarmByDays.vue b/src/views/dashboard/components/AlarmByDays.vue
index cb5c283..ddfd8e3 100644
--- a/src/views/dashboard/components/AlarmByDays.vue
+++ b/src/views/dashboard/components/AlarmByDays.vue
@@ -65,6 +65,7 @@
           delete item.data
           return item
         })
+        
         this.chartData.rows = arr
       })
     },
diff --git a/src/views/dashboard/components/PanelGroup.vue b/src/views/dashboard/components/PanelGroup.vue
index c04cf16..b72d289 100644
--- a/src/views/dashboard/components/PanelGroup.vue
+++ b/src/views/dashboard/components/PanelGroup.vue
@@ -3,6 +3,7 @@
     <div v-for="card in dataGroup1" :key="card.index" class="card-panel-col">
       <card1 :title="card.title" :context="card.context" :icon="card.icon" :color="card.color"/>
     </div>
+
     <div v-for="card in dataGroup" :key="card.title" class="card-panel-col">
       <div v-if="hasPerm(card.permission)">
         <card :title="card.title" :context="card.context" :icon="card.icon" :color="card.color" @click.native="goPage(card.path)"/>
@@ -14,9 +15,13 @@
 <script>
 import Card1 from '@/components/BigData/Card1'
 import Card from '@/components/BigData/Card'
+// 首页
 import { getWatchStatistic , waterMeterCount } from '@/api/overview'
+// 根据布防数量统计井数量
 import { wellCountByBfzt } from '@/api/well'
+// 当前报警数
 import { deviceStaticByStatus, alarmNowStatic } from '@/api/dataStatics'
+// 根据工单状态统计工单数量
 import { jobCountByStatus } from '@/api/job'
 export default {
   components: {
@@ -49,22 +54,6 @@
         }
       ],
       dataGroup: [
-        // {
-        //   title: '井总数量',
-        //   context: '--',
-        //   icon: 'icon-well',
-        //   color: '#40c9c6',
-        //   path: '/wellList',
-        //   permission: '/well/list'
-        // },
-        // {
-        //   title: '总用水量',
-        //   context: '--',
-        //   icon: 'icon-water',
-        //   color: '#36a3f7',
-        //   path: '/wellList',
-        //   permission: '/well/list'
-        // },
         {
           title: '设备总数',
           context: '--',
@@ -89,14 +78,6 @@
           path: '/alarmNow',
           permission: '/alarm/now'
         }
-        // {
-        //   title: '未完成工单数',
-        //   context: '--',
-        //   icon: 'icon-order',
-        //   color: '#f4516c',
-        //   path: '/listJob',
-        //   permission: '/job/list'
-        // }
       ]
     }
   },
@@ -164,86 +145,86 @@
     flex:1;
   }
 
-  .card-panel {
-    height: 108px;
-    cursor: pointer;
-    font-size: 12px;
-    position: relative;
-    overflow: hidden;
-    color: #666;
-    background: #fff;
-    box-shadow: 4px 4px 40px rgba(0, 0, 0, .05);
-    border-color: rgba(0, 0, 0, .05);
+  // .card-panel {
+  //   height: 108px;
+  //   cursor: pointer;
+  //   font-size: 10px;
+  //   position: relative;
+  //   overflow: hidden;
+  //   color: #666;
+  //   background: #fff;
+  //   box-shadow: 4px 4px 40px rgba(0, 0, 0, .05);
+  //   border-color: rgba(0, 0, 0, .05);
 
-    &:hover {
-      .card-panel-icon-wrapper {
-        color: #fff;
-      }
+  //   &:hover {
+  //     .card-panel-icon-wrapper {
+  //       color: #fff;
+        
+  //     }
 
-      .icon-people {
-        background: #40c9c6;
-      }
+  //     .icon-people {
+  //       background: #40c9c6;
+  //     }
 
-      .icon-message {
-        background: #36a3f7;
-      }
+  //     .icon-message {
+  //       background: #36a3f7;
+  //     }
 
-      .icon-money {
-        background: #f4516c;
-      }
+  //     .icon-money {
+  //       background: #f4516c;
+  //     }
 
-      .icon-shopping {
-        background: #34bfa3
-      }
-    }
+  //     .icon-shopping {
+  //       background: #34bfa3
+  //     }
+  //   }
 
-    .icon-people {
-      color: #40c9c6;
-    }
+  //   // .icon-people {
+  //   //   color: #40c9c6;
+  //   // }
 
-    .icon-message {
-      color: #36a3f7;
-    }
+  //   // .icon-message {
+  //   //   color: #36a3f7;
+  //   // }
 
-    .icon-money {
-      color: #f4516c;
-    }
+  //   // .icon-money {
+  //   //   color: #f4516c;
+  //   // }
 
-    .icon-shopping {
-      color: #34bfa3
-    }
+  //   // .icon-shopping {
+  //   //   color: #34bfa3
+  //   // }
 
-    .card-panel-icon-wrapper {
-      float: left;
-      margin: 14px 0 0 14px;
-      padding: 16px;
-      transition: all 0.38s ease-out;
-      border-radius: 6px;
-    }
+  //   .card-panel-icon-wrapper {
+  //     float: left;
+  //     margin: 14px 0 0 14px;
+  //     padding: 16px;
+  //     transition: all 0.38s ease-out;
+  //     border-radius: 6px;
+  //   }
 
-    .card-panel-icon {
-      float: left;
-      font-size: 48px;
-    }
+  //   .card-panel-icon {
+  //     float: left;
+  //     font-size: 40px;
+  //   }
 
-    .card-panel-description {
-      float: right;
-      font-weight: bold;
-      margin: 26px;
-      margin-left: 0px;
+  //   .card-panel-description {
+  //     font-weight: bold;
+  //     margin: 26px;
+  //     margin-left: 0px;
 
-      .card-panel-text {
-        line-height: 18px;
-        color: rgba(0, 0, 0, 0.45);
-        font-size: 16px;
-        margin-bottom: 12px;
-      }
+  //     .card-panel-text {
+  //       line-height: 18px;
+  //       color: rgba(0, 0, 0, 0.45);
+  //       font-size: 14px;
+  //       margin-bottom: 12px;
+  //     }
 
-      .card-panel-num {
-        font-size: 20px;
-      }
-    }
-  }
+  //     .card-panel-num {
+  //       font-size: 18px;
+  //     }
+  //   }
+  // }
 }
 
 @media (max-width:550px) {

diff --git a/package.json b/package.json
index 471cdb3..4d80891 100644
--- a/package.json
+++ b/package.json
@@ -64,7 +64,7 @@
     "html-webpack-plugin": "4.0.0-alpha",
     "mini-css-extract-plugin": "0.4.1",
     "node-notifier": "5.2.1",
-    "node-sass": "^4.12.0",
+    "node-sass": "^6.0.1",
     "optimize-css-assets-webpack-plugin": "5.0.0",
     "ora": "3.0.0",
     "path-to-regexp": "2.4.0",
diff --git a/src/components/BigData/Card/index.vue b/src/components/BigData/Card/index.vue
index 16e55f0..d71e609 100644
--- a/src/components/BigData/Card/index.vue
+++ b/src/components/BigData/Card/index.vue
@@ -79,19 +79,20 @@
 
     .card-panel-icon {
       float: left;
-      font-size: 48px;
+      font-size: 40px;
     }
 
     .card-panel-description {
-      float: left;
+      // float: left;
       font-weight: bold;
       margin: 26px;
-      margin-left: 10px;
+      // margin-left: 10px;
+      overflow: auto;
 
       .card-panel-text {
         line-height: 18px;
         color: rgba(0, 0, 0, 0.45);
-        font-size: 16px;
+        font-size: 14px;
         margin-bottom: 12px;
       }
 
diff --git a/src/components/BigData/Card1/index.vue b/src/components/BigData/Card1/index.vue
index d70262c..030b2dc 100644
--- a/src/components/BigData/Card1/index.vue
+++ b/src/components/BigData/Card1/index.vue
@@ -4,12 +4,28 @@
       <div :style="backgroundColor" class="card-panel-icon-wrapper">
         <svg-icon :icon-class="icon" class-name="card-panel-icon" />
       </div>
-      <div :style="{'padding-top':title.length===1?'20px':'0px'}" class="card-panel-description">
-        <div class="card-panel-text">
+      <div  class="card-panel-description">
+        <!-- <div class="card-panel-text">
           {{ title[0] }} <span class="card-panel-num">{{ context[0] }}</span>
         </div>
         <div class="card-panel-text" >
           {{ title[1] }} <span class="card-panel-num">{{ context[1] }}</span>
+        </div> -->
+        <div class="two" v-if="title.length===2">
+          <div class="card-panel-text">
+            {{ title[0] }} <span class="card-panel-num">{{ context[0] }}</span>
+          </div>
+          <div class="card-panel-text" >
+            {{ title[1] }} <span class="card-panel-num">{{ context[1] }}</span>
+          </div>
+        </div>
+        <div class="only" v-else>
+          <div class="card-panel-text">
+            {{ title[0] }}
+          </div>
+          <div class="card-panel-num" >
+            {{ context[0] }}
+          </div>
         </div>
       </div>
     </div>
@@ -82,27 +98,43 @@
 
     .card-panel-icon {
       float: left;
-      font-size: 48px;
+      font-size: 40px;
     }
 
     .card-panel-description {
       float: left;
       font-weight: bold;
       margin-top: 26px;
-      /*margin-left: 10px;*/
+      overflow: auto;
+      margin-left: 5px;
 
-      .card-panel-text {
-        line-height: 18px;
-        color: rgba(0, 0, 0, 0.45);
-        font-size: 16px;
-        margin-bottom: 12px;
+      .two{
+        .card-panel-text {
+          line-height: 18px;
+          color: rgba(0, 0, 0, 0.45);
+          font-size: 14px;
+          margin-bottom: 12px;
+        }
+
+        .card-panel-num {
+          font-size: 18px;
+          color: #666;
+          padding-left: 10px;
+          float: right;
+        }
       }
+      .only{
+        .card-panel-text {
+          line-height: 18px;
+          color: rgba(0, 0, 0, 0.45);
+          font-size: 14px;
+          margin-bottom: 12px;
+          padding-top: 0;
+        }
 
-      .card-panel-num {
-        font-size: 18px;
-        color: #666;
-        padding-left: 10px;
-        float: right;
+        .card-panel-num {
+          font-size: 20px;
+        }
       }
     }
   }
diff --git a/src/views/dashboard/components/AlarmByDays.vue b/src/views/dashboard/components/AlarmByDays.vue
index cb5c283..ddfd8e3 100644
--- a/src/views/dashboard/components/AlarmByDays.vue
+++ b/src/views/dashboard/components/AlarmByDays.vue
@@ -65,6 +65,7 @@
           delete item.data
           return item
         })
+        
         this.chartData.rows = arr
       })
     },
diff --git a/src/views/dashboard/components/PanelGroup.vue b/src/views/dashboard/components/PanelGroup.vue
index c04cf16..b72d289 100644
--- a/src/views/dashboard/components/PanelGroup.vue
+++ b/src/views/dashboard/components/PanelGroup.vue
@@ -3,6 +3,7 @@
     <div v-for="card in dataGroup1" :key="card.index" class="card-panel-col">
       <card1 :title="card.title" :context="card.context" :icon="card.icon" :color="card.color"/>
     </div>
+
     <div v-for="card in dataGroup" :key="card.title" class="card-panel-col">
       <div v-if="hasPerm(card.permission)">
         <card :title="card.title" :context="card.context" :icon="card.icon" :color="card.color" @click.native="goPage(card.path)"/>
@@ -14,9 +15,13 @@
 <script>
 import Card1 from '@/components/BigData/Card1'
 import Card from '@/components/BigData/Card'
+// 首页
 import { getWatchStatistic , waterMeterCount } from '@/api/overview'
+// 根据布防数量统计井数量
 import { wellCountByBfzt } from '@/api/well'
+// 当前报警数
 import { deviceStaticByStatus, alarmNowStatic } from '@/api/dataStatics'
+// 根据工单状态统计工单数量
 import { jobCountByStatus } from '@/api/job'
 export default {
   components: {
@@ -49,22 +54,6 @@
         }
       ],
       dataGroup: [
-        // {
-        //   title: '井总数量',
-        //   context: '--',
-        //   icon: 'icon-well',
-        //   color: '#40c9c6',
-        //   path: '/wellList',
-        //   permission: '/well/list'
-        // },
-        // {
-        //   title: '总用水量',
-        //   context: '--',
-        //   icon: 'icon-water',
-        //   color: '#36a3f7',
-        //   path: '/wellList',
-        //   permission: '/well/list'
-        // },
         {
           title: '设备总数',
           context: '--',
@@ -89,14 +78,6 @@
           path: '/alarmNow',
           permission: '/alarm/now'
         }
-        // {
-        //   title: '未完成工单数',
-        //   context: '--',
-        //   icon: 'icon-order',
-        //   color: '#f4516c',
-        //   path: '/listJob',
-        //   permission: '/job/list'
-        // }
       ]
     }
   },
@@ -164,86 +145,86 @@
     flex:1;
   }
 
-  .card-panel {
-    height: 108px;
-    cursor: pointer;
-    font-size: 12px;
-    position: relative;
-    overflow: hidden;
-    color: #666;
-    background: #fff;
-    box-shadow: 4px 4px 40px rgba(0, 0, 0, .05);
-    border-color: rgba(0, 0, 0, .05);
+  // .card-panel {
+  //   height: 108px;
+  //   cursor: pointer;
+  //   font-size: 10px;
+  //   position: relative;
+  //   overflow: hidden;
+  //   color: #666;
+  //   background: #fff;
+  //   box-shadow: 4px 4px 40px rgba(0, 0, 0, .05);
+  //   border-color: rgba(0, 0, 0, .05);
 
-    &:hover {
-      .card-panel-icon-wrapper {
-        color: #fff;
-      }
+  //   &:hover {
+  //     .card-panel-icon-wrapper {
+  //       color: #fff;
+        
+  //     }
 
-      .icon-people {
-        background: #40c9c6;
-      }
+  //     .icon-people {
+  //       background: #40c9c6;
+  //     }
 
-      .icon-message {
-        background: #36a3f7;
-      }
+  //     .icon-message {
+  //       background: #36a3f7;
+  //     }
 
-      .icon-money {
-        background: #f4516c;
-      }
+  //     .icon-money {
+  //       background: #f4516c;
+  //     }
 
-      .icon-shopping {
-        background: #34bfa3
-      }
-    }
+  //     .icon-shopping {
+  //       background: #34bfa3
+  //     }
+  //   }
 
-    .icon-people {
-      color: #40c9c6;
-    }
+  //   // .icon-people {
+  //   //   color: #40c9c6;
+  //   // }
 
-    .icon-message {
-      color: #36a3f7;
-    }
+  //   // .icon-message {
+  //   //   color: #36a3f7;
+  //   // }
 
-    .icon-money {
-      color: #f4516c;
-    }
+  //   // .icon-money {
+  //   //   color: #f4516c;
+  //   // }
 
-    .icon-shopping {
-      color: #34bfa3
-    }
+  //   // .icon-shopping {
+  //   //   color: #34bfa3
+  //   // }
 
-    .card-panel-icon-wrapper {
-      float: left;
-      margin: 14px 0 0 14px;
-      padding: 16px;
-      transition: all 0.38s ease-out;
-      border-radius: 6px;
-    }
+  //   .card-panel-icon-wrapper {
+  //     float: left;
+  //     margin: 14px 0 0 14px;
+  //     padding: 16px;
+  //     transition: all 0.38s ease-out;
+  //     border-radius: 6px;
+  //   }
 
-    .card-panel-icon {
-      float: left;
-      font-size: 48px;
-    }
+  //   .card-panel-icon {
+  //     float: left;
+  //     font-size: 40px;
+  //   }
 
-    .card-panel-description {
-      float: right;
-      font-weight: bold;
-      margin: 26px;
-      margin-left: 0px;
+  //   .card-panel-description {
+  //     font-weight: bold;
+  //     margin: 26px;
+  //     margin-left: 0px;
 
-      .card-panel-text {
-        line-height: 18px;
-        color: rgba(0, 0, 0, 0.45);
-        font-size: 16px;
-        margin-bottom: 12px;
-      }
+  //     .card-panel-text {
+  //       line-height: 18px;
+  //       color: rgba(0, 0, 0, 0.45);
+  //       font-size: 14px;
+  //       margin-bottom: 12px;
+  //     }
 
-      .card-panel-num {
-        font-size: 20px;
-      }
-    }
-  }
+  //     .card-panel-num {
+  //       font-size: 18px;
+  //     }
+  //   }
+  // }
 }
 
 @media (max-width:550px) {
diff --git a/src/views/dashboard/components/watchAlarmBar.vue b/src/views/dashboard/components/watchAlarmBar.vue
index 6de166c..7f087da 100644
--- a/src/views/dashboard/components/watchAlarmBar.vue
+++ b/src/views/dashboard/components/watchAlarmBar.vue
@@ -186,6 +186,9 @@
     }
   }
   .statistic-container {
+    .el-button{
+      padding: 5px 10px;
+    }
     /*margin-bottom: 10px;*/
     text-align: center;
     .chart-tool-button {

diff --git a/package.json b/package.json
index 471cdb3..4d80891 100644
--- a/package.json
+++ b/package.json
@@ -64,7 +64,7 @@
     "html-webpack-plugin": "4.0.0-alpha",
     "mini-css-extract-plugin": "0.4.1",
     "node-notifier": "5.2.1",
-    "node-sass": "^4.12.0",
+    "node-sass": "^6.0.1",
     "optimize-css-assets-webpack-plugin": "5.0.0",
     "ora": "3.0.0",
     "path-to-regexp": "2.4.0",
diff --git a/src/components/BigData/Card/index.vue b/src/components/BigData/Card/index.vue
index 16e55f0..d71e609 100644
--- a/src/components/BigData/Card/index.vue
+++ b/src/components/BigData/Card/index.vue
@@ -79,19 +79,20 @@
 
     .card-panel-icon {
       float: left;
-      font-size: 48px;
+      font-size: 40px;
     }
 
     .card-panel-description {
-      float: left;
+      // float: left;
       font-weight: bold;
       margin: 26px;
-      margin-left: 10px;
+      // margin-left: 10px;
+      overflow: auto;
 
       .card-panel-text {
         line-height: 18px;
         color: rgba(0, 0, 0, 0.45);
-        font-size: 16px;
+        font-size: 14px;
         margin-bottom: 12px;
       }
 
diff --git a/src/components/BigData/Card1/index.vue b/src/components/BigData/Card1/index.vue
index d70262c..030b2dc 100644
--- a/src/components/BigData/Card1/index.vue
+++ b/src/components/BigData/Card1/index.vue
@@ -4,12 +4,28 @@
       <div :style="backgroundColor" class="card-panel-icon-wrapper">
         <svg-icon :icon-class="icon" class-name="card-panel-icon" />
       </div>
-      <div :style="{'padding-top':title.length===1?'20px':'0px'}" class="card-panel-description">
-        <div class="card-panel-text">
+      <div  class="card-panel-description">
+        <!-- <div class="card-panel-text">
           {{ title[0] }} <span class="card-panel-num">{{ context[0] }}</span>
         </div>
         <div class="card-panel-text" >
           {{ title[1] }} <span class="card-panel-num">{{ context[1] }}</span>
+        </div> -->
+        <div class="two" v-if="title.length===2">
+          <div class="card-panel-text">
+            {{ title[0] }} <span class="card-panel-num">{{ context[0] }}</span>
+          </div>
+          <div class="card-panel-text" >
+            {{ title[1] }} <span class="card-panel-num">{{ context[1] }}</span>
+          </div>
+        </div>
+        <div class="only" v-else>
+          <div class="card-panel-text">
+            {{ title[0] }}
+          </div>
+          <div class="card-panel-num" >
+            {{ context[0] }}
+          </div>
         </div>
       </div>
     </div>
@@ -82,27 +98,43 @@
 
     .card-panel-icon {
       float: left;
-      font-size: 48px;
+      font-size: 40px;
     }
 
     .card-panel-description {
       float: left;
       font-weight: bold;
       margin-top: 26px;
-      /*margin-left: 10px;*/
+      overflow: auto;
+      margin-left: 5px;
 
-      .card-panel-text {
-        line-height: 18px;
-        color: rgba(0, 0, 0, 0.45);
-        font-size: 16px;
-        margin-bottom: 12px;
+      .two{
+        .card-panel-text {
+          line-height: 18px;
+          color: rgba(0, 0, 0, 0.45);
+          font-size: 14px;
+          margin-bottom: 12px;
+        }
+
+        .card-panel-num {
+          font-size: 18px;
+          color: #666;
+          padding-left: 10px;
+          float: right;
+        }
       }
+      .only{
+        .card-panel-text {
+          line-height: 18px;
+          color: rgba(0, 0, 0, 0.45);
+          font-size: 14px;
+          margin-bottom: 12px;
+          padding-top: 0;
+        }
 
-      .card-panel-num {
-        font-size: 18px;
-        color: #666;
-        padding-left: 10px;
-        float: right;
+        .card-panel-num {
+          font-size: 20px;
+        }
       }
     }
   }
diff --git a/src/views/dashboard/components/AlarmByDays.vue b/src/views/dashboard/components/AlarmByDays.vue
index cb5c283..ddfd8e3 100644
--- a/src/views/dashboard/components/AlarmByDays.vue
+++ b/src/views/dashboard/components/AlarmByDays.vue
@@ -65,6 +65,7 @@
           delete item.data
           return item
         })
+        
         this.chartData.rows = arr
       })
     },
diff --git a/src/views/dashboard/components/PanelGroup.vue b/src/views/dashboard/components/PanelGroup.vue
index c04cf16..b72d289 100644
--- a/src/views/dashboard/components/PanelGroup.vue
+++ b/src/views/dashboard/components/PanelGroup.vue
@@ -3,6 +3,7 @@
     <div v-for="card in dataGroup1" :key="card.index" class="card-panel-col">
       <card1 :title="card.title" :context="card.context" :icon="card.icon" :color="card.color"/>
     </div>
+
     <div v-for="card in dataGroup" :key="card.title" class="card-panel-col">
       <div v-if="hasPerm(card.permission)">
         <card :title="card.title" :context="card.context" :icon="card.icon" :color="card.color" @click.native="goPage(card.path)"/>
@@ -14,9 +15,13 @@
 <script>
 import Card1 from '@/components/BigData/Card1'
 import Card from '@/components/BigData/Card'
+// 首页
 import { getWatchStatistic , waterMeterCount } from '@/api/overview'
+// 根据布防数量统计井数量
 import { wellCountByBfzt } from '@/api/well'
+// 当前报警数
 import { deviceStaticByStatus, alarmNowStatic } from '@/api/dataStatics'
+// 根据工单状态统计工单数量
 import { jobCountByStatus } from '@/api/job'
 export default {
   components: {
@@ -49,22 +54,6 @@
         }
       ],
       dataGroup: [
-        // {
-        //   title: '井总数量',
-        //   context: '--',
-        //   icon: 'icon-well',
-        //   color: '#40c9c6',
-        //   path: '/wellList',
-        //   permission: '/well/list'
-        // },
-        // {
-        //   title: '总用水量',
-        //   context: '--',
-        //   icon: 'icon-water',
-        //   color: '#36a3f7',
-        //   path: '/wellList',
-        //   permission: '/well/list'
-        // },
         {
           title: '设备总数',
           context: '--',
@@ -89,14 +78,6 @@
           path: '/alarmNow',
           permission: '/alarm/now'
         }
-        // {
-        //   title: '未完成工单数',
-        //   context: '--',
-        //   icon: 'icon-order',
-        //   color: '#f4516c',
-        //   path: '/listJob',
-        //   permission: '/job/list'
-        // }
       ]
     }
   },
@@ -164,86 +145,86 @@
     flex:1;
   }
 
-  .card-panel {
-    height: 108px;
-    cursor: pointer;
-    font-size: 12px;
-    position: relative;
-    overflow: hidden;
-    color: #666;
-    background: #fff;
-    box-shadow: 4px 4px 40px rgba(0, 0, 0, .05);
-    border-color: rgba(0, 0, 0, .05);
+  // .card-panel {
+  //   height: 108px;
+  //   cursor: pointer;
+  //   font-size: 10px;
+  //   position: relative;
+  //   overflow: hidden;
+  //   color: #666;
+  //   background: #fff;
+  //   box-shadow: 4px 4px 40px rgba(0, 0, 0, .05);
+  //   border-color: rgba(0, 0, 0, .05);
 
-    &:hover {
-      .card-panel-icon-wrapper {
-        color: #fff;
-      }
+  //   &:hover {
+  //     .card-panel-icon-wrapper {
+  //       color: #fff;
+        
+  //     }
 
-      .icon-people {
-        background: #40c9c6;
-      }
+  //     .icon-people {
+  //       background: #40c9c6;
+  //     }
 
-      .icon-message {
-        background: #36a3f7;
-      }
+  //     .icon-message {
+  //       background: #36a3f7;
+  //     }
 
-      .icon-money {
-        background: #f4516c;
-      }
+  //     .icon-money {
+  //       background: #f4516c;
+  //     }
 
-      .icon-shopping {
-        background: #34bfa3
-      }
-    }
+  //     .icon-shopping {
+  //       background: #34bfa3
+  //     }
+  //   }
 
-    .icon-people {
-      color: #40c9c6;
-    }
+  //   // .icon-people {
+  //   //   color: #40c9c6;
+  //   // }
 
-    .icon-message {
-      color: #36a3f7;
-    }
+  //   // .icon-message {
+  //   //   color: #36a3f7;
+  //   // }
 
-    .icon-money {
-      color: #f4516c;
-    }
+  //   // .icon-money {
+  //   //   color: #f4516c;
+  //   // }
 
-    .icon-shopping {
-      color: #34bfa3
-    }
+  //   // .icon-shopping {
+  //   //   color: #34bfa3
+  //   // }
 
-    .card-panel-icon-wrapper {
-      float: left;
-      margin: 14px 0 0 14px;
-      padding: 16px;
-      transition: all 0.38s ease-out;
-      border-radius: 6px;
-    }
+  //   .card-panel-icon-wrapper {
+  //     float: left;
+  //     margin: 14px 0 0 14px;
+  //     padding: 16px;
+  //     transition: all 0.38s ease-out;
+  //     border-radius: 6px;
+  //   }
 
-    .card-panel-icon {
-      float: left;
-      font-size: 48px;
-    }
+  //   .card-panel-icon {
+  //     float: left;
+  //     font-size: 40px;
+  //   }
 
-    .card-panel-description {
-      float: right;
-      font-weight: bold;
-      margin: 26px;
-      margin-left: 0px;
+  //   .card-panel-description {
+  //     font-weight: bold;
+  //     margin: 26px;
+  //     margin-left: 0px;
 
-      .card-panel-text {
-        line-height: 18px;
-        color: rgba(0, 0, 0, 0.45);
-        font-size: 16px;
-        margin-bottom: 12px;
-      }
+  //     .card-panel-text {
+  //       line-height: 18px;
+  //       color: rgba(0, 0, 0, 0.45);
+  //       font-size: 14px;
+  //       margin-bottom: 12px;
+  //     }
 
-      .card-panel-num {
-        font-size: 20px;
-      }
-    }
-  }
+  //     .card-panel-num {
+  //       font-size: 18px;
+  //     }
+  //   }
+  // }
 }
 
 @media (max-width:550px) {
diff --git a/src/views/dashboard/components/watchAlarmBar.vue b/src/views/dashboard/components/watchAlarmBar.vue
index 6de166c..7f087da 100644
--- a/src/views/dashboard/components/watchAlarmBar.vue
+++ b/src/views/dashboard/components/watchAlarmBar.vue
@@ -186,6 +186,9 @@
     }
   }
   .statistic-container {
+    .el-button{
+      padding: 5px 10px;
+    }
     /*margin-bottom: 10px;*/
     text-align: center;
     .chart-tool-button {
diff --git a/src/views/dashboard/components/waterCountByAreaBar.vue b/src/views/dashboard/components/waterCountByAreaBar.vue
index 0845249..13f74c6 100644
--- a/src/views/dashboard/components/waterCountByAreaBar.vue
+++ b/src/views/dashboard/components/waterCountByAreaBar.vue
@@ -186,6 +186,9 @@
     }
   }
   .statistic-container {
+    .el-button{
+      padding: 5px 10px;
+    }
     /*margin-bottom: 10px;*/
     text-align: center;
     .chart-tool-button {

diff --git a/package.json b/package.json
index 471cdb3..4d80891 100644
--- a/package.json
+++ b/package.json
@@ -64,7 +64,7 @@
     "html-webpack-plugin": "4.0.0-alpha",
     "mini-css-extract-plugin": "0.4.1",
     "node-notifier": "5.2.1",
-    "node-sass": "^4.12.0",
+    "node-sass": "^6.0.1",
     "optimize-css-assets-webpack-plugin": "5.0.0",
     "ora": "3.0.0",
     "path-to-regexp": "2.4.0",
diff --git a/src/components/BigData/Card/index.vue b/src/components/BigData/Card/index.vue
index 16e55f0..d71e609 100644
--- a/src/components/BigData/Card/index.vue
+++ b/src/components/BigData/Card/index.vue
@@ -79,19 +79,20 @@
 
     .card-panel-icon {
       float: left;
-      font-size: 48px;
+      font-size: 40px;
     }
 
     .card-panel-description {
-      float: left;
+      // float: left;
       font-weight: bold;
       margin: 26px;
-      margin-left: 10px;
+      // margin-left: 10px;
+      overflow: auto;
 
       .card-panel-text {
         line-height: 18px;
         color: rgba(0, 0, 0, 0.45);
-        font-size: 16px;
+        font-size: 14px;
         margin-bottom: 12px;
       }
 
diff --git a/src/components/BigData/Card1/index.vue b/src/components/BigData/Card1/index.vue
index d70262c..030b2dc 100644
--- a/src/components/BigData/Card1/index.vue
+++ b/src/components/BigData/Card1/index.vue
@@ -4,12 +4,28 @@
       <div :style="backgroundColor" class="card-panel-icon-wrapper">
         <svg-icon :icon-class="icon" class-name="card-panel-icon" />
       </div>
-      <div :style="{'padding-top':title.length===1?'20px':'0px'}" class="card-panel-description">
-        <div class="card-panel-text">
+      <div  class="card-panel-description">
+        <!-- <div class="card-panel-text">
           {{ title[0] }} <span class="card-panel-num">{{ context[0] }}</span>
         </div>
         <div class="card-panel-text" >
           {{ title[1] }} <span class="card-panel-num">{{ context[1] }}</span>
+        </div> -->
+        <div class="two" v-if="title.length===2">
+          <div class="card-panel-text">
+            {{ title[0] }} <span class="card-panel-num">{{ context[0] }}</span>
+          </div>
+          <div class="card-panel-text" >
+            {{ title[1] }} <span class="card-panel-num">{{ context[1] }}</span>
+          </div>
+        </div>
+        <div class="only" v-else>
+          <div class="card-panel-text">
+            {{ title[0] }}
+          </div>
+          <div class="card-panel-num" >
+            {{ context[0] }}
+          </div>
         </div>
       </div>
     </div>
@@ -82,27 +98,43 @@
 
     .card-panel-icon {
       float: left;
-      font-size: 48px;
+      font-size: 40px;
     }
 
     .card-panel-description {
       float: left;
       font-weight: bold;
       margin-top: 26px;
-      /*margin-left: 10px;*/
+      overflow: auto;
+      margin-left: 5px;
 
-      .card-panel-text {
-        line-height: 18px;
-        color: rgba(0, 0, 0, 0.45);
-        font-size: 16px;
-        margin-bottom: 12px;
+      .two{
+        .card-panel-text {
+          line-height: 18px;
+          color: rgba(0, 0, 0, 0.45);
+          font-size: 14px;
+          margin-bottom: 12px;
+        }
+
+        .card-panel-num {
+          font-size: 18px;
+          color: #666;
+          padding-left: 10px;
+          float: right;
+        }
       }
+      .only{
+        .card-panel-text {
+          line-height: 18px;
+          color: rgba(0, 0, 0, 0.45);
+          font-size: 14px;
+          margin-bottom: 12px;
+          padding-top: 0;
+        }
 
-      .card-panel-num {
-        font-size: 18px;
-        color: #666;
-        padding-left: 10px;
-        float: right;
+        .card-panel-num {
+          font-size: 20px;
+        }
       }
     }
   }
diff --git a/src/views/dashboard/components/AlarmByDays.vue b/src/views/dashboard/components/AlarmByDays.vue
index cb5c283..ddfd8e3 100644
--- a/src/views/dashboard/components/AlarmByDays.vue
+++ b/src/views/dashboard/components/AlarmByDays.vue
@@ -65,6 +65,7 @@
           delete item.data
           return item
         })
+        
         this.chartData.rows = arr
       })
     },
diff --git a/src/views/dashboard/components/PanelGroup.vue b/src/views/dashboard/components/PanelGroup.vue
index c04cf16..b72d289 100644
--- a/src/views/dashboard/components/PanelGroup.vue
+++ b/src/views/dashboard/components/PanelGroup.vue
@@ -3,6 +3,7 @@
     <div v-for="card in dataGroup1" :key="card.index" class="card-panel-col">
       <card1 :title="card.title" :context="card.context" :icon="card.icon" :color="card.color"/>
     </div>
+
     <div v-for="card in dataGroup" :key="card.title" class="card-panel-col">
       <div v-if="hasPerm(card.permission)">
         <card :title="card.title" :context="card.context" :icon="card.icon" :color="card.color" @click.native="goPage(card.path)"/>
@@ -14,9 +15,13 @@
 <script>
 import Card1 from '@/components/BigData/Card1'
 import Card from '@/components/BigData/Card'
+// 首页
 import { getWatchStatistic , waterMeterCount } from '@/api/overview'
+// 根据布防数量统计井数量
 import { wellCountByBfzt } from '@/api/well'
+// 当前报警数
 import { deviceStaticByStatus, alarmNowStatic } from '@/api/dataStatics'
+// 根据工单状态统计工单数量
 import { jobCountByStatus } from '@/api/job'
 export default {
   components: {
@@ -49,22 +54,6 @@
         }
       ],
       dataGroup: [
-        // {
-        //   title: '井总数量',
-        //   context: '--',
-        //   icon: 'icon-well',
-        //   color: '#40c9c6',
-        //   path: '/wellList',
-        //   permission: '/well/list'
-        // },
-        // {
-        //   title: '总用水量',
-        //   context: '--',
-        //   icon: 'icon-water',
-        //   color: '#36a3f7',
-        //   path: '/wellList',
-        //   permission: '/well/list'
-        // },
         {
           title: '设备总数',
           context: '--',
@@ -89,14 +78,6 @@
           path: '/alarmNow',
           permission: '/alarm/now'
         }
-        // {
-        //   title: '未完成工单数',
-        //   context: '--',
-        //   icon: 'icon-order',
-        //   color: '#f4516c',
-        //   path: '/listJob',
-        //   permission: '/job/list'
-        // }
       ]
     }
   },
@@ -164,86 +145,86 @@
     flex:1;
   }
 
-  .card-panel {
-    height: 108px;
-    cursor: pointer;
-    font-size: 12px;
-    position: relative;
-    overflow: hidden;
-    color: #666;
-    background: #fff;
-    box-shadow: 4px 4px 40px rgba(0, 0, 0, .05);
-    border-color: rgba(0, 0, 0, .05);
+  // .card-panel {
+  //   height: 108px;
+  //   cursor: pointer;
+  //   font-size: 10px;
+  //   position: relative;
+  //   overflow: hidden;
+  //   color: #666;
+  //   background: #fff;
+  //   box-shadow: 4px 4px 40px rgba(0, 0, 0, .05);
+  //   border-color: rgba(0, 0, 0, .05);
 
-    &:hover {
-      .card-panel-icon-wrapper {
-        color: #fff;
-      }
+  //   &:hover {
+  //     .card-panel-icon-wrapper {
+  //       color: #fff;
+        
+  //     }
 
-      .icon-people {
-        background: #40c9c6;
-      }
+  //     .icon-people {
+  //       background: #40c9c6;
+  //     }
 
-      .icon-message {
-        background: #36a3f7;
-      }
+  //     .icon-message {
+  //       background: #36a3f7;
+  //     }
 
-      .icon-money {
-        background: #f4516c;
-      }
+  //     .icon-money {
+  //       background: #f4516c;
+  //     }
 
-      .icon-shopping {
-        background: #34bfa3
-      }
-    }
+  //     .icon-shopping {
+  //       background: #34bfa3
+  //     }
+  //   }
 
-    .icon-people {
-      color: #40c9c6;
-    }
+  //   // .icon-people {
+  //   //   color: #40c9c6;
+  //   // }
 
-    .icon-message {
-      color: #36a3f7;
-    }
+  //   // .icon-message {
+  //   //   color: #36a3f7;
+  //   // }
 
-    .icon-money {
-      color: #f4516c;
-    }
+  //   // .icon-money {
+  //   //   color: #f4516c;
+  //   // }
 
-    .icon-shopping {
-      color: #34bfa3
-    }
+  //   // .icon-shopping {
+  //   //   color: #34bfa3
+  //   // }
 
-    .card-panel-icon-wrapper {
-      float: left;
-      margin: 14px 0 0 14px;
-      padding: 16px;
-      transition: all 0.38s ease-out;
-      border-radius: 6px;
-    }
+  //   .card-panel-icon-wrapper {
+  //     float: left;
+  //     margin: 14px 0 0 14px;
+  //     padding: 16px;
+  //     transition: all 0.38s ease-out;
+  //     border-radius: 6px;
+  //   }
 
-    .card-panel-icon {
-      float: left;
-      font-size: 48px;
-    }
+  //   .card-panel-icon {
+  //     float: left;
+  //     font-size: 40px;
+  //   }
 
-    .card-panel-description {
-      float: right;
-      font-weight: bold;
-      margin: 26px;
-      margin-left: 0px;
+  //   .card-panel-description {
+  //     font-weight: bold;
+  //     margin: 26px;
+  //     margin-left: 0px;
 
-      .card-panel-text {
-        line-height: 18px;
-        color: rgba(0, 0, 0, 0.45);
-        font-size: 16px;
-        margin-bottom: 12px;
-      }
+  //     .card-panel-text {
+  //       line-height: 18px;
+  //       color: rgba(0, 0, 0, 0.45);
+  //       font-size: 14px;
+  //       margin-bottom: 12px;
+  //     }
 
-      .card-panel-num {
-        font-size: 20px;
-      }
-    }
-  }
+  //     .card-panel-num {
+  //       font-size: 18px;
+  //     }
+  //   }
+  // }
 }
 
 @media (max-width:550px) {
diff --git a/src/views/dashboard/components/watchAlarmBar.vue b/src/views/dashboard/components/watchAlarmBar.vue
index 6de166c..7f087da 100644
--- a/src/views/dashboard/components/watchAlarmBar.vue
+++ b/src/views/dashboard/components/watchAlarmBar.vue
@@ -186,6 +186,9 @@
     }
   }
   .statistic-container {
+    .el-button{
+      padding: 5px 10px;
+    }
     /*margin-bottom: 10px;*/
     text-align: center;
     .chart-tool-button {
diff --git a/src/views/dashboard/components/waterCountByAreaBar.vue b/src/views/dashboard/components/waterCountByAreaBar.vue
index 0845249..13f74c6 100644
--- a/src/views/dashboard/components/waterCountByAreaBar.vue
+++ b/src/views/dashboard/components/waterCountByAreaBar.vue
@@ -186,6 +186,9 @@
     }
   }
   .statistic-container {
+    .el-button{
+      padding: 5px 10px;
+    }
     /*margin-bottom: 10px;*/
     text-align: center;
     .chart-tool-button {
diff --git a/src/views/dashboard/components/waterCountByDeptBar.vue b/src/views/dashboard/components/waterCountByDeptBar.vue
index b42cd7b..87016fb 100644
--- a/src/views/dashboard/components/waterCountByDeptBar.vue
+++ b/src/views/dashboard/components/waterCountByDeptBar.vue
@@ -159,7 +159,10 @@
     }
   }
   .statistic-container {
-    /*margin-bottom: 10px;*/
+    .el-button{
+      padding: 5px 10px;
+    }
+    // margin-bottom: 10px;
     text-align: center;
     .chart-tool-button {
       padding: 5px;

diff --git a/package.json b/package.json
index 471cdb3..4d80891 100644
--- a/package.json
+++ b/package.json
@@ -64,7 +64,7 @@
     "html-webpack-plugin": "4.0.0-alpha",
     "mini-css-extract-plugin": "0.4.1",
     "node-notifier": "5.2.1",
-    "node-sass": "^4.12.0",
+    "node-sass": "^6.0.1",
     "optimize-css-assets-webpack-plugin": "5.0.0",
     "ora": "3.0.0",
     "path-to-regexp": "2.4.0",
diff --git a/src/components/BigData/Card/index.vue b/src/components/BigData/Card/index.vue
index 16e55f0..d71e609 100644
--- a/src/components/BigData/Card/index.vue
+++ b/src/components/BigData/Card/index.vue
@@ -79,19 +79,20 @@
 
     .card-panel-icon {
       float: left;
-      font-size: 48px;
+      font-size: 40px;
     }
 
     .card-panel-description {
-      float: left;
+      // float: left;
       font-weight: bold;
       margin: 26px;
-      margin-left: 10px;
+      // margin-left: 10px;
+      overflow: auto;
 
       .card-panel-text {
         line-height: 18px;
         color: rgba(0, 0, 0, 0.45);
-        font-size: 16px;
+        font-size: 14px;
         margin-bottom: 12px;
       }
 
diff --git a/src/components/BigData/Card1/index.vue b/src/components/BigData/Card1/index.vue
index d70262c..030b2dc 100644
--- a/src/components/BigData/Card1/index.vue
+++ b/src/components/BigData/Card1/index.vue
@@ -4,12 +4,28 @@
       <div :style="backgroundColor" class="card-panel-icon-wrapper">
         <svg-icon :icon-class="icon" class-name="card-panel-icon" />
       </div>
-      <div :style="{'padding-top':title.length===1?'20px':'0px'}" class="card-panel-description">
-        <div class="card-panel-text">
+      <div  class="card-panel-description">
+        <!-- <div class="card-panel-text">
           {{ title[0] }} <span class="card-panel-num">{{ context[0] }}</span>
         </div>
         <div class="card-panel-text" >
           {{ title[1] }} <span class="card-panel-num">{{ context[1] }}</span>
+        </div> -->
+        <div class="two" v-if="title.length===2">
+          <div class="card-panel-text">
+            {{ title[0] }} <span class="card-panel-num">{{ context[0] }}</span>
+          </div>
+          <div class="card-panel-text" >
+            {{ title[1] }} <span class="card-panel-num">{{ context[1] }}</span>
+          </div>
+        </div>
+        <div class="only" v-else>
+          <div class="card-panel-text">
+            {{ title[0] }}
+          </div>
+          <div class="card-panel-num" >
+            {{ context[0] }}
+          </div>
         </div>
       </div>
     </div>
@@ -82,27 +98,43 @@
 
     .card-panel-icon {
       float: left;
-      font-size: 48px;
+      font-size: 40px;
     }
 
     .card-panel-description {
       float: left;
       font-weight: bold;
       margin-top: 26px;
-      /*margin-left: 10px;*/
+      overflow: auto;
+      margin-left: 5px;
 
-      .card-panel-text {
-        line-height: 18px;
-        color: rgba(0, 0, 0, 0.45);
-        font-size: 16px;
-        margin-bottom: 12px;
+      .two{
+        .card-panel-text {
+          line-height: 18px;
+          color: rgba(0, 0, 0, 0.45);
+          font-size: 14px;
+          margin-bottom: 12px;
+        }
+
+        .card-panel-num {
+          font-size: 18px;
+          color: #666;
+          padding-left: 10px;
+          float: right;
+        }
       }
+      .only{
+        .card-panel-text {
+          line-height: 18px;
+          color: rgba(0, 0, 0, 0.45);
+          font-size: 14px;
+          margin-bottom: 12px;
+          padding-top: 0;
+        }
 
-      .card-panel-num {
-        font-size: 18px;
-        color: #666;
-        padding-left: 10px;
-        float: right;
+        .card-panel-num {
+          font-size: 20px;
+        }
       }
     }
   }
diff --git a/src/views/dashboard/components/AlarmByDays.vue b/src/views/dashboard/components/AlarmByDays.vue
index cb5c283..ddfd8e3 100644
--- a/src/views/dashboard/components/AlarmByDays.vue
+++ b/src/views/dashboard/components/AlarmByDays.vue
@@ -65,6 +65,7 @@
           delete item.data
           return item
         })
+        
         this.chartData.rows = arr
       })
     },
diff --git a/src/views/dashboard/components/PanelGroup.vue b/src/views/dashboard/components/PanelGroup.vue
index c04cf16..b72d289 100644
--- a/src/views/dashboard/components/PanelGroup.vue
+++ b/src/views/dashboard/components/PanelGroup.vue
@@ -3,6 +3,7 @@
     <div v-for="card in dataGroup1" :key="card.index" class="card-panel-col">
       <card1 :title="card.title" :context="card.context" :icon="card.icon" :color="card.color"/>
     </div>
+
     <div v-for="card in dataGroup" :key="card.title" class="card-panel-col">
       <div v-if="hasPerm(card.permission)">
         <card :title="card.title" :context="card.context" :icon="card.icon" :color="card.color" @click.native="goPage(card.path)"/>
@@ -14,9 +15,13 @@
 <script>
 import Card1 from '@/components/BigData/Card1'
 import Card from '@/components/BigData/Card'
+// 首页
 import { getWatchStatistic , waterMeterCount } from '@/api/overview'
+// 根据布防数量统计井数量
 import { wellCountByBfzt } from '@/api/well'
+// 当前报警数
 import { deviceStaticByStatus, alarmNowStatic } from '@/api/dataStatics'
+// 根据工单状态统计工单数量
 import { jobCountByStatus } from '@/api/job'
 export default {
   components: {
@@ -49,22 +54,6 @@
         }
       ],
       dataGroup: [
-        // {
-        //   title: '井总数量',
-        //   context: '--',
-        //   icon: 'icon-well',
-        //   color: '#40c9c6',
-        //   path: '/wellList',
-        //   permission: '/well/list'
-        // },
-        // {
-        //   title: '总用水量',
-        //   context: '--',
-        //   icon: 'icon-water',
-        //   color: '#36a3f7',
-        //   path: '/wellList',
-        //   permission: '/well/list'
-        // },
         {
           title: '设备总数',
           context: '--',
@@ -89,14 +78,6 @@
           path: '/alarmNow',
           permission: '/alarm/now'
         }
-        // {
-        //   title: '未完成工单数',
-        //   context: '--',
-        //   icon: 'icon-order',
-        //   color: '#f4516c',
-        //   path: '/listJob',
-        //   permission: '/job/list'
-        // }
       ]
     }
   },
@@ -164,86 +145,86 @@
     flex:1;
   }
 
-  .card-panel {
-    height: 108px;
-    cursor: pointer;
-    font-size: 12px;
-    position: relative;
-    overflow: hidden;
-    color: #666;
-    background: #fff;
-    box-shadow: 4px 4px 40px rgba(0, 0, 0, .05);
-    border-color: rgba(0, 0, 0, .05);
+  // .card-panel {
+  //   height: 108px;
+  //   cursor: pointer;
+  //   font-size: 10px;
+  //   position: relative;
+  //   overflow: hidden;
+  //   color: #666;
+  //   background: #fff;
+  //   box-shadow: 4px 4px 40px rgba(0, 0, 0, .05);
+  //   border-color: rgba(0, 0, 0, .05);
 
-    &:hover {
-      .card-panel-icon-wrapper {
-        color: #fff;
-      }
+  //   &:hover {
+  //     .card-panel-icon-wrapper {
+  //       color: #fff;
+        
+  //     }
 
-      .icon-people {
-        background: #40c9c6;
-      }
+  //     .icon-people {
+  //       background: #40c9c6;
+  //     }
 
-      .icon-message {
-        background: #36a3f7;
-      }
+  //     .icon-message {
+  //       background: #36a3f7;
+  //     }
 
-      .icon-money {
-        background: #f4516c;
-      }
+  //     .icon-money {
+  //       background: #f4516c;
+  //     }
 
-      .icon-shopping {
-        background: #34bfa3
-      }
-    }
+  //     .icon-shopping {
+  //       background: #34bfa3
+  //     }
+  //   }
 
-    .icon-people {
-      color: #40c9c6;
-    }
+  //   // .icon-people {
+  //   //   color: #40c9c6;
+  //   // }
 
-    .icon-message {
-      color: #36a3f7;
-    }
+  //   // .icon-message {
+  //   //   color: #36a3f7;
+  //   // }
 
-    .icon-money {
-      color: #f4516c;
-    }
+  //   // .icon-money {
+  //   //   color: #f4516c;
+  //   // }
 
-    .icon-shopping {
-      color: #34bfa3
-    }
+  //   // .icon-shopping {
+  //   //   color: #34bfa3
+  //   // }
 
-    .card-panel-icon-wrapper {
-      float: left;
-      margin: 14px 0 0 14px;
-      padding: 16px;
-      transition: all 0.38s ease-out;
-      border-radius: 6px;
-    }
+  //   .card-panel-icon-wrapper {
+  //     float: left;
+  //     margin: 14px 0 0 14px;
+  //     padding: 16px;
+  //     transition: all 0.38s ease-out;
+  //     border-radius: 6px;
+  //   }
 
-    .card-panel-icon {
-      float: left;
-      font-size: 48px;
-    }
+  //   .card-panel-icon {
+  //     float: left;
+  //     font-size: 40px;
+  //   }
 
-    .card-panel-description {
-      float: right;
-      font-weight: bold;
-      margin: 26px;
-      margin-left: 0px;
+  //   .card-panel-description {
+  //     font-weight: bold;
+  //     margin: 26px;
+  //     margin-left: 0px;
 
-      .card-panel-text {
-        line-height: 18px;
-        color: rgba(0, 0, 0, 0.45);
-        font-size: 16px;
-        margin-bottom: 12px;
-      }
+  //     .card-panel-text {
+  //       line-height: 18px;
+  //       color: rgba(0, 0, 0, 0.45);
+  //       font-size: 14px;
+  //       margin-bottom: 12px;
+  //     }
 
-      .card-panel-num {
-        font-size: 20px;
-      }
-    }
-  }
+  //     .card-panel-num {
+  //       font-size: 18px;
+  //     }
+  //   }
+  // }
 }
 
 @media (max-width:550px) {
diff --git a/src/views/dashboard/components/watchAlarmBar.vue b/src/views/dashboard/components/watchAlarmBar.vue
index 6de166c..7f087da 100644
--- a/src/views/dashboard/components/watchAlarmBar.vue
+++ b/src/views/dashboard/components/watchAlarmBar.vue
@@ -186,6 +186,9 @@
     }
   }
   .statistic-container {
+    .el-button{
+      padding: 5px 10px;
+    }
     /*margin-bottom: 10px;*/
     text-align: center;
     .chart-tool-button {
diff --git a/src/views/dashboard/components/waterCountByAreaBar.vue b/src/views/dashboard/components/waterCountByAreaBar.vue
index 0845249..13f74c6 100644
--- a/src/views/dashboard/components/waterCountByAreaBar.vue
+++ b/src/views/dashboard/components/waterCountByAreaBar.vue
@@ -186,6 +186,9 @@
     }
   }
   .statistic-container {
+    .el-button{
+      padding: 5px 10px;
+    }
     /*margin-bottom: 10px;*/
     text-align: center;
     .chart-tool-button {
diff --git a/src/views/dashboard/components/waterCountByDeptBar.vue b/src/views/dashboard/components/waterCountByDeptBar.vue
index b42cd7b..87016fb 100644
--- a/src/views/dashboard/components/waterCountByDeptBar.vue
+++ b/src/views/dashboard/components/waterCountByDeptBar.vue
@@ -159,7 +159,10 @@
     }
   }
   .statistic-container {
-    /*margin-bottom: 10px;*/
+    .el-button{
+      padding: 5px 10px;
+    }
+    // margin-bottom: 10px;
     text-align: center;
     .chart-tool-button {
       padding: 5px;
diff --git a/src/views/dashboard/index.vue b/src/views/dashboard/index.vue
index 7c901b4..fdbc38a 100644
--- a/src/views/dashboard/index.vue
+++ b/src/views/dashboard/index.vue
@@ -1,22 +1,26 @@
 <template>
   <div class="dashboard-container" style="background-color: white">
     <panel-group ref="panelgroup"/>
-    <el-row>
+    <el-row :gutter="10">
+      <!-- 用水统计图 -->
       <el-col :span="12">
         <el-card shadow="never">
           <water-count-by-dept-bar/>
         </el-card>
       </el-col>
+      <!-- 用水走势图 -->
       <el-col :span="12">
         <el-card shadow="never">
           <water-count-by-day/>
         </el-card>
       </el-col>
+      <!-- 分区用水统计图 -->
       <el-col :span="12">
         <el-card shadow="never">
           <water-count-by-area-bar/>
         </el-card>
       </el-col>
+      <!-- 分区用水占比图 -->
       <el-col :span="12">
         <el-card shadow="never">
           <water-count-by-depy/>
@@ -126,6 +130,13 @@
 </script>
 
 <style rel="stylesheet/scss" lang="scss" scoped>
+.dashboard-container{
+  .el-row{
+    .el-col{
+      margin-bottom: 10px;
+    }
+  }
+}
 .dashboard {
   &-container {
     padding: 10px 20px;