github
/
element
mirror of https://github.com/ElemeFE/element
1
0
Fork 0
Code Issues Releases Wiki Activity

update dependencies (#7476) 

* update el-input change event

* upgrade to vue 2.5.0

* upgrade webpack to 3.7

* upgrade vue to 2.5.2

* minor style updates
pull/7502/head
杨奕 2017-10-16 01:07:24 -05:00 committed by Black Wayne
parent 542deb779b
commit 38459ae850
96 changed files with 1491 additions and 630 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

2
CHANGELOG.en-US.md
View File

@ -77,6 +77,8 @@ in `lazy` mode #6235
- Added `separator-class` attribute to support icons as item separators #7203 - Added `separator-class` attribute to support icons as item separators #7203
- Steps - Steps
- Added `simple` attribute to activate simple-styled Steps #7274 - Added `simple` attribute to activate simple-styled Steps #7274
- Pagination
- Added `prev-text` and `next-text` attributes to customize texts of prev page and next page #7005
#### Bug fixes #### Bug fixes
- DatePicker - DatePicker

2
CHANGELOG.zh-CN.md
View File

@ -74,6 +74,8 @@
- 新增 `separator-class` 属性，可使用图标作为分隔符 #7203 - 新增 `separator-class` 属性，可使用图标作为分隔符 #7203
- Steps - Steps
- 新增 `simple` 属性，用于开启简洁风格的步骤条 #7274 - 新增 `simple` 属性，用于开启简洁风格的步骤条 #7274
- Pagination
- 新增 `prev-text` 和 `next-text` 属性，用于自定义上一页和下一页的文本 #7005
#### 修复 #### 修复
- DatePicker - DatePicker

2
build/cooking.demo.js
View File

@ -116,7 +116,7 @@ cooking.add('vueMarkdown', {
var wrap = function(render) { var wrap = function(render) {
return function() { return function() {
return render.apply(this, arguments) return render.apply(this, arguments)
.replace('<code class="', '<code class="hljs ') .replace('<code v-pre class="', '<code class="hljs ')
.replace('<code>', '<code class="hljs">'); .replace('<code>', '<code class="hljs">');
}; };
}; };

2
examples/app.vue
View File

@ -84,7 +84,7 @@
.container, .container,
.page-container { .page-container {
width: 1140px; width: 1140px;
padding: 0 30px; padding: 0;
margin: 0 auto; margin: 0 auto;
} }

58
examples/components/header.vue
View File

@ -92,6 +92,10 @@
position: relative; position: relative;
cursor: pointer; cursor: pointer;
&.nav-algolia-search {
cursor: default;
}
&.lang-item, &.lang-item,
&:last-child { &:last-child {
cursor: default; cursor: default;
@ -255,6 +259,9 @@
padding: 0 5px; padding: 0 5px;
} }
} }
.nav-theme-switch, .nav-algolia-search {
display: none;
}
} }
} }
@ -284,37 +291,37 @@
:style="headerStyle" :style="headerStyle"
:class="{ :class="{
'header-home': isHome, 'header-home': isHome,
'header-light': isComponentPage 'header-light': !isHome
}"> }">
<div class="container"> <div class="container">
<h1><router-link :to="`/${ lang }`"> <h1><router-link :to="`/${ lang }`">
<!-- logo --> <!-- logo -->
<slot v-if="isComponentPage"> <slot v-if="!isHome">
<img <img
src="../assets/images/element-logo.svg" src="../assets/images/element-logo.svg"
alt="element-logo" alt="element-logo"
class="nav-logo"> class="nav-logo">
<img <img
src="../assets/images/element-logo-small.svg" src="../assets/images/element-logo-small.svg"
alt="element-logo" alt="element-logo"
class="nav-logo-small"> class="nav-logo-small">
</slot> </slot>
<slot v-else> <slot v-if="isHome">
<img <img
src="../assets/images/element-logo-white.svg" src="../assets/images/element-logo-white.svg"
alt="element-logo" alt="element-logo"
class="nav-logo"> class="nav-logo">
<img <img
src="../assets/images/element-logo-small-white.svg" src="../assets/images/element-logo-small-white.svg"
alt="element-logo" alt="element-logo"
class="nav-logo-small"> class="nav-logo-small">
</slot> </slot>
</router-link></h1> </router-link></h1>
<!-- nav --> <!-- nav -->
<ul class="nav"> <ul class="nav">
<li class="nav-item"> <li class="nav-item nav-algolia-search" v-show="isComponentPage">
<algolia-search></algolia-search> <algolia-search></algolia-search>
</li> </li>
<li class="nav-item"> <li class="nav-item">
@ -384,7 +391,7 @@
</li> </li>
<!--theme picker--> <!--theme picker-->
<li class="nav-item" v-show="isComponentPage"> <li class="nav-item nav-theme-switch" v-show="isComponentPage">
<theme-picker></theme-picker> <theme-picker></theme-picker>
</li> </li>
</ul> </ul>
@ -395,7 +402,6 @@
<script> <script>
import ThemePicker from './theme-picker.vue'; import ThemePicker from './theme-picker.vue';
import AlgoliaSearch from './search.vue'; import AlgoliaSearch from './search.vue';
import bus from '../bus';
import compoLang from '../i18n/component.json'; import compoLang from '../i18n/component.json';
import { version } from 'main/index.js'; import { version } from 'main/index.js';
@ -405,11 +411,9 @@
active: '', active: '',
isHome: true, isHome: true,
headerStyle: {}, headerStyle: {},
visible: true,
versions: [], versions: [],
version, version,
dropdownVisible: true, dropdownVisible: true
isComponentPage: true
}; };
}, },
@ -433,6 +437,9 @@
}, },
langConfig() { langConfig() {
return compoLang.filter(config => config.lang === this.lang)[0]['header']; return compoLang.filter(config => config.lang === this.lang)[0]['header'];
},
isComponentPage() {
return /^component/.test(this.$route.name);
} }
}, },
@ -454,23 +461,18 @@
handlePathChange() { handlePathChange() {
const routerName = this.$route.name; const routerName = this.$route.name;
this.isComponentPage = /^component-/.test(routerName);
this.isHome = /^home/.test(routerName); this.isHome = /^home/.test(routerName);
if (this.isComponentPage) { if (!this.isHome) {
this.headerStyle.backgroundColor = '#fff'; this.headerStyle.backgroundColor = '#fff';
return; return;
} }
this.headerStyle.backgroundColor = `rgba(32, 160, 255, ${ this.isHome ? '0' : '1' })`; this.headerStyle.backgroundColor = 'rgba(32, 160, 255, 0)';
} }
}, },
created() { created() {
this.handlePathChange(); this.handlePathChange();
bus.$on('toggleHeader', visible => {
this.visible = visible;
});
const xhr = new XMLHttpRequest(); const xhr = new XMLHttpRequest();
xhr.onreadystatechange = _ => { xhr.onreadystatechange = _ => {
if (xhr.readyState === 4 && xhr.status === 200) { if (xhr.readyState === 4 && xhr.status === 200) {

97
examples/components/search.vue
View File

@ -2,12 +2,12 @@
<el-autocomplete <el-autocomplete
v-model="query" v-model="query"
size="small" size="small"
popper-class="algolia-search" :popper-class="`algolia-search${ isEmpty ? ' is-empty' : '' }`"
:fetch-suggestions="querySearch" :fetch-suggestions="querySearch"
:placeholder="placeholder" :placeholder="placeholder"
:trigger-on-focus="false" :trigger-on-focus="false"
@select="handleSelect"> @select="handleSelect">
<template scope="props"> <template slot-scope="props">
<p class="algolia-search-title" v-if="props.item.title"> <p class="algolia-search-title" v-if="props.item.title">
<span v-html="props.item.highlightedCompo"></span> <span v-html="props.item.highlightedCompo"></span>
<span class="algolia-search-separator">></span> <span class="algolia-search-separator">></span>
@ -17,11 +17,19 @@
class="algolia-search-content" class="algolia-search-content"
v-if="props.item.content" v-if="props.item.content"
v-html="props.item.content"></p> v-html="props.item.content"></p>
<img <a
class="algolia-search-logo" class="algolia-search-link"
src="../assets/images/search-by-algolia.svg" v-if="props.item.img"
alt="algolia-logo" target="_blank"
v-if="props.item.img"> href="https://www.algolia.com/docsearch">
<img
class="algolia-search-logo"
src="../assets/images/search-by-algolia.svg"
alt="algolia-logo">
</a>
<p
class="algolia-search-empty"
v-if="props.item.isEmpty">{{ emptyText }}</p>
</template> </template>
</el-autocomplete> </el-autocomplete>
</template> </template>
@ -29,6 +37,12 @@
<style> <style>
.algolia-search { .algolia-search {
width: 450px !important; width: 450px !important;
&.is-empty {
.el-autocomplete-suggestion__list {
padding-bottom: 0;
}
}
.el-autocomplete-suggestion__list { .el-autocomplete-suggestion__list {
position: static !important; position: static !important;
@ -39,27 +53,8 @@
border-bottom: solid 1px #ebebeb; border-bottom: solid 1px #ebebeb;
&:last-child { &:last-child {
border-bottom: none; border-bottom: none;
position: absolute; }
bottom: 0;
left: 0;
width: 100%;
background-color: #dfe4ed;
border-bottom-left-radius: 4px;
border-bottom-right-radius: 4px;
box-sizing: border-box;
text-align: right;
&:hover {
background-color: #dfe4ed;
}
img {
display: inline-block;
height: 17px;
margin-top: 10px;
}
}
} }
.algolia-highlight { .algolia-highlight {
@ -85,6 +80,35 @@
text-overflow: ellipsis; text-overflow: ellipsis;
white-space: nowrap; white-space: nowrap;
} }
.algolia-search-link {
position: absolute;
bottom: 0;
left: 0;
width: 100%;
padding-right: 20px;
background-color: #dfe4ed;
border-bottom-left-radius: 4px;
border-bottom-right-radius: 4px;
box-sizing: border-box;
text-align: right;
&:hover {
background-color: #dfe4ed;
}
img {
display: inline-block;
height: 17px;
margin-top: 10px;
}
}
.algolia-search-empty {
margin: 5px 0;
text-align: center;
color: #999;
}
} }
</style> </style>
@ -95,7 +119,8 @@
data() { data() {
return { return {
index: null, index: null,
query: '' query: '',
isEmpty: false
}; };
}, },
@ -106,6 +131,10 @@
placeholder() { placeholder() {
return this.lang === 'zh-CN' ? '搜索文档' : 'Search'; return this.lang === 'zh-CN' ? '搜索文档' : 'Search';
},
emptyText() {
return this.lang === 'zh-CN' ? '无匹配结果' : 'No results';
} }
}, },
@ -129,6 +158,7 @@
return; return;
} }
if (res.hits.length > 0) { if (res.hits.length > 0) {
this.isEmpty = false;
cb(res.hits.map(hit => { cb(res.hits.map(hit => {
let content = hit._highlightResult.content.value.replace(/\s+/g, ' '); let content = hit._highlightResult.content.value.replace(/\s+/g, ' ');
const highlightStart = content.indexOf('<span class="algolia-highlight">'); const highlightStart = content.indexOf('<span class="algolia-highlight">');
@ -146,17 +176,16 @@
title: hit._highlightResult.title.value, title: hit._highlightResult.title.value,
content content
}; };
}).concat({ }).concat({ img: true }));
img: true
}));
} else { } else {
cb([]); this.isEmpty = true;
cb([{ isEmpty: true }]);
} }
}); });
}, },
handleSelect(val) { handleSelect(val) {
if (val.img) return; if (val.img || val.isEmpty) return;
const component = val.component || ''; const component = val.component || '';
const anchor = val.anchor; const anchor = val.anchor;
this.$router.push(`/${ this.lang }/component/${ component }${ anchor ? `#${ anchor }` : '' }`); this.$router.push(`/${ this.lang }/component/${ component }${ anchor ? `#${ anchor }` : '' }`);

8
examples/components/side-nav.vue
View File

@ -22,6 +22,10 @@
margin-top: 15px; margin-top: 15px;
} }
> ul > .nav-item:nth-child(-n + 3) > a {
margin-top: 0;
}
.nav-item { .nav-item {
a { a {
font-size: 16px; font-size: 16px;
@ -45,7 +49,7 @@
a { a {
display: block; display: block;
height: 40px; height: 40px;
color: #666; color: #444;
line-height: 40px; line-height: 40px;
font-size: 14px; font-size: 14px;
overflow: hidden; overflow: hidden;
@ -126,7 +130,7 @@
</template> </template>
</li> </li>
</ul> </ul>
<div id="code-sponsor-widget"></div> <!--<div id="code-sponsor-widget"></div>-->
</div> </div>
</template> </template>
<script> <script>

24
examples/docs/en-US/dropdown.md
View File

@ -11,7 +11,7 @@
cursor: pointer; cursor: pointer;
color: #409EFF; color: #409EFF;
} }
.el-icon-caret-bottom { .el-icon-arrow-down {
font-size: 12px; font-size: 12px;
} }
} }
@ -61,7 +61,7 @@ Hover on the dropdown menu to unfold it for more actions.
```html ```html
<el-dropdown> <el-dropdown>
<span class="el-dropdown-link"> <span class="el-dropdown-link">
Dropdown List<i class="el-icon-caret-bottom el-icon--right"></i> Dropdown List<i class="el-icon-arrow-down el-icon--right"></i>
</span> </span>
<el-dropdown-menu slot="dropdown"> <el-dropdown-menu slot="dropdown">
<el-dropdown-item>Action 1</el-dropdown-item> <el-dropdown-item>Action 1</el-dropdown-item>
@ -77,7 +77,7 @@ Hover on the dropdown menu to unfold it for more actions.
cursor: pointer; cursor: pointer;
color: #409EFF; color: #409EFF;
} }
.el-icon-caret-bottom { .el-icon-arrow-down {
font-size: 12px; font-size: 12px;
} }
</style> </style>
@ -94,7 +94,7 @@ Use the button to trigger the dropdown list.
```html ```html
<el-dropdown> <el-dropdown>
<el-button type="primary"> <el-button type="primary">
Dropdown List<i class="el-icon-caret-bottom el-icon--right"></i> Dropdown List<i class="el-icon-arrow-down el-icon--right"></i>
</el-button> </el-button>
<el-dropdown-menu slot="dropdown"> <el-dropdown-menu slot="dropdown">
<el-dropdown-item>Action 1</el-dropdown-item> <el-dropdown-item>Action 1</el-dropdown-item>
@ -122,7 +122,7 @@ Use the button to trigger the dropdown list.
.el-dropdown + .el-dropdown { .el-dropdown + .el-dropdown {
margin-left: 15px; margin-left: 15px;
} }
.el-icon-caret-bottom { .el-icon-arrow-down {
font-size: 12px; font-size: 12px;
} }
</style> </style>
@ -151,7 +151,7 @@ Click the triggering element or hover on it.
<span class="demonstration">hover to trigger</span> <span class="demonstration">hover to trigger</span>
<el-dropdown> <el-dropdown>
<span class="el-dropdown-link"> <span class="el-dropdown-link">
Dropdown List<i class="el-icon-caret-bottom el-icon--right"></i> Dropdown List<i class="el-icon-arrow-down el-icon--right"></i>
</span> </span>
<el-dropdown-menu slot="dropdown"> <el-dropdown-menu slot="dropdown">
<el-dropdown-item>Action 1</el-dropdown-item> <el-dropdown-item>Action 1</el-dropdown-item>
@ -166,7 +166,7 @@ Click the triggering element or hover on it.
<span class="demonstration">click to trigger</span> <span class="demonstration">click to trigger</span>
<el-dropdown trigger="click"> <el-dropdown trigger="click">
<span class="el-dropdown-link"> <span class="el-dropdown-link">
Dropdown List<i class="el-icon-caret-bottom el-icon--right"></i> Dropdown List<i class="el-icon-arrow-down el-icon--right"></i>
</span> </span>
<el-dropdown-menu slot="dropdown"> <el-dropdown-menu slot="dropdown">
<el-dropdown-item>Action 1</el-dropdown-item> <el-dropdown-item>Action 1</el-dropdown-item>
@ -184,7 +184,7 @@ Click the triggering element or hover on it.
cursor: pointer; cursor: pointer;
color: #409EFF; color: #409EFF;
} }
.el-icon-caret-bottom { .el-icon-arrow-down {
font-size: 12px; font-size: 12px;
} }
.demonstration { .demonstration {
@ -205,7 +205,7 @@ Use `hide-on-click` to define if menu closes on clicking.
```html ```html
<el-dropdown :hide-on-click="false"> <el-dropdown :hide-on-click="false">
<span class="el-dropdown-link"> <span class="el-dropdown-link">
Dropdown List<i class="el-icon-caret-bottom el-icon--right"></i> Dropdown List<i class="el-icon-arrow-down el-icon--right"></i>
</span> </span>
<el-dropdown-menu slot="dropdown"> <el-dropdown-menu slot="dropdown">
<el-dropdown-item>Action 1</el-dropdown-item> <el-dropdown-item>Action 1</el-dropdown-item>
@ -221,7 +221,7 @@ Use `hide-on-click` to define if menu closes on clicking.
cursor: pointer; cursor: pointer;
color: #409EFF; color: #409EFF;
} }
.el-icon-caret-bottom { .el-icon-arrow-down {
font-size: 12px; font-size: 12px;
} }
</style> </style>
@ -236,7 +236,7 @@ Clicking each dropdown item fires an event whose parameter is assigned by each i
```html ```html
<el-dropdown @command="handleCommand"> <el-dropdown @command="handleCommand">
<span class="el-dropdown-link"> <span class="el-dropdown-link">
Dropdown List<i class="el-icon-caret-bottom el-icon--right"></i> Dropdown List<i class="el-icon-arrow-down el-icon--right"></i>
</span> </span>
<el-dropdown-menu slot="dropdown"> <el-dropdown-menu slot="dropdown">
<el-dropdown-item command="a">Action 1</el-dropdown-item> <el-dropdown-item command="a">Action 1</el-dropdown-item>
@ -252,7 +252,7 @@ Clicking each dropdown item fires an event whose parameter is assigned by each i
cursor: pointer; cursor: pointer;
color: #409EFF; color: #409EFF;
} }
.el-icon-caret-bottom { .el-icon-arrow-down {
font-size: 12px; font-size: 12px;
} }
</style> </style>

