Skip to content

H
h5
提交 1c04d2f2 作者: 龚洪江
操作

数据切换

上级 ce2f67de
正在显示 包含 118 行增加 和 46 行删除
api/index.js
// 测试服务器
// const baseURL = 'https://testapi.sharefly.mmcuav.cn/'
// const routeURL='https://csfpg.sharefly.mmcuav.cn/'
const baseURL = 'https://testapi.sharefly.mmcuav.cn/'
// 正式服
const baseURL = "https://csfapi.mmcuav.cn/"
const routeURL='https://sharefly.mmcuav.cn/'
// const baseURL = "https://csfapi.mmcuav.cn/"
const api = {
getWebSitList:'systemservlet/website/getWebsiteList'
getWebSitList:'systemservlet/website/getWebsiteList',
flyerDotList:'flyerservlet/flyeraccount/bitmap' ,
deviceDotList:'deviceservlet/device/bitmap'
}
export {
api,
baseURL,
routeURL
}
\ No newline at end of file
pages/index/index.vue
......@@ -5,10 +5,10 @@
<view class="provice-title">{{ location.province }}</view>
<img src="@/assets/image/bot-arrow.png" alt="" />
</view> -->
<view class="websit-node-head-wrap">
<image src="../../static/images/map-tip.png" mode="widthFix" class="img-1"></image>
<view class="websit-node-head-wrap">
<image src="../../static/images/map-tip.png" mode="widthFix" class="img-1"></image>
<!-- <view class=" animate__animated animate__tada animate__infinite animate__delay-1s btn-img" style="background:red"></view> -->
<image src="../../static/images/go.png" mode="widthFix" class=" animate__heartBeat btn-img"></image>
<image src="../../static/images/go.png" mode="widthFix" class=" animate__heartBeat btn-img"></image>
</view>
<view class="websit-node-list-wrap">
<view class="ios-wrap">
......@@ -27,10 +27,10 @@
<view class="left-info">
<view class="head">{{ item.dizhi }}网点</view>
<view class="meta">
<view class="grade">4.{{ RandomNum(5, 9) }}分</view>
<view class="grade">{{item.grade}}分</view>
<view class="tip">
近天{{ RandomNum(1, 10)}}服务次数超{{
RandomNum(4, 5) * 10
近天{{item.day}}服务次数超{{
item.count
}}次
</view>
</view>
......@@ -48,7 +48,7 @@
<view class="current-status">
<view class="swiper-no-swiping">
<swiper :options="swiperOptions">
<swiper-slide v-for="(item, index) in cityList" :key="index">
<swiper-slide v-for="(item, index ) in cityList" :key="index">
<view class="swiper-slide">
{{ item }}网点{{ labelList[RandomNum(0, 2)] }}
</view>
......@@ -69,7 +69,7 @@
return {
title: 'Hello',
location: {},
locationData:{
locationData: {
adcode: "440305",
city: "深圳市",
city_code: "156440300",
......@@ -86,10 +86,10 @@
}
},
onLoad(option) {
if(option.location){
if (option.location) {
}
let str = this.getQueryString("location") || JSON.stringify(this.locationData) ;
let str = this.getQueryString("location") || JSON.stringify(this.locationData);
// uni.showToast({
// title: str,
// icon:'none'
......@@ -102,22 +102,14 @@
url: "/page-home/cooperation/cooperation"
});
},
RandomNum(minNum, maxNum) {
return parseInt(Math.random() * (maxNum - minNum + 1) + minNum, 10);
},
// 数据切换
changeTabEvent(index) {
this.currentTipIndex = index;
document.title = this.tipList[index].label;
},
getQueryString(name) {
var reg = new RegExp("(^|&)" + name + "=([^&]*)(&|$)", "i");
var r = window.location.search.substr(1).match(reg);
if (r != null) {
return decodeURIComponent(r[2]);
}
return null;
}
var reg = new RegExp("(^|&)" + name + "=([^&]*)(&|$)", "i");
var r = window.location.search.substr(1).match(reg);
if (r != null) {
return decodeURIComponent(r[2]);
}
return null;
}
}
}
</script>
......@@ -129,7 +121,6 @@
map: null,
markers: [],
websitList: [],
// swiperOptions: {
// autoplay: {
// delay: 2000,
......@@ -166,6 +157,7 @@
},
], //数据切换
currentTipIndex: 0,
massMarks: undefined, //海量点对象
};
},
mounted() {
......@@ -207,19 +199,30 @@
});
},
setMassMarks() {
let styleObject = {
url: "https://pad-video-x.oss-cn-shenzhen.aliyuncs.com/image/servicepot.png", // 图标地址
size: new AMap.Size(40, 40), // 图标大小
anchor: new AMap.Pixel(5, 5), // 图标显示位置偏移量，基准点为图标左上角
};
let massMarks = new AMap.MassMarks(this.markers, {
let styleList = [{
url: 'https://pad-video-x.oss-cn-shenzhen.aliyuncs.com/image/servicepot.png', // 图标地址
size: new AMap.Size(40, 40), // 图标大小
anchor: new AMap.Pixel(5, 5), // 图标显示位置偏移量，基准点为图标左上角
},
{
url: 'https://pad-video-x.oss-cn-shenzhen.aliyuncs.com/image/mmc1_flyer.png', // 图标地址
size: new AMap.Size(40, 40), // 图标大小
anchor: new AMap.Pixel(5, 5), // 图标显示位置偏移量，基准点为图标左上角
},
{
url: 'https://pad-video-x.oss-cn-shenzhen.aliyuncs.com/image/mmc1.png', // 图标地址
size: new AMap.Size(40, 40), // 图标大小
anchor: new AMap.Pixel(5, 5), // 图标显示位置偏移量，基准点为图标左上角
}
];
this.massMarks = new AMap.MassMarks(this.markers, {
zIndex: 5, // 海量点图层叠加的顺序
zooms: [3, 19], // 在指定地图缩放级别范围内展示海量点图层
style: styleObject, // 设置样式对象
style: styleList, // 设置样式对象
});
console.log("massMarks-->", massMarks);
console.log("massMarks-->", this.massMarks);
// 将海量点添加至地图实例
massMarks.setMap(this.map);
this.massMarks.setMap(this.map);
},
async getMarkPoint() {
let res = await this.$httpRequest({
......@@ -232,7 +235,12 @@
})
if (res.result) {
let nodeList = res.result.reduce((pre, cur) => {
let list = cur.locationList.filter((item) => item.range >= 100);
let list = cur.locationList.filter((item) => {
item.grade = '4.' + this.RandomNum(5, 9)
item.day = this.RandomNum(1, 10)
item.count = this.RandomNum(4, 5) * 10
return item.range >= 100
});
pre.push(...list);
// }
return pre;
......@@ -248,10 +256,71 @@
return {
id: index,
lnglat: [item.jd, item.wd],
style: 0
};
});
}
},
// 数据切换
async changeTabEvent(index) {
this.currentTipIndex = index;
switch (index) {
case 0:
await this.getMarkPoint()
this.massMarks.setData(this.markers)
break;
case 1:
await this.getFlyerDotList()
this.massMarks.setData(this.markers)
break;
case 2:
await this.getDeviceDotList()
this.massMarks.setData(this.markers)
break;
}
document.title = this.tipList[index].label;
},
async getFlyerDotList(data) {
let res = await this.$httpRequest({
url: this.$api.flyerDotList,
method: 'get',
data: {
lat: this.location.location.lat,
lon: this.location.location.lng,
}
})
if (res.result && res.result.length != 0) {
this.markers = res.result.slice(0, 1999).map((item, index) => {
return {
id: index,
lnglat: [item.lon, item.lat],
style: 1
};
});
}
},
async getDeviceDotList() {
let res = await this.$httpRequest({
url: this.$api.deviceDotList,
method: 'get',
data: {
lat: this.location.location.lat,
lon: this.location.location.lng,
}
})
if (res.result && res.result.length != 0) {
this.markers = res.result.map((item, index) => {
return {
id: index,
lnglat: [item.lon, item.lat],
style: 2
};
});
}
},
RandomNum(minNum, maxNum) {
return parseInt(Math.random() * (maxNum - minNum + 1) + minNum, 10);
},
},
};
</script>
......@@ -264,7 +333,7 @@
.websit-node-list-wrap {
position: absolute;
left: 0;
top: 60%;
top: 78%;
width: 100%;
background: #f9f9f9;
border-radius: 36rpx 36rpx 0px 0px;
......@@ -396,9 +465,11 @@
left: 50%;
transform: translateX(-50%);
width: 90%;
.img-1 {
width: 100%;
}
.btn-img {
width: 84rpx;
position: absolute;
......
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.2fcd7cef.js></script></body></html>
\ No newline at end of file
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>
\ No newline at end of file
Markdown 格式
0% 或
您添加了 0 人 到此讨论。请谨慎行事。
请先完成此评论的编辑！
请 注册 或者 后发表评论