<template>
  <el-container id="repositoryInfo">
    <awsui-dialog
      :border="false"
      :visible.sync="dialogVisible"
      width="800px"
      :close-on-click-modal=false
      :before-close="handleClose">
      <template>
        <el-tabs v-model="activeName" @tab-click="changeRepositoryType">
          <template v-if="this.methodId != 'default'">
            <el-tab-pane label="文件属性" name="property"></el-tab-pane>
            <el-tab-pane label="版本管理" name="version"></el-tab-pane>
          </template>
          <el-tab-pane label="附件管理" name="upfile"></el-tab-pane>
        </el-tabs>
      </template>
      <component ref="component" :is="repositoryInfoType" :id="id" :versionId="versionId" :isUse="isUse" :isPublish="isPublish" :isStop="isStop" :isApproval="isApproval" :repositoryRefresh="repositoryRefresh"></component>
    </awsui-dialog>
  </el-container>
</template>

<script>
  import RepositoryInfoProperty from "./RepositoryInfoProperty";
  import RepositoryInfoVersion from "./RepositoryInfoVersion";
  import RepositoryInfoUpfile from "./RepositoryInfoUpfile";
  export default {
    name: "RepositoryInfo",
    components: {RepositoryInfoProperty, RepositoryInfoVersion, RepositoryInfoUpfile},
    data() {
      return {
        dialogVisible: false,
        id: '',
        versionId: '',
        type: '',
        activeName: '',
        repositoryInfoType: '',
        isUse: false,
        isPublish: false,
        isStop: false,
        isApproval: false,
        methodId: '',
        parent: undefined
      };
    },
    methods: {
      clearParam() {
        this.dialogVisible = false;
        this.id = '';
        this.versionId = '';
        this.type = '';
        this.repositoryInfoType = '';
        this.isUse = false;
        this.isPublish = false;
        this.isStop = false;
        this.isApproval = false;
        this.methodId = '';
        this.parent = undefined;
      },
      openRepositoryInfoDlg(parent, id, versionId, type, isUse, isPublish, isStop, isApproval, methodId) {
        this.id = id;
        this.versionId = versionId;
        this.type = type;
        this.activeName = type;
        this.initInfoChildType(type);
        this.dialogVisible = true;
        this.isUse = isUse;
        this.isPublish = isPublish;
        this.isStop = isStop;
        this.isApproval = isApproval;
        this.methodId = methodId;
        this.parent = parent;
      },
      initInfoChildType(type) {
        if (type == 'property') {
          this.repositoryInfoType = 'RepositoryInfoProperty';
        } else if (type == 'version') {
          this.repositoryInfoType = 'RepositoryInfoVersion';
        } else if (type == 'upfile') {
          this.repositoryInfoType = 'RepositoryInfoUpfile'
        } else {
          this.repositoryInfoType = '';
        }
      },
      repositoryRefresh(id) {// 版本管理中切换版本后刷新父页面树
        if (this.parent) {
          if (this.parent.refreshTreeParentNode) {
            this.parent.refreshTreeParentNode(id);
          }
          this.parent.initData();
        }
      },
      handleClose(done) {
        this.clearParam();
        done();
      },
      changeRepositoryType(tab, event) {// 切换tab
        this.initInfoChildType(tab.name)
      }
    }
  }
</script>

<style scoped>
  #repositoryInfo >>> .awsui-dialog__body {
    padding: 10px 20px 20px 20px;
    color: #606266;
    font-size: 14px;
    word-break: break-all;
  }
  #repositoryInfo >>> .awsui-dialog__header {
    padding: 0;
  }
  #repositoryInfo >>> .el-tabs__nav-wrap:after {
    content: "";
    position: absolute;
    left: 0;
    bottom: 0;
    width: 100%;
    height: 1px;
    background-color: #F2F2F2;
    z-index: 1;
  }
  #repositoryInfo >>> .el-tabs__active-bar {
    height: 1px;
    background-color: #4E7FF9;
  }
  #repositoryInfo >>> .el-tabs__item.is-active {
    color: #4E7FF9;
  }
  #repositoryInfo >>> .el-tabs__item {
    color: #606266;
  }
  #repositoryInfo >>> .awsui-dialog__headerbtn {
    z-index: 999;
  }
</style>
