@extends('common.layout')
<link rel="stylesheet" type="text/css" href="{{asset('css/form.css') }}">
<link rel="stylesheet" type="text/css" href="{{asset('css/ckeditor.css') }}">
<script type="text/javascript" src="{{asset('js/ckeditor.js') }}"></script>
@section('content')
<style>
  .selectmr {margin-right:10px}
</style>
<div class="container">
  <section id="sec01" class="sec01">
    <div class="contWrap">
      <div class="wrContWrap">
        <div class="titleWrap">
          <h2 class="title txt23_700">콘텐츠 유형</h2>
        </div>

        <form id="frm" name="frm">
          <input type="hidden" name="seq" id="seq" />
          <div class="formArea">
            <p class="txt18_600">콘텐츠 작성 가이드 기본 정보</p>
            <div class="inputBox"></div>
            <div class="inputBox">
              <label for="FeedCategoryName" class="inputBoxTitle txt14_600 required">콘텐츠 유형</label>
              <input id="FeedCategoryName" name="FeedCategoryName" type="text" placeholder="유형을 15자리 이내로 입력해주세요" maxlength="15">
            </div>
            <div class="inputBox">
              <label for="FeedCategoryOrd" class="inputBoxTitle txt14_600 required">정렬순서</label>
              <input id="FeedCategoryOrd" name="FeedCategoryOrd" type="text" placeholder="숫자로 최대 3자리이내로 입력해주세요" maxlength="3">
            </div>
          </div>
          <div class="formArea">
            <p class="txt18_600">콘텐츠 작성 가이드 설명</p>
            <div class="inputBox"></div>
            <div class="inputList">
                <div class="inputItem">
                  <div class="selectBox useSelectBox selectmr">
                    <input type="hidden" name="WriteGuideID" class="arSeqGuide"/>
                    <select name="WriteContentsType" class="arSelGuide">
                      <option value="1">기본설명</option>
                      <option value="2">대분류</option>
                      <option value="3">소분류</option>
                      <!--
                      <option value="4">하위설명</option>
                      <option value="5">하위예시</option>
                      <option value="6">하위예시2</option>
                      -->
                    </select>
                  </div>
                  <input  name="WriteGuideText" class="arTxtGuide" type="text" placeholder="입력해주세요" maxlength="100">
                  <button class="plusBtn recommendBtn exagood" type="button" onclick="btnPlusRecommend(this,false)"></button>
                </div>
            </div>
          </div>
        </form>

        <div class="btnBox" id="btnReg">
            <button type="button" class="btn01" style="margin-right:12px"  onclick="{history.back();}">취소</button>
            <button type="submit" id="saveBtn" class="btn01 btnBlue" onclick="saveBtn()">저장</button>
        </div>
        <div class="btnBox" id="btnEdit" style="display:none">
            <button id="backBtn" type="button" class="btn01" onclick="history.back()">목록으로</button>
            <button type="button" class="btn01" style="margin-right:12px"  onclick="btnDel()">삭제</button>
            <button type="submit" id="editBtn" class="btn01 btnBlue" onclick="saveBtn()">저장</button>
        </div>

      </div>
    </div>
  </section>
</div>
<div id="addGuide" style="display:none">
      <div class="selectBox useSelectBox selectmr">
        <input type="hidden" name="WriteGuideID" class="arSeqGuide"/>
        <select name="WriteContentsType"  class="arSelGuide">
          <option value="1">기본설명</option>
          <option value="2">대분류</option>
          <option value="3">소분류</option>
          <!--
          <option value="4">하위설명</option>
          <option value="5">하위예시</option>
          <option value="6">하위예시2</option>
          -->
        </select>
      </div>
      <input name="WriteGuideText" class="arTxtGuide" type="text" placeholder="입력해주세요">
      <button class="minusBtn" type="button" onClick="minusInput(this)"></button>
