My.vue 中添加 message

package-lock.json

@@ -1432,9 +1432,9 @@
           },
           "dependencies": {
             "@babel/parser": {
-              "version": "7.23.3",
-              "resolved": "https://registry.npmmirror.com/@babel/parser/-/parser-7.23.3.tgz",
-              "integrity": "sha512-uVsWNvlVsIninV2prNz/3lHCb+5CJ+e+IUBfbjToAHODtfGYLfCFuY4AU7TskI+dAKk+njsPiBjq1gKTvZOBaw=="
+              "version": "7.23.4",
+              "resolved": "https://registry.npmmirror.com/@babel/parser/-/parser-7.23.4.tgz",
+              "integrity": "sha512-vf3Xna6UEprW+7t6EtOmFpHNAuxw3xqPZghy+brsnusscJRW5BMUzzHZc5ICjULee81WeUV2jjakG09MDglJXQ=="
             },
             "@liripeng/vue-audio-player": {
               "version": "1.4.1-beta1",

src/components/upload/PublishFile.vue

@@ -161,7 +161,6 @@ export default {
         duration: 3000
       })
     })
-    this.getVideoCategory()
   },
   mounted() {
   },

src/router/index.js

@@ -43,6 +43,8 @@ const MyVip = () => import('views/my/MyVip')
 const CollectionIndex = () => import('views/my/Collection')
 // 浏览记录
 const HistoryIndex = () => import('views/my/History')
+// 消息
+const MessageIndex = () => import('views/my/Message')
 
 // 发布稿件
 const PostPublishVideo = () => import('components/upload/PublishVideo')
@@ -64,7 +66,6 @@ const PostEditArticle = () => import('components/upload/EditArticle')
 const PostPublish = () => import('views/post/PostPublish')
 const PostList = () => import('views/post/PostList')
 const PostAnalysis = () => import('views/post/PostAnalysis')
-const MessageIndex = () => import('views/message/Message')
 
 // 使用安装路由插件
 Vue.use(VueRouter)
@@ -219,6 +220,28 @@ const routes = [
       }
     ]
   },
