bhaveshpatel200 / vue3-datatable

vue3-datatable is a powerful component for creating dynamic and customizable data tables. It supports large amounts of data, sorting, pagination, and filtering and highly customizable
MIT License
134 stars 19 forks source link

Sort problem #22

Closed te-deum closed 9 months ago

te-deum commented 9 months ago

Hello,

I am using this plugin and notice some problems on sorting.

Here is an example :

The problem come from the sort function inside filteredRows function :

        // sort rows
        var collator = new Intl.Collator(undefined, {
-->         numeric: true,
            sensitivity: 'base',
        });
        const sortOrder = currentSortDirection.value === 'desc' ? -1 : 1;

        rows.sort((a: any, b: any): number => {
            const valA = currentSortColumn.value?.split('.').reduce((obj: any, key: string) => obj?.[key], a);
            const valB = currentSortColumn.value?.split('.').reduce((obj: any, key: string) => obj?.[key], b);

            return collator.compare(valA, valB) * sortOrder;
        });

Option numeric to true in Intl.Collator options is the origin of the problem. Initialize this to false change the sort order to the expected result. It may be better to set this option to true only when column.type === 'number'

        // sort rows
        var collator = new Intl.Collator(undefined, {
            numeric: props.columns.find(col => col.field == currentSortColumn.value)?.type === 'number',
            sensitivity: 'base',
        });

Regards.

bhaveshpatel200 commented 9 months ago

Hi te-deum,

Above issue has been solved in new version 1.1.4.