65 lines
2.7 KiB
Vue
65 lines
2.7 KiB
Vue
<script setup lang="ts">
|
|
const vault = useVault()
|
|
|
|
const keyCount = ref(0)
|
|
const credCount = ref(0)
|
|
const loading = ref(true)
|
|
|
|
onMounted(async () => {
|
|
try {
|
|
const [keys, creds] = await Promise.all([
|
|
vault.listKeys() as Promise<any[]>,
|
|
vault.listCredentials() as Promise<any[]>,
|
|
])
|
|
keyCount.value = keys.length
|
|
credCount.value = creds.length
|
|
} finally {
|
|
loading.value = false
|
|
}
|
|
})
|
|
</script>
|
|
|
|
<template>
|
|
<div class="max-w-3xl mx-auto p-6">
|
|
<h2 class="text-xl font-bold text-white mb-6">Vault</h2>
|
|
|
|
<div v-if="loading" class="text-gray-500 text-sm">Loading...</div>
|
|
|
|
<div v-else class="grid grid-cols-1 sm:grid-cols-2 gap-4">
|
|
<NuxtLink to="/vault/keys"
|
|
class="block p-5 bg-gray-800 rounded-lg border border-gray-700 hover:border-wraith-500 transition-colors">
|
|
<div class="flex items-center gap-3 mb-2">
|
|
<svg class="w-6 h-6 text-wraith-400" fill="none" stroke="currentColor" viewBox="0 0 24 24">
|
|
<path stroke-linecap="round" stroke-linejoin="round" stroke-width="2"
|
|
d="M15 7a2 2 0 012 2m4 0a6 6 0 01-7.743 5.743L11 17H9v2H7v2H4a1 1 0 01-1-1v-2.586a1 1 0 01.293-.707l5.964-5.964A6 6 0 1121 9z" />
|
|
</svg>
|
|
<h3 class="text-lg font-semibold text-white">SSH Keys</h3>
|
|
</div>
|
|
<p class="text-3xl font-bold text-wraith-400">{{ keyCount }}</p>
|
|
<p class="text-sm text-gray-400 mt-1">{{ keyCount === 1 ? 'key' : 'keys' }} stored</p>
|
|
<p class="text-xs text-gray-500 mt-3">Manage and import SSH private keys</p>
|
|
</NuxtLink>
|
|
|
|
<NuxtLink to="/vault/credentials"
|
|
class="block p-5 bg-gray-800 rounded-lg border border-gray-700 hover:border-wraith-500 transition-colors">
|
|
<div class="flex items-center gap-3 mb-2">
|
|
<svg class="w-6 h-6 text-wraith-400" fill="none" stroke="currentColor" viewBox="0 0 24 24">
|
|
<path stroke-linecap="round" stroke-linejoin="round" stroke-width="2"
|
|
d="M12 15v2m-6 4h12a2 2 0 002-2v-6a2 2 0 00-2-2H6a2 2 0 00-2 2v6a2 2 0 002 2zm10-10V7a4 4 0 00-8 0v4h8z" />
|
|
</svg>
|
|
<h3 class="text-lg font-semibold text-white">Credentials</h3>
|
|
</div>
|
|
<p class="text-3xl font-bold text-wraith-400">{{ credCount }}</p>
|
|
<p class="text-sm text-gray-400 mt-1">{{ credCount === 1 ? 'credential' : 'credentials' }} stored</p>
|
|
<p class="text-xs text-gray-500 mt-3">Manage passwords and SSH key credentials</p>
|
|
</NuxtLink>
|
|
</div>
|
|
|
|
<div class="mt-8 p-4 bg-gray-800/50 rounded border border-gray-700">
|
|
<p class="text-xs text-gray-500">
|
|
All secrets are encrypted at rest using AES-256-GCM. Private keys and passwords are never exposed via the API.
|
|
</p>
|
|
</div>
|
|
</div>
|
|
</template>
|