<template>
  <div class="aos-main-title">
    <div class="aos-main-title-left">
      <span class="aos-main-title-name">{{titleName}}</span>
      <span class="aos-main-title-subName">{{subTitleName}}</span>
    </div>
    <!-- <el-breadcrumb separator="/"  class="aos-main-title-left">
      <el-breadcrumb-item 
        v-for="(item,index) in breadcrumbList"
        :key="index"
        :to="item.path"
      >{{item.name}}</el-breadcrumb-item>
    </el-breadcrumb>-->
    <div class="aos-main-title-right">
      <slot></slot>
    </div>
  </div>
</template>
<script>
export default {
  name: "AosMainTitle",
  componentName: "AosMainTitle",
  data() {
    return {
      breadcrumbList: []
    };
  },
  props: {
    name: {
      type: String,
      required: false
    },
    titleName: {
      type: String,
      required: true,
      default: "AOS功能"
    },
    subTitleName: {
      type: String,
      default: ""
    }
  }
  // methods:{
  //   init(){
  //     let breadCrumbStack = window.AosApp.appTab.breadCrumbStack;
  //     let currPath =  this.$route.fullPath;
  //     for(var i = 0;i< breadCrumbStack.length;i++){
  //       if(currPath === breadCrumbStack[i]){
  //         breadCrumbStack.splice(i,breadCrumbStack.length - 1);
  //         window.AosApp.appTab.breadCrumbStack = breadCrumbStack;
  //         this.breadcrumbList = window.AosApp.appTab.breadCrumbStack;
  //         break;
  //       }else {
  //         this.breadcrumbList = [{ name: this.name, path: {path:currPath}}];
  //       }
  //     }
  //   }
  // },
  // mounted(){
  //   this.init();
  // },
  // watch:{
  //   name: function(val){
  //     this.init();
  //   }
  // }
};
</script>
