826 lines
		
	
	
		
			39 KiB
		
	
	
	
		
			HTML
		
	
	
	
	
	
			
		
		
	
	
			826 lines
		
	
	
		
			39 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 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>
 | 
						||
                  <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 === "Материальный" || 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() === "Материальный" || $('#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() === "Материальный" || $('#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.Вид_пропуска === "Материальный" || 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> |