Skip to content
体验新版
项目
组织
正在加载...
登录
切换导航
打开侧边栏
祺技世界
gin-vue-admin
提交
345cd774
G
gin-vue-admin
项目概览
祺技世界
/
gin-vue-admin
与 Fork 源项目一致
Fork自
FLIPPED-AURORA / gin-vue-admin
通知
6
Star
0
Fork
0
代码
文件
提交
分支
Tags
贡献者
分支图
Diff
Issue
0
列表
看板
标记
里程碑
合并请求
0
Wiki
0
Wiki
分析
仓库
DevOps
项目成员
Pages
G
gin-vue-admin
项目概览
项目概览
详情
发布
仓库
仓库
文件
提交
分支
标签
贡献者
分支图
比较
Issue
0
Issue
0
列表
看板
标记
里程碑
合并请求
0
合并请求
0
Pages
分析
分析
仓库分析
DevOps
Wiki
0
Wiki
成员
成员
收起侧边栏
关闭侧边栏
动态
分支图
创建新Issue
提交
Issue看板
体验新版 GitCode,发现更多精彩内容 >>
提交
345cd774
编写于
5月 20, 2020
作者:
J
jinlan.du
浏览文件
操作
浏览文件
下载
电子邮件补丁
差异文件
断点续传input隐藏
上级
5acdef73
变更
1
隐藏空白更改
内联
并排
Showing
1 changed file
with
22 addition
and
23 deletion
+22
-23
web/src/view/example/breakpoint/breakpoint.vue
web/src/view/example/breakpoint/breakpoint.vue
+22
-23
未找到文件。
web/src/view/example/breakpoint/breakpoint.vue
浏览文件 @
345cd774
...
...
@@ -2,24 +2,24 @@
<div
class=
"hello"
>
<el-divider
content-position=
"left"
>
大文件上传
</el-divider>
<form
id=
"fromCont"
method=
"post"
>
<div
class=
"fileUpload"
>
选择文件
<input
@
change=
"choseFile"
id=
"file"
multiple=
"multiple"
type=
"file"
/>
<div
class=
"fileUpload"
@
click=
"inputChange"
>
选择文件
<input
v-show=
"false"
@
change=
"choseFile"
id=
"file"
multiple=
"multiple"
type=
"file"
ref=
"Input"
/>
</div>
</form>
<el-button
@
click=
"getFile"
:disabled=
"limitFileSize"
type=
"primary"
size=
"medium"
class=
"uploadBtn"
>
上传文件
</el-button>
<div
class=
"el-upload__tip"
>
请上传不超过5MB的文件
</div>
<div
class=
"list"
>
<transition
-group
name=
"list"
tag=
"p"
>
<div
class=
"list-item"
v-
for=
"item in uploadList"
:key=
"item.nam
e"
>
<transition
name=
"list"
tag=
"p"
>
<div
class=
"list-item"
v-
if=
"fil
e"
>
<i
class=
"el-icon-document"
></i>
<span>
{{
item
.
name
}}
</span>
<span
v-if=
"file"
class=
"percentage"
>
{{
percentage
}}
%
</span>
<span>
{{
file
.
name
}}
</span>
<span
class=
"percentage"
>
{{
percentage
}}
%
</span>
<el-progress
:show-text=
'false'
:text-inside=
"false"
:stroke-width=
"2"
:percentage=
"percentage"
></el-progress>
</div>
</transition
-group
>
</transition>
</div>
<!--
<span
<!--
<span
v-if=
"this.file"
>
{{
Math
.
floor
(((
this
.
formDataList
.
length
-
this
.
waitNum
)
/
this
.
formDataList
.
length
)
*
100
)
}}
%
</span>
-->
<div
class=
"tips"
>
此版本为先行体验功能测试版,样式美化和性能优化正在进行中,上传切片文件和合成的完整文件分别再QMPlusserver目录的breakpointDir文件夹和fileDir文件夹
</div>
...
...
@@ -45,8 +45,7 @@ export default {
limitFileSize
:
false
,
percentage
:
0
,
percentageFlage
:
true
,
customColor
:
'
#409eff
'
,
uploadList
:[]
customColor
:
'
#409eff
'
}
},
created
(){
...
...
@@ -59,6 +58,7 @@ export default {
const
file
=
e
.
target
.
files
[
0
]
// 获取当前文件
const
maxSize
=
5
*
1024
*
1024
this
.
file
=
file
// file 丢全局方便后面用 可以改进为func传参形式
this
.
percentage
=
0
if
(
file
.
size
<
maxSize
){
fileR
.
readAsArrayBuffer
(
file
)
// 把文件读成ArrayBuffer 主要为了保持跟后端的流一致
fileR
.
onload
=
async
e
=>
{
...
...
@@ -123,9 +123,6 @@ export default {
this
.
percentageFlage
=
false
}
this
.
sliceFile
()
// 上传切片
if
(
this
.
percentage
==
100
){
this
.
uploadList
.
push
(
this
.
file
)
}
},
sliceFile
()
{
this
.
waitUpLoad
&&
...
...
@@ -164,6 +161,9 @@ export default {
await
removeChunk
(
params
)
}
}
},
inputChange
(){
this
.
$refs
.
Input
.
dispatchEvent
(
new
MouseEvent
(
'
click
'
))
}
}
}
...
...
@@ -198,15 +198,14 @@ a {
border-radius
:
4px
;
overflow
:
hidden
;
display
:
inline-block
;
input
{
position
:
absolute
;
font-size
:
100px
;
right
:
0
;
top
:
0
;
opacity
:
0
;
cursor
:
pointer
;
}
input
{
position
:
absolute
;
font-size
:
100px
;
right
:
0
;
top
:
0
;
opacity
:
0
;
cursor
:
pointer
;
}
}
.fileName
{
display
:
inline-block
;
...
...
编辑
预览
Markdown
is supported
0%
请重试
或
添加新附件
.
添加附件
取消
You are about to add
0
people
to the discussion. Proceed with caution.
先完成此消息的编辑!
取消
想要评论请
注册
或
登录