var endpoint = "https://rms.rmto.ir/road-observation-problems/getlist";
var endpoint1 = "https://rms.rmto.ir/webapi/road-observed/pending";
var endpoint2 = "https://rms.rmto.ir/api/road-observed/done";
var counts_api = "https://rms.rmto.ir/webapi/road-observed/count";
var totalCounts = null;
var fromDate, toDate;
var table;
var tableexcel;
var table2;
var totaldata;
var pendingCount;
var doneCount;
var excelDatepickerFirstTable = {};

var idProvince;
var idkolerja;

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 list_province = [];
var list_citys = [];
var array_hold = [];
var array_hold_String = "";
var array_hold_String_edited;

var array_hold_Axis_type = [];

var String_hold_Axis_type = "";
var String_edited_Axis_type;
var arry_select2_date;

var hold_Data_p1 = "";
var pooriapo;

var hold_Data_city1;
var city1_array = [];
var city1_String = "";
var city1_String_edited = "";
var hold_Data_city2;
var city2_array = [];
var city2_String = "";
var city2_String_edited = "";
var hold_Data_city3;
var city3_array = [];
var city3_String = "";
var city3_String_edited = "";
var hold_Data_province1;
var hold_Data_province2;
var hold_Data_province3;

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

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

var mapCenterLat = null;
var mapCenterLng = null;
var idkol;

$(document).bind("click", function(e) {
    const clicked = $(e.target);
    if (clicked.parents(".datepicker-container").length != 0) return false;
    if (clicked.parents(".select2-selection__choice").length != 0) return false;
    if (
        clicked.closest(".btn-table-filter").length == 0 &&
        clicked.closest(".parent-filter").length == 0 &&
        $(".parent-filter").css("display") != "none"
    ) {
        $(".parent-filter").css("display", "none");
    }
    if (
        clicked.closest(".btn-table-excel").length == 0 &&
        clicked.closest(".parent-excel").length == 0 &&
        $(".parent-excel").css("display") != "none"
    ) {
        $(".parent-excel").css("display", "none");
    }
});

