var list_sub;
var sub_item_str;
var list_sub_itemId;
var toDateAxis, fromDateAxis;
var currentDate = [];
var excelParam = "";
//maps variable
var startAbrarMarker = null;
var isSetStartAbrarMarker = false;
var endAbrarMarker = null;
var isSetEndAbrarMarker = false;
var saveTotalDistance = null;
var sourceMarker;
var sourceLat = "";
var sourceLng = "";
var destMarker;
var destLat = "";
var destLng = "";
var routeControls = [];
var popupArrays = [];
var bounds = [
    [46.9130026312, 77.6166317076],
    [17.5782370061, 32.5092252948],
];
var destinationCoordinates = null;
var sourceCoordinates = null;
var roadPatrolProject = [];
var roadObserved = [];
var contractSubItems = [];
var roadItemsProject = [];
var AxisMarkerList = [];
var AxisMarkerLayer = null;
var startP = [35.6892, 51.389];
var endP = [35.6892, 51.389];
var operation_res;

(() => {
    const heightHeader = $('.header').height()

    document.getElementById('mymap').style.setProperty('height', `calc(100vh - ${heightHeader}px)`)
})()

function showLoaderScreen() {
    $(".divloader").css("display", "flex").hide().fadeIn();
}

function hideLoaderScreen() {
    $(".divloader").fadeOut();
}
var purpleIcon = L.divIcon({
    className: "custom-div-icon",
    html: "<span class='beacon beacon-purple'></span>",
    iconSize: [32, 44],
});
var pinkIcon = L.divIcon({
    className: "custom-div-icon",
    html: "<span class='beacon beacon-pink'></span>",
    iconSize: [32, 44],
});
var greenIcon = L.divIcon({
    className: "custom-div-icon",
    html: "<span class='beacon beacon-green'></span>",
    iconSize: [32, 44],
});
var redIcon = L.divIcon({
    className: "custom-div-icon",
    html: "<span class='beacon beacon-red'></span>",
    iconSize: [32, 44],
});
var blueIcon = L.divIcon({
    className: "custom-div-icon",
    html: "<span class='beacon beacon-blue'></span>",
    iconSize: [32, 44],
});
var trafficLayer = L.tileLayer(
    "https://rmssatmap.rmto.ir/sat/{z}/{x}/{y}.jpg",
    {}
);
var iranLayer = L.tileLayer(
    "https://rmsmap.rmto.ir/141map/{z}/{x}/{y}.png",
    {}
);
$.ajax({
    url: "/api/get-items-and-subs",
    type: "GET",
    async: false,
    success: function (data) {
        list_sub = data.items;
        for (index = 0; index < list_sub.length; index++) {
            var dailyActivity_subStr = list_sub[index].item_str;
            var dailyActivity_itemId = list_sub[index].item_id;
            $("#dailyActivity_sub").append(
                "<li class='layerButton2 pb-1'><div class='d-flex justify-content-between align-items-top'><button class='btn btn-default All_button_sub btn-sm'>انتخاب همه</button><div class='dropdownstart_sub'><span class='title-type-inside'>" +
                dailyActivity_subStr +
                "</span> <img class='dropDown' src='../dist/images/new-design/arrow-down.svg'></div></div><ul class='myId" +
                dailyActivity_itemId +
                " layerbuttonparent_sub'></ul></li>"
            );
        }
    },
});
$.ajax({
    url: "/csi/operation",
    type: "GET",
    cache: false,
    contentType: false,
    processData: false,
    success: function (res) {
        operation_res = res;
        $.each(operation_res, function (key, value) {
            $(".opration_natural").append(
                ` <li class="layerButton3">
           <span class="title-type-inside-inside">${value.farsi}</span>
           <input type="checkbox" class="input-project-type" value="${value.id}" name="subitem" />
         </li>`
            );
        });
    },
    error: function (error) {
        hideLoaderScreen();
        Swal.fire({
            icon: "error",
            title: "خطا",
            text: "مشکل در در دریافت ماهیت پروژه",
            confirmButtonText: "بستن",
        });
        console.log(error);
    },
});
$.ajax({
    url: "/api/get-items-and-subs",
    type: "GET",
    async: false,
    success: function (data) {
        list_sub_sub = data.data;
        for (i = 0; i < list_sub_sub.length; i++) {
            list_sub_itemId = list_sub_sub[i].item_id;
            $(document)
                .find(".myId" + list_sub_itemId)
                .append(
                    "<li class='layerButton3'><span class='title-type-inside-inside'>" +
                    list_sub_sub[i].sub_item_str +
                    "</span> <input type='checkbox' class='input-daily-activity' value='" +
                    list_sub_sub[i].id +
                    "' name='subitem'/></li>"
                );
        }
    },
});
//items data
//markers
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],
});
//markers
//map start
UncheckAll();
var mymap = L.map("mymap", {
    maxBounds: bounds,
    minZoom: 7,
}).setView([35.5468992, 51.7300532], 6);
mymap.addLayer(iranLayer);
// map start

