clean up the game detail page.

frontend/src/vues/GameList.vue

@@ -6,7 +6,30 @@
       v-model="filtervalue"
     ></v-text-field>
   </div>
-  <game-table :gameList="games"></game-table>
+  <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 games">
+        <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
+  >
   <v-pagination
     :model-value="page"
     :length="pageCount"
@@ -52,7 +75,7 @@ async function loadData() {
 }
 
 function setPage(targetPage: number) {
-  router.replace({ query: { page: targetPage, filter: route.query.filter} })
+  router.replace({ query: { page: targetPage, filter: route.query.filter } })
 }
 
 watch(route, (newValue, oldValue) => {
@@ -73,7 +96,7 @@ let debounce = null
 watch(filtervalue, (newFilter, oldFilter) => {
   debounce = clearTimeout(debounce)
   debounce = setTimeout(() => {
-    router.replace({query: {page: route.query.page, filter: newFilter}})
+    router.replace({ query: { page: route.query.page, filter: newFilter } })
   }, 500)
 })