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>
|
|||
|
|
}
|
|||
|
|
}
|