From 49fa0d82a40345342966e810b44429aec0480ef3 Mon Sep 17 00:00:00 2001
From: web <candymxq888@outlook.com>
Date: 星期二, 01 七月 2025 17:00:18 +0800
Subject: [PATCH] fix:修改.gitgnore文件，移除打包文件
---
pages/facilityList/index.vue | 79 ++++++++++++++++++++++-----------------
1 files changed, 45 insertions(+), 34 deletions(-)
diff --git a/pages/facilityList/index.vue b/pages/facilityList/index.vue
index 7f39c05..0b0c6f8 100644
--- a/pages/facilityList/index.vue
+++ b/pages/facilityList/index.vue
@@ -6,14 +6,15 @@
<block v-for="(item,index) in deviceList" :key="index">
<view class="item">
<view class="item-img">
- <image src="../../static/logo.png" alt=''></image>
+ <image v-if="item.url" :src="baseUrl + '/upload' + item.url" alt='' mode="aspectFit"></image>
+ <image v-else src="../../static/images/station/facilityImg.svg" alt='' mode="aspectFit"></image>
</view>
<view class="item-info">
<view class="info-name">{{item.facilityName}}</view>
- <view class="info-addr">
+ <view class="info-addr" @click="openMap(item.lat,item.lon)">
<text class="addr-text">地址：{{item.address}}</text>
<view>
- <image src="../../static/images/index/icon22.png" alt=''></image>
+ <image src="../../static/images/index/icon22.svg" alt=''></image>
<text>{{item.distance}}km</text>
</view>
</view>
@@ -28,47 +29,57 @@
<script setup>
import { onMounted, ref } from 'vue'
import { searchFacilityApi } from '../../api/index.js'
- const deviceList = ref([
- {facilityName:'清源直饮水',address:'重庆市北碚区蔡家岗街道工业互联网产业园',distance:'30.12'},
- {facilityName:'清源直饮水',address:'重庆市北碚区蔡家岗街道',distance:'30.12'},
- {facilityName:'清源直饮水',address:'重庆市北碚区蔡家岗街道',distance:'30.12'},
- ])
- const latitudeUser = ref()
- const longitudeUser = ref()
- // 根据经纬度计算距离,根据经纬度计算距离，参数分别为第一点的纬度，经度；第二点的纬度，经度
- function getDistances(lat1, lng1, lat2, lng2) {
+ import { BASE_URL } from '../../config/baseUrl.js'
+
+ const baseUrl = ref(BASE_URL)
+ const deviceList = ref([])
+ const userLocation = ref()
+ //获取设备信息
+ async function getFacilityList(){
+ await searchFacilityApi({limit:20,page:1}).then((res1) =>{
+ if(res1.code == 200){
+ deviceList.value = []
+ res1.data.list.forEach((item) =>{
+ //计算用户与饮水设备距离
+ let preDistance = getDistances(userLocation.value.lat,userLocation.value.lon,item.latitude,item.longitude)
+ deviceList.value.push({
+ facilityName:item.facilityName,
+ address:item.address,
+ distance:preDistance.km,
+ lat:item.latitude,
+ lon:item.longitude,
+ url:item.facilityUrl
+ })
+ })
+ console.log('deviceList.value',deviceList.value)
+ }
+ })
+ }
+ // 根据经纬度计算距离,根据经纬度计算距离，参数分别为第一点的纬度，经度（用户）；第二点的纬度，经度(设备)
+ function getDistances(lat1, lon1, lat2, lon2) {
let EARTH_RADIUS = 6378.137;// 地球半径
let radLat1 = lat1 * Math.PI / 180.0; //lat1 * Math.PI / 180.0=>弧度计算
let radLat2 = lat2 * Math.PI / 180.0;
let a = radLat1 - radLat2;
- let b = lng1 * Math.PI / 180.0 - lng2 * Math.PI / 180.0;
+ let b = lon1 * Math.PI / 180.0 - lon2 * Math.PI / 180.0;
let s = 2 * Math.asin(Math.sqrt(Math.pow(Math.sin(a / 2), 2) + Math.cos(radLat1) * Math.cos(radLat2) * Math.pow(Math.sin(b / 2), 2)));
s = s * EARTH_RADIUS;
s = Math.round(s * 10000) / 10000;// 输出为公里
return { m: s * 1000, km: Number(s.toFixed(2)) }
}
- onMounted(async() =>{
- uni.getLocation({type: 'gcj02'}).then(async(res) =>{
- console.log('位置',res)
- latitudeUser.value = res.latitude
- longitudeUser.value = res.longitude
-
- await searchFacilityApi({limit:20,page:1}).then((res) =>{
- if(res.code == 200){
- // deviceList.value = []
- res.data.list.forEach((item) =>{
-
- let preDistance = getDistances(latitudeUser.value,106.4003121,item.latitude,item.longitude)
- deviceList.value.push({
- facilityName:item.facilityName,
- address:item.address,
- distance:preDistance.km
- })
- })
- console.log('deviceList.value',deviceList.value)
- }
- })
+ //打开地图导航
+ function openMap(lat,lon){
+ console.log('lat:',parseFloat(lat),'lon:',parseFloat(lon))
+ uni.openLocation({
+ latitude: parseFloat(lat),
+ longitude: parseFloat(lon),
+ scale:18
})
+ }
+ onMounted(async() =>{
+ userLocation.value = JSON.parse(uni.getStorageSync('userLocation'))
+ console.log('storage',userLocation.value)
+ await getFacilityList()
})
</script>
--
Gitblit v1.9.3