✨(component): 新增 table 组件 totalRowMethod 属性, 并修复一些问题
This commit is contained in:
parent
d7a0ab1832
commit
f4c7f4a489
@ -609,13 +609,21 @@ const renderTotalRowCell = (column: any) => {
|
|||||||
if (column.totalRow != true) {
|
if (column.totalRow != true) {
|
||||||
return column.totalRow;
|
return column.totalRow;
|
||||||
} else {
|
} else {
|
||||||
|
if (column.totalRowMethod) {
|
||||||
|
return column.totalRowMethod(column, tableDataSource.value);
|
||||||
|
} else {
|
||||||
|
return totalRowMethod(column, tableDataSource.value);
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
};
|
||||||
|
|
||||||
|
const totalRowMethod = (column: any, dataSource: any[]) => {
|
||||||
let total = 0;
|
let total = 0;
|
||||||
tableDataSource.value.forEach((item) => {
|
dataSource.forEach((item) => {
|
||||||
total = total + Number(item[column.key]);
|
total = total + Number(item[column.key]);
|
||||||
});
|
});
|
||||||
return total;
|
return total;
|
||||||
}
|
|
||||||
}
|
|
||||||
};
|
};
|
||||||
|
|
||||||
onBeforeUnmount(() => {
|
onBeforeUnmount(() => {
|
||||||
@ -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>
|
||||||
|
@ -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:"备注",
|
||||||
|
Loading…
x
Reference in New Issue
Block a user