108 lines
3.2 KiB
Svelte
108 lines
3.2 KiB
Svelte
<script lang="ts">
|
|
import { recipeFromMachineQuery, recipeFromServerQuery } from '$lib/core/stores/recipeStore';
|
|
import { onMount } from 'svelte';
|
|
import { MediaQuery } from 'svelte/reactivity';
|
|
import { get } from 'svelte/store';
|
|
|
|
import * as Dialog from '$lib/components/ui/dialog/index';
|
|
import RecipeDetail from './recipe-details/recipe-detail.svelte';
|
|
import { MenuStatus, matchMenuStatus } from '$lib/core/types/menuStatus';
|
|
|
|
import * as adb from '$lib/core/adb/adb';
|
|
|
|
let open = $state(false);
|
|
const isDesktop = new MediaQuery('(min-width: 768px)');
|
|
|
|
let currentData: any = $state();
|
|
|
|
let hasAlreadyTestBrewing: boolean = $state(false);
|
|
let hasPendingChange: boolean = $state(false);
|
|
let currentMenuStatus: MenuStatus = $state(MenuStatus.drafted);
|
|
|
|
const {
|
|
productCode,
|
|
refPage
|
|
}: {
|
|
productCode: string;
|
|
refPage: string;
|
|
} = $props();
|
|
|
|
async function onPendingChange(newChange: { target: string; value: any }) {
|
|
console.log('detect pending change', matchMenuStatus(currentData.MenuStatus));
|
|
hasPendingChange = true;
|
|
|
|
let originalMenuStatus = matchMenuStatus(currentData.MenuStatus);
|
|
|
|
// hasAlreadyTestBrewing =
|
|
// originalMenuStatus == MenuStatus.pendingOnline || originalMenuStatus == MenuStatus.ready;
|
|
|
|
//
|
|
|
|
// if (hasAlreadyTestBrewing) {
|
|
// currentMenuStatus = MenuStatus.pendingOnline;
|
|
// }
|
|
|
|
currentData.MenuStatus = MenuStatus.pendingOnline;
|
|
|
|
if (newChange.target === 'recipeList') {
|
|
// currentData.recipes = newChange.value;
|
|
//
|
|
// TODO: build into structure, flatten fields into 1 layer, strip off `id` (row id)
|
|
console.log('pending change recipe list', newChange);
|
|
}
|
|
|
|
// await adb.push('/sdcard/coffeevending/.curr.brewing.json', JSON.stringify(currentData));
|
|
//
|
|
//
|
|
//
|
|
// send data to some channel then if command `brew`, invoke `SetCurrentRecipeToMake`
|
|
//
|
|
}
|
|
|
|
onMount(() => {
|
|
//
|
|
if (refPage === 'brew') {
|
|
// fetch from store
|
|
let recipeDevSnapshot = get(recipeFromMachineQuery) ?? {};
|
|
let recipe01Snap = recipeDevSnapshot['recipe'];
|
|
if (recipe01Snap) {
|
|
currentData = recipe01Snap[productCode] ?? {};
|
|
if (currentData.MenuStatus) {
|
|
currentMenuStatus = matchMenuStatus(currentData.MenuStatus);
|
|
}
|
|
}
|
|
} else if (refPage === 'overview') {
|
|
let recipeServerSnapshot = get(recipeFromServerQuery) ?? {};
|
|
let recipe01Snap = recipeServerSnapshot['recipe'];
|
|
if (recipe01Snap) {
|
|
currentData = recipe01Snap[productCode] ?? {};
|
|
// console.log(`current data : ${JSON.stringify(Object.keys(recipe01Snap))}`);
|
|
if (currentData.MenuStatus) {
|
|
currentMenuStatus = matchMenuStatus(currentData.MenuStatus);
|
|
}
|
|
}
|
|
}
|
|
});
|
|
</script>
|
|
|
|
{#if isDesktop.current}
|
|
<Dialog.Root bind:open>
|
|
<Dialog.Trigger class="w-full text-start" onselect={(e) => e.preventDefault()}
|
|
>View</Dialog.Trigger
|
|
>
|
|
<Dialog.Content class="sm:max-w-3/4">
|
|
<Dialog.Header>
|
|
<Dialog.Title>Edit Recipe {productCode}</Dialog.Title>
|
|
<Dialog.Description
|
|
>Make changes to selected menu here. Click "save" when done or "test" for testing with
|
|
connected machine
|
|
</Dialog.Description>
|
|
</Dialog.Header>
|
|
|
|
<!-- render more -->
|
|
<RecipeDetail recipeData={currentData} {onPendingChange} {refPage} />
|
|
</Dialog.Content>
|
|
</Dialog.Root>
|
|
{:else}
|
|
<!-- TODO: handle case open on mobile? -->
|
|
{/if}
|