84136081fb9006b8fef23e883a19c0ac480b14373b0280f72bc1f317bbc865dd8f68e5e58e1f89dec999237b96a2c13775504b10d57c3dc66d90c7b14e498c 2.7 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101
  1. import ElCheckbox from 'element-ui/packages/checkbox';
  2. export default {
  3. name: 'ElTableRow',
  4. props: [
  5. 'columns',
  6. 'row',
  7. 'index',
  8. 'isSelected',
  9. 'isExpanded',
  10. 'store',
  11. 'context',
  12. 'firstDefaultColumnIndex',
  13. 'treeRowData',
  14. 'treeIndent',
  15. 'columnsHidden',
  16. 'getSpan',
  17. 'getColspanRealWidth',
  18. 'getCellStyle',
  19. 'getCellClass',
  20. 'handleCellMouseLeave',
  21. 'handleCellMouseEnter',
  22. 'fixed'
  23. ],
  24. components: {
  25. ElCheckbox
  26. },
  27. render() {
  28. const {
  29. columns,
  30. row,
  31. index: $index,
  32. store,
  33. context,
  34. firstDefaultColumnIndex,
  35. treeRowData,
  36. treeIndent,
  37. columnsHidden = [],
  38. isSelected,
  39. isExpanded
  40. } = this;
  41. return (
  42. <tr>
  43. {
  44. columns.map((column, cellIndex) => {
  45. const { rowspan, colspan } = this.getSpan(row, column, $index, cellIndex);
  46. if (!rowspan || !colspan) {
  47. return null;
  48. }
  49. const columnData = { ...column };
  50. columnData.realWidth = this.getColspanRealWidth(columns, colspan, cellIndex);
  51. const data = {
  52. store,
  53. isSelected,
  54. isExpanded,
  55. _self: context,
  56. column: columnData,
  57. row,
  58. $index
  59. };
  60. if (cellIndex === firstDefaultColumnIndex && treeRowData) {
  61. data.treeNode = {
  62. indent: treeRowData.level * treeIndent,
  63. level: treeRowData.level
  64. };
  65. if (typeof treeRowData.expanded === 'boolean') {
  66. data.treeNode.expanded = treeRowData.expanded;
  67. // 表明是懒加载
  68. if ('loading' in treeRowData) {
  69. data.treeNode.loading = treeRowData.loading;
  70. }
  71. if ('noLazyChildren' in treeRowData) {
  72. data.treeNode.noLazyChildren = treeRowData.noLazyChildren;
  73. }
  74. }
  75. }
  76. return (
  77. <td
  78. style={this.getCellStyle($index, cellIndex, row, column)}
  79. class={this.getCellClass($index, cellIndex, row, column)}
  80. rowspan={rowspan}
  81. colspan={colspan}
  82. on-mouseenter={($event) => this.handleCellMouseEnter($event, row)}
  83. on-mouseleave={this.handleCellMouseLeave}
  84. >
  85. {
  86. column.renderCell.call(
  87. this._renderProxy,
  88. this.$createElement,
  89. data,
  90. columnsHidden[cellIndex]
  91. )
  92. }
  93. </td>
  94. );
  95. })
  96. }
  97. </tr>
  98. );
  99. }
  100. };