初始化

This commit is contained in:
2025-11-26 11:32:30 +08:00
commit 2163829349
1853 changed files with 1896668 additions and 0 deletions

View File

@@ -0,0 +1,446 @@
<style>
.paraarea-hide {
display: none;
}
</style>
<link href="~/Content/Adaptive.css" rel="stylesheet" />
<main>
@*<section class="row" aria-labelledby="aspnetTitle">
<h1 id="aspnetTitle">MQTT服务器的Web端API</h1>
<p class="lead">本服务器可以接受MQTT服务器转发的设备上报消息也可以通过MQTT服务器转发消息到设备。</p>
</section>*@
<div class="row">
<nav class="navbar navbar-expand-sm navbar-toggleable-sm navbar-dark bg-dark">
<div class="container">
@Html.ActionLink("查看设备", "Index", "Home", new { area = "" }, new { @class = "navbar-brand" })
@Html.ActionLink("查看所有设备离在线记录", "Viewofflinerecordsofalldevices", "Home", new { area = "" }, new { @class = "navbar-brand" })
<button type="button" class="navbar-toggler" data-bs-toggle="collapse" data-bs-target=".navbar-collapse" title="切换导航" aria-controls="navbarSupportedContent"
aria-expanded="false" aria-label="Toggle navigation">
<span class="navbar-toggler-icon"></span>
</button>
@*<div class="collapse navbar-collapse d-sm-inline-flex justify-content-between">
<ul class="navbar-nav flex-grow-1">
<li>@Html.ActionLink("API", "Index", "Help", new { area = "" }, new { @class = "nav-link" })</li>
</ul>
</div>*@
</div>
</nav>
<section class="col-md-9" aria-labelledby="gettingStartedTitle">
@*<h2 id="gettingStartedTitle">设备上报消息</h2>
<p>所有按规则转发的设备上报消息</p>*@
<div>
<form class="row g-3">
<div class="col-auto">
<label for="inputPassword2" class="visually-hidden">设备名称</label>
<input type="text" class="form-control" id="inputPassword2" placeholder="请输入设备名称" onblur="SelectBYNmae()">
</div>
<div class="col-auto">
<button type="button" class="btn btn-light mb-3" onclick="getshebebyname()">查询</button>
</div>
<div class="col-md-4">
<select id="inputState" class="form-select" onchange="SelectStatus()">
<option value="1">在线</option>
<option value="0">不在线</option>
<option value="3">未使用</option>
<option selected value="-1">全部</option>
</select>
</div>
</form>
@*<button onclick="toggleAutoGet()" class="col-md-6">打开/关闭自动获取上报消息</button>*@
@*<button onclick="RefreshDevice()" class="col-md-12">刷新设备</button>*@
</div>
<div class="box">
<div class="box-body">
<div id="gridwrapper" class="dataTables_wrapper form-inline dt-bootstrap">
<div class="row"><div class="col-sm-6"></div><div class="col-sm-6"></div></div>
<div class="row">
<div class="col-md-12">
<div id="gridtable">
</div>
</div>
</div>
@*<div class="row" style="width: 100%;"><button onclick="getAllHistoryData()" class="btn btn-light">加载更多</button></div>*@
</div>
</div>
</div>
</section>
</div>
</main>
<script>
var gCurrentProduct = "";
var gCurrentDevice = "";
var gProductIDKey = "HICL5RNXAU";
var gTableDataMap = new Map();
var gDeviceArr = new Array();
function SelectBYNmae() {
var lockm = document.querySelector("#inputPassword2").value;
var myselect = document.getElementById("inputState");
var index = myselect.selectedIndex;
var zhuant = myselect.options[index].value;
var text = myselect.options[index].text;
getAllHistoryData(lockm, zhuant)
}
function getshebebyname() {
var lockm = document.querySelector("#inputPassword2").value;
var myselect = document.getElementById("inputState");
var index = myselect.selectedIndex;
var zhuant = myselect.options[index].value;
var text = myselect.options[index].text;
getAllHistoryData(lockm, zhuant)
}
$(function () {
var lockm = document.querySelector("#inputPassword2").value;
var myselect = document.getElementById("inputState");
var index = myselect.selectedIndex;
var zhuant = myselect.options[index].value;
var text = myselect.options[index].text;
//selectinfo()
getAllHistoryData(lockm, zhuant)
setInterval(() => {
/* selectinfo()*/
var lockm = document.querySelector("#inputPassword2").value;
var myselect = document.getElementById("inputState");
var index = myselect.selectedIndex;
var zhuant = myselect.options[index].value;
/* var text = myselect.options[index].text;*/
getAllHistoryData(lockm, zhuant)
}, 60000)
});
function SelectStatus() {
/* selectinfo()*/
var lockm = document.querySelector("#inputPassword2").value;
var myselect = document.getElementById("inputState");
var index = myselect.selectedIndex;
var zhuant = myselect.options[index].value;
var text = myselect.options[index].text;
getAllHistoryData(lockm, zhuant)
}
function selectinfo() {
fetch("/api/Logs")
.then(function (jsondata) {
});
}
function toggleAutoGet() {
if (gRunning == 1) {
clearTimeout(gRetTimerId);
gRunning = 0;
}
else {
gRetTimerId = setTimeout(getLogContent, gDelayTime);
gRunning = 1;
}
};
function getAllHistoryData(lockm, zhuant) {
var lockm = document.querySelector("#inputPassword2").value;
var myselect = document.getElementById("inputState");
var index = myselect.selectedIndex;
var zhuant = myselect.options[index].value;
var text = myselect.options[index].text;
fetch("/api/Logs/?Name=" + lockm + "&zhant=" + zhuant)
.then(resp => resp.json())
.then(function (jsondata) {
var arrRef = jsondata;
getLatestData(arrRef);
fillTable(sortByDevice());
});
};
function getLatestData(arrRef) {
gTableDataMap = new Map();
/* debugger*/
for (var i = 0; i < arrRef.length; i++) {
let tmp2Part = arrRef[i].split(",");
let devicename = tmp2Part[0].split("")[1];
let Online = tmp2Part[1].split("")[1];
let districtinfo = tmp2Part[2].split("")[1];
let LastUpdateTime = tmp2Part[3].split("")[1];
let powerintakestatus = tmp2Part[4].split("")[1];
let Power = tmp2Part[5].split("")[1];
let pir1status = tmp2Part[6].split("")[1];
let pir2status = tmp2Part[7].split("")[1];
let pir3status = tmp2Part[8].split("")[1];
let pir4status = tmp2Part[9].split("")[1];
let gatemagnetstatus = tmp2Part[10].split("")[1];
let pir5status = tmp2Part[11].split("")[1];
let pir6status = tmp2Part[12].split("")[1];
let pir7status = tmp2Part[13].split("")[1];
let pir8status = tmp2Part[14].split("")[1];
let powerOnEquipment = tmp2Part[15].split("")[1];
let equipmenttime = tmp2Part[16].split("")[1];
let powerOnEquipmentinfo = tmp2Part[17].split("")[1];
let yingjianbanbinfo = tmp2Part[18].split("")[1];
let ruanjianbanbinfo = tmp2Part[19].split("")[1];
let tmpKey = devicename;
gTableDataMap.set(tmpKey, [Online, devicename, districtinfo, LastUpdateTime, powerintakestatus, Power, pir1status, pir2status, pir3status, pir4status, gatemagnetstatus, pir5status, pir6status, pir7status, pir8status, powerOnEquipment, equipmenttime, powerOnEquipmentinfo, yingjianbanbinfo, ruanjianbanbinfo]);
}
};
//init from device list;
function initLatestData() {
for (var i = 0; i < gDeviceArr.length; i++) {
//use product+device as key
let productid = gProductIDKey;
let devicename = gDeviceArr[i].DeviceName;
let tmpKey = productid + "_" + devicename;
let topic = "";
let payload = "";
let seq = "";
let timestamp = "";
let timemills = "";
gTableDataMap.set(tmpKey, [productid, devicename, topic, payload, seq, timestamp, timemills]);
}
}
function sortByDevice() {
var arrayObj = Array.from(gTableDataMap);
arrayObj.sort(function (a, b) { return a[0].localeCompare(b[0]); });
return arrayObj;
}
function fillTable(dataArrFromMap) {
var tarBody = document.querySelector("#gridtable")/*.tBodies[0]*/;
tarBody.innerHTML = '';
var combineHtml = '';
for (let i = 0; i < dataArrFromMap.length; i++) {
/* console.log(dataArrFromMap[i])*/
combineHtml += '<div class="divide-y">';
combineHtml += '<div id="button_' + dataArrFromMap[i][0] + '_' + dataArrFromMap[i][1][0] + '" ondblclick="showHistoryMessage(this)" onclick="presentationinfo(`' + dataArrFromMap[i][0] + '_' + dataArrFromMap[i][1][0] +'`)">'
combineHtml += '<ul class="grid" >'
combineHtml += '<li>'
combineHtml += '<span class="titlestime">'
combineHtml += dataArrFromMap[i][1][1]
combineHtml += '</span>'
if (dataArrFromMap[i][1][0] == 1) {
combineHtml += '<span class="titlestime" style = "color:#00AA55;">'
combineHtml += "在线"
combineHtml += '</span>'
} else if (dataArrFromMap[i][1][0] == 0) {
combineHtml += '<span class="titlestime" style = "color:#FF5511;">'
combineHtml += "离线"
combineHtml += '</span>'
} else {
combineHtml += '<span class="titlestime">'
combineHtml += "未使用"
combineHtml += '</span>'
}
if (dataArrFromMap[i][1][4] == "取电") {
combineHtml += '<span class="analyze">'
combineHtml += '<span style = "background-color:#00AA55; color:#FFFFFF;">取电</span>'
combineHtml += '</span>'
} else {
combineHtml += '<span class="analyze">'
combineHtml += '<span style = "background-color:#FF5511;color:#FFFFFF;">断电</span>'
combineHtml += '</span>'
}
if (dataArrFromMap[i][1][6] == "1") {
combineHtml += '<span class="analyze">'
combineHtml += '<span style="color:#00AA55;">pir1</span>'
combineHtml += '</span>'
} else {
combineHtml += '<span class="analyze">'
combineHtml += '<span style="color:#FF5511;">pir1</span>'
combineHtml += '</span>'
}
if (dataArrFromMap[i][1][7] == "1") {
combineHtml += '<span class="analyze">'
combineHtml += '<span style="color:#00AA55;">pir2</span>'
combineHtml += '</span>'
} else {
combineHtml += '<span class="analyze">'
combineHtml += '<span style="color:#FF5511;">pir2</span>'
combineHtml += '</span>'
}
if (dataArrFromMap[i][1][8] == "1") {
combineHtml += '<span class="analyze">'
combineHtml += '<span style="color:#00AA55;">pir3</span>'
combineHtml += '</span>'
} else {
combineHtml += '<span class="analyze">'
combineHtml += '<span style="color:#FF5511;">pir3</span>'
combineHtml += '</span>'
}
if (dataArrFromMap[i][1][9] == "1") {
combineHtml += '<span class="analyze">'
combineHtml += '<span style="color:#00AA55;">pir4</span>'
combineHtml += '</span>'
} else {
combineHtml += '<span class="analyze">'
combineHtml += '<span style="color:#FF5511;">pir4</span>'
combineHtml += '</span>'
}
if (dataArrFromMap[i][1][11] == "1") {
combineHtml += '<span class="analyze">'
combineHtml += '<span style="color:#00AA55;">pir5</span>'
combineHtml += '</span>'
} else {
combineHtml += '<span class="analyze">'
combineHtml += '<span style="color:#FF5511;">pir5</span>'
combineHtml += '</span>'
}
if (dataArrFromMap[i][1][12] == "1") {
combineHtml += '<span class="analyze">'
combineHtml += '<span style="color:#00AA55;">pir6</span>'
combineHtml += '</span>'
} else {
combineHtml += '<span class="analyze">'
combineHtml += '<span style="color:#FF5511;">pir6</span>'
combineHtml += '</span>'
}
if (dataArrFromMap[i][1][13] == "1") {
combineHtml += '<span class="analyze">'
combineHtml += '<span style="color:#00AA55;">pir7</span>'
combineHtml += '</span>'
} else {
combineHtml += '<span class="analyze">'
combineHtml += '<span style="color:#FF5511;">pir7</span>'
combineHtml += '</span>'
}
if (dataArrFromMap[i][1][14] == "1") {
combineHtml += '<span class="analyze">'
combineHtml += '<span style="color:#00AA55;">pir8</span>'
combineHtml += '</span>'
} else {
combineHtml += '<span class="analyze">'
combineHtml += '<span style="color:#FF5511;">pir8</span>'
combineHtml += '</span>'
}
if (dataArrFromMap[i][1][10] == "1") {
combineHtml += '<span class="analyze">'
combineHtml += '<span style="color:#00AA55;">门磁</span>'
combineHtml += '</span>'
} else {
combineHtml += '<span class="analyze">'
combineHtml += '<span style="color:#FF5511;">门磁</span>'
combineHtml += '</span>'
}
combineHtml += '<span class="analyze">功率:'
combineHtml += dataArrFromMap[i][1][5].substring(0, 7)
combineHtml += 'W</span>'
combineHtml += '<span class="analyze">'
combineHtml += dataArrFromMap[i][1][15]
combineHtml += '</span>'
combineHtml += '<span class="analyze">'
combineHtml += dataArrFromMap[i][1][16]
combineHtml += '</span>'
combineHtml += '</span>'
combineHtml += '<div id="' + dataArrFromMap[i][0] + '_' + dataArrFromMap[i][1][0] +'" style="display:none">'
combineHtml += '<span class="titlestime">硬件版本:'
combineHtml += dataArrFromMap[i][1][18]
combineHtml += '</span>'
combineHtml += '<span class="titlestime">软件版本:'
combineHtml += dataArrFromMap[i][1][19]
combineHtml += '</span>'
combineHtml += '<span class="RawData">异常详情:'
combineHtml += dataArrFromMap[i][1][17]
combineHtml += '</span>'
combineHtml += '<div>'
combineHtml += '<span class="RawData">'
combineHtml += dataArrFromMap[i][1][2]
combineHtml += '</span>'
combineHtml += '</li>'
combineHtml += '</ul>'
combineHtml += '</div>'
combineHtml += '</div>'
}
tarBody.innerHTML = combineHtml;
}
function clearAllMessgeHistory() {
var targetTextDom = document.querySelector("#historypopupmessage");
targetTextDom.innerHTML = "";
targetTextDom.value = "";
}
function clearSelectedMessgeHistory() {
var targetTextDom = document.querySelector("#historypopupmessageselected");
targetTextDom.innerHTML = "";
targetTextDom.value = "";
clearDeviceMessage();
//let time = 2 * 60 * 60 * 1000;
//window.setTimeout(clearDeviceMessage, time)
}
function shijianchuozhuanhuan(timestamp) {
// 此处时间戳以毫秒为单位
let date = new Date(parseInt(timestamp) * 1000);
let Year = date.getFullYear();
let Moth = (date.getMonth() + 1 < 10 ? '0' + (date.getMonth() + 1) : date.getMonth() + 1);
let Day = (date.getDate() < 10 ? '0' + date.getDate() : date.getDate());
let Hour = (date.getHours() < 10 ? '0' + date.getHours() : date.getHours());
let Minute = (date.getMinutes() < 10 ? '0' + date.getMinutes() : date.getMinutes());
let Sechond = (date.getSeconds() < 10 ? '0' + date.getSeconds() : date.getSeconds());
let GMT = Year + '-' + Moth + '-' + Day + ' ' + Hour + ':' + Minute + ':' + Sechond;
return GMT
}
function showHistoryMessage(btnDom) {
var splArr = btnDom.id.split("_");
var productid = splArr[1];
gCurrentProduct = productid;
//refreshDeviceMessage(productid, devicename);
//gotoDownMessageArea(btnDom)
window.location.href = "/Home/RefreshDevice?shebxx=" + btnDom.id
}
let att = "";
function presentationinfo(zhanshiinfo) {
/* console.log(zhanshiinfo)*/
if (att != zhanshiinfo) {
$('#' + zhanshiinfo + '').css("display", "block");
/* $('.' + trdemo + '').css("display", "block");*/
att = zhanshiinfo;
} else {
$('#' + zhanshiinfo + '').css("display", "none");
/* $('.' + trdemo + '').css("display", "none");*/
att = 0;
}
}
</script>

