Standardize blog admin pages
TaxBaik CI/CD / build-and-deploy (push) Failing after 2m58s

This commit is contained in:
2026-07-09 12:41:16 +09:00
parent 032056b4f9
commit 66a9990d5f
5 changed files with 134 additions and 151 deletions
+9 -66
View File
@@ -4,72 +4,15 @@
ViewData["Title"] = "블로그 등록";
}
<section class="container-fluid admin-page-shell admin-editor-root" data-blog-editor-root>
<div class="row g-3">
<div class="col-12">
<partial name="_AdminPageHeader" model='("콘텐츠", "블로그 등록", "에디터와 미리보기를 함께 제공하는 작성 화면입니다.", null, null)' />
</div>
<div class="col-lg-8">
<form method="post" class="card admin-page-card">
<div class="card-body">
<div asp-validation-summary="All" class="alert alert-danger"></div>
<input type="hidden" asp-for="Input.Content" data-blog-editor-value />
<div class="mb-3">
<label asp-for="Input.Title" class="form-label"></label>
<input asp-for="Input.Title" class="form-control" />
<span asp-validation-for="Input.Title" class="text-danger small"></span>
</div>
<div class="mb-3">
<label class="form-label">본문</label>
<div class="d-flex flex-wrap gap-2 admin-editor-toolbar">
<button type="button" class="btn btn-sm btn-outline-secondary" data-blog-command="bold">Bold</button>
<button type="button" class="btn btn-sm btn-outline-secondary" data-blog-command="italic">Italic</button>
<button type="button" class="btn btn-sm btn-outline-secondary" data-blog-command="insertUnorderedList">UL</button>
<button type="button" class="btn btn-sm btn-outline-secondary" data-blog-command="formatBlock" data-blog-value="h2">H2</button>
<button type="button" class="btn btn-sm btn-outline-secondary" data-blog-command="formatBlock" data-blog-value="blockquote">Quote</button>
</div>
<div class="form-control admin-editor-content" data-blog-editor contenteditable="true"></div>
<div class="form-hint text-muted small mt-2">HTML 태그는 그대로 저장되고 홈페이지에서 렌더링됩니다.</div>
</div>
<div class="row g-3">
<div class="col-md-4">
<label asp-for="Input.CategoryId" class="form-label"></label>
<input asp-for="Input.CategoryId" class="form-control" />
</div>
<div class="col-md-4">
<label asp-for="Input.IsPublished" class="form-label d-block"></label>
<input asp-for="Input.IsPublished" class="form-check-input" type="checkbox" />
</div>
<div class="col-md-4">
<label asp-for="Input.ThumbnailUrl" class="form-label"></label>
<input asp-for="Input.ThumbnailUrl" class="form-control" />
</div>
<div class="col-md-6">
<label asp-for="Input.SeoTitle" class="form-label"></label>
<input asp-for="Input.SeoTitle" class="form-control" />
</div>
<div class="col-md-6">
<label asp-for="Input.SeoDescription" class="form-label"></label>
<input asp-for="Input.SeoDescription" class="form-control" />
</div>
</div>
</div>
<div class="card-footer bg-white d-flex justify-content-between">
<a class="btn btn-outline-secondary" href="/admin/blog">취소</a>
<button class="btn btn-primary" type="submit">저장</button>
</div>
</form>
</div>
<div class="col-lg-4">
<div class="card admin-page-card h-100">
<div class="card-header"><h3 class="card-title">미리보기</h3></div>
<div class="card-body">
<article class="markdown-body admin-editor-preview" data-blog-preview></article>
</div>
</div>
</div>
</div>
</section>
<partial name="_BlogEditor" model="new TaxBaik.Web.Pages.Shared.BlogEditorModel(
Model.Input.Title,
Model.Input.Content,
Model.Input.CategoryId,
Model.Input.IsPublished,
Model.Input.ThumbnailUrl,
Model.Input.SeoTitle,
Model.Input.SeoDescription,
false)" />
@section Scripts {
<script src="~/js/admin-blog-editor.js" asp-append-version="true"></script>
+11 -68
View File
@@ -2,76 +2,19 @@
@model TaxBaik.Web.Pages.Admin.Blog.EditModel
@{
ViewData["Title"] = "블로그 수정";
ViewData["BlogEditorId"] = Model.Id;
}
<section class="container-fluid admin-page-shell admin-editor-root" data-blog-editor-root>
<div class="row g-3">
<div class="col-12">
<partial name="_AdminPageHeader" model='("콘텐츠", "블로그 수정", "기존 글을 불러와 즉시 편집하고 미리볼 수 있습니다.", null, null)' />
</div>
<div class="col-lg-8">
<form method="post" class="card admin-page-card">
<div class="card-body">
<div asp-validation-summary="All" class="alert alert-danger"></div>
<input type="hidden" asp-for="Id" />
<input type="hidden" asp-for="Input.Content" data-blog-editor-value />
<div class="mb-3">
<label asp-for="Input.Title" class="form-label"></label>
<input asp-for="Input.Title" class="form-control" />
</div>
<div class="mb-3">
<label class="form-label">본문</label>
<div class="d-flex flex-wrap gap-2 admin-editor-toolbar">
<button type="button" class="btn btn-sm btn-outline-secondary" data-blog-command="bold">Bold</button>
<button type="button" class="btn btn-sm btn-outline-secondary" data-blog-command="italic">Italic</button>
<button type="button" class="btn btn-sm btn-outline-secondary" data-blog-command="insertUnorderedList">UL</button>
<button type="button" class="btn btn-sm btn-outline-secondary" data-blog-command="formatBlock" data-blog-value="h2">H2</button>
<button type="button" class="btn btn-sm btn-outline-secondary" data-blog-command="formatBlock" data-blog-value="blockquote">Quote</button>
</div>
<div class="form-control admin-editor-content" data-blog-editor contenteditable="true">@Html.Raw(Model.Input.Content)</div>
</div>
<div class="row g-3">
<div class="col-md-4">
<label asp-for="Input.CategoryId" class="form-label"></label>
<input asp-for="Input.CategoryId" class="form-control" />
</div>
<div class="col-md-4">
<label asp-for="Input.IsPublished" class="form-label d-block"></label>
<input asp-for="Input.IsPublished" class="form-check-input" type="checkbox" />
</div>
<div class="col-md-4">
<label asp-for="Input.ThumbnailUrl" class="form-label"></label>
<input asp-for="Input.ThumbnailUrl" class="form-control" />
</div>
<div class="col-md-6">
<label asp-for="Input.SeoTitle" class="form-label"></label>
<input asp-for="Input.SeoTitle" class="form-control" />
</div>
<div class="col-md-6">
<label asp-for="Input.SeoDescription" class="form-label"></label>
<input asp-for="Input.SeoDescription" class="form-control" />
</div>
</div>
</div>
<div class="card-footer bg-white d-flex justify-content-between">
<button class="btn btn-outline-danger" type="submit" formaction="?handler=Delete" formmethod="post" onclick="return confirm('삭제하시겠습니까?');">삭제</button>
<div class="d-flex gap-2">
<a class="btn btn-outline-secondary" href="/admin/blog">취소</a>
<button class="btn btn-primary" type="submit">저장</button>
</div>
</div>
</form>
</div>
<div class="col-lg-4">
<div class="card admin-page-card h-100">
<div class="card-header"><h3 class="card-title">미리보기</h3></div>
<div class="card-body">
<article class="markdown-body admin-editor-preview" data-blog-preview>@Html.Raw(Model.Input.Content)</article>
</div>
</div>
</div>
</div>
</section>
<partial name="_BlogEditor" model='new TaxBaik.Web.Pages.Shared.BlogEditorModel(
Model.Input.Title,
Model.Input.Content,
Model.Input.CategoryId,
Model.Input.IsPublished,
Model.Input.ThumbnailUrl,
Model.Input.SeoTitle,
Model.Input.SeoDescription,
true,
"?handler=Delete")' />
@section Scripts {
<script src="~/js/admin-blog-editor.js" asp-append-version="true"></script>
+9 -17
View File
@@ -4,20 +4,10 @@
ViewData["Title"] = "블로그";
}
<section class="container-fluid py-4">
<div class="page-header d-print-none mb-4">
<div class="row align-items-center">
<div class="col">
<div class="page-pretitle">Content</div>
<h2 class="page-title">블로그 관리</h2>
</div>
<div class="col-auto ms-auto">
<a class="btn btn-primary" href="/admin/blog/create">새 글 작성</a>
</div>
</div>
</div>
<section class="container-xl admin-page-shell">
<partial name="_AdminPageHeader" model='("콘텐츠", "블로그 관리", "검색, 발행 상태, 작성일 기준의 블로그 목록입니다.", "/admin/blog/create", "새 글 작성")' />
<form method="get" class="card mb-3">
<form method="get" class="card admin-page-card mb-3">
<div class="card-body">
<div class="row g-3 align-items-end">
<div class="col-md-6">
@@ -33,10 +23,10 @@
</div>
</form>
<div class="card">
<div class="card admin-page-card">
<div class="table-responsive">
<table class="table table-vcenter card-table">
<thead>
<table class="table table-hover align-middle mb-0">
<thead class="table-light">
<tr>
<th>제목</th>
<th>발행</th>
@@ -48,7 +38,9 @@
<tbody>
@if (Model.Items.Count == 0)
{
<tr><td colspan="5"><partial name="_EmptyState" model="블로그 글이 없습니다." /></td></tr>
<tr>
<td colspan="5"><partial name="_EmptyState" model="블로그 글이 없습니다." /></td>
</tr>
}
else
{
@@ -0,0 +1,12 @@
namespace TaxBaik.Web.Pages.Shared;
public sealed record BlogEditorModel(
string Title,
string Content,
int? CategoryId,
bool IsPublished,
string? ThumbnailUrl,
string? SeoTitle,
string? SeoDescription,
bool IsEdit,
string? DeleteAction = null);
@@ -0,0 +1,93 @@
@model TaxBaik.Web.Pages.Shared.BlogEditorModel
<section class="container-xl admin-page-shell admin-editor-root" data-blog-editor-root>
<div class="row g-3">
<div class="col-12">
<div class="page-header d-print-none mb-4">
<div class="row align-items-center">
<div class="col">
<div class="page-pretitle">콘텐츠</div>
<h2 class="page-title">@(Model.IsEdit ? "블로그 수정" : "블로그 등록")</h2>
<p class="text-muted mb-0">@(Model.IsEdit ? "기존 글을 불러와 즉시 편집하고 미리볼 수 있습니다." : "에디터와 미리보기를 함께 제공하는 작성 화면입니다.")</p>
</div>
</div>
</div>
</div>
<div class="col-lg-8">
<form method="post" class="card admin-page-card">
<div class="card-body">
<div asp-validation-summary="All" class="alert alert-danger"></div>
@if (Model.IsEdit)
{
<input type="hidden" name="Id" value="@ViewData["BlogEditorId"]" />
}
<input type="hidden" name="Input.Content" value="@Model.Content" data-blog-editor-value />
<div class="mb-3">
<label class="form-label" for="Input_Title">제목</label>
<input class="form-control" id="Input_Title" name="Input.Title" value="@Model.Title" />
<span class="text-danger small" data-valmsg-for="Input.Title" data-valmsg-replace="true"></span>
</div>
<div class="mb-3">
<label class="form-label">본문</label>
<div class="d-flex flex-wrap gap-2 admin-editor-toolbar">
<button type="button" class="btn btn-sm btn-outline-secondary" data-blog-command="bold">Bold</button>
<button type="button" class="btn btn-sm btn-outline-secondary" data-blog-command="italic">Italic</button>
<button type="button" class="btn btn-sm btn-outline-secondary" data-blog-command="insertUnorderedList">UL</button>
<button type="button" class="btn btn-sm btn-outline-secondary" data-blog-command="formatBlock" data-blog-value="h2">H2</button>
<button type="button" class="btn btn-sm btn-outline-secondary" data-blog-command="formatBlock" data-blog-value="blockquote">Quote</button>
</div>
<div class="form-control admin-editor-content" data-blog-editor contenteditable="true">@Html.Raw(Model.Content)</div>
<div class="form-hint text-muted small mt-2">HTML 태그는 그대로 저장되고 홈페이지에서 렌더링됩니다.</div>
</div>
<div class="row g-3">
<div class="col-md-4">
<label class="form-label" for="Input_CategoryId">카테고리</label>
<input class="form-control" id="Input_CategoryId" name="Input.CategoryId" value="@Model.CategoryId" />
</div>
<div class="col-md-4">
<label class="form-label d-block" for="Input_IsPublished">발행 여부</label>
<input class="form-check-input" id="Input_IsPublished" name="Input.IsPublished" type="checkbox" value="true" @(Model.IsPublished ? "checked" : null) />
</div>
<div class="col-md-4">
<label class="form-label" for="Input_ThumbnailUrl">썸네일 URL</label>
<input class="form-control" id="Input_ThumbnailUrl" name="Input.ThumbnailUrl" value="@Model.ThumbnailUrl" />
</div>
<div class="col-md-6">
<label class="form-label" for="Input_SeoTitle">SEO 제목</label>
<input class="form-control" id="Input_SeoTitle" name="Input.SeoTitle" value="@Model.SeoTitle" />
</div>
<div class="col-md-6">
<label class="form-label" for="Input_SeoDescription">SEO 설명</label>
<input class="form-control" id="Input_SeoDescription" name="Input.SeoDescription" value="@Model.SeoDescription" />
</div>
</div>
</div>
<div class="card-footer bg-white d-flex justify-content-between">
@if (Model.IsEdit)
{
<button class="btn btn-outline-danger" type="submit" formaction="@Model.DeleteAction" formmethod="post" onclick="return confirm('삭제하시겠습니까?');">삭제</button>
}
else
{
<a class="btn btn-outline-secondary" href="/admin/blog">취소</a>
}
<div class="d-flex gap-2">
@if (Model.IsEdit)
{
<a class="btn btn-outline-secondary" href="/admin/blog">취소</a>
}
<button class="btn btn-primary" type="submit">저장</button>
</div>
</div>
</form>
</div>
<div class="col-lg-4">
<div class="card admin-page-card h-100">
<div class="card-header"><h3 class="card-title">미리보기</h3></div>
<div class="card-body">
<article class="markdown-body admin-editor-preview" data-blog-preview>@Html.Raw(Model.Content)</article>
</div>
</div>
</div>
</div>
</section>