bmy/ClassContent
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

first commit

Browse Source
This commit is contained in:
编码猿
2024-09-27 02:06:13 +08:00
commit 852d94fbb9
36760 changed files with 3274413 additions and 0 deletions
Download Patch File Download Diff File Expand all files Collapse all files

58
历届学生/吴欣阳/项目开发/上课项目/在包河Vue/src/components/Comment.vue Normal file
View File

@@ -0,0 +1,58 @@
<template>
<div class="Comment">
<div class="title">全部评论</div>
<div class="list" v-if="comment.length !=0">
评论列表
</div>
<div class="nodata" v-else>
<img src="/static/img/hm_bg_img_no.png" alt="">
<p>快来发表你的评论吧</p>
</div>
</div>
</template>
<script>
export default {
name: "Comment",
data() {
return {}
},
props: {
comment: {
type: Array,
default: () => []
}
},
created() {
},
methods: {}
}
</script>
<style scoped lang="less">
.Comment {
.title {
height: 1.347rem;
background-color: #ffffff;
font-size: 0.427rem;
color: #333333;
line-height: 1.347rem;
padding: 0 0.32rem;
box-sizing: border-box;
margin-bottom: 0.6rem;
}
.nodata {
text-align: center;
img {
width: 5.56rem;
height: 4.653rem;
margin-bottom: 0.68rem;
}
p {
font-size: 0.373rem;
color: #999999;
}
}
}
</style>

65
历届学生/吴欣阳/项目开发/上课项目/在包河Vue/src/components/Header.vue Normal file
View File

@@ -0,0 +1,65 @@
<template>
<div class="Header">
<div class="left">
<img class="logo" src="/static/img/icon/gw_img_logo.png" alt="">
<img class="logo_text" src="/static/img/icon/logo_text_icon.png" alt="">
</div>
<div class="open">打开</div>
</div>
</template>
<script>
export default {
name: "Header",
data() {
return {}
},
created() {
},
methods: {}
}
</script>
<style scoped lang="less">
.Header {
position: fixed;
left: 0;
right: 0;
top: 0;
width: 100%;
height: 1.333rem;
background-color: #000000;
display: flex;
align-items: center;
justify-content: space-between;
padding: 0 0.32rem;
box-sizing: border-box;
opacity: 0.7;
z-index: 999;
.left {
display: flex;
align-items: center;
.logo {
width: 0.867rem;
height: 0.867rem;
}
.logo_text {
width: 1.76rem;
height: 0.613rem;
margin-left: 0.253rem;
}
}
.open {
width: 1.92rem;
height: 0.693rem;
background-color: #d0302c;
border-radius: 0.107rem;
text-align: center;
line-height: 0.693rem;
font-size: 0.32rem;
color: #ffffff;
}
}
</style>

113
历届学生/吴欣阳/项目开发/上课项目/在包河Vue/src/components/HelloWorld.vue Normal file
View File

@@ -0,0 +1,113 @@
<template>
<div class="hello">
<h1>{{ msg }}</h1>
<h2>Essential Links</h2>
<ul>
<li>
<a
href="https://vuejs.org"
target="_blank"
>
Core Docs
</a>
</li>
<li>
<a
href="https://forum.vuejs.org"
target="_blank"
>
Forum
</a>
</li>
<li>
<a
href="https://chat.vuejs.org"
target="_blank"
>
Community Chat
</a>
</li>
<li>
<a
href="https://twitter.com/vuejs"
target="_blank"
>
Twitter
</a>
</li>
<br>
<li>
<a
href="http://vuejs-templates.github.io/webpack/"
target="_blank"
>
Docs for This Template
</a>
</li>
</ul>
<h2>Ecosystem</h2>
<ul>
<li>
<a
href="http://router.vuejs.org/"
target="_blank"
>
vue-router
</a>
</li>
<li>
<a
href="http://vuex.vuejs.org/"
target="_blank"
>
vuex
</a>
</li>
<li>
<a
href="http://vue-loader.vuejs.org/"
target="_blank"
>
vue-loader
</a>
</li>
<li>
<a
href="https://github.com/vuejs/awesome-vue"
target="_blank"
>
awesome-vue
</a>
</li>
</ul>
</div>
</template>
<script>
export default {
name: 'HelloWorld',
data () {
return {
msg: 'Welcome to Your Vue.js App'
}
}
}
</script>
<!-- Add "scoped" attribute to limit CSS to this component only -->
<style scoped>
h1, h2 {
font-weight: normal;
}
ul {
list-style-type: none;
padding: 0;
}
li {
display: inline-block;
margin: 0 10px;
}
a {
color: #42b983;
}
</style>

