popped stash

This commit is contained in:
Austin Alvarado
2024-02-05 15:42:29 +00:00
parent 93b4840e93
commit b55caae3cc
2 changed files with 49 additions and 113 deletions
+2
View File
@@ -38,11 +38,13 @@ features = [
"Document", "Document",
"Element", "Element",
"FileReader", "FileReader",
"FormData",
"HtmlDocument", "HtmlDocument",
"HtmlInputElement", "HtmlInputElement",
"HtmlOptionElement", "HtmlOptionElement",
"HtmlOptionsCollection", "HtmlOptionsCollection",
"HtmlSelectElement", "HtmlSelectElement",
"SubmitEvent",
"console", "console",
] ]
+47 -113
View File
@@ -11,9 +11,10 @@ use gloo_file::{
}; };
use graphql_client::GraphQLQuery; use graphql_client::GraphQLQuery;
use validator_derive::Validate; use validator_derive::Validate;
use web_sys::{FileList, HtmlInputElement, InputEvent}; use web_sys::{FileList, HtmlInputElement, InputEvent, SubmitEvent};
use yew::prelude::*; use yew::prelude::*;
use yew_form_derive::Model; use yew_form_derive::Model;
use gloo_console::log;
#[derive(Default)] #[derive(Default)]
struct JsFile { struct JsFile {
@@ -85,6 +86,8 @@ pub enum Msg {
FileLoaded(String, Result<Vec<u8>>), FileLoaded(String, Result<Vec<u8>>),
/// We got the response from the server about our update message. /// We got the response from the server about our update message.
UserUpdated(Result<update_user::ResponseData>), UserUpdated(Result<update_user::ResponseData>),
/// The "Submit" button was clicked.
OnSubmit(SubmitEvent),
} }
#[derive(yew::Properties, Clone, PartialEq, Eq)] #[derive(yew::Properties, Clone, PartialEq, Eq)]
@@ -148,6 +151,10 @@ impl CommonComponent<UserDetailsForm> for UserDetailsForm {
self.reader = None; self.reader = None;
Ok(false) Ok(false)
} }
Msg::OnSubmit(e) => {
log!(format!("{:#?}", e));
Ok(true)
}
} }
} }
@@ -195,108 +202,41 @@ impl Component for UserDetailsForm {
}; };
html! { html! {
<div class="py-3"> <div class="py-3">
<form class="form"> <form class="form" onsubmit={link.callback(|e: SubmitEvent| {e.prevent_default(); Msg::OnSubmit(e)})}>
<div class="form-group row mb-3"> <StaticValue label="User ID" id="userId">
<label for="userId" <i>{&self.user.id}</i>
class="form-label col-4 col-form-label"> </StaticValue>
{"User ID: "} <StaticValue label="Creation date" id="creationDate">
</label> {&self.user.creation_date.naive_local().date()}
<div class="col-8"> </StaticValue>
<span id="userId" class="form-control-static"><i>{&self.user.id}</i></span> <StaticValue label="UUID" id="uuid">
</div> {&self.user.uuid}
</div> </StaticValue>
<div class="form-group row mb-3"> <Field<UserModel>
<label for="creationDate" form={&self.form}
class="form-label col-4 col-form-label"> required=true
{"Creation date: "} label="Email"
</label> field_name="email"
<div class="col-8"> input_type="email"
<span id="creationDate" class="form-control-static">{&self.user.creation_date.naive_local().date()}</span> oninput={link.callback(|_| Msg::Update)} />
</div> <Field<UserModel>
</div> form={&self.form}
<div class="form-group row mb-3"> label="Display name"
<label for="uuid" field_name="display_name"
class="form-label col-4 col-form-label"> autocomplete="name"
{"UUID: "} oninput={link.callback(|_| Msg::Update)} />
</label> <Field<UserModel>
<div class="col-8"> form={&self.form}
<span id="creationDate" class="form-control-static">{&self.user.uuid}</span> label="First name"
</div> field_name="first_name"
</div> autocomplete="given-name"
<div class="form-group row mb-3"> oninput={link.callback(|_| Msg::Update)} />
<label for="email" <Field<UserModel>
class="form-label col-4 col-form-label"> form={&self.form}
{"Email"} label="Last name"
<span class="text-danger">{"*"}</span> field_name="last_name"
{":"} autocomplete="family-name"
</label> oninput={link.callback(|_| Msg::Update)} />
<div class="col-8">
<Field
class="form-control"
class_invalid="is-invalid has-error"
class_valid="has-success"
form={&self.form}
field_name="email"
autocomplete="email"
oninput={link.callback(|_| Msg::Update)} />
<div class="invalid-feedback">
{&self.form.field_message("email")}
</div>
</div>
</div>
<div class="form-group row mb-3">
<label for="display_name"
class="form-label col-4 col-form-label">
{"Display Name: "}
</label>
<div class="col-8">
<Field
class="form-control"
class_invalid="is-invalid has-error"
class_valid="has-success"
form={&self.form}
field_name="display_name"
autocomplete="name"
oninput={link.callback(|_| Msg::Update)} />
<div class="invalid-feedback">
{&self.form.field_message("display_name")}
</div>
</div>
</div>
<div class="form-group row mb-3">
<label for="first_name"
class="form-label col-4 col-form-label">
{"First Name: "}
</label>
<div class="col-8">
<Field
class="form-control"
form={&self.form}
field_name="first_name"
autocomplete="given-name"
oninput={link.callback(|_| Msg::Update)} />
<div class="invalid-feedback">
{&self.form.field_message("first_name")}
</div>
</div>
</div>
<div class="form-group row mb-3">
<label for="last_name"
class="form-label col-4 col-form-label">
{"Last Name: "}
</label>
<div class="col-8">
<Field
class="form-control"
form={&self.form}
field_name="last_name"
autocomplete="family-name"
oninput={link.callback(|_| Msg::Update)} />
<div class="invalid-feedback">
{&self.form.field_message("last_name")}
</div>
</div>
</div>
<div class="form-group row align-items-center mb-3"> <div class="form-group row align-items-center mb-3">
<label for="avatar" <label for="avatar"
class="form-label col-4 col-form-label"> class="form-label col-4 col-form-label">
@@ -340,16 +280,10 @@ impl Component for UserDetailsForm {
</div> </div>
</div> </div>
</div> </div>
<div class="form-group row justify-content-center mt-3"> <Submit
<button text="Save changes"
type="submit" disabled={self.common.is_task_running()}
class="btn btn-primary col-auto col-form-label" onclick={link.callback(|e: MouseEvent| {Msg::SubmitClicked})} />
disabled={self.common.is_task_running()}
onclick={link.callback(|e: MouseEvent| {e.prevent_default(); Msg::SubmitClicked})}>
<i class="bi-save me-2"></i>
{"Save changes"}
</button>
</div>
</form> </form>
{ {
if let Some(e) = &self.common.error { if let Some(e) = &self.common.error {