index.vue 1.5 KB

12345678910111213141516171819202122232425262728293031323334353637383940414243444546474849505152535455565758596061626364656667686970717273747576
  1. <template>
  2. <LayoutNavigation />
  3. <JoinUsBanner />
  4. <JoinUsMissions />
  5. <LayoutFooterPrefooter />
  6. <LayoutFooter />
  7. </template>
  8. <script setup lang="ts">
  9. import { ref } from "vue";
  10. import { useMaestroRequestService } from "~/composables/useMaestroRequestService";
  11. const { apiRequestService } = useMaestroRequestService();
  12. const query = computed(() => {
  13. const queryParams: { page: number; type?: string; [key: string]: number | string } = {
  14. page: page.value,
  15. type: 'ENTREPRISE'
  16. };
  17. return queryParams;
  18. });
  19. // Base URL for API requests
  20. const totalItems = ref(0);
  21. const config = useRuntimeConfig();
  22. const baseUrl = `${config.public.apiBaseUrl}/api/job-postings`;
  23. const page: Ref<number> = ref(1);
  24. const itemsPerPage: Ref<number> = ref(10);
  25. const { t } = useI18n();
  26. const {
  27. data: jobs = [],
  28. pending,
  29. refresh,
  30. } = useLazyAsyncData("files", async () => {
  31. const response = await apiRequestService.get(baseUrl, query.value);
  32. const collection = response["hydra:member"];
  33. const currentDate = new Date();
  34. const filteredJobs = collection.filter(item => {
  35. const endPublicationDate = new Date(item.endPublication);
  36. return item.type === 'ENTREPRISE' && endPublicationDate >= currentDate;
  37. });
  38. totalItems.value = filteredJobs.length;
  39. console.log(filteredJobs);
  40. return filteredJobs;
  41. });
  42. </script>
  43. <style scoped lang="scss">
  44. #sticky-menu {
  45. position: sticky;
  46. top: 20rem;
  47. z-index: 1;
  48. margin-bottom: -32rem;
  49. float: right;
  50. }
  51. @media (max-width: 1800px) {
  52. #sticky-menu {
  53. top: 16rem;
  54. margin-bottom: -28rem;
  55. }
  56. }
  57. </style>