@lingxiteam/ebe-utils 0.4.6 → 0.5.0

package/lib/public/src/components/pcfactory/src/Table/hooks/useFilter.tsx

@@ -1,274 +0,0 @@
-/* eslint-disable react/no-danger-with-children */
-import { Button, Checkbox } from 'antd';
-import { FilterDropdownProps } from 'antd/lib/table/interface';
-import { useCallback, useEffect, useMemo, useRef, useState } from 'react';
-
-const useFilter = (props: any) => {
-  const {
-    compId,
-    innerDataSource,
-    currentRowKey,
-    getLocale,
-    outerDataSourceRef,
-  } = props;
-
-  const [filters, setFilters] = useState<any>({}); // 筛选条件
-  // 筛选时不影响页码，不使用antd默认的确定方法，因为会导致触发onChange方法
-  const [filterDropdownOpen, setFilterDropdownOpen] = useState({}); // 筛选浮层的关闭与否
-  const [selectedFilterKeys, setSelectedFilterKeys] = useState<any>({}); // 记录临时筛选条件，关闭筛选浮层后需要应用到筛选条件上
-  const tempFilterDomList = useRef<any>({}); // 记录筛选列对应的元素
-
-  const rowFilterSetList = useMemo(() => {
-    const trRowFilterSetList: any[] = [];
-    const domList = tempFilterDomList?.current || {};
-    if (Object.keys(filters)?.length) {
-      Object.keys(filters).forEach((dataIndex: string) => {
-        const valList = filters[dataIndex];
-        if (!valList) return;
-        const { valMap = {} } = domList[dataIndex] || {};
-        let keysList: string[] = [];
-        valList?.forEach((val: string) => {
-          const { rowKeyList } = valMap[val];
-          keysList = keysList.concat(rowKeyList);
-        });
-        if (keysList?.length) {
-          trRowFilterSetList.push(new Set(keysList));
-        }
-      });
-    }
-    if (Object.keys(filters)?.length === 0) {
-      // 过滤条件全部重置时，清除筛选项缓存
-      tempFilterDomList.current = {};
-    }
-    return trRowFilterSetList;
-  }, [filters]);
-
-  // 判断行是否经过筛选后需要隐藏
-  const checkIfHiddenRow = useCallback(
-    (rowId: string) => {
-      let flag: boolean = false;
-      if (rowFilterSetList?.length) {
-        flag = !rowFilterSetList.every((rowSet: Set<string>) =>
-          rowSet.has(rowId),
-        );
-      }
-      return flag;
-    },
-    [rowFilterSetList],
-  );
-
-  // 筛选下拉列表显隐
-  const onFilterDropdownVisibleChange = (dataIndex: string, open: boolean) => {
-    setFilterDropdownOpen((pre) => ({
-      ...pre,
-      [dataIndex]: open,
-    }));
-    if (!open) {
-      setFilters(selectedFilterKeys);
-    } else {
-      setSelectedFilterKeys(filters);
-    }
-  };
-
-  // 筛选条件下拉列表
-  const collectFilterDropDownDom = (colParams: { dataIndex: string }) => {
-    const { dataIndex } = colParams;
-    const rowKey = currentRowKey;
-    const tableDom = document.querySelector(`[data-compid='${compId}']`);
-    const valMap: any = {};
-    const originDataMap: any = {};
-    let prevTdInfo: any = null;
-    innerDataSource.forEach((d: any) => {
-      originDataMap[d[rowKey]] = d[dataIndex];
-      // 由于表格存在单元格渲染和自定义渲染的情况，所以筛选列表从td元素获取innerText作为最终展示
-      let td: any = tableDom?.querySelector(
-        `tr[data-row-key='${d[rowKey]}'] > td[td-dataIndex='${dataIndex}']`,
-      );
-      if (!td && prevTdInfo?.rowSpan > 1) {
-        // td没有找到，但是存在tr元素，表明可能开启了行合并，采用前一个
-        prevTdInfo.rowSpan -= 1;
-        td = prevTdInfo?.td;
-      } else {
-        prevTdInfo = {
-          td,
-          rowSpan: td?.rowSpan,
-        };
-      }
-      if (td) {
-        const val = td.innerText;
-        const rowKeyList = valMap[val]?.rowKeyList || [];
-        // 记录筛选
-        rowKeyList.push(d[rowKey]);
-        originDataMap[d[rowKey]] = val;
-        valMap[val] = {
-          dom: td.innerHTML,
-          rowKeyList,
-        };
-      }
-    });
-    tempFilterDomList.current = {
-      ...(tempFilterDomList.current || {}),
-      [`${compId}Dom`]: tableDom,
-      [dataIndex]: {
-        valMap,
-        originDataMap,
-      },
-    };
-  };
-
-  useEffect(() => {
-    // 源数据变化时，重置筛选条件以及重新收集筛选条件
-    setFilters({});
-    tempFilterDomList.current = {};
-  }, [outerDataSourceRef, currentRowKey]);
-
-  // 收集所有筛选条件
-  const collectAllFilters = (columns: any[], dataIndex: any) => {
-    if (
-      !Object.keys(tempFilterDomList.current)?.length ||
-      !tempFilterDomList.current?.[dataIndex]
-    ) {
-      columns.forEach((col) => {
-        if (col.filter) {
-          collectFilterDropDownDom({
-            ...col,
-          });
-        }
-      });
-    }
-  };
-
-  // 获取当前展示的筛选列表
-  const getCurrentFilterList = (dataIndex: string) => {
-    // 当前选项所有筛选列表
-    const currentFilter = { ...tempFilterDomList.current[dataIndex]?.valMap };
-    const valKeys = Object.keys(currentFilter || {});
-    if (valKeys?.length) {
-      valKeys.forEach((k: string) => {
-        const rowKeys = currentFilter[k]?.rowKeyList.filter(
-          (rowKey: string) => {
-            return Object.keys(filters || {}).every((dataKey: string) => {
-              if (dataKey !== dataIndex) {
-                const v = filters[dataKey];
-                if (v?.length) {
-                  const rowVal =
-                    tempFilterDomList.current[dataKey]?.originDataMap?.[rowKey];
-                  return v.includes(rowVal);
-                }
-              }
-              return true;
-            });
-          },
-        );
-        // 在其他条件过滤后，当前筛选项没有数据列时，则不展示
-        if (rowKeys.length === 0) {
-          delete currentFilter[k];
-        }
-      });
-    }
-    return currentFilter;
-  };
-
-  // 筛选自定义下拉菜单
-  const renderFilterDropDown = (
-    filterParams: FilterDropdownProps,
-    dataIndex: string,
-    columns: any[],
-  ) => {
-    const { visible } = filterParams;
-    if (!visible) return false;
-    const selectedKeys = selectedFilterKeys[dataIndex] || [];
-    const setSelectedKeys = (keys: string[] | null) =>
-      setSelectedFilterKeys((pre: any) => ({ ...pre, [dataIndex]: keys }));
-    collectAllFilters(columns, dataIndex);
-    const valMap = getCurrentFilterList(dataIndex);
-    return (
-      visible && (
-        <div className="ued-table-filters">
-          <div className="ued-table-filters-content">
-            {Object.keys(valMap || {}).map((val: any) => {
-              const { dom } = valMap[val];
-              return (
-                <div className="ued-table-filters-item">
-                  <Checkbox
-                    checked={selectedKeys.includes(val)}
-                    onChange={(e) => {
-                      let newSelected: any[] = [];
-                      if (e.target.checked) {
-                        newSelected = [...selectedKeys, val];
-                      } else {
-                        newSelected = selectedKeys.filter(
-                          (k: string) => k !== val,
-                        );
-                      }
-                      setSelectedKeys(newSelected?.length ? newSelected : null);
-                    }}
-                  >
-                    <div
-                      className="ued-table-filters-dom"
-                      // eslint-disable-next-line react/no-danger
-                      dangerouslySetInnerHTML={
-                        dom && val ? { __html: dom } : undefined
-                      }
-                    >
-                      {val ? null : `(${getLocale('Table.filter.empty')})`}
-                    </div>
-                  </Checkbox>
-                </div>
-              );
-            })}
-          </div>
-          <div className="ued-table-filters-bottom">
-            <Button
-              type="link"
-              disabled={selectedKeys?.length === 0}
-              size="small"
-              onClick={() => {
-                setSelectedKeys(null);
-              }}
-            >
-              {getLocale('reset')}
-            </Button>
-            <Button
-              type="primary"
-              size="small"
-              onClick={() => {
-                setFilters((pre: any) => ({
-                  ...pre,
-                  [dataIndex]: selectedKeys?.length ? selectedKeys : null,
-                }));
-                setFilterDropdownOpen((pre) => ({
-                  ...pre,
-                  [dataIndex]: false,
-                }));
-              }}
-            >
-              {getLocale('confirm')}
-            </Button>
-          </div>
-        </div>
-      )
-    );
-  };
-
-  const filterDataSource = useMemo(() => {
-    if (Object.keys(filters)?.length) {
-      return innerDataSource.filter(
-        (record: any) => !checkIfHiddenRow(record[currentRowKey]),
-      );
-    }
-    return innerDataSource;
-  }, [filters, innerDataSource]);
-
-  return {
-    filters,
-    filterDropdownOpen,
-    setFilters,
-    checkIfHiddenRow,
-    onFilterDropdownVisibleChange,
-    renderFilterDropDown,
-    filterDataSource,
-  };
-};
-
-export default useFilter;

