odjbin/sist_web
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

01

Browse Source
This commit is contained in:
clay
2022-01-19 19:24:02 +08:00
parent 74a0130727
commit d0b9848102
7 changed files with 269 additions and 155 deletions
Download Patch File Download Diff File Expand all files Collapse all files

79
src/views/index/components/news_center.vue
View File

@@ -1,6 +1,6 @@
<template>
<div class="news_center">
<!--title-->
<!--title
<el-row>
<el-col :xs="1" :sm="2" :md="4" :lg="6" :xl="6">
<div class="grid-content"></div>
@@ -21,7 +21,29 @@
</el-col>
</el-row>
</el-col>
</el-row>
</el-row>-->
<!--title-->
<div class="headline">
<div class="hr_div">
<div class="hr_line_left">
</div>
<div class="hr_dot_left">
</div>
</div>
<div class="title">
{{ $t('message.news_center') }}
</div>
<div class="hr_div">
<div class="hr_line_right">
</div>
<div class="hr_dot_right">
</div>
</div>
</div>
<!--录播图-->
<el-row>
<el-col :xs="1" :sm="2" :md="2" :lg="3" :xl="5">
@@ -54,13 +76,13 @@
</el-col>
<el-col :xs="22" :sm="20" :md="20" :lg="18" :xl="14">
<el-row class="news">
<el-col v-for="(news,index) in newsDate" :key="index" :xs="12" :sm="12" :md="12" :lg="6" :xl="6" >
<div class="news_context" @click="getArticle(news)">
<el-col v-for="(news,index) in newsDate" :key="index" :xs="12" :sm="12" :md="12" :lg="6" :xl="6">
<div class="news_context" @click="getArticle(news)">
<div class="news_context_img">
<img :src="news.imgurl" alt="">
</div>
<div class="news_context_text">
{{news.title}}
{{ news.title }}
</div>
</div>
</el-col>
@@ -91,11 +113,11 @@ import {getParentNode} from "@/utils/sist";
export default {
name: "news_center",
data(){
return{
newsDate:[],
bannerDate:[],
width: document.documentElement.clientWidth>992,
data() {
return {
newsDate: [],
bannerDate: [],
width: document.documentElement.clientWidth > 992,
}
},
created() {
@@ -103,27 +125,27 @@ export default {
this.getBanner()
},
methods: {
getList(){
getList() {
getArticleList({
type:"XC7D8m5gkr35BX1b4Otiln4",
type: "XC7D8m5gkr35BX1b4Otiln4",
pageNum: 1,
pageSize: 4
}).then(res=>{
}).then(res => {
this.newsDate = res.rows
})
},
getArticle(news){
info(news.id).then(res=>{
getArticle(news) {
info(news.id).then(res => {
let info = getParentNode(res.data.encodeId)
if (this.width){
this.$router.push("/pc/" + info.second.encodeId +"/" +info.three.encodeId+"?id="+news.id);
}else {
this.$router.push("/mobile/" + info.second.encodeId +"/" +info.three.encodeId+"?id="+news.id);
if (this.width) {
this.$router.push("/pc/" + info.second.encodeId + "/" + info.three.encodeId + "?id=" + news.id);
} else {
this.$router.push("/mobile/" + info.second.encodeId + "/" + info.three.encodeId + "?id=" + news.id);
}
})
},
getBanner(){
banner("NEd5n92EMIpyyBslaNqsRgE").then(res=>{
getBanner() {
banner("NEd5n92EMIpyyBslaNqsRgE").then(res => {
this.bannerDate = res.data
})
}
@@ -133,7 +155,8 @@ export default {
<style scoped lang="scss">
@import '../css/comment.css';
.news_center{
.news_center {
padding-bottom: 2rem;
}
@@ -195,16 +218,16 @@ export default {
margin: 1rem auto;
width: 80%;
//height: 4rem;
overflow:hidden; //超出的文本隐藏
text-overflow:ellipsis; //溢出用省略号显示
display:-webkit-box; //作为弹性伸缩盒子模型显示。
-webkit-box-orient:vertical; //设置伸缩盒子的子元素排列方式--从上到下垂直排列
-webkit-line-clamp:3; //显示的行
overflow: hidden; //超出的文本隐藏
text-overflow: ellipsis; //溢出用省略号显示
display: -webkit-box; //作为弹性伸缩盒子模型显示。
-webkit-box-orient: vertical; //设置伸缩盒子的子元素排列方式--从上到下垂直排列
-webkit-line-clamp: 3; //显示的行
}
}
}
@media screen and (min-width: 1100px) and (max-width: 1400px) {
@media screen and (min-width: 1100px) and (max-width: 1400px) {
.news_context {
width: 20rem !important;
height: 20rem !important;