(component): 新增 table 组件 totalRowMethod 属性, 并修复一些问题

This commit is contained in:
就眠儀式 2022-10-11 10:36:36 +08:00
parent d7a0ab1832
commit f4c7f4a489
2 changed files with 39 additions and 20 deletions

View File

@ -609,15 +609,23 @@ const renderTotalRowCell = (column: any) => {
if (column.totalRow != true) { if (column.totalRow != true) {
return column.totalRow; return column.totalRow;
} else { } else {
let total = 0; if (column.totalRowMethod) {
tableDataSource.value.forEach((item) => { return column.totalRowMethod(column, tableDataSource.value);
total = total + Number(item[column.key]); } else {
}); return totalRowMethod(column, tableDataSource.value);
return total; }
} }
} }
}; };
const totalRowMethod = (column: any, dataSource: any[]) => {
let total = 0;
dataSource.forEach((item) => {
total = total + Number(item[column.key]);
});
return total;
};
onBeforeUnmount(() => { onBeforeUnmount(() => {
window.onresize = null; window.onresize = null;
}); });
@ -707,18 +715,10 @@ onBeforeUnmount(() => {
class="layui-table-cell" class="layui-table-cell"
:class="[ :class="[
renderFixedClassName(column, columnIndex), renderFixedClassName(column, columnIndex),
column.fixed column.fixed ? `layui-table-fixed-${column.fixed}` : '',
? `layui-table-fixed-${column.fixed}` column.type == 'checkbox' ? 'layui-table-cell-checkbox' : '',
: '', column.type == 'radio' ? 'layui-table-cell-radio' : '',
column.type == 'checkbox' column.type == 'number' ? 'layui-table-cell-number' : '',
? 'layui-table-cell-checkbox'
: '',
column.type == 'radio'
? 'layui-table-cell-radio'
: '',
column.type == 'number'
? 'layui-table-cell-number'
: '',
]" ]"
:style="[ :style="[
{ {
@ -843,7 +843,23 @@ onBeforeUnmount(() => {
:key="columnIndex" :key="columnIndex"
> >
<template v-if="tableColumnKeys.includes(column.key)"> <template v-if="tableColumnKeys.includes(column.key)">
<td>{{ renderTotalRowCell(column) }}</td> <td
:style="[
{
textAlign: column.align,
whiteSpace: column.ellipsisTooltip
? 'nowrap'
: 'normal',
},
renderFixedStyle(column, columnIndex),
]"
:class="[
'layui-table-cell',
renderFixedClassName(column, columnIndex),
column.fixed ? `layui-table-fixed-${column.fixed}` : '',
]"
v-html="renderTotalRowCell(column)"
></td>
</template> </template>
</template> </template>
</tr> </tr>

View File

@ -1057,8 +1057,7 @@ export default {
},{ },{
title:"年龄", title:"年龄",
width: "300px", width: "300px",
key:"age", key:"age"
totalRow: true
},{ },{
title:"备注", title:"备注",
width: "180px", width: "180px",
@ -1459,6 +1458,10 @@ export default {
width: "300px", width: "300px",
key:"age", key:"age",
ellipsisTooltip: true, ellipsisTooltip: true,
totalRow: true,
totalRowMethod: (currentColumn, dataSource) => {
return "<span style='color:red'>自定义统计</span>";
}
}, },
{ {
title:"备注", title:"备注",