From ba13d567129a83bcce8f49ee1bce3f0dee7c553a Mon Sep 17 00:00:00 2001
From: PsTiu <20109955@qq.com>
Date: Tue, 25 Jan 2022 16:46:06 +0800
Subject: [PATCH] =?UTF-8?q?fix(calendar):=20fix:=20=E4=BF=AE=E5=A4=8D?=
 =?UTF-8?q?=E6=97=A5=E5=8E=86=E7=BB=84=E4=BB=B6controllerChange=E4=BA=8B?=
 =?UTF-8?q?=E4=BB=B6=E5=9C=A8=E5=B9=B4=E5=8F=AA=E9=80=9A=E8=BF=87=E6=9C=88?=
 =?UTF-8?q?=E4=BB=BD=E4=B8=8B=E6=8B=89=E6=A1=86=E8=A7=A6=E5=8F=91=E7=9A=84?=
 =?UTF-8?q?=E9=97=AE=E9=A2=98?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 examples/calendar/demos/events.vue |  6 ------
 src/calendar/calendar.tsx          | 30 +++++++++++++++++++-----------
 2 files changed, 19 insertions(+), 17 deletions(-)

diff --git a/examples/calendar/demos/events.vue b/examples/calendar/demos/events.vue
index a7148affc..31fd025ff 100644
--- a/examples/calendar/demos/events.vue
+++ b/examples/calendar/demos/events.vue
@@ -1,7 +1,6 @@
 <template>
   <div class="tdesign-demo-block-column-large">
     <t-calendar
-      :value="value"
       @cell-click="cellClick"
       @cell-double-click="cellDoubleClick"
       @cell-right-click="cellRightClick"
@@ -13,11 +12,6 @@
 
 <script>
 export default {
-  data() {
-    return {
-      value: null,
-    };
-  },
   methods: {
     cellClick(options) {
       console.log(`鼠标左键单击单元格 ${options.cell.formattedDate}`);
diff --git a/src/calendar/calendar.tsx b/src/calendar/calendar.tsx
index 19b7cce25..22349a01a 100644
--- a/src/calendar/calendar.tsx
+++ b/src/calendar/calendar.tsx
@@ -324,6 +324,19 @@ export default mixins(getConfigReceiverMixins<Vue, CalendarConfig>('calendar')).
       const p = this.curSelectedMode === 'month' ? 'currentDayButtonProps' : 'currentMonthButtonProps';
       return this.checkControllerDisabled('current', p);
     },
+
+    filterYearStr(): string {
+      return `${this.controllerOptions.filterDate.getFullYear()}`;
+    },
+    filterMonthStr(): string {
+      return `${this.controllerOptions.filterDate.getMonth() + 1}`;
+    },
+    filterYearMonth(): { month: string; year: string } {
+      return {
+        year: this.filterYearStr,
+        month: this.filterMonthStr,
+      };
+    },
   },
   watch: {
     value: {
@@ -344,6 +357,12 @@ export default mixins(getConfigReceiverMixins<Vue, CalendarConfig>('calendar')).
       },
       immediate: true,
     },
+    filterYearMonth: {
+      handler(v: { month: string; year: string }) {
+        emitEvent<Parameters<TdCalendarProps['onMonthChange']>>(this, 'month-change', v);
+        this.controllerChange();
+      },
+    },
   },
   methods: {
     getCalendarWeekSlotData(item: CellColHeader): CalendarWeek {
@@ -390,15 +409,6 @@ export default mixins(getConfigReceiverMixins<Vue, CalendarConfig>('calendar')).
       const options = this.controllerOptions;
       emitEvent<Parameters<TdCalendarProps['onControllerChange']>>(this, 'controller-change', options);
     },
-    // 月份切换响应事件（包括年和月下拉框变化）
-    monthChange(): void {
-      const options = {
-        year: `${this.controllerOptions.filterDate.getFullYear()}`,
-        month: `${this.controllerOptions.filterDate.getMonth() + 1}`,
-      };
-      emitEvent<Parameters<TdCalendarProps['onMonthChange']>>(this, 'month-change', options);
-      this.controllerChange();
-    },
     onWeekendToggleClick(): void {
       this.isShowWeekend = !this.isShowWeekend;
       this.controllerChange();
@@ -467,7 +477,6 @@ export default mixins(getConfigReceiverMixins<Vue, CalendarConfig>('calendar')).
                   size={this.controlSize}
                   disabled={this.isYearDisabled}
                   props={{ ...this.controllerConfigData.year.selecteProps }}
-                  onChange={this.monthChange}
                 >
                   {this.yearSelectOptionList.map((item) => (
                     <t-option key={item.value} value={item.value} label={item.label} disabled={item.disabled}>
@@ -484,7 +493,6 @@ export default mixins(getConfigReceiverMixins<Vue, CalendarConfig>('calendar')).
                   size={this.controlSize}
                   disabled={this.isMonthDisabled}
                   props={{ ...this.controllerConfigData.month.selecteProps }}
-                  onChange={this.monthChange}
                 >
                   {this.monthSelectOptionList.map((item) => (
                     <t-option key={item.value} value={item.value} label={item.label} disabled={item.disabled}>