github/mealie
1
0
Fork 0
mirror of https://github.com/hay-kot/mealie.git synced 2025-08-23 06:45:22 -07:00
Code Issues Projects Releases Packages Wiki Activity Actions 12

fix shopping list item re-ordering

Browse source
This commit is contained in:
Michael Genson 2025-06-17 22:36:59 +00:00
commit 0db9e5b937
1 changed files with 19 additions and 16 deletions
Download patch file Download diff file Expand all files Collapse all files

35
frontend/pages/shopping-lists/[id].vue
View file

@ -197,7 +197,7 @@
:delay-on-touch-only="true" :delay-on-touch-only="true"
@start="loadingCounter += 1" @start="loadingCounter += 1"
@end="loadingCounter -= 1" @end="loadingCounter -= 1"
@update="updateIndexUncheckedByLabel(key.toString(), $event)" @update:modelValue="updateIndexUncheckedByLabel(key.toString(), $event)"
> >
<v-lazy <v-lazy
v-for="(item, index) in value" v-for="(item, index) in value"
@ -578,12 +578,19 @@ export default defineNuxtComponent({
checked: [] as ShoppingListItemOut[], checked: [] as ShoppingListItemOut[],
}); });
function sortCheckedItems(a: ShoppingListItemOut, b: ShoppingListItemOut) {
if (a.updatedAt! === b.updatedAt!) {
return ((a.position || 0) > (b.position || 0)) ? -1 : 1;
}
return a.updatedAt! < b.updatedAt! ? 1 : -1;
}
watch( watch(
() => shoppingList.value?.listItems, () => shoppingList.value?.listItems,
(items) => { (items) => {
listItems.unchecked = (items?.filter(item => !item.checked) ?? []); listItems.unchecked = (items?.filter(item => !item.checked) ?? []);
listItems.checked = (items?.filter(item => item.checked) listItems.checked = (items?.filter(item => item.checked)
.sort((a, b) => (a.updatedAt! < b.updatedAt! ? 1 : -1)) ?? []); .sort(sortCheckedItems) ?? []);
}, },
{ immediate: true }, { immediate: true },
); );
@ -1027,13 +1034,6 @@ export default defineNuxtComponent({
return; return;
} }
if (item.checked && shoppingList.value.listItems) {
const lst = shoppingList.value.listItems.filter(itm => itm.id !== item.id);
lst.push(item);
// make sure the item is at the end of the list with the other checked items
item.position = shoppingList.value.listItems.length;
}
// set a temporary updatedAt timestamp prior to refresh so it appears at the top of the checked items // set a temporary updatedAt timestamp prior to refresh so it appears at the top of the checked items
item.updatedAt = new Date().toISOString(); item.updatedAt = new Date().toISOString();
@ -1044,11 +1044,14 @@ export default defineNuxtComponent({
shoppingList.value.listItems[idx] = item; shoppingList.value.listItems[idx] = item;
} }
}); });
// Immediately update checked/unchecked arrays for UI
listItems.unchecked = shoppingList.value.listItems.filter(i => !i.checked);
listItems.checked = shoppingList.value.listItems.filter(i => i.checked)
.sort(sortCheckedItems);
} }
updateListItemOrder(); updateListItemOrder();
shoppingListItemActions.updateItem(item); updateListItems();
refresh();
} }
function deleteListItem(item: ShoppingListItemOut) { function deleteListItem(item: ShoppingListItemOut) {
@ -1134,10 +1137,8 @@ export default defineNuxtComponent({
} }
function updateIndexUnchecked(uncheckedItems: ShoppingListItemOut[]) { function updateIndexUnchecked(uncheckedItems: ShoppingListItemOut[]) {
if (shoppingList.value?.listItems) { listItems.unchecked = uncheckedItems;
// move the new unchecked items in front of the checked items listItems.checked = shoppingList.value?.listItems?.filter(item => item.checked) || [];
shoppingList.value.listItems = uncheckedItems.concat(listItems.checked);
}
// since the user has manually reordered the list, we should preserve this order // since the user has manually reordered the list, we should preserve this order
preserveItemOrder.value = true; preserveItemOrder.value = true;
@ -1163,7 +1164,9 @@ export default defineNuxtComponent({
preserveItemOrder.value = true; preserveItemOrder.value = true;
// save changes // save changes
return updateIndexUnchecked(allUncheckedItems); listItems.unchecked = allUncheckedItems;
listItems.checked = shoppingList.value?.listItems?.filter(item => item.checked) || [];
updateListItems();
} }
function deleteListItems(items: ShoppingListItemOut[]) { function deleteListItems(items: ShoppingListItemOut[]) {