对接设备监控api/修改备注20210715

package-lock.json

@@ -1812,63 +1812,6 @@
           "integrity": "sha1-/q7SVZc9LndVW4PbwIhRpsY1IPo=",
           "dev": true
         },
-        "ansi-styles": {
-          "version": "4.3.0",
-          "resolved": "https://registry.nlark.com/ansi-styles/download/ansi-styles-4.3.0.tgz?cache=0&sync_timestamp=1618995547052&other_urls=https%3A%2F%2Fregistry.nlark.com%2Fansi-styles%2Fdownload%2Fansi-styles-4.3.0.tgz",
-          "integrity": "sha1-7dgDYornHATIWuegkG7a00tkiTc=",
-          "dev": true,
-          "optional": true,
-          "requires": {
-            "color-convert": "^2.0.1"
-          }
-        },
-        "chalk": {
-          "version": "4.1.1",
-          "resolved": "https://registry.nlark.com/chalk/download/chalk-4.1.1.tgz?cache=0&sync_timestamp=1618995355917&other_urls=https%3A%2F%2Fregistry.nlark.com%2Fchalk%2Fdownload%2Fchalk-4.1.1.tgz",
-          "integrity": "sha1-yAs/qyi/Y3HmhjMl7uZ+YYt35q0=",
-          "dev": true,
-          "optional": true,
-          "requires": {
-            "ansi-styles": "^4.1.0",
-            "supports-color": "^7.1.0"
-          }
-        },
-        "color-convert": {
-          "version": "2.0.1",
-          "resolved": "https://registry.npm.taobao.org/color-convert/download/color-convert-2.0.1.tgz",
-          "integrity": "sha1-ctOmjVmMm9s68q0ehPIdiWq9TeM=",
-          "dev": true,
-          "optional": true,
-          "requires": {
-            "color-name": "~1.1.4"
-          }
-        },
-        "color-name": {
-          "version": "1.1.4",
-          "resolved": "https://registry.npm.taobao.org/color-name/download/color-name-1.1.4.tgz",
-          "integrity": "sha1-wqCah6y95pVD3m9j+jmVyCbFNqI=",
-          "dev": true,
-          "optional": true
-        },
-        "has-flag": {
-          "version": "4.0.0",
-          "resolved": "https://registry.nlark.com/has-flag/download/has-flag-4.0.0.tgz?cache=0&sync_timestamp=1618847009337&other_urls=https%3A%2F%2Fregistry.nlark.com%2Fhas-flag%2Fdownload%2Fhas-flag-4.0.0.tgz",
-          "integrity": "sha1-lEdx/ZyByBJlxNaUGGDaBrtZR5s=",
-          "dev": true,
-          "optional": true
-        },
-        "loader-utils": {
-          "version": "2.0.0",
-          "resolved": "https://registry.npm.taobao.org/loader-utils/download/loader-utils-2.0.0.tgz",
-          "integrity": "sha1-5MrOW4FtQloWa18JfhDNErNgZLA=",
-          "dev": true,
-          "optional": true,
-          "requires": {
-            "big.js": "^5.2.2",
-            "emojis-list": "^3.0.0",
-            "json5": "^2.1.2"
-          }
-        },
         "ssri": {
           "version": "8.0.1",
           "resolved": "https://registry.npm.taobao.org/ssri/download/ssri-8.0.1.tgz?cache=0&sync_timestamp=1617826725566&other_urls=https%3A%2F%2Fregistry.npm.taobao.org%2Fssri%2Fdownload%2Fssri-8.0.1.tgz",
@@ -1877,28 +1820,6 @@
           "requires": {
             "minipass": "^3.1.1"
           }
-        },
-        "supports-color": {
-          "version": "7.2.0",
-          "resolved": "https://registry.nlark.com/supports-color/download/supports-color-7.2.0.tgz?cache=0&sync_timestamp=1622293579301&other_urls=https%3A%2F%2Fregistry.nlark.com%2Fsupports-color%2Fdownload%2Fsupports-color-7.2.0.tgz",
-          "integrity": "sha1-G33NyzK4E4gBs+R4umpRyqiWSNo=",
-          "dev": true,
-          "optional": true,
-          "requires": {
-            "has-flag": "^4.0.0"
-          }
-        },
-        "vue-loader-v16": {
-          "version": "npm:vue-loader@16.3.0",
-          "resolved": "https://registry.nlark.com/vue-loader/download/vue-loader-16.3.0.tgz?cache=0&sync_timestamp=1624994309035&other_urls=https%3A%2F%2Fregistry.nlark.com%2Fvue-loader%2Fdownload%2Fvue-loader-16.3.0.tgz",
-          "integrity": "sha1-LxleS6D7DiY1ltaDDfF9Gjbok2w=",
-          "dev": true,
-          "optional": true,
-          "requires": {
-            "chalk": "^4.1.0",
-            "hash-sum": "^2.0.0",
-            "loader-utils": "^2.0.0"
-          }
         }
       }
     },
@@ -2278,7 +2199,7 @@
     },
     "abbrev": {
       "version": "1.1.1",
-      "resolved": "https://registry.npm.taobao.org/abbrev/download/abbrev-1.1.1.tgz",
+      "resolved": "https://registry.nlark.com/abbrev/download/abbrev-1.1.1.tgz",
       "integrity": "sha1-+PLIh60Qv2f2NPAFtph/7TF5qsg=",
       "dev": true
     },
@@ -2488,7 +2409,7 @@
     },
     "array-find-index": {
       "version": "1.0.2",
-      "resolved": "https://registry.npm.taobao.org/array-find-index/download/array-find-index-1.0.2.tgz",
+      "resolved": "https://registry.nlark.com/array-find-index/download/array-find-index-1.0.2.tgz",
       "integrity": "sha1-3wEKoSh+Fku9pvlyOwqWoexBh6E=",
       "dev": true
     },
@@ -2615,7 +2536,7 @@
     },
     "async-foreach": {
       "version": "0.1.3",
-      "resolved": "https://registry.npm.taobao.org/async-foreach/download/async-foreach-0.1.3.tgz",
+      "resolved": "https://registry.nlark.com/async-foreach/download/async-foreach-0.1.3.tgz",
       "integrity": "sha1-NhIfhFwFeBct5Bmpfb6x0W7DRUI=",
       "dev": true
     },
