Title1

Title2

Title3

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.