88 lines
1.7 KiB
Vue
88 lines
1.7 KiB
Vue
<template>
|
|
<div class="tvlist">
|
|
<div v-for="(item, index) in TvList" :key="index" @click="tolink(item)">
|
|
<span :class="item.id == currentId ? 's_active' : ''">{{
|
|
item.title
|
|
}}</span
|
|
><img v-if="item.id == currentId" src="/static/img/act-list.gif" />
|
|
</div>
|
|
</div>
|
|
</template>
|
|
|
|
<script>
|
|
export default {
|
|
name: "TvList",
|
|
props: {
|
|
showIcon: {
|
|
type: Boolean,
|
|
default: true,
|
|
},
|
|
showActive: {
|
|
type: Boolean,
|
|
default: true,
|
|
},
|
|
},
|
|
data() {
|
|
return {
|
|
currentId: 0,
|
|
//保存的是首页第二个包河TV接口里的数据
|
|
TvList: [],
|
|
};
|
|
},
|
|
created() {
|
|
this.getList();
|
|
this.changeStaus();
|
|
},
|
|
methods: {
|
|
changeStaus() {
|
|
let id = this.$route.query.id;
|
|
if (id != undefined) {
|
|
this.currentId = id;
|
|
}
|
|
},
|
|
//首页第二个包河TV接口
|
|
async getList() {
|
|
this.TvList = await this.$http.index.channelList({
|
|
page: this.page,
|
|
count: 20,
|
|
});
|
|
console.log(this.TvList);
|
|
},
|
|
//点击跳转带参数
|
|
tolink(item) {
|
|
uni.navigateTo({
|
|
url: `/pages/watchtv/watchtv?url=${item.play_url}&id=${item.id}`,
|
|
});
|
|
},
|
|
},
|
|
};
|
|
</script>
|
|
|
|
<style scoped lang="less">
|
|
.tvlist {
|
|
div {
|
|
height: 120rpx;
|
|
background-color: #ffffff;
|
|
display: flex;
|
|
align-items: center;
|
|
justify-content: space-between;
|
|
padding-left: 0.813rem;
|
|
padding-right: 0.36rem;
|
|
box-sizing: border-box;
|
|
border-bottom: 0.013rem solid #e5e5e5;
|
|
span {
|
|
font-family: PingFangSC-Bold;
|
|
font-size: 0.427rem;
|
|
color: #333333;
|
|
}
|
|
.s_active {
|
|
color: #d0302c !important;
|
|
}
|
|
img {
|
|
width: 27rpx;
|
|
height: 30rpx;
|
|
}
|
|
}
|
|
}
|
|
</style>
|