mirror of
https://gitee.com/vant-contrib/vant.git
synced 2025-04-06 03:57:59 +08:00
Merge branch 'dev' into feature/form
This commit is contained in:
陈嘉涵
commit
0346b6c4d2
@ -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` |
|
||||
|
||||
@ -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` |
|
||||
|
||||
@ -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
|
||||
|
||||
@ -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 (
|
||||
<Cell
|
||||
class={bem({ disabled })}
|
||||
border={false}
|
||||
valueClass={bem('value')}
|
||||
clickable={switchable && !disabled}
|
||||
scopedSlots={{
|
||||
default: genContent,
|
||||
'right-icon': genRightIcon,
|
||||
}}
|
||||
onClick={onClick}
|
||||
{...inherit(ctx)}
|
||||
/>
|
||||
<div class={bem({ disabled })} onClick={onClick}>
|
||||
<Cell
|
||||
border={false}
|
||||
valueClass={bem('value')}
|
||||
scopedSlots={{
|
||||
default: genContent,
|
||||
'right-icon': genRightIcon,
|
||||
}}
|
||||
{...inherit(ctx)}
|
||||
/>
|
||||
{slots.bottom?.({ ...props.data, disabled })}
|
||||
</div>
|
||||
);
|
||||
}
|
||||
|
||||
|
||||
@ -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 |
|
||||
|
||||
@ -104,7 +104,8 @@ export default {
|
||||
|
||||
### Slots
|
||||
|
||||
| 名称 | 说明 |
|
||||
|------|------|
|
||||
| default | 在列表下方插入内容 |
|
||||
| top | 在顶部插入内容 |
|
||||
| 名称 | 说明 | SlotProps |
|
||||
|------|------|------|
|
||||
| default | 在列表下方插入内容 | - |
|
||||
| top | 在顶部插入内容 | - |
|
||||
| item-bottom | 在列表项底部插入内容 | 列表项的值 |
|
||||
|
||||
@ -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;
|
||||
}
|
||||
|
||||
@ -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);
|
||||
|
||||
|
||||
@ -5,34 +5,40 @@ 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-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">
|
||||
<!----></i></div><span class="van-radio__label"><div class="van-address-item__name">张三 13000000000<span class="van-tag van-tag--round van-tag--danger van-address-item__tag">默认</span>
|
||||
<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">
|
||||
<!----></i></div><span class="van-radio__label"><div class="van-address-item__name">张三 13000000000<span class="van-tag van-tag--round van-tag--danger van-address-item__tag">默认</span>
|
||||
</div>
|
||||
<div class="van-address-item__address">浙江省杭州市西湖区文三路 138 号东方通信大厦 7 楼 501 室</div></span>
|
||||
</div>
|
||||
<div class="van-address-item__address">浙江省杭州市西湖区文三路 138 号东方通信大厦 7 楼 501 室</div></span>
|
||||
</div>
|
||||
</div><i class="van-icon van-icon-edit van-address-item__edit">
|
||||
<!----></i>
|
||||
</div><i class="van-icon van-icon-edit van-address-item__edit">
|
||||
<!----></i>
|
||||
</div>
|
||||
</div>
|
||||
<div role="button" tabindex="0" class="van-cell van-cell--clickable van-cell--borderless van-address-item">
|
||||
<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">
|
||||
<!----></i></div><span class="van-radio__label"><div class="van-address-item__name">李四 1310000000</div><div class="van-address-item__address">浙江省杭州市拱墅区莫干山路 50 号</div></span>
|
||||
</div>
|
||||
</div><i class="van-icon van-icon-edit van-address-item__edit">
|
||||
<!----></i>
|
||||
<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">
|
||||
<!----></i></div><span class="van-radio__label"><div class="van-address-item__name">李四 1310000000</div><div class="van-address-item__address">浙江省杭州市拱墅区莫干山路 50 号</div></span>
|
||||
</div>
|
||||
</div><i class="van-icon van-icon-edit van-address-item__edit">
|
||||
<!----></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-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 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>
|
||||
|
||||
@ -3,19 +3,23 @@
|
||||
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-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 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>
|
||||
<div class="van-cell van-cell--borderless van-address-item">
|
||||
<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>
|
||||
</div><i class="van-icon van-icon-edit van-address-item__edit">
|
||||
<!----></i>
|
||||
<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>
|
||||
</div><i class="van-icon van-icon-edit van-address-item__edit">
|
||||
<!----></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>
|
||||
|
||||
Loading…
x
Reference in New Issue
Block a user