JavaWeb/biliob
2
0
Fork 0
Code Issues Pull Requests Projects Releases Wiki Activity

完善web一些功能

Browse Source
This commit is contained in:
zlzw
2024-11-27 17:39:02 +08:00
parent 48a15c8769
commit e8cceef419
12 changed files with 647 additions and 143 deletions
Download Patch File Download Diff File Expand all files Collapse all files

65
Web/html/body/live.html
View File

@@ -15,7 +15,9 @@
<script type="text/html" id="toolbarDemo">
<div class="layui-btn-container">
<button class="layui-btn layui-btn-sm" onclick="createRoom()">添加新房间</button>
<button class="layui-btn layui-btn-sm" lay-event="getCheckData">获取选中行数据</button>
<button class="layui-btn layui-btn-sm" lay-event="editArray">批量编辑</button>
<button class="layui-btn layui-btn-sm" lay-event="deleteArray">批量删除</button>
<button class="layui-btn layui-btn-sm layui-bg-red" lay-event="deleteAll">全部删除</button>
</div>
</script>
<script type="text/html" id="toolDemo">
@@ -46,6 +48,15 @@
});
}
function editArrayRoom(array) {
layer.open({
type: 2,
title: "批量编辑",
area: ['600px', '500px'],
content: '/html/ui/createConfig.html?array=' + array
});
}
</script>
<script>
layui.use(['table', 'dropdown'], function () {
@@ -105,10 +116,56 @@
var id = obj.config.id;
var checkStatus = table.checkStatus(id);
var othis = lay(this);
var data = checkStatus.data;
var array = data.map(function (item) {
return item.live_room_id
})
var arrayName = data.map(function (item) {
return item.anchorName
})
switch (obj.event) {
case 'getCheckData':
var data = checkStatus.data;
layer.alert(layui.util.escape(JSON.stringify(data)));
case 'deleteArray':
if (array.length === 0) {
layer.msg('没有数据', { icon: 2 })
return
}
layer.confirm('确定删除 ' + arrayName + "?", { icon: 3 }, function () {
var loadIndex = showLoadingDialog();
deleteArrayRoomConfig(array)
.then(json => {
layer.close(loadIndex)
layer.msg(json.data, { icon: 1 });
table.reloadData('roomList', {}, false)
})
}, function () {
});
break;
case 'editArray':
if (array.length === 0) {
layer.msg('没有数据', { icon: 2 })
return
}
editArrayRoom(array)
break;
case 'deleteAll':
layer.confirm('确定删除所有配置?', { icon: 3 }, function () {
var loadIndex = showLoadingDialog();
deleteAllRoomConfig()
.then(json => {
layer.close(loadIndex)
if (json.status === -1) {
layer.msg(json.message, { icon: 2 });
} else {
layer.msg(json.data, { icon: 1 });
}
table.reloadData('roomList', {}, false)
})
}, function () {
});
break;
};
});

57
Web/html/body/user.html
View File

