Implemented user menu. Replaced favicon with app logo.

This commit is contained in:
2023-09-27 11:36:52 +02:00
parent 17f628739f
commit 2122b3a4f7
16 changed files with 466 additions and 64 deletions
+90
View File
@@ -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>
}
}}
}
}
+1 -1
View File
@@ -8,7 +8,7 @@ use crate::pages::company_edit::CompanyEdit;
#[component]
pub fn CompanyInfo() -> impl IntoView {
let editor = DialogOpener::new();
let company = create_resource(move|| editor.visible(), move |_| { get_company() });
let company = create_blocking_resource(move|| editor.visible(), move |_| { get_company() });
let (cmp, set_cmp) = create_signal(Company::default());
view! {
+13 -11
View File
@@ -2,49 +2,51 @@ use leptos::*;
use leptos_meta::*;
use leptos_router::ActionForm;
use crate::backend::user::Login;
use crate::components::modal_box::DialogOpener;
use crate::components::server_err::ServerErr;
use crate::locales::trl;
#[component]
pub fn Login() -> impl IntoView {
let login = create_server_action::<Login>();
let login_val = login.value();
view! {
<Link rel="stylesheet" href="/vendor/css/pages/page-auth.css" />
<div class="authentication-wrapper authentication-basic container-p-y">
<div class="authentication-inner">
<div class="card">
<div class="card-body">
//<!-- Logo -->
<div class="app-brand justify-content-center">
<a href="index.html" class="app-brand-link gap-2">
<span class="app-brand-logo demo">
<img src="/rezervovator_l.svg" width="200"/>
</span>
//<span class="app-brand-text demo text-body fw-bolder">Sneat</span>
</a>
</div>
//<!-- /Logo -->
<h4 class="mb-2">"Welcome to Rezervator 👋"</h4>
<p class="mb-4">"Please sign-in to your account and start the adventure"</p>
<p class="mb-4">{trl("Please sign-in to your account")}</p>
<ActionForm action=login>
<ServerErr result=login_val opener=DialogOpener::new()/>
<div class="mb-3">
<label for="username" class="form-label">"Username"</label>
<label for="username" class="form-label">{trl("Username")}</label>
<input
type="text"
class="form-control"
id="username"
name="username"
placeholder="Enter your username"
placeholder={trl("Enter your username")}
autofocus
/>
</div>
<div class="mb-3 form-password-toggle">
<div class="d-flex justify-content-between">
<label class="form-label" for="password">"Password"</label>
<a href="auth-forgot-password-basic.html">
<label class="form-label" for="password">{trl("Password")}</label>
/*<a href="auth-forgot-password-basic.html">
<small>"Forgot Password?"</small>
</a>
</a>*/
</div>
<div class="input-group input-group-merge">
<input
@@ -61,7 +63,7 @@ pub fn Login() -> impl IntoView {
</div>
<div class="mb-3">
<button class="btn btn-primary d-grid w-100" type="submit">"Sign in"</button>
<button class="btn btn-primary d-grid w-100" type="submit">{trl("Sign in")}</button>
</div>
</ActionForm>
+2
View File
@@ -4,3 +4,5 @@ pub mod company_info;
mod company_edit;
pub mod login;
pub mod public;
pub mod profile_edit;
pub mod change_pwd;
+83
View File
@@ -0,0 +1,83 @@
use leptos::*;
use leptos_router::*;
use crate::backend::data::User;
use crate::backend::user::UpdateProfile;
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 ProfileEdit(user: ReadSignal<User>, opener: DialogOpener) -> impl IntoView {
let update_user = create_server_action::<UpdateProfile>();
let upd_val = update_user.value();
let validator = Validator::new();
view! {
<ActionForm
on:submit=move |ev| {
let act = UpdateProfile::from_event(&ev);
if !act.is_err() {
validator.check(&act.unwrap().user, &ev);
}
}
action=update_user>
<ModalDialog opener=opener title="Edit profile">
<ModalBody>
<ServerErr result={upd_val} opener=opener/>
<ValidationErr validator=validator />
<input type="hidden" value={move || user.get().login} name="user[login]"/>
<div class="row">
<div class="col mb-3">
<label for="name" class="form-label">"Full name"</label>
<input
type="text"
id="name"
class="form-control"
placeholder="Enter Full name"
prop:value={move || user.get().full_name}
name="user[full_name]"
/>
</div>
</div>
<div class="row">
<div class="col mb-3">
<label for="email" class="form-label">"Email"</label>
<input
type="text"
id="name"
class="form-control"
placeholder="Enter email"
prop:value={move || user.get().email.unwrap_or("".to_string())}
name="user[email]"
/>
</div>
</div>
<div class="row">
<div class="col mb-3">
<input
class="form-check-input"
type="checkbox"
id="getMail"
prop:value={move || if user.get().get_emails {"true"} else {"false"}}
prop:checked={move || user.get().get_emails}
name="user[get_emails]"
/>
<label class="form-check-label" for="getMail">"Get emails"</label>
</div>
</div>
</ModalBody>
<ModalFooter>
<button type="button" class="btn btn-outline-secondary" data-bs-dismiss="modal"
on:click=move |_| {validator.reset(); opener.hide()}>
{trl("Close")}
</button>
<button type="submit" class="btn btn-primary">
{trl("Save changes")}
</button>
</ModalFooter>
</ModalDialog>
</ActionForm>
}
}