0
点赞
收藏
分享

微信扫一扫

获取tree跨行跨列

梯梯笔记 2023-04-01 阅读 73

 

 

获取tree跨行跨列

function getColspan (column) {
  let colspan = 0
  const children = column.children || []
  for (let i = 0; i < children.length; i++) {
    const item = children[i]
    if (item.children && item.children.length > 0) {
      colspan += getColspan(item)
    } else {
      colspan += 1
    }
  }
  if (colspan == 0) {
    colspan = 1
  }
  return colspan
}

// 获取跨列
function getRowspan (column, maxLevel) {
  let rowspan = 1
  if (!column.children || column.children.length == 0) {
    rowspan = maxLevel - column.level + 1
  }
  return rowspan
}

function getMaxFloor (columns) {
  let max = 0
  const deepEach = function (column, floor) {
    if (floor > max) {
      max = floor
    }
    const children = column.children
    if (children && children.length) {
      children.forEach(child => {
        deepEach(child, floor + 1)
      })
    }
  }

  columns.forEach(column => {
    deepEach(column, 0)
  })

  return max
}

const colmuns = [
  {
    label: '测试L1',
    prop: '测试L1',
    width: 200,
    align: 'left',
    showOverflowTooltip: true
  },
  {
    label: '测试L2',
    prop: '测试L2',
    width: 200,
    align: 'left',
    showOverflowTooltip: true
  },
  {
    label: '测试L3',
    prop: 'cod',
    align: 'center',
    children: [
      {
        label: '测试L3-2-1',
        prop: '测试L3-2',
        width: 150,
        align: 'center',
        children: [
          {
            label: '测试L3-2-1',
            prop: '测试L3-2',
            width: 150,
            align: 'center'
          },
          {
            label: '测试L3-2-2',
            prop: '测试L3-2-2',
            width: 150,
            align: 'center'
          }
        ]
      },
      {
        label: '测试L3-2-2',
        prop: '测试L3-2-2',
        width: 150,
        align: 'center',
        children: [
          {
            label: '测试L3-2-1',
            prop: '测试L3-2',
            width: 150,
            align: 'center'
          },
          {
            label: '测试L3-2-2',
            prop: '测试L3-2-2',
            width: 150,
            align: 'center'
          },
          {
            label: '测试L3-2-2',
            prop: '测试L3-2-2',
            width: 150,
            align: 'center',
            children: [

              {
                label: '测试L3-2-2',
                prop: '测试L3-2-2',
                width: 150,
                align: 'center'
              }
            ]
          }
        ]
      }
    ]
  },
  {
    label: '测试L4',
    prop: '测试L4',
    align: 'center',
    children: [
      {
        label: '测试L4-1',
        prop: '测试L4-1',
        width: 150,
        align: 'center',
        children: [
          {
            label: '测试L4-1-1',
            prop: '测试L4-1-1',
            width: 150,
            align: 'center',
            children: [
              {
                label: '测试L4-1-1-1',
                prop: '测试L4-1-1-1',
                width: 150,
                align: 'center',
                children: [

                  {
                    label: '测试L3-2-2',
                    prop: '测试L3-2-2',
                    width: 150,
                    align: 'center'
                  }
                ]
              }
            ]
          }
        ]
      }

    ]
  }
]

const maxLevel = getMaxFloor(colmuns)

 

举报

相关推荐

0 条评论