优化定时加载

guonan

2025-05-29 6641cefa084db2636a997de00fde5be167788e1e

 src/components/monifangzhen/schemeCard.vue

@@ -13,7 +13,10 @@
        <p>创建时间 : {{ formatTime(item.createTime) }}</p>
        <p>
          方案状态 :
          <span style="color: aquamarine">{{ item.result || "创建仿真" }}</span>
          <span style="color: aquamarine">
            {{ item.result === -1 ? "出错" : item.result || "创建仿真" }}
          </span>
          <!-- <span style="color: aquamarine">{{ item.result || "创建仿真" }}</span> -->
          <!-- <span style="color: aquamarine">{{
            statusText[item.status] || "未知"
          }}</span> -->
@@ -50,12 +53,20 @@
import { initeWaterPrimitiveView } from "@/utils/water";
import Message from "@/components/tools/Message.vue";
import { useSimStore } from "@/store/simulation.js";
import { SimAPIStore } from "@/store/simAPI";
import schemeInfo from "@/components/monifangzhen/schemeInfo.vue";
import { ElMessage, ElMessageBox } from "element-plus";
const emit = defineEmits(["start", "end", "reset", "closeBtn"]);
import { getSimStart, getSimDataById } from "@/api/trApi";
import {
  getRegionData,
  getSimData,
  deleteSimData,
  getSimStart,
  getSimDataById,
} from "@/api/trApi.js";

const simStore = useSimStore();
const simAPIStore = SimAPIStore();
// 选中的方案 ID
const selectedId = ref(null);
// 当前选中的方案信息
@@ -72,16 +83,22 @@
  10: "完成",
  20: "出错",
};

function formatTime(time) {
  return dayjs(time).format("YYYY-MM-DD HH:mm:ss");
}

const messageShow = ref(false);

const schemeInfoShow = ref(false);

const mesData = ref(null);

function setSchemClick(item) {
  mesData.value = item;
  messageShow.value = true;
}

function close() {
  messageShow.value = false;
}
@@ -113,8 +130,11 @@
    simStore.setSelectedScheme(item);
    console.log("有服务名称");
  }

  const flyHeight = ref(100000);

  const shouldShowFill = false;

  // 求解器求解完成之后才可以显示时间轴
  if (item.status == 10) {
    // 只有行政区划执行
@@ -135,14 +155,17 @@
    emit("start");
  }
}

function endPlay() {
  emit("end");
}

function handleBack(value) {
  if (value === false) {
    schemeInfoShow.value = false;
  }
}

const handleHideSchemeInfo = () => {
  schemeInfoShow.value = false;
  emit("closeBtn", true);
@@ -151,26 +174,6 @@
// 注册事件监听器
EventBus.on("hide-schemeInfo", handleHideSchemeInfo);

/////////////////////// 调用接口（使用时打开） ///////////////////////
import { getRegionData, getSimData, deleteSimData } from "@/api/trApi.js";

onMounted(() => {
  getScheme(); // 页面加载时立即获取数据
  intervalId = setInterval(getScheme, 60 * 1000); // 每隔一分钟执行一次
});

onUnmounted(() => {
  if (intervalId !== null) {
    clearInterval(intervalId); // 清除定时器
    intervalId = null; // 重置 intervalId
  }
});

const props = defineProps({
  deleteSim: Boolean, // 接收父组件传递的函数
  showAddIns: Boolean,
});

const schemeList = ref([]);
let intervalId = null; // 用于存储 setInterval 的返回值
// 获取方案列表
@@ -178,10 +181,49 @@
  try {
    const res = await getSimData();
    schemeList.value = res.data;

    const shouldStop = schemeList.value.every(
      (item) =>
        item.result == "创建仿真" ||
        item.result == "完成" ||
        item.result == "-1"
    );
    simAPIStore.shouldPoll = !shouldStop; // 修改 Pinia 状态
    // 3. 如果需要停止
    if (shouldStop) {
      if (intervalId) {
        clearInterval(intervalId);
        intervalId = null;
        console.log("停止轮询");
      }
      return;
    }
  } catch (error) {
    console.error("Error fetching data:", error);
  }
}

// 监听 shouldPoll 状态变化
watch(
  () => simAPIStore.shouldPoll,
  (isStarted) => {
    console.log(isStarted, "定时器");
    if (isStarted) {
      getScheme(); // 首次立即获取一次
      intervalId = setInterval(getScheme, 60 * 1000); // 每隔一分钟执行
    }
    // else if (intervalId !== null) {
    //   clearInterval(intervalId);
    //   intervalId = null;
    // }
  },
  { immediate: true }
);

const props = defineProps({
  deleteSim: Boolean, // 接收父组件传递的函数
  showAddIns: Boolean,
});

// 新建方案完成之后方案列表需实时刷新
watch(
@@ -231,9 +273,18 @@
    })
    .catch(() => {});
};
/////////////////////// 调用接口结束 ///////////////////////

onMounted(() => {
  getScheme(); // 页面加载时立即获取数据
});

onUnmounted(() => {
  EventBus.off("hide-schemeInfo", handleHideSchemeInfo);

  if (intervalId !== null) {
    clearInterval(intervalId); // 清除定时器
    intervalId = null; // 重置 intervalId
  }
});
</script>