| | 1 | | @namespace Syki.Front.Pages.Adm |
| | 2 | |
|
| | 3 | | @page "/adm/users" |
| | 4 | | @attribute [Authorize(Roles = "Adm")] |
| | 5 | |
|
| | 6 | | <SykiPageTitle Title="Usuários" /> |
| | 7 | |
|
| | 8 | | <MudContainer Class="my-4 px-4"> |
| | 9 | | <MudCard> |
| | 10 | | <MudCardContent> |
| | 11 | | <MudGrid> |
| | 12 | | <MudItem xs="12" sm="8" md="8" lg="8"> |
| | 13 | | <MudStack Row="true" AlignItems="AlignItems.Center"> |
| | 14 | | <MudIcon Icon="@Icons.Material.Filled.People" Class="mb-1" Size="Size.Large"/> |
| | 15 | | <MudText Typo="Typo.h5" Class="mt-1" Style="font-weight: bold">Usuários</MudText> |
| | 16 | | </MudStack> |
| | 17 | | </MudItem> |
| | 18 | | <MudItem xs="12" sm="4" md="4" lg="4" Class="d-flex justify-end"> |
| | 19 | | <MudTooltip Text="@GetOnlineChipText()" Arrow="true" Placement="Placement.Left"> |
| | 20 | | <MudChip |
| | 21 | | T="string" |
| | 22 | | Class="px-5 ma-0" |
| | 23 | | Size="Size.Large" |
| | 24 | | Color="@Color.Success" |
| | 25 | | IconColor="Color.Default" |
| | 26 | | Icon="@Icons.Material.Filled.CheckCircle"> |
| 0 | 27 | | @_users.Count(x => x.Online).Format() Online |
| | 28 | | </MudChip> |
| | 29 | | </MudTooltip> |
| | 30 | | </MudItem> |
| | 31 | | </MudGrid> |
| | 32 | | </MudCardContent> |
| | 33 | | </MudCard> |
| | 34 | |
|
| | 35 | | <MudContainer Class="px-0 my-4"> |
| | 36 | | <style>.mud-table-toolbar { height: auto }</style> |
| | 37 | | <MudDataGrid Class="px-4 pt-4 pb-2" Items="@GetUsers()" QuickFilter="@_quickFilter" Hover="true" Loading="@_load |
| | 38 | | <ToolBarContent> |
| | 39 | | <MudGrid Class="align-center" Spacing="3"> |
| | 40 | | <MudItem xs="12" sm="3" md="3" lg="3"> |
| | 41 | | <MudStack Row="true" AlignItems="AlignItems.Center" Spacing="3" Style="width: 100%;"> |
| | 42 | | <MudToggleGroup T="string" SelectionMode="SelectionMode.SingleSelection" @bind-Value="@_stat |
| | 43 | | <MudToggleItem Value="@("Todos")" UnselectedIcon="" SelectedIcon="" /> |
| | 44 | | <MudToggleItem Value="@("Online")" UnselectedIcon="@Icons.Material.Filled.CheckCircle" S |
| | 45 | | </MudToggleGroup> |
| | 46 | | </MudStack> |
| | 47 | | </MudItem> |
| | 48 | | <MudItem xs="12" sm="9" md="9" lg="9" Class="d-flex justify-end"> |
| | 49 | | <SykiDataGridSearchTextField @bind-Value="@_searchString" Placeholder="Busque por qualquer atrib |
| | 50 | | </MudItem> |
| | 51 | | </MudGrid> |
| | 52 | | </ToolBarContent> |
| | 53 | | <Columns> |
| | 54 | | <PropertyColumn Property="x => x.Name" Title="Nome"/> |
| | 55 | | <PropertyColumn Property="x => x.Email" Title="Email"/> |
| | 56 | | <PropertyColumn Property="x => x.Institution" Title="Instituição"/> |
| | 57 | | <PropertyColumn Property="x => x.Role" Title="Role"/> |
| | 58 | | <TemplateColumn> |
| | 59 | | <CellTemplate> |
| | 60 | | <MudTooltip Text="@GetOnlineText(context.Item)" Arrow="true" Placement="Placement.Top"> |
| | 61 | | <MudIcon |
| | 62 | | Size="@Size.Small" |
| | 63 | | Icon="@GetOnlineIcon(context.Item.Online)" |
| | 64 | | Color="GetOnlineIconColor(context.Item.Online)"/> |
| | 65 | | </MudTooltip> |
| | 66 | | </CellTemplate> |
| | 67 | | </TemplateColumn> |
| | 68 | | </Columns> |
| | 69 | | <NoRecordsContent> |
| 0 | 70 | | @(GetNotFoundMessage()) |
| | 71 | | </NoRecordsContent> |
| | 72 | | <PagerContent> |
| | 73 | | <MudGrid Class="align-center" Spacing="3"> |
| | 74 | | <MudItem xs="12" sm="3" md="3" lg="3"> |
| | 75 | | <MudButton OnClick="@LoadUsers" Variant="Variant.Filled" Size="Size.Small" Class="ml-4" StartIco |
| | 76 | | Atualizar |
| | 77 | | </MudButton> |
| | 78 | | </MudItem> |
| | 79 | | <MudItem xs="12" sm="9" md="9" lg="9"> |
| | 80 | | <SykiDataGridPager T="UserOut"/> |
| | 81 | | </MudItem> |
| | 82 | | </MudGrid> |
| | 83 | | </PagerContent> |
| | 84 | | </MudDataGrid> |
| | 85 | | </MudContainer> |
| | 86 | | </MudContainer> |
| | 87 | |
|
| | 88 | | @inject GetUsersClient GetUsersClient |
| | 89 | |
|
| | 90 | | @code |
| | 91 | | { |
| | 92 | | private bool _loading; |
| | 93 | | private string _searchString; |
| 0 | 94 | | private List<UserOut> _users = []; |
| | 95 | |
|
| 0 | 96 | | private string _statusFilter = "Todos"; |
| | 97 | |
|
| | 98 | | protected override async Task OnInitializedAsync() |
| | 99 | | { |
| 0 | 100 | | await LoadUsers(); |
| 0 | 101 | | } |
| | 102 | |
|
| | 103 | | private async Task LoadUsers() |
| | 104 | | { |
| 0 | 105 | | _loading = true; |
| 0 | 106 | | _users = await GetUsersClient.Get(); |
| 0 | 107 | | _loading = false; |
| 0 | 108 | | } |
| | 109 | |
|
| | 110 | | private List<UserOut> GetUsers() |
| | 111 | | { |
| 0 | 112 | | if (_statusFilter.Equals("Online")) |
| 0 | 113 | | return _users.Where(x => x.Online).ToList(); |
| | 114 | |
|
| 0 | 115 | | return _users; |
| | 116 | | } |
| | 117 | |
|
| | 118 | | private string GetOnlineChipText() |
| | 119 | | { |
| 0 | 120 | | var total = _users.Sum(x => x.Connections); |
| 0 | 121 | | var message = total == 1 ? "conexão" : "conexões"; |
| 0 | 122 | | return $"{total.Format()} {message}"; |
| | 123 | | } |
| | 124 | |
|
| | 125 | | private static string GetOnlineText(UserOut user) |
| | 126 | | { |
| 0 | 127 | | var message = user.Connections == 1 ? "conexão" : "conexões"; |
| 0 | 128 | | return user.Online ? $"{user.Connections.Format()} {message}" : "Offline"; |
| | 129 | | } |
| | 130 | |
|
| | 131 | | private static string GetOnlineIcon(bool online) |
| | 132 | | { |
| 0 | 133 | | return online ? Icons.Material.Filled.CheckCircle : @Icons.Material.Filled.RemoveCircleOutline; |
| | 134 | | } |
| | 135 | |
|
| | 136 | | private static Color GetOnlineIconColor(bool online) |
| | 137 | | { |
| 0 | 138 | | return online ? Color.Success : Color.Default; |
| | 139 | | } |
| | 140 | |
|
| 0 | 141 | | private Func<UserOut, bool> _quickFilter => x => _searchString.IsIn(x.Name, x.Email, x.Institution, x.Role); |
| | 142 | | private string GetNotFoundMessage() |
| | 143 | | { |
| 0 | 144 | | return (_searchString.IsEmpty()) ? "Não existem usuários cadastrados ainda." : "Nenhum usuário encontrado."; |
| | 145 | | } |
| | 146 | | } |