43 lines
1.4 KiB
Rust
43 lines
1.4 KiB
Rust
use crate::prelude::*;
|
||
use leptos::prelude::*;
|
||
|
||
#[component]
|
||
pub fn About () -> impl IntoView {
|
||
let state = expect_context::<Context>();
|
||
let player = state.player();
|
||
|
||
let class = player.class();
|
||
let level = player.level();
|
||
let xp = player.xp();
|
||
|
||
let adjust_level = move |adjustment: i8| level.update(|l| {
|
||
if let Some(new) = l.checked_add_signed(adjustment) {
|
||
*l = new;
|
||
}
|
||
});
|
||
|
||
let adjust_xp = move |ev: Targeted<Event, HtmlInputElement>| {
|
||
utils::adjust_checked(ev, xp);
|
||
};
|
||
|
||
view! {
|
||
<div class="about">
|
||
<div class="class">
|
||
<input id="class" type="text" class="header-input" bind:value=class/>
|
||
</div>
|
||
<div class="level">
|
||
{move || level.get()}
|
||
<span> уровня</span>
|
||
</div>
|
||
<div class="level-adjust">
|
||
<button title="Уменьшить уровень" on:click=move |_| adjust_level(-1)>-</button>
|
||
<button title="Увеличить уровень" on:click=move |_| adjust_level( 1)>+</button>
|
||
</div>
|
||
<div class="xp">
|
||
<input min=0 id="xp" type="number" class="header-input" on:input:target=move |e| adjust_xp(e) prop:value=move || xp.get() />
|
||
<span> XP</span>
|
||
</div>
|
||
</div>
|
||
}
|
||
}
|