【fix bug】67874 JImageUpload组件,只能上传图片格式
This commit is contained in:
@@ -10,14 +10,17 @@
|
|||||||
:fileList="fileList"
|
:fileList="fileList"
|
||||||
:beforeUpload="beforeUpload"
|
:beforeUpload="beforeUpload"
|
||||||
:disabled="disabled"
|
:disabled="disabled"
|
||||||
|
:isMultiple="isMultiple"
|
||||||
|
:showUploadList="isMultiple"
|
||||||
v-bind="$attrs"
|
v-bind="$attrs"
|
||||||
v-on="childListeners"
|
v-on="childListeners"
|
||||||
@change="handleChange"
|
@change="handleChange"
|
||||||
@preview="handlePreview"
|
@preview="handlePreview"
|
||||||
:class="[!isMultiple?'imgupload':'', (!isMultiple && picUrl)?'image-upload-single-over':'' ]">
|
:class="!isMultiple?'imgupload':''">
|
||||||
<div>
|
<div :style="{'width':(!isMultiple?'104px':'auto'),'height':(!isMultiple?'104px':'auto')}">
|
||||||
<!--<img v-if="!isMultiple && picUrl" :src="getAvatarView()" style="width:100%;height:100%"/>-->
|
<img v-if="!isMultiple && picUrl" :src="getAvatarView()" style="width:100%;height:100%"/>
|
||||||
<div class="iconp">
|
<!--<img v-if="!isMultiple && picUrl" src="http://localhost:3000/jero-boot/sys/common/download/1379989167782797313?token=eyJ0eXAiOiJKV1QiLCJhbGciOiJIUzI1NiJ9.eyJleHAiOjE2MTc4NTA1OTgsInVzZXJuYW1lIjoiYWRtaW4ifQ.1xRpivI0TzTqAnISJICNm-PoMxSDUITH5uaEcvwheIQ&fullfilename=3.jpeg" style="width:100%;height:100%"/>-->
|
||||||
|
<div v-else class="iconp">
|
||||||
<a-icon :type="uploadLoading ? 'loading' : 'plus'" />
|
<a-icon :type="uploadLoading ? 'loading' : 'plus'" />
|
||||||
<div class="ant-upload-text">{{ text }}</div>
|
<div class="ant-upload-text">{{ text }}</div>
|
||||||
</div>
|
</div>
|
||||||
@@ -30,10 +33,11 @@
|
|||||||
import Vue from 'vue'
|
import Vue from 'vue'
|
||||||
import { ACCESS_TOKEN } from '@/store/mutation-types'
|
import { ACCESS_TOKEN } from '@/store/mutation-types'
|
||||||
import { getFileAccessHttpUrl } from '@/api/manage'
|
import { getFileAccessHttpUrl } from '@/api/manage'
|
||||||
const Base64 = require('js-base64').Base64
|
|
||||||
|
// const Base64 = require('js-base64').Base64
|
||||||
|
|
||||||
const uidGenerator = () => {
|
const uidGenerator = () => {
|
||||||
return '-' + parseInt(Math.random() * 10000 + 1 + '', 10)
|
return '-' + parseInt(Math.random() * 10000 + 1, 10)
|
||||||
}
|
}
|
||||||
export default {
|
export default {
|
||||||
name: 'JImageUpload',
|
name: 'JImageUpload',
|
||||||
@@ -84,6 +88,7 @@ export default {
|
|||||||
computed: {
|
computed: {
|
||||||
// 透传给下级组件的事件,需要排除本组件使用的change事件
|
// 透传给下级组件的事件,需要排除本组件使用的change事件
|
||||||
childListeners () {
|
childListeners () {
|
||||||
|
// const vm = this
|
||||||
const result = Object.assign({},
|
const result = Object.assign({},
|
||||||
this.$listeners
|
this.$listeners
|
||||||
)
|
)
|
||||||
@@ -118,23 +123,15 @@ export default {
|
|||||||
return
|
return
|
||||||
}
|
}
|
||||||
this.picUrl = true
|
this.picUrl = true
|
||||||
const fileList = []
|
|
||||||
const arr = paths.split(',')
|
const arr = paths.split(',')
|
||||||
for (let a = 0; a < arr.length; a++) {
|
for (let a = 0; a < arr.length; a++) {
|
||||||
const url = getFileAccessHttpUrl(arr[a])
|
this.fileList.forEach((item) => {
|
||||||
fileList.push({
|
if (item.url === arr[a]) {
|
||||||
uid: uidGenerator(),
|
item.uid = uidGenerator()
|
||||||
name: arr[a],
|
item.response.status = 'history'
|
||||||
status: 'done',
|
|
||||||
url: url,
|
|
||||||
response: {
|
|
||||||
status: 'history',
|
|
||||||
message: arr[a]
|
|
||||||
}
|
}
|
||||||
})
|
})
|
||||||
}
|
}
|
||||||
|
|
||||||
this.fileList = fileList
|
|
||||||
},
|
},
|
||||||
beforeUpload: function (file) {
|
beforeUpload: function (file) {
|
||||||
const fileType = file.type
|
const fileType = file.type
|
||||||
@@ -147,7 +144,7 @@ export default {
|
|||||||
this.picUrl = false
|
this.picUrl = false
|
||||||
let fileList = info.fileList
|
let fileList = info.fileList
|
||||||
// update-begin-author:wangshuai date:20201022 for:LOWCOD-969 判断number是否大于0和是否多选,返回选定的元素。
|
// update-begin-author:wangshuai date:20201022 for:LOWCOD-969 判断number是否大于0和是否多选,返回选定的元素。
|
||||||
if (this.number > 0) {
|
if (this.number > 0 && this.isMultiple) {
|
||||||
fileList = fileList.slice(-this.number)
|
fileList = fileList.slice(-this.number)
|
||||||
}
|
}
|
||||||
// update-end-author:wangshuai date:20201022 for:LOWCOD-969 判断number是否大于0和是否多选,返回选定的元素。
|
// update-end-author:wangshuai date:20201022 for:LOWCOD-969 判断number是否大于0和是否多选,返回选定的元素。
|
||||||
@@ -156,7 +153,7 @@ export default {
|
|||||||
this.picUrl = true
|
this.picUrl = true
|
||||||
fileList = fileList.map((file) => {
|
fileList = fileList.map((file) => {
|
||||||
if (file.response) {
|
if (file.response) {
|
||||||
file.url = `${file.response.result.id}`
|
file.url = `${file.response.result.id}?token=${Vue.ls.get(ACCESS_TOKEN)}&fullfilename=${file.response.result.fileName}`
|
||||||
}
|
}
|
||||||
return file
|
return file
|
||||||
})
|
})
|
||||||
@@ -175,8 +172,8 @@ export default {
|
|||||||
// 预览
|
// 预览
|
||||||
handlePreview (file) {
|
handlePreview (file) {
|
||||||
if (file && file.url) {
|
if (file && file.url) {
|
||||||
const fileFullUrl = `${window._CONFIG.domianWebSocketURL}/${file.url}`
|
const fileFullUrl = `${window._CONFIG.domianWebSocketURL}/sys/common/download/${file.response.result.id}?token=${Vue.ls.get(ACCESS_TOKEN)}&fullfilename=${file.name}`
|
||||||
const url = `${window._CONFIG.onlinePreviewDomainURL}?url=${encodeURIComponent(Base64.encode(fileFullUrl))}`
|
const url = `${window._CONFIG.onlinePreviewDomainURL}?url=${encodeURIComponent(fileFullUrl)}`
|
||||||
window.open(url)
|
window.open(url)
|
||||||
}
|
}
|
||||||
},
|
},
|
||||||
@@ -193,7 +190,7 @@ export default {
|
|||||||
path = ''
|
path = ''
|
||||||
}
|
}
|
||||||
const arr = []
|
const arr = []
|
||||||
if (!this.isMultiple && uploadFiles && uploadFiles.length > 0) {
|
if (!this.isMultiple) {
|
||||||
arr.push(uploadFiles[uploadFiles.length - 1].url)
|
arr.push(uploadFiles[uploadFiles.length - 1].url)
|
||||||
} else {
|
} else {
|
||||||
for (let a = 0; a < uploadFiles.length; a++) {
|
for (let a = 0; a < uploadFiles.length; a++) {
|
||||||
|
|||||||
Reference in New Issue
Block a user