@opendesign-plus/components 0.0.1-rc.6 → 0.0.1-rc.61

package/dist/treeshaking/components/banner/OBannerContent.vue2.mjs

@@ -0,0 +1,102 @@
+import { defineComponent, openBlock, createBlock, unref, normalizeStyle, normalizeClass, withCtx, createVNode, createElementVNode, createElementBlock, createCommentVNode, toDisplayString, createTextVNode } from "vue";
+import { OFigure, OButton } from "@opensig/opendesign";
+import ContentWrapper from "../common/ContentWrapper.vue.mjs";
+const _hoisted_1 = { class: "banner-content" };
+const _hoisted_2 = ["src"];
+const _hoisted_3 = {
+  key: 4,
+  class: "banner-opts"
+};
+const _sfc_main = /* @__PURE__ */ defineComponent({
+  __name: "OBannerContent",
+  props: {
+    info: {},
+    size: {},
+    contentJustifyCenter: { type: Boolean },
+    isPhone: { type: Boolean },
+    isLight: { type: Boolean }
+  },
+  emits: ["click"],
+  setup(__props, { emit: __emit }) {
+    const emit = __emit;
+    const onClick = (href, hasBtn) => {
+      if (href && !hasBtn) {
+        window.open(href);
+        emit("click", href);
+      }
+    };
+    return (_ctx, _cache) => {
+      return openBlock(), createBlock(unref(OFigure), {
+        class: normalizeClass(["banner-bg", {
+          "with-sticky-bg": __props.info.withStickyBg,
+          "cursor-pointer": __props.info.href && !__props.info.btn
+        }]),
+        src: __props.info.bg,
+        style: normalizeStyle({
+          "--pad-offset": __props.info.pad_offset
+        }),
+        onClick: _cache[0] || (_cache[0] = ($event) => onClick(__props.info.href, __props.info.btn))
+      }, {
+        default: withCtx(() => [
+          createVNode(ContentWrapper, {
+            class: normalizeClass(["banner-wrapper", ["banner-wrapper", __props.contentJustifyCenter ? "content-center" : ""]])
+          }, {
+            default: withCtx(() => [
+              createElementVNode("div", _hoisted_1, [
+                !__props.isPhone && __props.info.attach ? (openBlock(), createElementBlock("img", {
+                  key: 0,
+                  src: __props.info.attach,
+                  class: "banner-attach"
+                }, null, 8, _hoisted_2)) : createCommentVNode("", true),
+                __props.info.title ? (openBlock(), createElementBlock("div", {
+                  key: 1,
+                  class: normalizeClass({
+                    "banner-title": true,
+                    "text-dark": __props.info.text_theme === "dark"
+                  })
+                }, toDisplayString(__props.info.title), 3)) : createCommentVNode("", true),
+                __props.info.subtitle ? (openBlock(), createElementBlock("div", {
+                  key: 2,
+                  class: normalizeClass({
+                    "banner-subtitle": true,
+                    "text-dark": __props.info.text_theme === "dark"
+                  })
+                }, toDisplayString(__props.info.subtitle), 3)) : createCommentVNode("", true),
+                __props.info.bg_text ? (openBlock(), createElementBlock("div", {
+                  key: 3,
+                  class: "banner-text",
+                  style: normalizeStyle({
+                    backgroundImage: `url(${__props.info.bg_text})`,
+                    "--pc-width": __props.info.pc_text_width,
+                    "--pc-height": __props.info.pc_text_height,
+                    "--pad-width": __props.info.pad_text_width,
+                    "--pad-height": __props.info.pad_text_height
+                  })
+                }, null, 4)) : createCommentVNode("", true),
+                __props.info.btn ? (openBlock(), createElementBlock("div", _hoisted_3, [
+                  createVNode(unref(OButton), {
+                    href: __props.info.href,
+                    target: "_blank",
+                    variant: "solid",
+                    color: "primary",
+                    size: __props.size === "tiny" ? void 0 : __props.size
+                  }, {
+                    default: withCtx(() => [
+                      createTextVNode(toDisplayString(__props.info.btn), 1)
+                    ]),
+                    _: 1
+                  }, 8, ["href", "size"])
+                ])) : createCommentVNode("", true)
+              ])
+            ]),
+            _: 1
+          }, 8, ["class"])
+        ]),
+        _: 1
+      }, 8, ["src", "class", "style"]);
+    };
+  }
+});
+export {
+  _sfc_main as default
+};

