<div class="blade-content">
    <div class="blade-inner">
        <div ng-if="!links.length" class="note-centered">
            <img class="image" ng-src="{{blade.linkImage}}">
            <div class="no-bom-products-text">{{ 'catalog.blades.links-list.labels.no-data' | translate }}</div>
            <button class="btn" style="margin-top: 18px;" ng-click="openAddLinksBlade()">
                <span>{{ 'catalog.blades.links-list.labels.add-links' | translate }} <strong>+</strong></span>
            </button>
        </div>
        <div class="inner-block" ng-init="setGridOptions({
            data: 'links',
            useExternalSorting: true,
            rowHeight: 60,
            rowTemplate: 'link-list.row.html',
            infiniteScrollRowsFromEnd: 10,
            showHeader: false,
            enableGridMenu: false,
            columnDefs: [
                {
                    name: 'imageUrl',
                    displayName: 'pic',
                    enableColumnResizing: false,
                    enableSorting: false,
                    width: 60,
                    cellTemplate: 'link-list-icon.cell.html'
                },
                { name: 'name', displayName: 'name', cellTemplate: 'link-list-name.cell.html' }
             ]})">
            <div class="table-wrapper" ng-if="links.length">
                <div ui-grid="gridOptions"
                     ui-grid-auto-resize
                     ui-grid-selection
                     ui-grid-save-state
                     ui-grid-pinning
                     ui-grid-height
                     ui-grid-infinite-scroll></div>
                </div>
            </div>
        </div>
</div>

<script id="link-list.row.html" type="text/ng-template">
    <div class="ui-grid-cell"
         role="{{col.isRowHeader ? 'rowheader' : 'gridcell' }}"
         ng-class="{'ui-grid-row-header-cell': col.isRowHeader, '__hovered': grid.appScope.contextMenuEntity === row.entity, '__selected': row.entity.targetId===grid.appScope.selectedNodeId }"
         ng-click="grid.appScope.blade.selectNode(row.entity)"
         ng-repeat="(colRenderIndex, col) in colContainer.renderedColumns track by col.uid"
         ui-grid-one-bind-id-grid="rowRenderIndex + '-' + col.uid + '-cell'"
         ui-grid-cell
         context-menu="grid.appScope.contextMenuEntity = row.entity">
    </div>
</script>

<script type="text/ng-template" id="link-list-name.cell.html">
    <div class="ui-grid-cell-contents">
        <div class="inner-contents">
            <div class="table-t">{{COL_FIELD}}</div>
            <div class="table-descr">{{ row.entity.$$path }}</div>
        </div>
    </div>
</script>

<script type="text/ng-template" id="link-list-icon.cell.html">
    <div class="ui-grid-cell-contents">
        <div class="product-img">
            <i class="table-ico fas fa-link"></i>
        </div>
    </div>
</script>