var idkol;
var bounds = [
  [46.9130026312, 77.6166317076],
  [17.5782370061, 32.5092252948],
];
var deleteImgStatus = [false, false, false, false, false];

var startAbrarMarker = null;
var isSetStartAbrarMarker = false;
var endAbrarMarker = null;
var isSetEndAbrarMarker = false;
var saveTotalDistance = null;
var routeControls = [];
var routeControlsPath = [];
var showsubitems = [];
var selectedItem = 0;
var previousSelectedItem = 0;
var selectedSubItems = "";
var subItemsData = {};
var submitFormInput = [];
var titlemodal = "";
var hasSubItemGotValue = true;
var projectType = 0;
var itemsData = null;
var requestId = null;
var rookeshError = false;
var showsubitems = [];
var popupArrays = [];
var popupArraysPath = [];
var item_checker;
var Subitem_checker;
var sub_item_data_checker;
var files_checker1;
var files_checker2;

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

function hideLoaderScreen() {
  $(".divloader").fadeOut();
}
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],
});
// Create leaflet map client
var map = L.map("map", {
  maxBounds: bounds,
  minZoom: 6,
}).setView([34.62, 52.471], 6);

// Create map tile layer
L.tileLayer("https://testmap.141.ir/141map/{z}/{x}/{y}.png", {}).addTo(map);

$(document).ready(function () {
  urlParams = new URLSearchParams(window.location.search);
  queryparams = window.location.search;
  idkol = urlParams.get("id");

  $.ajax({
    url: "/projects/road-items/" + idkol,
    type: "GET",
    cache: false,
    contentType: false,
    processData: false,
    success: function (result) {
      item_checker = result.data.item;
      Subitem_checker = result.data.sub_item;
      sub_item_data_checker = result.data.sub_item_data;
      files_checker1 = result.data.files[0].path;
      files_checker2 = result.data.files[1].path;
      getdataitem();
      showmarker(result.data);
      showcarditem(result.data);
    },
    error: function (error) {
      hideLoaderScreen();
      console.log(error);
    },
  });
});

function showmarker(res) {
  console.log("res", res);
  itemsData = res.data;
  sourceLat = res.start_lat;
  sourceLng = res.start_lng;

  destLat = res.end_lat;
  destLng = res.end_lng;
  startAbrarMarker = new L.marker(L.latLng(sourceLat, sourceLng), {
    icon: startAbrarDivIcon,
    draggable: true,
  }).addTo(map);
  endAbrarMarker = new L.marker(L.latLng(destLat, destLng), {
    icon: endAbrarDivIcon,
    draggable: true,
  }).addTo(map);

  isSetEndAbrarMarker = true;
  $("#pin-marker-start").removeClass("pin-move pin-warn").addClass("pin-set");

  isSetEndAbrarMarker = true;

  $("#pin-marker-end").removeClass("pin-move").addClass("pin-set");
  drawpathupdate();
  map.flyTo([sourceLat, sourceLng], 10);

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

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

      map.setView(markerLatLng);

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

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

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

    if ($(" #pin-marker-start").hasClass("pin-set") || isSetstartAbrarMarker) {
      $(" #pin-marker-start").addClass("pin-set");
      drawpathupdate();
    } else {
      map.setView(startAbrarMarker.getLatLng());
    }
  });

  endAbrarMarker.on("click", function () {
    if (!isSetendAbrarMarker) {
      endAbrarMarker.setLatLng(L.latLng(map.getCenter()));
      isSetendAbrarMarker = true;

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

      $(" input[name=abrar-project-latlng-end]").removeClass(
        "is-invalid-input"
      );

      drawpathupdate();
    }
  });

  endAbrarMarker.on("drag", function () {
    $(" #pin-marker-end").addClass("pin-move");
    drawpathupdate();
  });

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

    if ($(" #pin-marker-end").hasClass("pin-set") || isSetEndAbrarMarker) {
      $(" input[name=abrar-project-latlng-end]").val(
        endAbrarMarker.getLatLng().lat.toFixed(6) +
          endAbrarMarker.getLatLng().lng.toFixed(6)
      );
      $(" input[name=abrar-project-latlng-end]").removeClass(
        "is-invalid-input"
      );
      $("#pin-marker-end").addClass("pin-set");
      drawpathupdate();
    } else {
      map.setView(endAbrarMarker.getLatLng());
    }
  });
}
function drawpathupdate() {
  if (routeControls.length) {
    $(routeControls).each(function (index, control) {
      map.removeControl(control);
      routeControls.splice(routeControls.indexOf(index), 1);
    });
  }
  routeControls.push(
    L.Routing.control({
      waypoints: [
        L.latLng(
          parseFloat(startAbrarMarker.getLatLng().lat),
          parseFloat(startAbrarMarker.getLatLng().lng)
        ),
        L.latLng(
          parseFloat(endAbrarMarker.getLatLng().lat),
          parseFloat(endAbrarMarker.getLatLng().lng)
        ),
      ],
      fitSelectedRoutes: false,
      draggableWaypoints: true,
      createMarker: function () {
        return null;
      },
      lineOptions: {
        addWaypoints: false,
        styles: [
          {
            color: "#28a745",
            opacity: 0.8,
            weight: 5,
          },
        ],
      },
    })
      .on("routesfound", function (e) {
        var divideBy = 2;

        for (let index = 0; index < popupArrays.length; index++) {
          map.removeLayer(popupArrays[index]);
        }

        var customOptions = {
          maxWidth: "300",
          maxHeight: "150",
          className: "customRouteEstimate",
        };
        var popup = new L.Popup(customOptions);

        var popupLocation = new L.LatLng(
          e.routes[0].coordinates[
            parseInt(e.routes[0].coordinates.length / divideBy)
          ].lat,
          e.routes[0].coordinates[
            parseInt(e.routes[0].coordinates.length / divideBy)
          ].lng
        );

        var popupContent =
          '<span style="color:#FF5630; font-size:11px; font-family: IRANSansFaNum;">مسافت: </span>' +
          parseFloat(e.routes[0].summary.totalDistance / 1000.0).toFixed(2) +
          " کیلومتر";

        saveTotalDistance = parseFloat(
          parseFloat(e.routes[0].summary.totalDistance / 1000.0).toFixed(2)
        );

        popup.setLatLng(popupLocation);
        popup.setContent(popupContent);

        popupArrays.push(popup);
        map.addLayer(popup);

        //   showItemSelectionModal();
      })
      // .on("routesfound", function (e) {
      //   var divideBy = 2;

      //   for (let index = 0; index < popupArrays.length; index++) {
      //     map.removeLayer(popupArrays[index]);
      //   }

      //   var customOptions = {
      //     maxWidth: "300",
      //     maxHeight: "150",
      //     className: "customRouteEstimate",
      //   };
      //   var popup = new L.Popup(customOptions);

      //   var popupLocation = new L.LatLng(
      //     e.routes[0].coordinates[
      //       parseInt(e.routes[0].coordinates.length / divideBy)
      //     ].lat,
      //     e.routes[0].coordinates[
      //       parseInt(e.routes[0].coordinates.length / divideBy)
      //     ].lng
      //   );

      //   var popupContent =
      //     '<span style="color:#FF5630; font-size:11px; font-family: IRANSansFaNum;">مسافت: </span>' +
      //     parseFloat(e.routes[0].summary.totalDistance / 1000.0).toFixed(2) +
      //     " کیلومتر";

      //   saveTotalDistance = parseFloat(
      //     parseFloat(e.routes[0].summary.totalDistance / 1000.0).toFixed(2)
      //   );

      //   popup.setLatLng(popupLocation);
      //   popup.setContent(popupContent);

      //   popupArrays.push(popup);
      //   map.addLayer(popup);

      //   // showItemSelectionModal();
      // })
      .addTo(map)
  );
  $(".leaflet-control-container").css("display", "none");
  $(".leaflet-routing-container-hide").css("display", "none");
}
function showcarditem(res) {
  console.log("res", res);
  showheaderitem(res.item);
  showbodyitem(res.item, res.sub_items, res.sub_items_data);
  showphoto(res.files);
}

function showheaderitem(num) {
  var headername = "";
  switch (num) {
    case 1: {
      headername = "مرمت رویه";
      break;
    }
    case 2: {
      headername = "پاکسازی";

      break;
    }
    case 3: {
      headername = "علائم";

      break;
    }
    case 4: {
      headername = "حفاظ";

      break;
    }
    case 5: {
      headername = "روشنایی";

      break;
    }
    case 6: {
      headername = "خط کشی";

      break;
    }
    case 7: {
      headername = "رنگ آمیزی ";

      break;
    }
    case 8: {
      headername = "شستشو";

      break;
    }
    case 9: {
      headername = "ایمن سازی ";

      break;
    }
    case 10: {
      headername = "حریم";

      break;
    }
    case 11: {
      headername = "پل";

      break;
    }
    case 12: {
      headername = "تونل و گالری ";

      break;
    }
    case 13: {
      headername = "عملیات زمستانی ";

      break;
    }
    case 14: {
      headername = "ماشین آلات";

      break;
    }
    case 15: {
      headername = " راهدارخانه";

      break;
    }
    case 16: {
      headername = " موارد اضطراری";

      break;
    }
    case 20: {
      headername = " آیتم های بازدید و بازرسی و کنترل ";

      break;
    }
  }

  $(".showsubitems").append(
    "<p><b><span style='color: #FF5630'>* </span>فعالیت: </b>" +
      headername +
      "</p>"
  );
}

