From 71da7c5aa9ebaeaadf459a5092a5fbcd1aeffdfa Mon Sep 17 00:00:00 2001 From: zhangxiaoxu123456 <zxx19900626> Date: 星期四, 21 四月 2022 08:34:17 +0800 Subject: [PATCH] 毕业生统计接口对接 --- src/pages/show/jiuyeAndChuangye/jiuyeChildren/biyeshengStatistics.vue | 476 ++++++++++++++++++++++++++++++++++++++++++++++++++++++++--- 1 files changed, 452 insertions(+), 24 deletions(-) diff --git a/src/pages/show/jiuyeAndChuangye/jiuyeChildren/biyeshengStatistics.vue b/src/pages/show/jiuyeAndChuangye/jiuyeChildren/biyeshengStatistics.vue index 731c76c..2de4d00 100644 --- a/src/pages/show/jiuyeAndChuangye/jiuyeChildren/biyeshengStatistics.vue +++ b/src/pages/show/jiuyeAndChuangye/jiuyeChildren/biyeshengStatistics.vue @@ -1,46 +1,474 @@ <template> <div class="biyeshengStatistics-wrap"> - <table> + <!--<table class="biyeshengStatistics-table"> <thead> <tr> - <th>搴忓彿</th> - <th>椤圭洰</th> - <th>2017骞�</th> - <th>2018骞�</th> - <th>2019骞�</th> - <th>2020骞�</th> - <th>2021骞�</th> + <th colspan="1">搴忓彿</th> + <th colspan="3">椤圭洰</th> + <th colspan="2">2017骞�</th> + <th colspan="2">2018骞�</th> + <th colspan="2">2019骞�</th> + <th colspan="2">2020骞�</th> + <th colspan="2">2021骞�</th> </tr> </thead> <tbody> <tr> - <th rowspan="3">1</th> - <td>鍏ㄥ浗楂樻牎鏈競鐢熸簮</td> - <td>2642</td> - <td>6879</td> - <td>1586</td> - <td>8651</td> - <td>45682</td> + <th colspan="1" rowspan="3">1</th> + <td colspan="3">鍏ㄥ浗楂樻牎鏈競鐢熸簮</td> + <td colspan="2">2642</td> + <td colspan="2">6879</td> + <td colspan="2">1586</td> + <td colspan="2">8651</td> + <td colspan="2">45682</td> </tr> <tr> - <td>鍏朵腑锛氭湰绉戞瘯涓氱敓</td> - <td>2642</td> - <td>6879</td> - <td>1586</td> - <td>8651</td> - <td>45682</td> + <td colspan="3">鍏朵腑锛氭湰绉戞瘯涓氱敓</td> + <td colspan="2">2642</td> + <td colspan="2">6879</td> + <td colspan="2">1586</td> + <td colspan="2">8651</td> + <td colspan="2">45682</td> + </tr> + <tr> + <td colspan="3">涓撶姣曚笟鐢�</td> + <td colspan="2">2642</td> + <td colspan="2">6879</td> + <td colspan="2">1586</td> + <td colspan="2">8651</td> + <td colspan="2">45682</td> + </tr> + + <tr> + <th colspan="1" rowspan="5">2</th> + <td colspan="3">鍏ㄧ渷楂樻牎</td> + <td colspan="2">2642</td> + <td colspan="2">6879</td> + <td colspan="2">1586</td> + <td colspan="2">8651</td> + <td colspan="2">45682</td> + </tr> + <tr> + <td colspan="3">鍏朵腑锛氬崥澹瘯涓氱敓</td> + <td colspan="2">2642</td> + <td colspan="2">6879</td> + <td colspan="2">1586</td> + <td colspan="2">8651</td> + <td colspan="2">45682</td> + </tr> + <tr> + <td colspan="3">纭曞+姣曚笟鐢�</td> + <td colspan="2">2642</td> + <td colspan="2">6879</td> + <td colspan="2">1586</td> + <td colspan="2">8651</td> + <td colspan="2">45682</td> + </tr> + <tr> + <td colspan="3">鏈姣曚笟鐢�</td> + <td colspan="2">2642</td> + <td colspan="2">6879</td> + <td colspan="2">1586</td> + <td colspan="2">8651</td> + <td colspan="2">45682</td> + </tr> + <tr> + <td colspan="3">涓撶姣曚笟鐢�</td> + <td colspan="2">2642</td> + <td colspan="2">6879</td> + <td colspan="2">1586</td> + <td colspan="2">8651</td> + <td colspan="2">45682</td> + </tr> + + <tr> + <th colspan="1" rowspan="5">3</th> + <td colspan="3">鍏ㄧ渷楂樻牎鏈競鐢熸簮</td> + <td colspan="2">2642</td> + <td colspan="2">6879</td> + <td colspan="2">1586</td> + <td colspan="2">8651</td> + <td colspan="2">45682</td> + </tr> + <tr> + <td colspan="3">鍏朵腑锛氬崥澹瘯涓氱敓</td> + <td colspan="2">2642</td> + <td colspan="2">6879</td> + <td colspan="2">1586</td> + <td colspan="2">8651</td> + <td colspan="2">45682</td> + </tr> + <tr> + <td colspan="3">纭曞+姣曚笟鐢�</td> + <td colspan="2">2642</td> + <td colspan="2">6879</td> + <td colspan="2">1586</td> + <td colspan="2">8651</td> + <td colspan="2">45682</td> + </tr> + <tr> + <td colspan="3">鏈姣曚笟鐢�</td> + <td colspan="2">2642</td> + <td colspan="2">6879</td> + <td colspan="2">1586</td> + <td colspan="2">8651</td> + <td colspan="2">45682</td> + </tr> + <tr> + <td colspan="3">涓撶姣曚笟鐢�</td> + <td colspan="2">2642</td> + <td colspan="2">6879</td> + <td colspan="2">1586</td> + <td colspan="2">8651</td> + <td colspan="2">45682</td> + </tr> + + <tr> + <th colspan="1" rowspan="5">3</th> + <td colspan="3">椹荤煶楂樻牎</td> + <td colspan="2">2642</td> + <td colspan="2">6879</td> + <td colspan="2">1586</td> + <td colspan="2">8651</td> + <td colspan="2">45682</td> + </tr> + <tr> + <td colspan="3">鍏朵腑锛氬崥澹瘯涓氱敓</td> + <td colspan="2">2642</td> + <td colspan="2">6879</td> + <td colspan="2">1586</td> + <td colspan="2">8651</td> + <td colspan="2">45682</td> + </tr> + <tr> + <td colspan="3">纭曞+姣曚笟鐢�</td> + <td colspan="2">2642</td> + <td colspan="2">6879</td> + <td colspan="2">1586</td> + <td colspan="2">8651</td> + <td colspan="2">45682</td> + </tr> + <tr> + <td colspan="3">鏈姣曚笟鐢�</td> + <td colspan="2">2642</td> + <td colspan="2">6879</td> + <td colspan="2">1586</td> + <td colspan="2">8651</td> + <td colspan="2">45682</td> + </tr> + <tr> + <td colspan="3">涓撶姣曚笟鐢�</td> + <td colspan="2">2642</td> + <td colspan="2">6879</td> + <td colspan="2">1586</td> + <td colspan="2">8651</td> + <td colspan="2">45682</td> + </tr> + + <tr> + <th colspan="1" rowspan="5">5</th> + <td colspan="3">椹荤煶楂樻牎鏈競鐢熸簮</td> + <td colspan="2">2642</td> + <td colspan="2">6879</td> + <td colspan="2">1586</td> + <td colspan="2">8651</td> + <td colspan="2">45682</td> + </tr> + <tr> + <td colspan="3">鍏朵腑锛氬崥澹瘯涓氱敓</td> + <td colspan="2">2642</td> + <td colspan="2">6879</td> + <td colspan="2">1586</td> + <td colspan="2">8651</td> + <td colspan="2">45682</td> + </tr> + <tr> + <td colspan="3">纭曞+姣曚笟鐢�</td> + <td colspan="2">2642</td> + <td colspan="2">6879</td> + <td colspan="2">1586</td> + <td colspan="2">8651</td> + <td colspan="2">45682</td> + </tr> + <tr> + <td colspan="3">鏈姣曚笟鐢�</td> + <td colspan="2">2642</td> + <td colspan="2">6879</td> + <td colspan="2">1586</td> + <td colspan="2">8651</td> + <td colspan="2">45682</td> + </tr> + <tr> + <td colspan="3">涓撶姣曚笟鐢�</td> + <td colspan="2">2642</td> + <td colspan="2">6879</td> + <td colspan="2">1586</td> + <td colspan="2">8651</td> + <td colspan="2">45682</td> + </tr> + + <tr> + <th colspan="1" rowspan="4">6</th> + <td colspan="3">绂绘牎鏈氨涓氶珮鏍℃瘯涓氱敓锛�12鏈堝簳锛�</td> + <td colspan="2">2642</td> + <td colspan="2">6879</td> + <td colspan="2">1586</td> + <td colspan="2">8651</td> + <td colspan="2">45682</td> + </tr> + <tr> + <td colspan="3">鍏朵腑锛氳嚜鎰挎殏鏃朵笉灏变笟鍜屾鍦ㄦ眰鑱�</td> + <td colspan="2">2642</td> + <td colspan="2">6879</td> + <td colspan="2">1586</td> + <td colspan="2">8651</td> + <td colspan="2">45682</td> + </tr> + <tr> + <td colspan="3">宸插氨涓�</td> + <td colspan="2">2642</td> + <td colspan="2">6879</td> + <td colspan="2">1586</td> + <td colspan="2">8651</td> + <td colspan="2">45682</td> + </tr> + <tr> + <td colspan="3">灏变笟鐜�</td> + <td colspan="2">2642</td> + <td colspan="2">6879</td> + <td colspan="2">1586</td> + <td colspan="2">8651</td> + <td colspan="2">45682</td> + </tr> + + <tr> + <th colspan="1">7</th> + <td colspan="3">绂绘牎鏈氨涓氶珮鏍℃瘯涓氱敓锛�12鏈堝簳锛�</td> + <td colspan="2">2642</td> + <td colspan="2">6879</td> + <td colspan="2">1586</td> + <td colspan="2">8651</td> + <td colspan="2">45682</td> </tr> </tbody> - </table> + </table>--> + <el-table + :data="tableData" + :span-method="objectSpanMethod" + border> + <el-table-column + align="center" + type="index"> + </el-table-column> + <template v-for="(item,index) in heardArry"> + <el-table-column + align="center" + :prop="item" + :label="item"> + </el-table-column> + </template> + <!--<el-table-column + align="center" + prop="xiangmu" + label="椤圭洰" + width="300"> + </el-table-column> + <el-table-column + align="center" + prop="year" + label="2017骞�"> + </el-table-column> + <el-table-column + align="center" + prop="year" + label="2018骞�"> + </el-table-column> + <el-table-column + align="center" + prop="year" + label="2019骞�"> + </el-table-column> + <el-table-column + align="center" + prop="year" + label="2020骞�"> + </el-table-column>--> + </el-table> </div> </template> <script> + import {getGraduateTable} from '@/api/jiuyeAndChuangye' export default { - name: "biyeshengStatistics" + name: "biyeshengStatistics", + data() { + return { + tableData: [{ + xiangmu: '鏈競楂樻牎', + year: '2333', + mergeRowIndex: 1, + },{ + xiangmu: '鍏朵腑锛氭湰绉戞瘯涓氱敓', + year: '2333', + mergeRowIndex: 1, + },{ + xiangmu: '涓撶姣曚笟鐢�', + year: '2333', + mergeRowIndex: 1, + },{ + xiangmu: '鍏ㄧ渷楂樻牎', + year: '2333', + mergeRowIndex: 2, + },{ + xiangmu: '鍏朵腑锛氭湰绉戞瘯涓氱敓', + year: '2333', + mergeRowIndex: 2, + },{ + xiangmu: '涓撶姣曚笟鐢�', + year: '2333', + mergeRowIndex: 2, + },{ + xiangmu: '鍏ㄧ渷楂樻牎鏈競鐢熸簮', + year: '2333', + mergeRowIndex: 3 + }], + heardArry: [], + rowIndexArr: []//瀛樺偍鍚堝苟鍗曞厓鏍肩殑寮�濮嬩綅缃� + } + }, + mounted() { + this.getGraduateTable() + }, + methods: { + objectSpanMethod({ row, column, rowIndex, columnIndex }) { + + }, + getGraduateTable() { + getGraduateTable().then(res => { + if(res.code == 1000) { + let result = res.list + let head = [] + let rows = [] + head.push('椤圭洰') + if(!result) { + this.tableData = [] + this.heardArry = [] + } + result.forEach((item,index) => { + item.typeList && item.typeList.forEach((e,i) => { + console.log('e------------e',e.name) + console.log(rows[0],'0000000000000000000000000') + if(!rows[i]) { + console.log(rows[i],'rows[index]------rows[index]') + console.log('e------------e----2',e.name) + console.log('index------------index----index',index) + rows[i] = {"椤圭洰" : e.name} + console.log(rows[i],'rows[index]------------1') + } + + e.dataList && e.dataList.forEach((data,k) => { + if(index == 0 && i == 0) { + head.push(data.year) + console.log(head,'head-----=============head') + } + rows[i][data.year] = data.val + console.log(rows[i][data.year],'rows---------333333333') + }) + }) + }) + this.tableData = rows + this.heardArry = head + console.log('this.tableData----this.tableData-----',this.tableData) + } + }) + // let res = this.tableData + // res.reduce((prev, cur, index) => { + // console.log('prev',prev) + // console.log('cur',cur) + // console.log('index',index) + // return cur.mergeRowIndex + // },0) + } + } } </script> -<style scoped> +<style lang="scss"> + @import "../../../../assets/css/base"; + .biyeshengStatistics-wrap{ + .el-table tr{ + background-color: #CEF2FF; + } + .el-table th.el-table__cell{ + background-color: #51D2FF; + } + .el-table__fixed, .el-table__fixed-right,.el-table__fixed-right::before, .el-table__fixed::before{ + background-color: #51D2FF; + } + .el-table--striped .el-table__body tr.el-table__row--striped td.el-table__cell{ + background-color: #A8E9FF; + } + .el-table thead{ + color: #111111; + } + .el-table td.el-table__cell, .el-table th.el-table__cell.is-leaf{ + border-bottom: 1Px solid #8E8E8E; + } + .el-table--border .el-table__cell, .el-table__body-wrapper .el-table--border.is-scrolling-left~.el-table__fixed{ + border-right: 1Px solid #8E8E8E; + } + .el-table .el-table__cell{ + padding: 0.0859375rem /* 22/256 */ 0; + } + .el-table__body tr.hover-row.current-row>td.el-table__cell, .el-table__body tr.hover-row.el-table__row--striped.current-row>td.el-table__cell, .el-table__body tr.hover-row.el-table__row--striped>td.el-table__cell, .el-table__body tr.hover-row>td.el-table__cell{ + background: transparent; + } + .el-table .cell{ + font-size: $fontSize-28; + color: $color-darkGrey; + font-weight: 300; + line-height: 1; + } + } +</style> +<style lang="scss" scoped> + @import "../../../../assets/css/base"; +.biyeshengStatistics-wrap{ + width: 100%; + height: 100%; + overflow-y: auto; + .biyeshengStatistics-table{ + width: 100%; + border: 1Px solid $color-grey; /*no*/ + border-collapse: collapse; + table-layout: fixed; + thead{ + background-color: $color-blue; + tr{ + height: 0.25rem /* 64/256 */; + } + th,td{ + color: $color-darkGrey; + border:1Px solid $color-grey; /*no*/ + font-weight: 300; + font-size: $fontSize-28; + } + } + tbody{ + background-color: #CEF2FF; + height: 3.90625rem /* 1000/256 */; + tr{ + height: 0.25rem /* 64/256 */; + } + th,td{ + color: $color-darkGrey; + text-align: center; + border:1Px solid $color-grey; /*no*/ + font-weight: 300; + font-size: $fontSize-28; + } + } + } +} </style> -- Gitblit v1.9.1