import type { VueKey, VueText } from '#/types' import type { SortOrder } from 'ant-design-vue/es/table/interface' import type { ActionType, Bordered, BorderedType, ProColumns, ProColumnType, UseFetchDataAction } from '../typing' import type { TablePaginationConfig } from 'ant-design-vue' import type { IntlType } from '#/provider' import { arrayMoveImmutable } from '#/utils/array-move' import type { Ref } from 'vue' /** * 合并用户 props 和 预设的 props */ export function mergePagination( pagination: TablePaginationConfig | boolean | undefined, pageInfo: UseFetchDataAction['pageInfo'] & { setPageInfo: any }, intl: IntlType ): TablePaginationConfig | false | undefined { if (pagination === false) { return false } const { total, current, pageSize, setPageInfo } = pageInfo const defaultPagination: TablePaginationConfig = typeof pagination === 'object' ? pagination : {} return { showTotal: (all, range) => `${intl.getMessage('pagination.total.range', '第')} ${range[0]}-${range[1]} ${intl.getMessage( 'pagination.total.total', '条/总共' )} ${all} ${intl.getMessage('pagination.total.item', '条')}`, total, ...(defaultPagination as TablePaginationConfig), current, pageSize, showSizeChanger: true, onChange: (page: number, newPageSize?: number) => { const { onChange } = pagination as TablePaginationConfig onChange?.(page, newPageSize || 10) // pageSize 改变之后就没必要切换页码 if (newPageSize !== pageSize || current !== page) { setPageInfo({ pageSize: newPageSize, current: page }) } } } } /** * 获取用户的 action 信息 */ export function useActionType( ref: Ref, action: UseFetchDataAction, props: { fullScreen: () => void onCleanSelected: () => void resetAll: () => void editableUtils: any } ) { /** 这里生成action的映射,保证 action 总是使用的最新 只需要渲染一次即可 */ const userAction: ActionType = { ...props.editableUtils, pageInfo: action.pageInfo, reload: async (resetPageIndex?: boolean) => { // 如果为 true,回到第一页 if (resetPageIndex) { await action.setPageInfo({ current: 1 }) } action?.reload() }, reloadAndRest: async () => { // reload 之后大概率会切换数据,清空一下选择。 props.onCleanSelected() await action.setPageInfo({ current: 1 }) await action?.reload() }, reset: async () => { await props.resetAll() await action?.reset?.() await action?.reload() }, fullScreen: () => props.fullScreen(), clearSelected: () => props.onCleanSelected(), // @ts-ignore setPageInfo: rest => action.setPageInfo(rest) } ref.value = userAction } type PostDataType = (data: T) => T /** * 一个转化的 pipeline 列表 * * @param data * @param pipeline */ export function postDataPipeline(data: T, pipeline: PostDataType[]) { if (pipeline.filter(item => item).length < 1) { return data } return pipeline.reduce((pre, postData) => { return postData(pre) }, data) } export const isBordered = (borderType: BorderedType, border?: Bordered) => { if (border === undefined) { return false } // debugger if (typeof border === 'boolean') { return border } return border[borderType] } export const isMergeCell = ( dom: any // 如果是合并单元格的,直接返回对象 ) => dom && typeof dom === 'object' && dom?.props?.colSpan /** * 根据 key 和 dataIndex 生成唯一 id * * @param key 用户设置的 key * @param index 序列号,理论上唯一 */ export const genColumnKey = (key?: VueKey | undefined, index?: number): string => { if (key) { return Array.isArray(key) ? key.join('-') : key.toString() } return `${index}` } /** * 将 ProTable - column - dataIndex 转为字符串形式 * * @param dataIndex Column 中的 dataIndex */ function parseDataIndex(dataIndex: ProColumnType['dataIndex']): string | undefined { if (Array.isArray(dataIndex)) { return dataIndex.join(',') } return dataIndex?.toString() } /** * 从 ProColumns 数组中取出默认的排序和筛选数据 * * @param columns ProColumns */ export function parseDefaultColumnConfig(columns: ProColumns[]) { const filter: Record = {} const sort: Record = {} columns.forEach(column => { // 转换 dataIndex const dataIndex = parseDataIndex(column.dataIndex) if (!dataIndex) { return } // 当 column 启用 filters 功能时,取出默认的筛选值 if (column.filters) { const defaultFilteredValue = column.defaultFilteredValue as VueText[] if (defaultFilteredValue === undefined) { filter[dataIndex] = null } else { filter[dataIndex] = column.defaultFilteredValue as VueText[] } } // 当 column 启用 sorter 功能时,取出默认的排序值 if (column.sorter && column.defaultSortOrder) { sort[dataIndex] = column.defaultSortOrder! } }) return { sort, filter } } export type SortDataParams = { oldIndex: number; newIndex: number } /** * 数据排序核心逻辑 * * @param oldIndex 原始位置 * @param newIndex 新位置 * @param data 原始数组 */ export function sortData({ oldIndex, newIndex }: SortDataParams, data: T[]): T[] | null { if (oldIndex !== newIndex) { const newData = arrayMoveImmutable([...(data || [])], oldIndex, newIndex).filter(el => !!el) return [...newData] } return null }