3 files modified
1 files added
| New file |
| | |
| | | <template> |
| | | <public-box class="public-org-nav-bar"> |
| | | <template slot="public-box-header"> |
| | | <div class="title"> |
| | | <img class="icon deblurring" src="/img/icon/xyjz.png" alt /> |
| | | <span>{{ arcNavBarTitle }}</span> |
| | | </div> |
| | | <img class="close deblurring" src="/img/navicon/close.png" alt @click="closeModel" /> |
| | | </template> |
| | | <template slot="public-box-content"> |
| | | <div class="tab" v-show="false"> |
| | | <ul> |
| | | <li |
| | | :class="{ on: item.flag }" |
| | | v-for="(item, index) in titleList" |
| | | :key="index" |
| | | @click="topNavClick(item, index)" |
| | | >{{ item.title }}</li> |
| | | </ul> |
| | | </div> |
| | | <ul> |
| | | <li v-for="(item, index) in itemNavList" :key="index" @click="mapPopup(item)"> |
| | | <img :src="item.icon" alt /> |
| | | <span>{{ item.navTitle }}</span> |
| | | </li> |
| | | </ul> |
| | | </template> |
| | | </public-box> |
| | | </template> |
| | | |
| | | <script> |
| | | import { mapGetters } from 'vuex' |
| | | import { |
| | | getList, |
| | | getChildNavList, |
| | | getChildNavDetail |
| | | } from '@/api/pc/public/arc' |
| | | |
| | | export default { |
| | | name: 'ArcNavBar', |
| | | data () { |
| | | return { |
| | | itemNavList: [], |
| | | titleList: [] |
| | | } |
| | | }, |
| | | props: {}, |
| | | computed: { |
| | | ...mapGetters([ |
| | | 'popupBgUrl', |
| | | 'pupupQRUrl', |
| | | // 点信息 |
| | | 'pointPosition', |
| | | // 点名称 |
| | | 'stateName', |
| | | // 地址 |
| | | 'siteName', |
| | | // 介绍 |
| | | 'introduceText', |
| | | // 全景地址 |
| | | 'panoramaUrl', |
| | | 'searchPopupList', |
| | | 'twoOrThree' |
| | | ]) |
| | | }, |
| | | created () { |
| | | }, |
| | | mounted () { }, |
| | | watch: { |
| | | arcNavBarCode: { |
| | | immediate: true, |
| | | handler (newCode, oldCode) { |
| | | this.titleList = [] |
| | | getList().then((res) => { |
| | | res.data.data.forEach((item) => { |
| | | this.titleList.push({ |
| | | title: item.dictValue, |
| | | flag: false, |
| | | key: item.dictKey |
| | | }) |
| | | }) |
| | | |
| | | this.titleList[0].flag = true |
| | | |
| | | this.getChilsNavs(this.titleList[0].key) |
| | | }) |
| | | } |
| | | } |
| | | }, |
| | | methods: { |
| | | coordinate (result) { |
| | | const arr = result.split(',') |
| | | |
| | | return { |
| | | lng: arr[0], |
| | | lat: arr[1] |
| | | } |
| | | }, |
| | | |
| | | topNavClick (item, index) { |
| | | this.titleList.forEach((item) => { |
| | | item.flag = false |
| | | }) |
| | | |
| | | this.titleList[index].flag = true |
| | | |
| | | this.getChilsNavs(item.key) |
| | | }, |
| | | |
| | | getChilsNavs (campus) { |
| | | this.itemNavList = [] |
| | | |
| | | console.log(this.arcNavBarCode) |
| | | getChildNavList({ campus: campus, type: this.arcNavBarCode }).then( |
| | | (res) => { |
| | | console.log(res) |
| | | res.data.data.forEach((item) => { |
| | | this.itemNavList.push({ |
| | | navTitle: item.mechanismname, |
| | | icon: '/img/navicon/tag.png', |
| | | id: item.id |
| | | }) |
| | | }) |
| | | } |
| | | ) |
| | | }, |
| | | |
| | | mapPopup (result) { |
| | | let obj = {} |
| | | |
| | | if (result.x && result.x != '') { |
| | | const position = this.coordinate(result.x) |
| | | obj = { |
| | | lng: position.lng, lat: position.lat |
| | | } |
| | | } else { |
| | | obj = { |
| | | lng: result.longitude, lat: result.latitude |
| | | } |
| | | } |
| | | |
| | | getChildNavDetail({ id: result.id }).then((res) => { |
| | | var result = res.data.data[0].list |
| | | this.$store.commit('CLEAR_ALL', null) |
| | | |
| | | var imgArr = result.tpurl.split(',') |
| | | |
| | | const position = this.coordinate(result.x) |
| | | |
| | | console.log(position) |
| | | |
| | | this.$store.commit('SET_POPUPBGURL', imgArr[0]) |
| | | this.$store.commit('SET_POPUPQRURL', result.codeurl) |
| | | this.$store.commit('SET_STATENAME', result.mechanismname) |
| | | this.$store.commit('SET_SITENAME', result.address) |
| | | this.$store.commit('SET_TELEPHONE', result.telephone) |
| | | this.$store.commit('SET_INTRODUCETEXT', result.introduce) |
| | | this.$store.commit('SET_PANORAMAURL', result.panoramaurl) |
| | | this.$store.commit('SET_POPUPIMGATLAS', imgArr) |
| | | if (result.videourl && result.videourl != '') { |
| | | this.$store.commit('SET_MONITORURL', result.videourl) |
| | | } |
| | | if (res.data.data[0].jx != undefined && res.data.data[0].jx != '') { |
| | | var tabOne = res.data.data[0].jx.split(',') |
| | | this.$store.commit('SET_TEACHLIST', tabOne) |
| | | } else { |
| | | this.$store.commit('SET_TEACHLIST', []) |
| | | } |
| | | |
| | | if (res.data.data[0].sh != undefined && res.data.data[0].sh != '') { |
| | | var tabTwo = res.data.data[0].sh.split(',') |
| | | this.$store.commit('SET_LIVELIST', tabTwo) |
| | | } else { |
| | | this.$store.commit('SET_LIVELIST', []) |
| | | } |
| | | |
| | | this.newPopup(result, obj) |
| | | if (this.twoOrThree == '真 三 维') { |
| | | this.$store.commit('SET_POINTPOSITION', [ |
| | | Number(obj.lng), |
| | | Number(obj.lat), |
| | | Number(result.alt), |
| | | Number(result.heading), |
| | | Number(result.pitch), |
| | | Number(result.roll) |
| | | ]) |
| | | global.viewer.flyToPosition( |
| | | new global.DC.Position( |
| | | Number(obj.lng), |
| | | Number(obj.lat), |
| | | 300, |
| | | Number(result.heading), |
| | | Number(result.pitch), |
| | | Number(result.roll) |
| | | ), |
| | | function () { }, |
| | | 3 |
| | | ) |
| | | } else { |
| | | this.$store.commit('SET_POINTPOSITION', [ |
| | | Number(result.longitude), |
| | | Number(result.latitude), |
| | | Number(50), |
| | | Number(result.heading), |
| | | Number(result.pitch), |
| | | Number(result.roll) |
| | | ]) |
| | | global.viewer.flyToPosition( |
| | | new global.DC.Position( |
| | | Number(result.longitude), |
| | | Number(result.latitude), |
| | | 50, |
| | | Number(result.heading), |
| | | Number(result.pitch), |
| | | Number(result.roll) |
| | | ), |
| | | function () { }, |
| | | 3 |
| | | ) |
| | | } |
| | | }) |
| | | }, |
| | | |
| | | newPopup (result, obj) { |
| | | let position |
| | | if (this.twoOrThree == '真 三 维') { |
| | | position = global.DC.Transform.transformWGS84ToCartesian( |
| | | new global.DC.Position( |
| | | Number(obj.lng), |
| | | Number(obj.lat), |
| | | Number(result.alt) |
| | | ) |
| | | ) |
| | | } else { |
| | | position = global.DC.Transform.transformWGS84ToCartesian( |
| | | new global.DC.Position( |
| | | Number(result.longitude), |
| | | Number(result.latitude), |
| | | Number(50) |
| | | ) |
| | | ) |
| | | } |
| | | |
| | | // eslint-disable-next-line no-unused-vars |
| | | var popup = new global.DC.DivForms(global.viewer, { |
| | | domId: 'divFormsDomBox', |
| | | position: [position] |
| | | }) |
| | | |
| | | this.$store.commit('SET_PANORAMAPOPUP', false) |
| | | this.$store.commit('SET_MONITORPOPUP', false) |
| | | this.$store.commit('SET_DETAILSPOPUP', true) |
| | | }, |
| | | |
| | | closeModel () { |
| | | var path = this.$route.path |
| | | if (path.indexOf('/arc') != -1) { |
| | | this.$store.dispatch('delVisitedViews', this.$route) |
| | | this.$router.push('/pcLayout/default') |
| | | } |
| | | |
| | | this.$store.commit('SET_ORGNAVBARTITLE', '') |
| | | this.$store.commit('SET_ORGNAVBARFLAG', false) |
| | | this.$store.commit('SET_ORGNAVBARLIST', []) |
| | | |
| | | this.$store.commit('SET_DETAILSPOPUP', false) |
| | | this.$store.commit('SET_PANORAMAPOPUP', false) |
| | | this.$store.commit('SET_MONITORPOPUP', false) |
| | | } |
| | | } |
| | | } |
| | | </script> |
| | | |
| | | <style scoped lang="scss"> |
| | | </style> |
| | |
| | | // 全景地址 |
| | | 'panoramaUrl', |
| | | 'arcNavBarTitle', |
| | | 'arcNavBarCode' |
| | | 'arcNavBarCode', |
| | | 'twoOrThree' |
| | | ]) |
| | | }, |
| | | created () { |
| | |
| | | mapPopup (param) { |
| | | getChildNavDetail({ id: param.id }).then((res) => { |
| | | var result = res.data.data[0].list |
| | | |
| | | this.$store.commit('CLEAR_ALL', null) |
| | | |
| | | var imgArr = result.tpurl.split(',') |
| | | |
| | | const position = this.coordinate(result.x) |
| | | |
| | | console.log(position) |
| | | |
| | | this.$store.commit('SET_POPUPBGURL', imgArr[0]) |
| | | this.$store.commit('SET_POPUPQRURL', result.codeurl) |
| | | this.$store.commit('SET_POINTPOSITION', [ |
| | | Number(position.lng), |
| | | Number(position.lat), |
| | | Number(result.gd), |
| | | Number(result.heading), |
| | | Number(result.pitch), |
| | | Number(result.roll) |
| | | ]) |
| | | |
| | | this.$store.commit('SET_STATENAME', result.mechanismname) |
| | | this.$store.commit('SET_SITENAME', result.address) |
| | | this.$store.commit('SET_TELEPHONE', result.telephone) |
| | |
| | | } |
| | | |
| | | this.newPopup(result, position) |
| | | |
| | | if (this.twoOrThree == '三 维') { |
| | | this.$store.commit('SET_POINTPOSITION', [ |
| | | Number(position.lng), |
| | | Number(position.lat), |
| | | Number(result.gd), |
| | | Number(result.heading), |
| | | Number(result.pitch), |
| | | Number(result.roll) |
| | | ]) |
| | | |
| | | global.viewer.flyToPosition( |
| | | new global.DC.Position( |
| | | Number(position.lng), |
| | |
| | | function () { }, |
| | | 3 |
| | | ) |
| | | } else { |
| | | this.$store.commit('SET_POINTPOSITION', [ |
| | | Number(result.jd), |
| | | Number(result.wd), |
| | | Number(result.gd), |
| | | Number(result.heading), |
| | | Number(result.pitch), |
| | | Number(result.roll) |
| | | ]) |
| | | |
| | | global.viewer.flyToPosition( |
| | | new global.DC.Position( |
| | | Number(result.jd), |
| | | Number(result.wd), |
| | | 300, |
| | | Number(result.heading), |
| | | Number(result.pitch), |
| | | Number(result.roll) |
| | | ), |
| | | function () { }, |
| | | 3 |
| | | ) |
| | | } |
| | | }) |
| | | }, |
| | | |
| | | newPopup (item, positionArr) { |
| | | const position = global.DC.Transform.transformWGS84ToCartesian( |
| | | new global.DC.Position(Number(positionArr.lng), |
| | | Number(positionArr.lat), Number(item.gd)) |
| | | let position |
| | | if (this.twoOrThree == '三 维') { |
| | | position = global.DC.Transform.transformWGS84ToCartesian( |
| | | new global.DC.Position( |
| | | Number(positionArr.lng), |
| | | Number(positionArr.lat), |
| | | Number(item.alt) |
| | | ) |
| | | ) |
| | | } else { |
| | | position = global.DC.Transform.transformWGS84ToCartesian( |
| | | new global.DC.Position( |
| | | Number(item.jd), |
| | | Number(item.wd), |
| | | Number(50) |
| | | ) |
| | | ) |
| | | } |
| | | |
| | | // eslint-disable-next-line no-unused-vars |
| | | var popup = new global.DC.DivForms(global.viewer, { |
| | | domId: 'divFormsDomBox', |
| | |
| | | new global.DC.Position( |
| | | Number(param.jd), |
| | | Number(param.wd), |
| | | 50, |
| | | 300, |
| | | Number(param.heading), |
| | | Number(param.pitch), |
| | | Number(param.roll) |
| | |
| | | this.$store.commit('SET_POINTPOSITION', [ |
| | | Number(obj.lng), |
| | | Number(obj.lat), |
| | | Number(item.alt), |
| | | Number(item.gd), |
| | | Number(item.heading), |
| | | Number(item.pitch), |
| | | Number(item.roll) |
| | |
| | | ) |
| | | } else { |
| | | this.$store.commit('SET_POINTPOSITION', [ |
| | | Number(item.longitude), |
| | | Number(item.latitude), |
| | | Number(item.jd), |
| | | Number(item.wd), |
| | | Number(50), |
| | | Number(item.heading), |
| | | Number(item.pitch), |
| | |
| | | ]) |
| | | global.viewer.flyToPosition( |
| | | new global.DC.Position( |
| | | Number(item.longitude), |
| | | Number(item.latitude), |
| | | 50, |
| | | Number(item.jd), |
| | | Number(item.wd), |
| | | 300, |
| | | Number(item.heading), |
| | | Number(item.pitch), |
| | | Number(item.roll) |
| | |
| | | new global.DC.Position( |
| | | Number(obj.lng), |
| | | Number(obj.lat), |
| | | Number(item.alt) |
| | | Number(item.gd) |
| | | ) |
| | | ) |
| | | } else { |
| | | position = global.DC.Transform.transformWGS84ToCartesian( |
| | | new global.DC.Position( |
| | | Number(item.longitude), |
| | | Number(item.latitude), |
| | | Number(item.jd), |
| | | Number(item.wd), |
| | | Number(50) |
| | | ) |
| | | ) |