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:
Josef Rokos
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/backend/company.rs
+8
View File
@@ -1,5 +1,7 @@
use leptos::*;
use validator::Validate;
use crate::backend::data::{ApiResponse, Company};
use crate::components::data_form::ForValidation;
#[server(GetCompany, "/api", "Url", "get_company")]
pub async fn get_company() -> Result<ApiResponse<Company>, ServerFnError> {
@@ -44,3 +46,9 @@ pub async fn update_company(company: Company) -> Result<ApiResponse<()>, ServerF
Ok(ApiResponse::Data(()))
}
impl ForValidation for UpdateCompany {
fn entity(&self) -> &dyn Validate {
&self.company
}
}
src/backend/user.rs
+29
View File
@@ -1,6 +1,8 @@
use cfg_if::cfg_if;
use leptos::*;
use validator::Validate;
use crate::backend::data::{ApiResponse, PwdChange, User, UserProfile};
use crate::components::data_form::ForValidation;
cfg_if! { if #[cfg(feature = "ssr")] {
use sqlx::{query_as, Error, PgPool, query};
@@ -110,6 +112,21 @@ pub async fn get_user() -> Result<Option<User>, ServerFnError> {
Ok(logged_in_user().await)
}
#[server(GetUsers, "/api", "Url", "get_users")]
pub async fn get_users() -> Result<ApiResponse<Vec<User>>, ServerFnError> {
use crate::backend::AppData;
use actix_web::web::Data;
use leptos_actix::extract;
use crate::perm_check;
perm_check!(is_admin);
let pool = extract(|data: Data<AppData>| async move { data.db_pool().clone() }).await?;
let users = sqlx::query_as::<_, User>(r#"SELECT * FROM "user""#).fetch_all(&pool).await?;
Ok(ApiResponse::Data(users))
}
#[server]
pub async fn update_profile(user: UserProfile) -> Result<ApiResponse<()>, ServerFnError> {
use crate::backend::AppData;
@@ -136,6 +153,12 @@ pub async fn update_profile(user: UserProfile) -> Result<ApiResponse<()>, Server
Ok(ApiResponse::Data(()))
}
impl ForValidation for UpdateProfile {
fn entity(&self) -> &dyn Validate {
&self.user
}
}
#[server]
pub async fn change_pwd(new_pw: PwdChange) -> Result<ApiResponse<()>, ServerFnError> {
use crate::backend::AppData;
@@ -162,4 +185,10 @@ pub async fn change_pwd(new_pw: PwdChange) -> Result<ApiResponse<()>, ServerFnEr
.await?;
Ok(ApiResponse::Data(()))
}
impl ForValidation for ChangePwd {
fn entity(&self) -> &dyn Validate {
&self.new_pw
}
}
src/components/data_form.rs
+52
View File
@@ -0,0 +1,52 @@
use crate::backend::data::ApiResponse;
use crate::components::modal_box::{DialogOpener, ModalBody, ModalDialog, ModalFooter};
use leptos::*;
use leptos_router::*;
use validator::Validate;
use crate::components::server_err::ServerErr;
use crate::components::validation_err::ValidationErr;
use crate::locales::trl;
use crate::validator::Validator;
pub trait ForValidation {
fn entity(&self) -> &dyn Validate;
}
#[component]
pub fn data_form<T: 'static + server_fn::ServerFn<()> + Clone + ForValidation>(
opener: DialogOpener,
action: Action<T, Result<ApiResponse<()>, ServerFnError>>,
title: &'static str,
children: Children
) -> impl IntoView {
let upd_val = action.value();
let validator = Validator::new();
view! {
<ActionForm
on:submit=move |ev| {
let act = T::from_event(&ev);
if !act.is_err() {
validator.check(act.unwrap().entity(), &ev);
}
}
action=action>
<ModalDialog opener=opener title=title>
<ModalBody>
<ServerErr result={upd_val} opener=opener/>
<ValidationErr validator=validator />
{children()}
</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>
}
}
src/components/mod.rs
+1
View File
@@ -4,4 +4,5 @@ pub mod validation_err;
pub mod header;
pub mod admin_portal;
pub mod user_menu;
pub mod data_form;
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>
}
}
src/validator.rs
+1 -1
View File
@@ -26,7 +26,7 @@ impl Validator {
}
}
pub fn check(&self, entity: &impl Validate, ev: &web_sys::Event) {
pub fn check(&self, entity: &(impl Validate + ?Sized), ev: &web_sys::Event) {
if let Err(val_err) = entity.validate() {
ev.prevent_default();
//self.set_message.update(|m| *m = Some(val_err.to_string().clone()));