<% layout('../layouts/main') -%>

<!-- DataTables -->
<% stylesheet('/css/dataTables.bootstrap.min.css') %>

<!-- DataTables -->
<% script('/js/jquery.dataTables.min.js') %>
<% script('/js/dataTables.bootstrap.min.js') %>

<% block('custom_scripts', `
<script>
  $(document).ready(function () {
      $('#example1').DataTable({
          "paging": true,
          "lengthChange": true,
          "searching": true,
          "ordering": true,
          "info": true,
          "autoWidth": false,
          "stateSave": true
      });
  });

  $(document).ready(function () {
      $(document).on('click', ".delete_confirmation", function (e) {
        e.preventDefault();
        if (confirm("Do you want delete this item")) {
            //alert($(this).attr('href'));
            window.location.href = $(this).attr('href');
        }
      });
  });
</script>
`) %>


<!-- Content Header (Page header) -->
<section class="content-header">
  <h1>
    Accomodation Bathroom
    <!--<small>advanced tables</small>-->
  </h1>
  <ol class="breadcrumb">
    <li><a href="/dashboard"><i class="fa fa-dashboard"></i> Home</a></li>
    <li class="active">BATHROOM</li>
  </ol>
</section>

<!-- Main content -->
<section class="content">
  
  <div class="row">
    <div class="col-xs-12">
      <div class="box">
        <div class="box-header">
          <h3 class="box-title">List of Bathroom </h3>
          <div class="pull-right">
            <a href="/bathroom/add" class="btn btn-primary">Add  Bathroom</a>
          </div>
        </div>
        <!-- /.box-header -->
        <div class="box-body">
            <table id="example1" class="table table-bordered table-hover">
              <thead>
                <tr>
                  <th>Sl. No.</th>
                  <th>Bathroom Type</th>
                  <th>Icon</th>
                  <th>Action</th>
                 
                </tr>
              </thead>
              <tbody>
                <% 
                if(data){
                for(var i=0; len=data.length, i < len; i++) { %>
                <tr>
                  <td>
                    <%= (i+1) %>
                  </td>
                  <td>
                    
                    <%= data[i].name %>
                  </td>
                  <td>
                    <img src="<%= data[i].icon %>" style="height: 50px; width: 50px" />
  
                  </td>
                  <td class="text-center">
                    <a href="<%= '/bathroom/edit/'+data[i]._id %>" class="btn btn-sm btn-primary" title="Edit"><span
                        class="glyphicon glyphicon-edit"></span></a>
                    <a href="<%= '/bathroom/delete/'+data[i]._id %>" class="btn btn-sm btn-danger delete_confirmation"
                      title="Delete"><span class="glyphicon glyphicon-trash"></span></a>
                  </td>
                </tr>
                <% 
                }
                }
                %>
              </tbody>
              <tfoot>
                <tr>
                  <th>Sl. No.</th>
                  <th>Bathroom Type</th>
                  <th>Icon</th>
                  <th>Action</th>
                 
                </tr>
              </tfoot>
            </table>
          </div>
        <!-- /.box-body -->
      </div>
      <!-- /.box -->
    </div>
    <!-- /.col -->
  </div>
  <!-- /.row -->
</section>
<!-- /.content -->