效果圖：下邊的table比上邊的table多了一列
思路：前臺其實很好實現，兩個數組，一個是表頭，一個是數據，分別循環就行了，後臺把表頭集合作爲查詢條件，然後拼接sql，就可以得到一一對應的結果了。
重點：我覺得重點其實是數據結構，重點是兩張表，一張是主表，存放固定屬性，一張是付表，主要寸的是表頭結果數據。
還有表頭的基礎數據是單獨一張表。
舉個例子：做一個優秀員工的評選，評選標準有長得是否好看、喫的多少、頭髮長短。。。。。。，我把員工姓名這些一直不變的放到主表裏面，然後把評選標準結果放到附表裏面，爲了支持動態擴展評價標準，附表其實寸的是數據，是一個列轉行的問題
表結構如下：
主表a：
id,name
附表b：
id,type,value,pid
表頭數據c：
id,type
模擬保存數據：表頭數據裏面存入5條數據，即5個評價標準，然後保存優先員工1的數據到表a和表b裏面，這時候應該是表a，存入一條數據，而表b存入5條數據。
對應標的結果如下：
主表a：
id,name
111，優秀員工1
附表b：
id, type, value, pid
222，團隊協作，0，111
223，工作態度，0，111
224，工作績效，0，111
225，管理績效，1，111
226，考覈天數，3，111
表頭數據c：
id,type
333，團隊協作
444，工作態度
555，工作績效
666，管理績效
777，考覈天數
查詢數據：查詢數據的方法就是拼sql，兩點需要注意：1：先查表c，獲取有多少表頭，2根據查詢到的表頭數據集合循環，利用case when 拼接sql ,這樣select 出來的字段，就能和前臺vue定義的集合是一對一的關係了。
上代碼：
要是都看懂了，要啥代碼
後臺拼接sql關鍵代碼：
//拼接查詢條件，即動態表頭
for (Map<String, Object> map : selectItems) {
String key = (String) map.get("key");
String keyName = (String) map.get("keyName");
selectSql1 += " max(case when s.item_type = '" + keyName
+ "' then s.item_score else 0 end ) as '" + key + "', ";
}
//查詢數據
String sqlPeople1 = "SELECT "
+ selectSql1
+ " m.* "
+ " FROM mark_project m "
+ " left join score_de s on m.id = s.pid "
+ " where 1=1 "
+ " and m.leader_id = '" + teamLeaderId + "' "
+ " and m.begin_time >= '" + beginWeekDate + "' "
+ " and m.end_time <= '" + endWeekDate + "' ";
前端渲染：
<!-- listPeople是表格數據集合 ，columns是表頭集合 -->
<el-table border :data="listPeople" style="width: 100%">
<div>
<el-table-column prop="user_name" label="名字" fixed align="center"></el-table-column>
</div>
<div v-for="(column,i) in columns" :key="i">
<el-table-column :prop="column.key" :label="column.keyName" align="center"></el-table-column>
</div>