function showbodyitem(itemIndex, subItemIndex, subItemsData) {
  $(".showsubitems").append(
    "<p><b><span style='color: #FF5630'>* </span>ریزفعالیت: </b></p>"
  );

  let subItemsText = "";
  for (let index = 0; index < subItemIndex.length; index++) {
    switch (itemIndex) {
      case 1: {
        let keys = Object.keys(subItemsData);

        switch (subItemIndex[index]) {
          case "1": {
            subItemsText +=
              "<div style='font-size: 14px;'><b style='color: #FF5630'>-</b> ترمیم افتادگی لبه آسفالت: ";

            let selectedSubProject = keys.findIndex(function (key) {
              return key == "reconstruction1-1";
            });

            subItemsText +=
              "<span style='color: #FF5630'>(</span>" +
              subItemsData[keys[selectedSubProject]] +
              " کیلومتر" +
              "<span style='color: #FF5630'>)</span></div>";

            break;
          }
          case "2": {
            subItemsText +=
              "<div style='font-size: 14px;'><b style='color: #FF5630'>-</b> شانه سازی: ";

            let selectedSubProject = keys.findIndex(function (key) {
              return key == "reconstruction2-1";
            });

            subItemsText +=
              "<span style='color: #FF5630'>(</span>" +
              subItemsData[keys[selectedSubProject]] +
              " کیلومتر" +
              "<span style='color: #FF5630'>)</span></div>";

            break;
          }
          case "3": {
            subItemsText +=
              "<div style='font-size: 14px;'><b style='color: #FF5630'>-</b> پر کردن گودافتادگی یا چاله با آسفالت: ";

            let selectedSubProject = keys.findIndex(function (key) {
              return key == "reconstruction3-1";
            });

            subItemsText +=
              "<span style='color: #FF5630'>(</span>" +
              subItemsData[keys[selectedSubProject]] +
              " تن" +
              "<span style='color: #FF5630'>)</span></div>";

            break;
          }
          case "4": {
            subItemsText +=
              "<div style='font-size: 14px;'><b style='color: #FF5630'>-</b> لکه گیری هندسی راه: ";

            let selectedSubProject = keys.findIndex(function (key) {
              return key == "reconstruction4-1";
            });

            subItemsText +=
              "<span style='color: #FF5630'>(</span>" +
              subItemsData[keys[selectedSubProject]] +
              " مترمربع" +
              "<span style='color: #FF5630'>)</span></div>";

            break;
          }
          case "5": {
            subItemsText +=
              "<div style='font-size: 14px;'><b style='color: #FF5630'>-</b> مرمت آبشستگی راه ها و شانه راه ها: ";

            let selectedSubProject = keys.findIndex(function (key) {
              return key == "reconstruction5-1";
            });

            subItemsText +=
              "<span style='color: #FF5630'>(</span>" +
              subItemsData[keys[selectedSubProject]] +
              " مترمکعب" +
              "<span style='color: #FF5630'>)</span></div>";

            break;
          }
          case "6": {
            subItemsText +=
              "<div style='font-size: 14px;'><b style='color: #FF5630'>-</b> تنظیم سطح بستر حریم: ";

            let selectedSubProject = keys.findIndex(function (key) {
              return key == "reconstruction6-1";
            });

            subItemsText +=
              "<span style='color: #FF5630'>(</span>" +
              subItemsData[keys[selectedSubProject]] +
              " کیلومتر" +
              "<span style='color: #FF5630'>)</span></div>";

            break;
          }
          case "8": {
            subItemsText +=
              "<div style='font-size: 14px;'><b style='color: #FF5630'>-</b> درزگیری";

            let selectedSubProject = keys.findIndex(function (key) {
              return key == "reconstruction8-1";
            });

            subItemsText +=
              "<span style='color: #FF5630'>(</span>" +
              subItemsData[keys[selectedSubProject]] +
              " متر طول" +
              "<span style='color: #FF5630'>)</span></div>";

            break;
          }
          case "9": {
            subItemsText +=
              "<div style='font-size: 14px;'><b style='color: #FF5630'>-</b> مضرس کردن سطح راه ها";

            let selectedSubProject = keys.findIndex(function (key) {
              return key == "reconstruction9-1";
            });

            subItemsText +=
              "<span style='color: #FF5630'>(</span>" +
              subItemsData[keys[selectedSubProject]] +
              " متر مربع" +
              "<span style='color: #FF5630'>)</span></div>";

            break;
          }
          case "10": {
            subItemsText +=
              "<div style='font-size: 14px;'><b style='color: #FF5630'>-</b> تراش رویه های موج زده";

            let selectedSubProject = keys.findIndex(function (key) {
              return key == "reconstruction10-1";
            });

            subItemsText +=
              "<span style='color: #FF5630'>(</span>" +
              subItemsData[keys[selectedSubProject]] +
              " متر مربع" +
              "<span style='color: #FF5630'>)</span></div>";

            break;
          }
          case "11": {
            subItemsText +=
              "<div style='font-size: 14px;'><b style='color: #FF5630'>-</b>تیغ زنی راه های روستایی ";

            let selectedSubProject = keys.findIndex(function (key) {
              return key == "reconstruction11-1";
            });

            subItemsText +=
              "<span style='color: #FF5630'>(</span>" +
              subItemsData[keys[selectedSubProject]] +
              "  کیلومتر" +
              "<span style='color: #FF5630'>)</span></div>";

            break;
          }
          case "12": {
            subItemsText +=
              "<div style='font-size: 14px;'><b style='color: #FF5630'>-</b>شن ریزی ،تسطیح و کمپکت راه تیک";

            let selectedSubProject = keys.findIndex(function (key) {
              return key == "reconstruction12-1";
            });

            subItemsText +=
              "<span style='color: #FF5630'>(</span>" +
              subItemsData[keys[selectedSubProject]] +
              "  کیلومتر" +
              "<span style='color: #FF5630'>)</span></div>";

            break;
          }
          case "13": {
            subItemsText +=
              "<div style='font-size: 14px;'><b style='color: #FF5630'>-</b>عملیات تسطیح ،خاکبرداری و خاکریزی در رفوژ میانی";

            let selectedSubProject = keys.findIndex(function (key) {
              return key == "reconstruction13-1";
            });

            subItemsText +=
              "<span style='color: #FF5630'>(</span>" +
              subItemsData[keys[selectedSubProject]] +
              "  متر مکعب" +
              "<span style='color: #FF5630'>)</span></div>";

            break;
          }
        }
        break;
      }
      case 2: {
        let keys = Object.keys(subItemsData);

        switch (subItemIndex[index]) {
          case "1": {
            subItemsText +=
              "<div style='font-size: 14px;'><b style='color: #FF5630'>-</b> پاک سازی و جاروزنی سطح راه: ";

            let selectedSubProject = keys.findIndex(function (key) {
              return key == "cleaning1-1";
            });

            subItemsText +=
              "<span style='color: #FF5630'>(</span>" +
              subItemsData[keys[selectedSubProject]] +
              " کیلومتر-باند" +
              "<span style='color: #FF5630'>)</span></div>";

            break;
          }
          case "2": {
            subItemsText +=
              "<div style='font-size: 14px;'><b style='color: #FF5630'>-</b> پاک سازی و تنقیه آبروهای کوچک: ";

            let selectedSubProject = keys.findIndex(function (key) {
              return key == "cleaning2-1";
            });

            subItemsText +=
              "<span style='color: #FF5630'>(</span>" +
              subItemsData[keys[selectedSubProject]] +
              " مترمکعب" +
              "<span style='color: #FF5630'>)</span></div>";

            break;
          }
          case "3": {
            subItemsText +=
              "<div style='font-size: 14px;'><b style='color: #FF5630'>-</b> پاک سازی سطح راه از لاشه حیوانات: ";

            let selectedSubProject = keys.findIndex(function (key) {
              return key == "cleaning3-1";
            });

            subItemsText +=
              "<span style='color: #FF5630'>(</span>" +
              subItemsData[keys[selectedSubProject]] +
              " عدد" +
              "<span style='color: #FF5630'>)</span></div>";

            break;
          }
          case "4": {
            subItemsText +=
              "<div style='font-size: 14px;'><b style='color: #FF5630'>-</b> پاک سازی قنوها و آبروهای طولی: ";

            let selectedSubProject = keys.findIndex(function (key) {
              return key == "cleaning4-1";
            });

            subItemsText +=
              "<span style='color: #FF5630'>(</span>" +
              subItemsData[keys[selectedSubProject]] +
              " کیلومتر" +
              "<span style='color: #FF5630'>)</span></div>";

            break;
          }
          case "5": {
            subItemsText +=
              "<div style='font-size: 14px;'><b style='color: #FF5630'>-</b> پاک سازی سطح راه از آثار تصادفات: ";

            let selectedSubProject = keys.findIndex(function (key) {
              return key == "cleaning5-1";
            });

            subItemsText +=
              "<span style='color: #FF5630'>(</span>" +
              subItemsData[keys[selectedSubProject]] +
              " مترطول-باند" +
              "<span style='color: #FF5630'>)</span></div>";

            break;
          }
          case "6": {
            subItemsText +=
              "<div style='font-size: 14px;'><b style='color: #FF5630'>-</b> علف کنی و بوته کنی: ";

            let selectedSubProject = keys.findIndex(function (key) {
              return key == "cleaning6-1";
            });

            subItemsText +=
              "<span style='color: #FF5630'>(</span>" +
              subItemsData[keys[selectedSubProject]] +
              " کیلومتر" +
              "<span style='color: #FF5630'>)</span></div>";

            break;
          }
          case "7": {
            subItemsText +=
              "<div style='font-size: 14px;'><b style='color: #FF5630'>-</b> پاک سازی حریم راه از مواد زائد و نخاله های ساختمانی: ";

            let selectedSubProject = keys.findIndex(function (key) {
              return key == "cleaning7-1";
            });

            subItemsText +=
              "<span style='color: #FF5630'>(</span>" +
              subItemsData[keys[selectedSubProject]] +
              " کیلومتر" +
              "<span style='color: #FF5630'>)</span></div>";

            break;
          }
          case "8": {
            subItemsText +=
              "<div style='font-size: 14px;'><b style='color: #FF5630'>-</b> جمع آوری قطعات آسیب دیده حفاظ، علائم و ...: ";

            let selectedSubProject = keys.findIndex(function (key) {
              return key == "cleaning8-1";
            });

            subItemsText +=
              "<span style='color: #FF5630'>(</span>" +
              subItemsData[keys[selectedSubProject]] +
              " تن" +
              "<span style='color: #FF5630'>)</span></div>";

            break;
          }
          case "9": {
            subItemsText +=
              "<div style='font-size: 14px;'><b style='color: #FF5630'>-</b> پاکسازی پارکینگ راه ها";

            let selectedSubProject = keys.findIndex(function (key) {
              return key == "cleaning9-1";
            });

            subItemsText +=
              "<span style='color: #FF5630'>(</span>" +
              subItemsData[keys[selectedSubProject]] +
              " متر مربع" +
              "<span style='color: #FF5630'>)</span></div>";

            break;
          }
          case "10": {
            subItemsText +=
              "<div style='font-size: 14px;'><b style='color: #FF5630'>-</b>پاکسازی کنار قرنیز پلها ،دیواره تونل ها ، جداول و نیوجرسی از مصالح انباشته شده";

            let selectedSubProject = keys.findIndex(function (key) {
              return key == "cleaning10-1";
            });

            subItemsText +=
              "<span style='color: #FF5630'>(</span>" +
              subItemsData[keys[selectedSubProject]] +
              " متر مکعب" +
              "<span style='color: #FF5630'>)</span></div>";

            break;
          }
          case "11": {
            subItemsText +=
              "<div style='font-size: 14px;'><b style='color: #FF5630'>-</b>پاکسازی و تمیز کاری جزیره های میانی";

            let selectedSubProject = keys.findIndex(function (key) {
              return key == "cleaning11-1";
            });

            subItemsText +=
              "<span style='color: #FF5630'>(</span>" +
              subItemsData[keys[selectedSubProject]] +
              " متر مربع" +
              "<span style='color: #FF5630'>)</span></div>";

            break;
          }
          case "12": {
            subItemsText +=
              "<div style='font-size: 14px;'><b style='color: #FF5630'>-</b>پاکسازی و تنقیه داخل پل ها";

            let selectedSubProject = keys.findIndex(function (key) {
              return key == "cleaning12-1";
            });

            subItemsText +=
              "<span style='color: #FF5630'>(</span>" +
              subItemsData[keys[selectedSubProject]] +
              " متر مربع" +
              "<span style='color: #FF5630'>)</span></div>";

            break;
          }
          case "13": {
            subItemsText +=
              "<div style='font-size: 14px;'><b style='color: #FF5630'>-</b>پاکسازی و تنقیه سیفون ها";

            let selectedSubProject = keys.findIndex(function (key) {
              return key == "cleaning13-1";
            });

            subItemsText +=
              "<span style='color: #FF5630'>(</span>" +
              subItemsData[keys[selectedSubProject]] +
              "  متر مکعب" +
              "<span style='color: #FF5630'>)</span></div>";

            break;
          }
          case "14": {
            subItemsText +=
              "<div style='font-size: 14px;'><b style='color: #FF5630'>-</b>پاکسازی و جمع آوری شاخه درختان از دهانه آبنماهای لوله ای";

            let selectedSubProject = keys.findIndex(function (key) {
              return key == "cleaning14-1";
            });

            subItemsText +=
              "<span style='color: #FF5630'>(</span>" +
              subItemsData[keys[selectedSubProject]] +
              "  نفر ساعت " +
              "<span style='color: #FF5630'>)</span></div>";

            break;
          }
          case "15": {
            subItemsText +=
              "<div style='font-size: 14px;'><b style='color: #FF5630'>-</b>پاکسازی سطح راه از مواد نفتی یا روغنی";

            let selectedSubProject = keys.findIndex(function (key) {
              return key == "cleaning15-1";
            });

            subItemsText +=
              "<span style='color: #FF5630'>(</span>" +
              subItemsData[keys[selectedSubProject]] +
              "   مترطول-باند " +
              "<span style='color: #FF5630'>)</span></div>";

            break;
          }
          case "16": {
            subItemsText +=
              "<div style='font-size: 14px;'><b style='color: #FF5630'>-</b>علف کنی و بوته کنی بصورت دستی اطراف تابلو ، علائم ،...";

            let selectedSubProject = keys.findIndex(function (key) {
              return key == "cleaning16-1";
            });

            subItemsText +=
              "<span style='color: #FF5630'>(</span>" +
              subItemsData[keys[selectedSubProject]] +
              "   متر مربع " +
              "<span style='color: #FF5630'>)</span></div>";

            break;
          }
          case "17": {
            subItemsText +=
              "<div style='font-size: 14px;'><b style='color: #FF5630'>-</b>ریزش برداری";

            let selectedSubProject = keys.findIndex(function (key) {
              return key == "cleaning17-1";
            });

            subItemsText +=
              "<span style='color: #FF5630'>(</span>" +
              subItemsData[keys[selectedSubProject]] +
              "  مقطع " +
              "<span style='color: #FF5630'>)</span></div>";

            break;
          }
          case "18": {
            subItemsText +=
              "<div style='font-size: 14px;'><b style='color: #FF5630'>-</b>جمع آوری خرده سنگهای ریزشی";

            let selectedSubProject = keys.findIndex(function (key) {
              return key == "cleaning18-1";
            });

            subItemsText +=
              "<span style='color: #FF5630'>(</span>" +
              subItemsData[keys[selectedSubProject]] +
              "  نفر-ساعت " +
              "<span style='color: #FF5630'>)</span></div>";

            break;
          }
          case "19": {
            subItemsText +=
              "<div style='font-size: 14px;'><b style='color: #FF5630'>-</b> لایروبی ";

            let selectedSubProject = keys.findIndex(function (key) {
              return key == "cleaning19-1";
            });

            subItemsText +=
              "<span style='color: #FF5630'>(</span>" +
              subItemsData[keys[selectedSubProject]] +
              " متر مکعب " +
              "<span style='color: #FF5630'>)</span></div>";

            break;
          }
        }
        break;
      }
      case 3: {
        let keys = Object.keys(subItemsData);

        switch (subItemIndex[index]) {
          case "1": {
            subItemsText +=
              "<div style='font-size: 14px;'><b style='color: #FF5630'>-</b> نصب تابلوهای اخطاری ، انتظامی و مسیرنمای جدید: ";

            let selectedSubProject = keys.findIndex(function (key) {
              return key == "signs1-1";
            });

            subItemsText +=
              "<span style='color: #FF5630'>(</span>" +
              subItemsData[keys[selectedSubProject]] +
              " عدد" +
              "<span style='color: #FF5630'>)</span></div>";

            break;
          }
          case "2": {
            subItemsText +=
              "<div style='font-size: 14px;'><b style='color: #FF5630'>-</b>نصب تابلو های اطلاعاتی جدید: ";

            let selectedSubProject = keys.findIndex(function (key) {
              return key == "signs2-1";
            });

            subItemsText +=
              "<span style='color: #FF5630'>(</span>" +
              subItemsData[keys[selectedSubProject]] +
              " مترمربع" +
              "<span style='color: #FF5630'>)</span></div>";

            break;
          }
          case "3": {
            subItemsText +=
              "<div style='font-size: 14px;'><b style='color: #FF5630'>-</b> تعویض شبرنگ تابلوهای اطلاعاتی: ";

            let selectedSubProject = keys.findIndex(function (key) {
              return key == "signs3-1";
            });

            subItemsText +=
              "<span style='color: #FF5630'>(</span>" +
              subItemsData[keys[selectedSubProject]] +
              " مترمربع" +
              "<span style='color: #FF5630'>)</span></div>";

            break;
          }
          case "4": {
            subItemsText +=
              "<div style='font-size: 14px;'><b style='color: #FF5630'>-</b> نصب بازتاب بر روی گاردریل و حفاظ های حاشیه راه و چشم گربه ای: ";

            let selectedSubProject = keys.findIndex(function (key) {
              return key == "signs4-1";
            });

            subItemsText +=
              "<span style='color: #FF5630'>(</span>" +
              subItemsData[keys[selectedSubProject]] +
              " عدد" +
              "<span style='color: #FF5630'>)</span></div>";

            break;
          }
          case "5": {
            subItemsText +=
              "<div style='font-size: 14px;'><b style='color: #FF5630'>-</b> تعویض صفحه های تابلوهای اخطاری ، انتظامی فاقد بازتاب و معیوب: ";

            let selectedSubProject = keys.findIndex(function (key) {
              return key == "signs5-1";
            });

            subItemsText +=
              "<span style='color: #FF5630'>(</span>" +
              subItemsData[keys[selectedSubProject]] +
              " عدد" +
              "<span style='color: #FF5630'>)</span></div>";

            break;
          }
          case "6": {
            subItemsText +=
              "<div style='font-size: 14px;'><b style='color: #FF5630'>-</b> مرمت شکستگی ، خم شدگی و ... تابلوهای اطلاعاتی: ";

            let selectedSubProject = keys.findIndex(function (key) {
              return key == "signs6-1";
            });

            subItemsText +=
              "<span style='color: #FF5630'>(</span>" +
              subItemsData[keys[selectedSubProject]] +
              " متر مربع" +
              "<span style='color: #FF5630'>)</span></div>";

            break;
          }
          case "7": {
            subItemsText +=
              "<div style='font-size: 14px;'><b style='color: #FF5630'>-</b> اصلاح کج شدگی پایه تابلوها و علائم: ";

            let selectedSubProject = keys.findIndex(function (key) {
              return key == "signs7-1";
            });

            subItemsText +=
              "<span style='color: #FF5630'>(</span>" +
              subItemsData[keys[selectedSubProject]] +
              " عدد " +
              "<span style='color: #FF5630'>)</span></div>";

            break;
          }
          case "8": {
            subItemsText +=
              "<div style='font-size: 14px;'><b style='color: #FF5630'>-</b> نصب یا برداشتن علائم موقت: ";

            let selectedSubProject = keys.findIndex(function (key) {
              return key == "signs8-1";
            });

            subItemsText +=
              "<span style='color: #FF5630'>(</span>" +
              subItemsData[keys[selectedSubProject]] +
              " عدد " +
              "<span style='color: #FF5630'>)</span></div>";

            break;
          }
          case "9": {
            subItemsText +=
              "<div style='font-size: 14px;'><b style='color: #FF5630'>-</b> اصلاح شیب شیروانی: ";

            let selectedSubProject = keys.findIndex(function (key) {
              return key == "signs9-1";
            });

            subItemsText +=
              "<span style='color: #FF5630'>(</span>" +
              subItemsData[keys[selectedSubProject]] +
              " کیلومتر " +
              "<span style='color: #FF5630'>)</span></div>";

            break;
          }
        }
        break;
      }
      case 4: {
        let keys = Object.keys(subItemsData);
        // console.log(keys);
        switch (subItemIndex[index]) {
          case "1": {
            subItemsText +=
              "<div style='font-size: 14px;'><b style='color: #FF5630'>-</b> ارتقای حفاظ موجود میانی راه ها با حفاظ های مرسوم یا سایر روش ها: ";

            let selectedSubProject = keys.findIndex(function (key) {
              return key == "shield1-2-1";
            });

            subItemsText +=
              "<span style='color: #FF5630'>(</span>" +
              subItemsData[keys[selectedSubProject]] +
              " متر طول " +
              "<span style='color: #FF5630'>)</span></div>";

            break;
          }
          case "2": {
            subItemsText +=
              "<div style='font-size: 14px;'><b style='color: #FF5630'>-</b>ارتقای حفاظ موجود پل ها و پرتگاه ها با حفاظ های مرسوم یا سایر روش ها : ";

            let selectedSubProject = keys.findIndex(function (key) {
              return key == "shield2-2-1";
            });

            subItemsText +=
              "<span style='color: #FF5630'>(</span>" +
              subItemsData[keys[selectedSubProject]] +
              " متر طول " +
              "<span style='color: #FF5630'>)</span></div>";

            break;
          }
          case "3": {
            subItemsText +=
              "<div style='font-size: 14px;'><b style='color: #FF5630'>-</b>بهسازی حفاظ های موجود و آسیب دیده : ";

            let selectedSubProject = keys.findIndex(function (key) {
              return key == "shield3-2-1";
            });

            subItemsText +=
              "<span style='color: #FF5630'>(</span>" +
              subItemsData[keys[selectedSubProject]] +
              " متر طول " +
              "<span style='color: #FF5630'>)</span></div>";

            break;
          }
        }
        break;
      }
      case 5: {
        let keys = Object.keys(subItemsData);

        switch (subItemIndex[index]) {
          case "1": {
            subItemsText +=
              "<div style='font-size: 14px;'><b style='color: #FF5630'>-</b>نگهداری و پاکسازی روشنایی طولی راه : ";

            let selectedSubProject = keys.findIndex(function (key) {
              return key == "lighting1-2-1";
            });

            subItemsText +=
              "<span style='color: #FF5630'>(</span>" +
              subItemsData[keys[selectedSubProject]] +
              " متر طول " +
              "<span style='color: #FF5630'>)</span></div>";

            break;
          }
          case "2": {
            subItemsText +=
              "<div style='font-size: 14px;'><b style='color: #FF5630'>-</b>نگهداری و پاکسازی روشنایی نقطه ای در حاشیه راه: ";

            let selectedSubProject = keys.findIndex(function (key) {
              return key == "lighting2-2-1";
            });

            subItemsText +=
              "<span style='color: #FF5630'>(</span>" +
              subItemsData[keys[selectedSubProject]] +
              "  عدد " +
              "<span style='color: #FF5630'>)</span></div>";

            break;
          }
          case "3": {
            subItemsText +=
              "<div style='font-size: 14px;'><b style='color: #FF5630'>-</b>نگهداری و پاکسازی روشنایی نقطه ای تقاطع در حاشیه راه: ";

            let selectedSubProject = keys.findIndex(function (key) {
              return key == "lighting3-2-1";
            });

            subItemsText +=
              "<span style='color: #FF5630'>(</span>" +
              subItemsData[keys[selectedSubProject]] +
              "  مورد " +
              "<span style='color: #FF5630'>)</span></div>";

            break;
          }
          case "4": {
            subItemsText +=
              "<div style='font-size: 14px;'><b style='color: #FF5630'>-</b>نگهداری و پاکسازی روشنایی نقطه ای محل نصب دوربین در حاشیه راه: ";

            let selectedSubProject = keys.findIndex(function (key) {
              return key == "lighting4-2-1";
            });

            subItemsText +=
              "<span style='color: #FF5630'>(</span>" +
              subItemsData[keys[selectedSubProject]] +
              "  مورد " +
              "<span style='color: #FF5630'>)</span></div>";

            break;
          }
          case "5": {
            subItemsText +=
              "<div style='font-size: 14px;'><b style='color: #FF5630'>-</b>نگهداری و پاکسازی روشنایی طولی نواحی یا گردنه های مه گیر: ";

            let selectedSubProject = keys.findIndex(function (key) {
              return key == "lighting5-2-1";
            });

            subItemsText +=
              "<span style='color: #FF5630'>(</span>" +
              subItemsData[keys[selectedSubProject]] +
              "  متر طول " +
              "<span style='color: #FF5630'>)</span></div>";

            break;
          }
          case "6": {
            subItemsText +=
              "<div style='font-size: 14px;'><b style='color: #FF5630'>-</b>نگهداری و پاکسازی روشنایی تونل: ";

            let selectedSubProject = keys.findIndex(function (key) {
              return key == "lighting6-2-1";
            });

            subItemsText +=
              "<span style='color: #FF5630'>(</span>" +
              subItemsData[keys[selectedSubProject]] +
              "  متر طول " +
              "<span style='color: #FF5630'>)</span></div>";

            break;
          }
          case "7": {
            subItemsText +=
              "<div style='font-size: 14px;'><b style='color: #FF5630'>-</b>تعمیرات شبکه روشنایی (کابل): ";

            let selectedSubProject = keys.findIndex(function (key) {
              return key == "lighting7-2-1";
            });

            subItemsText +=
              "<span style='color: #FF5630'>(</span>" +
              subItemsData[keys[selectedSubProject]] +
              "  متر طول " +
              "<span style='color: #FF5630'>)</span></div>";

            break;
          }

          case "8": {
            subItemsText +=
              "<div style='font-size: 14px;'><b style='color: #FF5630'>-</b>تعمیرات شبکه روشنایی (کله چراغ): ";

            let selectedSubProject = keys.findIndex(function (key) {
              return key == "lighting8-2-1";
            });

            subItemsText +=
              "<span style='color: #FF5630'>(</span>" +
              subItemsData[keys[selectedSubProject]] +
              "   عدد " +
              "<span style='color: #FF5630'>)</span></div>";

            break;
          }
          case "9": {
            subItemsText +=
              "<div style='font-size: 14px;'><b style='color: #FF5630'>-</b>تعمیرات شبکه روشنایی (مفصل زنی ): ";

            let selectedSubProject = keys.findIndex(function (key) {
              return key == "lighting9-2-1";
            });

            subItemsText +=
              "<span style='color: #FF5630'>(</span>" +
              subItemsData[keys[selectedSubProject]] +
              "   عدد " +
              "<span style='color: #FF5630'>)</span></div>";

            break;
          }
          case "10": {
            subItemsText +=
              "<div style='font-size: 14px;'><b style='color: #FF5630'>-</b>تعمیرات شبکه روشنایی (تعمیر تابلو ): ";

            let selectedSubProject = keys.findIndex(function (key) {
              return key == "lighting10-2-1";
            });

            subItemsText +=
              "<span style='color: #FF5630'>(</span>" +
              subItemsData[keys[selectedSubProject]] +
              "   عدد " +
              "<span style='color: #FF5630'>)</span></div>";

            break;
          }
          case "11": {
            subItemsText +=
              "<div style='font-size: 14px;'><b style='color: #FF5630'>-</b>تعمیرات برج نوری: ";

            let selectedSubProject = keys.findIndex(function (key) {
              return key == "lighting11-2-1";
            });

            subItemsText +=
              "<span style='color: #FF5630'>(</span>" +
              subItemsData[keys[selectedSubProject]] +
              "   عدد " +
              "<span style='color: #FF5630'>)</span></div>";

            break;
          }
        }
        break;
      }
      case 6: {
        let keys = Object.keys(subItemsData);

        switch (subItemIndex[index]) {
          case "1": {
            subItemsText +=
              "<div style='font-size: 14px;'><b style='color: #FF5630'>-</b> خط کشی با رنگ گرم ترافیکی: ";

            let selectedSubProject = keys.findIndex(function (key) {
              return key == "lining1-1";
            });

            subItemsText +=
              "<span style='color: #FF5630'>(</span>" +
              subItemsData[keys[selectedSubProject]] +
              " کیلومتر-رنگ" +
              "<span style='color: #FF5630'>)</span></div>";

            break;
          }
          case "2": {
            subItemsText +=
              "<div style='font-size: 14px;'><b style='color: #FF5630'>-</b> خط کشی با رنگ سرد ترافیکی: ";

            let selectedSubProject = keys.findIndex(function (key) {
              return key == "lining2-1";
            });

            subItemsText +=
              "<span style='color: #FF5630'>(</span>" +
              subItemsData[keys[selectedSubProject]] +
              " کیلومتر-رنگ" +
              "<span style='color: #FF5630'>)</span></div>";

            break;
          }
          case "3": {
            subItemsText +=
              "<div style='font-size: 14px;'><b style='color: #FF5630'>-</b> ترسیم نقوش، فلش، خط نوشته و ...: ";

            let selectedSubProject = keys.findIndex(function (key) {
              return key == "lining3-1";
            });

            subItemsText +=
              "<span style='color: #FF5630'>(</span>" +
              subItemsData[keys[selectedSubProject]] +
              " مترمربع" +
              "<span style='color: #FF5630'>)</span></div>";

            break;
          }
          case "4": {
            subItemsText +=
              "<div style='font-size: 14px;'><b style='color: #FF5630'>-</b> اجرای اکستروژن طولی ";

            let selectedSubProject = keys.findIndex(function (key) {
              return key == "lining4-1";
            });

            subItemsText +=
              "<span style='color: #FF5630'>(</span>" +
              subItemsData[keys[selectedSubProject]] +
              " کیلومتر" +
              "<span style='color: #FF5630'>)</span></div>";

            break;
          }
          case "5": {
            subItemsText +=
              "<div style='font-size: 14px;'><b style='color: #FF5630'>-</b> اجرای اکستروژن عرضی ";

            let selectedSubProject = keys.findIndex(function (key) {
              return key == "lining5-1";
            });

            subItemsText +=
              "<span style='color: #FF5630'>(</span>" +
              subItemsData[keys[selectedSubProject]] +
              " متر مربع" +
              "<span style='color: #FF5630'>)</span></div>";

            break;
          }
          case "6": {
            subItemsText +=
              "<div style='font-size: 14px;'><b style='color: #FF5630'>-</b> پاک کردن خطوط ترافیکی از سطح راه ";

            let selectedSubProject = keys.findIndex(function (key) {
              return key == "lining6-1";
            });

            subItemsText +=
              "<span style='color: #FF5630'>(</span>" +
              subItemsData[keys[selectedSubProject]] +
              " متر مربع" +
              "<span style='color: #FF5630'>)</span></div>";

            break;
          }
        }
        break;
      }
      case 7: {
        let keys = Object.keys(subItemsData);

        switch (subItemIndex[index]) {
          case "1": {
            subItemsText +=
              "<div style='font-size: 14px;'><b style='color: #FF5630'>-</b> رنگ آمیزی پایه تابلوها: ";

            let selectedSubProject = keys.findIndex(function (key) {
              return key == "coloring1-1";
            });

            subItemsText +=
              "<span style='color: #FF5630'>(</span>" +
              subItemsData[keys[selectedSubProject]] +
              " عدد" +
              "<span style='color: #FF5630'>)</span></div>";

            break;
          }
          case "2": {
            subItemsText +=
              "<div style='font-size: 14px;'><b style='color: #FF5630'>-</b> رنگ آمیزی پایه چراغ ها: ";

            let selectedSubProject = keys.findIndex(function (key) {
              return key == "coloring2-1";
            });

            subItemsText +=
              "<span style='color: #FF5630'>(</span>" +
              subItemsData[keys[selectedSubProject]] +
              " عدد" +
              "<span style='color: #FF5630'>)</span></div>";

            break;
          }
          case "3": {
            subItemsText +=
              "<div style='font-size: 14px;'><b style='color: #FF5630'>-</b> رنگ آمیزی پایه های روشنایی: ";

            let selectedSubProject = keys.findIndex(function (key) {
              return key == "coloring3-1";
            });

            subItemsText +=
              "<span style='color: #FF5630'>(</span>" +
              subItemsData[keys[selectedSubProject]] +
              " اصله" +
              "<span style='color: #FF5630'>)</span></div>";

            break;
          }
          case "4": {
            subItemsText +=
              "<div style='font-size: 14px;'><b style='color: #FF5630'>-</b> رنگ آمیزی پل های عابر پیاده: ";

            let selectedSubProject = keys.findIndex(function (key) {
              return key == "coloring4-1";
            });

            subItemsText +=
              "<span style='color: #FF5630'>(</span>" +
              subItemsData[keys[selectedSubProject]] +
              " دستگاه" +
              "<span style='color: #FF5630'>)</span></div>";

            break;
          }
          case "5": {
            subItemsText +=
              "<div style='font-size: 14px;'><b style='color: #FF5630'>-</b> رنگ آمیزی پایه تابلوهای دروازه ای: ";

            let selectedSubProject = keys.findIndex(function (key) {
              return key == "coloring5-1";
            });

            subItemsText +=
              "<span style='color: #FF5630'>(</span>" +
              subItemsData[keys[selectedSubProject]] +
              " عدد" +
              "<span style='color: #FF5630'>)</span></div>";

            break;
          }
          case "6": {
            subItemsText +=
              "<div style='font-size: 14px;'><b style='color: #FF5630'>-</b> رنگ آمیزی حفاظهای فلزی: ";

            let selectedSubProject = keys.findIndex(function (key) {
              return key == "coloring6-1";
            });

            subItemsText +=
              "<span style='color: #FF5630'>(</span>" +
              subItemsData[keys[selectedSubProject]] +
              " مترمربع" +
              "<span style='color: #FF5630'>)</span></div>";

            break;
          }
          case "7": {
            subItemsText +=
              "<div style='font-size: 14px;'><b style='color: #FF5630'>-</b> رنگ آمیری نیوجرسی ها و سایر حفاظ بتنی: ";

            let selectedSubProject = keys.findIndex(function (key) {
              return key == "coloring7-1";
            });

            subItemsText +=
              "<span style='color: #FF5630'>(</span>" +
              subItemsData[keys[selectedSubProject]] +
              " مترمربع" +
              "<span style='color: #FF5630'>)</span></div>";

            break;
          }
          case "8": {
            subItemsText +=
              "<div style='font-size: 14px;'><b style='color: #FF5630'>-</b> رنگ آمیزی سرعتگاه: ";

            let selectedSubProject = keys.findIndex(function (key) {
              return key == "coloring8-1";
            });

            subItemsText +=
              "<span style='color: #FF5630'>(</span>" +
              subItemsData[keys[selectedSubProject]] +
              " مترمربع" +
              "<span style='color: #FF5630'>)</span></div>";

            break;
          }
          case "9": {
            subItemsText +=
              "<div style='font-size: 14px;'><b style='color: #FF5630'>-</b> رنگ آمیزی پایه و کوله پل ها جهت آشکارسازی: ";

            let selectedSubProject = keys.findIndex(function (key) {
              return key == "coloring9-1";
            });

            subItemsText +=
              "<span style='color: #FF5630'>(</span>" +
              subItemsData[keys[selectedSubProject]] +
              " مترمربع" +
              "<span style='color: #FF5630'>)</span></div>";

            break;
          }
        }
        break;
      }
      case 8: {
        let keys = Object.keys(subItemsData);

        switch (subItemIndex[index]) {
          case "1": {
            subItemsText +=
              "<div style='font-size: 14px;'><b style='color: #FF5630'>-</b> شستشوی علائم ایمنی اخطاری، انتظامی، مسیرنما و ...: ";

            let selectedSubProject = keys.findIndex(function (key) {
              return key == "washing1-1";
            });

            subItemsText +=
              "<span style='color: #FF5630'>(</span>" +
              subItemsData[keys[selectedSubProject]] +
              " عدد" +
              "<span style='color: #FF5630'>)</span></div>";

            break;
          }
          case "2": {
            subItemsText +=
              "<div style='font-size: 14px;'><b style='color: #FF5630'>-</b> شستشوی تابلوهای اطلاعاتی: ";

            let selectedSubProject = keys.findIndex(function (key) {
              return key == "washing2-1";
            });

            subItemsText +=
              "<span style='color: #FF5630'>(</span>" +
              subItemsData[keys[selectedSubProject]] +
              " مترمربع" +
              "<span style='color: #FF5630'>)</span></div>";

            break;
          }
          case "3": {
            subItemsText +=
              "<div style='font-size: 14px;'><b style='color: #FF5630'>-</b> شستشوی جداول: ";

            let selectedSubProject = keys.findIndex(function (key) {
              return key == "washing3-1";
            });

            subItemsText +=
              "<span style='color: #FF5630'>(</span>" +
              subItemsData[keys[selectedSubProject]] +
              " کیلومتر" +
              "<span style='color: #FF5630'>)</span></div>";

            break;
          }
          case "4": {
            subItemsText +=
              "<div style='font-size: 14px;'><b style='color: #FF5630'>-</b> شستشوی نیوجرسی ها: ";

            let selectedSubProject = keys.findIndex(function (key) {
              return key == "washing4-1";
            });

            subItemsText +=
              "<span style='color: #FF5630'>(</span>" +
              subItemsData[keys[selectedSubProject]] +
              " مترمربع" +
              "<span style='color: #FF5630'>)</span></div>";

            break;
          }
          case "5": {
            subItemsText +=
              "<div style='font-size: 14px;'><b style='color: #FF5630'>-</b> شستشوی گاردریل ها و هندریل ها: ";

            let selectedSubProject = keys.findIndex(function (key) {
              return key == "washing5-1";
            });

            subItemsText +=
              "<span style='color: #FF5630'>(</span>" +
              subItemsData[keys[selectedSubProject]] +
              " کیلومتر" +
              "<span style='color: #FF5630'>)</span></div>";

            break;
          }
          case "6": {
            subItemsText +=
              "<div style='font-size: 14px;'><b style='color: #FF5630'>-</b> شستشوی دیواره تونل ها: ";

            let selectedSubProject = keys.findIndex(function (key) {
              return key == "washing6-1";
            });

            subItemsText +=
              "<span style='color: #FF5630'>(</span>" +
              subItemsData[keys[selectedSubProject]] +
              " مترمربع" +
              "<span style='color: #FF5630'>)</span></div>";

            break;
          }
          case "7": {
            subItemsText +=
              "<div style='font-size: 14px;'><b style='color: #FF5630'>-</b> شستشوی تکیه گاه پل ها: ";

            let selectedSubProject = keys.findIndex(function (key) {
              return key == "washing7-1";
            });

            subItemsText +=
              "<span style='color: #FF5630'>(</span>" +
              subItemsData[keys[selectedSubProject]] +
              " عدد" +
              "<span style='color: #FF5630'>)</span></div>";

            break;
          }
        }
        break;
      }
      case 9: {
        let keys = Object.keys(subItemsData);

        switch (subItemIndex[index]) {
          case "1": {
            subItemsText +=
              "<div style='font-size: 14px;'><b style='color: #FF5630'>-</b> ایمن سازی سرگاردریل، موانع صلب، دماغه ها و موانع صلب: ";

            let selectedSubProject = keys.findIndex(function (key) {
              return key == "securing1-1";
            });

            subItemsText +=
              "<span style='color: #FF5630'>(</span>" +
              subItemsData[keys[selectedSubProject]] +
              " عدد" +
              "<span style='color: #FF5630'>)</span></div>";

            break;
          }
          case "2": {
            subItemsText +=
              "<div style='font-size: 14px;'><b style='color: #FF5630'>-</b> ایمن سازی شیب شیروانی ها: ";

            let selectedSubProject = keys.findIndex(function (key) {
              return key == "securing2-1";
            });

            subItemsText +=
              "<span style='color: #FF5630'>(</span>" +
              subItemsData[keys[selectedSubProject]] +
              " کیلومتر" +
              "<span style='color: #FF5630'>)</span></div>";

            break;
          }
          case "3": {
            subItemsText +=
              "<div style='font-size: 14px;'><b style='color: #FF5630'>-</b> اجرای استراحتگاه: ";

            let selectedSubProject = keys.findIndex(function (key) {
              return key == "securing3-1";
            });

            subItemsText +=
              "<span style='color: #FF5630'>(</span>" +
              subItemsData[keys[selectedSubProject]] +
              " باب" +
              "<span style='color: #FF5630'>)</span></div>";

            break;
          }
          case "4": {
            subItemsText +=
              "<div style='font-size: 14px;'><b style='color: #FF5630'>-</b> تعمیرات چراغ های آذرخشی و چشمک زن: ";

            let selectedSubProject = keys.findIndex(function (key) {
              return key == "securing4-1";
            });

            subItemsText +=
              "<span style='color: #FF5630'>(</span>" +
              subItemsData[keys[selectedSubProject]] +
              " دستگاه" +
              "<span style='color: #FF5630'>)</span></div>";

            break;
          }
          case "5": {
            subItemsText +=
              "<div style='font-size: 14px;'><b style='color: #FF5630'>-</b> ایجاد شیارهای لرزاننده ی طولی در لاین کنار: ";

            let selectedSubProject = keys.findIndex(function (key) {
              return key == "securing5-1";
            });

            subItemsText +=
              "<span style='color: #FF5630'>(</span>" +
              subItemsData[keys[selectedSubProject]] +
              " کیلومتر-شیار" +
              "<span style='color: #FF5630'>)</span></div>";

            break;
          }
          case "6": {
            subItemsText +=
              "<div style='font-size: 14px;'><b style='color: #FF5630'>-</b> ضربه گیر استوانه ای: ";

            let selectedSubProject = keys.findIndex(function (key) {
              return key == "securing6-1";
            });

            subItemsText +=
              "<span style='color: #FF5630'>(</span>" +
              subItemsData[keys[selectedSubProject]] +
              " عدد" +
              "<span style='color: #FF5630'>)</span></div>";

            break;
          }
          case "7": {
            subItemsText +=
              "<div style='font-size: 14px;'><b style='color: #FF5630'>-</b> نصب سرعت گیر استاندارد پلاستیکی: ";

            let selectedSubProject = keys.findIndex(function (key) {
              return key == "securing7-1";
            });

            subItemsText +=
              "<span style='color: #FF5630'>(</span>" +
              subItemsData[keys[selectedSubProject]] +
              " طول" +
              "<span style='color: #FF5630'>)</span></div>";

            break;
          }
          case "8": {
            subItemsText +=
              "<div style='font-size: 14px;'><b style='color: #FF5630'>-</b> ایجاد شیار های لرزاننده طولی در اکس راه های دو طرفه: ";

            let selectedSubProject = keys.findIndex(function (key) {
              return key == "securing8-1";
            });

            subItemsText +=
              "<span style='color: #FF5630'>(</span>" +
              subItemsData[keys[selectedSubProject]] +
              " کیلومتر - شیار" +
              "<span style='color: #FF5630'>)</span></div>";

            break;
          }
          case "9": {
            subItemsText +=
              "<div style='font-size: 14px;'><b style='color: #FF5630'>-</b> استوانه ایمنی جهت هدایت ترافیک: ";

            let selectedSubProject = keys.findIndex(function (key) {
              return key == "securing9-1";
            });

            subItemsText +=
              "<span style='color: #FF5630'>(</span>" +
              subItemsData[keys[selectedSubProject]] +
              " عدد" +
              "<span style='color: #FF5630'>)</span></div>";

            break;
          }
          case "11": {
            subItemsText +=
              "<div style='font-size: 14px;'><b style='color: #FF5630'>-</b> احداث سرعت گیر آسفالتی: ";

            let selectedSubProject = keys.findIndex(function (key) {
              return key == "securing11-1";
            });

            subItemsText +=
              "<span style='color: #FF5630'>(</span>" +
              subItemsData[keys[selectedSubProject]] +
              " متر طول" +
              "<span style='color: #FF5630'>)</span></div>";

            break;
          }
          case "12": {
            subItemsText +=
              "<div style='font-size: 14px;'><b style='color: #FF5630'>-</b> اجرای هره خاکی نقطه ای: ";

            let selectedSubProject = keys.findIndex(function (key) {
              return key == "securing12-1";
            });

            subItemsText +=
              "<span style='color: #FF5630'>(</span>" +
              subItemsData[keys[selectedSubProject]] +
              " مورد" +
              "<span style='color: #FF5630'>)</span></div>";

            break;
          }
          case "13": {
            subItemsText +=
              "<div style='font-size: 14px;'><b style='color: #FF5630'>-</b> اجرای هره خاکی طولی: ";

            let selectedSubProject = keys.findIndex(function (key) {
              return key == "securing13-1";
            });

            subItemsText +=
              "<span style='color: #FF5630'>(</span>" +
              subItemsData[keys[selectedSubProject]] +
              " متر طول" +
              "<span style='color: #FF5630'>)</span></div>";

            break;
          }
          case "14": {
            subItemsText +=
              "<div style='font-size: 14px;'><b style='color: #FF5630'>-</b> تعریض مقطعی جهت خروج اضطراری در سراشیبی ها: ";

            let selectedSubProject = keys.findIndex(function (key) {
              return key == "securing14-1";
            });

            subItemsText +=
              "<span style='color: #FF5630'>(</span>" +
              subItemsData[keys[selectedSubProject]] +
              " متر طول" +
              "<span style='color: #FF5630'>)</span></div>";

            break;
          }
          case "15": {
            subItemsText +=
              "<div style='font-size: 14px;'><b style='color: #FF5630'>-</b> حذف یا جابه جایی موانع صلب در حاشیه راه در محدوده عاری از مانع: ";

            let selectedSubProject = keys.findIndex(function (key) {
              return key == "securing15-1";
            });

            subItemsText +=
              "<span style='color: #FF5630'>(</span>" +
              subItemsData[keys[selectedSubProject]] +
              " عدد " +
              "<span style='color: #FF5630'>)</span></div>";

            break;
          }
        }
        break;
      }
      case 10: {
        let keys = Object.keys(subItemsData);

        switch (subItemIndex[index]) {
          case "1": {
            subItemsText +=
              "<div style='font-size: 14px;'><b style='color: #FF5630'>-</b> اخطار،تخریب،بازدیدو یا تهیه اطلاعات از ساخت و ساز در حریم: ";

            let selectedSubProject = keys.findIndex(function (key) {
              return key == "privacy1-1";
            });

            subItemsText +=
              "<span style='color: #FF5630'>(</span>" +
              subItemsData[keys[selectedSubProject]] +
              " مورد " +
              "<span style='color: #FF5630'>)</span></div>";

            break;
          }

          case "2": {
            subItemsText +=
              "<div style='font-size: 14px;'><b style='color: #FF5630'>-</b> اخطار ،تخریب،بازدیدو یا تهیه اطلاعات از راه دسترسی در حریم: ";

            let selectedSubProject = keys.findIndex(function (key) {
              return key == "privacy2-1";
            });

            subItemsText +=
              "<span style='color: #FF5630'>(</span>" +
              subItemsData[keys[selectedSubProject]] +
              " مورد " +
              "<span style='color: #FF5630'>)</span></div>";

            break;
          }
          case "3": {
            subItemsText +=
              "<div style='font-size: 14px;'><b style='color: #FF5630'>-</b> اخطار ،تخریب،بازدیدو یا تهیه اطلاعات از عبور تاسیسات زیربنایی در حریم: ";

            let selectedSubProject = keys.findIndex(function (key) {
              return key == "privacy3-1";
            });

            subItemsText +=
              "<span style='color: #FF5630'>(</span>" +
              subItemsData[keys[selectedSubProject]] +
              " مورد " +
              "<span style='color: #FF5630'>)</span></div>";

            break;
          }
          case "4": {
            subItemsText +=
              "<div style='font-size: 14px;'><b style='color: #FF5630'>-</b> برخورد با دستفروشان حاشیه راه: ";

            let selectedSubProject = keys.findIndex(function (key) {
              return key == "privacy4-1";
            });

            subItemsText +=
              "<span style='color: #FF5630'>(</span>" +
              subItemsData[keys[selectedSubProject]] +
              " مورد " +
              "<span style='color: #FF5630'>)</span></div>";

            break;
          }
          case "5": {
            subItemsText +=
              "<div style='font-size: 14px;'><b style='color: #FF5630'>-</b> جمع آوری تابلوهای غیرمجاز در حاشیه راه ها: ";

            let selectedSubProject = keys.findIndex(function (key) {
              return key == "privacy5-1";
            });

            subItemsText +=
              "<span style='color: #FF5630'>(</span>" +
              subItemsData[keys[selectedSubProject]] +
              " مورد " +
              "<span style='color: #FF5630'>)</span></div>";

            break;
          }
          case "6": {
            subItemsText +=
              "<div style='font-size: 14px;'><b style='color: #FF5630'>-</b> جمع آوری بنر های تبلیغاتی غیر مجاز: ";

            let selectedSubProject = keys.findIndex(function (key) {
              return key == "privacy6-1";
            });

            subItemsText +=
              "<span style='color: #FF5630'>(</span>" +
              subItemsData[keys[selectedSubProject]] +
              " مورد " +
              "<span style='color: #FF5630'>)</span></div>";

            break;
          }
        }
        break;
      }
      case 11: {
        let keys = Object.keys(subItemsData);

        switch (subItemIndex[index]) {
          case "1": {
            subItemsText +=
              "<div style='font-size: 14px;'><b style='color: #FF5630'>-</b> احداث یا مرمت قرنیز پل: ";

            let selectedSubProject = keys.findIndex(function (key) {
              return key == "bridge1-1";
            });

            subItemsText +=
              "<span style='color: #FF5630'>(</span>" +
              subItemsData[keys[selectedSubProject]] +
              " متر طول " +
              "<span style='color: #FF5630'>)</span></div>";

            break;
          }

          case "2": {
            subItemsText +=
              "<div style='font-size: 14px;'><b style='color: #FF5630'>-</b> لوله گذاری آبروها: ";

            let selectedSubProject = keys.findIndex(function (key) {
              return key == "bridge2-1";
            });

            subItemsText +=
              "<span style='color: #FF5630'>(</span>" +
              subItemsData[keys[selectedSubProject]] +
              " متر طول " +
              "<span style='color: #FF5630'>)</span></div>";

            break;
          }
          case "3": {
            subItemsText +=
              "<div style='font-size: 14px;'><b style='color: #FF5630'>-</b> تطویل و رفع انسداد آبچکان پل : ";

            let selectedSubProject = keys.findIndex(function (key) {
              return key == "bridge3-1";
            });

            subItemsText +=
              "<span style='color: #FF5630'>(</span>" +
              subItemsData[keys[selectedSubProject]] +
              " تعداد " +
              "<span style='color: #FF5630'>)</span></div>";

            break;
          }
          case "4": {
            subItemsText +=
              "<div style='font-size: 14px;'><b style='color: #FF5630'>-</b> بازسازی نرده پل: ";

            let selectedSubProject = keys.findIndex(function (key) {
              return key == "bridge4-1";
            });

            subItemsText +=
              "<span style='color: #FF5630'>(</span>" +
              subItemsData[keys[selectedSubProject]] +
              " متر طول " +
              "<span style='color: #FF5630'>)</span></div>";

            break;
          }
          case "5": {
            subItemsText +=
              "<div style='font-size: 14px;'><b style='color: #FF5630'>-</b> تعمیرات آبرو شامل کوله دستک و دال: ";

            let selectedSubProject = keys.findIndex(function (key) {
              return key == "bridge5-1";
            });

            subItemsText +=
              "<span style='color: #FF5630'>(</span>" +
              subItemsData[keys[selectedSubProject]] +
              " متر مکعب " +
              "<span style='color: #FF5630'>)</span></div>";

            break;
          }
          case "6": {
            subItemsText +=
              "<div style='font-size: 14px;'><b style='color: #FF5630'>-</b> مرمت و بازسازی درز انبساط: ";

            let selectedSubProject = keys.findIndex(function (key) {
              return key == "bridge6-1";
            });

            subItemsText +=
              "<span style='color: #FF5630'>(</span>" +
              subItemsData[keys[selectedSubProject]] +
              " عدد  " +
              "<span style='color: #FF5630'>)</span></div>";

            break;
          }
          case "7": {
            subItemsText +=
              "<div style='font-size: 14px;'><b style='color: #FF5630'>-</b> تعمیرات رادیه و برید: ";

            let selectedSubProject = keys.findIndex(function (key) {
              return key == "bridge7-1";
            });

            subItemsText +=
              "<span style='color: #FF5630'>(</span>" +
              subItemsData[keys[selectedSubProject]] +
              " متر مکعب   " +
              "<span style='color: #FF5630'>)</span></div>";

            break;
          }
        }
        break;
      }
      case 12: {
        let keys = Object.keys(subItemsData);

        switch (subItemIndex[index]) {
          case "1": {
            subItemsText +=
              "<div style='font-size: 14px;'><b style='color: #FF5630'>-</b> زهکشی طاق تونل: ";

            let selectedSubProject = keys.findIndex(function (key) {
              return key == "tunnel1-1";
            });

            subItemsText +=
              "<span style='color: #FF5630'>(</span>" +
              subItemsData[keys[selectedSubProject]] +
              " مورد " +
              "<span style='color: #FF5630'>)</span></div>";

            break;
          }

          case "2": {
            subItemsText +=
              "<div style='font-size: 14px;'><b style='color: #FF5630'>-</b> مرمت و بازرسی آبروهای هدایت آب: ";

            let selectedSubProject = keys.findIndex(function (key) {
              return key == "tunnel2-1";
            });

            subItemsText +=
              "<span style='color: #FF5630'>(</span>" +
              subItemsData[keys[selectedSubProject]] +
              " متر طول " +
              "<span style='color: #FF5630'>)</span></div>";

            break;
          }
          case "3": {
            subItemsText +=
              "<div style='font-size: 14px;'><b style='color: #FF5630'>-</b> لاینینگ: ";

            let selectedSubProject = keys.findIndex(function (key) {
              return key == "tunnel2-1";
            });

            subItemsText +=
              "<span style='color: #FF5630'>(</span>" +
              subItemsData[keys[selectedSubProject]] +
              " متر مکعب " +
              "<span style='color: #FF5630'>)</span></div>";

            break;
          }
          case "4": {
            subItemsText +=
              "<div style='font-size: 14px;'><b style='color: #FF5630'>-</b> تعمیر و بازسازی گالری: ";

            let selectedSubProject = keys.findIndex(function (key) {
              return key == "tunnel4-1";
            });

            subItemsText +=
              "<span style='color: #FF5630'>(</span>" +
              subItemsData[keys[selectedSubProject]] +
              " عدد  " +
              "<span style='color: #FF5630'>)</span></div>";

            break;
          }
          case "5": {
            subItemsText +=
              "<div style='font-size: 14px;'><b style='color: #FF5630'>-</b> گاباریت: ";

            let selectedSubProject = keys.findIndex(function (key) {
              return key == "tunnel5-1";
            });

            subItemsText +=
              "<span style='color: #FF5630'>(</span>" +
              subItemsData[keys[selectedSubProject]] +
              "  عدد " +
              "<span style='color: #FF5630'>)</span></div>";

            break;
          }
          case "6": {
            subItemsText +=
              "<div style='font-size: 14px;'><b style='color: #FF5630'>-</b> نگهداری دوربین ها و ابزار دقیق: ";

            let selectedSubProject = keys.findIndex(function (key) {
              return key == "tunnel6-1";
            });

            subItemsText +=
              "<span style='color: #FF5630'>(</span>" +
              subItemsData[keys[selectedSubProject]] +
              " عدد  " +
              "<span style='color: #FF5630'>)</span></div>";

            break;
          }
          case "7": {
            subItemsText +=
              "<div style='font-size: 14px;'><b style='color: #FF5630'>-</b> نگهداری تهویه تونل: ";

            let selectedSubProject = keys.findIndex(function (key) {
              return key == "tunnel7-1";
            });

            subItemsText +=
              "<span style='color: #FF5630'>(</span>" +
              subItemsData[keys[selectedSubProject]] +
              " عدد  " +
              "<span style='color: #FF5630'>)</span></div>";

            break;
          }
        }
        break;
      }
      case 13: {
        let keys = Object.keys(subItemsData);

        switch (subItemIndex[index]) {
          case "1": {
            subItemsText +=
              "<div style='font-size: 14px;'><b style='color: #FF5630'>-</b> عملیات یخ زدایی با شن و نمک پاشی: ";

            let selectedSubProject = keys.findIndex(function (key) {
              return key == "winterOperation1-1";
            });

            subItemsText +=
              "<span style='color: #FF5630'>(</span>" +
              subItemsData[keys[selectedSubProject]] +
              " کیلومتر - باند" +
              "<span style='color: #FF5630'>)</span></div>";

            break;
          }
          case "2": {
            subItemsText +=
              "<div style='font-size: 14px;'><b style='color: #FF5630'>-</b>برف روبی : ";

            let selectedSubProject = keys.findIndex(function (key) {
              return key == "winterOperation2-1";
            });

            subItemsText +=
              "<span style='color: #FF5630'>(</span>" +
              subItemsData[keys[selectedSubProject]] +
              " کیلومتر - باند" +
              "<span style='color: #FF5630'>)</span></div>";

            break;
          }
          case "3": {
            subItemsText +=
              "<div style='font-size: 14px;'><b style='color: #FF5630'>-</b> میزان نمک شن و ماسه مصرفی: ";

            let selectedSubProject = keys.findIndex(function (key) {
              return key == "winterOperation3-1";
            });

            subItemsText +=
              "<span style='color: #FF5630'>(</span>" +
              subItemsData[keys[selectedSubProject]] +
              " تن" +
              "<span style='color: #FF5630'>)</span></div>";

            break;
          }
          case "4": {
            subItemsText +=
              "<div style='font-size: 14px;'><b style='color: #FF5630'>-</b> برف روبی در شرایط کولاک و عدم دید: ";

            let selectedSubProject = keys.findIndex(function (key) {
              return key == "winterOperation4-1";
            });

            subItemsText +=
              "<span style='color: #FF5630'>(</span>" +
              subItemsData[keys[selectedSubProject]] +
              " کیلومتر - باند" +
              "<span style='color: #FF5630'>)</span></div>";

            break;
          }
          case "5": {
            subItemsText +=
              "<div style='font-size: 14px;'><b style='color: #FF5630'>-</b>میزان نمک شن و ماسه مصرفی: ";

            let selectedSubProject = keys.findIndex(function (key) {
              return key == "winterOperation5-1";
            });

            subItemsText +=
              "<span style='color: #FF5630'>(</span>" +
              subItemsData[keys[selectedSubProject]] +
              " تن" +
              "<span style='color: #FF5630'>)</span></div>";

            break;
          }
          case "6": {
            subItemsText +=
              "<div style='font-size: 14px;'><b style='color: #FF5630'>-</b> ریزش برداری: ";

            let selectedSubProject = keys.findIndex(function (key) {
              return key == "winterOperation6-1";
            });

            subItemsText +=
              "<span style='color: #FF5630'>(</span>" +
              subItemsData[keys[selectedSubProject]] +
              " مقطع" +
              "<span style='color: #FF5630'>)</span></div>";

            break;
          }
          case "7": {
            subItemsText +=
              "<div style='font-size: 14px;'><b style='color: #FF5630'>-</b> مسافرین اسکان داده شده: ";

            let selectedSubProject = keys.findIndex(function (key) {
              return key == "winterOperation7-1";
            });

            subItemsText +=
              "<span style='color: #FF5630'>(</span>" +
              subItemsData[keys[selectedSubProject]] +
              " نفر" +
              "<span style='color: #FF5630'>)</span></div>";

            break;
          }
          case "8": {
            subItemsText +=
              "<div style='font-size: 14px;'><b style='color: #FF5630'>-</b> کمک رسانی به خودرو : ";

            let selectedSubProject = keys.findIndex(function (key) {
              return key == "winterOperation8-1";
            });

            subItemsText +=
              "<span style='color: #FF5630'>(</span>" +
              subItemsData[keys[selectedSubProject]] +
              " تعداد" +
              "<span style='color: #FF5630'>)</span></div>";

            break;
          }
        }
        break;
      }
      case 14: {
        let keys = Object.keys(subItemsData);

        switch (subItemIndex[index]) {
          case "1": {
            subItemsText +=
              "<div style='font-size: 14px;'><b style='color: #FF5630'>-</b> بنزین مصرفی کل ماشین آلات فعال -ماهانه: ";

            let selectedSubProject = keys.findIndex(function (key) {
              return key == "machinery1-1";
            });

            subItemsText +=
              "<span style='color: #FF5630'>(</span>" +
              subItemsData[keys[selectedSubProject]] +
              " لیتر" +
              "<span style='color: #FF5630'>)</span></div>";

            break;
          }
          case "2": {
            subItemsText +=
              "<div style='font-size: 14px;'><b style='color: #FF5630'>-</b> گازوئیل مصرفی کل ماشین آلات فعال - ماهانه: ";

            let selectedSubProject = keys.findIndex(function (key) {
              return key == "machinery2-1";
            });

            subItemsText +=
              "<span style='color: #FF5630'>(</span>" +
              subItemsData[keys[selectedSubProject]] +
              " لیتر" +
              "<span style='color: #FF5630'>)</span></div>";

            break;
          }
          case "3": {
            subItemsText +=
              "<div style='font-size: 14px;'><b style='color: #FF5630'>-</b> مواد مصرفی نفتی و انواع روغن -ماهانه: ";

            let selectedSubProject = keys.findIndex(function (key) {
              return key == "machinery3-1";
            });

            subItemsText +=
              "<span style='color: #FF5630'>(</span>" +
              subItemsData[keys[selectedSubProject]] +
              " لیتر" +
              "<span style='color: #FF5630'>)</span></div>";

            break;
          }
          case "4": {
            subItemsText +=
              "<div style='font-size: 14px;'><b style='color: #FF5630'>-</b> بازسازی و راه اندازی ماشین آلات: ";

            let selectedSubProject = keys.findIndex(function (key) {
              return key == "machinery4-1";
            });

            subItemsText +=
              "<span style='color: #FF5630'>(</span>" +
              subItemsData[keys[selectedSubProject]] +
              " تعداد دستگاه" +
              "<span style='color: #FF5630'>)</span></div>";

            break;
          }
          case "5": {
            subItemsText +=
              "<div style='font-size: 14px;'><b style='color: #FF5630'>-</b> خرید ماشین آلات: ";

            let selectedSubProject = keys.findIndex(function (key) {
              return key == "machinery5-1";
            });

            subItemsText +=
              "<span style='color: #FF5630'>(</span>" +
              subItemsData[keys[selectedSubProject]] +
              " دستگاه، ";

            let selectedSubProject2 = keys.findIndex(function (key) {
              return key == "machinery5-2";
            });

            subItemsText +=
              " نوع کاربری: " +
              subItemsData[keys[selectedSubProject2]] +
              "<span style='color: #FF5630'>)</span></div>";

            break;
          }
          case "6": {
            subItemsText +=
              "<div style='font-size: 14px;'><b style='color: #FF5630'>-</b> خرید تجهیزآلات مرتبط به ماشین آلات: ";

            let selectedSubProject = keys.findIndex(function (key) {
              return key == "machinery6-1";
            });

            subItemsText +=
              "<span style='color: #FF5630'>(</span>" +
              subItemsData[keys[selectedSubProject]] +
              " دستگاه، ";

            let selectedSubProject2 = keys.findIndex(function (key) {
              return key == "machinery6-2";
            });

            subItemsText +=
              " نوع کاربری: " +
              subItemsData[keys[selectedSubProject2]] +
              "<span style='color: #FF5630'>)</span></div>";

            break;
          }
          case "7": {
            subItemsText +=
              "<div style='font-size: 14px;'><b style='color: #FF5630'>-</b> بازدید کارشناسان از ماشین آلات استان: ";

            let selectedSubProject = keys.findIndex(function (key) {
              return key == "machinery7-1";
            });

            subItemsText +=
              "<span style='color: #FF5630'>(</span>" +
              subItemsData[keys[selectedSubProject]] +
              " دستگاه، ";

            let selectedSubProject2 = keys.findIndex(function (key) {
              return key == "machinery7-2";
            });

            subItemsText +=
              " تعداد بازدید: " +
              subItemsData[keys[selectedSubProject2]] +
              "<span style='color: #FF5630'>)</span></div>";

            break;
          }
          case "8": {
            subItemsText +=
              "<div style='font-size: 14px;'><b style='color: #FF5630'>-</b> سرویس کاری و تعمیرات جزئی روزانه: ";

            let selectedSubProject = keys.findIndex(function (key) {
              return key == "machinery8-1";
            });

            subItemsText +=
              "<span style='color: #FF5630'>(</span>" +
              subItemsData[keys[selectedSubProject]] +
              " تعداد دستگاه" +
              "<span style='color: #FF5630'>)</span></div>";

            break;
          }
          case "9": {
            subItemsText +=
              "<div style='font-size: 14px;'><b style='color: #FF5630'>-</b> شستشو نمک پاش ها و سایر ماشین آلات: ";

            let selectedSubProject = keys.findIndex(function (key) {
              return key == "machinery9-1";
            });

            subItemsText +=
              "<span style='color: #FF5630'>(</span>" +
              subItemsData[keys[selectedSubProject]] +
              " تعداد دستگاه" +
              "<span style='color: #FF5630'>)</span></div>";

            break;
          }
          case "10": {
            subItemsText +=
              "<div style='font-size: 14px;'><b style='color: #FF5630'>-</b> جابه جایی دستگاهای سنگین راهداری: ";

            let selectedSubProject = keys.findIndex(function (key) {
              return key == "machinery10-1";
            });

            subItemsText +=
              "<span style='color: #FF5630'>(</span>" +
              subItemsData[keys[selectedSubProject]] +
              "مسافت کیلومتر" +
              "<span style='color: #FF5630'>)</span></div>";

            break;
          }
        }
        break;
      }
      case 15: {
        let keys = Object.keys(subItemsData);

        switch (subItemIndex[index]) {
          case "1": {
            subItemsText +=
              "<div style='font-size: 14px;'><b style='color: #FF5630'>-</b> خرید تجهیزآلات مرتبط با راهدارخانه ها: ";

            let selectedSubProject = keys.findIndex(function (key) {
              return key == "tollhouse1-1";
            });

            subItemsText +=
              "<span style='color: #FF5630'>(</span>" +
              subItemsData[keys[selectedSubProject]] +
              " عدد، ";

            let selectedSubProject2 = keys.findIndex(function (key) {
              return key == "tollhouse1-2";
            });

            subItemsText +=
              " نوع: " +
              subItemsData[keys[selectedSubProject2]] +
              "<span style='color: #FF5630'>)</span></div>";

            break;
          }
          case "3": {
            subItemsText +=
              "<div style='font-size: 14px;'><b style='color: #FF5630'>-</b> جلسات تشکیل شده در خصوص مدیریت بحران و پدافند غیرعامل: ";

            let selectedSubProject = keys.findIndex(function (key) {
              return key == "tollhouse3-1";
            });

            subItemsText +=
              "<span style='color: #FF5630'>(</span>" +
              subItemsData[keys[selectedSubProject]] +
              " _" +
              "<span style='color: #FF5630'>)</span></div>";

            break;
          }
        }
        break;
      }
      case 16: {
        let keys = Object.keys(subItemsData);

        switch (subItemIndex[index]) {
          case "1": {
            subItemsText +=
              "<div style='font-size: 14px;'><b style='color: #FF5630'>-</b> پاک سازی سطح راه و رفع انسداد ناشی از ریزش کوه و سقوط بهمن: ";

            let selectedSubProject = keys.findIndex(function (key) {
              return key == "emergency1-1";
            });

            subItemsText +=
              "<span style='color: #FF5630'>(</span>" +
              subItemsData[keys[selectedSubProject]] +
              "تعداد محور" +
              "<span style='color: #FF5630'>)</span></div>";

            break;
          }
          case "2": {
            subItemsText +=
              "<div style='font-size: 14px;'><b style='color: #FF5630'>-</b> برقراری تردد و رفع انسداد ناشی از وقوع تصادف یا واژگونی وسایط نقلیه و پخش محموله در سطح راه: ";

            let selectedSubProject = keys.findIndex(function (key) {
              return key == "emergency2-1";
            });

            subItemsText +=
              "<span style='color: #FF5630'>(</span>" +
              subItemsData[keys[selectedSubProject]] +
              "تعداد محور" +
              "<span style='color: #FF5630'>)</span></div>";

            break;
          }
          case "3": {
            subItemsText +=
              "<div style='font-size: 14px;'><b style='color: #FF5630'>-</b> برقراری ارتباط و رفع انسداد ناشی از شن های روان: ";

            let selectedSubProject = keys.findIndex(function (key) {
              return key == "emergency4-1";
            });

            subItemsText +=
              "<span style='color: #FF5630'>(</span>" +
              subItemsData[keys[selectedSubProject]] +
              " تعداد محور" +
              "<span style='color: #FF5630'>)</span></div>";

            break;
          }
          case "4": {
            subItemsText +=
              "<div style='font-size: 14px;'><b style='color: #FF5630'>-</b> برقراری ارتباط در راه هایی که به دلیل آب بردگی دچار قطع ارتباط شده اند: ";

            let selectedSubProject = keys.findIndex(function (key) {
              return key == "emergency4-1";
            });

            subItemsText +=
              "<span style='color: #FF5630'>(</span>" +
              subItemsData[keys[selectedSubProject]] +
              " تعداد محور" +
              "<span style='color: #FF5630'>)</span></div>";

            break;
          }
          case "5": {
            subItemsText +=
              "<div style='font-size: 14px;'><b style='color: #FF5630'>-</b> برقراری ارتباط موقت در راه هایی که به دلیل شکستگی پل یا ریزش تونل یا ... قطع شده اند: ";

            let selectedSubProject = keys.findIndex(function (key) {
              return key == "emergency5-1";
            });

            subItemsText +=
              "<span style='color: #FF5630'>(</span>" +
              subItemsData[keys[selectedSubProject]] +
              " تعداد محور" +
              "<span style='color: #FF5630'>)</span></div>";

            break;
          }
          case "6": {
            subItemsText +=
              "<div style='font-size: 14px;'><b style='color: #FF5630'>-</b> بستن راه و هدایت ترافیکی در مواقع اضطراری: ";

            let selectedSubProject = keys.findIndex(function (key) {
              return key == "emergency6-1";
            });

            subItemsText +=
              "<span style='color: #FF5630'>(</span>" +
              subItemsData[keys[selectedSubProject]] +
              " تعداد محور" +
              "<span style='color: #FF5630'>)</span></div>";

            break;
          }
          case "7": {
            subItemsText +=
              "<div style='font-size: 14px;'><b style='color: #FF5630'>-</b> بازگشایی محور هایی که به علت کولاک مسدود شده اند: ";

            let selectedSubProject = keys.findIndex(function (key) {
              return key == "emergency7-1";
            });

            subItemsText +=
              "<span style='color: #FF5630'>(</span>" +
              subItemsData[keys[selectedSubProject]] +
              " تعداد محور" +
              "<span style='color: #FF5630'>)</span></div>";

            break;
          }
          case "8": {
            subItemsText +=
              "<div style='font-size: 14px;'><b style='color: #FF5630'>-</b> جابه جایی ماشین های سنگین گرفتار در سطح راه: ";

            let selectedSubProject = keys.findIndex(function (key) {
              return key == "emergency8-1";
            });

            subItemsText +=
              "<span style='color: #FF5630'>(</span>" +
              subItemsData[keys[selectedSubProject]] +
              " تعداد دستگاه" +
              "<span style='color: #FF5630'>)</span></div>";

            break;
          }
          case "9": {
            subItemsText +=
              "<div style='font-size: 14px;'><b style='color: #FF5630'>-</b> لق گیری: ";

            let selectedSubProject = keys.findIndex(function (key) {
              return key == "emergency9-1";
            });

            subItemsText +=
              "<span style='color: #FF5630'>(</span>" +
              subItemsData[keys[selectedSubProject]] +
              " تعداد محور" +
              "<span style='color: #FF5630'>)</span></div>";

            break;
          }
        }
        break;
      }
      case 20: {
        let keys = Object.keys(subItemsData);

        switch (subItemIndex[index]) {
          case "1": {
            subItemsText +=
              "<div style='font-size: 14px;'><b style='color: #FF5630'>-</b> بازدید ادواری از ابنیه فنی و تکمیل چک لیست های مربوط توسط کارشناسان : ";

            let selectedSubProject = keys.findIndex(function (key) {
              return key == "itemcontrol1-1";
            });

            subItemsText +=
              "<span style='color: #FF5630'>(</span>" +
              subItemsData[keys[selectedSubProject]] +
              "نفر ساعت" +
              "<span style='color: #FF5630'>)</span></div>";

            break;
          }
          case "2": {
            subItemsText +=
              "<div style='font-size: 14px;'><b style='color: #FF5630'>-</b> بازدید ادواری از وضعیت علائم و تعیین کسری علائم و ارزیابی وضعیت خط کشی ها ، تجهیزات روشنایی و تهویه تونلها و گاردریل و نظایر آنها و تکمیل چک لیستها توسط کارشناسان : ";

            let selectedSubProject = keys.findIndex(function (key) {
              return key == "itemcontrol2-1";
            });

            subItemsText +=
              "<span style='color: #FF5630'>(</span>" +
              subItemsData[keys[selectedSubProject]] +
              "نفر ساعت" +
              "<span style='color: #FF5630'>)</span></div>";

            break;
          }
          case "3": {
            subItemsText +=
              "<div style='font-size: 14px;'><b style='color: #FF5630'>-</b>ارزیابی ادواری وضعیت پایداری ترانشه ها و شیروانیها، سیستم های زهکشی و ارزیابی علل ریزش ترانشه ها و علل شکست راه و تکمیل چک لیست توسط کارشناسان   : ";

            let selectedSubProject = keys.findIndex(function (key) {
              return key == "itemcontrol3-1";
            });

            subItemsText +=
              "<span style='color: #FF5630'>(</span>" +
              subItemsData[keys[selectedSubProject]] +
              "نفر ساعت" +
              "<span style='color: #FF5630'>)</span></div>";

            break;
          }
          case "4": {
            subItemsText +=
              "<div style='font-size: 14px;'><b style='color: #FF5630'>-</b>  ارزیابی ادواری وضعیت رویه های آسفالتی و شانه ها و ارزیابی و کنترل ترکها و تکمیل چک لیستها توسط کارشناسان : ";

            let selectedSubProject = keys.findIndex(function (key) {
              return key == "itemcontrol4-1";
            });

            subItemsText +=
              "<span style='color: #FF5630'>(</span>" +
              subItemsData[keys[selectedSubProject]] +
              "کیلومتر" +
              "<span style='color: #FF5630'>)</span></div>";

            break;
          }
          case "5": {
            subItemsText +=
              "<div style='font-size: 14px;'><b style='color: #FF5630'>-</b>  بررسی وضعیت حریم راه و تهیه گزارش مربوط با تجهیز و اعزام کارشناس : ";

            let selectedSubProject = keys.findIndex(function (key) {
              return key == "itemcontrol5-1";
            });

            subItemsText +=
              "<span style='color: #FF5630'>(</span>" +
              subItemsData[keys[selectedSubProject]] +
              "کیلومتر" +
              "<span style='color: #FF5630'>)</span></div>";

            break;
          }
          case "6": {
            subItemsText +=
              "<div style='font-size: 14px;'><b style='color: #FF5630'>-</b>  بازديد كارشناسان از ماشين آلات استان  : ";

            let selectedSubProject = keys.findIndex(function (key) {
              return key == "itemcontrol6-1";
            });

            subItemsText +=
              "<span style='color: #FF5630'>(</span>" +
              subItemsData[keys[selectedSubProject]] +
              "تعداد دستگاه" +
              "<span style='color: #FF5630'>)</span></div>";

            break;
          }
        }
        break;
      }
    }
  }

  $(".showsubitems").append(subItemsText);
}

