Skip to content

Instantly share code, notes, and snippets.

@sofyan-ahmad
Last active April 20, 2020 02:52
Show Gist options
  • Save sofyan-ahmad/d2c98f018b6626951db1ced2a7555506 to your computer and use it in GitHub Desktop.
Save sofyan-ahmad/d2c98f018b6626951db1ced2a7555506 to your computer and use it in GitHub Desktop.
<template>
<div>
<dropzone
ref="product-image"
v-model="tempProductData.image"
:label="$t('table.image')"
:signed-api="signedAPIRequest"
/>
<el-button @click="uploadImage">Upload</el-button>
</div>
</template>
<script lang="ts">
import { Component, Vue, Ref } from 'vue-property-decorator';
import Dropzone from '../../components/UploadImage/index.vue';
@Component({
name: 'Product',
components: {
Dropzone
},
filters: {}
})
export default class extends Vue {
@Ref('product-image') readonly dropzone!: Dropzone;
signedAPIRequest: string = `{your lambda URL}/products/signedUrl`;
imageUrl: string =''
async uploadImage() {
try {
// upload image
const url = await this.dropzone.submit();
this.$notify({
title: 'Success',
message: 'Image uploaded into ' + url,
type: 'success',
duration: 2000
});
} catch (err) {
this.$notify({
title: 'Create Failed!',
message:
err.data?.error ||
err.data ||
err
type: 'error',
duration: 2000
});
}
}
}
</script>
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment