feat(calendar): 添加calendar组件点击遮罩关闭事件和点击关闭图标事件 (nutui-uniapp#273)

* feat: 添加calendar组件点击遮罩关闭事件和点击关闭图标事件 * docs(calendar): 统一事件名描述 --------- Co-authored-by: 小何同学 <[email protected]>
DaHaiChen · Apr 3, 2024 · e70e654 · e70e654
1 parent 92e058b
commit e70e654
Show file tree

Hide file tree

Showing 3 changed files with 14 additions and 0 deletions.
diff --git a/docs/components/dentry/calendar.md b/docs/components/dentry/calendar.md
@@ -813,6 +813,8 @@ export default {
 | choose | 选择之后或是点击确认按钮触发,日期数组（包含年月日和星期） | `(string \| string[])[]` |
 | close  | 关闭时触发                   | -                            |
 | select  | 点击/选择后触发              |  `(string \| string[])[]`                          |
+| click-close-icon  | 点击关闭图标后触发              |  -                          |
+| click-overlay  | 点击遮罩关闭后触发              |  -                          |
 
 ### Slots
 

diff --git a/packages/nutui/components/calendar/calendar.ts b/packages/nutui/components/calendar/calendar.ts
@@ -110,6 +110,8 @@ export const calendarEmits = {
   [CLOSE_EVENT]: () => true,
   [UPDATE_VISIBLE_EVENT]: (val: boolean) => isBoolean(val),
   [SELECT_EVENT]: (val: any) => val,
+  clickCloseIcon: () => true,
+  clickOverlay: () => true,
 }
 
 export type CalendarEmits = typeof calendarEmits
diff --git a/packages/nutui/components/calendar/calendar.vue b/packages/nutui/components/calendar/calendar.vue
@@ -77,6 +77,14 @@ function select(param: string) {
   // close();
   emit(SELECT_EVENT, param)
 }
+
+function onClickCloseIcon() {
+  emit('clickCloseIcon')
+}
+
+function onClickOverlay() {
+  emit('clickOverlay')
+}
 </script>
 
 <script lang="ts">
@@ -102,6 +110,8 @@ export default defineComponent({
     :custom-style="{ height: '85vh' }"
     :destroy-on-close="false"
     @opened="opened"
+    @click-close-icon="onClickCloseIcon"
+    @click-overlay="onClickOverlay"
   >
     <NutCalendarItem
       ref="calendarRef"