Explorar el Código

fixbug

master
chutingting hace 1 año
padre
commit
fa8e1af404
Se han modificado 8 ficheros con 200 adiciones y 252 borrados
  1. +12
    -1
      src/api/article.js
  2. +4
    -5
      src/components/hotNews/index.vue
  3. +1
    -0
      src/views/aigc/index.vue
  4. +36
    -134
      src/views/article/details.vue
  5. +7
    -103
      src/views/article/list.vue
  6. +133
    -0
      src/views/article/right.vue
  7. +3
    -4
      src/views/information/index.vue
  8. +4
    -5
      src/views/metadaily/index.vue

+ 12
- 1
src/api/article.js Ver fichero

@@ -22,4 +22,15 @@ export const videoListApi = (data) => {
url: `/car/videoList`,
params: data
})
}
}

/**
* 详情
* @returns request
*/
export const detailApi = (id) => {
return request({
method: 'GET',
url: `/news/detail?id=${id}`
})
}

+ 4
- 5
src/components/hotNews/index.vue Ver fichero

@@ -1,6 +1,6 @@
<template>
<div class="hotnews" >
<div class="imgtxt" @click="routerToarticleDetails(firstData.detail)">
<div class="imgtxt" @click="detail(firstData)">
<img :src="firstData.image">
<a class="newsTitle">{{ firstData.title }}</a>
</div>
@@ -10,7 +10,7 @@
<el-button type="text" @click="routerTo">MORE+</el-button>
</div>
<div class="hotList">
<div class="list" v-for="(item, index) in listData" :key="index" @click="routerToarticleDetails(item.detail)">
<div class="list" v-for="(item, index) in listData" :key="index" @click="detail(item)">
<img :src="item.image">
<a>{{ item.title }}</a>
</div>
@@ -46,9 +46,8 @@ export default {
routerTo() {
this.$router.push({ path: '/articleList', query: {type : this.type } })
},
routerToarticleDetails() {
localStorage.setItem('article', value)
this.$router.push({ path: '/articleDetails' })
detail(item) {
this.$router.push({ path: '/articleDetails', query: {id : item.id } })
}
}
}


+ 1
- 0
src/views/aigc/index.vue Ver fichero

@@ -376,6 +376,7 @@ export default {
}
img{
width: 100%;
border-radius: 10px;
}
}


+ 36
- 134
src/views/article/details.vue Ver fichero

