feat(games): add steam pages with steam price/reduc

2026-10-16 01:03:46 +02:00
parent 919e611895
commit 27d3c08a72
24 changed files with 779 additions and 6 deletions
@@ -0,0 +1,55 @@
+<script setup lang="ts">
+import { ref, onMounted, computed } from "vue";
+import { useI18n } from "vue-i18n";
+import { useTitle } from "@vueuse/core";
+import { gamesApiListEventSteamGames } from "./api";
+import type { SteamGameOut } from "./api/types.gen";
+import SteamStoreCard from "./components/SteamStoreCard.vue";
+
+interface Props {
+  eventPath: string;
+}
+
+const props = defineProps<Props>();
+
+const { t } = useI18n();
+useTitle(computed(() => t("games.title")));
+
+const games = ref<SteamGameOut[]>([]);
+const loading = ref(true);
+
+onMounted(async () => {
+  const response = await gamesApiListEventSteamGames({
+    path: { event_path: props.eventPath },
+  });
+  if (response.data) {
+    games.value = response.data;
+  }
+  loading.value = false;
+});
+</script>
+
+<template>
+  <div class="flex-1 bg-base-300 flex justify-center px-4 py-12">
+    <div class="w-full max-w-6xl">
+      <!-- Header -->
+      <div class="text-center mb-12">
+        <h1 class="text-5xl font-bold mb-4">{{ t("games.title") }}</h1>
+        <p class="text-xl text-base-content/70">{{ t("games.subtitle") }}</p>
+      </div>
+
+      <!-- Loading -->
+      <div v-if="loading" class="flex justify-center py-20">
+        <span class="loading loading-spinner loading-lg"></span>
+      </div>
+
+      <p v-else-if="!games.length" class="text-center text-base-content/50 py-20">
+        {{ t("games.empty") }}
+      </p>
+
+      <div v-else class="grid grid-cols-1 md:grid-cols-2 gap-8">
+        <SteamStoreCard v-for="game in games" :key="game.id" :game="game" />
+      </div>
+    </div>
+  </div>
+</template>