guonan
2025-05-20 f1fbe8049ba01186f033037e6ae36d51915c7418
src/components/monifangzhen/schemeCard.vue
@@ -1,29 +1,46 @@
<template>
  <div class="listCard">
    <!-- <div>方案数量: {{ simStore.schemCard.length }}</div> -->
    <el-card v-if="!schemeInfoShow" v-for="(item, key) in schemeList" :key="key"
      :class="{ selected: selectedId === item.id }" @click="selectScheme(item.id)">
    <el-card
      v-if="!schemeInfoShow"
      v-for="(item, key) in schemeList"
      :key="key"
      :class="{ selected: selectedId === item.id }"
      @click="selectScheme(item.id)"
    >
      <div>
        <p>方案名称 : {{ item.name }}</p>
        <p>创建时间 : {{ formatTime(item.createTime) }}</p>
        <p>
          方案状态 :
          <span style="color: aquamarine">{{
          <span style="color: aquamarine">{{ item.result || "创建仿真" }}</span>
          <!-- <span style="color: aquamarine">{{
            statusText[item.status] || "未知"
          }}</span>
          }}</span> -->
        </p>
      </div>
      <div class="cardMenu">
        <div style="float: right; margin-top: 3px">
          <el-button size="small" @click="setSchemClick(item)">方案详情</el-button>
          <el-button size="small" @click="setSchemClick(item)"
            >方案详情</el-button
          >
          <el-button size="small" @click="startPlay(item)">进入模拟</el-button>
          <!--  :disabled="item.taskStatus !== 2" -->
          <!--  :disabled="item.status !== 2" -->
        </div>
      </div>
    </el-card>
    <schemeInfo v-if="schemeInfoShow" :selectedScheme="currentScheme" @back="handleBack" />
    <schemeInfo
      v-if="schemeInfoShow"
      :selectedScheme="currentScheme"
      @back="handleBack"
    />
  </div>
  <Message @close="close" class="mess" v-show="messageShow" :mesData="mesData" />
  <Message
    @close="close"
    class="mess"
    v-show="messageShow"
    :mesData="mesData"
  />
</template>
<script setup>
@@ -36,6 +53,7 @@
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";
const simStore = useSimStore();
// 选中的方案 ID
@@ -69,17 +87,41 @@
}
function startPlay(item) {
  // if (item.taskStatus !== 2) {
  //   alert("当前方案尚未完成,无法进入模拟!");
  //   return;
  // }
  simStore.setSelectedScheme(item)
  // 分析中
  if (item.status == 2) {
    ElMessage.warning("当前方案正在分析中,无法进入模拟!");
    return;
  }
  // 出错
  if (item.status == 20) {
    ElMessage.error("当前方案分析出错,请重新新建方案!");
    return;
  }
  // 调用求解器并拿到最新生成的serviceName
  // 新创建的方案没有状态以及serviceName则执行调用求解器
  if (!item.status && !item.serviceName) {
    getSimStart(item.id).then((res) => {
      getSimDataById(item.id).then((res) => {
        item.serviceName = res.data[0].serviceName;
        simStore.setSelectedScheme(item);
        console.log(item, "无服务名称");
        ElMessage.warning("当前方案正在分析中,请稍后再模拟");
        getScheme();
      });
    });
  } else {
    simStore.setSelectedScheme(item);
    console.log("有服务名称");
  }
  currentScheme.value = item;
  schemeInfoShow.value = true;
  emit("closeBtn", false);
  initeWaterPrimitiveView();
  emit("start");
  // 求解器求解完成之后才可以显示时间轴
  if (item.status == 10) {
    initeWaterPrimitiveView();
    currentScheme.value = item;
    schemeInfoShow.value = true;
    emit("closeBtn", false);
    emit("start");
  }
}
function endPlay() {
  emit("end");
@@ -97,12 +139,19 @@
// 注册事件监听器
EventBus.on("hide-schemeInfo", handleHideSchemeInfo);
/////////////////////// 调用接口(使用时打开) ///////////////////////
import { getRegionData, getSimData, deleteSimData } from "@/api/trApi.js";
onMounted(() => {
  getScheme();
  getScheme(); // 页面加载时立即获取数据
  intervalId = setInterval(getScheme, 60 * 1000); // 每隔一分钟执行一次
});
onUnmounted(() => {
  if (intervalId !== null) {
    clearInterval(intervalId); // 清除定时器
    intervalId = null; // 重置 intervalId
  }
});
const props = defineProps({
@@ -110,8 +159,9 @@
  showAddIns: Boolean,
});
// 获取仿真列表
const schemeList = ref([]);
let intervalId = null; // 用于存储 setInterval 的返回值
// 获取方案列表
async function getScheme() {
  try {
    const res = await getSimData();
@@ -135,7 +185,6 @@
  () => props.deleteSim,
  (newVal) => {
    if (newVal) {
      console.log(newVal);
      deleteSim();
      emit("reset");
    }
@@ -150,17 +199,15 @@
    });
    return;
  }
  const selectedScheme = schemeList.value.find((item) => item.id === selectedId.value);
  const selectedScheme = schemeList.value.find(
    (item) => item.id === selectedId.value
  );
  const schemeName = selectedScheme ? selectedScheme.name : "未知方案";
  ElMessageBox.confirm(
    `确定要删除方案 "${schemeName}" 吗?`,
    "删除方案",
    {
      confirmButtonText: "确定",
      cancelButtonText: "取消",
      type: "warning",
    }
  )
  ElMessageBox.confirm(`确定要删除方案 "${schemeName}" 吗?`, "删除方案", {
    confirmButtonText: "确定",
    cancelButtonText: "取消",
    type: "warning",
  })
    .then(() => {
      deleteSimData(selectedId.value).then((res) => {
        getScheme();
@@ -170,8 +217,7 @@
        message: `方案 "${schemeName}" 删除成功`,
      });
    })
    .catch(() => {
    });
    .catch(() => {});
};
/////////////////////// 调用接口结束 ///////////////////////
onUnmounted(() => {