修改router/添加导航菜单样式

package-lock.json

@@ -1807,6 +1807,63 @@
           "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",
@@ -1815,6 +1872,28 @@
           "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"
+          }
         }
       }
     },
@@ -3191,7 +3270,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=1624608993530&other_urls=https%3A%2F%2Fregistry.nlark.com%2Fcamelcase-keys%2Fdownload%2Fcamelcase-keys-2.1.0.tgz",
       "integrity": "sha1-MIvur/3ygRkFHvodkyITyRuPkuc=",
       "dev": true,
       "requires": {
@@ -3201,7 +3280,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.npm.taobao.org/camelcase/download/camelcase-2.1.1.tgz",
           "integrity": "sha1-fB0W1nmhu+WcoCys7PsBHiAfWh8=",
           "dev": true
         }
@@ -4920,7 +4999,7 @@
     },
     "env-paths": {
       "version": "2.2.1",
-      "resolved": "https://registry.npm.taobao.org/env-paths/download/env-paths-2.2.1.tgz",
+      "resolved": "https://registry.nlark.com/env-paths/download/env-paths-2.2.1.tgz",
       "integrity": "sha1-QgOZ1BbOH76bwKB8Yvpo1n/Q+PI=",
       "dev": true
     },
@@ -5846,7 +5925,7 @@
     },
     "fs-minipass": {
       "version": "2.1.0",
-      "resolved": "https://registry.npm.taobao.org/fs-minipass/download/fs-minipass-2.1.0.tgz?cache=0&sync_timestamp=1579628584498&other_urls=https%3A%2F%2Fregistry.npm.taobao.org%2Ffs-minipass%2Fdownload%2Ffs-minipass-2.1.0.tgz",
+      "resolved": "https://registry.npm.taobao.org/fs-minipass/download/fs-minipass-2.1.0.tgz",
       "integrity": "sha1-f1A2/b8SxjwWkZDL5BmchSJx+fs=",
       "dev": true,
       "requires": {
@@ -5908,13 +5987,13 @@
       "dependencies": {
         "ansi-regex": {
           "version": "2.1.1",
-          "resolved": "https://registry.npm.taobao.org/ansi-regex/download/ansi-regex-2.1.1.tgz?cache=0&sync_timestamp=1618552978881&other_urls=https%3A%2F%2Fregistry.npm.taobao.org%2Fansi-regex%2Fdownload%2Fansi-regex-2.1.1.tgz",
+          "resolved": "https://registry.nlark.com/ansi-regex/download/ansi-regex-2.1.1.tgz",
           "integrity": "sha1-w7M6te42DYbg5ijwRorn7yfWVN8=",
           "dev": true
         },
         "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.npm.taobao.org/is-fullwidth-code-point/download/is-fullwidth-code-point-1.0.0.tgz?cache=0&sync_timestamp=1618552489864&other_urls=https%3A%2F%2Fregistry.npm.taobao.org%2Fis-fullwidth-code-point%2Fdownload%2Fis-fullwidth-code-point-1.0.0.tgz",
           "integrity": "sha1-754xOG8DGn8NZDr4L95QxFfvAMs=",
           "dev": true,
           "requires": {
@@ -5923,7 +6002,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=1618558751438&other_urls=https%3A%2F%2Fregistry.npm.taobao.org%2Fstring-width%2Fdownload%2Fstring-width-1.0.2.tgz",
           "integrity": "sha1-EYvfW4zcUaKn5w0hHgfisLmxB9M=",
           "dev": true,
           "requires": {
@@ -5934,7 +6013,7 @@
         },
         "strip-ansi": {
           "version": "3.0.1",
-          "resolved": "https://registry.npm.taobao.org/strip-ansi/download/strip-ansi-3.0.1.tgz?cache=0&sync_timestamp=1618553351145&other_urls=https%3A%2F%2Fregistry.npm.taobao.org%2Fstrip-ansi%2Fdownload%2Fstrip-ansi-3.0.1.tgz",
+          "resolved": "https://registry.npm.taobao.org/strip-ansi/download/strip-ansi-3.0.1.tgz?cache=0&sync_timestamp=1618553320591&other_urls=https%3A%2F%2Fregistry.npm.taobao.org%2Fstrip-ansi%2Fdownload%2Fstrip-ansi-3.0.1.tgz",
           "integrity": "sha1-ajhfuIU9lS1f8F0Oiq+UJ43GPc8=",
           "dev": true,
           "requires": {
@@ -6067,7 +6146,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.npm.taobao.org/globule/download/globule-1.3.2.tgz",
       "integrity": "sha1-2L3Z6eTu+PluJFmZpd7n612FKcQ=",
       "dev": true,
       "requires": {
@@ -6134,7 +6213,7 @@
       "dependencies": {
         "ansi-regex": {
           "version": "2.1.1",
-          "resolved": "https://registry.npm.taobao.org/ansi-regex/download/ansi-regex-2.1.1.tgz?cache=0&sync_timestamp=1618552978881&other_urls=https%3A%2F%2Fregistry.npm.taobao.org%2Fansi-regex%2Fdownload%2Fansi-regex-2.1.1.tgz",
+          "resolved": "https://registry.nlark.com/ansi-regex/download/ansi-regex-2.1.1.tgz",
           "integrity": "sha1-w7M6te42DYbg5ijwRorn7yfWVN8=",
           "dev": true
         }
@@ -7250,7 +7329,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?cache=0&sync_timestamp=1621703447855&other_urls=https%3A%2F%2Fregistry.nlark.com%2Fjs-base64%2Fdownload%2Fjs-base64-2.6.4.tgz",
       "integrity": "sha1-9OaGxd4eofhn28rT1G2WlCjfmMQ=",
       "dev": true
     },
@@ -7521,7 +7600,7 @@
       "dependencies": {
         "parse-json": {
           "version": "2.2.0",
-          "resolved": "https://registry.npm.taobao.org/parse-json/download/parse-json-2.2.0.tgz?cache=0&sync_timestamp=1610966667117&other_urls=https%3A%2F%2Fregistry.npm.taobao.org%2Fparse-json%2Fdownload%2Fparse-json-2.2.0.tgz",
+          "resolved": "https://registry.npm.taobao.org/parse-json/download/parse-json-2.2.0.tgz?cache=0&sync_timestamp=1610966646988&other_urls=https%3A%2F%2Fregistry.npm.taobao.org%2Fparse-json%2Fdownload%2Fparse-json-2.2.0.tgz",
           "integrity": "sha1-9ID0BDTvgHQfhGkJn43qGPVaTck=",
           "dev": true,
           "requires": {
@@ -7756,7 +7835,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=1617771232226&other_urls=https%3A%2F%2Fregistry.npm.taobao.org%2Fmap-obj%2Fdownload%2Fmap-obj-1.0.1.tgz",
       "integrity": "sha1-2TPOuSBdgr3PSIb2dCvcK03qFG0=",
       "dev": true
     },
@@ -7804,7 +7883,7 @@
     },
     "meow": {
       "version": "3.7.0",
-      "resolved": "https://registry.nlark.com/meow/download/meow-3.7.0.tgz?cache=0&sync_timestamp=1620227920685&other_urls=https%3A%2F%2Fregistry.nlark.com%2Fmeow%2Fdownload%2Fmeow-3.7.0.tgz",
+      "resolved": "https://registry.nlark.com/meow/download/meow-3.7.0.tgz",
       "integrity": "sha1-cstmi0JSKCkKu/qFaJJYcwioAfs=",
       "dev": true,
       "requires": {
@@ -8234,7 +8313,7 @@
     },
     "node-gyp": {
       "version": "7.1.2",
-      "resolved": "https://registry.npm.taobao.org/node-gyp/download/node-gyp-7.1.2.tgz?cache=0&sync_timestamp=1617410095989&other_urls=https%3A%2F%2Fregistry.npm.taobao.org%2Fnode-gyp%2Fdownload%2Fnode-gyp-7.1.2.tgz",
+      "resolved": "https://registry.nlark.com/node-gyp/download/node-gyp-7.1.2.tgz",
       "integrity": "sha1-IagQrrsYcSAlHDvOyXmvFYexiK4=",
       "dev": true,
       "requires": {
@@ -8252,7 +8331,7 @@
       "dependencies": {
         "lru-cache": {
           "version": "6.0.0",
-          "resolved": "https://registry.npm.taobao.org/lru-cache/download/lru-cache-6.0.0.tgz?cache=0&sync_timestamp=1594427519396&other_urls=https%3A%2F%2Fregistry.npm.taobao.org%2Flru-cache%2Fdownload%2Flru-cache-6.0.0.tgz",
+          "resolved": "https://registry.npm.taobao.org/lru-cache/download/lru-cache-6.0.0.tgz",
           "integrity": "sha1-bW/mVw69lqr5D8rR2vo7JWbbOpQ=",
           "dev": true,
           "requires": {
@@ -8270,7 +8349,7 @@
         },
         "semver": {
           "version": "7.3.5",
-          "resolved": "https://registry.npm.taobao.org/semver/download/semver-7.3.5.tgz?cache=0&sync_timestamp=1616463550093&other_urls=https%3A%2F%2Fregistry.npm.taobao.org%2Fsemver%2Fdownload%2Fsemver-7.3.5.tgz",
+          "resolved": "https://registry.npm.taobao.org/semver/download/semver-7.3.5.tgz?cache=0&sync_timestamp=1616463603361&other_urls=https%3A%2F%2Fregistry.npm.taobao.org%2Fsemver%2Fdownload%2Fsemver-7.3.5.tgz",
           "integrity": "sha1-C2Ich5NI2JmOSw5L6Us/EuYBjvc=",
           "dev": true,
           "requires": {
@@ -8279,7 +8358,7 @@
         },
         "which": {
           "version": "2.0.2",
-          "resolved": "https://registry.npm.taobao.org/which/download/which-2.0.2.tgz",
+          "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=",
           "dev": true,
           "requires": {
@@ -8352,7 +8431,7 @@
     },
     "node-sass": {
       "version": "5.0.0",
-      "resolved": "https://registry.nlark.com/node-sass/download/node-sass-5.0.0.tgz?cache=0&sync_timestamp=1620488271974&other_urls=https%3A%2F%2Fregistry.nlark.com%2Fnode-sass%2Fdownload%2Fnode-sass-5.0.0.tgz",
+      "resolved": "https://registry.nlark.com/node-sass/download/node-sass-5.0.0.tgz",
       "integrity": "sha1-To85++87rI0txy6+O1OXEYg6eNI=",
       "dev": true,
       "requires": {
@@ -8376,19 +8455,19 @@
       "dependencies": {
         "ansi-regex": {
           "version": "2.1.1",
-          "resolved": "https://registry.npm.taobao.org/ansi-regex/download/ansi-regex-2.1.1.tgz?cache=0&sync_timestamp=1618552978881&other_urls=https%3A%2F%2Fregistry.npm.taobao.org%2Fansi-regex%2Fdownload%2Fansi-regex-2.1.1.tgz",
+          "resolved": "https://registry.nlark.com/ansi-regex/download/ansi-regex-2.1.1.tgz",
           "integrity": "sha1-w7M6te42DYbg5ijwRorn7yfWVN8=",
           "dev": true
         },
         "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=1618995547052&other_urls=https%3A%2F%2Fregistry.nlark.com%2Fansi-styles%2Fdownload%2Fansi-styles-2.2.1.tgz",
           "integrity": "sha1-tDLdM1i2NM914eRmQ2gkBTPB3b4=",
           "dev": true
         },
         "chalk": {
           "version": "1.1.3",
-          "resolved": "https://registry.nlark.com/chalk/download/chalk-1.1.3.tgz?cache=0&sync_timestamp=1618995384030&other_urls=https%3A%2F%2Fregistry.nlark.com%2Fchalk%2Fdownload%2Fchalk-1.1.3.tgz",
+          "resolved": "https://registry.nlark.com/chalk/download/chalk-1.1.3.tgz?cache=0&sync_timestamp=1618995355917&other_urls=https%3A%2F%2Fregistry.nlark.com%2Fchalk%2Fdownload%2Fchalk-1.1.3.tgz",
           "integrity": "sha1-qBFcVeSnAv5NFQq9OHKCKn4J/Jg=",
           "dev": true,
           "requires": {
@@ -8412,13 +8491,13 @@
         },
         "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=1617971691339&other_urls=https%3A%2F%2Fregistry.npm.taobao.org%2Fpath-key%2Fdownload%2Fpath-key-3.1.1.tgz",
+          "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=",
           "dev": true
         },
         "shebang-command": {
           "version": "2.0.0",
-          "resolved": "https://registry.npm.taobao.org/shebang-command/download/shebang-command-2.0.0.tgz?cache=0&sync_timestamp=1590294659008&other_urls=https%3A%2F%2Fregistry.npm.taobao.org%2Fshebang-command%2Fdownload%2Fshebang-command-2.0.0.tgz",
+          "resolved": "https://registry.npm.taobao.org/shebang-command/download/shebang-command-2.0.0.tgz",
           "integrity": "sha1-zNCvT4g1+9wmW4JGGq8MNmY/NOo=",
           "dev": true,
           "requires": {
@@ -8433,7 +8512,7 @@
         },
         "strip-ansi": {
           "version": "3.0.1",
-          "resolved": "https://registry.npm.taobao.org/strip-ansi/download/strip-ansi-3.0.1.tgz?cache=0&sync_timestamp=1618553351145&other_urls=https%3A%2F%2Fregistry.npm.taobao.org%2Fstrip-ansi%2Fdownload%2Fstrip-ansi-3.0.1.tgz",
+          "resolved": "https://registry.npm.taobao.org/strip-ansi/download/strip-ansi-3.0.1.tgz?cache=0&sync_timestamp=1618553320591&other_urls=https%3A%2F%2Fregistry.npm.taobao.org%2Fstrip-ansi%2Fdownload%2Fstrip-ansi-3.0.1.tgz",
           "integrity": "sha1-ajhfuIU9lS1f8F0Oiq+UJ43GPc8=",
           "dev": true,
           "requires": {
@@ -8442,13 +8521,13 @@
         },
         "supports-color": {
           "version": "2.0.0",
-          "resolved": "https://registry.npm.taobao.org/supports-color/download/supports-color-2.0.0.tgz?cache=0&sync_timestamp=1618560959124&other_urls=https%3A%2F%2Fregistry.npm.taobao.org%2Fsupports-color%2Fdownload%2Fsupports-color-2.0.0.tgz",
+          "resolved": "https://registry.nlark.com/supports-color/download/supports-color-2.0.0.tgz?cache=0&sync_timestamp=1622293579301&other_urls=https%3A%2F%2Fregistry.nlark.com%2Fsupports-color%2Fdownload%2Fsupports-color-2.0.0.tgz",
           "integrity": "sha1-U10EXOa2Nj+kARcIRimZXp3zJMc=",
           "dev": true
         },
         "which": {
           "version": "2.0.2",
-          "resolved": "https://registry.npm.taobao.org/which/download/which-2.0.2.tgz",
+          "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=",
           "dev": true,
           "requires": {
@@ -8459,7 +8538,7 @@
     },
     "nopt": {
       "version": "5.0.0",
-      "resolved": "https://registry.npm.taobao.org/nopt/download/nopt-5.0.0.tgz?cache=0&sync_timestamp=1597649930270&other_urls=https%3A%2F%2Fregistry.npm.taobao.org%2Fnopt%2Fdownload%2Fnopt-5.0.0.tgz",
+      "resolved": "https://registry.npm.taobao.org/nopt/download/nopt-5.0.0.tgz",
       "integrity": "sha1-UwlCu1ilEvzK/lP+IQ8TolNV3Ig=",
       "dev": true,
       "requires": {
@@ -8547,7 +8626,7 @@
     },
     "number-is-nan": {
       "version": "1.0.1",
-      "resolved": "https://registry.npm.taobao.org/number-is-nan/download/number-is-nan-1.0.1.tgz",
+      "resolved": "https://registry.npm.taobao.org/number-is-nan/download/number-is-nan-1.0.1.tgz?cache=0&sync_timestamp=1617776101309&other_urls=https%3A%2F%2Fregistry.npm.taobao.org%2Fnumber-is-nan%2Fdownload%2Fnumber-is-nan-1.0.1.tgz",
       "integrity": "sha1-CXtgK1NCKlIsGvuHkDGDNpQaAR0=",
       "dev": true
     },
@@ -9992,7 +10071,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.npm.taobao.org/find-up/download/find-up-1.1.2.tgz",
           "integrity": "sha1-ay6YIrGizgpgq2TWEOzK1TyyTQ8=",
           "dev": true,
           "requires": {
@@ -10011,7 +10090,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.npm.taobao.org/path-type/download/path-type-1.1.0.tgz?cache=0&sync_timestamp=1611752015315&other_urls=https%3A%2F%2Fregistry.npm.taobao.org%2Fpath-type%2Fdownload%2Fpath-type-1.1.0.tgz",
           "integrity": "sha1-WcRPfuSR2nBNpBXaWkBwuk+P5EE=",
           "dev": true,
           "requires": {
@@ -10028,7 +10107,7 @@
         },
         "read-pkg": {
           "version": "1.1.0",
-          "resolved": "https://registry.npm.taobao.org/read-pkg/download/read-pkg-1.1.0.tgz?cache=0&sync_timestamp=1616914810926&other_urls=https%3A%2F%2Fregistry.npm.taobao.org%2Fread-pkg%2Fdownload%2Fread-pkg-1.1.0.tgz",
+          "resolved": "https://registry.npm.taobao.org/read-pkg/download/read-pkg-1.1.0.tgz",
           "integrity": "sha1-9f+qXs0pyzHAR0vKfXVra7KePyg=",
           "dev": true,
           "requires": {
@@ -10066,7 +10145,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",
       "integrity": "sha1-z5Fqsf1fHxbfsggi3W7H9zDCr94=",
       "dev": true,
       "requires": {
@@ -10076,7 +10155,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?cache=0&sync_timestamp=1620053310624&other_urls=https%3A%2F%2Fregistry.nlark.com%2Fstrip-indent%2Fdownload%2Fstrip-indent-1.0.1.tgz",
           "integrity": "sha1-DHlipq3vp7vUrDZkYKY4VSrhoKI=",
           "dev": true,
           "requires": {
@@ -10233,7 +10312,7 @@
     },
     "repeating": {
       "version": "2.0.1",
-      "resolved": "https://registry.nlark.com/repeating/download/repeating-2.0.1.tgz?cache=0&sync_timestamp=1620068853953&other_urls=https%3A%2F%2Fregistry.nlark.com%2Frepeating%2Fdownload%2Frepeating-2.0.1.tgz",
+      "resolved": "https://registry.nlark.com/repeating/download/repeating-2.0.1.tgz",
       "integrity": "sha1-UhTFOpJtNVJwdSf7q0FdvAjQbdo=",
       "dev": true,
       "requires": {
@@ -10434,7 +10513,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.npm.taobao.org/camelcase/download/camelcase-5.3.1.tgz",
           "integrity": "sha1-48mzFWnhBoEd8kL3FXJaH0xJQyA=",
           "dev": true
         },
@@ -10451,13 +10530,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.npm.taobao.org/emoji-regex/download/emoji-regex-7.0.3.tgz?cache=0&sync_timestamp=1614682707048&other_urls=https%3A%2F%2Fregistry.npm.taobao.org%2Femoji-regex%2Fdownload%2Femoji-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.npm.taobao.org/find-up/download/find-up-3.0.0.tgz",
           "integrity": "sha1-SRafHXmTQwZG2mHsxa41XCHJe3M=",
           "dev": true,
           "requires": {
@@ -10466,13 +10545,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.npm.taobao.org/is-fullwidth-code-point/download/is-fullwidth-code-point-2.0.0.tgz?cache=0&sync_timestamp=1618552489864&other_urls=https%3A%2F%2Fregistry.npm.taobao.org%2Fis-fullwidth-code-point%2Fdownload%2Fis-fullwidth-code-point-2.0.0.tgz",
           "integrity": "sha1-o7MKXE8ZkYMWeqq5O+764937ZU8=",
           "dev": true
         },
         "locate-path": {
           "version": "3.0.0",
-          "resolved": "https://registry.npm.taobao.org/locate-path/download/locate-path-3.0.0.tgz?cache=0&sync_timestamp=1597082033698&other_urls=https%3A%2F%2Fregistry.npm.taobao.org%2Flocate-path%2Fdownload%2Flocate-path-3.0.0.tgz",
+          "resolved": "https://registry.npm.taobao.org/locate-path/download/locate-path-3.0.0.tgz",
           "integrity": "sha1-2+w7OrdZdYBxtY/ln8QYca8hQA4=",
           "dev": true,
           "requires": {
@@ -10482,7 +10561,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.npm.taobao.org/p-locate/download/p-locate-3.0.0.tgz",
           "integrity": "sha1-Mi1poFwCZLJZl9n0DNiokasAZKQ=",
           "dev": true,
           "requires": {
@@ -10497,7 +10576,7 @@
         },
         "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=1618558751438&other_urls=https%3A%2F%2Fregistry.npm.taobao.org%2Fstring-width%2Fdownload%2Fstring-width-3.1.0.tgz",
           "integrity": "sha1-InZ74htirxCBV0MG9prFG2IgOWE=",
           "dev": true,
           "requires": {
@@ -10508,7 +10587,7 @@
         },
         "strip-ansi": {
           "version": "5.2.0",
-          "resolved": "https://registry.npm.taobao.org/strip-ansi/download/strip-ansi-5.2.0.tgz?cache=0&sync_timestamp=1618553351145&other_urls=https%3A%2F%2Fregistry.npm.taobao.org%2Fstrip-ansi%2Fdownload%2Fstrip-ansi-5.2.0.tgz",
+          "resolved": "https://registry.npm.taobao.org/strip-ansi/download/strip-ansi-5.2.0.tgz?cache=0&sync_timestamp=1618553320591&other_urls=https%3A%2F%2Fregistry.npm.taobao.org%2Fstrip-ansi%2Fdownload%2Fstrip-ansi-5.2.0.tgz",
           "integrity": "sha1-jJpTb+tq/JYr36WxBKUJHBrZwK4=",
           "dev": true,
           "requires": {
@@ -10517,7 +10596,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",
           "integrity": "sha1-H9H2cjXVttD+54EFYAG/tpTAOwk=",
           "dev": true,
           "requires": {
@@ -10528,7 +10607,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?cache=0&sync_timestamp=1620086465147&other_urls=https%3A%2F%2Fregistry.nlark.com%2Fyargs%2Fdownload%2Fyargs-13.3.2.tgz",
           "integrity": "sha1-rX/+/sGqWVZayRX4Lcyzipwxot0=",
           "dev": true,
           "requires": {
@@ -10546,7 +10625,7 @@
         },
         "yargs-parser": {
           "version": "13.1.2",
-          "resolved": "https://registry.npm.taobao.org/yargs-parser/download/yargs-parser-13.1.2.tgz",
+          "resolved": "https://registry.nlark.com/yargs-parser/download/yargs-parser-13.1.2.tgz?cache=0&sync_timestamp=1624233514145&other_urls=https%3A%2F%2Fregistry.nlark.com%2Fyargs-parser%2Fdownload%2Fyargs-parser-13.1.2.tgz",
           "integrity": "sha1-Ew8JcC667vJlDVTObj5XBvek+zg=",
           "dev": true,
           "requires": {
@@ -11394,7 +11473,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.npm.taobao.org/strip-bom/download/strip-bom-2.0.0.tgz?cache=0&sync_timestamp=1618599587805&other_urls=https%3A%2F%2Fregistry.npm.taobao.org%2Fstrip-bom%2Fdownload%2Fstrip-bom-2.0.0.tgz",
       "integrity": "sha1-YhmoVhZSBJHzV4i9vxRHqZx+aw4=",
       "dev": true,
       "requires": {
@@ -11539,7 +11618,7 @@
     },
     "tar": {
       "version": "6.1.0",
-      "resolved": "https://registry.npm.taobao.org/tar/download/tar-6.1.0.tgz?cache=0&sync_timestamp=1610045993977&other_urls=https%3A%2F%2Fregistry.npm.taobao.org%2Ftar%2Fdownload%2Ftar-6.1.0.tgz",
+      "resolved": "https://registry.npm.taobao.org/tar/download/tar-6.1.0.tgz?cache=0&sync_timestamp=1610045450553&other_urls=https%3A%2F%2Fregistry.npm.taobao.org%2Ftar%2Fdownload%2Ftar-6.1.0.tgz",
       "integrity": "sha1-0XJOm8wEuXexjVxXOzM6IgcimoM=",
       "dev": true,
       "requires": {
@@ -12319,87 +12398,6 @@
         }
       }
     },
-    "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",
@@ -12440,6 +12438,11 @@
         "is-plain-object": "3.0.1"
       }
     },
+    "vuex": {
+      "version": "3.6.2",
+      "resolved": "https://registry.nlark.com/vuex/download/vuex-3.6.2.tgz?cache=0&sync_timestamp=1623945192157&other_urls=https%3A%2F%2Fregistry.nlark.com%2Fvuex%2Fdownload%2Fvuex-3.6.2.tgz",
+      "integrity": "sha1-I2vAhqhww655lG8QfxbeWdWJXnE="
+    },
     "warning": {
       "version": "4.0.3",
       "resolved": "https://registry.npm.taobao.org/warning/download/warning-4.0.3.tgz",
@@ -13137,19 +13140,19 @@
       "dependencies": {
         "ansi-regex": {
           "version": "3.0.0",
-          "resolved": "https://registry.npm.taobao.org/ansi-regex/download/ansi-regex-3.0.0.tgz?cache=0&sync_timestamp=1618552978881&other_urls=https%3A%2F%2Fregistry.npm.taobao.org%2Fansi-regex%2Fdownload%2Fansi-regex-3.0.0.tgz",
+          "resolved": "https://registry.nlark.com/ansi-regex/download/ansi-regex-3.0.0.tgz",
           "integrity": "sha1-7QMXwyIGT3lGbAKWa922Bas32Zg=",
           "dev": true
         },
         "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.npm.taobao.org/is-fullwidth-code-point/download/is-fullwidth-code-point-2.0.0.tgz?cache=0&sync_timestamp=1618552489864&other_urls=https%3A%2F%2Fregistry.npm.taobao.org%2Fis-fullwidth-code-point%2Fdownload%2Fis-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=1618558751438&other_urls=https%3A%2F%2Fregistry.npm.taobao.org%2Fstring-width%2Fdownload%2Fstring-width-2.1.1.tgz",
           "integrity": "sha1-q5Pyeo3BPSjKyBXEYhQ6bZASrp4=",
           "dev": true,
           "requires": {
@@ -13159,7 +13162,7 @@
         },
         "strip-ansi": {
           "version": "4.0.0",
-          "resolved": "https://registry.npm.taobao.org/strip-ansi/download/strip-ansi-4.0.0.tgz?cache=0&sync_timestamp=1618553351145&other_urls=https%3A%2F%2Fregistry.npm.taobao.org%2Fstrip-ansi%2Fdownload%2Fstrip-ansi-4.0.0.tgz",
+          "resolved": "https://registry.npm.taobao.org/strip-ansi/download/strip-ansi-4.0.0.tgz?cache=0&sync_timestamp=1618553320591&other_urls=https%3A%2F%2Fregistry.npm.taobao.org%2Fstrip-ansi%2Fdownload%2Fstrip-ansi-4.0.0.tgz",
           "integrity": "sha1-qEeQIusaw2iocTibY1JixQXuNo8=",
           "dev": true,
           "requires": {

package.json

@@ -15,7 +15,8 @@
     "element-ui": "^2.15.3",
     "js-cookie": "^2.2.1",
     "vue": "^3.0.0",
-    "vue-router": "^4.0.4"
+    "vue-router": "^4.0.4",
+    "vuex": "^3.6.2"
   },
   "devDependencies": {
     "@vue/cli-plugin-babel": "~4.5.0",

public/1.json

@@ -2377,7 +2377,7 @@
         "id": "44acfdb8-eef5-4e16-95ac-724c26b6cfa0",
         "sort": 0,
         "title": "三相互感器开口",
-        "type": "TransformerTriphaseOpenSvg",
+        "type": "TransformerTriphaseOpen",
         "typeName": "三相互感器开口",
         "svgColor": "#FF0000",
         "svgPositionX": 534,

public/InterfaceReturn.json

@@ -232,7 +232,7 @@
     "priview_img": "/TwoCircleSvg.png"
   },
   {
-    "type": "TransformerY",
+    "type": "TransformerYSvg",
     "title": "电流互感器y",
     "template": "<ellipse cx='0' cy='0' rx='10' ry='10' fill='none' :stroke='svg_color' stroke-width='2'></ellipse><line x1='5' y1='-5' x2='0' y2='0' fill='none' :stroke='svg_color' stroke-width='2'></line><line x1='-5' y1='-5' x2='0' y2='0' fill='none' :stroke='svg_color' stroke-width='2'></line><line x1='0' y1='0' x2='0' y2='5' fill='none' :stroke='svg_color' stroke-width='2'></line>",
     "props": [

src/App.vue

@@ -1,17 +1,49 @@
 <template>
+  <index></index>
   <router-view />
 </template>
 
 <script>
+import index from './views/index'
 export default {
-  name: 'App',
-  components: {
-  }
-}
+  name: "App",
+  data() {
+    return {
+      title: "",
+    };
+  },
+  components: {index},
+};
 </script>
 
 <style>
 #app {
-
+}
+/* 水平样式 */
+.el-menu--horizontal > div > .el-submenu {
+  float: left;
+}
+/* 一级菜单的样式 */
+.el-menu--horizontal > div > .el-menu-item {
+  float: left;
+  height: 60px;
+  line-height: 60px;
+  margin: 0;
+  border-bottom: 2px solid transparent;
+  color: #909399;
+}
+/* 解决下图1 下拉三角图标 */
+.el-menu--horizontal > div > .el-submenu .el-submenu__icon-arrow {
+  position: static;
+  vertical-align: middle;
+  margin-left: 8px;
+  margin-top: -3px;
+}
+/* 解决下图2 无下拉菜单时 不对齐问题 */
+.el-menu--horizontal > div > .el-submenu .el-submenu__title {
+  height: 60px;
+  line-height: 60px;
+  border-bottom: 2px solid transparent;
+  color: #909399;
 }
 </style>

src/assets/css/index.css

@@ -38,6 +38,7 @@ body {
     min-height: 600px;
 }
 
+
 header {
     position: relative;
     /* height: 1.25rem; */
@@ -45,22 +46,8 @@ header {
     background: url(../images/head_bg.png) no-repeat;
     background-position: 20% 0;
     background-size: cover;
-}
-
-header h1 {
-    font-size: 0.475rem;
-    color: #fff;
-    text-align: center;
-    line-height: 1rem;
-}
-
-header .showTime {
-    position: absolute;
-    top: 0;
-    right: 0.375rem;
-    line-height: 0.9375rem;
-    font-size: 0.25rem;
-    color: rgba(255, 255, 255, 0.7);
+    min-width: 1024px;
+    max-width: 1920px;
 }
 
 .mainbox {

src/main.js

@@ -4,7 +4,9 @@ import App from './App.vue'
 import 'ant-design-vue/dist/antd.css';
 import UCore from './utils/UCore.js'
 import './assets/css/index.css';
+// import store from './store'
 import router from './router';
+// import { makeRoute } from './router'
 import axios from 'axios';
 const app = createApp(App);
 app.use(router);
@@ -23,5 +25,38 @@ router.beforeEach((to, from, next) => {
     if (to.meta.title) {
         document.title = to.meta.title
     }
-    next()
+    // //如果目标路由为登陆时,恢复用户原始状态
+    // if (to.path === '/login') {
+    //     window.clearInterval(window.interval);
+    //     store.commit('logOut');
+    // }
+    // let allRoutes = store.getters.allRoutes;
+    // let loginStatus = store.getters.loginStatus;
+
+    // //登录成功时加载路由及模块
+    // if (from.path === '/login' && allRoutes !== '' && loginStatus) {
+    //     let routesObj = makeRoute(store.getters.allRoutes);
+    //     router.addRoutes(routesObj);
+    // }
+    // //没有登录时自动跳转,开发环境免登陆时注释
+    // if (to.path !== '/login' && (allRoutes === '' || !loginStatus)) {
+
+    //     if (sessionStorage.getItem('userInfo') === null) {
+    //         next({ path: '/login' })
+    //     } else {
+    //         //刷新当前页面
+    //         //重置store参数
+    //         let userInfo = JSON.parse(sessionStorage.getItem('userInfo'));
+    //         store.commit('setUser', userInfo);
+    //         if (userInfo.routes) {
+    //             //重新加载路由及模块
+    //             let routesObj = makeRoute(userInfo.routes);
+    //             router.addRoutes(routesObj);
+    //         }
+    //         next({ path: to.path, query: to.query });
+    //     }
+    // } else {
+    //     //路由的next必须存在,否则无法进入下一页
+        next();
+    // }
 })

src/router/index.js

@@ -1,7 +1,7 @@
 import { createRouter, createWebHistory } from 'vue-router'
 // import mineRouter from "./mineRouter";
 // import JsBridge from "../utils/jsbridge";
-const routerHistory = createWebHistory();
+const routerHistory = createWebHistory(process.env.BASE_URL);
 
 let routes = [
     // ming router start
@@ -10,25 +10,59 @@ let routes = [
     {
         path: '/',
         name: 'home',
-        meta: { title: '首页看板' },
+        meta: { title: '首页', name: "智慧用电监控平台", type: "index" },
         component: () =>
-            import ('../views/home/index.vue'),
+            import('../views/home/index.vue'),
     },
     // ming router end
 
+    // 站点详情页面
+    {
+        path: '/Site_details',
+        name: 'site_details',
+        meta: { title: '站点详情', name: "测试站点一", type: "menu" },
+        component: () =>
+            import('../views/index/Site_details.vue'),
+    },
     // 编辑器页面
     {
         path: '/CircuitEdit',
         name: 'CircuitEdit',
+        meta: { title: '编辑器', name: "编辑器", type: "menu" },
         component: () =>
-            import ('../views/CircuitEdit.vue'),
+            import('../views/CircuitEdit.vue'),
     },
     // 预览页页面
     {
         path: '/CircuitPreview',
         name: 'CircuitPreview',
+        meta: { title: '预览', name: "预览", type: "menu" },
+        component: () =>
+            import('../views/CircuitPreview.vue'),
+    },
+    //数据管理页面
+    {
+        path: '/Data_mage',
+        name: 'data_mage',
+        meta: { title: '数据管理', name: "数据管理", type: "index" },
+        component: () =>
+            import('../views/index/Data_mage.vue'),
+    },
+    //电能质量页面
+    {
+        path: '/Power_quality',
+        name: 'power_quality',
+        meta: { title: '电能质量', name: "电能质量", type: "index" },
         component: () =>
-            import ('../views/CircuitPreview.vue'),
+            import('../views/index/Power_quality.vue'),
+    },
+    //系统管理页面
+    {
+        path: '/System_mage',
+        name: 'system_mage',
+        meta: { title: '系统管理', name: "系统管理", type: "index" },
+        component: () =>
+            import('../views/index/System_mage.vue'),
     }
 
 
@@ -41,10 +75,4 @@ const router = createRouter({
     routes
 });
 
-// // 路由守卫
-router.beforeEach((to, from, next) => {
-    // console.log(to);
-    next();
-});
-
 export default router

src/views/home/index.vue

@@ -1,9 +1,5 @@
 <template>
   <div>
-    <header>
-      <h1>智慧用电监控平台</h1>
-      <div class="showTime">当前时间：2020年3月17-0时54分14秒</div>
-    </header>
     <section class="mainbox">
       <div class="topBox">
         <div class="column">
@@ -27,7 +23,7 @@
         </div> -->
         </div>
         <div class="column">
-          <div class="map" style="">map</div>
+          <div class="map" style="" @click="Site_details()"></div>
         </div>
         <div class="column">
           <div class="panel deviceSum">
@@ -55,11 +51,15 @@
     </section>
   </div>
 </template>
-
 <script>
 export default {
   name: "index",
   components: {},
+  methods:{
+    Site_details(){
+      this.$router.push({ path: '/Site_details'});//, query: { title: title }
+    }
+  }
 };
 </script>
 

src/views/index.vue

@@ -0,0 +1,255 @@
+<template>
+  <header>
+    <div id="header">
+      <div class="router-index" v-if="!home">
+        <router-link
+          class="router-link"
+          :class="title == route.meta.name ? 'router-link2' : 'router-link1'"
+          v-for="route in router"
+          :key="route"
+          :to="route.path"
+          v-show="route.meta.type === 'index'"
+        >
+          <span>{{ route.meta.title }}</span>
+        </router-link>
+      </div>
+      <div class="router-menu" v-if="home">
+        <div>
+          <span>当前站点:</span>
+          <el-select v-model="value" placeholder="请选择">
+            <el-option
+              v-for="item in options"
+              :key="item.value"
+              :label="item.label"
+              :value="item.value"
+            >
+            </el-option>
+          </el-select>
+        </div>
+        <router-link
+          class="router-link"
+          :class="title == route.meta.name ? 'router-link2' : 'router-link1'"
+          v-for="route in router"
+          :key="route"
+          :to="route.path"
+          v-show="route.meta.type === 'menu'"
+        >
+          <span>{{ route.meta.title }}</span>
+        </router-link>
+      </div>
+      <div class="title">{{ title }}</div>
+      <div class="rigth">
+        <div class="showTime">2021-06-28 16:32:32</div>
+        <router-link class="home" to="/" v-if="home"></router-link>
+        <div class="news">
+          <div></div>
+          <span><a>9</a></span>
+        </div>
+        <div class="admin"></div>
+      </div>
+    </div>
+  </header>
+</template>
+
+<script>
+export default {
+  name: "App",
+  data() {
+    return {
+      title: "",
+      router: [],
+      home: false,
+      options: [
+        {
+          value: "选项1",
+          label: "黄金糕",
+        },
+        {
+          value: "选项2",
+          label: "双皮奶",
+        },
+        {
+          value: "选项3",
+          label: "蚵仔煎",
+        },
+        {
+          value: "选项4",
+          label: "龙须面",
+        },
+        {
+          value: "选项5",
+          label: "北京烤鸭",
+        },
+      ],
+      value: "",
+    };
+  },
+  components: {},
+  mounted() {
+    this.router = this.$router.options.routes;
+  },
+  methods: {},
+  watch: {
+    $route: function () {
+        console.log("aaaaaaaaaaaaa")
+      this.title = this.$route.meta.name;
+      this.$route.meta.type === "menu"
+        ? (this.home = true)
+        : (this.home = false);
+    },
+  },
+};
+</script>
+<style scoped lang="less">
+#header {
+  .router-index {
+    position: absolute;
+    display: flex;
+    height: 100%;
+    line-height: 1rem;
+    margin-left: 1rem;
+    .router-link {
+      width: 1.525rem;
+      height: 0.5rem;
+      display: block;
+      text-align: center;
+      line-height: 0.5rem;
+      margin: 0.125rem;
+      font-size: 0.225rem;
+    }
+    .router-link:hover {
+      background: url(./../assets/images/router_left2.png) no-repeat;
+      background-size: cover;
+      color: #fac112;
+    }
+    .router-link1 {
+      background: url(./../assets/images/router_left1.png) no-repeat;
+      color: #00f4fd;
+      background-size: cover;
+    }
+    .router-link2 {
+      background: url(./../assets/images/router_left2.png) no-repeat;
+      color: #fac112;
+      background-size: cover;
+    }
+    .router-link3 {
+      background: url(./../assets/images/router_right1.png) no-repeat;
+      color: #00f4fd;
+      background-size: cover;
+    }
+  }
+  .router-menu {
+    position: absolute;
+    display: flex;
+    height: 100%;
+    line-height: 1rem;
+    margin-left: 1rem;
+    .router-link {
+      width: 1.525rem;
+      height: 0.5rem;
+      display: block;
+      text-align: center;
+      line-height: 0.5rem;
+      margin: 0.125rem;
+      font-size: 0.225rem;
+    }
+    .router-link:hover {
+      background: url(./../assets/images/router_left2.png) no-repeat;
+      background-size: cover;
+      color: #fac112;
+    }
+    .router-link1 {
+      background: url(./../assets/images/router_left1.png) no-repeat;
+      color: #00f4fd;
+      background-size: cover;
+    }
+    .router-link2 {
+      background: url(./../assets/images/router_left2.png) no-repeat;
+      color: #fac112;
+      background-size: cover;
+    }
+    .router-link3 {
+      background: url(./../assets/images/router_right1.png) no-repeat;
+      color: #00f4fd;
+      background-size: cover;
+    }
+  }
+  .title {
+    font-size: 0.5rem;
+    color: #00f4fd;
+    font-family: PangMenZhengDao Regular, PangMenZhengDao Regular-Regular;
+    font-weight: 600;
+    letter-spacing: 3px;
+    text-align: center;
+    line-height: 1rem;
+  }
+  .rigth {
+    position: absolute;
+    top: 0;
+    right: 0;
+    display: flex;
+
+    div {
+      margin-right: 0.17rem;
+    }
+
+    .home {
+      width: 0.3125rem;
+      height: 0.25rem;
+      margin-top: 0.25rem;
+      background: url(./../assets/images/home.png) no-repeat;
+      background-size: cover;
+      margin-right: 0.3rem;
+    }
+
+    .showTime {
+      font-size: 0.25rem;
+      font-family: Microsoft YaHei Regular, Microsoft YaHei Regular-Regular;
+      font-weight: 400;
+      color: #00f4fd;
+      line-height: 0.75rem;
+      margin-right: 0.25rem;
+    }
+    .news {
+      font-size: 0.25rem;
+      color: #00f4fd;
+      line-height: 0.35rem;
+      cursor: pointer;
+
+      div {
+        width: 0.3rem;
+        height: 0.2375rem;
+        margin-top: 0.25rem;
+        background: url(./../assets/images/news.png) no-repeat;
+        background-size: cover;
+      }
+      span {
+        position: absolute;
+        text-align: center;
+        width: 0.2rem;
+        height: 0.2rem;
+        line-height: 0.2rem;
+        background-color: red;
+        border-radius: 100%;
+        top: 0.12rem;
+        right: 0.75rem;
+        a {
+          display: block;
+          width: 0.2rem;
+          height: 0.2rem;
+          color: #fff;
+          transform: scale(0.7, 0.7);
+        }
+      }
+    }
+    .admin {
+      width: 0.325rem;
+      height: 0.325rem;
+      margin-top: 0.2rem;
+      background: url(./../assets/images/admin.png) no-repeat;
+      background-size: cover;
+      cursor: pointer;
+    }
+  }
+}
+</style>

src/views/index/Data_mage.vue

@@ -0,0 +1,19 @@
+<template>
+  <div>
+    <section class="mainbox"></section>
+  </div>
+</template>
+<script>
+export default {
+  data() {
+    return {};
+  },
+  name: "data_mage",
+  components: {},
+  mounted() {},
+  methods: {},
+};
+</script>
+
+<style>
+</style>

src/views/index/Power_quality.vue

@@ -0,0 +1,19 @@
+<template>
+  <div>
+    <section class="mainbox"></section>
+  </div>
+</template>
+<script>
+export default {
+  data() {
+    return {};
+  },
+  name: "power_quality",
+  components: {},
+  mounted() {},
+  methods: {},
+};
+</script>
+
+<style>
+</style>

src/views/index/Site_details.vue

@@ -0,0 +1,19 @@
+<template>
+  <div>
+    <section class="mainbox"></section>
+  </div>
+</template>
+<script>
+export default {
+  data() {
+    return {};
+  },
+  name: "site_details",
+  components: {},
+  mounted() {},
+  methods: {},
+};
+</script>
+
+<style>
+</style>

src/views/index/System_mage.vue

@@ -0,0 +1,19 @@
+<template>
+  <div>
+    <section class="mainbox"></section>
+  </div>
+</template>
+<script>
+export default {
+  data() {
+    return {};
+  },
+  name: "system_mage",
+  components: {},
+  mounted() {},
+  methods: {},
+};
+</script>
+
+<style>
+</style>

test/1.json

@@ -2377,7 +2377,7 @@
         "id": "44acfdb8-eef5-4e16-95ac-724c26b6cfa0",
         "sort": 0,
         "title": "三相互感器开口",
-        "type": "TransformerTriphaseOpenSvg",
+        "type": "TransformerTriphaseOpen",
         "typeName": "三相互感器开口",
         "svgColor": "#FF0000",
         "svgPositionX": 534,

test/InterfaceReturn.json

@@ -232,7 +232,7 @@
     "priview_img": "/TwoCircleSvg.png"
   },
   {
-    "type": "TransformerY",
+    "type": "TransformerYSvg",
     "title": "电流互感器y",
     "template": "<ellipse cx='0' cy='0' rx='10' ry='10' fill='none' :stroke='svg_color' stroke-width='2'></ellipse><line x1='5' y1='-5' x2='0' y2='0' fill='none' :stroke='svg_color' stroke-width='2'></line><line x1='-5' y1='-5' x2='0' y2='0' fill='none' :stroke='svg_color' stroke-width='2'></line><line x1='0' y1='0' x2='0' y2='5' fill='none' :stroke='svg_color' stroke-width='2'></line>",
     "props": [

test/index.html

@@ -9,7 +9,7 @@
     <title>
         vue-webtopo-svgeditor
     </title>
-    <script src="./static/config.js"></script>
+
 <link href="js/app.js" rel="preload" as="script"></head>
 
 <body>
@@ -17,6 +17,7 @@
       <strong>We're sorry but vue-webtopo-svgeditor doesn't work properly without JavaScript enabled. Please enable it to continue.</strong>
     </noscript>
     <div id="app"></div>
+    <script src="./static/config.js"></script>
 <script type="text/javascript" src="js/app.js"></script></body>
 
 </html>