Сделать веб-страницу с формой ввода заявки.

Поля ввода:
- ФИО (валидация: русские буквы, пробелы, дефис)
- телефон (с форматированием под стандарт +79871234567, включая вставку из буфера, валидация на +79)
- адрес (с вводом по dadata.ru - подсказки. API-key предоставлю)
- комментарии к адресу (простой текст)
- дата встречи (календарик, выбор дат от "сегодня" до + 1 месяц. По умолчанию "завтра")
- продукт (выбор из списка, список статический, "Продукт 1", "Продукт 2")

Все поля кроме "комментарий" обязательны к заполнению.

Кнопки: "Отправить" и "Очистить" (эти кнопки должны быть с защитой: спрашивает "Вы уверены что хотите ...")

Так же на форме в правом верхнем углу должны отображаться значения параметров opID и opName, которые переданы в URL-е (например, https://lala.ru/myform.html?opID=234&opName=Vasya). Если оба или один параметр не переданы - то непереданный параметр не отображается. Отображение последовательно через пробел "234 Vasya" (или "234" или "Vasya" в зависимости от того какие параметры переданы в форму)

Логика работы:
1) Пользователь заполняет форму, нажимает "Отправить". Вылазит подтверждение "Вы уверены что хотите отправить заявку"? Если ДА, то форма отправляется на указанный мной URL (расположенный на другом поддомене одного и того же домена, CORS работает) методом POST. В тело запроса включается вся собранная информация из полей заявки, плюс opID и opName, плюс вся структура данных, полученная от ДаДата.Ру при подсказке адреса.

2) Если сервер принял информацию (код 200 + result=ok в возвращаемом json), он вернет "ID заявки" (строка, содержащая кириллицу). Сервер может вернуть код не 200, а может вернуть 200, но в json будет result=error и текст ошибки который нужно показать на форме.

3) Данный "ID заявки", а так же opID, opName и timestamp нужно отправить POST'ом на другой URL (в ответ получить 200 ОК). В случае не 200 ОК, считать что запрос отправлен, но в п.4 показать дополнительную красную строку, что "отправка в пиксель не удалась".

4) Пользователю показать, что данные успешно отправлены, кнопка ОК. По нажатию на ОК - переходим на пункт п. 1 - новый ввод данных.

Получается, что первый запрос - обязательный и важный. Второй - уведомительный, не важный. В случае проблем в первом запросе обработка приостанавливается, в случае проблем во втором запросе - пользователь ненавязчиво уведомляется. В json-ответе первого запроса есть указание отправлять или не отправлять второй запрос.

Позитивный ответ на первый запрос
{
"result": "ok",
"id": "ТЕСТ0001",
"pixel": true,
"error": null
}

Негативный ответ на первый запрос:
{
"result": "error",
"id": null,
"pixel": false,
"error": "некорректный номер телефона"
}

Длительную отправку данных - визуализировать индикатором ожидания. Ошибку отправки - визуализировать, при этом данные формы не должны быть потеряны, и нужно предлагать отправить заново (бывает, сервер кратковременно не принимал запросы).

Нужно решение на современном VueJS. Форма должна выглядеть как отцентрованный на странице прямоугольник со скругленными краями, с тенями. Мне нравится вот этот пример (но без картинки банковской карты) https://vuejsexamples.com/credit-card-form-with-smooth-and-sweet-micro-interactions/