feat: 更新广告页面和路由跳转逻辑

1. 添加了banner请求相关的类型定义和hooks
2. 更新了广告页面的路由跳转逻辑，支持传递code参数
3. 修改了相关组件的导入和使用方式
4. 更新了类型定义文件以支持新的功能
5. 优化了图片轮播组件的交互逻辑

env.d.ts

@@ -4,3 +4,9 @@ declare module '*.vue' {
     const component: DefineComponent<{}, {}, any>;
     export default component;
 }
+
+interface Window {
+  ReactNativeWebView: {
+    postMessage: (message: string) => void;
+  };
+}

src/api/ad/index.ts

@@ -1,3 +1,4 @@
+import type { BannerResponse } from '@/hooks/request/types/response';
 import request from '@/utils/request';
 
 /**
@@ -5,8 +6,8 @@ import request from '@/utils/request';
  * @param source {1}
  */
 export function queryBannerList(source = 1) {
-  return request<unknown>({
+  return request<BannerResponse>({
     url: `/console/banner/query_banner_list`,
     params: { source }
   });
-}
+}

src/hooks/request/banner.ts

@@ -0,0 +1,16 @@
+import { queryBannerList } from '@/api/ad';
+import type { AxiosResponse } from 'axios';
+import { ref } from 'vue';
+import type { BannerResponse } from './types/response';
+
+function fetchBanners() {
+  const banners = ref<BannerItem[]>();
+  queryBannerList().then((response: AxiosResponse<BannerResponse>) => {
+    // console.log(response);
+    banners.value = response.data.data.banner_list;
+  });
+
+  return { banners };
+}
+
+export { fetchBanners };

src/hooks/request/types/banners.d.ts

@@ -0,0 +1,20 @@
+interface BannerItem {
+  sort: number;
+  code: string;
+  title: string | null;
+  synopsis: string | null;
+  type: number;
+  characters: string | null;
+  url: string | null;
+  publish_time: string; // 可以使用 Date 类型，但原始数据是字符串格式
+  banner_address: string;
+  is_jump: number; // 假设是整数表示布尔值（0 或 1）
+  carousel_button_name: string | null;
+  file_address: string;
+  is_display_button: number; // 同上
+  button_name: string;
+}
+
+interface Banners {
+  banner_list: BannerItem[];
+}

src/hooks/request/types/response.d.ts

@@ -6,4 +6,5 @@ export interface CDMResponse<T>{
   message: string;
 }
 
-type HomeRecommendResponse = CDMResponse<HomeRecommend>;
+type HomeRecommendResponse = CDMResponse<HomeRecommend>;
+type BannerResponse = CDMResponse<Banners>;

src/layouts/redirect.vue

@@ -13,6 +13,13 @@
         <template #left>
           <van-icon name="left-long" class-prefix="mobilefont" size="18" style="color: #000" />
         </template>
+        <template #right>
+          <el-icon
+            class="nav-layout-right"
+            @click="route.meta.shareAction && route.meta.shareFunc()"
+            ><RiShareForwardBoxFill
+          /></el-icon>
+        </template>
       </van-nav-bar>
     </header>
     <!-- content -->
@@ -23,12 +30,12 @@
 </template>
 
 <script setup>
+import { RiShareForwardBoxFill } from 'vue-icons-plus/ri';
 import { RouterView, useRoute } from 'vue-router';
 import appBridge from '@/assets/js/appBridge';
 
 const route = useRoute();
 console.log(route.meta.pureBGC);
-// const router = useRouter();
 
 function goBack() {
   if (window.history.length > 1 && route.name !== 'home') {
@@ -63,6 +70,9 @@ const handlePopState = () => {
   height: 100vh;
   background-color: theme.$nav-header-color;
   color: #333;
+
+  .nav-layout-right {
+  }
 }
 
 .redirect-body {

src/router/index.ts

@@ -2,6 +2,7 @@ import { createRouter, createWebHistory } from 'vue-router';
 import layout from '@/layouts/index.vue';
 import Design from '@/views/Design/Index.vue';
 import Redirect from '@/layouts/redirect.vue';
+import type { title } from 'process';
 
 const router = createRouter({
   history: createWebHistory(import.meta.env.BASE_URL),
@@ -111,11 +112,23 @@ const router = createRouter({
           component: () => import('@/views/Survey/views/Analysis/Index.vue')
         },
         {
-          path: '/ad',
+          path: '/ad/:code',
           name: 'ad',
           meta: {
             pureBGC: true,
-            title: "伊调研123123"
+            title: "伊调研",
+            shareAction : true,
+            shareFunc : () => {
+              if(window.ReactNativeWebView){
+                window.ReactNativeWebView.postMessage(JSON.stringify({
+                  type: 'shareModal',
+                  title: '分享标题',
+                  description:'分享副标题',
+                  thumbImageUrl:'https://logo.png',
+                  webpageUrl: window.location.href
+                }));
+              }
+            } 
           },
           component: () => import('@/views/AD/Index.vue')
         }

src/views/AD/Index.vue

@@ -1,5 +1,15 @@
 <script setup lang="ts">
-import { bannerInfo } from '@/views/AD/hooks/useAD';
+import { fetchBanners } from '@/hooks/request/banner';
+import { computed } from 'vue';
+import { useRoute } from 'vue-router';
+
+const { banners } = fetchBanners();
+const route = useRoute();
+const bannerInfo = computed(() => {
+  console.log(banners.value);
+
+  return banners.value?.find((item: any) => item.code === route.params.code);
+});
 </script>
 
 <template>

src/views/Home/components/ImageSlider/Index.vue

@@ -1,7 +1,9 @@
 <script setup lang="ts">
-import { banners } from '@/views/Home/components/ImageSlider/hooks/useSlider';
 import { useRouter } from 'vue-router';
 import { bannerInfo } from '@/views/AD/hooks/useAD';
+import { fetchBanners } from '@/hooks/request/banner';
+
+const { banners } = fetchBanners();
 
 const router = useRouter();
 // const defineBanners = defineModel('banners');
@@ -12,7 +14,7 @@ const borderRadius = defineModel('borderRadius');
 function handleBannerClick(banner: any) {
   // 把对应的信息给 AD 的 hooks
   bannerInfo.value = banner;
-  router.push({ name: 'ad' });
+  router.push({ name: 'ad', params: { code: banner.code } });
 }
 </script>