Add digital catalog with shareable flipbook and ktg.montzar.ir deploy files.

Co-authored-by: Cursor <cursoragent@cursor.com>

client/src/pages/ViewPage.vue

@@ -0,0 +1,47 @@
+<script setup lang="ts">
+import { computed, onMounted, ref } from "vue";
+import { useRoute } from "vue-router";
+import { getCatalog, pageUrl } from "../api";
+import CatalogViewer from "../components/CatalogViewer.vue";
+import type { CatalogPublic } from "@shared/types";
+
+const route = useRoute();
+const id = computed(() => String(route.params.id));
+const catalog = ref<CatalogPublic | null>(null);
+const error = ref("");
+const loading = ref(true);
+
+const images = computed(() => {
+  if (!catalog.value) return [];
+  return Array.from({ length: catalog.value.pageCount }, (_, i) =>
+    pageUrl(catalog.value!.id, i + 1),
+  );
+});
+
+onMounted(async () => {
+  try {
+    catalog.value = await getCatalog(id.value);
+  } catch (err) {
+    error.value = err instanceof Error ? err.message : "کاتالوگ پیدا نشد";
+  } finally {
+    loading.value = false;
+  }
+});
+</script>
+
+<template>
+  <div class="stage-page">
+    <header class="stage-bar">
+      <h1>{{ catalog?.title || "کاتالوگ دیجیتال" }}</h1>
+      <router-link class="btn" to="/">ساخت جدید</router-link>
+    </header>
+    <p v-if="loading" class="viewer-wrap">در حال بارگذاری…</p>
+    <p v-else-if="error" class="viewer-wrap error">{{ error }}</p>
+    <CatalogViewer
+      v-else-if="catalog"
+      :effect="catalog.effect"
+      :images="images"
+      :flip-ms="catalog.flipMs"
+    />
+  </div>
+</template>