<style lang="less">
.page-intelligent-control {
position: relative;
// height: 100%;
width: 100%;
box-sizing: border-box;
overflow: hidden;
.top-bar {
height: 96px;
background: #f7f8fa;
}
}
.tool-box {
position: fixed;
bottom: 272rpx;
right: 40rpx;
z-index: 333;
.search-btn-box {
overflow: hidden;
text-align: right;
image {
float: right;
width: 88rpx;
height: 88rpx;
}
}
.search-btn {
margin-bottom: 16rpx;
width: 88rpx;
height: 88rpx;
display: block;
border-radius: 16rpx;
}
.now-floor {
box-sizing: border-box;
padding: 20rpx 0;
background: #ffffff;
border-radius: 16rpx;
box-shadow: 0px 4px 12px 0px #00000008;
.select-building {
display: inline-block;
vertical-align: middle;
padding-left: 28rpx;
padding-right: 24rpx;
font-family: PingFang SC;
font-size: 32rpx;
font-weight: 500;
line-height: 44rpx;
text-align: center;
}
.line {
display: inline-block;
vertical-align: middle;
height: 36rpx;
width: 1px;
background: #e1e5eb;
}
.select-floor {
display: inline-block;
vertical-align: middle;
padding: 0 24rpx;
font-family: PingFang SC;
font-size: 32rpx;
font-weight: 500;
line-height: 44rpx;
text-align: center;
background: #fff;
}
}
}
.page-intelligent-control .map-contanier {
// height: 100%;
width: 100%;
// padding-bottom: 176rpx;
//background: #ebeef5;
background: #f7f8fa;
box-sizing: border-box;
}
.page-intelligent-control .location-wrapper {
position: fixed;
bottom: 272rpx;
right: 40rpx;
z-index: 444;
&.fold {
}
&.building {
}
}
.page-intelligent-control .location-wrapper.expand {
bottom: 658rpx;
}
movable-area {
width: 100%;
height: 0;
position: relative;
}
movable-view {
color: #fff;
}
.room-item {
position: absolute;
box-shadow: 0px 1px 4px rgba(1, 1, 51, 0.01),
0px 16px 40px rgba(1, 1, 51, 0.03);
border-radius: 4px;
box-sizing: border-box;
padding: 0 12rpx;
transform-origin: center;
z-index: 1;
&.isAbnormity {
padding: 0;
}
}
// 租户可控
.tent-space {
background: #ffffff;
}
// 用户可控
.user-space {
background: #d5e4ed;
}
// 不能控制
.no-control {
}
.room-item.selected {
border: 2px solid rgba(77, 148, 255, 0.8);
}
.room-item.transparent {
box-shadow: none;
}
.room-item.selected.transparent {
border: 0;
}
.room-item.clickDisabled {
border: 2px solid #dfe3ed;
box-sizing: border-box;
background-repeat: repeat;
}
.room-item .bg-disabled {
width: 100%;
height: 100%;
border-radius: 4px;
}
.room-item .icon {
width: 40rpx;
height: 40rpx;
position: absolute;
top: 50%;
left: 50%;
transform: translateX(-50%) translateY(-50%);
}
.room-item .circle {
width: 8rpx;
height: 8rpx;
border-radius: 50%;
position: absolute;
top: 50%;
left: 50%;
transform: translateX(-50%) translateY(-50%);
}
.room-item .door {
position: absolute;
width: 48rpx;
height: 24rpx;
}
.room-item .text {
font-weight: 600;
font-size: 20rpx;
line-height: 24rpx;
text-align: center;
color: #8995ba;
position: absolute;
top: 50%;
left: 50%;
width: 100%;
transform: translateX(-50%) translateY(32rpx);
padding: 0 16rpx;
box-sizing: border-box;
word-break: break-all;
}
.area-items-wrapper {
position: relative;
width: 100%;
height: 100%;
}
.selected-icon {
height: 38px;
box-sizing: border-box;
position: absolute;
// background: #ac8be8;
border-radius: 30px;
background-size: 100% 100%;
z-index: 9999;
text-align: center;
padding: 8px;
max-width: 140px;
.sanjiao {
position: absolute;
content: '';
width: 0;
height: 0;
top: 30px;
left: 50%;
transform: translateX(-50%) rotate(90deg);
border-top: solid 10px transparent;
border-left: solid 10px;
border-bottom: solid 10px transparent;
border-top-width: 10px;
border-top-style: solid;
border-top-color: transparent;
border-left-width: 10px;
border-left-style: solid;
// border-left-color: #ac8be8;
border-bottom-width: 10px;
border-bottom-style: solid;
border-bottom-color: transparent;
}
label {
position: relative;
display: inline-block;
// width: 100%;
max-width: 132px;
font-family: PingFang SC;
font-size: 14px;
font-weight: 600;
line-height: 22px;
letter-spacing: 0px;
text-align: center;
overflow: hidden;
white-space: nowrap;
text-overflow: ellipsis;
margin: 0 auto;
}
}
.room-item.selected .text {
font-weight: 600;
font-size: 24rpx;
line-height: 24rpx;
text-align: center;
white-space: nowrap;
color: #515a76;
top: 50%;
left: 50%;
z-index: 2;
width: auto;
padding: 0;
text-shadow: #fff 1px 0 0, #fff 0 1px 0, #fff -1px 0 0, #fff 0 -1px 0;
transform: translateX(-50%) translateY(-50%);
}
.room-item.selected.ConferenceRoom {
box-shadow: 0px 0px 4px rgba(1, 1, 51, 0.01),
0px 0px 40px rgba(1, 1, 51, 0.03);
border-radius: 2px;
border: 2px solid rgba(77, 148, 255, 0.42);
}
.office-content-abstract {
position: absolute;
bottom: 0;
left: 0;
right: 0;
height: 238rpx;
box-shadow: 0px 0px 2rpx rgba(0, 0, 0, 0.05),
0px 8rpx 30rpx rgba(0, 0, 0, 0.15);
border-radius: 50rpx 50rpx 0px 0px;
box-sizing: border-box;
padding: 48rpx 48rpx 0;
background: #ffffff;
.title {
font-weight: 600;
font-size: 36rpx;
line-height: 50rpx;
color: #000000;
}
.btn-switch {
position: absolute;
top: 40rpx;
right: 48rpx;
width: 148rpx;
height: 64rpx;
font-weight: 500;
font-size: 28rpx;
line-height: 64rpx;
color: #000000;
background: #ffe823;
text-align: center;
box-shadow: 0px 0px 2rpx rgba(0, 0, 0, 0.15),
0px 8rpx 12rpx rgba(0, 0, 0, 0.07);
border-radius: 60rpx;
}
}
.icon-arrow {
text-align: right;
.icon-arrow-box {
margin-top: 8rpx;
box-sizing: border-box;
border-radius: 16rpx;
display: inline-block;
height: 88rpx;
line-height: 88rpx;
text-align: center;
width: 152rpx;
background: #fff;
box-shadow: 0px 4px 12px 0px #00000008;
label {
display: inline-block;
vertical-align: middle;
font-family: PingFang SC;
font-size: 32rpx;
font-weight: 500;
letter-spacing: 0px;
}
image {
display: inline-block;
vertical-align: middle;
margin-left: 16rpx;
width: 24rpx;
height: 24rpx;
}
}
}
</style>
<template>
<div class="page-intelligent-control">
<div class="top-bar"></div>
<div class="map-contanier">
<movable-area
:style="{'height':mapParentHeight+'px','width':mapParentWidth+'px'}"
scale-area="true"
>
<movable-view
x="{{x}}"
y="{{y}}"
style="height:{{mapHeight}}px;width:{{mapWidth}}px"
direction="all"
out-of-bounds="false"
bindscale="onScale"
scale="true"
scale-min="0.5"
scale-max="1"
scale-value="1"
>
<div class="area-items-wrapper">
<block
v-for="(area, index) in mapAreasInfo"
:key="index">
<div
@tap="selectAreaFun(area)"
class="room-item {{area.isAbnormity? 'isAbnormity': ''}}"
style="{{'width:'+ (area.isAbnormity? '0px;':area.width*mapScale +'px;') + 'height:'+(area.isAbnormity? '0px;':area.height*mapScale +'px;')+'left:'+area.left*mapScale+'px;'+'top:'+area.top*mapScale+'px;'+(area.isAbnormity?'': 'background-color:'+ area.backgroundColor+';'+(!area.isCompanyControl?('background-image:url(' +h5StaticPath+ '/page-map-icon/bg_disable.png);'): '')) + (area.isAbnormity?('border-top:' + area['borderWidth'][0]*mapScale +'px solid ' +area['borderColor'][0]+ ';' + 'border-right:' + area['borderWidth'][1]*mapScale+'px solid ' + area['borderColor'][1] +';' +'border-bottom:' + area['borderWidth'][2]*mapScale +'px solid ' +area['borderColor'][2] + ';' + 'border-left:' + area['borderWidth'][3]*mapScale +'px solid ' +area['borderColor'][3] + ';'):'')+ (area['borderRadius'] && area['borderRadius'].length? 'border-radius:' + area['borderRadius'][0]*mapScale + 'px ' + area['borderRadius'][1]*mapScale + 'px ' + area['borderRadius'][2]*mapScale + 'px ' + area['borderRadius'][3]*mapScale + 'px;': '')+(area.rotate?'transform:rotate('+area.rotate+'deg)': '')}}"
:class="{'selected': selectArea.spaceId === area.spaceId,
'clickDisabled': area.isCompanyControl !==true,'transparent': !area.isCompanyControl}"
>
<block
wx:if="{{area.width*mapScale*touchScale>24&&area.height*mapScale*touchScale>24}}"
>
<image
wx:if="{{area.icon}}"
class="icon"
src="{{h5StaticPath+ '/page-map-icon/' + area.icon}}"
/>
</block>
<block
wx:elif="{{area.width*mapScale*touchScale>=24 || area.height*mapScale*touchScale>=24}}"
>
<div class="circle" style="{{'background-color:'+ area.circleColor+';'}}"></div>
</block>
<div
class="text"
wx:if="{{selectArea.spaceId === area.spaceId || (area.height*mapScale>80 && (area.title.length*screenScale*10 +16*screenScale)<area.width*mapScale)}}"
>{{area.title}}</div>
</div>
</block>
<div
class="selected-icon"
v-if="selectArea"
mode="scaleToFill"
:style="{top:(selectArea.top*mapScale-38)+'px',width:(selectArea.selectIconWidth)+'px',left:(selectArea.left*mapScale+(selectArea.width*mapScale/2)-selectArea.selectIconWidth/2)+'px',background:(selectArea.circleColor), transform: 'rotate('+(selectArea.rotate)+'deg)'}"
>
<span :style="{'border-left-color':(selectArea.circleColor)}" class="sanjiao "></span>
<label>{{ selectArea.localName }}</label>
</div>
</div>
</movable-view>
<div class="tool-box" v-if="foldStatus!=='expand'">
<div class="search-btn-box">
<image
v-on:click="toSearchPage"
class="search-btn"
src="{{h5StaticPath}}/page-intelligent-control/icon-search-big.svg"
/>
</div>
<div class="now-floor"
v-on:click="changeBuilding">
<div class="select-building"
v-if="buildingData && buildingData.length>1"
>{{ buildingItem.localName }}</div>
<div class="line" v-if="buildingData && buildingData.length>1"></div>
<div class="select-floor">{{ floorItem.localName }}</div>
</div>
</div>
<div v-if="foldStatus=='expand'" class="location-wrapper">
<!--楼层和建筑数据-->
<floor
status="{{floorStatus}}"
:floors="floors"
:buildings="buildingData"
selectedBuilding="{{ selectedBuilding }}"
selectedFloor="{{selectedFloor}}"
@component-building-change="changeBuildingFun($event)"
@component-floor-change="changeFloorFun($event)"
></floor>
<!--查看更多 -->
<div class="icon-arrow">
<div class="icon-arrow-box"
@click="closeExpend">
<label>收起</label>
<image
mode="scaleToFill"
class="icon"
src="{{h5StaticPath+ 'page-intelligent-control/icon-floor-arrow.svg'}}"/>
</div>
</div>
</div>
</movable-area>
</div>
</div>
</template>
<script>
import wepy from '@wepy/core';
import store from '@/store';
import {
getSpaceBytoothHttp,
getMapDetailHttp
} from '@/packagesEnv/api/intelligentControl';
import { checkHasUserInfo } from '@/service/user';
import utils from '@/common/utils';
// import { getMapSpaceIcon } from '@/common/utils.js';
import config from '@/config';
import { mapState } from '@wepy/x';
import { saveCompanyConfig } from '@/service/companyConfig';
import { getCompanyMapData } from '@/api/home';
import {
getBuildingList,
getFloorList,
getMapInfo
} from '@/packagesEnv/api/mapApi.js';
let h5StaticPath = config.h5StaticPath;
const tarBarHeight = 96;
const panelExpandHeight = 407; // 单位为px
const panelFoldHeight = 96; // 单位为px
const switchPanelHeight = 145; // 单位为px
const standerScreenWidth = 375;
const standerMapHeight = 812 - tarBarHeight - panelFoldHeight; // 在375*812屏幕下地图所能展示区域的大小px
let screenInfo = {};
let standerMapWidth = 2336;
let mapScale;
let screenScale;
let foldPanelPXHeight; // 在不同的手机屏幕的实际高度
let expandPXHeight;
let pageSelectedAreaRecord = {
// key为楼层ID，value 为spceId
};
let touchMapStartRecord = {
timeStamp: 0,
pageX: 0,
pageY: 0
};
let touchMapEndRecord = {
timeStamp: 0,
pageX: 0,
pageY: 0
};
let from = 'officehome';
let CompanyMapData = {};
let combinedData = [];
wepy.component({
props: {
space: {
type: Object,
default: {
isControlSpace: 0,
buildingId: 'Bd1101080259317347f00d0811ebb06b1d2749356f83',
spaceId: 'Sp1101080259308f5ed92e964bc1b029038dea962de4',
spaceName: '上格云二区',
floorId: 'Fl1101080259282bba688d32419caa57685ff17447b2'
}
}
},
store,
data: {
currentSp: '', // 空间id 用于路由跳转
h5StaticPath,
mapAreasInfo: [],
selectArea: null,
x: 0,
y: 0,
selectedBuilding: '',
selectedFloor: '',
foldStatus: 'fold', // fold-最小化 expand-展开状态
floorStatus: 'fold', // flod-收起楼层 expand-展开楼层选则
mapHeight: 507,
mapParentHeight: 607,
mapParentWidth: 375,
mapWidth: 2336,
mapScale: 1,
screenScale: 1,
mapMoveByTouch: false,
touchScale: 1,
isShowLocationEntrance: false,
canSearchPerson: true,
canSlideExpanel: true,
pageHide: false,
query: {},
floors: [],
companyId: '',
buildingData: [],
buildingItem: {},
floorItem: {}
},
computed: {
...mapState({
userInfo: state => state.user.userInfo
})
},
ready() {
// 获取地图数据
console.log('地图模块触发了--');
if (this.space) {
this.init();
}
},
// 页面激活
attached() {},
watch: {
// 父亲传过来的空间id 搜索返回才会有这个传递
space: function(newSpace, oldSpace) {
console.log('获取到空间数据--');
console.log(newSpace);
// console.log(oldSpace)
}
},
methods: {
// 收起
closeExpend() {
console.log('点击了收起--');
this.foldStatus = 'fold';
console.log(this.foldStatus);
},
init() {
// this.projectId = 'Pj3301100002';
console.log(this.userInfo);
this.projectId = this.userInfo.projectId;
this.getPageBuildingList();
},
// 展开建筑
changeBuilding() {
if (this.floors && this.floors.length > 1) {
this.foldStatus = 'expand';
} else {
return;
}
},
//设置建筑名称
setBuidingItem() {
console.log('this.space.buildingId==', this.space.buildingId);
this.buildingData.map(item => {
if (item.id == this.space.buildingId) {
this.selectedBuilding = item.id;
this.buildingItem = item;
}
});
},
//获取建筑数据
getPageBuildingList() {
let params = {
criteria: {
projectId: this.projectId
}
};
getBuildingList(params).then(res => {
this.buildingData = res.content || [];
console.log('this.selectedBuilding==', this.selectedBuilding);
this.setBuidingItem();
console.log('this.selectedBuilding==', this.selectedBuilding);
if (this.selectedBuilding) {
this.getFloorList();
}
});
},
// 设置楼层
setFlorrItem() {
this.floors.map(item => {
if (item.id == this.space.floorId) {
this.selectedFloor = item.id;
this.floorItem = item;
}
});
},
/**
* 查询楼层信息
*/
getFloorList() {
let params = {
criteria: {
projectId: this.projectId,
buildingId: this.selectedBuilding
}
};
getFloorList(params).then(res => {
this.floors = res.content || [];
this.setFlorrItem();
// console.log('this.selectedFloor==', this.selectedFloor);
if (this.selectedFloor) {
this.getPageMapInfo();
}
});
},
/**
* 获取地图信息
*/
getPageMapInfo() {
let params = {
projectId: this.projectId,
floorId: this.selectedFloor,
userCode: this.userInfo.userId,
companyId: this.userInfo.companyId
};
getMapInfo(params)
.then(res => {
let data = res.data || {};
this.mapAreasInfo = data.spaceList || [];
CompanyMapData.mapWidth = data.width;
this.setMapIcon();
this.getMapSize();
console.log('this.selectArea===', this.selectArea);
})
.catch(() => {});
},
// 设置地图的图标
setMapIcon() {
this.mapAreasInfo.map(item => {
if (item.spaceId == this.space.spaceId) {
this.selectArea = item;
}
if (item.localName) {
item.selectIconWidth = item.localName.length * 14 + 16;
if (item.selectIconWidth < 74) {
item.selectIconWidth = 74;
}
if (item.selectIconWidth > 140) {
item.selectIconWidth = 132;
}
} else {
item.selectIconWidth = 0;
}
item.icon = utils.getMapSpaceIcon(item.roomFuncType).icon;
item.typeName = utils.getMapSpaceIcon(item.roomFuncType).typeName;
item.selectIcon = item.icon;
if (item.typeName == '开放办公区') {
item.circleColor = '#6B96D9';
} else if (item.typeName == '个人办公区') {
item.circleColor = '#AC8BE8';
} else if (item.typeName == '会议室') {
item.circleColor = '#69CACB';
} else {
item.circleColor = '#9DAACB';
}
if (item.isCompanyControl) {
item.backgroundColor = '#D5E4ED';
}
if (item.isCompanyControl && item.isUserControl) {
item.backgroundColor = '#FFFFFF';
}
if (!item.isCompanyControl) {
item.backgroundColor = '';
}
});
},
// 切换建筑
changeBuildingFun(building) {
// this.buildingItem = building;
this.selectedBuilding = building;
this.getFloorList();
},
// 切换楼层
changeFloorFun(floor) {
console.log('切换楼层');
this.selectedFloor = floor;
// this.floorItem = floor;
this.getPageMapInfo();
},
// 获取地图的缩放比例
getMapSize() {
getScreenInfo().then(res => {
this.screenScale = res.screenScale;
});
this.getMapScale().then(res => {
this.mapScale = res.mapScale;
this.mapWidth = Math.ceil(res.mapScale * CompanyMapData.mapWidth); // 因为有小数点的误差，故增加一部分
this.mapHeight = res.mapHeight;
this.mapParentHeight = res.mapHeight;
this.mapParentWidth = res.screenWidth;
});
},
getHistorySelectedArea() {
return new Promise((resolve, reject) => {
wx.getStorage({
key: 'SelectedASpace',
success: res => {
if (res.data && res.data.spaceId) {
pageSelectedAreaRecord = {
...CompanyMapData.defalutSelectedId,
[res.data.floorId]: res.data.spaceId // 如果有历史记录选中，覆盖值
};
resolve(res.data);
} else {
pageSelectedAreaRecord = CompanyMapData.defalutSelectedId;
resolve({
spaceId: CompanyMapData.defalutSelectedId[this.selectedFloor],
floorId: this.selectedFloor
});
}
},
fail: () => {
pageSelectedAreaRecord = CompanyMapData.defalutSelectedId;
resolve({
spaceId: CompanyMapData.defalutSelectedId[this.selectedFloor],
floorId: this.selectedFloor
});
}
});
});
},
// 设置选中的路径
doSelectArea(area, sign) {
if (!area) {
return;
}
this.selectArea = area;
this.selectedFloor = area.floorId;
this.setAreaCenter(area);
if (!sign) {
// 如果是父亲传进来的areaId 不执行下面的触发
console.log('this.selectArea==', this.selectArea);
this.$emit('mapChangeSpaceInfo', area); // 传给父组件，以请求数据
}
},
// 获取选中的空间
selectAreaFun(currentSelect) {
if (!currentSelect.isCompanyControl) {
wx.showToast({
title: '不可选区域',
duration: 1000,
icon: 'none'
});
return;
}
this.selectArea = null;
this.doSelectArea(currentSelect);
},
setAreaCenter(area) {
if (!area.id) {
return;
}
if (this.touchScale !== 1) {
return;
}
getExpandPXHeight()
.then(res => {
const { expandPXHeight, screenHeight, screenWidth } = res;
return this.getMapScale().then(res => {
return {
...res,
expandPXHeight,
screenHeight,
screenWidth
};
});
})
.then(res => {
const { foldStatus } = this;
const {
screenHeight,
screenWidth,
expandPXHeight,
mapScale,
mapHeight
} = res;
let viewHeight = screenHeight - tarBarHeight - expandPXHeight;
let viewCenterX = screenWidth / 2,
viewCenterY = viewHeight / 2,
areaCenterX =
(parseInt(area.left) + parseInt(area.width) / 2) * mapScale,
areaCenterY =
(parseInt(area.top) + parseInt(area.height) / 2) * mapScale;
let x = parseInt(viewCenterX - areaCenterX);
let y = parseInt(viewCenterY - areaCenterY);
let max = expandPXHeight - foldPanelPXHeight + 20;
this.mapMoveByTouch = false;
this.x = x > 0 ? 0 : x; // 超过边线设置边线值
this.y =
foldStatus === 'expand' ? (Math.abs(y) > max ? -max : y) : this.y; // 当面板展开时候，才需垂直居中
// wx.showModal({
// title: '提示', //提示的标题,
// content: `x值:${this.x} y值:${y}`, //提示的内容,
// showCancel: true, //是否显示取消按钮,
// cancelText: '取消', //取消按钮的文字，默认为取消，最多 4 个字符,
// cancelColor: '#000000', //取消按钮的文字颜色,
// confirmText: '确定', //确定按钮的文字，默认为取消，最多 4 个字符,
// confirmColor: '#3CC51F', //确定按钮的文字颜色,
// success: res => {}
// });
this.mapHeight = screenHeight - tarBarHeight - foldPanelPXHeight; // 相当于加入底部空白，让面板被顶起来
});
},
onScale(e) {
this.touchScale = e.$wx.detail.scale;
},
// 下面面板折叠起来的逻辑
foldPanelFun() {
this.getMapHeight().then(res => {
this.mapHeight = res.mapHeight;
this.y = 0;
});
if (this.foldStatus === 'expand') {
this.foldStatus = 'fold';
}
},
toSearchPage() {
console.log('被点击了');
wx.navigateTo({
url: `/packagesEnv/pages/search/index`
});
},
goBack() {
wx.navigateBack({
delta: 1 // 返回的页面数，如果 delta 大于现有页面数，则返回到首页,
});
},
getfoldPanelPXHeight() {
if (
foldPanelPXHeight &&
screenInfo &&
screenInfo.screenWidth &&
screenInfo.screenHeight
) {
return Promise.resolve({
foldPanelPXHeight,
screenWidth: screenInfo.screenWidth,
screenHeight: screenInfo.screenHeight
});
}
return getScreenInfo().then(res => {
let foldHeight =
from == 'officehome' ? switchPanelHeight : panelFoldHeight;
// foldPanelPXHeight = parseInt(res.screenScale * foldHeight);
foldPanelPXHeight = parseInt(foldHeight);
return {
screenWidth: res.screenWidth,
screenHeight: res.screenHeight,
foldPanelPXHeight
};
});
},
getMapHeight() {
return this.getfoldPanelPXHeight().then(res => {
let mapHeight = res.screenHeight - tarBarHeight - res.foldPanelPXHeight;
return {
...res,
mapHeight
};
});
},
getMapScale() {
return this.getMapHeight().then(res => {
mapScale = Math.floor((res.mapHeight / standerMapHeight) * 10) / 10;
return {
...res,
mapScale
};
});
}
}
});
function getScreenInfo() {
if (
screenScale &&
screenInfo &&
screenInfo.screenWidth &&
screenInfo.screenHeight
) {
return Promise.resolve({
...screenInfo,
screenScale
});
}
return new Promise((resolve, reject) => {
wx.getSystemInfo({
success: res => {
screenInfo.screenHeight = res.screenHeight;
screenInfo.screenWidth = res.screenWidth;
screenScale = res.screenWidth / standerScreenWidth;
resolve({
screenWidth: res.screenWidth,
screenHeight: res.screenHeight,
screenScale
});
}
});
});
}
function getExpandPXHeight() {
if (
expandPXHeight &&
screenInfo &&
screenInfo.screenWidth &&
screenInfo.screenHeight
) {
return Promise.resolve({
expandPXHeight,
screenWidth: screenInfo.screenWidth,
screenHeight: screenInfo.screenHeight
});
}
return getScreenInfo().then(res => {
expandPXHeight = parseInt(res.screenScale * panelExpandHeight);
return {
screenWidth: res.screenWidth,
screenHeight: res.screenHeight,
expandPXHeight
};
});
}
</script>
<config>
{
"navigationBarBackgroundColor": "#EBEEF5",
"backgroundColor": "#EBEEF5",
"disableScroll": true,
"usingComponents": {
"control-panel": "./components/controlpanel/controlpanel",
"temperture-control-panel": "./components/temperturecontrolpanel/temperturecontrolpanel",
"floor": "./components/floor/floor",
"location": "./components/location/location"
}
}
</config>