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.
 
 
 
 
fx-uniapp/pages/index/homeActivities/homeActivities.vue

114 lines
2.1 KiB

<template>
<view style="padding:30rpx 0;">
<view class="list">
<view class="listItem" @tap="goDetail(item)" v-for="(item,index) in list" :key="index">
<view class="img">
<image :src="item.image" mode="heightFix"></image>
</view>
<view class="textContent">
<view class="textTitle">{{item.title}}</view>
<view class="eyes">
<!-- <text></text> -->
<image src="../../../static/images/eye.png" mode="widthFix"></image>
</view>
</view>
</view>
</view>
<view class="empty" v-if="list.length==0">
<image src="/static/images/empty.png" mode="widthFix"></image>
<view class="emptyText">暂无内容</view>
</view>
</view>
</template>
<script>
export default {
data() {
return {
list:[]
};
},
methods:{
getList(){
this.$http("common.homeActivity")
.then(res => {
console.log(res,"9999555599")
this.list=res.data
});
},
goDetail(item){
console.log(item,"0000000")
this.$Router.push(`/pages/public/richtext?id=${item.id}`)
}
},
onLoad() {
this.getList()
}
}
</script>
<style lang="scss">
.empty{
margin:20% auto 0 auto;
text-align: center;
image{
width:30%;
height:auto;
}
.emptyText{
color:#ffffff;
margin:30upx;
}
}
.listItem{
margin:0 24upx;
background: #aaaaaa;
box-shadow: 0upx 6upx 16upx 0upx rgba(25,25,25,0.05);
border-radius: 20upx;
background-color: #191919;
margin-bottom:20upx;
overflow: hidden;
.img{
height: 382upx;
image{
height: 100%;
width: auto;
}
}
.textContent{
padding:30upx 25upx;
background-color: #ffffff;
display: flex;
align-items: center;
justify-content: space-between;
.textTitle{
font-size: 34upx;
font-family: Alibaba PuHuiTi;
font-weight: 400;
color: #333333;
flex:1;
overflow: hidden;
text-overflow: ellipsis;
white-space: nowrap;
}
.eyes{
display: flex;
width:41upx;
align-items: center;
justify-content: space-between;
margin-left:30rpx;
image{
width:41upx;
height:auto;
}
text{
font-size: 24upx;
font-family: Alibaba PuHuiTi;
font-weight: 400;
color: #333333;
}
}
}
}
</style>