package/lib/public/src/components/pcfactory/src/Table/hooks/useFormatCell.ts

@@ -1,309 +0,0 @@
-import { message } from 'antd';
-import type { FuncExpExeCuteType } from '../../utils/hooks/useFuncExpExecute';
-import {
-  CUSTOM,
-  DOWNLOAD_FILE,
-  OPEN_MODAL,
-  PAGE_JUMP,
-  PREVIEW_FILE,
-  ROUTE_PUSH,
-  ROUTE_REPLACE,
-} from '../constant';
-import type { ContentClick, FuncCode } from '../types/contentStyle';
-
-interface useFormatCellProps extends ContentClick {
-  appId: string;
-  pageId: string;
-  modalHeight?: number;
-  modalWidth?: number;
-  funcExpExecute?: FuncExpExeCuteType;
-  engineApis: any;
-}
-
-const useFormatCell = (props: useFormatCellProps) => {
-  const {
-    funcExpExecute,
-    engineApis,
-    appId,
-    pageId,
-    content,
-    clickType,
-    page,
-    modal,
-    openType,
-    fileIds,
-    filename,
-    previewType,
-    downloadUrl,
-    modalHeight,
-    modalWidth,
-  } = props;
-
-  const realAppId = appId;
-  const realPageId = pageId;
-
-  const handleCellContent = (row: any, rowIndex: number) => {
-    if ((content as FuncCode)?.code && funcExpExecute) {
-      return funcExpExecute((content as FuncCode).code, [
-        {
-          key: 'row',
-          value: row,
-        },
-        {
-          key: 'index',
-          value: rowIndex,
-        },
-      ]);
-    }
-
-    return content;
-  };
-
-  const handlePageJump = async (
-    row: any,
-    rowId: string | number,
-    rowIndex: number,
-  ) => {
-    if (page) {
-      const { pagePath, searchParams = {} } = page;
-      const newSearchParams: any = {};
-
-      Object.keys(searchParams).forEach((key) => {
-        if (typeof searchParams[key] === 'string') {
-          const exp = searchParams[key];
-          searchParams[key] = (
-            row: any,
-            rowId: string | number,
-            index: number,
-          ) =>
-            engineApis?.sandBoxSafeRun(exp, {
-              row,
-              rowId,
-              index,
-            });
-        }
-
-        if (typeof searchParams[key] === 'function') {
-          try {
-            newSearchParams[key] = searchParams[key](row, rowId, rowIndex);
-          } catch (e) {
-            console.error(e);
-          }
-        }
-      });
-
-      let newPath = pagePath || '';
-      Object.keys(newSearchParams).forEach((key) => {
-        if (!newPath.includes(`${key}=`)) {
-          newPath += `${newPath.includes('?') ? '&' : '?'}${key}=${
-            newSearchParams[key]
-          }`;
-        }
-      });
-
-      switch (openType) {
-        case ROUTE_PUSH:
-          if (typeof engineApis?.historyPush === 'function') {
-            engineApis.historyPush(newPath);
-          }
-          break;
-        case ROUTE_REPLACE:
-          if (typeof engineApis?.historyReplace === 'function') {
-            engineApis.historyReplace(newPath);
-          }
-          break;
-        default:
-          break;
-      }
-    }
-  };
-
-  const handleOpenModal = async (
-    row: any,
-    rowId: string | number,
-    rowIndex: number,
-  ) => {
-    if (modal) {
-      const { pageId, compStates = {} } = modal;
-
-      const newCompStates: any = {};
-      Object.keys(compStates).forEach((key) => {
-        if (typeof compStates[key] === 'string') {
-          const exp = compStates[key];
-          compStates[key] = (row: any, rowId: string | number, index: number) =>
-            engineApis?.sandBoxSafeRun(exp, {
-              row,
-              rowId,
-              index,
-            });
-        }
-
-        if (typeof compStates[key] === 'function') {
-          try {
-            newCompStates[key] = compStates[key](row, rowId, rowIndex);
-          } catch (e) {
-            console.error(e);
-          }
-        }
-      });
-
-      if (engineApis?.openModal) {
-        engineApis.openModal({
-          pageId,
-          params: newCompStates,
-        });
-      }
-    }
-  };
-
-  const handleDownloadFile = async (row: any, rowIndex: number) => {
-    if (typeof engineApis?.batchDownloadFileByIds === 'function') {
-      try {
-        let realFilename = filename;
-        let realFileIds = fileIds;
-
-        if ((filename as FuncCode)?.code && funcExpExecute) {
-          realFilename = funcExpExecute((filename as FuncCode).code, [
-            {
-              key: 'row',
-              value: row,
-            },
-            {
-              key: 'index',
-              value: rowIndex,
-            },
-          ]);
-        }
-
-        if ((fileIds as FuncCode)?.code && funcExpExecute) {
-          realFileIds = funcExpExecute((fileIds as FuncCode).code, [
-            {
-              key: 'row',
-              value: row,
-            },
-            {
-              key: 'index',
-              value: rowIndex,
-            },
-          ]);
-        }
-
-        realFileIds = Array.isArray(realFileIds) ? realFileIds[0] : realFileIds;
-
-        engineApis.batchDownloadFileByIds({
-          fileIds: realFileIds,
-          newFileName: realFilename,
-          onError: (errorMessage: string) => {
-            message.error(errorMessage);
-          },
-        });
-      } catch (e) {
-        console.error(e);
-      }
-    }
-  };
-
-  const handlePreviewFile = async (row: any, rowIndex: number) => {
-    let realFileIds: any = fileIds;
-
-    if ((fileIds as FuncCode)?.code && funcExpExecute) {
-      realFileIds = funcExpExecute((fileIds as FuncCode).code, [
-        {
-          key: 'row',
-          value: row,
-        },
-        {
-          key: 'index',
-          value: rowIndex,
-        },
-      ]);
-    }
-
-    if (typeof engineApis?.BannerModal?.open === 'function') {
-      // 弹窗预览
-      realFileIds =
-        typeof realFileIds === 'string' ? [realFileIds] : realFileIds;
-      const fileList = realFileIds.map((fileId: string | number) => {
-        return {
-          fileId,
-          file: {
-            fileId,
-          },
-        };
-      });
-      engineApis.BannerModal.open({
-        fileIndex: 0,
-        fileList,
-        viewMode: previewType,
-        modalHeight,
-        pageId: realPageId,
-        appId: realAppId,
-        modalWidth,
-      });
-    } else if (
-      previewType !== undefined &&
-      typeof engineApis?.previewFile === 'function'
-    ) {
-      // 新窗口预览
-      realFileIds = Array.isArray(realFileIds) ? realFileIds[0] : realFileIds;
-      try {
-        engineApis.previewFile({
-          fileId: realFileIds,
-          appId: realAppId,
-          pageId: realPageId,
-        });
-      } catch (e) {
-        console.error(e);
-      }
-    }
-  };
-
-  const onCellClick = async (
-    row: any,
-    rowId: string | number,
-    rowIndex: number,
-  ) => {
-    switch (clickType) {
-      case PAGE_JUMP:
-        handlePageJump(row, rowId, rowIndex);
-        break;
-      case OPEN_MODAL:
-        handleOpenModal(row, rowId, rowIndex);
-        break;
-      case DOWNLOAD_FILE:
-        handleDownloadFile(row, rowIndex);
-        break;
-      case PREVIEW_FILE:
-        handlePreviewFile(row, rowIndex);
-        break;
-      case CUSTOM: {
-        let realDownloadUrl: any = downloadUrl;
-
-        if ((downloadUrl as FuncCode)?.code && funcExpExecute) {
-          realDownloadUrl = funcExpExecute((downloadUrl as FuncCode).code, [
-            {
-              key: 'row',
-              value: row,
-            },
-            {
-              key: 'index',
-              value: rowIndex,
-            },
-          ]);
-        }
-
-        window.open(realDownloadUrl, openType);
-        break;
-      }
-      default:
-        break;
-    }
-  };
-
-  return {
-    onCellClick,
-    handleCellContent,
-  };
-};
-
-export default useFormatCell;

