web/src/views/dashboard-screen/screen/sjdr/dlydts/index.vue

<template>
  <div class="common-wrap">
    <el-card class="content-z" style="position: relative">
      <a-button
        class="right-upload-btn"
        ghost
        type="primary"
        icon="upload"
        @click="$refs.fileDom.click()"
      >导入
      </a-button>
      <input id="fileDom" type="file" ref="fileDom" style="display: none" @change="handleImport($event)">
      <a-tabs v-model="activeKey" type="card" v-if="readyRender">
        <a-tab-pane
          v-for="item in tabs"
          :key="item.name"
          :tab="item.title"
        >
          <component
            :is="item.name"
            v-if="activeKey === item.name"
          />
        </a-tab-pane>
      </a-tabs>
    </el-card>
  </div>

</template>
<script>

import Tab1 from './tab1.vue'
import Tab2 from './tab2.vue'
import Tab3 from './tab3.vue'
import { ChartImport } from '@/api/dashboard-json'

export default {
  name: 'Ycxx',
  components: {
    Tab1,
    Tab2,
    Tab3
  },
  data() {
    return {
      readyRender: true,
      activeKey: 'Tab1',
      tabs: [{
        title: '远动调试',
        name: 'Tab1'
      },
      {
        title: '高受电',
        name: 'Tab2'
      },
      {
        title: '高试验',
        name: 'Tab3'
      }
      ]
    }
  },
  handleExportXls() {

  },
  computed: {},
  methods: {
    handleImport(evt) {
      window.console.log('evt', evt)
      const file = evt.target.files[0]
      evt.target.value = null
      ChartImport('scrwb', file).then(res => {
        console.log('res => ', res)
        if (res.code === 200) {
          this.$message.success('导入成功')
          this.readyRender = false
          setTimeout(() => {
            this.readyRender = true
          }, 200)
        } else {
          this.$message.success('导入失败')
        }
      })
    }
  }
}
</script>
<style scoped>
@import '~@/assets/less/common.less'
</style>