10-6 建立商品類別管理

一、程式改造

1. 由於每支程式幾乎都會用 global、menu
2. 所以，將global、menu，宣告為 var
   然後在 doGet(e)與 doPost(e)，去取值，這樣其他函式就可以直接引用
3. 在最上層

   
   var global,menu;

    

4. 在doGet(e)與 doPost(e)

   
     // 取得全域變數
     global = get_global();  
     // menu子樣板
     menu = Sheet.render('menu', {global: global});

二、程式流程

1. 設定流程關鍵字(op) => prod_kind 
2. 決定工作表 => 商品類別
3. 按鈕(讓管理員或訪客執行)

   
                 <li><a class="dropdown-item" href="<?!= global['url'] ?>?op=prod_kind">商品類別管理</a></li>

    

4. 在安裝函式，建立 「商品類別」與其標題
   這個後面會將之改為函式

   
     //建立 商品類別 工作表
     Sheet.createSheet('商品類別');
     //建立 商品類別 標題
     Sheet.setCellData('商品類別', 1, 1, '商品類別');

    

5. 在程式碼建立路由 程式碼.gs => doGet(e)

   
       //路由 商品類別
       Route.path("prod_kind", prod_kind);//新增 => prod_kind(e);

    

6. 新增函式 prod_kind(e)，但我們希望將商品類別管理的程式碼集中，所以請建立 prog_prod_kind.gs

   
   /*=====================================
     商品類別 管理
   =====================================*/
   function prod_kind(e){
   
     // 商品類別 表單
     let content = Sheet.render('prod_kind', {global: global});
   
     
     // 主樣板
     return Sheet.render('index', {content: content, menu: menu}, global['網站標題']);
   }

    

7. 由於 商品類別表單，有調用 prod_kind.html，故我們必須建立 prod_kind.html
   在表單一樣會部署一個送出要執行的op，這裡設為 set_prod_kind
   這個表單請求的方法，是用 GET

   
   <h1 class='mt-3 text-center'>商品類別管理</h1>
   <form action="<?!= global['url'] ?>" id="myForm" class="" method="GET">
     <div class="row">                      
       <div class="col-sm-12 mb-3">
         <div class="form-group">
           <label>商品類別<span class="text-danger"> *</span></label>
           <input type="text" class="form-control" name="商品類別" id="商品類別" value="">
         </div>
       </div>
         
       <div class="col-sm-12 d-grid">
         <!-- 表單送出後，要執行的流程 -->
         <input type='hidden' name='op' value="set_prod_kind">
         <button id="submit" type="submit" class="btn btn-primary">送出</button>
       </div> 
     </div>
   </form>

    

8. 因為表單送出後，會執行「set_prod_kind」，所以我們在 doGet(e)裡面要增加一個路由

   
       //路由 寫入 商品類別
       Route.path("set_prod_kind", set_prod_kind);//新增 => set_prod_kind(e);

    

9. 有路由就必須，增加一個 函式 set_prod_kind(e)

   
   /*=====================================
     寫入商品類別
   =====================================*/
   function set_prod_kind(e){
   
     console.log(e.parameter);
   
     // message_show子樣板
     let content = Sheet.render('message_show', {global: global, title: '執行成功', message: '已寫入工作表', bg: 'bg-primary'});
   
     
     // 主樣板
     return Sheet.render('index', {content: content, menu: menu}, global['網站標題']);
   
   }

   
   
    
10.