1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
|
<script>
import { GlIntersperse, GlTableLite } from '@gitlab/ui';
import HelpPopover from '~/vue_shared/components/help_popover.vue';
import { s__ } from '~/locale';
import TimeAgo from '~/vue_shared/components/time_ago_tooltip.vue';
import { tableField } from '../utils';
import { I18N_STATUS_NEVER_CONTACTED } from '../constants';
export default {
name: 'RunnerManagersTable',
components: {
GlTableLite,
TimeAgo,
HelpPopover,
GlIntersperse,
},
props: {
items: {
type: Array,
required: false,
default: () => [],
},
},
fields: [
tableField({ key: 'systemId', label: s__('Runners|System ID') }),
tableField({ key: 'version', label: s__('Runners|Version') }),
tableField({ key: 'ipAddress', label: s__('Runners|IP Address') }),
tableField({ key: 'executorName', label: s__('Runners|Executor') }),
tableField({ key: 'architecturePlatform', label: s__('Runners|Arch/Platform') }),
tableField({
key: 'contactedAt',
label: s__('Runners|Last contact'),
tdClass: ['gl-text-right'],
thClasses: ['gl-text-right'],
}),
],
I18N_STATUS_NEVER_CONTACTED,
};
</script>
<template>
<gl-table-lite :fields="$options.fields" :items="items">
<template #head(systemId)="{ label }">
{{ label }}
<help-popover>
{{ s__('Runners|The unique ID for each runner that uses this configuration.') }}
</help-popover>
</template>
<template #cell(version)="{ item = {} }">
{{ item.version }}
<template v-if="item.revision">({{ item.revision }})</template>
</template>
<template #cell(architecturePlatform)="{ item = {} }">
<gl-intersperse separator="/">
<span v-if="item.architectureName">{{ item.architectureName }}</span>
<span v-if="item.platformName">{{ item.platformName }}</span>
</gl-intersperse>
</template>
<template #cell(contactedAt)="{ item = {} }">
<template v-if="item.contactedAt">
<time-ago :time="item.contactedAt" />
</template>
<template v-else>{{ $options.I18N_STATUS_NEVER_CONTACTED }}</template>
</template>
</gl-table-lite>
</template>
|
