110 lines
3.8 KiB
TypeScript
110 lines
3.8 KiB
TypeScript
import { isBlank } from "@util/common_util_validate";
|
|
import { createButton, createInputField } from "@ui/ui_template_elements";
|
|
import { changePassword, updateUserProfile, type DashboardUser } from "./B01_Dashboard_Api_Fetch";
|
|
import { L, runRequest } from "./B01_Dashboard_UI_Common";
|
|
|
|
const PASSWORD_MIN_LENGTH = 8;
|
|
|
|
export function buildProfileForm(user: DashboardUser): HTMLElement {
|
|
const name = createInputField({
|
|
label: L("B01_Account_Field_Name"),
|
|
value: user.name,
|
|
required: true,
|
|
});
|
|
const position = createInputField({
|
|
label: L("B01_Dashboard_Table_Position"),
|
|
value: user.position ?? "",
|
|
});
|
|
const department = createInputField({
|
|
label: L("B01_Dashboard_Table_Department"),
|
|
value: user.department ?? "",
|
|
});
|
|
const phone = createInputField({ label: L("B01_Account_Field_Phone"), value: user.phone ?? "" });
|
|
const grid = document.createElement("div");
|
|
grid.className = "b01-dashboard__form-grid";
|
|
grid.append(name.root, position.root, department.root, phone.root);
|
|
const save = createButton({
|
|
label: L("B01_Dashboard_SaveProfile"),
|
|
onClick: async function onB01_Profile_Save_Click() {
|
|
name.setError();
|
|
if (isBlank(name.input.value)) {
|
|
name.setError(L("Common_Msg_RequiredField"));
|
|
return;
|
|
}
|
|
await runRequest(() =>
|
|
updateUserProfile({
|
|
name: name.input.value.trim(),
|
|
position: position.input.value.trim() || null,
|
|
department: department.input.value.trim() || null,
|
|
phone: phone.input.value.trim() || null,
|
|
}),
|
|
);
|
|
},
|
|
});
|
|
const wrap = document.createElement("div");
|
|
wrap.append(grid, save);
|
|
return wrap;
|
|
}
|
|
|
|
export function buildSecurityForm(): HTMLElement {
|
|
const currentPassword = createInputField({
|
|
label: L("B01_Account_Field_CurrentPw"),
|
|
type: "password",
|
|
required: true,
|
|
});
|
|
const newPassword = createInputField({
|
|
label: L("B01_Account_Field_NewPw"),
|
|
type: "password",
|
|
required: true,
|
|
});
|
|
const confirmPassword = createInputField({
|
|
label: L("B01_Account_Field_ConfirmPw"),
|
|
type: "password",
|
|
required: true,
|
|
});
|
|
const grid = document.createElement("div");
|
|
grid.className = "b01-dashboard__form-grid";
|
|
grid.append(currentPassword.root, newPassword.root, confirmPassword.root);
|
|
const save = createButton({
|
|
label: L("B01_Account_Save_Password"),
|
|
variant: "ghost",
|
|
onClick: async function onB01_Password_Save_Click() {
|
|
currentPassword.setError();
|
|
newPassword.setError();
|
|
confirmPassword.setError();
|
|
|
|
const currentValue = currentPassword.input.value;
|
|
const nextValue = newPassword.input.value;
|
|
const confirmValue = confirmPassword.input.value;
|
|
if (isBlank(currentValue) || isBlank(nextValue) || isBlank(confirmValue)) {
|
|
currentPassword.setError(isBlank(currentValue) ? L("Common_Msg_RequiredField") : undefined);
|
|
newPassword.setError(isBlank(nextValue) ? L("Common_Msg_RequiredField") : undefined);
|
|
confirmPassword.setError(isBlank(confirmValue) ? L("Common_Msg_RequiredField") : undefined);
|
|
return;
|
|
}
|
|
if (nextValue.length < PASSWORD_MIN_LENGTH) {
|
|
newPassword.setError(L("B01_Account_Error_PwLength"));
|
|
return;
|
|
}
|
|
if (nextValue !== confirmValue) {
|
|
confirmPassword.setError(L("B01_Account_Error_PwMismatch"));
|
|
return;
|
|
}
|
|
await runRequest(() =>
|
|
changePassword({
|
|
current_password: currentValue,
|
|
new_password: nextValue,
|
|
new_password_confirm: confirmValue,
|
|
logout_all: false,
|
|
}),
|
|
);
|
|
currentPassword.input.value = "";
|
|
newPassword.input.value = "";
|
|
confirmPassword.input.value = "";
|
|
},
|
|
});
|
|
const wrap = document.createElement("div");
|
|
wrap.append(grid, save);
|
|
return wrap;
|
|
}
|