diff --git a/vueHomilyLink/src/api/ChannelApi.js b/vueHomilyLink/src/api/ChannelApi.js index 01eb145..acfb155 100644 --- a/vueHomilyLink/src/api/ChannelApi.js +++ b/vueHomilyLink/src/api/ChannelApi.js @@ -7,7 +7,7 @@ const ChannelApi = { }, //获取shows列表 getShows(Id,UserId,FlagType){ - return service.get('/channel',{Id,UserId,FlagType}); + return service.post('/channel',{Id,UserId,FlagType}); }, //订阅状态 subscribe(Id,UserId){ diff --git a/vueHomilyLink/src/api/index.js b/vueHomilyLink/src/api/index.js index a388e65..a6ba51f 100644 --- a/vueHomilyLink/src/api/index.js +++ b/vueHomilyLink/src/api/index.js @@ -1,9 +1,11 @@ import axios from "axios"; const service = axios.create({ - baseURL: 'http://localhost:8080', + // baseURL: 'http://192.168.8.191:8080', + // baseURL: 'http://localhost:8080', + baseURL: '/api', }); - +// http://192.168.8.191:8080 //Axios的响应拦截器.. service.interceptors.response.use(resp => { diff --git a/vueHomilyLink/src/views/ChannelView.vue b/vueHomilyLink/src/views/ChannelView.vue index bac02d0..dd62036 100644 --- a/vueHomilyLink/src/views/ChannelView.vue +++ b/vueHomilyLink/src/views/ChannelView.vue @@ -2,36 +2,13 @@ import Nav from '@/components/Nav.vue'; import { computed, ref } from 'vue'; import router from '@/router'; +import ChannelApi from '@/api/ChannelApi'; //频道列表 - const channelList = ref([]); -function getChannel() { - //查询频道列表api - channelList.value = ([ - { - id: 1, - image: "https://d31zlh4on95l9h.cloudfront.net/images/52ea7786d329493ea43791533e17ba66.png", - name: "量价时空四维预测术", - // 订阅数量 - subscriptionCount: 60, - backgroundImage: "https://d31zlh4on95l9h.cloudfront.net/images/148gntohb80czrcs8ykqfkq1yhuplalr.jpg", - status: 1 - }, - { - id:2, - image:"https://d31zlh4on95l9h.cloudfront.net/images/52ea7786d329493ea43791533e17ba66.png", - name:"时空四维预测术", - // 订阅数量 - subscriptionCount:60, - backgroundImage:"https://d31zlh4on95l9h.cloudfront.net/images/148gntohb80czrcs8ykqfkq1yhuplalr.jpg", - status:0 - } - ]); -} -getChannel(); - - +//视频上的导航栏 +const currentTab = ref('all'); +const flagType = ref(null); //频道 //默认信息 const channel = ref({ @@ -41,26 +18,26 @@ const channel = ref({ // 订阅数量 subscriptionCount: 60, backgroundImage: "https://d31zlh4on95l9h.cloudfront.net/images/148gntohb80czrcs8ykqfkq1yhuplalr.jpg", - status: 1 }); -//加载频道信息 -function loadChannels(channelId) { - channelList.value.forEach(ch =>{ - if(ch.id == channelId){ - channel.value = ch; - } - }); +//1-左侧导航栏加载 +function getChannels() { + //查询频道列表api + ChannelApi.getchannels().then((result) =>{ + console.log(result.data); + channelList.value = result.data; + console.log("++++",channelList.value); + }) + } -// loadChannels(); +getChannels(); + function toLink(channelId) { router.push({ path: '/channel', query: { id: channelId } }); - loadChannels(channelId); - loadShows(); + loadShows(channelId,flagType); + console.log("flga",flagType.value); } -//视频上的导航栏 -const currentTab = ref('all'); -const flagType = ref(null); + function changeTab(tab, flagType) { currentTab.value = tab; @@ -70,116 +47,48 @@ function changeTab(tab, flagType) { // 展示列表1 const shows = ref([]); // 加载展示列表 -function loadShows(flagType) { +function loadShows(channleId,flagType) { //shows查询api,根据id,userId - shows.value = ([ - { - id: 3, - cover: " https://d31zlh4on95l9h.cloudfront.net/images/5iujax01000d5j9gzh9bvhrgq0hb5t0q.jpg", - name: "联合利剑！五大机器人史诗升级", - user: { - id: 1, - username: "HomilyLink", - avatar: "https://d31zlh4on95l9h.cloudfront.net/images/1y9yuf0myv0cyno4wstwr368e0wbi9on.jpg", - }, - releaseTime: "2024-05-26 11:42:00", - // 视频时长 - videoDuration: "01:22:11", - // 观看数量 - viewCount: 796, - comments: 1, - likes: 10, - // 内容标识类型,图文还是视频 - flagType: 1, - - - }, - { - id: 4, - cover: "https://d31zlh4on95l9h.cloudfront.net/images/5iujau01000d5gniid28ddecu026a4y7.jpg", - name: "壁垒将至？中美博弈开启拼刺刀白热化阶段", - user: { - id: 1, - username: "HomilyLink", - avatar: "https://d31zlh4on95l9h.cloudfront.net/images/1y9yuf0myv0cyno4wstwr368e0wbi9on.jpg", - }, - releaseTime: "2024-01-24 09:55:00", - // 视频时长 - videoDuration: "03:56:00", - // 观看数量 - viewCount: "594", - comments: 50, - likes: 16, - // 内容标识类型,图文还是视频 - flagType: 1, - club: { - id: 1, - image: "https://d31zlh4on95l9h.cloudfront.net/default/1y9yuf08kg0cydno200zqtu17zi4gwwv.png", - name: "博股俱乐部", - introduction: "博股国际投资论坛(BoguIntemational InvestmentForum)立足中国，面向全球。聚集了国际政要、投资大师、经济学家和高端投资人士。该论坛旨在为一小部分高投资人士提供深度学习，解读国际经济形势，井研判经济发展机遇。博股会员是博股国际投资论坛的终身会员，我们注重知识体系的深度，与大师为伍，强调价值投资，并利用大波设进行盈利。", - backgroundImage: "" - }, - channel: { - id: 1, - image: "https://d31zlh4on95l9h.cloudfront.net/images/52ea7786d329493ea43791533e17ba66.png", - name: "量价时空四维预测术", - // 订阅数量 - subscriptionCount: 60, - backgroundImage: "https://d31zlh4on95l9h.cloudfront.net/images/148gntohb80czrcs8ykqfkq1yhuplalr.jpg" - } - - }, - { - id: 5, - cover: "https://d31zlh4on95l9h.cloudfront.net/images/5iujau01000d5gniid28ddecu026a4y7.jpg", - name: "壁垒将至？中美博弈开启拼刺刀白热化阶段", - user: { - id: 1, - username: "HomilyLink", - avatar: "https://d31zlh4on95l9h.cloudfront.net/images/1y9yuf0myv0cyno4wstwr368e0wbi9on.jpg", - password: "123456", - }, - releaseTime: "2024-01-24 09:55:00", - // 视频时长 - videoDurition: "03:56:00", - // 观看数量 - viewCount: "594", - comments: 50, - likes: 16, - // 内容标识类型,图文还是视频 - flagType: 0, - club: { - id: 1, - image: "https://d31zlh4on95l9h.cloudfront.net/default/1y9yuf08kg0cydno200zqtu17zi4gwwv.png", - name: "博股俱乐部", - introduction: "博股国际投资论坛(BoguIntemational InvestmentForum)立足中国，面向全球。聚集了国际政要、投资大师、经济学家和高端投资人士。该论坛旨在为一小部分高投资人士提供深度学习，解读国际经济形势，井研判经济发展机遇。博股会员是博股国际投资论坛的终身会员，我们注重知识体系的深度，与大师为伍，强调价值投资，并利用大波设进行盈利。", - backgroundImage: "" - }, - channel: { - id: 1, - image: "https://d31zlh4on95l9h.cloudfront.net/images/52ea7786d329493ea43791533e17ba66.png", - name: "量价时空四维预测术", - // 订阅数量 - subscriptionCount: 60, - backgroundImage: "https://d31zlh4on95l9h.cloudfront.net/images/148gntohb80czrcs8ykqfkq1yhuplalr.jpg" - } - - } - ]) - + ChannelApi.getShows(channleId,90000000,flagType.value).then((result)=>{ + console.log(result.data) + channel.value = result.data.channel; + + console.log("频道",channel.value) + shows.value = result.data.shows; + console.log("视频",shows.value); + + }) } -loadShows(flagType); +loadShows(channel.value.id,flagType); //订阅 -function submit() { - //修改状态，editapi -} +function submit(channelId) { + console.log("频道id",channelId); + ChannelApi.subscribe(channelId,90000000).then((result)=>{ + if(result && result.success){ + alert('订阅成功！'); + loadShows(channelId); + }else{ + alert('订阅失败！'); + } + }) +} +function unsubmit(channelId){ + console.log("取消频道id",channelId); + ChannelApi.unSubscribe(channelId,90000000).then((result) =>{ + if(result && result.success){ + alert('取消订阅成功！'); + loadShows(channelId); + } + }) +} // function buttonActive(){ // } // buttonActive(); +