省人民维护

WXL

2 天以前 ead85633109bcb3cc8d8b3c6804c280dd6ee1e5d

 src/views/project/components/orgselect/index.vue

@@ -14,6 +14,7 @@
      @focus="focusEvents.func"
      @change="change"
      @blur="changeBlur"
      @visible-change="handleVisibleChange"
      value-key="organizationid"
      allow-create
      reserve-keyword
@@ -22,8 +23,8 @@
      ref="selecter"
    >
      <el-option
        v-for="(spec, index) in dataList"
        :key="index"
        v-for="(spec, index) in displayList"
        :key="spec.organizationid"
        :label="spec.organizationname"
        :value="spec.organizationid"
      >
@@ -101,8 +102,10 @@
    return {
      pageData: { pageNum: 1, pageSize: 100 },
      isLoading: false,
      // dataList: [],
      tempList: [],
      // 三个独立的数据源，避免相互污染
      originalList: [], // 完整的原始数据源
      tempList: [],     // 中间缓存数据
      displayList: [],  // 用于渲染显示的列表
      myValue: this.multiple ? [] : "",
      focusEvents: {
        func: () => {},
@@ -130,7 +133,6 @@
    renderSelecter() {
      this.pageData.PageSize = 100;
      this.myValue = this.value;

      this.getdataList();
    },

@@ -144,60 +146,84 @@
      }; //搜索条件

      let userType = { userType: "1" };
      if (this.orgType == 4) {
        let arr = this.$store.state.user.organization;
        this.originalList.push(...arr);
        if (this.isAll) {
          let all = {
            organizationid: "",
            organizationname: "全部"
          };
          this.originalList.unshift(all);
        }
        // 初始化三个列表为相同数据
        this.tempList = [...this.originalList];
        this.displayList = [...this.originalList];
        this.focusEvents.loaded = true;
        this.isLoading = false;
        return;
      }

      listOrganization(searchData)
        .then(response => {
          this.dataList.push(...response.rows);
          this.originalList.push(...response.rows);
          if (this.isAll) {
            let all = {
              organizationid: "",
              organizationname: "全部"
            };
            this.dataList.unshift(all);
            this.originalList.unshift(all);
          }
          this.tempList = this.dataList.map(item => item);
          // 初始化三个列表为相同数据
          this.tempList = [...this.originalList];
          this.displayList = [...this.originalList];
          this.focusEvents.loaded = true;
        })
        .catch(error => {
          // 暂无处理
          console.error("获取机构列表失败:", error);
        })
        .finally(() => {
          this.isLoading = false;
        });
    },

    getOptionByValue(key) {
      let outValue = null;
      this.dataList.forEach(e => {
        if (e.organizationid == key) {
          outValue = e;
        }
      });

      return outValue;
    },

    /**
     * 自定义筛选方法 - 修复搜索无效问题
     * @param {string} val - 搜索关键词
     */
    filterMethod(val) {
      this.myValue = val;
      if (val) {
        this.dataList = this.tempList.filter(item => {
          if (
            (item.PYM &&
              !!~item.PYM.toUpperCase().indexOf(val.toUpperCase())) ||
            (item.WBM &&
              !!~item.WBM.toUpperCase().indexOf(val.toUpperCase())) ||
        // 对临时列表进行筛选，不修改原始数据
        this.displayList = this.tempList.filter(item => {
          return (
            (item.PYM && item.PYM.toUpperCase().includes(val.toUpperCase())) ||
            (item.WBM && item.WBM.toUpperCase().includes(val.toUpperCase())) ||
            (item.organizationname &&
              !!~item.organizationname.toUpperCase().indexOf(val.toUpperCase()))
          ) {
            return true;
          } else {
            return false;
          }
             item.organizationname.toUpperCase().includes(val.toUpperCase()))
          );
        });
      } else {
        this.dataList = this.tempList.map(item => item);
        // 搜索词为空时显示完整列表
        this.displayList = [...this.tempList];
      }
    },

    /**
     * 处理下拉框显示/隐藏事件 - 修复数据恢复问题
     * @param {boolean} visible - 是否可见
     */
    handleVisibleChange(visible) {
      if (!visible) {
        // 下拉框关闭时重置显示列表为完整数据
        this.displayList = [...this.originalList];
        this.tempList = [...this.originalList];
      }
    },

    getOptionByValue(key) {
      return this.originalList.find(item => item.organizationid == key) || null;
    },

    focus() {
      this.$refs.selecter.focus();
    },
@@ -213,9 +239,10 @@
        this.$emit("change", data);
      });
    },

    defaultInit(defaultItem, defaultItemName) {
      if (defaultItem && defaultItemName) {
        let list = this.dataList.filter(
        let list = this.originalList.filter(
          r =>
            r.organizationid == defaultItem &&
            r.organizationname == defaultItemName
@@ -225,10 +252,11 @@
            organizationname: defaultItemName,
            organizationid: defaultItem
          };
          this.dataList.push(data);
          this.originalList.push(data);
          this.tempList = [...this.originalList];
          this.displayList = [...this.originalList];
        }
      }
      this.tempList = this.dataList.map(item => item);
    }
  },
  computed: {},
@@ -240,6 +268,18 @@
    myValue(newVal) {
      this.$emit("input", newVal);
      this.$emit("change", newVal);
    },
    // 监听props中的dataList变化
    dataList: {
      handler(newList) {
        if (newList && newList.length > 0) {
          this.originalList = [...newList];
          this.tempList = [...newList];
          this.displayList = [...newList];
        }
      },
      immediate: true,
      deep: true
    }
  }
};
@@ -251,4 +291,14 @@
  position: relative;
  width: 90%;
}

// 优化搜索框样式
::v-deep.selectclass .el-select__input {
  min-width: 80px;
}

// 确保选项列表正常显示
::v-deep.selectclass .el-select-dropdown {
  z-index: 9999 !important;
}
</style>