From 948eb9be3e4208a61c66820ed64b3517e9a52e48 Mon Sep 17 00:00:00 2001
From: vabene1111 <vabene1234@googlemail.com>
Date: Wed, 13 Jan 2021 20:49:04 +0100
Subject: [PATCH] keywords

---
 vue/src/apps/RecipeView/RecipeView.vue |  8 ++++++--
 vue/src/components/Keywords.vue        | 17 +++++++++++++++++
 vue/webpack-stats.json                 |  2 +-
 3 files changed, 24 insertions(+), 3 deletions(-)
 create mode 100644 vue/src/components/Keywords.vue

diff --git a/vue/src/apps/RecipeView/RecipeView.vue b/vue/src/apps/RecipeView/RecipeView.vue
index 64d3e5094..4a95e0d91 100644
--- a/vue/src/apps/RecipeView/RecipeView.vue
+++ b/vue/src/apps/RecipeView/RecipeView.vue
@@ -7,9 +7,11 @@
       </div>
     </div>
 
-    <!--TODO Tags -->
+    <div style="text-align: center">
+      <keywords :recipe="recipe"></keywords>
+    </div>
 
-    <div class="row">
+    <div class="row" style="margin-top: 8px">
       <div class="col-12" style="text-align: center">
         <i>{{ recipe.description }}</i>
       </div>
@@ -146,6 +148,7 @@ import ImageViewer from "@/components/ImageViewer";
 import Nutrition from "@/components/Nutrition";
 
 import moment from 'moment'
+import Keywords from "@/components/Keywords";
 
 Vue.prototype.moment = moment
 
@@ -164,6 +167,7 @@ export default {
     Step,
     RecipeContextMenu,
     Nutrition,
+    Keywords,
   },
   data() {
     return {
diff --git a/vue/src/components/Keywords.vue b/vue/src/components/Keywords.vue
new file mode 100644
index 000000000..53d4231e0
--- /dev/null
+++ b/vue/src/components/Keywords.vue
@@ -0,0 +1,17 @@
+<template>
+    <div v-if="recipe.keywords.length > 0">
+      <small :key="k.id" v-for="k in recipe.keywords" style="padding: 2px">
+        {{k.icon}} {{k.name}}
+      </small>
+    </div>
+</template>
+
+<script>
+
+export default {
+  name: 'Keywords',
+  props: {
+    recipe: Object,
+  },
+}
+</script>
diff --git a/vue/webpack-stats.json b/vue/webpack-stats.json
index 1bce99bf7..b0b8976d5 100644
--- a/vue/webpack-stats.json
+++ b/vue/webpack-stats.json
@@ -1 +1 @@
-{"status":"done","publicPath":"http://localhost:8080/","chunks":{"chunk-vendors":[{"name":"js/chunk-vendors.js","publicPath":"http://localhost:8080/js/chunk-vendors.js","path":"F:\\Developement\\Django\\recipes\\cookbook\\static\\vue\\js\\chunk-vendors.js"}],"recipe_view":[{"name":"js/recipe_view.js","publicPath":"http://localhost:8080/js/recipe_view.js","path":"F:\\Developement\\Django\\recipes\\cookbook\\static\\vue\\js\\recipe_view.js"},{"name":"recipe_view.053e29b2cace695f54ae.hot-update.js","publicPath":"http://localhost:8080/recipe_view.053e29b2cace695f54ae.hot-update.js","path":"F:\\Developement\\Django\\recipes\\cookbook\\static\\vue\\recipe_view.053e29b2cace695f54ae.hot-update.js"}]},"error":"ModuleError","message":"Module Error (from ./node_modules/eslint-loader/index.js):\n\nF:\\Developement\\Django\\recipes\\vue\\src\\components\\Ingredient.vue\n  4:41  error  Unexpected mutation of \"ingredient\" prop  vue/no-mutating-props\n\n✖ 1 problem (1 error, 0 warnings)\n"}
\ No newline at end of file
+{"status":"done","publicPath":"http://localhost:8080/","chunks":{"chunk-vendors":[{"name":"js/chunk-vendors.js","publicPath":"http://localhost:8080/js/chunk-vendors.js","path":"F:\\Developement\\Django\\recipes\\cookbook\\static\\vue\\js\\chunk-vendors.js"}],"recipe_view":[{"name":"js/recipe_view.js","publicPath":"http://localhost:8080/js/recipe_view.js","path":"F:\\Developement\\Django\\recipes\\cookbook\\static\\vue\\js\\recipe_view.js"},{"name":"recipe_view.6a32bc3201ad26dbc898.hot-update.js","publicPath":"http://localhost:8080/recipe_view.6a32bc3201ad26dbc898.hot-update.js","path":"F:\\Developement\\Django\\recipes\\cookbook\\static\\vue\\recipe_view.6a32bc3201ad26dbc898.hot-update.js"}]},"error":"ModuleError","message":"Module Error (from ./node_modules/eslint-loader/index.js):\n\nF:\\Developement\\Django\\recipes\\vue\\src\\components\\Keywords.vue\n  3:7  error  Elements in iteration expect to have 'v-bind:key' directives  vue/require-v-for-key\n\n✖ 1 problem (1 error, 0 warnings)\n"}
\ No newline at end of file