165 lines
7.1 KiB
HTML
165 lines
7.1 KiB
HTML
<main id="js-page-content" role="main" class="page-content">
|
||
<div class="row">
|
||
<div class="col-sm-12 col-xl-2">
|
||
<div class="bg-success-900 rounded bg-info-gradient">
|
||
<div class="d-flex position-relative py-3 px-4">
|
||
<i class="fal fa-search color-success-700 position-absolute pos-left fs-lg px-3 py-2 mt-1 ml-4"></i>
|
||
<input type="text" id="js_nested_list_filter" class="form-control shadow-inset-1 pl-6 border-success" placeholder="Filter nested items (e.g buttons, chart)">
|
||
</div>
|
||
<!-- nav-menu-reset will reset the font colors -->
|
||
<ul id="js_nested_list" class="nav-menu nav-menu-reset nav-menu-compact bg-success-900 bg-info-gradient mb-sm-4 mb-md-0 rounded" data-nav-accordion="true">
|
||
</ul>
|
||
<div class="filter-message js-filter-message m-0 text-left pl-4 py-3 fw-500"></div>
|
||
</div>
|
||
|
||
</div>
|
||
<div class="col-sm-12 col-xl-10">
|
||
<h1 class="p-2 mb-0">歷史資料瀏覽</h1>
|
||
<div class="row bg-dark p-2 mb-5">
|
||
<div class="col-auto">
|
||
<div class="btn-group">
|
||
<button type="button" class="btn btn-secondary waves-effect waves-themed">日期</button>
|
||
<button type="button" class="btn btn-secondary waves-effect waves-themed">日區間</button>
|
||
<button type="button" class="btn btn-secondary waves-effect waves-themed">月</button>
|
||
</div>
|
||
</div>
|
||
<div class="col-auto">
|
||
<div class="btn-group">
|
||
<button type="button" class="btn btn-secondary waves-effect waves-themed">今天</button>
|
||
<button type="button" class="btn btn-secondary waves-effect waves-themed">昨天</button>
|
||
</div>
|
||
</div>
|
||
<div class="col-auto">
|
||
<div class="form-group">
|
||
<input class="form-control" id="example-date" type="date" name="date" value="2023-07-23">
|
||
</div>
|
||
</div>
|
||
<div class="col-auto">
|
||
<a href="#" class="btn btn-info">查詢</a> <a href="#" class="btn btn-info waves-effect waves-themed">
|
||
<span class="fal fa-file-excel mr-1"></span>
|
||
匯出
|
||
</a>
|
||
</div>
|
||
</div>
|
||
|
||
<div class="row mb-2">
|
||
<div class="btn-group">
|
||
<button type="button" class="btn btn-secondary waves-effect waves-themed">溫度</button>
|
||
<button type="button" class="btn btn-secondary waves-effect waves-themed">輸入電壓</button>
|
||
<button type="button" class="btn btn-secondary waves-effect waves-themed">輸入電流</button>
|
||
</div>
|
||
</div>
|
||
|
||
<div class="row">
|
||
<div class="frame-wrap">
|
||
<table id="tableData" class="table table-bordered table-striped text-center m-0">
|
||
<thead class="thead-themed">
|
||
<tr>
|
||
<th>設備名稱</th>
|
||
<th>數值</th>
|
||
<th>紀錄時間</th>
|
||
</tr>
|
||
</thead>
|
||
<tbody>
|
||
<tr>
|
||
<td>儲冰設備A01</td>
|
||
<td>27.0</td>
|
||
<td>2021-08-01 23:55:00</td>
|
||
</tr>
|
||
</tbody>
|
||
</table>
|
||
</div>
|
||
</div>
|
||
|
||
</div>
|
||
|
||
</div>
|
||
</main>
|
||
|
||
<script>
|
||
|
||
$(function () {
|
||
initList();
|
||
|
||
// default list filter
|
||
initApp.listFilter($('#js_default_list'), $('#js_default_list_filter'));
|
||
// custom response message
|
||
initApp.listFilter($('#js-list-msg'), $('#js-list-msg-filter'));
|
||
//accordion filter
|
||
initApp.listFilter($('#js_list_accordion'), $('#js_list_accordion_filter'));
|
||
// nested list filter
|
||
initApp.listFilter($('#js_nested_list'), $('#js_nested_list_filter'));
|
||
//init navigation
|
||
initApp.buildNavigation($('#js_nested_list'));
|
||
});
|
||
|
||
function initList() {
|
||
let sendData = {
|
||
building_tag: pageAct.buiTag
|
||
}
|
||
objSendData.Data = sendData;
|
||
let url = baseApiUrl + "/api/History/GetMainSub";
|
||
function success(res) {
|
||
let strHtml = ``;
|
||
let sst = '';
|
||
let sstn = '';
|
||
let mst = '';
|
||
|
||
$.each(res.data.history_Main_Systems, function (index, val) {
|
||
strHtml += `<li>
|
||
<a href="#" data-filter-tags="user interface buttons compass action dropdown navigation sidebars" data-maintag="${val.main_system_tag}">
|
||
<span class="nav-link-text">${val.full_name}</span>
|
||
</a>
|
||
<ul style="${index == 0 ? `display:block;` : ``}">`;
|
||
|
||
$.each(val.history_Sub_systems, function (index2, val2) {
|
||
strHtml += `<li>
|
||
<a href="#" onClick="getData('${val.main_system_tag}', '${val2.sub_system_tag}', '${val2.full_name}')" data-filter-tags="user interface buttons" data-subtag="${val2.sub_system_tag}">
|
||
<span class="nav-link-text">
|
||
${val2.full_name} ${val2.sub_system_tag}
|
||
</span>
|
||
</a>
|
||
</li>`;
|
||
|
||
if (index == 0 && index2 == 0) {
|
||
sst = val2.sub_system_tag;
|
||
mst = val.main_system_tag;
|
||
sstn = val2.full_name;
|
||
}
|
||
});
|
||
strHtml += `</ul> </li>`;
|
||
});
|
||
|
||
$('#js_nested_list').html(strHtml);
|
||
getData(mst, sst, sstn);
|
||
}
|
||
ytAjax = new YourTeam.Ajax(url, objSendData, success, null, "POST").send();
|
||
}
|
||
|
||
function getData(mst, sst, sstn) {
|
||
//var dt = new Date();
|
||
//console.log(dt);
|
||
// var start = dt.getFullYear().toString() + "-" + dt.getMonth().toString() + "-" + (dt.getDate()).toString() + "T00:00:00Z";
|
||
//var end = dt.getFullYear().toString() + "-" + dt.getMonth().toString() + "-" + (dt.getDate() + 1).toString() + "T00:00:00Z";
|
||
// console.log(new Date(start).getTime());
|
||
// console.log(new Date(end).getTime());
|
||
getHistoryDataByBaja("TPE_B1_EE_E4", //"TPE_" + pageAct.buiTag + "_" + mst + "_" + sst,
|
||
/*1666396800000,*/
|
||
//1666483200000,
|
||
1668927197000,
|
||
1668963661000,
|
||
sstn,
|
||
"Mitsubishi_Sup",
|
||
callBackFromHistory);
|
||
}
|
||
|
||
function callBackFromHistory(res) {
|
||
//$('#tableData tbody').html();
|
||
console.log(res)
|
||
}
|
||
|
||
function callbackForHistory(result) {
|
||
console.log(result);
|
||
}
|
||
|
||
</script> |