Start handling disabled checkboxes + multiples
This commit is contained in:
Théophile Diot
parent
58ab870b2d
commit
8031c5060f
|
|
@ -296,6 +296,10 @@ class ServiceModal {
|
|||
) {
|
||||
inpt.checked = value === "yes" ? true : false;
|
||||
inpt.setAttribute("value", value);
|
||||
if (inpt.hasAttribute("disabled")) {
|
||||
const hidden_inpt = inpt.closest("div[checkbox-handler]").querySelector("input[type='hidden']");
|
||||
hidden_inpt.setAttribute("value", value);
|
||||
}
|
||||
}
|
||||
//for select
|
||||
if (inpt.tagName === "SELECT") {
|
||||
|
|
@ -422,12 +426,14 @@ class Multiple {
|
|||
ctnr.setAttribute("setting-container", newName);
|
||||
//rename input
|
||||
try {
|
||||
const inp = ctnr.querySelector("input");
|
||||
const newInpName = inp
|
||||
.getAttribute("name")
|
||||
.replace("_SCHEMA", "");
|
||||
inp.setAttribute("name", newInpName);
|
||||
inp.setAttribute("id", newInpName);
|
||||
const inps = ctnr.querySelectorAll("input");
|
||||
inps.forEach((inp) => {
|
||||
const newInpName = inp
|
||||
.getAttribute("name")
|
||||
.replace("_SCHEMA", "");
|
||||
inp.setAttribute("name", newInpName);
|
||||
inp.setAttribute("id", newInpName);
|
||||
});
|
||||
} catch (err) {}
|
||||
//rename select
|
||||
try {
|
||||
|
|
@ -615,20 +621,22 @@ class Multiple {
|
|||
setInpInfo(cloneSetting, key, data) {
|
||||
//replace input info
|
||||
try {
|
||||
const inp = cloneSetting.querySelector("input");
|
||||
this.setNameID(inp, key);
|
||||
const inps = cloneSetting.querySelectorAll("input");
|
||||
inps.forEach((inp) => {
|
||||
this.setNameID(inp, key);
|
||||
|
||||
if (inp.getAttribute("type") === "checkbox") {
|
||||
if (data["value"] === "yes") inp.setAttribute("checked", "");
|
||||
if (data["value"] === "no") inp.removeAttribute("checked");
|
||||
inp.setAttribute("default-method", data["method"]);
|
||||
}
|
||||
if (inp.getAttribute("type") === "checkbox") {
|
||||
inp.checked = data["value"] === "yes" ? true : false;
|
||||
if (inp.hasAttribute("disabled")) {
|
||||
const hidden_inp = inp.closest("div[checkbox-handler]").querySelector("input[type='hidden']");
|
||||
hidden_inp.setAttribute("value", data["value"]);
|
||||
}
|
||||
}
|
||||
|
||||
if (inp.getAttribute("type") !== "checkbox") {
|
||||
inp.setAttribute("value", data["value"]);
|
||||
inp.value = data["value"];
|
||||
inp.setAttribute("default-method", data["method"]);
|
||||
}
|
||||
});
|
||||
} catch (err) {}
|
||||
//or select
|
||||
try {
|
||||
|
|
@ -701,8 +709,10 @@ class Multiple {
|
|||
const newName = setting.getAttribute("setting-container");
|
||||
//replace input info
|
||||
try {
|
||||
const inp = setting.querySelector("input");
|
||||
this.setNameID(inp, newName);
|
||||
const inps = setting.querySelectorAll("input");
|
||||
inps.forEach((inp) => {
|
||||
this.setNameID(inp, newName);
|
||||
});
|
||||
} catch (err) {}
|
||||
//or select
|
||||
try {
|
||||
|
|
|
|||
|
|
@ -192,7 +192,9 @@
|
|||
%}" />
|
||||
<input type="hidden" name="{{setting}}" value="{% if
|
||||
setting in ["AUTOCONF_MODE", "SWARM_MODE", "KUBERNETES_MODE"] or global_config[setting]['method'] != 'ui' and global_config[setting]['method']
|
||||
!= 'default' %}{{global_config[setting]['value']}}{% else %}no{% endif %}" default-value="no" default-method="default" />
|
||||
!= 'default' %}{{global_config[setting]['value']}}{% else %}no{% endif %}" default-value="{% if
|
||||
setting in ["AUTOCONF_MODE", "SWARM_MODE", "KUBERNETES_MODE"] or global_config[setting]['method'] != 'ui' and global_config[setting]['method']
|
||||
!= 'default' %}{{global_config[setting]['value']}}{% else %}no{% endif %}" default-method="default" />
|
||||
<svg
|
||||
checkbox-handler="{{value['id']}}"
|
||||
class="pointer-events-none {% if global_config[setting]['method'] != 'ui' and global_config[setting]['method'] != 'default' %} pointer-events-none {% else %} cursor-pointer {% endif %} absolute fill-white dark:fill-gray-300 left-0 top-0 translate-x-1 translate-y-2 h-3 w-3"
|
||||
|
|
@ -289,10 +291,9 @@
|
|||
{% if value["type"] != "select" and value["type"] != "check" %}
|
||||
<div class="relative flex items-center">
|
||||
<input
|
||||
default-value="{{global_config[setting]['value']}}" default-method="{{global_config[setting]['method']}}"
|
||||
{% if global_config[setting]['method'] != 'ui' and global_config[setting]['method'] != 'default' %} disabled {% endif %} id="{{setting}}" name="{{setting}}"
|
||||
default-value="{{value['default']}}" default-method="default" id="{{setting}}" name="{{setting}}"
|
||||
class="outline-none dark:opacity-90 dark:border-slate-600 dark:bg-slate-700 dark:text-gray-300 disabled:opacity-75 focus:border-gray-300/0 focus:ring-1 focus:valid:ring-green-500 focus:invalid:ring-red-500 text-sm leading-5.6 ease block w-full appearance-none rounded-lg border border-solid border-gray-300 bg-white bg-clip-padding px-1.5 py-1 md:px-3 md:py-2 font-normal text-gray-700 transition-all placeholder:text-gray-500 disabled:bg-gray-400 dark:disabled:bg-gray-800 dark:disabled:border-gray-800 dark:disabled:text-gray-300 disabled:text-gray-700"
|
||||
value="{% if global_config[setting]['value'] %} {{global_config[setting]['value']}} {% else %} {{value['default']}} {% endif %}" type="{{value['type']}}" pattern="{{value['regex']|safe}}" />
|
||||
value="{{value['default']}}" type="{{value['type']}}" pattern="{{value['regex']|safe}}" />
|
||||
|
||||
{% if value['type'] == "password" %}
|
||||
<div setting-password-container class="absolute flex right-2 h-5 w-5">
|
||||
|
|
@ -311,11 +312,11 @@
|
|||
<!-- select -->
|
||||
{% if value["type"] == "select" %}
|
||||
<!-- default hidden-->
|
||||
<select default-method="{{global_config[setting]['method']}}" default-value="{{value['default']}}"
|
||||
<select default-method="default" default-value="{{value['default']}}"
|
||||
id="{{setting}}_SCHEMA" name="{{setting}}_SCHEMA" select-default="{{value['id']}}" type="form-select" id="{{setting}}" name="{{setting}}"
|
||||
class="hidden">
|
||||
{% for item in value['select'] %}
|
||||
<option value="{{item}}" {% if global_config[setting]['value'] and global_config[setting]['value'] == item or not global_config[setting]['value'] and value['default'] == item %} selected{% endif %}>{{item}}</option>
|
||||
<option value="{{item}}" {% if value['default'] == item %} selected {% endif %}>{{item}}</option>
|
||||
{% endfor %}
|
||||
</select>
|
||||
<!-- end default hidden-->
|
||||
|
|
@ -323,20 +324,12 @@
|
|||
<!--custom-->
|
||||
<div select-container class="relative">
|
||||
<button
|
||||
{% if global_config[setting]['method'] != 'ui' and global_config[setting]['method'] != 'default' %} disabled {% endif %}
|
||||
setting-select="{{value['id']}}"
|
||||
default-value="{{global_config[setting]['value']}}"
|
||||
default-value="{{value['default']}}"
|
||||
type="button"
|
||||
class="disabled:opacity-75 dark:disabled:text-gray-300 disabled:text-gray-700 disabled:bg-gray-400 disabled:border-gray-400 dark:disabled:bg-gray-800 dark:disabled:border-gray-800 duration-300 ease-in-out dark:opacity-90 dark:border-slate-600 dark:bg-slate-700 dark:text-gray-300 focus:border-primary flex justify-between align-middle items-center text-left text-sm leading-5.6 ease w-full rounded-lg border border-solid border-gray-300 bg-white bg-clip-padding px-1.5 py-1 md:px-3 md:py-2 font-normal text-gray-700 transition-all placeholder:text-gray-500"
|
||||
>
|
||||
{% for item in value['select'] %} {% if global_config[setting]['value'] and
|
||||
global_config[setting]['value'] == item %}
|
||||
<span
|
||||
setting-select-text="{{value['id']}}"
|
||||
value="{{global_config[setting]['value']}}"
|
||||
>{{global_config[setting]['value']}}</span
|
||||
>
|
||||
{% elif not global_config[setting]['value'] and value['default'] == item %}
|
||||
{% for item in value['select'] %} {% if value['default'] == item %}
|
||||
<span
|
||||
setting-select-text="{{value['id']}}"
|
||||
value="{{value['default']}}"
|
||||
|
|
@ -361,9 +354,7 @@
|
|||
setting-select-dropdown="{{value['id']}}"
|
||||
class="hidden z-[20] absolute h-full flex-col w-full mt-2"
|
||||
>
|
||||
{% for item in value['select'] %} {% if global_config[setting]['value'] and
|
||||
global_config[setting]['value'] == item or not global_config[setting]['value']
|
||||
and value['default'] == item %}
|
||||
{% for item in value['select'] %} {% if value['default'] == item %}
|
||||
<button
|
||||
type="button"
|
||||
value="{{item}}"
|
||||
|
|
@ -394,15 +385,9 @@
|
|||
{% if value["type"] == "check" %}
|
||||
<div checkbox-handler="{{value['id']}}" class="relative mb-7 md:mb-0">
|
||||
<input id="{{setting}}_SCHEMA" name="{{setting}}_SCHEMA"
|
||||
default-method="{{global_config[setting]['method']}}"
|
||||
default-value="{{global_config[setting]['value']}}" {% if
|
||||
global_config[setting]['method'] != 'ui' and global_config[setting]['method']
|
||||
!= 'default' %} disabled {% endif %} {% if global_config[setting]['value'] and
|
||||
global_config[setting]['value'] == 'yes' or not
|
||||
global_config[setting]['value'] and value['default'] == 'yes' %} checked {%
|
||||
endif %} id="checkbox-{{value['id']}}" class="relative {% if
|
||||
global_config[setting]['method'] != 'ui' and global_config[setting]['method']
|
||||
!= 'default' %} pointer-events-none {% else %} cursor-pointer {% endif %}
|
||||
default-method="default"
|
||||
default-value="{{value['default']}}" {% if value['default'] == 'yes' %} checked {%
|
||||
endif %} id="checkbox-{{value['id']}}" class="relative cursor-pointer
|
||||
dark:border-slate-600 dark:bg-slate-700 z-10 checked:z-0 w-5 h-5 ease
|
||||
text-base rounded-1.4 checked:bg-primary checked:border-primary
|
||||
dark:checked:bg-primary dark:checked:border-primary duration-250 float-left
|
||||
|
|
@ -411,13 +396,11 @@
|
|||
disabled:border-gray-400 dark:disabled:bg-gray-800
|
||||
dark:disabled:border-gray-800 disabled:text-gray-700
|
||||
dark:disabled:text-gray-300" type="checkbox" pattern="{{value['regex']|safe}}"
|
||||
value="{% if global_config[setting]['value'] %}
|
||||
{{global_config[setting]['value']}} {% else %} {{value['default']}} {% endif
|
||||
%}" />
|
||||
value="{{value['default']}}" />
|
||||
<input type="hidden" name="{{setting}}_SCHEMA" value="no" default-value="no" default-method="default" />
|
||||
<svg
|
||||
checkbox-handler="{{value['id']}}"
|
||||
class="pointer-events-none {% if global_config[setting]['method'] != 'ui' and global_config[setting]['method'] != 'default' %} pointer-events-none {% else %} cursor-pointer {% endif %} absolute fill-white dark:fill-gray-300 left-0 top-0 translate-x-1 translate-y-2 h-3 w-3"
|
||||
class="pointer-events-none cursor-pointer absolute fill-white dark:fill-gray-300 left-0 top-0 translate-x-1 translate-y-2 h-3 w-3"
|
||||
xmlns="http://www.w3.org/2000/svg"
|
||||
viewBox="0 0 512 512"
|
||||
>
|
||||
|
|
|
|||
Loading…
Reference in New Issue