package/dist/treeshaking/components/banner/index.d.ts

@@ -0,0 +1,68 @@
+import { App } from 'vue';
+declare const OBanner: {
+    new (...args: any[]): import('vue').CreateComponentPublicInstanceWithMixins<Readonly<{
+        options?: import('./types').BannerItem | import('./types').BannerItem[];
+        size?: "large" | "medium" | "small" | "tiny";
+        contentJustifyCenter?: boolean;
+        autoPlay?: boolean;
+    }> & Readonly<{
+        onClick?: ((href: string | undefined) => any) | undefined;
+    }>, {}, {}, {}, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {} & {
+        click: (href: string | undefined) => any;
+    }, import('vue').PublicProps, {}, false, {}, {}, import('vue').GlobalComponents, import('vue').GlobalDirectives, string, {}, HTMLDivElement, import('vue').ComponentProvideOptions, {
+        P: {};
+        B: {};
+        D: {};
+        C: {};
+        M: {};
+        Defaults: {};
+    }, Readonly<{
+        options?: import('./types').BannerItem | import('./types').BannerItem[];
+        size?: "large" | "medium" | "small" | "tiny";
+        contentJustifyCenter?: boolean;
+        autoPlay?: boolean;
+    }> & Readonly<{
+        onClick?: ((href: string | undefined) => any) | undefined;
+    }>, {}, {}, {}, {}, {}>;
+    __isFragment?: never;
+    __isTeleport?: never;
+    __isSuspense?: never;
+} & import('vue').ComponentOptionsBase<Readonly<{
+    options?: import('./types').BannerItem | import('./types').BannerItem[];
+    size?: "large" | "medium" | "small" | "tiny";
+    contentJustifyCenter?: boolean;
+    autoPlay?: boolean;
+}> & Readonly<{
+    onClick?: ((href: string | undefined) => any) | undefined;
+}>, {}, {}, {}, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {} & {
+    click: (href: string | undefined) => any;
+}, string, {}, {}, string, {}, import('vue').GlobalComponents, import('vue').GlobalDirectives, string, import('vue').ComponentProvideOptions> & import('vue').VNodeProps & import('vue').AllowedComponentProps & import('vue').ComponentCustomProps & {
+    install(app: App): void;
+};
+declare const OBannerContent: {
+    new (...args: any[]): import('vue').CreateComponentPublicInstanceWithMixins<Readonly<import('./types').BannerContentProps> & Readonly<{
+        onClick?: ((href: string | undefined) => any) | undefined;
+    }>, {}, {}, {}, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {} & {
+        click: (href: string | undefined) => any;
+    }, import('vue').PublicProps, {}, false, {}, {}, import('vue').GlobalComponents, import('vue').GlobalDirectives, string, {}, any, import('vue').ComponentProvideOptions, {
+        P: {};
+        B: {};
+        D: {};
+        C: {};
+        M: {};
+        Defaults: {};
+    }, Readonly<import('./types').BannerContentProps> & Readonly<{
+        onClick?: ((href: string | undefined) => any) | undefined;
+    }>, {}, {}, {}, {}, {}>;
+    __isFragment?: never;
+    __isTeleport?: never;
+    __isSuspense?: never;
+} & import('vue').ComponentOptionsBase<Readonly<import('./types').BannerContentProps> & Readonly<{
+    onClick?: ((href: string | undefined) => any) | undefined;
+}>, {}, {}, {}, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {} & {
+    click: (href: string | undefined) => any;
+}, string, {}, {}, string, {}, import('vue').GlobalComponents, import('vue').GlobalDirectives, string, import('vue').ComponentProvideOptions> & import('vue').VNodeProps & import('vue').AllowedComponentProps & import('vue').ComponentCustomProps & {
+    install(app: App): void;
+};
+export { OBanner, OBannerContent };
+export * from './types';

