<template>
|
<div>
|
<el-tabs v-model="activeName" @tab-click="handleClick">
|
<el-tab-pane v-for="(item,index) in topicList" :key="index" :label="item.name" :name="item.name"></el-tab-pane>
|
</el-tabs>
|
<div>
|
<component :is="gcComp"></component>
|
</div>
|
</div>
|
</template>
|
|
<script>
|
|
import WasteWater from '@components/table/components/WasteWater'
|
import SoilGroundwater from '@components/table/components/SoilGroundwater'
|
import WasteGas from '@components/table/components/WasteGas'
|
import SolidWaste from '@components/table/components/WasteSolid'
|
import PollutionSource from '@components/table/components/PollutionSource'
|
import EnvironmentalRisk from '@components/table/components/EnvironmentalRisk'
|
import Pipeline from '@components/table/components/Pipeline'
|
import CorporateEmergency from '@components/table/components/CorporateEmergency'
|
|
import { TopicList } from '../../../conf/Topic'
|
export default {
|
name: 'tabHandover',
|
components: {
|
WasteWater,
|
// WasteGas,
|
// SoilGroundwater,
|
SolidWaste,
|
PollutionSource,
|
EnvironmentalRisk,
|
Pipeline,
|
CorporateEmergency
|
},
|
data () {
|
return {
|
titleProp: '',
|
activeName: '污染源',
|
topicList: TopicList, // tab项
|
gcComp: PollutionSource // 默认显示污染源内容
|
}
|
},
|
methods: {
|
refsDatatitle (item) {
|
this.titleProp = item
|
},
|
handleClick (tab, event) {
|
switch (tab.label) {
|
case '污染源':
|
this.gcComp = PollutionSource
|
break
|
case '废水':
|
this.gcComp = WasteWater
|
break
|
case '废气':
|
this.gcComp = WasteGas
|
break
|
case '固废':
|
this.gcComp = SolidWaste
|
break
|
case '环境风险':
|
this.gcComp = EnvironmentalRisk
|
break
|
case '土壤及地下水':
|
this.gcComp = SoilGroundwater
|
break
|
case '管线':
|
this.gcComp = Pipeline
|
break
|
case '企业应急':
|
this.gcComp = CorporateEmergency
|
break
|
}
|
}
|
}
|
}
|
</script>
|
|
<style scoped>
|
|
</style>
|
