add 获取媒体豆瓣信息

view/src/api/Video.js

@@ -1,8 +1,16 @@
 import { base } from "./base";
-export async function getVideoInfo(name){
-    return await base.get("/videoInfo/search",{
+export async function getVideoInfo(id){
+    return await base.get("/videoInfo/getVideoInfo",{
+        params:{
+            id
+        }
+    })
+}
+
+export async function serchVideo(name){
+    return await base.get("/videoInfo/serchVideo",{
         params:{
             name
         }
     })
-}
+}

view/src/menu/leftMenu.vue

@@ -25,6 +25,12 @@ import {router} from "../router/index.js";
           订阅管理
         </template>
         <el-menu-item-group>
+          <el-menu-item index="/addSubscribe">
+            <el-icon>
+              <VideoCamera/>
+            </el-icon>
+            添加订阅
+          </el-menu-item>
           <el-menu-item index="/subscribe">
             <el-icon>
               <VideoCamera/>

view/src/page/subscribe/addSubscribe.vue

@@ -0,0 +1,99 @@
+<template>
+    <div>
+        <el-form :inline="true" :model="formInline" class="demo-form-inline">
+            <el-form-item label="名称">
+                <el-input v-model="formInline.name" placeholder="Approved by" clearable />
+            </el-form-item>
+            <el-form-item>
+                <el-button type="primary" @click="onSubmit">搜索</el-button>
+            </el-form-item>
+        </el-form>
+        <div class="list">
+            <div class="item" v-for="i in list">
+                <el-card :body-style="{ padding: '0px' }">
+                    <img :src="i.img" class="image" />
+                    <div style="padding: 14px">
+                        <span>{{ i.title }}({{ i.year }})</span>
+                        <div class="bottom">
+                            <time class="time">类型：{{ i.type }}</time>
+                            <el-button text class="button" @click="getinfo(i.id)">详情</el-button>
+                        </div>
+                    </div>
+                </el-card>
+            </div>
+        </div>
+        <el-dialog v-model="dialogFormVisible" title="详情">
+           <textarea style="width: 95%;height: 400px;" v-model="info"></textarea>
+            <template #footer>
+                <span class="dialog-footer">
+                    <el-button @click="dialogFormVisible = false">Cancel</el-button>
+                    <el-button type="primary" @click="dialogFormVisible = false">
+                        Confirm
+                    </el-button>
+                </span>
+            </template>
+        </el-dialog>
+    </div>
+</template>
+
+<script setup>
+import { ref } from 'vue';
+import { getVideoInfo, serchVideo } from '../../api/Video.js'
+
+const formInline = ref({
+    name: ""
+})
+let list = ref([])
+const info = ref("")
+async function onSubmit() {
+    let res = await serchVideo(formInline.value.name)
+    list.value = res.data.data
+}
+let vid = "";
+const dialogFormVisible = ref(false)
+async function getinfo(id) {
+    vid = id
+    let res = await getVideoInfo(id)
+    info.value = res.data.format
+    dialogFormVisible.value = true
+}
+</script>
+
+<style lang="scss" scoped>
+.list {
+    display: flex;
+    flex-wrap: wrap;
+
+    .item {
+        width: 200px;
+        margin: 20px;
+
+        & img {
+            height: 300px;
+        }
+    }
+}
+
+.time {
+    font-size: 12px;
+    color: #999;
+}
+
+.bottom {
+    margin-top: 13px;
+    line-height: 12px;
+    display: flex;
+    justify-content: space-between;
+    align-items: center;
+}
+
+.button {
+    padding: 0;
+    min-height: auto;
+    min-width: 40px;
+}
+
+.image {
+    width: 100%;
+    display: block;
+}</style>

view/src/page/subscribe/subscribe.vue

@@ -20,14 +20,20 @@
 </script>
 
 <style lang="scss">
-.list{
+.list {
   display: flex;
   flex-wrap: wrap;
-  .item{
+
+  .item {
     width: 200px;
     margin: 20px;
+
+    & img {
+      height: 300px;
+    }
   }
 }
+
 .time {
   font-size: 12px;
   color: #999;
@@ -51,5 +57,4 @@
   width: 100%;
   display: block;
 }
-
 </style>

view/src/router/index.js

@@ -19,6 +19,11 @@ const routes = [
                 path: "subscribe",
                 name: "subscribe",
                 component:() => import ("../page/subscribe/subscribe.vue")
+            },
+            {
+                path: "addSubscribe",
+                name: "addSubscribe",
+                component:() => import ("../page/subscribe/addSubscribe.vue")
             }
         ],
         component: () => import("../page/index.vue"),