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
67
|
<script>
import { GlFormCheckbox } from '@gitlab/ui';
import { s__ } from '~/locale';
import checkedRunnerIdsQuery from '../graphql/list/checked_runner_ids.query.graphql';
export default {
components: {
GlFormCheckbox,
},
inject: ['localMutations'],
props: {
runners: {
type: Array,
default: () => [],
required: false,
},
},
data() {
return {
checkedRunnerIds: [],
};
},
apollo: {
checkedRunnerIds: {
query: checkedRunnerIdsQuery,
},
},
computed: {
deletableRunners() {
return this.runners.filter((runner) => runner.userPermissions?.deleteRunner);
},
disabled() {
return !this.deletableRunners.length;
},
checked() {
return Boolean(this.deletableRunners.length) && this.deletableRunners.every(this.isChecked);
},
indeterminate() {
return !this.checked && this.deletableRunners.some(this.isChecked);
},
label() {
return this.checked ? s__('Runners|Unselect all') : s__('Runners|Select all');
},
},
methods: {
isChecked({ id }) {
return this.checkedRunnerIds.indexOf(id) >= 0;
},
onChange($event) {
this.localMutations.setRunnersChecked({
runners: this.deletableRunners,
isChecked: $event,
});
},
},
};
</script>
<template>
<gl-form-checkbox
:aria-label="label"
:indeterminate="indeterminate"
:checked="checked"
:disabled="disabled"
@change="onChange"
/>
</template>
|
