{% load i18n static %}

<div class="datagrid-wrapper" id="{{datagrid.id}}">
{% block datagrid_titlebox %}
 <div class="datagrid-titlebox">
{%  block datagrid_title %}
   <h1 class="datagrid-title">{{datagrid.title}}</h1>
{%  endblock datagrid_title %}
 </div>
{% endblock datagrid_titlebox %}
 <div class="datagrid-main">
  <div class="datagrid">
   <table class="datagrid-head" style="display: none;">
    <colgroup>
{% for column in datagrid.columns %}
     <col class="{{column.id}}"{% if column.width != 0 %} width="{{column.width}}%"{% endif %} />
{% endfor %}
     <col class="datagrid-customize" />
    </colgroup>
   </table>

   <div class="datagrid-body-container">
    <table class="datagrid-body">
     <colgroup>
{% for column in datagrid.columns %}
      <col class="{{column.id}}"{% if column.width != 0 %} width="{{column.width}}%"{% endif %} />
{% endfor %}
      <col class="datagrid-customize" />
     </colgroup>
     <thead>
      <tr class="datagrid-headers">
{% for column in datagrid.columns %}
       {{column.get_header}}{% endfor %}
       <th class="edit-columns datagrid-header" id="{{datagrid.id}}-edit"><div class="datagrid-icon datagrid-icon-edit" title="{% trans "Edit columns" %}"></div></th>
      </tr>
     </thead>
     <tbody>
{% block datagrid_rows %}
{%  if datagrid.rows %}
{%   for row in datagrid.rows %}
      <tr class="{% cycle "odd" "even" %}" data-url="{{row.url}}">
{%    for cell in row.cells %}
       {{cell}}{% endfor %}
      </tr>
{%   endfor %}
{%  else %}
      <tr class="datagrid-empty-row">
       <td class="datagrid-empty" colspan="{{datagrid.columns|length|add:1}}">
{%   block datagrid_empty %}{% endblock %}
       </td>
      </tr>
{%  endif %}
     </tbody>
{% endblock %}
    </table>
   </div>
{% block paginator %}
{{datagrid.render_paginator}}
{% endblock paginator %}
  </div>
  <div class="datagrid-menu" id="{{datagrid.id}}-menu" style="display: none; position: absolute;">
   <table>
{% for column in datagrid.all_columns %}
{%  with column.toggle_url as toggle_url %}
    <tr class="{{column.id}}" title="{% if column.active %}{% trans 'Remove the column' %}{% else %}{% trans 'Add the column' %}{% endif %}">
     <td class="datagrid-menu-checkbox">{% if column.active %}<div class="datagrid-icon datagrid-icon-checkmark"></div>{% endif %}</td>
     <td class="datagrid-menu-label"><a href="#">{% spaceless %}
{%   if column.image_url %}
      <img src="{{column.image_url}}" width="{{column.image_width}}" height="{{column.image_height}}" alt="{{column.image_alt}}" />
{%   elif column.image_class %}
      <div class="{{column.image_class}}"></div>
{%   endif %}
      {{column.detailed_label_html|default_if_none:""}}{% endspaceless %}</a>
     </td>
    </tr>
{%  endwith %}
{% endfor %}
   </table>
  </div>
 </div>
</div>
