//Grid용 클래스. 블록 처리용
class Tb_class {
  constructor(){
    let _this = this;
    _this.tblList = "";
    _this.pt = "TURN";
    _this.st = "LF";
    _this.ajax_url = "./process.ajax.php";
    _this.fields = [];
  }

  //리스트 로드
  getMainList (pt, st) {
    let _this = this;

    let talert = window.setTimeout(function () { _this.tblList.alert("Loading ...") }, 1000); //1초 이상 지연되면 로딩 출력
    ajax_json({
      url: _this.ajax_url,
      data: { mode: 'getProcList', PROC_TYPE: _this.pt, SHAPE_TYPE: _this.st },
      success: function (data) {
        if (data.code) {
          _this.tblList.setData(data.data);
        }else{
          kuls_alert(data.mesg);
        }
      },
      error: function (request, status, error) {
        kuls_alert(error.message);
      },
      complete: function () {
        window.clearTimeout(talert);
        _this.tblList.clearAlert();
      }
    });
    return true;
  };

  setFilter (pt, st) {
    let _this = this;
    _this.pt = pt;
    _this.st = st;

    Tb_funcs.init();
  };

  //Row 추가
  addRow = () => {
    let _this = this;
    _this.tblList.addRow({_STATUS_:'I', PROC_TYPE: _this.pt, SHAPE_TYPE: _this.st});
  }

  //Cell 변경 콜백
  cellEdited (cell){
    let _this = this;
    cell.getData()._STATUS_ = cell.getData()._STATUS_||'U';
    cell.getData().PROC_TYPE = _this.pt;
    cell.getData().SHAPE_TYPE = _this.st;
  };

  //등록
  putProcList = () => {
    let _this = this;
    let postdata = {
      'mode': 'putProcList',
      'reqdata': JSON.stringify(_this.tblList.getData().filter(row=> row._STATUS_)),
    };
    console.log(_this.tblList.getData().filter(row=> row._STATUS_));
    ajax_json({
      url: _this.ajax_url,
      data: postdata,
      success: function (data) {
        if (data.code) {
          kuls_success("저장되었습니다.");
          _this.getMainList(_this.pt, _this.st);
        }else{
          kuls_alert(data.mesg);
        }
      },
      error: function (request, status, error) {
        kuls_alert(error.message);
      },
      complete: function () {
      }
    });
    return true;
  };

  delOrder = () => {
    let _this = this;

    _this.tblList.getSelectedRows().forEach(row => {
      row.update({_STATUS_:'D', PROC_TYPE: _this.pt, SHAPE_TYPE: _this.st});
      row.getElement().classList.add("del-row");
    });
  };

