mirror of
https://github.com/mealie-recipes/mealie.git
synced 2024-10-18 05:00:24 -07:00
fe17922bb8
* extended query filter to accept nested tables * decoupled timeline api from recipe slug * modified frontend to use simplified events api * fixed nested loop index ghosting * updated existing tests * gave mypy a snack * added tests for nested queries * fixed "last made" render error * decoupled recipe timeline from dialog * removed unused props * tweaked recipe get_all to accept ids * created group global timeline added new timeline page to sidebar reformatted the recipe timeline added vertical option to recipe card mobile * extracted timeline item into its own component * fixed apploader centering * added paginated scrolling to recipe timeline * added sort direction config fixed infinite scroll on dialog fixed hasMore var not resetting during instantiation * added sort direction to user preferences * updated API docs with new query filter feature * better error tracing * fix for recipe not found response * simplified recipe crud route for slug/id added test for fetching by slug/id * made query filter UUID validation clearer * moved timeline menu option below shopping lists --------- Co-authored-by: Hayden <64056131+hay-kot@users.noreply.github.com>
83 lines
1.8 KiB
Vue
83 lines
1.8 KiB
Vue
<template>
|
|
<div class="mx-auto my-3 justify-center" style="display: flex;">
|
|
<div style="display: inline;">
|
|
<v-progress-circular :width="size.width" :size="size.size" color="primary lighten-2" indeterminate>
|
|
<div class="text-center">
|
|
<v-icon :size="size.icon" color="primary lighten-2">
|
|
{{ $globals.icons.primary }}
|
|
</v-icon>
|
|
<div v-if="large" class="text-small">
|
|
<slot>
|
|
{{ small ? "" : waitingText }}
|
|
</slot>
|
|
</div>
|
|
</div>
|
|
</v-progress-circular>
|
|
<div v-if="!large" class="text-small">
|
|
<slot>
|
|
{{ small ? "" : waitingTextCalculated }}
|
|
</slot>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</template>
|
|
|
|
<script lang="ts">
|
|
import { computed, defineComponent, useContext } from "@nuxtjs/composition-api";
|
|
|
|
export default defineComponent({
|
|
props: {
|
|
loading: {
|
|
type: Boolean,
|
|
default: true,
|
|
},
|
|
small: {
|
|
type: Boolean,
|
|
default: false,
|
|
},
|
|
medium: {
|
|
type: Boolean,
|
|
default: true,
|
|
},
|
|
large: {
|
|
type: Boolean,
|
|
default: false,
|
|
},
|
|
waitingText: {
|
|
type: String,
|
|
default: undefined,
|
|
}
|
|
},
|
|
setup(props) {
|
|
const size = computed(() => {
|
|
if (props.small) {
|
|
return {
|
|
width: 2,
|
|
icon: 30,
|
|
size: 50,
|
|
};
|
|
} else if (props.large) {
|
|
return {
|
|
width: 4,
|
|
icon: 120,
|
|
size: 200,
|
|
};
|
|
}
|
|
return {
|
|
width: 3,
|
|
icon: 75,
|
|
size: 125,
|
|
};
|
|
});
|
|
|
|
const { i18n } = useContext();
|
|
const waitingTextCalculated = props.waitingText == null ? i18n.t("general.loading-recipes") : props.waitingText;
|
|
|
|
return {
|
|
size,
|
|
waitingTextCalculated,
|
|
};
|
|
},
|
|
});
|
|
</script>
|