html/lab6/task6/script.js - main - maxxon/web-static-labs

html/lab6/task6/script.js
97 строк3 KB
Dasha_10
изменения
05 ноя 2025, 10:24
05 ноя 2025, 10:247d88f7e
const projectParticipationCheckbox = document.getElementById('projectParticipation');
const projectNameWrapper = document.getElementById('projectNameWrapper');
const projectNameInput = document.getElementById('projectName');
const saveBtn = document.getElementById('saveBtn');
const sendBtn = document.getElementById('sendBtn');
const form = document.getElementById('userForm');
const STORAGE_KEY = 'userFormData';

let isSaved = false;

// Обработка смены чекбокса участие в проекте
projectParticipationCheckbox.addEventListener('change', () => {
  projectNameWrapper.style.display = projectParticipationCheckbox.checked ? 'block' : 'none';
  if (!projectParticipationCheckbox.checked) {
    projectNameInput.value = '';
  }
  isSaved = false;
});

// Загрузка данных из localStorage
function loadFormData() {
  const data = JSON.parse(localStorage.getItem(STORAGE_KEY));
  if (data) {
    form.surname.value = data.surname || '';
    form.name.value = data.name || '';
    form.patronymic.value = data.patronymic || '';
    if (data.gender) {
      const genderRadio = [...form.gender].find(r => r.value === data.gender);
      if (genderRadio) genderRadio.checked = true;
    }
    form.faculty.value = data.faculty || '';
    form.projectParticipation.checked = data.projectParticipation || false;
    projectNameWrapper.style.display = form.projectParticipation.checked ? 'block' : 'none';
    form.projectName.value = data.projectName || '';
    isSaved = true;
  }
}

saveBtn.addEventListener('click', () => {
  if (!form.reportValidity()) return;

  const data = {
    surname: form.surname.value.trim(),
    name: form.name.value.trim(),
    patronymic: form.patronymic.value.trim(),
    gender: form.gender.value,
    faculty: form.faculty.value,
    projectParticipation: form.projectParticipation.checked,
    projectName: form.projectParticipation.checked ? form.projectName.value.trim() : ''
  };

  localStorage.setItem(STORAGE_KEY, JSON.stringify(data));
  isSaved = true;
  alert('Данные сохранены');
});

sendBtn.addEventListener('click', () => {
  if (!form.reportValidity()) return;

  const data = {
    surname: form.surname.value.trim(),
    name: form.name.value.trim(),
    patronymic: form.patronymic.value.trim(),
    gender: form.gender.value,
    faculty: form.faculty.value,
    projectParticipation: form.projectParticipation.checked ? 'Да' : 'Нет',
    projectName: form.projectParticipation.checked ? form.projectName.value.trim() : '-'
  };

  const params = new URLSearchParams(data).toString();
  window.open(`display.html?${params}`, '_blank');
});

// Предупреждение о потере данных
window.addEventListener('beforeunload', event => {
  const hasData =
    form.surname.value.trim() !== '' ||
    form.name.value.trim() !== '' ||
    form.patronymic.value.trim() !== '' ||
    [...form.gender].some(r => r.checked) ||
    form.faculty.value !== '' ||
    form.projectParticipation.checked ||
    (form.projectParticipation.checked && form.projectName.value.trim() !== '');

  if (!isSaved && hasData) {
    event.preventDefault();
    event.returnValue = 'Возможно, у вас есть несохранённые данные. Вы действительно хотите покинуть страницу?';
    return event.returnValue;
  }
});

// Отслеживание изменений для сброса флага сохранения
form.addEventListener('input', () => {
  isSaved = false;
});

loadFormData();