基于element表格的合并多个行实例
官方示例地址：https://github.liubing.me/lb-element-table/zh/guide/
效果图：
0.下载lb-table 并引入
import LbTable from '@/components/lb-table/lb-table'
1.调用lb-table组件（merge="['pidName', 'tplName','mainDeptName']" === 展示要合并的字段）
<lb-table :column="tableData2.column"
:data="tableData2.data"
:merge="['pidName', 'tplName','mainDeptName']"
border>
</lb-table>
2.定义table展示数据：tableData2
column === 这是表头
// 通过render自定义出任意效果的编辑模式
data === 这是后台获取到的数据
tableData2: { column: [ { prop: 'pidName', label: '指标类别' }, { prop: 'tplName', label: '指标名称' }, { prop: 'tplType', label: '属性', render: (h, scope) => { return ( <div> { scope.row.kpiType === 0?<span><span class="span-dian"></span>定量共性</span>:'' } { scope.row.kpiType === 1?<span><span class="span-dian"></span>目标差异</span>:'' } { scope.row.kpiType === 2?<span><span class="span-dian"></span>加分指标</span>:'' } { scope.row.kpiType === 3?<span><span class="span-dian"></span>扣分指标</span>:'' } { scope.row.kpiType === 4?<span><span class="span-dian"></span>定性指标</span>:'' } </div> ) } }, { prop: 'weight', label: '权重' }, { prop: 'mainDeptName', label: '责任部门' }, { prop: 'tplRemark', label: '指标解释' }, { label: '操作', render: (h, scope) => { return ( <div> { <div> <el-button size="mini" type="text" onClick={ () => { this.showView(scope.$index, scope.row) } } >指标解释 </el-button> <el-button size="mini" type="text" onClick={ () => { this.showOtherCityFun(scope.$index, scope.row) } } >意见 </el-button> </div> } </div> ) } } ], data: [] },
3.定义table展示数据：tableData2.data 实例
{ "data": [ { "id": "1201004802172719106", "pid": "0", "children": [], "creator": null, "createDate": null, "tplName": "1-1-1.地区生产总值增长目标实现程度", "tplRemark": "", "pidName": "1-1.新旧动能转换", "pids": "", "level": 1, "type": 0, "sort": 0, "mainDept": null, "assistDept": null, "checkDept": null, "checkDeptName": null, "mainDeptName": "市发改委", "assistDeptName": null, "weight": 40, "kpiCode": null, "otherCity": 0, "deleted": 0, "tplKpiWriteId": "0", "tplExamId": "0", "tplKpiWriteName": null, "tplExamName": null, "kpiType": 0 }, { "id": "1201004974642499585", "pid": "0", "children": [], "creator": null, "createDate": null, "tplName": "1-1-2.税收占一般公共预算收入比重及提高幅度", "tplRemark": "", "pidName": "1-1.新旧动能转换", "pids": "", "level": 1, "type": 0, "sort": 0, "mainDept": null, "assistDept": null, "checkDept": null, "checkDeptName": null, "mainDeptName": "市发改委", "assistDeptName": null, "weight": 30, "kpiCode": null, "otherCity": 0, "deleted": 0, "tplKpiWriteId": "0", "tplExamId": "0", "tplKpiWriteName": null, "tplExamName": null, "kpiType": 0 }, { "id": "1201005178561171457", "pid": "0", "children": [], "creator": null, "createDate": null, "tplName": "1-2-1.\"双招双引\"考核情况", "tplRemark": "", "pidName": "1-2.\"双招双引\"", "pids": "", "level": 1, "type": 0, "sort": 0, "mainDept": null, "assistDept": null, "checkDept": null, "checkDeptName": null, "mainDeptName": "市商务局", "assistDeptName": null, "weight": 200, "kpiCode": null, "otherCity": 0, "deleted": 0, "tplKpiWriteId": "0", "tplExamId": "0", "tplKpiWriteName": null, "tplExamName": null, "kpiType": 0 }, { "id": "1201005924811739137", "pid": "0", "children": [], "creator": null, "createDate": null, "tplName": "1-3-1.政府债务管理", "tplRemark": "", "pidName": "1-3.打好防范化解重大风险攻坚战", "pids": "", "level": 1, "type": 0, "sort": 0, "mainDept": null, "assistDept": null, "checkDept": null, "checkDeptName": null, "mainDeptName": "市财政局", "assistDeptName": null, "weight": 30, "kpiCode": null, "otherCity": 0, "deleted": 0, "tplKpiWriteId": "0", "tplExamId": "0", "tplKpiWriteName": null, "tplExamName": null, "kpiType": 1 }, { "id": "1201006164096782338", "pid": "0", "children": [], "creator": null, "createDate": null, "tplName": "1-3-2.不良贷款率下降", "tplRemark": "", "pidName": "1-3.打好防范化解重大风险攻坚战", "pids": "", "level": 1, "type": 0, "sort": 0, "mainDept": null, "assistDept": null, "checkDept": null, "checkDeptName": null, "mainDeptName": "市地方金融监管局", "assistDeptName": null, "weight": 20, "kpiCode": null, "otherCity": 0, "deleted": 0, "tplKpiWriteId": "0", "tplExamId": "0", "tplKpiWriteName": null, "tplExamName": null, "kpiType": 0 }, { "id": "1201006479755907073", "pid": "0", "children": [], "creator": null, "createDate": null, "tplName": "1-3-3.安全生产", "tplRemark": "", "pidName": "1-3.打好防范化解重大风险攻坚战", "pids": "", "level": 1, "type": 0, "sort": 0, "mainDept": null, "assistDept": null, "checkDept": null, "checkDeptName": null, "mainDeptName": "市应急管理局", "assistDeptName": null, "weight": 30, "kpiCode": null, "otherCity": 0, "deleted": 0, "tplKpiWriteId": "0", "tplExamId": "0", "tplKpiWriteName": null, "tplExamName": null, "kpiType": 0 }, { "id": "1201007299457126402", "pid": "0", "children": [], "creator": null, "createDate": null, "tplName": "1-4-1.海陆粮仓建设(粮食加工产业营业收入)", "tplRemark": "", "pidName": "1-4.差异化指标", "pids": "", "level": 1, "type": 0, "sort": 0, "mainDept": null, "assistDept": null, "checkDept": null, "checkDeptName": null, "mainDeptName": "市粮食和物资储备局", "assistDeptName": null, "weight": 40, "kpiCode": null, "otherCity": 0, "deleted": 0, "tplKpiWriteId": "0", "tplExamId": "0", "tplKpiWriteName": null, "tplExamName": null, "kpiType": 5 }, { "id": "1201008354936950785", "pid": "0", "children": [], "creator": null, "createDate": null, "tplName": "1-4-2.海洋生产总值增长率", "tplRemark": "", "pidName": "1-4.差异化指标", "pids": "", "level": 1, "type": 0, "sort": 0, "mainDept": null, "assistDept": null, "checkDept": null, "checkDeptName": null, "mainDeptName": "市海洋发展和渔业局", "assistDeptName": null, "weight": 40, "kpiCode": null, "otherCity": 0, "deleted": 0, "tplKpiWriteId": "0", "tplExamId": "0", "tplKpiWriteName": null, "tplExamName": null, "kpiType": 5 }, { "id": "1201008617475215361", "pid": "0", "children": [], "creator": null, "createDate": null, "tplName": "1-4-3.高端铝产业营业收入占规模以上工业营业收入比重提高幅度", "tplRemark": "", "pidName": "1-4.差异化指标", "pids": "", "level": 1, "type": 0, "sort": 0, "mainDept": null, "assistDept": null, "checkDept": null, "checkDeptName": null, "mainDeptName": "市工信局", "assistDeptName": null, "weight": 40, "kpiCode": null, "otherCity": 0, "deleted": 0, "tplKpiWriteId": "0", "tplExamId": "0", "tplKpiWriteName": null, "tplExamName": null, "kpiType": 5 }, { "id": "1201014435465650178", "pid": "0", "children": [], "creator": null, "createDate": null, "tplName": "1-4-4.新一代信息技术产业营业收入增长率", "tplRemark": "", "pidName": "1-4.差异化指标", "pids": "", "level": 1, "type": 0, "sort": 0, "mainDept": null, "assistDept": null, "checkDept": null, "checkDeptName": null, "mainDeptName": "市大数据局", "assistDeptName": null, "weight": 40, "kpiCode": null, "otherCity": 0, "deleted": 0, "tplKpiWriteId": "0", "tplExamId": "0", "tplKpiWriteName": null, "tplExamName": null, "kpiType": 5 }, { "id": "1201022197629181954", "pid": "0", "children": [], "creator": null, "createDate": null, "tplName": "1-5-1.履行全面从严治党责任情况", "tplRemark": "", "pidName": "1-5.提高新时代党的建设质量", "pids": "", "level": 1, "type": 0, "sort": 0, "mainDept": null, "assistDept": null, "checkDept": null, "checkDeptName": null, "mainDeptName": "市委办公室", "assistDeptName": null, "weight": null, "kpiCode": null, "otherCity": 0, "deleted": 0, "tplKpiWriteId": "0", "tplExamId": "0", "tplKpiWriteName": null, "tplExamName": null, "kpiType": 4 }, { "id": "1201022433101602817", "pid": "0", "children": [], "creator": null, "createDate": null, "tplName": "1-5-2.开展\"不忘初心、牢记使命\"主题教育情况", "tplRemark": "", "pidName": "1-5.提高新时代党的建设质量", "pids": "", "level": 1, "type": 0, "sort": 0, "mainDept": null, "assistDept": null, "checkDept": null, "checkDeptName": null, "mainDeptName": "市委组织部", "assistDeptName": null, "weight": null, "kpiCode": null, "otherCity": 0, "deleted": 0, "tplKpiWriteId": "0", "tplExamId": "0", "tplKpiWriteName": null, "tplExamName": null, "kpiType": 4 }, { "id": "1201022616396881921", "pid": "0", "children": [], "creator": null, "createDate": null, "tplName": "1-5-3.履行抓基层党建工作职责情况", "tplRemark": "", "pidName": "1-5.提高新时代党的建设质量", "pids": "", "level": 1, "type": 0, "sort": 0, "mainDept": null, "assistDept": null, "checkDept": null, "checkDeptName": null, "mainDeptName": "市委组织部", "assistDeptName": null, "weight": null, "kpiCode": null, "otherCity": 0, "deleted": 0, "tplKpiWriteId": "0", "tplExamId": "0", "tplKpiWriteName": null, "tplExamName": null, "kpiType": 4 }, { "id": "1201023035462377473", "pid": "0", "children": [], "creator": null, "createDate": null, "tplName": "1-5-4.建设高素质专业化干部队伍情况", "tplRemark": "", "pidName": "1-5.提高新时代党的建设质量", "pids": "", "level": 1, "type": 0, "sort": 0, "mainDept": null, "assistDept": null, "checkDept": null, "checkDeptName": null, "mainDeptName": "市委组织部", "assistDeptName": null, "weight": null, "kpiCode": null, "otherCity": 0, "deleted": 0, "tplKpiWriteId": "0", "tplExamId": "0", "tplKpiWriteName": null, "tplExamName": null, "kpiType": 4 }, { "id": "1201023275833745410", "pid": "0", "children": [], "creator": null, "createDate": null, "tplName": "2-1.加块经济高质量发展若干政策落实", "tplRemark": "", "pidName": "2.市级指标", "pids": "", "level": 1, "type": 0, "sort": 0, "mainDept": null, "assistDept": null, "checkDept": null, "checkDeptName": null, "mainDeptName": "市委办公室", "assistDeptName": null, "weight": 50, "kpiCode": null, "otherCity": 0, "deleted": 0, "tplKpiWriteId": "0", "tplExamId": "0", "tplKpiWriteName": null, "tplExamName": null, "kpiType": 0 }, { "id": "1201024089407086594", "pid": "0", "children": [], "creator": null, "createDate": null, "tplName": "3-1.改革创新创先争优加分指标", "tplRemark": "", "pidName": "3.改革创新创先争优加分项", "pids": "", "level": 1, "type": 0, "sort": 0, "mainDept": null, "assistDept": null, "checkDept": null, "checkDeptName": null, "mainDeptName": "市委组织部", "assistDeptName": null, "weight": 200, "kpiCode": null, "otherCity": 0, "deleted": 0, "tplKpiWriteId": "0", "tplExamId": "0", "tplKpiWriteName": null, "tplExamName": null, "kpiType": 2 }, { "id": "1201026237758951425", "pid": "0", "children": [], "creator": null, "createDate": null, "tplName": "4-1.数据造假", "tplRemark": "", "pidName": "4.负面清单扣分项", "pids": "", "level": 1, "type": 0, "sort": 0, "mainDept": null, "assistDept": null, "checkDept": null, "checkDeptName": null, "mainDeptName": "市大数据局", "assistDeptName": null, "weight": 50, "kpiCode": null, "otherCity": 0, "deleted": 0, "tplKpiWriteId": "0", "tplExamId": "0", "tplKpiWriteName": null, "tplExamName": null, "kpiType": 3 }, { "id": "1201026413366071297", "pid": "0", "children": [], "creator": null, "createDate": null, "tplName": "4-2.重大失信事件", "tplRemark": "", "pidName": "4.负面清单扣分项", "pids": "", "level": 1, "type": 0, "sort": 0, "mainDept": null, "assistDept": null, "checkDept": null, "checkDeptName": null, "mainDeptName": "市发改委", "assistDeptName": null, "weight": 50, "kpiCode": null, "otherCity": 0, "deleted": 0, "tplKpiWriteId": "0", "tplExamId": "0", "tplKpiWriteName": null, "tplExamName": null, "kpiType": 3 } ] }
