Merge pull request #23 from R15-Software-Dev/feature/chipslist-kv-pairs
Implement key-value pairs for ChipsList
This commit was merged in pull request #23.
This commit is contained in:
2 files changed
+26
-10
No files matched your search
+11
-8
@@ -22,6 +22,7 @@ use crate::common::ValueType;
|
|||||||
/// ```
|
/// ```
|
||||||
#[component]
|
#[component]
|
||||||
pub fn Chip(
|
pub fn Chip(
|
||||||
|
#[prop(into)] display_text: String,
|
||||||
#[prop(into)] value: String,
|
#[prop(into)] value: String,
|
||||||
#[prop(into)] name: String,
|
#[prop(into)] name: String,
|
||||||
#[prop(into)] on_change: Callback<(), ()>,
|
#[prop(into)] on_change: Callback<(), ()>,
|
||||||
@@ -38,7 +39,7 @@ pub fn Chip(
|
|||||||
view! {
|
view! {
|
||||||
<label for=id>
|
<label for=id>
|
||||||
<input
|
<input
|
||||||
type="checkbox"
|
r#type="checkbox"
|
||||||
class="relative peer shrink-0 hidden"
|
class="relative peer shrink-0 hidden"
|
||||||
name=name.clone()
|
name=name.clone()
|
||||||
id=id.clone()
|
id=id.clone()
|
||||||
@@ -54,7 +55,7 @@ pub fn Chip(
|
|||||||
peer-disabled:peer-checked:border-gray-700
|
peer-disabled:peer-checked:border-gray-700
|
||||||
peer-disabled:cursor-default
|
peer-disabled:cursor-default
|
||||||
transition-all duration-150">
|
transition-all duration-150">
|
||||||
<span>{value.clone()}</span>
|
<span>{display_text.clone()}</span>
|
||||||
</div>
|
</div>
|
||||||
</label>
|
</label>
|
||||||
}
|
}
|
||||||
@@ -71,7 +72,8 @@ pub fn Chip(
|
|||||||
pub fn ChipsList(
|
pub fn ChipsList(
|
||||||
#[prop(into)] data_member: String,
|
#[prop(into)] data_member: String,
|
||||||
#[prop()] data_map: RwSignal<HashMap<String, ValueType>>,
|
#[prop()] data_map: RwSignal<HashMap<String, ValueType>>,
|
||||||
#[prop()] items: Vec<String>,
|
#[prop()] displayed_text: Vec<String>,
|
||||||
|
#[prop()] values: Vec<String>,
|
||||||
#[prop(default = RwSignal::new(false))] disabled: RwSignal<bool>,
|
#[prop(default = RwSignal::new(false))] disabled: RwSignal<bool>,
|
||||||
#[prop(optional, into)] label: String,
|
#[prop(optional, into)] label: String,
|
||||||
) -> impl IntoView {
|
) -> impl IntoView {
|
||||||
@@ -79,11 +81,11 @@ pub fn ChipsList(
|
|||||||
<div class="m-1.5 mt-0 mb-0">
|
<div class="m-1.5 mt-0 mb-0">
|
||||||
<span class="font-bold">{label}</span>
|
<span class="font-bold">{label}</span>
|
||||||
<div class="flex flex-row flex-wrap gap-2 mt-1">
|
<div class="flex flex-row flex-wrap gap-2 mt-1">
|
||||||
{items
|
{displayed_text.into_iter().zip(values)
|
||||||
.into_iter()
|
.into_iter()
|
||||||
.map(|item| {
|
.map(|(text, value)| {
|
||||||
let checked_signal = Signal::derive({
|
let checked_signal = Signal::derive({
|
||||||
let item_name = item.clone();
|
let item_name = value.clone();
|
||||||
let data_member = data_member.clone();
|
let data_member = data_member.clone();
|
||||||
move || {
|
move || {
|
||||||
data_map.get()
|
data_map.get()
|
||||||
@@ -97,7 +99,7 @@ pub fn ChipsList(
|
|||||||
});
|
});
|
||||||
|
|
||||||
let on_change = {
|
let on_change = {
|
||||||
let item_name = item.clone();
|
let item_name = value.clone();
|
||||||
let data_member = data_member.clone();
|
let data_member = data_member.clone();
|
||||||
move || {
|
move || {
|
||||||
let result = ValueType::String(Some(item_name.clone()));
|
let result = ValueType::String(Some(item_name.clone()));
|
||||||
@@ -133,7 +135,8 @@ pub fn ChipsList(
|
|||||||
checked=checked_signal
|
checked=checked_signal
|
||||||
name=data_member.clone()
|
name=data_member.clone()
|
||||||
on_change=on_change
|
on_change=on_change
|
||||||
value=item.clone()
|
value=value.clone()
|
||||||
|
display_text=text.clone()
|
||||||
disabled=disabled
|
disabled=disabled
|
||||||
/>
|
/>
|
||||||
}
|
}
|
||||||
|
|||||||
+15
-2
@@ -271,7 +271,7 @@ pub fn HomePage() -> impl IntoView {
|
|||||||
<ChipsList
|
<ChipsList
|
||||||
data_member="athletic_requirements"
|
data_member="athletic_requirements"
|
||||||
data_map=expandable_react.data
|
data_map=expandable_react.data
|
||||||
items=vec!(
|
displayed_text=vec!(
|
||||||
"Football", "Soccer", "Cross Country", "Cheerleading",
|
"Football", "Soccer", "Cross Country", "Cheerleading",
|
||||||
"Swimming", "Wrestling", "Ski", "Basketball",
|
"Swimming", "Wrestling", "Ski", "Basketball",
|
||||||
"Lacrosse", "Softball", "Indoor/Outdoor Track",
|
"Lacrosse", "Softball", "Indoor/Outdoor Track",
|
||||||
@@ -279,6 +279,14 @@ pub fn HomePage() -> impl IntoView {
|
|||||||
)
|
)
|
||||||
.into_iter().map(|s| s.to_owned())
|
.into_iter().map(|s| s.to_owned())
|
||||||
.collect()
|
.collect()
|
||||||
|
values=vec!(
|
||||||
|
"football", "soccer", "cross_country", "cheerleading",
|
||||||
|
"swimming", "wrestling", "ski", "basketball",
|
||||||
|
"lacrosse", "softball", "track",
|
||||||
|
"golf", "tennis", "volleyball"
|
||||||
|
)
|
||||||
|
.into_iter().map(|s| s.to_owned())
|
||||||
|
.collect()
|
||||||
disabled=elements_disabled
|
disabled=elements_disabled
|
||||||
label="Sports/Athletic Requirements"
|
label="Sports/Athletic Requirements"
|
||||||
/>
|
/>
|
||||||
@@ -287,12 +295,17 @@ pub fn HomePage() -> impl IntoView {
|
|||||||
<ChipsList
|
<ChipsList
|
||||||
data_member="community_involvement"
|
data_member="community_involvement"
|
||||||
data_map=expandable_react.data
|
data_map=expandable_react.data
|
||||||
items=vec!(
|
displayed_text=vec!(
|
||||||
"Lion's Club", "Knights of Columbus",
|
"Lion's Club", "Knights of Columbus",
|
||||||
"Community Service > 20hrs"
|
"Community Service > 20hrs"
|
||||||
)
|
)
|
||||||
.into_iter().map(|s| s.to_owned())
|
.into_iter().map(|s| s.to_owned())
|
||||||
.collect()
|
.collect()
|
||||||
|
values=vec!(
|
||||||
|
"lions_club", "koc", "serv_20h"
|
||||||
|
)
|
||||||
|
.into_iter().map(|s| s.to_owned())
|
||||||
|
.collect()
|
||||||
disabled=elements_disabled
|
disabled=elements_disabled
|
||||||
label="Required Community Involvement"
|
label="Required Community Involvement"
|
||||||
/>
|
/>
|
||||||
|
|||||||
Reference in new issue
Block a user