diff options
Diffstat (limited to 'app/assets/javascripts/environments')
5 files changed, 37 insertions, 8 deletions
diff --git a/app/assets/javascripts/environments/components/environment_actions.vue b/app/assets/javascripts/environments/components/environment_actions.vue index a2448520a5f..e7495677e7c 100644 --- a/app/assets/javascripts/environments/components/environment_actions.vue +++ b/app/assets/javascripts/environments/components/environment_actions.vue @@ -2,6 +2,7 @@ import playIconSvg from 'icons/_icon_play.svg'; import eventHub from '../event_hub'; import loadingIcon from '../../vue_shared/components/loading_icon.vue'; +import tooltip from '../../vue_shared/directives/tooltip'; export default { props: { @@ -12,6 +13,10 @@ export default { }, }, + directives: { + tooltip, + }, + components: { loadingIcon, }, @@ -33,8 +38,6 @@ export default { onClickAction(endpoint) { this.isLoading = true; - $(this.$refs.tooltip).tooltip('destroy'); - eventHub.$emit('postAction', endpoint); }, @@ -53,11 +56,11 @@ export default { class="btn-group" role="group"> <button + v-tooltip type="button" - class="dropdown btn btn-default dropdown-new js-dropdown-play-icon-container has-tooltip" + class="dropdown btn btn-default dropdown-new js-dropdown-play-icon-container" data-container="body" data-toggle="dropdown" - ref="tooltip" :title="title" :aria-label="title" :disabled="isLoading"> diff --git a/app/assets/javascripts/environments/components/environment_external_url.vue b/app/assets/javascripts/environments/components/environment_external_url.vue index eaeec2bc53c..6b749814ea4 100644 --- a/app/assets/javascripts/environments/components/environment_external_url.vue +++ b/app/assets/javascripts/environments/components/environment_external_url.vue @@ -1,4 +1,6 @@ <script> +import tooltip from '../../vue_shared/directives/tooltip'; + /** * Renders the external url link in environments table. */ @@ -10,6 +12,10 @@ export default { }, }, + directives: { + tooltip, + }, + computed: { title() { return 'Open'; @@ -19,7 +25,8 @@ export default { </script> <template> <a - class="btn external-url has-tooltip" + v-tooltip + class="btn external-url" data-container="body" target="_blank" rel="noopener noreferrer nofollow" diff --git a/app/assets/javascripts/environments/components/environment_monitoring.vue b/app/assets/javascripts/environments/components/environment_monitoring.vue index 07cf92281a0..1655561cdd3 100644 --- a/app/assets/javascripts/environments/components/environment_monitoring.vue +++ b/app/assets/javascripts/environments/components/environment_monitoring.vue @@ -2,6 +2,8 @@ /** * Renders the Monitoring (Metrics) link in environments table. */ +import tooltip from '../../vue_shared/directives/tooltip'; + export default { props: { monitoringUrl: { @@ -10,6 +12,10 @@ export default { }, }, + directives: { + tooltip, + }, + computed: { title() { return 'Monitoring'; @@ -19,7 +25,8 @@ export default { </script> <template> <a - class="btn monitoring-url has-tooltip hidden-xs hidden-sm" + v-tooltip + class="btn monitoring-url hidden-xs hidden-sm" data-container="body" rel="noopener noreferrer nofollow" :href="monitoringUrl" diff --git a/app/assets/javascripts/environments/components/environment_stop.vue b/app/assets/javascripts/environments/components/environment_stop.vue index 091c543860b..85f11d2071b 100644 --- a/app/assets/javascripts/environments/components/environment_stop.vue +++ b/app/assets/javascripts/environments/components/environment_stop.vue @@ -5,6 +5,7 @@ */ import eventHub from '../event_hub'; import loadingIcon from '../../vue_shared/components/loading_icon.vue'; +import tooltip from '../../vue_shared/directives/tooltip'; export default { props: { @@ -14,6 +15,10 @@ export default { }, }, + directives: { + tooltip, + }, + data() { return { isLoading: false, @@ -46,8 +51,9 @@ export default { </script> <template> <button + v-tooltip type="button" - class="btn stop-env-link has-tooltip hidden-xs hidden-sm" + class="btn stop-env-link hidden-xs hidden-sm" data-container="body" @click="onClick" :disabled="isLoading" diff --git a/app/assets/javascripts/environments/components/environment_terminal_button.vue b/app/assets/javascripts/environments/components/environment_terminal_button.vue index 1ca65a79951..2037bf618e3 100644 --- a/app/assets/javascripts/environments/components/environment_terminal_button.vue +++ b/app/assets/javascripts/environments/components/environment_terminal_button.vue @@ -4,6 +4,7 @@ * Used in environments table. */ import terminalIconSvg from 'icons/_icon_terminal.svg'; +import tooltip from '../../vue_shared/directives/tooltip'; export default { props: { @@ -14,6 +15,10 @@ export default { }, }, + directives: { + tooltip, + }, + data() { return { terminalIconSvg, @@ -29,7 +34,8 @@ export default { </script> <template> <a - class="btn terminal-button has-tooltip hidden-xs hidden-sm" + v-tooltip + class="btn terminal-button hidden-xs hidden-sm" data-container="body" :title="title" :aria-label="title" |