function showphoto(files) {
  console.log("files", files);
  var eachphotdiv = "";
  $(".showsubitems").append(
    "<div class='showphoto'><table   class='table table-bordered table-sm' style='width:100%'><thead><tr><th>عکس بعد از اقدام</th><th>عکس قبل از اقدام </th></tr></thead><tbody><tr class='showphotocell'></tr></tbody></div>"
  );
  for (var i = 0; i < files.length; i++) {
    eachphotdiv =
      eachphotdiv +
      "<td><img src='https://rms.rmto.ir/storage/" +
      files[i].path +
      "'></td>";
  }
  console.log("eachphotp", eachphotdiv);
  $(".showphotocell").append(eachphotdiv);
  $(".showsubitems").append("<div class='line_down'></div>");
  $(".showsubitems").append(
    "<div class='editfooter'><button type='button' class='btn btn-success' onclick='editsubitem()'>ویرایش</button></div>"
  );
}

function editsubitem() {
  $("#item-" + item_checker).attr("checked", true);
  $("#vertical-menu").modal({ backdrop: "static", keyboard: false });
  $("#vertical-menu").modal("show");
}

function getdataitem() {
  $.ajax({
    url: "https://rms.rmto.ir/api/get-items-and-subs",
    type: "GET",
    cache: false,
    contentType: false,
    processData: false,
    success: function (result) {
      console.log("Erss", result);
      appenditems(result.items);
      filleacharray(result.data);
    },
    error: function (error) {
      console.log(error);
    },
  });
}
function appenditems(res) {
  var datashow = "";
  for (var i = 0; i < res.length; i++) {
    datashow =
      datashow +
      '<div class="col-sm-6 sub-item">\
        <div class="form-group radio-body clearfix">\
          <div class="icheck-primary d-inline">\
            <input type="radio" id="' +
      res[i].item_id +
      '" name="radiocheck" />\
            <label id="' +
      res[i].item_id +
      '-name" for="' +
      res[i].item_id +
      '">' +
      res[i].item_str +
      "\
                                </label>\
          </div>\
        </div>\
        </div>";
  }
  $("#modalbodychooseitem").append(datashow);
}
$("#next-modal-show").on("click", function () {
  showSecondModal();
});

