change

wangjuncheng

2025-04-18 2eabb2e5cf290d6bb1f86d5e3b11cc796079cdcc

 src/components/tools/Tools.vue

@@ -50,6 +50,7 @@
        class="popup-menu-see"
      />
      <SlopeAnalysis
        @draw="SlopeAnalysiss"
        v-show="showSlope"
        class="popup-menu-see"
        @update-slope="onUpdateSlope"
@@ -59,6 +60,11 @@
        v-show="showRain"
        class="popup-menu-see"
        @update-rain="onUpdateRain"
      />
      <Snow
        v-show="showSnow"
        class="popup-menu-see"
        @update-snow="onUpdateSnow"
      />
    </div>

@@ -92,6 +98,7 @@
import SlopeAnalysis from "@/components/tools/SlopeAnalysis.vue";
import mapUtils from "@/utils/tools.js";
import Rain from "@/components/tools/Rain.vue";
import Snow from "@/components/tools/Snow.vue";

// 切换展开/收缩状态
function toggleCollapse() {
@@ -108,7 +115,7 @@
const isFlood = ref(false);
const isContourLabel = ref(false);
const showRain = ref(false);
const isSnow = ref(false);
const showSnow = ref(false);

// 剖面分析弹窗
const topographyShow = ref(false);
@@ -187,6 +194,7 @@
    options: [
      { name: "雨天模式", icon: "雨天模式" },
      { name: "雪天模式", icon: "雪天模式" },
      { name: "清除天气", icon: "清除分析" },
    ],
  },
]);
@@ -194,29 +202,50 @@
// 处理工具点击事件
function handleClick(tool, event) {
  console.log(tool.options);

  // 更新所有工具的 active 状态
  toolList.value.forEach((item) => {
    item.active = item.name === tool.name && currentToolOptions.value !== tool.options;
  });

  // 如果当前工具已经是激活状态，则关闭它
  if (currentToolOptions.value === tool.options) {
    currentToolOptions.value = null; // 清空当前工具选项
    isPopupVisible.value = false; // 隐藏弹窗
    seeAnalyzeShow.value = false; // 可视域
    topographyShow.value = false; // 剖面
    echartsShow.value = false; // 剖面echarts
    showAspect.value = false; // 坡向箭头
    showSlope.value = false; // 坡度箭头
    showRain.value = false; // 雨天
    showSnow.value = false; // 雪天
    return;
  }

  // 如果工具名称是 "图层管理"
  if (tool.name === "图层管理") {
    showLayerTree.value = !showLayerTree.value; // 切换图层树的显示状态
    isPopupVisible.value = false; // 隐藏弹窗
    seeAnalyzeShow.value = false; //可视域
    topographyShow.value = false; //剖面
    echartsShow.value = false; //剖面echarts
    showAspect.value = false; //坡向箭头
    showSlope.value = false; //坡向箭头
    showRain.value = false; //雨天
    seeAnalyzeShow.value = false; // 可视域
    topographyShow.value = false; // 剖面
    echartsShow.value = false; // 剖面echarts
    showAspect.value = false; // 坡向箭头
    showSlope.value = false; // 坡度箭头
    showRain.value = false; // 雨天
    showSnow.value = false; // 雪天
    return;
  }

  // 对于其他工具
  showLayerTree.value = false; // 确保图层树隐藏
  isPopupVisible.value = true; // 显示弹窗
  currentToolOptions.value = tool.options; // 设置当前工具的功能选项
  seeAnalyzeShow.value = false; //可视域
  topographyShow.value = false; //剖面
  echartsShow.value = false; //剖面echarts
  showAspect.value = false; //坡向箭头
  showSlope.value = false; //坡向箭头
  showRain.value = false; //雨天
  seeAnalyzeShow.value = false; // 可视域
  topographyShow.value = false; // 剖面
  echartsShow.value = false; // 剖面echarts
  showAspect.value = false; // 坡向箭头
  showSlope.value = false; // 坡度箭头
  showRain.value = false; // 雨天
  showSnow.value = false; // 雪天
}

// 处理弹窗选项点击事件
@@ -228,15 +257,24 @@
    隐藏图层: () => (showLayerTree.value = false),
    雨天模式: () => {
      showRain.value = true;
      onUpdateRain();
    },
    雪天模式: () => {
      isSnow.value = !isSnow.value;
      if (isSnow.value === false) {
        mapUtils.toggleSnow("snow", false);
      showSnow.value = true;
      onUpdateSnow();
    },
    清除天气: () => {
      if (1) {
        showRain.value = false;
        showSnow.value = false;
        mapUtils.delRain(); // 关闭雨效果
        mapUtils.delSnow(); // 关闭雪效果
        console.log("天气效果已清除");
      } else {
        mapUtils.toggleSnow("snow", true);
        console.log("没有打开的天气效果");
      }
    },

    文字标绘: () => mapUtils.CreateLabel("label", true),
    多段线标绘: () => mapUtils.CreateLabel("polyline", true),
    多边形标绘: () => mapUtils.CreateLabel("polygon", true),
@@ -388,17 +426,22 @@
};
// 关闭坡向箭头
const SlopeArrowClose = () => {
  mapUtils.gbpxjt();
  mapUtils.cleanupAnalysisTools();
};

// 坡度分析
const formData = reactive({
  terrainRender: 0,
  contourLines: false,
  color: "",
  color: "red",
  spacing: 50,
  lineWidth: 5,
});

const SlopeAnalysiss = () => {
  mapUtils.pdfx(formData);
};


// 坡度
const onUpdateSlope = (newOption) => {
@@ -416,6 +459,18 @@
  console.log(newOption, "new");
  Object.assign(rainForm, newOption);
  mapUtils.toggleRain(rainForm, true);
};
// 雪
const snowForm = reactive({
  snowSize: 0.02, // 默认雪的大小
  snowSpeed: 100, // 默认雪的速度
  snowColor: "#FFFFFF", // 默认雪的颜色
});

const onUpdateSnow = (newOption) => {
  console.log(newOption, "new");
  Object.assign(snowForm, newOption);
  mapUtils.toggleSnow(snowForm, true);
};
</script>

@@ -509,6 +564,7 @@
  right: 60px;
  top: -20px;
}

.sectionChars {
  position: absolute;
  top: auto;