Rainie/bbq
1
0
Fork 0
Code Issues Pull Requests Projects Releases Wiki Activity

解决冲突

Browse Source
This commit is contained in:
wangshiming
2022-04-07 18:27:27 +08:00
parent deec1b0bd6
commit 7b0f2d49b5
9 changed files with 209 additions and 33 deletions
Download Patch File Download Diff File Expand all files Collapse all files

2
src/app/routes/datatable/components/datascreen/curve/curve.component.html Normal file
View File

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

0
src/app/routes/datatable/components/datascreen/curve/map.component.less → src/app/routes/datatable/components/datascreen/curve/curve.component.less
View File

133
src/app/routes/datatable/components/datascreen/curve/curve.component.ts Normal file
View File

@ -0,0 +1,133 @@
/*
* @Description :
* @Version : 1.0
* @Author : Shiming
* @Date : 2022-04-07 17:57:23
* @LastEditors : Shiming
* @LastEditTime : 2022-04-07 18:24:57
* @FilePath : \\tms-obc-web\\src\\app\\routes\\datatable\\components\\datascreen\\curve\\curve.component.ts
* Copyright (C) 2022 huzhenhong. All rights reserved.
*/
import { Component, ElementRef, Input, NgZone, OnChanges, OnInit, SimpleChanges, ViewChild } from '@angular/core';
import { G2MiniAreaClickItem } from '@delon/chart/mini-area';
import { DataService } from '../../../services/data.service';
// import DataSet from '@antv/data-set';
const DataSet = require('@antv/data-set');
import { Chart } from '@antv/g2';
@Component({
selector: 'app-financetable-curve-min',
templateUrl: './curve.component.html',
styleUrls: ['./curve.component.less']
})
export class DatatableCustomindexCurveMinComponent implements OnInit,OnChanges {
el: any;
@Input() chartData: any;
chart: any;
data = [
{ time: '01', type: '订单数', temperature: 7 },
{ time: '02', city: '运单数', temperature: 3.9 },
{ time: '03', city: '订单数', temperature: 6.9 },
{ time: '04', city: '订单数', temperature: 4.2 },
{ time: '05', city: '订单数', temperature: 9.5 },
{ time: '06', city: '订单数', temperature: 5.7 },
{ time: '06', city: '运单数', temperature: 5.7 },
{ time: '07', city: '运单数', temperature: 14.5 },
{ time: '08', city: '订单数', temperature: 8.5 },
{ time: '09', city: '订单数', temperature: 18.4 },
{ time: '10', city: '订单数', temperature: 11.9 },
{ time: '11', city: '订单数', temperature: 21.5 },
{ time: '12', city: '订单数', temperature: 15.2 },
{ time: '08', city: '运单数', temperature: 8.5 },
{ time: '09', city: '运单数', temperature: 18.4 },
{ time: '10', city: '运单数', temperature: 11.9 },
{ time: '11', city: '运单数', temperature: 21.5 },
{ time: '12', city: '订单数', temperature: 15.2 },
];
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));
}, 1000)
}
private init(el: HTMLElement): void {
this.chart = new Chart({
container: el,
autoFit: true,
height: 500,
});
let value: any = []
this.service.request(this.service.$api_getTradingTrend).subscribe((res: any) => {
if(res) {
res.forEach((element: any) => {
value.push({
time: element?.time,
type: element?.type,
temperature: element?.value,
});
});
console.log(value);
this.chartData = value
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('temperature', {
label: {
formatter: (val: any) => {
return val + '万';
},
},
});
this.chart
.line()
.position('time*temperature')
.color('city')
.shape('smooth');
this.chart
.point()
.position('time*temperature')
.color('city')
.shape('circle');
this.chart.render();
};
});
}
}

9
src/app/routes/datatable/components/datascreen/datascreen.component.html
View File

@ -4,7 +4,7 @@
* @Author : Shiming
* @Date : 2022-04-06 10:57:56
* @LastEditors : Shiming
* @LastEditTime : 2022-04-07 16:57:05
* @LastEditTime : 2022-04-07 18:02:07
* @FilePath : \\tms-obc-web\\src\\app\\routes\\datatable\\components\\datascreen\\datascreen.component.html
* Copyright (C) 2022 huzhenhong. All rights reserved.
-->
@ -43,15 +43,16 @@
</nz-row>
</nz-card>
<nz-card nzTitle="本月交易趋势">
<g2-timeline repaint='true'
<!-- <g2-timeline
[data]="monthData2"
#timeline
[titleMap]="{ y1: '订单数', y2: '运单数' }"
[height]="200"
[delay]='200'
mask="MM月DD日"
mask="MM"
[slider]="false"
></g2-timeline>
></g2-timeline> -->
<app-financetable-curve-min #curve [chartData]='chartData2'></app-financetable-curve-min>
</nz-card>
<nz-card nzTitle="实时货源">
<st

60
src/app/routes/datatable/components/datascreen/datascreen.component.ts
View File

