mirror of
https://github.com/hay-kot/mealie.git
synced 2025-08-22 06:23:34 -07:00
Last Made
This commit is contained in:
parent
c67acbd5c5
commit
3b485d59f0
1 changed files with 156 additions and 179 deletions
|
@ -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>
|
||||||
|
|
Loading…
Add table
Add a link
Reference in a new issue