jnpf-web-vue3/node_modules/ant-design-vue/es/card/Card.js

import _objectSpread from "@babel/runtime/helpers/esm/objectSpread2";
import { resolveDirective as _resolveDirective, createVNode as _createVNode } from "vue";
import { isVNode, defineComponent } from 'vue';
import Tabs from '../tabs';
import PropTypes from '../_util/vue-types';
import { flattenChildren, isEmptyElement, filterEmptyWithUndefined } from '../_util/props-util';
import isPlainObject from 'lodash-es/isPlainObject';
import useConfigInject from '../config-provider/hooks/useConfigInject';
import devWarning from '../vc-util/devWarning';
import useStyle from './style';
import Skeleton from '../skeleton';
import { customRenderSlot } from '../_util/vnode';
const {
  TabPane
} = Tabs;
export const cardProps = () => ({
  prefixCls: String,
  title: PropTypes.any,
  extra: PropTypes.any,
  bordered: {
    type: Boolean,
    default: true
  },
  bodyStyle: {
    type: Object,
    default: undefined
  },
  headStyle: {
    type: Object,
    default: undefined
  },
  loading: {
    type: Boolean,
    default: false
  },
  hoverable: {
    type: Boolean,
    default: false
  },
  type: {
    type: String
  },
  size: {
    type: String
  },
  actions: PropTypes.any,
  tabList: {
    type: Array
  },
  tabBarExtraContent: PropTypes.any,
  activeTabKey: String,
  defaultActiveTabKey: String,
  cover: PropTypes.any,
  onTabChange: {
    type: Function
  }
});
const Card = defineComponent({
  compatConfig: {
    MODE: 3
  },
  name: 'ACard',
  inheritAttrs: false,
  props: cardProps(),
  slots: Object,
  setup(props, _ref) {
    let {
      slots,
      attrs
    } = _ref;
    const {
      prefixCls,
      direction,
      size
    } = useConfigInject('card', props);
    const [wrapSSR, hashId] = useStyle(prefixCls);
    const getAction = actions => {
      const actionList = actions.map((action, index) => isVNode(action) && !isEmptyElement(action) || !isVNode(action) ? _createVNode("li", {
        "style": {
          width: `${100 / actions.length}%`
        },
        "key": `action-${index}`
      }, [_createVNode("span", null, [action])]) : null);
      return actionList;
    };
    const triggerTabChange = key => {
      var _a;
      (_a = props.onTabChange) === null || _a === void 0 ? void 0 : _a.call(props, key);
    };
    const isContainGrid = function () {
      let obj = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : [];
      let containGrid;
      obj.forEach(element => {
        if (element && isPlainObject(element.type) && element.type.__ANT_CARD_GRID) {
          containGrid = true;
        }
      });
      return containGrid;
    };
    return () => {
      var _a, _b, _c, _d, _e, _f;
      const {
        headStyle = {},
        bodyStyle = {},
        loading,
        bordered = true,
        type,
        tabList,
        hoverable,
        activeTabKey,
        defaultActiveTabKey,
        tabBarExtraContent = filterEmptyWithUndefined((_a = slots.tabBarExtraContent) === null || _a === void 0 ? void 0 : _a.call(slots)),
        title = filterEmptyWithUndefined((_b = slots.title) === null || _b === void 0 ? void 0 : _b.call(slots)),
        extra = filterEmptyWithUndefined((_c = slots.extra) === null || _c === void 0 ? void 0 : _c.call(slots)),
        actions = filterEmptyWithUndefined((_d = slots.actions) === null || _d === void 0 ? void 0 : _d.call(slots)),
        cover = filterEmptyWithUndefined((_e = slots.cover) === null || _e === void 0 ? void 0 : _e.call(slots))
      } = props;
      const children = flattenChildren((_f = slots.default) === null || _f === void 0 ? void 0 : _f.call(slots));
      const pre = prefixCls.value;
      const classString = {
        [`${pre}`]: true,
        [hashId.value]: true,
        [`${pre}-loading`]: loading,
        [`${pre}-bordered`]: bordered,
        [`${pre}-hoverable`]: !!hoverable,
        [`${pre}-contain-grid`]: isContainGrid(children),
        [`${pre}-contain-tabs`]: tabList && tabList.length,
        [`${pre}-${size.value}`]: size.value,
        [`${pre}-type-${type}`]: !!type,
        [`${pre}-rtl`]: direction.value === 'rtl'
      };
      const loadingBlock = _createVNode(Skeleton, {
        "loading": true,
        "active": true,
        "paragraph": {
          rows: 4
        },
        "title": false
      }, {
        default: () => [children]
      });
      const hasActiveTabKey = activeTabKey !== undefined;
      const tabsProps = {
        size: 'large',
        [hasActiveTabKey ? 'activeKey' : 'defaultActiveKey']: hasActiveTabKey ? activeTabKey : defaultActiveTabKey,
        onChange: triggerTabChange,
        class: `${pre}-head-tabs`
      };
      let head;
      const tabs = tabList && tabList.length ? _createVNode(Tabs, tabsProps, {
        default: () => [tabList.map(item => {
          const {
            tab: temp,
            slots: itemSlots
          } = item;
          const name = itemSlots === null || itemSlots === void 0 ? void 0 : itemSlots.tab;
          devWarning(!itemSlots, 'Card', `tabList slots is deprecated, Please use \`customTab\` instead.`);
          let tab = temp !== undefined ? temp : slots[name] ? slots[name](item) : null;
          tab = customRenderSlot(slots, 'customTab', item, () => [tab]);
          return _createVNode(TabPane, {
            "tab": tab,
            "key": item.key,
            "disabled": item.disabled
          }, null);
        })],
        rightExtra: tabBarExtraContent ? () => tabBarExtraContent : null
      }) : null;
      if (title || extra || tabs) {
        head = _createVNode("div", {
          "class": `${pre}-head`,
          "style": headStyle
        }, [_createVNode("div", {
          "class": `${pre}-head-wrapper`
        }, [title && _createVNode("div", {
          "class": `${pre}-head-title`
        }, [title]), extra && _createVNode("div", {
          "class": `${pre}-extra`
        }, [extra])]), tabs]);
      }
      const coverDom = cover ? _createVNode("div", {
        "class": `${pre}-cover`
      }, [cover]) : null;
      const body = _createVNode("div", {
        "class": `${pre}-body`,
        "style": bodyStyle
      }, [loading ? loadingBlock : children]);
      const actionDom = actions && actions.length ? _createVNode("ul", {
        "class": `${pre}-actions`
      }, [getAction(actions)]) : null;
      return wrapSSR(_createVNode("div", _objectSpread(_objectSpread({
        "ref": "cardContainerRef"
      }, attrs), {}, {
        "class": [classString, attrs.class]
      }), [head, coverDom, children && children.length ? body : null, actionDom]));
    };
  }
});
export default Card;