adds Template custom object, starts SlotSelect component

web/vue/src/components/RecipeDetails.vue

@@ -8,12 +8,7 @@
         </span>
       </a>
       <br class="is-hidden-mobile"/>
-      <a @click="$emit('add', item.id)"
-         class="has-text-success">
-        <span class="icon is-large">
-          <i class="mdi mdi-36px mdi-table-plus"></i>
-        </span>
-      </a>
+      <SlotSelect />
     </div>
     <div class="column">
       <h4 class="title">{{ item.title }}</h4>
@@ -35,9 +30,14 @@
 
 <script>
 import _, {categories} from './RecipeList.vue'
+import SlotSelect from './planner/SlotSelect.vue'
+
 
 export default {
   name: 'RecipeDetails',
+  components: {
+    SlotSelect,
+  },
   props: {
     item: {
       type: Object,