echarts添加显示隐藏按钮

zhangxiaoxu123

2022-09-14 77536cfa95b1e3c5e60f94dce3a53aa2e93f121a

 src/pages/show/personnelTalents/personnelTalentsChild/PersonnelTalents_UnitPersonnel.vue

@@ -46,9 +46,12 @@
          </el-radio>
        </el-radio-group>
      </div>
      <div class="PT_unitPersonnel--Echarts" v-show="isShow"></div>
      <div class="PT_unitPersonnel--Echarts" v-show="echartsShow"></div>
    </div>

    <div class="yincang-box">
      <el-button @click="showEchartsBtn" v-show="echartsShow" type="primary">隐藏</el-button>
      <el-button @click="showEchartsBtn" v-show="!echartsShow" type="primary">显示</el-button>
    </div>
  </div>
</template>

@@ -144,7 +147,7 @@
      checkedCategory: '事业单位',
      CARE_GORY: ['事业单位', '在职人员', '年人均收入'],
      tableHeight: window.innerHeight - nowSize(1000),
      isShow: true,
      echartsShow: true,
      echartSeries: {},
      selectIndex: {
        type: 1
@@ -157,6 +160,14 @@
    this.getUnitLine()
  },
  methods: {
    showEchartsBtn() {
        this.echartsShow = !this.echartsShow
        if(this.echartsShow) {
            this.tableHeight = window.innerHeight - nowSize(960)
        }else {
            this.tableHeight = window.innerHeight - nowSize(320)
        }
    },
    mergeColumnTableCell({rowIndex, columnIndex}) {
      if (columnIndex === 0) {
        if (rowIndex === 0) {
@@ -182,7 +193,7 @@
      const option = {
        color: ['#FF5151', '#51FF5D', '#FFD151'],
        title: {
          text: '历年全市居民人均可支配收入分析图',
          text: '近一年事业数量变化趋势图',
          left: 'center',
          top: '5%',
          textStyle: {
@@ -275,17 +286,17 @@
        },
        series: [
          {
            name: '居民人均可支配收入',
            name: '全市',
            type: 'line',
            data: this.echartSeries.quanshi
          },
          {
            name: '城镇居民',
            name: '市直',
            type: 'line',
            data: this.echartSeries.shizhi
          },
          {
            name: '农村居民',
            name: '县（市、区）',
            type: 'line',
            data: this.echartSeries.xian
          }
@@ -301,21 +312,6 @@
      this.selectIndex.type = index + 1
      this.getUnitLine()
      this.Init_echarts()
      // switch(index){
      //   case 0:
      //     this.isShow = true;
      //     this.getUnitLine()
      //     this.Init_echarts()
      //     break;
      //   // case 1:
      //   //   this.getUnitLine()
      //   //   this.Init_echarts()
      //   //   console.log('我是1');
      //   //   break;
      //   default:
      //     this.isShow = false;
      //     break;
      // }
    },
    // 29. 查询事业单位人员情况表格数据接口
    getPersonTable() {
@@ -459,7 +455,12 @@
.PersonnelTalents_unitPersonnel--warp {
  width: 100%;
  height: 100%;

  position: relative;
  .yincang-box{
    position: absolute;
    right: 0.078125rem  /* 20/256 */;
    bottom: 0;
  }
  .PT_unitPersonnel--table {
    width: 100%;
  }
@@ -472,7 +473,6 @@
    height: calc(100% - 2.5rem/* 640/256 */ - 0.254375rem /* 60/256 */
    );
    position: relative;

    .PT_navEchart--title {
      width: 1px;
      display: inline-block;