A dog is a type of domesticated animal.Known for its loyalty and faithfulness,it can be found as a welcome guest in many households across the world.
diff --git a/components/collapse/demo/index.vue b/components/collapse/demo/index.vue
index 3a671fb60..3536dd1e5 100644
--- a/components/collapse/demo/index.vue
+++ b/components/collapse/demo/index.vue
@@ -29,6 +29,7 @@ const md = {
export default {
category: 'Components',
type: 'Data Display',
+ zhType: '数据展示',
title: 'Collapse',
subtitle: '折叠面板',
cols: 1,
diff --git a/components/collapse/style/index.less b/components/collapse/style/index.less
index 622f48d32..74447fb11 100644
--- a/components/collapse/style/index.less
+++ b/components/collapse/style/index.less
@@ -37,17 +37,17 @@
.arrow {
.iconfont-mixin();
- .collapse-close();
font-size: @font-size-sm;
position: absolute;
display: inline-block;
line-height: 46px;
vertical-align: top;
- transition: transform 0.24s;
- top: 0;
+ top: 50%;
+ transform: translateY(-50%);
left: @padding-md;
- &:before {
- content: "\E61F";
+ & svg {
+ .collapse-close();
+ transition: transform 0.24s;
}
}
@@ -89,7 +89,7 @@
}
& > &-item > &-header[aria-expanded="true"] {
- .arrow {
+ .anticon-right svg {
.collapse-open();
}
}
diff --git a/components/date-picker/RangePicker.jsx b/components/date-picker/RangePicker.jsx
index f65d572f6..e62240197 100644
--- a/components/date-picker/RangePicker.jsx
+++ b/components/date-picker/RangePicker.jsx
@@ -8,8 +8,9 @@ import Icon from '../icon'
import Tag from '../tag'
import interopDefault from '../_util/interopDefault'
import { RangePickerProps } from './interface'
-import { hasProp, getOptionProps, initDefaultProps, mergeProps } from '../_util/props-util'
+import { hasProp, getOptionProps, initDefaultProps, mergeProps, getComponentFromProp, isValidElement } from '../_util/props-util'
import BaseMixin from '../_util/BaseMixin'
+import { cloneElement } from '../_util/vnode'
function noop () {}
function getShowDateFromValue (value) {
const [start, end] = value
@@ -130,6 +131,7 @@ export default {
formatValue(value[0], this.format),
formatValue(value[1], this.format),
])
+ this.focus()
},
handleOpenChange (open) {
@@ -174,6 +176,7 @@ export default {
this.setValue(value, true)
this.$emit('ok', value)
+ this.$emit('openChange', false)
},
setValue (value, hidePanel) {
@@ -224,17 +227,18 @@ export default {
)
})
- const rangeNode = (
+ const rangeNode = (operations && operations.length > 0) ? (
- )
+
) : null
return [rangeNode, customFooter]
},
},
render () {
const props = getOptionProps(this)
+ let suffixIcon = getComponentFromProp(this, 'suffixIcon')
+ suffixIcon = Array.isArray(suffixIcon) ? suffixIcon[0] : suffixIcon
const { sValue: value, sShowDate: showDate, sHoverValue: hoverValue, sOpen: open, $listeners, $scopedSlots } = this
const { calendarChange = noop, ok = noop, focus = noop, blur = noop, panelChange = noop } = $listeners
const {
@@ -296,7 +300,7 @@ export default {
ok: ok,
valueChange: this.handleShowDateChange,
hoverChange: this.handleHoverChange,
- panelChange: panelChange,
+ panelChange,
inputSelect: this.handleCalendarInputSelect,
},
class: calendarClassName,
@@ -316,12 +320,24 @@ export default {
const clearIcon = (!props.disabled && props.allowClear && value && (value[0] || value[1])) ? (
) : null
+ const inputIcon = suffixIcon && (
+ isValidElement(suffixIcon)
+ ? cloneElement(
+ suffixIcon,
+ {
+ class: `${prefixCls}-picker-icon`,
+ },
+ ) :
{suffixIcon}) || (
+
+ )
+
const input = ({ value: inputValue }) => {
const start = inputValue[0]
const end = inputValue[1]
@@ -345,7 +361,7 @@ export default {
tabIndex={-1}
/>
{clearIcon}
-
+ {inputIcon}
)
}
diff --git a/components/date-picker/WeekPicker.jsx b/components/date-picker/WeekPicker.jsx
index bd3fa6bf6..d7526e6bf 100644
--- a/components/date-picker/WeekPicker.jsx
+++ b/components/date-picker/WeekPicker.jsx
@@ -3,10 +3,11 @@ import * as moment from 'moment'
import Calendar from '../vc-calendar'
import VcDatePicker from '../vc-calendar/src/Picker'
import Icon from '../icon'
-import { hasProp, getOptionProps, initDefaultProps } from '../_util/props-util'
+import { hasProp, getOptionProps, initDefaultProps, getComponentFromProp, isValidElement } from '../_util/props-util'
import BaseMixin from '../_util/BaseMixin'
import { WeekPickerProps } from './interface'
import interopDefault from '../_util/interopDefault'
+import { cloneElement } from '../_util/vnode'
function formatValue (value, format) {
return (value && value.format(format)) || ''
@@ -74,6 +75,7 @@ export default {
this.setState({ sValue: value })
}
this.$emit('change', value, formatValue(value, this.format))
+ this.focus()
},
clearSelection (e) {
e.preventDefault()
@@ -92,6 +94,8 @@ export default {
render () {
const props = getOptionProps(this)
+ let suffixIcon = getComponentFromProp(this, 'suffixIcon')
+ suffixIcon = Array.isArray(suffixIcon) ? suffixIcon[0] : suffixIcon
const {
prefixCls, disabled, pickerClass, popupStyle,
pickerInputClass, format, allowClear, locale, localeCode, disabledDate,
@@ -119,11 +123,24 @@ export default {
)
const clearIcon = (!disabled && allowClear && this.sValue) ? (
) : null
+
+ const inputIcon = suffixIcon && (
+ isValidElement(suffixIcon)
+ ? cloneElement(
+ suffixIcon,
+ {
+ class: `${prefixCls}-picker-icon`,
+ },
+ ) :
{suffixIcon}) || (
+
+ )
+
const input = ({ value }) => {
return (
@@ -138,7 +155,7 @@ export default {
onBlur={blur}
/>
{clearIcon}
-
+ {inputIcon}
)
}
diff --git a/components/date-picker/__tests__/DatePicker.test.js b/components/date-picker/__tests__/DatePicker.test.js
index 26b9c4b57..6eed25bf0 100644
--- a/components/date-picker/__tests__/DatePicker.test.js
+++ b/components/date-picker/__tests__/DatePicker.test.js
@@ -146,41 +146,38 @@ describe('DatePicker', () => {
}, { sync: false, attachToDocument: true })
await asyncExpect(() => {
openPanel(wrapper)
- })
+ }, 0)
await asyncExpect(() => {
nextYear()
+ }, 1000)
+ await asyncExpect(() => {
+ expect(handleChange).not.toBeCalled()
+ }, 0)
+ await asyncExpect(() => {
+ nextMonth()
}, 0)
await asyncExpect(() => {
expect(handleChange).not.toBeCalled()
})
- await asyncExpect(() => {
- nextMonth()
- })
- await asyncExpect(() => {
- expect(handleChange).not.toBeCalled()
- })
await asyncExpect(() => {
selectDateFromBody(moment('2017-12-22'))
- })
+ }, 1000)
await asyncExpect(() => {
expect(handleChange).toBeCalled()
- })
- await asyncExpect(() => {
-
- })
+ }, 0)
})
it('clear input', async () => {
const wrapper = mount(DatePicker, { sync: false, attachToDocument: true })
await asyncExpect(() => {
openPanel(wrapper)
- })
- await asyncExpect(() => {
- selectDateFromBody(moment('2016-11-23'))
}, 0)
+ await asyncExpect(() => {
+ selectDateFromBody(moment('2016-11-23'))
+ }, 100)
await asyncExpect(() => {
clearInput(wrapper)
- }, 300)
+ }, 1000)
await asyncExpect(() => {
openPanel(wrapper)
}, 0)
diff --git a/components/date-picker/__tests__/MonthPicker.test.js b/components/date-picker/__tests__/MonthPicker.test.js
index 2e115e9af..f0cf2e6c5 100644
--- a/components/date-picker/__tests__/MonthPicker.test.js
+++ b/components/date-picker/__tests__/MonthPicker.test.js
@@ -1,8 +1,26 @@
+import { mount } from '@vue/test-utils'
+import { asyncExpect } from '@/tests/utils'
+import moment from 'moment'
import DatePicker from '..'
import focusTest from '../../../tests/shared/focusTest'
+import { openPanel, $$ } from './utils'
const { MonthPicker } = DatePicker
describe('MonthPicker', () => {
focusTest(MonthPicker)
+ it('reset select item when popup close', async () => {
+ const wrapper = mount(MonthPicker, {
+ propsData: { value: moment('2018-07-01') },
+ sync: false,
+ attachToDocument: true,
+ })
+ await asyncExpect(() => {
+ openPanel(wrapper)
+ })
+ await asyncExpect(() => {
+ $$('.ant-calendar-month-panel-month')[0].click()
+ $$('.ant-calendar-month-panel-cell')[6].getAttribute('class').split(' ').includes('ant-calendar-month-panel-selected-cell')
+ }, 0)
+ })
})
diff --git a/components/date-picker/__tests__/RangePicker.test.js b/components/date-picker/__tests__/RangePicker.test.js
index 84abd5dde..6d0854b21 100644
--- a/components/date-picker/__tests__/RangePicker.test.js
+++ b/components/date-picker/__tests__/RangePicker.test.js
@@ -325,4 +325,26 @@ describe('RangePicker', () => {
}).not.toThrow()
})
})
+ // https://github.com/ant-design/ant-design/issues/11631
+ it('triggers onOpenChange when click on preset range', async () => {
+ const handleOpenChange = jest.fn()
+ const range = [moment().subtract(2, 'd'), moment()]
+ const wrapper = mount({
+ render () {
+ return
+ },
+ }, {
+ sync: false,
+ attachToDocument: true,
+ })
+ await asyncExpect(() => {
+ wrapper.find('.ant-calendar-picker-input').trigger('click')
+ })
+ await asyncExpect(() => {
+ $$('.ant-calendar-range-quick-selector .ant-tag')[0].click()
+ }, 0)
+ await asyncExpect(() => {
+ expect(handleOpenChange).toBeCalledWith(false)
+ })
+ })
})
diff --git a/components/date-picker/__tests__/__snapshots__/DatePicker.test.js.snap b/components/date-picker/__tests__/__snapshots__/DatePicker.test.js.snap
index 0fa634fcb..1a318dbe4 100644
--- a/components/date-picker/__tests__/__snapshots__/DatePicker.test.js.snap
+++ b/components/date-picker/__tests__/__snapshots__/DatePicker.test.js.snap
@@ -1,3 +1,3 @@
// Jest Snapshot v1, https://goo.gl/fbAQLP
-exports[`DatePicker prop locale should works 1`] = `
`;
+exports[`DatePicker prop locale should works 1`] = `
`;
diff --git a/components/date-picker/__tests__/__snapshots__/RangePicker.test.js.snap b/components/date-picker/__tests__/__snapshots__/RangePicker.test.js.snap
index bba446b62..fd891fc39 100644
--- a/components/date-picker/__tests__/__snapshots__/RangePicker.test.js.snap
+++ b/components/date-picker/__tests__/__snapshots__/RangePicker.test.js.snap
@@ -687,7 +687,11 @@ exports[`RangePicker switch to corresponding month panel when click presetted ra
-
+
U