build: Travis CI automatic compilation

examples/dist/calendar/calendar.wxml

@@ -0,0 +1,29 @@
+<wxs src="./index.wxs" module="computed"></wxs>
+
+<template name="calendar">
+  <view class="calendar-container">
+    <header showTitle="{{ showTitle }}" showSubtitle="{{ showSubtitle }}" title="{{ title }}" subTitle="{{ subTitle }}"></header>
+    <scroll-view class="calendar-body-wrap" scroll-y scroll-into-view="{{ scrollIntoViewIndex }}">
+      <mounth
+        wx:for="{{ computed.getMonths(minDate, maxDate) }}"
+        wx:key="index"
+        id="month{{ index }}"
+        class="month"
+        data-date="{{ item }}"
+        date="{{ item }}"
+        minDate="{{ minDate }}"
+        maxDate="{{ maxDate }}"
+        currentDate="{{ currentDate }}"
+        type="{{ type }}"
+        bind:clickDay="clickDay"
+        showMonthTitle="{{ index !== 0 }}"
+        formatter="{{ formatter }}"
+        color="{{ color }}"
+      >
+      </mounth>
+    </scroll-view>
+    <view>
+      <l-button type="default" size="long" bind:lintap="onClickConfirm" bg-color="{{ color }}">{{confirmText}}</l-button>
+    </view>
+  </view>
+</template>

examples/dist/calendar/components/day/index.js

@@ -0,0 +1,16 @@
+Component({
+  data: {},
+  properties: {
+    text: null,
+    topInfo: null,
+    bottomInfo: null,
+    type: null,
+    color: {
+      type: String,
+      value: ''
+    }
+  },
+  methods: {
+
+  }
+});

examples/dist/calendar/components/day/index.json

@@ -0,0 +1,3 @@
+{
+  "component": true
+}

examples/dist/calendar/components/day/index.wxml

@@ -0,0 +1,8 @@
+<wxs src="./index.wxs" module="computed"></wxs>
+<view class="calendar-day-container {{ type }}" 
+  style="{{ computed.getDayStyle(type, color) }}"
+>
+  <view class="top">{{ topInfo }}</view>
+  <view class="text">{{ text }}</view>
+  <view class="bottom">{{ bottomInfo }}</view>
+</view>

examples/dist/calendar/components/day/index.wxs

@@ -0,0 +1,27 @@
+function getDayStyle(type, color) {
+  var style = [];
+
+  if (color) {
+    if (
+      type === 'start' ||
+      type === 'end' ||
+      type === 'selected'
+    ) {
+      style.push(['background', color]);
+    } else if (type === 'middle') {
+      style.push(['color', color]);
+      // style.push(['background', color]);
+      // style.push(['opacity', '0.1']);
+    }
+  }
+
+  return style
+    .map(function(item) {
+      return item.join(':');
+    })
+    .join(';');
+}
+
+module.exports = {
+  getDayStyle: getDayStyle,
+};

examples/dist/calendar/components/day/index.wxss

