@dangl/angular-ava 1.1.2-beta0166 → 1.2.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/README.md
CHANGED
|
@@ -2,16 +2,16 @@
|
|
|
2
2
|
|
|
3
3
|
[](https://www.npmjs.com/package/@dangl/angular-ava)
|
|
4
4
|
|
|
5
|
-
`@dangl/angular-ava` is an UI library for Angular applications. It's used to render trees of AVA Projects. _AVA_ in German stands for _Ausschreibung, Vergabe & Abrechnung_ (_Tendering, awarding & billing_), they represent services and elements of construction projects.
|
|
5
|
+
`@dangl/angular-ava` is an UI library for Angular applications. It's used to render trees of AVA Projects. _AVA_ in German stands for _Ausschreibung, Vergabe & Abrechnung_ (_Tendering, awarding & billing_), they represent services and elements of construction projects. Additionally, it has components for displaying invoice views for e.g. the XRechnung standard for electronic invoices.
|
|
6
6
|
|
|
7
7
|
[AVACloud by Dangl**IT** GmbH](https://www.dangl-it.com/products/avacloud-gaeb-saas/) is one way of creating such data structures.
|
|
8
8
|
|
|
9
9
|
## Usage
|
|
10
10
|
|
|
11
|
-
### Import the Component
|
|
11
|
+
### Import the Component
|
|
12
12
|
|
|
13
13
|
```typescript
|
|
14
|
-
import { AvaTreeComponent } from
|
|
14
|
+
import { AvaTreeComponent } from "@dangl/angular-ava";
|
|
15
15
|
|
|
16
16
|
@Component({
|
|
17
17
|
imports: [AvaTreeComponent],
|
|
@@ -22,136 +22,109 @@ export class AppComponent {}
|
|
|
22
22
|
### Use the Component
|
|
23
23
|
|
|
24
24
|
```html
|
|
25
|
-
<ava-tree [project]="projectData"
|
|
26
|
-
</ava-tree>
|
|
25
|
+
<ava-tree [project]="projectData" [config]="config"> </ava-tree>
|
|
27
26
|
```
|
|
28
27
|
|
|
29
28
|
`projectData` must be of type `ProjectDto`.
|
|
30
29
|
|
|
31
|
-
###
|
|
30
|
+
### Configuration
|
|
32
31
|
|
|
33
32
|
```typescript
|
|
34
|
-
|
|
35
|
-
|
|
36
|
-
|
|
37
|
-
|
|
38
|
-
|
|
39
|
-
|
|
40
|
-
|
|
41
|
-
|
|
42
|
-
|
|
43
|
-
|
|
44
|
-
*/
|
|
45
|
-
|
|
46
|
-
|
|
47
|
-
/**
|
|
48
|
-
|
|
49
|
-
|
|
50
|
-
|
|
51
|
-
|
|
52
|
-
|
|
53
|
-
|
|
54
|
-
|
|
55
|
-
|
|
56
|
-
|
|
57
|
-
|
|
58
|
-
|
|
59
|
-
/**
|
|
60
|
-
|
|
61
|
-
|
|
62
|
-
|
|
63
|
-
|
|
64
|
-
|
|
65
|
-
/**
|
|
66
|
-
|
|
67
|
-
|
|
68
|
-
|
|
69
|
-
|
|
70
|
-
|
|
71
|
-
|
|
72
|
-
|
|
73
|
-
|
|
74
|
-
|
|
75
|
-
|
|
76
|
-
|
|
77
|
-
|
|
78
|
-
|
|
79
|
-
|
|
80
|
-
|
|
81
|
-
|
|
82
|
-
|
|
83
|
-
|
|
84
|
-
|
|
85
|
-
|
|
86
|
-
|
|
87
|
-
|
|
88
|
-
|
|
89
|
-
|
|
90
|
-
|
|
91
|
-
|
|
92
|
-
|
|
93
|
-
|
|
94
|
-
|
|
95
|
-
|
|
96
|
-
|
|
97
|
-
|
|
98
|
-
|
|
99
|
-
|
|
100
|
-
|
|
101
|
-
|
|
102
|
-
|
|
103
|
-
|
|
104
|
-
|
|
105
|
-
|
|
106
|
-
|
|
107
|
-
|
|
108
|
-
|
|
109
|
-
|
|
110
|
-
|
|
111
|
-
|
|
112
|
-
|
|
113
|
-
|
|
114
|
-
|
|
115
|
-
|
|
116
|
-
|
|
117
|
-
|
|
33
|
+
export interface IConfigurationTree {
|
|
34
|
+
/**
|
|
35
|
+
* Optionally, you can supply a map of expansion states for the tree. The keys should be the
|
|
36
|
+
* id properties of the elements in the tree, and the values should be true if the element is
|
|
37
|
+
* expanded, and false if it is collapsed.
|
|
38
|
+
*/
|
|
39
|
+
expansionState?: { [id: string]: boolean };
|
|
40
|
+
|
|
41
|
+
/**
|
|
42
|
+
* Optionally, you can supply the id of the node that should be selected in the tree initially.
|
|
43
|
+
* */
|
|
44
|
+
selectedNodeId?: string;
|
|
45
|
+
|
|
46
|
+
/**
|
|
47
|
+
* Optional, defaults to 20px. If this is set, then the tree will be indented by the given value each level.
|
|
48
|
+
* This can be any valid CSS value for the padding-left property, such as 20px, 1em, or 5%.
|
|
49
|
+
*/
|
|
50
|
+
indent?: string;
|
|
51
|
+
|
|
52
|
+
/**
|
|
53
|
+
* Optional, you can supply a color to be used as the background color for the selected line. Defaults to the primary
|
|
54
|
+
* color from the Material theme, which is #00acc1.
|
|
55
|
+
*/
|
|
56
|
+
selectedColor?: string;
|
|
57
|
+
|
|
58
|
+
/**
|
|
59
|
+
* You can specify which view type to use for the tree. The default is ModeViewType.Tree, but you can also use
|
|
60
|
+
* ModeViewType.List or ModeViewType.Table.
|
|
61
|
+
*/
|
|
62
|
+
modeView?: ModeViewType;
|
|
63
|
+
|
|
64
|
+
/**
|
|
65
|
+
* Optional, defaults to true. If this is disabled, then the double click event for elements is not raised, and clicking on an elemt sends an immediate result since the component has not to wait and check if a double click event is fired.
|
|
66
|
+
*/
|
|
67
|
+
allowDblClick?: boolean;
|
|
68
|
+
|
|
69
|
+
/**
|
|
70
|
+
* If this is set to true, then the tree will be in selection mode, and the user can select elements by clicking on them. The selected elements will be emitted in the selectedElementsChanged event.
|
|
71
|
+
*/
|
|
72
|
+
isSelectionMode?: boolean;
|
|
73
|
+
|
|
74
|
+
/**
|
|
75
|
+
* You can optionally supply a list of elements that should be selected initially. This is only used if isSelectionMode is true.
|
|
76
|
+
*/
|
|
77
|
+
initiallySelectedElements?: SelectedElement[];
|
|
78
|
+
|
|
79
|
+
/**
|
|
80
|
+
* You can supply a map of strings to be used for the text in the tree. This allows you to translate the text in the tree to other languages. There are also 'DEFAULT_TEXT_WORDS' and 'germanTextsAva' supplied with the package. You may optionally just submit the string values 'en' or 'de' to use the default text words for English or German.
|
|
81
|
+
*/
|
|
82
|
+
textWords?: ITextWords | "en" | "de";
|
|
83
|
+
|
|
84
|
+
/**
|
|
85
|
+
* Defaults to true. If this is enabled, then navigating in the tree with the keyboard only works if the mouse is over the tree area. This limitation is useful if you have multiple trees or other components that might be using keyboard input.
|
|
86
|
+
*/
|
|
87
|
+
mouseAwareKeyboardControl?: boolean;
|
|
88
|
+
|
|
89
|
+
/**
|
|
90
|
+
* With this parameter, you can configure which keys will be listenend to to switch the tree elements, and also to disable the functionality of the keys
|
|
91
|
+
*/
|
|
92
|
+
customKeyboardOperationConfig?: IKeyboardOperationConfig | null;
|
|
93
|
+
|
|
94
|
+
/**
|
|
95
|
+
* You can supply custom filters that are processed when the filter input is changed. Default filters are used that check for short text and item number matches, and you can either add custom filters or replace the default ones.
|
|
96
|
+
*/
|
|
97
|
+
listFilterFunc?: FilterFunction[];
|
|
98
|
+
|
|
99
|
+
/**
|
|
100
|
+
* Optional. For table views, this allows you to add custom columns to the table.
|
|
101
|
+
* addTableColumns: Array of objects
|
|
102
|
+
* {
|
|
103
|
+
* name: string, // name of column
|
|
104
|
+
* title: string, // showed title of column
|
|
105
|
+
* align?: string, // optional alight: left(default) / center / right
|
|
106
|
+
* numberFormat?: string // optional format of number value, example: '1.2-2'
|
|
107
|
+
* }
|
|
108
|
+
*/
|
|
109
|
+
addTableColumns?: TableColumnType[];
|
|
110
|
+
|
|
111
|
+
/**
|
|
112
|
+
* This allows you to supply a list of functions that can be used to change the appearance of elements.
|
|
113
|
+
* They objects contain a predicate function that is evaluated, along with an option to configure the appearance of the element.
|
|
114
|
+
* functionView: Array of objects
|
|
115
|
+
* {
|
|
116
|
+
* name: string, // name of view part: you can add/remove it when needed
|
|
117
|
+
* func: (element: any, result?: any) => boolean, // this filter function calculates conditions to change the view
|
|
118
|
+
* view: {
|
|
119
|
+
* iconName?: string, // changed name of icon
|
|
120
|
+
* iconColor?: string, // changed color of icon
|
|
121
|
+
* textBold?: string, // changed weight of text
|
|
122
|
+
* textColor?: string // changed color of text
|
|
123
|
+
* }
|
|
124
|
+
* }
|
|
125
|
+
*/
|
|
126
|
+
functionView?: IFunctionViewLine[];
|
|
118
127
|
}
|
|
119
|
-
|
|
120
|
-
/**
|
|
121
|
-
* You can supply custom filters that are processed when the filter input is changed. Default filters are used
|
|
122
|
-
* that check for short text and item number matches, and you can either add custom filters or replace the default ones.
|
|
123
|
-
*/
|
|
124
|
-
@Input() listFilterFunc = DEFAULT_FILTERS;
|
|
125
|
-
|
|
126
|
-
/**
|
|
127
|
-
* Optional. For table views, this allows you to add custom columns to the table.
|
|
128
|
-
* addTableColumns: Array of objects
|
|
129
|
-
* {
|
|
130
|
-
* name: string, // name of column
|
|
131
|
-
* title: string, // showed title of column
|
|
132
|
-
* align?: string, // optional alight: left(default) / center / right
|
|
133
|
-
* numberFormat?: string // optional format of number value, example: '1.2-2'
|
|
134
|
-
* }
|
|
135
|
-
*/
|
|
136
|
-
@Input() addTableColumns: TableColumnType[] = [];
|
|
137
|
-
|
|
138
|
-
/**
|
|
139
|
-
* This allows you to supply a list of functions that can be used to change the appearance of elements.
|
|
140
|
-
* They objects contain a predicate function that is evaluated, along with an option to configure the
|
|
141
|
-
* appearance of the element.
|
|
142
|
-
* functionView: Array of objects
|
|
143
|
-
* {
|
|
144
|
-
* name: string, // name of view part: you can add/remove it when it need
|
|
145
|
-
* func: (element: any, result?: any) => boolean, // this filter function calculate condition to change view
|
|
146
|
-
* view: {
|
|
147
|
-
* iconName?: string, // changed name of icon
|
|
148
|
-
* iconColor?: string, // changed color of icon
|
|
149
|
-
* textBold?: string, // changed weight of text
|
|
150
|
-
* textColor?: string // changed color of text
|
|
151
|
-
* }
|
|
152
|
-
* }
|
|
153
|
-
*/
|
|
154
|
-
@Input() functionView: IFunctionViewLine[] | null = null;
|
|
155
128
|
```
|
|
156
129
|
|
|
157
130
|
### Output Parameters
|
|
@@ -180,14 +153,14 @@ export class AppComponent {}
|
|
|
180
153
|
|
|
181
154
|
## Invoice Module
|
|
182
155
|
|
|
183
|
-
There is also an `InvoiceDisplayComponent` available that can be used to show invoice objects.
|
|
156
|
+
There is also an `InvoiceDisplayComponent` available that can be used to show invoice objects.
|
|
184
157
|
|
|
185
158
|
## Usage
|
|
186
159
|
|
|
187
|
-
### Import the Component
|
|
160
|
+
### Import the Component
|
|
188
161
|
|
|
189
162
|
```typescript
|
|
190
|
-
import { InvoiceDisplayComponent } from
|
|
163
|
+
import { InvoiceDisplayComponent } from "@dangl/angular-ava";
|
|
191
164
|
|
|
192
165
|
@Component({
|
|
193
166
|
imports: [InvoiceDisplayComponent],
|
|
@@ -198,7 +171,25 @@ export class AppComponent {}
|
|
|
198
171
|
### Use the Component
|
|
199
172
|
|
|
200
173
|
```html
|
|
201
|
-
<ava-invoice-display
|
|
174
|
+
<ava-invoice-display
|
|
175
|
+
[invoice]="INVOICE"
|
|
176
|
+
[config]="config"
|
|
177
|
+
></ava-invoice-display>
|
|
202
178
|
```
|
|
203
179
|
|
|
204
|
-
`INVOICE` must be of type `Invoice`.
|
|
180
|
+
`INVOICE` must be of type `Invoice`.
|
|
181
|
+
|
|
182
|
+
### Configuration
|
|
183
|
+
|
|
184
|
+
```typescript
|
|
185
|
+
export interface IConfigurationInvoice {
|
|
186
|
+
//** If specified, the invoice viewer will use the given textWords for the text in the UI. */
|
|
187
|
+
textWords?: ITextWordInvoice | null;
|
|
188
|
+
|
|
189
|
+
//** If specified, the invoice viewer will use non-interactive display features, . */
|
|
190
|
+
pdfViewEnabled?: boolean;
|
|
191
|
+
|
|
192
|
+
//** If specified, the invoice viewer will use the given language for the text in the UI. */
|
|
193
|
+
language?: "en" | "de";
|
|
194
|
+
}
|
|
195
|
+
```
|
|
@@ -241,12 +241,12 @@ var ModeViewType;
|
|
|
241
241
|
|
|
242
242
|
// This file is automatically generated as part of the build process
|
|
243
243
|
const version = {
|
|
244
|
-
version: "1.
|
|
245
|
-
commitInfo: "Branch.
|
|
244
|
+
version: "1.2.0",
|
|
245
|
+
commitInfo: "Branch.main.Sha.ba26896a5cbad38532eaed0f969dbc28bf3cc957",
|
|
246
246
|
commitDate: "2025-01-15",
|
|
247
|
-
commitHash: "
|
|
248
|
-
informationalVersion: "1.
|
|
249
|
-
buildDateUtc: new Date(Date.UTC(2025, 0, 15,
|
|
247
|
+
commitHash: "ba26896a5cbad38532eaed0f969dbc28bf3cc957",
|
|
248
|
+
informationalVersion: "1.2.0+Branch.main.Sha.ba26896a5cbad38532eaed0f969dbc28bf3cc957",
|
|
249
|
+
buildDateUtc: new Date(Date.UTC(2025, 0, 15, 21, 29, 26))
|
|
250
250
|
};
|
|
251
251
|
|
|
252
252
|
class ExpandParentGroupService {
|