土地管理详情

ZhAkps

2024-02-06 c922badd10ecf81a74b0e5c56d3fcd053c041ff2

土地管理详情

 src/components/poplayer/landAdmin2.vue

¶Ô±ÈÐÂÎļþ
@@ -0,0 +1,145 @@
<template>
  <div class="landAdmin">
    <transition name="el-zoom-in-bottom">
      <div class="Poplayer" v-if="showlandInfo">
        <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>
    </transition>
  </div>
</template>

<script>
import store from "@/utils/store2";
import keys from "@/utils/poiKeys";
export default {
  name: "landAdmin",
  components: {},
  data() {
    return {
      state: store.tdglInfo,
      KEY: {},
      showlandInfo: false,
    };
  },
  mounted() {
    if (this.list) {
      this.state.info = this.list;
    }
    this.KEY = keys[this.state.info.POITYPE];
  },
  watch: {
    "state.info": function (val) {
      console.log("state.info");
      this.KEY = keys[val.POITYPE];
    },
    "state.show": function (val) {
      console.log("state.show");
      this.showlandInfo = val;
    },
  },
  methods: {
    closehandle() {
      store.setTdlgInfo({});
      divPoint3 && divPoint3.deleteObject();
      store.setTdglShow(false);
      if (window.tdglLine) {
        window.map.removeLayer(window.tdglLine);
        window.tdglLine = null;
      }
    },
  },
};
</script>
<style scoped>
.landAdmin {
  width: 100%;
  position: absolute;
  bottom: 0px;
  align-items: center;
  /* background: white; */
  z-index: 1000;
}
.Poplayer {
  /* min-width: 350px; */
  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;
  /* padding: 20px; */
  padding: 10px 5px 10px 5px;
  box-sizing: border-box;
  font-size: 16px;
  pointer-events: all;
}

.title {
  text-align: center;
  font-size: 20px;
  font-weight: 700;
  letter-spacing: 4px;
  padding-left: 26px;
}

/* .title {
  display: none;
  width: 100%;
  height: 30px;
  line-height: 30px;
  padding-left: 20px;
  margin-top: 10px;
} */

.close {
  pointer-events: all;
  width: 28px;
  height: 28px;
  background-repeat: no-repeat;
  background-size: 100% 100%;
  background-image: url("./img/close.png");
  float: right;
  margin-top: 8px;
  margin-right: 5px;
  cursor: pointer;
}

.content {
  width: 100%;
  margin: auto;
}

.con-item {
  width: 90%;
  /* overflow: hidden; */
  margin-left: 5%;
  margin-bottom: 7px;
  /* margin-right: 20px; */
  display: flex;
  align-items: center;
  justify-content: center;
}

.name {
  width: 30%;
  /* float: left; */
}

.value {
  width: 70%;
  /* max-width: 400px; */
  /* float: left; */
  color: aqua;
}
</style>


 src/components/sideMenu/layerMenu/layerPanel2.vue

