608 lines
18 KiB
Vue
608 lines
18 KiB
Vue
|
<template>
|
|||
|
|
<view class="selectPage">
|
|||
|
|
<levitatedsphere :x="100" :y="80"></levitatedsphere>
|
|||
|
|
<headers :showBack="true">
|
|||
|
|
<view class="headerName">
|
|||
|
|
{{isAdd?'选择测量位置':'已测量'}}
|
|||
|
|
</view>
|
|||
|
|
<view class="save_btn" v-if="isNetwork" @click="saveImg">缓存</view>
|
|||
|
|
</headers>
|
|||
|
|
<view class="content">
|
|||
|
|
<view class="flex type">
|
|||
|
|
<view class="title">测量楼栋：</view>
|
|||
|
|
<picker class="picker" @change="pickerChangeBuild" :value="buildIndex" :range="buildList"
|
|||
|
|
range-key="buildName">
|
|||
|
|
<view class="placeholder" v-if="buildIndex===''">请选择</view>
|
|||
|
|
<view v-else class="uni-input">{{buildList[buildIndex].buildName}}#</view>
|
|||
|
|
<uni-icons2 class="arrowdown" type="arrowdown"></uni-icons2>
|
|||
|
|
</picker>
|
|||
|
|
</view>
|
|||
|
|
<view class="flex type">
|
|||
|
|
<view class="title">选择楼层：</view>
|
|||
|
|
<picker class="picker" @change="pickerChangeFloor" :value="floorIndex" :range="floorList"
|
|||
|
|
range-key="floorName">
|
|||
|
|
<view class="placeholder" v-if="floorIndex==='' || floorList.length==0">请选择</view>
|
|||
|
|
<view v-else class="uni-input">{{floorList[floorIndex].floorName}}F</view>
|
|||
|
|
<uni-icons2 class="arrowdown" type="arrowdown"></uni-icons2>
|
|||
|
|
</picker>
|
|||
|
|
</view>
|
|||
|
|
<!-- <view class="type">
|
|||
|
|
<view class="title">测试区域：</view>
|
|||
|
|
<view class="drawing_wrap" @click="clickDraw">
|
|||
|
|
<view class="drawing_bg drawing_bg2" id="drawing_bg" ref="drawing"
|
|||
|
|
:style="{'background-image':'url('+url_config+'image/'+imgUrl+')'}"></view>
|
|||
|
|
<view class="marker" v-for="(item,index) in markerList" :key="index"
|
|||
|
|
:style="{top:item.y+'px',left:item.x+'px'}" @click.stop="goDetails(item.id)">
|
|||
|
|
<image class="addrImg" v-if="item.resultType==1" src="/static/addr_green.png"></image>
|
|||
|
|
<image class="addrImg" v-else src="/static/addr_red.png"></image>
|
|||
|
|
</view>
|
|||
|
|
</view>
|
|||
|
|
</view> -->
|
|||
|
|
</view>
|
|||
|
|
|
|||
|
|
<movable-area class="movableBox" ref="movableBox">
|
|||
|
|
<movable-view direction="all" @scale="onScale" @change="changePosFn" :x="changePos.x" :y="changePos.y" :friction="100" scale="true" scale-min="0.1" scale-max="10" :scale-value="changePos.scale">
|
|||
|
|
<view class="drawing_wrap" @click="clickDraw2">
|
|||
|
|
<!-- <img-cache class="drawing_bg" ref="drawing" :src="url_config+'image/'+imgUrl" :style="{width:imgOriginW+'px',height:imgOriginH+'px'}"></img-cache> -->
|
|||
|
|
<!-- <image class="drawing_bg" ref="drawing" src="_doc/uniapp_save/16377541225310.png" :style="{width:imgOriginW+'px',height:imgOriginH+'px'}"></image> -->
|
|||
|
|
<image class="drawing_bg" ref="drawing" :src="smImg(url_config+'image/'+imgUrl)" :style="{width:imgOriginW+'px',height:imgOriginH+'px'}"></image>
|
|||
|
|
<!-- @click.stop="goDetails(item.id)" -->
|
|||
|
|
<view class="marker" v-for="(item,index) in markerList" :key="index" :style="{top:(item.coordinateY - 20)+'px',left:item.coordinateX+'px'}" >
|
|||
|
|
<!-- <view class="marker" v-for="(item,index) in markerList" :key="index" :style="{top:item.y+'px',left:item.x+'px'}" > -->
|
|||
|
|
<view style="text-align: center;color: red;">{{item.surveyNo}}</view>
|
|||
|
|
<image class="addrImg" v-if="item.resultType==1" src="/static/addr_green.png"></image>
|
|||
|
|
<image class="addrImg" v-else src="/static/addr_red.png"></image>
|
|||
|
|
</view>
|
|||
|
|
</view>
|
|||
|
|
</movable-view>
|
|||
|
|
</movable-area>
|
|||
|
|
<view class="start_wrap">
|
|||
|
|
<view class="start_btn" v-if="isCheck" @click="goDetails('')">确认</view>
|
|||
|
|
</view>
|
|||
|
|
</view>
|
|||
|
|
</template>
|
|||
|
|
|
|||
|
|
<script>
|
|||
|
|
import { resolveFile, getDirSize, removeDir, formatSize, storage } from '@/components/img-cache';
|
|||
|
|
let offsetHeight = 0;
|
|||
|
|
let offsetWidth = 0;
|
|||
|
|
export default {
|
|||
|
|
data() {
|
|||
|
|
return {
|
|||
|
|
projectSn: '',
|
|||
|
|
buildIndex: '',
|
|||
|
|
buildList: [],
|
|||
|
|
floorList: [],
|
|||
|
|
floorIndex: '',
|
|||
|
|
imgUrl: '',
|
|||
|
|
preserveX: 0,
|
|||
|
|
preserveY: 0,
|
|||
|
|
coordinateX: 0, //实际位置
|
|||
|
|
coordinateY: 0, //实际位置
|
|||
|
|
markerList: [],
|
|||
|
|
isAdd: true,
|
|||
|
|
changePos: {
|
|||
|
|
"y": 0,
|
|||
|
|
"scale": 0.5,
|
|||
|
|
"x": 0
|
|||
|
|
},
|
|||
|
|
imgRatioX:1,
|
|||
|
|
imgRatioY:1,
|
|||
|
|
imgOriginW:0,
|
|||
|
|
imgOriginH:0,
|
|||
|
|
movableBoxTop:0,
|
|||
|
|
imgScale: 0.5,
|
|||
|
|
isTest: false,
|
|||
|
|
isCheck: false,
|
|||
|
|
isNetwork: true
|
|||
|
|
}
|
|||
|
|
},
|
|||
|
|
mounted(){
|
|||
|
|
let that = this
|
|||
|
|
uni.getSystemInfo({
|
|||
|
|
success: function(res) { // res - 各种参数
|
|||
|
|
let obj = uni.createSelectorQuery().select('.movableBox')
|
|||
|
|
obj.boundingClientRect(function(data) { // data - 各种参数
|
|||
|
|
|
|||
|
|
console.log('各种参数')
|
|||
|
|
console.log(JSON.stringify(data))
|
|||
|
|
that.movableBoxTop = data.top;
|
|||
|
|
}).exec()
|
|||
|
|
}
|
|||
|
|
})
|
|||
|
|
},
|
|||
|
|
onLoad(options) {
|
|||
|
|
this.projectSn = JSON.parse(uni.getStorageSync('projectDetail')).projectSn;
|
|||
|
|
if (options.isAdd == 'true') {
|
|||
|
|
this.isAdd = true
|
|||
|
|
} else {
|
|||
|
|
this.isAdd = false
|
|||
|
|
}
|
|||
|
|
if (options.isTest == 'true') {
|
|||
|
|
this.isTest = true
|
|||
|
|
} else {
|
|||
|
|
this.isTest = false
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
},
|
|||
|
|
onShow() {
|
|||
|
|
console.log('onShow selectPage')
|
|||
|
|
|
|||
|
|
setTimeout(()=>{
|
|||
|
|
this.changePos.scale=0.5
|
|||
|
|
this.getFloorList();
|
|||
|
|
},200)
|
|||
|
|
if(uni.getStorageSync('outLineData') && !this.isNetwork){
|
|||
|
|
this.markerList = JSON.parse(uni.getStorageSync('outLineData'))
|
|||
|
|
}
|
|||
|
|
},
|
|||
|
|
methods: {
|
|||
|
|
|
|||
|
|
saveImg(){
|
|||
|
|
console.log(12)
|
|||
|
|
let i = 0
|
|||
|
|
this.buildList.forEach(item=>{
|
|||
|
|
i++;
|
|||
|
|
item.floorList.forEach(item2=>{
|
|||
|
|
if(item2.drawingUrl){
|
|||
|
|
let url = this.url_config+'image/'+item2.drawingUrl
|
|||
|
|
let that = this
|
|||
|
|
setTimeout(() => {
|
|||
|
|
uni.downloadFile({
|
|||
|
|
url: url
|
|||
|
|
}).then(res => {
|
|||
|
|
console.log(res)
|
|||
|
|
if (res[1].statusCode == 200) {
|
|||
|
|
uni.saveFile({
|
|||
|
|
tempFilePath: res[1].tempFilePath,
|
|||
|
|
success: function(res) {
|
|||
|
|
console.log('下载完成：' + res.savedFilePath);
|
|||
|
|
console.log(that.url_config+'image/'+item2.drawingUrl)
|
|||
|
|
uni.setStorageSync(that.url_config+'image/'+item2.drawingUrl, res.savedFilePath)
|
|||
|
|
}
|
|||
|
|
});
|
|||
|
|
if(i == (that.buildList.length - 1)){
|
|||
|
|
uni.showToast({
|
|||
|
|
title: '保存成功'
|
|||
|
|
})
|
|||
|
|
}
|
|||
|
|
} else {
|
|||
|
|
return Promise.reject('下载临时文件失败')
|
|||
|
|
}
|
|||
|
|
}).catch(info => {
|
|||
|
|
console.log(info);
|
|||
|
|
})
|
|||
|
|
}, 1000)
|
|||
|
|
}
|
|||
|
|
})
|
|||
|
|
})
|
|||
|
|
},
|
|||
|
|
smImg(url){
|
|||
|
|
// console.log(url,this.imgUrl)
|
|||
|
|
|
|||
|
|
let real_img = url
|
|||
|
|
console.log(url)
|
|||
|
|
const cached = uni.getStorageSync(real_img)
|
|||
|
|
console.log(cached)
|
|||
|
|
let result = ''
|
|||
|
|
if (cached) {
|
|||
|
|
console.log(url + "已缓存为：" + cached)
|
|||
|
|
result = cached
|
|||
|
|
} else {
|
|||
|
|
// console.log("未缓存,延迟下载", url)
|
|||
|
|
result = real_img
|
|||
|
|
}
|
|||
|
|
console.log(result)
|
|||
|
|
return result
|
|||
|
|
},
|
|||
|
|
changePosFn(e) {
|
|||
|
|
console.log('移动')
|
|||
|
|
console.log(e.detail)
|
|||
|
|
this.changePos.x = e.detail.x
|
|||
|
|
this.changePos.y = e.detail.y
|
|||
|
|
},
|
|||
|
|
onScale(e) {
|
|||
|
|
console.log('缩放')
|
|||
|
|
// this.changePos = e.detail
|
|||
|
|
this.imgScale = e.detail.scale
|
|||
|
|
this.changePos.x = this.changePos.x+e.detail.x
|
|||
|
|
this.changePos.y = this.changePos.y+e.detail.y
|
|||
|
|
// this.scale=e
|
|||
|
|
console.log(e.detail)
|
|||
|
|
},
|
|||
|
|
//获取楼层信息
|
|||
|
|
getFloorList() {
|
|||
|
|
let that = this
|
|||
|
|
uni.getNetworkType({
|
|||
|
|
success: function (res) {
|
|||
|
|
// console.log(res.networkType);
|
|||
|
|
if(res.networkType == 'none'){
|
|||
|
|
let data = uni.getStorageSync('foolrListData');
|
|||
|
|
that.buildIndex = 0;
|
|||
|
|
that.buildList = data;
|
|||
|
|
that.floorList = data[0].floorList;
|
|||
|
|
that.floorIndex = 0;
|
|||
|
|
console.log(data)
|
|||
|
|
that.imgUrl = that.floorList.length > 0 ? data[0].floorList[0].drawingUrl : '';
|
|||
|
|
if(uni.getStorageSync('buildObj')){
|
|||
|
|
let obj = uni.getStorageSync('buildObj')
|
|||
|
|
// that.buildIndex = obj.buildIndex
|
|||
|
|
// that.floorIndex = obj.floorIndex
|
|||
|
|
that.pickerChangeBuild({detail:{
|
|||
|
|
value: obj.buildIndex
|
|||
|
|
}})
|
|||
|
|
|
|||
|
|
that.pickerChangeFloor({
|
|||
|
|
detail:{
|
|||
|
|
value: obj.floorIndex
|
|||
|
|
}
|
|||
|
|
})
|
|||
|
|
}
|
|||
|
|
console.log(that.imgUrl)
|
|||
|
|
let imageLength = that.buildList[that.buildIndex].floorList[that.floorIndex]
|
|||
|
|
.imageLength; //获取图片高度
|
|||
|
|
let imageWidth = that.buildList[that.buildIndex].floorList[that.floorIndex]
|
|||
|
|
.imageWidth; //获取图片宽度
|
|||
|
|
that.imgOriginW=imageWidth
|
|||
|
|
that.imgOriginH=imageLength
|
|||
|
|
that.isNetwork = false
|
|||
|
|
} else {
|
|||
|
|
that.isNetwork = true
|
|||
|
|
that.sendRequest({
|
|||
|
|
url: 'xmgl/massReboundBuild/getBuildFloorList',
|
|||
|
|
method: 'post',
|
|||
|
|
data: {
|
|||
|
|
projectSn: that.projectSn
|
|||
|
|
},
|
|||
|
|
success: res => {
|
|||
|
|
that.buildIndex = 0;
|
|||
|
|
that.buildList = res.result;
|
|||
|
|
that.floorList = res.result[0].floorList;
|
|||
|
|
that.floorIndex = 0;
|
|||
|
|
that.imgUrl = that.floorList.length > 0 ? res.result[0].floorList[0].drawingUrl : '';
|
|||
|
|
if(uni.getStorageSync('buildObj')){
|
|||
|
|
let obj = uni.getStorageSync('buildObj')
|
|||
|
|
// that.buildIndex = obj.buildIndex
|
|||
|
|
// that.floorIndex = obj.floorIndex
|
|||
|
|
that.pickerChangeBuild({detail:{
|
|||
|
|
value: obj.buildIndex
|
|||
|
|
}})
|
|||
|
|
|
|||
|
|
that.pickerChangeFloor({
|
|||
|
|
detail:{
|
|||
|
|
value: obj.floorIndex
|
|||
|
|
}
|
|||
|
|
})
|
|||
|
|
}
|
|||
|
|
// console.log('getFloorList 成功')
|
|||
|
|
// this.$nextTick(() => {
|
|||
|
|
// this.getMarkerList();
|
|||
|
|
// })
|
|||
|
|
uni.setStorageSync('foolrListData', res.result);
|
|||
|
|
setTimeout(()=>{
|
|||
|
|
that.getMarkerList();
|
|||
|
|
},500)
|
|||
|
|
|
|||
|
|
}
|
|||
|
|
})
|
|||
|
|
}
|
|||
|
|
},
|
|||
|
|
})
|
|||
|
|
|
|||
|
|
},
|
|||
|
|
|
|||
|
|
//获取选择的楼栋
|
|||
|
|
pickerChangeBuild(e) {
|
|||
|
|
this.buildIndex = e.detail.value;
|
|||
|
|
this.floorList = this.buildList[this.buildIndex].floorList;
|
|||
|
|
this.floorIndex = 0; //回显第一层
|
|||
|
|
if(this.floorList.length>0){
|
|||
|
|
this.imgUrl = this.floorList[0].drawingUrl;
|
|||
|
|
this.getMarkerList();
|
|||
|
|
}else{
|
|||
|
|
this.imgUrl=''
|
|||
|
|
this.markerList=[]
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
|
|||
|
|
},
|
|||
|
|
//选择楼层
|
|||
|
|
pickerChangeFloor(e) {
|
|||
|
|
this.floorIndex = e.detail.value;
|
|||
|
|
this.imgUrl = this.floorList[this.floorIndex].drawingUrl;
|
|||
|
|
this.getMarkerList();
|
|||
|
|
},
|
|||
|
|
//进入详情
|
|||
|
|
goDetails(id) {
|
|||
|
|
let obj = {
|
|||
|
|
floorIndex: this.floorIndex,
|
|||
|
|
buildIndex: this.buildIndex
|
|||
|
|
}
|
|||
|
|
uni.setStorageSync('buildObj', obj);
|
|||
|
|
if(this.buildList[this.buildIndex].floorList.length>0){
|
|||
|
|
uni.navigateTo({
|
|||
|
|
url: './detail?buildName=' + this.buildList[this.buildIndex].buildName + '&floorName=' +
|
|||
|
|
this.buildList[this.buildIndex].floorList[this.floorIndex].floorName + '&floorId=' +
|
|||
|
|
this.buildList[this.buildIndex].floorList[this.floorIndex].floorId + '&coordinateX=' + this
|
|||
|
|
.coordinateX +
|
|||
|
|
'&coordinateY=' + this.coordinateY + '&id=' + id + '&isTest=' + this.isTest
|
|||
|
|
})
|
|||
|
|
}else{
|
|||
|
|
uni.showToast({
|
|||
|
|
title:'请选择楼层'
|
|||
|
|
})
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
},
|
|||
|
|
//计算点击的位置
|
|||
|
|
clickDraw(e) {
|
|||
|
|
if (!this.isAdd) {
|
|||
|
|
return
|
|||
|
|
}
|
|||
|
|
let offsetLeft = e.currentTarget.offsetLeft; //图片所在位置
|
|||
|
|
let offsetTop = e.currentTarget.offsetTop; //图片所在位置
|
|||
|
|
let clientX = e.touches[0].clientX; //点击位置
|
|||
|
|
let clientY = e.touches[0].clientY; //点击位置
|
|||
|
|
this.preserveY = clientY - offsetTop - 10;
|
|||
|
|
this.preserveX = clientX - offsetLeft - 9;
|
|||
|
|
let imageLength = this.buildList[this.buildIndex].floorList[this.floorIndex].imageLength;
|
|||
|
|
let imageWidth = this.buildList[this.buildIndex].floorList[this.floorIndex].imageWidth;
|
|||
|
|
// let imgEl = this.$refs.drawing.$el
|
|||
|
|
// let offsetHeight = imgEl.offsetHeight;
|
|||
|
|
// let offsetWidth = imgEl.offsetWidth;
|
|||
|
|
|
|||
|
|
if (offsetHeight && offsetWidth) {
|
|||
|
|
let ratioX = (offsetWidth / imageWidth).toFixed(2); //比例
|
|||
|
|
let ratioY = (offsetHeight / imageLength).toFixed(2); //比例
|
|||
|
|
this.coordinateX = (clientX - offsetLeft) / Number(ratioX); //实际位置
|
|||
|
|
this.coordinateY = (clientY - offsetTop) / Number(ratioY); //实际位置
|
|||
|
|
console.log(this.coordinateX,this.coordinateY)
|
|||
|
|
// this.coordinateY=(this.coordinateY/this.changePos.scale)-(this.changePos.y/this.changePos.scale)
|
|||
|
|
// this.coordinateX=(this.coordinateX/this.changePos.scale)-(this.changePos.x/this.changePos.scale)
|
|||
|
|
// console.log(this.coordinateX,this.coordinateY)
|
|||
|
|
// this.goDetails('');
|
|||
|
|
}
|
|||
|
|
},
|
|||
|
|
//计算点击的位置
|
|||
|
|
clickDraw2(e) {
|
|||
|
|
console.log(e)
|
|||
|
|
console.log(e.detail.x,e.detail.y,this.imgScale,this.movableBoxTop)
|
|||
|
|
console.log(this.changePos.x,this.changePos.y)
|
|||
|
|
|
|||
|
|
this.coordinateX = ((e.detail.x-this.changePos.x)/this.imgScale)-20/this.imgScale
|
|||
|
|
this.coordinateY = ((e.detail.y-this.changePos.y-this.movableBoxTop)/this.imgScale)-50/this.imgScale
|
|||
|
|
|
|||
|
|
console.log(this.coordinateX,this.coordinateY)
|
|||
|
|
// console.log(this.imgRatioX+'_'+this.imgRatioY)
|
|||
|
|
// alert(this.coordinateX+'_'+this.coordinateY+'_'+this.changePos.scale+'_'+this.imgRatioX+'_'+this.imgRatioY)
|
|||
|
|
|
|||
|
|
if(this.markerList.length>0){
|
|||
|
|
if(this.markerList[this.markerList.length-1].isNewPoint){
|
|||
|
|
this.markerList.splice(this.markerList.length-1,1)
|
|||
|
|
}
|
|||
|
|
} else {
|
|||
|
|
this.markerList.splice(0,1)
|
|||
|
|
}
|
|||
|
|
this.markerList.push({
|
|||
|
|
coordinateX: this.coordinateX,
|
|||
|
|
coordinateY: this.coordinateY,
|
|||
|
|
resultType: 1,
|
|||
|
|
isNewPoint: true
|
|||
|
|
})
|
|||
|
|
this.isCheck = true
|
|||
|
|
// this.goDetails('');
|
|||
|
|
},
|
|||
|
|
//获取已测量点位
|
|||
|
|
getMarkerList() {
|
|||
|
|
console.log('获取已测量点位')
|
|||
|
|
// setTimeout(()=>{
|
|||
|
|
// console.log('this.$refs.drawing')
|
|||
|
|
// console.log(this.$refs.drawing.$el.offsetHeight)
|
|||
|
|
// },1000)
|
|||
|
|
|
|||
|
|
// uni.getSystemInfo({
|
|||
|
|
// success: function(res) { // res - 各种参数
|
|||
|
|
// let obj = uni.createSelectorQuery().select('.drawing_bg')
|
|||
|
|
// obj.boundingClientRect(function(data) { // data - 各种参数
|
|||
|
|
|
|||
|
|
// console.log('各种参数')
|
|||
|
|
// console.log(JSON.stringify(data))
|
|||
|
|
// offsetHeight = data.height;
|
|||
|
|
// offsetWidth = data.width
|
|||
|
|
// }).exec()
|
|||
|
|
// }
|
|||
|
|
// })
|
|||
|
|
if(this.isNetwork){
|
|||
|
|
this.sendRequest({
|
|||
|
|
url: 'xmgl/massReboundSurveyArea/getMassReboundSurveyAreaList',
|
|||
|
|
method: 'post',
|
|||
|
|
data: {
|
|||
|
|
floorId: this.buildList[this.buildIndex].floorList[this.floorIndex].floorId
|
|||
|
|
},
|
|||
|
|
success: res => {
|
|||
|
|
// console.log(res)
|
|||
|
|
let imageLength = this.buildList[this.buildIndex].floorList[this.floorIndex]
|
|||
|
|
.imageLength; //获取图片高度
|
|||
|
|
let imageWidth = this.buildList[this.buildIndex].floorList[this.floorIndex]
|
|||
|
|
.imageWidth; //获取图片宽度
|
|||
|
|
this.imgOriginW=imageWidth
|
|||
|
|
this.imgOriginH=imageLength
|
|||
|
|
// let data = res.result;
|
|||
|
|
// let markerList = [];
|
|||
|
|
// if (offsetHeight && offsetWidth) {
|
|||
|
|
// let ratioX = (offsetWidth / imageWidth).toFixed(2); //比例
|
|||
|
|
// let ratioY = (offsetHeight / imageLength).toFixed(2); //比例
|
|||
|
|
// this.imgRatioX=ratioX
|
|||
|
|
// this.imgRatioY=ratioY
|
|||
|
|
// console.log(ratioX,ratioY)
|
|||
|
|
// if (data.length > 0) {
|
|||
|
|
// data.forEach((item, index) => {
|
|||
|
|
// let x = item.coordinateX * Number(ratioX) - 12;
|
|||
|
|
// let y = item.coordinateY * Number(ratioY) - 12;
|
|||
|
|
// let obj = {
|
|||
|
|
// x: x.toFixed(),
|
|||
|
|
// y: y.toFixed(),
|
|||
|
|
// resultType: item.resultType,
|
|||
|
|
// id: item.id
|
|||
|
|
// };
|
|||
|
|
// markerList.push(obj)
|
|||
|
|
// })
|
|||
|
|
// }
|
|||
|
|
// }
|
|||
|
|
// this.markerList = markerList;
|
|||
|
|
this.markerList = res.result;
|
|||
|
|
}
|
|||
|
|
})
|
|||
|
|
} else{
|
|||
|
|
let imageLength = this.buildList[this.buildIndex].floorList[this.floorIndex]
|
|||
|
|
.imageLength; //获取图片高度
|
|||
|
|
let imageWidth = this.buildList[this.buildIndex].floorList[this.floorIndex]
|
|||
|
|
.imageWidth; //获取图片宽度
|
|||
|
|
this.imgOriginW=imageWidth
|
|||
|
|
this.imgOriginH=imageLength
|
|||
|
|
this.markerList = []
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
}
|
|||
|
|
}
|
|||
|
|
}
|
|||
|
|
</script>
|
|||
|
|
|
|||
|
|
<style>
|
|||
|
|
.flex {
|
|||
|
|
display: flex;
|
|||
|
|
align-items: center;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.flex2 {
|
|||
|
|
display: flex;
|
|||
|
|
align-items: center;
|
|||
|
|
justify-content: space-between;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.flex3 {
|
|||
|
|
display: flex;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.content {
|
|||
|
|
padding: 40rpx 30rpx 0;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.title {
|
|||
|
|
font-size: 30rpx;
|
|||
|
|
font-family: PingFangSC-Regular, PingFang SC;
|
|||
|
|
color: rgba(55, 45, 102, 1);
|
|||
|
|
line-height: 42rpx;
|
|||
|
|
margin-right: 16rpx;
|
|||
|
|
width: 180rpx;
|
|||
|
|
font-weight: 400;
|
|||
|
|
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.picker {
|
|||
|
|
border: 1px solid rgba(91, 95, 102, 0.5);
|
|||
|
|
padding: 6px 30rpx;
|
|||
|
|
font-size: 30rpx;
|
|||
|
|
border-radius: 60rpx;
|
|||
|
|
width: calc(100% - 90px);
|
|||
|
|
box-sizing: border-box;
|
|||
|
|
position: relative;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.drawing_wrap {
|
|||
|
|
position: relative;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.drawing_bg {
|
|||
|
|
/* width: 100%; */
|
|||
|
|
background-repeat: no-repeat;
|
|||
|
|
background-position: center;
|
|||
|
|
background-size: 100% auto;
|
|||
|
|
/* height: 0px; */
|
|||
|
|
|
|||
|
|
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.drawing_bg2 {
|
|||
|
|
padding-top: 65%;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.drawing_wrap .marker {
|
|||
|
|
position: absolute;
|
|||
|
|
/* background-color: red; */
|
|||
|
|
width: 36rpx;
|
|||
|
|
height: 40rpx;
|
|||
|
|
z-index: 111;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.arrowdown {
|
|||
|
|
position: absolute;
|
|||
|
|
top: 20rpx;
|
|||
|
|
right: 30rpx;
|
|||
|
|
color: #262D47;
|
|||
|
|
opacity: 0.8;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.mapMarker {
|
|||
|
|
position: absolute;
|
|||
|
|
top: 40rpx;
|
|||
|
|
left: 40rpx;
|
|||
|
|
z-index: 999;
|
|||
|
|
width: 60rpx;
|
|||
|
|
height: 60rpx;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.placeholder {
|
|||
|
|
color: #999;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.type {
|
|||
|
|
margin-bottom: 20rpx;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
movable-view {
|
|||
|
|
width: auto;
|
|||
|
|
height: auto;
|
|||
|
|
position: relative;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.movableBox {
|
|||
|
|
height: calc(100% - 300px);
|
|||
|
|
width: 100%;
|
|||
|
|
position: fixed;
|
|||
|
|
overflow: hidden;
|
|||
|
|
}
|
|||
|
|
.addrImg {
|
|||
|
|
width: 48rpx;
|
|||
|
|
height: 48rpx;
|
|||
|
|
}
|
|||
|
|
.start_wrap {
|
|||
|
|
/* margin-top: 80rpx;
|
|||
|
|
margin-bottom: 80rpx; */
|
|||
|
|
position: fixed;
|
|||
|
|
bottom: 0;
|
|||
|
|
left: 0;
|
|||
|
|
right: 0;
|
|||
|
|
height: 100px;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.start_btn {
|
|||
|
|
text-align: center;
|
|||
|
|
pos-bottom: 40rpx;
|
|||
|
|
line-height: 90rpx;
|
|||
|
|
width: 60%;
|
|||
|
|
margin: 0 auto;
|
|||
|
|
background-color: rgba(72, 141, 236, 1);
|
|||
|
|
color: #fff;
|
|||
|
|
border-radius: 70rpx;
|
|||
|
|
box-shadow: 0 4rpx 4px 0 rgba(43, 141, 243, 0.42);
|
|||
|
|
|
|||
|
|
}
|
|||
|
|
.save_btn{
|
|||
|
|
position: absolute;
|
|||
|
|
right: 30rpx;
|
|||
|
|
top: 24rpx;
|
|||
|
|
font-size: 28rpx;
|
|||
|
|
}
|
|||
|
|
</style>
|