<div class="blade-static">
  <div class="form-group" style="display: flex; align-items: center;">
    <div class="form-input" style="flex: 1;">
      <input ng-model="filter.keyword" ng-keyup="$event.which === 13 && filter.criteriaChanged()" placeholder="{{'platform.placeholders.search-keyword' | translate}}" style="padding-right: 25px; text-overflow: ellipsis;">
      <button class="btn __other" style="position: relative;right: 35px;" ng-click="filter.keyword=null;filter.criteriaChanged()">
        <i class="btn-ico fa fa-remove" title="Clear"></i>
      </button>
    </div>
  </div>
</div>
<div class="blade-static __bottom" ng-if="pageSettings.itemsPerPageCount < pageSettings.totalItems" ng-include="'pagerTemplate.html'"></div>

<div class="blade-content __medium-wide">
    <div class="blade-inner">
        <div class="inner-block">
            <div class="table-wrapper" ng-init="setGridOptions('notificationlist-grid', {
                enableSorting: false,
              data: 'listEntries',
              rowTemplate: 'notification-list.row.html',
              rowHeight: 61,
              columnDefs: [
              { name: 'actions', displayName: '', enableColumnResizing: false, width: 30, cellTemplate: 'list-actions.cell.html', pinnedLeft:true },
              { name: 'type', displayName: 'notifications.blades.notifications-list.labels.display-name', cellTemplate: 'notification-list-name.cell.html', width : '60%' },
              { name: 'kind', displayName: 'notifications.blades.notifications-list.labels.type', pinnedCenter:true, cellTemplate: 'notification-list-kind.cell.html' }
              ]})">
              <div ui-grid="gridOptions" ui-grid-auto-resize ui-grid-save-state ui-grid-selection ui-grid-resize-columns ui-grid-move-columns ui-grid-pinning ui-grid-height></div>
              <ul class="menu __context" role="menu" id="cml_menu">
                  <li class="menu-item" ng-click='blade.editNotification(contextMenuEntity)'>
                      <i class="menu-ico fa fa-edit"></i> {{'platform.commands.manage' | translate}}
                  </li>
              </ul>
            </div>
        </div>
    </div>
</div>

<script type="text/ng-template" id="notification-list.row.html">
    <div ng-click="grid.appScope.selectNode(row.entity)" ng-repeat="(colRenderIndex, col) in colContainer.renderedColumns track by col.uid" ui-grid-one-bind-id-grid="rowRenderIndex + '-' + col.uid + '-cell'" class="ui-grid-cell" ng-class="{'ui-grid-row-header-cell': col.isRowHeader, '__hovered': grid.appScope.contextMenuEntity === row.entity, '__selected': row.entity.type===grid.appScope.selectedNodeId }" role="{{col.isRowHeader ? 'rowheader' : 'gridcell' }}" ui-grid-cell context-menu="grid.appScope.contextMenuEntity = row.entity" data-target="cml_menu">
            
    </div>
</script>
<script type="text/ng-template" id="list-actions.cell.html">
    <div class="ui-grid-actions" left-click-menu="grid.appScope.contextMenuEntity = row.entity" data-target="cml_menu">
        <i class="fa fa-ellipsis-v"></i>
    </div>
</script>
<script type="text/ng-template" id="notification-list-name.cell.html">
    <div class='ui-grid-cell-contents'>
        <div class='list-item'>
            <span class="list-name ng-binding">{{ (row.entity.kind == 'undef' ? 'notificationTypes.UnregisteredNotification.displayName' : 'notificationTypes.' + row.entity.type + '.displayName') | translate}}</span>
            <span class="list-descr ng-binding" style="color: #999;display: block;font-size: 12px;margin-top: 5px; white-space: initial;">{{ (row.entity.kind == 'undef' ? 'notificationTypes.UnregisteredNotification.description' : 'notificationTypes.' + row.entity.type + '.description') | translate : { type : row.entity.type } }}</span>
        </div>
    </div>
</script>
<script type="text/ng-template" id="notification-list-active.cell.html">
    <div class='ui-grid-cell-contents'>{{row.entity.isActive ? 'Active' : 'Inactive'}}</div>
</script>
<script type="text/ng-template" id="notification-list-kind.cell.html">
    <div class='ui-grid-cell-contents'>
        <div class="inner-contents">
            <i class="table-ico" ng-class="row.entity.icon ?  row.entity.icon : 'fa fa-question-circle'"></i>
        </div>
    </div>
</script>
