增加弹窗中跳转地图并显示当前建筑弹窗

liuyg

2021-12-16 997262e44f7f9e8d0cde869cfd026ef8c0850efd

 src/components/mobilePopupOur/index.vue

@@ -25,39 +25,17 @@
    </div>
    <div class="m_p_center">
      <el-tabs v-model="activeName" @tab-click="handleClick">
        <el-tab-pane label="西东大街" name="first">
        <el-tab-pane
          v-for="(item, index) in tabTable"
          :key="index"
          :label="item.label"
          :name="item.value"
        >
          <div class="m_p_c_tableIn">
            <mobilePopupOurOnce
              v-for="(item, index) in tableData1"
              :key="index"
              :onceData="item"
            ></mobilePopupOurOnce>
          </div>
        </el-tab-pane>
        <el-tab-pane label="长江路" name="second">
          <div class="m_p_c_tableIn">
            <mobilePopupOurOnce
              v-for="(item, index) in tableData2"
              :key="index"
              :onceData="item"
            ></mobilePopupOurOnce>
          </div>
        </el-tab-pane>
        <el-tab-pane label="科技园" name="third">
          <div class="m_p_c_tableIn">
            <mobilePopupOurOnce
              v-for="(item, index) in tableData3"
              :key="index"
              :onceData="item"
            ></mobilePopupOurOnce>
          </div>
        </el-tab-pane>
        <el-tab-pane label="逸夫楼" name="fourth">
          <div class="m_p_c_tableIn">
            <mobilePopupOurOnce
              v-for="(item, index) in tableData4"
              :key="index"
              :onceData="item"
              v-for="(citem, cindex) in item.child"
              :key="cindex"
              :onceData="citem"
            ></mobilePopupOurOnce>
          </div>
        </el-tab-pane>
