init

2026-07-10 18:23:41 +08:00
commit bc9e794a57
80 changed files with 19016 additions and 0 deletions
@@ -0,0 +1,67 @@
+<script setup>
+defineProps({
+  results: {
+    type: Object,
+    required: true,
+  },
+  routes: {
+    type: Array,
+    default: () => [],
+  },
+  sectionId: {
+    type: String,
+    default: "service-results",
+  },
+});
+</script>
+
+<template>
+  <section :id="sectionId" class="bg-[#f4f4f4] py-16 md:py-20">
+    <div class="container-gm">
+      <div class="flex flex-col gap-5 md:flex-row md:items-end md:justify-between" data-reveal>
+        <div class="max-w-3xl">
+          <p class="text-sm uppercase tracking-[0.3em] text-[#999]">{{ results.eyebrow }}</p>
+          <h2 class="section-title mt-4">{{ results.title }}</h2>
+          <p class="mt-4 text-base leading-8 text-[#666]">{{ results.description }}</p>
+        </div>
+        <SectionRouteLinks :routes="routes" />
+      </div>
+
+      <div class="mt-10 grid gap-5 lg:grid-cols-[0.9fr_1.1fr]">
+        <div class="grid gap-4" data-stagger>
+          <article
+            v-for="item in results.proofs"
+            :key="item.label"
+            class="rounded-lg border border-gm-border bg-white p-6"
+            data-stagger-item
+          >
+            <p class="text-[34px] font-semibold leading-none text-gm-green">{{ item.value }}</p>
+            <h3 class="mt-4 text-[18px] font-semibold text-[#262626]">{{ item.label }}</h3>
+            <p class="mt-3 text-sm leading-7 text-[#666]">{{ item.note }}</p>
+          </article>
+        </div>
+
+        <div class="grid gap-5 md:grid-cols-2" data-stagger>
+          <NuxtLink
+            v-for="item in results.cases"
+            :key="item.href"
+            :to="item.href"
+            class="rounded-lg border border-gm-border bg-white p-6 shadow-sm transition hover:shadow-hover"
+            data-stagger-item
+            data-hover-card
+          >
+            <p class="text-xs uppercase tracking-[0.28em] text-gm-green">Case Proof</p>
+            <h3 class="mt-4 text-[20px] font-semibold leading-7 text-[#262626]">{{ item.title }}</h3>
+            <p class="mt-4 text-sm leading-7 text-[#666]">{{ item.summary }}</p>
+            <p class="mt-6 font-mono text-[11px] text-[#999]">
+              案例路径 {{ item.path }}
+            </p>
+            <span class="mt-4 inline-flex items-center gap-2 text-sm font-medium text-gm-green">
+              查看案例详情 <span aria-hidden="true">→</span>
+            </span>
+          </NuxtLink>
+        </div>
+      </div>
+    </div>
+  </section>
+</template>