diff --git a/pinry-spa/src/components/pin_edit/FileUpload.vue b/pinry-spa/src/components/pin_edit/FileUpload.vue index 54c6409..7078a3e 100644 --- a/pinry-spa/src/components/pin_edit/FileUpload.vue +++ b/pinry-spa/src/components/pin_edit/FileUpload.vue @@ -49,19 +49,11 @@ export default { }, watch: { dropFile(newFile) { - this.$emit('imageUploadProcessing'); - this.loading = true; - API.Pin.uploadImage(newFile).then( - (resp) => { - this.uploadedImage = resp.data; - this.loading = false; - this.$emit('imageUploadSucceed', this.uploadedImage.id); - }, - () => { - this.loading = false; - this.$emit('imageUploadFailed'); - }, - ); + this.uploadFile(newFile); + }, + previewImageURL() { + if (!this.previewExists()) return; + this.uploadURL(this.previewImageURL); }, }, computed: { @@ -79,6 +71,31 @@ export default { previewExists() { return this.previewImageURL !== null && this.previewImageURL !== ''; }, + uploadFile(newFile) { + this.$emit('imageUploadProcessing'); + this.loading = true; + API.Pin.uploadImage(newFile).then( + (resp) => { + this.uploadedImage = resp.data; + this.loading = false; + this.$emit('imageUploadSucceed', this.uploadedImage.id); + }, + () => { + this.loading = false; + this.$emit('imageUploadFailed'); + }, + ); + }, + uploadURL(url) { + const filename = new URL(url).pathname.split('/').pop(); + fetch(url).then(r => r.blob()).then((blob) => { + this.uploadFile(new File([blob], filename)); + }); + }, + }, + mounted() { + if (!this.previewExists()) return; + this.uploadURL(this.previewImageURL); }, };