222

schangxiang@126.com

2025-04-30 9bec4dcae002f36aa23231da11cb03a156b40110

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
import { defineComponent, PropType, Ref } from 'vue'
import { ColumnType, ScopeType, TablePropsItemType } from './BaseTable.d'
import styles from './BaseTable.module.scss'
import { isFunction, isNil } from 'lodash'
import AutoTooltip from './AutoTooltip'
 
export const ColumnSlots: (
  props: TablePropsItemType,
  columns: Ref<ColumnType[]>
) => Record<string, Function> = (props, columns: Ref<ColumnType[]>) => {
  const slots: Record<string, Function> = {}
  const columnsData = columns.value.filter((column) => column.field !== 'seq')
  const getCellStyle = (data: ScopeType) =>
    isFunction(props.cellStyle)
      ? props.cellStyle({ ...data, row: data.record })
      : {}
 
  const RenderSlot = ({ column, record, rowIndex }: ScopeType) => {
    const cellStyle = getCellStyle({ column, record, rowIndex })
    const text = isNil(record[column.field]) ? '-' : record[column.field]
    const render = column.customRender ? column.customRender : () => <AutoTooltip text={text as string}/>
 
    return (
      <div class={styles.bodyCell} style={cellStyle}>
        {render({ column, record, rowIndex })}
      </div>
    )
  }
  /**
   * 自定义列
   */
  columnsData.map((column) => {
    slots[column.field] = RenderSlot
    // if (isFunction(column.customRender)) {
 
    //   // slots[column.field] = ({ column, record, rowIndex }: ScopeType) => {
    //   //   const cellStyle = getCellStyle({ column, record, rowIndex })
    //   //   return (
    //   //     <div class={styles.bodyCell} style={cellStyle}>
    //   //       {render({ column, record, rowIndex })}
    //   //     </div>
    //   //   )
    //   // }
    //   delete column.customRender
    // } else {
    //   slots[column.field] = ({ column, record, rowIndex }: ScopeType) => {
    //     const cellStyle = getCellStyle({ column, record, rowIndex })
 
    //     return (
    //       <div class={styles.bodyCell} style={cellStyle}>
    //         {isNil(record[column.field]) ? '-' : record[column.field]}
    //       </div>
    //     )
    //   }
    // }
  })
  return slots
}