Commit 908c6772 authored by Phil Hughes's avatar Phil Hughes

fixed breakpoint

disable stop button when loading
parent 3dcfb6cb
<script>
import timeagoMixin from '../../vue_shared/mixins/timeago';
import tooltip from '../../vue_shared/directives/tooltip';
import LoadingButton from '../../vue_shared/components/loading_button.vue';
import { visitUrl } from '../../lib/utils/url_utility';
import createFlash from '../../flash';
import MemoryUsage from './memory_usage.vue';
......@@ -10,6 +11,7 @@ import MRWidgetService from '../services/mr_widget_service';
export default {
name: 'Deployment',
components: {
LoadingButton,
MemoryUsage,
StatusIcon,
},
......@@ -25,6 +27,11 @@ export default {
required: true,
},
},
data() {
return {
isStopping: false,
};
},
computed: {
deployTimeago() {
return this.timeFormated(this.deployment.deployed_at);
......@@ -43,19 +50,26 @@ export default {
},
},
methods: {
stopEnvironment(deployment) {
stopEnvironment() {
const msg = 'Are you sure you want to stop this environment?';
const isConfirmed = confirm(msg); // eslint-disable-line
if (isConfirmed) {
MRWidgetService.stopEnvironment(deployment.stop_url)
this.isStopping = true;
MRWidgetService.stopEnvironment(this.deployment.stop_url)
.then(res => res.data)
.then((data) => {
if (data.redirect_url) {
visitUrl(data.redirect_url);
}
this.isStopping = false;
})
.catch(() => createFlash('Something went wrong while stopping this environment. Please try again.'));
.catch(() => {
createFlash('Something went wrong while stopping this environment. Please try again.');
this.isStopping = false;
});
}
},
},
......@@ -72,33 +86,32 @@ export default {
</div>
<div class="media-body">
<div class="deploy-body">
<span
v-if="hasDeploymentMeta"
>
<template v-if="hasDeploymentMeta">
<span>
Deployed to
</span>
<span class="deploy-link">
<a
v-if="hasDeploymentMeta"
:href="deployment.url"
target="_blank"
rel="noopener noreferrer nofollow"
class="js-deploy-meta">
class="js-deploy-meta"
>
{{ deployment.name }}
</a>
</span>
<span
v-if="hasExternalUrls"
>
</template>
<template v-if="hasExternalUrls">
<span>
on
</span>
<span class="deploy-link">
<a
v-if="hasExternalUrls"
:href="deployment.external_url"
target="_blank"
rel="noopener noreferrer nofollow"
class="js-deploy-url">
class="js-deploy-url"
>
<i
class="fa fa-external-link"
aria-hidden="true"
......@@ -107,21 +120,23 @@ export default {
{{ deployment.external_url_formatted }}
</a>
</span>
</template>
<span
v-if="hasDeploymentTime"
:data-title="deployment.deployed_at_formatted"
class="js-deploy-time"
data-toggle="tooltip"
data-placement="top">
data-placement="top"
>
{{ deployTimeago }}
</span>
<button
type="button"
<loading-button
v-if="deployment.stop_url"
@click="stopEnvironment(deployment)"
class="btn btn-default btn-xs">
Stop environment
</button>
container-class="btn btn-default btn-xs"
label="Stop environment"
:loading="isStopping"
@click="stopEnvironment"
/>
</div>
<memory-usage
v-if="hasMetrics"
......
......@@ -740,7 +740,7 @@
display: flex;
flex-wrap: wrap;
@media (min-width: $screen-md-min) {
@media (min-width: $screen-xs) {
flex-wrap: nowrap;
white-space: nowrap;
}
......@@ -761,7 +761,8 @@
min-width: 100px;
max-width: 150px;
@media (min-width: $screen-md-min) {
@media (min-width: $screen-xs) {
min-width: 0;
max-width: 100%;
}
}
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