+  {
+    path: '/my/message',
+    name: 'MyMessage',
+    component: My,
+    children: [
+      {
+        path: '/my/message/send',
+        name: '发出的消息',
+        component: MessageIndex
+      },
+      {
+        path: '/my/message/receive',
+        name: '收到的消息',
+        component: MessageIndex
+      },
+      {
+        path: '/my/message/private',
+        name: '私信',
+        component: MessageIndex
+      }
+    ]
+  },
   {
     path: '/',
     name: 'index',
@@ -444,11 +467,6 @@ const routes = [
     name: 'PostAnalysis',
     component: PostAnalysis
   },
-  {
-    path: '/message',
-    name: 'MessageIndex',
-    component: MessageIndex
-  },
   {
     path: '/map',
     name: 'AMap',

src/views/home/LivePage.vue

@@ -7,7 +7,7 @@
             <h3 v-html="video.title" />
           </div>
           <div class="text item">
-            <live-player :video-prop="video"/>
+            <live-player :video-prop="video" />
           </div>
         </el-card>
       </el-row>
@@ -15,7 +15,7 @@
     <el-col :md="9">
       <el-row>
         <el-row style="padding-right: 5px; padding-left: 5px; padding-bottom: 5px">
-          <user-avatar-card :userAvatar="user" />
+          <user-avatar-card :user-avatar="user" />
         </el-row>
       </el-row>
     </el-col>
@@ -24,12 +24,11 @@
 
 <script>
 import LivePlayer from 'components/LivePlayer'
-import VideoCard from 'components/card/VideoCard'
 import UserAvatarCard from '@/components/card/UserAvatarCard'
 
 export default {
   name: 'LivePage',
-  components: { VideoCard, LivePlayer, UserAvatarCard },
+  components: { LivePlayer, UserAvatarCard },
   data() {
     return {
       video: {
@@ -37,14 +36,14 @@ export default {
         title: '我的直播',
         description: '我的直播',
         view: 10,
-        favorite: 10,
+        favorite: 10
       },
       user: {
         userId: 10001,
         screenName: '浩',
         avatarUrl: '',
         following: 1024,
-        follower: 1024,
+        follower: 1024
       },
       videoProp: {
         info: null,
@@ -59,24 +58,17 @@ export default {
         errorCode: null
       },
       showPlaylist: false,
-      autoPlay: false,
-    }
-  },
-  watch: {
-    // 地址栏 url 发生变化时重新加载本页面
-    $route(){
-      this.$router.go()
+      autoPlay: false
     }
   },
   created() {
-    const id = this.$route.params.id
   },
   methods: {
     // 用户点击收藏
     collection(videoId) {
     },
     getDownloadUrl(videoId) {
-    },
+    }
   }
 }
 </script>

src/views/message/Message.vue

@@ -1,44 +0,0 @@
-<template>
-  <div>
-    <el-row>
-      <el-col :md="4">
-        <el-menu
-          :default-active="this.$route.path"
-          router
-          class="el-menu-vertical-demo"
-        >
-          <el-menu-item v-for="(item,i) in navList" :key="i" :index="item.path">
-            <i :class="item.icon" />
-            <span slot="title">{{ item.name }}</span>
-          </el-menu-item>
-        </el-menu>
-      </el-col>
-      <el-col :md="20">
-        <el-row>
-          <h2>我的消息</h2>
-        </el-row>
-      </el-col>
-    </el-row>
-  </div>
-</template>
-
-<script>
-export default {
-  name: 'Profile',
-  data() {
-    return {
-      userId: -1,
-      navList: [
-        { path: '/message', name: '我的消息', icon: 'el-icon-user' },
-        { path: '/message/comment/receive', name: '收到的评论', icon: 'el-icon-user' },
-        { path: '/message/commend/send', name: '发出的评论', icon: 'el-icon-user' }
-      ],
-    }
-  },
-  created() {
-    document.title = '我的消息'
-  },
-  methods: {
-  }
-}
-</script>

src/views/my/Message.vue

@@ -0,0 +1,36 @@
+<template>
+  <div>
+    <el-row>
+      <el-col :md="20">
+        <el-row>
+          <h2>我的消息</h2>
+        </el-row>
+      </el-col>
+    </el-row>
+  </div>
+</template>
+
+<script>
+export default {
+  name: 'Message',
+  data() {
+    return {
+    }
+  },
+  created() {
+    const path = this.$route.path
+    var title = '我的消息'
+    if (path.endsWith('/send')) {
+      title = '发出的消息'
+    } else if (path.endsWith('/receive')) {
+      title = '收到的消息'
+    } else if (path.endsWith('/private')) {
+      title = '私信'
+    }
+
+    document.title = title
+  },
+  methods: {
+  }
+}
+</script>

src/views/my/My.vue

@@ -87,7 +87,7 @@
             </el-menu-item-group>
           </el-submenu>
         </el-submenu>
-        <el-submenu index="/my/post1">
+        <el-submenu index="/my/favlist">
           <template slot="title">
             <i class="el-icon-collection" />
             <span slot="title">收藏夹</span>
@@ -107,6 +107,26 @@
           <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-menu>
     </el-aside>
     <el-main>
@@ -131,6 +151,12 @@ export default {
       ]
     }
   },
+  /*  watch: {
+    // 地址栏 url 发生变化时重新加载本页面
+    $route() {
+      this.$router.go()
+    }
+  },*/
   created() {
     document.title = '我的主页'
   },

src/views/user/My.vue

@@ -1,153 +0,0 @@
-<template>
-  <el-container>
-    <el-aside>
-      <!--    <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">
-            <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/post1">
-          <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-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>
-</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: 800px;
-}
-</style>