FIX: fix the number table change to name table and the broke images

src/lib/component/AddProducts.svelte

@@ -13,6 +13,7 @@
 	let company = null;
 	let orderId = null;
 	let tableIdNum = null;
+	let tableName = null;
 	let kitchenNote = '';
 	let showKitchenNoteModal = false;
 	let selectedProduct = [];
@@ -23,6 +24,7 @@
 		orderId = Number(localStorage.getItem('order'));
 		tableIdNum = localStorage.getItem('table');
 		localStorage.setItem('typePage', 'false');
+		tableName = localStorage.getItem('tableName');
 	}
 
 	let selectedCategory = null;
@@ -190,7 +192,7 @@
 		>
 			<img src={arrow_back} alt="Voltar" class="h-5 w-5" />
 		</button>
-		<h1 class="text-2xl font-bold">Mesa {tableIdNum}</h1>
+		<h1 class="text-2xl font-bold">Mesa {tableName}</h1>
 	</div>
 
 	<div class="grid grid-cols-1 gap-6 lg:grid-cols-3">

src/lib/component/Commands.svelte

@@ -39,7 +39,7 @@
 				body: JSON.stringify({ company_id: companyId, table_id: tableId })
 			});
 			const result = await response.json();
-
+			
 			if (result.status === 'ok') {
 				orders = result.data.map((o) => ({
 					id: o.order_id,

src/lib/component/EndCommand.svelte

@@ -13,6 +13,7 @@
 	let company = null;
 	let orderId = null;
 	let tableIdNum = null;
+	let tableName = null;
 	let selectedPaymentMethod = '';
 
 	if (browser) {
@@ -21,6 +22,7 @@
 		orderId = Number(localStorage.getItem('order'));
 		localStorage.setItem('typePage', 'false');
 		tableIdNum = localStorage.getItem('table');
+		tableName = localStorage.getItem('tableName');
 	}
 	let selectedCategory = null;
 	let isPaymentModalOpen = false;
@@ -196,7 +198,7 @@
 		>
 			<img src={arrow_back} alt="Voltar" class="h-5 w-5" />
 		</button>
-		<h1 class="text-2xl font-bold">Mesa {tableIdNum}</h1>
+		<h1 class="text-2xl font-bold">Mesa {tableName}</h1>
 	</div>
 
 	<div class="grid grid-cols-1 gap-6 lg:grid-cols-3">

src/lib/component/Report.svelte

@@ -64,6 +64,7 @@
 		try {
 			const response = await fetch('https://bartender.mixtab.com.br/reports/get', requestOptions);
 			const result = await response.json();
+			console.log(result);
 
 			if (result.status === 'ok' && result.data) {
 				sales = result.data.orders.map((order) => ({

src/lib/component/Tables.svelte

@@ -96,9 +96,11 @@
 		if (table.status === 'FREE') {
 			await startOrder(tableId, tableNumber);
 			localStorage.setItem('table', table.id);
+			localStorage.setItem('tableName', table.number);
 			goto('/dashboard/commands');
 		}
 		localStorage.setItem('table', table.id);
+		localStorage.setItem('tableName', table.number);
 		goto('/dashboard/commands');
 	};
 
@@ -157,6 +159,7 @@
 		try {
 			const response = await fetch('https://bartender.mixtab.com.br/table/get', requestOptions);
 			const result = await response.json();
+			console.log(result);
 
 			if (result.status === 'ok') {
 				tables = result.data.map((d) => ({

src/lib/layout/SideBar.svelte

@@ -1,188 +1,189 @@
-<script>
-	import { page } from '$app/stores';
-	import { goto } from '$app/navigation';
-	import { get } from 'svelte/store';
-	import { onMount } from 'svelte';
-	import { browser } from '$app/environment';
-	import { logo_id, companyName_id } from '$lib/utils/store';
-	
-	// Import all SVG icons
-	import beer_green from '/static/assets/beer_green.svg';
-	import logout_icon from '/static/assets/logout_icon.svg';
-	import close_icon from '/static/assets/close_icon.svg';
-	import menu_icon from '/static/assets/menu_icon.svg';
-	import table_bar from '/static/assets/table_bar.svg';
-	import product_sell from '/static/assets/product_sell.svg';
-	import report_icon from '/static/assets/report_icon.svg';
-	import kitchen_icon from '/static/assets/kitchen_icon.svg';
-	import mananger from '/static/assets/mananger.svg';
-	let flag = null;
-	let company;
-
-	if (browser) {
-		flag = localStorage.getItem('flag');
-		company = localStorage.getItem('company');
-	}
-	$: navItems = [];
-
-	let isMobileMenuOpen = false;
-	// Create icon mapping object
-	const iconMap = {
-		table_bar,
-		product_sell,
-		report_icon,
-		kitchen_icon,
-		mananger
-	};
-
-	onMount(() => {
-		if (flag == 'waiter') {
-			navItems = [{ name: 'Mesas', path: '/dashboard/tables', icon: iconMap.table_bar }];
-		} else if (flag == 'admin') {
-			navItems = [
-				{ name: 'Mesas', path: '/dashboard/tables', icon: iconMap.table_bar },
-				{ name: 'Produtos', path: '/dashboard/products', icon: iconMap.product_sell },
-				{ name: 'Relatórios', path: '/dashboard/reports', icon: iconMap.report_icon },
-				{ name: 'Cozinha', path: '/dashboard/kitchen', icon: iconMap.kitchen_icon },
-				{ name: 'Gerenciar Usuários', path: '/dashboard/mananger', icon: iconMap.mananger }
-			];
-		} else if (flag == 'kitchen') {
-			navItems = [{ name: 'Cozinha', path: '/dashboard/kitchen', icon: iconMap.kitchen_icon }];
-		} else if (flag == 'cashier') {
-			navItems = [
-				{ name: 'Mesas', path: '/dashboard/tables', icon: iconMap.table_bar },
-				{ name: 'Relatórios', path: '/dashboard/reports', icon: iconMap.report_icon },
-				{ name: 'Cozinha', path: '/dashboard/kitchen', icon: iconMap.kitchen_icon }
-			];
-		}
-
-		switch (company) {
-			case '1':
-				logo_id.set(
-					'https://i.postimg.cc/bNNBcTZj/Whats-App-Image-2025-07-29-at-19-59-16-removebg-preview.png'
-				);
-				companyName_id.set('Bar do Ferlin');
-				break;
-			default:
-				logo_id.set(
-					'https://i.postimg.cc/7LPJk38W/beer-meal-24dp-EAC452-FILL0-wght400-GRAD0-opsz24.png'
-				);
-				companyName_id.set('Bar Management');
-				break;
-		}
-	});
-
-	function handleLogout() {
-		localStorage.removeItem('flag');
-		localStorage.removeItem('token');
-		localStorage.removeItem('tktime');
-		goto('/login');
-	}
-
-	function navigate(path) {
-		goto(path);
-		isMobileMenuOpen = false;
-	}
-
-	$: currentPath = get(page).url.pathname;
-</script>
-
-<div class="flex h-screen bg-gray-900 text-white">
-	<div class="hidden w-64 flex-col border-r border-gray-700 bg-gray-800 md:flex">
-		<div class=" flex h-16 items-center justify-center border-b border-gray-700">
-			<img src={$logo_id} alt="Logo" class="mr-2 h-8 w-8" />
-			<h1 class="text-xl font-semibold">{$companyName_id}</h1>
-		</div>
-		<div class="flex flex-1 flex-col overflow-y-auto">
-			<nav class="flex-1 space-y-2 px-2 py-4">
-				{#each navItems as item}
-					<button
-						class={`flex cursor-pointer items-center rounded-lg px-4 py-3 text-sm transition-colors ${
-							currentPath === item.path
-								? 'bg-gray-700 text-white'
-								: 'text-gray-300 hover:bg-gray-700'
-						}`}
-						onclick={() => goto(item.path)}
-					>
-						<img
-							src={item.icon}
-							class="h-6 w-6"
-							alt={item.name}
-						/>
-						<span class="ml-3">{item.name}</span>
-					</button>
-				{/each}
-			</nav>
-		</div>
-		<div class="border-t border-gray-700 p-4">
-			<button
-				class="flex w-full cursor-pointer items-center justify-center rounded-lg px-4 py-2 text-sm text-red-400 transition-colors hover:bg-gray-700"
-				onclick={handleLogout}
-			>
-				<img src={logout_icon} class="mr-2 h-5 w-5" alt="Logout" />
-				<span>Sair</span>
-			</button>
-		</div>
-	</div>
-
-	<!-- Header Mobile -->
-	<div class="flex flex-1 flex-col">
-		<header
-			class="sticky top-0 z-10 flex h-16 items-center justify-between border-b border-gray-700 bg-gray-800 px-6 md:hidden"
-		>
-			<div class="flex items-center">
-				<button
-					class="mr-4 rounded-md p-1 text-gray-400 hover:text-white"
-					onclick={() => (isMobileMenuOpen = !isMobileMenuOpen)}
-				>
-					{#if isMobileMenuOpen}
-						<img src={close_icon} class="h-6 w-6" alt="Fechar" />
-					{:else}
-						<img src={menu_icon} class="h-6 w-6" alt="Menu" />
-					{/if}
-				</button>
-				<div class="flex items-center">
-					<img src={$logo_id} class="mr-2 h-7 w-7 text-emerald-500" alt="Logo" />
-					<h1 class="text-lg font-semibold">Bar do Ferlin</h1>
-				</div>
-			</div>
-		</header>
-
-		<!-- Mobile Menu -->
-		{#if isMobileMenuOpen}
-			<div class="absolute inset-x-0 top-16 z-20 border-b border-gray-700 bg-gray-800 md:hidden">
-				<nav class="flex flex-col space-y-2 p-4">
-					{#each navItems as item}
-						<button
-							class={`flex items-center rounded-lg px-4 py-3 text-sm transition-colors ${
-								currentPath === item.path
-									? 'bg-gray-700 text-white'
-									: 'text-gray-300 hover:bg-gray-700'
-							}`}
-							onclick={() => navigate(item.path)}
-						>
-							<img
-								src="../src/lib/assets/{item.icon.toLowerCase()}.svg"
-								class="h-6 w-6"
-								alt={item.name}
-							/>
-							<span class="ml-3">{item.name}</span>
-						</button>
-					{/each}
-					<button
-						class="flex cursor-pointer items-center rounded-lg px-4 py-3 text-sm text-red-400 transition-colors hover:bg-gray-700"
-						onclick={handleLogout}
-					>
-						<img src={logout_icon} class="mr-2 h-5 w-5" alt="Logout" />
-						<span>Sair</span>
-					</button>
-				</nav>
-			</div>
-		{/if}
-
-		<!-- Main Content -->
-		<main class="flex-1 overflow-y-auto bg-gray-900 p-6 px-4 sm:px-6">
-			<slot />
-		</main>
-	</div>
-</div>
+<script>
+	import { page } from '$app/stores';
+	import { goto } from '$app/navigation';
+	import { get } from 'svelte/store';
+	import { onMount } from 'svelte';
+	import { browser } from '$app/environment';
+	import { logo_id, companyName_id } from '$lib/utils/store';
+	
+	// Import all SVG icons
+	import beer_green from '/static/assets/beer_green.svg';
+	import logout_icon from '/static/assets/logout_icon.svg';
+	import close_icon from '/static/assets/close_icon.svg';
+	import menu_icon from '/static/assets/menu_icon.svg';
+	import table_bar from '/static/assets/table_bar.svg';
+	import product_sell from '/static/assets/product_sell.svg';
+	import report_icon from '/static/assets/report_icon.svg';
+	import kitchen_icon from '/static/assets/kitchen_icon.svg';
+	import mananger from '/static/assets/mananger.svg';
+	let flag = null;
+	let company;
+
+	if (browser) {
+		flag = localStorage.getItem('flag');
+		company = localStorage.getItem('company');
+	}
+	$: navItems = [];
+
+	let isMobileMenuOpen = false;
+	// Create icon mapping object
+	const iconMap = {
+		table_bar,
+		product_sell,
+		report_icon,
+		kitchen_icon,
+		mananger
+	};
+
+	onMount(() => {
+		if (flag == 'waiter') {
+			navItems = [{ name: 'Mesas', path: '/dashboard/tables', icon: iconMap.table_bar }, { name: 'Cozinha', path: '/dashboard/kitchen', icon: iconMap.kitchen_icon }];
+			
+		} else if (flag == 'admin') {
+			navItems = [
+				{ name: 'Mesas', path: '/dashboard/tables', icon: iconMap.table_bar },
+				{ name: 'Produtos', path: '/dashboard/products', icon: iconMap.product_sell },
+				{ name: 'Relatórios', path: '/dashboard/reports', icon: iconMap.report_icon },
+				{ name: 'Cozinha', path: '/dashboard/kitchen', icon: iconMap.kitchen_icon },
+				{ name: 'Gerenciar Usuários', path: '/dashboard/mananger', icon: iconMap.mananger }
+			];
+		} else if (flag == 'kitchen') {
+			navItems = [{ name: 'Cozinha', path: '/dashboard/kitchen', icon: iconMap.kitchen_icon }];
+		} else if (flag == 'cashier') {
+			navItems = [
+				{ name: 'Mesas', path: '/dashboard/tables', icon: iconMap.table_bar },
+				{ name: 'Relatórios', path: '/dashboard/reports', icon: iconMap.report_icon },
+				{ name: 'Cozinha', path: '/dashboard/kitchen', icon: iconMap.kitchen_icon }
+			];
+		}
+
+		switch (company) {
+			case '1':
+				logo_id.set(
+					'https://i.postimg.cc/bNNBcTZj/Whats-App-Image-2025-07-29-at-19-59-16-removebg-preview.png'
+				);
+				companyName_id.set('Bar do Ferlin');
+				break;
+			default:
+				logo_id.set(
+					'https://i.postimg.cc/7LPJk38W/beer-meal-24dp-EAC452-FILL0-wght400-GRAD0-opsz24.png'
+				);
+				companyName_id.set('Bar Management');
+				break;
+		}
+	});
+
+	function handleLogout() {
+		localStorage.removeItem('flag');
+		localStorage.removeItem('token');
+		localStorage.removeItem('tktime');
+		goto('/login');
+	}
+
+	function navigate(path) {
+		goto(path);
+		isMobileMenuOpen = false;
+	}
+
+	$: currentPath = get(page).url.pathname;
+</script>
+
+<div class="flex h-screen bg-gray-900 text-white">
+	<div class="hidden w-64 flex-col border-r border-gray-700 bg-gray-800 md:flex">
+		<div class=" flex h-16 items-center justify-center border-b border-gray-700">
+			<img src={$logo_id} alt="Logo" class="mr-2 h-8 w-8" />
+			<h1 class="text-xl font-semibold">{$companyName_id}</h1>
+		</div>
+		<div class="flex flex-1 flex-col overflow-y-auto">
+			<nav class="flex-1 space-y-2 px-2 py-4">
+				{#each navItems as item}
+					<button
+						class={`flex cursor-pointer items-center rounded-lg px-4 py-3 text-sm transition-colors ${
+							currentPath === item.path
+								? 'bg-gray-700 text-white'
+								: 'text-gray-300 hover:bg-gray-700'
+						}`}
+						onclick={() => goto(item.path)}
+					>
+						<img
+							src={item.icon}
+							class="h-6 w-6"
+							alt={item.name}
+						/>
+						<span class="ml-3">{item.name}</span>
+					</button>
+				{/each}
+			</nav>
+		</div>
+		<div class="border-t border-gray-700 p-4">
+			<button
+				class="flex w-full cursor-pointer items-center justify-center rounded-lg px-4 py-2 text-sm text-red-400 transition-colors hover:bg-gray-700"
+				onclick={handleLogout}
+			>
+				<img src={logout_icon} class="mr-2 h-5 w-5" alt="Logout" />
+				<span>Sair</span>
+			</button>
+		</div>
+	</div>
+
+	<!-- Header Mobile -->
+	<div class="flex flex-1 flex-col">
+		<header
+			class="sticky top-0 z-10 flex h-16 items-center justify-between border-b border-gray-700 bg-gray-800 px-6 md:hidden"
+		>
+			<div class="flex items-center">
+				<button
+					class="mr-4 rounded-md p-1 text-gray-400 hover:text-white"
+					onclick={() => (isMobileMenuOpen = !isMobileMenuOpen)}
+				>
+					{#if isMobileMenuOpen}
+						<img src={close_icon} class="h-6 w-6" alt="Fechar" />
+					{:else}
+						<img src={menu_icon} class="h-6 w-6" alt="Menu" />
+					{/if}
+				</button>
+				<div class="flex items-center">
+					<img src={$logo_id} class="mr-2 h-7 w-7 text-emerald-500" alt="Logo" />
+					<h1 class="text-lg font-semibold">Bar do Ferlin</h1>
+				</div>
+			</div>
+		</header>
+
+		<!-- Mobile Menu -->
+		{#if isMobileMenuOpen}
+			<div class="absolute inset-x-0 top-16 z-20 border-b border-gray-700 bg-gray-800 md:hidden">
+				<nav class="flex flex-col space-y-2 p-4">
+					{#each navItems as item}
+						<button
+							class={`flex items-center rounded-lg px-4 py-3 text-sm transition-colors ${
+								currentPath === item.path
+									? 'bg-gray-700 text-white'
+									: 'text-gray-300 hover:bg-gray-700'
+							}`}
+							onclick={() => navigate(item.path)}
+						>
+							<img
+								src={item.icon}
+								class="h-6 w-6"
+								alt={item.name}
+							/>
+							<span class="ml-3">{item.name}</span>
+						</button>
+					{/each}
+					<button
+						class="flex cursor-pointer items-center rounded-lg px-4 py-3 text-sm text-red-400 transition-colors hover:bg-gray-700"
+						onclick={handleLogout}
+					>
+						<img src={logout_icon} class="mr-2 h-5 w-5" alt="Logout" />
+						<span>Sair</span>
+					</button>
+				</nav>
+			</div>
+		{/if}
+
+		<!-- Main Content -->
+		<main class="flex-1 overflow-y-auto bg-gray-900 p-6 px-4 sm:px-6">
+			<slot />
+		</main>
+	</div>
+</div>