"use strict";

var _interopRequireDefault = require("@babel/runtime-corejs2/helpers/interopRequireDefault");

exports.__esModule = true;
exports.default = void 0;

require("./Panel.css");

var _component = require("../_utils/component");

var _Portal = _interopRequireDefault(require("../Portal"));

var _vueNormalizeComponent = _interopRequireDefault(require("../_utils/vue-normalize-component.js"));

/* script */
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
//
var id = 0;
var __vue_script__ = {
  name: (0, _component.createComponentName)('tab-panel'),
  components: {
    Portal: _Portal.default
  },
  mixins: [_component.componentMixin],
  inject: ['rootTabs'],
  props: {
    label: {
      type: String,
      default: ''
    },
    name: {
      type: [String, Number],
      required: true
    },
    closable: Boolean,
    disabled: Boolean,
    transitionName: {
      type: String,
      default: ''
    }
  },

  data() {
    id += 1;
    this.id = id;
    return {
      rendered: false
    };
  },

  computed: {
    active() {
      if (!this.name) return false;
      return this.name === this.rootTabs.currentValue;
    },

    target() {
      if (this.rootTabs.isMounted && this.rootTabs.$refs.tabList) {
        var index = this.rootTabs.getIndex(this);
        return this.rootTabs.$refs.tabList.children[index];
      }

      return '';
    }

  },
  watch: {
    active(v) {
      if (this.active && !this.rendered) {
        this.rendered = true;
        this.$emit('loaded');
      }

      if (v) {
        // 打开
        this.$emit('open');
      } else {
        // 关闭
        this.$emit('close');
      }
    },

    label() {
      this.rootTabs.$forceUpdate();
    }

  },

  mounted() {
    this.rootTabs.addPanel(this);

    if (this.active) {
      this.rendered = true;
      this.$emit('loaded');
    }
  },

  destroyed() {
    if (this.rootTabs) this.rootTabs.removePanel(this);
  },

  methods: {
    onClick() {
      this.rootTabs.changeValue(this.value);
    }

  }
};
/* template */

var __vue_render__ = function __vue_render__() {
  var _vm = this;

  var _h = _vm.$createElement;

  var _c = _vm._self._c || _h;

  return _c("transition", {
    attrs: {
      name: _vm.transitionName
    }
  }, [_c("div", {
    directives: [{
      name: "show",
      rawName: "v-show",
      value: _vm.active,
      expression: "active"
    }],
    class: _vm.bem(),
    attrs: {
      role: "tab-panel",
      "data-name": _vm.name,
      "data-active": _vm.active
    }
  }, [_c("Portal", {
    attrs: {
      target: _vm.target
    }
  }, [_vm._t("label", [_c("span", [_vm._v(_vm._s(_vm.label))])], {
    active: _vm.active,
    activeValue: _vm.rootTabs.currentValue
  })], 2), _vm._v(" "), _vm.rendered ? _vm._t("default", null, {
    active: _vm.active,
    actieValue: _vm.rootTabs.currentValue
  }) : _vm._e()], 2)]);
};

var __vue_staticRenderFns__ = [];
__vue_render__._withStripped = true;
/* style */

var __vue_inject_styles__ = undefined;
/* scoped */

var __vue_scope_id__ = undefined;
/* module identifier */

var __vue_module_identifier__ = undefined;
/* functional template */

var __vue_is_functional_template__ = false;
/* component normalizer */

/* style inject */

/* style inject SSR */
var _default = (0, _vueNormalizeComponent.default)({
  render: __vue_render__,
  staticRenderFns: __vue_staticRenderFns__
}, __vue_inject_styles__, __vue_script__, __vue_scope_id__, __vue_is_functional_template__, __vue_module_identifier__, undefined, undefined);

exports.default = _default;