import Header from '@/components/headerNew/index.vue';
import Footer from '@/components/footer/index.vue';
import Left from '@/components/left/index.vue';
import Right from '@/components/right/index.vue';
import Tabs from '@/components/tabs/index.vue';

import Left11 from './comps/left/top/1/index.vue';
import Left21 from './comps/left/middle/1/index.vue';
import Left31 from './comps/left/bottom/1/index.vue';
import Right11 from './comps/right/top/1/index.vue';
import Right21 from './comps/right/middle/1/index.vue';
import Right31 from './comps/right/bottom/1/index.vue';
import Bottom1 from './comps/buttom/1/index.vue';
import Bottom2 from './comps/buttom/2/index.vue';

import Popover from './popover/index.vue';
import MainGis from './main-gis/index.vue';

import { comps } from './data.js'

import { getStatistic } from "@/api/index";
import { getInfo } from "@/api/login";
import {mapGetters} from "vuex";

export default {
  components: {
    MainGis,
    Header,
    Footer,
    Left,
    Right,
    Tabs,
    Left11,
    Left21,
    Left31,
    Right11,
    Right21,
    Right31,
    Popover,
    Bottom2,
    Bottom1
  },
  data () {
    return {
      comps,
      tab: '1',
      allData: {},
      deptIdPage:100
    };
  },
  watch: {
    // year: {
    //   handler () {
    //     this.getData(this.deptIdPage);
    //   },
    //   immediate: true, // 立即执行
    // },
    // deptId: {
    //   handler () {
    //     this.getData(this.deptIdPage);
    //   },
    //   immediate: true, // 立即执行
    // }
  },
  computed: {
    ...mapGetters(['year', 'deptId']),
    currentComp: function () {
      return this.comps[this.tab]
    }
  },
  created () {
    getInfo().then(res => {
      this.deptIdPage = res.user.deptId;
      this.getData(res.user.deptId);
    })
  },
  mounted () {

  },
  methods: {
    getData(deptId){
      this.currentComp.right[0].data = [];
      this.currentComp.right[1].data = [];
      this.currentComp.right[2].data = [];

      this.currentComp.left[0].data = [];
      this.currentComp.left[1].data = [];
      this.currentComp.left[2].data = [];
      getStatistic({deptId: deptId}).then((response) => {
        response.data.jtzyzcDeptList.map(rr => {
          this.currentComp.right[0].data.push({
            name: rr.deptName,
            value: rr.ydmj
          })
        })
        response.data.nysssbDeptList.map(rr => {
          this.currentComp.right[1].data.push({
            name: rr.deptName,
            value: rr.ydmj
          })
        })
        response.data.nhzcDeptList.map(rr => {
          this.currentComp.right[2].data.push({
            name: rr.deptName,
            value: rr.ydmj
          })
        })

        response.data.jtzyzcTypeList.map(rr => {
          this.currentComp.left[0].data.push({
            name: rr.threeDetailType,
            value: rr.ydmj
          })
        })
        response.data.nysssbTypeList.map(rr => {
          this.currentComp.left[1].data.push({
            name: rr.threeDetailType,
            value: rr.ydmj
          })
        })
        response.data.nhzcTypeList.map(rr => {
          this.currentComp.left[2].data.push({
            name: rr.threeDetailType,
            value: rr.ydmj,
            unit: '万元'
          })
        })

        this.currentComp.buttom[0].data = {
          jtzyzc: response.data.jtzyzc,//集体资源资产
          nysssb: response.data.nysssb,//农业设施设备
          nhzc: response.data.nhzc,
        }

        this.currentComp.buttom[1].data = {
          xy23: response.data.xy23,
          xy24: response.data.xy24
        }

        console.log(this.currentComp)
        this.allData = response.data;
      });
    },
    tabChange (info) {
      this.tab = info.id;
    }
  }
};