guonan
6 天以前 a57caa72a54efe9de3fe26a6c36d3e8038267377
src/components/menu/TimeLine.vue
@@ -153,7 +153,9 @@
import { useSimStore } from "@/store/simulation";
import { storeToRefs } from "pinia";
const simStore = useSimStore();
const { selectedScheme, frameNum, layerDate } = storeToRefs(simStore);
const { selectedScheme, frameNum, layerDate, schemWaterInfo } =
  storeToRefs(simStore);
import { clearAllPoints } from "@/utils/map";
const emit = defineEmits([
  "timeUpdate",
@@ -319,7 +321,8 @@
  // 新建方案中的实时模拟不能倍速
  if (selectedScheme.value.type === 2 && simStore.rePlayList.length == 0) {
    // 类型为 2:每 5 秒跳动一次
    console.log("新建方案实时模拟五秒一跳");
    // 实时模拟:每 5 秒跳动一次
    playInterval = setInterval(() => {
      const fiveSeconds = 5;
      const totalDuration = duration.value; // 总时长(秒)
@@ -337,8 +340,9 @@
      }
      // 触发进度更新
      const progress = currentTime.value / totalDuration;
      emit("timeUpdate", progress * 100);
      // const progress = currentTime.value / totalDuration;
      // 实时模拟应该不用显示弹窗吧
      // emit("timeUpdate", progress * 100);
      // 如果需要触发某些更新函数,也可以保留
      updateWaterColorByTime();
@@ -364,6 +368,7 @@
        currentTime.value = duration.value;
        stopPlayback();
        isPlaying.value = false;
        finishPlay.value = true;
        emit("isPlaying", false);
        emit("playbackFinished", true);
        return;
@@ -379,7 +384,9 @@
      }
      const progress = currentTime.value / duration.value;
      emit("timeUpdate", progress * 100);
      if (selectedScheme.value.type !== 2) {
        emit("timeUpdate", progress * 100);
      }
    }, 1000 / playbackRate.value);
  }
};
@@ -387,6 +394,7 @@
// 降雨数据相关变量
let rainFallValues = ref([]); // 存储原始降雨量数据
let minRainValue = ref(Infinity);
let averageRainIntensity = ref();
let maxRainValue = ref(-Infinity);
// 获取降雨数据
function getRainfallData() {
@@ -467,6 +475,19 @@
  // 提取 intensity 值
  rainFallValues.value = hourlyRainfallList.map((r) => r.intensity);
  // 计算平均雨强
  if (rainFallValues.value.length > 0) {
    const sumIntensity = rainFallValues.value.reduce(
      (sum, val) => sum + val,
      0
    );
    averageRainIntensity.value = sumIntensity / rainFallValues.value.length;
  } else {
    averageRainIntensity.value = 0; // 或者 null 表示无数据
  }
  console.log("平均雨强为:", averageRainIntensity.value);
  minRainValue.value = Math.min(...rainFallValues.value);
  maxRainValue.value = Math.max(...rainFallValues.value);
@@ -731,9 +752,15 @@
  // 打印信息
  // console.log("========================================");
  // console.log(`【时间戳】: ${new Date(currentTimeMs).toLocaleString()}`);
  console.log(`【累计降雨量 R】: ${currentTotal !== null ? currentTotal.toFixed(2) : '未知'} mm`);
  console.log(
    `【累计降雨量 R】: ${
      currentTotal !== null ? currentTotal.toFixed(2) : "未知"
    } mm`
  );
  // console.log(`【当前阶段】: 第 ${currentStage} 阶段`);
  console.log(`【颜色 HEX】: ${colorState.colorStages[currentStage]?.color || '未定义'}`);
  console.log(
    `【颜色 HEX】: ${colorState.colorStages[currentStage]?.color || "未定义"}`
  );
  // console.log(`【透明度 Alpha】: ${colorState.colorStages[currentStage]?.alpha || '未定义'}`);
  // console.log("========================================");
  // 应用颜色
@@ -1000,7 +1027,12 @@
      watersMaxHeight,
      watersMinHeight
    );
    const waterInfoArr = [
      watersMaxHeight,
      maxRainValue.value,
      averageRainIntensity.value,
    ];
    schemWaterInfo.value = waterInfoArr;
    // 更新时间轴相关数据
    if (timestamps) {
      frameNum.value = timestamps.length;
@@ -1022,7 +1054,6 @@
    });
  }
}
// 播放完成后的回调
function handlePlayFinished() {
  if (selectedScheme.value.type !== 2) return;
@@ -1030,8 +1061,6 @@
  currentReplayIndex.value++;
  if (currentReplayIndex.value < simStore.rePlayList.length) {
    console.log(currentReplayIndex.value);
    // 自动播放下一个
    initializeSimulationData(simStore.rePlayList[currentReplayIndex.value]);
    togglePlay();
@@ -1040,6 +1069,7 @@
    // 所有项目播放完成
    currentReplayIndex.value = 0; // 重置索引
    isPlaying.value = false; // 停止播放
    emit("timeUpdate", 100); // 在所有项目播放完毕后触发
  }
}
@@ -1047,7 +1077,11 @@
watch(
  () => finishPlay.value,
  (newVal) => {
    if (newVal && selectedScheme.value.type === 2) {
    if (
      newVal &&
      selectedScheme.value.type === 2 &&
      simStore.rePlayList.length > 0
    ) {
      handlePlayFinished();
    }
  }
@@ -1101,27 +1135,33 @@
  if (selectedScheme.value.type === 2) {
    try {
      await ElMessageBox.confirm("方案未停止时结束模拟后,后台将停止计算", {
        confirmButtonText: "返回列表",
        cancelButtonText: "结束模拟",
        confirmButtonText: "结束模拟",
        cancelButtonText: "返回列表",
        type: "warning",
      });
      // 用户点击了确认,这里不执行任何操作,仅关闭对话框
      const res = await stopSim(selectedScheme.value.id);
      if (res.code == 404) {
        ElMessage.warning("该服务已停止");
      } else {
        ElMessage.success("服务正在停止中");
      }
    } catch (error) {
      stopSim(selectedScheme.value.id).then((res) => {
        if (res.code == 404) {
          ElMessage.warning("该服务已停止");
        } else {
          ElMessage.success("服务正在停止中");
        }
      });
      // return;
      // 用户点击了【返回列表】或者出现错误
      return;
    }
  }
  // 不管type是不是2,最终都执行结束模拟的操作
  // 不管 type 是不是 2,最终都执行结束模拟操作
  endSimulation();
}
async function endSimulation() {
  clearAllPoints();
  simStore.openDia = true;
  simStore.crossSection = [];
  // 结束模拟之后清除layer列表
  simStore.rePlayList = [];
  EventBus.emit("close-time");
  endSimulate();
  isWaterPrimitiveCreated.value = false;