31
examples/docs/en-US/icon.md
View File

@ -94,34 +94,3 @@ Just assign the class name to `el-icon-iconName`.
</span> </span>
</li> </li>
</ul> </ul>
### Third-party icons
Some of Element's components has an `icon` attribute, e.g. Input. If you want to use a third-party icon in the `icon` attribute, here's what you need to do:
<p>
<span>1.</span> Modify the class name prefix of the third-party library
</p>
Please read third-party icon library documentation on how to do it. For example, if you're using [iconfont.cn](http://iconfont.cn/), you can find prefix editor in the "Edit Project" dialog. If you're using [Font Awesome](http://fontawesome.io/), you can refer to [this demo](https://github.com/ElementUI/element-font-awesome).
<p>
<span>2.</span> Add some CSS:
</p>
```CSS
[class^="el-icon-my"], [class*=" el-icon-my"] {
font-family:"your-font-family" !important;
/* The following is based on original CSS rules of third-party library */
font-size: inherit;
font-style:normal;
-webkit-font-smoothing: antialiased;
-moz-osx-font-smoothing: grayscale;
}
```
Now you can use them as you do with Element built-in icons. For example, in el-input:
```html
<el-input icon="my-xxx" />
```

4
examples/docs/en-US/input.md
View File

@ -476,7 +476,7 @@ Customize how suggestions are displayed.
@select="handleSelect" @select="handleSelect"
icon="edit" icon="edit"
:on-icon-click="handleIconClick"> :on-icon-click="handleIconClick">
<template scope="props"> <template slot-scope="props">
<div class="value">{{ props.item.value }}</div> <div class="value">{{ props.item.value }}</div>
<span class="link">{{ props.item.link }}</span> <span class="link">{{ props.item.link }}</span>
</template> </template>
@ -680,4 +680,4 @@ Attribute | Description | Type | Options | Default
### Methods ### Methods
| Method | Description | Parameters | | Method | Description | Parameters |
|------|--------|-------| |------|--------|-------|
| focus | focus the Input component | - | | focus | focus the Input component | — |

5
examples/docs/en-US/switch.md
View File

@ -158,3 +158,8 @@ name| input name of Switch | string | — | —
Event Name | Description | Parameters Event Name | Description | Parameters
---- | ----| ---- ---- | ----| ----
change | triggers when value changes | value after changing change | triggers when value changes | value after changing
### Methods
Method | Description | Parameters
------|--------|-------
focus | focus the Switch component | —

16
examples/docs/en-US/table.md
View File

@ -664,7 +664,7 @@ When there are too many columns, you can fix some of them.
fixed="right" fixed="right"
label="Operations" label="Operations"
width="120"> width="120">
<template scope="scope"> <template slot-scope="scope">
<el-button @click="handleClick" type="text" size="small">Detail</el-button> <el-button @click="handleClick" type="text" size="small">Detail</el-button>
<el-button type="text" size="small">Edit</el-button> <el-button type="text" size="small">Edit</el-button>
</template> </template>
@ -873,7 +873,7 @@ When the the data is dynamically changed, you might want the table to have a max
fixed="right" fixed="right"
label="Operations" label="Operations"
width="120"> width="120">
<template scope="scope"> <template slot-scope="scope">
<el-button <el-button
@click.native.prevent="deleteRow(scope.$index, tableData4)" @click.native.prevent="deleteRow(scope.$index, tableData4)"
type="text" type="text"
@ -1154,7 +1154,7 @@ You can also select multiple rows.
<el-table-column <el-table-column
label="Date" label="Date"
width="120"> width="120">
<template scope="scope">{{ scope.row.date }}</template> <template slot-scope="scope">{{ scope.row.date }}</template>
</el-table-column> </el-table-column>
<el-table-column <el-table-column
property="name" property="name"
@ -1325,7 +1325,7 @@ Filter the table to find desired data.
:filters="[{ text: 'Home', value: 'Home' }, { text: 'Office', value: 'Office' }]" :filters="[{ text: 'Home', value: 'Home' }, { text: 'Office', value: 'Office' }]"
:filter-method="filterTag" :filter-method="filterTag"
filter-placement="bottom-end"> filter-placement="bottom-end">
<template scope="scope"> <template slot-scope="scope">
<el-tag <el-tag
:type="scope.row.tag === 'Home' ? 'primary' : 'success'" :type="scope.row.tag === 'Home' ? 'primary' : 'success'"
close-transition>{{scope.row.tag}}</el-tag> close-transition>{{scope.row.tag}}</el-tag>
@ -1386,7 +1386,7 @@ Customize table column so it can be integrated with other components.
<el-table-column <el-table-column
label="Date" label="Date"
width="180"> width="180">
<template scope="scope"> <template slot-scope="scope">
<el-icon name="time"></el-icon> <el-icon name="time"></el-icon>
<span style="margin-left: 10px">{{ scope.row.date }}</span> <span style="margin-left: 10px">{{ scope.row.date }}</span>
</template> </template>
@ -1394,7 +1394,7 @@ Customize table column so it can be integrated with other components.
<el-table-column <el-table-column
label="Name" label="Name"
width="180"> width="180">
<template scope="scope"> <template slot-scope="scope">
<el-popover trigger="hover" placement="top"> <el-popover trigger="hover" placement="top">
<p>Name: {{ scope.row.name }}</p> <p>Name: {{ scope.row.name }}</p>
<p>Addr: {{ scope.row.address }}</p> <p>Addr: {{ scope.row.address }}</p>
@ -1406,7 +1406,7 @@ Customize table column so it can be integrated with other components.
</el-table-column> </el-table-column>
<el-table-column <el-table-column
label="Operations"> label="Operations">
<template scope="scope"> <template slot-scope="scope">
<el-button <el-button
size="small" size="small"
@click="handleEdit(scope.$index, scope.row)">Edit</el-button> @click="handleEdit(scope.$index, scope.row)">Edit</el-button>
@ -1465,7 +1465,7 @@ When the row content is too long and you do not want to display the horizontal s
:data="tableData3" :data="tableData3"
style="width: 100%"> style="width: 100%">
<el-table-column type="expand"> <el-table-column type="expand">
<template scope="props"> <template slot-scope="props">
<p>State: {{ props.row.state }}</p> <p>State: {{ props.row.state }}</p>
<p>City: {{ props.row.city }}</p> <p>City: {{ props.row.city }}</p>
<p>Address: {{ props.row.address }}</p> <p>Address: {{ props.row.address }}</p>

2
examples/docs/en-US/upload.md
View File

@ -411,7 +411,7 @@ on-progress | hook function when some progress occurs | function(event, file, fi
on-change | hook function when select file or upload file success or upload file fail | function(file, fileList) | — | — | on-change | hook function when select file or upload file success or upload file fail | function(file, fileList) | — | — |
before-upload | hook function before uploading with the file to be uploaded as its parameter. If `false` is returned or a `Promise` is returned and then is rejected, uploading will be aborted | function(file) | — | — before-upload | hook function before uploading with the file to be uploaded as its parameter. If `false` is returned or a `Promise` is returned and then is rejected, uploading will be aborted | function(file) | — | —
thumbnail-mode | whether thumbnail is displayed | boolean | — | false thumbnail-mode | whether thumbnail is displayed | boolean | — | false
file-list | default uploaded files, e.g. [{name: 'food.jpeg', url: 'https://fuss10.elemecdn.com/3/63/4e7f3a15429bfda99bce42a18cdd1jpeg.jpeg?imageMogr2/thumbnail/360x360/format/webp/quality/100'}] | array | — | [] file-list | default uploaded files, e.g. [{name: 'food.jpg', url: 'https://xxx.cdn.com/xxx.jpg'}] | array | — | []
list-type | type of fileList | string | text/picture/picture-card | text | list-type | type of fileList | string | text/picture/picture-card | text |
auto-upload | whether to auto upload file | boolean | — | true | auto-upload | whether to auto upload file | boolean | — | true |
http-request | override default xhr behavior, allowing you to implement your own upload-file's request | function | — | — | http-request | override default xhr behavior, allowing you to implement your own upload-file's request | function | — | — |

24
examples/docs/zh-CN/dropdown.md
View File

@ -11,7 +11,7 @@
cursor: pointer; cursor: pointer;
color: #409EFF; color: #409EFF;
} }
.el-icon-caret-bottom { .el-icon-arrow-down {
font-size: 12px; font-size: 12px;
} }
} }
@ -63,7 +63,7 @@
```html ```html
<el-dropdown> <el-dropdown>
<span class="el-dropdown-link"> <span class="el-dropdown-link">
下拉菜单<i class="el-icon-caret-bottom el-icon--right"></i> 下拉菜单<i class="el-icon-arrow-down el-icon--right"></i>
</span> </span>
<el-dropdown-menu slot="dropdown"> <el-dropdown-menu slot="dropdown">
<el-dropdown-item>黄金糕</el-dropdown-item> <el-dropdown-item>黄金糕</el-dropdown-item>
@ -80,7 +80,7 @@
cursor: pointer; cursor: pointer;
color: #409EFF; color: #409EFF;
} }
.el-icon-caret-bottom { .el-icon-arrow-down {
font-size: 12px; font-size: 12px;
} }
</style> </style>
@ -96,7 +96,7 @@
```html ```html
<el-dropdown> <el-dropdown>
<el-button type="primary"> <el-button type="primary">
更多菜单<i class="el-icon-caret-bottom el-icon--right"></i> 更多菜单<i class="el-icon-arrow-down el-icon--right"></i>
</el-button> </el-button>
<el-dropdown-menu slot="dropdown"> <el-dropdown-menu slot="dropdown">
<el-dropdown-item>黄金糕</el-dropdown-item> <el-dropdown-item>黄金糕</el-dropdown-item>
@ -124,7 +124,7 @@
.el-dropdown + .el-dropdown { .el-dropdown + .el-dropdown {
margin-left: 15px; margin-left: 15px;
} }
.el-icon-caret-bottom { .el-icon-arrow-down {
font-size: 12px; font-size: 12px;
} }
</style> </style>
@ -153,7 +153,7 @@
<span class="demonstration">hover 激活</span> <span class="demonstration">hover 激活</span>
<el-dropdown> <el-dropdown>
<span class="el-dropdown-link"> <span class="el-dropdown-link">
下拉菜单<i class="el-icon-caret-bottom el-icon--right"></i> 下拉菜单<i class="el-icon-arrow-down el-icon--right"></i>
</span> </span>
<el-dropdown-menu slot="dropdown"> <el-dropdown-menu slot="dropdown">
<el-dropdown-item>黄金糕</el-dropdown-item> <el-dropdown-item>黄金糕</el-dropdown-item>
@ -168,7 +168,7 @@
<span class="demonstration">click 激活</span> <span class="demonstration">click 激活</span>
<el-dropdown trigger="click"> <el-dropdown trigger="click">
<span class="el-dropdown-link"> <span class="el-dropdown-link">
下拉菜单<i class="el-icon-caret-bottom el-icon--right"></i> 下拉菜单<i class="el-icon-arrow-down el-icon--right"></i>
</span> </span>
<el-dropdown-menu slot="dropdown"> <el-dropdown-menu slot="dropdown">
<el-dropdown-item>黄金糕</el-dropdown-item> <el-dropdown-item>黄金糕</el-dropdown-item>
@ -187,7 +187,7 @@
cursor: pointer; cursor: pointer;
color: #409EFF; color: #409EFF;
} }
.el-icon-caret-bottom { .el-icon-arrow-down {
font-size: 12px; font-size: 12px;
} }
.demonstration { .demonstration {
@ -208,7 +208,7 @@
```html ```html
<el-dropdown :hide-on-click="false"> <el-dropdown :hide-on-click="false">
<span class="el-dropdown-link"> <span class="el-dropdown-link">
下拉菜单<i class="el-icon-caret-bottom el-icon--right"></i> 下拉菜单<i class="el-icon-arrow-down el-icon--right"></i>
</span> </span>
<el-dropdown-menu slot="dropdown"> <el-dropdown-menu slot="dropdown">
<el-dropdown-item>黄金糕</el-dropdown-item> <el-dropdown-item>黄金糕</el-dropdown-item>
@ -224,7 +224,7 @@
cursor: pointer; cursor: pointer;
color: #409EFF; color: #409EFF;
} }
.el-icon-caret-bottom { .el-icon-arrow-down {
font-size: 12px; font-size: 12px;
} }
</style> </style>
@ -239,7 +239,7 @@
```html ```html
<el-dropdown @command="handleCommand"> <el-dropdown @command="handleCommand">
<span class="el-dropdown-link"> <span class="el-dropdown-link">
下拉菜单<i class="el-icon-caret-bottom el-icon--right"></i> 下拉菜单<i class="el-icon-arrow-down el-icon--right"></i>
</span> </span>
<el-dropdown-menu slot="dropdown"> <el-dropdown-menu slot="dropdown">
<el-dropdown-item command="a">黄金糕</el-dropdown-item> <el-dropdown-item command="a">黄金糕</el-dropdown-item>
@ -255,7 +255,7 @@
cursor: pointer; cursor: pointer;
color: #409EFF; color: #409EFF;
} }
.el-icon-caret-bottom { .el-icon-arrow-down {
font-size: 12px; font-size: 12px;
} }
</style> </style>

