TechLadies/home-web

<script src="assets/jquery.tablesort.js"></script>
<script>
  $(document).on('ready page:load', function() {
    $('table').tablesort();
  });
</script>

<div class='page-header'>

  <div class='container'>
    <div class="row">
      <div class="col-md-6">
        <h1> <%= current_user.name %> </h1>
      </div>
    </div>
  </div>

  <div class='page-header-list'>
    <div class='container'>
      <ul class="list-inline">

        <li>
          <span>Status</span>
          <strong><%= current_user.status %>&nbsp;</strong>
        </li>

        <li>
          <span>Email</span>
          <strong><%= current_user.email %>&nbsp;</strong>
        </li>

        <li>
          <span>Contact Number</span>
          <strong><%= current_user.contact_number %>&nbsp;</strong>
        </li>

      </ul>
    </div>
  </div>

</div>

<div class='container'>
  <div class="panel panel-default">
    <div class="panel-heading">
      <h2>Assigned Cases</h2>
    </div>

    <div class='panel-body'>
      <div>
        <ul class="nav nav-tabs" role="tablist">
          <li role="presentation" class="active">
            <a href="#pending" aria-controls="pending" role="tab" data-toggle="tab">
              <span>Pending</span>
              <span class="badge"><%= @account.case_files.pending.count %></span>
            </a>
          </li>
          <li role="presentation">
            <a href="#closed" aria-controls="closed" role="tab" data-toggle="tab">
              <span>Closed</span>
              <span class="badge"><%= @account.case_files.closed.count %></span>
            </a>
          </li>
        </ul>

        <div class="tab-content">
          <div role="tabpanel" class="tab-pane active table-responsive" id="pending">

            <table class='table table-default'>
              <thead>
                <tr>
                  <th>Reported At<span class="glyphicon glyphicon-sort" aria-hidden="true"></span></th>
                  <th class="col-md-3">Case Number<span class="glyphicon glyphicon-sort" aria-hidden="true"></span></th>
                  <th>Case Type<span class="glyphicon glyphicon-sort" aria-hidden="true"></span></th>
                  <th class="col-md-3">Issues<span class="glyphicon glyphicon-sort" aria-hidden="true"></span></th>
                  <th></th>
                </tr>
              </thead>

              <tbody>
                <% @account.case_files.where(status: :pending).order('id DESC').each do |c| %>
                  <tr class="case">
                    <td><%= c.reported_at.to_date.to_s(:long) %> </td>
                    <td class="col-md-3"><%= link_to c, case_path(c) %> </td>
                    <td><%= c.case_type %> </td>
                    <td class="col-md-3">
                      <%- c.issues.collect do |i| %>
                        <p>- <%= i.tag.name %></p>
                      <%- end %>
                    </td>
                    <td><%= link_to 'Edit', edit_case_path(c), class: 'btn btn-default btn-sm' %></td>
                  </tr>
                <% end %>
              </tbody>
            </table>

          </div>

          <div role="tabpanel" class="tab-pane table-responsive" id="closed">

            <table class='table table-default'>
              <thead>
                <tr>
                  <th>Reported At<span class="glyphicon glyphicon-sort" aria-hidden="true"></span></th>
                  <th class="col-md-3">Case Number<span class="glyphicon glyphicon-sort" aria-hidden="true"></span></th>
                  <th>Case Type<span class="glyphicon glyphicon-sort" aria-hidden="true"></span></th>
                  <th class="col-md-3">Issues<span class="glyphicon glyphicon-sort" aria-hidden="true"></span></th>
                  <th>Closed At<span class="glyphicon glyphicon-sort" aria-hidden="true"></span></th>
                </tr>
              </thead>

              <tbody>
                <% @account.case_files.where(status: :closed).order('id DESC').each do |c| %>
                  <tr class="case">
                    <td><%= c.reported_at.to_date.to_s(:long) %> </td>
                    <td class="col-md-3"><%= link_to c, case_path(c) %> </td>
                    <td><%= c.case_type %> </td>
                    <td class="col-md-3">
                      <%- c.issues.collect do |i| %>
                        <p>- <%= i.tag.name %></p>
                      <%- end %>
                    </td>
                    <td><%= c.closed_at.to_date.to_s(:long) %></td>
                  </tr>
                <% end %>
              </tbody>
            </table>

          </div>
        </div>
      </div>
    </div>
  </div>
</div>