112 lines
3.7 KiB
Rust
112 lines
3.7 KiB
Rust
use leptos::*;
|
|
use leptos_meta::*;
|
|
use reqwest::Client;
|
|
use serde::Serialize;
|
|
|
|
#[derive(Serialize)]
|
|
struct Params {
|
|
command: String,
|
|
shadeId: i32,
|
|
}
|
|
|
|
#[component]
|
|
pub fn Shutters() -> impl IntoView {
|
|
view! {
|
|
<Title text="Volets"/>
|
|
|
|
<div class="flex flex-wrap justify-center gap-2">
|
|
<Shutter name="Cuisine".to_string() shade_id=6 />
|
|
<Shutter name="Porte fenêtre".to_string() shade_id=2 />
|
|
<Shutter name="Salon fenêtre".to_string() shade_id=4 />
|
|
<Shutter name="Salon vidéo".to_string() shade_id=5 />
|
|
<Shutter name="Bureau".to_string() shade_id=1 />
|
|
</div>
|
|
}
|
|
}
|
|
|
|
#[component]
|
|
pub fn Shutter(name: String, shade_id: i32) -> impl IntoView {
|
|
let (response, set_response) = create_signal(None::<String>);
|
|
|
|
let move_up = create_action(move |_| async move {
|
|
let client = Client::new();
|
|
let params = Params {
|
|
command: "up".to_string(),
|
|
shadeId: shade_id,
|
|
};
|
|
let url = "http://192.168.3.34/shadeCommand";
|
|
|
|
match client.put(url).json(¶ms).send().await {
|
|
Ok(resp) => {
|
|
let text = resp.text().await.unwrap_or("Réponse vide".to_string());
|
|
set_response.set(Some(text));
|
|
}
|
|
Err(e) => {
|
|
set_response.set(Some(format!("Erreur: {:?}", e)));
|
|
}
|
|
}
|
|
});
|
|
|
|
let move_my = create_action(move |_| async move {
|
|
let client = Client::new();
|
|
let params = Params {
|
|
command: "my".to_string(),
|
|
shadeId: shade_id,
|
|
};
|
|
let url = "http://192.168.3.34/shadeCommand";
|
|
|
|
match client.put(url).json(¶ms).send().await {
|
|
Ok(resp) => {
|
|
let text = resp.text().await.unwrap_or("Réponse vide".to_string());
|
|
set_response.set(Some(text));
|
|
}
|
|
Err(e) => {
|
|
set_response.set(Some(format!("Erreur: {:?}", e)));
|
|
}
|
|
}
|
|
});
|
|
|
|
let move_down = create_action(move |_| async move {
|
|
let client = Client::new();
|
|
let params = Params {
|
|
command: "down".to_string(),
|
|
shadeId: shade_id,
|
|
};
|
|
let url = "http://192.168.3.34/shadeCommand";
|
|
|
|
match client.put(url).json(¶ms).send().await {
|
|
Ok(resp) => {
|
|
let text = resp.text().await.unwrap_or("Réponse vide".to_string());
|
|
set_response.set(Some(text));
|
|
}
|
|
Err(e) => {
|
|
set_response.set(Some(format!("Erreur: {:?}", e)));
|
|
}
|
|
}
|
|
});
|
|
|
|
view! {
|
|
<div class="bg-prim-light rounded-lg w-48 px-3">
|
|
<div class="text-2xl text-center">{name}</div>
|
|
<div class="flex justify-between bg-second-dark rounded *:flex-1 *:transition">
|
|
<button on:click=move |_| move_up.dispatch(()) class="hover:text-third focus:text-third-light">
|
|
<Arrow class="-rotate-90 w-8 inline".to_string() />
|
|
</button>
|
|
<button on:click=move |_| move_my.dispatch(()) class="hover:text-third focus:text-third-light">"My"</button>
|
|
<button on:click=move |_| move_down.dispatch(()) class="hover:text-third focus:text-third-light">
|
|
<Arrow class="rotate-90 w-8 inline".to_string() />
|
|
</button>
|
|
</div>
|
|
</div>
|
|
}
|
|
}
|
|
|
|
#[component]
|
|
pub fn Arrow(class: String) -> impl IntoView {
|
|
view! {
|
|
<svg xmlns="http://www.w3.org/2000/svg" width="32" height="32" viewBox="0 0 24 24" class=format!("{}", class)>
|
|
<path fill="currentColor" d="M6.23 20.23L8 22l10-10L8 2L6.23 3.77L14.46 12z"/>
|
|
</svg>
|
|
}
|
|
}
|