var bustime = undefined;
layui.use("element", function () {
  let element = layui.element; //导航的hover效果、二级菜单等功能，需要依赖element模块
});
$(function () {
  getAppointmentDay();
  var swiper = new Swiper(".swiper-container", {
    slidesPerView: 5,
    spaceBetween: 0,
    slidesPerGroup: 1,
    observer: true,
    observeParents: true,
    // on: {
    //   click: function (swiper) {
    //     var index = swiper["clickedIndex"];
    //     //a(index);
    //   },
    // },
    loopFillGroupWithBlank: true,
    navigation: {
      nextEl: ".swiper-button-next",
      prevEl: ".swiper-button-prev",
    },
  });
  $(document).on("click", ".cancel", function () {
    layer.closeAll();
  });
  
});

//获取当前页面预约日期
function getAppointmentDay() {
  $.ajax({
    type: "get", //提交方式
    url: portal.api_url + "/portal/appointmentmh/getAppointmentDay", //路径
    data: {
      jgid: GetQueryString("jgid"),
    },
    dataType: "json",
    success: function (result) {
      //返回数据根据结果进行相应的处理
      if (result.code == 200 && result.data != null) {
        RenderbookingDateList(result.data);
        bookingDateClick(result.data.listTime[0].bookingDate);
      }
    },
  });
}


//渲染预约日期列表
function RenderbookingDateList(data) {
  let DateConnect = "";
  $.each(data.listTime, function (index, item) {
    DateConnect += '<ul id="' + item.bookingDate + '" class="swiper-slide" onclick="bookingDateClick(this.id)">';
    DateConnect += '<li>' + item.week + '</li><li>' + item.jyjh + '</li>';
    DateConnect += '</ul>';
  });
  $("#swiperDate").html(DateConnect);
}

//预约日期点击事件
function bookingDateClick(id) {
  $(".swiper-slide").removeClass("active3");
  $("#" + id).addClass("active3");
  getAppointmentPeriodAndBusiness(id);
}

// 根据办事大厅机构ID、日期、用户ID，获取对应日期的业务列表 GET
function getAppointmentPeriodAndBusiness(bookingDate) {
  $.ajax({
    type: "get", //提交方式
    url:
      portal.api_url + "/portal/appointmentmh/getAppointmentPeriodAndBusiness", //
    data: {
      jgid: GetQueryString("jgid"),
      userid: getItem('myCookie').userid,
      bookingDate: bookingDate,
    },
    dataType: "json",
    //数据，这里使用的是Json格式进行传输
    success: function (result) {
      //返回数据根据结果进行相应的处理
      if (result.code == 200 && result.data != null) {
        RenderBusinessList(result.data);
        if (result.data.appointmentPeriodBusinessList.length > 0) {
          hallname = result.data.appointmentPeriodBusinessList[0].orgBusinessList[0].jgName;
        }
      }
    },
  });
}

//渲染业务信息列表
function RenderBusinessList(data) {
  //获取业务列表DIV容器ID
  let businessDiv = $("#business_list");
  //是否存在预约记录（默认为否）
  let existRecord = false;
  if (data.choosePeriodRulesId != null && data.choosePeriodRulesId != "") {
    existRecord = true;
  }
  let businessContent = "";
  $.each(data.appointmentPeriodBusinessList, function (index, item) {
    businessContent += '<div class="business_item">';
    businessContent += '<div class="item_time">'
    if(getTime(item.startTime)){
      businessContent += '<h3 class="timeTitle">下午</h3>'
    }else {
      businessContent += '<h3 class="timeTitle">上午</h3>'
    }
    businessContent += '<span>' + item.startTime + '</span><span>-</span><span>' + item.endTime + '</span></div>';
    businessContent += '<ul>';
    $.each(item.orgBusinessList, function (childIndex, childItem) {
      //存在预约记录
      if (existRecord) {
        if (data.choosePeriodRulesId == childItem.periodRulesId) {
          businessContent += '<li class="isAppoint reserved" data-id="' + childItem.periodRulesId + '">';
          businessContent += '<h3>' + childItem.shortName + '</h3>';
          businessContent += '<p class="viewDetails" id="' + data.appointmentId + '" dataName="' + childItem.shortName + '"  onclick="getAppointmentDetail(this.id)">查看详情</p>';
        }
        else {
          businessContent += '<li class="isAppoint" style="background: #FCFCFC">';
          businessContent += '<h3>' + childItem.shortName + '</h3>';
        }
        businessContent += '<p style="color:#FF1313">(剩' + childItem.residueNumber + '票)</p></li>';
      } else {
        businessContent += '<li class="appointmentAvailable" data-id="' + childItem.periodRulesId + '" id="' + childItem.periodRulesId + '" periodRulesId="' + childItem.periodRulesId + '"  onclick="handle(this.id)">';
        businessContent += '<h3>' + childItem.shortName + '</h3>';
        if (childItem.residueNumber > 0) {
          businessContent += '<p class="appointmentNow">立即预约</p>';
        }
        businessContent += '<p style="color:#FF1313">(剩' + childItem.residueNumber + '票)</p></li>';
      }

    });
    businessContent += '</ul>';
    businessContent += '</div>';

  });
  businessDiv.html(businessContent);
}

function getTime(time){
  var isTime;
  if((time.split(":")[0]-0)>12) {
    isTime = true;
  }else {
    isTime = false;
  }
  return isTime;
}

