Compare commits
2 Commits
Author | SHA1 | Date | |
---|---|---|---|
0642114ef9 | |||
0ab027734f |
4
app.json
4
app.json
@ -23,8 +23,8 @@
|
|||||||
"pages/circularize/circularize",
|
"pages/circularize/circularize",
|
||||||
"pages/askHousing/askHousing",
|
"pages/askHousing/askHousing",
|
||||||
"pages/transfer/transfer",
|
"pages/transfer/transfer",
|
||||||
"pages/findingMap/findingMap"
|
"pages/findingMap/findingMap",
|
||||||
|
"pages/placeMap/index"
|
||||||
],
|
],
|
||||||
|
|
||||||
"subpackages": [{
|
"subpackages": [{
|
||||||
|
634
pages/placeMap/index.js
Normal file
634
pages/placeMap/index.js
Normal file
@ -0,0 +1,634 @@
|
|||||||
|
// pages/Map/Map.js
|
||||||
|
let app = getApp()
|
||||||
|
var miucms = require('../../utils/miucms.js');
|
||||||
|
Page({
|
||||||
|
data: {
|
||||||
|
headerObj: {
|
||||||
|
person: "个人",
|
||||||
|
intermediary: "中介",
|
||||||
|
apartment: "公寓",
|
||||||
|
},
|
||||||
|
headerObjTab: "person",
|
||||||
|
windowHeight: 0, //屏幕高度
|
||||||
|
mapEnableScroll: true, //设置地图是否拖动
|
||||||
|
tabValue: "area", // area school
|
||||||
|
longitude: 113.36110, //默认定位经度
|
||||||
|
latitude: 23.12463, //默认定位纬度
|
||||||
|
coordinateObj: {}, //储存经纬度
|
||||||
|
mapScale: 11, //地图大小
|
||||||
|
showPlace: false, //显示地方详情
|
||||||
|
//公寓地区id
|
||||||
|
areaMarkerIds: [],
|
||||||
|
//公寓地区内容
|
||||||
|
areaMarkerIdsObj: {},
|
||||||
|
//公寓数据
|
||||||
|
areaMarkerList: [],
|
||||||
|
customCalloutMarkerIds: [1, 20], //按学校数据
|
||||||
|
customCalloutMarkerIdsObj: {
|
||||||
|
1: {
|
||||||
|
title: "香港中文大学",
|
||||||
|
num: 1
|
||||||
|
},
|
||||||
|
20: {
|
||||||
|
title: "香港中文",
|
||||||
|
num: 18
|
||||||
|
}
|
||||||
|
},
|
||||||
|
//按学校数据
|
||||||
|
markersList: [{
|
||||||
|
id: 20,
|
||||||
|
iconPath: "/img/lucency.png",
|
||||||
|
latitude: 23.12463,
|
||||||
|
longitude: 113.36110,
|
||||||
|
width: 0,
|
||||||
|
height: 0,
|
||||||
|
customCallout: {
|
||||||
|
anchorY: 0,
|
||||||
|
anchorX: 0,
|
||||||
|
display: 'ALWAYS',
|
||||||
|
},
|
||||||
|
},
|
||||||
|
{
|
||||||
|
id: 1,
|
||||||
|
latitude: 23.12893,
|
||||||
|
longitude: 113.30290,
|
||||||
|
iconPath: "/img/lucency.png",
|
||||||
|
width: "0rpx",
|
||||||
|
height: "0rpx",
|
||||||
|
customCallout: {
|
||||||
|
anchorY: 0,
|
||||||
|
anchorX: 0,
|
||||||
|
display: 'ALWAYS',
|
||||||
|
},
|
||||||
|
},
|
||||||
|
],
|
||||||
|
//地区房价数据
|
||||||
|
priceList: [],
|
||||||
|
//地区房价ID
|
||||||
|
priceIdList: [15, 16, 17, 18],
|
||||||
|
//地区房价
|
||||||
|
placePriceList: {
|
||||||
|
15: {
|
||||||
|
title: "HK$ 6900"
|
||||||
|
},
|
||||||
|
16: {
|
||||||
|
title: "HK$ 7500"
|
||||||
|
},
|
||||||
|
17: {
|
||||||
|
title: "HK$ 8500"
|
||||||
|
},
|
||||||
|
18: {
|
||||||
|
title: "HK$ 9500"
|
||||||
|
},
|
||||||
|
},
|
||||||
|
//用户所选地区
|
||||||
|
selectPlace: {},
|
||||||
|
//用户所选地区价格
|
||||||
|
selectPlacePrice: {},
|
||||||
|
//地区房源详情
|
||||||
|
placeInfoList: [],
|
||||||
|
//地区弹窗
|
||||||
|
placePopBox: false,
|
||||||
|
//公寓弹窗
|
||||||
|
apartmentPopBox: false,
|
||||||
|
//用户所选公寓
|
||||||
|
apartmentObj: {},
|
||||||
|
apartmentListId: '', //公寓列表id
|
||||||
|
allPlaceListBoxWidth: 0, //当前页面地区房源宽度
|
||||||
|
scrollTopNum: 0, //记录滚动条
|
||||||
|
personListId: '', //个人地区房价id
|
||||||
|
selectGroupIndex: null,
|
||||||
|
cloneInfo: '', //复制字段
|
||||||
|
pages: 1, //页数
|
||||||
|
count: 0, //品牌数量
|
||||||
|
types: { //筛选组件-出租
|
||||||
|
data: null,
|
||||||
|
value: ''
|
||||||
|
},
|
||||||
|
money: { //金额
|
||||||
|
rent_min: 0,
|
||||||
|
rent_max: ''
|
||||||
|
},
|
||||||
|
moreCondition: { //更多
|
||||||
|
show: false,
|
||||||
|
data: {
|
||||||
|
gender: "0",
|
||||||
|
leaseterm: "0",
|
||||||
|
publish: "twomonth",
|
||||||
|
}
|
||||||
|
},
|
||||||
|
brands: { //品牌
|
||||||
|
list: [],
|
||||||
|
value: '',
|
||||||
|
obj: {}
|
||||||
|
},
|
||||||
|
roomlistings: { //楼型
|
||||||
|
list: [],
|
||||||
|
value: '',
|
||||||
|
obj: {}
|
||||||
|
},
|
||||||
|
roomtype: { //房型
|
||||||
|
list: [],
|
||||||
|
value: '',
|
||||||
|
obj: {}
|
||||||
|
},
|
||||||
|
},
|
||||||
|
touchStart() {
|
||||||
|
|
||||||
|
|
||||||
|
},
|
||||||
|
touchEnd(e) {
|
||||||
|
// console.log(e)
|
||||||
|
|
||||||
|
},
|
||||||
|
|
||||||
|
get_config() {
|
||||||
|
var that = this;
|
||||||
|
if (app.globalData.config && app.globalData.config.lists) {
|
||||||
|
this.setData({
|
||||||
|
screen_data: app.globalData.screen_data,
|
||||||
|
})
|
||||||
|
} else {
|
||||||
|
setTimeout(function () {
|
||||||
|
that.get_config()
|
||||||
|
}, 10)
|
||||||
|
}
|
||||||
|
},
|
||||||
|
// 切换学校/区域
|
||||||
|
switchTab(e) {
|
||||||
|
this.setData({
|
||||||
|
tabValue: e.currentTarget.dataset.type
|
||||||
|
})
|
||||||
|
},
|
||||||
|
showPlacePopBox() {
|
||||||
|
this.setData({
|
||||||
|
placePopBox: !this.data.placePopBox
|
||||||
|
})
|
||||||
|
},
|
||||||
|
//查看详情
|
||||||
|
publicJumps(e) {
|
||||||
|
let uniqid = e.currentTarget.dataset.uniqid
|
||||||
|
let url = e.currentTarget.dataset.url
|
||||||
|
if (url) {
|
||||||
|
wx.navigateTo({
|
||||||
|
url,
|
||||||
|
})
|
||||||
|
} else {
|
||||||
|
wx.navigateTo({
|
||||||
|
url: `/pages/irentDetail/irentDetail?uniqid=${uniqid}`,
|
||||||
|
})
|
||||||
|
}
|
||||||
|
},
|
||||||
|
//监听滚动条
|
||||||
|
scrollChange() {
|
||||||
|
this._observer = wx.createIntersectionObserver(this, {
|
||||||
|
thresholds: [1, 1],
|
||||||
|
observeAll: true
|
||||||
|
})
|
||||||
|
this._observer
|
||||||
|
.relativeTo('#apartmentView')
|
||||||
|
.observe('.pos-id', (res) => {
|
||||||
|
let num = res.intersectionRatio == 1 && res.intersectionRatio % 1 == 0 ? res.dataset.num : null
|
||||||
|
if (!num && num != 0) return
|
||||||
|
if (this.data.apartmentObj.id === this.data.areaMarkerList[num].id) return
|
||||||
|
this.setNowMarker(num)
|
||||||
|
})
|
||||||
|
},
|
||||||
|
// scrollChange(e) {
|
||||||
|
// let top = Math.floor(e.detail.scrollLeft * 100) / 100
|
||||||
|
// let scrollNum = top / this.data.allPlaceListBoxWidth
|
||||||
|
// if (e.detail.scrollLeft > this.data.scrollTopNum) { //左右滑动判断
|
||||||
|
// if (scrollNum % 1 > 0.95 || scrollNum % 1 === 0) {
|
||||||
|
// this.setNowMarker(scrollNum.toFixed(0))
|
||||||
|
// }
|
||||||
|
// } else {
|
||||||
|
// if (scrollNum % 1 <= 0.01 || scrollNum % 1 === 0) {
|
||||||
|
// this.setNowMarker(scrollNum.toFixed(0))
|
||||||
|
// }
|
||||||
|
// }
|
||||||
|
// this.setData({
|
||||||
|
// scrollTopNum: e.detail.scrollLeft
|
||||||
|
// })
|
||||||
|
// },
|
||||||
|
//设置当前房间列表id
|
||||||
|
setNowMarker(num) {
|
||||||
|
if (this.data.headerObjTab === 'person') {
|
||||||
|
this.setData({
|
||||||
|
selectPlacePrice: this.data.priceList[num],
|
||||||
|
longitude: this.data.priceList[num].longitude,
|
||||||
|
latitude: this.data.priceList[num].latitude,
|
||||||
|
})
|
||||||
|
} else if (this.data.headerObjTab === 'apartment') {
|
||||||
|
// console.log(this.data.areaMarkerIdsObj[this.data.areaMarkerList[num].id])
|
||||||
|
let obj=this.data.areaMarkerIdsObj[this.data.areaMarkerList[num].id]
|
||||||
|
obj.association.map(res=>{
|
||||||
|
this.data.areaMarkerIdsObj[res].coordinateDisplay=false
|
||||||
|
})
|
||||||
|
this.data.areaMarkerIdsObj[this.data.areaMarkerList[num].id].coordinateDisplay=true
|
||||||
|
this.setData({
|
||||||
|
areaMarkerIdsObj:this.data.areaMarkerIdsObj,
|
||||||
|
apartmentObj: this.data.areaMarkerList[num],
|
||||||
|
longitude: this.data.areaMarkerList[num].longitude,
|
||||||
|
latitude: this.data.areaMarkerList[num].latitude,
|
||||||
|
})
|
||||||
|
}
|
||||||
|
},
|
||||||
|
//聚合点
|
||||||
|
getMapContxt() {
|
||||||
|
this.mapCtx.initMarkerCluster({
|
||||||
|
enableDefaultStyle: false,
|
||||||
|
zoomOnClick: true,
|
||||||
|
gridSize: 60,
|
||||||
|
complete(res) {
|
||||||
|
console.log('initMarkerCluster', res)
|
||||||
|
}
|
||||||
|
})
|
||||||
|
// enableDefaultStyle 为 true 时不会触发改事件
|
||||||
|
this.mapCtx.on('markerClusterCreate', res => {
|
||||||
|
console.log('clusterCreate', res)
|
||||||
|
// const clusters = res.clusters
|
||||||
|
// const markers = clusters.map(cluster => {
|
||||||
|
// const {
|
||||||
|
// center,
|
||||||
|
// clusterId,
|
||||||
|
// markerIds
|
||||||
|
// } = cluster
|
||||||
|
// return {
|
||||||
|
// ...center,
|
||||||
|
// width: 0,
|
||||||
|
// height: 0,
|
||||||
|
// clusterId, // 必须
|
||||||
|
// label: {
|
||||||
|
// content: markerIds.length + '',
|
||||||
|
// fontSize: 20,
|
||||||
|
// width: 60,
|
||||||
|
// height: 60,
|
||||||
|
// bgColor: '#00ff00',
|
||||||
|
// borderRadius: 30,
|
||||||
|
// textAlign: 'center',
|
||||||
|
// anchorX: 0,
|
||||||
|
// anchorY: -30,
|
||||||
|
// }
|
||||||
|
// }
|
||||||
|
// })
|
||||||
|
// this.mapCtx.addMarkers({
|
||||||
|
// markers,
|
||||||
|
// clear: false,
|
||||||
|
// complete(res) {
|
||||||
|
// console.log('clusterCreate addMarkers', res)
|
||||||
|
// }
|
||||||
|
// })
|
||||||
|
})
|
||||||
|
},
|
||||||
|
callouttap(e) {
|
||||||
|
let id = e.detail.markerId;
|
||||||
|
let object = null;
|
||||||
|
if (this.data.headerObjTab === 'apartment') {
|
||||||
|
this.data.areaMarkerList.find((obj) => {
|
||||||
|
if (obj.id === id) object = obj
|
||||||
|
})
|
||||||
|
this.setData({
|
||||||
|
apartmentListId: 'Marker' + object.id,
|
||||||
|
apartmentObj: object,
|
||||||
|
})
|
||||||
|
} else if (this.data.showPlace && this.data.headerObjTab === 'person') {
|
||||||
|
this.data.priceList.find((obj) => {
|
||||||
|
if (obj.id === id) object = obj
|
||||||
|
})
|
||||||
|
this.setData({
|
||||||
|
selectPlacePrice: object,
|
||||||
|
personListId: 'Marker' + object.id
|
||||||
|
})
|
||||||
|
} else if (this.data.headerObjTab === 'person') {
|
||||||
|
this.data.markersList.find((obj) => {
|
||||||
|
if (obj.id === id) object = obj
|
||||||
|
})
|
||||||
|
this.setData({
|
||||||
|
selectPlace: object,
|
||||||
|
selectPlacePrice: this.data.selectPlacePrice.id ? this.data.selectPlacePrice : this.data.priceList[0],
|
||||||
|
coordinateObj: {
|
||||||
|
latitude: this.data.latitude,
|
||||||
|
longitude: this.data.longitude
|
||||||
|
},
|
||||||
|
showPlace: true,
|
||||||
|
latitude: object.latitude,
|
||||||
|
longitude: object.longitude
|
||||||
|
})
|
||||||
|
this.setData({
|
||||||
|
mapScale: 20,
|
||||||
|
})
|
||||||
|
//获取房价元素宽度
|
||||||
|
this.getPlaceWidth()
|
||||||
|
}
|
||||||
|
// console.log(this.data)
|
||||||
|
},
|
||||||
|
cloneBtn() {
|
||||||
|
wx.setClipboardData({
|
||||||
|
data: this.data.cloneInfo.wechat,
|
||||||
|
success(res) {
|
||||||
|
wx.getClipboardData({
|
||||||
|
success(res) {
|
||||||
|
console.log(res.data) // data
|
||||||
|
}
|
||||||
|
})
|
||||||
|
}
|
||||||
|
})
|
||||||
|
},
|
||||||
|
//筛选选中标签
|
||||||
|
submitOperations(e) {
|
||||||
|
let {
|
||||||
|
type
|
||||||
|
} = e.detail
|
||||||
|
if (type == "rent") this.submitMoney(e)
|
||||||
|
if (type == "types") this.submittype(e)
|
||||||
|
if (type == "moreCondition") this.myEventSelectSubmit(e)
|
||||||
|
if (type == 'brand') this.submitBrands(e)
|
||||||
|
if (type == 'house') this.submitRoomtype(e)
|
||||||
|
if (type == 'floor') this.submitRoomlistings(e)
|
||||||
|
},
|
||||||
|
//清空选项标签
|
||||||
|
clearSubmitOption() {
|
||||||
|
this.setData({
|
||||||
|
pages: 1
|
||||||
|
})
|
||||||
|
if (this.data.headerObjTab === 'apartment') { //公寓页面
|
||||||
|
this.getApartmentList()
|
||||||
|
} else {
|
||||||
|
|
||||||
|
}
|
||||||
|
},
|
||||||
|
// 选择房型
|
||||||
|
submitRoomtype(e) {
|
||||||
|
this.data.roomtype.value = e.detail.value || e.currentTarget.dataset.value;
|
||||||
|
this.setData({
|
||||||
|
roomtype: this.data.roomtype
|
||||||
|
})
|
||||||
|
this.clearSubmitOption()
|
||||||
|
},
|
||||||
|
// 选择楼型
|
||||||
|
submitRoomlistings(e) {
|
||||||
|
this.data.roomlistings.value = e.detail.value || e.currentTarget.dataset.value
|
||||||
|
this.setData({
|
||||||
|
roomlistings: this.data.roomlistings
|
||||||
|
})
|
||||||
|
this.clearSubmitOption()
|
||||||
|
},
|
||||||
|
// 选择品牌
|
||||||
|
submitBrands(e) {
|
||||||
|
this.data.brands.value = e.detail.value || e.currentTarget.dataset.value;
|
||||||
|
this.setData({
|
||||||
|
brands: this.data.brands
|
||||||
|
})
|
||||||
|
this.clearSubmitOption()
|
||||||
|
},
|
||||||
|
// 提交出租方式
|
||||||
|
submittype(e) {
|
||||||
|
this.data.types.value = e.detail.types || e.detail.data;
|
||||||
|
this.setData({
|
||||||
|
types: this.data.types,
|
||||||
|
selectGroupIndex: null
|
||||||
|
})
|
||||||
|
this.clearSubmitOption()
|
||||||
|
},
|
||||||
|
// 租金条件筛选提交
|
||||||
|
submitMoney(e) {
|
||||||
|
this.data.money = Object.assign({}, e.detail);
|
||||||
|
this.setData({
|
||||||
|
selectGroupIndex: null,
|
||||||
|
money: this.data.money
|
||||||
|
})
|
||||||
|
this.clearSubmitOption()
|
||||||
|
},
|
||||||
|
// 提交更多
|
||||||
|
myEventSelectSubmit(e) {
|
||||||
|
this.setData({
|
||||||
|
moreCondition: {
|
||||||
|
show: false,
|
||||||
|
data: e.detail
|
||||||
|
},
|
||||||
|
selectGroupIndex: null
|
||||||
|
})
|
||||||
|
this.clearSubmitOption()
|
||||||
|
},
|
||||||
|
//获取宽度
|
||||||
|
getPlaceWidth() {
|
||||||
|
let query = wx.createSelectorQuery();
|
||||||
|
let that = this
|
||||||
|
let type = '.pos-id'
|
||||||
|
query.select(type).boundingClientRect(function (res) {
|
||||||
|
if (!res) return
|
||||||
|
that.setData({
|
||||||
|
allPlaceListBoxWidth: res.width
|
||||||
|
})
|
||||||
|
}).exec()
|
||||||
|
// console.log(123,this.data.allPlaceListBoxWidth)
|
||||||
|
},
|
||||||
|
//数组查重
|
||||||
|
checkCoordinate(areaMarkerIdsObj,list){
|
||||||
|
// console.log(areaMarkerIdsObj,list)
|
||||||
|
let obj={}
|
||||||
|
//去重 整合相同坐标的id
|
||||||
|
list.map((res,index)=>{
|
||||||
|
if(obj[res.coordinate]){
|
||||||
|
obj[res.coordinate].push(res.id)
|
||||||
|
areaMarkerIdsObj[index+1].coordinateDisplay=false
|
||||||
|
areaMarkerIdsObj[index+1].association=obj[res.coordinate]
|
||||||
|
}else{
|
||||||
|
obj[res.coordinate]=[]
|
||||||
|
obj[res.coordinate].push(res.id)
|
||||||
|
}
|
||||||
|
})
|
||||||
|
//去掉自身id
|
||||||
|
for(let data in obj){
|
||||||
|
if(obj[data].length>1){
|
||||||
|
obj[data].map(res=>{
|
||||||
|
let dataArr=JSON.parse(JSON.stringify(obj[data]))
|
||||||
|
dataArr.splice(dataArr.indexOf(res),1)
|
||||||
|
areaMarkerIdsObj[res].association=dataArr
|
||||||
|
})
|
||||||
|
}
|
||||||
|
}
|
||||||
|
return areaMarkerIdsObj
|
||||||
|
// console.log(obj)
|
||||||
|
},
|
||||||
|
//获取房源筛选
|
||||||
|
getSelectList() {
|
||||||
|
miucms.request(`${app.globalData.baseURL}/tenement/v2/api/map/region`).then(res => {
|
||||||
|
if (res.code === 200) {
|
||||||
|
let data = res.data
|
||||||
|
//获取品牌
|
||||||
|
data.brand.forEach(item => {
|
||||||
|
item.value = item.id;
|
||||||
|
this.data.brands.obj[item.id] = item.name;
|
||||||
|
})
|
||||||
|
this.data.brands.list = [{
|
||||||
|
value: '',
|
||||||
|
name: '全部品牌'
|
||||||
|
}, ...data.brand];
|
||||||
|
//获取房型
|
||||||
|
data.roomtype.forEach(item => {
|
||||||
|
item.value = item.id;
|
||||||
|
this.data.roomtype.obj[item.id] = item.name;
|
||||||
|
})
|
||||||
|
this.data.roomtype.list = [{
|
||||||
|
value: '',
|
||||||
|
name: '全部房型'
|
||||||
|
}, ...data.roomtype];
|
||||||
|
//获取楼型
|
||||||
|
data.roomlistings.forEach(item => {
|
||||||
|
item.value = item.id;
|
||||||
|
this.data.roomlistings.obj[item.id] = item.name;
|
||||||
|
})
|
||||||
|
this.data.roomlistings.list = [{
|
||||||
|
value: '',
|
||||||
|
name: '全部楼型'
|
||||||
|
}, ...data.roomlistings];
|
||||||
|
|
||||||
|
this.setData({
|
||||||
|
types: {
|
||||||
|
data: data.type
|
||||||
|
},
|
||||||
|
brands: this.data.brands,
|
||||||
|
roomtype: this.data.roomtype,
|
||||||
|
roomlistings: this.data.roomlistings
|
||||||
|
})
|
||||||
|
}
|
||||||
|
})
|
||||||
|
},
|
||||||
|
setValue(e) {
|
||||||
|
let {
|
||||||
|
key,
|
||||||
|
value
|
||||||
|
} = e.currentTarget.dataset
|
||||||
|
if (value === 'apartment') {
|
||||||
|
this.getApartmentList()
|
||||||
|
// if (this.setData.apartmentObj) {
|
||||||
|
// this.setData({
|
||||||
|
|
||||||
|
// })
|
||||||
|
// }
|
||||||
|
}
|
||||||
|
this.setData({
|
||||||
|
[key]: value,
|
||||||
|
mapScale: 20
|
||||||
|
})
|
||||||
|
this.getPlaceWidth()
|
||||||
|
},
|
||||||
|
//地图视野变化
|
||||||
|
mapViewChange(type, causedBy) {
|
||||||
|
if (type.type === 'end' && type.causedBy === "drag") {
|
||||||
|
console.log(type.detail.centerLocation, type)
|
||||||
|
}
|
||||||
|
},
|
||||||
|
//返回选择学校/区域页面
|
||||||
|
backPerson() {
|
||||||
|
this.setData({
|
||||||
|
latitude: this.data.coordinateObj.latitude,
|
||||||
|
longitude: this.data.coordinateObj.longitude,
|
||||||
|
showPlace: false,
|
||||||
|
mapScale: 11,
|
||||||
|
})
|
||||||
|
},
|
||||||
|
//个人/中介房源列表
|
||||||
|
getHouseList() {
|
||||||
|
let data = {}
|
||||||
|
miucms.request(`${app.globalData.baseURL}/tenement/v2/api/lists`).then(res => {
|
||||||
|
console.log(res)
|
||||||
|
})
|
||||||
|
},
|
||||||
|
//获取公寓数据
|
||||||
|
getApartmentList() {
|
||||||
|
let data = {
|
||||||
|
page: this.data.pages, //当前页数
|
||||||
|
companyid: this.data.brands.value, //品牌
|
||||||
|
roomtype: this.data.roomtype.value, //房型
|
||||||
|
roomlistings: this.data.roomlistings.value,
|
||||||
|
rent_min: this.data.money.rent_min,
|
||||||
|
rent_max: this.data.money.rent_max,
|
||||||
|
limit: 100
|
||||||
|
}
|
||||||
|
miucms.request(`${app.globalData.baseURL}/tenement/v2/api/apartment`, data).then(res => {
|
||||||
|
if (res.code === 200) {
|
||||||
|
let data = res.data.data
|
||||||
|
let List = []
|
||||||
|
let arr = []
|
||||||
|
let obj = {}
|
||||||
|
if (data.length) {
|
||||||
|
let dataObj = {
|
||||||
|
iconPath: "/img/lucency.png",
|
||||||
|
width: 10,
|
||||||
|
height: 10,
|
||||||
|
// joinCluster: true,
|
||||||
|
customCallout: {
|
||||||
|
anchorY: 0,
|
||||||
|
anchorX: 0,
|
||||||
|
display: 'ALWAYS',
|
||||||
|
},
|
||||||
|
}
|
||||||
|
data.map((res, index) => { //latitude longitude
|
||||||
|
List.push({
|
||||||
|
latitude: res.coordinate.split(',')[0],
|
||||||
|
longitude: res.coordinate.split(',')[1],
|
||||||
|
imageurl: res.image,
|
||||||
|
brand: res.company,
|
||||||
|
id: index + 1,
|
||||||
|
...dataObj,
|
||||||
|
...res
|
||||||
|
})
|
||||||
|
res.id = index + 1
|
||||||
|
arr.push(List[index].id)
|
||||||
|
obj[List[index].id] = {
|
||||||
|
title: 'HK$ ' + res.rentprice,
|
||||||
|
coordinateDisplay:true,//判断是否显示坐标
|
||||||
|
association:[],//相同坐标
|
||||||
|
}
|
||||||
|
})
|
||||||
|
}
|
||||||
|
obj=this.checkCoordinate(obj,List)
|
||||||
|
this.setData({
|
||||||
|
cloneInfo: res.data.contact,
|
||||||
|
count: res.data.count,
|
||||||
|
areaMarkerList: List,
|
||||||
|
areaMarkerIds: arr,
|
||||||
|
areaMarkerIdsObj: obj,
|
||||||
|
latitude: List[0] ? List[0].latitude : '',
|
||||||
|
longitude: List[0] ? List[0].longitude : '',
|
||||||
|
apartmentObj: List[0],
|
||||||
|
})
|
||||||
|
this.scrollChange()
|
||||||
|
}
|
||||||
|
})
|
||||||
|
},
|
||||||
|
onReady() {
|
||||||
|
wx.getSystemInfo({
|
||||||
|
success: (res) => {
|
||||||
|
console.log(res)
|
||||||
|
this.setData({
|
||||||
|
windowHeight: res.windowHeight
|
||||||
|
})
|
||||||
|
}
|
||||||
|
})
|
||||||
|
this.getSelectList()
|
||||||
|
this.getHouseList()
|
||||||
|
},
|
||||||
|
onLoad(options) {
|
||||||
|
// this.mapCtx = wx.createMapContext('map')
|
||||||
|
// this.mapCtx.on('markerClusterClick', res => {
|
||||||
|
// console.log('markerClusterClick', res)
|
||||||
|
// })
|
||||||
|
var that = this;
|
||||||
|
// this.getMapContxt()
|
||||||
|
this.get_config()
|
||||||
|
},
|
||||||
|
onShow() {},
|
||||||
|
onHide() {},
|
||||||
|
onUnload() {
|
||||||
|
this._observer.disconnect()
|
||||||
|
},
|
||||||
|
onReachBottom() {
|
||||||
|
|
||||||
|
},
|
||||||
|
onShareAppMessage() {
|
||||||
|
|
||||||
|
}
|
||||||
|
})
|
6
pages/placeMap/index.json
Normal file
6
pages/placeMap/index.json
Normal file
@ -0,0 +1,6 @@
|
|||||||
|
{
|
||||||
|
"enablePullDownRefresh": false,
|
||||||
|
"usingComponents": {
|
||||||
|
"list-operations": "/template/listOperations/listOperations"
|
||||||
|
}
|
||||||
|
}
|
197
pages/placeMap/index.wxml
Normal file
197
pages/placeMap/index.wxml
Normal file
@ -0,0 +1,197 @@
|
|||||||
|
<import src="../common/common" />
|
||||||
|
<view class="container" style="position:fixed;top:0;left:0;">
|
||||||
|
<view class="top-tool-box">
|
||||||
|
<view class="header-box" style="height: {{ screen_data['totalTopHeight'] }}px;">
|
||||||
|
<view class="top-tab-box" style="padding-top: {{ screen_data['statusBarHeight'] }}px;height: {{ screen_data['titleBarHeight'] }}px;box-sizing: content-box;">
|
||||||
|
<view class="back flexcenter">
|
||||||
|
<image class="back-icon" mode="heightFix" src="/img/back.png" bindtap="backPerson"></image>
|
||||||
|
</view>
|
||||||
|
<view class="header-tab top-tab-box" style="margin-top:14rpx;">
|
||||||
|
<view class="header-tab-item {{ index == headerObjTab ? 'pitch' : '' }}" wx:for="{{ headerObj }}" wx:key="index" bindtap="setValue" data-key="headerObjTab" data-value="{{ index }}">{{ item }}</view>
|
||||||
|
</view>
|
||||||
|
</view>
|
||||||
|
</view>
|
||||||
|
<view style="position: fixed;top:0;left:0;z-index: 666;width:100vw;background:#fff;" wx:if="{{headerObjTab==='apartment'&&placePopBox}}">
|
||||||
|
<view class="header-box" style="height: {{ screen_data['totalTopHeight'] }}px;">
|
||||||
|
<view class="top-tab-box" style="padding-top: {{ screen_data['statusBarHeight'] }}px;height: {{ screen_data['titleBarHeight'] }}px;box-sizing: content-box;position: relative;">
|
||||||
|
<view class="back flexcenter" style="position: absolute;">
|
||||||
|
<image class="back-icon" mode="heightFix" style="transform:rotate(270deg);" src="/img/back.png" bindtap="showPlacePopBox"></image>
|
||||||
|
</view>
|
||||||
|
<view class="place-pop-box-title">
|
||||||
|
公寓
|
||||||
|
</view>
|
||||||
|
</view>
|
||||||
|
</view>
|
||||||
|
</view>
|
||||||
|
<view class="tab-box" style="display: flex;top:{{screen_data['totalTopHeight']+100 }}rpx" wx:if="{{headerObjTab==='person'&&!showPlace}}">
|
||||||
|
<view class="tab-item flex1 flexcenter {{ tabValue == 'area' ? 'pitch' : '' }}" bindtap="switchTab" data-type='area'>
|
||||||
|
按区域
|
||||||
|
</view>
|
||||||
|
<view class="tab-item flex1 flexcenter {{ tabValue == 'school' ? 'pitch' : '' }}" bindtap="switchTab" data-type='school'>
|
||||||
|
按学校
|
||||||
|
</view>
|
||||||
|
</view>
|
||||||
|
<view wx:elif="{{headerObjTab==='person'&&showPlace}}" style="top:{{screen_data['totalTopHeight']+60}}rpx" class="tool-btn-box dis-f">
|
||||||
|
<list-operations style="width:100%;" property="{{ property }}" school="{{ school }}" types="{{ types }}" location="{{ location }}" operationstype="placeSelect" money="{{ money }}" brands="{{ brands }}" screen_data="{{ screen_data }}" roomtype="{{ roomtype }}" roomlistings="{{ roomlistings }}" bindsubmit="submitOperations"></list-operations>
|
||||||
|
</view>
|
||||||
|
<view wx:if="{{headerObjTab==='apartment'}}" class="tool-btn-box pos-r dis-f" style="z-index:999;">
|
||||||
|
<view style="position:fixed;left:0;top:{{screen_data['titleBarHeight']+screen_data['statusBarHeight']}}px;width:100vw;z-index:230;background:#fff;">
|
||||||
|
<list-operations style="width:100%;" operationstype="student" money="{{ money }}" brands="{{ brands }}" screen_data="{{ screen_data }}" roomtype="{{ roomtype }}" roomlistings="{{ roomlistings }}" bindsubmit="submitOperations"></list-operations>
|
||||||
|
</view>
|
||||||
|
<view class="place-pop-box" wx:if="{{placePopBox}}" style="height:{{windowHeight-screen_data['totalTopHeight']}}px">
|
||||||
|
<view style="height:{{screen_data['titleBarHeight']}}px">
|
||||||
|
|
||||||
|
</view>
|
||||||
|
<view style="padding:0 30rpx;">
|
||||||
|
<view class="place-information dis-f al-item">
|
||||||
|
共
|
||||||
|
<view style="font-weight: 650;margin:0 10rpx 0 10rpx">
|
||||||
|
{{count}}
|
||||||
|
</view>
|
||||||
|
套房源
|
||||||
|
</view>
|
||||||
|
<view wx:if="{{headerObjTab==='person'}}">
|
||||||
|
<common-list wx:for="{{ placeInfoList }}" wx:key="index" item="{{ item }}">{{ index }}</common-list>
|
||||||
|
</view>
|
||||||
|
<view class="inEnd flexcenter" wx:if="{{headerObjTab==='person'}}">到底了</view>
|
||||||
|
<template is='apartment-item' wx:if="{{headerObjTab==='apartment'&&areaMarkerList.length>0}}" wx:for="{{areaMarkerList}}" data="{{item}}" wx:key="index" data-uniqid='{{item.uniqid}}'>
|
||||||
|
</template>
|
||||||
|
<template is="empty-icon" wx:if="{{headerObjTab==='apartment'&&areaMarkerList.length===0}}">
|
||||||
|
</template>
|
||||||
|
<view wx:if="{{headerObjTab==='apartment'&&areaMarkerList.length>0}}">
|
||||||
|
<view class="dis-f jus-x al-item btm-tps-text" wx:if="{{headerObjTab==='apartment'}}">
|
||||||
|
有疑问? 来找
|
||||||
|
<image src="../../img/smiling-face.png" class="btm-tps-img" mode="" />
|
||||||
|
{{cloneInfo.nickname}}!
|
||||||
|
</view>
|
||||||
|
<view class="dis-f jus-x al-item" wx:if="{{headerObjTab==='apartment'}}">
|
||||||
|
<view class="btm-tps-btn" bindtap="cloneBtn">
|
||||||
|
复制微信号
|
||||||
|
</view>
|
||||||
|
</view>
|
||||||
|
</view>
|
||||||
|
</view>
|
||||||
|
</view>
|
||||||
|
</view>
|
||||||
|
</view>
|
||||||
|
<view class="map">
|
||||||
|
<map id="map" longitude="{{longitude}}" latitude="{{latitude}}" markers="{{headerObjTab==='apartment'?areaMarkerList:showPlace?priceList:markersList}}" scale="{{mapScale}}" style="width: 100%; height: 100%;" bindcallouttap="callouttap" enable-scroll="{{mapEnableScroll}}">
|
||||||
|
<cover-view slot="callout" style="position: relative;">
|
||||||
|
<block wx:for="{{headerObjTab==='apartment'?areaMarkerIds:showPlace?priceIdList:customCalloutMarkerIds}}" wx:key="index">
|
||||||
|
<cover-view
|
||||||
|
class="customCallout {{headerObjTab==='apartment'||showPlace?'price-box':tabValue==='school'?'':'circles'}} {{headerObjTab==='apartment'&&!areaMarkerIdsObj[item].coordinateDisplay?'dis-n':''}}"
|
||||||
|
marker-id="{{item}}">
|
||||||
|
<cover-view class="{{(showPlace&&selectPlacePrice.id===item)||apartmentObj.id===item?'check-place-box':'place-price-box'}} {{headerObjTab==='apartment'&&apartmentObj.id!=item?'apartment-text':''}}">
|
||||||
|
{{headerObjTab==='apartment'?areaMarkerIdsObj[item].title:showPlace?placePriceList[item].title :customCalloutMarkerIdsObj[item].title }}
|
||||||
|
</cover-view>
|
||||||
|
<cover-image src="../../img/downIcon.png" class="check-place-box-triangle" wx:if="{{headerObjTab==='apartment'&&apartmentObj.id===item?true:showPlace&&selectPlacePrice.id===item?true :false}}" mode="" />
|
||||||
|
<!-- <cover-view class="{{showPlace&&selectPlacePrice.id===item||apartmentObj.id===item?'check-place-box-triangle':''}}">
|
||||||
|
</cover-view> -->
|
||||||
|
<cover-view class="{{tabValue==='school'?'name':''}}" wx:if="{{headerObjTab==='apartment'?false:true}}" hidden='{{showPlace?true:false}}'>{{ customCalloutMarkerIdsObj[item].num }}套</cover-view>
|
||||||
|
</cover-view>
|
||||||
|
</block>
|
||||||
|
</cover-view>
|
||||||
|
</map>
|
||||||
|
</view>
|
||||||
|
<!-- bindscroll='scrollChange' -->
|
||||||
|
<view class="place-info-box">
|
||||||
|
<scroll-view scroll-x="true" style="height:380rpx" enhanced="true" id='apartmentView' paging-enabled="true" enable-flex='true' scroll-into-view="{{personListId}}" scroll-with-animation class="place-list dis-f al-item" wx:if="{{headerObjTab==='person'&&showPlace&&selectPlacePrice.id}}">
|
||||||
|
<view wx:for="{{priceList}}" wx:key="index" class="pos-id" id="{{'Marker'+item.id}}"
|
||||||
|
data-num='{{index}}' data-uniqid='{{item.uniqid}}' bindtap="publicJumps">
|
||||||
|
<view class="place-list-box">
|
||||||
|
<image src="../../img/20230609113522.png" mode="aspectFit" class="place-list-confirm-img" alt="" />
|
||||||
|
<view class="dis-f al-item">
|
||||||
|
<view class="title-tab">
|
||||||
|
整租
|
||||||
|
</view>
|
||||||
|
<view class="title">
|
||||||
|
尖沙咀地铁口旁,交通生活便利,靓装1房放1111111111
|
||||||
|
</view>
|
||||||
|
</view>
|
||||||
|
<view class="dis-f place-list-info-box">
|
||||||
|
<view class="dis-f place-info">
|
||||||
|
<view class="tab-text">
|
||||||
|
{{1}} · {{2}} · {{3}} · {{4}}
|
||||||
|
<view class="dis-f" style="margin-top:14rpx;">
|
||||||
|
<view class="currency">
|
||||||
|
HK$
|
||||||
|
</view>
|
||||||
|
<view class="price">
|
||||||
|
9500
|
||||||
|
</view>
|
||||||
|
<view class="interval-time">
|
||||||
|
/月
|
||||||
|
</view>
|
||||||
|
</view>
|
||||||
|
</view>
|
||||||
|
<view class="dis-f al-item" style="margin-top:16rpx;">
|
||||||
|
<img src="" alt="" class="release-info-img" />
|
||||||
|
<view class="release-info-text">
|
||||||
|
123
|
||||||
|
</view>
|
||||||
|
<view class="release-info-btn dis-f jus-x al-item">
|
||||||
|
招室友
|
||||||
|
</view>
|
||||||
|
<image src="../../img/intermediary.png" class="confirm-intermediary-img" mode="aspectFit" />
|
||||||
|
</view>
|
||||||
|
</view>
|
||||||
|
<view class="place-img">
|
||||||
|
</view>
|
||||||
|
</view>
|
||||||
|
</view>
|
||||||
|
</view>
|
||||||
|
</scroll-view>
|
||||||
|
<!-- bindscroll='scrollChange' wx:elif="{{headerObjTab==='apartment'}}" -->
|
||||||
|
<scroll-view scroll-x="true" style="height:350rpx" enhanced="true" id='apartmentView' paging-enabled="true" hidden="{{headerObjTab!=='apartment'}}" enable-flex='true' class="place-list dis-f al-item" scroll-into-view="{{apartmentListId}}" scroll-with-animation>
|
||||||
|
<view wx:for="{{areaMarkerList}}" wx:key="index" class="pos-id" id="{{'Marker'+item.id}}" data-num='{{index}}'
|
||||||
|
data-uniqid='{{item.uniqid}}' bindtap="publicJumps">
|
||||||
|
<view class="place-list-box dis-f al-item" style="padding:0;background:#000;" data-id="{{item.id}}">
|
||||||
|
<view class="apartment-img-box">
|
||||||
|
<view class="apartment-img">
|
||||||
|
<image src="{{item.image}}" class="img" mode="aspectFill" />
|
||||||
|
</view>
|
||||||
|
<view style="width:260rpx;height:186rpx;">
|
||||||
|
|
||||||
|
</view>
|
||||||
|
<view class="apartment-title-text">
|
||||||
|
{{item.brand}}
|
||||||
|
</view>
|
||||||
|
</view>
|
||||||
|
<view class="apartment-info-box">
|
||||||
|
<view class="title">
|
||||||
|
{{item.title}}
|
||||||
|
</view>
|
||||||
|
<view class="introduce">
|
||||||
|
{{item.propaganda}}
|
||||||
|
</view>
|
||||||
|
<view class="house-type">
|
||||||
|
共{{item.roomnum}}个房型
|
||||||
|
</view>
|
||||||
|
<view class="dis-f" style="margin-top:20rpx;">
|
||||||
|
<view class="currency">
|
||||||
|
HK$
|
||||||
|
</view>
|
||||||
|
<view class="price">
|
||||||
|
{{item.rentprice}}
|
||||||
|
</view>
|
||||||
|
<view class="interval-time">
|
||||||
|
/月起
|
||||||
|
</view>
|
||||||
|
</view>
|
||||||
|
</view>
|
||||||
|
</view>
|
||||||
|
</view>
|
||||||
|
<!-- -->
|
||||||
|
</scroll-view>
|
||||||
|
<!-- -->
|
||||||
|
<view class="info-box" bindtap="showPlacePopBox" wx:if="{{headerObjTab==='apartment'||headerObjTab==='person'&&showPlace}}">
|
||||||
|
<view class="dis-f jus-x al-item">
|
||||||
|
<image src="../../img/placeLogo.svg" class="img" mode="aspectFit" />
|
||||||
|
</view>
|
||||||
|
<view class="title">
|
||||||
|
共 {{count}} 个品牌公寓
|
||||||
|
</view>
|
||||||
|
</view>
|
||||||
|
</view>
|
||||||
|
<!-- 弹窗 -->
|
||||||
|
</view>
|
582
pages/placeMap/index.wxss
Normal file
582
pages/placeMap/index.wxss
Normal file
@ -0,0 +1,582 @@
|
|||||||
|
/* pages/placeMap/placeMap.wxss */
|
||||||
|
@import "../common/common.wxss";
|
||||||
|
|
||||||
|
page {
|
||||||
|
height: 100%;
|
||||||
|
}
|
||||||
|
.pos-id{
|
||||||
|
position: relative;
|
||||||
|
}
|
||||||
|
|
||||||
|
.pos-r {
|
||||||
|
position: relative;
|
||||||
|
}
|
||||||
|
|
||||||
|
.map-box {
|
||||||
|
display: flex;
|
||||||
|
flex: 1;
|
||||||
|
width: 100vw;
|
||||||
|
position: relative;
|
||||||
|
}
|
||||||
|
.top-tool-box{
|
||||||
|
position: absolute;
|
||||||
|
z-index: 333;
|
||||||
|
top: 0;
|
||||||
|
left: 0;
|
||||||
|
width: 100vw;
|
||||||
|
}
|
||||||
|
|
||||||
|
.top-tab-box {
|
||||||
|
display: flex;
|
||||||
|
align-items: center;
|
||||||
|
margin-bottom: 20rpx;
|
||||||
|
}
|
||||||
|
|
||||||
|
.customCallout {
|
||||||
|
box-sizing: border-box;
|
||||||
|
/* background-color: #fff; */
|
||||||
|
border: 1px solid #ccc;
|
||||||
|
border-radius: 30px;
|
||||||
|
/* width: 232.5rpx; */
|
||||||
|
width: max-content;
|
||||||
|
height: 72rpx;
|
||||||
|
color: #ffffff;
|
||||||
|
display: inline-flex;
|
||||||
|
justify-content: space-between;
|
||||||
|
align-items: center;
|
||||||
|
padding: 0 24rpx;
|
||||||
|
font-size: 22rpx;
|
||||||
|
border-radius: 24rpx;
|
||||||
|
position: relative;
|
||||||
|
background-color: rgba(51, 51, 51, 1);
|
||||||
|
box-shadow: 0px 0px 5px rgba(0, 0, 0, 0.349019607843137);
|
||||||
|
}
|
||||||
|
|
||||||
|
.circles {
|
||||||
|
width: 130rpx;
|
||||||
|
height: 130rpx;
|
||||||
|
border-radius: 65rpx;
|
||||||
|
display: flex;
|
||||||
|
align-items: center;
|
||||||
|
justify-content: center;
|
||||||
|
padding: 20rpx;
|
||||||
|
font-size: 22rpx;
|
||||||
|
line-height: 130rpx;
|
||||||
|
flex-wrap: wrap;
|
||||||
|
}
|
||||||
|
|
||||||
|
.name {
|
||||||
|
margin-left: 25rpx;
|
||||||
|
}
|
||||||
|
|
||||||
|
.header-box {
|
||||||
|
background-color: #ffffff;
|
||||||
|
}
|
||||||
|
|
||||||
|
.header-box .back {
|
||||||
|
padding: 0 32rpx;
|
||||||
|
height: 100%;
|
||||||
|
}
|
||||||
|
|
||||||
|
.header-box .back .back-icon {
|
||||||
|
width: 12px;
|
||||||
|
height: 18px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.header-box .header-tab-item {
|
||||||
|
padding: 0 24rpx;
|
||||||
|
font-size: 30rpx;
|
||||||
|
color: #555555;
|
||||||
|
}
|
||||||
|
|
||||||
|
.header-box .header-tab-item.pitch {
|
||||||
|
color: #000000;
|
||||||
|
font-weight: 650;
|
||||||
|
position: relative;
|
||||||
|
}
|
||||||
|
|
||||||
|
.header-box .header-tab-item.pitch::after {
|
||||||
|
position: absolute;
|
||||||
|
bottom: -6rpx;
|
||||||
|
left: 50%;
|
||||||
|
transform: translateX(-50%) translateY(100%);
|
||||||
|
background-color: rgba(253, 218, 85, 1);
|
||||||
|
width: 58.5rpx;
|
||||||
|
height: 6rpx;
|
||||||
|
border-radius: 58.5rpx;
|
||||||
|
content: "";
|
||||||
|
|
||||||
|
}
|
||||||
|
|
||||||
|
.map {
|
||||||
|
width: 100vw;
|
||||||
|
height: 100vh;
|
||||||
|
/* flex: 1;
|
||||||
|
max-height:90vh; */
|
||||||
|
}
|
||||||
|
|
||||||
|
.tab-box {
|
||||||
|
z-index: 1000;
|
||||||
|
position: absolute;
|
||||||
|
top: 21rpx;
|
||||||
|
left: 50%;
|
||||||
|
transform: translateX(-50%);
|
||||||
|
width: 310rpx;
|
||||||
|
height: 56rpx;
|
||||||
|
border-radius: 157.5rpx;
|
||||||
|
background-color: rgba(246, 246, 246, 1);
|
||||||
|
font-size: 24rpx;
|
||||||
|
color: #555555;
|
||||||
|
box-shadow: 0 0 12rpx rgba(0, 0, 0, 0.407843137254902);
|
||||||
|
justify-content: space-between;
|
||||||
|
}
|
||||||
|
|
||||||
|
.tab-box .tab-item {
|
||||||
|
height: 100%;
|
||||||
|
display: flex;
|
||||||
|
align-items: center;
|
||||||
|
font-family: 'PingFangSC-Regular', 'PingFang SC', sans-serif;
|
||||||
|
font-weight: 400;
|
||||||
|
font-style: normal;
|
||||||
|
font-size: 26rpx;
|
||||||
|
color: #555555;
|
||||||
|
padding: 0 10rpx;
|
||||||
|
width: 176rpx;
|
||||||
|
justify-content: center;
|
||||||
|
}
|
||||||
|
|
||||||
|
.tab-box .tab-item.pitch {
|
||||||
|
background-color: rgba(242, 82, 101, 1);
|
||||||
|
border-radius: 157.5rpx;
|
||||||
|
color: #ffffff;
|
||||||
|
font-weight: 650;
|
||||||
|
}
|
||||||
|
|
||||||
|
.dis-f {
|
||||||
|
display: flex;
|
||||||
|
}
|
||||||
|
|
||||||
|
.jus-x {
|
||||||
|
justify-content: center;
|
||||||
|
}
|
||||||
|
|
||||||
|
.al-item {
|
||||||
|
align-items: center;
|
||||||
|
}
|
||||||
|
|
||||||
|
.tool-btn-box {
|
||||||
|
align-items: center;
|
||||||
|
justify-content: space-around;
|
||||||
|
/* position: absolute; */
|
||||||
|
/* top: 0; */
|
||||||
|
/* left: 0; */
|
||||||
|
width: 100%;
|
||||||
|
display: flex;
|
||||||
|
align-items: center;
|
||||||
|
/* z-index: 666; */
|
||||||
|
background-color: #fff;
|
||||||
|
flex-wrap: wrap;
|
||||||
|
}
|
||||||
|
|
||||||
|
.tool-btn-box .line-box {
|
||||||
|
width: 4rpx;
|
||||||
|
height: 34rpx;
|
||||||
|
background: #f2f2f2;
|
||||||
|
|
||||||
|
}
|
||||||
|
|
||||||
|
.btn-box {
|
||||||
|
align-items: center;
|
||||||
|
font-family: 'PingFangSC-Regular', 'PingFang SC', sans-serif;
|
||||||
|
font-weight: 400;
|
||||||
|
font-style: normal;
|
||||||
|
font-size: 32rpx;
|
||||||
|
color: #7F7F7F;
|
||||||
|
height: 110rpx;
|
||||||
|
width: 33%;
|
||||||
|
justify-content: center;
|
||||||
|
}
|
||||||
|
|
||||||
|
.down-btn-box {
|
||||||
|
width: 32rpx;
|
||||||
|
height: 32rpx;
|
||||||
|
border-radius: 16rpx;
|
||||||
|
margin-left: 20rpx;
|
||||||
|
background: rgba(229, 232, 240, 1);
|
||||||
|
justify-content: center;
|
||||||
|
align-items: center;
|
||||||
|
}
|
||||||
|
|
||||||
|
.select-true-btn {
|
||||||
|
background: #000;
|
||||||
|
}
|
||||||
|
|
||||||
|
.down-btn-box .img {
|
||||||
|
width: 16rpx;
|
||||||
|
height: 16rpx;
|
||||||
|
}
|
||||||
|
|
||||||
|
.price-box {
|
||||||
|
background: transparent;
|
||||||
|
min-width: 160rpx;
|
||||||
|
font-size: 22rpx;
|
||||||
|
color: #7F7F7F;
|
||||||
|
text-align: center;
|
||||||
|
display: flex;
|
||||||
|
justify-content: center;
|
||||||
|
font-family: PingFangSC-Regular, "PingFang SC", sans-serif;
|
||||||
|
font-weight: 400;
|
||||||
|
padding:0 10rpx;
|
||||||
|
border:0px solid;
|
||||||
|
box-shadow: 0px 0px 5px rgba(0, 0, 0, 0);
|
||||||
|
}
|
||||||
|
|
||||||
|
.place-info-box {
|
||||||
|
position: fixed;
|
||||||
|
bottom: 0;
|
||||||
|
z-index:200;
|
||||||
|
}
|
||||||
|
|
||||||
|
.place-info-box .info-box {
|
||||||
|
width: 100vw;
|
||||||
|
/* height: 200rpx; */
|
||||||
|
padding: 20rpx 0 50rpx 0;
|
||||||
|
background: inherit;
|
||||||
|
background-color: rgba(255, 255, 255, 1);
|
||||||
|
border: none;
|
||||||
|
border-bottom: 0px;
|
||||||
|
border-radius: 80rpx;
|
||||||
|
border-bottom-right-radius: 0px;
|
||||||
|
border-bottom-left-radius: 0px;
|
||||||
|
-moz-box-shadow: 0px 0px 16rpx rgba(0, 0, 0, 0.156862745098039);
|
||||||
|
-webkit-box-shadow: 0px 0px 16rpx rgba(0, 0, 0, 0.156862745098039);
|
||||||
|
box-shadow: 0px 0px 16rpx rgba(0, 0, 0, 0.156862745098039);
|
||||||
|
}
|
||||||
|
|
||||||
|
.place-info-box .info-box .img {
|
||||||
|
width: 32rpx;
|
||||||
|
height: 32rpx;
|
||||||
|
}
|
||||||
|
|
||||||
|
.place-info-box .info-box .title {
|
||||||
|
font-family: 'PingFangSC-Regular', 'PingFang SC', sans-serif;
|
||||||
|
font-weight: 400;
|
||||||
|
font-style: normal;
|
||||||
|
font-size: 26rpx;
|
||||||
|
color: #555555;
|
||||||
|
text-align: center;
|
||||||
|
margin-top: 20rpx;
|
||||||
|
}
|
||||||
|
|
||||||
|
.place-price-box {
|
||||||
|
width: 140rpx;
|
||||||
|
border-radius: 50rpx;
|
||||||
|
padding:15rpx 0;
|
||||||
|
font-size: 22rpx;
|
||||||
|
font-family: PingFangSC-Regular, "PingFang SC", sans-serif;
|
||||||
|
font-weight: 400;
|
||||||
|
font-style: normal;
|
||||||
|
position: relative;
|
||||||
|
z-index:200;
|
||||||
|
/* line-height: 50rpx; */
|
||||||
|
}
|
||||||
|
.apartment-text{
|
||||||
|
background: #fff;
|
||||||
|
border:1px solid #ccc;
|
||||||
|
}
|
||||||
|
.check-place-box {
|
||||||
|
width: 140rpx;
|
||||||
|
border-radius: 50rpx;
|
||||||
|
padding:15rpx 10rpx;
|
||||||
|
background: #000;
|
||||||
|
font-size: 22rpx;
|
||||||
|
color: #FDDF6D;
|
||||||
|
font-family: PingFangSC-Regular, "PingFang SC", sans-serif;
|
||||||
|
font-weight: 400;
|
||||||
|
font-style: normal;
|
||||||
|
position:absolute;
|
||||||
|
z-index:260;
|
||||||
|
border:1px solid transparent;
|
||||||
|
/* line-height: 50rpx; */
|
||||||
|
}
|
||||||
|
.dis-n{
|
||||||
|
display: none;
|
||||||
|
}
|
||||||
|
.check-place-box-triangle{
|
||||||
|
width: 20rpx;
|
||||||
|
height:20rpx;
|
||||||
|
object-fit: contain;
|
||||||
|
/* border-style: solid; */
|
||||||
|
/* border-color: #000 transparent transparent transparent; */
|
||||||
|
/* border-width: 10rpx; */
|
||||||
|
position: absolute;
|
||||||
|
bottom:-5rpx;
|
||||||
|
}
|
||||||
|
|
||||||
|
.place-list {
|
||||||
|
overflow-x: scroll;
|
||||||
|
white-space: nowrap;
|
||||||
|
width:100vw;
|
||||||
|
}
|
||||||
|
|
||||||
|
.place-list-box {
|
||||||
|
width: 690rpx;
|
||||||
|
border-radius: 20rpx;
|
||||||
|
padding:30rpx 20rpx;
|
||||||
|
background: #fff;
|
||||||
|
margin-left: 20rpx;
|
||||||
|
box-shadow: 0rpx 0rpx 20rpx rgba(0, 0, 0, 0.5);
|
||||||
|
position: relative;
|
||||||
|
}
|
||||||
|
.place-list-box .apartment-info-box{
|
||||||
|
border-radius:0 20rpx 20rpx 20rpx;
|
||||||
|
padding:25rpx 20rpx;
|
||||||
|
background:#fff;
|
||||||
|
height:246rpx;
|
||||||
|
width: 100%;
|
||||||
|
position: absolute;
|
||||||
|
z-index:555;
|
||||||
|
top:0;
|
||||||
|
left:254rpx;
|
||||||
|
width: 442rpx;
|
||||||
|
}
|
||||||
|
.place-list-box .apartment-info-box .title{
|
||||||
|
font-family: 'PingFangSC-Semibold', 'PingFang SC Semibold', 'PingFang SC', sans-serif;
|
||||||
|
font-weight: 650;
|
||||||
|
font-style: normal;
|
||||||
|
font-size: 32rpx;
|
||||||
|
color: #000000;
|
||||||
|
margin-left:0;
|
||||||
|
}
|
||||||
|
.place-list-box .apartment-info-box .introduce{
|
||||||
|
font-family: 'PingFangSC-Regular', 'PingFang SC', sans-serif;
|
||||||
|
font-weight: 400;
|
||||||
|
font-style: normal;
|
||||||
|
font-size: 22rpx;
|
||||||
|
margin-top:20rpx;
|
||||||
|
}
|
||||||
|
.place-list-box .apartment-info-box .house-type{
|
||||||
|
font-family: 'PingFangSC-Regular', 'PingFang SC', sans-serif;
|
||||||
|
font-weight: 400;
|
||||||
|
font-style: normal;
|
||||||
|
color: #AAAAAA;
|
||||||
|
font-size:22rpx;
|
||||||
|
margin-top:20rpx;
|
||||||
|
}
|
||||||
|
.place-list-box .apartment-img-box{
|
||||||
|
width: 270rpx;
|
||||||
|
border-radius: 20rpx 20rpx 0 20rpx;
|
||||||
|
background:#000;
|
||||||
|
}
|
||||||
|
.place-list-box .apartment-img-box .apartment-img{
|
||||||
|
width: 270rpx;
|
||||||
|
height: 187rpx;
|
||||||
|
border-radius:20rpx 20rpx 0 20rpx;
|
||||||
|
background:#fff;
|
||||||
|
position: absolute;
|
||||||
|
top:0;
|
||||||
|
left:0;
|
||||||
|
z-index:666;
|
||||||
|
}
|
||||||
|
.place-list-box .apartment-img-box .apartment-img .img{
|
||||||
|
width:254rpx;
|
||||||
|
height:188rpx;
|
||||||
|
border-radius:20rpx 20rpx 0 20rpx;
|
||||||
|
background:#ccc;
|
||||||
|
}
|
||||||
|
.place-list-box .apartment-img-box .apartment-title-text{
|
||||||
|
height:60rpx;
|
||||||
|
width: 240rpx;
|
||||||
|
text-align: center;
|
||||||
|
line-height:60rpx;
|
||||||
|
font-family: 'PingFangSC-Regular', 'PingFang SC', sans-serif;
|
||||||
|
font-weight: 400;
|
||||||
|
font-style: normal;
|
||||||
|
font-size: 24rpx;
|
||||||
|
color: #FDDA55;
|
||||||
|
}
|
||||||
|
|
||||||
|
.place-list-box .place-list-confirm-img{
|
||||||
|
width:140rpx;
|
||||||
|
height:140rpx;
|
||||||
|
position: absolute;
|
||||||
|
top:-8rpx;
|
||||||
|
right:-10rpx;
|
||||||
|
z-index: 666;
|
||||||
|
object-fit: contain;
|
||||||
|
}
|
||||||
|
|
||||||
|
.place-list-box .title {
|
||||||
|
font-family: 'PingFangSC-Regular', 'PingFang SC', sans-serif;
|
||||||
|
font-weight: 400;
|
||||||
|
font-style: normal;
|
||||||
|
font-size: 30rpx;
|
||||||
|
color: #000000;
|
||||||
|
width: 400rpx;
|
||||||
|
overflow: hidden;
|
||||||
|
white-space: nowrap;
|
||||||
|
text-overflow: ellipsis;
|
||||||
|
-o-text-overflow: ellipsis;
|
||||||
|
margin-left:15rpx;
|
||||||
|
}
|
||||||
|
|
||||||
|
.place-list-box .title-tab {
|
||||||
|
font-family: 'PingFangSC-Regular', 'PingFang SC', sans-serif;
|
||||||
|
font-weight: 400;
|
||||||
|
font-style: normal;
|
||||||
|
font-size: 26rpx;
|
||||||
|
color: #FDDF6D;
|
||||||
|
background: #000;
|
||||||
|
border-radius: 8rpx;
|
||||||
|
text-align: center;
|
||||||
|
padding: 4rpx 15rpx;
|
||||||
|
}
|
||||||
|
.place-list-box .place-list-info-box{
|
||||||
|
justify-content: space-between;
|
||||||
|
align-items: center;
|
||||||
|
margin-top: 30rpx;
|
||||||
|
}
|
||||||
|
.place-list-box .place-img{
|
||||||
|
width: 140rpx;
|
||||||
|
height: 163rpx;
|
||||||
|
border-radius:14rpx;
|
||||||
|
object-fit: contain;
|
||||||
|
/* margin-top:20rpx; */
|
||||||
|
background:#555555;
|
||||||
|
}
|
||||||
|
.place-list-box .place-info{
|
||||||
|
flex-direction: column;
|
||||||
|
justify-content: space-between;
|
||||||
|
height:163rpx;
|
||||||
|
}
|
||||||
|
.place-list-box .tab-text{
|
||||||
|
font-family: 'PingFangSC-Regular', 'PingFang SC', sans-serif;
|
||||||
|
font-weight: 400;
|
||||||
|
font-style: normal;
|
||||||
|
font-size: 24rpx;
|
||||||
|
color: #555555;
|
||||||
|
}
|
||||||
|
.place-list-box .currency{
|
||||||
|
font-family: 'Arial-Black', 'Arial Black', sans-serif;
|
||||||
|
font-weight: 900;
|
||||||
|
color: #000000;
|
||||||
|
font-size:24rpx;
|
||||||
|
line-height:46rpx;
|
||||||
|
}
|
||||||
|
.place-list-box .price{
|
||||||
|
font-family: 'Arial-Black', 'Arial Black', sans-serif;
|
||||||
|
font-weight: 900;
|
||||||
|
font-size: 32rpx;
|
||||||
|
color: #F95D5D;
|
||||||
|
line-height:38rpx;
|
||||||
|
margin-left:10rpx;
|
||||||
|
}
|
||||||
|
.place-list-box .interval-time{
|
||||||
|
font-family: 'PingFangSC-Regular', 'PingFang SC', sans-serif;
|
||||||
|
font-weight: 400;
|
||||||
|
font-style: normal;
|
||||||
|
font-size: 21rpx;
|
||||||
|
color: #555555;
|
||||||
|
line-height:43rpx;
|
||||||
|
margin-left:10rpx;
|
||||||
|
}
|
||||||
|
.place-list-box .place-info .release-info-img{
|
||||||
|
width:30rpx;
|
||||||
|
height:30rpx;
|
||||||
|
border-radius:15rpx;
|
||||||
|
}
|
||||||
|
.place-list-box .place-info .release-info-text{
|
||||||
|
font-family: 'PingFangSC-Regular', 'PingFang SC', sans-serif;
|
||||||
|
font-weight: 400;
|
||||||
|
font-style: normal;
|
||||||
|
font-size: 26rpx;
|
||||||
|
color: #555555;
|
||||||
|
margin-left:20rpx;
|
||||||
|
}
|
||||||
|
.place-list-box .place-info .release-info-btn{
|
||||||
|
padding:0 10rpx;
|
||||||
|
height: 40rpx;
|
||||||
|
background: inherit;
|
||||||
|
background-color: rgba(242, 242, 242, 0);
|
||||||
|
box-sizing: border-box;
|
||||||
|
border-width: 1rpx;
|
||||||
|
border-style: solid;
|
||||||
|
border-color: rgba(215, 215, 215, 1);
|
||||||
|
border-radius: 23rpx;
|
||||||
|
-moz-box-shadow: none;
|
||||||
|
-webkit-box-shadow: none;
|
||||||
|
box-shadow: none;
|
||||||
|
font-family: 'PingFangSC-Regular', 'PingFang SC', sans-serif;
|
||||||
|
font-weight: 400;
|
||||||
|
font-style: normal;
|
||||||
|
font-size: 22rpx;
|
||||||
|
color: #555555;
|
||||||
|
margin-left:20rpx;
|
||||||
|
line-height: 40rpx;
|
||||||
|
}
|
||||||
|
.place-list-box .place-info .confirm-intermediary-img{
|
||||||
|
width:120rpx;
|
||||||
|
height:30rpx;
|
||||||
|
margin-left:30rpx;
|
||||||
|
}
|
||||||
|
|
||||||
|
.place-pop-box{
|
||||||
|
width:100vw;
|
||||||
|
height:100vh;
|
||||||
|
z-index: 220;
|
||||||
|
overflow-y: scroll;
|
||||||
|
background:#f6f6f6;
|
||||||
|
}
|
||||||
|
.place-pop-box-title{
|
||||||
|
font-family: 'PingFangSC-Semibold', 'PingFang SC Semibold', 'PingFang SC', sans-serif;
|
||||||
|
font-weight: 650;
|
||||||
|
font-style: normal;
|
||||||
|
font-size: 35rpx;
|
||||||
|
margin:0 auto;
|
||||||
|
}
|
||||||
|
.place-pop-box .place-information{
|
||||||
|
font-family: 'PingFangSC-Regular', 'PingFang SC', sans-serif;
|
||||||
|
font-weight: 400;
|
||||||
|
color: #555555;
|
||||||
|
font-style: normal;
|
||||||
|
font-size: 24rpx;
|
||||||
|
height:86rpx;
|
||||||
|
margin-top:30rpx;
|
||||||
|
}
|
||||||
|
.btm-tps-text{
|
||||||
|
font-family: 'PingFangSC-Regular', 'PingFang SC', sans-serif;
|
||||||
|
font-weight: 400;
|
||||||
|
font-style: normal;
|
||||||
|
font-size: 23rpx;
|
||||||
|
color: #7F7F7F;
|
||||||
|
margin-top:60rpx;
|
||||||
|
}
|
||||||
|
.btm-tps-img{
|
||||||
|
width:28rpx;
|
||||||
|
height:28rpx;
|
||||||
|
margin:0 10rpx;
|
||||||
|
}
|
||||||
|
.btm-tps-btn{
|
||||||
|
width: 280rpx;
|
||||||
|
height: 67rpx;
|
||||||
|
background: inherit;
|
||||||
|
background-color: rgba(217, 236, 255, 1);
|
||||||
|
border: none;
|
||||||
|
border-radius: 82rpx;
|
||||||
|
-moz-box-shadow: 0px 0px 16rpx rgba(98, 177, 255, 0.0784313725490196);
|
||||||
|
-webkit-box-shadow: 0px 0px 16rpx rgba(98, 177, 255, 0.0784313725490196);
|
||||||
|
box-shadow: 0px 0px 16rpx rgba(98, 177, 255, 0.0784313725490196);
|
||||||
|
font-family: 'PingFangSC-Semibold', 'PingFang SC Semibold', 'PingFang SC', sans-serif;
|
||||||
|
font-weight: 650;
|
||||||
|
font-style: normal;
|
||||||
|
font-size: 28rpx;
|
||||||
|
color: #62B1FF;
|
||||||
|
text-align: center;
|
||||||
|
line-height:67rpx;
|
||||||
|
margin:30rpx 0 60rpx 0;
|
||||||
|
}
|
||||||
|
.inEnd {
|
||||||
|
color: #aaaaaa;
|
||||||
|
margin: 0 auto;
|
||||||
|
font-size: 21rpx;
|
||||||
|
}
|
Binary file not shown.
Loading…
x
Reference in New Issue
Block a user