fix bug

src/app/routes/datatable/components/customtable/customindex/curve/curve.component.html

@@ -0,0 +1 @@
+<g2-custom delay="100" (render)="render($event)"></g2-custom>

src/app/routes/datatable/components/customtable/customindex/curve/curve.component.ts

@@ -0,0 +1,81 @@
+import { Component, ElementRef, Input, NgZone, OnChanges, OnInit, SimpleChanges, ViewChild } from '@angular/core';
+import { Chart } from '@antv/g2';
+import { DataService } from 'src/app/routes/datatable/services/data.service';
+@Component({
+  selector: 'app-datatable-customindex-curve',
+  templateUrl: './curve.component.html',
+  styleUrls: ['./curve.component.less']
+})
+export class DatatableCustomindexCurveComponent implements OnInit, OnChanges {
+  el: any;
+  @Input() chartData: any;
+  chart: any;
+  constructor(private service: DataService, private ngZone: NgZone) {
+
+  }
+  ngOnChanges(changes: SimpleChanges): void {
+    if (this.chartData) {
+      // setTimeout(()=>{
+      //   this.chart.render(true)
+      // }, 1000)
+
+    }
+  }
+
+  ngOnInit(): void {
+
+  }
+  reRender() {
+    setTimeout(() => {
+      this.chart.data(this.chartData);
+      this.chart.render();
+    }, 1000)
+  }
+  render(el: ElementRef<HTMLDivElement>): void {
+    this.el = el.nativeElement
+    setTimeout(() => {
+      this.ngZone.runOutsideAngular(() => this.init(this.el));
+      },500)
+  }
+
+  private init(el: HTMLElement): void {
+    this.chart = new Chart({
+      container: el,
+      autoFit: true,
+      height: 500,
+    });
+
+    this.chart.data(this.chartData);
+    this.chart.scale({
+      time: {
+        range: [0, 1],
+      },
+      number: {
+        nice: true,
+      },
+    });
+    
+    this.chart.tooltip({
+      showCrosshairs: true,
+      shared: true,
+    });
+    
+    this.chart.axis('number', {
+      label: {
+        formatter: (val: any) => {
+          return val;
+        },
+      },
+    });
+    
+    this.chart
+      .line()
+      .position('time*number')
+      .color('name')
+    
+    
+    this.chart.render();
+    
+  }
+
+}

src/app/routes/datatable/components/customtable/customindex/customindex.component.html

@@ -1,20 +1,30 @@
+<!--
+ * @Description  : 
+ * @Version      : 1.0
+ * @Author       : Shiming
+ * @Date         : 2022-04-06 13:20:56
+ * @LastEditors  : Shiming
+ * @LastEditTime : 2022-04-06 13:55:19
+ * @FilePath     : \\tms-obc-web\\src\\app\\routes\\datatable\\components\\customtable\\customindex\\customindex.component.html
+ * Copyright (C) 2022 huzhenhong. All rights reserved.
+-->
 <!-- 页头 -->
 <page-header-wrapper [title]="'客户报表'"></page-header-wrapper>
 <div nz-row [nzGutter]="16">
   <div nz-col class="gutter-row" [nzSpan]="6">
-    <g2-card [title]="'货主'" [bordered]="true" [total]="'¥ 126,560.00'" footer="日访问量 12,423" contentHeight="46">
+    <g2-card [title]="'货主'" [bordered]="true" [total]="hzData?.total" [footer]="'已认证' + hzData?.auditPassTotal" contentHeight="46">
     </g2-card>
   </div>
   <div nz-col class="gutter-row" [nzSpan]="6">
-    <g2-card [title]="'合伙人'" [bordered]="true" [total]="'¥ 126,560.00'" footer="日访问量 12,423" contentHeight="46">
+    <g2-card [title]="'合伙人'" [bordered]="true" [total]="hhrData?.total" [footer]="'已认证' + hhrData?.auditPassTotal" contentHeight="46">
     </g2-card>
   </div>
   <div nz-col class="gutter-row" [nzSpan]="6">
