win代码上传
parent
ce243f7e0a
commit
224fe342a3
|
|
@ -25,10 +25,7 @@ import org.slf4j.LoggerFactory;
|
||||||
import org.springframework.beans.factory.annotation.Autowired;
|
import org.springframework.beans.factory.annotation.Autowired;
|
||||||
import org.springframework.stereotype.Controller;
|
import org.springframework.stereotype.Controller;
|
||||||
import org.springframework.ui.ModelMap;
|
import org.springframework.ui.ModelMap;
|
||||||
import org.springframework.web.bind.annotation.GetMapping;
|
import org.springframework.web.bind.annotation.*;
|
||||||
import org.springframework.web.bind.annotation.PostMapping;
|
|
||||||
import org.springframework.web.bind.annotation.RequestMapping;
|
|
||||||
import org.springframework.web.bind.annotation.ResponseBody;
|
|
||||||
|
|
||||||
import javax.xml.crypto.Data;
|
import javax.xml.crypto.Data;
|
||||||
import java.net.Inet4Address;
|
import java.net.Inet4Address;
|
||||||
|
|
@ -71,7 +68,7 @@ public class RadarStatusController {
|
||||||
|
|
||||||
@PostMapping("/list")
|
@PostMapping("/list")
|
||||||
@ResponseBody
|
@ResponseBody
|
||||||
public TableDataInfo list(SysRadar sysRadar) {
|
public TableDataInfo list(@RequestBody SysRadar sysRadar) {
|
||||||
TableDataInfo rspData = new TableDataInfo();
|
TableDataInfo rspData = new TableDataInfo();
|
||||||
List<SysRadar> radarList = service.selectRadarList(sysRadar);
|
List<SysRadar> radarList = service.selectRadarList(sysRadar);
|
||||||
// 异步连接硬件
|
// 异步连接硬件
|
||||||
|
|
@ -85,6 +82,7 @@ public class RadarStatusController {
|
||||||
public void run() {
|
public void run() {
|
||||||
|
|
||||||
for (SysRadar radar : radarList) {
|
for (SysRadar radar : radarList) {
|
||||||
|
System.out.println("=======radar=====");
|
||||||
try {
|
try {
|
||||||
// ModbusResponse modbusResponse = new ModbusResponse();
|
// ModbusResponse modbusResponse = new ModbusResponse();
|
||||||
ModbusMaster master = ModbusUtils.getSlave(radar.getRadarIp(), 23);
|
ModbusMaster master = ModbusUtils.getSlave(radar.getRadarIp(), 23);
|
||||||
|
|
|
||||||
File diff suppressed because it is too large
Load Diff
|
|
@ -2,85 +2,78 @@
|
||||||
<html lang="zh" xmlns:th="http://www.thymeleaf.org" xmlns:shiro="http://www.pollix.at/thymeleaf/shiro">
|
<html lang="zh" xmlns:th="http://www.thymeleaf.org" xmlns:shiro="http://www.pollix.at/thymeleaf/shiro">
|
||||||
<head>
|
<head>
|
||||||
<th:block th:include="include :: header('自定义视图分页')"/>
|
<th:block th:include="include :: header('自定义视图分页')"/>
|
||||||
|
<meta charset="UTF-8">
|
||||||
</head>
|
</head>
|
||||||
<body class="gray-bg">
|
<body class="gray-bg">
|
||||||
<div class="container-div">
|
|
||||||
|
|
||||||
|
|
||||||
|
<div id="vm">
|
||||||
<div class="row">
|
<div class="row">
|
||||||
<div class="col-sm-12 select-table table-striped">
|
<div class="col-sm-12 select-table table-striped">
|
||||||
<table id="bootstrap-table" data-page-size="10"
|
<table id="bootstrap-table">
|
||||||
data-show-custom-view="true" data-custom-view="customViewFormatter"
|
<tbody>
|
||||||
data-show-custom-view-button="false">
|
<tr v-for="item in tableData" :key="item.radarIp">
|
||||||
|
<td v-for="(value, key) in item" :key="key">{{ key }}</td>
|
||||||
|
</tr>
|
||||||
|
</tbody>
|
||||||
</table>
|
</table>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
<template id="profileTemplate">
|
<!-- <template id="profileTemplate">-->
|
||||||
<div class="col-sm-4">
|
<!-- <div class="col-sm-4">-->
|
||||||
<div class="contact-box">
|
<!-- <div class="contact-box">-->
|
||||||
|
|
||||||
<div class="col-sm-4">
|
<!-- <div class="col-sm-4">-->
|
||||||
<div class="text-center" >
|
<!-- <div class="text-center" >-->
|
||||||
<img alt="image" class="img-circle m-t-xs img-responsive" src="%IMAGE%">
|
<!-- <img alt="image" class="img-circle m-t-xs img-responsive" src="%IMAGE%">-->
|
||||||
<div class="m-t-xs font-bold">%radarIp%</div>
|
<!-- <div class="m-t-xs font-bold">%radarIp%</div>-->
|
||||||
</div>
|
<!-- </div>-->
|
||||||
</div>
|
<!-- </div>-->
|
||||||
<div class="col-sm-8">
|
<!-- <div class="col-sm-8">-->
|
||||||
<h3><strong>%radarLocation%</strong></h3>
|
<!-- <h3><strong>%radarLocation%</strong></h3>-->
|
||||||
</div>
|
<!-- </div>-->
|
||||||
<div class="clearfix"></div>
|
<!-- <div class="clearfix"></div>-->
|
||||||
|
|
||||||
</div>
|
<!-- </div>-->
|
||||||
</div>
|
<!-- </div>-->
|
||||||
</template>
|
<!-- </template>-->
|
||||||
|
|
||||||
<div th:include="include :: footer"></div>
|
<div th:include="include :: footer"></div>
|
||||||
<th:block th:include="include :: bootstrap-table-custom-view-js"/>
|
<th:block th:include="include :: bootstrap-table-custom-view-js"/>
|
||||||
|
|
||||||
|
<script src="/js/vue.js"></script>
|
||||||
|
<script src="https://cdn.jsdelivr.net/npm/axios/dist/axios.min.js"></script>
|
||||||
|
|
||||||
<script th:inline="javascript">
|
<script th:inline="javascript">
|
||||||
var prefix = ctx + "system/radarStatus";
|
// var prefix = ctx + "system/radarStatus";
|
||||||
var datas = [[${@dict.getType('sys_normal_disable')}]];
|
// var datas = [[${@dict.getType('sys_normal_disable')}]];
|
||||||
|
|
||||||
var tableData = [];
|
new Vue({
|
||||||
|
el: '#vm',
|
||||||
$(function() {
|
data() {
|
||||||
var options = {
|
return {
|
||||||
url: prefix + "/list",
|
tableData: [],
|
||||||
showSearch: false,
|
total: 0,
|
||||||
showRefresh: false,
|
socketUrl: 'ws://localhost/websocket', // WebSocket服务器地址
|
||||||
showToggle: false,
|
reconnectInterval: 5000, // 重连间隔时间
|
||||||
showColumns: false,
|
reconnectionAttempts: Infinity,
|
||||||
showExport: true,
|
|
||||||
columns: [
|
|
||||||
{
|
|
||||||
field : 'radarIp',
|
|
||||||
title : '雷达ip'
|
|
||||||
},
|
|
||||||
{
|
|
||||||
field : 'radarLocation',
|
|
||||||
title : '用户手机'
|
|
||||||
},
|
|
||||||
{
|
|
||||||
field: 'status',
|
|
||||||
title: '用户状态',
|
|
||||||
align: 'center',
|
|
||||||
formatter: function(value, row, index) {
|
|
||||||
return $.table.selectDictLabel(datas, value);
|
|
||||||
}
|
}
|
||||||
},
|
},
|
||||||
{
|
mounted() {
|
||||||
title: '操作',
|
axios.post('http://localhost/system/radarStatus/list', {})
|
||||||
align: 'center',
|
.then((data) => {
|
||||||
formatter: function(value, row, index) {
|
this.tableData = data.data.rows
|
||||||
var actions = [];
|
this.total = data.data.total
|
||||||
actions.push('<a class="btn btn-success btn-xs" href="javascript:;"><i class="fa fa-edit"></i>编辑</a> ');
|
console.log(this.tableData)
|
||||||
actions.push('<a class="btn btn-danger btn-xs" href="javascript:;"><i class="fa fa-remove"></i>删除</a>');
|
console.log(this.total)
|
||||||
return actions.join('');
|
})
|
||||||
}
|
},
|
||||||
}]
|
|
||||||
};
|
|
||||||
$.table.init(options);
|
|
||||||
});
|
|
||||||
|
|
||||||
|
|
||||||
|
created() {
|
||||||
var socket = new WebSocket("ws://localhost/websocket");
|
var socket = new WebSocket("ws://localhost/websocket");
|
||||||
|
|
||||||
socket.onopen = function(event) {
|
socket.onopen = function(event) {
|
||||||
|
|
@ -88,53 +81,82 @@
|
||||||
};
|
};
|
||||||
|
|
||||||
socket.onmessage = (event)=> {
|
socket.onmessage = (event)=> {
|
||||||
|
|
||||||
var data = JSON.parse(event.data);
|
var data = JSON.parse(event.data);
|
||||||
console.log("接收到数据：" + data);
|
console.log("接收到数据：" + data);
|
||||||
$.each($.tableData, function (i, row) {
|
console.log(this.tableData)
|
||||||
if(row.radarIp === data.radarIp){
|
this.tableData = [data]
|
||||||
console.log("rowbefore"+JSON.stringify(row))
|
// console.log(this.tableData)
|
||||||
|
|
||||||
row.status = data.status;
|
|
||||||
console.log("rowafter"+JSON.stringify(row))
|
|
||||||
}
|
|
||||||
})
|
|
||||||
var template = $('#profileTemplate').html()
|
|
||||||
var view = ''
|
|
||||||
$.each(data, function (i, row) {
|
|
||||||
view += template
|
|
||||||
.replace('%IMAGE%', getImageUrl(row.status))
|
|
||||||
.replace('%radarIp%', row.radarIp)
|
|
||||||
.replace('%radarLocation%', row.radarLocation)
|
|
||||||
})
|
|
||||||
|
|
||||||
return `<div class="row mx-0">${view}</div>`
|
|
||||||
};
|
};
|
||||||
|
|
||||||
socket.onclose = function(event) {
|
socket.onclose = function(event) {
|
||||||
console.log("WebSocket连接已关闭");
|
console.log("WebSocket连接已关闭");
|
||||||
};
|
};
|
||||||
function customViewFormatter (data) {
|
},
|
||||||
$.tableData = data
|
});
|
||||||
var template = $('#profileTemplate').html()
|
|
||||||
var view = ''
|
|
||||||
$.each(data, function (i, row) {
|
|
||||||
view += template
|
|
||||||
.replace('%IMAGE%', getImageUrl(row.status))
|
|
||||||
.replace('%radarIp%', row.radarIp)
|
|
||||||
.replace('%radarLocation%', row.radarLocation)
|
|
||||||
})
|
|
||||||
|
|
||||||
return `<div class="row mx-0">${view}</div>`
|
// var tableData = [];
|
||||||
}
|
//
|
||||||
function getImageUrl(status) {
|
// $(function() {
|
||||||
if (status === 1) {
|
// var options = {
|
||||||
|
// url: prefix + "/list",
|
||||||
|
// showSearch: false,
|
||||||
|
// showRefresh: false,
|
||||||
|
// showToggle: false,
|
||||||
|
// showColumns: false,
|
||||||
|
// showExport: true,
|
||||||
|
// columns: [
|
||||||
|
// {
|
||||||
|
// field : 'radarIp',
|
||||||
|
// title : '雷达ip'
|
||||||
|
// },
|
||||||
|
// {
|
||||||
|
// field : 'radarLocation',
|
||||||
|
// title : '用户手机'
|
||||||
|
// },
|
||||||
|
// {
|
||||||
|
// field: 'status',
|
||||||
|
// title: '用户状态',
|
||||||
|
// align: 'center',
|
||||||
|
// formatter: function(value, row, index) {
|
||||||
|
// return $.table.selectDictLabel(datas, value);
|
||||||
|
// }
|
||||||
|
// },
|
||||||
|
// {
|
||||||
|
// title: '操作',
|
||||||
|
// align: 'center',
|
||||||
|
// formatter: function(value, row, index) {
|
||||||
|
// var actions = [];
|
||||||
|
// actions.push('<a class="btn btn-success btn-xs" href="javascript:;"><i class="fa fa-edit"></i>编辑</a> ');
|
||||||
|
// actions.push('<a class="btn btn-danger btn-xs" href="javascript:;"><i class="fa fa-remove"></i>删除</a>');
|
||||||
|
// return actions.join('');
|
||||||
|
// }
|
||||||
|
// }]
|
||||||
|
// };
|
||||||
|
// $.table.init(options);
|
||||||
|
// });
|
||||||
|
//
|
||||||
|
|
||||||
return "http://localhost/img/radarGreen.png";
|
// function customViewFormatter (data) {
|
||||||
} else if (status === 0) {
|
// $.tableData = data
|
||||||
return "http://localhost/img/radarRed.jpg";
|
// var template = $('#profileTemplate').html()
|
||||||
}
|
// var view = ''
|
||||||
}
|
// $.each(data, function (i, row) {
|
||||||
|
// view += template
|
||||||
|
// .replace('%IMAGE%', getImageUrl(row.status))
|
||||||
|
// .replace('%radarIp%', row.radarIp)
|
||||||
|
// .replace('%radarLocation%', row.radarLocation)
|
||||||
|
// })
|
||||||
|
//
|
||||||
|
// return `<div class="row mx-0">${view}</div>`
|
||||||
|
// }
|
||||||
|
// function getImageUrl(status) {
|
||||||
|
// if (status === 1) {
|
||||||
|
//
|
||||||
|
// return "http://localhost/img/radarGreen.png";
|
||||||
|
// } else if (status === 0) {
|
||||||
|
// return "http://localhost/img/radarRed.jpg";
|
||||||
|
// }
|
||||||
|
// }
|
||||||
</script>
|
</script>
|
||||||
</body>
|
</body>
|
||||||
</html>
|
</html>
|
||||||
Loading…
Reference in New Issue