ryanmwangi/Compware
1
0
Fork 0
Code Issues Pull requests Releases Activity

feat(items-list)(v0.1.0): redesign table layout to display properties as rows and items as columns

Browse source
This commit is contained in:
ryan 2025-01-02 16:13:51 +03:00
parent 9f28d30d48
commit 593bee20a7
1 changed files with 78 additions and 65 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

45
src/components/items_list.rs
View file

@ -112,28 +112,37 @@ pub fn ItemsList(
});
};
// List of properties to display as rows
let properties = vec!["Name", "Description", "Tags", "Actions"];
view! {
<div>
<h1>{ "Items List" }</h1>
<table>
<thead>
<tr>
<th>{ "Name" }</th>
<th>{ "Description" }</th>
<th>{ "Tags" }</th>
<th>{ "Actions" }</th>
<th>{ "Property" }</th>
{move || items.get().iter().enumerate().map(|(index, _)| {
view! {
<th>{ format!("Item {}", index + 1) }</th>
}
}).collect::<Vec<_>>()}
</tr>
</thead>
<tbody>
{move || items.get().iter().enumerate().map(|(index, item)| {
{properties.into_iter().map(|property| {
view! {
<tr>
// Editable Name Field with Wikidata Integration
<td>{ property }</td>
{move || items.get().iter().enumerate().map(|(index, item)| {
view! {
<td>
{match property {
"Name" => view! {
<EditableCell
value=item.name.clone()
on_input=move |value| update_item(index, "name", value)
key=format!("name-{}", index) // Unique key per cell
key=format!("name-{}", index)
/>
<ul>
{move || {
@ -168,27 +177,31 @@ pub fn ItemsList(
}).collect::<Vec<_>>()
}}
</ul>
</td>
// Editable Description Field
<td>
}.into_view(),
"Description" => view! {
<EditableCell
value=item.description.clone()
on_input=move |value| update_item(index, "description", value)
key=format!("description-{}", index)
/>
</td>
// Tag Editor
<td>
}.into_view(),
"Tags" => view! {
<TagEditor
tags=item.tags.clone()
on_add=move |key, value| add_tag(index, key, value)
on_remove=Arc::new(Mutex::new(move |tag_index: usize| remove_tag(index, tag_index)))
/>
</td>
// Actions
<td>
}.into_view(),
"Actions" => view! {
<button on:click=move |_| remove_item(index)>{ "Delete" }</button>
}.into_view(),
_ => view! {
{ "" }
}.into_view(),
}}
</td>
}
}).collect::<Vec<_>>()}
</tr>
}
}).collect::<Vec<_>>()}