edit

src/app/routes/financial-management/components/withdrawals-record/withdrawals-record.component.html

@@ -1,5 +1,5 @@
-<page-header-wrapper [title]="'提现记录'">
-</page-header-wrapper>
+<!-- <page-header-wrapper [title]="'提现记录'">
+</page-header-wrapper> -->
 
 <!-- <nz-card>
     <nz-row [nzGutter]="16">
@@ -22,7 +22,7 @@
     </nz-row>
 </nz-card> -->
 
-<nz-card class="search-box" nzBordered>
+<!-- <nz-card class="search-box" nzBordered>
     <div nz-row nzGutter="8">
         <div nz-col [nzXl]="_$expand ? 24 : 18" [nzLg]="24" [nzSm]="24" [nzXs]="24">
             <sf #sf [schema]="searchSchema"
@@ -39,17 +39,22 @@
             </button>
         </div>
     </div>
-</nz-card>
+</nz-card> -->
 
-<nz-card class="content-box" nzBordered>
-    <nz-tabset [nzTabBarExtraContent]="extraTemplate">
-        <nz-tab nzTitle="全部" (nzClick)="changeRefundStatus()"></nz-tab>
-        <nz-tab nzTitle="待审核" (nzClick)="changeRefundStatus('1')"></nz-tab>
-        <nz-tab nzTitle="处理中" (nzClick)="changeRefundStatus('2')"></nz-tab>
-        <nz-tab nzTitle="提现成功" (nzClick)="changeRefundStatus('3')"></nz-tab>
-        <nz-tab nzTitle="提现失败" (nzClick)="changeRefundStatus('5')"></nz-tab>
-        <nz-tab nzTitle="已拒绝" (nzClick)="changeRefundStatus('4')"></nz-tab>
-    </nz-tabset>
+<nz-card class="table-box">
+    <div class="tab_header">
+        <label class="page_title">
+            <label class="driver">|</label>
+            提现记录</label>
+        <nz-tabset [nzTabBarExtraContent]="extraTemplate">
+            <nz-tab nzTitle="全部" (nzClick)="changeRefundStatus()"></nz-tab>
+            <nz-tab nzTitle="待审核" (nzClick)="changeRefundStatus('1')"></nz-tab>
+            <nz-tab nzTitle="处理中" (nzClick)="changeRefundStatus('2')"></nz-tab>
+            <nz-tab nzTitle="提现成功" (nzClick)="changeRefundStatus('3')"></nz-tab>
+            <nz-tab nzTitle="提现失败" (nzClick)="changeRefundStatus('5')"></nz-tab>
+            <nz-tab nzTitle="已拒绝" (nzClick)="changeRefundStatus('4')"></nz-tab>
+        </nz-tabset>
+    </div>
 
     <ng-template #extraTemplate>
         <div class="d-flex align-items-center ">
@@ -60,12 +65,14 @@
                     totalCallNo }}</strong>
                 <a *ngIf="totalCallNo > 0" (click)="st.clearCheck();totalCallNo=0" class="ml-lg">清空</a>
             </div>
+            <button nz-button nzDanger [nzLoading]="service.http.loading" (click)="openDrawer()">筛选</button>
+            <button nz-button nzDanger (click)="exprot()"> 导出</button>
             <button nz-button (click)="this.auditAction(null)">审核</button>
         </div>
     </ng-template>
 
     <st #st [data]="service.$api_get_refund_page" [columns]="columns" [req]="{  process: beforeReq }" [page]="{}"
-        [loading]="false" [scroll]="{ x:'1200px' }" (change)="stChange($event)">
+        [loading]="false" [scroll]="{ x:'1200px',y:scrollY }" (change)="stChange($event)">
         <ng-template st-row="bankCardNumber" let-item let-index="index" let-column="column">
             {{ item.bankName }} <br> {{ item.bankCardNumber }}
         </ng-template>

src/app/routes/financial-management/components/withdrawals-record/withdrawals-record.component.ts

@@ -2,36 +2,45 @@ import { Component, ViewChild } from '@angular/core';
 import { Router } from '@angular/router';
 import { STComponent, STColumn, STChange, STRequestOptions } from '@delon/abc/st';
 import { SFComponent, SFSchema, SFDateWidgetSchema } from '@delon/form';
+import { SearchDrawerService } from '@shared';
 import { NzModalService } from 'ng-zorro-antd/modal';