package/dist/treeshaking/components/banner/index.mjs

@@ -0,0 +1,16 @@
+import _OBanner from "./OBanner.vue.mjs";
+import _OBannerContent from "./OBannerContent.vue.mjs";
+const OBanner = Object.assign(_OBanner, {
+  install(app) {
+    app.component("OBanner", _OBanner);
+  }
+});
+const OBannerContent = Object.assign(_OBannerContent, {
+  install(app) {
+    app.component("OBannerContent", _OBannerContent);
+  }
+});
+export {
+  OBanner,
+  OBannerContent
+};

package/dist/treeshaking/components/banner/types.d.ts

@@ -0,0 +1,31 @@
+export interface BannerItem {
+    title?: string;
+    subtitle?: string;
+    bg: string;
+    text_theme?: 'light' | 'dark';
+    bg_text?: string;
+    pc_text_width?: string;
+    pc_text_height?: string;
+    pad_text_width?: string;
+    pad_text_height?: string;
+    attach?: string;
+    href?: string;
+    btn?: string;
+    withStickyBg?: boolean;
+    pad_offset?: string;
+}
+export interface BannerContentProps {
+    info: BannerItem;
+    size?: 'large' | 'medium' | 'small' | 'tiny';
+    contentJustifyCenter?: boolean;
+    isPhone?: boolean;
+    isLight?: boolean;
+}
+export interface HomeBannerEmits {
+    (e: 'before-change', index: number): void;
+    (e: 'click', href: string | undefined): void;
+}
+export interface BannerContentEmits {
+    (e: 'click', href: string | undefined): void;
+}
+export type ComponentSize = 'large' | 'medium' | 'small' | 'tiny';

package/dist/treeshaking/components/common/AppAvatar.css

@@ -0,0 +1,20 @@
+.hover-icon-rotate .o-icon[data-v-9aaf13f3] {
+  transition: all var(--o-duration-m1) var(--o-easing-standard-in);
+}
+@media (hover: hover) {
+.hover-icon-rotate:hover .o-icon[data-v-9aaf13f3] {
+    transform: rotate(-180deg);
+}
+}
+.img-avatar[data-v-9aaf13f3] {
+  background-color: transparent !important;
+}
+.word-avatar[data-v-9aaf13f3] {
+  display: flex;
+  align-items: center;
+  justify-content: center;
+  color: var(--o-color-info1-inverse);
+}
+.round[data-v-9aaf13f3] {
+  border-radius: 50%;
+}

package/dist/treeshaking/components/common/AppAvatar.vue.mjs

@@ -0,0 +1,7 @@
+import _sfc_main from "./AppAvatar.vue2.mjs";
+import './AppAvatar.css';
+import _export_sfc from "../../_virtual/_plugin-vue_export-helper.mjs";
+const AppAvatar = /* @__PURE__ */ _export_sfc(_sfc_main, [["__scopeId", "data-v-9aaf13f3"]]);
+export {
+  AppAvatar as default
+};

package/dist/treeshaking/components/common/AppAvatar.vue2.mjs

