<div class="blade-static" ng-class="{'__expanded': !isCatalogSelectMode()}">
    <va-breadcrumb ng-model="blade.breadcrumbs" blade-id="blade.id" blade-maximized="blade.isMaximized" ng-if="!isCatalogSelectMode()"></va-breadcrumb>
    <div class="form-group">
        <vc-item-search blade="blade"></vc-item-search>
    </div>
</div>
<div class="blade-content __medium-wide">
    <div class="blade-inner">
        <div class="inner-block" ng-init="setGridOptions('catalog-item-select-grid', {
                data: 'items',
                rowTemplate: 'item-list.row.html',
                rowHeight: 61,
                enableSelectionBatchEvent: false,
                columnDefs: [
                        {
                            name: 'imageUrl', displayName: 'catalog.blades.catalog-items-select.labels.picture',
                            enableColumnResizing: false, enableSorting: false, width: 60,
                            cellTemplate: 'item-list-icon.cell.html'
                        },
                        { name: 'name', displayName: 'catalog.blades.catalog-items-select.labels.name', cellTemplate: 'item-list-name.cell.html'  },
                        { name: 'marked', displayName: 'catalog.blades.links-list.labels.marked', width: 170, cellTemplate: 'marked.cell.html' }
                 ]})">
            <div class="table-wrapper">
                <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-height></div>
            </div>
        </div>
    </div>
    <div class="blade-static __bottom" ng-if="pageSettings.itemsPerPageCount < pageSettings.totalItems" ng-include="'pagerTemplate.html'"></div>
</div>

<script type="text/ng-template" id="item-list.row.html">
    <div ng-click='grid.appScope.selectItem($event, 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, '__selected': row.entity.id===grid.appScope.selectedNodeId }" role="{{col.isRowHeader ? 'rowheader' : 'gridcell' }}" ui-grid-cell></div>
</script>

<script type="text/ng-template" id="item-list-icon.cell.html">
    <div class="ui-grid-cell-contents">
        <div class="product-img">
            <img class="image" fallback-src="{{ COL_FIELD }}" ng-src="{{ COL_FIELD | thumbnail: '_64x64' }}" ng-if="row.entity.type !== 'category' && COL_FIELD">
            <i class="table-ico fa" ng-class="row.entity.type == 'category' ? 'fa-folder' : 'fa-image'" ng-if="row.entity.type ==='category' || !COL_FIELD"></i>
        </div>
    </div>
</script>

<script type="text/ng-template" id="item-list-name.cell.html">
    <div class="ui-grid-cell-contents">
        <div class="inner-contents">
            <i class="table-ico fas fa-link" ng-if="row.entity.links && row.entity.links.length"></i>
            <div class="table-t">{{ COL_FIELD }}</div>
        </div>
    </div>
</script>

<script type="text/ng-template" id="marked.cell.html">
    <div class="ui-grid-cell-contents">
        <i class="fas fa-link" ng-if="COL_FIELD"></i>
    </div>
</script>
