notice 등록 기능 구현

butler/templates/butler/create_notice.html

@@ -0,0 +1,50 @@
+{% extends "components/base.html" %}
+{% block title %}Create Notice{% endblock %}
+
+{% block main_area %}
+  <h1 class="pt-3">Create New Notice</h1>
+  <div class="container">
+    <div class="row">
+      <div class="col-md-6">
+        <form method="POST" id="post-form">
+          {% csrf_token %}
+          <div class="mb-3">
+            {{ form.title.label_tag }}
+            {{ form.title }}
+          </div>
+
+          <!-- 마크다운 에디터 -->
+          <h2>contents</h2>
+
+          <div class="col-md-12">
+            {{ form.contents }}
+          </div>
+          <!-- 버튼 -->
+          <div class="d-flex justify-content-end mt-4">
+            <button type="submit" class="btn btn-primary me-2">Create Post</button>
+            <a href="{% url 'butler:notice_list' %}" class="btn btn-secondary">Cancel</a>
+          </div>
+        </form>
+      </div>
+      <div class="col-md-6">
+        <div id="preview" class="border p-3 bg-light h-100 overflow-auto"></div>
+      </div>
+    </div>
+
+    <!-- 마크다운 파서 및 스크립트 -->
+    <script src="https://cdn.jsdelivr.net/npm/markdown-it/dist/markdown-it.min.js"></script>
+    <script>
+      // 마크다운 파서 초기화
+      const md = window.markdownit();
+
+      // content 필드와 미리보기 연결
+      const textarea = document.getElementById("markdown-editor");
+      const preview = document.getElementById("preview");
+
+      // 실시간 미리보기 업데이트
+      textarea.addEventListener("input", function () {
+        const markdownContent = textarea.value; // textarea 내용 가져오기
+        preview.innerHTML = md.render(markdownContent); // 마크다운 -> HTML 변환
+      });
+    </script>
+  {% endblock %}

butler/templates/butler/notice_detail.html

@@ -15,5 +15,5 @@
     {{ notice.created_at|date:"Y-m-d H:i" }}</p>
   <p class="text-muted">수정일:
     {{ notice.updated_at|date:"Y-m-d H:i" }}</p>
-  <a href="{% url 'butler:notice' %}" class="btn btn-secondary mt-3">Back to Notices</a>
+  <a href="{% url 'butler:notice_list' %}" class="btn btn-secondary mt-3">Back to Notices</a>
 {% endblock %}

butler/templates/butler/notice_list.html

@@ -3,7 +3,10 @@
 {% block title %}Notice{% endblock %}
 
 {% block main_area %}
-  <h2 class="fw-bold pt-3 pb-2">공지사항</h2>
+  <h2 class="fw-bold pt-3 pb-2 d-flex justify-content-between">
+    공지사항
+    
+  </h2>
   <!-- 공지사항 목록 -->
 
   {% if records %}
@@ -32,4 +35,10 @@
   {% else %}
     <p class="text-muted">현재 공지사항이 없습니다.</p>
   {% endif %}
+  {% if request.user.is_authenticated %}
+  <!-- 버튼 컨테이너 -->
+  <div class="d-flex justify-content-between align-items-center mb-3">
+    <a href="{% url 'butler:create_notice' %}" class="btn btn-primary">Create Notice</a>
+  </div>
+  {% endif %}
 {% endblock %}