tmr-admin/.svn/pristine/11/11788a31eb79cdf7f8eb4461f1ef19c7a11ee780.svn-base

<template>
  <div class="app-container">
    <h1>集团</h1>
    <el-tabs v-model="activeName" @tab-click="handleTabClick">
      <el-tab-pane label="汇总统计" name="first">
        <component :is="myComponent1" ref="detail1" />
      </el-tab-pane>
      <el-tab-pane label="混料统计" name="second">
        <keep-alive>
          <component :is="myComponent2" ref="detail2" />
        </keep-alive>
      </el-tab-pane>
      <el-tab-pane label="撒料统计" name="third">
        <keep-alive>
          <component :is="myComponent3" ref="detail3" />
        </keep-alive>
      </el-tab-pane>
    </el-tabs>
  </div>
</template>

<script>
import echarts from 'echarts'

require('echarts/theme/macarons')
import { GetDataByName, GetReportform } from '@/api/common'
import Cookies from 'js-cookie'
import { parseTime } from '@/utils/index.js'
import Pagination from '@/components/Pagination'
import { json2excel } from '@/utils/index.js'
import { MessageBox } from 'element-ui'
import Tab1 from './tab1'
import Tab2 from './tab2'
export default {
  name: 'GroupErrorAnalysis',
  components: { Pagination, Tab1, Tab2 },
  data() {
    return {
      activeName: 'first',
      myComponent1: null,
      myComponent2: null,
      myComponent3: null
    }
  },

  created() {},
  mounted() {
    this.detailComponent1()
  },
  methods: {
    detailComponent1() {
      if (this.activeName == 'first') {
        const vue = this
        var myComponent1 = () => import('./tab1.vue')
        return vue.myComponent1 = myComponent1
      }
    },
    handleTabClick() {
      if (this.activeName == 'first') {
        const vue = this
        var myComponent1 = () => import('./tab1.vue')
        return vue.myComponent1 = myComponent1
      } else if (this.activeName == 'second') {
        const vue = this
        var myComponent2 = () => import('./tab2.vue')
        return vue.myComponent2 = myComponent2
      } else if (this.activeName == 'third') {
        const vue = this
        var myComponent3 = () => import('./tab3.vue')
        return vue.myComponent3 = myComponent3
      }
    }

  }
}
</script>
<style lang="scss" scoped>
  .search{margin-bottom:10px;}
</style>