一覧表示画面から詳細画面を表示したい

Nuxt.jsにて、一覧表示画面の詳細ボタンを押した際に、その店舗についての詳細画面（店名、会社、オペレーターID、営業時間)を表示したいのですが、
どうしても一覧をそのまま出すことしかできません。

コードの書き方を調べても、いまいち理解できないため、書き方のヒントをいただけますと幸いです。
恐れ入りますが、どうぞよろしくお願いいたします。

一覧表示画面（store-list.vue)

vue
1<template>
2  <div>
3    <h1>一覧表示</h1>
4
5   
6    <div class="store-list">
7      <div
8        class="row"
9        v-for="Store in StoreList"
10        v-bind:key="Store.id"
11      >
12        <div>店名:{{ Store.store_name }}</div>
13        <div>登録日:{{ Store.created_at }}</div>
14
15        <v-btn
16          style="color: black"
17          @click="moveDetailStore(Store.id)"
18          color="primary"
19          >詳細</v-btn
20        >
21      </div>
22    </div>
23  </div>
24</template>
25<script lang="ts">
26import Vue from 'vue'
27...import省略...
28
29export default Vue.extend({
30  data() {
31    return {
32      viewId: 'DUMMY',
33      timeout: 2000,
34      error: '',
35      freeWord: '',
36      nextToken: '',
37      from: 0,
38      to: 0,
39      total: 0,
40      StoreList: [] as Array<Store>
41    }
42  },
43  created() {
44    this.searchStore()
45  },
46  methods: {
47    /**
48     * データ登録・検索
49     */
50    async searcStore() {
51      AppLogger.info(this.viewId, 'searchStore')
52      this.nextToken = ''
53      this.from = 0
54      this.to = 0
55      this.$nuxt.$loading.start()
56      try {
57        const result: ListStoresQuery | null = await this.$StoreService.serchStoreListByFreeword(
58          this.freeWord
59        )
60
61        if (
62          !result ||
63          !result.listStores ||
64          !result.listStores.items
65        )
66          return
67        this.StoreList = result.listStores
68          .items as Array<Store>
69        this.nextToken = result.listStores.nextToken!
70      } catch (e) {
71        AppLogger.error({ viewId: this.viewId, e })
72      } finally {
73        this.$nuxt.$loading.finish()
74      }
75    },
76
77    async moveDetailStore() {
78      this.$router.push('details-store')
79    }
80    }
81  }
82})
83</script>
84
85

詳細表示画面(details-store.vue)

vue
1<template>
2  <div>
3    <p class="top-message">詳細</p>
4    <v-btn style="color: black" @click="moveChangeStore()" color="primary"
5      >編集</v-btn
6    >
7
8    <div class="list">
9      <div
10        class="row"
11        v-for="Store in StoreList"
12        v-bind:key="Store.id"
13      >
14      <div class="info-wrapper">
15        <div class="input-info-wrapper">
16          <div class="info">店名:</div>
17          <div class="info">{{ Store.store_name }}</div>
18        </div>
19        <div class="input-info-wrapper">
20          <div class="info">会社:</div>
21          <div class="info">{{ Store.company_id }}</div>
22        </div>
23
24          <div class="input-info-wrapper">
25            <div class="info">オペレーターID:</div>
26            <div class="info">{{ Store.operator_id }}</div>
27          </div>
28
29         
30          <div class="input-info-wrapper">
31            <div class="info">営業時間:</div>
32            <div class="info">{{ Store.opening_hours }}</div>
33          </div>
34      </div>
35    </div>
36  </div>
37</template>
38<script lang="ts">
39・・・import省略・・・
40
41// TODO:指定した店の詳細情報を出す→未完
42export async function getById(id: string) {
43  return (await API.graphql(
44    graphqlOperation(listStores, {
45      filter: {
46        id: { eq: id }
47      }
48    })
49  )) as GraphQLResult<GetStoreQuery>
50}
51
52export default Vue.extend({
53  data() {
54    return {
55      viewId: 'DUMMY',
56      id: this.$route.params.id,
57      timeout: 2000,
58      error: '',
59      freeWord: '',
60      nextToken: '',
61      from: 0,
62      to: 0,
63      total: 0,
64     StoreList: [] as Array<Store>
65    }
66  },
67  created() {
68    this.searchStore()
69  }
70    }
71  }
72})
73</script>
74
75