<!--
 * @Description: create
 * @Version: 1.0
 * @Autor: XuTongZhang
 * @Date: 2020-08-03 15:00:31
 * @LastEditors: XuTongZhang
 * @LastEditTime: 2020-08-12 18:37:45
-->
<template>
  <div>
    <div class="flex">
      <div ref="mychart1" :style="{width: '75%', height: '500px'}"></div>
      <div class="flex1">
        <div>
          <div class="num">校招投递简历总数 {{schoolTotal||0}}条</div>
          <div class="num">社招投递简历总数 {{clubTotal||0}}条</div>
        </div>
        <div>
          <div class="title">本周</div>
          <div class="num">校招投递简历数  {{schoolWeek||0}}条</div>
          <div class="num">社招投递简历数  {{clubWeek||0}}条</div>
        </div>
      </div>
    </div>
    <div class="flex">
      <div ref="mychart2" :style="{width: '75%', height: '300px'}"></div>
    </div>
  </div>
</template>

<script>
import echarts from 'echarts'
export default {
  data () {
    return {
      timeList: [],
      clubRecruit: [],
      schoolRecruit: [],
      clubTotal: 0,
      schoolTotal: 0,
      clubWeek: 0,
      schoolWeek: 0
    }
  },
  mounted () {
    this.queryData()
  },
  methods: {
    queryData () {
      this.$api
        .post('/chart/getResumeChart', {
          reqdata: {
            recruitType: 0
          }
        })
        .then((res) => {
          console.log(res)
          this.timeList = res.object.weekList
          this.clubRecruit = res.object.countList
          this.clubTotal = res.object.countTotal
          this.clubWeek = this.clubRecruit[this.clubRecruit.length - 1]
          this.$api
            .post('/chart/getResumeChart', {
              reqdata: {
                recruitType: 1
              }
            })
            .then((res) => {
              let arr = []
              arr.length = this.timeList.indexOf(res.object.weekList[0])
              this.schoolRecruit = [...arr, ...res.object.countList]
              this.schoolTotal = res.object.countTotal
              // console.log(this.schoolTotal)
              this.schoolWeek = this.schoolRecruit[this.schoolRecruit.length - 1]
              this.initChart()
            })
        })
    },
    initChart () {
      let myChart = echarts.init(this.$refs.mychart1)
      myChart.setOption({
        title: {
          text: '简历投递信息'
        },
        tooltip: {
          trigger: 'axis'
        },
        legend: {
          data: ['校招投递简历', '社招投递简历']
        },
        grid: {
          left: '3%',
          right: '4%',
          bottom: '3%',
          containLabel: true
        },
        // toolbox: {
        //   feature: {
        //     saveAsImage: {}
        //   }
        // },
        xAxis: {
          type: 'category',
          boundaryGap: false,
          data: this.timeList.map(item => item.substring(0, 10)),
          axisLabel: {
            interval: 0,
            rotate: -80
          }
        },
        yAxis: {
          type: 'value'
        },
        series: [
          {
            name: '校招投递简历',
            type: 'line',
            data: this.schoolRecruit
          },
          {
            name: '社招投递简历',
            type: 'line',
            data: this.clubRecruit
          }
        ]
      })
      setTimeout(function () {
        window.onresize = function () {
          myChart.resize()
        }
      }, 200)
    }
  }
}
</script>

<style lang="scss" scoped>
  .flex {
    display: flex;
  }
  .flex1 {
    width: 200px;
    margin-top: 00px;
    margin-left: 80px;
  }
  .num {
    margin: 20px;
    font-size: 14px;
  }
</style>
