Files
backend/public/version2/js/dashboard_pages/fast_react/supervise_cartable.js

885 lines
32 KiB
JavaScript
Raw Permalink Blame History

This file contains ambiguous Unicode characters
This file contains Unicode characters that might be confused with other characters. If you think that this is intentional, you can safely ignore this warning. Use the Escape button to reveal them.
// variables part
var supervisorCartable;
var supervisorCartable_url = "/v2/road_observations/supervisor/cartable/show";
var verify_api = "/v2/road_observations/supervisor/cartable/verify/";
var items_api = "/v2/items";
var provinces_api = "/webapi/getuser/province-perm";
var edarat_api = "/public/contents/edarate_shahri_by_province/";
var permission_api = "/webapi/user/get-permission";
const MAP_ENDPOINT = "https://rmsmap.rmto.ir";
var excel_api = "/v2/road_observations/supervisor/cartable/report";
var markers = [];
var markersLayer;
var mapZoom = getWidth() < 508 ? 5 : 6;
var filterDatepicker = {};
var PERMISSIONS = [];
// end variables part
// 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
// map
// icon
var mapIcon = L.icon({
iconUrl: '/dist/images/dashboard/pinmarker_dashboard.png',
iconSize: [32, 32],
});
var activeMapIcon = L.icon({
iconUrl: '/dist/images/dashboard/pinmarker_dashboard_active.png',
iconSize: [32, 32],
});
// icon
var bounds = [
[42.9130026312, 75.6166317076],
[20.5782370061, 30.5092252948],
];
var map = L.map("map", {
maxBounds: bounds,
minZoom: mapZoom,
zoomControl: false,
attributionControl: false
}).setView([35.5468992, 51.7300532], mapZoom);
L.tileLayer(MAP_ENDPOINT + "/141map/{z}/{x}/{y}.png", {
attributionControl: false,
}).addTo(map);
// end map
(() => {
//get permission
showLoaderScreen()
$.ajax({
url: permission_api,
type: "GET",
cache: false,
async: false,
contentType: false,
processData: false,
success: function (result) {
PERMISSIONS = result.data;
},
error: function () {
Swal.fire({
icon: "error",
title: "خطا",
text: "مشکل در دریافت سطح دسترسی",
confirmButtonText: "بروزرسانی صفحه",
showLoaderOnConfirm: true,
preConfirm: () => {
location.reload(true);
},
});
},
});
//end get permission
})()
$(document).bind("click", function (e) {
const clicked = $(e.target);
if (clicked.parents(".toolbox").length != 0) return false;
if (clicked.parents(".datepicker-grid-view").length != 0) return false;
if (clicked.parents(".datepicker-navigator").length != 0) return false;
if (clicked.parents(".datepicker-container").length != 0) return false;
if (clicked.parents(".select2-selection__choice").length != 0) return false;
if (
clicked.closest(".filtering-btn").length == 0 &&
clicked.closest("#filter_box").length == 0 &&
$("filter_box").css("display") != "none"
) {
$("#filter_box").css("display", "none");
}
});
const FilterBoxInit = () => {
const top = $('.dt-button')[0].offsetHeight + 5
return `<div id="filter_box" style="top:${top}px">
<div class="d-flex">
<div class="form-group" style="flex: 1">
<label for="filter_id">کد یکتا</label>
<input id="filter_id" type="search" class="form-control form-control-sm" autocomplete="off" />
</div>
</div>
<div class="d-flex">
<div class="form-group" style="flex: 1">
<label for="filter_province">استان</label>
<select class="form-control form-control-sm fill-provinces" id="filter_province">
<option value="-1" selected>انتخاب استان</option>
</select>
</div>
</div>
<div class="d-flex">
<div class="form-group" style="flex: 1">
<label for="filter_status">وضعیت</label>
<select class="form-control form-control-sm fill-status" id="filter_status">
<option value="-1" selected>انتخاب وضعیت</option>
</select>
</div>
</div>
<div class="d-flex">
<div class="form-group ml-2" style="flex: 1">
<label for="filter_from_activity_date_time">از تاریخ فعالیت</label>
<input class="form-control form-control-sm" type="search" id="filter_from_activity_date_time">
</div>
<div class="form-group mr-2" style="flex: 1">
<label for="filter_to_activity_date_time">تا تاریخ فعالیت</label>
<input class="form-control form-control-sm" type="search" id="filter_to_activity_date_time">
</div>
</div>
<hr />
<button class="btn btn-info btn-sm" id="btn_filter">فیلتر</button>
</div>`
}
const fillFilterBox = () => {
//fill provinces
$.ajax({
url: `${provinces_api}${$.inArray("show-road-item-supervise-cartable", PERMISSIONS) != -1 ? "?type=all" : ""}`,
type: "get",
headers: {
"X-CSRF-TOKEN": $('meta[name="csrf-token"]').attr("content"),
},
cache: false,
contentType: false,
processData: false,
beforeSend: function () {
$('.fill-provinces').empty()
$('.fill-provinces').append(`
<option value="-1">در حال دریافت استان ها...</option>
`)
},
success: function (result) {
$('.fill-provinces').empty()
$('.fill-provinces').append(`
<option value="-1">انتخاب استان</option>
`)
result.data.map(item => {
$('.fill-provinces').append(`
<option value="${item.id}">${item.name_fa}</option>
`)
})
},
error: function (request) {
},
complete: function () {
}
});
//fill datepicker
filterDatepicker.from = $(
"#filter_from_activity_date_time"
).persianDatepicker({
format: "YYYY/MM/DD",
autoClose: true,
initialValue: false,
onSelect: function (unix) {
filterDatepicker.from.touched = true;
if (
filterDatepicker.from.getState().selected.unixDate >=
filterDatepicker.to.getState().selected.unixDate
) {
filterDatepicker.to.setDate(
filterDatepicker.from.getState().selected.unixDate
);
}
if (
filterDatepicker.to &&
filterDatepicker.to.options &&
filterDatepicker.to.options.minDate != unix
) {
let cachedValue =
filterDatepicker.to.getState().selected.unixDate;
filterDatepicker.to.options = { minDate: unix };
if (filterDatepicker.from.touched) {
filterDatepicker.to.setDate(cachedValue);
}
}
},
});
filterDatepicker.to = $(
"#filter_to_activity_date_time"
).persianDatepicker({
format: "YYYY/MM/DD",
autoClose: true,
initialValue: false,
onSelect: function (unix) {
filterDatepicker.to.touched = true;
},
});
$(document).on('input', '#filter_from_activity_date_time', function (e) {
if (e.target.value == '') {
filterDatepicker.from.setDate(moment().valueOf())
filterDatepicker.to.setDate(moment().valueOf())
$("#filter_to_activity_date_time").val('')
$("#filter_from_activity_date_time").val('')
}
})
$(document).on('input', '#filter_to_activity_date_time', function (e) {
if (e.target.value == '') {
filterDatepicker.from.setDate(moment().valueOf())
filterDatepicker.to.setDate(moment().valueOf())
$("#filter_from_activity_date_time").val('')
$("#filter_to_activity_date_time").val('')
}
})
//fill status
$('.fill-status').empty()
$('.fill-status').append(`
<option value="-1">انتخاب وضعیت</option>
<option value="0">در حال بررسی</option>
<option value="1">تایید شده</option>
<option value="2">عدم تایید</option>
`)
}
const filterBox = (show) => {
$('#filter_box').css('display', show ? 'flex' : 'none')
}
$(function () {
// supervisor cartable table
showLoaderScreen();
supervisorCartable = $("#supervisor_cartable").DataTable({
serverSide: true,
dom: "<<'d-flex justify-content-between align-items-center'lB><t>p>",
pagingType: "simple_numbers",
scrollX: true,
filter: true,
language: {
sEmptyTable: "هیچ داده‌ای در جدول وجود ندارد",
sInfo: "نمایش _START_ تا _END_ از _TOTAL_ ردیف",
sInfoEmpty: "نمایش 0 تا 0 از 0 ردیف",
sInfoFiltered: "(فیلتر شده از _MAX_ ردیف)",
sInfoPostFix: "",
sInfoThousands: ",",
sLengthMenu: "نمایش _MENU_ ردیف",
sLoadingRecords: "در حال بارگزاری...",
sProcessing: "در حال پردازش...",
sSearch: "جستجو: ",
sZeroRecords: "رکوردی با این مشخصات پیدا نشد",
oPaginate: {
sFirst: "برگه‌ی نخست",
sLast: "برگه‌ی آخر",
sNext: "بعدی",
sPrevious: "قبلی",
},
oAria: {
sSortAscending: ": فعال سازی نمایش به صورت صعودی",
sSortDescending: ": فعال سازی نمایش به صورت نزولی",
},
},
order: [
[10, "asc"],
[0, "desc"]
],
processing: true,
select: true,
ajax: {
url: supervisorCartable_url,
type: "GET",
beforeSend: function () {
showLoaderScreen();
if (markers.length != 0) {
map.removeLayer(markersLayer);
markers = [];
markersLayer.clearLayers();
}
$("#supervisor_cartable").find("tbody tr").removeClass("activate-row");
},
dataSrc: function (json) {
let data = json.data;
hideLoaderScreen();
if (data.length == 0) {
return data
}
const latlonArr = []
for (let i = 0; i < data.length; i++) {
let marker = new L.Marker([data[i].lat, data[i].lng], { icon: mapIcon, id: data[i].AutoID }).on('click', function (e) {
const id = e.target.options.id
supervisorCartable.rows().eq(0).map(index => {
if (supervisorCartable.row(index).data().AutoID == id) {
const node = supervisorCartable.row(index).node()
$("html, body").animate({
scrollTop: $(node).offset().top,
},
100
);
$("#supervisor_cartable").find("tbody tr").removeClass("activate-row");
$(node).addClass("activate-row");
setTimeout(() => {
markersLayer.eachLayer(layer => {
if (layer.options.id == id) {
layer.setIcon(activeMapIcon)
layer.setZIndexOffset(100)
return
}
layer.setZIndexOffset(0)
layer.setIcon(mapIcon)
})
map.flyTo([supervisorCartable.row(index).data().lat, supervisorCartable.row(index).data().lng], 16, { duration: .5 });
}, 500)
}
})
})
markers.push(marker);
latlonArr.push([data[i].lat, data[i].lng])
}
markersLayer = new L.LayerGroup(markers);
map.addLayer(markersLayer);
$("html, body").animate({
scrollTop: $('#map').offset().top - 50,
},
100
);
setTimeout(() => {
map.flyToBounds(latlonArr, { padding: [60, 60], duration: .5 })
}, 250);
hideLoaderScreen();
return json.data;
},
error: function (request) {
ajax_error(request.responseJSON, request.status);
hideLoaderScreen();
},
},
columns: [
// 1
{
className: "text-center align-middle",
data: null,
name: {
name: 'road_observeds.id',
type: 'text'
},
render: function (data, type, row) {
return `<div class="d-flex justify-content-center align-items-center">${data.status == 0 ? '<span class="blink_me blink_dot ml-2"></span>' : ''}<span>${data.road_observeds_id}</span></div>`
},
searchable: true,
orderable: true,
},
// 2
{
className: "text-center align-middle",
data: "fk_RegisteredEventMessage",
name: {
name: 'fk_RegisteredEventMessage',
type: 'text'
},
searchable: true,
orderable: true,
},
// 3
{
className: "text-center align-middle",
data: "province_fa",
name: {
name: 'road_observeds.province_id',
type: 'select'
},
searchable: true,
orderable: true,
},
// 5
{
className: "text-center align-middle",
data: "edarate_shahri_name_fa",
name: {
name: 'edarate_shahri.name_fa',
type: 'text'
},
searchable: true,
orderable: true,
},
// 6
{
className: "text-center align-middle",
data: "Title",
name: {
name: 'Title',
type: 'text'
},
searchable: true,
orderable: true,
},
// 7
{
className: "text-center align-middle",
data: "FeatureTypeTitle",
name: {
name: 'FeatureTypeTitle',
type: 'text'
},
searchable: true,
orderable: true,
},
// 8
{
className: "text-center align-middle",
data: null,
name: {
name: 'option',
type: 'option'
},
render: function (data, type, row) {
if (data.Description == null) {
return `اطلاعاتی موجود نیست!!!`
} else {
return `<button type="button" class="btn-dataTable show-description-btn" data-toggle="tooltip" data-placement="top" title="نمایش"><i class="fa fa-eye icon-btnTable"></i></button>`
}
},
searchable: false,
orderable: false,
},
// 9
{
className: "text-center align-middle",
data: "MobileForSendEventSms",
name: {
name: 'MobileForSendEventSms',
type: 'text'
},
searchable: true,
orderable: true,
},
// 10
{
className: "text-center text-nowrap align-middle",
data: null,
name: {
name: 'rms_last_activity',
type: 'between'
},
render: function (data, type, row) {
if (data.rms_last_activity_fa == null) return '-'
return data.rms_last_activity_fa
},
searchable: true,
orderable: true,
},
// 11
{
className: "text-center align-middle",
data: null,
name: {
name: 'option',
type: 'option'
},
render: function (data, type, row) {
if (data.image_after || data.image_before)
return `<button type="button" class="btn-dataTable show-images-btn" data-toggle="tooltip" data-placement="top" title="نمایش"><i class="fa fa-image icon-btnTable"></i></button>`
return '-'
},
searchable: true,
orderable: false,
},
// 12
{
className: "text-center align-middle",
data: "status_fa",
name: {
name: 'status',
type: 'select'
},
searchable: true,
orderable: true,
},
// 13
{
className: "text-center align-middle",
data: null,
name: {
name: 'rms_description',
type: 'text'
},
render: function (data, type, row) {
if (data.rms_description == null) {
return `اطلاعاتی موجود نیست!!!`
} else {
return `<button type="button" class="btn-dataTable show-rms-description-btn" data-toggle="tooltip" data-placement="top" title="نمایش"><i class="fa fa-eye icon-btnTable"></i></button>`
}
},
searchable: true,
orderable: false,
},
// 14
{
className: "text-center align-middle",
data: null,
name: {
name: 'supervisor_description',
type: 'text'
},
render: function (data, type, row) {
if (data.supervisor_description == null) {
return `اطلاعاتی موجود نیست!!!`
} else {
return `<button type="button" class="btn-dataTable show-supervisor-description-btn" data-toggle="tooltip" data-placement="top" title="نمایش"><i class="fa fa-eye icon-btnTable"></i></button>`
}
},
searchable: true,
orderable: false,
},
// 15
{
className: "text-center sorting align-middle",
data: null,
name: {
name: 'option',
type: 'option'
},
render: function (data, type, row) {
if (data.status == 0) {
return `<div class="d-inline-flex"><button type="button" class="btn-dataTable confirm" data-toggle="tooltip" data-placement="top" title="تایید"><i class="fa fa-check icon-btnTable"></i></button><div class="pipeline mx-2"></div><button type="button" class="btn-dataTable disapproval" data-toggle="tooltip" data-placement="top" title="عدم تایید"><i class="fa fa-times icon-btnTable"></i></button></div>`;
} else if (data.status == 1 || data.status == 2) {
return `<div class="text-nowrap">${moment(data.supervising_time).format("HH:mm:ss | jYYYY/jMM/jDD")}</div>`;
}
},
searchable: false,
orderable: false,
},
],
buttons: [
{
text: '<i class="fa fa-filter" aria-hidden="true"></i><span class="pr-1">فیلتر پیشرفته<span>',
className: 'filtering-btn',
action: function (e, dt, node, config) {
filterBox(true)
}
},
{
text: '<i class="fa fa-file" aria-hidden="true"></i><span class="pr-1">گزارش اکسل<span>',
className: 'table-btns',
action: function (e, dt, node, config) {
let queryParems = [];
const id = $("#filter_id").val();
const province = $("#filter_province").val();
const status = $("#filter_status").val();
let activityDate = {}
if ($("#filter_from_activity_date_time").val() != "" && $("#filter_to_activity_date_time").val() != "") {
activityDate.from = moment(
filterDatepicker.from.getState().selected.year +
"/" +
filterDatepicker.from.getState().selected.month +
"/" +
filterDatepicker.from.getState().selected.date,
"jYYYY/jM/jD"
).format("YYYY-MM-DD");
activityDate.to = moment(
filterDatepicker.to.getState().selected.year +
"/" +
filterDatepicker.to.getState().selected.month +
"/" +
filterDatepicker.to.getState().selected.date,
"jYYYY/jM/jD"
).format("YYYY-MM-DD");
queryParems.push(`fromDate=${activityDate.from}`);
queryParems.push(`toDate=${activityDate.to}`);
}
if (id != '') queryParems.push(`id=${id}`);
if (province != '-1') queryParems.push(`province_id=${province}`);
if (status != '-1') queryParems.push(`status=${status}`);
const url = `${excel_api}${queryParems.length != 0 ? `?${queryParems.join("&")}` : ""}`;
window.open(url);
}
}
],
initComplete: function () {
$(".dt-buttons").append(FilterBoxInit)
fillFilterBox()
},
});
// end supervisor cartable table
});
// end on load
$("#supervisor_cartable").on("click", "tbody tr", function (e) {
e.preventDefault()
let tr = $(this).closest("tr");
let row = supervisorCartable.row(tr);
let data = row.data();
dataOnMap(data);
$("#supervisor_cartable").find("tbody tr").removeClass("activate-row");
$(this).addClass("activate-row");
});
// show active data on map
function dataOnMap(data) {
$("html, body").animate({
scrollTop: $("#map").offset().top - 50,
},
100
);
setTimeout(() => {
markersLayer.eachLayer(layer => {
if (layer.options.id == data.AutoID) {
layer.setIcon(activeMapIcon)
layer.setZIndexOffset(100)
return
}
layer.setZIndexOffset(0)
layer.setIcon(mapIcon)
})
map.flyTo([data.lat, data.lng], 16, { duration: .5 });
}, 500)
}
// end show active data on map
// filtering
$(document).on('click', '#btn_filter', function () {
filterBox(false)
let _table = supervisorCartable
const id = $("#filter_id").val();
const province = $("#filter_province").val();
const status = $("#filter_status").val();
let activityDate = {}
if (
$("#filter_from_activity_date_time").val() != "" &&
$("#filter_to_activity_date_time").val() != ""
) {
activityDate.from = moment(
filterDatepicker.from.getState().selected.year +
"/" +
filterDatepicker.from.getState().selected.month +
"/" +
filterDatepicker.from.getState().selected.date,
"jYYYY/jM/jD"
).format("YYYY-MM-DD");
activityDate.to = moment(
filterDatepicker.to.getState().selected.year +
"/" +
filterDatepicker.to.getState().selected.month +
"/" +
filterDatepicker.to.getState().selected.date,
"jYYYY/jM/jD"
).format("YYYY-MM-DD");
}
if (id != '') {
_table = _table.column(0).search(id);
} else {
_table = _table.column(0).search('');
}
if (province != '-1') {
_table = _table.column(2).search(province);
} else {
_table = _table.column(2).search('');
}
if (status != '-1') {
_table = _table.column(10).search(status);
} else {
_table = _table.column(10).search('');
}
if (Object.keys(activityDate).length !== 0) {
_table = _table.column(8).search(`${activityDate.from}&${activityDate.to}`);
} else {
_table = _table.column(8).search('');
}
_table.draw();
})
// end filtering
// confirmation action
$("#supervisor_cartable").on("click", ".confirm", function (e) {
e.stopPropagation()
const modal = $("#verifyDescription_modal");
let tr = $(this).closest("tr");
let row = supervisorCartable.row(tr);
let data = row.data();
modal.find(".clean-textarea").val("");
modal.find("#description").removeClass("invalid").removeClass("valid").removeClass('value-important');
modal.find("#description").data("id", data.road_observeds_id);
modal.find("#description").data("acceptDecline", 1);
modal.modal("show");
$("#verify").removeClass("d-none");
$("#supervisor_cartable").find("tbody tr").removeClass("activate-row");
$(tr).addClass("activate-row");
});
// end confirmation action
// show supervisor description
$("#supervisor_cartable").on("click", ".show-supervisor-description-btn", function (e) {
e.stopPropagation()
const modal = $("#verifyDescription_modal");
let tr = $(this).closest("tr");
let row = supervisorCartable.row(tr);
let data = row.data();
modal.find(".clean-textarea").val("");
modal.find(".value-important").removeClass("invalid").removeClass("valid");
$("#verify").addClass("d-none");
modal.find("#description").val(data.supervisor_description);
modal.modal("show");
$("#supervisor_cartable").find("tbody tr").removeClass("activate-row");
$(tr).addClass("activate-row");
});
// end show supervisor description
// show rms description
$("#supervisor_cartable").on("click", ".show-rms-description-btn", function (e) {
e.stopPropagation()
const modal = $("#rmsDescription_modal");
let tr = $(this).closest("tr");
let row = supervisorCartable.row(tr);
let data = row.data();
modal.find(".clean-textarea").val("");
modal.find(".value-important").removeClass("invalid").removeClass("valid");
$("#verify").addClass("d-none");
modal.find("#rms_description").val(data.rms_description);
modal.modal("show");
$("#supervisor_cartable").find("tbody tr").removeClass("activate-row");
$(tr).addClass("activate-row");
});
// end show rms description
// show description
$("#supervisor_cartable").on("click", ".show-description-btn", function (e) {
e.stopPropagation()
const modal = $("#description_modal");
let tr = $(this).closest("tr");
let row = supervisorCartable.row(tr);
let data = row.data();
modal.find(".clean-textarea").val("");
modal.find(".value-important").removeClass("invalid").removeClass("valid");
$("#verify").addClass("d-none");
modal.find("#description").val(data.Description);
modal.modal("show");
$("#supervisor_cartable").find("tbody tr").removeClass("activate-row");
$(tr).addClass("activate-row");
});
// end show description
// disapproval action
$("#supervisor_cartable").on("click", ".disapproval", function (e) {
e.stopPropagation()
const modal = $("#verifyDescription_modal");
let tr = $(this).closest("tr");
let row = supervisorCartable.row(tr);
let data = row.data();
modal.find(".clean-textarea").val("");
modal.find("#description").removeClass("invalid").removeClass("valid").addClass('value-important');
modal.find("#description").data("id", data.road_observeds_id);
modal.find("#description").data("acceptDecline", 2);
modal.modal("show");
$("#verify").removeClass("d-none");
$("#supervisor_cartable").find("tbody tr").removeClass("activate-row");
$(tr).addClass("activate-row");
});
// end disapproval action
// accept/decline
$(document).on("click", "#verify", function (e) {
e.preventDefault()
const modal = $(this).parents(".modal");
const verify = modal.find("#description").data("acceptDecline");
const desc = modal.find("#description").val();
const dataId = modal.find("#description").data("id");
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 {
Swal.fire({
icon: "warning",
title: `${verify == 1 ? "آیا از تایید فعالیت مربوطه اطمینان دارید؟" : "آیا از عدم تایید فعالیت مربوطه اطمینان دارید؟"}`,
showCancelButton: true,
confirmButtonColor: "#2d7c23",
cancelButtonColor: "#971b1b",
confirmButtonText: "بله اطمینان دارم",
cancelButtonText: "خیر!",
showLoaderOnConfirm: true,
preConfirm: () => {
modal.modal("hide");
verifyFunc(verify, dataId, desc);
},
});
}
});
// end accept/decline
// verify
function verifyFunc(verify, dataId, desc) {
let formData = new FormData();
formData.append("verify", verify);
formData.append("description", desc);
$.ajax({
url: verify_api + dataId,
type: "POST",
headers: {
"X-CSRF-TOKEN": $('meta[name="csrf-token"]').attr("content"),
},
data: formData,
cache: false,
contentType: false,
processData: false,
success: function (result) {
hideLoaderScreen();
supervisorCartable.ajax.reload(null, false);
},
error: function (request) {
hideLoaderScreen();
ajax_error(request.responseJSON, request.status);
},
complete: function () {
getSideBarActivity();
}
});
}
// end verify
// show images
$("#supervisor_cartable").on("click", ".show-images-btn", function (e) {
e.stopPropagation()
const modal = $("#show_images_modal");
let tr = $(this).closest("tr");
let row = supervisorCartable.row(tr);
let data = row.data();
modal.find('#image_before a').attr('href', '')
modal.find('#image_before img').attr('src', '')
if (data.image_before) {
modal.find('#image_before a').attr('href', data.image_before)
modal.find('#image_before img').attr('src', data.image_before)
}
modal.find('#image_after a').attr('href', '')
modal.find('#image_after img').attr('src', '')
if (data.image_after) {
modal.find('#image_after a').attr('href', data.image_after)
modal.find('#image_after img').attr('src', data.image_after)
}
modal.modal("show");
$("#supervisor_cartable").find("tbody tr").removeClass("activate-row");
$(tr).addClass("activate-row");
});
// end show images