From 7804a3a4d61ff1d857973e974bbdf78a2e17feab Mon Sep 17 00:00:00 2001
From: shuishen <1109946754@qq.com>
Date: Fri, 17 Dec 2021 15:08:36 +0800
Subject: [PATCH] Merge branch 'master' of http://192.168.0.105:10010/r/school-web

---
 src/components/mobilePopupOur/index.vue |  367 ++++++++++++++++++++++++++++++++++++++++++++++++++++
 1 files changed, 367 insertions(+), 0 deletions(-)

diff --git a/src/components/mobilePopupOur/index.vue b/src/components/mobilePopupOur/index.vue
new file mode 100644
index 0000000..5775c35
--- /dev/null
+++ b/src/components/mobilePopupOur/index.vue
@@ -0,0 +1,367 @@
+<template>
+  <div id="mobilePopupOur" v-loading.fullscreen.lock="fullscreenLoading">
+    <div class="m_p_heard">
+      <div class="m_p_h_break" @click="closeBigPopup">
+        <i class="el-icon-arrow-left icon"></i>
+      </div>
+      <div class="m_p_h_center">
+        <div>
+          <div v-if="mBigPopup.search" style="color: #fff">
+            查询结果{{ searchLabel ? "--" + searchLabel : "" }}
+          </div>
+          <el-dropdown trigger="click" @command="choiceIt" v-else>
+            <span class="el-dropdown-link">
+              {{ choiceValue }}<i class="el-icon-arrow-down el-icon--right"></i>
+            </span>
+            <el-dropdown-menu slot="dropdown">
+              <el-dropdown-item
+                v-for="(item, index) in choiceData"
+                :key="index"
+                :command="item.name"
+                >{{ item.name }}</el-dropdown-item
+              >
+            </el-dropdown-menu>
+          </el-dropdown>
+        </div>
+      </div>
+    </div>
+    <div class="m_p_center">
+      <el-tabs v-model="activeName" @tab-click="handleClick">
+        <el-tab-pane
+          v-for="(item, index) in tabTable"
+          :key="index"
+          :label="item.label"
+          :name="item.value"
+        >
+          <div class="m_p_c_tableIn">
+            <el-empty
+              v-show="item.child.length == 0"
+              description="暂无数据"
+            ></el-empty>
+            <mobilePopupOurOnce
+              v-for="(citem, cindex) in item.child"
+              :key="cindex"
+              :ends="item.child.length - 1 == cindex"
+              :onceData="citem"
+            ></mobilePopupOurOnce>
+            <div v-show="item.child.length != 0">
+              <el-divider content-position="left">
+                <i class="el-icon-s-promotion"></i>&nbsp;&nbsp;&nbsp;暂无更多
+              </el-divider>
+            </div>
+          </div>
+        </el-tab-pane>
+      </el-tabs>
+    </div>
+  </div>
+</template>
+
+<script>
+import { mapGetters } from "vuex";
+export default {
+  computed: {
+    ...mapGetters(["mBigPopup"]),
+  },
+  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: [],
+        },
+      ],
+      fullscreenLoading: false,
+      activeName: "first",
+    };
+  },
+  // 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;
+      this.fullscreenLoading = false;
+      this.$store.commit("MSET_BIGPOPUPAFTER", false);
+      console.log("请求对应街道接口");
+    }, 500);
+    // this.choiceValue = this.choiceData[0].name;
+  },
+  methods: {
+    handleClick(tab, event) {
+      console.log(tab.name);
+    },
+    choiceIt(name) {
+      this.fullscreenLoading = true;
+      setTimeout(() => {
+        this.choiceValue = name;
+        this.fullscreenLoading = false;
+        console.log("请求对应头部下拉菜单接口");
+      }, 500);
+    },
+    closeBigPopup() {
+      this.$store.commit("MSET_BIGPOPUP", false);
+    },
+  },
+};
+</script>
+
+<style lang="scss" scoped>
+#mobilePopupOur {
+  position: fixed;
+  top: 0;
+  left: 0;
+  width: 100%;
+  height: 100%;
+  background-color: #fff;
+  z-index: 300;
+  .m_p_heard {
+    width: 100%;
+    height: 50px;
+    background-color: #a40000;
+    .m_p_h_break {
+      position: absolute;
+      left: 0;
+      top: 0;
+      width: 50px;
+      height: 50px;
+      display: flex;
+      align-items: center;
+      justify-content: center;
+      .icon {
+        font-size: 22px;
+        color: #fff;
+      }
+    }
+    .m_p_h_center {
+      width: 100%;
+      height: 50px;
+      display: flex;
+      align-items: center;
+      justify-content: center;
+      .el-dropdown-link {
+        color: #fff;
+      }
+    }
+  }
+  .m_p_center {
+    width: 100%;
+    height: calc(100% - 50px);
+    // border: 1px solid red
+    box-sizing: border-box;
+    .m_p_c_tableIn {
+      width: 100%;
+      height: 100%;
+      box-sizing: border-box;
+      overflow-x: hidden;
+      overflow-y: auto;
+    }
+  }
+}
+</style>
\ No newline at end of file

--
Gitblit v1.9.3