@@ -0,0 +1,83 @@
+import { defineComponent, computed, openBlock, createElementBlock, normalizeStyle, normalizeClass, toDisplayString } from "vue";
+const _hoisted_1 = ["src"];
+const _sfc_main = /* @__PURE__ */ defineComponent({
+  __name: "AppAvatar",
+  props: {
+    // 头像
+    avatar: {
+      type: String,
+      default: ""
+    },
+    // 用户名
+    name: {
+      type: String,
+      default: "",
+      required: true
+    },
+    // mini： 16 small： 24， medium： 40， large： 64
+    size: {
+      type: String,
+      default: "medium"
+    },
+    // 大小尺寸自定义，单位px
+    customSize: {
+      type: Number,
+      default: 20
+    },
+    // round--圆形 square--方形
+    variant: {
+      type: String,
+      default: "round"
+    }
+  },
+  setup(__props) {
+    const props = __props;
+    const bgColorArr = ["#058EF0", "#FA7305", "#03B5A5"];
+    const avatarText = computed(() => {
+      var _a;
+      return (_a = props.name) == null ? void 0 : _a.charAt(0).toUpperCase();
+    });
+    const getAvatarStyle = computed(() => {
+      var _a;
+      const avatarStyle = {
+        "background-color": "",
+        width: props.customSize + "px",
+        height: props.customSize + "px",
+        "font-size": "20px"
+      };
+      avatarStyle["background-color"] = props.name ? bgColorArr[((_a = props.name) == null ? void 0 : _a.length) % bgColorArr.length] : "transparent";
+      let sizeNum = 0;
+      if (props.customSize) {
+        sizeNum = Number(props.customSize);
+      } else {
+        const sizeToNum = {
+          mini: 16,
+          small: 24,
+          medium: 40,
+          large: 64
+        };
+        sizeNum = sizeToNum[props.size];
+      }
+      avatarStyle.height = `${sizeNum}px`;
+      avatarStyle.width = `${sizeNum}px`;
+      avatarStyle["font-size"] = `${sizeNum / 2}px`;
+      return avatarStyle;
+    });
+    return (_ctx, _cache) => {
+      return __props.avatar && !__props.avatar.includes("gitcode") ? (openBlock(), createElementBlock("img", {
+        key: 0,
+        src: __props.avatar,
+        class: normalizeClass(["img-avatar", __props.variant]),
+        style: normalizeStyle(getAvatarStyle.value),
+        alt: ""
+      }, null, 14, _hoisted_1)) : (openBlock(), createElementBlock("div", {
+        key: 1,
+        class: normalizeClass(["word-avatar", __props.variant]),
+        style: normalizeStyle(getAvatarStyle.value)
+      }, toDisplayString(avatarText.value), 7));
+    };
+  }
+});
+export {
+  _sfc_main as default
+};

package/dist/treeshaking/components/common/ClientOnly.vue.mjs

@@ -0,0 +1,16 @@
+import { defineComponent, ref, onMounted, renderSlot, createCommentVNode } from "vue";
+const _sfc_main = /* @__PURE__ */ defineComponent({
+  __name: "ClientOnly",
+  setup(__props) {
+    const isClient = ref(false);
+    onMounted(() => {
+      isClient.value = true;
+    });
+    return (_ctx, _cache) => {
+      return isClient.value ? renderSlot(_ctx.$slots, "default", { key: 0 }) : createCommentVNode("", true);
+    };
+  }
+});
+export {
+  _sfc_main as default
+};

package/dist/treeshaking/components/common/ClientOnly.vue2.mjs

@@ -0,0 +1,4 @@
+import _sfc_main from "./ClientOnly.vue.mjs";
+export {
+  _sfc_main as default
+};

package/dist/treeshaking/components/common/ContentWrapper.css

@@ -0,0 +1,36 @@
+.hover-icon-rotate .o-icon[data-v-9e217f8f] {
+  transition: all var(--o-duration-m1) var(--o-easing-standard-in);
+}
+@media (hover: hover) {
+.hover-icon-rotate:hover .o-icon[data-v-9e217f8f] {
+    transform: rotate(-180deg);
+}
+}
+.content-wrapper[data-v-9e217f8f] {
+  --layout-content-max-width: 1544px;
+  --layout-content-padding: 64px;
+  --layout-header-height: 80px;
+}
+@media (max-width: 1680px) {
+.content-wrapper[data-v-9e217f8f] {
+    --layout-content-max-width: 100%;
+    --layout-content-padding: 40px;
+}
+}
+@media (max-width: 1200px) {
+.content-wrapper[data-v-9e217f8f] {
+    --layout-content-padding: 32px;
+}
+}
+@media (max-width: 600px) {
+.content-wrapper[data-v-9e217f8f] {
+    --layout-content-padding: 24px;
+}
+}
+.content-wrapper[data-v-9e217f8f] {
+  max-width: var(--layout-content-max-width);
+  margin: 0 auto;
+  --content-wrapper-vertical-paddingTop: 72px;
+  --content-wrapper-vertical-paddingBottom: 72px;
+  padding: var(--content-wrapper-vertical-paddingTop) var(--layout-content-padding) var(--content-wrapper-vertical-paddingBottom);
+}

