Files
TWA-App/TWASys-App/wwwroot/js/js-page/6101.js
2025-11-18 11:48:01 +07:00

581 lines
27 KiB
JavaScript

import ASpinButton from '/js/libs/js-ASpinButton.js';
import ASlideDown from '/js/libs/js-ASlideDown.js';
import AButton from '/js/libs/js-AButton.js';
import AMultiTag from '/js/libs/js-AMultiTag.js';
import AModal from '/js/libs/js-AModal.js';
import ATab from '/js/libs/js-ATab.js';
import ASelect from '/js/libs/js-ASelect.js';
import AOverlay from '/js/libs/js-AOverlay.js';
import AWizard from '/js/libs/js-AWizard.js';
import AAutoFill from '/js/libs/js-AAutoFill.js';
import ATable from '/js/libs/js-ATable.js';
const tmp = `
<div class="slider-scrollbar" data-scrollbar>
<div class="aslider">
<h4 class="mb-2">Storage Server</h4>
<div class="atabs">
<div class="tab-item">
<a href="javascript:void(0)" class="item active">Add New</a>
</div>
<div class="tab-item">
<a href="javascript:void(0)" class="item">List Storage</a>
</div>
<div class="tab-item">
<a href="javascript:void(0)" class="item">Test</a>
</div>
</div>
<div class="StorageTabs tabcontents">
<div class="d-f f-c tabcontent">
<div class="AWizard tabcontents awStorageConnector">
<div class="tabcontent">
<div class="form-group">
<h5 class="mb-2">Information Storage Configuration </h4>
</div>
<div class="d-f f-c">
<div class="form-group d-f f-c">
<label for="idType">Storage Server Type</label>
<div class="input-group">
<select id="idType" class="aselect dropdown" data-width="auto" data-max-height="250" isSearch></select>
</div>
</div>
<div class="form-group d-f f-c">
<label for="controllerName">Controller Name</label>
<div class="input-group">
<input id="controllerName" type="text" placeholder="Controller Name" validation-isEmpty />
</div>
</div>
<div class="form-group d-f f-c">
<label for="storageName">Storage Name</label>
<div class="input-group">
<input id="storageName" type="text" placeholder="Storage Name" validation-isEmpty />
</div>
</div>
<div class="form-group d-f f-c">
<label for="validDomain">Validation Domain</label>
<div class="input-group">
<select id="validDomain" class="aselect dropdown" data-width="auto" data-max-height="250" isMultiple></select>
</div>
</div>
</div>
</div>
<div class="tabcontent">
<div class="form-group">
<h5 class="mb-2">Microsoft 365 Connnector </h4>
</div>
<div class="form-group d-f f-c">
<label for="clientID">Client ID</label>
<div class="input-group">
<input id="clientID" type="text" placeholder="Client ID" validation-isEmpty />
</div>
</div>
<div class="form-group d-f f-c">
<label for="tenatID">Tenat ID</label>
<div class="input-group">
<input id="tenatID" type="text" placeholder="Tenat ID" validation-isEmpty />
</div>
</div>
<div class="form-group d-f f-c">
<label for="secretID">Secret ID</label>
<div class="input-group">
<input id="secretID" type="text" placeholder="Secret ID" validation-isEmpty />
</div>
</div>
<div class="form-group d-f f-c">
<label for="secretValue">Secret Value</label>
<div class="input-group">
<input id="secretValue" type="password" placeholder="Secret Value" validation-isEmpty />
</div>
</div>
<div class="form-group d-f f-c">
<label for="expiredDate">Expires Date</label>
<div class="input-group">
<input id="expiredDate" type="password" placeholder="Expired Date" validation-isEmpty />
</div>
</div>
<div class="form-group d-f f-c">
<label for="idSiteList">Sites List</label>
<div class="input-group">
<select id="idSiteList" class="aselect dropdown" data-width="auto" data-max-height="250" isSearch></select>
</div>
</div>
<div class="form-group d-f f-c">
<label for="idDrivesList">Drives List</label>
<div class="input-group">
<select id="idDrivesList" class="aselect dropdown" data-width="auto" data-max-height="250" isSearch></select>
</div>
</div>
<div class="form-group d-f f-c">
<label for="sharepointPath">SharePoint Path</label>
<div class="input-group">
<input id="sharepointPath" type="text" placeholder="Client ID" validation-isEmpty />
</div>
</div>
</div>
<div class="tabcontent">
<div class="form-group">
<h5 class="mb-2">Physical Server Connnector </h4>
</div>
<div class="form-group d-f f-c">
<label for="clientID">IP Public</label>
<div class="input-group">
<input id="ipPublic" data-id="publicIP" type="text" placeholder="IP Public" validation-isEmpty />
</div>
</div>
<div class="form-group d-f f-c">
<label for="clientID">IP Private v4</label>
<div class="input-group">
<input id="ipPrivatev4" data-id="privateIP" type="text" placeholder="IP Private v4" validation-isEmpty />
</div>
</div>
<div class="form-group d-f f-c">
<label for="clientID">IP Private v6</label>
<div class="input-group">
<input id="ipPrivatev6" data-id="privateIPv6" type="text" placeholder="IP Private v6" validation-isEmpty />
</div>
</div>
<div class="form-group d-f f-c">
<label for="clientID">OS Name</label>
<div class="input-group">
<input id="osName" data-id="osName" type="text" placeholder="OS Name" validation-isEmpty />
</div>
</div>
<div class="form-group d-f f-c">
<label for="clientID">OS Platform</label>
<div class="input-group">
<input id="osPlatform" data-id="osPlatform" type="text" placeholder="OS Platform" validation-isEmpty />
</div>
</div>
<div class="form-group d-f f-c">
<label for="clientID">OS Version</label>
<div class="input-group">
<input id="osVersion" data-id="osVersion" type="text" placeholder="OS Version" validation-isEmpty />
</div>
</div>
<div class="form-group d-f f-c">
<label for="clientID">OS Kernel</label>
<div class="input-group">
<input id="osKernel" data-id="osKernel" type="text" placeholder="OS Kernel" validation-isEmpty />
</div>
</div>
<div class="form-group d-f f-c">
<label for="clientID">OS Architecture</label>
<div class="input-group">
<input id="osArch" data-id="osArch" type="text" placeholder="OS Architecture" validation-isEmpty />
</div>
</div>
<div class="form-group d-f f-c">
<label for="clientID">Bios Serial Number</label>
<div class="input-group">
<input id="biosSerial" data-id="biosSerial" type="text" placeholder="Bios Serial Number" validation-isEmpty />
</div>
</div>
<div class="form-group d-f f-c">
<label for="clientID">Bios Vendor</label>
<div class="input-group">
<input id="biosVender" data-id="biosVendor" type="text" placeholder="Bios Vendor" validation-isEmpty />
</div>
</div>
<div class="form-group d-f f-c">
<label for="clientID">Bios UUID</label>
<div class="input-group">
<input id="biosUUID" data-id="biosUUID" type="text" placeholder="Bios UUID" validation-isEmpty />
</div>
</div>
<div class="form-group d-f f-c">
<label for="clientID">Socket Number</label>
<div class="input-group">
<input id="socketN" data-id="socket" type="text" placeholder="Socket Number" validation-isEmpty />
</div>
</div>
<div class="form-group d-f f-c">
<label for="clientID">CPU Name</label>
<div class="input-group">
<input id="cpuName" data-id="cpuName" type="text" placeholder="CPU Name" validation-isEmpty />
</div>
</div>
<div class="form-group d-f f-c">
<label for="clientID">Total Ram(GB)</label>
<div class="input-group">
<input id="totalRam" data-id="totalRam" type="text" placeholder="Total Ram" validation-isEmpty />
</div>
</div>
</div>
<div class="tabcontent">
<div class="form-group">
<h5 class="mb-2">Server Authenicator </h4>
</div>
<div class="form-group d-f f-c">
<label for="idToken">Token ID</label>
<div class="input-group">
<input id="idToken" type="text" placeholder="Token ID" validation-isEmpty />
</div>
</div>
<div class="form-group d-f f-c">
<label for="vToken">Token Value</label>
<div class="input-group">
<input id="vToken" type="password" placeholder="Token Value" validation-isEmpty />
</div>
</div>
<div class="form-group d-f f-c">
<label for="idRefreshToken">Refresh Token ID</label>
<div class="input-group">
<input id="idRefreshToken" type="text" placeholder="Refresh Token ID" validation-isEmpty />
</div>
</div>
<div class="form-group d-f f-c">
<label for="refreshTokenValue">Refresh Token Value</label>
<div class="input-group">
<input id="refreshTokenValue" type="password" placeholder="Refresh Token Value" validation-isEmpty />
</div>
</div>
</div>
<div class="tabcontent">
<div class="form-group">
<h5 class="mb-2">Storage Data Summary </h4>
</div>
<div class="form-group mb-0 d-f">
<label>Storage Server Type</label>
<span class="ml-2"></span>
</div>
<div class="form-group mb-0 d-f">
<label>Controller Name</label>
<span class="ml-2"></span>
</div>
<div class="form-group mb-0 d-f">
<label>Storage Name</label>
<span class="ml-2"></span>
</div>
<div class="form-group mb-0 d-f">
<label>Validation Domains</label>
<span class="ml-2"></span>
</div>
</div>
</div>
</div>
<div class="tabcontent">
<div class="storageTb c-table"></div>
<div class="form-group d-f p-0">
<button id="btSaveST" type="button" class="btn btn-effect btn-primary mt-2 waves-effect waves-float d-f a-i-center">Save</button>
</div>
</div>
<div class="tabcontent">
<div>Tab C</div>
</div>
</div>
</div>
</div>
`;
const lay1 = `
<div class="w-100 h-100">
<iframe id="authenMic"></iframe>
</div>
`;
window.L6101 = function () {
var asyncStyleSheets = [
'/css/atg-ui/table.css'
];
window.app.loadCSS(asyncStyleSheets);
var ov = new AOverlay(document.body);
ov.createOverlay();
let tbSS = null;
let eleSS = new ASlideDown(document.querySelectorAll(".aslidedown"));
let pr1 = new Promise(async function (resolve, reject) {
const response = await fetch("/Storage/CheckStorageInit", {
method: 'GET',
headers: {
'Accept': 'application/json'
}
});
const data = await response.json();
if (data.Status == 1) {
if (data.Message == "has") {
eleSS.get(0).disable_Close();
eleSS.get(1).enable_Open();
eleSS.get(2).enable_Open();
} else {
eleSS.get(0).enable_Open();
eleSS.get(1).disable_Close();
eleSS.get(2).disable_Close();
var ele1 = new ASpinButton(document.getElementById("totalSize"));
var ele2 = new AMultiTag(document.getElementById("listStorage"));
const $v = id => (document.getElementById(id)?.value ?? '').trim();
var slider = new AModal(tmp);
slider.createModal("CustomForm", "slider-right");
var Scrollbar = window.Scrollbar;
const mScroll = Scrollbar.init(slider.CustomContainer.querySelector(".slider-scrollbar"), window.scroll_options);
slider.overlay.isCloseOverlay(true);
var tabs = new ATab(slider.CustomContainer.querySelector(".atabs"), slider.CustomContainer.querySelector(".StorageTabs"));
var wrd1 = new AWizard(slider.CustomContainer.querySelector(".awStorageConnector"));
var as = new ASelect(slider.CustomContainer.querySelectorAll(".aselect"));
var asIdType = as.get(0);
wrd1.on("onBeforeBack", (evt) => {
mScroll.scrollTo(0, 0);
});
tabs.on("changed", (e) => {
if (e.tabIndex == 1) {
if (tbSS == null) {
tbSS = new ATable(document.querySelector(".storageTb"), 10);
tbSS.labelID = "idStorageServer";
tbSS.SetScrollBarY(400);
tbSS.AddHeader("Storage Name", "180px", "180px", "storageName");
tbSS.AddHeader("Storage Type", "180px", "180px", "typeName");
tbSS.AddHeader("Controller Name", "180px", "180px", "controllerID");
tbSS.AddHeader("Create Date", "240px", "240px", "createDate");
tbSS.IsCheckBox(true);
tbSS.LoadDataUrl("/Storage/GetStorage");
} else {
// tb.RefreshCurrentPage();
}
}
});
wrd1.on("onAfterNext", (evt) => {
if (evt.indexPage > 0) {
if (as.get(0).isLockElement() || as.get(1).isLockElement()) {
return;
}
switch (asIdType.getSelectedItem().vSearch) {
case "Microsoft Cloud":
break;
case "Physical Server":
if (evt.indexPage > 3) {
(async () => {
const fd = new FormData();
fd.append('StorageTypeID', asIdType.getSelectedItem()?.id ?? '');
fd.append('ControllerName', $v('controllerName'));
fd.append('StorageName', $v('storageName'));
fd.append('IpPublic', $v('ipPublic'));
fd.append('IpPrivatev4', $v('ipPrivatev4'));
fd.append('IpPrivatev6', $v('ipPrivatev6'));
fd.append('OsName', $v('osName'));
fd.append('OsPlatform', $v('osPlatform'));
fd.append('OsVersion', $v('osVersion'));
fd.append('OsKernel', $v('osKernel'));
fd.append('OsArch', $v('osArch'));
fd.append('BiosSN', $v('biosSerial'));
fd.append('BiosVendor', $v('biosVender'));
fd.append('BiosUUID', $v('biosUUID'));
const i = 0;
as.get(1).multiSelectedItem.forEach((item) => {
fd.append(`ValidationDomains[${i}].IdValidationDomain`, item.getAttribute("data-value"));
});
fd.append('SocketN', $v('socketN'));
fd.append('CpuName', $v('cpuName'));
fd.append('TotalRam', $v('totalRam'));
fd.append('TokenID', $v('idToken'));
fd.append('TokenValue', $v('vToken'));
fd.append('RTokenID', $v('idRefreshToken'));
fd.append('RTokenValue', $v('refreshTokenValue'))
const response = await fetch("/Storage/SetStorageData", {
method: 'POST',
body: fd
});
})();
}
break;
}
}
});
wrd1.on("onBeforeNext", (evt) => {
mScroll.scrollTo(0, 0);
if (evt.indexPage == 0) {
if (as.get(0).isLockElement() || as.get(1).isLockElement()) {
wrd1.isStopNextPage = true;
return;
} else {
wrd1.isStopNextPage = false;
}
let flag = false;
if ($v('controllerName').length == 0) {
flag = true;
}
if ($v('storageName').length == 0) {
flag = true;
}
if (as.get(1).multiSelectedItem.length == 0) {
flag = true;
}
if (flag) {
wrd1.isStopNextPage = true;
return;
} else {
wrd1.isStopNextPage = false;
}
switch (asIdType.getSelectedItem().vSearch) {
case "Microsoft Cloud":
wrd1.showPage(1);
wrd1.hidePage(2);
wrd1.hidePage(3);
break;
case "Physical Server":
wrd1.showPage(2);
wrd1.showPage(3);
wrd1.hidePage(1);
let promise = new Promise(async function (resolve, reject) {
const response = await fetch(`/Storage/GetSysInfo`, {
method: 'GET',
headers: {
'Accept': 'application/json'
}
});
const data = await response.json();
if (data) {
const autoF = new AAutoFill(document.querySelector(".awStorageConnector"));
autoF.fill(data);
}
});
break;
}
} else if (evt.indexPage == 1) {
}
else if (evt.indexPage == 2) {
(async () => {
const response = await fetch(`/Storage/GenerationAccessToken`, {
method: 'GET',
headers: {
'Accept': 'application/json'
}
});
const data = await response.json();
if (data) {
document.getElementById("idToken").value = data.idToken;
document.getElementById("vToken").value = data.tokenValue;
}
})();
(async () => {
const response = await fetch(`/Storage/GenerationAccessToken`, {
method: 'GET',
headers: {
'Accept': 'application/json'
}
});
const data = await response.json();
if (data) {
document.getElementById("idRefreshToken").value = data.idToken;
document.getElementById("refreshTokenValue").value = data.tokenValue;
}
})();
}
}, true);
var asVD = as.get(1);
ele2.on("btnAdd_Click", (e) => {
asIdType.lockElement();
asVD.lockElement();
slider.showModal();
wrd1.renderTab();
let promise = new Promise(function (resolve, reject) {
const xhr = new XMLHttpRequest();
xhr.open("GET", window.GetAbsoluteURL("/Storage/GetTypeStorage"));
xhr.setRequestHeader('Accept', 'application/json; charset=UTF-8');
var f = function (ev) {
if (ev.currentTarget.readyState == 4) {
if (ev.currentTarget.status == 200) {
var obj = JSON.parse(ev.currentTarget.responseText);
var data = JSON.parse(obj.data);
if (data != null && data.length > 0) {
asIdType.element.removeAll();
for (var i = 0; i < data.length; i++) {
asIdType.element.insertAdjacentHTML("beforeend", `<option value="${data[i].ID}">${data[i].Type}</option>`);
}
asIdType.updateItem();
asIdType.unlockElement();
}
}
}
};
xhr.addEventListener("readystatechange", f, false);
xhr.send();
});
let promise1 = new Promise(function (resolve, reject) {
const xhr = new XMLHttpRequest();
xhr.open("GET", window.GetAbsoluteURL("/Storage/GetValidationDomain"));
xhr.setRequestHeader('Accept', 'application/json; charset=UTF-8');
var f = function (ev) {
if (ev.currentTarget.readyState == 4) {
if (ev.currentTarget.status == 200) {
var obj = JSON.parse(ev.currentTarget.responseText);
var data = JSON.parse(obj.data);
if (data != null && data.length > 0) {
asVD.element.removeAll();
for (var i = 0; i < data.length; i++) {
asVD.element.insertAdjacentHTML("beforeend", `<option value="${data[i].ID}">${data[i].Name}</option>`);
}
asVD.updateItem();
asVD.unlockElement();
}
}
}
};
xhr.addEventListener("readystatechange", f, false);
xhr.send();
});
});
let eleAddStorage = document.getElementById("btAddStorage");
let asAddStorage = new AButton(eleAddStorage);
asAddStorage.on("click_btAddStorage", (e) => {
const xhr = new XMLHttpRequest();
xhr.open("POST", "/Storage/AddStorageServer");
xhr.setRequestHeader('Accept', 'application/json; charset=UTF-8');
var data = {
"Name": document.getElementById("inpType").value
};
var f = function (ev) {
if (ev.currentTarget.readyState == 4) {
if (ev.currentTarget.status == 200) {
var obj = JSON.parse(ev.currentTarget.responseText);
if (ev.Status == 0) {
m.AModalOK.title("Message Error", "mess-error");
m.AModalOK.message(ev.Message);
} else {
m.AModalOK.title("Message", "mess-success");
m.AModalOK.message("Row Insert Success!");
}
m.showModal();
}
}
};
xhr.addEventListener("readystatechange", f, false);
xhr.send(JSON.stringify(data));
});
let btSaveST = new AButton(document.getElementById("btSaveST"));
btSaveST.on("click_btSaveST", (evt) => {
const listC = tbSS.absRows.querySelectorAll("input[type=checkbox][rowCheck]:checked");
listC.forEach((el) => {
const rowST = tbSS.data[el.closest("tr").getAttribute("data-id")];
ele2.addItem(rowST.idStorageServer, rowST.storageName, rowST, null);
});
btSaveST.RemoveLoading(evt);
slider.removeModal();
});
}
}
});
Waves.attach('.btn-effect', ['waves-float']);
Waves.init({ duration: 1000, delay: 200 });
}
window.AScript.set("6101", true);