AmineTMIRI/frontend
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

bugfixing sorting correctly and lazy loading

Browse Source
This commit is contained in:
MuslemRahimi 2024-11-25 23:23:37 +01:00
parent 0199d656ee
commit 0ed5cf8d74
1 changed files with 19 additions and 15 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

34
src/lib/components/Table/Table.svelte
View File

@ -32,6 +32,7 @@
export let hideLastRow = false; export let hideLastRow = false;
let originalData = [...rawData]; // Unaltered copy of raw data
let ruleOfList = defaultList; let ruleOfList = defaultList;
const defaultRules = defaultList?.map((item) => item?.rule); const defaultRules = defaultList?.map((item) => item?.rule);
@ -310,13 +311,13 @@
async function handleScroll() { async function handleScroll() {
const scrollThreshold = document.body.offsetHeight * 0.8; // 80% of the website height const scrollThreshold = document.body.offsetHeight * 0.8; // 80% of the website height
const isBottom = window.innerHeight + window.scrollY >= scrollThreshold; const isBottom = window.innerHeight + window.scrollY >= scrollThreshold;
if (isBottom && stockList?.length !== rawData?.length) {
if (isBottom && stockList?.length !== originalData?.length) {
const nextIndex = stockList?.length; const nextIndex = stockList?.length;
const filteredNewResults = rawData?.slice(nextIndex, nextIndex + 50); const filteredNewResults = originalData?.slice(nextIndex, nextIndex + 50);
stockList = [...stockList, ...filteredNewResults]; stockList = [...stockList, ...filteredNewResults];
} }
} }
onMount(async () => { onMount(async () => {
// Initialize the download worker if not already done // Initialize the download worker if not already done
@ -455,21 +456,23 @@
// Cycle through 'none', 'asc', 'desc' for the clicked key // Cycle through 'none', 'asc', 'desc' for the clicked key
const orderCycle = ["none", "asc", "desc"]; const orderCycle = ["none", "asc", "desc"];
const currentOrderIndex = orderCycle.indexOf(
let originalData = rawData; sortOrders[key]?.order || "none",
);
const currentOrderIndex = orderCycle.indexOf(sortOrders[key].order); sortOrders[key] = {
sortOrders[key].order = ...(sortOrders[key] || {}),
orderCycle[(currentOrderIndex + 1) % orderCycle?.length]; order: orderCycle[(currentOrderIndex + 1) % orderCycle.length],
};
const sortOrder = sortOrders[key]?.order; const sortOrder = sortOrders[key]?.order;
// Reset to original data when 'none' and stop further sorting // Reset to original data when 'none' and stop further sorting
if (sortOrder === "none") { if (sortOrder === "none") {
stockList = [...originalData]?.slice(0, 50); // Reset to original data (spread to avoid mutation) originalData = [...rawData]; // Reset originalData to rawData
stockList = originalData?.slice(0, 50); // Reset displayed data
return; return;
} }
// Define a generic comparison function // Generic comparison function
const compareValues = (a, b) => { const compareValues = (a, b) => {
const { type } = sortOrders[key]; const { type } = sortOrders[key];
let valueA, valueB; let valueA, valueB;
@ -483,8 +486,8 @@
valueA = a[key]?.toUpperCase(); valueA = a[key]?.toUpperCase();
valueB = b[key]?.toUpperCase(); valueB = b[key]?.toUpperCase();
return sortOrder === "asc" return sortOrder === "asc"
? valueA?.localeCompare(valueB) ? valueA.localeCompare(valueB)
: valueB?.localeCompare(valueA); : valueB.localeCompare(valueA);
case "number": case "number":
default: default:
valueA = parseFloat(a[key]); valueA = parseFloat(a[key]);
@ -499,8 +502,9 @@
} }
}; };
// Sort using the generic comparison function // Sort and update the originalData and stockList
stockList = [...originalData].sort(compareValues)?.slice(0, 50); originalData = [...rawData].sort(compareValues);
stockList = originalData?.slice(0, 50); // Update the displayed data
}; };
$: charNumber = $screenWidth < 640 ? 15 : 20; $: charNumber = $screenWidth < 640 ? 15 : 20;