View File

@@ -0,0 +1,778 @@

@{
ViewBag.Title = "Offlinerecord";
}
<nav class="navbar navbar-expand-sm navbar-toggleable-sm navbar-dark bg-dark">
<div class="container">
@Html.ActionLink("查看设备", "Index", "Home", new { area = "" }, new { @class = "navbar-brand" })
<div onclick="fanhshiyic()" style="font-weight:600;">返回上一层</div>
<div id="label_devicekey" style="font-weight:600;"></div>
<button type="button" class="navbar-toggler" data-bs-toggle="collapse" data-bs-target=".navbar-collapse" title="切换导航" aria-controls="navbarSupportedContent"
aria-expanded="false" aria-label="Toggle navigation">
<span class="navbar-toggler-icon"></span>
</button>
</div>
</nav>
<div class="row">
@*<h4 id="label_devicekey" style="display:inline-block;"></h4>*@
<div class="form-group row">
<label for="" class="col-md-1 col-sm-2 col-form-label">时间范围</label>
<div class="col-md-10 col-sm-2">
<div class="row">
<div class="col-md-5 col-sm-2">
<div class="input-group">
<input type="text" class="input-sm form-control mytimer" name="start" id="startTs" readonly="">
<span class="input-group-btn">
<button class="btn default" type="button">
<i class="fa fa-calendar-alt"></i>
</button>
</span>
<select id="startTsBYtimes">
<option value="1">1</option>
<option value="2">2</option>
<option value="3">3</option>
<option value="4">4</option>
<option value="5">5</option>
<option value="6">6</option>
<option value="7">7</option>
<option value="8">8</option>
<option value="9">9</option>
<option value="10">10</option>
<option value="11">11</option>
<option value="12">12</option>
<option value="13">13</option>
<option value="14">14</option>
<option value="15">15</option>
<option value="16">16</option>
<option value="17">17</option>
<option value="18">18</option>
<option value="19">19</option>
<option value="20">20</option>
<option value="21">21</option>
<option value="22">22</option>
<option value="23">23</option>
<option value="24">24</option>
<option value="0" selected>请选择</option>
</select>
</div>
</div>
<div class="col-md-2 col-sm-2">至</div>
<div class="col-md-5 col-sm-2">
<div class="input-group">
<input type="text" class="input-sm form-control mytimer" name="end" id="endTs" readonly="">
<span class="input-group-btn">
<button class="btn default" type="button">
<i class="fa fa-calendar-alt"></i>
</button>
</span>
<select id="endTsBYtimes">
<option value="1">1</option>
<option value="2">2</option>
<option value="3">3</option>
<option value="4">4</option>
<option value="5">5</option>
<option value="6">6</option>
<option value="7">7</option>
<option value="8">8</option>
<option value="9">9</option>
<option value="10">10</option>
<option value="11">11</option>
<option value="12">12</option>
<option value="13">13</option>
<option value="14">14</option>
<option value="15">15</option>
<option value="16">16</option>
<option value="17">17</option>
<option value="18">18</option>
<option value="19">19</option>
<option value="20">20</option>
<option value="21">21</option>
<option value="22">22</option>
<option value="23">23</option>
<option value="24">24</option>
<option value="0" selected>请选择</option>
</select>
</div>
</div>
</div>
</div>
</div>
<div>
<button style="margin:10px;" onclick="SelectedMessgeHistory()" class="btn btn-light">查询</button>
</div>
<div id="main" style=" height: 400px;"></div>
<div id="gridtable"></div>
</div>
<script src="~/Scripts/jquery-3.4.1.min.js"></script>
<script src="~/Scripts/bootstrap.min.js"></script>
<script src="~/plugins/datapicker/bootstrap-datepicker.js"></script>
<script src="~/plugins/datapicker/locales/bootstrap-datepicker.zh-CN.js"></script>
<script src="~/dist/echarts.js"></script>
<link href="~/Content/bootstrap.min.css" rel="stylesheet" />
<link href="~/plugins/datapicker/datepicker3.css" rel="stylesheet" />
<script>
var gCurrentProduct = "";
var gCurrentDevice = "";
var gProductIDKey = "HICL5RNXAU";
var gTableDataMap = new Map();
var gDeviceArr = new Array();
var state=""
var stutate = "";
function fanhshiyic() {
window.location.href = "/Home/RefreshDevice?shebxx=" + stutate
}
function echartsinfo() {
fetch("/api/State/?productid=" + gProductIDKey + "&devicename=" + gCurrentDevice)
.then(resp => resp.json())
.then(function (jsondata) {
var arrRef = jsondata;
getechartsData(arrRef);
var arrlist = fillcharts(sortByDevice());
document.querySelector("#label_devicekey").innerHTML = gCurrentDevice + "在线(" + arrlist[1].value + ")离线(" + arrlist[0].value+")";
});
}
function getechartsData(arrRef) {
gTableDataMap = new Map();
for (var i = 0; i < arrRef.length; i++) {
let tmp2Part = arrRef[i].split(",");
let eventName = tmp2Part[0].split(":")[1];
let shul = tmp2Part[1].split(":")[1];
let tmpKey = eventName;
gTableDataMap.set(tmpKey, [eventName, shul]);
}
};
function fillcharts(dataArrFromMap) {
var arr = [];
for (let i = 0; i < dataArrFromMap.length; i++) {
var eachrts = { value: 0, name: "aa" }
eachrts.value = dataArrFromMap[i][1][1]
eachrts.name = dataArrFromMap[i][1][0] == "EV_ONLINE" ? "在线" : "离线"
arr.push(eachrts)
}
return arr;
}
function sortByDevice() {
var arrayObj = Array.from(gTableDataMap);
/* console.log(arrayObj)*/
arrayObj.sort(function (a, b) {
return a[0].localeCompare(b[0]);
});
return arrayObj;
}
function getUrlParams() {
let url = window.location.search;
let paramsObj = new Object();
if (url.indexOf("?") != -1) {
let str = url.substr(1);
strs = str.split("&");
for (let i = 0; i < strs.length; i++) {
paramsObj[strs[i].split("=")[0]] = decodeURI(strs[i].split("=")[1]);
}
}
return paramsObj;
}
$(function () {
var nnsjd = getUrlParams()
stutate = nnsjd.shebxx
var splArr = nnsjd.shebxx.split("_");
var devicename = splArr[1];
state = splArr[2]
/* console.log(state)*/
gCurrentDevice = devicename;
let startTs = $("#startTs").val();
let endTs = $("#endTs").val();
//startTsBYtimes
//endTsBYtimes
var Status = document.getElementById("startTsBYtimes");
var index = Status.selectedIndex;
var startTsBYtimes = Status.options[index].value;
let startTstimes = timehandle(startTs, startTsBYtimes)
var BYStatus = document.getElementById("endTsBYtimes");
var index = BYStatus.selectedIndex;
var endTsBYtimes = BYStatus.options[index].value;
let endTstimes = timehandle(endTs, endTsBYtimes)
////echart报表方法
echartsinfo();
SelectStatus(gProductIDKey, gCurrentDevice, startTstimes, endTstimes)
});
//查询在线离线日志
function SelectStatus(gProductIDKey, gCurrentDevice, logsStatusBYtimes, logStatusBYStatuss) {
/* console.log("时间:" + logsStatusBYtimes + ",状态:" + logStatusBYStatuss)*/
/* $('#jianzaozhang').css("display", "block");*/
/* $('#shujuzhangshi').css("display", "none");*/
fetch("/api/State/?productid=" + gProductIDKey + "&devicename=" + gCurrentDevice + "&times=" + logsStatusBYtimes + "&Statuss=" + logStatusBYStatuss)
.then(resp => resp.json())
.then(function (jsondata) {
var arrRef = jsondata;
getStatusData(arrRef);
/* console.log(state)*/
var arrayObj = Array.from(gTableDataMap);
gSingleCounterPerHourCacheRangeArray = [];
//初始化原始事件表
/* gSingleCounterPerHourCacheDataArray = arrayObj;*/
//初始化range表,全部使用毫秒数标志。
var tmpStMsTime = 0, tmpEdMsTime = 0;
var spanMs = 0;
//var stTime = $("#startTs").val();
//var edTime = $("#endTs").val();
var stArr = logsStatusBYtimes.split('-').map(it => parseInt(it, 10));
var edArr = logStatusBYStatuss.split('-').map(it => parseInt(it, 10));
var tmpSt = new Date(stArr[0], stArr[1] - 1, stArr[2], 0, 0, 0, 0);
var tmpEd = new Date(edArr[0], edArr[1] - 1, edArr[2], 23, 59, 59, 0);
tmpStMsTime = tmpSt.getTime();
tmpEdMsTime = tmpEd.getTime();
//第一个break pointarrayObj[i][1][1]
if (!isNaN(tmpStMsTime) && !isNaN(tmpEdMsTime)) {
if (arrayObj == false) {
var labelArr = [tmpStMsTime, tmpEdMsTime];
var dataArr = [state, state];
var arr = [];
for (var i = 0; i < labelArr.length; i++) {
let time = shijianchuozhuanhuan(labelArr[i])
arr.push(time)
}
var dom = document.getElementById('main');
var myChart = echarts.init(dom, null, {
renderer: 'canvas',
useDirtyRect: false
});
var app = {};
var option;
option = {
tooltip: {
trigger: 'axis'
},
legend: {
data: ['设备离在线记录']
},
grid: {
left: '3%',
right: '4%',
bottom: '3%',
containLabel: true
},
toolbox: {
feature: {
saveAsImage: {}
}
},
xAxis: {
type: 'category',
boundaryGap: false,
data: arr
},
yAxis: {
type: 'value'
},
series: [
{
name: '设备离在线记录',
type: 'line',
stack: 'Total',
data: dataArr
}
]
};
myChart.setOption(option);
}
else {
if (arrayObj[0][1][1] == "EV_ONLINE") {
gSingleCounterPerHourCacheRangeArray.push({ brk: tmpStMsTime, stat: arrayObj[0][1][1] });
}
else {
gSingleCounterPerHourCacheRangeArray.push({ brk: tmpStMsTime, stat: arrayObj[0][1][1] });
}
for (let i = arrayObj.length - 1; i >= 0; i--) {
/* let ptPos = convertMVCDateToInt(gSingleCounterPerHourCacheDataArray[i].CreateTime);*/
//如果同一时间多个触发,以最后一个为准
let dupPos = -1;
for (let k = 0; k < gSingleCounterPerHourCacheRangeArray.length; k++) {
if (gSingleCounterPerHourCacheRangeArray[k].brk == arrayObj[i][1][3]) {
dupPos = k;
break;
}
}
if (dupPos === -1) //新增一个位置
gSingleCounterPerHourCacheRangeArray.push({ brk: arrayObj[i][1][3], stat: arrayObj[i][1][1] });
else
gSingleCounterPerHourCacheRangeArray[dupPos].stat = arrayObj[i][1][1];//同一时间保留最后一次更新
}
//最后一个break point
if (gSingleCounterPerHourCacheRangeArray[gSingleCounterPerHourCacheRangeArray.length - 1].brk === tmpEdMsTime)//更新
{
//使用数据库的状态值。
} else//添加
{
if (state == 1) {
gSingleCounterPerHourCacheRangeArray.push({ brk: tmpEdMsTime, stat: "EV_ONLINE" });
} else {
gSingleCounterPerHourCacheRangeArray.push({ brk: tmpEdMsTime, stat: "EV_OFFLINE" });
}
}
var labelArr = [];
var dataArr = [];
/* console.log(gSingleCounterPerHourCacheRangeArray)*/
for (var i = 0; i < gSingleCounterPerHourCacheRangeArray.length; i++) {
let time = shijianchuozhuanhuan(gSingleCounterPerHourCacheRangeArray[i].brk)
labelArr.push(time)
let sum;
if (gSingleCounterPerHourCacheRangeArray[i].stat == "EV_ONLINE") {
sum = 1;
dataArr.push(sum)
} else {
sum = 0;
dataArr.push(sum)
}
}
var dom = document.getElementById('main');
var myChart = echarts.init(dom, null, {
renderer: 'canvas',
useDirtyRect: false
});
var app = {};
var option;
option = {
tooltip: {
trigger: 'axis'
},
legend: {
data: ['设备离在线记录']
},
grid: {
left: '3%',
right: '4%',
bottom: '3%',
containLabel: true
},
toolbox: {
feature: {
saveAsImage: {}
}
},
xAxis: {
type: 'category',
boundaryGap: false,
data: labelArr
},
yAxis: {
type: 'value'
},
series: [
{
name: '设备离在线记录',
type: 'line',
stack: 'Total',
data: dataArr
}
]
};
myChart.setOption(option);
//$('#shujuzhangshi').css("display", "block");
//$('#jianzaozhang').css("display", "none");
}
}
else {
var labelArr = [];
var dataArr = [];
for (var i = arrayObj.length-1; i >=0; i--) {
let time = shijianchuozhuanhuan(arrayObj[i][1][3])
labelArr.push(time)
let sum;
if (arrayObj[i][1][1] == "EV_ONLINE") {
sum = 1;
dataArr.push(sum)
} else {
sum = 0;
dataArr.push(sum)
}
}
/* debugger*/
//let dd = arrayObj[0][1][3].split("'");
//console.log(dd)
console.log(arrayObj[0][1][3])
console.log(arrayObj[arrayObj.length - 1][1][3])
const timeSegments = splitTimestamp(parseInt(arrayObj[arrayObj.length - 1][1][3]), parseInt(arrayObj[0][1][3]) ,100)
console.log(timeSegments)
var dom = document.getElementById('main');
var myChart = echarts.init(dom, null, {
renderer: 'canvas',
useDirtyRect: false
});
var app = {};
var option;
option = {
tooltip: {
trigger: 'axis'
},
legend: {
data: ['设备离在线记录']
},
grid: {
left: '3%',
right: '4%',
bottom: '3%',
containLabel: true
},
toolbox: {
feature: {
saveAsImage: {}
}
},
xAxis: {
type: 'category',
boundaryGap: false,
data: labelArr
},
yAxis: {
type: 'value'
},
series: [
{
name: '设备离在线记录',
type: 'line',
stack: 'Total',
data: dataArr
}
]
};
myChart.setOption(option);
}
fillTable(gTableDataMap);
});
}
//function splitTime(startTime, endTime, numberOfSegments) {
// const start = new Date(startTime);
// const end = new Date(endTime);
// const segmentDuration = (end - start) / numberOfSegments;
// const timeSegments = [];
// for (let i = 0; i < numberOfSegments; i++) {
// const segmentStart = new Date(start.getTime() + i * segmentDuration);
// const segmentEnd = new Date(start.getTime() + (i + 1) * segmentDuration);
// timeSegments.push({ start: segmentStart, end: segmentEnd });
// }
// return timeSegments;
//}
function splitTimestamp(startTime, endTime, numberOfSegments) {
const segmentDuration = (endTime - startTime) / numberOfSegments;
const timestampSegments = [];
for (let i = 0; i < numberOfSegments; i++) {
const segmentStart = startTime + i * segmentDuration;
/* let cc = segmentStart.split('-')*/
const segmentEnd = startTime + (i + 1) * segmentDuration;
/* let aa= segmentEnd.split('-')*/
timestampSegments.push({ start: segmentStart, end: segmentEnd });
}
return timestampSegments;
}
function getStatusData(arrRef) {
gTableDataMap = new Map();
/* console.log(arrRef)*/
for (var i = 0; i < arrRef.length; i++) {
let tmp2Part = arrRef[i].split(",");
let devicename = tmp2Part[0].split(":")[1];
let eventName = tmp2Part[1].split(":")[1];
let seq = tmp2Part[2].split(":")[1];
let timemills = tmp2Part[3].split(":")[1];
let reason = tmp2Part[4].split(":")[1];
let id = tmp2Part[5].split(":")[1];
//use product+device as key
let tmpKey = id;
gTableDataMap.set(tmpKey, [devicename, eventName, seq, timemills, reason, id]);
}
/* console.log(gTableDataMap)*/
};
function fillTable(dataArrFromMap) {
/* console.log(dataArrFromMap)*/
var arrayObj = Array.from(dataArrFromMap);
var tarBody = document.querySelector("#gridtable");
tarBody.innerHTML = '';
var combineHtml = '';
for (let i = 0; i < arrayObj.length; i++) {
combineHtml += '<div style="border: 1px solid black; display: grid; grid-template-columns: auto auto;">';
combineHtml += '<div>'
combineHtml += '<div>编号:' + arrayObj[i][1][5] + '</div>'
combineHtml += '<div>timestamp:' + shijianchuozhuanhuan(arrayObj[i][1][3]) + '</div>'
combineHtml += '<div style="' + (arrayObj[i][1][1] == "EV_ONLINE" ? "color:forestgreen;" : "color:red;") + '">原因:' + arrayObj[i][1][4] + '</div>'
combineHtml += '</div>'
/* style = "width:300px"*/
combineHtml += '<div>'
combineHtml += '<div style="' + (arrayObj[i][1][1] == "EV_ONLINE" ? "color:forestgreen;" : "color:red;") + '"> <span style="color:black;">状态:</span>' + (arrayObj[i][1][1] == "EV_ONLINE" ? "在线" : "离线") + '</div>'
combineHtml += '<div>seq:' + arrayObj[i][1][2] + '</div>'
combineHtml += '</div>'
combineHtml += '</div>'
}
tarBody.innerHTML = combineHtml;
}
function shijianchuozhuanhuan(timestamp) {
// 此处时间戳以毫秒为单位
let date = new Date(parseInt(timestamp));
let Year = date.getFullYear();
let Moth = (date.getMonth() + 1 < 10 ? '0' + (date.getMonth() + 1) : date.getMonth() + 1);
let Day = (date.getDate() < 10 ? '0' + date.getDate() : date.getDate());
let Hour = (date.getHours() < 10 ? '0' + date.getHours() : date.getHours());
let Minute = (date.getMinutes() < 10 ? '0' + date.getMinutes() : date.getMinutes());
let Sechond = (date.getSeconds() < 10 ? '0' + date.getSeconds() : date.getSeconds());
let GMT = Year + '-' + Moth + '-' + Day + ' ' + Hour + ':' + Minute + ':' + Sechond;
return GMT
}
function SelectedMessgeHistory() {
let startTs = $("#startTs").val();
let endTs = $("#endTs").val();
//startTsBYtimes
//endTsBYtimes
var Status = document.getElementById("startTsBYtimes");
var index = Status.selectedIndex;
var startTsBYtimes = Status.options[index].value;
if (startTs == undefined || startTs == "" || startTs == null) {
alert("请选择开始时间")
return
}
let startTstimes = timehandle(startTs, startTsBYtimes)
var BYStatus = document.getElementById("endTsBYtimes");
var index = BYStatus.selectedIndex;
var endTsBYtimes = BYStatus.options[index].value;
if (endTs == undefined || endTs == "" || endTs == null) {
alert("请选择结束时间")
return
}
let endTstimes = timehandle(endTs, endTsBYtimes)
///* */ var gCurrentProduct = "";
// var gCurrentDevice = "";
if (startTsBYtimes == 0 || endTsBYtimes == 0) {
startTstimes = startTs + " 00:00:00";
endTstimes = endTs + " 23:59:59"
}
if (startTstimes != "null" && endTstimes != "null") {
if (startTstimes <= endTstimes) {
SelectStatus(gProductIDKey, gCurrentDevice, startTstimes, endTstimes)
//fetch("/api/Logs/?productid=" + gProductIDKey + "&devicename=" + gCurrentDevice + "&stime=" + startTstimes + "&etime=" + endTstimes)
// .then(resp => resp.json())
// .then(function (jsondata) {
// var arrRef = jsondata;
//
// getLogsData(arrRef);
// fillCard(sortByDevice());
// });
} else {
alert("开始时间小于结束时间")
}
} else {
alert("数据不完整")
return
}
//console.log("开始值:" + startTstimes + "结束值:" + endTstimes)
/* getLogContent()*/
}
function timehandle(date, time) {
switch (time) {
case "1":
return date + " " + "0" + time + ":00:00"
break;
case "2":
return date + " " + "0" + time + ":00:00"
break;
case "3":
return date + " " + "0" + time + ":00:00"
break;
case "4":
return date + " " + "0" + time + ":00:00"
break;
case "5":
return date + " " + "0" + time + ":00:00"
break;
case "6":
return date + " " + "0" + time + ":00:00"
break;
case "7":
return date + " " + "0" + time + ":00:00"
break;
case "8":
return date + " " + "0" + time + ":00:00"
break;
case "9":
return date + " " + "0" + time + ":00:00"
break;
case "10":
return date + " " + time + ":00:00"
break;
case "11":
return date + " " + time + ":00:00"
break;
case "12":
return date + " " + time + ":00:00"
break;
case "13":
return date + " " + time + ":00:00"
break;
case "14":
return date + " " + time + ":00:00"
break;
case "15":
return date + " " + time + ":00:00"
break;
case "16":
return date + " " + time + ":00:00"
break;
case "17":
return date + " " + time + ":00:00"
break;
case "18":
return date + " " + time + ":00:00"
break;
case "19":
return date + " " + time + ":00:00"
break;
case "20":
return date + " " + time + ":00:00"
break;
case "21":
return date + " " + time + ":00:00"
break;
case "22":
return date + " " + time + ":00:00"
break;
case "23":
return date + " " + time + ":00:00"
break;
case "24":
return date + " " + "00:00:00"
break;
default:
return "null"
break;
}
}
$('#startTs').datepicker({
language: 'zh-CN', // 中文语言包
autoclose: 1, // 选中日期后自动关闭
format: 'yyyy-mm-dd', // 日期格式
minView: "month", // 最小日期显示单元,这里最小显示月份界面,即可以选择到日*/
/* todayBtn: 1, // 显示今天按钮*/
todayHighlight: 1, // 显示今天高亮
clearBtn: true,//清除按钮
});
$('#endTs').datepicker({
language: 'zh-CN', // 中文语言包
autoclose: 1, // 选中日期后自动关闭
format: 'yyyy-mm-dd', // 日期格式
minView: "month", // 最小日期显示单元,这里最小显示月份界面,即可以选择到日
/* todayBtn: 1, // 显示今天按钮*/
todayHighlight: 1, // 显示今天高亮
clearBtn: true,//清除按钮
});
</script>

