Commit f09f7539 authored by Phil Hughes's avatar Phil Hughes

Merge branch 'environments-vue-2' into 'master'

Refactor into .vue files part 2

See merge request !10791
parents 08b2e7cd 324aa141
<script>
/** /**
* Renders the external url link in environments table. * Renders the external url link in environments table.
*/ */
...@@ -5,7 +6,7 @@ export default { ...@@ -5,7 +6,7 @@ export default {
props: { props: {
externalUrl: { externalUrl: {
type: String, type: String,
default: '', required: true,
}, },
}, },
...@@ -14,17 +15,19 @@ export default { ...@@ -14,17 +15,19 @@ export default {
return 'Open'; return 'Open';
}, },
}, },
};
template: ` </script>
<template>
<a <a
class="btn external-url has-tooltip" class="btn external-url has-tooltip"
data-container="body" data-container="body"
:href="externalUrl"
target="_blank" target="_blank"
rel="noopener noreferrer nofollow" rel="noopener noreferrer nofollow"
:title="title" :title="title"
:aria-label="title"> :aria-label="title"
<i class="fa fa-external-link" aria-hidden="true"></i> :href="externalUrl">
<i
class="fa fa-external-link"
aria-hidden="true" />
</a> </a>
`, </template>
};
import Timeago from 'timeago.js'; import Timeago from 'timeago.js';
import '../../lib/utils/text_utility'; import '../../lib/utils/text_utility';
import ActionsComponent from './environment_actions'; import ActionsComponent from './environment_actions';
import ExternalUrlComponent from './environment_external_url'; import ExternalUrlComponent from './environment_external_url.vue';
import StopComponent from './environment_stop'; import StopComponent from './environment_stop.vue';
import RollbackComponent from './environment_rollback'; import RollbackComponent from './environment_rollback';
import TerminalButtonComponent from './environment_terminal_button'; import TerminalButtonComponent from './environment_terminal_button.vue';
import MonitoringButtonComponent from './environment_monitoring'; import MonitoringButtonComponent from './environment_monitoring';
import CommitComponent from '../../vue_shared/components/commit'; import CommitComponent from '../../vue_shared/components/commit';
import eventHub from '../event_hub'; import eventHub from '../event_hub';
......
<script>
/* global Flash */ /* global Flash */
/* eslint-disable no-new, no-alert */ /* eslint-disable no-new, no-alert */
/** /**
...@@ -50,17 +51,23 @@ export default { ...@@ -50,17 +51,23 @@ export default {
} }
}, },
}, },
};
template: ` </script>
<button type="button" <template>
<button
type="button"
class="btn stop-env-link has-tooltip" class="btn stop-env-link has-tooltip"
data-container="body" data-container="body"
@click="onClick" @click="onClick"
:disabled="isLoading" :disabled="isLoading"
:title="title" :title="title"
:aria-label="title"> :aria-label="title">
<i class="fa fa-stop stop-env-icon" aria-hidden="true"></i> <i
<i v-if="isLoading" class="fa fa-spinner fa-spin" aria-hidden="true"></i> class="fa fa-stop stop-env-icon"
aria-hidden="true" />
<i
v-if="isLoading"
class="fa fa-spinner fa-spin"
aria-hidden="true" />
</button> </button>
`, </template>
};
<script>
/** /**
* Renders a terminal button to open a web terminal. * Renders a terminal button to open a web terminal.
* Used in environments table. * Used in environments table.
...@@ -24,14 +25,15 @@ export default { ...@@ -24,14 +25,15 @@ export default {
return 'Terminal'; return 'Terminal';
}, },
}, },
};
template: ` </script>
<a class="btn terminal-button has-tooltip" <template>
<a
class="btn terminal-button has-tooltip"
data-container="body" data-container="body"
:title="title" :title="title"
:aria-label="title" :aria-label="title"
:href="terminalPath"> :href="terminalPath"
${terminalIconSvg} v-html="terminalIconSvg">
</a> </a>
`, </template>
};
import Vue from 'vue'; import Vue from 'vue';
import externalUrlComp from '~/environments/components/environment_external_url'; import externalUrlComp from '~/environments/components/environment_external_url.vue';
describe('External URL Component', () => { describe('External URL Component', () => {
let ExternalUrlComponent; let ExternalUrlComponent;
......
import Vue from 'vue'; import Vue from 'vue';
import stopComp from '~/environments/components/environment_stop'; import stopComp from '~/environments/components/environment_stop.vue';
describe('Stop Component', () => { describe('Stop Component', () => {
let StopComponent; let StopComponent;
......
import Vue from 'vue'; import Vue from 'vue';
import terminalComp from '~/environments/components/environment_terminal_button'; import terminalComp from '~/environments/components/environment_terminal_button.vue';
describe('Stop Component', () => { describe('Stop Component', () => {
let TerminalComponent; let TerminalComponent;
......
Markdown is supported
0%
or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment