diff options
Diffstat (limited to 'app/assets/javascripts/pages/projects/labels/index/index.js')
-rw-r--r-- | app/assets/javascripts/pages/projects/labels/index/index.js | 132 |
1 files changed, 67 insertions, 65 deletions
diff --git a/app/assets/javascripts/pages/projects/labels/index/index.js b/app/assets/javascripts/pages/projects/labels/index/index.js index 32a8db7e989..2abcbfab1ed 100644 --- a/app/assets/javascripts/pages/projects/labels/index/index.js +++ b/app/assets/javascripts/pages/projects/labels/index/index.js @@ -6,84 +6,86 @@ import PromoteLabelModal from '../components/promote_label_modal.vue'; Vue.use(Translate); -const onRequestFinished = ({ labelUrl, successful }) => { - const button = document.querySelector(`.js-promote-project-label[data-url="${labelUrl}"]`); +const initLabelIndex = () => { + initLabels(); - if (!successful) { - button.removeAttribute('disabled'); - } -}; + const onRequestFinished = ({ labelUrl, successful }) => { + const button = document.querySelector(`.js-promote-project-label-button[data-url="${labelUrl}"]`); -const onRequestStarted = (labelUrl) => { - const button = document.querySelector(`.js-promote-project-label[data-url="${labelUrl}"]`); - button.setAttribute('disabled', ''); - eventHub.$once('promoteLabelModal.requestFinished', onRequestFinished); -}; + if (!successful) { + button.removeAttribute('disabled'); + } + }; -const onDeleteButtonClick = (event) => { - const button = event.currentTarget; - const modalProps = { - labelTitle: button.dataset.labelTitle, - labelColor: button.dataset.labelColor, - url: button.dataset.url, + const onRequestStarted = (labelUrl) => { + const button = document.querySelector(`.js-promote-project-label-button[data-url="${labelUrl}"]`); + button.setAttribute('disabled', ''); + eventHub.$once('promoteLabelModal.requestFinished', onRequestFinished); }; - eventHub.$once('promoteLabelModal.requestStarted', onRequestStarted); - eventHub.$emit('promoteLabelModal.props', modalProps); -}; -const promoteLabelButtons = document.querySelectorAll('.js-promote-project-label'); -promoteLabelButtons.forEach((button) => { - button.addEventListener('click', onDeleteButtonClick); -}); + const onDeleteButtonClick = (event) => { + const button = event.currentTarget; + const modalProps = { + labelTitle: button.dataset.labelTitle, + labelColor: button.dataset.labelColor, + labelTextColor: button.dataset.labelTextColor, + url: button.dataset.url, + }; + eventHub.$once('promoteLabelModal.requestStarted', onRequestStarted); + eventHub.$emit('promoteLabelModal.props', modalProps); + }; -eventHub.$once('promoteLabelModal.mounted', () => { + const promoteLabelButtons = document.querySelectorAll('.js-promote-project-label-button'); promoteLabelButtons.forEach((button) => { - button.removeAttribute('disabled'); + button.addEventListener('click', onDeleteButtonClick); }); -}); - -const initLabelIndex = () => { - initLabels(); - const promoteLabelModalComponent = new Vue({ - el: '#promote-label-modal', - components: { - PromoteLabelModal, - }, - data() { - return { - modalProps: { - labelTitle: '', - labelColor: '', - url: '', - }, - }; - }, - mounted() { - eventHub.$on('promoteLabelModal.props', this.setModalProps); - eventHub.$emit('promoteLabelModal.mounted'); - }, - beforeDestroy() { - eventHub.$off('promoteLabelModal.props', this.setModalProps); - }, - methods: { - setModalProps(modalProps) { - this.modalProps = modalProps; - }, - }, - render(createElement) { - return createElement('promote-label-modal', { - props: this.modalProps, - }); - }, + eventHub.$once('promoteLabelModal.mounted', () => { + promoteLabelButtons.forEach((button) => { + button.removeAttribute('disabled'); + }); }); const promoteLabelModal = document.getElementById('promote-label-modal'); - let withLabel; - if (promoteLabelModal != null) { - withLabel = promoteLabelModalComponent; + let promoteLabelModalComponent; + + if (promoteLabelModal) { + promoteLabelModalComponent = new Vue({ + el: promoteLabelModal, + components: { + PromoteLabelModal, + }, + data() { + return { + modalProps: { + labelTitle: '', + labelColor: '', + labelTextColor: '', + url: '', + }, + }; + }, + mounted() { + eventHub.$on('promoteLabelModal.props', this.setModalProps); + eventHub.$emit('promoteLabelModal.mounted'); + }, + beforeDestroy() { + eventHub.$off('promoteLabelModal.props', this.setModalProps); + }, + methods: { + setModalProps(modalProps) { + this.modalProps = modalProps; + }, + }, + render(createElement) { + return createElement('promote-label-modal', { + props: this.modalProps, + }); + }, + }); } - return withLabel; + + return promoteLabelModalComponent; }; document.addEventListener('DOMContentLoaded', initLabelIndex); |