POST a session to Drupal

src/App.vue

@@ -2,7 +2,7 @@
   <div id="app" class="antialiased min-h-screen font-sans bg-gray-100 text-black p-12">
     <div class="w-full max-w-2xl mx-auto">
       <accepted-sessions-list :sessions="sortedSessions" />
-      <session-form @submit="addSession($event)"></session-form>
+      <session-form></session-form>
     </div>
   </div>
 </template>
@@ -39,12 +39,6 @@ export default {
       })
   },
 
-  methods: {
-    addSession: function (attributes) {
-      this.sessions.push({attributes})
-    }
-  },
-
   computed: {
     sortedSessions: function () {
       return _(this.sessions).sortBy(session => {

src/components/SessionForm.vue

@@ -27,17 +27,45 @@ export default {
       form: {
         body: '',
         title: '',
-        field_session_status: 'accepted'
+        field_session_status: 'accepted',
+        field_session_type: 'full',
       }
     }
   },
 
   methods: {
     submit () {
-      this.$emit('submit', _.clone(this.form))
+      const uuid = '11dad4c2-baa8-4fb2-97c6-12e1ce925806' // User 1
 
-      this.form.body = ''
+      const data = {
-      this.form.title = ''
+        type: 'node--session',
+        attributes: this.form,
+        relationships: {
+          "field_speakers": {
+            "data": {
+              "type": "user--user",
+              "id": uuid
+            }
+          },
+        }
+      }
+
+      axios({
+        method: 'post',
+        url: 'http://drupaltestcamp.docksal/jsonapi/node/session',
+        data: { data },
+        headers: {
+          'Accept': 'application/vnd.api+json',
+          'Content-Type': 'application/vnd.api+json',
+        }
+      })
+        .then(({ data }) => {
+          this.form.body = ''
+          this.form.title = ''
+        })
+        .catch(function (error) {
+          console.log(error)
+        });
     }
   }
 }