let ch_data;
let target_data;

function get_data(url) {
    return fetch(url) // fetch를 통해 데이터 가져오기
      .then(response => {
        if (!response.ok) {
          throw new Error('Network response was not ok');
        }
        return response.json(); // JSON 데이터를 JavaScript 객체로 변환하여 반환
      })
      .then(data => {
        return data; // 변환된 데이터를 반환
      })
      .catch(error => {
        console.error('Error:', error);
        throw error; // 에러 처리
      });
}

get_data('/ch').then(data => {
    ch_data = data
})

$(document).ready(function() {
  $( 'select.target' ).append('<option value="">채널을 선택해 주세요</option>')
  $( 'select.target' ).append('<option value="homeplus">홈플러스</option>')
  $( 'select.target' ).append('<option value="emart">이마트</option>')
  $( 'select.target' ).append('<option value="tr">트레이더스</option>')



  $("select.target").select2(
    {
      width: '100%',
      language: {
      noResults: function() {
        return "검색된 지점이 없습니다";
      }
    }}
  );
	$("select.code").select2(
   {
    width: '100%',
    language: {
      noResults: function() {
        return "검색된 지점이 없습니다";
      }
    }
   }
  );


  $('select.target').on('change', function() {
    document.querySelectorAll("select.code option").forEach(element => {
        element.remove()
    })

    el_option = document.querySelector('select.target')
    target_value = el_option.value
    if ( target_value == "" ) {
        document.querySelector("select.code").disabled = true;
        target_data = {"": "채널을 선택해주세요"}
    } else {
        document.querySelector("select.code").disabled = false;
        $( 'select.code' ).append('<option value="">지점을 선택해주세요</option>')
        target_data = ch_data[target_value]
        
    }

    for (value in target_data) {
        text = target_data[value]
        $( 'select.code' ).append('<option value="' +value+ '">'+text+'</option>')
    }
  });

  $('select.code').on('change', function() {
    el_code = document.querySelector('select.code')
    console.log(el_code.value)
    if ( el_code.value == "" ) {
      document.querySelector("button").disabled = true;
    } else {
      document.querySelector("button").disabled = false;
    }
  });
});	

window.onpopstate = function(event) {
  console.log('back')
  el_option = document.querySelector('select.target')
  el_option.value = ""
};