-
Notifications
You must be signed in to change notification settings - Fork 18
Commit
This commit does not belong to any branch on this repository, and may belong to a fork outside of the repository.
- ListEventDetailsComponent 에서 <table> 대신 DataGrid를 사용하는 방식으로 변경
- Loading branch information
Showing
11 changed files
with
197 additions
and
265 deletions.
There are no files selected for viewing
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
65 changes: 30 additions & 35 deletions
65
src/AzureOpenAIProxy.PlaygroundApp/Components/Layout/NavMenu.razor
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -1,35 +1,30 @@ | ||
| <div class="top-row ps-3 navbar navbar-dark"> | ||
| <div class="container-fluid"> | ||
| <a class="navbar-brand" href="">Azure OpenAI Proxy Playground</a> | ||
| </div> | ||
| </div> | ||
|
|
||
| <input type="checkbox" title="Navigation menu" class="navbar-toggler" /> | ||
|
|
||
| <div class="nav-scrollable" onclick="document.querySelector('.navbar-toggler').click()"> | ||
| <nav class="flex-column"> | ||
| <div class="nav-item px-3"> | ||
| <NavLink class="nav-link" href="" Match="NavLinkMatch.All"> | ||
| <span class="bi bi-house-door-fill-nav-menu" aria-hidden="true"></span> Home | ||
| </NavLink> | ||
| </div> | ||
|
|
||
| <div class="nav-item px-3"> | ||
| <NavLink class="nav-link" href="counter"> | ||
| <span class="bi bi-plus-square-fill-nav-menu" aria-hidden="true"></span> Counter | ||
| </NavLink> | ||
| </div> | ||
|
|
||
| <div class="nav-item px-3"> | ||
| <NavLink class="nav-link" href="weather"> | ||
| <span class="bi bi-list-nested-nav-menu" aria-hidden="true"></span> Weather | ||
| </NavLink> | ||
| </div> | ||
|
|
||
| <div class="nav-item px-3"> | ||
| <NavLink class="nav-link" href="events"> | ||
| <span class="bi bi-list-nested-nav-menu" aria-hidden="true"></span> Events | ||
| </NavLink> | ||
| </div> | ||
| </nav> | ||
| </div> | ||
| <div class="top-row ps-3 navbar navbar-dark"> | ||
| <div class="container-fluid"> | ||
| <a class="navbar-brand" href="">Azure OpenAI Proxy Playground</a> | ||
| </div> | ||
| </div> | ||
|
|
||
| <input type="checkbox" title="Navigation menu" class="navbar-toggler" /> | ||
|
|
||
| <div class="nav-scrollable" onclick="document.querySelector('.navbar-toggler').click()"> | ||
| <nav class="flex-column"> | ||
| <div class="nav-item px-3"> | ||
| <NavLink class="nav-link" href="" Match="NavLinkMatch.All"> | ||
| <span class="bi bi-house-door-fill-nav-menu" aria-hidden="true"></span> Home | ||
| </NavLink> | ||
| </div> | ||
|
|
||
| <div class="nav-item px-3"> | ||
| <NavLink class="nav-link" href="counter"> | ||
| <span class="bi bi-plus-square-fill-nav-menu" aria-hidden="true"></span> Counter | ||
| </NavLink> | ||
| </div> | ||
|
|
||
| <div class="nav-item px-3"> | ||
| <NavLink class="nav-link" href="weather"> | ||
| <span class="bi bi-list-nested-nav-menu" aria-hidden="true"></span> Weather | ||
| </NavLink> | ||
| </div> | ||
| </nav> | ||
| </div> | ||
|
|
11 changes: 11 additions & 0 deletions
11
src/AzureOpenAIProxy.PlaygroundApp/Components/Pages/AdminEvents.razor
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -0,0 +1,11 @@ | ||
| @page "/events" | ||
|
|
||
| @using AzureOpenAIProxy.PlaygroundApp.Components.UI.Admin | ||
|
|
||
| <PageTitle>AdminEvents</PageTitle> | ||
|
|
||
| <h1>AdminEvents</h1> | ||
|
|
||
| <p>This component demonstrates showing admin events.</p> | ||
|
|
||
| <AdminListEventDetailsComponent @rendermode="InteractiveServer" /> |
11 changes: 0 additions & 11 deletions
11
src/AzureOpenAIProxy.PlaygroundApp/Components/Pages/Events.razor
This file was deleted.
Oops, something went wrong.
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
113 changes: 113 additions & 0 deletions
113
src/AzureOpenAIProxy.PlaygroundApp/Components/UI/Admin/AdminListEventDetailsComponent.razor
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -0,0 +1,113 @@ | ||
| @using AzureOpenAIProxy.PlaygroundApp.Components.UI.Admin | ||
|
|
||
| @using AzureOpenAIProxy.ApiApp.Models | ||
|
|
||
| <div id="evt-detail-comp"> | ||
| @if (eventDetails == null) | ||
| { | ||
| <p><em>Loading...</em></p> | ||
| } | ||
| else | ||
| { | ||
| <div id="evt-detail-tbl"> | ||
| <FluentDataGrid Items="@eventDetails" Pagination="@pagination" > | ||
| <PropertyColumn Class="fluent-datagrid-cell" Property="@(p => p.Title)" Align="@Align.Center" Sortable="true" /> | ||
| <PropertyColumn Class="fluent-datagrid-cell" Property="@(p => p.DateStart)" Format="yyyy-MM-dd" Align="@Align.Center" Sortable="true" /> | ||
| <PropertyColumn Class="fluent-datagrid-cell" Property="@(p => p.DateEnd)" Format="yyyy-MM-dd" Align="@Align.Center" Sortable="true" /> | ||
| <PropertyColumn Class="fluent-datagrid-cell" Property="@(p => p.TimeZone)" Align="@Align.Center" Sortable="true" /> | ||
| <PropertyColumn Class="fluent-datagrid-cell" Property="@(p => p.OrganizerName)" Align="@Align.Center" Sortable="true" /> | ||
| <PropertyColumn Class="fluent-datagrid-cell" Property="@(p => p.CoorganizerName)" Align="@Align.Center" Sortable="true" /> | ||
| <PropertyColumn Class="fluent-datagrid-cell" Property="@(p => p.MaxTokenCap)" Align="@Align.Center" Sortable="true" /> | ||
| <PropertyColumn Class="fluent-datagrid-cell" Property="@(p => p.DailyRequestCap)" Align="@Align.Center" Sortable="true" /> | ||
| <TemplateColumn Class="fluent-datagrid-cell" Title="Active" Align="@Align.Center"> | ||
| <AdminEventDetailElemActiveComponent | ||
| IsActive="@(((AdminEventDetails)@context).IsActive.HasValue && | ||
| ((AdminEventDetails)@context).IsActive.Value)" /> | ||
| </TemplateColumn> | ||
| <TemplateColumn Class="fluent-datagrid-cell" Title="Actions" Align="@Align.Center"> | ||
| <FluentButton aria-label="Edit item" IconEnd="@(new Icons.Regular.Size16.Edit())" /> | ||
| <FluentButton aria-label="Delete item" IconEnd="@(new Icons.Regular.Size16.Delete())" /> | ||
| </TemplateColumn> | ||
| </FluentDataGrid> | ||
| </div> | ||
|
|
||
| <div class="page-button-box"> | ||
| @if (pagination.TotalItemCount.HasValue) | ||
| { | ||
| for (var pageIndex = 0; pageIndex <= pagination.LastPageIndex; pageIndex++) | ||
| { | ||
| var capturedIndex = pageIndex; | ||
| <FluentButton class="page-button" @onclick="@(() => GoToPageAsync(capturedIndex))" Appearance="@PageButtonAppearance(capturedIndex)" | ||
| aria-current="@AriaCurrentValue(capturedIndex)"> | ||
| @(capturedIndex + 1) | ||
| </FluentButton> | ||
| } | ||
| } | ||
| </div> | ||
| } | ||
| </div> | ||
|
|
||
| <style> | ||
| .fluent-datagrid-cell { | ||
| display: flex; | ||
| align-items: center; | ||
| justify-content: center; | ||
| height: 100%; | ||
| } | ||
| .page-button-box { | ||
| display: flex; | ||
| justify-content: center; | ||
| align-items: center; | ||
| margin-top: 20px; | ||
| } | ||
| .page-button { | ||
| margin-left: 10px; | ||
| } | ||
| </style> | ||
|
|
||
| @code { | ||
| IQueryable<AdminEventDetails>? eventDetails; | ||
| PaginationState pagination = new PaginationState { ItemsPerPage = 10 }; | ||
|
|
||
| protected override async Task OnInitializedAsync() | ||
| { | ||
| // Simulate asynchronous loading to demonstrate streaming rendering | ||
| await Task.Delay(100); | ||
|
|
||
| var startDate = DateOnly.FromDateTime(DateTime.Now); | ||
|
|
||
| // make dummy data | ||
| eventDetails = Enumerable.Range(1, 150).Select(index => new AdminEventDetails | ||
| { | ||
| EventId = Guid.NewGuid().ToString(), | ||
| Title = $"event title #{index}", | ||
| Summary = "dummy summary", | ||
| Description = "dummy description", | ||
| DateStart = DateTimeOffset.Now, | ||
| DateEnd = DateTimeOffset.Now.AddDays(7 + index), | ||
| TimeZone = "KST", | ||
| IsActive = index % 3 == 0, | ||
| OrganizerName = $"Charlie_{index}", | ||
| OrganizerEmail = $"user_{index}@gmail.com", | ||
| CoorganizerName = $"Bravo_{index}", | ||
| CoorganizerEmail = $"support_{index}@gmail.com", | ||
| MaxTokenCap = (100 + index) * 100, | ||
| DailyRequestCap = index * 10 | ||
| }).AsQueryable(); | ||
|
|
||
| pagination.TotalItemCountChanged += (sender, eventArgs) => StateHasChanged(); | ||
| } | ||
|
|
||
| private async Task GoToPageAsync(int pageIndex) | ||
| { | ||
| await pagination.SetCurrentPageIndexAsync(pageIndex); | ||
| } | ||
|
|
||
| private Appearance PageButtonAppearance(int pageIndex) | ||
| => pagination.CurrentPageIndex == pageIndex ? Appearance.Accent : Appearance.Neutral; | ||
|
|
||
| private string? AriaCurrentValue(int pageIndex) | ||
| => pagination.CurrentPageIndex == pageIndex ? "page" : null; | ||
| } |
22 changes: 0 additions & 22 deletions
22
src/AzureOpenAIProxy.PlaygroundApp/Components/UI/Admin/EventDetailElemComponent.razor
This file was deleted.
Oops, something went wrong.
125 changes: 0 additions & 125 deletions
125
src/AzureOpenAIProxy.PlaygroundApp/Components/UI/Admin/ListEventDetailsComponent.razor
This file was deleted.
Oops, something went wrong.
15 changes: 0 additions & 15 deletions
15
src/AzureOpenAIProxy.PlaygroundApp/Components/UI/Admin/ListEventDetailsHeaderComponent.razor
This file was deleted.
Oops, something went wrong.
Oops, something went wrong.