付延余
2022-04-18 9904324c3b5e4182339615e85ae6036888496312
src/pages/show/otherBusiness/otherBusinessChild/OtherB_PeopleJunShouRu.vue
@@ -4,31 +4,40 @@
      <h1>全市居民人均可支配收入情况</h1>
      <el-table
        :data="tableData"
        style="width: 100%">
        style="width: 100%" :cell-style="updataCellStyle">
        <el-table-column
          prop="year"
          label="年份">
          label="年份" min-width="80"
          fied="left"
        >
        </el-table-column>
        <el-table-column
          label="国民人均可支配收入">
          <el-table-column
            prop="shouru"
            label="收入(元)"
            min-width="80"
          >
          </el-table-column>
          <el-table-column
            prop="quanshengpaiwei"
            label="全省排名"
            min-width="80"
          >
          </el-table-column>
          <el-table-column
            prop="zengzhang"
            label="增长"
            min-width="80"
          >
          </el-table-column>
          <el-table-column
            prop="quanshengpaiwei1"
            label="全省排位"
            min-width="80"
          >
          </el-table-column>
        </el-table-column>
@@ -36,21 +45,29 @@
          <el-table-column
            prop="shouru1"
            label="收入(元)"
            min-width="80"
          >
          </el-table-column>
          <el-table-column
            prop="quanshengpaiwei2"
            label="全省排位"
            min-width="80"
          >
          </el-table-column>
          <el-table-column
            prop="zengzhang1"
            label="增长"
            min-width="80"
          >
          </el-table-column>
          <el-table-column
            prop="quanshengpaiwei3"
            label="全省排位"
            min-width="80"
          >
          </el-table-column>
        </el-table-column>
@@ -58,21 +75,27 @@
          <el-table-column
            prop="shouru2"
            label="收入(元)"
            min-width="80"
          >
          </el-table-column>
          <el-table-column
            prop="quashengpaiwei4"
            label="全省排位"
            min-width="80"
          >
          </el-table-column>
          <el-table-column
            prop="zengzhang2"
            label="增长 "
            min-width="80"
          >
          </el-table-column>
          <el-table-column
            prop="quanshengpaiwei5"
            label="全省排位"
            min-width="80"
          >
          </el-table-column>
        </el-table-column>
@@ -209,14 +232,14 @@
        },
        series: [
          {
            name:'居民人均可支配收入',
            name: '居民人均可支配收入',
            type: 'line',
            smooth: false,  //设置折线为圆滑曲线,false则有转折点
            // symbol:'none', //默认显示折点,为none时不显示
            itemStyle: {
              normal: {
                lineStyle: {
                  width: 4, //折线宽度
                  width: 3, //折线宽度
                }
              }
            },
@@ -228,7 +251,7 @@
            data: [120, 132, 101, 134, 90, 230]
          },
          {
            name:'城镇居民',
            name: '城镇居民',
            type: 'line',
            smooth: false,  //设置折线为圆滑曲线,false则有转折点
            // symbol:'none', //默认显示折点,为none时不显示
@@ -247,7 +270,7 @@
            data: [220, 182, 191, 234, 290, 330]
          },
          {
            name:'农村居民',
            name: '农村居民',
            type: 'line',
            smooth: false,  //设置折线为圆滑曲线,false则有转折点
            // symbol:'none', //默认显示折点,为none时不显示
@@ -277,6 +300,14 @@
      const option = this.option
      const myChart = this.$echarts.init(document.querySelector('.OtherB-PeopleJunShouRu__echart'));
      option && myChart.setOption(this.option)
    },
    // 给单独单元格添加样式
    updataCellStyle({rowIndex, columnIndex}) {
      if (rowIndex ===0 && columnIndex === 0) {
        return {background:'#51D2FF'}
      }else if(rowIndex===1 && columnIndex ===0){
        return {background:'#51D2FF'}
      }
    }
  }
}
@@ -286,17 +317,14 @@
@import "../../../../assets/css/base";
.OtherB-PeopleJunShouRu__table {
  width: 100%;
  height: calc(100% - 0.078125rem /* 20/256 */
  );
  margin-top: 0.078125rem /* 20/256 */
;
  .el-table--enable-row-hover .el-table__body tr:hover > td.el-table__cell {
    background: transparent;
  }
  .el-table th.el-table__cell {
    background-color: $color-blue;
    height: 0.3125rem /* 80/256 */
  ;
  }
  .el-table tr {
@@ -324,7 +352,7 @@
  }
  .el-table .cell {
    font-size: $fontSize-24;
    font-size: 0.09375rem;
    color: $color-darkGrey;
    font-weight: 300;
    line-height: 0.390625rem;
@@ -363,6 +391,7 @@
  //);
  .OtherB-PeopleJunShouRu__table {
    width: 100%;
    margin-top: 0.078125rem /* 20/256 */
  ;