mirror of
https://github.com/bunkerity/bunkerweb
synced 2026-05-24 09:28:37 +00:00
simple mode change step working
This commit is contained in:
parent
7756cf141c
commit
90e957674c
2 changed files with 69 additions and 21 deletions
|
|
@ -36,8 +36,8 @@ class ServiceModal {
|
|||
);
|
||||
this.nextBtn = this.modal.querySelector("button[data-simple-next]");
|
||||
this.backBtn = this.modal.querySelector("button[data-simple-back]");
|
||||
this.saveSimpleBtn = this.modal.querySelector(
|
||||
"button[data-services-simple-modal-submit]",
|
||||
this.saveSimpleBtn = this.simpleForm.querySelector(
|
||||
"button[data-services-modal-submit]",
|
||||
);
|
||||
// list els
|
||||
this.serverNameInps = this.modal.querySelectorAll(
|
||||
|
|
@ -91,6 +91,7 @@ class ServiceModal {
|
|||
});
|
||||
});
|
||||
});
|
||||
|
||||
this.modal.addEventListener("click", (e) => {
|
||||
// update draft mode
|
||||
try {
|
||||
|
|
@ -126,6 +127,16 @@ class ServiceModal {
|
|||
this.checkVisibleInpsValidity();
|
||||
});
|
||||
|
||||
this.nextBtn.addEventListener("click", () => {
|
||||
this.nextSimpleStep();
|
||||
this.checkVisibleInpsValidity();
|
||||
});
|
||||
|
||||
this.backBtn.addEventListener("click", () => {
|
||||
this.prevSimpleStep();
|
||||
this.checkVisibleInpsValidity();
|
||||
});
|
||||
|
||||
this.container.addEventListener("click", (e) => {
|
||||
//edit action
|
||||
try {
|
||||
|
|
@ -252,7 +263,10 @@ class ServiceModal {
|
|||
const firstStep = this.simpleForm.querySelector("[data-step='1']");
|
||||
firstStep.classList.remove("hidden");
|
||||
// we want to update settings by current security level
|
||||
this.setSettingsByAtt(this.simpleForm);
|
||||
const securityLevelValue = this.simpleForm.querySelector(
|
||||
'[data-setting-select-text="security-level"]',
|
||||
);
|
||||
this.setSettingsByAtt(this.simpleForm, "");
|
||||
}
|
||||
|
||||
nextSimpleStep() {
|
||||
|
|
@ -263,26 +277,59 @@ class ServiceModal {
|
|||
const nextStep = this.simpleForm.querySelector(
|
||||
`[data-step="${+currStepNum + 1}"]`,
|
||||
);
|
||||
const nextStepPlusOne = this.simpleForm.querySelector(
|
||||
`[data-step="${+currStepNum + 2}"]`,
|
||||
);
|
||||
|
||||
// Handle case last step or not
|
||||
if (nextStepPlusOne) {
|
||||
this.nextBtn.classList.remove("hidden");
|
||||
this.saveSimpleBtn.classList.add("hidden");
|
||||
}
|
||||
|
||||
if (!nextStepPlusOne) {
|
||||
this.nextBtn.classList.add("hidden");
|
||||
this.saveSimpleBtn.classList.remove("hidden");
|
||||
}
|
||||
|
||||
// hide current step and show next one
|
||||
currStep.classList.add("hidden");
|
||||
nextStep.classList.remove("hidden");
|
||||
|
||||
this.checkCurrInpSimple();
|
||||
this.updateSimpleActions();
|
||||
}
|
||||
|
||||
prevSimpleStep() {
|
||||
// get current step
|
||||
const currStep = this.simpleForm.querySelector("[data-step]:not(.hidden)");
|
||||
const currStepNum = currStep.getAttribute("data-step");
|
||||
// get next step and next step + 1 to determine if continue or save
|
||||
const prevStep = this.simpleForm.querySelector(
|
||||
`[data-step="${+currStepNum - 1}"]`,
|
||||
);
|
||||
|
||||
// hide current step and show next one
|
||||
currStep.classList.add("hidden");
|
||||
prevStep.classList.remove("hidden");
|
||||
|
||||
this.updateSimpleActions();
|
||||
}
|
||||
|
||||
updateSimpleActions() {
|
||||
const currStep = this.simpleForm.querySelector("[data-step]:not(.hidden)");
|
||||
const currStepNum = currStep.getAttribute("data-step");
|
||||
// get next step and next step + 1 to determine if continue or save
|
||||
const prevStep = this.simpleForm.querySelector(
|
||||
`[data-step="${+currStepNum - 1}"]`,
|
||||
);
|
||||
|
||||
const nextStep = this.simpleForm.querySelector(
|
||||
`[data-step="${+currStepNum + 1}"]`,
|
||||
);
|
||||
|
||||
// Handle case last step or not
|
||||
if (nextStep) {
|
||||
this.nextBtn.classList.remove("hidden");
|
||||
this.saveSimpleBtn.classList.add("hidden");
|
||||
}
|
||||
|
||||
if (!nextStep) {
|
||||
this.nextBtn.classList.add("hidden");
|
||||
this.saveSimpleBtn.classList.remove("hidden");
|
||||
}
|
||||
|
||||
if (prevStep) {
|
||||
this.backBtn.removeAttribute("disabled");
|
||||
}
|
||||
|
||||
if (!prevStep) {
|
||||
this.backBtn.setAttribute("disabled", "");
|
||||
}
|
||||
}
|
||||
|
||||
resetFilterInp() {
|
||||
|
|
|
|||
|
|
@ -126,8 +126,9 @@ class Select {
|
|||
|
||||
selectCustom.querySelector(`[data-setting-select-text]`).textContent =
|
||||
btnValue;
|
||||
//add selected to new value
|
||||
|
||||
selectCustom
|
||||
.querySelector(`[data-setting-select-text]`)
|
||||
.setAttribute("data-value", btnValue);
|
||||
//change style
|
||||
const dropdownEl = btn.closest(`div[data-setting-select-dropdown]`);
|
||||
dropdownEl.classList.add("hidden");
|
||||
|
|
|
|||
Loading…
Reference in a new issue