@beisen/m-calendar
========================

## 参数

### 1. 参数events
> events传入的必须是一个数组，数组的每个元素的格式 如下

```
{
  title: "时间1"   //事件名称
  ,start: new Date()  //事件开始时间
  ,end: new Date() //事件结束时间
}
```

### 2. 参数attribute
> attribute传入的必须是一个数组，数组的每个元素的格式 如下

```
{
  title: "时间1"
  ,time: new Date()  //绑定事件的属性
  ,color: {
    titleColor: "#dddddd" ／／
    ,dateColor: "#333"  //日期数字颜色
    ,eventColor: "#333"  //事件颜色
  }
}
```

### 3. 参数onSelectEvent
> 点击某一天时，调用这个方法,方法的参数如下：

```
/*
date  //点击的日期
event //点击当天要进行的事件
attribute  //当天的属性
*/
（date,event，attribute)=>{   // 日期选择事件
  	
 }
```

<Calendar
  {...this.props}
  events={events}
  date={ this.state.date }
  defaultDate={ this.state.date }
  onSelectEvent={(date,event,attribute)=>{   // 日期选择事件
  	this.setState({date:date})
  }}
  onSwipeLeft = {
  this.onChange.bind(this,1)
  } 
  onSwipeRight = {
     this.onChange.bind(this, -1)
  } 
  components={{
    header : WeekHeader  //自定义日历头部
    ,dateCell : DateCell //自定义每个日历单元格
  }}
/>
```

## 使用
```
import Calendar from '@beisen/m-calendar';
require('@beisen/m-calendar/lib/css/m-calendar.css');

<Calendar
  events={events}
  date={ this.state.date }
  defaultDate={ this.state.date }
  onSelectEvent={(date,event)=>{   // 日期选择事件
  	this.setState({date:date})
  }}
  onSwipeLeft = {
  this.onChange.bind(this,1)
  } 
  onSwipeRight = {
     this.onChange.bind(this, -1)
  } 
  components={{
    header : WeekHeader  //自定义日历头部
    ,dateCell : DateCell //自定义每个日历单元格
  }}
/>
```
## 运行

 ```
git clone git@gitlab.beisencorp.com:ux-cnpm/ux-m-calendar.git

npm install 

npm run start   
 
//访问 http://localhost:8080/app/
 ```