@if (items$ | async) {}

<fast-window [title]="'Initial Lines for ' + invoiceNum()" [width]="1400 | winWidth" [height]="800 | winHeight" (close)="closed.emit()"
    (widthChange)="setDynamicColumnWidth()" (stateChange)="setDynamicColumnWidth()" (resize)="setDynamicColumnWidth()">
    <div class="flex flex-row grow overflow-auto h-full">
        <fast-grid [loading]="gridLoading$ | async" [data]="items$ | async" [gridBinding]="items$ | async" [scrollable]="'scrollable'">
            <fast-grid-col type="text" field="lineNum" [width]="colWidths.lineNum" [title]="'#'"></fast-grid-col>
            <fast-grid-col type="text" field="dealNum" [width]="colWidths.dealNum" [title]="'Deal #'"></fast-grid-col>
            <fast-grid-col type="text" field="trader" [width]="colWidths.trader" [title]="'Trader'"></fast-grid-col>
            <fast-grid-col type="text" field="flowDays" [width]="colWidths.flowDays" [title]="'Days'"></fast-grid-col>
            <fast-grid-col type="text" field="deliveryPipelineNum" [width]="dynamicColumnWidth$ | async" [title]="'Pipeline'"></fast-grid-col>
            <fast-grid-col type="text" field="meterNum" [width]="dynamicColumnWidth$ | async" [title]="'Delivery Meter'"></fast-grid-col>
            <fast-grid-col type="num-d0" field="quantity" [width]="colWidths.quantity" [title]="'Quantity'"></fast-grid-col>
            <fast-grid-col type="num-c5" field="price" [width]="colWidths.price" [title]="'Price'"></fast-grid-col>
            <fast-grid-col type="num-c5" field="adder" [width]="colWidths.adder" [title]="'Adder'"></fast-grid-col>
            <fast-grid-col type="num-c5" field="invoicePrice" [width]="colWidths.invoicePrice" [title]="'Invoice Price'"></fast-grid-col>
            <fast-grid-col type="num-c2" field="amount" [width]="colWidths.amount" [title]="'Amount'"></fast-grid-col>
        </fast-grid>
    </div>
    <div class="flex flex-row pt-5">
        <div class="flex flex-col grow pb-3"></div>
        <div class="flex flex-col grow-0 pr-3 pb-3">
            <div class="flex flex-row">
                <div class="flex grow justify-end w-54 whitespace-nowrap">
                    <fast-label class="font-bold">Total Quantity: </fast-label>
                </div>
                <div class="flex grow justify-end pl-5 w-27.5 whitespace-nowrap">
                    <fast-label class="font-bold">{{totalQuantity() | number}}</fast-label>
                </div>
            </div>
            <div class="flex flex-row">
                <div class="flex grow justify-end w-54 whitespace-nowrap">
                    <fast-label class="font-bold">Total Amount: </fast-label>
                </div>
                <div class="flex grow justify-end pl-5 w-27.5 whitespace-nowrap">
                    <fast-label class="font-bold"> {{totalAmount() | currency}}</fast-label>
                </div>
            </div>
        </div>
    </div>
</fast-window>