add some validation to row edit, better handle setting null cols with empty

resources/assets/js/base-setup.js

@@ -1,4 +1,4 @@
-//window._ = require('lodash');
+window._ = require('lodash');
 window.Popper = require('popper.js').default
 
 /**

resources/assets/js/components/RowEditor.vue

@@ -26,14 +26,16 @@
 
         <template v-if="row._editing">
           <td v-for="col in columns" class="pr-0">
-            <input v-model="row[col.id]" class="form-control" type="text">
+            <input v-model="row[col.id]" :class="['form-control', { 'is-invalid': row._errors && row._errors[col.id] }]"
+                   :title="(row._errors && row._errors[col.id]) ? row._errors[col.id][0] : null"
+                   type="text" @keyup.enter="toggleRowEditing(row._id)">
           </td>
         </template>
 
         <template v-else>
           <td v-for="col in columns">
             <span class="text-danger strike" title="Original value" v-if="isChanged(row, col.id)">{{row._orig[col.id]}}</span>
-            <span>{{ row[col.id] || '' }}</span>
+            <span>{{ row[col.id] }}</span>
             <v-icon v-if="isChanged(row, col.id)"
                     @click="revertCell(row, col.id)"
                     class="fa-undo text-danger pointer"
@@ -52,8 +54,6 @@
 </style>
 
 <script>
-import { merge } from 'lodash';
-
 export default {
   props: {
     route: String,
@@ -69,11 +69,13 @@ export default {
     busy (yes) {
       $('#draft-busy').css('opacity', yes ? 1 : 0)
     },
-    query (data, sucfn) {
+    query (data, sucfn, erfn) {
       this.busy(true)
       if (!sucfn) sucfn = ()=>{}
-      window.axios.post(this.route, data).then(sucfn).catch((e) => {
-        console.error(e)
+      if (!sucfn) erfn = ()=>{}
+      window.axios.post(this.route, data).then(sucfn).catch((error) => {
+        console.error(error.message)
+        erfn(error.response.data)
       }).then(() => {
         this.busy(false)
       })
@@ -94,6 +96,10 @@ export default {
         data: row
       }, (resp) => {
         this.$set(this.rows, resp.data._id, resp.data);
+      }, (er) => {
+        if (!_.isUndefined(er.errors)) {
+          this.$set(this.rows[row._id], '_errors', er.errors);
+        }
       })
     },
     toggleRowEditing(_id) {
@@ -127,7 +133,7 @@ export default {
       return row._changed.indexOf(colId) > -1
     },
     revertCell(row, colId) {
-      this.submitRowChange(merge({}, row, { [colId]: row._orig[colId] }))
+      this.submitRowChange(_.merge({}, row, { [colId]: row._orig[colId] }))
     }
   }
 }