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