//apending pin to map
startAbrarMarker = new L.marker(L.latLng(mymap.getCenter()), {
    icon: startAbrarDivIcon,
    draggable: true,
}).addTo(mymap);
endAbrarMarker = new L.marker(L.latLng(mymap.getCenter()), {
    icon: endAbrarDivIcon,
    draggable: true,
});
//apending pin to map

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

    if (isSetStartAbrarMarker && !isSetEndAbrarMarker) {
        endAbrarMarker.setLatLng(L.latLng(mymap.getCenter()));
        $("#pin-marker-end").removeClass("pin-set").addClass("pin-move");
    }
});
mymap.on("moveend", function () {
    if (!isSetStartAbrarMarker && !isSetEndAbrarMarker) {
        startAbrarMarker.setLatLng(L.latLng(mymap.getCenter()));
        $("#pin-marker-start").removeClass("pin-move pin-set");
    }

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

// (start marker)

//map click
startAbrarMarker.on("click", function () {
    sourceLat = mymap.getCenter().lat;
    sourceLng = mymap.getCenter().lng;
    if (!isSetStartAbrarMarker) {
        startAbrarMarker.setLatLng(L.latLng(mymap.getCenter()));
        isSetStartAbrarMarker = true;
        $("#pin-marker-start").removeClass("pin-move pin-warn").addClass("pin-set");
    }
    addSourceMarker(1);
    endAbrarMarker.addTo(mymap);
    showItemSelectionModal();

    $(this).hide();
    $("#pin-marker-start").removeClass("pin-move pin-warn").addClass("pin-set");
});
//map click

//map drag start part
startAbrarMarker.on("drag", function () {
    $("#pin-marker-start").addClass("pin-move");
});
//map drag start part

// map drag end part
startAbrarMarker.on("dragend", function () {
    $("#pin-marker-start").removeClass("pin-move");
    if ($("#pin-marker-start").hasClass("pin-set") || isSetStartAbrarMarker) {
        $("#pin-marker-start").addClass("pin-set");
        checkMarkersAndDrawPath();
    } else {
        mymap.setView(startAbrarMarker.getLatLng());
    }
});
//map drag end part

// (start marker)

// (end marker)

//map click
endAbrarMarker.on("click", function () {
    destLat = mymap.getCenter().lat;
    destLng = mymap.getCenter().lng;
    addDestinationMarker(1);
    if (!isSetEndAbrarMarker) {
        endAbrarMarker.setLatLng(L.latLng(mymap.getCenter()));
        isSetEndAbrarMarker = true;
        $("#pin-marker-end").removeClass("pin-move").addClass("pin-set");
    }

    checkMarkersAndDrawPath();
});
//map click

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

//map drag end part
endAbrarMarker.on("dragend", function () {
    $("#pin-marker-end").removeClass("pin-move");

    if ($("#pin-marker-end").hasClass("pin-set") || isSetEndAbrarMarker) {
        $("#pin-marker-end").addClass("pin-set");
        checkMarkersAndDrawPath();
    } else {
        mymap.setView(endAbrarMarker.getLatLng());
    }
});
//map drag end part

// (end marker)

//functions refers map
function addSourceMarker(type) {
    if (type == 1) {
        sourceCoordinates = L.latLng(mymap.getCenter());
    } else if (type == 2) {
        sourceCoordinates = [sourceLat, sourceLng];
    }
}

function addDestinationMarker(type) {
    if (type == 1) {
        destinationCoordinates = L.latLng(mymap.getCenter());
    } else if (type == 2) {
        destinationCoordinates = [destLat, destLng];
    }
}

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")
    ) {
        showLoaderScreen();

        routing(
            startAbrarMarker.getLatLng().lat,
            startAbrarMarker.getLatLng().lng,
            endAbrarMarker.getLatLng().lat,
            endAbrarMarker.getLatLng().lng
        );
    }
}

