503 lines
11 KiB
JavaScript
503 lines
11 KiB
JavaScript
// pages/home/index.js
|
|
const app = getApp();
|
|
let s = '';
|
|
let m = 0;
|
|
let endM = 0;
|
|
let address = [];
|
|
let zoom = 6;
|
|
let mapCtx;
|
|
Page({
|
|
/**
|
|
* 页面的初始数据
|
|
*/
|
|
data: {
|
|
state: 2,
|
|
top: -200,
|
|
noticeList: [],
|
|
latitude: 0,
|
|
longitude: 0,
|
|
markers: [],
|
|
isShowAuth: false,
|
|
animationData: {},
|
|
includePoints: [],
|
|
unClickDetail: false,
|
|
unClickBtn: false,
|
|
isShowMap: false,
|
|
gohome: true,
|
|
},
|
|
|
|
/**
|
|
* 生命周期函数--监听页面加载
|
|
*/
|
|
onLoad: function(options) {
|
|
this.setData({
|
|
isShowMap: true
|
|
})
|
|
},
|
|
|
|
/**
|
|
* 生命周期函数--监听页面初次渲染完成
|
|
*/
|
|
onReady: function() {
|
|
this.getLocation();
|
|
},
|
|
|
|
/**
|
|
* 生命周期函数--监听页面显示
|
|
*/
|
|
onShow: function() {
|
|
// this.setData({
|
|
// isShowAuth: false
|
|
// })
|
|
this.data.unClickDetail = false
|
|
this.data.unClickBtn = false
|
|
clearTimeout(s);
|
|
m = endM;
|
|
this.getAnnouncementsList();
|
|
},
|
|
|
|
/**
|
|
* 生命周期函数--监听页面隐藏
|
|
*/
|
|
onHide: function() {
|
|
endM = m;
|
|
clearTimeout(s);
|
|
},
|
|
|
|
/**
|
|
* 生命周期函数--监听页面卸载
|
|
*/
|
|
onUnload: function() {
|
|
|
|
},
|
|
|
|
/**
|
|
* 页面相关事件处理函数--监听用户下拉动作
|
|
*/
|
|
onPullDownRefresh: function() {
|
|
|
|
},
|
|
|
|
/**
|
|
* 页面上拉触底事件的处理函数
|
|
*/
|
|
onReachBottom: function() {
|
|
|
|
},
|
|
|
|
/**
|
|
* 用户点击右上角分享
|
|
*/
|
|
onShareAppMessage: function() {
|
|
return {
|
|
title: '智慧云馆'
|
|
}
|
|
},
|
|
|
|
// 公告滚动
|
|
lun() {
|
|
// m -= 10 / (wx.getSystemInfoSync().screenWidth / 750);
|
|
let that = this;
|
|
// that.setData({
|
|
// top: m
|
|
// })
|
|
|
|
// this.animation = animation;
|
|
let subHeight = 200 * (wx.getSystemInfoSync().screenWidth / 750);
|
|
let max = (that.data.noticeList.length - 1) * subHeight;
|
|
if (s) clearTimeout(s);
|
|
s = setTimeout(function() {
|
|
if (m * subHeight == max) {
|
|
|
|
m = 0;
|
|
let animation1 = wx.createAnimation({
|
|
delay: 0
|
|
})
|
|
this.animation1 = animation1;
|
|
this.animation1.translateY(-subHeight * m - (2 * (wx.getSystemInfoSync().screenWidth / 750))).step({
|
|
duration: 0,
|
|
timingFunction: 'step-start'
|
|
});
|
|
that.setData({
|
|
animationData: animation1.export()
|
|
})
|
|
that.lun()
|
|
} else {
|
|
m++;
|
|
let animation2 = wx.createAnimation({
|
|
delay: 0
|
|
})
|
|
|
|
this.animation2 = animation2;
|
|
this.animation2.translateY(-subHeight * m).step({
|
|
duration: 1000,
|
|
timingFunction: "linear",
|
|
});
|
|
that.setData({
|
|
animationData: animation2.export()
|
|
})
|
|
that.lun()
|
|
}
|
|
}, 2000);
|
|
},
|
|
|
|
// 切换列表
|
|
changeTip(e) {
|
|
let state = e.currentTarget.dataset.state;
|
|
this.setData({
|
|
state: state
|
|
})
|
|
// if (state == 3) {
|
|
// wx.showToast({
|
|
// title: '暂未开放，敬请期待',
|
|
// icon: 'none',
|
|
// duration: 2000
|
|
// })
|
|
// let list = [{
|
|
// longitude: this.data.longitude,
|
|
// latitude: this.data.latitude
|
|
// }];
|
|
// this.setData({
|
|
// includePoints: list
|
|
// })
|
|
// return;
|
|
// }
|
|
// this.getLngLat();
|
|
this.getLocation();
|
|
},
|
|
|
|
// 点击地图标记点气泡
|
|
clickCalloutTap(e) {
|
|
if (this.data.unClickDetail) {
|
|
return;
|
|
}
|
|
this.data.unClickDetail = true;
|
|
if (this.data.state == 1) {
|
|
wx.navigateTo({
|
|
url: `/pages/basketballGym/index?id=${e.markerId}`,
|
|
})
|
|
}
|
|
if (this.data.state == 2 || this.data.state == 3) {
|
|
wx.navigateTo({
|
|
url: `/pages/gymnasium/index?id=${e.markerId}`,
|
|
})
|
|
}
|
|
},
|
|
|
|
// 跳转详情列表
|
|
pushList() {
|
|
if (this.data.unClickBtn) {
|
|
return;
|
|
}
|
|
this.data.unClickBtn = false;
|
|
wx.navigateTo({
|
|
url: '/pages/sportsGroundList/index?state=' + this.data.state,
|
|
})
|
|
},
|
|
|
|
// 打电话
|
|
callPhoen() {
|
|
this.data.unClickBtn = false;
|
|
wx.makePhoneCall({
|
|
phoneNumber: '13636573054',
|
|
})
|
|
},
|
|
|
|
// 跳转个人中心
|
|
pushMine() {
|
|
if (this.data.unClickBtn) {
|
|
return;
|
|
}
|
|
this.data.unClickBtn = false;
|
|
if (!wx.getStorageSync("accessToken")) {
|
|
wx.removeStorageSync('history');
|
|
wx.navigateTo({
|
|
url: '/pages/login/index',
|
|
})
|
|
return
|
|
}
|
|
wx.navigateTo({
|
|
url: '/pages/mine/index',
|
|
})
|
|
},
|
|
|
|
// 获取公告列表
|
|
getAnnouncementsList() {
|
|
let that = this;
|
|
app.$api.announcements({}).then(res => {
|
|
this.setData({
|
|
noticeList: res.announcements
|
|
})
|
|
// 公告列表添加前后
|
|
// let len = this.data.noticeList.length
|
|
// if (len == 1 || len == 0) {
|
|
// return;
|
|
// }
|
|
// let list = [];
|
|
// for (let i = 0; i < len; i++) {
|
|
// list.push(this.data.noticeList[i]);
|
|
// }
|
|
// list.push(this.data.noticeList[0]);
|
|
// this.setData({
|
|
// noticeList: list
|
|
// })
|
|
// that.lun()
|
|
}, err => {
|
|
|
|
});
|
|
},
|
|
|
|
// 跳转公告详情
|
|
pusnNotice(e) {
|
|
let id = e.currentTarget.dataset.id;
|
|
wx.navigateTo({
|
|
url: `/pages/notice/index?id=${id}`,
|
|
success: function(res) {},
|
|
fail: function(res) {},
|
|
complete: function(res) {},
|
|
})
|
|
},
|
|
|
|
// 获取授权
|
|
setAuthSuccess(e) {
|
|
if (e.detail.authSetting['scope.userLocation']) {
|
|
this.getLocation();
|
|
this.setData({
|
|
isShowAuth: false
|
|
})
|
|
}
|
|
},
|
|
|
|
// 获取定位
|
|
getLocation() {
|
|
let list = [
|
|
// {
|
|
// // 中心
|
|
// longitude: 121.4715700000,
|
|
// latitude: 31.2336800000
|
|
// },
|
|
{
|
|
// 北
|
|
longitude: 121.3542938232,
|
|
latitude: 31.4409663733
|
|
},
|
|
{
|
|
// 东
|
|
longitude: 121.7051696777,
|
|
latitude: 31.2750297303
|
|
},
|
|
{
|
|
// 南
|
|
longitude: 121.4167785645,
|
|
latitude: 31.0317548780
|
|
},
|
|
{
|
|
// 西
|
|
longitude: 121.2135314941,
|
|
latitude: 31.2433336586
|
|
}
|
|
];
|
|
this.setData({
|
|
includePoints: list,
|
|
})
|
|
let that = this;
|
|
wx.getLocation({
|
|
type: 'gcj02',
|
|
success: function(res) {
|
|
that.setData({
|
|
latitude: res.latitude,
|
|
longitude: res.longitude,
|
|
})
|
|
that.getData({
|
|
latitude: res.latitude,
|
|
longitude: res.longitude,
|
|
zoom: 1
|
|
});
|
|
},
|
|
fail: function(res) {
|
|
console.log(res);
|
|
if (res.errMsg == 'getLocation:fail auth deny' || res.errMsg == 'getLocation:fail:auth denied') {
|
|
that.setData({
|
|
isShowAuth: true
|
|
})
|
|
}
|
|
},
|
|
})
|
|
},
|
|
|
|
// 获取数据
|
|
getData(e) {
|
|
wx.showLoading({
|
|
title: '加载中...',
|
|
mask: true,
|
|
})
|
|
app.$api.venuesMap({
|
|
latitude: e.latitude,
|
|
longitude: e.longitude,
|
|
type: this.data.state,
|
|
zoom: e.zoom
|
|
}).then(res => {
|
|
address = [];
|
|
let list = [
|
|
// {
|
|
// // 中心
|
|
// longitude: 121.4715700000,
|
|
// latitude: 31.2336800000
|
|
// },
|
|
{
|
|
// 北
|
|
longitude: 121.3542938232,
|
|
latitude: 31.4409663733
|
|
},
|
|
{
|
|
// 东
|
|
longitude: 121.7051696777,
|
|
latitude: 31.2750297303
|
|
},
|
|
{
|
|
// 南
|
|
longitude: 121.4167785645,
|
|
latitude: 31.0317548780
|
|
},
|
|
{
|
|
// 西
|
|
longitude: 121.2135314941,
|
|
latitude: 31.2433336586
|
|
}
|
|
];
|
|
|
|
|
|
for (let i = 0; i < res.venues.length; i++) {
|
|
let obj = {};
|
|
obj.id = res.venues[i].id;
|
|
obj.latitude = res.venues[i].latitude
|
|
obj.longitude = res.venues[i].longitude
|
|
if (this.data.state == 1) {
|
|
obj.iconPath = '../../images/14@3x.png'
|
|
}
|
|
if (this.data.state == 2) {
|
|
obj.iconPath = '../../images/13@3x.png'
|
|
}
|
|
if (this.data.state == 3) {
|
|
obj.iconPath = '../../images/12@3x.png'
|
|
}
|
|
|
|
list.push({
|
|
longitude: res.venues[i].longitude,
|
|
latitude: res.venues[i].latitude
|
|
})
|
|
|
|
obj.title = res.venues[i].name
|
|
obj.width = 40;
|
|
obj.height = 40
|
|
obj.callout = {
|
|
content: res.venues[i].name + '(点此进入)',
|
|
// color: '#fff',
|
|
// bgColor: '#000',
|
|
borderRadius: 15,
|
|
padding: 10,
|
|
display: 'BYCLICK'
|
|
};
|
|
address.push(obj);
|
|
}
|
|
this.setData({
|
|
includePoints: list,
|
|
markers: [{
|
|
id: 0,
|
|
latitude: this.data.latitude,
|
|
longitude: this.data.longitude,
|
|
iconPath: '../../images/11@3x.png',
|
|
width: 20,
|
|
height: 33
|
|
}, ...address]
|
|
})
|
|
}, err => {});
|
|
},
|
|
|
|
// 地图视野发生变化时触发
|
|
regionchange(e) {
|
|
return;
|
|
console.log(e);
|
|
if (e.type == 'end') {
|
|
this.getLngLat()
|
|
}
|
|
},
|
|
|
|
getLngLat: function() {
|
|
var that = this;
|
|
let centerLatitude = 0;
|
|
let centerLongitude = 0;
|
|
let zoom = 7;
|
|
mapCtx = wx.createMapContext("map4select");
|
|
mapCtx.getCenterLocation({
|
|
success: function(res) {
|
|
centerLatitude = res.latitude;
|
|
centerLongitude = res.longitude;
|
|
// 获取视野范围
|
|
that.getRegion(centerLatitude, centerLongitude)
|
|
}
|
|
})
|
|
mapCtx.getScale({
|
|
success: function(res) {
|
|
console.log("缩放级别", res);
|
|
}
|
|
})
|
|
},
|
|
|
|
// 获取视野范围
|
|
getRegion(centerLatitude, centerLongitude) {
|
|
let that = this;
|
|
mapCtx.getRegion({
|
|
success: function(res) {
|
|
let m = GetDistance(res.northeast.latitude, res.northeast.longitude, res.northeast.latitude, res.southwest.longitude);
|
|
if (m <= 152.9) {
|
|
zoom = 7;
|
|
} else if (m <= 1200) {
|
|
zoom = 6;
|
|
} else if (m <= 4900) {
|
|
zoom = 5;
|
|
} else if (m <= 39100) {
|
|
zoom = 4;
|
|
} else {
|
|
zoom = 3;
|
|
};
|
|
// that.getData({
|
|
// latitude: centerLatitude,
|
|
// longitude: centerLongitude,
|
|
// zoom: zoom
|
|
// });
|
|
}
|
|
})
|
|
},
|
|
|
|
// 回到开始
|
|
goFrist() {
|
|
let list = [{
|
|
longitude: this.data.longitude,
|
|
latitude: this.data.latitude
|
|
}];
|
|
// this.data.includePoints
|
|
this.setData({
|
|
includePoints: list
|
|
})
|
|
}
|
|
})
|
|
|
|
function Rad(d) {
|
|
return d * Math.PI / 180.0; //经纬度转换成三角函数中度分表形式。
|
|
}
|
|
|
|
//计算距离，参数分别为第一点的纬度，经度；第二点的纬度，经度
|
|
function GetDistance(lat1, lng1, lat2, lng2) {
|
|
var radLat1 = Rad(lat1);
|
|
var radLat2 = Rad(lat2);
|
|
var a = radLat1 - radLat2;
|
|
var b = Rad(lng1) - Rad(lng2);
|
|
var 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 * 6378.137; // 地球半径，千米;
|
|
s = Math.round(s * 10000) / 10000; //输出为公里
|
|
s = Math.round(s * 1000) / 1; //单位修改为米,取整
|
|
//s=s.toFixed(4);
|
|
return s;
|
|
}
|