var endpoint = "https://rms.rmto.ir/road-observation-problems/getlist";
var totalCounts = null;
var fromDate, toDate;

var map = null;
var staticMap = null;
var startAbrarMarker = null;
var isSetStartAbrarMarker = false;
var startAbrarMarker2 = null;
var isSetStartAbrarMarker2 = false;
var endAbrarMarker = null;
var isSetEndAbrarMarker = false;

var routeControlsPath = [];
var popupArraysPath = [];
var polylinePath = null;

let image1;
let image2;
let image3;
let image4;

var mapCenterLat = null;
var mapCenterLng = null;
var idkol;
$(document).ready(function () {
  fromDate = $("#datepickfrom").persianDatepicker({
    format: "YYYY/MM/DD",
    autoClose: true,
    onSelect: function (unix) {
      fromDate.touched = true;

      $('#datepickto').prop('disabled', '');

      if (
        fromDate.getState().selected.unixDate >=
        toDate.getState().selected.unixDate
      ) {
        toDate.setDate(fromDate.getState().selected.unixDate);
      }

      if (toDate && toDate.options && toDate.options.minDate != unix) {
        let cachedValue = toDate.getState().selected.unixDate;

        toDate.options = { minDate: unix };

        if (toDate.touched) {
          toDate.setDate(cachedValue);
        }
      }
    },
  });

  toDate = $("#datepickto").persianDatepicker({
    format: "YYYY/MM/DD",
    autoClose: true,
    onSelect: function (unix) {
      toDate.touched = true;

      /*if (fromDate && fromDate.options && fromDate.options.maxDate != unix) {

        let cachedValue = fromDate.getState().selected.unixDate;

        fromDate.options = { maxDate: unix };

        if (fromDate.touched) {

          fromDate.setDate(cachedValue);

        }

      }*/
    },
  });





  var table = $("#example").DataTable({
    dom: 'lBfrtip',
    //   "pagingType": "full_numbers",
    pagingType: "simple_numbers",
    language: {
      sEmptyTable: "هیچ داده‌ای در جدول وجود ندارد",
      sInfo: "نمایش _START_ تا _END_ از _TOTAL_ ردیف",
      sInfoEmpty: "نمایش 0 تا 0 از 0 ردیف",
      sInfoFiltered: "(فیلتر شده از _MAX_ ردیف)",
      sInfoPostFix: "",
      sInfoThousands: ",",
      sLengthMenu: "نمایش _MENU_ ردیف",
      sLoadingRecords: "در حال بارگزاری...",
      sProcessing: "در حال پردازش...",
      sSearch: "جستجو: ",
      sZeroRecords: "رکوردی با این مشخصات پیدا نشد",
      oPaginate: {
        sFirst: "برگه‌ی نخست",
        sLast: "برگه‌ی آخر",
        sNext: "بعدی",
        sPrevious: "قبلی",
      },
      oAria: {
        sSortAscending: ": فعال سازی نمایش به صورت صعودی",
        sSortDescending: ": فعال سازی نمایش به صورت نزولی",
      },
    },
    columnDefs: [
      {
        searchable: false,
        orderable: false,
        targets: 8,
      },
      { type: "pstring", targets: 1 },
      {
        orderable: false,
        className: 'select-checkbox',
        targets: 8
      }
    ],
    order: [[0, "desc"]],
    processing: true,
    ajax: {
      url: endpoint,
      type: "GET",
      dataSrc: function (json) {
        // totalCounts = json.data.count;
        console.log(json.data)
        return json.data;
      },
      error: function (xhr, error, code) {
        console.log(xhr);
        console.log(code);
      }
    },
    columns: [
      {
        orderable: false,
        className: "text-center",
        data: null,
        render: function (data, type, row) {
          return data.uid;
        }
      },
      {
        orderable: false,
        className: "text-center",
        data: "ProvinceName"
      },
      {
        orderable: false,
        className: "text-center",
        data: "TownName"
      },
      {
        orderable: false,
        className: "text-center",
        data: "Title"
      },
      {
        orderable: false,
        className: "text-center",
        data: "FeatureTypeTitle"
      },
      {
        orderable: false,
        className: "text-center",
        data: "Description"
      },
      {
        orderable: false,
        className: "text-center",
        data: null,
        render: function (data, type, row) {
          return `<div id="loacleLoc${data.id}"><p class="text-center" alignment="center">(${parseFloat(data.lng).toFixed(2)} , ${parseFloat(data.lat).toFixed(2)})</p><button type="button" class="btn btn-primary" onclick="showMapModalStatic(` + parseFloat(data.lat).toFixed(2) + "," + parseFloat(data.lng).toFixed(2) + `)">
           <i class="fa fa-globe" aria-hidden="true"></i>
         </button></div>`
        },
      },


      {
        orderable: false,
        className: "text-center",
        data: null,
        render: function (data, type, row) {
          return data.MobileForSendEventSms
        },
      },
      {
        orderable: false,
        className: "text-center dir-ltr-cls",
        data: null,
        render: function (data, type, row) {
          return data.StartTime_DateTime.substring(data.StartTime_DateTime.indexOf('-') + 1)
        },
      },
      {
        orderable: false,
        className: "text-center",
        data: null,
        render: function (data, type, row) {
          return data.StartTime_DateTime.substring(0, data.StartTime_DateTime.indexOf('-'))
        },
      },
      {
        orderable: false,
        className: "text-right",
        data: null,
        render: function (data, type, row) {
          if (data.rms_status == 1) {
            return `<input id="rButD${data.id}" type="radio" checked value="1" name="rBut${data.id}" class="radioCl" disabled>
            <label for="rButD${data.id}">انجام شد</label><br>
            <input id="rButU${data.id}" type="radio" value="0" name="rBut${data.id}" class="radioCl" disabled>
            <label for="rButU${data.id}">انجام نشد</label>
            `
          }
          else if (data.rms_status == 2) {
            return `<input id="rButD${data.id}" type="radio" value="1" name="rBut${data.id}" class="radioCl" disabled>
          <label for="rButD${data.id}">انجام شد</label><br>
          <input id="rButU${data.id}" type="radio" checked value="0" name="rBut${data.id}" class="radioCl" disabled>
            <label for="rButU${data.id}">انجام نشد</label>
          `;
          }
          else {
            return `<input id="rButD${data.id}" type="radio"  value="1" name="rBut${data.id}" class="radioCl">
          <label for="rButD${data.id}">انجام شد</label><br>
          <input id="rButU${data.id}" type="radio" value="0" name="rBut${data.id}" class="radioCl">
            <label for="rButU${data.id}">انجام نشد</label>`
          }
        },
      },
      {
        orderable: false,
        className: "location",
        className: "text-center",
        data: null,
        render: function (data, type, row) {

          if (data.rms_start_latlng == null) {
            return `<div id="parentButton${data.id}"><button type="button" disabled class="btn btn-secondary" onclick="showMapModal(` + data.id + ',' + parseFloat(data.lat).toFixed(2) + ',' + parseFloat(data.lng).toFixed(2) + `)">
            <i class="fa fa-globe" aria-hidden="true"></i>
          </button></div>`
          }
          else {
            console.log("kari br karet nadaram")
            console.log(parseFloat(data.rms_start_latlng[0]).toFixed(2))
            console.log(parseFloat(data.rms_start_latlng[1]).toFixed(2))
            return `<div id="parentButton${data.id}"><p class="text-center" alignment="center">(${parseFloat(data.rms_start_latlng[1]).toFixed(2)} , ${parseFloat(data.rms_start_latlng[0]).toFixed(2)})</p><button type="button" class="btn btn-primary" onclick="showMapModalStatic(` + parseFloat(data.rms_start_latlng[0]).toFixed(2) + ',' + parseFloat(data.rms_start_latlng[1]).toFixed(2) + `)">
            <i class="fa fa-globe" aria-hidden="true"></i>
          </button></div>`;
          }
        },
      },
      {
        orderable: false,
        className: "text-center",
        data: null,
        render: function (data, type, row) {

          let before1
          let before2


          let htmlElement

          data.files.forEach(element => {



            if (element.path.includes("before-1")) {
              let file0 = element.path.slice(7);
              before1 = `<div style="padding:5px;" id="uploadImageDivA${data.id}" title="برای بزرگنمایی کلیک کنید"><img style="margin:5px" src="https://rms.rmto.ir/storage/${file0}" onclick="showImageModal('` + file0 + `',true)" class="zoom"></div>`
            } else if (element.path.includes("before-2")) {
              let file1 = element.path.slice(7);
              before2 = `<div style="" id="uploadImageDivB${data.id}" title="برای بزرگنمایی کلیک کنید"><img style="margin:5px" src="https://rms.rmto.ir/storage/${file1}" onclick="showImageModal('` + file1 + `',true)" class="zoom"></div>`
            }

          });

          if (before1 == undefined) {
            htmlElement = `
            <div id="uploadImageDivA${data.id}"  title="برای بزرگنمایی کلیک کنید" style="position: relative;">
            <label class="fileBtn" for="uploadBeforeA${data.id}"><i class="fas fa-images btn  btn-sm row-upload-images" style="color:white;background-color:#276d6c;opacity: 0.6;cursor: not-allowed;"></i></label>
              <input type="file" disabled name="uploadBeforeA" id="uploadBeforeA${data.id}" style="display:none;" class="uploadButton">

              </div>
            `
          } else {
            htmlElement = before1
          }

          if (before2 == undefined) {
            htmlElement += `
            <div id="uploadImageDivB${data.id}"  title="برای بزرگنمایی کلیک کنید" style="position: relative;">
            <label class="fileBtn" for="uploadBeforeB${data.id}"><i class="fas fa-images btn  btn-sm row-upload-images" style="color:white;background-color:#276d6c;opacity: 0.6;cursor: not-allowed;"></i></label>
              <input type="file" disabled name="uploadBeforeB" id="uploadBeforeB${data.id}" style="display:none" class="uploadButton">
              </div>`
          } else {
            htmlElement += before2
          }




          return htmlElement;



        },
      },
      {
        orderable: false,
        className: "text-center",
        data: null,
        render: function (data, type, row) {


          let after1
          let afetr2


          let htmlElement

          data.files.forEach(element => {

            if (element.path.includes("after-1")) {
              let file0 = element.path.slice(7);
              after1 = `<div id="uploadImageDivC${data.id}" title="برای بزرگنمایی کلیک کنید"><img style="margin:5px" src="https://rms.rmto.ir/storage/${file0}" onclick="showImageModal('` + file0 + `',true)" class="zoom"></div>`
            } else if (element.path.includes("after-2")) {
              let file1 = element.path.slice(7);
              afetr2 = `<div style="display:inline-block;" id="uploadImageDivD${data.id}" title="برای بزرگنمایی کلیک کنید"><img style="margin:5px" src="https://rms.rmto.ir/storage/${file1}" onclick="showImageModal('` + file1 + `',true)" class="zoom"></div>`
            }

          });

          if (after1 == undefined) {
            htmlElement = `
            <div id="uploadImageDivC${data.id}"  title="برای بزرگنمایی کلیک کنید" style="position: relative;">
        <label class="fileBtn" for="uploadAfterrC${data.id}"><i class="fas fa-images btn  btn-sm row-upload-images" style="color:white;background-color:#276d6c;opacity: 0.6;cursor: not-allowed;"></i></label>
          <input type="file" disabled name="uploadAfterrC" id="uploadAfterrC${data.id}" style="display:none;" class="uploadButton">

          </div>`


          } else {
            htmlElement = after1
          }

          if (afetr2 == undefined) {
            htmlElement += `
            <div id="uploadImageDivD${data.id}"  title="برای بزرگنمایی کلیک کنید" style="position: relative;">
        <label class="fileBtn" for="uploadAfterrD${data.id}"><i class="fas fa-images btn  btn-sm row-upload-images" style="color:white;background-color:#276d6c;opacity: 0.6;cursor: not-allowed;"></i></label>
          <input type="file" disabled name="uploadAfterrD" id="uploadAfterrD${data.id}" style="display:none" class="uploadButton">
          </div>`
          } else {
            htmlElement += afetr2
          }
          return htmlElement;

        },
      },
      {
        // orderable: false,
        className: "text-center",
        data: null,
        render: function (data, type, row) {
          if (data.rms_last_activity == null) {
            return ""
          }
          return data.rms_last_activity.substring(data.rms_last_activity.indexOf('-') + 1);
        },
      },
      {
        // orderable: false,
        className: "text-center",
        data: null,
        render: function (data, type, row) {
          if (data.rms_last_activity == null) {
            return ""
          }
          return data.rms_last_activity.substring(0, data.rms_last_activity.indexOf('-'));
        },
      },
      {
        orderable: false,
        className: "text-center",
        data: null,
        render: function (data, type, row) {
          let disabled = ''

          if (data.rms_status > 0) {
            disabled = 'disabled'
          }
          if (data.rms_description == null) {
            return `<textarea id="desBox${data.id}" class="descripBox" name="" placeholder="توضیحات " rows=""  cols="35" maxlength="250" ` + disabled + `></textarea> `;
          }
          return `<textarea id="desBox${data.id}" class="descripBox" name="" placeholder="توضیحات " rows=""  cols="35" maxlength="250" ` + disabled + `>${data.rms_description}</textarea> `;
        },
      },
      {
        className: "text-center",
        orderable: false,
        className: "location",
        data: null,
        render: function (data, type, row) {

          return `
          <div  class="text-center">
            <button type="button" class="btn btn-info" onclick="window.open('/webapi/fast-reaction/` + data.id + `/preview/print')">
            پیش‌نمایش
            </button>
            <button type="button" class="btn btn-secondary" disabled id="submitBut${data.id}" onclick="saveFastReaction(` + data.id + `)">
              ثبت
            </button>
          </div>`

        },
      }
      // { data: "date" },
      // {
      //   data: null,
      //   render: function (data, type, row) {
      //     return '<button class="btn btn-info btn-sm">مشاهده/ویرایش</i></button> / <button class="btn btn-info btn-sm">حذف</i></button > ';
      //   },
      // },
    ],
    buttons: [
      {
        extend: 'excelHtml5',
        title: 'Excel',
        text: 'خروجی به اکسل',
        messageTop: 'تعداد فعالیت های ثبت شده اداره کل'
      }
    ],



    "initComplete": function (settings, json) {


    }




  });

  function readURL(input, div, button, id) {
    if (input.files && input.files[0]) {
      var reader = new FileReader();

      $("#" + div + id).append(`<img class="zoom"></img><div class="remove-image-container" onclick="removeImage('` + button + id + `')" >✕</div>`)


      reader.onload = function (e) {
        // $("#"+div).css("display", "block");
        // $("#"+div).children("img").css("background-color", "blue");
        $("#" + div + id).children("img").css("margin", "5px");
        $("#" + div + id).children("img").attr("src", e.target.result);
      };
      reader.readAsDataURL(input.files[0]);
    }
  }

  $("#example").on("change", "input.uploadButton", function (e) {

    var fileName = e.target.files[0].name;

    let originID = this.id.slice(13);


    if (this.id.slice(6, 7) == "B") {

      if (this.id.slice(12, 13) == "A") {



        // console.log("A");
        // console.log("uploadImageDivA" + this.id.slice(13));

        $("#uploadImageDivA" + originID).empty();
        readURL(this, "uploadImageDivA", "BeforeA", originID)
        image1 = e.target;
        // $("#uploadImageDivA" + originID).append(`<div class="remove-image-container" onclick="removeImage('BeforeA'+${originID})" >✕</div>
        // <img src="../dist/images/photoImage.svg" style="height: 30px;" />
        // `);
        // <p>${fileName}</p>
      } else {
        console.log("B");
        $("#uploadImageDivB" + originID).empty();
        readURL(this, "uploadImageDivB", "BeforeB", originID)
        image2 = e.target;
        // $("#uploadImageDivB" + originID).append(`<div class="remove-image-container" onclick="removeImage('BeforeB'+${originID})">✕</div>
        // <img src="../dist/images/photoImage.svg" style="height: 30px;" />`);
      }

      // <div class="popUpBox right50-image-2-container" style="width: 90%; height: 75px; cursor: pointer;" onclick="uploadInputImage(502)">
      //           <span style="font-size: 11px !important;font-family: IRANSans;"> عکس دوم </span>
      //           <img src="../dist/images/icons/add-image.svg" style="height: 20px; margin-top: 15px;" />
      //       </div>
      //       <div class="remove-image-container502" onclick="removeImage(502)" style="display: none;">✕</div>


    } else {

      if (this.id.slice(12, 13) == "C") {
        console.log("C");
        console.log("C");
        $("#uploadImageDivC" + originID).empty();
        readURL(this, "uploadImageDivC", "AfterrC", originID)
        image3 = e.target;
        // $("#uploadImageDivC" + originID).append(`<div class="remove-image-container" onclick="removeImage('AfterrC'+${originID})">✕</div>
        // <img src="../dist/images/photoImage.svg" style="height: 30px;" />`)
      } else {
        console.log("D");
        $("#uploadImageDivD" + originID).empty();
        readURL(this, "uploadImageDivD", "AfterrD", originID)
        image4 = e.target;
        // $("#uploadImageDivD" + originID).append(`<div class="remove-image-container" onclick="removeImage('AfterrD'+${originID})">✕</div>
        // <img src="../dist/images/photoImage.svg" style="height: 30px;" />`)
      }

    }


    if (
      $("#parentButton" + originID).children().length == 2
      && (
        $("#uploadImageDivA" + originID).children("img").length
        || $("#uploadImageDivB" + originID).children("img").length)
      && ($("#uploadImageDivC" + originID).children("img").length
        ||
        $("#uploadImageDivD" + originID).children("img").length)) {
      $("#submitBut" + originID).prop("disabled", "")
      $("#submitBut" + originID).removeClass("btn-secondary").addClass("btn-success")

    }
  });

  $("#example").on("change", "input.radioCl", function () {
    if (this.id.substr(4, 1) == "D") {

      $("#parentButton" + this.id.substr(5)).children("button").prop("disabled", "")
      $("#uploadBeforeA" + this.id.substr(5)).prop("disabled", "")
      $("#uploadBeforeB" + this.id.substr(5)).prop("disabled", "")
      $("#uploadAfterrC" + this.id.substr(5)).prop("disabled", "")
      $("#uploadAfterrD" + this.id.substr(5)).prop("disabled", "")

      $("#uploadBeforeA" + this.id.substr(5)).parent().children("label").children("i").css({ "cursor": "pointer", "opacity": "" })
      $("#uploadBeforeB" + this.id.substr(5)).parent().children("label").children("i").css({ "cursor": "pointer", "opacity": "" })
      $("#uploadAfterrC" + this.id.substr(5)).parent().children("label").children("i").css({ "cursor": "pointer", "opacity": "" })
      $("#uploadAfterrD" + this.id.substr(5)).parent().children("label").children("i").css({ "cursor": "pointer", "opacity": "" })




      if (
        $("#parentButton" + this.id.substr(5)).children().length == 2
        &&
        ($("#uploadImageDivA" + this.id.substr(5)).children("img").length
          || $("#uploadImageDivB" + this.id.substr(5)).children("img").length)
        && ($("#uploadImageDivC" + this.id.substr(5)).children("img").length
          ||
          $("#uploadImageDivD" + this.id.substr(5)).children("img").length)) {
        $("#submitBut" + this.id.substr(5)).prop("disabled", "")
        $("#submitBut" + this.id.substr(5)).removeClass("btn-secondary").addClass("btn-success")

      }




    } else {

      removeImage('BeforeA' + this.id.substr(5))
      removeImage('BeforeB' + this.id.substr(5))
      removeImage('AfterC' + this.id.substr(5))
      removeImage('AfterD' + this.id.substr(5))

      $("#parentButton" + this.id.substr(5)).children("button").prop("disabled", true)
      $("#uploadBeforeA" + this.id.substr(5)).prop("disabled", true)
      $("#uploadBeforeB" + this.id.substr(5)).prop("disabled", true)
      $("#uploadAfterrC" + this.id.substr(5)).prop("disabled", true)
      $("#uploadAfterrD" + this.id.substr(5)).prop("disabled", true)



      $("#uploadBeforeA" + this.id.substr(5)).parent().children("label").children("i").css({ "cursor": "not-allowed", "opacity": "0.6" })
      $("#uploadBeforeB" + this.id.substr(5)).parent().children("label").children("i").css({ "cursor": "not-allowed", "opacity": "0.6" })
      $("#uploadAfterrC" + this.id.substr(5)).parent().children("label").children("i").css({ "cursor": "not-allowed", "opacity": "0.6" })
      $("#uploadAfterrD" + this.id.substr(5)).parent().children("label").children("i").css({ "cursor": "not-allowed", "opacity": "0.6" })




      if (!$("#desBox" + this.id.substr(5)).val().length) {
        $("#submitBut" + this.id.substr(5)).prop("disabled", true)
        $("#submitBut" + this.id.substr(5)).addClass("btn-secondary").removeClass("btn-success")
      } else {
        $("#submitBut" + this.id.substr(5)).prop("disabled", "")
        $("#submitBut" + this.id.substr(5)).removeClass("btn-secondary").addClass("btn-success")
      }






    }

  });

  $("#example").on("keyup", "textarea.descripBox", function () {
    if ($("#rButU" + this.id.substr(6)).is(':checked')) {
      if ($('#desBox' + this.id.substr(6)).val().length) {
        $("#submitBut" + this.id.substr(6)).prop("disabled", "")
        $("#submitBut" + this.id.substr(6)).removeClass("btn-secondary").addClass("btn-success")
      } else {
        $("#submitBut" + this.id.substr(6)).prop("disabled", true)
        $("#submitBut" + this.id.substr(6)).addClass("btn-secondary").removeClass("btn-success")
      }
    }
  });









  $("#example").on("click", "tbody tr", function () {
    if ($(this).hasClass("selected")) {
      // console.log("selected")
      $(this).removeClass("selected");
    } else {
      // console.log("deselect")
      table.$("tr.selected").removeClass("selected");
      $(this).addClass("selected");
    }
  });



  // table
  //   .on("order.dt search.dt", function () {
  //     table
  //       .column(0, { search: "applied", order: "applied" })
  //       .nodes()
  //       .each(function (cell, i) {
  //         cell.innerHTML = i + 1;
  //       });
  //   })
  //   .draw();

  // $("#locationPicker").on("click" , function () {
  //   console.log("hi there mother");
  // })
});

