pull/9/head
tangjinzhou 2018-03-19 10:47:23 +08:00
parent 0d3ff16090
commit 7c8450a2a4
51 changed files with 192 additions and 232 deletions

15
.vscode/settings.json vendored
View File

@ -4,16 +4,27 @@
"eslint.options": {
"extensions": [
".js",
".jsx",
".vue"
],
"configFile": ".eslintrc"
},
"eslint.validate": [
"javascript",
"javascriptreact",
{
"language": "html",
"autoFix": true
},
{
"language": "vue",
"autoFix": true
},
{
"language": "javascript",
"autoFix": true
},
{
"language": "javascriptreact",
"autoFix": true
}
],
"emmet.syntaxProfiles": {

View File

@ -85,4 +85,3 @@ export default {
},
}

View File

@ -242,4 +242,3 @@ export default {
},
}

View File

@ -130,4 +130,3 @@ export default {
},
}

View File

@ -125,4 +125,3 @@ export default {
},
}

View File

@ -52,4 +52,3 @@ export default {
},
}

View File

@ -134,4 +134,3 @@ export default {
},
}

View File

@ -131,4 +131,3 @@ export default {
},
}

View File

@ -111,4 +111,3 @@ export default {
},
}

View File

@ -135,4 +135,3 @@ export default {
},
}

View File

@ -87,4 +87,3 @@ export default {
},
}

View File

@ -1,33 +1,33 @@
import PropTypes from '../_util/vue-types'
import { hasProp, getComponentFromProp } from '../_util/props-util'
import PropTypes from '../_util/vue-types'
import { hasProp, getComponentFromProp } from '../_util/props-util'
export default {
name: 'BreadcrumbItem',
__ANT_BREADCRUMB_ITEM: true,
props: {
prefixCls: PropTypes.string.def('ant-breadcrumb'),
href: PropTypes.string,
separator: PropTypes.any,
},
render () {
const { prefixCls, $slots } = this
const children = $slots.default
let link
if (hasProp(this, 'href')) {
link = <a class={`${prefixCls}-link`}>{children}</a>
} else {
link = <span class={`${prefixCls}-link`}>{children}</span>
}
if (children) {
return (
<span>
{link}
<span class={`${prefixCls}-separator`}>{getComponentFromProp(this, 'separator') || '/'}</span>
</span>
)
}
return null
},
}
export default {
name: 'BreadcrumbItem',
__ANT_BREADCRUMB_ITEM: true,
props: {
prefixCls: PropTypes.string.def('ant-breadcrumb'),
href: PropTypes.string,
separator: PropTypes.any,
},
render () {
const { prefixCls, $slots } = this
const children = $slots.default
let link
if (hasProp(this, 'href')) {
link = <a class={`${prefixCls}-link`}>{children}</a>
} else {
link = <span class={`${prefixCls}-link`}>{children}</span>
}
if (children) {
return (
<span>
{link}
<span class={`${prefixCls}-separator`}>{getComponentFromProp(this, 'separator') || '/'}</span>
</span>
)
}
return null
},
}

View File

