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.

136 lines
3.4 KiB

<template>
<view>
<view class="listActivity">
<view class="activityBox" v-for="(item,index) in list" :key="index" @click="openInfo(item)">
<view class="activityBox-top">
<image :src='item.cover_upload.url' style="width: 100%;height: 333rpx;"></image>
<view class="book-status">
{{item.status==0?"已结束":"活动进行中"}}
</view>
<view class="book-num" v-if="item.orders_count>0">
<text class="book-num-y"> {{isUnde(item.orders_count)}} </text>
<text>人已报名</text>
</view>
</view>
<view class="activityBox-content flex-col">
<view class="activityBox-row">
<text class="activityBox-title">{{isUnde(item.name)}}</text>
</view>
<view class="activityBox-row flex-row justify-between">
<view class="tag tag_green">
<text>{{isUnde(item.target_name)}}</text>
</view>
<view v-if="isUnde(item.status)==1" class="activityBox-btn tag">
<text>立即报名</text>
</view>
</view>
<view class="activityBox-row">
<text class="icon-shijian iconfont"></text>
<text>活动时间:{{isUnde(item.start_time)}}-{{getHm(item.end_time)}}</text>
</view>
<view class="activityBox-row">
<text class="icon-huodongfangshi iconfont"></text>
<text>活动方式:{{isUnde(item.area_name)}}</text>
</view>
<view class="activityBox-row">
<text class="icon-huodong iconfont"></text>
<text>活动地址:{{isUnde(item.address)}}</text>
</view>
<view class="activityBox-row">
<text class="icon-renshu iconfont"></text>
<text>人数限制:{{isUnde(item.total)==0?'不限':isUnde(item.total)}}</text>
</view>
<view class="activityBox-row flex-row align-center" style="margin-bottom: 0rpx;"
@click.stop="tothere(item)">
<text class="icon-ditu-dibiao iconfont"></text>
<text>距离:{{isUnde(item.distance)}}km</text>
<view class="tomap">
<text class="icon-daohang1 iconfont" style="margin-right: 0;"></text>
</view>
</view>
</view>
</view>
</view>
</view>
</template>
<script>
export default {
data() {
return {
showInfo: true,
list: [],
latitude: "",
longitude: "",
}
},
onLoad() {
var that = this;
wx.getLocation({
success(res) {
console.log(res)
that.latitude = res.latitude;
that.longitude = res.longitude;
that.loadActivity()
}
})
},
methods: {
tothere(item) {
uni.openLocation({
latitude: parseFloat(item.latitude),
longitude: parseFloat(item.longitude),
name: item.name,
address: item.address
})
},
openInfo(obj) {
uni.navigateTo({
url: "info?id=" + obj.id
})
},
loadActivity() {
var that = this;
this.util.request({
api: '/api/mobile/activity/index',
data: {
latitude: that.latitude,
longitude: that.longitude,
},
utilSuccess: function(res) {
that.list = res.data;
},
utilFail: function(res) {
}
})
},
isUnde(val) {
if (val) {
return val
} else {
return ""
}
},
getHm(val) {
if (val) {
return val.substring(11, val.length)
}
}
}
}
</script>
<style>
@import url("@/static/css/activitybox.css");
page {
background-color: #f7f6f4;
}
</style>