添加 My.vue 页面作为后台管理

src/assets/js/mixin.js

@@ -198,9 +198,6 @@ export const userMixin = {
         })
       })
     },
-    goToProfile() {
-      window.open("//account.reghao.cn", "_blank");
-    },
     goToPost() {
       if (this.$route.path === '/post/list') {
         this.$router.go(0)

src/components/layout/NavBar.vue

@@ -205,6 +205,14 @@ export default {
       this.dialogVisible2 = false
       this.dialogVisible = true
     },
+    goToProfile() {
+      const path = '/my'
+      if (this.$route.path === path) {
+        this.$router.go(0)
+        return
+      }
+      this.$router.push(path)
+    },
     goToTimeline() {
       const path = '/timeline'
       if (this.$route.path === path) {
@@ -220,7 +228,7 @@ export default {
         return
       }
       this.$router.push(path)
-    },
+    }
   }
 }
 </script>

src/router/index.js

@@ -18,6 +18,9 @@ const ArticleIndex = () => import('views/home/Article')
 const ArticlePage = () => import('views/home/ArticlePage')
 const MessageStream = () => import('views/home/MessageStream1')
 const Search = () => import('views/home/Search')
+
+// ********************************************************************************************************************
+const My = () => import('views/user/My')
 const UserHome = () => import('views/user/Home')
 const UserVideo = () => import('views/user/Home')
 const UserImage = () => import('views/user/Home')
@@ -189,6 +192,11 @@ const routes = [
     name: 'search',
     component: Search
   },
+  {
+    path: '/my',
+    name: 'My',
+    component: My
+  },
   {
     path: '/user/:id',
     name: 'UserHome',

src/views/post/PostAnalysis.vue

@@ -18,51 +18,54 @@
         style="width: 100%"
       >
         <el-table-column
-          type="index">
-        </el-table-column>
+          type="index"
+        />
         <el-table-column
           prop="coverUrl"
           label="视频封面"
-          width="150">
+          width="150"
+        >
           <template slot-scope="scope">
             <el-image :src="scope.row.coverUrl" min-width="40" height="30" />
           </template>
         </el-table-column>
         <el-table-column
           prop="pubDate"
-          label="发布时间">
-        </el-table-column>
+          label="发布时间"
+        />
         <el-table-column
           prop="videoId"
           label="视频 ID"
-          width="180">
-        </el-table-column>
+          width="180"
+        />
         <el-table-column
           prop="title"
           label="标题"
-          width="180">
-        </el-table-column>
+          width="180"
+        />
         <el-table-column
           prop="view"
-          label="播放量">
-        </el-table-column>
+          label="播放量"
+        />
         <el-table-column
           prop="comment"
-          label="评论量">
-        </el-table-column>
+          label="评论量"
+        />
         <el-table-column
           prop="favorite"
-          label="收藏量">
-        </el-table-column>
+          label="收藏量"
+        />
         <el-table-column label="操作">
           <template slot-scope="scope">
             <el-button
               size="mini"
-              @click="handleEdit(scope.$index, scope.row)">编辑</el-button>
+              @click="handleEdit(scope.$index, scope.row)"
+            >编辑</el-button>
             <el-button
               size="mini"
               type="danger"
-              @click="handleDelete(scope.$index, scope.row)">删除</el-button>
+              @click="handleDelete(scope.$index, scope.row)"
+            >删除</el-button>
           </template>
         </el-table-column>
       </el-table>
@@ -84,14 +87,14 @@ export default {
       dataList: []
     }
   },
-  created() {
-    document.title = "数据分析"
-  },
   watch: {
-    $route(){
+    $route() {
       this.$router.go()
     }
   },
+  created() {
+    document.title = '数据分析'
+  },
   methods: {
   }
 }

src/views/user/My.vue

@@ -0,0 +1,132 @@
+<template>
+  <el-row>
+    <!--    <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="1-4-1"
+      class="el-menu-vertical-demo"
+      :collapse="isCollapse"
+      @open="handleOpen"
+      @close="handleClose"
+    >
+      <el-submenu index="1">
+        <template slot="title">
+          <i class="el-icon-user" />
+          <span slot="title">帐号管理</span>
+        </template>
+        <el-menu-item-group>
+          <el-menu-item index="1-1">选项1</el-menu-item>
+          <el-menu-item index="1-2">选项2</el-menu-item>
+        </el-menu-item-group>
+        <el-menu-item-group title="分组2">
+          <el-menu-item index="1-3">选项3</el-menu-item>
+        </el-menu-item-group>
+        <el-submenu index="1-4">
+          <span slot="title">选项4</span>
+          <el-menu-item index="1-4-1">选项1</el-menu-item>
+        </el-submenu>
+      </el-submenu>
+      <el-submenu index="2">
+        <template slot="title">
+          <i class="el-icon-postcard" />
+          <span slot="title">稿件管理</span>
+        </template>
+        <el-submenu index="2-1">
+          <template slot="title">
+            <i class="el-icon-plus" />
+            <span slot="title">发布</span>
+          </template>
+          <el-menu-item-group>
+            <el-menu-item index="2-1-1">
+              <i class="el-icon-film" />
+              <span slot="title">视频</span>
+            </el-menu-item>
+            <el-menu-item index="2-1-2">
+              <i class="el-icon-headset" />
+              <span slot="title">音频</span>
+            </el-menu-item>
+            <el-menu-item index="2-1-3">
+              <i class="el-icon-picture" />
+              <span slot="title">相册</span>
+            </el-menu-item>
+            <el-menu-item index="2-1-4">
+              <i class="el-icon-document" />
+              <span slot="title">文章</span>
+            </el-menu-item>
+            <el-menu-item index="2-1-5">
+              <i class="el-icon-files" />
+              <span slot="title">文件</span>
+            </el-menu-item>
+          </el-menu-item-group>
+        </el-submenu>
+        <el-submenu index="2-2">
+          <template slot="title">
+            <i class="el-icon-s-data" />
+            <span slot="title">列表</span>
+          </template>
+          <el-menu-item-group>
+            <el-menu-item index="2-2-1">
+              <i class="el-icon-film" />
+              <span slot="title">视频</span>
+            </el-menu-item>
+            <el-menu-item index="2-2-2">
+              <i class="el-icon-headset" />
+              <span slot="title">音频</span>
+            </el-menu-item>
+            <el-menu-item index="2-2-3">
+              <i class="el-icon-picture" />
+              <span slot="title">相册</span>
+            </el-menu-item>
+            <el-menu-item index="2-2-4">
+              <i class="el-icon-document" />
+              <span slot="title">文章</span>
+            </el-menu-item>
+          </el-menu-item-group>
+        </el-submenu>
+      </el-submenu>
+      <el-menu-item index="3">
+        <i class="el-icon-document" />
+        <span slot="title">导航三</span>
+      </el-menu-item>
+      <el-menu-item index="4">
+        <i class="el-icon-setting" />
+        <span slot="title">导航四</span>
+      </el-menu-item>
+    </el-menu>
+  </el-row>
+</template>
+
+<script>
+export default {
+  data() {
+    return {
+      isCollapse: false,
+      navList: [
+        { path: '/post/publish', name: '发布', icon: 'el-icon-upload' },
+        { path: '/post/list', name: '稿件', icon: 'el-icon-files' },
+        { path: '/post/analysis', name: '数据', icon: 'el-icon-data-analysis' }
+      ]
+    }
+  },
+  created() {
+    document.title = '我的主页'
+  },
+  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: 400px;
+}
+</style>