jay.chang/ibms-MCUT
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Merge branch 'MCUT' of https://gitea.mjm-staging.developers-homelab.net/mjm-group/ibms into MCUT

Browse Source
This commit is contained in:
張家睿 2024-05-16 11:07:36 +08:00
commit db6dc0b3bd
1 changed files with 276 additions and 166 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

426
Frontend/_historyData2.html
View File

@ -124,10 +124,7 @@
<div
class="dropdown-menu favorite_dropdown"
aria-labelledby="favoriteDropdownMenu"
>
</div>
></div>
</div>
</div>
</div>
@ -176,6 +173,7 @@
name="favoriteName"
placeholder="名稱"
/>
<small class="input_error_text text-danger"></small>
</div>
</form>
</div>
@ -183,7 +181,9 @@
<button type="button" class="btn btn-secondary" data-dismiss="modal">
關閉
</button>
<button type="button" class="btn btn-primary confirm_modal_btn" >確認</button>
<button type="button" class="btn btn-primary confirm_modal_btn">
確認
</button>
</div>
</div>
</div>
@ -195,18 +195,13 @@
}
</style>
<script
src="https://cdn.jsdelivr.net/npm/popper.js@1.12.9/dist/umd/popper.min.js"
integrity="sha384-ApNbgh9B+Y1QKtv3Rn7W3mgPxhU9K/ScQsAP7hUibX39j7fakFPskvXusvfa0b4Q"
crossorigin="anonymous"
></script>
<script>
var historyTable2 = null;
var buildingTag = null;
pageAct.hisBuiName = "";
hisFirst = true;
var device_list = [];
var temp_device_list = []; // 用來儲存搜尋資料的值
$(function () {
flatpickr(".selectDate", {
locale: "zh_tw",
@ -224,7 +219,6 @@
setDateType(1, $(`[onclick="setDateType(1, this)"]`));
initList();
getFavorite();
loadTable(null);
});
@ -273,41 +267,154 @@
$("[name=subRadio]:checked").parent().addClass("btn-info");
subTag = subRadios.val(); //sub tag
pageAct.selectedSub = subTag;
if (e) {
await getSidebar(subTag);
}
result = true;
}
return result;
}
function showDeviceList(data) {
temp_device_list = data;
let strHtml = "";
let i1 = null,
i2 = null,
first = true;
$.each(data, function (index, building) {
let innerHtml = "";
$.each(building.device_list, function (index2, val2) {
innerHtml += ` <li class="card-header px-5 list-group-item">
<input class="custom-control-input opacity-100 mx-2" style="z-index: 0" type="checkbox" name="Device_list" data-device="${val2.device_number}" value="${val2.device_number}" id="dev_${val2.device_number}">
<p class="h6 mb-0">
${val2.device_name}
</p>
</li>`;
});
function selectAllBuildingDevice(e){
if(e.target.name==='bui_selected'){
let curData = device_list.find(({building_tag})=> e.target.dataset.building ===building_tag)
const curBuisDev = curData.device_list.map(({device_number})=> device_number)
strHtml += ` <div class="card">
<div class="card-header px-3">
<input class="custom-control-input opacity-100" style="z-index: 0" type="checkbox" name="bui_selected" data-building="${building.building_tag}" value="${building.building_tag}" id="bui_${building.building_tag}">
<p class="h6 mb-0 ml-2"
style="cursor:pointer;"
data-toggle="collapse" data-target="#collapse_${building.building_tag}" aria-expanded="false" aria-controls="collapse_${building.building_tag}">
${building.building_name}
</p>
</div>
<div id="collapse_${building.building_tag}" class="collapse" aria-labelledby="heading_${building.building_tag}" data-parent="#accordion">
<div class="card-body">
<ul class="list-group">
${innerHtml}
</ul>
</div>
</div>
</div>`;
});
let wholeContent = `
<div class="card">
<div class="card-header px-3">
<input class="custom-control-input opacity-100 mx-2" style="z-index: 0" type="checkbox" name="bui_selected" data-building="all" value="all" id="bui_all">
<p class="h6 mb-0 ml-3">全選</p>
<div class="card-body">${strHtml}</div>
</div>
</div>
`;
$(".js_nested_list").html(wholeContent);
$(`[data-toggle="collapse"]`).first().click();
}
document
.querySelector("#js_nested_list_filter")
.addEventListener("keyup", (e) => {
if (e.key === "Enter") {
let searchDev = [];
device_list.forEach((d) => {
const devs = d.device_list.filter(({ device_name }) =>
device_name.includes(e.target.value)
);
if (devs.length > 0) {
searchDev = [
...searchDev,
{
...d,
device_list: devs,
},
];
}
});
showDeviceList(searchDev);
}
});
function selectAllBuildingDevice(e) {
let curData = [],
curBuisDev = [],
checkBui = [];
if (e.target.name === "bui_selected") {
if (e.target.dataset.building == "all") {
temp_device_list.forEach(({ device_list }) => {
curData = [...curData, ...device_list];
});
curBuisDev = curData.map(({ device_number }) => device_number);
if (e.target.checked) {
checkBui = temp_device_list.map(({ device_list, building_tag }) => ({
building_tag,
builing_check: true,
}));
} else {
checkBui = temp_device_list.map(({ device_list, building_tag }) => ({
building_tag,
builing_check: false,
}));
}
} else {
curData = temp_device_list.find(
({ building_tag }) => e.target.dataset.building === building_tag
);
curBuisDev = curData.device_list.map(
({ device_number }) => device_number
);
}
const form = $("#device_list_form")[0];
const formData = new FormData(form);
let list = formData.getAll("Device_list")
let list = formData.getAll("Device_list");
if(e.target.checked){
if (e.target.checked) {
list = [...list, ...curBuisDev];
} else {
list = list.filter((dev) => !curBuisDev.includes(dev));
}
list = [...list, ...curBuisDev];
}else{
list = list.filter((dev)=> !curBuisDev.includes(dev))
checkBui.forEach(({ building_tag, builing_check }) => {
if (builing_check) {
$(
`[name="bui_selected"][data-building="${building_tag}"]`
)[0].checked = true;
} else {
$(
`[name="bui_selected"][data-building="${building_tag}"]`
)[0].checked = false;
}
});
$('[name="Device_list"]').each((i, e)=>{
if( list.includes(e.dataset.device)){
$('[name="Device_list"]').each((i, e) => {
if (list.includes(e.dataset.device)) {
e.checked = true;
}else{
} else {
e.checked = false;
}
})
}
});
}
}
document.querySelector(".js_nested_list").addEventListener("change",selectAllBuildingDevice)
document
.querySelector(".js_nested_list")
.addEventListener("change", selectAllBuildingDevice);
// 取得右側sidebar
function getSidebar(subTag) {
@ -321,41 +428,9 @@
e.stopPropagation();
}
function success(res) {
let strHtml = ``;
let i1 = null,
i2 = null,
first = true;
device_list = res.data;
$.each(res.data, function (index, building) {
let innerHtml = "";
$.each(building.device_list, function (index2, val2) {
innerHtml += ` <li class="card-header px-5 list-group-item">
<input class="custom-control-input opacity-100 mx-2" style="z-index: 0" type="checkbox" name="Device_list" data-device="${val2.device_number}" value="${val2.device_number}" id="dev_${val2.device_number}">
<p class="h6 mb-0">
${val2.device_name}
</p>
</li>`;
});
strHtml += ` <div class="card">
<div class="card-header px-5" id="bui_${building.building_tag}">
<input class="custom-control-input opacity-100 mx-2" style="z-index: 0" type="checkbox" name="bui_selected" data-building="${building.building_tag}" value="${building.building_tag}" id="bui_${building.building_tag}">
<p class="h6 mb-0" data-toggle="collapse" data-target="#collapse_${building.building_tag}" aria-expanded="false" aria-controls="collapse_${building.building_tag}">
${building.building_name}
</p>
</div>
<div id="collapse_${building.building_tag}" class="collapse" aria-labelledby="heading_${building.building_tag}" data-parent="#accordion">
<div class="card-body">
<ul class="list-group">
${innerHtml}
</ul>
</div>
</div>
</div>`;
});
$(".js_nested_list").html(strHtml);
temp_device_list = res.data;
showDeviceList(res.data);
$(`[name="Device_list"]`).first().click();
devPointsList();
}
@ -367,8 +442,6 @@
const form = $("#device_list_form")[0];
const formData = new FormData(form);
console.log(formData.get("Device_list"));
let sendData = {
Device_list:
typeof formData.get("Device_list") == "string"
@ -415,7 +488,7 @@
function getData(e) {
e?.preventDefault();
// $(loadEle)?.Loading?.("start");
$(loadEle)?.Loading?.("start");
let sendData = {
Type: pageAct.dateType,
Points: pageAct.devicePoiName,
@ -423,14 +496,13 @@
const timeForm = $("#search_time_form")[0];
const seaerchFormData = new FormData(timeForm);
for (let [key, value] of seaerchFormData) {
console.log(1, key, value);
sendData[key] = value;
}
const form = $("#device_list_form")[0];
const formData = new FormData(form);
sendData["Device_list"] =formData.getAll("Device_list")
sendData["Device_list"] = formData.getAll("Device_list");
objSendData.Data = sendData;
let url = baseApiUrl + "/api/History/GetHistoryData";
@ -438,7 +510,6 @@
url,
objSendData,
function (res) {
console.log(res);
if (res && res.code == "0000") {
loadTable(res.data.items);
}
@ -557,8 +628,11 @@
const form = $("#device_list_form")[0];
const formData = new FormData(form);
sendData["Device_list"] =formData.getAll("Device_list")
objSendData.Data = sendData;
sendData["Device_list"] = formData.getAll("Device_list");
(sendData["Building_tag_list"] = [
...new Set(sendData["Device_list"].map((d) => d.split("_")[1])),
]),
(objSendData.Data = sendData);
$.ajax({
type: "POST",
@ -596,24 +670,27 @@
// }, "POST",true).send();
}
var editGuid = "";
var favorite_setting = [];
function openModal(favorite_guid) {
console.log(favorite_guid);
editGuid = "";
if(favorite_guid){
$("#favoriteName").val(favorite_setting.find((d)=>d.favorite_guid===favorite_guid).favorite_name);
if (favorite_guid) {
$("#favoriteName").val(
favorite_setting.find((d) => d.favorite_guid === favorite_guid)
.favorite_name
);
editGuid = favorite_guid;
}
$('#favoriteModal').modal('show');
$("#favoriteModal").modal("show");
}
function closeModal(){
$('#favoriteModal').modal('hide');
function closeModal() {
$("#favoriteName").val("");
$("#favoriteModal").modal("hide");
}
async function addFavorite() {
$(".input_error_text").text("");
let token = cookies.get("JWT-Authorization");
const form = $("#device_list_form")[0];
const formData = new FormData(form);
@ -621,25 +698,36 @@
const favoriteForm = $("#favoriteForm")[0];
const favoriteFormData = new FormData(favoriteForm);
const favorite_name = favoriteFormData.get("favoriteName");
const json = await fetch(baseApiUrl + "/api/History/SaveHistoryFavorite", {
method: "POST",
headers: {
Authorization: "Bearer " + token,
"Content-Type": 'application/json'
},
body: JSON.stringify({
favorite_name: favoriteFormData.get("favoriteName"),
device_name_tag: $("[name=subRadio]:checked").val(),
Type: pageAct.dateType,
Points: pageAct.devicePoiName,
Device_list,
}),
});
if (favorite_name) {
const json = await fetch(
baseApiUrl + "/api/History/SaveHistoryFavorite",
{
method: "POST",
headers: {
Authorization: "Bearer " + token,
"Content-Type": "application/json",
},
body: JSON.stringify({
favorite_name,
device_name_tag: $("[name=subRadio]:checked").val(),
Type: pageAct.dateType,
Points: pageAct.devicePoiName,
Device_list,
}),
}
);
const res = await json.json();
if(res&&res.code=="0000"){
getFavorite()
const res = await json.json();
if (res && res.code == "0000") {
getFavorite();
closeModal();
} else {
toast_error(res.msg || common.SysErr);
}
} else {
$(".input_error_text").text("請輸入名稱");
}
}
@ -647,21 +735,32 @@
let token = cookies.get("JWT-Authorization");
const favoriteForm = $("#favoriteForm")[0];
const favoriteFormData = new FormData(favoriteForm);
const favorite_name = favoriteFormData.get("favoriteName");
const json = await fetch(baseApiUrl + "/api/History/EditHistoryFavorite", {
method: "POST",
headers: {
Authorization: "Bearer " + token,
"Content-Type": 'application/json'
},
body: JSON.stringify({
favorite_name: favoriteFormData.get("favoriteName"),
favorite_guid,
}),
});
const res = await json.json();
if(res&&res.code=="0000"){
getFavorite()
if (favorite_name) {
const json = await fetch(
baseApiUrl + "/api/History/EditHistoryFavorite",
{
method: "POST",
headers: {
Authorization: "Bearer " + token,
"Content-Type": "application/json",
},
body: JSON.stringify({
favorite_name,
favorite_guid,
}),
}
);
const res = await json.json();
if (res && res.code == "0000") {
getFavorite();
closeModal();
} else {
toast_error(res.msg || common.SysErr);
}
} else {
$(".input_error_text").text("請輸入名稱");
}
}
@ -673,7 +772,7 @@
method: "POST",
headers: {
Authorization: "Bearer " + token,
"Content-Type": 'application/json'
"Content-Type": "application/json",
},
body: JSON.stringify({
favorite_guid,
@ -681,23 +780,23 @@
}
);
const res = await json.json();
if(res&&res.code=="0000"){
getFavorite()
if (res && res.code == "0000") {
getFavorite();
}
}
async function confirmModal(){
console.log(editGuid)
if(editGuid){
editFavorite(editGuid)
async function confirmModal() {
console.log(editGuid);
if (editGuid) {
editFavorite(editGuid);
} else {
addFavorite();
}
else{
addFavorite()
}
closeModal()
}
document.querySelector(".confirm_modal_btn").addEventListener("click", confirmModal)
document
.querySelector(".confirm_modal_btn")
.addEventListener("click", confirmModal);
async function getFavorite() {
let token = cookies.get("JWT-Authorization");
@ -705,17 +804,16 @@
method: "POST",
headers: {
Authorization: "Bearer " + token,
"Content-Type": 'application/json'
"Content-Type": "application/json",
},
});
const res = await json.json();
let str = "";
if (res && res.code == "0000") {
favorite_setting = res.data;
res.data.forEach(
(d) => {
str += `
favorite_setting = res.data;
res.data.forEach((d) => {
str += `
<div class="d-flex justify-content-between align-items-center px-2" >
<button class="dropdown-item p-2" data-function="show" data-favorite="${d.favorite_guid}" style="width: 150px">${d.favorite_name}</button>
<span class="d-flex">
@ -728,9 +826,8 @@
</span>
</div>
`;
}
);
str+=` <div class="dropdown-divider"></div>
});
str += ` <div class="dropdown-divider"></div>
<div
class="dropdown-item d-flex justify-content-between align-items-center px-2"
>
@ -742,37 +839,43 @@
>
新增
</button>
</div>`
</div>`;
$(".favorite_dropdown").html(str);
$(".favorite_dropdown").html(str);
}
}
function getDataFromFavorite(data){
const dev = data.device_list.map(d=>d.split("_")[1]);
const checkBui = device_list.map(({device_list, building_tag})=>({
function getDataFromFavorite(data) {
console.log(data);
const dev = data.device_list.map((d) => d.split("_")[1]);
const checkBui = device_list.map(({ device_list, building_tag }) => ({
building_tag,
builing_check: dev.filter(b=>b===building_tag).length === device_list.length
}))
builing_check:
dev.filter((b) => b === building_tag).length === device_list.length,
}));
checkBui.forEach(({building_tag, builing_check})=>{
if(builing_check){
$(`[name="bui_selected"][data-building="${building_tag}"]`)[0].checked = true
}else{
$(`[name="bui_selected"][data-building="${building_tag}"]`)[0].checked = false
checkBui.forEach(({ building_tag, builing_check }) => {
if (builing_check) {
$(
`[name="bui_selected"][data-building="${building_tag}"]`
)[0].checked = true;
} else {
$(
`[name="bui_selected"][data-building="${building_tag}"]`
)[0].checked = false;
}
})
});
$('[name="Device_list"]').each((i, e)=>{
if(data.device_list.includes(e.dataset.device)){
e.checked = true;
}else{
e.checked = false;
$('[name="Device_list"]').each((i, e) => {
if (data.device_list.includes(e.dataset.device)) {
e.checked = true;
} else {
e.checked = false;
}
})
});
pageAct.devicePoiName = data.points;
pageAct.Type = data.type;
selectSub(_, data.device_name_tag)
selectSub(null, data.device_name_tag);
const elems = $("[data-point]");
elems.each((i, e) => {
let pointName = e.dataset.point;
@ -784,14 +887,21 @@
});
}
document.querySelector(".favorite_dropdown").addEventListener("click",(e)=>{
console.log(e.target, e.target.dataset)
if(e.target.dataset.function == 'edit'){
openModal(e.target.dataset.favorite)
}else if(e.target.dataset.function == 'del') {
delFavorite(e.target.dataset.favorite)
}else if(e.target.dataset.function == 'show'){
getDataFromFavorite(favorite_setting.find((d)=>d.favorite_guid===e.target.dataset.favorite))
}
})
document
.querySelector(".favorite_dropdown")
.addEventListener("click", (e) => {
console.log(e.target, e.target.dataset);
if (e.target.dataset.function == "edit") {
openModal(e.target.dataset.favorite);
} else if (e.target.dataset.function == "del") {
delFavorite(e.target.dataset.favorite);
} else if (e.target.dataset.function == "show") {
console.log(favorite_setting);
getDataFromFavorite(
favorite_setting.find(
(d) => d.favorite_guid === e.target.dataset.favorite
)
);
}
});
</script>