function removeImage(id) {

  console.log("hhhhhhheeeeee")
  console.log(id)
  $("#uploadImageDiv" + id.substr(6)).empty()
  $("#uploadImageDiv" + id.substr(6)).append(`<label class="fileBtn" for="upload${id}"><i class="fas fa-images btn btn-sm row-upload-images" style="color:white;background-color:#276d6c;"></i></label>
  <input type="file"  id="upload${id}" style="display:none;" class="uploadButton">`)


  if (
    $("#parentButton" + id.substr(7)).children().length != 2
    ||
    (!$("#uploadImageDivA" + id.substr(7)).children("img").length
      && !$("#uploadImageDivB" + id.substr(7)).children("img").length)
    || (!$("#uploadImageDivC" + id.substr(7)).children("img").length
      &&
      !$("#uploadImageDivD" + id.substr(7)).children("img").length)) {
    $("#submitBut" + id.substr(7)).prop("disabled", true)
    $("#submitBut" + id.substr(7)).addClass("btn-secondary").removeClass("btn-success")

  }



  if (id.slice(6, 7) == "A") {
    image1 = undefined;
  } else if (id.slice(6, 7) == "B") {
    image2 = undefined;
  } else if (id.slice(6, 7) == "C") {
    image3 = undefined;
  } else {
    image4 = undefined;
  }

  // console.log(image1)
  // console.log(image2)
  // console.log(image3)
  // console.log(image4)



}