package/dist/treeshaking/components/common/ContentWrapper.vue.mjs

@@ -0,0 +1,7 @@
+import _sfc_main from "./ContentWrapper.vue2.mjs";
+import './ContentWrapper.css';
+import _export_sfc from "../../_virtual/_plugin-vue_export-helper.mjs";
+const ContentWrapper = /* @__PURE__ */ _export_sfc(_sfc_main, [["__scopeId", "data-v-9e217f8f"]]);
+export {
+  ContentWrapper as default
+};

package/dist/treeshaking/components/common/ContentWrapper.vue2.mjs

@@ -0,0 +1,50 @@
+import { defineComponent, computed, openBlock, createElementBlock, normalizeStyle, unref, renderSlot } from "vue";
+import { isBoolean, isString, isUndefined } from "@opensig/opendesign";
+const _sfc_main = /* @__PURE__ */ defineComponent({
+  __name: "ContentWrapper",
+  props: {
+    verticalPadding: { type: [Boolean, String, Array], default: void 0 }
+  },
+  setup(__props) {
+    const DEFAULT = Symbol("default");
+    const props = __props;
+    const paddingTop = computed(() => {
+      if (!props.verticalPadding) {
+        return 0;
+      }
+      if (isBoolean(props.verticalPadding)) {
+        return DEFAULT;
+      } else if (isString(props.verticalPadding)) {
+        return props.verticalPadding;
+      } else {
+        return props.verticalPadding[0];
+      }
+    });
+    const paddingBottom = computed(() => {
+      if (!props.verticalPadding) {
+        return 0;
+      }
+      if (isBoolean(props.verticalPadding)) {
+        return DEFAULT;
+      } else if (isString(props.verticalPadding)) {
+        return props.verticalPadding;
+      } else {
+        return !isUndefined(props.verticalPadding[1]) ? props.verticalPadding[1] : props.verticalPadding[0];
+      }
+    });
+    return (_ctx, _cache) => {
+      return openBlock(), createElementBlock("div", {
+        class: "content-wrapper",
+        style: normalizeStyle({
+          "--content-wrapper-vertical-paddingTop": paddingTop.value === unref(DEFAULT) ? void 0 : paddingTop.value,
+          "--content-wrapper-vertical-paddingBottom": paddingBottom.value === unref(DEFAULT) ? void 0 : paddingBottom.value
+        })
+      }, [
+        renderSlot(_ctx.$slots, "default", {}, void 0, true)
+      ], 4);
+    };
+  }
+});
+export {
+  _sfc_main as default
+};

package/dist/treeshaking/components/common/ThFilter.css

