{% extends "common/auth_page.twig" %}

{% block contentTitle %}{{'management-lines'|trans}}{% endblock %}

{% block content %}

  <table id="linesTable" class="display" style="width:100%">
    <thead>
      <tr>
        <th>{{'name'|trans}}</th>
        <th>{{'color'|trans}}</th>
        <th>{{'take-away'|trans}}</th>
        <th>{{'allergens'|trans}}</th>
        <th></th>
      </tr>
    </thead>
    <tbody>
      {% for line in lines %}
        <tr>
          <td>{{line.name}}</td>
          <td>{{line.color|upper}}</td>
          <td>{% if line.takeAway %}{{'yes'|trans}}{% else %}{{'no'|trans}}{% endif %}</td>
          <td>{% if line.allergy %}{{'yes'|trans}}{% else %}{{'no'|trans}}{% endif %}</td>
          <td>
            <button class="btn btn-outline-dark editLine" data-line-id="{{line.id}}">
              {{'edit'|trans}}
            </button>
          </td>
          <td>
            <button class="btn btn-outline-danger deleteLine" data-line-id="{{line.id}}">
              {{'delete'|trans}}
            </button>
          </td>
        </tr>
      {% endfor %}  
    </tbody>
  </table>

<div class="row">
  <div class="col-md-12 text-center pb-5">
    <div class="text-right pt-2 pr-2 pb-0 border-right border-left">
      <button type="button" class="btn btn-outline-success" data-toggle="modal" data-target="#lineModal" >{{'add-line'|trans}}</button>
    </div>  
  </div>
</div>


<div class="modal fade" id="lineModal" tabindex="-1" role="dialog" aria-labelledby="addLineModal" aria-hidden="true">
      <div class="modal-dialog" role="document">
        <div class="modal-content">
          <div class="modal-header">
            <h5 class="modal-title" id="addLineModal">{{'new-line'|trans}}</h5>
            <button type="button" class="close" data-dismiss="modal" aria-label="Close">
              <span aria-hidden="true">&times;</span>
            </button>
          </div>
          <div class="modal-body">
            <form action="{{path_for(constant('GestionComedor\\Configuration\\Routers\\LineRouters::LINES_CREATE'))}}" method="POST" >
              <input type="hidden" name="lineId" id="lineIdModal" value="{{line.id}}" />
              <div class="form-group">
                <label for="name" class="font-weight-bold" >{{'name'|trans}}</label>
                <input type="text" class="form-control" id="nameModal" name="name" value="" required/>
              </div>
              <div class="form-group">
                <label for="color" class="font-weight-bold" >{{'color'|trans}}</label>
                <input type="text" class="form-control" id="colorModal" name="color" value="" required/>
              </div>
              <div class="form-group">
                <label for="allergy" class="font-weight-bold" >{{'take-away'|trans}}</label>
                <select id="takeAwayModal" name="takeAway" class="form-control">
                  <option value="0">{{'no'|trans}}</option>
                  <option value="1">{{'yes'|trans}}</option>
                </select>
              </div>
              <div class="form-group">
                <label for="allergy" class="font-weight-bold" >{{'allergens'|trans}}</label>
                <select id="allergyModal" name="allergy" class="form-control">
                  <option value="0">{{'no'|trans}}</option>
                  <option value="1">{{'yes'|trans}}</option>
                </select>
              </div>
              <!--
              <div class="form-group">
                <label for="student" class="font-weight-bold" >{{'students-allowed'|trans}}</label>
                <select id="studentsModal" name="student" class="form-control">
                  <option value="0">{{'no'|trans}}</option>
                  <option value="1">{{'yes'|trans}}</option>
                </select>
              </div>
            -->
              <div class="form-group pl-4 ">
                <label for="allowed-roles" class="font-weight-bold" >{{'roles-allowed'|trans}}</label>
                {% for role in roles %}
                  <li>
                    <input type="checkbox" class="form-check-input roleLine" id="role-{{role.id}}" name="roles[]" value="{{role.id}}" checked>
                    <label class="form-check-label" for="role-{{role.id}}">{{role.name}}</label>
                  </li>
                {% endfor %}
              </div>
              <div class="form-group">
                <button class="btn btn-primary mb-2 btn-dark ">{{'save'|trans}}</button>
              </div>  
            </form> 
          </div>
          <div class="modal-footer">
            <button type="button" class="btn btn-secondary" data-dismiss="modal">{{'cancel'|trans}}</button>
          </div>
        </div>
      </div>
    </div>

{% endblock %}