  //시작 실행
  init () {
    let _this = this;

    const fields_SPARE = [
      { field: "CHECK",formatter:"rowSelection", titleFormatter: "rowSelection", title: "No", width: "10%", },
      { field: "", title: "SIZE",
        columns:[
          { field:"START_SIZE", title:"최소", width:"15%", editor:"input", formatter: tb_common_funtions.formatterNumber, formatterParams: function() { return {'precision':3}; }, },
          { field:"END_SIZE", title:"최대", width:"15%", editor:"input", formatter: tb_common_funtions.formatterNumber, formatterParams: function() { return {'precision':3}; }, },
        ],
      },
      { field: "OUT_DIA", title: "외경", width: "15%", editor:'input', formatter: tb_common_funtions.formatterNumber, formatterParams: function() { return {'precision':3}; }, },
      { field: "IN_DIA", title: "내경", width: "15%", editor:'input', formatter: tb_common_funtions.formatterNumber, formatterParams: function() { return {'precision':3}; }, },
      { field: "THICK", title: "두께", width: "15%", editor:'input', formatter: tb_common_funtions.formatterNumber, formatterParams: function() { return {'precision':3}; }, },
      { field: "REMK", title: "비고", width: "15%", editor:'input', },
    ];

    const fields_TURN = [
      { field: "CHECK",formatter:"rowSelection", titleFormatter: "rowSelection", title: "No", width: "10%", },
      { field: "", title: "SIZE",
        columns:[
          { field:"START_SIZE", title:"최소", width:"12%", editor:"input", formatter: tb_common_funtions.formatterNumber, formatterParams: function() { return {'precision':3}; }, },
          { field:"END_SIZE", title:"최대", width:"12%", editor:"input", formatter: tb_common_funtions.formatterNumber, formatterParams: function() { return {'precision':3}; }, },
        ],
      },
      { field: "", title: "황삭",
        columns:[
          { field:"ROUGH_TURN", title:"회전수", width:"12%", editor:"input", formatter: tb_common_funtions.formatterNumber, formatterParams: function() { return {'precision':3}; }, },
          { field:"ROUGH_FEED", title:"FEED", width:"12%", editor:"input", formatter: tb_common_funtions.formatterNumber, formatterParams: function() { return {'precision':3}; }, },
        ],
      },
      { field: "", title: "정삭",
        columns:[
          { field:"FINISH_TURN", title:"회전수", width:"12%", editor:"input", formatter: tb_common_funtions.formatterNumber, formatterParams: function() { return {'precision':3}; }, },
          { field:"FINISH_FEED", title:"FEED", width:"12%", editor:"input", formatter: tb_common_funtions.formatterNumber, formatterParams: function() { return {'precision':3}; }, },
        ],
      },
      { field: "REMK", title: "비고", width: "18%", editor:'input', },
    ];

    const fields_HOLE = [
      { field: "CHECK",formatter:"rowSelection", titleFormatter: "rowSelection", title: "No", width: "10%", },
      { field: "", title: "SIZE",
        columns:[
          { field:"START_SIZE", title:"최소", width:"15%", editor:"input", formatter: tb_common_funtions.formatterNumber, formatterParams: function() { return {'precision':3}; }, },
          { field:"END_SIZE", title:"최대", width:"15%", editor:"input", formatter: tb_common_funtions.formatterNumber, formatterParams: function() { return {'precision':3}; }, },
        ],
      },
      { field: "HOLE_FEED", title: "FEED (이송)", width: "15%", editor:'input', formatter: tb_common_funtions.formatterNumber, formatterParams: function() { return {'precision':3}; }, },
      { field: "", title: "S (회전)",
        columns:[
          { field:"HOLE_TURN_ST", title:"최소", width:"15%", editor:"input", formatter: tb_common_funtions.formatterNumber, formatterParams: function() { return {'precision':3}; }, },
          { field:"HOLE_TURN_ED", title:"최대", width:"15%", editor:"input", formatter: tb_common_funtions.formatterNumber, formatterParams: function() { return {'precision':3}; }, },
        ],
      },
      { field: "REMK", title: "비고", width: "15%", editor:'input', },
    ];

    const fields_RATE = [
      { field: "CHECK",formatter:"rowSelection", titleFormatter: "rowSelection", title: "No", width: "10%", },
      { field: "", title: "SIZE",
        columns:[
          { field:"START_SIZE", title:"최소", width:"20%", editor:"input", formatter: tb_common_funtions.formatterNumber, formatterParams: function() { return {'precision':3}; }, },
          { field:"END_SIZE", title:"최대", width:"20%", editor:"input", formatter: tb_common_funtions.formatterNumber, formatterParams: function() { return {'precision':3}; }, },
        ],
      },
      { field: "TM_RATE", title: "시간당 임률", width: "20%", editor:'input', formatter: tb_common_funtions.formatterNumber, formatterParams: function() { return {'precision':3}; }, },
      { field: "REMK", title: "비고", width: "30%", editor:'input', },
    ];

    const fields_WTAMT = [
      { field: "CHECK",formatter:"rowSelection", titleFormatter: "rowSelection", title: "No", width: "10%", },
      { field: "", title: "SIZE",
        columns:[
          { field:"START_SIZE", title:"최소", width:"12%", editor:"input", formatter: tb_common_funtions.formatterNumber, formatterParams: function() { return {'precision':3}; }, },
          { field:"END_SIZE", title:"최대", width:"12%", editor:"input", formatter: tb_common_funtions.formatterNumber, formatterParams: function() { return {'precision':3}; }, },
        ],
      },
      { field: "", title: "단조 중량",
        columns:[
          { field:"START_WGT", title:"최소", width:"12%", editor:"input", formatter: tb_common_funtions.formatterNumber, formatterParams: function() { return {'precision':3}; }, },
          { field:"END_WGT", title:"최대", width:"12%", editor:"input", formatter: tb_common_funtions.formatterNumber, formatterParams: function() { return {'precision':3}; }, },
        ],
      },
      { field: "UNIT_PRICE", title: "단가", width: "12%", editor:'input', formatter: tb_common_funtions.formatterNumber, formatterParams: function() { return {'precision':3}; }, },
      { field: "UNIT_AMT", title: "금액", width: "12%", editor:'input', formatter: tb_common_funtions.formatterNumber, formatterParams: function() { return {'precision':3}; }, },
      { field: "REMK", title: "비고", width: "18%", editor:'input', },
    ];

    switch (_this.pt) {
      case "SPARE":
        _this.fields = fields_SPARE;
        break;
      case "TURN":
        _this.fields = fields_TURN;
        break;
      case "HOLE":
        _this.fields = fields_HOLE;
        break;
      case "RATE":
        _this.fields = fields_RATE;
        break;
      case "WTAMT":
        _this.fields = fields_WTAMT;
        break;
    }

    _this.tblList = new Tabulator("#tblProcList",{
      layout: "fitColumns",
      height: "100%",
      data: [], //기본 데이터
      columns: _this.fields, //컬럼 설정
      columnDefaults: { //컬럼 공통 규칙
        vertAlign: "middle",
        hozAlign: "center",
        resizable: "header",//Resize 는 헤더에서만 가능
        headerHozAlign: "center", //헤더 정렬
        headerSortTristate: true, //데이터 정렬 => 정/역/초기화
      },
      headerSortElement: "<i class='bi'></i>", //정렬 아이콘
    });

    _this.tblList.on("tableBuilt", () => { //Tabulator 초기 데이터 불러오기 이벤트
      _this.getMainList(_this.pt, _this.st);
    });
    _this.tblList.on("cellEdited", (cell) => { //Tabulator cell Edited
      _this.cellEdited && Tb_funcs.cellEdited(cell);
    });

    ['click','keypress'].forEach(evt => {
      document.getElementById("btnAddProc").removeEventListener(evt,_this.addRow);
      document.getElementById("btnAddProc").addEventListener(evt,_this.addRow);
    });

    ['click','keypress'].forEach(evt => {
      document.getElementById("btnDelProc").removeEventListener(evt,_this.delOrder);
      document.getElementById("btnDelProc").addEventListener(evt,_this.delOrder);
    });

    ['click','keypress'].forEach(evt => {
      document.getElementById("btnPutProc").removeEventListener(evt,_this.putProcList);
      document.getElementById("btnPutProc").addEventListener(evt,_this.putProcList);
    });
  };
}