@@ -0,0 +1 @@
+.calendar-day-container{display:flex;flex-direction:column;height:100%;align-items:center;position:relative;color:#666}.calendar-day-container.selected{background-color:#3963bc;color:#fff;border-radius:8rpx}.calendar-day-container.start{background-color:#3963bc;color:#fff;border-radius:8rpx}.calendar-day-container.end{background-color:#3963bc;color:#fff;border-radius:8rpx}.calendar-day-container.disabled{color:#c8c9cc;cursor:default;background:#fff}.calendar-day-container.middle{color:#3963bc}.calendar-day-container.middle::after{position:absolute;top:0;right:0;bottom:0;left:0;background-color:currentColor;opacity:.1;content:''}.calendar-day-container .top{height:24rpx;line-height:24rpx;font-size:16rpx}.calendar-day-container .text{flex:1;font-size:32rpx}.calendar-day-container .bottom{height:24rpx;line-height:24rpx;font-size:16rpx}

examples/dist/calendar/components/header/index.js

@@ -0,0 +1,15 @@
+Component({
+  data: {
+    weekdays: ['日', '一', '二', '三', '四', '五', '六']
+  },
+  properties: {
+    title: {
+      type: String,
+      value: '日期选择'
+    },
+    subTitle: String,
+    showTitle: Boolean,
+    showSubtitle: Boolean
+  },
+  methods: {}
+});

examples/dist/calendar/components/header/index.json

@@ -0,0 +1,3 @@
+{
+  "component": true
+}

examples/dist/calendar/components/header/index.wxml

@@ -0,0 +1,20 @@
+<view class="calendar-header-container">
+  <block wx:if="{{ showTitle }}">
+    <!-- <view class="calendar-header-container_title">
+      <slot name="title"></slot>
+    </view> -->
+   <view class="calendar-header-container_title">
+      {{ title }}
+    </view>
+  </block>
+
+  <view wx:if="{{ showSubtitle }}" class="calendar-header-container_subtitle">
+    {{ subTitle }}
+  </view>
+
+  <view class="calendar-header__weekdays">
+    <view wx:for="{{ weekdays }}" wx:key="index" class="calendar-header__weekday">
+      {{ item }}
+    </view>
+  </view>
+</view>

examples/dist/calendar/components/header/index.wxss

@@ -0,0 +1 @@
+.calendar-header-container .calendar-header-container_title{text-align:center;padding:20rpx 0;font-size:36rpx;line-height:44rpx}.calendar-header-container .calendar-header-container_subtitle{text-align:center;font-size:36rpx;line-height:44rpx;margin-bottom:30rpx}.calendar-header-container .calendar-header__weekdays{display:flex;justify-content:center;align-items:center;margin:0 20rpx;padding:10rpx 0;border-bottom:1rpx solid #f3f3f3}.calendar-header-container .calendar-header__weekdays .calendar-header__weekday{width:14.285%;text-align:center}

examples/dist/calendar/components/mounth/index.js

@@ -0,0 +1,194 @@
+import { compareDay, getMonthEndDay } from '../../util';
+import * as config from '../../config';
+Component({
+  data: {
+    days: []
+  },
+  properties: {
+    minDate: {
+      type: [Date,String,null],
+      // observer: 'setDays'
+    },
+    maxDate: {
+      type: [Date,String,null],
+      // observer: 'setDays'
+    },
+    formatter: {
+      type: null,
+      observer: 'setDays'
+    },
+    date: {
+      type: null,
+      observer: 'setDays'
+    },
+    currentDate: {
+      type: [null, Array],
+      observer() {
+        this.setDays();
+      }
+    },
+    type: {
+      type: String,
+      observer: 'setDays'
+    },
+    showMonthTitle: Boolean,
+    color: {
+      type: String,
+      value: ''
+    }
+  },
+  methods: {
+
+    /**
+     * 某一天的点击事件
+     */
+    onClick(event) {
+      const { item } = event.currentTarget.dataset;
+      if (item.type !== 'disabled' && item.type !== 'empty') {
+        this.triggerEvent('clickDay', item);
+      }
+    },
+    debounce(fn) {
+      let timer;
+      return () => {
+        let that = this;
+        let args =  arguments;
+        if(timer) clearTimeout(timer);
+        timer = setTimeout(function() {
+          fn.apply(that, args);
+        }, 300);
+      };
+    },
+    setDays() {
+      this.debounce(this.setDay)();
+    },
+    /**
+     * 设置某月分的天数
+     */
+    setDay() {
+      let days = [];
+      const startDate = new Date(this.data.date);
+      const year = startDate.getFullYear();
+      const month = startDate.getMonth();
+      const day = new Date(year, month, 1).getDay();
+
+      const totalDay = getMonthEndDay(year, month + 1);
+
+      for (let day = 1; day <= totalDay; day++) {
+        const date = new Date(year, month, day).getTime();
+        const type = this.getDayType(date);
+
+
+        let config = {
+          date,
+          type,
+          text: day,
+          bottomInfo: this.getBottomInfo(type),
+          topInfo: ''
+        };
+
+        if (this.data.formatter) {
+          config = this.data.formatter(config);
+        }
+        days.push(config);
+      }
+
+      for(let i = 0; i < day; i++) {
+        days.unshift({
+          type: 'empty'
+        });
+      }
+
+      this.setData({
+        days
+      });
+    },
+
+    isDateInCurrent(date) {
+      const { currentDate } = this.data;
+      return currentDate.some(item => {
+        return compareDay(item, date) === 0;
+      });
+    },
+
+    getMultipleDayType(date) {
+      const { currentDate } = this.data;
+
+      if (!Array.isArray(currentDate)) {
+        return '';
+      }
+
+      if (this.isDateInCurrent(date)) {
+        return 'selected';
+      }
+
+      return '';
+    },
+
+    getRangeDayType(day) {
+      const { currentDate } = this.data;
+      if (!Array.isArray(currentDate)) {
+        return;
+      }
+
+      const [startDay, endDay] = currentDate;
+
+      if (!startDay) {
+        return;
+      }
+      const compareToStart = compareDay(day, startDay);
+
+      if (!endDay) {
+        return compareToStart === 0 ? 'start' : '';
+      }
+
+      const compareToEnd = compareDay(day, endDay);
+
+      if (compareToStart === 0) {
+        return 'start';
+      }
+
+      if (compareToEnd === 0) {
+        return 'end';
+      }
+
+      if (compareToStart > 0 && compareToEnd < 0) {
+        return 'middle';
+      }
+    },
+
+    // date 循环的某一天
+    getDayType(date) {
+      const { type, minDate, maxDate, currentDate } = this.data;
+
+      if (compareDay(date, minDate) < 0 || compareDay(date, maxDate) > 0) {
+        return 'disabled';
+      }
+
+      if (type === config.TYPE_SINGLE) {
+        return compareDay(date, currentDate) === 0 ? 'selected' : '';
+      }
+
+      if (type === config.TYPE_MULTIPLE) {
+        return this.getMultipleDayType(date);
+      }
+
+      if (type === config.TYPE_RANGE) {
+        return this.getRangeDayType(date);
+      }
+    },
+
+    getBottomInfo(type) {
+      if (this.data.type === config.TYPE_RANGE) {
+        if (type === 'start') {
+          return '开始';
+        }
+        if (type === 'end') {
+          return '结束';
+        }
+        return '';
+      }
+      return '';
+    }
+  }
+});

examples/dist/calendar/components/mounth/index.json

@@ -0,0 +1,6 @@
+{
+  "component": true,
+  "usingComponents": {
+    "day":"../day/index"
+  }
+}

examples/dist/calendar/components/mounth/index.wxml

@@ -0,0 +1,24 @@
+<wxs src="./index.wxs" module="computed"></wxs>
+
+<view class="calendar-mounth-container">
+  <view class="title" wx:if="{{ showMonthTitle }}">
+    {{ computed.formatMonthTitle(date) }}
+  </view>
+  <view class="calendar-day-container">
+    <view class="calendar-day-wrap"
+      wx:for="{{ days }}" 
+      wx:key="index" 
+    >
+      <day
+        bind:tap="onClick"
+        data-item="{{ item }}"
+        wx:if="{{ item.type !== 'empty' }}"
+        text="{{ item.text }}" 
+        topInfo="{{ item.topInfo }}" 
+        bottomInfo="{{ item.bottomInfo }}"
+        type="{{ item.type }}"
+        color=" {{ color }}"
+      />
+    </view>
+  </view>
+</view>

examples/dist/calendar/components/mounth/index.wxs

@@ -0,0 +1,12 @@
+/* eslint-disable */
+
+function formatMonthTitle(date) {
+  date = getDate(date);
+  return date.getFullYear() + '年' + (date.getMonth() + 1) + '月';
+}
+
+
+
+module.exports = {
+  formatMonthTitle: formatMonthTitle
+};

examples/dist/calendar/components/mounth/index.wxss

@@ -0,0 +1 @@
+.calendar-mounth-container{color:#333;display:flex;flex-direction:column}.calendar-mounth-container .title{text-align:center;font-weight:800}.calendar-mounth-container .calendar-day-container{display:flex;flex-wrap:wrap}.calendar-mounth-container .calendar-day-container .calendar-day-wrap{width:14.285%}

examples/dist/calendar/config.js

@@ -0,0 +1,3 @@
+export const TYPE_SINGLE = 'single';
+export const TYPE_RANGE = 'range';
+export const TYPE_MULTIPLE = 'multiple';