function callroomwiseinvigilatorsEntry() {
  console.log("anu");
  $("#page_main_div").load(
    "../html_modules/roomwiseinvigilatorsEntry.html?",
    function () {
      document.getElementById("display_module_name").innerHTML =
        "Roomwise-Invigilators";
      document.getElementById("module_name_for_save").value =
        "Roomwise-Invigilators";
      getDefaultHeadFooterLinks("Roomwise-Invigilators");
      loadDate();
    }
  );
}

function loadDate() {
  $.ajax({
    type: "GET",
    url: $host_url + "getDateForRemuneration",
    success: function (res) {
      let response = JSON.parse(res);
      console.log(response);
      if (response.error_code == 0) {
        console.log("hi");
        var opt = `<option value=''>---Select---</option>`;
        for (i = 0; i < response.data.length; i++) {
          opt += `<option value='${response.data[i].fdoe}'>${response.data[i].fdoe}</option>`;
        }
        document.getElementById("rdate").innerHTML = opt;
      }
    },
  });
}

function getdate() {
  $.blockUI({
    message:
      "<h1 class='h1' style='font-size:12px'><img src='img/ajax-loader.gif' border='0'></h1>",
  });
  var date = document.getElementById("rdate").value;
  $.ajax({
    type: "GET",
    url: $host_url + "getSessiontoDate",
    data: "rdate=" + date,
    success: function (res) {
      let response = JSON.parse(res);
      console.log(response);
      if (response.error_code == 0) {
        var opt = `<option value=''>---Select---</option>`;
        for (i = 0; i < response.data.length; i++) {
          let text = response.data[i].fsession;
          let position = text.search("M");
          let position2 = text.search("N");
          if (position != -1) {
            cnd = "Morning Session";
          } else if (position2 != -1) {
            cnd = "Afternoon Session";
          }

          if (response.data[i].fsession)
            opt += `<option value='${response.data[i].fsession}'>${cnd}</option>`;
        }
        document.getElementById("session").innerHTML = opt;
        $.unblockUI();
      }
    },
  });
}

var invigilators = [];

function changeSession() {
  // $.blockUI({
  //   message:
  //     "<h1 class='h1' style='font-size:12px'><img src='img/ajax-loader.gif' border='0'></h1>",
  // });
  var date = document.getElementById("rdate").value;
  var session = document.getElementById("session").value;
  document.getElementById("remunerationtable").hidden = false;
  invigilators = [];
  $.ajax({
    type: "GET",
    url: $host_url + "selectinvigilatorsroomwise",
    data: "rdate=" + date + "&session=" + session,
    success: function (res) {
      let response = JSON.parse(res);
      console.log(response, "apple");
      if (response.error_code == 0) {
        let table = `<table style='width: 100%; border-collapse: collapse;'>`;
        table += `<thead>
                    <tr>
                      <th colspan='4' style='font-size: 13px; height: 25px; text-align: left; border: 1px solid #C5DBEC;' class='ui-jqgrid-titlebar ui-widget-header ui-corner-tl ui-corner-tr ui-helper'>
                        Remuneration Entry
                      </th>
                    </tr>
                    <tr style='height: 25px; text-align: center; background-color: #f0f0f0;' class='ui-state-default ui-jqgrid-hdiv'>
                      <th style='font-size: 13px; width: 10%; border: 1px solid #C5DBEC;'>Sl.No</th>
                      <th style='font-size: 13px; width: 15%; border: 1px solid #C5DBEC;'>Room No</th>
                      <th style='font-size: 13px; width: 40%; border: 1px solid #C5DBEC;'>Room Name</th>
                      <th style='font-size: 13px; width: 35%; border: 1px solid #C5DBEC;'>Teachers</th>
                    </tr>
                  </thead>
                  <tbody>`;

        if (response.data.tabledata.length > 0) {
          console.log(response.data.tabledata, "kkk");
          for (index = 0; index < response.data.tabledata.length; index++) {
            invigilators.push(response.data.tabledata[index]);
            table += `<tr style='height: 24px; text-align: center;'>
                            <td style='font-size: 13px; border: 1px solid #C5DBEC;'>${
                              index + 1
                            }</td>
                            <td style='font-size: 13px; border: 1px solid #C5DBEC; '>${
                              response.data.tabledata[index].froomno
                            }</td>
                            <td style='font-size: 13px; border: 1px solid #C5DBEC; text-align:left;'>${
                              response.data.tabledata[index].froomname
                            }</td>
                            <td style='font-size: 13px; border: 1px solid #C5DBEC;'>
                              <select style='height: 30px; width: 300px; margin: 2px; font-size: 13px;' id='invi_teachname_${index}'>
          </select>
                            </td>
                          </tr>`;
          }
        } else {
          for (index = 0; index < response.data.room.length; index++) {
            invigilators.push(response.data.room[index]);
            table += `<tr style='height: 24px; text-align: center;'>
                          <td style='font-size: 13px; border: 1px solid #C5DBEC;'>${
                            index + 1
                          }</td>
                          <td style='font-size: 13px; border: 1px solid #C5DBEC; '>${
                            response.data.room[index].froomno
                          }</td>
                          <td style='font-size: 13px; border: 1px solid #C5DBEC;text-align:left;'>${
                            response.data.room[index].froomname
                          }</td>
                          <td style='font-size: 13px; border: 1px solid #C5DBEC;'>
                            <select style='height: 30px; width: 300px; margin: 2px; font-size: 13px;' id='invi_teachname_${index}'>
                              <option value=''>---Select---</option>`;
            for (
              let index = 0;
              index < response.data.roomname.length;
              index++
            ) {
              table += `<option value='${response.data.roomname[index].fteachcode}'>${response.data.roomname[index].fteachcode} - ${response.data.roomname[index].fteachname}</option>`;
            }

            table += `</select>
                          </td>
                        </tr>`;
          }
        }
        table += `</tbody></table>`;
        document.getElementById("remunerationtable").innerHTML = table;

        for (let index = 0; index < response.data.room.length; index++) {
          let option = `<option>--Select---</option>`;
          for (let j = 0; j < response.data.roomname.length; j++) {
            option += `<option value='${response.data.roomname[j].fteachcode}'>${response.data.roomname[j].fteachcode} - ${response.data.roomname[j].fteachname}</option>`;
          }
          $(`#invi_teachname_${index}`).html(option);
        }

        for (let index = 0; index < response.data.roomname.length; index++) {
          $(`#invi_teachname_${index}`).val(
            response.data.tabledata[index].ftechcode
          );
        }
        // $.unblockUI();
      }
    },
  });
}

