修改时间选择
夜笙歌
2 years ago
parent
02ce084f8e
commit
fce82d7d91
@ -1,217 +1,220 @@
|
||||
<!DOCTYPE html>
|
||||
<html lang="zh" xmlns:th="http://www.thymeleaf.org" xmlns:shiro="http://www.pollix.at/thymeleaf/shiro">
|
||||
<html lang="zh" xmlns:shiro="http://www.pollix.at/thymeleaf/shiro" xmlns:th="http://www.thymeleaf.org">
|
||||
<head>
|
||||
<th:block th:include="include :: header('历史记录')"/>
|
||||
<th:block th:include="include :: header('历史记录')"/>
|
||||
</head>
|
||||
<body class="gray-bg">
|
||||
<div class="container-div">
|
||||
<div class="row">
|
||||
<div class="col-sm-12 search-collapse">
|
||||
<form id="formId">
|
||||
<div class="select-list">
|
||||
<ul>
|
||||
<li>
|
||||
<input type="hidden" id="sensorId" name="sensorId"/>
|
||||
</li>
|
||||
<li class="select-time">
|
||||
<label>采集时间：</label>
|
||||
<input type="text" class="time-input" id="startTime" placeholder="开始时间"
|
||||
name="beginCollectTime"/>
|
||||
<span>-</span>
|
||||
<input type="text" class="time-input" id="endTime" placeholder="结束时间"
|
||||
name="endCollectTime"/>
|
||||
</li>
|
||||
<li>
|
||||
<a class="btn btn-primary btn-rounded btn-sm" onclick="tableRefresh()"><i
|
||||
class="fa fa-search"></i> 搜索</a>
|
||||
|
||||
<a class="btn btn-warning btn-rounded btn-sm" onclick="$.form.reset()"><i
|
||||
class="fa fa-refresh"></i> 重置</a>
|
||||
|
||||
<a class="btn btn-warning btn-rounded btn-sm" onclick="exportData()">
|
||||
<i class="fa fa-download"></i> 导出
|
||||
</a>
|
||||
</li>
|
||||
</ul>
|
||||
</div>
|
||||
</form>
|
||||
<div class="row">
|
||||
<div class="col-sm-12 search-collapse">
|
||||
<form id="formId">
|
||||
<div class="select-list">
|
||||
<div style="position: absolute;top:50%;right:12px;transform: translateY(-50%)">
|
||||
<a class="btn btn-primary btn-rounded btn-sm" onclick="window.history.back()">返回</a>
|
||||
</div>
|
||||
<ul>
|
||||
<li>
|
||||
<input id="sensorId" name="sensorId" type="hidden"/>
|
||||
</li>
|
||||
<li class="select-time">
|
||||
<label>采集时间：</label>
|
||||
<input class="time-input" id="startTime" name="beginCollectTime" placeholder="开始时间"
|
||||
type="text"/>
|
||||
<span>-</span>
|
||||
<input class="time-input" id="endTime" name="endCollectTime" placeholder="结束时间"
|
||||
type="text"/>
|
||||
</li>
|
||||
<li>
|
||||
<a class="btn btn-primary btn-rounded btn-sm" onclick="tableRefresh()"><i
|
||||
class="fa fa-search"></i> 搜索</a>
|
||||
|
||||
<a class="btn btn-warning btn-rounded btn-sm" onclick="$.form.reset()"><i
|
||||
class="fa fa-refresh"></i> 重置</a>
|
||||
|
||||
<a class="btn btn-warning btn-rounded btn-sm" onclick="exportData()">
|
||||
<i class="fa fa-download"></i> 导出
|
||||
</a>
|
||||
</li>
|
||||
</ul>
|
||||
</div>
|
||||
</form>
|
||||
</div>
|
||||
|
||||
<div class="col-sm-12 select-table table-striped">
|
||||
<table id="bootstrap-table"></table>
|
||||
</div>
|
||||
<div class="col-sm-12 select-table table-striped">
|
||||
<table id="bootstrap-table"></table>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<th:block th:include="include :: footer"/>
|
||||
<th:block th:include="include :: datetimepicker-js"/>
|
||||
<!--表格导出-->
|
||||
<th:block th:include="include :: bootstrap-table-export-js" />
|
||||
<th:block th:include="include :: FileSaver-xlsx-Base64-js" />
|
||||
<th:block th:include="include :: bootstrap-table-export-js"/>
|
||||
<th:block th:include="include :: FileSaver-xlsx-Base64-js"/>
|
||||
<script th:inline="javascript">
|
||||
|
||||
var prefix = ctx + "record/recordSensorData";
|
||||
|
||||
$(() => {
|
||||
tableRefresh();
|
||||
})
|
||||
|
||||
const tableRefresh = function () {
|
||||
let sensorId = [[${sensorId}]].split(",");
|
||||
let formData = new FormData();
|
||||
formData.append("sensorId", sensorId[0]);
|
||||
formData.append("sensorType", sensorId[1]);
|
||||
formData.append("beginCollectTime", $("#startTime").val());
|
||||
formData.append("endCollectTime", $("#endTime").val());
|
||||
|
||||
$.ajax({
|
||||
type: "post",
|
||||
url: "/record/recordSensorData/list",
|
||||
contentType: "application/json;charset=utf-8",
|
||||
dataType: "json",
|
||||
data: formData,
|
||||
json: 'callback',
|
||||
processData: false,
|
||||
contentType: false,
|
||||
success: function (json) {
|
||||
|
||||
const sensorTypeArray = getparamsFunction(sensorId[1]);
|
||||
|
||||
const columnsArray = [];
|
||||
|
||||
if (sensorTypeArray.length > 0) {
|
||||
columnsArray.push({
|
||||
field: "uid",
|
||||
title: "设备UID",
|
||||
width: 160,
|
||||
height: 60,
|
||||
colspan: 1,
|
||||
rowspan: 1,
|
||||
align: "center"
|
||||
});
|
||||
|
||||
columnsArray.push({
|
||||
field: "sensorId",
|
||||
title: "传感器编号",
|
||||
width: 160,
|
||||
height: 60,
|
||||
colspan: 1,
|
||||
rowspan: 1,
|
||||
align: "center"
|
||||
});
|
||||
|
||||
columnsArray.push({
|
||||
field: "datatype",
|
||||
title: "类型",
|
||||
width: 160,
|
||||
height: 60,
|
||||
colspan: 1,
|
||||
rowspan: 1,
|
||||
align: "center"
|
||||
});
|
||||
|
||||
if (json.length > 0) {
|
||||
|
||||
const jsonObj = Object.keys(json[0]);
|
||||
for (let i = 0; i < jsonObj.length; i++) {//Object.keys(obj) 获取key名称
|
||||
let property = jsonObj[i];
|
||||
if (property != "uid" && property != "sensorId" && property != "collectTime" && property != "datatype") {
|
||||
columnsArray.push({
|
||||
field: property,
|
||||
title: typeof (sensorTypeArray.find(x => x.paramTitle.includes(property))) == "undefined" ? property : sensorTypeArray.find(x => x.paramTitle.includes(property)).paramText,
|
||||
width: 140,
|
||||
align: "center"
|
||||
});
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
columnsArray.push({
|
||||
field: "collectTime",
|
||||
title: "采集时间",
|
||||
width: 160,
|
||||
height: 60,
|
||||
colspan: 1,
|
||||
rowspan: 1,
|
||||
align: "center",
|
||||
formatter: function(value, row, index) {
|
||||
return value.replace("T"," ");
|
||||
}
|
||||
});
|
||||
}
|
||||
|
||||
|
||||
$('#bootstrap-table').bootstrapTable('destroy');
|
||||
$('#bootstrap-table').bootstrapTable({
|
||||
data: json,
|
||||
striped: true,
|
||||
cache: false,
|
||||
pageNumber: 1,
|
||||
pagination: true,
|
||||
showColumns: true,
|
||||
sidePagination: 'client',
|
||||
pageSize: 10,
|
||||
pageList: [5, 10, 15, 20, 25, 50],
|
||||
showRefresh: true,
|
||||
columns: columnsArray
|
||||
var prefix = ctx + "record/recordSensorData";
|
||||
|
||||
$(() => {
|
||||
tableRefresh();
|
||||
})
|
||||
|
||||
const tableRefresh = function () {
|
||||
let sensorId = [[${sensorId}]].split(",");
|
||||
let formData = new FormData();
|
||||
formData.append("sensorId", sensorId[0]);
|
||||
formData.append("sensorType", sensorId[1]);
|
||||
formData.append("beginCollectTime", $("#startTime").val());
|
||||
formData.append("endCollectTime", $("#endTime").val());
|
||||
|
||||
$.ajax({
|
||||
type: "post",
|
||||
url: "/record/recordSensorData/list",
|
||||
contentType: "application/json;charset=utf-8",
|
||||
dataType: "json",
|
||||
data: formData,
|
||||
json: 'callback',
|
||||
processData: false,
|
||||
contentType: false,
|
||||
success: function (json) {
|
||||
|
||||
const sensorTypeArray = getparamsFunction(sensorId[1]);
|
||||
|
||||
const columnsArray = [];
|
||||
|
||||
if (sensorTypeArray.length > 0) {
|
||||
columnsArray.push({
|
||||
field: "uid",
|
||||
title: "设备UID",
|
||||
width: 160,
|
||||
height: 60,
|
||||
colspan: 1,
|
||||
rowspan: 1,
|
||||
align: "center"
|
||||
});
|
||||
|
||||
columnsArray.push({
|
||||
field: "sensorId",
|
||||
title: "传感器编号",
|
||||
width: 160,
|
||||
height: 60,
|
||||
colspan: 1,
|
||||
rowspan: 1,
|
||||
align: "center"
|
||||
});
|
||||
|
||||
columnsArray.push({
|
||||
field: "datatype",
|
||||
title: "类型",
|
||||
width: 160,
|
||||
height: 60,
|
||||
colspan: 1,
|
||||
rowspan: 1,
|
||||
align: "center"
|
||||
});
|
||||
|
||||
if (json.length > 0) {
|
||||
|
||||
const jsonObj = Object.keys(json[0]);
|
||||
for (let i = 0; i < jsonObj.length; i++) {//Object.keys(obj) 获取key名称
|
||||
let property = jsonObj[i];
|
||||
if (property != "uid" && property != "sensorId" && property != "collectTime" && property != "datatype") {
|
||||
columnsArray.push({
|
||||
field: property,
|
||||
title: typeof (sensorTypeArray.find(x => x.paramTitle.includes(property))) == "undefined" ? property : sensorTypeArray.find(x => x.paramTitle.includes(property)).paramText,
|
||||
width: 140,
|
||||
align: "center"
|
||||
});
|
||||
|
||||
columnsArray.push();
|
||||
},
|
||||
error: function () {
|
||||
alert("错误");
|
||||
}
|
||||
}
|
||||
})
|
||||
}
|
||||
|
||||
const getparamsFunction = function (sensorTypeId) {
|
||||
var returnData;
|
||||
let formData = new FormData();
|
||||
formData.append("sensorTypeId", sensorTypeId);
|
||||
$.ajax({
|
||||
type: "post",
|
||||
url: "/base/sysParamConfig/getParameterNotVisibleFlag",
|
||||
data: formData,
|
||||
contentType: "application/json;charset=utf-8",
|
||||
dataType: "json",
|
||||
json: 'callback',
|
||||
processData: false,
|
||||
contentType: false,
|
||||
async: false,
|
||||
success: function (json) {
|
||||
returnData = json;
|
||||
},
|
||||
error: function () {
|
||||
alert("错误");
|
||||
}
|
||||
|
||||
columnsArray.push({
|
||||
field: "collectTime",
|
||||
title: "采集时间",
|
||||
width: 160,
|
||||
height: 60,
|
||||
colspan: 1,
|
||||
rowspan: 1,
|
||||
align: "center",
|
||||
formatter: function (value, row, index) {
|
||||
return value.replace("T", " ");
|
||||
}
|
||||
});
|
||||
}
|
||||
|
||||
|
||||
$('#bootstrap-table').bootstrapTable('destroy');
|
||||
$('#bootstrap-table').bootstrapTable({
|
||||
data: json,
|
||||
striped: true,
|
||||
cache: false,
|
||||
pageNumber: 1,
|
||||
pagination: true,
|
||||
showColumns: true,
|
||||
sidePagination: 'client',
|
||||
pageSize: 10,
|
||||
pageList: [5, 10, 15, 20, 25, 50],
|
||||
showRefresh: true,
|
||||
columns: columnsArray
|
||||
});
|
||||
return returnData;
|
||||
}
|
||||
|
||||
// 自定义按钮导出数据
|
||||
function exportData(){
|
||||
$('#bootstrap-table').tableExport({
|
||||
type: 'excel',
|
||||
exportDataType: "basic",
|
||||
fileName: '历史数据报表',//下载文件名称
|
||||
});
|
||||
}
|
||||
|
||||
<!-- laydate示例 -->
|
||||
layui.use('laydate', function () {
|
||||
var laydate = layui.laydate;
|
||||
columnsArray.push();
|
||||
},
|
||||
error: function () {
|
||||
alert("错误");
|
||||
}
|
||||
})
|
||||
}
|
||||
|
||||
const getparamsFunction = function (sensorTypeId) {
|
||||
var returnData;
|
||||
let formData = new FormData();
|
||||
formData.append("sensorTypeId", sensorTypeId);
|
||||
$.ajax({
|
||||
type: "post",
|
||||
url: "/base/sysParamConfig/getParameterNotVisibleFlag",
|
||||
data: formData,
|
||||
contentType: "application/json;charset=utf-8",
|
||||
dataType: "json",
|
||||
json: 'callback',
|
||||
processData: false,
|
||||
contentType: false,
|
||||
async: false,
|
||||
success: function (json) {
|
||||
returnData = json;
|
||||
},
|
||||
error: function () {
|
||||
alert("错误");
|
||||
}
|
||||
});
|
||||
return returnData;
|
||||
}
|
||||
|
||||
// 自定义按钮导出数据
|
||||
function exportData() {
|
||||
$('#bootstrap-table').tableExport({
|
||||
type: 'excel',
|
||||
exportDataType: "basic",
|
||||
fileName: '历史数据报表',//下载文件名称
|
||||
});
|
||||
}
|
||||
|
||||
laydate.render({
|
||||
elem: '#startTime',
|
||||
type: 'datetime',
|
||||
trigger: 'click'
|
||||
});
|
||||
<!-- laydate示例 -->
|
||||
layui.use('laydate', function () {
|
||||
var laydate = layui.laydate;
|
||||
|
||||
laydate.render({
|
||||
elem: '#endTime',
|
||||
type: 'datetime',
|
||||
trigger: 'click'
|
||||
});
|
||||
laydate.render({
|
||||
elem: '#startTime',
|
||||
type: 'datetime',
|
||||
trigger: 'click'
|
||||
});
|
||||
|
||||
laydate.render({
|
||||
elem: '#endTime',
|
||||
type: 'datetime',
|
||||
trigger: 'click'
|
||||
});
|
||||
});
|
||||
</script>
|
||||
</body>
|
||||
</html>
|
||||
</html>
|
||||
|
||||
Loading…
Reference in New Issue