Jelajahi Sumber

修改日历组件,添加eventLimit的使用,使用方式

lrf402788946 5 tahun lalu
induk
melakukan
8b22c2e678
2 mengubah file dengan 9 tambahan dan 1 penghapusan
  1. 1 0
      components/calendar.md
  2. 8 1
      components/calendar.vue

+ 1 - 0
components/calendar.md

@@ -7,6 +7,7 @@
 |useDraft|Boolean|true|否|是否启用拖拽事件|
 |useDraft|Boolean|true|否|是否启用拖拽事件|
 |useEvent|Boolean|true|否|是否启用点击事件的事件|
 |useEvent|Boolean|true|否|是否启用点击事件的事件|
 |selfBtn|Object|{}|否|添加自定义按钮,下面说明|
 |selfBtn|Object|{}|否|添加自定义按钮,下面说明|
+|eventLimit|Boolean/Number|false|否|是否限制日历显示事件的数量|
 
 
 ##### events:
 ##### events:
 |事件名|说明|参数|参数说明|
 |事件名|说明|参数|参数说明|

+ 8 - 1
components/calendar.vue

@@ -6,7 +6,7 @@
       firstDay="1"
       firstDay="1"
       :editable="false"
       :editable="false"
       :droppable="false"
       :droppable="false"
-      :eventLimit="true"
+      :eventLimit="eventLimit"
       :defaultDate="defaultDate"
       :defaultDate="defaultDate"
       weekNumberCalculation="ISO"
       weekNumberCalculation="ISO"
       :customButtons="btn"
       :customButtons="btn"
@@ -26,6 +26,7 @@
       @select="drawSelect"
       @select="drawSelect"
       :eventOrder="`start`"
       :eventOrder="`start`"
       @eventClick="clickEvent"
       @eventClick="clickEvent"
+      :views="views"
     />
     />
   </div>
   </div>
 </template>
 </template>
@@ -42,6 +43,7 @@ export default {
     useDraft: { type: Boolean, default: true },
     useDraft: { type: Boolean, default: true },
     useEvent: { type: Boolean, default: true },
     useEvent: { type: Boolean, default: true },
     selfBtn: { type: Object, default: () => {} },
     selfBtn: { type: Object, default: () => {} },
+    eventLimit: { type: null, default: false },
   },
   },
   components: {
   components: {
     FullCalendar, // make the <FullCalendar> tag available
     FullCalendar, // make the <FullCalendar> tag available
@@ -64,6 +66,11 @@ export default {
         right: 'today ,next',
         right: 'today ,next',
       },
       },
       btn: {},
       btn: {},
+      views: {
+        dayGridMonth: {
+          eventLimit: _.clone(this.eventLimit),
+        },
+      },
     };
     };
   },
   },
   methods: {
   methods: {