document.querySelector("#S_SHAPE_GRP").addEventListener("change",(e)=>{
  let grp = varsSHAPE_GRP[e.target.value].children;
  document.querySelector("#S_SHAPE_TYPE").options.length = 0;
  Object.keys(grp).forEach(ckey => {
    let opt = document.createElement('option');
    opt.value = ckey;
    opt.text = grp[ckey];
    document.querySelector("#S_SHAPE_TYPE").append(opt);
  });

  document.querySelector("#S_SHAPE_TYPE").dispatchEvent(new Event("change"));
});

['change'].forEach(evt => document.querySelectorAll("#S_SHAPE_GRP").forEach(tgt=>tgt.addEventListener(evt,()=>{Tb_funcs.setFilter($("#S_PROC_TYPE").val(), $("#S_SHAPE_TYPE").val())})));
['change'].forEach(evt => document.querySelectorAll("#S_SHAPE_TYPE").forEach(tgt=>tgt.addEventListener(evt,()=>{Tb_funcs.setFilter($("#S_PROC_TYPE").val(), $("#S_SHAPE_TYPE").val())})));
['change'].forEach(evt => document.querySelectorAll("#S_PROC_TYPE").forEach(tgt=>tgt.addEventListener(evt,()=>{Tb_funcs.setFilter($("#S_PROC_TYPE").val(), $("#S_SHAPE_TYPE").val())})));

const Tb_funcs = new Tb_class();
Tb_funcs.init();