function showSecondModal() {
  var dataeachitem = [];
  if ($("#item-1").is(":checked")) {
    console.log("you are here1");
    console.log("testhear", showsubitems);
    for (var i = 0; i < showsubitems.length; i++) {
      if (showsubitems[i].item == 1) {
        dataeachitem.push(showsubitems[i]);
      }
    }
    $("#vertical-menu").modal("hide");
    titlemodal = document.getElementById("item-1-name").textContent;
    showSubItem(1, titlemodal, dataeachitem);
    console.log("you are here2");
    if ("item-" + item_checker == "item-1") {
      $("#reconstruction" + Subitem_checker).attr("checked", true);
      $(".sub-item" + item_checker + "-" + Subitem_checker).css(
        "display",
        "block"
      );
      $("#reconstruction" + Subitem_checker + "-1").val(sub_item_data_checker);
      console.log("you are here3");
    }
  } else if ($("#item-2").is(":checked")) {
    console.log("testhear2", showsubitems);
    for (var i = 0; i < showsubitems.length; i++) {
      if (showsubitems[i].item == 2) {
        dataeachitem.push(showsubitems[i]);
      }
    }
    $("#vertical-menu").modal("hide");
    titlemodal = document.getElementById("item-2-name").textContent;
    showSubItem(2, titlemodal, dataeachitem);
    if ("item-" + item_checker == "item-2") {
      $("#cleaning" + Subitem_checker).attr("checked", true);
      $(".sub-item" + item_checker + "-" + Subitem_checker).css(
        "display",
        "block"
      );
      $("#cleaning" + Subitem_checker + "-1").val(sub_item_data_checker);
    }
  } else if ($("#item-3").is(":checked")) {
    console.log("testhear3", showsubitems);
    for (var i = 0; i < showsubitems.length; i++) {
      if (showsubitems[i].item == 3) {
        dataeachitem.push(showsubitems[i]);
      }
    }
    $("#vertical-menu").modal("hide");
    titlemodal = document.getElementById("item-3-name").textContent;
    showSubItem(3, titlemodal, dataeachitem);
    if ("item-" + item_checker == "item-3") {
      $("#signs" + Subitem_checker).attr("checked", true);
      $(".sub-item" + item_checker + "-" + Subitem_checker).css(
        "display",
        "block"
      );
      $("#signs" + Subitem_checker + "-1").val(sub_item_data_checker);
    }
  } else if ($("#item-4").is(":checked")) {
    for (var i = 0; i < showsubitems.length; i++) {
      if (showsubitems[i].item == 4) {
        dataeachitem.push(showsubitems[i]);
      }
    }
    // console.log("hi im checked")
    $("#vertical-menu").modal("hide");
    titlemodal = document.getElementById("item-4-name").textContent;
    showSubItem(4, titlemodal, dataeachitem);
    if ("item-" + item_checker == "item-4") {
      $("#shield" + Subitem_checker).attr("checked", true);
      $(".sub-item" + item_checker + "-" + Subitem_checker).css(
        "display",
        "block"
      );
      $("#shield" + Subitem_checker + "-1").val(sub_item_data_checker);
    }
  } else if ($("#item-5").is(":checked")) {
    for (var i = 0; i < showsubitems.length; i++) {
      if (showsubitems[i].item == 5) {
        dataeachitem.push(showsubitems[i]);
      }
    }
    // console.log("hi im checked")
    $("#vertical-menu").modal("hide");
    titlemodal = document.getElementById("item-5-name").textContent;
    showSubItem(5, titlemodal, dataeachitem);
    if ("item-" + item_checker == "item-5") {
      $("#lighting" + Subitem_checker).attr("checked", true);
      $(".sub-item" + item_checker + "-" + Subitem_checker).css(
        "display",
        "block"
      );
      $("#lighting" + Subitem_checker + "-1").val(sub_item_data_checker);
    }
  } else if ($("#item-6").is(":checked")) {
    for (var i = 0; i < showsubitems.length; i++) {
      if (showsubitems[i].item == 6) {
        dataeachitem.push(showsubitems[i]);
      }
    }
    // console.log("hi im checked")
    $("#vertical-menu").modal("hide");
    titlemodal = document.getElementById("item-6-name").textContent;
    showSubItem(6, titlemodal, dataeachitem);
    if ("item-" + item_checker == "item-6") {
      $("#lining" + Subitem_checker).attr("checked", true);
      $(".sub-item" + item_checker + "-" + Subitem_checker).css(
        "display",
        "block"
      );
      $("#lining" + Subitem_checker + "-1").val(sub_item_data_checker);
    }
  } else if ($("#item-7").is(":checked")) {
    for (var i = 0; i < showsubitems.length; i++) {
      if (showsubitems[i].item == 7) {
        dataeachitem.push(showsubitems[i]);
      }
    }
    // console.log("hi im checked")
    $("#vertical-menu").modal("hide");
    titlemodal = document.getElementById("item-7-name").textContent;
    showSubItem(7, titlemodal, dataeachitem);
    if ("item-" + item_checker == "item-7") {
      $("#coloring" + Subitem_checker).attr("checked", true);
      $(".sub-item" + item_checker + "-" + Subitem_checker).css(
        "display",
        "block"
      );
      $("#coloring" + Subitem_checker + "-1").val(sub_item_data_checker);
    }
  } else if ($("#item-8").is(":checked")) {
    for (var i = 0; i < showsubitems.length; i++) {
      if (showsubitems[i].item == 8) {
        dataeachitem.push(showsubitems[i]);
      }
    }
    // console.log("hi im checked")
    $("#vertical-menu").modal("hide");
    titlemodal = document.getElementById("item-8-name").textContent;
    showSubItem(8, titlemodal, dataeachitem);
    if ("item-" + item_checker == "item-8") {
      $("#washing" + Subitem_checker).attr("checked", true);
      $(".sub-item" + item_checker + "-" + Subitem_checker).css(
        "display",
        "block"
      );
      $("#washing" + Subitem_checker + "-1").val(sub_item_data_checker);
    }
  } else if ($("#item-9").is(":checked")) {
    for (var i = 0; i < showsubitems.length; i++) {
      if (showsubitems[i].item == 9) {
        dataeachitem.push(showsubitems[i]);
      }
    }
    // console.log("hi im checked")
    $("#vertical-menu").modal("hide");
    titlemodal = document.getElementById("item-9-name").textContent;
    showSubItem(9, titlemodal, dataeachitem);
    if ("item-" + item_checker == "item-9") {
      $("#securing" + Subitem_checker).attr("checked", true);
      $(".sub-item" + item_checker + "-" + Subitem_checker).css(
        "display",
        "block"
      );
      $("#securing" + Subitem_checker + "-1").val(sub_item_data_checker);
    }
  } else if ($("#item-10").is(":checked")) {
    for (var i = 0; i < showsubitems.length; i++) {
      if (showsubitems[i].item == 10) {
        dataeachitem.push(showsubitems[i]);
      }
    }
    // console.log("hi im checked")
    $("#vertical-menu").modal("hide");
    titlemodal = document.getElementById("item-10-name").textContent;
    showSubItem(10, titlemodal, dataeachitem);
    if ("item-" + item_checker == "item-10") {
      $("#privacy" + Subitem_checker).attr("checked", true);
      $(".sub-item" + item_checker + "-" + Subitem_checker).css(
        "display",
        "block"
      );
      $("#privacy" + Subitem_checker + "-1").val(sub_item_data_checker);
    }
  } else if ($("#item-11").is(":checked")) {
    for (var i = 0; i < showsubitems.length; i++) {
      if (showsubitems[i].item == 11) {
        dataeachitem.push(showsubitems[i]);
      }
    }
    // console.log("hi im checked")
    $("#vertical-menu").modal("hide");
    titlemodal = document.getElementById("item-11-name").textContent;
    showSubItem(11, titlemodal, dataeachitem);
    if ("item-" + item_checker == "item-11") {
      $("#bridge" + Subitem_checker).attr("checked", true);
      $(".sub-item" + item_checker + "-" + Subitem_checker).css(
        "display",
        "block"
      );
      $("#bridge" + Subitem_checker + "-1").val(sub_item_data_checker);
    }
  } else if ($("#item-12").is(":checked")) {
    for (var i = 0; i < showsubitems.length; i++) {
      if (showsubitems[i].item == 12) {
        dataeachitem.push(showsubitems[i]);
      }
    }
    // console.log("hi im checked")
    $("#vertical-menu").modal("hide");
    titlemodal = document.getElementById("item-12-name").textContent;
    showSubItem(12, titlemodal, dataeachitem);
    if ("item-" + item_checker == "item-12") {
      $("#tunnel" + Subitem_checker).attr("checked", true);
      $(".sub-item" + item_checker + "-" + Subitem_checker).css(
        "display",
        "block"
      );
      $("#tunnel" + Subitem_checker + "-1").val(sub_item_data_checker);
    }
  } else if ($("#item-13").is(":checked")) {
    for (var i = 0; i < showsubitems.length; i++) {
      if (showsubitems[i].item == 13) {
        dataeachitem.push(showsubitems[i]);
      }
    }
    // console.log("hi im checked")
    $("#vertical-menu").modal("hide");
    titlemodal = document.getElementById("item-13-name").textContent;
    showSubItem(13, titlemodal, dataeachitem);
    if ("item-" + item_checker == "item-13") {
      $("#winterOperation" + Subitem_checker).attr("checked", true);
      $(".sub-item" + item_checker + "-" + Subitem_checker).css(
        "display",
        "block"
      );
      $("#winterOperation" + Subitem_checker + "-1").val(sub_item_data_checker);
    }
  } else if ($("#item-14").is(":checked")) {
    for (var i = 0; i < showsubitems.length; i++) {
      if (showsubitems[i].item == 14) {
        dataeachitem.push(showsubitems[i]);
      }
    }
    // console.log("hi im checked")
    $("#vertical-menu").modal("hide");
    titlemodal = document.getElementById("item-14-name").textContent;
    showSubItem(14, titlemodal, dataeachitem);
    if ("item-" + item_checker == "item-14") {
      $("#machinery" + Subitem_checker).attr("checked", true);
      console.log(".sub-item" + item_checker + "-" + Subitem_checker);
      $(".sub-item" + item_checker + "-" + Subitem_checker).css(
        "display",
        "block"
      );
      $("#machinery" + Subitem_checker + "-1").val(sub_item_data_checker);
    }
  } else if ($("#item-15").is(":checked")) {
    for (var i = 0; i < showsubitems.length; i++) {
      if (showsubitems[i].item == 15) {
        dataeachitem.push(showsubitems[i]);
      }
    }
    $("#vertical-menu").modal("hide");
    titlemodal = document.getElementById("item-15-name").textContent;
    showSubItem(15, titlemodal, dataeachitem);
    $("#tollhouse" + Subitem_checker).attr("checked", true);
    $(".sub-item" + item_checker + "-" + Subitem_checker).css(
      "display",
      "block"
    );
    $("#tollhouse" + Subitem_checker + "-1").val(sub_item_data_checker);
  } else if ($("#item-16").is(":checked")) {
    for (var i = 0; i < showsubitems.length; i++) {
      if (showsubitems[i].item == 16) {
        dataeachitem.push(showsubitems[i]);
      }
    }
    $("#vertical-menu").modal("hide");
    titlemodal = document.getElementById("item-16-name").textContent;
    showSubItem(16, titlemodal, dataeachitem);
    if ("item-" + item_checker == "item-16") {
      $("#emergency" + Subitem_checker).attr("checked", true);
      $(".sub-item" + item_checker + "-" + Subitem_checker).css(
        "display",
        "block"
      );
      $("#emergency" + Subitem_checker + "-1").val(sub_item_data_checker);
    }
  } else if ($("#item-17").is(":checked")) {
    for (var i = 0; i < showsubitems.length; i++) {
      if (showsubitems[i].item == 17) {
        dataeachitem.push(showsubitems[i]);
      }
    }
    $("#vertical-menu").modal("hide");
    titlemodal = document.getElementById("item-17-name").textContent;
    showSubItem(17, titlemodal, dataeachitem);
  } else if ($("#item-18").is(":checked")) {
    for (var i = 0; i < showsubitems.length; i++) {
      if (showsubitems[i].item == 18) {
        dataeachitem.push(showsubitems[i]);
      }
    }
    $("#vertical-menu").modal("hide");
    titlemodal = document.getElementById("item-18-name").textContent;
    showSubItem(18, titlemodal, dataeachitem);
  } else if ($("#item-19").is(":checked")) {
    for (var i = 0; i < showsubitems.length; i++) {
      if (showsubitems[i].item == 19) {
        dataeachitem.push(showsubitems[i]);
      }
    }
    // console.log("hi im checked")
    $("#vertical-menu").modal("hide");
    titlemodal = document.getElementById("item-19-name").textContent;
    showSubItem(19, titlemodal, dataeachitem);
  } else if ($("#item-20").is(":checked")) {
    $("#vertical-menu").modal("hide");
    titlemodal = document.getElementById("item-20-name").textContent;
    showSubItem(20, titlemodal, dataeachitem);
    console.log("sub_item_data_checker", sub_item_data_checker);
    $("#snowWatch1").val(sub_item_data_checker);
  }
}