6
examples/docs/zh-CN/form.md
View File

@ -156,10 +156,10 @@
<style> <style>
.demo-form.demo-zh-CN { .demo-form.demo-zh-CN {
.el-select .el-input { .el-select .el-input {
width: 360px; width: 380px;
} }
.el-form { .el-form {
width: 440px; width: 460px;
} }
.line { .line {
@ -196,7 +196,7 @@
} }
} }
.demo-form-normal { .demo-form-normal {
width: 440px; width: 460px;
} }
.demo-form-inline { .demo-form-inline {
width: auto; width: auto;

30
examples/docs/zh-CN/icon.md
View File

@ -91,33 +91,3 @@
</span> </span>
</li> </li>
</ul> </ul>
### 第三方图标库
Element 的一些组件提供了 `icon` 属性（如 Input），如果希望传入第三方图标库中的图标，需要进行如下操作：
<p>
<span>1.</span> 修改第三方图标库的前缀（见下方说明）
</p>
<p>
<span>2.</span> 添加以下 CSS：
</p>
```CSS
[class^="el-icon-my"], [class*=" el-icon-my"] {
font-family:"your-font-family" !important;
/* 以下内容参照第三方图标库本身的规则 */
font-size: inherit;
font-style:normal;
-webkit-font-smoothing: antialiased;
-moz-osx-font-smoothing: grayscale;
}
```
之后就可以像使用 Element 内置图标一样使用第三方图标。比如在 el-input 中：
```html
<el-input icon="my-xxx" />
```
关于如何修改第三方图标库的前缀，请参阅第三方图标库的文档。比如，如果使用 [iconfont.cn](http://iconfont.cn/)，则可以在「编辑项目」弹框中修改；如果使用 [Font Awesome](http://fontawesome.io/)，可以参考[这个示例](https://github.com/ElementUI/element-font-awesome)。

2
examples/docs/zh-CN/input.md
View File

@ -546,7 +546,7 @@ export default {
@select="handleSelect" @select="handleSelect"
icon="edit" icon="edit"
:on-icon-click="handleIconClick"> :on-icon-click="handleIconClick">
<template scope="props"> <template slot-scope="props">
<div class="name">{{ props.item.value }}</div> <div class="name">{{ props.item.value }}</div>
<span class="addr">{{ props.item.address }}</span> <span class="addr">{{ props.item.address }}</span>
</template> </template>

5
examples/docs/zh-CN/switch.md
View File

@ -160,3 +160,8 @@
| 事件名称 | 说明 | 回调参数 | | 事件名称 | 说明 | 回调参数 |
|---------- |-------- |---------- | |---------- |-------- |---------- |
| change | switch 状态发生变化时的回调函数 | 新状态的值 | | change | switch 状态发生变化时的回调函数 | 新状态的值 |
### Methods
| 方法名 | 说明 | 参数 |
| ---- | ---- | ---- |
| focus | 使 Switch 获取焦点 | - |

16
examples/docs/zh-CN/table.md
View File

@ -706,7 +706,7 @@
fixed="right" fixed="right"
label="操作" label="操作"
width="100"> width="100">
<template scope="scope"> <template slot-scope="scope">
<el-button @click="handleClick(scope.row)" type="text" size="small">查看</el-button> <el-button @click="handleClick(scope.row)" type="text" size="small">查看</el-button>
<el-button type="text" size="small">编辑</el-button> <el-button type="text" size="small">编辑</el-button>
</template> </template>
@ -912,7 +912,7 @@
fixed="right" fixed="right"
label="操作" label="操作"
width="120"> width="120">
<template scope="scope"> <template slot-scope="scope">
<el-button <el-button
@click.native.prevent="deleteRow(scope.$index, tableData4)" @click.native.prevent="deleteRow(scope.$index, tableData4)"
type="text" type="text"
@ -1194,7 +1194,7 @@
<el-table-column <el-table-column
label="日期" label="日期"
width="120"> width="120">
<template scope="scope">{{ scope.row.date }}</template> <template slot-scope="scope">{{ scope.row.date }}</template>
</el-table-column> </el-table-column>
<el-table-column <el-table-column
prop="name" prop="name"
@ -1367,7 +1367,7 @@
:filters="[{ text: '家', value: '家' }, { text: '公司', value: '公司' }]" :filters="[{ text: '家', value: '家' }, { text: '公司', value: '公司' }]"
:filter-method="filterTag" :filter-method="filterTag"
filter-placement="bottom-end"> filter-placement="bottom-end">
<template scope="scope"> <template slot-scope="scope">
<el-tag <el-tag
:type="scope.row.tag === '家' ? 'primary' : 'success'" :type="scope.row.tag === '家' ? 'primary' : 'success'"
close-transition>{{scope.row.tag}}</el-tag> close-transition>{{scope.row.tag}}</el-tag>
@ -1428,7 +1428,7 @@
<el-table-column <el-table-column
label="日期" label="日期"
width="180"> width="180">
<template scope="scope"> <template slot-scope="scope">
<el-icon name="time"></el-icon> <el-icon name="time"></el-icon>
<span style="margin-left: 10px">{{ scope.row.date }}</span> <span style="margin-left: 10px">{{ scope.row.date }}</span>
</template> </template>
@ -1436,7 +1436,7 @@
<el-table-column <el-table-column
label="姓名" label="姓名"
width="180"> width="180">
<template scope="scope"> <template slot-scope="scope">
<el-popover trigger="hover" placement="top"> <el-popover trigger="hover" placement="top">
<p>姓名: {{ scope.row.name }}</p> <p>姓名: {{ scope.row.name }}</p>
<p>住址: {{ scope.row.address }}</p> <p>住址: {{ scope.row.address }}</p>
@ -1447,7 +1447,7 @@
</template> </template>
</el-table-column> </el-table-column>
<el-table-column label="操作"> <el-table-column label="操作">
<template scope="scope"> <template slot-scope="scope">
<el-button <el-button
size="small" size="small"
@click="handleEdit(scope.$index, scope.row)">编辑</el-button> @click="handleEdit(scope.$index, scope.row)">编辑</el-button>
@ -1506,7 +1506,7 @@
:data="tableData5" :data="tableData5"
style="width: 100%"> style="width: 100%">
<el-table-column type="expand"> <el-table-column type="expand">
<template scope="props"> <template slot-scope="props">
<el-form label-position="left" inline class="demo-table-expand"> <el-form label-position="left" inline class="demo-table-expand">
<el-form-item label="商品名称"> <el-form-item label="商品名称">
<span>{{ props.row.name }}</span> <span>{{ props.row.name }}</span>

2
examples/docs/zh-CN/upload.md
View File

@ -421,7 +421,7 @@
| before-upload | 上传文件之前的钩子，参数为上传的文件，若返回 false 或者返回 Promise 且被 reject，则停止上传。 | function(file) | — | — | | before-upload | 上传文件之前的钩子，参数为上传的文件，若返回 false 或者返回 Promise 且被 reject，则停止上传。 | function(file) | — | — |
| list-type | 文件列表的类型 | string | text/picture/picture-card | text | | list-type | 文件列表的类型 | string | text/picture/picture-card | text |
| auto-upload | 是否在选取文件后立即进行上传 | boolean | — | true | | auto-upload | 是否在选取文件后立即进行上传 | boolean | — | true |
| file-list | 上传的文件列表, 例如: [{name: 'food.jpeg', url: 'https://fuss10.elemecdn.com/3/63/4e7f3a15429bfda99bce42a18cdd1jpeg.jpeg?imageMogr2/thumbnail/360x360/format/webp/quality/100'}] | array | — | [] | | file-list | 上传的文件列表, 例如: [{name: 'food.jpg', url: 'https://xxx.cdn.com/xxx.jpg'}] | array | — | [] |
| http-request | 覆盖默认的上传行为，可以自定义上传的实现 | function | — | — | | http-request | 覆盖默认的上传行为，可以自定义上传的实现 | function | — | — |
| disabled | 是否禁用 | boolean | — | false | | disabled | 是否禁用 | boolean | — | false |
| limit | 最大允许上传个数 | number | — | — | | limit | 最大允许上传个数 | number | — | — |

2
examples/index.tpl
View File

@ -9,7 +9,7 @@
</head> </head>
<body> <body>
<div id="app"></div><% if (process.env.NODE_ENV === 'production') { %> <div id="app"></div><% if (process.env.NODE_ENV === 'production') { %>
<script src="https://app.codesponsor.io/scripts/qFcVkt4f3DQEg4zrwINGVg?theme=light&height=250&width=240"></script> <!--<script src="https://app.codesponsor.io/scripts/qFcVkt4f3DQEg4zrwINGVg?theme=light&height=250&width=240"></script>-->
<script src="//cdn.jsdelivr.net/npm/vue@2.3.0/dist/vue.runtime.min.js"></script> <script src="//cdn.jsdelivr.net/npm/vue@2.3.0/dist/vue.runtime.min.js"></script>
<script src="//cdn.jsdelivr.net/npm/vue-router@2.1.1/dist/vue-router.min.js"></script><% } %> <script src="//cdn.jsdelivr.net/npm/vue-router@2.1.1/dist/vue-router.min.js"></script><% } %>
</body> </body>

2
examples/nav.config.json
View File

@ -34,7 +34,7 @@
] ]
}, },
{ {
"name": "基础组件", "name": "组件",
"groups": [ "groups": [
{ {
"groupName": "Basic", "groupName": "Basic",

5
examples/pages/template/component.tpl
View File

@ -154,6 +154,9 @@
overflow: auto; overflow: auto;
display: block; display: block;
} }
.page-component-up {
display: none;
}
} }
} }
</style> </style>
@ -243,11 +246,9 @@
this.showBackToTop = scrollTop >= 0.5 * document.body.clientHeight; this.showBackToTop = scrollTop >= 0.5 * document.body.clientHeight;
if (this.showHeader !== this.scrollTop > scrollTop) { if (this.showHeader !== this.scrollTop > scrollTop) {
this.showHeader = this.scrollTop > scrollTop; this.showHeader = this.scrollTop > scrollTop;
bus.$emit('toggleHeader', this.showHeader);
} }
if (scrollTop === 0) { if (scrollTop === 0) {
this.showHeader = true; this.showHeader = true;
bus.$emit('toggleHeader', this.showHeader);
} }
if (!this.navFaded) { if (!this.navFaded) {
bus.$emit('fadeNav'); bus.$emit('fadeNav');

40
package.json
View File

@ -73,15 +73,15 @@
"cooking": "^1.2.0", "cooking": "^1.2.0",
"cooking-lint": "^0.1.3", "cooking-lint": "^0.1.3",
"cooking-vue2": "^0.3.0", "cooking-vue2": "^0.3.0",
"copy-webpack-plugin": "^4.0.1", "copy-webpack-plugin": "^4.1.1",
"coveralls": "^2.11.14", "coveralls": "^2.11.14",
"cp-cli": "^1.0.2", "cp-cli": "^1.0.2",
"cross-env": "^3.1.3", "cross-env": "^3.1.3",
"css-loader": "^0.24.0", "css-loader": "^0.28.7",
"es6-promise": "^4.0.5", "es6-promise": "^4.0.5",
"eslint": "^3.10.2", "eslint": "^3.10.2",
"extract-text-webpack-plugin": "^1.0.1", "extract-text-webpack-plugin": "^3.0.1",
"file-loader": "^0.9.0", "file-loader": "^1.1.5",
"file-save": "^0.2.0", "file-save": "^0.2.0",
"gh-pages": "^0.11.0", "gh-pages": "^0.11.0",
"gulp": "^3.9.1", "gulp": "^3.9.1",
@ -90,11 +90,11 @@
"gulp-postcss": "^6.1.1", "gulp-postcss": "^6.1.1",
"gulp-sass": "^3.1.0", "gulp-sass": "^3.1.0",
"highlight.js": "^9.3.0", "highlight.js": "^9.3.0",
"html-loader": "^0.4.3", "html-loader": "^0.5.1",
"html-webpack-plugin": "^2.22.0", "html-webpack-plugin": "^2.30.1",
"inject-loader": "^3.0.0-beta2", "inject-loader": "^3.0.1",
"isparta-loader": "^2.0.0", "isparta-loader": "^2.0.0",
"json-loader": "^0.5.4", "json-loader": "^0.5.7",
"json-templater": "^1.0.4", "json-templater": "^1.0.4",
"karma": "^1.3.0", "karma": "^1.3.0",
"karma-coverage": "^1.1.1", "karma-coverage": "^1.1.1",
@ -113,25 +113,25 @@
"node-sass": "^4.5.3", "node-sass": "^4.5.3",
"phantomjs-prebuilt": "^2.1.13", "phantomjs-prebuilt": "^2.1.13",
"postcss": "^5.1.2", "postcss": "^5.1.2",
"postcss-loader": "^0.11.1", "postcss-loader": "0.11.1",
"postcss-salad": "^1.0.8", "postcss-salad": "^1.0.8",
"rimraf": "^2.5.4", "rimraf": "^2.5.4",
"sass-loader": "^6.0.6", "sass-loader": "^6.0.6",
"sinon": "^1.17.6", "sinon": "^1.17.6",
"sinon-chai": "^2.8.0", "sinon-chai": "^2.8.0",
"style-loader": "^0.13.1", "style-loader": "^0.19.0",
"theaterjs": "^3.0.0", "theaterjs": "^3.0.0",
"transliteration": "^1.1.11", "transliteration": "^1.1.11",
"uppercamelcase": "^1.1.0", "uppercamelcase": "^1.1.0",
"url-loader": "^0.5.7", "url-loader": "^0.6.2",
"vue": "^2.3.0", "vue": "^2.5.2",
"vue-loader": "^12.0.2", "vue-loader": "^13.3.0",
"vue-markdown-loader": "^0.5.1", "vue-markdown-loader": "1",
"vue-router": "^2.0.0", "vue-router": "2.7.0",
"vue-template-compiler": "^2.3.0", "vue-template-compiler": "^2.5.2",
"vue-template-es2015-compiler": "^1.5.2", "vue-template-es2015-compiler": "^1.6.0",
"webpack": "^1.13.2", "webpack": "^3.7.1",
"webpack-dev-server": "^1.15.1", "webpack-dev-server": "^2.9.1",
"webpack-node-externals": "^1.5.4" "webpack-node-externals": "^1.6.0"
} }
} }

