125 lines
2.4 KiB
Vue
125 lines
2.4 KiB
Vue
<script setup>
|
|
// 推流的用户
|
|
import {
|
|
ref,
|
|
reactive,
|
|
} from 'vue';
|
|
import {
|
|
onLoad,
|
|
onReachBottom,
|
|
onPullDownRefresh,
|
|
} from '@dcloudio/uni-app'
|
|
// 工具库
|
|
import util from '@/common/js/util';
|
|
// api请求体
|
|
import api from '@/api/index'
|
|
// 列表
|
|
const list = reactive({
|
|
pageSize: 20,
|
|
pageNum: 1,
|
|
data: [],
|
|
total: 0,
|
|
})
|
|
// 推流id
|
|
const pushId = ref('')
|
|
|
|
onLoad((option) => {
|
|
// 推流id
|
|
if (option.pushId) pushId.value = option.pushId
|
|
// 获取列表
|
|
getList()
|
|
})
|
|
|
|
onReachBottom(() => {
|
|
// 获取更多列表
|
|
getMoreList()
|
|
})
|
|
|
|
onPullDownRefresh(() => {
|
|
// 重载当前列表
|
|
refreshList()
|
|
})
|
|
|
|
// 重载当前列表
|
|
function refreshList() {
|
|
list.pageNum = 1
|
|
getList()
|
|
}
|
|
|
|
// 获取更多列表
|
|
function getMoreList() {
|
|
if (list.data.length >= list.total) return
|
|
list.pageNum++
|
|
getList()
|
|
}
|
|
|
|
// 获取列表
|
|
function getList() {
|
|
api.video.getVideoPushUsers({
|
|
query: {
|
|
pageSize: list.pageSize,
|
|
pageNum: list.pageNum,
|
|
videoStreamId: pushId.value,
|
|
}
|
|
}).then(rs => {
|
|
if (rs.code == 200) {
|
|
if (list.pageNum == 1) list.data.length = 0
|
|
list.data.push(...rs.rows.map(item => {
|
|
item.formatUserNickname = formatUsername(item.userName)
|
|
return item
|
|
}))
|
|
list.total = rs.total
|
|
return
|
|
}
|
|
util.alert({
|
|
content: rs.msg,
|
|
showCancel: false,
|
|
})
|
|
}).finally(() => {
|
|
// 停止下拉刷新
|
|
uni.stopPullDownRefresh()
|
|
})
|
|
}
|
|
|
|
/**
|
|
* 处理用户名
|
|
* @param {Object} username 用户名
|
|
*/
|
|
function formatUsername(username) {
|
|
if (username.length <= 1) {
|
|
return username;
|
|
}
|
|
// 截取第一个字
|
|
const firstChar = username.charAt(0);
|
|
// 匹配并替换剩余字符
|
|
const maskedPart = '*'.repeat(username.length - 1);
|
|
return firstChar + maskedPart;
|
|
}
|
|
</script>
|
|
|
|
<template>
|
|
<view class="appbw">
|
|
<view class="listBox ptb30 plr30">
|
|
<view class="list rows ptb30 plr10" v-for="(item,index) in list.data" :key="index">
|
|
<view class="avatar">
|
|
<image class="wh100 cir" :src="item.avatatUrl" mode="aspectFill" />
|
|
</view>
|
|
<view class="f1 ml20">
|
|
<view class="name t2hd c333 f32">{{item.formatUserNickname}} 查看了你推广的内容</view>
|
|
<view class="time mt10 c999 f28">{{item.createTime}}</view>
|
|
</view>
|
|
</view>
|
|
</view>
|
|
</view>
|
|
</template>
|
|
|
|
<style lang="scss">
|
|
//
|
|
.listBox {
|
|
|
|
// 列表
|
|
.list+.list {
|
|
border-top: 2rpx solid #eee;
|
|
}
|
|
}
|
|
</style> |