修改主页新闻列表

tanghaolin

7 天以前 2d1e485d56fbc736b2156347a0e6d602cd048547

 src/views/Home.vue

@@ -4,10 +4,9 @@
      <div class="banner-carousel relative w-screen h-[602px]">
         <el-carousel height="602px" :interval="3000" indicator-position="" pause-on-hover>
            <!-- 视频链接 -->
				 
            <el-carousel-item>
               <div class="carousel-item">
                  <img src="@/assets/carousel/home/1.png" class="carousel-image" />
                  <div class="w-full h-full" id="indexVideo"></div>
               </div>
            </el-carousel-item>
            <el-carousel-item>
@@ -181,18 +180,17 @@
                              为贯彻落实《上海市节能减排（应对气候变化）专项资金管理办法（沪发改规范〔2021〕5号）》和《上海市工业通信业用能设备更新专项扶持实施细则》（沪经信规范〔2025〕1号），进一步推进本市工业通信业用能设备更新工作，现组织开展2025年度上海市工业通信业用能设备更新专项扶持资金项目申报工作。
                           </div>
                        </div>
                        <div class="mt-4">
                        <div class="">
                           <div v-for="(item, index) in newsList" :key="index"
                              class="flex text-regular justify-between items-center news-item">
                              <div class="flex items-center hover:text-primary w-full"
                                 @click="handleNewsClick(item)">
                                 <div class="w-[6px] h-[6px] mr-2 news-list-dot"></div>
                                 <div
                                    class="w-full text-gray-700 hover:text-blue-500 cursor-pointer text-ellipsis overflow-hidden whitespace-nowrap">
                                    class="max-w-[600px] text-gray-700 hover:text-blue-500 cursor-pointer text-ellipsis">
                                    {{ item.title }}
                                 </div>
                              </div>
                              <!-- <div class="text-gray-400 text-sm">{{ item.date }}</div> -->
                           </div>
                        </div>
                     </div>
@@ -254,7 +252,7 @@
                        <span class="text-medium font-medium">工业软件｜工业APP<span class="text-primary">产品分类</span></span>
                     </div>
                  </div> -->
						

                  <div class="flex">
                     <div class="w-[45%] h-[400px]" ref="pieChartRef"></div>
                     <div class="w-[55%] h-[400px]" ref="barChartRef"></div>
@@ -290,7 +288,8 @@
import YWLogo from '@/assets/logo/yw_logo.png';
import axios from 'axios';
import CustomerService from '@/components/CustomerService.vue';

import Player from 'xgplayer';
import 'xgplayer/dist/index.min.css';
import { Swiper, SwiperSlide } from 'swiper/vue';
import { Autoplay, EffectFade, Virtual } from 'swiper/modules';
import 'swiper/css';
@@ -370,6 +369,7 @@
   //    date: '2024-03-07',
   // },
]);

const m_RequestDataObj = {
   1: { requestPath: 'static/EecProductData/Pump.json?v=' + new Date().getTime() },
   2: { requestPath: 'static/EecProductData/AirCompressor.json?v=' + new Date().getTime() },
@@ -391,7 +391,7 @@
   m_CompanyList: [],
   m_PageLoading: false,
});

const videoPlayer = ref<Player | null>(null);
const pieChartRef = ref<HTMLElement | null>(null);
const barChartRef = ref<HTMLElement | null>(null);

@@ -570,7 +570,8 @@

onMounted(() => {
   nextTick(() => {
      // initMapChart();
      initVideo();
      initNewsList();
      initPipeOneChart();
      initPipeTwoChart();
      initComanyData();
@@ -579,6 +580,26 @@
      document.getElementById('app-page')?.addEventListener('scroll', handleScroll);
   });
});
// 初始化新闻列表数据
const initNewsList = () => {
    axios({
        url: "static/Data/newsData/list.json",
        method: "get"
    }).then(res => {
        const result = res.data
        const { StandardDynamicsList } = result

        newsList.value = StandardDynamicsList.map(item => {
            return {
                id: item.id,
                title: item.title,
                date: item.pubdate,
            }
        })
    }).catch(err => {

    })
}
const handleScroll = () => {
   const scrollTop = document.getElementById('app-page')?.scrollTop;
   const scrollHeight = document.getElementById('app-page')?.scrollHeight - document.getElementById('app-page')?.clientHeight;
@@ -594,6 +615,19 @@
const handleNewsClick = (item: any) => {
   router.push(`/news-detail/${item.id}`);
};
const initVideo = () => {
   let player = new Player({
      id: 'indexVideo',
      url: 'https://xpump.oss-cn-shanghai.aliyuncs.com/iee/xc.mp4',
      height: '100%',
      width: '100%',
      autoplay: true,
      autoplayMuted:true,
      poster: 'https://xpump.oss-cn-shanghai.aliyuncs.com/iee/iee_poster.png',
   });
   videoPlayer.value = player;

}
// 初始化厂商列表数据
const initComanyData = () => {
   axios({
@@ -1058,9 +1092,9 @@
      });
   }
};
const clickDeclare = ()=>{
const clickDeclare = () => {
   router.push({
      path:'/company-declare',
      path: '/company-declare',
   })
}
// 监听产品类型选择
@@ -1459,4 +1493,10 @@
      color: var(--theme-color);
   }
}

.text-ellipsis {
   overflow: hidden;
   text-overflow: ellipsis;
   white-space: nowrap;
}
</style>