This commit is contained in:
roydfalk 2024-04-29 00:15:48 +02:00
parent 1f549037b6
commit 15fa634056
6 changed files with 295 additions and 144 deletions

View file

@ -235,6 +235,26 @@ namespace _espe.backend
}
/**
*/
export async function member_get2(
id : int
) : Promise<
{
name_real : string;
name_login : string;
email_address_numerical_value : string;
email_address_namely_value : string;
}
>
{
return abstract_call(
"GET",
"/member/get/" + id.toFixed(0)
);
}
/**
*/
export async function member_add(

View file

@ -1,5 +1,3 @@
var foobar;
lib_plankton.zoo_page.register(
"register",
async (parameters, target_element) => {
@ -16,6 +14,15 @@ lib_plankton.zoo_page.register(
update_nav({"mode": null});
const member_data : {
name_real : string;
name_login : string;
email_address_numerical_value : string;
email_address_namely_value : string;
} = await _espe.backend.member_get2(id);
if (false)
{
const form = new lib_plankton.zoo_form.class_form<any, any>(
x => x,
x => x,
@ -34,8 +41,8 @@ lib_plankton.zoo_page.register(
"input": new lib_plankton.zoo_input.class_input_enumeration(
[
{"value": "none", "label": "keine"},
{"value": "number", "label": "nur numerische"},
{"value": "number_and_name", "label": "numerische und namensbasierte"},
{"value": "number", "label": "nur numerische" + " " + ("(" + member_data.email_address_numerical_value + ")")},
{"value": "number_and_name", "label": "numerische und namentliche" + " " + ("(" + member_data.email_address_namely_value + ")")},
]
),
"label": "Partei-E-Mail-Adresse einrichten",
@ -49,7 +56,7 @@ lib_plankton.zoo_page.register(
},
{
"name": "name_display",
"input": new lib_plankton.zoo_input.class_input_text(),
"input": new lib_plankton.zoo_input.class_input_text({"read_only": true}),
"label": "Anzeigename",
"help": "So wirst du bei Online-Diensten anderen angezeigt.",
},
@ -63,6 +70,7 @@ lib_plankton.zoo_page.register(
"input": new lib_plankton.zoo_input.class_input_text(
{
"pattern": "^[0-9a-zA-Z_]+$",
"read_only": true,
}
),
"label": "Anmeldename",
@ -121,8 +129,8 @@ lib_plankton.zoo_page.register(
{
"id": id,
"verification": verification,
"name_login": "",
"name_display": "",
"name_login": member_data.name_login,
"name_display": member_data.name_real,
"salutation": "",
"email_mode": "number_and_name",
"email_redirect": true,
@ -131,13 +139,88 @@ lib_plankton.zoo_page.register(
}
);
set_state("fill");
// ---
}
{
let dom_service_data_container : HTMLElement = document.createElement("div");
let dom_email_setting_container : HTMLElement = document.createElement("fieldset");
dom_email_setting_container.classList.add("register-email_setting");
{
let dom_legend : HTMLElement = document.createElement("legend");
dom_legend.textContent = "E-Mail-Einstellungen";
dom_email_setting_container.appendChild(dom_legend);
}
async function update_email_setting() {
const value : boolean = (await input_email_use.read())["use"];
dom_email_setting_container.classList.toggle("show", value);
}
const input_email_use = new lib_plankton.zoo_input.class_input_group(
[
{
"name": "use",
"input": new lib_plankton.zoo_input.class_input_checkbox(
{
"hooks_change": [
(value) => {update_email_setting();}
]
}
),
"label": "Partei-E-Mail-Adresse einrichten",
}
]
);
const input_email_setting = new lib_plankton.zoo_input.class_input_group(
[
{
"name": "numerical",
"input": new lib_plankton.zoo_input.class_input_checkbox(
),
"label": ("numerisch" + " : " + ("" + member_data.email_address_numerical_value + "")),
},
{
"name": "namely",
"input": new lib_plankton.zoo_input.class_input_checkbox(
),
"label": ("namentlich" + " : " + ("" + member_data.email_address_namely_value + "")),
},
]
);
await input_email_use.setup(target_element as HTMLElement);
target_element.appendChild(dom_email_setting_container);
await input_email_setting.setup(dom_email_setting_container);
await input_email_setting.write(
{
"numerical": true,
"namely": true,
}
);
await input_email_use.write({"use": true});
update_email_setting();
}
{
let dom_service_data_container : HTMLElement = document.createElement("fieldset");
{
let dom_legend : HTMLElement = document.createElement("legend");
dom_legend.textContent = "Angaben für Netzdienste";
dom_service_data_container.appendChild(dom_legend);
}
dom_service_data_container.classList.add("register-services_data");
async function update_service_data() {
const value : boolean = (await input_service_use.read())["use"];
dom_service_data_container.classList.toggle("show", value);
/*
if (value) {
dom_service_data_container.removeAttribute("disabled");
}
else {
dom_service_data_container.setAttribute("disabled", "disabled");
}
*/
}
const input_service_use = new lib_plankton.zoo_input.class_input_group(
[
{
@ -145,7 +228,7 @@ lib_plankton.zoo_page.register(
"input": new lib_plankton.zoo_input.class_input_checkbox(
{
"hooks_change": [
(value) => {dom_service_data_container.classList.toggle("show", value);}
(value) => {update_service_data();}
]
}
),
@ -192,23 +275,17 @@ lib_plankton.zoo_page.register(
await input_service_use.setup(target_element as HTMLElement);
target_element.appendChild(dom_service_data_container);
await input_service_data.setup(dom_service_data_container);
foobar = input_service_use;
await input_service_use.write(true);
/*
const element_use_services : HTMLInputElement = (target_element.querySelector(".register-field-use_services") as HTMLInputElement);
function update_service_data_visibility(show : (null | boolean) = null) : void
await input_service_data.write(
{
console.info({show});
show = (show ?? element_use_services.checked);
console.info({show});
target_element.querySelector(".register-services_data").classList.toggle("show", show);
"name_display": member_data.name_real,
"name_login": member_data.name_login,
"password": "",
"password_confirmation": "",
}
element_use_services.addEventListener("change", (event) => {update_service_data_visibility(event.target["checked"]);});
element_use_services.checked = true;
update_service_data_visibility(true);
*/
);
await input_service_use.write({"use": true});
update_service_data();
}
},
);

View file

@ -11,6 +11,7 @@
<input name="use_services" type="checkbox"/>
</div>
<fieldset class="register-services_data">
<legend>Netzdienste</legend>
<div class="register-field-display_name">
<label>Anzeigename</label>
<input name="display_name" type="text"/>

View file

@ -10,7 +10,42 @@
.register[rel="done"] .register-message {}
.register[rel="done"] .register-form {display: none;}
.register-email_setting
{
overflow: hidden;
}
.register-email_setting.show
{
max-height: 100vh;
transition: max-height 1.0s ease;
}
.register-email_setting:not(.show)
{
max-height: 0;
transition: max-height 0.25s ease;
}
.register-services_data
{
overflow: hidden;
}
.register-services_data.show
{
max-height: 100vh;
transition: max-height 1.0s ease;
}
.register-services_data:not(.show)
{
display: none;
max-height: 0;
transition: max-height 0.25s ease;
}
/*
*/

View file

@ -95,6 +95,7 @@ lib_plankton.zoo_page.register(
);
let dom_fragment : DocumentFragment = template_request("view");
(
Promise.all(
[
form.setup(dom_fragment.querySelector(".view-form") as HTMLElement),
@ -106,6 +107,7 @@ lib_plankton.zoo_page.register(
form.input_write(member);
}
)
);
target_element.appendChild(dom_fragment);
},

View file

@ -0,0 +1,16 @@
.view-form > .plankton_form
{
display: flex;
flex-direction: row;
flex-wrap: wrap;
}
.view-form > .plankton_form > .plankton_form_input
{
flex: 1;
}
.view-form > .plankton_form > .plankton_form_actions
{
flex: 1;
}