北京经济技术开发区经开区虚拟城市项目-【前端】-移动端Web
ZhAkps
2024-02-06 26385d2c91d763259eb1ef55c3255e5ca01717a5
Merge branch 'master' of http://106.120.22.35:48888/r/PM20221203225_MobileWeb
已修改5个文件
已删除2个文件
2580 ■■■■■ 文件已修改
src/components/leftMenu/sousuo2.vue 6 ●●●●● 补丁 | 查看 | 原始文档 | blame | 历史
src/components/poplayer/main2.vue 27 ●●●●● 补丁 | 查看 | 原始文档 | blame | 历史
src/components/poplayer/poplayer2.vue 99 ●●●● 补丁 | 查看 | 原始文档 | blame | 历史
src/components/viewer2.vue 65 ●●●●● 补丁 | 查看 | 原始文档 | blame | 历史
src/utils/map2 copy.js 2331 ●●●●● 补丁 | 查看 | 原始文档 | blame | 历史
src/utils/map2.js 37 ●●●● 补丁 | 查看 | 原始文档 | blame | 历史
src/utils/store2.js 15 ●●●●● 补丁 | 查看 | 原始文档 | blame | 历史
src/components/leftMenu/sousuo2.vue
@@ -217,6 +217,12 @@
    // é€€å‡ºæœç´¢ç•Œé¢
    cancless() {
      this.ssjm = false;
      if (window.pointArr && window.pointArr.length > 0) {
        window.pointArr.forEach(item => {
          window.map.removeLayer(item)
        })
        window.pointArr = []
      }
    },
    getArea() {
      let height = Viewer.container.offsetHeight;
src/components/poplayer/main2.vue
ÎļþÒÑɾ³ý
src/components/poplayer/poplayer2.vue
@@ -1,15 +1,17 @@
<template>
  <div style="z-index: 100000000">
    <div class="Poplayer">
      <div class="close" @click.stop="closehandle"></div>
      <div class="title">点位详情</div>
      <div class="content">
        <div class="con-item" v-for="(item, index) in KEY" :key="index">
          <span class="name">{{ index }}:</span>
          <span class="value">{{ state.list[item] }}</span>
  <div class="landAdmin" v-if="state.show">
    <transition name="el-zoom-in-bottom">
      <div class="Poplayer">
        <div class="close" @click.stop="closehandle"></div>
        <div class="title">点位详情</div>
        <div class="content">
          <div class="con-item" v-for="(item, index) in KEY" :key="index">
            <span class="name">{{ index }}:</span>
            <span class="value">{{ state.info[item] }}</span>
          </div>
        </div>
      </div>
    </div>
    </transition>
  </div>
</template>
@@ -17,67 +19,68 @@
import store from "@/utils/store2";
import keys from "@/utils/poiKeys";
export default {
  name: "Main",
  components: {},
  props: {
    keys: {
      type: Object,
    },
    list: {
      type: Object,
    },
  },
  data() {
    return {
      state: store.Poplayer,
      state: store.dwInfo,
      KEY: {},
    };
  },
  computed: {},
  mounted() {
    if (this.list) {
      this.state.list = this.list;
      this.state.info = this.list;
    }
    this.KEY = keys[this.state.list.POITYPE];
    this.KEY = keys[this.state.info.POITYPE];
  },
  watch: {
    "state.list": function (val) {
      console.log('state.list');
    "state.info": function (val) {
      console.log("state.info");
      this.KEY = keys[val.POITYPE];
      console.log(this.state.list);
      console.log(this.list1);
      console.log(this.KEY);
    },
    "state.show": function (val) {
      console.log("state.show");
      this.showlandInfo = val;
    },
  },
  methods: {
    closehandle() {
      // if (window.pickFeature && window.pickFeature.primitive) {
      //   window.pickFeature.primitive.image = window.imgUrl;
      //   window.pickFeature = null;
      // }
      store.setPoplayerListAction({});
      // divPoint3 && divPoint3.deleteObject();
      store.setPoplayerShowAction(false);
      store.setdwInfo({});
      store.setdwShow(false)
      if (window.tdglLine) {
        window.map.removeLayer(window.tdglLine);
        window.tdglLine = null;
      }
      if (window.pointArr && window.pointArr.length > 0) {
        window.pointArr.forEach(item => {
          window.map.removeLayer(item)
        })
        window.pointArr = []
      }
    },
  },
};
</script>
<style scoped>
.landAdmin {
  width: 100%;
  position: absolute;
  bottom: 0px;
  align-items: center;
  /* background: white; */
  z-index: 1000;
}
.Poplayer {
  /* min-width: 350px; */
  width: 80vw;
  /* min-height: 180px; */
  min-height: 180px;
  background-repeat: no-repeat;
  background-size: 100% 100%;
  background-image: url("./img/bg.png");
  background-color: #0b2c3f;
  border-radius: 10px;
  z-index: 999;
  color: #fff;
  font-family: SourceHanSansSC-R;
  /* padding: 20px; */
  padding: 10px 5px 10px 5px;
  box-sizing: border-box;
@@ -122,21 +125,25 @@
.con-item {
  width: 90%;
  overflow: hidden;
  /* overflow: hidden; */
  margin-left: 5%;
  margin-bottom: 7px;
  margin-left: 25px;
  margin-right: 20px;
  word-break: break-all;
  /* margin-right: 20px; */
  display: flex;
  align-items: center;
  justify-content: center;
}
.name {
  /* min-width: 100px; */
  float: left;
  width: 30%;
  /* float: left; */
}
.value {
  max-width: 400px;
  float: left;
  width: 70%;
  /* max-width: 400px; */
  /* float: left; */
  color: aqua;
}
</style>
src/components/viewer2.vue
@@ -78,7 +78,7 @@
import layerTreePanel from "./sideMenu/layerTreePanel/main2.vue";
import history from "./poplayer/history.vue";
import landAdminInfo from "./poplayer/landAdmin2.vue";
import poplayer from "./poplayer/main2.vue";
import mainPoplayer from "./poplayer/poplayer2.vue";
import sliderAlpha from "./sideMenu/sliderAlpha/main2.vue";
import Axios from "axios";
@@ -114,7 +114,7 @@
    "my-history": history,
    "my-land-admin-info": landAdminInfo,
    "my-slider": sliderAlpha,
    "my-poplayer": poplayer
    "my-poplayer":mainPoplayer
  },
  data() {
    return {
@@ -448,65 +448,4 @@
  width: 30px;
}
#ponitPanel {
  /* display: none; */
  width: 80vw;
  background-repeat: no-repeat;
  background-size: 100% 100%;
  background-image: url("./poplayer/img/bg.png");
  z-index: 999;
  color: #fff;
  font-family: SourceHanSansSC-R;
  padding: 10px 5px 10px 5px;
  font-size: 16px;
  pointer-events: all;
}
.title {
  width: 100%;
  text-align: center;
  font-size: 20px;
  font-weight: 700;
  letter-spacing: 4px;
  padding-left: 26px;
}
#ponitPanel-close {
  pointer-events: all;
  width: 28px;
  height: 28px;
  background-repeat: no-repeat;
  background-size: 100% 100%;
  background-image: url("./poplayer/img/close.png");
  margin-top: 8px;
  margin-right: 5px;
  float: right;
  cursor: pointer;
}
#ponitPanel-content {
  width: 100%;
  margin: auto;
}
.ponitPanel-item {
  width: 90%;
  overflow: hidden;
  margin-bottom: 7px;
  margin-left: 25px;
  margin-right: 20px;
  word-break: break-all;
}
.ponitPanel-name {
  /* min-width: 100px; */
  float: left;
}
.ponitPanel-value {
  max-width: 400px;
  float: left;
  color: aqua;
}
</style>
src/utils/map2 copy.js
ÎļþÒÑɾ³ý
src/utils/map2.js
@@ -2203,6 +2203,7 @@
//openlayer åˆ›å»ºç‚¹ä½
window.pointArr = [];
export function createPointMarker(position, obj) {
    let startFeature = new ol.Feature({
        geometry: new ol.geom.Point(position),
@@ -2210,6 +2211,12 @@
    startFeature.setProperties({
        desc: obj,
    });
    if (window.pointArr && window.pointArr.length > 0) {
        window.pointArr.forEach(item => {
            window.map.removeLayer(item)
        })
        window.pointArr = []
    }
    let MarkerLayer = new ol.layer.Vector({
        id: 'LocationPoint',
        name: '标记点',
@@ -2229,22 +2236,12 @@
        }),
        zIndex: 1099,
    })
    window.pointArr.push(MarkerLayer)
    return MarkerLayer;
}
//openlayer åœ°å›¾ç‚¹å‡»äº‹ä»¶
export function setClick(state) {
    console.log('setClick');
    let ponitPanel = document.getElementById('ponitPanel');
    let overlay = new ol.Overlay({
        element: ponitPanel,
        autoPan: {
            animation: {
                duration: 250,
            },
        },
    });
    window.map.addOverlay(overlay);
    function handleClick(e) {
        console.log(e.coordinate);
        // åœŸåœ°ç®¡ç†
@@ -2365,7 +2362,6 @@
            return;
        }
        window.map.forEachFeatureAtPixel(e.pixel, function (feature) {
            if (feature && feature.values_.desc) {
                let obj = feature.values_.desc
@@ -2376,15 +2372,18 @@
                    lon: obj.lng,
                    lat: obj.lat
                }
                console.log('objdata');
                overlay.setPosition(e.coordinate);
                store.setPoplayerShowAction(true);
                store.setPoplayerListAction(objdata);
                window.instance = new PoiLayerConstructor({
                    data: {
                        list1: objdata
                    }
                });
                window.instance.$mount();
                // if (window.instance) {
                //     window.instance.$destroy();
                // }
                // window.instance = new PoiLayerConstructor({
                //     data: {
                //         list: objdata
                //     }
                // });
                // window.instance.$mount();
            }
        });
    }
src/utils/store2.js
@@ -150,6 +150,21 @@
    setTdlgInfo(val) {
        this.tdglInfo.info = val;
    },
    //点位
    dwInfo: {
        flag: false,
        show: false,
        info: {}
    },
    setdwFlag(val) {
        this.dwInfo.flag = val;
    },
    setdwShow(val) {
        this.dwInfo.show = val;
    },
    setdwInfo(val) {
        this.dwInfo.info = val;
    },
    /**
    * åŽ†å²å½±åƒ
    */