@ -5,7 +5,7 @@ import { map } from 'rxjs/operators';
* @Author : Shiming
* @Date : 2022-04-06 10:57:56
* @LastEditors : Shiming
* @LastEditTime : 2022-04-07 16:58:19
* @LastEditTime : 2022-04-07 18:02:02
* @FilePath : \\tms-obc-web\\src\\app\\routes\\datatable\\components\\datascreen\\datascreen.component.ts
* Copyright (C) 2022 huzhenhong. All rights reserved.
*/
@ -14,10 +14,11 @@ import { STColumn, STComponent } from '@delon/abc/st';
import { SFSchema } from '@delon/form';
import { ModalHelper, _HttpClient } from '@delon/theme';
import { DataService } from '../../services/data.service';
import { DatatableCustomindexMapComponent } from './curve/map.component';
import { DatatableCustomindexMapComponent } from './map/map.component';
import { G2TimelineComponent, G2TimelineData } from '@delon/chart/timeline';
import { G2MiniAreaClickItem, G2MiniAreaData } from '@delon/chart/mini-area';
import { format } from 'date-fns';
import { FinanceTableCurveComponent } from '../financetable/curve/curve.component';
@Component({
selector: 'app-datatable-datascreen',
@ -29,10 +30,12 @@ export class DatatableDatascreenComponent implements OnInit {
@ViewChild('orderSt') private readonly orderSt!: STComponent;
@ViewChild('map') private readonly map!: DatatableCustomindexMapComponent;
@ViewChild('timeline', { static: false }) timeline!: G2TimelineComponent;
@ViewChild('curve') private readonly curve!: FinanceTableCurveComponent;
columns: STColumn[] = [];
chartData: any[] = [];
orderColumns: STColumn[] = [];
chartData2: any = {}
allDeal: any;
headDeal: any;
classifyDeal: any;
@ -40,7 +43,7 @@ export class DatatableDatascreenComponent implements OnInit {
todayTime: string = '';
monthData: G2TimelineData[] = [];
monthData2: Array<any> = this.genData2();
monthData2:G2TimelineData[] =[];
salesData2: Array<any> = this.genData();
constructor(public service: DataService) {}
ngOnChanges(changes: any): void {
@ -64,6 +67,7 @@ export class DatatableDatascreenComponent implements OnInit {
this.initST();
this.initOrderST();
this.initData();
this.genData2();
// this.initLineData();
}
setTime() {
@ -126,24 +130,46 @@ export class DatatableDatascreenComponent implements OnInit {
console.log(value);
return value;
}
private genData2(): G2TimelineData[] {
let ress: G2TimelineData[] = [];
this.service.request(this.service.$api_getTradingTrend).subscribe((res: any) => {
initPillarData(){
this.service.request(this.service.$api_getTradingTrend).subscribe(res => {
if (res) {
res.forEach((element: any) => {
ress.push({
time: element.time,
y1: element.billQuantity,
y2: element.wayBillQuantity
this.chartData2 = res
this.curve.reRender()
}
})
}
public genData2(): G2TimelineData[] {
let value1: any[] = [];
this.monthData2 =[];
this.service.request(this.service.$api_getTradingTrend).subscribe((res: any) => {
if (res) {
// var data1 = new Date('2022.1.1')
// var time1 = data1.getTime();
// console.log(time1);
var data2 = new Date('2022.2.1')
var time2 = data2.getTime();
console.log(time2);
var data3 = new Date('2022.3.1')
res.forEach((element: any,i:any) => {
console.log(element);
console.log(new Date().getTime() + 1000 * 60 * 60 * 24 * 2);
console.log(time2);
value1.push({
time:'Feb',
y1: element?.y1,
y2: element?.y2
});
});
console.log(ress);
this.monthData2 = res;
console.log(this.monthData2);
}
});
if(!ress) {
setTimeout(() => {},100)
}
return ress;
console.log(this.monthData2);
return value1;
}
/**
* 初始化数据列表

0
src/app/routes/datatable/components/datascreen/curve/map.component.html → src/app/routes/datatable/components/datascreen/map/map.component.html
View File

0
src/app/routes/datatable/components/datascreen/map/map.component.less Normal file
View File

32
src/app/routes/datatable/components/datascreen/curve/map.component.ts → src/app/routes/datatable/components/datascreen/map/map.component.ts
View File

@ -87,16 +87,27 @@ export class DatatableCustomindexMapComponent implements OnInit, OnChanges {
});
// 可视化用户数据
this.userData = [
{ name: '山东', value: 21 },
{ name: '山东', value: 22},
{ name: '广东', value: 20, },
{ name: '广东', value: 20 },
{ name: '四川', value: 120 },
{ name: '湖南', value: 200 },
{ name: '河北', value: 30 },
// this.userData = [
// { name: '山东', value: 21 },
// { name: '山东', value: 22},
// { name: '广东', value: 20, },
// { name: '广东', value: 20 },
// { name: '四川', value: 120 },
// { name: '湖南', value: 200 },
// { name: '河北', value: 30 },
];
// ];
let value: any = []
this.service.request(this.service.$api_getTransactionDistribution).subscribe((res: any) => {
if(res) {
res.forEach((element: any) => {
value.push({
name: element.province,
value: element.weight,
});
});
console.log(value);
this.userData = value
this.userDv = this.ds.createView().source(this.userData).transform({
geoDataView: this.worldMap,
field: 'name',
@ -129,7 +140,8 @@ export class DatatableCustomindexMapComponent implements OnInit, OnChanges {
this.userView.interaction('element-active');
this.chart.render();
}
})
});
console.log('9999');

6
src/app/routes/datatable/datatable.module.ts
View File

@ -40,7 +40,8 @@ import { FinancetablePillarComponent } from './components/financetable/pillar/pi
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';
import { DatatableCustomindexMapComponent } from './components/datascreen/curve/map.component';
import { DatatableCustomindexMapComponent } from './components/datascreen/map/map.component';
import { DatatableCustomindexCurveMinComponent } from './components/datascreen/curve/curve.component';
const COMPONENTS: Type<void>[] = [
DatatableDataindexComponent,
@ -74,7 +75,8 @@ const COMPONENTS: Type<void>[] = [
ComplianceCurveComponent,
BusitableCurveComponent,
DatatableCustomindexCurveComponent,
DatatableCustomindexMapComponent
DatatableCustomindexMapComponent,
DatatableCustomindexCurveMinComponent
]