$(document).ready(function() {
    showLoaderScreen();
    fromDate = $("#datepickfrom").persianDatepicker({
        format: "YYYY/MM/DD",
        autoClose: true,
        initialValue: false,
        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,
        initialValue: false,
        onSelect: function(unix) {
            toDate.touched = true;
        },
    });
    tableexcel = $("#exampleexcel").DataTable({
        dom: "B",
        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: ": فعال سازی نمایش به صورت نزولی",
            },
        },

        order: [
            [0, "desc"]
        ],
        processing: false,
        ajax: {
            url: endpoint,
            type: "GET",
            dataSrc: function(json) {
                totaldata = 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: null,
                render: function(data, type, row) {
                    if (data.Description.length > 30) {
                        return data.Description.substr(0, 30) + "...";
                    }

                    return data.Description;
                },
            },
            {
                orderable: false,
                className: "text-center",
                data: null,
                render: function(data, type, row) {
                    return `<p class="text-center" alignment="center">(${parseFloat(
            data.lng
          ).toFixed(2)} , ${parseFloat(data.lat).toFixed(2)})</p>`;
                },
            },
            {
                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(
                        0,
                        data.StartTime_DateTime.indexOf("-")
                    );
                },
            },
            {
                orderable: false,
                className: "text-right",
                data: null,
                render: function(data, type, row) {
                    if (data.rms_status == 1) {
                        return `<label>انجام شد</label>`;
                    } else if (data.rms_status == 2) {
                        return `<label>انجام نشد</label>`;
                    } else {
                        return `<label> در حال بررسی </label>`;
                    }
                },
            },
            {
                orderable: false,
                className: "text-center dir-ltr-cls",
                data: null,
                render: function(data, type, row) {
                    return data.rms_last_activity;
                },
            },
            {
                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="15" maxlength="250" ` +
                            disabled +
                            `></textarea> `
                        );
                    }
                    return (
                        `<textarea id="desBox${data.id}" class="descripBox" name="" placeholder="توضیحات " rows=""  cols="15" maxlength="250" ` +
                        disabled +
                        `>${data.rms_description}</textarea> `
                    );
                },
            },
        ],
        columnDefs: [{
                targets: [0],
                visible: false,
                searchable: false,
            },
            {
                targets: [1],
                visible: false,
                searchable: false,
            },
            {
                targets: [2],
                visible: false,
                searchable: false,
            },
            {
                targets: [3],
                visible: false,
                searchable: false,
            },
            {
                targets: [4],
                visible: false,
                searchable: false,
            },
            {
                targets: [5],
                visible: false,
                searchable: false,
            },
            {
                targets: [6],
                visible: false,
                searchable: false,
            },
            {
                targets: [7],
                visible: false,
                searchable: false,
            },
            {
                targets: [8],
                visible: false,
                searchable: false,
            },
            {
                targets: [9],
                visible: false,
                searchable: false,
            },
            {
                targets: [10],
                visible: false,
                searchable: false,
            },
            {
                targets: [11],
                visible: false,
                searchable: false,
            },
        ],

        buttons: [{
            extend: "excelHtml5",
            title: "Excel",
            text: '<div class=" d-flex flex-column text-nowrap testshow"><i class="fa mb-2 fa-book icon-color"></i> خروجی به اکسل کلی  </div>',
            messageTop: " لیست شکایات  ",
        }, ],
    });
    table = $("#example").DataTable({
        dom: "lBfrtip",
        scrollX: true,
        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: [
            { width: "5%", targets: 0 },
            { width: "4%", targets: 1 },
            { width: "4%", targets: 2 },
            { width: "5%", targets: 3 },
            { width: "5%", targets: 4 },
            { width: "4%", targets: 5 },
            { width: "3%", targets: 6 },
            { width: "3.5%", targets: 7 },
            { width: "5%", targets: 8 },
            { width: "3.5%", targets: 9 },
            { width: "3%", targets: 10 },
            { width: "7%", targets: 13 },
            { width: "6%", targets: 14 },
            {
                searchable: false,
                orderable: false,
                targets: 8,
            },
            { type: "pstring", targets: 1 },
            {
                orderable: false,
                className: "select-checkbox",
                targets: 8,
            },
            {
                targets: 5,
                createdCell: function(td, cellData, rowData, row, col) {
                    if (rowData.j != null) {
                        if (rowData.j.length > 30) {
                            $(td).attr("title", rowData.j);
                        }
                    } else {
                        return "-"
                    }

                },
            },
        ],
        order: [
            [0, "desc"]
        ],
        processing: true,
        ajax: {
            url: endpoint1,
            type: "GET",
            dataSrc: function(json) {
                totaldata = 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.a;
                },
            },
            {
                orderable: false,
                className: "text-center",
                data: "d",
            },
            {
                orderable: false,
                className: "text-center",
                data: "f",
            },
            {
                orderable: false,
                className: "text-center",
                data: "b",
            },
            {
                orderable: false,
                className: "text-center",
                data: "i",
            },
            {
                orderable: false,
                className: "text-center",
                data: null,
                render: function(data, type, row) {
                    if (data.j != null) {
                        if (data.j.length > 30) {
                            return data.j.substr(0, 30) + "...";
                        }

                        return data.j;
                    } else {
                        return "-"
                    }

                },
            },
            {
                orderable: false,
                className: "text-center",
                data: null,
                render: function(data, type, row) {
                    return (
                        `<div id="loacleLoc${data.a}">
          <p class="text-center" style="display:none" alignment="center">(${parseFloat(
            data.g
          ).toFixed(2)} , ${parseFloat(data.h).toFixed(2)})</p>
          <img class="firstImg" src="../dist/images/new-design/iranTemp.svg" onclick="showMapModalStatic(` +
                        parseFloat(data.h).toFixed(2) +
                        "," +
                        parseFloat(data.g).toFixed(2) +
                        `)">
         </div>`
                    );
                },
            },
            {
                orderable: false,
                className: "text-center",
                data: null,
                render: function(data, type, row) {
                    return data.k;
                },
            },
            {
                orderable: false,
                className: "text-center dir-ltr-cls",
                data: null,
                render: function(data, type, row) {
                    return (
                        data.c.substring(0, data.c.indexOf("-")) +
                        " و " +
                        data.c.substring(data.c.indexOf("-") + 1)
                    );
                },
            },

            {
                orderable: false,
                className: "text-right",
                data: null,
                render: function(data, type, row) {
                    return `<input id="rButD${data.a}" type="radio"  value="1" name="rBut${data.a}" class="radioCl">
          <label for="rButD${data.a}">انجام شد</label><br>
          <input id="rButU${data.a}" type="radio" value="0" name="rBut${data.a}" class="radioCl">
            <label for="rButU${data.a}">انجام نشد</label>`;
                },
            },
            {
                orderable: false,
                className: "location",
                className: "text-center",
                data: null,
                render: function(data, type, row) {
                    return (
                        `
            <div id="parentButton${data.a}">
            <img  src="../dist/images/new-design/iranTemp3.svg" onclick="showMapModal(` +
                        data.a +
                        "," +
                        parseFloat(data.h).toFixed(2) +
                        "," +
                        parseFloat(data.g).toFixed(2) +
                        `)">
          </div>`
                    );
                },
            },
            {
                orderable: false,
                className: "text-center",
                data: null,
                render: function(data, type, row) {
                    htmlElement = `
            <div id="uploadImageDivA${data.a}"  title="" style="position: relative;">
            <label class="fileBtn" for="uploadBeforeA${data.a}">
            <img src="../dist/images/new-design/uploadButtonB.svg" style="cursor:not-allowed;">
            </label>
              <input type="file" disabled name="uploadBeforeA" id="uploadBeforeA${data.a}" style="display:none;" class="uploadButton">
              </div>
            `;
                    return htmlElement;
                },
            },
            {
                orderable: false,
                className: "text-center",
                data: null,
                render: function(data, type, row) {
                    htmlElement = `
            <div id="uploadImageDivC${data.a}"  title="" style="position: relative;">
        <label class="fileBtn" for="uploadAfterrC${data.a}">
        <img src="../dist/images/new-design/uploadButtonB.svg" style="cursor:not-allowed;"></img>
        </label>
          <input type="file" disabled name="uploadAfterrC" id="uploadAfterrC${data.a}" style="display:none;" class="uploadButton">

          </div>`;
                    return htmlElement;
                },
            },
            {
                orderable: false,
                className: "text-center",
                data: null,
                render: function(data, type, row) {
                    return `<textarea id="desBox${data.a}" class="descripBox" name="" placeholder="توضیحات " rows=""  cols="15" maxlength="250"></textarea> `;
                },
            },
            {
                className: "text-center",
                orderable: false,
                className: "location",
                data: null,
                render: function(data, type, row) {
                    return (
                        `
          <div  class="text-center" style="display: flex;justify-content: center;">
            <div style=" display: inline;padding: 0 5px 0 5px;">
            <img class="referClass" src="../dist/citySelect/new-design/refer.svg"  onclick="">
            <div>ارجاع</div>
            </div>

            <div style=" display: inline;padding: 0 5px 0 5px;">
            <img class="previewClass" src="../dist/images/new-design/preview.svg"  onclick="window.open('/webapi/fast-reaction/` +
                        data.a +
                        `/preview/print')">
            <div>پیش نمایش</div>
            </div>
            
            <div style=" display: inline;padding: 0 5px 0 5px;">
            <img class="submitClass" src="../dist/images/new-design/submit.svg"  disabled id="submitBut${data.a}" onclick="saveFastReaction(` +
                        data.a +
                        `)">
            <div>ثبت</div>
            </div>
          </div>`
                    );
                },
            },
        ],
        buttons: [{
                text: '<div class="btn-table-filter"><div class="d-flex flex-column"><i class="fa mb-2 fa-filter icon-color"></i> فیلترینگ پیشرفته</div></div>',
                action: function(e, dt, node, config) {
                    $(".parent-filter").css("display", "block");
                },
            },
            {
                text: '<div class="btn-table-excel"><div class="d-flex flex-column"><i class="fa mb-2 fa-book icon-color"></i>خروجی به اکسل (جدید)</div></div>',
                action: function(e, dt, node, config) {
                    $(".parent-excel")
                        .find(".btn-set-excel")
                        .data("table", "fastnewreact");
                    $(".parent-excel").css("display", "block");
                },
            },
        ],

        initComplete: function(settings, json) {
            hideLoaderScreen();
            $("body").find(".dataTables_scrollBody").addClass("scrollbar");
            $("#example_wrapper .dt-buttons").append(`<div class='parent-filter'>    
    <div class='container'>
    <button onclick="pops()" class="btn-increase">+</button>
    <div class="row mt-2">
    <div class="col-12 mb-2"><select  id="select-province1" class="js-example-basic-multiple form-control-me stylescroll"></select></div>
    <div class="col-12 mb-2"><select id="select-city1" name="states[]" multiple="multiple" class="stylescroll js-example-basic-multiple-citys form-control"></select></div>
    <div class="col-12" >
    <div id="append-input-forFilter2" class="my-2 d-none">
          <select id="select-province2" class="js-example-basic-multiple form-control-me mb-2 stylescroll"></select>                       
      <select name="states[]" multiple="multiple" id="select-city2" class="js-example-basic-multiple-citys form-control"></select> 
    </div>
    </div>
    <div class="col-12">
    <div id="append-input-forFilter3" class="my-2 d-none">
           <select id="select-province3"
        class="js-example-basic-multiple form-control-me mb-2 stylescroll"></select>
           <select name="states[]" multiple="multiple" id="select-city3"
        class="js-example-basic-multiple-citys form-control"></select>
       </div>
    </div>
<div class="col-12 text-center"><button id="btn_filter_show" class="btn-set-filter px-2 py-1">فیلتر</button></div>
    </div>
    </div>
    </div><div class='parent-excel'>
        <div class="row mt-2">
            <div class="col-12 mb-2 mb-2">
                <select id="select-province-excel-table" class="form-control" name="select-province-excel-table">
                </select>
            </div>
            <div class="form-group col-12 mb-2 mb-2">
                <input type="text" id="datapicker-from-excel-table" class="form-control datepicker-excel-from" placeholder="از تاریخ" autocomplete="off" />
            </div>
            <div class="form-group col-12 mb-2 mb-2">
                <input type="text" id="datapicker-to-excel-table" class="form-control datepicker-excel-to" placeholder=" تا تاریخ" autocomplete="off" disabled />
            </div>
            <div class="col-12 text-left"><button id="btn_excel_download"
                class="btn-set-filter btn-set-excel px-2 py-1">دریافت فایل</button>
            </div>
        </div>
    </div>`);
            $(".js-example-basic-multiple").append(
                '<option   value="0">انتخاب اداره کل</option>'
            );
            $(".btn-increase").prop("disabled", true);
            init_row_filter();
            $("#select-province1").on("change", function() {
                init_data_filter1();
                $(".btn-increase").prop("disabled", false);
            });
            $("#select-province2").on("change", function() {
                init_data_filter2();
                $(".btn-increase").prop("disabled", false);
            });
            $("#select-province3").on("change", function() {
                init_data_filter3();
            });

            excelDatepickerFirstTable.from = $(
                "#datapicker-from-excel-table"
            ).persianDatepicker({
                format: "YYYY/MM/DD",
                autoClose: true,
                onSelect: function(unix) {
                    excelDatepickerFirstTable.from.touched = true;

                    $("#datapicker-to-excel-table").prop("disabled", "");

                    if (
                        excelDatepickerFirstTable.from.getState().selected.unixDate >=
                        excelDatepickerFirstTable.to.getState().selected.unixDate
                    ) {
                        excelDatepickerFirstTable.to.setDate(
                            excelDatepickerFirstTable.from.getState().selected.unixDate
                        );
                    }

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

                        excelDatepickerFirstTable.to.options = { minDate: unix };

                        if (excelDatepickerFirstTable.from.touched) {
                            excelDatepickerFirstTable.to.setDate(cachedValue);
                        }
                    }
                },
            });

            excelDatepickerFirstTable.to = $(
                "#datapicker-to-excel-table"
            ).persianDatepicker({
                format: "YYYY/MM/DD",
                autoClose: true,
                onSelect: function(unix) {
                    excelDatepickerFirstTable.to.touched = true;
                },
            });

            $("#select-city1").select2({
                dir: "rtl",
                placeholder: "انتخاب شهرستان",
                width: "resolve",
            });
            $("#select-city2").select2({
                dir: "rtl",
                placeholder: "انتخاب شهرستان",
                width: "resolve",
            });
            $("#select-city3").select2({
                dir: "rtl",
                placeholder: "انتخاب شهرستان",
                width: "resolve",
            });

            $("#select-city1").on("change", function() {
                hold_Data_city1 = null;
                city1_array = [];
                city1_String = "";
                city1_String_edited = "";
                hold_Data_city1 = $("#select-city1").select2("data");
            });
            $("#select-city2").on("change", function() {
                hold_Data_city2 = null;
                city2_array = [];
                city2_String = "";
                city2_String_edited = "";
                hold_Data_city2 = $("#select-city2").select2("data");
            });
            $("#select-city3").on("change", function() {
                hold_Data_city3;
                city3_array = [];
                city3_String = "";
                city3_String_edited = "";
                hold_Data_city3 = $("#select-city3").select2("data");
            });
            $("#select-province1").on("change", function() {
                hold_Data_province1 = null;
                hold_Data_province1 = $("#select-province1 option:selected").text();
            });
            $("#select-province2").on("change", function() {
                hold_Data_province2 = null;
                hold_Data_province2 = $("#select-province2 option:selected").text();
            });
            $("#select-province3").on("change", function() {
                hold_Data_province3 = null;
                hold_Data_province3 = $("#select-province3 option:selected").text();
            });
            $("#btn_filter_show").on("click", function() {
                var test = "|";
                var hold_Data_p1 = "";
                var pooriapo;

                if (
                    ($("#select-province1").val() && $("#select-province1").val() != 0) ||
                    ($("#select-province2").val() && $("#select-province2").val() != 0) ||
                    ($("#select-province3").val() && $("#select-province3").val() != 0)
                ) {
                    $("#example")
                        .DataTable()
                        .column(1)
                        .search(
                            hold_Data_province1 +
                            test +
                            hold_Data_province2 +
                            test +
                            hold_Data_province3,
                            true,
                            false
                        )
                        .draw();
                }

                if (hold_Data_city1) {
                    for (let i = 0; i < hold_Data_city1.length; i++) {
                        city1_array.push(hold_Data_city1[i].text.trim().concat("|"));
                    }
                }
                for (let i = 0; i < city1_array.length; i++) {
                    city1_String += city1_array[i];
                }
                if (city1_String[city1_String.length - 1] == "|") {
                    city1_String_edited = city1_String.slice(0, city1_String.length - 1);
                }
                if (hold_Data_city2) {
                    for (let i = 0; i < hold_Data_city2.length; i++) {
                        city2_array.push(hold_Data_city2[i].text.trim().concat("|"));
                    }
                }

                for (let i = 0; i < city2_array.length; i++) {
                    city2_String += city2_array[i];
                }
                if (city2_String[city2_String.length - 1] == "|") {
                    city2_String_edited = city2_String.slice(0, city2_String.length - 1);
                }
                if (hold_Data_city3) {
                    for (let i = 0; i < hold_Data_city3.length; i++) {
                        city3_array.push(hold_Data_city3[i].text.trim().concat("|"));
                    }
                }
                if (city3_array) {
                    for (let i = 0; i < city3_array.length; i++) {
                        city3_String += city3_array[i];
                    }
                }
                if (city3_String[city3_String.length - 1] == "|") {
                    city3_String_edited = city3_String.slice(0, city3_String.length - 1);
                }

                var farsamoner;
                var farsamNum = 0;
                if (city1_String_edited) {
                    farsamoner = city1_String_edited;
                    farsamNum++;
                }
                if (city2_String_edited) {
                    farsamNum != 0 ? (farsamoner += "|") : (farsamoner += "");
                    farsamoner += city2_String_edited;
                    farsamNum++;
                }
                if (city3_String_edited) {
                    farsamNum != 0 ? (farsamoner += "|") : (farsamoner += "");
                    farsamoner += city3_String_edited;
                }
                if (farsamoner) {
                    $("#example")
                        .DataTable()
                        .column(2)
                        .search(farsamoner, true, false)
                        .draw();
                }

                $(".parent-filter").css("display", "none");
            });
        },
    });

    $(".show-done").on("click", function() {
        if ($(".whole-table2").css("display") == "none") {
            $(".show-done")
                .addClass("show-done-selected")
                .removeClass("show-done-unselected");
            showLoaderScreen();
            $(".whole-table2").css("display", "");

            if (table2 == undefined) {
                table2 = $("#example2").DataTable({
                    dom: "lBfrtip",
                    scrollX: true,
                    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: [
                        { width: "5%", targets: 0 },
                        { width: "4%", targets: 1 },
                        { width: "4%", targets: 2 },
                        { width: "5%", targets: 3 },
                        { width: "5%", targets: 4 },
                        { width: "4%", targets: 5 },
                        { width: "3%", targets: 6 },
                        { width: "3.5%", targets: 7 },
                        { width: "5%", targets: 8 },
                        { width: "3.5%", targets: 9 },
                        { width: "3%", targets: 10 },
                        { width: "5%", targets: 13 },
                        { width: "7%", targets: 14 },
                        { width: "6%", targets: 15 },
                        {
                            searchable: false,
                            orderable: false,
                            targets: 8,
                        },
                        { type: "pstring", targets: 1 },
                        {
                            orderable: false,
                            className: "select-checkbox",
                            targets: 8,
                        },

                        {
                            targets: 5,
                            createdCell: function(td, cellData, rowData, row, col) {
                                if (rowData.j != null) {
                                    if (rowData.j.length > 30) {
                                        $(td).attr("title", rowData.j);
                                    }
                                } else {
                                    return "-"
                                }

                            },
                        },
                    ],
                    order: [
                        [0, "desc"]
                    ],
                    processing: true,
                    ajax: {
                        url: endpoint2,
                        type: "GET",
                        dataSrc: function(json) {
                            hideLoaderScreen();
                            return json.data;
                        },
                        error: function(xhr, error, code) {
                            // console.log(xhr);
                            // console.log(code);
                        },
                    },
                    initComplete: function(settings, json) {
                        pendingCount = json.cnt;

                        $("body").find(".dataTables_scrollBody").addClass("scrollbar");
                        $("#example2_wrapper .dt-buttons")
                            .append(`<div class='parent-filter-new'>
      
              <div class='container'>
              <button onclick="pops1()" class="btn-increasedown">+</button>
              <div class="row mt-2">
              <div class="col-12 mb-2"><select  id="select-provincedown1" class="js-example-basic-multiple form-control-me stylescroll"></select></div>
              <div class="col-12 mb-2"><select id="select-citydown1" name="states[]" multiple="multiple" class="stylescroll js-example-basic-multiple-citys form-control"></select></div>
              <div class="col-12" >
              <div id="append-input-forFilterdown2" class="my-2 d-none">
                    <select id="select-provincedown2" class="js-example-basic-multiple form-control-me mb-2 stylescroll"></select>
                <select name="states[]" multiple="multiple" id="select-citydown2" class="js-example-basic-multiple-citys form-control"></select>
              </div>
              </div>
              <div class="col-12">
              <div id="append-input-forFilterdown3" class="my-2 d-none">
                     <select id="select-provincedown3"
                  class="js-example-basic-multiple form-control-me mb-2 stylescroll"></select>
                     <select name="states[]" multiple="multiple" id="select-citydown3"
                  class="js-example-basic-multiple-citys form-control"></select>
                 </div>
              </div>
      
          <div class="col-12 text-center"><button id="btn_filter_downshow" class="btn-set-filter px-2 py-1">فیلتر</button></div>
              </div>
              </div>
              </div>`);
                        $(".js-example-basic-multiple").append(
                            '<option   value="0">انتخاب اداره کل</option>'
                        );
                        $(".btn-increasedown").prop("disabled", true);
                        init_row_filterdown();
                        $("#select-provincedown1").on("change", function() {
                            init_data_filter1down();
                            $(".btn-increasedown").prop("disabled", false);
                        });
                        $("#select-provincedown2").on("change", function() {
                            init_data_filter2down();
                            $(".btn-increasedown").prop("disabled", false);
                        });
                        $("#select-provincedown3").on("change", function() {
                            init_data_filter3down();
                        });

                        $("#select-citydown1").select2({
                            dir: "rtl",
                            placeholder: "انتخاب شهرستان",
                            width: "resolve",
                        });
                        $("#select-citydown2").select2({
                            dir: "rtl",
                            placeholder: "انتخاب شهرستان",
                            width: "resolve",
                        });
                        $("#select-citydown3").select2({
                            dir: "rtl",
                            placeholder: "انتخاب شهرستان",
                            width: "resolve",
                        });

                        $("#select-citydown1").on("change", function() {
                            hold_Data_city1 = null;
                            city1_array = [];
                            city1_String = "";
                            city1_String_edited = "";
                            hold_Data_city1 = $("#select-citydown1").select2("data");
                        });
                        $("#select-citydown2").on("change", function() {
                            hold_Data_city2 = null;
                            city2_array = [];
                            city2_String = "";
                            city2_String_edited = "";
                            hold_Data_city2 = $("#select-citydown2").select2("data");
                        });
                        $("#select-citydown3").on("change", function() {
                            hold_Data_city3;
                            city3_array = [];
                            city3_String = "";
                            city3_String_edited = "";
                            hold_Data_city3 = $("#select-citydown3").select2("data");
                        });
                        $("#select-provincedown1").on("change", function() {
                            hold_Data_province1 = null;
                            hold_Data_province1 = $(
                                "#select-provincedown1 option:selected"
                            ).text();
                        });
                        $("#select-provincedown2").on("change", function() {
                            hold_Data_province2 = null;
                            hold_Data_province2 = $(
                                "#select-provincedown2 option:selected"
                            ).text();
                        });
                        $("#select-provincedown3").on("change", function() {
                            hold_Data_province3 = null;
                            hold_Data_province3 = $(
                                "#select-provincedown3 option:selected"
                            ).text();
                        });
                        $("#btn_filter_downshow").on("click", function() {
                            var test = "|";
                            var hold_Data_p1 = "";
                            var pooriapo;
                            if (
                                ($("#select-provincedown1").val() &&
                                    $("#select-provincedown1").val() != 0) ||
                                ($("#select-provincedown2").val() &&
                                    $("#select-provincedown2").val() != 0) ||
                                ($("#select-provincedown3").val() &&
                                    $("#select-provincedown3").val() != 0)
                            ) {
                                $("#example2")
                                    .DataTable()
                                    .column(1)
                                    .search(
                                        hold_Data_province1 +
                                        test +
                                        hold_Data_province2 +
                                        test +
                                        hold_Data_province3,
                                        true,
                                        false
                                    )
                                    .draw();
                            }

                            if (hold_Data_city1) {
                                for (let i = 0; i < hold_Data_city1.length; i++) {
                                    city1_array.push(hold_Data_city1[i].text.trim().concat("|"));
                                }
                            }
                            for (let i = 0; i < city1_array.length; i++) {
                                city1_String += city1_array[i];
                            }
                            if (city1_String[city1_String.length - 1] == "|") {
                                city1_String_edited = city1_String.slice(
                                    0,
                                    city1_String.length - 1
                                );
                            }

                            if (hold_Data_city2) {
                                for (let i = 0; i < hold_Data_city2.length; i++) {
                                    city2_array.push(hold_Data_city2[i].text.trim().concat("|"));
                                }
                            }
                            for (let i = 0; i < city2_array.length; i++) {
                                city2_String += city2_array[i];
                            }
                            if (city2_String[city2_String.length - 1] == "|") {
                                city2_String_edited = city2_String.slice(
                                    0,
                                    city2_String.length - 1
                                );
                            }

                            if (hold_Data_city3) {
                                for (let i = 0; i < hold_Data_city3.length; i++) {
                                    city3_array.push(hold_Data_city3[i].text.trim().concat("|"));
                                }
                            }
                            if (city3_array) {
                                for (let i = 0; i < city3_array.length; i++) {
                                    city3_String += city3_array[i];
                                }
                            }
                            if (city3_String[city3_String.length - 1] == "|") {
                                city3_String_edited = city3_String.slice(
                                    0,
                                    city3_String.length - 1
                                );
                            }

                            var farsamoner;
                            var farsamNum = 0;
                            if (city1_String_edited) {
                                farsamoner = city1_String_edited;
                                farsamNum++;
                            }
                            if (city2_String_edited) {
                                farsamNum != 0 ? (farsamoner += "|") : (farsamoner += "");
                                farsamoner += city2_String_edited;
                                farsamNum++;
                            }
                            if (city3_String_edited) {
                                farsamNum != 0 ? (farsamoner += "|") : (farsamoner += "");
                                farsamoner += city3_String_edited;
                            }
                            if (farsamoner) {
                                $("#example2")
                                    .DataTable()
                                    .column(2)
                                    .search(farsamoner, true, false)
                                    .draw();
                            }

                            $(".parent-filter").css("display", "none");
                        });
                    },
                    columns: [{
                            orderable: false,
                            className: "text-center",
                            data: null,
                            render: function(data, type, row) {
                                return data.a;
                            },
                        },
                        {
                            orderable: false,
                            className: "text-center",
                            data: "d",
                        },
                        {
                            orderable: false,
                            className: "text-center",
                            data: "f",
                        },
                        {
                            orderable: false,
                            className: "text-center",
                            data: "b",
                        },
                        {
                            orderable: false,
                            className: "text-center",
                            data: "i",
                        },
                        {
                            orderable: false,
                            className: "text-center",
                            data: null,
                            render: function(data, type, row) {
                                if (data.j.length > 30) {
                                    return data.j.substr(0, 30) + "...";
                                }

                                return data.j;
                            },
                        },
                        {
                            orderable: false,
                            className: "text-center",
                            data: null,
                            render: function(data, type, row) {
                                return (
                                    `<div id="loacleLoc${data.a}">
                <p class="text-center" style="display:none" alignment="center">(${parseFloat(
                  data.g
                ).toFixed(2)} , ${parseFloat(data.h).toFixed(2)})</p>
                <img class="firstImg" src="../dist/images/new-design/iranTemp.svg" onclick="showMapModalStatic(` +
                                    parseFloat(data.h).toFixed(2) +
                                    "," +
                                    parseFloat(data.g).toFixed(2) +
                                    `)">
               </div>`
                                );
                            },
                        },

                        {
                            orderable: false,
                            className: "text-center",
                            data: null,
                            render: function(data, type, row) {
                                return data.k;
                            },
                        },
                        {
                            orderable: false,
                            className: "text-center dir-ltr-cls",
                            data: null,
                            render: function(data, type, row) {
                                return (
                                    data.c.substring(0, data.c.indexOf("-")) +
                                    " و " +
                                    data.c.substring(data.c.indexOf("-") + 1)
                                );
                            },
                        },
                        {
                            orderable: false,
                            className: "text-right",
                            data: null,
                            render: function(data, type, row) {
                                if (data.l == 1) {
                                    return `<input id="rButD${data.a}" type="radio" checked value="1" name="rBut${data.a}" class="radioCl" disabled>
                  <label for="rButD${data.a}">انجام شد</label><br>
                  <input id="rButU${data.a}" type="radio" value="0" name="rBut${data.a}" class="radioCl" disabled>
                  <label for="rButU${data.a}">انجام نشد</label>
                  `;
                                } else if (data.l == 2) {
                                    return `<input id="rButD${data.a}" type="radio" value="1" name="rBut${data.a}" class="radioCl" disabled>
                <label for="rButD${data.a}">انجام شد</label><br>
                <input id="rButU${data.a}" type="radio" checked value="0" name="rBut${data.a}" class="radioCl" disabled>
                  <label for="rButU${data.a}">انجام نشد</label>
                `;
                                } else {
                                    return `<input id="rButD${data.a}" type="radio"  value="1" name="rBut${data.a}" class="radioCl">
                <label for="rButD${data.a}">انجام شد</label><br>
                <input id="rButU${data.a}" type="radio" value="0" name="rBut${data.a}" class="radioCl">
                  <label for="rButU${data.a}">انجام نشد</label>`;
                                }
                            },
                        },
                        {
                            orderable: false,
                            className: "location",
                            className: "text-center",
                            data: null,
                            render: function(data, type, row) {
                                if (data.m == null) {
                                    return `
                  <div id="parentButton${data.a}">
                  <img  src="../dist/images/new-design/iranTemp3.svg" >
                </div>`;
                                } else {
                                    return (
                                        `<div id="parentButton${data.a}">
                  <p  class="text-center" alignment="center" style="display:none">(${parseFloat(
                    data.m[1]
                  ).toFixed(2)} , ${parseFloat(data.m[0]).toFixed(2)})</p>
                <img class="secondImg" src="../dist/images/new-design/iranTemp2.svg" onclick="showMapModalStatic(` +
                                        parseFloat(data.m[0]).toFixed(2) +
                                        "," +
                                        parseFloat(data.m[1]).toFixed(2) +
                                        `)">
                </div>`
                                    );
                                }
                            },
                        },
                        {
                            orderable: false,
                            className: "text-center",
                            data: null,
                            render: function(data, type, row) {
                                let before1;
                                let before2;

                                let htmlElement;

                                data.p.forEach((element) => {
                                    if (element.includes("before-1")) {
                                        let file0 = element.slice(7);
                                        before1 =
                                            `<div style="padding:5px;" id="uploadImageDivA${data.a}" title="برای بزرگنمایی کلیک کنید"><img style="margin:5px" src="https://rms.rmto.ir/storage/${file0}" onclick="showImageModal('` +
                                            file0 +
                                            `',true)" class="zoom"></div>`;
                                    } else if (element.includes("before-2")) {
                                        let file1 = element.slice(7);
                                        before2 =
                                            `<div style="" id="uploadImageDivB${data.a}" 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}">
                  <img src="../dist/images/new-design/uploadButtonB.svg" style="cursor:not-allowed;">
                  </label>
                    <input type="file" disabled name="uploadBeforeA" id="uploadBeforeA${data.id}" style="display:none;" class="uploadButton">
                    </div>
                  `;
                                } else {
                                    htmlElement = before1;
                                }

                                return htmlElement;
                            },
                        },
                        {
                            orderable: false,
                            className: "text-center",
                            data: null,
                            render: function(data, type, row) {
                                let after1;
                                let afetr2;

                                let htmlElement;

                                data.p.forEach((element) => {
                                    if (element.includes("after-1")) {
                                        let file0 = element.slice(7);
                                        after1 =
                                            `<div id="uploadImageDivC${data.a}" title="برای بزرگنمایی کلیک کنید"><img style="margin:5px" src="https://rms.rmto.ir/storage/${file0}" onclick="showImageModal('` +
                                            file0 +
                                            `',true)" class="zoom"></div>`;
                                    } else if (element.includes("after-2")) {
                                        let file1 = element.slice(7);
                                        afetr2 =
                                            `<div style="display:inline-block;" id="uploadImageDivD${data.a}" 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.a}"  title="" style="position: relative;">
              <label class="fileBtn" for="uploadAfterrC${data.a}">
              <img src="../dist/images/new-design/uploadButtonB.svg" style="cursor:not-allowed;"></img>
              </label>
                <input type="file" disabled name="uploadAfterrC" id="uploadAfterrC${data.a}" style="display:none;" class="uploadButton">
      
                </div>`;
                                } else {
                                    htmlElement = after1;
                                }
                                return htmlElement;
                            },
                        },
                        {
                            className: "text-center",
                            data: null,
                            render: function(data, type, row) {
                                if (data.o == null) {
                                    return "";
                                }
                                return (
                                    data.o.substring(0, data.o.indexOf("-")) +
                                    " و " +
                                    data.o.substring(data.o.indexOf("-") + 1)
                                );
                            },
                        },
                        {
                            orderable: false,
                            className: "text-center",
                            data: null,
                            render: function(data, type, row) {
                                let disabled = "";

                                if (data.l > 0) {
                                    disabled = "disabled";
                                }
                                if (data.j == null) {
                                    return (
                                        `<textarea id="desBox${data.a}" class="descripBox" name="" placeholder="توضیحات " rows=""  cols="15" maxlength="250" ` +
                                        disabled +
                                        `></textarea> `
                                    );
                                }
                                return (
                                    `<textarea id="desBox${data.a}" class="descripBox" name="" placeholder="توضیحات " rows=""  cols="15" maxlength="250" ` +
                                    disabled +
                                    `>${data.j}</textarea> `
                                );
                            },
                        },
                        {
                            className: "text-center",
                            orderable: false,
                            className: "location",
                            data: null,
                            render: function(data, type, row) {
                                return (
                                    `
                <div  class="text-center" style="display: flex;justify-content: center;">
                  
      
                  <div style=" display: inline;padding: 0 5px 0 5px;">
                  <img class="previewClass" src="../dist/images/new-design/preview.svg"  onclick="window.open('/webapi/fast-reaction/` +
                                    data.a +
                                    `/preview/print')">
                  <div>پیش نمایش</div>
                  </div>
                  
                
                </div>`
                                );
                            },
                        },
                    ],
                    buttons: [{
                        text: '<div class="d-flex flex-column"><i class="fa mb-2 fa-book icon-color"></i> فیلترینگ پیشرفته</div>',
                        action: function(e, dt, node, config) {
                            if ($(".parent-filter-new").css("display") == "none") {
                                $(".parent-filter-new").css("display", "block");
                                showLoaderScreen();
                                setTimeout(() => {
                                    hideLoaderScreen();
                                }, 200);
                            } else if ($(".parent-filter-new").css("display") != "none") {
                                $(".parent-filter-new").css("display", "none");
                            }
                        },
                    }, ],
                });
            } else {
                hideLoaderScreen();
            }
        } else {
            $(".show-done")
                .addClass("show-done-unselected")
                .removeClass("show-done-selected");
            $(".whole-table2").css("display", "none");
        }
    });

    function init_row_filter() {
        $.ajax({
            url: "https://rms.rmto.ir/public/contents/provinces",
            type: "GET",
            success: function(data) {
                list_province = data.data;
                for (let index = 0; index < list_province.length; index++) {
                    $(".js-example-basic-multiple").append(
                        "\
                        <option value=" +
                        list_province[index].id +
                        ">" +
                        list_province[index].name_fa +
                        "</option>\
                        "
                    );
                    $("#select-province-excel-table").append(
                        "\
                        <option value=" +
                        list_province[index].id +
                        ">" +
                        list_province[index].name_fa +
                        "</option>\
                        "
                    );
                }
            },
        });
    }

    function init_data_filter1() {
        let hold_idSelect = $("#select-province1").val();
        $.ajax({
            url: "https://rms.rmto.ir/public/contents/provinces/" + hold_idSelect,
            type: "GET",
            success: function(data) {
                list_citys = data.data;
                $("#select-city1").html("");
                for (let index = 0; index < list_citys.length; index++) {
                    $("#select-city1").append(
                        "\
            <option value=" +
                        list_citys[index].id +
                        ">" +
                        list_citys[index].name_fa +
                        "</option>\
          "
                    );
                }
            },
        });
    }

    function init_data_filter2() {
        let hold_idSelect = $("#select-province2").val();
        $.ajax({
            url: "https://rms.rmto.ir/public/contents/provinces/" + hold_idSelect,
            type: "GET",
            success: function(data) {
                list_citys = data.data;
                $("#select-city2").html("");
                for (let index = 0; index < list_citys.length; index++) {
                    $("#select-city2").append(
                        "\
              <option value=" +
                        list_citys[index].id +
                        ">" +
                        list_citys[index].name_fa +
                        "</option>\
            "
                    );
                }
            },
        });
    }

    function init_data_filter3() {
        let hold_idSelect = $("#select-province3").val();
        $.ajax({
            url: "https://rms.rmto.ir/public/contents/provinces/" + hold_idSelect,
            type: "GET",
            success: function(data) {
                list_citys = data.data;
                $("#select-city3").empty("");
                for (let index = 0; index < list_citys.length; index++) {
                    $("#select-city3").append(
                        "\
              <option value=" +
                        list_citys[index].id +
                        ">" +
                        list_citys[index].name_fa +
                        "</option>\
            "
                    );
                }
            },
        });
    }

    function init_row_filterdown() {
        $.ajax({
            url: "https://rms.rmto.ir/public/contents/provinces",
            type: "GET",
            success: function(data) {
                list_province = data.data;
                for (let index = 0; index < list_province.length; index++) {
                    $(".js-example-basic-multiple").append(
                        "\
              <option value=" +
                        list_province[index].id +
                        ">" +
                        list_province[index].name_fa +
                        "</option>\
            "
                    );
                }
            },
        });
    }

    function init_data_filter1down() {
        let hold_idSelect = $("#select-provincedown1").val();
        $.ajax({
            url: "https://rms.rmto.ir/public/contents/provinces/" + hold_idSelect,
            type: "GET",
            success: function(data) {
                list_citys = data.data;
                $("#select-city1").html("");
                for (let index = 0; index < list_citys.length; index++) {
                    $("#select-city1").append(
                        "\
            <option value=" +
                        list_citys[index].id +
                        ">" +
                        list_citys[index].name_fa +
                        "</option>\
          "
                    );
                }
            },
        });
    }

    function init_data_filter2down() {
        let hold_idSelect = $("#select-provincedown2").val();
        $.ajax({
            url: "https://rms.rmto.ir/public/contents/provinces/" + hold_idSelect,
            type: "GET",
            success: function(data) {
                list_citys = data.data;
                $("#select-city2").html("");
                for (let index = 0; index < list_citys.length; index++) {
                    $("#select-city2").append(
                        "\
              <option value=" +
                        list_citys[index].id +
                        ">" +
                        list_citys[index].name_fa +
                        "</option>\
            "
                    );
                }
            },
        });
    }

    function init_data_filter3down() {
        let hold_idSelect = $("#select-provincedown3").val();
        $.ajax({
            url: "https://rms.rmto.ir/public/contents/provinces/" + hold_idSelect,
            type: "GET",
            success: function(data) {
                list_citys = data.data;
                $("#select-city3").empty("");
                for (let index = 0; index < list_citys.length; index++) {
                    $("#select-city3").append(
                        "\
              <option value=" +
                        list_citys[index].id +
                        ">" +
                        list_citys[index].name_fa +
                        "</option>\
            "
                    );
                }
            },
        });
    }
    //End pooria
    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 + 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") {
                $("#uploadImageDivA" + originID).empty();
                readURL(this, "uploadImageDivA", "BeforeA", originID);
                image1 = e.target;
            } else {
                $("#uploadImageDivB" + originID).empty();
                readURL(this, "uploadImageDivB", "BeforeB", originID);
                image2 = e.target;
            }
        } else {
            if (this.id.slice(12, 13) == "C") {
                $("#uploadImageDivC" + originID).empty();
                readURL(this, "uploadImageDivC", "AfterrC", originID);
                image3 = e.target;
            } else {
                $("#uploadImageDivD" + originID).empty();
                readURL(this, "uploadImageDivD", "AfterrD", originID);
                image4 = e.target;
            }
        }

        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", "");
            $("#uploadAfterrC" + this.id.substr(5)).prop("disabled", "");

            $("#uploadBeforeA" + this.id.substr(5))
                .parent()
                .children("label")
                .children("img")
                .css({ cursor: "pointer" });
            $("#uploadAfterrC" + this.id.substr(5))
                .parent()
                .children("label")
                .children("img")
                .css({ cursor: "pointer" });

            $("#uploadBeforeA" + this.id.substr(5))
                .parent()
                .children("label")
                .children("img")
                .attr("src", "../dist/images/new-design/uploadButtonB.svg");
            $("#uploadAfterrC" + this.id.substr(5))
                .parent()
                .children("label")
                .children("img")
                .attr("src", "../dist/images/new-design/uploadButtonB.svg");

            if (
                $("#parentButton" + this.id.substr(5)).children().length == 2 &&
                $("#uploadImageDivA" + this.id.substr(5)).children("img").length &&
                $("#uploadImageDivC" + 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("AfterC" + this.id.substr(5));

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

            $("#uploadBeforeA" + this.id.substr(5))
                .parent()
                .children("label")
                .children("img")
                .css({ cursor: "not-allowed" });
            $("#uploadAfterrC" + this.id.substr(5))
                .parent()
                .children("label")
                .children("img")
                .css({ cursor: "not-allowed" });

            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")) {
            $(this)
                .find(".firstImg")
                .attr("src", "../dist/images/new-design/iranTemp.svg");
            $(this)
                .find(".referClass")
                .attr("src", "../dist/images/new-design/refer.svg");
            $(this)
                .find(".previewClass")
                .attr("src", "../dist/images/new-design/preview.svg");
            $(this)
                .find(".submitClass")
                .attr("src", "../dist/images/new-design/submit.svg");
            $(this).css("color", "black");
            $(this).removeClass("selected");
        } else {
            table.$("tr.selected").removeClass("selected");
            $(this).addClass("selected");

            $("#example .firstImg").attr(
                "src",
                "../dist/images/new-design/iranTemp.svg"
            );
            $(this)
                .find(".firstImg")
                .attr("src", "../dist/images/new-design/iranTemp4.svg");

            $("#example .secondImg").attr(
                "src",
                "../dist/images/new-design/iranTemp2.svg"
            );
            $(this)
                .find(".secondImg")
                .attr("src", "../dist/images/new-design/iranTemp5.svg");

            $("#example .referClass").attr(
                "src",
                "../dist/images/new-design/refer.svg"
            );
            $("#example .previewClass").attr(
                "src",
                "../dist/images/new-design/preview.svg"
            );
            $("#example .submitClass").attr(
                "src",
                "../dist/images/new-design/submit.svg"
            );
            $(this)
                .find(".referClass")
                .attr("src", "../dist/images/new-design/referW.svg");
            $(this)
                .find(".previewClass")
                .attr("src", "../dist/images/new-design/previewW.svg");
            $(this)
                .find(".submitClass")
                .attr("src", "../dist/images/new-design/submitW.svg");
            $("#example tr").css("color", "black");
            $(this).css("color", "white");
        }
    });

    $("#example2").on("click", "tbody tr", function() {
        if ($(this).hasClass("selected")) {
            $(this)
                .find(".firstImg")
                .attr("src", "../dist/images/new-design/iranTemp.svg");
            $(this)
                .find(".referClass")
                .attr("src", "../dist/images/new-design/refer.svg");
            $(this)
                .find(".previewClass")
                .attr("src", "../dist/images/new-design/preview.svg");
            $(this)
                .find(".submitClass")
                .attr("src", "../dist/images/new-design/submit.svg");
            $(this).css("color", "black");
            $(this).removeClass("selected");
        } else {
            table2.$("tr.selected").removeClass("selected");
            $(this).addClass("selected");

            $("#example2 .firstImg").attr(
                "src",
                "../dist/images/new-design/iranTemp.svg"
            );
            $(this)
                .find(".firstImg")
                .attr("src", "../dist/images/new-design/iranTemp4.svg");

            $("#example2 .secondImg").attr(
                "src",
                "../dist/images/new-design/iranTemp2.svg"
            );
            $(this)
                .find(".secondImg")
                .attr("src", "../dist/images/new-design/iranTemp5.svg");

            $("#example2 .referClass").attr(
                "src",
                "../dist/images/new-design/refer.svg"
            );
            $("#example2 .previewClass").attr(
                "src",
                "../dist/images/new-design/preview.svg"
            );
            $("#example2 .submitClass").attr(
                "src",
                "../dist/images/new-design/submit.svg"
            );
            $(this)
                .find(".referClass")
                .attr("src", "../dist/images/new-design/referW.svg");
            $(this)
                .find(".previewClass")
                .attr("src", "../dist/images/new-design/previewW.svg");
            $(this)
                .find(".submitClass")
                .attr("src", "../dist/images/new-design/submitW.svg");
            $("#example2 tr").css("color", "black");
            $(this).css("color", "white");
        }
    });
});

