openproject/public/templates/work_packages/work_packages_table.html

<table>
  <thead>
    <tr>
      <th class="checkbox hide-when-print">
        <a ng-href="/projects/{{projectIdentifier}}/work_packages"
           alt="{{I18n.t('js.button_check_all')}}/{{I18n.t('js.button_uncheck_all')}}"
           class="no-decoration-on-hover"
           onclick="toggleIssuesSelection(Element.up(this, &quot;form&quot;)); return false;"
           title="{{I18n.t('js.button_check_all')}}/{{I18n.t('js.button_uncheck_all')}}">
          <icon-wrapper icon-title="I18n.t('js.button_check_all') + '/' + I18n.t('js.button_uncheck_all')"
                        icon-name="yes"/>

        </a>
      </th>

      <th sort-header header-name="status" header-title="#"/>

      <th sort-header ng-repeat="column in columns"
                      header-name="{{column.name}}"
                      header-title="{{column.title}}"
                      sortable="{{column.sortable}}"/>
    </tr>
  </thead>

  <tbody>
    <tr work-package-group-header
        ng-repeat-start="row in rows"
        ng-if="grouped &&
               ($first || (row.object | columnContent:groupBy) !== (rows[$index-1].object | columnContent:groupBy))"
        ng-class="{
          group: true,
          open: groupExpanded[currentGroup],
          closed: !groupExpanded[currentGroup],
          keyboard_hover: true
        }">
      <td colspan="{{ columns.length + 2 }}">
        <span ng-class="[
                'expander',
                'icon-context',
                'icon-' + (groupExpanded[currentGroup] && 'minus' || 'plus')
              ]"
              ng-click="toggleCurrentGroup()">
          <span ng-class="{
            'hidden-for-sighted': true,
            expand: !groupExpanded[currentGroup],
            collapse: groupExpanded[currentGroup]
          }">
            {{ groupExpanded[currentGroup] && I18n.t('js.label_collapse') || I18n.t('js.label_expand') }}
          </span>
          <span class="hidden-for-sighted collapse">{{ I18n.t('js.label_collapse') }}</span>
        </span>

        <span>
          {{ row.object | columnContent:groupBy || '-' }}

          <span class="count">
            {{ countByGroup[(row.object | columnContent:groupBy)] }}

            <span aria-hidden="true" role="presentation" tabindex="-1">
              <a class="toggle-all" ng-href="#" ng-click="toggleAllGroups()">
                {{ groupExpanded[currentGroup] && I18n.t('js.label_collapse_all') || I18n.t('js.label_expand_all') }}
              </a>
            </span>
          </span>
        </span>

      </td>
    </tr>

    <tr ng-repeat-end
        id="work-package-{{ row.object.id }}"
        ng-class="[
          'hascontextmenu',
          'issue',
          $even && 'even' || '',
          $odd && 'odd' || '',
          !row.object['leaf?'] && 'parent' || '',
          row.level > 0 && 'child idnt' || '',
          row.level > 0 && ('idnt-' + row.level) || ''
        ]"
        ng-show="!grouped || groupExpanded[(row.object | columnContent:groupBy)]">

      <td class="checkbox hide-when-print">
        <accessible-checkbox name="ids[]"
                             checkbox-id="work_package{{row.object.id}}"
                             checkbox-title="{{I18n.t('js.description_select_work_package')}}#{{row.object.id}}"
                             checkbox-value="row.object.id"
                             model="row.checked"/>
      </td>

      <td class="id">
        <span ng-if="row.object.parent_id" class="hidden-for-sighted">
          {{I18n.t('js.description_subwork_package')}} {{I18n.t('js.label_work_package')}} #{{row.parent.object.name}}
        </span>
        <a ng-href="/work_packages/{{row.object.id}}'">{{row.object.id}}</a>
      </td>

      <td ng-repeat="column in columns" class="{{column.name}}">
        <span work-package-column work-package="row.object" column="column"/>
      </td>
    </tr>
  </tbody>
</table>