22
历届学生/吴欣阳/项目开发/上课项目/在包河Vue/src/components/Live.vue Normal file
View File

@@ -0,0 +1,22 @@
<template>
<div class="Live">
融媒直播
</div>
</template>
<script>
export default {
name: "Live",
data() {
return {}
},
created() {
},
methods: {}
}
</script>
<style scoped>
</style>

199
历届学生/吴欣阳/项目开发/上课项目/在包河Vue/src/components/Radio.vue Normal file
View File

@@ -0,0 +1,199 @@
<template>
<div class="Radio">
<hls-video ref="hlsVideo" :url="source" v-show="false"></hls-video>
<h2>{{ radioList.title }}</h2>
<img class="logo" width="100" :src="radioList.frontcover" alt="">
<img class="progress" :src="currentVideoStatus ? '/static/img/sound_spectrum.gif' : '/static/img/sound_spectrum.png'" alt="">
<div class="play_action">
<div class="refresh" @click="refresh">
<img src="/static/img/icon/live_broadcast_icon.png" alt="">
<div>当前直播</div>
</div>
<img class="play" @click="changeVideo"
:src=" currentVideoStatus ? '/static/img/radio_stop.png' : '/static/img/radio_up.png' " alt="">
<div class="menu" @click="getMenuList">
<img class="menu" src="/static/img/icon/program_list_icon.png" alt="">
<div>节目列表</div>
</div>
</div>
<van-popup v-model="isShowMenu"
class="list"
position="bottom"
:style="{ height: '70%' }">
<div class="title">节目单</div>
<ul>
<li v-for="(item,index) in MenuList"
@click="changeMp3(index)"
:key="index">
<div class="left">
<div class="list_name">{{ item.menu_name }}</div>
<div class="list_muse_name">{{ item.nick_name }}</div>
<img v-if="index == showGifIndex" class="gif" src="/static/img/act-list.gif" alt="">
</div>
<div class="time">{{ item.start_time }} - {{ item.end_time }}</div>
</li>
</ul>
</van-popup>
</div>
</template>
<script>
export default {
name: "Radio",
data() {
return {
radioList: {}, // 请求到的radio数据
source: [], // 视频播放地址
currentVideoStatus: false, // 当前视频的播放状态
isShowMenu: false, // 控制更多界面弹窗的显示
MenuList: [],
showGifIndex: 0
}
},
created() {
this.getRadio()
},
methods: {
changeMp3(index) {
this.showGifIndex = index
console.log(this.MenuList[this.showGifIndex])
this.source = [
{ type: "video/mp4", src: this.MenuList[this.showGifIndex].play_url}
];
this.isShowMenu = false
},
async getMenuList() {
this.MenuList = await this.$http.index.MenuList();
console.log(this.MenuList)
this.isShowMenu = true
},
refresh() {
this.$router.go(0)
},
changeVideo() {
if (this.currentVideoStatus) {
this.currentVideoStatus = false
this.$refs.hlsVideo.onPlayerPause()
} else {
this.currentVideoStatus = true
this.$refs.hlsVideo.onPlayerPlay()
}
},
async getRadio() {
this.radioList = await this.$http.index.radio();
this.source = [
{
type: "application/x-mpegURL",
src: this.radioList.play_url
}
];
}
}
}
</script>
<style scoped lang="less">
.Radio {
width: 7.48rem;
margin: 0 auto;
.list {
.title {
font-size: .37rem;
font-weight: 500;
color: #000;
text-align: center;
border-bottom: .01rem solid #ccc;
line-height: 1.6rem;
}
ul {
li {
display: flex;
justify-content: space-between;
align-items: center;
padding: 0 .39rem;
border-bottom: .01rem solid #ccc;
.left {
position: relative;
.list_name{
font-size: .37rem;
color: #000;
}
.list_muse_name {
margin-top: .27rem;
font-size: .32rem;
color: #999;
}
.gif {
position: absolute;
right: -26px;
width: 0.37rem;
height: 0.39rem;
margin-left: 0.57rem;
top: 50%;
transform: translateY(-50%);
}
}
.time {
font-size: .37rem;
color: #000;
line-height: 1.6rem;
}
}
}
}
h2 {
font-size: 0.48rem;
color: #000000;
margin-bottom: 0.84rem;
text-align: center;
margin-top: 1.347rem;
}
.logo {
width: 7.467rem;
height: 7.467rem;
margin-bottom: 0.667rem;
}
.progress {
width: 100%;
height: 1.2rem;
margin-bottom: 0.733rem;
}
.play_action {
display: flex;
align-items: center;
justify-content: space-between;
.refresh {
text-align: center;
img {
width: 0.52rem;
height: 0.52rem;
}
div {
font-size: 0.267rem;
color: #999999;
}
}
.play {
width: 1.6rem;
height: 1.6rem;
}
.menu {
text-align: center;
img {
width: 0.587rem;
height: 0.52rem;
}
div {
font-size: 0.267rem;
color: #999999;
}
}
}
}
</style>

