vue-ant-patterns/lib/d-form-border/formborder.js

vue-ant-patterns

'use strict';

Object.defineProperty(exports, "__esModule", {
  value: true
});

var _defineProperty2 = require('babel-runtime/helpers/defineProperty');

var _defineProperty3 = _interopRequireDefault(_defineProperty2);

var _vueTypes = require('ant-design-vue/lib/_util/vue-types');

var _vueTypes2 = _interopRequireDefault(_vueTypes);

var _classnames = require('classnames');

var _classnames2 = _interopRequireDefault(_classnames);

var _formborderitem = require('./formborderitem');

var _formborderitem2 = _interopRequireDefault(_formborderitem);

function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { 'default': obj }; }

var DFormBorder = {
  name: 'DFormBorder',
  props: {
    prefixCls: _vueTypes2['default'].string.def('depot-dformborder'),
    // 主标题
    title: _vueTypes2['default'].any,
    // 是否隐藏锚点
    hiddenanchor: _vueTypes2['default'].bool.def(true)
  },
  Item: _formborderitem2['default'],
  data: function data() {
    return {
      defaultActiveKey: []
    };
  },

  methods: {
    panelRender: function panelRender() {
      var h = this.$createElement;
      var prefixCls = this.prefixCls;

      var panel = this.$slots.panel;
      return panel.map(function (item, index) {
        var panelWrapper = {
          key: String(index),
          props: {
            header: item.data.attrs.title,
            key: item.data.key
          },
          'class': (0, _classnames2['default'])((0, _defineProperty3['default'])({}, prefixCls + '-panel', true))
        };
        return h(
          'a-collapse-panel',
          panelWrapper,
          [item]
        );
      });
    }
  },
  render: function render() {
    var _cx5;

    var h = arguments[0];
    var prefixCls = this.prefixCls,
        $slots = this.$slots,
        title = this.title,
        hiddenanchor = this.hiddenanchor;
    var tileft = $slots.tileft,
        tiright = $slots.tiright;


    var titleWrapper = {
      'class': (0, _classnames2['default'])((0, _defineProperty3['default'])({}, prefixCls + '-title', true))
    };

    var contentWrapper = {
      'class': (0, _classnames2['default'])((0, _defineProperty3['default'])({}, prefixCls + '-content', true))
    };

    var panels = this.panelRender();

    var defaultActiveKey = [];
    panels.forEach(function (item, index) {
      defaultActiveKey.push(String(index));
    });
    var collapseWrapper = {
      props: {
        bordered: false,
        defaultActiveKey: defaultActiveKey
      },
      'class': (0, _classnames2['default'])((0, _defineProperty3['default'])({}, '' + prefixCls, true))
    };

    var anchorWrapper = {
      'class': (0, _classnames2['default'])((_cx5 = {}, (0, _defineProperty3['default'])(_cx5, prefixCls + '-content-anchor', true), (0, _defineProperty3['default'])(_cx5, prefixCls + '-content-anchor-hidden', hiddenanchor), _cx5))
    };

    return h('div', [h(
      'div',
      titleWrapper,
      [title ? h(
        'span',
        { 'class': prefixCls + '-title-text' },
        [title]
      ) : tileft ? tileft : '', tiright ? tiright : '']
    ), h(
      'div',
      contentWrapper,
      [h(
        'div',
        { 'class': prefixCls + '-content-coll' },
        [h(
          'a-collapse',
          collapseWrapper,
          [panels]
        )]
      ), h(
        'div',
        anchorWrapper,
        [h('a-anchor', ['\u951A\u70B9'])]
      )]
    )]);
  }
};

exports['default'] = DFormBorder;