xdesign-vue-next/es/table/hooks/useRowExpand.mjs.map

XDesign Component for vue-next

{"version":3,"file":"useRowExpand.mjs","sources":["../../../src/table/hooks/useRowExpand.tsx"],"sourcesContent":["import { computed, SetupContext, toRefs, h } from 'vue';\nimport get from 'lodash/get';\n\nimport {\n  TdPrimaryTableProps,\n  PrimaryTableCol,\n  TableRowData,\n  PrimaryTableCellParams,\n  TableExpandedRowParams,\n  RowEventContext,\n} from '../type';\nimport useClassName from './useClassName';\nimport { useTNodeJSX } from '../../hooks/tnode';\nimport useDefaultValue from '../../hooks/useDefaultValue';\nimport { useConfig } from '../../hooks/useConfig';\n\nexport default function useRowExpand(props: TdPrimaryTableProps, context: SetupContext) {\n  const { expandedRowKeys } = toRefs(props);\n  const renderTNode = useTNodeJSX();\n  const { t, globalConfig } = useConfig('table');\n  const { tableExpandClasses, positiveRotate90, tableFullRowClasses } = useClassName();\n  // controlled and uncontrolled\n  const [tExpandedRowKeys, setTExpandedRowKeys] = useDefaultValue(\n    expandedRowKeys,\n    props.defaultExpandedRowKeys || [],\n    props.onExpandChange,\n    'expandedRowKeys',\n  );\n\n  const showExpandedRow = computed(() =>\n    Boolean(props.expandedRow || context.slots.expandedRow || context.slots['expanded-row']),\n  );\n\n  const showExpandIconColumn = computed(() => props.expandIcon !== false && showExpandedRow.value);\n\n  const isFirstColumnFixed = computed(() => props.columns?.[0]?.fixed === 'left');\n\n  const onToggleExpand = (e: MouseEvent, row: TableRowData) => {\n    props.expandOnRowClick && e.stopPropagation();\n    const currentId = get(row, props.rowKey || 'id');\n    const index = tExpandedRowKeys.value.indexOf(currentId);\n    const newKeys = [...tExpandedRowKeys.value];\n    index !== -1 ? newKeys.splice(index, 1) : newKeys.push(currentId);\n    setTExpandedRowKeys(newKeys, {\n      expandedRowData: props.data.filter((t) => newKeys.includes(get(t, props.rowKey || 'id'))),\n      currentRowData: row,\n    });\n  };\n\n  const renderExpandIcon = (_: typeof h, p: PrimaryTableCellParams<TableRowData>) => {\n    const { row, rowIndex } = p;\n    const currentId = get(row, props.rowKey || 'id');\n    const expanded = tExpandedRowKeys.value.includes(currentId);\n    const icon = renderTNode('expandIcon', {\n      defaultNode: t(globalConfig.value.expandIcon) || <icon-ri-arrow-right-circle-line />,\n      params: { row, index: rowIndex },\n    });\n    if (!icon) return null;\n    const classes = [\n      tableExpandClasses.iconBox,\n      tableExpandClasses[expanded ? 'expanded' : 'collapsed'],\n      { [positiveRotate90]: expanded },\n    ];\n    return (\n      <span class={classes} onClick={(e: MouseEvent) => onToggleExpand(e, row)}>\n        {icon}\n      </span>\n    );\n  };\n\n  const getExpandColumn = () => {\n    const expandCol: PrimaryTableCol<TableRowData> = {\n      colKey: '__EXPAND_ROW_ICON_COLUMN__',\n      width: 46,\n      className: tableExpandClasses.iconCell,\n      fixed: isFirstColumnFixed.value ? 'left' : undefined,\n      cell: renderExpandIcon,\n      stopPropagation: true,\n    };\n    return expandCol;\n  };\n\n  const renderExpandedRow = (\n    p: TableExpandedRowParams<TableRowData> & { tableWidth: number; isWidthOverflow: boolean },\n  ) => {\n    const rowId = get(p.row, props.rowKey || 'id');\n    if (!tExpandedRowKeys.value || !tExpandedRowKeys.value.includes(rowId)) return null;\n    const isFixedLeft = p.isWidthOverflow && props.columns.find((item) => item.fixed === 'left');\n    return (\n      <tr key={`expand_${rowId}`} class={[tableExpandClasses.row, { [tableFullRowClasses.base]: isFixedLeft }]}>\n        <td colspan={p.columns.length}>\n          <div\n            class={[tableExpandClasses.rowInner, { [tableFullRowClasses.innerFullRow]: isFixedLeft }]}\n            style={isFixedLeft ? { width: `${p.tableWidth}px` } : {}}\n          >\n            <div class={tableFullRowClasses.innerFullElement}>{renderTNode('expandedRow', { params: p })}</div>\n          </div>\n        </td>\n      </tr>\n    );\n  };\n\n  const onInnerExpandRowClick = (p: RowEventContext<TableRowData>) => {\n    onToggleExpand(p.e, p.row);\n  };\n\n  return {\n    showExpandedRow,\n    showExpandIconColumn,\n    getExpandColumn,\n    renderExpandedRow,\n    onInnerExpandRowClick,\n  };\n}\n"],"names":["tExpandedRowKeys","setTExpandedRowKeys","props","index","get","currentRowData","defaultNode","_resolveComponent","params","row","_createVNode","colKey","width","cell","stopPropagation","showExpandedRow","showExpandIconColumn","getExpandColumn","renderExpandedRow","onInnerExpandRowClick"],"mappings":"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"}