| 12345678910111213141516171819202122232425262728293031323334353637383940414243444546474849505152535455565758596061626364656667686970717273747576777879 | <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>
 |