23
历届学生/吴欣阳/项目开发/上课项目/在包河Vue/src/components/Tv.vue Normal file
View File

@@ -0,0 +1,23 @@
<template>
<div class="Tv">
<tv-item></tv-item>
</div>
</template>
<script>
export default {
name: "Tv",
data() {
return {}
},
created() {
},
methods: {}
}
</script>
<style scoped>
</style>

79
历届学生/吴欣阳/项目开发/上课项目/在包河Vue/src/components/TvItem.vue Normal file
View File

@@ -0,0 +1,79 @@
<template>
<div class="TvItem">
<ul>
<li @click="enterTvInfo(item)" v-for="(item,index) in ChannelList" :key="index">
<span>{{ item.title }}</span>
<img v-if="
isShow
? item.id == $route.query.id
: ''
" src="/static/img/act-list.gif" alt="">
</li>
</ul>
</div>
</template>
<script>
export default {
name: "TvItem",
data() {
return {
page: 1,
ChannelList: []
}
},
props: {
isShow: {
type: Boolean,
default: false
}
},
created() {
console.log(this.$route.query)
this.getChannelList()
},
methods: {
enterTvInfo(item) {
this.$router.push({
name: 'TvInfo',
query: {
id: item.id,
url: item.play_url,
t: Date.now()
}
})
},
async getChannelList() {
this.ChannelList = await this.$http.index.channelList({
page: this.page,
count: 15
});
console.log(this.ChannelList)
}
}
}
</script>
<style scoped lang="less">
.TvItem {
ul {
li {
display: flex;
align-items: center;
justify-content: space-between;
height: 1.6rem;
padding: 0 0.813rem;
box-sizing: border-box;
border-bottom: 1px solid #e5e5e5;
span {
font-size: 0.427rem;
color: #333333;
}
img {
width: 0.36rem;
height: 0.4rem;
}
}
}
}
</style>

80
历届学生/吴欣阳/项目开发/上课项目/在包河Vue/src/components/video.vue Normal file
View File

@@ -0,0 +1,80 @@
<template>
<div class="video">
<video-player class="video-player-box"
ref="videoPlayer"
:options="playerOptions"
:playsinline="true"
customEventName="customstatechangedeventname">
</video-player>
</div>
</template>
<script>
export default {
data() {
return {
playerOptions: {
playbackRates: [0.5, 1.0, 1.5, 2.0],
autoplay: false,
muted: false,
loop: false,
preload: "none",
language: "zh-CN",
aspectRatio: "16:9",
fluid: false,
poster: "",
sources: [],
notSupportedMessage: "此视频暂无法播放，请稍后再试",
controlBar: {
// 当前时间和总时间的 分隔符
timeDivider: true,
//当前播放时间
currentTimeDisplay: true,
// 总时间
durationDisplay: true,
/**
* 区分 currentTimeDisplay,timeDivider,durationDisplay
* remainingTimeDisplay显示默认样式，只显示当前播放时间，一般
* 为false
*/
remainingTimeDisplay: false,
fullscreenToggle: true,
},
}
}
},
watch: {
url(newVal,oldVal) {
this.playerOptions.sources = newVal;
}
},
props: {
url: {
type: Array,
default: () => []
}
},
created() {
this.playerOptions.sources = this.url;
},
mounted() {
},
methods: {
async onPlayerPlay(event) {
console.log("onPlayerPlay: ", this.$refs.videoPlayer)
await this.$refs.videoPlayer.player.play()
},
async onPlayerPause(event) {
console.log("onPlayerPause: ", this.$refs.videoPlayer)
await this.$refs.videoPlayer.player.pause()
},
}
}
</script>
<style scoped>
</style>