edeececc by zhangmeng

Merge branch 'dev' into card

2 parents caa89a71 a16e72c8
......@@ -27,25 +27,27 @@
</draggable>
<el-upload
ref="imageUpload"
:multiple="limit > 1"
:accept="accept"
:action="actionUrl || uploadImgUrl"
list-type="picture-card"
:on-success="handleUploadSuccess"
:before-remove="handleDelete"
:before-upload="handleBeforeUpload"
:class="{ hide: fileList.length >= limit }"
:disabled="disabled"
:file-list="fileListInUpload"
:headers="headers"
:limit="limit"
:multiple="limit > 1"
:name="paramName"
:on-error="handleUploadError"
:on-exceed="handleExceed"
:before-remove="handleDelete"
:show-file-list="showFileList"
:headers="headers"
:on-preview="handlePictureCardPreview"
:file-list="fileListInUpload"
:class="{ hide: fileList.length >= limit }"
:name="paramName"
:disabled="disabled"
:accept="accept"
:on-success="handleUploadSuccess"
:show-file-list="showFileList"
list-type="picture-card"
>
<el-icon class="avatar-uploader-icon"><plus /></el-icon>
<el-icon class="avatar-uploader-icon">
<plus />
</el-icon>
</el-upload>
</el-row>
......@@ -65,9 +67,9 @@
<el-dialog
v-model="dialogVisible"
append-to-body
title="预览"
width="800px"
append-to-body
>
<img
:src="dialogImageUrl"
......@@ -81,6 +83,7 @@
import { getToken } from '@/utils/auth'
import { computed, getCurrentInstance, ref, watch, defineProps, defineEmits } from 'vue'
import _ from 'lodash'
import { useStorage } from '@vueuse/core/index'
const props = defineProps({
modelValue: [String, Object, Array],
......@@ -136,13 +139,17 @@ const actionUrl = computed(() => {
})
const { proxy } = getCurrentInstance()
const emit = defineEmits(['update:modelValue', 'response'])
const language = useStorage('language', 0)
const number = ref(0)
const uploadList = ref([])
const dialogImageUrl = ref('')
const dialogVisible = ref(false)
const baseUrl = import.meta.env.VITE_APP_BASE_API
const uploadImgUrl = ref(baseUrl + '/upload/uploadImgToLocalServer') // 上传的图片服务器地址
const headers = ref({ Authorization: 'Bearer ' + getToken() })
const headers = ref({
Authorization: 'Bearer ' + getToken(),
'Content-Language': language.value == 0 ? 'zh_CN' : 'en_US'
})
const fileList = ref([])
const fileListInUpload = ref([])
const showTip = computed(
......@@ -229,11 +236,10 @@ function handleUploadSuccess(res, file) {
proxy.$refs.imageUpload.handleRemove(file)
uploadedSuccessfully()
}
}else {
} else {
proxy?.$modal.closeLoading()
emit('response', res)
}
}
// 删除图片
......@@ -292,11 +298,12 @@ function draggableEnd() {
}
</script>
<style scoped lang="scss">
<style lang="scss" scoped>
// .el-upload--picture-card 控制加号部分
:deep(.hide .el-upload--picture-card) {
display: none;
}
.fileItem {
position: relative;
width: 160px;
......@@ -305,11 +312,13 @@ function draggableEnd() {
margin: 0 20px 20px 0;
float: left;
}
.fileItem img {
width: 100%;
height: 100%;
object-fit: cover;
}
.fileItem .hover-actions {
background: rgba(0, 0, 0, 0.4);
width: 100%;
......@@ -320,6 +329,7 @@ function draggableEnd() {
color: #fff;
transition: top 0.2s;
text-align: center;
span {
cursor: pointer;
font-size: 26px;
......@@ -327,10 +337,12 @@ function draggableEnd() {
margin: 50px 5px;
display: inline-block;
}
span:hover {
background: rgba(255, 255, 255, 0.4);
}
}
.fileItem:hover .hover-actions {
top: 0;
}
......
Styling with Markdown is supported
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!