投影图层修改

surprise

2023-11-03 8259d48200ce9477ecbe16e8426161493211b593

 src/views/baseMapSwitching/baseMapSwitching.vue

@@ -1,14 +1,11 @@
<template>
  <div
    v-drag
    class="baseMapSwitching"
  >
  <div class="baseMapSwitching">
    <div class="baseMapSwitchingTitle">
      <div class="tileLeft">
        <div class="titleImg">
        <div class="titleImg" @click="setCloseBaseMap">
          <ArrowLeft />
        </div>
        <div class="titleLable"></div>
        <div class="titleLable">投影图层管理</div>
      </div>
    </div>
    <div class="baseMapSwitching_content">
@@ -17,9 +14,12 @@
          class="baseMapSwitching_list_tr"
          v-for="(item, i) in list"
          :key="i"
          @click="setProjectionLayerChange(item)"
        >
          <div class="baseMapSwitching_list_tr_name">
            <span>{{ item.name }}</span>
            <span :class="{ baseMapActive: activceIndex == item.id }">{{
              item.cnName
            }}</span>
          </div>
        </div>
      </div>
@@ -36,23 +36,63 @@
  defineProps,
  defineEmits,
} from "vue";
let list = ref([
  {
    name: "等距离柱投影 ( <75)",
    type: "poi",
    icon: "d.png",
  },
  {
    name: "北极平面投影",
    type: "line",
    icon: "x.png",
  },
  {
    name: "南极平面投影",
    type: "cover",
    icon: "m.png",
  },
]);
import { perms_selectProjectLayers } from "@/api/api";
import server from "@/assets/js/Map/server";
import store from "@/store";
import projection from "@/assets/js/Map/projectionServer";

import olMap from "@/assets/js/Map/olMap";
const emits = defineEmits(["setCloseBaseMap"]);
let list = ref([]);
const activceIndex = ref();
const setProjectionLayerChange = (res) => {
  let projection = {
    code: "",
    extent: [],
  };
  if (res.cnName == "等距离圆柱投影（<75度）") {
    projection.code = "ESRI:103881";
    projection.extent = [-180, -75, 180, 75];
  } else if (res.cnName == "月球近地投影") {
    projection.code = "ESRI:103880";
    projection.extent = [-90, -90, 90, 90];
  } else if (res.cnName == "月球北极投影") {
    projection.code = "ESRI:103877";
    projection.extent = [-180, 60, 180, 90];
  } else if (res.cnName == "月球南极投影") {
    projection.code = "ESRI:103878";
    projection.extent = [-180, -90, 180, -60];
  } else if (res.cnName == "月球远地投影") {
    projection.code = "ESRI:103879";
    projection.extent = [-90, -90, 90, 90];
  }
  // olMap.initMap();
 
  olMap.addTreeData(res, projection);
  activceIndex.value = res.id;
  // store.state.restLayer = true;
};
const getProjectionLayer = async () => {
  const data = await perms_selectProjectLayers();
  if (data.code != 200) return;
  var result = data.result.filter((res) => {
    if (res.isLayer == 1) {
      return res;
    }
  });
  var val = result.sort(function (a, b) {
    return a.orderNum - b.orderNum;
  });
  list.value = val;
  setProjectionLayerChange(list.value[0]);
  // if (!activceIndex.value) {
  //   setProjectionLayerChange(list.value[0]);
  // }
};
getProjectionLayer();
const setCloseBaseMap = () => {
  emits("setCloseBaseMap", false);
};
</script>

<style lang="less" scoped>
@@ -61,6 +101,8 @@
  height: 680px;
  background: rgba(7, 8, 14, 0.8);
  box-shadow: inset 0px 10px 40px 10px rgba(38, 47, 71, 1);
  z-index: 101;
  position: relative;
  .baseMapSwitchingTitle {
    width: calc(100% - 27px);
    height: 42px;
@@ -78,7 +120,7 @@
      align-items: center;

      .titleLable {
        font-size: 24px;
        font-size: 18px;
        font-family: Source Han Sans CN;
        font-weight: 400;
        color: #ffffff;
@@ -122,6 +164,9 @@
          margin-left: 10px;
        }
      }
      .baseMapActive {
        color: #73a1fa !important;
      }
    }
  }
}