// 根据办事大厅机构ID、用户ID检查用户是否存在预约限制
function checkAppointment() {
  let msg;
  $.ajax({
    type: "get", //提交方式
    async: false,
    url:
      portal.api_url + "/portal/appointmentmh/checkAppointment",
    data: {
      jgid: GetQueryString("jgid"),
      userid: getItem('myCookie').userid,
    },
    dataType: "json",
    //数据，这里使用的是Json格式进行传输
    success: function (result) {
      //返回数据根据结果进行相应的处理
      if (result.code == 210) {
        msg = result.message;
      }
    },
  });
  return msg;
}
function del(a){
  layui.use('layer',function(){
    var layer = layui.layer;  
    layer.msg(a); 
  })
}  
 
function handle(id) {
  let bookingDateUL = $(".active3");
  let msg = checkAppointment();
  if (msg != undefined) {
     del(msg)
     return false
  };
  var input = $("#" + id);
  layui.use("layer", function () {
    layer.open({
      type: 1,
      title: "请确认以下信息",
      shadeClose: false,
      area: ["500px", "320px"],
      scrollbar: false,
      skin: "confimInfo",
      content:
        '<div class="infoContent">' +
        "<ul>" +
        "<li><span>姓名</span>:" + getItem('myCookie').username + "</li>" +
        "<li><span>身份证号</span>：" + getItem('myCookie').zjhm + "</li>" +
        "<li><span>联系电话</span>：" + getItem('myCookie').phone + "</li>" +
        "</ul>" +
        '<div class="listItem"><h3>大厅名称：</h3>' +
        hallname +
        "</div>" +
        '<div class="listItem"><h3>预约业务：</h3>' +
        input.val() +
        "</div>" +
        '<div class="listItem"><h3>预约时间：</h3>' +
        bookingDateUL.children("li").get(1).innerHTML +
        "&nbsp;&nbsp;" +
        bookingDateUL.children("li").get(0).innerHTML +
        "</div>" +
        '<div class="confimButton"><button type="button" class="layui-btn cancel layui-btn-primary">取消</button><button type="button" class="layui-btn confim layui-btn-normal" onclick="makeAppointment(\'' + input.attr("periodRulesId") + '\')">确定</button></div>' +
        "</div>",
    });
  });
}

// 提交预约记录
function makeAppointment(id) {
  var paramsobj = {}
  paramsobj.jgid = GetQueryString("jgid");
  paramsobj.periodRulesId = id;
  paramsobj.userid = getItem('myCookie').userid;
  $.ajax({
    type: "post",  //提交方式  
    async: false,
    url: portal.api_url + "/portal/appointmentmh/makeAppointment",//路径  
    headers: {//***关键******
      'Content-Type': 'application/json;charset=UTF-8',
    },
    dataType: "json",
    data: JSON.stringify(paramsobj),//***关键******
    success: function (result) {//返回数据根据结果进行相应的处理
      if (result.code == 200 && result.data !== null) {
        appointmentId = result.data
        window.location.href = "./yyjg.html?appointmentId=" + appointmentId
      }else {
        del(result.message)
      }
    }
  });
}

// 根据预约信息标识码appointmentId查看预约详情接口数据
function getAppointmentDetail(id) {
  $.ajax({
    type: "get", //提交方式
    url:
      portal.api_url + "/portal/appointmentmh/getAppointmentDetail",
    data: {
      appointmentId: id,
    },
    dataType: "json",
    //数据，这里使用的是Json格式进行传输
    success: function (result) {
      //返回数据根据结果进行相应的处理
      if (result.code == 200) {
        appointmentDetail(result.data);
      }
      else {
        layer.msg(result.message, {icon: 6})
      }
    },
  });
}


//预约详情展示页面
function appointmentDetail(data) {
  layui.use("layer", function () {
    layer.open({
      type: 1,
      title: "预约详情信息",
      shadeClose: false,
      area: ["500px", "320px"],
      scrollbar: false,
      skin: "confimInfo",
      content:
        '<div class="infoContent">' +
        "<ul>" +
        "<li><span>姓名</span>:" + data.username + "</li>" +
        "<li><span>身份证号</span>：" + data.zjhm + "</li>" +
        "<li><span>联系电话</span>：" + data.phone + "</li>" +
        "</ul>" +
        '<div class="listItem"><h3>预约编号：</h3>' +
        data.reservationNumber +
        "</div>" +
        '<div class="listItem"><h3>预约业务：</h3>' +
        data.hbShortname +
        "</div>" +
        '<div class="listItem"><h3>预约时间：</h3>' +
        data.bookingDate.substr(0, 4) + '年' + data.bookingDate.substr(4, 2) + '月' + data.bookingDate.substr(6, 2) + '日' + data.startTime + '至' + data.endTime +
        "</div>" +
        '<div class="confimButton"><button type="button" class="layui-btn cancel layui-btn-primary" onclick="cancleAppointment(\'' + data.aid + '\',\'' + data.jgid + '\',\'' + data.periodRulesId + '\',\'' + data.userid + '\')">取消预约</button></div>' +
        "</div>",
    });
  });
}
// 用户取消预约
function cancleAppointment(aid, jgid, periodRulesId, userid) {

  $.ajax({
    type: "post",  //提交方式  
    url: portal.api_url + "/portal/appointmentmh/cancleAppointment",//路径  
    headers: {//***关键******
      'Content-Type': 'application/json;charset=UTF-8',
    },
    dataType: "json",
    data: JSON.stringify({
      "appointmentId": aid,
      "jgid": jgid,
      "periodRulesId": periodRulesId,
      "userid": userid
    }),//***关键******
    success: function (result) {//返回数据根据结果进行相应的处理
      if (result.code == 200) {
        bookingDateClick($(".active3").attr('id'));   
      }
    }
  });
}