Browse Source

update to 3.4.0

pull/165/head
tjz 7 years ago
parent
commit
116cc6a251
  1. 7
      components/cascader/demo/search.md
  2. 8
      components/date-picker/RangePicker.jsx
  3. 9
      components/date-picker/WeekPicker.jsx
  4. 6
      components/date-picker/createPicker.js
  5. 1
      components/date-picker/index.en-US.md
  6. 4
      components/date-picker/index.js
  7. 3
      components/date-picker/index.zh-CN.md
  8. 3
      components/date-picker/interface.js
  9. 43
      components/date-picker/locale/sl_SI.js
  10. 2
      components/divider/demo/index.vue
  11. 20
      components/divider/demo/orientation.md
  12. 3
      components/divider/index.en-US.md
  13. 9
      components/divider/index.jsx
  14. 2
      components/divider/index.zh-CN.md
  15. 68
      components/divider/style/index.less
  16. 4
      components/input/Input.jsx
  17. 63
      components/input/Search.jsx
  18. 2
      components/input/demo/group.md
  19. 24
      components/input/demo/search-input.md
  20. 3
      components/input/style/mixin.less
  21. 5
      components/locale-provider/index.jsx
  22. 44
      components/locale-provider/sl_SI.js
  23. 38
      components/locale-provider/tr_TR.js
  24. 4
      components/menu/index.jsx
  25. 5
      components/menu/style/index.less
  26. 2
      components/message/index.en-US.md
  27. 8
      components/message/index.js
  28. 2
      components/message/index.zh-CN.md
  29. 3
      components/modal/ConfirmDialog.jsx
  30. 1
      components/modal/Modal.jsx
  31. 5
      components/modal/style/confirm.less
  32. 1
      components/modal/style/modal.less
  33. 2
      components/pagination/style/index.less
  34. 7
      components/progress/progress.jsx
  35. 2
      components/rate/style/index.less
  36. 4
      components/select/index.en-US.md
  37. 2
      components/select/index.zh-CN.md
  38. 8
      components/select/style/index.less
  39. 4
      components/switch/style/index.less
  40. 23
      components/table/Table.jsx
  41. 2
      components/table/demo/fixed-columns.md
  42. 19
      components/table/index.en-US.md
  43. 18
      components/table/index.zh-CN.md
  44. 10
      components/table/interface.js
  45. 37
      components/table/style/index.less
  46. 1
      components/time-picker/index.en-US.md
  47. 4
      components/time-picker/index.jsx
  48. 1
      components/time-picker/index.zh-CN.md
  49. 5
      components/time-picker/locale/sl_SI.js
  50. 6
      components/timeline/Timeline.jsx
  51. 4
      components/timeline/demo/pending.md
  52. 1
      components/timeline/index.en-US.md
  53. 1
      components/timeline/index.zh-CN.md
  54. 2
      components/timeline/style/index.less
  55. 2
      components/tooltip/abstractTooltipProps.js
  56. 2
      components/tooltip/index.en-US.md
  57. 3
      components/tooltip/index.zh-CN.md
  58. 4
      site/components/demoBox.vue

7
components/cascader/demo/search.md