-    <g2-card [title]="'司机'" [bordered]="true" [total]="'¥ 126,560.00'" footer="日访问量 12,423" contentHeight="46">
+    <g2-card [title]="'司机'" [bordered]="true" [total]="sjData?.total" [footer]="'已认证' + sjData?.auditPassTotal" contentHeight="46">
     </g2-card>
   </div>
   <div nz-col class="gutter-row" [nzSpan]="6">
-    <g2-card [title]="'车辆'" [bordered]="true" [total]="'¥ 126,560.00'" footer="日访问量 12,423" contentHeight="46">
+    <g2-card [title]="'车辆'" [bordered]="true" [total]="clData?.total" [footer]="'已认证' + clData?.auditPassTotal" contentHeight="46">
     </g2-card>
   </div>
 </div>
@@ -55,5 +65,5 @@
       </div>
     </div>
   </ng-template>
-  <app-operation-curve #curve [chartData]="chartData.lineChart"></app-operation-curve>
+  <app-datatable-customindex-curve #curve [chartData]="chartData.lineChart"></app-datatable-customindex-curve>
 </nz-card>

src/app/routes/datatable/components/customtable/customindex/customindex.component.ts

@@ -3,32 +3,30 @@ import { STColumn, STComponent } from '@delon/abc/st';
 import { DatePipe, _HttpClient } from '@delon/theme';
 import { differenceInCalendarDays } from 'date-fns';
 import { DataService } from '../../../services/data.service';
