From 2d8955144b8c8f9ab518a3cb04a7f362f0eb3239 Mon Sep 17 00:00:00 2001
From: "hehihoho3@gmail.com" <hehihoho3@gmail.com>
Date: Wed, 13 Aug 2025 16:16:32 +0900
Subject: [PATCH] =?UTF-8?q?feat:=20=EB=B8=94=EB=A1=9C=EA=B7=B8=20=ED=8F=AC?=
 =?UTF-8?q?=EC=8A=A4=ED=8C=85=20=EB=AA=A9=EB=A1=9D=20=ED=8E=98=EC=9D=B4?=
 =?UTF-8?q?=EC=A7=80=20=EB=82=A0=EC=A7=9C=20=ED=98=95=EC=8B=9D=20=EB=B3=80?=
 =?UTF-8?q?=EA=B2=BD?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 .../templates/itn/blog/posting/list.html      | 127 ++++++++++++++++++
 1 file changed, 127 insertions(+)
 create mode 100644 src/main/resources/templates/itn/blog/posting/list.html
diff --git a/src/main/resources/templates/itn/blog/posting/list.html b/src/main/resources/templates/itn/blog/posting/list.html
new file mode 100644
index 0000000..8925848
--- /dev/null
+++ b/src/main/resources/templates/itn/blog/posting/list.html
@@ -0,0 +1,127 @@
+<!DOCTYPE html>
+<html lang="en"
+      xmlns:th="http://www.thymeleaf.org"
+      xmlns:layout="http://www.ultraq.net.nz/thymeleaf/layout"
+      layout:decorate="~{layout}">
+<head>
+    <title layout:title-fragment="title">블로그 포스팅 계정 목록</title>
+</head>
+<body layout:fragment="body">
+
+<div class="wrapper">
+    <div th:replace="~{fragments/top_nav :: topFragment}"/>
+
+    <aside class="main-sidebar sidebar-dark-primary elevation-4"
+           th:insert="~{fragments/mainsidebar :: sidebarFragment}">
+    </aside>
+
+    <div class="content-wrapper">
+        <section class="content-header">
+            <div class="container-fluid">
+                <div class="row mb-2">
+                    <div class="col-sm-6">
+                        <h1>블로그 포스팅 계정 목록</h1>
+                    </div>
+                    <div class="col-sm-6">
+                        <ol class="breadcrumb float-sm-right">
+                            <li class="breadcrumb-item"><a href="#">Home</a></li>
+                            <li class="breadcrumb-item active">블로그 포스팅</li>
+                        </ol>
+                    </div>
+                </div>
+            </div>
+        </section>
+
+        <section class="content">
+            <div class="container-fluid">
+                <div class="row">
+                    <div class="col-12">
+                        <div class="card">
+                            <div class="card-header">
+                                <h3 class="card-title">계정 목록</h3>
+                            </div>
+                            <div class="card-body">
+                                <table id="blogAccountTable" class="table table-bordered table-hover">
+                                    <thead>
+                                    <tr>
+                                        <th>블로그 ID</th>
+                                        <th>플랫폼</th>
+                                        <th>블로그 이름</th>
+                                        <th>블로그 URL</th>
+                                        <th>등록일</th>
+                                        <th>수정일</th>
+                                        <th>액션</th>
+                                    </tr>
+                                    </thead>
+                                    <tbody>
+                                    </tbody>
+                                </table>
+                            </div>
+                        </div>
+                    </div>
+                </div>
+            </div>
+        </section>
+    </div>
+
+    <footer class="main-footer"
+            th:insert="~{fragments/footer :: footerFragment}">
+    </footer>
+
+    <aside class="control-sidebar control-sidebar-dark">
+    </aside>
+</div>
+
+<th:block layout:fragment="script">
+    <script src="/bower_components/moment/moment.js"></script>
+    <script>
+        $(document).ready(function() {
+            var table = $('#blogAccountTable').DataTable({
+                "paging": true,
+                "lengthChange": false,
+                "searching": true,
+                "ordering": true,
+                "info": true,
+                "autoWidth": false,
+                "responsive": true,
+                "ajax": {
+                    "url": "/api/blog/accounts/active", // 활성 블로그 계정 목록 API
+                    "dataSrc": ""
+                },
+                "columns": [
+                    {"data": "blog_id"},
+                    {"data": "platform"},
+                    {"data": "blog_name"},
+                    {"data": "blog_url"},
+                    {
+                        "data": "reg_date",
+                        "render": function (data, type, row) {
+                            return moment(data).format('YYYY-MM-DD HH:mm:ss');
+                        }
+                    },
+                    {
+                        "data": "mod_date",
+                        "render": function (data, type, row) {
+                            return moment(data).format('YYYY-MM-DD HH:mm:ss');
+                        }
+                    },
+                    {
+                        "data": null,
+                        "render": function (data, type, row) {
+                            return '<button class="btn btn-info btn-sm manage-button" data-id="' + row.blog_id + '">관리</button>';
+                        }
+                    }
+                ]
+            });
+
+            // 행 클릭 이벤트 (또는 관리 버튼 클릭 이벤트)
+            $('#blogAccountTable tbody').on('click', '.manage-button', function () {
+                const blogId = $(this).data('id');
+                location.href = '/blog/posting/manage/' + blogId; // 두 번째 페이지로 이동
+            });
+        });
+    </script>
+</th:block>
+
+</body>
+</html>
\ No newline at end of file
