|
|
@@ -1,14 +1,15 @@
|
|
|
<template>
|
|
|
<view class="venue-navbar">
|
|
|
- <view class="navbar-list" v-for="(item,index) in navbarList" :key="index" @click="select_nav(item,index)">
|
|
|
- <view class="list-text">{{item.text}}</view>
|
|
|
- <image :src="sel_index==index?'/static/notsel-icon.png':'/static/select-icon.png'" mode=""></image>
|
|
|
+ <view class="navbar-list" v-for="(item, index) in navbarList" :key="index" @click="select_nav(item, index)">
|
|
|
+ <view class="list-text">{{ item.text }}</view>
|
|
|
+ <image :src="sel_index == index ? '/static/notsel-icon.png' : '/static/select-icon.png'" mode=""></image>
|
|
|
</view>
|
|
|
</view>
|
|
|
<view style="height: 70rpx;"></view>
|
|
|
<view class="content">
|
|
|
<view class="select-btn">
|
|
|
- <view :class="sel_btn===index?'distance':'score'" v-for="(item,index) in selectList" :key="index" @click="select_btn(item,index)">{{item.text}}</view>
|
|
|
+ <view :class="sel_btn === index ? 'distance' : 'score'" v-for="(item, index) in selectList" :key="index"
|
|
|
+ @click="select_btn(item, index)">{{ item.text }}</view>
|
|
|
</view>
|
|
|
<view v-if="!searchLoading">
|
|
|
<view class="venue-card" v-for="item in dataList" @click="gotoDetail(item)" :key="item.id">
|
|
|
@@ -16,171 +17,173 @@
|
|
|
<image :src="item.cover.split(',')[0]" mode=""></image>
|
|
|
<view class="e-badge">
|
|
|
<image src="/src/static/events-icon1.png" mode="widthFix"></image>
|
|
|
- <view class="text">{{item.ticketWhether?'今日有票':'暂无余票'}}</view>
|
|
|
+ <view class="text">{{ item.ticketWhether ? '今日有票' : '暂无余票' }}</view>
|
|
|
</view>
|
|
|
</view>
|
|
|
<view class="venues-info">
|
|
|
- <view class="venues-name">{{item.name}}</view>
|
|
|
+ <view class="venues-name">{{ item.name }}</view>
|
|
|
<view class="venues-comments">
|
|
|
<view class="star">
|
|
|
<zzx-icon name="star" size="12"></zzx-icon>
|
|
|
- <text style="margin-bottom: 4rpx;">{{item.goodRate.toFixed(1)||0}}</text>
|
|
|
+ <text style="margin-bottom: 4rpx;">{{ item.goodRate.toFixed(1) || 0 }}</text>
|
|
|
</view>
|
|
|
<view class="comment">
|
|
|
- {{item.comments||0}}条评论
|
|
|
+ {{ item.comments || 0 }}条评论
|
|
|
</view>
|
|
|
</view>
|
|
|
<view class="venues-address">
|
|
|
- {{item.address||'暂无地址'}} | {{item.km.toFixed(2)}}km
|
|
|
+ {{ item.address || '暂无地址' }} | {{ item.km.toFixed(2) }}km
|
|
|
</view>
|
|
|
<view class="venues-type">
|
|
|
- <view class="type-tags" v-for="(tags,index) in item.category" :key="index">
|
|
|
- {{tags}}
|
|
|
+ <view class="type-tags" v-for="(tags, index) in item.category" :key="index">
|
|
|
+ {{ tags }}
|
|
|
</view>
|
|
|
</view>
|
|
|
</view>
|
|
|
</view>
|
|
|
</view>
|
|
|
<zs-loading v-else></zs-loading>
|
|
|
- <zs-empty v-if="dataList&&dataList.length<1&&!searchLoading"></zs-empty>
|
|
|
+ <zs-empty v-if="dataList && dataList.length < 1 && !searchLoading"></zs-empty>
|
|
|
</view>
|
|
|
</template>
|
|
|
|
|
|
<script lang="ts" setup>
|
|
|
- import { ref, onMounted, computed } from 'vue'
|
|
|
- import { onLoad,onReachBottom } from '@dcloudio/uni-app'
|
|
|
- import { http } from '@/utils/http'
|
|
|
- import { useCacheStore } from '@/stores/cache'
|
|
|
- import zsEmpty from '@/components/zs-empty/index.vue'
|
|
|
- import zsLoading from '@/components/zzx-loading/zzx-loading.vue'
|
|
|
- const cache = useCacheStore()
|
|
|
- const navbarList = ref([{
|
|
|
- text: '全部',
|
|
|
- tagsVal:'0-1',
|
|
|
- value:0
|
|
|
- }, {
|
|
|
- text: '学校',
|
|
|
- tagsVal:'1-1',
|
|
|
- value:1
|
|
|
- }, {
|
|
|
- text: '体育馆',
|
|
|
- tagsVal:'2-1',
|
|
|
- value:2
|
|
|
- }]);
|
|
|
- const selectList=ref()
|
|
|
- const sel_index = ref(0);
|
|
|
- const sel_btn=ref(0);
|
|
|
- onMounted(()=>{
|
|
|
- get_dictType(0)
|
|
|
- get_placeList('0-1')
|
|
|
- })
|
|
|
- onReachBottom(()=>{
|
|
|
- current.value++
|
|
|
- get_placeList(tagsVal.value||'0-1')
|
|
|
- })
|
|
|
- const select_btn=(e,i)=>{
|
|
|
- searchLoading.value=true
|
|
|
- sel_btn.value=i
|
|
|
- get_placeList(e.value)
|
|
|
- }
|
|
|
- const select_nav = (e,i) => {
|
|
|
- searchLoading.value=true
|
|
|
- sel_index.value = i
|
|
|
- sel_btn.value=0
|
|
|
- tagsVal.value=e.tagsVal
|
|
|
- current.value=1
|
|
|
- get_dictType(e.value || 0)
|
|
|
- get_placeList(e.tagsVal)
|
|
|
- }
|
|
|
-
|
|
|
- const gotoDetail=(item)=>{
|
|
|
- if(item.type==0){
|
|
|
- uni.navigateTo({
|
|
|
- url:`/pages/index/detail/index?id=${item.id}`
|
|
|
- })
|
|
|
- }else{
|
|
|
- uni.navigateTo({
|
|
|
- url:`/pages/index/gymDetail/index?id=${item.id}`
|
|
|
- })
|
|
|
- }
|
|
|
- }
|
|
|
-
|
|
|
- // 查询分类
|
|
|
- const get_dictType = (type : number) => {
|
|
|
- http.get('/common/getDictItems', { data: { dictCode: 'venue_type' } }).then(res => {
|
|
|
- let arr = []
|
|
|
- res.result.forEach((item) => {
|
|
|
- let value = parseInt(item.value.split('-')[0])
|
|
|
- item.text=item.text.split('-')[1]
|
|
|
- if (type == value){
|
|
|
- return arr.push(item)
|
|
|
- }
|
|
|
- })
|
|
|
- selectList.value=arr
|
|
|
- })
|
|
|
+import { ref, onMounted, computed } from 'vue'
|
|
|
+import { onLoad, onReachBottom } from '@dcloudio/uni-app'
|
|
|
+import { http } from '@/utils/http'
|
|
|
+import { useCacheStore } from '@/stores/cache'
|
|
|
+import zsEmpty from '@/components/zs-empty/index.vue'
|
|
|
+import zsLoading from '@/components/zzx-loading/zzx-loading.vue'
|
|
|
+import { TipsUtils, RouterUtils } from '@/utils/util';
|
|
|
+const cache = useCacheStore()
|
|
|
+const token = computed(() => cache.token)
|
|
|
+const navbarList = ref([{
|
|
|
+ text: '全部',
|
|
|
+ tagsVal: '0-1',
|
|
|
+ value: 0
|
|
|
+}, {
|
|
|
+ text: '学校',
|
|
|
+ tagsVal: '1-1',
|
|
|
+ value: 1
|
|
|
+}, {
|
|
|
+ text: '体育馆',
|
|
|
+ tagsVal: '2-1',
|
|
|
+ value: 2
|
|
|
+}]);
|
|
|
+const selectList = ref()
|
|
|
+const sel_index = ref(0);
|
|
|
+const sel_btn = ref(0);
|
|
|
+onMounted(() => {
|
|
|
+ get_dictType(0)
|
|
|
+ get_placeList('0-1')
|
|
|
+})
|
|
|
+onReachBottom(() => {
|
|
|
+ current.value++
|
|
|
+ get_placeList(tagsVal.value || '0-1')
|
|
|
+})
|
|
|
+const select_btn = (e, i) => {
|
|
|
+ searchLoading.value = true
|
|
|
+ sel_btn.value = i
|
|
|
+ get_placeList(e.value)
|
|
|
+}
|
|
|
+const select_nav = (e, i) => {
|
|
|
+ searchLoading.value = true
|
|
|
+ sel_index.value = i
|
|
|
+ sel_btn.value = 0
|
|
|
+ tagsVal.value = e.tagsVal
|
|
|
+ current.value = 1
|
|
|
+ get_dictType(e.value || 0)
|
|
|
+ get_placeList(e.tagsVal)
|
|
|
+}
|
|
|
+
|
|
|
+const gotoDetail = async (item) => {
|
|
|
+ if (item.type == 0) {
|
|
|
+ RouterUtils.to_page(`/pages/index/detail/index?id=${item.id}`)
|
|
|
+ } else {
|
|
|
+ RouterUtils.to_page(`/pages/index/gymDetail/index?id=${item.id}`)
|
|
|
}
|
|
|
- const dataList=ref()
|
|
|
- const current=ref(1)
|
|
|
- const searchLoading=ref(true)
|
|
|
- const tagsVal=ref()
|
|
|
- const get_placeList=(tagsVal)=>{
|
|
|
- http.post('/home/getPlaceList',{size: 10, current:current.value, venueType:String(tagsVal), longitude: cache.get('LON')||0, latitude: cache.get('LAT')||0}).then((res)=>{
|
|
|
- searchLoading.value=false
|
|
|
- if(current.value==1){
|
|
|
- dataList.value=res.result.records
|
|
|
- }else{
|
|
|
- dataList.value=[...dataList.value,...res.result.records]
|
|
|
+}
|
|
|
+
|
|
|
+// 查询分类
|
|
|
+const get_dictType = (type: number) => {
|
|
|
+ http.get('/common/getDictItems', { data: { dictCode: 'venue_type' } }).then(res => {
|
|
|
+ let arr = []
|
|
|
+ res.result.forEach((item) => {
|
|
|
+ let value = parseInt(item.value.split('-')[0])
|
|
|
+ item.text = item.text.split('-')[1]
|
|
|
+ if (type == value) {
|
|
|
+ return arr.push(item)
|
|
|
}
|
|
|
})
|
|
|
- }
|
|
|
+ selectList.value = arr
|
|
|
+ })
|
|
|
+}
|
|
|
+const dataList = ref()
|
|
|
+const current = ref(1)
|
|
|
+const searchLoading = ref(true)
|
|
|
+const tagsVal = ref()
|
|
|
+const get_placeList = (tagsVal) => {
|
|
|
+ http.post('/home/getPlaceList', { size: 10, current: current.value, venueType: String(tagsVal), longitude: cache.get('LON') || 0, latitude: cache.get('LAT') || 0 }).then((res) => {
|
|
|
+ searchLoading.value = false
|
|
|
+ if (current.value == 1) {
|
|
|
+ dataList.value = res.result.records
|
|
|
+ } else {
|
|
|
+ dataList.value = [...dataList.value, ...res.result.records]
|
|
|
+ }
|
|
|
+ })
|
|
|
+}
|
|
|
</script>
|
|
|
|
|
|
<style lang="less" scoped>
|
|
|
- .venue-navbar {
|
|
|
- box-sizing: border-box;
|
|
|
- padding: 0rpx 20rpx;
|
|
|
- padding-bottom: 30rpx;
|
|
|
- background-color: #FFFFFF;
|
|
|
+.venue-navbar {
|
|
|
+ box-sizing: border-box;
|
|
|
+ padding: 0rpx 20rpx;
|
|
|
+ padding-bottom: 30rpx;
|
|
|
+ background-color: #FFFFFF;
|
|
|
+ display: flex;
|
|
|
+ align-items: center;
|
|
|
+ justify-content: space-around;
|
|
|
+ position: fixed;
|
|
|
+ width: 100%;
|
|
|
+ top: 0;
|
|
|
+ z-index: 1000;
|
|
|
+
|
|
|
+ .navbar-list {
|
|
|
display: flex;
|
|
|
align-items: center;
|
|
|
- justify-content: space-around;
|
|
|
- position: fixed;
|
|
|
- width: 100%;
|
|
|
- top: 0;
|
|
|
- z-index: 1000;
|
|
|
- .navbar-list {
|
|
|
- display: flex;
|
|
|
- align-items: center;
|
|
|
- gap: 10rpx;
|
|
|
+ gap: 10rpx;
|
|
|
|
|
|
- .list-text {
|
|
|
- font-weight: bold;
|
|
|
- font-size: 28rpx;
|
|
|
- color: #222222;
|
|
|
- }
|
|
|
+ .list-text {
|
|
|
+ font-weight: bold;
|
|
|
+ font-size: 28rpx;
|
|
|
+ color: #222222;
|
|
|
+ }
|
|
|
|
|
|
- &>image {
|
|
|
- width: 30rpx;
|
|
|
- height: 30rpx;
|
|
|
- }
|
|
|
+ &>image {
|
|
|
+ width: 30rpx;
|
|
|
+ height: 30rpx;
|
|
|
}
|
|
|
}
|
|
|
-.select-btn{
|
|
|
+}
|
|
|
+
|
|
|
+.select-btn {
|
|
|
display: flex;
|
|
|
align-items: center;
|
|
|
gap: 20rpx;
|
|
|
margin-top: 20rpx;
|
|
|
- .distance{
|
|
|
+
|
|
|
+ .distance {
|
|
|
width: 92rpx;
|
|
|
height: 48rpx;
|
|
|
background: #222222;
|
|
|
border-radius: 8rpx;
|
|
|
font-size: 28rpx;
|
|
|
color: #C8FF0C;
|
|
|
- line-height:48rpx;
|
|
|
+ line-height: 48rpx;
|
|
|
text-align: center;
|
|
|
}
|
|
|
- .score{
|
|
|
+
|
|
|
+ .score {
|
|
|
width: 92rpx;
|
|
|
height: 48rpx;
|
|
|
background: #FFFFFF;
|
|
|
@@ -188,96 +191,99 @@
|
|
|
font-size: 28rpx;
|
|
|
color: #AAAAAA;
|
|
|
height: 48rpx;
|
|
|
- line-height:48rpx;
|
|
|
+ line-height: 48rpx;
|
|
|
text-align: center;
|
|
|
}
|
|
|
}
|
|
|
- .venue-card {
|
|
|
- margin-top: 20rpx;
|
|
|
- background: #FFFFFF;
|
|
|
- border-radius: 32rpx;
|
|
|
- padding: 20rpx;
|
|
|
- display: flex;
|
|
|
- align-items: center;
|
|
|
- gap: 20rpx;
|
|
|
|
|
|
- .venues-image {
|
|
|
- position: relative;
|
|
|
+.venue-card {
|
|
|
+ margin-top: 20rpx;
|
|
|
+ background: #FFFFFF;
|
|
|
+ border-radius: 32rpx;
|
|
|
+ padding: 20rpx;
|
|
|
+ display: flex;
|
|
|
+ align-items: center;
|
|
|
+ gap: 20rpx;
|
|
|
+
|
|
|
+ .venues-image {
|
|
|
+ position: relative;
|
|
|
+
|
|
|
+ &>image {
|
|
|
+ width: 200rpx;
|
|
|
+ height: 200rpx;
|
|
|
+ border-radius: 32rpx;
|
|
|
+ }
|
|
|
+
|
|
|
+ .e-badge {
|
|
|
+ position: absolute;
|
|
|
+ top: -4rpx;
|
|
|
+ left: -20rpx;
|
|
|
|
|
|
&>image {
|
|
|
- width: 200rpx;
|
|
|
- height: 200rpx;
|
|
|
- border-radius: 32rpx;
|
|
|
+ width: 114rpx;
|
|
|
}
|
|
|
|
|
|
- .e-badge {
|
|
|
- position: absolute;
|
|
|
- top: -4rpx;
|
|
|
- left: -20rpx;
|
|
|
- &>image {
|
|
|
- width: 114rpx;
|
|
|
- }
|
|
|
+ .text {
|
|
|
+ position: absolute;
|
|
|
+ top: 14rpx;
|
|
|
+ left: 20rpx;
|
|
|
+ font-size: 20rpx;
|
|
|
+ color: #222222;
|
|
|
+ }
|
|
|
+ }
|
|
|
+ }
|
|
|
|
|
|
- .text {
|
|
|
- position: absolute;
|
|
|
- top: 14rpx;
|
|
|
- left: 20rpx;
|
|
|
- font-size: 20rpx;
|
|
|
- color: #222222;
|
|
|
- }
|
|
|
- }
|
|
|
+ .venues-info {
|
|
|
+ .venues-name {
|
|
|
+ font-weight: 800;
|
|
|
+ font-size: 32rpx;
|
|
|
+ color: #222222;
|
|
|
}
|
|
|
|
|
|
- .venues-info {
|
|
|
- .venues-name {
|
|
|
- font-weight: 800;
|
|
|
- font-size: 32rpx;
|
|
|
- color: #222222;
|
|
|
- }
|
|
|
+ .venues-comments {
|
|
|
+ margin-top: 16rpx;
|
|
|
+ display: flex;
|
|
|
+ align-items: center;
|
|
|
+ gap: 10px;
|
|
|
|
|
|
- .venues-comments {
|
|
|
- margin-top: 16rpx;
|
|
|
+ .star {
|
|
|
display: flex;
|
|
|
align-items: center;
|
|
|
- gap: 10px;
|
|
|
-
|
|
|
- .star {
|
|
|
- display: flex;
|
|
|
- align-items: center;
|
|
|
- gap: 8rpx;
|
|
|
- font-size: 24rpx;
|
|
|
- color: rgb(253, 209, 67);
|
|
|
- }
|
|
|
-
|
|
|
- .comment {
|
|
|
- font-size: 24rpx;
|
|
|
- color: #AAAAAA;
|
|
|
- }
|
|
|
+ gap: 8rpx;
|
|
|
+ font-size: 24rpx;
|
|
|
+ color: rgb(253, 209, 67);
|
|
|
}
|
|
|
|
|
|
- .venues-address {
|
|
|
- margin-top: 16rpx;
|
|
|
+ .comment {
|
|
|
font-size: 24rpx;
|
|
|
- color: #222222;
|
|
|
+ color: #AAAAAA;
|
|
|
}
|
|
|
+ }
|
|
|
|
|
|
- .venues-type {
|
|
|
- display: flex;
|
|
|
- align-items: center;
|
|
|
- gap: 10rpx;
|
|
|
- margin-top: 16rpx;
|
|
|
- flex-wrap: wrap;
|
|
|
- .type-tags {
|
|
|
- width: 92rpx;
|
|
|
- height: 36rpx;
|
|
|
- background: #F5F5F5;
|
|
|
- border-radius: 8rpx;
|
|
|
- font-size: 22rpx;
|
|
|
- color: #AAAAAA;
|
|
|
- text-align: center;
|
|
|
- line-height: 36rpx;
|
|
|
- }
|
|
|
+ .venues-address {
|
|
|
+ margin-top: 16rpx;
|
|
|
+ font-size: 24rpx;
|
|
|
+ color: #222222;
|
|
|
+ }
|
|
|
+
|
|
|
+ .venues-type {
|
|
|
+ display: flex;
|
|
|
+ align-items: center;
|
|
|
+ gap: 10rpx;
|
|
|
+ margin-top: 16rpx;
|
|
|
+ flex-wrap: wrap;
|
|
|
+
|
|
|
+ .type-tags {
|
|
|
+ width: 92rpx;
|
|
|
+ height: 36rpx;
|
|
|
+ background: #F5F5F5;
|
|
|
+ border-radius: 8rpx;
|
|
|
+ font-size: 22rpx;
|
|
|
+ color: #AAAAAA;
|
|
|
+ text-align: center;
|
|
|
+ line-height: 36rpx;
|
|
|
}
|
|
|
}
|
|
|
}
|
|
|
+}
|
|
|
</style>
|
学习？学个屁