mirror of https://github.com/ElemeFE/element
Chore: misc updates
parent
6497e8c1c1
commit
4a7f3c82ad
|
@ -45,7 +45,7 @@
|
|||
background-color: #303133;
|
||||
}
|
||||
.bg-text-regular {
|
||||
background-color: #303133;
|
||||
background-color: #606266;
|
||||
}
|
||||
.bg-text-secondary {
|
||||
background-color: #909399;
|
||||
|
@ -112,7 +112,7 @@ Neutral colors are for text, background and border colors. You can use different
|
|||
<el-col :span="6">
|
||||
<div class="demo-color-box-group">
|
||||
<div class="demo-color-box bg-text-primary">Primary Text<div class="value">#303133</div></div>
|
||||
<div class="demo-color-box bg-text-regular">Regular Text<div class="value">#303133</div></div>
|
||||
<div class="demo-color-box bg-text-regular">Regular Text<div class="value">#606266</div></div>
|
||||
<div class="demo-color-box bg-text-secondary">Secondary Text<div class="value">#909399</div></div>
|
||||
<div class="demo-color-box bg-text-placeholder">Placeholder Text<div class="value">#C0C4CC</div></div>
|
||||
</div>
|
||||
|
|
|
@ -213,4 +213,4 @@ Currently Element ships with the following languages:
|
|||
<li>Hungarian (hu)</li>
|
||||
</ul>
|
||||
|
||||
If your target language is not included, you are more than welcome to contribute: just add another language config [here](https://github.com/ElemeFE/element/tree/master/src/locale/lang) and create a pull request.
|
||||
If your target language is not included, you are more than welcome to contribute: just add another language config [here](https://github.com/ElemeFE/element/tree/dev/src/locale/lang) and create a pull request.
|
||||
|
|
|
@ -614,7 +614,7 @@ Enter keywords and search data from server.
|
|||
|
||||
### Create new items
|
||||
Create and select new items that are not included in select options
|
||||
:::demo By using the `allow-create` attribute, users can create new items by typing in the input box. Note that for `allow-create` to work, `filterable` must be `true`.
|
||||
:::demo By using the `allow-create` attribute, users can create new items by typing in the input box. Note that for `allow-create` to work, `filterable` must be `true`. This example also demonstrates `default-first-option`. When this attribute is set to `true`, you can select the first option in the current option list by hitting enter without having to navigate with mouse or arrow keys.
|
||||
```html
|
||||
<template>
|
||||
<el-select
|
||||
|
@ -622,6 +622,7 @@ Create and select new items that are not included in select options
|
|||
multiple
|
||||
filterable
|
||||
allow-create
|
||||
default-first-option
|
||||
placeholder="Choose tags for your article">
|
||||
<el-option
|
||||
v-for="item in options5"
|
||||
|
|
|
@ -117,14 +117,8 @@
|
|||
handleExceed(files, fileList) {
|
||||
this.$message.warning(`You can upload up to 3 files. You selected ${files.length} files this time, and ${files.length + fileList.length} files totally`);
|
||||
},
|
||||
handleBeforeRemove(file, fileList) {
|
||||
return new Promise((resolve, reject) => {
|
||||
if (confirm('It looks good, are you sure to remove?')) {
|
||||
resolve();
|
||||
} else {
|
||||
reject();
|
||||
}
|
||||
});
|
||||
beforeRemove(file, fileList) {
|
||||
return this.$confirm(`确定移除 ${ file.name }?`);
|
||||
}
|
||||
}
|
||||
}
|
||||
|
@ -135,14 +129,14 @@ Upload files by clicking or drag-and-drop
|
|||
|
||||
### Click to upload files
|
||||
|
||||
:::demo Customize upload button type and text using `slot`. Set `limit` and `on-exceed` to limit the maximum number of uploads allowed and specify method when the limit is exceeded. Set `before-remove` is able to abort the remove operation.
|
||||
:::demo Customize upload button type and text using `slot`. Set `limit` and `on-exceed` to limit the maximum number of uploads allowed and specify method when the limit is exceeded. Plus, you can abort removing a file in the `before-remove` hook.
|
||||
```html
|
||||
<el-upload
|
||||
class="upload-demo"
|
||||
action="https://jsonplaceholder.typicode.com/posts/"
|
||||
:on-preview="handlePreview"
|
||||
:on-remove="handleRemove"
|
||||
:before-remove="handleBeforeRemove"
|
||||
:before-remove="beforeRemove"
|
||||
multiple
|
||||
:limit="3"
|
||||
:on-exceed="handleExceed"
|
||||
|
@ -167,14 +161,8 @@ Upload files by clicking or drag-and-drop
|
|||
handleExceed(files, fileList) {
|
||||
this.$message.warning(`The limit is 3, you selected ${files.length} files this time, add up to ${files.length + fileList.length} totally`);
|
||||
},
|
||||
handleBeforeRemove(file, fileList) {
|
||||
return new Promise((resolve, reject) => {
|
||||
if (confirm('It looks good, are you sure to remove?')) {
|
||||
resolve();
|
||||
} else {
|
||||
reject();
|
||||
}
|
||||
});
|
||||
beforeRemove(file, fileList) {
|
||||
return this.$confirm(`确定移除 ${ file.name }?`);
|
||||
}
|
||||
}
|
||||
}
|
||||
|
@ -429,7 +417,7 @@ on-error | hook function when some errors occurs | function(err, file, fileList)
|
|||
on-progress | hook function when some progress occurs | function(event, 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-remove | hook function before removing a file with the file and file list as its parameters. If `false` is returned or a `Promise` is returned and then is rejected, remove will be aborted. | function(file, fileList) | — | — |
|
||||
before-remove | hook function before removing a file with the file and file list as its parameters. If `false` is returned or a `Promise` is returned and then is rejected, removing will be aborted. | function(file, fileList) | — | — |
|
||||
thumbnail-mode | whether thumbnail is displayed | boolean | — | false
|
||||
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 |
|
||||
|
|
|
@ -45,7 +45,7 @@
|
|||
background-color: #303133;
|
||||
}
|
||||
.bg-text-regular {
|
||||
background-color: #303133;
|
||||
background-color: #606266;
|
||||
}
|
||||
.bg-text-secondary {
|
||||
background-color: #909399;
|
||||
|
@ -112,7 +112,7 @@ Los colores neutrales son para texto, fondos y bordes. Puede usar diferentes col
|
|||
<el-col :span="6">
|
||||
<div class="demo-color-box-group">
|
||||
<div class="demo-color-box bg-text-primary">Texto primario<div class="value">#303133</div></div>
|
||||
<div class="demo-color-box bg-text-regular">Texto regular<div class="value">#303133</div></div>
|
||||
<div class="demo-color-box bg-text-regular">Texto regular<div class="value">#606266</div></div>
|
||||
<div class="demo-color-box bg-text-secondary">Texto secundario<div class="value">#909399</div></div>
|
||||
<div class="demo-color-box bg-text-placeholder">Texto de placeholder<div class="value">#C0C4CC</div></div>
|
||||
</div>
|
||||
|
|
|
@ -213,4 +213,4 @@ Actualmente Element está disponible en los siguientes idiomas:
|
|||
<li>Hungarian (hu)</li>
|
||||
</ul>
|
||||
|
||||
Si su idioma de destino no está incluido, puede contribuir: simplemente añada [aqui](https://github.com/ElemeFE/element/tree/master/src/locale/lang) otra configuración de idioma y cree un pull request.
|
||||
Si su idioma de destino no está incluido, puede contribuir: simplemente añada [aqui](https://github.com/ElemeFE/element/tree/dev/src/locale/lang) otra configuración de idioma y cree un pull request.
|
|
@ -225,4 +225,4 @@ ElementLocale.i18n((key, value) => i18n.t(key, value))
|
|||
<li>匈牙利语(hu)</li>
|
||||
</ul>
|
||||
|
||||
如果你需要使用其他的语言,欢迎贡献 PR:只需在 [这里](https://github.com/ElemeFE/element/tree/master/src/locale/lang) 添加一个语言配置文件即可。
|
||||
如果你需要使用其他的语言,欢迎贡献 PR:只需在 [这里](https://github.com/ElemeFE/element/tree/dev/src/locale/lang) 添加一个语言配置文件即可。
|
||||
|
|
|
@ -609,7 +609,7 @@
|
|||
|
||||
### 创建条目
|
||||
可以创建并选中选项中不存在的条目
|
||||
:::demo 使用`allow-create`属性即可通过在输入框中输入文字来创建新的条目。注意此时`filterable`必须为真。
|
||||
:::demo 使用`allow-create`属性即可通过在输入框中输入文字来创建新的条目。注意此时`filterable`必须为真。本例还使用了`default-first-option`属性,在该属性打开的情况下,按下回车就可以选中当前选项列表中的第一个选项,无需使用鼠标或键盘方向键进行定位。
|
||||
```html
|
||||
<template>
|
||||
<el-select
|
||||
|
@ -617,6 +617,7 @@
|
|||
multiple
|
||||
filterable
|
||||
allow-create
|
||||
default-first-option
|
||||
placeholder="请选择文章标签">
|
||||
<el-option
|
||||
v-for="item in options5"
|
||||
|
|
|
@ -116,14 +116,8 @@
|
|||
handleExceed(files, fileList) {
|
||||
this.$message.warning(`当前限制选择 3 个文件,本次选择了 ${files.length} 个文件,共选择了 ${files.length + fileList.length} 个文件`);
|
||||
},
|
||||
handleBeforeRemove(file, fileList) {
|
||||
return new Promise((resolve, reject) => {
|
||||
if (confirm('It looks good, are you sure to remove?')) {
|
||||
resolve();
|
||||
} else {
|
||||
reject();
|
||||
}
|
||||
});
|
||||
beforeRemove(file, fileList) {
|
||||
return this.$confirm(`确定移除 ${ file.name }?`);
|
||||
}
|
||||
}
|
||||
}
|
||||
|
@ -135,14 +129,14 @@
|
|||
|
||||
### 点击上传
|
||||
|
||||
:::demo 通过 slot 你可以传入自定义的上传按钮类型和文字提示。可通过设置 `limit` 和 `on-exceed` 来限制上传文件的个数和定义超出限制时的行为。可通过设置 `before-remove` 来阻止删除操作。
|
||||
:::demo 通过 slot 你可以传入自定义的上传按钮类型和文字提示。可通过设置`limit`和`on-exceed`来限制上传文件的个数和定义超出限制时的行为。可通过设置`before-remove`来阻止文件移除操作。
|
||||
```html
|
||||
<el-upload
|
||||
class="upload-demo"
|
||||
action="https://jsonplaceholder.typicode.com/posts/"
|
||||
:on-preview="handlePreview"
|
||||
:on-remove="handleRemove"
|
||||
:before-remove="handleBeforeRemove"
|
||||
:before-remove="beforeRemove"
|
||||
multiple
|
||||
:limit="3"
|
||||
:on-exceed="handleExceed"
|
||||
|
@ -167,14 +161,8 @@
|
|||
handleExceed(files, fileList) {
|
||||
this.$message.warning(`当前限制选择 3 个文件,本次选择了 ${files.length} 个文件,共选择了 ${files.length + fileList.length} 个文件`);
|
||||
},
|
||||
handleBeforeRemove(file, fileList) {
|
||||
return new Promise((resolve, reject) => {
|
||||
if (confirm('It looks good, are you sure to remove?')) {
|
||||
resolve();
|
||||
} else {
|
||||
reject();
|
||||
}
|
||||
});
|
||||
beforeRemove(file, fileList) {
|
||||
return this.$confirm(`确定移除 ${ file.name }?`);
|
||||
}
|
||||
}
|
||||
}
|
||||
|
|
|
@ -144,6 +144,18 @@
|
|||
}
|
||||
return index;
|
||||
},
|
||||
getNodePath(data) {
|
||||
if (!this.nodeKey) throw new Error('[Tree] nodeKey is required in getNodePath');
|
||||
const node = this.store.getNode(data);
|
||||
if (!node) return [];
|
||||
const path = [node.data];
|
||||
let parent = node.parent;
|
||||
while (parent && parent !== this.root) {
|
||||
path.push(parent.data);
|
||||
parent = parent.parent;
|
||||
}
|
||||
return path.reverse();
|
||||
},
|
||||
getCheckedNodes(leafOnly) {
|
||||
return this.store.getCheckedNodes(leafOnly);
|
||||
},
|
||||
|
|
|
@ -185,16 +185,15 @@ export default {
|
|||
|
||||
if (!this.beforeRemove) {
|
||||
doRemove();
|
||||
return;
|
||||
}
|
||||
|
||||
const before = this.beforeRemove(file, this.uploadFiles);
|
||||
if (before && before.then) {
|
||||
before.then(() => {
|
||||
} else if (typeof this.beforeRemove === 'function') {
|
||||
const before = this.beforeRemove(file, this.uploadFiles);
|
||||
if (before && before.then) {
|
||||
before.then(() => {
|
||||
doRemove();
|
||||
}, noop);
|
||||
} else if (before !== false) {
|
||||
doRemove();
|
||||
}, noop);
|
||||
} else if (before !== false) {
|
||||
doRemove();
|
||||
}
|
||||
}
|
||||
},
|
||||
getFile(rawFile) {
|
||||
|
|
Loading…
Reference in New Issue