@mmlogic/components 0.1.30 → 0.3.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/dist/cjs/loader.cjs.js +1 -1
- package/dist/cjs/mosterdcomponents.cjs.js +1 -1
- package/dist/cjs/mrd-boolean-field_19.cjs.entry.js +349 -297
- package/dist/collection/components/mrd-field/mrd-field.js +18 -20
- package/dist/collection/components/mrd-form/mrd-form.js +38 -46
- package/dist/collection/components/mrd-layout-section/mrd-layout-section.js +82 -212
- package/dist/collection/components/mrd-table/mrd-table.js +255 -219
- package/dist/collection/dev/api.js +32 -103
- package/dist/collection/dev/app.js +386 -283
- package/dist/collection/dev/example-data.js +111 -299
- package/dist/collection/utils/cell-renderer.js +7 -5
- package/dist/components/mrd-field2.js +1 -1
- package/dist/components/mrd-form.js +1 -1
- package/dist/components/mrd-layout-section.js +1 -1
- package/dist/components/mrd-table2.js +1 -1
- package/dist/esm/loader.js +1 -1
- package/dist/esm/mosterdcomponents.js +1 -1
- package/dist/esm/mrd-boolean-field_19.entry.js +349 -297
- package/dist/mosterdcomponents/mosterdcomponents.esm.js +1 -1
- package/dist/mosterdcomponents/p-f6d0f02b.entry.js +1 -0
- package/dist/types/components/mrd-layout-section/mrd-layout-section.d.ts +16 -29
- package/dist/types/components/mrd-table/mrd-table.d.ts +36 -24
- package/dist/types/components.d.ts +39 -85
- package/dist/types/types/client-layout.d.ts +39 -15
- package/package.json +1 -1
- package/dist/mosterdcomponents/p-9ecefa81.entry.js +0 -1
|
@@ -629,34 +629,32 @@ const MrdField = class {
|
|
|
629
629
|
render() {
|
|
630
630
|
var _a, _b, _c, _d, _e, _f, _g, _h, _j, _k, _l, _m, _o, _p, _q, _r, _s, _t, _u, _v, _w, _x, _y, _z, _0, _1, _2, _3, _4, _5, _6, _7, _8;
|
|
631
631
|
const { item, locale, value } = this;
|
|
632
|
-
if (item.type === ClientLayoutItemType.RELATION
|
|
633
|
-
|
|
634
|
-
return (h(Host, null, h("mrd-relation-field", { name: rel.name, label: rel.label, required: rel.required, disabled: (_a = rel.disabled) !== null && _a !== void 0 ? _a : false, locale: locale, relatedClass: rel.relatedClass, mostSignificantClass: (_b = rel.mostSignificantClass) !== null && _b !== void 0 ? _b : '', displayType: (_c = rel.displayType) !== null && _c !== void 0 ? _c : ClientLayoutItemRelationDisplayType.SEARCH, editBehavior: (_d = rel.editBehavior) !== null && _d !== void 0 ? _d : null, commonRelation: rel.commonRelation, multiple: (_e = rel.multiple) !== null && _e !== void 0 ? _e : false, dropdownValues: (_f = rel.dropdownValues) !== null && _f !== void 0 ? _f : [], value: value, onMrdChange: this.handleChange, onMrdBlur: this.handleBlur, onMrdSearch: this.handleSearch, onMrdFetchAll: this.handleFetchAll })));
|
|
632
|
+
if (item.type === ClientLayoutItemType.RELATION) {
|
|
633
|
+
return (h(Host, null, h("mrd-relation-field", { name: item.name, label: item.label, required: item.required, disabled: (_a = item.disabled) !== null && _a !== void 0 ? _a : false, locale: locale, relatedClass: item.relatedClass, mostSignificantClass: (_b = item.mostSignificantClass) !== null && _b !== void 0 ? _b : '', displayType: (_c = item.displayType) !== null && _c !== void 0 ? _c : ClientLayoutItemRelationDisplayType.SEARCH, editBehavior: (_d = item.editBehavior) !== null && _d !== void 0 ? _d : null, commonRelation: item.commonRelation, multiple: (_e = item.multiple) !== null && _e !== void 0 ? _e : false, dropdownValues: (_f = item.dropdownValues) !== null && _f !== void 0 ? _f : [], value: value, onMrdChange: this.handleChange, onMrdBlur: this.handleBlur, onMrdSearch: this.handleSearch, onMrdFetchAll: this.handleFetchAll })));
|
|
635
634
|
}
|
|
636
|
-
if (item.type !== ClientLayoutItemType.FIELD
|
|
635
|
+
if (item.type !== ClientLayoutItemType.FIELD) {
|
|
637
636
|
return h(Host, null);
|
|
638
637
|
}
|
|
639
|
-
const field = item.field;
|
|
640
638
|
const commonProps = {
|
|
641
|
-
name:
|
|
642
|
-
label:
|
|
643
|
-
required:
|
|
644
|
-
disabled: (_g =
|
|
639
|
+
name: item.name,
|
|
640
|
+
label: item.label,
|
|
641
|
+
required: item.required,
|
|
642
|
+
disabled: (_g = item.disabled) !== null && _g !== void 0 ? _g : false,
|
|
645
643
|
locale,
|
|
646
644
|
onMrdChange: this.handleChange,
|
|
647
645
|
onMrdBlur: this.handleBlur,
|
|
648
646
|
};
|
|
649
|
-
switch (
|
|
647
|
+
switch (item.dataType) {
|
|
650
648
|
case ClientLayoutItemFieldDataType.TEXT:
|
|
651
|
-
return (h(Host, null, h("mrd-text-field", Object.assign({}, commonProps, { value: (_h = value) !== null && _h !== void 0 ? _h : '', placeholder: (_j =
|
|
649
|
+
return (h(Host, null, h("mrd-text-field", Object.assign({}, commonProps, { value: (_h = value) !== null && _h !== void 0 ? _h : '', placeholder: (_j = item.placeholder) !== null && _j !== void 0 ? _j : '' }))));
|
|
652
650
|
case ClientLayoutItemFieldDataType.TEXTBLOCK:
|
|
653
|
-
return (h(Host, null, h("mrd-textarea-field", Object.assign({}, commonProps, { value: (_k = value) !== null && _k !== void 0 ? _k : '', placeholder: (_l =
|
|
651
|
+
return (h(Host, null, h("mrd-textarea-field", Object.assign({}, commonProps, { value: (_k = value) !== null && _k !== void 0 ? _k : '', placeholder: (_l = item.placeholder) !== null && _l !== void 0 ? _l : '' }))));
|
|
654
652
|
case ClientLayoutItemFieldDataType.INTEGER:
|
|
655
653
|
case ClientLayoutItemFieldDataType.DECIMAL:
|
|
656
654
|
case ClientLayoutItemFieldDataType.PERCENTAGE:
|
|
657
|
-
return (h(Host, null, h("mrd-number-field", Object.assign({}, commonProps, { value: (_m = value) !== null && _m !== void 0 ? _m : null, dataType:
|
|
655
|
+
return (h(Host, null, h("mrd-number-field", Object.assign({}, commonProps, { value: (_m = value) !== null && _m !== void 0 ? _m : null, dataType: item.dataType, decimalPrecision: (_o = item.decimalPrecision) !== null && _o !== void 0 ? _o : 2, placeholder: (_p = item.placeholder) !== null && _p !== void 0 ? _p : '' }))));
|
|
658
656
|
case ClientLayoutItemFieldDataType.CURRENCY:
|
|
659
|
-
return (h(Host, null, h("mrd-currency-field", Object.assign({}, commonProps, { value: (_q = value) !== null && _q !== void 0 ? _q : { amount: null, currency: (_r =
|
|
657
|
+
return (h(Host, null, h("mrd-currency-field", Object.assign({}, commonProps, { value: (_q = value) !== null && _q !== void 0 ? _q : { amount: null, currency: (_r = item.currencyCode) !== null && _r !== void 0 ? _r : 'EUR' } }))));
|
|
660
658
|
case ClientLayoutItemFieldDataType.BOOLEAN:
|
|
661
659
|
return (h(Host, null, h("mrd-boolean-field", Object.assign({}, commonProps, { value: (_s = value) !== null && _s !== void 0 ? _s : false }))));
|
|
662
660
|
case ClientLayoutItemFieldDataType.DATE:
|
|
@@ -666,17 +664,17 @@ const MrdField = class {
|
|
|
666
664
|
case ClientLayoutItemFieldDataType.TIME:
|
|
667
665
|
return (h(Host, null, h("mrd-time-field", Object.assign({}, commonProps, { value: (_v = value) !== null && _v !== void 0 ? _v : '' }))));
|
|
668
666
|
case ClientLayoutItemFieldDataType.EMAIL:
|
|
669
|
-
return (h(Host, null, h("mrd-email-field", Object.assign({}, commonProps, { value: (_w = value) !== null && _w !== void 0 ? _w : '', placeholder: (_x =
|
|
667
|
+
return (h(Host, null, h("mrd-email-field", Object.assign({}, commonProps, { value: (_w = value) !== null && _w !== void 0 ? _w : '', placeholder: (_x = item.placeholder) !== null && _x !== void 0 ? _x : '' }))));
|
|
670
668
|
case ClientLayoutItemFieldDataType.HYPERLINK:
|
|
671
|
-
return (h(Host, null, h("mrd-hyperlink-field", Object.assign({}, commonProps, { value: (_y = value) !== null && _y !== void 0 ? _y : '', placeholder: (_z =
|
|
669
|
+
return (h(Host, null, h("mrd-hyperlink-field", Object.assign({}, commonProps, { value: (_y = value) !== null && _y !== void 0 ? _y : '', placeholder: (_z = item.placeholder) !== null && _z !== void 0 ? _z : '' }))));
|
|
672
670
|
case ClientLayoutItemFieldDataType.LIST:
|
|
673
|
-
return (h(Host, null, h("mrd-list-field", Object.assign({}, commonProps, { value: (_0 = value) !== null && _0 !== void 0 ? _0 : '', multiple: (_1 =
|
|
671
|
+
return (h(Host, null, h("mrd-list-field", Object.assign({}, commonProps, { value: (_0 = value) !== null && _0 !== void 0 ? _0 : '', multiple: (_1 = item.multiple) !== null && _1 !== void 0 ? _1 : false, listItems: (_2 = item.listItems) !== null && _2 !== void 0 ? _2 : [] }))));
|
|
674
672
|
case ClientLayoutItemFieldDataType.FILE:
|
|
675
|
-
return (h(Host, null, h("mrd-file-field", Object.assign({}, commonProps, { value: value, accept: (_3 =
|
|
673
|
+
return (h(Host, null, h("mrd-file-field", Object.assign({}, commonProps, { value: value, accept: (_3 = item.accept) !== null && _3 !== void 0 ? _3 : '', maxSize: (_4 = item.maxSize) !== null && _4 !== void 0 ? _4 : 0, onMrdUpload: this.handleUpload }))));
|
|
676
674
|
case ClientLayoutItemFieldDataType.IMAGE:
|
|
677
|
-
return (h(Host, null, h("mrd-image-field", Object.assign({}, commonProps, { value: value, accept: (_5 =
|
|
675
|
+
return (h(Host, null, h("mrd-image-field", Object.assign({}, commonProps, { value: value, accept: (_5 = item.accept) !== null && _5 !== void 0 ? _5 : 'image/*', maxSize: (_6 = item.maxSize) !== null && _6 !== void 0 ? _6 : 0, onMrdUpload: this.handleUpload }))));
|
|
678
676
|
case ClientLayoutItemFieldDataType.LONGTEXT:
|
|
679
|
-
return (h(Host, null, h("mrd-longtext-field", Object.assign({}, commonProps, { value: (_7 = value) !== null && _7 !== void 0 ? _7 : '', placeholder: (_8 =
|
|
677
|
+
return (h(Host, null, h("mrd-longtext-field", Object.assign({}, commonProps, { value: (_7 = value) !== null && _7 !== void 0 ? _7 : '', placeholder: (_8 = item.placeholder) !== null && _8 !== void 0 ? _8 : '' }))));
|
|
680
678
|
case ClientLayoutItemFieldDataType.JSON:
|
|
681
679
|
return h(Host, null);
|
|
682
680
|
default:
|
|
@@ -837,17 +835,17 @@ const MrdForm = class {
|
|
|
837
835
|
const newHref = this.getHref(value);
|
|
838
836
|
if (newHref === prevHref)
|
|
839
837
|
return;
|
|
840
|
-
for (const
|
|
841
|
-
if (
|
|
838
|
+
for (const item of this.collectDependentDropdowns()) {
|
|
839
|
+
if (item.commonRelation !== name)
|
|
842
840
|
continue;
|
|
843
841
|
// Clear the dependent field's current selection (options have changed)
|
|
844
|
-
this.formValues = Object.assign(Object.assign({}, this.formValues), { [
|
|
842
|
+
this.formValues = Object.assign(Object.assign({}, this.formValues), { [item.name]: null });
|
|
845
843
|
this.mrdFetchAll.emit({
|
|
846
|
-
name:
|
|
847
|
-
relatedClass:
|
|
848
|
-
mostSignificantClass:
|
|
849
|
-
commonRelation:
|
|
850
|
-
filter:
|
|
844
|
+
name: item.name,
|
|
845
|
+
relatedClass: item.relatedClass,
|
|
846
|
+
mostSignificantClass: item.mostSignificantClass,
|
|
847
|
+
commonRelation: item.commonRelation,
|
|
848
|
+
filter: item.commonRelation + '_href',
|
|
851
849
|
filterValue: newHref, // empty string when dependency was cleared → host should clear the list
|
|
852
850
|
});
|
|
853
851
|
}
|
|
@@ -922,24 +920,20 @@ const MrdForm = class {
|
|
|
922
920
|
var _a, _b;
|
|
923
921
|
const allItems = this.collectFields((_b = (_a = this.layout) === null || _a === void 0 ? void 0 : _a.items) !== null && _b !== void 0 ? _b : []);
|
|
924
922
|
// Strategy 1: direct match on mostSignificantClass
|
|
925
|
-
const direct = allItems.find(item =>
|
|
926
|
-
|
|
927
|
-
|
|
928
|
-
|
|
929
|
-
});
|
|
930
|
-
if (direct === null || direct === void 0 ? void 0 : direct.relation)
|
|
931
|
-
return direct.relation.name;
|
|
923
|
+
const direct = allItems.find(item => item.type === ClientLayoutItemType.RELATION &&
|
|
924
|
+
item.mostSignificantClass === this.referenceClass);
|
|
925
|
+
if (direct === null || direct === void 0 ? void 0 : direct.name)
|
|
926
|
+
return direct.name;
|
|
932
927
|
// Strategy 2: a DROPDOWN whose commonRelation field was omitted from the layout
|
|
933
928
|
const layoutRelationNames = new Set(allItems
|
|
934
929
|
.filter(item => item.type === ClientLayoutItemType.RELATION)
|
|
935
|
-
.map(item => item.
|
|
930
|
+
.map(item => item.name));
|
|
936
931
|
for (const item of allItems) {
|
|
937
|
-
const rel = item.relation;
|
|
938
932
|
if (item.type === ClientLayoutItemType.RELATION &&
|
|
939
|
-
|
|
940
|
-
|
|
941
|
-
!layoutRelationNames.has(
|
|
942
|
-
return
|
|
933
|
+
item.editBehavior === ClientLayoutItemRelationEditBehavior.DROPDOWN &&
|
|
934
|
+
item.commonRelation &&
|
|
935
|
+
!layoutRelationNames.has(item.commonRelation)) {
|
|
936
|
+
return item.commonRelation;
|
|
943
937
|
}
|
|
944
938
|
}
|
|
945
939
|
return null;
|
|
@@ -954,25 +948,21 @@ const MrdForm = class {
|
|
|
954
948
|
collectDependentDropdowns() {
|
|
955
949
|
var _a, _b;
|
|
956
950
|
return this.collectFields((_b = (_a = this.layout) === null || _a === void 0 ? void 0 : _a.items) !== null && _b !== void 0 ? _b : [])
|
|
957
|
-
.filter(item =>
|
|
958
|
-
|
|
959
|
-
|
|
960
|
-
((_a = item.relation) === null || _a === void 0 ? void 0 : _a.editBehavior) === ClientLayoutItemRelationEditBehavior.DROPDOWN &&
|
|
961
|
-
!!item.relation.commonRelation;
|
|
962
|
-
})
|
|
963
|
-
.map(item => item.relation);
|
|
951
|
+
.filter(item => item.type === ClientLayoutItemType.RELATION &&
|
|
952
|
+
item.editBehavior === ClientLayoutItemRelationEditBehavior.DROPDOWN &&
|
|
953
|
+
!!item.commonRelation);
|
|
964
954
|
}
|
|
965
955
|
/** Emit mrdFetchAll for every dependent DROPDOWN whose filter value is currently set. */
|
|
966
956
|
emitDependentFetchAll() {
|
|
967
|
-
for (const
|
|
968
|
-
const filterValue = this.getHref(this.formValues[
|
|
957
|
+
for (const item of this.collectDependentDropdowns()) {
|
|
958
|
+
const filterValue = this.getHref(this.formValues[item.commonRelation]);
|
|
969
959
|
if (filterValue) {
|
|
970
960
|
this.mrdFetchAll.emit({
|
|
971
|
-
name:
|
|
972
|
-
relatedClass:
|
|
973
|
-
mostSignificantClass:
|
|
974
|
-
commonRelation:
|
|
975
|
-
filter:
|
|
961
|
+
name: item.name,
|
|
962
|
+
relatedClass: item.relatedClass,
|
|
963
|
+
mostSignificantClass: item.mostSignificantClass,
|
|
964
|
+
commonRelation: item.commonRelation,
|
|
965
|
+
filter: item.commonRelation + '_href',
|
|
976
966
|
filterValue,
|
|
977
967
|
});
|
|
978
968
|
}
|
|
@@ -1002,15 +992,14 @@ const MrdForm = class {
|
|
|
1002
992
|
return fields;
|
|
1003
993
|
}
|
|
1004
994
|
validate() {
|
|
1005
|
-
var _a, _b
|
|
995
|
+
var _a, _b;
|
|
1006
996
|
const newErrors = {};
|
|
1007
997
|
const allFields = this.collectFields((_b = (_a = this.layout) === null || _a === void 0 ? void 0 : _a.items) !== null && _b !== void 0 ? _b : []);
|
|
1008
998
|
for (const item of allFields) {
|
|
1009
|
-
|
|
1010
|
-
if (!def)
|
|
999
|
+
if (!item.name)
|
|
1011
1000
|
continue;
|
|
1012
|
-
if (
|
|
1013
|
-
newErrors[
|
|
1001
|
+
if (item.required && !validateRequired(this.formValues[item.name])) {
|
|
1002
|
+
newErrors[item.name] = t('required', this.locale);
|
|
1014
1003
|
}
|
|
1015
1004
|
}
|
|
1016
1005
|
this.errors = newErrors;
|
|
@@ -1058,8 +1047,10 @@ const MrdForm = class {
|
|
|
1058
1047
|
const payload = {};
|
|
1059
1048
|
const allFields = this.collectFields((_b = (_a = this.layout) === null || _a === void 0 ? void 0 : _a.items) !== null && _b !== void 0 ? _b : []);
|
|
1060
1049
|
for (const item of allFields) {
|
|
1061
|
-
if (item.
|
|
1062
|
-
|
|
1050
|
+
if (!item.name)
|
|
1051
|
+
continue;
|
|
1052
|
+
const name = item.name;
|
|
1053
|
+
if (item.type === ClientLayoutItemType.FIELD) {
|
|
1063
1054
|
const value = this.formValues[name];
|
|
1064
1055
|
if (value instanceof File)
|
|
1065
1056
|
continue;
|
|
@@ -1069,8 +1060,7 @@ const MrdForm = class {
|
|
|
1069
1060
|
continue;
|
|
1070
1061
|
payload[name] = current;
|
|
1071
1062
|
}
|
|
1072
|
-
else if (item.type === ClientLayoutItemType.RELATION
|
|
1073
|
-
const name = item.relation.name;
|
|
1063
|
+
else if (item.type === ClientLayoutItemType.RELATION) {
|
|
1074
1064
|
const current = this.normalizeRelationValue(this.formValues[name]);
|
|
1075
1065
|
const initial = this.normalizeRelationValue(this.initialValues[name]);
|
|
1076
1066
|
if (this.deepEqual(current, initial))
|
|
@@ -1082,14 +1072,14 @@ const MrdForm = class {
|
|
|
1082
1072
|
}
|
|
1083
1073
|
renderItems(items) {
|
|
1084
1074
|
return items.map(item => {
|
|
1085
|
-
var _a
|
|
1075
|
+
var _a;
|
|
1086
1076
|
if (item.type === ClientLayoutItemType.SECTION) {
|
|
1087
1077
|
return (h("fieldset", { class: "mrd-form__section" }, item.label && h("legend", { class: "mrd-form__section-legend" }, item.label), h("div", { class: "mrd-form__section-body" }, item.items && this.renderItems(item.items))));
|
|
1088
1078
|
}
|
|
1089
1079
|
if (item.type === ClientLayoutItemType.GROUP) {
|
|
1090
1080
|
return (h("div", { class: "mrd-form__group" }, item.label && h("div", { class: "mrd-form__group-label" }, item.label), h("div", { class: "mrd-form__group-body" }, item.items && this.renderItems(item.items))));
|
|
1091
1081
|
}
|
|
1092
|
-
const fieldName = (
|
|
1082
|
+
const fieldName = (_a = item.name) !== null && _a !== void 0 ? _a : '';
|
|
1093
1083
|
const fieldValue = this.formValues[fieldName];
|
|
1094
1084
|
return (h("div", { class: "mrd-form__field" }, h("mrd-field", { item: item, locale: this.locale, value: fieldValue, onMrdChange: this.handleFieldChange, onMrdBlur: this.handleFieldChange, onMrdSearch: this.handleSearch, onMrdFetchAll: this.handleFetchAll, onMrdUpload: this.handleUpload }), this.errors[fieldName] && (h("span", { class: "mrd-form__field-error" }, this.errors[fieldName]))));
|
|
1095
1085
|
});
|
|
@@ -1268,17 +1258,19 @@ class CellRenderer {
|
|
|
1268
1258
|
static render(column, row, locale) {
|
|
1269
1259
|
var _a, _b, _c, _d;
|
|
1270
1260
|
if (column.type === ClientLayoutItemType.RELATION) {
|
|
1271
|
-
const name = (
|
|
1272
|
-
const link = (
|
|
1261
|
+
const name = (_a = column.name) !== null && _a !== void 0 ? _a : '';
|
|
1262
|
+
const link = (_b = row === null || row === void 0 ? void 0 : row._links) === null || _b === void 0 ? void 0 : _b[name];
|
|
1273
1263
|
if (!link)
|
|
1274
1264
|
return '';
|
|
1275
1265
|
if (Array.isArray(link))
|
|
1276
1266
|
return link.map((l) => { var _a; return (_a = l.name) !== null && _a !== void 0 ? _a : ''; }).filter(Boolean).join(', ');
|
|
1277
|
-
return (
|
|
1267
|
+
return (_c = link.name) !== null && _c !== void 0 ? _c : '';
|
|
1278
1268
|
}
|
|
1279
|
-
if (column.type !== ClientLayoutItemType.FIELD
|
|
1269
|
+
if (column.type !== ClientLayoutItemType.FIELD)
|
|
1280
1270
|
return '';
|
|
1281
|
-
const
|
|
1271
|
+
const name = (_d = column.name) !== null && _d !== void 0 ? _d : '';
|
|
1272
|
+
const dataType = column.dataType;
|
|
1273
|
+
const listItems = column.listItems;
|
|
1282
1274
|
const raw = row === null || row === void 0 ? void 0 : row[name];
|
|
1283
1275
|
if (raw == null || raw === '')
|
|
1284
1276
|
return '';
|
|
@@ -1372,7 +1364,6 @@ const MrdLayoutSection = class {
|
|
|
1372
1364
|
this.mrdNavigate = createEvent(this, "mrdNavigate");
|
|
1373
1365
|
this.mrdSearch = createEvent(this, "mrdSearch");
|
|
1374
1366
|
this.mrdDownload = createEvent(this, "mrdDownload");
|
|
1375
|
-
this.mrdLoadView = createEvent(this, "mrdLoadView");
|
|
1376
1367
|
this.mrdLoadViewPage = createEvent(this, "mrdLoadViewPage");
|
|
1377
1368
|
this.mrdLoadImage = createEvent(this, "mrdLoadImage");
|
|
1378
1369
|
this.mrdViewAction = createEvent(this, "mrdViewAction");
|
|
@@ -1381,24 +1372,19 @@ const MrdLayoutSection = class {
|
|
|
1381
1372
|
this.items = [];
|
|
1382
1373
|
/** Record data object; keys are field names, _links holds relation and related-view links. */
|
|
1383
1374
|
this.data = {};
|
|
1384
|
-
/**
|
|
1375
|
+
/** Legacy: view metadata map (ClientDashboardMetadata.views). Not needed in new flat format. */
|
|
1385
1376
|
this.views = {};
|
|
1386
|
-
/**
|
|
1377
|
+
/** Legacy: top-level _links from ClientDashboardMetadata. Not needed in new flat format. */
|
|
1387
1378
|
this.links = {};
|
|
1388
1379
|
this.locale = navigator.language;
|
|
1389
1380
|
this.searchQueryMap = {};
|
|
1390
1381
|
this.searchResultsMap = {};
|
|
1391
1382
|
this.imagePreviewUrl = null;
|
|
1392
1383
|
this.imagePreviews = {};
|
|
1393
|
-
this.activeViewMap = {};
|
|
1394
|
-
this.viewLinksMap = {};
|
|
1395
|
-
this.activeFiltersMap = {};
|
|
1396
1384
|
this.searchTimers = {};
|
|
1397
1385
|
this.handleViewLoadPage = (e, name) => {
|
|
1398
|
-
var _a;
|
|
1399
1386
|
e.stopPropagation();
|
|
1400
|
-
|
|
1401
|
-
this.mrdLoadViewPage.emit({ name, page: e.detail.page, sort: e.detail.sort, filters });
|
|
1387
|
+
this.mrdLoadViewPage.emit({ name, page: e.detail.page, sort: e.detail.sort, path: e.detail.path, qs: e.detail.qs });
|
|
1402
1388
|
};
|
|
1403
1389
|
this.handleSearchInput = (dataClass, query) => {
|
|
1404
1390
|
this.searchQueryMap = Object.assign(Object.assign({}, this.searchQueryMap), { [dataClass]: query });
|
|
@@ -1415,65 +1401,33 @@ const MrdLayoutSection = class {
|
|
|
1415
1401
|
}
|
|
1416
1402
|
componentDidLoad() {
|
|
1417
1403
|
setTimeout(() => {
|
|
1418
|
-
this.
|
|
1404
|
+
this.initEmbeddedTables();
|
|
1419
1405
|
this.emitLoadImages();
|
|
1420
1406
|
}, 0);
|
|
1421
1407
|
}
|
|
1422
|
-
linksChanged(newVal) {
|
|
1423
|
-
if (Object.keys(newVal !== null && newVal !== void 0 ? newVal : {}).length > 0) {
|
|
1424
|
-
this.emitLoadViews();
|
|
1425
|
-
}
|
|
1426
|
-
}
|
|
1427
1408
|
dataChanged(newVal) {
|
|
1428
|
-
|
|
1429
|
-
|
|
1430
|
-
this.emitLoadViews();
|
|
1409
|
+
if (newVal && Object.keys(newVal).length > 0) {
|
|
1410
|
+
setTimeout(() => this.initEmbeddedTables(), 0);
|
|
1431
1411
|
}
|
|
1432
1412
|
}
|
|
1433
|
-
|
|
1434
|
-
|
|
1435
|
-
|
|
1436
|
-
|
|
1437
|
-
|
|
1438
|
-
switch (f.operator) {
|
|
1439
|
-
case 'FROM': return Object.assign(Object.assign({}, base), { from: (_a = f.value) !== null && _a !== void 0 ? _a : null });
|
|
1440
|
-
case 'TO': return Object.assign(Object.assign({}, base), { to: (_b = f.value) !== null && _b !== void 0 ? _b : null });
|
|
1441
|
-
case 'STARTS_WITH': return Object.assign(Object.assign({}, base), { operator: 'startsWith', value: (_c = f.value) !== null && _c !== void 0 ? _c : null });
|
|
1442
|
-
case 'NOT_EMPTY': return Object.assign(Object.assign({}, base), { operator: 'isNotEmpty' });
|
|
1443
|
-
case 'EMPTY': return Object.assign(Object.assign({}, base), { operator: 'isEmpty' });
|
|
1444
|
-
default: return Object.assign(Object.assign({}, base), { operator: 'equals', value: (_d = f.value) !== null && _d !== void 0 ? _d : null });
|
|
1445
|
-
}
|
|
1446
|
-
});
|
|
1447
|
-
}
|
|
1448
|
-
emitLoadViews() {
|
|
1449
|
-
var _a, _b, _c, _d, _e, _f, _g, _h;
|
|
1450
|
-
const dataLinks = ((_b = (_a = this.data) === null || _a === void 0 ? void 0 : _a._links) !== null && _b !== void 0 ? _b : {});
|
|
1451
|
-
for (const item of this.flattenItems(this.items)) {
|
|
1452
|
-
if (item.type === ClientLayoutItemType.RELATED_VIEW && item.relatedView) {
|
|
1453
|
-
const rv = item.relatedView;
|
|
1454
|
-
const viewConfig = this.views[rv.name];
|
|
1455
|
-
if (!viewConfig)
|
|
1456
|
-
continue;
|
|
1457
|
-
const href = (_c = dataLinks[rv.relatedClass]) === null || _c === void 0 ? void 0 : _c.href;
|
|
1458
|
-
this.mrdLoadView.emit({ name: rv.name, href, viewConfig, sort: (_d = viewConfig.defaultSort) !== null && _d !== void 0 ? _d : '', filters: this.resolveViewFilters(viewConfig) });
|
|
1459
|
-
}
|
|
1460
|
-
else if (item.type === ClientLayoutItemType.VIEW) {
|
|
1461
|
-
const viewName = (_f = (_e = item.view) === null || _e === void 0 ? void 0 : _e.name) !== null && _f !== void 0 ? _f : item.name;
|
|
1462
|
-
if (!viewName)
|
|
1463
|
-
continue;
|
|
1464
|
-
const viewConfig = this.views[viewName];
|
|
1465
|
-
if (!viewConfig)
|
|
1466
|
-
continue;
|
|
1467
|
-
const href = (_g = this.links[viewName]) === null || _g === void 0 ? void 0 : _g.href;
|
|
1468
|
-
this.mrdLoadView.emit({ name: viewName, href, viewConfig, sort: (_h = viewConfig.defaultSort) !== null && _h !== void 0 ? _h : '', filters: this.resolveViewFilters(viewConfig) });
|
|
1413
|
+
async initEmbeddedTables() {
|
|
1414
|
+
const tables = this.el.querySelectorAll('mrd-table[data-view]');
|
|
1415
|
+
for (const table of Array.from(tables)) {
|
|
1416
|
+
if (typeof table.init === 'function') {
|
|
1417
|
+
await table.init();
|
|
1469
1418
|
}
|
|
1470
1419
|
}
|
|
1471
1420
|
}
|
|
1421
|
+
viewKeyFor(item) {
|
|
1422
|
+
var _a, _b, _c, _d;
|
|
1423
|
+
if (item.type === ClientLayoutItemType.RELATED_VIEW)
|
|
1424
|
+
return (_b = (_a = item.relatedClass) !== null && _a !== void 0 ? _a : item.name) !== null && _b !== void 0 ? _b : '';
|
|
1425
|
+
return (_d = (_c = item.dataClass) !== null && _c !== void 0 ? _c : item.name) !== null && _d !== void 0 ? _d : '';
|
|
1426
|
+
}
|
|
1472
1427
|
emitLoadImages() {
|
|
1473
|
-
var _a;
|
|
1474
1428
|
for (const item of this.flattenItems(this.items)) {
|
|
1475
|
-
if (item.type === ClientLayoutItemType.FIELD &&
|
|
1476
|
-
const fieldName = item.
|
|
1429
|
+
if (item.type === ClientLayoutItemType.FIELD && item.dataType === ClientLayoutItemFieldDataType.IMAGE) {
|
|
1430
|
+
const fieldName = item.name;
|
|
1477
1431
|
const raw = this.data[fieldName];
|
|
1478
1432
|
const href = raw === null || raw === void 0 ? void 0 : raw.href;
|
|
1479
1433
|
if (href)
|
|
@@ -1499,19 +1453,14 @@ const MrdLayoutSection = class {
|
|
|
1499
1453
|
}
|
|
1500
1454
|
/**
|
|
1501
1455
|
* Inject data into an embedded mrd-table for a RELATED_VIEW or VIEW item.
|
|
1502
|
-
* Pass totalElements
|
|
1503
|
-
* Pass pageLinks (_links from the page response) on page 0 to enable action hrefs in mrdViewAction.
|
|
1456
|
+
* Pass totalElements to update the pagination total (safe to pass on every page).
|
|
1504
1457
|
*/
|
|
1505
|
-
async setViewPage(name, page, rows, totalElements
|
|
1506
|
-
if (pageLinks) {
|
|
1507
|
-
this.viewLinksMap = Object.assign(Object.assign({}, this.viewLinksMap), { [name]: pageLinks });
|
|
1508
|
-
}
|
|
1458
|
+
async setViewPage(name, page, rows, totalElements) {
|
|
1509
1459
|
const table = this.el.querySelector(`mrd-table[data-view="${name}"]`);
|
|
1510
1460
|
if (!table)
|
|
1511
1461
|
return;
|
|
1512
1462
|
if (totalElements !== undefined) {
|
|
1513
1463
|
table.totalElements = totalElements;
|
|
1514
|
-
await table.init();
|
|
1515
1464
|
}
|
|
1516
1465
|
await table.setPage(page, rows);
|
|
1517
1466
|
}
|
|
@@ -1531,15 +1480,15 @@ const MrdLayoutSection = class {
|
|
|
1531
1480
|
this.imagePreviewUrl = url;
|
|
1532
1481
|
}
|
|
1533
1482
|
resolveSearchKey() {
|
|
1483
|
+
var _a;
|
|
1534
1484
|
const items = this.flattenItems(this.items).filter(i => i.type === ClientLayoutItemType.SEARCH);
|
|
1535
|
-
if (items.length === 1
|
|
1536
|
-
return items[0].
|
|
1485
|
+
if (items.length === 1)
|
|
1486
|
+
return (_a = items[0].dataClass) !== null && _a !== void 0 ? _a : null;
|
|
1537
1487
|
return null;
|
|
1538
1488
|
}
|
|
1539
1489
|
renderSingleFieldValue(item, value) {
|
|
1540
1490
|
var _a, _b, _c, _d, _e, _f, _g, _h, _j, _k;
|
|
1541
|
-
const
|
|
1542
|
-
const dt = field.dataType;
|
|
1491
|
+
const dt = item.dataType;
|
|
1543
1492
|
switch (dt) {
|
|
1544
1493
|
case ClientLayoutItemFieldDataType.HYPERLINK: {
|
|
1545
1494
|
const v = value;
|
|
@@ -1563,7 +1512,7 @@ const MrdLayoutSection = class {
|
|
|
1563
1512
|
const v = value;
|
|
1564
1513
|
const href = (_f = v === null || v === void 0 ? void 0 : v.href) !== null && _f !== void 0 ? _f : '';
|
|
1565
1514
|
const fileName = (_g = v === null || v === void 0 ? void 0 : v.fileName) !== null && _g !== void 0 ? _g : '';
|
|
1566
|
-
const previewUrl = this.imagePreviews[
|
|
1515
|
+
const previewUrl = this.imagePreviews[item.name];
|
|
1567
1516
|
if (previewUrl) {
|
|
1568
1517
|
return (h("button", { class: "mrd-layout-section__image-thumb-btn", onClick: () => { this.imagePreviewUrl = previewUrl; }, title: fileName || undefined }, h("img", { class: "mrd-layout-section__image-thumb", src: previewUrl, alt: fileName })));
|
|
1569
1518
|
}
|
|
@@ -1572,7 +1521,7 @@ const MrdLayoutSection = class {
|
|
|
1572
1521
|
case ClientLayoutItemFieldDataType.BOOLEAN:
|
|
1573
1522
|
return (h("span", { class: `mrd-layout-section__boolean mrd-layout-section__boolean--${value ? 'true' : 'false'}` }, value ? t('yes', this.locale) : t('no', this.locale)));
|
|
1574
1523
|
case ClientLayoutItemFieldDataType.LIST: {
|
|
1575
|
-
const listItem = ((_h =
|
|
1524
|
+
const listItem = ((_h = item.listItems) !== null && _h !== void 0 ? _h : []).find(li => li.key === String(value));
|
|
1576
1525
|
const label = (_j = listItem === null || listItem === void 0 ? void 0 : listItem.label) !== null && _j !== void 0 ? _j : String(value);
|
|
1577
1526
|
const color = listItem === null || listItem === void 0 ? void 0 : listItem.color;
|
|
1578
1527
|
const bg = listItem === null || listItem === void 0 ? void 0 : listItem.backgroundColor;
|
|
@@ -1585,7 +1534,7 @@ const MrdLayoutSection = class {
|
|
|
1585
1534
|
return label;
|
|
1586
1535
|
}
|
|
1587
1536
|
default: {
|
|
1588
|
-
const text = CellRenderer.renderValue(dt, value, (_k =
|
|
1537
|
+
const text = CellRenderer.renderValue(dt, value, (_k = item.listItems) !== null && _k !== void 0 ? _k : [], this.locale);
|
|
1589
1538
|
return text || null;
|
|
1590
1539
|
}
|
|
1591
1540
|
}
|
|
@@ -1593,8 +1542,7 @@ const MrdLayoutSection = class {
|
|
|
1593
1542
|
renderFieldValue(item, rawValue) {
|
|
1594
1543
|
if (rawValue == null || rawValue === '')
|
|
1595
1544
|
return null;
|
|
1596
|
-
|
|
1597
|
-
if (field.multiple && Array.isArray(rawValue)) {
|
|
1545
|
+
if (item.multiple && Array.isArray(rawValue)) {
|
|
1598
1546
|
const rendered = rawValue.map(v => this.renderSingleFieldValue(item, v));
|
|
1599
1547
|
if (rendered.every(r => typeof r === 'string' || r == null)) {
|
|
1600
1548
|
return rendered.filter(Boolean).join(', ') || null;
|
|
@@ -1604,27 +1552,26 @@ const MrdLayoutSection = class {
|
|
|
1604
1552
|
return this.renderSingleFieldValue(item, rawValue);
|
|
1605
1553
|
}
|
|
1606
1554
|
renderField(item) {
|
|
1607
|
-
if (!item.
|
|
1555
|
+
if (!item.name)
|
|
1608
1556
|
return null;
|
|
1609
|
-
const
|
|
1610
|
-
const rawValue = this.data[field.name];
|
|
1557
|
+
const rawValue = this.data[item.name];
|
|
1611
1558
|
const renderedValue = this.renderFieldValue(item, rawValue);
|
|
1612
|
-
if (
|
|
1613
|
-
return (h("h1", { class: "mrd-layout-section__field-header", key:
|
|
1559
|
+
if (item.header) {
|
|
1560
|
+
return (h("h1", { class: "mrd-layout-section__field-header", key: item.name }, typeof renderedValue === 'string' ? renderedValue : rawValue != null ? String(rawValue) : item.label));
|
|
1614
1561
|
}
|
|
1615
1562
|
if (renderedValue == null)
|
|
1616
1563
|
return null;
|
|
1617
|
-
const isBlock =
|
|
1618
|
-
||
|
|
1619
|
-
||
|
|
1620
|
-
return (h("div", { class: `mrd-layout-section__field${isBlock ? ' mrd-layout-section__field--block' : ''}`, key:
|
|
1564
|
+
const isBlock = item.dataType === ClientLayoutItemFieldDataType.TEXTBLOCK
|
|
1565
|
+
|| item.dataType === ClientLayoutItemFieldDataType.LONGTEXT
|
|
1566
|
+
|| item.dataType === ClientLayoutItemFieldDataType.JSON;
|
|
1567
|
+
return (h("div", { class: `mrd-layout-section__field${isBlock ? ' mrd-layout-section__field--block' : ''}`, key: item.name }, h("span", { class: "mrd-layout-section__field-label" }, item.label), h("span", { class: "mrd-layout-section__field-value" }, renderedValue)));
|
|
1621
1568
|
}
|
|
1622
1569
|
renderRelation(item) {
|
|
1623
1570
|
var _a, _b, _c;
|
|
1624
|
-
if (!item.
|
|
1571
|
+
if (!item.name)
|
|
1625
1572
|
return null;
|
|
1626
1573
|
const links = ((_b = (_a = this.data) === null || _a === void 0 ? void 0 : _a._links) !== null && _b !== void 0 ? _b : {});
|
|
1627
|
-
const link = links[item.
|
|
1574
|
+
const link = links[item.name];
|
|
1628
1575
|
if (!link)
|
|
1629
1576
|
return null;
|
|
1630
1577
|
const makeBtn = (href, name) => (h("button", { key: href, class: "mrd-layout-section__relation-link", onClick: () => this.mrdNavigate.emit({ href, label: name }) }, name));
|
|
@@ -1637,80 +1584,48 @@ const MrdLayoutSection = class {
|
|
|
1637
1584
|
}
|
|
1638
1585
|
if (!valueContent)
|
|
1639
1586
|
return null;
|
|
1640
|
-
return (h("div", { class: "mrd-layout-section__field", key: item.
|
|
1587
|
+
return (h("div", { class: "mrd-layout-section__field", key: item.name }, h("span", { class: "mrd-layout-section__field-label" }, item.label), h("span", { class: "mrd-layout-section__field-value" }, valueContent)));
|
|
1641
1588
|
}
|
|
1642
1589
|
renderSearch(item) {
|
|
1643
1590
|
var _a, _b, _c;
|
|
1644
|
-
if (!item.
|
|
1591
|
+
if (!item.dataClass)
|
|
1645
1592
|
return null;
|
|
1646
|
-
const dataClass = item.
|
|
1593
|
+
const dataClass = item.dataClass;
|
|
1647
1594
|
const query = (_a = this.searchQueryMap[dataClass]) !== null && _a !== void 0 ? _a : '';
|
|
1648
1595
|
const results = (_b = this.searchResultsMap[dataClass]) !== null && _b !== void 0 ? _b : [];
|
|
1649
1596
|
return (h("div", { class: "mrd-layout-section__search", key: `search-${dataClass}` }, h("div", { class: "mrd-layout-section__search-wrap" }, h("svg", { class: "mrd-layout-section__search-icon", xmlns: "http://www.w3.org/2000/svg", viewBox: "0 0 20 20", fill: "currentColor", "aria-hidden": "true" }, h("path", { "fill-rule": "evenodd", d: "M9 3.5a5.5 5.5 0 100 11 5.5 5.5 0 000-11zM2 9a7 7 0 1112.452 4.391l3.328 3.329a.75.75 0 11-1.06 1.06l-3.329-3.328A7 7 0 012 9z", "clip-rule": "evenodd" })), h("input", { class: "mrd-layout-section__search-input", type: "text", value: query, placeholder: (_c = item.label) !== null && _c !== void 0 ? _c : '', onInput: e => this.handleSearchInput(dataClass, e.target.value) })), results.length > 0 && (h("ul", { class: "mrd-layout-section__search-results" }, results.map(r => (h("li", { key: r.id, class: "mrd-layout-section__search-result" }, h("button", { class: "mrd-layout-section__search-result-btn", onClick: () => this.mrdNavigate.emit({ href: r.id, label: r.label }) }, h("span", { class: "mrd-layout-section__search-result-label" }, r.label), r.description && h("span", { class: "mrd-layout-section__search-result-desc" }, r.description)))))))));
|
|
1650
1597
|
}
|
|
1651
1598
|
renderRelatedView(item) {
|
|
1652
|
-
var _a, _b, _c, _d, _e, _f
|
|
1653
|
-
const
|
|
1654
|
-
|
|
1655
|
-
const name = isRelated
|
|
1656
|
-
? (_a = item.relatedView) === null || _a === void 0 ? void 0 : _a.name
|
|
1657
|
-
: ((_c = (_b = item.view) === null || _b === void 0 ? void 0 : _b.name) !== null && _c !== void 0 ? _c : item.name);
|
|
1658
|
-
if (!name)
|
|
1599
|
+
var _a, _b, _c, _d, _e, _f;
|
|
1600
|
+
const key = this.viewKeyFor(item);
|
|
1601
|
+
if (!key)
|
|
1659
1602
|
return null;
|
|
1660
|
-
|
|
1661
|
-
if (!viewConfig)
|
|
1603
|
+
if (!item.view)
|
|
1662
1604
|
return null;
|
|
1663
|
-
const showTitle =
|
|
1664
|
-
|
|
1665
|
-
|
|
1666
|
-
const
|
|
1667
|
-
|
|
1668
|
-
|
|
1669
|
-
const originalLabel = (_m = (_l = (_k = viewConfig.pluralLabel) !== null && _k !== void 0 ? _k : viewConfig.singularLabel) !== null && _l !== void 0 ? _l : item.label) !== null && _m !== void 0 ? _m : name;
|
|
1670
|
-
const allViews = [{ name, label: originalLabel }, ...((_o = item.alternativeViews) !== null && _o !== void 0 ? _o : [])];
|
|
1671
|
-
const activeEntry = allViews.find(v => v.name === activeName);
|
|
1672
|
-
const viewLabel = (_r = (_q = (_p = activeEntry === null || activeEntry === void 0 ? void 0 : activeEntry.label) !== null && _p !== void 0 ? _p : activeViewConfig.pluralLabel) !== null && _q !== void 0 ? _q : activeViewConfig.singularLabel) !== null && _r !== void 0 ? _r : '';
|
|
1673
|
-
const altViews = allViews.filter(v => v.name !== activeName);
|
|
1674
|
-
const rawActions = (_s = item.actions) !== null && _s !== void 0 ? _s : ['NEW', 'EXPORT'];
|
|
1675
|
-
const tableActions = rawActions.reduce((acc, a) => {
|
|
1676
|
-
if (a === 'NEW')
|
|
1677
|
-
acc.push({ action: 'create', label: t('table_new_record', this.locale), icon: 'assets/sprites.svg#icon-plus', variant: 'primary' });
|
|
1678
|
-
if (a === 'EXPORT')
|
|
1679
|
-
acc.push({ action: 'export', label: t('table_export_excel', this.locale), icon: 'assets/sprites.svg#icon-file-excel' });
|
|
1680
|
-
return acc;
|
|
1681
|
-
}, []);
|
|
1682
|
-
return (h("div", { class: "mrd-layout-section__related-view", key: `view-${name}` }, showTitle && item.label && h("h3", { class: "mrd-layout-section__related-view-title" }, item.label), h("mrd-table", { "data-view": name, columns: activeViewConfig.values, locale: this.locale, defaultSort: (_t = activeViewConfig.defaultSort) !== null && _t !== void 0 ? _t : '', viewLabel: viewLabel, alternativeViews: altViews, actions: tableActions, onMrdLoadPage: (e) => this.handleViewLoadPage(e, name), onMrdSwitchView: (e) => {
|
|
1683
|
-
var _a, _b, _c, _d, _e, _f, _g;
|
|
1684
|
-
e.stopPropagation();
|
|
1685
|
-
const newViewName = e.detail.name;
|
|
1686
|
-
const newViewConfig = this.views[newViewName];
|
|
1687
|
-
if (!newViewConfig)
|
|
1688
|
-
return;
|
|
1689
|
-
this.activeViewMap = Object.assign(Object.assign({}, this.activeViewMap), { [name]: newViewName });
|
|
1690
|
-
this.activeFiltersMap = Object.assign(Object.assign({}, this.activeFiltersMap), { [name]: [] });
|
|
1691
|
-
const dataLinks = ((_b = (_a = this.data) === null || _a === void 0 ? void 0 : _a._links) !== null && _b !== void 0 ? _b : {});
|
|
1692
|
-
const href = isRelated
|
|
1693
|
-
? (_c = dataLinks[item.relatedView.relatedClass]) === null || _c === void 0 ? void 0 : _c.href
|
|
1694
|
-
: ((_e = (_d = this.links[newViewName]) === null || _d === void 0 ? void 0 : _d.href) !== null && _e !== void 0 ? _e : (_f = this.links[name]) === null || _f === void 0 ? void 0 : _f.href);
|
|
1695
|
-
this.mrdLoadView.emit({ name, href, viewConfig: newViewConfig, sort: (_g = newViewConfig.defaultSort) !== null && _g !== void 0 ? _g : '', filters: this.resolveViewFilters(newViewConfig) });
|
|
1696
|
-
}, onMrdFilter: (e) => {
|
|
1605
|
+
const showTitle = (_a = item.showTitle) !== null && _a !== void 0 ? _a : false;
|
|
1606
|
+
// Extract parentId from data._links.self.href for RELATED_VIEW path construction
|
|
1607
|
+
const selfHref = (_e = (_d = (_c = (_b = this.data) === null || _b === void 0 ? void 0 : _b._links) === null || _c === void 0 ? void 0 : _c.self) === null || _d === void 0 ? void 0 : _d.href) !== null && _e !== void 0 ? _e : '';
|
|
1608
|
+
const parentId = (_f = selfHref.split('/').filter(Boolean).pop()) !== null && _f !== void 0 ? _f : '';
|
|
1609
|
+
return (h("div", { class: "mrd-layout-section__related-view", key: `view-${key}` }, showTitle && item.label && h("h3", { class: "mrd-layout-section__related-view-title" }, item.label), h("mrd-table", { "data-view": key, item: item, parentId: parentId, locale: this.locale, onMrdLoadPage: (e) => this.handleViewLoadPage(e, key), onMrdLoadAggregations: (e) => {
|
|
1610
|
+
var _a;
|
|
1697
1611
|
e.stopPropagation();
|
|
1698
|
-
this.
|
|
1699
|
-
},
|
|
1700
|
-
var _a, _b, _c
|
|
1612
|
+
this.mrdLoadViewAggregations.emit(Object.assign({ name: key, dataClass: (_a = item.dataClass) !== null && _a !== void 0 ? _a : key }, e.detail));
|
|
1613
|
+
}, onMrdRowClick: (e) => {
|
|
1614
|
+
var _a, _b, _c;
|
|
1701
1615
|
e.stopPropagation();
|
|
1702
|
-
const
|
|
1703
|
-
|
|
1704
|
-
? (_c = dataLinks[item.relatedView.relatedClass]) === null || _c === void 0 ? void 0 : _c.href
|
|
1705
|
-
: ((_f = (_e = this.links[(_d = this.activeViewMap[name]) !== null && _d !== void 0 ? _d : name]) === null || _e === void 0 ? void 0 : _e.href) !== null && _f !== void 0 ? _f : (_g = this.links[name]) === null || _g === void 0 ? void 0 : _g.href);
|
|
1706
|
-
const filters = (_h = this.activeFiltersMap[name]) !== null && _h !== void 0 ? _h : [];
|
|
1707
|
-
this.mrdLoadViewAggregations.emit(Object.assign({ name, href, filters }, e.detail));
|
|
1616
|
+
const row = e.detail;
|
|
1617
|
+
this.mrdNavigate.emit({ href: (_b = (_a = row === null || row === void 0 ? void 0 : row._links) === null || _a === void 0 ? void 0 : _a.self) === null || _b === void 0 ? void 0 : _b.href, label: (_c = row === null || row === void 0 ? void 0 : row.name) !== null && _c !== void 0 ? _c : '' });
|
|
1708
1618
|
}, onMrdAction: (e) => {
|
|
1709
|
-
var _a
|
|
1619
|
+
var _a;
|
|
1710
1620
|
e.stopPropagation();
|
|
1711
|
-
|
|
1712
|
-
|
|
1713
|
-
|
|
1621
|
+
this.mrdViewAction.emit({
|
|
1622
|
+
name: key,
|
|
1623
|
+
action: e.detail.action,
|
|
1624
|
+
dataClass: (_a = item.dataClass) !== null && _a !== void 0 ? _a : key,
|
|
1625
|
+
path: e.detail.path,
|
|
1626
|
+
qs: e.detail.qs,
|
|
1627
|
+
parentPath: e.detail.parentPath,
|
|
1628
|
+
});
|
|
1714
1629
|
} })));
|
|
1715
1630
|
}
|
|
1716
1631
|
renderItem(item) {
|
|
@@ -1725,7 +1640,7 @@ const MrdLayoutSection = class {
|
|
|
1725
1640
|
case ClientLayoutItemType.TEXT:
|
|
1726
1641
|
return h("div", { class: "mrd-layout-section__text", key: `text-${item.label}`, innerHTML: (_a = item.label) !== null && _a !== void 0 ? _a : '' });
|
|
1727
1642
|
case ClientLayoutItemType.NAVIGATE:
|
|
1728
|
-
return (h("button", { class: "mrd-layout-section__navigate", key: `nav-${item.label}`, onClick: () => { var _a; return this.mrdNavigate.emit({ label: (_a = item.label) !== null && _a !== void 0 ? _a : '', navigate: item.navigate }); } }, item.label));
|
|
1643
|
+
return (h("button", { class: "mrd-layout-section__navigate", key: `nav-${item.label}`, onClick: () => { var _a, _b, _c; return this.mrdNavigate.emit({ label: (_a = item.label) !== null && _a !== void 0 ? _a : '', navigate: (_b = item.navigate) !== null && _b !== void 0 ? _b : { dataClass: (_c = item.dataClass) !== null && _c !== void 0 ? _c : '', icon: item.icon, navigationType: item.navigationType } }); } }, item.label));
|
|
1729
1644
|
case ClientLayoutItemType.SEARCH:
|
|
1730
1645
|
return this.renderSearch(item);
|
|
1731
1646
|
case ClientLayoutItemType.SECTION:
|
|
@@ -1744,13 +1659,10 @@ const MrdLayoutSection = class {
|
|
|
1744
1659
|
return (h("div", { class: "mrd-layout-section__modal-backdrop", onClick: () => { this.imagePreviewUrl = null; } }, h("div", { class: "mrd-layout-section__modal", onClick: (e) => e.stopPropagation() }, h("button", { class: "mrd-layout-section__modal-close", onClick: () => { this.imagePreviewUrl = null; } }, "\u2715"), h("img", { class: "mrd-layout-section__modal-image", src: this.imagePreviewUrl, alt: "" }))));
|
|
1745
1660
|
}
|
|
1746
1661
|
render() {
|
|
1747
|
-
return (h(Host, { key: '
|
|
1662
|
+
return (h(Host, { key: 'a7b6514d19cf79261396d9aaf03f459600037566' }, h("div", { key: '331f0558ef3eddf5a9b4332f7ec45c58b52dd8c3', class: "mrd-layout-section" }, this.items.map(item => this.renderItem(item))), this.renderImageModal()));
|
|
1748
1663
|
}
|
|
1749
1664
|
get el() { return getElement(this); }
|
|
1750
1665
|
static get watchers() { return {
|
|
1751
|
-
"links": [{
|
|
1752
|
-
"linksChanged": 0
|
|
1753
|
-
}],
|
|
1754
1666
|
"data": [{
|
|
1755
1667
|
"dataChanged": 0
|
|
1756
1668
|
}]
|
|
@@ -2216,9 +2128,7 @@ const MrdTable = class {
|
|
|
2216
2128
|
this.mrdLoadPage = createEvent(this, "mrdLoadPage");
|
|
2217
2129
|
this.mrdRowClick = createEvent(this, "mrdRowClick");
|
|
2218
2130
|
this.mrdAction = createEvent(this, "mrdAction");
|
|
2219
|
-
this.mrdFilter = createEvent(this, "mrdFilter");
|
|
2220
2131
|
this.mrdDownload = createEvent(this, "mrdDownload");
|
|
2221
|
-
this.mrdSwitchView = createEvent(this, "mrdSwitchView");
|
|
2222
2132
|
this.mrdLoadAggregations = createEvent(this, "mrdLoadAggregations");
|
|
2223
2133
|
// ── Non-state internals ────────────────────────────────────────────────────
|
|
2224
2134
|
this.pendingPages = new Set();
|
|
@@ -2226,7 +2136,10 @@ const MrdTable = class {
|
|
|
2226
2136
|
this.outsideClickHandler = null;
|
|
2227
2137
|
this.keydownHandler = null;
|
|
2228
2138
|
// ── Props ──────────────────────────────────────────────────────────────────
|
|
2229
|
-
|
|
2139
|
+
/** The VIEW or RELATED_VIEW layout item. Contains view config, dataClass, fromClass, actions etc. */
|
|
2140
|
+
this.item = null;
|
|
2141
|
+
/** Parent record id — required for RELATED_VIEW to build /{fromClass}/{parentId}/{dataClass}. */
|
|
2142
|
+
this.parentId = '';
|
|
2230
2143
|
/** Direct rows (non-paginated mode, used when totalElements === 0). */
|
|
2231
2144
|
this.rows = [];
|
|
2232
2145
|
this.locale = navigator.language;
|
|
@@ -2238,16 +2151,9 @@ const MrdTable = class {
|
|
|
2238
2151
|
this.rowHeight = 36;
|
|
2239
2152
|
/** Height of the scroll container in px. */
|
|
2240
2153
|
this.tableHeight = 500;
|
|
2241
|
-
/** Initial sort applied on load, e.g. "timestamp,desc" or "name".
|
|
2242
|
-
* Parsed by init() into sortField + sortDir. */
|
|
2243
|
-
this.defaultSort = '';
|
|
2244
|
-
/** Toolbar action buttons rendered above the table. */
|
|
2245
|
-
this.actions = [];
|
|
2246
|
-
/** Display label of the current view — shown in the toolbar center as a view picker trigger. */
|
|
2247
|
-
this.viewLabel = '';
|
|
2248
|
-
/** Alternative views available for this table; renders a dropdown when non-empty. */
|
|
2249
|
-
this.alternativeViews = [];
|
|
2250
2154
|
// ── Internal state ─────────────────────────────────────────────────────────
|
|
2155
|
+
/** Index into allViews[] for the currently displayed view. 0 = primary, 1+ = alternatives. */
|
|
2156
|
+
this.activeViewIdx = 0;
|
|
2251
2157
|
this.loadedPages = new Map();
|
|
2252
2158
|
this.requestedPages = new Set();
|
|
2253
2159
|
this.renderStart = 0;
|
|
@@ -2290,13 +2196,16 @@ const MrdTable = class {
|
|
|
2290
2196
|
totalElementsChanged(newVal) {
|
|
2291
2197
|
this.renderEnd = Math.min(this.renderEnd, Math.max(0, newVal - 1));
|
|
2292
2198
|
}
|
|
2293
|
-
/**
|
|
2294
|
-
|
|
2295
|
-
|
|
2199
|
+
/** Reset to primary view when the item prop is replaced from outside. */
|
|
2200
|
+
itemChanged(newVal) {
|
|
2201
|
+
var _a, _b;
|
|
2202
|
+
this.activeViewIdx = 0;
|
|
2203
|
+
this.applyDefaultSort((_b = (_a = newVal === null || newVal === void 0 ? void 0 : newVal.view) === null || _a === void 0 ? void 0 : _a.defaultSort) !== null && _b !== void 0 ? _b : '');
|
|
2296
2204
|
}
|
|
2297
2205
|
// ── Lifecycle ──────────────────────────────────────────────────────────────
|
|
2298
2206
|
componentWillLoad() {
|
|
2299
|
-
|
|
2207
|
+
var _a, _b, _c;
|
|
2208
|
+
this.applyDefaultSort((_c = (_b = (_a = this.item) === null || _a === void 0 ? void 0 : _a.view) === null || _b === void 0 ? void 0 : _b.defaultSort) !== null && _c !== void 0 ? _c : '');
|
|
2300
2209
|
}
|
|
2301
2210
|
// ── Helpers ────────────────────────────────────────────────────────────────
|
|
2302
2211
|
applyDefaultSort(defaultSort) {
|
|
@@ -2328,14 +2237,17 @@ const MrdTable = class {
|
|
|
2328
2237
|
this.colWidths = [];
|
|
2329
2238
|
this.scrollTop = 0;
|
|
2330
2239
|
this.renderStart = 0;
|
|
2331
|
-
//
|
|
2332
|
-
//
|
|
2333
|
-
this.renderEnd =
|
|
2240
|
+
// Always fill the visible viewport on init — totalElements may be stale from a
|
|
2241
|
+
// previous view. setPage() clamps renderEnd when the page is shorter than pageSize.
|
|
2242
|
+
this.renderEnd = this.visibleCount() - 1;
|
|
2334
2243
|
const scroller = this.el.querySelector('.mrd-table__scroll');
|
|
2335
2244
|
if (scroller)
|
|
2336
2245
|
scroller.scrollTop = 0;
|
|
2337
2246
|
this.aggregations = null;
|
|
2338
2247
|
this.emitLoadAggregations();
|
|
2248
|
+
// Always request page 0 — totalElements may be unknown (0) on first load.
|
|
2249
|
+
this.mrdLoadPage.emit({ page: 0, sort: this.sortParam(), path: this.buildDataPath(), qs: this.buildQueryParams(0) });
|
|
2250
|
+
this.requestedPages = new Set([0]);
|
|
2339
2251
|
}
|
|
2340
2252
|
/**
|
|
2341
2253
|
* Inject the rows for a given page (0-based).
|
|
@@ -2388,26 +2300,167 @@ const MrdTable = class {
|
|
|
2388
2300
|
return '';
|
|
2389
2301
|
return this.sortDir === 'desc' ? `${this.sortField},desc` : this.sortField;
|
|
2390
2302
|
}
|
|
2391
|
-
|
|
2303
|
+
/** Stable ordered list: primary view first, then alternatives (from the item prop). */
|
|
2304
|
+
get allViews() {
|
|
2305
|
+
var _a, _b, _c, _d, _e, _f, _g;
|
|
2306
|
+
if (!this.item)
|
|
2307
|
+
return [];
|
|
2308
|
+
const it = this.item;
|
|
2309
|
+
return [
|
|
2310
|
+
{ label: (_e = (_d = (_c = (_a = it.label) !== null && _a !== void 0 ? _a : (_b = it.view) === null || _b === void 0 ? void 0 : _b.pluralLabel) !== null && _c !== void 0 ? _c : it.dataClass) !== null && _d !== void 0 ? _d : it.relatedClass) !== null && _e !== void 0 ? _e : '', dataClass: (_f = it.dataClass) !== null && _f !== void 0 ? _f : it.relatedClass, fromClass: it.fromClass, filterClass: it.filterClass, view: it.view },
|
|
2311
|
+
...((_g = it.alternativeViews) !== null && _g !== void 0 ? _g : []).map(av => {
|
|
2312
|
+
var _a, _b, _c, _d;
|
|
2313
|
+
return ({
|
|
2314
|
+
label: (_d = (_c = (_a = av.label) !== null && _a !== void 0 ? _a : (_b = av.view) === null || _b === void 0 ? void 0 : _b.pluralLabel) !== null && _c !== void 0 ? _c : av.dataClass) !== null && _d !== void 0 ? _d : '',
|
|
2315
|
+
dataClass: av.dataClass,
|
|
2316
|
+
fromClass: av.fromClass,
|
|
2317
|
+
filterClass: av.filterClass,
|
|
2318
|
+
view: av.view,
|
|
2319
|
+
});
|
|
2320
|
+
}),
|
|
2321
|
+
];
|
|
2322
|
+
}
|
|
2323
|
+
/** Relative excel export path for the current view.
|
|
2324
|
+
* VIEW: /excel/{dataClass}
|
|
2325
|
+
* RELATED_VIEW: /excel/{fromClass}/{parentId}/{dataClass} */
|
|
2326
|
+
buildExcelPath() {
|
|
2392
2327
|
var _a, _b, _c, _d;
|
|
2393
|
-
|
|
2328
|
+
const v = this.allViews[this.activeViewIdx];
|
|
2329
|
+
if (!v)
|
|
2330
|
+
return '';
|
|
2331
|
+
if (((_a = this.item) === null || _a === void 0 ? void 0 : _a.type) === 'RELATED_VIEW') {
|
|
2332
|
+
return `/excel/${(_b = v.fromClass) !== null && _b !== void 0 ? _b : ''}/${this.parentId}/${(_c = v.dataClass) !== null && _c !== void 0 ? _c : ''}`;
|
|
2333
|
+
}
|
|
2334
|
+
return `/excel/${(_d = v.dataClass) !== null && _d !== void 0 ? _d : ''}`;
|
|
2394
2335
|
}
|
|
2395
|
-
|
|
2336
|
+
buildActionDetail(action) {
|
|
2337
|
+
var _a, _b, _c;
|
|
2338
|
+
if (action === 'export') {
|
|
2339
|
+
return { action, path: this.buildExcelPath(), qs: this.buildQueryParams(0) };
|
|
2340
|
+
}
|
|
2341
|
+
if (action === 'create') {
|
|
2342
|
+
const v = this.allViews[this.activeViewIdx];
|
|
2343
|
+
const parentPath = ((_a = this.item) === null || _a === void 0 ? void 0 : _a.type) === 'RELATED_VIEW'
|
|
2344
|
+
? `/${(_b = v === null || v === void 0 ? void 0 : v.fromClass) !== null && _b !== void 0 ? _b : ''}/${this.parentId}`
|
|
2345
|
+
: null;
|
|
2346
|
+
return { action, dataClass: (_c = v === null || v === void 0 ? void 0 : v.dataClass) !== null && _c !== void 0 ? _c : '', parentPath };
|
|
2347
|
+
}
|
|
2348
|
+
return { action };
|
|
2349
|
+
}
|
|
2350
|
+
/** Relative data path for the current view, without query string.
|
|
2351
|
+
* VIEW: /{dataClass}
|
|
2352
|
+
* RELATED_VIEW: /{fromClass}/{parentId}/{dataClass} */
|
|
2353
|
+
buildDataPath() {
|
|
2354
|
+
var _a, _b, _c, _d;
|
|
2355
|
+
const v = this.allViews[this.activeViewIdx];
|
|
2356
|
+
if (!v)
|
|
2357
|
+
return '';
|
|
2358
|
+
if (((_a = this.item) === null || _a === void 0 ? void 0 : _a.type) === 'RELATED_VIEW') {
|
|
2359
|
+
return `/${(_b = v.fromClass) !== null && _b !== void 0 ? _b : ''}/${this.parentId}/${(_c = v.dataClass) !== null && _c !== void 0 ? _c : ''}`;
|
|
2360
|
+
}
|
|
2361
|
+
return `/${(_d = v.dataClass) !== null && _d !== void 0 ? _d : ''}`;
|
|
2362
|
+
}
|
|
2363
|
+
/** Build query params for a page request from current sort, view filters, filterClass and active column filters. */
|
|
2364
|
+
buildQueryParams(page) {
|
|
2365
|
+
var _a, _b, _c, _d, _e, _f, _g;
|
|
2366
|
+
const v = this.allViews[this.activeViewIdx];
|
|
2367
|
+
const p = new URLSearchParams();
|
|
2368
|
+
if (page > 0)
|
|
2369
|
+
p.set('page', String(page));
|
|
2370
|
+
const sort = this.sortParam();
|
|
2371
|
+
if (sort)
|
|
2372
|
+
p.set('sort', sort);
|
|
2373
|
+
const filterClass = v === null || v === void 0 ? void 0 : v.filterClass;
|
|
2374
|
+
if (filterClass)
|
|
2375
|
+
p.set('type', filterClass);
|
|
2376
|
+
for (const f of ((_b = (_a = v === null || v === void 0 ? void 0 : v.view) === null || _a === void 0 ? void 0 : _a.filter) !== null && _b !== void 0 ? _b : [])) {
|
|
2377
|
+
if (!f.name)
|
|
2378
|
+
continue;
|
|
2379
|
+
if (f.operator === 'EMPTY') {
|
|
2380
|
+
p.set(f.name, '');
|
|
2381
|
+
continue;
|
|
2382
|
+
}
|
|
2383
|
+
if (f.operator === 'NOT_EMPTY') {
|
|
2384
|
+
p.set(f.name + '_notempty', 'true');
|
|
2385
|
+
continue;
|
|
2386
|
+
}
|
|
2387
|
+
if (f.operator === 'STARTS_WITH') {
|
|
2388
|
+
p.set(f.name + '_startswith', String((_c = f.value) !== null && _c !== void 0 ? _c : ''));
|
|
2389
|
+
continue;
|
|
2390
|
+
}
|
|
2391
|
+
if (f.operator === 'FROM') {
|
|
2392
|
+
p.set(f.name + '_from', String((_d = f.value) !== null && _d !== void 0 ? _d : ''));
|
|
2393
|
+
continue;
|
|
2394
|
+
}
|
|
2395
|
+
if (f.operator === 'TO') {
|
|
2396
|
+
p.set(f.name + '_to', String((_e = f.value) !== null && _e !== void 0 ? _e : ''));
|
|
2397
|
+
continue;
|
|
2398
|
+
}
|
|
2399
|
+
if (f.value != null) {
|
|
2400
|
+
p.set(f.name, String(f.value));
|
|
2401
|
+
}
|
|
2402
|
+
}
|
|
2403
|
+
for (const f of this.activeFilters.values()) {
|
|
2404
|
+
if (f.operator === 'isEmpty') {
|
|
2405
|
+
p.set(f.field, '');
|
|
2406
|
+
continue;
|
|
2407
|
+
}
|
|
2408
|
+
if (f.operator === 'isNotEmpty') {
|
|
2409
|
+
p.set(f.field + '_notempty', 'true');
|
|
2410
|
+
continue;
|
|
2411
|
+
}
|
|
2412
|
+
if (f.operator === 'startsWith') {
|
|
2413
|
+
p.set(f.field + '_startswith', String((_f = f.value) !== null && _f !== void 0 ? _f : ''));
|
|
2414
|
+
continue;
|
|
2415
|
+
}
|
|
2416
|
+
if ((_g = f.values) === null || _g === void 0 ? void 0 : _g.length) {
|
|
2417
|
+
p.set(f.field, f.values.join(','));
|
|
2418
|
+
continue;
|
|
2419
|
+
}
|
|
2420
|
+
if (f.value != null)
|
|
2421
|
+
p.set(f.field, String(f.value));
|
|
2422
|
+
if (f.from != null)
|
|
2423
|
+
p.set(f.field + '_from', String(f.from));
|
|
2424
|
+
if (f.to != null)
|
|
2425
|
+
p.set(f.field + '_to', String(f.to));
|
|
2426
|
+
}
|
|
2427
|
+
return p.toString();
|
|
2428
|
+
}
|
|
2429
|
+
get columns() {
|
|
2430
|
+
var _a, _b, _c;
|
|
2431
|
+
return ((_c = (_b = (_a = this.allViews[this.activeViewIdx]) === null || _a === void 0 ? void 0 : _a.view) === null || _b === void 0 ? void 0 : _b.values) !== null && _c !== void 0 ? _c : []);
|
|
2432
|
+
}
|
|
2433
|
+
get tableActions() {
|
|
2396
2434
|
var _a, _b;
|
|
2435
|
+
const raw = (_b = (_a = this.item) === null || _a === void 0 ? void 0 : _a.actions) !== null && _b !== void 0 ? _b : [];
|
|
2436
|
+
return (raw !== null && raw !== void 0 ? raw : []).reduce((acc, a) => {
|
|
2437
|
+
if (a === 'NEW')
|
|
2438
|
+
acc.push({ action: 'create', label: t('table_new_record', this.locale), icon: 'assets/sprites.svg#icon-plus', variant: 'primary' });
|
|
2439
|
+
if (a === 'EXPORT')
|
|
2440
|
+
acc.push({ action: 'export', label: t('table_export_excel', this.locale), icon: 'assets/sprites.svg#icon-file-excel' });
|
|
2441
|
+
return acc;
|
|
2442
|
+
}, []);
|
|
2443
|
+
}
|
|
2444
|
+
colName(col) {
|
|
2445
|
+
var _a;
|
|
2446
|
+
return (_a = col.name) !== null && _a !== void 0 ? _a : '';
|
|
2447
|
+
}
|
|
2448
|
+
colDataType(col) {
|
|
2449
|
+
var _a;
|
|
2397
2450
|
if (col.type === 'RELATION')
|
|
2398
2451
|
return 'RELATION';
|
|
2399
|
-
return (
|
|
2452
|
+
return (_a = col.dataType) !== null && _a !== void 0 ? _a : 'TEXT';
|
|
2400
2453
|
}
|
|
2401
2454
|
// ── Aggregation helpers ────────────────────────────────────────────────────
|
|
2402
2455
|
buildAggregationParams() {
|
|
2403
2456
|
var _a;
|
|
2404
2457
|
const groups = { sum: [], avg: [], count: [] };
|
|
2405
2458
|
for (const col of this.columns) {
|
|
2406
|
-
if (col.type !== 'FIELD' || !
|
|
2459
|
+
if (col.type !== 'FIELD' || !col.aggregate)
|
|
2407
2460
|
continue;
|
|
2408
|
-
const fn = col.
|
|
2461
|
+
const fn = col.aggregate.toLowerCase();
|
|
2409
2462
|
if (fn in groups)
|
|
2410
|
-
groups[fn].push(col.
|
|
2463
|
+
groups[fn].push((_a = col.name) !== null && _a !== void 0 ? _a : '');
|
|
2411
2464
|
}
|
|
2412
2465
|
const params = {};
|
|
2413
2466
|
if (groups.sum.length)
|
|
@@ -2419,25 +2472,25 @@ const MrdTable = class {
|
|
|
2419
2472
|
return Object.keys(params).length > 0 ? params : null;
|
|
2420
2473
|
}
|
|
2421
2474
|
emitLoadAggregations() {
|
|
2422
|
-
const
|
|
2423
|
-
if (
|
|
2424
|
-
this.mrdLoadAggregations.emit(
|
|
2475
|
+
const aggParams = this.buildAggregationParams();
|
|
2476
|
+
if (aggParams)
|
|
2477
|
+
this.mrdLoadAggregations.emit(Object.assign(Object.assign({}, aggParams), { path: this.buildDataPath(), qs: this.buildQueryParams(0) }));
|
|
2425
2478
|
}
|
|
2426
2479
|
renderAggregationValue(col) {
|
|
2427
2480
|
var _a, _b;
|
|
2428
|
-
if (col.type !== 'FIELD' || !
|
|
2481
|
+
if (col.type !== 'FIELD' || !col.aggregate || !this.aggregations)
|
|
2429
2482
|
return '';
|
|
2430
|
-
const fn = col.
|
|
2431
|
-
const val = (
|
|
2483
|
+
const fn = col.aggregate.toLowerCase();
|
|
2484
|
+
const val = (_a = this.aggregations[fn]) === null || _a === void 0 ? void 0 : _a[(_b = col.name) !== null && _b !== void 0 ? _b : ''];
|
|
2432
2485
|
if (val == null)
|
|
2433
2486
|
return '';
|
|
2434
|
-
const dt = col.
|
|
2487
|
+
const dt = col.dataType;
|
|
2435
2488
|
if (dt === 'INTEGER')
|
|
2436
2489
|
return formatNumber(val, this.locale, { maximumFractionDigits: 0 });
|
|
2437
2490
|
if (dt === 'PERCENTAGE')
|
|
2438
2491
|
return formatPercentage(val, this.locale);
|
|
2439
|
-
if (dt === 'CURRENCY' && col.
|
|
2440
|
-
return formatCurrency(val, col.
|
|
2492
|
+
if (dt === 'CURRENCY' && col.currencyCode)
|
|
2493
|
+
return formatCurrency(val, col.currencyCode, this.locale);
|
|
2441
2494
|
return formatNumber(val, this.locale);
|
|
2442
2495
|
}
|
|
2443
2496
|
// ── Reset pagination ───────────────────────────────────────────────────────
|
|
@@ -2486,7 +2539,7 @@ const MrdTable = class {
|
|
|
2486
2539
|
for (let p = firstPage; p <= lastPage; p++) {
|
|
2487
2540
|
if (!this.loadedPages.has(p) && !next.has(p)) {
|
|
2488
2541
|
next.add(p);
|
|
2489
|
-
this.mrdLoadPage.emit({ page: p, sort: this.sortParam() });
|
|
2542
|
+
this.mrdLoadPage.emit({ page: p, sort: this.sortParam(), path: this.buildDataPath(), qs: this.buildQueryParams(p) });
|
|
2490
2543
|
changed = true;
|
|
2491
2544
|
}
|
|
2492
2545
|
}
|
|
@@ -2528,7 +2581,7 @@ const MrdTable = class {
|
|
|
2528
2581
|
if (pageEnd < this.renderStart || pageStart > this.renderEnd)
|
|
2529
2582
|
continue;
|
|
2530
2583
|
next.add(page);
|
|
2531
|
-
this.mrdLoadPage.emit({ page, sort: this.sortParam() });
|
|
2584
|
+
this.mrdLoadPage.emit({ page, sort: this.sortParam(), path: this.buildDataPath(), qs: this.buildQueryParams(page) });
|
|
2532
2585
|
changed = true;
|
|
2533
2586
|
}
|
|
2534
2587
|
this.pendingPages.clear();
|
|
@@ -2720,7 +2773,6 @@ const MrdTable = class {
|
|
|
2720
2773
|
}
|
|
2721
2774
|
this.activeFilters = next;
|
|
2722
2775
|
this.closeFilterPopup();
|
|
2723
|
-
this.mrdFilter.emit({ filters: Array.from(this.activeFilters.values()) });
|
|
2724
2776
|
this.aggregations = null;
|
|
2725
2777
|
this.emitLoadAggregations();
|
|
2726
2778
|
if (this.totalElements > 0) {
|
|
@@ -2735,7 +2787,6 @@ const MrdTable = class {
|
|
|
2735
2787
|
next.delete(name);
|
|
2736
2788
|
this.activeFilters = next;
|
|
2737
2789
|
this.closeFilterPopup();
|
|
2738
|
-
this.mrdFilter.emit({ filters: Array.from(this.activeFilters.values()) });
|
|
2739
2790
|
this.aggregations = null;
|
|
2740
2791
|
this.emitLoadAggregations();
|
|
2741
2792
|
if (this.totalElements > 0) {
|
|
@@ -2745,7 +2796,6 @@ const MrdTable = class {
|
|
|
2745
2796
|
}
|
|
2746
2797
|
clearAllFilters() {
|
|
2747
2798
|
this.activeFilters = new Map();
|
|
2748
|
-
this.mrdFilter.emit({ filters: [] });
|
|
2749
2799
|
this.aggregations = null;
|
|
2750
2800
|
this.emitLoadAggregations();
|
|
2751
2801
|
if (this.totalElements > 0) {
|
|
@@ -2754,35 +2804,37 @@ const MrdTable = class {
|
|
|
2754
2804
|
}
|
|
2755
2805
|
}
|
|
2756
2806
|
// ── View switcher ──────────────────────────────────────────────────────────
|
|
2757
|
-
handleViewSwitch(
|
|
2758
|
-
|
|
2807
|
+
handleViewSwitch(targetIdx) {
|
|
2808
|
+
var _a, _b;
|
|
2809
|
+
const target = this.allViews[targetIdx];
|
|
2810
|
+
if (!(target === null || target === void 0 ? void 0 : target.view))
|
|
2811
|
+
return;
|
|
2812
|
+
this.activeViewIdx = targetIdx;
|
|
2813
|
+
this.applyDefaultSort((_b = (_a = target.view) === null || _a === void 0 ? void 0 : _a.defaultSort) !== null && _b !== void 0 ? _b : '');
|
|
2814
|
+
this.activeFilters = new Map();
|
|
2815
|
+
this.init();
|
|
2759
2816
|
}
|
|
2760
2817
|
// ── Render: toolbar ────────────────────────────────────────────────────────
|
|
2761
2818
|
renderToolbar() {
|
|
2762
|
-
var _a, _b;
|
|
2763
2819
|
const filterCount = this.activeFilters.size;
|
|
2764
|
-
const
|
|
2765
|
-
const
|
|
2820
|
+
const actions = this.tableActions;
|
|
2821
|
+
const allViews = this.allViews;
|
|
2822
|
+
const hasActions = actions.length > 0;
|
|
2823
|
+
const hasViewSwitcher = allViews.length > 1;
|
|
2766
2824
|
return (h("div", { class: "mrd-table__toolbar" }, h("div", { class: "mrd-table__toolbar-left" }, h("button", { class: `mrd-table__action mrd-table__action--secondary mrd-table__filter-toggle${this.filterMode ? ' mrd-table__filter-toggle--active' : ''}`, onClick: () => this.handleFilterToggle() }, h("svg", { class: "mrd-table__action-icon", viewBox: "0 0 24 24", "aria-hidden": "true" }, h("path", { fill: "currentColor", d: "M10 18h4v-2h-4v2zM3 6v2h18V6H3zm3 7h12v-2H6v2z" })), filterCount > 0 && h("span", { class: "mrd-table__filter-badge" }, filterCount), h("span", { class: "mrd-table__action-tooltip" }, this.filterMode ? t('table_filter_hide', this.locale) : t('table_filter', this.locale), filterCount > 0 ? ` (${filterCount} ${t('table_filter_active', this.locale)})` : '')), filterCount > 0 && (h("button", { class: "mrd-table__action mrd-table__action--secondary", onClick: () => this.clearAllFilters() }, h("svg", { class: "mrd-table__action-icon", viewBox: "0 0 24 24", "aria-hidden": "true" }, h("path", { fill: "currentColor", d: "M19 6.41L17.59 5 12 10.59 6.41 5 5 6.41 10.59 12 5 17.59 6.41 19 12 13.41 17.59 19 19 17.59 13.41 12z" })), h("span", { class: "mrd-table__action-tooltip" }, t('table_filter_clear_all', this.locale))))), hasViewSwitcher && (h("div", { class: "mrd-table__toolbar-center" }, h("select", { class: "mrd-table__view-select", onChange: (e) => {
|
|
2767
|
-
const
|
|
2768
|
-
|
|
2769
|
-
|
|
2770
|
-
|
|
2771
|
-
this.handleViewSwitch(view);
|
|
2772
|
-
}
|
|
2773
|
-
} }, h("option", { value: "" }, this.viewLabel), this.alternativeViews.map(v => {
|
|
2825
|
+
const idx = parseInt(e.target.value, 10);
|
|
2826
|
+
if (!isNaN(idx) && idx !== this.activeViewIdx)
|
|
2827
|
+
this.handleViewSwitch(idx);
|
|
2828
|
+
} }, allViews.map((v, i) => (h("option", { value: String(i), selected: i === this.activeViewIdx }, v.label)))))), hasActions && (h("div", { class: "mrd-table__toolbar-right" }, actions.map(a => {
|
|
2774
2829
|
var _a;
|
|
2775
|
-
return (h("
|
|
2776
|
-
})))), hasActions && (h("div", { class: "mrd-table__toolbar-right" }, this.actions.map(a => {
|
|
2777
|
-
var _a;
|
|
2778
|
-
return (h("button", { class: `mrd-table__action mrd-table__action--${(_a = a.variant) !== null && _a !== void 0 ? _a : 'secondary'}`, disabled: a.disabled, onClick: () => this.mrdAction.emit({ action: a.action }) }, a.icon
|
|
2830
|
+
return (h("button", { class: `mrd-table__action mrd-table__action--${(_a = a.variant) !== null && _a !== void 0 ? _a : 'secondary'}`, disabled: a.disabled, onClick: () => this.mrdAction.emit(this.buildActionDetail(a.action)) }, a.icon
|
|
2779
2831
|
? h("svg", { class: "mrd-table__action-icon", "aria-hidden": "true" }, h("use", { href: a.icon }))
|
|
2780
2832
|
: a.label, h("span", { class: "mrd-table__action-tooltip" }, a.label)));
|
|
2781
2833
|
})))));
|
|
2782
2834
|
}
|
|
2783
2835
|
// ── Render: filter popup ───────────────────────────────────────────────────
|
|
2784
2836
|
renderFilterEditor(col) {
|
|
2785
|
-
var _a, _b, _c, _d, _e, _f, _g
|
|
2837
|
+
var _a, _b, _c, _d, _e, _f, _g;
|
|
2786
2838
|
const pf = (_a = this.pendingFilter) !== null && _a !== void 0 ? _a : {};
|
|
2787
2839
|
const dataType = this.colDataType(col);
|
|
2788
2840
|
if (NO_FILTER_TYPES.has(dataType)) {
|
|
@@ -2798,19 +2850,19 @@ const MrdTable = class {
|
|
|
2798
2850
|
].map(opt => (h("label", { class: "mrd-table__filter-radio-label" }, h("input", { type: "radio", name: `bf-${this.openFilterCol}`, checked: !noValueOp && pf.value === opt.value, onChange: () => { this.pendingFilter = Object.assign(Object.assign({}, pf), { operator: undefined, value: opt.value }); } }), t(opt.labelKey, this.locale)))), h("label", { class: "mrd-table__filter-radio-label" }, h("input", { type: "radio", name: `bf-${this.openFilterCol}`, checked: boolOp === 'isEmpty', onChange: () => { this.pendingFilter = Object.assign(Object.assign({}, pf), { operator: 'isEmpty', value: undefined }); } }), t('filter_is_empty', this.locale)), h("label", { class: "mrd-table__filter-radio-label" }, h("input", { type: "radio", name: `bf-${this.openFilterCol}`, checked: boolOp === 'isNotEmpty', onChange: () => { this.pendingFilter = Object.assign(Object.assign({}, pf), { operator: 'isNotEmpty', value: undefined }); } }), t('filter_is_not_empty', this.locale))));
|
|
2799
2851
|
}
|
|
2800
2852
|
if (dataType === 'LIST') {
|
|
2801
|
-
const items = (
|
|
2802
|
-
const selected = (
|
|
2853
|
+
const items = (_b = col.listItems) !== null && _b !== void 0 ? _b : [];
|
|
2854
|
+
const selected = (_c = pf.values) !== null && _c !== void 0 ? _c : [];
|
|
2803
2855
|
return (h("div", { class: "mrd-table__filter-list" }, h("div", { class: "mrd-table__filter-list-controls" }, h("button", { class: "mrd-table__filter-list-btn", onClick: () => { this.pendingFilter = Object.assign(Object.assign({}, pf), { values: items.map(i => i.key) }); } }, t('filter_select_all', this.locale)), h("button", { class: "mrd-table__filter-list-btn", onClick: () => { this.pendingFilter = Object.assign(Object.assign({}, pf), { values: [] }); } }, t('filter_select_none', this.locale))), items.map(item => (h("label", { class: "mrd-table__filter-checkbox-label" }, h("input", { type: "checkbox", checked: selected.includes(item.key), onChange: (e) => this.togglePendingValue(item.key, e.target.checked) }), item.label)))));
|
|
2804
2856
|
}
|
|
2805
2857
|
if (TEXT_TYPES.has(dataType) || dataType === 'RELATION') {
|
|
2806
|
-
const op = (
|
|
2858
|
+
const op = (_d = pf.operator) !== null && _d !== void 0 ? _d : 'startsWith';
|
|
2807
2859
|
const noInput = op === 'isEmpty' || op === 'isNotEmpty';
|
|
2808
2860
|
return (h("div", { class: "mrd-table__filter-editor" }, h("select", { class: "mrd-table__filter-select", onChange: (e) => this.setPending('operator', e.target.value) }, [
|
|
2809
2861
|
{ val: 'startsWith', labelKey: 'filter_starts_with' },
|
|
2810
2862
|
{ val: 'equals', labelKey: 'filter_equals' },
|
|
2811
2863
|
{ val: 'isEmpty', labelKey: 'filter_is_empty' },
|
|
2812
2864
|
{ val: 'isNotEmpty', labelKey: 'filter_is_not_empty' },
|
|
2813
|
-
].map(o => h("option", { value: o.val, selected: op === o.val }, t(o.labelKey, this.locale)))), !noInput && (h("input", { type: "text", class: "mrd-table__filter-input", value: String((
|
|
2865
|
+
].map(o => h("option", { value: o.val, selected: op === o.val }, t(o.labelKey, this.locale)))), !noInput && (h("input", { type: "text", class: "mrd-table__filter-input", value: String((_e = pf.value) !== null && _e !== void 0 ? _e : ''), placeholder: t('filter_search_value', this.locale), onInput: (e) => this.setPending('value', e.target.value) }))));
|
|
2814
2866
|
}
|
|
2815
2867
|
if (NUMERIC_TYPES.has(dataType)) {
|
|
2816
2868
|
const numOp = pf.operator;
|
|
@@ -2838,7 +2890,7 @@ const MrdTable = class {
|
|
|
2838
2890
|
else {
|
|
2839
2891
|
this.pendingFilter = Object.assign(Object.assign({}, pf), { operator: undefined });
|
|
2840
2892
|
}
|
|
2841
|
-
} }, h("option", { value: "", selected: !noInput }, t('filter_has_value', this.locale)), h("option", { value: "isEmpty", selected: dtOp === 'isEmpty' }, t('filter_is_empty', this.locale)), h("option", { value: "isNotEmpty", selected: dtOp === 'isNotEmpty' }, t('filter_is_not_empty', this.locale))), !noInput && (h("div", { class: "mrd-table__filter-editor" }, h("div", { class: "mrd-table__filter-radio-group mrd-table__filter-radio-group--inline" }, h("label", { class: "mrd-table__filter-radio-label" }, h("input", { type: "radio", name: `dt-${this.openFilterCol}`, checked: !rangeMode, onChange: () => { this.pendingFilter = Object.assign(Object.assign({}, pf), { from: undefined, to: undefined }); } }), t('filter_exact', this.locale)), h("label", { class: "mrd-table__filter-radio-label" }, h("input", { type: "radio", name: `dt-${this.openFilterCol}`, checked: rangeMode, onChange: () => { this.pendingFilter = Object.assign(Object.assign({}, pf), { value: undefined, from: null, to: null }); } }), t('filter_range', this.locale))), !rangeMode ? (h("input", { type: "date", class: "mrd-table__filter-input", value: String((
|
|
2893
|
+
} }, h("option", { value: "", selected: !noInput }, t('filter_has_value', this.locale)), h("option", { value: "isEmpty", selected: dtOp === 'isEmpty' }, t('filter_is_empty', this.locale)), h("option", { value: "isNotEmpty", selected: dtOp === 'isNotEmpty' }, t('filter_is_not_empty', this.locale))), !noInput && (h("div", { class: "mrd-table__filter-editor" }, h("div", { class: "mrd-table__filter-radio-group mrd-table__filter-radio-group--inline" }, h("label", { class: "mrd-table__filter-radio-label" }, h("input", { type: "radio", name: `dt-${this.openFilterCol}`, checked: !rangeMode, onChange: () => { this.pendingFilter = Object.assign(Object.assign({}, pf), { from: undefined, to: undefined }); } }), t('filter_exact', this.locale)), h("label", { class: "mrd-table__filter-radio-label" }, h("input", { type: "radio", name: `dt-${this.openFilterCol}`, checked: rangeMode, onChange: () => { this.pendingFilter = Object.assign(Object.assign({}, pf), { value: undefined, from: null, to: null }); } }), t('filter_range', this.locale))), !rangeMode ? (h("input", { type: "date", class: "mrd-table__filter-input", value: String((_f = pf.value) !== null && _f !== void 0 ? _f : ''), onInput: (e) => this.setPending('value', e.target.value) })) : (h("div", { class: "mrd-table__filter-range mrd-table__filter-range--stacked" }, h("label", { class: "mrd-table__filter-range-label" }, t('filter_from', this.locale)), h("input", { type: "date", class: "mrd-table__filter-input", value: pf.from != null ? String(pf.from) : '', onInput: (e) => this.setPending('from', e.target.value) }), h("label", { class: "mrd-table__filter-range-label" }, t('filter_to', this.locale)), h("input", { type: "date", class: "mrd-table__filter-input", value: pf.to != null ? String(pf.to) : '', onInput: (e) => this.setPending('to', e.target.value) })))))));
|
|
2842
2894
|
}
|
|
2843
2895
|
if (DATE_TYPES.has(dataType)) {
|
|
2844
2896
|
const inputType = dataType === 'DATE' ? 'date' : 'time';
|
|
@@ -2853,18 +2905,18 @@ const MrdTable = class {
|
|
|
2853
2905
|
else {
|
|
2854
2906
|
this.pendingFilter = Object.assign(Object.assign({}, pf), { operator: undefined });
|
|
2855
2907
|
}
|
|
2856
|
-
} }, h("option", { value: "", selected: !noInput }, t('filter_has_value', this.locale)), h("option", { value: "isEmpty", selected: dtdOp === 'isEmpty' }, t('filter_is_empty', this.locale)), h("option", { value: "isNotEmpty", selected: dtdOp === 'isNotEmpty' }, t('filter_is_not_empty', this.locale))), !noInput && (h("div", { class: "mrd-table__filter-editor" }, h("div", { class: "mrd-table__filter-radio-group mrd-table__filter-radio-group--inline" }, h("label", { class: "mrd-table__filter-radio-label" }, h("input", { type: "radio", name: `dt-${this.openFilterCol}`, checked: !rangeMode, onChange: () => { this.pendingFilter = Object.assign(Object.assign({}, pf), { from: undefined, to: undefined }); } }), t('filter_exact', this.locale)), h("label", { class: "mrd-table__filter-radio-label" }, h("input", { type: "radio", name: `dt-${this.openFilterCol}`, checked: rangeMode, onChange: () => { this.pendingFilter = Object.assign(Object.assign({}, pf), { value: undefined, from: null, to: null }); } }), t('filter_range', this.locale))), !rangeMode ? (h("input", { type: inputType, class: "mrd-table__filter-input", value: String((
|
|
2908
|
+
} }, h("option", { value: "", selected: !noInput }, t('filter_has_value', this.locale)), h("option", { value: "isEmpty", selected: dtdOp === 'isEmpty' }, t('filter_is_empty', this.locale)), h("option", { value: "isNotEmpty", selected: dtdOp === 'isNotEmpty' }, t('filter_is_not_empty', this.locale))), !noInput && (h("div", { class: "mrd-table__filter-editor" }, h("div", { class: "mrd-table__filter-radio-group mrd-table__filter-radio-group--inline" }, h("label", { class: "mrd-table__filter-radio-label" }, h("input", { type: "radio", name: `dt-${this.openFilterCol}`, checked: !rangeMode, onChange: () => { this.pendingFilter = Object.assign(Object.assign({}, pf), { from: undefined, to: undefined }); } }), t('filter_exact', this.locale)), h("label", { class: "mrd-table__filter-radio-label" }, h("input", { type: "radio", name: `dt-${this.openFilterCol}`, checked: rangeMode, onChange: () => { this.pendingFilter = Object.assign(Object.assign({}, pf), { value: undefined, from: null, to: null }); } }), t('filter_range', this.locale))), !rangeMode ? (h("input", { type: inputType, class: "mrd-table__filter-input", value: String((_g = pf.value) !== null && _g !== void 0 ? _g : ''), onInput: (e) => this.setPending('value', e.target.value) })) : (h("div", { class: "mrd-table__filter-range" }, h("input", { type: inputType, class: "mrd-table__filter-input", placeholder: t('filter_from', this.locale), value: pf.from != null ? String(pf.from) : '', onInput: (e) => this.setPending('from', e.target.value) }), h("input", { type: inputType, class: "mrd-table__filter-input", placeholder: t('filter_to', this.locale), value: pf.to != null ? String(pf.to) : '', onInput: (e) => this.setPending('to', e.target.value) })))))));
|
|
2857
2909
|
}
|
|
2858
2910
|
return null;
|
|
2859
2911
|
}
|
|
2860
2912
|
renderFilterPopup() {
|
|
2861
|
-
var _a
|
|
2913
|
+
var _a;
|
|
2862
2914
|
if (!this.openFilterCol || !this.pendingFilter)
|
|
2863
2915
|
return null;
|
|
2864
2916
|
const col = this.columns.find(c => this.colName(c) === this.openFilterCol);
|
|
2865
2917
|
if (!col)
|
|
2866
2918
|
return null;
|
|
2867
|
-
const label = (
|
|
2919
|
+
const label = (_a = col.label) !== null && _a !== void 0 ? _a : this.openFilterCol;
|
|
2868
2920
|
const sortActive = this.sortField === this.openFilterCol;
|
|
2869
2921
|
return (h("div", { class: "mrd-table__filter-popup", style: { top: `${this.popupPos.top}px`, left: `${this.popupPos.left}px` }, onClick: (e) => e.stopPropagation() }, h("div", { class: "mrd-table__filter-popup-header" }, h("span", { class: "mrd-table__filter-popup-title" }, label), h("button", { class: "mrd-table__filter-close", onClick: () => this.closeFilterPopup() }, "\u2715")), h("div", { class: "mrd-table__filter-section" }, h("div", { class: "mrd-table__filter-section-label" }, t('filter_sorting', this.locale)), h("div", { class: "mrd-table__filter-sort-buttons" }, h("button", { class: `mrd-table__filter-sort-btn${sortActive && this.sortDir === 'asc' ? ' mrd-table__filter-sort-btn--active' : ''}`, onClick: () => this.applySort(col, 'asc') }, "\u25B2 ", t('filter_ascending', this.locale)), h("button", { class: `mrd-table__filter-sort-btn${sortActive && this.sortDir === 'desc' ? ' mrd-table__filter-sort-btn--active' : ''}`, onClick: () => this.applySort(col, 'desc') }, "\u25BC ", t('filter_descending', this.locale)))), h("div", { class: "mrd-table__filter-divider" }), h("div", { class: "mrd-table__filter-section" }, h("div", { class: "mrd-table__filter-section-label" }, t('filter_section', this.locale)), this.renderFilterEditor(col)), h("div", { class: "mrd-table__filter-popup-footer" }, h("button", { class: "mrd-table__filter-btn mrd-table__filter-btn--clear", onClick: () => this.clearFilter() }, t('filter_clear', this.locale)), h("button", { class: "mrd-table__filter-btn mrd-table__filter-btn--apply", onClick: () => this.applyFilter() }, t('filter_apply', this.locale)))));
|
|
2870
2922
|
}
|
|
@@ -2891,13 +2943,13 @@ const MrdTable = class {
|
|
|
2891
2943
|
}
|
|
2892
2944
|
// ── Render: cell ──────────────────────────────────────────────────────────
|
|
2893
2945
|
renderCell(col, row) {
|
|
2894
|
-
var _a, _b, _c
|
|
2946
|
+
var _a, _b, _c;
|
|
2895
2947
|
const numericTypes = new Set(['INTEGER', 'DECIMAL', 'PERCENTAGE', 'CURRENCY']);
|
|
2896
|
-
const dataType = (
|
|
2948
|
+
const dataType = (_a = col.dataType) !== null && _a !== void 0 ? _a : '';
|
|
2897
2949
|
const isNumeric = col.type === 'FIELD' && numericTypes.has(dataType);
|
|
2898
2950
|
const isFile = col.type === 'FIELD' && (dataType === 'FILE' || dataType === 'IMAGE');
|
|
2899
2951
|
if (isFile) {
|
|
2900
|
-
const name = (
|
|
2952
|
+
const name = (_b = col.name) !== null && _b !== void 0 ? _b : '';
|
|
2901
2953
|
const fileVal = row === null || row === void 0 ? void 0 : row[name];
|
|
2902
2954
|
const href = fileVal === null || fileVal === void 0 ? void 0 : fileVal.href;
|
|
2903
2955
|
const fileName = fileVal === null || fileVal === void 0 ? void 0 : fileVal.fileName;
|
|
@@ -2907,7 +2959,7 @@ const MrdTable = class {
|
|
|
2907
2959
|
} }, h("svg", { class: "mrd-table__file-icon", viewBox: "0 0 24 24", "aria-hidden": "true" }, h("path", { fill: "currentColor", d: "M14 2H6c-1.1 0-2 .9-2 2v16c0 1.1.9 2 2 2h12c1.1 0 2-.9 2-2V8l-6-6zm-1 7V3.5L18.5 9H13zm-3 8l-3-3 1.41-1.41L10 14.17l4.59-4.58L16 11l-6 6z" })), t('download', this.locale))) : ''));
|
|
2908
2960
|
}
|
|
2909
2961
|
if (dataType === 'JSON') {
|
|
2910
|
-
const name = (
|
|
2962
|
+
const name = (_c = col.name) !== null && _c !== void 0 ? _c : '';
|
|
2911
2963
|
const rawValue = name ? row === null || row === void 0 ? void 0 : row[name] : undefined;
|
|
2912
2964
|
if (rawValue == null || rawValue === '')
|
|
2913
2965
|
return h("td", { class: "mrd-table__cell" });
|
|
@@ -2931,12 +2983,12 @@ const MrdTable = class {
|
|
|
2931
2983
|
renderTotalsRow() {
|
|
2932
2984
|
if (!this.aggregations)
|
|
2933
2985
|
return null;
|
|
2934
|
-
if (!this.columns.some(c =>
|
|
2986
|
+
if (!this.columns.some(c => c.type === 'FIELD' && c.aggregate))
|
|
2935
2987
|
return null;
|
|
2936
2988
|
return (h("tfoot", null, h("tr", { class: "mrd-table__totals-row" }, this.columns.map(col => {
|
|
2937
|
-
var _a
|
|
2989
|
+
var _a;
|
|
2938
2990
|
const val = this.renderAggregationValue(col);
|
|
2939
|
-
const isNumeric = col.type === 'FIELD' && NUMERIC_TYPES.has((
|
|
2991
|
+
const isNumeric = col.type === 'FIELD' && NUMERIC_TYPES.has((_a = col.dataType) !== null && _a !== void 0 ? _a : '');
|
|
2940
2992
|
return (h("td", { class: `mrd-table__totals-cell${isNumeric ? ' mrd-table__totals-cell--numeric' : ''}` }, val));
|
|
2941
2993
|
}))));
|
|
2942
2994
|
}
|
|
@@ -2948,7 +3000,7 @@ const MrdTable = class {
|
|
|
2948
3000
|
// ── Non-paginated mode ──────────────────────────────────────────────────
|
|
2949
3001
|
if (this.totalElements === 0) {
|
|
2950
3002
|
return (h(Host, null, this.renderToolbar(), h("div", { class: "mrd-table" }, h("table", { class: "mrd-table__table" }, h("thead", null, h("tr", null, this.columns.map(col => {
|
|
2951
|
-
var _a
|
|
3003
|
+
var _a;
|
|
2952
3004
|
const name = this.colName(col);
|
|
2953
3005
|
const isFiltered = this.activeFilters.has(name);
|
|
2954
3006
|
const cls = [
|
|
@@ -2956,7 +3008,7 @@ const MrdTable = class {
|
|
|
2956
3008
|
isFiltered ? 'mrd-table__header--filtered' : '',
|
|
2957
3009
|
this.filterMode ? 'mrd-table__header--sortable' : '',
|
|
2958
3010
|
].filter(Boolean).join(' ');
|
|
2959
|
-
return (h("th", { class: cls, onClick: this.filterMode ? (e) => this.handleFilterOpen(col, e) : undefined }, h("span", { class: "mrd-table__header-label" }, (
|
|
3011
|
+
return (h("th", { class: cls, onClick: this.filterMode ? (e) => this.handleFilterOpen(col, e) : undefined }, h("span", { class: "mrd-table__header-label" }, (_a = col.label) !== null && _a !== void 0 ? _a : ''), isFiltered && this.renderFilterIcon()));
|
|
2960
3012
|
}))), h("tbody", null, (_b = this.rows) === null || _b === void 0 ? void 0 : _b.map((row, i) => (h("tr", { class: "mrd-table__row mrd-table__row--clickable", style: { background: i % 2 === 0 ? '' : 'var(--mrd-color-neutral-100)' }, onClick: () => this.mrdRowClick.emit(row) }, this.columns.map(col => this.renderCell(col, row)))))), this.renderTotalsRow()), (!this.rows || this.rows.length === 0) && (h("p", { class: "mrd-table__empty" }, t('no_results', this.locale)))), this.renderFooter((_c = this.rows) === null || _c === void 0 ? void 0 : _c.length), this.renderFilterPopup(), this.renderTextblockModal(), this.renderJsonModal()));
|
|
2961
3013
|
}
|
|
2962
3014
|
// ── Paginated / virtual-scroll mode ────────────────────────────────────
|
|
@@ -2989,7 +3041,7 @@ const MrdTable = class {
|
|
|
2989
3041
|
}
|
|
2990
3042
|
}
|
|
2991
3043
|
return (h(Host, null, this.renderToolbar(), h("div", { class: "mrd-table__scroll", style: { height: `${this.tableHeight}px` }, onScroll: this.handleScroll }, h("table", { class: "mrd-table__table", style: tableStyle }, h("thead", null, h("tr", null, this.columns.map((col, idx) => {
|
|
2992
|
-
var _a
|
|
3044
|
+
var _a;
|
|
2993
3045
|
const name = this.colName(col);
|
|
2994
3046
|
const isActive = this.sortField === name;
|
|
2995
3047
|
const isFiltered = this.activeFilters.has(name);
|
|
@@ -3000,7 +3052,7 @@ const MrdTable = class {
|
|
|
3000
3052
|
isActive ? `mrd-table__header--sorted-${this.sortDir}` : '',
|
|
3001
3053
|
isFiltered ? 'mrd-table__header--filtered' : '',
|
|
3002
3054
|
].filter(Boolean).join(' ');
|
|
3003
|
-
return (h("th", { class: cls, style: this.colWidths[idx] ? { width: `${this.colWidths[idx]}px` } : undefined, onClick: isInteractive ? ((e) => this.filterMode ? this.handleFilterOpen(col, e) : this.handleSortClick(col)) : undefined }, h("span", { class: "mrd-table__header-label" }, (
|
|
3055
|
+
return (h("th", { class: cls, style: this.colWidths[idx] ? { width: `${this.colWidths[idx]}px` } : undefined, onClick: isInteractive ? ((e) => this.filterMode ? this.handleFilterOpen(col, e) : this.handleSortClick(col)) : undefined }, h("span", { class: "mrd-table__header-label" }, (_a = col.label) !== null && _a !== void 0 ? _a : ''), isInteractive && isActive && (h("span", { class: "mrd-table__sort-icon", "aria-hidden": "true" }, this.sortDir === 'asc' ? '▲' : '▼')), isInteractive && !isActive && !this.filterMode && (h("span", { class: "mrd-table__sort-icon", "aria-hidden": "true" }, "\u21C5")), isInteractive && isFiltered && this.renderFilterIcon()));
|
|
3004
3056
|
}))), h("tbody", null, topSpacerHeight > 0 && (h("tr", { class: "mrd-table__spacer", style: { height: `${topSpacerHeight}px` } }, h("td", { colSpan: colCount }))), renderedRows, bottomSpacerHeight > 0 && (h("tr", { class: "mrd-table__spacer", style: { height: `${bottomSpacerHeight}px` } }, h("td", { colSpan: colCount })))), this.renderTotalsRow())), effectiveTotal === 0 && this.loadedPages.has(0) && (h("p", { class: "mrd-table__empty" }, t('no_results', this.locale))), effectiveTotal > 0 && this.renderFooter(undefined, effectiveTotal), this.renderFilterPopup(), this.renderTextblockModal()));
|
|
3005
3057
|
}
|
|
3006
3058
|
renderFilterIcon() {
|
|
@@ -3021,8 +3073,8 @@ const MrdTable = class {
|
|
|
3021
3073
|
"totalElements": [{
|
|
3022
3074
|
"totalElementsChanged": 0
|
|
3023
3075
|
}],
|
|
3024
|
-
"
|
|
3025
|
-
"
|
|
3076
|
+
"item": [{
|
|
3077
|
+
"itemChanged": 0
|
|
3026
3078
|
}]
|
|
3027
3079
|
}; }
|
|
3028
3080
|
};
|