@kyfe/ks-query-table 0.0.2 → 0.0.3

package/components/pe-table/utils/columns.js

@@ -1,290 +0,0 @@
-/** @format */
-
-import cloneDeep from 'lodash/cloneDeep'
-import { createFixedColumnsOnLeft, updateColumnsIndexWidth } from './fixed'
-const key = 'key'
-
-function getAllChildKeys(children, acc) {
-  const keys = new Set()
-
-  for (const child of children) {
-    const childKey = child[key]
-    keys.add(childKey)
-    getAllChildKeys(child.children || [], [...acc, childKey]).forEach(
-      (subKey) => {
-        keys.add(subKey)
-      }
-    )
-  }
-
-  return Array.from(keys)
-}
-
-export function createVisibleFlatColumns({
-  columns,
-  rowCellRender,
-  headerCellRender
-}) {
-  const stack = cloneDeep(columns)
-
-  const visibleFlatColumns = []
-  const collapsedMap_ = new Map()
-  const colsMap = {}
-  while (stack.length) {
-    const current = stack.shift()
-    const currentKey = current[key]
-    const {
-      children = [],
-      fixed,
-      width,
-      parentNodeKeys = [],
-      childKeys = [],
-      // parentNodeKey,
-      resizable = true,
-      minWidth,
-      ...reset
-    } = current
-    const { level = 1, collapsed = false, collapseKeys = [] } = reset
-    if (collapseKeys.length) {
-      for (const k of collapseKeys) {
-        collapsedMap_.set(k, collapsed)
-      }
-    }
-    const hasChildren = !!children.length
-    if (hasChildren) {
-      // 继承父级的fixed
-      const parentNodeKey = currentKey
-      stack.unshift(
-        ...children.map((child) => ({
-          ...child,
-          parentNodeKeys: [...parentNodeKeys, parentNodeKey],
-          fixed,
-          parentNodeKey,
-          level: level + 1,
-        }))
-      )
-    }
-    const item = {
-      ...current,
-      width: minWidth || width,
-      minWidth,
-      parentNodeKeys,
-      children,
-      level,
-      resizable,
-      childKeys: getAllChildKeys(children, childKeys),
-      rowCellRender: current.rowCellRender || rowCellRender,
-      headerCellRender: current.headerCellRender || headerCellRender
-    }
-    if (item.width) {
-      item.width = parseInt(item.width)
-    }
-    visibleFlatColumns.push(item)
-    colsMap[currentKey] = item
-  }
-  // 子级的折叠状态跟随父级的状态
-  collapsedMap_.forEach((value, key) => {
-    const { childKeys = [] } = colsMap[key] || {}
-    if (childKeys.length) {
-      childKeys.forEach((childKey) => {
-        if (!collapsedMap_.has(childKey)) {
-          collapsedMap_.set(childKey, value)
-        }
-      })
-    }
-  })
-  const collapsedMap = Object.fromEntries(collapsedMap_.entries())
-  return { visibleFlatColumns, collapsedMap }
-}
-
-export function logError(err, logConf = '') {
-  // eslint-disable-next-line
-  if (typeof console !== 'undefined') {
-    // eslint-disable-next-line
-    console.error('%c【KyeTable2】' + err, logConf)
-  } else {
-    throw err
-  }
-}
-
-// 列配置的显示与否根据祖先节点的状态来决定
-function validateColumnShow(acc, col) {
-  const { parentNodeKey } = col
-  const parentNode = acc[parentNodeKey]
-  return parentNode && parentNode.show === false ? false : col.show
-}
-
-function computedColumnsWidthInChildKeys(col, columnsKeyMap, collapsedMap) {
-  const { width, children = [], childKeys = [] } = col || {}
-  if (!children.length && width) {
-    return width
-  }
-  return childKeys.reduce((acc, childKey) => {
-    const { children = [], width, show } = columnsKeyMap[childKey] || {}
-    // 仅计算未被折叠的宽度和
-    if (!children.length && !collapsedMap[childKey] && show) {
-      acc += width
-    }
-    return acc
-  }, 0)
-}
-
-function createColumnsKeyMap(visibleFlatColumns = []) {
-  const columnKeyMap = visibleFlatColumns.reduce((acc, col) => {
-    const { key } = col
-    const show = validateColumnShow(acc, col)
-    acc[key] = {
-      ...col,
-      show,
-    }
-    return acc
-  }, {})
-  return columnKeyMap
-}
-
-export function createFlatColumns (params) {
-  const addFixedConfInColumns =
-  params.columns && params.columns.length > 0 ? createFixedColumnsOnLeft({ showIndex: params.showIndex }) : []
-  const { visibleFlatColumns, collapsedMap } = createVisibleFlatColumns({
-    ...params,
-    columns: [...addFixedConfInColumns, ...params.columns],
-  })
-  return {
-    visibleFlatColumns,
-    collapsedMap
-  }
-}
-
-// 根据筛选的列和 折叠选项生成 多表格列配置
-export function createColumns({visibleFlatColumns, collapsedMap = {}, rowKey, headerRowHeight, curMaxIndexVal}) {
-  const columnsKeyMap = createColumnsKeyMap(visibleFlatColumns)
-  const columnVisibleConfIter = (key) =>
-    columnsKeyMap[key].show !== false && !collapsedMap[key]
-  const fixedColumnsOnLeft = visibleFlatColumns.filter(
-    (column) =>
-      (column.fixed === 'left' || column.fixed === true) &&
-      columnVisibleConfIter(column.key)
-  )
-  const normalColumns = visibleFlatColumns.filter(
-    (column) => !column.fixed && columnVisibleConfIter(column.key)
-  )
-  if (curMaxIndexVal >= 10000) {
-    updateColumnsIndexWidth(fixedColumnsOnLeft, curMaxIndexVal)
-  }
-  const mainColumns = [...fixedColumnsOnLeft, ...normalColumns]
-  const maxLevel = creatMaxlevel(mainColumns)
-  // const headerTotalHeight = maxLevel * headerRowHeight
-
-  const collapseKeysMap = {}
-  function calculateOffsetXAndWidth(arr = [], iter) {
-    let offsetX = 0
-    return arr.map((col, index) => {
-      const width = computedColumnsWidthInChildKeys(
-        col,
-        columnsKeyMap,
-        collapsedMap
-      )
-      col.width = width
-      if (col.collapseKeys && col.collapseKeys.length) {
-        if (!collapseKeysMap[col.key]) {
-          collapseKeysMap[col.key] = col.collapseKeys
-        }
-      }
-      if (index > 0) {
-        const { width: preWidth, key: preKey } = mainColumns[index - 1]
-        offsetX += preWidth
-        // 如果上一次是父级，则减去父级的宽度。从父级的起始点开始
-        if (col.parentNodeKey === preKey) {
-          offsetX -= preWidth
-        }
-      }
-      col.offsetX = offsetX
-      const otherResult = iter(col, index) || {}
-      const levelNum =
-        col.level !== maxLevel && !col.children.length
-          ? Math.abs(col.level - maxLevel) + 1
-          : 1
-      const height = levelNum * headerRowHeight
-      const top = (col.level - 1) * headerRowHeight
-      return {
-        ...col,
-        originIndex: index,
-        ...otherResult,
-        height: height,
-        top,
-        [rowKey]: (col.fixed ? 'fixed_left_' : '') + col.key,
-      }
-    })
-  }
-  const _mainColumns = calculateOffsetXAndWidth(mainColumns, function (col) {
-    const { key } = col
-    const fixedLeftKeys = ['_index', '_selection'].indexOf(key) > -1
-    return {
-      headerCellRender: fixedLeftKeys ? null : col.headerCellRender,
-      rowCellRender: fixedLeftKeys ? null : col.rowCellRender,
-    }
-  })
-  // function setPlaceholderSign() {
-  //   return {
-  //     placeholderSign: false,
-  //   }
-  // }
-  // const _fixedColumnsOnLeft = calculateOffsetXAndWidth(
-  //   fixedColumnsOnLeft.length
-  //     ? mainColumns.slice(0, fixedColumnsOnLeft.length)
-  //     : [],
-  //   setPlaceholderSign
-  // )
-  return {
-    columns: _mainColumns,
-    // fixedColumnsOnLeft: _fixedColumnsOnLeft,
-    maxLevel,
-    collapseKeysMap
-  }
-}
-
-export function creatMaxlevel(columns) {
-  const levelIter = (col) => col.level
-  const maxLevel = columns.length ? Math.max(...columns.map(levelIter)) : 1
-  return maxLevel
-}
-
-export function createRenderColumnOption({
-  mainColumns,
-  maxLevel,
-  headerRowHeight,
-}) {
-  const {
-    tableWidth,
-    // renderRowColumns,
-    renderCellsColumns,
-    renderCellsColumnsWidths,
-  } = mainColumns.reduce(
-    (obj, col) => {
-      if (col.level === 1) {
-        obj.tableWidth += col.width
-        // obj.renderRowColumns.push(col)
-      }
-      if (!(col.children && col.children.length)) {
-        const levelNum =
-          col.level !== maxLevel ? Math.abs(col.level - maxLevel) + 1 : 1
-        col.headerRowHeight = levelNum * headerRowHeight
-        obj.renderCellsColumns.push(col)
-        obj.renderCellsColumnsWidths.push(col.width)
-      }
-      return obj
-    },
-    {
-      tableWidth: 0,
-      // renderRowColumns: [],
-      renderCellsColumns: [],
-      renderCellsColumnsWidths: [],
-    }
-  )
-  return {
-    tableWidth,
-    // renderRowColumns,
-    renderCellsColumns,
-    renderCellsColumnsWidths,
-  }
-}

