From b688493c8ecbd5ec5411eae8993b975298d927b6 Mon Sep 17 00:00:00 2001
From: Yugang Cao <34439652+Talljack@users.noreply.github.com>
Date: Sat, 2 Oct 2021 00:15:08 +0800
Subject: [PATCH] fix(date-picker): date action validate error (#1259)

* fix: date-picker date action validate error

* fix: update

* fix: validate error

Co-authored-by: yugang.cao <yugang.cao@tusimple.ai>
---
 CHANGELOG.en-US.md                 |  1 +
 CHANGELOG.zh-CN.md                 |  1 +
 src/date-picker/src/DatePicker.tsx | 27 +++++++++++++++++++++++++++
 3 files changed, 29 insertions(+)

diff --git a/CHANGELOG.en-US.md b/CHANGELOG.en-US.md
index 996d27151..f8ceb1634 100644
--- a/CHANGELOG.en-US.md
+++ b/CHANGELOG.en-US.md
@@ -10,6 +10,7 @@
 - Fix `n-form-item`'s content is too long and the width is incorrect
 - Fix `n-layout-sider`'s `arrow-circle`'s icon style.
 - Fix `n-upload`'s `show-preview-button` prop not working，closes [#1238](https://github.com/TuSimple/naive-ui/issues/1238).
+- Fix `n-date-picker`‘s `date` type of `action` validate error.
 
 ## 2.19.3 (2021-09-28)
 
diff --git a/CHANGELOG.zh-CN.md b/CHANGELOG.zh-CN.md
index 5a51b99c3..39ecb2b8c 100644
--- a/CHANGELOG.zh-CN.md
+++ b/CHANGELOG.zh-CN.md
@@ -6,6 +6,7 @@
 - 修复 `n-form-item` 中组件内容过长影响 `n-form-item` 宽度
 - 修复 `n-layout-sider` 中 `arrow-circle` 的 icon 样式
 - 修复 `n-upload` 的 `show-preview-button` 属性失效，关闭 [#1238](https://github.com/TuSimple/naive-ui/issues/1238)
+- 修复 `n-date-picker` 的 `date` 类型的 `action` 验证错误
 
 ## 2.19.3 (2021-09-28)
 
diff --git a/src/date-picker/src/DatePicker.tsx b/src/date-picker/src/DatePicker.tsx
index 655cd3ad7..235a9bb79 100644
--- a/src/date-picker/src/DatePicker.tsx
+++ b/src/date-picker/src/DatePicker.tsx
@@ -234,6 +234,32 @@ export default defineComponent({
     const mergedFormatRef = computed(() => {
       return props.format || DATE_FORMAT[props.type]
     })
+    const mergedActionsRef = computed(() => {
+      const { actions, type } = props
+      if (actions !== undefined) return actions
+      switch (type) {
+        case 'date': {
+          return ['clear', 'now']
+        }
+        case 'datetime': {
+          return ['clear', 'now', 'confirm']
+        }
+        case 'daterange': {
+          return ['clear', 'confirm']
+        }
+        case 'datetimerange': {
+          return ['clear', 'confirm']
+        }
+        default: {
+          warn(
+            'data-picker',
+            "The type is wrong, n-date-picker's type only supports `date`, `datetime`, `daterange` and `datetimerange`."
+          )
+          break
+        }
+      }
+    })
+
     function doUpdatePendingValue (value: Value | null): void {
       pendingValueRef.value = value
     }
@@ -544,6 +570,7 @@ export default defineComponent({
       handlePanelUpdateValue,
       handlePanelConfirm,
       mergedTheme: themeRef,
+      actions: mergedActionsRef,
       triggerCssVars: computed(() => {
         const {
           common: { cubicBezierEaseInOut },