@ -13,7 +13,7 @@ Search and select options directly.
```html
<template>
<a-cascader :options="options" :showSearch="true" @change="onChange" placeholder="Please select" />
<a-cascader :options="options" :showSearch="{filter}" @change="onChange" placeholder="Please select" />
</template>
<script>
export default {
@ -51,7 +51,10 @@ export default {
methods: {
onChange(value, selectedOptions) {
console.log(value, selectedOptions);
}
},
filter(inputValue, path) {
return (path.some(option => (option.label).toLowerCase().indexOf(inputValue.toLowerCase()) > -1));
},
}
}
</script>

8
components/date-picker/RangePicker.jsx

@ -4,7 +4,7 @@ import RangeCalendar from '../vc-calendar/src/RangeCalendar'
import VcDatePicker from '../vc-calendar/src/Picker'
import classNames from 'classnames'
import Icon from '../icon'
import callMoment from '../_util/callMoment'
import interopDefault from '../_util/interopDefault'
import { RangePickerProps } from './interface'
import { hasProp, getOptionProps, initDefaultProps, mergeProps } from '../_util/props-util'
import BaseMixin from '../_util/BaseMixin'
@ -67,8 +67,8 @@ export default {
data () {
const value = this.value || this.defaultValue || []
if (
value[0] && !moment.isMoment(value[0]) ||
value[1] && !moment.isMoment(value[1])
value[0] && !interopDefault(moment).isMoment(value[0]) ||
value[1] && !interopDefault(moment).isMoment(value[1])
) {
throw new Error(
'The value/defaultValue of RangePicker must be a moment object array after `antd@2.0`, ' +
@ -78,7 +78,7 @@ export default {
const pickerValue = !value || isEmptyArray(value) ? this.defaultPickerValue : value
return {
sValue: value,
sShowDate: pickerValueAdapter(pickerValue || callMoment(moment)),
sShowDate: pickerValueAdapter(pickerValue || interopDefault(moment)()),
sOpen: this.open,
sHoverValue: [],
}

9
components/date-picker/WeekPicker.jsx

@ -5,7 +5,8 @@ import VcDatePicker from '../vc-calendar/src/Picker'
import Icon from '../icon'
import { hasProp, getOptionProps, initDefaultProps } from '../_util/props-util'
import BaseMixin from '../_util/BaseMixin'
import { WeexPickerProps } from './interface'
import { WeekPickerProps } from './interface'
import interopDefault from '../_util/interopDefault'
function formatValue (value, format) {
return (value && value.format(format)) || ''
@ -19,15 +20,15 @@ export default {
// };
// private input: any;
props: initDefaultProps(WeexPickerProps(), {
format: 'YYYY-wo',
props: initDefaultProps(WeekPickerProps(), {
format: 'gggg-wo',
allowClear: true,
}),
name: 'WeekPicker',
mixins: [BaseMixin],
data () {
const value = this.value || this.defaultValue
if (value && !moment.isMoment(value)) {
if (value && !interopDefault(moment).isMoment(value)) {
throw new Error(
'The value/defaultValue of DatePicker or MonthPicker must be ' +
'a moment object',

6
components/date-picker/createPicker.js

@ -4,7 +4,7 @@ import MonthCalendar from '../vc-calendar/src/MonthCalendar'
import VcDatePicker from '../vc-calendar/src/Picker'
import classNames from 'classnames'
import Icon from '../icon'
import callMoment from '../_util/callMoment'
import interopDefault from '../_util/interopDefault'
import BaseMixin from '../_util/BaseMixin'
import { hasProp, getOptionProps, initDefaultProps, mergeProps } from '../_util/props-util'
@ -30,7 +30,7 @@ export default function createPicker (TheCalendar, props) {
mixins: [BaseMixin],
data () {
const value = this.value || this.defaultValue
if (value && !moment.isMoment(value)) {
if (value && !interopDefault(moment).isMoment(value)) {
throw new Error(
'The value/defaultValue of DatePicker or MonthPicker must be ' +
'a moment object',
@ -127,7 +127,7 @@ export default function createPicker (TheCalendar, props) {
disabledTime,
locale: locale.lang,
timePicker: props.timePicker,
defaultValue: props.defaultPickerValue || callMoment(moment),
defaultValue: props.defaultPickerValue || interopDefault(moment)(),
dateInputPlaceholder: placeholder,
prefixCls,
dateRender,

1
components/date-picker/index.en-US.md

@ -36,6 +36,7 @@ The following APIs are shared by DatePicker, MonthPicker, RangePicker, WeekPicke
| open | open state of picker | boolean | - |
| placeholder | placeholder of date input | string\|RangePicker\[] | - |
| popupStyle | to customize the style of the popup calendar | object | {} |
| dropdownClassName | to customize the className of the popup calendar | string | - |
| size | determine the size of the input box, the height of `large` and `small`, are 40px and 24px respectively, while default size is 32px | string | - |
### Common Events

4
components/date-picker/index.js

@ -4,7 +4,7 @@ import createPicker from './createPicker'
import wrapPicker from './wrapPicker'
import RangePicker from './RangePicker'
import WeekPicker from './WeekPicker'
import { DatePickerProps, MonthPickerProps, WeexPickerProps, RangePickerProps } from './interface'
import { DatePickerProps, MonthPickerProps, WeekPickerProps, RangePickerProps } from './interface'
const DatePicker = wrapPicker(createPicker(VcCalendar, DatePickerProps()), DatePickerProps())
@ -13,7 +13,7 @@ const MonthPicker = wrapPicker(createPicker(MonthCalendar, MonthPickerProps()),
Object.assign(DatePicker, {
RangePicker: wrapPicker(RangePicker, RangePickerProps()),
MonthPicker,
WeekPicker: wrapPicker(WeekPicker, WeexPickerProps(), 'YYYY-wo'),
WeekPicker: wrapPicker(WeekPicker, WeekPickerProps(), 'gggg-wo'),
})
export default DatePicker

3
components/date-picker/index.zh-CN.md

@ -35,7 +35,8 @@
| locale | 国际化配置 | object | [默认配置](https://github.com/vueComponent/ant-design/blob/master/components/date-picker/locale/example.json) |
| open | 控制弹层是否展开 | boolean | - |
| placeholder | 输入框提示文字 | string\|RangePicker\[] | - |
| popupStyle | 格外的弹出日历样式 | object | {} |
| popupStyle | 额外的弹出日历样式 | object | {} |
| dropdownClassName | 额外的弹出日历 className | string | - |
| size | 输入框大小,`large` 高度为 40px,`small` 为 24px,默认是 32px | string | 无 |
### 共有的事件

3
components/date-picker/interface.js

@ -17,6 +17,7 @@ export const PickerProps = () => ({
disabled: PropTypes.bool,
allowClear: PropTypes.bool,
popupStyle: PropTypes.object,
dropdownClassName: PropTypes.string,
locale: PropTypes.any,
localeCode: PropTypes.string,
size: PropTypes.oneOf(['large', 'small', 'default']),
@ -81,7 +82,7 @@ export const RangePickerProps = () => ({
// onPanelChange?: (value?: RangePickerValue, mode?: string | string[]) => void;
})
export const WeexPickerProps = () => ({
export const WeekPickerProps = () => ({
...PickerProps(), ...SinglePickerProps(),
placeholder: PropTypes.string,
})

43
components/date-picker/locale/sl_SI.js

@ -0,0 +1,43 @@
import TimePickerLocale from '../../time-picker/locale/sl_SI'
// Merge into a locale object
const locale = {
lang: {
placeholder: 'Izberite datum',
rangePlaceholder: ['Začetni datum', 'Končni datum'],
today: 'Danes',
now: 'Trenutno',
backToToday: 'Nazaj na trenutni datum',
ok: 'Ok',
clear: 'Počisti',
month: 'Mesec',
year: 'Leto',
timeSelect: 'Izberi čas',
dateSelect: 'Izberi datum',
monthSelect: 'Izberite mesec',
yearSelect: 'Izberite leto',
decadeSelect: 'Izberite desetletje',
yearFormat: 'YYYY',
dateFormat: 'D.M.YYYY',
dayFormat: 'D',
dateTimeFormat: 'D.M.YYYY HH:mm:ss',
monthFormat: 'MMMM',
monthBeforeYear: true,
previousMonth: 'Prejšnji mesec (PageUp)',
nextMonth: 'Naslednji mesec (PageDown)',
previousYear: 'Lansko leto (Control + left)',
nextYear: 'Naslednje leto (Control + right)',
previousDecade: 'Prejšnje desetletje',
nextDecade: 'Naslednje desetletje',
previousCentury: 'Zadnje stoletje',
nextCentury: 'Naslednje stoletje',
},
timePickerLocale: {
...TimePickerLocale,
},
}
// All settings at:
// https://github.com/ant-design/ant-design/blob/master/components/date-picker/locale/example.json
export default locale

2
components/divider/demo/index.vue

@ -1,6 +1,7 @@
<script>
import Horizontal from './horizontal'
import Vertical from './vertical'
import Orientation from './orientation'
import CN from '../index.zh-CN.md'
import US from '../index.en-US.md'
const md = {
@ -30,6 +31,7 @@ export default {
<md cn={md.cn} us={md.us}/>
<Vertical />
<Horizontal />
<Orientation />
<api>
<CN slot='cn' />
<US/>

20
components/divider/demo/orientation.md

@ -0,0 +1,20 @@
<cn>
#### 标题位置
修改分割线标题的位置。
</cn>
<us>
#### Orientation of title
Set orientation of divider to left or right.
</us>
```html
<template>
<div>
<a-divider orientation="left">Left Text</a-divider>
<p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Sed nonne merninisti licere mihi ista probare, quae sunt a te dicta? Refert tamen, quo modo.</p>
<a-divider orientation="right">Right Text</a-divider>
<p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Sed nonne merninisti licere mihi ista probare, quae sunt a te dicta? Refert tamen, quo modo.</p>
</div>
</template>
```

3
components/divider/index.en-US.md

@ -4,5 +4,6 @@
| Property | Description | Type | Default |
| -------- | ----------- | ---- | ------- |
| dashed | whether line is dasded | Boolean | false |
| dashed | whether line is dashed | Boolean | false |
| type | direction type of divider | enum: `horizontal` `vertical` | `horizontal` |
| orientation | position of title inside divider | enum: `left` `right` `center` | `center` |

9
components/divider/index.jsx

@ -5,13 +5,16 @@ export default {
prefixCls: PropTypes.string.def('ant'),
type: PropTypes.oneOf(['horizontal', 'vertical']).def('horizontal'),
dashed: PropTypes.bool,
orientation: PropTypes.oneOf(['left', 'right']),
},
computed: {
classString () {
const { prefixCls, type, $slots, dashed } = this
const { prefixCls, type, $slots, dashed, orientation = '' } = this
const orientationPrefix = (orientation.length > 0) ? '-' + orientation : orientation
return {
[`${prefixCls}-divider`]: true, [`${prefixCls}-divider-${type}`]: true,
[`${prefixCls}-divider-with-text`]: $slots.default,
[`${prefixCls}-divider-with-text${orientationPrefix}`]: $slots.default,
[`${prefixCls}-divider-dashed`]: !!dashed,
}
},
@ -20,7 +23,7 @@ export default {
const { classString, prefixCls, $slots } = this
return (
<div class={classString}>
{$slots.default && <span className={`${prefixCls}-divider-inner-text`}>{$slots.default}</span>}
{$slots.default && <span class={`${prefixCls}-divider-inner-text`}>{$slots.default}</span>}
</div>
)
},

2
components/divider/index.zh-CN.md

@ -4,3 +4,5 @@
| --- | --- | --- | --- |
| dashed | 是否虚线 | Boolean | false |
| type | 水平还是垂直类型 | enum: `horizontal` `vertical` | `horizontal` |
| orientation | 分割线标题的位置 | enum: `left` `right` | `center` |

68
components/divider/style/index.less

@ -44,17 +44,81 @@
transform: translateY(50%);
}
}
&-inner-text {
display: inline-block;
padding: 0 24px;
}
&-horizontal&-with-text-left {
display: table;
white-space: nowrap;
text-align: center;
background: transparent;
font-weight: 500;
color: @heading-color;
font-size: @font-size-base;
margin: 16px 0;
&:before {
content: '';
display: table-cell;
position: relative;
top: 50%;
width: 5%;
border-top: 1px solid @border-color-split;
transform: translateY(50%);
}
&:after {
content: '';
display: table-cell;
position: relative;
top: 50%;
width: 95%;
border-top: 1px solid @border-color-split;
transform: translateY(50%);
}
&-inner-text {
display: inline-block;
padding: 0 10px;
}
}
&-horizontal&-with-text-right {
display: table;
white-space: nowrap;
text-align: center;
background: transparent;
font-weight: 500;
color: @heading-color;
font-size: @font-size-base;
margin: 16px 0;
&:before {
content: '';
display: table-cell;
position: relative;
top: 50%;
width: 95%;
border-top: 1px solid @border-color-split;
transform: translateY(50%);
}
&:after {
content: '';
display: table-cell;
position: relative;
top: 50%;
width: 5%;
border-top: 1px solid @border-color-split;
transform: translateY(50%);
}
&-inner-text {
display: inline-block;
padding: 0 10px;
}
}
&-dashed {
background: none;
border-top: 1px dashed @border-color-split;
}
&-horizontal&-with-text&-dashed {
border-top: 0;
&:before,

4
components/input/Input.jsx

@ -151,6 +151,10 @@ export default {
renderInput () {
const otherProps = omit(this.$props, [
'prefixCls',
'addonBefore',
'addonAfter',
'prefix',
'suffix',
])
const { stateValue, getInputClassName, handleKeyDown, handleChange, $listeners } = this
const inputProps = {

63
components/input/Search.jsx

@ -1,7 +1,12 @@
import classNames from 'classnames'
import Input from './Input'
import Icon from '../icon'
import inputProps from './inputProps'
import Button from '../button'
import { cloneElement } from '../_util/vnode'
import { getOptionProps, getComponentFromProp } from '../_util/props-util'
import PropsType from '../_util/vue-types'
export default {
name: 'InputSearch',
@ -15,6 +20,7 @@ export default {
default: 'ant-input',
type: String,
},
enterButton: PropsType.oneOfType([PropsType.bool, PropsType.string, PropsType.object]),
},
computed: {
},
@ -23,29 +29,76 @@ export default {
this.$emit('search', this.$refs.input.stateValue)
this.$refs.input.focus()
},
getButtonOrIcon () {
const { prefixCls, size } = this
const enterButton = getComponentFromProp(this, 'enterButton')
if (!enterButton) {
return <Icon class={`${prefixCls}-icon`} type='search' key='searchIcon' />
}
const enterButtonAsElement = Array.isArray(enterButton) ? enterButton[0] : enterButton
if (enterButtonAsElement.componentOptions && enterButtonAsElement.componentOptions.Ctor.extendOptions.__ANT_BUTTON) {
return cloneElement(enterButtonAsElement, {
class: `${prefixCls}-button`,
props: { size },
on: {
click: this.onSearch,
},
})
} else if (enterButtonAsElement.tag === 'button') {
return cloneElement(enterButtonAsElement[0], {
on: {
click: this.onSearch,
},
})
}
return (
<Button
class={`${prefixCls}-button`}
type='primary'
size={size}
onClick={this.onSearch}
key='enterButton'
>
{enterButton === true ? <Icon type='search' /> : enterButton}
</Button>
)
},
},
render () {
const { inputPrefixCls, prefixCls, ...others } = this.$props
const { prefixCls, inputPrefixCls, size,
suffix, ...others
} = getOptionProps(this)
const enterButton = getComponentFromProp(this, 'enterButton')
const buttonOrIcon = this.getButtonOrIcon()
const searchSuffix = suffix ? [suffix, buttonOrIcon] : buttonOrIcon
const inputClassName = classNames(prefixCls, {
[`${prefixCls}-enter-button`]: !!enterButton,
[`${prefixCls}-${size}`]: !!size,
})
const inputProps = {
props: {
...others,
prefixCls: inputPrefixCls,
size,
suffix: searchSuffix,
},
attrs: this.$attrs,
on: {
pressEnter: this.onSearch,
},
}
return (
<Input
{...inputProps}
onPressEnter={this.onSearch}
class={prefixCls}
class={inputClassName}
ref='input'
>
<Icon
{/* <Icon
slot='suffix'
class={`${prefixCls}-icon`}
onClick={this.onSearch}
type='search'
/>
/> */}
</Input>
)
},

2
components/input/demo/group.md

@ -14,7 +14,7 @@ Note: You don't need `Col` to control the width in the `compact` mode.
<template>
<div>
<a-input-group size="large">
<a-col :span="4">
<a-col :span="5">
<a-input defaultValue="0571" />
</a-col>
<a-col :span="8">

24
components/input/demo/search-input.md

@ -10,11 +10,25 @@ Example of creating a search box by grouping a standard input with a search butt
```html
<template>
<a-input-search
placeholder="input search text"
style="width: 200px"
@search="onSearch"
/>
<div>
<a-input-search
placeholder="input search text"
style="width: 200px"
@search="onSearch"
/>
<br /><br />
<a-input-search
placeholder="input search text"
@search="onSearch"
enterButton
/>
<br /><br />
<a-input-search placeholder="input search text" @search="onSearch" enterButton="Search" size="large" />
<br /><br />
<a-input-search placeholder="input search text" @search="onSearch" size="large">
<a-button slot="enterButton">Custom</a-button>
</a-input-search>
</div>
</template>
<script>

