Docker/mealie
Docker/mealie
1
0
Fork 0
mirror of https://github.com/mealie-recipes/mealie.git synced 2025-07-26 00:29:43 +02:00
Code Issues Releases Activity

Rewrite Recipe Editor Buttons Bar (#482)

Browse source 
* rewrite editor button row

* add context menu items to recipe page

Co-authored-by: hay-kot <hay-kot@pm.me>
This commit is contained in:
Hayden 2021-06-10 18:32:03 -08:00 • committed by GitHub
parent c175c8e9a0
commit ead02737ab
No known key found for this signature in database
GPG key ID: 4AEE18F83AFDEB23
5 changed files with 221 additions and 116 deletions
Download patch file Download diff file Expand all files Collapse all files

38
frontend/src/pages/Recipe/ViewRecipe.vue
View file

@ -6,7 +6,7 @@
<NoRecipe v-else-if="loadFailed" />
<v-card v-else-if="!loadFailed" id="myRecipe" class="d-print-none">
<v-img
:height="hideImage ? '40' : imageHeight"
:height="hideImage ? '50' : imageHeight"
@error="hideImage = true"
:src="getImage(recipeDetails.slug)"
class="d-print-none"
@ -20,17 +20,20 @@
:performTime="recipeDetails.performTime"
/>
</v-img>
<EditorButtonRow
<RecipePageActionMenu
:slug="recipeDetails.slug"
:name="recipeDetails.name"
v-if="loggedIn"
:open="showIcons"
@json="jsonEditor = true"
@editor="
@close="form = false"
@json="jsonEditor = !jsonEditor"
@edit="
jsonEditor = false;
form = true;
"
@save="saveRecipe"
@delete="deleteRecipe"
class="sticky"
class="ml-auto"
/>
<RecipeViewer v-if="!form" :recipe="recipeDetails" />
@ -42,7 +45,13 @@
height="1500px"
:options="jsonEditorOptions"
/>
<RecipeEditor v-else v-model="recipeDetails" ref="recipeEditor" @upload="getImageFile" />
<RecipeEditor
v-else
v-model="recipeDetails"
:class="$vuetify.breakpoint.xs ? 'mt-5' : undefiend"
ref="recipeEditor"
@upload="getImageFile"
/>
</v-card>
<CommentsSection
class="mt-2 d-print-none"
@ -56,6 +65,7 @@
</template>
<script>
import RecipePageActionMenu from "@/components/Recipe/RecipePageActionMenu.vue";
import { api } from "@/api";
import FavoriteBadge from "@/components/Recipe/FavoriteBadge";
import VJsoneditor from "v-jsoneditor";
@ -63,7 +73,6 @@ import RecipeViewer from "@/components/Recipe/RecipeViewer";
import PrintView from "@/components/Recipe/PrintView";
import RecipeEditor from "@/components/Recipe/RecipeEditor";
import RecipeTimeCard from "@/components/Recipe/RecipeTimeCard.vue";
import EditorButtonRow from "@/components/Recipe/EditorButtonRow.vue";
import NoRecipe from "@/components/Fallbacks/NoRecipe";
import { user } from "@/mixins/user";
import { router } from "@/routes";
@ -74,8 +83,8 @@ export default {
VJsoneditor,
RecipeViewer,
RecipeEditor,
EditorButtonRow,
RecipeTimeCard,
RecipePageActionMenu,
PrintView,
NoRecipe,
FavoriteBadge,
@ -126,15 +135,13 @@ export default {
this.jsonEditor = false;
this.form = this.$route.query.edit === "true" && this.loggedIn;
if (this.$route.query.print) {
this.printPage();
this.$router.push(this.$route.path);
}
this.checkPrintRecipe();
},
watch: {
$route: function () {
this.getRecipeDetails();
this.checkPrintRecipe();
},
},
@ -166,6 +173,13 @@ export default {
},
},
methods: {
checkPrintRecipe() {
if (this.$route.query.print) {
this.printPage();
this.$router.push(this.$route.path);
this.$route.query.print = null;
}
},
getImageFile(fileObject) {
this.fileObject = fileObject;
this.saveImage();