add selectable free groups

This commit is contained in:
rick 2022-10-29 13:39:11 +02:00
parent 11c3592164
commit 55ca7a9e95
Signed by: Rick
GPG key ID: 4A6223D66294EB20

View file

@ -1,14 +1,17 @@
use gloo_net::http::Request; use gloo_net::http::Request;
use gloo_net::Error; use gloo_net::Error;
use patternfly_yew::{Button, Flex, FlexModifier, Gallery, ToastViewer, ToFlexItems, Variant, WithBreakpointExt}; use patternfly_yew::{Button, Card, Flex, FlexModifier, Icon, Modal, ModalVariant, Title, ToastViewer, ToFlexItems, Variant, WithBreakpointExt}; use yew::prelude::*;
use yew::prelude::*;
use crate::components::{Group, Home, TestMessage, ToastFields, ToastType}; use crate::components::{Group, Home, TestMessage, ToastFields, ToastType};
#[derive(Default)]
pub struct ListGroups { pub struct ListGroups {
idUser: String, idUser: String,
groups: Vec<Group>, groups: Vec<Group>,
free_groups: Vec<Group>,
nb_show: usize, nb_show: usize,
selected_group: usize,
join: bool,
} }
#[derive(PartialEq, Properties)] #[derive(PartialEq, Properties)]
@ -18,10 +21,25 @@ pub struct PropGroups {
#[derive(PartialEq)] #[derive(PartialEq)]
pub enum MsgListGroups { pub enum MsgListGroups {
/// Tous les groupes ont été récupéré
Done(Vec<Group>), Done(Vec<Group>),
Info(String, String), /// Tous les groupes sans l'utilisateur ont été récupéré
Error(String, String), DoneFree(Vec<Group>),
/// Afficher plus de groupes
More, More,
/// Afficher ou cacher la fenetre pour rejoindre des groupes
ToggleJoin,
/// Annuler la sélection de nouveaux groupes
CancelJoin,
/// Lorsque l'utilisateur clique sur un groupe, on l'enregistre au vu de
/// son ajout futur
SelectGroup(usize),
/// Sélection du nouveau groupe faite, envoie d'un requete en back
FinishJoin,
/// Popup d'informations
Info(String, String),
/// Popup d'erreur
Error(String, String),
} }
impl Component for ListGroups { impl Component for ListGroups {
@ -31,8 +49,7 @@ impl Component for ListGroups {
fn create(ctx: &Context<Self>) -> Self { fn create(ctx: &Context<Self>) -> Self {
Self { Self {
idUser: ctx.props().id.clone(), idUser: ctx.props().id.clone(),
groups: Vec::new(), ..Default::default()
nb_show: 0,
} }
} }
@ -67,7 +84,41 @@ impl Component for ListGroups {
}); });
} }
let onclick = ctx.link().callback(|_| MsgListGroups::More); if self.free_groups.len() == 0 {
let id = self.idUser.clone();
ctx.link().send_future(async move {
match Request::get(&format!("/api/users/{}/not/groups", id))
.send()
.await
{
Ok(resp) => {
if resp.ok() {
let json: Result<Vec<Group>, Error> = resp.json().await;
match json {
Ok(mut json) => {
for item in json.iter_mut() {
item.get_game_name().await;
}
return MsgListGroups::DoneFree(json);
}
Err(err) => {
log::info!("{}", err.to_string());
()
}
}
}
}
Err(_) => (),
};
MsgListGroups::Info(String::from("Ok"), String::new())
});
}
let more = ctx.link().callback(|_| MsgListGroups::More);
let join = ctx.link().callback(|_| MsgListGroups::ToggleJoin);
let cancel_join = ctx.link().callback(|_| MsgListGroups::CancelJoin);
let finish_join = ctx.link().callback(|_| MsgListGroups::FinishJoin);
let groups: Vec<Html> = self.groups[..self.nb_show].iter().map(|group| { html!{ let groups: Vec<Html> = self.groups[..self.nb_show].iter().map(|group| { html!{
<div> <div>
<h1>{ group.name.clone() }</h1> <h1>{ group.name.clone() }</h1>
@ -83,6 +134,25 @@ impl Component for ListGroups {
html! { html! {
<> <>
<ToastViewer /> <ToastViewer />
<Title>{ "Vos groupes" }</Title>
<Button onclick={join} icon={Some(Icon::PlusCircleIcon)}>{ "Rejoindre un groupe" }</Button>
if self.join {
<Modal onclose={cancel_join} variant={ ModalVariant::Medium }>
{ self.free_groups.iter().enumerate().map(|(id, group)| {
html! {
<Card
onclick={ctx.link().callback(move |_| MsgListGroups::SelectGroup(id))}
selectable=true
selected={self.selected_group == id}
>
{group.name.clone()}
</Card>
}
}).collect::<Html>() }
<Button onclick={finish_join}>{ "Valider" }</Button>
</Modal>
}
if self.groups.len() > 0 { if self.groups.len() > 0 {
{ {
html!{ html!{
@ -93,7 +163,7 @@ impl Component for ListGroups {
</Flex> </Flex>
if self.nb_show < self.groups.len() { if self.nb_show < self.groups.len() {
<Button variant={Variant::Primary} onclick={onclick}>{ "Plus de groupes" }</Button> <Button variant={Variant::Primary} onclick={more}>{ "Plus de groupes" }</Button>
} }
</div> </div>
} }
@ -138,6 +208,27 @@ impl Component for ListGroups {
return true; return true;
} }
MsgListGroups::DoneFree(groups) => {
let len = groups.len();
self.free_groups = groups;
return true;
}
MsgListGroups::ToggleJoin => {
self.join = !self.join;
return true;
}
MsgListGroups::CancelJoin => {
self.join = false;
return true;
}
MsgListGroups::FinishJoin => {
return false;
}
MsgListGroups::SelectGroup(id) => {
self.selected_group = id;
return true;
}
MsgListGroups::More => { MsgListGroups::More => {
self.nb_show += 3; self.nb_show += 3;
if self.nb_show > self.groups.len() { if self.nb_show > self.groups.len() {