File diff suppressed because it is too large Load Diff

View File

@@ -0,0 +1,218 @@

@{
ViewBag.Title = "Viewofflinerecordsofalldevices";
}
<nav class="navbar navbar-expand-sm navbar-toggleable-sm navbar-dark bg-dark">
<div class="container">
@Html.ActionLink("查看设备", "Index", "Home", new { area = "" }, new { @class = "navbar-brand" })
<button type="button" class="navbar-toggler" data-bs-toggle="collapse" data-bs-target=".navbar-collapse" title="切换导航" aria-controls="navbarSupportedContent"
aria-expanded="false" aria-label="Toggle navigation">
<span class="navbar-toggler-icon"></span>
</button>
@*<div class="collapse navbar-collapse d-sm-inline-flex justify-content-between">
<ul class="navbar-nav flex-grow-1">
<li>@Html.ActionLink("API", "Index", "Help", new { area = "" }, new { @class = "nav-link" })</li>
</ul>
</div>*@
</div>
</nav>
<div class="form-group row">
<div>
<label for="" class="col-md-1 col-sm-2 col-form-label">时间范围</label>
<div class="col-md-10 col-sm-2">
<div class="row">
<div class="col-md-5 col-sm-2">
<div class="input-group">
<input type="text" class="input-sm form-control mytimer" name="start" id="startTs" readonly="">
<span class="input-group-btn">
<button class="btn default" type="button">
<i class="fa fa-calendar-alt"></i>
</button>
</span>
</div>
</div>
<div class="col-md-2 col-sm-2">至</div>
<div class="col-md-5 col-sm-2">
<div class="input-group">
<input type="text" class="input-sm form-control mytimer" name="end" id="endTs" readonly="">
<span class="input-group-btn">
<button class="btn default" type="button">
<i class="fa fa-calendar-alt"></i>
</button>
</span>
</div>
</div>
</div>
</div>
<label for="inputPassword2" class="col-md-1 col-sm-2 col-form-label">设备名称</label>
<div class="col-md-5 col-sm-2">
<input type="text" class="form-control" id="inputPassword2" placeholder="请输入设备名称">
</div>
</div>
<div>
</div>
</div>
<div>
<button style="margin:10px;" onclick="SelectedMessgeHistory()" class="btn btn-light">查询</button>
</div>
<div id="gridtable"></div>
<script src="~/Scripts/jquery-3.4.1.min.js"></script>
<script src="~/Scripts/bootstrap.min.js"></script>
<script src="~/plugins/datapicker/bootstrap-datepicker.js"></script>
<script src="~/plugins/datapicker/locales/bootstrap-datepicker.zh-CN.js"></script>
<script src="~/dist/echarts.js"></script>
<link href="~/Content/bootstrap.min.css" rel="stylesheet" />
<link href="~/plugins/datapicker/datepicker3.css" rel="stylesheet" />
<script>
var gTableDataMap = new Map();
var gDeviceArr = new Array();
$(function () {
selectallinfo();
})
function selectallinfo() {
let startTs = $("#startTs").val();
let endTs = $("#endTs").val();
let name = $("#inputPassword2").val()
console.log("ks:" + startTs + "js:" + endTs + "name:" + name)
if (startTs > endTs) {
alert("开始时间大于结束时间,请重新选择时间")
return;
}
if (startTs == undefined || startTs == "" || startTs == null) {
startTs = "null";
} else {
startTs+=" 00:00:00"
}
if (endTs == undefined || endTs == "" || endTs == null) {
endTs = "null";
} else {
endTs +=" 23:59:59"
}
if (name == undefined || name == "" || endTs == name) {
name = "null";
}
//startTsBYtimes
//endTsBYtimes
//var Status = document.getElementById("startTsBYtimes");
//var index = Status.selectedIndex;
//var startTsBYtimes = Status.options[index].value;
//let startTstimes = timehandle(startTs, startTsBYtimes)
//var BYStatus = document.getElementById("endTsBYtimes");
//var index = BYStatus.selectedIndex;
//var endTsBYtimes = BYStatus.options[index].value;
/* string devicename, string stime, string etime*/
fetch("/api/State/?devicename=" + name + "&stime=" + startTs + "&etime=" + endTs)
.then(resp => resp.json())
.then(function (jsondata) {
var arrRef = jsondata;
getStatusData(arrRef);
var arrayObj = Array.from(gTableDataMap);
fillTable(gTableDataMap);
});
}
function getStatusData(arrRef) {
gTableDataMap = new Map();
/* console.log(arrRef)*/
for (var i = 0; i < arrRef.length; i++) {
let tmp2Part = arrRef[i].split(",");
let devicename = tmp2Part[0].split(":")[1];
let eventName = tmp2Part[1].split(":")[1];
let seq = tmp2Part[2].split(":")[1];
let timemills = tmp2Part[3].split(":")[1];
let reason = tmp2Part[4].split(":")[1];
let id = tmp2Part[5].split(":")[1];
//use product+device as key
let tmpKey = id;
gTableDataMap.set(tmpKey, [devicename, eventName, seq, timemills, reason, id]);
}
/* console.log(gTableDataMap)*/
};
function fillTable(dataArrFromMap) {
/* console.log(dataArrFromMap)*/
var arrayObj = Array.from(dataArrFromMap);
var tarBody = document.querySelector("#gridtable");
tarBody.innerHTML = '';
var combineHtml = '';
for (let i = 0; i < arrayObj.length; i++) {
combineHtml += '<div style="border: 1px solid black; display: grid; grid-template-columns: auto auto;">';
combineHtml += '<div>'
combineHtml += '<div>编号:' + arrayObj[i][1][5] + '</div>'
combineHtml += '<div>timestamp:' + shijianchuozhuanhuan(arrayObj[i][1][3]) + '</div>'
combineHtml += '<div style="' + (arrayObj[i][1][1] == "EV_ONLINE" ? "color:forestgreen;" : "color:red;") + '">原因:' + arrayObj[i][1][4] + '</div>'
combineHtml += '</div>'
/* style = "width:300px"*/
combineHtml += '<div>'
combineHtml += '<div style="' + (arrayObj[i][1][1] == "EV_ONLINE" ? "color:forestgreen;" : "color:red;") + '"> <span style="color:black;">状态:</span>' + (arrayObj[i][1][1] == "EV_ONLINE" ? "在线" : "离线") + '</div>'
combineHtml += '<div>seq:' + arrayObj[i][1][2] + '</div>'
combineHtml += '<div>设备名称:' + arrayObj[i][1][0] + '</div>'
combineHtml += '</div>'
combineHtml += '</div>'
}
tarBody.innerHTML = combineHtml;
}
function shijianchuozhuanhuan(timestamp) {
// 此处时间戳以毫秒为单位
let date = new Date(parseInt(timestamp));
let Year = date.getFullYear();
let Moth = (date.getMonth() + 1 < 10 ? '0' + (date.getMonth() + 1) : date.getMonth() + 1);
let Day = (date.getDate() < 10 ? '0' + date.getDate() : date.getDate());
let Hour = (date.getHours() < 10 ? '0' + date.getHours() : date.getHours());
let Minute = (date.getMinutes() < 10 ? '0' + date.getMinutes() : date.getMinutes());
let Sechond = (date.getSeconds() < 10 ? '0' + date.getSeconds() : date.getSeconds());
let GMT = Year + '-' + Moth + '-' + Day + ' ' + Hour + ':' + Minute + ':' + Sechond;
return GMT
}
function SelectedMessgeHistory() {
selectallinfo();
}
$('#startTs').datepicker({
language: 'zh-CN', // 中文语言包
autoclose: 1, // 选中日期后自动关闭
format: 'yyyy-mm-dd', // 日期格式
minView: "month", // 最小日期显示单元,这里最小显示月份界面,即可以选择到日*/
/* todayBtn: 1, // 显示今天按钮*/
todayHighlight: 1, // 显示今天高亮
clearBtn: true,//清除按钮
});
$('#endTs').datepicker({
language: 'zh-CN', // 中文语言包
autoclose: 1, // 选中日期后自动关闭
format: 'yyyy-mm-dd', // 日期格式
minView: "month", // 最小日期显示单元,这里最小显示月份界面,即可以选择到日
/* todayBtn: 1, // 显示今天按钮*/
todayHighlight: 1, // 显示今天高亮
clearBtn: true,//清除按钮
});
</script>