9-1 調整顯示所有投稿主題的界面

1. 顯示所有資料的動作是 index，會產生以下規則：
   1. 顯示所有投稿主題，存入的資料表是 submission，流程的 $op 值是 submission_index，呼叫的物件方法就是 Submission::index()，對應樣板則是 op_submission_index.tpl
   2. 顯示所有學生的投稿，存入的資料表是 submission_data，流程的 $op 值是 submission_data_index，呼叫的物件方法就是 Submission_data::index()，對應樣板則是 op_submission_data_index.tpl
2. 因此，要修改顯示所有投稿主題的畫面，就是去修改 op_submission_index.tpl 樣板檔， Submission::index() 會負責撈出所有資料以及 JS 或 CSS 給該樣板使用。
3. VSCode中，Ctrl+P，貼上檔名「op_submission_index」，可以快速開啟，不用找半天。
4. 顯示所有投稿主題畫面原本的基本架構：

   <{if $all_submission|default:false}>
       若是 $all_submission 有內容，則秀出表格內容
   
       若是對模組有管理權，看是不是要在這裡做些什麼
       <{if $smarty.session.submission_adm|default:false}>
       <{/if}>
   
       <div id="submission_save_msg"></div>
   
       顯示表格內容
       <table data-toggle="table" data-pagination="true" data-search="true" data-mobile-responsive="true" class="table table-sm table-striped table-hover">
       </table>
   
       <{if $smarty.session.submission_adm|default:false}>
           若是對模組有管理權，則顯示「新增資料」的按鈕
       <{/if}>
   
       分頁工具(非必要)
       <div class="bar"><{$bar|default:''}></div>
   
   <{else}>
       若是 $all_submission 沒有內容
       <div class="alert alert-warning text-center">
           <{if $smarty.session.submission_adm|default:false}>
               若是對模組有管理權，則顯示「新增資料」的按鈕
               <a href="<{$xoops_url}>/modules/submission/setup.php?op=submission_create" class="btn btn-info">
                   <i class="fa fa-plus"></i> <{$smarty.const._TAD_ADD}>
               </a>
           <{else}>
               否則就顯示無資料
               <h3><{$smarty.const._TAD_EMPTY}></h3>
           <{/if}>
       </div>
   <{/if}>
   

5. 一般來說，這個樣板需要改的地方並不多，這部份可以先刪掉。

   <{if $smarty.session.submission_adm|default:false}>
   
   <{/if}>
   
   <div id="submission_save_msg"></div>

   1. 上方是對模組有管理權的話，可以顯示某些特殊訊息。
   2. submission_save_msg則是用來顯示排序結果。我們不拉動排序，所以可以不用。
6. 接著就是用BootstrapTable來將所有資料列出，關於BootstrapTable使用可以參考這裡：

   <table data-toggle="table" data-pagination="true" data-search="true" data-mobile-responsive="true" class="table table-sm table-striped table-hover">
       <thead>
           <tr>
               <!--投稿主題-->
               <th data-field="title" data-sortable="true" class="nowrap c"><{$smarty.const._MD_SUBMISSION_TITLE}></th>
               <!--投稿起始日-->
               <th data-field="start" data-sortable="true" class="nowrap c"><{$smarty.const._MD_SUBMISSION_START}></th>
               <!--投稿截止日-->
               <th data-field="end" data-sortable="true" class="nowrap c"><{$smarty.const._MD_SUBMISSION_END}></th>
               <!--建立者-->
               <th data-field="uid" data-sortable="true" class="nowrap c"><{$smarty.const._MD_SUBMISSION_UID}></th>
               <!--建立時間-->
               <th data-field="create_time" data-sortable="true" class="nowrap c"><{$smarty.const._MD_SUBMISSION_CREATE_TIME}></th>
               <{if $smarty.session.submission_adm|default:false}>
                   <th><{$smarty.const._TAD_FUNCTION}></th>
               <{/if}>
           </tr>
       </thead>
       <{foreach from=$all_submission key=k item=data name=all_submission}>
           <tr>
           ...略...
           </tr>
       <{/foreach}>
   </table>

   1. <table> 的幾個屬性：
      1. data-toggle="table" 套用BootstrapTable功能
      2. data-pagination="true" 要顯示分頁
      3. data-search="true" 要顯示搜尋框
      4. data-mobile-responsive="true" 要讓表格有響應式功能
   2. <thead></thead> 一定要有，很重要
   3. <th> 的幾個屬性：
      1. data-field="xxx" 設定該欄位的名稱，瓶常用不到，進階功能才會用
      2. data-sortable="true" 設定該欄位可以排序
7. 接著修改新增按鈕的文字，暫時不用語系

   <{if $smarty.session.submission_adm|default:false}>
       <div class="text-right text-end my-3">
           <a href="<{$xoops_url}>/modules/submission/setup.php?op=submission_create" class="btn btn-info">
               <i class="fa fa-plus"></i> 建立投稿主題
           </a>
       </div>
   <{/if}>

8. 因為BootstrapTable本身就有分頁功能，因此，以下這個分頁工具標籤可以刪除

   <div class="bar"><{$bar|default:''}></div>

9. 列出所有資料畫面如下：