## 使用说明
#### 安装rview-c
`npm install rview-c`
## 使用组件示例
```javascript
<template>
<div>
<VueFullcalendar
ref="vueFullcalendar"
class="test-fc"
:events="fcEvents"
first-day='1' lang="zh"
@changeMonth="changeMonth"
@eventClick="eventClick"
@dayClick="dayClick"
@recordClick="recordClick"
@deletePaiclick="deletePaiclick"
@addPaibanclick="addPaibanclick"
@deleteMoreclick="deleteMoreclick"
@moreClick="moreClick">
<template slot="fc-event-card" slot-scope="p">
<p><i class="fa">sadfsd</i> {{ p.event.title }} test</p>
</template>
</VueFullcalendar>
</div>
</template>
<script>
let demoEvents = [{
"title": "钱钟书 24:00~06:00",
"start": "2019-12-30",
"end": "2019-12-30",
"cssClass": "family",
"dutyPeriods": "24:00~06:00",
"roomRowGuid": "警卫休息室1",
"phoneNumber": "",
"dutyId": "08465411-9f58-4ff4-ba43-820ae156624b"
}, {
"title": "张三 6:00~12:30",
"start": "2019-12-18",
"end": "2019-12-18",
"cssClass": "family",
"dutyPeriods": "6:00~12:30",
"roomRowGuid": "警卫休息室1",
"phoneNumber": "",
"dutyId": "0fe6a274-d7b8-4dcd-b8bf-954a8dfaf2a5"
}];
export default {
data () {
return {
dayData:[],
name:'Sunny!',
fcEvents : demoEvents
}
},
methods : {
'changeMonth' (start, end, current) {
console.log('changeMonth', start.format(), end.format(), current.format())
},
'eventClick' (event, jsEvent, pos) {
console.log('eventClick', event, jsEvent, pos)
},
'dayClick' (day, jsEvent) {
console.log('dayClick', day, jsEvent)
},
'moreClick' (day, events, jsEvent) {
alert("目前列表上只显示两条信息,查看更多,展示全部信息");
console.log('moreCLick', day, events, jsEvent)
},
'recordClick' (dayDate){
alert("交班记录只提供方法,具体功能由业务实现")
},
'deletePaiclick' (event){
this.$refs.vueFullcalendar.$refs.fcbody.selectThisDay(this.dayData)
},
'addPaibanclick' (day){
alert("新增排班只提供方法,具体功能由业务实现");
this.dayData=day;
},
'deleteMoreclick' (deleteList){
alert("批量删除只提供方法,具体功能由业务实现")
// this.$refs.vueFullcalendar.$refs.fcbody.selectThisDay(this.dayData)
}
},
}
</script>
<style lang='less'>
.app{
color:green;
}
</style>
```
## data
|参数名称 | 数据类型|说明 |是否必填
| ------------ |--------| ------------ |
|events |Array| 列表数据 |不必填
## methods
|方法名称 | 方法说明|
| ------------ |--------|
|changeMonth |修改日期执行的方法|
| eventClick |点击事项执行的方法|
| dayClick |点击某天执行的方法|
| recordClick |点击交班记录按钮执行的方法|
| deletePaiclick |点击删除按钮执行的方法|
| addPaibanclick |点击新增排班按钮执行的方法|
| deleteMoreclick |点击批量删除按钮执行的方法|