@@ -0,0 +1,146 @@
+.hover-icon-rotate .o-icon {
+  transition: all var(--o-duration-m1) var(--o-easing-standard-in);
+}
+@media (hover: hover) {
+.hover-icon-rotate:hover .o-icon {
+    transform: rotate(-180deg);
+}
+}
+.th-filter-wrapper {
+  display: flex;
+  column-gap: var(--o-gap-2);
+  flex-wrap: nowrap;
+  align-items: center;
+}
+.th-filter-wrapper > span:first-child {
+  word-break: keep-all;
+}
+.th-filter-wrapper .filter-wrapper {
+  display: flex;
+  align-items: center;
+  justify-content: center;
+  cursor: pointer;
+}
+.th-filter-wrapper .filter-wrapper > * {
+  flex-shrink: 0;
+}
+.th-filter-wrapper .filter-wrapper .filter-hover-icon {
+  display: none;
+}
+.th-filter-wrapper .filter-wrapper .filter-icon {
+  font-size: 24px;
+  line-height: 32px;
+}
+@media (min-width: 1201px) and (max-width: 1680px) {
+.th-filter-wrapper .filter-wrapper .filter-icon {
+    font-size: 20px;
+    line-height: 28px;
+}
+}
+@media (min-width: 841px) and (max-width: 1200px) {
+.th-filter-wrapper .filter-wrapper .filter-icon {
+    font-size: 18px;
+    line-height: 26px;
+}
+}
+@media (min-width: 601px) and (max-width: 840px) {
+.th-filter-wrapper .filter-wrapper .filter-icon {
+    font-size: 18px;
+    line-height: 26px;
+}
+}
+@media (max-width: 600px) {
+.th-filter-wrapper .filter-wrapper .filter-icon {
+    font-size: 16px;
+    line-height: 24px;
+}
+}
+.th-filter-wrapper .filter-wrapper:hover .filter-icon, .th-filter-wrapper .filter-wrapper.has-checked .filter-icon {
+  color: var(--o-color-primary1);
+}
+.th-filter-wrapper .filter-wrapper:hover .o-icon path, .th-filter-wrapper .filter-wrapper.has-checked .o-icon path {
+  fill: currentColor;
+}
+.th-filter-dropdown .o-dropdown-item {
+  min-width: 80px;
+  max-width: calc(var(--table-width, 300) * 0.8px);
+  --dropdown-item-justify: flex-start;
+  --dropdown-item-padding: 7px 12px;
+}
+.th-filter-dropdown .o-dropdown-item.is-active {
+  font-weight: 500;
+  background-color: var(--dropdown-item-bg-color-hover);
+  color: var(--dropdown-item-color-hover);
+}
+.th-filter-popover {
+  --popup-radius: var(--o-radius-xs);
+}
+.th-filter-popover .o-popup-body {
+  padding: var(--o-gap-2) 0 0 0;
+}
+.th-filter-popover .list-content-wrapper {
+  display: flex;
+}
+.th-filter-popover .list-content-wrapper .o-scrollbar-wrapper:first-child {
+  border-right: 1px solid rgb(224, 226, 230);
+}
+.th-filter-popover .content-wrapper {
+  padding: 0 var(--o-gap-4);
+  overflow: auto;
+  max-height: 300px;
+}
+.th-filter-popover .content-wrapper .o-checkbox-group {
+  flex-shrink: 0;
+}
+.th-filter-popover .content-wrapper .o-checkbox-label {
+  flex-grow: 1;
+}
+.th-filter-popover .content-wrapper .o-checkbox-label .label-wrapper {
+  cursor: pointer;
+  display: flex;
+  align-items: center;
+  justify-content: space-between;
+}
+.th-filter-popover .content-wrapper .o-checkbox-label .label-wrapper .o-svg-icon {
+  font-size: 24px;
+}
+.th-filter-popover .btn-wrapper {
+  min-width: 158px;
+  box-sizing: border-box;
+  display: flex;
+  align-items: center;
+  justify-content: center;
+  padding-bottom: var(--o-gap-3);
+  font-size: 16px;
+  line-height: 24px;
+}
+@media (min-width: 1201px) and (max-width: 1680px) {
+.th-filter-popover .btn-wrapper {
+    font-size: 14px;
+    line-height: 22px;
+}
+}
+@media (min-width: 841px) and (max-width: 1200px) {
+.th-filter-popover .btn-wrapper {
+    font-size: 14px;
+    line-height: 22px;
+}
+}
+@media (min-width: 601px) and (max-width: 840px) {
+.th-filter-popover .btn-wrapper {
+    font-size: 14px;
+    line-height: 22px;
+}
+}
+@media (max-width: 600px) {
+.th-filter-popover .btn-wrapper {
+    font-size: 12px;
+    line-height: 18px;
+}
+}
+.th-filter-popover .btn-wrapper .o-link {
+  width: 80px;
+  display: flex;
+  align-items: center;
+  justify-content: center;
+}