diff options
Diffstat (limited to 'app/assets/javascripts/design_management_legacy/components/upload/button.vue')
-rw-r--r-- | app/assets/javascripts/design_management_legacy/components/upload/button.vue | 58 |
1 files changed, 58 insertions, 0 deletions
diff --git a/app/assets/javascripts/design_management_legacy/components/upload/button.vue b/app/assets/javascripts/design_management_legacy/components/upload/button.vue new file mode 100644 index 00000000000..68555104a3c --- /dev/null +++ b/app/assets/javascripts/design_management_legacy/components/upload/button.vue @@ -0,0 +1,58 @@ +<script> +import { GlDeprecatedButton, GlLoadingIcon, GlTooltipDirective } from '@gitlab/ui'; +import { VALID_DESIGN_FILE_MIMETYPE } from '../../constants'; + +export default { + components: { + GlDeprecatedButton, + GlLoadingIcon, + }, + directives: { + GlTooltip: GlTooltipDirective, + }, + props: { + isSaving: { + type: Boolean, + required: true, + }, + }, + methods: { + openFileUpload() { + this.$refs.fileUpload.click(); + }, + onFileUploadChange(e) { + this.$emit('upload', e.target.files); + }, + }, + VALID_DESIGN_FILE_MIMETYPE, +}; +</script> + +<template> + <div> + <gl-deprecated-button + v-gl-tooltip.hover + :title=" + s__( + 'DesignManagement|Adding a design with the same filename replaces the file in a new version.', + ) + " + :disabled="isSaving" + variant="success" + @click="openFileUpload" + > + {{ s__('DesignManagement|Upload designs') }} + <gl-loading-icon v-if="isSaving" inline class="ml-1" /> + </gl-deprecated-button> + + <input + ref="fileUpload" + type="file" + name="design_file" + :accept="$options.VALID_DESIGN_FILE_MIMETYPE.mimetype" + class="hide" + multiple + @change="onFileUploadChange" + /> + </div> +</template> |