<!--
 * @Description: 系统日志页面
 * @Author: liusheng
 * @Date: 2021-01-17 22:43:52
-->
<template>
  <div class="body">
    <el-tabs class="tab-header" v-model="activeIndex" type="card" @tab-click="handleClick">
      <el-tab-pane v-for="app in appList" :key="app.index" :label="app.name" :name="app.index" />
      <sys-log-panel :curApplication="appList[activeIndex]" />
    </el-tabs>
  </div>
</template>

<script>
import SysLogPanel from "./SysLogPanel.vue";

export default {
  name: 'SysLog',
  components: {
     'sys-log-panel': SysLogPanel,
  },

  data() {
    return {
      appList: [],
      activeIndex: '',
      activeItem: {},
    }
  },

  methods: {
    handleClick(tab, _event) {
      this.activeItem = this.appList[parseInt(this.activeIndex)];
    }
  },

  mounted() {
    this.appAxios("GET", this.commonUrl.URL_LIST_LOG_TYPES).then(result => {
      if (result != null) {
        this.appList = result.data;
        this.appList.forEach((item, index) =>  {
          item.index = index.toString();
        })
        this.activeIndex = (this.appList.length - 1).toString();
        this.activeItem = this.appList[parseInt(this.activeIndex)];
      }
    })
  }
}
</script>

<style scoped>
.body {
  margin: 0 20px;
  text-align: center;
  border: solid 0px;
}
.tab-header {
  margin: 0 20px;
}
</style>
