+
+
diff --git a/src/app/routes/datatable/components/dataindex/dataindex.component.ts b/src/app/routes/datatable/components/dataindex/dataindex.component.ts
index 62bd3816..c827c3b2 100644
--- a/src/app/routes/datatable/components/dataindex/dataindex.component.ts
+++ b/src/app/routes/datatable/components/dataindex/dataindex.component.ts
@@ -9,6 +9,8 @@ import { G2TimelineClickItem, G2TimelineData } from '@delon/chart/timeline';
import { CurrencyPipe } from '@angular/common';
import { LOGS } from '_mock';
import { G2CustomComponent } from '@delon/chart/custom';
+import { G2BarData } from '@delon/chart/bar';
+import { GeometryLabelCfg } from '@antv/g2/lib/interface';
@Component({
selector: 'app-datatable-dataindex',
@@ -20,6 +22,7 @@ export class DatatableDataindexComponent implements OnInit {
@ViewChild('g2custom', { static: false }) g2custom!: G2CustomComponent;
@ViewChild('RegionalPerforman', { static: false }) RegionalPerforman!: G2CustomComponent;
@ViewChild('BillDirectProportion', { static: false }) BillDirectProportion!: G2CustomComponent;
+ @ViewChild('SaleProportion', { static: false }) SaleProportion!: G2CustomComponent;
salesData: any[] = [];
totalAdvanceDeposit: { totalAmount: string; list: G2MiniAreaData[] } = { totalAmount: '0', list: this.genData() };
@@ -94,6 +97,7 @@ export class DatatableDataindexComponent implements OnInit {
this.service.request(this.service.$api_get_bill_payment_amount).subscribe(res => {
if (res) {
this.salesData = this.formatBarData(res);
+ this.initBiaxialChart(this.SaleProportion['el'].nativeElement as any, this.salesData);
}
});
}
@@ -267,6 +271,11 @@ export class DatatableDataindexComponent implements OnInit {
}
}
+ /**
+ * 构建大区业绩完成情况柱折双轴图
+ * @param el
+ * @param data
+ */
private initRegionalPerformanceChart(el: HTMLElement, data: DataPerformanceTrendVO[]) {
const chart = new Chart({
container: el,
@@ -319,6 +328,66 @@ export class DatatableDataindexComponent implements OnInit {
chart.render();
}
+ /**
+ * 构建业绩完成情况柱折双轴图
+ * @param el
+ * @param data
+ */
+ private initBiaxialChart(el: HTMLElement, data: any[]) {
+ const chart = new Chart({
+ container: el,
+ autoFit: true,
+ height: 400,
+
+ });
+ chart.data(data);
+ chart.scale({
+ pre: { alias: '同期业绩完成率', min: 0, max: 1 },
+ pre2: { min: 0, max: 1 },
+ quantity: { min: 0, max: 1000000 },
+ });
+ chart.legend({
+ custom: true,
+ items: [
+ { value: 'quantity', name: '业绩量 (万)', marker: { symbol: 'hyphen', style: { stroke: '#3182bd', r: 15, lineWidth: 5 } } },
+ { value: 'pre2', name: '业绩完成率', marker: { symbol: 'hyphen', style: { stroke: '#fdae6b', r: 15, lineWidth: 5 } } },
+ { value: 'pre', name: '同期业绩完成率', marker: { symbol: 'hyphen', style: { stroke: '#ff4d4f', r: 15, lineWidth: 5 } } }
+ ]
+ });
+ chart.axis('pre', {
+ grid: null,
+ title: null,
+ label: {
+ formatter: val => {
+ return +val * 100 + '%';
+ }
+ }
+ });
+ chart.axis('pre2', false);
+ chart.tooltip({
+ shared: true
+ });
+ chart.interval().position('time*quantity').label('quantity').color('#3182bd');
+ chart
+ .line()
+ .position('time*pre')
+ .label('pre', val => ({ content: (val * 100).toFixed(0) + '%' }))
+ .color('#ff4d4f')
+ .size(3);
+ chart.point().position('time*pre').color('#ff4d4f').size(3).shape('circle');
+ chart
+ .line()
+ .position('time*pre2')
+ .label('pre2', val => ({ content: (val * 100).toFixed(0) + '%' }))
+ .color('#fdae6b')
+ .size(3);
+ chart.point().position('time*pre2').color('#fdae6b').size(3).shape('circle');
+
+ chart.interaction('active-region');
+ chart.removeInteraction('legend-filter'); // 自定义图例,移除默认的分类图例筛选交互
+ chart.render();
+ }
+
private formatMiniAreaData(data: DataTotalVO) {
return {
totalAmount: `${this.currency.transform(data.totalAmount || 0)}万`,
@@ -329,6 +398,11 @@ export class DatatableDataindexComponent implements OnInit {
};
}
+ /**
+ * 初始化饼图数据格式
+ * @param data
+ * @returns
+ */
private formatCoordinateData(data: DataBillTypeProportion[]): any[] {
const total = data.map(item => item.quantity).reduce((pre, next) => pre + next);
const rs: any[] = [];
@@ -344,9 +418,11 @@ export class DatatableDataindexComponent implements OnInit {
private formatBarData(data: DataPerformanceTrendVO[]): any[] {
return data.map(item => ({
- x: item.time,
- y: item.quantity,
- color: '#f50'
+ time: item.time,
+ quantity: item.quantity,
+ color: undefined,
+ pre: Math.floor(Math.random() * 100) / 100,
+ pre2: Math.floor(Math.random() * 100) / 100
}));
}
@@ -356,7 +432,7 @@ export class DatatableDataindexComponent implements OnInit {
for (let i = 0; i < 20; i += 1) {
res.push({
x: format(new Date(beginDay + 1000 * 60 * 60 * 24 * i), 'yyyy-MM-dd'),
- y: Math.floor(Math.random() * 100) + 10
+ y: Math.floor(Math.random() * 1)
});
}
return res;
diff --git a/src/app/routes/ticket-management/components/invoice-detail/invoice-detail.component.html b/src/app/routes/ticket-management/components/invoice-detail/invoice-detail.component.html
index 160bf708..30583c58 100644
--- a/src/app/routes/ticket-management/components/invoice-detail/invoice-detail.component.html
+++ b/src/app/routes/ticket-management/components/invoice-detail/invoice-detail.component.html
@@ -108,7 +108,7 @@
{{ item.billLTypeLabel }}: {{ item.vatmoney |currency }}
- vatmoney
+