$('#example').on('click', 'input.locationPicker', function (e) {
  alert("hi")

})

$("#sort_date").on("click", function () {
  if ($("#datepickfrom").val() != " " && $("#datepickto").val() != " ") {
    // console.log($("#datepickfrom").val());
    // console.log($("#datepickto").val());
    // console.log(fromDate.getState().selected);
    // console.log(
    //   moment(
    //     fromDate.getState().selected.year +
    //       "/" +
    //       fromDate.getState().selected.month +
    //       "/" +
    //       fromDate.getState().selected.date,
    //     "jYYYY/jM/jD"
    //   ).format("YYYY-M-D")
    // );

    let startDate = moment(
      fromDate.getState().selected.year +
      "/" +
      fromDate.getState().selected.month +
      "/" +
      fromDate.getState().selected.date,
      "jYYYY/jM/jD"
    ).format("YYYY-MM-DD");
    let endDate = moment(
      toDate.getState().selected.year +
      "/" +
      toDate.getState().selected.month +
      "/" +
      toDate.getState().selected.date,
      "jYYYY/jM/jD"
    ).format("YYYY-MM-DD");

    // $("#example").DataTable().clear().draw();
    $("#example")
      .DataTable()
      .ajax.url(endpoint + "?end-date=" + endDate + "&start-date=" + startDate)
      .load();

    // $.ajax({
    //   url: endpoint + "?end-date=" + endDate + "&start-date=" + startDate,
    //   type: "GET",
    //   success: function (result) {
    //     console.log(result);
    //     // $("#example").DataTable().fnClearTable();
    //     // $("#example").DataTable().fnAddData(result);
    //   },
    // });
  }
});