function filleacharray(data) {
  var obj = {};
  for (var i = 0; i < data.length; i++) {
    obj = {
      item: data[i].item,
      item_id: data[i].item_id,
      sub_item: data[i].sub_item,
      sub_item_id: data[i].sub_item_id,
      sub_item_str: data[i].sub_item_str,
      sub_item_unit: data[i].sub_item_unit,
    };
    showsubitems.push(obj);
  }
  console.log("test", showsubitems);
  // backhearrrr
}
function showSubItem(index, name, datachoosen) {
  var appenddata = "";
  if (sourceLat != "" && destLat != "") {
    // Set modal title
    $("#uploadroaditem .modal-title").html(name);

    selectedItem = index;

    // Set modal content
    let subItems = "";
    $(".sub-item-container").empty();

    switch (selectedItem) {
      case 1: {
        for (var i = 0; i < datachoosen.length; i++) {
          subItems =
            subItems +
            '<div class="col-sm-12 sub-item">\
            <div class="form-group radio-body clearfix">\
              <div class="icheck-primary d-inline">\
                <input type="radio" id="reconstruction' +
            datachoosen[i].sub_item +
            '" name="reconstruction">\
                <label for="reconstruction' +
            datachoosen[i].sub_item +
            '">' +
            datachoosen[i].sub_item_str +
            '\
                </label>\
              </div>\
            </div>\
          </div>\
          <div class="col-sm-12 sub-item1-' +
            datachoosen[i].sub_item +
            '" style="display: none;">\
            <div class="form-group radio-body clearfix">\
              <div class="d-flex justify-content-center align-items-center">\
                <label for="reconstruction' +
            datachoosen[i].sub_item +
            '-1" class="ml-3">\
                  ' +
            datachoosen[i].sub_item_unit +
            ':\
                </label>\
                <input type="number" class="form-control text-center" style="width: 50%" id="reconstruction' +
            datachoosen[i].sub_item +
            '-1" name="reconstruction1" min="0" maxlength="7">\
              </div>\
            </div>\
          </div>';
        }

        break;
      }
      case 2: {
        for (var i = 0; i < datachoosen.length; i++) {
          subItems =
            subItems +
            '<div class="col-sm-12 sub-item">\
            <div class="form-group radio-body clearfix">\
              <div class="icheck-primary d-inline">\
                <input type="radio" id="cleaning' +
            datachoosen[i].sub_item +
            '" name="cleaning">\
                <label for="cleaning' +
            datachoosen[i].sub_item +
            '">' +
            datachoosen[i].sub_item_str +
            '\
                </label>\
              </div>\
            </div>\
          </div>\
          <div class="col-sm-12 sub-item2-' +
            datachoosen[i].sub_item +
            '" style="display: none;">\
            <div class="form-group radio-body clearfix">\
              <div class="d-flex justify-content-center align-items-center">\
                <label for="cleaning' +
            datachoosen[i].sub_item +
            '-1" class="ml-3">\
                  ' +
            datachoosen[i].sub_item_unit +
            ':\
                </label>\
                <input type="number" class="form-control text-center" style="width: 50%" id="cleaning' +
            datachoosen[i].sub_item +
            '-1" name="cleaning1" min="0" maxlength="7">\
              </div>\
            </div>\
          </div>';
        }

        break;
      }
      case 3: {
        for (var i = 0; i < datachoosen.length; i++) {
          subItems =
            subItems +
            '<div class="col-sm-12 sub-item">\
            <div class="form-group radio-body clearfix">\
              <div class="icheck-primary d-inline">\
                <input type="radio" id="signs' +
            datachoosen[i].sub_item +
            '" name="signs">\
                <label for="signs' +
            datachoosen[i].sub_item +
            '">' +
            datachoosen[i].sub_item_str +
            '\
                </label>\
              </div>\
            </div>\
          </div>\
          <div class="col-sm-12 sub-item3-' +
            datachoosen[i].sub_item +
            '" style="display: none;">\
            <div class="form-group radio-body clearfix">\
              <div class="d-flex justify-content-center align-items-center">\
                <label for="signs' +
            datachoosen[i].sub_item +
            '-1" class="ml-3">\
                  ' +
            datachoosen[i].sub_item_unit +
            ':\
                </label>\
                <input type="number" class="form-control text-center" style="width: 50%" id="signs' +
            datachoosen[i].sub_item +
            '-1" name="signs1" min="0" maxlength="7">\
              </div>\
            </div>\
          </div>';
        }

        break;
      }
      case 4: {
        for (var i = 0; i < datachoosen.length; i++) {
          subItems =
            subItems +
            '<div class="col-sm-12 sub-item">\
            <div class="form-group radio-body clearfix">\
              <div class="icheck-primary d-inline">\
                <input type="radio" id="shield' +
            datachoosen[i].sub_item +
            '" name="shield">\
                <label for="shield' +
            datachoosen[i].sub_item +
            '">' +
            datachoosen[i].sub_item_str +
            '\
                </label>\
              </div>\
            </div>\
          </div>\
          <div class="col-sm-12 sub-item4-' +
            datachoosen[i].sub_item +
            '" style="display: none;">\
            <div class="form-group radio-body clearfix">\
              <div class="d-flex justify-content-center align-items-center">\
                <label for="shield' +
            datachoosen[i].sub_item +
            '-1" class="ml-3">\
                  ' +
            datachoosen[i].sub_item_unit +
            ':\
                </label>\
                <input type="number" class="form-control text-center" style="width: 50%" id="shield' +
            datachoosen[i].sub_item +
            '-1" name="shield1" min="0" maxlength="7">\
              </div>\
            </div>\
          </div>';
        }
        break;
      }
      case 5: {
        for (var i = 0; i < datachoosen.length; i++) {
          subItems =
            subItems +
            '<div class="col-sm-12 sub-item">\
            <div class="form-group radio-body clearfix">\
              <div class="icheck-primary d-inline">\
                <input type="radio" id="lighting' +
            datachoosen[i].sub_item +
            '" name="lighting">\
                <label for="lighting' +
            datachoosen[i].sub_item +
            '">' +
            datachoosen[i].sub_item_str +
            '\
                </label>\
              </div>\
            </div>\
          </div>\
          <div class="col-sm-12 sub-item5-' +
            datachoosen[i].sub_item +
            '" style="display: none;">\
            <div class="form-group radio-body clearfix">\
              <div class="d-flex justify-content-center align-items-center">\
                <label for="lighting' +
            datachoosen[i].sub_item +
            '-1" class="ml-3">\
                  ' +
            datachoosen[i].sub_item_unit +
            ':\
                </label>\
                <input type="number" class="form-control text-center" style="width: 50%" id="lighting' +
            datachoosen[i].sub_item +
            '-1" name="lighting1" min="0" maxlength="7">\
              </div>\
            </div>\
          </div>';
        }
        break;
      }
      case 6: {
        for (var i = 0; i < datachoosen.length; i++) {
          subItems =
            subItems +
            '<div class="col-sm-12 sub-item">\
            <div class="form-group radio-body clearfix">\
              <div class="icheck-primary d-inline">\
                <input type="radio" id="lining' +
            datachoosen[i].sub_item +
            '" name="lining">\
                <label for="lining' +
            datachoosen[i].sub_item +
            '">' +
            datachoosen[i].sub_item_str +
            '\
                </label>\
              </div>\
            </div>\
          </div>\
          <div class="col-sm-12 sub-item6-' +
            datachoosen[i].sub_item +
            '" style="display: none;">\
            <div class="form-group radio-body clearfix">\
              <div class="d-flex justify-content-center align-items-center">\
                <label for="lining' +
            datachoosen[i].sub_item +
            '-1" class="ml-3">\
                  ' +
            datachoosen[i].sub_item_unit +
            ':\
                </label>\
                <input type="number" class="form-control text-center" style="width: 50%" id="lining' +
            datachoosen[i].sub_item +
            '-1" name="lining1" min="0" maxlength="7">\
              </div>\
            </div>\
          </div>';
        }
        break;
      }
      case 7: {
        for (var i = 0; i < datachoosen.length; i++) {
          subItems =
            subItems +
            '<div class="col-sm-12 sub-item">\
            <div class="form-group radio-body clearfix">\
              <div class="icheck-primary d-inline">\
                <input type="radio" id="coloring' +
            datachoosen[i].sub_item +
            '" name="coloring">\
                <label for="coloring' +
            datachoosen[i].sub_item +
            '">' +
            datachoosen[i].sub_item_str +
            '\
                </label>\
              </div>\
            </div>\
          </div>\
          <div class="col-sm-12 sub-item7-' +
            datachoosen[i].sub_item +
            '" style="display: none;">\
            <div class="form-group radio-body clearfix">\
              <div class="d-flex justify-content-center align-items-center">\
                <label for="coloring' +
            datachoosen[i].sub_item +
            '-1" class="ml-3">\
                  ' +
            datachoosen[i].sub_item_unit +
            ':\
                </label>\
                <input type="number" class="form-control text-center" style="width: 50%" id="coloring' +
            datachoosen[i].sub_item +
            '-1" name="coloring1" min="0" maxlength="7">\
              </div>\
            </div>\
          </div>';
        }
        break;
      }
      case 8: {
        for (var i = 0; i < datachoosen.length; i++) {
          subItems =
            subItems +
            '<div class="col-sm-12 sub-item">\
            <div class="form-group radio-body clearfix">\
              <div class="icheck-primary d-inline">\
                <input type="radio" id="washing' +
            datachoosen[i].sub_item +
            '" name="washing">\
                <label for="washing' +
            datachoosen[i].sub_item +
            '">' +
            datachoosen[i].sub_item_str +
            '\
                </label>\
              </div>\
            </div>\
          </div>\
          <div class="col-sm-12 sub-item8-' +
            datachoosen[i].sub_item +
            '" style="display: none;">\
            <div class="form-group radio-body clearfix">\
              <div class="d-flex justify-content-center align-items-center">\
                <label for="washing' +
            datachoosen[i].sub_item +
            '-1" class="ml-3">\
                  ' +
            datachoosen[i].sub_item_unit +
            ':\
                </label>\
                <input type="number" class="form-control text-center" style="width: 50%" id="washing' +
            datachoosen[i].sub_item +
            '-1" name="washing1" min="0" maxlength="7">\
              </div>\
            </div>\
          </div>';
        }
      }
      case 9: {
        for (var i = 0; i < datachoosen.length; i++) {
          subItems =
            subItems +
            '<div class="col-sm-12 sub-item">\
            <div class="form-group radio-body clearfix">\
              <div class="icheck-primary d-inline">\
                <input type="radio" id="securing' +
            datachoosen[i].sub_item +
            '" name="securing">\
                <label for="securing' +
            datachoosen[i].sub_item +
            '">' +
            datachoosen[i].sub_item_str +
            '\
                </label>\
              </div>\
            </div>\
          </div>\
          <div class="col-sm-12 sub-item9-' +
            datachoosen[i].sub_item +
            '" style="display: none;">\
            <div class="form-group radio-body clearfix">\
              <div class="d-flex justify-content-center align-items-center">\
                <label for="securing' +
            datachoosen[i].sub_item +
            '-1" class="ml-3">\
                  ' +
            datachoosen[i].sub_item_unit +
            ':\
                </label>\
                <input type="number" class="form-control text-center" style="width: 50%" id="securing' +
            datachoosen[i].sub_item +
            '-1" name="securing1" min="0" maxlength="7">\
              </div>\
            </div>\
          </div>';
        }
        break;
      }
      case 10: {
        for (var i = 0; i < datachoosen.length; i++) {
          subItems =
            subItems +
            '<div class="col-sm-12 sub-item">\
            <div class="form-group radio-body clearfix">\
              <div class="icheck-primary d-inline">\
                <input type="radio" id="privacy' +
            datachoosen[i].sub_item +
            '" name="privacy">\
                <label for="privacy' +
            datachoosen[i].sub_item +
            '">' +
            datachoosen[i].sub_item_str +
            '\
                </label>\
              </div>\
            </div>\
          </div>\
          <div class="col-sm-12 sub-item10-' +
            datachoosen[i].sub_item +
            '" style="display: none;">\
            <div class="form-group radio-body clearfix">\
              <div class="d-flex justify-content-center align-items-center">\
                <label for="privacy' +
            datachoosen[i].sub_item +
            '-1" class="ml-3">\
                  ' +
            datachoosen[i].sub_item_unit +
            ':\
                </label>\
                <input type="number" class="form-control text-center" style="width: 50%" id="privacy' +
            datachoosen[i].sub_item +
            '-1" name="privacy1" min="0" maxlength="7">\
              </div>\
            </div>\
          </div>';
        }
        break;
      }
      case 11: {
        for (var i = 0; i < datachoosen.length; i++) {
          subItems =
            subItems +
            '<div class="col-sm-12 sub-item">\
            <div class="form-group radio-body clearfix">\
              <div class="icheck-primary d-inline">\
                <input type="radio" id="bridge' +
            datachoosen[i].sub_item +
            '" name="bridge">\
                <label for="bridge' +
            datachoosen[i].sub_item +
            '">' +
            datachoosen[i].sub_item_str +
            '\
                </label>\
              </div>\
            </div>\
          </div>\
          <div class="col-sm-12 sub-item11-' +
            datachoosen[i].sub_item +
            '" style="display: none;">\
            <div class="form-group radio-body clearfix">\
              <div class="d-flex justify-content-center align-items-center">\
                <label for="bridge' +
            datachoosen[i].sub_item +
            '-1" class="ml-3">\
                  ' +
            datachoosen[i].sub_item_unit +
            ':\
                </label>\
                <input type="number" class="form-control text-center" style="width: 50%" id="bridge' +
            datachoosen[i].sub_item +
            '-1" name="bridge1" min="0" maxlength="7">\
              </div>\
            </div>\
          </div>';
        }
        break;
      }
      case 12: {
        for (var i = 0; i < datachoosen.length; i++) {
          subItems =
            subItems +
            '<div class="col-sm-12 sub-item">\
            <div class="form-group radio-body clearfix">\
              <div class="icheck-primary d-inline">\
                <input type="radio" id="tunnel' +
            datachoosen[i].sub_item +
            '" name="tunnel">\
                <label for="tunnel' +
            datachoosen[i].sub_item +
            '">' +
            datachoosen[i].sub_item_str +
            '\
                </label>\
              </div>\
            </div>\
          </div>\
          <div class="col-sm-12 sub-item12-' +
            datachoosen[i].sub_item +
            '" style="display: none;">\
            <div class="form-group radio-body clearfix">\
              <div class="d-flex justify-content-center align-items-center">\
                <label for="tunnel' +
            datachoosen[i].sub_item +
            '-1" class="ml-3">\
                  ' +
            datachoosen[i].sub_item_unit +
            ':\
                </label>\
                <input type="number" class="form-control text-center" style="width: 50%" id="tunnel' +
            datachoosen[i].sub_item +
            '-1" name="tunnel1" min="0" maxlength="7">\
              </div>\
            </div>\
          </div>';
        }
        break;
      }
      case 13: {
        for (var i = 0; i < datachoosen.length; i++) {
          console.log("lezgi", datachoosen.length);
          subItems =
            subItems +
            '<div class="col-sm-12 sub-item">\
            <div class="form-group radio-body clearfix">\
              <div class="icheck-primary d-inline">\
                <input type="radio" id="winterOperation' +
            datachoosen[i].sub_item +
            '" name="winterOperation">\
                <label for="winterOperation' +
            datachoosen[i].sub_item +
            '">' +
            datachoosen[i].sub_item_str +
            '\
                </label>\
              </div>\
            </div>\
          </div>\
          <div class="col-sm-12 sub-item13-' +
            datachoosen[i].sub_item +
            '" style="display: none;">\
            <div class="form-group radio-body clearfix">\
              <div class="d-flex justify-content-center align-items-center">\
                <label for="winterOperation' +
            datachoosen[i].sub_item +
            '-1" class="ml-3">\
                  ' +
            datachoosen[i].sub_item_unit +
            ':\
                </label>\
                <input type="number" class="form-control text-center" style="width: 50%" id="winterOperation' +
            datachoosen[i].sub_item +
            '-1" name="winterOperation1" min="0" maxlength="7">\
              </div>\
            </div>\
          </div>';
        }

        break;
      }
      case 14: {
        for (var i = 0; i < datachoosen.length; i++) {
          subItems =
            subItems +
            '<div class="col-sm-12 sub-item">\
            <div class="form-group radio-body clearfix">\
              <div class="icheck-primary d-inline">\
                <input type="radio" id="machinery' +
            datachoosen[i].sub_item +
            '" name="machinery">\
                <label for="machinery' +
            datachoosen[i].sub_item +
            '">' +
            datachoosen[i].sub_item_str +
            '\
                </label>\
              </div>\
            </div>\
          </div>\
          <div class="col-sm-12 sub-item14-' +
            datachoosen[i].sub_item +
            '" style="display: none;">\
            <div class="form-group radio-body clearfix">\
              <div class="d-flex justify-content-center align-items-center">\
                <label for="machinery' +
            datachoosen[i].sub_item +
            '-1" class="ml-3">\
                  ' +
            datachoosen[i].sub_item_unit +
            ':\
                </label>\
                <input type="number" class="form-control text-center" style="width: 50%" id="machinery' +
            datachoosen[i].sub_item +
            '-1" name="machinery1" min="0" maxlength="7">\
              </div>\
            </div>\
          </div>';
        }

        break;
      }
      case 15: {
        for (var i = 0; i < datachoosen.length; i++) {
          subItems =
            subItems +
            '<div class="col-sm-12 sub-item">\
            <div class="form-group radio-body clearfix">\
              <div class="icheck-primary d-inline">\
                <input type="radio" id="tollhouse' +
            datachoosen[i].sub_item +
            '" name="tollhouse">\
                <label for="tollhouse' +
            datachoosen[i].sub_item +
            '">' +
            datachoosen[i].sub_item_str +
            '\
                </label>\
              </div>\
            </div>\
          </div>\
          <div class="col-sm-12 sub-item15-' +
            datachoosen[i].sub_item +
            '" style="display: none;">\
            <div class="form-group radio-body clearfix">\
              <div class="d-flex justify-content-center align-items-center">\
                <label for="tollhouse' +
            datachoosen[i].sub_item +
            '-1" class="ml-3">\
                  ' +
            datachoosen[i].sub_item_unit +
            ':\
                </label>\
                <input type="number" class="form-control text-center" style="width: 50%" id="tollhouse' +
            datachoosen[i].sub_item +
            '-1" name="tollhouse1" min="0" maxlength="7">\
              </div>\
            </div>\
          </div>';
        }

        break;
      }
      case 16: {
        for (var i = 0; i < datachoosen.length; i++) {
          subItems =
            subItems +
            '<div class="col-sm-12 sub-item">\
            <div class="form-group radio-body clearfix">\
              <div class="icheck-primary d-inline">\
                <input type="radio" id="emergency' +
            datachoosen[i].sub_item +
            '" name="emergency">\
                <label for="emergency' +
            datachoosen[i].sub_item +
            '">' +
            datachoosen[i].sub_item_str +
            '\
                </label>\
              </div>\
            </div>\
          </div>\
          <div class="col-sm-12 sub-item16-' +
            datachoosen[i].sub_item +
            '" style="display: none;">\
            <div class="form-group radio-body clearfix">\
              <div class="d-flex justify-content-center align-items-center">\
                <label for="emergency' +
            datachoosen[i].sub_item +
            '-1" class="ml-3">\
                  ' +
            datachoosen[i].sub_item_unit +
            ':\
                </label>\
                <input type="number" class="form-control text-center" style="width: 50%" id="emergency' +
            datachoosen[i].sub_item +
            '-1" name="emergency1" min="0" maxlength="7">\
              </div>\
            </div>\
          </div>';
        }
        break;
      }
      case 20: {
        subItems =
          '\
          <div class="col-sm-12 sub-item17">\
            <div class="form-group radio-body clearfix">\
              <div class="d-flex justify-content-start align-items-center">\
                <label for="snowWatch" class="ml-3">توضیح:</label>\
                <textarea row="4" cols="45" class="form-control" style="height: 120px; resize: none;" id="snowWatch1" name="snowWatch"></textarea>\
              </div>\
            </div>\
          </div>\
        ';
        break;
      }
    }
    $(".sub-item-container").append(subItems);

    $("#uploadroaditem").modal({ backdrop: "static", keyboard: false });

    // Show modal
    $("#uploadroaditem").modal("show");

    // Load necessary scripts
    actionAfterShowModal(selectedItem);
  } else {
    // Don't allow user to select option without selecting location
  }
}

