Skip to content

J
jcy_monitor
Commit 0ccac7d4 authored by beilang's avatar beilang
Browse files
Options

2024-12-23

parent 523dd440
Expand all Hide whitespace changes
Inline Side-by-side
Showing with 189 additions and 49 deletions
src/main/java/com/ces/web/collect/controller/DeviceCollectController.java
View file @ 0ccac7d4
......@@ -48,6 +48,7 @@ public class DeviceCollectController {
if (StrUtil.isNotBlank(deviceCollect.getDeviceName())) {
queryWrapper.like("DEVICE_NAME", deviceCollect.getDeviceName());
}
queryWrapper.orderByAsc("SORT");
Page<DeviceCollect> page = Page.of(pageNo, pageSize);
page = deviceCollectService.page(page, queryWrapper);
......@@ -90,4 +91,25 @@ public class DeviceCollectController {
return Result.success().data(collected ? 1 : 0);
}
@PostMapping("/updateSort")
@ResponseBody
public Result updateSort(String deviceIds) {
UserDTO userDTO = (UserDTO) SecurityUtils.getSubject().getPrincipal();
String[] deviceIdArray = deviceIds.split(",");
for (int i = 0; i < deviceIdArray.length; i++) {
QueryWrapper<DeviceCollect> queryWrapper = new QueryWrapper<>();
queryWrapper.eq("USER_ID", userDTO.getId());
queryWrapper.eq("DEVICE_ID", deviceIdArray[i]);
DeviceCollect entity = new DeviceCollect();
entity.setSort(i);
deviceCollectService.update(entity, queryWrapper);
}
return Result.success();
}
}
src/main/webapp/WEB-INF/views/base.jsp
View file @ 0ccac7d4
......@@ -67,14 +67,14 @@
$('.toolbar a.collect').click(function(event) {
$("#collectIframe").attr('src', '${ctx}/deviceCollect/index');
$("#collect-modal").fadeIn();
$("#collect-modal").show();
});
$("#collect-modal").click(function (event) {
if ($(event.target).closest('.dialog-box').length) {
} else {
$("#collect-modal").fadeOut();
$("#collect-modal").hide();
}
})
......
src/main/webapp/WEB-INF/views/bxj/areaPlan.jsp
View file @ 0ccac7d4
......@@ -122,7 +122,7 @@
<div class="flex-box">
<a href="${ctx}/bxj/jqfour">
<p class="tabName">四监区</p>
<p class="monitor">监控点 <span style="background-color: #ff6363;">105</span></p>
<p class="monitor">监控点 <span style="background-color: #2f8fff;">105</span></p>
</a>
</div>
</li>
......@@ -130,7 +130,7 @@
<div class="flex-box">
<a href="${ctx}/bxj/jqfive">
<p class="tabName">五监区</p>
<p class="monitor">监控点 <span style="background-color: #ff8a00;">115</span></p>
<p class="monitor">监控点 <span style="background-color: #ff6363;">115</span></p>
</a>
</div>
</li>
......@@ -138,7 +138,7 @@
<div class="flex-box">
<a href="${ctx}/bxj/jqsix">
<p class="tabName">六监区</p>
<p class="monitor">监控点 <span style="background-color: #ffba00;">97</span></p>
<p class="monitor">监控点 <span style="background-color: #ff8a00;">97</span></p>
</a>
</div>
</li>
......@@ -146,7 +146,7 @@
<div class="flex-box">
<a href="${ctx}/bxj/jqseven">
<p class="tabName">七监区</p>
<p class="monitor">监控点 <span style="background-color: #43e04e;">119</span></p>
<p class="monitor">监控点 <span style="background-color: #ffba00;">119</span></p>
</a>
</div>
</li>
......@@ -154,7 +154,7 @@
<div class="flex-box">
<a href="${ctx}/bxj/nxyl">
<p class="tabName">南习艺楼</p>
<p class="monitor">监控点 <span style="background-color: #43e04e;">119</span></p>
<p class="monitor">监控点 <span style="background-color: #43e04e;">30</span></p>
</a>
</div>
</li>
......@@ -162,7 +162,7 @@
<div class="flex-box">
<a href="${ctx}/bxj/bxyl">
<p class="tabName">北习艺楼</p>
<p class="monitor">监控点 <span style="background-color: #43e04e;">119</span></p>
<p class="monitor">监控点 <span style="background-color: #2f8fff;">66</span></p>
</a>
</div>
</li>
......@@ -170,7 +170,7 @@
<div class="flex-box">
<a href="${ctx}/bxj/kjt">
<p class="tabName">宽见厅</p>
<p class="monitor">监控点 <span style="background-color: #ff6363;">36</span></p>
<p class="monitor">监控点 <span style="background-color: #ff6363;">8</span></p>
</a>
</div>
</li>
......@@ -178,7 +178,7 @@
<div class="flex-box">
<a href="${ctx}/bxj/pjt">
<p class="tabName">普见厅</p>
<p class="monitor">监控点 <span style="background-color: #ff6363;">36</span></p>
<p class="monitor">监控点 <span style="background-color: #ff8a00;">14</span></p>
</a>
</div>
</li>
......@@ -186,7 +186,7 @@
<div class="flex-box">
<a href="${ctx}/bxj/jb">
<p class="tabName">禁闭</p>
<p class="monitor">监控点 <span style="background-color: #ff6363;">36</span></p>
<p class="monitor">监控点 <span style="background-color: #ffba00;">8</span></p>
</a>
</div>
</li>
......@@ -194,7 +194,7 @@
<div class="flex-box">
<a href="${ctx}/bxj/yg">
<p class="tabName">严管</p>
<p class="monitor">监控点 <span style="background-color: #ff6363;">36</span></p>
<p class="monitor">监控点 <span style="background-color: #43e04e;">7</span></p>
</a>
</div>
</li>
......@@ -202,7 +202,7 @@
<div class="flex-box">
<a href="${ctx}/bxj/cc">
<p class="tabName">炊场</p>
<p class="monitor">监控点 <span style="background-color: #ff6363;">36</span></p>
<p class="monitor">监控点 <span style="background-color: #2f8fff;">26</span></p>
</a>
</div>
</li>
......@@ -218,7 +218,7 @@
<div class="flex-box">
<a href="${ctx}/bxj/zfys">
<p class="tabName">罪犯浴室</p>
<p class="monitor">监控点 <span style="background-color: #ff6363;">36</span></p>
<p class="monitor">监控点 <span style="background-color: #ff8a00;">3</span></p>
</a>
</div>
</li>
......@@ -226,7 +226,7 @@
<div class="flex-box">
<a href="${ctx}/bxj/edm">
<p class="tabName">二大门</p>
<p class="monitor">监控点 <span style="background-color: #ff6363;">36</span></p>
<p class="monitor">监控点 <span style="background-color: #ffba00;">12</span></p>
</a>
</div>
</li>
......@@ -234,7 +234,7 @@
<div class="flex-box">
<a href="${ctx}/bxj/ddt">
<p class="tabName">大地图</p>
<p class="monitor">监控点 <span style="background-color: #ff6363;">36</span></p>
<p class="monitor">监控点 <span style="background-color: #43e04e;">26</span></p>
</a>
</div>
</li>
......
src/main/webapp/WEB-INF/views/collect/index.jsp
View file @ 0ccac7d4
......@@ -16,39 +16,50 @@
<script src="${ctx}/static/js/bootstrap-table.min.js"></script>
<!-- Latest compiled and minified Locales -->
<script src="${ctx}/static/js/bootstrap-table-zh-CN.min.js"></script>
<link rel="stylesheet" type="text/css" href="${ctx}/static/css/css/iconfont.css" />
<link rel="stylesheet" type="text/css" href="${ctx}/static/css/css/iconfont.css"/>
<script src="${ctx}/static/js/kmedia-uni.js"></script>
<script src="${ctx}/static/js/Sortable.min.js"></script>
<script>
let ctx = '${ctx}';
</script>
<style>
body{
body {
color: #fff;
}
.page-main{
.page-main {
width: 100%;
height: 100%;
display: flex;
}
.tableList{
.tableList {
padding: 10px;
width: 40%;
}
.videoBox{
.videoBox {
flex: 1;
padding-top: 20px;
}
.bootstrap-table .fixed-table-container .table tfoot th .th-inner, .bootstrap-table .fixed-table-container .table thead th .th-inner {
padding: 8px;
}
.table-hover>tbody>tr:hover>* {
.table-hover > tbody > tr:hover > * {
color: #dddddd;
}
table th, table td{
table th, table td {
color: #fff;
}
table a{
table a {
cursor: pointer;
}
.select-list select {
border: none;
outline: none;
......@@ -64,28 +75,34 @@
font-size: 16px;
border-radius: 6px;
}
.select-list ul{
.select-list ul {
margin: 0;
padding: 0;
}
.select-list ul li {
list-style-type: none;
display: inline;
}
.bootstrap-table .fixed-table-container .fixed-table-body {
overflow: auto;
height: 70%;
}
.bootstrap-table .fixed-table-container .fixed-table-body .fixed-table-loading{
.bootstrap-table .fixed-table-container .fixed-table-body .fixed-table-loading {
background: transparent;
}
.bootstrap-table .fixed-table-container .fixed-table-body .fixed-table-loading .loading-wrap .loading-text{
.bootstrap-table .fixed-table-container .fixed-table-body .fixed-table-loading .loading-wrap .loading-text {
font-size: 16px !important;
color: #fff;
}
.bootstrap-table .fixed-table-container .fixed-table-body .fixed-table-loading .loading-wrap .animation-dot,
.bootstrap-table .fixed-table-container .fixed-table-body .fixed-table-loading .loading-wrap .animation-wrap::after,
.bootstrap-table .fixed-table-container .fixed-table-body .fixed-table-loading .loading-wrap .animation-wrap::before{
.bootstrap-table .fixed-table-container .fixed-table-body .fixed-table-loading .loading-wrap .animation-wrap::before {
background: #fff;
}
......@@ -109,9 +126,14 @@
::-webkit-scrollbar-thumb:hover {
background-color: #555; /* 设置滑块hover状态时的背景颜色 */
}
.pagination {
--bs-pagination-padding-x: 0.65rem !important;
--bs-pagination-padding-y: 0.3rem !important;
}
</style>
</head>
<body style="background-color: transparent;">
<body style="background-color: transparent;height: 100%">
<div class="page-main">
<div class="tableList">
......@@ -137,12 +159,14 @@
摄像头名称：<input type="text" name="deviceName" placeholder="请输入摄像头名称"/>
</li>
<li>
<a class="btn btn-primary btn-rounded btn-sm" onclick="tableSearch()"><i class="fa fa-search"></i>&nbsp;搜索</a>
<a class="btn btn-primary btn-rounded btn-sm" onclick="tableSearch()"><i
class="fa fa-search"></i>&nbsp;搜索</a>
</li>
</ul>
</div>
</form>
<table id="collectTable" class="table table-hover"></table>
<table id="collectTable" class="table table-hover" data-use-row-attr-func="true"
data-reorderable-rows="true"></table>
</div>
<div class="videoBox">
<p id="cameraName" style="text-align: center"></p>
......@@ -164,7 +188,7 @@
})
function loadList() {
$('#collectTable').bootstrapTable({
let table = $('#collectTable').bootstrapTable({
url: ctx + '/deviceCollect/list', //请求后台的URL（*）
method: 'get', //请求方式（*）
contentType: "application/x-www-form-urlencoded",//需要设置为这个参数，后台才能通过对象获取值,这里要注意
......@@ -177,8 +201,8 @@
// sortable: false, //是否启用排序
sidePagination: "server", //分页方式：client客户端分页，server服务端分页（*）
pageNumber: 1, //初始化加载第一页，默认第一页
pageSize: 10, //每页的记录行数（*）
pageList: [10], //可供选择的每页的行数（*）
pageSize: 70, //每页的记录行数（*）
pageList: [10, 50, 100], //可供选择的每页的行数（*）
sortOrder: "asc", //排序方式
search: false,//搜索功能
buttonsAlign: "left",//按钮对齐方式
......@@ -189,6 +213,7 @@
cardView: false, //是否显示详细视图
detailView: false, //是否显示父子表
queryParamsType: 'limit',
useRowAttrFunc: true,
columns: [
/*{
field: 'prisonName',
......@@ -233,13 +258,43 @@
}
});
$('#collectTable').on('post-body.bs.table', function (e, data) {
var el = this.getElementsByTagName('tbody')[0];
Sortable.create(el, {
onEnd: function (evt) {
var data = $('#collectTable').bootstrapTable('getData');
var movedItem = data.splice(evt.oldIndex, 1)[0];
data.splice(evt.newIndex, 0, movedItem);
updateSort(data)
}
});
});
function updateSort(data) {
let deviceIds = data.map(item=>{return item.deviceId}).join(',')
$.ajax({
url: ctx + '/deviceCollect/updateSort',
type: 'post',
dataType: 'json',
data: {
deviceIds: deviceIds
},
success: function (res) {
if (!res.success) {
$('#collectTable').bootstrapTable('refresh');
layer.msg('系统异常，请稍后再试~');
}
}
})
}
function queryParams(params) {
return $.extend(formToJSON('collect-form'), {
pageNo : Math.ceil(params.offset/params.limit) + 1, //页码
pageSize : params.limit, //页面大小
return $.extend(formToJSON('collect-form'), {
pageNo: Math.ceil(params.offset / params.limit) + 1, //页码
pageSize: params.limit, //页面大小
})
}
function showVideo(gbid, deviceName) {
$("#cameraName").html(deviceName + '监控点情况');
player.play(gbid);
......@@ -247,7 +302,7 @@
function removeCollect(deviceId) {
$.ajax({
url: ctx + '/deviceCollect/' +deviceId,
url: ctx + '/deviceCollect/' + deviceId,
type: 'post',
dataType: 'json',
success: function (res) {
......@@ -299,7 +354,7 @@
// 获取form下所有的字段并转换为json对象
function formToJSON(formId) {
var json = {};
$.each($("#" + formId).serializeArray(), function(i, field) {
$.each($("#" + formId).serializeArray(), function (i, field) {
if (json[field.name]) {
json[field.name] += ("," + field.value);
} else {
......
src/main/webapp/WEB-INF/views/hw/hw_bcj.jsp
View file @ 0ccac7d4
......@@ -48,7 +48,7 @@
}, {
top: '13%',
left: '9%',
gbid: '31011700001320001187'
gbid: '31011700001320001190'
}, {
top: '28%',
left: '9%',
......@@ -56,19 +56,19 @@
}, {
top: '57%',
left: '9%',
gbid: '31011700001320001190'
gbid: '31011700001320001383'
}, {
top: '43%',
left: '9%',
gbid: '31011700001320001189'
gbid: '31011700001320001192'
}, {
top: '73%',
left: '9%',
gbid: '31011700001320001191'
gbid: '31011700001320001382'
}, {
top: '87%',
left: '9%',
gbid: '31011700001320001192'
gbid: '31011700001320001187'
}, {
top: '1.2rem',
left: '4.8rem',
......@@ -82,6 +82,10 @@
left: '6.9rem',
gbid: '31011700001320001195'
}, {
top: '9%',
left: '8rem',
gbid: '31011700001320001372'
}, {
top: '12%',
left: '10.3rem',
gbid: '31011700001320001196'
......
src/main/webapp/WEB-INF/views/hw/hw_jcqy.jsp
View file @ 0ccac7d4
......@@ -226,6 +226,15 @@
top: '5.3rem',
left: '7.65rem',
gbid: '31011700001320001348'
}, {
top: '5.7rem',
left: '6.3rem',
gbid: '31011700001320001369'
}
, {
top: '5rem',
left: '5.8rem',
gbid: '31011700001320001378'
}
],
'arr4': [
......@@ -296,6 +305,14 @@
top: '5.94rem',
left: '9.95rem',
gbid: '31011700001320001335'
}, {
top: '3.89rem',
left: '4.13rem',
gbid: '31011700001320001370'
}, {
top: '3.89rem',
left: '7.45rem',
gbid: '31011700001320001371'
}
]
}
......
src/main/webapp/WEB-INF/views/hw/hw_jyl.jsp
View file @ 0ccac7d4
......@@ -160,6 +160,14 @@
top: "95%",
left: "7.75rem",
gbid: '31011700001320001032'
}, {
top: "1.35rem",
left: "2rem",
gbid: '31011700001320001377'
}, {
top: "83%",
left: "1.6rem",
gbid: '31011700001320001379'
}
],
'arr2': [
......
src/main/webapp/WEB-INF/views/hw/hw_ncj.jsp
View file @ 0ccac7d4
......@@ -251,6 +251,15 @@
left: '10.5rem',
gbid: '31011700001320001052'
}
, {
top: '7.25rem',
left: '11.15rem',
gbid: '31011700001320001373'
}, {
top: '7.25rem',
left: '2.9rem',
gbid: '31011700001320001374'
}
],
'arr2': [
{
......@@ -446,6 +455,15 @@
left: '10.53rem',
gbid: '31011700001320001105'
}
, {
top: '7.3rem',
left: '10.53rem',
gbid: '31011700001320001375'
}, {
top: '7.3rem',
left: '3.62rem',
gbid: '31011700001320001376'
}
]
}
......
src/main/webapp/static/css/bootstrap-table-reorder-rows.css 0 → 100644
View file @ 0ccac7d4
.reorder_rows_onDragClass td {
background-color: #0b0b8c;
-webkit-box-shadow: 11px 5px 12px 2px #333, 0 1px 0 #ccc inset, 0 -1px 0 #ccc inset;
-webkit-box-shadow: 6px 3px 5px #555, 0 1px 0 #ccc inset, 0 -1px 0 #ccc inset;
-moz-box-shadow: 6px 4px 5px 1px #555, 0 1px 0 #ccc inset, 0 -1px 0 #ccc inset;
-box-shadow: 6px 4px 5px 1px #555, 0 1px 0 #ccc inset, 0 -1px 0 #ccc inset;
}
.reorder_rows_onDragClass td:last-child {
-webkit-box-shadow: 8px 7px 12px 0 #333, 0 1px 0 #ccc inset, 0 -1px 0 #ccc inset;
-webkit-box-shadow: 1px 8px 6px -4px #555, 0 1px 0 #ccc inset, 0 -1px 0 #ccc inset;
-moz-box-shadow: 0 9px 4px -4px #555, 0 1px 0 #ccc inset, 0 -1px 0 #ccc inset, -1px 0 0 #ccc inset;
-box-shadow: 0 9px 4px -4px #555, 0 1px 0 #ccc inset, 0 -1px 0 #ccc inset, -1px 0 0 #ccc inset;
}
\ No newline at end of file
src/main/webapp/static/css/main.css
View file @ 0ccac7d4
......@@ -35,16 +35,17 @@
#collect-modal .dialog-box {
/*margin: 50px auto;*/
/*height: 68vh;*/
border-radius: 20px;
max-height: 700px;
/* 防止重复平铺 */
width: 100% !important;
max-width: 1600px;
background-image: url(../images/tc_bj.png);
/* background-image: url(../images/tc_bj.png);
background-size: cover;
background-repeat: no-repeat;
/* background-color: #00254d00; */
background-repeat: no-repeat;*/
background-color: #243b82;
border: none;
background-color: transparent;
/*background-color: transparent;*/
z-index: 99999999;
}
#collect-modal .dialog-box .dialog-content {
......
src/main/webapp/static/js/Sortable.min.js 0 → 100644
View file @ 0ccac7d4
This diff is collapsed.
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment