<template>
  <base-route-card :route="route">
    <template v-slot:main>
      <div class="flex grow items-center justify-between">
        <price :pricing="route.pricing" />

        <a :href="getDownloadLink" download>
          <icon icon="download" class="text-secondary h-4 w-4"></icon>
          Télécharger la facture
        </a>
      </div>
    </template>
    <template v-slot:footer>
      <request-footer :route="route" />
    </template>
  </base-route-card>
</template>
<script setup>
import { useAuthStore } from "~/store/auth";

const authStore = useAuthStore();

const props = defineProps({
  route: {
    type: Object,
    required: true,
    default: () => ({}),
  },
});

const getDownloadLink = computed(() => {
  console.log("test");
  console.log(authStore.me);
  localStorage.getItem("token");
  return (
    "/api/routes/" +
    props.route.id +
    "/invoice?token=" +
    localStorage.getItem("token")
  );
});
</script>
