Merge branch 'dev' into feature/form

This commit is contained in:
陈嘉涵 2020-02-07 15:11:57 +08:00
commit 0346b6c4d2
10 changed files with 93 additions and 61 deletions

View File

@ -73,6 +73,9 @@ export default {
| show-delete | Whether to show delete button | *boolean* | `false` |
| show-set-default | Whether to show default address switch | *boolean* | `false` |
| show-search-result | Whether to show address search result | *boolean* | `false` |
| show-area | Whether to show area cell | *boolean* | `true` |
| show-detail | Whether to show detail field | *boolean* | `true` |
| disable-area | Whether to disable area select | *boolean* | `false` |
| save-button-text | Save button text | *string* | `Save` |
| delete-button-text | Delete button text | *string* | `Delete` |
| detail-rows | Detail input rows | *number \| string* | `1` |

View File

@ -73,6 +73,9 @@ export default {
| show-delete | 是否显示删除按钮 | *boolean* | `false` |
| show-set-default | 是否显示默认地址栏 | *boolean* | `false` |
| show-search-result | 是否显示搜索结果 | *boolean* | `false` |
| show-area | 是否显示地区 | *boolean* | `true` |
| show-detail | 是否显示详细地址 | *boolean* | `true` |
| disable-area | 是否禁用地区选择 | *boolean* | `false` |
| save-button-text | 保存按钮文字 | *string* | `保存` |
| delete-button-text | 删除按钮文字 | *string* | `删除` |
| detail-rows | 详细地址输入框行数 | *number \| string* | `1` |

View File

@ -52,6 +52,7 @@ export default createComponent({
type: Boolean,
default: true,
},
disableArea: Boolean,
detailRows: {
type: [Number, String],
default: 1,
@ -250,7 +251,7 @@ export default createComponent({
},
render() {
const { data, errorInfo, searchResult } = this;
const { data, errorInfo, searchResult, disableArea } = this;
const onFocus = name => () => this.onFocus(name);
// hide bottom field when use search && detail get focused
@ -280,15 +281,15 @@ export default createComponent({
<Field
vShow={this.showArea}
readonly
clickable
clickable={!disableArea}
label={t('area')}
placeholder={t('areaPlaceholder')}
errorMessage={errorInfo.areaCode}
rightIcon="arrow"
rightIcon={!disableArea ? 'arrow' : null}
value={this.areaText}
onFocus={onFocus('areaCode')}
onClick={() => {
this.showAreaPopup = true;
this.showAreaPopup = !disableArea;
}}
/>
<Detail

View File

@ -10,7 +10,7 @@ import Radio from '../radio';
// Types
import { CreateElement, RenderContext } from 'vue/types';
import { DefaultSlots } from '../utils/types';
import { DefaultSlots, ScopedSlot } from '../utils/types';
export type AddressItemData = {
id: string | number;
@ -27,6 +27,10 @@ export type AddressItemProps = {
defaultTagText?: string;
};
export type AddressItemSlots = DefaultSlots & {
bottom?: ScopedSlot;
};
export type AddressItemEvents = {
onEdit(): void;
onClick(): void;
@ -38,7 +42,7 @@ const [createComponent, bem] = createNamespace('address-item');
function AddressItem(
h: CreateElement,
props: AddressItemProps,
slots: DefaultSlots,
slots: AddressItemSlots,
ctx: RenderContext<AddressItemProps>
) {
const { disabled, switchable } = props;
@ -95,18 +99,18 @@ function AddressItem(
}
return (
<div class={bem({ disabled })} onClick={onClick}>
<Cell
class={bem({ disabled })}
border={false}
valueClass={bem('value')}
clickable={switchable && !disabled}
scopedSlots={{
default: genContent,
'right-icon': genRightIcon,
}}
onClick={onClick}
{...inherit(ctx)}
/>
{slots.bottom?.({ ...props.data, disabled })}
</div>
);
}

View File

@ -104,7 +104,8 @@ export default {
### Slots
| Name | Description |
|------|------|
| default | Custom content after list |
| top | Custom content before list |
| Name | Description | SlotProps |
|------|------|------|
| default | Custom content after list | - |
| top | Custom content before list | - |
| item-bottom | Custom content after list item | item |

View File

@ -104,7 +104,8 @@ export default {
### Slots
| 名称 | 说明 |
|------|------|
| default | 在列表下方插入内容 |
| top | 在顶部插入内容 |
| 名称 | 说明 | SlotProps |
|------|------|------|
| default | 在列表下方插入内容 | - |
| top | 在顶部插入内容 | - |
| item-bottom | 在列表项底部插入内容 | 列表项的值 |

View File

@ -31,6 +31,7 @@
.van-address-item {
padding: @address-list-item-padding;
background-color: @white;
border-radius: @border-radius-lg;
&:not(:last-child) {
@ -79,6 +80,10 @@
transform: translate(0, -50%);
}
.van-cell {
padding: 0;
}
.van-radio__label {
margin-left: @padding-sm;
}

View File

@ -23,6 +23,7 @@ export type AddressListProps = {
export type AddressListSlots = DefaultSlots & {
top?: ScopedSlot;
'item-bottom'?: ScopedSlot;
};
const [createComponent, bem, t] = createNamespace('address-list');
@ -45,6 +46,9 @@ function AddressList(
disabled={disabled}
switchable={props.switchable}
defaultTagText={props.defaultTagText}
scopedSlots={{
bottom: slots['item-bottom'],
}}
onSelect={() => {
emit(ctx, disabled ? 'select-disabled' : 'select', item, index);

View File

@ -5,7 +5,8 @@ exports[`renders demo correctly 1`] = `
<div>
<div class="van-address-list">
<div role="radiogroup" class="van-radio-group">
<div role="button" tabindex="0" class="van-cell van-cell--clickable van-cell--borderless van-address-item">
<div class="van-address-item">
<div class="van-cell van-cell--borderless">
<div class="van-cell__value van-cell__value--alone van-address-item__value">
<div role="radio" tabindex="0" aria-checked="true" class="van-radio">
<div class="van-radio__icon van-radio__icon--round van-radio__icon--checked" style="font-size: 18px;"><i class="van-icon van-icon-success">
@ -16,7 +17,9 @@ exports[`renders demo correctly 1`] = `
</div><i class="van-icon van-icon-edit van-address-item__edit">
<!----></i>
</div>
<div role="button" tabindex="0" class="van-cell van-cell--clickable van-cell--borderless van-address-item">
</div>
<div class="van-address-item">
<div class="van-cell van-cell--borderless">
<div class="van-cell__value van-cell__value--alone van-address-item__value">
<div role="radio" tabindex="-1" aria-checked="false" class="van-radio">
<div class="van-radio__icon van-radio__icon--round" style="font-size: 18px;"><i class="van-icon van-icon-success">
@ -26,14 +29,17 @@ exports[`renders demo correctly 1`] = `
<!----></i>
</div>
</div>
</div>
<div class="van-address-list__disabled-text">以下地址超出配送范围</div>
<div class="van-cell van-cell--borderless van-address-item van-address-item--disabled">
<div class="van-address-item van-address-item--disabled">
<div class="van-cell van-cell--borderless">
<div class="van-cell__value van-cell__value--alone van-address-item__value">
<div class="van-address-item__name">王五 1320000000</div>
<div class="van-address-item__address">浙江省杭州市滨江区江南大道 15 号</div>
</div><i class="van-icon van-icon-edit van-address-item__edit">
<!----></i>
</div>
</div>
<div class="van-address-list__bottom"><button class="van-button van-button--danger van-button--normal van-button--block van-button--round van-address-list__add"><span class="van-button__text">新增地址</span></button></div>
</div>
</div>

View File

@ -3,14 +3,17 @@
exports[`unswitchable 1`] = `
<div class="van-address-list">
<div role="radiogroup" class="van-radio-group">
<div class="van-cell van-cell--borderless van-address-item">
<div class="van-address-item">
<div class="van-cell van-cell--borderless">
<div class="van-cell__value van-cell__value--alone van-address-item__value">
<div class="van-address-item__name">张三 13000000000</div>
<div class="van-address-item__address">浙江省杭州市西湖区文三路 138 号东方通信大厦 7 楼 501 室</div>
</div><i class="van-icon van-icon-edit van-address-item__edit">
<!----></i>
</div>
<div class="van-cell van-cell--borderless van-address-item">
</div>
<div class="van-address-item">
<div class="van-cell van-cell--borderless">
<div class="van-cell__value van-cell__value--alone van-address-item__value">
<div class="van-address-item__name">李四 1310000000</div>
<div class="van-address-item__address">浙江省杭州市拱墅区莫干山路 50 号</div>
@ -18,6 +21,7 @@ exports[`unswitchable 1`] = `
<!----></i>
</div>
</div>
</div>
<div class="van-address-list__bottom"><button class="van-button van-button--danger van-button--normal van-button--block van-button--round van-address-list__add"><span class="van-button__text">新增地址</span></button></div>
</div>
`;