<template>
  <v-dialog
    :model-value="modelValue"
    max-width="960"
    scrollable
    @update:model-value="emit('update:modelValue', $event)"
  >
    <v-card border rounded="lg">
      <v-card-title class="d-flex align-center">
        凭据管理
        <v-spacer />
        <v-btn icon="mdi-close" variant="text" size="small" @click="emit('update:modelValue', false)" />
      </v-card-title>
      <v-divider />
      <v-card-text class="pa-4">
        <CredentialsManager v-if="modelValue" :active="modelValue" />
      </v-card-text>
    </v-card>
  </v-dialog>
</template>

<script setup lang="ts">
import CredentialsManager from '@/components/credentials/CredentialsManager.vue'

defineProps<{
  modelValue: boolean
}>()

const emit = defineEmits<{
  'update:modelValue': [value: boolean]
}>()
</script>
