UI improvements - optimized for small screens, drawer now works properly, disabled scrolling when modal dialog is appeared.
This commit is contained in:
+8
-3
@@ -8,6 +8,7 @@ use crate::pages::change_pwd::ChangePassword;
|
||||
use crate::pages::profile_edit::ProfileEdit;
|
||||
use crate::pages::user_delete::UserDelete;
|
||||
use crate::pages::user_edit::UserEdit;
|
||||
use leptos_use::use_media_query;
|
||||
|
||||
#[component]
|
||||
pub fn users() -> impl IntoView {
|
||||
@@ -19,6 +20,7 @@ pub fn users() -> impl IntoView {
|
||||
move || editor.visible() || profile_editor.visible() || delete_dialog.visible(), move |_| {get_users()});
|
||||
let (usr, set_usr) = create_signal::<Vec<User>>(vec![]);
|
||||
let (profile, set_profile) = create_signal(User::default());
|
||||
let is_wide = use_media_query("(min-width: 500px)");
|
||||
|
||||
view! {
|
||||
<UserEdit opener=editor/>
|
||||
@@ -33,7 +35,8 @@ pub fn users() -> impl IntoView {
|
||||
<thead>
|
||||
<tr>
|
||||
<th>{trl("Username")}</th>
|
||||
<th>{trl("Full name")}</th>
|
||||
{move || if is_wide.get() {view! {<th>{trl("Full name")}</th>}}
|
||||
else {view! {<th></th>}} }
|
||||
<th>{trl("Admin")}</th>
|
||||
<th>{trl("Actions")}</th>
|
||||
</tr>
|
||||
@@ -60,10 +63,12 @@ pub fn users() -> impl IntoView {
|
||||
let user_profile = user.clone();
|
||||
let user_passwd = user.clone();
|
||||
let user_delete = user.clone();
|
||||
let full_name = user.full_name.clone().unwrap_or("".to_string());
|
||||
view! {
|
||||
<tr>
|
||||
<td>{&user.login}</td>
|
||||
<td>{&user.full_name.unwrap_or("".to_string())}</td>
|
||||
{move || if is_wide.get() {view! {<td>{full_name.clone()}</td>}}
|
||||
else {view! {<td></td>}} }
|
||||
<td>{if user.admin {view! {<i class="bx bx-check"></i>}}
|
||||
else {view! {<i></i>}}}</td>
|
||||
<td>
|
||||
@@ -85,7 +90,7 @@ pub fn users() -> impl IntoView {
|
||||
pwd_dialog.show();
|
||||
}>
|
||||
<i class="bx bx-lock me-1"></i> {trl("Change password")}</a>
|
||||
<a class="dropdown-item" href="javascript:void(0);" on:click=move |_| {
|
||||
<a class="dropdown-item text-danger" href="javascript:void(0);" on:click=move |_| {
|
||||
set_profile.set(user_delete.clone());
|
||||
delete_dialog.show();
|
||||
}>
|
||||
|
||||
Reference in New Issue
Block a user