From 2d1e485d56fbc736b2156347a0e6d602cd048547 Mon Sep 17 00:00:00 2001
From: tanghaolin <1723298894@qq.com>
Date: 星期三, 23 四月 2025 17:42:58 +0800
Subject: [PATCH] 修改主页新闻列表
---
src/views/Home.vue | 62 +++++++++++++++++++++++++-----
1 files changed, 51 insertions(+), 11 deletions(-)
diff --git a/src/views/Home.vue b/src/views/Home.vue
index 5e5cab5..3bbb86d 100644
--- a/src/views/Home.vue
+++ b/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">宸ヤ笟杞欢锝滃伐涓欰PP<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>
--
Gitblit v1.9.3