|
@@ -1,284 +1,302 @@
|
|
|
<template>
|
|
|
- <div>
|
|
|
- <Upload type="drag" action="" multiple :before-upload="beforeUpload" class="upload-wrap">
|
|
|
- <p style="margin:20px 0px; margin-top:80px;font-size:30px;">{{$t('teachContent.uploadText')}}</p>
|
|
|
- <Icon type="ios-cloud-upload" size="80" style="margin-bottom:80px;" />
|
|
|
- </Upload>
|
|
|
- <div class="upload-file-box">
|
|
|
- <div class="upload-file-item" v-for="(item,index) in uploadedList">
|
|
|
- <Icon type="ios-folder" />
|
|
|
- <p class="upload-file-name">{{item.fileName}}</p>
|
|
|
- <img width="25" style="float:right;" src="@/assets/loading/loading3.svg" v-if="item.status == 0"/>
|
|
|
- <Icon type="md-checkmark" style="float:right;" color="aqua" size="20" v-else-if="item.status == 1"/>
|
|
|
- <Icon type="md-close" style="float:right;" color="red" size="20" v-else-if="item.status == 2"/>
|
|
|
- </div>
|
|
|
+ <div>
|
|
|
+ <Upload type="drag" action="" multiple :before-upload="beforeUpload" class="upload-wrap" :format="format" :max-size="maxSize" :on-format-error="onFormatError" :on-exceeded-size="sizeError">
|
|
|
+ <p style="margin:20px 0px; margin-top:80px;font-size:30px;">{{$t('teachContent.uploadText')}}</p>
|
|
|
+ <Icon type="ios-cloud-upload" size="80" style="margin-bottom:80px;" />
|
|
|
+ </Upload>
|
|
|
+ <div class="upload-file-box">
|
|
|
+ <div class="upload-file-item" v-for="(item,index) in uploadedList">
|
|
|
+ <Icon type="ios-folder" />
|
|
|
+ <p class="upload-file-name">{{item.fileName}}</p>
|
|
|
+ <img width="25" style="float:right;" src="@/assets/loading/loading3.svg" v-if="item.status == 0" />
|
|
|
+ <Icon type="md-checkmark" style="float:right;" color="aqua" size="20" v-else-if="item.status == 1" />
|
|
|
+ <Icon type="md-close" style="float:right;" color="red" size="20" v-else-if="item.status == 2" />
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
</div>
|
|
|
- </div>
|
|
|
</template>
|
|
|
<script>
|
|
|
- import sha1 from 'js-sha1'
|
|
|
- require('@/utils/azure-storage-blob.js')
|
|
|
- export default {
|
|
|
- data() {
|
|
|
- return {
|
|
|
- urlString: '',
|
|
|
- containerURL: undefined,
|
|
|
- sasString: '',
|
|
|
- uploadedList: [],
|
|
|
- contentTypes: [
|
|
|
- ['JPG', 'JPEG', 'PNG', 'GIF'],
|
|
|
- ['AVI', 'MP4'],
|
|
|
- ['PPT', 'PPTX', 'DOC', 'DOCX', 'PDF', 'XLS', 'XLSX', 'HTE', 'HETX']
|
|
|
- ]
|
|
|
- }
|
|
|
- },
|
|
|
- props: {
|
|
|
- accountName: {
|
|
|
- default: 'teammodelostest',
|
|
|
- type: String
|
|
|
- },
|
|
|
- containerName: {
|
|
|
- default: 'teammodelos',
|
|
|
- type: String
|
|
|
- },
|
|
|
- pathName: {
|
|
|
- default: '',
|
|
|
- type: String
|
|
|
- },
|
|
|
- quality: {
|
|
|
- default: 0.2,
|
|
|
- type: Number
|
|
|
- }
|
|
|
+ import sha1 from 'js-sha1'
|
|
|
+ require('@/utils/azure-storage-blob.js')
|
|
|
+ export default {
|
|
|
+ data() {
|
|
|
+ return {
|
|
|
+ urlString: '',
|
|
|
+ containerURL: undefined,
|
|
|
+ sasString: '',
|
|
|
+ uploadedList: [],
|
|
|
+ contentTypes: [
|
|
|
+ ['JPG', 'JPEG', 'PNG', 'GIF'],
|
|
|
+ ['AVI', 'MP4'],
|
|
|
+ ['PPT', 'PPTX', 'DOC', 'DOCX', 'PDF', 'XLS', 'XLSX', 'HTE', 'HETX']
|
|
|
+ ],
|
|
|
|
|
|
- },
|
|
|
- methods: {
|
|
|
- checkSize() {
|
|
|
-
|
|
|
- },
|
|
|
- initBlob() {
|
|
|
- this.containerURL = new window.azblob.ContainerURL(
|
|
|
- // `https://${this.accountName}.blob.core.chinacloudapi.cn/${this.containerName}/${this.pathName}?${this.sasString}`,
|
|
|
- this.urlString + '/' + this.pathName + this.sasString,
|
|
|
- window.azblob.StorageURL.newPipeline(new window.azblob.AnonymousCredential())
|
|
|
- )
|
|
|
- },
|
|
|
- dataURLtoFile(dataurl, filename) {
|
|
|
- var arr = dataurl.split(','); var mime = arr[0].match(/:(.*?);/)[1]
|
|
|
- var bstr = atob(arr[1]); var n = bstr.length; var u8arr = new Uint8Array(n)
|
|
|
- while (n--) {
|
|
|
- u8arr[n] = bstr.charCodeAt(n)
|
|
|
- }
|
|
|
- return new File([u8arr], filename, { type: mime })
|
|
|
- },
|
|
|
- compressFile(file, fileInfo) {
|
|
|
- if (fileInfo.type == 'picture') {
|
|
|
- let reader = new FileReader()
|
|
|
- reader.readAsDataURL(file)
|
|
|
- reader.onload = (e) => {
|
|
|
- let dataUrl = e.target.result
|
|
|
- let img = new Image()
|
|
|
- img.src = dataUrl
|
|
|
- img.onload = () => {
|
|
|
- let canvas = document.createElement('canvas')
|
|
|
- canvas.width = 300
|
|
|
- canvas.height = 300 * img.height / img.width
|
|
|
- let ctx = canvas.getContext('2d')
|
|
|
- ctx.drawImage(img, 0, 0, img.width, img.height, 0, 0, canvas.width, canvas.height)
|
|
|
- let newImgData = canvas.toDataURL(file.type, this.quality)
|
|
|
- var resultFile = this.dataURLtoFile(newImgData, file.name)
|
|
|
- this.initBlob()
|
|
|
- const compressBlobURL = window.azblob.BlockBlobURL.fromContainerURL(
|
|
|
- this.containerURL,
|
|
|
- 'compress' + file.name
|
|
|
- )
|
|
|
- let options = {
|
|
|
- blockSize: 10 * 1024 * 1024
|
|
|
- }
|
|
|
- window.azblob.uploadBrowserDataToBlockBlob(
|
|
|
- window.azblob.Aborter.none,
|
|
|
- resultFile,
|
|
|
- compressBlobURL,
|
|
|
- options
|
|
|
- ).then(
|
|
|
- res => {
|
|
|
- // fileInfo['compressUrl'] = `https://${this.accountName}.blob.core.chinacloudapi.cn/${this.containerName}/${this.pathName}/compress${file.name}`
|
|
|
- fileInfo['compressUrl'] = this.urlString + '/' + this.pathName + '/compress' + file.name
|
|
|
- this.$emit('successData', fileInfo)
|
|
|
- },
|
|
|
- err => {
|
|
|
- fileInfo['status'] = 2
|
|
|
- console.log(err)
|
|
|
- }
|
|
|
- )
|
|
|
}
|
|
|
- }
|
|
|
- } else {
|
|
|
- let video = document.createElement('video')
|
|
|
- video.setAttribute('width', '300')
|
|
|
- video.setAttribute('controls', 'controls')
|
|
|
- video.setAttribute('crossOrigin', '*')
|
|
|
- video.setAttribute('src', fileInfo.blobUrl + this.sasString)
|
|
|
- video.addEventListener('loadeddata', () => {
|
|
|
- let canvas = document.createElement('canvas')
|
|
|
- canvas.width = 300
|
|
|
- canvas.height = 300 * video.videoHeight / video.videoWidth
|
|
|
- let ctx = canvas.getContext('2d')
|
|
|
- ctx.drawImage(video, 0, 0, video.videoWidth, video.videoHeight, 0, 0, canvas.width, canvas.height)
|
|
|
- let newVideoData = canvas.toDataURL('image/png', this.quality)
|
|
|
- let resultFile = this.dataURLtoFile(newVideoData, file.name)
|
|
|
- this.initBlob()
|
|
|
- let posterName = 'compress' + file.name.replace(fileInfo.extension, 'png')
|
|
|
- const compressBlobURL = window.azblob.BlockBlobURL.fromContainerURL(
|
|
|
- this.containerURL,
|
|
|
- posterName
|
|
|
- )
|
|
|
- window.azblob.uploadBrowserDataToBlockBlob(
|
|
|
- window.azblob.Aborter.none,
|
|
|
- resultFile,
|
|
|
- compressBlobURL
|
|
|
- ).then(
|
|
|
- res => {
|
|
|
- // fileInfo['compressUrl'] = `https://${this.accountName}.blob.core.chinacloudapi.cn/${this.containerName}/${this.pathName}/${posterName}`
|
|
|
- fileInfo['compressUrl'] = this.urlString + '/' + this.pathName + '/' + posterName
|
|
|
- this.$emit('successData', fileInfo)
|
|
|
- },
|
|
|
- err => {
|
|
|
- fileInfo['status'] = 2
|
|
|
- console.log(err)
|
|
|
- }
|
|
|
- )
|
|
|
- })
|
|
|
- }
|
|
|
- },
|
|
|
- uploadToBlob(file) {
|
|
|
- const blockBlobURL = window.azblob.BlockBlobURL.fromContainerURL(
|
|
|
- this.containerURL,
|
|
|
- file.name
|
|
|
- )
|
|
|
- let fileItem = {}
|
|
|
- fileItem['fileName'] = file.name
|
|
|
- // fileItem['blobUrl'] = `https://${this.accountName}.blob.core.chinacloudapi.cn/${this.containerName}/${this.pathName}/${file.name}`
|
|
|
- fileItem['blobUrl'] = this.urlString + '/' + this.pathName + '/' + file.name
|
|
|
- fileItem['extension'] = file.name.substring(file.name.lastIndexOf('.') + 1)
|
|
|
- fileItem['size'] = file.size
|
|
|
- fileItem['status'] = 0
|
|
|
- fileItem['contentType'] = file.type
|
|
|
- let type = 'other'
|
|
|
- for (let item in this.contentTypes) {
|
|
|
- if (this.contentTypes[item].indexOf(fileItem.extension.toUpperCase()) !== -1) {
|
|
|
- switch (true) {
|
|
|
- case item == 0:
|
|
|
- type = 'picture'
|
|
|
- break
|
|
|
- case item == 1:
|
|
|
- type = 'video'
|
|
|
- break
|
|
|
- case item == 2:
|
|
|
- type = 'document'
|
|
|
- break
|
|
|
- default:
|
|
|
- break
|
|
|
+ },
|
|
|
+ props: {
|
|
|
+ accountName: {
|
|
|
+ default: 'teammodelostest',
|
|
|
+ type: String
|
|
|
+ },
|
|
|
+ containerName: {
|
|
|
+ default: 'teammodelos',
|
|
|
+ type: String
|
|
|
+ },
|
|
|
+ pathName: {
|
|
|
+ default: '',
|
|
|
+ type: String
|
|
|
+ },
|
|
|
+ quality: {
|
|
|
+ default: 0.2,
|
|
|
+ type: Number
|
|
|
+ },
|
|
|
+ maxSize: {
|
|
|
+ default: 4,
|
|
|
+ type: Number
|
|
|
+ },
|
|
|
+ format: {
|
|
|
+ default: () => {
|
|
|
+ return []
|
|
|
+ },
|
|
|
+ type: Array
|
|
|
}
|
|
|
- break
|
|
|
- }
|
|
|
- }
|
|
|
- fileItem['type'] = type
|
|
|
- this.uploadedList.push(fileItem)
|
|
|
- window.azblob.uploadBrowserDataToBlockBlob(
|
|
|
- window.azblob.Aborter.none,
|
|
|
- file,
|
|
|
- blockBlobURL
|
|
|
- ).then(
|
|
|
- res => {
|
|
|
- let reader = new FileReader()
|
|
|
- reader.readAsArrayBuffer(file)
|
|
|
- // reader.readAsArrayBuffer(file)
|
|
|
- reader.onload = (ev) => {
|
|
|
- try {
|
|
|
- let fileRes = ev.target.result
|
|
|
- let str = sha1(fileRes)
|
|
|
- let index = this.getIndex(this.uploadedList, fileItem)
|
|
|
- this.uploadedList[index].status = 1
|
|
|
- this.uploadedList[index]['createTime'] = Date.parse(res.lastModified)
|
|
|
- this.uploadedList[index]['sha1Code'] = str
|
|
|
- if (this.uploadedList[index].type == 'picture' || this.uploadedList[index].type == 'video') {
|
|
|
- this.compressFile(file, this.uploadedList[index])
|
|
|
+ },
|
|
|
+ methods: {
|
|
|
+ onFormatError() {
|
|
|
+ this.$Message.error("含不支持的文件类型")
|
|
|
+ },
|
|
|
+ sizeError() {
|
|
|
+ this.$Message.error("文件大小超出限制")
|
|
|
+ },
|
|
|
+ checkSize() {
|
|
|
+
|
|
|
+ },
|
|
|
+ initBlob() {
|
|
|
+ this.containerURL = new window.azblob.ContainerURL(
|
|
|
+ // `https://${this.accountName}.blob.core.chinacloudapi.cn/${this.containerName}/${this.pathName}?${this.sasString}`,
|
|
|
+ this.urlString + '/' + this.pathName + this.sasString,
|
|
|
+ window.azblob.StorageURL.newPipeline(new window.azblob.AnonymousCredential())
|
|
|
+ )
|
|
|
+ },
|
|
|
+ dataURLtoFile(dataurl, filename) {
|
|
|
+ var arr = dataurl.split(','); var mime = arr[0].match(/:(.*?);/)[1]
|
|
|
+ var bstr = atob(arr[1]); var n = bstr.length; var u8arr = new Uint8Array(n)
|
|
|
+ while (n--) {
|
|
|
+ u8arr[n] = bstr.charCodeAt(n)
|
|
|
+ }
|
|
|
+ return new File([u8arr], filename, { type: mime })
|
|
|
+ },
|
|
|
+ compressFile(file, fileInfo) {
|
|
|
+ if (fileInfo.type == 'picture') {
|
|
|
+ let reader = new FileReader()
|
|
|
+ reader.readAsDataURL(file)
|
|
|
+ reader.onload = (e) => {
|
|
|
+ let dataUrl = e.target.result
|
|
|
+ let img = new Image()
|
|
|
+ img.src = dataUrl
|
|
|
+ img.onload = () => {
|
|
|
+ let canvas = document.createElement('canvas')
|
|
|
+ canvas.width = 300
|
|
|
+ canvas.height = 300 * img.height / img.width
|
|
|
+ let ctx = canvas.getContext('2d')
|
|
|
+ ctx.drawImage(img, 0, 0, img.width, img.height, 0, 0, canvas.width, canvas.height)
|
|
|
+ let newImgData = canvas.toDataURL(file.type, this.quality)
|
|
|
+ var resultFile = this.dataURLtoFile(newImgData, file.name)
|
|
|
+ this.initBlob()
|
|
|
+ const compressBlobURL = window.azblob.BlockBlobURL.fromContainerURL(
|
|
|
+ this.containerURL,
|
|
|
+ 'compress' + file.name
|
|
|
+ )
|
|
|
+ let options = {
|
|
|
+ blockSize: 10 * 1024 * 1024
|
|
|
+ }
|
|
|
+ window.azblob.uploadBrowserDataToBlockBlob(
|
|
|
+ window.azblob.Aborter.none,
|
|
|
+ resultFile,
|
|
|
+ compressBlobURL,
|
|
|
+ options
|
|
|
+ ).then(
|
|
|
+ res => {
|
|
|
+ // fileInfo['compressUrl'] = `https://${this.accountName}.blob.core.chinacloudapi.cn/${this.containerName}/${this.pathName}/compress${file.name}`
|
|
|
+ fileInfo['compressUrl'] = this.urlString + '/' + this.pathName + '/compress' + file.name
|
|
|
+ this.$emit('successData', fileInfo)
|
|
|
+ },
|
|
|
+ err => {
|
|
|
+ fileInfo['status'] = 2
|
|
|
+ console.log(err)
|
|
|
+ }
|
|
|
+ )
|
|
|
+ }
|
|
|
+ }
|
|
|
} else {
|
|
|
- this.$emit('successData', this.uploadedList[index])
|
|
|
+ let video = document.createElement('video')
|
|
|
+ video.setAttribute('width', '300')
|
|
|
+ video.setAttribute('controls', 'controls')
|
|
|
+ video.setAttribute('crossOrigin', '*')
|
|
|
+ video.setAttribute('src', fileInfo.blobUrl + this.sasString)
|
|
|
+ video.addEventListener('loadeddata', () => {
|
|
|
+ let canvas = document.createElement('canvas')
|
|
|
+ canvas.width = 300
|
|
|
+ canvas.height = 300 * video.videoHeight / video.videoWidth
|
|
|
+ let ctx = canvas.getContext('2d')
|
|
|
+ ctx.drawImage(video, 0, 0, video.videoWidth, video.videoHeight, 0, 0, canvas.width, canvas.height)
|
|
|
+ let newVideoData = canvas.toDataURL('image/png', this.quality)
|
|
|
+ let resultFile = this.dataURLtoFile(newVideoData, file.name)
|
|
|
+ this.initBlob()
|
|
|
+ let posterName = 'compress' + file.name.replace(fileInfo.extension, 'png')
|
|
|
+ const compressBlobURL = window.azblob.BlockBlobURL.fromContainerURL(
|
|
|
+ this.containerURL,
|
|
|
+ posterName
|
|
|
+ )
|
|
|
+ window.azblob.uploadBrowserDataToBlockBlob(
|
|
|
+ window.azblob.Aborter.none,
|
|
|
+ resultFile,
|
|
|
+ compressBlobURL
|
|
|
+ ).then(
|
|
|
+ res => {
|
|
|
+ // fileInfo['compressUrl'] = `https://${this.accountName}.blob.core.chinacloudapi.cn/${this.containerName}/${this.pathName}/${posterName}`
|
|
|
+ fileInfo['compressUrl'] = this.urlString + '/' + this.pathName + '/' + posterName
|
|
|
+ this.$emit('successData', fileInfo)
|
|
|
+ },
|
|
|
+ err => {
|
|
|
+ fileInfo['status'] = 2
|
|
|
+ console.log(err)
|
|
|
+ }
|
|
|
+ )
|
|
|
+ })
|
|
|
}
|
|
|
- } catch (e) {
|
|
|
- console.log(e)
|
|
|
- }
|
|
|
- }
|
|
|
- },
|
|
|
- err => {
|
|
|
- fileItem['status'] = 2
|
|
|
- console.log(err)
|
|
|
- }
|
|
|
- )
|
|
|
- return false
|
|
|
- },
|
|
|
- beforeUpload(file) {
|
|
|
- let url = file.name
|
|
|
- this.$api.uploadFile.getContainerSAS().then(
|
|
|
- (res) => {
|
|
|
- if (res.error == null) {
|
|
|
- this.sasString = res.result.data.SAS
|
|
|
- this.urlString = res.result.data.Url
|
|
|
- this.initBlob()
|
|
|
- this.uploadToBlob(file)
|
|
|
- } else {
|
|
|
- alert('API error!')
|
|
|
+ },
|
|
|
+ uploadToBlob(file) {
|
|
|
+ const blockBlobURL = window.azblob.BlockBlobURL.fromContainerURL(
|
|
|
+ this.containerURL,
|
|
|
+ file.name
|
|
|
+ )
|
|
|
+ let fileItem = {}
|
|
|
+ fileItem['fileName'] = file.name
|
|
|
+ // fileItem['blobUrl'] = `https://${this.accountName}.blob.core.chinacloudapi.cn/${this.containerName}/${this.pathName}/${file.name}`
|
|
|
+ fileItem['blobUrl'] = this.urlString + '/' + this.pathName + '/' + file.name
|
|
|
+ fileItem['extension'] = file.name.substring(file.name.lastIndexOf('.') + 1)
|
|
|
+ fileItem['size'] = file.size
|
|
|
+ fileItem['status'] = 0
|
|
|
+ fileItem['contentType'] = file.type
|
|
|
+ let type = 'other'
|
|
|
+ for (let item in this.contentTypes) {
|
|
|
+ if (this.contentTypes[item].indexOf(fileItem.extension.toUpperCase()) !== -1) {
|
|
|
+ switch (true) {
|
|
|
+ case item == 0:
|
|
|
+ type = 'picture'
|
|
|
+ break
|
|
|
+ case item == 1:
|
|
|
+ type = 'video'
|
|
|
+ break
|
|
|
+ case item == 2:
|
|
|
+ type = 'document'
|
|
|
+ break
|
|
|
+ default:
|
|
|
+ break
|
|
|
+ }
|
|
|
+ break
|
|
|
+ }
|
|
|
+ }
|
|
|
+ fileItem['type'] = type
|
|
|
+ this.uploadedList.push(fileItem)
|
|
|
+ window.azblob.uploadBrowserDataToBlockBlob(
|
|
|
+ window.azblob.Aborter.none,
|
|
|
+ file,
|
|
|
+ blockBlobURL
|
|
|
+ ).then(
|
|
|
+ res => {
|
|
|
+ let reader = new FileReader()
|
|
|
+ reader.readAsArrayBuffer(file)
|
|
|
+ // reader.readAsArrayBuffer(file)
|
|
|
+ reader.onload = (ev) => {
|
|
|
+ try {
|
|
|
+ let fileRes = ev.target.result
|
|
|
+ let str = sha1(fileRes)
|
|
|
+ let index = this.getIndex(this.uploadedList, fileItem)
|
|
|
+ this.uploadedList[index].status = 1
|
|
|
+ this.uploadedList[index]['createTime'] = Date.parse(res.lastModified)
|
|
|
+ this.uploadedList[index]['sha1Code'] = str
|
|
|
+ if (this.uploadedList[index].type == 'picture' || this.uploadedList[index].type == 'video') {
|
|
|
+ this.compressFile(file, this.uploadedList[index])
|
|
|
+ } else {
|
|
|
+ this.$emit('successData', this.uploadedList[index])
|
|
|
+ }
|
|
|
+ } catch (e) {
|
|
|
+ console.log(e)
|
|
|
+ }
|
|
|
+ }
|
|
|
+ },
|
|
|
+ err => {
|
|
|
+ fileItem['status'] = 2
|
|
|
+ console.log(err)
|
|
|
+ }
|
|
|
+ )
|
|
|
+ return false
|
|
|
+ },
|
|
|
+ beforeUpload(file) {
|
|
|
+ let url = file.name
|
|
|
+ this.$api.uploadFile.getContainerSAS().then(
|
|
|
+ (res) => {
|
|
|
+ if (res.error == null) {
|
|
|
+ this.sasString = res.result.data.SAS
|
|
|
+ this.urlString = res.result.data.Url
|
|
|
+ this.initBlob()
|
|
|
+ this.uploadToBlob(file)
|
|
|
+ } else {
|
|
|
+ alert('API error!')
|
|
|
+ }
|
|
|
+ },
|
|
|
+ (err) => {
|
|
|
+ alert('API error!')
|
|
|
+ }
|
|
|
+ )
|
|
|
+ return false
|
|
|
+ },
|
|
|
+ getIndex(_arr, _obj) {
|
|
|
+ var len = _arr.length
|
|
|
+ for (let i = 0; i < len; i++) {
|
|
|
+ if (this.isObjEqual(_arr[i], _obj)) {
|
|
|
+ return parseInt(i)
|
|
|
+ }
|
|
|
+ }
|
|
|
+ return -1
|
|
|
+ },
|
|
|
+ isObjEqual(o1, o2) {
|
|
|
+ var props1 = Object.keys(o1)
|
|
|
+ var props2 = Object.keys(o2)
|
|
|
+ if (props1.length != props2.length) {
|
|
|
+ return false
|
|
|
+ }
|
|
|
+ for (var i = 0, max = props1.length; i < max; i++) {
|
|
|
+ var propName = props1[i]
|
|
|
+ if (o1[propName] !== o2[propName]) {
|
|
|
+ return false
|
|
|
+ }
|
|
|
+ }
|
|
|
+ return true
|
|
|
}
|
|
|
- },
|
|
|
- (err) => {
|
|
|
- alert('API error!')
|
|
|
- }
|
|
|
- )
|
|
|
- return false
|
|
|
- },
|
|
|
- getIndex(_arr, _obj) {
|
|
|
- var len = _arr.length
|
|
|
- for (let i = 0; i < len; i++) {
|
|
|
- if (this.isObjEqual(_arr[i], _obj)) {
|
|
|
- return parseInt(i)
|
|
|
- }
|
|
|
- }
|
|
|
- return -1
|
|
|
- },
|
|
|
- isObjEqual(o1, o2) {
|
|
|
- var props1 = Object.keys(o1)
|
|
|
- var props2 = Object.keys(o2)
|
|
|
- if (props1.length != props2.length) {
|
|
|
- return false
|
|
|
- }
|
|
|
- for (var i = 0, max = props1.length; i < max; i++) {
|
|
|
- var propName = props1[i]
|
|
|
- if (o1[propName] !== o2[propName]) {
|
|
|
- return false
|
|
|
- }
|
|
|
- }
|
|
|
- return true
|
|
|
- }
|
|
|
- },
|
|
|
- mounted() {
|
|
|
- this.uploadedList = []
|
|
|
- },
|
|
|
- created() {}
|
|
|
- }
|
|
|
+ },
|
|
|
+ mounted() {
|
|
|
+ this.uploadedList = []
|
|
|
+ },
|
|
|
+ created() { }
|
|
|
+ }
|
|
|
|
|
|
</script>
|
|
|
<style scoped>
|
|
|
- .upload-file-item {
|
|
|
- cursor:pointer;
|
|
|
- color:#909090;
|
|
|
- margin-top:5px;
|
|
|
- }
|
|
|
- .upload-file-item:hover {
|
|
|
- color:white;
|
|
|
+ .upload-file-item {
|
|
|
+ cursor: pointer;
|
|
|
+ color: #909090;
|
|
|
+ margin-top: 5px;
|
|
|
+ }
|
|
|
+
|
|
|
+ .upload-file-item:hover {
|
|
|
+ color: white;
|
|
|
+ }
|
|
|
+
|
|
|
+ .upload-file-name {
|
|
|
+ display: inline-block;
|
|
|
+ margin-left: 10px;
|
|
|
}
|
|
|
- .upload-file-name {
|
|
|
- display:inline-block;
|
|
|
- margin-left:10px;
|
|
|
- }
|
|
|
</style>
|