@@ -3,100 +3,40 @@
<Swiper :banner-array="carouselList" />
<div id="hot">
<div class="content">
<div class="list" v-html="article">
</div>
<div class="right">
<div class="rtop">
<div class="title">
<a>热点新闻</a>
</div>
<div class="nav" v-for="(item,index) in news" :key="index">
<img :src="item.img">
<a>{{ item.txt }}</a>
</div>
</div>
<div class="rbottom">
<div class="title">
<a>相关视频</a>
</div>
<div class="nav rtmnav" v-for="(item,index) in videos" :key="index">
<img :src="item.img">
<a>{{ item.txt }}</a>
</div>
</div>
<div class="left">
<h1>{{ data.title }}</h1>
<div class="date">发布日期: {{ $moment(data.sendDate).format('YYYY-MM-DD HH:mm:ss') }}</div>
<div class="list" v-html="data.detail"></div>
</div>
<RightList />
</div>
</div>
</div>
</template>
<script>
import Swiper from '@/components/swiper'
import RightList from './right.vue'
import { lunboList } from '@/api/home.js'
import { detailApi } from '@/api/article.js'
export default {
name: 'home',
data () {
return {
carouselList: [],
articleList: [
{
img: '/airtlc.png',
title: '强不强?吉利银河E8全景智慧座舱揭秘',
content: '同样引人注目。近日,2024款福特电马激情上市,共推出5款车型,官方指导价23.98万元-35.98万元得不提帝豪家族竞争力长',
date: '2023/01/02'
},
{
img: '/airtlc.png',
title: '强不强?吉利银河E8全景智慧座舱揭秘',
content: '同样引人注目。近日,2024款福特电马激情上市,共推出5款车型,官方指导价23.98万元-35.98万元得不提帝豪家族竞争力长',
date: '2023/01/02'
},
{
img: '/airtlc.png',
title: '强不强?吉利银河E8全景智慧座舱揭秘',
content: '同样引人注目。近日,2024款福特电马激情上市,共推出5款车型,官方指导价23.98万元-35.98万元得不提帝豪家族竞争力长',
date: '2023/01/02'
}
],
news: [
{
img: '/car.png',
txt: '银河E8全景智慧座舱揭秘银河E8'
},
{
img: '/car.png',
txt: '银河E8全景智慧座舱揭秘银河E8'
},
{
img: '/car.png',
txt: '银河E8全景智慧座舱揭秘银河E8'
}
],
videos: [
{
img: '/car.png',
txt: '银河E8全景智慧座舱揭秘银河E8'
},
{
img: '/car.png',
txt: '银河E8全景智慧座舱揭秘银河E8'
},
{
img: '/car.png',
txt: '银河E8全景智慧座舱揭秘银河E8'
}
],
article: ''
news: [],
videos: [],
data: {}
}
},
components: {
Swiper
},
mounted () {
this.article = localStorage.getItem('article')
Swiper,
RightList
},
mounted () {},
created () {
this.getlunboList()
this.getDetail()
},
methods: {
async getlunboList () {
@@ -104,6 +44,12 @@ export default {
if (code === 200) {
this.carouselList = data.list
}
},
async getDetail () {
const { data: { code, data } } = await detailApi(this.$route.query.id)
if (code === 200) {
this.data = data
}
}
}
}
@@ -145,10 +91,23 @@ export default {
margin: 50px 0 50px 0;
display: flex;
justify-content: space-between;
.left{
width: 820px;
padding: 30px;
width: 820px;
background-color: #FFFFFF;
h1 {
margin: 0;
}
.date {
font-size: 14px;
color: #7D8392;
line-height: 30px;
margin: 30px 0;
}
}
.list {
padding: 30px;
width: 820px;
background-color: #FFFFFF;
overflow: hidden;
.article {
display: flex;
img {
@@ -193,63 +152,6 @@ export default {
}
}
}
.right {
width: 300px;
display: flex;
justify-content: space-between;
flex-direction: column;
.rtop, .rbottom {
background-color: #FFFFFF;
width: 100%;
margin-bottom: 20px;
.title {
background-image: url('../../assets/airtlctl.png');
background-position: 0 0; /* 调整这些值来改变显示的部分 */
background-size: 30% 100%; /* 使用 'cover' 或 'contain',或者设置具体尺寸 */
background-repeat: no-repeat;
a {
font-size: 20px;
font-weight: bold;
color: #000000;
line-height: 48px;
width: 100%;
text-align: left;
display: inline-block;
margin-left: 40px;
}
}
.nav {
display: flex;
flex-direction: column;
align-items: center;
margin: 10px 0 10px 0;
img {
width: 240px;
height: 180px;
position: relative;
}
a {
font-size: 16px;
font-weight: 400;
color: #000000;
line-height: 48px;
}
}
.rtmnav {
img::after {
content: '';
z-index: 99;
width: 67px;
height: 67px;
position: absolute;
background-image: url('../../assets/play.png');
// background-position: 101% 0; /* 调整这些值来改变显示的部分 */
// background-size: 12% 50%; /* 使用 'cover' 或 'contain',或者设置具体尺寸 */
background-repeat: no-repeat;
}
}
}
}
}
}


+ 7
- 103
src/views/article/list.vue Ver fichero

@@ -4,7 +4,7 @@
<div id="hot">
<div class="content">
<div class="list">
<div class="article" v-for="(item, index) in articleList" :key="index">
<div class="article" v-for="(item, index) in articleList" :key="index" @click="detail(item)">
<img :src="item.image">
<div class="acontent">
<div class="txt">
@@ -23,27 +23,7 @@
:total="total">
</el-pagination>
</div>
<div class="right">
<div class="rtop">
<div class="title">
<a>热点新闻</a>
</div>
<div class="nav" v-for="(item,index) in news" :key="index">
<img :src="item.image">
<a>{{ item.title }}</a>
</div>
</div>
<div class="rbottom">
<div class="title">
<a>相关视频</a>
</div>
<div class="nav" v-for="(item,index) in videos" :key="index">
<img :src="item.image">
<a>{{ item.title }}</a>
<img class="play" src="@/assets/play.png" @click="videoPlayer(item)">
</div>
</div>
</div>
<RightList />
</div>
</div>
<el-dialog title="" v-if="videoDialogVisible" :visible.sync="videoDialogVisible" :lock-scroll="false" :append-to-body="true" width="50%">
@@ -53,9 +33,9 @@
</template>
<script>
import Swiper from '@/components/swiper'
import VideoDialog from '@/components/video'
import RightList from './right.vue'
import { lunboList } from '@/api/home.js'
import { newsListApi, videoListApi } from '@/api/article.js'
import { newsListApi } from '@/api/article.js'
/* eslint-disable */
export default {
name: 'home',
@@ -74,13 +54,11 @@ export default {
},
components: {
Swiper,
VideoDialog
RightList
},
created () {
this.getlunboList()
this.getnewsList()
this.getHotList()
this.getVideoList()
},
methods: {
handleCurrentChange(val) {
@@ -106,31 +84,8 @@ export default {
this.articleList = data.list
}
},
async getHotList () {
let d = {
pageNum: 1,
pageSize: 3,
type: 1,
subType: 11
}
const { data: { code, data } } = await newsListApi(d)
if (code === 200) {
this.news = data.list
}
},
async getVideoList() {
let d = {
pageNum: 1,
pageSize: 3
}
const { data: { code, data } } = await videoListApi(d)
if (code === 200) {
this.videos = data.list
}
},
videoPlayer (item) {
this.videoUrl = item.link
this.videoDialogVisible = true
detail(item) {
this.$router.push({ path: '/articleDetails', query: {id : item.id } })
}
}
}
@@ -233,57 +188,6 @@ export default {
}
}
}
.right {
width: 300px;
.rtop, .rbottom {
background-color: #FFFFFF;
margin-bottom: 20px;
padding-bottom: 20px;
width: 100%;
.title {
background-image: url('../../assets/airtlctl.png');
background-position: 0 0; /* 调整这些值来改变显示的部分 */
background-size: 30% 100%; /* 使用 'cover' 或 'contain',或者设置具体尺寸 */
background-repeat: no-repeat;
a {
font-size: 20px;
font-weight: bold;
color: #000000;
line-height: 48px;
width: 100%;
text-align: left;
display: inline-block;
margin-left: 40px;
}
}
.nav {
display: flex;
flex-direction: column;
align-items: center;
margin: 20px 0 10px 0;
position: relative;
img {
width: 240px;
}
.play{
width: 60px;
position: absolute;
left: 50%;
top: 38px;
margin-left: -30px;
cursor: pointer;
}
a {
font-size: 16px;
font-weight: 400;
color: #000000;
line-height: 20px;
width: 240px;
margin-top: 18px;
}
}
}
}
}
}


