diff --git a/app.vue b/app.vue index 163a87b..7920030 100644 --- a/app.vue +++ b/app.vue @@ -7,4 +7,5 @@ const isInteriorPage = computed(() => route.path !== '/') + diff --git a/assets/css/main.css b/assets/css/main.css index 7caae71..43c34fb 100644 --- a/assets/css/main.css +++ b/assets/css/main.css @@ -275,8 +275,8 @@ a:focus-visible { background 0.32s ease; } .stat-item img { - width: 86px; - height: 86px; + width: 150px; + height: 150px; object-fit: contain; margin-bottom: 19px; } @@ -465,10 +465,10 @@ a:focus-visible { } .lead-advantage { display: grid; - grid-template-columns: 47% 1fr; - align-items: center; + grid-template-columns: minmax(0, 47%) minmax(0, 1fr); + align-items: stretch; gap: 24px; - height: 182px; + min-height: 182px; overflow: hidden; margin-top: 56px; border-radius: 13px; @@ -478,12 +478,16 @@ a:focus-visible { box-shadow 0.32s ease; } .lead-advantage > img { + display: block; width: 100%; - height: 100%; + height: 182px; + max-height: 182px; object-fit: cover; transition: transform 0.55s cubic-bezier(0.2, 0.75, 0.2, 1); } .lead-advantage > div { + align-self: center; + min-width: 0; padding: 16px 30px; } .lead-advantage h3, @@ -593,15 +597,31 @@ a:focus-visible { .industries-section { padding: 80px 0 111px; } +.industries-content { + width: 100%; +} .industry-grid { - display: grid; - grid-template-columns: repeat(3, 1fr); + width: max-content; + max-width: 100%; + display: flex; + flex-wrap: nowrap; gap: 30px; - margin-top: 76px; + overflow-x: auto; + margin: 76px auto 0; + padding: 0 24px; + scrollbar-width: none; +} +.industry-grid::-webkit-scrollbar { + display: none; } .industry-grid article { position: relative; - min-height: 311px; + flex: 0 0 min(560px, calc(100vw - 48px)); + display: grid; + grid-template-columns: minmax(190px, 220px) minmax(0, 1fr); + grid-template-rows: auto 25px auto minmax(0, 1fr) auto; + column-gap: 18px; + min-height: 324px; overflow: hidden; padding: 26px; border-radius: 12px; @@ -611,31 +631,41 @@ a:focus-visible { box-shadow 0.32s ease; } .industry-grid h3 { + grid-column: 1 / -1; margin: 0; color: #414141; font-size: 26px; } .industry-grid img { - width: 45%; - height: 150px; - object-fit: contain; - float: left; - margin: 25px 15px 0 -8px; + grid-row: 3 / 6; + width: 100%; + height: auto; + aspect-ratio: 1 / 1; + object-fit: cover; + float: none; + margin: 0; + border-radius: 9px; } .quote { - margin-top: 33px; + grid-column: 2; + grid-row: 3; + margin-top: 8px; color: #787878; font-weight: 700; font-size: 43px; line-height: 0.55; } .industry-grid p { - margin: 19px 0 14px; + grid-column: 2; + grid-row: 4; + margin: 12px 0 14px; color: #777; font-size: 15px; line-height: 1.5; } .tags { + grid-column: 2; + grid-row: 5; display: flex; gap: 9px; } @@ -696,24 +726,34 @@ a:focus-visible { padding: 88px 0 78px; background: #fff; } +.testimonial-section .page-width { + overflow: hidden; +} .testimonial-track { + --testimonial-gap: 24px; + --testimonial-loop-offset: 12px; display: flex; - gap: 24px; - width: max-content; + gap: var(--testimonial-gap); + width: 100%; margin-top: 62px; - transform: translateX(-520px); +} +.testimonial-track.is-centered { + justify-content: center; +} +.testimonial-track.is-carousel { + width: max-content; + animation: testimonial-carousel 34s linear infinite; +} +.testimonial-track.is-carousel:hover { + animation-play-state: paused; } .testimonial-track article { - width: 460px; + flex: 0 0 400px; min-height: 216px; padding: 25px 27px; border-radius: 10px; background: #f9fbff; color: #767676; - transition: - transform 0.3s ease, - box-shadow 0.3s ease, - background 0.3s ease; } .testimonial-track header { display: flex; @@ -726,6 +766,7 @@ a:focus-visible { height: 38px; border-radius: 50%; background: linear-gradient(135deg, #516b71, #f3bc94); + object-fit: cover; } .testimonial-track time { margin-left: auto; @@ -736,6 +777,11 @@ a:focus-visible { font-size: 15px; line-height: 1.65; } +@keyframes testimonial-carousel { + to { + transform: translate3d(calc(-50% - var(--testimonial-loop-offset)), 0, 0); + } +} .cta-section { position: relative; @@ -803,11 +849,6 @@ a:focus-visible { box-shadow: 0 15px 30px rgba(63, 135, 239, 0.16); transform: translateY(-5px); } - .testimonial-track article:hover { - background: #fff; - box-shadow: 0 16px 28px rgba(72, 135, 226, 0.13); - transform: translateY(-6px); - } } @media (min-width: 761px) { @@ -815,19 +856,7 @@ a:focus-visible { will-change: transform; } .section-title h2::after { - position: absolute; - right: 42%; - bottom: -13px; - left: 42%; - height: 2px; - content: ''; - border-radius: 2px; - background: linear-gradient(90deg, transparent, rgba(20, 120, 251, 0.78), transparent); - opacity: 0; - transform: scaleX(0); - transition: - transform 0.75s cubic-bezier(0.22, 1, 0.36, 1), - opacity 0.45s ease; + display: none; } .section-title.is-visible h2::after { opacity: 1; @@ -855,12 +884,14 @@ a:focus-visible { box-shadow: inset 0 0 0 1px rgba(113, 169, 255, 0.24); opacity: var(--spot-opacity); } + .case-content .motion-card::after { + box-shadow: none; + } .motion-card img { will-change: transform; } .case-background, - .delivery-banner, - .testimonial-track { + .delivery-banner { will-change: transform; } } @@ -874,6 +905,11 @@ a:focus-visible { animation-duration: 0.01ms !important; animation-iteration-count: 1 !important; } + .testimonial-track.is-carousel { + width: 100%; + overflow-x: auto; + animation: none !important; + } } @media (max-width: 1050px) { @@ -895,35 +931,72 @@ a:focus-visible { width: min(100% - 32px, 560px); } .hero-section { - height: min(720px, calc(100svh - 58px)); - min-height: 570px; + height: auto; + min-height: min(700px, calc(100svh - 58px)); + overflow: hidden; + background: + radial-gradient(circle at 82% 78%, rgba(68, 165, 255, 0.24), transparent 36%), + linear-gradient(180deg, #f7fbff 0%, #eaf3ff 56%, #dfeeff 100%); + } + .hero-section::after { + position: absolute; + z-index: 0; + inset: 0; + content: ''; + pointer-events: none; + background: linear-gradient( + 180deg, + rgba(247, 251, 255, 0.98) 0%, + rgba(247, 251, 255, 0.92) 38%, + rgba(247, 251, 255, 0.46) 62%, + rgba(247, 251, 255, 0.08) 100% + ); } .hero-art { - background-position: right bottom; - background-size: auto 74%; - opacity: 0.72; + z-index: 0; + inset: auto -54% -28px -50%; + height: 58%; + background-position: center bottom; + background-size: min(760px, 170vw) auto; + opacity: 0.9; + filter: saturate(1.06) contrast(1.02); + -webkit-mask-image: linear-gradient(to top, #000 76%, transparent 100%); + mask-image: linear-gradient(to top, #000 76%, transparent 100%); will-change: transform; } .hero-content { + position: relative; + z-index: 1; + min-height: inherit; align-items: flex-start; - padding-top: clamp(72px, 13vh, 112px); + padding-top: clamp(62px, 10svh, 92px); + padding-bottom: min(43vh, 310px); } .hero-copy { margin: 0; - max-width: 340px; + max-width: 360px; } .hero-copy h1 { font-size: clamp(28px, 8.2vw, 36px); line-height: 1.28; - letter-spacing: -0.5px; + letter-spacing: 0; text-wrap: balance; } .hero-points { display: grid; margin: 22px 0 27px; - gap: 10px; + gap: 9px; font-size: 13px; - max-width: 300px; + max-width: 320px; + } + .hero-points span { + width: fit-content; + padding: 7px 10px; + border: 1px solid rgba(70, 139, 230, 0.12); + border-radius: 6px; + background: rgba(255, 255, 255, 0.74); + box-shadow: 0 8px 20px rgba(57, 124, 216, 0.08); + backdrop-filter: blur(10px); } .button-row { width: min(100%, 310px); @@ -962,7 +1035,7 @@ a:focus-visible { } .section-title p { max-width: 34em; - margin: 11px auto 0; + margin: 15px auto 0; font-size: 12px; line-height: 1.6; } @@ -1048,7 +1121,6 @@ a:focus-visible { padding: 19px; } .advantage-grid, - .industry-grid, .delivery-grid { grid-template-columns: 1fr; gap: 16px; @@ -1089,16 +1161,21 @@ a:focus-visible { } .industry-grid { margin-top: 40px; + gap: 16px; + padding: 0 16px; } .industry-grid article { - min-height: 280px; + flex-basis: min(92vw, 430px); + grid-template-columns: minmax(0, 43%) minmax(0, 1fr); + min-height: 290px; padding: 23px; } .industry-grid h3 { font-size: 23px; } .industry-grid img { - height: 130px; + height: auto; + min-height: 0; } .delivery-banner { height: 118px; @@ -1114,19 +1191,19 @@ a:focus-visible { font-size: 18px; } .testimonial-track { - transform: none; - overflow-x: auto; - width: 100%; + --testimonial-gap: 16px; + --testimonial-loop-offset: 8px; + gap: var(--testimonial-gap); margin-top: 35px; - padding: 0 16px 16px; - margin-right: -16px; - margin-left: -16px; + } + .testimonial-track.is-centered { + overflow-x: auto; + padding-bottom: 16px; scroll-snap-type: x mandatory; scrollbar-width: none; } .testimonial-track article { - min-width: min(82vw, 330px); - width: min(82vw, 330px); + flex-basis: min(82vw, 330px); scroll-snap-align: center; } .cta-section { @@ -1153,11 +1230,20 @@ a:focus-visible { width: calc(100% - 24px); } .hero-content { - padding-top: 62px; + padding-top: 54px; + padding-bottom: 260px; } .hero-copy h1 { font-size: 28px; } + .hero-art { + right: -72%; + left: -70%; + height: 54%; + } + .button-row { + width: min(100%, 300px); + } .stats-panel { gap: 9px; padding: 10px; diff --git a/components/AppIcon.vue b/components/AppIcon.vue index ef0d75d..6989163 100644 --- a/components/AppIcon.vue +++ b/components/AppIcon.vue @@ -1,4 +1,4 @@ - + + + + diff --git a/components/chat/OfficialChatWindow.client.vue b/components/chat/OfficialChatWindow.client.vue new file mode 100644 index 0000000..c02c751 --- /dev/null +++ b/components/chat/OfficialChatWindow.client.vue @@ -0,0 +1,852 @@ + + + + + + diff --git a/components/site/SiteFooter.vue b/components/site/SiteFooter.vue index 9d1941c..73b5187 100644 --- a/components/site/SiteFooter.vue +++ b/components/site/SiteFooter.vue @@ -1,6 +1,73 @@ @@ -497,19 +527,16 @@ onBeforeUnmount(() => {
-
- +
+
-

- -

+

{{ heroTitle }}

+

{{ heroDescription }}

✓ {{ tag }}

@@ -620,15 +647,15 @@ onBeforeUnmount(() => {
-
+
-

{{ title }}

-

核心点：{{ text }}

-

价值：提升AI搜索权重，构建持续增长的品牌信任力

+

{{ item.heading }}

+

核心点：{{ item.bodyOne }}

+

价值：{{ item.bodyTwo }}

@@ -656,26 +683,28 @@ onBeforeUnmount(() => {
-
- {{ industryBlockSection.title || '深耕12+行业，定制专属GEO增长方案' - }} -
-
-

{{ card[0] }}

- -
“
-

某企业服务客户：
{{ card[1] }}

-
- #{{ tag }} -
-
+
+
+ {{ industryBlockSection.title || '深耕12+行业，定制专属GEO增长方案' + }} +
+
+

{{ card[0] }}

+ +
“
+

某企业服务客户：
{{ card[1] }}

+
+ #{{ tag }} +
+
+
@@ -709,11 +738,26 @@ onBeforeUnmount(() => { >Genuine Client Testimonials Attest To Our Service Quality -
-
+
+
- {{ item.name }}{{ item.name }}

{{ item.description }}

@@ -721,7 +765,15 @@ onBeforeUnmount(() => {
- +
+ +
diff --git a/pages/insights/index.vue b/pages/insights/index.vue index 8ade118..917cb58 100644 --- a/pages/insights/index.vue +++ b/pages/insights/index.vue @@ -5,9 +5,11 @@ import SiteFooter from '~/components/site/SiteFooter.vue' const { ALL_LABEL, LATEST_LABEL, + buildMediaMap, bySortAndTime, - categoryList, + fetchPublicCategories, fetchPublicContent, + fetchPublicMediaAsset, normalizeArticle, normalizeWhitepaper } = useOfficialContent() @@ -17,17 +19,30 @@ const visibleCount = ref(4) const { openConsultation } = useConsultation() const { data: pageData } = await useAsyncData('public-insights', async () => { - const [articleRows, whitepaperRows] = await Promise.all([ + const [articleRows, whitepaperRows, categories] = await Promise.all([ fetchPublicContent('ARTICLE'), - fetchPublicContent('WHITEPAPER') + fetchPublicContent('WHITEPAPER'), + fetchPublicCategories().catch(() => ({})) ]) + const whitepaperAssetIds = Array.from( + new Set( + whitepaperRows.flatMap((item) => [item.coverAssetId, item.documentAssetId]).filter(Boolean) + ) + ) + const whitepaperMediaRows = await Promise.all( + whitepaperAssetIds.map((id) => fetchPublicMediaAsset(id).catch(() => null)) + ) + const whitepaperMediaMap = buildMediaMap(whitepaperMediaRows.filter(Boolean)) return { articles: articleRows.sort(bySortAndTime).map((item) => normalizeArticle(item, new Map())), - whitepapers: whitepaperRows.sort(bySortAndTime).map((item) => normalizeWhitepaper(item, new Map())) + whitepapers: whitepaperRows + .sort(bySortAndTime) + .map((item) => normalizeWhitepaper(item, whitepaperMediaMap)), + categories: categories || {} } }) - +useRefreshNuxtDataOnResume('public-insights') const insights = computed(() => pageData.value?.articles || []) const whitepapers = computed(() => pageData.value?.whitepapers || []) const featuredInsight = computed( @@ -36,7 +51,15 @@ const featuredInsight = computed( const featuredWhitepaper = computed( () => whitepapers.value.find((item) => item.isFeatured) || whitepapers.value[0] || null ) -const insightCategories = computed(() => categoryList(insights.value, 'category', [LATEST_LABEL])) +const insightCategories = computed(() => [ + ALL_LABEL, + LATEST_LABEL, + ...Array.from( + new Set( + (pageData.value?.categories?.insightCategories || []).map((item) => item.name).filter(Boolean) + ) + ) +]) useHead({ title: '增长洞察｜大马棒·云途全域 GEO', @@ -74,7 +97,7 @@ function requestWhitepaper(source) { openConsultation({ title: featuredWhitepaper.value?.title || '获取行业白皮书', - need: featuredWhitepaper.value?.title || '行业白皮书', + need: '行业白皮书', source }) } @@ -227,9 +250,14 @@ function articleTags(article) {
REPORT2026
-

{{ featuredWhitepaper?.category || '行业白皮书' }}

+ +

行业白皮书

{{ featuredWhitepaper?.title || 'AI 搜索与品牌增长观察' }}

- {{ featuredWhitepaper?.excerpt || '用户行为 · 内容信源 · 衡量框架 · 行业实践' }} + + + {{ + featuredWhitepaper?.excerpt || '用户行为 · 内容信源 · 衡量框架 · 行业实践' + }}