添加 MyRcmd.vue 页面用于设置用户首页显示的推荐内容

src/api/content.js

@@ -5,7 +5,8 @@ const videoApi = {
   contentAccessCodeApi: '/api/content/userdata',
   ossServerApi: '/api/file/oss/serverinfo',
   ossServerApi1: '/api/content/oss/serverinfo',
-  siteNoticeApi: '/api/content/site/notice'
+  siteNoticeApi: '/api/content/site/notice',
+  userRcmdApi: '/api/content/rcmd/user'
 }
 
 /** *******************************************************************************************************************/
@@ -27,3 +28,13 @@ export function getServerInfo(channelId) {
 export function getSiteNotice() {
   return get(videoApi.siteNoticeApi)
 }
+
+// 获取用户的推荐模式
+export function getUserRcmd() {
+  return get(videoApi.userRcmdApi)
+}
+
+// 设置用户的推荐模式
+export function setUserRcmd(jsonData) {
+  return post(videoApi.userRcmdApi, jsonData)
+}

src/router/my.js

@@ -3,6 +3,7 @@
 const My = () => import('views/my/My')
 const MyProfile = () => import('views/my/MyProfile')
 const MyOAuth = () => import('views/my/MyOAuth')
+const MyRcmd = () => import('views/my/MyRcmd')
 const MyMessage = () => import('views/my/MyMessage')
 const MyRecord = () => import('views/my/MyRecord')
 const MyVip = () => import('views/my/MyVip')
@@ -49,6 +50,12 @@ export default {
       name: 'OAuth',
       component: MyOAuth,
       meta: { needAuth: true }
+    },
+    {
+      path: '/my/rcmd',
+      name: 'Rcmd',
+      component: MyRcmd,
+      meta: { needAuth: true }
     }
   ]
 }

src/views/my/My.vue

@@ -60,6 +60,10 @@
             <i class="el-icon-film" />
             <span slot="title">OAuth</span>
           </el-menu-item>
+          <el-menu-item index="/my/rcmd">
+            <i class="el-icon-film" />
+            <span slot="title">我的推荐</span>
+          </el-menu-item>
         </el-menu>
       </el-aside>
       <el-main>

src/views/my/MyRcmd.vue

@@ -0,0 +1,87 @@
+<template>
+  <el-main>
+    <el-row class="movie-list">
+      <el-col :md="20" style="padding-right: 5px; padding-left: 5px; padding-bottom: 5px">
+        <el-card class="box-card">
+          <div slot="header" class="clearfix">
+            <span>我的推荐</span>
+          </div>
+          <div>
+            开启精选模式
+            <el-switch
+              v-model="modeEnabled"
+              @change="onChange"
+            >
+            </el-switch>
+          </div>
+        </el-card>
+      </el-col>
+    </el-row>
+  </el-main>
+</template>
+
+<script>
+import { getUserRcmd, setUserRcmd } from '@/api/content'
+
+export default {
+  name: 'MyOAuth',
+  data() {
+    return {
+      modeEnabled: false
+    }
+  },
+  created() {
+    document.title = '我的推荐'
+    getUserRcmd().then(resp => {
+      if (resp.code === 0) {
+        this.modeEnabled = resp.data
+      } else {
+        this.$notify.warning({
+          message: resp.msg,
+          type: 'warning',
+          duration: 3000
+        })
+      }
+    }).catch(error => {
+      this.$notify({
+        title: '提示',
+        message: error.message,
+        type: 'warning',
+        duration: 3000
+      })
+    })
+  },
+  methods: {
+    onChange(value) {
+      this.modeEnabled = value
+      const payload = {}
+      payload.mode = this.modeEnabled
+      setUserRcmd(payload).then(resp => {
+        if (resp.code === 0) {
+          var text = '精选模式已开启'
+          if (!this.modeEnabled) {
+            text = '精选模式已关闭'
+          }
+          this.$message.info(text)
+        } else {
+          this.$notify.warning({
+            message: resp.msg,
+            type: 'warning',
+            duration: 3000
+          })
+        }
+      }).catch(error => {
+        this.$notify({
+          title: '提示',
+          message: error.message,
+          type: 'warning',
+          duration: 3000
+        })
+      })
+    }
+  }
+}
+</script>
+
+<style scoped>
+</style>