first
This commit is contained in:
465
ManagementApp/wwwroot/js/js-page/6101.js
Normal file
465
ManagementApp/wwwroot/js/js-page/6101.js
Normal file
@ -0,0 +1,465 @@
|
||||
import ASpinButton from '/js/libs/js-ASpinButton.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 ATable from '/js/libs/js-ATable.js';
|
||||
import AOverlay from '/js/libs/js-AOverlay.js';
|
||||
import AWizard from '/js/libs/js-AWizard.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">
|
||||
<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="pathServer">Controller Name</label>
|
||||
<div class="input-group">
|
||||
<input id="pathServer" type="text" placeholder="Controller 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="expiredDate">SharePoint Path</label>
|
||||
<div class="input-group">
|
||||
<input id="expiredDate" type="password" 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 Server</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="clientID">Machine 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="clientID">OS Version</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="clientID">Proccessor ID</label>
|
||||
<div class="input-group">
|
||||
<input id="clientID" type="text" placeholder="Client ID" 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="clientID">IP Server</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="clientID">Machine 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="clientID">OS Version</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="clientID">Proccessor ID</label>
|
||||
<div class="input-group">
|
||||
<input id="clientID" type="text" placeholder="Client ID" validation-isEmpty />
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="tabcontent">
|
||||
<div class="c-table">
|
||||
</div>
|
||||
<div class="form-group d-f">
|
||||
<button id="btAddStorage" type="button" class="btn btn-effect btn-primary mt-2 waves-effect waves-float d-f a-i-center">
|
||||
Next
|
||||
</button>
|
||||
<button id="btReset" type="button" class="btn btn-effect btn-primary mt-2 ml-2 waves-effect waves-float d-f a-i-center">
|
||||
Reset
|
||||
</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();
|
||||
|
||||
|
||||
var ele1 = new ASpinButton(document.getElementById("totalSize"));
|
||||
var ele2 = new AMultiTag(document.getElementById("listStorage"));
|
||||
|
||||
var slider = new AModal(tmp);
|
||||
slider.createModal("CustomForm", "slider-right");
|
||||
var Scrollbar = window.Scrollbar;
|
||||
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(".AWizard"));
|
||||
wrd1.on("onBeforeNext", (evt) => {
|
||||
if (evt.indexPage == 0) {
|
||||
console.log(asIdType.getSelectedItem().vSearch);
|
||||
if (asIdType.isLockElement() && asVD.isLockElement()) {
|
||||
wrd1.isStopNextPage = true;
|
||||
return;
|
||||
} else {
|
||||
wrd1.isStopNextPage = false;
|
||||
}
|
||||
|
||||
switch (asIdType.getSelectedItem().vSearch) {
|
||||
case "Microsoft Cloud":
|
||||
wrd1.showPage(1);
|
||||
wrd1.hidePage(2);
|
||||
break;
|
||||
case "Physical Server":
|
||||
wrd1.showPage(2);
|
||||
wrd1.hidePage(1);
|
||||
break;
|
||||
}
|
||||
|
||||
}
|
||||
}, true);
|
||||
var as = new ASelect(slider.CustomContainer.querySelectorAll(".aselect"));
|
||||
var asIdType = as.get(0);
|
||||
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"));
|
||||
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"));
|
||||
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();
|
||||
});
|
||||
|
||||
});
|
||||
|
||||
Waves.attach('.btn-effect', ['waves-float']);
|
||||
Waves.init({ duration: 1000, delay: 200 });
|
||||
|
||||
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('Content-type', '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));
|
||||
});
|
||||
|
||||
//var btnAdd = document.getElementById("btAdd");
|
||||
|
||||
//var tabs = new ATab(document.querySelector(".atabs"), document.querySelector(".tabcontents"));
|
||||
//var tb = new ATable(document.querySelector(".c-table"), 10);
|
||||
//var btUpdate = new AButton(document.getElementById("btUpdate"));
|
||||
//var btn = new AButton(btnAdd);
|
||||
//var m = new AModal(null);
|
||||
//var mU = new AModal(null);
|
||||
//var btBack = document.getElementById("btBack");
|
||||
//btBack.addEventListener("click", (e) => {
|
||||
// tabs.selectedTab(0);
|
||||
//})
|
||||
//let promise = new Promise(function (resolve, reject) {
|
||||
// tb.AddHeader("ID", "120px", "", "IdTypeStorageServer");
|
||||
// tb.AddHeader("Storage Type Name", "", "240px", "TypeName");
|
||||
// tb.AddHeader("Action", "180px", "", "Action", function (id, obj) {
|
||||
// var ac = document.createElement("div");
|
||||
// ac.classList.add("d-f", "j-c-center");
|
||||
// var d = document.createElement("button");
|
||||
// d.classList.add("btn", "btn-warning", "mr-2");
|
||||
// var ico = document.createElement("span");
|
||||
// ico.classList.add("atg", "atg-pencil");
|
||||
// d.appendChild(ico);
|
||||
// d.addEventListener("click", ((e) => { updateClick.call(tabs, e, id, obj); }));
|
||||
// ac.appendChild(d);
|
||||
// d = document.createElement("button");
|
||||
// d.classList.add("btn", "btn-danger");
|
||||
// var ico = document.createElement("span");
|
||||
// ico.classList.add("atg", "atg-x");
|
||||
// d.appendChild(ico);
|
||||
// ac.appendChild(d);
|
||||
// return ac;
|
||||
// });
|
||||
// tb.SetScrollBarY(300);
|
||||
// tb.IsCheckBox(true);
|
||||
// tb.LoadDataUrl("/Storage/GetTypeStorage");
|
||||
//});
|
||||
|
||||
//m.overlay.setIndex(2101);
|
||||
//m.createModal("OK");
|
||||
//m.on("OK", () => {
|
||||
// btn.RemoveLoading(btnAdd);
|
||||
// tb.RefreshPage(1, true);
|
||||
//});
|
||||
//m.on("Close", () => { btn.RemoveLoading(btnAdd); });
|
||||
//btn.on("click_btAdd", function (e) {
|
||||
// const xhr = new XMLHttpRequest();
|
||||
// xhr.open("POST", "/Storage/AddType");
|
||||
// xhr.setRequestHeader('Content-type', '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));
|
||||
//});
|
||||
|
||||
//tabs.lockTabs.push(1);
|
||||
|
||||
//mU.overlay.setIndex(2101);
|
||||
//mU.createModal("OK");
|
||||
//mU.on("OK", () => {
|
||||
// btUpdate.RemoveLoading(document.getElementById("btUpdate"));
|
||||
// tabs.selectedTab(0);
|
||||
// tb.RefreshCurrentPage();
|
||||
//});
|
||||
//mU.on("Close", () => { btn.RemoveLoading(document.getElementById("btUpdate")); });
|
||||
|
||||
//btUpdate.on("click_btUpdate", (evt) => {
|
||||
// var inp = document.getElementById("inpEType");
|
||||
// var inpID = document.getElementById("inpEID");
|
||||
// if (inpID.value != "") {
|
||||
// const xhr = new XMLHttpRequest();
|
||||
// xhr.open("POST", "/Storage/UpdateType");
|
||||
// xhr.setRequestHeader('Content-type', 'application/json; charset=UTF-8');
|
||||
// var data = {
|
||||
// "ID": inpID.value,
|
||||
// "Name": inp.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) {
|
||||
// mU.AModalOK.title("Message Error", "mess-error");
|
||||
// mU.AModalOK.message(ev.Message);
|
||||
// } else {
|
||||
// mU.AModalOK.title("Message", "mess-success");
|
||||
// mU.AModalOK.message("Row Update Success!");
|
||||
// }
|
||||
// mU.showModal();
|
||||
// }
|
||||
// }
|
||||
|
||||
// };
|
||||
// xhr.addEventListener("readystatechange", f, false);
|
||||
// xhr.send(JSON.stringify(data));
|
||||
// }
|
||||
//});
|
||||
|
||||
//var btSearch = new AButton(document.getElementById("btSearch"));
|
||||
//btSearch.on("click_btSearch", function (evt) {
|
||||
// var fr = new FormData();
|
||||
// fr.append("keyword", document.getElementById("inpKey").value);
|
||||
// tb.LoadDataFirst(fr);
|
||||
// btSearch.RemoveLoading(evt);
|
||||
//});
|
||||
}
|
||||
|
||||
//function updateClick(e, id, obj) {
|
||||
// this.enableTab(1);
|
||||
// this.selectedTab(1);
|
||||
// var inp = document.getElementById("inpEType");
|
||||
// var inpID = document.getElementById("inpEID");
|
||||
// inp.value = obj.TypeName;
|
||||
// inpID.value = obj.IdTypeStorageServer;
|
||||
//}
|
||||
|
||||
|
||||
|
||||
window.AScript.set("6101", true);
|
Reference in New Issue
Block a user