function saveroomwiseinvigilatorsEntry() {
  $.blockUI({
    message:
      "<h1 class='h1' style='font-size:12px'><img src='img/ajax-loader.gif' border='0'></h1>",
  });
  var date = document.getElementById("rdate").value;
  var session = document.getElementById("session").value;

  for (let i = 0; i < invigilators.length; i++) {
    let selectElement = document.getElementById(`invi_teachname_${i}`).value;
    invigilators[i].selectedTeacher = selectElement;
  }

  let formdata = new FormData();
  formdata.append("rdate", date);
  formdata.append("session", session);
  formdata.append("data", JSON.stringify(invigilators));

  $.ajax({
    type: "POST",
    url: $host_url + "saveInvigilators",
    data: formdata,
    contentType: false,
    processData: false,
    cache: false,
    success: function (res) {
      let response = JSON.parse(res);
      if (response.error_code == 0) {
        alert(response.data.msg);
        document.getElementById("remunerationtable").hidden = true;
        $.unblockUI();
      } else {
        alert(response.data.msg);
      }
    },
  });
}

function viewroomwiseinvigilatorsEntry() {
  $.blockUI({
    message:
      "<h1 class='h1' style='font-size:12px'><img src='img/ajax-loader.gif' border='0'></h1>",
  });
  var date = document.getElementById("rdate").value;
  var session = document.getElementById("session").value;
  document.getElementById("remunerationtable").hidden = true;
  document.getElementById("remunerationid").hidden = true;
  document.getElementById("remunerationviewtable").hidden = false;
  $.ajax({
    type: "GET",
    url: $host_url + "invigilatorview",
    date: "&rdate=" + date + "&session=" + session,
    success: function (res) {
      let response = JSON.parse(res);
      if (response.error_code == 0) {
        let table = `<table style='width: 60%; border-collapse: collapse; margin-left:20%'>
           <tr>
                      <th colspan='4' style='font-size: 13px; height: 25px; text-align: left; border: 1px solid #C5DBEC;' class='ui-jqgrid-titlebar ui-widget-header ui-corner-tl ui-corner-tr ui-helper'>
                        Invigilators Recored Data
                      </th>
                    </tr>
        <tr style='height: 25px; text-align: center; background-color: #f0f0f0;' class='ui-state-default ui-jqgrid-hdiv'>
        <td style='font-size: 13px; width: 5%; border: 1px solid #C5DBEC;'>Sl.No</td>
        <td style='font-size: 13px; width: 5%; border: 1px solid #C5DBEC;'>Date</td>
        <td style='font-size: 13px; width: 5%; border: 1px solid #C5DBEC;'>Time</td>
        <td style='font-size: 13px; width: 5%; border: 1px solid #C5DBEC;'>Action</td></tr>`;
        for (let i = 0; i < response.data.length; i++) {
          let text = response.data[i].fsesstion;
          let position = text.search("M");
          let position2 = text.search("N");
          if (position != -1) {
            cnd = "Morning Session";
          } else if (position2 != -1) {
            cnd = "Afternoon Session";
          }
          table += `<tr style='height: 24px; text-align: center;'>
                    <td style='font-size: 13px; width: 5%; border: 1px solid #C5DBEC;'>${
                      i + 1
                    }</td>
                     <td style='font-size: 13px; width: 5%; border: 1px solid #C5DBEC;'>${
                       response.data[i].fdate
                     }</td>
                      <td style='font-size: 13px; width: 5%; border: 1px solid #C5DBEC;'>${cnd}</td>
                        <td style='font-size: 13px; width: 5%; border: 1px solid #C5DBEC;'> <span
            style="
              background-color: #008cba;
              border: none;
              border-radius: 4px;
              color: white;
              padding: 6px 18px;
              text-align: center;
              text-decoration: none;
              display: inline-block;
              cursor: pointer;
              font-size: 13px;
            "
            onclick="viewHandler('${response.data[i].fdate}','${
            response.data[i].fsesstion
          }')"
            >View</span
          ></td>`;
        }
        table += ` </table>`;
        document.getElementById("remunerationviewtable").innerHTML = table;
        $.unblockUI();
      }
    },
  });
}