@ -1,164 +1,164 @@
import Tabs from '../tabs'
import PropTypes from '../_util/vue-types'
import addEventListener from '../_util/Dom/addEventListener'
import { getComponentFromProp, getComponentName } from '../_util/props-util'
import throttleByAnimationFrame from '../_util/throttleByAnimationFrame'
import BaseMixin from '../_util/BaseMixin'
import Tabs from '../tabs'
import PropTypes from '../_util/vue-types'
import addEventListener from '../_util/Dom/addEventListener'
import { getComponentFromProp, getComponentName } from '../_util/props-util'
import throttleByAnimationFrame from '../_util/throttleByAnimationFrame'
import BaseMixin from '../_util/BaseMixin'
const { TabPane } = Tabs
export default {
name: 'Card',
mixins: [BaseMixin],
props: {
prefixCls: PropTypes.string.def('ant-card'),
title: PropTypes.string,
extra: PropTypes.any,
bordered: PropTypes.bool.def(true),
bodyStyle: PropTypes.object,
loading: PropTypes.bool.def(false),
hoverable: PropTypes.bool.def(false),
type: PropTypes.string,
actions: PropTypes.any,
tabList: PropTypes.array,
},
data () {
this.updateWiderPaddingCalled = false
return {
widerPadding: false,
const { TabPane } = Tabs
export default {
name: 'Card',
mixins: [BaseMixin],
props: {
prefixCls: PropTypes.string.def('ant-card'),
title: PropTypes.string,
extra: PropTypes.any,
bordered: PropTypes.bool.def(true),
bodyStyle: PropTypes.object,
loading: PropTypes.bool.def(false),
hoverable: PropTypes.bool.def(false),
type: PropTypes.string,
actions: PropTypes.any,
tabList: PropTypes.array,
},
data () {
this.updateWiderPaddingCalled = false
return {
widerPadding: false,
}
},
beforeMount () {
this.updateWiderPadding = throttleByAnimationFrame(this.updateWiderPadding)
},
mounted () {
this.updateWiderPadding()
this.resizeEvent = addEventListener(window, 'resize', this.updateWiderPadding)
},
beforeDestroy () {
if (this.resizeEvent) {
this.resizeEvent.remove()
}
this.updateWiderPadding.cancel && this.updateWiderPadding.cancel()
},
methods: {
updateWiderPadding () {
const cardContainerRef = this.$refs.cardContainerRef
if (!cardContainerRef) {
return
}
// 936 is a magic card width pixer number indicated by designer
const WIDTH_BOUDARY_PX = 936
if (cardContainerRef.offsetWidth >= WIDTH_BOUDARY_PX && !this.widerPadding) {
this.setState({ widerPadding: true }, () => {
this.updateWiderPaddingCalled = true // first render without css transition
})
}
if (cardContainerRef.offsetWidth < WIDTH_BOUDARY_PX && this.widerPadding) {
this.setState({ widerPadding: false }, () => {
this.updateWiderPaddingCalled = true // first render without css transition
})
}
},
beforeMount () {
this.updateWiderPadding = throttleByAnimationFrame(this.updateWiderPadding)
onHandleTabChange (key) {
this.$emit('tabChange', key)
},
mounted () {
this.updateWiderPadding()
this.resizeEvent = addEventListener(window, 'resize', this.updateWiderPadding)
},
beforeDestroy () {
if (this.resizeEvent) {
this.resizeEvent.remove()
}
this.updateWiderPadding.cancel && this.updateWiderPadding.cancel()
},
methods: {
updateWiderPadding () {
const cardContainerRef = this.$refs.cardContainerRef
if (!cardContainerRef) {
return
}
// 936 is a magic card width pixer number indicated by designer
const WIDTH_BOUDARY_PX = 936
if (cardContainerRef.offsetWidth >= WIDTH_BOUDARY_PX && !this.widerPadding) {
this.setState({ widerPadding: true }, () => {
this.updateWiderPaddingCalled = true // first render without css transition
})
}
if (cardContainerRef.offsetWidth < WIDTH_BOUDARY_PX && this.widerPadding) {
this.setState({ widerPadding: false }, () => {
this.updateWiderPaddingCalled = true // first render without css transition
})
}
},
onHandleTabChange (key) {
this.$emit('tabChange', key)
},
isContainGrid (obj = []) {
let containGrid
obj.forEach((element) => {
if (
element &&
isContainGrid (obj = []) {
let containGrid
obj.forEach((element) => {
if (
element &&
element.componentOptions &&
getComponentName(element.componentOptions) === 'Grid'
) {
containGrid = true
}
})
return containGrid
},
) {
containGrid = true
}
})
return containGrid
},
render () {
const {
prefixCls = 'ant-card', extra, bodyStyle, title, loading,
bordered = true, type, tabList, hoverable,
} = this.$props
},
render () {
const {
prefixCls = 'ant-card', extra, bodyStyle, title, loading,
bordered = true, type, tabList, hoverable,
} = this.$props
const { $slots } = this
const { $slots } = this
const classString = {
[`${prefixCls}`]: true,
[`${prefixCls}-loading`]: loading,
[`${prefixCls}-bordered`]: bordered,
[`${prefixCls}-hoverable`]: !!hoverable,
[`${prefixCls}-wider-padding`]: this.widerPadding,
[`${prefixCls}-padding-transition`]: this.updateWiderPaddingCalled,
[`${prefixCls}-contain-grid`]: this.isContainGrid($slots.default),
[`${prefixCls}-contain-tabs`]: tabList && tabList.length,
[`${prefixCls}-type-${type}`]: !!type,
}
const classString = {
[`${prefixCls}`]: true,
[`${prefixCls}-loading`]: loading,
[`${prefixCls}-bordered`]: bordered,
[`${prefixCls}-hoverable`]: !!hoverable,
[`${prefixCls}-wider-padding`]: this.widerPadding,
[`${prefixCls}-padding-transition`]: this.updateWiderPaddingCalled,
[`${prefixCls}-contain-grid`]: this.isContainGrid($slots.default),
[`${prefixCls}-contain-tabs`]: tabList && tabList.length,
[`${prefixCls}-type-${type}`]: !!type,
}
const loadingBlock = (
<div class={`${prefixCls}-loading-content`}>
<p class={`${prefixCls}-loading-block`} style={{ width: '94%' }} />
<p>
<span class={`${prefixCls}-loading-block`} style={{ width: '28%' }} />
<span class={`${prefixCls}-loading-block`} style={{ width: '62%' }} />
</p>
<p>
<span class={`${prefixCls}-loading-block`} style={{ width: '22%' }} />
<span class={`${prefixCls}-loading-block`} style={{ width: '66%' }} />
</p>
<p>
<span class={`${prefixCls}-loading-block`} style={{ width: '56%' }} />
<span class={`${prefixCls}-loading-block`} style={{ width: '39%' }} />
</p>
<p>
<span class={`${prefixCls}-loading-block`} style={{ width: '21%' }} />
<span class={`${prefixCls}-loading-block`} style={{ width: '15%' }} />
<span class={`${prefixCls}-loading-block`} style={{ width: '40%' }} />
</p>
</div>
)
const loadingBlock = (
<div class={`${prefixCls}-loading-content`}>
<p class={`${prefixCls}-loading-block`} style={{ width: '94%' }} />
<p>
<span class={`${prefixCls}-loading-block`} style={{ width: '28%' }} />
<span class={`${prefixCls}-loading-block`} style={{ width: '62%' }} />
</p>
<p>
<span class={`${prefixCls}-loading-block`} style={{ width: '22%' }} />
<span class={`${prefixCls}-loading-block`} style={{ width: '66%' }} />
</p>
<p>
<span class={`${prefixCls}-loading-block`} style={{ width: '56%' }} />
<span class={`${prefixCls}-loading-block`} style={{ width: '39%' }} />
</p>
<p>
<span class={`${prefixCls}-loading-block`} style={{ width: '21%' }} />
<span class={`${prefixCls}-loading-block`} style={{ width: '15%' }} />
<span class={`${prefixCls}-loading-block`} style={{ width: '40%' }} />
</p>
</div>
)
let head
const tabs = tabList && tabList.length ? (
<Tabs class={`${prefixCls}-head-tabs`} size='large' onChange={this.onHandleTabChange}>
{tabList.map(item => <TabPane tab={item.tab} key={item.key} />)}
</Tabs>
) : null
const titleDom = title || getComponentFromProp(this, 'title')
const extraDom = extra || getComponentFromProp(this, 'extra')
if (titleDom || extraDom || tabs) {
head = (
<div class={`${prefixCls}-head`}>
<div class={`${prefixCls}-head-wrapper`}>
{titleDom && <div class={`${prefixCls}-head-title`}>{titleDom}</div>}
{extraDom && <div class={`${prefixCls}-extra`}>{extraDom}</div>}
</div>
{tabs}
let head
const tabs = tabList && tabList.length ? (
<Tabs class={`${prefixCls}-head-tabs`} size='large' onChange={this.onHandleTabChange}>
{tabList.map(item => <TabPane tab={item.tab} key={item.key} />)}
</Tabs>
) : null
const titleDom = title || getComponentFromProp(this, 'title')
const extraDom = extra || getComponentFromProp(this, 'extra')
if (titleDom || extraDom || tabs) {
head = (
<div class={`${prefixCls}-head`}>
<div class={`${prefixCls}-head-wrapper`}>
{titleDom && <div class={`${prefixCls}-head-title`}>{titleDom}</div>}
{extraDom && <div class={`${prefixCls}-extra`}>{extraDom}</div>}
</div>
)
}
const children = $slots.default
const cover = getComponentFromProp(this, 'cover')
const coverDom = cover ? <div class={`${prefixCls}-cover`}>{cover}</div> : null
const body = (
<div class={`${prefixCls}-body`} style={bodyStyle}>
{loading ? loadingBlock : children}
{tabs}
</div>
)
const actions = getComponentFromProp(this, 'actions')
const actionDom = actions || null
}
return (
<div class={classString} ref='cardContainerRef'>
{head}
{coverDom}
{children ? body : null}
{actionDom}
</div>
)
},
}
const children = $slots.default
const cover = getComponentFromProp(this, 'cover')
const coverDom = cover ? <div class={`${prefixCls}-cover`}>{cover}</div> : null
const body = (
<div class={`${prefixCls}-body`} style={bodyStyle}>
{loading ? loadingBlock : children}
</div>
)
const actions = getComponentFromProp(this, 'actions')
const actionDom = actions || null
return (
<div class={classString} ref='cardContainerRef'>
{head}
{coverDom}
{children ? body : null}
{actionDom}
</div>
)
},
}

View File

@ -382,4 +382,3 @@ export default {
},
}

View File

@ -80,4 +80,3 @@ export default {
},
}

View File

@ -74,4 +74,3 @@ Dropdown.Button = DropdownButton
export default Dropdown
export { DropdownProps }

View File

@ -147,4 +147,3 @@ export default {
},
}

View File

@ -68,5 +68,3 @@ export default {
},
}

View File

@ -148,4 +148,3 @@ export default {
},
}

