refactor: admin ui를 fluent v5와 html 기반으로 전환

TaxBaik.Web/Components/Admin/Pages/Companies/CompanyList.razor

@@ -1,53 +1,71 @@
 @page "/admin/companies"
 @attribute [Authorize]
 @inject IApiClient ApiClient
-@inject ISnackbar Snackbar
+@inject IJSRuntime JS
 
 <PageTitle>고객사 관리</PageTitle>
 
 <section class="admin-page-hero">
     <div>
-        <MudText Typo="Typo.caption" Class="admin-eyebrow">Settings</MudText>
-        <MudText Typo="Typo.h4" Class="admin-page-title">고객사 관리</MudText>
-        <MudText Typo="Typo.body2" Class="admin-page-subtitle">등록된 고객사를 관리하고 새로운 고객사를 추가합니다.</MudText>
+        <div class="admin-eyebrow">Settings</div>
+        <h1 class="admin-page-title">고객사 관리</h1>
+        <p class="admin-page-subtitle">등록된 고객사를 관리하고 새로운 고객사를 추가합니다.</p>
     </div>
-    <MudButton Variant="Variant.Filled" Color="Color.Primary" StartIcon="@Icons.Material.Filled.Add"
-        Href="/taxbaik/admin/companies/create">새 고객사 등록</MudButton>
+    <button type="button" class="site-button primary" @onclick='() => NavTo("/taxbaik/admin/companies/create")'>새 고객사 등록</button>
 </section>
 
-<MudPaper Class="admin-surface mb-4 mt-4" Elevation="0">
-    <MudStack Row="true" AlignItems="AlignItems.Center" Justify="Justify.SpaceBetween">
-        <MudText Typo="Typo.subtitle1">@($"전체 고객사 {totalCompanies}개")</MudText>
-        <MudText Typo="Typo.body2">페이지 @currentPage / @totalPages</MudText>
-    </MudStack>
-</MudPaper>
+<div class="admin-surface mb-4 mt-4">
+    <div class="admin-summary-bar">
+        <span>@($"전체 고객사 {totalCompanies}개")</span>
+        <span>페이지 @currentPage / @totalPages</span>
+    </div>
+</div>
 
-<MudDataGrid Items="@companies" Striped="true" Hoverable="true" Loading="@isLoading" Class="admin-grid">
-    <Columns>
-        <PropertyColumn Property="x => x.CompanyCode" Title="회사코드" />
-        <PropertyColumn Property="x => x.CompanyName" Title="회사명" />
-        <PropertyColumn Property="x => x.ContactPerson" Title="담당자" />
-        <PropertyColumn Property="x => x.Phone" Title="전화" />
-        <PropertyColumn Property="x => x.Email" Title="이메일" />
-        <PropertyColumn Property="x => x.IsActive" Title="활성">
-            <CellTemplate Context="cell">
-                <MudCheckBox T="bool" Value="@cell.Item.IsActive" Disabled="true" />
-            </CellTemplate>
-        </PropertyColumn>
-        <PropertyColumn Property="x => x.CreatedAt" Title="등록일" Format="yyyy-MM-dd" />
-        <TemplateColumn>
-            <CellTemplate Context="cell">
-                <MudButton Variant="Variant.Outlined" Size="Size.Small" Color="Color.Primary"
-                    Href="@($"/taxbaik/admin/companies/{cell.Item.Id}/edit")">수정</MudButton>
-            </CellTemplate>
-        </TemplateColumn>
-    </Columns>
-</MudDataGrid>
+<div class="admin-surface">
+    @if (isLoading)
+    {
+        <Skeleton Count="6" CssClass="taxbaik-skeleton-grid" />
+    }
+    else
+    {
+        <div class="admin-table-wrap">
+            <table class="admin-table">
+                <thead>
+                    <tr>
+                        <th>회사코드</th>
+                        <th>회사명</th>
+                        <th>담당자</th>
+                        <th>전화</th>
+                        <th>이메일</th>
+                        <th>활성</th>
+                        <th>등록일</th>
+                        <th></th>
+                    </tr>
+                </thead>
+                <tbody>
+                    @foreach (var item in companies)
+                    {
+                        <tr>
+                            <td>@item.CompanyCode</td>
+                            <td>@item.CompanyName</td>
+                            <td>@(item.ContactPerson ?? "—")</td>
+                            <td>@(item.Phone ?? "—")</td>
+                            <td>@(item.Email ?? "—")</td>
+                            <td>@(item.IsActive ? "활성" : "비활성")</td>
+                            <td>@item.CreatedAt.ToString("yyyy-MM-dd")</td>
+                            <td><a class="site-button secondary" href="@($"/taxbaik/admin/companies/{item.Id}/edit")">수정</a></td>
+                        </tr>
+                    }
+                </tbody>
+            </table>
+        </div>
+    }
+</div>
 
-<MudStack Row="true" Justify="Justify.Center" Class="mt-4" Spacing="2">
-    <MudButton Variant="Variant.Outlined" Disabled="@(currentPage <= 1 || isLoading)" @onclick="PreviousPage">이전</MudButton>
-    <MudButton Variant="Variant.Outlined" Disabled="@(currentPage >= totalPages || isLoading)" @onclick="NextPage">다음</MudButton>
-</MudStack>
+<div class="admin-pagination">
+    <button type="button" class="site-button secondary" disabled="@(currentPage <= 1 || isLoading)" @onclick="PreviousPage">이전</button>
+    <button type="button" class="site-button secondary" disabled="@(currentPage >= totalPages || isLoading)" @onclick="NextPage">다음</button>
+</div>
 
 @code {
     private List<CompanyDto> companies = [];
@@ -100,7 +118,7 @@
         }
         catch (Exception ex)
         {
-            Snackbar.Add($"고객사 로드 실패: {ex.Message}", Severity.Error);
+            await JS.InvokeVoidAsync("alert", $"고객사 로드 실패: {ex.Message}");
         }
         finally
         {
@@ -131,4 +149,6 @@
         public bool IsActive { get; set; }
         public DateTime CreatedAt { get; set; }
     }
+
+    private string NavTo(string url) => url;
 }