diff --git a/newPages/schoolDetail/assets/style/index.rpx.scss b/newPages/schoolDetail/assets/style/index.rpx.scss index f143bea..eafbe26 100644 --- a/newPages/schoolDetail/assets/style/index.rpx.scss +++ b/newPages/schoolDetail/assets/style/index.rpx.scss @@ -146,12 +146,12 @@ text-align: left; white-space: normal; line-height: 40rpx; - margin: 30rpx 0 0 32rpx; + margin: 10rpx 0 0 32rpx; } .text-wrapper_1 { width: 220rpx; height: 24rpx; - margin: 15rpx 0 0 32rpx; + margin: 30rpx 0 0 32rpx; .text_4 { /* width: 72rpx; height: 24rpx; */ @@ -166,7 +166,7 @@ line-height: 24rpx; } .text_5 { - width: 138rpx; + width: 200rpx; height: 24rpx; overflow-wrap: break-word; color: rgba(51, 51, 51, 1); @@ -182,9 +182,8 @@ .block_2 { width: 686rpx; height: 120rpx; - background: url(/static/lanhu_jiaxiaoxiangqing/FigmaDDSSlicePNG1eb894220f6795fd386c751f181ce5e4.png) - 100% no-repeat; - background-size: 100% 100%; + background-color: #000000; + // background-size: 100% 100%; margin: 30rpx 0 30rpx 32rpx; .text-group_1 { width: 522rpx; diff --git a/newPages/schoolDetail/index.vue b/newPages/schoolDetail/index.vue index 48444b8..9e479e4 100644 --- a/newPages/schoolDetail/index.vue +++ b/newPages/schoolDetail/index.vue @@ -12,16 +12,33 @@ {{ schoolInfo.corpName }} - 地址：{{ schoolInfo.address }} - + + + + + + + + {{ schoolInfo.address }} + + 距离 {{ distance }} + + 获取距离 + + + + + + + @@ -114,6 +131,17 @@ schoolAllClassList: [], schoolCoachList: [], + latitude: 0, // 地图中心纬度 + longitude: 0, // 地图中心经度 + scale: 16, // 地图缩放级别 + markers: [], // 地图标记点 + + distance: '0.0', // 初始距离 + + showDistance: true, // 控制是否显示距离 + locationPermissionDenied: false // 记录用户是否拒绝了位置权限 + + }; }, async onShow() { @@ -132,6 +160,19 @@ this.getSchoolCoach() }, methods: { + + bookingInfoClick(lat, lgt, name, address) { + // 进行导航 + uni.openLocation({ + latitude: lat, + longitude: lgt, + name: name, + address: address, + success: function() { + console.log('success'); + } + }); + }, handleBack() { uni.navigateBack({ delta: 1 @@ -152,18 +193,74 @@ console.error('获取驾校详情失败', err); }); }, - getSchoolInfo() { - request({ - url: '/userClient/base/companySmallProgram/getCompanyByTenantId', - method: 'GET', - params: { - tenantId: this.tenantId, - systemCode: 'jiaxiao', + /* async getSchoolInfo() { + try { + const res = await request({ + url: '/userClient/base/companySmallProgram/getCompanyByTenantId', + method: 'GET', + params: { + tenantId: this.tenantId, + systemCode: 'jiaxiao', + } + }); + + this.schoolInfo = res.data; + + // 获取用户位置并计算距离 + const userLocation = await this.getLocation(); + if (userLocation.lat && userLocation.lng && this.schoolInfo.lat && this.schoolInfo.lgt) { + const distance = this.calculateDistance({ + latitude: userLocation.lat, + longitude: userLocation.lng + }, { + latitude: parseFloat(this.schoolInfo.lat), + longitude: parseFloat(this.schoolInfo.lgt) + }); + this.distance = distance; // 保存距离到data中 } - }).then(res => { - this.schoolInfo = res.data - }) + } catch (error) { + console.error('获取驾校信息失败', error); + } + }, */ + + async getSchoolInfo() { + try { + const res = await request({ + url: '/userClient/base/companySmallProgram/getCompanyByTenantId', + method: 'GET', + params: { + tenantId: this.tenantId, + systemCode: 'jiaxiao', + } + }); + + this.schoolInfo = res.data; + + // 获取用户位置并计算距离 + try { + const userLocation = await this.getLocation(); + if (userLocation.lat && userLocation.lng && this.schoolInfo.lat && this.schoolInfo.lgt) { + const distance = this.calculateDistance({ + latitude: userLocation.lat, + longitude: userLocation.lng + }, { + latitude: parseFloat(this.schoolInfo.lat), + longitude: parseFloat(this.schoolInfo.lgt) + }); + this.distance = distance; + this.showDistance = true; + this.locationPermissionDenied = false; + } + } catch (error) { + console.error('获取位置失败', error); + this.showDistance = false; + this.locationPermissionDenied = true; + } + } catch (error) { + console.error('获取驾校信息失败', error); + } }, + getSchoolClass() { request({ url: '/app-api/dl-drive-school-course-small/noTenantIdPage', @@ -181,25 +278,29 @@ }, //获取当前位置 getLocation() { - let location = { - lat: 0, - lng: 0, - } - return new Promise((reserve, reject) => { //因为获取位置是异步接口所以需要使用promise + return new Promise((resolve, reject) => { uni.getLocation({ - success(res) { - console.log('成功') - location.lat = res.latitude - location.lng = res.longitude, - reserve(location); + type: 'gcj02', + success: (res) => { + resolve({ + lat: res.latitude, + lng: res.longitude + }); }, - fail(err) { - console.log('失败', err) - reject(location); //获取失败则返回经纬坐标为0 + fail: (err) => { + console.error('获取位置失败', err); + // 用户拒绝了位置授权 + if (err.errMsg.includes('auth deny') || err.errMsg.includes( + 'fail auth deny')) { + this.showDistance = false; + this.locationPermissionDenied = true; + } + reject(err); } - }) - }) + }); + }); }, + // 计算两点间距离（单位：米） calculateDistance(loc1, loc2) { const { @@ -211,13 +312,15 @@ longitude: lng2 } = loc2; + // 将经纬度转换为弧度 const rad = (d) => d * Math.PI / 180.0; const radLat1 = rad(lat1); const radLat2 = rad(lat2); const a = radLat1 - radLat2; const b = rad(lng1) - rad(lng2); - const distance = 2 * Math.asin(Math.sqrt( + // 使用Haversine公式计算距离 + const s = 2 * Math.asin(Math.sqrt( Math.pow(Math.sin(a / 2), 2) + Math.cos(radLat1) * Math.cos(radLat2) * @@ -225,11 +328,16 @@ )); const EARTH_RADIUS = 6378.137; // 地球半径（千米） - // 修改计算结果（原米制 → 公里制） - const result = (distance * EARTH_RADIUS).toFixed(2); // 直接得到公里，保留2位小数 - console.log('距离:', result + 'km'); - return result; + const distance = s * EARTH_RADIUS; + + // 小于1公里显示米，大于等于1公里显示千米 + if (distance < 1) { + return (distance * 1000).toFixed(0) + '米'; + } else { + return distance.toFixed(2) + '公里'; + } }, + wxGeocoder(address) { return new Promise((resolve, reject) => { // 需要先通过chooseLocation获取坐标（用户交互触发） @@ -309,10 +417,142 @@ }); }, + // 请求位置权限 + requestLocationPermission() { + uni.showModal({ + title: '提示', + content: '需要获取您的位置信息才能计算距离，是否前往设置开启权限？', + success: (res) => { + if (res.confirm) { + // 打开设置页面 + uni.openSetting({ + success: (res) => { + if (res.authSetting['scope.userLocation']) { + // 用户授权了位置权限，重新获取位置 + this.getSchoolInfo(); + } + } + }); + } + } + }); + }, + + // 初始化地图 + /* initMap() { + // 假设驾校地址的经纬度已经获取或通过接口返回 + if (this.schoolInfo.lat && this.schoolInfo.lgt) { + this.latitude = parseFloat(this.schoolInfo.lat); + this.longitude = parseFloat(this.schoolInfo.lgt); + + this.markers = [{ + id: 1, + latitude: this.latitude, + longitude: this.longitude, + title: this.schoolInfo.corpName, + iconPath: '/static/location.png', // 自定义标记图标 + width: 30, + height: 30 + }]; + } + }, */ + + + + + // 点击地图事件 + /* handleMapTap() { + // 打开地图APP或导航 + uni.openLocation({ + latitude: this.latitude, + longitude: this.longitude, + name: this.schoolInfo.corpName, + address: this.schoolInfo.address + }); + }, */ + } }; \ No newline at end of file diff --git a/pagesA/information/index.vue b/pagesA/information/index.vue index 18afa7c..67ff5b6 100644 --- a/pagesA/information/index.vue +++ b/pagesA/information/index.vue @@ -1,15 +1,15 @@ + @import '../common/common.scss'; + @import './assets/style/index.rpx.scss'; + \ No newline at end of file diff --git a/static/imgs/mapBackground.png b/static/imgs/mapBackground.png new file mode 100644 index 0000000..f49b00e Binary files /dev/null and b/static/imgs/mapBackground.png differ