$(".filter-happend").attr("disabled", true);
$(".filter-happend").text("ثبت موقعیت اجباریست");
$(".filter-happend").addClass("btn-warning");
$(".filter-happend").removeClass("btn-primary");

$(".excel-happend").attr("disabled", true);

function showItemSelectionModal() {
    if (destLat != "") {
        if (
            $(".guid-custom-box-AxisReport input[type=checkbox]:checked").length != 0
        ) {
            $(".filter-happend").attr("disabled", false);
            $(".filter-happend").text("اعمال");
            $(".filter-happend").removeClass("btn-warning");
            $(".filter-happend").addClass("btn-primary");
        } else {
            $(".filter-happend").text("انتخاب آیتم ضروری است");
            $(".filter-happend").attr("disabled", true);
            $(".filter-happend").addClass("btn-warning");
            $(".filter-happend").removeClass("btn-primary");
        }
    }
}
$(".guid-custom-box-AxisReport input[type=checkbox]").change(function () {
    if ($(this).is(":checked")) {
        showItemSelectionModal();
    } else {
        showItemSelectionModal();
    }
});
//functions refers map

//date givinchi
fromDateAxis = $("#Axis-fromdate").persianDatepicker({
    observer: true,
    format: "YYYY/MM/DD",
    altField: ".observer-example-alt",
    autoClose: true,
    onSelect: function (unix) {
        fromDateAxis.touched = true;

        $("#Axis-todate").prop("disabled", "");

        if (
            fromDateAxis.getState().selected.unixDate >=
            toDateAxis.getState().selected.unixDate
        ) {
            toDateAxis.setDate(fromDateAxis.getState().selected.unixDate);
        }
        if (
            toDateAxis &&
            toDateAxis.options &&
            toDateAxis.options.minDate != unix
        ) {
            let cachedValue = toDateAxis.getState().selected.unixDate;

            toDateAxis.options = { minDate: unix };

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

toDateAxis = $("#Axis-todate").persianDatepicker({
    format: "YYYY/MM/DD",
    autoClose: true,
    format: "YYYY/MM/DD",
    autoClose: true,
    onSelect: function (unix) {
        toDateAxis.touched = true;
    },
});
// date givinchi

// lateral
$(document).on("click", ".iran-change-layer", function () {
    changelayer();
});
$(document).on("click", ".dropdownstart", function () {
    var dropdown = $(this).parents(".layerButton1");
    $(dropdown).find(".layerbuttonparent").slideToggle(500);
});
$(document).on("click", ".dropdownstart_sub", function () {
    var dropdown = $(this).parents(".layerButton2");
    $(dropdown).find(".layerbuttonparent_sub").slideToggle(500);
});
$(document).on("click", ".All_button", function () {
    var button_parent = $(this).parents(".layerButton1");

    if ($(this).text() == "انتخاب همه") {
        $(this).text("لغو همه");
        $(button_parent)
            .find(".layerbuttonparent input[type=checkbox]")
            .prop("checked", true);
        $(button_parent).find(".layerbuttonparent").slideDown(500);
        $(button_parent).find(".layerbuttonparent_sub").slideDown(500);
        $(button_parent).find(".All_button_sub").attr("disabled", true);
    } else {
        $(this).text("انتخاب همه");
        $(button_parent)
            .find(".layerbuttonparent input[type=checkbox]")
            .prop("checked", false);
        $(button_parent).find(".layerbuttonparent").slideUp(500);
        $(button_parent).find(".layerbuttonparent_sub").slideUp(500);
        $(button_parent).find(".All_button_sub").attr("disabled", false);
    }

    showItemSelectionModal();
});

$(document).on("click", ".All_button_sub", function () {
    var button_parent = $(this).parents(".layerButton2");
    if ($(this).text() == "انتخاب همه") {
        $(this).text("لغو همه");
        $(button_parent)
            .find(".layerbuttonparent_sub input[type=checkbox]")
            .prop("checked", true);
        $(button_parent).find(".layerbuttonparent_sub").slideDown(500);
    } else {
        $(this).text("انتخاب همه");
        $(button_parent)
            .find(".layerbuttonparent_sub input[type=checkbox]")
            .prop("checked", false);
        $(button_parent).find(".layerbuttonparent_sub").slideUp(500);
    }
    showItemSelectionModal();
});
// lateral
// change layer
function changelayer() {
    if (mymap.hasLayer(iranLayer)) {
        var currZoom = mymap.getZoom();
        if (currZoom < 8) {
            mymap.setZoom(8);
        }
        mymap.removeLayer(iranLayer);
        mymap.addLayer(trafficLayer);
        mymap.options.minZoom = 8;
        mymap.options.maxZoom = 14;
    } else if (mymap.hasLayer(trafficLayer)) {
        mymap.removeLayer(trafficLayer);
        mymap.addLayer(iranLayer);
        mymap.options.minZoom = 6;
    }
}

//chamge layer
// points start
$("#filterEnd").on("click", function () {
    currentDate.from = moment(
        fromDateAxis.getState().selected.year +
        "/" +
        fromDateAxis.getState().selected.month +
        "/" +
        fromDateAxis.getState().selected.date,
        "jYYYY/jM/jD"
    ).format("YYYY-MM-DD");

    currentDate.to = moment(
        toDateAxis.getState().selected.year +
        "/" +
        toDateAxis.getState().selected.month +
        "/" +
        toDateAxis.getState().selected.date,
        "jYYYY/jM/jD"
    ).format("YYYY-MM-DD");

    let url = "/api/axis-report?";
    let param = "";

    param += `slat=${startAbrarMarker.getLatLng().lat.toFixed(6)}`;
    param += `&slng=${startAbrarMarker.getLatLng().lng.toFixed(6)}`;
    param += `&dlat=${endAbrarMarker.getLatLng().lat.toFixed(6)}`;
    param += `&dlng=${endAbrarMarker.getLatLng().lng.toFixed(6)}`;
    param += `&date_from=${currentDate.from}`;
    param += `&date_to=${currentDate.to}`;

    if ($(".input-daily-activity:checked").length != 0) param += `&type[]=1`;
    if ($(".input-road-patrol:checked").length != 0) param += `&type[]=2`;
    if (
        $(".input-contract-status:checked").length != 0 ||
        $(".input-project-type:checked").length != 0
    )
        param += `&type[]=3`;

    if ($(".input-road-type:checked").length != 0) param += `&type[]=4`;

    $(".input-daily-activity:checked").each(function (index, element) {
        param += `&daily_activity[]=${$(element).val()}`;
    });

    $(".input-contract-status:checked").each(function (index, element) {
        param += `&contract_status[]=${$(element).val()}`;
    });

    $(".input-project-type:checked").each(function (index, element) {
        param += `&project_type[]=${$(element).val()}`;
    });

    $(".input-road-type:checked").each(function (index, element) {
        param += `&road_type[]=${$(element).val()}`;
    });
    url += param;

    $.ajax({
        url: url,
        type: "GET",
        beforeSend: function () {
            showLoaderScreen();
        },
        success: function (res) {
            showPointsOnMap(res);
            if (
                res.data.roadItemsProject == null &&
                res.data.contractSubItems == null &&
                res.data.roadObserved == null &&
                res.data.roadPatrolProject == null
            ) {
                $(".excel-happend").attr("disabled", true);
            } else {
                $(".excel-happend").attr("disabled", false);
            }
            excelParam = param;
            hideLoaderScreen();
        },
        error: function (err) {
            hideLoaderScreen();
            Swal.fire({
                icon: "error",
                title: "خطا سرور",
                text: err.responseJSON.message,
                showConfirmButton: false,
                cancelButtonText: "بستن",
            });
        },
    });
});

$("#excelEnd").on("click", function () {
    console.log(excelParam);
    const url = `/api/axis-report-excel${excelParam != "" ? `?${excelParam}` : ""
        }`;

    window.open(url, "_blank");
});

// start show points on map
function showPointsOnMap(res) {
    removeAxisMarker();
    roadPatrolProject = res.data.roadPatrolProject;
    roadObserved = res.data.roadObserved;
    contractSubItems = res.data.contractSubItems;
    roadItemsProject = res.data.roadItemsProject;
    AxisMarkerLayer = L.markerClusterGroup();

    if (roadPatrolProject != null) {
        for (let i = 0; i < roadPatrolProject.length; i++) {
            setIcon = redIcon;

            let marker = L.marker(
                [roadPatrolProject[i].start_lat, roadPatrolProject[i].start_lng],
                {
                    icon: setIcon,
                }
            ).on("click", function (e) {
                showModalPoints(roadPatrolProject[i].id, 2);
            });

            AxisMarkerList.push(marker);
        }
    }
    if (roadObserved != null) {
        for (let i = 0; i < roadObserved.length; i++) {
            setIcon = blueIcon;

            let marker = L.marker(
                [roadObserved[i].start_lat, roadObserved[i].start_lng],
                {
                    icon: setIcon,
                }
            ).on("click", function (e) {
                showModalPoints(roadObserved[i].id, 4);
            });
            AxisMarkerList.push(marker);
        }
    }
    if (roadItemsProject != null) {
        for (let i = 0; i < roadItemsProject.length; i++) {
            setIcon = pinkIcon;

            let marker = L.marker(
                [roadItemsProject[i].start_lat, roadItemsProject[i].start_lng],
                {
                    icon: setIcon,
                }
            ).on("click", function (e) {
                showModalPoints(roadItemsProject[i].id, 1);
            });
            AxisMarkerList.push(marker);
        }
    }
    if (contractSubItems != null) {
        for (let i = 0; i < contractSubItems.length; i++) {
            setIcon = purpleIcon;

            let marker = L.marker(
                [contractSubItems[i].start_lat, contractSubItems[i].start_lng],
                {
                    icon: setIcon,
                }
            ).on("click", function (e) {
                showModalPoints(contractSubItems[i].id, 3);
            });
            AxisMarkerList.push(marker);
        }
    }
    AxisMarkerLayer.addLayers(AxisMarkerList);
    mymap.addLayer(AxisMarkerLayer);
}

// end show points on map
// points end
// clear map from marker
function removeAxisMarker() {
    if (AxisMarkerLayer != null) {
        AxisMarkerList = [];
        mymap.removeLayer(AxisMarkerLayer);
    }
}
function showModalPoints(id, type) {
    $.ajax({
        url:
            "/api/axis-report/single?id=" + id + "&type=" + type,
        type: "GET",
        success: function (data) {
            $("#points-data").modal("show");
            completeModalWithData(data, type);
        },
    });
}

function completeModalWithData(data, id) {
    $(".modalBody").empty();
    $(".title-points").empty();

    var modalBody = "";
    switch (id) {
        case 2:
            $(".title-points").append("گشت راهداری ");

            modalBody += `<div class="form-group col-md-6">
            <label  class="">نام استان </label>
            <input type="text" class="form-control"  value="${data.data.province_fa}" disabled/>
             </div><div class="form-group col-md-6">
           <label  class="">نام شهرستان </label>
           <input type="text" class="form-control"  value="${data.data.city_fa}" disabled />
            </div><div class="form-group col-md-6">
              <label  class="">طول پروژه  </label>
              <input type="text" class="form-control"  value="${data.data.project_distance}" disabled />
         </div>`;
            break;
        case 1:
            $(".title-points").append("فعالیت روزانه و جاری ");

            modalBody += `<div class="form-group col-md-6">
            <label  class="">تاریخ </label>
            <input type="text" class="form-control"  value="${data.data.created_at_fa
                }" disabled/>
             </div><div class="form-group col-md-6">
            <label  class="">نام استان </label>
            <input type="text" class="form-control"  value="${data.data.province_fa
                }" disabled/>
             </div><div class="form-group col-md-6">
              <label  class="">نام شهرستان </label>
              <input type="text" class="form-control"  value="${data.data.user_name
                }" disabled />
              </div>
              <div class="form-group col-md-12">
              <label  class="">نوع عملیات </label>
              <table class="table table-bordered" width="100%" border="1"><tbody><tr>${showHeaderRoadItem()}</tr>${showBodyRoadItem(
                    data.data
                )}</tbody></table>   
          </div>
          <div class="form-group col-md-12">
          <table class="table table-bordered table-sm tablephoto" style="width:100%" id="tablephotoroaditem">
          <thead>
          <tr><th>عکس 1</th><th>عکس 2 </th></tr>
          </thead>
          <tbody>
          <tr class="showphotocell">
          <td><img src="/storage/${data.data.files[0].path
                }"></td>
          <td><img src="/storage/${data.data.files[1].path
                }"></td>
          </tr>
          </tbody>
          </table></div>
          `;

            break;
        case 4:
            $(".title-points").append("واکنش سریع");

            modalBody += `<div class="form-group col-md-4">
            <label  class="">استان</label>
            <input type="text" class="form-control"  value="${data.data.ProvinceName
                }" disabled/>
             </div><div class="form-group col-md-4">
             <label  class="">شهرستان</label>
             <input type="text" class="form-control"  value="${data.data.TownName
                }" disabled/>
              </div><div class="form-group col-md-4">
              <label  class="">تاریخ اقدام</label>
              <input type="text" class="form-control"  value="${data.data.rms_last_activity_fa
                }" disabled/>
               </div><div class="form-group col-md-6">
               <label  class="">تاریخ شکایت</label>
               <input type="text" class="form-control"  value="${data.data.StartTime_DateTime_fa
                }" disabled/>
                </div><div class="form-group col-md-6">
           <label  class="">نوع شکایت </label>
           <input type="text" class="form-control"  value="${data.data.FeatureTypeTitle
                }" disabled />
            </div><div class="form-group col-md-12">
              <label  class="">توضیح شکایت </label>
              <input type="text" class="form-control"  value="${data.data.Description != null ? data.data.Description : ""
                }" disabled />
         </div><div class="form-group col-md-12">
         <label  class="">موضوع شکایت </label>
         <input type="text" class="form-control"  value="${data.data.Title
                }" disabled />
    </div>    <div class="form-group col-md-12" id="fast-creat-table">${fastPhoto(
                    data.data.files
                )}</div>`;
            break;

        case 3:
            $(".title-points").append("قراردادها ");

            modalBody += `<div class="form-group col-md-6">
                    <label  class="">نام استان </label>
                    <input type="text" class="form-control"  value="${data.data[0].province_fa
                }" disabled/>
                     </div><div class="form-group col-md-6">
                   <label  class="">نام شهرستان </label>
                   <input type="text" class="form-control"  value="${data.data[0].city_fa
                }" disabled />
                    </div><div class="form-group col-md-6">
                      <label  class="">نوع پروژه  </label>
                      <input type="text" class="form-control"  value="${data.data[0].project_type_fa
                }" disabled />
                 </div>
                 <div class="form-group col-md-6">
                      <label  class="">عنوان پروژه </label>
                      <input type="text" class="form-control"  value="${data.data[0].project_title
                }" disabled />
                 </div>
                 <div class="form-group col-md-6">
                 <label  class="">نام محور </label>
                 <input type="text" class="form-control"  value="${data.data[0].axis_name_fa
                }" disabled />
            </div>  <div class="form-group col-md-6">
            <label  class="">نوع محور </label>
               <input type="text" class="form-control"  value="${data.data[0].axis_type_fa
                }" disabled />
        </div>
                <div class="form-group col-md-6">
            <label  class="">آخرین وضعیت پروژه</label>
            <input type="text" class="form-control"  value="${data.data[0].last_status_fa
                }" disabled />
        </div>
        <div class="form-group col-md-6">
        <label  class="">درصد پیشرفت</label>
        <input type="text" class="form-control"  value="${data.data[0].progress_project
                }" disabled />
    </div>
        <div class="form-group col-md-6">
            <label  class="">آخرین تاریخ بروزرسانی</label>
            <input type="text" class="form-control"  value="${data.data[0].updated_at_fa
                }" disabled />
        </div>
        <div class="form-group col-md-6">
            <label  class="">تاریخ ثبت در سامانه</label>
            <input type="text" class="form-control"  value="${data.data[0].created_at_fa
                }" disabled />
        </div>
        <div class="form-group col-md-12">
        <label  class="">نوع عملیات </label>
       <table class="table table-bordered" width="100%" border="1"><tbody><tr>${showHeaderFin(
                    data.data[0].project_type_id
                )}</tr>${showBodyFin(
                    data.data[0].operation,
                    data.data[0].project_type_id
                )}</tbody></table>
    </div>
    <div class="form-group col-md-12">
    <table class="table table-bordered table-sm tablephoto" style="width:100%" id="tablephotofinance">
    <thead>
    <tr><th>عکس 1</th><th>عکس 2 </th></tr>
    </thead>
    <tbody>
    <tr class="showphotocell">
    <td><img src="/${data.data[0].image_path1.replace(
                    "public",
                    "storage"
                )}"></td>
    <td><img src="/${data.data[0].image_path2.replace(
                    "public",
                    "storage"
                )}"></td>
    </tr>
    </tbody>
    </table></div>
        `;
            break;
    }
    $(".modalBody").append(modalBody);
}

function showHeaderRoadItem(num) {
    var headertext = "";
    headertext = `<th>نوع عملیات</th><th>ریز فعالیت</th><th>مقدار </th><th>واحد </th>`;
    return headertext;
}

function fastPhoto(data) {
    if (data.length > 0) {
        var tablebody = `<table class="table table-bordered table-sm tablephoto" style="width:100%" id="tablephotofast">
        <thead>
        <tr><th>عکس 1</th><th>عکس 2 </th></tr>
        </thead>
        <tbody>
        <tr class="showphotocell fast-react-td">
        ${showBodyFast(data)}
        </tr>
        </tbody>
        </table>`;

        return tablebody;
    } else {
        return "";
    }
}
function showBodyFast(data) {
    $(".fast-react-td").empty();
    var bodycol = "";

    for (var i = 0; i < data.length; i++) {
        bodycol += `<td><img src="/${data[i].path.replace(
            "public",
            "storage"
        )}"></td>`;
    }
    return bodycol;
}
function showHeaderFin(num) {
    var headertext = "";
    if (num == 1) {
        headertext = `<th>نوع عملیات</th><th>  مقدار</th><th>واحد </th><th>پیشرفت </th><th> تناژ </th>`;
    } else {
        headertext = `<th>نوع عملیات</th><th>  مقدار</th><th>واحد </th><th>پیشرفت </th>`;
    }
    return headertext;
}
function showBodyRoadItem(data) {
    var tbody = "";
    tbody += `<tr><td>${data.item_fa}</td><td>${data.sub_item_fa}</td><td>${data.sub_item_data}</td><td>${data.unit_fa}</td></tr>`;
    return tbody;
}
function showBodyFin(array, num) {
    var tbody = "";
    for (var i = 0; i < array.length; i++) {
        if (array[i].hasOperation != 0 && num == 1) {
            if (i + 1 == 1) {
                tbody += `<tr><td>${array[i].operation_type_fa1}</td><td>${array[i].operation_type_amount1}</td><td>${array[i].operation_type_unit1}</td><td>${array[i].operation_type_progress1}</td><td>${array[i].operation_type_tonaj1}</td></tr>`;
            } else if (i + 1 == 2) {
                tbody += `<tr><td>${array[i].operation_type_fa2}</td><td>${array[i].operation_type_amount2}</td><td>${array[i].operation_type_unit2}</td><td>${array[i].operation_type_progress2}</td><td>${array[i].operation_type_tonaj2}</td></tr>`;
            } else if (i + 1 == 3) {
                tbody += `<tr><td>${array[i].operation_type_fa3}</td><td>${array[i].operation_type_amount3}</td><td>${array[i].operation_type_unit3}</td><td>${array[i].operation_type_progress3}</td><td>${array[i].operation_type_tonaj3}</td></tr>`;
            } else if (i + 1 == 4) {
                tbody += `<tr><td>${array[i].operation_type_fa4}</td><td>${array[i].operation_type_amount4}</td><td>${array[i].operation_type_unit4}</td><td>${array[i].operation_type_progress4}</td><td>${array[i].operation_type_tonaj4}</td></tr>`;
            }
        } else if (array[i].hasOperation != 0 && num != 1) {
            if (i + 1 == 1) {
                tbody += `<tr><td>${array[i].operation_type_fa1}</td><td>${array[i].operation_type_amount1}</td><td>${array[i].operation_type_unit1}</td><td>${array[i].operation_type_progress1}</td></tr>`;
            } else if (i + 1 == 2) {
                tbody += `<tr><td>${array[i].operation_type_fa2}</td><td>${array[i].operation_type_amount2}</td><td>${array[i].operation_type_unit2}</td><td>${array[i].operation_type_progress2}</td></tr>`;
            } else if (i + 1 == 3) {
                tbody += `<tr><td>${array[i].operation_type_fa3}</td><td>${array[i].operation_type_amount3}</td><td>${array[i].operation_type_unit3}</td><td>${array[i].operation_type_progress3}</td></tr>`;
            } else if (i + 1 == 4) {
                tbody += `<tr><td>${array[i].operation_type_fa4}</td><td>${array[i].operation_type_amount4}</td><td>${array[i].operation_type_unit4}</td><td>${array[i].operation_type_progress4}</td></tr>`;
            }
        }
    }
    return tbody;
}
// UncheckAll
function UncheckAll() {
    var w = document.getElementsByTagName("input");
    for (var i = 0; i < w.length; i++) {
        if (w[i].type == "checkbox") {
            w[i].checked = false;
        }
    }
}

// routing
function routing(lat, lng, latsecond, lngsecond) {
    if (routeControls.length) {
        $(routeControls).each(function (index, control) {
            mymap.removeControl(control);
            routeControls.splice(routeControls.indexOf(index), 1);
        });
    }
    routeArray = [];
    let result = new Promise(function (resolve, reject) {
        $.get(
            "https://rmsmap.rmto.ir" +
            "/route/v1/driving/" +
            lng +
            "," +
            lat +
            ";" +
            lngsecond +
            "," +
            latsecond +
            "?overview=full&alternatives=true&steps=true",
            function (data) {
                if (data.routes.length > 1) {
                    if (
                        parseInt(data.routes[0].distance) >
                        parseInt(data.routes[1].distance)
                    ) {
                        resolve(decode(data.routes[1].geometry, 6));
                    } else {
                        resolve(decode(data.routes[0].geometry, 6));
                    }
                } else {
                    resolve(decode(data.routes[0].geometry, 6));
                }
            }
        );
    });

    result
        .then((response) => {
            hideLoaderScreen();
            routeArray = response;
        })
        .catch((error) => {
            console.log(error);
            hideLoaderScreen();
        });

    routeControls.push(
        L.Routing.control({
            routeWhileDragging: true,
            reverseWaypoints: true,
            addWaypoints: false,
            waypoints: [L.latLng(lat, lng), L.latLng(latsecond, lngsecond)],
            lineOptions: {
                styles: [
                    {
                        color: "#28a745",
                        opacity: 1,
                        weight: 5,
                    },
                ],
            },
            createMarker: function () {
                return null;
            },
        }).addTo(mymap)
    );
    showItemSelectionModal();

    if ($(".leaflet-routing-container").length) {
        $(".leaflet-routing-container").remove();
    }
}
function decode(str, precision) {
    var index = 0,
        lat = 0,
        lng = 0,
        coordinates = [],
        shift = 0,
        result = 0,
        byte = null,
        latitude_change,
        longitude_change,
        factor = Math.pow(10, Number.isInteger(precision) ? precision : 5);

    while (index < str.length) {
        byte = null;
        shift = 0;
        result = 0;

        do {
            byte = str.charCodeAt(index++) - 63;
            result |= (byte & 0x1f) << shift;
            shift += 5;
        } while (byte >= 0x20);

        latitude_change = result & 1 ? ~(result >> 1) : result >> 1;

        shift = result = 0;

        do {
            byte = str.charCodeAt(index++) - 63;
            result |= (byte & 0x1f) << shift;
            shift += 5;
        } while (byte >= 0x20);

        longitude_change = result & 1 ? ~(result >> 1) : result >> 1;

        lat += latitude_change;
        lng += longitude_change;

        coordinates.push([lat / factor, lng / factor]);
    }

    return coordinates;
}

// routing