Implemented user menu. Replaced favicon with app logo.

2023-09-27 11:36:52 +02:00
parent 17f628739f
commit 2122b3a4f7
16 changed files with 466 additions and 64 deletions
@@ -0,0 +1,90 @@
+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>
+            }
+        }}
+    }
+}