diff --git a/docs/markdown/en-US/coupon.md b/docs/markdown/en-US/coupon.md index 1936abc8a..defbca20b 100644 --- a/docs/markdown/en-US/coupon.md +++ b/docs/markdown/en-US/coupon.md @@ -84,6 +84,7 @@ export default { | disabled-coupons | Disabled voupon list | `Array` | `[]` | - | | exchange-button-text | Exchange button text | `String` | `Exchange` | - | | exchange-button-disabled | Whether to disable exchange button | `Boolean` | `false` | - | +| exchange-min-length | Min length to enable exchange button | `Number` | `1` | - | | displayed-coupon-index | Index of displayed coupon | `Number` | - | - | | close-button-text | Close button text | `String` | `Close` | - | | disabled-list-title | Disabled list title | `String` | `Unavailable` | - | diff --git a/docs/markdown/zh-CN/coupon.md b/docs/markdown/zh-CN/coupon.md index df633df6a..7c7f25b7f 100644 --- a/docs/markdown/zh-CN/coupon.md +++ b/docs/markdown/zh-CN/coupon.md @@ -85,6 +85,7 @@ export default { | disabled-doupons | 不可用优惠券列表 | `Array` | `[]` | - | | exchange-button-text | 兑换按钮文字 | `String` | `兑换` | - | | exchange-button-disabled | 是否禁用兑换按钮 | `Boolean` | `false` | - | +| exchange-min-length | 兑换码最小长度 | `Number` | `1` | - | | displayed-coupon-index | 滚动至特定优惠券位置 | `Number` | - | - | | show-close-button | 是否显示列表底部按钮 | `Boolean` | `true` | - | | close-button-text | 列表底部按钮文字 | `String` | `不使用优惠` | - | diff --git a/packages/coupon-list/index.vue b/packages/coupon-list/index.vue index dfbfcd415..6dafd73a2 100644 --- a/packages/coupon-list/index.vue +++ b/packages/coupon-list/index.vue @@ -11,11 +11,10 @@ size="small" type="danger" class="van-coupon-list__exchange" - :disabled="exchangeButtonDisabled || !exchangeCode.length" + :text="exchangeButtonText || $t('exchange')" + :disabled="buttonDisabled" @click="onClickExchangeButton" - > - {{ exchangeButtonText || $t('exchange') }} - + />
- {{ closeButtonText || $t('close') }} -
+ />
@@ -74,6 +72,11 @@ export default create({ inputPlaceholder: String, disabledListTitle: String, exchangeButtonText: String, + exchangeButtonDisabled: Boolean, + exchangeMinLength: { + type: Number, + default: 1 + }, chosenCoupon: { type: Number, default: -1 @@ -86,10 +89,6 @@ export default create({ type: Array, default: () => [] }, - exchangeButtonDisabled: { - type: Boolean, - default: false - }, displayedCouponIndex: { type: Number, default: -1 @@ -104,18 +103,24 @@ export default create({ } }, - watch: { - displayedCouponIndex(val) { - this.scrollToShowCoupon(val); - } - }, - data() { return { exchangeCode: '' }; }, + computed: { + buttonDisabled() { + return this.exchangeButtonDisabled || this.exchangeCode.length < this.exchangeMinLength; + } + }, + + watch: { + displayedCouponIndex(val) { + this.scrollToShowCoupon(val); + } + }, + mounted() { this.scrollToShowCoupon(this.displayedCouponIndex); },