templates/system/entity-generation.html.twig line 1

Open in your IDE?
  1. {% extends "util/form.html.twig" %}
  2. {% block head_css %}
  3.     <link href="{{ asset("/css/jquery-ui.min.css") }}" rel="stylesheet" type="text/css" />
  4.     <style>.w-number { width: 100px; }</style>
  5. {% endblock %}
  6. {% block head_js %}
  7.     <script type="application/javascript" src="{{ asset("/js/jquery-ui.min.js") }}"></script>
  8.     <script type="text/javascript">
  9.         function add(elem)
  10.         {
  11.             // Variable declaration
  12.             let alias, count, entity, properties, prototype, value;
  13.             // Get the type of the prototype
  14.             let type = $(elem).data("type");
  15.             // Get the input that contains the entity alias
  16.             let entityAlias = $("#entity-alias");
  17.             // Get the input that contains the entity name
  18.             let entityName = $("#entity-name");
  19.             // Get the input that contains the property name
  20.             let propertyName = $("#property-name");
  21.             // When the user add a new entity
  22.             if (type === "entity") {
  23.                 // Get the values that will be replaced
  24.                 count = 0;
  25.                 alias = entityAlias.val();
  26.                 entity = entityName.val();
  27.                 value = propertyName.val();
  28.                 // Get the element witch the prototype will be appended
  29.                 properties = $('#entities > tbody');
  30.                 // Get the entity prototype
  31.                 prototype = $("#prototype-entity");
  32.                 // From new entities we need to add the modal for the joins
  33.                 let modalJoins = $($("#prototype-entity-joins")
  34.                     .clone()
  35.                     .html()
  36.                     .replace(/__alias__/g, alias)
  37.                     .replace(/prototype-join-column/g, "joins-" + alias));
  38.                 // At this point we don't have any join, so we remove the prototype table
  39.                 $(modalJoins).find("table").remove();
  40.                 // Add the modal to the form
  41.                 $("#modals").append(modalJoins);
  42.             } else if (type === "property") { // When the user add a new property
  43.                 // Get the values that will be replaced
  44.                 alias = $(elem).data("self");
  45.                 count = $(elem).data("count");
  46.                 value = propertyName.val();
  47.                 // Get the element witch the prototype will be appended
  48.                 properties = $('#{0}'.format(alias));
  49.                 // Get the property prototype
  50.                 prototype = $("#properties-prototype");
  51.                 // Update the count in add property button
  52.                 $('button[data-self="{0}"]'.format(alias)).data("count", count + 1);
  53.             } else if (type === "join-column") { // When the user add a new join column
  54.                 // Get the values that will be replaced
  55.                 alias = $(elem).data("self");
  56.                 count = $(elem).data("count");
  57.                 value = $(elem).data("value");
  58.                 // Get the element witch the prototype will be appended
  59.                 properties = $($(elem).data("father")).find("tbody");
  60.                 // Get the property prototype
  61.                 prototype = $("#prototype-join-column").find("tbody");
  62.             } else {
  63.                 return; // Probability this won't happen
  64.             }
  65.             if (type === "entity" || type === "property") {
  66.                 // From new entities we need to add the modal for the property additional information
  67.                 let modalPrototype = $("#prototype-entity-modal")
  68.                     .clone()
  69.                     .html()
  70.                     .replace(/__alias__/g, alias)
  71.                     .replace(/__name__/g, count)
  72.                     .replace(/__value__/g, propertyName.val())
  73.                     .replace(/disabled="disabled"/g, "");
  74.                 // Add the modal to the form
  75.                 $("#modals").append(modalPrototype);
  76.             }
  77.             prototype = prototype
  78.                 .clone() // Clone the prototype to maintain the original prototype
  79.                 .html() // Get only elements inside the prototype element
  80.                 // Apply the needed replaces
  81.                 .replace("properties-prototype", alias)
  82.                 .replace(/__alias__/g, alias)
  83.                 .replace(/__name__/g, count)
  84.                 .replace(/__value__/g, value)
  85.                 .replace(/__entity__/g, entity)
  86.                 // Remove the disabled property from fields
  87.                 .replace(/disabled="disabled"/g, "");
  88.             // Append the new element to the chosen element
  89.             properties.append($(prototype));
  90.             // Update the counter
  91.             $(elem).data("count", count + 1);
  92.             // Reset the fields
  93.             entityAlias.val("");
  94.             entityName.val("");
  95.             propertyName.val("");
  96.             // Close the modal
  97.             $("#button-close-modal").click();
  98.         }
  99.         function addJoin(value, alias, selector)
  100.         {
  101.             // Variables declaration
  102.             let prototype;
  103.             // Check if the join already exist
  104.             if ($(selector).length === 0) {
  105.                 // Get prototype for the join table
  106.                 prototype = $("#prototype-join-column")
  107.                     .clone()
  108.                     .html()
  109.                     .replace(/__alias__/g, alias)
  110.                     .replace(/__value__/g, value)
  111.                     .replace(/__name__/g, 0)
  112.                     .replace(/disabled="disabled"/g, "");
  113.                 // Append the table in the join modal body
  114.                 $("#joins-" + alias).append(prototype);
  115.                 return true;
  116.             }
  117.             return false;
  118.         }
  119.         function checkForm()
  120.         {
  121.             let alias, aux, column, count = 0, entities, index, join, prop, result, temp;
  122.             entities = $('td > [data-self][type="number"]');
  123.             for (aux of entities) {
  124.                 index = 0;
  125.                 prop = $('td > [data-father="{0}"][type="number"]'.format($(aux).val(count++).data("self")));
  126.                 for (temp of prop) { $(temp).val(index++); }
  127.             }
  128.             result = true;
  129.             for (aux of $("#entities * table > tbody")) {
  130.                 alias = aux.id;
  131.                 for (temp of $(aux).find("select")) {
  132.                     column = $(temp).parent().prev().find("input").val();
  133.                     join = "#join-{0}-{1}".format(alias, column);
  134.                     if ($(temp).val() === "entity") {
  135.                         result = result && (!addJoin(column, alias, join));
  136.                     } else {
  137.                         remove(join);
  138.                     }
  139.                     for (prop of $(join).find("input:not([hidden])")) {
  140.                         if ($(prop).val() === "") {
  141.                             result = false;
  142.                             break;
  143.                         }
  144.                     }
  145.                 }
  146.                 if (!result) {
  147.                     $('span[data-self="{0}"]'.format(aux.id)).click();
  148.                     break;
  149.                 }
  150.             }
  151.             if (result) { $("#prototypes").remove(); }
  152.             return result;
  153.         }
  154.         function checkJoins(elem)
  155.         {
  156.             let alias, column, join, select;
  157.             alias = $(elem).data("self");
  158.             for (select of $("#" + alias).find("select")) {
  159.                 column = $(select).parent().prev().find("input").val();
  160.                 join = "#join-{0}-{1}".format(alias, column);
  161.                 ($(select).val() === "entity") ? addJoin(column, alias, join) : remove(join);
  162.             }
  163.         }
  164.         function remove(selector)
  165.         { $(selector).remove(); }
  166.         function self_init()
  167.         {
  168.             $("#{{ form.actions.vars.id }}").selectize({
  169.                 labelField: "name",
  170.                 searchField: ["id", "name"],
  171.                 sortField: "name",
  172.                 valueField: "id"
  173.             });
  174.             $("tbody").sortable();
  175.         }
  176.         function showEntity()
  177.         {
  178.             $('[data-type="property"]').removeAttr("hidden");
  179.             $('[data-type="entity"]').removeAttr("hidden");
  180.             $("#button-add-prop").data("type", "entity");
  181.         }
  182.         function showProp(elem)
  183.         {
  184.             $('[data-type="entity"]').attr("hidden", true);
  185.             $('[data-type="property"]').removeAttr("hidden");
  186.             $("#button-add-prop")
  187.                 .data("count", $(elem).data("count"))
  188.                 .data("self", $(elem).data("self"))
  189.                 .data("type", "property");
  190.         }
  191.         $(document).ready(function () { self_init(); form_init(); });
  192.     </script>
  193. {% endblock %}
  194. {% block form %}
  195.     {{ form_start(form) }}
  196.     <div class="row mb-2 mx-auto">
  197.         <div class="col">
  198.             {{ form_widget(form.close) }}
  199.         </div>
  200.         <div class="col">
  201.             <button class="btn-primary form-control" data-bs-toggle="modal" data-bs-target="#modal-add-property" onclick="showEntity()" type="button">{{ "label.addEntity"|trans }}</button>
  202.         </div>
  203.         <div class="col">
  204.             {{ form_widget(form.save) }}
  205.         </div>
  206.     </div>
  207.     {{ form_row(form.namespace) }}
  208.     {{ form_row(form.platform) }}
  209.     {{ form_row(form.actions) }}
  210.     {{ form_row(form.alterFile) }}
  211.     {{ form_row(form.invert) }}
  212.     {{ form_row(form.test) }}
  213.     <div class="container">
  214.         <table id="entities" class="bg-light mb-5 table table-bordered text-center w-100">
  215.             <thead class="bg-light">
  216.             <tr>
  217.                 <th colspan="13">{{ "label.entity"|trans }}</th>
  218.             </tr>
  219.             <tr>
  220.                 <th>{{ "label.name"|trans }}</th>
  221.                 <th>{{ "label.type"|trans }}</th>
  222.                 <th class="text-truncate">{{ "label.isId"|trans }}</th>
  223.                 <th>{{ "label.unique.constraint"|trans }}</th>
  224.                 <th class="text-truncate">{{ "label.nullable"|trans }}</th>
  225.                 <th class="text-truncate">{{ "label.insertable"|trans }}</th>
  226.                 <th class="text-truncate">{{ "label.updatable"|trans }}</th>
  227.                 <th class="text-truncate">{{ "label.generated"|trans }}</th>
  228.                 <th>{{ "label.length"|trans }}</th>
  229.                 <th>{{ "label.precision"|trans }}</th>
  230.                 <th>{{ "label.scale"|trans }}</th>
  231.                 <th colspan="2">{{ "label.actions"|trans }}</th>
  232.             </tr>
  233.             </thead>
  234.             <tbody>
  235.             {% for alias, entity in entities %}
  236.                 <tr id="entity-{{ alias }}">
  237.                     <td colspan="13">
  238.                         <table class="align-middle mb-0 table table-bordered table-striped w-100">
  239.                             <thead>
  240.                             <tr id="{{ form.entity[alias].vars.id }}" class="bg-success bg-opacity-10">
  241.                                 <th><span class="material-icons px-2" role="button">unfold_more</span></th>
  242.                                 <th class="text-start" colspan="2">{{ entity.name }} [{{ alias }}]</th>
  243.                                 <td><span class="align-middle material-icons" data-bs-toggle="modal" data-bs-target="#modal-{{ form.entity[alias].joins.vars.id }}" data-self="{{ alias }}" onclick="checkJoins(this)" role="button">info</span></td>
  244.                                 <td colspan="5">
  245.                                     <button class="btn btn-primary px-3 py-0" data-count="{{ form.entity[alias].properties|length }}" data-bs-toggle="modal" data-bs-target="#modal-add-property" data-self="{{ alias }}" onclick="showProp(this)" type="button">{{ "label.addProperty"|trans }}</button>
  246.                                 </td>
  247.                                 <td colspan="2">
  248.                                     {{ form_widget(form.entity[alias].logger) }} <label for="{{ form.entity[alias].logger.vars.id }}">{{ "label.logger"|trans }}</label>
  249.                                 </td>
  250.                                 <td colspan="2">
  251.                                     {{ form_widget(form.entity[alias].generate) }} <label for="{{ form.entity[alias].generate.vars.id }}">{{ "label.generate"|trans }}</label>
  252.                                     {{ form_widget(form.entity[alias].name, {attr: {"data-self": alias, hidden: true}}) }}
  253.                                     {{ form_widget(form.entity[alias].order, {attr: {"data-self": alias}}) }}
  254.                                 </td>
  255.                                 <td>
  256.                                     <span class="align-middle material-icons" role="button" onclick="remove('#entity-{{ alias }}')">delete</span>
  257.                                 </td>
  258.                             </tr>
  259.                             </thead>
  260.                             <tbody id="{{ alias }}">
  261.                             {% for index in range(0, entity.properties|length - 1) %}
  262.                                 <tr id="{{ form.entity[alias].properties[index].vars.id }}" data-father="{{ alias }}">
  263.                                     <td>
  264.                                         <span class="material-icons px-2" role="button">unfold_more</span>
  265.                                         {{ form_widget(form.entity[alias].properties[index].order, {attr: {"data-father": alias}}) }}
  266.                                     </td>
  267.                                     <td>{{ form_widget(form.entity[alias].properties[index].name) }}</td>
  268.                                     <td>{{ form_widget(form.entity[alias].properties[index].type) }}</td>
  269.                                     <td class="px-2">
  270.                                         <label for="{{ form.entity[alias].properties[index].id.vars.id }}">{{ "label.isId"|trans }}</label>
  271.                                         {{ form_widget(form.entity[alias].properties[index].id) }}
  272.                                     </td>
  273.                                     <td>{{ form_widget(form.entity[alias].properties[index].unique) }}</td>
  274.                                     <td class="px-2">
  275.                                         <label for="{{ form.entity[alias].properties[index].nullable.vars.id }}">{{ "label.nullable.sort"|trans}}</label>
  276.                                         {{ form_widget(form.entity[alias].properties[index].nullable) }}
  277.                                     <td class="px-2">
  278.                                         <label for="{{ form.entity[alias].properties[index].insertable.vars.id }}">{{ "label.insertable.sort"|trans}}</label>
  279.                                         {{ form_widget(form.entity[alias].properties[index].insertable) }}
  280.                                     <td class="px-2">
  281.                                         <label for="{{ form.entity[alias].properties[index].updatable.vars.id }}">{{ "label.updatable.sort"|trans}}</label>
  282.                                         {{ form_widget(form.entity[alias].properties[index].updatable) }}
  283.                                     <td class="px-2">
  284.                                         <label for="{{ form.entity[alias].properties[index].generated.vars.id }}">{{ "label.generated.sort"|trans}}</label>
  285.                                         {{ form_widget(form.entity[alias].properties[index].generated) }}
  286.                                     </td>
  287.                                     <td class="w-number">{{ form_widget(form.entity[alias].properties[index].length) }}</td>
  288.                                     <td class="w-number">{{ form_widget(form.entity[alias].properties[index].precision) }}</td>
  289.                                     <td class="w-number">{{ form_widget(form.entity[alias].properties[index].scale) }}</td>
  290.                                     <td><span class="align-middle material-icons" data-bs-toggle="modal" data-bs-target="#modal-{{ form.entity[alias].properties[index].vars.id }}" role="button">info</span></td>
  291.                                     <td><span class="align-middle material-icons" role="button" onclick="remove('#{{ form.entity[alias].properties[index].vars.id }}')">delete</span></td>
  292.                                 </tr>
  293.                             {% endfor %}
  294.                             </tbody>
  295.                         </table>
  296.                     </td>
  297.                 </tr>
  298.             {% endfor %}
  299.             </tbody>
  300.         </table>
  301.     </div>
  302.     <div id="modals">
  303.         {% for alias, entity in entities %}
  304.             {% for index in range(0, entity.properties|length - 1) %}
  305.                 <div class="modal" id="modal-{{ form.entity[alias].properties[index].vars.id }}" tabindex="-1" aria-hidden="true">
  306.                     <div class="modal-dialog modal-xl">
  307.                         <div class="modal-content">
  308.                             <div class="modal-header">
  309.                                 <h5 class="modal-title">{{ alias }}.{{ form.entity[alias].properties[index].name.vars.value }}</h5>
  310.                                 <button type="button" class="btn-close" data-bs-dismiss="modal" aria-label="Close"></button>
  311.                             </div>
  312.                             <div class="modal-body">
  313.                                 <div class="container">
  314.                                     <div class="row mb-2 mx-auto">
  315.                                         <div class="col-3">
  316.                                             <label class="form-control bg-dark text-center text-light" for="{{ form.entity[alias].properties[index].columnDefinition.vars.id }}">{{ "label.columnDefinition"|trans }}</label>
  317.                                         </div>
  318.                                         <div class="col-9">
  319.                                             {{ form_widget(form.entity[alias].properties[index].columnDefinition) }}
  320.                                         </div>
  321.                                     </div>
  322.                                     <div class="row mb-2 mx-auto">
  323.                                         <div class="col-3">
  324.                                             <label class="form-control bg-dark text-center text-light" for="{{ form.entity[alias].properties[index].externalAlias.vars.id }}">{{ "label.externalAlias"|trans }}</label>
  325.                                         </div>
  326.                                         <div class="col-9">
  327.                                             {{ form_widget(form.entity[alias].properties[index].externalAlias) }}
  328.                                         </div>
  329.                                     </div>
  330.                                 </div>
  331.                                 {{ form_widget(form.entity[alias].properties[index].options) }}
  332.                             </div>
  333.                         </div>
  334.                     </div>
  335.                 </div>
  336.             {% endfor %}
  337.             <div class="modal" id="modal-{{ form.entity[alias].joins.vars.id }}" tabindex="-1" aria-hidden="true">
  338.                 <div class="modal-dialog modal-xl">
  339.                     <div class="modal-content">
  340.                         <div class="modal-header">
  341.                             <h5 class="modal-title">{{ alias }}.{{ form.entity[alias].joins.vars.name }}</h5>
  342.                             <button type="button" class="btn-close" data-bs-dismiss="modal" aria-label="Close"></button>
  343.                         </div>
  344.                         <div id="joins-{{ alias }}" class="modal-body">
  345.                             {% for join in form.entity[alias].joins %}
  346.                                 <table id="join-{{ alias }}-{{ join.vars.name }}" class="table table-bordered table-striped w-100">
  347.                                     <thead>
  348.                                     <tr>
  349.                                         <th class="text-center" colspan="11">{{ join.vars.name }}</th>
  350.                                         <th class="text-center"><span class="align-middle material-icons" role="button" onclick="remove('#join-{{ alias }}-{{ join.vars.name }}')">delete</span></th>
  351.                                     </tr>
  352.                                     <tr>
  353.                                         <td class="align-middle text-center" rowspan="2">#</td>
  354.                                         <th class="align-middle text-center" colspan="5">{{ "label.targetEntity"|trans }}</th>
  355.                                         <th colspan="5">
  356.                                             {{ form_widget(join.targetEntity) }}
  357.                                         </th>
  358.                                         <th>
  359.                                             <button class="btn btn-primary w-100" data-count="{{ join.columns|length }}" data-father="#join-{{ alias }}-{{ join.vars.name }}" data-self="{{ alias }}" data-type="join-column" data-value="{{ join.vars.name }}" onclick="add(this)" type="button">+</button>
  360.                                         </th>
  361.                                     </tr>
  362.                                     <tr>
  363.                                         <td class="align-middle text-center" colspan="5">{{ "label.localColumnName"|trans }}</td>
  364.                                         <td class="align-middle text-center" colspan="6">{{ "label.referencedColumnName"|trans }}</td>
  365.                                     </tr>
  366.                                     </thead>
  367.                                     <tbody>
  368.                                     {% for column in join.columns %}
  369.                                         <tr id="{{ column.vars.id }}">
  370.                                             <td class="align-middle text-center">{{ column.vars.name }}</td>
  371.                                             <td colspan="5">
  372.                                                 {{ form_widget(column.localColumnName) }}
  373.                                             </td>
  374.                                             <td colspan="5">
  375.                                                 {{ form_widget(column.referencedColumnName) }}
  376.                                             </td>
  377.                                             <td>
  378.                                                 <button class="btn btn-danger w-100" data-count="{{ join.columns|length }}" data-father="#join-{{ alias }}-{{ join.vars.name }}" data-self="{{ alias }}" data-type="join-column" data-value="{{ join.vars.name }}" onclick="remove('#{{ column.vars.id }}')" type="button">-</button>
  379.                                             </td>
  380.                                         </tr>
  381.                                     {% endfor %}
  382.                                     </tbody>
  383.                                 </table>
  384.                             {% endfor %}
  385.                         </div>
  386.                     </div>
  387.                 </div>
  388.             </div>
  389.         {% endfor %}
  390.     </div>
  391.     <div id="prototypes" hidden="hidden">
  392.         <table>
  393.             <tbody id="prototype-entity">
  394.             <tr>
  395.                 <td colspan="13">
  396.                     <table class="align-middle mb-0 table table-bordered table-striped w-100">
  397.                         <thead>
  398.                         <tr id="{{ form.entity.vars.prototype.vars.id }}" class="bg-success bg-opacity-10">
  399.                             <th><span class="material-icons px-2" role="button">unfold_more</span></th>
  400.                             <th class="text-start" colspan="2">__entity__ [__alias__]</th>
  401.                             <td><span class="align-middle material-icons" data-bs-toggle="modal" data-bs-target="#modal-{{ form.entity.vars.prototype.joins.vars.id }}" data-self="__alias__" onclick="checkJoins(this)" role="button">info</span></td>
  402.                             <td colspan="5">
  403.                                 <button class="btn btn-primary px-3 py-0" data-count="1" data-bs-toggle="modal" data-bs-target="#modal-add-property" data-self="__alias__" onclick="showProp(this)" type="button">{{ "label.addProperty"|trans }}</button>
  404.                             </td>
  405.                             <td colspan="3">
  406.                                 {{ form_widget(form.entity.vars.prototype.logger) }} <label for="{{ form.entity.vars.prototype.logger.vars.id }}">{{ "label.logger"|trans }}</label>
  407.                             </td>
  408.                             <td colspan="2">
  409.                                 {{ form_widget(form.entity.vars.prototype.generate) }} <label for="{{ form.entity.vars.prototype.generate.vars.id }}">{{ "label.generate"|trans }}</label>
  410.                                 {{ form_widget(form.entity.vars.prototype.name, {attr: {"data-self": "__alias__", hidden: true, value: "__entity__"}}) }}
  411.                                 {{ form_widget(form.entity.vars.prototype.order, {attr: {"data-self": "__alias__"}}) }}
  412.                             </td>
  413.                         </tr>
  414.                         </thead>
  415.                         <tbody id="properties-prototype">
  416.                         <tr id="{{ form.entity.vars.prototype.properties.vars.prototype.vars.id }}" data-father="__alias__">
  417.                             <td>
  418.                                 <span class="material-icons px-2" role="button">unfold_more</span>
  419.                                 {{ form_widget(form.entity.vars.prototype.properties.vars.prototype.order, {attr: {"data-father": "__alias__"}}) }}
  420.                             </td>
  421.                             <td>{{ form_widget(form.entity.vars.prototype.properties.vars.prototype.name, {attr: {disabled: true, value: "__value__"}}) }}</td>
  422.                             <td>{{ form_widget(form.entity.vars.prototype.properties.vars.prototype.type, {attr: {disabled: true}}) }}</td>
  423.                             <td class="px-2">
  424.                                 <label for="{{ form.entity.vars.prototype.properties.vars.prototype.nullable.vars.id }}">{{ "label.isId"|trans }}</label>
  425.                                 {{ form_widget(form.entity.vars.prototype.properties.vars.prototype.id) }}
  426.                             </td>
  427.                             <td>{{ form_widget(form.entity.vars.prototype.properties.vars.prototype.unique) }}</td>
  428.                             <td class="px-2">
  429.                                 <label for="{{ form.entity.vars.prototype.properties.vars.prototype.nullable.vars.id }}">{{ "label.nullable.sort"|trans}}</label>
  430.                                 {{ form_widget(form.entity.vars.prototype.properties.vars.prototype.nullable) }}
  431.                             <td class="px-2">
  432.                                 <label for="{{ form.entity.vars.prototype.properties.vars.prototype.insertable.vars.id }}">{{ "label.insertable.sort"|trans}}</label>
  433.                                 {{ form_widget(form.entity.vars.prototype.properties.vars.prototype.insertable) }}
  434.                             <td class="px-2">
  435.                                 <label for="{{ form.entity.vars.prototype.properties.vars.prototype.updatable.vars.id }}">{{ "label.updatable.sort"|trans}}</label>
  436.                                 {{ form_widget(form.entity.vars.prototype.properties.vars.prototype.updatable) }}
  437.                             <td class="px-2">
  438.                                 <label for="{{ form.entity.vars.prototype.properties.vars.prototype.generated.vars.id }}">{{ "label.generated.sort"|trans}}</label>
  439.                                 {{ form_widget(form.entity.vars.prototype.properties.vars.prototype.generated) }}
  440.                             </td>
  441.                             <td class="w-number">{{ form_widget(form.entity.vars.prototype.properties.vars.prototype.length) }}</td>
  442.                             <td class="w-number">{{ form_widget(form.entity.vars.prototype.properties.vars.prototype.precision) }}</td>
  443.                             <td class="w-number">{{ form_widget(form.entity.vars.prototype.properties.vars.prototype.scale) }}</td>
  444.                             <td><span class="align-middle material-icons" data-bs-toggle="modal" data-bs-target="#modal-{{ form.entity.vars.prototype.properties.vars.prototype.vars.id }}" role="button">info</span></td>
  445.                             <td><span class="align-middle material-icons" role="button" onclick="remove('#{{ form.entity.vars.prototype.properties.vars.prototype.vars.id }}')">delete</span></td>
  446.                         </tr>
  447.                         </tbody>
  448.                     </table>
  449.                 </td>
  450.             </tr>
  451.             </tbody>
  452.         </table>
  453.         <div id="prototype-entity-modal" hidden="hidden">
  454.             <div id="modal-{{ form.entity.vars.prototype.properties.vars.id }}___name__" class="modal" tabindex="-1" aria-hidden="true">
  455.                 <div class="modal-dialog modal-xl">
  456.                     <div class="modal-content">
  457.                         <div class="modal-header">
  458.                             <h5 class="modal-title">__alias__.__value__</h5>
  459.                             <button type="button" class="btn-close" data-bs-dismiss="modal" aria-label="Close"></button>
  460.                         </div>
  461.                         <div class="modal-body">
  462.                             <div class="container">
  463.                                 <div class="row mb-2 mx-auto">
  464.                                     <div class="col-3">
  465.                                         <label class="form-control bg-dark text-center text-light" for="{{ form.entity.vars.prototype.properties.vars.prototype.columnDefinition.vars.id }}___name__">{{ "label.columnDefinition"|trans }}</label>
  466.                                     </div>
  467.                                     <div class="col-9">
  468.                                         {{ form_widget(form.entity.vars.prototype.properties.vars.prototype.columnDefinition, {attr: {"disabled": true}}) }}
  469.                                     </div>
  470.                                 </div>
  471.                             </div>
  472.                             {{ form_widget(form.entity.vars.prototype.properties.vars.prototype.options, {attr: {"disabled": true}}) }}
  473.                         </div>
  474.                     </div>
  475.                 </div>
  476.             </div>
  477.         </div>
  478.         <div id="prototype-entity-joins">
  479.             <div id="modal-{{ form.entity.vars.prototype.joins.vars.id }}" class="modal" tabindex="-1" aria-hidden="true">
  480.                 <div class="modal-dialog modal-xl">
  481.                     <div class="modal-content">
  482.                         <div class="modal-header">
  483.                             <h5 class="modal-title">__alias__.joins</h5>
  484.                             <button type="button" class="btn-close" data-bs-dismiss="modal" aria-label="Close"></button>
  485.                         </div>
  486.                         <div id="prototype-join-column" class="modal-body">
  487.                             <table id="join-__alias__-__value__" class="table table-bordered table-striped w-100">
  488.                                 <thead>
  489.                                 <tr>
  490.                                     <th class="text-center" colspan="11">__value__</th>
  491.                                     <th class="text-center"><span class="align-middle material-icons" role="button" onclick="remove('#join-__alias__-__value__')">delete</span></th>
  492.                                 </tr>
  493.                                 <tr>
  494.                                     <th class="align-middle text-center" rowspan="2">#</th>
  495.                                     <th class="align-middle text-center" colspan="5">{{ "label.targetEntity"|trans }}</th>
  496.                                     <th colspan="5">
  497.                                         {{ form_widget(form.entity.vars.prototype.joins.vars.prototype.targetEntity, {attr: {disabled: true}}) }}
  498.                                     </th>
  499.                                     <th>
  500.                                         <button class="btn btn-primary w-100" data-count="1" data-father="#join-__alias__-__value__" data-self="__alias__" data-type="join-column" data-value="__value__" onclick="add(this)" type="button">+</button>
  501.                                     </th>
  502.                                 </tr>
  503.                                 <tr>
  504.                                     <td class="align-middle text-center" colspan="5">{{ "label.localColumnName"|trans }}</td>
  505.                                     <td class="align-middle text-center" colspan="6">{{ "label.referencedColumnName"|trans }}</td>
  506.                                 </tr>
  507.                                 </thead>
  508.                                 <tbody>
  509.                                 <tr id="{{ form.entity.vars.prototype.joins.vars.prototype.columns.vars.id }}___name__">
  510.                                     <td class="align-middle text-center">__name__</td>
  511.                                     <td colspan="5">
  512.                                         {{ form_widget(form.entity.vars.prototype.joins.vars.prototype.columns.vars.prototype.localColumnName, {attr: {disabled: true}}) }}
  513.                                     </td>
  514.                                     <td colspan="5">
  515.                                         {{ form_widget(form.entity.vars.prototype.joins.vars.prototype.columns.vars.prototype.referencedColumnName, {attr: {disabled: true}}) }}
  516.                                     </td>
  517.                                     <td>
  518.                                         <button class="btn btn-danger w-100" data-count="1" data-father="#join-__alias__-__value__" data-self="__alias__" data-type="join-column" data-value="__value__" onclick="remove('#{{ form.entity.vars.prototype.joins.vars.prototype.columns.vars.id }}___name__')" type="button">-</button>
  519.                                     </td>
  520.                                 </tr>
  521.                                 </tbody>
  522.                             </table>
  523.                         </div>
  524.                     </div>
  525.                 </div>
  526.             </div>
  527.         </div>
  528.     </div>
  529.     <div id="modal-add-property" class="modal" tabindex="-1" aria-hidden="true">
  530.         <div class="modal-dialog modal-xl">
  531.             <div class="modal-content">
  532.                 <div class="modal-header">
  533.                     <h5 class="modal-title">{{ "label.addProperty"|trans }}</h5>
  534.                     <button type="button" class="btn-close" data-bs-dismiss="modal" aria-label="Close"></button>
  535.                 </div>
  536.                 <div class="modal-body">
  537.                     <div class="row mb-2 mx-auto" data-type="entity" hidden="hidden">
  538.                         <div class="col-3">
  539.                             <label class="form-control bg-dark text-light text-center" for="entity-alias">{{ "label.alias"|trans }}</label>
  540.                         </div>
  541.                         <div class="col-9">
  542.                             <input id="entity-alias" class="form-control" type="text" />
  543.                         </div>
  544.                     </div>
  545.                     <div class="row mb-2 mx-auto" data-type="entity" hidden="hidden">
  546.                         <div class="col-3">
  547.                             <label class="form-control bg-dark text-light text-center" for="entity-name">{{ "label.entity"|trans }}</label>
  548.                         </div>
  549.                         <div class="col-9">
  550.                             <input id="entity-name" class="form-control" type="text" />
  551.                         </div>
  552.                     </div>
  553.                     <div class="row mb-2 mx-auto" data-type="property" hidden="hidden">
  554.                         <div class="col-3">
  555.                             <label class="form-control bg-dark text-light text-center" for="property-name">{{ "label.property.name"|trans }}</label>
  556.                         </div>
  557.                         <div class="col-9">
  558.                             <input id="property-name" class="form-control" type="text" />
  559.                         </div>
  560.                     </div>
  561.                 </div>
  562.                 <div class="modal-footer">
  563.                     <button id="button-close-modal" type="button" class="btn btn-secondary" data-bs-dismiss="modal">{{ "button.close"|trans }}</button>
  564.                     <button id="button-add-prop" type="button" class="btn btn-success" data-self="" onclick="add(this)">{{ "button.save"|trans }}</button>
  565.                 </div>
  566.             </div>
  567.         </div>
  568.     </div>
  569.     {{ form_end(form) }}
  570. {% endblock %}