Update ListDetailPage to change item quantity type from number to string; enhance logging for API calls and component lifecycle events for better debugging.

This commit is contained in:
mohamad 2025-05-08 22:53:38 +02:00
parent e484c9e9a8
commit 8b6ddb91f8

View File

@ -198,7 +198,7 @@ import { useQuasar, QFile } from 'quasar';
interface Item {
id: number;
name: string;
quantity?: number | undefined;
quantity?: string | undefined;
is_complete: boolean;
version: number;
updating?: boolean;
@ -234,9 +234,9 @@ const pollingInterval = ref<ReturnType<typeof setInterval> | undefined>(undefine
const lastListUpdate = ref<string | null>(null);
const lastItemUpdate = ref<string | null>(null);
const newItem = ref<{ name: string; quantity?: number }>({ name: '' });
const newItem = ref<{ name: string; quantity?: string }>({ name: '' });
const editingItemName = ref('');
const editingItemQuantity = ref<number | undefined>(undefined);
const editingItemQuantity = ref<string | undefined>(undefined);
// OCR related state
const showOcrDialog = ref(false);
@ -257,10 +257,12 @@ const itemNameInput = ref<{ focus: () => void } | null>(null);
const fetchListDetails = async () => {
loading.value = true;
error.value = null;
console.log('Fetching list details for ID:', route.params.id);
try {
const response = await apiClient.get(
API_ENDPOINTS.LISTS.BY_ID(String(route.params.id))
);
console.log('List details response:', response.data);
list.value = response.data as List;
lastListUpdate.value = response.data.updated_at;
// Find the latest item update time
@ -329,7 +331,10 @@ const onAddItem = async () => {
try {
const response = await apiClient.post(
API_ENDPOINTS.LISTS.ITEMS(String(list.value.id)),
newItem.value
{
name: newItem.value.name,
quantity: newItem.value.quantity?.toString()
}
);
list.value.items.push(response.data as Item);
newItem.value = { name: '' };
@ -352,7 +357,7 @@ const updateItem = async (item: Item) => {
API_ENDPOINTS.LISTS.ITEM(String(list.value.id), String(item.id)),
{
name: editingItemName.value,
quantity: editingItemQuantity.value,
quantity: editingItemQuantity.value?.toString(),
completed: item.is_complete,
version: item.version,
}
@ -418,11 +423,11 @@ const addOcrItems = async () => {
for (const item of ocrItems.value) {
if (!item.name) continue;
const response = await apiClient.post<Item>(
API_ENDPOINTS.LISTS.ITEMS(list.value.id),
{ name: item.name, quantity: 1 }
const response = await apiClient.post(
API_ENDPOINTS.LISTS.ITEMS(String(list.value.id)),
{ name: item.name, quantity: "1" }
);
list.value.items.push(response.data);
list.value.items.push(response.data as Item);
}
$q.notify({
@ -478,7 +483,7 @@ const deleteItem = async (item: Item) => {
item.deleting = true;
try {
await apiClient.delete(
API_ENDPOINTS.LISTS.ITEM(list.value.id.toString(), item.id.toString())
API_ENDPOINTS.LISTS.ITEM(String(list.value.id), String(item.id))
);
const index = list.value.items.findIndex((i) => i.id === item.id);
if (index !== -1) {
@ -496,6 +501,12 @@ const deleteItem = async (item: Item) => {
// Add keyboard event listeners
onMounted(() => {
console.log('Component mounted, route params:', route.params);
if (!route.params.id) {
console.error('No list ID found in route params');
error.value = 'No list ID provided';
return;
}
void fetchListDetails().then(() => {
startPolling();
});