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.
 
 
 
 
 

231 lines
7.4 KiB

<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>报告下载</title>
<script src="./jquery.min.js"></script>
<style>
body {
padding: 0;
margin: 0;
background-color: #222F3D;
color: #fff;
overflow: hidden;
font-family: Helvetica Neue, Helvetica, PingFang SC, Heiti SC, Microsoft YaHei, WenQuanYi Micro Hei, sans-serif, Arial, sans-serif;
font-size: 16px;
}
.title {
width: 100%;
position: relative;
top: 0px;
}
.title_name {
position: absolute;
top: 0px;
left: 3%;
font-size: 20px;
font-weight: 600;
z-index: 1;
}
table {
width: 100%;
height: 20px;
/* padding: 0; */
border-collapse: collapse;
border-spacing: 0;
border: 1px solid #41476B;
color: #B0BDD4;
}
td {
/* width:30%; */
height: 5.6vw;
text-align: center;
border: 1px solid #41476B;
font-size: 2vw;
}
.th td{
font-size: 2.4vw;
background-color: #172533;
border: 1px solid #41476B;
}
.color {
background-color: #1F2F3E;
}
.color1 {
background-color: #172533;
}
.table_list {
margin: 10px 0 0 0;
position: relative;
height: 93vh;
overflow-y: scroll;
width:100%;
}
.table_list::-webkit-scrollbar {
display: none
}
.btn {
width: 62%;
height: 64%;
color: #fff;
background-color: rgb(57, 129, 141);
border-radius: 5px;
margin: 0 auto;
display: flex;
justify-content: center;
align-items: center;
}
.point {
cursor: pointer;
}
.shipin9-1 span {
position: absolute;
left: 9%;
top: 5px;
z-index: 99;
}
</style>
</head>
<body>
<div class="biankaung ">
<!-- <span class="title_name">报告</span>
<img class="title" src="./img/title.png" alt="" srcset=""> -->
<div class="table_list">
<!-- 工作票信息 -->
<div class="table_div">
<table id="list">
</table>
</div>
</div>
</div>
</body>
<script type="text/javascript">
let URL='http://localhost:8081';
// let URL='http://192.168.1.235:8081';
var device_address = ''
// <!-- 获取曲目列表 -->
function selectBridSongList(address) {
device_address = address
console.log(address)
$.ajax({
//请求方式
type: 'POST',
//发送请求的地址
url: `${URL}/api/brid/selectBridSongList`,
//服务器返回的数据类型
dataType: 'json',
contentType: 'application/json',
//发送到服务器的数据,对象必须为key/value的格式,jquery会自动转换为字符串格式
data: JSON.stringify({bridDevice: address, }),
success: function (result) {
var str = ''
for (var i = 0; i < result.rows.length; i++) {
if (i % 2 == 0) {
str += '<tr class="color ">' +
'<td>' + Number(i+1) + '</td>' +
'<td>' + result.rows[i].name + '</td>' +
'<td>' + result.rows[i].songName + '</td>' +
'<td>' + '<div class="btn point" onclick="setMusic(\'' + result.rows[i].id + '\')">' + '设置' + '</div>' + '</td>'
'</tr>'
} else {
str += '<tr class="color1">' +
'<td>' + Number(i+1) + '</td>' +
'<td>' + result.rows[i].name + '</td>' +
'<td>' + result.rows[i].songName + '</td>' +
'<td>' + '<div class="btn point" onclick="setMusic(\'' + result.rows[i].id + '\')">' + '设置' + '</div>' + '</td>'
'</tr>'
}
}
$('#list').html(
'<tr class="th">' +
'<td>序号</td>' +
'<td>设备名</td>' +
'<td>曲目</td>' +
'<td>操作</td>' +
'</tr>' +
str
)
}
})
}
// <!-- 选择曲目 -->
function setMusic(id) {
$.ajax({
//请求方式
type: 'POST',
//发送请求的地址
url: `${URL}/api/brid/setMusic`,
//服务器返回的数据类型
dataType: 'json',
contentType: 'application/json',
//发送到服务器的数据,对象必须为key/value的格式,jquery会自动转换为字符串格式
data: JSON.stringify({id:id}),
success: function (result) {
if(result.code == 200){
setMusicSave(id,result.data)
}
}
})
}
// <!-- 保存曲目 -->
function setMusicSave(id,nowSong) {
$.ajax({
//请求方式
type: 'POST',
//发送请求的地址
url: `${URL}/api/brid/setMusicSave`,
//服务器返回的数据类型
dataType: 'json',
contentType: 'application/json',
//发送到服务器的数据,对象必须为key/value的格式,jquery会自动转换为字符串格式
data: JSON.stringify({address:device_address,nowSong:nowSong}),
success: function (result) {
if(result.code == 200){
window.parent.close_tanchuang()
window.parent.selectBridDeviceList()
}else {
showMessage(result.msg, 'error', 1000)
}
}
})
}
//弹出的信息
function showMessage(message, type, time) {
let str = ''
if (type == 'success') {
str = '<div class="success-message" style="width: 300px;height: 40px;text-align: center;background-color:#daf5eb;;color: rgba(103,194,58,0.7);position: fixed;left: 35%;top: 5%;margin-left:-150px;margin-top:-20px;line-height: 40px;border-radius: 5px;z-index: 9999">\n' +
'<span class="mes-text">' + message + '</span></div>'
} else {
str = '<div class="error-message" style="width: 300px;height: 40px;text-align: center;background-color: #f5f0e5;color: rgba(238,99,99,0.8);position: fixed;left: 35%;top: 5%;line-height: 40px;margin-left:-150px;margin-top:-20px;border-radius: 5px;;z-index: 9999">\n' +
'<span class="mes-text">' + message + '</span></div>'
}
$('body').append(str)
setTimeout(function () {
$('.' + type + '-message').detach()
}, time)
}
</script>
</html>