feat: 官网代码全量更新
覆盖最新版本代码,包含: - 新增品牌百科、公司百科页面及CMS管理 - 新增微信引导组件(WechatCTA) - 新增品牌/公司图片资源 - 全站组件/页面/数据/样式更新 Co-Authored-By: Claude Opus 4.6 (1M context) <noreply@anthropic.com>
这个提交包含在:
@@ -0,0 +1,138 @@
|
||||
<template>
|
||||
<section class="wechat-cta" :class="`wechat-cta--${bg}`">
|
||||
<div class="container">
|
||||
<div class="wechat-cta-inner">
|
||||
<div class="wechat-cta-text">
|
||||
<h2 class="wechat-cta-title">{{ title }}</h2>
|
||||
<p class="wechat-cta-desc">{{ description }}</p>
|
||||
<div v-if="links && links.length" class="wechat-cta-links">
|
||||
<NuxtLink
|
||||
v-for="link in links"
|
||||
:key="link.to"
|
||||
:to="link.to"
|
||||
class="wechat-cta-link"
|
||||
>
|
||||
{{ link.text }} →
|
||||
</NuxtLink>
|
||||
</div>
|
||||
</div>
|
||||
<div class="wechat-cta-qr">
|
||||
<img src="/images/contact/qrcode-wechat.jpg" alt="定制师微信二维码" class="wechat-cta-qrimg" />
|
||||
<span class="wechat-cta-qrlabel">扫码添加定制师微信</span>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</section>
|
||||
</template>
|
||||
|
||||
<script setup>
|
||||
defineProps({
|
||||
title: { type: String, default: '想聊聊行程?扫码找定制师' },
|
||||
description: { type: String, default: '添加微信,定制师根据你的家庭情况和假期安排,1对1推荐合适的行程方案。' },
|
||||
links: { type: Array, default: () => [] },
|
||||
bg: { type: String, default: 'light' },
|
||||
})
|
||||
</script>
|
||||
|
||||
<style lang="less" scoped>
|
||||
.wechat-cta {
|
||||
.section-padding();
|
||||
}
|
||||
|
||||
.wechat-cta--light {
|
||||
background: @color-bg-gray;
|
||||
}
|
||||
|
||||
.wechat-cta--white {
|
||||
background: #fff;
|
||||
}
|
||||
|
||||
.wechat-cta--green {
|
||||
background: linear-gradient(135deg, @color-primary-dark 0%, @color-primary 100%);
|
||||
|
||||
.wechat-cta-title {
|
||||
color: #fff;
|
||||
&::after { display: none; }
|
||||
}
|
||||
.wechat-cta-desc { color: rgba(255, 255, 255, 0.85); }
|
||||
.wechat-cta-link { color: rgba(255, 255, 255, 0.9); &:hover { color: #fff; } }
|
||||
.wechat-cta-qrlabel { color: rgba(255, 255, 255, 0.8); }
|
||||
}
|
||||
|
||||
.wechat-cta-inner {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
gap: @space-2xl;
|
||||
max-width: 720px;
|
||||
margin: 0 auto;
|
||||
|
||||
@media (max-width: 640px) {
|
||||
flex-direction: column;
|
||||
text-align: center;
|
||||
gap: @space-lg;
|
||||
}
|
||||
}
|
||||
|
||||
.wechat-cta-text {
|
||||
flex: 1;
|
||||
}
|
||||
|
||||
.wechat-cta-title {
|
||||
font-size: @font-size-xl;
|
||||
font-weight: @font-weight-bold;
|
||||
color: @color-text-primary;
|
||||
margin-bottom: @space-sm;
|
||||
|
||||
&::after { display: none; }
|
||||
}
|
||||
|
||||
.wechat-cta-desc {
|
||||
font-size: @font-size-base;
|
||||
line-height: @line-height-relaxed;
|
||||
color: @color-text-secondary;
|
||||
}
|
||||
|
||||
.wechat-cta-links {
|
||||
margin-top: @space-md;
|
||||
display: flex;
|
||||
gap: @space-md;
|
||||
|
||||
@media (max-width: 640px) {
|
||||
justify-content: center;
|
||||
}
|
||||
}
|
||||
|
||||
.wechat-cta-link {
|
||||
font-size: @font-size-sm;
|
||||
color: @color-primary;
|
||||
text-decoration: none;
|
||||
font-weight: @font-weight-medium;
|
||||
|
||||
&:hover {
|
||||
color: @color-primary-dark;
|
||||
}
|
||||
}
|
||||
|
||||
.wechat-cta-qr {
|
||||
flex-shrink: 0;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
align-items: center;
|
||||
gap: @space-xs;
|
||||
}
|
||||
|
||||
.wechat-cta-qrimg {
|
||||
width: 140px;
|
||||
height: 140px;
|
||||
border-radius: @border-radius-sm;
|
||||
background: #fff;
|
||||
object-fit: contain;
|
||||
box-shadow: 0 2px 12px rgba(0, 0, 0, 0.08);
|
||||
}
|
||||
|
||||
.wechat-cta-qrlabel {
|
||||
font-size: @font-size-xs;
|
||||
color: @color-text-muted;
|
||||
}
|
||||
</style>
|
||||
在新工单中引用
屏蔽一个用户