debian-mirror-gitlab/app/assets/javascripts/design_management/components/upload/button.vue

60 lines
1.2 KiB
Vue
Raw Normal View History

2020-05-24 23:13:21 +05:30
<script>
2021-01-29 00:20:46 +05:30
import { GlButton, GlTooltipDirective } from '@gitlab/ui';
2020-05-24 23:13:21 +05:30
import { VALID_DESIGN_FILE_MIMETYPE } from '../../constants';
export default {
components: {
2020-10-24 23:57:45 +05:30
GlButton,
2020-05-24 23:13:21 +05:30
},
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>
2020-10-24 23:57:45 +05:30
<gl-button
2020-05-24 23:13:21 +05:30
v-gl-tooltip.hover
:title="
s__(
'DesignManagement|Adding a design with the same filename replaces the file in a new version.',
)
"
:disabled="isSaving"
2021-01-29 00:20:46 +05:30
:loading="isSaving"
2021-04-29 21:17:54 +05:30
category="secondary"
variant="confirm"
2020-10-24 23:57:45 +05:30
size="small"
2020-05-24 23:13:21 +05:30
@click="openFileUpload"
>
2020-06-23 00:09:42 +05:30
{{ s__('DesignManagement|Upload designs') }}
2020-10-24 23:57:45 +05:30
</gl-button>
2020-05-24 23:13:21 +05:30
<input
ref="fileUpload"
type="file"
name="design_file"
:accept="$options.VALID_DESIGN_FILE_MIMETYPE.mimetype"
2021-04-17 20:07:23 +05:30
class="gl-display-none"
2020-05-24 23:13:21 +05:30
multiple
@change="onFileUploadChange"
/>
</div>
</template>