@masterteam/client-components 0.0.58 → 0.0.60
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.
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
/*! tailwindcss v4.3.
|
|
1
|
+
/*! tailwindcss v4.3.3 | MIT License | https://tailwindcss.com */
|
|
2
2
|
@layer properties{@supports (((-webkit-hyphens:none)) and (not (margin-trim:inline))) or ((-moz-orient:inline) and (not (color:rgb(from red r g b)))){*,:before,:after,::backdrop{--tw-border-style:solid;--tw-font-weight:initial;--tw-tracking:initial;--tw-shadow:0 0 #0000;--tw-shadow-color:initial;--tw-shadow-alpha:100%;--tw-inset-shadow:0 0 #0000;--tw-inset-shadow-color:initial;--tw-inset-shadow-alpha:100%;--tw-ring-color:initial;--tw-ring-shadow:0 0 #0000;--tw-inset-ring-color:initial;--tw-inset-ring-shadow:0 0 #0000;--tw-ring-inset:initial;--tw-ring-offset-width:0px;--tw-ring-offset-color:#fff;--tw-ring-offset-shadow:0 0 #0000;--tw-blur:initial;--tw-brightness:initial;--tw-contrast:initial;--tw-grayscale:initial;--tw-hue-rotate:initial;--tw-invert:initial;--tw-opacity:initial;--tw-saturate:initial;--tw-sepia:initial;--tw-drop-shadow:initial;--tw-drop-shadow-color:initial;--tw-drop-shadow-alpha:100%;--tw-drop-shadow-size:initial}}}@layer theme{:root,:host{--font-sans:ui-sans-serif, system-ui, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", "Noto Color Emoji";--font-mono:ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", "Courier New", monospace;--color-red-50:oklch(97.1% .013 17.38);--color-red-200:oklch(88.5% .062 18.334);--color-red-600:oklch(57.7% .245 27.325);--color-red-700:oklch(50.5% .213 27.518);--color-red-950:oklch(25.8% .092 26.042);--color-gray-100:oklch(96.7% .003 264.542);--color-gray-200:oklch(92.8% .006 264.531);--color-gray-400:oklch(70.7% .022 261.325);--color-gray-500:oklch(55.1% .027 264.364);--color-gray-700:oklch(37.3% .034 259.733);--color-gray-900:oklch(21% .034 264.665);--spacing:.25rem;--container-md:28rem;--text-xs:.75rem;--text-xs--line-height:calc(1 / .75);--text-sm:.875rem;--text-sm--line-height:calc(1.25 / .875);--text-base:1rem;--text-base--line-height:calc(1.5 / 1);--text-lg:1.125rem;--text-lg--line-height:calc(1.75 / 1.125);--font-weight-semibold:600;--tracking-wide:.025em;--radius-lg:.5rem;--radius-xl:.75rem;--animate-pulse:pulse 2s cubic-bezier(.4, 0, .6, 1) infinite;--default-transition-duration:.15s;--default-transition-timing-function:cubic-bezier(.4, 0, .2, 1);--default-font-family:var(--font-sans);--default-mono-font-family:var(--font-mono)}}@layer base{*,:after,:before,::backdrop{box-sizing:border-box;border:0 solid;margin:0;padding:0}::file-selector-button{box-sizing:border-box;border:0 solid;margin:0;padding:0}html,:host{-webkit-text-size-adjust:100%;tab-size:4;line-height:1.5;font-family:var(--default-font-family,ui-sans-serif, system-ui, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", "Noto Color Emoji");font-feature-settings:var(--default-font-feature-settings,normal);font-variation-settings:var(--default-font-variation-settings,normal);-webkit-tap-highlight-color:transparent}hr{height:0;color:inherit;border-top-width:1px}abbr:where([title]){-webkit-text-decoration:underline dotted;text-decoration:underline dotted}h1,h2,h3,h4,h5,h6{font-size:inherit;font-weight:inherit}a{color:inherit;-webkit-text-decoration:inherit;-webkit-text-decoration:inherit;-webkit-text-decoration:inherit;text-decoration:inherit}b,strong{font-weight:bolder}code,kbd,samp,pre{font-family:var(--default-mono-font-family,ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", "Courier New", monospace);font-feature-settings:var(--default-mono-font-feature-settings,normal);font-variation-settings:var(--default-mono-font-variation-settings,normal);font-size:1em}small{font-size:80%}sub,sup{vertical-align:baseline;font-size:75%;line-height:0;position:relative}sub{bottom:-.25em}sup{top:-.5em}table{text-indent:0;border-color:inherit;border-collapse:collapse}:-moz-focusring{outline:auto}progress{vertical-align:baseline}summary{display:list-item}ol,ul,menu{list-style:none}img,svg,video,canvas,audio,iframe,embed,object{vertical-align:middle;display:block}img,video{max-width:100%;height:auto}button,input,select,optgroup,textarea{font:inherit;font-feature-settings:inherit;font-variation-settings:inherit;letter-spacing:inherit;color:inherit;opacity:1;background-color:#0000;border-radius:0}::file-selector-button{font:inherit;font-feature-settings:inherit;font-variation-settings:inherit;letter-spacing:inherit;color:inherit;opacity:1;background-color:#0000;border-radius:0}:where(select:is([multiple],[size])) optgroup{font-weight:bolder}:where(select:is([multiple],[size])) optgroup option{padding-inline-start:20px}::file-selector-button{margin-inline-end:4px}::placeholder{opacity:1}@supports (not ((-webkit-appearance:-apple-pay-button))) or (contain-intrinsic-size:1px){::placeholder{color:currentColor}@supports (color:color-mix(in lab, red, red)){::placeholder{color:color-mix(in oklab, currentcolor 50%, transparent)}}}textarea{resize:vertical}::-webkit-search-decoration{-webkit-appearance:none}::-webkit-date-and-time-value{min-height:1lh;text-align:inherit}::-webkit-datetime-edit{display:inline-flex}::-webkit-datetime-edit-fields-wrapper{padding:0}::-webkit-datetime-edit{padding-block:0}::-webkit-datetime-edit-year-field{padding-block:0}::-webkit-datetime-edit-month-field{padding-block:0}::-webkit-datetime-edit-day-field{padding-block:0}::-webkit-datetime-edit-hour-field{padding-block:0}::-webkit-datetime-edit-minute-field{padding-block:0}::-webkit-datetime-edit-second-field{padding-block:0}::-webkit-datetime-edit-millisecond-field{padding-block:0}::-webkit-datetime-edit-meridiem-field{padding-block:0}::-webkit-calendar-picker-indicator{line-height:1}:-moz-ui-invalid{box-shadow:none}button,input:where([type=button],[type=reset],[type=submit]){appearance:button}::file-selector-button{appearance:button}::-webkit-inner-spin-button{height:auto}::-webkit-outer-spin-button{height:auto}[hidden]:where(:not([hidden=until-found])){display:none!important}}@layer components;@layer utilities{.collapse{visibility:collapse}.visible{visibility:visible}.absolute{position:absolute}.relative{position:relative}.end-2{inset-inline-end:calc(var(--spacing) * 2)}.top-2{top:calc(var(--spacing) * 2)}.z-10{z-index:10}.col-span-1{grid-column:span 1/span 1}.container{width:100%}@media (min-width:40rem){.container{max-width:40rem}}@media (min-width:48rem){.container{max-width:48rem}}@media (min-width:64rem){.container{max-width:64rem}}@media (min-width:80rem){.container{max-width:80rem}}@media (min-width:96rem){.container{max-width:96rem}}.m-0{margin:0}.mb-3{margin-bottom:calc(var(--spacing) * 3)}.ml-auto{margin-left:auto}.flex{display:flex}.grid{display:grid}.hidden{display:none}.inline{display:inline}.inline-block{display:inline-block}.inline-flex{display:inline-flex}.table{display:table}.h-4{height:calc(var(--spacing) * 4)}.h-5{height:calc(var(--spacing) * 5)}.min-h-\[20rem\]{min-height:20rem}.min-h-\[22rem\]{min-height:22rem}.min-h-\[420px\]{min-height:420px}.w-1{width:var(--spacing)}.w-28{width:calc(var(--spacing) * 28)}.w-40{width:calc(var(--spacing) * 40)}.w-full{width:100%}.max-w-md{max-width:var(--container-md)}.min-w-0{min-width:0}.min-w-44{min-width:calc(var(--spacing) * 44)}.flex-1{flex:1}.shrink-0{flex-shrink:0}.animate-pulse{animation:var(--animate-pulse)}.cursor-pointer{cursor:pointer}.grid-cols-1{grid-template-columns:repeat(1,minmax(0,1fr))}.flex-col{flex-direction:column}.items-center{align-items:center}.justify-center{justify-content:center}.justify-end{justify-content:flex-end}.gap-1{gap:var(--spacing)}.gap-2{gap:calc(var(--spacing) * 2)}.gap-3{gap:calc(var(--spacing) * 3)}.gap-4{gap:calc(var(--spacing) * 4)}.gap-5{gap:calc(var(--spacing) * 5)}.gap-6{gap:calc(var(--spacing) * 6)}.rounded{border-radius:.25rem}.rounded-full{border-radius:3.40282e38px}.rounded-lg{border-radius:var(--radius-lg)}.rounded-xl{border-radius:var(--radius-xl)}.border{border-style:var(--tw-border-style);border-width:1px}.border-y{border-block-style:var(--tw-border-style);border-block-width:1px}.border-dashed{--tw-border-style:dashed;border-style:dashed}.border-red-200{border-color:var(--color-red-200)}.border-surface-200{border-color:var(--p-surface-200)}@supports (color:color-mix(in lab, red, red)){.border-surface-200{border-color:color-mix(in srgb, var(--p-surface-200) calc(100% * 1), transparent)}}.border-surface-300{border-color:var(--p-surface-300)}@supports (color:color-mix(in lab, red, red)){.border-surface-300{border-color:color-mix(in srgb, var(--p-surface-300) calc(100% * 1), transparent)}}.bg-primary-50{background-color:var(--p-primary-50)}@supports (color:color-mix(in lab, red, red)){.bg-primary-50{background-color:color-mix(in srgb, var(--p-primary-50) calc(100% * 1), transparent)}}.bg-red-50{background-color:var(--color-red-50)}.bg-surface-50{background-color:var(--p-surface-50)}@supports (color:color-mix(in lab, red, red)){.bg-surface-50{background-color:color-mix(in srgb, var(--p-surface-50) calc(100% * 1), transparent)}}.bg-surface-200{background-color:var(--p-surface-200)}@supports (color:color-mix(in lab, red, red)){.bg-surface-200{background-color:color-mix(in srgb, var(--p-surface-200) calc(100% * 1), transparent)}}.p-1{padding:var(--spacing)}.p-3{padding:calc(var(--spacing) * 3)}.p-4{padding:calc(var(--spacing) * 4)}.p-5{padding:calc(var(--spacing) * 5)}.p-6{padding:calc(var(--spacing) * 6)}.px-2{padding-inline:calc(var(--spacing) * 2)}.py-0\.5{padding-block:calc(var(--spacing) * .5)}.py-2{padding-block:calc(var(--spacing) * 2)}.py-3{padding-block:calc(var(--spacing) * 3)}.text-center{text-align:center}.text-start{text-align:start}.text-base{font-size:var(--text-base);line-height:var(--tw-leading,var(--text-base--line-height))}.text-lg{font-size:var(--text-lg);line-height:var(--tw-leading,var(--text-lg--line-height))}.text-sm{font-size:var(--text-sm);line-height:var(--tw-leading,var(--text-sm--line-height))}.text-xs{font-size:var(--text-xs);line-height:var(--tw-leading,var(--text-xs--line-height))}.font-semibold{--tw-font-weight:var(--font-weight-semibold);font-weight:var(--font-weight-semibold)}.tracking-wide{--tw-tracking:var(--tracking-wide);letter-spacing:var(--tracking-wide)}.text-gray-400{color:var(--color-gray-400)}.text-gray-500{color:var(--color-gray-500)}.text-gray-700{color:var(--color-gray-700)}.text-gray-900{color:var(--color-gray-900)}.text-primary-700{color:var(--p-primary-700)}@supports (color:color-mix(in lab, red, red)){.text-primary-700{color:color-mix(in srgb, var(--p-primary-700) calc(100% * 1), transparent)}}.text-red-600{color:var(--color-red-600)}.text-red-700{color:var(--color-red-700)}.text-surface-500{color:var(--p-surface-500)}@supports (color:color-mix(in lab, red, red)){.text-surface-500{color:color-mix(in srgb, var(--p-surface-500) calc(100% * 1), transparent)}}.uppercase{text-transform:uppercase}.shadow-sm{--tw-shadow:0 1px 3px 0 var(--tw-shadow-color,#0000001a), 0 1px 2px -1px var(--tw-shadow-color,#0000001a);box-shadow:var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow)}.filter{filter:var(--tw-blur,) var(--tw-brightness,) var(--tw-contrast,) var(--tw-grayscale,) var(--tw-hue-rotate,) var(--tw-invert,) var(--tw-saturate,) var(--tw-sepia,) var(--tw-drop-shadow,)}.transition-colors{transition-property:color,background-color,border-color,outline-color,text-decoration-color,fill,stroke,--tw-gradient-from,--tw-gradient-via,--tw-gradient-to;transition-timing-function:var(--tw-ease,var(--default-transition-timing-function));transition-duration:var(--tw-duration,var(--default-transition-duration))}.transition-shadow{transition-property:box-shadow;transition-timing-function:var(--tw-ease,var(--default-transition-timing-function));transition-duration:var(--tw-duration,var(--default-transition-duration))}@media (hover:hover){.hover\:bg-gray-100:hover{background-color:var(--color-gray-100)}.hover\:bg-red-50:hover{background-color:var(--color-red-50)}.hover\:shadow-md:hover{--tw-shadow:0 4px 6px -1px var(--tw-shadow-color,#0000001a), 0 2px 4px -2px var(--tw-shadow-color,#0000001a);box-shadow:var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow)}}@media (min-width:48rem){.md\:grid-cols-2{grid-template-columns:repeat(2,minmax(0,1fr))}}@media (min-width:80rem){.xl\:grid-cols-3{grid-template-columns:repeat(3,minmax(0,1fr))}}.dark\:border-surface-700:where(.dark,.dark *){border-color:var(--p-surface-700)}@supports (color:color-mix(in lab, red, red)){.dark\:border-surface-700:where(.dark,.dark *){border-color:color-mix(in srgb, var(--p-surface-700) calc(100% * 1), transparent)}}.dark\:bg-primary-950:where(.dark,.dark *){background-color:var(--p-primary-950)}@supports (color:color-mix(in lab, red, red)){.dark\:bg-primary-950:where(.dark,.dark *){background-color:color-mix(in srgb, var(--p-primary-950) calc(100% * 1), transparent)}}.dark\:bg-surface-900:where(.dark,.dark *){background-color:var(--p-surface-900)}@supports (color:color-mix(in lab, red, red)){.dark\:bg-surface-900:where(.dark,.dark *){background-color:color-mix(in srgb, var(--p-surface-900) calc(100% * 1), transparent)}}.dark\:text-gray-100:where(.dark,.dark *){color:var(--color-gray-100)}.dark\:text-gray-200:where(.dark,.dark *){color:var(--color-gray-200)}.dark\:text-gray-400:where(.dark,.dark *){color:var(--color-gray-400)}.dark\:text-primary-300:where(.dark,.dark *){color:var(--p-primary-300)}@supports (color:color-mix(in lab, red, red)){.dark\:text-primary-300:where(.dark,.dark *){color:color-mix(in srgb, var(--p-primary-300) calc(100% * 1), transparent)}}@media (hover:hover){.dark\:hover\:bg-red-950:where(.dark,.dark *):hover{background-color:var(--color-red-950)}.dark\:hover\:bg-surface-700:where(.dark,.dark *):hover{background-color:var(--p-surface-700)}@supports (color:color-mix(in lab, red, red)){.dark\:hover\:bg-surface-700:where(.dark,.dark *):hover{background-color:color-mix(in srgb, var(--p-surface-700) calc(100% * 1), transparent)}}}}@keyframes enter{0%{opacity:var(--p-enter-opacity,1);transform:translate3d(var(--p-enter-translate-x,0), var(--p-enter-translate-y,0), 0) scale3d(var(--p-enter-scale,1), var(--p-enter-scale,1), var(--p-enter-scale,1)) rotate(var(--p-enter-rotate,0))}}@keyframes leave{to{opacity:var(--p-leave-opacity,1);transform:translate3d(var(--p-leave-translate-x,0), var(--p-leave-translate-y,0), 0) scale3d(var(--p-leave-scale,1), var(--p-leave-scale,1), var(--p-leave-scale,1)) rotate(var(--p-leave-rotate,0))}}@property --tw-border-style{syntax:"*";inherits:false;initial-value:solid}@property --tw-font-weight{syntax:"*";inherits:false}@property --tw-tracking{syntax:"*";inherits:false}@property --tw-shadow{syntax:"*";inherits:false;initial-value:0 0 #0000}@property --tw-shadow-color{syntax:"*";inherits:false}@property --tw-shadow-alpha{syntax:"<percentage>";inherits:false;initial-value:100%}@property --tw-inset-shadow{syntax:"*";inherits:false;initial-value:0 0 #0000}@property --tw-inset-shadow-color{syntax:"*";inherits:false}@property --tw-inset-shadow-alpha{syntax:"<percentage>";inherits:false;initial-value:100%}@property --tw-ring-color{syntax:"*";inherits:false}@property --tw-ring-shadow{syntax:"*";inherits:false;initial-value:0 0 #0000}@property --tw-inset-ring-color{syntax:"*";inherits:false}@property --tw-inset-ring-shadow{syntax:"*";inherits:false;initial-value:0 0 #0000}@property --tw-ring-inset{syntax:"*";inherits:false}@property --tw-ring-offset-width{syntax:"<length>";inherits:false;initial-value:0}@property --tw-ring-offset-color{syntax:"*";inherits:false;initial-value:#fff}@property --tw-ring-offset-shadow{syntax:"*";inherits:false;initial-value:0 0 #0000}@property --tw-blur{syntax:"*";inherits:false}@property --tw-brightness{syntax:"*";inherits:false}@property --tw-contrast{syntax:"*";inherits:false}@property --tw-grayscale{syntax:"*";inherits:false}@property --tw-hue-rotate{syntax:"*";inherits:false}@property --tw-invert{syntax:"*";inherits:false}@property --tw-opacity{syntax:"*";inherits:false}@property --tw-saturate{syntax:"*";inherits:false}@property --tw-sepia{syntax:"*";inherits:false}@property --tw-drop-shadow{syntax:"*";inherits:false}@property --tw-drop-shadow-color{syntax:"*";inherits:false}@property --tw-drop-shadow-alpha{syntax:"<percentage>";inherits:false;initial-value:100%}@property --tw-drop-shadow-size{syntax:"*";inherits:false}@keyframes pulse{50%{opacity:.5}}
|
|
@@ -8,6 +8,7 @@ import { Button } from '@masterteam/components/button';
|
|
|
8
8
|
import { RuntimeActionRunner, resolveActionLabel } from '@masterteam/components/runtime-action';
|
|
9
9
|
import { HttpClient } from '@angular/common/http';
|
|
10
10
|
import { switchMap, of, map, Observable, share, take } from 'rxjs';
|
|
11
|
+
import { resolveLocalizedLabel, isSectionKey, EntitiesPreview } from '@masterteam/components/entities';
|
|
11
12
|
import { Table, TableExportService, TableGroupingController, TableValueResolver, TableCaption } from '@masterteam/components/table';
|
|
12
13
|
import * as i2 from 'primeng/skeleton';
|
|
13
14
|
import { SkeletonModule } from 'primeng/skeleton';
|
|
@@ -15,7 +16,6 @@ import { Card } from '@masterteam/components/card';
|
|
|
15
16
|
import { Icon } from '@masterteam/icons';
|
|
16
17
|
import { ConfirmationService } from '@masterteam/components/confirmation';
|
|
17
18
|
import { MTDateFormatPipe } from '@masterteam/components';
|
|
18
|
-
import { EntitiesPreview } from '@masterteam/components/entities';
|
|
19
19
|
import * as i3 from 'primeng/popover';
|
|
20
20
|
import { PopoverModule } from 'primeng/popover';
|
|
21
21
|
import { DashboardViewer } from '@masterteam/dashboard-builder';
|
|
@@ -25,24 +25,24 @@ class ClientListApiService {
|
|
|
25
25
|
http = inject(HttpClient);
|
|
26
26
|
runtimeFetchBaseUrl = 'fetch/query';
|
|
27
27
|
informativeBaseUrl = 'LevelData';
|
|
28
|
-
getRows(contextKey,
|
|
28
|
+
getRows(contextKey, query, filters = []) {
|
|
29
29
|
return this.resolveTablePropertyKeys(contextKey, query).pipe(switchMap((propertyKeys) => this.queryRuntime({
|
|
30
30
|
contextKey,
|
|
31
31
|
projection: 'Table',
|
|
32
32
|
surfaceKey: 'table',
|
|
33
33
|
includeState: [...DEFAULT_INCLUDE_STATE],
|
|
34
34
|
propertyKeys: propertyKeys?.length ? propertyKeys : undefined,
|
|
35
|
-
filters
|
|
35
|
+
filters,
|
|
36
36
|
page: this.toPage(query.skip, query.take),
|
|
37
37
|
pageSize: query.take,
|
|
38
38
|
})));
|
|
39
39
|
}
|
|
40
|
-
getCards(contextKey,
|
|
40
|
+
getCards(contextKey, filters = []) {
|
|
41
41
|
return this.queryRuntime({
|
|
42
42
|
contextKey,
|
|
43
43
|
projection: 'Card',
|
|
44
44
|
includeState: [...DEFAULT_INCLUDE_STATE],
|
|
45
|
-
filters
|
|
45
|
+
filters,
|
|
46
46
|
display: { areas: ['card'] },
|
|
47
47
|
});
|
|
48
48
|
}
|
|
@@ -64,19 +64,6 @@ class ClientListApiService {
|
|
|
64
64
|
.get(`LevelData/levels/${context.levelId}/modules/${context.moduleId}/table-display-settings/catalog?surfaceKey=table`)
|
|
65
65
|
.pipe(map((response) => this.toEffectiveColumnKeys(response.data?.effectiveColumns ?? [])));
|
|
66
66
|
}
|
|
67
|
-
buildInstanceFilters(instanceId) {
|
|
68
|
-
return [
|
|
69
|
-
{
|
|
70
|
-
key: 'levelDataId',
|
|
71
|
-
operator: 'Equals',
|
|
72
|
-
value: String(instanceId),
|
|
73
|
-
},
|
|
74
|
-
];
|
|
75
|
-
}
|
|
76
|
-
mergeFilters(baseFilters, extraFilters = []) {
|
|
77
|
-
const merged = [...(baseFilters ?? []), ...extraFilters];
|
|
78
|
-
return merged.length ? merged : undefined;
|
|
79
|
-
}
|
|
80
67
|
toPage(skip, take) {
|
|
81
68
|
if (take <= 0) {
|
|
82
69
|
return 1;
|
|
@@ -203,6 +190,7 @@ class ClientListStateService {
|
|
|
203
190
|
configuration: column.configuration ?? null,
|
|
204
191
|
}));
|
|
205
192
|
const propertyMaps = this.createPropertyMaps(response.catalog);
|
|
193
|
+
const lang = this.resolveActiveLang();
|
|
206
194
|
const rows = (response.records ?? []).map((record) => {
|
|
207
195
|
const row = {
|
|
208
196
|
Id: record.id,
|
|
@@ -210,7 +198,7 @@ class ClientListStateService {
|
|
|
210
198
|
};
|
|
211
199
|
columns.forEach((column) => {
|
|
212
200
|
const property = this.resolvePropertyMeta(column.key, propertyMaps);
|
|
213
|
-
row[column.key] = this.toEntityData(column.key, record.values?.[property?.key ?? column.key], property, column.viewType, column.label, column.configuration, property?.configuration, record.id, column.order ?? property?.order, propertyMaps.nestedByOwnerKey.get(property?.key ?? column.key));
|
|
201
|
+
row[column.key] = this.toEntityData(column.key, record.values?.[property?.key ?? column.key], property, column.viewType, column.label, column.configuration, property?.configuration, record.id, column.order ?? property?.order, propertyMaps.nestedByOwnerKey.get(property?.key ?? column.key), lang);
|
|
214
202
|
});
|
|
215
203
|
return row;
|
|
216
204
|
});
|
|
@@ -342,13 +330,14 @@ class ClientListStateService {
|
|
|
342
330
|
const records = this.orderRecords(data?.records ?? [], data?.projectionMeta?.groups ?? []);
|
|
343
331
|
const catalogProperties = data?.catalog?.properties ?? [];
|
|
344
332
|
const propertyMaps = this.createPropertyMaps(data?.catalog);
|
|
333
|
+
const lang = this.resolveActiveLang();
|
|
345
334
|
const descriptors = this.buildCardDescriptors(data?.projectionMeta?.displayOrder ?? [], data?.projectionMeta?.columns ?? [], propertyMaps);
|
|
346
335
|
return records.map((record) => {
|
|
347
336
|
const schema = data?.schemas?.find((item) => item.id === record.schemaId);
|
|
348
337
|
const propertyDescriptors = descriptors.length
|
|
349
338
|
? descriptors
|
|
350
339
|
: this.buildFallbackCardDescriptors(record, catalogProperties);
|
|
351
|
-
const entities = propertyDescriptors.map((propertyDescriptor) => this.toEntityData(propertyDescriptor.projectionKey, record.values?.[propertyDescriptor.recordValueKey], propertyDescriptor.property, propertyDescriptor.viewType, propertyDescriptor.label, propertyDescriptor.configuration, propertyDescriptor.propertyConfiguration, record.id, propertyDescriptor.order, propertyMaps.nestedByOwnerKey.get(propertyDescriptor.recordValueKey)));
|
|
340
|
+
const entities = propertyDescriptors.map((propertyDescriptor) => this.toEntityData(propertyDescriptor.projectionKey, record.values?.[propertyDescriptor.recordValueKey], propertyDescriptor.property, propertyDescriptor.viewType, propertyDescriptor.label, propertyDescriptor.configuration, propertyDescriptor.propertyConfiguration, record.id, propertyDescriptor.order, propertyMaps.nestedByOwnerKey.get(propertyDescriptor.recordValueKey), lang));
|
|
352
341
|
const statusColor = this.resolveCardStatusColor(entities);
|
|
353
342
|
const normalizedEntities = statusColor
|
|
354
343
|
? this.applyCardProgressColor(entities, statusColor)
|
|
@@ -401,14 +390,29 @@ class ClientListStateService {
|
|
|
401
390
|
return (response.schemas?.find((item) => item.id === recordSchemaId) ??
|
|
402
391
|
response.schemas?.[0]);
|
|
403
392
|
}
|
|
404
|
-
toEntityData(projectionKey, cell, property, viewType, label, configuration, propertyConfiguration, recordId, order, nestedProperties) {
|
|
393
|
+
toEntityData(projectionKey, cell, property, viewType, label, configuration, propertyConfiguration, recordId, order, nestedProperties, lang) {
|
|
405
394
|
const resolvedViewType = (viewType ?? 'Text');
|
|
395
|
+
// Custom label override saved on the display config (localized).
|
|
396
|
+
const customLabel = resolveLocalizedLabel(configuration?.label, lang);
|
|
397
|
+
// Section markers are layout-only: no value, heading from the label config.
|
|
398
|
+
if (resolvedViewType === 'Section') {
|
|
399
|
+
return {
|
|
400
|
+
id: recordId,
|
|
401
|
+
key: projectionKey,
|
|
402
|
+
normalizedKey: projectionKey,
|
|
403
|
+
name: customLabel,
|
|
404
|
+
value: '',
|
|
405
|
+
viewType: 'Section',
|
|
406
|
+
order: order ?? property?.order,
|
|
407
|
+
configuration: configuration,
|
|
408
|
+
};
|
|
409
|
+
}
|
|
406
410
|
return {
|
|
407
411
|
id: recordId,
|
|
408
412
|
propertyId: property?.id,
|
|
409
413
|
key: property?.key ?? projectionKey,
|
|
410
414
|
normalizedKey: property?.normalizedKey ?? projectionKey,
|
|
411
|
-
name: label
|
|
415
|
+
name: customLabel || label || property?.label || projectionKey,
|
|
412
416
|
rawValue: cell?.raw === null || cell?.raw === undefined
|
|
413
417
|
? undefined
|
|
414
418
|
: String(cell.raw),
|
|
@@ -422,6 +426,12 @@ class ClientListStateService {
|
|
|
422
426
|
comparison: cell?.comparison,
|
|
423
427
|
};
|
|
424
428
|
}
|
|
429
|
+
/** Active UI language for resolving localized display labels. */
|
|
430
|
+
resolveActiveLang() {
|
|
431
|
+
if (typeof document === 'undefined')
|
|
432
|
+
return 'en';
|
|
433
|
+
return document.documentElement.lang || 'en';
|
|
434
|
+
}
|
|
425
435
|
createPropertyMaps(catalog) {
|
|
426
436
|
const properties = catalog?.properties ?? [];
|
|
427
437
|
return {
|
|
@@ -437,6 +447,19 @@ class ClientListStateService {
|
|
|
437
447
|
buildCardDescriptors(displayOrder, columns, propertyMaps) {
|
|
438
448
|
if (displayOrder?.length) {
|
|
439
449
|
return displayOrder.map((item) => {
|
|
450
|
+
// Section markers carry a synthetic key with no backing property.
|
|
451
|
+
if (isSectionKey(item.propertyKey)) {
|
|
452
|
+
return {
|
|
453
|
+
projectionKey: item.propertyKey,
|
|
454
|
+
recordValueKey: item.propertyKey,
|
|
455
|
+
property: undefined,
|
|
456
|
+
label: undefined,
|
|
457
|
+
viewType: 'Section',
|
|
458
|
+
order: item.order,
|
|
459
|
+
configuration: item.configuration ?? null,
|
|
460
|
+
propertyConfiguration: null,
|
|
461
|
+
};
|
|
462
|
+
}
|
|
440
463
|
const property = this.resolvePropertyMeta(item.propertyKey, propertyMaps);
|
|
441
464
|
return {
|
|
442
465
|
projectionKey: item.propertyKey,
|
|
@@ -842,7 +865,10 @@ class ClientListCardsView {
|
|
|
842
865
|
const sampleCard = this.cardsState().cards[0];
|
|
843
866
|
if (!sampleCard?.entities?.length)
|
|
844
867
|
return [];
|
|
845
|
-
|
|
868
|
+
// Section markers are card-layout only — never table columns.
|
|
869
|
+
return sampleCard.entities
|
|
870
|
+
.filter((entity) => entity.viewType !== 'Section')
|
|
871
|
+
.map((entity) => {
|
|
846
872
|
const raw = entity;
|
|
847
873
|
const key = (typeof raw['key'] === 'string' && raw['key']) ||
|
|
848
874
|
(typeof raw['normalizedKey'] === 'string' && raw['normalizedKey']) ||
|
|
@@ -873,6 +899,8 @@ class ClientListCardsView {
|
|
|
873
899
|
}
|
|
874
900
|
: { Id: card.id, [CLIENT_LIST_RECORD_STATE_KEY]: card.state ?? null };
|
|
875
901
|
for (const entity of card.entities ?? []) {
|
|
902
|
+
if (entity.viewType === 'Section')
|
|
903
|
+
continue;
|
|
876
904
|
const e = entity;
|
|
877
905
|
const key = (typeof e['key'] === 'string' && e['key']) ||
|
|
878
906
|
(typeof e['normalizedKey'] === 'string' && e['normalizedKey']) ||
|
|
@@ -1259,23 +1287,23 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.8", ngImpor
|
|
|
1259
1287
|
], providers: [MTDateFormatPipe], template: "<mt-table-caption\r\n [generalSearch]=\"true\"\r\n [showFilters]=\"true\"\r\n filterMode=\"popover\"\r\n [printable]=\"true\"\r\n [groupable]=\"true\"\r\n [exportable]=\"true\"\r\n [columns]=\"columns()\"\r\n [data]=\"rowRepresentations()\"\r\n [groupColumns]=\"grouping.groupableColumns()\"\r\n [filters]=\"bucket().filters()\"\r\n (filtersChange)=\"bucket().filters.set($event)\"\r\n [filterTerm]=\"bucket().filterTerm()\"\r\n (filterTermChange)=\"bucket().filterTerm.set($event)\"\r\n [groupBy]=\"bucket().groupBy()\"\r\n (groupByChange)=\"bucket().groupBy.set($event)\"\r\n [activeTab]=\"bucket().activeTab()\"\r\n (activeTabChange)=\"bucket().activeTab.set($event)\"\r\n (exportRequested)=\"exportExcel()\"\r\n (printRequested)=\"printPdf()\"\r\n/>\r\n\r\n@if (cardsState().loading && cardsState().cards.length === 0) {\r\n <div class=\"grid grid-cols-1 gap-6 md:grid-cols-2 xl:grid-cols-3\">\r\n @for (i of [1, 2, 3, 4, 5, 6]; track i) {\r\n <p-skeleton height=\"20rem\" class=\"rounded-lg\" />\r\n }\r\n </div>\r\n} @else if (cardsState().error) {\r\n <div class=\"rounded-lg border border-red-200 bg-red-50 p-6 text-red-600\">\r\n {{ cardsState().error }}\r\n </div>\r\n} @else if (visibleCards().length === 0) {\r\n <div class=\"p-6 text-center text-gray-400\">\r\n {{ \"components.clientComponents.list.noCardsFound\" | transloco }}\r\n </div>\r\n} @else if (grouping.groupingActive()) {\r\n <div class=\"flex flex-col gap-6\">\r\n @for (group of groupedCards(); track group.key) {\r\n <section class=\"flex flex-col gap-3\">\r\n <header\r\n class=\"flex items-center gap-3 px-2 py-2 bg-surface-50 dark:bg-surface-900 border-y border-surface-200 dark:border-surface-700 rounded\"\r\n [style.--mt-group-accent]=\"group.accent ?? 'var(--p-primary-color)'\"\r\n >\r\n <span\r\n class=\"inline-block w-1 h-5 rounded-full\"\r\n [style.background]=\"'var(--mt-group-accent)'\"\r\n ></span>\r\n <span\r\n class=\"text-xs uppercase tracking-wide text-gray-500 dark:text-gray-400\"\r\n >\r\n {{ group.columnLabel }}\r\n </span>\r\n <span class=\"text-sm font-semibold text-gray-900 dark:text-gray-100\">\r\n {{ group.label }}\r\n </span>\r\n <span\r\n class=\"ml-auto inline-flex items-center gap-1 text-xs px-2 py-0.5 rounded-full bg-primary-50 text-primary-700 dark:bg-primary-950 dark:text-primary-300\"\r\n >\r\n {{ group.count }}\r\n </span>\r\n </header>\r\n <div class=\"grid grid-cols-1 gap-5 md:grid-cols-2 xl:grid-cols-3\">\r\n @for (card of group.cards; track card.id) {\r\n <mt-card\r\n class=\"relative cursor-pointer p-5 shadow-sm transition-shadow hover:shadow-md\"\r\n (click)=\"cardClick.emit(card)\"\r\n >\r\n <ng-template #headless>\r\n <ng-container\r\n [ngTemplateOutlet]=\"cardActionsMenu\"\r\n [ngTemplateOutletContext]=\"{ $implicit: card }\"\r\n />\r\n <mt-entities-preview\r\n [entities]=\"card.entities\"\r\n attachmentShape=\"compact\"\r\n [stackOnNarrow]=\"false\"\r\n [clickableKeys]=\"clickableEntityKeys()\"\r\n [activeKeys]=\"activeKeysForCard(card)\"\r\n [clickableTooltip]=\"\r\n 'components.table.filterByThis' | transloco\r\n \"\r\n [activeTooltip]=\"'components.table.clearFilter' | transloco\"\r\n (entityClick)=\"onEntityFilterClick(card, $event)\"\r\n />\r\n </ng-template>\r\n </mt-card>\r\n }\r\n </div>\r\n </section>\r\n }\r\n </div>\r\n} @else {\r\n <div class=\"grid grid-cols-1 gap-5 md:grid-cols-2 xl:grid-cols-3\">\r\n @for (card of visibleCards(); track card.id) {\r\n @defer (on viewport) {\r\n <mt-card\r\n class=\"relative cursor-pointer p-5 shadow-sm transition-shadow hover:shadow-md\"\r\n (click)=\"cardClick.emit(card)\"\r\n >\r\n <ng-template #headless>\r\n <ng-container\r\n [ngTemplateOutlet]=\"cardActionsMenu\"\r\n [ngTemplateOutletContext]=\"{ $implicit: card }\"\r\n />\r\n <mt-entities-preview\r\n [entities]=\"card.entities\"\r\n attachmentShape=\"compact\"\r\n [stackOnNarrow]=\"false\"\r\n [clickableKeys]=\"clickableEntityKeys()\"\r\n [activeKeys]=\"activeKeysForCard(card)\"\r\n [clickableTooltip]=\"'components.table.filterByThis' | transloco\"\r\n [activeTooltip]=\"'components.table.clearFilter' | transloco\"\r\n (entityClick)=\"onEntityFilterClick(card, $event)\"\r\n />\r\n </ng-template>\r\n </mt-card>\r\n } @placeholder {\r\n <div class=\"min-h-[20rem]\">\r\n <p-skeleton height=\"20rem\" class=\"rounded-lg\" />\r\n </div>\r\n }\r\n }\r\n </div>\r\n}\r\n\r\n<!--\r\n Per-card 3-dots actions menu \u2014 same contract as the table view's popover\r\n row-actions. Rendered into each card's top-end corner; clicks stop at the\r\n wrapper so the card's own click (cardClick) doesn't fire.\r\n-->\r\n<ng-template #cardActionsMenu let-card>\r\n @if (rowActions().length > 0) {\r\n <div\r\n class=\"absolute end-2 top-2 z-10 flex items-center gap-1\"\r\n (click)=\"$event.stopPropagation()\"\r\n >\r\n @for (action of inlineActionsForCard(card); track $index) {\r\n <mt-button\r\n [icon]=\"action.icon\"\r\n [severity]=\"action.color\"\r\n [variant]=\"action.variant\"\r\n [size]=\"actionSize(action) || 'small'\"\r\n [tooltip]=\"action.tooltip\"\r\n [label]=\"action.label\"\r\n [loading]=\"resolveActionLoading(action, card)\"\r\n (onClick)=\"runCardAction($event, action, card)\"\r\n />\r\n }\r\n @if (showCardActionsMenu(card)) {\r\n <mt-button\r\n icon=\"general.dots-vertical\"\r\n severity=\"secondary\"\r\n variant=\"text\"\r\n [tooltip]=\"'components.table.actions' | transloco\"\r\n (onClick)=\"onCardActionsToggle($event, cardPopover, card)\"\r\n />\r\n <p-popover #cardPopover appendTo=\"body\">\r\n <div class=\"flex min-w-44 flex-col gap-1 p-1\">\r\n @if (isCardActionsLoading(card)) {\r\n <div class=\"flex flex-col gap-2 p-1\">\r\n <p-skeleton height=\"1.75rem\" />\r\n <p-skeleton height=\"1.75rem\" />\r\n <p-skeleton height=\"1.75rem\" />\r\n </div>\r\n } @else {\r\n @for (action of menuActionsForCard(card); track $index) {\r\n <button\r\n type=\"button\"\r\n class=\"flex cursor-pointer items-center gap-2 rounded px-2 py-2 text-start text-sm transition-colors\"\r\n [class]=\"\r\n action.color === 'danger'\r\n ? 'text-red-600 hover:bg-red-50 dark:hover:bg-red-950'\r\n : 'text-gray-700 hover:bg-gray-100 dark:text-gray-200 dark:hover:bg-surface-700'\r\n \"\r\n (click)=\"\r\n runCardAction($event, action, card); cardPopover.hide()\r\n \"\r\n >\r\n @if (action.icon) {\r\n <mt-icon [icon]=\"action.icon\" class=\"text-base\" />\r\n }\r\n <span>{{ action.label || action.tooltip }}</span>\r\n </button>\r\n }\r\n }\r\n </div>\r\n </p-popover>\r\n }\r\n </div>\r\n }\r\n</ng-template>\r\n" }]
|
|
1260
1288
|
}], ctorParameters: () => [], propDecorators: { state: [{ type: i0.Input, args: [{ isSignal: true, alias: "state", required: true }] }], rowActions: [{ type: i0.Input, args: [{ isSignal: true, alias: "rowActions", required: false }] }], rowActionsLoadingFn: [{ type: i0.Input, args: [{ isSignal: true, alias: "rowActionsLoadingFn", required: false }] }], lazyLoad: [{ type: i0.Output, args: ["lazyLoad"] }], cardClick: [{ type: i0.Output, args: ["cardClick"] }], rowActionsRequested: [{ type: i0.Output, args: ["rowActionsRequested"] }] } });
|
|
1261
1289
|
|
|
1290
|
+
function toDashboardExtraFilters(filters = []) {
|
|
1291
|
+
const extraFilters = {};
|
|
1292
|
+
for (const filter of filters) {
|
|
1293
|
+
if (!filter.key) {
|
|
1294
|
+
continue;
|
|
1295
|
+
}
|
|
1296
|
+
extraFilters[filter.key] = filter.value;
|
|
1297
|
+
}
|
|
1298
|
+
return extraFilters;
|
|
1299
|
+
}
|
|
1300
|
+
|
|
1262
1301
|
const DEFAULT_GRID_COLUMNS$1 = 12;
|
|
1263
1302
|
class ClientListInformativeView {
|
|
1264
1303
|
state = input.required(...(ngDevMode ? [{ debugName: "state" }] : /* istanbul ignore next */ []));
|
|
1265
1304
|
informativeState = computed(() => this.state(), ...(ngDevMode ? [{ debugName: "informativeState" }] : /* istanbul ignore next */ []));
|
|
1266
1305
|
dashboardExtraFilters = computed(() => {
|
|
1267
|
-
|
|
1268
|
-
const extraFilters = {};
|
|
1269
|
-
if (config.instanceId != null) {
|
|
1270
|
-
extraFilters['currentId'] = config.instanceId;
|
|
1271
|
-
}
|
|
1272
|
-
for (const filter of config.filters ?? []) {
|
|
1273
|
-
if (!filter.key) {
|
|
1274
|
-
continue;
|
|
1275
|
-
}
|
|
1276
|
-
extraFilters[filter.key] = filter.value;
|
|
1277
|
-
}
|
|
1278
|
-
return extraFilters;
|
|
1306
|
+
return toDashboardExtraFilters(this.informativeState().config.filters);
|
|
1279
1307
|
}, ...(ngDevMode ? [{ debugName: "dashboardExtraFilters" }] : /* istanbul ignore next */ []));
|
|
1280
1308
|
gridTemplateColumns = `repeat(${DEFAULT_GRID_COLUMNS$1}, minmax(0, 1fr))`;
|
|
1281
1309
|
slotGridSpan(span) {
|
|
@@ -1292,7 +1320,7 @@ class ClientListInformativeView {
|
|
|
1292
1320
|
};
|
|
1293
1321
|
}
|
|
1294
1322
|
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.8", ngImport: i0, type: ClientListInformativeView, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
1295
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.8", type: ClientListInformativeView, isStandalone: true, selector: "mt-client-list-informative-view", inputs: { state: { classPropertyName: "state", publicName: "state", isSignal: true, isRequired: true, transformFunction: null } }, ngImport: i0, template: "<div class=\"grid gap-4\" [style.gridTemplateColumns]=\"gridTemplateColumns\">\r\n @if (informativeState().config.contentStart) {\r\n <div\r\n [style.gridColumn]=\"\r\n slotGridSpan(informativeState().config.layout.startSpan)\r\n \"\r\n >\r\n <ng-container\r\n [ngTemplateOutlet]=\"informativeState().config.contentStart\"\r\n [ngTemplateOutletContext]=\"templateContext(informativeState())\"\r\n />\r\n </div>\r\n }\r\n\r\n <div\r\n [style.gridColumn]=\"\r\n slotGridSpan(informativeState().config.layout.tableSpan)\r\n \"\r\n >\r\n <mt-card>\r\n @if (\r\n informativeState().loading &&\r\n !informativeState().dashboardData?.charts?.length\r\n ) {\r\n <div class=\"flex flex-col gap-3 py-3\">\r\n <p-skeleton height=\"6rem\" />\r\n <p-skeleton height=\"12rem\" />\r\n <p-skeleton height=\"12rem\" />\r\n </div>\r\n } @else if (informativeState().error) {\r\n <div\r\n class=\"rounded-lg border border-red-200 bg-red-50 p-3 text-sm text-red-700\"\r\n >\r\n {{ informativeState().error }}\r\n </div>\r\n } @else if (!informativeState().dashboardData?.charts?.length) {\r\n <div class=\"p-6 text-center text-gray-400\">\r\n {{\r\n \"components.clientComponents.list.noInformativeDashboard\"\r\n | transloco\r\n }}\r\n </div>\r\n } @else {\r\n <div class=\"min-h-[420px]\">\r\n <mt-dashboard-viewer\r\n [isPage]=\"false\"\r\n [showFilters]=\"false\"\r\n [dashboardData]=\"informativeState().dashboardData\"\r\n [extraFilters]=\"dashboardExtraFilters()\"\r\n />\r\n </div>\r\n }\r\n </mt-card>\r\n </div>\r\n\r\n @if (informativeState().config.contentEnd) {\r\n <div\r\n [style.gridColumn]=\"\r\n slotGridSpan(informativeState().config.layout.endSpan)\r\n \"\r\n >\r\n <ng-container\r\n [ngTemplateOutlet]=\"informativeState().config.contentEnd\"\r\n [ngTemplateOutletContext]=\"templateContext(informativeState())\"\r\n />\r\n </div>\r\n }\r\n</div>\r\n", dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i1.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "component", type: Card, selector: "mt-card", inputs: ["class", "title", "paddingless"] }, { kind: "component", type: DashboardViewer, selector: "mt-dashboard-viewer", inputs: ["isPage", "pageTitle", "backButton", "pageId", "dashboardData", "chartsData", "dialogsData", "filtersData", "extraFilters", "showFilters"], outputs: ["pageLoaded", "onBack", "chartClick"] }, { kind: "ngmodule", type: SkeletonModule }, { kind: "component", type: i2.Skeleton, selector: "p-skeleton", inputs: ["styleClass", "shape", "animation", "borderRadius", "size", "width", "height"] }, { kind: "pipe", type: TranslocoPipe, name: "transloco" }] });
|
|
1323
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.8", type: ClientListInformativeView, isStandalone: true, selector: "mt-client-list-informative-view", inputs: { state: { classPropertyName: "state", publicName: "state", isSignal: true, isRequired: true, transformFunction: null } }, ngImport: i0, template: "<div class=\"grid gap-4\" [style.gridTemplateColumns]=\"gridTemplateColumns\">\r\n @if (informativeState().config.contentStart) {\r\n <div\r\n [style.gridColumn]=\"\r\n slotGridSpan(informativeState().config.layout.startSpan)\r\n \"\r\n >\r\n <ng-container\r\n [ngTemplateOutlet]=\"informativeState().config.contentStart\"\r\n [ngTemplateOutletContext]=\"templateContext(informativeState())\"\r\n />\r\n </div>\r\n }\r\n\r\n <div\r\n [style.gridColumn]=\"\r\n slotGridSpan(informativeState().config.layout.tableSpan)\r\n \"\r\n >\r\n <mt-card>\r\n @if (\r\n informativeState().loading &&\r\n !informativeState().dashboardData?.charts?.length\r\n ) {\r\n <div class=\"flex flex-col gap-3 py-3\">\r\n <p-skeleton height=\"6rem\" />\r\n <p-skeleton height=\"12rem\" />\r\n <p-skeleton height=\"12rem\" />\r\n </div>\r\n } @else if (informativeState().error) {\r\n <div\r\n class=\"rounded-lg border border-red-200 bg-red-50 p-3 text-sm text-red-700\"\r\n >\r\n {{ informativeState().error }}\r\n </div>\r\n } @else if (!informativeState().dashboardData?.charts?.length) {\r\n <div class=\"p-6 text-center text-gray-400\">\r\n {{\r\n \"components.clientComponents.list.noInformativeDashboard\"\r\n | transloco\r\n }}\r\n </div>\r\n } @else {\r\n <div class=\"min-h-[420px]\">\r\n <mt-dashboard-viewer\r\n [isPage]=\"false\"\r\n [showFilters]=\"false\"\r\n [dashboardData]=\"informativeState().dashboardData\"\r\n [extraFilters]=\"dashboardExtraFilters()\"\r\n />\r\n </div>\r\n }\r\n </mt-card>\r\n </div>\r\n\r\n @if (informativeState().config.contentEnd) {\r\n <div\r\n [style.gridColumn]=\"\r\n slotGridSpan(informativeState().config.layout.endSpan)\r\n \"\r\n >\r\n <ng-container\r\n [ngTemplateOutlet]=\"informativeState().config.contentEnd\"\r\n [ngTemplateOutletContext]=\"templateContext(informativeState())\"\r\n />\r\n </div>\r\n }\r\n</div>\r\n", dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i1.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "component", type: Card, selector: "mt-card", inputs: ["class", "title", "paddingless"] }, { kind: "component", type: DashboardViewer, selector: "mt-dashboard-viewer", inputs: ["isPage", "pageTitle", "backButton", "pageId", "dashboardData", "chartsData", "dialogsData", "filtersData", "extraFilters", "showFilters", "showFilterTrigger", "ignoreQueryFilter"], outputs: ["pageLoaded", "onBack", "chartClick"] }, { kind: "ngmodule", type: SkeletonModule }, { kind: "component", type: i2.Skeleton, selector: "p-skeleton", inputs: ["styleClass", "shape", "animation", "borderRadius", "size", "width", "height"] }, { kind: "pipe", type: TranslocoPipe, name: "transloco" }] });
|
|
1296
1324
|
}
|
|
1297
1325
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.8", ngImport: i0, type: ClientListInformativeView, decorators: [{
|
|
1298
1326
|
type: Component,
|
|
@@ -1791,7 +1819,7 @@ class ClientList {
|
|
|
1791
1819
|
this.state.setLoading(key, true);
|
|
1792
1820
|
this.state.setError(key, null);
|
|
1793
1821
|
const sub = this.api
|
|
1794
|
-
.getRows(config.contextKey,
|
|
1822
|
+
.getRows(config.contextKey, query, config.filters)
|
|
1795
1823
|
.subscribe({
|
|
1796
1824
|
next: (response) => {
|
|
1797
1825
|
let hasLoadedData = false;
|
|
@@ -1845,7 +1873,7 @@ class ClientList {
|
|
|
1845
1873
|
this.state.setLoading(key, true);
|
|
1846
1874
|
this.state.setError(key, null);
|
|
1847
1875
|
const sub = this.api
|
|
1848
|
-
.getCards(config.contextKey, config.
|
|
1876
|
+
.getCards(config.contextKey, config.filters)
|
|
1849
1877
|
.subscribe({
|
|
1850
1878
|
next: (response) => {
|
|
1851
1879
|
let hasLoadedData = false;
|
|
@@ -2105,7 +2133,6 @@ class ClientList {
|
|
|
2105
2133
|
config.type,
|
|
2106
2134
|
config.areaType,
|
|
2107
2135
|
config.contextKey ?? 'x',
|
|
2108
|
-
config.instanceId ?? 'scope',
|
|
2109
2136
|
this.serializeFilters(config.filters),
|
|
2110
2137
|
query.mode,
|
|
2111
2138
|
query.skip,
|
|
@@ -2118,7 +2145,6 @@ class ClientList {
|
|
|
2118
2145
|
config.type,
|
|
2119
2146
|
config.areaType,
|
|
2120
2147
|
config.contextKey ?? 'x',
|
|
2121
|
-
config.instanceId ?? 'scope',
|
|
2122
2148
|
this.serializeFilters(config.filters),
|
|
2123
2149
|
'Card',
|
|
2124
2150
|
].join('|');
|
|
@@ -2128,7 +2154,6 @@ class ClientList {
|
|
|
2128
2154
|
config.type,
|
|
2129
2155
|
config.levelId ?? 'x',
|
|
2130
2156
|
config.moduleId,
|
|
2131
|
-
config.instanceId ?? 'scope',
|
|
2132
2157
|
this.serializeFilters(config.filters),
|
|
2133
2158
|
'dashboard',
|
|
2134
2159
|
].join('|');
|
|
@@ -2141,22 +2166,13 @@ class ClientList {
|
|
|
2141
2166
|
Number.isFinite(config.moduleId) &&
|
|
2142
2167
|
config.moduleId > 0);
|
|
2143
2168
|
}
|
|
2144
|
-
|
|
2145
|
-
return false;
|
|
2146
|
-
}
|
|
2147
|
-
if (config.areaType === 'cards') {
|
|
2148
|
-
return true;
|
|
2149
|
-
}
|
|
2150
|
-
const instanceId = config.instanceId;
|
|
2151
|
-
return instanceId != null && Number.isFinite(instanceId) && instanceId > 0;
|
|
2169
|
+
return Boolean(config.contextKey?.trim());
|
|
2152
2170
|
}
|
|
2153
2171
|
getMissingIdentifiersMessage(config) {
|
|
2154
2172
|
if (config.type === 'informative') {
|
|
2155
2173
|
return this.transloco.translate('components.clientComponents.list.errors.missingModuleId');
|
|
2156
2174
|
}
|
|
2157
|
-
return this.transloco.translate(
|
|
2158
|
-
? 'components.clientComponents.list.errors.missingContextKey'
|
|
2159
|
-
: 'components.clientComponents.list.errors.missingContextAndInstance');
|
|
2175
|
+
return this.transloco.translate('components.clientComponents.list.errors.missingContextKey');
|
|
2160
2176
|
}
|
|
2161
2177
|
isInformativeConfig(config) {
|
|
2162
2178
|
return config.type === 'informative';
|