From 956800b95c74c55a89f8b1b0f3042f42f728dc34 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?=E9=99=88=E5=98=89=E6=B6=B5?= <chenjiahan@youzan.com>
Date: Sat, 28 Dec 2019 11:43:55 +0800
Subject: [PATCH] feat(Calendar): add position prop

---
 src/calendar/README.md       | 1 +
 src/calendar/README.zh-CN.md | 1 +
 src/calendar/index.js        | 8 ++++++--
 src/calendar/index.less      | 5 ++++-
 4 files changed, 12 insertions(+), 3 deletions(-)

diff --git a/src/calendar/README.md b/src/calendar/README.md
index 17dd06ee0..dc4b9bc42 100644
--- a/src/calendar/README.md
+++ b/src/calendar/README.md
@@ -196,6 +196,7 @@ Set `poppable` to `false`, the calendar will be displayed directly on the page i
 | default-date | Default selected date | *Date \| Date[]* | Today | - |
 | row-height | Row height | *number* | `64` | - |
 | formatter | Day formatter | *(day: Day) => Day* | - | - |
+| position | Popup position, can be set to `top` `right` `left` | *string* | `bottom` | - |
 | poppable | Whether to show the calendar inside a popup | *boolean* | `true` | - |
 | show-mark | Whether to show background month mark | *boolean* | `true` | - |
 | show-confirm | Whether to show confirm button | *boolean* | `true` | - |
diff --git a/src/calendar/README.zh-CN.md b/src/calendar/README.zh-CN.md
index fed74ca2a..0b2bc4a39 100644
--- a/src/calendar/README.zh-CN.md
+++ b/src/calendar/README.zh-CN.md
@@ -196,6 +196,7 @@ export default {
 | default-date | 默认选中的日期 | *Date \| Date[]* | 今天 | - |
 | row-height | 日期行高 | *number* | `64` | - |
 | formatter | 日期格式化函数 | *(day: Day) => Day* | - | - |
+| position | 弹出位置，可选值为 `top` `right` `left` | *string* | `bottom` | - |
 | poppable | 是否以弹层的形式展示日历 | *boolean* | `true` | - |
 | show-mark | 是否显示月份背景水印 | *boolean* | `true` | - |
 | show-confirm | 是否展示确认按钮 | *boolean* | `true` | - |
diff --git a/src/calendar/index.js b/src/calendar/index.js
index 5748be885..d352e8332 100644
--- a/src/calendar/index.js
+++ b/src/calendar/index.js
@@ -41,6 +41,10 @@ export default createComponent({
         return new Date(now.getFullYear(), now.getMonth() + 6, now.getDate());
       }
     },
+    position: {
+      type: String,
+      default: 'bottom'
+    },
     rowHeight: {
       type: Number,
       default: ROW_HEIGHT
@@ -307,9 +311,9 @@ export default createComponent({
         <Popup
           round
           closeable
-          value={this.value}
-          position="bottom"
           class={bem('popup')}
+          value={this.value}
+          position={this.position}
           onInput={this.togglePopup}
         >
           {this.genCalendar()}
diff --git a/src/calendar/index.less b/src/calendar/index.less
index 010866a99..0978c5bab 100644
--- a/src/calendar/index.less
+++ b/src/calendar/index.less
@@ -7,7 +7,10 @@
   background-color: @calendar-background-color;
 
   &__popup {
-    height: @calendar-popup-height;
+    &.van-popup--top,
+    &.van-popup--bottom {
+      height: @calendar-popup-height;
+    }
 
     .van-popup__close-icon {
       top: 13px;