接口联调

.hbuilderx/launch.json

+{ // launch.json 配置了启动调试时相关设置，configurations下节点名称可为 app-plus/h5/mp-weixin/mp-baidu/mp-alipay/mp-qq/mp-toutiao/mp-360/
+  // launchtype项可配置值为local或remote, local代表前端连本地云函数，remote代表前端连云端云函数
+    "version": "0.0",
+    "configurations": [{
+     	"default" : 
+     	{
+     		"launchtype" : "local"
+     	},
+     	"mp-weixin" : 
+     	{
+     		"launchtype" : "local"
+     	},
+     	"type" : "uniCloud"
+     }
+    ]
+}

api/index.js

@@ -4,11 +4,10 @@ const baseURL = 'https://testapi.sharefly.mmcuav.cn/'
 // const baseURL = "https://csfapi.mmcuav.cn/"
 const api = {
 	getWebSitList:'systemservlet/website/getWebsiteList',
-	flyerDotList:'flyerservlet/flyeraccount/bitmap' ,
-	deviceDotList:'deviceservlet/device/bitmap' 
+	flyerDotList:'systemservlet/website/flyer/bitmap' ,
+	deviceDotList:'systemservlet/website/uav/bitmap' 
 }
 export {
 	api,
 	baseURL,
-
 }
\ No newline at end of file

pages.json

@@ -4,6 +4,7 @@
 			"path": "pages/index/index",
 			"style": {
 				"navigationBarTitleText": "全国网点"
+				// "enablePullDownRefresh": true
 			}
 		}
 	],

pages/index/index.vue

@@ -25,19 +25,31 @@
 				<view class="websit-item-wrap">
 					<view class="websit-item" v-for="(item, index) in websitList" :key="index">
 						<view class="left-info">
-							<view class="head">{{ item.dizhi }}网点</view>
-							<view class="meta">
+							<view class="head" v-if="currentTipIndex===0">{{item.dizhi}}网点</view>
+							<view class="flyer-head" v-if="currentTipIndex===1">
+								<div class="name">{{item.flyerName}}</div>
+								<div class="phone">
+									{{item.phoneNum.substring(0,3)+'****'+item.phoneNum.substring(item.phoneNum.length-4,item.phoneNum.length)}}
+								</div>
+							</view>
+							<view class="uav-head" v-if="currentTipIndex===2">
+								{{item.uavName}}
+							</view>
+							<view class="meta" v-if="currentTipIndex!=2">
 								<view class="grade">{{item.grade}}分</view>
 								<view class="tip">
