status.js 1.79 KB
Newer Older
1 2 3
/* global Vue, gl */
/* eslint-disable no-param-reassign */

4 5 6 7 8 9 10 11 12
import canceledSvg from 'icons/_icon_status_canceled.svg';
import createdSvg from 'icons/_icon_status_created.svg';
import failedSvg from 'icons/_icon_status_failed.svg';
import manualSvg from 'icons/_icon_status_manual.svg';
import pendingSvg from 'icons/_icon_status_pending.svg';
import runningSvg from 'icons/_icon_status_running.svg';
import skippedSvg from 'icons/_icon_status_skipped.svg';
import successSvg from 'icons/_icon_status_success.svg';
import warningSvg from 'icons/_icon_status_warning.svg';
Filipa Lacerda's avatar
Filipa Lacerda committed
13

14 15 16
((gl) => {
  gl.VueStatusScope = Vue.extend({
    props: [
Filipa Lacerda's avatar
Filipa Lacerda committed
17
      'pipeline',
18
    ],
Filipa Lacerda's avatar
Filipa Lacerda committed
19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37

    data() {
      const svgsDictionary = {
        icon_status_canceled: canceledSvg,
        icon_status_created: createdSvg,
        icon_status_failed: failedSvg,
        icon_status_manual: manualSvg,
        icon_status_pending: pendingSvg,
        icon_status_running: runningSvg,
        icon_status_skipped: skippedSvg,
        icon_status_success: successSvg,
        icon_status_warning: warningSvg,
      };

      return {
        svg: svgsDictionary[this.pipeline.details.status.icon],
      };
    },

38 39
    computed: {
      cssClasses() {
Regis's avatar
Regis committed
40
        const cssObject = { 'ci-status': true };
Regis's avatar
Regis committed
41
        cssObject[`ci-${this.pipeline.details.status.group}`] = true;
42 43
        return cssObject;
      },
Filipa Lacerda's avatar
Filipa Lacerda committed
44

Regis's avatar
Regis committed
45 46
      detailsPath() {
        const { status } = this.pipeline.details;
47
        return status.has_details ? status.details_path : false;
Regis's avatar
Regis committed
48
      },
Filipa Lacerda's avatar
Filipa Lacerda committed
49 50 51 52

      content() {
        return `${this.svg} ${this.pipeline.details.status.text}`;
      },
53 54
    },
    template: `
55
      <td class="commit-link">
56
        <a
Filipa Lacerda's avatar
Filipa Lacerda committed
57 58 59
          :class="cssClasses"
          :href="detailsPath"
          v-html="content">
60 61 62 63 64
        </a>
      </td>
    `,
  });
})(window.gl || (window.gl = {}));