View File

@ -1,5 +1,4 @@
export default {
name: 'InputGruop',
props: {

View File

@ -42,4 +42,3 @@ export default {
},
}

View File

@ -69,4 +69,3 @@ export default {
},
}

View File

@ -50,4 +50,3 @@ export default {
},
}

View File

@ -251,4 +251,3 @@ export default {
},
}

View File

@ -67,4 +67,3 @@ export default {
},
}

View File

@ -68,4 +68,3 @@ export default {
},
}

View File

@ -155,4 +155,3 @@ export default {
},
}

View File

@ -114,4 +114,3 @@ export default {
},
}

View File

@ -58,4 +58,3 @@ export default {
},
}

View File

@ -171,4 +171,3 @@ export default {
},
}

View File

@ -15,4 +15,3 @@ export default {
},
}

View File

@ -14,4 +14,3 @@ export default {
},
}

View File

@ -1,5 +1,4 @@
export default {
name: 'CheckableTag',
model: {

View File

@ -25,4 +25,3 @@ export default {
},
}

View File

@ -228,5 +228,3 @@ export default {
},
}

View File

@ -25,4 +25,3 @@ export default {
},
}

View File

@ -548,4 +548,3 @@ export default {
},
}

View File

@ -320,4 +320,3 @@ export default {
},
}