-import { OperationCurveComponent } from '../../operationtable/curve/curve.component';
+import { DatatableCustomindexCurveComponent } from './curve/curve.component';
 
 @Component({
   selector: 'app-datatable-customindex',
   templateUrl: './customindex.component.html',
   styleUrls: ['./customindex.component.less'],
   providers: [DatePipe]
-
 })
 export class DatatableCustomindexComponent implements OnInit {
   @ViewChild('st') private readonly st!: STComponent;
-  @ViewChild('curve') private readonly curve!: OperationCurveComponent;
+  @ViewChild('curve') private readonly curve!: DatatableCustomindexCurveComponent;
   type = 1;
   mode = 'year';
   date: any = null;
   defineDate = [];
-  time: any = ['2022-01-01 00:00:00']
+  time: any = ['2022-01-01 00:00:00'];
   dateFormat = 'yyyy';
   today = new Date();
   dateNext: any = null;
   modeNext = 'year';
-  timeNext: any = ['2022-01-01 00:00:00']
+  timeNext: any = ['2022-01-01 00:00:00'];
   chartData: any;
   flag = false;
 
-
   columns: STColumn[] = [
     { title: '用户类型', index: 'networkTransporterName', className: 'text-center' },
     { title: '用户总数', index: 'zsl', className: 'text-center' },
@@ -39,18 +37,22 @@ export class DatatableCustomindexComponent implements OnInit {
     { title: '流失用户数', index: 'djd', className: 'text-center' },
     { title: '流失率', index: 'ysz', className: 'text-center' }
   ];
+  hzData: any;
+  hhrData: any;
+  sjData: any;
+  clData: any;
   /**
    * 查询参数
    */
   get reqParams() {
     if (this.mode === 'year') {
-      this.type = 1
+      this.type = 1;
     } else if (this.mode === 'month') {
-      this.type = 2
+      this.type = 2;
     } else if (this.mode === 'date') {
-      this.type = 3
+      this.type = 3;
     } else {
-      this.type = 4
+      this.type = 4;
     }
     let params: any = {
       time: this.time,
@@ -61,50 +63,100 @@ export class DatatableCustomindexComponent implements OnInit {
     return { ...params };
   }
 
-  constructor(public service: DataService, private datePipe: DatePipe) { }
+  constructor(public service: DataService, private datePipe: DatePipe) {}
   ngOnInit(): void {
-    this.initCurveData()
+    this.initCurveData();
   }
   initCurveData() {
-    let type = 1
+    let type = 1;
     if (this.mode === 'year') {
-      type = 1
+      type = 1;
     } else if (this.mode === 'month') {
-      type = 2
+      type = 2;
     }
-    const params: any = {
+    // const params: any = {
+    //   time: this.timeNext,
+    //   type
+    // };
+    this.flag = true;
+    
+    this.service
+      .request(this.service.$api_statistics_totalDetail, {
         time: this.timeNext,
-      type
+        type: 1
-    };
-    this.flag = true
-    this.service.request(this.service.$api_operationalReportHistogram, params).subscribe(res => {
-      if (res) {
-        this.chartData = res
-        if (this.flag) {
-          this.curve.reRender()
-        }
-      }
       })
+      .subscribe(res => {
+        if (res) {
+          this.chartData = res;
+        }
+      });
+    this.service.request(this.service.$api_statistics_totalDetail, {
+      time: this.timeNext,
+      type: 2
+    }).subscribe(res => {
+      if (res) {
+        this.chartData = res;
+      }
+    });
+    this.service.request(this.service.$api_statistics_totalDetail, {
+      time: this.timeNext,
+      type: 3
+    }).subscribe(res => {
+      if (res) {
+        this.chartData = res;
+      }
+    });
+    this.service.request(this.service.$api_statistics_totalDetail, {
+      time: this.timeNext,
+      type: 4
+    }).subscribe(res => {
+      if (res) {
+        this.chartData = res;
+      }
+    });
+    this.service.request(this.service.$api_statistics_total, { type: 1 }).subscribe(res => {
+      if (res) {
+        this.hzData = res;
+      }
+    });
+    this.service.request(this.service.$api_statistics_total, { type: 2 }).subscribe(res => {
+      if (res) {
+        this.hhrData = res;
+      }
+    });
+    this.service.request(this.service.$api_statistics_total, { type: 3 }).subscribe(res => {
+      if (res) {
+        this.sjData = res;
+      }
+    });
+    this.service.request(this.service.$api_statistics_total, { type: 4 }).subscribe(res => {
+      if (res) {
+        this.clData = res;
+      }
+    });
   }
 
   changeData() {
     if (this.mode === 'year') {
-      this.dateFormat = 'yyyy'
+      this.dateFormat = 'yyyy';
     } else if (this.mode === 'month') {
-      this.dateFormat = 'yyyy-MM'
+      this.dateFormat = 'yyyy-MM';
     } else {
-      this.dateFormat = 'yyyy-MM-dd'
+      this.dateFormat = 'yyyy-MM-dd';
     }
   }
   onChange(result: any) {
     if (this.mode === 'year') {
-      this.time = [this.datePipe.transform(this.date, 'yyyy') + '-01-01 00:00:00']
+      this.time = [this.datePipe.transform(this.date, 'yyyy') + '-01-01 00:00:00'];
     } else if (this.mode === 'month') {
-      this.time = [this.datePipe.transform(this.date, 'yyyy-MM') + '-01 00:00:00']
+      this.time = [this.datePipe.transform(this.date, 'yyyy-MM') + '-01 00:00:00'];
     } else if (this.mode === 'date') {
-      this.time = [this.datePipe.transform(this.date, 'yyyy-MM-dd') + ' 00:00:00']
+      this.time = [this.datePipe.transform(this.date, 'yyyy-MM-dd') + ' 00:00:00'];
     } else {
-      this.time = [this.datePipe.transform(this.defineDate[0], 'yyyy-MM-dd') + '00:00:00', this.datePipe.transform(this.defineDate[1], 'yyyy-MM-dd') + ' 00:00:00']
+      this.time = [
+        this.datePipe.transform(this.defineDate[0], 'yyyy-MM-dd') + '00:00:00',
+        this.datePipe.transform(this.defineDate[1], 'yyyy-MM-dd') + ' 00:00:00'
+      ];
     }
     this.st.reload({ ...this.reqParams });
   }
@@ -112,24 +164,22 @@ export class DatatableCustomindexComponent implements OnInit {
     // Can not select days before today and today
     differenceInCalendarDays(current, this.today) > 0;
 
-
   changeDataNext() {
-    if(this.mode === 'year') {
+    if (this.mode === 'year') {
-      this.dateFormat = 'yyyy'
+      this.dateFormat = 'yyyy';
-    } else if(this.mode === 'month') {
+    } else if (this.mode === 'month') {
-      this.dateFormat = 'yyyy-MM'
+      this.dateFormat = 'yyyy-MM';
     }
   }
   onChangeNext(result: any) {
-    if(result === null) {
+    if (result === null) {
-      return
+      return;
     }
-    if(this.mode === 'year') {
+    if (this.mode === 'year') {
-      this.timeNext = [this.datePipe.transform(this.dateNext, 'yyyy') + '-01-01 00:00:00']
+      this.timeNext = [this.datePipe.transform(this.dateNext, 'yyyy') + '-01-01 00:00:00'];
-    } else if(this.mode === 'month') {
+    } else if (this.mode === 'month') {
-      this.timeNext = [this.datePipe.transform(this.dateNext, 'yyyy-MM') + '-01 00:00:00']
+      this.timeNext = [this.datePipe.transform(this.dateNext, 'yyyy-MM') + '-01 00:00:00'];
     }
-    this.initCurveData()
+    this.initCurveData();
   }
-
 }

src/app/routes/datatable/datatable.module.ts

@@ -29,6 +29,7 @@ import { DatatableDatascreenComponent } from './components/datascreen/datascreen
 import { FinancetablePillarComponent } from './components/financetable/pillar/pillar.component';
 import { ComplianceCurveComponent } from './components/compliance/index/curve/curve.component';
 import { BusitableCurveComponent } from './components/busitable/busiindex/curve/curve.component';
+import { DatatableCustomindexCurveComponent } from './components/customtable/customindex/curve/curve.component';
 
 const COMPONENTS: Type<void>[] = [
   DatatableDataindexComponent,
@@ -60,7 +61,8 @@ const COMPONENTS: Type<void>[] = [
   DatatableDatascreenComponent,
   FinancetablePillarComponent,
   ComplianceCurveComponent,
-  BusitableCurveComponent
+  BusitableCurveComponent,
+  DatatableCustomindexCurveComponent
 ]
 
 

src/app/routes/datatable/services/data.service.ts

@@ -4,8 +4,8 @@
  * @Author       : Shiming
  * @Date         : 2021-12-27 10:30:56
  * @LastEditors  : Shiming
- * @LastEditTime : 2022-01-18 17:14:59
+ * @LastEditTime : 2022-04-06 13:47:25
- * @FilePath     : \\tms-obc-web\\src\\app\\routes\\account\\services\\account.service.ts
+ * @FilePath     : \\tms-obc-web\\src\\app\\routes\\datatable\\services\\data.service.ts
  * Copyright (C) 2022 huzhenhong. All rights reserved.
  */
 
@@ -58,6 +58,12 @@ export class DataService extends BaseService {
   $api_listMonitorSituation = `/api/sdc/reportComplianceMonitor/listMonitorSituation`;
 
 
+  // 客户报表-根据类型获取统计信息(card)
+  $api_statistics_total = `/api/mdc/cuc/statistics/total`;
+  // 客户报表-根据类型获取统计明细信息(table)
+  $api_statistics_totalDetail = `/api/mdc/cuc/statistics/totalDetail`;
+
+
 
   constructor(public injector: Injector) {
     super(injector);

src/app/routes/order-management/components/bulk/bulk.component.ts

@@ -851,10 +851,6 @@ export class OrderManagementBulkComponent implements OnInit {
   }
   // 导出
   exprot() {
-    this.service.request(this.service.$api_get_asyncExportBulkList, this.reqParams).subscribe((res: any) => {
+    this.service.asyncExport(this.reqParams,this.service.$api_get_asyncExportBulkList);
-      if (res) {
-        this.service.msgSrv.success('导出成功，请去下载中心下载！');
-      }
-    });
   }
 }

src/app/routes/order-management/components/compliance-audit/compliance-audit.component.ts

@@ -696,10 +696,6 @@ export class OrderManagementComplianceAuditComponent implements OnInit {
   }
     // 导出
     exprot() {
-      this.service.request(this.service.$api_get_asyncExportSpotCheckList, this.reqParams).subscribe((res: any) => {
+      this.service.asyncExport(this.reqParams, this.service.$api_get_asyncExportSpotCheckList);
-        if (res) {
-          this.service.msgSrv.success('导出成功，请去下载中心下载！');
-        }
-      });
     }
 }

src/app/routes/order-management/components/receipts-audit/receipts-audit.component.ts

@@ -578,10 +578,6 @@ export class OrderManagementReceiptsAuditComponent implements OnInit {
   }
       // 导出
       exprot() {
-        this.service.request(this.service.$api_get_asyncExportExamineBillList, this.reqParams).subscribe((res: any) => {
+        this.service.asyncExport(this.reqParams, this.service.$api_get_asyncExportExamineBillList);
-          if (res) {
-            this.service.msgSrv.success('导出成功，请去下载中心下载！');
-          }
-        });
       }
 }

src/app/routes/order-management/components/risk/risk.component.ts

@@ -534,10 +534,6 @@ export class OrderManagementRiskComponent implements OnInit {
   }
     // 导出
     exprot() {
-      this.service.request(this.service.$api_get_asyncExportRiskBillList, this.reqParams).subscribe((res: any) => {
+      this.service.asyncExport(this.reqParams, this.service.$api_get_asyncExportRiskBillList);
-        if (res) {
-          this.service.msgSrv.success('导出成功，请去下载中心下载！');
-        }
-      });
     }
 }

src/app/routes/order-management/components/vehicle/vehicle.component.ts

@@ -866,10 +866,6 @@ export class OrderManagementVehicleComponent extends BasicTableComponent impleme
   }
     // 导出
     exprot() {
-      this.service.request(this.service.$api_get_asyncExportWholeList, this.reqParams).subscribe((res: any) => {
+      this.service.asyncExport(this.reqParams, this.service.$api_get_asyncExportWholeList);
-        if (res) {
-          this.service.msgSrv.success('导出成功，请去下载中心下载！');
-        }
-      });
     }
 }

src/app/routes/supply-management/components/bulk/bulk.component.ts

@@ -568,10 +568,6 @@ export class SupplyManagementBulkComponent implements OnInit {
   userAction() {}
   // 导出
   exportFire() {
-    this.service.request(this.service.$api_asyncExportBulkList, this.reqParams).subscribe((res: any) => {
+    this.service.asyncExport(this.reqParams, this.service.$api_asyncExportBulkList);
-      if (res) {
-        this.service.msgSrv.success('导出成功，请去下载中心下载！');
-      }
-    });
   }
 }

src/app/routes/supply-management/components/vehicle/vehicle.component.ts

@@ -685,10 +685,6 @@ export class SupplyManagementVehicleComponent implements OnInit {
   }
   // 导出
   exportFire() {
-    this.service.request(this.service.$api_asyncExportWholeList, this.reqParams).subscribe((res: any) => {
+    this.service.asyncExport(this.reqParams, this.service.$api_asyncExportWholeList);
-      if (res) {
-        this.service.msgSrv.success('导出成功，请去下载中心下载！');
-      }
-    });
   }
 }

src/app/routes/waybill-management/components/bulk/bulk.component.ts

@@ -477,10 +477,6 @@ export class WaybillManagementBulkComponent implements OnInit {
   }
      // 导出
      exprot() {
-      this.service.request(this.service.$api_asyncExportBulkList, this.reqParams).subscribe((res: any) => {
+      this.service.asyncExport(this.reqParams,this.service.$api_asyncExportBulkList)
-        if (res) {
-          this.service.msgSrv.success('导出成功，请去下载中心下载！');
-        }
-      });
     }
 }

src/app/routes/waybill-management/components/vehicle/vehicle.component.ts

@@ -486,10 +486,6 @@ export class WaybillManagementVehicleComponent implements OnInit {
   }
   // 导出
   exprot() {
-    this.service.request(this.service.$api_asyncExportWholeList, this.reqParams).subscribe((res: any) => {
+    this.service.asyncExport(this.reqParams, this.service.$api_asyncExportWholeList);
-      if (res) {
-        this.service.msgSrv.success('导出成功，请去下载中心下载！');
-      }
-    });
   }
 }