function viewHandler(date, session) {
  // $.blockUI({
  //   message:
  //     "<h1 class='h1' style='font-size:12px'><img src='img/ajax-loader.gif' border='0'></h1>",
  // });
  document.getElementById("rdate").value = date;
  getdate();

  setTimeout(function () {
    document.getElementById("session").value = session;
  }, 1000);

  invigilators = [];
  $.ajax({
    type: "GET",
    url: $host_url + "selectinvigilatorsroomwise",
    data: "&rdate=" + date + "&session=" + session,
    success: function (res) {
      let response = JSON.parse(res);
      if (response.error_code == 0) {
        let table = `<table style='width: 100%; border-collapse: collapse;'>`;
        table += `<thead>
                    <tr>
                      <th colspan='4' style='font-size: 13px; height: 25px; text-align: left; border: 1px solid #C5DBEC;' class='ui-jqgrid-titlebar ui-widget-header ui-corner-tl ui-corner-tr ui-helper'>
                        Remuneration Entry
                      </th>
                    </tr>
                    <tr style='height: 25px; text-align: center; background-color: #f0f0f0;' class='ui-state-default ui-jqgrid-hdiv'>
                      <th style='font-size: 13px; width: 10%; border: 1px solid #C5DBEC;'>Sl.No</th>
                      <th style='font-size: 13px; width: 15%; border: 1px solid #C5DBEC;'>Room No</th>
                      <th style='font-size: 13px; width: 40%; border: 1px solid #C5DBEC;'>Room  Name</th>
                      <th style='font-size: 13px; width: 35%; border: 1px solid #C5DBEC;'>Teachers</th>
                    </tr>
                  </thead>
                  <tbody>`;

        for (index = 0; index < response.data.tabledata.length; index++) {
          invigilators.push(response.data.tabledata[index]);
          table += `<tr style='height: 24px; text-align: center;'>
                                    <td style='font-size: 13px; border: 1px solid #C5DBEC;'>${
                                      index + 1
                                    }</td>
                                    <td style='font-size: 13px; border: 1px solid #C5DBEC; '>${
                                      response.data.tabledata[index].froomno
                                    }</td>
                                    <td style='font-size: 13px; border: 1px solid #C5DBEC; text-align:left;'>${
                                      response.data.tabledata[index].froomname
                                    }</td>
                                    <td style='font-size: 13px; border: 1px solid #C5DBEC;'>
                                      <select style='height: 30px; width: 300px; margin: 2px; font-size: 13px;' id='invi_teachname_${index}'>
                  </select>
                                    </td>
                                  </tr>`;
        }
        table += `</tbody></table>`;
        document.getElementById("remunerationtable").innerHTML = table;

        for (let index = 0; index < response.data.room.length; index++) {
          let option = `<option>--Select---</option>`;
          for (let j = 0; j < response.data.roomname.length; j++) {
            option += `<option value='${response.data.roomname[j].fteachcode}'>${response.data.roomname[j].fteachcode} - ${response.data.roomname[j].fteachname}</option>`;
          }
          $(`#invi_teachname_${index}`).html(option);
        }

        for (let index = 0; index < response.data.tabledata.length; index++) {
          $(`#invi_teachname_${index}`).val(
            response.data.tabledata[index].ftechcode
          );
        }
        document.getElementById("remunerationid").hidden = false;
        document.getElementById("remunerationtable").hidden = false;
        document.getElementById("remunerationviewtable").hidden = true;
        document.getElementById("viewbutton").hidden = true;
        document.getElementById("rdate").disabled = true;
        document.getElementById("session").disabled = true;
        // $.unblockUI();
      }
    },
  });
}