初始化

刘光辉

7 小时以前 0dfe84494048ce27ba8449831782128412d3eb13

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
const INPUT_TABLE_INTERACTIVE_SELECTOR = ['[data-input-table-interactive]', '.ant-table-selection-column', 'a', 'button'].join(',');
 
interface InputTableCellControlProps {
  detailed?: boolean;
  disabled?: boolean;
  disabledButClickable?: boolean;
  readonly?: boolean;
}
 
interface InputTableSelection<TRow, TKey> {
  selectedRowKeys: TKey[];
  selectedRows: TRow[];
}
 
interface InputTableRowClickContext<TRow, TKey> {
  getRowKey: (row: TRow) => null | TKey | undefined;
  getSelectedRowKeys: () => readonly TKey[];
  getSelectedRows: () => readonly TRow[];
  isEnabled: () => boolean;
  isRowReadonly: (row: TRow) => boolean;
  updateSelection: (selection: InputTableSelection<TRow, TKey>) => void;
}
 
interface InputTableRowClickEvent {
  target: EventTarget | null;
}
 
export function isInputTableInteractiveTarget(target: EventTarget | null) {
  if (!target || typeof (target as Element).closest !== 'function') return false;
  return !!(target as Element).closest(INPUT_TABLE_INTERACTIVE_SELECTOR);
}
 
export function isInputTableCellEditable(controlProps: InputTableCellControlProps) {
  return !controlProps.disabled && !controlProps.readonly && !controlProps.detailed;
}
 
export function getInputTableCellInteractionAttrs(controlProps: InputTableCellControlProps) {
  if (controlProps.disabledButClickable || isInputTableCellEditable(controlProps)) return { 'data-input-table-interactive': '' };
  if (controlProps.disabled) return { 'data-input-table-click-through': '' };
  return {};
}
 
export function toggleInputTableRowSelection<TRow, TKey>(
  selectedRowKeys: readonly TKey[],
  selectedRows: readonly TRow[],
  clickedRow: TRow,
  getRowKey: (row: TRow) => TKey,
): InputTableSelection<TRow, TKey> {
  const clickedRowKey = getRowKey(clickedRow);
  if (selectedRowKeys.includes(clickedRowKey)) {
    return {
      selectedRowKeys: selectedRowKeys.filter((key) => key !== clickedRowKey),
      selectedRows: selectedRows.filter((row) => getRowKey(row) !== clickedRowKey),
    };
  }
  return {
    selectedRowKeys: [...selectedRowKeys, clickedRowKey],
    selectedRows: [...selectedRows.filter((row) => getRowKey(row) !== clickedRowKey), clickedRow],
  };
}
 
export function createInputTableRowClickHandler<TRow, TKey>(context: InputTableRowClickContext<TRow, TKey>) {
  return (clickedRow: TRow) => ({
    onClick: (event: InputTableRowClickEvent) => {
      if (!context.isEnabled() || isInputTableInteractiveTarget(event.target)) return;
      const clickedRowKey = context.getRowKey(clickedRow);
      if (clickedRowKey === undefined || clickedRowKey === null || context.isRowReadonly(clickedRow)) return;
 
      const selection = toggleInputTableRowSelection(
        context.getSelectedRowKeys(),
        context.getSelectedRows(),
        clickedRow,
        (row) => context.getRowKey(row) as TKey,
      );
      context.updateSelection(selection);
    },
  });
}