extract table and modal to editor_table

backstage/templates/editor_tables/table.html

@@ -0,0 +1,29 @@
+{% extends "layout.html" %}
+{% block main %}
+  <h1>{{ title }}</h1>
+  <table id="example" class="table table-striped table-bordered" cellspacing="0" width="60%">
+    <thead>
+      <tr>
+        <th>數量</th>
+        <th>標題</th>
+        <th>順序</th>
+        <th>顯示</th>
+        <th style="text-align:center;width:100px;">
+          <button type="button" class="btn btn-primary btn-sm m-1" data-toggle="modal" data-target="#createModal">新增</button>
+        </th>
+      </tr>
+    </thead>
+    {% block table_body %}{% endblock %}
+  </table>
+  <!-- Modal -->
+  <div class="modal fade" id="createModal" tabindex="-1" role="dialog" aria-labelledby="createModalLabel" aria-hidden="true">
+    <div class="modal-dialog" role="document">
+      <div class="modal-content">
+        <div class="modal-header">
+          <h5 class="modal-title" id="createModalLabel">Create new content</h5>
+        </div>
+        {% block modal_body %}{% endblock %}
+      </div>
+    </div>
+  </div>
+{% endblock main %}