detail page port

pages/@id/+Page.vue

@@ -0,0 +1,37 @@
+<template>
+    <column-layout class="event-detail">
+        <template v-slot:column-one>
+            <event-info :event="event" :product="product" />
+        </template>
+
+        <template v-slot:column-two>
+            <slices-map :slices="slices" />
+        </template>
+    </column-layout>
+</template>
+
+<script setup>
+import { computed } from 'vue'
+import { useData } from 'vike-vue/useData'
+import ColumnLayout from '@/components/ColumnLayout.vue'
+import EventInfo from '@/components/event/Info.vue'
+import SlicesMap from '@/components/slices/Map.vue'
+
+const { event, product } = useData()
+
+const slices = computed(() => event?.slices || [])
+</script>
+
+<style lang="scss">
+main.event-detail {
+    .column.two {
+        padding-bottom: desktop-vw(75px);
+
+        .slices-full-bleed-media.diptych {
+            .prismic-media {
+                border-width: 1px 0;
+            }
+        }
+    }
+}
+</style>

pages/@id/+data.js

@@ -0,0 +1,29 @@
+import * as prismic from '@prismicio/client'
+import { createStorefrontApiClient } from '@shopify/storefront-api-client'
+import { GET_PRODUCT_BY_HANDLE } from '@/libs/shopify/product'
+
+export const data = async (pageContext) => {
+    const { id } = pageContext.routeParams
+    const prismicClient = prismic.createClient('swang')
+
+    const eventDoc = await prismicClient.getByUID('event', id)
+    const event = eventDoc?.data
+
+    const productHandle = event?.shopify_product_handle
+
+    if (!productHandle) return { event, product: null }
+
+    const shopifyClient = createStorefrontApiClient({
+        storeDomain: `https://swangent.myshopify.com`,
+        apiVersion: '2026-04',
+        publicAccessToken: 'd2848b9bcde999cea878c218493cfe84',
+    })
+
+    const query = GET_PRODUCT_BY_HANDLE
+    const variables = { handle: productHandle }
+
+    const productRes = await shopifyClient.request(query, { variables })
+    const product = productRes?.data
+
+    return { event, product }
+}