@@ -3284,7 +3205,7 @@
     },
     "camelcase-keys": {
       "version": "2.1.0",
-      "resolved": "https://registry.npm.taobao.org/camelcase-keys/download/camelcase-keys-2.1.0.tgz",
+      "resolved": "https://registry.nlark.com/camelcase-keys/download/camelcase-keys-2.1.0.tgz?cache=0&sync_timestamp=1624609060222&other_urls=https%3A%2F%2Fregistry.nlark.com%2Fcamelcase-keys%2Fdownload%2Fcamelcase-keys-2.1.0.tgz",
       "integrity": "sha1-MIvur/3ygRkFHvodkyITyRuPkuc=",
       "dev": true,
       "requires": {
@@ -3294,7 +3215,7 @@
       "dependencies": {
         "camelcase": {
           "version": "2.1.1",
-          "resolved": "https://registry.npm.taobao.org/camelcase/download/camelcase-2.1.1.tgz?cache=0&sync_timestamp=1603921799543&other_urls=https%3A%2F%2Fregistry.npm.taobao.org%2Fcamelcase%2Fdownload%2Fcamelcase-2.1.1.tgz",
+          "resolved": "https://registry.nlark.com/camelcase/download/camelcase-2.1.1.tgz",
           "integrity": "sha1-fB0W1nmhu+WcoCys7PsBHiAfWh8=",
           "dev": true
         }
@@ -3666,7 +3587,7 @@
     },
     "code-point-at": {
       "version": "1.1.0",
-      "resolved": "https://registry.npm.taobao.org/code-point-at/download/code-point-at-1.1.0.tgz",
+      "resolved": "https://registry.nlark.com/code-point-at/download/code-point-at-1.1.0.tgz",
       "integrity": "sha1-DQcLTQQ6W+ozovGkDi7bPZpMz3c=",
       "dev": true
     },
@@ -3832,7 +3753,7 @@
     },
     "console-control-strings": {
       "version": "1.1.0",
-      "resolved": "https://registry.npm.taobao.org/console-control-strings/download/console-control-strings-1.1.0.tgz",
+      "resolved": "https://registry.nlark.com/console-control-strings/download/console-control-strings-1.1.0.tgz",
       "integrity": "sha1-PXz0Rk22RG6mRL9LOVB/mFEAjo4=",
       "dev": true
     },
@@ -4408,7 +4329,7 @@
     },
     "currently-unhandled": {
       "version": "0.4.1",
-      "resolved": "https://registry.npm.taobao.org/currently-unhandled/download/currently-unhandled-0.4.1.tgz",
+      "resolved": "https://registry.nlark.com/currently-unhandled/download/currently-unhandled-0.4.1.tgz?cache=0&sync_timestamp=1618847033604&other_urls=https%3A%2F%2Fregistry.nlark.com%2Fcurrently-unhandled%2Fdownload%2Fcurrently-unhandled-0.4.1.tgz",
       "integrity": "sha1-mI3zP+qxke95mmE2nddsF635V+o=",
       "dev": true,
       "requires": {
@@ -6062,7 +5983,7 @@
         },
         "is-fullwidth-code-point": {
           "version": "1.0.0",
-          "resolved": "https://registry.npm.taobao.org/is-fullwidth-code-point/download/is-fullwidth-code-point-1.0.0.tgz?cache=0&other_urls=https%3A%2F%2Fregistry.npm.taobao.org%2Fis-fullwidth-code-point%2Fdownload%2Fis-fullwidth-code-point-1.0.0.tgz",
+          "resolved": "https://registry.nlark.com/is-fullwidth-code-point/download/is-fullwidth-code-point-1.0.0.tgz",
           "integrity": "sha1-754xOG8DGn8NZDr4L95QxFfvAMs=",
           "dev": true,
           "requires": {
@@ -6071,7 +5992,7 @@
         },
         "string-width": {
           "version": "1.0.2",
-          "resolved": "https://registry.npm.taobao.org/string-width/download/string-width-1.0.2.tgz?cache=0&sync_timestamp=1618558856477&other_urls=https%3A%2F%2Fregistry.npm.taobao.org%2Fstring-width%2Fdownload%2Fstring-width-1.0.2.tgz",
+          "resolved": "https://registry.npm.taobao.org/string-width/download/string-width-1.0.2.tgz?cache=0&sync_timestamp=1618558823901&other_urls=https%3A%2F%2Fregistry.npm.taobao.org%2Fstring-width%2Fdownload%2Fstring-width-1.0.2.tgz",
           "integrity": "sha1-EYvfW4zcUaKn5w0hHgfisLmxB9M=",
           "dev": true,
           "requires": {
@@ -6134,7 +6055,7 @@
     },
     "get-stdin": {
       "version": "4.0.1",
-      "resolved": "https://registry.npm.taobao.org/get-stdin/download/get-stdin-4.0.1.tgz",
+      "resolved": "https://registry.npm.taobao.org/get-stdin/download/get-stdin-4.0.1.tgz?cache=0&sync_timestamp=1618557719783&other_urls=https%3A%2F%2Fregistry.npm.taobao.org%2Fget-stdin%2Fdownload%2Fget-stdin-4.0.1.tgz",
       "integrity": "sha1-uWjGsKBDhDJJAui/Gl3zJXmkUP4=",
       "dev": true
     },
@@ -6215,7 +6136,7 @@
     },
     "globule": {
       "version": "1.3.2",
-      "resolved": "https://registry.npm.taobao.org/globule/download/globule-1.3.2.tgz?cache=0&sync_timestamp=1591641966255&other_urls=https%3A%2F%2Fregistry.npm.taobao.org%2Fglobule%2Fdownload%2Fglobule-1.3.2.tgz",
+      "resolved": "https://registry.nlark.com/globule/download/globule-1.3.2.tgz",
       "integrity": "sha1-2L3Z6eTu+PluJFmZpd7n612FKcQ=",
       "dev": true,
       "requires": {
@@ -6273,7 +6194,7 @@
     },
     "has-ansi": {
       "version": "2.0.0",
-      "resolved": "https://registry.npm.taobao.org/has-ansi/download/has-ansi-2.0.0.tgz",
+      "resolved": "https://registry.nlark.com/has-ansi/download/has-ansi-2.0.0.tgz",
       "integrity": "sha1-NPUEnOHs3ysGSa8+8k5F7TVBbZE=",
       "dev": true,
       "requires": {
@@ -6851,7 +6772,7 @@
     },
     "indent-string": {
       "version": "2.1.0",
-      "resolved": "https://registry.npm.taobao.org/indent-string/download/indent-string-2.1.0.tgz?cache=0&sync_timestamp=1618679442183&other_urls=https%3A%2F%2Fregistry.npm.taobao.org%2Findent-string%2Fdownload%2Findent-string-2.1.0.tgz",
+      "resolved": "https://registry.nlark.com/indent-string/download/indent-string-2.1.0.tgz",
       "integrity": "sha1-ji1INIdCEhtKghi3oTfppSBJ3IA=",
       "dev": true,
       "requires": {
@@ -7213,7 +7134,7 @@
     },
     "is-finite": {
       "version": "1.1.0",
-      "resolved": "https://registry.npm.taobao.org/is-finite/download/is-finite-1.1.0.tgz?cache=0&sync_timestamp=1617779324274&other_urls=https%3A%2F%2Fregistry.npm.taobao.org%2Fis-finite%2Fdownload%2Fis-finite-1.1.0.tgz",
+      "resolved": "https://registry.nlark.com/is-finite/download/is-finite-1.1.0.tgz",
       "integrity": "sha1-kEE1x3+0LAZB1qobzbxNqo2ggvM=",
       "dev": true
     },
@@ -7350,7 +7271,7 @@
     },
     "is-utf8": {
       "version": "0.2.1",
-      "resolved": "https://registry.npm.taobao.org/is-utf8/download/is-utf8-0.2.1.tgz",
+      "resolved": "https://registry.nlark.com/is-utf8/download/is-utf8-0.2.1.tgz",
       "integrity": "sha1-Sw2hRCEE0bM2NA6AeX6GXPOffXI=",
       "dev": true
     },
@@ -7403,7 +7324,7 @@
     },
     "js-base64": {
       "version": "2.6.4",
-      "resolved": "https://registry.npm.taobao.org/js-base64/download/js-base64-2.6.4.tgz",
+      "resolved": "https://registry.nlark.com/js-base64/download/js-base64-2.6.4.tgz",
       "integrity": "sha1-9OaGxd4eofhn28rT1G2WlCjfmMQ=",
       "dev": true
     },
@@ -7661,7 +7582,7 @@
     },
     "load-json-file": {
       "version": "1.1.0",
-      "resolved": "https://registry.npm.taobao.org/load-json-file/download/load-json-file-1.1.0.tgz",
+      "resolved": "https://registry.nlark.com/load-json-file/download/load-json-file-1.1.0.tgz",
       "integrity": "sha1-lWkFcI1YtLq0wiYbBPWfMcmTdMA=",
       "dev": true,
       "requires": {
@@ -7909,7 +7830,7 @@
     },
     "map-obj": {
       "version": "1.0.1",
-      "resolved": "https://registry.npm.taobao.org/map-obj/download/map-obj-1.0.1.tgz?cache=0&sync_timestamp=1617771296262&other_urls=https%3A%2F%2Fregistry.npm.taobao.org%2Fmap-obj%2Fdownload%2Fmap-obj-1.0.1.tgz",
+      "resolved": "https://registry.npm.taobao.org/map-obj/download/map-obj-1.0.1.tgz?cache=0&sync_timestamp=1617771341569&other_urls=https%3A%2F%2Fregistry.npm.taobao.org%2Fmap-obj%2Fdownload%2Fmap-obj-1.0.1.tgz",
       "integrity": "sha1-2TPOuSBdgr3PSIb2dCvcK03qFG0=",
       "dev": true
     },
@@ -8372,6 +8293,34 @@
       "integrity": "sha1-Mt6ir7Ppkm8C7lzoeUkCaRpna/M=",
       "dev": true
     },
+    "node-gyp": {
+      "version": "3.8.0",
+      "resolved": "https://registry.nlark.com/node-gyp/download/node-gyp-3.8.0.tgz?cache=0&sync_timestamp=1622168102506&other_urls=https%3A%2F%2Fregistry.nlark.com%2Fnode-gyp%2Fdownload%2Fnode-gyp-3.8.0.tgz",
+      "integrity": "sha1-VAMEJhwzDoDQ1e3OJTpoyzlkIYw=",
+      "dev": true,
+      "requires": {
+        "fstream": "^1.0.0",
+        "glob": "^7.0.3",
+        "graceful-fs": "^4.1.2",
+        "mkdirp": "^0.5.0",
+        "nopt": "2 || 3",
+        "npmlog": "0 || 1 || 2 || 3 || 4",
+        "osenv": "0",
+        "request": "^2.87.0",
+        "rimraf": "2",
+        "semver": "~5.3.0",
+        "tar": "^2.0.0",
+        "which": "1"
+      },
+      "dependencies": {
+        "semver": {
+          "version": "5.3.0",
+          "resolved": "https://registry.npm.taobao.org/semver/download/semver-5.3.0.tgz?cache=0&sync_timestamp=1616463603361&other_urls=https%3A%2F%2Fregistry.npm.taobao.org%2Fsemver%2Fdownload%2Fsemver-5.3.0.tgz",
+          "integrity": "sha1-myzl094C0XxgEq0yaqa00M9U+U8=",
+          "dev": true
+        }
+      }
+    },
     "node-ipc": {
       "version": "9.1.4",
       "resolved": "https://registry.npm.taobao.org/node-ipc/download/node-ipc-9.1.4.tgz?cache=0&sync_timestamp=1614360837674&other_urls=https%3A%2F%2Fregistry.npm.taobao.org%2Fnode-ipc%2Fdownload%2Fnode-ipc-9.1.4.tgz",
@@ -8461,7 +8410,7 @@
         },
         "ansi-styles": {
           "version": "2.2.1",
-          "resolved": "https://registry.nlark.com/ansi-styles/download/ansi-styles-2.2.1.tgz",
+          "resolved": "https://registry.nlark.com/ansi-styles/download/ansi-styles-2.2.1.tgz?cache=0&sync_timestamp=1618995778321&other_urls=https%3A%2F%2Fregistry.nlark.com%2Fansi-styles%2Fdownload%2Fansi-styles-2.2.1.tgz",
           "integrity": "sha1-tDLdM1i2NM914eRmQ2gkBTPB3b4=",
           "dev": true
         },
@@ -8549,21 +8498,15 @@
             "abbrev": "1"
           }
         },
