修改
This commit is contained in:
parent
c02d3afc58
commit
2c01bd70d1
@ -1,5 +1,6 @@
|
||||
<template>
|
||||
<div class="upload-box">
|
||||
<div class="img-box">
|
||||
<div v-for="(item, index) in fileList" class="items">
|
||||
<img v-if="item.filePath" :src="item.filePath" class="upload-image" />
|
||||
<div class="upload-handle" @click.stop>
|
||||
@ -42,6 +43,10 @@
|
||||
<n-progress type="circle" v-else :percentage="progress" />
|
||||
</n-upload>
|
||||
</div>
|
||||
<div class="n-upload__tip">
|
||||
<slot name="tip"></slot><span v-if="limit">,最多{{ limit }}张</span>
|
||||
</div>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script setup lang="ts">
|
||||
@ -118,7 +123,6 @@
|
||||
*/
|
||||
const fileList = computed({
|
||||
get: () => {
|
||||
console.log(props.fileLists);
|
||||
return props.fileLists;
|
||||
},
|
||||
set: (val) => {
|
||||
@ -141,8 +145,6 @@
|
||||
const handleHttpUpload = async (options) => {
|
||||
loading.value = true;
|
||||
try {
|
||||
// 设置允许做大上传张数验证
|
||||
onExceed();
|
||||
// 上传文件
|
||||
const formData = new FormData();
|
||||
formData.append('file', options.file.file);
|
||||
@ -194,7 +196,6 @@
|
||||
* @param options 参数
|
||||
*/
|
||||
const handleHttpUploads = async (options: UploadRequestOptions) => {
|
||||
console.log(options);
|
||||
const configData = await getOssConfig();
|
||||
let date = new Date();
|
||||
let year = date.getFullYear();
|
||||
@ -214,8 +215,6 @@
|
||||
let filePath = props.name + '/' + year + '/' + month + '/' + day + '/' + fileName;
|
||||
loading.value = true;
|
||||
try {
|
||||
// 设置允许做大上传张数验证
|
||||
onExceed();
|
||||
// 文件请求头
|
||||
const headers = {
|
||||
'Access-Control-Allow-Origin': '*',
|
||||
@ -379,6 +378,8 @@
|
||||
<style scoped lang="less">
|
||||
.upload-box {
|
||||
position: relative;
|
||||
|
||||
.img-box {
|
||||
display: flex;
|
||||
flex-wrap: wrap;
|
||||
> div {
|
||||
@ -400,25 +401,6 @@
|
||||
}
|
||||
}
|
||||
}
|
||||
:deep(.n-upload) {
|
||||
position: relative;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
width: v-bind(width);
|
||||
height: v-bind(height);
|
||||
overflow: hidden;
|
||||
border-radius: 4px;
|
||||
border: 1px dashed #d9d9d9;
|
||||
cursor: pointer;
|
||||
.n-upload-trigger {
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
}
|
||||
}
|
||||
.upload-image {
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
@ -453,4 +435,30 @@
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
:deep(.n-upload) {
|
||||
position: relative;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
width: v-bind(width);
|
||||
height: v-bind(height);
|
||||
overflow: hidden;
|
||||
border-radius: 4px;
|
||||
border: 1px dashed #d9d9d9;
|
||||
cursor: pointer;
|
||||
.n-upload-trigger {
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
}
|
||||
}
|
||||
.n-upload__tip {
|
||||
line-height: 18px;
|
||||
font-size: 12px;
|
||||
margin-top: 7px;
|
||||
}
|
||||
}
|
||||
</style>
|
||||
|
@ -79,7 +79,9 @@
|
||||
:multiple="true"
|
||||
:fileLists="item.filePath"
|
||||
:z-index="index"
|
||||
/>
|
||||
>
|
||||
<template #tip>支持扩展名: jpg png jpeg;文件大小不超过200M</template>
|
||||
</UploadImgs>
|
||||
</template>
|
||||
<template v-else-if="item.type == 'file'">
|
||||
<UploadFile
|
||||
|
Loading…
Reference in New Issue
Block a user