Skip to content
体验新版
项目
组织
正在加载...
登录
切换导航
打开侧边栏
dyingstraw
vue-element-admin
提交
c93fcefe
V
vue-element-admin
项目概览
dyingstraw
/
vue-element-admin
与 Fork 源项目一致
从无法访问的项目Fork
通知
3
Star
0
Fork
0
代码
文件
提交
分支
Tags
贡献者
分支图
Diff
Issue
0
列表
看板
标记
里程碑
合并请求
0
Wiki
0
Wiki
分析
仓库
DevOps
项目成员
Pages
V
vue-element-admin
项目概览
项目概览
详情
发布
仓库
仓库
文件
提交
分支
标签
贡献者
分支图
比较
Issue
0
Issue
0
列表
看板
标记
里程碑
合并请求
0
合并请求
0
Pages
分析
分析
仓库分析
DevOps
Wiki
0
Wiki
成员
成员
收起侧边栏
关闭侧边栏
动态
分支图
创建新Issue
提交
Issue看板
体验新版 GitCode,发现更多精彩内容 >>
提交
c93fcefe
编写于
6月 12, 2018
作者:
P
Pan
浏览文件
操作
浏览文件
下载
电子邮件补丁
差异文件
perf[UploadExcel-component]: tweaks
上级
9f8ac374
变更
2
显示空白变更内容
内联
并排
Showing
2 changed file
with
11 addition
and
10 deletion
+11
-10
src/components/UploadExcel/index.vue
src/components/UploadExcel/index.vue
+7
-6
src/views/excel/uploadExcel.vue
src/views/excel/uploadExcel.vue
+4
-4
未找到文件。
src/components/UploadExcel/index.vue
浏览文件 @
c93fcefe
<
template
>
<div>
<input
id=
"excel-upload-input"
ref=
"excel-upload-input"
type=
"file"
accept=
".xlsx, .xls"
class=
"c-hide"
@
change=
"handkeFileChange
"
>
<input
id=
"excel-upload-input"
ref=
"excel-upload-input"
type=
"file"
accept=
".xlsx, .xls"
@
change=
"handleClick
"
>
<div
id=
"drop"
@
drop=
"handleDrop"
@
dragover=
"handleDragover"
@
dragenter=
"handleDragover"
>
Drop excel file here or
<el-button
:loading=
"loading"
style=
"margin-left:16px;"
size=
"mini"
type=
"primary"
@
click=
"handleUpload"
>
b
rowse
</el-button>
<el-button
:loading=
"loading"
style=
"margin-left:16px;"
size=
"mini"
type=
"primary"
@
click=
"handleUpload"
>
B
rowse
</el-button>
</div>
</div>
</
template
>
...
...
@@ -25,11 +25,12 @@ export default {
generateDate
({
header
,
results
})
{
this
.
excelData
.
header
=
header
this
.
excelData
.
results
=
results
this
.
$emit
(
'
on-selected-file
'
,
this
.
excelData
)
this
.
$emit
(
'
success
'
,
this
.
excelData
)
},
handleDrop
(
e
)
{
e
.
stopPropagation
()
e
.
preventDefault
()
if
(
this
.
loading
)
return
const
files
=
e
.
dataTransfer
.
files
if
(
files
.
length
!==
1
)
{
this
.
$message
.
error
(
'
Only support uploading one file!
'
)
...
...
@@ -48,17 +49,16 @@ export default {
handleUpload
()
{
document
.
getElementById
(
'
excel-upload-input
'
).
click
()
},
hand
keFileChange
(
e
)
{
hand
leClick
(
e
)
{
const
files
=
e
.
target
.
files
const
itemFile
=
files
[
0
]
// only use files[0]
if
(
!
itemFile
)
return
this
.
loading
=
true
this
.
readerData
(
itemFile
).
then
(()
=>
{
this
.
$refs
[
'
excel-upload-input
'
].
value
=
null
// fix can't select the same excel
this
.
loading
=
false
})
},
readerData
(
itemFile
)
{
this
.
loading
=
true
return
new
Promise
((
resolve
,
reject
)
=>
{
const
reader
=
new
FileReader
()
reader
.
onload
=
e
=>
{
...
...
@@ -70,6 +70,7 @@ export default {
const
header
=
this
.
get_header_row
(
worksheet
)
const
results
=
XLSX
.
utils
.
sheet_to_json
(
worksheet
)
this
.
generateDate
({
header
,
results
})
this
.
loading
=
false
resolve
()
}
reader
.
readAsArrayBuffer
(
itemFile
)
...
...
src/views/excel/uploadExcel.vue
浏览文件 @
c93fcefe
<
template
>
<div
class=
"app-container"
>
<upload-excel-component
@
on-selected-file=
'selected
'
></upload-excel-component>
<upload-excel-component
@
success=
'handleSuccess
'
></upload-excel-component>
<el-table
:data=
"tableData"
border
highlight-current-row
style=
"width: 100%;margin-top:20px;"
>
<el-table-column
v-for=
'item of tableHeader'
:prop=
"item"
:label=
"item"
:key=
'item'
>
</el-table-column>
...
...
@@ -21,9 +21,9 @@ export default {
}
},
methods
:
{
selected
(
data
)
{
this
.
tableData
=
data
.
results
this
.
tableHeader
=
data
.
header
handleSuccess
({
results
,
header
}
)
{
this
.
tableData
=
results
this
.
tableHeader
=
header
}
}
}
...
...
编辑
预览
Markdown
is supported
0%
请重试
或
添加新附件
.
添加附件
取消
You are about to add
0
people
to the discussion. Proceed with caution.
先完成此消息的编辑!
取消
想要评论请
注册
或
登录