linkmore-design/lib/lm-filter/filterFns/index.js

🌈 🚀lm组件库。🚀

"use strict";

Object.defineProperty(exports, "__esModule", {
  value: true
});
exports.initLocalization = exports.default = void 0;
var _react = require("react");
var _utils = require("../utils");
// 初始化查询结构
const initLocalization = props => {
  const {
    localization,
    dataSource,
    searchKey,
    searchConfig,
    customOptions
  } = props;
  const {
    globalQuery,
    filterQuery,
    fuzzyQuery
  } = localization;
  let basicFilter = localization?.basicFilter || {};
  let basicQuery = {}; // 存储查询结构
  const isFuzzy = Array.isArray(searchKey); // 数组时为模糊搜索结构
  let searchFilter = localization?.fuzzyFilter || {};
  let searchQuery = {}; // 模糊查询结构

  const customFilter = customOptions?.find(v => v?.value === localization?.customFilter?.value) || {};
  let customQuery = {}; // 自定义筛选存储结构

  // 一级查询
  if (globalQuery?.filters?.[0]?.conditions) {
    const globalQueryArr = globalQuery?.filters?.[0]?.conditions || [];
    customQuery = globalQueryArr.reduce((pre, cur) => {
      const checkedValue = cur.value; // 选中的数据
      // 查找该数据是否展示
      if ((0, _utils.getIsHas)(checkedValue)) {
        pre[cur.fieldName] = cur;
      }
      return pre;
    }, {});
  }

  // 模糊查询
  if ((0, _utils.getIsHas)(searchFilter)) {
    searchQuery = Object.keys(searchFilter)?.reduce((pre, cur) => {
      if ((0, _utils.getIsHas)(searchFilter[cur])) {
        pre[cur] = {
          ...searchConfig,
          fieldName: cur,
          value: [searchFilter[cur]]
        };
      }
      return pre;
    }, {});
  } else if (fuzzyQuery?.filters?.[0]?.conditions) {
    const fuzzyQueryArr = fuzzyQuery?.filters?.[0]?.conditions || [];
    // 初始化基础查询缓存
    searchFilter = fuzzyQueryArr.reduce((pre, cur) => {
      const checkedValue = cur.value; // 选中的数据
      if ((0, _utils.getIsHas)(checkedValue)) {
        searchQuery[cur.fieldName] = cur;
        pre[cur.fieldName] = checkedValue[0];
      }
      return pre;
    }, {});
  }

  // 二级查询
  if ((0, _utils.getIsHas)(basicFilter)) {
    basicQuery = Object.keys(basicFilter)?.reduce((pre, cur) => {
      let item = dataSource.find(v => {
        if (cur === v.field) {
          return v.show || typeof v.show !== 'boolean';
        }
        return false;
      });
      if (!isFuzzy && cur === searchKey) {
        item = {
          field: searchKey,
          operator: 'contains',
          fieldType: 'string'
        };
      }
      if ((0, _utils.getIsHas)(basicFilter[cur]) && !!item) {
        pre[cur] = {
          fieldName: cur,
          fieldType: item?.valueType || 'string',
          value: Array.isArray(basicFilter[cur]) ? basicFilter[cur] : [basicFilter[cur]],
          operator: item?.operator || 'equal'
        };
      }
      return pre;
    }, {});
  } else if (filterQuery?.filters?.[0]?.conditions) {
    const filterQueryArr = filterQuery?.filters?.[0]?.conditions || [];
    // 初始化基础查询缓存
    basicFilter = filterQueryArr.reduce((pre, cur) => {
      let checkedValue = cur.value; // 选中的数据
      // 是否搜索框
      const isSearchInput = cur.fieldName === searchKey;
      // 查找该数据是否展示
      const someData = dataSource.some(v => {
        if (cur.fieldName === v.field) {
          return v.show || typeof v.show !== 'boolean';
        }
        return false;
      });
      if ((0, _utils.getIsHas)(checkedValue) && someData || isSearchInput) {
        basicQuery[cur.fieldName] = cur;
        // 复选/级联/日期区间
        if (!['checkbox', 'cascader'].includes(cur.type) && checkedValue.length < 2) {
          checkedValue = checkedValue[0];
        }
        pre[cur.fieldName] = checkedValue;
      }
      return pre;
    }, {});
  }
  return {
    searchFilter,
    searchQuery,
    basicFilter,
    basicQuery,
    customFilter,
    customQuery
  };
};

