Parcourir la source

fixbug

master
chutingting il y a 1 an
Parent
révision
7747e3a10e
6 fichiers modifiés avec 63 ajouts et 384 suppressions
  1. +33
    -9
      src/components/hotNews/index.vue
  2. +1
    -1
      src/components/swiperHor/index.vue
  3. +0
    -1
      src/views/about/index.vue
  4. +5
    -173
      src/views/home/index.vue
  5. +6
    -31
      src/views/information/index.vue
  6. +18
    -169
      src/views/metadaily/index.vue

+ 33
- 9
src/components/hotNews/index.vue Voir le fichier

@@ -1,17 +1,17 @@
<template>
<div class="hotnews" >
<div class="imgtxt" @click="routerToarticleDetails(hotnews.detail)">
<img :src="hotnews.img">
<a class="newsTitle">{{ hotnews.title }}</a>
<div class="imgtxt" @click="routerToarticleDetails(firstData.detail)">
<img :src="firstData.image">
<a class="newsTitle">{{ firstData.title }}</a>
</div>
<div class="hottxt">
<div id="htitle">
<div class="htitle">
<a class="tle">热点新闻</a>
<el-button type="text" @click="routerTo">MORE+</el-button>
</div>
<div class="hotList">
<div class="list" v-for="(item, index) in hotnewsList" :key="index" @click="routerToarticleDetails(item.detail)">
<img :src="item.img">
<div class="list" v-for="(item, index) in listData" :key="index" @click="routerToarticleDetails(item.detail)">
<img :src="item.image">
<a>{{ item.title }}</a>
</div>
</div>
@@ -19,12 +19,36 @@
</div>
</template>
<script>
/* eslint-disable */
export default {
props: {

list: Array,
},
watch: {
list: {
handler(newVal, oldVal) {
if (this.list.length) {
this.firstData = this.list[0]
this.listData = this.list.slice(1, this.list.length)
}
},
immediate: true
}
},
data() {
return {}
return {
firstData: {},
listData: []
}
},
methods: {
routerTo() {
this.$router.push({ path: '/articleList' })
},
routerToarticleDetails() {
localStorage.setItem('article', value)
this.$router.push({ path: '/articleDetails' })
}
}
}
</script>
@@ -66,7 +90,6 @@ export default {

.hottxt {
display: flex;
justify-content: space-around;
flex-direction: column;
align-items: center;
flex: 1;
@@ -76,6 +99,7 @@ export default {
justify-content: space-between;
align-items: center;
width: 95%;
margin-top: 15px;
.tle {
z-index: 9;
font-size: 26px;


+ 1
- 1
src/components/swiperHor/index.vue Voir le fichier

@@ -28,7 +28,7 @@
<!-- Add Pagination -->
<!-- <div class="swiper-paginationhor"></div> -->
</div>
<el-dialog :visible.sync="videoDialogVisible" width="400px" >
<el-dialog :visible.sync="videoDialogVisible" :lock-scroll="false" :append-to-body="true" width="400px" >
<VideoDialog :url="videoUrl"></VideoDialog>
</el-dialog>
</div>


+ 0
- 1
src/views/about/index.vue Voir le fichier

@@ -234,7 +234,6 @@ export default {
.content {
align-items: center;
}
padding-bottom: 80px;
.top {
min-height: 470px;
margin-bottom: 40px;


+ 5
- 173
src/views/home/index.vue Voir le fichier

@@ -25,24 +25,7 @@
</el-carousel-item>
</el-carousel>
</div>
<div class="hotnews" v-if="display">
<div id="imgtxt" @click="routerToarticleDetails(hotnews.detail)">
<img :src="hotnews.img">
<a class="newsTitle">{{ hotnews.title }}</a>
</div>
<div id="hottxt">
<div id="htitle">
<a class="tle">热点新闻</a>
<el-button type="text" @click="routerTo">MORE+</el-button>
</div>
<div id="hotList">
<div class="list" v-for="(item, index) in hotnewsList" :key="index" @click="routerToarticleDetails(item.detail)">
<img :src="item.img">
<a>{{ item.title }}</a>
</div>
</div>
</div>
</div>
<HotNews v-if="display" :list="hotnewsList"/>
<a :href="gg1.link" v-if="gg1.img" target="_blank">
<img class="bottom" :src="gg1.img" alt="">
</a>
@@ -84,7 +67,7 @@
</a>
</div>
<el-dialog title="" v-if="videoDialogVisible" :visible.sync="videoDialogVisible" width="50%">
<VideoDialog :url="videoUrl"></VideoDialog>
<VideoDialog :url="videoUrl" :lock-scroll="false" :append-to-body="true"></VideoDialog>
</el-dialog>
</div>
</template>
@@ -93,6 +76,7 @@
import { lunboList, carNewsHotList, guanggao, link, yuanyuzhouHotList, hotnewsConfig, hotnews } from '@/api/home.js'
import Swiper from '@/components/swiper'
import VideoDialog from '@/components/video'
import HotNews from '@/components/hotNews'
export default {
name: 'home',
@@ -114,7 +98,7 @@ export default {
hotnewsList: []
}
},
components: { Swiper, VideoDialog },
components: { Swiper, VideoDialog, HotNews },
mounted () {
this.gethotnewsConfig()
this.getlunboList()
@@ -190,17 +174,7 @@ export default {
const { data: { message, data } } = await hotnews()
console.log(data)
if (message === 'success') {
this.hotnews.title = data.list[0].title
this.hotnews.img = data.list[0].image
this.hotnews.detail = data.list[0].detail
for (let index = 1; index < data.list.length; index++) {
this.hotnewsList.push({
title: data.list[index].title,
img: data.list[index].image,
subtitle: data.list[index].subTitle,
detail: data.list[index].detail
})
}
this.hotnewsList = data.list
}
},
}
@@ -246,148 +220,6 @@ export default {
.top, .bottom {
width: 100%;
}
.hotnews {
min-height: 100px;
margin-top: 20px;
min-height: 470px;
background-color: #FFFFFF;
display: flex;
margin-bottom: 30px;
background-image: url('../../assets/hotTopLeft.png');
background-position: 101% 0; /* 调整这些值来改变显示的部分 */
background-size: 30% 50%; /* 使用 'cover' 或 'contain',或者设置具体尺寸 */
background-repeat: no-repeat;
#imgtxt {
width: 560px;
position: relative;
display: flex;
justify-content: center;
align-items: center;
margin-left: 20px;
img {
width: 560px;
}
.newsTitle{
position: absolute;
bottom: 5%;
left: 0;
display: inline-block;
font-size: 18px;
font-weight: bold;
color: #FFFFFF;
line-height: 48px;
width: 100%;
background-color: #0000007e;
}
}
#hottxt {
display: flex;
justify-content: space-around;
flex-direction: column;
align-items: center;
flex: 1;
margin-left: 35px;
#htitle {
display: flex;
justify-content: space-between;
align-items: center;
width: 95%;
.tle {
z-index: 9;
font-size: 26px;
font-weight: bold;
color: #00161C;
line-height: 48px;
display: inline-block;
position: relative;
text-decoration: none; /* 移除默认的下划线 */
}
.tle::after {
content: '';
position: absolute;
left: -15px;
bottom: 10px;
width: 65%;
height: 6px; /* 横线高度为文字高度的一半 */
background-color: #07CAAF;; /* 横线颜色与文字颜色相同 */
z-index: -1;
}
.el-button {
font-size: 16px;
font-weight: bold;
color: #07CAAF;
line-height: 48px;
cursor: pointer;
z-index: 9999;
}
}
}
#hotList {
height: 76%;
display: flex;
flex-wrap: wrap;
justify-content: space-between;
align-items: center;
.list {
z-index: 999;
display: flex;
flex-direction: column;
align-items: center;
justify-content: center;
width: 150px;
margin-right: 39px;
img {
width: 150px;
height: 112px;
border-radius: 10px;
}
a {
font-size: 14px;
font-weight: 400;
color: #010101;
margin-top: 14px;
white-space: nowrap;
overflow: hidden;
text-overflow: ellipsis;
width: 150px;
// line-height: 48px;
}
}
}
.top {
margin-bottom: 30px;
background-color: #FFFFFF;
display: flex;
background-image: url('../../assets/hotTopLeft.png');
background-position: 101% 0; /* 调整这些值来改变显示的部分 */
background-size: 30% 50%; /* 使用 'cover' 或 'contain',或者设置具体尺寸 */
background-repeat: no-repeat;
#imgtxt {
width: 560px;
position: relative;
display: flex;
justify-content: center;
align-items: center;
margin-left: 20px;
img {
width: 560px;
}
.newsTitle{
position: absolute;
bottom: 5%;
left: 0;
display: inline-block;
font-size: 18px;
font-weight: bold;
color: #FFFFFF;
line-height: 48px;
width: 100%;
background-color: #0000007e;
}
}
}
}
.top {
// min-height: 470px;
// background: black;


+ 6
- 31
src/views/information/index.vue Voir le fichier

@@ -3,24 +3,7 @@
<Swiper :banner-array="carouselList" />
<div id="hot">
<div class="content">
<div class="top" v-if="display">
<div id="imgtxt" @click="routerToarticleDetails(hotnews.detail)">
<img :src="hotnews.img">
<a class="newsTitle">{{ hotnews.title }}</a>
</div>
<div id="hottxt">
<div id="htitle">
<a class="tle">热点新闻</a>
<el-button type="text" @click="routerTo">MORE+</el-button>
</div>
<div id="hotList">
<div class="list" v-for="(item, index) in hotnewsList" :key="index" @click="routerToarticleDetails(item.detail)">
<img :src="item.img">
<a>{{ item.title }}</a>
</div>
</div>
</div>
</div>
<HotNews v-if="display" :list="hotnewsList"/>
<a :href="gg1.link" v-if="gg1.img" target="_blank">
<img class="bottom" :src="gg1.img" alt="">
</a>
@@ -63,7 +46,7 @@
</div>
</div>
<el-dialog title="" v-if="videoDialogVisible" :visible.sync="videoDialogVisible" width="50%">
<VideoDialog :url="videoUrl"></VideoDialog>
<VideoDialog :url="videoUrl" :lock-scroll="false" :append-to-body="true"></VideoDialog>
</el-dialog>
</div>
</template>
@@ -72,6 +55,7 @@
import Swiper from '@/components/swiper'
import { lunboList, hotNewsConfig, guanggao, hotlist, videoList, carArticle } from '@/api/car.js'
import VideoDialog from '@/components/video'
import HotNews from '@/components/hotNews'
export default {
name: 'information',
data () {
@@ -97,7 +81,8 @@ export default {
},
components: {
Swiper,
VideoDialog
VideoDialog,
HotNews
},
mounted () {
this.gethotnewsConfig()
@@ -144,17 +129,7 @@ export default {
async gethotlist () {
const { data: { message, data } } = await hotlist()
if (message === 'success') {
this.hotnews.title = data.list[0].title
this.hotnews.img = data.list[0].image
this.hotnews.detail = data.list[0].detail
for (let index = 1; index < data.list.length; index++) {
this.hotnewsList.push({
title: data.list[index].title,
img: data.list[index].image,
subtitle: data.list[index].subTitle,
detail: data.list[index].detail
})
}
this.hotnewsList = data.list
}
},
async getvideoList () {


+ 18
- 169
src/views/metadaily/index.vue Voir le fichier

@@ -3,24 +3,7 @@
<Swiper :banner-array="carouselList" />
<div id="hot">
<div class="content">
<div class="top" v-if="display">
<div id="imgtxt" @click="routerToarticleDetails(hotnews.detail)">
<img :src="hotnews.img">
<a class="newsTitle">{{ hotnews.title }}</a>
</div>
<div id="hottxt">
<div id="htitle">
<a class="tle">热点新闻</a>
<el-button type="text" @click="routerTo">MORE+</el-button>
</div>
<div id="hotList">
<div class="list" v-for="(item, index) in hotnewsList" :key="index" @click="routerToarticleDetails(item.detail)">
<img :src="item.img">
<a>{{ item.title }}</a>
</div>
</div>
</div>
</div>
<HotNews v-if="display" :list="hotnewsList"/>
</div>
</div>
<div class="gg" v-if="gg1.img" >
@@ -74,6 +57,7 @@
</template>
<script>
import Swiper from '@/components/swiper'
import HotNews from '@/components/hotNews'
import { guanggao, lunboList, hotNewsConfig, shendu, zixun, hotnews } from '@/api/metadaily.js'
export default {
name: 'metadaily',
@@ -93,7 +77,8 @@ export default {
}
},
components: {
Swiper
Swiper,
HotNews
},
mounted () {
this.gethotnewsConfig()
@@ -149,19 +134,20 @@ export default {
this.hotnewsList = []
const { data: { message, data } } = await hotnews()
if (message === 'success') {
this.hotnews = {
title: data.list[0].title,
img: data.list[0].image,
detail: data.list[0].detail
}
for (let index = 1; index < data.list.length; index++) {
console.log(data.list[index])
this.hotnewsList.push({
title: data.list[index].title,
img: data.list[index].image,
detail: data.list[index].detail
})
}
this.hotnewsList = data.list
// this.hotnews = {
// title: data.list[0].title,
// img: data.list[0].image,
// detail: data.list[0].detail
// }
// for (let index = 1; index < data.list.length; index++) {
// console.log(data.list[index])
// this.hotnewsList.push({
// title: data.list[index].title,
// img: data.list[index].image,
// detail: data.list[index].detail
// })
// }
}
},
async getshendu () {
@@ -231,109 +217,6 @@ export default {
.top, .bottom {
width: 100%;
}
.top {
min-height: 470px;
//margin-bottom: 30px;
background-color: #FFFFFF;
display: flex;
#imgtxt {
width: 560px;
//width: 55%;
position: relative;
display: flex;
justify-content: center;
align-items: center;
img {
width: 560px;
//height: 90%;
}
.newsTitle{
position: absolute;
bottom: 5%;
left: 0;
display: inline-block;
font-size: 18px;
font-weight: bold;
color: #FFFFFF;
line-height: 48px;
width: 100%;
background-color: #0000007e;
}
}
#hottxt {
display: flex;
justify-content: space-around;
flex-direction: column;
align-items: center;
flex: 1;
margin-left: 35px;
#htitle {
display: flex;
justify-content: space-between;
align-items: center;
width: 95%;
.tle {
z-index: 9;
font-size: 26px;
font-weight: bold;
color: #00161C;
line-height: 48px;
display: inline-block;
position: relative;
text-decoration: none; /* 移除默认的下划线 */
}
.tle::after {
content: '';
position: absolute;
left: -15px;
bottom: 10px;
width: 65%;
height: 6px; /* 横线高度为文字高度的一半 */
background-color: #07CAAF;; /* 横线颜色与文字颜色相同 */
z-index: -1;
}
.el-button {
font-size: 16px;
font-weight: bold;
color: #07CAAF;
line-height: 48px;
z-index: 999;
}
}
}
#hotList {
//height: 90%;
height: 76%;
display: flex;
flex-wrap: wrap;
justify-content: space-between;
align-items: center;
.list {
display: flex;
flex-direction: column;
justify-content: center;
margin-right: 39px;
z-index: 999;
img {
width: 150px;
height: 112px;
border-radius: 10px;
}
a {
font-size: 14px;
font-weight: 400;
color: #010101;
margin-top: 14px;
white-space: nowrap;
overflow: hidden;
text-overflow: ellipsis;
width: 150px;
//line-height: 48px;
}
}
}
}
.bottom {
min-height: 120px;
background-image: url('../../assets/bottom.png');
@@ -345,40 +228,6 @@ export default {
padding: 0;
.content {
margin-top: 30px;
.top {
//min-height: 470px;
//margin-bottom: 40px;
background-color: #FFFFFF;
display: flex;
background-image: url('../../assets/hotTopLeft.png');
background-position: 101% 0; /* 调整这些值来改变显示的部分 */
background-size: 30% 50%; /* 使用 'cover' 或 'contain',或者设置具体尺寸 */
background-repeat: no-repeat;
#imgtxt {
width: 560px;
position: relative;
display: flex;
justify-content: center;
align-items: center;
margin-left: 20px;
img {
width: 560px;
//height: 90%;
}
.newsTitle{
position: absolute;
bottom: 5%;
left: 0;
display: inline-block;
font-size: 18px;
font-weight: bold;
color: #FFFFFF;
line-height: 48px;
width: 100%;
background-color: #0000007e;
}
}
}
}
}
#wk {


Chargement…
Annuler
Enregistrer