+import { BasicTableComponent } from 'src/app/routes/commom';
 
 import { FreightAccountService } from '../../services/freight-account.service';
 
 @Component({
   selector: 'app-withdrawals-record',
   templateUrl: './withdrawals-record.component.html',
-  styleUrls: ['../../../commom/less/box.less', '../../../commom/less/expend-but.less']
+  styleUrls: ['../../../commom/less/commom-table.less']
 })
-export class WithdrawalsRecordComponent {
+export class WithdrawalsRecordComponent extends BasicTableComponent {
   @ViewChild('st', { static: true })
   st!: STComponent;
-  @ViewChild('sf', { static: false })
-  sf!: SFComponent;
   @ViewChild('auditModal', { static: false })
   auditModal!: any;
   columns: STColumn[] = this.initST();
-  searchSchema: SFSchema = this.initSF();
-
-  _$expand = false;
+  schema: SFSchema = this.initSF();
 
   selectedRows: any[] = [];
   totalCallNo = 0;
   refundStatus: any = '';
 
   msg = '';
-  constructor(public service: FreightAccountService, private nzModalService: NzModalService, private router: Router) {}
+  constructor(
+    public service: FreightAccountService,
+    private nzModalService: NzModalService,
+    private router: Router,
+    public searchDrawerService: SearchDrawerService
+  ) {
+    super(searchDrawerService);
+  }
 
   ngOnInit(): void {}
 
+  search() {
+    this.st?.load(1);
+  }
+
   beforeReq = (requestOptions: STRequestOptions) => {
     if (this.sf) {
       Object.assign(requestOptions.body, {
@@ -40,10 +49,12 @@ export class WithdrawalsRecordComponent {
           start: this.sf.value.createTime?.[0] || '',
           end: this.sf.value.createTime?.[1] || ''
         },
-        refundStatus: this.refundStatus || null
       });
     }
     delete requestOptions?.body?.expand;
+    this.selectedRows = [];
+    this.totalCallNo = 0;
+    Object.assign(requestOptions.body, { refundStatus: this.refundStatus || null });
     return requestOptions;
   };
 
@@ -145,31 +156,9 @@ export class WithdrawalsRecordComponent {
     });
   }
 
-  /**
-   * 重置表单
-   */
-  resetSF() {
-    this.sf.reset();
-    this._$expand = false;
-  }
-
-  /**
-   * 伸缩查询条件
-   */
-  expandToggle() {
-    this._$expand = !this._$expand;
-    this.sf?.setValue('/expand', this._$expand);
-  }
-
   private initSF(): SFSchema {
     return {
       properties: {
-        expand: {
-          type: 'boolean',
-          ui: {
-            hidden: true
-          }
-        },
         refundApplyCode: {
           type: 'string',
           title: '提现单号',
@@ -209,10 +198,7 @@ export class WithdrawalsRecordComponent {
           ui: {
             widget: 'dict-select',
             params: { dictKey: 'bank:type' },
-            placeholder: '请选择',
-            visibleIf: {
-              expand: (value: boolean) => value
-            }
+            placeholder: '请选择'
           }
         },
         ltdId: {
@@ -222,10 +208,7 @@ export class WithdrawalsRecordComponent {
             widget: 'select',
             placeholder: '请选择',
             allowClear: true,
-            asyncData: () => this.service.getNetworkFreightForwarder(),
-            visibleIf: {
-              expand: (value: boolean) => value
-            }
+            asyncData: () => this.service.getNetworkFreightForwarder()
           }
         },
         bankType: {
@@ -234,10 +217,7 @@ export class WithdrawalsRecordComponent {
           ui: {
             widget: 'dict-select',
             params: { dictKey: 'bankname:type' },
-            placeholder: '请输入',
-            visibleIf: {
-              expand: (value: boolean) => value
-            }
+            placeholder: '请输入'
           }
         }
       }
@@ -246,7 +226,7 @@ export class WithdrawalsRecordComponent {
 
   private initST(): STColumn[] {
     return [
-      { title: '', index: 'key', type: 'checkbox' },
+      { title: '', index: 'key', type: 'checkbox', className: 'text-center' },
       { title: '提现时间', index: 'createTime', width: 180 },
       { title: '提现单号', index: 'refundApplyCode', width: 120 },
       { title: '网络货运人', index: 'ltdName', width: 140 },