View File

@ -414,4 +414,3 @@ export default {
},
}

View File

@ -84,4 +84,3 @@ const DialogWrap = {
export default DialogWrap

View File

@ -17,5 +17,3 @@ export default {
},
}

View File

@ -39,4 +39,3 @@ export default {
},
}

View File

@ -65,4 +65,3 @@ export default {
},
}

View File

@ -146,4 +146,3 @@ Notification.newInstance = function newNotificationInstance (properties, callbac
export default Notification

View File

@ -179,4 +179,3 @@ export default {
},
}

View File

@ -1567,4 +1567,3 @@ export default {
},
}

View File

@ -208,4 +208,3 @@ export default {
},
}

View File

@ -4,7 +4,6 @@ import BaseMixin from '../_util/BaseMixin'
import debounce from 'lodash/debounce'
import isFlexSupported from '../_util/isFlexSupported'
import {
getOptionProps,
filterEmpty,
getEvents,
getPropsData,

View File

@ -191,4 +191,3 @@ const Combobox = {
export default Combobox

View File

@ -96,4 +96,3 @@ export default {
},
}

View File

@ -25,7 +25,7 @@
"test": "karma start test/karma.conf.js --single-run",
"build": "sh build.sh",
"dist": "node antd-tools/cli/run.js dist",
"lint": "eslint -c ./.eslintrc --fix --ext .js ./components/time-picker/locale",
"lint": "eslint -c ./.eslintrc --fix --ext .jsx ./components",
"lint:style": "stylelint \"./examples/**/*.less\" --fix --syntax less"
},
"repository": {
@ -38,7 +38,6 @@
},
"homepage": "https://github.com/vueComponent/ant-design",
"pre-commit": [
"lint",
"lint:style"
],
"devDependencies": {
@ -144,4 +143,4 @@
"vue-types": "^1.0.2",
"warning": "^3.0.0"
}
}
}