@@ -90,76 +68,166 @@
          value: "3",
        },
      ],
      tabTable: [
        {
          label: "西东大街",
          value: "first",
          child: [
            {
              name: "电力部门",
              icon: "",
              Cartesian3: {
                x: -2852016.545079094,
                y: 4654237.53861168,
                z: 3288210.9971253853,
              },
              position: [121.49907024133591, 31.234911748958513],
              buts: ["实景", "图集", "定位"],
            },
            {
              name: "保安部门",
              icon: "",
              Cartesian3: {
                x: -2853624.057617497,
                y: 4654505.819491945,
                z: 3286416.3935731286,
              },
              position: [121.51198333955459, 31.216073280697593],
              buts: ["图集", "定位"],
            },
            {
              name: "图书馆",
              icon: "",
              Cartesian3: {
                x: -2852304.498038979,
                y: 4655537.369322868,
                z: 3286133.4029617086,
              },
              position: [121.4945198122125, 31.213002416673532],
              buts: ["定位"],
            },
          ],
        },
        {
          label: "长江路",
          value: "second",
          child: [
            {
              name: "电力部门1",
              icon: "",
              Cartesian3: {
                x: -2852016.545091094,
                y: 4654237.53861168,
                z: 3288210.9971238153,
              },
              position: [121.49190702133591, 31.234911741858513],
              buts: ["实景", "图集", "定位"],
            },
            {
              name: "保安部门1",
              icon: "",
              Cartesian3: {
                x: -2852016.541509094,
                y: 4654237.53816168,
                z: 3288210.9971125853,
              },
              position: [121.49907021413591, 31.234911741895513],
              buts: ["图集", "定位"],
            },
            {
              name: "图书馆1",
              icon: "",
              Cartesian3: {
                x: -2852016.545019094,
                y: 4654237.53861168,
                z: 3288210.9971123853,
              },
              position: [121.49901024133591, 31.234911749581513],
              buts: ["定位"],
            },
          ],
        },
        {
          label: "科技园",
          value: "third",
          child: [
            {
              name: "电力部门2",
              icon: "",
              Cartesian3: {
                x: -2852016.545079094,
                y: 4654237.53861168,
                z: 3288210.9971253853,
              },
              position: [121.49907024133591, 31.234911748958513],
              buts: ["实景", "图集", "定位"],
            },
            {
              name: "保安部门2",
              icon: "",
              Cartesian3: {
                x: -2852016.545079094,
                y: 4654237.53861168,
                z: 3288210.9971253853,
              },
              position: [121.49907024133591, 31.234911748958513],
              buts: ["图集", "定位"],
            },
            {
              name: "图书馆2",
              icon: "",
              Cartesian3: {
                x: -2852016.545079094,
                y: 4654237.53861168,
                z: 3288210.9971253853,
              },
              position: [121.49907024133591, 31.234911748958513],
              buts: ["定位"],
            },
          ],
        },
        {
          label: "逸夫楼",
          value: "fourth",
          child: [
            {
              name: "电力部门3",
              icon: "",
              Cartesian3: {
                x: -2852016.545079094,
                y: 4654237.53861168,
                z: 3288210.9971253853,
              },
              position: [121.49907024133591, 31.234911748958513],
              buts: ["实景", "图集", "定位"],
            },
            {
              name: "保安部门3",
              icon: "",
              Cartesian3: {
                x: -2852016.545079094,
                y: 4654237.53861168,
                z: 3288210.9971253853,
              },
              position: [121.49907024133591, 31.234911748958513],
              buts: ["图集", "定位"],
            },
            {
              name: "图书馆3",
              icon: "",
              Cartesian3: {
                x: -2852016.545079094,
                y: 4654237.53861168,
                z: 3288210.9971253853,
              },
              position: [121.49907024133591, 31.234911748958513],
              buts: ["定位"],
            },
          ],
        },
      ],
      fullscreenLoading: false,
      activeName: "first",
      tableData1: [
        {
          name: "电力部门",
          icon: "",
          buts: ["实景", "图集", "定位"],
        },
        {
          name: "保安部门",
          icon: "",
          buts: ["图集", "定位"],
        },
        {
          name: "图书馆",
          icon: "",
          buts: ["定位"],
        },
      ],
      tableData2: [
        {
          name: "电力部门2",
          icon: "",
          buts: ["实景", "图集", "定位"],
        },
        {
          name: "保安部门2",
          icon: "",
          buts: ["图集", "定位"],
        },
        {
          name: "图书馆2",
          icon: "",
          buts: ["定位"],
        },
      ],
      tableData3: [
        {
          name: "电力部门3",
          icon: "",
          buts: ["实景", "图集", "定位"],
        },
        {
          name: "保安部门3",
          icon: "",
          buts: ["图集", "定位"],
        },
        {
          name: "图书馆3",
          icon: "",
          buts: ["定位"],
        },
      ],
      tableData4: [
        {
          name: "电力部门4",
          icon: "",
          buts: ["实景", "图集", "定位"],
        },
        {
          name: "保安部门4",
          icon: "",
          buts: ["图集", "定位"],
        },
        {
          name: "图书馆4",
          icon: "",
          buts: ["定位"],
        },
      ],
    };
  },
  // watch: {
@@ -169,7 +237,7 @@
  //   },
  // },
  mounted() {
    // this.fullscreenLoading = true;
    this.fullscreenLoading = true;
    setTimeout(() => {
      if (this.mBigPopup.search) {
        console.log("查询搜索结果", this.mBigPopup.value);
@@ -179,7 +247,7 @@
      this.fullscreenLoading = false;
      this.$store.commit("MSET_BIGPOPUPAFTER", false);
      console.log("请求对应街道接口");
    }, 1000);
    }, 500);
    // this.choiceValue = this.choiceData[0].name;
  },
  methods: {
@@ -187,7 +255,12 @@
      console.log(tab.name);
    },
    choiceIt(name) {
      this.choiceValue = name;
      this.fullscreenLoading = true;
      setTimeout(() => {
        this.choiceValue = name;
        this.fullscreenLoading = false;
        console.log("请求对应头部下拉菜单接口");
      }, 500);
    },
    closeBigPopup() {
      this.$store.commit("MSET_BIGPOPUP", false);