2023-01-05

king

2023-01-05 876a5e6657d67df66bb525d02dd6d147ba81cae5

 src/tabviews/custom/components/chart/antv-G6/index.jsx

@@ -60,29 +60,7 @@
  },
  'single-node',
)
G6.registerNode(
  'dice-mind-map-sub', {
    jsx: (cfg) => {
      const width = Util.getTextSize(cfg.label, 14)[0] + 24

      return `
        <group>
          <rect style={{width: ${width}, height: 22, cursor: pointer}}>
            <text style={{ fontSize: 14, fill: ${cfg.selected ? systemColor : '#000000'}, marginLeft: 12, marginTop: 6, cursor: pointer }}>${cfg.label}</text>
          </rect>
          <rect style={{ fill: ${cfg.color}, width: ${width}, height: 2, x: 0, y: 22, cursor: pointer }} />
        </group>
      `
    },
    getAnchorPoints() {
      return [
        [0, 0.965],
        [1, 0.965]
      ]
    }
  },
  'single-node',
)
G6.registerNode(
  'dice-mind-map-leaf', {
    jsx: (cfg) => {
@@ -139,38 +117,6 @@
    ev.preventDefault()
  }
})

const dataMapTransform = (data) => {
  const changeData = (d, level = 0, color) => {
    const data = { ...d }

    switch (level) {
      case 0:
        data.type = 'dice-mind-map-root'
        break
      case 1:
        data.type = 'dice-mind-map-sub'
        break
      default:
        data.type = 'dice-mind-map-leaf'
        break
    }

    if (color) {
      data.color = color
    }

    if (level === 1 && !d.direction) {
      data.direction = 'right'
    }

    if (d.children) {
      data.children = d.children.map((child) => changeData(child, level + 1, data.color))
    }
    return data
  }
  return changeData(data)
}

// 缩进文件树
G6.registerNode('indentedRoot', {
@@ -1223,6 +1169,8 @@
    root.children = root.children || []

    if (plot.subtype === 'mindmap') {
      root.type = 'dice-mind-map-root'

      if (plot.dirField) {
        root.children = root.children.map(item => {
          item.direction = item[plot.dirField] === plot.dirSign ? 'left' : 'right'
@@ -1235,9 +1183,24 @@
        if (item.direction === 'left') {
          item.color = plot.leftColor || '#26C281'
        } else {
          item.direction = 'right'
          item.color = plot.nodeColor || '#1890ff'
        }
      })

      const collapse = (item) => {
        if (!item.children) return

        item.children.forEach(cell => {
          cell.collapsed = plot.collapsed === 'true'
          cell.direction = cell.direction || 'right'
          cell.type = 'dice-mind-map-leaf'
          cell.color = cell.color || item.color
          collapse(cell)
        })
      }

      collapse(root)
    } else if (plot.subtype === 'indentTree') {
      root.isRoot = true
      root.collapsed = false
@@ -1368,6 +1331,10 @@
    graph.data(data)
    graph.render()
    graph.fitView()

    if (plot.collapsed === 'true') {
      graph.zoomTo(1, { x: 0, y: plot.height / 2 })
    }
  }

  indentrender = () => {
@@ -1437,10 +1404,16 @@
  ponitrender = () => {
    const { config, plot, chartId } = this.state
    const data = this.getdata()
    const width = this.wrap.scrollWidth - 30
    let modes = ['drag-canvas', 'zoom-canvas', config.uuid]

    if (plot.collapsed === 'true') {
      modes = [{ type: 'collapse-expand' }, 'drag-canvas', 'zoom-canvas', config.uuid]
    }

    const tree = new G6.TreeGraph({
      container: chartId,
      width: this.wrap.scrollWidth - 30,
      width: width,
      height: plot.height,
      fitView: true,
      layout: {
@@ -1472,13 +1445,19 @@
      },
      minZoom: 0.5,
      modes: {
        default: ['drag-canvas', 'zoom-canvas', config.uuid]
        default: modes
      }
    })

    tree.data(dataMapTransform(data))
    tree.data(data)

    tree.render()

    if (plot.collapsed === 'true' && plot.dirField) {
      tree.zoomTo(1, { x: width / 2, y: plot.height / 2 })
    } else if (plot.collapsed === 'true') {
      tree.zoomTo(1, { x: 0, y: plot.height / 2 })
    }
  }

  handleClick = (data = null) => {