Skip to content
Toggle navigation
P
Projects
G
Groups
S
Snippets
Help
phsl
/
admin
This project
Loading...
Sign in
Toggle navigation
Go to a project
Project
Repository
Issues
0
Merge Requests
0
Pipelines
Wiki
Snippets
Members
Activity
Graph
Charts
Create a new issue
Jobs
Commits
Issue Boards
Files
Commits
Branches
Tags
Contributors
Graph
Compare
Charts
Commit
f3e89c0c
authored
Dec 03, 2023
by
puhui999
Browse files
Options
Browse Files
Download
Email Patches
Plain Diff
fix:修改 UploadImg 组件预览图片的方式为 createImageViewer,解决商城列表预览图片层级出现错误
parent
fa6ec8f0
Show whitespace changes
Inline
Side-by-side
Showing
1 changed file
with
17 additions
and
16 deletions
+17
-16
src/components/UploadFile/src/UploadImg.vue
+17
-16
No files found.
src/components/UploadFile/src/UploadImg.vue
View file @
f3e89c0c
<
template
>
<
template
>
<div
class=
"upload-box"
>
<div
class=
"upload-box"
>
<el-upload
<el-upload
:action=
"updateUrl"
:id=
"uuid"
:id=
"uuid"
:accept=
"fileType.join(',')"
:action=
"updateUrl"
:before-upload=
"beforeUpload"
:class=
"['upload', drag ? 'no-border' : '']"
:class=
"['upload', drag ? 'no-border' : '']"
:multiple=
"false"
:drag=
"drag"
:show-file-list=
"false"
:headers=
"uploadHeaders"
:headers=
"uploadHeaders"
:before-upload=
"beforeUpload"
:multiple=
"false"
:on-success=
"uploadSuccess"
:on-error=
"uploadError"
:on-error=
"uploadError"
:
drag=
"drag
"
:
on-success=
"uploadSuccess
"
:
accept=
"fileType.join(',')
"
:
show-file-list=
"false
"
>
>
<template
v-if=
"modelValue"
>
<template
v-if=
"modelValue"
>
<img
:src=
"modelValue"
class=
"upload-image"
/>
<img
:src=
"modelValue"
class=
"upload-image"
/>
...
@@ -20,11 +20,11 @@
...
@@ -20,11 +20,11 @@
<Icon
icon=
"ep:edit"
/>
<Icon
icon=
"ep:edit"
/>
<span
v-if=
"showBtnText"
>
{{
t
(
'action.edit'
)
}}
</span>
<span
v-if=
"showBtnText"
>
{{
t
(
'action.edit'
)
}}
</span>
</div>
</div>
<div
class=
"handle-icon"
@
click=
"im
gViewVisible = true
"
>
<div
class=
"handle-icon"
@
click=
"im
agePreview(modelValue)
"
>
<Icon
icon=
"ep:zoom-in"
/>
<Icon
icon=
"ep:zoom-in"
/>
<span
v-if=
"showBtnText"
>
{{
t
(
'action.detail'
)
}}
</span>
<span
v-if=
"showBtnText"
>
{{
t
(
'action.detail'
)
}}
</span>
</div>
</div>
<div
class=
"handle-icon"
@
click=
"deleteImg"
v-if=
"showDelete
"
>
<div
v-if=
"showDelete"
class=
"handle-icon"
@
click=
"deleteImg
"
>
<Icon
icon=
"ep:delete"
/>
<Icon
icon=
"ep:delete"
/>
<span
v-if=
"showBtnText"
>
{{
t
(
'action.del'
)
}}
</span>
<span
v-if=
"showBtnText"
>
{{
t
(
'action.del'
)
}}
</span>
</div>
</div>
...
@@ -42,11 +42,6 @@
...
@@ -42,11 +42,6 @@
<div
class=
"el-upload__tip"
>
<div
class=
"el-upload__tip"
>
<slot
name=
"tip"
></slot>
<slot
name=
"tip"
></slot>
</div>
</div>
<el-image-viewer
v-if=
"imgViewVisible"
@
close=
"imgViewVisible = false"
:url-list=
"[modelValue]"
/>
</div>
</div>
</template>
</template>
...
@@ -56,6 +51,7 @@ import type { UploadProps } from 'element-plus'
...
@@ -56,6 +51,7 @@ import type { UploadProps } from 'element-plus'
import
{
generateUUID
}
from
'@/utils'
import
{
generateUUID
}
from
'@/utils'
import
{
propTypes
}
from
'@/utils/propTypes'
import
{
propTypes
}
from
'@/utils/propTypes'
import
{
getAccessToken
,
getTenantId
}
from
'@/utils/auth'
import
{
getAccessToken
,
getTenantId
}
from
'@/utils/auth'
import
{
createImageViewer
}
from
'@/components/ImageViewer'
defineOptions
({
name
:
'UploadImg'
})
defineOptions
({
name
:
'UploadImg'
})
...
@@ -92,7 +88,12 @@ const message = useMessage() // 消息弹窗
...
@@ -92,7 +88,12 @@ const message = useMessage() // 消息弹窗
// 生成组件唯一id
// 生成组件唯一id
const
uuid
=
ref
(
'id-'
+
generateUUID
())
const
uuid
=
ref
(
'id-'
+
generateUUID
())
// 查看图片
// 查看图片
const
imgViewVisible
=
ref
(
false
)
const
imagePreview
=
(
imgUrl
:
string
)
=>
{
createImageViewer
({
zIndex
:
9999999
,
urlList
:
[
imgUrl
]
})
}
const
emit
=
defineEmits
([
'update:modelValue'
])
const
emit
=
defineEmits
([
'update:modelValue'
])
...
@@ -130,7 +131,7 @@ const uploadError = () => {
...
@@ -130,7 +131,7 @@ const uploadError = () => {
message
.
notifyError
(
'图片上传失败,请您重新上传!'
)
message
.
notifyError
(
'图片上传失败,请您重新上传!'
)
}
}
</
script
>
</
script
>
<
style
scoped
lang=
"scss"
>
<
style
lang=
"scss"
scoped
>
.is-error
{
.is-error
{
.upload
{
.upload
{
:deep(.el-upload),
:deep(.el-upload),
...
...
Write
Preview
Markdown
is supported
0%
Try again
or
attach a new file
Attach a file
Cancel
You are about to add
0
people
to the discussion. Proceed with caution.
Finish editing this message first!
Cancel
Please
register
or
sign in
to comment