chuangte/bike
5
2
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

11

Browse Source
This commit is contained in:
tx 2024-08-29 09:52:00 +08:00
parent 1627996c8a
commit d47f9ecfe9
4 changed files with 267 additions and 203 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

6
common/http.interceptor.js
View File

@ -1,15 +1,15 @@
const install = (Vue, vm) => { const install = (Vue, vm) => {
uni.setStorageSync('deptId', 101); uni.setStorageSync('deptId', 100);
Vue.prototype.$u.http.setConfig({ Vue.prototype.$u.http.setConfig({
// baseUrl: 'http://61.174.243.28:15861', // baseUrl: 'http://61.174.243.28:15861',
// baseUrl: 'http://192.168.2.46:8080', // baseUrl: 'http://192.168.2.46:8080',
// baseUrl: 'https://che.chuangtewl.com/prod-api', // baseUrl: 'https://che.chuangtewl.com/prod-api',
// 测试环境 // 测试环境
baseUrl: 'https://dianche.chuantewulian.cn/prod-api', // baseUrl: 'https://dianche.chuantewulian.cn/prod-api',
// 俞山岛 // 俞山岛
// baseUrl: 'https://dche.ccttiot.com/prod-api', baseUrl: 'https://dche.ccttiot.com/prod-api',
// 创特 // 创特
loadingText: '努力加载中~', loadingText: '努力加载中~',
loadingTime: 10000, loadingTime: 10000,

2
manifest.json
View File

@ -51,7 +51,7 @@
/* 小程序特有相关 */ /* 小程序特有相关 */
"mp-weixin" : { "mp-weixin" : {
"libVersion" : "latest", "libVersion" : "latest",
"appid" : "wx4d178f8c80348214", "appid" : "wx3428c498d5061192",
"setting" : { "setting" : {
"urlCheck" : false, "urlCheck" : false,
"minified" : true "minified" : true

2
page_user/changeCar.vue
View File

@ -777,7 +777,7 @@
if (res.code == 200) { if (res.code == 200) {
if(this.orderinfo.areaId==res.data.areaId){ if(this.orderinfo.areaId==res.data.areaId){
this.deviceinfo = res.data this.deviceinfo = res.data
this.deviceinfo.onlineStatus=0 // this.deviceinfo.onlineStatus=0
}else{ }else{
uni.showToast({ uni.showToast({
title: '换车设备和当前运营区不同，请使用其他车辆换车', title: '换车设备和当前运营区不同，请使用其他车辆换车',

460
pages_admin/admin_index.vue
View File

@ -12,14 +12,19 @@
<view style="width: 650rpx;margin: 0 auto;"> <view style="width: 650rpx;margin: 0 auto;">
<slider-range :value="rangeValue" :min="rangeMin" :max="rangMax" :step="1" :bar-height="3" <slider-range :value="rangeValue" :min="rangeMin" :max="rangMax" :step="1" :bar-height="3"
:block-size="20" background-color="#EEEEF6" active-color="#4C97E7" :format="format" :block-size="20" background-color="#EEEEF6" active-color="#4C97E7" :format="format"
:decorationVisible="true" @change="handleRangeChange" @regionchange="onMapRegionChange"></slider-range> :decorationVisible="true" @change="handleRangeChange"
@regionchange="onMapRegionChange"></slider-range>
</view> </view>
</view> </view>
</view> </view>
<map class="map" id="map" ref="map" :scale="zoomSize" :latitude="latitude" :longitude="longitude" :circles="circles" <map class="map" id="map" ref="map" :scale="zoomSize" :latitude="latitude" :longitude="longitude"
:show-location="true" :markers="markers" :polygons="polyline" @markertap="onMarkerTap" @regionchange="onMapRegionChange"> :circles="circles" :show-location="true" :markers="markers" :polygons="polyline" @markertap="onMarkerTap"
@regionchange="onMapRegionChange">
<view class="center-marker">
<image src="/static/center-point.png" style="width: 30px; height: 30px;" />
</view>
</map> </map>
<view class="park" @click="toggleIconAndCallout"> <view class="park" @click="toggleIconAndCallout">
<image src="https://lxnapi.ccttiot.com/bike/img/static/uRiYQZQEb3l2LsltEsyW" mode=""></image> <image src="https://lxnapi.ccttiot.com/bike/img/static/uRiYQZQEb3l2LsltEsyW" mode=""></image>
@ -27,7 +32,7 @@
<view class="park" @click="showdevList=!showdevList" style="bottom: 600rpx;"> <view class="park" @click="showdevList=!showdevList" style="bottom: 600rpx;">
<image src=" https://lxnapi.ccttiot.com/bike/img/static/uSMkyrHwO1sybH8diPuF" mode=""></image> <image src=" https://lxnapi.ccttiot.com/bike/img/static/uSMkyrHwO1sybH8diPuF" mode=""></image>
</view> </view>
<view @touchmove.stop.prevent="() => {}"> <view @touchmove.stop.prevent="() => {}">
<view class="btn_box"> <view class="btn_box">
<view class="btn1" @click="qecodelock()"> <view class="btn1" @click="qecodelock()">
@ -38,7 +43,7 @@
</view> </view>
</view> </view>
<view class="decice_cont"> <view class="decice_cont">
<!-- <view class="cont" @click="changeidx(0)"> <!-- <view class="cont" @click="changeidx(0)">
<view class="text" :class="statusidx==0?'act1':''"> <view class="text" :class="statusidx==0?'act1':''">
未上架 未上架
@ -47,14 +52,14 @@
1 1
</view> </view>
</view> --> </view> -->
<view class="cont" @click="changeidx('-0')"> <view class="cont" @click="changeidx('-0')">
<view class="text" :class="statusidx=='-0'?'act1':''"> <view class="text" :class="statusidx=='-0'?'act1':''">
投放中 投放中
</view>
<view class="text" :class="statusidx=='-0'?'act1':''">
{{deviceNum.inOperation}}
</view>
</view> </view>
<view class="text" :class="statusidx=='-0'?'act1':''">
{{deviceNum.inOperation}}
</view>
</view>
<view class="cont" @click="changeidx('1')"> <view class="cont" @click="changeidx('1')">
<view class="text" :class="statusidx==1?'act1':''"> <view class="text" :class="statusidx==1?'act1':''">
待租 待租
@ -140,26 +145,29 @@
<view class="fixdivce" v-if="nearbyMarkers.length>1&&showdevList"> <view class="fixdivce" v-if="nearbyMarkers.length>1&&showdevList">
<view class="scrollable-content"> <view class="scrollable-content">
<view class="divce_li" v-for="(item,index) in nearbyMarkers" :key="index" @click="tapsn(item.sn)"> <view class="divce_li" v-for="(item,index) in nearbyMarkers" :key="index" @click="tapsn(item.sn)">
<!-- <view class="left_img"> <!-- <view class="left_img">
<image src="https://lxnapi.ccttiot.com/bike/img/static/uEW2Zm3sO8E5eqOf2wwl" mode=""></image> <image src="https://lxnapi.ccttiot.com/bike/img/static/uEW2Zm3sO8E5eqOf2wwl" mode=""></image>
</view> --> </view> -->
<view class="right_cont"> <view class="right_cont">
<view class="right_top"> <view class="right_top">
<view class="right_top_right"> <view class="right_top_right">
牌:{{item.vehicleNum}} 牌:{{item.vehicleNum}}
</view> </view>
<view class="right_top_left"> <view class="right_top_left">
<image src=" https://lxnapi.ccttiot.com/bike/img/static/u9pggdTCxcZgUTNsEvXQ" mode="" v-if="item.remainingPower<=39" ></image> <image src=" https://lxnapi.ccttiot.com/bike/img/static/u9pggdTCxcZgUTNsEvXQ" mode=""
<image src="https://lxnapi.ccttiot.com/bike/img/static/uu1004113wsUShxo11X9" mode="" v-if="item.remainingPower>=40&&item.remainingPower<=69"></image> v-if="item.remainingPower<=39"></image>
<image src="https://lxnapi.ccttiot.com/bike/img/static/uRI1LMpzqfIM060BO7np" mode="" v-if="item.remainingPower>=70&&item.remainingPower<=100"></image> <image src="https://lxnapi.ccttiot.com/bike/img/static/uu1004113wsUShxo11X9" mode=""
v-if="item.remainingPower>=40&&item.remainingPower<=69"></image>
<image src="https://lxnapi.ccttiot.com/bike/img/static/uRI1LMpzqfIM060BO7np" mode=""
v-if="item.remainingPower>=70&&item.remainingPower<=100"></image>
{{item.remainingPower}}% {{item.remainingPower}}%
</view> </view>
</view> </view>
<view class="right_bot"> <view class="right_bot">
SN:{{item.sn}} SN:{{item.sn}}
<span >{{status(item)}}</span> <span>{{status(item)}}</span>
</view> </view>
</view> </view>
</view> </view>
@ -172,6 +180,7 @@
<script> <script>
import SliderRange from '@/pages_admin/components/primewind-sliderrange/index.vue' import SliderRange from '@/pages_admin/components/primewind-sliderrange/index.vue'
let timerId; let timerId;
var appMap = null;
export default { export default {
data() { data() {
return { return {
@ -201,17 +210,17 @@
status9: [], //离线 status9: [], //离线
markdata: { markdata: {
}, },
statusidx: '-0', statusidx: '-0',
deviceNum: {}, deviceNum: {},
areaId: 0, areaId: 0,
showIconAndCallout: false, showIconAndCallout: false,
nearbyMarkers: [], nearbyMarkers: [],
showdevList:false, showdevList: false,
circles: [], // 用于存储圆形区域的数据 circles: [], // 用于存储圆形区域的数据
} }
}, },
@ -226,7 +235,7 @@
// this.getareaid() // this.getareaid()
this.getmarks() this.getmarks()
this.allVehicleNum() this.allVehicleNum()
@ -237,9 +246,10 @@
if (uni.getStorageSync('adminAreaid')) { if (uni.getStorageSync('adminAreaid')) {
this.areaId = uni.getStorageSync('adminAreaid') this.areaId = uni.getStorageSync('adminAreaid')
this.getArea() this.getArea()
} }
appMap = uni.createMapContext("map", this).$getAppMap();
appMap.showUserLocation(true);
let that = this let that = this
uni.getLocation({ uni.getLocation({
type: 'wgs84', type: 'wgs84',
@ -292,19 +302,13 @@
return '禁用中' return '禁用中'
} }
}, },
onMapRegionChange(event) {
// console.log('regionchange', event)
// console.log('当前地图缩放级别：', event.detail.scale);
if (event.detail.type == 'end'&&event.detail.scale>17) {
this.getCenterLanLat()
}
// 你可以在这里执行你需要的操作
},
onMapRegionChange(event) { onMapRegionChange(event) {
// console.log('regionchange', event) // console.log('regionchange', event)
if (event.detail.type == 'end') { if (event.detail.type == 'end') {
this.getCenterLanLat() this.getCenterLocation()
// this.getCenter()
} }
// 你可以在这里执行你需要的操作 // 你可以在这里执行你需要的操作
}, },
@ -316,47 +320,95 @@
// console.log("当前地图中心的经纬度", res) // console.log("当前地图中心的经纬度", res)
// that.deviceGps.latitude = res.latitude; // that.deviceGps.latitude = res.latitude;
// that.deviceGps.longitude = res.longitude; // that.deviceGps.longitude = res.longitude;
this.getNearbyMarkers(res.latitude, res.longitude);
//其他逻辑 //其他逻辑
}, },
fail: (err) => {} fail: (err) => {}
}) })
}, },
getCenterLocation() {
const mapContext = uni.createMapContext('map');
mapContext.getCenterLocation({
success: (res) => {
console.log('中心点的经纬度：', res.longitude, res.latitude);
this.getNearbyMarkers(res.latitude, res.longitude);
},
fail: (err) => {
console.error('获取中心点定位失败：', err);
}
});
},
getCenter: function() {
var _that = this;
appMap.getCurrentCenter(
function(state, point) {
if (0 == state) {
// 反编码
var point = new plus.maps.Point(point["longitude"], point["latitude"]);
plus.maps.Map.reverseGeocode(point, {}, function(event) {
var address = event.address; // 转换后的地理位置
var coord = event.coord; // 转换后的坐标信息
var coordType = event.coordType; // 转换后的坐标系类型
console.log("Address:" + address);
console.log("coord", coord);
uni.showModal({
title: "提示",
content: "确定:" + address + "?",
success: function(res) {
if (res.confirm) {
// 业务逻辑...
} else if (res.cancel) {}
}
})
}, function(e) {
// console.log("Failed:" + JSON.stringify(e));
uni.showToast({
title: '反编码失败' + JSON.stringify(e)
});
});
} else {
uni.showToast({
icon: "none",
title: "获取经纬度失败!" + state
})
}
}
);
},
getNearbyMarkers(clickedLat, clickedLon) { getNearbyMarkers(clickedLat, clickedLon) {
console.log(clickedLat, clickedLon); // console.log(clickedLat, clickedLon);
// 只有在 showdevList 为 true 的时候才显示圆形区域 // 只有在 showdevList 为 true 的时候才显示圆形区域
if (this.showdevList) { if (this.showdevList) {
const nearbyMarkers = this.listData.filter(item => { const nearbyMarkers = this.listData.filter(item => {
if (item.latitude && item.longitude) { if (item.latitude && item.longitude) {
const distance = this.haversineDistance( const distance = this.haversineDistance(
parseFloat(clickedLat), parseFloat(clickedLat),
parseFloat(clickedLon), parseFloat(clickedLon),
parseFloat(item.latitude), parseFloat(item.latitude),
parseFloat(item.longitude) parseFloat(item.longitude)
); );
return distance <= 100; return distance <= 100;
} }
return false; return false;
}); });
// 更新 circles 数组来绘制淡灰色的圆形区域 // 更新 circles 数组来绘制淡灰色的圆形区域
this.circles = [{ this.circles = [{
latitude: clickedLat, latitude: clickedLat,
longitude: clickedLon, longitude: clickedLon,
color: '#fff', // 圆形边框颜色（淡灰色） color: '#fff', // 圆形边框颜色（淡灰色）
fillColor: '#00000010', // 圆形填充颜色（淡灰色） fillColor: '#00000010', // 圆形填充颜色（淡灰色）
radius: 100, // 圆的半径（单位：米） radius: 100, // 圆的半径（单位：米）
strokeWidth: 1 strokeWidth: 1
}]; }];
this.nearbyMarkers = nearbyMarkers; this.nearbyMarkers = nearbyMarkers;
console.log('Nearby markers within 100 meters:', nearbyMarkers); // console.log('Nearby markers within 100 meters:', nearbyMarkers);
} else { } else {
// 当 showdevList 为 false 时，清空 circles 数组 // 当 showdevList 为 false 时，清空 circles 数组
this.circles = []; this.circles = [];
} }
}, },
haversineDistance(lat1, lon1, lat2, lon2) { haversineDistance(lat1, lon1, lat2, lon2) {
const R = 6371e3; // Earth radius in meters const R = 6371e3; // Earth radius in meters
@ -406,7 +458,7 @@
}, },
}) })
}, },
tapsn(sn){ tapsn(sn) {
uni.navigateTo({ uni.navigateTo({
url: '/pages_admin/order/device_detail?id=' + sn url: '/pages_admin/order/device_detail?id=' + sn
}) })
@ -432,22 +484,23 @@
this.sn = sn this.sn = sn
if (this.sn != '') { if (this.sn != '') {
this.$u.get('/app/device/info?sn=' + this.sn).then((res) => { this.$u.get('/app/device/info?sn=' + this.sn).then((res) => {
console.log(res,'rererer'); console.log(res, 'rererer');
if (res.code === 200) { if (res.code === 200) {
// console.log(this.areaId,); // console.log(this.areaId,);
if(res.data.areaId==this.areaId){ if (res.data.areaId == this.areaId) {
uni.navigateTo({ uni.navigateTo({
url: '/pages_admin/order/device_detail?id=' + this.sn url: '/pages_admin/order/device_detail?id=' + this
.sn
}) })
}else{ } else {
uni.showToast({ uni.showToast({
title: '无效车辆', title: '无效车辆',
icon: 'none', icon: 'none',
duration: 2000 duration: 2000
}); });
} }
}else{ } else {
uni.showToast({ uni.showToast({
title: res.msg, title: res.msg,
icon: 'none', icon: 'none',
@ -455,7 +508,7 @@
}); });
} }
}) })
} }
}, },
@ -526,7 +579,7 @@
} }
}, },
todetail() { todetail() {
for (let item of this.fixdata) { for (let item of this.fixdata) {
if (item.sn == this.sn) { if (item.sn == this.sn) {
@ -560,11 +613,11 @@
// this.areaInfo = res.data // this.areaInfo = res.data
const polylines = this.convertBoundaryToPolyline(res.data.boundaryStr) const polylines = this.convertBoundaryToPolyline(res.data.boundaryStr)
this.polyline.push(polylines) this.polyline.push(polylines)
setTimeout(()=>{ setTimeout(() => {
this.getParking() this.getParking()
},500) }, 500)
} else { } else {
uni.showToast({ uni.showToast({
title: res.msg, title: res.msg,
@ -633,9 +686,9 @@
width: 20, width: 20,
height: 23, height: 23,
// iconPath: 'https://lxnapi.ccttiot.com/bike/img/static/u6jBvj7S50FPgsHaHXai', // iconPath: 'https://lxnapi.ccttiot.com/bike/img/static/u6jBvj7S50FPgsHaHXai',
iconPath: item.onlineStatus == 0 iconPath: item.onlineStatus == 0 ?
? 'https://lxnapi.ccttiot.com/bike/img/static/uQRng4QNKA38Amk8Wgt5' 'https://lxnapi.ccttiot.com/bike/img/static/uQRng4QNKA38Amk8Wgt5' :
: 'https://lxnapi.ccttiot.com/bike/img/static/uocjFo8Ar2BJVpzC2G2f', 'https://lxnapi.ccttiot.com/bike/img/static/uocjFo8Ar2BJVpzC2G2f',
callout: { callout: {
content: '' + item.remainingPower + '%', // 修改为你想要显示的文字内容 content: '' + item.remainingPower + '%', // 修改为你想要显示的文字内容
color: '#ffffff', // 修改为文字颜色 color: '#ffffff', // 修改为文字颜色
@ -647,7 +700,7 @@
} }
}) })
}) })
// https://lxnapi.ccttiot.com/bike/img/static/u1UD93BU1vfshWFoDwgX // https://lxnapi.ccttiot.com/bike/img/static/u1UD93BU1vfshWFoDwgX
// https://lxnapi.ccttiot.com/bike/img/static/u4UKmB47AxOj3YKIaajM // https://lxnapi.ccttiot.com/bike/img/static/u4UKmB47AxOj3YKIaajM
this.status1.forEach(item => { this.status1.forEach(item => {
@ -657,11 +710,11 @@
longitude: parseFloat(item.longitude), longitude: parseFloat(item.longitude),
// title: item.deviceName, // title: item.deviceName,
width: 20, width: 20,
// joinCluster: true, // joinCluster: true,
height: 23, height: 23,
iconPath: item.onlineStatus == 0 iconPath: item.onlineStatus == 0 ?
? 'https://lxnapi.ccttiot.com/bike/img/static/uzhMeExOQJbMcZtrfGUV' 'https://lxnapi.ccttiot.com/bike/img/static/uzhMeExOQJbMcZtrfGUV' :
: 'https://lxnapi.ccttiot.com/bike/img/static/uheL17wVZn24BwCwEztT', 'https://lxnapi.ccttiot.com/bike/img/static/uheL17wVZn24BwCwEztT',
// iconPath: 'https://lxnapi.ccttiot.com/bike/img/static/uAajBTcihvOr9HttyWck', // iconPath: 'https://lxnapi.ccttiot.com/bike/img/static/uAajBTcihvOr9HttyWck',
callout: { callout: {
content: '' + item.remainingPower + '%', // 修改为你想要显示的文字内容 content: '' + item.remainingPower + '%', // 修改为你想要显示的文字内容
@ -681,11 +734,11 @@
longitude: parseFloat(item.longitude), longitude: parseFloat(item.longitude),
// title: item.deviceName, // title: item.deviceName,
width: 20, width: 20,
height: 23, height: 23,
iconPath: item.onlineStatus == 0 iconPath: item.onlineStatus == 0 ?
? 'https://lxnapi.ccttiot.com/bike/img/static/uR3DQEssiK62ovhh88y8' 'https://lxnapi.ccttiot.com/bike/img/static/uR3DQEssiK62ovhh88y8' :
: 'https://lxnapi.ccttiot.com/bike/img/static/u460R1NKWHEpHbt0U4H7', 'https://lxnapi.ccttiot.com/bike/img/static/u460R1NKWHEpHbt0U4H7',
// iconPath: 'https://lxnapi.ccttiot.com/bike/img/static/um0qXpcbA32WdwqtHbxy', // iconPath: 'https://lxnapi.ccttiot.com/bike/img/static/um0qXpcbA32WdwqtHbxy',
callout: { callout: {
content: '' + item.remainingPower + '%', // 修改为你想要显示的文字内容 content: '' + item.remainingPower + '%', // 修改为你想要显示的文字内容
@ -706,10 +759,10 @@
// title: item.deviceName, // title: item.deviceName,
width: 20, width: 20,
height: 23, height: 23,
// joinCluster: true, // joinCluster: true,
iconPath: item.onlineStatus == 0 iconPath: item.onlineStatus == 0 ?
? 'https://lxnapi.ccttiot.com/bike/img/static/uG13E7BpUFF44wVYC9no' 'https://lxnapi.ccttiot.com/bike/img/static/uG13E7BpUFF44wVYC9no' :
: 'https://lxnapi.ccttiot.com/bike/img/static/uHQIdWCTmtUztl49wBKU', 'https://lxnapi.ccttiot.com/bike/img/static/uHQIdWCTmtUztl49wBKU',
// iconPath: 'https://lxnapi.ccttiot.com/bike/img/static/ur1ZrncDJ1WwuPJeiMG6', // iconPath: 'https://lxnapi.ccttiot.com/bike/img/static/ur1ZrncDJ1WwuPJeiMG6',
callout: { callout: {
content: '' + item.remainingPower + '%', // 修改为你想要显示的文字内容 content: '' + item.remainingPower + '%', // 修改为你想要显示的文字内容
@ -730,10 +783,10 @@
// title: item.deviceName, // title: item.deviceName,
width: 20, width: 20,
height: 23, height: 23,
// joinCluster: true, // joinCluster: true,
iconPath: item.onlineStatus == 0 iconPath: item.onlineStatus == 0 ?
? 'https://lxnapi.ccttiot.com/bike/img/static/uRod2zf3t9dAOYafWoWt' 'https://lxnapi.ccttiot.com/bike/img/static/uRod2zf3t9dAOYafWoWt' :
: 'https://lxnapi.ccttiot.com/bike/img/static/uZpXq3TBtM5gVgJJeImY', 'https://lxnapi.ccttiot.com/bike/img/static/uZpXq3TBtM5gVgJJeImY',
// iconPath: 'https://lxnapi.ccttiot.com/bike/img/static/uN4ksL0Z2HM4C07fKEOF', // iconPath: 'https://lxnapi.ccttiot.com/bike/img/static/uN4ksL0Z2HM4C07fKEOF',
callout: { callout: {
content: '' + item.remainingPower + '%', // 修改为你想要显示的文字内容 content: '' + item.remainingPower + '%', // 修改为你想要显示的文字内容
@ -741,7 +794,7 @@
fontSize: 10, // 修改为文字大小 fontSize: 10, // 修改为文字大小
borderRadius: 10, // 修改为气泡圆角大小 borderRadius: 10, // 修改为气泡圆角大小
bgColor: '#D4ECFF', // 修改为气泡背景颜色 bgColor: '#D4ECFF', // 修改为气泡背景颜色
padding:1 , // 修改为气泡内边距 padding: 1, // 修改为气泡内边距
display: 'ALWAYS', // 修改为气泡的显示策略 display: 'ALWAYS', // 修改为气泡的显示策略
} }
}) })
@ -754,10 +807,10 @@
// title: item.deviceName, // title: item.deviceName,
width: 20, width: 20,
height: 23, height: 23,
// joinCluster: true, // joinCluster: true,
iconPath: item.onlineStatus == 0 iconPath: item.onlineStatus == 0 ?
? 'https://lxnapi.ccttiot.com/bike/img/static/uhZudZM3nEKj0tYKlho2' 'https://lxnapi.ccttiot.com/bike/img/static/uhZudZM3nEKj0tYKlho2' :
: 'https://lxnapi.ccttiot.com/bike/img/static/ujur6TezvPf4buFAqPHo', 'https://lxnapi.ccttiot.com/bike/img/static/ujur6TezvPf4buFAqPHo',
// iconPath: 'https://lxnapi.ccttiot.com/bike/img/static/uxbI6ZclpS3WQCfPO1zr', // iconPath: 'https://lxnapi.ccttiot.com/bike/img/static/uxbI6ZclpS3WQCfPO1zr',
callout: { callout: {
content: '' + item.remainingPower + '%', // 修改为你想要显示的文字内容 content: '' + item.remainingPower + '%', // 修改为你想要显示的文字内容
@ -778,17 +831,17 @@
// title: item.deviceName, // title: item.deviceName,
width: 20, width: 20,
height: 23, height: 23,
iconPath: item.onlineStatus == 0 iconPath: item.onlineStatus == 0 ?
? 'https://lxnapi.ccttiot.com/bike/img/static/ucBKG3ebYRAToVweJihu' 'https://lxnapi.ccttiot.com/bike/img/static/ucBKG3ebYRAToVweJihu' :
: 'https://lxnapi.ccttiot.com/bike/img/static/uyK7Vg4Lu8xb3oNVuG2l', 'https://lxnapi.ccttiot.com/bike/img/static/uyK7Vg4Lu8xb3oNVuG2l',
// iconPath: 'https://lxnapi.ccttiot.com/bike/img/static/uYIFwg5IJ4Axh7TfJ7q6', // iconPath: 'https://lxnapi.ccttiot.com/bike/img/static/uYIFwg5IJ4Axh7TfJ7q6',
callout: { callout: {
content:'' + item.remainingPower + '%', // 修改为你想要显示的文字内容 content: '' + item.remainingPower + '%', // 修改为你想要显示的文字内容
color: '#ffffff', // 修改为文字颜色 color: '#ffffff', // 修改为文字颜色
fontSize: 10, // 修改为文字大小 fontSize: 10, // 修改为文字大小
borderRadius: 10, // 修改为气泡圆角大小 borderRadius: 10, // 修改为气泡圆角大小
bgColor: '#000000', // 修改为气泡背景颜色 bgColor: '#000000', // 修改为气泡背景颜色
padding:1, // 修改为气泡内边距 padding: 1, // 修改为气泡内边距
display: 'ALWAYS', // 修改为气泡的显示策略 display: 'ALWAYS', // 修改为气泡的显示策略
} }
}) })
@ -826,7 +879,7 @@
this.status4 = []; this.status4 = [];
this.status8 = []; this.status8 = [];
this.status9 = []; this.status9 = [];
this.status6 = []; this.status6 = [];
let data = { let data = {
powerStart: this.rangeValue[0], powerStart: this.rangeValue[0],
powerEnd: this.rangeValue[1], powerEnd: this.rangeValue[1],
@ -843,7 +896,7 @@
// if (item.onlineStatus == 0) { // if (item.onlineStatus == 0) {
// this.status9.push(item); // this.status9.push(item);
// } else { // } else {
// } // }
if (item.status == 0) { if (item.status == 0) {
this.status0.push(item); this.status0.push(item);
@ -855,9 +908,9 @@
this.status3.push(item); this.status3.push(item);
} else if (item.status == 4) { } else if (item.status == 4) {
this.status4.push(item); this.status4.push(item);
}else if (item.status == 6) { } else if (item.status == 6) {
this.status6.push(item); this.status6.push(item);
} else if (item.status == 8) { } else if (item.status == 8) {
this.status8.push(item); this.status8.push(item);
} }
// console.log(this.status1,'status1status1'); // console.log(this.status1,'status1status1');
@ -869,28 +922,28 @@
}).catch(error => { }).catch(error => {
// Handle request error // Handle request error
}); });
} else if (this.statusidx == 7 ) { } else if (this.statusidx == 7) {
data.status = ''; data.status = '';
this.$u.get(`/appVerify/allVehicleInfo?`, data).then((res) => { this.$u.get(`/appVerify/allVehicleInfo?`, data).then((res) => {
if (res.code == 200) { if (res.code == 200) {
this.showmap = true; this.showmap = true;
this.listData = res.data; this.listData = res.data;
res.data.forEach(item => { res.data.forEach(item => {
if (item.status == 0) { if (item.status == 0) {
this.status0.push(item); this.status0.push(item);
} else if (item.status == 1) { } else if (item.status == 1) {
this.status1.push(item); this.status1.push(item);
} else if (item.status == 2) { } else if (item.status == 2) {
this.status2.push(item); this.status2.push(item);
} else if (item.status == 3) { } else if (item.status == 3) {
this.status3.push(item); this.status3.push(item);
} else if (item.status == 4) { } else if (item.status == 4) {
this.status4.push(item); this.status4.push(item);
}else if (item.status == 6) { } else if (item.status == 6) {
this.status6.push(item); this.status6.push(item);
} else if (item.status == 8) { } else if (item.status == 8) {
this.status8.push(item); this.status8.push(item);
} }
}); });
this.markstause(); this.markstause();
} else { } else {
@ -899,29 +952,29 @@
}).catch(error => { }).catch(error => {
// Handle request error // Handle request error
}); });
}else if ( this.statusidx == 9) { } else if (this.statusidx == 9) {
data.status = '-0' data.status = '-0'
data.onlineStatus=0 data.onlineStatus = 0
this.$u.get(`/appVerify/allVehicleInfo?`, data).then((res) => { this.$u.get(`/appVerify/allVehicleInfo?`, data).then((res) => {
if (res.code == 200) { if (res.code == 200) {
this.showmap = true; this.showmap = true;
this.listData = res.data; this.listData = res.data;
res.data.forEach(item => { res.data.forEach(item => {
if (item.status == 0) { if (item.status == 0) {
this.status0.push(item); this.status0.push(item);
} else if (item.status == 1) { } else if (item.status == 1) {
this.status1.push(item); this.status1.push(item);
} else if (item.status == 2) { } else if (item.status == 2) {
this.status2.push(item); this.status2.push(item);
} else if (item.status == 3) { } else if (item.status == 3) {
this.status3.push(item); this.status3.push(item);
} else if (item.status == 4) { } else if (item.status == 4) {
this.status4.push(item); this.status4.push(item);
}else if (item.status == 6) { } else if (item.status == 6) {
this.status6.push(item); this.status6.push(item);
} else if (item.status == 8) { } else if (item.status == 8) {
this.status8.push(item); this.status8.push(item);
} }
}); });
this.markstause(); this.markstause();
} else { } else {
@ -931,43 +984,46 @@
// Handle request error // Handle request error
}); });
} }
this.clusterMarkers(); // 调用聚合方法 this.clusterMarkers(); // 调用聚合方法
}, },
clusterMarkers() { clusterMarkers() {
this.markers.forEach(marker => { this.markers.forEach(marker => {
let added = false; let added = false;
for (let i = 0; i < this.clusters.length; i++) { for (let i = 0; i < this.clusters.length; i++) {
const cluster = this.clusters[i]; const cluster = this.clusters[i];
const distance = this.calculateDistance(cluster.latitude, cluster.longitude, marker.latitude, marker.longitude); const distance = this.calculateDistance(cluster.latitude, cluster.longitude, marker
if (distance < this.clusterRadius) { .latitude, marker.longitude);
// 合并到现有聚合 if (distance < this.clusterRadius) {
cluster.markers.push(marker); // 合并到现有聚合
cluster.latitude = (cluster.latitude * cluster.markers.length + marker.latitude) / (cluster.markers.length + 1); cluster.markers.push(marker);
cluster.longitude = (cluster.longitude * cluster.markers.length + marker.longitude) / (cluster.markers.length + 1); cluster.latitude = (cluster.latitude * cluster.markers.length + marker.latitude) / (
added = true; cluster.markers.length + 1);
break; cluster.longitude = (cluster.longitude * cluster.markers.length + marker.longitude) / (
} cluster.markers.length + 1);
} added = true;
if (!added) { break;
// 创建新的聚合 }
this.clusters.push({ }
latitude: marker.latitude, if (!added) {
longitude: marker.longitude, // 创建新的聚合
markers: [marker] this.clusters.push({
}); latitude: marker.latitude,
} longitude: marker.longitude,
}); markers: [marker]
}, });
// 计算两点间的距离 }
calculateDistance(lat1, lon1, lat2, lon2) { });
const p = 0.017453292519943295; // Math.PI / 180 },
const c = Math.cos; // 计算两点间的距离
const a = 0.5 - c((lat2 - lat1) * p)/2 + calculateDistance(lat1, lon1, lat2, lon2) {
c(lat1 * p) * c(lat2 * p) * const p = 0.017453292519943295; // Math.PI / 180
(1 - c((lon2 - lon1) * p))/2; const c = Math.cos;
return 12742 * Math.asin(Math.sqrt(a)); // 2 * R; R = 6371 km const a = 0.5 - c((lat2 - lat1) * p) / 2 +
}, c(lat1 * p) * c(lat2 * p) *
(1 - c((lon2 - lon1) * p)) / 2;
return 12742 * Math.asin(Math.sqrt(a)); // 2 * R; R = 6371 km
},
toggleIconAndCallout() { toggleIconAndCallout() {
this.showIconAndCallout = !this.showIconAndCallout; this.showIconAndCallout = !this.showIconAndCallout;
this.markers.forEach(marker => { this.markers.forEach(marker => {
@ -1074,6 +1130,13 @@
.page { .page {
width: 750rpx; width: 750rpx;
.center-marker {
position: absolute;
top: 50%;
left: 50%;
transform: translate(-50%, -100%); /* 定位在中心点上方 */
pointer-events: none; /* 使其不可点击 */
}
.fixdivce { .fixdivce {
padding: 12rpx 22rpx 12rpx 22rpx; padding: 12rpx 22rpx 12rpx 22rpx;
position: fixed; position: fixed;
@ -1084,31 +1147,33 @@
background: #FFFFFF80; background: #FFFFFF80;
border-radius: 0 40rpx 40rpx 0; border-radius: 0 40rpx 40rpx 0;
box-shadow: 0rpx 4rpx 10rpx 0rpx rgba(0, 0, 0, 0.3); box-shadow: 0rpx 4rpx 10rpx 0rpx rgba(0, 0, 0, 0.3);
.scrollable-content::-webkit-scrollbar { .scrollable-content::-webkit-scrollbar {
display: none; display: none;
} }
.scrollable-content { .scrollable-content {
height: 100%; height: 100%;
overflow-y: auto; overflow-y: auto;
.divce_li:last-child { .divce_li:last-child {
border-bottom: 1rpx solid #fff; border-bottom: 1rpx solid #fff;
} }
.divce_li { .divce_li {
padding: 10rpx 0; padding: 10rpx 0;
display: flex; display: flex;
flex-wrap: nowrap; flex-wrap: nowrap;
align-items: center; align-items: center;
border-bottom: 1rpx solid #D8D8D8; border-bottom: 1rpx solid #D8D8D8;
.left_img { .left_img {
image { image {
width: 44rpx; width: 44rpx;
height: 70rpx; height: 70rpx;
} }
} }
.right_cont { .right_cont {
margin-left: 20rpx; margin-left: 20rpx;
display: flex; display: flex;
@ -1116,31 +1181,29 @@
font-weight: 400; font-weight: 400;
font-size: 24rpx; font-size: 24rpx;
color: #3D3D3D; color: #3D3D3D;
.right_top { .right_top {
width: 100%; width: 100%;
display: flex; display: flex;
flex-wrap: nowrap; flex-wrap: nowrap;
align-items: center; align-items: center;
.right_top_left { .right_top_left {
margin-left: auto; margin-left: auto;
display: flex; display: flex;
flex-wrap: nowrap; flex-wrap: nowrap;
align-items: center; align-items: center;
image { image {
margin-right: 6rpx; margin-right: 6rpx;
width: 12rpx; width: 12rpx;
height: 26rpx; height: 26rpx;
} }
} }
.right_top_right { .right_top_right {}
}
} }
.right_bot { .right_bot {
width: 100%; width: 100%;
display: flex; display: flex;
@ -1152,6 +1215,7 @@
} }
} }
} }
.decice_cont { .decice_cont {
display: flex; display: flex;
flex-wrap: wrap; flex-wrap: wrap;