Add new page for adding a new room entry

client/src/components/rooms/AddRoomEntryButton.vue

@@ -1,29 +1,32 @@
 <template>
-  <div
+  <router-link
     class="add-room-entry-button"
     data-cy="add-room-entry-button"
-    @click="addRoomEntry"
+    :to="addRoomEntryRoute"
   >
     <plus-icon class="add-room-entry-button__icon" />
     <span class="add-room-entry-button__text">Beitrag erfassen</span>
-  </div>
+  </router-link>
 </template>
 
 <script>
+  import { ADD_ROOM_ENTRY_PAGE }  from '@/router/room.names';
   const PlusIcon = () => import(/* webpackChunkName: "icons" */'@/components/icons/PlusIcon');
 
   export default {
     props: ['parent'],
 
     components: {
-      PlusIcon
+      PlusIcon,
     },
 
-    methods: {
-      addRoomEntry() {
-        this.$store.dispatch('addRoomEntry', this.parent);
-      }
-    }
+    data() {
+      return {
+        addRoomEntryRoute: {
+          name: ADD_ROOM_ENTRY_PAGE,
+        },
+      };
+    },
   };
 </script>
 

client/src/pages/rooms/newRoomEntry.vue

@@ -0,0 +1,32 @@
+<template>
+  <content-block-form
+    :content-block="roomEntry"
+    :features="features"
+  />
+</template>
+
+<script>
+  import ContentBlockForm from '@/components/content-block-form/ContentBlockForm';
+  import {ROOMS_FEATURES} from '@/consts/features.consts';
+
+  export default {
+    components: {ContentBlockForm},
+
+    data() {
+      return {
+        features: ROOMS_FEATURES,
+        roomEntry: {
+          title: '',
+          contents: []
+        }
+      };
+    },
+  };
+
+</script>
+
+<style scoped lang="scss">
+  @import '~styles/helpers';
+
+
+</style>

client/src/router/room.names.js

@@ -1,2 +1,3 @@
 export const NEW_ROOM_PAGE = 'new-room';
 export const ROOMS_PAGE = 'rooms';
+export const ADD_ROOM_ENTRY_PAGE = 'add-room-entry';

client/src/router/room.routes.js

@@ -1,9 +1,10 @@
-import {NEW_ROOM_PAGE, ROOMS_PAGE} from '@/router/room.names';
+import {NEW_ROOM_PAGE, ROOMS_PAGE, ADD_ROOM_ENTRY_PAGE} from '@/router/room.names';
 
 const rooms = () => import(/* webpackChunkName: "rooms" */'@/pages/rooms/rooms');
 const newRoom = () => import(/* webpackChunkName: "rooms" */'@/pages/rooms/newRoom');
 const editRoom = () => import(/* webpackChunkName: "rooms" */'@/pages/rooms/editRoom');
 const room = () => import(/* webpackChunkName: "rooms" */'@/pages/rooms/room');
+const newRoomEntry = () => import(/* webpackChunkName: "rooms" */'@/pages/rooms/newRoomEntry');
 const moduleRoom = () => import(/* webpackChunkName: "rooms" */'@/pages/module/moduleRoom');
 
 export default [
@@ -11,6 +12,7 @@ export default [
   {path: '/new-room/', name: NEW_ROOM_PAGE, component: newRoom},
   {path: '/edit-room/:id', name: 'edit-room', component: editRoom, props: true},
   {path: '/room/:slug', name: 'room', component: room, props: true},
+  {path: '/room/:slug/add', name: ADD_ROOM_ENTRY_PAGE, component: newRoomEntry, props: true},
   {
     path: '/module-room/:slug',
     name: 'moduleRoom',