function actionAfterShowModal(index) {
  var myInput = document.querySelectorAll("input[type=number]");

  function keyAllowed(key) {
    var keys = [
      8, 9, 13, 16, 17, 18, 19, 20, 27, 46, 48, 49, 50, 51, 52, 53, 54, 55, 56,
      57, 91, 92, 93,
    ];
    if (key && keys.indexOf(key) === -1) return false;
    else return true;
  }

  myInput.forEach(function (element) {
    element.addEventListener(
      "keypress",
      function (e) {
        // alert("hiiiiiiiiiiiiiiiiiiiiiiii")
        var key = !isNaN(e.charCode) ? e.charCode : e.keyCode;
        if (!keyAllowed(key)) e.preventDefault();
      },
      false
    );

    // Disable pasting of non-numbers
    element.addEventListener(
      "paste",
      function (e) {
        var pasteData = e.clipboardData.getData("text/plain");
        if (pasteData.match(/[^0-9]/)) e.preventDefault();
      },
      false
    );
  });
  switch (index) {
    //this this

    case 1: {
      let selectedSubItemsArray = selectedSubItems.split("-");
      // console.log(selectedSubItemsArray);

      if (
        selectedItem == previousSelectedItem ||
        (itemsData != null && selectedItem == itemsData.item)
      ) {
        for (let i = 1; i < 14; i++) {
          if (selectedSubItemsArray.indexOf(i.toString()) != -1) {
            $('input[id="reconstruction' + i + '"]').prop("checked", true);
            $(".sub-item" + index + "-" + i).show("slow");
          }
        }

        if (!$.isEmptyObject(subItemsData)) {
          for (const [key, value] of Object.entries(subItemsData)) {
            // console.log(key, value);
            $("#" + key).val(value);
          }
        }
      }

      $('input[id="reconstruction1"]').on("click", function () {
        $(".sub-item1-1").show("slow");
        for (let i = 1; i < 14; i++) {
          // if (i == 1) continue;
          if (!$("#reconstruction" + i).is(":checked")) {
            $(".sub-item1-" + i).hide("slow");
          }
        }
      });
      $('input[id="reconstruction2"]').on("click", function () {
        $(".sub-item1-2").show("slow");
        for (let i = 1; i < 14; i++) {
          // if (i == 2) continue;
          if (!$("#reconstruction" + i).is(":checked")) {
            $(".sub-item1-" + i).hide("slow");
          }
        }
      });
      $('input[id="reconstruction3"]').on("click", function () {
        $(".sub-item1-3").show("slow");
        for (let i = 1; i < 14; i++) {
          // if (i == 3) continue;
          if (!$("#reconstruction" + i).is(":checked")) {
            $(".sub-item1-" + i).hide("slow");
          }
        }
      });
      $('input[id="reconstruction4"]').on("click", function () {
        $(".sub-item1-4").show("slow");
        for (let i = 1; i < 14; i++) {
          // if (i == 4) continue;
          if (!$("#reconstruction" + i).is(":checked")) {
            $(".sub-item1-" + i).hide("slow");
          }
        }
      });
      $('input[id="reconstruction5"]').on("click", function () {
        $(".sub-item1-5").show("slow");
        for (let i = 1; i < 14; i++) {
          // if (i == 5) continue;
          if (!$("#reconstruction" + i).is(":checked")) {
            $(".sub-item1-" + i).hide("slow");
          }
        }
      });
      $('input[id="reconstruction6"]').on("click", function () {
        $(".sub-item1-6").show("slow");
        for (let i = 1; i < 14; i++) {
          // if (i == 6) continue;
          if (!$("#reconstruction" + i).is(":checked")) {
            $(".sub-item1-" + i).hide("slow");
          }
        }
      });
      $('input[id="reconstruction7"]').on("click", function () {
        $(".sub-item1-7").show("slow");
        for (let i = 1; i < 14; i++) {
          // if (i == 6) continue;
          if (!$("#reconstruction" + i).is(":checked")) {
            $(".sub-item1-" + i).hide("slow");
          }
        }
      });
      $('input[id="reconstruction8"]').on("click", function () {
        $(".sub-item1-8").show("slow");
        0;
        for (let i = 1; i < 14; i++) {
          // if (i == 6) continue;
          if (!$("#reconstruction" + i).is(":checked")) {
            $(".sub-item1-" + i).hide("slow");
          }
        }
      });
      $('input[id="reconstruction9"]').on("click", function () {
        $(".sub-item1-9").show("slow");
        for (let i = 1; i < 14; i++) {
          // if (i == 6) continue;
          if (!$("#reconstruction" + i).is(":checked")) {
            $(".sub-item1-" + i).hide("slow");
          }
        }
      });
      $('input[id="reconstruction10"]').on("click", function () {
        $(".sub-item1-10").show("slow");
        for (let i = 1; i < 14; i++) {
          // if (i == 6) continue;
          if (!$("#reconstruction" + i).is(":checked")) {
            $(".sub-item1-" + i).hide("slow");
          }
        }
      });
      $('input[id="reconstruction11"]').on("click", function () {
        $(".sub-item1-11").show("slow");
        for (let i = 1; i < 14; i++) {
          // if (i == 6) continue;
          if (!$("#reconstruction" + i).is(":checked")) {
            $(".sub-item1-" + i).hide("slow");
          }
        }
      });
      $('input[id="reconstruction12"]').on("click", function () {
        $(".sub-item1-12").show("slow");
        for (let i = 1; i < 14; i++) {
          // if (i == 6) continue;
          if (!$("#reconstruction" + i).is(":checked")) {
            $(".sub-item1-" + i).hide("slow");
          }
        }
      });
      $('input[id="reconstruction13"]').on("click", function () {
        $(".sub-item1-13").show("slow");
        for (let i = 1; i < 14; i++) {
          // if (i == 6) continue;
          if (!$("#reconstruction" + i).is(":checked")) {
            $(".sub-item1-" + i).hide("slow");
          }
        }
      });

      break;
    }
    case 2: {
      let selectedSubItemsArray = selectedSubItems.split("-");

      if (
        selectedItem == previousSelectedItem ||
        (itemsData != null && selectedItem == itemsData.item)
      ) {
        for (let i = 1; i < 20; i++) {
          if (selectedSubItemsArray.indexOf(i.toString()) != -1) {
            $('input[id="cleaning' + i + '"]').prop("checked", true);
            $(".sub-item" + index + "-" + i).show("slow");
          }
        }

        if (!$.isEmptyObject(subItemsData)) {
          for (const [key, value] of Object.entries(subItemsData)) {
            // console.log(key, value);
            $("#" + key).val(value);
          }
        }
      }

      $('input[id="cleaning1"]').on("click", function () {
        $(".sub-item2-1").show("slow");
        for (let i = 1; i < 20; i++) {
          // if (i == 1) continue;
          if (!$("#cleaning" + i).is(":checked")) {
            $(".sub-item2-" + i).hide("slow");
          }
        }
      });
      $('input[id="cleaning2"]').on("click", function () {
        $(".sub-item2-2").show("slow");
        for (let i = 1; i < 20; i++) {
          // if (i == 2) continue;
          if (!$("#cleaning" + i).is(":checked")) {
            $(".sub-item2-" + i).hide("slow");
          }
        }
      });
      $('input[id="cleaning3"]').on("click", function () {
        $(".sub-item2-3").show("slow");
        for (let i = 1; i < 20; i++) {
          // if (i == 3) continue;
          if (!$("#cleaning" + i).is(":checked")) {
            $(".sub-item2-" + i).hide("slow");
          }
        }
      });
      $('input[id="cleaning4"]').on("click", function () {
        $(".sub-item2-4").show("slow");
        for (let i = 1; i < 20; i++) {
          // if (i == 4) continue;
          if (!$("#cleaning" + i).is(":checked")) {
            $(".sub-item2-" + i).hide("slow");
          }
        }
      });
      $('input[id="cleaning5"]').on("click", function () {
        $(".sub-item2-5").show("slow");
        for (let i = 1; i < 20; i++) {
          // if (i == 5) continue;
          if (!$("#cleaning" + i).is(":checked")) {
            $(".sub-item2-" + i).hide("slow");
          }
        }
      });
      $('input[id="cleaning6"]').on("click", function () {
        $(".sub-item2-6").show("slow");
        for (let i = 1; i < 20; i++) {
          // if (i == 6) continue;
          if (!$("#cleaning" + i).is(":checked")) {
            $(".sub-item2-" + i).hide("slow");
          }
        }
      });
      $('input[id="cleaning7"]').on("click", function () {
        $(".sub-item2-7").show("slow");
        for (let i = 1; i < 20; i++) {
          // if (i == 7) continue;
          if (!$("#cleaning" + i).is(":checked")) {
            $(".sub-item2-" + i).hide("slow");
          }
        }
      });
      $('input[id="cleaning8"]').on("click", function () {
        $(".sub-item2-8").show("slow");
        for (let i = 1; i < 20; i++) {
          // if (i == 8) continue;
          if (!$("#cleaning" + i).is(":checked")) {
            $(".sub-item2-" + i).hide("slow");
          }
        }
      });
      $('input[id="cleaning9"]').on("click", function () {
        $(".sub-item2-9").show("slow");
        for (let i = 1; i < 20; i++) {
          // if (i == 8) continue;
          if (!$("#cleaning" + i).is(":checked")) {
            $(".sub-item2-" + i).hide("slow");
          }
        }
      });
      $('input[id="cleaning10"]').on("click", function () {
        $(".sub-item2-10").show("slow");
        for (let i = 1; i < 20; i++) {
          // if (i == 8) continue;
          if (!$("#cleaning" + i).is(":checked")) {
            $(".sub-item2-" + i).hide("slow");
          }
        }
      });
      $('input[id="cleaning11"]').on("click", function () {
        $(".sub-item2-11").show("slow");
        for (let i = 1; i < 20; i++) {
          // if (i == 8) continue;
          if (!$("#cleaning" + i).is(":checked")) {
            $(".sub-item2-" + i).hide("slow");
          }
        }
      });
      $('input[id="cleaning12"]').on("click", function () {
        $(".sub-item2-12").show("slow");
        for (let i = 1; i < 20; i++) {
          // if (i == 8) continue;
          if (!$("#cleaning" + i).is(":checked")) {
            $(".sub-item2-" + i).hide("slow");
          }
        }
      });
      $('input[id="cleaning13"]').on("click", function () {
        $(".sub-item2-13").show("slow");
        for (let i = 1; i < 20; i++) {
          // if (i == 8) continue;
          if (!$("#cleaning" + i).is(":checked")) {
            $(".sub-item2-" + i).hide("slow");
          }
        }
      });
      $('input[id="cleaning14"]').on("click", function () {
        $(".sub-item2-14").show("slow");
        for (let i = 1; i < 20; i++) {
          // if (i == 8) continue;
          if (!$("#cleaning" + i).is(":checked")) {
            $(".sub-item2-" + i).hide("slow");
          }
        }
      });
      $('input[id="cleaning15"]').on("click", function () {
        $(".sub-item2-15").show("slow");
        for (let i = 1; i < 20; i++) {
          // if (i == 8) continue;
          if (!$("#cleaning" + i).is(":checked")) {
            $(".sub-item2-" + i).hide("slow");
          }
        }
      });
      $('input[id="cleaning16"]').on("click", function () {
        $(".sub-item2-16").show("slow");
        for (let i = 1; i < 20; i++) {
          // if (i == 8) continue;
          if (!$("#cleaning" + i).is(":checked")) {
            $(".sub-item2-" + i).hide("slow");
          }
        }
      });
      $('input[id="cleaning17"]').on("click", function () {
        $(".sub-item2-17").show("slow");
        for (let i = 1; i < 20; i++) {
          // if (i == 8) continue;
          if (!$("#cleaning" + i).is(":checked")) {
            $(".sub-item2-" + i).hide("slow");
          }
        }
      });
      $('input[id="cleaning18"]').on("click", function () {
        $(".sub-item2-18").show("slow");
        for (let i = 1; i < 20; i++) {
          // if (i == 8) continue;
          if (!$("#cleaning" + i).is(":checked")) {
            $(".sub-item2-" + i).hide("slow");
          }
        }
      });
      $('input[id="cleaning19"]').on("click", function () {
        $(".sub-item2-19").show("slow");
        for (let i = 1; i < 20; i++) {
          // if (i == 8) continue;
          if (!$("#cleaning" + i).is(":checked")) {
            $(".sub-item2-" + i).hide("slow");
          }
        }
      });
      break;
    }
    case 3: {
      let selectedSubItemsArray = selectedSubItems.split("-");

      if (
        selectedItem == previousSelectedItem ||
        (itemsData != null && selectedItem == itemsData.item)
      ) {
        for (let i = 1; i < 5; i++) {
          if (selectedSubItemsArray.indexOf(i.toString()) != -1) {
            $('input[id="signs' + i + '"]').prop("checked", true);
            $(".sub-item" + index + "-" + i).show("slow");
          }
        }

        if (!$.isEmptyObject(subItemsData)) {
          for (const [key, value] of Object.entries(subItemsData)) {
            // console.log(key, value);
            $("#" + key).val(value);
          }
        }
      }

      $('input[id="signs1"]').on("click", function () {
        $(".sub-item3-1").show("slow");
        for (let i = 1; i < 9; i++) {
          // if (i == 1) continue;
          if (!$("#signs" + i).is(":checked")) {
            $(".sub-item3-" + i).hide("slow");
          }
        }
      });
      $('input[id="signs2"]').on("click", function () {
        $(".sub-item3-2").show("slow");
        for (let i = 1; i < 9; i++) {
          // if (i == 2) continue;
          if (!$("#signs" + i).is(":checked")) {
            $(".sub-item3-" + i).hide("slow");
          }
        }
      });
      $('input[id="signs3"]').on("click", function () {
        $(".sub-item3-3").show("slow");
        for (let i = 1; i < 9; i++) {
          // if (i == 3) continue;
          if (!$("#signs" + i).is(":checked")) {
            $(".sub-item3-" + i).hide("slow");
          }
        }
      });
      $('input[id="signs4"]').on("click", function () {
        $(".sub-item3-4").show("slow");
        for (let i = 1; i < 9; i++) {
          // if (i == 4) continue;
          if (!$("#signs" + i).is(":checked")) {
            $(".sub-item3-" + i).hide("slow");
          }
        }
      });
      $('input[id="signs5"]').on("click", function () {
        $(".sub-item3-5").show("slow");
        for (let i = 1; i < 9; i++) {
          // if (i == 4) continue;
          if (!$("#signs" + i).is(":checked")) {
            $(".sub-item3-" + i).hide("slow");
          }
        }
      });
      $('input[id="signs6"]').on("click", function () {
        $(".sub-item3-6").show("slow");
        for (let i = 1; i < 9; i++) {
          // if (i == 4) continue;
          if (!$("#signs" + i).is(":checked")) {
            $(".sub-item3-" + i).hide("slow");
          }
        }
      });
      $('input[id="signs7"]').on("click", function () {
        $(".sub-item3-7").show("slow");
        for (let i = 1; i < 9; i++) {
          // if (i == 4) continue;
          if (!$("#signs" + i).is(":checked")) {
            $(".sub-item3-" + i).hide("slow");
          }
        }
      });
      $('input[id="signs8"]').on("click", function () {
        $(".sub-item3-8").show("slow");
        for (let i = 1; i < 9; i++) {
          // if (i == 4) continue;
          if (!$("#signs" + i).is(":checked")) {
            $(".sub-item3-" + i).hide("slow");
          }
        }
      });
      $('input[id="signs9"]').on("click", function () {
        $(".sub-item3-9").show("slow");
        for (let i = 1; i < 9; i++) {
          // if (i == 4) continue;
          if (!$("#signs" + i).is(":checked")) {
            $(".sub-item3-" + i).hide("slow");
          }
        }
      });
      break;
    }
    case 4: {
      let selectedSubItemsArray = selectedSubItems.split("-");

      if (
        selectedItem == previousSelectedItem ||
        (itemsData != null && selectedItem == itemsData.item)
      ) {
        for (let i = 1; i < 4; i++) {
          if (selectedSubItemsArray.indexOf(i.toString()) != -1) {
            $('input[id="shield' + i + '"]').prop("checked", true);
            $(".sub-item" + index + "-" + i).show("slow");
          }
        }

        if (!$.isEmptyObject(subItemsData)) {
          for (const [key, value] of Object.entries(subItemsData)) {
            // console.log(key, value);
            if (value === true) {
              // Is RadioButton || Checkbox
              $("#" + key).prop("checked", true);
            } else {
              console.log(key, value);
              $("#" + key).val(value);
            }
          }
        }
      }

      $('input[id="shield1"]').on("click", function () {
        $(".sub-item4-1").show("slow");
        for (let i = 1; i < 4; i++) {
          // if (i == 1) continue;
          if (!$("#shield" + i).is(":checked")) {
            $(".sub-item4-" + i).hide("slow");
          }
        }
      });
      $('input[id="shield2"]').on("click", function () {
        $(".sub-item4-2").show("slow");
        for (let i = 1; i < 4; i++) {
          // if (i == 2) continue;
          if (!$("#shield" + i).is(":checked")) {
            $(".sub-item4-" + i).hide("slow");
          }
        }
      });
      $('input[id="shield3"]').on("click", function () {
        $(".sub-item4-3").show("slow");
        for (let i = 1; i < 4; i++) {
          // if (i == 3) continue;
          if (!$("#shield" + i).is(":checked")) {
            $(".sub-item4-" + i).hide("slow");
          }
        }
      });
      break;
    }
    case 5: {
      let selectedSubItemsArray = selectedSubItems.split("-");

      if (
        selectedItem == previousSelectedItem ||
        (itemsData != null && selectedItem == itemsData.item)
      ) {
        for (let i = 1; i < 12; i++) {
          if (selectedSubItemsArray.indexOf(i.toString()) != -1) {
            $('input[id="lighting' + i + '"]').prop("checked", true);
            $(".sub-item" + index + "-" + i).show("slow");
          }
        }

        if (!$.isEmptyObject(subItemsData)) {
          for (const [key, value] of Object.entries(subItemsData)) {
            if (value === true) {
              $("#" + key).prop("checked", true);
            } else {
              $("#" + key).val(value);
            }
          }
        }
      }

      $('input[id="lighting1"]').on("click", function () {
        $(".sub-item5-1").show("slow");
        for (let i = 1; i < 12; i++) {
          if (!$("#lighting" + i).is(":checked")) {
            $(".sub-item5-" + i).hide("slow");
          }
        }
      });
      $('input[id="lighting2"]').on("click", function () {
        $(".sub-item5-2").show("slow");
        for (let i = 1; i < 12; i++) {
          if (!$("#lighting" + i).is(":checked")) {
            $(".sub-item5-" + i).hide("slow");
          }
        }
      });
      $('input[id="lighting3"]').on("click", function () {
        $(".sub-item5-3").show("slow");
        for (let i = 1; i < 12; i++) {
          if (!$("#lighting" + i).is(":checked")) {
            $(".sub-item5-" + i).hide("slow");
          }
        }
      });
      $('input[id="lighting4"]').on("click", function () {
        $(".sub-item5-4").show("slow");
        for (let i = 1; i < 12; i++) {
          if (!$("#lighting" + i).is(":checked")) {
            $(".sub-item5-" + i).hide("slow");
          }
        }
      });
      $('input[id="lighting5"]').on("click", function () {
        $(".sub-item5-5").show("slow");
        for (let i = 1; i < 12; i++) {
          if (!$("#lighting" + i).is(":checked")) {
            $(".sub-item5-" + i).hide("slow");
          }
        }
      });
      $('input[id="lighting6"]').on("click", function () {
        $(".sub-item5-6").show("slow");
        for (let i = 1; i < 12; i++) {
          if (!$("#lighting" + i).is(":checked")) {
            $(".sub-item5-" + i).hide("slow");
          }
        }
      });
      $('input[id="lighting7"]').on("click", function () {
        $(".sub-item5-7").show("slow");
        for (let i = 1; i < 12; i++) {
          if (!$("#lighting" + i).is(":checked")) {
            $(".sub-item5-" + i).hide("slow");
          }
        }
      });
      $('input[id="lighting8"]').on("click", function () {
        $(".sub-item5-8").show("slow");
        for (let i = 1; i < 12; i++) {
          if (!$("#lighting" + i).is(":checked")) {
            $(".sub-item5-" + i).hide("slow");
          }
        }
      });
      $('input[id="lighting9"]').on("click", function () {
        $(".sub-item5-9").show("slow");
        for (let i = 1; i < 12; i++) {
          if (!$("#lighting" + i).is(":checked")) {
            $(".sub-item5-" + i).hide("slow");
          }
        }
      });
      $('input[id="lighting10"]').on("click", function () {
        $(".sub-item5-10").show("slow");
        for (let i = 1; i < 12; i++) {
          if (!$("#lighting" + i).is(":checked")) {
            $(".sub-item5-" + i).hide("slow");
          }
        }
      });
      $('input[id="lighting11"]').on("click", function () {
        $(".sub-item5-11").show("slow");
        for (let i = 1; i < 12; i++) {
          if (!$("#lighting" + i).is(":checked")) {
            $(".sub-item5-" + i).hide("slow");
          }
        }
      });
      break;
    }
    case 6: {
      let selectedSubItemsArray = selectedSubItems.split("-");

      if (
        selectedItem == previousSelectedItem ||
        (itemsData != null && selectedItem == itemsData.item)
      ) {
        for (let i = 1; i < 4; i++) {
          if (selectedSubItemsArray.indexOf(i.toString()) != -1) {
            $('input[id="lining' + i + '"]').prop("checked", true);
            $(".sub-item" + index + "-" + i).show("slow");
          }
        }

        if (!$.isEmptyObject(subItemsData)) {
          for (const [key, value] of Object.entries(subItemsData)) {
            // console.log(key, value);
            $("#" + key).val(value);
          }
        }
      }

      $('input[id="lining1"]').on("click", function () {
        $(".sub-item6-1").show("slow");
        for (let i = 1; i < 4; i++) {
          if (!$("#lining" + i).is(":checked")) {
            $(".sub-item6-" + i).hide("slow");
          }
        }
      });
      $('input[id="lining2"]').on("click", function () {
        $(".sub-item6-2").show("slow");
        for (let i = 1; i < 4; i++) {
          if (!$("#lining" + i).is(":checked")) {
            $(".sub-item6-" + i).hide("slow");
          }
        }
      });
      $('input[id="lining3"]').on("click", function () {
        $(".sub-item6-3").show("slow");
        for (let i = 1; i < 4; i++) {
          if (!$("#lining" + i).is(":checked")) {
            $(".sub-item6-" + i).hide("slow");
          }
        }
      });
      $('input[id="lining4"]').on("click", function () {
        $(".sub-item6-4").show("slow");
        for (let i = 1; i < 7; i++) {
          if (!$("#lining" + i).is(":checked")) {
            $(".sub-item6-" + i).hide("slow");
          }
        }
      });
      $('input[id="lining5"]').on("click", function () {
        $(".sub-item6-5").show("slow");
        for (let i = 1; i < 7; i++) {
          if (!$("#lining" + i).is(":checked")) {
            $(".sub-item6-" + i).hide("slow");
          }
        }
      });
      $('input[id="lining6"]').on("click", function () {
        $(".sub-item6-6").show("slow");
        for (let i = 1; i < 7; i++) {
          if (!$("#lining" + i).is(":checked")) {
            $(".sub-item6-" + i).hide("slow");
          }
        }
      });
      break;
    }
    case 7: {
      let selectedSubItemsArray = selectedSubItems.split("-");

      if (
        selectedItem == previousSelectedItem ||
        (itemsData != null && selectedItem == itemsData.item)
      ) {
        for (let i = 1; i < 7; i++) {
          if (selectedSubItemsArray.indexOf(i.toString()) != -1) {
            $('input[id="coloring' + i + '"]').prop("checked", true);
            $(".sub-item" + index + "-" + i).show("slow");
          }
        }

        if (!$.isEmptyObject(subItemsData)) {
          for (const [key, value] of Object.entries(subItemsData)) {
            // console.log(key, value);
            $("#" + key).val(value);
          }
        }
      }

      $('input[id="coloring1"]').on("click", function () {
        $(".sub-item7-1").show("slow");
        for (let i = 1; i < 10; i++) {
          if (!$("#coloring" + i).is(":checked")) {
            $(".sub-item7-" + i).hide("slow");
          }
        }
      });
      $('input[id="coloring2"]').on("click", function () {
        $(".sub-item7-2").show("slow");
        for (let i = 1; i < 10; i++) {
          if (!$("#coloring" + i).is(":checked")) {
            $(".sub-item7-" + i).hide("slow");
          }
        }
      });
      $('input[id="coloring3"]').on("click", function () {
        $(".sub-item7-3").show("slow");
        for (let i = 1; i < 10; i++) {
          if (!$("#coloring" + i).is(":checked")) {
            $(".sub-item7-" + i).hide("slow");
          }
        }
      });
      $('input[id="coloring4"]').on("click", function () {
        $(".sub-item7-4").show("slow");
        for (let i = 1; i < 10; i++) {
          if (!$("#coloring" + i).is(":checked")) {
            $(".sub-item7-" + i).hide("slow");
          }
        }
      });
      $('input[id="coloring5"]').on("click", function () {
        $(".sub-item7-5").show("slow");
        for (let i = 1; i < 10; i++) {
          if (!$("#coloring" + i).is(":checked")) {
            $(".sub-item7-" + i).hide("slow");
          }
        }
      });
      $('input[id="coloring6"]').on("click", function () {
        $(".sub-item7-6").show("slow");
        for (let i = 1; i < 10; i++) {
          if (!$("#coloring" + i).is(":checked")) {
            $(".sub-item7-" + i).hide("slow");
          }
        }
      });
      $('input[id="coloring7"]').on("click", function () {
        $(".sub-item7-7").show("slow");
        for (let i = 1; i < 10; i++) {
          if (!$("#coloring" + i).is(":checked")) {
            $(".sub-item7-" + i).hide("slow");
          }
        }
      });
      $('input[id="coloring8"]').on("click", function () {
        $(".sub-item7-8").show("slow");
        for (let i = 1; i < 10; i++) {
          if (!$("#coloring" + i).is(":checked")) {
            $(".sub-item7-" + i).hide("slow");
          }
        }
      });
      $('input[id="coloring9"]').on("click", function () {
        $(".sub-item7-9").show("slow");
        for (let i = 1; i < 10; i++) {
          if (!$("#coloring" + i).is(":checked")) {
            $(".sub-item7-" + i).hide("slow");
          }
        }
      });
      break;
    }
    ///yasi start bodo
    case 8: {
      let selectedSubItemsArray = selectedSubItems.split("-");

      if (
        selectedItem == previousSelectedItem ||
        (itemsData != null && selectedItem == itemsData.item)
      ) {
        for (let i = 1; i < 7; i++) {
          if (selectedSubItemsArray.indexOf(i.toString()) != -1) {
            $('input[id="washing' + i + '"]').prop("checked", true);
            $(".sub-item" + index + "-" + i).show("slow");
          }
        }

        if (!$.isEmptyObject(subItemsData)) {
          for (const [key, value] of Object.entries(subItemsData)) {
            // console.log(key, value);
            $("#" + key).val(value);
          }
        }
      }

      $('input[id="washing1"]').on("click", function () {
        $(".sub-item8-1").show("slow");
        for (let i = 1; i < 7; i++) {
          if (!$("#washing" + i).is(":checked")) {
            $(".sub-item8-" + i).hide("slow");
          }
        }
      });
      $('input[id="washing2"]').on("click", function () {
        $(".sub-item8-2").show("slow");
        for (let i = 1; i < 7; i++) {
          if (!$("#washing" + i).is(":checked")) {
            $(".sub-item8-" + i).hide("slow");
          }
        }
      });
      $('input[id="washing3"]').on("click", function () {
        $(".sub-item8-3").show("slow");
        for (let i = 1; i < 7; i++) {
          if (!$("#washing" + i).is(":checked")) {
            $(".sub-item8-" + i).hide("slow");
          }
        }
      });
      $('input[id="washing4"]').on("click", function () {
        $(".sub-item8-4").show("slow");
        for (let i = 1; i < 7; i++) {
          if (!$("#washing" + i).is(":checked")) {
            $(".sub-item8-" + i).hide("slow");
          }
        }
      });
      $('input[id="washing5"]').on("click", function () {
        $(".sub-item8-5").show("slow");
        for (let i = 1; i < 7; i++) {
          if (!$("#washing" + i).is(":checked")) {
            $(".sub-item8-" + i).hide("slow");
          }
        }
      });
      $('input[id="washing6"]').on("click", function () {
        $(".sub-item8-6").show("slow");
        for (let i = 1; i < 7; i++) {
          if (!$("#washing" + i).is(":checked")) {
            $(".sub-item8-" + i).hide("slow");
          }
        }
      });
      $('input[id="washing7"]').on("click", function () {
        $(".sub-item8-7").show("slow");
        for (let i = 1; i < 7; i++) {
          if (!$("#washing" + i).is(":checked")) {
            $(".sub-item8-" + i).hide("slow");
          }
        }
      });
      break;
    }
    case 9: {
      let selectedSubItemsArray = selectedSubItems.split("-");

      if (
        selectedItem == previousSelectedItem ||
        (itemsData != null && selectedItem == itemsData.item)
      ) {
        for (let i = 1; i < 8; i++) {
          if (selectedSubItemsArray.indexOf(i.toString()) != -1) {
            $('input[id="securing' + i + '"]').prop("checked", true);
            $(".sub-item" + index + "-" + i).show("slow");
          }
        }

        if (!$.isEmptyObject(subItemsData)) {
          for (const [key, value] of Object.entries(subItemsData)) {
            // console.log(key, value);
            $("#" + key).val(value);
          }
        }
      }

      $('input[id="securing1"]').on("click", function () {
        $(".sub-item9-1").show("slow");
        for (let i = 1; i < 8; i++) {
          if (!$("#securing" + i).is(":checked")) {
            $(".sub-item9-" + i).hide("slow");
          }
        }
      });
      $('input[id="securing2"]').on("click", function () {
        $(".sub-item9-2").show("slow");
        for (let i = 1; i < 8; i++) {
          if (!$("#securing" + i).is(":checked")) {
            $(".sub-item9-" + i).hide("slow");
          }
        }
      });
      $('input[id="securing3"]').on("click", function () {
        $(".sub-item9-3").show("slow");
        for (let i = 1; i < 8; i++) {
          if (!$("#securing" + i).is(":checked")) {
            $(".sub-item9-" + i).hide("slow");
          }
        }
      });
      $('input[id="securing4"]').on("click", function () {
        $(".sub-item9-4").show("slow");
        for (let i = 1; i < 8; i++) {
          if (!$("#securing" + i).is(":checked")) {
            $(".sub-item9-" + i).hide("slow");
          }
        }
      });
      $('input[id="securing5"]').on("click", function () {
        $(".sub-item9-5").show("slow");
        for (let i = 1; i < 8; i++) {
          if (!$("#securing" + i).is(":checked")) {
            $(".sub-item9-" + i).hide("slow");
          }
        }
      });
      $('input[id="securing6"]').on("click", function () {
        $(".sub-item9-6").show("slow");
        for (let i = 1; i < 8; i++) {
          if (!$("#securing" + i).is(":checked")) {
            $(".sub-item9-" + i).hide("slow");
          }
        }
      });
      $('input[id="securing7"]').on("click", function () {
        $(".sub-item9-7").show("slow");
        for (let i = 1; i < 8; i++) {
          if (!$("#securing" + i).is(":checked")) {
            $(".sub-item9-" + i).hide("slow");
          }
        }
      });
      $('input[id="securing8"]').on("click", function () {
        $(".sub-item9-8").show("slow");
        for (let i = 1; i < 16; i++) {
          if (!$("#securing" + i).is(":checked")) {
            $(".sub-item9-" + i).hide("slow");
          }
        }
      });
      $('input[id="securing9"]').on("click", function () {
        $(".sub-item9-9").show("slow");
        for (let i = 1; i < 16; i++) {
          if (!$("#securing" + i).is(":checked")) {
            $(".sub-item9-" + i).hide("slow");
          }
        }
      });
      $('input[id="securing10"]').on("click", function () {
        $(".sub-item9-10").show("slow");
        for (let i = 1; i < 16; i++) {
          if (!$("#securing" + i).is(":checked")) {
            $(".sub-item9-" + i).hide("slow");
          }
        }
      });
      $('input[id="securing11"]').on("click", function () {
        $(".sub-item9-11").show("slow");
        for (let i = 1; i < 16; i++) {
          if (!$("#securing" + i).is(":checked")) {
            $(".sub-item9-" + i).hide("slow");
          }
        }
      });
      $('input[id="securing12"]').on("click", function () {
        $(".sub-item9-12").show("slow");
        for (let i = 1; i < 16; i++) {
          if (!$("#securing" + i).is(":checked")) {
            $(".sub-item9-" + i).hide("slow");
          }
        }
      });
      $('input[id="securing13"]').on("click", function () {
        $(".sub-item9-13").show("slow");
        for (let i = 1; i < 16; i++) {
          if (!$("#securing" + i).is(":checked")) {
            $(".sub-item9-" + i).hide("slow");
          }
        }
      });
      $('input[id="securing14"]').on("click", function () {
        $(".sub-item9-14").show("slow");
        for (let i = 1; i < 16; i++) {
          if (!$("#securing" + i).is(":checked")) {
            $(".sub-item9-" + i).hide("slow");
          }
        }
      });
      $('input[id="securing15"]').on("click", function () {
        $(".sub-item9-15").show("slow");
        for (let i = 1; i < 16; i++) {
          if (!$("#securing" + i).is(":checked")) {
            $(".sub-item9-" + i).hide("slow");
          }
        }
      });

      break;
    }
    case 10: {
      let selectedSubItemsArray = selectedSubItems.split("-");

      if (
        selectedItem == previousSelectedItem ||
        (itemsData != null && selectedItem == itemsData.item)
      ) {
        for (let i = 1; i < 7; i++) {
          if (selectedSubItemsArray.indexOf(i.toString()) != -1) {
            $('input[id="privacy' + i + '"]').prop("checked", true);
            $(".sub-item" + index + "-" + i).show("slow");
          }
        }

        if (!$.isEmptyObject(subItemsData)) {
          for (const [key, value] of Object.entries(subItemsData)) {
            $("#" + key).prop("checked", true);
          }
        }
      }

      $('input[id="privacy1"]').on("click", function () {
        $(".sub-item10-1").show("slow");
        for (let i = 1; i < 7; i++) {
          if (!$("#privacy" + i).is(":checked")) {
            $(".sub-item10-" + i).hide("slow");
          }
        }
      });
      $('input[id="privacy2"]').on("click", function () {
        $(".sub-item10-2").show("slow");
        for (let i = 1; i < 7; i++) {
          if (!$("#privacy" + i).is(":checked")) {
            $(".sub-item10-" + i).hide("slow");
          }
        }
      });
      $('input[id="privacy3"]').on("click", function () {
        $(".sub-item10-3").show("slow");
        for (let i = 1; i < 7; i++) {
          if (!$("#privacy" + i).is(":checked")) {
            $(".sub-item10-" + i).hide("slow");
          }
        }
      });
      $('input[id="privacy4"]').on("click", function () {
        $(".sub-item10-4").show("slow");
        for (let i = 1; i < 7; i++) {
          if (!$("#privacy" + i).is(":checked")) {
            $(".sub-item10-" + i).hide("slow");
          }
        }
      });
      $('input[id="privacy5"]').on("click", function () {
        $(".sub-item10-5").show("slow");
        for (let i = 1; i < 7; i++) {
          if (!$("#privacy" + i).is(":checked")) {
            $(".sub-item10-" + i).hide("slow");
          }
        }
      });
      $('input[id="privacy6"]').on("click", function () {
        $(".sub-item10-6").show("slow");
        for (let i = 1; i < 7; i++) {
          if (!$("#privacy" + i).is(":checked")) {
            $(".sub-item10-" + i).hide("slow");
          }
        }
      });
      break;
    }
    case 11: {
      let selectedSubItemsArray = selectedSubItems.split("-");

      if (
        selectedItem == previousSelectedItem ||
        (itemsData != null && selectedItem == itemsData.item)
      ) {
        for (let i = 1; i < 8; i++) {
          if (selectedSubItemsArray.indexOf(i.toString()) != -1) {
            $('input[id="bridge' + i + '"]').prop("checked", true);
            $(".sub-item" + index + "-" + i).show("slow");
          }
        }

        if (!$.isEmptyObject(subItemsData)) {
          for (const [key, value] of Object.entries(subItemsData)) {
            $("#" + key).prop("checked", true);
          }
        }
      }

      $('input[id="bridge1"]').on("click", function () {
        $(".sub-item11-1").show("slow");
        for (let i = 1; i < 8; i++) {
          if (!$("#bridge" + i).is(":checked")) {
            $(".sub-item11-" + i).hide("slow");
          }
        }
      });
      $('input[id="bridge2"]').on("click", function () {
        $(".sub-item11-2").show("slow");
        for (let i = 1; i < 8; i++) {
          if (!$("#bridge" + i).is(":checked")) {
            $(".sub-item11-" + i).hide("slow");
          }
        }
      });
      $('input[id="bridge3"]').on("click", function () {
        $(".sub-item11-3").show("slow");
        for (let i = 1; i < 8; i++) {
          if (!$("#bridge" + i).is(":checked")) {
            $(".sub-item11-" + i).hide("slow");
          }
        }
      });
      $('input[id="bridge4"]').on("click", function () {
        $(".sub-item11-4").show("slow");
        for (let i = 1; i < 8; i++) {
          if (!$("#bridge" + i).is(":checked")) {
            $(".sub-item11-" + i).hide("slow");
          }
        }
      });
      $('input[id="bridge5"]').on("click", function () {
        $(".sub-item11-5").show("slow");
        for (let i = 1; i < 8; i++) {
          if (!$("#bridge" + i).is(":checked")) {
            $(".sub-item11-" + i).hide("slow");
          }
        }
      });
      $('input[id="bridge6"]').on("click", function () {
        $(".sub-item11-6").show("slow");
        for (let i = 1; i < 8; i++) {
          if (!$("#bridge" + i).is(":checked")) {
            $(".sub-item11-" + i).hide("slow");
          }
        }
      });
      $('input[id="bridge7"]').on("click", function () {
        $(".sub-item11-7").show("slow");
        for (let i = 1; i < 8; i++) {
          if (!$("#bridge" + i).is(":checked")) {
            $(".sub-item11-" + i).hide("slow");
          }
        }
      });
      break;
    }
    case 12: {
      let selectedSubItemsArray = selectedSubItems.split("-");

      if (
        selectedItem == previousSelectedItem ||
        (itemsData != null && selectedItem == itemsData.item)
      ) {
        for (let i = 1; i < 8; i++) {
          if (selectedSubItemsArray.indexOf(i.toString()) != -1) {
            $('input[id="tunnel' + i + '"]').prop("checked", true);
            $(".sub-item" + index + "-" + i).show("slow");
          }
        }

        if (!$.isEmptyObject(subItemsData)) {
          for (const [key, value] of Object.entries(subItemsData)) {
            $("#" + key).prop("checked", true);
          }
        }
      }

      $('input[id="tunnel1"]').on("click", function () {
        $(".sub-item12-1").show("slow");
        for (let i = 1; i < 8; i++) {
          if (!$("#tunnel" + i).is(":checked")) {
            $(".sub-item12-" + i).hide("slow");
          }
        }
      });
      $('input[id="tunnel2"]').on("click", function () {
        $(".sub-item12-2").show("slow");
        for (let i = 1; i < 8; i++) {
          if (!$("#tunnel" + i).is(":checked")) {
            $(".sub-item12-" + i).hide("slow");
          }
        }
      });
      $('input[id="tunnel3"]').on("click", function () {
        $(".sub-item12-3").show("slow");
        for (let i = 1; i < 8; i++) {
          if (!$("#tunnel" + i).is(":checked")) {
            $(".sub-item12-" + i).hide("slow");
          }
        }
      });
      $('input[id="tunnel4"]').on("click", function () {
        $(".sub-item12-4").show("slow");
        for (let i = 1; i < 8; i++) {
          if (!$("#tunnel" + i).is(":checked")) {
            $(".sub-item12-" + i).hide("slow");
          }
        }
      });
      $('input[id="tunnel5"]').on("click", function () {
        $(".sub-item12-5").show("slow");
        for (let i = 1; i < 8; i++) {
          if (!$("#tunnel" + i).is(":checked")) {
            $(".sub-item12-" + i).hide("slow");
          }
        }
      });
      $('input[id="tunnel6"]').on("click", function () {
        $(".sub-item12-6").show("slow");
        for (let i = 1; i < 8; i++) {
          if (!$("#tunnel" + i).is(":checked")) {
            $(".sub-item12-" + i).hide("slow");
          }
        }
      });
      $('input[id="tunnel7"]').on("click", function () {
        $(".sub-item12-7").show("slow");
        for (let i = 1; i < 8; i++) {
          if (!$("#tunnel" + i).is(":checked")) {
            $(".sub-item12-" + i).hide("slow");
          }
        }
      });
      break;
    }
    case 13: {
      let selectedSubItemsArray = selectedSubItems.split("-");

      if (
        selectedItem == previousSelectedItem ||
        (itemsData != null && selectedItem == itemsData.item)
      ) {
        for (let i = 1; i < 9; i++) {
          if (selectedSubItemsArray.indexOf(i.toString()) != -1) {
            $('input[id="winterOperation' + i + '"]').prop("checked", true);
            $(".sub-item" + index + "-" + i).show("slow");
          }
        }

        if (!$.isEmptyObject(subItemsData)) {
          for (const [key, value] of Object.entries(subItemsData)) {
            // console.log(key, value);
            $("#" + key).val(value);
          }
        }
      }

      $('input[id="winterOperation1"]').on("click", function () {
        $(".sub-item13-1").show("slow");
        for (let i = 1; i < 9; i++) {
          if (!$("#winterOperation" + i).is(":checked")) {
            $(".sub-item13-" + i).hide("slow");
          }
        }
      });
      $('input[id="winterOperation2"]').on("click", function () {
        $(".sub-item13-2").show("slow");
        for (let i = 1; i < 9; i++) {
          if (!$("#winterOperation" + i).is(":checked")) {
            $(".sub-item13-" + i).hide("slow");
          }
        }
      });
      $('input[id="winterOperation3"]').on("click", function () {
        $(".sub-item13-3").show("slow");
        for (let i = 1; i < 9; i++) {
          if (!$("#winterOperation" + i).is(":checked")) {
            $(".sub-item13-" + i).hide("slow");
          }
        }
      });
      $('input[id="winterOperation4"]').on("click", function () {
        $(".sub-item13-4").show("slow");
        for (let i = 1; i < 9; i++) {
          if (!$("#winterOperation" + i).is(":checked")) {
            $(".sub-item13-" + i).hide("slow");
          }
        }
      });
      $('input[id="winterOperation5"]').on("click", function () {
        $(".sub-item13-5").show("slow");
        for (let i = 1; i < 9; i++) {
          if (!$("#winterOperation" + i).is(":checked")) {
            $(".sub-item13-" + i).hide("slow");
          }
        }
      });
      $('input[id="winterOperation6"]').on("click", function () {
        $(".sub-item13-6").show("slow");
        for (let i = 1; i < 9; i++) {
          if (!$("#winterOperation" + i).is(":checked")) {
            $(".sub-item13-" + i).hide("slow");
          }
        }
      });
      $('input[id="winterOperation7"]').on("click", function () {
        $(".sub-item13-7").show("slow");
        for (let i = 1; i < 9; i++) {
          if (!$("#winterOperation" + i).is(":checked")) {
            $(".sub-item13-" + i).hide("slow");
          }
        }
      });
      $('input[id="winterOperation8"]').on("click", function () {
        $(".sub-item13-8").show("slow");
        for (let i = 1; i < 9; i++) {
          if (!$("#winterOperation" + i).is(":checked")) {
            $(".sub-item13-" + i).hide("slow");
          }
        }
      });
      break;
    }
    case 14: {
      let selectedSubItemsArray = selectedSubItems.split("-");

      if (
        selectedItem == previousSelectedItem ||
        (itemsData != null && selectedItem == itemsData.item)
      ) {
        for (let i = 1; i < 8; i++) {
          if (selectedSubItemsArray.indexOf(i.toString()) != -1) {
            $('input[id="machinery' + i + '"]').prop("checked", true);
            $(".sub-item" + index + "-" + i).show("slow");
          }
        }

        if (!$.isEmptyObject(subItemsData)) {
          for (const [key, value] of Object.entries(subItemsData)) {
            // console.log(key, value);
            $("#" + key).val(value);
          }
        }
      }

      $('input[id="machinery1"]').on("click", function () {
        $(".sub-item14-1").show("slow");
        for (let i = 1; i < 11; i++) {
          if (!$("#machinery" + i).is(":checked")) {
            $(".sub-item14-" + i).hide("slow");
          }
        }
      });
      $('input[id="machinery2"]').on("click", function () {
        $(".sub-item14-2").show("slow");
        for (let i = 1; i < 11; i++) {
          if (!$("#machinery" + i).is(":checked")) {
            $(".sub-item14-" + i).hide("slow");
          }
        }
      });
      $('input[id="machinery3"]').on("click", function () {
        $(".sub-item14-3").show("slow");
        for (let i = 1; i < 11; i++) {
          if (!$("#machinery" + i).is(":checked")) {
            $(".sub-item14-" + i).hide("slow");
          }
        }
      });
      $('input[id="machinery4"]').on("click", function () {
        $(".sub-item14-4").show("slow");
        for (let i = 1; i < 11; i++) {
          if (!$("#machinery" + i).is(":checked")) {
            $(".sub-item14-" + i).hide("slow");
          }
        }
      });
      $('input[id="machinery5"]').on("click", function () {
        $(".sub-item14-5").show("slow");
        for (let i = 1; i < 11; i++) {
          if (!$("#machinery" + i).is(":checked")) {
            $(".sub-item14-" + i).hide("slow");
          }
        }
      });
      $('input[id="machinery6"]').on("click", function () {
        $(".sub-item14-6").show("slow");
        for (let i = 1; i < 11; i++) {
          if (!$("#machinery" + i).is(":checked")) {
            $(".sub-item14-" + i).hide("slow");
          }
        }
      });
      $('input[id="machinery7"]').on("click", function () {
        $(".sub-item14-7").show("slow");
        for (let i = 1; i < 11; i++) {
          if (!$("#machinery" + i).is(":checked")) {
            $(".sub-item14-" + i).hide("slow");
          }
        }
      });
      $('input[id="machinery8"]').on("click", function () {
        $(".sub-item14-8").show("slow");
        for (let i = 1; i < 11; i++) {
          if (!$("#machinery" + i).is(":checked")) {
            $(".sub-item14-" + i).hide("slow");
          }
        }
      });
      $('input[id="machinery9"]').on("click", function () {
        $(".sub-item14-9").show("slow");
        for (let i = 1; i < 11; i++) {
          if (!$("#machinery" + i).is(":checked")) {
            $(".sub-item14-" + i).hide("slow");
          }
        }
      });
      $('input[id="machinery10"]').on("click", function () {
        $(".sub-item14-10").show("slow");
        for (let i = 1; i < 11; i++) {
          if (!$("#machinery" + i).is(":checked")) {
            $(".sub-item14-" + i).hide("slow");
          }
        }
      });
      break;
    }
    case 15: {
      let selectedSubItemsArray = selectedSubItems.split("-");

      if (
        selectedItem == previousSelectedItem ||
        (itemsData != null && selectedItem == itemsData.item)
      ) {
        for (let i = 1; i < 4; i++) {
          if (selectedSubItemsArray.indexOf(i.toString()) != -1) {
            $('input[id="tollhouse' + i + '"]').prop("checked", true);
            $(".sub-item" + index + "-" + i).show("slow");
          }
        }

        if (!$.isEmptyObject(subItemsData)) {
          for (const [key, value] of Object.entries(subItemsData)) {
            // console.log(key, value);
            $("#" + key).val(value);
          }
        }
      }

      $('input[id="tollhouse1"]').on("click", function () {
        $(".sub-item15-1").show("slow");
        for (let i = 1; i < 5; i++) {
          if (!$("#tollhouse" + i).is(":checked")) {
            $(".sub-item15-" + i).hide("slow");
          }
        }
      });
      $('input[id="tollhouse2"]').on("click", function () {
        $(".sub-item15-2").show("slow");
        for (let i = 1; i < 5; i++) {
          if (!$("#tollhouse" + i).is(":checked")) {
            $(".sub-item15-" + i).hide("slow");
          }
        }
      });
      $('input[id="tollhouse3"]').on("click", function () {
        $(".sub-item15-3").show("slow");
        for (let i = 1; i < 5; i++) {
          if (!$("#tollhouse" + i).is(":checked")) {
            $(".sub-item15-" + i).hide("slow");
          }
        }
      });
      $('input[id="tollhouse4"]').on("click", function () {
        $(".sub-item15-4").show("slow");
        for (let i = 1; i < 5; i++) {
          if (!$("#tollhouse" + i).is(":checked")) {
            $(".sub-item15-" + i).hide("slow");
          }
        }
      });
      break;
    }
    case 16: {
      let selectedSubItemsArray = selectedSubItems.split("-");

      if (
        selectedItem == previousSelectedItem ||
        (itemsData != null && selectedItem == itemsData.item)
      ) {
        for (let i = 1; i < 10; i++) {
          if (selectedSubItemsArray.indexOf(i.toString()) != -1) {
            $('input[id="emergency' + i + '"]').prop("checked", true);
            $(".sub-item" + index + "-" + i).show("slow");
          }
        }

        if (!$.isEmptyObject(subItemsData)) {
          for (const [key, value] of Object.entries(subItemsData)) {
            // console.log(key, value);
            $("#" + key).val(value);
          }
        }
      }

      $('input[id="emergency1"]').on("click", function () {
        $(".sub-item16-1").show("slow");
        for (let i = 1; i < 10; i++) {
          if (!$("#emergency" + i).is(":checked")) {
            $(".sub-item16-" + i).hide("slow");
          }
        }
      });
      $('input[id="emergency2"]').on("click", function () {
        $(".sub-item16-2").show("slow");
        for (let i = 1; i < 10; i++) {
          if (!$("#emergency" + i).is(":checked")) {
            $(".sub-item16-" + i).hide("slow");
          }
        }
      });
      $('input[id="emergency3"]').on("click", function () {
        $(".sub-item16-3").show("slow");
        for (let i = 1; i < 10; i++) {
          if (!$("#emergency" + i).is(":checked")) {
            $(".sub-item16-" + i).hide("slow");
          }
        }
      });
      $('input[id="emergency4"]').on("click", function () {
        $(".sub-item16-4").show("slow");
        for (let i = 1; i < 7; i++) {
          if (!$("#emergency" + i).is(":checked")) {
            $(".sub-item16-" + i).hide("slow");
          }
        }
      });
      $('input[id="emergency5"]').on("click", function () {
        $(".sub-item16-5").show("slow");
        for (let i = 1; i < 10; i++) {
          if (!$("#emergency" + i).is(":checked")) {
            $(".sub-item16-" + i).hide("slow");
          }
        }
      });
      $('input[id="emergency6"]').on("click", function () {
        $(".sub-item16-6").show("slow");
        for (let i = 1; i < 10; i++) {
          if (!$("#emergency" + i).is(":checked")) {
            $(".sub-item16-" + i).hide("slow");
          }
        }
      });
      $('input[id="emergency7"]').on("click", function () {
        $(".sub-item16-7").show("slow");
        for (let i = 1; i < 10; i++) {
          if (!$("#emergency" + i).is(":checked")) {
            $(".sub-item16-" + i).hide("slow");
          }
        }
      });
      $('input[id="emergency8"]').on("click", function () {
        $(".sub-item16-8").show("slow");
        for (let i = 1; i < 10; i++) {
          if (!$("#emergency" + i).is(":checked")) {
            $(".sub-item16-" + i).hide("slow");
          }
        }
      });
      $('input[id="emergency9"]').on("click", function () {
        $(".sub-item16-9").show("slow");
        for (let i = 1; i < 10; i++) {
          if (!$("#emergency" + i).is(":checked")) {
            $(".sub-item16-" + i).hide("slow");
          }
        }
      });
      break;
    }
    case 17: {
      let selectedSubItemsArray = selectedSubItems.split("-");

      if (
        selectedItem == previousSelectedItem ||
        (itemsData != null && selectedItem == itemsData.item)
      ) {
        for (let i = 1; i < 7; i++) {
          if (selectedSubItemsArray.indexOf(i.toString()) != -1) {
            $('input[id="seeview' + i + '"]').prop("checked", true);
            $(".sub-item" + index + "-" + i).show("slow");
          }
        }

        if (!$.isEmptyObject(subItemsData)) {
          for (const [key, value] of Object.entries(subItemsData)) {
            // console.log(key, value);
            $("#" + key).val(value);
          }
        }
      }

      $('input[id="seeview1"]').on("click", function () {
        $(".sub-item17-1").show("slow");
        for (let i = 1; i < 7; i++) {
          if (!$("#seeview" + i).is(":checked")) {
            $(".sub-item17-" + i).hide("slow");
          }
        }
      });
      $('input[id="seeview2"]').on("click", function () {
        $(".sub-item17-2").show("slow");
        for (let i = 1; i < 7; i++) {
          if (!$("#seeview" + i).is(":checked")) {
            $(".sub-item17-" + i).hide("slow");
          }
        }
      });
      $('input[id="seeview3"]').on("click", function () {
        $(".sub-item17-3").show("slow");
        for (let i = 1; i < 7; i++) {
          if (!$("#seeview" + i).is(":checked")) {
            $(".sub-item17-" + i).hide("slow");
          }
        }
      });
      $('input[id="seeview4"]').on("click", function () {
        $(".sub-item17-4").show("slow");
        for (let i = 1; i < 7; i++) {
          if (!$("#seeview" + i).is(":checked")) {
            $(".sub-item17-" + i).hide("slow");
          }
        }
      });
      $('input[id="seeview5"]').on("click", function () {
        $(".sub-item17-5").show("slow");
        for (let i = 1; i < 7; i++) {
          if (!$("#seeview" + i).is(":checked")) {
            $(".sub-item17-" + i).hide("slow");
          }
        }
      });
      $('input[id="seeview6"]').on("click", function () {
        $(".sub-item17-6").show("slow");
        for (let i = 1; i < 7; i++) {
          if (!$("#seeview" + i).is(":checked")) {
            $(".sub-item17-" + i).hide("slow");
          }
        }
      });

      break;
    }
    case 20: {
      if (
        selectedItem == previousSelectedItem ||
        (itemsData != null && selectedItem == itemsData.item)
      ) {
        if (!$.isEmptyObject(subItemsData)) {
          for (const [key, value] of Object.entries(subItemsData)) {
            $("#" + key).val(value);
          }
        }
      }
      break;
    }
  }
}

