mirror of
https://github.com/woodpecker-ci/woodpecker.git
synced 2024-09-27 14:10:17 +00:00
60 lines
1.6 KiB
Vue
60 lines
1.6 KiB
Vue
<template>
|
|
<div class="space-y-4 text-color">
|
|
<ListItem v-for="secret in secrets" :key="secret.id" class="items-center">
|
|
<span>{{ secret.name }}</span>
|
|
<div class="ml-auto">
|
|
<span
|
|
v-for="event in secret.event"
|
|
:key="event"
|
|
class="bg-gray-500 dark:bg-dark-700 dark:text-gray-400 text-white rounded-md mx-1 py-1 px-2 text-sm"
|
|
>
|
|
{{ event }}
|
|
</span>
|
|
</div>
|
|
<IconButton
|
|
icon="edit"
|
|
class="ml-2 w-8 h-8"
|
|
:title="$t('repo.settings.secrets.edit')"
|
|
@click="editSecret(secret)"
|
|
/>
|
|
<IconButton
|
|
icon="trash"
|
|
class="ml-2 w-8 h-8 hover:text-red-400 hover:dark:text-red-500"
|
|
:is-loading="isDeleting"
|
|
:title="$t('repo.settings.secrets.delete')"
|
|
@click="deleteSecret(secret)"
|
|
/>
|
|
</ListItem>
|
|
|
|
<div v-if="secrets?.length === 0" class="ml-2">{{ $t(i18nPrefix + 'none') }}</div>
|
|
</div>
|
|
</template>
|
|
|
|
<script lang="ts" setup>
|
|
import { toRef } from 'vue';
|
|
|
|
import IconButton from '~/components/atomic/IconButton.vue';
|
|
import ListItem from '~/components/atomic/ListItem.vue';
|
|
import { Secret } from '~/lib/api/types';
|
|
|
|
const props = defineProps<{
|
|
modelValue: Secret[];
|
|
isDeleting: boolean;
|
|
i18nPrefix: string;
|
|
}>();
|
|
|
|
const emit = defineEmits<{
|
|
(event: 'edit', secret: Secret): void;
|
|
(event: 'delete', secret: Secret): void;
|
|
}>();
|
|
|
|
const secrets = toRef(props, 'modelValue');
|
|
|
|
function editSecret(secret: Secret) {
|
|
emit('edit', secret);
|
|
}
|
|
|
|
function deleteSecret(secret: Secret) {
|
|
emit('delete', secret);
|
|
}
|
|
</script>
|