// 核心参数集合
exports.initLocalization = initLocalization;
const useCoreOptions = ({
  state,
  dispatch,
  props
}) => {
  const {
    onChange,
    dataSource,
    searchKey,
    searchConfig,
    customOptions,
    enableAutoString
  } = props;

  // 获取是否存在过滤值
  const getHasFilter = (0, _react.useCallback)(() => {
    return (0, _utils.getIsHas)(state.basicFilter) || (0, _utils.getIsHas)(state.searchFilter);
  }, [state.basicFilter, state.searchFilter]);

  // 转换一级查询结构 object => array
  const tranformGlobalQuery = (0, _react.useCallback)(obj => {
    const nArr = Object.keys(obj)?.reduce((pre, cur) => {
      const item = dataSource.find(v => cur === v.field);
      const itemValue = obj[cur].value;
      if ((0, _utils.getIsHas)(itemValue) && !!item) {
        return [...pre, {
          relation: obj[cur].mode || 'and',
          fieldName: cur,
          fieldType: item?.valueType || 'string',
          type: item.type,
          value: Array.isArray(itemValue) ? itemValue : [itemValue],
          /**
           * and 等同于逻辑关系contains: 选中的值包含所有值
           * or 等同于逻辑关系in: 选中的值存在于所有值之中
           */
          operator: 'in'
        }];
      }
      return pre;
    }, []) || [];
    return nArr;
  }, [dataSource]);

  // 转行查询结构
  const tranformQuery = (0, _react.useCallback)(({
    customFilter,
    searchQuery = {},
    basicQuery = {}
  }) => {
    const globalQuery = {
      filters: [{
        conditions: tranformGlobalQuery(customFilter?.data)
      }]
    };
    const fuzzyQuery = {
      filters: [{
        conditions: Object.keys(searchQuery)?.map(k => searchQuery[k])
      }]
    };
    const filterQuery = {
      filters: [{
        conditions: Object.keys(basicQuery)?.map(k => basicQuery[k])
      }]
    };
    return {
      globalQuery,
      fuzzyQuery,
      filterQuery
    };
  }, [tranformGlobalQuery]);

  // 触发查询 type  basic基础筛选 ｜ complex高级筛选
  const onQuery = (0, _react.useCallback)(({
    complexFilter = {},
    type = 'basic',
    basicFilter = state.basicFilter || {},
    basicQuery = state.basicQuery || {},
    searchFilter = state.searchFilter || {},
    searchQuery = state.searchQuery || {},
    customFilter = state.customFilter || {}
  } = {}) => {
    if (type === 'custom') {
      dispatch({
        type: 'changeCustomFilter',
        customFilter
      });
      const {
        globalQuery,
        fuzzyQuery,
        filterQuery
      } = tranformQuery({
        customFilter,
        searchQuery,
        basicQuery
      });
      onChange?.({
        fuzzyFilter: searchFilter,
        fuzzyQuery,
        basicFilter,
        globalQuery,
        filterQuery,
        type: 'custom'
      });
    }
    if (type === 'search') {
      dispatch({
        type: 'changeSearchFilter',
        searchFilter
      });
      dispatch({
        type: 'changeSearchQuery',
        searchQuery
      });
      dispatch({
        type: 'changeComplexFilter',
        complexFilter: {}
      }); // 基础筛选清空高级筛选
      // 抛出给外部查询
      const {
        globalQuery,
        fuzzyQuery,
        filterQuery
      } = tranformQuery({
        customFilter,
        searchQuery,
        basicQuery
      });
      onChange?.({
        fuzzyFilter: searchFilter,
        basicFilter,
        fuzzyQuery,
        globalQuery,
        filterQuery,
        type: 'search'
      });
    }
    if (type === 'basic') {
      dispatch({
        type: 'changeBasicFilter',
        basicFilter
      });
      dispatch({
        type: 'changeBasicQuery',
        basicQuery
      });
      dispatch({
        type: 'changeComplexFilter',
        complexFilter: {}
      }); // 基础筛选清空高级筛选
      // 抛出给外部查询
      const {
        globalQuery,
        fuzzyQuery,
        filterQuery
      } = tranformQuery({
        customFilter,
        searchQuery,
        basicQuery
      });
      onChange?.({
        fuzzyFilter: searchFilter,
        basicFilter,
        fuzzyQuery,
        globalQuery,
        filterQuery,
        type: 'basic'
      });
    }
    if (type === 'complex') {
      // eslint-disable-next-line no-shadow
      const basicQuery = Object.keys(complexFilter)?.reduce((pre, cur) => {
        const item = dataSource.find(v => cur === v.field);
        const itemValue = complexFilter[cur].value;
        if ((0, _utils.getIsHas)(itemValue) && !!item) {
          // eslint-disable-next-line no-param-reassign
          pre[cur] = {
            relation: complexFilter[cur].mode || 'and',
            fieldName: cur,
            fieldType: item?.valueType || 'string',
            type: item.type,
            value: Array.isArray(itemValue) ? itemValue : [itemValue],
            operator: 'in'
          };
        }
        return pre;
      }, {});
      dispatch({
        type: 'changeSearchFilter',
        searchFilter: {}
      });
      dispatch({
        type: 'changeSearchQuery',
        searchQuery: {}
      });
      dispatch({
        type: 'changeBasicFilter',
        basicFilter: {}
      });
      dispatch({
        type: 'changeComplexFilter',
        complexFilter
      });
      dispatch({
        type: 'changeComplexDrawer',
        complexDrawer: {
          data: {},
          visible: false
        }
      });
      dispatch({
        type: 'changeBasicQuery',
        basicQuery
      });
      const {
        globalQuery,
        filterQuery
      } = tranformQuery({
        customFilter,
        basicQuery
      });
      onChange?.({
        complexFilter,
        globalQuery,
        filterQuery,
        type
      });
    }
    if (type === 'clear') {
      dispatch({
        type: 'reset'
      });
      const {
        globalQuery,
        fuzzyQuery,
        filterQuery
      } = tranformQuery({
        customFilter,
        searchQuery,
        basicQuery
      });
      onChange?.({
        fuzzyFilter: searchFilter,
        basicFilter,
        fuzzyQuery,
        globalQuery,
        filterQuery,
        type: 'clear'
      });
    }
  }, [tranformQuery, state]);

  // 清除事件
  const onClearChange = (0, _react.useCallback)(() => {
    const params = {
      searchFilter: {},
      searchQuery: {},
      basicFilter: {},
      complexFilter: {},
      basicQuery: {},
      type: 'clear'
    };
    props.onClearChange?.(params);
    onQuery(params);
  }, [onQuery]);

  // 根据字段查找过滤的数据, 不存在时返回默认值
  const getFilterValue = (0, _react.useCallback)(({
    field,
    type
  }) => {
    if ((0, _utils.getIsHas)(state.basicFilter[field])) {
      return state.basicFilter[field];
    }
    const defaultValue = (0, _utils.getValueForType)(type);
    return state.basicFilter[field] || defaultValue;
  }, [state.basicFilter]);

  // 获取查询结构
  const getFilterQuery = (0, _react.useCallback)((originData = dataSource) => {
    const basicFilter = (0, _utils.getFilterShow)(state.basicFilter, originData);
    const basicQuery = (0, _utils.getFilterShow)(state.basicQuery, originData);
    dispatch({
      type: 'changeBasicFilter',
      basicFilter
    });
    dispatch({
      type: 'changeBasicQuery',
      basicQuery
    });
    const {
      globalQuery,
      fuzzyQuery,
      filterQuery
    } = tranformQuery({
      customFilter: state.customFilter,
      searchQuery: state.searchQuery,
      basicQuery
    });
    return {
      fuzzyFilter: state.searchFilter,
      basicFilter,
      fuzzyQuery,
      globalQuery,
      filterQuery,
      type: 'basic'
    };
  }, [state, dataSource]);

  /*
   * 设置筛选的值 itemValue => String || Array => ['', '', ...]
   * 后端仅接受数组包字符串形式, 不接受数值及布尔值
   */
  const setFilterValue = (0, _react.useCallback)((itemValue, item) => {
    const {
      field
    } = item;
    if (field) {
      // 将结果转换为字符串(级联数据需要递归)
      const transformString = val => Array.isArray(val) ? val.map(v => transformString(v)) : String(val);
      const stringValue = enableAutoString ? transformString(itemValue) : itemValue;
      // 基础查询数据(受控数据)
      const basicFilter = {
        ...state.basicFilter,
        [field]: stringValue
      };
      // 外部查询数据结构
      const basicQuery = {
        ...state.basicQuery,
        [field]: {
          fieldName: field,
          fieldType: item.valueType || 'string',
          type: item.type,
          value: Array.isArray(itemValue) ? stringValue : [stringValue],
          operator: item.operator || 'equal'
        }
      };
      // 数据清除时不返回结构体
      if (!(0, _utils.getIsHas)(itemValue)) {
        delete basicFilter[field];
        delete basicQuery[field];
      }

      // 触发外部事件
      onQuery?.({
        basicFilter,
        basicQuery,
        type: 'basic'
      });
    }
  }, [state]);

  // 单个设置过滤字段值, 会触发onChange事件, 多个字段时使用setLocalization
  const setFilterFieldValue = (0, _react.useCallback)((field, value) => {
    const item = dataSource.find(v => v.fidld === field) || {};
    setFilterValue?.(value, item);
  }, [dataSource]);

  // 读取缓存
  const setLocalization = (0, _react.useCallback)((localization = props.localization) => {
    const {
      searchFilter,
      searchQuery,
      basicFilter,
      basicQuery,
      customFilter,
      customQuery
    } = initLocalization({
      ...props,
      localization
    });
    dispatch({
      type: 'changeSearchFilter',
      searchFilter
    });
    dispatch({
      type: 'changeSearchQuery',
      searchQuery
    });
    dispatch({
      type: 'changeBasicFilter',
      basicFilter
    });
    dispatch({
      type: 'changeBasicQuery',
      basicQuery
    });
    dispatch({
      type: 'changeCustomFilter',
      customFilter
    });
    dispatch({
      type: 'changeCustomQuery',
      customQuery
    });
  }, [props]);

  // 模糊查询结构
  const setSearchFilter = (0, _react.useCallback)(itemValue => {
    let searchFilter = searchKey?.reduce((pre, cur) => {
      pre[cur] = itemValue;
      return pre;
    }, {
      ...state.searchFilter
    });
    let searchQuery = searchKey?.reduce((pre, cur) => {
      pre[cur] = {
        ...searchConfig,
        fieldName: cur,
        value: [itemValue]
      };
      return pre;
    }, {
      ...state.searchQuery
    });

    // 数据清除时不返回结构体
    if (!(0, _utils.getIsHas)(itemValue)) {
      searchFilter = {};
      searchQuery = {};
    }
    onQuery({
      searchFilter,
      searchQuery,
      type: 'search'
    });
  }, [searchKey, state]);

  // 自定义筛选查询
  const setCustomFilter = (0, _react.useCallback)(val => {
    const customFilter = customOptions.find(v => v.value === val);
    onQuery({
      customFilter,
      type: 'custom'
    });
  }, [customOptions, state.basicFilter]);

  // 组件内部使用
  const CoreMethods = {
    onQuery,
    setCustomFilter,
    setSearchFilter
  };

  // 参与Ref转发
  const RefMethods = {
    getState: () => state,
    getBasicFilter: () => state.basicFilter,
    getFilterValue,
    getFilterQuery,
    getHasFilter,
    setFilterValue,
    setFilterFieldValue,
    setLocalization,
    onClearChange
  };
  return {
    CoreMethods,
    RefMethods
  };
};
var _default = useCoreOptions;
exports.default = _default;