package/components/pe-table/utils/data.js

@@ -1,12 +0,0 @@
-export function createTableData ({data, columns, rowKey}, indexFormat) {
-  return (data || []).reduce((acc, rowData, index) => {
-    const _rowData = columns.reduce((row, col) => {
-      row[col.key] = rowData[col.key]
-      return row
-    }, {})
-    _rowData[rowKey] = rowData[rowKey] || '_inner_id' + index
-    _rowData['$index'] = indexFormat ? indexFormat(index+1,_rowData, rowData): index+1
-    acc.push(_rowData)
-    return acc
-  }, [])
-}

package/components/pe-table/utils/fixed.js

@@ -1,69 +0,0 @@
-const COLUMNS_INDEX = {
-  label: '序号',
-  key: '$index',
-  sortable: false,
-  // resizable: true,
-  width: 40,
-  // isInternal: true,
-  align: 'left',
-  showPopover: false,
-  // _internal: true,
-  // headerCellRender: function (h, { column }) {
-  //   // const classes = getCustomHeaderCellAlignClass(column)
-  //   const classes = []
-  //   return <div class={classes}>{column.label || '#'}</div>
-  // },
-  // rowCellRender: function (h, { rowData }) {
-  //   const index = _index
-  //   let i = typeof index === 'number' ? index : index
-  //   if (isNaN(i)) {
-  //     i = ''
-  //   }
-  //   // const classes = getCustomRowCellAlignClass(column)
-  //   const classes = []
-  //   return <div class={classes}>{i}</div>
-  // }
-}
-
-// 生成索引和复选框的列配置
-export function createFixedColumnsOnLeft({
-  showIndex, // 是否添加索引列
-  // showSelection,
-  // showRadio
-}) {
-  const fixedColumnsOnLeft = []
-  const obj = {
-    level: 1,
-    show: true,
-    fixed: 'left',
-    // resizable: false
-  }
-  if (showIndex) {
-    fixedColumnsOnLeft.unshift({
-      ...COLUMNS_INDEX,
-      ...obj,
-    })
-  }
-  // if (showSelection) {
-  //   fixedColumnsOnLeft.unshift({
-  //     ...COLUMNS_SELECTION,
-  //     ...obj
-  //   })
-  // }
-  // if (showRadio) {
-  //   fixedColumnsOnLeft.unshift({
-  //     ...COLUMNS_RADIO,
-  //     ...obj
-  //   })
-  // }
-  return fixedColumnsOnLeft
-}
-
-export function updateColumnsIndexWidth(fixedColumnsOnLeft = [], tableDataLength) {
-  const showIndexColumn = fixedColumnsOnLeft.find(item => item.key === COLUMNS_INDEX.key)
-  let indexCol = String(tableDataLength).length * 10
-  const width = indexCol < COLUMNS_INDEX.width ? COLUMNS_INDEX.width : indexCol
-  if (showIndexColumn && width > COLUMNS_INDEX.width && width !== showIndexColumn.width) {
-    showIndexColumn.width = width
-  }
-}

