Commit 4f290de7 authored by Regis's avatar Regis

add cancelled icon

parent a3c93ee8
...@@ -55,4 +55,15 @@ ...@@ -55,4 +55,15 @@
</svg> </svg>
`, `,
}); });
gl.VueCanceledIcon = Vue.extend({
template: `
<svg xmlns="http://www.w3.org/2000/svg" width="14" height="14" class="ci-status-icon-canceled" viewBox="0 0 14 14">
<g fill="#5C5C5C" fill-rule="evenodd">
<path d="M12.5,7 C12.5,3.96243388 10.0375661,1.5 7,1.5 C3.96243388,1.5 1.5,3.96243388 1.5,7 C1.5,10.0375661 3.96243388,12.5 7,12.5 C10.0375661,12.5 12.5,10.0375661 12.5,7 Z M0,7 C0,3.13400675 3.13400675,0 7,0 C10.8659932,0 14,3.13400675 14,7 C14,10.8659932 10.8659932,14 7,14 C3.13400675,14 0,10.8659932 0,7 Z"></path>
<rect width="8" height="2" x="3" y="6" transform="rotate(45 7 7)" rx=".5"></rect>
</g>
</svg>
`,
});
})(window.gl || (window.gl = {})); })(window.gl || (window.gl = {}));
...@@ -9,6 +9,7 @@ ...@@ -9,6 +9,7 @@
'failed-icon': gl.VueFailedIcon, 'failed-icon': gl.VueFailedIcon,
'success-icon': gl.VueSuccessIcon, 'success-icon': gl.VueSuccessIcon,
'created-icon': gl.VueCreatedIcon, 'created-icon': gl.VueCreatedIcon,
'canceled-icon': gl.VueCanceledIcon,
}, },
props: ['stage'], props: ['stage'],
computed: { computed: {
...@@ -30,6 +31,7 @@ ...@@ -30,6 +31,7 @@
<failed-icon v-if='stage.status === "failed"'></failed-icon> <failed-icon v-if='stage.status === "failed"'></failed-icon>
<pending-icon v-if='stage.status === "pending"'></pending-icon> <pending-icon v-if='stage.status === "pending"'></pending-icon>
<created-icon v-if='stage.status === "created"'></created-icon> <created-icon v-if='stage.status === "created"'></created-icon>
<canceled-icon v-if='stage.status === "canceled"'></canceled-icon>
</a> </a>
`, `,
}); });
......
/* global Vue, gl */
/* eslint-disable no-param-reassign */
((gl) => {
gl.VueCanceledScope = Vue.extend({
components: {
'vue-canceled-icon': gl.VueCanceledIcon,
},
props: [
'pipeline',
],
template: `
<td class="commit-link">
<a :href='pipeline.url'>
<span class="ci-status ci-cancelled">
<vue-canceled-icon></vue-canceled-icon>
&nbsp;cancelled
</span>
</a>
</td>
`,
});
})(window.gl || (window.gl = {}));
//= require ./pending.js.es6 //= require ./pending.js.es6
//= require ./failed.js.es6 //= require ./failed.js.es6
//= require ./running.js.es6 //= require ./running.js.es6
//= require ./canceled.js.es6
//= require ./status.js.es6 //= require ./status.js.es6
...@@ -8,6 +8,7 @@ ...@@ -8,6 +8,7 @@
'vue-pending-scope': gl.VuePendingScope, 'vue-pending-scope': gl.VuePendingScope,
'vue-failed-scope': gl.VueFailedScope, 'vue-failed-scope': gl.VueFailedScope,
'vue-created-scope': gl.VueCreatedScope, 'vue-created-scope': gl.VueCreatedScope,
'vue-canceled-scope': gl.VueCanceledScope,
}, },
props: [ props: [
'pipeline', 'pipeline',
...@@ -34,6 +35,11 @@ ...@@ -34,6 +35,11 @@
:pipeline='pipeline' :pipeline='pipeline'
> >
</vue-created-scope> </vue-created-scope>
<vue-canceled-scope
v-if="pipeline.details.status === 'canceled'"
:pipeline='pipeline'
>
</vue-canceled-scope>
</td> </td>
`, `,
}); });
......
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