src/views/basicData/product/index.vue
@@ -5,12 +5,11 @@
        <el-input v-model="search"
                  style="width: 210px"
                  placeholder="输入关键字进行搜索"
                  @change="searchFilter"
                  @input="debouncedSearch"
                  @clear="searchFilter"
                  clearable
                  prefix-icon="Search" />
        <el-button v-if="false"
                   type="primary"
        <el-button type="primary"
                   @click="openProDia('addOne')"
                   style="margin-left: 10px">新增产品大类</el-button>
      </div>
@@ -55,7 +54,6 @@
                           style="margin-left: 4px"
                           type="danger"
                           link
                           :disabled="isTopLevelNode(data, node)"
                           @click="remove(node, data)">
                  删除
                </el-button>
@@ -134,7 +132,7 @@
        <el-row>
          <el-row>
            <el-col :span="24">
              <el-form-item label="产品编号:"
              <el-form-item label="产品编号(选填):"
                            prop="productCode">
                <el-input v-model="modelForm.productCode"
                          placeholder="请输入产品编号"
@@ -346,7 +344,6 @@
    modelRules: {
      model: [{ required: true, message: "请输入", trigger: "blur" }],
      unit: [{ required: true, message: "请输入", trigger: "blur" }],
      productCode: [{ required: true, message: "请输入", trigger: "blur" }],
    },
  });
  const { form, rules, modelForm, modelRules } = toRefs(data);
@@ -458,10 +455,6 @@
  // 删除产品
  const remove = (node, data) => {
    if (isTopLevelNode(data, node)) {
      proxy.$modal.msgWarning("一级节点不能编辑或删除");
      return;
    }
    let ids = [];
    ids.push(data.id);
    ElMessageBox.confirm("选中的内容将被删除,是否确认删除?", "删除提示", {
@@ -565,40 +558,31 @@
        proxy.$modal.msg("已取消");
      });
  };
  // 调用tree过滤方法 中文英过滤
  const filterNode = (value, data, node) => {
    if (!value) {
      //如果数据为空,则返回true,显示所有的数据项
      return true;
    }
    // 查询列表是否有匹配数据,将值小写,匹配英文数据
    let val = value.toLowerCase();
    return chooseNode(val, data, node); // 调用过滤二层方法
  const debounce = (fn, delay = 300) => {
    let timer;
    return (...args) => {
      clearTimeout(timer);
      timer = setTimeout(() => fn(...args), delay);
    };
  };
  // 过滤父节点 / 子节点 (如果输入的参数是父节点且能匹配,则返回该节点以及其下的所有子节点;如果参数是子节点,则返回该节点的父节点。name是中文字符,enName是英文字符.
  const chooseNode = (value, data, node) => {
    if (data.label.indexOf(value) !== -1) {
  const debouncedSearch = debounce(() => {
    searchFilter();
  }, 300);
  const filterNode = (value, data) => {
    if (!value) return true;
    return chooseNode(value.toLowerCase(), data);
  };
  const chooseNode = (value, data) => {
    const label = (data.label || '').toLowerCase();
    if (label.indexOf(value) !== -1) {
      return true;
    }
    const level = node.level;
    // 如果传入的节点本身就是一级节点就不用校验了
    if (level === 1) {
      return false;
    if (data.children && data.children.length > 0) {
      return data.children.some(child => chooseNode(value, child));
    }
    // 先取当前节点的父节点
    let parentData = node.parent;
    // 遍历当前节点的父节点
    let index = 0;
    while (index < level - 1) {
      // 如果匹配到直接返回,此处name值是中文字符,enName是英文字符。判断匹配中英文过滤
      if (parentData.data.label.indexOf(value) !== -1) {
        return true;
      }
      // 否则的话再往上一层做匹配
      parentData = parentData.parent;
      index++;
    }
    // 没匹配到返回false
    return false;
  };
  getProductTreeList();