Revert "refactored ingredient components"

This reverts commit 9f51b9fd16.

vue/src/components/Ingredient.vue

@@ -0,0 +1,48 @@
+<template>
+    <tr>
+      <td>
+        <input type="checkbox">
+      </td>
+      <td>
+        <span v-if="ingredient.amount !== 0">{{ calculateAmount(ingredient.amount) }}</span>
+      </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>
+        <div v-if="ingredient.note">
+          <span v-b-popover.hover="ingredient.note"
+                    class="d-print-none"> <i class="far fa-comment"></i>
+          </span>
+
+          <div class="d-none d-print-block">
+            <i class="far fa-comment-alt"></i> {{ ingredient.note }}
+          </div>
+        </div>
+      </td>
+    </tr>
+</template>
+
+<script>
+
+import {calculateAmount} from "@/utils/utils";
+
+export default {
+  name: 'Ingredient',
+  props: {
+    ingredient: Object,
+    servings: {
+      type: Number,
+      default: 1,
+    }
+  },
+  methods: {
+    calculateAmount: function (x) {
+      return calculateAmount(x, this.servings)
+    }
+  }
+}
+</script>