首页添加更多跳转 各个模块新增动态banner

src/components/index/base/Answer.vue

@@ -5,6 +5,9 @@
             <div class="title-text">在线问答</div>
             <div class="title-line">Online Q&A</div>
             <div class="blueline"></div>
+            <div @click="goto()" class="boxText_link">
+                更多 >
+            </div>
         </div>
         <div class="newsBox" style="display: none;">
             <div  class="news" v-for="item in list" :key="item.id">
@@ -29,7 +32,12 @@ import {onMounted,ref,reactive,watch} from 'vue'
 import { RightSquareFilled } from '@ant-design/icons-vue';
 import {contentPage} from '@/http/api/common.js' 
 import CommentList from '../../NewsCom/base/comment-list.vue'
+import {useRouter} from 'vue-router'
+const router=useRouter()
 const list = ref([])
+//使用pinia缓存数据
+import { useCounterStore } from "@/stores/counter";
+const counter = useCounterStore();
 
 const CommentId = ref('')
 const ModalData =ref({
@@ -59,6 +67,17 @@ const getcontentPage =async () =>{
 
     list.value = res.data.rows
 }
+const goto = (id) => {
+    //回到顶部
+    const targetElement = document.getElementById('top');
+    if (targetElement) {
+        targetElement.scrollIntoView();
+    }
+    
+    counter.indexMeunKey = 'zxwd'
+    localStorage.setItem("indexMeunKey", 'zxwd');
+    router.push('/CompanyNews?openType=4&title=在线问答')
+}
 const openModal = async (item) =>{
     ModalData.value = item
     open.value = true
@@ -133,7 +152,13 @@ const openModal = async (item) =>{
     width: 100%;
     align-items: center;
 }
-
+.boxText_link{
+    position: absolute;
+    right: 35px;
+    top: 120px;
+    cursor: pointer;
+    color: #46a7ff;
+}
 @media (max-width: 500px) {
     .newsBox {
         width: 100%;

src/components/index/base/CompanyNews.vue

@@ -71,6 +71,7 @@ const goto = (id) => {
     }
     
     counter.indexMeunKey = tabData.value.menuId
+    localStorage.setItem("indexMeunKey", tabData.value.menuId);
     router.push('CompanyNews?openType=2&muenId=' + tabData.value.menuId +'&title=最新资讯')
 }
 

src/components/index/base/NewsType2.vue

@@ -5,7 +5,11 @@
             <div class="title-text">{{tabData.titleAlias ||tabData.menuIdName}}</div>
             <div class="title-line">{{tabData.titleEn}}</div>
             <div class="blueline"></div>
+            <div @click="goto()" class="boxText_link">
+                更多 >
+            </div>
         </div>
+        
         <div class="newsBox">
             <div @click="openDetail(item)" style="display: none;" class="news" v-for="item in list" :key="item.id">
                 <div class="news_title">{{item.title}}</div>
@@ -42,10 +46,20 @@ watch(()=>counter.homeList,(val)=>{
     list.value.forEach(v => {
         v.fileUrl = v.coverList[0].fileUrl
     })
-    // console.log(list.value );
+    console.log('tabData.value',tabData.value);
     // console.log(articleObjList);
 })
-
+const goto = (id) => {
+    //回到顶部
+    const targetElement = document.getElementById('top');
+    if (targetElement) {
+        targetElement.scrollIntoView();
+    }
+    
+    counter.indexMeunKey = tabData.value.menuId
+    localStorage.setItem("indexMeunKey", tabData.value.menuId);
+    router.push('CompanyNews?openType=2&muenId=' + tabData.value.menuId +'&title='+ tabData.value.menuIdName)
+}
 function openDetail (e){
     //回到顶部
     const targetElement = document.getElementById('top');
@@ -134,6 +148,13 @@ function openDetail (e){
     width: 100%;
     align-items: center;
 }
+.boxText_link{
+    position: absolute;
+    right: 35px;
+    top: 120px;
+    cursor: pointer;
+    color: #46a7ff;
+}
 @media (max-width: 500px) {
     .newsBox {
         width: 100%;

src/components/index/base/NewsType3.vue

@@ -5,6 +5,9 @@
             <div class="title-text">{{tabData.titleAlias ||tabData.menuIdName}}</div>
             <div class="title-line">{{tabData.titleEn}}</div>
             <div class="blueline"></div>
+            <div @click="goto()" class="boxText_link">
+                更多 >
+            </div>
         </div>
         <div class="newsBox">
             <div @click="openDetail(item)" style="display: none;" class="news" v-for="item in list" :key="item.id">
@@ -53,7 +56,17 @@ watch(()=>counter.homeList,(val)=>{
     // console.log(list.value );
     // console.log(articleObjList);
 })
-
+const goto = (id) => {
+    //回到顶部
+    const targetElement = document.getElementById('top');
+    if (targetElement) {
+        targetElement.scrollIntoView();
+    }
+    
+    counter.indexMeunKey = tabData.value.menuId
+    localStorage.setItem("indexMeunKey", tabData.value.menuId);
+    router.push('CompanyNews?openType=2&muenId=' + tabData.value.menuId +'&title='+ tabData.value.menuIdName)
+}
 function openDetail (e){
     //回到顶部
     const targetElement = document.getElementById('top');
@@ -112,6 +125,7 @@ function openDetail (e){
     height: 217px;
 }
 .newsborder{
+    border: 5px solid #ffffff;
     width: 386px;
     height: 217px;
 }
@@ -146,7 +160,7 @@ function openDetail (e){
     width: 50px;
     height: 50px;
     position: relative;
-    top: -120px;
+    top: -110px;
     z-index: 150;
     left: 43%;
     cursor: pointer;
@@ -156,7 +170,13 @@ function openDetail (e){
 .news_img:hover + .icon_play {
     visibility: visible;
 }
-
+.boxText_link{
+    position: absolute;
+    right: 35px;
+    top: 120px;
+    cursor: pointer;
+    color: #46a7ff;
+}
 @media (max-width: 500px) {
     .newsBox {
         width: 100%;

src/views/components/AboutUsComponent.vue

@@ -1,7 +1,7 @@
 <template>
     <div class="indexCom">
-         <!-- 普通banner组件 -->
-         <ComBanner :bannerImg='bannerImg' :title="title" />
+         <!-- banner组件 -->
+        <CustomCarousel :CarouselHight="CarouselHight" :carouselList="carouselList" />
          <!-- 主页内容 -->
         <AboutUsMain />
 </div>
@@ -10,12 +10,38 @@
 <script setup>
 import {onMounted,ref,reactive, getCurrentInstance} from 'vue'
 import AboutUsMain from '@/components/AboutUs/AboutUsMain.vue'
+import CustomCarousel from '@/components/index/custom-carousel.vue'
+import {getCarouselList} from '@/http/api/common.js' 
 import ComBanner from '@/components/common/com-banner.vue'
-onMounted(() => {
-    
-});
+
 const bannerImg = ref('/img/banner1.jpg')
 const title = ref('关于我们 About Us')
+const CarouselHight = ref('400px')
+const carouselList = ref([])
+
+onMounted(async() => {
+    //获取首页轮播图
+    let data = {
+        "modules": "4",
+        "pageSize": 3,
+        "pageNum": 1
+    }
+    let res2 = await getCarouselList(data)
+    if (res2?.data?.rows) {
+        let List = []
+        res2.data.rows.forEach(item =>{
+            if (item?.carouselUrlList && item?.carouselUrlList[0]) {
+                let data = {
+                    ...item,
+                    ...item?.carouselUrlList[0]
+                }
+                List.push(data)
+            }
+        })
+
+        carouselList.value = List
+    }
+});
 
 </script>
 

src/views/components/CompanyNewsCom.vue

@@ -1,7 +1,7 @@
 <template>
     <div class="indexCom">
-         <!-- 普通banner组件 -->
-         <ComBanner :bannerImg='bannerImg' :title="title" />
+         <!-- banner组件 -->
+         <CustomCarousel :CarouselHight="CarouselHight" :carouselList="carouselList" />
          <!-- 主页内容 -->
          <component :is="currentview" :muenId="muenId"></component>
 </div>
@@ -10,6 +10,8 @@
 <script setup>
 import {onMounted,ref,shallowRef,watch,getCurrentInstance} from 'vue'
 import ComBanner from '@/components/common/com-banner.vue'
+import CustomCarousel from '@/components/index/custom-carousel.vue'
+import {getCarouselList} from '@/http/api/common.js' 
 import {useRoute} from 'vue-router'
 //使用pinia缓存数据
 import { useCounterStore } from '@/stores/counter'
@@ -31,6 +33,9 @@ const showtype = ref('0')
 const bannerImg = ref('/img/banner1.jpg')
 const title = ref('最新资讯')
 
+const CarouselHight = ref('400px')
+const carouselList = ref([])
+
 const menulist = shallowRef({
     "0":NewsType0, //科技创新 展示多块图片 
     "1":NewsType1, //富文本
@@ -46,12 +51,40 @@ const muenId = ref('')
 
 
 onMounted(async() => {
-    // console.log(route.query);
     // showtype.value = route.query.openType
     // currentview.value = menulist.value[showtype.value]
 
     // muenId.value = route.query.muenId
+    
 });
+const getCarousel = async() => {
+    let modules = '3'
+    if (route.query.muenId && route.query.muenId != '') {
+        modules = route.query.muenId
+    }
+    
+    //获取首页轮播图
+    let data = {
+        "modules": modules,
+        "pageSize": 3,
+        "pageNum": 1
+    }
+    let res2 = await getCarouselList(data)
+    if (res2?.data?.rows) {
+        let List = []
+        res2.data.rows.forEach(item =>{
+            if (item?.carouselUrlList && item?.carouselUrlList[0]) {
+                let data = {
+                    ...item,
+                    ...item?.carouselUrlList[0]
+                }
+                List.push(data)
+            }
+        })
+
+        carouselList.value = List
+    }
+}
 watch(
   () => route.query,
   (routeQuery) => {
@@ -64,6 +97,7 @@ watch(
 
         counter.menuName = title.value
     }
+    getCarousel()
   },
   { immediate: true,deep:true }
 )