510 lines
22 KiB
HTML
510 lines
22 KiB
HTML
<!DOCTYPE html>
|
||
<html lang="en">
|
||
<head>
|
||
<meta charset="UTF-8">
|
||
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
||
<link rel="preconnect" href="https://fonts.googleapis.com">
|
||
<link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>
|
||
<link href="https://fonts.googleapis.com/css2?family=Montserrat:ital,wght@0,100..900;1,100..900&display=swap" rel="stylesheet">
|
||
<link rel="stylesheet" href="../styles/main.css">
|
||
<script src="../scripts/jquery.min.js"></script>
|
||
<script src="../scripts/helpPopup.js"></script>
|
||
<title>Управление пользователями</title>
|
||
<script>
|
||
const API_SERVER = "{{API_SERVER}}";
|
||
let applications = [
|
||
{{#each Applications}}
|
||
{
|
||
id: {{this.id}},
|
||
status: "{{this.Статус}}",
|
||
type: "{{this.Вид_заявки}}",
|
||
worker: "{{this.Работник}}",
|
||
date: "{{this.Дата_заявки}}",
|
||
finaldate: "{{this.Дата_решения}}",
|
||
legal: "{{this.Организация}}",
|
||
car: "{{this.Авто_гос_номер}}",
|
||
},
|
||
{{/each}}
|
||
];
|
||
</script>
|
||
<script src="../scripts/applications-table.js"></script>
|
||
</head>
|
||
<body>
|
||
<header>
|
||
<a href="/account"><h1>Система управления заявками на пропуска</h1></a>
|
||
<nav>
|
||
<div class="dropdown">
|
||
<a class="help-button" onclick="toggleDropdown('dropdownHelp-1')">Техническая поддержка</a>
|
||
<div id="dropdownHelp-1" class="dropdown-help">
|
||
<a href="tel:83477527706">8 (34775) 2-77-06</a>
|
||
<a href="tel:89174023516">8 (917) 402-35-16</a>
|
||
</div>
|
||
</div>
|
||
<div class="dropdown">
|
||
<a class="help-button" onclick="toggleDropdown('dropdownHelp-2')">Инструкции</a>
|
||
<div id="dropdownHelp-2" class="dropdown-help dropdown-manual">
|
||
<a href="/docs/manual.pdf" target="_blank">Текст</a>
|
||
<a href="https://drive.google.com/file/d/1CxrAgr2brQclZqtbbreSUU9tN-jsNTwf/view?usp=sharing" target="_blank">Видео</a>
|
||
</div>
|
||
</div>
|
||
<a href="/account">Профиль</a>
|
||
{{#if (eq Role 'legal')}}
|
||
<span>{{User.Наименование}}</span>
|
||
{{else}}
|
||
<span>{{User.Фамилия}} {{User.Имя}} {{User.Отчество}}</span>
|
||
{{/if}}
|
||
<a class="exit-button" href="/logout"><svg xmlns="http://www.w3.org/2000/svg" width="20" height="16" fill="none" viewBox="0 0 20 16">
|
||
<path fill="#6B7A99" d="m4.016 7.13 2.608-2.606-1.226-1.226L.696 8l4.702 4.702 1.226-1.226L4.016 8.87h4.858V7.131H4.016ZM8.874.179v6.953h5.215V8.87H8.874v6.953h10.43V.178H8.873Z"/>
|
||
</svg>
|
||
</a>
|
||
</nav>
|
||
</header>
|
||
|
||
<nav class="underheader-buttons">
|
||
<button onclick="location.href='/account/newform'" class="blue">Создать заявку</button>
|
||
<input id="table-search" type="text" placeholder="Поиск...">
|
||
<button onclick="requestUpdate();">Найти</button>
|
||
<button onclick="requestUpdate();"><svg xmlns="http://www.w3.org/2000/svg" width="16" height="20" fill="none" viewBox="0 0 16 20">
|
||
<path fill="#6B7A99" d="M8 4V0L3 5l5 5V6c3.31 0 6 2.69 6 6s-2.69 6-6 6-6-2.69-6-6H0c0 4.42 3.58 8 8 8s8-3.58 8-8-3.58-8-8-8Z"/>
|
||
</svg>
|
||
</button>
|
||
</nav>
|
||
|
||
<div id="applicationsWrapper" class="table-wrapper">
|
||
<table id="applicationsTable">
|
||
<thead>
|
||
<tr>
|
||
<th>ID</th>
|
||
<th>Статус</th>
|
||
<th>Вид</th>
|
||
<th>ФИО</th>
|
||
<th>Организация</th>
|
||
<th>Дата пропуска</th>
|
||
<th>Дата решения</th>
|
||
<th>Автомобиль</th>
|
||
</tr>
|
||
</thead>
|
||
<tbody>
|
||
<!-- Сюда будут добавляться строки таблицы -->
|
||
</tbody>
|
||
</table>
|
||
</div>
|
||
|
||
<div id="pagination">
|
||
<div id="left-slider" onclick="decrementPage()">
|
||
<svg xmlns="http://www.w3.org/2000/svg" width="11" height="19" fill="none" viewBox="0 0 11 19">
|
||
<path fill="#000" fill-opacity=".75" d="M0 9.495c0 .273.101.514.315.722l8.92 8.477a.981.981 0 0 0 .73.295c.585 0 1.035-.427 1.035-.995 0-.285-.124-.525-.304-.711L2.508 9.495l8.188-7.789c.18-.186.304-.437.304-.71C11 .425 10.55 0 9.965 0c-.292 0-.54.098-.73.284L.314 8.773A.955.955 0 0 0 0 9.495Z"/>
|
||
</svg>
|
||
</div>
|
||
<div id="page-number">1</div>
|
||
<div id="right-slider" onclick="incrementPage()">
|
||
<svg xmlns="http://www.w3.org/2000/svg" width="11" height="19" fill="none" viewBox="0 0 11 19">
|
||
<path fill="#000" fill-opacity=".75" d="M11 9.495a.967.967 0 0 0-.326-.722L1.766.284A1.062 1.062 0 0 0 1.024 0C.45 0 0 .427 0 .995c0 .274.112.525.292.711l8.189 7.789-8.189 7.788c-.18.186-.292.426-.292.71 0 .57.45.996 1.024.996.292 0 .54-.098.742-.295l8.908-8.477c.213-.208.326-.449.326-.722Z"/>
|
||
</svg>
|
||
</div>
|
||
</div>
|
||
|
||
<form id="editApplicationForm">
|
||
<input type="text" id="editapplicationid-input" hidden>
|
||
<input type="text" id="editapplicationtype-input" hidden>
|
||
<div id="editapplication-form-popup-bg" class="form-popup-bg not-main" >
|
||
<div class="form-container">
|
||
<div id="btnCloseForm" class="close-button"><svg onclick="closeForm();" id="btnCloseFormSvg" xmlns="http://www.w3.org/2000/svg" width="14" height="14" fill="none" viewBox="0 0 14 14">
|
||
<path fill="#0050CF" fill-rule="evenodd" d="M14 1.41 12.59 0 7 5.59 1.41 0 0 1.41 5.59 7 0 12.59 1.41 14 7 8.41 12.59 14 14 12.59 8.41 7 14 1.41Z" clip-rule="evenodd"/>
|
||
</svg>
|
||
</div>
|
||
<h1>Заявка на <span id="editApplication"></span> пропуск</h1>
|
||
<br>
|
||
|
||
<div class="input-area">
|
||
<label for="editauthor-input">Автор</label>
|
||
<input type="text" id="editauthor-input" readonly>
|
||
</div>
|
||
|
||
<div class="input-area">
|
||
<label for="editstatus-input">Статус</label>
|
||
<select id="editstatus-input">
|
||
<option value="Новая">Новая</option>
|
||
<option value="Утверждено">Утверждено</option>
|
||
<option value="Отказ">Отказ</option>
|
||
</select>
|
||
</div>
|
||
|
||
<div class="input-area">
|
||
<label for="editname-input">ФИО*</label>
|
||
<input type="text" id="editname-input" required>
|
||
</div>
|
||
<div class="input-area">
|
||
<label for="editlegal-input">Организация</label>
|
||
<input type="text" id="editlegal-input">
|
||
</div>
|
||
|
||
<div class="input-area">
|
||
<label for="editdate-input">Дата выдачи*</label>
|
||
<input type="date" id="editdate-input" required>
|
||
</div>
|
||
<div class="input-area">
|
||
<label for="editdate-input">Действие до*</label>
|
||
<input type="date" id="edittodate-input" required>
|
||
</div>
|
||
<div class="input-area">
|
||
<label for="editfinaldate-input">Дата решения</label>
|
||
<input type="date" id="editfinaldate-input">
|
||
</div>
|
||
<div class="input-area">
|
||
<label for="editdecision-input">Решение</label>
|
||
<input type="text" id="editdecision-input">
|
||
</div>
|
||
|
||
<div style="display: none;" class="inputs" id="car-inputs">
|
||
<ul id="carlist"></ul>
|
||
<input type="text" id="editcarnumber-input" hidden>
|
||
<input type="text" id="editcarbrand-input" hidden>
|
||
<input type="text" id="editcarmodel-input" hidden>
|
||
<input type="text" id="editcarcolor-input" hidden>
|
||
</div>
|
||
|
||
<div style="display: none;" class="inputs" id="tmc-inputs">
|
||
<ul id="tmclist"></ul>
|
||
<input type="text" id="edittmcname-input" hidden>
|
||
<input type="text" id="edittmcunit-input" hidden>
|
||
<input type="text" id="edittmcquantity-input" hidden>
|
||
</div>
|
||
|
||
|
||
<div class="input-area">
|
||
<label for="editadditional-input">Дополнительно</label>
|
||
<textarea id="editadditional-input"></textarea>
|
||
</div>
|
||
|
||
<button type="button" class="bright" id="makePass-button">Создать пропуск из заявки</button>
|
||
<div class="user-buttons" style="display: flex; justify-content: space-between;">
|
||
<button style="width: 49.5%;" type="submit" id="editApplication-button">Сохранить изменения</button>
|
||
<button style="width: 49.5%;" type="button" id="deleteApplication-button" class="delete">Удалить заявку</button>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</form>
|
||
|
||
|
||
<script>
|
||
|
||
var pageNumberInput = document.getElementById('page-number');
|
||
var totalMax = Math.ceil({{Total}} / 15);
|
||
|
||
function decrementPage() {
|
||
var currentPage = parseInt(pageNumberInput.textContent, 10);
|
||
if (currentPage > 1) {
|
||
pageNumberInput.textContent = currentPage - 1;
|
||
requestUpdate();
|
||
} else {
|
||
requestUpdate();
|
||
}
|
||
}
|
||
|
||
function incrementPage() {
|
||
var currentPage = parseInt(pageNumberInput.textContent, 10);
|
||
|
||
if (currentPage === totalMax || currentPage > totalMax) {
|
||
pageNumberInput.textContent = totalMax;
|
||
requestUpdate();
|
||
}
|
||
if (currentPage < totalMax) {
|
||
pageNumberInput.textContent = currentPage + 1;
|
||
requestUpdate();
|
||
}
|
||
}
|
||
|
||
</script>
|
||
|
||
<script>
|
||
function closeForm() {
|
||
$('.form-popup-bg').removeClass('is-visible');
|
||
}
|
||
|
||
$(document).ready(function($) {
|
||
|
||
$('#addUser').on('click', function(event) {
|
||
event.preventDefault();
|
||
|
||
$('#adduser-form-popup-bg').addClass('is-visible');
|
||
});
|
||
|
||
$('#editapplication-form-popup-bg').on('click', function(event) {
|
||
if ($(event.target).is('#editapplication-form-popup-bg') || $(event.target).is('#btnCloseForm')) {
|
||
event.preventDefault();
|
||
$(this).removeClass('is-visible');
|
||
}
|
||
});
|
||
|
||
});
|
||
|
||
|
||
document.addEventListener("DOMContentLoaded", function() {
|
||
const editApplicationForm = document.getElementById("editApplicationForm");
|
||
|
||
editApplicationForm.addEventListener("submit", async function(event) {
|
||
event.preventDefault();
|
||
$('#editApplication-button').addClass('inactive');
|
||
|
||
const id = $('#editapplicationid-input').val();
|
||
|
||
const status = $('#editstatus-input').val();
|
||
const name = $('#editname-input').val();
|
||
const legal = $('#editlegal-input').val();
|
||
const date = $('#editdate-input').val();
|
||
const finaldate = $('#editfinaldate-input').val();
|
||
const decision = $('#editdecision-input').val();
|
||
const carnumber = $('#editcarnumber-input').val();
|
||
const carbrand = $('#editcarbrand-input').val();
|
||
const carmodel = $('#editcarmodel-input').val();
|
||
const carcolor = $('#editcarcolor-input').val();
|
||
const tmcname = $('#edittmcname-input').val();
|
||
const tmcunit = $('#edittmcunit-input').val();
|
||
const tmcquantity = $('#edittmcquantity-input').val();
|
||
const additional = $('#editadditional-input').val();
|
||
|
||
// Отправляем запрос на сервер для авторизации
|
||
const response = await fetch("{{API_SERVER}}/forms/update", {
|
||
method: "PUT",
|
||
headers: {
|
||
"Content-Type": "application/json",
|
||
Authorization: getCookie("token"),
|
||
},
|
||
body: JSON.stringify({ id, status, name, legal, date, finaldate, decision, carnumber, carbrand, carmodel, carcolor, tmcname, tmcunit, tmcquantity, additional })
|
||
});
|
||
if (response.status === 201) {
|
||
location.reload();
|
||
$('#editApplication-button').removeClass('inactive');
|
||
} else {
|
||
alert("Ошибка авторизации");
|
||
$('#editApplication-button').removeClass('inactive');
|
||
}
|
||
|
||
});
|
||
|
||
});
|
||
|
||
|
||
|
||
function openApplication(id) {
|
||
const requestOptions = {
|
||
method: "GET",
|
||
headers: {
|
||
Authorization: getCookie("token"),
|
||
},
|
||
};
|
||
|
||
fetch(API_SERVER + "/forms/application?id=" + id, requestOptions)
|
||
.then((response) => {
|
||
if (response.ok) {
|
||
$("#editapplication-form-popup-bg").addClass("is-visible");
|
||
return response.json();
|
||
} else {
|
||
console.error("Ошибка при отправке POST запроса.");
|
||
return "Ошибка при отправке запроса.";
|
||
}
|
||
})
|
||
.then((data) => {
|
||
|
||
$("#editapplicationid-input").val(id);
|
||
|
||
$("#editApplication").html(data.data.Вид_заявки);
|
||
|
||
$("#deleteApplication-button").attr("onclick", `deleteApplication(${id})`);
|
||
$("#makePass-button").attr("onclick", `makePass(${id})`);
|
||
|
||
if (data.data.Вид_заявки === "Временный") {
|
||
$("#car-inputs").css("display", "none");
|
||
$("#tmc-inputs").css("display", "none");
|
||
} else if (data.data.Вид_заявки === "Автомобильный") {
|
||
$("#car-inputs").css("display", "flex");
|
||
$("#tmc-inputs").css("display", "none");
|
||
} else if (data.data.Вид_заявки === "ТМЦ") {
|
||
$("#car-inputs").css("display", "none");
|
||
$("#tmc-inputs").css("display", "flex");
|
||
}
|
||
|
||
$("#editauthor-input").val(data.data.Автор);
|
||
|
||
$("#editname-input").val(data.data.Работник);
|
||
$("#editlegal-input").val(data.data.Организация);
|
||
$("#editstatus-input").val(data.data.Статус);
|
||
$("#editdecision-input").val(data.data.Решение);
|
||
|
||
$("#editcarnumber-input").val(data.data.Авто_гос_номер);
|
||
$("#editcarbrand-input").val(data.data.Авто_марка);
|
||
$("#editcarmodel-input").val(data.data.Авто_модель);
|
||
$("#editcarcolor-input").val(data.data.Авто_цвет);
|
||
|
||
$("#edittmcname-input").val(data.data.Наименование);
|
||
$("#edittmcunit-input").val(data.data.Единица_измерения);
|
||
$("#edittmcquantity-input").val(data.data.Количество);
|
||
|
||
if (data.data.Вид_заявки === "ТМЦ") {
|
||
var tmcnames = JSON.parse(data.data.Наименование);
|
||
var tmcunits = JSON.parse(data.data.Единица_измерения);
|
||
var tmcquantitys = JSON.parse(data.data.Количество);
|
||
|
||
var tmclist = "";
|
||
|
||
for (var i = 0; i < tmcnames.length; i++) {
|
||
tmclist += "<li><span style='font-weight: 600;'>Позиция " + (i + 1) + ":</span> <br>" +
|
||
"Наименование ТМЦ - " + tmcnames[i] + "<br>" +
|
||
"Единица измерения - " + tmcunits[i] + "<br>" +
|
||
"Количество - " + tmcquantitys[i] +
|
||
"</li>";
|
||
}
|
||
|
||
$("#tmclist").html(tmclist);
|
||
}
|
||
|
||
|
||
if (data.data.Вид_заявки === "Автомобильный") {
|
||
var carnumbers = JSON.parse(data.data.Авто_гос_номер);
|
||
var carbrands = JSON.parse(data.data.Авто_марка);
|
||
var carmodels = JSON.parse(data.data.Авто_модель);
|
||
var carcolors = JSON.parse(data.data.Авто_цвет);
|
||
|
||
var carlist = "";
|
||
|
||
for (var i = 0; i < carnumbers.length; i++) {
|
||
carlist += "<li><span style='font-weight: 600;'>Авто " + (i + 1) + ":</span> <br>" +
|
||
"Номер - " + carnumbers[i] + "<br>" +
|
||
"Марка - " + carbrands[i] + "<br>" +
|
||
"Модель - " + carmodels[i] + "<br>" +
|
||
"Цвет - " + carcolors[i] +
|
||
"</li>";
|
||
}
|
||
|
||
$("#carlist").html(carlist);
|
||
}
|
||
|
||
|
||
|
||
$("#editadditional-input").val(data.data.Дополнение);
|
||
$("#editapplicationtype-input").val(data.data.Вид_заявки);
|
||
|
||
|
||
function formatDateForDateInput(dateString, inputId) {
|
||
const date = new Date(dateString);
|
||
const year = date.getFullYear();
|
||
const month = (date.getMonth() + 1).toString().padStart(2, '0');
|
||
const day = date.getDate().toString().padStart(2, '0');
|
||
const formattedDate = `${year}-${month}-${day}`;
|
||
|
||
document.getElementById(inputId).value = formattedDate;
|
||
}
|
||
|
||
formatDateForDateInput(data.data.Дата_заявки, "editdate-input");
|
||
if (data.data.Дата_решения) {
|
||
formatDateForDateInput(data.data.Дата_решения, "editfinaldate-input");
|
||
} else {
|
||
$("#editfinaldate-input").val("");
|
||
}
|
||
$("#edittodate-input").val("");
|
||
|
||
|
||
|
||
})
|
||
.catch((error) => {
|
||
console.error("Ошибка при отправке запроса:", error);
|
||
});
|
||
}
|
||
|
||
|
||
async function makePass(id) {
|
||
const requestOptions = {
|
||
method: "POST",
|
||
headers: {
|
||
Authorization: getCookie("token"),
|
||
},
|
||
};
|
||
|
||
$('#makePass-button').addClass('inactive');
|
||
|
||
|
||
const status = $('#editstatus-input').val();
|
||
const name = $('#editname-input').val();
|
||
const legal = $('#editlegal-input').val();
|
||
const date = $('#editdate-input').val();
|
||
const todate = $('#edittodate-input').val();
|
||
const finaldate = $('#editfinaldate-input').val();
|
||
const decision = $('#editdecision-input').val();
|
||
const carnumber = $('#editcarnumber-input').val();
|
||
const carbrand = $('#editcarbrand-input').val();
|
||
const carmodel = $('#editcarmodel-input').val();
|
||
const carcolor = $('#editcarcolor-input').val();
|
||
const tmcname = $('#edittmcname-input').val();
|
||
const tmcunit = $('#edittmcunit-input').val();
|
||
const tmcquantity = $('#edittmcquantity-input').val();
|
||
const additional = $('#editadditional-input').val();
|
||
const type = $('#editapplicationtype-input').val();
|
||
|
||
|
||
if (!todate || !date || !name ) {
|
||
alert("Пожалуйста, заполните все поля со звездочками.")
|
||
$('#makePass-button').removeClass('inactive');
|
||
return;
|
||
}
|
||
|
||
// Отправляем запрос на сервер для авторизации
|
||
const response = await fetch("{{API_SERVER}}/forms/makepass", {
|
||
method: "POST",
|
||
headers: {
|
||
"Content-Type": "application/json",
|
||
Authorization: getCookie("token"),
|
||
},
|
||
body: JSON.stringify({ id, status, name, legal, date, todate, finaldate, decision, carnumber, carbrand, carmodel, carcolor, tmcname, tmcunit, tmcquantity, additional, type })
|
||
});
|
||
if (response.status === 201) {
|
||
alert("Заявка успешно преобразована в пропуск!")
|
||
location.reload();
|
||
$('#makePass-button').removeClass('inactive');
|
||
} else {
|
||
alert("Ошибка авторизации");
|
||
$('#makePass-button').removeClass('inactive');
|
||
}
|
||
}
|
||
|
||
function deleteApplication(id) {
|
||
const requestOptions = {
|
||
method: "DELETE",
|
||
headers: {
|
||
Authorization: getCookie("token"),
|
||
},
|
||
};
|
||
|
||
fetch(API_SERVER + "/forms/delete?id=" + id, requestOptions)
|
||
.then((response) => {
|
||
if (response.ok) {
|
||
$("#editapplication-form-popup-bg").removeClass("is-visible");
|
||
location.reload();
|
||
return response.json();
|
||
} else {
|
||
console.error("Ошибка при отправке POST запроса.");
|
||
return "Ошибка при отправке запроса.";
|
||
}
|
||
})
|
||
.catch((error) => {
|
||
console.error("Ошибка при отправке запроса:", error);
|
||
});
|
||
}
|
||
</script>
|
||
|
||
<script src="https://rawgit.com/RobinHerbots/Inputmask/5.x/dist/jquery.inputmask.js"></script>
|
||
<script>
|
||
$(document).ready(function(){
|
||
|
||
$('#phone-input').inputmask({"mask": "+7 (999) 999-9999"});
|
||
$('#contactphone-input').inputmask({"mask": "+7 (999) 999-9999"});
|
||
$('#editphone-input').inputmask({"mask": "+7 (999) 999-9999"});
|
||
$('#editcontactphone-input').inputmask({"mask": "+7 (999) 999-9999"});
|
||
|
||
|
||
});
|
||
</script>
|
||
|
||
|
||
</body>
|
||
</html> |