module.exports 修改成 export default

.eslintrc.js

@@ -15,6 +15,12 @@ module.exports = {
     parser: '@babel/eslint-parser',
     sourceType: 'module',
   },
+  env: {
+    browser: true,
+    node: true,
+    es6: true,
+    jquery: true
+  },
   rules: {
     // override/add rules settings here, such as:
     'vue/no-unused-vars': 'error',

packages/common/Common.js

@@ -1,7 +1,7 @@
 var Notify = require('./Notify.js')
 
 
-module.exports = {
+export default {
   pageSize: 20,
 
 

packages/common/DownloadService.js

@@ -3,7 +3,7 @@ var Common = require('./Common.js')
 /**
  * 报表下载服务
  */
-module.exports = {
+export default {
 
   /**
 	 * GET 方式下载文件

packages/common/IFrameUtil.js

@@ -1,4 +1,4 @@
-module.exports = {
+export default {
     /**
      * 关闭iframe
      */

packages/common/Language.js

@@ -1,4 +1,4 @@
-module.exports = {
+export default {
   /**
      * 获取国际化的菜单名称
      */

packages/common/Notify.js

@@ -1,6 +1,6 @@
 var ModalFix = require('../modal/src/ModalFix.JS')
 
-module.exports = {
+export default {
   /**
      * 显示模态框
      */

packages/common/SqlApi.js

@@ -1,6 +1,6 @@
 var Common = require("./Common.js");
 
-module.exports = {
+export default {
 
     /**
      * 通过GET方式调用SQL API

packages/common/UserStorageResource.js

@@ -5,7 +5,7 @@ var Common = require('./Common.js')
  * 工具作者: 杨志杰
  * UserStorageResource 
  */
-module.exports = {
+export default {
 
   /**
 	 * 工具类自动生成的方法

packages/common/Uuid.js

@@ -1,4 +1,4 @@
-module.exports = {
+export default {
   createUUID: function () {
     var _self = this
     // Loose interpretation of the specification DCE 1.1: Remote Procedure Call

packages/customer-window/src/api/CustomerWindowResource.js

@@ -5,7 +5,7 @@
  * 工具作者: 杨志杰
  *  
  */
-module.exports = {
+export default {
 
   /**
 	 * 工具类自动生成的方法

packages/date/src/Date.vue

@@ -11,8 +11,12 @@
 var VueDatepicker = require('../../vue-datepicker/src/vue-datepicker.vue').default
 var VueDatepickerOption0 = require('./vue-datepicker-setting.js')
 
-module.exports = {
-  name: 'date',
+export default {
+  name: 'Date',
+
+  components: {
+    'date-picker': VueDatepicker,
+  },
   props: [
     'dateValue', 'readonly',
   ],
@@ -43,10 +47,6 @@ module.exports = {
     }
   },
 
-  components: {
-    'date-picker': VueDatepicker,
-  },
-
   watch: {
     // 'value': function(val){
     // 	// 监听外部对props属性value的变更，并同步到组件内

packages/date/src/vue-datepicker-setting.js

@@ -1,4 +1,4 @@
-module.exports = function () {
+export default function () {
   return {
     option: {
       type: '',

packages/datetime-v2/src/DateTimeV2.vue

@@ -23,9 +23,13 @@
 
 <script>
 
-module.exports = {
+export default {
 
-  name: 'date-time-v2',
+  name: 'DateTimeV2',
+
+  components: {
+
+  },
 
   props: [
     'dateValue', 'readonly',
@@ -37,8 +41,24 @@ module.exports = {
     }
   },
 
-  components: {
 
+  computed: {
+
+    /**
+         * 把(YYYY-MM-DD HH:mm:ss)格式的日期字符串转换成datetime-local(YYYY-MM-DDTHH:mm:ss)
+         */
+    dateTime: function () {
+      if (this.dateValue == null || this.dateValue.length == 0) {
+        return null
+      } else {
+        return moment(this.dateValue, 'YYYY-MM-DD HH:mm:ss').format('YYYY-MM-DDTHH:mm:ss')
+      }
+    },
+
+  },
+
+  mounted: function () {
+        
   },
 
   methods: {
@@ -86,26 +106,6 @@ module.exports = {
       }
     },
   },
-
-  mounted: function () {
-        
-  },
-
-
-  computed: {
-
-    /**
-         * 把(YYYY-MM-DD HH:mm:ss)格式的日期字符串转换成datetime-local(YYYY-MM-DDTHH:mm:ss)
-         */
-    dateTime: function () {
-      if (this.dateValue == null || this.dateValue.length == 0) {
-        return null
-      } else {
-        return moment(this.dateValue, 'YYYY-MM-DD HH:mm:ss').format('YYYY-MM-DDTHH:mm:ss')
-      }
-    },
-
-  },
 }
 </script>
 

packages/datetime/src/DateTime.vue

@@ -11,11 +11,20 @@
 var VueDatepicker = require('../../vue-datepicker/src/vue-datepicker.vue').default
 var VueDatepickerOption1 = require('./vue-datepicker-setting.js')
 
-module.exports = {
-  name: 'date-time',
-  props: [
-    'dateValue', 'readonly',
-  ],
+export default {
+  name: 'DateTime',
+
+  components: {
+    'date-picker': VueDatepicker,
+  },
+  props: {
+    'dateValue':{
+      type: String,
+    },
+    'readonly':{
+      type: Boolean,
+    },
+  },
 
   data: function () {
     var vueDatepickerOption = VueDatepickerOption1()
@@ -43,10 +52,6 @@ module.exports = {
     }
   },
 
-  components: {
-    'date-picker': VueDatepicker,
-  },
-
   watch: {
     // 'value': function(val){
     // 	// 监听外部对props属性value的变更，并同步到组件内

packages/datetime/src/vue-datepicker-setting.js

@@ -1,4 +1,4 @@
-module.exports = function () {
+export default function () {
   return {
     option: {
       type: '',

packages/html-window/src/api/HtmlWindowResource.js

@@ -5,7 +5,7 @@
  * 工具作者: 杨志杰
  * 生成html窗口xml 
  */
-module.exports = {
+export default {
 
   /**
 	 * 工具类自动生成的方法

packages/image-preview/src/ImagePreview.vue

@@ -24,10 +24,21 @@
 var Common = require('../../common/Common.js')
 var Modal = require('../../modal/src/Modal.vue').default
 
-module.exports = {
+export default {
   name: 'ImagePreview',
+
+  components: {
+    Modal,
+  },
     
-  props: ['className', 'imageName'],
+  props: {
+    'className':{
+      type: String,
+    },
+    'imageName':{
+      type: String,
+    },
+  }, 
 
   data: function () {
     return {
@@ -35,10 +46,6 @@ module.exports = {
     }
   },
 
-  components: {
-    Modal,
-  },
-
   methods: {
     /**
          * 预览图片

packages/index.js

@@ -119,7 +119,7 @@ if (typeof window !== 'undefined' && window.Vue) {
 };
 
 
-module.exports = {
+export default {
     version: '1.2.9',
     // locale: locale.use,
     // i18n: locale.i18n,

packages/info/src/DocGenerator.vue

@@ -55,7 +55,7 @@ var QueryCondition = require("./QueryCondition.vue").default;
 var DocGeneratorSelected = require("./DocGeneratorSelected.vue").default;
 var DocGeneratorGrid = require("./DocGeneratorGrid.vue").default;
 
-module.exports = {
+export default {
     name: "DocGenerator",
     
     props: ["infoWindowNo"],

packages/info/src/DocGeneratorGrid.vue

@@ -96,7 +96,7 @@ var InfoUtil = require("./InfoUtil.js");
 var Pagination = require("../../vue-bootstrap-pagination/src/vue-bootstrap-pagination.vue").default;
 var PageSizeSelect = require("../../page-size-select/src/PageSizeSelect.vue").default;
 
-module.exports = {
+export default {
     props: [
         "infoWindowNo",     // 查询窗口编号
         "infoGridFields",   // 表格字段

packages/info/src/DocGeneratorSelected.vue

@@ -103,7 +103,10 @@ var Common = require('../../common/Common.js')
 var Notify = require('../../common/Notify.js')
 var InfoUtil = require('./InfoUtil.js')
 
-module.exports = {
+export default {
+
+  components: {
+  },
   props: [
     'infoWindowNo',     // 查询窗口编号
     'infoGridFields',   // 表格字段
@@ -117,7 +120,23 @@ module.exports = {
     }
   },
 
-  components: {
+  computed: {
+    /**
+         * 自动计算表格的宽度
+         */
+    tableWidth: function () {
+      var totalWidth = 50
+      if (this.infoGridFields !== undefined) {
+        this.infoGridFields.forEach(function (infoGridField) {
+          if (infoGridField.width !== undefined
+                        && infoGridField.width !== null
+                        && infoGridField.width !== '') {
+            totalWidth += Number(infoGridField.width)
+          }
+        })
+      }
+      return totalWidth + 'px'
+    },
   },
 
   methods: {
@@ -319,25 +338,6 @@ module.exports = {
     },
 
   },
-
-  computed: {
-    /**
-         * 自动计算表格的宽度
-         */
-    tableWidth: function () {
-      var totalWidth = 50
-      if (this.infoGridFields !== undefined) {
-        this.infoGridFields.forEach(function (infoGridField) {
-          if (infoGridField.width !== undefined
-                        && infoGridField.width !== null
-                        && infoGridField.width !== '') {
-            totalWidth += Number(infoGridField.width)
-          }
-        })
-      }
-      return totalWidth + 'px'
-    },
-  },
 }
 </script>
 

packages/info/src/EnumSelectWidgetInfo.vue

@@ -9,7 +9,7 @@
 </template>
 
 <script>
-module.exports = {
+export default {
   props: ['field', 'fieldValue'],
 
   data: function(){

packages/info/src/InfoMultiSearchWidget.vue

@@ -44,7 +44,11 @@ var Modal = require('../../modal/src/Modal.vue').default
 var InfoFilter = require('./InfoWindow.vue').default
 var Loading = require('../../loading/src/Loading.vue').default
 
-module.exports = {
+export default {
+
+  components: {
+    Modal, InfoFilter, Loading,
+  },
   props: ['infoWindowNo', 'fieldValue', 'whereClause', 'displayName'],
 
   data: function () {
@@ -59,8 +63,19 @@ module.exports = {
     }
   },
 
-  components: {
-    Modal, InfoFilter, Loading,
+  computed: {
+
+  },
+
+  watch: {
+    fieldValue: function (to) {
+      this.reComputeSearchText(to)
+    },
+
+  },
+
+  mounted: function () {
+    this.reComputeSearchText(this.fieldValue)
   },
 
   methods: {
@@ -191,21 +206,6 @@ module.exports = {
       this.reComputeSearchText(newFieldValue)
     },
   },
-
-  watch: {
-    fieldValue: function (to) {
-      this.reComputeSearchText(to)
-    },
-
-  },
-
-  computed: {
-
-  },
-
-  mounted: function () {
-    this.reComputeSearchText(this.fieldValue)
-  },
 }
 </script>
 

packages/info/src/InfoUtil.js

@@ -1,6 +1,6 @@
 var UserStorageResource = require('../../common/UserStorageResource.js')
 
-module.exports = {
+export default {
 
   cloneField: function (field) {
     var fieldClone = {

packages/info/src/InfoWindow.vue

@@ -22,8 +22,14 @@ var QueryPage = require('./QueryPage.vue').default
 var Loading = require('../../loading/src/Loading.vue').default
 var ClientOrgnization = require('./customer/ClientOrgnizationInfo.vue').default
 
-module.exports = {
+export default {
   name: 'InfoWindow',
+
+  components: {
+    QueryPage,
+    Loading,
+    ClientOrgnization,
+  },
   props: ['whereClause', 'isSearchWidget', 'parentModelData', 'modelData', 'fieldValue'],
   data: function () {
     return {
@@ -34,10 +40,16 @@ module.exports = {
     }
   },
 
-  components: {
-    QueryPage,
-    Loading,
-    ClientOrgnization,
+  watch: {
+    '$route': function (to, from) {
+      this.getInfoWindowNo()
+      this.loadData()
+    },
+  },
+
+  mounted: function () {
+    this.getInfoWindowNo()
+    this.loadData()
   },
 
   methods: {
@@ -148,18 +160,6 @@ module.exports = {
       }
     },
   },
-
-  watch: {
-    '$route': function (to, from) {
-      this.getInfoWindowNo()
-      this.loadData()
-    },
-  },
-
-  mounted: function () {
-    this.getInfoWindowNo()
-    this.loadData()
-  },
 }
 
 </script>

packages/info/src/InfoWindowUtil.js

@@ -1,4 +1,4 @@
-module.exports = {
+export default {
 
   /**
      * 克隆过滤字段集合

packages/info/src/QueryCondition.vue

@@ -64,9 +64,13 @@ var InfoWindowUtil = require('./InfoWindowUtil.js')
 var QueryConditionSimple = require('./QueryConditionSimple.vue').default
 var QueryConditionComplex = require('./QueryConditionComplex.vue').default
 
-module.exports = {
+export default {
   name: 'QueryCondition',
 
+  components: {
+    QueryConditionSimple, QueryConditionComplex,
+  },
+
   props: ['infoFilterFields', 'infoButtons', 'isSearchWidget', 'showButton'],
 
   data: function () {
@@ -77,9 +81,29 @@ module.exports = {
       selectedText: [],
     }
   },
+    
+  watch: {
+    $route: function (to, from) {
+      var _self = this
+      _self.simpleConditionValue = ''
+      _self.filterFields = []
+    },
 
-  components: {
-    QueryConditionSimple, QueryConditionComplex,
+    infoFilterFields: function (currentValue, oldValue) {
+      var _self = this
+
+      _self.filterFields.splice(0, _self.filterFields.length)
+
+      if (currentValue == undefined) {
+        return
+      }
+
+      var cloneInfoFilterFields = InfoWindowUtil.cloneInfoFilterFields(currentValue)
+
+      for (var i = 0, len = cloneInfoFilterFields.length; i < len; i++) {
+        _self.filterFields.push(cloneInfoFilterFields[i])
+      }
+    },
   },
 
   methods: {
@@ -190,30 +214,6 @@ module.exports = {
       }
     },
   },
-    
-  watch: {
-    $route: function (to, from) {
-      var _self = this
-      _self.simpleConditionValue = ''
-      _self.filterFields = []
-    },
-
-    infoFilterFields: function (currentValue, oldValue) {
-      var _self = this
-
-      _self.filterFields.splice(0, _self.filterFields.length)
-
-      if (currentValue == undefined) {
-        return
-      }
-
-      var cloneInfoFilterFields = InfoWindowUtil.cloneInfoFilterFields(currentValue)
-
-      for (var i = 0, len = cloneInfoFilterFields.length; i < len; i++) {
-        _self.filterFields.push(cloneInfoFilterFields[i])
-      }
-    },
-  },
 }
 </script>
 

packages/info/src/QueryConditionComplex.vue

@@ -254,17 +254,7 @@ var DateWidget = require('../../date/src/Date.vue').default
 var VueMonthlyPicker = require('../../vue-monthly-picker/src/VueMonthlyPicker.vue').default
 var Language = require('../../common/Language.js')
 
-module.exports = {
-
-  props: ['filterFields', 'infoButtons', 'isSearchWidget', 'showButton'],
-
-  data: function () {
-    this.Language = Language
-    return {
-      simpleConditionValue: '',
-      selectedText: [],
-    }
-  },
+export default {
 
   components: {
     EnumSelectWidgetInfo,
@@ -276,6 +266,16 @@ module.exports = {
     YearPicker,
   },
 
+  props: ['filterFields', 'infoButtons', 'isSearchWidget', 'showButton'],
+
+  data: function () {
+    this.Language = Language
+    return {
+      simpleConditionValue: '',
+      selectedText: [],
+    }
+  },
+
   methods: {
     /**
                  * 日期时间选择框值改变事件

packages/info/src/QueryConditionSimple.vue

@@ -58,7 +58,10 @@
 
 var Language = require('../../common/Language.js')
 
-module.exports = {
+export default {
+
+  components: {
+  },
 
   props: ['infoFilterFields', 'infoButtons', 'isSearchWidget', 'showButton'],
 
@@ -70,9 +73,6 @@ module.exports = {
     }
   },
 
-  components: {
-  },
-
   methods: {
 
 

packages/info/src/QueryPage.vue

@@ -183,10 +183,26 @@ var UserStorageResource = require('../../common/UserStorageResource.js')
 
 var Language = require('../../common/Language.js')
 
-module.exports = {
+export default {
 
   name: 'QueryPage',
 
+  components: {
+    Common,
+    Pagination,
+    QueryCondition,
+    Modal,
+    InfoHeader,
+    Notify,
+    Loading,
+    ProcessReportResult,
+    Uuid,
+    InfoUtil,
+    PageSizeSelect,
+    QueryPageImage,
+    DownloadService,
+  },
+
   props: ['whereClause', 'isSearchWidget', 'parentModelData', 'modelData', 'fieldValue'],
 
   data: function () {
@@ -221,21 +237,72 @@ module.exports = {
       tableOutDivId: Uuid.createUUID(),
     }
   },
+  computed: {
+    tableWidth: function () {
+      var totalWidth = 50
+      if (this.infoWindowDto != undefined && this.infoGridFields != undefined) {
+        this.infoGridFields.forEach(function (item) {
+          if (item.isShow) {
+            totalWidth += Number(item.width)
+          }
+        })
+      }
+      return totalWidth + 'px'
+    },
+  },
+  watch: {
 
-  components: {
-    Common,
-    Pagination,
-    QueryCondition,
-    Modal,
-    InfoHeader,
-    Notify,
-    Loading,
-    ProcessReportResult,
-    Uuid,
-    InfoUtil,
-    PageSizeSelect,
-    QueryPageImage,
-    DownloadService,
+    /**
+         * 是否选择了全部的数据
+         */
+    isSelectAll: function (val) {
+      var _self = this
+      if (_self.multipleSelect) {
+        if (_self.isSelectAll) {
+          _self.selectedModelDatas.splice(0, _self.selectedModelDatas.length)
+          if (val) {
+            _self.infoWindowData.dataList.forEach(function (item) {
+              item.select = true
+              _self.selectedModelDatas.push(item)
+            })
+          }
+        } else {
+          _self.infoWindowData.dataList.forEach(function (item) {
+            item.select = false
+          })
+          _self.selectedModelDatas = []
+        }
+      } else {
+        _self.isSelectAll = false
+      }
+    },
+
+    /**
+         * 路由发生改变
+         */
+    $route: function (to, from) {
+      var _self = this
+      _self.infoWindowData = {}
+    },
+
+    /**
+         * 选择的数据发生改变
+         */
+    // selectedModelDatas: function(to, from){
+    // 	var _self = this;
+    // 	if(!_self.multipleSelect){
+    // 		if(to.length > 1){
+    // 			_self.selectedModelDatas.splice(0, to.length - 1);
+    // 		}
+    // 	}
+    // },
+
+    /**
+         * fieldValue发生改变
+         */
+    fieldValue: function (to, from) {
+      this.reSelectedNode(to)
+    },
   },
 
   methods: {
@@ -787,73 +854,6 @@ module.exports = {
     },
 
   },
-  computed: {
-    tableWidth: function () {
-      var totalWidth = 50
-      if (this.infoWindowDto != undefined && this.infoGridFields != undefined) {
-        this.infoGridFields.forEach(function (item) {
-          if (item.isShow) {
-            totalWidth += Number(item.width)
-          }
-        })
-      }
-      return totalWidth + 'px'
-    },
-  },
-  watch: {
-
-    /**
-         * 是否选择了全部的数据
-         */
-    isSelectAll: function (val) {
-      var _self = this
-      if (_self.multipleSelect) {
-        if (_self.isSelectAll) {
-          _self.selectedModelDatas.splice(0, _self.selectedModelDatas.length)
-          if (val) {
-            _self.infoWindowData.dataList.forEach(function (item) {
-              item.select = true
-              _self.selectedModelDatas.push(item)
-            })
-          }
-        } else {
-          _self.infoWindowData.dataList.forEach(function (item) {
-            item.select = false
-          })
-          _self.selectedModelDatas = []
-        }
-      } else {
-        _self.isSelectAll = false
-      }
-    },
-
-    /**
-         * 路由发生改变
-         */
-    $route: function (to, from) {
-      var _self = this
-      _self.infoWindowData = {}
-    },
-
-    /**
-         * 选择的数据发生改变
-         */
-    // selectedModelDatas: function(to, from){
-    // 	var _self = this;
-    // 	if(!_self.multipleSelect){
-    // 		if(to.length > 1){
-    // 			_self.selectedModelDatas.splice(0, to.length - 1);
-    // 		}
-    // 	}
-    // },
-
-    /**
-         * fieldValue发生改变
-         */
-    fieldValue: function (to, from) {
-      this.reSelectedNode(to)
-    },
-  },
 }
 </script>
 

packages/info/src/QueryPageImage.vue

@@ -40,7 +40,11 @@ var Common = require('../../common/Common.js')
 var Modal = require('../../modal/src/Modal.vue').default
 var ImagePreview = require('../../image-preview/src/ImagePreview.vue').default
 
-module.exports = {
+export default {
+
+  components: {
+    Modal, ImagePreview,
+  },
   props: ['className', 'imageNames'],
   data: function () {
     this.Common = Common
@@ -49,9 +53,24 @@ module.exports = {
       selectedImage: '',
     }
   },
-
-  components: {
-    Modal, ImagePreview,
+  watch: {
+    /**
+         * fieldValue发生改变
+         */
+    imageNames: function (value) {
+      if (value == undefined || value.length == 0) {
+        this.images = []
+      } else {
+        this.images = value.split(',')
+      }
+    },
+  },
+  mounted: function () {
+    if (this.imageNames == undefined || this.imageNames.length == 0) {
+      this.images = []
+    } else {
+      this.images = this.imageNames.split(',')
+    }
   },
 
   methods: {
@@ -76,25 +95,6 @@ module.exports = {
       window.open(this.getImageSrc(this.selectedImage))
     },
   },
-  mounted: function () {
-    if (this.imageNames == undefined || this.imageNames.length == 0) {
-      this.images = []
-    } else {
-      this.images = this.imageNames.split(',')
-    }
-  },
-  watch: {
-    /**
-         * fieldValue发生改变
-         */
-    imageNames: function (value) {
-      if (value == undefined || value.length == 0) {
-        this.images = []
-      } else {
-        this.images = value.split(',')
-      }
-    },
-  },
 }
 </script>
 

packages/info/src/SearchAutoCompleteWidget.vue

@@ -42,7 +42,11 @@
 var Common = require('../../common/Common.js')
 var Modal = require('../../modal/src/Modal.vue').default
 
-module.exports = {
+export default {
+
+  components: {
+    Modal,
+  },
   props: ['infoWindowNo', 'fieldId', 'leftPosition', 'whereClause', 'parentModelData', 'modelData'],
 
   data: function () {
@@ -56,8 +60,38 @@ module.exports = {
     }
   },
 
-  components: {
-    Modal,
+  computed: {
+    realLeftComputed: function () {
+      return (((this.realLeft > 0) ? this.realLeft : 0) + 'px')
+    },
+  },
+
+  watch: {
+    infoWindowData: function (val) {
+      var _self = this
+      if (val.dataList != undefined && val.dataList.length > 0) {
+        _self.isShowAuto = true
+      } else {
+        _self.isShowAuto = false
+      }
+    },
+
+    /**
+         * 距离左侧的距离
+         * @param  {[type]} currentValue [description]
+         * @param  {[type]} oldValue     [description]
+         * @return {[type]}              [description]
+         */
+    leftPosition: function (currentValue, oldValue) {
+      var _self = this
+      console.log('initialLeft changed: ' + currentValue)
+      _self.realLeft = currentValue
+      console.log('realLeft2:' + _self.realLeft)
+    },
+  },
+
+  mounted: function () {
+
   },
 
   methods: {
@@ -245,40 +279,6 @@ module.exports = {
       })
     },
   },
-
-  mounted: function () {
-
-  },
-
-  computed: {
-    realLeftComputed: function () {
-      return (((this.realLeft > 0) ? this.realLeft : 0) + 'px')
-    },
-  },
-
-  watch: {
-    infoWindowData: function (val) {
-      var _self = this
-      if (val.dataList != undefined && val.dataList.length > 0) {
-        _self.isShowAuto = true
-      } else {
-        _self.isShowAuto = false
-      }
-    },
-
-    /**
-         * 距离左侧的距离
-         * @param  {[type]} currentValue [description]
-         * @param  {[type]} oldValue     [description]
-         * @return {[type]}              [description]
-         */
-    leftPosition: function (currentValue, oldValue) {
-      var _self = this
-      console.log('initialLeft changed: ' + currentValue)
-      _self.realLeft = currentValue
-      console.log('realLeft2:' + _self.realLeft)
-    },
-  },
 }
 </script>
 

packages/info/src/SearchWidget.vue

@@ -63,8 +63,12 @@ var Info = require('./InfoWindow.vue').default
 var SearchAutoCompleteWidget = require('./SearchAutoCompleteWidget.vue').default
 var Loading = require('../../loading/src/Loading.vue').default
 
-module.exports = {
+export default {
   name: 'SearchWidget',
+
+  components: {
+    Modal, Info, SearchAutoCompleteWidget, Loading,
+  },
   // infoWindowNo: 查询窗口编号
   // fieldValue: 显示的值
   // fieldValue:{
@@ -88,8 +92,55 @@ module.exports = {
     }
   },
 
-  components: {
-    Modal, Info, SearchAutoCompleteWidget, Loading,
+  computed: {
+
+
+    /**
+         * 是否是有效的数据
+         */
+    validInput: function () {
+      var _self = this
+      var isValid = true
+      if (this.searchText != undefined && this.searchText.length > 0) {
+        if (this.fieldValue != undefined && (this.fieldValue.id == undefined || this.fieldValue.id <= 0)) {
+          isValid = false
+        } else if (this.fieldValue != undefined && (this.fieldValue.displayValue != undefined && this.fieldValue.displayValue[0] != this.searchText)) {
+          isValid = false
+        }
+      }
+      var isflag = false
+      if (_self.classSize != undefined) {
+        isflag = true
+      }
+      var ss = {
+        'invalid-input': isValid == false,
+        'classSize': isflag == true,
+      }
+      return ss
+    },
+  },
+
+  watch: {
+    redraw: function () {
+      console.log('searchWidgetRedraw')
+    },
+
+    fieldValue: {
+      handler(currentValue, oldValue) {
+        console.log('currentValue:' + JSON.stringify(currentValue))
+        this.searchText = this.initSearchText(currentValue)
+        console.log('searchText:' + this.searchText)
+      },
+      deep: true,
+    },
+
+    // 查询条件变化时，重新查询数据
+    whereClause: function () {
+      this.$refs.info.loadByInfoWindowNo(this.infoWindowNo)
+    },
+  },
+
+  created: function () {
   },
 
   methods: {
@@ -211,57 +262,6 @@ module.exports = {
       }
     },
   },
-
-  computed: {
-
-
-    /**
-         * 是否是有效的数据
-         */
-    validInput: function () {
-      var _self = this
-      var isValid = true
-      if (this.searchText != undefined && this.searchText.length > 0) {
-        if (this.fieldValue != undefined && (this.fieldValue.id == undefined || this.fieldValue.id <= 0)) {
-          isValid = false
-        } else if (this.fieldValue != undefined && (this.fieldValue.displayValue != undefined && this.fieldValue.displayValue[0] != this.searchText)) {
-          isValid = false
-        }
-      }
-      var isflag = false
-      if (_self.classSize != undefined) {
-        isflag = true
-      }
-      var ss = {
-        'invalid-input': isValid == false,
-        'classSize': isflag == true,
-      }
-      return ss
-    },
-  },
-
-  watch: {
-    redraw: function () {
-      console.log('searchWidgetRedraw')
-    },
-
-    fieldValue: {
-      handler(currentValue, oldValue) {
-        console.log('currentValue:' + JSON.stringify(currentValue))
-        this.searchText = this.initSearchText(currentValue)
-        console.log('searchText:' + this.searchText)
-      },
-      deep: true,
-    },
-
-    // 查询条件变化时，重新查询数据
-    whereClause: function () {
-      this.$refs.info.loadByInfoWindowNo(this.infoWindowNo)
-    },
-  },
-
-  created: function () {
-  },
 }
 </script>
 

packages/info/src/customer/ClientOrgnizationInfo.vue

@@ -27,7 +27,11 @@ var Common = require('../../../common/Common.js')
 var Loading = require('../../../loading/src/Loading.vue').default
 var TreeViewNode = require('../../../tree/src/TreeViewNode.vue').default
 
-module.exports = {
+export default {
+
+  components: {
+    Common, TreeViewNode, Loading,
+  },
   props: ['whereClause', 'isSearchWidget', 'modelData', 'parentModelData', 'fieldValue'],
 
   data: function () {
@@ -39,8 +43,14 @@ module.exports = {
     }
   },
 
-  components: {
-    Common, TreeViewNode, Loading,
+  watch: {
+    fieldValue: function (to, from) {
+      this.reSelectedNode(to)
+    },
+  },
+
+  mounted: function () {
+    this.refresh()
   },
 
   methods: {
@@ -155,16 +165,6 @@ module.exports = {
     },
 
   },
-
-  watch: {
-    fieldValue: function (to, from) {
-      this.reSelectedNode(to)
-    },
-  },
-
-  mounted: function () {
-    this.refresh()
-  },
 }
 </script>
     

packages/loading/src/Loading.vue

@@ -23,7 +23,7 @@
 <script>
 var UUID = require('../../common/Uuid.js')
 
-module.exports = {
+export default {
   name: 'Loading',
   props: ['text'],
   data: function () {
@@ -34,6 +34,10 @@ module.exports = {
     }
   },
 
+  mounted: function () {
+    this.hide()
+  },
+
   methods: {
     // 居中显示
     centerLoader: function () {
@@ -79,10 +83,6 @@ module.exports = {
       _self.visible = false
     },
   },
-
-  mounted: function () {
-    this.hide()
-  },
 }
 
 </script>

packages/modal/src/Modal.vue

@@ -33,7 +33,7 @@
 
 var ModalFix = require('./ModalFix.js')
 
-module.exports = {
+export default {
   name: 'Modal',
   props: {
     title: String,
@@ -77,14 +77,6 @@ module.exports = {
       }
     },
   },
-        
-  created: function() {
-    if (this.show) {
-      if(document.body.className.indexOf('modal-open') < 0){
-        document.body.className += ' modal-open'
-      }
-    }
-  },
 
   watch: {
     show : function (value) {
@@ -101,6 +93,18 @@ module.exports = {
       }
     },
   },
+        
+  created: function() {
+    if (this.show) {
+      if(document.body.className.indexOf('modal-open') < 0){
+        document.body.className += ' modal-open'
+      }
+    }
+  },
+    
+  mounted: function(){
+    	
+  },
 
   methods: {
     ok: function() {
@@ -151,10 +155,6 @@ module.exports = {
         	this.show = false
     },
   },
-    
-  mounted: function(){
-    	
-  },
 }
 </script>
 

packages/modal/src/ModalFix.js

@@ -1,4 +1,4 @@
-module.exports = {
+export default {
   /**
      * 获取BootstrapDialog插件显示的模态框的数量
      */

packages/navbar/src/Navbar.vue

@@ -18,8 +18,12 @@
 
 <script>
 
-module.exports = {
+export default {
   name: 'Navbar',
+
+  components: {
+
+  },
   props: [
     //是否需要返回按钮,true:需要返回按钮，false:不需要返回按钮
     'isGoBack',
@@ -33,10 +37,6 @@ module.exports = {
     }
   },
 
-  components: {
-
-  },
-
   methods: {
     goBack: function () {
       history.back()

packages/page-size-select/src/PageSizeSelect.vue

@@ -14,19 +14,19 @@
 <script>
 // 外部可以注册事件pageSizeChanged
 
-module.exports = {
+export default {
     	name: 'PageSizeSelect',
 
+  components : {
+
+  },
+
   data: function(){
     return {
       pageSize : 20,
     }
   },
 
-  components : {
-
-  },
-
   watch:{
     pageSize: function(newValue, oldValue){
       this.$emit('pageSizeChanged', newValue)

packages/pagination/src/Pagination.vue

@@ -52,7 +52,7 @@
 </template>
 
 <script>
-module.exports = {
+export default {
 
     /**
      * @property { object } pagination 

packages/print/src/PrintEpc.vue

@@ -74,9 +74,13 @@ var PrintEpcUtil = require('./PrintEpcUtil.js')
 var Modal = require('../../modal/src/Modal.vue').default
 var Loading = require('../../loading/src/Loading.vue').default
 
-module.exports = {
+export default {
   name: 'PrintEpc',
 
+  components: {
+    Modal, Loading,
+  },
+
   props: ['printerName'],
 
   data: function () {
@@ -94,10 +98,6 @@ module.exports = {
     }
   },
 
-  components: {
-    Modal, Loading,
-  },
-
 
   methods: {
     /**

packages/print/src/PrintEpcUtil.js

@@ -5,7 +5,7 @@
 var Uuid = require('../../common/Uuid.js')
 
 
-module.exports = {
+export default {
   webSocket: '',     // websocket对象
 
   socketUrl: 'ws://127.0.0.1:18800/api/ws/print',  //  websocket客户端地址

packages/print/src/PrintUtil.js

@@ -7,7 +7,7 @@ var Common = require('../../common/Common.js')
 var Uuid = require('../../common/Uuid.js')
 
 
-module.exports = {
+export default {
   webSocket: '',     // websocket对象
 
   socketUrl: 'ws://127.0.0.1:18800/api/ws/print',  //  websocket客户端地址

packages/print/src/PrintWidget.vue

@@ -31,8 +31,11 @@
 
 var PrintUtil = require('./PrintUtil.js')
 
-module.exports = {
+export default {
   name: 'PrintWidget',
+
+  components: {
+  },
     
   props: [
     'printerLocalstorageId', // 控件唯一的Id，用于localstorage存储打印机名称
@@ -46,7 +49,22 @@ module.exports = {
     }
   },
 
-  components: {
+
+
+  mounted: function () {
+    var _self = this
+    _self.restoreSelectedPrinter()
+    PrintUtil.getPrinters().then(successData => {
+      if (successData != null && successData.length > 0) {
+        successData.forEach(item => {
+          _self.printers.push(item)
+        })
+      }
+      _self.restoreSelectedPrinter()
+    }, errorData => {
+      console.log(errorData)
+      _self.restoreSelectedPrinter()
+    })
   },
 
   methods: {
@@ -103,24 +121,6 @@ module.exports = {
     },
 
   },
-
-
-
-  mounted: function () {
-    var _self = this
-    _self.restoreSelectedPrinter()
-    PrintUtil.getPrinters().then(successData => {
-      if (successData != null && successData.length > 0) {
-        successData.forEach(item => {
-          _self.printers.push(item)
-        })
-      }
-      _self.restoreSelectedPrinter()
-    }, errorData => {
-      console.log(errorData)
-      _self.restoreSelectedPrinter()
-    })
-  },
 }
 </script>
 

packages/process/src/EnumSelectWidget.vue

@@ -18,7 +18,7 @@
 </template>
 
 <script>
-module.exports = {
+export default {
   props: ['keyValues', 'enumValue'],
 
   data: function () {

packages/process/src/MultiSearchWidget.vue

@@ -120,7 +120,11 @@ var Modal = require('../../modal/src/Modal.vue').default
 var Info = require('../../info/src/InfoWindow.vue').default
 var Common = require('../../common/Common.js')
 
-module.exports = {
+export default {
+
+  components: {
+    Modal, Info,
+  },
   props: ['infoWindowNo', 'field', 'fieldValue', 'readonly'],
 
   data: function () {
@@ -135,8 +139,28 @@ module.exports = {
     }
   },
 
-  components: {
-    Modal, Info,
+  computed: {
+    titleNames: function () {
+      if (this.labelNames == undefined || this.labelNames.length == 0) {
+        this.labelNames = this.field.displayName.split(',')
+      }
+      return this.labelNames
+    },
+  },
+
+  watch: {
+    infoWindowData: function (val) {
+      var _self = this
+      if (val.dataList != undefined && val.dataList.length > 0) {
+        _self.isShowAuto = true
+      } else {
+        _self.isShowAuto = false
+      }
+    },
+  },
+
+  mounted: function () {
+    this.getInfoWindowDto()
   },
 
   methods: {
@@ -358,30 +382,6 @@ module.exports = {
       }
     },
   },
-
-  computed: {
-    titleNames: function () {
-      if (this.labelNames == undefined || this.labelNames.length == 0) {
-        this.labelNames = this.field.displayName.split(',')
-      }
-      return this.labelNames
-    },
-  },
-
-  watch: {
-    infoWindowData: function (val) {
-      var _self = this
-      if (val.dataList != undefined && val.dataList.length > 0) {
-        _self.isShowAuto = true
-      } else {
-        _self.isShowAuto = false
-      }
-    },
-  },
-
-  mounted: function () {
-    this.getInfoWindowDto()
-  },
 }
 </script>
 

packages/process/src/ProcessReport.vue

@@ -19,8 +19,13 @@ var Common = require('../../common/Common.js')
 var ProcessReportDynamic = require('./ProcessReportDynamic.vue').default
 var ProcessReportStatic = require('./ProcessReportStatic.vue').default
 
-module.exports = {
+export default {
   name: 'ProcessReport',
+
+  components: {
+    ProcessReportDynamic,
+    ProcessReportStatic,
+  },
     
   data: function () {
     return {
@@ -29,9 +34,16 @@ module.exports = {
     }
   },
 
-  components: {
-    ProcessReportDynamic,
-    ProcessReportStatic,
+  watch: {
+    '$route': function (to, from) {
+      this.processReportNo = this.$route.params.no
+      this.loadData()
+    },
+  },
+
+  mounted: function () {
+    this.processReportNo = this.$route.params.no
+    this.loadData()
   },
 
   methods: {
@@ -162,18 +174,6 @@ module.exports = {
     },
 
   },
-
-  watch: {
-    '$route': function (to, from) {
-      this.processReportNo = this.$route.params.no
-      this.loadData()
-    },
-  },
-
-  mounted: function () {
-    this.processReportNo = this.$route.params.no
-    this.loadData()
-  },
 }
 </script>
 <style scoped>

packages/process/src/ProcessReportArchive.vue

@@ -98,7 +98,11 @@ var Common = require('../../common/Common.js')
 var Notify = require('../../common/Notify.js')
 var DateTimeWidget = require('../../datetime/src/DateTime.vue').default
 
-module.exports = {
+export default {
+
+  components: {
+    DateTimeWidget,
+  },
   props: ['processReportResult'],
 
   data: function () {
@@ -113,9 +117,21 @@ module.exports = {
       interval: '',
     }
   },
+  watch: {
+    'processReportResult': function () {
+      this.initArchiveAuthority()
+    },
+  },
+  mounted: function () {
+    var _self = this
+    this.initArchiveAuthority()
+    this.interval = window.setInterval(function () {
+      _self.updateDate()
+    }, 1000)
 
-  components: {
-    DateTimeWidget,
+  },
+  unmounted: function () {
+    clearInterval(this.interval)
   },
 
   methods: {
@@ -217,21 +233,5 @@ module.exports = {
       this.$router.push('/desktop/archive')
     },
   },
-  mounted: function () {
-    var _self = this
-    this.initArchiveAuthority()
-    this.interval = window.setInterval(function () {
-      _self.updateDate()
-    }, 1000)
-
-  },
-  destroyed: function () {
-    clearInterval(this.interval)
-  },
-  watch: {
-    'processReportResult': function () {
-      this.initArchiveAuthority()
-    },
-  },
 }
 </script>

packages/process/src/ProcessReportDynamic.vue

@@ -148,7 +148,17 @@ var Switches = require('../../switches/src/Switches.vue').default
 
 
 
-module.exports = {
+export default {
+
+  components: {
+    DateTime,
+    MultiSearchWidget,
+    Loading,
+    ProcessReportResultPreview,
+    SearchWidget,
+    Switches,
+    Navbar,
+  },
   props: ['processReportDto'],
   data: function () {
     return {
@@ -164,14 +174,25 @@ module.exports = {
     }
   },
 
-  components: {
-    DateTime,
-    MultiSearchWidget,
-    Loading,
-    ProcessReportResultPreview,
-    SearchWidget,
-    Switches,
-    Navbar,
+  //监控processReportDto，当dto变化时重新渲染界面
+  watch: {
+    'processReportDto': function (to, from) {
+      this.parameters = []
+      this.processReportResult.reportResults = undefined
+      this.initData(this.processReportDto)
+    },
+    'processReportDto.processReportParameters': function () {
+      this.initData(this.processReportDto)
+    },
+    // 路由切换的时候清空报表结果数据
+    '$route': function () {
+      this.processReportResult = {}
+    },
+
+  },
+
+  mounted: function () {
+    this.initData(this.processReportDto)
   },
 
   methods: {
@@ -379,27 +400,6 @@ module.exports = {
 
   },
 
-  //监控processReportDto，当dto变化时重新渲染界面
-  watch: {
-    'processReportDto': function (to, from) {
-      this.parameters = []
-      this.processReportResult.reportResults = undefined
-      this.initData(this.processReportDto)
-    },
-    'processReportDto.processReportParameters': function () {
-      this.initData(this.processReportDto)
-    },
-    // 路由切换的时候清空报表结果数据
-    '$route': function () {
-      this.processReportResult = {}
-    },
-
-  },
-
-  mounted: function () {
-    this.initData(this.processReportDto)
-  },
-
 }
 </script>
 <style scoped>

packages/process/src/ProcessReportResult.vue

@@ -79,8 +79,15 @@ var Common = require('../../common/Common.js')
 var ProcessReportArchive = require('./ProcessReportArchive.vue').default
 var DownloadService = require('../../common/DownloadService.js')
 
-module.exports = {
+export default {
   name: 'ProcessReportResult',
+
+  components: {
+    Common,
+    ProcessReportArchive,
+    DownloadService,
+
+  },
     
   props: ['processReportResult', 'pdfOnly', 'excelOnly'],
 
@@ -90,10 +97,20 @@ module.exports = {
     }
   },
 
-  components: {
-    Common,
-    ProcessReportArchive,
-    DownloadService,
+  computed: {
+    // 是否文本区域显示流程结果
+    isTextAreaShowProcessResult: function () {
+      var result = this.processReportResult.processResult.result
+      if (result != undefined && result.length > 100) {
+        return true
+      } else {
+        return false
+      }
+    },
+
+  },
+
+  mounted: function () {
 
   },
 
@@ -111,22 +128,5 @@ module.exports = {
       }
     },
   },
-
-  mounted: function () {
-
-  },
-
-  computed: {
-    // 是否文本区域显示流程结果
-    isTextAreaShowProcessResult: function () {
-      var result = this.processReportResult.processResult.result
-      if (result != undefined && result.length > 100) {
-        return true
-      } else {
-        return false
-      }
-    },
-
-  },
 }
 </script>

packages/process/src/ProcessReportResultPreview.vue

@@ -155,8 +155,12 @@ var DownloadService = require('../../common/DownloadService.js')
 
 var ProcessReportArchive = require('./ProcessReportArchive.vue').default
 
-module.exports = {
+export default {
   name: 'ProcessReportResultPreview',
+
+  components: {
+    ProcessReportArchive,
+  },
     
   props: ['processReportResult', 'pdfOnly', 'excelOnly'],
 
@@ -166,8 +170,27 @@ module.exports = {
     }
   },
 
-  components: {
-    ProcessReportArchive,
+  computed: {
+    // 是否文本区域显示流程结果
+    isTextAreaShowProcessResult: function () {
+      var result = this.processReportResult.processResult.result
+      if (result != undefined && result.length > 100) {
+        return true
+      } else {
+        return false
+      }
+    },
+
+    // 是否Div显示流程个结果
+    isDivShowProcessResult: function () {
+      var result = this.processReportResult.processResult.result
+      if (result != undefined && result.length <= 100) {
+        return true
+      } else {
+        return false
+      }
+    },
+
   },
     
   methods: {
@@ -263,29 +286,6 @@ module.exports = {
       window.open(reportDesignerUrl)
     },
   },
-
-  computed: {
-    // 是否文本区域显示流程结果
-    isTextAreaShowProcessResult: function () {
-      var result = this.processReportResult.processResult.result
-      if (result != undefined && result.length > 100) {
-        return true
-      } else {
-        return false
-      }
-    },
-
-    // 是否Div显示流程个结果
-    isDivShowProcessResult: function () {
-      var result = this.processReportResult.processResult.result
-      if (result != undefined && result.length <= 100) {
-        return true
-      } else {
-        return false
-      }
-    },
-
-  },
 }
 </script>
 <style scoped>

packages/process/src/ProcessReportStatic.vue

@@ -156,7 +156,20 @@ var EnumSelectWidget = require('./EnumSelectWidget.vue').default
 
 
 
-module.exports = {
+export default {
+
+  components: {
+    DateTime,
+    MultiSearchWidget,
+    Loading,
+    ProcessReportResultPreview,
+    SearchWidget,
+    Switches,
+    Navbar,
+    VueMonthlyPicker,
+    YearPicker,
+    EnumSelectWidget,
+  },
   props: ['processReportDto'],
   data: function () {
     return {
@@ -174,17 +187,22 @@ module.exports = {
     }
   },
 
-  components: {
-    DateTime,
-    MultiSearchWidget,
-    Loading,
-    ProcessReportResultPreview,
-    SearchWidget,
-    Switches,
-    Navbar,
-    VueMonthlyPicker,
-    YearPicker,
-    EnumSelectWidget,
+  //监控processReportDto，当dto变化时重新渲染界面
+  watch: {
+    'processReportDto': function (to, from) {
+      this.processReportResult.reportResults = undefined
+      this.initData(this.processReportDto)
+    },
+    'processReportDto.processReportParameters': function () {
+      this.initData(this.processReportDto)
+    },
+    $route: function () {
+      this.processReportResult = {}
+    },
+  },
+
+  mounted: function () {
+    this.initData(this.processReportDto)
   },
 
   methods: {
@@ -367,24 +385,6 @@ module.exports = {
     },
 
   },
-
-  //监控processReportDto，当dto变化时重新渲染界面
-  watch: {
-    'processReportDto': function (to, from) {
-      this.processReportResult.reportResults = undefined
-      this.initData(this.processReportDto)
-    },
-    'processReportDto.processReportParameters': function () {
-      this.initData(this.processReportDto)
-    },
-    $route: function () {
-      this.processReportResult = {}
-    },
-  },
-
-  mounted: function () {
-    this.initData(this.processReportDto)
-  },
 }
 </script>
 <style scoped>

packages/process/src/api/ProcessReportResource.js

@@ -5,7 +5,7 @@ const Common = require('../../../common/Common.js')
  * 工具作者: 杨志杰
  *
  */
-module.exports = {
+export default {
 
   /**
 	 * 工具类自动生成的方法

packages/scanner/src/Scanner.vue

@@ -38,15 +38,27 @@
 <script>
 
 
-module.exports = {
-  name: 'Scanner',
+export default {
+  name: 'Scanner',  // eslint-disable-line
+  components: {
+  },
   data: function () {
     return {
       connected: false,
       base64Data: null,
     }
   },
-  components: {
+
+  mounted: function () {
+    this.init()
+  },
+
+  beforeUnmount: function () {
+    var _self = this
+    if (_self.webSocket != null) {
+      _self.webSocket.close()
+      _self.webSocket = null
+    }
   },
 
   methods: {
@@ -158,18 +170,6 @@ module.exports = {
       return new File([u8arr], fileName, { type: mime })
     },
   },
-
-  mounted: function () {
-    this.init()
-  },
-
-  beforeDestroy: function () {
-    var _self = this
-    if (_self.webSocket != null) {
-      _self.webSocket.close()
-      _self.webSocket = null
-    }
-  },
 }
 
 </script>

packages/switches/src/Switches.vue

@@ -1,20 +1,34 @@
 <template>
   <label :class="classObject">
-    <input v-model="value" type="checkbox" :disabled="disabled" @click="clickEvent($event)" />
+    <input
+      v-model="value"
+      type="checkbox"
+      :disabled="disabled"
+      @click="clickEvent($event)"
+    />
 
     <div />
 
-    <span v-if="showText === undefined || showText === null || showText === true" class="vue-switcher__label">
-      <span v-if="value" v-text="textTrue" />
-      <span v-if="!value" v-text="textFalse" />
+    <span
+      v-if="showText === undefined || showText === null || showText === true"
+      class="vue-switcher__label"
+    >
+      <span
+        v-if="value"
+        v-text="textTrue"
+      />
+      <span
+        v-if="!value"
+        v-text="textFalse"
+      />
     </span>
   </label>
 </template>
 
 <script>
 
-module.exports = {
-  name: 'Switches',
+export default {
+    name: 'Switches',   // eslint-disable-line
 
 
 
@@ -30,15 +44,15 @@ module.exports = {
 
   emits: ['update:modelValue'],
 
-  data: function(){
+  data: function () {
     var tempValue = false
     var colors = 'red'
-    if(this.modelValue != undefined){
+    if (this.modelValue != undefined) {
       tempValue = (this.modelValue == 'true' || this.modelValue == true)
-      if(this.modelValue == 'true' || this.modelValue == true){
-            	colors = 'green'
-      }else{
-            	colors = 'red'
+      if (this.modelValue == 'true' || this.modelValue == true) {
+        colors = 'green'
+      } else {
+        colors = 'red'
       }
     }
 
@@ -50,46 +64,46 @@ module.exports = {
       'colorCss': colors,
     }
   },
-  methods:{
-    clickEvent:function(e){
-      var clientX = e.clientX
-      var elm = $(e.target)
-      var left = elm.offset().left
-      if(clientX - left > 50){
-        e.preventDefault() 
+
+  computed: {
+    classObject: function () {
+      var _self = this
+
+      return {
+        'vue-switcher': true,
+        ['vue-switcher--unchecked']: !_self.value,
+        ['vue-switcher--disabled']: !!_self.disabled,
+        ['vue-switcher--bold']: !!_self.typeBold,
+        ['vue-switcher--bold--unchecked']: !!_self.typeBold && !_self.value,
+        [`vue-switcher-theme--${_self.theme}`]: _self.theme,
+        [`vue-switcher-color--${_self.colorCss}`]: _self.colorCss,
       }
     },
   },
   watch: {
-    value: function(val, oldVal) {
+    value: function (val, oldVal) {   // eslint-disable-line
       this.$emit('update:modelValue', val)
     },
 
-    modelValue: function(val, oldVal) {
-      if(val != undefined){
+    modelValue: function (val, oldVal) {    // eslint-disable-line
+      if (val != undefined) {
         this.value = (val == 'true' || val == true)
-        if(val == 'true' || val == true){
-               		this.colorCss = 'green'
-	            }else{
-	            	this.colorCss = 'red'
-	            }
+        if (val == 'true' || val == true) {
+          this.colorCss = 'green'
+        } else {
+          this.colorCss = 'red'
+        }
       }
-            
+
     },
   },
-
-  computed: {
-    classObject : function() {
-      var _self = this
-
-      return {
-        'vue-switcher' : true,
-        ['vue-switcher--unchecked'] : !_self.value,
-        ['vue-switcher--disabled'] : !!_self.disabled,
-        ['vue-switcher--bold']: !!_self.typeBold,
-        ['vue-switcher--bold--unchecked']: !!_self.typeBold && !_self.value,
-        [`vue-switcher-theme--${_self.theme}`] : _self.theme,
-        [`vue-switcher-color--${_self.colorCss}`] : _self.colorCss,
+  methods: {
+    clickEvent: function (e) {
+      var clientX = e.clientX
+      var elm = $(e.target)
+      var left = elm.offset().left
+      if (clientX - left > 50) {
+        e.preventDefault()
       }
     },
   },
@@ -97,164 +111,176 @@ module.exports = {
 </script>
 
 <style>
-	.vue-switcher {
-	  position: relative;
-	  display: inline-block;
-	  width: 100px;
-	  height: 26px;
-	  line-height: 26px;
-	  margin-bottom: 0px;
-	  top: 7px;
-	}
-	.vue-switcher__label {
-	  position: absolute;
-	  left: 50px;
-	  top: 0px;
-	  height: 26px;
-	  line-height: 26px;
-	  display: block;
-	  font-size: 10px;
-	  margin-bottom: 0px;
-	}
-	.vue-switcher input {
-	  position: absolute;
-	  left: 0px;
-	  top: 0px;
-	  width: 50px;
-	  height: 26px;
-	  line-height: 26px;
-	  opacity: 0;
-	  z-index: 1;
-	  cursor: pointer;
-	  margin: 0px !important;
-	}
-	.vue-switcher div {
-	  position: absolute;
-	  left: 0px;
-	  top: 8px;
-	  width: 40px;
-	  height: 10px;
-	  border-radius: 30px;
-	  display: -webkit-flex;
-	  display: -ms-flex;
-	  display: flex;
-	  align-items: center;
-	  justify-content: flex-start;
-	  cursor: pointer;
-	}
-	.vue-switcher div:after {
-	  position: absolute;
-	  top: -4;
-	  left: 100%;
-	  content: '';
-	  height: 18px;
-	  width: 18px;
-	  border-radius: 100px;
-	  display: block;
-	  transition: all ease 0.3s;
-	  margin-left: -17px;
-	  cursor: pointer;
-	}
-	.vue-switcher--unchecked div {
-	  justify-content: flex-end;
-	}
-	.vue-switcher--unchecked div:after {
-	  left: 15px;
-	}
-	.vue-switcher--disabled div {
-	  opacity: 0.3;
-	}
-	.vue-switcher--disabled input {
-	  cursor: not-allowed;
-	}
-	.vue-switcher--bold div {
-	  top: 0px;
-	  height: 26px;
-	  width: 50px;
-	}
-	.vue-switcher--bold div:after {
-	  margin-left: -22px;
-	  top: 4px;
-	}
-	.vue-switcher--bold--unchecked div:after {
-	  left: 26px;
-	}
-	.vue-switcher--bold .vue-switcher__label span {
-	  padding-bottom: 7px;
-	  display: inline-block;
-	}
-	.vue-switcher-theme--default.vue-switcher-color--default div {
-	  background-color: #b7b7b7;
-	}
-	.vue-switcher-theme--default.vue-switcher-color--default div:after {
-	  background-color: #9d9d9d;
-	}
-	.vue-switcher-theme--default.vue-switcher-color--default.vue-switcher--unchecked div {
-	  background-color: #aaa;
-	}
-	.vue-switcher-theme--default.vue-switcher-color--default.vue-switcher--unchecked div:after {
-	  background-color: #c4c4c4;
-	}
-	.vue-switcher-theme--default.vue-switcher-color--blue div {
-	  background-color: #77b0c8;
-	}
-	.vue-switcher-theme--default.vue-switcher-color--blue div:after {
-	  background-color: #539bb9;
-	}
-	.vue-switcher-theme--default.vue-switcher-color--blue.vue-switcher--unchecked div {
-	  background-color: #c0dae5;
-	}
-	.vue-switcher-theme--default.vue-switcher-color--blue.vue-switcher--unchecked div:after {
-	  background-color: #77b0c8;
-	}
-	.vue-switcher-theme--default.vue-switcher-color--red div {
-	  background-color: #c87777;
-	}
-	.vue-switcher-theme--default.vue-switcher-color--red div:after {
-	  background-color: #b95353;
-	}
-	.vue-switcher-theme--default.vue-switcher-color--red.vue-switcher--unchecked div {
-	  background-color: #e5c0c0;
-	}
-	.vue-switcher-theme--default.vue-switcher-color--red.vue-switcher--unchecked div:after {
-	  background-color: #c87777;
-	}
-	.vue-switcher-theme--default.vue-switcher-color--yellow div {
-	  background-color: #c9c377;
-	}
-	.vue-switcher-theme--default.vue-switcher-color--yellow div:after {
-	  background-color: #bab353;
-	}
-	.vue-switcher-theme--default.vue-switcher-color--yellow.vue-switcher--unchecked div {
-	  background-color: #e6e3c0;
-	}
-	.vue-switcher-theme--default.vue-switcher-color--yellow.vue-switcher--unchecked div:after {
-	  background-color: #c9c377;
-	}
-	.vue-switcher-theme--default.vue-switcher-color--orange div {
-	  background-color: #c89577;
-	}
-	.vue-switcher-theme--default.vue-switcher-color--orange div:after {
-	  background-color: #b97953;
-	}
-	.vue-switcher-theme--default.vue-switcher-color--orange.vue-switcher--unchecked div {
-	  background-color: #e5cec0;
-	}
-	.vue-switcher-theme--default.vue-switcher-color--orange.vue-switcher--unchecked div:after {
-	  background-color: #c89577;
-	}
-	.vue-switcher-theme--default.vue-switcher-color--green div {
-	  background-color: #77c88d;
-	}
-	.vue-switcher-theme--default.vue-switcher-color--green div:after {
-	  background-color: #53b96e;
-	}
-	.vue-switcher-theme--default.vue-switcher-color--green.vue-switcher--unchecked div {
-	  background-color: #c0e5ca;
-	}
-	.vue-switcher-theme--default.vue-switcher-color--green.vue-switcher--unchecked div:after {
-	  background-color: #77c88d;
-	}
+.vue-switcher {
+    position: relative;
+    display: inline-block;
+    width: 100px;
+    height: 26px;
+    line-height: 26px;
+    margin-bottom: 0px;
+    top: 7px;
+}
+.vue-switcher__label {
+    position: absolute;
+    left: 50px;
+    top: 0px;
+    height: 26px;
+    line-height: 26px;
+    display: block;
+    font-size: 10px;
+    margin-bottom: 0px;
+}
+.vue-switcher input {
+    position: absolute;
+    left: 0px;
+    top: 0px;
+    width: 50px;
+    height: 26px;
+    line-height: 26px;
+    opacity: 0;
+    z-index: 1;
+    cursor: pointer;
+    margin: 0px !important;
+}
+.vue-switcher div {
+    position: absolute;
+    left: 0px;
+    top: 8px;
+    width: 40px;
+    height: 10px;
+    border-radius: 30px;
+    display: -webkit-flex;
+    display: -ms-flex;
+    display: flex;
+    align-items: center;
+    justify-content: flex-start;
+    cursor: pointer;
+}
+.vue-switcher div:after {
+    position: absolute;
+    top: -4;
+    left: 100%;
+    content: "";
+    height: 18px;
+    width: 18px;
+    border-radius: 100px;
+    display: block;
+    transition: all ease 0.3s;
+    margin-left: -17px;
+    cursor: pointer;
+}
+.vue-switcher--unchecked div {
+    justify-content: flex-end;
+}
+.vue-switcher--unchecked div:after {
+    left: 15px;
+}
+.vue-switcher--disabled div {
+    opacity: 0.3;
+}
+.vue-switcher--disabled input {
+    cursor: not-allowed;
+}
+.vue-switcher--bold div {
+    top: 0px;
+    height: 26px;
+    width: 50px;
+}
+.vue-switcher--bold div:after {
+    margin-left: -22px;
+    top: 4px;
+}
+.vue-switcher--bold--unchecked div:after {
+    left: 26px;
+}
+.vue-switcher--bold .vue-switcher__label span {
+    padding-bottom: 7px;
+    display: inline-block;
+}
+.vue-switcher-theme--default.vue-switcher-color--default div {
+    background-color: #b7b7b7;
+}
+.vue-switcher-theme--default.vue-switcher-color--default div:after {
+    background-color: #9d9d9d;
+}
+.vue-switcher-theme--default.vue-switcher-color--default.vue-switcher--unchecked
+    div {
+    background-color: #aaa;
+}
+.vue-switcher-theme--default.vue-switcher-color--default.vue-switcher--unchecked
+    div:after {
+    background-color: #c4c4c4;
+}
+.vue-switcher-theme--default.vue-switcher-color--blue div {
+    background-color: #77b0c8;
+}
+.vue-switcher-theme--default.vue-switcher-color--blue div:after {
+    background-color: #539bb9;
+}
+.vue-switcher-theme--default.vue-switcher-color--blue.vue-switcher--unchecked
+    div {
+    background-color: #c0dae5;
+}
+.vue-switcher-theme--default.vue-switcher-color--blue.vue-switcher--unchecked
+    div:after {
+    background-color: #77b0c8;
+}
+.vue-switcher-theme--default.vue-switcher-color--red div {
+    background-color: #c87777;
+}
+.vue-switcher-theme--default.vue-switcher-color--red div:after {
+    background-color: #b95353;
+}
+.vue-switcher-theme--default.vue-switcher-color--red.vue-switcher--unchecked
+    div {
+    background-color: #e5c0c0;
+}
+.vue-switcher-theme--default.vue-switcher-color--red.vue-switcher--unchecked
+    div:after {
+    background-color: #c87777;
+}
+.vue-switcher-theme--default.vue-switcher-color--yellow div {
+    background-color: #c9c377;
+}
+.vue-switcher-theme--default.vue-switcher-color--yellow div:after {
+    background-color: #bab353;
+}
+.vue-switcher-theme--default.vue-switcher-color--yellow.vue-switcher--unchecked
+    div {
+    background-color: #e6e3c0;
+}
+.vue-switcher-theme--default.vue-switcher-color--yellow.vue-switcher--unchecked
+    div:after {
+    background-color: #c9c377;
+}
+.vue-switcher-theme--default.vue-switcher-color--orange div {
+    background-color: #c89577;
+}
+.vue-switcher-theme--default.vue-switcher-color--orange div:after {
+    background-color: #b97953;
+}
+.vue-switcher-theme--default.vue-switcher-color--orange.vue-switcher--unchecked
+    div {
+    background-color: #e5cec0;
+}
+.vue-switcher-theme--default.vue-switcher-color--orange.vue-switcher--unchecked
+    div:after {
+    background-color: #c89577;
+}
+.vue-switcher-theme--default.vue-switcher-color--green div {
+    background-color: #77c88d;
+}
+.vue-switcher-theme--default.vue-switcher-color--green div:after {
+    background-color: #53b96e;
+}
+.vue-switcher-theme--default.vue-switcher-color--green.vue-switcher--unchecked
+    div {
+    background-color: #c0e5ca;
+}
+.vue-switcher-theme--default.vue-switcher-color--green.vue-switcher--unchecked
+    div:after {
+    background-color: #77c88d;
+}
 </style>
 <!--<style lang="scss">
     /**

packages/time/src/Time.vue

@@ -4,8 +4,9 @@
 
 <script>
 
-module.exports = {
-  name: 'time',
+export default {
+  name: 'Time',
+
   props:[
     'modelValue',
     'readonly',
@@ -17,24 +18,9 @@ module.exports = {
     }
   },
 
-  methods: {
-    getTimeValue: function(value){
-      if(value != null && value.length == 8){
-        return value.substring(0, 5)
-      }else{
-        return value
-      }
-    },
-  },
-
-
-  components: {
-	    
-  },
-
   watch:{
     modelValue: {
-      handler(newValue, oldValue){
+      handler(newValue, oldValue){    // eslint-disable-line
         if(newValue != null && newValue != ''){
           this.innerValue = this.getTimeValue(newValue)
         }else{
@@ -44,7 +30,8 @@ module.exports = {
       immediate: true,
     },
 
-    innerValue: function(newValue, oldValue){
+
+    innerValue: function(newValue, oldValue){  // eslint-disable-line
       // 向外部发送事件通知
       let newValue1 = ''
       if(newValue == null || newValue == ''){
@@ -57,5 +44,15 @@ module.exports = {
       this.$emit('on-value-change', newValue1)
     },
   },
+
+  methods: {
+    getTimeValue: function(value){
+      if(value != null && value.length == 8){
+        return value.substring(0, 5)
+      }else{
+        return value
+      }
+    },
+  },
 }
 </script>

packages/time/src/vue-datepicker-setting.js

@@ -1,4 +1,4 @@
-module.exports = function () {
+export default function () {
     return {
         option: {
             type: '',

packages/tree/src/TreeViewNode.vue

@@ -1,100 +1,119 @@
 <template>
-  <ul :id="node.id" :class="{'root-node' : isRoot}">
+  <ul
+    :id="node.id"
+    :class="{'root-node' : isRoot}"
+  >
     <li :class="{'root-node' : isRoot}">
-      <span class="node-text icon expand-icon glyphicon" :class="{'glyphicon-plus-sign' : (isNodeOpen == false), 'glyphicon-minus-sign' : (isNodeOpen == true), 'glyphicon-leaf' : (isNodeOpen == undefined)}" @click="nodeExpand(node)" />
+      <span
+        class="node-text icon expand-icon glyphicon"
+        :class="{'glyphicon-plus-sign' : (isNodeOpen == false), 'glyphicon-minus-sign' : (isNodeOpen == true), 'glyphicon-leaf' : (isNodeOpen == undefined)}"
+        @click="nodeExpand(node)"
+      />
 
-      <span v-if="isShowCheck==undefined || isShowCheck" class="glyphicon select-node" :class="{'selected-node' : node.selected, 'glyphicon-check' : node.selected, 'glyphicon-unchecked' : !node.selected}" @click="nodeSelect(node)" />
+      <span
+        v-if="isShowCheck==undefined || isShowCheck"
+        class="glyphicon select-node"
+        :class="{'selected-node' : node.selected, 'glyphicon-check' : node.selected, 'glyphicon-unchecked' : !node.selected}"
+        @click="nodeSelect(node)"
+      />
 
       <font>{{ node.text }}</font>
 
-      <TreeViewNode v-for="childrenNode in node.childrenDatas" v-if="node.open && node.childrenDatas != undefined && node.childrenDatas.length > 0" :node="childrenNode" :is-show-check="childrenNode.isShowCheck" @nodeExpand="nodeExpand" @nodeSelect="nodeSelect" />
+      <TreeViewNode
+        v-for="childrenNode in node.childrenDatas"
+        v-if="node.open && node.childrenDatas != undefined && node.childrenDatas.length > 0"
+        :node="childrenNode"
+        :is-show-check="childrenNode.isShowCheck"
+        @nodeExpand="nodeExpand"
+        @nodeSelect="nodeSelect"
+      />
     </li>
-  </ul> 
+  </ul>
 </template>
 
 <script>
 
-module.exports = {
-	   name: 'TreeViewNode',
-	   props: ['node', 'isShowCheck', 'isRoot'],
-	   data: function(){
-		   return {
-		   }  
-	   },
-	   components: {
-		   
-	   },
-	   methods:{
-		   nodeExpand: function(node){
-			   if(node === this.node){
-				   this.node.open = !this.node.open
-			   }
-			   // 触发父组件的事件
-			   // if(node.open){
-				   this.$emit('nodeExpand', node)
-			   // }
-		   },
-
-		   nodeSelect: function(node){
-			   this.$emit('nodeSelect', node)
-		   },
-		   
-	   },
-
-	   computed:{
-		   // 节点是否打开
-		   isNodeOpen : function(){
-			   if(this.node.childrenDatas == undefined || this.node.childrenDatas.length == 0){
-				   console.log(this.node.text + '无子节点')
-				   return undefined
-			   }else {
-				   console.log(this.node.text + '有子节点' + this.node.open)
-				   return this.node.open == true
-			   }
-			  
-		   },
-	   },
-	   
-	   mounted: function(){
-
-	   },
+export default {
+  name: 'TreeViewNode',
+  components: {
+
+  },
+  props: ['node', 'isShowCheck', 'isRoot'],
+  data: function () {
+    return {
+    }
+  },
+
+  computed: {
+    // 节点是否打开
+    isNodeOpen: function () {
+      if (this.node.childrenDatas == undefined || this.node.childrenDatas.length == 0) {
+        console.log(this.node.text + '无子节点')
+        return undefined
+      } else {
+        console.log(this.node.text + '有子节点' + this.node.open)
+        return this.node.open == true
+      }
+
+    },
+  },
+
+  mounted: function () {
+
+  },
+  methods: {
+    nodeExpand: function (node) {
+      if (node === this.node) {
+        this.node.open = !this.node.open
+      }
+      // 触发父组件的事件
+      // if(node.open){
+      this.$emit('nodeExpand', node)
+      // }
+    },
+
+    nodeSelect: function (node) {
+      this.$emit('nodeSelect', node)
+    },
+
+  },
 }
 </script>
 
 <style scoped>
-   .root-node {
-	   margin-left: 0px;
-	   padding-left: 0px;
-	   text-align: left;
-   }
-
-   .node-text{
-	   height: 30px;
-	   line-height: 40px !important;
-   }
-
-   .node-text:hover {
-	   cursor: pointer;
-   }
-
-   ul{
-	   padding-left: 10px;
-   }
-
-   li{
-	   padding-left: 10px;
-	   list-style: none;
-   }
-
-   .select-node{
-	   cursor: pointer;
-	   color: #0066FF;
-	   font-size: large;
-   }
-   
-   .selected-node {
-	   cursor: pointer;
-	   color: #0066FF;
-	   font-size: large;
-   }
+.root-node {
+    margin-left: 0px;
+    padding-left: 0px;
+    text-align: left;
+}
+
+.node-text {
+    height: 30px;
+    line-height: 40px !important;
+}
+
+.node-text:hover {
+    cursor: pointer;
+}
+
+ul {
+    padding-left: 10px;
+}
+
+li {
+    padding-left: 10px;
+    list-style: none;
+}
+
+.select-node {
+    cursor: pointer;
+    color: #0066ff;
+    font-size: large;
+}
+
+.selected-node {
+    cursor: pointer;
+    color: #0066ff;
+    font-size: large;
+}
 </style>

packages/upload-widget/src/UploadWidget.vue

@@ -23,7 +23,7 @@
 
 <script>
 
-module.exports = {
+export default {
   name: 'UploadWidget',
   /**
 	 * fileType: 上传文件类型,eg:".xls,.doc,.txt,.pdf"
@@ -38,17 +38,17 @@ module.exports = {
 
   methods: {
     /**
-         * 点击上传按钮事件
-         * @return {[type]} [description]
-         */
+     * 点击上传按钮事件
+     * @return {[type]} [description]
+     */
     clickButton: function () {
       $(this.$refs.fileInput).click()
     },
 
     /**
-         * 选择了文件事件
-         * @return {[type]} [description]
-         */
+     * 选择了文件事件
+     * @return {[type]} [description]
+     */
     onFileChange: function (e) {
       var files = e.target.files || e.dataTransfer.files
       if (!files.length)

packages/vue-datepicker/src/vue-datepicker.vue

@@ -1,52 +1,146 @@
 <template>
   <div class="cov-vue-date">
     <div class="datepickbox">
-      <input v-model="date.time" type="text" title="input date" class="cov-datepicker" :readonly="readonly" :disabled="readonly" :placeholder="option.placeholder" :required="required" :style="option.inputStyle ? option.inputStyle : {}" @click="showCheck" @foucus="showCheck" />
-      <span v-if="readonly != true && readonly != 'true'" class="glyphicon glyphicon-remove-circle btn-remove" @click="date.time = ''; $emit('change', '')" />
+      <input
+        v-model="date.time"
+        type="text"
+        title="input date"
+        class="cov-datepicker"
+        :readonly="readonly"
+        :disabled="readonly"
+        :placeholder="option.placeholder"
+        :required="required"
+        :style="option.inputStyle ? option.inputStyle : {}"
+        @click="showCheck"
+        @foucus="showCheck"
+      />
+      <span
+        v-if="readonly != true && readonly != 'true'"
+        class="glyphicon glyphicon-remove-circle btn-remove"
+        @click="date.time = ''; $emit('change', '')"
+      />
     </div>
-    <div v-if="showInfo.check && readonly != true && readonly != 'true'" class="datepicker-overlay" :style="{'background' : option.overlayOpacity? 'rgba(0,0,0,'+option.overlayOpacity+')' : 'rgba(0,0,0,0.5)'}" @click="dismiss($event)">
-      <div class="cov-date-body" :style="{'background-color': option.color ? option.color.header : '#3f51b5'}">
+    <div
+      v-if="showInfo.check && readonly != true && readonly != 'true'"
+      class="datepicker-overlay"
+      :style="{'background' : option.overlayOpacity? 'rgba(0,0,0,'+option.overlayOpacity+')' : 'rgba(0,0,0,0.5)'}"
+      @click="dismiss($event)"
+    >
+      <div
+        class="cov-date-body"
+        :style="{'background-color': option.color ? option.color.header : '#3f51b5'}"
+      >
         <div class="cov-date-monthly">
-          <div class="cov-date-previous" @click="nextMonth('pre')">«</div>
-          <div class="cov-date-caption" :style="{'color': option.color ? option.color.headerText : '#fff'}">
+          <div
+            class="cov-date-previous"
+            @click="nextMonth('pre')"
+          >
+            «
+          </div>
+          <div
+            class="cov-date-caption"
+            :style="{'color': option.color ? option.color.headerText : '#fff'}"
+          >
             <span @click="showYear"><small>{{ checked.year }}</small></span>
             <br />
             <span @click="showMonth">{{ displayInfo.month }}</span>
           </div>
-          <div class="cov-date-next" @click="nextMonth('next')">»</div>
+          <div
+            class="cov-date-next"
+            @click="nextMonth('next')"
+          >
+            »
+          </div>
         </div>
-        <div v-if="showInfo.day" class="cov-date-box">
+        <div
+          v-if="showInfo.day"
+          class="cov-date-box"
+        >
           <div class="cov-picker-box">
             <div class="week">
               <ul>
-                <li v-for="weekie in library.week">{{ weekie }}</li>
+                <li v-for="weekie in library.week" :key="'weekie-' + weekie">{{ weekie }}</li>
               </ul>
             </div>
-            <div v-for="day in dayList" class="day" track-by="$index" :class="{'checked':day.checked,'unavailable':day.unavailable,'passive-day': !(day.inMonth)}" :style="day.checked ? (option.color && option.color.checkedDay ? { background: option.color.checkedDay } : { background: '#F50057' }) : {}" @click="checkDay(day)">{{ day.value }}</div>
+            <div
+              v-for="day in dayList"
+              :key="'day-' + day"
+              class="day"
+              track-by="$index"
+              :class="{'checked':day.checked,'unavailable':day.unavailable,'passive-day': !(day.inMonth)}"
+              :style="day.checked ? (option.color && option.color.checkedDay ? { background: option.color.checkedDay } : { background: '#F50057' }) : {}"
+              @click="checkDay(day)"
+            >
+              {{ day.value }}
+            </div>
           </div>
         </div>
-        <div v-if="showInfo.year" class="cov-date-box list-box">
-          <div id="yearList" class="cov-picker-box date-list">
-            <div v-for="yearItem in library.year" class="date-item" track-by="$index" @click="setYear(yearItem)">{{ yearItem }}</div>
+        <div
+          v-if="showInfo.year"
+          class="cov-date-box list-box"
+        >
+          <div
+            id="yearList"
+            class="cov-picker-box date-list"
+          >
+            <div
+              v-for="yearItem in library.year"
+              :key="'year-' + yearItem"
+              class="date-item"
+              track-by="$index"
+              @click="setYear(yearItem)"
+            >
+              {{ yearItem }}
+            </div>
           </div>
         </div>
-        <div v-if="showInfo.month" class="cov-date-box list-box">
+        <div
+          v-if="showInfo.month"
+          class="cov-date-box list-box"
+        >
           <div class="cov-picker-box date-list">
-            <div v-for="monthItem in library.month" class="date-item" track-by="$index" @click="setMonth(monthItem)">{{ monthItem }}</div>
+            <div
+              v-for="monthItem in library.month"
+              :key="'month-' + monthItem"
+              class="date-item"
+              track-by="$index"
+              @click="setMonth(monthItem)"
+            >
+              {{ monthItem }}
+            </div>
           </div>
         </div>
-        <div v-if="showInfo.hour" class="cov-date-box list-box">
+        <div
+          v-if="showInfo.hour"
+          class="cov-date-box list-box"
+        >
           <div class="cov-picker-box date-list">
             <div class="watch-box">
               <div class="hour-box">
                 <div class="mui-pciker-rule mui-pciker-rule-ft" />
                 <ul>
-                  <li v-for="hitem in hours" class="hour-item" :class="{'active':hitem.checked}" @click="setTime('hour', hitem, hours)">{{ hitem.value }}</li>
+                  <li
+                    v-for="hitem in hours"
+                    :key="'hour-' + hitem"
+                    class="hour-item"
+                    :class="{'active':hitem.checked}"
+                    @click="setTime('hour', hitem, hours)"
+                  >
+                    {{ hitem.value }}
+                  </li>
                 </ul>
               </div>
               <div class="min-box">
                 <div class="mui-pciker-rule mui-pciker-rule-ft" />
-                <div v-for="mitem in mins" class="min-item" :class="{'active':mitem.checked}" @click="setTime('min',mitem, mins)">{{ mitem.value }}</div>
+                <div
+                  v-for="mitem in mins"
+                  :key="'min-' + mitem"
+                  class="min-item"
+                  :class="{'active':mitem.checked}"
+                  @click="setTime('min',mitem, mins)"
+                >
+                  {{ mitem.value }}
+                </div>
               </div>
             </div>
           </div>
@@ -522,317 +616,317 @@ exports.default = {
 
 <style scoped>
 .datepicker-overlay {
-  position: fixed;
-  width: 100%;
-  height: 100%;
-  z-index: 998;
-  top: 0;
-  left: 0;
-  overflow: hidden;
-  -webkit-animation: fadein 0.5s;
-  /* Safari, Chrome and Opera > 12.1 */
-  -moz-animation: fadein 0.5s;
-  /* Firefox < 16 */
-  -ms-animation: fadein 0.5s;
-  /* Internet Explorer */
-  -o-animation: fadein 0.5s;
-  /* Opera < 12.1 */
-  animation: fadein 0.5s;
+    position: fixed;
+    width: 100%;
+    height: 100%;
+    z-index: 998;
+    top: 0;
+    left: 0;
+    overflow: hidden;
+    -webkit-animation: fadein 0.5s;
+    /* Safari, Chrome and Opera > 12.1 */
+    -moz-animation: fadein 0.5s;
+    /* Firefox < 16 */
+    -ms-animation: fadein 0.5s;
+    /* Internet Explorer */
+    -o-animation: fadein 0.5s;
+    /* Opera < 12.1 */
+    animation: fadein 0.5s;
 }
 @keyframes fadein {
-  from {
-    opacity: 0;
-  }
-  to {
-    opacity: 1;
-  }
+    from {
+        opacity: 0;
+    }
+    to {
+        opacity: 1;
+    }
 }
 /* Firefox < 16 */
 @-moz-keyframes fadein {
-  from {
-    opacity: 0;
-  }
-  to {
-    opacity: 1;
-  }
+    from {
+        opacity: 0;
+    }
+    to {
+        opacity: 1;
+    }
 }
 /* Safari, Chrome and Opera > 12.1 */
 @-webkit-keyframes fadein {
-  from {
-    opacity: 0;
-  }
-  to {
-    opacity: 1;
-  }
+    from {
+        opacity: 0;
+    }
+    to {
+        opacity: 1;
+    }
 }
 /* Internet Explorer */
 @-ms-keyframes fadein {
-  from {
-    opacity: 0;
-  }
-  to {
-    opacity: 1;
-  }
+    from {
+        opacity: 0;
+    }
+    to {
+        opacity: 1;
+    }
 }
 /* Opera < 12.1 */
 @-o-keyframes fadein {
-  from {
-    opacity: 0;
-  }
-  to {
-    opacity: 1;
-  }
+    from {
+        opacity: 0;
+    }
+    to {
+        opacity: 1;
+    }
 }
 .cov-date-body {
-  display: inline-block;
-  background: #3F51B5;
-  overflow: hidden;
-  position: relative;
-  font-size: 16px;
-  font-family: 'Roboto';
-  font-weight: 400;
-  position: fixed;
-  display: block;
-  width: 400px;
-  max-width: 100%;
-  z-index: 999;
-  top: 50%;
-  left: 50%;
-  -webkit-transform: translate(-50%, -50%);
-  -ms-transform: translate(-50%, -50%);
-  transform: translate(-50%, -50%);
-  box-shadow: 0 1px 3px 0 rgba(0, 0, 0, 0.2);
+    display: inline-block;
+    background: #3f51b5;
+    overflow: hidden;
+    position: relative;
+    font-size: 16px;
+    font-family: "Roboto";
+    font-weight: 400;
+    position: fixed;
+    display: block;
+    width: 400px;
+    max-width: 100%;
+    z-index: 999;
+    top: 50%;
+    left: 50%;
+    -webkit-transform: translate(-50%, -50%);
+    -ms-transform: translate(-50%, -50%);
+    transform: translate(-50%, -50%);
+    box-shadow: 0 1px 3px 0 rgba(0, 0, 0, 0.2);
 }
 .cov-picker-box {
-  background: #fff;
-  width: 100%;
-  display: inline-block;
-  padding: 25px;
-  box-sizing: border-box !important;
-  -moz-box-sizing: border-box !important;
-  -webkit-box-sizing: border-box !important;
-  -ms-box-sizing: border-box !important;
-  width: 400px;
-  max-width: 100%;
-  height: 280px;
-  text-align: start!important;
+    background: #fff;
+    width: 100%;
+    display: inline-block;
+    padding: 25px;
+    box-sizing: border-box !important;
+    -moz-box-sizing: border-box !important;
+    -webkit-box-sizing: border-box !important;
+    -ms-box-sizing: border-box !important;
+    width: 400px;
+    max-width: 100%;
+    height: 280px;
+    text-align: start !important;
 }
 .cov-picker-box td {
-  height: 34px;
-  width: 34px;
-  padding: 0;
-  line-height: 34px;
-  color: #000;
-  background: #fff;
-  text-align: center;
-  cursor: pointer;
+    height: 34px;
+    width: 34px;
+    padding: 0;
+    line-height: 34px;
+    color: #000;
+    background: #fff;
+    text-align: center;
+    cursor: pointer;
 }
 .cov-picker-box td:hover {
-  background: #E6E6E6;
+    background: #e6e6e6;
 }
 table {
-  border-collapse: collapse;
-  border-spacing: 0;
-  width: 100%;
+    border-collapse: collapse;
+    border-spacing: 0;
+    width: 100%;
 }
 .day {
-  width: 14.2857143%;
-  display: inline-block;
-  text-align: center;
-  cursor: pointer;
-  height: 34px;
-  padding: 0;
-  line-height: 34px;
-  color: #000;
-  background: #fff;
-  vertical-align: middle;
+    width: 14.2857143%;
+    display: inline-block;
+    text-align: center;
+    cursor: pointer;
+    height: 34px;
+    padding: 0;
+    line-height: 34px;
+    color: #000;
+    background: #fff;
+    vertical-align: middle;
 }
 .week ul {
-  margin: 0 0 8px;
-  padding: 0;
-  list-style: none;
+    margin: 0 0 8px;
+    padding: 0;
+    list-style: none;
 }
 .week ul li {
-  width: 14.2%;
-  display: inline-block;
-  text-align: center;
-  background: transparent;
-  color: #000;
-  font-weight: bold;
+    width: 14.2%;
+    display: inline-block;
+    text-align: center;
+    background: transparent;
+    color: #000;
+    font-weight: bold;
 }
 .passive-day {
-  color: #bbb;
+    color: #bbb;
 }
 .checked {
-  background: #F50057;
-  color: #FFF !important;
-  border-radius: 3px;
+    background: #f50057;
+    color: #fff !important;
+    border-radius: 3px;
 }
 .unavailable {
-  color: #ccc;
-  cursor: not-allowed;
+    color: #ccc;
+    cursor: not-allowed;
 }
 .cov-date-monthly {
-  height: 150px;
+    height: 150px;
 }
 .cov-date-monthly > div {
-  display: inline-block;
-  padding: 0;
-  margin: 0;
-  vertical-align: middle;
-  color: #fff;
-  height: 150px;
-  float: left;
-  text-align: center;
-  cursor: pointer;
+    display: inline-block;
+    padding: 0;
+    margin: 0;
+    vertical-align: middle;
+    color: #fff;
+    height: 150px;
+    float: left;
+    text-align: center;
+    cursor: pointer;
 }
 .cov-date-previous,
 .cov-date-next {
-  position: relative;
-  width: 20% !important;
-  text-indent: -300px;
-  overflow: hidden;
-  color: #fff;
+    position: relative;
+    width: 20% !important;
+    text-indent: -300px;
+    overflow: hidden;
+    color: #fff;
 }
 .cov-date-caption {
-  width: 60%;
-  padding: 50px 0!important;
-  box-sizing: border-box;
-  font-size: 24px;
+    width: 60%;
+    padding: 50px 0 !important;
+    box-sizing: border-box;
+    font-size: 24px;
 }
 .cov-date-caption span:hover {
-  color: rgba(255, 255, 255, 0.7);
+    color: rgba(255, 255, 255, 0.7);
 }
 .cov-date-previous:hover,
 .cov-date-next:hover {
-  background: rgba(255, 255, 255, 0.1);
+    background: rgba(255, 255, 255, 0.1);
 }
 .day:hover {
-  background: #EAEAEA;
+    background: #eaeaea;
 }
 .unavailable:hover {
-  background: none;
+    background: none;
 }
 .checked:hover {
-  background: #FF4F8E;
+    background: #ff4f8e;
 }
 .cov-date-next::before,
 .cov-date-previous::before {
-  width: 20px;
-  height: 2px;
-  text-align: center;
-  position: absolute;
-  background: #fff;
-  top: 50%;
-  margin-top: -7px;
-  margin-left: -7px;
-  left: 50%;
-  line-height: 0;
-  content: '';
-  -webkit-transform: rotate(45deg);
-  -moz-transform: rotate(45deg);
-  transform: rotate(45deg);
+    width: 20px;
+    height: 2px;
+    text-align: center;
+    position: absolute;
+    background: #fff;
+    top: 50%;
+    margin-top: -7px;
+    margin-left: -7px;
+    left: 50%;
+    line-height: 0;
+    content: "";
+    -webkit-transform: rotate(45deg);
+    -moz-transform: rotate(45deg);
+    transform: rotate(45deg);
 }
 .cov-date-next::after,
 .cov-date-previous::after {
-  width: 20px;
-  height: 2px;
-  text-align: center;
-  position: absolute;
-  background: #fff;
-  margin-top: 6px;
-  margin-left: -7px;
-  top: 50%;
-  left: 50%;
-  line-height: 0;
-  content: '';
-  -webkit-transform: rotate(-45deg);
-  -moz-transform: rotate(-45deg);
-  transform: rotate(-45deg);
+    width: 20px;
+    height: 2px;
+    text-align: center;
+    position: absolute;
+    background: #fff;
+    margin-top: 6px;
+    margin-left: -7px;
+    top: 50%;
+    left: 50%;
+    line-height: 0;
+    content: "";
+    -webkit-transform: rotate(-45deg);
+    -moz-transform: rotate(-45deg);
+    transform: rotate(-45deg);
 }
 .cov-date-previous::after {
-  -webkit-transform: rotate(45deg);
-  -moz-transform: rotate(45deg);
-  transform: rotate(45deg);
+    -webkit-transform: rotate(45deg);
+    -moz-transform: rotate(45deg);
+    transform: rotate(45deg);
 }
 .cov-date-previous::before {
-  -webkit-transform: rotate(-45deg);
-  -moz-transform: rotate(-45deg);
-  transform: rotate(-45deg);
+    -webkit-transform: rotate(-45deg);
+    -moz-transform: rotate(-45deg);
+    transform: rotate(-45deg);
 }
 .date-item {
-  text-align: center;
-  font-size: 20px;
-  padding: 10px 0;
-  cursor: pointer;
+    text-align: center;
+    font-size: 20px;
+    padding: 10px 0;
+    cursor: pointer;
 }
 .date-item:hover {
-  background: #e0e0e0;
+    background: #e0e0e0;
 }
 .date-list {
-  overflow: auto;
-  vertical-align: top;
-  padding: 0;
+    overflow: auto;
+    vertical-align: top;
+    padding: 0;
 }
 .cov-vue-date {
-  display: inline-block;
-  color: #5D5D5D;
+    display: inline-block;
+    color: #5d5d5d;
 }
 .button-box {
-  background: #fff;
-  vertical-align: top;
-  height: 50px;
-  line-height: 50px;
-  text-align: right;
-  padding-right: 20px;
+    background: #fff;
+    vertical-align: top;
+    height: 50px;
+    line-height: 50px;
+    text-align: right;
+    padding-right: 20px;
 }
 .button-box span {
-  cursor: pointer;
-  padding: 10px 20px;
+    cursor: pointer;
+    padding: 10px 20px;
 }
 .watch-box {
-  height: 100%;
-  overflow: hidden;
+    height: 100%;
+    overflow: hidden;
 }
 .hour-box,
 .min-box {
-  display: inline-block;
-  width: 50%;
-  text-align: center;
-  height: 100%;
-  overflow: auto;
-  float: left;
+    display: inline-block;
+    width: 50%;
+    text-align: center;
+    height: 100%;
+    overflow: auto;
+    float: left;
 }
 .hour-box ul,
 .min-box ul {
-  list-style: none;
-  margin: 0;
-  padding: 0;
+    list-style: none;
+    margin: 0;
+    padding: 0;
 }
 .hour-item,
 .min-item {
-  padding: 10px;
-  font-size: 36px;
-  cursor: pointer;
+    padding: 10px;
+    font-size: 36px;
+    cursor: pointer;
 }
 .hour-item:hover,
 .min-item:hover {
-  background: #E3E3E3;
+    background: #e3e3e3;
 }
 .hour-box .active,
 .min-box .active {
-  background: #F50057;
-  color: #FFF !important;
+    background: #f50057;
+    color: #fff !important;
 }
 ::-webkit-scrollbar {
-  width: 2px;
+    width: 2px;
 }
 ::-webkit-scrollbar-track {
-  background: #E3E3E3;
+    background: #e3e3e3;
 }
 ::-webkit-scrollbar-thumb {
-  background: #C1C1C1;
-  border-radius: 2px;
+    background: #c1c1c1;
+    border-radius: 2px;
 }
 .btn-remove {
     float: right;
@@ -843,11 +937,9 @@ table {
     padding: 9px;
 }
 
-.cov-datepicker[disabled]{
+.cov-datepicker[disabled] {
     cursor: not-allowed;
     background-color: #eee !important;
     opacity: 1;
 }
-
-
 </style>

packages/vue-monthly-picker/src/VueMonthlyPicker.vue

@@ -138,6 +138,7 @@ export default {
         if (valueMoment && valueMoment.isValid()) {
           return valueMoment.format(this.dateFormat)
         }
+        return null
       } else {
         return this.placeHolder
       }

webpack.base.js

@@ -52,6 +52,7 @@ module.exports = {
   externals: {
     jQuery: 'window.$',
     jquery: 'window.$',
+    $: 'window.$',
     bootstrap: 'bootstrap',
     moment: 'moment',
   },