Selaa lähdekoodia

【金茂地图初始化】

release
chenshengle 3 vuotta sitten
vanhempi
commit
b5c7243cfd
41 muutettua tiedostoa jossa 822 lisäystä ja 97 poistoa
  1. +2
    -1
      app.json
  2. +2
    -0
      config/config.js
  3. +11
    -7
      index/index.wxml
  4. +3
    -1
      index/passCar.js
  5. +3
    -1
      index/passCar.wxml
  6. +92
    -58
      index/searchbar.js
  7. +6
    -0
      pages/marketAtlas/marketAtlas.js
  8. +14
    -13
      pages/marketAtlas/marketAtlas.wxml
  9. +2
    -2
      pages/ques/ques.wxml
  10. +28
    -0
      pages2/component/FMAllLayerControl/FMAllLayerControl.js
  11. +4
    -0
      pages2/component/FMAllLayerControl/FMAllLayerControl.json
  12. +6
    -0
      pages2/component/FMAllLayerControl/FMAllLayerControl.wxml
  13. +11
    -0
      pages2/component/FMAllLayerControl/FMAllLayerControl.wxss
  14. BIN
      pages2/component/FMAllLayerControl/image/layer.png
  15. BIN
      pages2/component/FMAllLayerControl/image/layers.png
  16. +101
    -0
      pages2/component/FMButtonGroupsControl/FMButtonGroupsControl.js
  17. +4
    -0
      pages2/component/FMButtonGroupsControl/FMButtonGroupsControl.json
  18. +14
    -0
      pages2/component/FMButtonGroupsControl/FMButtonGroupsControl.wxml
  19. +23
    -0
      pages2/component/FMButtonGroupsControl/FMButtonGroupsControl.wxss
  20. +112
    -0
      pages2/component/FMScrollGroupsControl/FMScrollGroupsControl.js
  21. +4
    -0
      pages2/component/FMScrollGroupsControl/FMScrollGroupsControl.json
  22. +25
    -0
      pages2/component/FMScrollGroupsControl/FMScrollGroupsControl.wxml
  23. +11
    -0
      pages2/component/FMScrollGroupsControl/FMScrollGroupsControl.wxss
  24. BIN
      pages2/component/FMScrollGroupsControl/image/arrow1.png
  25. BIN
      pages2/component/FMScrollGroupsControl/image/arrow2.png
  26. BIN
      pages2/component/FMScrollGroupsControl/image/arrow3.png
  27. BIN
      pages2/component/FMScrollGroupsControl/image/arrow4.png
  28. BIN
      pages2/component/FMScrollGroupsControl/image/layer.png
  29. BIN
      pages2/component/FMScrollGroupsControl/image/layers.png
  30. +38
    -0
      pages2/component/FMViewModeControl/FMViewModeControl.js
  31. +4
    -0
      pages2/component/FMViewModeControl/FMViewModeControl.json
  32. +6
    -0
      pages2/component/FMViewModeControl/FMViewModeControl.wxml
  33. +12
    -0
      pages2/component/FMViewModeControl/FMViewModeControl.wxss
  34. BIN
      pages2/component/FMViewModeControl/image/2D.png
  35. BIN
      pages2/component/FMViewModeControl/image/3D.png
  36. +232
    -0
      pages2/fengMap/fengMap.js
  37. +10
    -0
      pages2/fengMap/fengMap.json
  38. +19
    -0
      pages2/fengMap/fengMap.wxml
  39. +13
    -0
      pages2/fengMap/fengMap.wxss
  40. +2
    -0
      pages2/js/fengmap.miniprogram.min.js
  41. +8
    -14
      project.config.json

+ 2
- 1
app.json Näytä tiedosto

@@ -80,7 +80,8 @@
"name": "pages2",
"independent": false,
"pages": [
"live/livelist/index"
"live/livelist/index",
"fengMap/fengMap"
]
}
],


+ 2
- 0
config/config.js Näytä tiedosto

@@ -355,6 +355,8 @@ var config = {
getRoomList: "/live/roomList",
//商城地图
getStoreMap:"/wxMallBuilding/getbuildingfloorlist",
//判断有没有蜂鸟地图
ifFengMap:'/fengniaomap/getConfig',
//分享小程序二维码
getQrcodeFx:"/user/userinfoQrCode",
},


+ 11
- 7
index/index.wxml Näytä tiedosto

@@ -52,11 +52,13 @@
<image src='{{typeLsit.sy_xfk.icon}}' mode='aspectFill'></image>
<view class="text">消费卡</view>
</view>
<!-- wx:if="{{liveFlag}}"否配置直播条件预览 -->
<view class='kjBox' bindtap='goLive'>
<image src='{{typeLsit.sy_zbt.icon}}' mode='aspectFill'></image>
<view class="text">直播厅</view>
<view class='kjBox' bindtap='gotogame'>
<image src='{{typeLsit.sy_yx.icon}}' mode='aspectFill'></image>
<view class="text">游戏</view>
</view>

<!-- <view class='kjBox' bindtap='gotogame'>
<image src='{{xingyun}}' mode='aspectFill' bindtap=''></image>
<view>游戏频道</view>
@@ -73,10 +75,12 @@
<image src='{{typeLsit.sy_jfsc.icon}}' mode='aspectFill'></image>
<view class="text">积分商城</view>
</view>
<view class='kjBox' bindtap='gotogame'>
<image src='{{typeLsit.sy_yx.icon}}' mode='aspectFill'></image>
<view class="text">游戏</view>
<!-- wx:if="{{liveFlag}}"否配置直播条件预览 -->
<view class='kjBox' bindtap='goLive' wx:if="{{liveFlag}}">
<image src='{{typeLsit.sy_zbt.icon}}' mode='aspectFill'></image>
<view class="text">直播厅</view>
</view>
<view class="kjBox" wx:if="{{!liveFlag}}"></view>
</view>
<!-- 频道 -->


