cr cxxx- exxx
parent
c31aab0685
commit
927a0a6c81
|
@ -159,7 +159,17 @@ const Calendar = {
|
||||||
return inRange;
|
return inRange;
|
||||||
};
|
};
|
||||||
},
|
},
|
||||||
|
getDefaultLocale() {
|
||||||
|
const result = {
|
||||||
|
...enUS,
|
||||||
|
...this.$props.locale,
|
||||||
|
};
|
||||||
|
result.lang = {
|
||||||
|
...result.lang,
|
||||||
|
...(this.$props.locale || {}).lang,
|
||||||
|
};
|
||||||
|
return result;
|
||||||
|
},
|
||||||
renderCalendar(locale, localeCode) {
|
renderCalendar(locale, localeCode) {
|
||||||
const props = getOptionProps(this);
|
const props = getOptionProps(this);
|
||||||
const { sValue: value, sMode: mode, $listeners, $scopedSlots } = this;
|
const { sValue: value, sMode: mode, $listeners, $scopedSlots } = this;
|
||||||
|
@ -230,17 +240,6 @@ const Calendar = {
|
||||||
</div>
|
</div>
|
||||||
);
|
);
|
||||||
},
|
},
|
||||||
getDefaultLocale() {
|
|
||||||
const result = {
|
|
||||||
...enUS,
|
|
||||||
...this.$props.locale,
|
|
||||||
};
|
|
||||||
result.lang = {
|
|
||||||
...result.lang,
|
|
||||||
...(this.$props.locale || {}).lang,
|
|
||||||
};
|
|
||||||
return result;
|
|
||||||
},
|
|
||||||
},
|
},
|
||||||
|
|
||||||
render() {
|
render() {
|
||||||
|
|
|
@ -5,7 +5,7 @@ export default {
|
||||||
name: 'ACardGrid',
|
name: 'ACardGrid',
|
||||||
__ANT_CARD_GRID: true,
|
__ANT_CARD_GRID: true,
|
||||||
props: {
|
props: {
|
||||||
prefixCls: PropTypes.string.def('ant-card'),
|
prefixCls: PropTypes.string,
|
||||||
},
|
},
|
||||||
inject: {
|
inject: {
|
||||||
configProvider: { default: () => ({}) },
|
configProvider: { default: () => ({}) },
|
||||||
|
|
|
@ -5,7 +5,7 @@ import { ConfigConsumerProps } from '../config-provider';
|
||||||
export default {
|
export default {
|
||||||
name: 'ACardMeta',
|
name: 'ACardMeta',
|
||||||
props: {
|
props: {
|
||||||
prefixCls: PropTypes.string.def('ant-card'),
|
prefixCls: PropTypes.string,
|
||||||
title: PropTypes.any,
|
title: PropTypes.any,
|
||||||
description: PropTypes.any,
|
description: PropTypes.any,
|
||||||
},
|
},
|
||||||
|
|
|
@ -1,3 +1,4 @@
|
||||||
|
import PropTypes from '../_util/vue-types';
|
||||||
import Checkbox from './Checkbox';
|
import Checkbox from './Checkbox';
|
||||||
import hasProp from '../_util/props-util';
|
import hasProp from '../_util/props-util';
|
||||||
import { ConfigConsumerProps } from '../config-provider';
|
import { ConfigConsumerProps } from '../config-provider';
|
||||||
|
@ -9,22 +10,11 @@ export default {
|
||||||
prop: 'value',
|
prop: 'value',
|
||||||
},
|
},
|
||||||
props: {
|
props: {
|
||||||
prefixCls: {
|
prefixCls: PropTypes.string,
|
||||||
type: String,
|
defaultValue: PropTypes.array,
|
||||||
},
|
value: PropTypes.array,
|
||||||
defaultValue: {
|
options: PropTypes.array.def([]),
|
||||||
default: undefined,
|
disabled: PropTypes.bool,
|
||||||
type: Array,
|
|
||||||
},
|
|
||||||
value: {
|
|
||||||
default: undefined,
|
|
||||||
type: Array,
|
|
||||||
},
|
|
||||||
options: {
|
|
||||||
default: () => [],
|
|
||||||
type: Array,
|
|
||||||
},
|
|
||||||
disabled: Boolean,
|
|
||||||
},
|
},
|
||||||
provide() {
|
provide() {
|
||||||
return {
|
return {
|
||||||
|
|
|
@ -17,7 +17,6 @@ export default {
|
||||||
event: 'change',
|
event: 'change',
|
||||||
},
|
},
|
||||||
props: initDefaultProps(collapseProps(), {
|
props: initDefaultProps(collapseProps(), {
|
||||||
prefixCls: 'ant-collapse',
|
|
||||||
bordered: true,
|
bordered: true,
|
||||||
openAnimation: animation,
|
openAnimation: animation,
|
||||||
}),
|
}),
|
||||||
|
@ -30,7 +29,7 @@ export default {
|
||||||
const icon = expandIcon || (
|
const icon = expandIcon || (
|
||||||
<Icon type="right" rotate={panelProps.isActive ? 90 : undefined} />
|
<Icon type="right" rotate={panelProps.isActive ? 90 : undefined} />
|
||||||
);
|
);
|
||||||
return isValidElement(expandIcon ? icon[0] : icon)
|
return isValidElement(Array.isArray(expandIcon) ? icon[0] : icon)
|
||||||
? cloneElement(icon, {
|
? cloneElement(icon, {
|
||||||
class: `${prefixCls}-arrow`,
|
class: `${prefixCls}-arrow`,
|
||||||
})
|
})
|
||||||
|
|
|
@ -111,24 +111,19 @@ export default {
|
||||||
};
|
};
|
||||||
}
|
}
|
||||||
this.setState(state);
|
this.setState(state);
|
||||||
this.prevState = { ...this.$data, ...state };
|
|
||||||
},
|
},
|
||||||
open(val) {
|
open(val) {
|
||||||
const state = { sOpen: val };
|
const state = { sOpen: val };
|
||||||
this.setState(state);
|
this.setState(state);
|
||||||
this.prevState = { ...this.$data, ...state };
|
|
||||||
},
|
},
|
||||||
},
|
sOpen(val, oldVal) {
|
||||||
mounted() {
|
|
||||||
this.prevState = { ...this.$data };
|
|
||||||
},
|
|
||||||
updated() {
|
|
||||||
this.$nextTick(() => {
|
this.$nextTick(() => {
|
||||||
if (!hasProp(this, 'open') && this.prevState.sOpen && !this.sOpen) {
|
if (!hasProp(this, 'open') && oldVal && !val) {
|
||||||
this.focus();
|
this.focus();
|
||||||
}
|
}
|
||||||
});
|
});
|
||||||
},
|
},
|
||||||
|
},
|
||||||
methods: {
|
methods: {
|
||||||
clearSelection(e) {
|
clearSelection(e) {
|
||||||
e.preventDefault();
|
e.preventDefault();
|
||||||
|
|
|
@ -63,6 +63,13 @@ export default {
|
||||||
this.setState(state);
|
this.setState(state);
|
||||||
this.prevState = { ...this.$data, ...state };
|
this.prevState = { ...this.$data, ...state };
|
||||||
},
|
},
|
||||||
|
_open(val, oldVal) {
|
||||||
|
this.$nextTick(() => {
|
||||||
|
if (!hasProp(this, 'open') && oldVal && !val) {
|
||||||
|
this.focus();
|
||||||
|
}
|
||||||
|
});
|
||||||
|
},
|
||||||
},
|
},
|
||||||
mounted() {
|
mounted() {
|
||||||
this.prevState = { ...this.$data };
|
this.prevState = { ...this.$data };
|
||||||
|
|
|
@ -230,3 +230,11 @@ exports[`MonthPicker and WeekPicker render WeekPicker 1`] = `
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
`;
|
`;
|
||||||
|
|
||||||
|
exports[`Picker format by locale date 1`] = `<span class="ant-calendar-picker"><div class=""><input readonly="true" placeholder="请选择日期" class="ant-calendar-picker-input ant-input"><i aria-label="图标: calendar" class="ant-calendar-picker-icon anticon anticon-calendar"><svg viewBox="64 64 896 896" data-icon="calendar" width="1em" height="1em" fill="currentColor" aria-hidden="true" class=""><path d="M880 184H712v-64c0-4.4-3.6-8-8-8h-56c-4.4 0-8 3.6-8 8v64H384v-64c0-4.4-3.6-8-8-8h-56c-4.4 0-8 3.6-8 8v64H144c-17.7 0-32 14.3-32 32v664c0 17.7 14.3 32 32 32h736c17.7 0 32-14.3 32-32V216c0-17.7-14.3-32-32-32zm-40 656H184V460h656v380zM184 392V256h128v48c0 4.4 3.6 8 8 8h56c4.4 0 8-3.6 8-8v-48h256v48c0 4.4 3.6 8 8 8h56c4.4 0 8-3.6 8-8v-48h128v136H184z"></path></svg></i></div></span>`;
|
||||||
|
|
||||||
|
exports[`Picker format by locale dateTime 1`] = `<span class="ant-calendar-picker"><div class=""><input readonly="true" placeholder="请选择日期" class="ant-calendar-picker-input ant-input"><i aria-label="图标: calendar" class="ant-calendar-picker-icon anticon anticon-calendar"><svg viewBox="64 64 896 896" data-icon="calendar" width="1em" height="1em" fill="currentColor" aria-hidden="true" class=""><path d="M880 184H712v-64c0-4.4-3.6-8-8-8h-56c-4.4 0-8 3.6-8 8v64H384v-64c0-4.4-3.6-8-8-8h-56c-4.4 0-8 3.6-8 8v64H144c-17.7 0-32 14.3-32 32v664c0 17.7 14.3 32 32 32h736c17.7 0 32-14.3 32-32V216c0-17.7-14.3-32-32-32zm-40 656H184V460h656v380zM184 392V256h128v48c0 4.4 3.6 8 8 8h56c4.4 0 8-3.6 8-8v-48h256v48c0 4.4 3.6 8 8 8h56c4.4 0 8-3.6 8-8v-48h128v136H184z"></path></svg></i></div></span>`;
|
||||||
|
|
||||||
|
exports[`Picker format by locale month 1`] = `<span class="ant-calendar-picker"><div class=""><input readonly="true" placeholder="请选择日期" class="ant-calendar-picker-input ant-input"><i aria-label="图标: calendar" class="ant-calendar-picker-icon anticon anticon-calendar"><svg viewBox="64 64 896 896" data-icon="calendar" width="1em" height="1em" fill="currentColor" aria-hidden="true" class=""><path d="M880 184H712v-64c0-4.4-3.6-8-8-8h-56c-4.4 0-8 3.6-8 8v64H384v-64c0-4.4-3.6-8-8-8h-56c-4.4 0-8 3.6-8 8v64H144c-17.7 0-32 14.3-32 32v664c0 17.7 14.3 32 32 32h736c17.7 0 32-14.3 32-32V216c0-17.7-14.3-32-32-32zm-40 656H184V460h656v380zM184 392V256h128v48c0 4.4 3.6 8 8 8h56c4.4 0 8-3.6 8-8v-48h256v48c0 4.4 3.6 8 8 8h56c4.4 0 8-3.6 8-8v-48h128v136H184z"></path></svg></i></div></span>`;
|
||||||
|
|
||||||
|
exports[`Picker format by locale week 1`] = `<span class="ant-calendar-picker"><span class="" style="display: inline-block; width: 100%;"><input readonly="true" placeholder="请选择日期" class="ant-calendar-picker-input ant-input"><i aria-label="图标: calendar" class="ant-calendar-picker-icon anticon anticon-calendar"><svg viewBox="64 64 896 896" data-icon="calendar" width="1em" height="1em" fill="currentColor" aria-hidden="true" class=""><path d="M880 184H712v-64c0-4.4-3.6-8-8-8h-56c-4.4 0-8 3.6-8 8v64H384v-64c0-4.4-3.6-8-8-8h-56c-4.4 0-8 3.6-8 8v64H144c-17.7 0-32 14.3-32 32v664c0 17.7 14.3 32 32 32h736c17.7 0 32-14.3 32-32V216c0-17.7-14.3-32-32-32zm-40 656H184V460h656v380zM184 392V256h128v48c0 4.4 3.6 8 8 8h56c4.4 0 8-3.6 8-8v-48h256v48c0 4.4 3.6 8 8 8h56c4.4 0 8-3.6 8-8v-48h128v136H184z"></path></svg></i></span></span>`;
|
||||||
|
|
|
@ -2,9 +2,50 @@ import { mount } from '@vue/test-utils';
|
||||||
import { asyncExpect } from '@/tests/utils';
|
import { asyncExpect } from '@/tests/utils';
|
||||||
import moment from 'moment';
|
import moment from 'moment';
|
||||||
import DatePicker from '../';
|
import DatePicker from '../';
|
||||||
|
import LocaleProvider from '../../locale-provider';
|
||||||
|
import locale from '../../locale-provider/zh_CN';
|
||||||
|
|
||||||
const { MonthPicker, WeekPicker } = DatePicker;
|
const { MonthPicker, WeekPicker } = DatePicker;
|
||||||
|
|
||||||
|
describe('Picker format by locale', () => {
|
||||||
|
const myLocale = {
|
||||||
|
...locale,
|
||||||
|
DatePicker: {
|
||||||
|
...locale.DatePicker,
|
||||||
|
dateFormat: 'YYYY 年 M 月 D 日',
|
||||||
|
dateTimeFormat: 'YYYY 年 M 月 D 日 H 时 m 分 s 秒',
|
||||||
|
weekFormat: 'YYYY 年 W 周',
|
||||||
|
monthFormat: 'YYYY 年 M 月',
|
||||||
|
},
|
||||||
|
};
|
||||||
|
|
||||||
|
const date = moment('2000-01-01', 'YYYY-MM-DD');
|
||||||
|
function matchPicker(name, Picker, props) {
|
||||||
|
it(name, async () => {
|
||||||
|
const wrapper = mount(
|
||||||
|
{
|
||||||
|
render() {
|
||||||
|
return (
|
||||||
|
<LocaleProvider locale={myLocale}>
|
||||||
|
<Picker {...{ value: date, ...props }} />
|
||||||
|
</LocaleProvider>
|
||||||
|
);
|
||||||
|
},
|
||||||
|
},
|
||||||
|
{ sync: false },
|
||||||
|
);
|
||||||
|
await asyncExpect(() => {
|
||||||
|
expect(wrapper.html()).toMatchSnapshot();
|
||||||
|
});
|
||||||
|
});
|
||||||
|
}
|
||||||
|
|
||||||
|
matchPicker('date', DatePicker);
|
||||||
|
matchPicker('dateTime', DatePicker, { showTime: true });
|
||||||
|
matchPicker('week', WeekPicker);
|
||||||
|
matchPicker('month', MonthPicker);
|
||||||
|
});
|
||||||
|
|
||||||
describe('MonthPicker and WeekPicker', () => {
|
describe('MonthPicker and WeekPicker', () => {
|
||||||
it('render MonthPicker', async () => {
|
it('render MonthPicker', async () => {
|
||||||
const birthday = moment('2000-01-01', 'YYYY-MM-DD').locale('zh-cn');
|
const birthday = moment('2000-01-01', 'YYYY-MM-DD').locale('zh-cn');
|
||||||
|
|
|
@ -58,7 +58,6 @@ export default function createPicker(TheCalendar, props) {
|
||||||
state.showDate = props.value;
|
state.showDate = props.value;
|
||||||
}
|
}
|
||||||
this.setState(state);
|
this.setState(state);
|
||||||
this.prevState = { ...this.$data, ...state };
|
|
||||||
},
|
},
|
||||||
value(val) {
|
value(val) {
|
||||||
const state = {};
|
const state = {};
|
||||||
|
@ -67,23 +66,18 @@ export default function createPicker(TheCalendar, props) {
|
||||||
state.showDate = val;
|
state.showDate = val;
|
||||||
}
|
}
|
||||||
this.setState(state);
|
this.setState(state);
|
||||||
this.prevState = { ...this.$data, ...state };
|
|
||||||
},
|
},
|
||||||
},
|
_open(val, oldVal) {
|
||||||
mounted() {
|
|
||||||
this.prevState = { ...this.$data };
|
|
||||||
},
|
|
||||||
updated() {
|
|
||||||
this.$nextTick(() => {
|
this.$nextTick(() => {
|
||||||
if (!hasProp(this, 'open') && this.prevState._open && !this._open) {
|
if (!hasProp(this, 'open') && oldVal && !val) {
|
||||||
this.focus();
|
this.focus();
|
||||||
}
|
}
|
||||||
});
|
});
|
||||||
},
|
},
|
||||||
|
},
|
||||||
methods: {
|
methods: {
|
||||||
renderFooter(...args) {
|
renderFooter(...args) {
|
||||||
const { $scopedSlots, $slots } = this;
|
const { $scopedSlots, $slots, _prefixCls: prefixCls } = this;
|
||||||
const { _prefixCls: prefixCls } = this;
|
|
||||||
const renderExtraFooter =
|
const renderExtraFooter =
|
||||||
this.renderExtraFooter || $scopedSlots.renderExtraFooter || $slots.renderExtraFooter;
|
this.renderExtraFooter || $scopedSlots.renderExtraFooter || $slots.renderExtraFooter;
|
||||||
return renderExtraFooter ? (
|
return renderExtraFooter ? (
|
||||||
|
|
|
@ -31,5 +31,9 @@
|
||||||
},
|
},
|
||||||
"timePickerLocale": {
|
"timePickerLocale": {
|
||||||
"placeholder": "Select time"
|
"placeholder": "Select time"
|
||||||
}
|
},
|
||||||
|
"dateFormat": "YYYY-MM-DD",
|
||||||
|
"dateTimeFormat": "YYYY-MM-DD HH:mm:ss",
|
||||||
|
"weekFormat": "YYYY-wo",
|
||||||
|
"monthFormat": "YYYY-MM"
|
||||||
}
|
}
|
||||||
|
|
|
@ -12,6 +12,7 @@
|
||||||
| visible | Whether the Drawer dialog is visible or not. | boolean | false |
|
| visible | Whether the Drawer dialog is visible or not. | boolean | false |
|
||||||
| wrapClassName | The class name of the container of the Drawer dialog. | string | - |
|
| wrapClassName | The class name of the container of the Drawer dialog. | string | - |
|
||||||
| wrapStyle | The style of the container of the Drawer dialog. | object | - |
|
| wrapStyle | The style of the container of the Drawer dialog. | object | - |
|
||||||
|
| bodyStyle | Style of floating layer, typically used for adjusting its position. | object | - |
|
||||||
| width | Width of the Drawer dialog. | string\|number | 256 |
|
| width | Width of the Drawer dialog. | string\|number | 256 |
|
||||||
| height | placement is `top` or `bottom`, height of the Drawer dialog. | string\|number | - |
|
| height | placement is `top` or `bottom`, height of the Drawer dialog. | string\|number | - |
|
||||||
| zIndex | The `z-index` of the Drawer. | Number | 1000 |
|
| zIndex | The `z-index` of the Drawer. | Number | 1000 |
|
||||||
|
|
|
@ -17,6 +17,7 @@ const Drawer = {
|
||||||
mask: PropTypes.bool.def(true),
|
mask: PropTypes.bool.def(true),
|
||||||
maskStyle: PropTypes.object,
|
maskStyle: PropTypes.object,
|
||||||
wrapStyle: PropTypes.object,
|
wrapStyle: PropTypes.object,
|
||||||
|
bodyStyle: PropTypes.object,
|
||||||
title: PropTypes.any,
|
title: PropTypes.any,
|
||||||
visible: PropTypes.bool,
|
visible: PropTypes.bool,
|
||||||
width: PropTypes.oneOfType([PropTypes.string, PropTypes.number]).def(256),
|
width: PropTypes.oneOfType([PropTypes.string, PropTypes.number]).def(256),
|
||||||
|
@ -106,13 +107,11 @@ const Drawer = {
|
||||||
}
|
}
|
||||||
},
|
},
|
||||||
getRcDrawerStyle() {
|
getRcDrawerStyle() {
|
||||||
const { zIndex, placement, maskStyle, wrapStyle } = this.$props;
|
const { zIndex, placement } = this.$props;
|
||||||
const { _push: push } = this.$data;
|
const { _push: push } = this.$data;
|
||||||
return {
|
return {
|
||||||
...maskStyle,
|
|
||||||
zIndex,
|
zIndex,
|
||||||
transform: push ? this.getPushTransform(placement) : undefined,
|
transform: push ? this.getPushTransform(placement) : undefined,
|
||||||
...wrapStyle,
|
|
||||||
};
|
};
|
||||||
},
|
},
|
||||||
renderHeader(prefixCls) {
|
renderHeader(prefixCls) {
|
||||||
|
@ -143,7 +142,7 @@ const Drawer = {
|
||||||
return null;
|
return null;
|
||||||
}
|
}
|
||||||
this.destroyClose = false;
|
this.destroyClose = false;
|
||||||
const { placement } = this.$props;
|
const { placement, bodyStyle } = this.$props;
|
||||||
|
|
||||||
const containerStyle =
|
const containerStyle =
|
||||||
placement === 'left' || placement === 'right'
|
placement === 'left' || placement === 'right'
|
||||||
|
@ -167,7 +166,7 @@ const Drawer = {
|
||||||
onTransitionend={this.onDestroyTransitionEnd}
|
onTransitionend={this.onDestroyTransitionEnd}
|
||||||
>
|
>
|
||||||
{this.renderHeader(prefixCls)}
|
{this.renderHeader(prefixCls)}
|
||||||
<div key="body" class={`${prefixCls}-body`}>
|
<div key="body" class={`${prefixCls}-body`} style={bodyStyle}>
|
||||||
{this.$slots.default}
|
{this.$slots.default}
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
|
|
|
@ -12,6 +12,7 @@
|
||||||
| visible | Drawer 是否可见 | boolean | - |
|
| visible | Drawer 是否可见 | boolean | - |
|
||||||
| wrapClassName | 对话框外层容器的类名 | string | - |
|
| wrapClassName | 对话框外层容器的类名 | string | - |
|
||||||
| wrapStyle | 对话框外层容器的`style` | object | - |
|
| wrapStyle | 对话框外层容器的`style` | object | - |
|
||||||
|
| bodyStyle | 可用于设置 Drawer 的样式,调整浮层位置等 | object | - |
|
||||||
| width | 宽度 | string \| number | 256 |
|
| width | 宽度 | string \| number | 256 |
|
||||||
| height | 高度, 在 `placement` 为 `top` 或 `bottom` 时使用 | string \| number | 256 |
|
| height | 高度, 在 `placement` 为 `top` 或 `bottom` 时使用 | string \| number | 256 |
|
||||||
| zIndex | 设置 Drawer 的 `z-index` | Number | 1000 |
|
| zIndex | 设置 Drawer 的 `z-index` | Number | 1000 |
|
||||||
|
|
|
@ -1,7 +1,7 @@
|
||||||
// Jest Snapshot v1, https://goo.gl/fbAQLP
|
// Jest Snapshot v1, https://goo.gl/fbAQLP
|
||||||
|
|
||||||
exports[`DropdownButton should support href like Button 1`] = `
|
exports[`DropdownButton should support href like Button 1`] = `
|
||||||
<div class="ant-btn-group ant-dropdown-button"><button type="button" class="ant-btn ant-btn-default"></button><button type="button" class="ant-btn ant-btn-default ant-dropdown-trigger"><i aria-label="icon: ellipsis" class="anticon anticon-ellipsis"><svg viewBox="64 64 896 896" data-icon="ellipsis" width="1em" height="1em" fill="currentColor" aria-hidden="true" class="">
|
<div class="ant-btn-group ant-dropdown-button"><a href="https://ant.design" class="ant-btn ant-btn-default"></a><button type="button" class="ant-btn ant-btn-default ant-dropdown-trigger"><i aria-label="icon: ellipsis" class="anticon anticon-ellipsis"><svg viewBox="64 64 896 896" data-icon="ellipsis" width="1em" height="1em" fill="currentColor" aria-hidden="true" class="">
|
||||||
<path d="M176 511a56 56 0 1 0 112 0 56 56 0 1 0-112 0zm280 0a56 56 0 1 0 112 0 56 56 0 1 0-112 0zm280 0a56 56 0 1 0 112 0 56 56 0 1 0-112 0z"></path>
|
<path d="M176 511a56 56 0 1 0 112 0 56 56 0 1 0-112 0zm280 0a56 56 0 1 0 112 0 56 56 0 1 0-112 0zm280 0a56 56 0 1 0 112 0 56 56 0 1 0-112 0z"></path>
|
||||||
</svg></i></button></div>
|
</svg></i></button></div>
|
||||||
`;
|
`;
|
||||||
|
|
|
@ -89,7 +89,13 @@ export default {
|
||||||
|
|
||||||
return (
|
return (
|
||||||
<ButtonGroup {...buttonGroupProps}>
|
<ButtonGroup {...buttonGroupProps}>
|
||||||
<Button type={type} disabled={disabled} onClick={this.onClick} htmlType={htmlType}>
|
<Button
|
||||||
|
type={type}
|
||||||
|
disabled={disabled}
|
||||||
|
onClick={this.onClick}
|
||||||
|
htmlType={htmlType}
|
||||||
|
href={href}
|
||||||
|
>
|
||||||
{this.$slots.default}
|
{this.$slots.default}
|
||||||
</Button>
|
</Button>
|
||||||
<Dropdown {...dropdownProps}>
|
<Dropdown {...dropdownProps}>
|
||||||
|
|
|
@ -2,7 +2,7 @@ import RcDropdown from '../vc-dropdown/src/index';
|
||||||
import DropdownButton from './dropdown-button';
|
import DropdownButton from './dropdown-button';
|
||||||
import PropTypes from '../_util/vue-types';
|
import PropTypes from '../_util/vue-types';
|
||||||
import { cloneElement } from '../_util/vnode';
|
import { cloneElement } from '../_util/vnode';
|
||||||
import { getOptionProps, getPropsData } from '../_util/props-util';
|
import { getOptionProps, getPropsData, getComponentFromProp } from '../_util/props-util';
|
||||||
import getDropdownProps from './getDropdownProps';
|
import getDropdownProps from './getDropdownProps';
|
||||||
import { ConfigConsumerProps } from '../config-provider';
|
import { ConfigConsumerProps } from '../config-provider';
|
||||||
import Icon from '../icon';
|
import Icon from '../icon';
|
||||||
|
@ -12,7 +12,7 @@ const Dropdown = {
|
||||||
name: 'ADropdown',
|
name: 'ADropdown',
|
||||||
props: {
|
props: {
|
||||||
...DropdownProps,
|
...DropdownProps,
|
||||||
prefixCls: PropTypes.string.def('ant-dropdown'),
|
prefixCls: PropTypes.string,
|
||||||
mouseEnterDelay: PropTypes.number.def(0.15),
|
mouseEnterDelay: PropTypes.number.def(0.15),
|
||||||
mouseLeaveDelay: PropTypes.number.def(0.1),
|
mouseLeaveDelay: PropTypes.number.def(0.1),
|
||||||
placement: DropdownProps.placement.def('bottomLeft'),
|
placement: DropdownProps.placement.def('bottomLeft'),
|
||||||
|
@ -44,11 +44,11 @@ const Dropdown = {
|
||||||
return 'slide-up';
|
return 'slide-up';
|
||||||
},
|
},
|
||||||
renderOverlay(prefixCls) {
|
renderOverlay(prefixCls) {
|
||||||
const { $slots } = this;
|
const overlay = getComponentFromProp(this, 'overlay');
|
||||||
const overlay = this.overlay || ($slots.overlay && $slots.overlay[0]);
|
const overlayNode = Array.isArray(overlay) ? overlay[0] : overlay;
|
||||||
// menu cannot be selectable in dropdown defaultly
|
// menu cannot be selectable in dropdown defaultly
|
||||||
// menu should be focusable in dropdown defaultly
|
// menu should be focusable in dropdown defaultly
|
||||||
const overlayProps = overlay && getPropsData(overlay);
|
const overlayProps = overlayNode && getPropsData(overlayNode);
|
||||||
const { selectable = false, focusable = true } = overlayProps || {};
|
const { selectable = false, focusable = true } = overlayProps || {};
|
||||||
const expandIcon = (
|
const expandIcon = (
|
||||||
<span class={`${prefixCls}-menu-submenu-arrow`}>
|
<span class={`${prefixCls}-menu-submenu-arrow`}>
|
||||||
|
@ -57,8 +57,8 @@ const Dropdown = {
|
||||||
);
|
);
|
||||||
|
|
||||||
const fixedModeOverlay =
|
const fixedModeOverlay =
|
||||||
overlay && overlay.componentOptions
|
overlayNode && overlayNode.componentOptions
|
||||||
? cloneElement(overlay, {
|
? cloneElement(overlayNode, {
|
||||||
props: {
|
props: {
|
||||||
mode: 'vertical',
|
mode: 'vertical',
|
||||||
selectable,
|
selectable,
|
||||||
|
|
|
@ -6,7 +6,7 @@
|
||||||
| -------- | ----------- | ---- | ------- |
|
| -------- | ----------- | ---- | ------- |
|
||||||
| disabled | whether the dropdown menu is disabled | boolean | - |
|
| disabled | whether the dropdown menu is disabled | boolean | - |
|
||||||
| getPopupContainer | to set the container of the dropdown menu. The default is to create a `div` element in `body`, you can reset it to the scrolling area and make a relative reposition. [example](https://codepen.io/afc163/pen/zEjNOy?editors=0010) | Function(triggerNode) | `() => document.body` |
|
| getPopupContainer | to set the container of the dropdown menu. The default is to create a `div` element in `body`, you can reset it to the scrolling area and make a relative reposition. [example](https://codepen.io/afc163/pen/zEjNOy?editors=0010) | Function(triggerNode) | `() => document.body` |
|
||||||
| overlay(slot) | the dropdown menu | [Menu](/components/menu) | - |
|
| overlay(slot-scope) | the dropdown menu | [Menu](/components/menu) | - |
|
||||||
| overlayClassName | Class name of the dropdown root element | string | - |
|
| overlayClassName | Class name of the dropdown root element | string | - |
|
||||||
| overlayStyle | Style of the dropdown root element | object | - |
|
| overlayStyle | Style of the dropdown root element | object | - |
|
||||||
| placement | placement of pop menu: `bottomLeft` `bottomCenter` `bottomRight` `topLeft` `topCenter` `topRight` | String | `bottomLeft` |
|
| placement | placement of pop menu: `bottomLeft` `bottomCenter` `bottomRight` `topLeft` `topCenter` `topRight` | String | `bottomLeft` |
|
||||||
|
@ -29,7 +29,7 @@ You should use [Menu](/components/menu/) as `overlay`. The menu items and divide
|
||||||
| Property | Description | Type | Default |
|
| Property | Description | Type | Default |
|
||||||
| -------- | ----------- | ---- | ------- |
|
| -------- | ----------- | ---- | ------- |
|
||||||
| disabled | whether the dropdown menu is disabled | boolean | - |
|
| disabled | whether the dropdown menu is disabled | boolean | - |
|
||||||
| overlay(slot) | the dropdown menu | [Menu](/components/menu) | - |
|
| overlay(slot-scope) | the dropdown menu | [Menu](/components/menu) | - |
|
||||||
| placement | placement of pop menu: `bottomLeft` `bottomCenter` `bottomRight` `topLeft` `topCenter` `topRight` | String | `bottomLeft` |
|
| placement | placement of pop menu: `bottomLeft` `bottomCenter` `bottomRight` `topLeft` `topCenter` `topRight` | String | `bottomLeft` |
|
||||||
| size | size of the button, the same as [Button](/components/button) | string | `default` |
|
| size | size of the button, the same as [Button](/components/button) | string | `default` |
|
||||||
| trigger | the trigger mode which executes the drop-down action | Array<`click`\|`hover`\|`contextmenu`> | `['hover']` |
|
| trigger | the trigger mode which executes the drop-down action | Array<`click`\|`hover`\|`contextmenu`> | `['hover']` |
|
||||||
|
|
|
@ -6,7 +6,7 @@
|
||||||
| --- | --- | --- | --- |
|
| --- | --- | --- | --- |
|
||||||
| disabled | 菜单是否禁用 | boolean | - |
|
| disabled | 菜单是否禁用 | boolean | - |
|
||||||
| getPopupContainer | 菜单渲染父节点。默认渲染到 body 上,如果你遇到菜单滚动定位问题,试试修改为滚动的区域,并相对其定位。 | Function(triggerNode) | `() => document.body` |
|
| getPopupContainer | 菜单渲染父节点。默认渲染到 body 上,如果你遇到菜单滚动定位问题,试试修改为滚动的区域,并相对其定位。 | Function(triggerNode) | `() => document.body` |
|
||||||
| overlay(slot) | 菜单 | [Menu](/components/menu-cn) | - |
|
| overlay(slot-scope) | 菜单 | [Menu](/components/menu-cn) | - |
|
||||||
| overlayClassName | 下拉根元素的类名称 | string | - |
|
| overlayClassName | 下拉根元素的类名称 | string | - |
|
||||||
| overlayStyle | 下拉根元素的样式 | object | - |
|
| overlayStyle | 下拉根元素的样式 | object | - |
|
||||||
| placement | 菜单弹出位置:`bottomLeft` `bottomCenter` `bottomRight` `topLeft` `topCenter` `topRight` | String | `bottomLeft` |
|
| placement | 菜单弹出位置:`bottomLeft` `bottomCenter` `bottomRight` `topLeft` `topCenter` `topRight` | String | `bottomLeft` |
|
||||||
|
@ -30,7 +30,7 @@
|
||||||
| 参数 | 说明 | 类型 | 默认值 |
|
| 参数 | 说明 | 类型 | 默认值 |
|
||||||
| --- | --- | --- | --- |
|
| --- | --- | --- | --- |
|
||||||
| disabled | 菜单是否禁用 | boolean | - |
|
| disabled | 菜单是否禁用 | boolean | - |
|
||||||
| overlay(slot) | 菜单 | [Menu](/components/menu-cn/) | - |
|
| overlay(slot-scope) | 菜单 | [Menu](/components/menu-cn/) | - |
|
||||||
| placement | 菜单弹出位置:`bottomLeft` `bottomCenter` `bottomRight` `topLeft` `topCenter` `topRight` | String | `bottomLeft` |
|
| placement | 菜单弹出位置:`bottomLeft` `bottomCenter` `bottomRight` `topLeft` `topCenter` `topRight` | String | `bottomLeft` |
|
||||||
| size | 按钮大小,和 [Button](/components/button-cn/) 一致 | string | 'default' |
|
| size | 按钮大小,和 [Button](/components/button-cn/) 一致 | string | 'default' |
|
||||||
| trigger | 触发下拉的行为 | Array<`click`\|`hover`\|`contextmenu`> | `['hover']` |
|
| trigger | 触发下拉的行为 | Array<`click`\|`hover`\|`contextmenu`> | `['hover']` |
|
||||||
|
|
|
@ -3,6 +3,7 @@ import { ConfigConsumerProps } from '../config-provider';
|
||||||
import { getComponentFromProp } from '../_util/props-util';
|
import { getComponentFromProp } from '../_util/props-util';
|
||||||
import LocaleReceiver from '../locale-provider/LocaleReceiver';
|
import LocaleReceiver from '../locale-provider/LocaleReceiver';
|
||||||
import emptyImg from './empty.svg';
|
import emptyImg from './empty.svg';
|
||||||
|
import Base from '../base';
|
||||||
|
|
||||||
export const TransferLocale = () => {
|
export const TransferLocale = () => {
|
||||||
return {
|
return {
|
||||||
|
@ -41,13 +42,10 @@ const Empty = {
|
||||||
} else {
|
} else {
|
||||||
imageNode = image;
|
imageNode = image;
|
||||||
}
|
}
|
||||||
|
|
||||||
return (
|
return (
|
||||||
<div class={prefixCls} {...restProps}>
|
<div class={prefixCls} {...{ on: this.$listeners }}>
|
||||||
<div class={`${prefixCls}-image`}>{imageNode}</div>
|
<div class={`${prefixCls}-image`}>{imageNode}</div>
|
||||||
|
|
||||||
<p class={`${prefixCls}-description`}>{des}</p>
|
<p class={`${prefixCls}-description`}>{des}</p>
|
||||||
|
|
||||||
{this.$slots.default && <div class={`${prefixCls}-footer`}>{this.$slots.default}</div>}
|
{this.$slots.default && <div class={`${prefixCls}-footer`}>{this.$slots.default}</div>}
|
||||||
</div>
|
</div>
|
||||||
);
|
);
|
||||||
|
@ -60,6 +58,7 @@ const Empty = {
|
||||||
|
|
||||||
/* istanbul ignore next */
|
/* istanbul ignore next */
|
||||||
Empty.install = function(Vue) {
|
Empty.install = function(Vue) {
|
||||||
|
Vue.use(Base);
|
||||||
Vue.component(Empty.name, Empty);
|
Vue.component(Empty.name, Empty);
|
||||||
};
|
};
|
||||||
|
|
||||||
|
|
|
@ -5,6 +5,8 @@
|
||||||
import { AntdComponent } from './component';
|
import { AntdComponent } from './component';
|
||||||
import { Meta } from './meta';
|
import { Meta } from './meta';
|
||||||
|
|
||||||
|
export type CardSize = 'default' | 'small';
|
||||||
|
|
||||||
export declare class Card extends AntdComponent {
|
export declare class Card extends AntdComponent {
|
||||||
static Grid: any;
|
static Grid: any;
|
||||||
static Meta: typeof Meta;
|
static Meta: typeof Meta;
|
||||||
|
@ -89,4 +91,10 @@ export declare class Card extends AntdComponent {
|
||||||
* @type string
|
* @type string
|
||||||
*/
|
*/
|
||||||
type: string;
|
type: string;
|
||||||
|
|
||||||
|
/**
|
||||||
|
* Size of card
|
||||||
|
* @type string
|
||||||
|
*/
|
||||||
|
size: CardSize;
|
||||||
}
|
}
|
||||||
|
|
|
@ -41,4 +41,10 @@ export declare class Collapse extends AntdComponent {
|
||||||
* @type boolean
|
* @type boolean
|
||||||
*/
|
*/
|
||||||
destroyInactivePanel: boolean;
|
destroyInactivePanel: boolean;
|
||||||
|
|
||||||
|
/**
|
||||||
|
* allow to customize collapse icon.
|
||||||
|
* @type any (function | slot-scope)
|
||||||
|
*/
|
||||||
|
expandIcon: any;
|
||||||
}
|
}
|
||||||
|
|
|
@ -72,6 +72,12 @@ export declare class Drawer extends AntdComponent {
|
||||||
*/
|
*/
|
||||||
wrapStyle: object;
|
wrapStyle: object;
|
||||||
|
|
||||||
|
/**
|
||||||
|
* Style of floating layer, typically used for adjusting its position.
|
||||||
|
* @type object
|
||||||
|
*/
|
||||||
|
bodyStyle: object;
|
||||||
|
|
||||||
/**
|
/**
|
||||||
* Width of the Drawer dialog.
|
* Width of the Drawer dialog.
|
||||||
* @default 256
|
* @default 256
|
||||||
|
|
|
@ -14,9 +14,9 @@ export declare class DropdownButton extends AntdComponent {
|
||||||
|
|
||||||
/**
|
/**
|
||||||
* the dropdown menu
|
* the dropdown menu
|
||||||
* @type Menu
|
* @type () => Menu
|
||||||
*/
|
*/
|
||||||
overlay: Menu;
|
overlay: any;
|
||||||
|
|
||||||
/**
|
/**
|
||||||
* placement of pop menu: bottomLeft bottomCenter bottomRight topLeft topCenter topRight
|
* placement of pop menu: bottomLeft bottomCenter bottomRight topLeft topCenter topRight
|
||||||
|
|
|
@ -18,9 +18,9 @@ export declare class Dropdown extends AntdComponent {
|
||||||
|
|
||||||
/**
|
/**
|
||||||
* the dropdown menu
|
* the dropdown menu
|
||||||
* @type Menu
|
* @type () => Menu
|
||||||
*/
|
*/
|
||||||
overlay: Menu;
|
overlay: any;
|
||||||
|
|
||||||
/**
|
/**
|
||||||
* Class name of the dropdown root element
|
* Class name of the dropdown root element
|
||||||
|
|
Loading…
Reference in New Issue