Переглянути джерело

还原到 commit id 9d9eb935

reghao 2 роки тому
батько
коміт
c820fabde0
7 змінених файлів з 620 додано та 526 видалено
  1. 82 84
      package-lock.json
  2. 8 8
      src/App.vue
  3. 164 156
      src/router/index.js
  4. 57 0
      src/views/Index.vue
  5. 76 64
      src/views/admin/Admin.vue
  6. 70 61
      src/views/disk/Disk.vue
  7. 163 153
      src/views/my/My.vue

+ 82 - 84
package-lock.json

@@ -1432,9 +1432,9 @@
           },
           "dependencies": {
             "@babel/parser": {
-              "version": "7.23.5",
-              "resolved": "https://registry.npmmirror.com/@babel/parser/-/parser-7.23.5.tgz",
-              "integrity": "sha512-hOOqoiNXrmGdFbhgCzu6GiURxUgM27Xwd/aPuu8RfHEZPBzL1Z54okAHAQjXfcQNwvrlkAmAp4SlRTZ45vlthQ=="
+              "version": "7.23.6",
+              "resolved": "https://registry.npmmirror.com/@babel/parser/-/parser-7.23.6.tgz",
+              "integrity": "sha512-Z2uID7YJ7oNvAI20O9X0bblw7Qqs8Q2hFy0R9tAfnfLkp5MW0UH9eUvnDSnFwKZ0AvgS1ucqR4KzvVHgnke1VQ=="
             },
             "@liripeng/vue-audio-player": {
               "version": "1.4.1-beta1",
@@ -1481,15 +1481,15 @@
                           },
                           "dependencies": {
                             "vue": {
-                              "version": "3.3.10",
-                              "resolved": "https://registry.npmmirror.com/vue/-/vue-3.3.10.tgz",
-                              "integrity": "sha512-zg6SIXZdTBwiqCw/1p+m04VyHjLfwtjwz8N57sPaBhEex31ND0RYECVOC1YrRwMRmxFf5T1dabl6SGUbMKKuVw==",
+                              "version": "3.4.15",
+                              "resolved": "https://registry.npmmirror.com/vue/-/vue-3.4.15.tgz",
+                              "integrity": "sha512-jC0GH4KkWLWJOEQjOpkqU1bQsBwf4R1rsFtw5GQJbjHVKWDzO6P0nWWBTmjp1xSemAioDFj1jdaK1qa3DnMQoQ==",
                               "requires": {
-                                "@vue/compiler-dom": "3.3.10",
-                                "@vue/compiler-sfc": "3.3.10",
-                                "@vue/runtime-dom": "3.3.10",
-                                "@vue/server-renderer": "3.3.10",
-                                "@vue/shared": "3.3.10"
+                                "@vue/compiler-dom": "3.4.15",
+                                "@vue/compiler-sfc": "3.4.15",
+                                "@vue/runtime-dom": "3.4.15",
+                                "@vue/server-renderer": "3.4.15",
+                                "@vue/shared": "3.4.15"
                               }
                             },
                             "vue-router": {
@@ -1507,21 +1507,22 @@
                   }
                 },
                 "vue": {
-                  "version": "2.7.15",
-                  "resolved": "https://registry.npmmirror.com/vue/-/vue-2.7.15.tgz",
-                  "integrity": "sha512-a29fsXd2G0KMRqIFTpRgpSbWaNBK3lpCTOLuGLEDnlHWdjB8fwl6zyYZ8xCrqkJdatwZb4mGHiEfJjnw0Q6AwQ==",
+                  "version": "2.7.16",
+                  "resolved": "https://registry.npmmirror.com/vue/-/vue-2.7.16.tgz",
+                  "integrity": "sha512-4gCtFXaAA3zYZdTp5s4Hl2sozuySsgz4jy1EnpBHNfpMa9dK1ZCG7viqBPCwXtmgc8nHqUsAu3G4gtmXkkY3Sw==",
                   "requires": {
-                    "@vue/compiler-sfc": "2.7.15",
+                    "@vue/compiler-sfc": "2.7.16",
                     "csstype": "^3.1.0"
                   },
                   "dependencies": {
                     "@vue/compiler-sfc": {
-                      "version": "2.7.15",
-                      "resolved": "https://registry.npmmirror.com/@vue/compiler-sfc/-/compiler-sfc-2.7.15.tgz",
-                      "integrity": "sha512-FCvIEevPmgCgqFBH7wD+3B97y7u7oj/Wr69zADBf403Tui377bThTjBvekaZvlRr4IwUAu3M6hYZeULZFJbdYg==",
+                      "version": "2.7.16",
+                      "resolved": "https://registry.npmmirror.com/@vue/compiler-sfc/-/compiler-sfc-2.7.16.tgz",
+                      "integrity": "sha512-KWhJ9k5nXuNtygPU7+t1rX6baZeqOYLEforUPjgNDBnLicfHCoi48H87Q8XyLZOrNNsmhuwKqtpDQWjEFe6Ekg==",
                       "requires": {
-                        "@babel/parser": "^7.18.4",
+                        "@babel/parser": "^7.23.5",
                         "postcss": "^8.4.14",
+                        "prettier": "^1.18.2 || ^2.0.0",
                         "source-map": "^0.6.1"
                       }
                     }
@@ -1535,103 +1536,96 @@
               }
             },
             "@vue/compiler-core": {
-              "version": "3.3.10",
-              "resolved": "https://registry.npmmirror.com/@vue/compiler-core/-/compiler-core-3.3.10.tgz",
-              "integrity": "sha512-doe0hODR1+i1menPkRzJ5MNR6G+9uiZHIknK3Zn5OcIztu6GGw7u0XUzf3AgB8h/dfsZC9eouzoLo3c3+N/cVA==",
+              "version": "3.4.15",
+              "resolved": "https://registry.npmmirror.com/@vue/compiler-core/-/compiler-core-3.4.15.tgz",
+              "integrity": "sha512-XcJQVOaxTKCnth1vCxEChteGuwG6wqnUHxAm1DO3gCz0+uXKaJNx8/digSz4dLALCy8n2lKq24jSUs8segoqIw==",
               "requires": {
-                "@babel/parser": "^7.23.5",
-                "@vue/shared": "3.3.10",
+                "@babel/parser": "^7.23.6",
+                "@vue/shared": "3.4.15",
+                "entities": "^4.5.0",
                 "estree-walker": "^2.0.2",
                 "source-map-js": "^1.0.2"
               }
             },
             "@vue/compiler-dom": {
-              "version": "3.3.10",
-              "resolved": "https://registry.npmmirror.com/@vue/compiler-dom/-/compiler-dom-3.3.10.tgz",
-              "integrity": "sha512-NCrqF5fm10GXZIK0GrEAauBqdy+F2LZRt3yNHzrYjpYBuRssQbuPLtSnSNjyR9luHKkWSH8we5LMB3g+4z2HvA==",
+              "version": "3.4.15",
+              "resolved": "https://registry.npmmirror.com/@vue/compiler-dom/-/compiler-dom-3.4.15.tgz",
+              "integrity": "sha512-wox0aasVV74zoXyblarOM3AZQz/Z+OunYcIHe1OsGclCHt8RsRm04DObjefaI82u6XDzv+qGWZ24tIsRAIi5MQ==",
               "requires": {
-                "@vue/compiler-core": "3.3.10",
-                "@vue/shared": "3.3.10"
+                "@vue/compiler-core": "3.4.15",
+                "@vue/shared": "3.4.15"
               }
             },
             "@vue/compiler-sfc": {
-              "version": "3.3.10",
-              "resolved": "https://registry.npmmirror.com/@vue/compiler-sfc/-/compiler-sfc-3.3.10.tgz",
-              "integrity": "sha512-xpcTe7Rw7QefOTRFFTlcfzozccvjM40dT45JtrE3onGm/jBLZ0JhpKu3jkV7rbDFLeeagR/5RlJ2Y9SvyS0lAg==",
+              "version": "3.4.15",
+              "resolved": "https://registry.npmmirror.com/@vue/compiler-sfc/-/compiler-sfc-3.4.15.tgz",
+              "integrity": "sha512-LCn5M6QpkpFsh3GQvs2mJUOAlBQcCco8D60Bcqmf3O3w5a+KWS5GvYbrrJBkgvL1BDnTp+e8q0lXCLgHhKguBA==",
               "requires": {
-                "@babel/parser": "^7.23.5",
-                "@vue/compiler-core": "3.3.10",
-                "@vue/compiler-dom": "3.3.10",
-                "@vue/compiler-ssr": "3.3.10",
-                "@vue/reactivity-transform": "3.3.10",
-                "@vue/shared": "3.3.10",
+                "@babel/parser": "^7.23.6",
+                "@vue/compiler-core": "3.4.15",
+                "@vue/compiler-dom": "3.4.15",
+                "@vue/compiler-ssr": "3.4.15",
+                "@vue/shared": "3.4.15",
                 "estree-walker": "^2.0.2",
                 "magic-string": "^0.30.5",
-                "postcss": "^8.4.32",
+                "postcss": "^8.4.33",
                 "source-map-js": "^1.0.2"
               }
             },
             "@vue/compiler-ssr": {
-              "version": "3.3.10",
-              "resolved": "https://registry.npmmirror.com/@vue/compiler-ssr/-/compiler-ssr-3.3.10.tgz",
-              "integrity": "sha512-12iM4jA4GEbskwXMmPcskK5wImc2ohKm408+o9iox3tfN9qua8xL0THIZtoe9OJHnXP4eOWZpgCAAThEveNlqQ==",
+              "version": "3.4.15",
+              "resolved": "https://registry.npmmirror.com/@vue/compiler-ssr/-/compiler-ssr-3.4.15.tgz",
+              "integrity": "sha512-1jdeQyiGznr8gjFDadVmOJqZiLNSsMa5ZgqavkPZ8O2wjHv0tVuAEsw5hTdUoUW4232vpBbL/wJhzVW/JwY1Uw==",
               "requires": {
-                "@vue/compiler-dom": "3.3.10",
-                "@vue/shared": "3.3.10"
+                "@vue/compiler-dom": "3.4.15",
+                "@vue/shared": "3.4.15"
               }
             },
             "@vue/reactivity": {
-              "version": "3.3.10",
-              "resolved": "https://registry.npmmirror.com/@vue/reactivity/-/reactivity-3.3.10.tgz",
-              "integrity": "sha512-H5Z7rOY/JLO+e5a6/FEXaQ1TMuOvY4LDVgT+/+HKubEAgs9qeeZ+NhADSeEtrNQeiKLDuzeKc8v0CUFpB6Pqgw==",
+              "version": "3.4.15",
+              "resolved": "https://registry.npmmirror.com/@vue/reactivity/-/reactivity-3.4.15.tgz",
+              "integrity": "sha512-55yJh2bsff20K5O84MxSvXKPHHt17I2EomHznvFiJCAZpJTNW8IuLj1xZWMLELRhBK3kkFV/1ErZGHJfah7i7w==",
               "requires": {
-                "@vue/shared": "3.3.10"
-              }
-            },
-            "@vue/reactivity-transform": {
-              "version": "3.3.10",
-              "resolved": "https://registry.npmmirror.com/@vue/reactivity-transform/-/reactivity-transform-3.3.10.tgz",
-              "integrity": "sha512-0xBdk+CKHWT+Gev8oZ63Tc0qFfj935YZx+UAynlutnrDZ4diFCVFMWixn65HzjE3S1iJppWOo6Tt1OzASH7VEg==",
-              "requires": {
-                "@babel/parser": "^7.23.5",
-                "@vue/compiler-core": "3.3.10",
-                "@vue/shared": "3.3.10",
-                "estree-walker": "^2.0.2",
-                "magic-string": "^0.30.5"
+                "@vue/shared": "3.4.15"
               }
             },
             "@vue/runtime-core": {
-              "version": "3.3.10",
-              "resolved": "https://registry.npmmirror.com/@vue/runtime-core/-/runtime-core-3.3.10.tgz",
-              "integrity": "sha512-DZ0v31oTN4YHX9JEU5VW1LoIVgFovWgIVb30bWn9DG9a7oA415idcwsRNNajqTx8HQJyOaWfRKoyuP2P2TYIag==",
+              "version": "3.4.15",
+              "resolved": "https://registry.npmmirror.com/@vue/runtime-core/-/runtime-core-3.4.15.tgz",
+              "integrity": "sha512-6E3by5m6v1AkW0McCeAyhHTw+3y17YCOKG0U0HDKDscV4Hs0kgNT5G+GCHak16jKgcCDHpI9xe5NKb8sdLCLdw==",
               "requires": {
-                "@vue/reactivity": "3.3.10",
-                "@vue/shared": "3.3.10"
+                "@vue/reactivity": "3.4.15",
+                "@vue/shared": "3.4.15"
               }
             },
             "@vue/runtime-dom": {
-              "version": "3.3.10",
-              "resolved": "https://registry.npmmirror.com/@vue/runtime-dom/-/runtime-dom-3.3.10.tgz",
-              "integrity": "sha512-c/jKb3ny05KJcYk0j1m7Wbhrxq7mZYr06GhKykDMNRRR9S+/dGT8KpHuNQjv3/8U4JshfkAk6TpecPD3B21Ijw==",
+              "version": "3.4.15",
+              "resolved": "https://registry.npmmirror.com/@vue/runtime-dom/-/runtime-dom-3.4.15.tgz",
+              "integrity": "sha512-EVW8D6vfFVq3V/yDKNPBFkZKGMFSvZrUQmx196o/v2tHKdwWdiZjYUBS+0Ez3+ohRyF8Njwy/6FH5gYJ75liUw==",
               "requires": {
-                "@vue/runtime-core": "3.3.10",
-                "@vue/shared": "3.3.10",
-                "csstype": "^3.1.2"
+                "@vue/runtime-core": "3.4.15",
+                "@vue/shared": "3.4.15",
+                "csstype": "^3.1.3"
               }
             },
             "@vue/server-renderer": {
-              "version": "3.3.10",
-              "resolved": "https://registry.npmmirror.com/@vue/server-renderer/-/server-renderer-3.3.10.tgz",
-              "integrity": "sha512-0i6ww3sBV3SKlF3YTjSVqKQ74xialMbjVYGy7cOTi7Imd8ediE7t72SK3qnvhrTAhOvlQhq6Bk6nFPdXxe0sAg==",
+              "version": "3.4.15",
+              "resolved": "https://registry.npmmirror.com/@vue/server-renderer/-/server-renderer-3.4.15.tgz",
+              "integrity": "sha512-3HYzaidu9cHjrT+qGUuDhFYvF/j643bHC6uUN9BgM11DVy+pM6ATsG6uPBLnkwOgs7BpJABReLmpL3ZPAsUaqw==",
               "requires": {
-                "@vue/compiler-ssr": "3.3.10",
-                "@vue/shared": "3.3.10"
+                "@vue/compiler-ssr": "3.4.15",
+                "@vue/shared": "3.4.15"
               }
             },
             "@vue/shared": {
-              "version": "3.3.10",
-              "resolved": "https://registry.npmmirror.com/@vue/shared/-/shared-3.3.10.tgz",
-              "integrity": "sha512-2y3Y2J1a3RhFa0WisHvACJR2ncvWiVHcP8t0Inxo+NKz+8RKO4ZV8eZgCxRgQoA6ITfV12L4E6POOL9HOU5nqw=="
+              "version": "3.4.15",
+              "resolved": "https://registry.npmmirror.com/@vue/shared/-/shared-3.4.15.tgz",
+              "integrity": "sha512-KzfPTxVaWfB+eGcGdbSf4CWdaXcGDqckoeXUh7SB3fZdEtzPCK2Vq9B/lRRL3yutax/LWITz+SwvgyOxz5V75g=="
+            },
+            "csstype": {
+              "version": "3.1.3",
+              "resolved": "https://registry.npmmirror.com/csstype/-/csstype-3.1.3.tgz",
+              "integrity": "sha512-M1uQkMl8rQK/szD0LNhtqxIPLpimGm8sOBwU7lLnCpSbTyY3yeU1Vc7l4KT5zT4s/yOxHH5O7tIuuLOCnLADRw=="
             },
             "magic-string": {
               "version": "0.30.5",
@@ -1647,9 +1641,9 @@
               "integrity": "sha512-eSRppjcPIatRIMC1U6UngP8XFcz8MQWGQdt1MTBQ7NaAmvXDfvNxbvWV3x2y6CdEUciCSsDHDQZbhYaB8QEo2g=="
             },
             "postcss": {
-              "version": "8.4.32",
-              "resolved": "https://registry.npmmirror.com/postcss/-/postcss-8.4.32.tgz",
-              "integrity": "sha512-D/kj5JNu6oo2EIy+XL/26JEDTlIbB8hw85G8StOE6L74RQAVVP5rej6wxCNqyMbR4RkPfqvezVbPw81Ngd6Kcw==",
+              "version": "8.4.33",
+              "resolved": "https://registry.npmmirror.com/postcss/-/postcss-8.4.33.tgz",
+              "integrity": "sha512-Kkpbhhdjw2qQs2O2DGX+8m5OVqEcbB9HRBvuYM9pgrjEFUg30A9LmXNlTAUj4S9kgtGyrMbTzVjH7E+s5Re2yg==",
               "requires": {
                 "nanoid": "^3.3.7",
                 "picocolors": "^1.0.0",
@@ -1756,6 +1750,11 @@
           "resolved": "https://registry.npmmirror.com/csstype/-/csstype-3.1.2.tgz",
           "integrity": "sha512-I7K1Uu0MBPzaFKg4nI5Q7Vs2t+3gWWW648spaF+Rg7pI9ds18Ugn+lvg4SHczUdKlHI5LWBXyqfS8+DufyBsgQ=="
         },
+        "entities": {
+          "version": "4.5.0",
+          "resolved": "https://registry.npmmirror.com/entities/-/entities-4.5.0.tgz",
+          "integrity": "sha512-V0hjH4dGPh9Ao5p0MoRY6BVqtwCjhz6vI5LT8AJ55H+4g9/4vbHx1I54fS0XuclLhDHArPQCiMjDxjaL8fPxhw=="
+        },
         "magic-string": {
           "version": "0.30.0",
           "resolved": "https://registry.npmmirror.com/magic-string/-/magic-string-0.30.0.tgz",
@@ -12103,8 +12102,7 @@
     "prettier": {
       "version": "1.19.1",
       "resolved": "https://registry.npm.taobao.org/prettier/download/prettier-1.19.1.tgz",
-      "integrity": "sha1-99f1/4qc2HKnvkyhQglZVqYHl8s=",
-      "dev": true
+      "integrity": "sha1-99f1/4qc2HKnvkyhQglZVqYHl8s="
     },
     "pretty-error": {
       "version": "2.1.1",

+ 8 - 8
src/App.vue

@@ -1,28 +1,28 @@
 <template>
   <div id="app">
     <!--导航栏-->
-    <nav-bar />
+    <!--    <nav-bar v-if="type===1" />-->
     <!--下面的部分通过路由动态决定渲染与否-->
     <!--exclude,其值为正则,匹配到的组件的名称会被排除在keep-alive之外-->
     <keep-alive exclude="Collection,History">
       <router-view />
     </keep-alive>
     <!--页脚-->
-    <footer-bar />
+    <!--    <footer-bar />-->
     <!--回到顶部按钮-->
-    <el-backtop :visibility-height="100" :bottom="60" />
+    <!--    <el-backtop :visibility-height="100" :bottom="60" />-->
   </div>
 </template>
 
 <script>
-import NavBar from 'components/layout/NavBar'
-import FooterBar from 'components/layout/FooterBar'
-
 export default {
   name: 'App',
   components: {
-    FooterBar,
-    NavBar
+  },
+  data() {
+    return {
+      type: 2
+    }
   },
   created() {
     /**

+ 164 - 156
src/router/index.js

@@ -4,6 +4,7 @@ import Vue from 'vue'
 // 懒加载引入页面组件,es6语法
 // ********************************************************************************************************************
 // 应用主页
+const Index = () => import('views/Index')
 const Home = () => import('views/home/Index')
 const TimelineIndex = () => import('views/home/Timeline')
 const VideoIndex = () => import('views/home/Video')
@@ -37,14 +38,14 @@ const UserRelation = () => import('views/user/UserRelation')
 // 用户后台主页
 const My = () => import('views/my/My')
 const MyProfile = () => import('views/my/MyProfile')
+// 消息
+const MessageIndex = () => import('views/my/Message')
 const MyVip = () => import('views/my/MyVip')
 // 收藏夹
 const FavlistVideo = () => import('views/my/FavlistVideo')
 const FavlistImage = () => import('views/my/FavlistImage')
 // 浏览记录
 const HistoryIndex = () => import('views/my/History')
-// 消息
-const MessageIndex = () => import('views/my/Message')
 
 const CamList = () => import('views/post/CamList')
 
@@ -360,168 +361,175 @@ const routes = [
     component: PostEditArticle,
     meta: { needAuth: true }
   },
-
   {
     path: '/',
-    name: 'index',
-    component: Home,
-    meta: { needAuth: false }
-  },
-  {
-    path: '/video',
-    name: 'VideoIndex',
-    component: VideoIndex,
-    meta: { needAuth: false }
-  },
-  {
-    path: '/shortvideo',
-    name: 'ShortVideoIndex',
-    component: ShortVideoIndex,
-    meta: { needAuth: false }
-  },
-  {
-    path: '/video/:id',
-    name: 'VideoPage',
-    component: VideoPage,
-    meta: { needAuth: false }
-  },
-  {
-    path: '/vidlist/:id',
-    name: 'VideoList',
-    component: VideoList,
-    meta: { needAuth: false }
-  },
-  {
-    path: '/audio',
-    name: 'AudioIndex',
-    component: AudioIndex,
-    meta: { needAuth: false }
-  },
-  {
-    path: '/audio/:audioId',
-    name: 'AudioPage',
-    component: AudioPage,
-    meta: { needAuth: false }
-  },
-  {
-    path: '/image',
-    name: 'ImageIndex',
-    component: ImageIndex,
-    meta: { needAuth: false }
-  },
-  {
-    path: '/image/album/:albumId',
-    name: 'ImagePage',
-    component: ImagePage,
-    meta: { needAuth: false }
-  },
-  {
-    path: '/article',
-    name: 'ArticleIndex',
-    component: ArticleIndex,
-    meta: { needAuth: false }
-  },
-  {
-    path: '/stream',
-    name: 'MessageStream',
-    component: MessageStream,
-    meta: { needAuth: false }
-  },
-  {
-    path: '/article/:articleId',
-    name: 'ArticlePage',
-    component: ArticlePage,
-    meta: { needAuth: false }
-  },
-  {
-    path: '/discover',
-    name: 'DiscoverIndex',
-    component: DiscoverIndex,
-    meta: { needAuth: false }
-  },
-  {
-    path: '/search',
-    name: 'search',
-    component: Search,
-    meta: { needAuth: false }
-  },
-  {
-    path: '/user/:id',
-    name: 'UserHome',
-    component: UserHome,
-    meta: { needAuth: false }
-  },
-  {
-    path: '/user/:id/video',
-    name: 'UserVideo',
-    component: UserVideo,
-    meta: { needAuth: false }
-  },
-  {
-    path: '/user/:id/image',
-    name: 'UserImage',
-    component: UserImage,
-    meta: { needAuth: false }
-  },
-  {
-    path: '/user/:id/audio',
-    name: 'UserAudio',
-    component: UserAudio,
-    meta: { needAuth: false }
-  },
-  {
-    path: '/user/:id/article',
-    name: 'UserArticle',
-    component: UserArticle,
-    meta: { needAuth: false }
-  },
-  {
-    path: '/user/:id/following',
-    name: 'UserRelation',
-    component: UserRelation,
-    meta: { needAuth: false }
-  },
-  {
-    path: '/user/:id/follower',
-    name: 'UserRelation',
-    component: UserRelation,
-    meta: { needAuth: false }
-  },
-  {
-    path: '/map',
-    name: 'AMap',
-    component: AMap,
-    meta: { needAuth: false }
-  },
-  {
-    path: '/bdmap',
-    name: 'BdMap',
-    component: BdMap,
-    meta: { needAuth: false }
-  },
-  {
-    path: '/amap',
-    name: 'AMap',
-    component: AMap,
-    meta: { needAuth: false }
-  },
-  {
-    path: '/vip',
-    name: 'Vip',
-    component: Vip,
-    meta: { needAuth: false }
+    name: 'Index',
+    component: Index,
+    meta: { needAuth: true },
+    children: [
+      {
+        path: '',
+        name: 'Home',
+        component: Home,
+        meta: { needAuth: false }
+      },
+      {
+        path: '/video',
+        name: 'VideoIndex',
+        component: VideoIndex,
+        meta: { needAuth: false }
+      },
+      {
+        path: '/shortvideo',
+        name: 'ShortVideoIndex',
+        component: ShortVideoIndex,
+        meta: { needAuth: false }
+      },
+      {
+        path: '/video/:id',
+        name: 'VideoPage',
+        component: VideoPage,
+        meta: { needAuth: false }
+      },
+      {
+        path: '/vidlist/:id',
+        name: 'VideoList',
+        component: VideoList,
+        meta: { needAuth: false }
+      },
+      {
+        path: '/audio',
+        name: 'AudioIndex',
+        component: AudioIndex,
+        meta: { needAuth: false }
+      },
+      {
+        path: '/audio/:audioId',
+        name: 'AudioPage',
+        component: AudioPage,
+        meta: { needAuth: false }
+      },
+      {
+        path: '/image',
+        name: 'ImageIndex',
+        component: ImageIndex,
+        meta: { needAuth: false }
+      },
+      {
+        path: '/image/album/:albumId',
+        name: 'ImagePage',
+        component: ImagePage,
+        meta: { needAuth: false }
+      },
+      {
+        path: '/article',
+        name: 'ArticleIndex',
+        component: ArticleIndex,
+        meta: { needAuth: false }
+      },
+      {
+        path: '/stream',
+        name: 'MessageStream',
+        component: MessageStream,
+        meta: { needAuth: false }
+      },
+      {
+        path: '/article/:articleId',
+        name: 'ArticlePage',
+        component: ArticlePage,
+        meta: { needAuth: false }
+      },
+      {
+        path: '/discover',
+        name: 'DiscoverIndex',
+        component: DiscoverIndex,
+        meta: { needAuth: false }
+      },
+      {
+        path: '/search',
+        name: 'search',
+        component: Search,
+        meta: { needAuth: false }
+      },
+      {
+        path: '/user/:id',
+        name: 'UserHome',
+        component: UserHome,
+        meta: { needAuth: false }
+      },
+      {
+        path: '/user/:id/video',
+        name: 'UserVideo',
+        component: UserVideo,
+        meta: { needAuth: false }
+      },
+      {
+        path: '/user/:id/image',
+        name: 'UserImage',
+        component: UserImage,
+        meta: { needAuth: false }
+      },
+      {
+        path: '/user/:id/audio',
+        name: 'UserAudio',
+        component: UserAudio,
+        meta: { needAuth: false }
+      },
+      {
+        path: '/user/:id/article',
+        name: 'UserArticle',
+        component: UserArticle,
+        meta: { needAuth: false }
+      },
+      {
+        path: '/user/:id/following',
+        name: 'UserRelation',
+        component: UserRelation,
+        meta: { needAuth: false }
+      },
+      {
+        path: '/user/:id/follower',
+        name: 'UserRelation',
+        component: UserRelation,
+        meta: { needAuth: false }
+      },
+      {
+        path: '/map',
+        name: 'AMap',
+        component: AMap,
+        meta: { needAuth: false }
+      },
+      {
+        path: '/bdmap',
+        name: 'BdMap',
+        component: BdMap,
+        meta: { needAuth: false }
+      },
+      {
+        path: '/amap',
+        name: 'AMap',
+        component: AMap,
+        meta: { needAuth: false }
+      },
+      {
+        path: '/vip',
+        name: 'Vip',
+        component: Vip,
+        meta: { needAuth: false }
+      },
+      {
+        path: '*',
+        name: '404',
+        component: () => import('@/views/404.vue'),
+        meta: { needAuth: false }
+      }
+    ]
   },
   {
     path: '/login',
     name: 'Login',
     component: () => import('@/views/login.vue'),
     meta: { needAuth: false }
-  },
-  {
-    path: '*',
-    name: '404',
-    component: () => import('@/views/404.vue'),
-    meta: { needAuth: false }
   }
 ]
 

+ 57 - 0
src/views/Index.vue

@@ -0,0 +1,57 @@
+<template>
+  <el-container>
+    <el-main>
+      <nav-bar />
+      <router-view />
+    </el-main>
+  </el-container>
+</template>
+
+<script>
+import NavBar from 'components/layout/NavBar'
+
+export default {
+  name: 'Index',
+  components: {
+    NavBar
+  },
+  data() {
+    return {
+      isCollapse: false,
+      navList: [
+        { path: '/my/account', name: '我的帐号', icon: 'el-icon-upload' }
+      ]
+    }
+  },
+  /*  watch: {
+    // 地址栏 url 发生变化时重新加载本页面
+    $route() {
+      this.$router.go()
+    }
+  },*/
+  created() {
+    document.title = 'tnb'
+  },
+  methods: {
+    handleOpen(key, keyPath) {
+      console.log(key, keyPath)
+    },
+    handleClose(key, keyPath) {
+      console.log(key, keyPath)
+    }
+  }
+}
+</script>
+
+<style>
+.el-menu-vertical-demo:not(.el-menu--collapse) {
+  width: 200px;
+  min-height: 800px;
+}
+
+#aside-style {
+  min-width: 120px;
+  max-width: 240px;
+  width: 30%;
+}
+</style>

+ 76 - 64
src/views/admin/Admin.vue

@@ -1,85 +1,97 @@
 <template>
-  <el-container>
-    <el-aside id="aside-style">
-      <el-radio-group v-model="isCollapse" style="margin-bottom: 20px;">
-        <el-radio-button :label="false">展开</el-radio-button>
-        <el-radio-button :label="true">收起</el-radio-button>
-      </el-radio-group>
-      <el-menu
-        :default-active="this.$route.path"
-        router
-        class="el-menu-vertical-demo"
-        :collapse="isCollapse"
-        @open="handleOpen"
-        @close="handleClose"
-      >
-        <el-menu-item index="/admin/site">
-          <i class="el-icon-apple" />
-          <span slot="title">站点配置</span>
-        </el-menu-item>
-        <el-menu-item index="/admin/user">
-          <i class="el-icon-user" />
-          <span slot="title">用户列表</span>
-        </el-menu-item>
-        <el-menu-item index="/admin/post">
-          <i class="el-icon-postcard" />
-          <span slot="title">稿件列表</span>
-        </el-menu-item>
-        <el-menu-item index="/admin/datasource">
-          <i class="el-icon-date" />
-          <span slot="title">数据源</span>
-        </el-menu-item>
-      </el-menu>
-    </el-aside>
-    <el-main>
-      <!--      <el-breadcrumb separator-class="el-icon-arrow-right">
-        <el-breadcrumb-item :to="{ path: '/' }">首页</el-breadcrumb-item>
-        <el-breadcrumb-item v-text="this.$router.currentRoute.name"></el-breadcrumb-item>
-      </el-breadcrumb>-->
-      <router-view />
-    </el-main>
+  <el-container style="height: 650px; border: 1px solid #eee">
+    <el-header style="text-align: right; font-size: 12px">
+      <el-col :md="2">
+        <ul class="el-menu--horizontal el-menu">
+          <li class="el-menu-item">
+            <a href="/admin" style="text-decoration-line: none">
+              <img src="@/assets/img/icon/logo.png" class="el-avatar--circle el-avatar--medium" alt="img">
+              admin
+            </a>
+          </li>
+        </ul>
+      </el-col>
+      <el-dropdown>
+        <img
+          :src="user.avatarUrl"
+          class="el-avatar--circle el-avatar--medium"
+          style="margin-right: 10px; margin-top: 15px"
+          alt=""
+        >
+        <el-dropdown-menu slot="dropdown">
+          <el-dropdown-item
+            icon="el-icon-error"
+            class="size"
+            @click.native="goToLogout"
+          >退出</el-dropdown-item>
+          <el-dropdown-item>查看</el-dropdown-item>
+          <el-dropdown-item>新增</el-dropdown-item>
+          <el-dropdown-item>删除</el-dropdown-item>
+        </el-dropdown-menu>
+      </el-dropdown>
+    </el-header>
+    <el-container>
+      <el-aside width="200px" style="background-color: rgb(238, 241, 246)">
+        <el-menu
+          :default-active="this.$route.path"
+          router
+          class="el-menu-vertical-demo"
+          :collapse="isCollapse"
+          @open="handleOpen"
+          @close="handleClose"
+        >
+          <el-menu-item index="/admin/site">
+            <i class="el-icon-apple" />
+            <span slot="title">站点配置</span>
+          </el-menu-item>
+          <el-menu-item index="/admin/user">
+            <i class="el-icon-user" />
+            <span slot="title">用户列表</span>
+          </el-menu-item>
+          <el-menu-item index="/admin/post">
+            <i class="el-icon-postcard" />
+            <span slot="title">稿件列表</span>
+          </el-menu-item>
+          <el-menu-item index="/admin/datasource">
+            <i class="el-icon-date" />
+            <span slot="title">数据源</span>
+          </el-menu-item>
+        </el-menu>
+      </el-aside>
+      <el-main>
+        <router-view />
+      </el-main>
+    </el-container>
   </el-container>
 </template>
 
 <script>
+import { getAuthedUser } from '@/utils/auth'
+
 export default {
   data() {
     return {
-      isCollapse: false,
-      navList: [
-        { path: '/my/account', name: '我的帐号', icon: 'el-icon-upload' }
-      ]
+      user: null
     }
   },
-  /*  watch: {
-    // 地址栏 url 发生变化时重新加载本页面
-    $route() {
-      this.$router.go()
-    }
-  },*/
   created() {
-    document.title = '后台主页'
-  },
-  methods: {
-    handleOpen(key, keyPath) {
-      console.log(key, keyPath)
-    },
-    handleClose(key, keyPath) {
-      console.log(key, keyPath)
+    document.title = '后台管理'
+    const userInfo = getAuthedUser()
+    if (userInfo !== null) {
+      this.user = userInfo
     }
   }
 }
 </script>
 
 <style>
-.el-menu-vertical-demo:not(.el-menu--collapse) {
-  width: 200px;
-  min-height: 800px;
+.el-header {
+  background-color: #B3C0D1;
+  color: #333;
+  line-height: 60px;
 }
 
-#aside-style {
-  min-width: 120px;
-  max-width: 240px;
-  width: 30%;
+.el-aside {
+  color: #333;
 }
 </style>

+ 70 - 61
src/views/disk/Disk.vue

@@ -1,82 +1,91 @@
 <template>
-  <el-container>
-    <el-aside id="aside-style">
-      <el-menu
-        :default-active="this.$route.path"
-        router
-        class="el-menu-vertical-demo"
-        :collapse="isCollapse"
-        @open="handleOpen"
-        @close="handleClose"
-      >
-        <el-menu-item index="/disk/list">
-          <i class="el-icon-files" />
-          <span slot="title">文件</span>
-        </el-menu-item>
-        <el-menu-item index="/disk/image">
-          <i class="el-icon-picture" />
-          <span slot="title">图片</span>
-        </el-menu-item>
-        <el-menu-item index="/disk/video">
-          <i class="el-icon-video-camera" />
-          <span slot="title">视频</span>
-        </el-menu-item>
-        <el-menu-item index="/disk/audio">
-          <i class="el-icon-headset" />
-          <span slot="title">音频</span>
-        </el-menu-item>
-      </el-menu>
-    </el-aside>
-    <el-main>
-      <!--      <el-breadcrumb separator-class="el-icon-arrow-right">
-        <el-breadcrumb-item :to="{ path: '/' }">首页</el-breadcrumb-item>
-        <el-breadcrumb-item v-text="this.$router.currentRoute.name"></el-breadcrumb-item>
-      </el-breadcrumb>-->
-      <router-view />
-    </el-main>
+  <el-container style="height: 650px; border: 1px solid #eee">
+    <el-header style="text-align: right; font-size: 12px">
+      <el-col :md="2">
+        <ul class="el-menu--horizontal el-menu">
+          <li class="el-menu-item">
+            <a href="/disk" style="text-decoration-line: none">
+              <img src="@/assets/img/icon/logo.png" class="el-avatar--circle el-avatar--medium" alt="img">
+              disk
+            </a>
+          </li>
+        </ul>
+      </el-col>
+      <el-dropdown>
+        <img
+          :src="user.avatarUrl"
+          class="el-avatar--circle el-avatar--medium"
+          style="margin-right: 10px; margin-top: 15px"
+          alt=""
+        >
+        <el-dropdown-menu slot="dropdown">
+          <el-dropdown-item
+            icon="el-icon-error"
+            class="size"
+            @click.native="goToLogout"
+          >退出</el-dropdown-item>
+        </el-dropdown-menu>
+      </el-dropdown>
+    </el-header>
+    <el-container>
+      <el-aside width="200px" style="background-color: rgb(238, 241, 246)">
+        <el-menu
+          :default-active="this.$route.path"
+          router
+          class="el-menu-vertical-demo"
+        >
+          <el-menu-item index="/disk/list">
+            <i class="el-icon-files" />
+            <span slot="title">文件</span>
+          </el-menu-item>
+          <el-menu-item index="/disk/image">
+            <i class="el-icon-picture" />
+            <span slot="title">图片</span>
+          </el-menu-item>
+          <el-menu-item index="/disk/video">
+            <i class="el-icon-video-camera" />
+            <span slot="title">视频</span>
+          </el-menu-item>
+          <el-menu-item index="/disk/audio">
+            <i class="el-icon-headset" />
+            <span slot="title">音频</span>
+          </el-menu-item>
+        </el-menu>
+      </el-aside>
+      <el-main>
+        <router-view />
+      </el-main>
+    </el-container>
   </el-container>
 </template>
 
 <script>
+import { getAuthedUser } from '@/utils/auth'
+
 export default {
-  name: 'Disk',
   data() {
     return {
-      isCollapse: false,
-      navList: [
-        { path: '/my/account', name: '我的帐号', icon: 'el-icon-upload' }
-      ]
+      user: null
     }
   },
-  /*  watch: {
-    // 地址栏 url 发生变化时重新加载本页面
-    $route() {
-      this.$router.go()
-    }
-  },*/
   created() {
-    document.title = '网盘主页'
-  },
-  methods: {
-    handleOpen(key, keyPath) {
-      console.log(key, keyPath)
-    },
-    handleClose(key, keyPath) {
-      console.log(key, keyPath)
+    document.title = '我的网盘'
+    const userInfo = getAuthedUser()
+    if (userInfo !== null) {
+      this.user = userInfo
     }
   }
 }
 </script>
 
 <style>
-.el-menu-vertical-demo:not(.el-menu--collapse) {
-  width: 200px;
-  min-height: 800px;
+.el-header {
+  background-color: #B3C0D1;
+  color: #333;
+  line-height: 60px;
 }
 
-#aside-style {
-  min-width: 120px;
-  max-width: 240px;
-  width: 30%;
+.el-aside {
+  color: #333;
 }
 </style>

+ 163 - 153
src/views/my/My.vue

@@ -1,195 +1,205 @@
 <template>
-  <el-container>
-    <el-aside id="aside-style">
-      <!--    <el-radio-group v-model="isCollapse" style="margin-bottom: 20px;">
-      <el-radio-button :label="false">展开</el-radio-button>
-      <el-radio-button :label="true">收起</el-radio-button>
-    </el-radio-group>-->
-      <el-menu
-        :default-active="this.$route.path"
-        router
-        class="el-menu-vertical-demo"
-        :collapse="isCollapse"
-        @open="handleOpen"
-        @close="handleClose"
-      >
-        <el-submenu index="/my/account">
-          <template slot="title">
-            <i class="el-icon-user" />
-            <span slot="title">帐号管理</span>
-          </template>
-          <el-menu-item-group>
-            <el-menu-item index="/my/account/profile">
-              <i class="el-icon-film" />
-              <span slot="title">个人资料</span>
-            </el-menu-item>
-            <el-menu-item index="/my/account/vip">
-              <i class="el-icon-film" />
-              <span slot="title">小会员</span>
-            </el-menu-item>
-          </el-menu-item-group>
-        </el-submenu>
-        <el-submenu index="/my/post">
-          <template slot="title">
-            <i class="el-icon-postcard" />
-            <span slot="title">稿件管理</span>
-          </template>
-          <el-submenu index="/my/post/publish">
+  <el-container style="height: 650px; border: 1px solid #eee">
+    <el-header style="text-align: right; font-size: 12px">
+      <el-col :md="2">
+        <ul class="el-menu--horizontal el-menu">
+          <li class="el-menu-item">
+            <a href="/my" style="text-decoration-line: none">
+              <img src="@/assets/img/icon/logo.png" class="el-avatar--circle el-avatar--medium" alt="img">
+              my
+            </a>
+          </li>
+        </ul>
+      </el-col>
+      <el-dropdown>
+        <img
+          :src="user.avatarUrl"
+          class="el-avatar--circle el-avatar--medium"
+          style="margin-right: 10px; margin-top: 15px"
+          alt=""
+        >
+        <el-dropdown-menu slot="dropdown">
+          <el-dropdown-item
+            icon="el-icon-error"
+            class="size"
+            @click.native="goToLogout"
+          >退出</el-dropdown-item>
+          <el-dropdown-item>查看</el-dropdown-item>
+        </el-dropdown-menu>
+      </el-dropdown>
+    </el-header>
+    <el-container>
+      <el-aside width="200px" style="background-color: rgb(238, 241, 246)">
+        <el-menu
+          :default-active="this.$route.path"
+          router
+          class="el-menu-vertical-demo"
+          :collapse="isCollapse"
+          @open="handleOpen"
+          @close="handleClose"
+        >
+          <el-submenu index="/my/account">
             <template slot="title">
-              <i class="el-icon-plus" />
-              <span slot="title">发布</span>
+              <i class="el-icon-user" />
+              <span slot="title">帐号管理</span>
             </template>
             <el-menu-item-group>
-              <el-menu-item index="/my/post/publish/video">
+              <el-menu-item index="/my/account/profile">
                 <i class="el-icon-film" />
-                <span slot="title">视频</span>
-              </el-menu-item>
-              <el-menu-item index="/my/post/publish/audio">
-                <i class="el-icon-headset" />
-                <span slot="title">音频</span>
+                <span slot="title">个人资料</span>
               </el-menu-item>
-              <el-menu-item index="/my/post/publish/image">
-                <i class="el-icon-picture" />
-                <span slot="title">相册</span>
-              </el-menu-item>
-              <el-menu-item index="/my/post/publish/article">
-                <i class="el-icon-document" />
-                <span slot="title">文章</span>
-              </el-menu-item>
-              <el-menu-item index="/my/post/publish/file">
-                <i class="el-icon-files" />
-                <span slot="title">文件</span>
+              <el-menu-item index="/my/account/vip">
+                <i class="el-icon-film" />
+                <span slot="title">小会员</span>
               </el-menu-item>
             </el-menu-item-group>
           </el-submenu>
-          <el-submenu index="/my/post/list">
+          <el-submenu index="/my/post">
             <template slot="title">
-              <i class="el-icon-s-data" />
-              <span slot="title">稿件</span>
+              <i class="el-icon-postcard" />
+              <span slot="title">稿件管理</span>
+            </template>
+            <el-submenu index="/my/post/publish">
+              <template slot="title">
+                <i class="el-icon-plus" />
+                <span slot="title">发布</span>
+              </template>
+              <el-menu-item-group>
+                <el-menu-item index="/my/post/publish/video">
+                  <i class="el-icon-film" />
+                  <span slot="title">视频</span>
+                </el-menu-item>
+                <el-menu-item index="/my/post/publish/audio">
+                  <i class="el-icon-headset" />
+                  <span slot="title">音频</span>
+                </el-menu-item>
+                <el-menu-item index="/my/post/publish/image">
+                  <i class="el-icon-picture" />
+                  <span slot="title">相册</span>
+                </el-menu-item>
+                <el-menu-item index="/my/post/publish/article">
+                  <i class="el-icon-document" />
+                  <span slot="title">文章</span>
+                </el-menu-item>
+                <el-menu-item index="/my/post/publish/file">
+                  <i class="el-icon-files" />
+                  <span slot="title">文件</span>
+                </el-menu-item>
+              </el-menu-item-group>
+            </el-submenu>
+            <el-submenu index="/my/post/list">
+              <template slot="title">
+                <i class="el-icon-s-data" />
+                <span slot="title">稿件</span>
+              </template>
+              <el-menu-item-group>
+                <el-menu-item index="/my/post/list/video">
+                  <i class="el-icon-film" />
+                  <span slot="title">视频</span>
+                </el-menu-item>
+                <el-menu-item index="/my/post/list/audio">
+                  <i class="el-icon-headset" />
+                  <span slot="title">音频</span>
+                </el-menu-item>
+                <el-menu-item index="/my/post/list/image">
+                  <i class="el-icon-picture" />
+                  <span slot="title">相册</span>
+                </el-menu-item>
+                <el-menu-item index="/my/post/list/article">
+                  <i class="el-icon-document" />
+                  <span slot="title">文章</span>
+                </el-menu-item>
+              </el-menu-item-group>
+            </el-submenu>
+          </el-submenu>
+          <el-submenu index="/my/favlist">
+            <template slot="title">
+              <i class="el-icon-collection" />
+              <span slot="title">收藏夹</span>
             </template>
             <el-menu-item-group>
-              <el-menu-item index="/my/post/list/video">
+              <el-menu-item index="/my/favlist/video">
                 <i class="el-icon-film" />
                 <span slot="title">视频</span>
               </el-menu-item>
-              <el-menu-item index="/my/post/list/audio">
-                <i class="el-icon-headset" />
-                <span slot="title">音频</span>
-              </el-menu-item>
-              <el-menu-item index="/my/post/list/image">
+              <el-menu-item index="/my/favlist/image">
                 <i class="el-icon-picture" />
                 <span slot="title">相册</span>
               </el-menu-item>
-              <el-menu-item index="/my/post/list/article">
-                <i class="el-icon-document" />
-                <span slot="title">文章</span>
+            </el-menu-item-group>
+          </el-submenu>
+          <el-menu-item index="/my/visit">
+            <i class="el-icon-document" />
+            <span slot="title">历史记录</span>
+          </el-menu-item>
+          <el-submenu index="/my/message">
+            <template slot="title">
+              <i class="el-icon-message" />
+              <span slot="title">我的消息</span>
+            </template>
+            <el-menu-item-group>
+              <el-menu-item index="/my/message/send">
+                <i class="el-icon-right" />
+                <span slot="title">发出的消息</span>
+              </el-menu-item>
+              <el-menu-item index="/my/message/receive">
+                <i class="el-icon-back" />
+                <span slot="title">收到的消息</span>
+              </el-menu-item>
+              <el-menu-item index="/my/message/private">
+                <i class="el-icon-bell" />
+                <span slot="title">私信</span>
               </el-menu-item>
             </el-menu-item-group>
           </el-submenu>
-        </el-submenu>
-        <el-submenu index="/my/favlist">
-          <template slot="title">
-            <i class="el-icon-collection" />
-            <span slot="title">收藏夹</span>
-          </template>
-          <el-menu-item-group>
-            <el-menu-item index="/my/favlist/video">
-              <i class="el-icon-film" />
-              <span slot="title">视频</span>
-            </el-menu-item>
-            <el-menu-item index="/my/favlist/image">
-              <i class="el-icon-picture" />
-              <span slot="title">相册</span>
-            </el-menu-item>
-          </el-menu-item-group>
-        </el-submenu>
-        <el-menu-item index="/my/visit">
-          <i class="el-icon-document" />
-          <span slot="title">历史记录</span>
-        </el-menu-item>
-        <el-submenu index="/my/message">
-          <template slot="title">
-            <i class="el-icon-message" />
-            <span slot="title">我的消息</span>
-          </template>
-          <el-menu-item-group>
-            <el-menu-item index="/my/message/send">
-              <i class="el-icon-right" />
-              <span slot="title">发出的消息</span>
-            </el-menu-item>
-            <el-menu-item index="/my/message/receive">
-              <i class="el-icon-back" />
-              <span slot="title">收到的消息</span>
-            </el-menu-item>
-            <el-menu-item index="/my/message/private">
-              <i class="el-icon-bell" />
-              <span slot="title">私信</span>
-            </el-menu-item>
-          </el-menu-item-group>
-        </el-submenu>
-        <el-submenu index="/my/cam">
-          <template slot="title">
-            <i class="el-icon-camera" />
-            <span slot="title">我的监控</span>
-          </template>
-          <el-menu-item-group>
-            <el-menu-item index="/my/cam/list">
+          <el-submenu index="/my/cam">
+            <template slot="title">
               <i class="el-icon-camera" />
-              <span slot="title">摄像头列表</span>
-            </el-menu-item>
-          </el-menu-item-group>
-        </el-submenu>
-      </el-menu>
-    </el-aside>
-    <el-main>
-      <!--      <el-breadcrumb separator-class="el-icon-arrow-right">
-        <el-breadcrumb-item :to="{ path: '/' }">首页</el-breadcrumb-item>
-        <el-breadcrumb-item v-text="this.$router.currentRoute.name"></el-breadcrumb-item>
-      </el-breadcrumb>-->
-      <router-view />
-    </el-main>
+              <span slot="title">我的监控</span>
+            </template>
+            <el-menu-item-group>
+              <el-menu-item index="/my/cam/list">
+                <i class="el-icon-camera" />
+                <span slot="title">摄像头列表</span>
+              </el-menu-item>
+            </el-menu-item-group>
+          </el-submenu>
+        </el-menu>
+      </el-aside>
+      <el-main>
+        <router-view />
+      </el-main>
+    </el-container>
   </el-container>
 </template>
 
 <script>
+import { getAuthedUser } from '@/utils/auth'
+
 export default {
   data() {
     return {
-      isCollapse: false,
-      navList: [
-        { path: '/my/account', name: '我的帐号', icon: 'el-icon-upload' }
-      ]
+      user: null
     }
   },
-  /*  watch: {
-    // 地址栏 url 发生变化时重新加载本页面
-    $route() {
-      this.$router.go()
-    }
-  },*/
   created() {
-    document.title = '我的主页'
-  },
-  methods: {
-    handleOpen(key, keyPath) {
-      console.log(key, keyPath)
-    },
-    handleClose(key, keyPath) {
-      console.log(key, keyPath)
+    document.title = '我的帐号'
+    const userInfo = getAuthedUser()
+    if (userInfo !== null) {
+      this.user = userInfo
     }
   }
 }
 </script>
 
 <style>
-.el-menu-vertical-demo:not(.el-menu--collapse) {
-  width: 200px;
-  min-height: 800px;
+.el-header {
+  background-color: #B3C0D1;
+  color: #333;
+  line-height: 60px;
 }
 
-#aside-style {
-  min-width: 120px;
-  max-width: 240px;
-  width: 30%;
+.el-aside {
+  color: #333;
 }
 </style>