+ 3
- 1
index/passCar.js Näytä tiedosto

@@ -198,7 +198,7 @@ Page({
paySuccess: function () {
wx.showModal({
title: '支付成功',
content: '请尽快离场',
content: '请15分钟内离场',
showCancel: false
})
},
@@ -209,9 +209,11 @@ Page({
})
},
bindfail: function (res) {
console.log(123)
console.log(res)
},
gotoCarMini: function (e) {
console.log(478)
var that = this
// etcp parkVendor1
// 泊链停车 parkVendor5


+ 3
- 1
index/passCar.wxml Näytä tiedosto

@@ -26,7 +26,7 @@
</view>
<!-- <view class='coupon clearfix' bindtap='gotoquan' wx:if="{{couponList.length>0}}"> -->
<view style="padding:0 25rpx;" class='coupon clearfix' bindtap='openTicketModal' wx:if="{{couponList.length>0&&stopFees.orderId}}">
<text class='fl'><text class='jians'>券</text>优惠券:</text>
<text class='fl'><text class='jians'>券</text>使用停车券:</text>
<view class="fr">
<text wx:if="{{quantitle}}">{{quantitle}}</text>
<text wx:else>{{totalTicketNum}}张可用</text>
@@ -78,6 +78,8 @@
</navigator>
<view wx:if="{{!canIUse}}" class='buy' data-flag="parkVendor1" bindtap='gotoCarMini'>立即支付</view>
</view>


<view class="buy-view" wx:if="{{stopFees.orderId&&stopFees.remainingFee>0&&parkVendor!=1&&parkVendor!=2&&parkVendor!=3&&parkVendor!=4&&parkVendor!=5&&extraDataFlag=='{}'}}">
<navigator bindfail="bindfail" path="{{generalPayPath}}" wx:if="{{canIUse}}" class='buy' target="miniProgram" open-type="navigate" app-id="{{generalAppId}}" version="{{carMiniVersion}}">
立即支付


+ 92
- 58
index/searchbar.js Näytä tiedosto

@@ -1,4 +1,4 @@
const navigationBarHeight = (getApp().statusBarHeight + 44)+"px"
const navigationBarHeight = (getApp().statusBarHeight + 44) + "px"
const Http = require("../utils/HttpBasics");
const imgurl = require("../utils/imgurl");
const config = require("../config/config");
@@ -11,20 +11,49 @@ Page({
data: {
navigationBarHeight,
lists: [],
merchantVoList:[],
merchantVoList: [],
indexId: 0,
businessId:0,
windowHeight:"",
page:1,
isFirstPage:false,
isLastPage:false,
businessId: 0,
windowHeight: "",
page: 1,
isFirstPage: false,
isLastPage: false,
teljpgUrl: imgurl.teljpg.url,
map: imgurl.map.url,//商场地图
map: imgurl.map.url, //商场地图
mapUrl: '/pages/marketAtlas/marketAtlas', //跳转地图的路径
},
getFemgMap() { //判断时候对接封了地图
Http.get({
url: config.api.ifFengMap
}).then(res => {
if (res.data) { //
let initMpa = {
appName: res.data.appName,
key: res.data.appKey,
defaultThemeName: res.data.themeId,
tenantId: res.data.tenantId,
mapId: res.data.mapId
}
console.log(initMpa, "initMpa")
this.setData({
mapUrl: `/pages2/fengMap/fengMap?initMap=${JSON.stringify(initMpa)}`
})
} else {
this.setData({
mapUrl: "/pages/marketAtlas/marketAtlas"
})

}
}).catch(err => {
this.setData({
mapUrl: "/pages/marketAtlas/marketAtlas"
})
})
},
//跳转到地图
goMap(){
goMap() {
wx.navigateTo({
url: '/pages/marketAtlas/marketAtlas',
url: this.data.mapUrl,
})
},
// 左侧点击事件
@@ -36,11 +65,11 @@ Page({
businessId: index
});
that.setData({
page:1
page: 1
})
that.getList(1, that.data.businessId);
},
goSearchBar(){
goSearchBar() {
wx.navigateTo({
url: '/pages/searchbar/searchbar',
})
@@ -48,7 +77,7 @@ Page({
/**
* 跳转到门店列表的详情页面
*/
gotoDetail(e){
gotoDetail(e) {
wx.navigateTo({
url: `/pages/index/searchbar/detail/index?id=${e.currentTarget.dataset.id}`
})
@@ -56,7 +85,7 @@ Page({
/**
* 生命周期函数--监听页面加载
*/
onLoad: function (options) {
onLoad: function(options) {
let that = this;
that.getBussiness();
that.getList(1, 0);
@@ -64,7 +93,8 @@ Page({
title: '加载中...',
})
},
onShow(){
onShow() {
this.getFemgMap()
let that = this;
if (typeof this.getTabBar === 'function' &&
that.getTabBar()) {
@@ -73,43 +103,47 @@ Page({
})
};
wx.getSystemInfo({
success: function (res) {
success: function(res) {
that.setData({
windowHeight: res.windowHeight
windowHeight: res.windowHeight
})
},
})
},
getBussiness:function(){
getBussiness: function() {
let that = this;
Http.get({
url: config.api.businessList,
data:{
filter:1
}
}).then(res => {
that.setData({
lists: [{ id: 0, title: "全部", type: 1 }].concat(res.data)
});
})
.catch(err => {
wx.showToast({
title: err.errMsg,
icon: 'none',
duration: 2000,
mask: false
});
})
url: config.api.businessList,
data: {
filter: 1
}
}).then(res => {
that.setData({
lists: [{
id: 0,
title: "全部",
type: 1
}].concat(res.data)
});
})
.catch(err => {
wx.showToast({
title: err.errMsg,
icon: 'none',
duration: 2000,
mask: false
});
})
},
getList: function (page, businessId) {
getList: function(page, businessId) {
let that = this;
let data;
if(businessId == 0){
if (businessId == 0) {
data = {
pageNum: page,
pageSize: 8
}
}else{
} else {
data = {
pageNum: page,
pageSize: 8,
@@ -117,25 +151,25 @@ Page({
}
}
Http.get({
url: config.api.merchantList,
data: data
}).then(res => {
wx.hideLoading();
if (page == 1) {
url: config.api.merchantList,
data: data
}).then(res => {
wx.hideLoading();
if (page == 1) {
that.setData({
merchantVoList: [],
})
}
var tmpArr = that.data.merchantVoList;
tmpArr.push.apply(tmpArr, res.data.list);
// console.log(tmpArr)
that.setData({
merchantVoList: [],
merchantVoList: tmpArr,
isFirstPage: res.data.isFirstPage,
isLastPage: res.data.isLastPage
})
}
var tmpArr = that.data.merchantVoList;
tmpArr.push.apply(tmpArr, res.data.list);
// console.log(tmpArr)
that.setData({
merchantVoList: tmpArr,
isFirstPage: res.data.isFirstPage,
isLastPage: res.data.isLastPage
// console.log(that.data.merchantVoList)
})
// console.log(that.data.merchantVoList)
})
.catch(err => {
wx.hideLoading();
wx.showToast({
@@ -146,7 +180,7 @@ Page({
});
})
},
phone: function (e) {
phone: function(e) {
let that = this;
if (e.currentTarget.dataset.merchantlinkphone) {
wx.makePhoneCall({
@@ -157,7 +191,7 @@ Page({
/**
* 页面上拉触底事件的处理函数
*/
onReachBottom: function () {
onReachBottom: function() {
let that = this;
that.data.page++;
that.setData({
@@ -166,8 +200,8 @@ Page({
console.log(that.data.page);
// 如果是最后一页
//就不发送请求
if (!that.data.isLastPage || that.data.isFirstPage && that.data.isLastPage){
if (!that.data.isLastPage || that.data.isFirstPage && that.data.isLastPage) {
that.getList(that.data.page, that.data.businessId);
}
}
})
})

+ 6
- 0
pages/marketAtlas/marketAtlas.js Näytä tiedosto

@@ -13,6 +13,7 @@ Page({
tierFalg:0,//楼层标识
dataLsit:[],//楼层信息
tmpePicture:'',//零时存放 图片
url:"",
},
lookimg(){
app.globalData.previewFlag = true
@@ -21,6 +22,7 @@ Page({
urls: [this.data.tmpePicture] // 需要预览的图片http链接列表
})
},
setFalgFloor(e){//设置选中楼层
let index = e.currentTarget.dataset.index
this.setData({
@@ -88,6 +90,10 @@ Page({
*/
onLoad: function (options) {
this.getStoreMap()
this.setData({
url: config.url +'/wapmaphtml/index.html'
})
console.log(this.data.url,"url")
},

/**


+ 14
- 13
pages/marketAtlas/marketAtlas.wxml Näytä tiedosto

@@ -2,24 +2,25 @@
</navbar>
<view style="height:{{navigationBarHeight}} "></view>

<view class="Box">
<view class="le_box">
<view class="{{tierFalg==index?'floor_a':'floor'}}" wx:for="{{dataLsit[falgFloor].floors}}" wx:key="index" bindtap="setTierFalg" data-index="{{index}}">
<text class="text">{{item.floorName}}</text>
<!-- <text class="active" wx:if="{{tierFalg==index}}"></text> -->
</view>
<view class="area">
<view class="{{falgFloor==index?'areaItemActivity':'areaItem'}}" wx:for="{{dataLsit}}" wx:key="index" bindtap="setFalgFloor" data-index="{{index}}">{{item.buildingName}}</view>
<!-- <view class="areaItem">B座</view> -->
</view>
<view class="Box" >
<view class="le_box">
<view class="{{tierFalg==index?'floor_a':'floor'}}" wx:for="{{dataLsit[falgFloor].floors}}" wx:key="index" bindtap="setTierFalg" data-index="{{index}}">
<text class="text">{{item.floorName}}</text>
<!-- <text class="active" wx:if="{{tierFalg==index}}"></text> -->
</view>
<view class="area">
<view class="{{falgFloor==index?'areaItemActivity':'areaItem'}}" wx:for="{{dataLsit}}" wx:key="index" bindtap="setFalgFloor" data-index="{{index}}">{{item.buildingName}}</view>
<!-- <view class="areaItem">B座</view> -->
</view>
</view>

<view class="dt_box">
<view class="ri_box">
<image mode="widthFix" class="dt_2_img" src="{{tmpePicture}}" wx:if="{{tmpePicture!=''}}" bindtap="lookimg" bindload="imgload"></image>
<!-- <image class="dt_2_img_w_H" src="{{tmpePicture}}" wx:if="{{tmpePicture!=''}}" bindtap="lookimg" bindload="imgload" wx:if="{{img_W_H_flag}}"></image> -->
<!-- <image class="dt_2_img_w_H" src="{{tmpePicture}}" wx:if="{{tmpePicture!=''}}" bindtap="lookimg" bindload="imgload" wx:if="{{img_W_H_flag}}"></image> -->
<view class="noIMg" wx:if="{{tmpePicture==''}}">该商场暂未配置</view>
</view>
</view>
</view>
</view>
<!-- <web-view wx:if="{{ifFengMap}}" src="{{url}}" ></web-view> -->

+ 2
- 2
pages/ques/ques.wxml Näytä tiedosto

@@ -3,7 +3,7 @@
<view class='contain' >
<view class='content'>
<view class="tit"><view class='Q'>Q</view><view class='right'>我怎么添加车牌呢?</view></view>
<view class='description'>首次使用“停车缴费”的用户需绑定车牌号,即可为车辆进行缴费 。您可以最多添加张车牌。</view>
<view class='description'>首次使用“停车缴费”的用户需绑定车牌号,即可为车辆进行缴费 。您可以最多添加张车牌。</view>
</view>
<view class='content'>
<view class="tit"><view class='Q'>Q</view><view class='right'>有哪些方式可以支持停车费?</view></view>
@@ -31,7 +31,7 @@
</view>
<view class='content'>
<view class="tit"><view class='Q'>Q</view><view class='right'>我为什么绑定(解绑)不了车牌?</view></view>
<view class='description'>每位用户最多可同时绑定张车牌。当您绑定的车牌在停车场内是无法解绑车牌的,支付离场后才可以进行变更哦!</view>
<view class='description'>每位用户最多可同时绑定张车牌。当您绑定的车牌在停车场内是无法解绑车牌的,支付离场后才可以进行变更哦!</view>
</view>
<view class='content'>
<view class="tit"><view class='Q'>Q</view><view class='right'>每个用户可以绑定几个车牌?</view></view>


+ 28
- 0
pages2/component/FMAllLayerControl/FMAllLayerControl.js Näytä tiedosto

@@ -0,0 +1,28 @@
// component/FMAllLayerControl/FMAllLayerControl.js
Component({
/**
* 组件的属性列表
*/
properties: {
allLayer: {
type: Boolean,
}
},

/**
* 组件的初始数据
*/
data: {
btnUrl: './image/',
},

/**
* 组件的方法列表
*/
methods: {
// 切换单多层
switchLayers: function () {
this.triggerEvent('switchLayers');
},
}
})

+ 4
- 0
pages2/component/FMAllLayerControl/FMAllLayerControl.json Näytä tiedosto

@@ -0,0 +1,4 @@
{
"component": true,
"usingComponents": {}
}

+ 6
- 0
pages2/component/FMAllLayerControl/FMAllLayerControl.wxml Näytä tiedosto

@@ -0,0 +1,6 @@
<!-- component/FMAllLayerControl/FMAllLayerControl.wxml -->
<view class="fm-control-layer">
<cover-view style="padding: 20rpx;cursor: pointer;" bindtap="switchLayers">
<cover-image src="{{btnUrl}}{{allLayer ? 'layers' :'layer'}}.png" style="width: 44rpx; height: 44rpx;"></cover-image>
</cover-view>
</view>

+ 11
- 0
pages2/component/FMAllLayerControl/FMAllLayerControl.wxss Näytä tiedosto

@@ -0,0 +1,11 @@
/* component/FMAllLayerControl/FMAllLayerControl.wxss */
.fm-control-layer {
width: 84rpx;
position: absolute;
background-color: white;
box-shadow: rgba(0, 0, 0, 0.3) 4rpx 4rpx 6rpx;
border-radius: 4rpx;
top: 328rpx;
left: 40rpx;
z-index: 1;
}

BIN
pages2/component/FMAllLayerControl/image/layer.png Näytä tiedosto

Before After
Leveys: 42  |  Korkeus: 42  |  Koko: 623 B

BIN
pages2/component/FMAllLayerControl/image/layers.png Näytä tiedosto

Before After
Leveys: 40  |  Korkeus: 40  |  Koko: 1.1 KiB

+ 101
- 0
pages2/component/FMButtonGroupsControl/FMButtonGroupsControl.js Näytä tiedosto

@@ -0,0 +1,101 @@
// component/FMScrollGroupsControl/FMScrollGroupsControl.js
Component({
/**
* 组件的属性列表
*/
properties: {
//楼层数组
groupIDs: {
type: Array,
value: null
},
//视野内显示多少个按钮,可手触上下滚动
showBtnCount: {
type: Number,
value: 0,
observer: function (newVal, oldVal) {
console.log('height----', this.properties.showBtnCount * 84);
if (this.properties.showBtnCount < this.properties.groupIDs.length) {
this.setData({
needArrow: true,
scrollHeight: this.properties.showBtnCount * 84
})
}
}
},
//当前的聚焦楼层id
focusGroupID: {
type: Number,
value: 1,
observer: function (newVal, oldVal) {
console.log("focusGroupID", this.properties.focusGroupID)
this._setFocusGroupName(this.properties.focusGroupID);
}
},
// 展开控件
expand: {
type: Boolean,
value: true,
observer: function (newVal, oldVal) {
this.setData({
isShowList: newVal,
})
}
},
// 是否允许展开控件操作
enableExpand: {
type: Boolean,
value: true,
},
},

/**
* 组件的初始数据
*/
data: {
scrollHeight: 250,
focusGroupName: "F1",
isShowList: true,
},

/**
* 组件的方法列表
*/
methods: {
/**
* 切换聚焦楼层
* @param {*} e
*/
switchGroup: function (e) {
let focusId = e.currentTarget.dataset.gid;
this.triggerEvent('switchGroup', focusId);
this._setFocusGroupName(focusId);
},

/**
* 收起下拉压缩
*/
folderGroupBtns: function () {
if (!this.properties.enableExpand) return;
this.setData({
isShowList: !this.data.isShowList
})
},

/**
* 设置聚焦楼层的楼层名称
* @param {*} gid 聚焦楼层id
*/
_setFocusGroupName: function (gid) {
let group = this.properties.groupIDs.find((gd) => gd.gid === gid);
if (group) {
this.setData({
focusGroupName: group.gname
})

console.log(group.gname);
}
}

}
})

+ 4
- 0
pages2/component/FMButtonGroupsControl/FMButtonGroupsControl.json Näytä tiedosto

@@ -0,0 +1,4 @@
{
"component": true,
"usingComponents": {}
}

+ 14
- 0
pages2/component/FMButtonGroupsControl/FMButtonGroupsControl.wxml Näytä tiedosto

@@ -0,0 +1,14 @@
<!-- component/FMScrollGroupsControl/FMScrollGroupsControl.wxml -->
<view class="fm-control-groups-btn" style="width: 84rpx; height: 84rpx; position: absolute; background-color: white; box-shadow: rgba(0, 0, 0, 0.3) 4rpx 4rpx 6rpx; border-radius: 4rpx; text-align: center; cursor: pointer; font-size: 0.8em; font-weight: bold; text-transform: uppercase; line-height: 84rpx; color: rgb(30, 130, 250);" bindtap="folderGroupBtns">
{{focusGroupName}}
</view>
<scroll-view class="fm-layer-list fm-groups" scroll-y="true" style="overflow: hidden; height: {{scrollHeight}}rpx;" scroll-into-view="gid_{{focusGroupID}}" scroll-with-animation="true" wx:if="{{isShowList === true}}">
<view wx:for="{{groupIDs}}" wx:key="key">
<view id="gid_{{item.gid}}" style="display: inline-block; text-align: center; width: 84rpx; height: 84rpx; line-height: 84rpx; margin: 0px; cursor: pointer; font-size: 0.8em; font-weight: bold; color: rgb(102, 102, 102);" bindtap="switchGroup" data-gid="{{item.gid}}">
<view style="color:{{focusGroupID == item.gid ? 'rgb(30, 130, 250)':'rgb(102, 102, 102)'}}; text-transform: uppercase;">
{{item.gname}}
</view>
</view>
<view wx:if="{{item.gid !== 1}}" style="height: 1px; border-top: 1px solid rgba(153, 153, 153, 0.45); border-right: none; border-bottom: none; border-left: none; border-image: initial; width: 60%; margin: 0px 20%;"></view>
</view>
</scroll-view>

+ 23
- 0
pages2/component/FMButtonGroupsControl/FMButtonGroupsControl.wxss Näytä tiedosto

@@ -0,0 +1,23 @@
/* component/FMScrollGroupsControl/FMScrollGroupsControl.wxss */
.fm-control-groups-btn {
width: 84rpx;
height: 84px;
position: absolute;
background-color: white;
box-shadow: rgba(0, 0, 0, 0.3) 4rpx 4rpx 6rpx;
border-radius: 4rpx;
top: 40rpx;
left: 40rpx;
z-index: 1;
}

.fm-layer-list {
width: 84rpx;
position: absolute;
background-color: white;
box-shadow: rgba(0, 0, 0, 0.3) 4rpx 4rpx 6rpx;
border-radius: 4rpx;
top: 184rpx;
left: 40rpx;
z-index: 1;
}

+ 112
- 0
pages2/component/FMScrollGroupsControl/FMScrollGroupsControl.js Näytä tiedosto

@@ -0,0 +1,112 @@
// component/FMScrollGroupsControl/FMScrollGroupsControl.js
Component({
/**
* 组件的属性列表
*/
properties: {
//楼层数组
groupIDs: {
type: Array,
value: null
},
//视野内显示多少个按钮,可手触上下滚动
showBtnCount: {
type: Number,
value: 0,
observer: function (newVal, oldVal) {
// console.log('height----', this.properties.showBtnCount * 84);
if (this.properties.showBtnCount < this.properties.groupIDs.length) {
this.setData({
needArrow: true,
scrollHeight: this.properties.showBtnCount * 84
})
}
}
},
//当前的聚焦楼层id
focusGroupID: {
type: Number,
value: 1,
observer: function (newVal, oldVal) {
console.log("focusGroupID")
this._setArrowBtnStatus(this.properties.focusGroupID);
}
},
allLayer: {
type: Boolean
}
},

/**
* 组件的初始数据
*/
data: {
btnUrl: './image/',
scrollHeight: 250,
isTop: false,
isBottom: true,
needArrow: false
},

/**
* 组件的方法列表
*/
methods: {
/**
* 切换聚焦楼层
* @param {*} e
*/
switchGroup: function (e) {
let focusId = e.currentTarget.dataset.gid;
this.triggerEvent('switchGroup', focusId);

this._setArrowBtnStatus(focusId);
},

/**
* 设置上下箭头按钮的状态
* @param {*} focusId 聚焦楼层id
*/
_setArrowBtnStatus: function (focusId) {
if (focusId === 1) {
this.setData({
isBottom: true
})
} else if (focusId === this.properties.groupIDs.length - 1) {
this.setData({
isTop: true
})
} else {
this.setData({
isTop: false,
isBottom: false
})
}
},

/**
* 切换单层多层
*/
switchLayers: function () {
this.triggerEvent('switchLayers');
},

/**
* 向上切换楼层
*/
goTop: function () {
let gid = this.properties.focusGroupID + 1;
this.triggerEvent('switchGroup', gid);
this._setArrowBtnStatus(gid);
},

/**
* 向下切换楼层
*/
goBottom: function () {
let gid = this.properties.focusGroupID - 1;
this.triggerEvent('switchGroup', gid);
this._setArrowBtnStatus(gid);
}
}
})

+ 4
- 0
pages2/component/FMScrollGroupsControl/FMScrollGroupsControl.json Näytä tiedosto

@@ -0,0 +1,4 @@
{
"component": true,
"usingComponents": {}
}

+ 25
- 0
pages2/component/FMScrollGroupsControl/FMScrollGroupsControl.wxml Näytä tiedosto

@@ -0,0 +1,25 @@
<!-- component/FMScrollGroupsControl/FMScrollGroupsControl.wxml -->
<view class='fm-control-groups'>
<cover-view class="fm-control-groups-layer fm-btn-layer" style="padding: 20rpx; cursor: pointer;" bindtap="switchLayers">
<cover-image wx:if="{{!allLayer}}" src="{{btnUrl}}layer.png" style="width: 44rpx; height: 44rpx;"></cover-image>
<cover-image wx:else src="{{btnUrl}}layers.png" style="width: 44rpx; height: 44rpx;"></cover-image>
</cover-view>
<cover-view wx:if="{{needArrow}}" bindtap="goTop" class="scroll" style="height: 18px; cursor: pointer;">
<cover-image wx:if="{{!isTop}}" src="{{btnUrl}}arrow1.png" style="width: 20rpx; height: 12rpx; margin-left:32rpx"></cover-image>
<cover-image wx:else src="{{btnUrl}}arrow3.png" style="width: 20rpx; height: 12rpx; margin-left:32rpx"></cover-image>
</cover-view>
<scroll-view class="fm-layer-list" scroll-y="true" style="overflow: hidden; height: {{scrollHeight}}rpx;" scroll-into-view="gid_{{focusGroupID}}" scroll-with-animation="true">
<view wx:for="{{groupIDs}}" wx:key="key">
<view id="gid_{{item.gid}}" style="display: inline-block; text-align: center; width: 84rpx; height: 84rpx; line-height: 84rpx; margin: 0px; cursor: pointer; font-size: 0.8em; font-weight: bold; color: rgb(102, 102, 102);" bindtap="switchGroup" data-gid="{{item.gid}}">
<view style="color:{{focusGroupID == item.gid ? 'rgb(30, 130, 250)':'rgb(102, 102, 102)'}};text-transform: uppercase;">
{{item.gname}}
</view>
</view>
<view wx:if="{{item.gid !== 1}}" style="height: 1px; border-top: 1px solid rgba(153, 153, 153, 0.45); border-right: none; border-bottom: none; border-left: none; border-image: initial; width: 60%; margin: 0px 20%;"></view>
</view>
</scroll-view>
<cover-view wx:if="{{needArrow}}" class="scroll" style="height: 18px; cursor: pointer;">
<cover-image wx:if="{{!isBottom}}" bindtap="goBottom" src="{{btnUrl}}arrow2.png" style="width: 20rpx; height: 12rpx; margin-left:32rpx"></cover-image>
<cover-image wx:else src="{{btnUrl}}arrow4.png" style="width: 20rpx; height: 12rpx; margin-left:32rpx"></cover-image>
</cover-view>
</view>

+ 11
- 0
pages2/component/FMScrollGroupsControl/FMScrollGroupsControl.wxss Näytä tiedosto

@@ -0,0 +1,11 @@
/* component/FMScrollGroupsControl/FMScrollGroupsControl.wxss */
.fm-control-groups {
width: 84rpx;
position: absolute;
background-color: white;
box-shadow: rgba(0, 0, 0, 0.3) 4rpx 4rpx 6rpx;
border-radius: 4rpx;
/* top: 40rpx; */
bottom: 350rpx;
right: 40rpx;
}

BIN
pages2/component/FMScrollGroupsControl/image/arrow1.png Näytä tiedosto

Before After
Leveys: 10  |  Korkeus: 6  |  Koko: 266 B

BIN
pages2/component/FMScrollGroupsControl/image/arrow2.png Näytä tiedosto

Before After
Leveys: 10  |  Korkeus: 6  |  Koko: 267 B

BIN
pages2/component/FMScrollGroupsControl/image/arrow3.png Näytä tiedosto

Before After
Leveys: 10  |  Korkeus: 6  |  Koko: 259 B

BIN
pages2/component/FMScrollGroupsControl/image/arrow4.png Näytä tiedosto

Before After
Leveys: 10  |  Korkeus: 6  |  Koko: 257 B

BIN
pages2/component/FMScrollGroupsControl/image/layer.png Näytä tiedosto

Before After
Leveys: 42  |  Korkeus: 42  |  Koko: 623 B

BIN
pages2/component/FMScrollGroupsControl/image/layers.png Näytä tiedosto

Before After
Leveys: 40  |  Korkeus: 40  |  Koko: 1.1 KiB

+ 38
- 0
pages2/component/FMViewModeControl/FMViewModeControl.js Näytä tiedosto

@@ -0,0 +1,38 @@
// component/FMViewModeControl/FMViewModeControl.js
Component({
/**
* 组件的属性列表
*/
properties: {
// 2、3D状态
is3D: {
type: Boolean,
value: true,
observer: function (newVal, oldVal) {
// console.log("is allLayer")
this.setData({
viewMode: newVal ? '3D' : '2D'
})
}
}

},

/**
* 组件的初始数据
*/
data: {
btnUrl: './image/',
viewMode: '3D',
},

/**
* 组件的方法列表
*/
methods: {
// 切换2、3D状态
changeMode() {
this.triggerEvent('changeMode');
}
}
})

+ 4
- 0
pages2/component/FMViewModeControl/FMViewModeControl.json Näytä tiedosto

@@ -0,0 +1,4 @@
{
"component": true,
"usingComponents": {}
}

+ 6
- 0
pages2/component/FMViewModeControl/FMViewModeControl.wxml Näytä tiedosto

@@ -0,0 +1,6 @@
<!-- component/FMViewModeControl/FMViewModeControl.wxml -->
<view class="fm-control-mode">
<cover-view style="cursor: pointer;" bindtap="changeMode">
<cover-image src="{{btnUrl}}{{viewMode}}.png" style="width: 76rpx; height: 76rpx;margin:4rpx auto;"></cover-image>
</cover-view>
</view>

+ 12
- 0
pages2/component/FMViewModeControl/FMViewModeControl.wxss Näytä tiedosto

@@ -0,0 +1,12 @@
/* component/FMViewModeControl/FMViewModeControl.wxss */
.fm-control-mode {
width: 84rpx;
height: 84rpx;
position: absolute;
background-color: white;
box-shadow: rgba(0, 0, 0, 0.3) 4rpx 4rpx 6rpx;
border-radius: 4rpx;
bottom: 700rpx;
right: 40rpx;
z-index: 1;
}

BIN
pages2/component/FMViewModeControl/image/2D.png Näytä tiedosto

Before After
Leveys: 38  |  Korkeus: 38  |  Koko: 823 B

BIN
pages2/component/FMViewModeControl/image/3D.png Näytä tiedosto

Before After
Leveys: 38  |  Korkeus: 38  |  Koko: 823 B

+ 232
- 0
pages2/fengMap/fengMap.js Näytä tiedosto

@@ -0,0 +1,232 @@
// pages/FMController/index.js

import { fengmap } from '../js/fengmap.miniprogram.min.js';
const navigationBarHeight = (getApp().statusBarHeight + 44) + 'px'
const Http = require("../../utils/HttpBasics");
const config = require("../../config/config");
let app = getApp();
Page({

/**
* 页面的初始数据
*/
data: {
mapLoaded: false, //地图是否加载完成
focusGroupID: 1,
mapGroupIDs: [],
is3D: true,
isAllLayer: false,
initMap:{},
},
// 定义全局map变量
fmap: null,

/**
* 生命周期函数--监听页面加载
*/
onLoad: function (options) {
this.setData({
initMap: JSON.parse(options.initMap)
})
},

/**
* 生命周期函数--监听页面初次渲染完成
*/
onReady() {
console.log(this.data.initMap)
// 获取canvas
wx.createSelectorQuery().select('#fengMap').node().exec((res) => {
const canvas = res[0].node;
this.canvas = canvas

wx.createSelectorQuery().select("#temp").node().exec((tempRes) => {
const tmpCanvas = tempRes[0].node;

const fmapID = this.data.initMap.mapId;

const mapOptions = {
//必要,地图容器
canvas: canvas,
// 必要,2d画布
tempCanvas: tmpCanvas,
// 地图默认旋转角度
defaultControlsPose: 90,
// 地图默认倾斜角
defaultTiltAngle: 60,
// 初始二维/三维状态,默认3D显示
defaultViewMode: this.data.is3D ? fengmap.FMViewMode.MODE_3D : fengmap.FMViewMode.MODE_2D,
// 设置初始指南针的偏移量
compassOffset: [40, 40],
// 设置指南针大小
compassSize: 48,
//必要,地图应用名称,通过蜂鸟云后台创建
appName: this.data.initMap.appName,
//必要,地图应用密钥,通过蜂鸟云后台获取
key: this.data.initMap.key,
mapServerURL: config.url + `/fengniaoMapfile/${this.data.initMap.tenantId}/${this.data.initMap.mapId}`,
mapThemeURL: config.url + `/fengniaoMapfile/${this.data.initMap.tenantId}/theme/`,
defaultThemeName: this.data.initMap.defaultThemeName,
defaultMapScaleLevel:19,
// compassOffset:[28,100]
};
console.log(mapOptions,"mapOptions")

//初始化地图对象
this.fmap = new fengmap.FMMap(mapOptions);

//打开Fengmap服务器的地图数据和主题
this.fmap.openMapById(fmapID, function (error) {
//打印错误信息
// console.log(error);
});

//地图加载完成事件
this.fmap.on('loadComplete', () => {
console.log('地图加载完成');

this.setData({
mapLoaded: true
})

// 设置楼层数据
this.loadScrollFloorCtrl();

// 显示指北针
this.showCompass();
})
})
})
},
/**
* 生命周期函数--监听页面卸载
*/
onUnload: function () {
if (this.fmap) {
this.fmap.dispose();
this.fmap = null;
}
},
// 手指触摸动作开始
touchStart(e) {
this.canvas.dispatchTouchEvent({
...e,
type: 'touchstart'
})
},
// 手指触摸后移动
touchMove(e) {
this.canvas.dispatchTouchEvent({
...e,
type: 'touchmove'
})
},
// 手指触摸动作结束
touchEnd(e) {
this.canvas.dispatchTouchEvent({
...e,
type: 'touchend'
})
},

/**
* 显示指北针
*/
showCompass() {
/**
* 显示指北针,设置背景色需要在加载指北针之前设置
* */
// this.fmap.compass.setBgImage('../../images/compass_bg.png'); //设置背景图片
// this.fmap.compass.setFgImage('../../images/compass_fg.png'); //设置前景图片
this.fmap.showCompass = true;

// 点击指北针事件, 使角度归0
this.fmap.on('mapClickCompass', () => {
this.fmap.rotateTo({
//设置角度
to: 0,
//动画持续时间,默认为。3秒
duration: 0.3,
callback: function () { //回调函数
console.log('rotateTo complete!');
}
})
});
},

/**
* 2D/3D切换
*/
changeMode() {
if (this.fmap) {
if (!this.data.is3D) {
// 切换地图为三维模式
this.fmap.viewMode = fengmap.FMViewMode.MODE_3D;
} else {
// 切换地图为二维模式
this.fmap.viewMode = fengmap.FMViewMode.MODE_2D;
}
}
//更改状态
this.setData({
is3D: !this.data.is3D
})
},


///////////////////////////////////////////////
// 楼层控件回调事件(start)
//////////////////////////////////////////////
// 设置楼层数据
loadScrollFloorCtrl: function () {
// 获取楼层id
let groupIDs = [];
this.fmap.listGroups.map((ls) => {
let obj = {
alias: ls.alias,
gid: ls.gid,
gname: ls.gname
}
groupIDs.push(obj);
return obj;
});

this.setData({
mapGroupIDs: groupIDs.reverse(),
focusGroupID: this.fmap.focusGroupID
})

},
// 切换楼层
switchGroup(e) {
if (this.fmap) {
this.fmap.focusGroupID = e.detail;
this.setData({
focusGroupID: e.detail
})
}
},

/**
* 切换单、多层
* @param {*} e
*/
switchLayers() {
if (this.fmap) {
if (!this.data.isAllLayer) {
this.fmap.visibleGroupIDs = this.fmap.groupIDs;
} else {
this.fmap.visibleGroupIDs = [this.fmap.focusGroupID];
}
}
//更改状态
this.setData({
isAllLayer: !this.data.isAllLayer
})
}

///////////////////////////////////////////////
//楼层控件回调事件(end)
//////////////////////////////////////////////
})

+ 10
- 0
pages2/fengMap/fengMap.json Näytä tiedosto

@@ -0,0 +1,10 @@
{
"navigationBarTitleText": "UI控件",
"usingComponents": {
"FMScrollGroupsControl": "../component/FMScrollGroupsControl/FMScrollGroupsControl",
"FMButtonGroupsControl": "../component/FMButtonGroupsControl/FMButtonGroupsControl",
"FMViewModeControl": "../component/FMViewModeControl/FMViewModeControl",
"FMAllLayerControl": "../component/FMAllLayerControl/FMAllLayerControl",
"navbar": "../../components/navbar/navbar"
}
}

+ 19
- 0
pages2/fengMap/fengMap.wxml Näytä tiedosto

@@ -0,0 +1,19 @@
<!-- pages/FMController/index.wxml -->
<navbar home back text="商场地图">
</navbar>
<view style="height:{{navigationBarHeight}} "></view>
<view class="container">
<!-- 加载地图容器 -->
<canvas type="webgl" id="fengMap" style="width: 100%; height: 100%;" disable-scroll bindtouchstart="touchStart" bindtouchmove="touchMove" bindtouchend="touchEnd">
<!-- 楼层控件一 滚动型楼层控件 -->
<FMScrollGroupsControl id="scrollGroupsControl" wx:if="{{mapLoaded == true }}" focusGroupID="{{focusGroupID}}" groupIDs="{{mapGroupIDs}}" allLayer="{{isAllLayer}}" showBtnCount="3" bind:switchGroup="switchGroup" bind:switchLayers="switchLayers" />
<!-- 楼层控件二 按钮型楼层控件 -->
<!-- <FMButtonGroupsControl id="buttonGroupsControl" wx:if="{{mapLoaded == true }}" focusGroupID="{{focusGroupID}}" groupIDs="{{mapGroupIDs}}" showBtnCount="3" bind:switchGroup="switchGroup" /> -->
<!-- 2、3D控件 -->
<FMViewModeControl wx:if="{{mapLoaded == true }}" is3D="{{is3D}}" bind:changeMode="changeMode" />
<!-- 单、多楼层控件 -->
<!-- <FMAllLayerControl wx:if="{{mapLoaded == true }}" allLayer="{{isAllLayer}}" bind:switchLayers="switchLayers" /> -->
</canvas>
<!-- 2d画布 -->
<canvas type="2d" id="temp"></canvas>
</view>

+ 13
- 0
pages2/fengMap/fengMap.wxss Näytä tiedosto

@@ -0,0 +1,13 @@
/* pages/FMController/index.wxss */
.container {
height: 100vh;
overflow: hidden;
}
#temp{
position: fixed;
top:0;
left: -100%;
}
page{
padding-bottom:0;
}

+ 2
- 0
pages2/js/fengmap.miniprogram.min.js
File diff suppressed because it is too large
Näytä tiedosto


+ 8
- 14
project.config.json Näytä tiedosto

@@ -61,13 +61,6 @@
"miniprogram": {
"current": -1,
"list": [
{
"id": 0,
"name": "签到",
"pathName": "pages/activityCalendar/activityCalendar",
"query": "",
"scene": null
},
{
"id": 1,
"name": "直播列表",
@@ -110,13 +103,6 @@
"query": "",
"scene": null
},
{
"id": -1,
"name": "投书建议",
"pathName": "pages/complaint/complaint",
"query": "",
"scene": null
},
{
"id": 8,
"name": "pages/questionnaire/questionnaireLsit/questionnaireLsit",
@@ -128,8 +114,16 @@
"id": -1,
"name": "index/index",
"pathName": "index/index",
"query": "",
"scene": 1036,
"referrerInfo": {}
},
{
"id": 8,
"name": "pages2/fengMap/fengMap",
"pathName": "pages2/fengMap/fengMap",
"query": "",
"scene": null
}
]
}


Ladataan…
Peruuta
Tallenna