Skip to content
项目
群组
代码片段
帮助
正在加载...
帮助
提交反馈
为 GitLab 提交贡献
登录
切换导航
iBiz-Vue-Mob-R7-Res
项目
项目
详情
动态
版本
周期分析
仓库
仓库
文件
提交
分支
标签
贡献者
分支图
比较
统计图
议题
0
议题
0
列表
看板
标记
里程碑
合并请求
0
合并请求
0
CI / CD
CI / CD
流水线
作业
计划
统计图
Wiki
Wiki
代码片段
代码片段
成员
成员
收起侧边栏
关闭侧边栏
动态
分支图
统计图
创建新议题
作业
提交
议题看板
打开侧边栏
iBiz-R7前端标准模板
iBiz-Vue-Mob-R7-Res
提交
f212b69e
提交
f212b69e
编写于
4月 30, 2020
作者:
zcdtk
浏览文件
操作
浏览文件
下载
电子邮件补丁
差异文件
代码格式化
上级
1343fe66
变更
2
隐藏空白字符变更
内嵌
并排
正在显示
2 个修改的文件
包含
276 行增加
和
275 行删除
+276
-275
app-mob-file-upload.vue
src/components/app-mob-file-upload/app-mob-file-upload.vue
+269
-270
app-mob-picture.vue
src/components/app-mob-picture/app-mob-picture.vue
+7
-5
未找到文件。
src/components/app-mob-file-upload/app-mob-file-upload.vue
浏览文件 @
f212b69e
<
template
>
<div
class=
"app-mobile-file-upload"
>
<ion-item-group
v-if=
"files.length > 0"
>
<ion-item
v-for=
"file in files"
:key=
"file.id"
>
<ion-label><a
class=
"file"
>
{{
file
.
name
}}
</a></ion-label>
<ion-icon
name=
"close-circle-outline"
@
click=
"onDelete(file, null)"
></ion-icon>
</ion-item>
</ion-item-group>
<ion-row>
<van-uploader
:class=
"singleChoiceBtnState"
multiple=
"false"
:disabled=
"state"
:result-type=
"resultType"
:before-read=
"beforeRead"
:after-read=
"afterRead"
>
<ion-button
color=
"primary"
>
<ion-icon
slot=
"start"
name=
"image-outline"
></ion-icon>
{{
$t
(
'uploadtext'
)
}}
</ion-button>
</van-uploader>
</ion-row>
</div>
<div
class=
"app-mobile-file-upload"
>
<ion-item-group
v-if=
"files.length > 0"
>
<ion-item
v-for=
"file in files"
:key=
"file.id"
>
<ion-label><a
class=
"file"
>
{{
file
.
name
}}
</a></ion-label>
<ion-icon
name=
"close-circle-outline"
@
click=
"onDelete(file, null)"
></ion-icon>
</ion-item>
</ion-item-group>
<ion-row>
<van-uploader
:class=
"singleChoiceBtnState"
multiple=
"false"
:disabled=
"state"
:result-type=
"resultType"
:before-read=
"beforeRead"
:after-read=
"afterRead"
>
<ion-button
color=
"primary"
>
<ion-icon
slot=
"start"
name=
"image-outline"
></ion-icon>
{{
$t
(
'uploadtext'
)
}}
</ion-button>
</van-uploader>
</ion-row>
</div>
</
template
>
<
script
lang=
"ts"
>
import
{
Vue
,
Component
,
Prop
,
Provide
,
Emit
,
Watch
}
from
'vue-property-decorator'
;
import
{
Environment
}
from
'@/environments/environment'
;
import
{
Subject
,
Unsubscribable
}
from
'rxjs'
;
import
Axios
from
'axios'
;
import
{
Vue
,
Component
,
Prop
,
Provide
,
Emit
,
Watch
}
from
'vue-property-decorator'
;
import
{
Environment
}
from
'@/environments/environment'
;
import
{
Subject
,
Unsubscribable
}
from
'rxjs'
;
import
Axios
from
'axios'
;
import
{
Uploader
}
from
'vant'
;
import
{
Uploader
}
from
'vant'
;
Vue
.
use
(
Uploader
);
@
Component
({
Vue
.
use
(
Uploader
);
@
Component
({
i18n
:
{
messages
:
{
'ZH-CN'
:
{
...
...
@@ -40,8 +39,8 @@
}
},
components
:
{}
})
export
default
class
AppMobFileUpload
extends
Vue
{
})
export
default
class
AppMobFileUpload
extends
Vue
{
// MOB LOGIC BEGIN
/**
* 单选按钮状态
...
...
@@ -50,11 +49,11 @@
* @type {Array<string>}
* @memberof AppMobFileUpload
*/
get
singleChoiceBtnState
():
Array
<
string
>
{
return
[
this
.
files
.
length
>
0
?
'file-list'
:
''
,
!
this
.
multiple
&&
this
.
files
.
length
===
1
?
'hidden-choice-button'
:
''
,
];
get
singleChoiceBtnState
():
Array
<
string
>
{
return
[
this
.
files
.
length
>
0
?
'file-list'
:
''
,
!
this
.
multiple
&&
this
.
files
.
length
===
1
?
'hidden-choice-button'
:
''
,
];
}
/**
...
...
@@ -62,18 +61,18 @@
*
* @readonly
* @type {boolean}
* @memberof AppMob
Picture
* @memberof AppMob
FileUpload
*/
get
state
():
boolean
{
// 禁用
if
(
this
.
disabled
)
{
return
true
;
}
// 单选
if
(
!
this
.
multiple
&&
this
.
files
.
length
===
1
)
{
return
true
;
}
return
false
;
// 禁用
if
(
this
.
disabled
)
{
return
true
;
}
// 单选
if
(
!
this
.
multiple
&&
this
.
files
.
length
===
1
)
{
return
true
;
}
return
false
;
}
/**
...
...
@@ -81,15 +80,15 @@
*
* @private
* @type {Array<any>}
* @memberof AppMob
Picture
* @memberof AppMob
FileUpload
*/
private
devFiles
:
Array
<
any
>
=
[];
private
devFiles
:
Array
<
any
>
=
[];
/**
* 文件上传模式
*
* @type {string}
* @memberof AppMob
Picture
* @memberof AppMob
FileUpload
*/
public
resultType
:
string
=
process
.
env
.
NODE_ENV
===
'development'
?
'dataUrl'
:
'file'
;
...
...
@@ -98,13 +97,13 @@
*
* @param {*} file 文件信息
* @param {*} detail 详情
* @memberof AppMob
Picture
* @memberof AppMob
FileUpload
*/
public
onDelete
(
file
:
any
,
detail
:
any
):
void
{
this
.
onRemove
({
id
:
file
.
id
,
name
:
file
.
name
},
this
.
files
);
this
.
onRemove
({
id
:
file
.
id
,
name
:
file
.
name
},
this
.
files
);
}
/**
...
...
@@ -113,17 +112,17 @@
* @param {*} file
* @param {*} detail
* @returns {boolean}
* @memberof AppMob
Picture
* @memberof AppMob
FileUpload
*/
public
beforeRead
(
file
:
any
,
detail
:
any
):
boolean
{
if
(
file
&&
Array
.
isArray
(
file
))
{
this
.
$notify
({
type
:
'warning'
,
message
:
'该功能只支持单个文件上传'
});
return
false
;
}
return
true
;
if
(
file
&&
Array
.
isArray
(
file
))
{
this
.
$notify
({
type
:
'warning'
,
message
:
'该功能只支持单个文件上传'
});
return
false
;
}
return
true
;
}
/**
...
...
@@ -132,31 +131,31 @@
* @protected
* @param {*} file 文件信息
* @param {*} detail 详情
* @memberof AppMob
Picture
* @memberof AppMob
FileUpload
*/
protected
afterRead
(
file
:
any
,
detail
:
any
):
void
{
const
params
=
new
FormData
()
params
.
append
(
'file'
,
file
.
file
,
file
.
file
.
name
)
const
config
=
{
headers
:
{
'Content-Type'
:
'multipart/form-data'
}
}
Axios
.
post
(
this
.
uploadUrl
,
params
,
config
).
then
((
response
:
any
)
=>
{
if
(
response
&&
response
.
data
&&
response
.
status
===
200
)
{
let
data
:
any
=
response
.
data
;
if
(
process
.
env
.
NODE_ENV
===
'development'
)
{
this
.
devFiles
.
push
(
Object
.
assign
({},
data
,
{
url
:
file
.
content
}));
}
this
.
onSuccess
(
data
,
file
,
this
.
files
);
}
else
{
this
.
onError
(
response
,
file
,
this
.
files
);
const
params
=
new
FormData
()
params
.
append
(
'file'
,
file
.
file
,
file
.
file
.
name
)
const
config
=
{
headers
:
{
'Content-Type'
:
'multipart/form-data'
}
}
}).
catch
((
response
:
any
)
=>
{
this
.
onError
(
response
,
file
,
this
.
files
);
});
Axios
.
post
(
this
.
uploadUrl
,
params
,
config
).
then
((
response
:
any
)
=>
{
if
(
response
&&
response
.
data
&&
response
.
status
===
200
)
{
let
data
:
any
=
response
.
data
;
if
(
process
.
env
.
NODE_ENV
===
'development'
)
{
this
.
devFiles
.
push
(
Object
.
assign
({},
data
,
{
url
:
file
.
content
}));
}
this
.
onSuccess
(
data
,
file
,
this
.
files
);
}
else
{
this
.
onError
(
response
,
file
,
this
.
files
);
}
}).
catch
((
response
:
any
)
=>
{
this
.
onError
(
response
,
file
,
this
.
files
);
});
}
// MOB LOGIC END
...
...
@@ -164,24 +163,24 @@
* 表单状态
*
* @type {Subject<any>}
* @memberof AppMob
Picture
* @memberof AppMob
FileUpload
*/
@
Prop
()
public
formState
?
:
Subject
<
any
>
@
Prop
()
public
formState
?:
Subject
<
any
>
/**
* 是否忽略表单项书香值变化
*
* @type {boolean}
* @memberof AppMobPicture
*/
@
Prop
()
public
ignorefieldvaluechange
?
:
boolean
;
/**
* 是否忽略表单项书香值变化
*
* @type {boolean}
* @memberof AppMobFileUpload
*/
@
Prop
()
public
ignorefieldvaluechange
?
:
boolean
;
/**
* 表单状态事件
*
* @private
* @type {(Unsubscribable | undefined)}
* @memberof AppMob
Picture
* @memberof AppMob
FileUpload
*/
private
formStateEvent
:
Unsubscribable
|
undefined
;
...
...
@@ -189,7 +188,7 @@
* 表单数据
*
* @type {string}
* @memberof AppMob
Picture
* @memberof AppMob
FileUpload
*/
@
Prop
()
public
data
!
:
string
;
...
...
@@ -197,9 +196,9 @@
* 初始化值
*
* @type {*}
* @memberof AppMob
Picture
* @memberof AppMob
FileUpload
*/
@
Prop
()
public
value
?
:
any
;
@
Prop
()
public
value
?
:
any
;
/**
* 数据值变化
...
...
@@ -207,26 +206,26 @@
* @param {*} newval
* @param {*} val
* @returns
* @memberof AppMob
Picture
* @memberof AppMob
FileUpload
*/
@
Watch
(
'value'
)
onValueChange
(
newval
:
any
,
val
:
any
)
{
if
(
this
.
ignorefieldvaluechange
)
{
return
;
}
if
(
newval
)
{
this
.
files
=
JSON
.
parse
(
newval
);
this
.
dataProcess
();
}
else
{
this
.
files
=
[];
}
if
(
this
.
ignorefieldvaluechange
)
{
return
;
}
if
(
newval
)
{
this
.
files
=
JSON
.
parse
(
newval
);
this
.
dataProcess
();
}
else
{
this
.
files
=
[];
}
}
/**
* 所属表单项名称
*
* @type {string}
* @memberof AppMob
Picture
* @memberof AppMob
FileUpload
*/
@
Prop
()
public
name
!
:
string
;
...
...
@@ -234,84 +233,84 @@
* 是否禁用
*
* @type {boolean}
* @memberof AppMob
Picture
* @memberof AppMob
FileUpload
*/
@
Prop
()
public
disabled
?
:
boolean
;
@
Prop
()
public
disabled
?
:
boolean
;
/**
* 上传参数
*
* @type {string}
* @memberof AppMob
Picture
* @memberof AppMob
FileUpload
*/
@
Prop
()
public
uploadparams
?
:
string
;
@
Prop
()
public
uploadparams
?
:
string
;
/**
* 下载参数
*
* @type {string}
* @memberof AppMob
Picture
* @memberof AppMob
FileUpload
*/
@
Prop
()
public
exportparams
?
:
string
;
@
Prop
()
public
exportparams
?
:
string
;
/**
* 自定义参数
*
* @type {*}
* @memberof AppMob
Picture
* @memberof AppMob
FileUpload
*/
@
Prop
()
public
customparams
?
:
any
;
@
Prop
()
public
customparams
?
:
any
;
/**
* 上传文件路径
*
* @memberof AppMob
Picture
* @memberof AppMob
FileUpload
*/
public
uploadUrl
=
Environment
.
BaseUrl
+
Environment
.
UploadFile
;
/**
* 下载文件路径
*
* @memberof AppMob
Picture
* @memberof AppMob
FileUpload
*/
public
downloadUrl
=
Environment
.
BaseUrl
+
Environment
.
ExportFile
;
/**
* 文件列表
*
* @memberof AppMob
Picture
* @memberof AppMob
FileUpload
*/
@
Provide
()
public
files
:
Array
<
any
>
=
[];
@
Provide
()
public
files
:
Array
<
any
>
=
[];
/**
* 上传keys
*
* @type {Array<any>}
* @memberof AppMob
Picture
* @memberof AppMob
FileUpload
*/
public
upload_keys
:
Array
<
any
>
=
[];
public
upload_keys
:
Array
<
any
>
=
[];
/**
* 导出keys
*
* @type {Array<any>}
* @memberof AppMob
Picture
* @memberof AppMob
FileUpload
*/
public
export_keys
:
Array
<
any
>
=
[];
public
export_keys
:
Array
<
any
>
=
[];
/**
* 自定义数组
*
* @type {Array<any>}
* @memberof AppMob
Picture
* @memberof AppMob
FileUpload
*/
public
custom_arr
:
Array
<
any
>
=
[];
public
custom_arr
:
Array
<
any
>
=
[];
/**
* 应用参数
*
* @type {*}
* @memberof AppMob
Picture
* @memberof AppMob
FileUpload
*/
public
appData
:
any
=
""
;
...
...
@@ -319,148 +318,150 @@
* 数据处理
*
* @private
* @memberof AppMob
Picture
* @memberof AppMob
FileUpload
*/
private
dataProcess
():
void
{
let
upload_arr
:
Array
<
string
>
=
[];
let
export_arr
:
Array
<
string
>
=
[];
const
_data
:
any
=
JSON
.
parse
(
this
.
data
);
this
.
upload_keys
.
forEach
((
key
:
string
)
=>
{
upload_arr
.
push
(
`
${
key
}
=
${
_data
[
key
]}
`
);
});
this
.
export_keys
.
forEach
((
key
:
string
)
=>
{
export_arr
.
push
(
`
${
key
}
=
${
_data
[
key
]}
`
);
});
let
_url
=
`
${
Environment
.
BaseUrl
}${
Environment
.
UploadFile
}
`
;
if
(
upload_arr
.
length
>
0
||
this
.
custom_arr
.
length
>
0
)
{
_url
=
`
${
_url
}
?
${
upload_arr
.
join
(
'&'
)}${
upload_arr
.
length
>
0
?
'&'
:
''
}${
this
.
custom_arr
.
join
(
'&'
)}
`
;
}
this
.
uploadUrl
=
_url
;
this
.
files
.
forEach
((
file
:
any
)
=>
{
if
(
process
.
env
.
NODE_ENV
===
'development'
)
{
let
index
=
this
.
devFiles
.
findIndex
((
devFile
:
any
)
=>
Object
.
is
(
devFile
.
id
,
file
.
id
));
if
(
index
!==
-
1
)
{
file
.
url
=
this
.
devFiles
[
index
].
url
;
file
.
isImage
=
true
;
}
return
;
}
let
url
=
`
${
this
.
downloadUrl
}
/
${
file
.
id
}
`
;
let
upload_arr
:
Array
<
string
>
=
[];
let
export_arr
:
Array
<
string
>
=
[];
const
_data
:
any
=
JSON
.
parse
(
this
.
data
);
this
.
upload_keys
.
forEach
((
key
:
string
)
=>
{
upload_arr
.
push
(
`
${
key
}
=
${
_data
[
key
]}
`
);
});
this
.
export_keys
.
forEach
((
key
:
string
)
=>
{
export_arr
.
push
(
`
${
key
}
=
${
_data
[
key
]}
`
);
});
let
_url
=
`
${
Environment
.
BaseUrl
}${
Environment
.
UploadFile
}
`
;
if
(
upload_arr
.
length
>
0
||
this
.
custom_arr
.
length
>
0
)
{
url
=
`
${
url
}
?
${
upload_arr
.
join
(
'&'
)}${
upload_arr
.
length
>
0
?
'&'
:
''
}${
this
.
custom_arr
.
join
(
'&'
)}
`
;
_url
=
`
${
_
url
}
?
${
upload_arr
.
join
(
'&'
)}${
upload_arr
.
length
>
0
?
'&'
:
''
}${
this
.
custom_arr
.
join
(
'&'
)}
`
;
}
file
.
url
=
url
;
});
this
.
uploadUrl
=
_url
;
this
.
files
.
forEach
((
file
:
any
)
=>
{
if
(
process
.
env
.
NODE_ENV
===
'development'
)
{
let
index
=
this
.
devFiles
.
findIndex
((
devFile
:
any
)
=>
Object
.
is
(
devFile
.
id
,
file
.
id
));
if
(
index
!==
-
1
)
{
file
.
url
=
this
.
devFiles
[
index
].
url
;
file
.
isImage
=
true
;
}
return
;
}
let
url
=
`
${
this
.
downloadUrl
}
/
${
file
.
id
}
`
;
if
(
upload_arr
.
length
>
0
||
this
.
custom_arr
.
length
>
0
)
{
url
=
`
${
url
}
?
${
upload_arr
.
join
(
'&'
)}${
upload_arr
.
length
>
0
?
'&'
:
''
}${
this
.
custom_arr
.
join
(
'&'
)}
`
;
}
file
.
url
=
url
;
});
}
/**
* vue 生命周期
*
* @memberof AppMob
Picture
* @memberof AppMob
FileUpload
*/
public
created
()
{
if
(
this
.
formState
)
{
this
.
formStateEvent
=
this
.
formState
.
subscribe
((
$event
:
any
)
=>
{
// 表单加载完成
if
(
Object
.
is
(
$event
.
type
,
'load'
))
{
if
(
this
.
value
)
{
// console.log(this.value);
this
.
files
=
JSON
.
parse
(
this
.
value
);
}
this
.
dataProcess
();
}
});
}
if
(
this
.
formState
)
{
this
.
formStateEvent
=
this
.
formState
.
subscribe
((
$event
:
any
)
=>
{
// 表单加载完成
if
(
Object
.
is
(
$event
.
type
,
'load'
))
{
if
(
this
.
value
)
{
// console.log(this.value);
this
.
files
=
JSON
.
parse
(
this
.
value
);
}
this
.
dataProcess
();
}
});
}
}
/**
* vue 生命周期
*
* @memberof AppMob
Picture
* @memberof AppMob
FileUpload
*/
public
mounted
()
{
this
.
appData
=
this
.
$store
.
getters
.
getAppData
();
let
custom_arr
:
Array
<
string
>
=
[];
let
upload_keys
:
Array
<
string
>
=
[];
let
export_keys
:
Array
<
string
>
=
[];
if
(
this
.
uploadparams
&&
!
Object
.
is
(
this
.
uploadparams
,
''
))
{
upload_keys
=
this
.
uploadparams
.
split
(
';'
);
}
if
(
this
.
exportparams
&&
!
Object
.
is
(
this
.
exportparams
,
''
))
{
export_keys
=
this
.
exportparams
.
split
(
';'
);
}
if
(
this
.
customparams
&&
!
Object
.
is
(
this
.
customparams
,
''
))
{
Object
.
keys
(
this
.
customparams
).
forEach
((
name
:
string
)
=>
{
custom_arr
.
push
(
`
${
name
}
=
${
this
.
customparams
[
name
]}
`
);
});
}
this
.
upload_keys
=
upload_keys
;
this
.
export_keys
=
export_keys
;
this
.
custom_arr
=
custom_arr
;
this
.
appData
=
this
.
$store
.
getters
.
getAppData
();
let
custom_arr
:
Array
<
string
>
=
[];
let
upload_keys
:
Array
<
string
>
=
[];
let
export_keys
:
Array
<
string
>
=
[];
if
(
this
.
uploadparams
&&
!
Object
.
is
(
this
.
uploadparams
,
''
))
{
upload_keys
=
this
.
uploadparams
.
split
(
';'
);
}
if
(
this
.
exportparams
&&
!
Object
.
is
(
this
.
exportparams
,
''
))
{
export_keys
=
this
.
exportparams
.
split
(
';'
);
}
if
(
this
.
customparams
&&
!
Object
.
is
(
this
.
customparams
,
''
))
{
Object
.
keys
(
this
.
customparams
).
forEach
((
name
:
string
)
=>
{
custom_arr
.
push
(
`
${
name
}
=
${
this
.
customparams
[
name
]}
`
);
});
}
this
.
upload_keys
=
upload_keys
;
this
.
export_keys
=
export_keys
;
this
.
custom_arr
=
custom_arr
;
if
(
this
.
value
)
{
this
.
files
=
JSON
.
parse
(
this
.
value
);
}
this
.
dataProcess
();
if
(
this
.
value
)
{
this
.
files
=
JSON
.
parse
(
this
.
value
);
}
this
.
dataProcess
();
this
.
changeLabelStyle
();
this
.
changeLabelStyle
();
}
/**
* 修改label默认样式
* @memberof AppMob
Picture
* @memberof AppMob
FileUpload
*/
public
changeLabelStyle
()
{
document
.
querySelectorAll
(
".app-mobile-file-upload"
).
forEach
((
element
:
any
)
=>
{
let
prev
=
this
.
getNearEle
(
element
,
1
);
prev
.
style
.
transform
=
'none'
;
})
document
.
querySelectorAll
(
".app-mobile-file-upload"
).
forEach
((
element
:
any
)
=>
{
let
prev
=
this
.
getNearEle
(
element
,
1
);
if
(
prev
)
{
prev
.
style
.
transform
=
'none'
;
}
})
}
/**
* 查找相邻前一个元素
*
* @memberof AppMob
Picture
* @memberof AppMob
FileUpload
*/
public
getNearEle
(
ele
:
any
,
type
:
any
)
{
type
=
type
==
1
?
"previousSibling"
:
"nextSibling"
;
var
nearEle
=
ele
[
type
];
while
(
nearEle
)
{
if
(
nearEle
.
nodeType
===
1
)
{
return
nearEle
;
}
nearEle
=
nearEle
[
type
];
if
(
!
nearEle
)
{
break
;
type
=
type
==
1
?
"previousSibling"
:
"nextSibling"
;
var
nearEle
=
ele
[
type
];
while
(
nearEle
)
{
if
(
nearEle
.
nodeType
===
1
)
{
return
nearEle
;
}
nearEle
=
nearEle
[
type
];
if
(
!
nearEle
)
{
break
;
}
}
}
return
null
;
return
null
;
}
/**
* 组件销毁
*
* @memberof AppMob
Picture
* @memberof AppMob
FileUpload
*/
public
destroyed
():
void
{
if
(
this
.
formStateEvent
)
{
this
.
formStateEvent
.
unsubscribe
();
}
if
(
this
.
formStateEvent
)
{
this
.
formStateEvent
.
unsubscribe
();
}
}
/**
* 上传之前
*
* @param {*} file
* @memberof AppMob
Picture
* @memberof AppMob
FileUpload
*/
public
beforeUpload
(
file
:
any
)
{
// console.log('上传之前');
// console.log('上传之前');
}
/**
...
...
@@ -470,30 +471,30 @@
* @param {*} file
* @param {*} fileList
* @returns
* @memberof AppMob
Picture
* @memberof AppMob
FileUpload
*/
public
onSuccess
(
response
:
any
,
file
:
any
,
fileList
:
any
)
{
if
(
!
response
)
{
return
;
}
const
data
=
{
name
:
response
.
name
,
id
:
response
.
id
};
let
arr
:
Array
<
any
>
=
[];
this
.
files
.
forEach
((
_file
:
any
)
=>
{
arr
.
push
({
name
:
_file
.
name
,
id
:
_file
.
id
})
});
arr
.
push
(
data
);
let
value
:
any
=
arr
.
length
>
0
?
JSON
.
stringify
(
arr
)
:
null
;
this
.
$emit
(
'formitemvaluechange'
,
{
name
:
this
.
name
,
value
:
value
});
if
(
!
response
)
{
return
;
}
const
data
=
{
name
:
response
.
name
,
id
:
response
.
id
};
let
arr
:
Array
<
any
>
=
[];
this
.
files
.
forEach
((
_file
:
any
)
=>
{
arr
.
push
({
name
:
_file
.
name
,
id
:
_file
.
id
})
});
arr
.
push
(
data
);
let
value
:
any
=
arr
.
length
>
0
?
JSON
.
stringify
(
arr
)
:
null
;
this
.
$emit
(
'formitemvaluechange'
,
{
name
:
this
.
name
,
value
:
value
});
}
/**
...
...
@@ -502,13 +503,13 @@
* @param {*} error
* @param {*} file
* @param {*} fileList
* @memberof AppMob
Picture
* @memberof AppMob
FileUpload
*/
public
onError
(
error
:
any
,
file
:
any
,
fileList
:
any
)
{
this
.
$notify
({
type
:
'danger'
,
message
:
'上传失败'
});
this
.
$notify
({
type
:
'danger'
,
message
:
'上传失败'
});
}
/**
...
...
@@ -516,40 +517,40 @@
*
* @param {*} file
* @param {*} fileList
* @memberof AppMob
Picture
* @memberof AppMob
FileUpload
*/
public
onRemove
(
file
:
any
,
fileList
:
any
)
{
let
arr
:
Array
<
any
>
=
[];
fileList
.
forEach
((
f
:
any
)
=>
{
if
(
f
.
id
!=
file
.
id
)
{
arr
.
push
({
name
:
f
.
name
,
id
:
f
.
id
});
}
});
let
value
:
any
=
arr
.
length
>
0
?
JSON
.
stringify
(
arr
)
:
null
;
this
.
$emit
(
'formitemvaluechange'
,
{
name
:
this
.
name
,
value
:
value
});
let
arr
:
Array
<
any
>
=
[];
fileList
.
forEach
((
f
:
any
)
=>
{
if
(
f
.
id
!=
file
.
id
)
{
arr
.
push
({
name
:
f
.
name
,
id
:
f
.
id
});
}
});
let
value
:
any
=
arr
.
length
>
0
?
JSON
.
stringify
(
arr
)
:
null
;
this
.
$emit
(
'formitemvaluechange'
,
{
name
:
this
.
name
,
value
:
value
});
}
/**
* 下载文件
*
* @param {*} file
* @memberof AppMob
Picture
* @memberof AppMob
FileUpload
*/
public
onDownload
(
file
:
any
)
{
window
.
open
(
file
.
url
);
window
.
open
(
file
.
url
);
}
/**
* 预览图片地址
*
* @type {string}
* @memberof AppMob
Picture
* @memberof AppMob
FileUpload
*/
public
dialogImageUrl
:
string
=
''
;
...
...
@@ -557,7 +558,7 @@
* 是否显示预览界面
*
* @type {boolean}
* @memberof AppMob
Picture
* @memberof AppMob
FileUpload
*/
public
dialogVisible
:
boolean
=
false
;
...
...
@@ -565,23 +566,21 @@
* 是否支持多个上传
*
* @type {boolean}
* @memberof AppMob
Picture
* @memberof AppMob
FileUpload
*/
@
Prop
({
default
:
true
})
public
multiple
?
:
boolean
;
@
Prop
({
default
:
true
})
public
multiple
?:
boolean
;
/**
* 预览
*
* @param {*} file
* @memberof AppMob
Picture
* @memberof AppMob
FileUpload
*/
public
onPreview
(
file
:
any
)
{
this
.
dialogImageUrl
=
file
.
url
;
this
.
dialogVisible
=
true
;
this
.
dialogImageUrl
=
file
.
url
;
this
.
dialogVisible
=
true
;
}
}
}
</
script
>
<
style
lang=
"less"
>
...
...
src/components/app-mob-picture/app-mob-picture.vue
浏览文件 @
f212b69e
...
...
@@ -395,11 +395,13 @@ export default class AppMobPicture extends Vue {
* @memberof AppMobPicture
*/
public
changeLabelStyle
()
{
document
.
querySelectorAll
(
".app-mobile-picture"
).
forEach
((
element
:
any
)
=>
{
let
prev
=
this
.
getNearEle
(
element
,
1
);
prev
.
style
.
transform
=
'none'
;
prev
.
style
.
marginBottom
=
"10px"
;
})
document
.
querySelectorAll
(
".app-mobile-picture"
).
forEach
((
element
:
any
)
=>
{
let
prev
=
this
.
getNearEle
(
element
,
1
);
if
(
prev
)
{
prev
.
style
.
transform
=
'none'
;
prev
.
style
.
marginBottom
=
"10px"
;
}
});
}
/**
...
...
编辑
预览
Markdown
格式
0%
请重试
or
添加新附件
添加附件
取消
您添加了
0
人
到此讨论。请谨慎行事。
先完成此消息的编辑!
取消
想要评论请
注册
或
登录