解决冲突
This commit is contained in:
wangshiming
@ -1,3 +1,13 @@
|
||||
/*
|
||||
* @Description :
|
||||
* @Version : 1.0
|
||||
* @Author : Shiming
|
||||
* @Date : 2022-04-06 13:43:29
|
||||
* @LastEditors : Shiming
|
||||
* @LastEditTime : 2022-04-06 19:20:24
|
||||
* @FilePath : \\tms-obc-web\\src\\app\\routes\\datatable\\components\\customtable\\customindex\\curve\\curve.component.ts
|
||||
* Copyright (C) 2022 huzhenhong. All rights reserved.
|
||||
*/
|
||||
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';
|
||||
@ -23,7 +33,7 @@ export class DatatableCustomindexCurveComponent implements OnInit, OnChanges {
|
||||
}
|
||||
|
||||
ngOnInit(): void {
|
||||
|
||||
|
||||
}
|
||||
reRender() {
|
||||
setTimeout(() => {
|
||||
@ -36,6 +46,7 @@ export class DatatableCustomindexCurveComponent implements OnInit, OnChanges {
|
||||
setTimeout(() => {
|
||||
this.ngZone.runOutsideAngular(() => this.init(this.el));
|
||||
},500)
|
||||
console.log(this.chartData);
|
||||
}
|
||||
|
||||
private init(el: HTMLElement): void {
|
||||
|
||||
@ -4,7 +4,7 @@
|
||||
* @Author : Shiming
|
||||
* @Date : 2022-04-06 13:20:56
|
||||
* @LastEditors : Shiming
|
||||
* @LastEditTime : 2022-04-06 15:00:01
|
||||
* @LastEditTime : 2022-04-06 20:08:24
|
||||
* @FilePath : \\tms-obc-web\\src\\app\\routes\\datatable\\components\\customtable\\customindex\\customindex.component.html
|
||||
* Copyright (C) 2022 huzhenhong. All rights reserved.
|
||||
-->
|
||||
@ -64,12 +64,11 @@
|
||||
[columns]="columns"
|
||||
[ps]="20"
|
||||
[data]="reportData"
|
||||
[req]="{ method: 'POST', allInBody: true, reName: { pi: 'pageIndex', ps: 'pageSize' }, params: reqParams }"
|
||||
[scroll]="{ x: '1200px' }"
|
||||
[res]="{ reName: { list: 'data', total: 'data.total' } }"
|
||||
[page]="{ show: false, showSize: false, pageSizes: [20, 50, 100] }"
|
||||
>
|
||||
<ng-template sf-template="type" let-item>
|
||||
<ng-template st-row="type" let-item>
|
||||
<div *ngIf="item.type == '1'">货主</div>
|
||||
<div *ngIf="item.type == '2'">合伙人</div>
|
||||
<div *ngIf="item.type == '3'">司机</div>
|
||||
@ -77,11 +76,11 @@
|
||||
</ng-template>
|
||||
</st>
|
||||
</nz-card>
|
||||
<nz-card nzTitle="用户新增报表" [nzExtra]="extraTemplate">
|
||||
<nz-card nzTitle="用户新增报表" [nzExtra]="extraTemplate01">
|
||||
<ng-template #extraTemplate01>
|
||||
<div class="chooseBox">
|
||||
<div class="timeBox">
|
||||
<nz-radio-group [(ngModel)]="modeNext" nzButtonStyle="solid" (ngModelChange)="changeDataNext()">
|
||||
<nz-radio-group [(ngModel)]="modeNext" nzButtonStyle="solid" (ngModelChange)="changeDataNext2()">
|
||||
<label nz-radio-button nzValue="year">年</label>
|
||||
<label nz-radio-button nzValue="month">月</label>
|
||||
</nz-radio-group>
|
||||
@ -96,5 +95,5 @@
|
||||
</div>
|
||||
</div>
|
||||
</ng-template>
|
||||
<app-datatable-customindex-curve #curve [chartData]="chartData?.lineChart"></app-datatable-customindex-curve>
|
||||
<app-datatable-customindex-curve #curve [chartData]="chartData"></app-datatable-customindex-curve>
|
||||
</nz-card>
|
||||
|
||||
@ -1,5 +1,6 @@
|
||||
import { Component, OnInit, ViewChild } from '@angular/core';
|
||||
import { STColumn, STComponent } from '@delon/abc/st';
|
||||
import { SFComponent } from '@delon/form';
|
||||
import { DatePipe, _HttpClient } from '@delon/theme';
|
||||
import { differenceInCalendarDays } from 'date-fns';
|
||||
import { DataService } from '../../../services/data.service';
|
||||
@ -13,23 +14,25 @@ import { DatatableCustomindexCurveComponent } from './curve/curve.component';
|
||||
})
|
||||
export class DatatableCustomindexComponent implements OnInit {
|
||||
@ViewChild('st') private readonly st!: STComponent;
|
||||
@ViewChild('sf', { static: false }) sf!: SFComponent;
|
||||
@ViewChild('curve') private readonly curve!: DatatableCustomindexCurveComponent;
|
||||
type = 1;
|
||||
mode = 'year';
|
||||
date: any = null;
|
||||
defineDate = [];
|
||||
time: any = ['2022-01-01 00:00:00'];
|
||||
timeStart: any = '2022-01-01';
|
||||
timeEnd: any = '2022-12-31';
|
||||
dateFormat = 'yyyy';
|
||||
today = new Date();
|
||||
dateNext: any = null;
|
||||
modeNext = 'year';
|
||||
timeNext: any = ['2022-01-01 00:00:00'];
|
||||
chartData: any;
|
||||
chartData: any = [];
|
||||
flag = false;
|
||||
|
||||
columns: STColumn[] = [
|
||||
{ title: '用户类型', render: 'type', className: 'text-center' },
|
||||
{ title: '用户总数', index: '总数', className: 'text-center' },
|
||||
{ title: '用户总数', index: 'total', className: 'text-center' },
|
||||
{ title: '已认证数量', index: 'auditPassTotal', className: 'text-center' },
|
||||
{ title: '活跃用户数', index: 'activeTotal', className: 'text-center' },
|
||||
{ title: '未激活用户数', index: 'notActivationTotal', className: 'text-center' },
|
||||
@ -43,28 +46,6 @@ export class DatatableCustomindexComponent implements OnInit {
|
||||
clData: any;
|
||||
reportData: any = [];
|
||||
|
||||
/**
|
||||
* 查询参数
|
||||
*/
|
||||
get reqParams() {
|
||||
if (this.mode === 'year') {
|
||||
this.type = 1;
|
||||
} else if (this.mode === 'month') {
|
||||
this.type = 2;
|
||||
} else if (this.mode === 'date') {
|
||||
this.type = 3;
|
||||
} else {
|
||||
this.type = 4;
|
||||
}
|
||||
let params: any = {
|
||||
time: this.time,
|
||||
type: this.type
|
||||
};
|
||||
|
||||
delete params._$expand;
|
||||
return { ...params };
|
||||
}
|
||||
|
||||
constructor(public service: DataService, private datePipe: DatePipe) {}
|
||||
ngOnInit(): void {
|
||||
this.initCurveData();
|
||||
@ -81,41 +62,66 @@ export class DatatableCustomindexComponent implements OnInit {
|
||||
// type
|
||||
// };
|
||||
this.flag = true;
|
||||
|
||||
|
||||
this.cardData();
|
||||
this.listData();
|
||||
this.addData('year', '2022-01-01');
|
||||
}
|
||||
listData(type?: string, stime?: any, etime?: any) {
|
||||
console.log('88888');
|
||||
|
||||
this.reportData = [];
|
||||
this.service
|
||||
.request(this.service.$api_statistics_totalDetail, {
|
||||
time: this.timeNext,
|
||||
type: 1 //用户角色类型 1：货主 2：合伙人 3：司机 4：车辆
|
||||
dateStart: stime || this.timeStart,
|
||||
dateEnd: etime || this.timeEnd,
|
||||
type: 1 //用户角色类型 1：货主 2：合伙人 3：司机 4：车辆
|
||||
})
|
||||
.subscribe(res => {
|
||||
if (res) {
|
||||
this.reportData.push(res);
|
||||
this.st.reload();
|
||||
}
|
||||
});
|
||||
this.service.request(this.service.$api_statistics_totalDetail, {
|
||||
time: this.timeNext,
|
||||
type: 2
|
||||
}).subscribe(res => {
|
||||
if (res) {
|
||||
this.reportData.push(res);
|
||||
}
|
||||
});
|
||||
this.service.request(this.service.$api_statistics_totalDetail, {
|
||||
time: this.timeNext,
|
||||
type: 3
|
||||
}).subscribe(res => {
|
||||
if (res) {
|
||||
this.reportData.push(res);
|
||||
}
|
||||
});
|
||||
this.service.request(this.service.$api_statistics_totalDetail, {
|
||||
time: this.timeNext,
|
||||
type: 4
|
||||
}).subscribe(res => {
|
||||
if (res) {
|
||||
this.reportData.push(res);
|
||||
this.st.reload();
|
||||
}
|
||||
});
|
||||
this.service
|
||||
.request(this.service.$api_statistics_totalDetail, {
|
||||
dateStart: stime || this.timeStart,
|
||||
dateEnd: etime || this.timeEnd,
|
||||
type: 2
|
||||
})
|
||||
.subscribe(res => {
|
||||
if (res) {
|
||||
this.reportData.push(res);
|
||||
this.st.reload();
|
||||
}
|
||||
});
|
||||
this.service
|
||||
.request(this.service.$api_statistics_totalDetail, {
|
||||
dateStart: stime || this.timeStart,
|
||||
dateEnd: etime || this.timeEnd,
|
||||
type: 3
|
||||
})
|
||||
.subscribe(res => {
|
||||
if (res) {
|
||||
this.reportData.push(res);
|
||||
this.st.reload();
|
||||
}
|
||||
});
|
||||
this.service
|
||||
.request(this.service.$api_statistics_totalDetail, {
|
||||
dateStart: stime || this.timeStart,
|
||||
dateEnd: etime || this.timeEnd,
|
||||
type: 4
|
||||
})
|
||||
.subscribe(res => {
|
||||
if (res) {
|
||||
this.reportData.push(res);
|
||||
this.st.reload();
|
||||
}
|
||||
});
|
||||
}
|
||||
cardData() {
|
||||
this.service.request(this.service.$api_statistics_total, { type: 1 }).subscribe(res => {
|
||||
if (res) {
|
||||
this.hzData = res;
|
||||
@ -137,6 +143,57 @@ export class DatatableCustomindexComponent implements OnInit {
|
||||
}
|
||||
});
|
||||
}
|
||||
addData(type?: string, time?: any) {
|
||||
this.chartData = []
|
||||
this.service
|
||||
.request(this.service.$api_statistics_totalAdd, {
|
||||
date: time,
|
||||
dateType: type === 'month' ? 2 : 1, //日期类型 1：年 2：月
|
||||
type: 1
|
||||
})
|
||||
.subscribe(res => {
|
||||
if (res) {
|
||||
this.chartData.push(...res);
|
||||
this.curve.reRender();
|
||||
}
|
||||
});
|
||||
this.service
|
||||
.request(this.service.$api_statistics_totalAdd, {
|
||||
date: time,
|
||||
dateType: type === 'month' ? 2 : 1, //日期类型 1：年 2：月
|
||||
type: 2
|
||||
})
|
||||
.subscribe(res => {
|
||||
if (res) {
|
||||
this.chartData.push(...res);
|
||||
this.curve.reRender();
|
||||
}
|
||||
});
|
||||
this.service
|
||||
.request(this.service.$api_statistics_totalAdd, {
|
||||
date: time,
|
||||
dateType: type === 'month' ? 2 : 1, //日期类型 1：年 2：月
|
||||
type: 3
|
||||
})
|
||||
.subscribe(res => {
|
||||
if (res) {
|
||||
this.chartData.push(...res);
|
||||
this.curve.reRender();
|
||||
}
|
||||
});
|
||||
this.service
|
||||
.request(this.service.$api_statistics_totalAdd, {
|
||||
date: time,
|
||||
dateType: type === 'month' ? 2 : 1, //日期类型 1：年 2：月
|
||||
type: 4
|
||||
})
|
||||
.subscribe(res => {
|
||||
if (res) {
|
||||
this.chartData.push(...res);
|
||||
this.curve.reRender();
|
||||
}
|
||||
});
|
||||
}
|
||||
|
||||
changeData() {
|
||||
if (this.mode === 'year') {
|
||||
@ -149,27 +206,29 @@ export class DatatableCustomindexComponent implements OnInit {
|
||||
}
|
||||
onChange(result: any) {
|
||||
if (this.mode === 'year') {
|
||||
this.time = [this.datePipe.transform(this.date, 'yyyy') + '-01-01 00:00:00'];
|
||||
this.timeStart = this.datePipe.transform(this.date, 'yyyy') + '-01-01';
|
||||
this.timeEnd = this.datePipe.transform(this.date, 'yyyy') + '-12-31';
|
||||
|
||||
} else if (this.mode === 'month') {
|
||||
this.time = [this.datePipe.transform(this.date, 'yyyy-MM') + '-01 00:00:00'];
|
||||
this.timeStart = this.datePipe.transform(this.date, 'yyyy-MM') + '-01' ;
|
||||
this.timeEnd = this.datePipe.transform(this.date, 'yyyy-MM') + '-31';
|
||||
} else if (this.mode === 'date') {
|
||||
this.time = [this.datePipe.transform(this.date, 'yyyy-MM-dd') + ' 00:00:00'];
|
||||
this.timeStart=this.datePipe.transform(this.date, 'yyyy-MM-dd');
|
||||
this.timeEnd = this.datePipe.transform(this.date, 'yyyy-MM-dd') ;
|
||||
} 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.timeStart = this.datePipe.transform(this.defineDate[0], 'yyyy-MM-dd') ;
|
||||
this.timeEnd = this.datePipe.transform(this.defineDate[1], 'yyyy-MM-dd');
|
||||
}
|
||||
this.st.reload({ ...this.reqParams });
|
||||
this.listData(this.mode, this.timeStart, this.timeEnd);
|
||||
}
|
||||
disabledDate = (current: Date): boolean =>
|
||||
// Can not select days before today and today
|
||||
differenceInCalendarDays(current, this.today) > 0;
|
||||
|
||||
changeDataNext() {
|
||||
if (this.mode === 'year') {
|
||||
changeDataNext2() {
|
||||
if (this.modeNext === 'year') {
|
||||
this.dateFormat = 'yyyy';
|
||||
} else if (this.mode === 'month') {
|
||||
} else if (this.modeNext === 'month') {
|
||||
this.dateFormat = 'yyyy-MM';
|
||||
}
|
||||
}
|
||||
@ -177,11 +236,11 @@ export class DatatableCustomindexComponent implements OnInit {
|
||||
if (result === null) {
|
||||
return;
|
||||
}
|
||||
if (this.mode === 'year') {
|
||||
this.timeNext = [this.datePipe.transform(this.dateNext, 'yyyy') + '-01-01 00:00:00'];
|
||||
} else if (this.mode === 'month') {
|
||||
this.timeNext = [this.datePipe.transform(this.dateNext, 'yyyy-MM') + '-01 00:00:00'];
|
||||
if (this.modeNext === 'year') {
|
||||
this.timeNext = this.datePipe.transform(this.dateNext, 'yyyy') + '-01-01';
|
||||
} else if (this.modeNext === 'month') {
|
||||
this.timeNext = this.datePipe.transform(this.dateNext, 'yyyy-MM') + '-01';
|
||||
}
|
||||
this.initCurveData();
|
||||
this.addData(this.modeNext, this.timeNext);
|
||||
}
|
||||
}
|
||||
|
||||
Reference in New Issue
Block a user