You can not select more than 25 topics
Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
146 lines
3.4 KiB
146 lines
3.4 KiB
<!--
|
|
Copyright (c) 2020.
|
|
author: song
|
|
email: 15235360226@163.com
|
|
-->
|
|
|
|
<template>
|
|
<div class="wrap">
|
|
<div class="d-flex flex-nowrap align-center baseColor" v-if="i === 0">
|
|
<span class="font-bold-24">行业资讯</span>
|
|
<img class="bullhorn ml-4" src="@/assets/bullhorn.png" />
|
|
<div class="flex-1"></div>
|
|
<a-button
|
|
class="d-flex align-center font-16 baseColor"
|
|
style="display: inline-block;"
|
|
type="link"
|
|
>
|
|
more
|
|
<a-icon style="font-size:12px" type="right" />
|
|
</a-button>
|
|
</div>
|
|
<div class="d-flex flex-nowrap align-center baseColor" v-else>
|
|
<span class="font-bold-24">活动公告</span>
|
|
<img class="bullhorn ml-4" src="@/assets/bullhorn.png" />
|
|
<div class="flex-1"></div>
|
|
<a-button
|
|
class="d-flex align-center font-16 baseColor"
|
|
style="display: inline-block;"
|
|
type="link"
|
|
>
|
|
more
|
|
<a-icon style="font-size:12px" type="right" />
|
|
</a-button>
|
|
</div>
|
|
<div class="policy-box" v-if="lists && lists[i].news && lists[i].news.length>0">
|
|
<div :key="index" class="div-box" v-for="(item, index) in lists[i].news">
|
|
<div @click="jumpDetails(item)" class="d-flex flex-nowrap" style="cursor: pointer">
|
|
<div class="time d-flex flex-column align-center mr-3" v-if="item.releaseTime">
|
|
<span class="font-20">{{ monthEnglish[item.releaseTime.split('-')[1] - 1] }}.</span>
|
|
<span class="font-bold-32 day">{{ item.releaseTime.split(' ')[0].split('-')[2] }}</span>
|
|
</div>
|
|
<div class="d-flex flex-1 flex-column">
|
|
<div class="item-title">{{ item.title }}</div>
|
|
<div class="original"></div>
|
|
<div class="item-content">{{ item.content }}</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</template>
|
|
|
|
<script>
|
|
import { mapState, mapMutations } from 'vuex';
|
|
import { front } from 'config/api';
|
|
export default {
|
|
name: 'IndexNewList',
|
|
props: {
|
|
i: {
|
|
type: Number,
|
|
default: 0,
|
|
},
|
|
lists: {
|
|
type: Array,
|
|
default: () => [],
|
|
},
|
|
},
|
|
data() {
|
|
return { monthEnglish: ['Jan', 'Feb', 'Mar', 'Apr', 'May', 'Jun', 'Jul', 'Aug', 'Spt', 'Oct', 'Nov', 'Dec'] };
|
|
},
|
|
|
|
methods: {
|
|
...mapMutations('home', ['setActDetail']),
|
|
|
|
// 跳转到详情界面
|
|
jumpDetails(item) {
|
|
this.setActDetail(item);
|
|
this.$router.push('/ActDetails');
|
|
},
|
|
},
|
|
};
|
|
</script>
|
|
|
|
<style scoped lang="stylus">
|
|
.wrap {
|
|
width: 90%;
|
|
height: 342px;
|
|
margin: 15px auto 15px auto;
|
|
overflow: hidden;
|
|
opacity: 1;
|
|
}
|
|
|
|
.bullhorn {
|
|
width: 25px;
|
|
height: 25px;
|
|
}
|
|
|
|
.policy-box {
|
|
.div-box {
|
|
position: relative;
|
|
background: #fff;
|
|
padding-top: 24px;
|
|
|
|
.time {
|
|
color: rgba(0, 0, 0, 0.25);
|
|
|
|
.day {
|
|
position: relative;
|
|
top: -15px;
|
|
}
|
|
}
|
|
}
|
|
}
|
|
|
|
.item-title {
|
|
overflow: hidden;
|
|
display: -webkit-box;
|
|
font-size: 16px;
|
|
color: rgba(0, 0, 0, 0.65);
|
|
font-family: Microsoft YaHei;
|
|
font-weight: bold;
|
|
-webkit-line-clamp: 1;
|
|
-webkit-box-orient: vertical;
|
|
}
|
|
|
|
.original {
|
|
position: relative;
|
|
top: 1px;
|
|
left: 0;
|
|
width: 30px;
|
|
height: 2px;
|
|
background: #13ACC4;
|
|
}
|
|
|
|
.item-content {
|
|
overflow: hidden;
|
|
display: -webkit-box;
|
|
margin-top: 8px;
|
|
line-height: 28px;
|
|
font-size: 14px;
|
|
color: rgba(0, 0, 0, 0.45);
|
|
font-family: Microsoft YaHei;
|
|
-webkit-line-clamp: 2;
|
|
-webkit-box-orient: vertical;
|
|
}
|
|
</style>
|
|
|