Commit 65a94c36 authored by lixy's avatar lixy

新闻、活动列表

parent afc3351c
...@@ -107,14 +107,17 @@ input[disabled] { ...@@ -107,14 +107,17 @@ input[disabled] {
.main-padding{ .main-padding{
padding: 0.7rem 0.4rem; padding: 0.7rem 0.4rem;
} }
.ft-15{
font-size: 15px;
}
.tc{ .tc{
text-align: center; text-align: center;
} }
.empty_data{ .empty_data{
font-size:.5rem; font-size: 12px;
color:#666; color: #999;
text-align:center; text-align: center;
line-height:2rem margin-bottom: 20px;
} }
.mint-second-menu{ .mint-second-menu{
......
...@@ -45,6 +45,7 @@ ...@@ -45,6 +45,7 @@
</ul> </ul>
</div> </div>
<div <div
v-if="isShowMenu"
class="bg-mask" class="bg-mask"
@touchmove.prevent @touchmove.prevent
@click="closeMenu()"/> @click="closeMenu()"/>
......
...@@ -10,7 +10,7 @@ ...@@ -10,7 +10,7 @@
<img <img
:src= "item.cover" :src= "item.cover"
:alt="item.title" :alt="item.title"
style="width:100%;"> style="height: 80px;width:auto;">
</li> </li>
</ul> </ul>
</div> </div>
...@@ -118,9 +118,6 @@ ...@@ -118,9 +118,6 @@
opacity:1 !important; opacity:1 !important;
transition: all 1.5s; transition: all 1.5s;
} }
ul{
height:100%;
}
.banner .name-t{ .banner .name-t{
display:inline-block; display:inline-block;
height:40px; height:40px;
...@@ -170,8 +167,11 @@ ...@@ -170,8 +167,11 @@
transform: translateY(-50%); transform: translateY(-50%);
} }
.banner{ .banner{
height:px2rem(100px); height:80px;
overflow: hidden; overflow: hidden;
margin-top: 44px; margin-top: 44px;
} }
.banner img{
object-fit:cover;
}
</style> </style>
<template> <template>
<div class="order-page"> <div class="activity-container">
<Head/> <Head/>
<second-banner <second-banner
:list = "bannerList" :list = "bannerList"
...@@ -20,21 +20,29 @@ ...@@ -20,21 +20,29 @@
type="1" type="1"
style="padding-top: 0;" style="padding-top: 0;"
class="main-padding"> class="main-padding">
<router-link <li
v-for="item in dataDetail" v-for="item in dataDetail"
:to="{ path: 'activityDetail', query:{id: item.id }}" :key="item.id">
:key="item.id" <router-link
class="flex-jcb news-item"> :to="{ path: 'activityDetail', query:{id: item.id }}"
<img class="activity-item">
:src="item.banner" <img
:alt = "item.title" :src="item.banner"
class="tour-img-home"> :alt = "item.title"
<div class="tour-home-r"> style="border-radius: 3px 3px 0 0;">
<div class="ellipsis2">{{ item.title }}</div> <div class="activity-item-d">
<div class="activity-time">{{ item.startTime | formatDate('yyyy-MM-dd hh:mm') }}</div> <div class="ellipsis2 activity-item-title">{{ item.title }}</div>
<div>{{ item.endTime | formatDate('yyyy-MM-dd hh:mm') }}</div> <div class="activity-time">{{ item.startTime | formatDate('yyyy-MM-dd hh:mm') }}</div>
</div> <div class="activity-addr flex-aic">
</router-link> <img
:src="item.banner"
:alt = "item.title"
style="width: 10px;height: 13px;margin-right: 5px;">
{{ item.province }}{{ item.city }}{{ item.town }}{{ item.address }} </div>
</div>
</router-link>
</li>
</ul> </ul>
<p <p
v-if="preventRepeatReuqest" v-if="preventRepeatReuqest"
...@@ -159,42 +167,30 @@ ...@@ -159,42 +167,30 @@
<style lang="scss"> <style lang="scss">
@import "../assets/styles/mixin"; @import "../assets/styles/mixin";
.news-item{ .activity-container{
margin: 10px 0; .activity-item{
} margin: 10px 0;
.tour-home-r, .news-home-r{ }
width: 58%; #scroll-area li{
} box-shadow: 2px 3px 13px #999;
.tour-img-home, .news-home-img{ margin: 17px 0;
width: px2rem(300px); border-radius: 3px;
height: px2rem(150px); }
} .activity-item-d{
.order-page { padding: 14px 10px;
.no-data { }
text-align: center; .activity-item-title{
font-size: 14px;
.nodata { font-weight: bold;
width: px2rem(400px); }
height: px2rem(400px); .activity-time{
margin: 15vh auto px2rem(10px) auto; margin: 10px 0;
} font-size: 12px;
color: #666;
p { }
color: #6a6a6a; .activity-addr{
font-size: px2rem(32px); font-size: 12px;
margin-bottom: px2rem(15px); color: #999;
}
.login {
width: px2rem(240px);
height: px2rem(80px);
background: #56d176;
border: none;
color: #fff;
font-size: px2rem(28px);
border-radius: 2px;
}
} }
} }
</style> </style>
...@@ -15,19 +15,26 @@ ...@@ -15,19 +15,26 @@
@click="bannerClick"/> @click="bannerClick"/>
<ul <ul
v-if="dataDetail.length" v-if="dataDetail.length"
id="scroll-area"> id="scroll-area"
class="main-padding">
<router-link <router-link
v-for="item in dataDetail" v-for="item in dataDetail"
:to="{ path: 'newsDetail', query:{id: item.id }}" :to="{ path: 'newsDetail', query:{id: item.id }}"
:key="item.id" :key="item.id"
class="flex-jcb news-item"> class="flex-jcb"
style="margin-bottom: 20px;">
<img <img
:src="item.coverImage" :src="item.coverImage"
class="tour-img-home"> class="news-img-list">
<div class="tour-home-r"> <div class="news-list">
<div class="ellipsis2">{{ item.title }}</div> <div class="ellipsis2 news-list-title">{{ item.title }}</div>
<div class="ellipsis2 epitome">导语:{{ item.epitome }}</div> <!--<div class="ellipsis2 epitome">导语:{{ item.epitome }}</div>-->
<div class="epitome">{{ item.addTime.substring(0, 10) }}</div> <div class="epitome news-list-time flex-aic">
<img
:src="item.coverImage"
style="width: 17px;height: 17px;margin-right: 7px;">
{{ item.addTime.substring(0, 10) }}</div>
</div> </div>
</router-link> </router-link>
</ul> </ul>
...@@ -159,7 +166,27 @@ ...@@ -159,7 +166,27 @@
<style lang="scss"> <style lang="scss">
@import "../assets/styles/mixin"; @import "../assets/styles/mixin";
.news-container{ .news-container{
.news-img-list{
width: 92px;
height: 75px;
}
.news-list {
border-bottom: 1px solid #dfdfdf;
width: 100%;
display: flex;
flex-direction: column;
justify-content: space-between;
margin-left: 13px;
padding-bottom: 13px;
}
.news-list-title{
margin-bottom: 15px;
font-size: 15px;
}
.news-list-time{
font-size: 13px;
color: #999;
}
} }
.news-item{ .news-item{
margin: 10px 0; margin: 10px 0;
......
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment