ITsolved/rezervovator
2
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

Added DataForm component for easier edit dialogs.

Browse Source
This commit is contained in:
pepa
2023-09-28 21:42:12 +02:00
parent 0f8166913d
commit a7188e8153
10 changed files with 204 additions and 198 deletions
Download Patch File Download Diff File Expand all files Collapse all files
src/pages/change_pwd.rs
+5 -33
View File
@@ -1,40 +1,23 @@
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;
use crate::components::data_form::DataForm;
use crate::components::modal_box::DialogOpener;
#[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 Some(res) = change_pwd.value().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 />
<DataForm opener=opener action=change_pwd title="Change password">
<input type="hidden" value={move || user.get().login} name="new_pw[login]"/>
<div class="row">
<div class="col mb-3">
@@ -72,18 +55,7 @@ pub fn change_password(user: ReadSignal<User>, opener: DialogOpener) -> impl Int
/>
</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>
</DataForm>
}
}}
}
src/pages/company_edit.rs
+63 -93
View File
@@ -1,14 +1,8 @@
use crate::backend::data::Company;
use crate::backend::company::UpdateCompany;
use crate::components::modal_box::{
DialogOpener, ModalBody, ModalDialog, ModalFooter,
};
use crate::components::server_err::ServerErr;
use crate::locales::trl;
use crate::validator::Validator;
use crate::components::modal_box::DialogOpener;
use leptos::*;
use leptos_router::*;
use crate::components::validation_err::ValidationErr;
use crate::components::data_form::DataForm;
#[component]
pub fn CompanyEdit(
@@ -16,95 +10,71 @@ pub fn CompanyEdit(
opener: DialogOpener,
) -> impl IntoView {
let update_company = create_server_action::<UpdateCompany>();
let upd_val = update_company.value();
let validator = Validator::new();
view! {
<ActionForm
on:submit=move |ev| {
let act = UpdateCompany::from_event(&ev);
if !act.is_err() {
validator.check(&act.unwrap().company, &ev);
}
}
action=update_company>
<ModalDialog opener=opener title="Edit company">
<ModalBody>
<ServerErr result={upd_val} opener=opener/>
<ValidationErr validator=validator />
<input type="hidden" value={move || company.get().id()} name="company[id]"/>
<div class="row">
<div class="col mb-3">
<label for="nameWithTitle" class="form-label">"Name"</label>
<input
type="text"
id="nameWithTitle"
class="form-control"
placeholder="Enter Name"
prop:value={move || company.get().name}
name="company[name]"
/>
</div>
<DataForm opener=opener action=update_company title="Edit company">
<input type="hidden" value={move || company.get().id()} name="company[id]"/>
<div class="row">
<div class="col mb-3">
<label for="nameWithTitle" class="form-label">"Name"</label>
<input
type="text"
id="nameWithTitle"
class="form-control"
placeholder="Enter Name"
prop:value={move || company.get().name}
name="company[name]"
/>
</div>
<div class="row">
<div class="col mb-3">
<label for="street" class="form-label">"Street"</label>
<input
type="text"
id="street"
class="form-control"
placeholder="Enter Street"
prop:value={move || company.get().street}
name="company[street]"
/>
</div>
<div class="col-4 mb-3">
<label for="houseNumber" class="form-label">"House number"</label>
<input
type="text"
id="houseNumber"
class="form-control"
placeholder="Enter House number"
prop:value={move || company.get().house_number}
name="company[house_number]"
/>
</div>
</div>
<div class="row">
<div class="col mb-3">
<label for="street" class="form-label">"Street"</label>
<input
type="text"
id="street"
class="form-control"
placeholder="Enter Street"
prop:value={move || company.get().street}
name="company[street]"
/>
</div>
<div class="row">
<div class="col-4 mb-3">
<label for="zip" class="form-label">"ZIP code"</label>
<input
type="text"
id="zip"
class="form-control"
placeholder="Enter ZIP code"
prop:value={move || company.get().zip_code}
name="company[zip_code]"
/>
</div>
<div class="col mb-3">
<label for="city" class="form-label">"City"</label>
<input
type="text"
id="city"
class="form-control"
placeholder="Enter City"
prop:value={move || company.get().city}
name="company[city]"
/>
</div>
<div class="col-4 mb-3">
<label for="houseNumber" class="form-label">"House number"</label>
<input
type="text"
id="houseNumber"
class="form-control"
placeholder="Enter House number"
prop:value={move || company.get().house_number}
name="company[house_number]"
/>
</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>
</div>
<div class="row">
<div class="col-4 mb-3">
<label for="zip" class="form-label">"ZIP code"</label>
<input
type="text"
id="zip"
class="form-control"
placeholder="Enter ZIP code"
prop:value={move || company.get().zip_code}
name="company[zip_code]"
/>
</div>
<div class="col mb-3">
<label for="city" class="form-label">"City"</label>
<input
type="text"
id="city"
class="form-control"
placeholder="Enter City"
prop:value={move || company.get().city}
name="company[city]"
/>
</div>
</div>
</DataForm>
}
}
src/pages/company_info.rs
+2 -2
View File
@@ -13,7 +13,7 @@ pub fn CompanyInfo() -> impl IntoView {
view! {
<CompanyEdit company={cmp} opener=editor/>
<div class="card">
<div class="card mb-3">
<div class="card-body">
<h5 class="card-title"><i class="bx bx-buildings"></i>" "{trl("Company info")}</h5>
<p class="card-text">
@@ -41,7 +41,7 @@ pub fn CompanyInfo() -> impl IntoView {
</Transition>
</p>
<a href="javascript:void(0)" class="card-link" on:click = move |_| editor.show()>
<i class="bx bx-pencil fs-4 lh-0"></i></a>
<i class="bx bx-edit-alt fs-4 lh-0"></i></a>
</div>
</div>
}
src/pages/mod.rs
+2
View File
@@ -6,3 +6,5 @@ pub mod login;
pub mod public;
pub mod profile_edit;
pub mod change_pwd;
pub mod users;
pub mod user_edit;
src/pages/profile_edit.rs
+41 -69
View File
@@ -1,83 +1,55 @@
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;
use crate::components::data_form::DataForm;
use crate::components::modal_box::DialogOpener;
#[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>
<DataForm opener=opener action=update_user title="Edit profile">
<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 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">
<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 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>
<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>
</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>
</div>
</DataForm>
}
}