function showMapModalStatic(lat, lng) {

  $("#exampleModalCenterStatic").modal("show");

  if (staticMap == null) {
    setTimeout(() => {
      createLeafletMapStatic()
      setNewView(lat, lng)
    }, 500);
  } else {
    setNewView(lat, lng)
  }




}
function showMapModal(id, lat, lng) {
  console.log("lat")
  console.log(lat)

  $('#submitMap').attr('project-id', id);
  $("#exampleModalCenter").modal("show");
  $('[data-mask]').inputmask();


  if (isSetStartAbrarMarker) {

    isSetStartAbrarMarker = false;
    $('#pin-marker-start').removeClass('pin-set');

  }

  $("#exampleModalCenter input[name=abrar-project-latlng-start]").val("");


  setTimeout(() => {
    if (map == null) {
      createLeafletMap(lat, lng)
    } else {
      map.setView(new L.LatLng(lat, lng), 9)
      startAbrarMarker.setLatLng([lat, lng])
    }
  }, 200);


}





function showImageModal(file, pish) {
  console.log(pish)
  url = "https://rms.rmto.ir/storage/" + file
  $("#ImageModalCenter").modal("show");
  $("#imageCenter").attr("src", url);
  if (pish) {
    $("#imageModalLongTitle").text("تصویر پیش از اقدام")
  }
  else {
    $("#imageModalLongTitle").text("تصویر پس از اقدام")
  }


}


$("#submitMap").on('click', function () {

  if (isSetStartAbrarMarker) {

    let id = $("#submitMap").attr('project-id');


    $("#parentButton" + id).empty();

    let htmlElement = `<p style="direction:ltr">(` + startAbrarMarker.getLatLng().lat.toFixed(2) + ` , ` + startAbrarMarker.getLatLng().lng.toFixed(2) + `)</p>
      <button type="button" class="btn btn-primary" onclick="showMapModal(` + id + `)">
      <i class="fa fa-globe" aria-hidden="true"></i>
  </button>`


    $("#parentButton" + id).append(htmlElement);
    //   $("#parentButton" + id).append(`<div id="parentButton${data.id}"><button type="button" class="btn btn-primary" onclick="showMapModal(` + data.id + `)">
    //   طول و عرض جغرافیایی
    // </button></div>`);

    if (
      $("#parentButton" + id).children().length == 2
      && (
        $("#uploadImageDivA" + id).children("img").length
        || $("#uploadImageDivB" + id).children("img").length)
      && ($("#uploadImageDivC" + id).children("img").length
        ||
        $("#uploadImageDivD" + id).children("img").length)) {
      $("#submitBut" + id).prop("disabled", "")
      $("#submitBut" + id).removeClass("btn-secondary").addClass("btn-success")

    }

    $("#exampleModalCenter").modal('toggle');
  } else {
    $('#pin-marker-start').removeClass('pin-move').addClass('pin-warn');
  }



});

function selectedFile(id) {
  // console.log(id);
}



var startAbrarDivIcon = L.divIcon({
  html: `
    <div id="pin-marker-start" class="pin-marker">
      <div class="map-pin-marker">
        <div class="pin-main-circle"></div>
        <div class="pin-white-circle"></div>
        <div class="pin-title-circle">
          <span class="title-circle-text">موقعیت</span>
        </div>
        <div class="pin-main-line"></div>
      </div>
      <div class="pin-main-shadow">
        <div class="shadow-dot">
        </div>
      </div>
    </div>
  `,
  iconSize: [55, 75],
  iconAnchor: [33, 64]
});

var endAbrarDivIcon = L.divIcon({
  html: `
    <div id="pin-marker-end" class="pin-marker">
      <div class="map-pin-marker">
        <div class="pin-main-circle"></div>
        <div class="pin-white-circle"></div>
        <div class="pin-title-circle">
          <span class="title-circle-text">Ł¾Ų§ŪŒŲ§Ł†</span>
        </div>
        <div class="pin-main-line"></div>
      </div>
      <div class="pin-main-shadow">
        <div class="shadow-dot">
        </div>
      </div>
    </div>
  `,
  iconSize: [55, 75],
  iconAnchor: [33, 64]
});

var projectEditId = null;
var projectEditData = [];
var abrarProjectSlider = null;

