diff options
Diffstat (limited to 'app/assets/javascripts/work_items/components/item_state.vue')
-rw-r--r-- | app/assets/javascripts/work_items/components/item_state.vue | 62 |
1 files changed, 62 insertions, 0 deletions
diff --git a/app/assets/javascripts/work_items/components/item_state.vue b/app/assets/javascripts/work_items/components/item_state.vue new file mode 100644 index 00000000000..0b6c1a75bb2 --- /dev/null +++ b/app/assets/javascripts/work_items/components/item_state.vue @@ -0,0 +1,62 @@ +<script> +import { GlFormGroup, GlFormSelect } from '@gitlab/ui'; +import { __ } from '~/locale'; +import { STATE_OPEN, STATE_CLOSED } from '../constants'; + +export default { + i18n: { + status: __('Status'), + }, + states: [ + { + value: STATE_OPEN, + text: __('Open'), + }, + { + value: STATE_CLOSED, + text: __('Closed'), + }, + ], + components: { + GlFormGroup, + GlFormSelect, + }, + props: { + state: { + type: String, + required: true, + }, + loading: { + type: Boolean, + required: false, + default: false, + }, + }, + computed: { + currentState() { + return this.$options.states[this.state]; + }, + }, + methods: { + setState(newState) { + if (newState !== this.state) { + this.$emit('changed', newState); + } + }, + }, + labelId: 'work-item-state-select', +}; +</script> + +<template> + <gl-form-group :label="$options.i18n.status" :label-for="$options.labelId"> + <gl-form-select + :id="$options.labelId" + :value="state" + :options="$options.states" + :disabled="loading" + class="gl-w-auto" + @change="setState" + /> + </gl-form-group> +</template> |