initial commit
This commit is contained in:
		
							
								
								
									
										825
									
								
								static/templates/account/passes.html
									
									
									
									
									
										Normal file
									
								
							
							
						
						
									
										825
									
								
								static/templates/account/passes.html
									
									
									
									
									
										Normal file
									
								
							| @@ -0,0 +1,825 @@ | ||||
| <!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 passes = [ | ||||
|               {{#each Passes}} | ||||
|               { | ||||
|               id: {{this.id}}, | ||||
|               status: "{{this.Состояние}}", | ||||
|               date: "{{this.Дата_выдачи}}", | ||||
|               finaldate: "{{this.Действие_до}}", | ||||
|               type: "{{this.Вид_пропуска}}", | ||||
|               name: "{{this.Работник}}", | ||||
|               legal: "{{this.Организация}}", | ||||
|               address: "{{this.Зона_доступа}}", | ||||
|               car: "{{this.Авто_гос_номер}}", | ||||
|               tmcname: "{{this.Наименование}}", | ||||
|               }, | ||||
|               {{/each}} | ||||
|           ]; | ||||
|     </script> | ||||
|     <script src="../scripts/passes-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 id="addPass" 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="passesWrapper" class="table-wrapper"> | ||||
|       <table id="passesTable"> | ||||
|         <thead> | ||||
|           <tr> | ||||
|             <th>ID</th> | ||||
|             <th>Состояние</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="newPassForm"> | ||||
|         <div id="addpass-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>Новый пропуск (создание)</h1> | ||||
|               <br> | ||||
|  | ||||
|               <div class="input-area"> | ||||
|                 <label for="newPassType">Вид пропуска*</label> | ||||
|                 <select name="pass-type" id="newPassType"> | ||||
|                   <option value="Временный">Временный пропуск</option> | ||||
|                   <option value="Автомобильный">Автомобильный пропуск</option> | ||||
|                   <option value="ТМЦ">Ввоз-Вывоз ТМЦ</option> | ||||
|                   <option value="Материальный">Материальный</option> | ||||
|                 </select> | ||||
|               </div> | ||||
|  | ||||
|               <div class="input-area"> | ||||
|                 <label for="newPassStatus">Состояние*</label> | ||||
|                 <select name="user-type" id="newPassStatus"> | ||||
|                   <option value="Заказан">Заказан</option> | ||||
|                   <option value="Отменен">Отменен</option> | ||||
|                   <option value="Отмечен">Отмечен</option> | ||||
|                   <option value="Отложен">Отложен</option> | ||||
|                   <option value="Постоянный">Постоянный</option> | ||||
|                 </select> | ||||
|               </div> | ||||
|  | ||||
|               <h2>ФИО</h2> | ||||
|               <div class="three-inputs"> | ||||
|                 <input type="text" id="surname-input" placeholder="Фамилия"> | ||||
|                 <input type="text" id="firstname-input" placeholder="Иван"> | ||||
|                 <input type="text" id="secondname-input" placeholder="Отчество (при наличии)"> | ||||
|               </div> | ||||
|  | ||||
|               <h2>Срок действия</h2> | ||||
|  | ||||
|               <div class="input-area"> | ||||
|                 <label for="date-input">Дата выдачи*</label> | ||||
|                 <input type="date" id="date-input"> | ||||
|               </div> | ||||
|               <div class="input-area"> | ||||
|                 <label for="todate-input">Действие до*</label> | ||||
|                 <input type="date" id="todate-input"> | ||||
|               </div> | ||||
|                | ||||
|               <h2>Контактная информация посетителя</h2> | ||||
|  | ||||
|               <div class="two-inputs"> | ||||
|                 <input type="text" id="phone-input" placeholder="Номер телефона посетителя"> | ||||
|                 <input type="text" id="email-input" placeholder="Email"> | ||||
|                 <input type="text" id="legal-input" placeholder="Организация"> | ||||
|               </div> | ||||
|  | ||||
|               <h2>Детали</h2> | ||||
|  | ||||
|               <div class="input-area"> | ||||
|                 <input type="text" id="purpose-input" placeholder="Цель выдачи"> | ||||
|               </div> | ||||
|               <div class="input-area"> | ||||
|                 <input type="text" id="address-input" placeholder="Территория посещения"> | ||||
|               </div> | ||||
|               <div class="input-area"> | ||||
|                 <textarea id="additional-input" cols="30" rows="10" placeholder="Дополнительно"></textarea> | ||||
|               </div> | ||||
|  | ||||
|               <div style="display: none;" class="inputs" id="car-inputs"> | ||||
|                 <h2>Информация о автомобилях</h2> | ||||
|                 <div class="car-input-group" data-index="1"> | ||||
|                     <label>Номер автомобиля</label> | ||||
|                     <input type="text" class="carnumber-input"> | ||||
|                     <label>Марка автомобиля</label> | ||||
|                     <input type="text" class="carbrand-input"> | ||||
|                     <label>Модель автомобиля</label> | ||||
|                     <input type="text" class="carmodel-input"> | ||||
|                     <label>Цвет автомобиля</label> | ||||
|                     <input type="text" class="carcolor-input"> | ||||
|                     <button type="button" class="add-car bright">Добавить ещё автомобиль</button> | ||||
|                 </div> | ||||
|             </div> | ||||
|    | ||||
|             <div style="display: none;" class="inputs" id="tmc-inputs"> | ||||
|               <h2>Информация о ТМЦ</h2> | ||||
|               <div class="tmc-input-group" data-index="1"> | ||||
|                 <label>Наименование ТМЦ</label> | ||||
|                 <input type="text" class="tmcname-input"> | ||||
|                 <label>Единица измерения</label> | ||||
|                 <input type="text" class="tmcunit-input"> | ||||
|                 <label>Количество</label> | ||||
|                 <input type="text" class="tmcquantity-input"> | ||||
|                 <button type="button" class="add-tmc bright">Добавить ещё ТМЦ</button> | ||||
|               </div> | ||||
|  | ||||
|           </div> | ||||
|      | ||||
|               <button type="submit" id="addPass-button">Добавить пропуск</button> | ||||
|           </div> | ||||
|       </div> | ||||
|       </form> | ||||
|  | ||||
|       <form id="editPassForm"> | ||||
|         <input type="text" id="editpassid-input" hidden> | ||||
|         <input type="text" id="editpasstype-input" hidden> | ||||
|         <div id="editpass-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="editPass"></span> пропуск</h1> | ||||
|               <br> | ||||
|  | ||||
|               <div class="input-area"> | ||||
|                 <label for="passStatus">Состояние*</label> | ||||
|                 <select name="user-type" id="passStatus"> | ||||
|                   <option value="Заказан">Заказан</option> | ||||
|                   <option value="Отменен">Отменен</option> | ||||
|                   <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"> | ||||
|               </div> | ||||
|  | ||||
|               <h2>Срок действия</h2> | ||||
|  | ||||
|               <div class="input-area"> | ||||
|                 <label for="date-input">Дата выдачи*</label> | ||||
|                 <input type="date" id="editdate-input"> | ||||
|               </div> | ||||
|               <div class="input-area"> | ||||
|                 <label for="todate-input">Действие до*</label> | ||||
|                 <input type="date" id="edittodate-input"> | ||||
|               </div> | ||||
|                | ||||
|               <h2>Контактная информация посетителя</h2> | ||||
|  | ||||
|               <div class="two-inputs"> | ||||
|                 <input type="text" id="editphone-input" placeholder="Номер телефона посетителя"> | ||||
|                 <input type="text" id="editemail-input" placeholder="Email"> | ||||
|                 <input type="text" id="editlegal-input" placeholder="Организация"> | ||||
|               </div> | ||||
|  | ||||
|               <h2>Детали</h2> | ||||
|  | ||||
|               <div class="input-area"> | ||||
|                 <input type="text" id="editpurpose-input" placeholder="Цель выдачи"> | ||||
|               </div> | ||||
|               <div class="input-area"> | ||||
|                 <input type="text" id="editaddress-input" placeholder="Территория посещения"> | ||||
|               </div> | ||||
|               <div class="input-area"> | ||||
|                 <textarea id="editadditional-input" cols="30" rows="10" placeholder="Дополнительно"></textarea> | ||||
|               </div> | ||||
|  | ||||
|               <div style="display: none;" class="inputs" id="editcar-inputs"> | ||||
|                 <h2>Информация о автомобилях</h2> | ||||
|                 <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="edittmc-inputs"> | ||||
|               <h2>Информация о ТМЦ</h2> | ||||
|  | ||||
|               <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="user-buttons" style="display: flex; justify-content: space-between;"> | ||||
|               <button style="width: 49.5%;" type="submit" id="editPass-button">Сохранить изменения</button> | ||||
|               <button style="width: 49.5%;" type="button" id="deletePass-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($) { | ||||
|  | ||||
|             const carInputsContainer = document.getElementById("car-inputs"); | ||||
|  | ||||
|             let carIndex = 1; | ||||
|  | ||||
|             function addCarInput() { | ||||
|                 carIndex++; | ||||
|                 const inputGroup = document.createElement("div"); | ||||
|                 inputGroup.classList.add("car-input-group"); | ||||
|                 inputGroup.setAttribute("data-index", carIndex); | ||||
|                 inputGroup.innerHTML = ` | ||||
|                     <label>Номер автомобиля</label> | ||||
|                     <input type="text" class="carnumber-input" required> | ||||
|                     <label>Марка автомобиля</label> | ||||
|                     <input type="text" class="carbrand-input" required> | ||||
|                     <label>Модель автомобиля</label> | ||||
|                     <input type="text" class="carmodel-input" required> | ||||
|                     <label>Цвет автомобиля</label> | ||||
|                     <input type="text" class="carcolor-input" required> | ||||
|                     <button type="button" class="remove-car delete">Удалить этот автомобиль</button> | ||||
|                 `; | ||||
|                 carInputsContainer.appendChild(inputGroup); | ||||
|  | ||||
|                 inputGroup.querySelector(".remove-car").addEventListener("click", function() { | ||||
|                     inputGroup.remove(); | ||||
|                 }); | ||||
|             } | ||||
|  | ||||
|             carInputsContainer.addEventListener("click", function(e) { | ||||
|                 if (e.target.classList.contains("add-car")) { | ||||
|                     addCarInput(); | ||||
|                 } | ||||
|             }); | ||||
|  | ||||
|             const tmcInputsContainer = document.getElementById("tmc-inputs"); | ||||
|  | ||||
|             let tmcIndex = 1; // Индекс для управления уникальностью блоков ТМЦ | ||||
|  | ||||
|             function addTmcInput() { | ||||
|                 tmcIndex++; // Увеличиваем индекс для следующего блока | ||||
|                 const inputGroup = document.createElement("div"); | ||||
|                 inputGroup.classList.add("tmc-input-group"); | ||||
|                 inputGroup.setAttribute("data-index", tmcIndex); | ||||
|                 inputGroup.innerHTML = ` | ||||
|                 <label>Наименование ТМЦ</label> | ||||
|                 <input type="text" class="tmcname-input" required> | ||||
|                 <label>Единица измерения</label> | ||||
|                 <input type="text" class="tmcunit-input" required> | ||||
|                 <label>Количество</label> | ||||
|                 <input type="text" class="tmcquantity-input" required> | ||||
|                 <button type="button" class="remove-tmc delete">Удалить это ТМЦ</button> | ||||
|                 `; | ||||
|                 tmcInputsContainer.appendChild(inputGroup); | ||||
|  | ||||
|                 // Добавляем обработчик для кнопки удаления | ||||
|                 inputGroup.querySelector(".remove-tmc").addEventListener("click", function() { | ||||
|                 inputGroup.remove(); | ||||
|                 }); | ||||
|             } | ||||
|  | ||||
|             // Обработчик для кнопки добавления ТМЦ | ||||
|             tmcInputsContainer.addEventListener("click", function(e) { | ||||
|                 if (e.target.classList.contains("add-tmc")) { | ||||
|                 addTmcInput(); | ||||
|                 } | ||||
|             }); | ||||
|              | ||||
|             $('#addPass').on('click', function(event) { | ||||
|                 event.preventDefault(); | ||||
|  | ||||
|                 $('#addpass-form-popup-bg').addClass('is-visible'); | ||||
|             }); | ||||
|  | ||||
|             $('#addpass-form-popup-bg').on('click', function(event) { | ||||
|                 if ($(event.target).is('#addpass-form-popup-bg') || $(event.target).is('#btnCloseForm')) { | ||||
|                 event.preventDefault(); | ||||
|                 $(this).removeClass('is-visible'); | ||||
|                 } | ||||
|             }); | ||||
|              | ||||
|             $('#editpass-form-popup-bg').on('click', function(event) { | ||||
|                 if ($(event.target).is('#editpass-form-popup-bg') || $(event.target).is('#btnCloseForm')) { | ||||
|                 event.preventDefault(); | ||||
|                 $(this).removeClass('is-visible'); | ||||
|                 } | ||||
|             }); | ||||
|  | ||||
|           }); | ||||
|  | ||||
|           const typeSelect = document.getElementById('newPassType'); | ||||
|           const carInputs = document.getElementById('car-inputs'); | ||||
|           const tmcInputs = document.getElementById('tmc-inputs'); | ||||
|        | ||||
|             typeSelect.addEventListener('change', function() { | ||||
|                       if (this.value === "Временный" || this.value === "Материальный") { | ||||
|                         carInputs.style.display = 'none'; | ||||
|                         tmcInputs.style.display = 'none'; | ||||
|                       } else if (this.value === "Автомобильный") { | ||||
|                         carInputs.style.display = 'flex'; | ||||
|                         tmcInputs.style.display = 'none'; | ||||
|                       } else if (this.value === "ТМЦ") { | ||||
|                         carInputs.style.display = 'none'; | ||||
|                         tmcInputs.style.display = 'flex'; | ||||
|                       } | ||||
|           }); | ||||
|  | ||||
|  | ||||
|           document.addEventListener("DOMContentLoaded", function() { | ||||
|             const passForm = document.getElementById("newPassForm"); | ||||
|  | ||||
|             passForm.addEventListener("submit", async function(event) { | ||||
|                 event.preventDefault(); | ||||
|                 $('#send-button').addClass('inactive'); | ||||
|  | ||||
|                 const type = $('#newPassType').val(); | ||||
|                 const status = $('#newPassStatus').val(); | ||||
|                 const name = `${$('#surname-input').val()} ${$('#firstname-input').val()} ${$('#secondname-input').val()}`; | ||||
|                 const date = $('#date-input').val(); | ||||
|                 const todate = $('#todate-input').val(); | ||||
|                 const phone = $('#phone-input').val(); | ||||
|                 const email = $('#email-input').val(); | ||||
|                 const legal = $('#legal-input').val(); | ||||
|                 const purpose = $('#purpose-input').val(); | ||||
|                 const address = $('#address-input').val(); | ||||
|                 const additional = $('#additional-input').val(); | ||||
|  | ||||
|  | ||||
|                 if ($('#newPassType').val() === "Временный" || $('#newPassType').val() === "Материальный") { | ||||
|                     // Отправляем запрос на сервер для авторизации | ||||
|                     const response = await fetch("{{API_SERVER}}/passes/newpass", { | ||||
|                         method: "POST", | ||||
|                         headers: { | ||||
|                             "Content-Type": "application/json", | ||||
|                             Authorization: getCookie("token"), | ||||
|                         }, | ||||
|                         body: JSON.stringify({ type, status, name, date, todate, phone, email, legal, purpose, address, additional }) | ||||
|                     }); | ||||
|                     if (response.status === 201) { | ||||
|                         const data = await response.json(); | ||||
|                         alert("Пропуск успешно добавлен!") | ||||
|  | ||||
|                         window.location.href = "/passes"; | ||||
|                         $('#send-button').removeClass('inactive'); | ||||
|                     } else { | ||||
|                         alert("Произошла ошибка при попытке отправить заявку"); | ||||
|                         $('#send-button').removeClass('inactive'); | ||||
|                     } | ||||
|                 } | ||||
|                 if ($('#newPassType').val() === "Автомобильный") { | ||||
|  | ||||
|                     const carnumber = Array.from(document.querySelectorAll(".carnumber-input")).map(input => input.value); | ||||
|                     const carbrand = Array.from(document.querySelectorAll(".carbrand-input")).map(input => input.value); | ||||
|                     const carmodel = Array.from(document.querySelectorAll(".carmodel-input")).map(input => input.value); | ||||
|                     const carcolor = Array.from(document.querySelectorAll(".carcolor-input")).map(input => input.value); | ||||
|  | ||||
|                     // Отправляем запрос на сервер для авторизации | ||||
|                     const response = await fetch("{{API_SERVER}}/passes/newpass", { | ||||
|                         method: "POST", | ||||
|                         headers: { | ||||
|                             "Content-Type": "application/json", | ||||
|                             Authorization: getCookie("token"), | ||||
|                         }, | ||||
|                         body: JSON.stringify({ type, status, name, date, todate, phone, email, legal, purpose, address, additional, carnumber, carbrand, carmodel, carcolor }) | ||||
|                     }); | ||||
|                     if (response.status === 201) { | ||||
|                         const data = await response.json(); | ||||
|                         alert("Пропуск успешно добавлен!") | ||||
|  | ||||
|                         window.location.href = "/passes"; | ||||
|                         $('#send-button').removeClass('inactive'); | ||||
|                     } else { | ||||
|                         alert("Произошла ошибка при попытке отправить заявку"); | ||||
|                         $('#send-button').removeClass('inactive'); | ||||
|                     } | ||||
|                 } | ||||
|                 if ($('#newPassType').val() === "ТМЦ") { | ||||
|  | ||||
|                     const tmcname = Array.from(document.querySelectorAll(".tmcname-input")).map(input => input.value); | ||||
|                     const tmcunit = Array.from(document.querySelectorAll(".tmcunit-input")).map(input => input.value); | ||||
|                     const tmcquantity = Array.from(document.querySelectorAll(".tmcquantity-input")).map(input => input.value); | ||||
|  | ||||
|                     // Отправляем запрос на сервер для авторизации | ||||
|                     const response = await fetch("{{API_SERVER}}/passes/newpass", { | ||||
|                         method: "POST", | ||||
|                         headers: { | ||||
|                             "Content-Type": "application/json", | ||||
|                             Authorization: getCookie("token"), | ||||
|                         }, | ||||
|                         body: JSON.stringify({ type, status, name, date, todate, phone, email, legal, purpose, address, additional, tmcname, tmcunit, tmcquantity }) | ||||
|                     }); | ||||
|                     if (response.status === 201) { | ||||
|                         const data = await response.json(); | ||||
|                         alert("Пропуск успешно добавлен!") | ||||
|  | ||||
|                         window.location.href = "/passes"; | ||||
|                         $('#send-button').removeClass('inactive'); | ||||
|                     } else { | ||||
|                         alert("Произошла ошибка при попытке отправить заявку"); | ||||
|                         $('#send-button').removeClass('inactive'); | ||||
|                     } | ||||
|                 } | ||||
|                  | ||||
|             }); | ||||
|  | ||||
|             const editPassForm = document.getElementById("editPassForm"); | ||||
|  | ||||
|             editPassForm.addEventListener("submit", async function(event) { | ||||
|                 event.preventDefault(); | ||||
|                 $('#send-button').addClass('inactive'); | ||||
|  | ||||
|                 const id = parseInt($('#editpassid-input').val()); | ||||
|                 const type = $('#editpasstype-input').val(); | ||||
|                 const status = $('#passStatus').val(); | ||||
|                 const name = $('#editname-input').val(); | ||||
|                 const date = $('#editdate-input').val(); | ||||
|                 const todate = $('#edittodate-input').val(); | ||||
|                 const phone = $('#editphone-input').val(); | ||||
|                 const email = $('#editemail-input').val(); | ||||
|                 const legal = $('#editlegal-input').val(); | ||||
|                 const purpose = $('#editpurpose-input').val(); | ||||
|                 const address = $('#editaddress-input').val(); | ||||
|                 const additional = $('#editadditional-input').val(); | ||||
|  | ||||
|  | ||||
|                 if ($('#editpasstype-input').val() === "Временный" || $('#editpasstype-input').val() === "Материальный") { | ||||
|                     // Отправляем запрос на сервер для авторизации | ||||
|                     const response = await fetch("{{API_SERVER}}/passes/update", { | ||||
|                         method: "PUT", | ||||
|                         headers: { | ||||
|                             "Content-Type": "application/json", | ||||
|                             Authorization: getCookie("token"), | ||||
|                         }, | ||||
|                         body: JSON.stringify({ id, type, status, name, date, todate, phone, email, legal, purpose, address, additional }) | ||||
|                     }); | ||||
|                     if (response.status === 200) { | ||||
|                         const data = await response.json(); | ||||
|  | ||||
|                         location.reload(); | ||||
|                         $('#send-button').removeClass('inactive'); | ||||
|                     } else { | ||||
|                         alert("Произошла ошибка при попытке отправить заявку"); | ||||
|                         $('#send-button').removeClass('inactive'); | ||||
|                     } | ||||
|                 } | ||||
|                 if ($('#editpasstype-input').val() === "Автомобильный") { | ||||
|  | ||||
|                   const factsValues = $('.car-fact').map(function() { | ||||
|                     return $(this).prop('checked'); | ||||
|                   }).toArray(); | ||||
|  | ||||
|                     const carnumber = $('#editcarnumber-input').val(); | ||||
|                     const carbrand = $('#editcarbrand-input').val(); | ||||
|                     const carmodel = $('#editcarmodel-input').val(); | ||||
|                     const carcolor = $('#editcarcolor-input').val(); | ||||
|  | ||||
|                     // Отправляем запрос на сервер для авторизации | ||||
|                     const response = await fetch("{{API_SERVER}}/passes/update", { | ||||
|                         method: "PUT", | ||||
|                         headers: { | ||||
|                             "Content-Type": "application/json", | ||||
|                             Authorization: getCookie("token"), | ||||
|                         }, | ||||
|                         body: JSON.stringify({ id, type, status, name, date, todate, phone, email, legal, purpose, address, additional, carnumber, carbrand, carmodel, carcolor, factsValues }) | ||||
|                     }); | ||||
|                     if (response.status === 200) { | ||||
|                         const data = await response.json(); | ||||
|                         location.reload(); | ||||
|  | ||||
|                         $('#send-button').removeClass('inactive'); | ||||
|                     } else { | ||||
|                         alert("Произошла ошибка при попытке отправить заявку"); | ||||
|                         $('#send-button').removeClass('inactive'); | ||||
|                     } | ||||
|                 } | ||||
|                 if ($('#editpasstype-input').val() === "ТМЦ") { | ||||
|  | ||||
|                   const factsValues = $('.tmc-fact').map(function() { | ||||
|                     return $(this).val(); | ||||
|                   }).toArray(); | ||||
|  | ||||
|                     const tmcname = $('#edittmcname-input').val(); | ||||
|                     const tmcunit = $('#edittmcunit-input').val(); | ||||
|                     const tmcquantity = $('#edittmcquantity-input').val(); | ||||
|  | ||||
|                     // Отправляем запрос на сервер для авторизации | ||||
|                     const response = await fetch("{{API_SERVER}}/passes/update", { | ||||
|                         method: "PUT", | ||||
|                         headers: { | ||||
|                             "Content-Type": "application/json", | ||||
|                             Authorization: getCookie("token"), | ||||
|                         }, | ||||
|                         body: JSON.stringify({ id, type, status, name, date, todate, phone, email, legal, purpose, address, additional, tmcname, tmcunit, tmcquantity, factsValues }) | ||||
|                     }); | ||||
|                     if (response.status === 200) { | ||||
|                         const data = await response.json(); | ||||
|                         location.reload(); | ||||
|  | ||||
|                         $('#send-button').removeClass('inactive'); | ||||
|                     } else { | ||||
|                         alert("Произошла ошибка при попытке отправить заявку"); | ||||
|                         $('#send-button').removeClass('inactive'); | ||||
|                     } | ||||
|                 } | ||||
|                  | ||||
|             }); | ||||
|         }); | ||||
|  | ||||
|             | ||||
|  | ||||
|         function openPass(id) { | ||||
|     const requestOptions = { | ||||
|       method: "GET", | ||||
|       headers: { | ||||
|         Authorization: getCookie("token"), | ||||
|       }, | ||||
|     }; | ||||
|  | ||||
|     fetch(API_SERVER + "/passes/pass?id=" + id, requestOptions) | ||||
|       .then((response) => { | ||||
|         if (response.ok) { | ||||
|           $("#editpass-form-popup-bg").addClass("is-visible"); | ||||
|           return response.json(); | ||||
|         } else { | ||||
|           console.error("Ошибка при отправке POST запроса."); | ||||
|           return "Ошибка при отправке запроса."; | ||||
|         } | ||||
|       }) | ||||
|       .then((data) => { | ||||
|  | ||||
|         $("#editpassid-input").val(id); | ||||
|         $("#editpasstype-input").val(data.data.Вид_пропуска); | ||||
|  | ||||
|         $("#editPass").html(data.data.Вид_пропуска); | ||||
|  | ||||
|         $("#deletePass-button").attr("onclick", `deletePass(${id})`); | ||||
|  | ||||
|         if (data.data.Вид_пропуска === "Временный" || data.data.Вид_пропуска === "Материальный") { | ||||
|           $("#editcar-inputs").css("display", "none"); | ||||
|           $("#edittmc-inputs").css("display", "none"); | ||||
|         } else if (data.data.Вид_пропуска === "Автомобильный") { | ||||
|           $("#editcar-inputs").css("display", "flex"); | ||||
|           $("#edittmc-inputs").css("display", "none"); | ||||
|         } else if (data.data.Вид_пропуска === "ТМЦ") { | ||||
|           $("#editcar-inputs").css("display", "none"); | ||||
|           $("#edittmc-inputs").css("display", "flex"); | ||||
|         } | ||||
|  | ||||
|         $("#passStatus").val(data.data.Состояние); | ||||
|         $("#editname-input").val(data.data.Работник); | ||||
|         $("#editlegal-input").val(data.data.Организация); | ||||
|         $("#editphone-input").val(data.data.Телефон); | ||||
|         $("#editemail-input").val(data.data.Email); | ||||
|  | ||||
|         $("#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 fact = JSON.parse(data.data.Отметка); | ||||
|  | ||||
|           if (fact === null) { | ||||
|             fact = new Array(tmcnames.length).fill(""); | ||||
|           } | ||||
|  | ||||
|           // Создаем пустую строку для хранения HTML наших элементов списка | ||||
|           var tmclist = ""; | ||||
|  | ||||
|           // Итерируем по одному из массивов (предполагая, что все они имеют одинаковую длину) | ||||
|           for (var i = 0; i < tmcnames.length; i++) { | ||||
|             // Добавляем элемент списка для каждой группы данных, индексируем начиная с 1 | ||||
|             tmclist += "<li><span style='font-weight: 600;'>Позиция " + (i + 1) + ":</span> <br>" + | ||||
|                           "Наименование ТМЦ - " + tmcnames[i] + "<br>" + | ||||
|                           "Единица измерения - " + tmcunits[i] + "<br>" + | ||||
|                           "Количество - " + tmcquantitys[i] + "<br>" + | ||||
|                           "Фактически - " + '<input class="tmc-fact" value="' + fact[i] + '" type="text">' +  | ||||
|                           "</li>"; | ||||
|           } | ||||
|  | ||||
|           // Найти элемент, куда вы хотите добавить этот список, и установить его innerHTML | ||||
|           // Предположим, что у вас есть элемент <ul id="tmclist"></ul> для этой цели | ||||
|           $("#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 fact = JSON.parse(data.data.Отметка); | ||||
|           if (fact === null) { | ||||
|             fact = new Array(carnumbers.length).fill(false); | ||||
|           } | ||||
|  | ||||
|           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] + "<br>" + | ||||
|                           "Отметка - " + '<input class="car-fact" type="checkbox"' + (fact[i] ? ' checked' : '') + '>' +  | ||||
|                           "</li>"; | ||||
|           } | ||||
|  | ||||
|           $("#carlist").html(carlist); | ||||
|         } | ||||
|  | ||||
|         $("#editadditional-input").val(data.data.Дополнительно); | ||||
|         $("#editpurpose-input").val(data.data.Цель_выдачи); | ||||
|         $("#editaddress-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.Действие_до, "edittodate-input"); | ||||
|         } else { | ||||
|           $("#edittodate-input").val(""); | ||||
|         } | ||||
|  | ||||
|  | ||||
|  | ||||
|       }) | ||||
|       .catch((error) => { | ||||
|         console.error("Ошибка при отправке запроса:", error); | ||||
|       }); | ||||
|   } | ||||
|  | ||||
|  | ||||
|   function deletePass(id) { | ||||
|     const requestOptions = { | ||||
|       method: "DELETE", | ||||
|       headers: { | ||||
|         Authorization: getCookie("token"), | ||||
|       }, | ||||
|     }; | ||||
|  | ||||
|     fetch(API_SERVER + "/passes/delete?id=" + id, requestOptions) | ||||
|       .then((response) => { | ||||
|         if (response.ok) { | ||||
|           $("#editpass-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> | ||||
		Reference in New Issue
	
	Block a user