6
packages/autocomplete/src/autocomplete.vue
View File

@ -13,7 +13,7 @@
@compositionstart.native="handleComposition" @compositionstart.native="handleComposition"
@compositionupdate.native="handleComposition" @compositionupdate.native="handleComposition"
@compositionend.native="handleComposition" @compositionend.native="handleComposition"
@change="handleChange" @input="handleChange"
@focus="handleFocus" @focus="handleFocus"
@blur="handleBlur" @blur="handleBlur"
@keydown.up.native.prevent="highlight(highlightedIndex - 1)" @keydown.up.native.prevent="highlight(highlightedIndex - 1)"
@ -147,7 +147,9 @@
handleComposition(event) { handleComposition(event) {
if (event.type === 'compositionend') { if (event.type === 'compositionend') {
this.isOnComposition = false; this.isOnComposition = false;
this.handleChange(this.value); this.$nextTick(() => {
this.handleChange(this.value);
});
} else { } else {
this.isOnComposition = true; this.isOnComposition = true;
} }

6
packages/button/src/button.vue
View File

@ -25,7 +25,11 @@
export default { export default {
name: 'ElButton', name: 'ElButton',
inject: ['elFormItem'], inject: {
elFormItem: {
default: ''
}
},
props: { props: {
type: { type: {

8
packages/cascader/src/main.vue
View File

@ -19,7 +19,7 @@
:readonly="!filterable" :readonly="!filterable"
:placeholder="currentLabels.length ? undefined : placeholder" :placeholder="currentLabels.length ? undefined : placeholder"
v-model="inputValue" v-model="inputValue"
@change="debouncedInputChange" @input="debouncedInputChange"
:validate-event="false" :validate-event="false"
:size="size" :size="size"
:disabled="disabled" :disabled="disabled"
@ -87,7 +87,11 @@ export default {
mixins: [popperMixin, emitter, Locale], mixins: [popperMixin, emitter, Locale],
inject: ['elFormItem'], inject: {
elFormItem: {
default: ''
}
},
components: { components: {
ElInput ElInput

6
packages/checkbox/src/checkbox-button.vue
View File

@ -51,7 +51,11 @@
mixins: [Emitter], mixins: [Emitter],
inject: ['elFormItem'], inject: {
elFormItem: {
default: ''
}
},
data() { data() {
return { return {

6
packages/checkbox/src/checkbox-group.vue
View File

@ -8,7 +8,11 @@
mixins: [Emitter], mixins: [Emitter],
inject: ['elFormItem'], inject: {
elFormItem: {
default: ''
}
},
props: { props: {
value: {}, value: {},

6
packages/checkbox/src/checkbox.vue
View File

@ -60,7 +60,11 @@
mixins: [Emitter], mixins: [Emitter],
inject: ['elFormItem'], inject: {
elFormItem: {
default: ''
}
},
componentName: 'ElCheckbox', componentName: 'ElCheckbox',

6
packages/color-picker/src/main.vue
View File

@ -46,7 +46,11 @@
popperClass: String popperClass: String
}, },
inject: ['elFormItem'], inject: {
elFormItem: {
default: ''
}
},
directives: { Clickoutside }, directives: { Clickoutside },

2
packages/date-picker/src/panel/date.vue
View File

@ -192,8 +192,6 @@
if (this.currentView !== 'year' || this.currentView !== 'month') { if (this.currentView !== 'year' || this.currentView !== 'month') {
this.currentView = 'month'; this.currentView = 'month';
} }
} else if (newVal === 'week') {
this.week = getWeekNumber(this.date);
} }
} }
}, },

6
packages/date-picker/src/picker.vue
View File

@ -266,7 +266,11 @@ const valueEquals = function(a, b) {
export default { export default {
mixins: [Emitter, NewPopper, Focus('reference')], mixins: [Emitter, NewPopper, Focus('reference')],
inject: ['elFormItem'], inject: {
elFormItem: {
default: ''
}
},
props: { props: {
size: String, size: String,

2
packages/dropdown/src/dropdown.vue
View File

@ -134,7 +134,7 @@
{this.$slots.default} {this.$slots.default}
</el-button> </el-button>
<el-button ref="trigger" type={type} size={dropdownSize} class="el-dropdown__caret-button"> <el-button ref="trigger" type={type} size={dropdownSize} class="el-dropdown__caret-button">
<i class="el-dropdown__icon el-icon-caret-bottom"></i> <i class="el-dropdown__icon el-icon-arrow-down"></i>
</el-button> </el-button>
</el-button-group>); </el-button-group>);

19
packages/form/src/form-item.vue
View File

@ -1,11 +1,13 @@
<template> <template>
<div class="el-form-item" :class="{ <div class="el-form-item" :class="[{
'el-form-item--feedback': elForm && elForm.statusIcon, 'el-form-item--feedback': elForm && elForm.statusIcon,
'is-error': validateState === 'error', 'is-error': validateState === 'error',
'is-validating': validateState === 'validating', 'is-validating': validateState === 'validating',
'is-success': validateState === 'success', 'is-success': validateState === 'success',
'is-required': isRequired || required 'is-required': isRequired || required
}"> },
sizeClass ? 'el-form-item--' + sizeClass : ''
]">
<label :for="prop" class="el-form-item__label" v-bind:style="labelStyle" v-if="label || $slots.label"> <label :for="prop" class="el-form-item__label" v-bind:style="labelStyle" v-if="label || $slots.label">
<slot name="label">{{label + form.labelSuffix}}</slot> <slot name="label">{{label + form.labelSuffix}}</slot>
</label> </label>
@ -165,6 +167,9 @@
}, },
elFormItemSize() { elFormItemSize() {
return this.size || this._formSize; return this.size || this._formSize;
},
sizeClass() {
return (this.$ELEMENT || {}).size || this.elFormItemSize;
} }
}, },
data() { data() {

6
packages/input-number/src/input-number.vue
View File

@ -60,7 +60,11 @@
export default { export default {
name: 'ElInputNumber', name: 'ElInputNumber',
mixins: [Focus('input')], mixins: [Focus('input')],
inject: ['elFormItem'], inject: {
elFormItem: {
default: ''
}
},
directives: { directives: {
repeatClick: RepeatClick repeatClick: RepeatClick
}, },

6
packages/input/src/input.vue
View File

@ -85,7 +85,11 @@
mixins: [emitter, Focus('input')], mixins: [emitter, Focus('input')],
inject: ['elFormItem'], inject: {
elFormItem: {
default: ''
}
},
data() { data() {
return { return {

10
packages/loading/src/directive.js
View File

@ -105,13 +105,9 @@ exports.install = Vue => {
unbind: function(el, binding) { unbind: function(el, binding) {
if (el.domInserted) { if (el.domInserted) {
if (binding.modifiers.fullscreen || binding.modifiers.body) { el.mask &&
document.body.removeChild(el.mask); el.mask.parentNode &&
} else { el.mask.parentNode.removeChild(el.mask);
el.mask &&
el.mask.parentNode &&
el.mask.parentNode.removeChild(el.mask);
}
} }
} }
}); });

4
packages/pagination/src/pagination.js
View File

@ -214,7 +214,7 @@ export default {
const keyCode = event.keyCode || ''; const keyCode = event.keyCode || '';
if ((key && key === 'Enter') || (keyCode && keyCode === 13)) { if ((key && key === 'Enter') || (keyCode && keyCode === 13)) {
this.reassignMaxValue(event.target); this.reassignMaxValue(event.target);
this.handleChange({ target: event.target }); this.handleChange(event.target.value);
} }
}, },
handleChange(value) { handleChange(value) {
@ -239,7 +239,7 @@ export default {
value={ this.$parent.internalCurrentPage } value={ this.$parent.internalCurrentPage }
domPropsValue={ this.$parent.internalCurrentPage } domPropsValue={ this.$parent.internalCurrentPage }
type="number" type="number"
onChange={ this.handleChange } onInput={ this.handleChange }
onFocus={ this.handleFocus } onFocus={ this.handleFocus }
onBlur={ this.handleBlur } onBlur={ this.handleBlur }
nativeOnKeyup={ this.handleKeyUp }/> nativeOnKeyup={ this.handleKeyUp }/>

6
packages/radio/src/radio-button.vue
View File

@ -39,7 +39,11 @@
mixins: [Emitter], mixins: [Emitter],
inject: ['elFormItem'], inject: {
elFormItem: {
default: ''
}
},
props: { props: {
label: {}, label: {},

6
packages/radio/src/radio-group.vue
View File

@ -21,7 +21,11 @@
componentName: 'ElRadioGroup', componentName: 'ElRadioGroup',
inject: ['elFormItem'], inject: {
elFormItem: {
default: ''
}
},
mixins: [Emitter], mixins: [Emitter],

6
packages/radio/src/radio.vue
View File

@ -48,7 +48,11 @@
mixins: [Emitter], mixins: [Emitter],
inject: ['elFormItem'], inject: {
elFormItem: {
default: ''
}
},
componentName: 'ElRadio', componentName: 'ElRadio',

30
packages/rate/src/main.vue
View File

@ -1,24 +1,20 @@
<template> <template>
<div class="el-rate" <div
@keydown="handelKey" class="el-rate"
role="slider" @keydown="handelKey"
:aria-valuenow="currentValue" role="slider"
:aria-valuetext="text" :aria-valuenow="currentValue"
aria-valuemin="0" :aria-valuetext="text"
:aria-valuemin="max" aria-valuemin="0"
tabindex="0" :aria-valuemax="max"
@focus="focusing = true" tabindex="0">
@blur="focusing = false"
:class="{'focusing': focusing}"
>
<span <span
v-for="item in max" v-for="item in max"
class="el-rate__item" class="el-rate__item"
@mousemove="setCurrentValue(item, $event)" @mousemove="setCurrentValue(item, $event)"
@mouseleave="resetCurrentValue" @mouseleave="resetCurrentValue"
@click="selectValue(item)" @click="selectValue(item)"
:style="{ cursor: disabled ? 'auto' : 'pointer' }" :style="{ cursor: disabled ? 'auto' : 'pointer' }">
>
<i <i
:class="[classes[item - 1], { 'hover': hoverIndex === item }]" :class="[classes[item - 1], { 'hover': hoverIndex === item }]"
class="el-rate__icon" class="el-rate__icon"
@ -35,7 +31,7 @@
</div> </div>
</template> </template>
<script type="text/babel"> <script>
import { hasClass } from 'element-ui/src/utils/dom'; import { hasClass } from 'element-ui/src/utils/dom';
export default { export default {
@ -46,8 +42,7 @@
classMap: {}, classMap: {},
pointerAtLeftHalf: true, pointerAtLeftHalf: true,
currentValue: this.value, currentValue: this.value,
hoverIndex: -1, hoverIndex: -1
focusing: false
}; };
}, },
@ -250,7 +245,6 @@
this.$emit('input', value); this.$emit('input', value);
this.$emit('change', value); this.$emit('change', value);
} }
this.focusing = false;
}, },
handelKey(e) { handelKey(e) {

6
packages/select/src/select.vue
View File

@ -140,7 +140,11 @@
componentName: 'ElSelect', componentName: 'ElSelect',
inject: ['elFormItem'], inject: {
elFormItem: {
default: ''
}
},
provide() { provide() {
return { return {

3
packages/switch/src/component.vue
View File

@ -36,8 +36,11 @@
</div> </div>
</template> </template>
<script> <script>
import Focus from 'element-ui/src/mixins/focus';
export default { export default {
name: 'ElSwitch', name: 'ElSwitch',
mixins: [Focus('input')],
props: { props: {
value: { value: {
type: [Boolean, String, Number], type: [Boolean, String, Number],

2
packages/theme-chalk/src/common/var.scss
View File

@ -407,7 +407,7 @@ $--button-mini-border-radius: #{$--border-radius-base - 1};
$--button-mini-padding-vertical: 7px; $--button-mini-padding-vertical: 7px;
$--button-mini-padding-horizontal: 15px; $--button-mini-padding-horizontal: 15px;
$--button-default-color: $--color-text-primary; $--button-default-color: $--color-text-regular;
$--button-default-fill: $--color-white; $--button-default-fill: $--color-white;
$--button-default-border: $--border-color-base; $--button-default-border: $--border-color-base;

45
packages/theme-chalk/src/form.scss
View File

@ -47,18 +47,55 @@
display: none; display: none;
} }
@include m(medium) {
.el-form-item__label {
line-height: 36px;
}
.el-form-item__content {
line-height: 36px;
}
}
@include m(small) {
.el-form-item__label {
line-height: 32px;
}
.el-form-item__content {
line-height: 32px;
}
&.el-form-item {
margin-bottom: 18px;
}
.el-form-item__error {
padding-top: 2px;
}
}
@include m(mini) {
.el-form-item__label {
line-height: 28px;
}
.el-form-item__content {
line-height: 28px;
}
&.el-form-item {
margin-bottom: 18px;
}
.el-form-item__error {
padding-top: 1px;
}
}
@include e(label) { @include e(label) {
text-align: right; text-align: right;
vertical-align: middle; vertical-align: middle;
float: left; float: left;
font-size: 14px; font-size: 14px;
color: $--color-black; color: $--color-text-regular;
line-height: 1; line-height: 40px;
padding: 11px 12px 11px 0; padding: 0 12px 0 0;
box-sizing: border-box; box-sizing: border-box;
} }
@include e(content) { @include e(content) {
line-height: 36px; line-height: 40px;
position: relative; position: relative;
font-size: 14px; font-size: 14px;
@include utils-clearfix; @include utils-clearfix;

11
packages/theme-chalk/src/pagination.scss
View File

@ -22,7 +22,6 @@
} }
.el-input__inner { .el-input__inner {
font-weight: bold;
text-align: center; text-align: center;
} }
@ -108,6 +107,8 @@
@include e(sizes) { @include e(sizes) {
margin: 0 10px 0 0; margin: 0 10px 0 0;
font-weight: normal;
color: $--color-text-regular;
.el-input .el-input__inner { .el-input .el-input__inner {
font-size: $--pagination-font-size; font-size: $--pagination-font-size;
@ -121,10 +122,18 @@
@include e(total) { @include e(total) {
margin-right: 10px; margin-right: 10px;
font-weight: normal;
color: $--color-text-regular;
} }
@include e(jump) { @include e(jump) {
margin-left: 24px; margin-left: 24px;
font-weight: normal;
color: $--color-text-regular;
.el-input__inner {
padding: 0 3px;
}
} }
@include e(rightwrapper) { @include e(rightwrapper) {

2
packages/theme-chalk/src/rate.scss
View File

@ -5,7 +5,7 @@
height: $--rate-height; height: $--rate-height;
line-height: 1; line-height: 1;
&:focus:not(.focusing), &:active { &:focus, &:active {
outline-width: 0; outline-width: 0;
} }

3
packages/theme-chalk/src/switch.scss
View File

@ -47,8 +47,9 @@
width: 0; width: 0;
height: 0; height: 0;
opacity: 0; opacity: 0;
margin: 0;
&:focus ~ .el-switch__core { &:focus ~ .el-switch__core {
outline: 1px solid #f00; outline: 1px solid $--color-primary;
} }
} }

4
packages/theme-chalk/src/table.scss
View File

@ -138,6 +138,10 @@
border-bottom: $--table-border; border-bottom: $--table-border;
} }
th.is-sortable {
cursor: pointer;
}
th { th {
white-space: nowrap; white-space: nowrap;
overflow: hidden; overflow: hidden;

2
packages/upload/src/upload-list.vue
View File

@ -34,7 +34,7 @@
}"></i> }"></i>
</label> </label>
<i class="el-icon-close" v-if="!disabled" @click="$emit('remove', file)"></i> <i class="el-icon-close" v-if="!disabled" @click="$emit('remove', file)"></i>
<i class="el-icon-close-tip" v-if="!disabled">按delete键可删除</i> <!--因为close按钮只在li:focus的时候 display, li blur后就不存在了，所以键盘导航时永远无法 focus到 close按钮上--> <i class="el-icon-close-tip" v-if="!disabled">{{ t('el.upload.deleteTip') }}</i> <!--因为close按钮只在li:focus的时候 display, li blur后就不存在了，所以键盘导航时永远无法 focus到 close按钮上-->
<el-progress <el-progress
v-if="file.status === 'uploading'" v-if="file.status === 'uploading'"
:type="listType === 'picture-card' ? 'circle' : 'line'" :type="listType === 'picture-card' ? 'circle' : 'line'"

1
src/locale/lang/af-ZA.js
View File

@ -78,6 +78,7 @@ export default {
error: 'Ongeldige invoer' error: 'Ongeldige invoer'
}, },
upload: { upload: {
deleteTip: 'press delete to remove', // to be translated
delete: 'Verwyder', delete: 'Verwyder',
preview: 'Voorskou', preview: 'Voorskou',
continue: 'Gaan voort' continue: 'Gaan voort'

8
src/locale/lang/ar.js
View File

@ -95,10 +95,10 @@ export default {
transfer: { transfer: {
noMatch: 'لايوجد بيانات مطابقة', noMatch: 'لايوجد بيانات مطابقة',
noData: 'لايوجد بيانات', noData: 'لايوجد بيانات',
titles: ['قائمة 1', 'قائمة 2'], // to be translated titles: ['قائمة 1', 'قائمة 2'],
filterPlaceholder: 'ادخل كلمة', // to be translated filterPlaceholder: 'ادخل كلمة',
noCheckedFormat: '{total} عناصر', // to be translated noCheckedFormat: '{total} عناصر',
hasCheckedFormat: '{checked}/{total} مختار' // to be translated hasCheckedFormat: '{checked}/{total} مختار'
} }
} }
}; };

1
src/locale/lang/bg.js
View File

@ -78,6 +78,7 @@ export default {
error: 'Невалидни данни' error: 'Невалидни данни'
}, },
upload: { upload: {
deleteTip: 'press delete to remove', // to be translated
delete: 'Изтрий', delete: 'Изтрий',
preview: 'Прегледай', preview: 'Прегледай',
continue: 'Продължи' continue: 'Продължи'

1
src/locale/lang/ca.js
View File

@ -77,6 +77,7 @@ export default {
error: 'Entrada invàlida' error: 'Entrada invàlida'
}, },
upload: { upload: {
deleteTip: 'press delete to remove', // to be translated
delete: 'Eliminar', delete: 'Eliminar',
preview: 'Vista Prèvia', preview: 'Vista Prèvia',
continue: 'Continuar' continue: 'Continuar'

1
src/locale/lang/cz.js
View File

@ -80,6 +80,7 @@ export default {
error: 'Neplatný vstup' error: 'Neplatný vstup'
}, },
upload: { upload: {
deleteTip: 'press delete to remove', // to be translated
delete: 'Vymazat', delete: 'Vymazat',
preview: 'Náhled', preview: 'Náhled',
continue: 'Pokračovat' continue: 'Pokračovat'

1
src/locale/lang/da.js
View File

@ -77,6 +77,7 @@ export default {
error: 'Ugyldig input' error: 'Ugyldig input'
}, },
upload: { upload: {
deleteTip: 'press delete to remove', // to be translated
delete: 'Slet', delete: 'Slet',
preview: 'Forhåndsvisning', preview: 'Forhåndsvisning',
continue: 'Fortsæt' continue: 'Fortsæt'

1
src/locale/lang/de.js
View File

@ -79,6 +79,7 @@ export default {
error: 'Fehler' error: 'Fehler'
}, },
upload: { upload: {
deleteTip: 'press delete to remove', // to be translated
delete: 'Löschen', delete: 'Löschen',
preview: 'Vorschau', preview: 'Vorschau',
continue: 'Fortsetzen' continue: 'Fortsetzen'

1
src/locale/lang/ee.js
View File

@ -78,6 +78,7 @@ export default {
error: 'Vigane sisend' error: 'Vigane sisend'
}, },
upload: { upload: {
deleteTip: 'press delete to remove', // to be translated
delete: 'Kustuta', delete: 'Kustuta',
preview: 'Eelvaate', preview: 'Eelvaate',
continue: 'Jätka' continue: 'Jätka'

1
src/locale/lang/el.js
View File

@ -78,6 +78,7 @@ export default {
error: 'Άκυρη εισαγωγή' error: 'Άκυρη εισαγωγή'
}, },
upload: { upload: {
deleteTip: 'press delete to remove', // to be translated
delete: 'Διαγραφή', delete: 'Διαγραφή',
preview: 'Προεπισκόπηση', preview: 'Προεπισκόπηση',
continue: 'Συνέχεια' continue: 'Συνέχεια'

1
src/locale/lang/en.js
View File

@ -78,6 +78,7 @@ export default {
error: 'Illegal input' error: 'Illegal input'
}, },
upload: { upload: {
deleteTip: 'press delete to remove',
delete: 'Delete', delete: 'Delete',
preview: 'Preview', preview: 'Preview',
continue: 'Continue' continue: 'Continue'

1
src/locale/lang/es.js
View File

@ -77,6 +77,7 @@ export default {
error: 'Entrada inválida' error: 'Entrada inválida'
}, },
upload: { upload: {
deleteTip: 'press delete to remove', // to be translated
delete: 'Eliminar', delete: 'Eliminar',
preview: 'Vista Previa', preview: 'Vista Previa',
continue: 'Continuar' continue: 'Continuar'

1
src/locale/lang/fa.js
View File

@ -78,6 +78,7 @@ export default {
error: 'ورودی غیر مجاز' error: 'ورودی غیر مجاز'
}, },
upload: { upload: {
deleteTip: 'press delete to remove', // to be translated
delete: 'حذف', delete: 'حذف',
preview: 'پیش‌نمایش', preview: 'پیش‌نمایش',
continue: 'ادهمه' continue: 'ادهمه'

1
src/locale/lang/fi.js
View File

@ -78,6 +78,7 @@ export default {
error: 'Virheellinen syöte' error: 'Virheellinen syöte'
}, },
upload: { upload: {
deleteTip: 'press delete to remove', // to be translated
delete: 'Poista', delete: 'Poista',
preview: 'Esikatsele', preview: 'Esikatsele',
continue: 'Jatka' continue: 'Jatka'

1
src/locale/lang/fr.js
View File

@ -77,6 +77,7 @@ export default {
error: 'Erreur' error: 'Erreur'
}, },
upload: { upload: {
deleteTip: 'press delete to remove', // to be translated
delete: 'Supprimer', delete: 'Supprimer',
preview: 'Aperçu', preview: 'Aperçu',
continue: 'Continuer' continue: 'Continuer'

1
src/locale/lang/he.js
View File

@ -78,6 +78,7 @@ export default {
error: 'קלט לא תקין' error: 'קלט לא תקין'
}, },
upload: { upload: {
deleteTip: 'press delete to remove', // to be translated
delete: 'מחק', delete: 'מחק',
preview: 'תצוגה מקדימה', preview: 'תצוגה מקדימה',
continue: 'המשך' continue: 'המשך'

1
src/locale/lang/id.js
View File

@ -78,6 +78,7 @@ export default {
error: 'Masukan ilegal' error: 'Masukan ilegal'
}, },
upload: { upload: {
deleteTip: 'press delete to remove', // to be translated
delete: 'Hapus', delete: 'Hapus',
preview: 'Pratinjau', preview: 'Pratinjau',
continue: 'Lanjutkan' continue: 'Lanjutkan'

1
src/locale/lang/it.js
View File

@ -77,6 +77,7 @@ export default {
error: 'Input non valido' error: 'Input non valido'
}, },
upload: { upload: {
deleteTip: 'press delete to remove', // to be translated
delete: 'Cancella', delete: 'Cancella',
preview: 'Anteprima', preview: 'Anteprima',
continue: 'Continua' continue: 'Continua'

1
src/locale/lang/ja.js
View File

@ -78,6 +78,7 @@ export default {
error: '正しくない入力' error: '正しくない入力'
}, },
upload: { upload: {
deleteTip: 'press delete to remove', // to be translated
delete: '削除する', delete: '削除する',
preview: 'プレビュー', preview: 'プレビュー',
continue: '続行する' continue: '続行する'

1
src/locale/lang/ko.js
View File

@ -78,6 +78,7 @@ export default {
error: '올바르지 않은 입력' error: '올바르지 않은 입력'
}, },
upload: { upload: {
deleteTip: 'press delete to remove', // to be translated
delete: '삭제', delete: '삭제',
preview: '미리보기', preview: '미리보기',
continue: '계속하기' continue: '계속하기'

1
src/locale/lang/lv.js
View File

@ -78,6 +78,7 @@ export default {
error: 'Nederīga ievade' error: 'Nederīga ievade'
}, },
upload: { upload: {
deleteTip: 'press delete to remove', // to be translated
delete: 'Dzēst', delete: 'Dzēst',
preview: 'Priekšskatīt', preview: 'Priekšskatīt',
continue: 'Turpināt' continue: 'Turpināt'

1
src/locale/lang/nb-NO.js
View File

@ -77,6 +77,7 @@ export default {
error: 'Ugyldig input' error: 'Ugyldig input'
}, },
upload: { upload: {
deleteTip: 'press delete to remove', // to be translated
delete: 'Slett', delete: 'Slett',
preview: 'Forhåndsvisning', preview: 'Forhåndsvisning',
continue: 'Fortsett' continue: 'Fortsett'

1
src/locale/lang/nl.js
View File

@ -78,6 +78,7 @@ export default {
error: 'Ongeldige invoer' error: 'Ongeldige invoer'
}, },
upload: { upload: {
deleteTip: 'press delete to remove', // to be translated
delete: 'Verwijder', delete: 'Verwijder',
preview: 'Voorbeeld', preview: 'Voorbeeld',
continue: 'Doorgaan' continue: 'Doorgaan'

1
src/locale/lang/pl.js
View File

@ -78,6 +78,7 @@ export default {
error: 'Wiadomość zawiera niedozwolone znaki' error: 'Wiadomość zawiera niedozwolone znaki'
}, },
upload: { upload: {
deleteTip: 'press delete to remove', // to be translated
delete: 'Kasuj', delete: 'Kasuj',
preview: 'Podgląd', preview: 'Podgląd',
continue: 'Kontynuuj' continue: 'Kontynuuj'

1
src/locale/lang/pt-br.js
View File

@ -78,6 +78,7 @@ export default {
error: 'Erro!' error: 'Erro!'
}, },
upload: { upload: {
deleteTip: 'press delete to remove', // to be translated
delete: 'Apagar', delete: 'Apagar',
preview: 'Pré-visualizar', preview: 'Pré-visualizar',
continue: 'Continuar' continue: 'Continuar'

1
src/locale/lang/pt.js
View File

@ -78,6 +78,7 @@ export default {
error: 'Erro!' error: 'Erro!'
}, },
upload: { upload: {
deleteTip: 'press delete to remove', // to be translated
delete: 'Apagar', delete: 'Apagar',
preview: 'Previsualizar', preview: 'Previsualizar',
continue: 'Continuar' continue: 'Continuar'

1
src/locale/lang/ru-RU.js
View File

@ -78,6 +78,7 @@ export default {
error: 'Недопустимый ввод данных' error: 'Недопустимый ввод данных'
}, },
upload: { upload: {
deleteTip: 'press delete to remove', // to be translated
delete: 'Удалить', delete: 'Удалить',
preview: 'Превью', preview: 'Превью',
continue: 'Продолжить' continue: 'Продолжить'

1
src/locale/lang/sk.js
View File

@ -80,6 +80,7 @@ export default {
error: 'Neplatný vstup' error: 'Neplatný vstup'
}, },
upload: { upload: {
deleteTip: 'press delete to remove', // to be translated
delete: 'Vymazať', delete: 'Vymazať',
preview: 'Prehliadať', preview: 'Prehliadať',
continue: 'Pokračovať' continue: 'Pokračovať'

1
src/locale/lang/sl.js
View File

@ -78,6 +78,7 @@ export default {
error: 'Nedovoljen vnos' error: 'Nedovoljen vnos'
}, },
upload: { upload: {
deleteTip: 'press delete to remove', // to be translated
delete: 'Izbriši', delete: 'Izbriši',
preview: 'Predogled', preview: 'Predogled',
continue: 'Nadaljuj' continue: 'Nadaljuj'

1
src/locale/lang/sv-SE.js
View File

@ -78,6 +78,7 @@ export default {
error: 'Felaktig inmatning' error: 'Felaktig inmatning'
}, },
upload: { upload: {
deleteTip: 'press delete to remove', // to be translated
delete: 'Radera', delete: 'Radera',
preview: 'Förhandsvisa', preview: 'Förhandsvisa',
continue: 'Fortsätt' continue: 'Fortsätt'

5
src/locale/lang/ta.js
View File

@ -77,6 +77,7 @@ export default {
error: 'பொருத்தாமில்லாத உள்ளீடு' error: 'பொருத்தாமில்லாத உள்ளீடு'
}, },
upload: { upload: {
deleteTip: 'press delete to remove', // to be translated
delete: 'நீக்கு', delete: 'நீக்கு',
preview: 'முன்னோட்டம் பார்', preview: 'முன்னோட்டம் பார்',
continue: 'தொடரு' continue: 'தொடரு'
@ -96,8 +97,8 @@ export default {
noData: 'தரவு இல்லை', noData: 'தரவு இல்லை',
titles: ['பட்டியல் 1', 'பட்டியல் 2'], titles: ['பட்டியல் 1', 'பட்டியல் 2'],
filterPlaceholder: 'சொல்லை உள்ளீடு செய்', filterPlaceholder: 'சொல்லை உள்ளீடு செய்',
noCheckedFormat: '{மொத்தம்} items', noCheckedFormat: '{total} items', // to be translated
hasCheckedFormat: '{தேர்வு செய்யப்பட்டவைகள்}/{மொத்தம்} தேர்வு செய்யப்பட்டவைகள்' hasCheckedFormat: '{checked}/{total} தேர்வு செய்யப்பட்டவைகள்'
} }
} }
}; };

1
src/locale/lang/th.js
View File

@ -78,6 +78,7 @@ export default {
error: 'คุณป้อนข้อมูลไม่ถูกต้อง' error: 'คุณป้อนข้อมูลไม่ถูกต้อง'
}, },
upload: { upload: {
deleteTip: 'press delete to remove', // to be translated
delete: 'ลบ', delete: 'ลบ',
preview: 'ตัวอย่าง', preview: 'ตัวอย่าง',
continue: 'ทำต่อ' continue: 'ทำต่อ'

1
src/locale/lang/tk.js
View File

@ -78,6 +78,7 @@ export default {
error: 'Ýalňyş girizme' error: 'Ýalňyş girizme'
}, },
upload: { upload: {
deleteTip: 'press delete to remove', // to be translated
delete: 'Poz', delete: 'Poz',
preview: 'Gör', preview: 'Gör',
continue: 'Dowam et' continue: 'Dowam et'

1
src/locale/lang/tr-TR.js
View File

@ -78,6 +78,7 @@ export default {
error: 'İllegal giriş' error: 'İllegal giriş'
}, },
upload: { upload: {
deleteTip: 'press delete to remove', // to be translated
delete: 'Sil', delete: 'Sil',
preview: 'Görüntüle', preview: 'Görüntüle',
continue: 'Devam' continue: 'Devam'

1
src/locale/lang/ua.js
View File

@ -78,6 +78,7 @@ export default {
error: 'Неприпустимий ввід даних' error: 'Неприпустимий ввід даних'
}, },
upload: { upload: {
deleteTip: 'press delete to remove', // to be translated
delete: 'Видалити', delete: 'Видалити',
preview: 'Перегляд', preview: 'Перегляд',
continue: 'Продовжити' continue: 'Продовжити'

1
src/locale/lang/vi.js
View File

@ -78,6 +78,7 @@ export default {
error: 'Dữ liệu không hợp lệ' error: 'Dữ liệu không hợp lệ'
}, },
upload: { upload: {
deleteTip: 'press delete to remove', // to be translated
delete: 'Xóa', delete: 'Xóa',
preview: 'Xem trước', preview: 'Xem trước',
continue: 'Tiếp tục' continue: 'Tiếp tục'

1
src/locale/lang/zh-CN.js
View File

@ -78,6 +78,7 @@ export default {
error: '输入的数据不合法!' error: '输入的数据不合法!'
}, },
upload: { upload: {
deleteTip: '按delete键可删除',
delete: '删除', delete: '删除',
preview: '查看图片', preview: '查看图片',
continue: '继续上传' continue: '继续上传'

1
src/locale/lang/zh-TW.js
View File

@ -78,6 +78,7 @@ export default {
error: '輸入的資料不符規定!' error: '輸入的資料不符規定!'
}, },
upload: { upload: {
deleteTip: '按delete鍵可刪除',
delete: '刪除', delete: '刪除',
preview: '查看圖片', preview: '查看圖片',
continue: '繼續上傳' continue: '繼續上傳'

1
src/utils/resize-event.js
View File

@ -177,6 +177,7 @@ export const addResizeListener = function(element, fn) {
/* istanbul ignore next */ /* istanbul ignore next */
export const removeResizeListener = function(element, fn) { export const removeResizeListener = function(element, fn) {
if (!element || !element.__resizeListeners__) return;
if (attachEvent) { if (attachEvent) {
element.detachEvent('onresize', fn); element.detachEvent('onresize', fn);
} else { } else {

2
test/unit/karma.conf.js
View File

@ -1,7 +1,7 @@
var webpackConfig = require('../../build/cooking.test'); var webpackConfig = require('../../build/cooking.test');
// no need for app entry during tests // no need for app entry during tests
delete webpackConfig.entry; // delete webpackConfig.entry;
module.exports = function(config) { module.exports = function(config) {
config.set({ config.set({

20
test/unit/specs/carousel.spec.js
View File

@ -11,7 +11,7 @@ describe('Carousel', () => {
template: ` template: `
<div> <div>
<el-carousel> <el-carousel>
<el-carousel-item v-for="item in 3"></el-carousel-item> <el-carousel-item v-for="item in 3" :key="item"></el-carousel-item>
</el-carousel> </el-carousel>
</div> </div>
` `
@ -24,7 +24,7 @@ describe('Carousel', () => {
template: ` template: `
<div> <div>
<el-carousel :interval="50"> <el-carousel :interval="50">
<el-carousel-item v-for="item in 3"></el-carousel-item> <el-carousel-item v-for="item in 3" :key="item"></el-carousel-item>
</el-carousel> </el-carousel>
</div> </div>
` `
@ -45,7 +45,7 @@ describe('Carousel', () => {
template: ` template: `
<div> <div>
<el-carousel :autoplay="false" :initial-index="1"> <el-carousel :autoplay="false" :initial-index="1">
<el-carousel-item v-for="item in 3"></el-carousel-item> <el-carousel-item v-for="item in 3" :key="item"></el-carousel-item>
</el-carousel> </el-carousel>
</div> </div>
` `
@ -62,7 +62,7 @@ describe('Carousel', () => {
template: ` template: `
<div> <div>
<el-carousel :interval="20"> <el-carousel :interval="20">
<el-carousel-item v-for="item in 3"></el-carousel-item> <el-carousel-item v-for="item in 3" :key="item"></el-carousel-item>
</el-carousel> </el-carousel>
</div> </div>
` `
@ -88,7 +88,7 @@ describe('Carousel', () => {
template: ` template: `
<div> <div>
<el-carousel :interval="50" @change="handleChange"> <el-carousel :interval="50" @change="handleChange">
<el-carousel-item v-for="item in 3"></el-carousel-item> <el-carousel-item v-for="item in 3" :key="item"></el-carousel-item>
</el-carousel> </el-carousel>
</div> </div>
`, `,
@ -135,7 +135,7 @@ describe('Carousel', () => {
template: ` template: `
<div> <div>
<el-carousel :autoplay="false"> <el-carousel :autoplay="false">
<el-carousel-item v-for="item in 3"></el-carousel-item> <el-carousel-item v-for="item in 3" :key="item"></el-carousel-item>
</el-carousel> </el-carousel>
</div> </div>
` `
@ -155,7 +155,7 @@ describe('Carousel', () => {
template: ` template: `
<div> <div>
<el-carousel :autoplay="false" trigger="click" ref="carousel"> <el-carousel :autoplay="false" trigger="click" ref="carousel">
<el-carousel-item v-for="item in 3"></el-carousel-item> <el-carousel-item v-for="item in 3" :key="item"></el-carousel-item>
</el-carousel> </el-carousel>
</div> </div>
` `
@ -184,7 +184,7 @@ describe('Carousel', () => {
template: ` template: `
<div> <div>
<el-carousel :autoplay="false"> <el-carousel :autoplay="false">
<el-carousel-item v-for="item in 3"></el-carousel-item> <el-carousel-item v-for="item in 3" :key="item"></el-carousel-item>
</el-carousel> </el-carousel>
</div> </div>
` `
@ -204,7 +204,7 @@ describe('Carousel', () => {
template: ` template: `
<div> <div>
<el-carousel :autoplay="false"> <el-carousel :autoplay="false">
<el-carousel-item v-for="item in 3"></el-carousel-item> <el-carousel-item v-for="item in 3" :key="item"></el-carousel-item>
</el-carousel> </el-carousel>
</div> </div>
` `
@ -230,7 +230,7 @@ describe('Carousel', () => {
template: ` template: `
<div> <div>
<el-carousel :autoplay="false" type="card"> <el-carousel :autoplay="false" type="card">
<el-carousel-item v-for="item in 7"></el-carousel-item> <el-carousel-item v-for="item in 7" :key="item"></el-carousel-item>
</el-carousel> </el-carousel>
</div> </div>
` `

32
test/unit/specs/radio.spec.js
View File

@ -21,10 +21,10 @@ describe('Radio', () => {
let radioElm = vm.$el; let radioElm = vm.$el;
expect(radioElm.classList.contains('el-radio')).to.be.true; expect(radioElm.classList.contains('el-radio')).to.be.true;
radioElm.click(); radioElm.click();
vm.$nextTick(_ => { setTimeout(_ => {
expect(radioElm.querySelector('.is-checked')).to.be.ok; expect(radioElm.querySelector('.is-checked')).to.be.ok;
done(); done();
}); }, 10);
}); });
it('disabled', done => { it('disabled', done => {
vm = createVue({ vm = createVue({
@ -44,11 +44,11 @@ describe('Radio', () => {
}, true); }, true);
let radioElm = vm.$el; let radioElm = vm.$el;
radioElm.click(); radioElm.click();
vm.$nextTick(_ => { setTimeout(_ => {
expect(vm.radio === '').to.be.true; expect(vm.radio === '').to.be.true;
expect(radioElm.querySelector('.is-disabled')).to.be.ok; expect(radioElm.querySelector('.is-disabled')).to.be.ok;
done(); done();
}); }, 10);
}); });
it('change event', done => { it('change event', done => {
vm = createVue({ vm = createVue({
@ -127,11 +127,11 @@ describe('Radio', () => {
expect(vm.$refs.radio1.$el.querySelector('.is-checked')).to.be.ok; expect(vm.$refs.radio1.$el.querySelector('.is-checked')).to.be.ok;
let radioElm = vm.$refs.radio2.$el; let radioElm = vm.$refs.radio2.$el;
radioElm.click(); radioElm.click();
vm.$nextTick(_ => { setTimeout(_ => {
expect(radioElm.querySelector('.is-checked')).to.be.ok; expect(radioElm.querySelector('.is-checked')).to.be.ok;
expect(vm.radio === 6).to.be.true; expect(vm.radio === 6).to.be.true;
done(); done();
}); }, 10);
}, 50); }, 50);
}); });
it('disabled', done => { it('disabled', done => {
@ -153,11 +153,11 @@ describe('Radio', () => {
expect(vm.$el.querySelectorAll('label.is-disabled').length).to.be.equal(3); expect(vm.$el.querySelectorAll('label.is-disabled').length).to.be.equal(3);
expect(vm.$refs.radio1.$el.querySelector('.is-checked')).to.be.exist; expect(vm.$refs.radio1.$el.querySelector('.is-checked')).to.be.exist;
radio2.$el.click(); radio2.$el.click();
vm.$nextTick(_ => { setTimeout(_ => {
expect(vm.radio === 3).to.be.true; expect(vm.radio === 3).to.be.true;
expect(vm.$refs.radio1.$el.querySelector('.is-checked')).to.be.exist; expect(vm.$refs.radio1.$el.querySelector('.is-checked')).to.be.exist;
done(); done();
}); }, 10);
}); });
it('change event', done => { it('change event', done => {
vm = createVue({ vm = createVue({
@ -233,11 +233,11 @@ describe('Radio', () => {
expect(vm.$el.querySelectorAll('.is-disabled').length).to.be.equal(3); expect(vm.$el.querySelectorAll('.is-disabled').length).to.be.equal(3);
expect(vm.$refs.radio1.$el.classList.contains('is-active')).to.be.true; expect(vm.$refs.radio1.$el.classList.contains('is-active')).to.be.true;
radio2.$el.click(); radio2.$el.click();
vm.$nextTick(_ => { setTimeout(_ => {
expect(vm.radio === 3).to.be.true; expect(vm.radio === 3).to.be.true;
expect(vm.$refs.radio1.$el.classList.contains('is-active')).to.be.true; expect(vm.$refs.radio1.$el.classList.contains('is-active')).to.be.true;
done(); done();
}); }, 10);
}); });
describe('Radio Button', () => { describe('Radio Button', () => {
it('create', done => { it('create', done => {
@ -258,11 +258,11 @@ describe('Radio', () => {
expect(vm.$refs.radio1.$el.classList.contains('is-active')).to.be.true; expect(vm.$refs.radio1.$el.classList.contains('is-active')).to.be.true;
let radio = vm.$refs.radio2; let radio = vm.$refs.radio2;
radio.$el.click(); radio.$el.click();
vm.$nextTick(_ => { setTimeout(_ => {
expect(radio.$el.classList.contains('is-active')).to.be.true; expect(radio.$el.classList.contains('is-active')).to.be.true;
expect(vm.radio === 6).to.be.true; expect(vm.radio === 6).to.be.true;
done(); done();
}); }, 10);
}); });
it('custom color', done => { it('custom color', done => {
vm = createVue({ vm = createVue({
@ -279,12 +279,12 @@ describe('Radio', () => {
}; };
} }
}, true); }, true);
vm.$nextTick(_ => { setTimeout(_ => {
expect(vm.$refs.radio1.activeStyle.backgroundColor).to.equal('#000'); expect(vm.$refs.radio1.activeStyle.backgroundColor).to.equal('#000');
expect(vm.$refs.radio1.activeStyle.borderColor).to.equal('#000'); expect(vm.$refs.radio1.activeStyle.borderColor).to.equal('#000');
expect(vm.$refs.radio1.activeStyle.color).to.equal('#ff0'); expect(vm.$refs.radio1.activeStyle.color).to.equal('#ff0');
done(); done();
}); }, 10);
}); });
it('change event', done => { it('change event', done => {
vm = createVue({ vm = createVue({
@ -356,10 +356,10 @@ describe('Radio', () => {
}; };
} }
}, true); }, true);
vm.$nextTick(_ => { setTimeout(_ => {
expect(vm.$el.querySelectorAll('.el-radio-button--large').length).to.be.equal(3); expect(vm.$el.querySelectorAll('.el-radio-button--large').length).to.be.equal(3);
done(); done();
}); }, 10);
}); });
}); });
}); });

2
test/unit/specs/table.spec.js
View File

@ -977,7 +977,7 @@ describe('Table', () => {
template: ` template: `
<el-table row-key="id" :data="testData" @expand="handleExpand" ${extra}> <el-table row-key="id" :data="testData" @expand="handleExpand" ${extra}>
<el-table-column type="expand"> <el-table-column type="expand">
<template scope="props"> <template slot-scope="props">
<div>{{props.row.name}}</div> <div>{{props.row.name}}</div>
</template> </template>
</el-table-column> </el-table-column>

4
test/unit/specs/tabs.spec.js
View File

@ -106,7 +106,7 @@ describe('Tabs', () => {
vm = createVue({ vm = createVue({
template: ` template: `
<el-tabs type="card" ref="tabs"> <el-tabs type="card" ref="tabs">
<el-tab-pane :label="tab.label" :name="tab.name" v-for="tab in tabs">Test Content</el-tab-pane> <el-tab-pane :label="tab.label" :name="tab.name" v-for="tab in tabs" :key="tab.name">Test Content</el-tab-pane>
</el-tabs> </el-tabs>
`, `,
data() { data() {
@ -146,6 +146,7 @@ describe('Tabs', () => {
<el-tabs ref="tabs" v-model="editableTabsValue" type="card" editable @edit="handleTabsEdit"> <el-tabs ref="tabs" v-model="editableTabsValue" type="card" editable @edit="handleTabsEdit">
<el-tab-pane <el-tab-pane
v-for="(item, index) in editableTabs" v-for="(item, index) in editableTabs"
:key="item.name"
:label="item.title" :label="item.title"
:name="item.name" :name="item.name"
> >
@ -238,6 +239,7 @@ describe('Tabs', () => {
<el-tab-pane <el-tab-pane
v-for="(item, index) in editableTabs" v-for="(item, index) in editableTabs"
:label="item.title" :label="item.title"
:key="item.name"
:name="item.name" :name="item.name"
> >
{{item.content}} {{item.content}}

1400
yarn.lock
View File

File diff suppressed because it is too large Load Diff