@@ -427,6 +427,13 @@
        this.curFuncIndex = index;
        switch (index) {
          case 0:
            if (window.tdgllayer) {
              window.map.removeLayer(window.tdgllayer);
              store.setSliderShow(false);
              window.tdgllayer = null;
              window.map.removeLayer(window.tdgllayer);
              return;
            }
            store.setSliderShow(true);

            var url = layers[8].children[0].urls;

 src/components/sideMenu/sliderAlpha/alpha2.vue

¶Ô±ÈÐÂÎļþ
@@ -0,0 +1,41 @@
<template>
  <div class="sliders">
    <el-slider
      v-model="value"
      :max="100"
      :min="0"
      vertical
      height="200px"
      @input="changeSlider"
    >
    </el-slider>
  </div>
</template>

<script>
export default {
  data() {
    return {
      value: 100,
    };
  },
  methods: {
    changeSlider(val) {
      // window.tdglLayer.item.alpha = val / 100;
      window.tdgllayer&&window.tdgllayer.state&&window.tdgllayer.state_.layer.setOpacity(val / 100);
    },
  },
};
</script>

<style scoped>
.sliders {
  position: absolute;
  top: 2rem;
  left: 0.15rem;
  z-index: 88;
}
.el-tooltip__popper {
  z-index: 88 !important;
}
</style>

 src/components/sideMenu/sliderAlpha/main2.vue

¶Ô±ÈÐÂÎļþ
@@ -0,0 +1,20 @@
<template>
    <div v-if="state.sliderShow">
        <myAlpha></myAlpha>
    </div>
</template>

<script>
import myAlpha from './alpha2.vue';
import store from "@/utils/store2.js";
export default {
    components: {
        myAlpha
    },
    data() {
        return {
            state: store.tdglInfo,
        }
    }
}
</script>

 src/components/viewer2 copy.vue

ÎļþÒÑɾ³ý

 src/components/viewer2.vue

@@ -65,9 +65,9 @@
</template>
<script>
import store from "@/utils/store2.js";
import { setClick } from '@/utils/map2.js'
import { setClick,leftClick } from '@/utils/map2.js'
import _GLOBAL from "@/assets/GLOBAL2";
import { leftClick, loadLayer } from "@/utils/map.js";
// import { leftClick, loadLayer } from "@/utils/map.js";
import leftBottom from "@/components/leftMenu/bottom2.vue";
import rightBottom from "@/components/rightMenu/bottom2.vue";
import sousuo from "@/components/leftMenu/sousuo2.vue";
@@ -85,9 +85,9 @@
import roamPanel from "./sideMenu/roamPanel/main.vue";
import layerTreePanel from "./sideMenu/layerTreePanel/main2.vue";
import history from "./poplayer/history.vue";
import landAdminInfo from "./poplayer/landAdmin.vue";
import landAdminInfo from "./poplayer/landAdmin2.vue";
import poplayer from "./poplayer/main.vue";
import sliderAlpha from "./sideMenu/sliderAlpha/main.vue";
import sliderAlpha from "./sideMenu/sliderAlpha/main2.vue";
import Axios from "axios";

// import Map from "ol/Map.js";
@@ -263,6 +263,7 @@

      window.map = map;
      setClick(true)
      leftClick()
      // var url =
      //   "https://skyzt.bda.gov.cn/gisserver/tmsserver/chengshiguihua_dikuaibianhao_tms/";
      

 src/utils/map2.js

@@ -2234,6 +2234,7 @@

//openlayer åœ°å›¾ç‚¹å‡»äº‹ä»¶
export function setClick(state) {
    console.log('setClick');
    let ponitPanel = document.getElementById('ponitPanel');
    let overlay = new ol.Overlay({
        element: ponitPanel,
@@ -2247,6 +2248,126 @@

    // let _clickCallback = callback;
    function handleClick(e) {
        console.log(e.coordinate);
        // åœŸåœ°ç®¡ç†
        if (store.tdglInfo.flag) {
            axios
                .get(
                    // "http://10.10.4.115:8022/geowinmap_xncs/ds?r=0.9158559377752831&serviceproviderid=map.vectorserviceprovider&serviceid=queryfeature&featcls=225%25E8%258C%2583%25E5%259B%25B4%25E5%2588%2586%25E5%258C%25BA%25E8%25A7%2584%25E5%2588%2592.geojson&lng=" +
                    window.gisBaseUrl + "yzxncsApi/geowinmap_xncs/ds?r=0.9158559377752831&serviceproviderid=map.vectorserviceprovider&serviceid=queryfeature&featcls=225%25E8%258C%2583%25E5%259B%25B4%25E5%2588%2586%25E5%258C%25BA%25E8%25A7%2584%25E5%2588%2592.geojson&lng=" +
                    e.coordinate[0] +
                    "&lat=" +
                    e.coordinate[1] +
                    "&geom=true&requesttype=json"
                ).then(response => {
                    let center = { lon: 0, lat: 0 };
                    if (window.tdglLine) {
                        window.map.removeLayer(window.tdglLine);
                        window.tdglLine = null;
                    }
                    var format = new ol.format.WKT(); // åˆ›å»ºä¸€ä¸ª WKT è§£æžå™¨
                    var feature = format.readFeature(response.data.geometry); // è§£æž WKT å¹¶ç”Ÿæˆè¦ç´ å¯¹è±¡

                    // åˆ›å»ºä¸€ä¸ªè¦ç´ å›¾å±‚
                    window.tdglLine = new ol.layer.Vector({
                        source: new ol.source.Vector({
                            features: [feature] // å°†è¦ç´ å¯¹è±¡åŠ å…¥åˆ°å›¾å±‚源中
                        })
                    });
                    window.map.addLayer(window.tdglLine)


                    axios
                        .get(
                            // "http://10.10.4.115:8022//poisearch/guihuacon/getInfo?ydbm=" +
                            window.gisBaseUrl + "yzxncsApi/poisearch/guihuacon/getInfo?ydbm=" +
                            response.data.NO
                        )
                        .then(
                            info => {
                                let data = info.data.data;
                                if (data.yongdishuju === null) {
                                    objdata = {
                                        POITYPE: "NOTDGL",
                                        zwxx: "暂无信息",
                                        lon: window.clickPOI.lon,
                                        lat: window.clickPOI.lat,
                                    }
                                } else {
                                    qiyexinxi = info.data.data.qiyexinxi;
                                    qysl = data.qiyexinxi.length;
                                    if (qysl > 0) {
                                        ydbm = data.qiyexinxi[0]["地块编号"];
                                    } else {
                                        ydbm = data.churangxinxi["ydbh"];
                                    }
                                    try {
                                        ydlx = data.yongdishuju["ydlxmc"];
                                    } catch (e) { }
                                    try {
                                        cyfx = data.yongdishuju["cyfx"];
                                    } catch (e) { }
                                    try {
                                        // this.crzt = response.data["ZT"];
                                        switch (response.data["ZT"]) {
                                            case 3:
                                                crzt = "已出让";
                                                break;
                                            case 4:
                                                crzt = "未出让";
                                                break;
                                        }
                                    } catch (e) { }
                                    try {
                                        ydmj = parseFloat(
                                            "" + data.yongdishuju["ydmj"]
                                        ).toFixed(0);
                                    } catch (e) { }
                                    try {
                                        crnx = data.churangxinxi["crnx"];
                                    } catch (e) { }
                                    try {
                                        crnf = data.churangxinxi["crnf"];
                                    } catch (e) { }
                                    try {
                                        rjl = data.yongdishuju["rjl"];
                                    } catch (e) { }
                                    try {
                                        jzxg = data.yongdishuju["jzxg"];
                                    } catch (e) { }
                                    try {
                                        jzmd = data.yongdishuju["jzmd"];
                                    } catch (e) { }
                                    objdata = {
                                        POITYPE: "TDGL",
                                        ydbm,
                                        ydlx,
                                        cyfx,
                                        crzt,
                                        ydmj,
                                        ydbm,
                                        crnx,
                                        crnf,
                                        rjl,
                                        jzxg,
                                        jzmd,
                                        lon:e.coordinate[0],
                                        lat: e.coordinate[1],
                                    }
                                }

                                store.setTdglShow(false);
                                store.setTdlgInfo({});
                                store.setTdglShow(true);
                                store.setTdlgInfo(objdata);
                            }
                        );

                })
            return;
        }


        window.map.forEachFeatureAtPixel(e.pixel, function (feature) {
            // console.log(feature, '111111')
            if (feature && feature.values_.desc) {