emilia
/
plate-tool
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Close and delete plates

This commit is contained in:
Emilia Allison 2023-05-23 21:08:32 -04:00
parent 5c3fa24f20
commit 85f3fbd113
Signed by: emilia
GPG Key ID: 7A3F8997BFE894E0
3 changed files with 110 additions and 2 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

3
assets/css/global.css
View File

@ -31,6 +31,9 @@ div.tree {
height: 100%; height: 100%;
border: 2px solid green; border: 2px solid green;
} }
div.tree li {
user-select: none;
}
div.transfer_menu { div.transfer_menu {
grid-column: left / left; grid-column: left / left;

10
src/components/states.rs
View File

@ -1,5 +1,7 @@
use serde::{Serialize, Deserialize}; use serde::{Serialize, Deserialize};
use yewdux::{prelude::*, storage}; use yewdux::{prelude::*, storage};
use uuid::Uuid;
use super::transfer_menu::RegionDisplay; use super::transfer_menu::RegionDisplay;
use crate::data::plate_instances::PlateInstance; use crate::data::plate_instances::PlateInstance;
use crate::data::transfer::Transfer; use crate::data::transfer::Transfer;
@ -66,4 +68,12 @@ impl MainState {
assert!(plate.plate.plate_type == PlateType::Destination); assert!(plate.plate.plate_type == PlateType::Destination);
self.destination_plates.push(plate); self.destination_plates.push(plate);
} }
pub fn del_plate(&mut self, id: Uuid) {
if let Some(index) = self.source_plates.iter().position(|spi| {spi.get_uuid() == id}) {
self.source_plates.swap_remove(index);
}
if let Some(index) = self.destination_plates.iter().position(|dpi| {dpi.get_uuid() == id}) {
self.destination_plates.swap_remove(index);
}
}
} }

99
src/components/tree.rs
View File

@ -1,5 +1,8 @@
#![allow(non_snake_case)] #![allow(non_snake_case)]
use uuid::Uuid;
use wasm_bindgen::JsCast;
use web_sys::{EventTarget, HtmlElement, HtmlDialogElement};
use yew::prelude::*; use yew::prelude::*;
use yewdux::prelude::*; use yewdux::prelude::*;
@ -15,13 +18,47 @@ pub struct TreeProps {
#[function_component] #[function_component]
pub fn Tree(props: &TreeProps) -> Html { pub fn Tree(props: &TreeProps) -> Html {
let (state, dispatch) = use_store::<MainState>(); let (state, dispatch) = use_store::<MainState>();
let plate_menu_id: UseStateHandle<Option<Uuid>> = use_state(|| {None});
let open_plate_info_callback = {
let plate_menu_id =plate_menu_id.clone();
Callback::from(move |e: MouseEvent| {
let target: Option<EventTarget> = e.target();
let li = target.and_then(|t| t.dyn_into::<HtmlElement>().ok());
if let Some(li) = li {
if let Ok(id) = u128::from_str_radix(li.id().as_str(), 10) {
plate_menu_id.set(Some(Uuid::from_u128(id)));
}
}
})
};
let plate_info_close_callback = {
let plate_menu_id =plate_menu_id.clone();
Callback::from(move |_| {
plate_menu_id.set(None);
})
};
let plate_info_delete_callback = {
let dispatch = dispatch.clone();
let plate_menu_id =plate_menu_id.clone();
Callback::from(move |_| {
if let Some(id) = *plate_menu_id {
dispatch.reduce_mut(|state| {
state.del_plate(id);
});
}
})
};
let source_plates = state.source_plates.iter() let source_plates = state.source_plates.iter()
.map(|spi| { .map(|spi| {
html!{ <li> {String::from(spi)} </li> } html!{ <li id={spi.get_uuid().as_u128().to_string()}
ondblclick={open_plate_info_callback.clone()}> {String::from(spi)} </li> }
}).collect::<Html>(); }).collect::<Html>();
let dest_plates = state.destination_plates.iter() let dest_plates = state.destination_plates.iter()
.map(|spi| { .map(|spi| {
html!{ <li> {String::from(spi)} </li> } html!{ <li id={spi.get_uuid().as_u128().to_string()}
ondblclick={open_plate_info_callback.clone()}> {String::from(spi)} </li> }
}).collect::<Html>(); }).collect::<Html>();
@ -44,6 +81,10 @@ pub fn Tree(props: &TreeProps) -> Html {
<ul> <ul>
</ul> </ul>
</div> </div>
if let Some(id) = *plate_menu_id {
<PlateInfoModal id={id} dialog_close_callback={plate_info_close_callback}
delete_button_callback={plate_info_delete_callback}/>
}
// Temporary // Temporary
<div> <div>
<button type="button" <button type="button"
@ -56,3 +97,57 @@ pub fn Tree(props: &TreeProps) -> Html {
</div> </div>
} }
} }
#[derive(PartialEq, Properties)]
struct PlateInfoModalProps {
id: Uuid,
dialog_close_callback: Callback<()>,
delete_button_callback: Callback<()>,
}
#[function_component]
fn PlateInfoModal(props: &PlateInfoModalProps) -> Html {
let (state, dispatch) = use_store::<MainState>();
let dialog_ref = use_node_ref();
let mut plate = state.source_plates.iter()
.find(|spi| {spi.get_uuid() == props.id});
if plate == None {
plate = state.destination_plates.iter()
.find(|dpi| {dpi.get_uuid() == props.id});
}
let plate_name = match plate {
Some(plate) => plate.name.clone(),
None => "Not Found".to_string()
};
let onclose = {
let dialog_close_callback = props.dialog_close_callback.clone();
move |_| {dialog_close_callback.emit(())}
};
let delete_onclick = {
let delete_button_callback = props.delete_button_callback.clone();
let dialog_ref = dialog_ref.clone();
move |_| {
delete_button_callback.emit(());
dialog_ref.cast::<HtmlDialogElement>().unwrap().close();
}
};
{
let dialog_ref = dialog_ref.clone();
use_effect_with_deps(|dialog_ref| {
dialog_ref.cast::<HtmlDialogElement>().unwrap().show_modal().ok();
},
dialog_ref);
}
html! {
<dialog ref={dialog_ref} class="dialog" onclose={onclose}>
<h2>{"Plate Info"}</h2>
<h3>{"Name: "}<input type="text" value={plate_name} /></h3>
<button onclick={delete_onclick}>{"Delete"}</button>
</dialog>
}
}