You can not select more than 25 topics
Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
119 lines
2.4 KiB
119 lines
2.4 KiB
<template>
|
|
<view class="container-main">
|
|
<view class="list">
|
|
<view class="list-item" v-for="item in list" :key="item.id" @click="getInfo(item.url)">
|
|
<view class="item-title">{{item.title}}</view>
|
|
<view class="data-row">
|
|
<view class="data-lable">创建人:</view>
|
|
<view class="data-value">{{item.createBy}}</view>
|
|
</view>
|
|
<view class="data-row">
|
|
<view class="data-lable">创建时间:</view>
|
|
<view class="data-value">{{item.createTime}}</view>
|
|
</view>
|
|
</view>
|
|
<u-loadmore :status="status" :load-text="loadText" />
|
|
</view>
|
|
</view>
|
|
</template>
|
|
|
|
<script>
|
|
import {
|
|
getList
|
|
} from '@/api/shianliaoning/video.js'
|
|
export default {
|
|
data() {
|
|
return {
|
|
status: "nomore",
|
|
loadText: {
|
|
loading: "努力加载中",
|
|
nomore: "已经到底了~",
|
|
},
|
|
list: [],
|
|
queryParams: {
|
|
pageNum: 1,
|
|
pageSize: 10
|
|
}
|
|
}
|
|
},
|
|
onLoad() {
|
|
this.getList()
|
|
},
|
|
onReachBottom() {
|
|
if (this.queryParams.pageNum < this.total) {
|
|
if (this.status == 'loading') return
|
|
this.queryParams.pageNum = this.queryParams.pageNum + 1;
|
|
this.getList()
|
|
}
|
|
},
|
|
methods: {
|
|
getInfo(url) {
|
|
uni.navigateTo({
|
|
url: `/sub-interaction/online-video/info?url=${url}`
|
|
})
|
|
},
|
|
getList() {
|
|
this.status = 'loading'
|
|
getList(this.queryParams).then(res => {
|
|
this.list = [...this.list, ...res.rows];
|
|
this.total = Math.ceil(res.total / this.queryParams.pageSize) || 1;
|
|
this.status = 'nomore'
|
|
})
|
|
}
|
|
},
|
|
}
|
|
</script>
|
|
|
|
<style lang="scss" scoped>
|
|
.list {
|
|
box-sizing: border-box;
|
|
padding: 20rpx;
|
|
|
|
&>.list-item {
|
|
min-height: 20rpx;
|
|
background: #FFFFFF;
|
|
border-radius: 16rpx;
|
|
margin-bottom: 20rpx;
|
|
box-sizing: border-box;
|
|
padding: 20rpx;
|
|
|
|
.item-title {
|
|
font-size: 30rpx;
|
|
font-weight: 550;
|
|
text-overflow: ellipsis;
|
|
overflow: hidden;
|
|
word-break: break-all;
|
|
white-space: nowrap;
|
|
}
|
|
|
|
.data-row {
|
|
margin-top: 20rpx;
|
|
display: flex;
|
|
align-items: center;
|
|
|
|
.data-lable {
|
|
width: 130rpx;
|
|
font-size: 28rpx;
|
|
font-weight: 400;
|
|
color: #9DA2AB;
|
|
}
|
|
|
|
.data-value {
|
|
flex: 1;
|
|
font-size: 28rpx;
|
|
font-weight: 400;
|
|
color: #34373B;
|
|
box-sizing: border-box;
|
|
padding-left: 20rpx;
|
|
overflow: hidden;
|
|
white-space: nowrap;
|
|
text-overflow: ellipsis;
|
|
}
|
|
}
|
|
}
|
|
|
|
.list-item:active {
|
|
background-color: rgba(196, 204, 216, 0.2);
|
|
}
|
|
}
|
|
</style> |