1530 lines
53 KiB
JavaScript
1530 lines
53 KiB
JavaScript
var list_item_api = "/v2/items";
|
|
var list_sub_item_api = "/v2/sub_items/";
|
|
var add_road_patrol_api = "/v2/road_patrols/operator/store";
|
|
var report_api = "/v2/road_patrols/operator/report/";
|
|
var mapZoom = getWidth() < 508 ? 5 : 6;
|
|
var mapUrl = `https://rmsmap.rmto.ir/141map/`;
|
|
var map;
|
|
var mapStartMarker = null;
|
|
var isSetMapStartMarker = false;
|
|
var mapEndMarker = null;
|
|
var isSetMapEndMarker = false;
|
|
// var routeControls = [];
|
|
// var routeControlsAddMap=[];
|
|
// var routeControlstest=[];
|
|
var popupArrays = [];
|
|
var popupArraysAddMap = [];
|
|
var sourceLat, sourceLng, destLat, destLng = "";
|
|
var addMap = null;
|
|
var startMarkerAdd = null;
|
|
var endMarkerAdd = null;
|
|
var isSetStartMarkerAdd = false;
|
|
var isSetEndMarkerAdd = false;
|
|
var observed_items = [];
|
|
var item_unique_id = 0;
|
|
var item_counter = 0;
|
|
var patrol_date;
|
|
var start_timer;
|
|
var end_timer;
|
|
var mapShow;
|
|
var showMapMarker;
|
|
// user info modal data (ui)
|
|
var date_ui;
|
|
var start_time_ui;
|
|
var end_time_ui;
|
|
var officer_name_ui;
|
|
var officer_plaque_ui;
|
|
var officer_phone_number_ui;
|
|
var distance_ui;
|
|
// end user info modal data (ui)
|
|
var marker_list = [];
|
|
var bounds = [
|
|
[42.9130026312, 75.6166317076],
|
|
[20.5782370061, 35.5092252948],
|
|
];
|
|
var item_icon = L.icon({
|
|
iconUrl: "/dist/images/icons/item_location.png",
|
|
iconSize: [30, 30],
|
|
iconAnchor: [9, 19],
|
|
});
|
|
var mapStartIcon = 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: [56, 75],
|
|
iconAnchor: [28, 75],
|
|
});
|
|
var mapEndIcon = L.divIcon({
|
|
html: `
|
|
<div id="pin-marker-end" class="pin-marker pin-most-dis">
|
|
<div class="map-pin-marker most-distance">
|
|
<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 startDivIcon = L.divIcon({
|
|
html: `
|
|
<div id="add-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 endDivIcon = L.divIcon({
|
|
html: `
|
|
<div id="add-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],
|
|
});
|
|
// datepicker
|
|
patrol_date = $("#patrol_date").persianDatepicker({
|
|
format: "YYYY/MM/DD",
|
|
initialValue: false,
|
|
autoClose: true,
|
|
initialValueType: "persian",
|
|
});
|
|
start_timer = $("#start_time").persianDatepicker({
|
|
format: "HH:mm",
|
|
initialValue: false,
|
|
autoClose: true,
|
|
initialValueType: "persian",
|
|
onlyTimePicker: true,
|
|
timePicker: {
|
|
enabled: true,
|
|
step: 1,
|
|
hour: {
|
|
enabled: true,
|
|
step: null
|
|
},
|
|
minute: {
|
|
enabled: true,
|
|
step: null
|
|
},
|
|
second: {
|
|
enabled: false,
|
|
step: null
|
|
},
|
|
},
|
|
});
|
|
end_timer = $("#end_time").persianDatepicker({
|
|
format: "HH:mm",
|
|
initialValue: false,
|
|
autoClose: true,
|
|
initialValueType: "persian",
|
|
onlyTimePicker: true,
|
|
timePicker: {
|
|
enabled: true,
|
|
step: 1,
|
|
hour: {
|
|
enabled: true,
|
|
step: null
|
|
},
|
|
minute: {
|
|
enabled: true,
|
|
step: null
|
|
},
|
|
second: {
|
|
enabled: false,
|
|
step: null
|
|
},
|
|
},
|
|
});
|
|
// datepicker
|
|
|
|
// resize func
|
|
function getWidth() {
|
|
return Math.max(
|
|
document.body.scrollWidth,
|
|
document.documentElement.scrollWidth,
|
|
document.body.offsetWidth,
|
|
document.documentElement.offsetWidth,
|
|
document.documentElement.clientWidth
|
|
);
|
|
}
|
|
// end resize func
|
|
|
|
// empty tag checker
|
|
function isEmpty(el) {
|
|
return !$.trim(el.html())
|
|
}
|
|
// end empty tag checker
|
|
|
|
// timer function
|
|
function startTimer(duration, display) {
|
|
var timer = duration, minutes = parseInt(duration / 60, 10), seconds = parseInt(duration % 60, 10);
|
|
minutes = minutes < 10 ? "0" + minutes : minutes;
|
|
seconds = seconds < 10 ? "0" + seconds : seconds;
|
|
display.text(minutes + ":" + seconds)
|
|
interval = setInterval(function () {
|
|
--timer
|
|
minutes = parseInt(timer / 60, 10);
|
|
seconds = parseInt(timer % 60, 10);
|
|
|
|
minutes = minutes < 10 ? "0" + minutes : minutes;
|
|
seconds = seconds < 10 ? "0" + seconds : seconds;
|
|
|
|
display.text(minutes + ":" + seconds)
|
|
|
|
if (timer <= 0) {
|
|
display.text("دریافت کد");
|
|
display.prop("disabled", false);
|
|
display.data("count", 0);
|
|
clearInterval(interval);
|
|
}
|
|
}, 1000);
|
|
}
|
|
// end timer function
|
|
|
|
// build map
|
|
map = L.map('map', {
|
|
maxBounds: bounds,
|
|
minZoom: mapZoom,
|
|
zoomControl: false,
|
|
}).setView([35.7065, 51.3477], mapZoom);
|
|
map.addLayer(L.tileLayer(`${mapUrl}{z}/{x}/{y}.png`, {
|
|
attributionControl: false,
|
|
attribution: "Open Street Map",
|
|
}));
|
|
mapStartMarker = new L.marker(map.getCenter(), {
|
|
icon: mapStartIcon,
|
|
draggable: true,
|
|
}).addTo(map);
|
|
mapEndMarker = new L.marker(map.getCenter(), {
|
|
icon: mapEndIcon,
|
|
draggable: true,
|
|
});
|
|
// end build map
|
|
|
|
// ready
|
|
$(() => {
|
|
$("[data-mask]").inputmask();
|
|
getWidth() < 508 ? '' : $('[data-toggle="tooltip"]').tooltip();
|
|
// get item list
|
|
$.ajax({
|
|
url: list_item_api,
|
|
type: "GET",
|
|
beforeSend: function () {
|
|
showLoaderScreen();
|
|
},
|
|
success: function (result) {
|
|
const item = result.data;
|
|
$("#item").empty();
|
|
$("#item").append('<option value="0" disabled selected>انتخاب آیتم</option>');
|
|
for (let index = 0; index < item.length; index++) {
|
|
$("#item").append(`<option value="${item[index].id}">${item[index].name}</option>`);
|
|
}
|
|
hideLoaderScreen();
|
|
},
|
|
error: function (error) {
|
|
ajax_error(request.responseJSON, request.status);
|
|
hideLoaderScreen();
|
|
},
|
|
});
|
|
// end get item list
|
|
$("#otpToken_modal").modal({ backdrop: 'static', keyboard: false }, "show");
|
|
});
|
|
// end ready
|
|
|
|
// map movement
|
|
map.on("move", function () {
|
|
if (!isSetMapStartMarker && !isSetMapEndMarker) {
|
|
mapStartMarker.setLatLng(L.latLng(map.getCenter()));
|
|
$("#pin-marker-start").removeClass("pin-set").addClass("pin-move");
|
|
}
|
|
|
|
if (isSetMapStartMarker && !isSetMapEndMarker) {
|
|
mapEndMarker.setLatLng(L.latLng(map.getCenter()));
|
|
$("#pin-marker-end").removeClass("pin-set").addClass("pin-move");
|
|
}
|
|
});
|
|
map.on("moveend", function () {
|
|
if (!isSetMapStartMarker && !isSetMapEndMarker) {
|
|
mapStartMarker.setLatLng(L.latLng(map.getCenter()));
|
|
$("#pin-marker-start").removeClass("pin-move pin-set");
|
|
}
|
|
|
|
if (isSetMapStartMarker && !isSetMapEndMarker) {
|
|
mapEndMarker.setLatLng(L.latLng(map.getCenter()));
|
|
$("#pin-marker-end").removeClass("pin-move pin-set");
|
|
}
|
|
});
|
|
// end map movement
|
|
|
|
// marker movement [start]
|
|
mapStartMarker.on("click", function () {
|
|
if (map.getZoom() >= 14) {
|
|
sourceLat = map.getCenter().lat;
|
|
sourceLng = map.getCenter().lng;
|
|
if (!isSetMapStartMarker) {
|
|
mapStartMarker.setLatLng(L.latLng(map.getCenter()));
|
|
isSetMapStartMarker = true;
|
|
$("#pin-marker-start").removeClass("pin-move pin-warn").addClass("pin-set");
|
|
}
|
|
addSourceMarker(1);
|
|
map.panBy(L.point(10, 10));
|
|
mapEndMarker.setLatLng(mapStartMarker.getLatLng()).addTo(map);
|
|
$("#pin-marker-start").removeClass("pin-move pin-warn").addClass("pin-set");
|
|
} else {
|
|
Swal.fire({
|
|
icon: "warning",
|
|
title: "خطا",
|
|
text: "لطفا زوم نقشه خود را بیشتر کنید",
|
|
cancelButtonText: "بستن",
|
|
showConfirmButton: false,
|
|
showCancelButton: true,
|
|
});
|
|
}
|
|
});
|
|
|
|
mapStartMarker.on("drag", function () {
|
|
$("#pin-marker-start").addClass("pin-move");
|
|
});
|
|
|
|
mapStartMarker.on("dragend", function () {
|
|
$("#pin-marker-start").removeClass("pin-move");
|
|
if ($("#pin-marker-start").hasClass("pin-set") || isSetMapStartMarker) {
|
|
$("#pin-marker-start").addClass("pin-set");
|
|
// checkMarkersAndDrawPath();
|
|
} else {
|
|
map.setView(mapStartMarker.getLatLng());
|
|
}
|
|
});
|
|
|
|
function addSourceMarker(type) {
|
|
let sourceCoordinates = null;
|
|
if (type == 1) {
|
|
sourceCoordinates = L.latLng(map.getCenter());
|
|
} else if (type == 2) {
|
|
sourceCoordinates = [sourceLat, sourceLng];
|
|
}
|
|
}
|
|
// end marker movement
|
|
|
|
// marker movement [end]
|
|
mapEndMarker.on("click", function () {
|
|
if (map.getZoom() >= 14) {
|
|
destLat = map.getCenter().lat;
|
|
destLng = map.getCenter().lng;
|
|
$("#pin-marker-end").removeClass("pin-move pin-warn").addClass("pin-set");
|
|
addDestinationMarker(1);
|
|
$("#add_item").prop("disabled", false);
|
|
$("#add_patrol").prop("disabled", false);
|
|
if (!isSetMapEndMarker) {
|
|
mapEndMarker.setLatLng(L.latLng(map.getCenter()));
|
|
isSetMapEndMarker = true;
|
|
$("#pin-marker-end").removeClass("pin-move").addClass("pin-set");
|
|
}
|
|
// checkMarkersAndDrawPath();
|
|
} else {
|
|
Swal.fire({
|
|
icon: "warning",
|
|
title: "خطا",
|
|
text: "لطفا زوم نقشه خود را بیشتر کنید",
|
|
cancelButtonText: "بستن",
|
|
showConfirmButton: false,
|
|
showCancelButton: true,
|
|
});
|
|
}
|
|
});
|
|
mapEndMarker.on("drag", function () {
|
|
$("#pin-marker-end").addClass("pin-move");
|
|
// checkMarkersAndDrawPath();
|
|
});
|
|
|
|
mapEndMarker.on("dragend", function () {
|
|
$("#pin-marker-end").removeClass("pin-move");
|
|
if ($("#pin-marker-end").hasClass("pin-set") || isSetMapEndMarker) {
|
|
$("#pin-marker-end").addClass("pin-set");
|
|
// checkMarkersAndDrawPath();
|
|
} else {
|
|
map.setView(mapEndMarker.getLatLng());
|
|
}
|
|
});
|
|
function addDestinationMarker(type) {
|
|
let destinationCoordinates = null;
|
|
if (type == 1) {
|
|
destinationCoordinates = L.latLng(map.getCenter());
|
|
} else if (type == 2) {
|
|
destinationCoordinates = [destLat, destLng];
|
|
}
|
|
}
|
|
// end marker movement
|
|
|
|
// function checkMarkersAndDrawPath() {
|
|
// setTimeout(() => {
|
|
// if (
|
|
// $("#pin-marker-start").hasClass("pin-set") &&
|
|
// !$("#pin-marker-start").hasClass("pin-move") &&
|
|
// $("#pin-marker-end").hasClass("pin-set") &&
|
|
// !$("#pin-marker-end").hasClass("pin-move")
|
|
// ) {
|
|
// showLoaderScreen();
|
|
// drawPath();
|
|
// } else {
|
|
// if (routeControls.length) {
|
|
// $(routeControls).each(function (index, control) {
|
|
// map.removeControl(control);
|
|
// routeControls.splice(routeControls.indexOf(index), 1);
|
|
// });
|
|
// }
|
|
// }
|
|
// }, 20);
|
|
// }
|
|
// function drawPath() {
|
|
// 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(mapStartMarker.getLatLng().lat),
|
|
// parseFloat(mapStartMarker.getLatLng().lng)
|
|
// ),
|
|
// L.latLng(
|
|
// parseFloat(mapEndMarker.getLatLng().lat),
|
|
// parseFloat(mapEndMarker.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",
|
|
// closeOnClick: false,
|
|
// };
|
|
// 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
|
|
// );
|
|
// popup.setLatLng(popupLocation);
|
|
// popup.setContent(popupContent);
|
|
// popupArrays.push(popup);
|
|
// map.addLayer(popup);
|
|
// }).addTo(map)
|
|
// );
|
|
// map.flyToBounds([mapStartMarker.getLatLng(), mapEndMarker.getLatLng()]);
|
|
|
|
// $(".leaflet-control-container").css("display", "none");
|
|
// $(".leaflet-routing-container-hide").css("display", "none");
|
|
// hideLoaderScreen();
|
|
// }
|
|
// function drawPathAddMap() {
|
|
// if (routeControlsAddMap.length) {
|
|
// $(routeControlsAddMap).each(function (index, control) {
|
|
// addMap.removeControl(control);
|
|
// routeControlsAddMap.splice(routeControlsAddMap.indexOf(index), 1);
|
|
// });
|
|
// }
|
|
// routeControlsAddMap.push(
|
|
// L.Routing.control({
|
|
// waypoints: [
|
|
// L.latLng(
|
|
// parseFloat(mapStartMarker.getLatLng().lat),
|
|
// parseFloat(mapStartMarker.getLatLng().lng)
|
|
// ),
|
|
// L.latLng(
|
|
// parseFloat(mapEndMarker.getLatLng().lat),
|
|
// parseFloat(mapEndMarker.getLatLng().lng)
|
|
// ),
|
|
// ],
|
|
// fitSelectedRoutes: false,
|
|
// draggableWaypoints: true,
|
|
// createMarker: function () {
|
|
// return null;
|
|
// },
|
|
// lineOptions: {
|
|
// addWaypoints: false,
|
|
// styles: [{
|
|
// color: "#28a745",
|
|
// opacity: 0.8,
|
|
// weight: 5,
|
|
// },],
|
|
// },
|
|
// }).addTo(addMap)
|
|
// );
|
|
// addMap.flyToBounds([mapStartMarker.getLatLng(), mapEndMarker.getLatLng()]);
|
|
// $(".leaflet-control-container").css("display", "none");
|
|
// $(".leaflet-routing-container-hide").css("display", "none");
|
|
// hideLoaderScreen();
|
|
// }
|
|
// function drawPathtest() {
|
|
// if (routeControlstest.length) {
|
|
// $(routeControlstest).each(function (index, control) {
|
|
// addMap.removeControl(control);
|
|
// routeControlstest.splice(routeControlstest.indexOf(index), 1);
|
|
// });
|
|
// }
|
|
// routeControlstest.push(
|
|
// L.Routing.control({
|
|
// waypoints: [
|
|
// L.latLng(
|
|
// parseFloat(startMarkerAdd.getLatLng().lat),
|
|
// parseFloat(startMarkerAdd.getLatLng().lng)
|
|
// ),
|
|
// L.latLng(
|
|
// parseFloat(endMarkerAdd.getLatLng().lat),
|
|
// parseFloat(endMarkerAdd.getLatLng().lng)
|
|
// ),
|
|
// ],
|
|
// fitSelectedRoutes: false,
|
|
// draggableWaypoints: true,
|
|
// createMarker: function () {
|
|
// return null;
|
|
// },
|
|
// lineOptions: {
|
|
// addWaypoints: false,
|
|
// styles: [{
|
|
// color: "transparent",
|
|
// opacity: 0,
|
|
// weight: 0,
|
|
// },],
|
|
// },
|
|
// }).on("routesfound", function (e) {
|
|
// }).addTo(addMap)
|
|
// )
|
|
// addMap.flyToBounds([startMarkerAdd.getLatLng(), endMarkerAdd.getLatLng()], {padding: [2,2]})
|
|
// $(".leaflet-control-container").css("display", "none");
|
|
// $(".leaflet-routing-container-hide").css("display", "none");
|
|
// hideLoaderScreen();
|
|
// }
|
|
|
|
// plaque
|
|
$(document).on("click", "#plaque_word_add1", function () {
|
|
const modal = $("#plaque_text_modal");
|
|
modal.modal("show");
|
|
modal.find(".select-text").prop("disabled", false)
|
|
modal.find(".last-time-select").prop("disabled", true)
|
|
});
|
|
|
|
$('#plaque_text_box').on("click", ".select-text", function () {
|
|
const modal = $(this).parents(".modal");
|
|
$("#plaque_word_add1").empty();
|
|
$("#plaque_word_add1").data("value", $(this).data("value"));
|
|
if ($(this).data("value") == "*") {
|
|
$("#plaque_word_add1").append(`<i class="fa fa-wheelchair"></i>`);
|
|
} else {
|
|
$("#plaque_word_add1").append($(this).data("value"));
|
|
}
|
|
modal.find(".select-text").removeClass("last-time-select")
|
|
$(this).addClass("last-time-select");
|
|
modal.modal("hide");
|
|
});
|
|
|
|
function searchPlaque() {
|
|
var input, filter, ul, li, i, txtValue;
|
|
input = document.getElementById("serach_plaque_field");
|
|
filter = input.value.toUpperCase();
|
|
ul = document.getElementById("plaque_text_box");
|
|
li = ul.getElementsByTagName("button");
|
|
for (i = 0; i < li.length; i++) {
|
|
txtValue = li[i].textContent || li[i].innerText;
|
|
if (txtValue.toUpperCase().indexOf(filter) > -1) {
|
|
li[i].style.display = "";
|
|
} else {
|
|
li[i].style.display = "none";
|
|
}
|
|
}
|
|
}
|
|
// end plaque
|
|
|
|
// add item
|
|
$(document).on("click", "#add_item", function () {
|
|
if (isSetMapStartMarker && isSetMapEndMarker)
|
|
$("#addItem_modal").modal({ backdrop: 'static', keyboard: false }, "show");
|
|
else {
|
|
Swal.fire({
|
|
icon: "warning",
|
|
title: "خطا",
|
|
text: "ابتدا نقطه شروع و پایان گشت را انتخاب کنید",
|
|
cancelButtonText: "بستن",
|
|
showConfirmButton: false,
|
|
showCancelButton: true,
|
|
});
|
|
}
|
|
});
|
|
// end add item
|
|
|
|
// get sub item list
|
|
$(document).on("change", "#item", function () {
|
|
const parent = $(this).parents(".modal");
|
|
parent.find(".unit").text("");
|
|
parent.find(".upload-box").addClass("d-none");
|
|
parent.find("#item_amount").prop("disabled", true);
|
|
addMap.removeLayer(endMarkerAdd);
|
|
$.ajax({
|
|
url: list_sub_item_api + $(this).find("option:selected").val(),
|
|
type: "GET",
|
|
beforeSend: function () {
|
|
showLoaderScreen();
|
|
parent.find("#sub_item").append(`<option value="-1" selected>در حال بروزرسانی...</option>`);
|
|
},
|
|
success: function (result) {
|
|
const sub_item = result.data;
|
|
$("#sub_item").empty();
|
|
$("#sub_item").append('<option value="0" disabled selected>انتخاب موضوع مشاهده شده</option>');
|
|
$("#sub_item").prop("disabled", false);
|
|
for (let index = 0; index < sub_item.length; index++) {
|
|
$("#sub_item").append(`<option value="${sub_item[index].sub_item}" data-sub-unit="${sub_item[index].unit}" data-sub-image="${sub_item[index].needs_image}" data-sub-endpoint="${sub_item[index].needs_end_point}">${sub_item[index].name}</option>`);
|
|
}
|
|
hideLoaderScreen();
|
|
},
|
|
error: function (error) {
|
|
ajax_error(request.responseJSON, request.status);
|
|
hideLoaderScreen();
|
|
},
|
|
});
|
|
});
|
|
// end get sub item list
|
|
|
|
// get sub item list
|
|
$(document).on("change", "#sub_item", function () {
|
|
const parent = $(this).parents(".modal");
|
|
parent.find(".unit").text(`(${$(this).find("option:selected").data("subUnit")})`);
|
|
parent.find("#item_amount").prop("disabled", false);
|
|
if ($(this).find("option:selected").data("subImage") == 1) {
|
|
parent.find(".upload-box").removeClass("d-none");
|
|
} else {
|
|
parent.find(".upload-box").addClass("d-none");
|
|
}
|
|
if ($(`input[name="action-status"]:checked`).val() == 1) {
|
|
$("#add-pin-marker-start").find(".title-circle-text").text("شروع");
|
|
if (isSetStartMarkerAdd) {
|
|
if ($(this).find("option:selected").data("subEndpoint") == 1) {
|
|
isSetEndMarkerAdd = false;
|
|
addMap.flyTo(startMarkerAdd.getLatLng(), 15);
|
|
endMarkerAdd.setLatLng(startMarkerAdd.getLatLng(), { draggable: true, }).addTo(addMap);
|
|
$("#add-pin-marker-end").removeClass("pin-set");
|
|
} else {
|
|
addMap.removeLayer(endMarkerAdd);
|
|
}
|
|
}
|
|
} else {
|
|
$("#add-pin-marker-start").find(".title-circle-text").text("محل");
|
|
addMap.removeLayer(endMarkerAdd);
|
|
}
|
|
});
|
|
// end get sub item list
|
|
|
|
// item modal for add
|
|
$('#addItem_modal').on('show.bs.modal', function () {
|
|
const parent = $("#addItem_modal");
|
|
parent.find(".unit").text("");
|
|
parent.find(".upload-box").addClass("d-none");
|
|
parent.find("#action_do").prop("checked", false);
|
|
parent.find("#action_dont").prop("checked", true);
|
|
parent.find(".value-important").removeClass("invalid").removeClass("valid");
|
|
parent.find(".no-action-data").slideDown();
|
|
parent.find("#item_amount").prop("disabled", true);
|
|
const image_box_parent = parent.find(".action-data");
|
|
image_box_parent.slideUp();
|
|
image_box_parent.find(".img-input").val("");
|
|
image_box_parent.find(".img-preview").removeAttr("src");
|
|
image_box_parent.find(".img-title").css("display", "");
|
|
image_box_parent.find(".btn-delete-img").attr("disabled", "disabled");
|
|
parent.find(".clean-select").val("0");
|
|
parent.find("#sub_item").prop("disabled", true);
|
|
parent.find(".clean-input").val("");
|
|
parent.find(".clean-textarea").val("");
|
|
if (addMap == null) {
|
|
setTimeout(() => {
|
|
createAddMap();
|
|
}, 400);
|
|
} else {
|
|
setTimeout(() => {
|
|
clearAddMap();
|
|
}, 400);
|
|
}
|
|
});
|
|
// end item modal for add
|
|
|
|
// uploading file input
|
|
$(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]);
|
|
}
|
|
});
|
|
$(".btn-delete-img").on("click", 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");
|
|
});
|
|
// end uploading file input
|
|
|
|
$(document).on("change", 'input[name="action-status"]', function () {
|
|
const parent = $(this).parents(".modal");
|
|
if ($(`input[name="action-status"]:checked`).val() == 1) {
|
|
parent.find(".action-data").slideDown();
|
|
parent.find(".no-action-data").slideUp()
|
|
$("#add-pin-marker-start").find(".title-circle-text").text("شروع");
|
|
if (isSetStartMarkerAdd) {
|
|
if ($("#sub_item").find("option:selected").data("subEndpoint") == 1) {
|
|
isSetEndMarkerAdd = false;
|
|
addMap.flyTo(startMarkerAdd.getLatLng(), 15);
|
|
endMarkerAdd.setLatLng(startMarkerAdd.getLatLng(), { draggable: true, }).addTo(addMap);
|
|
$("#add-pin-marker-end").removeClass("pin-set");
|
|
} else {
|
|
addMap.removeLayer(endMarkerAdd);
|
|
}
|
|
}
|
|
} else {
|
|
parent.find(".action-data").slideUp();
|
|
parent.find(".no-action-data").slideDown();
|
|
$("#add-pin-marker-start").find(".title-circle-text").text("محل");
|
|
addMap.removeLayer(endMarkerAdd);
|
|
}
|
|
});
|
|
|
|
// clear add map
|
|
function clearAddMap() {
|
|
isSetStartMarkerAdd = false;
|
|
isSetEndMarkerAdd = false;
|
|
addMap.removeLayer(startMarkerAdd);
|
|
if (endMarkerAdd != null) {
|
|
addMap.removeLayer(endMarkerAdd);
|
|
}
|
|
addMap.setView([35.7065, 51.3477], mapZoom);
|
|
setMarkerDefaultAdd();
|
|
// drawPathAddMap();
|
|
}
|
|
// end clear add map
|
|
|
|
// add map functions
|
|
function createAddMap() {
|
|
var bounds = [
|
|
[42.9130026312, 75.6166317076],
|
|
[20.5782370061, 35.5092252948],
|
|
];
|
|
addMap = L.map("add_map", {
|
|
maxBounds: bounds,
|
|
minZoom: 6,
|
|
zoomControl: false,
|
|
}).setView([35.7065, 51.3477], mapZoom);
|
|
addMap.addLayer(L.tileLayer(`${mapUrl}{z}/{x}/{y}.png`, {
|
|
attributionControl: false,
|
|
attribution: "Open Street Map",
|
|
}));
|
|
setMarkerDefaultAdd();
|
|
// drawPathAddMap();
|
|
}
|
|
|
|
function setMarkerDefaultAdd() {
|
|
isSetStartMarkerAdd = false;
|
|
isSetEndMarkerAdd = false;
|
|
$("#add-pin-marker-end").removeClass("pin-set");
|
|
$("#add-pin-marker-start").removeClass("pin-set");
|
|
startMarkerAdd = new L.marker(L.latLng(addMap.getCenter()), {
|
|
icon: startDivIcon,
|
|
draggable: true,
|
|
}).addTo(addMap);
|
|
|
|
endMarkerAdd = new L.marker(L.latLng(addMap.getCenter()), {
|
|
icon: endDivIcon,
|
|
draggable: true,
|
|
});
|
|
|
|
addMap.on("move", function () {
|
|
if (!isSetStartMarkerAdd && !isSetEndMarkerAdd) {
|
|
startMarkerAdd.setLatLng(L.latLng(addMap.getCenter()));
|
|
$("#add-pin-marker-start").removeClass("pin-set").addClass("pin-move");
|
|
}
|
|
|
|
if (isSetStartMarkerAdd && !isSetEndMarkerAdd) {
|
|
endMarkerAdd.setLatLng(L.latLng(addMap.getCenter()));
|
|
$("#add-pin-marker-end").removeClass("pin-set").addClass("pin-move");
|
|
}
|
|
});
|
|
|
|
addMap.on("moveend", function () {
|
|
if (!isSetStartMarkerAdd && !isSetEndMarkerAdd) {
|
|
startMarkerAdd.setLatLng(L.latLng(addMap.getCenter()));
|
|
$("#add-pin-marker-start").removeClass("pin-move pin-set");
|
|
}
|
|
|
|
if (isSetStartMarkerAdd && !isSetEndMarkerAdd) {
|
|
endMarkerAdd.setLatLng(L.latLng(addMap.getCenter()));
|
|
$("#add-pin-marker-end").removeClass("pin-move pin-set");
|
|
}
|
|
});
|
|
|
|
startMarkerAdd.on("click", function () {
|
|
if (addMap.getZoom() >= 14) {
|
|
if (!isSetStartMarkerAdd) {
|
|
startMarkerAdd.setLatLng(L.latLng(addMap.getCenter()));
|
|
endMarkerAdd.setLatLng(L.latLng(addMap.getCenter()));
|
|
isSetStartMarkerAdd = true;
|
|
$("#add-pin-marker-start").removeClass("pin-move pin-warn").addClass("pin-set");
|
|
}
|
|
if ($(`input[name="action-status"]:checked`).val() == 1) {
|
|
if ($("#sub_item").find("option:selected").data("subEndpoint") == 1) {
|
|
endMarkerAdd.setLatLng(startMarkerAdd.getLatLng(), { draggable: true, }).addTo(addMap);
|
|
addMap.panBy(L.point(10, 10));
|
|
}
|
|
}
|
|
|
|
$(this).hide();
|
|
$("#add-pin-marker-start").removeClass("pin-move pin-warn").addClass("pin-set");
|
|
} else {
|
|
Swal.fire({
|
|
icon: "warning",
|
|
title: "خطا",
|
|
text: "لطفا زوم نقشه خود را بیشتر کنید",
|
|
cancelButtonText: "بستن",
|
|
showConfirmButton: false,
|
|
showCancelButton: true,
|
|
});
|
|
}
|
|
});
|
|
|
|
startMarkerAdd.on("drag", function () {
|
|
$("#add-pin-marker-start").addClass("pin-move");
|
|
});
|
|
|
|
startMarkerAdd.on("dragend", function () {
|
|
$("#add-pin-marker-start").removeClass("pin-move");
|
|
if ($("#add-pin-marker-start").hasClass("pin-set") || isSetStartMarkerAdd) {
|
|
$("#add-pin-marker-start").addClass("pin-set");
|
|
// drawPathtest()
|
|
|
|
} else {
|
|
addMap.setView(startMarkerAdd.getLatLng());
|
|
}
|
|
});
|
|
|
|
endMarkerAdd.on("click", function () {
|
|
if (addMap.getZoom() >= 14) {
|
|
if (!isSetEndMarkerAdd) {
|
|
isSetEndMarkerAdd = true;
|
|
$("#add-pin-marker-end").removeClass("pin-move pin-warn").addClass("pin-set");
|
|
}
|
|
// drawPathtest()
|
|
} else {
|
|
Swal.fire({
|
|
icon: "warning",
|
|
title: "خطا",
|
|
text: "لطفا زوم نقشه خود را بیشتر کنید",
|
|
cancelButtonText: "بستن",
|
|
showConfirmButton: false,
|
|
showCancelButton: true,
|
|
});
|
|
}
|
|
});
|
|
|
|
endMarkerAdd.on("drag", function () {
|
|
$("#add-pin-marker-end").addClass("pin-move");
|
|
});
|
|
|
|
endMarkerAdd.on("dragend", function () {
|
|
$("#add-pin-marker-end").removeClass("pin-move");
|
|
|
|
if ($("#add-pin-marker-end").hasClass("pin-set") || isSetEndMarkerAdd) {
|
|
$("#add-pin-marker-end").addClass("pin-set");
|
|
// drawPathtest()
|
|
} else {
|
|
addMap.setView(endMarkerAdd.getLatLng());
|
|
}
|
|
});
|
|
}
|
|
// add map functions
|
|
|
|
// add item cta
|
|
$(document).on("click", "#addItem_cta", function () {
|
|
const modal = $(this).parents(".modal");
|
|
modal.find("select.value-important").each(function () {
|
|
$(this).find("option:selected").val() == 0 ? $(this).removeClass("valid").addClass("invalid") : $(this).removeClass("invalid").addClass("valid");
|
|
});
|
|
modal.find("input.value-important").each(function () {
|
|
$(this).val() == "" ? $(this).removeClass("valid").addClass("invalid") : $(this).removeClass("invalid").addClass("valid");
|
|
});
|
|
modal.find("textarea.value-important").each(function () {
|
|
$(this).val() == "" ? $(this).removeClass("valid").addClass("invalid") : $(this).removeClass("invalid").addClass("valid");
|
|
});
|
|
modal.find(".upload-box").each(function () {
|
|
$(this).find(".img-input").get(0).files[0] == undefined ? $(this).find(".imgbox").removeClass("valid").addClass("invalid") : $(this).find(".imgbox").removeClass("invalid").addClass("valid")
|
|
});
|
|
if ($(`input[name="action-status"]:checked`).val() == 0) {
|
|
$("#item_amount").removeClass("invalid").addClass("valid");
|
|
$("#description").removeClass("invalid").addClass("valid");
|
|
$(".upload-box").find(".imgbox").removeClass("invalid").addClass("valid");
|
|
} else {
|
|
$(".no-action-data").find(".value-important").removeClass("invalid").addClass("valid")
|
|
}
|
|
if ($(".upload-box").hasClass("d-none")) { $(".upload-box").find(".imgbox").removeClass("invalid").addClass("valid") }
|
|
if (!isSetStartMarkerAdd) {
|
|
$("#add-pin-marker-start").addClass("pin-warn");
|
|
Swal.fire({
|
|
icon: "warning",
|
|
title: "خطا",
|
|
text: "لطفا موقعیت فعالیت را روی نقشه مشخص کنید! (شروع)",
|
|
cancelButtonText: "بستن",
|
|
showConfirmButton: false,
|
|
showCancelButton: true,
|
|
});
|
|
} else { $("#add-pin-marker-start").removeClass("pin-warn") }
|
|
if ((isSetStartMarkerAdd && !isSetEndMarkerAdd) && $("#sub_item").find("option:selected").data("subEndpoint") == 1 && $(`input[name="action-status"]:checked`).val() == 1) {
|
|
$("#add-pin-marker-end").addClass("pin-warn");
|
|
Swal.fire({
|
|
icon: "warning",
|
|
title: "خطا",
|
|
text: "لطفا موقعیت فعالیت را روی نقشه مشخص کنید! (پایان)",
|
|
cancelButtonText: "بستن",
|
|
showConfirmButton: false,
|
|
showCancelButton: true,
|
|
});
|
|
} else { $("#add-pin-marker-end").removeClass("pin-warn") }
|
|
if (modal.find(".invalid").length != 0 || modal.find(".pin-warn").length != 0) { return } else {
|
|
let data_items = {};
|
|
const item_id = modal.find("#item option:selected").val();
|
|
const item_text = modal.find("#item option:selected").text();
|
|
const sub_item_id = modal.find("#sub_item option:selected").val();
|
|
const sub_item_text = modal.find("#sub_item option:selected").text();
|
|
const local_name = modal.find("#local_name").val();
|
|
const instant_action = modal.find("input[name='action-status']:checked").val();
|
|
const description = modal.find("#description").val();
|
|
const start_point = `${startMarkerAdd.getLatLng().lat.toFixed(6)},${startMarkerAdd.getLatLng().lng.toFixed(6)}`;
|
|
if (modal.find("input[name='action-status']:checked").val() == "1") {
|
|
const amount = modal.find("#item_amount").val();
|
|
data_items.amount = amount;
|
|
if ($("#sub_item").find("option:selected").data("subImage") == 1) {
|
|
const image_before = $("#deviceImg1").get(0).files[0];
|
|
const image_after = $("#deviceImg2").get(0).files[0];
|
|
data_items.image_before = image_before;
|
|
data_items.image_after = image_after;
|
|
}
|
|
if ($("#sub_item").find("option:selected").data("subEndpoint") == 1) {
|
|
const end_point = `${endMarkerAdd.getLatLng().lat.toFixed(6)},${endMarkerAdd.getLatLng().lng.toFixed(6)}`;
|
|
data_items.end_point = end_point;
|
|
}
|
|
} else {
|
|
const priority = modal.find("#priority option:selected").val();
|
|
const priority_text = modal.find("#priority option:selected").text();
|
|
data_items.priority = priority;
|
|
data_items.priority_text = priority_text;
|
|
}
|
|
const marker = L.marker([startMarkerAdd.getLatLng().lat.toFixed(6), startMarkerAdd.getLatLng().lng.toFixed(6)], { icon: item_icon }).addTo(map);
|
|
marker_list.push({ marker: marker, item_unique_id: item_unique_id });
|
|
data_items.item_unique_id = item_unique_id++;
|
|
data_items.item_id = item_id;
|
|
data_items.item_text = item_text;
|
|
data_items.sub_item_id = sub_item_id;
|
|
data_items.sub_item_text = sub_item_text;
|
|
data_items.local_name = local_name;
|
|
data_items.instant_action = instant_action;
|
|
data_items.description = description;
|
|
data_items.start_point = start_point;
|
|
observed_items.push(data_items);
|
|
$("#item_list").prop("disabled", false);
|
|
$(".item-counter").find("p").text(++item_counter);
|
|
if (item_counter == 8) {
|
|
$("#add_item").prop("disabled", true);
|
|
} else {
|
|
$("#add_item").prop("disabled", false);
|
|
}
|
|
modal.modal("hide");
|
|
}
|
|
});
|
|
// end add item cta
|
|
|
|
// list of items
|
|
$(document).on("click", "#item_list", function () {
|
|
const modal = $("#listItem_modal");
|
|
$(".show-all-items").empty();
|
|
for (let i = 0; i < observed_items.length; i++) {
|
|
list_item_maker({
|
|
item_unique_id: observed_items[i].item_unique_id,
|
|
item_text: observed_items[i].item_text,
|
|
amount: observed_items[i].amount,
|
|
instant_action: observed_items[i].instant_action,
|
|
priority_text: observed_items[i].priority_text
|
|
});
|
|
}
|
|
modal.modal("show");
|
|
});
|
|
function list_item_maker({ item_unique_id, item_text, amount, instant_action, priority_text }) {
|
|
let each_item = ``;
|
|
each_item = `
|
|
<div class="each-item align-items-center justify-content-between my-2 rounded" data-unique-id="${item_unique_id}">
|
|
<div class="d-flex flex-column align-items-center">
|
|
<div class="d-flex justify-content-between w-100">
|
|
<p class="header-items text-nowrap">آیتم</p>
|
|
<hr class="col mx-2">
|
|
<p class="data-items mr-1">${item_text}</p>
|
|
</div>
|
|
<div class="d-flex justify-content-between w-100">
|
|
<p class="header-items text-nowrap">شرح اقدام</p>
|
|
<hr class="col mx-2">
|
|
<p class="data-items mr-1">${instant_action == 1 ? "اقدام شده" : "اقدام نشده"}</p>
|
|
</div>
|
|
${instant_action == 1 ? `<div class="d-flex justify-content-between w-100">
|
|
<p class="header-items text-nowrap">مقدار فعالیت</p>
|
|
<hr class="col mx-2">
|
|
<p class="data-items mr-1">${amount}</p>
|
|
</div>` : `<div class="d-flex justify-content-between w-100">
|
|
<p class="header-items text-nowrap">میزان فوریت</p>
|
|
<hr class="col mx-2">
|
|
<p class="data-items mr-1">${priority_text}</p>
|
|
</div>` }
|
|
|
|
</div>
|
|
</div>`;
|
|
$(".show-all-items").append(each_item);
|
|
}
|
|
// end list of items
|
|
|
|
// show complete item data
|
|
$(document).on("click", ".each-item", function () {
|
|
mapShow = null;
|
|
const id = $(this).data("uniqueId");
|
|
$(".complete-data-item").empty();
|
|
const observed_item = observed_items.find(item => item.item_unique_id === id)
|
|
item_complete_data(observed_item);
|
|
$("#completeData_modal").find("#delete_item").data("id", observed_item.item_unique_id);
|
|
$("#completeData_modal").modal("show");
|
|
const latLon = observed_item.start_point.split(",")
|
|
const markerPosition = [latLon[0], latLon[1]];
|
|
buildMapShowAndMarker(markerPosition).then(() => {
|
|
hideLoaderScreen();
|
|
});
|
|
});
|
|
function item_complete_data(data) {
|
|
const latLon = data.start_point.split(",")
|
|
let complete_data_item = ``;
|
|
complete_data_item = `<div class="d-flex justify-content-center align-items-center">
|
|
<p class="text-nowrap quest-action">شرح اقدام اولیه در محل</p>
|
|
<hr class="col mx-2">
|
|
<p class="text-nowrap answer-action">${data.instant_action == 1 ? "اقدام شده" : "اقدام نشده"}</p>
|
|
</div>
|
|
<div class="d-flex flex-column flex-wrap align-items-start">
|
|
<hr class="col">
|
|
<div class="d-flex">
|
|
<p class="text-nowrap mx-2 quest-action">آیتم:</p>
|
|
<p class="mr-1 answer-action">${data.item_text}</p>
|
|
</div>
|
|
<hr class="col">
|
|
<div class="d-flex">
|
|
<p class="text-nowrap mx-2 quest-action">موضوع مشاهده شده:</p>
|
|
<p class="mr-1 answer-action">${data.sub_item_text}</p>
|
|
</div>
|
|
<hr class="col">
|
|
<div class="d-flex">
|
|
<p class="text-nowrap mx-2 quest-action">نام محلی:</p>
|
|
<p class="mr-1 answer-action">${data.local_name}</p>
|
|
</div>
|
|
<hr class="col">
|
|
<div class="d-flex flex-wrap w-100 align-items-end justify-content-around">
|
|
<div class="map-show-box img-thumbnail">
|
|
<div class="map-self-design" id="map_show"></div>
|
|
</div>
|
|
<div>
|
|
<table class="table table-bordered mb-0 mt-1">
|
|
<thead>
|
|
<tr>
|
|
<th class="text-center">عرض جغرافیایی</th>
|
|
<th class="text-center">طول جغرافیایی</th>
|
|
</tr>
|
|
</thead>
|
|
<tbody>
|
|
<tr>
|
|
<td class="text-center">${latLon[0]}</td>
|
|
<td class="text-center">${latLon[1]}</td>
|
|
</tr>
|
|
</tbody>
|
|
</table>
|
|
</div>
|
|
</div>
|
|
<hr class="col">
|
|
${data.instant_action == 1 ? `<div class="d-flex">
|
|
<p class="text-nowrap mx-2 quest-action">شرح اقدام اولیه انجام شده:</p>
|
|
<p class="mr-1 answer-action">${data.description}</p>
|
|
</div>
|
|
<hr class="col">
|
|
<div class="d-flex">
|
|
<p class="text-nowrap mx-2 quest-action">مقدار فعالیت:</p>
|
|
<p class="mr-1 answer-action">${data.amount}</p>
|
|
</div>
|
|
${data.image_before != undefined && data.image_after != undefined ? `<hr class="col"><div class="d-flex flex-wrap justify-content-around align-items-center w-100">
|
|
<div class="d-flex flex-column align-items-center justify-content-center my-2">
|
|
<p class="text-nowrap mx-2 quest-action mb-1">عکس قبل از اقدام</p>
|
|
<img class="image-box-item" src="${URL.createObjectURL(data.image_before)}" alt="image before">
|
|
</div>
|
|
<div class="d-flex flex-column align-items-center justify-content-center my-2">
|
|
<p class="text-nowrap mx-2 quest-action mb-1">عکس بعد از اقدام</p>
|
|
<img class="image-box-item" src="${URL.createObjectURL(data.image_after)}" alt="image after">
|
|
<div/>
|
|
</div>` : ``}
|
|
` : `<div class="d-flex">
|
|
<p class="text-nowrap mx-2 quest-action">میزان فوریت رسیدگی:</p>
|
|
<p class="mr-1 answer-action">${data.priority_text}</p>
|
|
</div>` }
|
|
</div>`;
|
|
$(".complete-data-item").append(complete_data_item);
|
|
}
|
|
// end show complete item data
|
|
|
|
// delete item from list
|
|
$(document).on("click", "#delete_item", function () {
|
|
const id = $(this).data("id");
|
|
Swal.fire({
|
|
icon: "warning",
|
|
title: "آیا برای حذف مطمئن هستید؟",
|
|
showCancelButton: true,
|
|
confirmButtonColor: "#971b1b",
|
|
cancelButtonColor: "#2d7c23",
|
|
confirmButtonText: "بله، حذف میشود",
|
|
cancelButtonText: "منصرف شدم!",
|
|
showLoaderOnConfirm: true,
|
|
preConfirm: () => {
|
|
let new_marker_list = marker_list.filter(item => item.item_unique_id === id);
|
|
map.removeLayer(new_marker_list[0].marker);
|
|
new_marker_list.pop();
|
|
observed_items = observed_items.filter(item => item.item_unique_id !== id);
|
|
$(".show-all-items").empty();
|
|
if (observed_items.length == 0) {
|
|
$("#listItem_modal").modal("hide");
|
|
--item_counter
|
|
$(".item-counter").find("p").text(0);
|
|
$("#item_list").prop("disabled", true);
|
|
} else
|
|
$(".item-counter").find("p").text(--item_counter);
|
|
$(this).parents(".modal").modal("hide");
|
|
for (let i = 0; i < observed_items.length; i++) {
|
|
list_item_maker({
|
|
item_unique_id: observed_items[i].item_unique_id,
|
|
item_text: observed_items[i].item_text,
|
|
amount: observed_items[i].amount,
|
|
instant_action: observed_items[i].instant_action,
|
|
priority_text: observed_items[i].priority_text
|
|
});
|
|
}
|
|
$("#add_item").prop("disabled", false);
|
|
},
|
|
});
|
|
});
|
|
// end delete item from list
|
|
|
|
$(document).on("click", "#add_patrol", function () {
|
|
if (isSetMapStartMarker && isSetMapEndMarker) {
|
|
const userInfoModal = $("#userInfo_modal");
|
|
userInfoModal.find("input.value-important").each(function () {
|
|
$(this).val() == "" ? $(this).removeClass("valid").addClass("invalid") : $(this).removeClass("invalid").addClass("valid");
|
|
});
|
|
userInfoModal.find(".text-plaque").each(function () {
|
|
$(this).val() == "" ? $(this).removeClass("valid").addClass("invalid") : $(this).removeClass("invalid").addClass("valid");
|
|
});
|
|
if (isEmpty(userInfoModal.find(".div-plaque"))) {
|
|
userInfoModal.find(".div-plaque").addClass("invalid").removeClass("valid");
|
|
} else {
|
|
userInfoModal.find(".div-plaque").addClass("valid").removeClass("invalid");
|
|
}
|
|
if (userInfoModal.find(".invalid").length != 0) {
|
|
userInfoModal.modal("show");
|
|
} else {
|
|
if (observed_items.length == 0) {
|
|
$("#description_modal").modal("show");
|
|
} else {
|
|
addPatrol(1);
|
|
}
|
|
}
|
|
} else {
|
|
Swal.fire({
|
|
icon: "warning",
|
|
title: "خطا",
|
|
text: "ابتدا نقطه شروع و پایان گشت را انتخاب کنید",
|
|
cancelButtonText: "بستن",
|
|
showConfirmButton: false,
|
|
showCancelButton: true,
|
|
});
|
|
}
|
|
});
|
|
|
|
// add road patrol cta
|
|
$(document).on("click", "#userInfo_cta", function () {
|
|
const modal = $(this).parents(".modal");
|
|
modal.find("input.value-important").each(function () {
|
|
$(this).val() == "" ? $(this).removeClass("valid").addClass("invalid") : $(this).removeClass("invalid").addClass("valid");
|
|
});
|
|
modal.find(".text-plaque").each(function () {
|
|
$(this).val() == "" ? $(this).removeClass("valid").addClass("invalid") : $(this).removeClass("invalid").addClass("valid");
|
|
});
|
|
if (isEmpty(modal.find(".div-plaque"))) {
|
|
modal.find(".div-plaque").addClass("invalid").removeClass("valid");
|
|
} else {
|
|
modal.find(".div-plaque").addClass("valid").removeClass("invalid");
|
|
}
|
|
if (start_timer.getState().selected.unixDate >= end_timer.getState().selected.unixDate) {
|
|
Swal.fire({
|
|
icon: "warning",
|
|
title: "خطا",
|
|
text: "ساعت پایان نباید از شروع کمتر باشد",
|
|
cancelButtonText: "بستن",
|
|
showConfirmButton: false,
|
|
showCancelButton: true,
|
|
});
|
|
return
|
|
}
|
|
if (parseInt(modal.find("#distance").val()) > 500) {
|
|
Swal.fire({
|
|
icon: "warning",
|
|
title: "خطا",
|
|
text: "مسافت گشت نمیتواند بیشتر از پانصد کیلومتر باشد.",
|
|
cancelButtonText: "بستن",
|
|
showConfirmButton: false,
|
|
showCancelButton: true,
|
|
});
|
|
return
|
|
}
|
|
if (modal.find(".invalid").length != 0 || isEmpty($(".div-plaque"))) { return } else {
|
|
date_ui = moment(patrol_date.getState().selected.unixDate).format("YYYY-MM-DD")
|
|
start_time_ui = moment(start_timer.getState().selected.unixDate).format("HH:mm");
|
|
end_time_ui = moment(end_timer.getState().selected.unixDate).format("HH:mm");
|
|
officer_name_ui = modal.find("#user_full_name").val();
|
|
plaque_number_add1 = modal.find("#plaque_number_add1").val();
|
|
plaque_word_add1 = modal.find("#plaque_word_add1").data("value");
|
|
plaque_number_add2 = modal.find("#plaque_number_add2").val();
|
|
plaque_number_add3 = modal.find("#plaque_number_add3").val();
|
|
officer_plaque_ui = plaque_number_add1 + "-" + plaque_word_add1 + "-" + plaque_number_add2 + "-" + plaque_number_add3;
|
|
officer_phone_number_ui = $("#user_phone").val();
|
|
distance_ui = modal.find("#distance").val();
|
|
modal.modal("hide");
|
|
}
|
|
});
|
|
// end add road patrol cta
|
|
|
|
// build show map
|
|
function buildMapShowAndMarker(position) {
|
|
return new Promise(function (resolve) {
|
|
setTimeout(() => {
|
|
mapShow = L.map("map_show", {
|
|
maxBounds: bounds,
|
|
minZoom: 6,
|
|
zoomControl: false,
|
|
attributionControl: false
|
|
}).setView(position, 15);
|
|
L.tileLayer(`${mapUrl}/{z}/{x}/{y}.png`, {}).addTo(mapShow);
|
|
showMapMarker = L.marker(position, { icon: item_icon }).addTo(mapShow);
|
|
resolve();
|
|
}, 200)
|
|
});
|
|
}
|
|
|
|
$(document).on('input', '.phone-is-correct', function () {
|
|
const modal = $(this).parents(".modal");
|
|
let value = $(this).val()
|
|
|
|
if (value.length > 11) {
|
|
$(this).val(value.slice(0, 11))
|
|
value = value.slice(0, 11)
|
|
}
|
|
if (value.slice(0, 2) != '09') {
|
|
$(this).val('09')
|
|
value = value.slice('09')
|
|
}
|
|
|
|
if (value.length == 11) {
|
|
$(this).removeClass("invalid").addClass("valid");
|
|
modal.find(".attent-num").fadeOut("100");
|
|
} else {
|
|
$(this).addClass("invalid").removeClass("valid");
|
|
modal.find(".attent-num").fadeIn("100");
|
|
}
|
|
})
|
|
|
|
$(document).on('input', '.code-is-correct', function () {
|
|
const value = $(this).val()
|
|
|
|
if (value.length > 6) {
|
|
$(this).val(value.slice(0, 6))
|
|
}
|
|
})
|
|
|
|
// edit profile
|
|
$(document).on("click", "#edit_profile", function () {
|
|
$("#userInfo_modal").modal({ backdrop: 'static', keyboard: false }, "show");
|
|
});
|
|
// end edit profile
|
|
|
|
// send otp
|
|
$(document).on("click", "#send_otp", function () {
|
|
const modal = $(this).parents(".modal");
|
|
if (modal.find("#send_otp").data("count") == 0) {
|
|
modal.find('#accept_number').each(function (index) { if ($(this).val().length != 11) { $(this).removeClass("valid").addClass("invalid") } else $(this).removeClass("invalid").addClass("valid") });
|
|
if (modal.find(".invalid").length != 0) {
|
|
Swal.fire({
|
|
icon: "error",
|
|
title: "خطا",
|
|
text: "شماره تلفن باید 11 رقم باشد.",
|
|
cancelButtonText: "بستن",
|
|
showConfirmButton: false,
|
|
showCancelButton: true,
|
|
});
|
|
} else {
|
|
$.ajax({
|
|
url: `/v2/get_otp_token?phone_number=${modal.find("#accept_number").val()}`,
|
|
type: "GET",
|
|
headers: {
|
|
"X-CSRF-TOKEN": $('meta[name="csrf-token"]').attr("content"),
|
|
},
|
|
cache: false,
|
|
contentType: false,
|
|
processData: false,
|
|
success: function (result) {
|
|
hideLoaderScreen();
|
|
modal.find(".otp-code-box").slideDown("300");
|
|
modal.find("#send_otp").prop("disabled", true);
|
|
modal.find("#send_otp").text("");
|
|
modal.find("#send_otp").data("count", 1);
|
|
modal.find("#check_otp_cta").removeClass("d-none");
|
|
modal.find("#check_otp_cta").prop("disabled", false);
|
|
startTimer(60 * 2, modal.find("#send_otp"));
|
|
},
|
|
error: function (request) {
|
|
hideLoaderScreen();
|
|
ajax_error(request.responseJSON, request.status);
|
|
},
|
|
});
|
|
}
|
|
} else {
|
|
Swal.fire({
|
|
icon: "error",
|
|
title: "خطا",
|
|
text: "منتظر اتمام تایمر باشید",
|
|
cancelButtonText: "بستن",
|
|
showConfirmButton: false,
|
|
showCancelButton: true,
|
|
});
|
|
}
|
|
});
|
|
// end send otp token
|
|
|
|
// check otp token
|
|
$(document).on("click", "#check_otp_cta", function () {
|
|
const modal = $(this).parents(".modal");
|
|
if (modal.find('#otp_code').val().length != 6) { modal.find('#otp_code').removeClass("valid").addClass("invalid") } else modal.find('#otp_code').removeClass("invalid").addClass("valid")
|
|
if (modal.find(".invalid").length != 0) { return } else {
|
|
const phone_number = modal.find("#accept_number").val();
|
|
const verification_code = modal.find("#otp_code").val();
|
|
let formData = new FormData();
|
|
formData.append(`phone_number`, phone_number);
|
|
formData.append(`verification_code`, verification_code);
|
|
$.ajax({
|
|
url: `/v2/verify_otp`,
|
|
type: "POST",
|
|
headers: {
|
|
"X-CSRF-TOKEN": $('meta[name="csrf-token"]').attr("content"),
|
|
},
|
|
data: formData,
|
|
cache: false,
|
|
contentType: false,
|
|
processData: false,
|
|
success: function (result) {
|
|
hideLoaderScreen();
|
|
modal.modal("hide");
|
|
$("#plaque_text_modal").find(".select-text").removeClass("last-time-select");
|
|
$("#userInfo_modal").find(".clean-input").val("");
|
|
$("#userInfo_modal").find(".div-plaque").text("");
|
|
$("#userInfo_modal").find(".value-important").removeClass("invalid").removeClass("valid");
|
|
$("#userInfo_modal").find(".div-plaque").removeClass("invalid").removeClass("valid");
|
|
$("#userInfo_modal").find(".text-plaque").removeClass("invalid").removeClass("valid");
|
|
$("#userInfo_modal").find(".phone-is-correct").removeClass("invalid").removeClass("valid");
|
|
$("#userInfo_modal").find("#user_phone").val(phone_number);
|
|
},
|
|
error: function (request) {
|
|
hideLoaderScreen();
|
|
ajax_error(request.responseJSON, request.status);
|
|
},
|
|
});
|
|
}
|
|
});
|
|
// end check otp token
|
|
|
|
$('#otpToken_modal').on('hidden.bs.modal', function (e) {
|
|
$("#userInfo_modal").modal({ backdrop: 'static', keyboard: false }, "show");
|
|
})
|
|
|
|
// add patrol func
|
|
function addPatrol(checkItem, description) {
|
|
Swal.fire({
|
|
icon: "warning",
|
|
title: "آیا از ثبت اطلاعات وارده اطمینان دارید؟",
|
|
showCancelButton: false,
|
|
confirmButtonColor: "#2d7c23",
|
|
confirmButtonText: "ثبت گشت",
|
|
showLoaderOnConfirm: true,
|
|
preConfirm: () => {
|
|
const start_point_patrol = `${mapStartMarker.getLatLng().lat.toFixed(6)},${mapStartMarker.getLatLng().lng.toFixed(6)}`;
|
|
const end_point_patrol = `${mapEndMarker.getLatLng().lat.toFixed(6)},${mapEndMarker.getLatLng().lng.toFixed(6)}`;
|
|
let formData = new FormData();
|
|
formData.append("start_point", start_point_patrol);
|
|
formData.append("end_point", end_point_patrol);
|
|
formData.append("start_time", date_ui + " " + start_time_ui);
|
|
formData.append("end_time", date_ui + " " + end_time_ui);
|
|
formData.append("officer_plaque", officer_plaque_ui);
|
|
formData.append("officer_phone_number", officer_phone_number_ui);
|
|
formData.append("officer_name", officer_name_ui);
|
|
formData.append("distance", distance_ui);
|
|
if (checkItem == 0)
|
|
formData.append("description", description);
|
|
else if (checkItem == 1) {
|
|
for (let i = 0; i < observed_items.length; i++) {
|
|
formData.append(`observed_items[${i}][item_id]`, observed_items[i].item_id);
|
|
formData.append(`observed_items[${i}][sub_item_id]`, observed_items[i].sub_item_id);
|
|
formData.append(`observed_items[${i}][local_name]`, observed_items[i].local_name);
|
|
formData.append(`observed_items[${i}][instant_action]`, observed_items[i].instant_action);
|
|
formData.append(`observed_items[${i}][start_point]`, observed_items[i].start_point);
|
|
if (observed_items[i].instant_action == 0) {
|
|
formData.append(`observed_items[${i}][priority]`, observed_items[i].priority);
|
|
formData.append(`observed_items[${i}][priority_fa]`, observed_items[i].priority_text);
|
|
} else {
|
|
formData.append(`observed_items[${i}][amount]`, observed_items[i].amount);
|
|
console.log(observed_items[i].image_before);
|
|
if (observed_items[i].image_before != undefined) {
|
|
formData.append(`observed_items[${i}][before_image]`, observed_items[i].image_before);
|
|
formData.append(`observed_items[${i}][after_image]`, observed_items[i].image_after);
|
|
}
|
|
if (observed_items[i].end_point != undefined) {
|
|
formData.append(`observed_items[${i}][end_point]`, observed_items[i].end_point);
|
|
}
|
|
formData.append(`observed_items[${i}][description]`, observed_items[i].description);
|
|
}
|
|
}
|
|
}
|
|
showLoaderScreen();
|
|
$.ajax({
|
|
url: add_road_patrol_api,
|
|
type: "POST",
|
|
headers: {
|
|
"X-CSRF-TOKEN": $('meta[name="csrf-token"]').attr("content"),
|
|
},
|
|
data: formData,
|
|
cache: false,
|
|
contentType: false,
|
|
processData: false,
|
|
success: function (result) {
|
|
hideLoaderScreen();
|
|
Swal.fire({
|
|
icon: "success",
|
|
title: "گشت با موفقیت ثبت شد",
|
|
showCancelButton: false,
|
|
confirmButtonColor: "#2d7c23",
|
|
confirmButtonText: "اتمام عملیات",
|
|
showDenyButton: true,
|
|
denyButtonColor: '#20aaad',
|
|
denyButtonText: 'چاپ گزارش',
|
|
preConfirm: () => {
|
|
location.reload(true);
|
|
},
|
|
preDeny: () => {
|
|
window.open(report_api + result.road_patrol_id, '_blank')
|
|
setTimeout(() => {
|
|
location.reload(true);
|
|
}, 500)
|
|
}
|
|
});
|
|
},
|
|
error: function (request) {
|
|
hideLoaderScreen();
|
|
ajax_error(request.responseJSON, request.status);
|
|
},
|
|
});
|
|
},
|
|
});
|
|
}
|
|
// end add patrol func
|
|
|
|
// add patrol without item
|
|
$(document).on("click", "#add_patrol_noItem", function () {
|
|
const modal = $(this).parents(".modal");
|
|
const description = modal.find("#description").val();
|
|
modal.find("textarea.value-important").each(function () {
|
|
$(this).val() == "" ? $(this).removeClass("valid").addClass("invalid") : $(this).removeClass("invalid").addClass("valid");
|
|
});
|
|
if (modal.find(".invalid").length != 0) { return } else {
|
|
addPatrol(0, description)
|
|
modal.modal("hide")
|
|
}
|
|
});
|
|
// end add patrol without item
|