From f1e9ca182e9f6df5b3153eb470a7fc759347d8f5 Mon Sep 17 00:00:00 2001
From: neverland <chenjiahan@youzan.com>
Date: Sat, 11 Jul 2020 10:18:30 +0800
Subject: [PATCH] feat(SubmitBar): add button-color prop (#6757)

---
 src/submit-bar/README.md                             |  1 +
 src/submit-bar/README.zh-CN.md                       |  1 +
 src/submit-bar/index.tsx                             |  3 +++
 src/submit-bar/test/__snapshots__/index.spec.js.snap |  8 ++++++++
 src/submit-bar/test/index.spec.js                    | 11 +++++++++++
 5 files changed, 24 insertions(+)

diff --git a/src/submit-bar/README.md b/src/submit-bar/README.md
index 2d8d0eaa9..4da09efd4 100644
--- a/src/submit-bar/README.md
+++ b/src/submit-bar/README.md
@@ -65,6 +65,7 @@ Use slot to add custom contents.
 | text-align `v2.3.0` | Price label text align can be set to `left` | _string_ | `right` |
 | button-text | Button text | _string_ | - |
 | button-type | Button type | _string_ | `danger` |
+| button-color `v2.9.1` | Button color | _string_ | - |
 | tip | Tip | _string_ | - |
 | tip-icon | Icon | _string_ | - |
 | currency | Currency symbol | _string_ | `¥` |
diff --git a/src/submit-bar/README.zh-CN.md b/src/submit-bar/README.zh-CN.md
index b13eb130a..dbc0c7adb 100644
--- a/src/submit-bar/README.zh-CN.md
+++ b/src/submit-bar/README.zh-CN.md
@@ -70,6 +70,7 @@ Vue.use(SubmitBar);
 | text-align `v2.3.0` | 价格文案对齐方向，可选值为 `left` | _string_ | `right` |
 | button-text | 按钮文字 | _string_ | - |
 | button-type | 按钮类型 | _string_ | `danger` |
+| button-color `v2.9.1` | 自定义按钮颜色 | _string_ | - |
 | tip | 提示文案 | _string_ | - |
 | tip-icon | 左侧[图标名称](#/zh-CN/icon)或图片链接 | _string_ | - |
 | currency | 货币符号 | _string_ | `¥` |
diff --git a/src/submit-bar/index.tsx b/src/submit-bar/index.tsx
index 06b6ffc5b..9e8092b4f 100644
--- a/src/submit-bar/index.tsx
+++ b/src/submit-bar/index.tsx
@@ -20,6 +20,7 @@ export type SubmitBarProps = {
   disabled?: boolean;
   buttonType: ButtonType;
   buttonText?: string;
+  buttonColor?: string;
   suffixLabel?: string;
   decimalLength: number;
   safeAreaInsetBottom?: boolean;
@@ -87,6 +88,7 @@ function SubmitBar(
           round
           class={bem('button', props.buttonType)}
           type={props.buttonType}
+          color={props.buttonColor}
           loading={props.loading}
           disabled={props.disabled}
           text={props.loading ? '' : props.buttonText}
@@ -108,6 +110,7 @@ SubmitBar.props = {
   disabled: Boolean,
   textAlign: String,
   buttonText: String,
+  buttonColor: String,
   suffixLabel: String,
   safeAreaInsetBottom: {
     type: Boolean,
diff --git a/src/submit-bar/test/__snapshots__/index.spec.js.snap b/src/submit-bar/test/__snapshots__/index.spec.js.snap
index 5241284d9..1f52d8d20 100644
--- a/src/submit-bar/test/__snapshots__/index.spec.js.snap
+++ b/src/submit-bar/test/__snapshots__/index.spec.js.snap
@@ -1,5 +1,13 @@
 // Jest Snapshot v1, https://goo.gl/fbAQLP
 
+exports[`button-color prop 1`] = `
+<div class="van-submit-bar">
+  <div class="van-submit-bar__bar"><button class="van-button van-button--danger van-button--normal van-button--round van-submit-bar__button van-submit-bar__button--danger" style="color: rgb(255, 255, 255); background: red; border-color: red;">
+      <div class="van-button__content"></div>
+    </button></div>
+</div>
+`;
+
 exports[`decimal-length prop 1`] = `
 <div class="van-submit-bar">
   <div class="van-submit-bar__bar">
diff --git a/src/submit-bar/test/index.spec.js b/src/submit-bar/test/index.spec.js
index 06a8c36a1..cc1520611 100644
--- a/src/submit-bar/test/index.spec.js
+++ b/src/submit-bar/test/index.spec.js
@@ -108,3 +108,14 @@ test('disable safe-area-inset-bottom prop', () => {
   });
   expect(wrapper).toMatchSnapshot();
 });
+
+test('button-color prop', () => {
+  const wrapper = mount(SubmitBar, {
+    context: {
+      props: {
+        buttonColor: 'red',
+      },
+    },
+  });
+  expect(wrapper).toMatchSnapshot();
+});