[refactor] extract reusable code or utils into _mixins/ or _utils

Ken Berkeley · Ken Berkeley · commit 4161ac034255 · 2017-09-18T15:31:48.000+08:00
diff --git a/dist/min.js b/dist/min.js
diff --git a/doc/en/details/README.md b/doc/en/details/README.md
@@ -6,25 +6,23 @@ The source tree [`src/`](https://github.com/OneWayTech/vue2-datatable/tree/maste
 
 ```
 src/
+ ├─ _mixins/
+ ├─ _utils/
  ├─ HeaderSettings/
  │   ├─ ColumnGroup.vue
  │   └─ index.vue
  ├─ MainTable
  │   ├─ HeadSort.vue
  │   ├─ index.vue
  │   ├─ MultiSelect.vue
- │   ├─ SCROLLBAR_WIDTH.js
- │   ├─ shouldRenderSelection.mixin.js
- │   ├─ syncScroll.js
  │   ├─ TableBody.vue
  │   ├─ TableFooter.vue
  │   ├─ TableFrame.vue
  │   └─ TableHeader.vue
  ├─ Datatable.vue
  ├─ index.js
  ├─ LimitSelect.vue
- ├─ Pagination.vue
- └─ props.mixin.js
+ └─ Pagination.vue
 ```
 
 Here is the illustration for the tree above, which is captured from the advanced example (source: [`examples/src/Advanced/index.vue`](https://github.com/OneWayTech/vue2-datatable/blob/master/examples/src/Advanced/index.vue), demo: [examples#advanced](https://OneWayTech.github.io/vue2-datatable/examples/dist#advanced)):
diff --git a/doc/en/details/datatable-props.md b/doc/en/details/datatable-props.md
@@ -1,6 +1,6 @@
 # § `props` of Datatable
 
-> Source: [`src/props.mixin.js`](https://github.com/OneWayTech/vue2-datatable/blob/master/src/props.mixin.js)
+> Source: [`src/_mixins/props.js`](https://github.com/OneWayTech/vue2-datatable/blob/master/src/_mixins/props.js)
 
 | prop | Desc | Type | Optional values | Default value | Required |
 |---|---|---|---|---|---|
diff --git a/doc/zh-cn/details/README.md b/doc/zh-cn/details/README.md
@@ -5,26 +5,23 @@
 源码目录树 [`src/`](https://github.com/OneWayTech/vue2-datatable/tree/master/src) 如下所示：
 
 ```
-src/
+ ├─ _mixins/
+ ├─ _utils/
  ├─ HeaderSettings/
  │   ├─ ColumnGroup.vue
  │   └─ index.vue
  ├─ MainTable
  │   ├─ HeadSort.vue
  │   ├─ index.vue
  │   ├─ MultiSelect.vue
- │   ├─ SCROLLBAR_WIDTH.js
- │   ├─ shouldRenderSelection.mixin.js
- │   ├─ syncScroll.js
  │   ├─ TableBody.vue
  │   ├─ TableFooter.vue
  │   ├─ TableFrame.vue
  │   └─ TableHeader.vue
  ├─ Datatable.vue
  ├─ index.js
  ├─ LimitSelect.vue
- ├─ Pagination.vue
- └─ props.mixin.js
+ └─ Pagination.vue
 ```
 
 以高级例子 [`examples/src/Advanced/index.vue`](https://github.com/OneWayTech/vue2-datatable/blob/master/examples/src/Advanced/index.vue) ([demo - examples#advanced](https://OneWayTech.github.io/vue2-datatable/examples/dist#advanced)) 为例，标注出对应的基本构成组件如下图所示：
diff --git a/doc/zh-cn/details/datatable-props.md b/doc/zh-cn/details/datatable-props.md
@@ -1,6 +1,6 @@
 # § Datatable 配置项 (`props`)
 
-> 源码见 [`src/props.mixin.js`](https://github.com/OneWayTech/vue2-datatable/blob/master/src/props.mixin.js)
+> 源码见 [`src/_mixins/props.js`](https://github.com/OneWayTech/vue2-datatable/blob/master/src/_mixins/props.js)
 
 | 参数 | 说明 | 类型 | 可选值 | 默认值 | 是否必须 |
 |---|---|---|---|---|---|
diff --git a/examples/dist/client.1739aea0.js b/examples/dist/client.1739aea0.js
diff --git a/examples/dist/client.e57b87a6.js b/examples/dist/client.e57b87a6.js
diff --git a/examples/dist/index.html b/examples/dist/index.html
@@ -12,5 +12,5 @@
   
 <script src="//unpkg.com/jquery@2.1.4/dist/jquery.min.js"></script>
 <script src="//unpkg.com/bootstrap@3.3.5/dist/js/bootstrap.min.js"></script>
-<script type="text/javascript" src="client.1739aea0.js"></script></body>
+<script type="text/javascript" src="client.e57b87a6.js"></script></body>
 </html>
diff --git a/package.json b/package.json
@@ -1,7 +1,7 @@
 {
   "name": "vue2-datatable-component",
   "description": "The best Datatable for Vue.js 2.x which never sucks",
-  "version": "2.1.5",
+  "version": "2.1.6",
   "main": "dist/min.js",
   "module": "src/index.js",
   "author": "Ken Berkeley <kenberkeley@foxmail.com>",
diff --git a/src/Datatable.vue b/src/Datatable.vue
@@ -25,7 +25,7 @@ import HeaderSettings from './HeaderSettings/index.vue'
 import MainTable from './MainTable/index.vue'
 import LimitSelect from './LimitSelect.vue'
 import Pagination from './Pagination.vue'
-import props from './props.mixin'
+import props from './_mixins/props'
 
 export default {
   name: 'Datatable',
diff --git a/src/HeaderSettings/ColumnGroup.vue b/src/HeaderSettings/ColumnGroup.vue
@@ -8,7 +8,7 @@
         type="checkbox"
         :id="uuidGen(col.field || idx)"
         :name="groupName"
-        :checked="typeof col.visible === 'undefined' || '' + col.visible === 'true'"
+        :checked="isColVisible(col)"
         :disabled="typeof col.visible === 'string'"
         @change="handleChange(col, $event.target.checked)">
       <label :for="uuidGen(col.field || idx)">
@@ -19,6 +19,8 @@
   </ul>
 </template>
 <script>
+import isColVisible from '../_utils/isColVisible'
+
 export default {
   props: {
     groupName: { type: String, required: true },
@@ -40,7 +42,8 @@ export default {
         this.$set(col, 'visible', isChecked)
       })
       this.changes = [] // don't forget to clear the stack
-    }
+    },
+    isColVisible
   }
 }
 </script>
diff --git a/src/MainTable/MultiSelect.vue b/src/MainTable/MultiSelect.vue
@@ -45,7 +45,7 @@ export default {
         return
       }
       if (this.rows) {
-        // not only same length but also non-zero
+        // not only have same length but also non-zero
         this.status = this.rows.length === selection.length && selection.length
       }
     }
diff --git a/src/MainTable/TableBody.vue b/src/MainTable/TableBody.vue
@@ -46,8 +46,8 @@
 </template>
 <script>
 import MultiSelect from './MultiSelect.vue'
-import props from '../props.mixin'
-import shouldRenderSelection from './shouldRenderSelection.mixin'
+import props from '../_mixins/props'
+import shouldRenderSelection from '../_mixins/shouldRenderSelection'
 
 export default {
   components: { MultiSelect },
diff --git a/src/MainTable/TableFooter.vue b/src/MainTable/TableFooter.vue
@@ -24,8 +24,8 @@
   </tfoot>
 </template>
 <script>
-import props from '../props.mixin'
-import shouldRenderSelection from './shouldRenderSelection.mixin'
+import props from '../_mixins/props'
+import shouldRenderSelection from '../_mixins/shouldRenderSelection'
 
 export default {
   mixins: [props, shouldRenderSelection]
diff --git a/src/MainTable/TableFrame.vue b/src/MainTable/TableFrame.vue
@@ -8,8 +8,8 @@
   </table>
 </template>
 <script>
-import props from '../props.mixin'
-import shouldRenderSelection from './shouldRenderSelection.mixin'
+import props from '../_mixins/props'
+import shouldRenderSelection from '../_mixins/shouldRenderSelection'
 
 export default {
   mixins: [props, shouldRenderSelection]
diff --git a/src/MainTable/TableHeader.vue b/src/MainTable/TableHeader.vue
@@ -29,8 +29,8 @@
 <script>
 import HeadSort from './HeadSort.vue'
 import MultiSelect from './MultiSelect.vue'
-import props from '../props.mixin'
-import shouldRenderSelection from './shouldRenderSelection.mixin'
+import props from '../_mixins/props'
+import shouldRenderSelection from '../_mixins/shouldRenderSelection'
 
 export default {
   components: { HeadSort, MultiSelect },
diff --git a/src/MainTable/index.vue b/src/MainTable/index.vue
@@ -37,9 +37,10 @@ import TableFrame from './TableFrame.vue'
 import TableHeader from './TableHeader.vue'
 import TableBody from './TableBody.vue'
 import TableFooter from './TableFooter.vue'
-import syncScroll from './syncScroll'
-import SCROLLBAR_WIDTH from './SCROLLBAR_WIDTH'
-import props from '../props.mixin'
+import props from '../_mixins/props'
+import isColVisible from '../_utils/isColVisible'
+import SCROLLBAR_WIDTH from '../_utils/SCROLLBAR_WIDTH'
+import syncScroll from '../_utils/syncScroll'
 
 export default {
   mixins: [props],
@@ -63,7 +64,7 @@ export default {
   },
   computed: {
     visibleColumns () {
-      return this.columns.filter(col => typeof col.visible === 'undefined' || '' + col.visible === 'true')
+      return this.columns.filter(isColVisible)
     },
     leftFixedColumns () {
       return this.visibleColumns.filter(col => col.fixed && col.fixed !== 'right')
diff --git a/src/_mixins/props.js b/src/_mixins/props.js
diff --git a/src/_mixins/shouldRenderSelection.js b/src/_mixins/shouldRenderSelection.js
diff --git a/src/_utils/SCROLLBAR_WIDTH.js b/src/_utils/SCROLLBAR_WIDTH.js
diff --git a/src/_utils/isColVisible.js b/src/_utils/isColVisible.js
@@ -0,0 +1,3 @@
+export default function (col) {
+  return typeof col.visible === 'undefined' || '' + col.visible === 'true'
+}
diff --git a/src/_utils/syncScroll.js b/src/_utils/syncScroll.js

Original file line number	Diff line number	Diff line change
`@@ -1,7 +1,7 @@`
`1`	`1`	`{`
`2`	`2`	`"name": "vue2-datatable-component",`
`3`	`3`	`"description": "The best Datatable for Vue.js 2.x which never sucks",`
`4`		`- "version": "2.1.5",`
	`4`	`+ "version": "2.1.6",`
`5`	`5`	`"main": "dist/min.js",`
`6`	`6`	`"module": "src/index.js",`
`7`	`7`	`"author": "Ken Berkeley <kenberkeley@foxmail.com>",`