tfabrica/ClientApp/app/components/crud/tfabrica.crud.read.component.html

library for TFabrica - TechSol

<div fxFlex>
    <style>
        td, th {
            padding: 5px;
        }

        md-sidenav {
            width: 300px;
        }
    </style>

    <!--
    <md-sidenav #trightfiltersmenu align="end" mode="over" [opened]="false" class="right-side-nav">
        <md-toolbar color="primary" style="margin-top:64px;" fxLayoutAlign="start center">
            <button md-icon-button
                    (click)="startSearch()">
                <md-icon>search</md-icon>
            </button>
            <h4>Filtri</h4>
        </md-toolbar>
    </md-sidenav>

    <md-sidenav align="end" #trightfieldsmenu mode="over" [opened]="false"  class="right-side-nav">
        <md-toolbar color="primary" style="margin-top:64px;" fxLayoutAlign="start center">
            <button md-icon-button
                    (click)="setFieldsList()">
                <md-icon>visibility</md-icon>
            </button>
            <h4>Campi</h4>
        </md-toolbar>


    </md-sidenav>
    -->

    <div fxFlex style="padding:20px;" fxLayout="column">
        <md-progress-bar *ngIf="loading" mode="indeterminate"></md-progress-bar>

        <div>
            <div fxLayout="row">
                <h3>{{report.title}}</h3>
                <span fxFlex>

                </span>

                <button md-mini-fab
                        color="primary"
                        (click)="openFieldsList()">
                    <md-icon>visibility</md-icon>
                </button>

                <span>&nbsp;</span>
                <button *ngIf="report.canSearch" md-mini-fab
                        color="primary"
                        (click)="openSearch()">
                    <md-icon>search</md-icon>
                </button>
                <span>&nbsp;</span>
                <button *ngIf="report.canAdd" md-mini-fab
                        color="primary"
                        (click)="addNewRow()">
                    <md-icon>add</md-icon>
                </button>

                <!--
                <span>&nbsp;</span>
                <button *ngIf="report.canDelete" md-mini-fab
                        color="primary"
                        (click)="RemoveRow()">
                    <md-icon>add</md-icon>
                </button>
                <span>&nbsp;</span>
                <button *ngIf="report.canUpdate" md-mini-fab
                        color="primary"
                        (click)="SaveRow()">
                    <md-icon>add</md-icon>
                </button>
                <span>&nbsp;</span>
                <button *ngIf="report.canManageCustom" md-mini-fab
                        color="primary"
                        (click)="report.customFunction">
                    <md-icon>add</md-icon>
                </button>-->
                <!--
                <span>&nbsp;</span>
                <button md-mini-fab
                        color="primary"
                        (click)="openSearchRight()">
                    <md-icon>search</md-icon> 2
                </button>
                -->

            </div>
        </div>

        <!-- Data Table -->
        
        <!-- <div>
            <table>
                <thead>
                    <tr>
                        <th *ngFor="let field of report.fieldsToDisplay">
                            {{field.label}}
                        </th>
                    </tr>
                </thead>

                <tbody>
                    <tr *ngFor="let record of report.readedRows" (click)="goToDetail(record)">

                        <td *ngFor="let field of report.fieldsToDisplay" [ngStyle]="field.getStyle()">
                            {{record[field.name]}}
                        </td>
                    </tr>
                </tbody>

            </table>
        </div>  -->

                        <!--filterEnabled ="ftrue"-->
        <t-crud-datatable 
                          [rows] ="report.readedRows"
                          [fieldsToDisplay] ="report.fieldsToDisplay"
                          (onRowClicked)="onRowClicked($event)"
                          paginateItems ="30">  <!--  n = 0: paginate disable; n > 0: number of rows to paginate-->
        </t-crud-datatable>

    </div>

</div>