From 06fbffa80cbbe5daeffaaa406e1b21b044ca4f1e Mon Sep 17 00:00:00 2001 From: zhangxiaoxu123456 <zxx19900626> Date: 星期六, 07 五月 2022 14:55:24 +0800 Subject: [PATCH] 巩固脱贫成果 --- src/pages/show/laborRelations/LaborRelations.vue | 417 +++++++++++++++++++++------------------------------------- 1 files changed, 153 insertions(+), 264 deletions(-) diff --git a/src/pages/show/laborRelations/LaborRelations.vue b/src/pages/show/laborRelations/LaborRelations.vue index 2b575f7..91a1bba 100644 --- a/src/pages/show/laborRelations/LaborRelations.vue +++ b/src/pages/show/laborRelations/LaborRelations.vue @@ -3,22 +3,40 @@ <div class="laborRelations__warp"> <h1 class="title"> 鍐滄皯宸ュ氨涓氬拰娆犺柂杩界即鎯呭喌缁熻琛�</h1> <div class="laborRelations__table"> - <el-table style="width:100%" :data="tableUpData" :span-method="mergeColumnTableCell" border stripe - :cell-style="updataCellStyle"> - <el-table-column label="搴忓彿" prop="xuhao" width="135"> + <el-table + :max-height="tableHeight" + style="width:100%" + :data="tableUpData" + :span-method="mergeColumnTableCell" + border + stripe + > + <template v-for="(item,index) in headArry"> + <el-table-column + :key="index" + :label="item.name" + :prop="item.name" + min-width="170"> + <template slot-scope="scope"> + <template v-for="(e,i) in scope.row"> + <template v-if="e.name == scope.column.property"> + <span>{{e.val}}</span> + </template> + </template> + </template> + </el-table-column> + </template> + + <!--<el-table-column label="2017骞�" prop="serveteen" min-width="80"> </el-table-column> - <el-table-column label="椤圭洰" prop="xiangmu" width="650"> + <el-table-column label="2018骞�" prop="eighteen" min-width="80"> </el-table-column> - <el-table-column label="2017骞�" prop="serveteen"> + <el-table-column label="2019骞�" prop="nineteen" min-width="80"> </el-table-column> - <el-table-column label="2018骞�" prop="eighteen"> + <el-table-column label="2020骞�" prop="twenty" min-width="80"> </el-table-column> - <el-table-column label="2019骞�" prop="nineteen"> - </el-table-column> - <el-table-column label="2020骞�" prop="twenty"> - </el-table-column> - <el-table-column label="2021骞�" prop="twentyOne"> - </el-table-column> + <el-table-column label="2021骞�" prop="twentyOne" min-width="80"> + </el-table-column>--> </el-table> </div> </div> @@ -26,272 +44,143 @@ </template> <script> + import {getWorkerTable} from '@/api/laborRelations' + import nowSize from "../../../libs/nowSize"; + import index from "../index/index"; export default { name: "LaborRelations", data() { return { - tableUpData: [ - { - xuhao: '1', - xiangmu: '鍏ㄥ競鍐滄皯宸�' - }, - { - xuhao: '1', - xiangmu: '鎬昏', - serveteen: '134.3', - eighteen: '134.3', - nineteen: '134.4', - twenty: '134.3', - twentyOne: '134.3' - }, - { - xuhao: '1', - xiangmu: '鎬昏', - serveteen: '134.3', - eighteen: '134.3', - nineteen: '134.4', - twenty: '134.3', - twentyOne: '134.3' - }, - { - xuhao: '1', - xiangmu: '鎬昏', - serveteen: '134.3', - eighteen: '134.3', - nineteen: '134.4', - twenty: '134.3', - twentyOne: '134.3' - }, - { - xuhao: '1', - xiangmu: '鎬昏', - serveteen: '134.3', - eighteen: '134.3', - nineteen: '134.4', - twenty: '134.3', - twentyOne: '134.3' - }, - { - xuhao: '1', - xiangmu: '鎬昏', - serveteen: '134.3', - eighteen: '134.3', - nineteen: '134.4', - twenty: '134.3', - twentyOne: '134.3' - }, - { - xuhao: '2', - xiangmu: '鏍规不鍐滄皯娆犺柂' - }, - { - xuhao: '1', - xiangmu: '鎬昏', - serveteen: '134.3', - eighteen: '134.3', - nineteen: '134.4', - twenty: '134.3', - twentyOne: '134.3' - }, - { - xuhao: '1', - xiangmu: '鎬昏', - serveteen: '134.3', - eighteen: '134.3', - nineteen: '134.4', - twenty: '134.3', - twentyOne: '134.3' - }, - { - xuhao: '1', - xiangmu: '鎬昏', - serveteen: '134.3', - eighteen: '134.3', - nineteen: '134.4', - twenty: '134.3', - twentyOne: '134.3' - }, - { - xuhao: '1', - xiangmu: '鎬昏', - serveteen: '134.3', - eighteen: '134.3', - nineteen: '134.4', - twenty: '134.3', - twentyOne: '134.3' - }, - { - xuhao: '1', - xiangmu: '鎬昏', - serveteen: '134.3', - eighteen: '134.3', - nineteen: '134.4', - twenty: '134.3', - twentyOne: '134.3' - }, - { - xuhao: '1', - xiangmu: '鎬昏', - serveteen: '134.3', - eighteen: '134.3', - nineteen: '134.4', - twenty: '134.3', - twentyOne: '134.3' - }, - { - xuhao: '1', - xiangmu: '鎬昏', - serveteen: '134.3', - eighteen: '134.3', - nineteen: '134.4', - twenty: '134.3', - twentyOne: '134.3' - }, - { - xuhao: '1', - xiangmu: '鎬昏', - serveteen: '134.3', - eighteen: '134.3', - nineteen: '134.4', - twenty: '134.3', - twentyOne: '134.3' - }, - { - xuhao: '1', - xiangmu: '鎬昏', - serveteen: '134.3', - eighteen: '134.3', - nineteen: '134.4', - twenty: '134.3', - twentyOne: '134.3' - }, - { - xuhao: '1', - xiangmu: '鎬昏', - serveteen: '134.3', - eighteen: '134.3', - nineteen: '134.4', - twenty: '134.3', - twentyOne: '134.3' - }, - { - xuhao: '1', - xiangmu: '鎬昏', - serveteen: '134.3', - eighteen: '134.3', - nineteen: '134.4', - twenty: '134.3', - twentyOne: '134.3' - }, - { - xuhao: '1', - xiangmu: '鎬昏', - serveteen: '134.3', - eighteen: '134.3', - nineteen: '134.4', - twenty: '134.3', - twentyOne: '134.3' - }, - { - xuhao: '1', - xiangmu: '鎬昏', - serveteen: '134.3', - eighteen: '134.3', - nineteen: '134.4', - twenty: '134.3', - twentyOne: '134.3' - }, - { - xuhao: '1', - xiangmu: '鎬昏', - serveteen: '134.3', - eighteen: '134.3', - nineteen: '134.4', - twenty: '134.3', - twentyOne: '134.3' - }, - { - xuhao: '1', - xiangmu: '鎬昏', - serveteen: '134.3', - eighteen: '134.3', - nineteen: '134.4', - twenty: '134.3', - twentyOne: '134.3' - }, - { - xuhao: '1', - xiangmu: '鎬昏', - serveteen: '134.3', - eighteen: '134.3', - nineteen: '134.4', - twenty: '134.3', - twentyOne: '134.3' - }, - ] + tableUpData:[], + headArry:[], + tableHeight: window.innerHeight - nowSize(250), + spanArr:[] } }, methods: { - mergeColumnTableCell({rowIndex, columnIndex}) { - // 鍚堝苟鍒� - if (columnIndex === 0) { - if (rowIndex === 0) { - return { - rowspan: 6, - colspan: 1 - }; - } else if (rowIndex === 6) { - return { - rowspan: 17, - colspan: 1 - } - } else { - return { - rowspan: 0, - colspan: 0 - } + //鍚堝苟琛屽拰鍒� + mergeColumnTableCell({row,column,rowIndex, columnIndex}) { + if(rowIndex == 1) { + const _row = this.spanArr[rowIndex] + const _col = row > 0 ? 1 : 0 + return { + rowspan: _row, + colspan: _col + } } - } - // 鍚堝苟琛� - if (rowIndex === 0) { //鎸囧畾琛屽彿 - if (columnIndex === 1) { - return { - rowspan: 1, - colspan: 6 - } - } else { - return { - rowIndex: 0, - colIndex: 0 - } - } - } else if (rowIndex === 6) { //鎸囧畾琛屽彿 - if (columnIndex === 1) { - return { - rowspan: 1, - colspan: 6 - } - } - } + }, + getSpanArry() { + // let pos = 0 + // let rowArry = [] + // this.tableUpData.filter((currentVal,index,arr) => { + // + // }) }, // 淇敼鍗曚釜鍗曞厓鏍兼牱寮� - updataCellStyle({ rowIndex, columnIndex}){ - if(rowIndex===0&&columnIndex===0){ - return {background:'#51D2FF'} - }else if(rowIndex===6&&columnIndex===0){ - return{background:'#51D2FF'} - }else if(rowIndex===0&&columnIndex===1){ - return{background:'#51D2FF',paddingLeft:'32px',textAlign:'left'} - }else if(rowIndex===6&&columnIndex===1){ - return{background:'#51D2FF',paddingLeft:'32px',textAlign:'left'} - } - } - } + // updataCellStyle({ rowIndex, columnIndex}){ + // if(rowIndex===0&&columnIndex===0){ + // return {background:'#51D2FF'} + // }else if(rowIndex===6&&columnIndex===0){ + // return{background:'#51D2FF'} + // }else if(rowIndex===0&&columnIndex===1){ + // return{background:'#51D2FF',paddingLeft:'32px',textAlign:'left'} + // }else if(rowIndex===6&&columnIndex===1){ + // return{background:'#51D2FF',paddingLeft:'32px',textAlign:'left'} + // } + // }, + getHeight() { + this.tableHeight = window.innerHeight - nowSize(250) + }, + getWorkerTable(){ + getWorkerTable().then(res => { + if(res.code == 1000) { + let row = [] + let yearList = [] + let arry = [] + let data = [] + let data1 = [] + // res.list.forEach((item,index) => { + // yearList.push(item.year) + // }) + // res.list.forEach((item,index) => { + // item.dataList.forEach((e,i) => { + // row.push({ + // name: '椤圭洰', + // val: e.name + // }) + // yearList.forEach((y,j) => { + // row.push({ + // name: y, + // val: res.list[j].dataList[i].val + // }) + // }) + // + // data.push({ + // name:i, + // val:row + // }) + // row = [] + // }) + // if(index > 0 ){ + // return + // }else if(index == 0) { + // this.headArry = data[0].val + // } + // this.tableUpData = data + // console.log(data,'data------------2') + // }) + + res.list.forEach((item,index) => { + yearList.push(item.year) + }) + res.list.forEach((item,index) => { + item.dataList.forEach((e,i) => { + if(!row[i]) { + row[i] = { + name: '椤圭洰', + val: e.name + } + } + arry = [row[i]] + yearList.forEach((y,j) => { + arry.push({ + name: y, + val: res.list[j].dataList[i].val + }) + }) + if(index > 0) return + data.push(arry) + if(index == 0) { + this.headArry = data[0] + // console.log(this.headArry,'headArry========') + } + }) + }) + this.tableUpData = data + this.getSpanArry() + // console.log(this.tableUpData,'tableUpData=====') + } + }) + } , + + }, + mounted() { + this.getWorkerTable() + }, + created() { + window.addEventListener('resize', this.getHeight) + }, + destroy() { + window.addEventListener('resize', this.getHeight) + } } </script> <style lang="scss"> @import "../../../assets/css/base"; .laborRelations__table { + .el-table--enable-row-hover .el-table__body tr:hover>td.el-table__cell{ + background: transparent; + } .el-table tr { background-color: #CEF2FF; } @@ -331,7 +220,7 @@ background: transparent; } - .el-table .cell { + .el-table .cell span,.el-table .cell{ font-size: $fontSize-28; color: $color-darkGrey; font-weight: 300; -- Gitblit v1.9.1