149 lines
4.9 KiB
TypeScript
149 lines
4.9 KiB
TypeScript
import { Component, OnInit, ViewChild, NgZone } from '@angular/core';
|
||
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 { BusitablePillarComponent } from '../pillar/pillar.component';
|
||
import { BusitableCurveComponent } from './curve/curve.component';
|
||
|
||
@Component({
|
||
selector: 'app-datatable-busiindex',
|
||
templateUrl: './busiindex.component.html',
|
||
styleUrls: ['./busiindex.component.less'],
|
||
providers: [DatePipe]
|
||
|
||
})
|
||
export class DatatableBusiindexComponent implements OnInit {
|
||
@ViewChild('st') private readonly st!: STComponent;
|
||
@ViewChild('curve') private readonly curve!: BusitableCurveComponent;
|
||
@ViewChild('pillar') private readonly pillar!: BusitablePillarComponent;
|
||
type = 1;
|
||
mode = 'year';
|
||
date: any = null;
|
||
time: any = ['2022-01-01 00:00:00']
|
||
defineDate = [];
|
||
dateNext: any = null;
|
||
modeNext = 'year';
|
||
timeNext: any = ['2022-01-01 00:00:00']
|
||
dateFormat = 'yyyy';
|
||
today = new Date();
|
||
chartData: any = {}
|
||
|
||
columns: STColumn[] = [
|
||
{ title: '运营主体', index: 'networkTransporterName', className: 'text-center' },
|
||
{ title: '合伙人数', index: 'partnerNumber', className: 'text-center' },
|
||
{ title: '客户数', index: 'enterpriseNumbe', className: 'text-center' },
|
||
{ title: '订单数', index: 'zsl', className: 'text-center' },
|
||
{ title: '客户预存款', index: 'czcgje', className: 'text-right', type: 'widget', widget: { type: 'currency-chy', params: ({ record }) => ({ value: record.czcgje }) } },
|
||
{ title: '业绩量', index: 'yisje', className: 'text-center' },
|
||
{ title: '已收附加费', index: 'yisfjf', className: 'text-right', type: 'widget', widget: { type: 'currency-chy', params: ({ record }) => ({ value: record.yisfjf }) } },
|
||
{ title: '平均附加费率', index: 'fjfl', className: 'text-center',format: (item)=> {
|
||
return item.fjfl + '%'
|
||
} },
|
||
{ title: '已开票金额', index: 'ykpje', className: 'text-right', type: 'widget', widget: { type: 'currency-chy', params: ({ record }) => ({ value: record.ykpje }) } },
|
||
];
|
||
/**
|
||
* 查询参数
|
||
*/
|
||
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, private ngZone: NgZone) { }
|
||
ngOnInit(): void {
|
||
this.initData()
|
||
}
|
||
initData(flag?: boolean){
|
||
let type = 1
|
||
if(this.mode === 'year') {
|
||
type = 1
|
||
} else if(this.mode === 'month') {
|
||
type = 2
|
||
}
|
||
if(this.modeNext === 'year') {
|
||
type = 1
|
||
} else if(this.modeNext === 'month') {
|
||
type = 2
|
||
}
|
||
const params: any = {
|
||
time: this.timeNext,
|
||
type
|
||
};
|
||
this.service.request(this.service.$api_performanceReportHistogram, params).subscribe(res => {
|
||
if (res) {
|
||
this.chartData = res
|
||
if(flag) {
|
||
// this.pillar.reRender()
|
||
// this.curve.reRender()
|
||
}
|
||
}
|
||
})
|
||
}
|
||
changeData(){
|
||
if(this.mode === 'year') {
|
||
this.dateFormat = 'yyyy'
|
||
} else if(this.mode === 'month') {
|
||
this.dateFormat = 'yyyy-MM'
|
||
} else {
|
||
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']
|
||
} else if(this.mode === 'month') {
|
||
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']
|
||
} 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.st.reload({ ...this.reqParams });
|
||
}
|
||
|
||
changeDataNext() {
|
||
if(this.modeNext === 'year') {
|
||
this.dateFormat = 'yyyy'
|
||
} else if(this.modeNext === 'month') {
|
||
this.dateFormat = 'yyyy-MM'
|
||
}
|
||
}
|
||
onChangeNext(result: any) {
|
||
if(result === null) {
|
||
return
|
||
}
|
||
console.log(this.mode);
|
||
if(this.modeNext === 'year') {
|
||
this.timeNext = [this.datePipe.transform(this.dateNext, 'yyyy') + '-01-01 00:00:00']
|
||
} else if(this.modeNext === 'month') {
|
||
this.timeNext = [this.datePipe.transform(this.dateNext, 'yyyy-MM') + '-01 00:00:00']
|
||
|
||
console.log(this.dateNext);
|
||
console.log(this.timeNext);
|
||
|
||
}
|
||
this.initData(true)
|
||
}
|
||
disabledDate = (current: Date): boolean =>
|
||
// Can not select days before today and today
|
||
differenceInCalendarDays(current, this.today) > 0;
|
||
exportFun(){
|
||
|
||
}
|
||
}
|