|
@@ -1,6 +1,7 @@
|
|
<template>
|
|
<template>
|
|
<!-- ios头部padding适配 -->
|
|
<!-- ios头部padding适配 -->
|
|
<div id='app' :class='isIOS?"ios-padding":""'>
|
|
<div id='app' :class='isIOS?"ios-padding":""'>
|
|
|
|
+ <div id='fengMap' class='fengMap'></div>
|
|
<!-- 顶部navbar -->
|
|
<!-- 顶部navbar -->
|
|
<NarBar class='nav-bar' v-if='!$route.meta.hideNarBar' />
|
|
<NarBar class='nav-bar' v-if='!$route.meta.hideNarBar' />
|
|
<!-- <div class='container'> -->
|
|
<!-- <div class='container'> -->
|
|
@@ -20,11 +21,15 @@
|
|
</template>
|
|
</template>
|
|
<script>
|
|
<script>
|
|
import Vue from 'vue'
|
|
import Vue from 'vue'
|
|
|
|
+import { mapGetters, mapActions, mapMutations } from 'vuex'
|
|
|
|
+import { SFengParser } from '@saga-web/feng-map'
|
|
|
|
+import { setFloor } from '@/api/public.js'
|
|
import { Tabbar, TabbarItem } from 'vant'
|
|
import { Tabbar, TabbarItem } from 'vant'
|
|
Vue.use(Tabbar).use(TabbarItem)
|
|
Vue.use(Tabbar).use(TabbarItem)
|
|
import store from './store/index'
|
|
import store from './store/index'
|
|
import NarBar from './components/Navbar'
|
|
import NarBar from './components/Navbar'
|
|
import { osInfo } from './utils/util'
|
|
import { osInfo } from './utils/util'
|
|
|
|
+window.fengmapData = null
|
|
export default {
|
|
export default {
|
|
name: 'App',
|
|
name: 'App',
|
|
props: {},
|
|
props: {},
|
|
@@ -47,12 +52,17 @@ export default {
|
|
3: '其他事项',
|
|
3: '其他事项',
|
|
},
|
|
},
|
|
isIOS: false, //是否是IOS
|
|
isIOS: false, //是否是IOS
|
|
|
|
+ key: '23f30a832a862c58637a4aadbf50a566',
|
|
|
|
+ appName: '万达可视化系统',
|
|
|
|
+ mapServerURL: `http://map.wanda.cn/editor`,
|
|
|
|
+ mapthemeUrl: `http://map.wanda.cn/editor/webtheme`,
|
|
}
|
|
}
|
|
},
|
|
},
|
|
beforeMount() {},
|
|
beforeMount() {},
|
|
created() {
|
|
created() {
|
|
store.commit('SETSSOTOKEN', 'admin:liujiandong')
|
|
store.commit('SETSSOTOKEN', 'admin:liujiandong')
|
|
console.log(window.location.href)
|
|
console.log(window.location.href)
|
|
|
|
+ this.SETHAVEFENGMAP(false)
|
|
const { os } = osInfo()
|
|
const { os } = osInfo()
|
|
if (os === 'iOS') {
|
|
if (os === 'iOS') {
|
|
this.isIOS = true
|
|
this.isIOS = true
|
|
@@ -62,8 +72,55 @@ export default {
|
|
},
|
|
},
|
|
mounted() {
|
|
mounted() {
|
|
console.log('环境变量', process.env.VUE_APP_RealEnv)
|
|
console.log('环境变量', process.env.VUE_APP_RealEnv)
|
|
|
|
+ if (this.plazaId) {
|
|
|
|
+ this.getFengMap()
|
|
|
|
+ } else {
|
|
|
|
+ window.fengmapData = null
|
|
|
|
+ }
|
|
|
|
+ },
|
|
|
|
+ computed: {
|
|
|
|
+ ...mapGetters(['plazaId', 'fmapID']),
|
|
},
|
|
},
|
|
methods: {
|
|
methods: {
|
|
|
|
+ ...mapActions(['getfmapID']),
|
|
|
|
+ ...mapMutations(['SETHAVEFENGMAP']),
|
|
|
|
+ getFengMap() {
|
|
|
|
+ this.getfmapID().then(() => {
|
|
|
|
+ this.getMap()
|
|
|
|
+ })
|
|
|
|
+ },
|
|
|
|
+ getMap() {
|
|
|
|
+ window.fengmapData = new SFengParser(
|
|
|
|
+ 'fengMap',
|
|
|
|
+ `${this.mapServerURL}/fmap/${this.fmapID}`,
|
|
|
|
+ this.key,
|
|
|
|
+ this.appName,
|
|
|
|
+ null,
|
|
|
|
+ this.mapthemeUrl
|
|
|
|
+ )
|
|
|
|
+ if (this.fmapID.includes('null')) {
|
|
|
|
+ this.SETHAVEFENGMAP(0)
|
|
|
|
+ }
|
|
|
|
+ window.fengmapData.loadMap(this.fmapID, (a, b) => {
|
|
|
|
+ const dataArr = b.map((item) => {
|
|
|
|
+ return item.gname
|
|
|
|
+ })
|
|
|
|
+ // 获取主题数据
|
|
|
|
+ window.fengmapData.loadTheme(`${this.mapServerURL}/webtheme/${this.fmapID}/${this.fmapID}.theme`).then((res) => {
|
|
|
|
+ this.SETHAVEFENGMAP(1)
|
|
|
|
+ })
|
|
|
|
+ // 缓存楼层数据
|
|
|
|
+ if (dataArr.length) {
|
|
|
|
+ setFloor({ plazaId: this.plazaId }, dataArr)
|
|
|
|
+ .then((res) => {
|
|
|
|
+ console.log('缓存楼层', res)
|
|
|
|
+ })
|
|
|
|
+ .catch((error) => {
|
|
|
|
+ console.log('缓存楼层', error)
|
|
|
|
+ })
|
|
|
|
+ }
|
|
|
|
+ })
|
|
|
|
+ },
|
|
// 路由更改
|
|
// 路由更改
|
|
changeTabbar(active) {
|
|
changeTabbar(active) {
|
|
console.log(active)
|
|
console.log(active)
|
|
@@ -71,6 +128,19 @@ export default {
|
|
store.commit('SETAPPTITLE', this.titleDict[active])
|
|
store.commit('SETAPPTITLE', this.titleDict[active])
|
|
},
|
|
},
|
|
},
|
|
},
|
|
|
|
+ watch: {
|
|
|
|
+ plazaId(plazaId) {
|
|
|
|
+ console.log('项目id', plazaId)
|
|
|
|
+ window.fengmapData = null
|
|
|
|
+ // 当获取到到项目id,请求底图
|
|
|
|
+ if (plazaId) {
|
|
|
|
+ // 请求该项目下的楼层数据
|
|
|
|
+ this.getFengMap()
|
|
|
|
+ } else {
|
|
|
|
+ window.fengmapData = null
|
|
|
|
+ }
|
|
|
|
+ },
|
|
|
|
+ },
|
|
}
|
|
}
|
|
</script>
|
|
</script>
|
|
<style lang="less">
|
|
<style lang="less">
|
|
@@ -84,6 +154,13 @@ export default {
|
|
width: 100%;
|
|
width: 100%;
|
|
height: 50px;
|
|
height: 50px;
|
|
}
|
|
}
|
|
|
|
+.fengMap {
|
|
|
|
+ position: fixed;
|
|
|
|
+ width: 100px;
|
|
|
|
+ height: 100px;
|
|
|
|
+ z-index: -1;
|
|
|
|
+ opacity: 0;
|
|
|
|
+}
|
|
// .container {
|
|
// .container {
|
|
// height: calc(100% - 105px);
|
|
// height: calc(100% - 105px);
|
|
// background-color: #aaa;
|
|
// background-color: #aaa;
|