@@ -21,3 +21,14 @@ export const memberList = (num = 1, size = 10) => { | |||||
url: `/aboutUs/memberList?pageNum=${num}&pageSize=${size}` | url: `/aboutUs/memberList?pageNum=${num}&pageSize=${size}` | ||||
}) | }) | ||||
} | } | ||||
/** | |||||
* 广告 | |||||
* @returns request | |||||
*/ | |||||
export const guanggao = (index) => { | |||||
return request({ | |||||
method: 'GET', | |||||
url: `/aigc/guanggao${index}` | |||||
}) | |||||
} |
@@ -8,10 +8,6 @@ | |||||
router | router | ||||
active-text-color="#00ebc3"> | active-text-color="#00ebc3"> | ||||
<el-menu-item v-for="item in layers" :key="item.path" :index="item.path">{{ item.name }}</el-menu-item> | <el-menu-item v-for="item in layers" :key="item.path" :index="item.path">{{ item.name }}</el-menu-item> | ||||
<!-- <el-menu-item index="2">汽车资讯</el-menu-item> | |||||
<el-menu-item index="3">元宇宙日爆</el-menu-item> | |||||
<el-menu-item index="4">AIGC</el-menu-item> | |||||
<el-menu-item index="5">关于我们</el-menu-item> --> | |||||
</el-menu> | </el-menu> | ||||
</template> | </template> | ||||
<script> | <script> | ||||
@@ -28,6 +24,9 @@ export default { | |||||
{ path: '/about', name: '关于我们' } | { path: '/about', name: '关于我们' } | ||||
] | ] | ||||
} | } | ||||
}, | |||||
mounted () { | |||||
this.activeIndex = this.$router.currentRoute.fullPath | |||||
} | } | ||||
} | } | ||||
</script> | </script> | ||||
@@ -10,7 +10,9 @@ | |||||
</div> | </div> | ||||
<img :src="aboutwe.img"> | <img :src="aboutwe.img"> | ||||
</div> | </div> | ||||
<div class="bottom"/> | |||||
<a :href="gg1.link" target="_blank"> | |||||
<div class="bottom" :style="{ backgroundImage: `url(${gg1.img})` }"/> | |||||
</a> | |||||
</div> | </div> | ||||
</div> | </div> | ||||
<div id="daliay"> | <div id="daliay"> | ||||
@@ -45,7 +47,7 @@ | |||||
</div> | </div> | ||||
</template> | </template> | ||||
<script> | <script> | ||||
import { aboutUs, memberList } from '@/api/about.js' | |||||
import { aboutUs, memberList, guanggao } from '@/api/about.js' | |||||
export default { | export default { | ||||
name: 'about', | name: 'about', | ||||
data () { | data () { | ||||
@@ -54,7 +56,8 @@ export default { | |||||
content: '', | content: '', | ||||
img: '' | img: '' | ||||
}, | }, | ||||
ldList: [] | |||||
ldList: [], | |||||
gg1: {} | |||||
} | } | ||||
}, | }, | ||||
components: { | components: { | ||||
@@ -62,6 +65,7 @@ export default { | |||||
mounted () { | mounted () { | ||||
this.getaboutUs() | this.getaboutUs() | ||||
this.getmemberList() | this.getmemberList() | ||||
this.getguanggao() | |||||
}, | }, | ||||
methods: { | methods: { | ||||
changenews (item) { | changenews (item) { | ||||
@@ -70,6 +74,15 @@ export default { | |||||
changedepth (item) { | changedepth (item) { | ||||
this.depthitem = item | this.depthitem = item | ||||
}, | }, | ||||
async getguanggao () { | |||||
const { data: { message: ggm1, data: gg1 } } = await guanggao(1) | |||||
if (ggm1 === 'success') { | |||||
this.gg1 = { | |||||
img: gg1.image, | |||||
link: gg1.link | |||||
} | |||||
} | |||||
}, | |||||
async getaboutUs () { | async getaboutUs () { | ||||
const { data: { message, data } } = await aboutUs() | const { data: { message, data } } = await aboutUs() | ||||
if (message === 'success') { | if (message === 'success') { | ||||
@@ -41,7 +41,7 @@ | |||||
<div class="aitxt"> | <div class="aitxt"> | ||||
<a class="title">{{ aitxt.title }}</a> | <a class="title">{{ aitxt.title }}</a> | ||||
<a class="content">{{ aitxt.content }}</a> | <a class="content">{{ aitxt.content }}</a> | ||||
<a :href="aitxt.link" targrt="_blank"> | |||||
<a :href="aitxt.link" targrt="_blank" class="atarget"> | |||||
<el-button round>制作数字人</el-button> | <el-button round>制作数字人</el-button> | ||||
</a> | </a> | ||||
</div> | </div> | ||||
@@ -49,8 +49,10 @@ | |||||
</div> | </div> | ||||
</div> | </div> | ||||
<div class="gg"> | <div class="gg"> | ||||
<img :src="gg1" alt=""> | |||||
</div> | |||||
<a :href="gg1.link" target="_blank"> | |||||
<img :src="gg1.img" alt=""> | |||||
</a> | |||||
</div> | |||||
<div id="daliay"> | <div id="daliay"> | ||||
<div class="content"> | <div class="content"> | ||||
<div class="top"> | <div class="top"> | ||||
@@ -83,7 +85,9 @@ | |||||
</div> | </div> | ||||
</div> | </div> | ||||
<div class="gg gg2"> | <div class="gg gg2"> | ||||
<img :src="gg2" alt=""> | |||||
<a :href="gg2.link" target="_blank"> | |||||
<img :src="gg2.img" alt=""> | |||||
</a> | |||||
</div> | </div> | ||||
</div> | </div> | ||||
</div> | </div> | ||||
@@ -118,8 +122,8 @@ export default { | |||||
ailist: [], | ailist: [], | ||||
aitxt: {}, | aitxt: {}, | ||||
aigczb: [], | aigczb: [], | ||||
gg1: '', | |||||
gg2: '' | |||||
gg1: {}, | |||||
gg2: {} | |||||
} | } | ||||
}, | }, | ||||
components: { | components: { | ||||
@@ -150,10 +154,15 @@ export default { | |||||
async getguanggao () { | async getguanggao () { | ||||
const { data: { message: ggm1, data: gg1 } } = await guanggao(1) | const { data: { message: ggm1, data: gg1 } } = await guanggao(1) | ||||
const { data: { message: ggm2, data: gg2 } } = await guanggao(2) | const { data: { message: ggm2, data: gg2 } } = await guanggao(2) | ||||
if (ggm1 === 'success' && ggm2 === 'success') { | if (ggm1 === 'success' && ggm2 === 'success') { | ||||
this.gg1 = gg1.image | |||||
this.gg2 = gg2.image | |||||
this.gg1 = { | |||||
img: gg1.image, | |||||
link: gg1.link | |||||
} | |||||
this.gg2 = { | |||||
img: gg2.image, | |||||
link: gg2.link | |||||
} | |||||
} | } | ||||
}, | }, | ||||
async getshuzirenremark () { | async getshuzirenremark () { | ||||
@@ -237,7 +246,7 @@ export default { | |||||
var el = contentBox.firstElementChild // 获取处于前面的图片 | var el = contentBox.firstElementChild // 获取处于前面的图片 | ||||
contentBox.appendChild(el) // appendChild()具备剪切功能,无需手动删除旧节点 | contentBox.appendChild(el) // appendChild()具备剪切功能,无需手动删除旧节点 | ||||
} | } | ||||
}, 1000) | |||||
}, 2000) | |||||
} | } | ||||
} | } | ||||
} | } | ||||
@@ -440,6 +449,11 @@ export default { | |||||
position: absolute; | position: absolute; | ||||
bottom: 46px; | bottom: 46px; | ||||
} | } | ||||
.atarget { | |||||
width: 100%; | |||||
display: flex; | |||||
justify-content: center; | |||||
} | |||||
} | } | ||||
} | } | ||||
.bottom { | .bottom { | ||||
@@ -10,12 +10,7 @@ | |||||
</el-carousel> | </el-carousel> | ||||
<div id="hot"> | <div id="hot"> | ||||
<div class="content"> | <div class="content"> | ||||
<div class="list"> | |||||
<h2>强不强?吉利银河E8全景智慧座舱揭秘</h2> | |||||
<div class="date">发布日期:2023/01/02</div> | |||||
<p>同样引人注目。近日,2024款福特电马激情上市,共推出5款车型,官方指导价23.98万元-35.98万元得不提帝豪家族竞争力长</p> | |||||
<img src="/jl.png"> | |||||
<p>在这块大屏内部,吉利银河还专门针对不少App进行了适配,本次我们体验了狂野飙车、雷石KTV以及爱奇艺视频。前两者可以占据整个屏</p> | |||||
<div class="list" v-html="article"> | |||||
</div> | </div> | ||||
<div class="right"> | <div class="right"> | ||||
<div class="rtop"> | <div class="rtop"> | ||||
@@ -97,10 +92,14 @@ export default { | |||||
img: '/car.png', | img: '/car.png', | ||||
txt: '银河E8全景智慧座舱揭秘银河E8' | txt: '银河E8全景智慧座舱揭秘银河E8' | ||||
} | } | ||||
] | |||||
], | |||||
article: '' | |||||
} | } | ||||
}, | }, | ||||
components: { | components: { | ||||
}, | |||||
mounted () { | |||||
this.article = localStorage.getItem('article') | |||||
} | } | ||||
} | } | ||||
</script> | </script> | ||||
@@ -36,8 +36,10 @@ | |||||
</template> | </template> | ||||
</el-carousel> | </el-carousel> | ||||
</div> | </div> | ||||
<div class="bottom" :style="{ backgroundImage: `url(${gg1})` }"/> | |||||
</div> | |||||
<a :href="gg1.link" target="_blank"> | |||||
<div class="bottom" :style="{ backgroundImage: `url(${gg1.img})` }"/> | |||||
</a> | |||||
</div> | |||||
</div> | </div> | ||||
<div id="daliay"> | <div id="daliay"> | ||||
<div class="content"> | <div class="content"> | ||||
@@ -64,7 +66,9 @@ | |||||
</template> | </template> | ||||
</el-carousel> | </el-carousel> | ||||
</div> | </div> | ||||
<div class="bottom" :style="{ backgroundImage: `url(${gg2})` }"/> | |||||
<a :href="gg2.link" target="_blank"> | |||||
<div class="bottom" :style="{ backgroundImage: `url(${gg2.img})` }"/> | |||||
</a> | |||||
</div> | </div> | ||||
</div> | </div> | ||||
<div id="wk"> | <div id="wk"> | ||||
@@ -86,8 +90,8 @@ export default { | |||||
left: [], | left: [], | ||||
right: [] | right: [] | ||||
}, | }, | ||||
gg1: '', | |||||
gg2: '', | |||||
gg1: {}, | |||||
gg2: {}, | |||||
alink: '', | alink: '', | ||||
daliay: { | daliay: { | ||||
left: [], | left: [], | ||||
@@ -140,10 +144,15 @@ export default { | |||||
async getguanggao () { | async getguanggao () { | ||||
const { data: { message: ggm1, data: gg1 } } = await guanggao(1) | const { data: { message: ggm1, data: gg1 } } = await guanggao(1) | ||||
const { data: { message: ggm2, data: gg2 } } = await guanggao(2) | const { data: { message: ggm2, data: gg2 } } = await guanggao(2) | ||||
if (ggm1 === 'success' && ggm2 === 'success') { | if (ggm1 === 'success' && ggm2 === 'success') { | ||||
this.gg1 = gg1.image | |||||
this.gg2 = gg2.image | |||||
this.gg1 = { | |||||
img: gg1.image, | |||||
link: gg1.link | |||||
} | |||||
this.gg2 = { | |||||
img: gg2.image, | |||||
link: gg2.link | |||||
} | |||||
} | } | ||||
}, | }, | ||||
async getLink () { | async getLink () { | ||||
@@ -11,24 +11,26 @@ | |||||
<div id="hot"> | <div id="hot"> | ||||
<div class="content"> | <div class="content"> | ||||
<div class="top" v-if="display"> | <div class="top" v-if="display"> | ||||
<div id="imgtxt"> | |||||
<div id="imgtxt" @click="routerToarticleDetails(hotnews.detail)"> | |||||
<img :src="hotnews.img"> | <img :src="hotnews.img"> | ||||
<a class="newsTitle">{{ hotnews.title }}</a> | <a class="newsTitle">{{ hotnews.title }}</a> | ||||
</div> | </div> | ||||
<div id="hottxt"> | <div id="hottxt"> | ||||
<div id="htitle"> | <div id="htitle"> | ||||
<a class="tle">热点新闻</a> | <a class="tle">热点新闻</a> | ||||
<el-button type="text">MORE+</el-button> | |||||
<el-button type="text" @click="routerTo">MORE+</el-button> | |||||
</div> | </div> | ||||
<div id="hotList"> | <div id="hotList"> | ||||
<div class="list" v-for="(item, index) in hotnewsList" :key="index"> | |||||
<div class="list" v-for="(item, index) in hotnewsList" :key="index" @click="routerToarticleDetails(item.detail)"> | |||||
<img :src="item.img"> | <img :src="item.img"> | ||||
<a>{{ item.title }}</a> | <a>{{ item.title }}</a> | ||||
</div> | </div> | ||||
</div> | </div> | ||||
</div> | </div> | ||||
</div> | </div> | ||||
<div class="bottom" :style="{ backgroundImage: `url(${gg1})` }"/> | |||||
<a :href="gg1.link" target="_blank"> | |||||
<div class="bottom" :style="{ backgroundImage: `url(${gg1.img})` }"/> | |||||
</a> | |||||
</div> | </div> | ||||
</div> | </div> | ||||
<div id="daliay"> | <div id="daliay"> | ||||
@@ -41,17 +43,19 @@ | |||||
</el-carousel-item> | </el-carousel-item> | ||||
</el-carousel> | </el-carousel> | ||||
</div> | </div> | ||||
<div class="bottom" :style="{ backgroundImage: `url(${gg2})` }"/> | |||||
<a :href="gg2.link" target="_blank"> | |||||
<div class="bottom" :style="{ backgroundImage: `url(${gg2.img})` }"/> | |||||
</a> | |||||
</div> | </div> | ||||
</div> | </div> | ||||
<div id="wk"> | <div id="wk"> | ||||
<div class="content"> | <div class="content"> | ||||
<div class="htitle"> | <div class="htitle"> | ||||
<a class="tle">热点新闻</a> | <a class="tle">热点新闻</a> | ||||
<el-button type="text">MORE+</el-button> | |||||
<el-button type="text" @click="routerTo">MORE+</el-button> | |||||
</div> | </div> | ||||
<div id="hotList"> | <div id="hotList"> | ||||
<div class="list" v-for="(item, index) in carList" :key="index"> | |||||
<div class="list" v-for="(item, index) in carList" :key="index" @click="routerToarticleDetails(item.detail)"> | |||||
<img :src="item.img"> | <img :src="item.img"> | ||||
<div class="txt"> | <div class="txt"> | ||||
<a class="title">{{ item.title }}</a> | <a class="title">{{ item.title }}</a> | ||||
@@ -77,77 +81,12 @@ export default { | |||||
title: '这两款产品也将采用“CHN”的模式进行研发', | title: '这两款产品也将采用“CHN”的模式进行研发', | ||||
img: '/hotnew.png' | img: '/hotnew.png' | ||||
}, | }, | ||||
hotnewsList: [ | |||||
// { | |||||
// title: '广汽本田插混旗舰双子', | |||||
// img: '/listnews.png' | |||||
// }, | |||||
// { | |||||
// title: '强不强?吉利银河E8全景', | |||||
// img: '/listnews.png' | |||||
// }, | |||||
// { | |||||
// title: '智己汽车正式获准L3级', | |||||
// img: '/listnews.png' | |||||
// }, | |||||
// { | |||||
// title: '广汽本田插混旗舰双子', | |||||
// img: '/listnews.png' | |||||
// }, | |||||
// { | |||||
// title: '强不强?吉利银河E8全景', | |||||
// img: '/listnews.png' | |||||
// }, | |||||
// { | |||||
// title: '智己汽车正式获准L3级', | |||||
// img: '/listnews.png' | |||||
// } | |||||
], | |||||
carvideoList: [ | |||||
// { | |||||
// title: '斯巴鲁全新电动车SOLTERRA定名“岚鲲”', | |||||
// img: '/carvideo.png' | |||||
// }, | |||||
// { | |||||
// title: '斯巴鲁全新电动车SOLTERRA定名“岚鲲”', | |||||
// img: '/carvideo.png' | |||||
// }, | |||||
// { | |||||
// title: '斯巴鲁全新电动车SOLTERRA定名“岚鲲”', | |||||
// img: '/carvideo.png' | |||||
// } | |||||
], | |||||
carList: [ | |||||
// { | |||||
// img: '/cattxt.png', | |||||
// title: '广汽本田插混旗舰双子', | |||||
// subtitle: '阿维塔科技计划三年推出四款新车,明年则将陆续推出第三款和第四款车型。目前,有2款新车在研发中,代号分别是“15”、“16”,这' | |||||
// }, { | |||||
// img: '/cattxt.png', | |||||
// title: '首款高端纯电MPV翼真Xspace', | |||||
// subtitle: '阿维塔科技计划三年推出四款新车,明年则将陆续推出第三款和第四款车型。目前,有2款新车在研发中,代号分别是“15”、“16”,这' | |||||
// }, { | |||||
// img: '/cattxt.png', | |||||
// title: '广汽本田插混旗舰双子', | |||||
// subtitle: '阿维塔科技计划三年推出四款新车,明年则将陆续推出第三款和第四款车型。目前,有2款新车在研发中,代号分别是“15”、“16”,这' | |||||
// }, { | |||||
// img: '/cattxt.png', | |||||
// title: '首款高端纯电MPV翼真Xspace', | |||||
// subtitle: '阿维塔科技计划三年推出四款新车,明年则将陆续推出第三款和第四款车型。目前,有2款新车在研发中,代号分别是“15”、“16”,这' | |||||
// }, { | |||||
// img: '/cattxt.png', | |||||
// title: '广汽本田插混旗舰双子', | |||||
// subtitle: '阿维塔科技计划三年推出四款新车,明年则将陆续推出第三款和第四款车型。目前,有2款新车在研发中,代号分别是“15”、“16”,这' | |||||
// }, { | |||||
// img: '/cattxt.png', | |||||
// title: '首款高端纯电MPV翼真Xspace', | |||||
// subtitle: '阿维塔科技计划三年推出四款新车,明年则将陆续推出第三款和第四款车型。目前,有2款新车在研发中,代号分别是“15”、“16”,这' | |||||
// } | |||||
], | |||||
hotnewsList: [], | |||||
carvideoList: [], | |||||
carList: [], | |||||
display: 1, | display: 1, | ||||
gg1: '', | |||||
gg2: '' | |||||
gg1: {}, | |||||
gg2: {} | |||||
} | } | ||||
}, | }, | ||||
components: { | components: { | ||||
@@ -160,6 +99,13 @@ export default { | |||||
this.getvideoList() | this.getvideoList() | ||||
}, | }, | ||||
methods: { | methods: { | ||||
routerToarticleDetails (value) { | |||||
localStorage.setItem('article', value) | |||||
this.$router.push({ path: '/articleDetails' }) | |||||
}, | |||||
routerTo () { | |||||
this.$router.push({ path: '/articleList' }) | |||||
}, | |||||
async getlunboList () { | async getlunboList () { | ||||
const { data: { message, data } } = await lunboList() | const { data: { message, data } } = await lunboList() | ||||
if (message === 'success') { | if (message === 'success') { | ||||
@@ -182,10 +128,15 @@ export default { | |||||
async getguanggao () { | async getguanggao () { | ||||
const { data: { message: ggm1, data: gg1 } } = await guanggao(1) | const { data: { message: ggm1, data: gg1 } } = await guanggao(1) | ||||
const { data: { message: ggm2, data: gg2 } } = await guanggao(2) | const { data: { message: ggm2, data: gg2 } } = await guanggao(2) | ||||
if (ggm1 === 'success' && ggm2 === 'success') { | if (ggm1 === 'success' && ggm2 === 'success') { | ||||
this.gg1 = gg1.image | |||||
this.gg2 = gg2.image | |||||
this.gg1 = { | |||||
img: gg1.image, | |||||
link: gg1.link | |||||
} | |||||
this.gg2 = { | |||||
img: gg2.image, | |||||
link: gg2.link | |||||
} | |||||
} | } | ||||
}, | }, | ||||
async gethotlist () { | async gethotlist () { | ||||
@@ -193,15 +144,19 @@ export default { | |||||
if (message === 'success') { | if (message === 'success') { | ||||
this.hotnews.title = data.list[0].title | this.hotnews.title = data.list[0].title | ||||
this.hotnews.img = data.list[0].image | this.hotnews.img = data.list[0].image | ||||
for (let index = 0; index < 6; index++) { | |||||
this.hotnews.detail = data.list[0].detail | |||||
for (let index = 1; index < data.list.length; index++) { | |||||
this.hotnewsList.push({ | this.hotnewsList.push({ | ||||
title: data.list[0].title, | |||||
img: data.list[0].image | |||||
title: data.list[index].title, | |||||
img: data.list[index].image, | |||||
subtitle: data.list[index].subTitle, | |||||
detail: data.list[index].detail | |||||
}) | }) | ||||
this.carList.push({ | this.carList.push({ | ||||
title: data.list[0].title, | |||||
img: data.list[0].image, | |||||
subtitle: data.list[0].subTitle | |||||
title: data.list[index].title, | |||||
img: data.list[index].image, | |||||
subtitle: data.list[index].subTitle, | |||||
detail: data.list[index].detail | |||||
}) | }) | ||||
} | } | ||||
} | } | ||||
@@ -332,6 +287,8 @@ export default { | |||||
font-weight: bold; | font-weight: bold; | ||||
color: #07CAAF; | color: #07CAAF; | ||||
line-height: 48px; | line-height: 48px; | ||||
cursor: pointer; | |||||
z-index: 9999; | |||||
} | } | ||||
} | } | ||||
} | } | ||||
@@ -342,6 +299,7 @@ export default { | |||||
justify-content: space-between; | justify-content: space-between; | ||||
align-items: center; | align-items: center; | ||||
.list { | .list { | ||||
z-index: 999; | |||||
display: flex; | display: flex; | ||||
flex-direction: column; | flex-direction: column; | ||||
align-items: center; | align-items: center; | ||||
@@ -494,6 +452,7 @@ export default { | |||||
font-weight: bold; | font-weight: bold; | ||||
color: #07CAAF; | color: #07CAAF; | ||||
line-height: 48px; | line-height: 48px; | ||||
z-index: 999; | |||||
} | } | ||||
} | } | ||||
#hotList { | #hotList { | ||||
@@ -501,6 +460,7 @@ export default { | |||||
flex-wrap: wrap; | flex-wrap: wrap; | ||||
align-items: center; | align-items: center; | ||||
.list { | .list { | ||||
z-index: 999; | |||||
display: flex; | display: flex; | ||||
justify-content: center; | justify-content: center; | ||||
width: 500px; | width: 500px; | ||||
@@ -11,17 +11,17 @@ | |||||
<div id="hot"> | <div id="hot"> | ||||
<div class="content"> | <div class="content"> | ||||
<div class="top" v-if="display"> | <div class="top" v-if="display"> | ||||
<div id="imgtxt"> | |||||
<div id="imgtxt" @click="routerToarticleDetails(hotnews.detail)"> | |||||
<img :src="hotnews.img"> | <img :src="hotnews.img"> | ||||
<a class="newsTitle">{{ hotnews.title }}</a> | <a class="newsTitle">{{ hotnews.title }}</a> | ||||
</div> | </div> | ||||
<div id="hottxt"> | <div id="hottxt"> | ||||
<div id="htitle"> | <div id="htitle"> | ||||
<a class="tle">热点新闻</a> | <a class="tle">热点新闻</a> | ||||
<el-button type="text">MORE+</el-button> | |||||
<el-button type="text" @click="routerTo">MORE+</el-button> | |||||
</div> | </div> | ||||
<div id="hotList"> | <div id="hotList"> | ||||
<div class="list" v-for="(item, index) in hotnewsList" :key="index"> | |||||
<div class="list" v-for="(item, index) in hotnewsList" :key="index" @click="routerToarticleDetails(item.detail)"> | |||||
<img :src="item.img"> | <img :src="item.img"> | ||||
<a>{{ item.title }}</a> | <a>{{ item.title }}</a> | ||||
</div> | </div> | ||||
@@ -31,7 +31,9 @@ | |||||
</div> | </div> | ||||
</div> | </div> | ||||
<div class="gg"> | <div class="gg"> | ||||
<img :src="gg1" alt=""> | |||||
<a :href="gg1.link" target="_blank"> | |||||
<img :src="gg1.img" alt=""> | |||||
</a> | |||||
</div> | </div> | ||||
<div id="daliay"> | <div id="daliay"> | ||||
<div class="content"> | <div class="content"> | ||||
@@ -42,10 +44,10 @@ | |||||
<div class="item"> | <div class="item"> | ||||
<a v-for="item in information" :key="item" @click="changenews(item)" :class="{ clk: informationitem === item }">{{ item }}</a> | <a v-for="item in information" :key="item" @click="changenews(item)" :class="{ clk: informationitem === item }">{{ item }}</a> | ||||
</div> | </div> | ||||
<el-button type="text">MORE+</el-button> | |||||
<el-button type="text" @click="routerTo">MORE+</el-button> | |||||
</div> | </div> | ||||
<div id="hotList"> | <div id="hotList"> | ||||
<div class="list" v-for="(item, index) in zixun" :key="index"> | |||||
<div class="list" v-for="(item, index) in zixun" :key="index" @click="routerToarticleDetails(item.detail)"> | |||||
<img :src="item.img"> | <img :src="item.img"> | ||||
<div class="txt"> | <div class="txt"> | ||||
<a class="title">{{ item.title }}</a> | <a class="title">{{ item.title }}</a> | ||||
@@ -56,7 +58,9 @@ | |||||
</div> | </div> | ||||
</div> | </div> | ||||
<div class="gg"> | <div class="gg"> | ||||
<img :src="gg2" alt=""> | |||||
<a :href="gg2.link" target="_blank"> | |||||
<img :src="gg2.img" alt=""> | |||||
</a> | |||||
</div> | </div> | ||||
<div id="wk"> | <div id="wk"> | ||||
<div class="content"> | <div class="content"> | ||||
@@ -65,20 +69,18 @@ | |||||
<div class="item"> | <div class="item"> | ||||
<a v-for="item in depth" :key="item" @click="changedepth(item)" :class="{ clk: depthitem === item }">{{ item }}</a> | <a v-for="item in depth" :key="item" @click="changedepth(item)" :class="{ clk: depthitem === item }">{{ item }}</a> | ||||
</div> | </div> | ||||
<el-button type="text">MORE+</el-button> | |||||
<el-button type="text" @click="routerTo">MORE+</el-button> | |||||
</div> | </div> | ||||
<div id="hotList"> | <div id="hotList"> | ||||
<div class="list" v-for="(item, index) in shendu" :key="index"> | |||||
<div class="list" v-for="(item, index) in shendu" :key="index" @click="routerToarticleDetails(item.detail)"> | |||||
<img :src="item.img"> | <img :src="item.img"> | ||||
<div class="txt"> | <div class="txt"> | ||||
<a class="title">{{ item.title }}</a> | <a class="title">{{ item.title }}</a> | ||||
<a class="subtitle">{{ item.subtitle }}</a> | <a class="subtitle">{{ item.subtitle }}</a> | ||||
</div> | </div> | ||||
<!-- <a>{{ item.title }}</a> --> | |||||
</div> | </div> | ||||
</div> | </div> | ||||
</div> | </div> | ||||
<!-- <el-button type="primary" class="wkbtn" size="medium">点击进入</el-button> --> | |||||
</div> | </div> | ||||
</div> | </div> | ||||
</template> | </template> | ||||
@@ -93,35 +95,13 @@ export default { | |||||
informationitem: 'XR', | informationitem: 'XR', | ||||
depth: ['XR', 'Web3', 'Ai'], | depth: ['XR', 'Web3', 'Ai'], | ||||
depthitem: 'XR', | depthitem: 'XR', | ||||
carouselList: [ | |||||
// { src: '/car1.png', title: '吉利11月销量再刷新纪录,新能源转型成效凸显', subtitle: '国际汽车企业如果现在一旦脱离了中国市场,再想回来就不可能了。必须了解这个发展的趋势,只有参与才有机会。' }, | |||||
// { src: '/car2.png', title: '吉利11月销量再刷新纪录,新能源转型成效凸显', subtitle: '国际汽车企业如果现在一旦脱离了中国市场,再想回来就不可能了。必须了解这个发展的趋势,只有参与才有机会。' } | |||||
], | |||||
carouselList: [], | |||||
hotnews: {}, | hotnews: {}, | ||||
hotnewsList: [], | hotnewsList: [], | ||||
// carList: [ | |||||
// { | |||||
// img: '/cattxt.png', | |||||
// title: '广汽本田插混旗舰双子', | |||||
// subtitle: '阿维塔科技计划三年推出四款新车,明年则将陆续推出第三款和第四款车型。目前,有2款新车在研发中,代号分别是“15”、“16”,这' | |||||
// }, { | |||||
// img: '/cattxt.png', | |||||
// title: '首款高端纯电MPV翼真Xspace', | |||||
// subtitle: '阿维塔科技计划三年推出四款新车,明年则将陆续推出第三款和第四款车型。目前,有2款新车在研发中,代号分别是“15”、“16”,这' | |||||
// }, { | |||||
// img: '/cattxt.png', | |||||
// title: '广汽本田插混旗舰双子', | |||||
// subtitle: '阿维塔科技计划三年推出四款新车,明年则将陆续推出第三款和第四款车型。目前,有2款新车在研发中,代号分别是“15”、“16”,这' | |||||
// }, { | |||||
// img: '/cattxt.png', | |||||
// title: '首款高端纯电MPV翼真Xspace', | |||||
// subtitle: '阿维塔科技计划三年推出四款新车,明年则将陆续推出第三款和第四款车型。目前,有2款新车在研发中,代号分别是“15”、“16”,这' | |||||
// } | |||||
// ], | |||||
shendu: [], | shendu: [], | ||||
zixun: [], | zixun: [], | ||||
gg1: '', | |||||
gg2: '', | |||||
gg1: {}, | |||||
gg2: {}, | |||||
display: 1 | display: 1 | ||||
} | } | ||||
}, | }, | ||||
@@ -136,6 +116,13 @@ export default { | |||||
this.getzixun() | this.getzixun() | ||||
}, | }, | ||||
methods: { | methods: { | ||||
routerToarticleDetails (value) { | |||||
localStorage.setItem('article', value) | |||||
this.$router.push({ path: '/articleDetails' }) | |||||
}, | |||||
routerTo () { | |||||
this.$router.push({ path: '/articleList' }) | |||||
}, | |||||
changenews (item) { | changenews (item) { | ||||
this.informationitem = item | this.informationitem = item | ||||
this.getzixun() | this.getzixun() | ||||
@@ -149,8 +136,14 @@ export default { | |||||
const { data: { message: ggm2, data: gg2 } } = await guanggao(2) | const { data: { message: ggm2, data: gg2 } } = await guanggao(2) | ||||
if (ggm1 === 'success' && ggm2 === 'success') { | if (ggm1 === 'success' && ggm2 === 'success') { | ||||
this.gg1 = gg1.image | |||||
this.gg2 = gg2.image | |||||
this.gg1 = { | |||||
img: gg1.image, | |||||
link: gg1.link | |||||
} | |||||
this.gg2 = { | |||||
img: gg2.image, | |||||
link: gg2.link | |||||
} | |||||
} | } | ||||
}, | }, | ||||
async getlunboList () { | async getlunboList () { | ||||
@@ -178,12 +171,15 @@ export default { | |||||
if (message === 'success') { | if (message === 'success') { | ||||
this.hotnews = { | this.hotnews = { | ||||
title: data.list[0].title, | title: data.list[0].title, | ||||
img: data.list[0].image | |||||
img: data.list[0].image, | |||||
detail: data.list[0].detail | |||||
} | } | ||||
for (let index = 1; index < data.list.length; index++) { | for (let index = 1; index < data.list.length; index++) { | ||||
console.log(data.list[index]) | |||||
this.hotnewsList.push({ | this.hotnewsList.push({ | ||||
title: data.list[index].title, | title: data.list[index].title, | ||||
img: data.list[index].image | |||||
img: data.list[index].image, | |||||
detail: data.list[index].detail | |||||
}) | }) | ||||
} | } | ||||
} | } | ||||
@@ -196,7 +192,8 @@ export default { | |||||
this.shendu.push({ | this.shendu.push({ | ||||
title: iter.title, | title: iter.title, | ||||
img: iter.image, | img: iter.image, | ||||
subtitle: iter.subTitle | |||||
subtitle: iter.subTitle, | |||||
detail: iter.detail | |||||
}) | }) | ||||
} | } | ||||
} | } | ||||
@@ -209,7 +206,8 @@ export default { | |||||
this.zixun.push({ | this.zixun.push({ | ||||
title: iter.title, | title: iter.title, | ||||
img: iter.image, | img: iter.image, | ||||
subtitle: iter.subTitle | |||||
subtitle: iter.subTitle, | |||||
detail: iter.detail | |||||
}) | }) | ||||
} | } | ||||
} | } | ||||
@@ -336,6 +334,7 @@ export default { | |||||
font-weight: bold; | font-weight: bold; | ||||
color: #07CAAF; | color: #07CAAF; | ||||
line-height: 48px; | line-height: 48px; | ||||
z-index: 999; | |||||
} | } | ||||
} | } | ||||
} | } | ||||
@@ -351,6 +350,7 @@ export default { | |||||
flex-direction: column; | flex-direction: column; | ||||
justify-content: center; | justify-content: center; | ||||
margin-right: 39px; | margin-right: 39px; | ||||
z-index: 999; | |||||
img { | img { | ||||
width: 150px; | width: 150px; | ||||
height: 112px; | height: 112px; | ||||
@@ -481,6 +481,7 @@ export default { | |||||
font-weight: bold; | font-weight: bold; | ||||
color: #07CAAF; | color: #07CAAF; | ||||
line-height: 48px; | line-height: 48px; | ||||
z-index: 999; | |||||
} | } | ||||
} | } | ||||
#hotList { | #hotList { | ||||
@@ -493,6 +494,7 @@ export default { | |||||
.list { | .list { | ||||
display: flex; | display: flex; | ||||
//width: 50%; | //width: 50%; | ||||
z-index: 999; | |||||
flex-direction: row !important; | flex-direction: row !important; | ||||
//align-items: center; | //align-items: center; | ||||
justify-content: center; | justify-content: center; | ||||