zhgdyunapp/pages/videoManage/playBackList.vue
2024-05-16 10:39:22 +08:00

122 lines
2.4 KiB
Vue

<template>
<view class="fullHeight">
<view class="videoBox" v-if="videoList.length>0">
<view class="videoItem" v-for="(item,index) in videoList" :key="index" @click="playVideoFn(item)">
<image v-if="item.coverUrl" class="videoPoster" :src="item.coverUrl" mode="aspectFill"></image>
<view v-else class="videoPoster">
<image src="/static/no_poster.png" class="no_poster"></image>
</view>
<view class="videoName">
{{item.name}}
</view>
</view>
</view>
<view class="placeholderBox" v-else>
<image src="/static/noData.png" class="noDataImg"></image>
<view class="text">
暂无数据
</view>
</view>
</view>
</template>
<script>
export default {
data() {
return {
videoList: [
{startTime: "2024-05-11 00:00:00", endTime: "2024-06-11 00:00:00"}
],
pageType: 'company',
pageNo: 1,
pageSize: 7,
};
},
onLoad(options) {
if (options.pageType) {
this.pageType = options.pageType
}
// this.loadData(options.sn)
this.pageNo = 1;
},
onReachBottom() {
// console.log("============================")
this.pageNo++;
uni.showLoading({
title: '加载中'
})
// this.loadData()
},
methods: {
playVideoFn(item) {
// console.log(item)
uni.setStorageSync('videoInfo', item)
// if(item.liveRadioUrl){
uni.navigateTo({
// url:'./playVideo?url='+item.liveRadioUrl,
url: 'playVideo'
})
// }
},
//获取项目视频
loadData(sn) {
var that = this
this.sendRequest({
url: "xmgl/company/getComapnyStatisticsList",
data: {
sn: sn,
videoType: 1
},
method: "POST",
success(res) {
console.log('找封面', res)
that.videoList = res.result.videoList
}
})
},
}
}
</script>
<style lang="scss" scoped>
.videoBox {
padding: 20px 10px 10px;
overflow: hidden;
}
.videoItem {
float: left;
background-color: white;
width: calc(50% - 5px);
margin-bottom: 10px;
&:nth-child(2n-1) {
margin-right: 10px;
}
.videoPoster {
height: 90px;
width: 100%;
background-color: #282828;
text-align: center;
.no_poster {
width: 55px;
height: 50px;
margin-top: 20px;
}
}
.videoName {
font-size: 14px;
color: $uni-text-color;
padding: 3px 0 8px;
width: 100%;
overflow: hidden;
white-space: nowrap;
text-overflow: ellipsis;
text-align: center;
}
}
</style>