10.4 공지/배너 등록 및 노출 설정 o

src/app/admin/banners/page.tsx

@@ -0,0 +1,43 @@
+"use client";
+import useSWR from "swr";
+import { useState } from "react";
+
+const fetcher = (url: string) => fetch(url).then((r) => r.json());
+
+export default function AdminBannersPage() {
+  const { data, mutate } = useSWR<{ banners: any[] }>("/api/admin/banners", fetcher);
+  const banners = data?.banners ?? [];
+  const [form, setForm] = useState({ title: "", imageUrl: "", linkUrl: "", active: true, sortOrder: 0 });
+  async function create() {
+    const r = await fetch("/api/admin/banners", { method: "POST", headers: { "content-type": "application/json" }, body: JSON.stringify(form) });
+    if (r.ok) { setForm({ title: "", imageUrl: "", linkUrl: "", active: true, sortOrder: 0 }); mutate(); }
+  }
+  return (
+    <div>
+      <h1>배너 관리</h1>
+      <div style={{ display: "flex", gap: 8, marginBottom: 12 }}>
+        <input placeholder="제목" value={form.title} onChange={(e) => setForm({ ...form, title: e.target.value })} />
+        <input placeholder="이미지 URL" value={form.imageUrl} onChange={(e) => setForm({ ...form, imageUrl: e.target.value })} />
+        <input placeholder="링크 URL(선택)" value={form.linkUrl} onChange={(e) => setForm({ ...form, linkUrl: e.target.value })} />
+        <label><input type="checkbox" checked={form.active} onChange={(e) => setForm({ ...form, active: e.target.checked })} /> 활성</label>
+        <input type="number" placeholder="정렬" value={form.sortOrder} onChange={(e) => setForm({ ...form, sortOrder: Number(e.target.value) })} style={{ width: 80 }} />
+        <button onClick={create}>추가</button>
+      </div>
+      <ul style={{ display: "flex", flexDirection: "column", gap: 8 }}>
+        {banners.map((b) => (
+          <li key={b.id} style={{ border: "1px solid #eee", borderRadius: 8, padding: 12, display: "flex", gap: 12, alignItems: "center" }}>
+            <img src={b.imageUrl} alt={b.title} style={{ width: 80, height: 48, objectFit: "cover", borderRadius: 6 }} />
+            <div style={{ flex: 1 }}>
+              <div><strong>{b.title}</strong> {b.linkUrl && <a style={{ marginLeft: 8 }} href={b.linkUrl}>링크</a>}</div>
+              <div style={{ fontSize: 12, opacity: 0.7 }}>정렬 {b.sortOrder} · {b.active ? "활성" : "비활성"}</div>
+            </div>
+            <button onClick={async () => { await fetch(`/api/admin/banners/${b.id}`, { method: "PATCH", headers: { "content-type": "application/json" }, body: JSON.stringify({ active: !b.active }) }); mutate(); }}>{b.active ? "비활성" : "활성"}</button>
+            <button onClick={async () => { await fetch(`/api/admin/banners/${b.id}`, { method: "DELETE" }); mutate(); }}>삭제</button>
+          </li>
+        ))}
+      </ul>
+    </div>
+  );
+}
+
+