eoss-mobiles 0.1.13

package/packages/count-down/src/main.vue

@@ -0,0 +1,27 @@
+<template>
+  <van-count-down v-bind="$attrs" ref="countDown" v-on="$listeners">
+    <template v-if="$scopedSlots.default" slot="default" slot-scope="timeData">
+      <slot name="default" :timeData="timeData" />
+    </template>
+  </van-count-down>
+</template>
+
+<script>
+export default {
+  name: 'EmCountDown',
+  inheritAttrs: false,
+  methods: {
+    start() {
+      this.$refs.countDown.start();
+    },
+    pause() {
+      this.$refs.countDown.pause();
+    },
+    reset() {
+      this.$refs.countDown.reset();
+    }
+  }
+};
+</script>
+
+<style></style>

package/packages/date/index.js

@@ -0,0 +1,5 @@
+import EmDate from './src/main';
+
+EmDate.install = Vue => Vue.component(EmDate.name, EmDate);
+
+export default EmDate;

package/packages/date/src/date-time.vue

@@ -0,0 +1,290 @@
+<template>
+  <!-- 弹出层 -->
+  <!-- 时间选择 -->
+  <van-picker
+    ref="picker"
+    show-toolbar
+    title="请选择时间"
+    :columns="columns"
+    @change="onChange"
+    @cancel="cancelOn"
+    @confirm="onConfirm"
+  >
+    <template slot="title">{{ title }}</template>
+  </van-picker>
+</template>
+<script>
+export default {
+  name: 'EmDateTime',
+  props: {
+    values: { type: [String, Object,Date] },
+    joinStr:{ type: String},
+    minDate:{ type: [String, Object,Date]},
+    maxDate:{ type: [String, Object,Date]},
+    title: { type: String, default: '请选择时间' }
+  },
+  data() {
+    return {
+      columns: [], //所有时间
+      Mdays: '', //弹窗关闭时月份所在值
+      Dindex: null
+    };
+  },
+  watch: {
+    isPicker(val) {
+      this.columns = [];
+      this.getcolumns();
+    },
+    values(val) {
+      if (val == '') {
+        this.Mdays = '';
+        this.Dindex = null;
+      }
+    }
+  },
+  mounted() {
+    this.columns = [];
+    this.getcolumns();
+  },
+  methods: {
+    getCountDays(year, month) {
+      //获取某年某月多少天
+      var day = new Date(year, month, 0);
+      return day.getDate();
+    },
+    getDateVal(date) {
+      var newY = date.getFullYear();
+      var newM = date.getMonth();
+      var newD = date.getDate();
+      var newh = date.getHours();
+      var newm = date.getMinutes();
+      var news = date.getSeconds();
+      return { newY, newM, newD, newh, newm, news };
+    },
+    getcolumns() {
+      const _that = this;
+      let newDate = this.values;
+      if (typeof this.values == 'string') {
+        newDate = newDate.replace('年', '/');
+        newDate = newDate.replace('月', '/');
+        newDate = newDate.replace('日', ' ');
+        newDate = newDate.replace('时', ':');
+        newDate = newDate.replace('分', ':');
+        newDate = newDate.replace('秒', '');
+        newDate = newDate.replace(/-/g, '/');
+        newDate = newDate.trim();
+      }
+      // var strtime = this.values;
+      var date = new Date(newDate);
+      var vmoduletime = date.getTime();
+      if (this.values != '') {
+        var vmoduledate = new Date(vmoduletime);
+      } else {
+        var vmoduledate = new Date(); //没有传入时间则默认当前时刻
+      }
+      var minY,
+        minM,
+        minD,
+        minh,
+        minm,
+        mins,
+        maxY,
+        maxM,
+        maxD,
+        maxh,
+        maxm,
+        maxs = '';
+      if (this.minDate) {
+        const { newY, newM, newD, newh, newm, news } = this.getDateVal(
+          this.minDate
+        );
+        minY = newY;
+        minM = newM;
+        minD = newD;
+        minh = newh;
+        minm = newm;
+        mins = news;
+      }
+      if (this.maxDate) {
+        const { newY, newM, newD, newh, newm, news } = this.getDateVal(
+          this.maxDate
+        );
+        maxY = newY;
+        maxM = newM;
+        maxD = newD;
+        maxh = newh;
+        maxm = newm;
+        maxs = news;
+      }
+
+      var Y = vmoduledate.getFullYear();
+      var M = vmoduledate.getMonth();
+      var D = vmoduledate.getDate();
+      var h = vmoduledate.getHours();
+      var m = vmoduledate.getMinutes();
+      var s = vmoduledate.getSeconds();
+      var year = {}; //获取前后十年数组
+      year.values = [];
+      var Currentday = new Date().getFullYear();
+      for (
+        var i = minY || Currentday - 10;
+        i < (maxY + 1 || Currentday + 10);
+        i++
+      ) {
+        year.values.push(i + (_that.joinStr ? '' : '年'));
+      }
+      year.defaultIndex = year.values.indexOf(Y + (_that.joinStr ? '' : '年')); //设置默认选项当前年
+      _that.columns.push(year);
+      var month = {}; //获取12月数组
+      month.defaultIndex = M;
+      month.values = Object.keys(Array.apply(null, { length: 13 })).map(
+        // function(item) {
+        //   if (
+        //     ((minM != undefined ? minM + Number(item) + 1 : '') ||
+        //       Number(item) + 1) <
+        //     (maxM + 1 <= 10 && maxM != undefined ? maxM+ 1 : 10)
+        //   ) {
+        //     return (
+        //       '0' +
+        //       (minM != undefined ? minM + Number(item) + 1 : Number(item) + 1) +
+        //       (_that.joinStr ? '' : '月')
+        //     );
+        //   } else if (
+        //     10 <=
+        //       ((minM != '' ? minM + Number(item) + 1 : '') ||
+        //         Number(item) + 1) &&
+        //     ((minM != '' ? minM + Number(item) + 1 : '') || Number(item) + 1) <
+        //      ( maxM
+        //       ? maxM + 2
+        //       : 12)
+        //   ) {
+        //     return (
+        //       (minM != undefined ? minM + Number(item) + 1 : Number(item) + 1) +
+        //       (_that.joinStr ? '' : '月')
+        //     );
+        //   }
+        //   // else {
+        //   //   return (+item + 0).toString() + (_that.joinStr ? '' : '月');
+        //   // }
+        // }
+        function(item) {
+          if (Number(item) < 10) {
+            return '0' + Number(item) + (_that.joinStr ? '' : '月');
+          } else if (10 <= Number(item)&& Number(item) <= 12) {
+            return Number(item)+ (_that.joinStr ? '' : '月');
+          }
+        }
+      );
+      month.values.splice(0, 1);
+      month.values = month.values.filter(x => x != undefined);
+      this.columns.push(month);
+      //获取当月的天数
+      var days = this.getCountDays(Y, this.Mdays == '' ? M + 1 : this.Mdays);
+      var day = {}; //创建当月天数数组
+      day.defaultIndex = this.Dindex == null ? D - 1 : this.Dindex;
+      day.values = Object.keys(Array.apply(null, { length: days + 1 })).map(
+        function(item) {
+          if (+item + 1 <= 10) {
+            return '0' + item + (_that.joinStr ? '' : '日');
+          } else if (+item + 1 == 11) {
+            return +item + (_that.joinStr ? '' : '日');
+          } else {
+            return (+item + 0).toString() + (_that.joinStr ? '' : '日');
+          }
+        }
+      );
+      day.values.splice(0, 1);
+      this.columns.push(day);
+      var hour = {}; //创建小时数组
+      hour.defaultIndex = h;
+      hour.values = Object.keys(Array.apply(null, { length: 24 })).map(function(
+        item
+      ) {
+        if (+item + 1 <= 10) {
+          return '0' + item + (_that.joinStr ? '' : '时');
+        } else if (+item + 1 == 11) {
+          return +item + (_that.joinStr ? '' : '时');
+        } else {
+          return (+item + 0).toString() + (_that.joinStr ? '' : '时');
+        }
+      });
+      this.columns.push(hour);
+      var mi = {}; //创建分钟数组
+      mi.defaultIndex = m;
+      mi.values = Object.keys(Array.apply(null, { length: 60 })).map(function(
+        item
+      ) {
+        if (+item + 1 <= 10) {
+          return '0' + item + (_that.joinStr ? '' : '分');
+        } else if (+item + 1 == 11) {
+          return +item + (_that.joinStr ? '' : '分');
+        } else {
+          return (+item + 0).toString() + (_that.joinStr ? '' : '分');
+        }
+      });
+      this.columns.push(mi);
+      var ss = {}; //创建秒数数组
+      ss.defaultIndex = s;
+      ss.values = Object.keys(Array.apply(null, { length: 60 })).map(function(
+        item
+      ) {
+        if (+item + 1 <= 10) {
+          return '0' + item + (_that.joinStr ? '' : '秒');
+        } else if (+item + 1 == 11) {
+          return +item + (_that.joinStr ? '' : '秒');
+        } else {
+          return (+item + 0).toString() + (_that.joinStr ? '' : '秒');
+        }
+      });
+      this.columns.push(ss);
+    },
+    onChange(values, a) {
+      const _that = this;
+      //a为所有列备选项值的数组
+      var days = this.getCountDays(a[0].substr(0, 4), a[1].substr(0, 2));
+      var newdays = {};
+      newdays.values = Object.keys(Array.apply(null, { length: days + 1 })).map(
+        function(item) {
+          if (+item + 1 <= 10) {
+            return '0' + item + (_that.joinStr ? '' : '日');
+          } else if (+item + 1 == 11) {
+            return +item + (_that.joinStr ? '' : '日');
+          } else {
+            return (+item + 0).toString() + (_that.joinStr ? '' : '日');
+          }
+        }
+      );
+      newdays.values.splice(0, 1);
+      this.$refs.picker.setColumnValues(2, newdays.values); //设置第三列的值
+      this.$refs.picker.setColumnIndex(2, a[2].substr(0, 2) - 1); //设置第三列索引
+    },
+    // 关闭弹框
+    confirmOn() {
+      var currentM = this.$refs.picker.getColumnValue(1);
+      this.Mdays = currentM.substr(0, 2);
+      this.Dindex = this.$refs.picker.getColumnIndex(2);
+    },
+    //时间选择器关闭
+    cancelOn() {
+      this.$emit('cancel');
+    },
+    // 时间选择器确定
+    onConfirm(val, index) {
+      var endval =
+        val[0].substr(0, 4) +
+        (this.joinStr || '年') +
+        val[1].substr(0, 2) +
+        (this.joinStr || '月') +
+        val[2].substr(0, 2) +
+        (this.joinStr ? ' ' : '日 ') +
+        val[3].substr(0, 2) +
+        (this.joinStr ? ':' : '时') +
+        val[4].substr(0, 2) +
+        (this.joinStr ? ':' : '分') +
+        val[5].substr(0, 2) +
+        (this.joinStr ? '' : '秒');
+      this.$emit('confirm', endval);
+    }
+  }
+};
+</script>