// Next button click on items modal
//yasiiiiii modal change
$("#uploadroaditem .btn-next").on("click", function () {
  switch (selectedItem) {
    case 1: {
      saveSelectedSubItems(13, "reconstruction");
      break;
    }
    case 2: {
      saveSelectedSubItems(19, "cleaning");
      break;
    }
    case 3: {
      saveSelectedSubItems(9, "signs");
      break;
    }
    case 4: {
      saveSelectedSubItems(3, "shield");
      break;
    }
    case 5: {
      saveSelectedSubItems(11, "lighting");
      break;
    }
    case 6: {
      saveSelectedSubItems(6, "lining");
      break;
    }
    case 7: {
      saveSelectedSubItems(9, "coloring");
      break;
    }
    case 8: {
      saveSelectedSubItems(7, "washing");
      break;
    }
    case 9: {
      saveSelectedSubItems(15, "securing");
      break;
    }
    case 10: {
      saveSelectedSubItems(6, "privacy");
      break;
    }
    case 11: {
      saveSelectedSubItems(7, "bridge");
      break;
    }
    case 12: {
      saveSelectedSubItems(7, "tunnel");
      break;
    }
    case 13: {
      saveSelectedSubItems(8, "winterOperation");
      break;
    }
    case 14: {
      saveSelectedSubItems(10, "machinery");
      break;
    }
    case 15: {
      saveSelectedSubItems(4, "tollhouse");
      break;
    }
    case 16: {
      saveSelectedSubItems(9, "emergency");
      break;
    }
    case 17: {
      saveSelectedSubItems(6, "seeview");
      break;
    }
    case 20: {
      saveSelectedSubItems(0, "snowWatch");
      break;
    }
    case 19: {
      //saveSelectedSubItems();
      break;
    }
  }
});

