| <template> | 
|   <el-tabs v-model="activeName" type="card" @tab-click="handleClick" style="height: 100%"> | 
|     <el-tab-pane  name="first"> | 
|       <span slot="label"><i class="el-icon-date"></i> 空气质量小时播报</span> | 
|       <keep-alive> | 
|         <hourly-broadcast/> | 
|       </keep-alive> | 
|     </el-tab-pane> | 
|     <el-tab-pane label="配置管理" name="second"> | 
|       <span slot="label"><i class="el-icon-date"></i> 全市空气质量考核排名</span> | 
|       <ranking-air-quality-city style="height: 100%"/> | 
|     </el-tab-pane> | 
|     <el-tab-pane label="角色管理" name="third">角色管理</el-tab-pane> | 
|     <el-tab-pane label="定时任务补偿" name="fourth">定时任务补偿</el-tab-pane> | 
|   </el-tabs> | 
| </template> | 
|   | 
| <script> | 
| import HourlyBroadcast from '@/views/airQualityReportDisplay/HourlyBroadcast' | 
| import RankingAirQualityCity from '@/views/airQualityReportDisplay/RankingAirQualityCity' | 
| export default { | 
|   components: { | 
|     HourlyBroadcast, | 
|     RankingAirQualityCity | 
|   }, | 
|   data() { | 
|     return { | 
|       activeName: 'first' | 
|     } | 
|   }, | 
|   created() { | 
|   }, | 
|   methods: { | 
|     handleClick(tab, event) { | 
|       // console.log(tab, event) | 
|     } | 
|   } | 
| } | 
| </script> | 
|   | 
| <style scoped> | 
|   | 
| </style> |