<template>
  <div class="row mb-4">
    <div class="col-12">
      <h3 class="mb-1">
        <strong>{{ avoirNumber }}</strong>
      </h3>
      <p class="text-muted mb-0">Créé le {{ formatDate(date) }}</p>
    </div>
  </div>
</template>

<script setup>
import { defineProps } from "vue";

defineProps({
  avoirNumber: {
    type: String,
    required: true,
  },
  date: {
    type: [String, Date],
    required: true,
  },
});

const formatDate = (date) => {
  if (!date) return "-";
  return new Date(date).toLocaleDateString("fr-FR", {
    year: "numeric",
    month: "long",
    day: "numeric",
  });
};
</script>