$('#abrar-list-card > .card-body .project-actions > button').on('click', function () {
  projectEditId = $(this).attr('data-id');

  $('#abrar-list-card > .card-header > .card-tools > button').click();
  $('#exampleModalCenter > .card-header > .card-title').text('ŁˆŪŒŲ±Ų§ŪŒŲ´ Ł¾Ų±ŁˆŚ˜Ł‡ Ų´Ł…Ų§Ų±Ł‡ ' + projectEditId);
  $('#exampleModalCenter').fadeIn(400, function () {
    getSpecificAbrarProject();
  });
});

$('#abrar-list-card > .card-header > .card-tools > button').on('click', function () {
  if ($('#abrar-list-card').hasClass('collapsed-card')) {
    projectEditId = null;

    if (!$('#exampleModalCenter').hasClass('collapsed-card')) {
      $('#exampleModalCenter > .card-header > .card-tools > button').click();
      $('#exampleModalCenter > .card-header > .card-title').text('');
      $('#exampleModalCenter').fadeOut();
      $('#exampleModalCenter .abrar-project-slider').hide();
      $('#exampleModalCenter .abrar-project-description').hide();
      $('#exampleModalCenter .abrar-project-date').hide();

      initialMarkerMapValue();
    }
  }
});

$('#exampleModalCenter > .card-footer > .btn.btn-danger').on('click', function () {
  $('#abrar-list-card > .card-header > .card-tools > button').click();
});

function getSpecificAbrarProject() {
  $.ajax({
    url: '/abrar-projects/' + projectEditId,
    type: 'GET',
    cache: false,
    contentType: false,
    processData: false,
    success: function (result) {
      //console.log(result);
      showSpecificAbrarProject(result.data);
      mapCenterLat = result.province.center_lat;
      mapCenterLng = result.province.center_long;
    },
    error: function (error) {
      //console.log(error);
    }
  });
}

function showSpecificAbrarProject(data) {
  $('[data-mask]').inputmask();

  $('#exampleModalCenter input[name=abrar-province-name]').val(data.province_name);
  $('#exampleModalCenter input[name=abrar-city-name]').val(data.city_name);
  $('#exampleModalCenter input[name=abrar-axis-name]').val(data.axis_name);
  $('#exampleModalCenter input[name=abrar-axis-length]').val(data.axis_length);

  for (let i = 0; i < 4; i++) {
    $('#exampleModalCenter #abrar-project-type-' + (i + 1)).prop('checked', false);
  }

  for (let i = 0; i < 9; i++) {
    $('#exampleModalCenter #abrar-project-status-' + (i + 1)).prop('checked', false);
  }

  if (data.project_type != null) {
    for (let i = 0; i < data.project_type.length; i++) {
      $('#exampleModalCenter #abrar-project-type-' + data.project_type[i]).prop('checked', true);
    }
  }

  abrarProjectSlider = $("#abrar-project-status-progress").slider({
    min: 0,
    max: 100,
    value: 0,
    ticks: [0, 100],
    ticks_snap_bounds: 1,
    formatter: function (value) {
      return value + 'ŁŖ';
    },
    tooltip: 'always',
    tooltip_position: 'bottom'
  });

  if (data.project_status != null) {
    $('#exampleModalCenter #abrar-project-status-' + data.project_status).prop('checked', true);

    if (([2, 5, 6]).includes(data.project_status)) {
      $('#exampleModalCenter .abrar-project-slider').show();
      abrarProjectSlider.slider('setValue', data.project_status_progress);
    }

    if (data.project_status == 6) {
      $('#exampleModalCenter .abrar-project-description').show();
      if (data.project_status_description != null) {
        $('#exampleModalCenter .abrar-project-description textarea').val(data.project_status_description);
      }
    }

    if (data.project_status == 9) {
      $('#exampleModalCenter .abrar-project-date').show();

      if (data.project_status_date != null) {
        $('#exampleModalCenter .abrar-project-date input[name=abrar-project-status-date]').attr('value', data.project_status_date);
      }
    }
  }

  $('#exampleModalCenter .abrar-project-date input[name=abrar-project-status-date]').persianDatepicker({
    format: 'YYYY/MM/DD',
    autoClose: true,
    initialValue: (data.project_status_date != null) ? true : false,
    initialValueType: 'persian'
  });

  if (data.project_start_latlng != null && data.project_end_latlng != null) {
    $('#exampleModalCenter input[name=abrar-project-latlng-start]').val(
      parseFloat(data.project_start_latlng[0]).toFixed(10) +
      parseFloat(data.project_start_latlng[1]).toFixed(10)
    )

    $('#exampleModalCenter input[name=abrar-project-latlng-end]').val(
      parseFloat(data.project_end_latlng[0]).toFixed(10) +
      parseFloat(data.project_end_latlng[1]).toFixed(10)
    )
  }

  setTimeout(() => {
    if ($('#exampleModalCenter').hasClass('collapsed-card')) {
      $('#exampleModalCenter > .card-header > .card-tools > button').click();
    }
  }, 100);

  setTimeout(() => {
    if (map == null) {
      createLeafletMap();
    }

    setTimeout(() => {
      checkStartMarkerValidation(false, true);
    }, 25);
    setTimeout(() => {
      checkEndMarkerValidation(false, true);
    }, 50);
  }, 200);
}

function createLeafletMapStatic() {
  let bounds = [
    [42.9130026312, 75.6166317076],
    [20.5782370061, 35.5092252948]
  ];

  staticMap = new L.map('abrar-map-static', {
    maxBounds: bounds,
    minZoom: 6
  }).setView([32.4279, 53.6880], 9);
  staticMap.dragging.disable();

  L.tileLayer('https://rmsmap.rmto.ir/141map/{z}/{x}/{y}.png', {}).addTo(staticMap);

  startAbrarMarker2 = new L.marker(L.latLng(staticMap.getCenter()), {
    icon: startAbrarDivIcon,
    draggable: false
  }).addTo(staticMap);


}

function setNewView(lat, lng) {
  staticMap.setView(new L.LatLng(lat, lng), 9)

  if (startAbrarMarker2 == null) {
    startAbrarMarker = new L.marker(L.latLng(staticMap.getCenter()), {
      icon: startAbrarDivIcon,
      draggable: false
    }).addTo(staticMap);
  } else {
    startAbrarMarker2.setLatLng([lat, lng])
  }
}