+ 133
- 0
src/views/article/right.vue Ver fichero

@@ -0,0 +1,133 @@
<template>
<div class="right">
<div class="rtop">
<div class="title">
<a>热点新闻</a>
</div>
<div class="nav" v-for="(item,index) in news" :key="index" @click="detail(item)">
<img :src="item.image">
<a>{{ item.title }}</a>
</div>
</div>
<div class="rbottom">
<div class="title">
<a>相关视频</a>
</div>
<div class="nav" v-for="(item,index) in videos" :key="index">
<img :src="item.image">
<a>{{ item.title }}</a>
<img class="play" src="@/assets/play.png" @click="videoPlayer(item)">
</div>
</div>
<el-dialog title="" v-if="videoDialogVisible" :visible.sync="videoDialogVisible" :lock-scroll="false" :append-to-body="true" width="50%">
<VideoDialog :url="videoUrl" :lock-scroll="false" :append-to-body="true"></VideoDialog>
</el-dialog>
</div>
</template>
<script>
import { newsListApi, videoListApi } from '@/api/article.js'
import VideoDialog from '@/components/video'
/* eslint-disable */
export default {
data () {
return {
news: [],
videos: [],
videoDialogVisible: false,
videoUrl: ''
}
},
components: {
VideoDialog
},
created () {
this.getHotList()
this.getVideoList()
},
methods: {
async getHotList () {
let d = {
pageNum: 1,
pageSize: 3,
type: 1,
subType: 11
}
const { data: { code, data } } = await newsListApi(d)
if (code === 200) {
this.news = data.list
}
},
async getVideoList() {
let d = {
pageNum: 1,
pageSize: 3
}
const { data: { code, data } } = await videoListApi(d)
if (code === 200) {
this.videos = data.list
}
},
videoPlayer (item) {
this.videoUrl = item.link
this.videoDialogVisible = true
},
detail(item) {
this.$router.push({ path: '/articleDetails', query: {id : item.id } })
}
}
}
</script>

