90 lines
3.5 KiB
Rust
90 lines
3.5 KiB
Rust
|
use leptos::*;
|
||
|
|
use leptos_router::*;
|
||
|
|
use crate::backend::data::{ApiResponse, User};
|
||
|
|
use crate::backend::user::ChangePwd;
|
||
|
|
use crate::components::modal_box::{DialogOpener, ModalBody, ModalDialog, ModalFooter};
|
||
|
|
use crate::components::server_err::ServerErr;
|
||
|
|
use crate::components::validation_err::ValidationErr;
|
||
|
|
use crate::locales::trl;
|
||
|
|
use crate::validator::Validator;
|
||
|
|
|
||
|
|
#[component]
|
||
|
|
pub fn change_password(user: ReadSignal<User>, opener: DialogOpener) -> impl IntoView {
|
||
|
|
let change_pwd = create_server_action::<ChangePwd>();
|
||
|
|
let upd_val = change_pwd.value();
|
||
|
|
let validator = Validator::new();
|
||
|
|
let empty = create_rw_signal("".to_string());
|
||
|
|
|
||
|
|
view! {
|
||
|
|
{move || {
|
||
|
|
if let Some(res) = upd_val.get() {
|
||
|
|
if let Ok(r) = res {
|
||
|
|
if let ApiResponse::Data(_) = r { empty.update(|e| *e = "".to_string())}
|
||
|
|
}
|
||
|
|
}
|
||
|
|
view! {
|
||
|
|
<ActionForm
|
||
|
|
on:submit=move |ev| {
|
||
|
|
let act = ChangePwd::from_event(&ev);
|
||
|
|
if !act.is_err() {
|
||
|
|
validator.check(&act.unwrap().new_pw, &ev);
|
||
|
|
}
|
||
|
|
}
|
||
|
|
action=change_pwd>
|
||
|
|
<ModalDialog opener=opener title="Change password">
|
||
|
|
<ModalBody>
|
||
|
|
<ServerErr result={upd_val} opener=opener/>
|
||
|
|
<ValidationErr validator=validator />
|
||
|
|
<input type="hidden" value={move || user.get().login} name="new_pw[login]"/>
|
||
|
|
<div class="row">
|
||
|
|
<div class="col mb-3">
|
||
|
|
<label for="oldPw" class="form-label">"Old password"</label>
|
||
|
|
<input
|
||
|
|
type="password"
|
||
|
|
id="oldPw"
|
||
|
|
class="form-control"
|
||
|
|
name="new_pw[old_password]"
|
||
|
|
prop:value={move || empty.get()}
|
||
|
|
/>
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
<div class="row">
|
||
|
|
<div class="col mb-3">
|
||
|
|
<label for="newPw" class="form-label">"New password"</label>
|
||
|
|
<input
|
||
|
|
type="password"
|
||
|
|
id="newPw"
|
||
|
|
class="form-control"
|
||
|
|
name="new_pw[password]"
|
||
|
|
prop:value={move || empty.get()}
|
||
|
|
/>
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
<div class="row">
|
||
|
|
<div class="col mb-3">
|
||
|
|
<label for="verPw" class="form-label">"Verify password"</label>
|
||
|
|
<input
|
||
|
|
type="password"
|
||
|
|
id="verPw"
|
||
|
|
class="form-control"
|
||
|
|
name="new_pw[password_ver]"
|
||
|
|
prop:value={move || empty.get()}
|
||
|
|
/>
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
</ModalBody>
|
||
|
|
<ModalFooter>
|
||
|
|
<button type="button" class="btn btn-outline-secondary" data-bs-dismiss="modal"
|
||
|
|
on:click=move |_| {validator.reset(); opener.hide(); empty.update(|e| *e = "".to_string())}>
|
||
|
|
{trl("Close")}
|
||
|
|
</button>
|
||
|
|
<button type="submit" class="btn btn-primary">
|
||
|
|
{trl("Save changes")}
|
||
|
|
</button>
|
||
|
|
</ModalFooter>
|
||
|
|
</ModalDialog>
|
||
|
|
</ActionForm>
|
||
|
|
}
|
||
|
|
}}
|
||
|
|
}
|
||
|
|
}
|