function createLeafletMap(lat, lng) {
  let bounds = [
    [42.9130026312, 75.6166317076],
    [20.5782370061, 35.5092252948]
  ];

  map = new L.map('abrar-map', {
    maxBounds: bounds,
    minZoom: 6
  }).setView([lat, lng], 9);

  L.tileLayer('https://rmsmap.rmto.ir/141map/{z}/{x}/{y}.png', {}).addTo(map);

  startAbrarMarker = new L.marker(L.latLng(map.getCenter()), {
    icon: startAbrarDivIcon,
    draggable: true
  }).addTo(map);

  // endAbrarMarker = new L.marker(L.latLng(map.getCenter()), {
  //   icon: endAbrarDivIcon,
  //   draggable: true
  // });

  map.on('move', function () {
    if (!isSetStartAbrarMarker) {
      startAbrarMarker.setLatLng(L.latLng(map.getCenter()));
      $('#pin-marker-start').removeClass('pin-set pin-warn').addClass('pin-move');
    }


  });

  map.on('moveend', function () {
    if (!isSetStartAbrarMarker) {
      startAbrarMarker.setLatLng(L.latLng(map.getCenter()));
      $('#pin-marker-start').removeClass('pin-move pin-set');
    }

    // if (isSetStartAbrarMarker) {
    //   endAbrarMarker.setLatLng(L.latLng(map.getCenter()));
    //   $('#pin-marker-end').removeClass('pin-move pin-set');
    // }
  });

  startAbrarMarker.on('click', function () {
    if (!isSetStartAbrarMarker) {
      startAbrarMarker.setLatLng(L.latLng(map.getCenter()));
      isSetStartAbrarMarker = true;

      $('#pin-marker-start').removeClass('pin-move pin-warn').addClass('pin-set');

      $('#exampleModalCenter input[name=abrar-project-latlng-start]').val(
        startAbrarMarker.getLatLng().lat.toFixed(10) +
        startAbrarMarker.getLatLng().lng.toFixed(10)
      );
      $('#exampleModalCenter input[name=abrar-project-latlng-start]').removeClass('is-invalid-input');



      // let markerLatLng = [
      //   startAbrarMarker.getLatLng().lat,
      //   startAbrarMarker.getLatLng().lng + 0.0008
      // ];

      // map.setView(markerLatLng);
      // endAbrarMarker.setLatLng(markerLatLng);
      // endAbrarMarker.addTo(map);
    }
  });

  // endAbrarMarker.on('click', function () {
  //   if (!isSetEndAbrarMarker) {
  //     endAbrarMarker.setLatLng(L.latLng(map.getCenter()));
  //     isSetEndAbrarMarker = true;

  //     $('#pin-marker-end').removeClass('pin-move').addClass('pin-set');

  //     $('#exampleModalCenter input[name=abrar-project-latlng-end]').val(
  //       endAbrarMarker.getLatLng().lat.toFixed(10) +
  //       endAbrarMarker.getLatLng().lng.toFixed(10)
  //     );
  //     $('#exampleModalCenter input[name=abrar-project-latlng-end]').removeClass('is-invalid-input');

  //     checkMarkersAndDrawPath();
  //   }
  // });

  startAbrarMarker.on('drag', function () {
    $('#pin-marker-start').addClass('pin-move');
    checkMarkersAndDrawPath();
  });

  // endAbrarMarker.on('drag', function () {
  //   $('#pin-marker-end').addClass('pin-move');
  //   checkMarkersAndDrawPath();
  // });

  startAbrarMarker.on('dragend', function () {
    $('#pin-marker-start').removeClass('pin-move');

    if ($('#pin-marker-start').hasClass('pin-set') || isSetStartAbrarMarker) {
      $('#exampleModalCenter input[name=abrar-project-latlng-start]').val(
        startAbrarMarker.getLatLng().lat.toFixed(10) +
        startAbrarMarker.getLatLng().lng.toFixed(10)
      );
      $('#exampleModalCenter input[name=abrar-project-latlng-start]').removeClass('is-invalid-input');
      $('#pin-marker-start').addClass('pin-set');
      checkMarkersAndDrawPath();
    } else {
      map.setView(startAbrarMarker.getLatLng());
    }
  });

  // endAbrarMarker.on('dragend', function () {
  //   $('#pin-marker-end').removeClass('pin-move');

  //   if ($('#pin-marker-end').hasClass('pin-set') || isSetEndAbrarMarker) {
  //     $('#exampleModalCenter input[name=abrar-project-latlng-end]').val(
  //       endAbrarMarker.getLatLng().lat.toFixed(10) +
  //       endAbrarMarker.getLatLng().lng.toFixed(10)
  //     );
  //     $('#exampleModalCenter input[name=abrar-project-latlng-end]').removeClass('is-invalid-input');
  //     $('#pin-marker-end').addClass('pin-set');
  //     checkMarkersAndDrawPath();
  //   } else {
  //     map.setView(endAbrarMarker.getLatLng());
  //   }
  // });
}

function initialMarkerMapValue() {
  endAbrarMarker.remove();
  isSetEndAbrarMarker = false;
  map.setView([32.4279, 53.6880], 9);
  startAbrarMarker.setLatLng(L.latLng(map.getCenter()));
  isSetStartAbrarMarker = false;

  removeStartToEndPath();

  $('#pin-marker-start').removeClass('pin-move pin-set');
  $('#pin-marker-end').removeClass('pin-move pin-set');

  $('#exampleModalCenter input[name=abrar-project-latlng-start]').val('');
  $('#exampleModalCenter input[name=abrar-project-latlng-end]').val('');
  $('#exampleModalCenter input[name=abrar-project-latlng-start]').removeClass('is-invalid-input');
  $('#exampleModalCenter input[name=abrar-project-latlng-end]').removeClass('is-invalid-input');
}

$('#exampleModalCenter input[name=abrar-project-status]').on('change', function () {
  let statusId = parseInt(($(this)[0].id).slice(-1));

  if ($(this).prop('checked')) {
    $('#exampleModalCenter .project-status-label').removeClass('is-invalid-text');

    if (([2, 5, 6]).includes(statusId)) {
      abrarProjectSlider.slider('setValue', 0);
      $('#exampleModalCenter .abrar-project-slider').fadeIn();
    } else {
      $('#exampleModalCenter .abrar-project-slider').fadeOut();
    }

    if (statusId == 6) {
      $('#exampleModalCenter .abrar-project-description textarea').val('');
      $('#exampleModalCenter .abrar-project-description').fadeIn();
      $('#exampleModalCenter .abrar-project-description textarea').removeClass('is-invalid-box');
    } else {
      $('#exampleModalCenter .abrar-project-description').fadeOut();
    }

    if (statusId == 9) {
      $('#exampleModalCenter .abrar-project-date').fadeIn();
      $('#exampleModalCenter input[name=abrar-project-status-date]').removeClass('is-invalid-box');
    } else {
      $('#exampleModalCenter .abrar-project-date').fadeOut();
    }
  }
});

$('#exampleModalCenter input[name=abrar-project-type]').on('change', function () {
  if ($(this).prop('checked')) {
    $('#exampleModalCenter .project-type-label').removeClass('is-invalid-text');
  }
});

$('#exampleModalCenter input[name=abrar-project-latlng-start]').on('keyup', function () {
  checkStartMarkerValidation();
});

// $('#exampleModalCenter input[name=abrar-project-latlng-end]').on('keyup', function () {
//   checkEndMarkerValidation();
// });

function checkStartMarkerValidation(forSaveData = false, pageOnLoad = false) {
  let reg = /^([0-9]){2}\.([0-9])+$/;
  let startLatLngVal = ($('#exampleModalCenter input[name=abrar-project-latlng-start]').val()).split(' - ');
  let startLatLng = startLatLngVal.map(function (e) {
    e = e.replace(/_/g, '');
    return parseFloat(e.slice(1, -1));
  });

  if (isNaN(startLatLng[0])) {
    if (!forSaveData) {
      $('#exampleModalCenter input[name=abrar-project-latlng-start]').removeClass('is-invalid-input');
    } else {
      $('#exampleModalCenter input[name=abrar-project-latlng-start]').addClass('is-invalid-input');
    }
    $('#pin-marker-start').removeClass('pin-move pin-set');
    $('#exampleModalCenter input[name=abrar-project-latlng-start]').val('');
    $('#exampleModalCenter input[name=abrar-project-latlng-start]').attr('placeholder', '(Ų´Ų±ŁˆŲ¹) => (Ų·ŁˆŁ„ Ų¬ŲŗŲ±Ų§ŁŪŒŲ§ŪŒŪŒ) - (Ų¹Ų±Ų¶ Ų¬ŲŗŲ±Ų§ŁŪŒŲ§ŪŒŪŒ)');
    return false;
  } else if (!startLatLng == 2 || !reg.test(startLatLng[0]) || !reg.test(startLatLng[1])) {
    $('#exampleModalCenter input[name=abrar-project-latlng-start]').addClass('is-invalid-input');
    $('#pin-marker-start').removeClass('pin-move pin-set');
    return false;
  } else {
    if (!forSaveData) {
      $('#exampleModalCenter input[name=abrar-project-latlng-start]').removeClass('is-invalid-input');

      startAbrarMarker.setLatLng(startLatLng);

      if (pageOnLoad) {
        setTimeout(() => {
          $('#pin-marker-start').removeClass('pin-move').addClass('pin-set');
          startAbrarMarker.setLatLng(startLatLng);
        }, 9);
      } else {
        $('#pin-marker-start').removeClass('pin-move').addClass('pin-set');
      }

      if (!isSetEndAbrarMarker) {
        let markerLatLng = [
          startAbrarMarker.getLatLng().lat,
          startAbrarMarker.getLatLng().lng + 0.0008
        ]

        map.setView(markerLatLng);
        // endAbrarMarker.setLatLng(markerLatLng);

        // if (!isSetStartAbrarMarker) {
        //   endAbrarMarker.addTo(map);
        // }
      }

      isSetStartAbrarMarker = true;
    } else {
      projectEditData['project-start-latlng'] = [
        startAbrarMarker.getLatLng().lat.toFixed(10),
        startAbrarMarker.getLatLng().lng.toFixed(10)
      ];
    }

    // checkMarkersAndDrawPath();

    return true;
  }
}