-        "path-key": {
-          "version": "3.1.1",
-          "resolved": "https://registry.npm.taobao.org/path-key/download/path-key-3.1.1.tgz?cache=0&sync_timestamp=1617971613935&other_urls=https%3A%2F%2Fregistry.npm.taobao.org%2Fpath-key%2Fdownload%2Fpath-key-3.1.1.tgz",
-          "integrity": "sha1-WB9q3mWMu6ZaDTOA3ndTKVBU83U="
-        },
-        "semver": {
-          "version": "5.3.0",
-          "resolved": "https://registry.npm.taobao.org/semver/download/semver-5.3.0.tgz?cache=0&sync_timestamp=1616463603361&other_urls=https%3A%2F%2Fregistry.npm.taobao.org%2Fsemver%2Fdownload%2Fsemver-5.3.0.tgz",
-          "integrity": "sha1-myzl094C0XxgEq0yaqa00M9U+U8=",
-          "dev": true
-        },
-        "shebang-command": {
-          "version": "2.0.0",
-          "resolved": "https://registry.npm.taobao.org/shebang-command/download/shebang-command-2.0.0.tgz",
-          "integrity": "sha1-zNCvT4g1+9wmW4JGGq8MNmY/NOo="
+        "lru-cache": {
+          "version": "4.1.5",
+          "resolved": "https://registry.nlark.com/lru-cache/download/lru-cache-4.1.5.tgz",
+          "integrity": "sha1-i75Q6oW+1ZvJ4z3KuCNe6bz0Q80=",
+          "dev": true,
+          "requires": {
+            "pseudomap": "^1.0.2",
+            "yallist": "^2.1.2"
+          }
         },
         "strip-ansi": {
           "version": "3.0.1",
@@ -8580,25 +8523,6 @@
           "integrity": "sha1-U10EXOa2Nj+kARcIRimZXp3zJMc=",
           "dev": true
         },
-        "tar": {
-          "version": "2.2.2",
-          "resolved": "https://registry.npm.taobao.org/tar/download/tar-2.2.2.tgz?cache=0&sync_timestamp=1610045450553&other_urls=https%3A%2F%2Fregistry.npm.taobao.org%2Ftar%2Fdownload%2Ftar-2.2.2.tgz",
-          "integrity": "sha1-DKiEhWLHKZuLRG/2pNYM27I+3EA=",
-          "dev": true,
-          "requires": {
-            "block-stream": "*",
-            "fstream": "^1.0.12",
-            "inherits": "2"
-          }
-        },
-        "which": {
-          "version": "2.0.2",
-          "resolved": "https://registry.npm.taobao.org/which/download/which-2.0.2.tgz?cache=0&sync_timestamp=1605134855909&other_urls=https%3A%2F%2Fregistry.npm.taobao.org%2Fwhich%2Fdownload%2Fwhich-2.0.2.tgz",
-          "integrity": "sha1-fGqN0KY2oDJ+ELWckobu6T8/UbE=",
-          "requires": {
-            "isexe": "^2.0.0"
-          }
-        },
         "yallist": {
           "version": "2.1.2",
           "resolved": "https://registry.npm.taobao.org/yallist/download/yallist-2.1.2.tgz",
@@ -8607,6 +8531,15 @@
         }
       }
     },
