tdesign-pro-component/dist/es/PageContainer-K1aM6JYB.js

ProComponents tdesign-vue-next + Vue3 + TS

import { g as y, i as B, w as L } from "./utils-DU1amZow.js";
import { defineComponent as F, createVNode as n, mergeProps as p, isVNode as $, useSlots as E, resolveComponent as g, openBlock as c, createElementBlock as b, createElementVNode as V, unref as l, createSlots as w, withCtx as s, renderSlot as f, Fragment as x, renderList as I, createBlock as C, createCommentVNode as k } from "vue";
import { B as R, a as H } from "./vendor-B4aI3wuy.js";
function K(t) {
  return typeof t == "function" || Object.prototype.toString.call(t) === "[object Object]" && !$(t);
}
const T = /* @__PURE__ */ F({
  name: "PageContainerHeader",
  props: {
    title: [String, Function, Object],
    actions: [Function, Object],
    breadcrumb: Array,
    description: [String, Function, Object, Boolean]
  },
  setup(t, {
    slots: i,
    emit: e
  }) {
    function m(d, o) {
      e("breadcrumbClick", d, o);
    }
    const r = y(i, t, "title"), _ = y(i, t, "actions"), h = y(i, t, "description");
    return () => {
      let d;
      return n("div", null, [t.breadcrumb && n(R, {
        class: "page-container-header-breadcrumb"
      }, K(d = t.breadcrumb.items.map((o) => n(H, p({
        onClick: () => m(o.path, o)
      }, o), {
        icon: o.icon ? B(o.icon) ? o.icon() : o.icon : void 0,
        default: () => n("span", null, [o.title])
      }))) ? d : {
        default: () => [d]
      }), n("div", {
        class: "page-container-header-content"
      }, [n("div", {
        class: "page-container-header-content-title"
      }, [r]), (t.actions || i.actions) && n("div", {
        class: "page-container-header-content-actions"
      }, [_])]), (t.description || i.description) && n("div", {
        class: "page-container-header-description"
      }, [h])]);
    };
  }
}), D = {
  class: "page-container"
}, q = {
  class: "page-container-header"
}, z = {
  key: 0,
  class: "page-container-header-tablist"
}, G = {
  key: 0,
  class: "page-container-body"
}, J = {
  key: 1,
  class: "page-container-footer"
}, M = /* @__PURE__ */ F({
  name: "PageContainer",
  __name: "PageContainer",
  props: {
    header: {},
    tabList: {},
    loading: {},
    tabActiveKey: {},
    tabBarExtraContent: {
      type: [Object, String, Number, Boolean, null, Array, Function]
    },
    tabsProps: {},
    content: {
      type: [Object, String, Number, Boolean, null, Array, Function]
    },
    footer: {
      default: !1
    },
    bodyBordered: {
      type: Boolean,
      default: !1
    },
    hideBody: {
      type: Boolean,
      default: !1
    }
  },
  emits: ["tabChange", "breadcrumbClick"],
  setup(t, {
    emit: i
  }) {
    const e = t, m = i, r = E();
    function _(a) {
      m("tabChange", a);
    }
    function h(a, v) {
      m("breadcrumbClick", a, v);
    }
    const d = () => B(e.content) ? e.content() : e.content, o = () => B(e.footer) ? e.footer() : e.footer;
    return (a, v) => {
      const O = g("t-tab-panel"), A = g("t-tabs"), N = g("t-loading"), P = g("t-card");
      return c(), b("div", D, [V("div", q, [n(l(T), p({
        onBreadcrumbClick: h
      }, e.header), w({
        _: 2
      }, [l(r).title ? {
        name: "title",
        fn: s(() => [f(a.$slots, "title")]),
        key: "0"
      } : void 0, l(r).actions ? {
        name: "actions",
        fn: s(() => [f(a.$slots, "actions")]),
        key: "1"
      } : void 0, l(r).description ? {
        name: "description",
        fn: s(() => [f(a.$slots, "description")]),
        key: "2"
      } : void 0]), 1040), e.tabList && e.tabList.length ? (c(), b("div", z, [n(A, p({
        onChange: _,
        "default-value": e.tabActiveKey,
        action: e.tabBarExtraContent
      }, e.tabsProps), {
        default: s(() => [(c(!0), b(x, null, I(e.tabList, (u) => (c(), C(O, {
          value: u.value,
          label: u.label
        }, null, 8, ["value", "label"]))), 256))]),
        _: 1
      }, 16, ["default-value", "action"])])) : k("", !0)]), e.hideBody === !1 ? (c(), b("div", G, [n(P, {
        bordered: e.bodyBordered
      }, {
        default: s(() => {
          var u, S, j;
          return [n(N, p({
            loading: ((u = e == null ? void 0 : e.loading) == null ? void 0 : u.status) || !1,
            text: (S = e.loading) == null ? void 0 : S.text
          }, (j = e.loading) == null ? void 0 : j.loadingProps), {
            default: s(() => [l(r).default ? f(a.$slots, "default", {
              key: 0
            }) : (c(), C(d, {
              key: 1
            }))]),
            _: 3
          }, 16, ["loading", "text"])];
        }),
        _: 3
      }, 8, ["bordered"])])) : k("", !0), l(r).footer || e.footer ? (c(), b("div", J, [n(P, {
        bordered: !1
      }, {
        default: s(() => [l(r).footer ? f(a.$slots, "footer", {
          key: 0
        }) : (c(), C(o, {
          key: 1
        }))]),
        _: 3
      })])) : k("", !0)]);
    };
  }
}), X = L(M);
export {
  X as P
};