function checkEndMarkerValidation(forSaveData = false, pageOnLoad = false) {
  let reg = /^([0-9]){2}\.([0-9])+$/;
  let endLatLngVal = ($('#exampleModalCenter input[name=abrar-project-latlng-end]').val()).split(' - ');
  let endLatLng = endLatLngVal.map(function (e) {
    e = e.replace(/_/g, '');
    return parseFloat(e.slice(1, -1));
  });

  if (isNaN(endLatLng[0])) {
    if (!forSaveData) {
      $('#exampleModalCenter input[name=abrar-project-latlng-end]').removeClass('is-invalid-input');
    } else {
      $('#exampleModalCenter input[name=abrar-project-latlng-end]').addClass('is-invalid-input');
    }
    $('#pin-marker-end').removeClass('pin-move pin-set');
    $('#exampleModalCenter input[name=abrar-project-latlng-end]').val('');
    $('#exampleModalCenter input[name=abrar-project-latlng-end]').attr('placeholder', '(Ł¾Ų§ŪŒŲ§Ł†) => (Ų·ŁˆŁ„ Ų¬ŲŗŲ±Ų§ŁŪŒŲ§ŪŒŪŒ) - (Ų¹Ų±Ų¶ Ų¬ŲŗŲ±Ų§ŁŪŒŲ§ŪŒŪŒ)');
    return false;
  } else if (!endLatLng == 2 || !reg.test(endLatLng[0]) || !reg.test(endLatLng[1])) {
    $('#exampleModalCenter input[name=abrar-project-latlng-end]').addClass('is-invalid-input');
    $('#pin-marker-end').removeClass('pin-move pin-set');
    return false;
  } else {
    if (!forSaveData) {
      $('#exampleModalCenter input[name=abrar-project-latlng-end]').removeClass('is-invalid-input');

      endAbrarMarker.setLatLng(endLatLng);
      isSetEndAbrarMarker = true;

      if (pageOnLoad) {
        setTimeout(() => {
          $('#pin-marker-end').removeClass('pin-move').addClass('pin-set');
          endAbrarMarker.setLatLng(endLatLng);
        }, 10);
      } else {
        $('#pin-marker-end').removeClass('pin-move').addClass('pin-set');
      }
    } else {
      projectEditData['project-end-latlng'] = [
        endAbrarMarker.getLatLng().lat.toFixed(10),
        endAbrarMarker.getLatLng().lng.toFixed(10)
      ];
    }

    checkMarkersAndDrawPath();

    return true;
  }
}

function showLoaderScreen() {
  $('.starter-loader-container').css('display', 'flex').hide().fadeIn();
}

function hideLoaderScreen() {
  $('.starter-loader-container').fadeOut();
}

$('#exampleModalCenter > .card-footer > .btn.btn-success').on('click', function () {
  saveAbrarFormData();
});

function checkPersianWordValidation(str) {
  let reg = /^[\u0600-\u06FF\s\.]+$/;

  if (!reg.test(str)) {
    return false;
  }
  return true;
}

function checkDataValidation() {
  let isDataValid = true;

  if ($('#exampleModalCenter input[name=abrar-project-type]:checked').length === 0) {
    isDataValid = false;
    $('#exampleModalCenter .project-type-label').addClass('is-invalid-text');
  } else {
    let projectTypeChecked = $('#exampleModalCenter input[name=abrar-project-type]:checked');
    let projectType = [];

    for (let i = 0; i < projectTypeChecked.length; i++) {
      projectType[i] = parseInt((projectTypeChecked[i].id).slice(-1));
    }

    projectEditData['project-type'] = projectType;
  }

  if ($('#exampleModalCenter input[name=abrar-project-status]:checked').length === 0) {
    isDataValid = false;
    $('#exampleModalCenter .project-status-label').addClass('is-invalid-text');
  } else {
    let statusId = parseInt(($('#exampleModalCenter input[name=abrar-project-status]:checked')[0].id).slice(-1));
    projectEditData['project-status'] = statusId;

    if (([2, 5, 6]).includes(statusId)) {
      projectEditData['project-status-progress'] = abrarProjectSlider.slider('getValue');
    } else {
      projectEditData['project-status-progress'] = null;
    }

    if (statusId == 6) {
      if ($('#exampleModalCenter .abrar-project-description textarea').val() == '' || !checkPersianWordValidation($('#exampleModalCenter .abrar-project-description textarea').val())) {
        isDataValid = false;
        $('#exampleModalCenter .abrar-project-description textarea').addClass('is-invalid-box');
      } else {
        $('#exampleModalCenter .abrar-project-description textarea').removeClass('is-invalid-box');
        projectEditData['project-status-description'] = $('#exampleModalCenter .abrar-project-description textarea').val();
      }
    } else {
      projectEditData['project-status-description'] = null;
    }

    if (statusId == 9) {
      if ($('#exampleModalCenter input[name=abrar-project-status-date]').val() == '') {
        isDataValid = false;
        $('#exampleModalCenter input[name=abrar-project-status-date]').addClass('is-invalid-box');
      } else {
        let regDate = /^Ū±[Ū³-Ū´][Ū°|Ū¹][Ū°-Ū¹]\/[Ū°-Ū±][Ū°-Ū¹]\/[Ū°-Ū³][Ū°-Ū¹]$/;

        if (regDate.test($('#exampleModalCenter input[name=abrar-project-status-date]').val())) {
          $('#exampleModalCenter input[name=abrar-project-status-date]').removeClass('is-invalid-box');
          projectEditData['project-status-date'] = $('#exampleModalCenter input[name=abrar-project-status-date]').val();
        } else {
          isDataValid = false;
          $('#exampleModalCenter input[name=abrar-project-status-date]').addClass('is-invalid-box');
          projectEditData['project-status-date'] = null;
        }
      }
    } else {
      projectEditData['project-status-date'] = null;
    }
  }

  if (!checkStartMarkerValidation(true)) {
    isDataValid = false;
  }

  if (!checkEndMarkerValidation(true)) {
    isDataValid = false;
  }

  return isDataValid;
}



