plus-pro-components/es/components/display-item/src/display-item.mjs

Page level components developed based on Element Plus.

import { ElImage, ElLink, ElTag, ElProgress, ElAvatar } from 'element-plus';
import '../../utils/index.mjs';
import { formatDate, formatMoney } from '../../utils/format.mjs';

const DisplayComponentMap = {
  img: {
    component: ElImage,
    class: "plus-display-item__image",
    hasSlots: true
  },
  link: {
    component: ElLink,
    class: "plus-display-item__link",
    hasSlots: true
  },
  tag: {
    component: ElTag,
    hasSlots: true
  },
  progress: {
    component: ElProgress,
    hasSlots: true
  },
  avatar: {
    component: ElAvatar,
    hasSlots: true
  },
  "date-picker": {
    component: "span",
    format: formatDate
  },
  money: {
    component: "span",
    format: formatMoney
  },
  code: {
    component: "span",
    class: "plus-display-item__pre"
  }
};
const hasDisplayComponent = (valueType) => Object.keys(DisplayComponentMap).includes(valueType);
const getDisplayComponent = (valueType) => Reflect.get(DisplayComponentMap, valueType) || {};

export { DisplayComponentMap, getDisplayComponent, hasDisplayComponent };