modify blog page, make it extend from editor_table.table

backstage/templates/blogs.html

@@ -1,35 +1,37 @@
-{% extends "layout.html" %}
-{% block main %}
-<h1>{{ title }}</h1>
-<table id="example" class="table table-striped table-bordered" cellspacing="0" width="60%">
-  <thead>
+{% extends "editor_tables/table.html" %}
+{% block table_body %}
+{% for idx in range(0, length) %}
+  <tbody>
     <tr>
-      <th>數量</th>
-      <th>標題</th>
-      <th>順序</th>
-      <th>顯示</th>
-      <th style="text-align:center;width:100px;">新增 <button type="button" data-func="dt-add" class="btn btn-success btn-xs dt-add">
-          <span class="glyphicon glyphicon-plus" aria-hidden="true"></span>
-        </button></th>
+      <td>{{ idx }}</td>
+      <td>{{ blogs[idx].title }}</td>
+      <td>1</td>
+      <td>on</td>
+      <td>
+        <div>
+          <a class="btn btn-secondary btn-sm m-1" href="{{ url_for('editor.editor', url=blogs[idx].url) }}">編輯</a>
+          <form action="{{ url_for('editor.remove', url=blogs[idx].url) }}" method="POST">
+            <input class="btn btn-danger" type="submit" value="Delete">
+          </form>
+        </div>
+      </td>
     </tr>
-  </thead>
-  {% for idx in range(0, length) %}
-    <tbody>
-      <tr>
-        <td>{{ idx }}</td>
-        <td>{{ blogs[idx].title }}</td>
-        <td>1</td>
-        <td>on</td>
-        <td>
-          <div>
-            <a class="btn btn-secondary btn-sm m-1" href="{{ url_for('editor.editor', url=blogs[idx].url) }}">編輯</a>
-            <form action="{{ url_for('editor.remove', url=blogs[idx].url) }}" method="POST">
-              <input class="btn btn-danger" type="submit" value="Delete">
-            </form>
-          </div>
-        </td>
-      </tr>
-    </tbody>
-  {% endfor %}
-</table>
-{% endblock main %}
+  </tbody>
+{% endfor %}
+{% endblock table_body %}
+{% block modal_body %}
+  <form action="{{ url_for('blogs.create') }}" method="POST" enctype="multipart/form-data">
+    <div class="form-group">
+      {{ form.title.label(class="form-control-label") }}
+      {{ form.title(class="form-control form-control-lg") }}
+      {{ form.image.label(class="form-control-label") }}
+      {{ form.image(class="form-control form-control-lg") }}
+      {{ form.categories.label(class="form-control-label") }}
+      {{ form.categories(class="form-control form-control-lg") }}
+    </div>
+    <div class="modal-footer">
+      <button type="button" class="btn btn-secondary" data-dismiss="modal">Close</button>
+      <input class="btn btn-primary" type="submit" value="Create">
+    </div>
+  </form>
+{% endblock modal_body %}