Potrzebny prosty konstruktor na HTML + JQURY

Jest zadanie, aby stworzyć konstruktor warunków na froncie. Na przykład, istnieje takie warunek "if((action == true || action == true && val == 5) || (action == true && $val != 7) )", trzeba mieć możliwość powtórzenia tego na froncie.

Jak to zrobić.

Przy ładowaniu pojawia się formularz, który jest podzielony na dwa bloki
1 blok "Warunki"

1. Przycisk utwórz formularz
2. Jeśli to pierwszy element na swoim poziomie, to pusto, w przeciwnym razie selektor z && i ||    ("level_condition")
3. Selekcja, która wybierze pole z dostępnych, które znajdują się w tablicy title i name  ("field_name")

[

    {"name": "some_name", "title": "Some Name", "type": "select", "select_data": [{"name": 12, "value": 12}, {"name": 14, "value": 14}]},

    {"name": "some_name_1", "title": "Some Name 1", "type": "boolean", "value": false},

    {"name": "some_name_2", "title": "Some Name 2", "type": "integer", "value": 5},

    {"name": "some_name_3", "title": "Some Name 3", "type": "string", "value": "string text"}

]

4. Selekcja z operacjami logicznymi != == itp. ("operation")
5. Pole do ręcznego wprowadzenia wartości lub, jeśli to boolean select, to wskazanie wartości z tablicy w punkcie 3. ("value")
6. Przycisk dodaj sublevel, który ma taką samą logikę jak blok powyżej.

7. Przycisk usuwania (jeśli usuwa się rodzica, to wszystko, co poniżej, jest usuwane)

W ten sposób będziemy mogli powtórzyć logikę z nieskończoną zagnieżdżonością.

2 blok "Działania"

Selekcja z wyboru "", "Błąd",  "Działanie".

Po wyborze "Błąd" pojawia się pole tekstowe do wprowadzenia tekstu

Po wyborze "Działanie" pojawia się selektor jak w punkcie 3 z możliwością dodawania nowych (tutaj bez poziomu) i przycisk usuwania.

Przycisk zapisz.

W formularzu należy poprawnie zrobić zagnieżdżenie. Oczekuje się, że przy wysyłaniu na zapis struktura odpowiedzi będzie taka. Jeśli wybierzesz na 1 poziomie 2 warunki. W 1 warunku wybierz 1 sub poziom itd.

conditions[0][level_condition] = ""

conditions[0][field_name]

conditions[0][operation]

conditions[0][value]

conditions[0][0][level_condition] = ""

conditions[0][0][field_name]

conditions[0][0][operation]

conditions[0][0][value]

conditions[0][1][level_condition] = "||"

conditions[0][1][field_name]

conditions[0][1][operation]

conditions[0][1][value]

conditions[1][level_condition]= "&&"

conditions[1][field_name]

conditions[1][operation]

conditions[1][value]

action_selector[error] = tekst błędu

action_selector[0][action][field_name]= pole, które wybrano

action_selector[0][action][value] = wartość dla pola, które wybrano

Obrazek z  przykładem ogólnej koncepcji, tylko są zbędne przyciski