+    "nopt": {
+      "version": "3.0.6",
+      "resolved": "https://registry.npm.taobao.org/nopt/download/nopt-3.0.6.tgz?cache=0&sync_timestamp=1597649892953&other_urls=https%3A%2F%2Fregistry.npm.taobao.org%2Fnopt%2Fdownload%2Fnopt-3.0.6.tgz",
+      "integrity": "sha1-xkZdvwirzU2zWTF/eaxopkayj/k=",
+      "dev": true,
+      "requires": {
+        "abbrev": "1"
+      }
+    },
     "normalize-package-data": {
       "version": "2.5.0",
       "resolved": "https://registry.npm.taobao.org/normalize-package-data/download/normalize-package-data-2.5.0.tgz",
@@ -8661,7 +8594,7 @@
     },
     "npmlog": {
       "version": "4.1.2",
-      "resolved": "https://registry.npm.taobao.org/npmlog/download/npmlog-4.1.2.tgz",
+      "resolved": "https://registry.nlark.com/npmlog/download/npmlog-4.1.2.tgz",
       "integrity": "sha1-CKfyqL9zRgR3mp76StXMcXq7lUs=",
       "dev": true,
       "requires": {
@@ -10139,7 +10072,7 @@
     },
     "read-pkg-up": {
       "version": "1.0.1",
-      "resolved": "https://registry.npm.taobao.org/read-pkg-up/download/read-pkg-up-1.0.1.tgz",
+      "resolved": "https://registry.nlark.com/read-pkg-up/download/read-pkg-up-1.0.1.tgz?cache=0&sync_timestamp=1618846971516&other_urls=https%3A%2F%2Fregistry.nlark.com%2Fread-pkg-up%2Fdownload%2Fread-pkg-up-1.0.1.tgz",
       "integrity": "sha1-nWPBMnbAZZGNV/ACpX9AobZD+wI=",
       "dev": true,
       "requires": {
@@ -10149,7 +10082,7 @@
       "dependencies": {
         "find-up": {
           "version": "1.1.2",
-          "resolved": "https://registry.npm.taobao.org/find-up/download/find-up-1.1.2.tgz?cache=0&sync_timestamp=1597170240264&other_urls=https%3A%2F%2Fregistry.npm.taobao.org%2Ffind-up%2Fdownload%2Ffind-up-1.1.2.tgz",
+          "resolved": "https://registry.nlark.com/find-up/download/find-up-1.1.2.tgz?cache=0&sync_timestamp=1618847130383&other_urls=https%3A%2F%2Fregistry.nlark.com%2Ffind-up%2Fdownload%2Ffind-up-1.1.2.tgz",
           "integrity": "sha1-ay6YIrGizgpgq2TWEOzK1TyyTQ8=",
           "dev": true,
           "requires": {
@@ -10159,7 +10092,7 @@
         },
         "path-exists": {
           "version": "2.1.0",
-          "resolved": "https://registry.npm.taobao.org/path-exists/download/path-exists-2.1.0.tgz",
+          "resolved": "https://registry.nlark.com/path-exists/download/path-exists-2.1.0.tgz",
           "integrity": "sha1-D+tsZPD8UY2adU3V77YscCJ2H0s=",
           "dev": true,
           "requires": {
@@ -10168,7 +10101,7 @@
         },
         "path-type": {
           "version": "1.1.0",
-          "resolved": "https://registry.npm.taobao.org/path-type/download/path-type-1.1.0.tgz?cache=0&sync_timestamp=1611752528858&other_urls=https%3A%2F%2Fregistry.npm.taobao.org%2Fpath-type%2Fdownload%2Fpath-type-1.1.0.tgz",
+          "resolved": "https://registry.nlark.com/path-type/download/path-type-1.1.0.tgz",
           "integrity": "sha1-WcRPfuSR2nBNpBXaWkBwuk+P5EE=",
           "dev": true,
           "requires": {
@@ -10223,7 +10156,7 @@
     },
     "redent": {
       "version": "1.0.0",
-      "resolved": "https://registry.nlark.com/redent/download/redent-1.0.0.tgz?cache=0&sync_timestamp=1620069780522&other_urls=https%3A%2F%2Fregistry.nlark.com%2Fredent%2Fdownload%2Fredent-1.0.0.tgz",
+      "resolved": "https://registry.nlark.com/redent/download/redent-1.0.0.tgz?cache=0&sync_timestamp=1620069702182&other_urls=https%3A%2F%2Fregistry.nlark.com%2Fredent%2Fdownload%2Fredent-1.0.0.tgz",
       "integrity": "sha1-z5Fqsf1fHxbfsggi3W7H9zDCr94=",
       "dev": true,
       "requires": {
@@ -10233,7 +10166,7 @@
       "dependencies": {
         "strip-indent": {
           "version": "1.0.1",
-          "resolved": "https://registry.nlark.com/strip-indent/download/strip-indent-1.0.1.tgz?cache=0&sync_timestamp=1620053263051&other_urls=https%3A%2F%2Fregistry.nlark.com%2Fstrip-indent%2Fdownload%2Fstrip-indent-1.0.1.tgz",
+          "resolved": "https://registry.nlark.com/strip-indent/download/strip-indent-1.0.1.tgz",
           "integrity": "sha1-DHlipq3vp7vUrDZkYKY4VSrhoKI=",
           "dev": true,
           "requires": {
@@ -10591,7 +10524,7 @@
       "dependencies": {
         "camelcase": {
           "version": "5.3.1",
-          "resolved": "https://registry.npm.taobao.org/camelcase/download/camelcase-5.3.1.tgz?cache=0&sync_timestamp=1603921799543&other_urls=https%3A%2F%2Fregistry.npm.taobao.org%2Fcamelcase%2Fdownload%2Fcamelcase-5.3.1.tgz",
+          "resolved": "https://registry.nlark.com/camelcase/download/camelcase-5.3.1.tgz",
           "integrity": "sha1-48mzFWnhBoEd8kL3FXJaH0xJQyA=",
           "dev": true
         },
@@ -10608,13 +10541,13 @@
         },
         "emoji-regex": {
           "version": "7.0.3",
-          "resolved": "https://registry.npm.taobao.org/emoji-regex/download/emoji-regex-7.0.3.tgz?cache=0&sync_timestamp=1614682725186&other_urls=https%3A%2F%2Fregistry.npm.taobao.org%2Femoji-regex%2Fdownload%2Femoji-regex-7.0.3.tgz",
+          "resolved": "https://registry.nlark.com/emoji-regex/download/emoji-regex-7.0.3.tgz",
           "integrity": "sha1-kzoEBShgyF6DwSJHnEdIqOTHIVY=",
           "dev": true
         },
         "find-up": {
           "version": "3.0.0",
-          "resolved": "https://registry.npm.taobao.org/find-up/download/find-up-3.0.0.tgz?cache=0&sync_timestamp=1597170240264&other_urls=https%3A%2F%2Fregistry.npm.taobao.org%2Ffind-up%2Fdownload%2Ffind-up-3.0.0.tgz",
+          "resolved": "https://registry.nlark.com/find-up/download/find-up-3.0.0.tgz?cache=0&sync_timestamp=1618847130383&other_urls=https%3A%2F%2Fregistry.nlark.com%2Ffind-up%2Fdownload%2Ffind-up-3.0.0.tgz",
           "integrity": "sha1-SRafHXmTQwZG2mHsxa41XCHJe3M=",
           "dev": true,
           "requires": {
@@ -10623,7 +10556,7 @@
         },
         "is-fullwidth-code-point": {
           "version": "2.0.0",
-          "resolved": "https://registry.npm.taobao.org/is-fullwidth-code-point/download/is-fullwidth-code-point-2.0.0.tgz?cache=0&other_urls=https%3A%2F%2Fregistry.npm.taobao.org%2Fis-fullwidth-code-point%2Fdownload%2Fis-fullwidth-code-point-2.0.0.tgz",
+          "resolved": "https://registry.nlark.com/is-fullwidth-code-point/download/is-fullwidth-code-point-2.0.0.tgz",
           "integrity": "sha1-o7MKXE8ZkYMWeqq5O+764937ZU8=",
           "dev": true
         },
@@ -10639,7 +10572,7 @@
         },
         "p-locate": {
           "version": "3.0.0",
-          "resolved": "https://registry.npm.taobao.org/p-locate/download/p-locate-3.0.0.tgz?cache=0&sync_timestamp=1597081369770&other_urls=https%3A%2F%2Fregistry.npm.taobao.org%2Fp-locate%2Fdownload%2Fp-locate-3.0.0.tgz",
+          "resolved": "https://registry.nlark.com/p-locate/download/p-locate-3.0.0.tgz",
           "integrity": "sha1-Mi1poFwCZLJZl9n0DNiokasAZKQ=",
           "dev": true,
           "requires": {
@@ -10648,13 +10581,13 @@
         },
         "path-exists": {
           "version": "3.0.0",
-          "resolved": "https://registry.npm.taobao.org/path-exists/download/path-exists-3.0.0.tgz",
+          "resolved": "https://registry.nlark.com/path-exists/download/path-exists-3.0.0.tgz",
           "integrity": "sha1-zg6+ql94yxiSXqfYENe1mwEP1RU=",
           "dev": true
         },
         "string-width": {
           "version": "3.1.0",
-          "resolved": "https://registry.npm.taobao.org/string-width/download/string-width-3.1.0.tgz?cache=0&sync_timestamp=1618558856477&other_urls=https%3A%2F%2Fregistry.npm.taobao.org%2Fstring-width%2Fdownload%2Fstring-width-3.1.0.tgz",
+          "resolved": "https://registry.npm.taobao.org/string-width/download/string-width-3.1.0.tgz?cache=0&sync_timestamp=1618558823901&other_urls=https%3A%2F%2Fregistry.npm.taobao.org%2Fstring-width%2Fdownload%2Fstring-width-3.1.0.tgz",
           "integrity": "sha1-InZ74htirxCBV0MG9prFG2IgOWE=",
           "dev": true,
           "requires": {
@@ -10674,7 +10607,7 @@
         },
         "wrap-ansi": {
           "version": "5.1.0",
-          "resolved": "https://registry.npm.taobao.org/wrap-ansi/download/wrap-ansi-5.1.0.tgz?cache=0&sync_timestamp=1618558923406&other_urls=https%3A%2F%2Fregistry.npm.taobao.org%2Fwrap-ansi%2Fdownload%2Fwrap-ansi-5.1.0.tgz",
+          "resolved": "https://registry.npm.taobao.org/wrap-ansi/download/wrap-ansi-5.1.0.tgz?cache=0&sync_timestamp=1618558887146&other_urls=https%3A%2F%2Fregistry.npm.taobao.org%2Fwrap-ansi%2Fdownload%2Fwrap-ansi-5.1.0.tgz",
           "integrity": "sha1-H9H2cjXVttD+54EFYAG/tpTAOwk=",
           "dev": true,
           "requires": {
@@ -10685,7 +10618,7 @@
         },
         "yargs": {
           "version": "13.3.2",
-          "resolved": "https://registry.nlark.com/yargs/download/yargs-13.3.2.tgz?cache=0&sync_timestamp=1620086581476&other_urls=https%3A%2F%2Fregistry.nlark.com%2Fyargs%2Fdownload%2Fyargs-13.3.2.tgz",
+          "resolved": "https://registry.nlark.com/yargs/download/yargs-13.3.2.tgz",
           "integrity": "sha1-rX/+/sGqWVZayRX4Lcyzipwxot0=",
           "dev": true,
           "requires": {
@@ -11643,7 +11576,7 @@
     },
     "strip-bom": {
       "version": "2.0.0",
-      "resolved": "https://registry.npm.taobao.org/strip-bom/download/strip-bom-2.0.0.tgz",
+      "resolved": "https://registry.nlark.com/strip-bom/download/strip-bom-2.0.0.tgz",
       "integrity": "sha1-YhmoVhZSBJHzV4i9vxRHqZx+aw4=",
       "dev": true,
       "requires": {
@@ -11786,6 +11719,17 @@
       "integrity": "sha1-ofzMBrWNth/XpF2i2kT186Pme6I=",
       "dev": true
     },
+    "tar": {
+      "version": "2.2.2",
+      "resolved": "https://registry.nlark.com/tar/download/tar-2.2.2.tgz?cache=0&sync_timestamp=1618847020118&other_urls=https%3A%2F%2Fregistry.nlark.com%2Ftar%2Fdownload%2Ftar-2.2.2.tgz",
+      "integrity": "sha1-DKiEhWLHKZuLRG/2pNYM27I+3EA=",
+      "dev": true,
+      "requires": {
+        "block-stream": "*",
+        "fstream": "^1.0.12",
+        "inherits": "2"
+      }
+    },
     "terser": {
       "version": "4.8.0",
       "resolved": "https://registry.nlark.com/terser/download/terser-4.8.0.tgz",
@@ -12534,6 +12478,87 @@
         }
       }
     },
+    "vue-loader-v16": {
+      "version": "npm:vue-loader@16.3.0",
+      "resolved": "https://registry.nlark.com/vue-loader/download/vue-loader-16.3.0.tgz?cache=0&sync_timestamp=1624994309035&other_urls=https%3A%2F%2Fregistry.nlark.com%2Fvue-loader%2Fdownload%2Fvue-loader-16.3.0.tgz",
+      "integrity": "sha1-LxleS6D7DiY1ltaDDfF9Gjbok2w=",
+      "dev": true,
+      "optional": true,
+      "requires": {
+        "chalk": "^4.1.0",
+        "hash-sum": "^2.0.0",
+        "loader-utils": "^2.0.0"
+      },
+      "dependencies": {
+        "ansi-styles": {
+          "version": "4.3.0",
+          "resolved": "https://registry.nlark.com/ansi-styles/download/ansi-styles-4.3.0.tgz?cache=0&sync_timestamp=1618995778321&other_urls=https%3A%2F%2Fregistry.nlark.com%2Fansi-styles%2Fdownload%2Fansi-styles-4.3.0.tgz",
+          "integrity": "sha1-7dgDYornHATIWuegkG7a00tkiTc=",
+          "dev": true,
+          "optional": true,
+          "requires": {
+            "color-convert": "^2.0.1"
+          }
+        },
+        "chalk": {
+          "version": "4.1.1",
+          "resolved": "https://registry.nlark.com/chalk/download/chalk-4.1.1.tgz?cache=0&sync_timestamp=1618995355917&other_urls=https%3A%2F%2Fregistry.nlark.com%2Fchalk%2Fdownload%2Fchalk-4.1.1.tgz",
+          "integrity": "sha1-yAs/qyi/Y3HmhjMl7uZ+YYt35q0=",
+          "dev": true,
+          "optional": true,
+          "requires": {
+            "ansi-styles": "^4.1.0",
+            "supports-color": "^7.1.0"
+          }
+        },
+        "color-convert": {
+          "version": "2.0.1",
+          "resolved": "https://registry.nlark.com/color-convert/download/color-convert-2.0.1.tgz",
+          "integrity": "sha1-ctOmjVmMm9s68q0ehPIdiWq9TeM=",
+          "dev": true,
+          "optional": true,
+          "requires": {
+            "color-name": "~1.1.4"
+          }
+        },
+        "color-name": {
+          "version": "1.1.4",
+          "resolved": "https://registry.npm.taobao.org/color-name/download/color-name-1.1.4.tgz",
+          "integrity": "sha1-wqCah6y95pVD3m9j+jmVyCbFNqI=",
+          "dev": true,
+          "optional": true
+        },
+        "has-flag": {
+          "version": "4.0.0",
+          "resolved": "https://registry.nlark.com/has-flag/download/has-flag-4.0.0.tgz?cache=0&sync_timestamp=1618847009337&other_urls=https%3A%2F%2Fregistry.nlark.com%2Fhas-flag%2Fdownload%2Fhas-flag-4.0.0.tgz",
+          "integrity": "sha1-lEdx/ZyByBJlxNaUGGDaBrtZR5s=",
+          "dev": true,
+          "optional": true
+        },
+        "loader-utils": {
+          "version": "2.0.0",
+          "resolved": "https://registry.npm.taobao.org/loader-utils/download/loader-utils-2.0.0.tgz",
+          "integrity": "sha1-5MrOW4FtQloWa18JfhDNErNgZLA=",
+          "dev": true,
+          "optional": true,
+          "requires": {
+            "big.js": "^5.2.2",
+            "emojis-list": "^3.0.0",
+            "json5": "^2.1.2"
+          }
+        },
+        "supports-color": {
+          "version": "7.2.0",
+          "resolved": "https://registry.nlark.com/supports-color/download/supports-color-7.2.0.tgz?cache=0&sync_timestamp=1622293579301&other_urls=https%3A%2F%2Fregistry.nlark.com%2Fsupports-color%2Fdownload%2Fsupports-color-7.2.0.tgz",
+          "integrity": "sha1-G33NyzK4E4gBs+R4umpRyqiWSNo=",
+          "dev": true,
+          "optional": true,
+          "requires": {
+            "has-flag": "^4.0.0"
+          }
+        }
+      }
+    },
     "vue-router": {
       "version": "4.0.8",
       "resolved": "https://registry.nlark.com/vue-router/download/vue-router-4.0.8.tgz",
@@ -13267,7 +13292,7 @@
     },
     "wide-align": {
       "version": "1.1.3",
-      "resolved": "https://registry.npm.taobao.org/wide-align/download/wide-align-1.1.3.tgz",
+      "resolved": "https://registry.nlark.com/wide-align/download/wide-align-1.1.3.tgz",
       "integrity": "sha1-rgdOa9wMFKQx6ATmJFScYzsABFc=",
       "dev": true,
       "requires": {
@@ -13282,13 +13307,13 @@
         },
         "is-fullwidth-code-point": {
           "version": "2.0.0",
-          "resolved": "https://registry.npm.taobao.org/is-fullwidth-code-point/download/is-fullwidth-code-point-2.0.0.tgz?cache=0&other_urls=https%3A%2F%2Fregistry.npm.taobao.org%2Fis-fullwidth-code-point%2Fdownload%2Fis-fullwidth-code-point-2.0.0.tgz",
+          "resolved": "https://registry.nlark.com/is-fullwidth-code-point/download/is-fullwidth-code-point-2.0.0.tgz",
           "integrity": "sha1-o7MKXE8ZkYMWeqq5O+764937ZU8=",
           "dev": true
         },
         "string-width": {
           "version": "2.1.1",
-          "resolved": "https://registry.npm.taobao.org/string-width/download/string-width-2.1.1.tgz?cache=0&sync_timestamp=1618558856477&other_urls=https%3A%2F%2Fregistry.npm.taobao.org%2Fstring-width%2Fdownload%2Fstring-width-2.1.1.tgz",
+          "resolved": "https://registry.npm.taobao.org/string-width/download/string-width-2.1.1.tgz?cache=0&sync_timestamp=1618558823901&other_urls=https%3A%2F%2Fregistry.npm.taobao.org%2Fstring-width%2Fdownload%2Fstring-width-2.1.1.tgz",
           "integrity": "sha1-q5Pyeo3BPSjKyBXEYhQ6bZASrp4=",
           "dev": true,
           "requires": {

src/assets/css/index.css

@@ -77,18 +77,22 @@ header {
 
 .topBox {
     height: 70%;
-    border: 1px solid red;
+    /* border: 1px solid red; */
 }
 
 .bottomBox {
     height: calc(30% - 0.45rem);
-    border: 1px solid pink;
+    /* border: 1px solid red; */
     margin-top: 0.225rem;
 }
 
+.bottomBox .panel {
+    padding-top: .7rem
+}
+
 .bottomBox .column {
     text-align: end;
-    border: 1px solid red
+    /* border: 1px solid red */
 }
 
 .bottomBox .column:first-child {
@@ -113,14 +117,17 @@ header {
 
 .panel.statisTop {
     height: 60%;
-    border: 1px solid green
+    /* border: 1px solid red */
 }
 
+
 /* el-select 下拉框 样式 */
-.el-input__suffix{
+
+.el-input__suffix {
     line-height: 1rem !important;
 }
-.el-input--suffix .el-input__inner{
+
+.el-input--suffix .el-input__inner {
     margin-top: 0.2rem;
     width: 2rem !important;
     height: 0.375rem !important;
@@ -129,38 +136,43 @@ header {
     font-size: 0.18rem !important;
     border: 1px #4BF4F9 solid !important;
     border-radius: 0px !important;
-    
 }
-.el-input--suffix .el-input__icon{
+
+.el-input--suffix .el-input__icon {
     width: 0.3125rem;
     line-height: 0.375rem !important;
 }
-.el-input--suffix .el-select__caret{
-    color:#4BF4F9 !important;
+
+.el-input--suffix .el-select__caret {
+    color: #4BF4F9 !important;
     font-size: 0.175rem !important;
 }
-.el-input__prefix, .el-input__suffix{
+
+.el-input__prefix,
+.el-input__suffix {
     top: -0.30rem !important;
 }
-/* el-select 下拉框 样式 */
 
 
+/* el-select 下拉框 样式 */
+
 .panel.statisBottom {
     height: calc(100% - 60% - 0.225rem);
-    border: 1px solid blue
+    /* border: 1px solid red */
 }
 
 .panel.deviceSum {
     height: 50%;
-    border: 1px solid red;
+    /* border: 1px solid red; */
 }
 
 .panel.operStatus {
     height: calc(50% - 0.225rem);
-    border: 1px solid red;
+    /* border: 1px solid red; */
 }
 
-.panel::before {
+.panel::before,
+.mapBox::before {
     position: absolute;
     top: 0;
     left: 0;
@@ -169,9 +181,11 @@ header {
     height: 10px;
     border-top: 2px solid #02a6b5;
     border-left: 2px solid #02a6b5;
+    z-index: 999
 }
 
-.panel::after {
+.panel::after,
+.mapBox::after {
     position: absolute;
     top: 0;
     right: 0;
@@ -180,6 +194,7 @@ header {
     height: 10px;
     border-top: 2px solid #02a6b5;
     border-right: 2px solid #02a6b5;
+    z-index: 999
 }
 
 .panel .panel-footer {
@@ -198,6 +213,7 @@ header {
     height: 10px;
     border-bottom: 2px solid #02a6b5;
     border-left: 2px solid #02a6b5;
+    z-index: 999
 }
 
 .panel .panel-footer::after {
@@ -209,6 +225,7 @@ header {
     height: 10px;
     border-bottom: 2px solid #02a6b5;
     border-right: 2px solid #02a6b5;
+    z-index: 999
 }
 
 .panel h2 {
@@ -416,6 +433,14 @@ p {
     background-image: url(../images/statisTop-bg.png);
 }
 
+.deviceSum {
+    background-image: url(../images/deviceSum.png);
+}
+
+.currentUsage {
+    background-image: url(../images/currentUsage-bg.png);
+}
+
 .statisSec .statisBottom ul {
     height: 100%;
 }
@@ -452,5 +477,28 @@ p {
     bottom: 0
 }
 
+.filterSec {
+    position: absolute;
+    top: .7rem;
+    right: 10px;
+    z-index: 11111111
+}
+
+.filterSec select,
+.filterSec option {
+    border: 1px solid #2399ed;
+    min-width: 2.05rem;
+    font-size: .15rem;
+    height: .27rem;
+    color: #2399ed;
+    line-height: 0.45rem;
+    /* background: rgba(0, 0, 0, 0); */
+    outline: none;
+    padding-left: 0.1rem;
+    background-image: -webkit-linear-gradient(bottom, #1298f5, #fff);
+    -webkit-background-clip: text;
+    -webkit-text-fill-color: transparent;
+}
+
 
 /* ming end */

src/views/home/components/barChart.vue

@@ -0,0 +1,184 @@
+<template>
+  <div ref="distion" style="width: 100%; height: 100%"></div>
+</template>
+<script>
+import * as echarts from "echarts";
+
+export default {
+  props: {},
+  data() {
+    return {};
+  },
+
+  mounted() {
+    this.$nextTick(() => {
+      this.initChart();
+    });
+  },
+
+  beforeUnmount() {
+    window.removeEventListener("resize", this.chart);
+  },
+
+  methods: {
+    //次数分布折线图
+    initChart() {
+      var chart = echarts.init(this.$refs.distion);
+      var option;
+
+      option = {
+        //    backgroundColor:'#323a5e',
+        tooltip: {
+          trigger: "axis",
+          axisPointer: {
+            // 坐标轴指示器，坐标轴触发有效
+            type: "shadow", // 默认为直线，可选为：'line' | 'shadow'
+          },
+        },
+        grid: {
+          left: "0%",
+          right: "0%",
+          bottom: "0%",
+          top: "22%",
+          containLabel: true,
+        },
+        legend: {
+          itemGap: 30,
+          left: '30%',
+          top: 0,
+          textStyle: {
+            color: "#fff",
+          },
+          itemWidth: 12,
+          itemHeight: 10,
+        },
+        xAxis: {
+          type: "category",
+          data: ["0:00",
+            "2:00",
+            "4:00",
+            "6:00",
+            "8:00",
+            "10:00",
+            "12:00",
+            "13:00",
+            "16:00",
+            "18:00",
+            "20:00",
+            "22:00",
+          ],
+          axisLine: {
+            lineStyle: {
+              color:"rgba(0,0,0,0.1)",
+            },
+          },
+          axisTick: {
+                show: false
+            },
+          axisLabel: {
+            // interval: 0,
+            // rotate: 40,
+            textStyle: {
+                 color: '#fff',
+              fontFamily: "Microsoft YaHei",
+            },
+          },
+        },
+
+        yAxis: {
+          type: "value",
+        //   max: "800",
+          axisLine: {
+            show: false,
+            lineStyle: {
+              color: "white",
+            },
+          },
+          splitLine: {
+            show: true,
+            lineStyle: {
+              color: "rgba(255,255,255,0.1)",
+            },
+          },
+          axisLabel: {},
+        },
+        // dataZoom: [
+        //   {
+        //     show: true,
+        //     height: 12,
+        //     xAxisIndex: [0],
+        //     bottom: "8%",
+        //     start: 10,
+        //     end: 90,
+        //     handleIcon:
+        //       "path://M306.1,413c0,2.2-1.8,4-4,4h-59.8c-2.2,0-4-1.8-4-4V200.8c0-2.2,1.8-4,4-4h59.8c2.2,0,4,1.8,4,4V413z",
+        //     handleSize: "110%",
+        //     handleStyle: {
+        //       color: "#d3dee5",
+        //     },
+        //     textStyle: {
+        //       color: "#fff",
+        //     },
+        //     borderColor: "#90979c",
+        //   },
+        //   {
+        //     type: "inside",
+        //     show: true,
+        //     height: 15,
+        //     start: 1,
+        //     end: 35,
+        //   },
+        // ],
+        series: [
+          {
+            name: "昨日",
+            type: "bar",
+            barWidth: "20%",
+            barGap: '0%',
+            itemStyle: {
+              normal: {
+                color: new echarts.graphic.LinearGradient(0, 0, 0, 1, [
+                  {
+                    offset: 0,
+                    color: "#00A7FD",
+                  },
+                  {
+                    offset: 1,
+                    color: "#00A7FD",
+                  },
+                ]),
+              },
+            },
+            data: [40, 40, 30, 30, 30, 40, 40, 40, 30,40,50,60],
+          },
+          {
+            name: "当日",
+            type: "bar",
+            barWidth: "20%",
+            itemStyle: {
+              normal: {
+                color: new echarts.graphic.LinearGradient(0, 0, 0, 1, [
+                  {
+                    offset: 0,
+                    color: "#FD8F00",
+                  },
+                  {
+                    offset: 1,
+                    color: "#FD8F00",
+                  },
+                ]),
+              },
+            },
+            data: [40, 50, 50, 50, 50, 40, 40, 50, 50,20,40,30],
+          },
+        ],
+      };
+
+      chart.setOption(option);
+      window.addEventListener("resize", () => {
+        chart.resize();
+      });
+    },
+  },
+};
+</script>

src/views/home/components/lineChart.vue

@@ -0,0 +1,129 @@
+<template>
+  <div ref="distion" style="width: 100%; height: 100%"></div>
+</template>
+<script>
+import * as echarts from "echarts";
+
+export default {
+  props: {},
+  data() {
+    return {};
+  },
+
+  mounted() {
+    this.$nextTick(() => {
+      this.initChart();
+    });
+  },
+
+  beforeUnmount() {
+    window.removeEventListener("resize", this.chart);
+  },
+
+  methods: {
+    //次数分布折线图
+    initChart() {
+      var chart = echarts.init(this.$refs.distion);
+      var option;
+
+      var arr = new Array();
+      for (var i = 0; i < 32; i++) {
+        arr.push(i);
+      }
+
+      option = {
+        color: ["#00F4FD", "#FD8F00"],
+        tooltip: {
+          trigger: "axis",
+        },
+        // 图列组件
+        legend: {
+          itemHeight: 10, //改变圆圈大小
+          itemWidth: 26, //改变圆圈大小
+          itemGap: 30,
+          textStyle: {
+            color: "#fff",
+          },
+
+          left: "30%",
+          top: 0,
+        },
+        grid: {
+          left: "0%",
+          right: "0%",
+          bottom: "0%",
+          top: "20%",
+          containLabel: true,
+        },
+        xAxis: {
+          type: "category",
+          boundaryGap: true,
+          data: arr,
+          axisTick: {
+            show: false, //去除刻度线
+          },
+          axisLabel: {
+            color: "#fff", // 文本颜色
+          },
+          axisLine: {
+            show: false, // 去除轴线
+          },
+        },
+        yAxis: {
+          type: "value",
+          axisTick: {
+            show: false, //去除刻度线
+          },
+          axisLabel: {
+            color: "#fff", // 文本颜色
+          },
+          axisLine: {
+            show: false, // 去除轴线
+          },
+          splitNumber: 5,
+          splitLine: {
+            show: true,
+            lineStyle: {
+              color: "rgba(255,255,255,0.1)",
+            },
+          },
+        },
+        series: [
+          {
+            name: "故障数量",
+            type: "line",
+            smooth: false, // 曲线是否平滑显示
+            // data: yearData[0].data[0],
+            data: [
+              24, 40, 101, 134, 90, 230, 210, 230, 120, 230, 210, 120, 230, 210,
+              230, 120, 230, 210, 120, 120, 230, 210, 230, 120, 230, 210, 120,
+              24, 40, 101, 134, 90, 230,
+            ],
+            symbolSize: 6, //拐点圆的大小
+            // symbol: 'circle',
+          },
+          {
+            name: "故障抢修数量",
+            type: "line",
+            smooth: false, // 曲线是否平滑显示
+            // data: yearData[0].data[1],
+            data: [
+              30, 50, 110, 144, 110, 240, 228, 240, 130, 240, 220, 130, 110,
+              240, 228, 240, 130, 240, 220, 130, 240, 228, 240, 130, 240, 220,
+              130, 30, 50, 110, 144, 110, 240, 228, 240,
+            ],
+            symbolSize: 6, //拐点圆的大小
+            // symbol: 'circle',
+          },
+        ],
+      };
+
+      chart.setOption(option);
+      window.addEventListener("resize", () => {
+        chart.resize();
+      });
+      this.chart = chart;
+    },
+  },
+};
+</script>

src/views/home/components/pieChart.vue

@@ -1,3 +1,161 @@
 <template>
-    <div>dsds</div>
-</template>
+
+  <div ref="distion" style="width: 100%; height: 100%"></div>
+</template>
+<script>
+import * as echarts from "echarts";
+
+export default {
+  props: {
+    // className: {
+    //   type: String,
+    //   default: "chart",
+    // },
+    // width: {
+    //   type: String,
+    //   default: "100%",
+    // },
+    // height: {
+    //   type: String,
+    //   default: "400px",
+    // },
+    // perData: {
+    //   type: Array,
+    //   default: () => [
+    //     {
+    //       color: "#01ACFF",
+    //       name: "摄像头",
+    //       value: [39],
+    //       // nAmount: 566557.14,
+    //     },
+    //   ],
+    // },
+  },
+  data() {
+    return {};
+  },
+
+  mounted() {
+    this.$nextTick(() => {
+      this.initChart();
+    });
+  },
+
+  beforeUnmount() {
+    window.removeEventListener("resize", this.chart);
+  },
+
+  methods: {
+    //次数分布折线图
+    initChart() {
+      var chart = echarts.init(this.$refs.distion);
+      var option;
+
+      var pie = [
+        {
+          value: 50,
+          name: "正常",
+        },
+        {
+          value: 150,
+          name: "故障",
+        },
+        {
+          value: 100,
+          name: "离线",
+        },
+        {
+          value: 100,
+          name: "预警",
+        },
+        {
+          value: 100,
+          name: "其他",
+        },
+      ];
+      var totalNum = 0;
+      pie.forEach(function (value) {
+        totalNum += value.value;
+      });
+
+      option = {
+        grid: {
+        },
+
+        title: [
+          {
+            text: "{name|" + totalNum + "}\n{val|设备总数}",
+            top: "center",
+            left: "center",
+            textStyle: {
+              rich: {
+                name: {
+                  fontSize: 30,
+                  fontWeight: "normal",
+                  color: "#FFFFFF",
+                  fontFamily:"impact",
+                   padding: [0, 0,3,0]
+
+                },
+                val: {
+                  fontSize: 14,
+                  fontWeight: "normal",
+                  color: "#FFFFFF",
+                  padding: [3,0,0, 0]
+                },
+              },
+            },
+          },
+        ],
+        tooltip: {
+          trigger: "item",
+          formatter: function (params) {
+            return (
+              params.name +
+              "：" +
+              params.value +
+              "<br>占比：" +
+              params.percent.toFixed(2) +
+              "%"
+            );
+          },
+        },
+        // itemStyle:{
+        //     normal: {
+        //          label: {
+        //              show: true,
+        //         position: 'outside',
+        //              color: 'green',
+        //          }
+        //     }
+        // },
+
+        series: [
+          {
+            label: {
+              normal: {
+                show: true,
+                formatter: " {b}：{c} ",
+              },
+              emphasis: {
+                show: true,
+              },
+            },
+            name: "访问来源",
+            radius: ["45%", "67%"],
+            type: "pie", 
+            data: pie,
+          },
+        ],
+        color: ["#0DFE95", "#F7B61C", "#2BCCFF", "#FE5C0D", "#4388F9"],
+      };
+
+      chart.setOption(option);
+      window.addEventListener("resize", () => {
+        chart.resize();
+      });
+      this.chart = chart;
+    },
+  },
+};
+</script>

src/views/home/components/statisBottom.vue

@@ -26,6 +26,7 @@
         <p class="timeEle">年用电量</p>
       </li>
     </ul>
+    <div class="panel-footer"></div>
   </div>
 </template>
 <script>

src/views/home/components/statisTop.vue

@@ -44,6 +44,10 @@
         </div>
       </li>
     </ul>
+
+    <div class="panel-footer">
+      
+    </div>
   </div>
 </template>
 <script>

src/views/home/index.vue

@@ -5,46 +5,60 @@
         <div class="column statisSec">
           <statis-top></statis-top>
           <statis-bottom></statis-bottom>
-
-          <!-- <div class="panel statisBottom">
-            <h2>折线图-人员变化</h2>
-            <div class="chart"></div>
-            <div class="panel-footer"></div>
-          </div> -->
-          <!-- <div class="panel pie">
-          <h2>饼形图-年龄分布</h2>
-          <div class="chart"></div>
-          <div class="panel-footer"></div>
-        </div> -->
         </div>
-        <div class="column">
-          <!-- @click="Overview()" -->
-          <div class="map" id="mapF" style="">
-          <div id="pickerBox">
-            <input id="pickerInput" placeholder="输入关键字选取地点" />
-            <div id="poiInfo"></div>
-          </div>
+        <div class="column mapBox">
+          <div class="map panel" id="mapF" style="height:100%;z-index:999999999999;width:100%">
+            <div id="pickerBox">
+              <input id="pickerInput" placeholder="输入关键字选取地点" />
+              <div id="poiInfo"></div>
+            </div>
+            <div class="panel-footer"></div>
           </div>
         </div>
         <div class="column">
           <div class="panel deviceSum">
+            <div class="filterSec">
+              <select name="" id="">
+                <option value="3">日</option>
+                <option value="4">月</option>
+              </select>
+            </div>
+
             <pie-chart></pie-chart>
+            <div class="panel-footer"></div>
           </div>
           <div class="panel line1 operStatus">
-            <h2>折线图-播放量</h2>
+            <h2>锥形图</h2>
             <div class="chart"></div>
             <div class="panel-footer"></div>
           </div>
-          <!-- <div class="panel pie1">
-          <h2>饼形图-地区分布</h2>
-          <div class="chart"></div>
-          <div class="panel-footer"></div>
-        </div> -->
         </div>
       </div>
       <div class="bottomBox">
-        <div class="column">221</div>
-        <div class="column">21211</div>
+        <div class="column">
+          <div class="panel currentUsage" style="height: 100%">
+             <div class="filterSec">
+              <select name="" id="">
+                <option value="1">当日用量趋势</option>
+                <option value="2">当月用量趋势</option>
+              </select>
+            </div>
+            <bar-chart></bar-chart>
+            <div class="panel-footer"></div>
+          </div>
+        </div>
+        <div class="column">
+          <div class="panel currentUsage" style="height: 100%">
+             <div class="filterSec">
+              <select name="" id="">
+                <option value="11">日</option>
+                <option value="22">月</option>
+              </select>
+            </div>
+            <line-chart></line-chart>
+            <div class="panel-footer"></div>
+          </div>
+        </div>
       </div>
     </section>
   </div>
@@ -53,12 +67,14 @@
 import statisTop from "./components/statisTop";
 import statisBottom from "./components/statisBottom";
 import pieChart from "./components/pieChart";
+import barChart from "./components/barChart";
+import lineChart from "./components/lineChart";
 // 地图
 import AMap from "AMap";
 import AMapUI from "AMapUI";
 export default {
   name: "index",
-  components: { statisTop, statisBottom, pieChart },
+  components: { statisTop, statisBottom, pieChart, barChart, lineChart },
   data() {
     return {
       map: null,
@@ -223,7 +239,7 @@ export default {
     },
     initMapUi() {
       console.log(22);
-      AMapUI.load(["ui/misc/PoiPicker"],  (PoiPicker)=> {
+      AMapUI.load(["ui/misc/PoiPicker"], (PoiPicker) => {
         console.log(PoiPicker);
         let poiPickers = new PoiPicker({
           //city:'北京',