diff options
Diffstat (limited to 'web_src/js/components/RepoActionView.vue')
| -rw-r--r-- | web_src/js/components/RepoActionView.vue | 28 |
1 files changed, 14 insertions, 14 deletions
diff --git a/web_src/js/components/RepoActionView.vue b/web_src/js/components/RepoActionView.vue index 762067f52..aadc8369b 100644 --- a/web_src/js/components/RepoActionView.vue +++ b/web_src/js/components/RepoActionView.vue @@ -2,7 +2,10 @@ <div class="action-view-container"> <div class="action-view-header"> <div class="action-info-summary"> - {{ run.title }} + <ActionRunStatus :status="run.status" :size="20"/> + <div class="action-title"> + {{ run.title }} + </div> <button class="run_approve" @click="approveRun()" v-if="run.canApprove"> <i class="play circle outline icon"/> </button> @@ -17,12 +20,7 @@ <div class="job-brief-list"> <div class="job-brief-item" v-for="(job, index) in run.jobs" :key="job.id"> <a class="job-brief-link" :href="run.link+'/jobs/'+index"> - <SvgIcon name="octicon-check-circle-fill" class="green" v-if="job.status === 'success'"/> - <SvgIcon name="octicon-skip" class="ui text grey" v-else-if="job.status === 'skipped'"/> - <SvgIcon name="octicon-clock" class="ui text yellow" v-else-if="job.status === 'waiting'"/> - <SvgIcon name="octicon-blocked" class="ui text yellow" v-else-if="job.status === 'blocked'"/> - <SvgIcon name="octicon-meter" class="ui text yellow" class-name="job-status-rotate" v-else-if="job.status === 'running'"/> - <SvgIcon name="octicon-x-circle-fill" class="red" v-else/> + <ActionRunStatus :status="job.status"/> <span class="ui text">{{ job.name }}</span> </a> <button class="job-brief-rerun" @click="rerunJob(index)" v-if="job.canRerun"> @@ -48,12 +46,7 @@ <SvgIcon name="octicon-chevron-down" class="gt-mr-3" v-show="currentJobStepsStates[i].expanded"/> <SvgIcon name="octicon-chevron-right" class="gt-mr-3" v-show="!currentJobStepsStates[i].expanded"/> - <SvgIcon name="octicon-check-circle-fill" class="green gt-mr-3" v-if="jobStep.status === 'success'"/> - <SvgIcon name="octicon-skip" class="ui text grey gt-mr-3" v-else-if="jobStep.status === 'skipped'"/> - <SvgIcon name="octicon-clock" class="ui text yellow gt-mr-3" v-else-if="jobStep.status === 'waiting'"/> - <SvgIcon name="octicon-blocked" class="ui text yellow gt-mr-3" v-else-if="jobStep.status === 'blocked'"/> - <SvgIcon name="octicon-meter" class="ui text yellow gt-mr-3" class-name="job-status-rotate" v-else-if="jobStep.status === 'running'"/> - <SvgIcon name="octicon-x-circle-fill" class="red gt-mr-3 " v-else/> + <ActionRunStatus :status="jobStep.status" class="gt-mr-3"/> <span class="step-summary-msg">{{ jobStep.summary }}</span> <span class="step-summary-dur">{{ jobStep.duration }}</span> @@ -70,6 +63,7 @@ <script> import {SvgIcon} from '../svg.js'; +import ActionRunStatus from './ActionRunStatus.vue'; import {createApp} from 'vue'; import AnsiToHTML from 'ansi-to-html'; @@ -79,6 +73,7 @@ const sfc = { name: 'RepoActionView', components: { SvgIcon, + ActionRunStatus, }, props: { runIndex: String, @@ -99,6 +94,7 @@ const sfc = { run: { link: '', title: '', + status: '', canCancel: false, canApprove: false, done: false, @@ -327,7 +323,11 @@ export function initRepositoryActionView() { .action-info-summary { font-size: 150%; height: 20px; - padding: 0 10px; + display: flex; + + .action-title { + padding: 0 5px; + } } // ================ |