毕业生统计接口对接

zhangxiaoxu123456

2022-04-21 71da7c5aa9ebaeaadf459a5092a5fbcd1aeffdfa

 src/pages/show/jiuyeAndChuangye/jiuyeChildren/biyeshengStatistics.vue

@@ -1,6 +1,6 @@
<template>
    <div class="biyeshengStatistics-wrap">
      <table class="biyeshengStatistics-table">
      <!--<table class="biyeshengStatistics-table">
        <thead>
          <tr>
            <th colspan="1">序号</th>
@@ -251,16 +251,187 @@
            <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 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{