<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<link href="no_main.css" rel="stylesheet"/>
<link rel="icon" href="../communication_transfer_exchange_data_icon_256496 (1).ico">
<script src="main.js" defer></script>
</head>
<body>
<div class="indentation">
<label for="id_order">№ заказа:</label>
<input type="number" id="id_order" name="id_order" required>
</div>
<div class="indentation">
<div class="select-row">
<div class="select-left">
<label for="department">Отдел:</label>
<select id="department" name="department" required>
</select>
</div>
<div class="select-right">
<label for="customer">Заказчик:</label>
<select id="customer" name="customer" required>
</select>
</div>
</div>
</div>
<div class="indentation">
<label for="id_contract">№ договора:</label>
<input type="number" id="id_contract" name="id_contract" required>
</div>
<div class="indentation">
<label for="name_object">Наименование объекта:</label>
<input type="text" id="name_object" name="name_object" required>
</div>
<div class="indentation">
<label for="date_contract">Дата поступления заказа:</label>
<input type="date" id="date_contract" name="date_contract" required>
</div>
<div class="indentation">
<label for="note">Примечание:</label>
<input type="text" id="note" name="note">
</div>
<button class="add_row">Добавить принтер</button>//кнопка будет добавлять ещё одну строку в таблицу
<table id="info_contract">
<tr>
<th class="first_row"></th>
<th>Тип работы</th>
<th>Принтер</th>
<th>Материал</th>
<th>Дата</th>
<th>Исполнитель</th>
<th>Формат</th>
<th>Листов</th>
<th>Страниц</th>
<th>Брак</th>
<th>Архив</th>
</tr>
<tr>
<td class="first_row" id="cell1">
</td>
<td>
<select class="val" id="select1" required>//выбор не от чего не зависит
</select><!--выбор типа работы-->
</td>
<td>
<select class="val" id="select2" required>//выбор будет зависеть от выбора в select1
</select><!--выбор принтера-->
</td>
<td>
<select class="val" id="select3" required>//выбор будет зависеть от выбора в select2
</select><!--выбор материала-->
</td>
<td>
<input class="val" type="date" required/>
</td><!--дата-->
<td>
<select class="val" id="select4" required>//выбор не от чего не зависит
</select><!--выбор исполнителя-->
</td>
<td>
<select class="val" id="select5" required>//выбор будет зависеть от выбора в select2
</select><!--выбор формата-->
<button class="add_format">+</button>//кнопка добавит точно такой-же select5 в эту ячейку
</td>
<td>
<input type="number" class="number" />
</td>
<td>
<input type="number" class="number"/>
</td>
<td>
<input type="number" class="number"/>
</td>
<td>
<input type="number" class="number"/>
</td>
</tr>
</table>
<button class="send" id="submit_button" onclick="fillButton()">Записать</button>//будет записывать в БД информацию из select и input
</body>
</html>
для всех select option я буду брать из БД и я вроде как определился что для этого лучше будет использовать библиотеку Axios. Но вот не могу определиться что мне лучше использовать Vue или React.
Простой
Простой