<!--
 * @Description  : 
 * @Version      : 1.0
 * @Author       : Shiming
 * @Date         : 2022-01-05 20:15:41
 * @LastEditors  : Shiming
 * @LastEditTime : 2022-04-21 10:15:49
 * @FilePath     : \\tms-obc-web\\src\\app\\routes\\financial-management\\components\\withdrawals-record\\withdrawals-detail\\withdrawals-detail.component.html
 * Copyright (C) 2022 huzhenhong. All rights reserved.
-->
<page-header-wrapper [title]="'提现详情'" [logo]="logo">
    <ng-template #logo>
        <button nz-button nz-tooltip nzTooltipTitle="返回上一页" (click)="goBack()">
            <i nz-icon nzType="left" nzTheme="outline"></i>
        </button>
    </ng-template>
</page-header-wrapper>

<nz-card >
    <nz-alert nzType="info" nzMessage="提现信息" class="mb-md"></nz-alert>
    <div se-container [labelWidth]="130">
        <se label="网络货运人">
            {{formData?.ltdName}}
        </se>
        <se label="银行类型">
            {{formData?.bankType==='1'?'平安银行':'浦发银行'}}
        </se>
        <se label="提现单号">
            {{formData?.refundApplyCode}}
        </se>
        <se label="账户名称">
            {{formData?.bankAccountName}}
        </se>
        <se label="提现时间">
            {{formData?.createTime}}
        </se>
        <se label="虚拟账户">
            {{formData?.virtualAccount}}
        </se>
        <se label="提现状态">
            {{formData?.refundStatusLabel}}
        </se>
        <se label="提现金额">
            {{formData?.amount | currency}}
        </se>
        <se label="银行流水号">
            {{formData?.bankSerialNumber}}
        </se>
        <se label="提现至银行卡">
            {{formData?.bankCardNumber}}
        </se>
        <se label="银行回单" col="1">
            <a (click)="downBack()">{{formData?.refundStatus==='3'?'下载回单':'暂无回单'}}</a>
        </se>
    </div>

    <nz-tabset class="mt-md">
        <nz-tab nzTitle="提现明细" *ngIf="accountType === '2'">
            <div nz-row nzGutter="8">
                <div nz-col [nzXl]="_$expand ? 24 : 18" [nzLg]="24" [nzSm]="24" [nzXs]="24">
                    <sf #sf [schema]="inputSearchSchema"
                        [ui]="{ '*': { spanLabelFixed: 110,grid: { lg: 8, md: 12, sm: 12, xs: 24 } }}" [compact]="true"
                        [button]="'none'"></sf>
                </div>
                <div nz-col [nzXl]="_$expand ? 24 : 6" [nzLg]="24" [nzSm]="24" [nzXs]="24" class="text-right">
                    <button nz-button nzType="primary" [nzLoading]="service.http.loading" (click)="inputST?.load(1)">查询</button>
                    <button nz-button (click)="resetInputSF()">重置</button>
                    <button nz-button (click)="exprot()"> 导出</button>
                    <button nz-button nzType="link" (click)="expandToggle()">
                        {{ !_$expand ? '展开' : '收起' }}
                        <i nz-icon [nzType]="!_$expand ? 'down' : 'up'"></i>
                    </button>
                </div>
            </div>
            <st #inputST [data]="service.$api_get_refund_detail_page" [columns]="columns" [page]="{  }"
                [req]="{  process: beforeReq }" [loading]="false" [scroll]="{ x: '1200px', y: '370px' }" class="mt-md">
                <ng-template st-row="amountDetails" let-item let-index="index" let-column="column">
                    <ng-container *ngFor="let detail of item.amountDetails">
                        {{detail.costName}}:{{detail.price |currency}}
                    </ng-container>
                </ng-template>
                <ng-template st-row="billId" let-item let-index="index" let-column="column">
                    {{item.billCode}}<br>
                    {{item.billStatusLabel}}<br>
                </ng-template>
                <ng-template st-row="wayBillId" let-item let-index="index" let-column="column">
                    {{item.wayBillCode}}<br>
                    {{item.wayBillStatusLabel}}<br>
                </ng-template>
                <ng-template st-row="driverId" let-item let-index="index" let-column="column">
                    {{item.driverName}}<br>
                    {{item.driverTelephone}}<br>
                    {{item.driverLicencePlate}}<br>
                </ng-template>
                <ng-template st-row="captainName" let-item let-index="index" let-column="column">
                    {{item.captainName}}<br>
                    {{item.captainTelephone}}<br>
                </ng-template>
            </st>
        </nz-tab>
        <nz-tab nzTitle="提现进度">
            <div nz-row class="mt-xl">
                <div nz-col nzSpan="12" nzOffset="1">
                    <app-logistics-time-line [data]="timeLineData"></app-logistics-time-line>
                </div>
            </div>
        </nz-tab>
    </nz-tabset>
</nz-card>