fix: 点击取消时将表单子元素全部销毁

gongchunyi

3 天以前 06d627bc28e77e1a314d8e35914512d63dbab1bd

 src/views/productionManagement/processRoute/index.vue

@@ -3,13 +3,29 @@
    <div class="search_form">
      <el-form :model="searchForm"
               :inline="true">
        <el-form-item label="规格名称:">
          <el-input v-model="searchForm.model"
                    placeholder="请输入"
                    clearable
                    prefix-icon="Search"
                    style="width: 200px;"
                    @change="handleQuery" />
        <el-form-item label="产品类型:">
          <el-select v-model="searchForm.dictCode"
                     style="width: 200px;"
                     placeholder="请选择产品类型"
                     clearable
                     @change="handleQuery">
            <el-option v-for="option in productTypeOptions"
                       :key="option.dictCode"
                       :label="option.dictLabel"
                       :value="option.dictCode" />
          </el-select>
        </el-form-item>
        <el-form-item label="状态:">
          <el-select v-model="searchForm.status"
                     style="width: 200px;"
                     placeholder="请选择状态"
                     clearable
                     @change="handleQuery">
            <el-option label="已批准"
                       :value="true" />
            <el-option label="草稿"
                       :value="false" />
          </el-select>
        </el-form-item>
        <el-form-item>
          <el-button type="primary"
@@ -63,11 +79,13 @@
  } from "@/api/productionManagement/processRoute.js";
  import { useRouter } from "vue-router";
  import { ElMessageBox, ElMessage } from "element-plus";
  import { getDicts } from "@/api/system/dict/data";

  const router = useRouter();
  const data = reactive({
    searchForm: {
      model: "",
      dictCode: "",
      status: "",
    },
  });
  const { searchForm } = toRefs(data);
@@ -75,6 +93,26 @@
    {
      label: "工艺路线编号",
      prop: "processRouteCode",
    },
    {
      label: "状态",
      prop: "status",
      dataType: "tag",

      formatData: params => {
        if (params) {
          return "已批准";
        } else {
          return "草稿";
        }
      },
      formatType: params => {
        if (params) {
          return "success";
        } else {
          return "info";
        }
      },
    },
    {
      label: "产品类型",
@@ -141,6 +179,7 @@
  const isShowEditModal = ref(false);
  const isShowItemModal = ref(false);
  const record = ref({});
  const productTypeOptions = ref([]);
  const page = reactive({
    current: 1,
    size: 100,
@@ -261,7 +300,21 @@
    });
  };

  // 获取产品类型字典
  const getProductTypeOptions = () => {
    getDicts("product_type")
      .then(res => {
        if (res.code === 200) {
          productTypeOptions.value = res.data;
        }
      })
      .catch(err => {
        console.error("获取产品类型字典失败：", err);
      });
  };

  onMounted(() => {
    getProductTypeOptions();
    getList();
  });
</script>