red/cdb_client
red/cdb_client
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity

update

Browse source
This commit is contained in:
JMARyA 2025-06-07 21:27:12 +02:00
parent ca24591d9d
commit 995a8b3476
Signed by: jmarya
GPG key ID: 901B2ADDF27C2263
16 changed files with 789 additions and 246 deletions
Download patch file Download diff file Expand all files Collapse all files

96
src/page/consume.rs
View file

@ -1,6 +1,9 @@
use dioxus::prelude::*;
use crate::api;
use crate::{
api,
page::{BasicButton, LabeledInput, TransientHeader},
};
#[component]
pub fn ConsumePage(id: String, item: String, variant: String) -> Element {
@ -14,43 +17,56 @@ pub fn ConsumePage(id: String, item: String, variant: String) -> Element {
let mut price = use_signal(|| 0.00);
rsx! {
div {
class: "w-full py-4 flex flex-col gap-6",
p { "Item: {item}"},
p { "Variant: {variant}"}
TransientHeader { title: format!("Consume {item} - {variant}") }
// TODO : destination
LabeledInput {
label: "Destination",
PredefinedSelector {
name: "Destination",
value: dest,
custom: true,
predefined: destinations
}
}
}
label {
"Price: ",
// Price Field
LabeledInput {
label: "Price",
input {
class: "rounded-md border border-neutral-300 dark:border-neutral-700 bg-white dark:bg-neutral-800 px-3 py-2 text-sm focus:outline-none focus:ring-2 focus:ring-blue-500 dark:focus:ring-blue-400",
r#type: "number",
value: "{price}",
oninput: move |e| price.set(e.value().parse().unwrap())
oninput: move |e| {
price.set(e.value().parse().unwrap())
}
}
},
}
BasicButton {
title: "Consume",
button {
onclick: move |_| {
let id2 = id.clone();
spawn(async move {
api::API::consume_item(id2, dest(), price()).await;
navigator().go_back();
});
},
"Consume"
},
}
}
}
}
#[component]
pub fn PredefinedSelector(
name: String,
value: Signal<String>,
custom: bool,
predefined: Resource<Vec<String>>,
) -> Element {
let mut screen_visible = use_signal(|| false);
@ -60,32 +76,46 @@ pub fn PredefinedSelector(
div {
class: "p-2",
button {
class: "cursor-pointer underline text-blue-600",
class: "\
cursor-pointer rounded-lg border border-neutral-300 dark:border-neutral-700 \
px-3 py-1 text-md font-medium text-neutral-700 dark:text-neutral-300 \
hover:bg-neutral-100 dark:hover:bg-neutral-800 transition-colors duration-200",
onclick: move |_| screen_visible.set(true),
"{name}: {value}"
}
}
if *screen_visible.read() {
div {
class: "fixed inset-0 z-40 flex flex-col p-4 space-y-4 text-white",
style: "background-color: #0f1116;",
if *screen_visible.read() {
div {
class: "\
fixed inset-0 z-40 flex flex-col bg-black bg-opacity-80 p-6 space-y-6 text-white \
backdrop-blur-sm",
h2 { class: "text-xl font-bold", "Select a value for {name}" }
h2 {
class: "text-2xl font-semibold",
"Select a value for {name}"
}
if custom {
input {
class: "border p-2 text-lg",
class: "\
rounded-md border border-neutral-600 bg-neutral-900 px-4 py-2 text-lg \
text-white focus:outline-none focus:ring-2 focus:ring-blue-500 transition",
r#type: "text",
value: "{input_value}",
oninput: move |evt| input_value.set(evt.value().clone()),
}
}
div {
class: "flex flex-wrap gap-2",
match &*predefined.read() {
Some(list) => rsx ! { {list.iter().map(|item| rsx! {
div {
class: "flex flex-wrap gap-3",
match &*predefined.read() {
Some(list) => rsx! {
{list.iter().map(|item| rsx! {
button {
class: "bg-gray-200 px-3 py-1 rounded hover:bg-gray-300",
class: "\
rounded-md bg-neutral-700 px-4 py-2 text-sm hover:bg-neutral-600 \
transition-colors cursor-pointer select-none",
onclick: {
let item = item.clone();
move |_| {
@ -96,13 +126,18 @@ pub fn PredefinedSelector(
},
"{item}"
}
})}},
None => rsx!(p { "Loading..." }),
}
})}
},
None => rsx!(p { "Loading..." }),
}
}
div {
class: "mt-auto flex gap-4",
button {
class: "mt-auto bg-blue-500 text-white px-4 py-2 rounded hover:bg-blue-600",
class: "\
flex-1 bg-blue-600 hover:bg-blue-700 rounded-md px-5 py-2 text-white font-semibold \
transition-colors cursor-pointer",
onclick: move |_| {
value.set(input_value.read().clone());
screen_visible.set(false);
@ -111,11 +146,14 @@ pub fn PredefinedSelector(
}
button {
class: "text-gray-500 underline",
class: "\
flex-1 text-center underline text-neutral-400 hover:text-neutral-200 \
transition-colors cursor-pointer",
onclick: move |_| screen_visible.set(false),
"Cancel"
}
}
}
}
}
}