more recipe editor

vue3/src/components/display/IngredientsTableRow.vue

@@ -7,11 +7,14 @@
             <td>{{ ingredient.amount }}</td>
             <td><span v-if="ingredient.unit != null">{{ ingredient.unit.name }}</span></td>
             <td><span v-if="ingredient.food != null">{{ ingredient.food.name }}</span></td>
-            <td>
+            <td v-if="showNotes">
                 <v-icon class="far fa-comment" v-if="ingredient.note != ''" @click="show_tooltip = !show_tooltip">
                     <v-tooltip v-model="show_tooltip" activator="parent" location="start">{{ ingredient.note }}</v-tooltip>
                 </v-icon>
             </td>
+            <td v-if="draggable">
+                <i class="fas fa-grip-lines drag-handle"></i>
+            </td>
         </template>
 
     </tr>
@@ -23,11 +26,19 @@ import {Ingredient} from "@/openapi";
 
 export default defineComponent({
     name: "IngredientsTableRow",
+    components: {},
     props: {
         ingredient: {
             type: {} as PropType<Ingredient>,
             required: true
-        }
+        },
+        showNotes: {
+            type: Boolean,
+            default: true
+        },
+        draggable: {
+            type: Boolean,
+        },
     },
     data() {
         return {