tab报错

guonan

2025-04-22 8d7fca46fd7f1bf85dbe9fa6fcfd287f45ad1b71

 src/views/left/CitySim.vue

@@ -104,7 +104,7 @@
        <!-- <el-form-item label="仿真参数:"></el-form-item> -->
      </el-form>
      <div style="display: flex; justify-content: flex-end">
        <el-button type="primary" @click="openSaveDialog">保存方案</el-button>
        <el-button type="primary" @click="addSimCheme">保存方案</el-button>
        <el-button type="success" @click="startPlay">开始模拟</el-button>
      </div>
    </div>
@@ -112,12 +112,30 @@
</template>

<script setup>
import { reactive, ref, watch, inject, computed } from "vue";
import { reactive, ref, watch, inject, computed, onMounted } from "vue";
import * as XLSX from "xlsx";
import Papa from "papaparse";
import { ElMessage, ElMessageBox } from "element-plus";
import { initeWaterPrimitiveView } from "@/utils/water";
import { SimAPIStore } from "@/store/simAPI";
import { getRegionData } from "@/api/trApi";

const cityOptions = reactive([]);

onMounted(() => {
  getRegionData({ type: 1 }).then((res) => {
    console.log(res, "res");
    // 使用响应式数组的方法更新内容
    cityOptions.splice(
      0,
      cityOptions.length,
      ...res.data.map((item) => ({
        value: item.geom,
        label: item.name,
      }))
    );
  });
});

const simStore = SimAPIStore();

@@ -134,26 +152,6 @@
  fileList: [],
});

// 城市和重点区域选项
const cityOptions = [
  { value: "北京市", label: "北京市" },
  { value: "东城区", label: "东城区" },
  { value: "西城区", label: "西城区" },
  { value: "朝阳区", label: "朝阳区" },
  { value: "海淀区", label: "海淀区" },
  { value: "丰台区", label: "丰台区" },
  { value: "石景山区", label: "石景山区" },
  { value: "门头沟区", label: "门头沟区" },
  { value: "房山区", label: "房山区" },
  { value: "通州区", label: "通州区" },
  { value: "顺义区", label: "顺义区" },
  { value: "昌平区", label: "昌平区" },
  { value: "大兴区", label: "大兴区" },
  { value: "怀柔区", label: "怀柔区" },
  { value: "平谷区", label: "平谷区" },
  { value: "密云区", label: "密云区" },
  { value: "延庆区", label: "延庆区" },
];
const earesOptions = [
  { value: "孙胡沟", label: "孙胡沟" },
  { value: "鱼水洞后沟", label: "鱼水洞后沟" },
@@ -174,55 +172,9 @@
  return forms.fileList.map((file) => file.name).join(", ") || "无";
});

//////////////////////////////////接口版本启用//////////////////////////////////
const openSaveDialog = async () => {
  await simStore.openSaveDialog(forms);
const addSimCheme = async () => {
  await simStore.addSimCheme(forms);
};

// const isLoading = ref(false);
// // 保存方案
// const openSaveDialog = () => {
//   if (
//     !forms.rainfall ||
//     !forms.duration ||
//     !forms.intensity ||
//     (simStore.selectTab === "行政区划仿真" && !forms.eare) ||
//     (simStore.selectTab === "重点区域仿真" && !forms.eares)
//   ) {
//     ElMessage.warning("请先填写所有必填项");
//     return;
//   }
//   ElMessageBox.confirm("确定要保存当前方案吗?", dialogTitle.value, {
//     confirmButtonText: "确定",
//     cancelButtonText: "取消",
//     type: "warning",
//   })
//     .then(confirmSave)
//     .catch(() => {
//       ElMessage({
//         type: "info",
//         message: "已取消保存",
//       });
//     });
// };
// const confirmSave = async () => {
//   if (isLoading.value) {
//     ElMessage.warning("正在保存，请稍候...");
//     return; // 防止重复提交
//   }
//   isLoading.value = true; // 开始加载状态
//   try {
//     await simStore.createSimulation(forms); // 调用 Store 中的保存方法
//     ElMessage.success("保存成功");
//     saveDialogVisible.value = true; // 显示保存对话框（如果需要）
//   } catch (error) {
//     console.error("保存失败:", error);
//     ElMessage.error("保存失败，请稍后重试");
//   } finally {
//     isLoading.value = false; // 结束加载状态
//   }
// };
//////////////////////////////////接口版本启用//////////////////////////////////

// 重置表单
const resetForm = () => {