root/feiyang-web
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

首页新闻资讯

Browse Source
This commit is contained in:
dzj 2024-07-27 00:23:18 +08:00
parent 59a3f6943f
commit a47b1c5ee1
2 changed files with 100 additions and 68 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

24
src/api/index.js
View File

@ -9,7 +9,7 @@ export function getproject(params){
//获取新闻内容
export function getnews(params){
return request({
url:'article/list',
url:'article/enterpriseNewsList',
params
})
}
@ -103,14 +103,14 @@ export function compony(){
//新闻资讯
export function getmsg(params){
return request({
url:'/articleMsg/list',
url:'/article/newsInformationList',
params
})
}
//新闻详情
export function msgdetail(params){
return request({
url:'/articleMsg/articleDetails',
url:'/article/articleDetails',
params
})
}
@ -131,4 +131,22 @@ export function componyhonor(){
return request({
url:'/honorTitle/list '
})
}
//首页企业新闻
export function indexNews(){
return request({
url:'/article/enterpriseNews'
})
}
//首页企业新闻
export function indexInformation(){
return request({
url:'/article/newsInformation'
})
}
//首页新闻分类
export function NewCategary(){
return request({
url:'/articleType/list'
})
}

144
src/views/HomeView.vue
View File

@ -23,34 +23,19 @@
<div class="index_1" style="width: 80%;margin: 0 auto;padding: 85px 0;">
<div class="content-top">
<div class="content-left">
<h3>企业新闻</h3>
<h6>CORPORATE NEWS</h6>
<!-- <div class="shares" style="">
<h3 style="font-size: 14px;
display: inline-block;
color: #42424e;
color: rgba(66, 66, 78, .6);
padding-top: 4px;"><em style="display: block;">SH 600048</em>
保利发展控股股票代码</h3>
<h5 class="red green"><em style="display: block;">8.03</em>RMB</h5>
</div> -->
<!-- 暂定动态 -->
<h3>{{newscatagary[0]?.name}}</h3>
<h6>{{newscatagary[0]?.enName}}</h6>
<div style="width: 50%;"></div>
</div>
<div class="content-right">
<div class="index-top" @click="changeto(newsitem.id)" style="cursor: pointer;">
<div class="index-top" @click="changeto(indexNew[0]?.id)" style="cursor: pointer;">
<h3 style=" font-size: 24px;
color: #3c3c48;
color: rgba(60, 60, 72, .8);
line-height: 30px;">{{ newsitem?.name||'' }}</h3>
<!-- <h5 style=" width: auto;
float: none;
font-size: 30px;
color: #c0a988;
margin: 3px 0 6px; line-height: 1;
font-weight: bold;
letter-spacing: -.2px;font-family: 'Rajdhani';">{{ newsitem.releaseTime }}</h5> -->
line-height: 30px;">{{indexNew[0]?.subTitle||'' }}</h3>
<div style=" color: rgba(115, 115, 124, .6); font-size: 13px;
color: #95959d;
line-height: 24px;
@ -58,7 +43,7 @@
display: -webkit-box;
overflow: hidden;
-webkit-box-orient: vertical;
text-align: justify;" v-html=" newsitem?.content||''">
text-align: justify;" v-html=" indexNew[0]?.subContent||''">
</div>
</div>
@ -83,48 +68,32 @@
</div>
</div>
<div class="index_2" style="padding-bottom: 135px;width: 80%;margin: 0 auto;">
<div style="display: flex;">
<div class="content2-left flow" style="position: relative;">
<div>
<h3>行业动态</h3>
<h6>INDUSTRY TRENDS</h6>
</div>
<div class="textbox" >
{{ hydata[textindex]?.name||'' }}
</div>
<div style="line-height: 26px;width: 80%;-webkit-line-clamp: 6;
display: -webkit-box;
overflow: hidden;
-webkit-box-orient: vertical;" class="textbox" v-html="hydata[textindex]?.content">
</div>
<!-- <div style="color: skyblue;font-size: 50px;position: absolute;bottom: 0;">
<span style="margin-right: 20px;cursor: pointer;" @click="back"><</span>
<span style="cursor: pointer;" @click="next">></span>
</div> -->
<div class="index_1" style="width: 80%;margin: 0 auto;padding: 85px 0;">
<div class="content-top">
<div class="content-left">
<h3>{{newscatagary[1]?.name}}</h3>
<h6>{{newscatagary[1]?.enName}}</h6>
<h3 style="font-size: 14.5px; color: #293d48;">{{ indexinfo[textindex]?.subTitle }}</h3>
<h5 style=" color: #8e8e95;margin-top: 18px;font-size: 100%;font-weight: normal;line-height: 22px;">{{ indexinfo[textindex]?.subContent }}</h5>
<div style="width: 50%;"></div>
</div>
<div class="content2-right" style="cursor: pointer;">
<div ref="swipe" class="swiper-container swiper7" style="height: 300px;">
<div class="content-right">
<div class="swiper-container swiper6">
<div class="swiper-wrapper" >
<div class="swiper-slide a" v-for="item in hydata"> <a :href="item.url" target="_blank">
<img :src="item.picture" style="width: 100%;object-fit: contain;">
</a>
</div>
<div class="swiper-slide yanshi" v-for="item in indexinfo" :key="item.id"><img :src="item.pic"
style="width: 851px;height:320px;cursor: pointer;" @click="routerTo(item.id)"></div>
</div>
<div class="swiper-pagination"></div>
<div class="swiper-button-prev" @click="back"></div><!--左箭头。如果放置在swiper外面，需要自定义样式。-->
<div class="swiper-button-next" @click="next"></div><!--右箭头。如果放置在swiper外面，需要自定义样式。-->
<div style="position: relative;">
</div>
</div>
</div>
</div>
</div>
</div>
<div class="index_3" :style=" {background: `url(${bgtextitem.url})`, norepeat: 'center'}">
<div style="position: relative;height: 100%;width: 80%;margin: 0 auto;">
@ -218,7 +187,7 @@
import Swiper from 'swiper'
import 'swiper/css/swiper.min.css'
import { achievementPic, hyDtai, swiperimg, getnews, backgroundText, smallPicture,honor,componyhonor } from '@/api'
import { achievementPic,NewCategary, hyDtai, swiperimg, backgroundText, smallPicture,honor,componyhonor,indexNews,indexInformation } from '@/api'
export default {
data() {
return {
@ -232,6 +201,9 @@ export default {
swipe:null,
textindex:0,
componydata:[],
newscatagary:[],
indexNew:[],
indexinfo:[]
}
},
@ -323,12 +295,12 @@ export default {
})
})
//新闻展示
getnews({ 'page': 0 }).then((res) => {
res.data.content[0].content= res.data.content[0].content.replace(/<[^>]+>/g, '').trim();
this.newsitem = res.data.content[0]
// getnews({ 'page': 0 }).then((res) => {
// res.data.content[0].content= res.data.content[0].content.replace(/<[^>]+>/g, '').trim();
// this.newsitem = res.data.content[0]
console.log(this.newsitem)
})
// console.log(this.newsitem)
// })
//图文展示
backgroundText().then((res) => {
this.bgtextitem = res.data[0]
@ -337,7 +309,33 @@ export default {
componyhonor().then((res)=>{
this.componydata=res.data
})
indexInformation().then((res)=>{
this.indexinfo=res.data
this.$nextTick(() => {
new Swiper('.swiper6', {
loop: true,
observer: true,
observeParents: true,
pagination: {
el: '.swiper-pagination',
},
navigation: {
nextEl: '.swiper-button-next',
prevEl: '.swiper-button-prev',
},
pagination: {
el: '.swiper-pagination2'
}
})
})
})
indexNews().then((res)=>{
this.indexNew=res.data
})
NewCategary().then((res)=>{
this.newscatagary=res.data
})
// 创建交叉观察器实例
// this.observer = new IntersectionObserver(entries => {
// entries.forEach(entry => {
@ -365,17 +363,17 @@ export default {
next(){
this.swipe.slideNext()
if(this.textindex<this.hydata.length-1){
this.textindex=this.textindex+1
}else{
this.textindex=0
}
},
back(){
this.swipe.slidePrev()
if(this.textindex>0){
this.textindex=this.textindex-1
}else{
@ -402,6 +400,19 @@ export default {
})
}
},
routerTo(id){
if (id) {
this.$router.push({
path: '/detail?type=1&id=' + id
})
} else {
console.log(id)
this.$router.push({
path: '/news'
})
}
},
honorto(id){
this.$router.push({
@ -642,4 +653,7 @@ h6 {
.a::after{
background-color: unset;
}
.yanshi::after{
width: 0px !important;
}
</style>