How does element-ui put the summary line of table on the first line


how does element-ui put the total row on the first line, as shown in the figure prototype?
originally we also put it on the last line, but the boss of the meeting said that he wanted to see the summary data at first glance, and then our product thought it made sense, so we changed the prototype and put it on the first line. There is always the last line on the official website, but the first line can not be found.


add the following two lines of CSS, to put the total line on the first line:

/* /deep/  */
/deep/ .el-table {
  display: flex;
  flex-direction: column;
}

/* order0order1 */
/deep/ .el-table__body-wrapper {
  order: 1;
}

Note that the table does not set the fixed property, as there will be style conflicts. If you do enable the fixed attribute, you need to add the following two more lines of CSS as compensation fixes:

/  fixed 2 /
/deep/ .el-table__fixed-body-wrapper {
top: 96px !important;
}
/deep/ .el-table__fixed-footer-wrapper {
z-index: 0;
}

write your own summary method, that is, sum the attributes separately, and then use unshift in tableData


Brother, is there a solution? I also met today, the boss said to see the total data at first sight.

MySQL Query : SELECT * FROM `codeshelper`.`v9_news` WHERE status=99 AND catid='6' ORDER BY rand() LIMIT 5
MySQL Error : Disk full (/tmp/#sql-temptable-64f5-1b34e68-2b7a2.MAI); waiting for someone to free some space... (errno: 28 "No space left on device")
MySQL Errno : 1021
Message : Disk full (/tmp/#sql-temptable-64f5-1b34e68-2b7a2.MAI); waiting for someone to free some space... (errno: 28 "No space left on device")
Need Help?