package/packages/date/src/main.vue

@@ -0,0 +1,319 @@
+<template>
+  <div class="em-date">
+    <em-input
+      readonly
+      clickable
+      v-bind="$attrs"
+      :label="label"
+      :value="pickerValue"
+      :label-align="labelAlign"
+      :input-align="inputAlign"
+      :label-width="labelWidth"
+      :center="center"
+      :required="required"
+      :hideLabel="hideLabel"
+      :disabled="disabled"
+      :placeholder="disabled ? '暂无数据' : placeholder || `请选择${label}`"
+      @click="handlePicker"
+    />
+    <van-popup v-model="showPicker" round @close="onCancel" position="bottom">
+      <EmDateTime
+        v-if="type == 'datetimeSecond'"
+        :values="value"
+        :joinStr="joinStr"
+        :title="label"
+        :min-date="$attrs['min-date']"
+        :max-date="$attrs['max-date']"
+        @confirm="onConfirm"
+        @cancel="() => (showPicker = false)"
+      />
+      <van-datetime-picker
+        v-else
+        show-toolbar
+        v-model="newValue"
+        :loading="newLoading"
+        :type="type"
+        v-bind="$attrs"
+        v-on="$listeners"
+        @cancel="onCancel"
+        @confirm="onConfirm"
+      >
+        <template v-for="(index, name) in $slots" :slot="name">
+          <slot :name="name" />
+        </template>
+      </van-datetime-picker>
+    </van-popup>
+  </div>
+</template>
+
+<script>
+import EmDateTime from './date-time.vue';
+export default {
+  name: 'EmDate',
+  components: { EmDateTime },
+  inheritAttrs: false,
+  data() {
+    return {
+      showPicker: false,
+      newLoading: false,
+      changeValue: true,
+      newValueKey: '',
+      newValue: '',
+      lastValue: '',
+      dateValues: '',
+      newColumns: [],
+      newDefaultIndex: 0,
+      isOnConfirm: false,
+      count: 0,
+      pickerValue: ''
+    };
+  },
+  props: {
+    disabled: {
+      type: Boolean,
+      default: false
+    },
+    required: {
+      type: Boolean,
+      default: false
+    },
+    hideLabel:{
+      type:Boolean,
+      default: false
+    },
+    // 绑定值
+    value: {
+      type: [String, Array, Object, Date],
+      default: ''
+    },
+    // 展示标题
+    label: {
+      type: String,
+      default: '日期选择'
+    },
+    // 输入框占位提示文字
+    placeholder: {
+      type: String,
+      default: ''
+    },
+    // 多级选择展示拼接字符
+    joinStr: {
+      type: String,
+      default: undefined
+    },
+
+    loading: {
+      type: Boolean,
+      default: false
+    },
+    //左侧文本宽度
+    labelWidth: {
+      type: String
+    },
+    // 左侧文本对齐方式
+    labelAlign: {
+      type: String
+    },
+    // 右侧内容对齐方式
+    inputAlign: {
+      type: String
+    },
+    // 是否使内容垂直居中
+    center: {
+      type: Boolean
+    },
+    type:{
+      type:String,
+      default:'datetime'
+    }
+  },
+
+  watch: {
+    loading: {
+      handler(val) {
+        this.newLoading = val;
+      },
+      deep: true,
+      immediate: true
+    },
+    value: {
+      handler() {
+        this.changeValue && this.getValFun();
+      },
+      deep: true,
+      immediate: true
+    }
+  },
+
+  mounted() {
+    console.log(this.value,'asddd')
+    this.lastValue = this.value;
+  },
+  methods: {
+    getValFun(val) {
+      const _that = this;
+      if (_that.isOnConfirm) return;
+      if (!val) {
+        if (
+          (_that.value != undefined && _that.value) ||
+          (_that.value == undefined && _that.value)
+        ) {
+          console.log(1)
+          _that.pickerValue = _that.getValue(_that.value);
+        } else {
+          console.log(2)
+          _that.pickerValue = _that.value;
+        }
+      } else {
+          console.log(3)
+        _that.pickerValue = _that.getValue(_that.val);
+      }
+
+      const { type } = _that;
+      if (type === 'time') {
+        _that.newValue = _that.value != undefined ? _that.value : _that.value;
+        return;
+      }
+      // if(_that.count == 0 || _that.value != undefined) {
+      // _that.count++
+      let date = _that.value;
+      if (typeof date == 'string') {
+        if (type != 'year') {
+          date = date.replace('年', '/');
+        } else {
+          date = date.replace('年', '');
+        }
+        if (type == 'year-month') {
+          date = date.replace('月', '');
+        } else {
+          date = date.replace('月', '/');
+        }
+        date = date.replace('日', ' ');
+        date = date.replace('时', ':');
+        date = date.replace('分', ':');
+        date = date.replace('秒', '');
+
+        // date = date.replace(/-/g, '/');
+        date = date.trim();
+      }
+      _that.isOnConfirm = false;
+      _that.newValue =
+        date != undefined && date
+          ? new Date(date || '')
+          : date == undefined && _that.value
+          ? new Date(_that.value || '')
+          : new Date();
+      // }
+    },
+    onCancel() {
+      this.$emit('input', this.lastValue);
+      this.getValFun(this.lastValue);
+      this.showPicker = false;
+    },
+    onConfirm(value) {
+      this.showPicker = false;
+      this.pickerValue = this.getValue(value);
+      this.isOnConfirm = true;
+      this.lastValue = value;
+      this.changeValue = false;
+      console.log(this.pickerValue,'this.pickerValue')
+      console.log(this.value,'this.value')
+      this.$emit('input', this.pickerValue);
+      if (this.type === 'datetimeSecond') this.$emit('confirm');
+    },
+    getValue(val) {
+      const { type } = this;
+      let value = '';
+      if (!this.value && !val &&  this.value == undefined) return;
+      console.log(val,'1-1')
+      if ((val&& typeof val == 'string')) {
+        return val;
+      }
+      console.log('1-2')
+      if ((this.value&& typeof this.value == 'string')) {
+        return this.value;
+      }
+      let newValue =new Date(val || this.value) ;
+
+      if (typeof newValue == 'string') {
+        newValue = newValue.replace('年', '/');
+        newValue = newValue.replace('月', '/');
+        newValue = newValue.replace('日', ' ');
+        newValue = newValue.replace('时', ':');
+        newValue = newValue.replace('分', ':');
+        newValue = newValue.replace('秒', '');
+        newValue = newValue.replace(/-/g, '/');
+        newValue = newValue.trim();
+      }
+      let date = new Date(newValue);
+      let y = date.getFullYear();
+      let m =
+        date.getMonth() + 1 < 10
+          ? '0' + (date.getMonth() + 1)
+          : date.getMonth() + 1;
+      let d = date.getDate() < 10 ? '0' + date.getDate() : date.getDate();
+      let h = date.getHours() < 10 ? '0' + date.getHours() : date.getHours();
+      let minute =
+        date.getMinutes() < 10 ? '0' + date.getMinutes() : date.getMinutes();
+      let s =
+        date.getSeconds() < 10 ? '0' + date.getSeconds() : date.getSeconds();
+      if (type == 'date' && newValue != 'Invalid Date') {
+        value =
+          y +
+          (this.joinStr || '年') +
+          m +
+          (this.joinStr || '月') +
+          d +
+          (this.joinStr ? ' ' : '日 ');
+      } else if (type === 'year-month' && newValue != 'Invalid Date') {
+        value = y + (this.joinStr || '年') + m + (this.joinStr ? ' ' : '月');
+      } else if (type === 'month-day' && newValue != 'Invalid Date') {
+        value = m + (this.joinStr || '月') + d + (this.joinStr ? ' ' : '日');
+      } else if (type === 'time' && newValue.split(':').length >= 2) {
+        let time = [newValue.split(':')[0], newValue.split(':')[1]];
+        value = this.joinStr
+          ? time.join(':')
+          : time.join(':').replace(':', '时') + '分';
+      } else if (
+        (type === 'datetime' || type === 'datetimeSecond') &&
+        newValue != 'Invalid Date'
+      ) {
+        value =
+          y +
+          (this.joinStr || '年') +
+          m +
+          (this.joinStr || '月') +
+          d +
+          (this.joinStr ? ' ' : '日 ') +
+          h +
+          (this.joinStr ? ':' : '时') +
+          minute +
+          (this.joinStr ? (type === 'datetimeSecond' ? ':' : '') : '分') +
+          (type === 'datetimeSecond' ? s + (this.joinStr ? '' : '秒') : '');
+      } else if (type === 'datehour' && newValue != 'Invalid Date') {
+        value =
+          y +
+          (this.joinStr || '年') +
+          m +
+          (this.joinStr || '月') +
+          d +
+          (this.joinStr ? ' ' : '日 ') +
+          h +
+          (this.joinStr ? ' ' : '时');
+      } else if (type === 'year' && newValue != 'Invalid Date') {
+        value = y + (this.joinStr ? '' : '年');
+      }
+      return value;
+    },
+
+    handlePicker() {
+      if (this.disabled) return;
+      this.showPicker = true;
+
+      this.$emit('showPicker');
+    }
+  }
+};
+</script>
+
+<style></style>

package/packages/empty/index.js

@@ -0,0 +1,5 @@
+import EmEmpty from './src/main';
+
+EmEmpty.install = Vue => Vue.component(EmEmpty.name, EmEmpty);
+
+export default EmEmpty;

package/packages/empty/src/main.vue

@@ -0,0 +1,16 @@
+<template>
+  <van-empty v-bind="$attrs" v-on="$listeners">
+    <template v-for="(index, name) in $slots" :slot="name">
+      <slot :name="name" />
+    </template>
+  </van-empty>
+</template>
+
+<script>
+export default {
+  name: 'EmEmpty',
+  inheritAttrs: false
+};
+</script>
+
+<style></style>

package/packages/field/index.js

@@ -0,0 +1,5 @@
+import EmInput from './src/main';
+
+EmInput.install = Vue => Vue.component(EmInput.name, EmInput);
+
+export default EmInput;