<template>
  <h3>{{ title }}</h3>
  <v-table>
    <thead>
      <tr>
        <th class="text-left">ID</th>
        <th class="text-left">Title</th>
        <th class="text-left">Staus</th>
        <th class="text-left">Post Date</th>
      </tr>
    </thead>
    <tbody>
      <tr v-for="game in gameList">
        <td>
          <a v-bind:href="`/#/games/${game.id}`">{{ game.id }}</a>
        </td>
        <td>
          <a v-bind:href="`/#/games/${game.id}`">{{ game.title }}</a>
        </td>
        <td>{{ game.status }}</td>
        <td>
          {{ new Date(game.postdate * 1000).toISOString().split('T')[0] }}
        </td>
      </tr>
    </tbody>
  </v-table>
</template>

<style></style>

<script setup lang="ts">
defineProps(['title', 'gameList'])
</script>