@@ -24,7 +24,11 @@
<script type="text/html" id="toolDemo">
<div class="layui-clear-space">
<a class="layui-btn layui-btn-xs" lay-event="del">删除</a>
<a class="layui-btn layui-btn-xs" lay-event="input">导入关注</a>
<!-- <a class="layui-btn layui-btn-xs" lay-event="input">导入关注</a> -->
<a class="layui-btn layui-btn-xs" lay-event="more">
导入
<i class="layui-icon layui-icon-down"></i>
</a>
</div>
</script>
<script>
@@ -143,8 +147,28 @@
var checkStatus = table.checkStatus(id);
var othis = lay(this);
switch (obj.event) {
case 'input':
onClickInput(data.uid)
case 'more':
dropdown.render({
elem: this, // 触发事件的 DOM 对象
show: true, // 外部事件触发即显示
data: [{
title: '关注列表',
id: 'follow'
}, {
title: '正在开播',
id: 'live'
}],
click: function (menudata) {
if (menudata.id === 'follow') {
onClickInput(data.uid)
} else if (menudata.id === 'live') {
onClickFollow(data.uid)
}
},
align: 'right', // 右对齐弹出
style: 'box-shadow: 1px 1px 10px rgb(0 0 0 / 12%);' // 设置额外样式
})
break;
};
});
@@ -172,10 +196,33 @@
window.location.href = url.toString();
}
});
}
function onClickFollow(uid) {
layer.open({
type: 2, // page 层类型
area: ['650px', '400px'],
title: '选择主播',
shade: 0.6, // 遮罩透明度
shadeClose: false, // 点击遮罩区域，关闭弹层
maxmin: true, // 允许全屏最小化
anim: 1, // 0-6 的动画形式，-1 不开启
// btn: ['确定', '取消'],
content: '/html/ui/userFollowLive.html?uid=' + uid,
yes: function (index, layero) {
var iframeWin = window[layero.find('iframe')[0]['name']];
var anchorRoomId = iframeWin.$('#anchorRoomId')[0].value;
if (!hasString(anchorRoomId)) {
layer.msg("请选择")
return
}
let url = new URL(window.location.href);
url.searchParams.set('roomId', anchorRoomId);
window.location.href = url.toString();
}
});
}
});
</script>

26
Web/html/body/video.html
View File

@@ -42,15 +42,18 @@
<input type="checkbox" id="danmuCheckBox" title="弹幕" lay-skin="tag" lay-filter="danmuCheckBox" on checked>
</div>
<div class="layui-col-xs5" style="text-align: center;">
<div class="layui-col-xs4" style="text-align: center;">
&nbsp; <div id="slider" lay-options="{value: 100,input:true}"></div>
<span>弹幕透明度</span>
</div>
<div class="layui-col-xs2" style="text-align: right; align-self: center;">
弹幕装载数:<span id="danmuSize">你猜</span>
</div>
</div>
<div class="layui-row">
<div class="layui-col-xs2">&nbsp;</div>
<div class="layui-col-xs7">
<canvas id="giftChart" height="200"></canvas>
<div class="layui-col-xs7" style="width: auto; height: 50%;">
<canvas id="giftChart" style="width: 100%; height: 100%;"></canvas>
</div>
</div>
<div style="margin-bottom: 10vh;"></div>
@@ -232,6 +235,7 @@
initChart(roomId, options.id)
});
var chartView = null;
function initChart(roomId, videoId) {
getVideoGiftInfo(roomId, videoId)
.then(data => {
@@ -241,20 +245,22 @@
var lables = [];
var values = [];
data.data.guardInfo.forEach(item => {
lables.push(item.gift_name+"\n"+item.total_price/100+"¥")
lables.push(item.gift_name + "\n" + item.total_price / 100 + "¥")
values.push(item.total_num)
});
data.data.giftInfo.forEach(item => {
lables.push(item.gift_name+"\n"+item.total_price/100+"¥")
lables.push(item.gift_name + "\n" + item.total_price / 100 + "¥")
values.push(item.total_gift_num)
});
new Chart($('#giftChart').get(0), {
if(chartView!==null){
chartView.destroy()
}
chartView = new Chart($('#giftChart').get(0), {
type: 'pie',
data: {
labels: lables,
datasets: [{
label: '礼物(总额:'+data.data.price/100+"¥)",
label: '礼物(总额:' + data.data.price / 100 + "¥)",
data: values,
borderWidth: 1
}
@@ -313,7 +319,8 @@
}
function playVideo(url) {
var video = document.getElementById('videoElement');
var videoSrc = url;
var videoSrc = window.location.origin + url;
console.log('url = ' + videoSrc)
var hls = new Hls();
hls.loadSource(videoSrc);
hls.attachMedia(video);
@@ -328,6 +335,7 @@
getDanmu(getParam('roomId'), videoId)
.then(data => {
barrageRenderer.setBarrages(data.data.danmu);
$('#danmuSize').get(0).innerHTML = data.data.danmu.length
initSC(data.data.superChat)
})