@fuentis/phoenix-ui 0.0.9-alpha.358 → 0.0.9-alpha.359
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.
|
@@ -2745,7 +2745,7 @@ class TableComponent {
|
|
|
2745
2745
|
// Inputs
|
|
2746
2746
|
set data(value) {
|
|
2747
2747
|
this.originalData = value ?? [];
|
|
2748
|
-
this.allData = [...
|
|
2748
|
+
this.allData = [...value];
|
|
2749
2749
|
this.totalRecords = this.allData.length;
|
|
2750
2750
|
this.loadLazyData({ first: 0, rows: 100 });
|
|
2751
2751
|
}
|
|
@@ -2765,37 +2765,41 @@ class TableComponent {
|
|
|
2765
2765
|
allData = [];
|
|
2766
2766
|
originalData = [];
|
|
2767
2767
|
tableData = [];
|
|
2768
|
-
selectedItems = signal([]);
|
|
2768
|
+
selectedItems = signal([]);
|
|
2769
2769
|
selectedColumns = [];
|
|
2770
2770
|
searchQuery = '';
|
|
2771
2771
|
bulkMode = false;
|
|
2772
2772
|
totalRecords = 0;
|
|
2773
2773
|
lastLoadedIndex = 0;
|
|
2774
|
-
// Enums & helpers
|
|
2775
2774
|
selectionTypeEnum = tableSelectionType;
|
|
2776
2775
|
columnTypeEnum = tableColumnType;
|
|
2777
2776
|
dateFormat;
|
|
2778
2777
|
currentFilters = {};
|
|
2779
2778
|
columnTypeMap = {};
|
|
2780
2779
|
ngOnChanges(changes) {
|
|
2781
|
-
// reset selection
|
|
2782
|
-
this.selectedItems.set([]);
|
|
2783
|
-
//
|
|
2784
|
-
if (this.columns?.length) {
|
|
2785
|
-
|
|
2786
|
-
? [...this.selectedColumnsInput]
|
|
2787
|
-
: [...this.columns];
|
|
2780
|
+
// reset selection
|
|
2781
|
+
this.selectedItems.set([]);
|
|
2782
|
+
// 1) mapiranje kolona i (odloženo) postavljanje selectedColumns
|
|
2783
|
+
if (this.columns?.length > 0) {
|
|
2784
|
+
// map za sortiranje/eksport
|
|
2788
2785
|
this.columnTypeMap = {};
|
|
2789
2786
|
for (const col of this.columns) {
|
|
2790
2787
|
this.columnTypeMap[col.field] = col.columnType;
|
|
2791
2788
|
}
|
|
2789
|
+
const nextSelected = this.selectedColumnsInput?.length ? this.selectedColumnsInput : this.columns;
|
|
2790
|
+
// ⬇️ Odloženo postavljanje reference (sprečava NG0100)
|
|
2791
|
+
Promise.resolve().then(() => {
|
|
2792
|
+
this.selectedColumns = [...nextSelected];
|
|
2793
|
+
this.cdr.markForCheck();
|
|
2794
|
+
});
|
|
2792
2795
|
}
|
|
2793
|
-
//
|
|
2796
|
+
// 2) default moreActions (takođe odloženo da ne menja vrednost tokom istog CD pasa)
|
|
2794
2797
|
if (!this.tableConfiguration?.moreActions) {
|
|
2795
|
-
this.tableConfiguration
|
|
2796
|
-
|
|
2797
|
-
moreActions: DEFAULT_MORE_ACTIONS
|
|
2798
|
-
|
|
2798
|
+
const cfg = this.tableConfiguration;
|
|
2799
|
+
Promise.resolve().then(() => {
|
|
2800
|
+
this.tableConfiguration = { ...cfg, moreActions: DEFAULT_MORE_ACTIONS };
|
|
2801
|
+
this.cdr.markForCheck();
|
|
2802
|
+
});
|
|
2799
2803
|
}
|
|
2800
2804
|
}
|
|
2801
2805
|
// Lazy load / sort
|
|
@@ -2818,7 +2822,8 @@ class TableComponent {
|
|
|
2818
2822
|
return 0;
|
|
2819
2823
|
});
|
|
2820
2824
|
}
|
|
2821
|
-
|
|
2825
|
+
const paged = sortedData.slice(first, first + rows);
|
|
2826
|
+
this.tableData = sortedData; // (ako hoćeš paging, stavi paged)
|
|
2822
2827
|
this.lastLoadedIndex = first + rows;
|
|
2823
2828
|
}
|
|
2824
2829
|
getComparableValue(val, field) {
|
|
@@ -2829,8 +2834,8 @@ class TableComponent {
|
|
|
2829
2834
|
return val;
|
|
2830
2835
|
if (typeof val === 'string') {
|
|
2831
2836
|
if (columnType === this.columnTypeEnum.DATE) {
|
|
2832
|
-
const
|
|
2833
|
-
return isNaN(
|
|
2837
|
+
const parsedDate = Date.parse(val);
|
|
2838
|
+
return isNaN(parsedDate) ? val.toLowerCase() : parsedDate;
|
|
2834
2839
|
}
|
|
2835
2840
|
return val.toLowerCase();
|
|
2836
2841
|
}
|
|
@@ -2845,10 +2850,10 @@ class TableComponent {
|
|
|
2845
2850
|
if (Array.isArray(val) && val.length > 0) {
|
|
2846
2851
|
return this.getComparableValue(val[0], field);
|
|
2847
2852
|
}
|
|
2848
|
-
const
|
|
2849
|
-
for (const
|
|
2850
|
-
if (val[
|
|
2851
|
-
return this.getComparableValue(val[
|
|
2853
|
+
const priorityFields = ['name', 'value', 'label', 'key', 'date'];
|
|
2854
|
+
for (const key of priorityFields) {
|
|
2855
|
+
if (val[key] !== undefined && val[key] !== null) {
|
|
2856
|
+
return this.getComparableValue(val[key], field);
|
|
2852
2857
|
}
|
|
2853
2858
|
}
|
|
2854
2859
|
for (const v of Object.values(val)) {
|
|
@@ -2863,33 +2868,39 @@ class TableComponent {
|
|
|
2863
2868
|
onSearch(query) {
|
|
2864
2869
|
const trimmed = (query ?? '').trim().toLowerCase();
|
|
2865
2870
|
this.searchQuery = trimmed;
|
|
2866
|
-
const
|
|
2871
|
+
const baseData = Object.keys(this.currentFilters).length > 0
|
|
2867
2872
|
? this.getFilteredData()
|
|
2868
2873
|
: this.originalData;
|
|
2869
2874
|
if (trimmed) {
|
|
2870
|
-
|
|
2875
|
+
const filtered = baseData.filter((item) => Object.values(item).some((value) => this.matchesQuery(value, trimmed)));
|
|
2876
|
+
this.allData = filtered;
|
|
2871
2877
|
}
|
|
2872
2878
|
else {
|
|
2873
|
-
this.allData = [...
|
|
2879
|
+
this.allData = [...baseData];
|
|
2874
2880
|
}
|
|
2875
2881
|
this.totalRecords = this.allData.length;
|
|
2876
2882
|
this.loadLazyData({ first: 0, rows: 100 });
|
|
2877
2883
|
}
|
|
2878
2884
|
getFilteredData() {
|
|
2879
|
-
return this.originalData.filter((item) =>
|
|
2880
|
-
|
|
2881
|
-
|
|
2882
|
-
|
|
2883
|
-
|
|
2884
|
-
|
|
2885
|
-
|
|
2886
|
-
|
|
2887
|
-
return
|
|
2888
|
-
|
|
2889
|
-
|
|
2890
|
-
|
|
2891
|
-
|
|
2892
|
-
|
|
2885
|
+
return this.originalData.filter((item) => {
|
|
2886
|
+
return Object.keys(this.currentFilters).every((key) => {
|
|
2887
|
+
const filterValue = this.currentFilters[key];
|
|
2888
|
+
if (!filterValue || (Array.isArray(filterValue) && filterValue.length === 0)) {
|
|
2889
|
+
return true;
|
|
2890
|
+
}
|
|
2891
|
+
const itemValue = this.getNestedValue(item, key);
|
|
2892
|
+
if (Array.isArray(filterValue)) {
|
|
2893
|
+
return filterValue.some((option) => {
|
|
2894
|
+
const optionKey = option?.key || option;
|
|
2895
|
+
return (itemValue?.toString().toLowerCase() === optionKey?.toString().toLowerCase());
|
|
2896
|
+
});
|
|
2897
|
+
}
|
|
2898
|
+
const singleFilterValue = filterValue?.key || filterValue;
|
|
2899
|
+
return singleFilterValue
|
|
2900
|
+
? itemValue?.toString().toLowerCase() === singleFilterValue.toString().toLowerCase()
|
|
2901
|
+
: true;
|
|
2902
|
+
});
|
|
2903
|
+
});
|
|
2893
2904
|
}
|
|
2894
2905
|
applyFilters(filters) {
|
|
2895
2906
|
const isEmpty = (v) => v === null ||
|
|
@@ -2939,8 +2950,11 @@ class TableComponent {
|
|
|
2939
2950
|
this.loadLazyData({ first: 0, rows: 100 });
|
|
2940
2951
|
}
|
|
2941
2952
|
isRowSelectable(event) {
|
|
2942
|
-
return typeof event.data?.canSelect === 'boolean'
|
|
2953
|
+
return typeof event.data?.canSelect === 'boolean'
|
|
2954
|
+
? event.data.canSelect
|
|
2955
|
+
: true;
|
|
2943
2956
|
}
|
|
2957
|
+
// get nested value by dot path
|
|
2944
2958
|
getNestedValue(obj, path) {
|
|
2945
2959
|
try {
|
|
2946
2960
|
if (obj && Object.prototype.hasOwnProperty.call(obj, path)) {
|
|
@@ -2963,6 +2977,7 @@ class TableComponent {
|
|
|
2963
2977
|
}
|
|
2964
2978
|
}
|
|
2965
2979
|
applyColumns(selected) {
|
|
2980
|
+
// odloži promenu reference da izbegne NG0100
|
|
2966
2981
|
const next = this.columns.filter((col) => selected.includes(col.field));
|
|
2967
2982
|
Promise.resolve().then(() => {
|
|
2968
2983
|
this.selectedColumns = next;
|
|
@@ -2974,19 +2989,19 @@ class TableComponent {
|
|
|
2974
2989
|
this.rowSelection.emit(rowData);
|
|
2975
2990
|
}
|
|
2976
2991
|
onSelectionChange(selected) {
|
|
2977
|
-
this.selectedItems.set(selected);
|
|
2992
|
+
this.selectedItems.set(selected);
|
|
2978
2993
|
this.bulkMode = selected.length > 0;
|
|
2979
2994
|
this.checkBoxSelection.emit(selected);
|
|
2980
2995
|
}
|
|
2981
2996
|
handleActionClick(event) {
|
|
2982
2997
|
if (event?.action?.key === 'EXPORT_PDF') {
|
|
2983
|
-
const
|
|
2984
|
-
exportRowsToPdf(this.selectedColumns, this.tableData, this.columnTypeMap, this.columnTypeEnum, (k) => this.translateService.instant(k),
|
|
2998
|
+
const file = this.tableConfiguration?.key ? `${this.tableConfiguration.key}.pdf` : 'table.pdf';
|
|
2999
|
+
exportRowsToPdf(this.selectedColumns, this.tableData, this.columnTypeMap, this.columnTypeEnum, (k) => this.translateService.instant(k), file);
|
|
2985
3000
|
return;
|
|
2986
3001
|
}
|
|
2987
3002
|
if (event?.action?.key === 'EXPORT_CSV') {
|
|
2988
|
-
const
|
|
2989
|
-
exportRowsToCsv(this.selectedColumns, this.tableData, this.columnTypeMap, this.columnTypeEnum, (k) => this.translateService.instant(k),
|
|
3003
|
+
const file = this.tableConfiguration?.key ? `${this.tableConfiguration.key}.csv` : 'table.csv';
|
|
3004
|
+
exportRowsToCsv(this.selectedColumns, this.tableData, this.columnTypeMap, this.columnTypeEnum, (k) => this.translateService.instant(k), file);
|
|
2990
3005
|
return;
|
|
2991
3006
|
}
|
|
2992
3007
|
this.actionClick.emit(event);
|
|
@@ -3009,7 +3024,7 @@ class TableComponent {
|
|
|
3009
3024
|
return false;
|
|
3010
3025
|
}
|
|
3011
3026
|
clearSelection() {
|
|
3012
|
-
this.selectedItems.set([]);
|
|
3027
|
+
this.selectedItems.set([]);
|
|
3013
3028
|
this.bulkMode = false;
|
|
3014
3029
|
}
|
|
3015
3030
|
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.14", ngImport: i0, type: TableComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
|