<template>
  <div>
    <el-tabs v-model="activeName" @tab-click="handleTabClick">
      <el-tab-pane label="选择文章" name="byArticle">
        <link-picker-article ref="byArticle" :catalog-tree="catalogTree"></link-picker-article>
      </el-tab-pane>
      <el-tab-pane label="选择栏目" name="byCatalog">
        <link-picker-catalog ref="byCatalog" :catalog-tree="catalogTree"></link-picker-catalog>
      </el-tab-pane>
    </el-tabs>
  </div>
</template>
<script>
import linkPickerArticle from './LinkPickerArticle.vue'
import linkPickerCatalog from './LinkPickerCatalog.vue'
export default {
  components: {
    linkPickerArticle, linkPickerCatalog
  },
  data() {
    return {
      activeName: 'byArticle',
      siteID: window.initdata.siteID,
      catalogTree: []
    }
  },
  created() {
    this.loadingCatalogTree()
  },
  methods: {
    async loadingCatalogTree() {
      let bindEditorTree = await axios.get('/ui/catalog/bindeditortree', {
        params: {
          siteID: this.siteID
        }
      })
      this.catalogTree = bindEditorTree.data.data
    },
    handleTabClick(val) {
    },
    getValue() {
      var linkObj = this.$refs[this.activeName].getValue()
      if (linkObj === null) {
        this.$message({
          message: this.activeName === 'byArticle' ? '请选择文章' : '请选择栏目',
          type: 'warning'
        })
        return null
      } else {
        return linkObj
      }
    }
  }
}
</script>
<style></style>
