$(function(){
  //============================
  //日期選擇器 start
  //============================
  //監聽選擇
  $(document).on("change", ".date-select-container .date-select", function(){
    let year = $(this).parents(".date-select-container").find(".date-select-year"),
        month = $(this).parents(".date-select-container").find(".date-select-month"),
        day = $(this).parents(".date-select-container").find(".date-select-day"),
        full = $(this).parents(".date-select-container").find(".date-select-full")
        dayOptions = `<option value="">請選擇</option>`
    if((year.val() && month.val() && !day.val()) || (year.val() && month.val() && day.val() && !$(this).hasClass("date-select-day"))){
      //有選年或月 且日為空 或是三個都有選但改變年/月時 填充/更新日的選項
      //new Date(parseInt(year.val())+1911, parseInt(month.val()), 0).getDate()用來算這個月有幾天
      // console.log( new Date(parseInt(year.val()), parseInt(month.val()), 0).getUTCFullYear());
      for(let i=0; i< new Date(parseInt(year.val()), parseInt(month.val()), 0).getDate(); i++){
        dayOptions += `<option value="${i + 1}">${i + 1}</option>`
      }
      day.html(dayOptions)
      full.val("")
    }else if((!year.val() || !month.val()) && day.val()){
      //有選日 但沒有年或月 清空日的選項
      day.html(dayOptions)
      full.val("")
    }else if(year.val() && month.val() && day.val()){
      //年月日都有填
      let dayVal = (day.val().length == 1)?'0' + day.val() : day.val()
      full.val(`${year.val()}-${month.val()}-${dayVal}`)
    }
  })
  //============================
  //日期選擇器 end
  //============================
});