投影图层管理功能修改

Surpriseplus

2023-08-24 3ddb9448058989b4f3662e38d45fc1d887c337cf

 src/views/baseMapSwitching/baseMapSwitching.vue

@@ -8,7 +8,7 @@
        <div class="titleImg">
          <ArrowLeft />
        </div>
        <div class="titleLable"></div>
        <div class="titleLable"> 投影图层管理</div>
      </div>
    </div>
    <div class="baseMapSwitching_content">
@@ -17,9 +17,10 @@
          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 +37,33 @@
  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";
let list = ref([]);
const activceIndex = ref();
const setProjectionLayerChange = (res) => {
  server.delLayerAll();
  projection.addTreeData(res);
  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;
    }
  });
  list.value = result.reverse();
  if (!activceIndex.value) {
    setProjectionLayerChange(list.value[0]);
  }
};
getProjectionLayer();
</script>

<style lang="less" scoped>
@@ -78,7 +89,7 @@
      align-items: center;

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