$("#uploadroaditem .btn-prev").on("click", function () {
  // subItemsData = {};
  // selectedSubItems = "";
  if ($("#uploadroaditem .btn-createb").css("display") == "none") {
    $("#uploadroaditem").modal("hide");
    $("#vertical-menu").modal("show");
  } else {
    previousSelectedItem = selectedItem;
    $("#uploadroaditem .btn-next").show();
    $("#uploadroaditem .btn-createb").hide();
    showSecondModal();
  }
});

function saveSelectedSubItems(
  selectedItemIndex = null,
  selectedItemName = null
) {
  valuevarification = [];
  // Clear subItem & subItemData if they exist
  subItemsData = {};
  selectedSubItems = "";

  if (selectedItem < 17) {
    for (let i = 1; i <= selectedItemIndex; i++) {
      if ($("#" + selectedItemName + i).is(":checked"))
        selectedSubItems += i + "-";
    }
  } else {
    selectedSubItems += 1 + "-";
  }

  // console.log("selectedItem: ", selectedItem);
  // console.log("selectedSubItems: ", selectedSubItems);

  hasSubItemGotValue = true;
  rookeshError = false;
  switch (selectedItem) {
    case 1: {
      for (let i = 1; i <= selectedItemIndex; i++) {
        if ($("#" + selectedItemName + i).is(":checked")) {
          if (i == 7) {
            if (!$('.sub-item1-7 input[type="checkbox"]').is(":checked")) {
              rookeshError = true;
            } else {
              rookeshError = false;
              for (let j = 0; j < 11; j++) {
                if ($("#" + selectedItemName + "7-" + j).is(":checked")) {
                  if (
                    (value = $("#" + selectedItemName + "7-" + j + "-1").val())
                  ) {
                    valuevarification.push(value);

                    setSubItem(selectedItemName + i + "-" + j + "-1", value);
                  } else hasSubItemGotValue = false;
                  if (
                    (value = $("#" + selectedItemName + "7-" + j + "-2").val())
                  ) {
                    valuevarification.push(value);

                    setSubItem(selectedItemName + i + "-" + j + "-2", value);
                  } else hasSubItemGotValue = false;
                }
              }
            }
          } else {
            if ((value = $("#" + selectedItemName + i + "-1").val())) {
              valuevarification.push(value);
              setSubItem(selectedItemName + i + "-1", value);
            } else hasSubItemGotValue = false;
          }
        }
      }
      break;
    }
    case 2: {
      for (let i = 1; i <= selectedItemIndex; i++) {
        if ($("#" + selectedItemName + i).is(":checked")) {
          if ((value = $("#" + selectedItemName + i + "-1").val())) {
            // console.log(value);
            valuevarification.push(value);
            setSubItem(selectedItemName + i + "-1", value);
          } else hasSubItemGotValue = false;
        }
      }
      break;
    }
    case 3: {
      for (let i = 1; i <= selectedItemIndex; i++) {
        if ($("#" + selectedItemName + i).is(":checked")) {
          if ((value = $("#" + selectedItemName + i + "-1").val())) {
            // console.log(value);
            valuevarification.push(value);
            setSubItem(selectedItemName + i + "-1", value);
          } else hasSubItemGotValue = false;
        }
      }
      break;
    }
    case 4: {
      for (let i = 1; i <= selectedItemIndex; i++) {
        if ($("#" + selectedItemName + i).is(":checked")) {
          if ((value = $("#" + selectedItemName + i + "-1").val())) {
            // console.log(value);
            valuevarification.push(value);
            setSubItem(selectedItemName + i + "-2-1", value);
          } else hasSubItemGotValue = false;
        }
      }
      // console.log(subItemsData);
      break;
    }
    case 5: {
      for (let i = 1; i <= selectedItemIndex; i++) {
        if ($("#" + selectedItemName + i).is(":checked")) {
          if ((value = $("#" + selectedItemName + i + "-1").val())) {
            // console.log(value);
            valuevarification.push(value);
            setSubItem(selectedItemName + i + "-2-1", value);
          } else hasSubItemGotValue = false;
        }
      }
      break;
    }
    case 6: {
      for (let i = 1; i <= selectedItemIndex; i++) {
        if ($("#" + selectedItemName + i).is(":checked")) {
          if ((value = $("#" + selectedItemName + i + "-1").val())) {
            // console.log(value);
            valuevarification.push(value);
            setSubItem(selectedItemName + i + "-1", value);
          } else hasSubItemGotValue = false;
        }
      }
      break;
    }
    case 7: {
      for (let i = 1; i <= selectedItemIndex; i++) {
        if ($("#" + selectedItemName + i).is(":checked")) {
          if ((value = $("#" + selectedItemName + i + "-1").val())) {
            // console.log(value);
            valuevarification.push(value);
            setSubItem(selectedItemName + i + "-1", value);
          } else hasSubItemGotValue = false;
        }
      }
      break;
    }
    case 8: {
      for (let i = 1; i <= selectedItemIndex; i++) {
        if ($("#" + selectedItemName + i).is(":checked")) {
          if ((value = $("#" + selectedItemName + i + "-1").val())) {
            // console.log(value);
            valuevarification.push(value);
            setSubItem(selectedItemName + i + "-1", value);
          } else hasSubItemGotValue = false;
        }
      }
      break;
    }
    case 9: {
      for (let i = 1; i <= selectedItemIndex; i++) {
        if ($("#" + selectedItemName + i).is(":checked")) {
          if ((value = $("#" + selectedItemName + i + "-1").val())) {
            // console.log(value);
            valuevarification.push(value);
            setSubItem(selectedItemName + i + "-1", value);
          } else hasSubItemGotValue = false;
        }
      }
      break;
    }
    case 10: {
      for (let i = 1; i <= selectedItemIndex; i++) {
        if ($("#" + selectedItemName + i).is(":checked")) {
          if ((value = $("#" + selectedItemName + i + "-1").val())) {
            // console.log(value);
            valuevarification.push(value);
            setSubItem(selectedItemName + i + "-1", value);
          } else hasSubItemGotValue = false;
        }
      }
      break;
    }
    case 11: {
      for (let i = 1; i <= selectedItemIndex; i++) {
        if ($("#" + selectedItemName + i).is(":checked")) {
          if ((value = $("#" + selectedItemName + i + "-1").val())) {
            // console.log(value);
            valuevarification.push(value);
            setSubItem(selectedItemName + i + "-1", value);
          } else hasSubItemGotValue = false;
        }
      }
      break;
    }
    case 12: {
      for (let i = 1; i <= selectedItemIndex; i++) {
        if ($("#" + selectedItemName + i).is(":checked")) {
          if ((value = $("#" + selectedItemName + i + "-1").val())) {
            // console.log(value);
            valuevarification.push(value);
            setSubItem(selectedItemName + i + "-1", value);
          } else hasSubItemGotValue = false;
        }
      }
      break;
    }
    case 13: {
      for (let i = 1; i <= selectedItemIndex; i++) {
        if ($("#" + selectedItemName + i).is(":checked")) {
          if ((value = $("#" + selectedItemName + i + "-1").val())) {
            // console.log(value);
            valuevarification.push(value);
            setSubItem(selectedItemName + i + "-1", value);
          } else hasSubItemGotValue = false;
        }
      }

      break;
    }
    case 14: {
      for (let i = 1; i <= selectedItemIndex; i++) {
        if ($("#" + selectedItemName + i).is(":checked")) {
          if ((value = $("#" + selectedItemName + i + "-1").val())) {
            // console.log(value);
            valuevarification.push(value);
            setSubItem(selectedItemName + i + "-1", value);
          } else hasSubItemGotValue = false;
        }
      }

      break;
    }
    case 15: {
      for (let i = 1; i <= selectedItemIndex; i++) {
        if ($("#" + selectedItemName + i).is(":checked")) {
          if (i == 3) {
            if ((value = $("#" + selectedItemName + i + "-1").val())) {
              valuevarification.push(value);
              setSubItem(selectedItemName + i + "-1", value);
            } else hasSubItemGotValue = false;
          } else if (i == 4) {
            if ((value = $("#" + selectedItemName + i + "-1").val())) {
              valuevarification.push(value);
              setSubItem(selectedItemName + i + "-1", value);
            } else hasSubItemGotValue = false;
          } else {
            // Others have 2 subitem data
            for (let j = 1; j < 3; j++) {
              if ((value = $("#" + selectedItemName + i + "-" + j).val())) {
                // console.log(j);
                valuevarification.push(value);
                setSubItem(selectedItemName + i + "-" + j, value);
              } else hasSubItemGotValue = false;
            }
          }
        }
      }
      break;
    }
    case 16: {
      for (let i = 1; i <= selectedItemIndex; i++) {
        if ($("#" + selectedItemName + i).is(":checked")) {
          if ((value = $("#" + selectedItemName + i + "-1").val())) {
            // console.log(value);
            valuevarification.push(value);
            setSubItem(selectedItemName + i + "-1", value);
          } else hasSubItemGotValue = false;
        }
      }

      break;
    }
    case 17: {
      for (let i = 1; i <= selectedItemIndex; i++) {
        if ($("#" + selectedItemName + i).is(":checked")) {
          if ((value = $("#" + selectedItemName + i + "-1").val())) {
            // console.log(value);
            valuevarification.push(value);
            setSubItem(selectedItemName + i + "-1", value);
          } else hasSubItemGotValue = false;
        }
      }

      break;
    }
    case 20: {
      if ((value = $("#" + selectedItemName + "1").val())) {
        // console.log(value);
        valuevarification.push(value);
        setSubItem(selectedItemName + "1", value);
      } else hasSubItemGotValue = false;
      break;
    }
  }

  let selectedSubItemsArray = selectedSubItems.split("-");
  // console.log("selectedSubItemsArray: ", selectedSubItemsArray);

  if (selectedItem == 1 && rookeshError) {
    alert("یک یا چند مورد از آیتم روکش را انتخاب کنید!");
  } else if (
    selectedSubItemsArray.length < 1 ||
    selectedSubItemsArray[0] == ""
  ) {
    console.log(
      "selectedSubItemsArray[0]",
      selectedSubItemsArray[0],
      selectedSubItemsArray.length
    );
    alert("یک یا چند مورد را انتخاب کنید!");
  } else {
    var selectedlenght = selectedSubItemsArray.length - 1;
    var selectedvalue = valuevarification.length;

    if (selectedlenght == selectedvalue) {
      showUploadPhotoModal();
    } else {
      console.log(
        "selectedSubItemsArray",
        selectedSubItemsArray,
        valuevarification
      );
      console.log("selectedlenght", selectedlenght, selectedvalue);
      alert("لطفا تمامی مقادیر را وارد کنید ");
    }
  }
}
$("#uploadroaditem .btn-createb").on("click", function () {
  let formData = new FormData();
  console.log("selectedItem", selectedItem);
  console.log("selectedSubItems", selectedSubItems);
  if (sourceLat != null && sourceLng != null)
    formData.append("source_coordinates", [sourceLat, sourceLng]);
  if (destLat != null && destLng != null)
    formData.append("dest_coordinates", [destLat, destLng]);
  if (saveTotalDistance != null)
    formData.append("total_distance", saveTotalDistance);
  if (selectedItem != null) formData.append("item", selectedItem);
  if (selectedSubItems != null) formData.append("sub_items", selectedSubItems);
  let subItemsDataStr = JSON.stringify(subItemsData);
  console.log("subItemsDataStr", subItemsDataStr);

  if (subItemsDataStr.length > 2) {
    formData.append("sub_items_data", subItemsDataStr);
  }

  if (typeof $("#deviceImg1add").get(0).files[0] !== "undefined") {
    formData.append("before_image", $("#deviceImg1add").get(0).files[0]);
  }
  if (typeof $("#deviceImg2add").get(0).files[0] !== "undefined") {
    formData.append("after_image", $("#deviceImg2add").get(0).files[0]);
  }

  for (var pair of formData.entries()) {
    console.log(pair[0] + ", " + pair[1]);
  }
  // console.log("selectedItem: ", selectedItem);
  // console.log("selectedSubItems: ", selectedSubItems);
  // console.log("subItemsData: ", subItemsData);

  let reqUrl = "";
  if (itemsData == null) {
    reqUrl = "/road-items";
  } else reqUrl = "/projects/road-items/" + requestId;

  showLoaderScreen();

  console.log("formdataaaa", formData);
  for (var value of formData.values()) {
    console.log("pair", value);
  }
  console.log(
    "deviceImg1add",
    typeof $("#deviceImg1add").get(0).files[0] == "undefined",
    typeof $("#deviceImg2add").get(0).files[0] == "undefined"
  );
  // console.log("kiki", $("input[name=modalUpFile1]")[0].files.length, $("input[name=modalUpFile]")[0].files.length)
  if (
    typeof $("#deviceImg1add").get(0).files[0] == "undefined" ||
    typeof $("#deviceImg2add").get(0).files[0] == "undefined"
  ) {
    alert("لطفا عکس را وارد کنید.");
    hideLoaderScreen();
    // location.reload()
  } else {
    $("#uploadroaditem .btn-createb").prop("disabled", true);
    $("#uploadroaditem").modal("hide");
    $.ajax({
      url: "https://rms.rmto.ir/projects/road-items/" + idkol,
      type: "POST",
      headers: {
        "X-CSRF-TOKEN": $('meta[name="csrf-token"]').attr("content"),
      },
      data: formData,
      cache: false,
      contentType: false,
      processData: false,
      success: function (result) {
        //console.log(result);
        setTimeout(() => {
          hideLoaderScreen();
          location.reload();
        }, 2000);
      },
      error: function (error) {
        console.log(error);
        alert("ارتباط اینترنت شما برقرار نیست. لطفا مجدد تلاش کنید.");
        hideLoaderScreen();
        location.reload();
      },
    });
  }
});

function setSubItem(name, value) {
  subItemsData[name] = value;
  // console.log(subItemsData);
}
function showUploadPhotoModal() {
  $("#uploadroaditem").modal("hide");

  setTimeout(function () {
    $("#uploadroaditem .btn-next").hide();
    $("#uploadroaditem .btn-createb").show();
    $("#uploadroaditem .modal-title").text("آپلود فایل‌های موردنیاز");
    $("#uploadroaditem .row.sub-item-container").empty();
    addUploadFormToModal();
    $("#uploadroaditem").modal("show");
  }, 350);
}
function addUploadFormToModal() {
  let formItem =
    '\
          <div class="col-6" style="float: right;">\
          <div class="img-box col d-flex justify-content-center" style="margin-bottom: 17px;">\
              <div class="d-flex flex-column">\
                  <label class="imgbox d-flex align-items-center justify-content-center" for="deviceImg1add">\
                      <span class="img-title" id="deviceImg1Titleadd">  \
                      عکس قبل از اقدام</span>\
                      <img class="img-preview" id="deviceImg1Previewadd" src="" alt="" />\
                  </label>\
                  <button class="btn-delete-img btn-danger btn btn-sm" id="deleteDeviceImg1add" disabled><i class="fa fa-trash" style="color: #fff;"></i></button>\
              </div>\
              <input type="file" name="deviceImg1add" id="deviceImg1add" class="img-input d-none" accept=".jpg, .png">\
          </div>\
      </div>\
      <div class="col-6" style="float: right;">\
          <div class="img-box col d-flex justify-content-center" style="margin-bottom: 17px;">\
              <div class="d-flex flex-column">\
                  <label class="imgbox d-flex align-items-center justify-content-center" for="deviceImg2add">\
                      <span class="img-title" id="deviceImg2Titleadd">  عکس بعد از اقدام</span>\
                      <img class="img-preview" id="deviceImg2Previewadd" src="" alt="" />\
                  </label>\
                  <button class="btn-delete-img btn-danger btn btn-sm" id="deleteDeviceImg2add" disabled><i class="fa fa-trash" style="color: #fff;"></i></button>\
              </div>\
              <input type="file" name="deviceImg2add" id="deviceImg2add" class="img-input d-none" accept=".jpg, .png">\
          </div>\
      </div>\
      ';
  $("#uploadroaditem .row.sub-item-container").append(formItem);
  if ($("#item-" + item_checker).is(":checked")) {
    $("#deviceImg1Titleadd").css("display", "none");
    $("#deviceImg1Previewadd").attr(
      "src",
      "https://rms.rmto.ir/storage/" + files_checker1
    );
    $("#deleteDeviceImg1add").removeAttr("disabled");
    $("#deviceImg2Titleadd").css("display", "none");
    $("#deviceImg2Previewadd").attr(
      "src",
      "https://rms.rmto.ir/storage/" + files_checker2
    );
    $("#deleteDeviceImg2add").removeAttr("disabled");
  }
}

$(document).on("click", ".btn-delete-img", function () {
  var parent = $(this).parents(".img-box");
  parent.find(".img-input").val("");
  parent.find(".img-preview").removeAttr("src");
  parent.find(".img-title").css("display", "");
  $(this).attr("disabled", "disabled");
});
$(document).on("change", ".img-input", function () {
  var input = this;
  var parent = $(input).parents(".img-box");
  if (input.files && input.files[0]) {
    var reader = new FileReader();

    reader.onload = function (e) {
      parent.find(".img-title").css("display", "none");
      parent.find(".btn-delete-img").removeAttr("disabled");
      parent.find(".img-preview").attr("src", e.target.result);
    };

    reader.readAsDataURL(input.files[0]);
  }
});