{% load rolemgmt_tags %}
{% load rmtmgmt_tags %}

<table id="example" class="table table-bordered table-striped">
    <thead>
    <tr class="hide_class">
        <th colspan=5></th>
        <th colspan=1></th>
        <th colspan=7><div style="margin-left:50%;">Stages</div></th>
    </tr>
    <tr>
        <th></th>
        <th>Requirement</th>
        <th>Client Name</th>
        <th>Manager</th>
        <th>Selections / Total Positions</th>
        <th>In Progress/ Rejected /No Show / Total</th>
        {% for stage in stages %}
        <th class="hide_class"><label class="badge">S{{ forloop.counter }}</label>{{ stage.stage }}</th>
        {% endfor %}
        <th class="hide_class">All</th>
        <!--<th id="show_stages" style="float:right;text-align:center;">Show Stages</th>-->

    </tr>
    </thead>
    <tbody>
    {% for r in req %}
    <tr>
        <td>
            {% with r.id|req_age as age %}
            {% if age <= 15 %}
            <label class="badge" style="background: green;">{{ age }}d</label>
            {% elif age > 15 and age <= 30 %}
            <label class="badge" style="background: #FFBF00;;">{{ age }}d</label>
            {% else %}
            <label class="badge" style="background: red;">{{ age }}d</label>
            {% endif %}
            <font style="font-size:80%;">{{ r.get_position_status_display }}</font>
            {% if r.today_tag and r.position_status != 4 %}
            <input type="checkbox" name="tod_tag" id="id_tod_tag{{r.id}}" onchange="change_tod_tag({{r.id}});" checked>
            <span id="to_day_span{{ r.id }}">Current</span>
            {% elif r.position_status != 4  %}
            <input type="checkbox" name="tod_tag" id="id_tod_tag{{r.id}}" onchange="change_tod_tag({{r.id}});">
            <span id="to_day_span{{r.id}}"></span>
            {% endif %}
            <!--
              {% with r.id|req_style_check as chk %}
                  {% if chk == 1 %}
                      <meter value="{{ age }}" min="0" max="{{ age }}" class="meter1"></meter>
                  {% elif chk == 2 %}
                      <meter value="{{ age }}" min="0" max="{{ age }}" class="meter2"></meter>
                  {% else %}
                      <meter value="{{ age }}" min="0" max="{{ age }}" class="meter3"></meter>
                  {% endif %}
              {% endwith %}
              -->
            {% endwith %}

        </td>
        <td>
            <a id="id_position_name" class="pop_link1" link="/view_requirement_popup/{{r.id}}/"
               style="cursor:pointer;">{{ r.position_name }}</a>
            <br><br>
            <a  onclick="show_tracker_data({{r.id}});" style="cursor:pointer;">communication</a>
        </td>
        <td>{{ r.client.name }}</td>
        <td>{{ r.manager }}</td>
        <td>{{ r.id|selections }}/{{r.open_position}}</td>
        <td>{{ r.id|get_inprogress }}</td>
        {% for stage in stages %}
        {% with r.id|get_stage_count:stage.id as stage_count %}
        {% if  stage_count %}
        <td  bgcolor="#FFBF00">
            <a style="cursor:pointer;" class="hide_class class_link" link="/resume_pop/{{r.id}}/{{ stage.id }}/{{1}}/">
                <label class="badge" >Total-{{ stage_count }}</label></a>
            {% if r.id|internal_resume_count:company|count_i_resume:stage.id == 0 %}
            <p><label class="badge" >
                Internal-{{ r.id|internal_resume_count:company|count_i_resume:stage.id }}
            </label></p>
            {% else %}
            <p style="cursor:pointer;" class="hide_class class_link" link="/resume_pop/{{r.id}}/{{ stage.id }}/{{2}}/"><label class="badge" >
                Internal-{{ r.id|internal_resume_count:company|count_i_resume:stage.id }}
            </label></p>
            {% endif %}
            {% if r.id|external_resume_count:company|count_e_resume:stage.id == 0 %}
            <p><label class="badge" >
                External-{{ r.id|external_resume_count:company|count_e_resume:stage.id }}
            </label></p>
            {% else %}
            <p style="cursor:pointer;" class="hide_class class_link" link="/resume_pop/{{r.id}}/{{ stage.id }}/{{3}}/"><label class="badge" >
                External-{{ r.id|external_resume_count:company|count_e_resume:stage.id }}
            </label></p>
            {% endif %}
        </td>
        {% else %}
        <td class="hide_class">0</td>
        {% endif %}
        {% endwith %}
        {% endfor %}
        {% if r.id|get_stage_count:0 %}
        <td class="hide_class class_link" link="/resume_pop/{{r.id}}/0/0/"><a>All</a></td>
        {% else %}
        <td class="hide_class">All</td>
        {% endif %}
    </tr>
    {% endfor %}
    </tbody>
</table>

<script>
     $(function () {
  $.fn.dataTableExt.sErrMode = 'throw';
  $('#example').DataTable({
            "scrollX": true,
		    "paging": true,
   			"bInfo": true,
   			"searching": true,
            columnDefs: [ { targets: 0, type: 'natural' } ]

  });
    if ( $(window).width() > 739) {
        $('.dataTables_filter').append('&nbsp;&nbsp;&nbsp;&nbsp;<select onchange="get_requirements();" id="id_select_requirement" class="form form-control" style="height:31px;"><option value="1" selected>OPEN</option><option value="2">HOLD</option><option value="3">RESUME</option><option value="4">CLOSED</option><option value="0">ALL</option></select>');
     }
     else {
        $('.dataTables_filter').append('<select onchange="get_requirements();" id="id_select_requirement" class="form form-control" style="height:31px;"><option value="1" selected>OPEN</option><option value="2">HOLD</option><option value="3">RESUME</option><option value="4">CLOSED</option><option value="0">ALL</option></select>');
     }
     $("#id_select_requirement option[value='" + {{ status }} + "']").attr("selected","selected");
     $('.dataTables_filter').parent().addClass('pull-left');
     $('.dataTables_length').parent().addClass('pull-right');
     $('.dataTables_length').addClass('pull-right');
     $('.dataTables_filter').addClass('pull-left');
     if ( $(window).width() > 739) {
        $('[type=search]').attr('size','60%');
     }
     else {
        $('[type=search]').attr('size','25%');
     }
  })

$('#example').on('click', '.class_link', function(){
		var link = $(this).attr('link');
		var dt = $("#example2").DataTable();
        dt.destroy();
		$.ajax({
                        url : link,
                        type : "POST",
                        dataType: "json",
						async: false,
                        data : {
                            client_request : "Hi",
							rid : "Hi",

                            csrfmiddlewaretoken: '{{ csrf_token }}'
                            },
                            success : function(json)
							{
								$('#popup_modal_data').html(json.response);
								$("#id_resume_modal").modal('show');
								$('#example2').DataTable({"aoColumnDefs": [{ "bSearchable": false, "aTargets": [ 5,6 ]}]});
								$('.dataTables_filter').parent().addClass('pull-left');
								$('.dataTables_length').parent().addClass('pull-right');
								$('.dataTables_length').addClass('pull-right');
								$('.dataTables_filter').addClass('pull-left');
								if ( $(window).width() > 739)
								{
									$('[type=search]').attr('size','60%');
								}
								else
								{
									$('[type=search]').attr('size','25%');
								}
                            },
                              error : function(xhr,errmsg,err) {
                                alert(xhr.status + ": " + xhr.responseText);
                            }
                    });
});

</script>