@seemusic/ui-components/lib/components/SopPageHeader/SopPageHeader.mjs

A Vue 3 UI Library. Uses Composable.

import { defineComponent, getCurrentInstance, useSlots, createVNode, createTextVNode, withModifiers, Fragment } from "vue";
import { useLocale } from "../../composables/useLocale.mjs";
const SopPageHeader = /* @__PURE__ */ defineComponent({
  name: "SopPageHeader",
  props: {
    title: {
      type: [String, Array],
      default: ""
    },
    back: {
      type: [Object, Number, String, Function],
      default: 0
    }
  },
  setup(props, {
    slots
  }) {
    var _a;
    const instance = getCurrentInstance();
    const {
      t
    } = useLocale();
    const $slots = useSlots();
    const $router = (_a = instance == null ? void 0 : instance.proxy) == null ? void 0 : _a.$router;
    const validatorDataType = (val) => Object.prototype.toString.call(val).slice(8, -1);
    function backHtml() {
      return createVNode(Fragment, null, [createVNode("i", {
        "class": "sop-icon sop-icon--arrow-down"
      }, null), t("sop.common.back")]);
    }
    function routeJumpWay() {
      switch (validatorDataType(props.back)) {
        case "Number":
          return createVNode("a", {
            "href": "#",
            "onClick": withModifiers(() => {
              $router.go(props.back);
            }, ["prevent"])
          }, [backHtml()]);
        case "String":
          return createVNode("a", {
            "href": "#",
            "onClick": withModifiers(() => {
              $router.push({
                path: props.back
              });
            }, ["prevent"])
          }, [backHtml()]);
        case "Object":
          return createVNode("a", {
            "href": "#",
            "onClick": withModifiers(() => {
              $router.push(props.back);
            }, ["prevent"])
          }, [backHtml()]);
        case "Function":
          return createVNode("a", {
            "href": "#",
            "onClick": withModifiers(() => {
              props.back();
            }, ["prevent"])
          }, [backHtml()]);
      }
    }
    function genTitle(title) {
      if (Array.isArray(title)) {
        return title.map((text, i) => createVNode("span", {
          "key": i,
          "class": "sop-page-title-item"
        }, [createVNode("span", {
          "class": "text"
        }, [text]), i < title.length - 1 ? createVNode("span", {
          "class": "separate"
        }, [createTextVNode("/")]) : ""]));
      } else {
        return title;
      }
    }
    return () => {
      var _a2;
      return createVNode("div", {
        "class": "sop-page__hd"
      }, [props.back ? createVNode("div", {
        "class": "sop-page-path"
      }, [routeJumpWay(), createVNode("span", {
        "class": "slice"
      }, [createTextVNode("/")]), createVNode("div", {
        "class": "sop-page-title"
      }, [genTitle(props.title)])]) : createVNode("div", {
        "class": "sop-page-title"
      }, [genTitle(props.title)]), $slots.opt && createVNode("div", {
        "class": "sop-page-opt"
      }, [(_a2 = slots.opt) == null ? void 0 : _a2.call(slots)])]);
    };
  }
});
export {
  SopPageHeader as default
};
//# sourceMappingURL=SopPageHeader.mjs.map