Use temporary negative IDs for rows created in a draft Changeset

resources/assets/js/components/ColumnEditor.vue

@@ -61,20 +61,26 @@ Complex animated column editor for the table edit page
               <!-- Editable cells -->
               <td :style="tdWidthStyle('name')">
                 <input v-model="col.name"
-                       class="form-control"
+                       :class="['form-control', { 'is-invalid': col._errors && col._errors['name'] }]"
+                       :title="(col._errors && col._errors['name']) ? col._errors['name'][0] : null"
                        type="text">
               </td>
 
               <td :style="tdWidthStyle('type')">
                 <select v-model="col.type"
-                        class="form-control custom-select">
+                        :title="(col._errors && col._errors['type']) ? col._errors['type'][0] : null"
+                        :class="[
+                          'form-control',
+                          'custom-select',
+                          { 'is-invalid': col._errors && col._errors['type'] }]">
                   <option v-for="t in colTypes" :value="t">{{t}}</option>
                 </select>
               </td>
 
               <td :style="tdWidthStyle('title')">
                 <input v-model="col.title"
-                       class="form-control"
+                       :title="(col._errors && col._errors['title']) ? col._errors['title'][0] : null"
+                       :class="['form-control', { 'is-invalid': col._errors && col._errors['title'] }]"
                        type="text">
               </td>
             </template>
@@ -262,6 +268,7 @@ export default {
       }, (resp) => {
         this.$set(this.columns, n, resp.data)
       }, (er) => {
+        console.log("Col save error: ", er)
         if (!_.isUndefined(er.errors)) {
           this.$set(this.columns[n], '_errors', er.errors)
         }