diff --git a/packages/ui/calendar/src/index.less b/packages/ui/calendar/src/index.less
new file mode 100644
index 0000000000000000000000000000000000000000..8eab9dddaf5afd9132a0bc0157e68d8a65d355bd
--- /dev/null
+++ b/packages/ui/calendar/src/index.less
@@ -0,0 +1,9 @@
+@osui-calendar-class-prefix: osui-calendar;
+.@{osui-calendar-class-prefix} {
+    &-header-wrapper{
+        display: flex;
+        justify-content: space-between;
+        align-items: center;
+        margin-bottom: 20px;
+    }
+}
diff --git a/packages/ui/calendar/src/index.tsx b/packages/ui/calendar/src/index.tsx
index 2e7bbb4890c5fc865b62c11212c24c9cd24b3f82..20d9fa2e9b43120f4dc0bcb9d722f3f4a8a25520 100644
--- a/packages/ui/calendar/src/index.tsx
+++ b/packages/ui/calendar/src/index.tsx
@@ -1,2 +1,67 @@
-import {Calendar} from 'antd';
+import React from 'react';
+import classNames from 'classnames';
+import {Calendar as AntdCalendar, Radio} from 'antd';
+import { Moment } from 'moment';
+import generateMoment from 'rc-picker/lib/generate/moment';
+import {CalendarProps as AntdCalendarProps} from 'antd/es/calendar/generateCalendar';
+import './index.less';
+
+const clsPrefix = 'osui-calendar';
+
+enum AcceleratorType {
+    LastMonth = "LastMonth",
+    Taday = "Taday",
+    NextMonth = "NextMonth",
+}
+
+interface OnChangeFunc {
+    (date: Moment): void;
+}
+
+export interface CalendarProps<Moment> extends AntdCalendarProps<Moment> {
+    needAccelerator?: boolean
+}
+const Calendar: React.FC<CalendarProps<Moment>> = props => {
+    const {
+        className,
+        needAccelerator = false
+    } = props;
+
+    const headerRender = ({value, onChange}: {value: Moment, onChange: OnChangeFunc}) => {
+        const onAcceleratorTypeChange=(e: any) => {
+            const nowValue = value.clone();
+            if (e.target.value === AcceleratorType.LastMonth) {
+                const now = nowValue.month(nowValue.month() - 1);
+                onChange(now);
+            } else if (e.target.value  === AcceleratorType.NextMonth) {
+                const now = nowValue.month(nowValue.month() + 1);
+                onChange(now);
+            } else {
+                onChange(generateMoment.getNow());
+            }
+        }
+        return (
+          <div className={`${clsPrefix}-header-wrapper`}>
+            <div className={`${clsPrefix}-header-title`}>
+               { generateMoment.getYear(value) } <span>年</span> { generateMoment.getMonth(value) + 1 } <span>月</span>
+            </div>
+            <div className={`${clsPrefix}-header-accelerator`}>
+                <Radio.Group  >
+                    <Radio.Button onClick={onAcceleratorTypeChange} value={AcceleratorType.LastMonth}>上月</Radio.Button>
+                    <Radio.Button onClick={onAcceleratorTypeChange} value={AcceleratorType.Taday}>今日</Radio.Button>
+                    <Radio.Button onClick={onAcceleratorTypeChange} value={AcceleratorType.NextMonth}>下月</Radio.Button>
+                </Radio.Group>
+            </div>
+          </div>
+        );
+      }
+    return (
+        <AntdCalendar
+            {...props}
+            headerRender={needAccelerator ? headerRender : undefined}
+            className={classNames(clsPrefix, className)}
+        />
+    );
+}
+
 export default Calendar;
diff --git a/packages/ui/calendar/stories/icloud.stories.mdx b/packages/ui/calendar/stories/icloud.stories.mdx
index f0b628bf394c7e429453964780a0c708e2ac043e..1b4e4f4913af80e5403f21cf89eb9563e5cc44f4 100644
--- a/packages/ui/calendar/stories/icloud.stories.mdx
+++ b/packages/ui/calendar/stories/icloud.stories.mdx
@@ -7,6 +7,14 @@ import * as stories from './icloud.stories'
 
 支持所有antd属性：见[antd文档](https://ant.design/components/calendar-cn/)
 
+### 新增属性
+
+| 参数 | 说明 | 类型 | 默认值
+| --- | --- | --- | --- |
+| needAccelerator | 是否需要操作快捷键 | boolean | false |
+
+### 示例
+
 <Preview>
   <Story name="Demo" story={stories.Demo} />
 </Preview>
diff --git a/packages/ui/calendar/stories/icloud.stories.tsx b/packages/ui/calendar/stories/icloud.stories.tsx
index 8f1a638e602b406e5d69faa199000790f583f5b6..75db0ce6415839d05cbc214b6c8c68c46fb1b95e 100644
--- a/packages/ui/calendar/stories/icloud.stories.tsx
+++ b/packages/ui/calendar/stories/icloud.stories.tsx
@@ -7,6 +7,9 @@ export default {
 
 export const Demo = () => {
     return (
-        <Calendar />
+        <>
+            <Calendar needAccelerator={true} />
+            <Calendar />
+        </>
     );
 };
diff --git a/packages/ui/calendar/stories/osui.stories.mdx b/packages/ui/calendar/stories/osui.stories.mdx
index f0b628bf394c7e429453964780a0c708e2ac043e..fcd986fde9a9e28a6978424323a37eec6bd2f126 100644
--- a/packages/ui/calendar/stories/osui.stories.mdx
+++ b/packages/ui/calendar/stories/osui.stories.mdx
@@ -7,6 +7,13 @@ import * as stories from './icloud.stories'
 
 支持所有antd属性：见[antd文档](https://ant.design/components/calendar-cn/)
 
+### 新增属性
+
+| 参数 | 说明 | 类型 | 默认值
+| --- | --- | --- | --- |
+| needAccelerator | 是否需要操作快捷键 | boolean | false |
+
+
 <Preview>
   <Story name="Demo" story={stories.Demo} />
 </Preview>
diff --git a/packages/ui/calendar/stories/osui.stories.tsx b/packages/ui/calendar/stories/osui.stories.tsx
index 8f1a638e602b406e5d69faa199000790f583f5b6..358d8eee7f83bcf3bad0215eb1822362348bfebc 100644
--- a/packages/ui/calendar/stories/osui.stories.tsx
+++ b/packages/ui/calendar/stories/osui.stories.tsx
@@ -7,6 +7,9 @@ export default {
 
 export const Demo = () => {
     return (
-        <Calendar />
+        <>
+            <Calendar needAccelerator={true} />
+            <Calendar />
+         </>
     );
 };