@po-ui/ng-components 19.15.0 → 19.17.0
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/fesm2022/po-ui-ng-components-po-chart-modal-table.component-mSWyBcer.mjs +45 -0
- package/fesm2022/po-ui-ng-components-po-chart-modal-table.component-mSWyBcer.mjs.map +1 -0
- package/fesm2022/po-ui-ng-components.mjs +10187 -12681
- package/fesm2022/po-ui-ng-components.mjs.map +1 -1
- package/lib/components/components.module.d.ts +41 -42
- package/lib/components/index.d.ts +0 -1
- package/lib/components/po-chart/enums/po-chart-type.enum.d.ts +7 -1
- package/lib/components/po-chart/index.d.ts +6 -4
- package/lib/components/po-chart/interfaces/po-chart-axis-options.interface.d.ts +65 -3
- package/lib/components/po-chart/interfaces/po-chart-header-options.interface.d.ts +0 -2
- package/lib/components/po-chart/interfaces/po-chart-literals.interface.d.ts +32 -2
- package/lib/components/po-chart/interfaces/po-chart-options.interface.d.ts +175 -0
- package/lib/components/po-chart/interfaces/po-chart-serie.interface.d.ts +12 -0
- package/lib/components/po-chart/po-chart-base.component.d.ts +149 -89
- package/lib/components/po-chart/po-chart-gauge-utils.d.ts +22 -0
- package/lib/components/{po-chart-new → po-chart}/po-chart-grid-utils.d.ts +2 -2
- package/lib/components/po-chart/po-chart-modal-table/po-chart-modal-table.component.d.ts +11 -0
- package/lib/components/po-chart/po-chart.component.d.ts +95 -43
- package/lib/components/po-chart/po-chart.module.d.ts +6 -23
- package/lib/components/po-disclaimer/po-disclaimer-base.component.d.ts +2 -1
- package/lib/components/po-field/po-multiselect/po-multiselect-base.component.d.ts +0 -2
- package/lib/components/po-gauge/index.d.ts +1 -0
- package/lib/components/po-gauge/interfaces/po-gauge-options.interface.d.ts +69 -0
- package/lib/components/po-gauge/po-gauge-base.component.d.ts +45 -10
- package/lib/components/po-gauge/po-gauge.component.d.ts +10 -17
- package/lib/components/po-gauge/po-gauge.module.d.ts +3 -9
- package/lib/components/po-listbox/po-listbox.component.d.ts +4 -3
- package/lib/components/po-tag/po-tag-base.component.d.ts +2 -1
- package/lib/services/po-theme/helpers/types/po-theme-dark-defaults-AA.constant.d.ts +101 -0
- package/lib/services/po-theme/helpers/types/po-theme-dark-defaults.constant.d.ts +0 -7
- package/lib/services/po-theme/helpers/types/po-theme-light-defaults-AA.constant.d.ts +28 -0
- package/lib/services/po-theme/helpers/types/po-theme-light-defaults.constant.d.ts +18 -1
- package/lib/services/po-theme/index.d.ts +2 -0
- package/package.json +4 -4
- package/po-ui-ng-components-19.17.0.tgz +0 -0
- package/schematics/ng-add/index.js +1 -1
- package/schematics/ng-update/v14/index.js +1 -1
- package/schematics/ng-update/v15/index.js +1 -1
- package/schematics/ng-update/v16/index.js +1 -1
- package/schematics/ng-update/v17/index.js +1 -1
- package/schematics/ng-update/v18/index.js +2 -2
- package/schematics/ng-update/v19/index.js +2 -2
- package/schematics/ng-update/v2/index.js +1 -1
- package/schematics/ng-update/v3/index.js +1 -1
- package/schematics/ng-update/v4/index.js +1 -1
- package/schematics/ng-update/v5/index.js +1 -1
- package/schematics/ng-update/v6/index.js +1 -1
- package/lib/components/po-chart/directives/po-resize-observer.directive.d.ts +0 -15
- package/lib/components/po-chart/helpers/po-chart-default-values.constant.d.ts +0 -8
- package/lib/components/po-chart/interfaces/po-chart-bar-coordinates.interface.d.ts +0 -23
- package/lib/components/po-chart/interfaces/po-chart-container-size.interface.d.ts +0 -23
- package/lib/components/po-chart/interfaces/po-chart-label-coordinates.interface.d.ts +0 -19
- package/lib/components/po-chart/interfaces/po-chart-min-max-values.interface.d.ts +0 -19
- package/lib/components/po-chart/interfaces/po-chart-path-coordinates.interface.d.ts +0 -27
- package/lib/components/po-chart/interfaces/po-chart-points-coordinates.interface.d.ts +0 -28
- package/lib/components/po-chart/po-chart-container/po-chart-axis/po-chart-axis-label/po-chart-axis-label.component.d.ts +0 -19
- package/lib/components/po-chart/po-chart-container/po-chart-axis/po-chart-axis-path/po-chart-axis-path.component.d.ts +0 -10
- package/lib/components/po-chart/po-chart-container/po-chart-axis/po-chart-axis.component.d.ts +0 -63
- package/lib/components/po-chart/po-chart-container/po-chart-bar/po-chart-bar-base.component.d.ts +0 -34
- package/lib/components/po-chart/po-chart-container/po-chart-bar/po-chart-bar-path/po-chart-bar-path.component.d.ts +0 -16
- package/lib/components/po-chart/po-chart-container/po-chart-bar/po-chart-bar.component.d.ts +0 -16
- package/lib/components/po-chart/po-chart-container/po-chart-bar/po-chart-column/po-chart-column.component.d.ts +0 -16
- package/lib/components/po-chart/po-chart-container/po-chart-circular/po-chart-circular-label/po-chart-circular-label.component.d.ts +0 -14
- package/lib/components/po-chart/po-chart-container/po-chart-circular/po-chart-circular-path/po-chart-circular-path.component.d.ts +0 -16
- package/lib/components/po-chart/po-chart-container/po-chart-circular/po-chart-circular-path/po-chart-tooltip.directive.d.ts +0 -23
- package/lib/components/po-chart/po-chart-container/po-chart-circular/po-chart-circular.component.d.ts +0 -45
- package/lib/components/po-chart/po-chart-container/po-chart-circular/po-chart-donut/po-chart-donut.component.d.ts +0 -19
- package/lib/components/po-chart/po-chart-container/po-chart-circular/po-chart-pie/po-chart-pie.component.d.ts +0 -11
- package/lib/components/po-chart/po-chart-container/po-chart-container.component.d.ts +0 -52
- package/lib/components/po-chart/po-chart-container/po-chart-line/po-chart-area/po-chart-area.component.d.ts +0 -23
- package/lib/components/po-chart/po-chart-container/po-chart-line/po-chart-line-base.component.d.ts +0 -52
- package/lib/components/po-chart/po-chart-container/po-chart-line/po-chart-line.component.d.ts +0 -19
- package/lib/components/po-chart/po-chart-container/po-chart-line/po-chart-path/po-chart-path.component.d.ts +0 -24
- package/lib/components/po-chart/po-chart-container/po-chart-line/po-chart-series-point/po-chart-series-point.component.d.ts +0 -40
- package/lib/components/po-chart/po-chart-legend/po-chart-legend.component.d.ts +0 -10
- package/lib/components/po-chart/po-chart-switch.component.d.ts +0 -22
- package/lib/components/po-chart/po-chart-types/po-chart-dynamic-type.component.d.ts +0 -37
- package/lib/components/po-chart/services/po-chart-maths.service.d.ts +0 -66
- package/lib/components/po-chart/services/po-chart-svg-container.service.d.ts +0 -24
- package/lib/components/po-chart-new/index.d.ts +0 -2
- package/lib/components/po-chart-new/po-chart-new-base.component.d.ts +0 -210
- package/lib/components/po-chart-new/po-chart-new.component.d.ts +0 -86
- package/lib/components/po-chart-new/po-chart-new.module.d.ts +0 -18
- package/lib/components/po-gauge/interfaces/po-gauge-coordinates.interface.d.ts +0 -19
- package/lib/components/po-gauge/interfaces/po-gauge-svg-container.interface.d.ts +0 -15
- package/lib/components/po-gauge/po-gauge-description/po-gauge-description.component.d.ts +0 -14
- package/lib/components/po-gauge/po-gauge-legend/po-gauge-legend.component.d.ts +0 -12
- package/lib/components/po-gauge/po-gauge-svg/po-gauge-path/po-gauge-path.component.d.ts +0 -10
- package/lib/components/po-gauge/po-gauge-svg/po-gauge-pointer/po-gauge-pointer.component.d.ts +0 -18
- package/lib/components/po-gauge/po-gauge-svg/po-gauge-svg.component.d.ts +0 -35
- package/lib/components/po-gauge/po-gauge-title/po-gauge-title.component.d.ts +0 -6
- package/po-ui-ng-components-19.15.0.tgz +0 -0
|
@@ -1,10 +1,11 @@
|
|
|
1
|
-
import { EventEmitter,
|
|
2
|
-
import {
|
|
3
|
-
import { PoChartType } from '
|
|
4
|
-
import {
|
|
5
|
-
import {
|
|
6
|
-
import {
|
|
7
|
-
import {
|
|
1
|
+
import { EventEmitter, OnInit } from '@angular/core';
|
|
2
|
+
import { PoLanguageService } from '../../services/po-language/po-language.service';
|
|
3
|
+
import { PoChartType } from '../po-chart/enums/po-chart-type.enum';
|
|
4
|
+
import { PoChartLiterals } from '../po-chart/interfaces/po-chart-literals.interface';
|
|
5
|
+
import { PoChartOptions } from '../po-chart/interfaces/po-chart-options.interface';
|
|
6
|
+
import { PoChartDataLabel } from '../po-chart/interfaces/po-chart-serie-data-label.interface';
|
|
7
|
+
import { PoChartSerie } from '../po-chart/interfaces/po-chart-serie.interface';
|
|
8
|
+
import { PoPopupAction } from '../po-popup';
|
|
8
9
|
import * as i0 from "@angular/core";
|
|
9
10
|
/**
|
|
10
11
|
* @description
|
|
@@ -23,96 +24,84 @@ import * as i0 from "@angular/core";
|
|
|
23
24
|
*
|
|
24
25
|
* > Veja nosso [guia de uso para gráficos](/guides/guide-charts) para auxiliar na construção do seu gráfico,
|
|
25
26
|
* informando em qual caso utilizar, o que devemos evitar e boas práticas relacionada a cores.
|
|
27
|
+
*
|
|
28
|
+
* #### Tokens customizáveis
|
|
29
|
+
*
|
|
30
|
+
* É possível alterar o estilo do componente usando os seguintes tokens (CSS):
|
|
31
|
+
*
|
|
32
|
+
* > Para maiores informações, acesse o guia [Personalizando o Tema Padrão com Tokens CSS](https://po-ui.io/guides/theme-customization).
|
|
33
|
+
*
|
|
34
|
+
* | Propriedade | Descrição | Valor Padrão |
|
|
35
|
+
* |------------------------------------------|-------------------------------------------------------------------------|---------------------------------------------------|
|
|
36
|
+
* | **Chart (po-chart)** | | |
|
|
37
|
+
* | `--background-color-grid` | Cor de background dos gráficos | `var(--color-neutral-light-00)` |
|
|
38
|
+
* | `--color-description-chart` | Cor da descrição dos gráficos | `var(--color-neutral-dark-70)` |
|
|
39
|
+
* | `--font-family-description-chart` | Fonte da descrição dos gráficos | `var(--font-family-theme)` |
|
|
40
|
+
* | `--font-size-description-chart` | Tamanho da fonte da descrição dos gráficos | `var(--font-size-sm)` |
|
|
41
|
+
* | `--font-weight-description-chart` | Peso da fonte da descrição dos gráficos | `var(--font-weight-normal)` |
|
|
42
|
+
* | **Header (po-chart .po-chart-header )** | | |
|
|
43
|
+
* | `--background-color` | Cor de background do cabeçalho | `var(--color-neutral-light-00)` |
|
|
44
|
+
* | `--color` | Cor da fonte do cabeçalho | `var(--color-neutral-dark-70)` |
|
|
45
|
+
* | `--font-family` | Família tipográfica usada | `var(--font-family-theme)` |
|
|
46
|
+
* | `--font-size-title` | Tamanho da fonte | `var(--font-size-default)` |
|
|
47
|
+
* | `--font-size-icons` | Tamanho dos ícones | `var(--font-size-md)` |
|
|
48
|
+
* | `--font-weight` | Peso da fonte | `var(--font-weight-bold)` |
|
|
49
|
+
* | **Chart (po-chart .po-chart)** | | |
|
|
50
|
+
* | `--color-grid` | Cor da linha dos gráficos que possuem eixo | `var(--color-neutral-light-20)` |
|
|
51
|
+
* | `--font-family-grid` | Família tipográfica usada nos valores dos eixos | `var(--font-family-theme)` |
|
|
52
|
+
* | `--font-size-grid` | Tamanho da fonte usada nos valores dos eixos | `var(--font-size-xs)` |
|
|
53
|
+
* | `--font-weight-grid` | Peso da fonte usada nos valores dos eixos | `var(--font-weight-normal)` |
|
|
54
|
+
* | `--color-legend` | Cor da fonte da legenda | `var(--color-neutral-dark-70)` |
|
|
55
|
+
* | `--border-radius-bar` | Tamanho da borda nos graficos `Bar` e `Column` | `var(--border-radius-none)` |
|
|
56
|
+
* | `--border-color` | Cor da borda do gráfico nos Gráficos `Donut` e `Pie` | `var(--color-neutral-light-00)` |
|
|
57
|
+
* | `--color-hightlight-value` | Cor do valor de destaque nos Gráficos `Donut` e `Gauge` | `var(--color-neutral-dark-70)` |
|
|
58
|
+
* | `--font-family-hightlight-value` | Família tipográfica do valor de destaque nos Gráficos `Donut` e `Gauge` | `var(--font-family-theme)` |
|
|
59
|
+
* | `--font-weight-hightlight-value` | Peso da fonte do valor de destaque nos Gráficos `Donut` e `Gauge` | `var(--font-weight-bold)` |
|
|
60
|
+
* | `--color-base-gauge` | Cor da base do gráfico `Gauge` | `var(--color-neutral-light-20)` |
|
|
61
|
+
* | `--color-gauge-pointer-color` | Cor do ponteiro do gráfico `Gauge` | `var(--color-neutral-dark-70)` |
|
|
62
|
+
* | `--color-chart-line-point-fill` | Cor de dentro do círculo dos gráficos `Line` e `Area` | `var(--color-neutral-light-00)` |
|
|
63
|
+
* | **Wrapper (.po-chart-container-gauge)** | | |
|
|
64
|
+
* | `--background-color-container-gauge` | Cor de background do container do gauge | `var(--color-neutral-light-00)` |
|
|
26
65
|
*/
|
|
27
|
-
export declare abstract class PoChartBaseComponent implements
|
|
28
|
-
|
|
66
|
+
export declare abstract class PoChartBaseComponent implements OnInit {
|
|
67
|
+
private _literals?;
|
|
68
|
+
private setHeightGauge;
|
|
69
|
+
private readonly language;
|
|
70
|
+
id: string;
|
|
29
71
|
/** Define o título do gráfico. */
|
|
30
72
|
title?: string;
|
|
31
73
|
/**
|
|
32
|
-
* @optional
|
|
33
|
-
*
|
|
34
|
-
* @description
|
|
35
|
-
*
|
|
36
|
-
* Evento executado quando o usuário clicar sobre um elemento do gráfico.
|
|
37
|
-
*
|
|
38
|
-
* O evento emitirá o seguinte parâmetro:
|
|
39
|
-
* - *donut* e *pie*: um objeto contendo a categoria e valor da série.
|
|
40
|
-
* - *area*, *line*, *column* e *bar*: um objeto contendo o nome da série, valor e categoria do eixo do gráfico.
|
|
41
|
-
*/
|
|
42
|
-
seriesClick: EventEmitter<PoChartSerie>;
|
|
43
|
-
/**
|
|
44
|
-
* @optional
|
|
45
|
-
*
|
|
46
74
|
* @description
|
|
47
75
|
*
|
|
48
|
-
*
|
|
49
|
-
*
|
|
50
|
-
* O evento emitirá o seguinte parâmetro de acordo com o tipo de gráfico:
|
|
51
|
-
* - *donut* e *pie*: um objeto contendo a categoria e valor da série.
|
|
52
|
-
* - *area*, *line*, *column* e *bar*: um objeto contendo a categoria, valor da série e categoria do eixo do gráfico.
|
|
76
|
+
* Define os elementos do gráfico que serão criados dinamicamente.
|
|
53
77
|
*/
|
|
54
|
-
|
|
55
|
-
chartSeries: Array<PoChartSerie>;
|
|
56
|
-
chartType: PoChartType;
|
|
57
|
-
svgContainerSize: PoChartContainerSize;
|
|
58
|
-
private _options;
|
|
59
|
-
private _categories;
|
|
60
|
-
private _height;
|
|
61
|
-
private _series;
|
|
62
|
-
private _type;
|
|
63
|
-
private defaultType;
|
|
78
|
+
series: Array<PoChartSerie>;
|
|
64
79
|
/**
|
|
65
|
-
* @optional
|
|
66
|
-
*
|
|
67
80
|
* @description
|
|
68
81
|
*
|
|
69
|
-
* Define
|
|
70
|
-
*
|
|
71
|
-
* > O valor mínimo aceito nesta propriedade é 200.
|
|
72
|
-
*
|
|
73
|
-
* @default `400px`
|
|
82
|
+
* Define o valor do gráfico do tipo `Gauge` quando utliza as propriedades `From` `To`.
|
|
74
83
|
*/
|
|
75
|
-
|
|
76
|
-
get height(): number;
|
|
84
|
+
valueGaugeMultiple?: number;
|
|
77
85
|
/**
|
|
78
86
|
* @optional
|
|
79
87
|
*
|
|
80
88
|
* @description
|
|
81
89
|
*
|
|
82
|
-
* Define
|
|
83
|
-
*
|
|
84
|
-
* É possível também combinar gráficos dos tipos linha e coluna. Para isso, opte pela declaração de `type` conforme a interface `PoChartSerie`.
|
|
85
|
-
*
|
|
86
|
-
* > Note que, se houver declaração de tipo de gráfico tanto em `p-type` quanto em `PochartSerie.type`, o valor `{ type }` da primeira série anulará o valor definido em `p-type`.
|
|
87
|
-
*
|
|
88
|
-
* Se não passado valor, o padrão será relativo à primeira série passada em `p-series`:
|
|
89
|
-
* - Se `p-series = [{ data: [1,2,3] }]`: será `PoChartType.Column`.
|
|
90
|
-
* - Se `p-series = [{ data: 1 }]`: será `PoChartType.Pie`.
|
|
90
|
+
* Define os nomes das categorias que serão plotadas no eixo X do gráfico caso seja do tipo `bar`, ou então nos eixos Y do grid de gráficos dos tipos `area`, `columnn` e `line`.
|
|
91
91
|
*
|
|
92
|
-
* >
|
|
93
|
-
*/
|
|
94
|
-
set type(value: PoChartType);
|
|
95
|
-
get type(): PoChartType;
|
|
96
|
-
/**
|
|
97
|
-
* @description
|
|
92
|
+
* > Gráficos do tipo `bar` dimensionam a área do gráfico de acordo com a largura do maior texto de categorias. No entanto, é uma boa prática optar por palavras curtas para que a leitura do gráfico não seja prejudicada.
|
|
98
93
|
*
|
|
99
|
-
*
|
|
94
|
+
* > Caso não seja especificado um valor para a categoria, será plotado um hífen na categoria referente a cada série.
|
|
100
95
|
*/
|
|
101
|
-
|
|
102
|
-
get series(): Array<PoChartSerie>;
|
|
96
|
+
categories?: Array<string>;
|
|
103
97
|
/**
|
|
104
98
|
* @optional
|
|
105
99
|
*
|
|
106
100
|
* @description
|
|
107
101
|
*
|
|
108
|
-
*
|
|
109
|
-
*
|
|
110
|
-
* > Gráficos do tipo `bar` dimensionam a área do gráfico de acordo com a largura do maior texto de categorias. No entanto, é uma boa prática optar por palavras curtas para que a leitura do gráfico não seja prejudicada.
|
|
111
|
-
*
|
|
112
|
-
* > Caso não seja especificado um valor para a categoria, será plotado um hífen na categoria referente a cada série.
|
|
102
|
+
* Essa propriedade permite que o desenvolvedor adicione ações customizadas no popup do header, oferecendo mais flexibilidade e controle sobre as interações do componente.
|
|
113
103
|
*/
|
|
114
|
-
|
|
115
|
-
get categories(): Array<string>;
|
|
104
|
+
customActions?: Array<PoPopupAction>;
|
|
116
105
|
/**
|
|
117
106
|
* @optional
|
|
118
107
|
*
|
|
@@ -134,8 +123,7 @@ export declare abstract class PoChartBaseComponent implements OnChanges {
|
|
|
134
123
|
* };
|
|
135
124
|
* ```
|
|
136
125
|
*/
|
|
137
|
-
|
|
138
|
-
get options(): PoChartOptions;
|
|
126
|
+
options?: PoChartOptions;
|
|
139
127
|
/**
|
|
140
128
|
* @optional
|
|
141
129
|
*
|
|
@@ -159,20 +147,92 @@ export declare abstract class PoChartBaseComponent implements OnChanges {
|
|
|
159
147
|
* ```
|
|
160
148
|
*/
|
|
161
149
|
dataLabel?: PoChartDataLabel;
|
|
162
|
-
|
|
163
|
-
|
|
164
|
-
|
|
165
|
-
|
|
166
|
-
|
|
167
|
-
|
|
168
|
-
|
|
169
|
-
|
|
170
|
-
|
|
171
|
-
|
|
172
|
-
|
|
173
|
-
|
|
174
|
-
|
|
175
|
-
|
|
150
|
+
/**
|
|
151
|
+
* @optional
|
|
152
|
+
*
|
|
153
|
+
* @description
|
|
154
|
+
*
|
|
155
|
+
* Define a altura do gráfico em px.
|
|
156
|
+
*
|
|
157
|
+
* > No caso do tipo `Gauge`, o valor padrão é `300` e esse é seu valor minimo aceito. Nos outros tipos, o valor mínimo aceito nesta propriedade é 200.
|
|
158
|
+
*
|
|
159
|
+
* @default `400`
|
|
160
|
+
*/
|
|
161
|
+
set height(value: number);
|
|
162
|
+
get height(): number;
|
|
163
|
+
private _height;
|
|
164
|
+
/**
|
|
165
|
+
* @optional
|
|
166
|
+
*
|
|
167
|
+
* @description
|
|
168
|
+
*
|
|
169
|
+
* Define o tipo de gráfico.
|
|
170
|
+
*
|
|
171
|
+
* É possível também combinar gráficos dos tipos linha e coluna. Para isso, opte pela declaração de `type` conforme a interface `PoChartSerie`.
|
|
172
|
+
*
|
|
173
|
+
* > Note que, se houver declaração de tipo de gráfico tanto em `p-type` quanto em `PochartSerie.type`, o valor `{ type }` da primeira série anulará o valor definido em `p-type`.
|
|
174
|
+
*
|
|
175
|
+
* Se não passado valor, o padrão será relativo à primeira série passada em `p-series`:
|
|
176
|
+
* - Se `p-series = [{ data: [1,2,3] }]`: será `PoChartType.Column`.
|
|
177
|
+
* - Se `p-series = [{ data: 1 }]`: será `PoChartType.Pie`.
|
|
178
|
+
*
|
|
179
|
+
* > Veja os valores válidos no *enum* `PoChartType`.
|
|
180
|
+
*/
|
|
181
|
+
type: PoChartType;
|
|
182
|
+
/**
|
|
183
|
+
* @optional
|
|
184
|
+
*
|
|
185
|
+
* @description
|
|
186
|
+
*
|
|
187
|
+
* Objeto com as literais usadas no `po-chart`.
|
|
188
|
+
*
|
|
189
|
+
* Para utilizar basta passar a literal que deseja customizar:
|
|
190
|
+
*
|
|
191
|
+
* ```
|
|
192
|
+
* const customLiterals: PoChartLiterals = {
|
|
193
|
+
* downloadCSV: 'Obter CSV',
|
|
194
|
+
* };
|
|
195
|
+
* ```
|
|
196
|
+
*
|
|
197
|
+
* E para carregar a literal customizada, basta apenas passar o objeto para o componente.
|
|
198
|
+
*
|
|
199
|
+
* ```
|
|
200
|
+
* <po-chart
|
|
201
|
+
* [p-literals]="customLiterals">
|
|
202
|
+
* </po-chart>
|
|
203
|
+
* ```
|
|
204
|
+
*
|
|
205
|
+
* > O objeto padrão de literais será traduzido de acordo com o idioma do
|
|
206
|
+
* [`PoI18nService`](/documentation/po-i18n) ou do browser.
|
|
207
|
+
*/
|
|
208
|
+
set literals(value: PoChartLiterals);
|
|
209
|
+
get literals(): PoChartLiterals;
|
|
210
|
+
/**
|
|
211
|
+
* @optional
|
|
212
|
+
*
|
|
213
|
+
* @description
|
|
214
|
+
*
|
|
215
|
+
* Evento executado quando o usuário clicar sobre um elemento do gráfico.
|
|
216
|
+
*
|
|
217
|
+
* O evento emitirá o seguinte parâmetro:
|
|
218
|
+
* - *donut* e *pie*: um objeto contendo a categoria e valor da série.
|
|
219
|
+
* - *area*, *line*, *column* e *bar*: um objeto contendo o nome da série, valor e categoria do eixo do gráfico.
|
|
220
|
+
*/
|
|
221
|
+
seriesClick: EventEmitter<any>;
|
|
222
|
+
/**
|
|
223
|
+
* @optional
|
|
224
|
+
*
|
|
225
|
+
* @description
|
|
226
|
+
*
|
|
227
|
+
* Evento executado quando o usuário passar o *mouse* sobre um elemento do gráfico.
|
|
228
|
+
*
|
|
229
|
+
* O evento emitirá o seguinte parâmetro de acordo com o tipo de gráfico:
|
|
230
|
+
* - *donut* e *pie*: um objeto contendo a categoria e valor da série.
|
|
231
|
+
* - *area*, *line*, *column* e *bar*: um objeto contendo a categoria, valor da série e categoria do eixo do gráfico.
|
|
232
|
+
*/
|
|
233
|
+
seriesHover: EventEmitter<any>;
|
|
234
|
+
constructor(languageService: PoLanguageService);
|
|
235
|
+
ngOnInit(): void;
|
|
176
236
|
static ɵfac: i0.ɵɵFactoryDeclaration<PoChartBaseComponent, never>;
|
|
177
|
-
static ɵdir: i0.ɵɵDirectiveDeclaration<PoChartBaseComponent, never, never, { "title": { "alias": "p-title"; "required": false; }; "
|
|
237
|
+
static ɵdir: i0.ɵɵDirectiveDeclaration<PoChartBaseComponent, never, never, { "id": { "alias": "t-id"; "required": false; }; "title": { "alias": "p-title"; "required": false; }; "series": { "alias": "p-series"; "required": false; }; "valueGaugeMultiple": { "alias": "p-value-gauge-multiple"; "required": false; }; "categories": { "alias": "p-categories"; "required": false; }; "customActions": { "alias": "p-custom-actions"; "required": false; }; "options": { "alias": "p-options"; "required": false; }; "dataLabel": { "alias": "p-data-label"; "required": false; }; "height": { "alias": "p-height"; "required": false; }; "type": { "alias": "p-type"; "required": false; }; "literals": { "alias": "p-literals"; "required": false; }; }, { "seriesClick": "p-series-click"; "seriesHover": "p-series-hover"; }, never, never, true, never>;
|
|
178
238
|
}
|
|
@@ -0,0 +1,22 @@
|
|
|
1
|
+
import { PoChartComponent } from './po-chart.component';
|
|
2
|
+
export declare class PoChartGaugeUtils {
|
|
3
|
+
private readonly component;
|
|
4
|
+
constructor(component: PoChartComponent);
|
|
5
|
+
setGaugeOptions(options: any, fontSizeText: any): void;
|
|
6
|
+
setListTypeGauge(serie: any, fontSizes: {
|
|
7
|
+
fontSizeMd: number;
|
|
8
|
+
fontSizeLg: number;
|
|
9
|
+
fontSizeSubtitle: number;
|
|
10
|
+
}): any;
|
|
11
|
+
private setPropertiesGauge;
|
|
12
|
+
setPropertiesDefaultHeight(center: [string, string]): {
|
|
13
|
+
radius: string;
|
|
14
|
+
lengthPointer: string;
|
|
15
|
+
center: [string, string];
|
|
16
|
+
widthSubtitle: number;
|
|
17
|
+
};
|
|
18
|
+
setSerieTypeGauge(serie: any, color: string): void;
|
|
19
|
+
private normalizeToRelativePercentage;
|
|
20
|
+
finalizeSerieTypeGauge(serie: any): any[];
|
|
21
|
+
private buildGaugeAxisLineColorsWithGaps;
|
|
22
|
+
}
|
|
@@ -1,9 +1,9 @@
|
|
|
1
|
-
import {
|
|
1
|
+
import { PoChartComponent } from './po-chart.component';
|
|
2
2
|
import { PoChartType } from '../po-chart/enums/po-chart-type.enum';
|
|
3
3
|
export declare class PoChartGridUtils {
|
|
4
4
|
private readonly component;
|
|
5
5
|
private isTypeDonut;
|
|
6
|
-
constructor(component:
|
|
6
|
+
constructor(component: PoChartComponent);
|
|
7
7
|
setGridOption(options: any): void;
|
|
8
8
|
setOptionsAxis(options: any): void;
|
|
9
9
|
setOptionDataZoom(options: any): void;
|
|
@@ -0,0 +1,11 @@
|
|
|
1
|
+
import { PoModalComponent } from '../../po-modal';
|
|
2
|
+
import * as i0 from "@angular/core";
|
|
3
|
+
export declare class PoChartModalTableComponent {
|
|
4
|
+
modalComponent: PoModalComponent;
|
|
5
|
+
title: string;
|
|
6
|
+
itemsTable: Array<any>;
|
|
7
|
+
columnsTable: Array<any>;
|
|
8
|
+
actionModal: any;
|
|
9
|
+
static ɵfac: i0.ɵɵFactoryDeclaration<PoChartModalTableComponent, never>;
|
|
10
|
+
static ɵcmp: i0.ɵɵComponentDeclaration<PoChartModalTableComponent, "po-chart-modal-table", never, { "title": { "alias": "title"; "required": false; }; "itemsTable": { "alias": "itemsTable"; "required": false; }; "columnsTable": { "alias": "columnsTable"; "required": false; }; "actionModal": { "alias": "actionModal"; "required": false; }; }, {}, never, never, true, never>;
|
|
11
|
+
}
|
|
@@ -1,8 +1,14 @@
|
|
|
1
|
-
import { AfterViewInit, ChangeDetectorRef,
|
|
1
|
+
import { AfterViewInit, ChangeDetectorRef, ElementRef, OnChanges, OnDestroy, OnInit, QueryList, SimpleChanges } from '@angular/core';
|
|
2
|
+
import { CurrencyPipe, DecimalPipe } from '@angular/common';
|
|
3
|
+
import { PoTooltipDirective } from '../../directives';
|
|
4
|
+
import { PoColorService } from '../../services/po-color';
|
|
5
|
+
import { PoLanguageService } from '../../services/po-language/po-language.service';
|
|
6
|
+
import { PoModalAction } from '../po-modal';
|
|
7
|
+
import { PoPopupAction } from '../po-popup';
|
|
8
|
+
import { PoTableColumn } from '../po-table';
|
|
2
9
|
import { PoChartBaseComponent } from './po-chart-base.component';
|
|
3
|
-
import {
|
|
4
|
-
import {
|
|
5
|
-
import { PoChartMathsService } from './services/po-chart-maths.service';
|
|
10
|
+
import { PoChartGridUtils } from './po-chart-grid-utils';
|
|
11
|
+
import { PoChartGaugeUtils } from './po-chart-gauge-utils';
|
|
6
12
|
import * as i0 from "@angular/core";
|
|
7
13
|
/**
|
|
8
14
|
* @docsExtends PoChartBaseComponent
|
|
@@ -24,51 +30,97 @@ import * as i0 from "@angular/core";
|
|
|
24
30
|
* <file name="sample-po-chart-coffee-ranking/sample-po-chart-coffee-ranking.component.ts"> </file>
|
|
25
31
|
* </example>
|
|
26
32
|
*
|
|
33
|
+
* <example name="po-chart-summary" title="PO Chart - Summary">
|
|
34
|
+
* <file name="sample-po-chart-summary/sample-po-chart-summary.component.html"> </file>
|
|
35
|
+
* <file name="sample-po-chart-summary/sample-po-chart-summary.component.ts"> </file>
|
|
36
|
+
* </example>
|
|
37
|
+
*
|
|
27
38
|
* <example name="po-chart-world-exports" title="PO Chart - World Exports">
|
|
28
39
|
* <file name="sample-po-chart-world-exports/sample-po-chart-world-exports.component.html"> </file>
|
|
29
40
|
* <file name="sample-po-chart-world-exports/sample-po-chart-world-exports.component.ts"> </file>
|
|
30
41
|
* </example>
|
|
31
42
|
*/
|
|
32
|
-
export declare class PoChartComponent extends PoChartBaseComponent implements AfterViewInit,
|
|
33
|
-
|
|
34
|
-
private
|
|
35
|
-
private
|
|
36
|
-
private
|
|
37
|
-
private
|
|
38
|
-
|
|
39
|
-
|
|
40
|
-
chartContainer:
|
|
41
|
-
|
|
42
|
-
|
|
43
|
-
|
|
44
|
-
|
|
45
|
-
|
|
46
|
-
|
|
47
|
-
|
|
48
|
-
|
|
49
|
-
|
|
50
|
-
|
|
51
|
-
|
|
52
|
-
|
|
43
|
+
export declare class PoChartComponent extends PoChartBaseComponent implements OnInit, AfterViewInit, OnChanges, OnDestroy {
|
|
44
|
+
el: ElementRef;
|
|
45
|
+
private readonly currencyPipe;
|
|
46
|
+
private readonly decimalPipe;
|
|
47
|
+
private readonly colorService;
|
|
48
|
+
private readonly cdr;
|
|
49
|
+
poTooltip: QueryList<PoTooltipDirective>;
|
|
50
|
+
targetRef: ElementRef;
|
|
51
|
+
chartContainer: ElementRef;
|
|
52
|
+
tooltipText: string;
|
|
53
|
+
originalHeight: number;
|
|
54
|
+
originalRadiusGauge: any;
|
|
55
|
+
chartMarginTop: string;
|
|
56
|
+
isTypeBar: boolean;
|
|
57
|
+
boundaryGap: boolean;
|
|
58
|
+
listTypePieDonut: Array<any>;
|
|
59
|
+
itemsTypeDonut: Array<any>;
|
|
60
|
+
isGaugeSingle: boolean;
|
|
61
|
+
itemsTypeGauge: Array<any>;
|
|
62
|
+
itemsColorTypeGauge: any[];
|
|
63
|
+
protected actionModal: PoModalAction;
|
|
64
|
+
showPopup: boolean;
|
|
65
|
+
protected itemsTable: any[];
|
|
66
|
+
protected columnsTable: Array<PoTableColumn>;
|
|
67
|
+
protected isExpanded: boolean;
|
|
68
|
+
protected legendData: Array<{
|
|
69
|
+
name: string;
|
|
70
|
+
color: string;
|
|
71
|
+
}>;
|
|
72
|
+
protected headerHeight: number;
|
|
73
|
+
protected paddingContainerGauge: number;
|
|
74
|
+
protected descriptionHeight: number;
|
|
75
|
+
protected positionTooltip: string;
|
|
76
|
+
protected tooltipTitle: any;
|
|
77
|
+
protected tooltipDescriptionGauge: any;
|
|
78
|
+
protected chartGridUtils: PoChartGridUtils;
|
|
79
|
+
protected chartGaugeUtils: PoChartGaugeUtils;
|
|
80
|
+
protected isTypeGauge: boolean;
|
|
81
|
+
protected popupActions: Array<PoPopupAction>;
|
|
82
|
+
private chartInstance;
|
|
83
|
+
private currentRenderer;
|
|
84
|
+
private resizeObserver;
|
|
85
|
+
private intersectionObserver;
|
|
86
|
+
private hideDomEchartsDiv;
|
|
87
|
+
private readonly vcr;
|
|
88
|
+
get showHeader(): string | boolean;
|
|
89
|
+
constructor(el: ElementRef, currencyPipe: CurrencyPipe, decimalPipe: DecimalPipe, colorService: PoColorService, cdr: ChangeDetectorRef, languageService: PoLanguageService);
|
|
90
|
+
changeTheme: (event: any) => void;
|
|
91
|
+
ngOnInit(): void;
|
|
92
|
+
ngOnChanges(changes: SimpleChanges): void;
|
|
53
93
|
ngAfterViewInit(): void;
|
|
54
|
-
ngDoCheck(): void;
|
|
55
94
|
ngOnDestroy(): void;
|
|
56
|
-
|
|
57
|
-
|
|
58
|
-
|
|
59
|
-
|
|
60
|
-
|
|
61
|
-
private
|
|
62
|
-
private
|
|
63
|
-
private
|
|
64
|
-
private
|
|
65
|
-
private
|
|
66
|
-
private
|
|
67
|
-
private
|
|
68
|
-
private
|
|
69
|
-
private
|
|
70
|
-
private
|
|
71
|
-
private
|
|
95
|
+
showTooltipTitle(e: MouseEvent): void;
|
|
96
|
+
showTooltipDescription(e: MouseEvent): void;
|
|
97
|
+
getCSSVariable(variable: string, selector?: string): string;
|
|
98
|
+
openModal(): Promise<void>;
|
|
99
|
+
toggleExpand(): void;
|
|
100
|
+
private observeContainerResize;
|
|
101
|
+
private checkShowCEcharts;
|
|
102
|
+
private setInitialPopupActions;
|
|
103
|
+
private setHeightProperties;
|
|
104
|
+
private initECharts;
|
|
105
|
+
private initEChartsEvents;
|
|
106
|
+
private setTooltipProperties;
|
|
107
|
+
private setChartsProperties;
|
|
108
|
+
private setOptions;
|
|
109
|
+
private formatLabelOption;
|
|
110
|
+
private setOptionLegend;
|
|
111
|
+
private setSeries;
|
|
112
|
+
private setSerieEmphasis;
|
|
113
|
+
private setTypeSerie;
|
|
114
|
+
private setTableProperties;
|
|
115
|
+
private setTablePropertiesTypeBar;
|
|
116
|
+
private setTablePropertiesTypeGauge;
|
|
117
|
+
private setTableColumns;
|
|
118
|
+
private downloadCsv;
|
|
119
|
+
private exportImage;
|
|
120
|
+
private exportSvgAsImage;
|
|
121
|
+
private configureImageCanvas;
|
|
122
|
+
private setHeaderProperties;
|
|
123
|
+
private setPopupActions;
|
|
72
124
|
static ɵfac: i0.ɵɵFactoryDeclaration<PoChartComponent, never>;
|
|
73
|
-
static ɵcmp: i0.ɵɵComponentDeclaration<PoChartComponent, "po-chart
|
|
125
|
+
static ɵcmp: i0.ɵɵComponentDeclaration<PoChartComponent, "po-chart", never, {}, {}, never, never, false, never>;
|
|
74
126
|
}
|
|
@@ -1,26 +1,9 @@
|
|
|
1
1
|
import * as i0 from "@angular/core";
|
|
2
|
-
import * as i1 from "./po-chart
|
|
3
|
-
import * as i2 from "
|
|
4
|
-
import * as i3 from "
|
|
5
|
-
import * as i4 from "
|
|
6
|
-
import * as i5 from "
|
|
7
|
-
import * as i6 from "./po-chart-container/po-chart-container.component";
|
|
8
|
-
import * as i7 from "./po-chart-legend/po-chart-legend.component";
|
|
9
|
-
import * as i8 from "./po-chart-container/po-chart-line/po-chart-line.component";
|
|
10
|
-
import * as i9 from "./po-chart-container/po-chart-line/po-chart-path/po-chart-path.component";
|
|
11
|
-
import * as i10 from "./po-chart-container/po-chart-circular/po-chart-pie/po-chart-pie.component";
|
|
12
|
-
import * as i11 from "./po-chart-container/po-chart-circular/po-chart-donut/po-chart-donut.component";
|
|
13
|
-
import * as i12 from "./po-chart-container/po-chart-line/po-chart-series-point/po-chart-series-point.component";
|
|
14
|
-
import * as i13 from "./po-chart-container/po-chart-bar/po-chart-bar.component";
|
|
15
|
-
import * as i14 from "./po-chart-container/po-chart-bar/po-chart-column/po-chart-column.component";
|
|
16
|
-
import * as i15 from "./po-chart-container/po-chart-bar/po-chart-bar-path/po-chart-bar-path.component";
|
|
17
|
-
import * as i16 from "./po-chart-container/po-chart-circular/po-chart-circular-path/po-chart-circular-path.component";
|
|
18
|
-
import * as i17 from "./po-chart-container/po-chart-circular/po-chart-circular-label/po-chart-circular-label.component";
|
|
19
|
-
import * as i18 from "./po-chart-container/po-chart-circular/po-chart-circular-path/po-chart-tooltip.directive";
|
|
20
|
-
import * as i19 from "./directives/po-resize-observer.directive";
|
|
21
|
-
import * as i20 from "./po-chart-switch.component";
|
|
22
|
-
import * as i21 from "@angular/common";
|
|
23
|
-
import * as i22 from "../../directives/po-tooltip/po-tooltip.module";
|
|
2
|
+
import * as i1 from "./po-chart.component";
|
|
3
|
+
import * as i2 from "@angular/common";
|
|
4
|
+
import * as i3 from "../../directives/po-tooltip/po-tooltip.module";
|
|
5
|
+
import * as i4 from "../po-button/po-button.module";
|
|
6
|
+
import * as i5 from "../po-popup/po-popup.module";
|
|
24
7
|
/**
|
|
25
8
|
* @description
|
|
26
9
|
*
|
|
@@ -28,6 +11,6 @@ import * as i22 from "../../directives/po-tooltip/po-tooltip.module";
|
|
|
28
11
|
*/
|
|
29
12
|
export declare class PoChartModule {
|
|
30
13
|
static ɵfac: i0.ɵɵFactoryDeclaration<PoChartModule, never>;
|
|
31
|
-
static ɵmod: i0.ɵɵNgModuleDeclaration<PoChartModule, [typeof i1.
|
|
14
|
+
static ɵmod: i0.ɵɵNgModuleDeclaration<PoChartModule, [typeof i1.PoChartComponent], [typeof i2.CommonModule, typeof i3.PoTooltipModule, typeof i4.PoButtonModule, typeof i5.PoPopupModule], [typeof i1.PoChartComponent]>;
|
|
32
15
|
static ɵinj: i0.ɵɵInjectorDeclaration<PoChartModule>;
|
|
33
16
|
}
|
|
@@ -24,6 +24,7 @@ export declare class PoDisclaimerBaseComponent {
|
|
|
24
24
|
property?: string;
|
|
25
25
|
disclaimerCustomWidth: number;
|
|
26
26
|
lastDisclaimer: boolean;
|
|
27
|
+
appendInBody: boolean;
|
|
27
28
|
tooltipPosition: string;
|
|
28
29
|
/**
|
|
29
30
|
* @optional
|
|
@@ -64,5 +65,5 @@ export declare class PoDisclaimerBaseComponent {
|
|
|
64
65
|
getLabel(): string;
|
|
65
66
|
setAriaLabel(): string;
|
|
66
67
|
static ɵfac: i0.ɵɵFactoryDeclaration<PoDisclaimerBaseComponent, never>;
|
|
67
|
-
static ɵdir: i0.ɵɵDirectiveDeclaration<PoDisclaimerBaseComponent, never, never, { "label": { "alias": "p-label"; "required": false; }; "value": { "alias": "p-value"; "required": false; }; "property": { "alias": "p-property"; "required": false; }; "disclaimerCustomWidth": { "alias": "p-disclaimer-custom-width"; "required": false; }; "lastDisclaimer": { "alias": "p-last-disclaimer"; "required": false; }; "tooltipPosition": { "alias": "p-tooltip-position"; "required": false; }; "hideClose": { "alias": "p-hide-close"; "required": false; }; "type": { "alias": "p-type"; "required": false; }; }, { "closeAction": "p-close-action"; "clickNumber": "p-click-number"; }, never, never, true, never>;
|
|
68
|
+
static ɵdir: i0.ɵɵDirectiveDeclaration<PoDisclaimerBaseComponent, never, never, { "label": { "alias": "p-label"; "required": false; }; "value": { "alias": "p-value"; "required": false; }; "property": { "alias": "p-property"; "required": false; }; "disclaimerCustomWidth": { "alias": "p-disclaimer-custom-width"; "required": false; }; "lastDisclaimer": { "alias": "p-last-disclaimer"; "required": false; }; "appendInBody": { "alias": "p-append-in-body"; "required": false; }; "tooltipPosition": { "alias": "p-tooltip-position"; "required": false; }; "hideClose": { "alias": "p-hide-close"; "required": false; }; "type": { "alias": "p-type"; "required": false; }; }, { "closeAction": "p-close-action"; "clickNumber": "p-click-number"; }, never, never, true, never>;
|
|
68
69
|
}
|
|
@@ -33,8 +33,6 @@ export declare const poMultiselectLiteralsDefault: {
|
|
|
33
33
|
*
|
|
34
34
|
* - Caso a lista apresente menos de 5 itens, considere utilizar outro componente;
|
|
35
35
|
* - Não utilize o multiselect caso o usuário possa selecionar apenas uma opção. Para esse caso, opte por utilizar po-radio ou po-select;
|
|
36
|
-
* - Sempre que possível, agrupe as opções e use labels curtas para descrever o conteúdo. Exemplo: em uma combinação de alimentos,
|
|
37
|
-
* as opções podem ser agrupadas por Vegetais, Frutas, etc;
|
|
38
36
|
*
|
|
39
37
|
* #### Acessibilidade tratada no componente
|
|
40
38
|
*
|
|
@@ -0,0 +1,69 @@
|
|
|
1
|
+
import { PoChartHeaderOptions } from '../../po-chart';
|
|
2
|
+
/**
|
|
3
|
+
* @usedBy PoGaugeComponent
|
|
4
|
+
*
|
|
5
|
+
* @description
|
|
6
|
+
*
|
|
7
|
+
* *Interface* para configurações dos elementos do gráfico.
|
|
8
|
+
*/
|
|
9
|
+
export interface PoGaugeOptions {
|
|
10
|
+
/**
|
|
11
|
+
* @optional
|
|
12
|
+
*
|
|
13
|
+
* @description
|
|
14
|
+
*
|
|
15
|
+
* Define a descrição do gráfico exibido acima do gráfico.
|
|
16
|
+
*
|
|
17
|
+
*/
|
|
18
|
+
descriptionChart?: string;
|
|
19
|
+
/**
|
|
20
|
+
* @optional
|
|
21
|
+
*
|
|
22
|
+
* @description
|
|
23
|
+
*
|
|
24
|
+
* Define um objeto do tipo `PoChartHeaderOptions` para configurar a exibição de botões no cabeçalho do gráfico.
|
|
25
|
+
*/
|
|
26
|
+
header?: PoChartHeaderOptions;
|
|
27
|
+
/**
|
|
28
|
+
* @optional
|
|
29
|
+
*
|
|
30
|
+
* @description
|
|
31
|
+
*
|
|
32
|
+
* Esconde a estilização do container em volta do gráfico.
|
|
33
|
+
*
|
|
34
|
+
* @default `true`
|
|
35
|
+
*/
|
|
36
|
+
showContainerGauge?: boolean;
|
|
37
|
+
/**
|
|
38
|
+
* @optional
|
|
39
|
+
*
|
|
40
|
+
* @description
|
|
41
|
+
*
|
|
42
|
+
* Exibe os valores das propriedades `from` e `to` no gráfico do no texto da legenda entre parênteses.
|
|
43
|
+
*
|
|
44
|
+
* > Válido para gráfico do tipo `Gauge`.
|
|
45
|
+
*
|
|
46
|
+
*/
|
|
47
|
+
showFromToLegend?: boolean;
|
|
48
|
+
/**
|
|
49
|
+
* @optional
|
|
50
|
+
*
|
|
51
|
+
* @description
|
|
52
|
+
*
|
|
53
|
+
* Define um subtítulo para o Gauge. Indicamos um subtítulo pequeno, com uma quantidade máxima de 32 caracteres na altura padrão.
|
|
54
|
+
*
|
|
55
|
+
*/
|
|
56
|
+
subtitleGauge?: string;
|
|
57
|
+
/**
|
|
58
|
+
* @optional
|
|
59
|
+
*
|
|
60
|
+
* @description
|
|
61
|
+
*
|
|
62
|
+
* Define a exibição do ponteiro.
|
|
63
|
+
*
|
|
64
|
+
* > Válido para gráfico do tipo `Gauge`.
|
|
65
|
+
*
|
|
66
|
+
* @default `true`
|
|
67
|
+
*/
|
|
68
|
+
pointer?: boolean;
|
|
69
|
+
}
|