<style lang="scss" scoped>
.right {
width: 300px;
.rtop, .rbottom {
background-color: #FFFFFF;
margin-bottom: 20px;
padding-bottom: 20px;
width: 100%;
.title {
background-image: url('../../assets/airtlctl.png');
background-position: 0 0; /* 调整这些值来改变显示的部分 */
background-size: 30% 100%; /* 使用 'cover' 或 'contain',或者设置具体尺寸 */
background-repeat: no-repeat;
a {
font-size: 20px;
font-weight: bold;
color: #000000;
line-height: 48px;
width: 100%;
text-align: left;
display: inline-block;
margin-left: 40px;
}
}
.nav {
display: flex;
flex-direction: column;
align-items: center;
margin: 20px 0 10px 0;
position: relative;
img {
width: 240px;
}
.play{
width: 60px;
position: absolute;
left: 50%;
top: 38px;
margin-left: -30px;
cursor: pointer;
}
a {
font-size: 16px;
font-weight: 400;
color: #000000;
line-height: 20px;
width: 240px;
margin-top: 18px;
}
}
}
}
</style>

+ 3
- 4
src/views/information/index.vue Ver fichero

@@ -34,7 +34,7 @@
<el-button type="text" class="more" @click="routerTo">MORE+</el-button>
</div>
<div id="hotList">
<div class="list" v-for="(item, index) in carList" :key="index" @click="routerToarticleDetails(item.detail)">
<div class="list" v-for="(item, index) in carList" :key="index" @click="detail(item)">
<img :src="item.image">
<div class="txt">
<a class="title">{{ item.title }}</a>
@@ -89,9 +89,8 @@ export default {
handleChange(newIndex) {
this.currentIndex = newIndex;
},
routerToarticleDetails (value) {
localStorage.setItem('article', value)
this.$router.push({ path: '/articleDetails' })
detail (item) {
this.$router.push({ path: '/articleDetails', query: {id : item.id } })
},
routerTo () {
this.$router.push({ path: '/articleList', query: {type : 2 } })


+ 4
- 5
src/views/metadaily/index.vue Ver fichero

@@ -18,7 +18,7 @@
<el-button type="text" @click="routerTo(31)">MORE+</el-button>
</div>
<div id="hotList">
<div class="list" v-for="(item, index) in zixun" :key="index" @click="routerToarticleDetails(item.detail)">
<div class="list" v-for="(item, index) in zixun" :key="index" @click="detail(item)">
<img :src="item.image">
<div class="txt">
<a class="title">{{ item.title }}</a>
@@ -43,7 +43,7 @@
<el-button type="text" @click="routerTo(32)">MORE+</el-button>
</div>
<div id="hotList">
<div class="list" v-for="(item, index) in shendu" :key="index" @click="routerToarticleDetails(item.detail)">
<div class="list" v-for="(item, index) in shendu" :key="index" @click="detail(item)">
<img :src="item.image">
<div class="txt">
<a class="title">{{ item.title }}</a>
@@ -89,9 +89,8 @@ export default {
this.getzixun()
},
methods: {
routerToarticleDetails (value) {
localStorage.setItem('article', value)
this.$router.push({ path: '/articleDetails' })
detail (item) {
this.$router.push({ path: '/articleDetails', query: {id : item.id } })
},
routerTo (type) {
this.$router.push({ path: '/articleList', query: { type: 3, subType: type }}) // eslint-disable-line


Cargando…
Cancelar
Guardar