package/components/pe-table/utils/formatter.js

@@ -1,327 +0,0 @@
-import dayJs from 'dayjs'
-export const isEmpty = val => val === '' || val === null || val === undefined
-
-export const date = (date, fmt = 'YYYY-MM-DD') => {
-  let str = date || ''
-  if (typeof str === 'string' && str && (str.includes('**') || str.includes('✽✽'))) {
-    return str
-  }
-  return str ? dayJs(str).format(fmt) : str
-}
-
-export const time = (d, fmt = 'YYYY-MM-DD HH:mm:ss') => {
-  return date(d, fmt)
-}
-
-export const minute = (d, fmt = 'YYYY-MM-DD HH:mm') => {
-  return date(d, fmt)
-}
-
-export const second = (d, fmt = 'HH:mm:ss') => {
-  return date(d, fmt)
-}
-
-export const month = (d, fmt = 'YYYY-MM') => {
-  return date(d, fmt)
-}
-
-export const money = (num, prev = '¥ ', fixed = 2) => {
-  if (typeof num !== 'number' && !num) {
-    return ''
-  }
-  if (typeof num === 'string' && (num.includes('**') || num.includes('✽✽'))) {
-    return num
-  }
-  prev = prev === null ? '¥ ' : prev
-  return `${prev}${(+num).toFixed(fixed).replace(/\B(?=(\d{3})+(?!\d))/g, ',')}`
-}
-
-export const decimal = (num, precision = 2) => {
-  if (typeof num !== 'number' && !num) {
-    return ''
-  }
-  if (typeof num === 'string' && (num.includes('**') || num.includes('✽✽'))) {
-    return num
-  }
-  return `${(+num).toFixed(precision).replace(/\d{1,3}(?=(\d{3})+(\.\d*)?$)/g, '$&,')}`
-}
-
-export const thousands = num => {
-  if (typeof num !== 'number' && !num) {
-    return ''
-  }
-  if (typeof num === 'string' && (num.includes('**') || num.includes('✽✽'))) {
-    return num
-  }
-  return (+num).toLocaleString()
-}
-
-// 后端时间导出自定义类型
-export const customDateTime = (d, fmt = 'YYYY-MM-DD') => {
-  return date(d, fmt)
-}
-
-/**
- * 9级组织过滤器
- * @param val   投资集团/快递事业部/京津冀大区/取派中心/北京分区/顺义区/顺义取派部/东城片区/顺义八里庄点部@顺义取派部@顺义八里庄点部
- * @param dept  Array：9级组织 | 1：部门 | 2：点部
- * @param split 组织、部门、点部 的分隔符，默认为“@”
- * @returns {string} 根据用户保存的点部配置，解析出对应的部门数据
- */
-export const deptFilter = (val, dept, split = '@') => {
-  let index = val && val.indexOf(split)
-  if (!index || index === -1) {
-    return val
-  }
-  if (Array.isArray(dept)) {
-    let arr = val.substring(0, index).split('/')
-    let len = Math.min(arr.length, dept.length)
-    let str = ''
-    for (let i = 0; i < len; i++) {
-      let s = arr[dept[i] - 1]
-      if (s) {
-        str = `${str}/${s}`
-      }
-    }
-    return str ? str.replace(/^\//, '') : val
-  } else if (dept === 1) {
-    return val.substring(index + 1, val.lastIndexOf(split))
-  } else if (dept === 2) {
-    return val.substring(val.lastIndexOf(split) + 1)
-  } else {
-    return val
-  }
-}
-
-// 234333.22 => 23万 4333 234.22 => 234.22 支持金额切换
-export const numberSplit = (val, globalMoneyFormat = true) => {
-  // 防止空字符返回为0
-  if (val === '') return val
-  if (globalMoneyFormat) {
-    return money(val)
-  }
-  let toNumberVal = Number(val)
-  if (isNaN(toNumberVal)) {
-    return val
-  }
-  let flag = ''
-  if (toNumberVal < 0) {
-    flag = '-'
-    toNumberVal = Math.abs(toNumberVal)
-  }
-  if (toNumberVal >= 10000) {
-    // 大于等于10000的数据要去掉小数位
-    const numStr = Math.floor(toNumberVal) + ''
-    const len = numStr.length
-    const numArr = []
-    // 每4位截取一次，截取小于10000部分的数据
-    let itemLast = Number(numStr.substring(len - 4, len))
-    // 只有个位数前面要加0 等于0则去掉，不加入数组拼接
-    if (itemLast < 10 && itemLast > 0) {
-      numArr.unshift('0' + itemLast)
-    } else if (itemLast >= 10) {
-      numArr.unshift(itemLast)
-    }
-    let itemCenter = 0
-    let itemFirst = 0
-    if (len <= 8) {
-      // 长度小于等于8， 没有亿位，这个时候万位可以从index = 0 开始截取
-      itemCenter = Number(numStr.substring(0, len - 4))
-    } else {
-      // 长度大于8才有亿， 万位不能再从index = 0开始截取
-      itemCenter = Number(numStr.substring(len - 8, len - 4))
-      itemFirst = Number(numStr.substring(0, len - 8))
-    }
-    // 万位和亿位如果大于0才加入数组拼接
-    if (itemCenter > 0) numArr.unshift(itemCenter + '万')
-    if (itemFirst > 0) numArr.unshift(itemFirst + '亿')
-    return flag + numArr.join('')
-  }
-  return flag + toNumberVal
-}
-
-// 234333.22 => 23万4333 234.22 => 234.22 不支持金额切换
-export const numberSplitInt = val => {
-  // 防止空字符返回为0
-  if (val === '') return val
-  let toNumberVal = Number(val)
-  if (isNaN(toNumberVal)) {
-    return val
-  }
-  let flag = ''
-  if (toNumberVal < 0) {
-    flag = '-'
-    toNumberVal = Math.abs(toNumberVal)
-  }
-  if (toNumberVal >= 10000) {
-    // 大于等于10000的数据要去掉小数位
-    const numStr = Math.floor(toNumberVal) + ''
-    const len = numStr.length
-    const numArr = []
-    // 每4位截取一次，截取小于10000部分的数据
-    let itemLast = Number(numStr.substring(len - 4, len))
-    // 只有个位数前面要加0 等于0则去掉，不加入数组拼接
-    if (itemLast < 10 && itemLast > 0) {
-      numArr.unshift('0' + itemLast)
-    } else if (itemLast >= 10) {
-      numArr.unshift(itemLast)
-    }
-    let itemCenter = 0
-    let itemFirst = 0
-    if (len <= 8) {
-      // 长度小于等于8， 没有亿位，这个时候万位可以从index = 0 开始截取
-      itemCenter = Number(numStr.substring(0, len - 4))
-    } else {
-      // 长度大于8才有亿， 万位不能再从index = 0开始截取
-      itemCenter = Number(numStr.substring(len - 8, len - 4))
-      itemFirst = Number(numStr.substring(0, len - 8))
-    }
-    // 万位和亿位如果大于0才加入数组拼接
-    if (itemCenter > 0) numArr.unshift(itemCenter + '万')
-    if (itemFirst > 0) numArr.unshift(itemFirst + '亿')
-    return flag + numArr.join('')
-  }
-  return flag + toNumberVal
-}
-
-// 234333.22 => 23万4333.22 234.22 => 234.22
-export const numberSplitFloat = (val, decimal, globalMoneyFormat = false) => {
-  // 防止空字符返回为0
-  if (val === '') return val
-  if (globalMoneyFormat) {
-    return money(val)
-  }
-  return filterNumber(val, decimal)
-}
-
-const filterNumber = (val, decimal) => {
-  if (decimal < 0 || !Number.isInteger(decimal)) decimal = void 0
-  let toNumberVal = Number(val)
-  if (isNaN(toNumberVal)) {
-    return val
-  }
-  let flag = ''
-  if (toNumberVal < 0) {
-    flag = '-'
-    toNumberVal = Math.abs(toNumberVal)
-  }
-  const numStrArr = String(toNumberVal).split('.')
-  const numStr = numStrArr[0]
-  const _decimal = decimal == 0 ? '' : decimal || (numStrArr[1] && numStrArr[1].length) || ''
-  const decimalNum = numStrArr[1] && _decimal ? `.${numStrArr[1].substring(0, _decimal)}` : ''
-  if (toNumberVal >= 10000) {
-    const len = numStr.length
-    const numArr = []
-    // 每4位截取一次，截取小于10000部分的数据
-    let itemLast = Number(numStr.substring(len - 4, len))
-    // 只有个位数前面要加0 等于0则去掉，不加入数组拼接
-    if (itemLast < 10 && itemLast > 0) {
-      numArr.unshift('0' + itemLast)
-    } else if (itemLast >= 10) {
-      numArr.unshift(itemLast)
-    }
-    let itemCenter = 0
-    let itemFirst = 0
-    // let itemBillion = 0
-    // 处理万亿（兆）级别
-    if (len >= 13) {
-      const billion = 1e12 // 1万亿
-      let billionValue = String(numStr / billion)
-      const dotIndex = billionValue.indexOf('.')
-      if (dotIndex !== -1) {
-        billionValue = billionValue.slice(0, dotIndex + 5) // dotIndex + 5 保留四位小数
-      }
-      // 长度大于等于13 万亿（兆）级别
-      // itemBillion = Number(numStr.substring(0, len - 12)) // 万亿（兆）部分
-      // itemFirst = Number(numStr.substring(len - 12, len - 10)) // 亿部分
-      // itemCenter = Number(numStr.substring(len - 8, len - 4)) // 万部分
-      // return `${itemBillion}${itemFirst ? '.' + itemFirst : ''}万亿`
-      return `${billionValue}万亿`
-    } else if (len >= 9) {
-      // 长度大于8才有亿， 万位不能再从index = 0开始截取
-      itemCenter = Number(numStr.substring(len - 8, len - 4))
-      itemFirst = Number(numStr.substring(0, len - 8))
-    } else {
-      // 长度小于9，只有万以下的数值
-      itemCenter = Number(numStr.substring(0, len - 4)) // 万部分
-    }
-
-    if (itemCenter > 0) numArr.unshift(itemCenter + '万')
-    if (itemFirst > 0) numArr.unshift(itemFirst + '亿')
-    // if (itemBillion > 0) numArr.unshift(itemBillion + '万亿')
-    return flag + numArr.join('') + decimalNum
-  }
-  return flag + Math.floor(toNumberVal) + decimalNum
-}
-
-// 234333.22 => 23万4333.22 234.22 => 234.22 , null => '-'
-export const formatMoneyByNumber = (val, decimal = 2) => {
-  // 金融板块 金额为空时 需要返回 返回‘-’, 且默认2为小数, 默认带前缀 ¥
-  if (isEmpty(val)) return '-'
-  const num = filterNumber(val, decimal)
-  return num.includes('*') || num.includes('✽') ? num : `¥ ${num}`
-}
-
-
-function getFormatter(col = {}, filter) {
-  if (!filter) {
-    return null
-  }
-  // 过滤器
-  if (col.filter) {
-    if (col.filter.type && col.filter.args) {
-      let func = filter[col.filter.type]
-      if (func) {
-        return (row, column, val) => func(val, ...col.filter.args)
-      }
-    } else {
-      // 不显示秒，minute 替换 time
-      // if (col.filter === 'time') {
-      //   col.filter = 'minute'
-      // }
-      let func = filter[col.filter]
-      if (func) {
-        // 9级组织
-        if (col.filter === 'deptFilter') {
-          return (row, column, val) => func(val, column.dept)
-        } else {
-          return (row, column, val) => func(val)
-        }
-      }
-    }
-  }
-  return null
-}
-
-const filter = {
-  date,
-  time,
-  minute,
-  second,
-  month,
-  money,
-  decimal,
-  thousands,
-  customDateTime,
-  deptFilter,
-  numberSplit,
-  numberSplitInt,
-  numberSplitFloat,
-  formatMoneyByNumber,
-}
-
-export const tableCellFormatterResult = ({ column = {}, rowData, rowIndex, columnIndex, displayText }) => {
-  try {
-    const formatter = getFormatter(column, filter)
-    if (formatter) {
-      displayText = formatter(rowData, column, displayText)
-    }
-    if (column.formatter && typeof column.formatter === 'function') {
-      displayText = column.formatter(rowData, column, displayText, rowIndex, columnIndex)
-    }
-    return displayText
-  } catch (error) {
-    console.error(error)
-    return displayText
-  }
-}