</div>
<script>
  var gSeq          = 0;
  clsUrlSearchParam.init(location.search);
  clsTmsClass.setSearchParam(clsUrlSearchParam);
  clsListClass.setSearchParamClass(clsUrlSearchParam);

    function btnPlusRecommend(obj , isBad){
      var divElement = document.createElement("div");
      divElement.className += " inputItem";
      divElement.innerHTML = document.querySelector("#addGuide").innerHTML;
      obj.parentNode.parentNode.appendChild(divElement);
    }
    // (-) 클릭
    function minusInput(_this){
       var parent = _this.parentNode;
       parent.parentNode.removeChild(parent);
    }


    function saveBtn(){

      var f = document.frm;
      if ( f.FeedCategoryName.value == ''){
          alert("콘텐츠 유형을 입력하세요.");
          f.FeedCategoryName.focus();
          return;
      }
      if ( f.FeedCategoryOrd.value == '' || (parseInt(f.FeedCategoryOrd.value,10) < 1 && parseInt(f.FeedCategoryOrd.value,10) > 999)){
          alert("정확한 정렬순서를 입력하세요.");
          f.FeedCategoryOrd.focus();
          return;
      }

      var isGuideCnt          = 0;
      var arWriteGuideSeq     = document.querySelectorAll(".arSeqGuide");
      var arWriteGuideSelect  = document.querySelectorAll(".arSelGuide");
      var arWriteGuideText    = document.querySelectorAll(".arTxtGuide");
      var arWriteGuideCate    = [];
      var arWriteGuideTextVal = [];
      var arWriteGuideID      = [];
      for(var i=0;i< arWriteGuideText.length;i++){
          if ( arWriteGuideText[i].value !=''){
            arWriteGuideID.push(parseInt(arWriteGuideSeq[i].value,10));
            arWriteGuideCate.push(arWriteGuideSelect[i].value);
            arWriteGuideTextVal.push(arWriteGuideText[i].value);
          }
      }

      if ( arWriteGuideTextVal.length < 1){
        alert("콘텐츠 작성 가이드 설명을 1개이상 입력하세요.");
        return;
      }

      var jsonParam = {"FeedCategoryName" : f.FeedCategoryName.value
                      , "FeedCategoryOrd" : f.FeedCategoryOrd.value
                      ,"WriteGuideCategory" : arWriteGuideCate
                      , "arWriteGuideText" : arWriteGuideTextVal
                      ,"arWriteGuideID" : arWriteGuideID
                      ,"editSeq" : gSeq};


      clsTmsClass.setDataInformation('/mda/api/rc/cw', "POST" ,jsonParam, function(data){
        var fetchData = JSON.parse(data);
        var outMsg    = gSeq > 0 ? "수정":"등록";
        if(fetchData.code == 100 && fetchData.msg === "SUCCESS") {
          alert(outMsg+'이 완료되었습니다.');
          location.href="lt"; // 목록으로 이동
        } else {
          alert("처리 중 오류가 발생 했습니다. 잠시후 이용하세요");
        }
      });
    }

    function setViewContent(data){
      var fetchData = JSON.parse(data);
        if(fetchData.code == 100 && fetchData.msg === "SUCCESS") {

          var f = document.frm;
          f.seq.value               = gSeq;
          f.FeedCategoryName.value  = fetchData.data.FeedCategoryName;
          f.FeedCategoryOrd.value   = fetchData.data.FeedCategoryOrd;

          if ( fetchData.data.list.length > 0){
            //첫 가이드는 기존폼에 입력
            var WriteContetType           = fetchData.data.list[0].WriteDepth;
            f.WriteGuideID.value          = fetchData.data.list[0].WriteGuideID;
            f.WriteContentsType.value     = (WriteContetType == 0) ? 1 : WriteContetType;
            f.WriteGuideText.value        = fetchData.data.list[0].WriteGuideText;
            var divElement                = null;
            var obj                       = document.querySelector(".inputList");
            for(var i=1; i < fetchData.data.list.length; i++){
                  divElement = document.createElement("div");
                  divElement.className += " inputItem";
                  divElement.innerHTML = document.querySelector("#addGuide").innerHTML;
                  obj.appendChild(divElement);
            }//end for

            var arWriteGuideSeq     = document.querySelectorAll(".arSeqGuide");
            var arWriteGuideSelect  = document.querySelectorAll(".arSelGuide");
            var arWriteGuideText    = document.querySelectorAll(".arTxtGuide");
            var rowItem             = null;
            for(var j = 1 ; j < arWriteGuideSelect.length-1; j++){
              rowItem                     = fetchData.data.list[j];
              arWriteGuideSeq[j].value    = rowItem.WriteGuideID;
              arWriteGuideSelect[j].value = rowItem.WriteDepth;
              arWriteGuideText[j].value   = rowItem.WriteGuideText;
            }
          }

        } else {
          alert("정보 조회 중 오류가 발생 했습니다. 잠시후 이용하세요");
        }
    }

    function btnDel(){
      if(!confirm("정말 삭제 하시겠습니까?"))return false;
      if (gSeq <1){
        alert("삭제할 정보가 정확하지 않습니다.");
        return;
      }
      clsTmsClass.setDataInformation('/mda/api/rc/cd', "POST" ,{"seq" : gSeq}, function(data){
        var fetchData = JSON.parse(data);
        if(fetchData.code == 100 && fetchData.msg === "SUCCESS") {
          alert('삭제가 완료되었습니다.');
          location.href="lt"; // 목록으로 이동
        } else {
          alert("삭제 중 오류가 발생 했습니다. 잠시후 이용하세요");
        }
      });
    }

    function setViewData(){
       var nSeq = clsUrlSearchParam.get('seq') !='' ? parseInt(clsUrlSearchParam.get('seq'), 10) : 0;
       if ( nSeq > 0){

          document.querySelector("#btnReg").style.display="none";
          document.querySelector("#btnEdit").style.display="flex";

          gSeq = nSeq;

          clsTmsClass.setDataInformation('/mda/api/rc/cv', "POST" ,{"seq" : nSeq}, setViewContent);
       }
    }

    window.onload=function(){
      setViewData();
    }
</script>
@endsection