• 统计合计
    • 普通用法

    统计合计

    配置相应的属性后,在表格末尾即可达到统计合计功能

    普通用法

    统计合计 - 图1

    showSummary设置为true即可开启统计合计功能,sumColumnList属性配置需要计算的表格列配置,其中name为列的prop值,type为需要计算的类型,目前支持(合计 / 平均 / 统计)三个大功能,后期将会加强表格的计算能力

    1. <avue-crud :option="option" :data="data"></avue-crud>
    2. <script>
    3. export default {
    4. data(){
    5. return {
    6. data:[
    7. {
    8. sum: 5,
    9. avg: 10,
    10. count: 2,
    11. },{
    12. sum: 15,
    13. avg: 20,
    14. count: 1,
    15. }
    16. ],
    17. option:{
    18. index:true,
    19. showSummary: true,
    20. sumColumnList: [
    21. {
    22. name: 'sum',
    23. type: 'sum'
    24. },
    25. {
    26. name: 'avg',
    27. type: 'avg'
    28. },
    29. {
    30. name: 'count',
    31. type: 'count'
    32. }
    33. ],
    34. column: [{
    35. label: '相加',
    36. prop: 'sum'
    37. },
    38. {
    39. label: '平均值',
    40. prop: 'avg'
    41. },
    42. {
    43. label: '统计',
    44. prop: 'count'
    45. }]
    46. }
    47. }
    48. }
    49. }
    50. </script>