ux: eliminate white-flash on Blazor navigation from Inquiry page
TaxBaik CI/CD / build-and-deploy (push) Successful in 50s

- App.razor: loading overlay starts with `show` class (visible on cold load)
- admin-session.js: add showLoading()/hideLoading(); MutationObserver detects
  .admin-page-hero / .admin-login-page instead of mud-element count threshold;
  observer restarts on every navigation cycle via LocationChanged
- MainLayout.razor: subscribe to NavigationManager.LocationChanged →
  call JS showLoading() on every route change; implements IDisposable
- InquiryList.razor: remove unused IInquiryRepository injection; load data
  once (GetPagedAsync(1,200)) and pass IReadOnlyList to all six tab panels
- InquiryTable.razor: accept Inquiries parameter; filter synchronously in
  OnParametersSet() — eliminates 6 redundant API calls per page visit
- admin.css: overlay fade-in animation (0.15s); page content fade-in on
  route mount via .admin-page-hero / .admin-login-page animation (0.25s)

Co-Authored-By: Claude Haiku 4.5 <noreply@anthropic.com>
This commit is contained in:
2026-06-28 15:29:58 +09:00
parent 27f57ff925
commit fb9c77943f
6 changed files with 144 additions and 83 deletions
@@ -1,7 +1,7 @@
@page "/admin/inquiries"
@attribute [Authorize]
@using TaxBaik.Domain.Interfaces
@inject IInquiryRepository InquiryRepository
@using TaxBaik.Web.Services
@inject IInquiryBrowserClient InquiryClient
<PageTitle>문의 관리</PageTitle>
@@ -13,25 +13,44 @@
</div>
</section>
<MudPaper Class="admin-surface" Elevation="0">
<MudTabs Rounded="true" Elevation="0" Class="admin-tabs">
<MudTabPanel Text="전체">
<InquiryTable Status="" />
</MudTabPanel>
<MudTabPanel Text="신규">
<InquiryTable Status="new" />
</MudTabPanel>
<MudTabPanel Text="상담중">
<InquiryTable Status="consulting" />
</MudTabPanel>
<MudTabPanel Text="계약완료">
<InquiryTable Status="contracted" />
</MudTabPanel>
<MudTabPanel Text="거절">
<InquiryTable Status="rejected" />
</MudTabPanel>
<MudTabPanel Text="종결">
<InquiryTable Status="closed" />
</MudTabPanel>
</MudTabs>
</MudPaper>
@if (isLoading)
{
<MudProgressCircular Indeterminate="true" Class="ma-4" />
}
else
{
<MudPaper Class="admin-surface" Elevation="0">
<MudTabs Rounded="true" Elevation="0" Class="admin-tabs">
<MudTabPanel Text="전체">
<InquiryTable Inquiries="allInquiries" Status="" />
</MudTabPanel>
<MudTabPanel Text="신규">
<InquiryTable Inquiries="allInquiries" Status="new" />
</MudTabPanel>
<MudTabPanel Text="상담중">
<InquiryTable Inquiries="allInquiries" Status="consulting" />
</MudTabPanel>
<MudTabPanel Text="계약완료">
<InquiryTable Inquiries="allInquiries" Status="contracted" />
</MudTabPanel>
<MudTabPanel Text="거절">
<InquiryTable Inquiries="allInquiries" Status="rejected" />
</MudTabPanel>
<MudTabPanel Text="종결">
<InquiryTable Inquiries="allInquiries" Status="closed" />
</MudTabPanel>
</MudTabs>
</MudPaper>
}
@code {
private bool isLoading = true;
private IReadOnlyList<Domain.Entities.Inquiry> allInquiries = [];
protected override async Task OnInitializedAsync()
{
var (items, _) = await InquiryClient.GetPagedAsync(1, 200);
allInquiries = items.ToList();
isLoading = false;
}
}