src/templates/ProcesoReclutamiento/testPreguntas.html.twig line 1

Open in your IDE?
  1. <div class="row">
  2.     <div class="col-xs-12">
  3.         <table id="table_test_psicologico" class="table table-striped table-bordered table-hover">
  4.             <thead>
  5.                 <tr>
  6.                     <th style="width: 150px">
  7.                         Tipo
  8.                     </th>
  9.                     <th>
  10.                         Nombre
  11.                     </th>
  12.                     <th style="width: 130px">
  13.                         Riesgo Bajo
  14.                     </th>
  15.                     <th style="width: 130px">
  16.                         Riesgo Medio
  17.                     </th>
  18.                     <th style="width: 130px">
  19.                         Riesgo Alto
  20.                     </th>
  21.                     <th style="width: 105px">
  22.                         Tipo Pregunta
  23.                     </th>
  24.                     <th style="width: 75px">
  25.                         Acciones
  26.                     </th>
  27.                 </tr>
  28.             </thead>
  29.             <tbody>
  30.                 {% for sistemaId, sistema in preguntas %}
  31.                     <tr id="S-{{ sistemaId }}" parentId="" data-tt-id="S-{{ sistemaId }}" data-tt-parent-id="">
  32.                         <td>
  33.                             SISTEMA
  34.                         </td>
  35.                         <td>
  36.                             <input field="nombre" type="text" class="editable" value="{{ sistema.nombre }}" old_value="{{ sistema.nombre }}" style="width: 100%;">    
  37.                         </td>
  38.                         <td colspan="4"></td>
  39.                         <td>
  40.                             <div class="pull-left action-buttons">
  41.                                 <nobr>
  42.                                     <a class="save save_sistema hide" href="">
  43.                                         <i class="fas fa-save blue bigger-150" title="Guardar"></i>
  44.                                     </a>
  45.                                     <a class="cancel hide" href="">
  46.                                         <i class="fas fa-ban red bigger-150" title="Cancelar"></i>
  47.                                     </a>
  48.                                     <a class="new_eje" href="">
  49.                                         <i class="fas fa-plus green bigger-150" title="Nuevo eje"></i>
  50.                                     </a>
  51.                                     <a class="delete delete_sistema" href="">
  52.                                         <i class="fas fa-trash red bigger-150" title="Eliminar"></i>
  53.                                     </a>
  54.                                 </nobr>
  55.                             </div>
  56.                         </td>
  57.                     </tr>
  58.                     {% if sistema.ejes is defined %}
  59.                         {% for ejeId, eje in sistema.ejes %}
  60.                             <tr id="E-{{ ejeId }}" parentId="S-{{ sistemaId }}" data-tt-id="E-{{ ejeId }}" data-tt-parent-id="S-{{ sistemaId }}">
  61.                                 <td>
  62.                                     EJE
  63.                                 </td>
  64.                                 <td>
  65.                                     <input field="nombre" type="text" class="editable" value="{{ eje.nombre }}" old_value="{{ eje.nombre }}" style="width: 100%;">    
  66.                                 </td>
  67.                                 <td colspan="4"></td>
  68.                                 <td>
  69.                                     <div class="pull-left action-buttons">
  70.                                         <nobr>
  71.                                             <a class="save save_eje hide" href="">
  72.                                                 <i class="fas fa-save blue bigger-150" title="Guardar"></i>
  73.                                             </a>
  74.                                             <a class="cancel hide" href="">
  75.                                                 <i class="fas fa-ban red bigger-150" title="Cancelar"></i>
  76.                                             </a>
  77.                                             <a class="new_criterio" href="">
  78.                                                 <i class="fas fa-plus green bigger-150" title="Nuevo criterio"></i>
  79.                                             </a>
  80.                                             <a class="delete delete_eje" href="">
  81.                                                 <i class="fas fa-trash red bigger-150" title="Eliminar"></i>
  82.                                             </a>
  83.                                         </nobr>
  84.                                     </div>
  85.                                 </td>
  86.                             </tr>
  87.                             {% if eje.criterios is defined %}
  88.                                 {% for criterioId, criterio in eje.criterios %}
  89.                                     <tr id="C-{{ criterioId }}" parentId="E-{{ ejeId }}" data-tt-id="C-{{ criterioId }}" data-tt-parent-id="E-{{ ejeId }}">
  90.                                         <td>
  91.                                             CRITERIO
  92.                                         </td>
  93.                                         <td>
  94.                                             <input field="nombre" type="text" class="editable" value="{{ criterio.criterio.nombre }}" old_value="{{ criterio.criterio.nombre }}" style="width: 100%;">
  95.                                         </td>
  96.                                         <td>
  97.                                             <input field="riesgoBajoDesde" type="text" class="editable" style="width: 50px;" value="{{ criterio.criterio.riesgoBajoDesde }}" old_value="{{ criterio.criterio.riesgoBajoDesde }}">&nbsp;a&nbsp;<input field="riesgoBajoHasta" type="text" class="editable" style="width: 50px;" value="{{ criterio.criterio.riesgoBajoHasta }}" old_value="{{ criterio.criterio.riesgoBajoHasta }}">
  98.                                         </td>
  99.                                         <td>
  100.                                             <input field="riesgoMedioDesde" type="text" class="editable" style="width: 50px;" value="{{ criterio.criterio.riesgoMedioDesde }}" old_value="{{ criterio.criterio.riesgoMedioDesde }}">&nbsp;a&nbsp;<input field="riesgoMedioHasta" type="text" class="editable" style="width: 50px;" value="{{ criterio.criterio.riesgoMedioHasta }}" old_value="{{ criterio.criterio.riesgoMedioHasta }}">
  101.                                         </td>
  102.                                         <td>
  103.                                             <input field="riesgoAltoDesde" type="text" class="editable" style="width: 50px;" value="{{ criterio.criterio.riesgoAltoDesde }}" old_value="{{ criterio.criterio.riesgoAltoDesde }}">&nbsp;a&nbsp;<input field="riesgoAltoHasta" type="text" class="editable" style="width: 50px;" value="{{ criterio.criterio.riesgoAltoHasta }}" old_value="{{ criterio.criterio.riesgoAltoHasta }}">
  104.                                         </td>
  105.                                         <td></td>
  106.                                         <td>
  107.                                             <div class="pull-left action-buttons">
  108.                                                 <nobr>
  109.                                                     <a class="save save_criterio hide" href="">
  110.                                                         <i class="fas fa-save blue bigger-150" title="Guardar"></i>
  111.                                                     </a>
  112.                                                     <a class="cancel hide" href="">
  113.                                                         <i class="fas fa-ban red bigger-150" title="Cancelar"></i>
  114.                                                     </a>
  115.                                                     <a class="new_pregunta" href="">
  116.                                                         <i class="fas fa-plus green bigger-150" title="Nueva pregunta"></i>
  117.                                                     </a>
  118.                                                     <a class="delete delete_criterio" href="">
  119.                                                         <i class="fas fa-trash red bigger-150" title="Eliminar"></i>
  120.                                                     </a>
  121.                                                 </nobr>
  122.                                             </div>
  123.                                         </td>
  124.                                     </tr>
  125.                                     {% if criterio.preguntas is defined %}
  126.                                         {% for pregunta in criterio.preguntas %}
  127.                                             <tr id="P-{{ pregunta.id }}" parentId="C-{{ criterioId }}" data-tt-id="P-{{ pregunta.id }}" data-tt-parent-id="C-{{ criterioId }}">
  128.                                                 <td>
  129.                                                     PREGUNTA
  130.                                                 </td>
  131.                                                 <td>
  132.                                                     <input field="nombre" type="text" class="editable" value="{{ pregunta.nombre }}" old_value="{{ pregunta.nombre }}" style="width: 100%;">    
  133.                                                 </td>
  134.                                                 <td colspan="3"></td>
  135.                                                 <td>
  136.                                                     <select field="tipo" class="editable" style="width: 100%" old_value="{{ pregunta.tipo }}">
  137.                                                         <option value="directo" {% if pregunta.tipo=='directo' %}selected="true"{% endif %}>Directa</option>
  138.                                                         <option value="inverso" {% if pregunta.tipo=='inverso' %}selected="true"{% endif %}>Inversa</option>
  139.                                                     </select>
  140.                                                 </td>
  141.                                                 <td>
  142.                                                     <div class="pull-left action-buttons">
  143.                                                         <nobr>
  144.                                                             <a class="save save_pregunta hide" href="">
  145.                                                                 <i class="fas fa-save blue bigger-150" title="Guardar"></i>
  146.                                                             </a>
  147.                                                             <a class="cancel hide" href="">
  148.                                                                 <i class="fas fa-ban red bigger-150" title="Cancelar"></i>
  149.                                                             </a>
  150.                                                             <a class="delete delete_pregunta" href="">
  151.                                                                 <i class="fas fa-trash red bigger-150" title="Eliminar"></i>
  152.                                                             </a>
  153.                                                         </nobr>
  154.                                                     </div>
  155.                                                 </td>
  156.                                             </tr>
  157.                                         {% endfor %}
  158.                                     {% endif %}
  159.                                 {% endfor %}
  160.                             {% endif %}
  161.                         {% endfor %}
  162.                     {% endif %}
  163.                 {% endfor%}
  164.             </tbody>
  165.         </table>
  166.     </div>
  167. </div>
  168.         
  169. <script type="text/javascript">
  171.     var nuevoSistema = {{ maxSistema + 1 }};
  172.     var nuevoEje = {{ maxEje + 1 }};
  173.     var nuevoCriterio = {{ maxCriterio + 1 }};
  174.     var nuevaPregunta = {{ maxPregunta + 1 }};
  176.     $(function()
  177.     {
  178.         
  179.         $('input.editable').keyup(function(){
  180.             editableChange(this);
  181.         });
  182.         
  183.         $('select.editable').change(function(){
  184.             editableChange(this);
  185.         });
  186.         
  187.         $('.save').click(function(e){
  188.             e.preventDefault();
  189.             clickSave(this);
  190.         });
  192.         $('.cancel').click(function(e){
  193.             e.preventDefault();
  194.             clickCancel(this);
  195.         });
  196.         
  197.         $('.delete').click(function(e){
  198.             e.preventDefault();
  199.             clickDelete(this);
  200.         });
  201.         
  202.         $('.new_eje').click(function(e){
  203.             e.preventDefault();
  204.             clickNewEje(this);
  205.         });
  207.         $('.new_criterio').click(function(e){
  208.             e.preventDefault();
  209.             clickNewCriterio(this);
  210.         });
  212.         $('.new_pregunta').click(function(e){
  213.             e.preventDefault();
  214.             clickNewPregunta(this);
  215.         });
  216.         
  217.     });
  218.     
  219.     function clickSave(elemento)
  220.     {
  221.         var tr = $(elemento).parents('tr');
  222.         tr.find('.alert').remove();
  223.         var trId = tr.attr('id');
  224.         var trParentId = tr.attr('parentId');
  225.         $('#form_save_id').val(trId);
  226.         $('#form_save_parent').val(trParentId);
  227.         tr.find('.editable').each(function(){
  228.             var field = $(this).attr('field');
  229.             $('#form_save_'+field).val($(this).val());
  230.         });
  231.         
  232.         tr.mask('&nbsp;&nbsp;&nbsp;&nbsp;Guardaando...');
  233.         $('#form_save').ajaxSubmit({
  234.             type: $('form_save').attr('method'),
  235.             url: $('form_save').attr('action'),
  236.             dataType: 'json',
  237.             data: { _xml_http_request: true },
  238.             success: function(result) {
  239.                 var tr = $('#'+result.id);
  240.                 tr.unmask();
  241.                 if (!result.ok)
  242.                 {
  243.                     var s = $('#save_alert').prop("outerHTML");
  244.                     tr.find("td").eq(1).prepend(s);
  245.                 }
  246.                 else
  247.                 {
  248.                     if (result.newElement)
  249.                     {
  250.                         tr.attr('id', result.newId);
  251.                         $("tr[parentId='"+result.id+"']").attr('parentId', result.newId);
  252.                     }
  253.                     tr.find('.save').addClass('hide');
  254.                     tr.find('.cancel').addClass('hide');
  255.                 }
  256.             }
  257.         })
  258.     }
  259.     
  260.     function clickCancel(elemento)
  261.     {
  262.         var tr = $(elemento).parents('tr');
  263.         tr.find('.editable').each(function(){
  264.             $(this).val($(this).attr('old_value'));
  265.         });
  266.         tr.find('.save').addClass('hide');
  267.         tr.find('.cancel').addClass('hide');
  268.         tr.find('.alert').remove();
  269.     }
  270.     
  271.     function clickDelete(elemento)
  272.     {
  273.         var tr = $(elemento).parents('tr');
  274.         tr.find('.alert').remove();
  275.         var trId = tr.attr('id');
  276.         var nTrId = trId.replace('N-', '');
  277.         if (trId == nTrId) //No era uno nuevo. Hay que borrar de la bd
  278.         {
  279.             tr.mask('&nbsp;&nbsp;&nbsp;&nbsp;Eliminando...');
  280.             if ($(elemento).hasClass('delete_sistema'))
  281.             {
  282.                 deleteTestElement('sistema', trId);
  283.             }
  284.             else
  285.             if ($(elemento).hasClass('delete_eje'))
  286.             {
  287.                 deleteTestElement('eje', trId);
  288.             }
  289.             else
  290.             if ($(elemento).hasClass('delete_criterio'))
  291.             {
  292.                 deleteTestElement('criterio', trId);
  293.             }
  294.             else
  295.             {
  296.                 deleteTestElement('pregunta', trId);
  297.             }
  298.         }
  299.         else
  300.         {
  301.             trId = tr.attr('data-tt-id');
  302.             $('#table_test_psicologico').treetable('removeNode',  trId);
  303.         }
  304.     }
  306.     function editableChange(elemento)
  307.     {
  308.         var tr = $(elemento).parents('tr');
  309.         tr.find('.save').removeClass('hide');
  310.         tr.find('.cancel').removeClass('hide');
  311.     }
  312.     
  313.     function clickNewEje(elemento)
  314.     {
  315.         var tr = $(elemento).parents('tr');
  316.         var sistemaPadreId = tr.attr('data-tt-id');
  318.         var s = $('#N-E-NUEVO-EJE').prop("outerHTML");
  319.         s=s.replaceAll('PARENT-ID', sistemaPadreId);
  320.         s=s.replaceAll('NUEVO-EJE', nuevoEje);
  322.         var node = $("#table_test_psicologico").treetable("node", sistemaPadreId);
  324.         $("#table_test_psicologico").treetable("loadBranch", node, s);
  326.         bindButtons('N-E-'+nuevoEje);
  327.         
  328.         nuevoEje++;
  329.     }
  330.         
  331.     function clickNewCriterio(elemento)
  332.     {
  333.         var tr = $(elemento).parents('tr');
  334.         var ejePadreId = tr.attr('data-tt-id');
  335.         
  336.         var s = $('#N-C-NUEVO-CRITERIO').prop("outerHTML");
  337.         s=s.replaceAll('PARENT-ID', ejePadreId);
  338.         s=s.replaceAll('NUEVO-CRITERIO', nuevoCriterio);
  340.         var node = $("#table_test_psicologico").treetable("node", ejePadreId);
  342.         $("#table_test_psicologico").treetable("loadBranch", node, s);
  344.         bindButtons('N-C-'+nuevoCriterio);
  345.         
  346.         nuevoCriterio++;
  347.     }
  348.         
  349.     function clickNewPregunta(elemento)
  350.     {
  351.         var tr = $(elemento).parents('tr');
  352.         var criterioPadreId = tr.attr('data-tt-id');
  353.         
  354.         var s = $('#N-P-NUEVA-PREGUNTA').prop("outerHTML");
  355.         s=s.replaceAll('PARENT-ID', criterioPadreId);
  356.         s=s.replaceAll('NUEVA-PREGUNTA', nuevaPregunta);
  358.         var node = $("#table_test_psicologico").treetable("node", criterioPadreId);
  360.         $("#table_test_psicologico").treetable("loadBranch", node, s);
  362.         bindButtons('N-P-'+nuevaPregunta);
  363.         
  364.         nuevaPregunta++;
  365.     }
  366.         
  367.     function bindButtons(trId)
  368.     {
  369.         $('#'+trId).find('.save').click(function(e){
  370.             e.preventDefault();
  371.             clickSave(this);
  372.         });
  374.         $('#'+trId).find('.cancel').click(function(e){
  375.             e.preventDefault();
  376.             clickCancel(this);
  377.         });
  379.         $('#'+trId).find('.delete').click(function(e){
  380.             e.preventDefault();
  381.             clickDelete(this);
  382.         });
  384.         $('#'+trId).find('input.editable').keyup(function(){
  385.             editableChange(this);
  386.         });
  388.         $('#'+trId).find('select.editable').change(function(){
  389.             editableChange(this);
  390.         });
  392.         $('#'+trId).find('.new_eje').click(function(e){
  393.             e.preventDefault();
  394.             clickNewEje(this);
  395.         });
  397.         $('#'+trId).find('.new_criterio').click(function(e){
  398.             e.preventDefault();
  399.             clickNewCriterio(this);
  400.         });
  402.         $('#'+trId).find('.new_pregunta').click(function(e){
  403.             e.preventDefault();
  404.             clickNewPregunta(this);
  405.         });
  407.     }
  408.     
  409.     function deleteTestElement(tipo, id)
  410.     {
  411.         var url = "{{ path('delete_test_element', {'tipo': '__TIPO__', 'id': '__ID__'}) }}";
  412.         url=url.replace('__TIPO__', tipo);
  413.         url=url.replace('__ID__', id);
  414.         $.getJSON(url , function(result){
  415.             var tr = $('#'+result.id);
  416.             if (!result.ok)
  417.             {
  418.                 var s = $('#delete_alert').prop("outerHTML");
  419.                 tr.unmask();
  420.                 tr.find("td").eq(1).prepend(s);
  421.             }
  422.             else
  423.             {
  424.                 var data_tt_id = tr.attr('data-tt-id');
  425.                 $('#table_test_psicologico').treetable('removeNode', data_tt_id );
  426.             }
  427.         });
  428.     }
  429.         
  430. </script>