song-ui-u/es/components/header/src/header.mjs

vue3 + js的PC前端组件库

import { defineComponent, computed, createVNode, isVNode } from 'vue';
import * as icons from 'song-ui-pro-icon';
import '../../button/index.mjs';
import '../../buttonGroup/index.mjs';
import { XIcon } from '../../icon/index.mjs';
import '../../input/index.mjs';
import '../../textarea/index.mjs';
import '../../row/index.mjs';
import '../../col/index.mjs';
import '../../container/index.mjs';
import '../../checkbox/index.mjs';
import '../../switch/index.mjs';
import '../../form/index.mjs';
import '../../message/index.mjs';
import '../../mask/src/mask.mjs';
import '../../modal/index.mjs';
import '../../messageBox/index.mjs';
import '../../drawer/index.mjs';
import '../../badge/index.mjs';
import '../../space/index.mjs';
import '../../image/index.mjs';
import '../../radio/index.mjs';
import '../../divider/index.mjs';
import '../../chat/index.mjs';
import '../../progress/index.mjs';
import '../../upload/index.mjs';
import '../../vTree/index.mjs';
import '../../table/index.mjs';
import '../../tabs/index.mjs';
import '../../menu/index.mjs';
import '../../steps/index.mjs';
import '../index.mjs';
import '../../breadcrumble/index.mjs';
import '../../datePicker/index.mjs';
import '../../tooltip/index.mjs';
import '../../popover/index.mjs';
import '../../timePicker/index.mjs';
import '../../select/index.mjs';
import '../../collapse/index.mjs';
import '../../card/index.mjs';
import '../../timeline/index.mjs';
import '../../tag/index.mjs';
import '../../result/index.mjs';
import '../../sender/index.mjs';

function _isSlot(s) {
  return typeof s === "function" || Object.prototype.toString.call(s) === "[object Object]" && !isVNode(s);
}
var header = /* @__PURE__ */ defineComponent({
  name: "x-page-header",
  props: {
    title: {
      type: String
    },
    content: String,
    backText: {
      type: String,
      default: "\u8FD4\u56DE"
    },
    showBack: {
      type: Boolean,
      default: true
    },
    disableRoute: Boolean,
    icon: {
      type: [String],
      default: "ChevronLeft"
    }
  },
  emits: ["back"],
  setup(props, {
    emit,
    slots
  }) {
    const hasExtra = computed(() => !!slots.extra);
    const hasContent = computed(() => !!slots.content || props.content);
    const handleBack = () => {
      emit("back");
      if (!props.disableRoute) {
        window.history.length > 1 ? window.history.back() : window.location.href = "/";
      }
    };
    const renderIcon = () => {
      if (slots.icon) return slots.icon();
      return icons[props.icon].render();
    };
    return () => {
      let _slot;
      return createVNode("div", {
        "class": "x-page-header"
      }, [slots.breadcrumb?.() && createVNode("div", {
        "class": "x-page-header__breadcrumb"
      }, [slots.breadcrumb()]), createVNode("div", {
        "class": "x-page-header__main"
      }, [props.showBack && createVNode("div", {
        "class": "x-page-header__back",
        "onClick": handleBack
      }, [createVNode(XIcon, {
        "size": "20"
      }, _isSlot(_slot = // 动态组件渲染
      renderIcon()) ? _slot : {
        default: () => [_slot]
      }), createVNode("span", {
        "class": "x-page-header__text"
      }, [props.backText])]), createVNode("div", {
        "class": "x-page-header__title"
      }, [slots.title?.() || props.title]), createVNode("div", {
        "class": "x-page-header__divider"
      }, null), hasContent.value && createVNode("div", {
        "class": "x-page-header__content"
      }, [slots.content?.() || props.content])]), hasExtra.value && createVNode("div", {
        "class": "x-page-header__extra"
      }, [slots.extra()]), slots.default?.()]);
    };
  }
});

export { header as default };
//# sourceMappingURL=header.mjs.map