Last Made

This commit is contained in:
Kuchenpirat 2025-07-30 11:53:37 +00:00
commit 3b485d59f0

View file

@ -30,11 +30,11 @@
offset-y offset-y
max-width="290px" max-width="290px"
> >
<template #activator="{ props }"> <template #activator="{ props: activatorProps }">
<v-text-field <v-text-field
v-model="newTimelineEventTimestampString" v-model="newTimelineEventTimestampString"
:prepend-icon="$globals.icons.calendar" :prepend-icon="$globals.icons.calendar"
v-bind="props" v-bind="activatorProps"
readonly readonly
/> />
</template> </template>
@ -87,12 +87,12 @@
<div v-if="lastMadeReady" class="d-flex justify-center flex-wrap"> <div v-if="lastMadeReady" class="d-flex justify-center flex-wrap">
<v-row no-gutters class="d-flex flex-wrap align-center" style="font-size: larger"> <v-row no-gutters class="d-flex flex-wrap align-center" style="font-size: larger">
<v-tooltip location="bottom"> <v-tooltip location="bottom">
<template #activator="{ props }"> <template #activator="{ props: tooltipProps }">
<v-btn <v-btn
rounded rounded
variant="outlined" variant="outlined"
size="x-large" size="x-large"
v-bind="props" v-bind="tooltipProps"
style="border-color: rgb(var(--v-theme-primary));" style="border-color: rgb(var(--v-theme-primary));"
@click="madeThisDialog = true" @click="madeThisDialog = true"
> >
@ -117,7 +117,7 @@
</div> </div>
</template> </template>
<script lang="ts"> <script setup lang="ts">
import { whenever } from "@vueuse/core"; import { whenever } from "@vueuse/core";
import { useUserApi } from "~/composables/api"; import { useUserApi } from "~/composables/api";
import { alert } from "~/composables/use-toast"; import { alert } from "~/composables/use-toast";
@ -125,15 +125,11 @@ import { useHouseholdSelf } from "~/composables/use-households";
import type { Recipe, RecipeTimelineEventIn, RecipeTimelineEventOut } from "~/lib/api/types/recipe"; import type { Recipe, RecipeTimelineEventIn, RecipeTimelineEventOut } from "~/lib/api/types/recipe";
import type { VForm } from "~/types/auto-forms"; import type { VForm } from "~/types/auto-forms";
export default defineNuxtComponent({ const props = defineProps<{ recipe: Recipe }>();
props: { const emit = defineEmits<{
recipe: { eventCreated: [event: RecipeTimelineEventOut];
type: Object as () => Recipe, }>();
required: true,
},
},
emits: ["eventCreated"],
setup(props, context) {
const madeThisDialog = ref(false); const madeThisDialog = ref(false);
const userApi = useUserApi(); const userApi = useUserApi();
const { household } = useHouseholdSelf(); const { household } = useHouseholdSelf();
@ -198,10 +194,11 @@ export default defineNuxtComponent({
newTimelineEventImagePreviewUrl.value = URL.createObjectURL(fileObject); newTimelineEventImagePreviewUrl.value = URL.createObjectURL(fileObject);
} }
const state = reactive({ datePickerMenu: false, madeThisFormLoading: false }); const datePickerMenu = ref(false);
const madeThisFormLoading = ref(false);
function resetMadeThisForm() { function resetMadeThisForm() {
state.madeThisFormLoading = false; madeThisFormLoading.value = false;
newTimelineEvent.value.eventMessage = ""; newTimelineEvent.value.eventMessage = "";
newTimelineEvent.value.timestamp = undefined; newTimelineEvent.value.timestamp = undefined;
@ -215,7 +212,7 @@ export default defineNuxtComponent({
return; return;
} }
state.madeThisFormLoading = true; madeThisFormLoading.value = true;
newTimelineEvent.value.recipeId = props.recipe.id; newTimelineEvent.value.recipeId = props.recipe.id;
// Note: $auth.user is now a ref // Note: $auth.user is now a ref
@ -279,26 +276,6 @@ export default defineNuxtComponent({
} }
resetMadeThisForm(); resetMadeThisForm();
context.emit("eventCreated", newEvent); emit("eventCreated", newEvent);
} }
return {
...toRefs(state),
domMadeThisForm,
madeThisDialog,
firstDayOfWeek,
newTimelineEvent,
newTimelineEventImage,
newTimelineEventImagePreviewUrl,
newTimelineEventTimestamp,
newTimelineEventTimestampString,
lastMade,
lastMadeReady,
createTimelineEvent,
clearImage,
uploadImage,
updateUploadedImage,
};
},
});
</script> </script>