165 lines
3.6 KiB
Vue
165 lines
3.6 KiB
Vue
<template>
|
||
<view class="pageFree">
|
||
<view class="pageHeader">
|
||
<view class="native" @click="pageBack">
|
||
<!-- <image src="https://wx.yaohe.hnjrdzkj.xyz/static/wechat/static/page_back.png"></image> -->
|
||
<image src="https://wx.yaohe.hnjrdzkj.xyz/static/wechat/static/page_back.png"></image>
|
||
</view>
|
||
<view class="headerText">最新短剧</view>
|
||
<view class="texts">你想看的都在这里～</view>
|
||
</view>
|
||
<view class="videoBox">
|
||
<view class="videoList">
|
||
<view class="videoItem" @click="detail(item.id,0)" v-for="(item,index) in pageListData" :key="item.id">
|
||
<image class="videoImg" :src="item.img"></image>
|
||
<view class="videoName">{{item.name}}</view>
|
||
<view class="videoText">{{item.story}}</view>
|
||
</view>
|
||
</view>
|
||
</view>
|
||
<uni-load-more :status="status" :content-text="contentText" />
|
||
</view>
|
||
</template>
|
||
|
||
<script >
|
||
export default {
|
||
|
||
data(){
|
||
return{
|
||
keytext:'',
|
||
pageData:{
|
||
currentPage:1,
|
||
page:1,
|
||
pageSize:15,
|
||
},
|
||
contentText: {
|
||
contentdown: '上拉加载更多',
|
||
contentrefresh: '加载中',
|
||
contentnomore: '没有数据了'
|
||
},
|
||
pageListData:[],
|
||
}
|
||
},
|
||
mounted() {
|
||
this.getListData();
|
||
},
|
||
|
||
onReachBottom() {
|
||
if(this.pageData.currentPage>=this.pageData.page){
|
||
this.getListData();
|
||
}
|
||
|
||
},
|
||
methods:{
|
||
pageBack(){
|
||
uni.navigateBack();
|
||
},
|
||
getListData(){
|
||
let that = this;
|
||
that.$httpRequest({
|
||
url: '/api/video/lists',
|
||
data: {
|
||
limit:this.pageData.pageSize,
|
||
},
|
||
}).then(res=>{
|
||
if(this.pageData.page ==1){
|
||
if(res.rows.length>0){
|
||
this.pageListData = res.rows;
|
||
this.currentPage = Math.ceil(res.total/this.pageData.pageSize);
|
||
}else{
|
||
this.contentText.contentdown='没有数据'
|
||
}
|
||
}else{
|
||
this.pageListData = this.pageListData.concat(res.rows);
|
||
}
|
||
this.pageData.page+=1;
|
||
})
|
||
},
|
||
detail(vid,mid){
|
||
var fxpid=1
|
||
if(uni.getStorageSync("userinfo")){
|
||
fxpid=uni.getStorageSync("userinfo").id
|
||
}
|
||
uni.navigateTo({
|
||
url:'/pages/client/tuan/detail?vid='+vid+'&mid='+mid+'&fxpid='+fxpid
|
||
})
|
||
},
|
||
}
|
||
}
|
||
|
||
</script>
|
||
|
||
<style scoped>
|
||
@font-face {
|
||
font-family: "MyFont";
|
||
src: url('https://wx.yaohe.hnjrdzkj.xyz/assets/fonts/ZiTiaoZiChangGuDan-Shan-ChaoHei.ttf');
|
||
}
|
||
.pageHeader {
|
||
height: 285rpx;
|
||
width: 100%;
|
||
background-image: url("https://wx.yaohe.hnjrdzkj.xyz/static/wechat/static/banners.png");
|
||
background-repeat: no-repeat;
|
||
background-size: cover;
|
||
}
|
||
|
||
.native {
|
||
padding-top: 100rpx;
|
||
padding-left: 20rpx;
|
||
}
|
||
.native image{
|
||
width: 40rpx;
|
||
height: 40rpx;
|
||
}
|
||
.headerText{
|
||
font-family: 'MyFont';
|
||
font-size: 42rpx;
|
||
padding-left: 55rpx;
|
||
padding-top: 20rpx;
|
||
}
|
||
.texts{
|
||
font-size: 24rpx;
|
||
padding-left: 55rpx;
|
||
}
|
||
.videoBox{
|
||
background-color: #ffffff;
|
||
border-radius: 28rpx 28rpx 0 0;
|
||
margin-top: -30rpx;
|
||
padding: 20rpx;
|
||
}
|
||
.videoList{
|
||
display: flex;
|
||
align-items: center;
|
||
/* justify-content: space-around; */
|
||
flex-wrap: wrap;
|
||
}
|
||
.videoItem{
|
||
width: 33.3333%;
|
||
padding-bottom: 20rpx;
|
||
padding-right: 30rpx;
|
||
}
|
||
.videoImg{
|
||
height: 280rpx;
|
||
width: 100%;
|
||
border-radius: 12rpx;
|
||
}
|
||
.videoName{
|
||
color: #333333;
|
||
font-size: 24rpx;
|
||
font-weight: 500;
|
||
line-height: 45rpx;
|
||
width: 100%;
|
||
overflow: hidden;
|
||
white-space: nowrap;
|
||
text-overflow: ellipsis;
|
||
}
|
||
.videoText{
|
||
color: #999999;
|
||
line-height: 35rpx;
|
||
font-size: 22rpx;
|
||
width: 100%;
|
||
overflow: hidden;
|
||
white-space: nowrap;
|
||
text-overflow: ellipsis;
|
||
}
|
||
|
||
</style> |