<template>
|
<div class="m-left-mobileCortrolButtom">
|
<!-- 底部按钮
|
mobileCortrolButtom
|
-->
|
<!-- <div class="m-l-inbut" @click="mubiao"><i class="el-icon-s-help"></i></div> -->
|
<div class="m-l-inbut" v-show="true">
|
<!-- <i class="el-icon-s-flag"></i> -->
|
<el-dropdown trigger="click" @command="handleCommand">
|
<span class="el-dropdown-link icons">
|
<i class="el-icon-s-flag icon"></i>
|
</span>
|
<el-dropdown-menu slot="dropdown">
|
<el-dropdown-item v-for="(item, index) in tabTable" :key="index" :command="item">
|
{{ item.dictValue }}
|
</el-dropdown-item>
|
</el-dropdown-menu>
|
</el-dropdown>
|
</div>
|
<div class="m-l-inbut" @click="openBigPopupAfter">
|
<i class="el-icon-menu"></i>
|
</div>
|
<!-- <div class="m-l-inbut" @click="openActivity">
|
<i class="el-icon-s-opportunity"></i>
|
</div>-->
|
<div class="m-l-inbut" @click="zoomIns">
|
<i class="el-icon-refresh"></i>
|
</div>
|
<!-- <div class="m-l-inbut" @click="goOns">
|
<i class="el-icon-location"></i>
|
</div> -->
|
<div class="m-l-inbut" @click="openOurSee">
|
<i class="el-icon-map-location"></i>
|
</div>
|
</div>
|
</template>
|
|
<script>
|
import { mapGetters } from 'vuex'
|
import { getIp, getUsers } from '@/api/mobile/ip/index'
|
import { getListarc } from '@/api/mobile/public/arc'
|
import { getActivity } from '@/api/mobile/hd/hd'
|
const options = {
|
url: 'https://js.arcgis.com/4.14/',
|
css: 'https://js.arcgis.com/4.14/esri/themes/light/main.css'
|
}
|
import { GCJ02ToWGS84 } from '@/utils/CoordTransform'
|
|
export default {
|
name: 'mobileCortrolButtom',
|
data () {
|
return {
|
tabTable: [],
|
ccData: [
|
{
|
lnt: 114.03835559,
|
lat: 27.63057034
|
},
|
{
|
lnt: 114.03971446,
|
lat: 27.62986481
|
},
|
{
|
lnt: 114.03841654,
|
lat: 27.62919726
|
},
|
{
|
lnt: 114.039946,
|
lat: 27.62847544
|
}
|
],
|
map2D: this.$store.state.openlayerData.openlayers.map2D
|
}
|
},
|
props: ['mapCenter', 'frislayertHeight'],
|
computed: {
|
...mapGetters([
|
'openmobileGoTo',
|
'dimensionData',
|
// "startPointFn",
|
'dimension'
|
])
|
},
|
created () {
|
this.getStreet()
|
},
|
mounted () {
|
// eslint-disable-next-line no-undef
|
},
|
methods: {
|
openOurSee () {
|
this.$store.commit(
|
'MSET_OPENMOBILEPANORAMA',
|
// 'https://vr.jxpskj.com/JXSFKZQJ/QJ/' // sd
|
'https://vr.jxpskj.com:1443/JXKESFDX_HJZXQ/' // jg
|
)
|
},
|
|
goOns () {
|
const that = this
|
|
var options = { timeout: 8000 }// 设置定位超时
|
|
window.geolocation.getLocation(showPosition, showErrow, options)
|
// this.$store.commit('GET_NOWPOSITION', (res) => {
|
// that.$store.dispatch('pcMoveView', {
|
// jd: res[0],
|
// wd: res[1],
|
// viewer: global.viewer
|
// })
|
|
// const data = [
|
// {
|
// name: '我的位置',
|
// jd: res[0],
|
// wd: res[1]
|
// }
|
// ]
|
// that.$store.dispatch('addLabelLayerIconMobelUse', {
|
// list: data,
|
// clear: true,
|
// mviewer: global.viewer
|
// })
|
// })
|
|
function showPosition (result) {
|
const position = GCJ02ToWGS84(result.lng, result.lat)
|
|
const data = {
|
name: '我的位置',
|
jd: position[0],
|
wd: position[1]
|
}
|
|
// 经管
|
if (position[0] > 115.78815057 && position[0] < 115.80346610 && position[1] > 28.63771847 && position[1] < 28.64981682) {
|
that.$store.dispatch('pcMoveView', {
|
jd: position[0],
|
wd: position[1],
|
viewer: global.viewer
|
})
|
that.$store.dispatch('addLabelLayerIconMobelUse', {
|
data: data,
|
clear: true,
|
mviewer: global.viewer
|
})
|
} else {
|
that.$message({
|
message: '您当前位置超出学校范围',
|
type: 'warning'
|
})
|
}
|
|
// 师大
|
// if (position[0] > 116.009836 && position[0] < 116.045022 && position[1] > 28.664168 && position[1] < 28.699788) {
|
// that.$store.dispatch('pcMoveView', {
|
// jd: position[0],
|
// wd: position[1],
|
// viewer: global.viewer
|
// })
|
|
// that.$store.dispatch('addLabelLayerIconMobelUse', {
|
// list: data,
|
// clear: true,
|
// mviewer: global.viewer
|
// })
|
// } else {
|
// that.$message({
|
// message: '您当前位置超出学校范围',
|
// type: 'warning'
|
// })
|
// }
|
}
|
|
function showErrow (result) {
|
if (result.code == 1) {
|
confirm('您拒绝了定位功能')
|
} else if (result.code == 3 || result.code == 5) {
|
confirm('请求超时')
|
}
|
}
|
},
|
|
zoomIns (val) {
|
// this.$store.dispatch("mapFlyTo", {
|
// //飞入
|
// lntLat: [115.87988885, 28.72502592, 2100],
|
// // lntLat: [115.87186406, 28.74449337, 1200],
|
// // lntLat: [121.50492752204283, 31.21567802276832, 2530],
|
// heading: 0,
|
// pitch: -45,
|
// roll: 0,
|
// noOpen: true,
|
// });
|
// if (val) {
|
// if (this.dimension != val) {
|
// this.$store.dispatch("MSET_DIMENSIONS", val);
|
// }
|
// return;
|
// }
|
this.map2D.getView().setCenter([112.63716735643777, -0.087080937773012637833])
|
this.map2D.getView().setResolution(0.00009517844023321122)
|
},
|
|
openActivity () {
|
const d = {
|
main: [
|
{
|
name: '活动',
|
type: 1,
|
method: getActivity
|
}
|
],
|
qurey: '活动'
|
}
|
this.$store.commit('MSET_POPUPOUROPENDATA', d)
|
this.$store.commit('MSET_BIGPOPUP', { name: '活动' })
|
// this.$store.commit("set_showActivity", true);
|
},
|
mubiao () {
|
// 测试fllyTo
|
},
|
handleCommand (command) {
|
this.$parent.setCampusValue(command.dictKey)
|
},
|
openBigPopupAfter () {
|
this.$store.commit('MSET_BIGPOPUPAFTER', true)
|
},
|
goOn () {
|
const that = this
|
this.$store.commit('MSET_OPENMOBILEGOTO', !that.openmobileGoTo)
|
// let data = {
|
// ip: returnCitySN["cip"],
|
// key: "7WKBZ-QDY62-WEEUG-C7KUN-ADAF5-L5BKZ",
|
// };
|
// getIp(data).then((res) => {
|
// // getUsers(data).then((res) => {
|
// });
|
},
|
getStreet () {
|
getListarc().then((res) => {
|
this.tabTable = res.data.data
|
|
this.$parent.setCampusValue(res.data.data[0].dictKey)
|
})
|
}
|
},
|
destroyed () {
|
|
}
|
}
|
</script>
|
|
<style scoped lang="scss">
|
.m-left-mobileCortrolButtom {
|
position: fixed;
|
bottom: 35px;
|
left: 20px;
|
z-index: 200;
|
|
.m-l-inbut {
|
float: left;
|
width: 39px;
|
height: 39px;
|
background-color: rgb(33, 150, 243);
|
display: flex;
|
align-items: center;
|
justify-content: center;
|
color: white;
|
font-size: 32px;
|
margin-left: 12px;
|
border-radius: 5px;
|
|
.icons {
|
display: inline-block;
|
width: 100%;
|
height: 100%;
|
}
|
|
.icon {
|
font-size: 32px;
|
color: #fff;
|
|
&::before {
|
width: 100%;
|
height: 100%;
|
}
|
}
|
}
|
}
|
</style>
|
