feat(router): 添加分享页面并优化广告页面逻辑

- 在路由中添加 share 页面，用于展示分享内容
- 在 AD 页面中增加 hasShare 状态，用于判断是否处于分享页面
- 根据 hasShare 状态动态调整 AD 页面样式
- 新增 Share 组件，用于渲染分享页面

src/router/index.ts

@@ -164,6 +164,12 @@ const router = createRouter({
       name: 'design',
       meta: {},
       component: Design
+    },
+    {
+      path: '/share/:code',
+      name: 'share',
+      meta: {},
+      component: () => import('@/views/Share/Index.vue')
     }
   ]
 });

src/views/AD/Index.vue

@@ -7,11 +7,11 @@ const router = useRouter();
 const { banners } = fetchBanners();
 const route = useRoute();
 const bannerInfo = computed(() => {
-  console.log(banners.value);
+  // console.log(banners.value);
-
   return banners.value?.find((item: any) => item.code === route.params.code);
 });
-
+// 当前是否处于分享页面
+const hasShare = defineModel<boolean>('hasShare', { default: false });
 function handleButtonClick() {
   if (!bannerInfo.value?.url) {
     router.push({ name: 'intelligentGeneration' });
@@ -23,7 +23,7 @@ function handleButtonClick() {
 </script>
 
 <template>
-  <section class="banner-container">
+  <section class="banner-container" :style="{ background: hasShare ? 'white' : undefined }">
     <section class="msg-info">
       <h3>{{ bannerInfo?.title }}</h3>
       <el-space spacer="|">
@@ -61,6 +61,7 @@ function handleButtonClick() {
     >
       <!--    立即进入   -->
       <el-button
+        v-if="hasShare"
         style="width: 95%; height: 50px; border-radius: 15px"
         color="#70b937"
         @click="handleButtonClick"
@@ -77,7 +78,6 @@ function handleButtonClick() {
 .banner-container {
   padding: $gap * 2;
   margin-bottom: $gap * 6;
-
   .msg-info {
     font-family: PingFangSC-Medium;
     h2 {

src/views/Share/Index.vue

@@ -0,0 +1,11 @@
+<script setup lang="ts">
+import { defineAsyncComponent } from 'vue';
+
+const shareComponent = defineAsyncComponent(() => import('@/views/AD/Index.vue'));
+</script>
+
+<template>
+  <share-component :has-share="true" />
+</template>
+
+<style lang="scss" scoped></style>