function saveFastReaction(id) {
  // if (checkDataValidation()) {


  formData = new FormData();

  // let fileIndex = 0

  formData.append('rms-status', $('#rButD' + (id)).prop('checked') ? "1" : $('#rButU' + (id)).prop('checked') ? "2" : "0");


  if ($('#rButD' + (id)).prop('checked')) {

    if ($("#parentButton" + id).children().length == 2) {
      formData.append('rms-start-latlng', [startAbrarMarker.getLatLng().lat, startAbrarMarker.getLatLng().lng])
      // formData.append('rms-start-latlng', $("#parentButton" + id).children("p").html().slice(1, $("#parentButton" + id).children("p").html().length - 1))
    }




    if (image1) {
      formData.append('image-before-1', image1.files[0]);
    }
    if (image2) {
      formData.append('image-before-2', image2.files[0]);
    }
    if (image3) {
      formData.append('image-after-1', image3.files[0]);
    }
    if (image4) {
      formData.append('image-after-2', image4.files[0]);
    }
    // if ($('#uploadBeforeB' + (id))[0].files.length > 0) {
    //   formData.append('image-before-2', $('#uploadBeforeB' + (id))[0].files[0]);
    //   // fileIndex++
    // }
    // if ($('#uploadAfterrC' + (id))[0].files.length > 0) {
    //   formData.append('image-after-1', $('#uploadAfterrC' + (id))[0].files[0]);
    // }
    // if ($('#uploadAfterrD' + (id))[0].files.length > 0) {
    //   formData.append('image-after-2', $('#uploadAfterrD' + (id))[0].files[0]);
    // }


  }



  if ($('#desBox' + id).val() != undefined) {
    formData.append('rms-description', $('#desBox' + id).val());
  }
  for (var value of formData.values()) {
    console.log(value);
  }
  Swal.fire({
    icon: "warning",
    title: "آیا مطمئن هستید؟",

    showCancelButton: true,
    confirmButtonColor: "#3085d6",
    cancelButtonColor: "#d33",
    confirmButtonText: "بله، تایید می‌شود",
    cancelButtonText: "منصرف شدم!",
    showLoaderOnConfirm: true,
    preConfirm: () => {
      showLoaderScreen()
      $.ajax({
        url: "https://rms.rmto.ir/road-observation-problems/" + id + "/edit",
        type: 'POST',
        data: formData,
        headers: {
          'X-CSRF-TOKEN': $('meta[name="csrf-token"]').attr('content')
        },
        cache: false,
        contentType: false,
        processData: false,
        success: function (result) {
          console.log("suc");
          ajaxcalltablefastReaction();
          setTimeout(() => {
            hideLoaderScreen();
            // window.open("/rmto?newAbrarProjectId=" + projectEditId, '_self');
          }, 200);
        },
        error: function (error) {
          console.log("uns");
          console.log("bere",error);
          Swal.fire({
            icon: "error",
            title: "خطا",
            text: "خطایی رخ داده است",
            confirmButtonText: "بستن",
          });
        },
      });
    },
  });

}

function ajaxcalltablefastReaction() {
  $.ajax({
    url: endpoint,
    type: "GET",
    success: function (result) {

      $("#example").dataTable().fnClearTable();
      $("#example").dataTable().fnAddData(result.data);
      hideLoaderScreen();
      Swal.fire({
        icon: "success",
        title: "با موفقیت بروزرسانی شد",
        confirmButtonText: "بستن",
      });

    },
  });
}

function drawStartToEndPath(pathType, source, dest) {
  if (routeControlsPath.length) {
    $(routeControlsPath).each(function (index, control) {
      map.removeControl(control);
      routeControlsPath.splice(routeControlsPath.indexOf(index), 1);
    });
  }
  if (polylinePath != null) {
    map.removeLayer(polylinePath);
  }
  switch (pathType) {
    case 'line': {
      polylinePath = L.polyline(
        [
          [source[0], source[1]], [dest[0], dest[1]]
        ],
        {
          color: '#0073e6',
          opacity: .6,
          weight: 5
        }
      ).addTo(map);
      break;
    }
    case 'axis': {
      $.get(`https://rmsmap.rmto.ir/route/v1/driving/${source[1]},${source[0]};${dest[1]},${dest[0]}?overview=false&alternatives=true&steps=true`,
        function (data) {
          routeControlsPath.push(
            L.Routing.control({
              waypoints: [
                L.latLng(parseFloat(source[0]), parseFloat(source[1])),
                L.latLng(parseFloat(dest[0]), parseFloat(dest[1]))
              ],
              fitSelectedRoutes: false,
              draggableWaypoints: true,
              createMarker: function () { return null; },
              lineOptions: {
                addWaypoints: false,
                styles: [{
                  color: '#0073e6',
                  opacity: .6,
                  weight: 5
                }]
              },
            }).on('routesfound', function (e) {
              for (let index = 0; index < popupArraysPath.length; index++) {
                if (popupArraysPath[index] !== null) {
                  map.removeLayer(popupArraysPath[index]);
                }
              }

              /*let popup = new L.Popup({
                'maxWidth': '300',
                'maxHeight': '150',
                'className': 'customRouteEstimate'
              });

              let popupLocation = new L.LatLng(e.routes[0].coordinates[parseInt(e.routes[0]
                .coordinates
                .length /
                2)].lat,
                e.routes[0].coordinates[parseInt(e.routes[0].coordinates.length / 2)]
                  .lng);
              let popupContent = "<span style=\"color:#FF5630 ; font-size:11px\">Ł…Ų³Ų§ŁŲŖ : </span>" + parseFloat(e.routes[0].summary.totalDistance / 1000.0).toFixed(2) + " Ś©ŪŒŁ„ŁˆŁ…ŲŖŲ±";
              popup.setLatLng(popupLocation);
              popup.setContent(popupContent);
              popupArraysPath.push(popup);
              map.addLayer(popup);*/

            }).addTo(map)
          );
        });

      $('.leaflet-control-container').css('display', 'none');
      $('.leaflet-routing-container-hide').css('display', 'none');
      break;
    }
  }
}


function checkMarkersAndDrawPath() {
  if (($('#pin-marker-start').hasClass('pin-set') && !$('#pin-marker-start').hasClass('pin-move'))
    && ($('#pin-marker-end').hasClass('pin-set') && !$('#pin-marker-end').hasClass('pin-move'))) {
    drawStartToEndPath(
      'line',
      [
        startAbrarMarker.getLatLng().lat,
        startAbrarMarker.getLatLng().lng
      ],
      [
        endAbrarMarker.getLatLng().lat,
        endAbrarMarker.getLatLng().lng
      ]
    );
  } else {
    setTimeout(() => {
      if (($('#pin-marker-start').hasClass('pin-set') && !$('#pin-marker-start').hasClass('pin-move'))
        && ($('#pin-marker-end').hasClass('pin-set') && !$('#pin-marker-end').hasClass('pin-move'))) {
        drawStartToEndPath(
          'line',
          [
            startAbrarMarker.getLatLng().lat,
            startAbrarMarker.getLatLng().lng
          ],
          [
            endAbrarMarker.getLatLng().lat,
            endAbrarMarker.getLatLng().lng
          ]
        );
      } else {
        if (routeControlsPath.length) {
          $(routeControlsPath).each(function (index, control) {
            map.removeControl(control);
            routeControlsPath.splice(routeControlsPath.indexOf(index), 1);
          });
        }
        if (polylinePath != null) {
          map.removeLayer(polylinePath);
        }
      }
    }, 20);
  }
}

function removeStartToEndPath() {
  if (routeControlsPath.length) {
    $(routeControlsPath).each(function (index, control) {
      map.removeControl(control);
      routeControlsPath.splice(routeControlsPath.indexOf(index), 1);
    });
  }
  if (polylinePath != null) {
    map.removeLayer(polylinePath);
  }
}