-									近天{{item.day}}服务次数超{{
+									近{{item.day}}天服务次数超{{
 	                   item.count
 	                  }}次
 								</view>
 							</view>
+							<view class="uav-id" v-if="currentTipIndex===2">
+								ID:{{item.id}}
+							</view>
 						</view>
 						<view class="line"></view>
 						<view class="right-info">
-							距你{{ Number(item.range).toFixed(0) }}km
+							距你{{ (Number(item.range)|| Number(item.distance)).toFixed(0) }}km
 						</view>
 					</view>
 				</view>
@@ -96,6 +108,23 @@
 			// });
 			this.location = JSON.parse(str);
 		},
+		onReachBottom() {
+			if (this.currentTipIndex != 0) {
+				console.log('触底了-->')
+				if (this.query.pageNo * this.query.pageSize < this.total) {
+					switch (this.currentTipIndex) {
+						case 1:
+							this.query.pageNo++
+							this.getFlyerDotList()
+							break;
+						case 2:
+							this.query.pageNo++
+							this.getDeviceDotList()
+							break;
+					}
+				}
+			}
+		},
 		methods: {
 			toAddWebsit() {
 				wx.miniProgram.navigateTo({
@@ -115,6 +144,8 @@
 </script>
 <!-- 内嵌高德地图 -->
 <script module="ModuleInstance" lang="renderjs">
+	const flyes = require("../../static/json/flyers.json")
+	const devices = require("../../static/json/uavs.json")
 	export default {
 		data() {
 			return {
@@ -144,20 +175,25 @@
 				// ],
 				// labelList: ["已加盟", "筹备中", "提交意向"],
 				tipList: [{
-						label: "服务网点",
+						label: "服务网点(512)",
 						val: 1
 					},
 					{
-						label: "在线飞手",
+						label: "在线飞手(13k+)",
 						val: 2
 					},
 					{
-						label: "无人机",
+						label: "无人机(23k+)",
 						val: 3
 					},
 				], //数据切换
 				currentTipIndex: 0,
 				massMarks: undefined, //海量点对象
+				query: {
+					pageNo: 1,
+					pageSize: 10
+				},
+				total: 0
 			};
 		},
 		mounted() {
@@ -187,7 +223,7 @@
 			initAmap() {
 				this.map = new AMap.Map('map', {
 					// 显示地图缩放级别
-					zoom: 6,
+					zoom: 8,
 					// 地图中心点
 					resizeEnable: true,
 					center: [this.location.location.lng, this.location.location.lat],
@@ -270,34 +306,57 @@
 						this.massMarks.setData(this.markers)
 						break;
 					case 1:
+						this.query.pageNo = 1
 						await this.getFlyerDotList()
 						this.massMarks.setData(this.markers)
 						break;
 					case 2:
+						this.query.pageNo = 1
 						await this.getDeviceDotList()
 						this.massMarks.setData(this.markers)
 						break;
 				}
 				document.title = this.tipList[index].label;
 			},
-			async getFlyerDotList(data) {
+			async getFlyerDotList() {
+				// console.log('飞手数据-->',flyes)
 				let res = await this.$httpRequest({
 					url: this.$api.flyerDotList,
 					method: 'get',
 					data: {
 						lat: this.location.location.lat,
 						lon: this.location.location.lng,
+						...this.query
 					}
 				})
-				if (res.result && res.result.length != 0) {
-					this.markers = res.result.slice(0, 1999).map((item, index) => {
+				if (res.result) {
+					if (this.query.pageNo === 1) {
+						this.total = res.result.totalCount
+						this.websitList = res.result.list
+						this.websitList.forEach(item => {
+							item.grade = '4.' + this.RandomNum(5, 9)
+							item.day = this.RandomNum(1, 10)
+							item.count = this.RandomNum(4, 5) * 10
+						})
+						this.markers = flyes.slice(0, 1999).map((item, index) => {
 							return {
 								id: index,
 								lnglat: [item.lon, item.lat],
 								style: 1
 							};
 						});
+					} else {
+						let list = res.result.list
+						list.forEach(item => {
+							item.grade = '4.' + this.RandomNum(5, 9)
+							item.day = this.RandomNum(1, 10)
+							item.count = this.RandomNum(4, 5) * 10
+						})
+						this.websitList = this.websitList.concat(list)
+					}
+
 				}
+
 			},
 			async getDeviceDotList() {
 				let res = await this.$httpRequest({
@@ -306,16 +365,25 @@
 					data: {
 						lat: this.location.location.lat,
 						lon: this.location.location.lng,
+						...this.query
 					}
 				})
-				if (res.result && res.result.length != 0) {
-					this.markers = res.result.map((item, index) => {
+				if (res.result) {
+					if (this.query.pageNo === 1) {
+						this.total = res.result.totalCount
+						this.websitList = res.result.list
+						this.markers = devices.map((item, index) => {
 							return {
 								id: index,
 								lnglat: [item.lon, item.lat],
 								style: 2
 							};
 						});
+					} else {
+						let list = res.result.list
+						this.websitList = this.websitList.concat(list)
+					}
+				
 				}
 			},
 			RandomNum(minNum, maxNum) {
@@ -339,7 +407,7 @@
 			border-radius: 36rpx 36rpx 0px 0px;
 
 			.ios-wrap {
-				padding: 0 26rpx 144rpx 26rpx;
+				padding: 0 26rpx 30rpx 26rpx;
 
 				.head-tip {
 					width: 100rpx;
@@ -410,12 +478,25 @@
 						.left-info {
 							flex: 1;
 
-							.head {
+							.head,
+							.flyer-head,.uav-head{
 								font-size: 28rpx;
 								font-weight: 500;
 								color: #1e1e1e;
 							}
 
+							.flyer-head {
+								display: flex;
+								align-items: center;
+
+								.phone {
+									font-size: 24rpx;
+									font-weight: 400;
+									color: #6F6F6F;
+									margin-left: 16rpx;
+								}
+							}
+							
 							.meta {
 								width: 100%;
 								margin-top: 20rpx;
@@ -440,6 +521,12 @@
 									padding: 0 8rpx;
 								}
 							}
+							.uav-id{
+								font-size: 24rpx;
+								font-weight: 400;
+								color: #88888C;
+								margin-top: 8rpx;
+							}
 						}
 
 						.line {
@@ -470,6 +557,10 @@
 				width: 100%;
 			}
 
+			.animate__heartBeat {
+				animation: heartBeat 2s infinite;
+			}
+
 			.btn-img {
 				width: 84rpx;
 				position: absolute;
@@ -568,9 +659,4 @@
 	//     margin-left: 5px;
 	//   }
 	// }
-
-
-	.animate__heartBeat {
-		animation: heartBeat 2s infinite;
-	}
 </style>

unpackage/dist/build/h5/index.html

 <!DOCTYPE html><html lang=zh-CN><head><meta charset=utf-8><meta http-equiv=X-UA-Compatible content="IE=edge"><title>全国网点</title><script>var coverSupport = 'CSS' in window && typeof CSS.supports === 'function' && (CSS.supports('top: env(a)') || CSS.supports('top: constant(a)'))
-            document.write('<meta name="viewport" content="width=device-width, user-scalable=no, initial-scale=1.0, maximum-scale=1.0, minimum-scale=1.0' + (coverSupport ? ', viewport-fit=cover' : '') + '" />')</script><link rel=stylesheet href=/h5/static/index.a5c69d49.css></head><body><noscript><strong>Please enable JavaScript to continue.</strong></noscript><div id=app></div><script src=/h5/static/js/chunk-vendors.ed1c0629.js></script><script src=/h5/static/js/index.fd493a86.js></script></body></html>
+            document.write('<meta name="viewport" content="width=device-width, user-scalable=no, initial-scale=1.0, maximum-scale=1.0, minimum-scale=1.0' + (coverSupport ? ', viewport-fit=cover' : '') + '" />')</script><link rel=stylesheet href=/h5/static/index.a5c69d49.css></head><body><noscript><strong>Please enable JavaScript to continue.</strong></noscript><div id=app></div><script src=/h5/static/js/chunk-vendors.ed1c0629.js></script><script src=/h5/static/js/index.7e38ba15.js></script></body></html>
\ No newline at end of file