feat: ✨Calendar日历添加open事件 (#627)

✅ Closes: #624

Author: 810505339

docs/component/calendar.md

@@ -417,6 +417,7 @@ function handleConfirm4({ value }) {
 | confirm  | 绑定值变化时触发                     | `{ value }`               | -        |
 | change   | 点击面板日期时触发                   | `{ value }`               | -        |
 | cancel   | 点击关闭按钮或者蒙层时触发           | -|-|
+| open     | 日历打开时触发          | -|-|
 
 ## Methods
 

src/pages/calendar/Index.vue

@@ -44,14 +44,20 @@
         </wd-calendar>
       </view>
     </demo-block>
+    <demo-block transparent title="open事件">
+      <wd-calendar v-model="value17" @open="handleOpen" />
+    </demo-block>
   </page-wraper>
+  <wd-message-box />
 </template>
 <script lang="ts" setup>
 import { useToast } from '@/uni_modules/wot-design-uni'
 import { dayjs } from '@/uni_modules/wot-design-uni'
 import type { CalendarDayItem, CalendarFormatter } from '@/uni_modules/wot-design-uni/components/wd-calendar-view/types'
 import type { CalendarOnShortcutsClickOption } from '@/uni_modules/wot-design-uni/components/wd-calendar/types'
 import { ref } from 'vue'
+import { useMessage } from '@/uni_modules/wot-design-uni'
+const message = useMessage()
 
 const minDate = ref<number>(new Date(new Date().getFullYear() - 20, new Date().getMonth() - 6, new Date().getDate()).getTime())
 
@@ -71,7 +77,7 @@ const value13 = ref<number[]>([Date.now() - 24 * 60 * 60 * 1000 * 3, Date.now()]
 const value14 = ref<number | null>(null)
 const value15 = ref<number | null>(null)
 const value16 = ref<number>(Date.now())
-
+const value17 = ref<number>(Date.now())
 const formatValue = ref<string>('')
 const formatter: CalendarFormatter = (day: CalendarDayItem) => {
   const date = new Date(day.date)
@@ -165,5 +171,8 @@ function handleConfirm4({ value }: any) {
   console.log(new Date(value).toString())
   formatValue.value = new Date(value).toString()
 }
+function handleOpen() {
+  message.alert('打开日历')
+}
 </script>
 <style lang="scss" scoped></style>

src/uni_modules/wot-design-uni/components/wd-calendar/wd-calendar.vue

@@ -205,7 +205,7 @@ const formatRange = (value: number, rangeType: 'start' | 'end', type: CalendarTy
 }
 
 const props = defineProps(calendarProps)
-const emit = defineEmits(['cancel', 'change', 'update:modelValue', 'confirm'])
+const emit = defineEmits(['cancel', 'change', 'update:modelValue', 'confirm', 'open'])
 
 const pickerShow = ref<boolean>(false)
 const calendarValue = ref<null | number | number[]>(null)
@@ -333,6 +333,7 @@ function open() {
       calendarTabs.value.updateLineStyle(false)
     }
   }, 250)
+  emit('open')
 }
 // 对外暴露方法
 function close() {
@@ -349,7 +350,6 @@ function handleTypeChange({ index }: { index: number }) {
   const tabs = ['date', 'week', 'month']
   const rangeTabs = ['daterange', 'weekrange', 'monthrange']
   const type = props.type.indexOf('range') > -1 ? rangeTabs[index] : tabs[index]
-
   currentTab.value = index
   currentType.value = type as CalendarType
 }