feat(table): Split computedItems into multiple functions (#1893)

gaaf · mosinve · commit bb1c55031e18 · 2018-06-16T17:05:11.000+07:00
* feat(table): Split computedItems into multiple functions

Don't do all the processing in one function so external users (parent) can
grab the items at various stages without having to reproduce all the
filtering/sorting/pagination logic.

For example a parent may want to have access to the filtered and sorted,
but not yet paginated set of items. With the split functions it can now
do something like this:
    const table = this.$refs.the-table
    let items = table.hasProvider ? table.localItems : table.items
    items = table.sortItems(table.filterItems(items))

This patch incorporates no functional changes.
diff --git a/src/components/table/table.js b/src/components/table/table.js
@@ -779,16 +779,6 @@ export default {
       })
     },
     computedItems () {
-      // Grab some props/data to ensure reactivity
-      const perPage = this.perPage
-      const currentPage = this.currentPage
-      const filter = this.filter
-      const sortBy = this.localSortBy
-      const sortDesc = this.localSortDesc
-      const sortCompare = this.sortCompare
-      const localFiltering = this.localFiltering
-      const localSorting = this.localSorting
-      const localPaging = this.localPaging
       let items = this.hasProvider ? this.localItems : this.items
       if (!items) {
         this.$nextTick(this._providerUpdate)
@@ -797,30 +787,49 @@ export default {
       // Array copy for sorting, filtering, etc.
       items = items.slice()
       // Apply local filter
-      if (filter && localFiltering) {
-        if (filter instanceof Function) {
-          items = items.filter(filter)
+      this.filteredItems = items = this.filterItems(items)
+      // Apply local sort
+      items = this.sortItems(items)
+      // Apply local pagination
+      items = this.paginateItems(items)
+      // Update the value model with the filtered/sorted/paginated data set
+      this.$emit('input', items)
+      return items
+    },
+    computedBusy () {
+      return this.busy || this.localBusy
+    }
+  },
+  methods: {
+    keys,
+    filterItems (items) {
+      if (this.localFiltering && this.filter) {
+        if (this.filter instanceof Function) {
+          return items.filter(this.filter)
+        }
+
+        let regex
+        if (this.filter instanceof RegExp) {
+          regex = this.filter
         } else {
-          let regex
-          if (filter instanceof RegExp) {
-            regex = filter
-          } else {
-            regex = new RegExp('.*' + filter + '.*', 'ig')
-          }
-          items = items.filter(item => {
-            const test = regex.test(recToString(item))
-            regex.lastIndex = 0
-            return test
-          })
+          regex = new RegExp('.*' + this.filter + '.*', 'ig')
         }
+
+        return items.filter(item => {
+          const test = regex.test(recToString(item))
+          regex.lastIndex = 0
+          return test
+        })
       }
-      if (localFiltering) {
-        // Make a local copy of filtered items to trigger filtered event
-        this.filteredItems = items.slice()
-      }
-      // Apply local Sort
+      return items
+    },
+    sortItems (items) {
+      const sortBy = this.localSortBy
+      const sortDesc = this.localSortDesc
+      const sortCompare = this.sortCompare
+      const localSorting = this.localSorting
       if (sortBy && localSorting) {
-        items = stableSort(items, (a, b) => {
+        return stableSort(items, (a, b) => {
           let ret = null
           if (typeof sortCompare === 'function') {
             // Call user provided sortCompare routine
@@ -834,21 +843,19 @@ export default {
           return (ret || 0) * (sortDesc ? -1 : 1)
         })
       }
+      return items
+    },
+    paginateItems (items) {
+      const currentPage = this.currentPage
+      const perPage = this.perPage
+      const localPaging = this.localPaging
       // Apply local pagination
-      if (Boolean(perPage) && localPaging) {
+      if (!!perPage && localPaging) {
         // Grab the current page of data (which may be past filtered items)
-        items = items.slice((currentPage - 1) * perPage, currentPage * perPage)
+        return items.slice((currentPage - 1) * perPage, currentPage * perPage)
       }
-      // Update the value model with the filtered/sorted/paginated data set
-      this.$emit('input', items)
       return items
     },
-    computedBusy () {
-      return this.busy || this.localBusy
-    }
-  },
-  methods: {
-    keys,
     fieldClasses (field) {
       return [
         field.sortable ? 'sorting' : '',
