| | |
| | | <el-dropdown-item |
| | | v-for="(item, index) in choiceData" |
| | | :key="index" |
| | | :command="item.name" |
| | | :command="item" |
| | | >{{ item.name }}</el-dropdown-item |
| | | > |
| | | </el-dropdown-menu> |
| | |
| | | </div> |
| | | </div> |
| | | <div class="m_p_center"> |
| | | <el-tabs v-model="activeName" @tab-click="handleClick"> |
| | | <div |
| | | class="m_p_c_tableIn" |
| | | style="padding-top: 10px" |
| | | v-if="tabTable.length <= 0" |
| | | > |
| | | <el-empty |
| | | v-show="onlyData.length == 0" |
| | | description="暂无数据" |
| | | ></el-empty> |
| | | <mobilePopupOurOnce |
| | | v-for="(citem, cindex) in onlyData" |
| | | :key="citem.bgImg + ''" |
| | | :ends="onlyData.length - 1 == cindex" |
| | | :onceData="citem" |
| | | ></mobilePopupOurOnce> |
| | | <div v-show="onlyData.length != 0"> |
| | | <el-divider content-position="left"> |
| | | <i class="el-icon-s-promotion"></i> 暂无更多 |
| | | </el-divider> |
| | | </div> |
| | | </div> |
| | | <el-tabs v-model="activeName" @tab-click="handleClick" v-else> |
| | | <el-tab-pane |
| | | v-for="(item, index) in tabTable" |
| | | :key="index" |
| | | :label="item.label" |
| | | :name="item.value" |
| | | :label="item.title" |
| | | :name="item.key" |
| | | > |
| | | <div class="m_p_c_tableIn"> |
| | | <el-empty |
| | |
| | | ></el-empty> |
| | | <mobilePopupOurOnce |
| | | v-for="(citem, cindex) in item.child" |
| | | :key="cindex" |
| | | :key="citem.icon + ''" |
| | | :ends="item.child.length - 1 == cindex" |
| | | :onceData="citem" |
| | | ></mobilePopupOurOnce> |
| | |
| | | </template> |
| | | |
| | | <script> |
| | | import { getList } from "@/api/mobile/orgnav/index"; |
| | | import { getListarc, getChildNavList } from "@/api/mobile/public/arc"; |
| | | import { |
| | | getListlivingFacilitiesr, |
| | | getListsupermarket, |
| | | } from "@/api/mobile/livingFacilities/index"; |
| | | import { mapGetters } from "vuex"; |
| | | export default { |
| | | computed: { |
| | | ...mapGetters(["mBigPopup"]), |
| | | ...mapGetters(["mBigPopup", "popupOurOpenData"]), |
| | | }, |
| | | name: "mobilePopupOur", |
| | | data() { |
| | | return { |
| | | searchLabel: "", |
| | | choiceValue: "", |
| | | choiceData: [ |
| | | { |
| | | name: "党群机构", |
| | | value: "1", |
| | | }, |
| | | { |
| | | name: "职能部门", |
| | | value: "2", |
| | | }, |
| | | { |
| | | name: "其他机构", |
| | | value: "3", |
| | | }, |
| | | ], |
| | | tabTable: [ |
| | | { |
| | | label: "西东大街", |
| | | value: "first", |
| | | child: [ |
| | | { |
| | | name: "电力部门", |
| | | icon: "", |
| | | lntLat: [121.49907024133591, 31.234911748958513], |
| | | buts: ["实景", "图集", "定位"], |
| | | }, |
| | | { |
| | | name: "保安部门", |
| | | icon: "", |
| | | lntLat: [121.51198333955459, 31.216073280697593], |
| | | buts: ["图集", "定位"], |
| | | }, |
| | | { |
| | | name: "图书馆", |
| | | icon: "", |
| | | lntLat: [121.4945198122125, 31.213002416673532], |
| | | buts: ["定位"], |
| | | }, |
| | | { |
| | | name: "电力部门", |
| | | icon: "", |
| | | lntLat: [121.49907024133591, 31.234911748958513], |
| | | buts: ["实景", "图集", "定位"], |
| | | }, |
| | | { |
| | | name: "保安部门", |
| | | icon: "", |
| | | lntLat: [121.51198333955459, 31.216073280697593], |
| | | buts: ["图集", "定位"], |
| | | }, |
| | | { |
| | | name: "图书馆", |
| | | icon: "", |
| | | lntLat: [121.4945198122125, 31.213002416673532], |
| | | buts: ["定位"], |
| | | }, |
| | | { |
| | | name: "电力部门", |
| | | icon: "", |
| | | lntLat: [121.49907024133591, 31.234911748958513], |
| | | buts: ["实景", "图集", "定位"], |
| | | }, |
| | | { |
| | | name: "保安部门", |
| | | icon: "", |
| | | lntLat: [121.51198333955459, 31.216073280697593], |
| | | buts: ["图集", "定位"], |
| | | }, |
| | | { |
| | | name: "图书馆", |
| | | icon: "", |
| | | lntLat: [121.4945198122125, 31.213002416673532], |
| | | buts: ["定位"], |
| | | }, |
| | | { |
| | | name: "电力部门", |
| | | icon: "", |
| | | lntLat: [121.49907024133591, 31.234911748958513], |
| | | buts: ["实景", "图集", "定位"], |
| | | }, |
| | | { |
| | | name: "保安部门", |
| | | icon: "", |
| | | lntLat: [121.51198333955459, 31.216073280697593], |
| | | buts: ["图集", "定位"], |
| | | }, |
| | | { |
| | | name: "图书馆", |
| | | icon: "", |
| | | lntLat: [121.4945198122125, 31.213002416673532], |
| | | buts: ["定位"], |
| | | }, |
| | | { |
| | | name: "电力部门", |
| | | icon: "", |
| | | lntLat: [121.49907024133591, 31.234911748958513], |
| | | buts: ["实景", "图集", "定位"], |
| | | }, |
| | | { |
| | | name: "保安部门", |
| | | icon: "", |
| | | lntLat: [121.51198333955459, 31.216073280697593], |
| | | buts: ["图集", "定位"], |
| | | }, |
| | | { |
| | | name: "图书馆", |
| | | icon: "", |
| | | lntLat: [121.4945198122125, 31.213002416673532], |
| | | buts: ["定位"], |
| | | }, |
| | | { |
| | | name: "电力部门", |
| | | icon: "", |
| | | lntLat: [121.49907024133591, 31.234911748958513], |
| | | buts: ["实景", "图集", "定位"], |
| | | }, |
| | | { |
| | | name: "保安部门", |
| | | icon: "", |
| | | lntLat: [121.51198333955459, 31.216073280697593], |
| | | buts: ["图集", "定位"], |
| | | }, |
| | | { |
| | | name: "图书馆", |
| | | icon: "", |
| | | lntLat: [121.4945198122125, 31.213002416673532], |
| | | buts: ["定位"], |
| | | }, |
| | | { |
| | | name: "电力部门", |
| | | icon: "", |
| | | lntLat: [121.49907024133591, 31.234911748958513], |
| | | buts: ["实景", "图集", "定位"], |
| | | }, |
| | | { |
| | | name: "保安部门", |
| | | icon: "", |
| | | lntLat: [121.51198333955459, 31.216073280697593], |
| | | buts: ["图集", "定位"], |
| | | }, |
| | | { |
| | | name: "图书馆", |
| | | icon: "", |
| | | lntLat: [121.4945198122125, 31.213002416673532], |
| | | buts: ["定位"], |
| | | }, |
| | | { |
| | | name: "电力部门", |
| | | icon: "", |
| | | lntLat: [121.49907024133591, 31.234911748958513], |
| | | buts: ["实景", "图集", "定位"], |
| | | }, |
| | | { |
| | | name: "保安部门", |
| | | icon: "", |
| | | lntLat: [121.51198333955459, 31.216073280697593], |
| | | buts: ["图集", "定位"], |
| | | }, |
| | | { |
| | | name: "图书馆", |
| | | icon: "", |
| | | lntLat: [121.4945198122125, 31.213002416673532], |
| | | buts: ["定位"], |
| | | }, |
| | | ], |
| | | }, |
| | | { |
| | | label: "长江路", |
| | | value: "second", |
| | | child: [ |
| | | { |
| | | name: "电力部门1", |
| | | icon: "", |
| | | position: [121.49190702133591, 31.234911741858513], |
| | | buts: ["实景", "图集", "定位"], |
| | | }, |
| | | { |
| | | name: "保安部门1", |
| | | icon: "", |
| | | position: [121.49907021413591, 31.234911741895513], |
| | | buts: ["图集", "定位"], |
| | | }, |
| | | { |
| | | name: "图书馆1", |
| | | icon: "", |
| | | position: [121.49901024133591, 31.234911749581513], |
| | | buts: ["定位"], |
| | | }, |
| | | ], |
| | | }, |
| | | { |
| | | label: "科技园", |
| | | value: "third", |
| | | child: [], |
| | | }, |
| | | { |
| | | label: "逸夫楼", |
| | | value: "fourth", |
| | | child: [], |
| | | }, |
| | | ], |
| | | choiceKey: "", |
| | | choiceData: [], |
| | | tabTable: [], |
| | | fullscreenLoading: false, |
| | | activeName: "first", |
| | | activeName: "1", |
| | | choiceMain: "", |
| | | onlyData: [], |
| | | OURAPI_FORLIFE: {}, |
| | | }; |
| | | }, |
| | | // watch: { |
| | | // mBigPopup() { |
| | | // console.log(this.mBigPopup.name); |
| | | // this.choiceValue = this.mBigPopup.name; |
| | | // }, |
| | | // }, |
| | | mounted() { |
| | | this.fullscreenLoading = true; |
| | | setTimeout(() => { |
| | | if (this.mBigPopup.search) { |
| | | this.searchLabel = this.mBigPopup.value; |
| | | console.log("查询搜索结果", this.mBigPopup.value); |
| | | this.fullscreenLoading = false; |
| | | return; |
| | | } |
| | | this.choiceValue = this.mBigPopup.name; |
| | | if (this.mBigPopup.search) { |
| | | this.searchLabel = this.mBigPopup.value; |
| | | // console.log("查询搜索结果", this.mBigPopup.value); |
| | | this.fullscreenLoading = false; |
| | | this.$store.commit("MSET_BIGPOPUPAFTER", false); |
| | | console.log("请求对应街道接口"); |
| | | }, 500); |
| | | // this.choiceValue = this.choiceData[0].name; |
| | | this.choiceMain = "搜索"; |
| | | return; |
| | | } |
| | | this.choiceMain = this.popupOurOpenData.qurey; |
| | | this.choiceData = this.popupOurOpenData.main; |
| | | this.choiceValue = this.popupOurOpenData.main[0].name; |
| | | this.choiceKey = this.popupOurOpenData.main[0].type; |
| | | this.$store.commit("MSET_BIGPOPUPAFTER", false); |
| | | // console.log("请求对应街道接口", this.popupOurOpenData); |
| | | if (this.choiceMain == "校园建筑") { |
| | | //校园建筑:加入街道的选择 |
| | | this.getDataCampus(); |
| | | } else if (this.choiceMain == "机构单位") { |
| | | this.getInstitutional(this.choiceKey); |
| | | } else if (this.choiceMain == "生活设施") { |
| | | // 加入所有请求接口函数 |
| | | this.OURAPI_FORLIFE = { |
| | | 1: getListlivingFacilitiesr, |
| | | 2: getListsupermarket, |
| | | 3: getListlivingFacilitiesr, |
| | | 4: getListlivingFacilitiesr, |
| | | 5: getListlivingFacilitiesr, |
| | | 6: getListlivingFacilitiesr, |
| | | 7: getListlivingFacilitiesr, |
| | | 8: getListlivingFacilitiesr, |
| | | 9: getListlivingFacilitiesr, |
| | | 10: getListlivingFacilitiesr, |
| | | }; |
| | | this.getDatalivingFacilities(); |
| | | } else if (this.choiceMain == "文化风景") { |
| | | console.log(this.choiceKey, " : ", this.choiceMain); |
| | | this.fullscreenLoading = false; |
| | | } else if (this.choiceMain == "出入口") { |
| | | console.log(this.choiceKey, " : ", this.choiceMain); |
| | | this.fullscreenLoading = false; |
| | | } else if (this.choiceMain == "停车场") { |
| | | console.log(this.choiceKey, " : ", this.choiceMain); |
| | | this.fullscreenLoading = false; |
| | | } |
| | | }, |
| | | methods: { |
| | | handleClick(tab, event) { |
| | | console.log(tab.name); |
| | | }, |
| | | choiceIt(name) { |
| | | this.fullscreenLoading = true; |
| | | setTimeout(() => { |
| | | this.choiceValue = name; |
| | | this.fullscreenLoading = false; |
| | | console.log("请求对应头部下拉菜单接口"); |
| | | }, 500); |
| | | if (this.choiceMain == "校园建筑") { |
| | | this.getListCampus(this.activeName, this.choiceKey); |
| | | } else if (this.choiceMain == "生活设施") { |
| | | this.getListlivingFacilities(this.activeName, this.choiceKey); //生活设施 用choiceKey定位请求函数 |
| | | } |
| | | }, |
| | | choiceIt(command) { |
| | | this.fullscreenLoading = true; |
| | | this.choiceValue = command.name; |
| | | this.choiceKey = command.type; |
| | | console.log("请求对应头部下拉菜单接口", command); |
| | | if (this.choiceMain == "校园建筑") { |
| | | this.getListCampus(this.activeName, this.choiceKey); |
| | | } else if (this.choiceMain == "机构单位") { |
| | | this.getInstitutional(this.choiceKey); |
| | | } else if (this.choiceMain == "生活设施") { |
| | | this.getListlivingFacilities(this.activeName, this.choiceKey); //生活设施 用choiceKey定位请求函数 |
| | | } |
| | | }, |
| | | closeBigPopup() { |
| | | this.$store.commit("MSET_BIGPOPUP", false); |
| | | }, |
| | | //"生活设施"↓ |
| | | getDatalivingFacilities(data) { |
| | | let that = this; |
| | | getListarc().then((res) => { |
| | | let title = []; |
| | | res.data.data.forEach((item) => { |
| | | title.push({ |
| | | title: item.dictValue, |
| | | flag: false, |
| | | key: item.dictKey, |
| | | child: [], |
| | | }); |
| | | }); |
| | | this.tabTable = title; |
| | | |
| | | this.getListlivingFacilities(this.activeName, this.choiceKey); //生活设施 用choiceKey定位请求函数 |
| | | }); |
| | | }, |
| | | getListlivingFacilities(campus, type) { |
| | | let that = this; |
| | | this.OURAPI_FORLIFE[type]({ campus: campus }).then((res) => { |
| | | const data = res.data.data.records; |
| | | // console.log(data); |
| | | // return; |
| | | let outList = []; |
| | | data.forEach((item) => { |
| | | let icon = item.tpurl.split(","); |
| | | outList.push({ |
| | | name: item.mechanismname, |
| | | lntLat: [item.jd, item.wd], |
| | | alt: item.gd, |
| | | heading: item.heading, |
| | | pitch: item.pitch, |
| | | roll: item.roll, |
| | | bgImg: item.tpurl, |
| | | icon: icon, |
| | | from: this.choiceMain, |
| | | QRImg: item.codeurl, |
| | | websiteUrl: item.websiteurl, |
| | | telePhone: item.telephone, |
| | | buts: |
| | | that.mBigPopup.name == "校园建筑" || |
| | | that.mBigPopup.name == "文化风景" |
| | | ? ["定位", "实景", "图集"] |
| | | : ["定位"], |
| | | }); |
| | | }); |
| | | that.fullscreenLoading = false; |
| | | that.tabTable[+campus - 1].child = outList; |
| | | }); |
| | | }, |
| | | //"生活设施"↑ |
| | | |
| | | //""机构单位""↓ |
| | | getInstitutional(type) { |
| | | let that = this; |
| | | // console.log(type); |
| | | getList({ type: type }).then((res) => { |
| | | const data = res.data.data; |
| | | let outList = []; |
| | | data.records.forEach((item) => { |
| | | let icon = item.tpurl.split(","); |
| | | outList.push({ |
| | | name: item.mechanismname, |
| | | lntLat: [item.jd, item.wd], |
| | | alt: item.gd, |
| | | heading: item.heading, |
| | | pitch: item.pitch, |
| | | roll: item.roll, |
| | | bgImg: item.tpurl, |
| | | icon: icon, |
| | | from: this.choiceMain, |
| | | QRImg: item.codeurl, |
| | | websiteUrl: item.websiteurl, |
| | | telePhone: item.telephone, |
| | | buts: |
| | | that.mBigPopup.name == "校园建筑" || |
| | | that.mBigPopup.name == "文化风景" |
| | | ? ["定位", "实景", "图集"] |
| | | : ["定位"], |
| | | }); |
| | | }); |
| | | that.fullscreenLoading = false; |
| | | that.onlyData = outList; |
| | | }); |
| | | }, |
| | | //""机构单位""↑ |
| | | //"校园建筑"↓ |
| | | getDataCampus() { |
| | | getListarc().then((res) => { |
| | | let title = []; |
| | | res.data.data.forEach((item) => { |
| | | title.push({ |
| | | title: item.dictValue, |
| | | flag: false, |
| | | key: item.dictKey, |
| | | child: [], |
| | | }); |
| | | }); |
| | | this.tabTable = title; |
| | | this.getListCampus(this.activeName, this.choiceKey); |
| | | }); |
| | | }, |
| | | getListCampus(campus, type) { |
| | | let that = this; |
| | | getChildNavList({ campus: campus, type: type }).then((res) => { |
| | | const data = res.data.data; |
| | | let outList = []; |
| | | data.forEach((item) => { |
| | | let icon = item.tpurl.split(","); |
| | | outList.push({ |
| | | id: item.id, |
| | | name: item.mechanismname, |
| | | icon: icon, |
| | | from: this.choiceMain, |
| | | buts: |
| | | this.mBigPopup.name == "校园建筑" || |
| | | this.mBigPopup.name == "文化风景" |
| | | ? ["定位", "实景", "图集"] |
| | | : ["定位"], |
| | | }); |
| | | }); |
| | | that.fullscreenLoading = false; |
| | | that.tabTable[+campus - 1].child = outList; |
| | | }); |
| | | }, |
| | | //"校园建筑"↑ |
| | | }, |
| | | }; |
| | | </script> |