function removeImage(id) {
    $("#uploadImageDiv" + id.substr(6)).empty();
    $("#uploadImageDiv" + id.substr(6))
        .append(`<label class="fileBtn" for="upload${id}">
    
    <img src="../dist/images/new-design/uploadButtonDB.svg" style="cursor:not-allowed;"></img>
    </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;
    }
}

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

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

        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");
    }
});

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) {
            showSpecificAbrarProject(result.data);
            mapCenterLat = result.province.center_lat;
            mapCenterLng = result.province.center_long;
        },
        error: function(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.688], 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);

    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");
        }
    });

    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");
        }
    });

    startAbrarMarker.on("drag", function() {
        $("#pin-marker-start").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());
        }
    });
}

function initialMarkerMapValue() {
    endAbrarMarker.remove();
    isSetEndAbrarMarker = false;
    map.setView([32.4279, 53.688], 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();
    }
);

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);
            }

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

        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() {
    $(".divloader").css("display", "flex").hide().fadeIn();
}

function hideLoaderScreen() {
    $(".divloader").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) {
    formData = new FormData();

    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,
            ]);
        }

        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 ($("#desBox" + id).val() != undefined) {
        formData.append("rms-description", $("#desBox" + id).val());
    }
    // console.log(formData.get("rms-description"));
    for (var pair of formData.entries()) {
        console.log(pair[0] + ", " + pair[1]);
    }
    Swal.fire({
        icon: "warning",
        title: "آیا مطمئن هستید؟",

        showCancelButton: true,
        confirmButtonColor: "#3085d6",
        cancelButtonColor: "#d33",
        confirmButtonText: "بله، تایید می‌شود",
        cancelButtonText: "منصرف شدم!",
        showLoaderOnConfirm: true,
        preConfirm: () => {
            showLoaderScreen();
            $.ajax({
                url: "https://rms.rmto.ir/webapi/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) {
                    table.ajax.reload(null, false);
                    setTimeout(() => {
                        hideLoaderScreen();
                    }, 200);
                },
                error: function(error) {
                    Swal.fire({
                        icon: "error",
                        title: "خطا",
                        text: "خطایی رخ داده است",
                        confirmButtonText: "بستن",
                    });
                },
            });
        },
    });
}

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

function ajaxcalltablefastReact() {
    $.ajax({
        url: endpoint,
        type: "GET",
        success: function(result) {
            $("#example2").dataTable().fnClearTable();
            $("#example2").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: 0.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: 0.6,
                                        weight: 5,
                                    }, ],
                                },
                            })
                            .on("routesfound", function(e) {
                                for (let index = 0; index < popupArraysPath.length; index++) {
                                    if (popupArraysPath[index] !== null) {
                                        map.removeLayer(popupArraysPath[index]);
                                    }
                                }
                            })
                            .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);
    }
}

$("#example").on("click", "img.referClass", function() {
    var tr = $(this).closest("tr");
    var row = table.row(tr);
    idProvince = row.data().e;
    idkolerja = row.data().a;
    $.ajax({
        url: "https://rms.rmto.ir/public/contents/provinces/" + idProvince,
        type: "GET",
        success: function(data) {
            list_citys = data.data;
            $("#citySelect").html("");
            for (let index = 0; index < list_citys.length; index++) {
                $("#citySelect").append(
                    "\
          <option value=" +
                    list_citys[index].id +
                    ">" +
                    list_citys[index].name_fa +
                    "</option>\
        "
                );
            }
        },
    });

    $("#referModal").modal("show");
});

$(".referSub").on("click", function() {
    formData = new FormData();

    formData.append("id", idkolerja);
    formData.append(
        "city_id",
        $("#citySelect").children("option:selected").val()
    );
    formData.append(
        "city_fa",
        $("#citySelect").children("option:selected").text()
    );
    for (var pair of formData.entries()) {
        console.log(pair[0] + ", " + pair[1]);
    }

    showLoaderScreen();
    $.ajax({
        url: "https://rms.rmto.ir/webapi/fast-reaction/fwd",
        type: "POST",
        headers: {
            "X-CSRF-TOKEN": $('meta[name="csrf-token"]').attr("content"),
        },
        data: formData,
        cache: false,
        contentType: false,
        processData: false,
        success: function(result) {
            hideLoaderScreen();
            $("#referModal").modal("hide");
            ajaxcalltablefastReaction(idkol);
        },
        error: function(error) {
            Swal.fire({
                icon: "error",
                title: "خطا",
                confirmButtonText: "بستن",
            });
        },
    });
});

function pops() {
    $(".btn-increase").prop("disabled", true);
    if ($("#select-province1").val() != 0) {
        $("#append-input-forFilter2").removeClass("d-none");
        $("#append-input-forFilter2")
            .parent()
            .css("border-top", "1px dashed orange");
    }
    if ($("#select-province2").val() != 0) {
        $("#append-input-forFilter3").removeClass("d-none");
        $("#append-input-forFilter3")
            .parent()
            .css("border-top", "1px dashed orange");
        $("#append-input-forFilter3")
            .parent()
            .css("border-bottom", "1px dashed orange");
    }
}

function pops1() {
    $(".btn-increasedown").prop("disabled", true);
    if ($("#select-provincedown1").val() != 0) {
        $("#append-input-forFilterdown2").removeClass("d-none");
        $("#append-input-forFilterdown2")
            .parent()
            .css("border-top", "1px dashed orange");
    }
    if ($("#select-province2").val() != 0) {
        $("#append-input-forFilterdown3").removeClass("d-none");
        $("#append-input-forFilterdown3")
            .parent()
            .css("border-top", "1px dashed orange");
        $("#append-input-forFilterdown3")
            .parent()
            .css("border-bottom", "1px dashed orange");
    }
}

function ajaxcalltable(idkol) {
    $.ajax({
        url: endpoint,
        type: "GET",
        success: function(result) {
            $("#example").dataTable().fnClearTable();
            $("#example").dataTable().fnAddData(result.data);
            hideLoaderScreen();
        },
    });
}

function unescapeSlashes(str) {
    // add another escaped slash if the string ends with an odd
    // number of escaped slashes which will crash JSON.parse
    let parsedStr = str.replace(/(^|[^\\])(\\\\)*\\$/, "$&\\");

    try {
        parsedStr = JSON.parse(`"${parsedStr}"`);
    } catch (e) {
        return str;
    }
    return parsedStr;
}
$.ajax({
    type: "GET",
    url: counts_api,
    success: function(json) {
        handledCount = json.data.handled;
        pendingCount = json.data.pending;
        $("#done").each(function() {
            var $this = $(this),
                countTo = $this.attr("data-count");

            $({ countNum: $this.text() }).animate({
                countNum: handledCount,
            }, {
                duration: 3000,
                easing: "linear",
                step: function() {
                    $this.text(Math.floor(this.countNum));
                },
                complete: function() {
                    $this.text(this.countNum);
                },
            });
        });

        $("#pending").each(function() {
            var $this = $(this),
                countTo = $this.attr("data-count");

            $({ countNum: $this.text() }).animate({
                countNum: pendingCount,
            }, {
                duration: 3000,
                easing: "linear",
                step: function() {
                    $this.text(Math.floor(this.countNum));
                },
                complete: function() {
                    $this.text(this.countNum);
                },
            });
        });
    },
});
$("#sort_test").on("click", function() {
    if ($("#datepickfrom").val() != " " && $("#datepickto").val() != " ") {
        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");
        showLoaderScreen();

        $.ajax({
            url: endpoint + "?end_date=" + endDate + "&start_date=" + startDate,
            type: "GET",
            success: function(result) {
                $("#exampleexcel").dataTable().fnClearTable();
                $("#exampleexcel").dataTable().fnAddData(result.data);
                hideLoaderScreen();
            },
        });
    }
});

$(document).on("click", "#btn_excel_download", function() {
            let currentDate = {};
            let queryParems = [];
            const route = $(this).data("table");
            console.log(route, "test");
            const province = $("#select-province-excel-table").val();

            if (province != 0) queryParems.push(`province=${province}`);
            else {
                Swal.fire({
                    icon: "error",
                    title: "خطا",
                    text: "لطفا استان برای دریافت فایل اکسل وارد کنید",
                    confirmButtonText: "بستن",
                });
                return false;
            }
            if (
                excelDatepickerFirstTable.from != "" &&
                excelDatepickerFirstTable.to != ""
            ) {
                currentDate.from = moment(
                    excelDatepickerFirstTable.from.getState().selected.year +
                    "/" +
                    excelDatepickerFirstTable.from.getState().selected.month +
                    "/" +
                    excelDatepickerFirstTable.from.getState().selected.date,
                    "jYYYY/jM/jD"
                ).format("YYYY-MM-DD");

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

                queryParems.push(`fromDate=${currentDate.from}`);
                queryParems.push(`toDate=${currentDate.to}`);
            } else {
                Swal.fire({
                    icon: "error",
                    title: "خطا",
                    text: "لطفا تاریخ مناسب برای دریافت فایل اکسل وارد کنید",
                    confirmButtonText: "بستن",
                });
                return false;
            }

            const url = `https://rms.rmto.ir/reports/${route}${
    queryParems.length != 0 ? `?${queryParems.join("&")}` : ""
  }`;
  console.log("url", url);

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