274 lines
10 KiB
JavaScript
274 lines
10 KiB
JavaScript
var example = null;
|
||
var pers = null;
|
||
var tokens = localStorage.getItem("token")
|
||
var ballIndex = localStorage.getItem("ballIndex");
|
||
var puid = localStorage.getItem("puid");
|
||
var datas;
|
||
$(function () {
|
||
layui.use(['layer', 'laydate', 'form'], function () {
|
||
var layer = layui.layer;
|
||
var laydate = layui.laydate;
|
||
var form = layui.form;
|
||
|
||
laydate.render({
|
||
elem: '#data' //指定元素
|
||
});
|
||
init();
|
||
//var datas = [{"id":"1234","name":"xx"},{"id":"1222234","name":"xsssx"}];
|
||
//window.location.href = ctxPath + "/videoQueryWeb/getBallVideoByPuid?puid=" + puid + "&token=" + tokens;
|
||
|
||
});
|
||
|
||
$("#searchBt").click(function () {
|
||
init();
|
||
});
|
||
//导出
|
||
$("#exportBt").click(function () {
|
||
exportBtn();
|
||
});
|
||
});
|
||
|
||
function init() {
|
||
var data = $("#data").val();
|
||
$.ajax({
|
||
type: 'get',
|
||
url: dataUrl + "video/getBallVideoByPuid",
|
||
data: {
|
||
puid: puid,
|
||
dateTime: data
|
||
},
|
||
success: function (data) {
|
||
console.log(data);
|
||
$("tbody").empty();
|
||
var html = "";
|
||
/*layer.msg("球机信息获取失败或设备不在线或无数据", {icon: 7, time: 3000});*/
|
||
datas = data;
|
||
if (datas == null || datas == "null" || datas == "") {
|
||
//layer.msg("球机信息获取失败", {icon: 2, time: 2000});
|
||
html = "<tr><td colspan='7'>无数据</td></tr>";
|
||
$("tbody").append(html);
|
||
return;
|
||
}
|
||
//初始化，当前页面显示为第一页
|
||
limits(data);//页面按钮生成
|
||
document.getElementById("inputs").childNodes[0].style.backgroundColor = "#1668D7";//第一个按钮的背景颜色为红色
|
||
tablestr(1);//table数据显示
|
||
}
|
||
})
|
||
}
|
||
|
||
//假设规定每页显示长度为3
|
||
var choose = 1;//创建一个全局变量用来保存当前处于第几个页面
|
||
var len = 10;
|
||
|
||
//确认该集合会被分成几页，分成几页就代表需要几个页面按钮,封装封装方便多次运用
|
||
function limits() {
|
||
var num1 = (choose - 1) * len + 1;//确定循环开始的集合下标
|
||
var num2 = choose * len;//确定循环结束的结束下标
|
||
document.getElementById("information").innerHTML = '';//清空一下
|
||
document.getElementById("information").innerHTML += '显示第 ' + num1 + " 至 " + num2 + " 项结果，共 " + datas.length + " 项";
|
||
|
||
var countLim = Math.ceil(datas.length / len);//余数也算是一页，这里用向上取整
|
||
//确认页面按钮个数，进行循环显示到页面上
|
||
document.getElementById("inputs").innerHTML = '';//清空一下
|
||
for (var i = 1; i <= countLim; i++) {
|
||
//每个页面按钮都绑定上一个点击事件
|
||
document.getElementById("inputs").innerHTML += '<input type="button" class = "btn' + i + '" value="' + i + '" onclick="limitinput(this)" style="margin-right: 2px;width: 25px;height: 25px;border: 1px solid #1668D7;color: #fff;background-color: rgba(0,0,0,0)"/>';
|
||
|
||
}
|
||
}
|
||
|
||
//点击按钮获取当前按钮的值进行选择当前table是第几页数据
|
||
function limitinput(ids) {
|
||
choose = ids.value;
|
||
tablestr(choose);//刷新table数据
|
||
limits();//刷新页面按钮
|
||
ids.style.backgroundColor = '#1668D7';//当前点击的页面按钮背景颜色改变为红色
|
||
liminputcolor(choose);//页面按钮变色
|
||
}
|
||
|
||
//通过当前页面按钮和页面数据长度将数据放进table内，封装封装！！！必须封装
|
||
function tablestr(num) {//num是指当前哪个页面
|
||
var num1;
|
||
var num2;
|
||
var countLim = Math.ceil(datas.length / len); //总页数
|
||
var remainder = datas.length % 10; //余数。得到最后一页的数据数量
|
||
if (countLim != num) {//不是最后一页
|
||
num1 = (num - 1) * len;//确定循环开始的集合下标
|
||
num2 = num * len;//确定循环结束的结束下标
|
||
} else {//最后一页
|
||
num1 = (num - 1) * len;//确定循环开始的集合下标
|
||
num2 = num * len - 10 + remainder;//确定循环结束的结束下标
|
||
}
|
||
|
||
var html = '';
|
||
$("tbody").empty();//清空一下
|
||
console.log(num1,num2)
|
||
for (var i = num1; i < num2; i++) {//遍历数组
|
||
console.log("123123")
|
||
if (datas[0].manufactorId == '1') { //创世
|
||
html += "<tr>" +
|
||
"<td><input type='checkbox' name='active' class='checks' value='" + datas[i].beginTime + "@" + datas[i].endTime + "' id=''/></td>\n" +
|
||
"<td style='display: none'>" + datas[i].ballId + "</td>" +
|
||
"<td></td>" +
|
||
"<td></td>" +
|
||
"<td>" + datas[i].beginTime + "</td>" +
|
||
"<td>" + datas[i].endTime + "</td>" +
|
||
"<td></td>" +
|
||
"<td><img id='videoCheck" + i + "' style='cursor: pointer' src='../../img/download/videoCheck.png' title='播放'/></td>" + //创世球机无法实现此功能
|
||
"</tr>"
|
||
} else if (datas[0].manufactorId == '2') { //清新
|
||
html += "<tr>" +
|
||
"<td><input type='checkbox' name='active' class='checks' value='" + datas[i].name + "@" + datas[i].path + "@" + datas[i].begin + "@" + datas[i].end + "@" + puid + "@" + datas[i].size + "' id=''/></td>\n" +
|
||
"<td style='display: none'>" + datas[i].ballId + "</td>" +
|
||
"<td>" + datas[i].name + "</td>" +
|
||
"<td>" + datas[i].size + "</td>" +
|
||
"<td>" + datas[i].begin + "</td>" +
|
||
"<td>" + datas[i].end + "</td>" +
|
||
"<td>" + datas[i].path + "</td>" +
|
||
"<td><img id='videoCheck" + i + "' style='cursor: pointer' src='../../img/download/videoCheck.png' title='播放'/></td>" +
|
||
"</tr>"
|
||
}
|
||
}
|
||
if (html == "") {
|
||
html = "<tr><td colspan='7'>无数据</td></tr>";
|
||
}
|
||
$("tbody").append(html);
|
||
for (let i = 0; i < datas.length; i++) {
|
||
$("#videoCheck" + i + "").click(function () {
|
||
playVoide(datas[i], "1");
|
||
});
|
||
}
|
||
}
|
||
|
||
function liminputcolor(choose) {
|
||
document.getElementById("inputs").childNodes[choose - 1].style.backgroundColor = "#1668D7";
|
||
}
|
||
|
||
function prevPageBtn() {
|
||
if (choose == 1) {
|
||
return;
|
||
}
|
||
choose = choose - 1;
|
||
tablestr(choose);//刷新table数据
|
||
limits();//刷新页面按钮
|
||
document.getElementById("inputs").childNodes[choose - 1].style.backgroundColor = "#1668D7";
|
||
liminputcolor(choose);//页面按钮变色
|
||
}
|
||
|
||
function nextPageBtn() {
|
||
if (choose == Math.ceil(datas.length / len)) {
|
||
return;
|
||
}
|
||
choose = choose + 1;
|
||
tablestr(choose);//刷新table数据
|
||
limits();//刷新页面按钮
|
||
document.getElementById("inputs").childNodes[choose - 1].style.backgroundColor = "#1668D7";
|
||
liminputcolor(choose);//页面按钮变色
|
||
}
|
||
|
||
function playVoide(item, type) {
|
||
localStorage.setItem("type", type);
|
||
localStorage.setItem("item", JSON.stringify(item));
|
||
layer.open({
|
||
title: false,
|
||
type: 2,
|
||
content: "flvStart.html",
|
||
area: ["1098px", "800px"],
|
||
skin: 'my-skin videoView-skin',
|
||
shadeClose: true,
|
||
shade: 0.5,
|
||
maxmin: false
|
||
});
|
||
}
|
||
|
||
// 批量下载
|
||
function downloadBatch() {
|
||
//window.open("http://112.31.70.193:1854/icvs/SG/VODFile.flv?path=/tmpfs/disks/disk0/Record/0000/20220707/20220707052759_0000.avi&token=No8X6H7lH&idx=0&stream=0&startTime=20&puid=201115204081128079&durationSecond=1800");
|
||
var chk_value = [];
|
||
var count = 0;
|
||
$('input[name="active"]:checked').each(function () { // 遍历input输入框中name=active 选中状态的值。
|
||
chk_value.push($(this).val());
|
||
count += 1;
|
||
});
|
||
console.info("所有为选中状态复选框的值：" + chk_value + ",选中状态的个数：" + count)
|
||
|
||
if (count == 0) {
|
||
return layer.msg("请勾选要下载的数据", {icon: 7, time: 2000});
|
||
}
|
||
if (count > 1) {
|
||
return layer.msg("请不要勾选多个数据", {icon: 7, time: 2000});
|
||
}
|
||
var form = {"id": chk_value.toString()};
|
||
$.ajax({
|
||
type: 'post',
|
||
url: dataUrl + '/video/getPathById',
|
||
contentType: "application/json; charset=utf-8",
|
||
data: JSON.stringify(form),
|
||
dataType: 'json',
|
||
success: function (data) {
|
||
if (data.length > 0) {
|
||
for (var i = 0; i < data.length; i++) {
|
||
window.open("http://112.31.70.193:1854/icvs/SG/VODFile.flv?path=" + (data[i].path + data[i].fileName) + "&token=" + data[i].token + "&idx=0&stream=0&startTime=20&puid=" + data[0].puid + "&durationSecond=" + data[0].durationSecond)
|
||
|
||
}
|
||
}
|
||
|
||
}
|
||
})
|
||
}
|
||
|
||
/**
|
||
* 导出数据
|
||
*/
|
||
function exportBtn() {
|
||
var chk_value = [];
|
||
var count = 0;
|
||
$('input[name="active"]:checked').each(function () { // 遍历input输入框中name=active 选中状态的值。
|
||
chk_value.push($(this).val());
|
||
count += 1;
|
||
});
|
||
console.info("所有为选中状态复选框的值：" + chk_value + ",选中状态的个数：" + count)
|
||
|
||
if (count == 0) {
|
||
return layer.msg("请勾选要导出的数据", {icon: 7, time: 2000});
|
||
}
|
||
var id = chk_value.toString();
|
||
window.location.href = dataUrl + "video/exportVideoQuery?id=" + id + "&token=" + tokens;
|
||
}
|
||
|
||
// 批量删除
|
||
function delBatch() {
|
||
var id = null;
|
||
var selected = []; // 选中删除的数据
|
||
var oTable = $('#dt-table').dataTable();
|
||
var rowcollection = oTable.$(".checkall:checked", {"page": "all"});
|
||
rowcollection.each(function (index, elem) {
|
||
var checkbox_value = $(elem).val();
|
||
selected.push(checkbox_value);
|
||
});
|
||
if (selected.length == 0) {
|
||
return layer.msg("请勾选要删除的数据", {icon: 7, time: 2000});
|
||
}
|
||
id = selected.toString();
|
||
layer.confirm("您确定要删除选中的数据吗？", function () {
|
||
var form = {"id": id};
|
||
$.ajax({
|
||
type: 'post',
|
||
url: dataUrl + 'video/delVideoQueryById',
|
||
contentType: "application/json; charset=utf-8",
|
||
data: JSON.stringify(form),
|
||
dataType: 'text',
|
||
success: function (data) {
|
||
if (data == "删除成功") {
|
||
layer.msg('删除成功', {icon: 1, time: 3000});
|
||
example.ajax.reload(); // 刷新页面
|
||
} else {
|
||
layer.msg(data, {icon: 2, time: 3000});
|
||
example.ajax.reload(); // 刷新页面
|
||
}
|
||
}
|
||
})
|
||
})
|
||
}
|