[後台] 新增查詢 Niagara 設備資料
This commit is contained in:
keke
parent
67a441b98b
commit
088552a6bb
@ -52,6 +52,13 @@
|
||||
<div class="card-body row">
|
||||
<div class="col-12">
|
||||
<!-- datatable start -->
|
||||
<div class="btn-group flex-wrap building_select"></div>
|
||||
<hr />
|
||||
<div class="btn-group flex-wrap systemMainType_select"></div>
|
||||
<hr />
|
||||
<div class="btn-group flex-wrap systemSubType_select"></div>
|
||||
<hr />
|
||||
<button class="btn btn-primary" id="search">搜尋</button>
|
||||
<table id="niagara_data_table" class="table table-bordered table-hover m-0 text-center">
|
||||
<thead class="thead-themed">
|
||||
<tr>
|
||||
@ -60,7 +67,7 @@
|
||||
<th>point_name</th>
|
||||
</tr>
|
||||
</thead>
|
||||
<tbody>
|
||||
<tbody class="raw_data">
|
||||
</tbody>
|
||||
</table>
|
||||
</div>
|
||||
@ -79,6 +86,7 @@
|
||||
var buildingId, building;
|
||||
var rawDataImportTable;
|
||||
var ds;
|
||||
var dataInTable;
|
||||
|
||||
var today = new Date();
|
||||
var date = today.getFullYear() + '-' + (today.getMonth() + 1) + '-' + today.getDate();
|
||||
@ -89,6 +97,9 @@
|
||||
|
||||
projectName();
|
||||
rawDataImportTable = $("#niagara_data_table").DataTable({
|
||||
paging: false,
|
||||
searching: false,
|
||||
destroy: true,
|
||||
"columns": [
|
||||
{
|
||||
"data": "value"
|
||||
@ -131,6 +142,8 @@
|
||||
var dateTime = date + ' ' + time;
|
||||
document.getElementById('loadDataText').innerText = "共 " + rel.data.length + " 筆資料 \n" + dateTime;
|
||||
}
|
||||
dataInTable = data;
|
||||
console.log("---", dataInTable);
|
||||
return data;
|
||||
}
|
||||
}
|
||||
@ -253,5 +266,145 @@
|
||||
}
|
||||
}, 'json');
|
||||
}
|
||||
|
||||
let buildingValue, systemMainId, systemMainValue, systemSubId, systemSubValue;
|
||||
|
||||
document.querySelector(".building_select").addEventListener("click", (e) => {
|
||||
buildingValue = e.target.dataset.value;
|
||||
$(".building_select .btn-info.active").removeClass('btn-info active')
|
||||
$(e.target).addClass('btn-info active');
|
||||
})
|
||||
document.querySelector(".systemSubType_select").addEventListener("click", (e) => {
|
||||
systemSubId = e.target.dataset.value;
|
||||
systemSubValue = e.target.dataset.systemValue;
|
||||
$(".systemSubType_select .btn-info.active").removeClass('btn-info active')
|
||||
$(e.target).addClass('btn-info active');
|
||||
})
|
||||
|
||||
$(function () {
|
||||
// 產生所有棟別下拉式選單
|
||||
fetch("/BuildInfo/BuildInfoList", {
|
||||
method: "POST"
|
||||
}).then(res => res.json()).then(({ data }) => {
|
||||
const buildingElement = document.querySelector(".building_select");
|
||||
|
||||
console.log(data);
|
||||
let str = "";
|
||||
data.forEach(({ full_name, building_tag
|
||||
}) => {
|
||||
if (building_tag.includes("$3")) {
|
||||
building_tag = building_tag.replace("$3", "");
|
||||
}
|
||||
str += `<button data-value=${building_tag} class='btn'>${full_name}</button>`;
|
||||
})
|
||||
buildingElement.innerHTML = str;
|
||||
});
|
||||
|
||||
// 產生所有大類系統下拉式選單
|
||||
const systemMainTypeElement = document.querySelector(".systemMainType_select");
|
||||
let init_id = '';
|
||||
fetch("/SystemCategory/SystemMainList", {
|
||||
method: "POST"
|
||||
}).then(res => res.json()).then(({ data }) => {
|
||||
//console.log(data);
|
||||
init_id = data[0].id;
|
||||
//console.log(init_id);
|
||||
let str = "";
|
||||
data.forEach(({ id, system_key, system_value
|
||||
}) => {
|
||||
str += `<button data-value=${id} data-system-value=${system_value} class='btn'>${system_key}</button>`;
|
||||
})
|
||||
systemMainTypeElement.innerHTML = str;
|
||||
FetchSystenSubList(init_id);
|
||||
});
|
||||
|
||||
// 產生所有小類系統下拉式選單
|
||||
systemMainTypeElement.addEventListener("click", (e) => {
|
||||
systemMainId = e.target.dataset.value;
|
||||
systemMainValue = e.target.dataset.systemValue;
|
||||
$(".systemMainType_select .btn-info.active").removeClass('btn-info active')
|
||||
$(e.target).addClass('btn-info active');
|
||||
//console.log(value);
|
||||
|
||||
FetchSystenSubList(systemMainId);
|
||||
})
|
||||
});
|
||||
|
||||
function FetchSystenSubList(id) {
|
||||
var formData = new FormData();
|
||||
formData.append("id", parseInt(id));
|
||||
|
||||
fetch("/SystemCategory/SystemSubList", {
|
||||
method: "POST",
|
||||
body: formData
|
||||
}).then(res => res.json()).then(({ data }) => {
|
||||
const systemSubTypeElement = document.querySelector(".systemSubType_select");
|
||||
|
||||
//console.log(data);
|
||||
let str = "";
|
||||
data.forEach(({ id, system_key, system_value
|
||||
}) => {
|
||||
str += `<button data-value=${id} data-system-value=${system_value} class='btn'>${system_key}</button>`;
|
||||
});
|
||||
systemSubTypeElement.innerHTML = str;
|
||||
})
|
||||
}
|
||||
|
||||
// 查詢功能，查棟別跟大類
|
||||
const searchButton = document.querySelector("#search");
|
||||
searchButton.addEventListener("click", (e) => {
|
||||
//const buildingValue = document.querySelector(".building_select").value;
|
||||
//const systemMainId = document.querySelector(".systemMainType_select").value;
|
||||
//const systemMainValue = document.querySelector(`option[value='${systemMainId}']`).getAttribute("data-system-value");
|
||||
//const systemSubId = document.querySelector(".systemSubType_select").value;
|
||||
//const systemSubValue = document.querySelector(`option[value='${systemSubId}']`).getAttribute("data-system-value");
|
||||
|
||||
console.log("111", buildingValue, systemMainValue);
|
||||
|
||||
const table_body = document.querySelector('.raw_data');
|
||||
let rawdata_table_body = '';
|
||||
let count = 1;
|
||||
//dataInTable.forEach(({ tag_name, value, point_name
|
||||
//}) => {
|
||||
// console.log("111", buildingValue, systemMainValue, systemSubValue);
|
||||
// console.log("222", tag_name.includes(`_${buildingValue}_`), tag_name.includes(`_${systemMainValue}_`), tag_name.includes(`_${systemSubValue}_`));
|
||||
// console.log("333", tag_name, value);
|
||||
// console.log("444", rawdata_table_body);
|
||||
|
||||
// if (tag_name.includes(`_${buildingValue}_`) && tag_name.includes(`_${systemMainValue}_`)) {
|
||||
// console.log("333", tag_name, value);
|
||||
// let odd_or_even = '';
|
||||
// if (count % 2 == 0) {
|
||||
// odd_or_even = 'odd';
|
||||
// } else {
|
||||
// odd_or_even = 'even';
|
||||
// }
|
||||
|
||||
// rawdata_table_body += `<tr role="row" class="${odd_or_even}"><td class="sorting_1 dtr-control">${value}</td><td>${tag_name}</td><td>${point_name}</td></tr>`;
|
||||
// }
|
||||
|
||||
//});
|
||||
//table_body.innerHTML = rawdata_table_body;
|
||||
let search_str = `_${buildingValue}_${systemMainValue}_${systemSubValue}_`;
|
||||
console.log("$$$", search_str, dataInTable.filter(({ tag_name }) => tag_name.includes(search_str)))
|
||||
$("#niagara_data_table").DataTable({
|
||||
paging: false,
|
||||
searching: false,
|
||||
destroy: true,
|
||||
"columns": [
|
||||
{
|
||||
"data": "value"
|
||||
},
|
||||
{
|
||||
"data": "tag_name"
|
||||
},
|
||||
{
|
||||
"data": "point_name"
|
||||
},
|
||||
],
|
||||
data: dataInTable.filter(({ tag_name }) => tag_name.includes(search_str))
|
||||
})
|
||||
})
|
||||
|
||||
</script>
|
||||
}
|
||||
Loading…
Reference in New Issue
Block a user