提交

guonan

2025-04-23 c478619b44e437b9df2179adfa79a1e50b6be222

 src/views/left/CitySim.vue

@@ -46,7 +46,7 @@
            style="max-width: 600px"
          >
            <el-option
              v-for="item in cityOptions"
              v-for="item in options"
              :key="item.value"
              :label="item.label"
              :value="item.value"
@@ -63,7 +63,7 @@
            style="max-width: 600px"
          >
            <el-option
              v-for="item in earesOptions"
              v-for="item in options"
              :key="item.value"
              :label="item.label"
              :value="item.value"
@@ -119,57 +119,60 @@
import { initeWaterPrimitiveView } from "@/utils/water";
import { SimAPIStore } from "@/store/simAPI";
import { getRegionData } from "@/api/trApi";
import { storeToRefs } from "pinia";

const cityOptions = reactive([]);
const simStore = SimAPIStore();
const { selectTab } = storeToRefs(simStore);

onMounted(() => {
  getRegionData({ type: 1 }).then((res) => {
    console.log(res, "res");
const options = reactive([]);

// 定义一个方法，用于根据 type 获取区域数据
const fetchRegionData = (type) => {
  getRegionData({ type: type }).then((res) => {
    // 使用响应式数组的方法更新内容
    cityOptions.splice(
    options.splice(
      0,
      cityOptions.length,
      options.length,
      ...res.data.map((item) => ({
        value: item.geom,
        label: item.name,
      }))
    );
  });
};

onMounted(() => {
  fetchRegionData(1);
});

const simStore = SimAPIStore();
// 监听 selectTab 的变化
watch(selectTab, (newVal) => {
  let type;
  switch (newVal) {
    case "行政区划仿真":
      type = 1;
      break;
    case "重点区域仿真":
      type = 2;
      break;
    default:
      type = 1; // 默认值
  }
  fetchRegionData(type);
});

// 注入父组件提供的方法
const { startSimulate, endSimulate } = inject("simulateActions");
// 表单数据
const forms = reactive({
  name: "",
  eare: "北京市",
  eare: "",
  eares: "孙胡沟",
  rainfall: "",
  duration: "",
  intensity: "",
  fileList: [],
});

const earesOptions = [
  { value: "孙胡沟", label: "孙胡沟" },
  { value: "鱼水洞后沟", label: "鱼水洞后沟" },
  { value: "于家西沟", label: "于家西沟" },
  { value: "北河沟", label: "北河沟" },
  { value: "龙泉峪村", label: "龙泉峪村" },
];

// 计算属性：获取对话框标题
const dialogTitle = computed(() => {
  return simStore.selectTab === "行政区划仿真"
    ? "行政区划仿真"
    : "重点区域仿真";
});

// 计算属性：获取上传文件的名称列表
const uploadedFilesText = computed(() => {
  return forms.fileList.map((file) => file.name).join(", ") || "无";
  type: 3,
});

const addSimCheme = async () => {
@@ -178,7 +181,7 @@

// 重置表单
const resetForm = () => {
  forms.eare = "北京市";
  forms.eare = "";
  forms.eares = "孙胡沟";
  forms.rainfall = "";
  forms.duration = "";
@@ -186,6 +189,11 @@
  forms.fileList = [];
};

// 计算属性：获取上传文件的名称列表
const uploadedFilesText = computed(() => {
  return forms.fileList.map((file) => file.name).join(", ") || "无";
});

// 文件变化时触发解析
const handleFileChange = (file) => {
  const reader = new FileReader();