package/lib/public/src/components/pcfactory/src/Table/hooks/usePagination.ts

@@ -1,104 +0,0 @@
-import classNames from 'classnames';
-import { useEffect, useMemo, useState } from 'react';
-import { useListenProps } from '../../utils';
-import { useLocale } from '../../utils/hooks/useLocale';
-
-const usePagination = (props: any) => {
-  const {
-    size,
-    showQuickJumper,
-    showSizeChanger,
-    pageSizeOptions,
-    page,
-    current: originCurrent,
-    total: originTotal,
-    pageSize: originPageSize,
-    showTotal,
-    onPageChange,
-  } = props;
-
-  // TODO: 有咩有判断是否是前端分页更好的方式？
-  const hasPageChangeEvent = typeof onPageChange === 'function'; // 是否配置页码改变回调事件（是：后端分页，否：前端分页）
-
-  const { getLocale } = useLocale(props?.getEngineApis?.());
-
-  const [currentPage, setCurrentPage] = useState(originCurrent || 1);
-  const [currentPageSize, setCurrentPageSize] = useState(originPageSize || 10);
-  const [total, setTotal] = useListenProps(originTotal);
-  const [current, setCurrent] = useListenProps(originCurrent);
-  const [pageSize] = useListenProps(originPageSize);
-
-  // 解析分页选择器配置
-  const parsedPageSizeOptions = useMemo(() => {
-    if (pageSizeOptions) {
-      try {
-        const arr = JSON.parse(pageSizeOptions);
-        if (Array.isArray(arr)) {
-          return arr.map((s) => String(s));
-        }
-        return [];
-      } catch (e) {
-        console.error('条数可选值 pageSizeOptions 必须配置为数字数组字符串'); // eslint-disable-line no-console
-      }
-    }
-    return [];
-  }, [pageSizeOptions]);
-
-  // current为空时默认为1
-  const paginationCurrent = (current ? +current : current) || 1;
-  const paginationPageSize = (pageSize ? +pageSize : pageSize) || 10;
-  const pagination = {
-    showTotal: showTotal
-      ? (total: number) => getLocale('Pagination.showTotal', { tol: total })
-      : undefined,
-    // TODO: 这里目前存在一个问题，若配置了空的分页事件，自动认为是后端分页，实际上
-    current: hasPageChangeEvent ? paginationCurrent : currentPage,
-    pageSize: hasPageChangeEvent ? paginationPageSize : currentPageSize,
-    total: Number(total) || undefined,
-    showQuickJumper,
-    showSizeChanger,
-    pageSizeOptions: parsedPageSizeOptions,
-    size: 'default',
-    className: classNames('ued-table-page', `ued-table-page-${size}`),
-    // onChange: (newCurrent: React.SetStateAction<number>, newPageSize: number) => {
-    //   if (hasPageChangeEvent) {
-    //     onPageChange(newCurrent, newPageSize);
-    //     return;
-    //   }
-    //   setCurrentPage(newCurrent);
-    //   setCurrentPageSize(newPageSize);
-    // },
-  };
-
-  useEffect(() => {
-    // 前端分页时，若传入的分页信息有变更且有效，需要更新内部维护的分页数据
-    if (!hasPageChangeEvent) {
-      if (
-        typeof current === 'number' ||
-        (typeof current === 'string' && !isNaN(Number(current)))
-      ) {
-        setCurrentPage(Number(current));
-      }
-
-      if (
-        typeof pageSize === 'number' ||
-        (typeof pageSize === 'string' && !isNaN(Number(pageSize)))
-      ) {
-        setCurrentPageSize(Number(pageSize));
-      }
-    }
-  }, [current, pageSize]);
-
-  return {
-    pagination,
-    page,
-    hasPageChangeEvent,
-    setCurrent,
-    setCurrentPage,
-    setCurrentPageSize,
-    setTotal,
-    onPageChange,
-  };
-};
-
-export default usePagination;