<template>
  <div class="e-object-container">
    <el-tabs v-model="activeName" @tab-click="handleClick">
      <el-tab-pane label="项目信息" name="info">
        <e-object-info v-if="activeName === 'info'" :infoData="projectInfo || {}" :projectTypeOptions="projectTypeOptions"></e-object-info>
      </el-tab-pane>
      <el-tab-pane label="租户" name="tenant">
        <e-object-tenant v-if="activeName === 'tenant'" :infoData="projectInfo || {}"/>
      </el-tab-pane>
      <el-tab-pane label="空间" name="space">
        <e-object-space v-if="activeName === 'space'" :infoData="projectInfo || {}"/>
      </el-tab-pane>
    </el-tabs>
  </div>
</template>
<script>
import EObjectInfo from './EObjectInfo'
import EObjectSpace from  './EObjectSpace'
import EObjectTenant from './EObjectTenant'
export default {
  name: 'EObjectContainer',
  components: {
    EObjectInfo,
    EObjectSpace,
    EObjectTenant
  },
  props: {
    projectInfo: {
      type: Object,
      require: true
    },
    projectTypeOptions: {
      type: Array
    }
  },
  data() {
    return  {
      activeName: 'info'
    }
  },
  methods: {
    handleClick(tab, event) {
      console.log(tab, event);
    }
  }
}
</script>
