兼兼街公众号代码
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.
 
 
 

171 lines
3.7 KiB

<template>
<view class="my-xiansuo">
<view class="course-box-item flex">
<u--image :showLoading="true" :src="saleData.photo" width="281rpx" height="256rpx"></u--image>
<view class="box-right">
<view class="active-title">{{saleData.title}}</view>
<view class="active-time">
<text>{{saleData.activityTime}}</text>
</view>
<view class="active-add">
<text>{{saleData.place}}</text>
</view>
<view class="user-img flex align-center">
<u--image class="user-img-sing" v-for="(val,i) in saleData.members" :key="i" :showLoading="true" shape="circle" :src="val.headImage" width="51rpx" height="51rpx"></u--image>
<view class="duode flex align-center justify-center">···</view>
</view>
</view>
</view>
<view class="liulan">
<view class="liulan-title flex align-center justify-between">
<text>浏览总数</text>
<text class="num">{{saleData.members.length}}</text>
</view>
<view class="user-from">
<view class="from-line flex align-center" v-for="(val,i) in saleData.members" :key="i">
<view class="dot"></view>
<view class="line-r flex align-center">
<u--image class="mr-2" :showLoading="true" shape="circle" :src="val.headImage" width="88rpx" height="88rpx"></u--image>
<view class="name-time">
<view>{{val.nickName}}</view>
<view class="time">{{val.createTime}}</view>
</view>
</view>
</view>
</view>
</view>
</view>
</template>
<script>
export default{
data(){
return{
activityId: '',
saleData:{}
}
},
onLoad(e) {
this.activityId = e.id;
this.getsaleClueById(e.id)
},
// 隐藏微信h5的标题栏
onReady() {
this.$com.displayNav()
},
methods:{
getsaleClueById(activityId){
this.$api('saleClueById',{activityId})
.then(res=>{
if(res.code == 200){
this.saleData = res.result;
}
})
}
}
}
</script>
<style lang="scss" scoped>
.my-xiansuo {
padding: 17rpx 19rpx 0 13rpx;
.course-box-item {
background: #ffffff;
border-radius: 12rpx;
box-shadow: 0px 3rpx 6rpx 0px rgba(0,0,0,0.16);
padding: 33rpx 13rpx;
.box-right {
margin-left: 16rpx;
.active-title {
font-size: 30rpx;
color: #000;
line-height: 40rpx;
overflow: hidden;
display: -webkit-box;
-webkit-box-orient: vertical;
-webkit-line-clamp: 2;
}
.active-time {
color: #707070;
font-size: 26rpx;
margin: 10rpx 0 14rpx 0;
}
.active-add {
color: #707070;
font-size: 26rpx;
}
.user-img {
margin-top: 26rpx;
.user-img-sing {
margin-right: 10rpx;
&:nth-child(6){
margin-right: 0;
}
}
.duode {
width: 51rpx;
height: 51rpx;
border-radius: 50%;
background-color: #C6C6C6;
color: #ffffff;
font-size: 44rpx;
}
}
}
}
.liulan {
background: #ffffff;
border-radius: 12rpx;
box-shadow: 0px 3rpx 6rpx 0px rgba(0,0,0,0.16);
padding: 0 25rpx 88rpx;
margin-top: 12rpx;
.liulan-title {
font-size: 30rpx;
color: #000000;
border-bottom: 1px solid #E6E6E6;
padding: 33rpx 0 19rpx;
.num{
color: #D33D3E;
}
}
.user-from {
.from-line {
border-bottom: 1px solid #ECECEC;
padding: 20rpx 0 8rpx 0;
.dot {
width: 10rpx;
height: 10rpx;
border-radius: 50%;
background-color: #ED1450;
margin-right: 13rpx;
}
.line-r {
.name-time {
font-size: 24rpx;
color: #3B3B3B;
}
.time {
font-size: 20rpx;
color: #929292;
margin-top: 13rpx;
}
}
}
}
}
}
</style>