Разработка функции генерации форм по api

Цена договорная • безналичный расчёт
21 января 2019, 17:19 • 8 откликов • 88 просмотров
Требуется разработка модуля (функции, скрипта) для генерации формы из массива данных полученных по api

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

Требования:
1. понятный и аккуратный код
2. масштабируемый код, апи будет развиваться, данных будет со временем больше
3. умение системно мыслить
4. в данный момент требуется код на чистом js (можно с jquery) (про vue, etc в курсе)
5. в перспективе требуется удаленный работник на долговременное сотрудничество. это не разовая задача
6. доступ к апи будет предоставлен. как и примеру и ответы на вопросы
7. работаем по договору, с физическим лицом, включая nda
незначительное преимущество - нахождение в Санкт-Петербурге или готовность приехать редко (вся работа удаленная)
8. сделать рабочую логику, которая уходит в шаблон, который готовит наш дизайнер

Алгоритм работы:
0. запускается функция createItem (type_id, parent, element_id)
1. Делаем запрос на сервер за параметрами формы. если сервер не ответил или ответил не 200 - вывести ошибку, в соответствии с кодом
2. Генерируем форму
3. Производим валидацию введенных значений в соответствии с массивом правил
4. В случае неуспешной проверки: берем текстовые сообщения из массива: form_error_messages
просим юзера исправить ошибки goto 3
В случае успешной идём дальше
5. Отправляем массив данных на сервер. ожидаем ответ
6. code = 200 -> runScenario('createItem). запускаем обновление интерфейса исходя из сценария
code != 200
вернется массив ошибок. необходимо обновить элементы и перестроить форму. goto 2
(в разработке данный ответ)
варианты ошибок: (приложение 2)


В целом требуется переписать текущий код прототипа

Формат данных: json

Формат api:
первый уровень
api_code
api_result
api_error_message (опционально)

api_result для форм:
form_data {…}
form_elements {…}
form_books {…}
form_error_messages {…}
form_group {…}

form_data - основные данные формы
может содержать массив parent (элементы у нас создаются в древовидной структуре
parent - может содержать properties

form_data содержит массив hidden - перечень элементов type="hidden"

form_elements - основные элементы формы
массив содержит в себе
- правила валидации
- element_book (указатель на справочник book (ниже пояснение) )
- help_link (ссылка на справку. нужно для интерфейса, для новых пользователей icon question)

атрибуты элементов
is_hidden - элемент не отображается в форме. его следует генерировать по требованию (значок + на клику на который выводим перечень скрытых элементов и создаем новый инпут после выбора)
help_link - ссылка на подсказку. (иконка вопроса в конце текстового поля)
element_valid_pattern - регулярное выражение для проверки
element_valid_rules - функция для проверки. просто её вызвать, если указана, с передачей значения
is_requred - обязательно для заполнения
element_type - тип поля. помимо типовых (number, text, select,...) есть "наши" типы, а именно:
money => целое число сумма копеек, но визуально надо чтобы вводились рубли, а на сервер отправлять/получать сумму копеек (формат: 12’500.00)
date => вывести календарь
year => вывести календарь, где только года

все элементы могут быть сгруппированы (а могут быть без группы, к примеру редактирование 1 input)
массив групп и их интерфейсные названия идут в блоке: form_group

Обратите внимание на свойство типа is_inherited - его значение стоить взять по коду ( form_data.parent.properties[prop.property_code]) у предка, если оно имеется


свойства типа relation или просто свойства имеющие атрибут link
сформировать поле с live search. ссылка для загрузки данных в link
url = link+?q=<q>&client_token=<client_token>
ответ api_result:
<id>=<text>
"406": "Северный газ ()",
"409": "Газкомнефть ()",
"419": "ПетербургГаз ()",
"422": "Газпром проектирование ()",
"508": "Газпром промгаз ()",
"513": "Газпром Инвестгазификация ()",
в input после выбора вставить <text>
на сервер надо передать пару [rel_id=><id>]


form_books - перечень справочников значений (для select)
Файлы