3
components/input/style/mixin.less

@ -327,6 +327,9 @@
z-index: 2;
line-height: 0;
color: @input-color;
:not(.anticon) {
line-height: @line-height-base;
}
}
.@{inputClass}-prefix {

5
components/locale-provider/index.jsx

@ -1,6 +1,7 @@
import PropTypes from '../_util/vue-types'
import * as moment from 'moment'
import interopDefault from '../_util/interopDefault'
import { changeConfirmLocale } from '../modal/locale'
// export interface Locale {
@ -19,9 +20,9 @@ import { changeConfirmLocale } from '../modal/locale'
function setMomentLocale (locale) {
if (locale && locale.locale) {
moment.locale(locale.locale)
interopDefault(moment).locale(locale.locale)
} else {
moment.locale('en')
interopDefault(moment).locale('en')
}
}

44
components/locale-provider/sl_SI.js

@ -0,0 +1,44 @@
import Pagination from '../vc-pagination/locale/sl_SI'
import DatePicker from '../date-picker/locale/sl_SI'
import TimePicker from '../time-picker/locale/sl_SI'
import Calendar from '../calendar/locale/sl_SI'
export default {
locale: 'sl',
Pagination,
DatePicker,
TimePicker,
Calendar,
Table: {
filterTitle: 'Filter',
filterConfirm: 'Filtriraj',
filterReset: 'Pobriši filter',
emptyText: 'Ni podatkov',
selectAll: 'Izberi vse na trenutni strani',
selectInvert: 'Obrni izbor na trenutni strani',
},
Modal: {
okText: 'V redu',
cancelText: 'Prekliči',
justOkText: 'V redu',
},
Popconfirm: {
okText: 'v redu',
cancelText: 'Prekliči',
},
Transfer: {
notFoundContent: 'Ni rezultatov iskanja',
searchPlaceholder: 'Išči tukaj',
itemUnit: 'Objekt',
itemsUnit: 'Objektov',
},
Select: {
notFoundContent: 'Ni bilo mogoče najti',
},
Upload: {
uploading: 'Nalaganje...',
removeFile: 'Odstrani datoteko',
uploadError: 'Napaka pri nalaganju',
previewFile: 'Predogled datoteke',
},
}

38
components/locale-provider/tr_TR.js

@ -1,44 +1,44 @@
import Pagination from '../vc-pagination/locale/en_US';
import DatePicker from '../date-picker/locale/tr_TR';
import TimePicker from '../time-picker/locale/tr_TR';
import Calendar from '../calendar/locale/tr_TR';
import Pagination from '../vc-pagination/locale/tr_TR'
import DatePicker from '../date-picker/locale/tr_TR'
import TimePicker from '../time-picker/locale/tr_TR'
import Calendar from '../calendar/locale/tr_TR'
export default {
locale : 'tr',
locale: 'tr',
Pagination,
DatePicker,
TimePicker,
Calendar,
Table : {
Table: {
filterTitle: 'Menü Filtrele',
filterConfirm: 'Tamam',
filterReset: 'Sıfırla',
emptyText: 'Veri Yok',
selectAll: 'Hepsini Seç',
selectInvert: 'Tersini Seç'
selectInvert: 'Tersini Seç',
},
Modal : {
Modal: {
okText: 'Tamam',
cancelText: 'İptal',
justOkText: 'Tamam'
justOkText: 'Tamam',
},
Popconfirm : {
Popconfirm: {
okText: 'Tamam',
cancelText: 'İptal'
cancelText: 'İptal',
},
Transfer : {
Transfer: {
notFoundContent: 'Bulunamadı',
searchPlaceholder: 'Arama',
itemUnit: 'Öğe',
itemsUnit: 'Öğeler'
itemsUnit: 'Öğeler',
},
Select : {
notFoundContent: 'Bulunamadı'
Select: {
notFoundContent: 'Bulunamadı',
},
Upload : {
Upload: {
uploading: 'Yükleniyor...',
removeFile: `Dosyayı kaldır`,
uploadError: 'Yükleme Hatası',
previewFile: `Dosyayı Önizle`
}
};
previewFile: `Dosyayı Önizle`,
},
}

4
components/menu/index.jsx

@ -1,6 +1,6 @@
import omit from 'omit.js'
import RcMenu, { Divider, ItemGroup, SubMenu } from '../vc-menu'
import VcMenu, { Divider, ItemGroup, SubMenu } from '../vc-menu'
import PropTypes from '../_util/vue-types'
import animation from '../_util/openAnimation'
import warning from '../_util/warning'
@ -247,7 +247,7 @@ export default {
return null
}
return <RcMenu {...menuProps} class={menuClassName}>{$slots.default}</RcMenu>
return <VcMenu {...menuProps} class={menuClassName}>{$slots.default}</VcMenu>
},
}

5
components/menu/style/index.less

@ -63,8 +63,6 @@
&:before {
position: absolute;
background-color: transparent;
width: 100%;
height: 100%;
top: 0;
left: 0;
bottom: 0;
@ -286,6 +284,9 @@
&:hover {
color: @menu-highlight-color;
}
&:before {
bottom: -2px;
}
}
}

2
components/message/index.en-US.md

@ -12,7 +12,7 @@ This components provides some static methods, with usage and arguments as follow
| Argument | Description | Type | Default |
| -------- | ----------- | ---- | ------- |
| content | content of the message | string\|vueNode \|function(h) | - |
| duration | time before auto-dismiss, in seconds | number | 1.5 |
| duration | time(seconds) before auto-dismiss, don't dismiss if set to 0 | number | 1.5 |
| onClose | Specify a function that will be called when the message is closed | Function | - |
Methods for global configuration and destruction are also provided:

8
components/message/index.js

@ -6,6 +6,7 @@ let defaultTop = null
let messageInstance = null
let key = 1
let prefixCls = 'ant-message'
let transitionName = 'move-up'
let getContainer = () => document.body
function getMessageInstance (callback) {
@ -15,7 +16,7 @@ function getMessageInstance (callback) {
}
Notification.newInstance({
prefixCls,
transitionName: 'move-up',
transitionName,
style: { top: defaultTop }, // 覆盖原来的样式
getContainer,
}, (instance) => {
@ -80,6 +81,7 @@ function notice (
// duration?: number;
// prefixCls?: string;
// getContainer?: () => HTMLElement;
// transitionName?: string;
// }
export default {
@ -116,6 +118,10 @@ export default {
if (options.getContainer !== undefined) {
getContainer = options.getContainer
}
if (options.transitionName !== undefined) {
transitionName = options.transitionName
messageInstance = null // delete messageInstance for new transitionName
}
},
destroy () {
if (messageInstance) {

2
components/message/index.zh-CN.md

@ -12,7 +12,7 @@
| 参数 | 说明 | 类型 | 默认值 |
| --- | --- | --- | --- |
| content | 提示内容 | string\|vueNode \|function(h) | - |
| duration | 自动关闭的延时,单位秒 | number | 3 |
| duration | 自动关闭的延时,单位秒。设为 0 时不自动关闭。 | number | 3 |
| onClose | 关闭时触发的回调函数 | Function | - |
还提供了全局配置和全局销毁方法:

3
components/modal/ConfirmDialog.jsx

@ -9,7 +9,7 @@ export default {
functional: true,
render (h, context) {
const { props } = context
const { onCancel, onOk, close, zIndex, afterClose, visible } = props
const { onCancel, onOk, close, zIndex, afterClose, visible, keyboard } = props
const iconType = props.iconType || 'question-circle'
const okType = props.okType || 'primary'
const prefixCls = props.prefixCls || 'ant-confirm'
@ -50,6 +50,7 @@ export default {
width={width}
zIndex={zIndex}
afterClose={afterClose}
keyboard={keyboard}
>
<div class={`${prefixCls}-body-wrapper`}>
<div class={`${prefixCls}-body`}>

1
components/modal/Modal.jsx

@ -49,6 +49,7 @@ const modalProps = (defaultProps = {}) => {
bodyStyle: PropTypes.object,
maskStyle: PropTypes.object,
mask: PropTypes.bool,
keyboard: PropTypes.bool,
}
return initDefaultProps(props, defaultProps)
}

5
components/modal/style/confirm.less

@ -25,6 +25,10 @@
font-weight: 500;
font-size: @font-size-lg;
line-height: 22px;
display: block;
// create BFC to avoid
// https://user-images.githubusercontent.com/507615/37702510-ba844e06-2d2d-11e8-9b67-8e19be57f445.png
overflow: auto;
}
.@{confirm-prefix-cls}-content {
@ -38,7 +42,6 @@
font-size: 22px;
margin-right: 16px;
float: left;
min-height: 48px;
}
}

1
components/modal/style/modal.less

@ -91,6 +91,7 @@
padding: 24px;
font-size: @font-size-base;
line-height: @line-height-base;
word-wrap: break-word;
}
&-footer {

2
components/pagination/style/index.less

@ -66,7 +66,7 @@
&-active {
border-color: @primary-color;
font-weight: 500;
font-weight: @pagination-font-weight-active;
a {
color: @primary-color;

7
components/progress/progress.jsx

@ -42,12 +42,13 @@ export default {
}),
render () {
const props = getOptionProps(this)
const {
prefixCls, percent = 0, status, format, trailColor, size, successPercent,
type, strokeWidth, width, showInfo, gapDegree = 0, gapPosition,
} = getOptionProps(this)
const progressStatus = parseInt(percent.toString(), 10) >= 100 && !(status)
? 'success' : (status || 'normal')
} = props
const progressStatus = parseInt((successPercent ? successPercent.toString() : percent.toString()), 10) >= 100 &&
!('status' in props) ? 'success' : (status || 'normal')
let progressInfo
let progress
const textFormatter = format || (percentNumber => `${percentNumber}%`)

2
components/rate/style/index.less

@ -15,7 +15,7 @@
outline: none;
&-disabled &-star {
cursor: not-allowed;
cursor: default;
&:hover {
transform: scale(1);
}

4
components/select/index.en-US.md

@ -25,10 +25,10 @@
| labelInValue | whether to embed label in value, turn the format of value from `string` to `{key: string, label: vNodes}` | boolean | false |
| maxTagCount | Max tag count to show | number | - |
| maxTagPlaceholder | Placeholder for not showing tags | slot/function(omittedValues) | - |
| mode | Set mode of Select | 'multiple' \| 'tags' \| 'combobox' | - |
| mode | Set mode of Select | 'default' \| 'multiple' \| 'tags' \| 'combobox' | 'default' |
| notFoundContent | Specify content to show when no result matches.. | string\|slot | 'Not Found' |
| optionFilterProp | Which prop value of option will be used for filter if filterOption is true | string | value |
| optionLabelProp | Which prop value of option will render as content of select. | string | `children` |
| optionLabelProp | Which prop value of option will render as content of select. | string | `value` for `combobox`, `children` for other modes |
| placeholder | Placeholder of select | string\|slot | - |
| showSearch | Whether show search input in single mode. | boolean | false |
| showArrow | Whether to show the drop-down arrow | boolean | true |

2
components/select/index.zh-CN.md

@ -24,7 +24,7 @@
| labelInValue | 是否把每个选项的 label 包装到 value 中,会把 Select 的 value 类型从 `string` 变为 `{key: string, label: vNodes}` 的格式 | boolean | false |
| maxTagCount | 最多显示多少个 tag | number | - |
| maxTagPlaceholder | 隐藏 tag 时显示的内容 | slot/function(omittedValues) | - |
| mode | 设置 Select 的模式 | 'multiple' \| 'tags' \| 'combobox' | - |
| mode | 设置 Select 的模式 | 'default' \| 'multiple' \| 'tags' \| 'combobox' | - |
| notFoundContent | 当下拉列表为空时显示的内容 | string\|slot | 'Not Found' |
| optionFilterProp | 搜索时过滤对应的 option 属性,如设置为 children 表示对内嵌内容进行搜索 | string | value |
| optionLabelProp | 回填到选择框的 Option 的属性值,默认是 Option 的子元素。比如在子元素需要高亮效果时,此值可以设为 `value`。 | string | `children` (combobox 模式下为 `value`) |

8
components/select/style/index.less

@ -489,6 +489,14 @@
background-color: @item-hover-bg;
}
&:first-child {
border-radius: @border-radius-base @border-radius-base 0 0;
}
&:last-child {
border-radius: 0 0 @border-radius-base @border-radius-base;
}
&-disabled {
color: @disabled-color;
cursor: not-allowed;

4
components/switch/style/index.less

@ -56,7 +56,7 @@
font-family: anticon;
animation: loadingCircle 1s infinite linear;
text-align: center;
background: transprent;
background: transparent;
z-index: 1;
display: none;
font-size: 12px;
@ -107,7 +107,7 @@
&:before,
&:after {
left: 100%;
margin-left: -12.5px;
margin-left: @switch-sm-checked-margin-left;
}
.@{switch-prefix-cls}-inner {

23
components/table/Table.jsx

@ -193,7 +193,7 @@ export default {
})
},
setSelectedRowKeys (selectedRowKeys, { selectWay, record, checked, changeRowKeys }) {
setSelectedRowKeys (selectedRowKeys, { selectWay, record, checked, changeRowKeys, nativeEvent }) {
const { rowSelection = {}} = this
if (rowSelection && !('selectedRowKeys' in rowSelection)) {
this.store.setState({ selectedRowKeys })
@ -209,7 +209,7 @@ export default {
rowSelection.onChange(selectedRowKeys, selectedRows)
}
if (selectWay === 'onSelect' && rowSelection.onSelect) {
rowSelection.onSelect(record, checked, selectedRows)
rowSelection.onSelect(record, checked, selectedRows, nativeEvent)
} else if (selectWay === 'onSelectAll' && rowSelection.onSelectAll) {
const changeRows = data.filter(
(row, i) => changeRowKeys.indexOf(this.getRecordKey(row, i)) >= 0,
@ -404,6 +404,7 @@ export default {
handleSelect (record, rowIndex, e) {
const checked = e.target.checked
const nativeEvent = e.nativeEvent
const defaultSelection = this.store.getState().selectionDirty ? [] : this.getDefaultSelection()
let selectedRowKeys = this.store.getState().selectedRowKeys.concat(defaultSelection)
const key = this.getRecordKey(record, rowIndex)
@ -419,11 +420,14 @@ export default {
selectWay: 'onSelect',
record,
checked,
changeRowKeys: void (0),
nativeEvent,
})
},
handleRadioSelect (record, rowIndex, e) {
const checked = e.target.checked
const nativeEvent = e.nativeEvent
const defaultSelection = this.store.getState().selectionDirty ? [] : this.getDefaultSelection()
let selectedRowKeys = this.store.getState().selectedRowKeys.concat(defaultSelection)
const key = this.getRecordKey(record, rowIndex)
@ -435,6 +439,8 @@ export default {
selectWay: 'onSelect',
record,
checked,
changeRowKeys: void (0),
nativeEvent,
})
},
@ -601,6 +607,7 @@ export default {
customRender: this.renderSelectionBox(rowSelection.type),
className: selectionColumnClass,
fixed: rowSelection.fixed,
width: rowSelection.columnWidth,
}
if (rowSelection.type !== 'radio') {
const checkboxAllDisabled = data.every((item, index) => this.getCheckboxPropsByItem(item, index).disabled)
@ -705,7 +712,7 @@ export default {
)
}
column.title = (
<span>
<span key={key}>
{column.title}
{sortButton}
{filterDropdown}
@ -735,7 +742,7 @@ export default {
}))
},
renderPagination () {
renderPagination (paginationPosition) {
//
if (!this.hasPagination()) {
return null
@ -747,10 +754,11 @@ export default {
} else if (this.size === 'middle' || this.size === 'small') {
size = 'small'
}
const position = pagination.position || 'bottom'
const total = pagination.total || this.getLocalData().length
const { class: cls, style, onChange, onShowSizeChange, ...restProps } = pagination // eslint-disable-line
const paginationProps = mergeProps({
key: 'pagination',
key: `pagination-${paginationPosition}`,
class: classNames(cls, `${this.prefixCls}-pagination`),
props: {
...restProps,
@ -764,7 +772,7 @@ export default {
showSizeChange: this.handleShowSizeChange,
},
})
return (total > 0) ? (
return (total > 0 && (position === paginationPosition || position === 'both')) ? (
<Pagination
{...paginationProps}
/>
@ -966,8 +974,9 @@ export default {
<Spin
{...spinProps}
>
{this.renderPagination('top')}
{table}
{this.renderPagination()}
{this.renderPagination('bottom')}
</Spin>
</div>
)

2
components/table/demo/fixed-columns.md

@ -7,7 +7,7 @@
<us>
#### Fixed Columns
To fix some columns and scroll inside other columns, and you must set `scoll.x` meanwhile.
To fix some columns and scroll inside other columns, and you must set `scroll.x` meanwhile.
> Specify the width of columns if header and cell do not align properly.
> A fixed value which is greater than table width for `scroll.x` is recommended. The sum of unfixed columns should not greater than `scroll.x`.
</us>

19
components/table/index.en-US.md

@ -48,11 +48,11 @@ const columns = [{
| indentSize | Indent size in pixels of tree data | number | 15 |
| loading | Loading status of table | boolean\|[object](https://vuecomponent.github.io/ant-design/#/us/components/spin) | `false` |
| locale | i18n text including filter, sort, empty text, etc | object | filterConfirm: 'Ok' <br> filterReset: 'Reset' <br> emptyText: 'No Data' |
| pagination | Pagination [config](https://vuecomponent.github.io/ant-design/#/us/components/pagination), hide it by setting it to `false` | object | |
| pagination | Pagination [config](#pagination) or [`Pagination`] (/components/pagination/), hide it by setting it to `false` | object | |
| rowClassName | Row's className | Function(record, index):string | - |
| rowKey | Row's unique key, could be a string or function that returns a string | string\|Function(record):string | `key` |
| rowSelection | Row selection [config](#rowSelection) | object | null |
| scroll | Whether table can be scrolled in x/y direction, `x` or `y` can be a number that indicates the width and height of table body | object | - |
| scroll | Set horizontal or vertical scrolling, can also be used to specify the width and height of the scroll area. It is recommended to set a number for `x`, if you want to set it to `true`, you need to add style `.ant-table td { white-space: nowrap; }`. | { x: number \| true, y: number } | - |
| showHeader | Whether to show table header | boolean | `true` |
| size | Size of table | `default` \| `middle` \| `small` | `default` |
| title | Table title renderer | Function(currentPageData)\|slot-scope | |
@ -115,6 +115,7 @@ One of the Table `columns` prop for describing the table's columns, Column has t
| fixed | Set column to be fixed: `true`(same as left) `'left'` `'right'` | boolean\|string | `false` |
| key | Unique key of this column, you can ignore this prop if you've set a unique `dataIndex` | string | - |
| customRender | Renderer of the table cell. The return value should be a VNode, or an object for colSpan/rowSpan config | Function(text, record, index) {}\|slot-scope | - |
| align | specify how content is aligned | 'left' \| 'right' \| 'center' | 'left' |
| sorter | Sort function for local sort, see [Array.sort](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Array/sort)'s compareFunction. If you need sort buttons only, set to `true` | Function\|boolean | - |
| sortOrder | Order of sorted values: `'ascend'` `'descend'` `false` | boolean\|string | - |
| title | Title of this column | string\|slot | - |
@ -134,6 +135,17 @@ One of the Table `columns` prop for describing the table's columns, Column has t
| title | Title of the column group | string\|slot | - |
| slots | When using columns, you can use this property to configure the properties that support the slot, such as `slots: { title: 'XXX'}` | object | - |
### pagination
Properties for pagination.
| Property | Description | Type | Default |
| -------- | ----------- | ---- | ------- |
| position | specify the position of `Pagination` | 'top' \| 'bottom' \| 'both' | 'bottom' |
More about pagination, please check [`Pagination`](/components/pagination/).
### rowSelection
Properties for row selection.
@ -144,10 +156,11 @@ Properties for row selection.
| getCheckboxProps | Get Checkbox or Radio props | Function(record) | - |
| hideDefaultSelections | Remove the default `Select All` and `Select Invert` selections | boolean | `false` |
| selectedRowKeys | Controlled selected row keys | string\[] | \[] |
| columnWidth | Set the width of the selection column | string\|number | - |
| selections | Custom selection [config](#rowSelection), only displays default selections when set to `true` | object\[]\|boolean | - |
| type | `checkbox` or `radio` | `checkbox` \| `radio` | `checkbox` |
| onChange | Callback executed when selected rows change | Function(selectedRowKeys, selectedRows) | - |
| onSelect | Callback executed when select/deselect one row | Function(record, selected, selectedRows) | - |
| onSelect | Callback executed when select/deselect one row | Function(record, selected, selectedRows, nativeEvent) | - |
| onSelectAll | Callback executed when select/deselect all rows | Function(selected, selectedRows, changeRows) | - |
| onSelectInvert | Callback executed when row selection is inverted | Function(selectedRows) | - |

18
components/table/index.zh-CN.md

@ -49,11 +49,11 @@ const columns = [{
| indentSize | 展示树形数据时,每层缩进的宽度,以 px 为单位 | number | 15 |
| loading | 页面是否加载中 | boolean\|[object](https://vuecomponent.github.io/ant-design/#/cn/components/spin) | false |
| locale | 默认文案设置,目前包括排序、过滤、空数据文案 | object | filterConfirm: '确定' <br> filterReset: '重置' <br> emptyText: '暂无数据' |
| pagination | 分页器,配置项参考 [pagination](https://vuecomponent.github.io/ant-design/#/cn/components/pagination),设为 false 时不展示和进行分页 | object | |
| pagination | 分页器,参考[配置项](#pagination)或 [pagination](/components/pagination/),设为 false 时不展示和进行分页 | object | |
| rowClassName | 表格行的类名 | Function(record, index):string | - |
| rowKey | 表格行 key 的取值,可以是字符串或一个函数 | string\|Function(record):string | 'key' |
| rowSelection | 列表项是否可选择,[配置项](#rowSelection) | object | null |
| scroll | 横向或纵向支持滚动,也可用于指定滚动区域的宽高度:`{{ x: true, y: 300 }}` | object | - |
| scroll | 设置横向或纵向滚动,也可用于指定滚动区域的宽和高,建议为 `x` 设置一个数字,如果要设置为 `true`,需要配合样式 `.ant-table td { white-space: nowrap; }` | { x: number \| true, y: number } | - |
| showHeader | 是否显示表头 | boolean | true |
| size | 正常或迷你类型,`default` or `small` | string | default |
| title | 表格标题 | Function(currentPageData)\|slot-scope | |
@ -116,6 +116,7 @@ const columns = [{
| fixed | 列是否固定,可选 `true`(等效于 left) `'left'` `'right'` | boolean\|string | false |
| key | Vue 需要的 key,如果已经设置了唯一的 `dataIndex`,可以忽略这个属性 | string | - |
| customRender | 生成复杂数据的渲染函数,参数分别为当前行的值,当前行数据,行索引,@return里面可以设置表格行/列合并,可参考demo 表格行/列合并 | Function(text, record, index) {}\|slot-scope | - |
| align | 设置列内容的对齐方式 | 'left' \| 'right' \| 'center' | 'left' |
| sorter | 排序函数,本地排序使用一个函数(参考 [Array.sort](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Array/sort) 的 compareFunction),需要服务端排序可设为 true | Function\|boolean | - |
| sortOrder | 排序的受控属性,外界可用此控制列的排序,可设置为 `'ascend'` `'descend'` `false` | boolean\|string | - |
| title | 列头显示文字 | string\|slot | - |
@ -134,6 +135,16 @@ const columns = [{
| title | 列头显示文字 | string\|slot | - |
| slots | 使用columns时,可以通过该属性配置支持slot的属性,如 `slots: { title: 'XXX'}` | object | - |
### pagination
分页的配置项。
| 参数 | 说明 | 类型 | 默认值 |
| --- | --- | --- | --- |
| position | 指定分页显示的位置 | 'top' \| 'bottom' \| 'both' | 'bottom' |
更多配置项,请查看 [`Pagination`](/components/pagination/)。
### rowSelection
选择功能的配置。
@ -144,10 +155,11 @@ const columns = [{
| getCheckboxProps | 选择框的默认属性配置 | Function(record) | - |
| hideDefaultSelections | 去掉『全选』『反选』两个默认选项 | boolean | false |
| selectedRowKeys | 指定选中项的 key 数组,需要和 onChange 进行配合 | string\[] | \[] |
| columnWidth | 自定义列表选择框宽度 | string\|number | - |
| selections | 自定义选择项, 设为 `true` 时使用默认选择项 | object\[]\|boolean | true |
| type | 多选/单选,`checkbox` or `radio` | string | `checkbox` |
| onChange | 选中项发生变化的时的回调 | Function(selectedRowKeys, selectedRows) | - |
| onSelect | 用户手动选择/取消选择某列的回调 | Function(record, selected, selectedRows) | - |
| onSelect | 用户手动选择/取消选择某列的回调 | Function(record, selected, selectedRows, nativeEvent) | - |
| onSelectAll | 用户手动选择/取消选择所有列的回调 | Function(selected, selectedRows, changeRows) | - |
| onSelectInvert | 用户手动选择反选的回调 | Function(selectedRows) | - |

10
components/table/interface.js

@ -20,6 +20,7 @@ export const ColumnProps = {
customRender: PropTypes.func,
customCell: PropTypes.func,
customHeaderCell: PropTypes.func,
align: PropTypes.oneOf(['left', 'right', 'center']),
filters: PropTypes.arrayOf(ColumnFilterItem),
// onFilter: (value: any, record: T) => PropTypes.bool,
filterMultiple: PropTypes.bool,
@ -78,13 +79,20 @@ export const TableRowSelection = {
selections: PropTypes.oneOfType([PropTypes.array, PropTypes.bool]),
hideDefaultSelections: PropTypes.bool,
fixed: PropTypes.bool,
columnWidth: PropTypes.oneOfType([PropTypes.string, PropTypes.number]),
}
export const TableProps = {
prefixCls: PropTypes.string,
dropdownPrefixCls: PropTypes.string,
rowSelection: PropTypes.oneOfType([PropTypes.shape(TableRowSelection).loose, null]),
pagination: PropTypes.oneOfType([PropTypes.shape(PaginationProps).loose, PropTypes.bool]),
pagination: PropTypes.oneOfType([
PropTypes.shape({
...PaginationProps,
position: PropTypes.oneOf(['top', 'bottom', 'both']),
}).loose,
PropTypes.bool,
]),
size: PropTypes.oneOf(['default', 'middle', 'small', 'large']),
dataSource: PropTypes.array,
components: PropTypes.object,

37
components/table/style/index.less

@ -11,7 +11,7 @@
.@{table-prefix-cls} {
.reset-component;
position: relative;
border-radius: @border-radius-base @border-radius-base 0 0;
clear: both;
&-body {
transition: opacity .3s;
@ -69,6 +69,16 @@
}
}
&-thead > tr:first-child > th {
&:first-child {
border-top-left-radius: @border-radius-base;
}
&:last-child {
border-top-right-radius: @border-radius-base;
}
}
&-tbody > tr > td {
border-bottom: @border-width-base @border-style-base @border-color-split;
transition: all .3s;
@ -129,7 +139,8 @@
overflow: hidden;
.@{table-prefix-cls}-bordered & {
&,
table {
table,
.@{table-prefix-cls}-thead > tr:first-child > th {
border-radius: 0;
}
}
@ -247,11 +258,11 @@
}
&-up:after {
bottom: -2px;
bottom: 0;
}
&-down:after {
top: 2px;
top: 0;
}
.@{iconfont-css-prefix}-caret-up,
@ -260,6 +271,15 @@
line-height: 4px;
height: 4px;
transition: all .3s;
position: relative;
}
&-down {
margin-top: 1.5px;
}
.@{iconfont-css-prefix}-caret-down {
top: -1.5px;
}
}
@ -467,7 +487,7 @@
tr&-expanded-row {
&,
&:hover {
background: #fbfbfb;
background: @table-expanded-row-bg;
}
}
@ -479,7 +499,6 @@
overflow: auto;
overflow-x: hidden;
table {
width: auto;
min-width: 100%;
}
}
@ -539,6 +558,9 @@
table {
border-radius: @border-radius-base 0 0 0;
}
.ant-table-thead > tr > th:last-child {
border-top-right-radius: 0;
}
}
&-fixed-right {
@ -554,6 +576,9 @@
color: transparent;
pointer-events: none;
}
.ant-table-thead > tr > th:first-child {
border-top-left-radius: 0;
}
}
&&-scroll-position-left &-fixed-left {

1
components/time-picker/index.en-US.md

@ -16,6 +16,7 @@
| getPopupContainer | to set the container of the floating layer, while the default is to create a div element in body | function(trigger) | - |
| hideDisabledOptions | hide the options that can not be selected | boolean | false |
| hourStep | interval between hours in picker | number | 1 |
| inputReadOnly | Set the `readonly` attribute of the input tag (avoids virtual keyboard on touch devices) | boolean | false |
| minuteStep | interval between minutes in picker | number | 1 |
| open(.sync) | whether to popup panel | boolean | false |
| placeholder | display when there's no value | string | "Select a time" |

4
components/time-picker/index.jsx

@ -5,6 +5,7 @@ import LocaleReceiver from '../locale-provider/LocaleReceiver'
import defaultLocale from './locale/en_US'
import BaseMixin from '../_util/BaseMixin'
import PropTypes from '../_util/vue-types'
import interopDefault from '../_util/interopDefault'
import { initDefaultProps, hasProp, getOptionProps, getComponentFromProp } from '../_util/props-util'
export function generateShowHourMinuteSecond (format) {
@ -47,6 +48,7 @@ export const TimePickerProps = () => ({
minuteStep: PropTypes.number,
secondStep: PropTypes.number,
allowEmpty: PropTypes.bool,
inputReadOnly: PropTypes.bool,
clearText: PropTypes.string,
defaultOpenValue: PropTypes.object,
popupClassName: PropTypes.string,
@ -77,7 +79,7 @@ export default {
},
data () {
const value = this.value || this.defaultValue
if (value && !moment.isMoment(value)) {
if (value && !interopDefault(moment).isMoment(value)) {
throw new Error(
'The value/defaultValue of TimePicker must be a moment object, ',
)

1
components/time-picker/index.zh-CN.md

@ -17,6 +17,7 @@
| getPopupContainer | 定义浮层的容器,默认为 body 上新建 div | function(trigger) | 无 |
| hideDisabledOptions | 隐藏禁止选择的选项 | boolean | false |
| hourStep | 小时选项间隔 | number | 1 |
| inputReadOnly | 设置输入框为只读(避免在移动设备上打开虚拟键盘)| boolean | false |
| minuteStep | 分钟选项间隔 | number | 1 |
| open(.sync) | 面板是否打开 | boolean | false |
| placeholder | 没有值的时候显示的内容 | string | "请选择时间" |

5
components/time-picker/locale/sl_SI.js

@ -0,0 +1,5 @@
const locale = {
placeholder: 'Izberite čas',
}
export default locale

6
components/timeline/Timeline.jsx

@ -7,9 +7,9 @@ import Icon from '../icon'
export const TimelineProps = {
prefixCls: PropTypes.string,
className: PropTypes.string,
/** 指定最后一个幽灵节点是否存在或内容 */
pending: PropTypes.any,
pendingDot: PropTypes.string,
}
export default {
@ -19,6 +19,7 @@ export default {
}),
render () {
const { prefixCls, ...restProps } = getOptionProps(this)
const pendingDot = getComponentFromProp(this, 'pendingDot')
const pending = getComponentFromProp(this, 'pending')
const pendingNode = typeof pending === 'boolean' ? null : pending
const classString = classNames(prefixCls, {
@ -37,6 +38,9 @@ export default {
<TimelineItem
pending={!!pending}
>
<template slot='dot'>
{pendingDot || <Icon type='loading' />}
</template>
<Icon slot='dot' type='loading' />
{pendingNode}
</TimelineItem>

4
components/timeline/demo/pending.md

@ -1,11 +1,11 @@
<cn>
#### 最后一个
当任务状态正在发生,还在记录过程中,可用幽灵节点来表示当前的时间节点(用于时间正序排列)
当任务状态正在发生,还在记录过程中,可用幽灵节点来表示当前的时间节点(用于时间正序排列)。当 pending 值为 false ,可用定制元件替换默认时间图点。
</cn>
<us>
#### Last node
When the timeline is incomplete and ongoing, put a ghost node at last. set `pending={true}` or `pending={a React Element}`. Used in ascend chronological order.
When the timeline is incomplete and ongoing, put a ghost node at last. set `pending={true}` or `pending={a VNode Element}` or `slot="pending"`. Used in ascend chronological order. When `pending` is not false, set `pendingDot={a VNode Element}` or `slot="pendingDot"` to replace the default pending dot.
</us>
```html

1
components/timeline/index.en-US.md

@ -16,6 +16,7 @@ Timeline
| Property | Description | Type | Default |
| -------- | ----------- | ---- | ------- |
| pending | Set the last ghost node's existence or its content | boolean\|string\|slot | `false` |
| pendingDot | Set the dot of the last ghost node when pending is true | \|string\|slot | `<Icon type="loading" />` |
### Timeline.Item

1
components/timeline/index.zh-CN.md

@ -16,6 +16,7 @@
| 参数 | 说明 | 类型 | 默认值 |
| --- | --- | --- | --- |
| pending | 指定最后一个幽灵节点是否存在或内容 | boolean\|string\|slot | false |
| pendingDot | 当最后一个幽灵节点存在時,指定其时间图点 | \|string\|slot | `<Icon type="loading" />` |
### Timeline.Item

2
components/timeline/style/index.less

@ -63,7 +63,7 @@
border: 0;
height: auto;
border-radius: 0;
padding: 3px 0;
padding: 3px 1px;
transform: translate(-50%, -50%);
top: 5px;
left: 5px;

2
components/tooltip/abstractTooltipProps.js

@ -1,5 +1,5 @@
import PropTypes from '../_util/vue-types'
const triggerType = PropTypes.oneOf(['hover', 'focus', 'click'])
const triggerType = PropTypes.oneOf(['hover', 'focus', 'click', 'contextmenu'])
export default () => ({
trigger: PropTypes.oneOfType([triggerType, PropTypes.arrayOf(triggerType)]).def('hover'),
visible: PropTypes.bool,

2
components/tooltip/index.en-US.md

@ -19,7 +19,7 @@ The following APIs are shared by Tooltip, Popconfirm, Popover.
| overlayClassName | Class name of the tooltip card | string | - |
| overlayStyle | Style of the tooltip card | object | - |
| placement | The position of the tooltip relative to the target, which can be one of `top` `left` `right` `bottom` `topLeft` `topRight` `bottomLeft` `bottomRight` `leftTop` `leftBottom` `rightTop` `rightBottom` | string | `top` |
| trigger | Tooltip trigger mode | `hover` \| `focus` \| `click` | `hover` |
| trigger | Tooltip trigger mode | `hover` \| `focus` \| `click` \| `contextmenu` | `hover` |
| visible | Whether the floating tooltip card is visible or not | boolean | `false` |
### events

3
components/tooltip/index.zh-CN.md

@ -19,9 +19,8 @@
| overlayClassName | 卡片类名 | string | 无 |
| overlayStyle | 卡片样式 | object | 无 |
| placement | 气泡框位置,可选 `top` `left` `right` `bottom` `topLeft` `topRight` `bottomLeft` `bottomRight` `leftTop` `leftBottom` `rightTop` `rightBottom` | string | top |
| trigger | 触发行为,可选 `hover/focus/click` | string | hover |
| trigger | 触发行为,可选 `hover/focus/click/contextmenu` | string | hover |
| visible | 用于手动控制浮层显隐 | boolean | false |
| onVisibleChange | 显示隐藏的回调 | (visible) => void | 无 |
### 事件
| 事件名称 | 说明 | 回调参数 |

4
site/components/demoBox.vue

@ -53,9 +53,11 @@ export default {
`not have usTitle`,
)
}
const id = ['components', name.replace('-cn', ''), 'demo', ...usTitle.split(' ')].join('-').toLowerCase()
let id = ['components', name.replace('-cn', ''), 'demo', ...usTitle.split(' ')].join('-').toLowerCase()
if (this._store.store) {
const { currentSubMenu } = this._store.store.getState()
id = `${id}-${currentSubMenu.length + 1}`
this._store.store.setState({ currentSubMenu: [...currentSubMenu, { cnTitle, usTitle, id }] })
}
return {

Loading…
Cancel
Save