<dx-data-grid #dealsContainer id="dealsContainer"
    [dataSource]="dataSource"
    keyExpr="Ticket"
    [showRowLines]="true"
    [showColumnLines]="false"
    [showBorders]="true">
    <dxo-search-panel
    [visible]="true"
    [width]="240"
    placeholder="Search..."></dxo-search-panel>

    <dxo-paging [enabled]="true" [pageSize]="50"></dxo-paging>
    <dxi-column dataField="AccountName" [allowSorting]="true" [width]="180">
      <dxo-header-filter [allowSearch]="true"></dxo-header-filter>
    </dxi-column>
    <dxi-column dataField="CloseTime" [allowSorting]="true" format="datetime" [width]="160">
      <dxo-header-filter [allowSearch]="true"></dxo-header-filter>

    </dxi-column>
    <dxi-column dataField="Ticket" [width]="120" [hidingPriority]="1"></dxi-column>
    <dxi-column dataField="Symbol" [allowSorting]="true" cellTemplate="symbolCellTemplate">
      <div *dxTemplate="let cell of 'symbolCellTemplate'" [class.inc]="cell.data.Type === 0" [class.dec]="cell.data.Type === 1">
        <span class="arrow"></span>
        <span class="current-value">{{cell.text}}</span>
      </div>
      <dxo-header-filter [allowSearch]="true"></dxo-header-filter>
    </dxi-column>
    <dxi-column dataField="Lots" format="#0.####" [width]="120" [hidingPriority]="2"></dxi-column>
    <dxi-column dataField="Commission" caption="Commission" [allowSorting]="false" [width]="100" format="#0.######"></dxi-column>
    <dxi-column dataField="SwapValue" caption="Swap" [allowSorting]="false" [width]="80" format="#0.######"></dxi-column>
    <dxi-column dataField="Profit" [allowSorting]="true" [width]="120" format="#0.######"></dxi-column>
    <dxo-summary>
      <dxi-total-item
          column="Ticket"
          summaryType="count">
      </dxi-total-item>
    </dxo-summary>
</dx-data-grid>
