diff --git a/src/coupon-list/CouponList.tsx b/src/coupon-list/CouponList.tsx index df17ffba1..73b493bb4 100644 --- a/src/coupon-list/CouponList.tsx +++ b/src/coupon-list/CouponList.tsx @@ -75,7 +75,7 @@ export default defineComponent({ emits: ['change', 'exchange', 'update:code'], - setup(props, { emit }) { + setup(props, { emit, slots }) { const [couponRefs, setCouponRefs] = useRefs(); const state = reactive({ @@ -169,6 +169,7 @@ export default defineComponent({ /> ))} {!coupons.length && renderEmpty()} + {slots['list-footer']?.()} ); @@ -194,6 +195,7 @@ export default defineComponent({ /> ))} {!disabledCoupons.length && renderEmpty()} + {slots['disabled-list-footer']?.()} ); diff --git a/src/coupon-list/README.md b/src/coupon-list/README.md index 26f9b5add..b4fe6abeb 100644 --- a/src/coupon-list/README.md +++ b/src/coupon-list/README.md @@ -90,14 +90,14 @@ export default { ### CouponCell Props -| Attribute | Description | Type | Default | -| --- | --- | --- | --- | -| title | Cell title | _string_ | `Coupon` | -| chosen-coupon | Index of chosen coupon | _number \| string_ | `-1` | -| coupons | Coupon list | _Coupon[]_ | `[]` | -| editable | Cell editable | _boolean_ | `true` | -| border | Whether to show innner border | _boolean_ | `true` | -| currency | Currency symbol | _string_ | `¥` | +| Attribute | Description | Type | Default | +| ------------- | ---------------------------- | ------------------ | -------- | +| title | Cell title | _string_ | `Coupon` | +| chosen-coupon | Index of chosen coupon | _number \| string_ | `-1` | +| coupons | Coupon list | _Coupon[]_ | `[]` | +| editable | Cell editable | _boolean_ | `true` | +| border | Whether to show inner border | _boolean_ | `true` | +| currency | Currency symbol | _string_ | `¥` | ### CouponList Props @@ -127,6 +127,13 @@ export default { | change | Emitted when chosen coupon changed | index: index of chosen coupon | | exchange | Emitted when exchanging coupon | code: exchange code | +### CouponList Slots + +| Name | Description | +| ------------------------------ | ------------------------------- | +| list-footer `v3.0.18` | Coupon list bottom | +| disabled-list-footer `v3.0.18` | Unavailable coupons list bottom | + ### Data Structure of Coupon | Key | Description | Type | @@ -134,8 +141,8 @@ export default { | id | Id | _string_ | | name | Name | _string_ | | condition | Condition | _string_ | -| startAt | Start time (Timestmap, unit second) | _number_ | -| endAt | End time (Timestmap, unit second) | _number_ | +| startAt | Start time (Timestamp, unit second) | _number_ | +| endAt | End time (Timestamp, unit second) | _number_ | | description | Description | _string_ | | reason | Unavailable reason | _string_ | | value | Value | _number_ | diff --git a/src/coupon-list/README.zh-CN.md b/src/coupon-list/README.zh-CN.md index 6cdc5263a..b6daf0847 100644 --- a/src/coupon-list/README.zh-CN.md +++ b/src/coupon-list/README.zh-CN.md @@ -129,6 +129,13 @@ export default { | change | 优惠券切换回调 | index, 选中优惠券的索引 | | exchange | 兑换优惠券回调 | code, 兑换码 | +### CouponList Slots + +| 名称 | 说明 | +| ------------------------------ | -------------------- | +| list-footer `v3.0.18` | 优惠券列表底部 | +| disabled-list-footer `v3.0.18` | 不可用优惠券列表底部 | + ### Coupon 数据结构 | 键名 | 说明 | 类型 | diff --git a/src/coupon-list/test/__snapshots__/index.spec.ts.snap b/src/coupon-list/test/__snapshots__/index.spec.ts.snap index f36f70c18..28b402148 100644 --- a/src/coupon-list/test/__snapshots__/index.spec.ts.snap +++ b/src/coupon-list/test/__snapshots__/index.spec.ts.snap @@ -380,6 +380,108 @@ exports[`should have two "van-coupon-list__empty" classes when render coupon lis `; +exports[`should render list-footer slot correctly 1`] = ` +
+
+
+
+
+ +
+
+
+ +
+
+
+
+ + +
+
+
+
+
+ +
+
+
+ +

+ No coupons +

+
+ Disabled List Footer +
+
+
+
+
+ +
+
+`; + exports[`should use custom src when using empty-image prop 1`] = `
diff --git a/src/coupon-list/test/index.spec.ts b/src/coupon-list/test/index.spec.ts index 2cd3b0845..a6e1ed734 100644 --- a/src/coupon-list/test/index.spec.ts +++ b/src/coupon-list/test/index.spec.ts @@ -144,3 +144,18 @@ test('should emit "update:code" event when input a code', async () => { await wrapper.setProps({ code: '2' }); expect(wrapper.emitted('update:code')![2]).toEqual(['2']); }); + +test('should render list-footer slot correctly', async () => { + const wrapper = mount(CouponList, { + slots: { + 'list-footer': () => 'List Footer', + 'disabled-list-footer': () => 'Disabled List Footer', + }, + }); + + await later(); + const tabs = wrapper.findAll('.van-tab'); + await tabs[1].trigger('click'); + + expect(wrapper.html()).toMatchSnapshot(); +});