/**
 * @fileoverview added by tsickle
 * Generated from: lib/fhir/device/table/device-table.component.ts
 * @suppress {checkTypes,constantProperty,extraRequire,missingOverride,missingReturn,unusedPrivateMembers,uselessCode} checked by tsc
 */
import { Router } from '@angular/router';
import { AlertService } from '../../../widgets/entry-components/alert/services/alert.service';
import { Component, Input, ViewChild, Output, EventEmitter } from '@angular/core';
import { trigger, state, style, transition, animate } from '@angular/animations';
import { MatPaginator, MatSort, MatTableDataSource } from '@angular/material';
import { merge } from 'rxjs';
var DeviceTableComponent = /** @class */ (function () {
    function DeviceTableComponent(alertService, router) {
        this.alertService = alertService;
        this.router = router;
        this.displayedColumns = ['identifier', 'manufacturer', 'model', 'status', 'type', 'star'];
        this.dataSource = new MatTableDataSource();
        this.dataLength = 6;
        this.callSortSizeChanged = new EventEmitter();
        this.callDelete = new EventEmitter();
    }
    /**
     * @param {?} changes
     * @return {?}
     */
    DeviceTableComponent.prototype.ngOnChanges = /**
     * @param {?} changes
     * @return {?}
     */
    function (changes) {
        if (changes.deviceList) {
            this.paginator.pageIndex = this.actPage;
            if (this.paginator.pageIndex === 0) {
                this.paginator.length = this.pageSize;
            }
            if (changes.deviceList.currentValue.length > this.pageSize) {
                this.dataSource.data = changes.deviceList.currentValue.slice(0, changes.deviceList.currentValue.length - 1);
                this.paginator.length += this.pageSize;
            }
            else {
                this.dataSource.data = changes.deviceList.currentValue;
            }
        }
    };
    /**
     * @return {?}
     */
    DeviceTableComponent.prototype.ngAfterViewInit = /**
     * @return {?}
     */
    function () {
        var _this = this;
        this.sort.sortChange.subscribe((/**
         * @return {?}
         */
        function () { return _this.paginator.pageIndex = 0; }));
        merge(this.sort.sortChange, this.paginator.page).subscribe((/**
         * @param {?} data
         * @return {?}
         */
        function (data) {
            if (data && data.pageSize) {
                _this.callSortSizeChanged.emit({
                    pageSize: data.pageSize,
                    sort: { active: _this.sort.active, direction: _this.sort.direction },
                    pageIndex: data.pageIndex
                });
            }
            if (data && data.active) {
                _this.callSortSizeChanged.emit({
                    pageSize: _this.paginator.pageSize,
                    sort: { active: data.active, direction: data.direction },
                    pageIndex: data.pageIndex
                });
            }
        }));
    };
    /**
     * @param {?} event
     * @return {?}
     */
    DeviceTableComponent.prototype.stopProp = /**
     * @param {?} event
     * @return {?}
     */
    function (event) {
        event.stopPropagation();
    };
    /**
     * @param {?} url
     * @param {?} device
     * @param {?=} event
     * @return {?}
     */
    DeviceTableComponent.prototype.navDevice = /**
     * @param {?} url
     * @param {?} device
     * @param {?=} event
     * @return {?}
     */
    function (url, device, event) {
        if (event) {
            event.stopPropagation();
        }
        localStorage.removeItem('device');
        this.router.navigateByUrl(url, { state: { parameter: device } });
    };
    /**
     * @param {?} id
     * @param {?} identifier
     * @return {?}
     */
    DeviceTableComponent.prototype.deleteDeviceAlert = /**
     * @param {?} id
     * @param {?} identifier
     * @return {?}
     */
    function (id, identifier) {
        var _this = this;
        this.alertService.presentDelete(identifier, 'DEVICE', (/**
         * @return {?}
         */
        function () { _this.callDelete.emit(id); }));
    };
    DeviceTableComponent.decorators = [
        { type: Component, args: [{
                    selector: 'inc-device-table',
                    template: "<div class=\"devices-table mat-elevation-z8\" [hidden]=\"!deviceList\">\r\n  <div class=\"loading-shade\" *ngIf=\"deviceList && deviceList.length===0 && filtered\">\r\n    <ion-text color=\"danger\">\r\n      <h4>{{'NO_RESULT' | translate}}</h4>\r\n    </ion-text>\r\n  </div>\r\n  <mat-table [dataSource]=\"dataSource\" multiTemplateDataRows matSort>\r\n    <ng-container matColumnDef=\"identifier\">\r\n      <mat-header-cell *matHeaderCellDef>{{'INVENTORY_ID' | translate}}</mat-header-cell>\r\n      <mat-cell *matCellDef=\"let row\">\r\n        <div id=\"row-identifier\" style=\"width: 100%\">\r\n          <ion-button id=\"row-serial-number\" fill=\"outline\" expand=\"block\" style=\"text-transform: initial;\"\r\n            color=\"secondary\" (click)=\"navDevice('/device-details', row, $event)\">\r\n            <span>{{row.identifier[0].value}}</span>\r\n          </ion-button>\r\n        </div>\r\n      </mat-cell>\r\n    </ng-container>\r\n\r\n    <ng-container matColumnDef=\"manufacturer\">\r\n      <mat-header-cell *matHeaderCellDef mat-sort-header id=\"device-manufacturer-header\">\r\n        {{'MANUFACTURER' | translate}}\r\n      </mat-header-cell>\r\n      <mat-cell *matCellDef=\"let row\">\r\n        <ion-text color=\"primary\" id=\"row-manufacturer\">\r\n          {{row.manufacturer}}\r\n        </ion-text>\r\n      </mat-cell>\r\n    </ng-container>\r\n\r\n    <ng-container matColumnDef=\"model\">\r\n      <mat-header-cell *matHeaderCellDef mat-sort-header id=\"device-model-header\">\r\n        {{'MODELL' | translate}}\r\n      </mat-header-cell>\r\n      <mat-cell *matCellDef=\"let row\">\r\n        <ion-text color=\"primary\" id=\"row-model\">\r\n          {{row.modelNumber}}\r\n        </ion-text>\r\n      </mat-cell>\r\n    </ng-container>\r\n\r\n    <ng-container matColumnDef=\"status\">\r\n      <mat-header-cell *matHeaderCellDef mat-sort-header id=\"device-status-header\">\r\n        {{'STATUS' | translate}} </mat-header-cell>\r\n      <mat-cell *matCellDef=\"let row\" class=\"ion-text-capitalize\">\r\n        <ng-container *ngIf=\"row.status !== 'inactive'; else elseTemplate\">\r\n          <ion-text id=\"row-status\"\r\n            [ngClass]=\"{'success': row.status==='active', 'warning': row.status==='entered-in-error', 'danger': row.status==='unknown'}\">\r\n            {{row.status | deviceStatusPipe | translate}}\r\n          </ion-text>\r\n        </ng-container>\r\n        <ng-template #elseTemplate>\r\n          <ion-button fill=\"outline\" expand=\"block\" style=\"text-transform: initial; flex: 1; margin-right: 8px;\"\r\n            *ngIf=\"row.patient && row.patient.display\">\r\n            <span>{{row.patient.display}}</span>\r\n          </ion-button>\r\n          <span *ngIf=\"!(row.patient && row.patient.display)\">Ismeretlen p\u00E1ciens</span>\r\n        </ng-template>\r\n      </mat-cell>\r\n    </ng-container>\r\n\r\n    <ng-container matColumnDef=\"type\">\r\n      <mat-header-cell *matHeaderCellDef mat-sort-header id=\"device-type-header\">\r\n        {{'TYPE' | translate}} </mat-header-cell>\r\n      <mat-cell *matCellDef=\"let row\" class=\"ion-text-capitalize\">\r\n        <ion-text id=\"row-type\">\r\n          {{row.type.text | translate}}\r\n        </ion-text>\r\n      </mat-cell>\r\n    </ng-container>\r\n\r\n    <ng-container matColumnDef=\"star\">\r\n      <mat-header-cell *matHeaderCellDef></mat-header-cell>\r\n      <mat-cell *matCellDef=\"let element\">\r\n        <button mat-button [matMenuTriggerFor]=\"menu\" (click)=\"stopProp($event)\" id=\"item-menu-button\">\r\n          <ion-icon style=\"font-size: 30px;\" name=\"more\"></ion-icon>\r\n        </button>\r\n        <mat-menu #menu=\"matMenu\" xPosition=\"before\">\r\n          <button class=\"menuItem\" id=\"item-menu-view-button\" mat-menu-item\r\n            (click)=\"navDevice('/device-details', element)\">{{'VIEW' | translate}}</button>\r\n          <button class=\"menuItem\" id=\"item-menu-edit-button\" (click)=\"navDevice('/device-add', element)\"\r\n            mat-menu-item>{{'EDIT' | translate}}</button>\r\n          <button class=\"menuItem\" id=\"item-menu-delete-button\" mat-menu-item\r\n            (click)=\"deleteDeviceAlert(element.id, element.identifier[0].value)\">{{'DELETE' | translate}}</button>\r\n        </mat-menu>\r\n      </mat-cell>\r\n    </ng-container>\r\n\r\n    <ng-container matColumnDef=\"expandedDetail\">\r\n      <mat-cell *matCellDef=\"let element\" [attr.colspan]=\"displayedColumns.length\" class=\"ion-no-padding\">\r\n        <div class=\"element-detail\" [@detailExpand]=\"element == expandedElement ? 'expanded' : 'collapsed'\">\r\n          <inc-table-row-inner [element]=\"element\"></inc-table-row-inner>\r\n        </div>\r\n      </mat-cell>\r\n    </ng-container>\r\n\r\n    <mat-header-row *matHeaderRowDef=\"displayedColumns; sticky: true\"></mat-header-row>\r\n    <mat-row *matRowDef=\"let element; columns: displayedColumns;\" [class.expanded-row]=\"expandedElement === element\"\r\n      class=\"element-row\" (click)=\"expandedElement = expandedElement === element ? null : element\">\r\n    </mat-row>\r\n    <tr mat-row *matRowDef=\"let row; columns: ['expandedDetail']\" class=\"detail-row\"></tr>\r\n  </mat-table>\r\n  <mat-paginator #paginator showFirstLastButtons=\"true\" hidePrevButton=false class=\"mat-paginator-sticky\" [pageSizeOptions]=\"[5, 25, 100]\">\r\n  </mat-paginator>\r\n</div>",
                    animations: [
                        trigger('detailExpand', [
                            state('collapsed', style({ height: '0px', minHeight: '0', display: 'none' })),
                            state('expanded', style({ height: '*' })),
                            transition('expanded <=> collapsed', animate('150ms cubic-bezier(0.4, 0.0, 0.2, 1)')),
                        ]),
                    ],
                    styles: ["ion-button span,ion-text{word-break:break-all;white-space:normal}ion-button{font-weight:400;height:auto}ion-button span{display:flex;align-items:center;min-height:32px}.mat-column-manufacturer{padding-left:8px}.mat-column-star{padding-right:0;border-left:1px solid #e0e0e0;flex:.4;min-width:64px}.mat-paginator-sticky{bottom:0;position:-webkit-sticky;position:sticky;z-index:10}@media (max-width:576px){.mat-column-manufacturer,.mat-column-model{display:none}.mat-column-star{flex:.75}}tr.detail-row{height:0;display:initial}tr .mat-cell{padding:0}.mat-row.element-row:not(.expanded-row):hover{background:#f5f5f5}.mat-row.element-row:not(.expanded-row):active{background:#efefef}.element-detail{overflow:hidden;display:flex;flex:1;border-bottom:1px solid #e0e0e0}.element-detail inc-table-row-inner{width:100%}.devices-table{position:relative}.mat-table{min-height:250px}.loading-shade{left:0;right:0;background:rgba(0,0,0,.15);display:flex;align-items:center;justify-content:center;position:absolute;top:56px;bottom:56px;z-index:1}.v-center{display:flex;align-items:center}.success{color:var(--ion-color-success)}.danger{color:var(--ion-color-danger)}.warning{color:var(--ion-color-warning)}"]
                }] }
    ];
    /** @nocollapse */
    DeviceTableComponent.ctorParameters = function () { return [
        { type: AlertService },
        { type: Router }
    ]; };
    DeviceTableComponent.propDecorators = {
        typeDisabled: [{ type: Input }],
        statusDisabled: [{ type: Input }],
        deviceList: [{ type: Input }],
        filtered: [{ type: Input }],
        actPage: [{ type: Input }],
        pageSize: [{ type: Input }],
        callSortSizeChanged: [{ type: Output }],
        callDelete: [{ type: Output }],
        paginator: [{ type: ViewChild, args: [MatPaginator,] }],
        sort: [{ type: ViewChild, args: [MatSort,] }]
    };
    return DeviceTableComponent;
}());
export { DeviceTableComponent };
if (false) {
    /** @type {?} */
    DeviceTableComponent.prototype.expandedElement;
    /** @type {?} */
    DeviceTableComponent.prototype.displayedColumns;
    /** @type {?} */
    DeviceTableComponent.prototype.dataSource;
    /** @type {?} */
    DeviceTableComponent.prototype.dataLength;
    /** @type {?} */
    DeviceTableComponent.prototype.typeDisabled;
    /** @type {?} */
    DeviceTableComponent.prototype.statusDisabled;
    /** @type {?} */
    DeviceTableComponent.prototype.deviceList;
    /** @type {?} */
    DeviceTableComponent.prototype.filtered;
    /** @type {?} */
    DeviceTableComponent.prototype.actPage;
    /** @type {?} */
    DeviceTableComponent.prototype.pageSize;
    /** @type {?} */
    DeviceTableComponent.prototype.callSortSizeChanged;
    /** @type {?} */
    DeviceTableComponent.prototype.callDelete;
    /** @type {?} */
    DeviceTableComponent.prototype.paginator;
    /** @type {?} */
    DeviceTableComponent.prototype.sort;
    /**
     * @type {?}
     * @private
     */
    DeviceTableComponent.prototype.alertService;
    /**
     * @type {?}
     * @private
     */
    DeviceTableComponent.prototype.router;
}
//# sourceMappingURL=data:application/json;base64, 