<template>
|
<div class="pl30">
|
<div class="upload-content">
|
<b-btn variant="primary">上传</b-btn>
|
<input type="file" @change="handleUpLoad" />
|
</div>
|
<div class="upload-name-content" v-if="file">
|
<p :key="item" v-for="(item, index) of file">
|
<span>{{item}}</span>
|
<span class="ion ion-md-close-circle" @click="handleDelFile(index)"></span>
|
</p>
|
</div>
|
</div>
|
</template>
|
<script>
|
import axios from 'axios'
|
export default {
|
name: 'uploadCommon',
|
props: {
|
filesObj: {
|
default: {},
|
type: Object
|
}
|
},
|
data() {
|
return {
|
userInfo: this.$store.getters.basicUserInfo,
|
file: [],
|
fileIds: []
|
}
|
},
|
computed(){
|
|
},
|
methods: {
|
// 上传附件
|
async handleUpLoad(e) {
|
this.file = [e.target.files[0].name, ...this.file]
|
let file = e.target.files[0]
|
const fd = new FormData()
|
const token = JSON.parse(
|
sessionStorage.getItem('loginedInfo')
|
).access_token.split(' ')[1]
|
fd.append('file', file)
|
fd.append('fileSource', 'FDFS')
|
let res = await axios({
|
method: 'post',
|
url: `data/api-f/files?access_token=${token}`,
|
data: fd
|
})
|
if (res) {
|
this.fileIds = [res.data.id, ...this.fileIds]
|
console.log(res.data.id, 'this.fileIds', this.fileIds)
|
}
|
},
|
// 删除附件
|
handleDelFile(index) {
|
// TODO
|
this.file.splice(index, 1)
|
this.fileIds.splice(index, 1)
|
}
|
}
|
}
|
</script>
|
|
<style lang="scss" >
|
.upload-content {
|
position: relative;
|
input[type='file'] {
|
position: absolute;
|
opacity: 0;
|
width: 67px;
|
height: 38px;
|
left: 0;
|
}
|
}
|
.upload-name-content {
|
line-height: 24px;
|
p {
|
margin-bottom: 0;
|
&:hover span {
|
color: red;
|
}
|
}
|
}
|
</style>
|
