Fix Inertia form helper to use nested objects

Belongs to inertiajs/pingcrm#99
charisma98 · Dec 27, 2020 · 5a660f1 · 5a660f1
1 parent 872aab9
commit 5a660f1
Show file tree

Hide file tree

Showing 5 changed files with 19 additions and 15 deletions.
diff --git a/app/javascript/Pages/Contacts/Edit.vue b/app/javascript/Pages/Contacts/Edit.vue
@@ -8,7 +8,7 @@
         Contacts
       </inertia-link>
       <span class="text-indigo-400 font-medium">/</span>
-      {{ form.first_name }} {{ form.last_name }}
+      {{ form.contact.first_name }} {{ form.contact.last_name }}
     </h1>
     <trashed-message
       v-if="contact.deleted_at"
@@ -56,7 +56,7 @@ import _ from 'lodash'
 export default {
   metaInfo() {
     return {
-      title: `${this.form.first_name} ${this.form.last_name}`,
+      title: `${this.form.contact.first_name} ${this.form.contact.last_name}`,
     }
   },
   components: {

diff --git a/app/javascript/Pages/Organizations/Edit.vue b/app/javascript/Pages/Organizations/Edit.vue
@@ -8,7 +8,7 @@
         Organizations
       </inertia-link>
       <span class="text-indigo-400 font-medium">/</span>
-      {{ form.name }}
+      {{ form.organization.name }}
     </h1>
     <trashed-message
       v-if="organization.deleted_at"
@@ -133,7 +133,7 @@ import _ from 'lodash'
 
 export default {
   metaInfo() {
-    return { title: this.form.name }
+    return { title: this.form.organization.name }
   },
   components: {
     Icon,

diff --git a/app/javascript/Pages/Users/Edit.vue b/app/javascript/Pages/Users/Edit.vue
@@ -9,7 +9,7 @@
           Users
         </inertia-link>
         <span class="text-indigo-400 font-medium">/</span>
-        {{ form.first_name }} {{ form.last_name }}
+        {{ form.user.first_name }} {{ form.user.last_name }}
       </h1>
       <img
         v-if="user.photo"
@@ -65,7 +65,7 @@ import TrashedMessage from '@/Shared/TrashedMessage'
 export default {
   metaInfo() {
     return {
-      title: `${this.form.first_name} ${this.form.last_name}`,
+      title: `${this.form.user.first_name} ${this.form.user.last_name}`,
     }
   },
   components: {
@@ -88,8 +88,10 @@ export default {
   data() {
     return {
       form: this.$inertia.form({
-        ...this.user,
-        photo: null,
+        user: {
+          ...this.user,
+          photo: null,
+        },
       }),
     }
   },

diff --git a/app/javascript/Pages/Users/Form.vue b/app/javascript/Pages/Users/Form.vue
@@ -2,33 +2,33 @@
   <form @submit.prevent="$emit('submit')">
     <div class="p-8 -mr-6 -mb-8 flex flex-wrap">
       <text-input
-        v-model="form.first_name"
+        v-model="form.user.first_name"
         :errors="form.errors.first_name"
         class="pr-6 pb-8 w-full lg:w-1/2"
         label="First name"
       />
       <text-input
-        v-model="form.last_name"
+        v-model="form.user.last_name"
         :errors="form.errors.last_name"
         class="pr-6 pb-8 w-full lg:w-1/2"
         label="Last name"
       />
       <text-input
-        v-model="form.email"
+        v-model="form.user.email"
         :errors="form.errors.email"
         class="pr-6 pb-8 w-full lg:w-1/2"
         label="Email"
       />
       <text-input
-        v-model="form.password"
+        v-model="form.user.password"
         :errors="form.errors.password"
         class="pr-6 pb-8 w-full lg:w-1/2"
         type="password"
         autocomplete="new-password"
         label="Password"
       />
       <select-input
-        v-model="form.owner"
+        v-model="form.user.owner"
         :errors="form.errors.owner"
         class="pr-6 pb-8 w-full lg:w-1/2"
         label="Owner"
@@ -41,7 +41,7 @@
         </option>
       </select-input>
       <file-input
-        v-model="form.photo"
+        v-model="form.user.photo"
         :errors="form.errors.photo"
         class="pr-6 pb-8 w-full lg:w-1/2"
         type="file"

diff --git a/app/javascript/Pages/Users/New.vue b/app/javascript/Pages/Users/New.vue
@@ -49,7 +49,9 @@ export default {
   remember: 'form',
   data() {
     return {
-      form: this.$inertia.form(this.user),
+      form: this.$inertia.form({
+        user: this.user,
+      }),
     }
   },
 }