Column order saving to Changeset

resources/assets/js/components/ColumnEditor.vue

@@ -192,6 +192,7 @@ export default {
       newColNum: 0,
       columns: this.xColumns,
       colTypes: ['string', 'int', 'float', 'bool'],
+      debouncedSortUpdate: _.debounce(() => this.submitColOrder(), 350)
     }
   },
   methods: {
@@ -200,6 +201,14 @@ export default {
       query(this.route, data, sucfn, erfn)
     },
 
+    submitColOrder() {
+      let ids = this.columns.map((c) => c.id)
+      this.query ({
+        action: 'col.sort',
+        order: ids,
+      })
+    },
+
     colPos(col) {
       for (let n = 0; n < this.columns.length; n++) {
         if (this.columns[n].id == col.id) return n;
@@ -261,6 +270,8 @@ export default {
       // Put focus on the new field
       // For some reason, it loses it when moving down
       setTimeout(() => this.$refs[`col${pos2}-sort`][0].focus(), 0)
+
+      this.debouncedSortUpdate();
     },
 
     /** User started dragging a column */
@@ -368,6 +379,7 @@ export default {
       this.submitColChange(_.merge({}, col, {[cell]: col._orig[cell]}))
     },
 
+    /** compute styles for a field cell */
     tdWidthStyle(cell) {
       let w = 10;
       if (cell == 'name') w = '14'

resources/assets/js/udash.js

@@ -5,6 +5,7 @@ export { default as isUndefined } from 'lodash/isUndefined'
 export { default as merge } from 'lodash/merge'
 export { default as unset } from 'lodash/unset'
 export { default as isEmpty } from 'lodash/isEmpty'
+export { default as debounce } from 'lodash/debounce'
 
 function isDefined (x) {
   return typeof x !== 'undefined'