jky-component-lib 0.0.15 → 0.0.17

package/dist/lib/menu/Menu.vue.d.ts

@@ -0,0 +1,32 @@
+import { MenuProps } from 'element-plus/es/components/menu';
+interface MenuItem {
+    index: string;
+    title?: string;
+    icon?: string;
+    disabled?: boolean;
+    children?: MenuItem[];
+    popperOffset?: number;
+    route?: string | object;
+    [key: string]: any;
+}
+interface Props extends MenuProps {
+    menuData?: MenuItem[];
+    modelValue?: string;
+}
+declare function __VLS_template(): {
+    attrs: Partial<{}>;
+    slots: {
+        default?(_: {}): any;
+    };
+    refs: {};
+    rootEl: any;
+};
+type __VLS_TemplateResult = ReturnType<typeof __VLS_template>;
+declare const __VLS_component: import('vue').DefineComponent<Props, {}, {}, {}, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {}, string, import('vue').PublicProps, Readonly<Props> & Readonly<{}>, {}, {}, {}, {}, string, import('vue').ComponentProvideOptions, false, {}, any>;
+declare const _default: __VLS_WithTemplateSlots<typeof __VLS_component, __VLS_TemplateResult["slots"]>;
+export default _default;
+type __VLS_WithTemplateSlots<T, S> = T & {
+    new (): {
+        $slots: S;
+    };
+};

package/dist/lib/menu/Menu.vue.js

@@ -0,0 +1,110 @@
+"use strict";
+var __defProp = Object.defineProperty;
+var __defProps = Object.defineProperties;
+var __getOwnPropDescs = Object.getOwnPropertyDescriptors;
+var __getOwnPropSymbols = Object.getOwnPropertySymbols;
+var __hasOwnProp = Object.prototype.hasOwnProperty;
+var __propIsEnum = Object.prototype.propertyIsEnumerable;
+var __defNormalProp = (obj, key, value) => key in obj ? __defProp(obj, key, { enumerable: true, configurable: true, writable: true, value }) : obj[key] = value;
+var __spreadValues = (a, b) => {
+  for (var prop in b || (b = {}))
+    if (__hasOwnProp.call(b, prop))
+      __defNormalProp(a, prop, b[prop]);
+  if (__getOwnPropSymbols)
+    for (var prop of __getOwnPropSymbols(b)) {
+      if (__propIsEnum.call(b, prop))
+        __defNormalProp(a, prop, b[prop]);
+    }
+  return a;
+};
+var __spreadProps = (a, b) => __defProps(a, __getOwnPropDescs(b));
+Object.defineProperties(exports, { __esModule: { value: true }, [Symbol.toStringTag]: { value: "Module" } });
+const vue = require("vue");
+const ElementPlus = require("element-plus");
+const _sfc_main = /* @__PURE__ */ vue.defineComponent(__spreadProps(__spreadValues({}, {
+  name: "JkyMenu",
+  inheritAttrs: false
+}), {
+  __name: "Menu",
+  props: {
+    menuData: { default: () => [] },
+    modelValue: {},
+    mode: {},
+    defaultActive: {},
+    defaultOpeneds: {},
+    uniqueOpened: { type: Boolean },
+    router: { type: Boolean },
+    menuTrigger: {},
+    collapse: { type: Boolean },
+    backgroundColor: {},
+    textColor: {},
+    activeTextColor: {},
+    closeOnClickOutside: { type: Boolean },
+    collapseTransition: { type: Boolean },
+    ellipsis: { type: Boolean },
+    popperOffset: {},
+    ellipsisIcon: {},
+    popperEffect: {},
+    popperClass: {},
+    popperStyle: {},
+    showTimeout: {},
+    hideTimeout: {},
+    persistent: { type: Boolean }
+  },
+  setup(__props) {
+    function renderMenuItem(item) {
+      return vue.h(
+        ElementPlus.ElMenuItem,
+        {
+          index: item.index,
+          disabled: item.disabled,
+          route: item.route
+        },
+        {
+          default: () => [
+            item.icon ? vue.h("span", { class: "jky-menu-item__icon" }, [vue.h("span", { class: item.icon })]) : null,
+            item.title ? vue.h("span", { class: "jky-menu-item__title" }, item.title) : null
+          ]
+        }
+      );
+    }
+    function renderSubMenu(item) {
+      var _a;
+      const children = item.children || [];
+      return vue.h(
+        ElementPlus.ElSubMenu,
+        {
+          index: item.index,
+          disabled: (_a = item.disabled) != null ? _a : false,
+          popperOffset: item.popperOffset
+        },
+        {
+          title: () => [
+            item.icon ? vue.h("span", { class: "jky-menu-item__icon" }, [vue.h("span", { class: item.icon })]) : null,
+            item.title ? vue.h("span", { class: "jky-menu-item__title" }, item.title) : null
+          ],
+          default: () => children.map((child) => renderMenuNode(child))
+        }
+      );
+    }
+    function renderMenuNode(item) {
+      if (item.children && item.children.length > 0) {
+        return renderSubMenu(item);
+      }
+      return renderMenuItem(item);
+    }
+    return (_ctx, _cache) => {
+      return vue.openBlock(), vue.createBlock(vue.unref(ElementPlus.ElMenu), vue.mergeProps({ class: "jky-menu" }, _ctx.$attrs), {
+        default: vue.withCtx(() => [
+          __props.menuData && __props.menuData.length > 0 ? (vue.openBlock(true), vue.createElementBlock(vue.Fragment, { key: 0 }, vue.renderList(__props.menuData, (item) => {
+            return vue.openBlock(), vue.createBlock(vue.resolveDynamicComponent(renderMenuNode(item)), {
+              key: item.index
+            });
+          }), 128)) : vue.renderSlot(_ctx.$slots, "default", { key: 1 })
+        ]),
+        _: 3
+      }, 16);
+    };
+  }
+}));
+exports.default = _sfc_main;

package/dist/lib/menu/Menu.vue3.js

@@ -0,0 +1,5 @@
+"use strict";
+Object.defineProperties(exports, { __esModule: { value: true }, [Symbol.toStringTag]: { value: "Module" } });
+const Menu_vue_vue_type_script_setup_true_lang = require("./Menu.vue.js");
+;/* empty css           */
+exports.default = Menu_vue_vue_type_script_setup_true_lang.default;

package/dist/lib/menu/index.d.ts

@@ -0,0 +1,4 @@
+import { InstallWithSFC } from '../utils';
+import { default as Menu } from './Menu.vue';
+export declare const JkyMenu: InstallWithSFC<typeof Menu>;
+export default JkyMenu;

package/dist/lib/menu/index.js

@@ -0,0 +1,8 @@
+"use strict";
+Object.defineProperties(exports, { __esModule: { value: true }, [Symbol.toStringTag]: { value: "Module" } });
+const Menu_vue_vue_type_script_setup_true_lang = require("./Menu.vue.js");
+;/* empty css           */
+const withInstall = require("../utils/with-install.js");
+const JkyMenu = withInstall.installWithSFC(Menu_vue_vue_type_script_setup_true_lang.default);
+exports.JkyMenu = JkyMenu;
+exports.default = JkyMenu;

package/dist/lib/menu/style.css

@@ -0,0 +1,70 @@
+/* Menu 组件样式 - 使用 CSS 变量实现主题化 */
+
+/* 1. 定义 CSS 变量 */
+:root {
+  /* 颜色变量 */
+  --jky-menu-bg-color: #ffffff;
+  --jky-menu-text-color: #303133;
+  --jky-menu-active-color: #409eff;
+  --jky-menu-hover-bg-color: #f5f7fa;
+  --jky-menu-hover-text-color: #606266;
+  
+  /* 尺寸变量 */
+  --jky-menu-item-height: 56px;
+  --jky-menu-item-padding: 0 20px;
+  --jky-menu-item-font-size: 14px;
+  
+  /* 图标 */
+  --jky-menu-icon-size: 18px;
+  --jky-menu-icon-margin: 8px;
+  
+  /* 边框 */
+  --jky-menu-border-color: #e4e7ed;
+  
+  /* 状态变量 */
+  --jky-menu-disabled-opacity: 0.5;
+  --jky-menu-disabled-text-color: #c0c4cc;
+}
+
+/* 2. 基础样式 */
+.jky-menu {
+  background-color: var(--jky-menu-bg-color);
+  color: var(--jky-menu-text-color);
+}
+
+/* 3. 菜单项容器样式 - 确保统一高度 */
+.jky-menu {
+li + li {
+    margin-top: 0;
+}
+}
+
+/* 4. 菜单项图标样式 */
+.jky-menu-item__icon {
+  display: inline-flex;
+  align-items: center;
+  justify-content: center;
+  width: var(--jky-menu-icon-size);
+  height: var(--jky-menu-icon-size);
+  margin-right: var(--jky-menu-icon-margin);
+  font-size: var(--jky-menu-icon-size);
+  flex-shrink: 0;
+}
+
+/* 5. 菜单项标题样式 */
+.jky-menu-item__title {
+  flex: 1;
+  font-size: var(--jky-menu-item-font-size);
+  color: var(--jky-menu-text-color);
+  line-height: normal;
+  overflow: hidden;
+  text-overflow: ellipsis;
+  white-space: nowrap;
+}
+
+/* 6. 禁用状态 */
+.jky-menu-item.is-disabled {
+  opacity: var(--jky-menu-disabled-opacity);
+  color: var(--jky-menu-disabled-text-color);
+  cursor: not-allowed;
+}

package/dist/lib/package.json.js

@@ -1,4 +1,4 @@
 "use strict";
 Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
-const version = "0.0.15";
+const version = "0.0.17";
 exports.version = version;

package/dist/lib/page-header/PageHeader.vue.d.ts

@@ -0,0 +1,45 @@
+type __VLS_Props = {
+    logo?: string;
+    title?: string;
+    height?: string | number;
+    background?: string;
+    backgroundImage?: string;
+    statusIcons?: StatusIcon[];
+    userName?: string;
+    userAvatar?: string;
+};
+interface StatusIcon {
+    icon: string | object;
+    label: string;
+    color?: string;
+    onClick?: () => void;
+}
+declare function __VLS_template(): {
+    attrs: Partial<{}>;
+    slots: {
+        center?(_: {}): any;
+        time?(_: {}): any;
+    };
+    refs: {};
+    rootEl: HTMLElement;
+};
+type __VLS_TemplateResult = ReturnType<typeof __VLS_template>;
+declare const __VLS_component: import('vue').DefineComponent<__VLS_Props, {}, {}, {}, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {} & {
+    logout: () => any;
+    clearCache: () => any;
+    profile: () => any;
+}, string, import('vue').PublicProps, Readonly<__VLS_Props> & Readonly<{
+    onLogout?: (() => any) | undefined;
+    onClearCache?: (() => any) | undefined;
+    onProfile?: (() => any) | undefined;
+}>, {
+    height: string | number;
+    statusIcons: StatusIcon[];
+}, {}, {}, {}, string, import('vue').ComponentProvideOptions, false, {}, HTMLElement>;
+declare const _default: __VLS_WithTemplateSlots<typeof __VLS_component, __VLS_TemplateResult["slots"]>;
+export default _default;
+type __VLS_WithTemplateSlots<T, S> = T & {
+    new (): {
+        $slots: S;
+    };
+};

package/dist/lib/page-header/PageHeader.vue.js

@@ -0,0 +1,263 @@
+"use strict";
+var __defProp = Object.defineProperty;
+var __defProps = Object.defineProperties;
+var __getOwnPropDescs = Object.getOwnPropertyDescriptors;
+var __getOwnPropSymbols = Object.getOwnPropertySymbols;
+var __hasOwnProp = Object.prototype.hasOwnProperty;
+var __propIsEnum = Object.prototype.propertyIsEnumerable;
+var __defNormalProp = (obj, key, value) => key in obj ? __defProp(obj, key, { enumerable: true, configurable: true, writable: true, value }) : obj[key] = value;
+var __spreadValues = (a, b) => {
+  for (var prop in b || (b = {}))
+    if (__hasOwnProp.call(b, prop))
+      __defNormalProp(a, prop, b[prop]);
+  if (__getOwnPropSymbols)
+    for (var prop of __getOwnPropSymbols(b)) {
+      if (__propIsEnum.call(b, prop))
+        __defNormalProp(a, prop, b[prop]);
+    }
+  return a;
+};
+var __spreadProps = (a, b) => __defProps(a, __getOwnPropDescs(b));
+Object.defineProperties(exports, { __esModule: { value: true }, [Symbol.toStringTag]: { value: "Module" } });
+const vue = require("vue");
+const ElementPlus = require("element-plus");
+const _hoisted_1 = { class: "jky-page-header__container" };
+const _hoisted_2 = { class: "jky-page-header__left" };
+const _hoisted_3 = ["src", "alt"];
+const _hoisted_4 = {
+  key: 1,
+  class: "jky-page-header__title"
+};
+const _hoisted_5 = { class: "jky-page-header__center" };
+const _hoisted_6 = { class: "jky-page-header__right" };
+const _hoisted_7 = { class: "jky-page-header__status-icons hidden md:flex" };
+const _hoisted_8 = {
+  xmlns: "http://www.w3.org/2000/svg",
+  style: { "color": "white" },
+  fill: "none",
+  viewBox: "0 0 24 24",
+  stroke: "currentColor"
+};
+const _hoisted_9 = { class: "jky-page-header__time hidden md:block" };
+const _hoisted_10 = { class: "jky-page-header__user" };
+const _hoisted_11 = ["src", "alt"];
+const _hoisted_12 = {
+  key: 2,
+  class: "jky-page-header__username hidden md:block"
+};
+const _sfc_main = /* @__PURE__ */ vue.defineComponent(__spreadProps(__spreadValues({}, {
+  name: "JkyPageHeader"
+}), {
+  __name: "PageHeader",
+  props: {
+    logo: {},
+    title: {},
+    height: { default: 76 },
+    background: {},
+    backgroundImage: {},
+    statusIcons: { default: () => [] },
+    userName: {},
+    userAvatar: {}
+  },
+  emits: ["logout", "clearCache", "profile"],
+  setup(__props, { emit: __emit }) {
+    const props = __props;
+    const emit = __emit;
+    const heightValue = vue.computed(() => {
+      if (typeof props.height === "number") {
+        return `${props.height}px`;
+      }
+      return props.height;
+    });
+    const backgroundStyle = vue.computed(() => {
+      const style = {};
+      if (props.backgroundImage) {
+        style.backgroundImage = `url(${props.backgroundImage})`;
+        style.backgroundSize = "cover";
+        style.backgroundPosition = "center";
+      }
+      if (props.background) {
+        style.backgroundColor = props.background;
+      }
+      return style;
+    });
+    function handleLogout() {
+      emit("logout");
+    }
+    function handleClearCache() {
+      emit("clearCache");
+    }
+    function handleProfile() {
+      emit("profile");
+    }
+    return (_ctx, _cache) => {
+      return vue.openBlock(), vue.createElementBlock("header", {
+        class: "jky-page-header",
+        style: vue.normalizeStyle([backgroundStyle.value, { height: heightValue.value }])
+      }, [
+        vue.createElementVNode("div", _hoisted_1, [
+          vue.createElementVNode("div", _hoisted_2, [
+            __props.logo ? (vue.openBlock(), vue.createElementBlock("img", {
+              key: 0,
+              src: __props.logo,
+              alt: __props.title || "Logo",
+              class: "jky-page-header__logo"
+            }, null, 8, _hoisted_3)) : vue.createCommentVNode("", true),
+            __props.title ? (vue.openBlock(), vue.createElementBlock("span", _hoisted_4, vue.toDisplayString(__props.title), 1)) : vue.createCommentVNode("", true)
+          ]),
+          vue.createElementVNode("div", _hoisted_5, [
+            vue.renderSlot(_ctx.$slots, "center")
+          ]),
+          vue.createElementVNode("div", _hoisted_6, [
+            vue.createElementVNode("div", _hoisted_7, [
+              (vue.openBlock(true), vue.createElementBlock(vue.Fragment, null, vue.renderList(__props.statusIcons, (icon, index) => {
+                return vue.openBlock(), vue.createElementBlock(vue.Fragment, { key: index }, [
+                  typeof icon.icon === "string" ? (vue.openBlock(), vue.createElementBlock("span", {
+                    key: 0,
+                    class: vue.normalizeClass(["jky-page-header__status-icon text-white cursor-pointer", [icon.icon]])
+                  }, null, 2)) : (vue.openBlock(), vue.createBlock(vue.unref(ElementPlus.ElIcon), {
+                    key: 1,
+                    size: 20,
+                    title: icon.label,
+                    color: icon.color || "white",
+                    class: "jky-page-header__status-icon cursor-pointer",
+                    onClick: icon.onClick
+                  }, {
+                    default: vue.withCtx(() => [
+                      (vue.openBlock(), vue.createBlock(vue.resolveDynamicComponent(icon.icon)))
+                    ]),
+                    _: 2
+                  }, 1032, ["title", "color", "onClick"]))
+                ], 64);
+              }), 128))
+            ]),
+            __props.statusIcons.length > 0 ? (vue.openBlock(), vue.createBlock(vue.unref(ElementPlus.ElDropdown), {
+              key: 0,
+              trigger: "click",
+              class: "md:hidden"
+            }, {
+              dropdown: vue.withCtx(() => [
+                vue.createVNode(vue.unref(ElementPlus.ElDropdownMenu), null, {
+                  default: vue.withCtx(() => [
+                    (vue.openBlock(true), vue.createElementBlock(vue.Fragment, null, vue.renderList(__props.statusIcons, (icon, index) => {
+                      return vue.openBlock(), vue.createBlock(vue.unref(ElementPlus.ElDropdownItem), {
+                        key: index,
+                        onClick: icon.onClick
+                      }, {
+                        default: vue.withCtx(() => [
+                          typeof icon.icon === "string" ? (vue.openBlock(), vue.createElementBlock("span", {
+                            key: 0,
+                            class: vue.normalizeClass(["text-white", [icon.icon]])
+                          }, null, 2)) : (vue.openBlock(), vue.createBlock(vue.unref(ElementPlus.ElIcon), {
+                            key: 1,
+                            size: 16,
+                            class: "mr-2"
+                          }, {
+                            default: vue.withCtx(() => [
+                              (vue.openBlock(), vue.createBlock(vue.resolveDynamicComponent(icon.icon)))
+                            ]),
+                            _: 2
+                          }, 1024)),
+                          vue.createTextVNode(" " + vue.toDisplayString(icon.label), 1)
+                        ]),
+                        _: 2
+                      }, 1032, ["onClick"]);
+                    }), 128))
+                  ]),
+                  _: 1
+                })
+              ]),
+              default: vue.withCtx(() => [
+                vue.createVNode(vue.unref(ElementPlus.ElIcon), {
+                  size: 20,
+                  class: "jky-page-header__status-icon text-white"
+                }, {
+                  default: vue.withCtx(() => [
+                    (vue.openBlock(), vue.createElementBlock("svg", _hoisted_8, [..._cache[0] || (_cache[0] = [
+                      vue.createElementVNode("path", {
+                        "stroke-linecap": "round",
+                        "stroke-linejoin": "round",
+                        "stroke-width": "2",
+                        d: "M4 6h16M4 12h16M4 18h16"
+                      }, null, -1)
+                    ])]))
+                  ]),
+                  _: 1
+                })
+              ]),
+              _: 1
+            })) : vue.createCommentVNode("", true),
+            vue.createElementVNode("div", _hoisted_9, [
+              vue.renderSlot(_ctx.$slots, "time", {}, () => [
+                vue.createElementVNode("span", null, vue.toDisplayString((/* @__PURE__ */ new Date()).toLocaleString("zh-CN")), 1)
+              ])
+            ]),
+            vue.createVNode(vue.unref(ElementPlus.ElDropdown), { trigger: "click" }, {
+              dropdown: vue.withCtx(() => [
+                vue.createVNode(vue.unref(ElementPlus.ElDropdownMenu), null, {
+                  default: vue.withCtx(() => [
+                    vue.createVNode(vue.unref(ElementPlus.ElDropdownItem), { onClick: handleProfile }, {
+                      default: vue.withCtx(() => [..._cache[2] || (_cache[2] = [
+                        vue.createElementVNode("span", { class: "icon-[heroicons--user]" }, null, -1),
+                        vue.createTextVNode(" 个人信息 ", -1)
+                      ])]),
+                      _: 1
+                    }),
+                    vue.createVNode(vue.unref(ElementPlus.ElDropdownItem), { onClick: handleClearCache }, {
+                      default: vue.withCtx(() => [..._cache[3] || (_cache[3] = [
+                        vue.createElementVNode("span", { class: "icon-[heroicons--trash]" }, null, -1),
+                        vue.createTextVNode(" 清理缓存 ", -1)
+                      ])]),
+                      _: 1
+                    }),
+                    vue.createVNode(vue.unref(ElementPlus.ElDropdownItem), {
+                      divided: "",
+                      onClick: handleLogout
+                    }, {
+                      default: vue.withCtx(() => [..._cache[4] || (_cache[4] = [
+                        vue.createElementVNode("span", { class: "icon-[heroicons--arrow-right-on-rectangle]" }, null, -1),
+                        vue.createTextVNode(" 注销 ", -1)
+                      ])]),
+                      _: 1
+                    })
+                  ]),
+                  _: 1
+                })
+              ]),
+              default: vue.withCtx(() => [
+                vue.createElementVNode("div", _hoisted_10, [
+                  __props.userAvatar ? (vue.openBlock(), vue.createBlock(vue.unref(ElementPlus.ElIcon), {
+                    key: 0,
+                    size: 32,
+                    class: "jky-page-header__avatar"
+                  }, {
+                    default: vue.withCtx(() => [
+                      vue.createElementVNode("img", {
+                        src: __props.userAvatar,
+                        alt: __props.userName,
+                        class: "rounded-full"
+                      }, null, 8, _hoisted_11)
+                    ]),
+                    _: 1
+                  })) : (vue.openBlock(), vue.createBlock(vue.unref(ElementPlus.ElIcon), {
+                    key: 1,
+                    size: 32,
+                    class: "jky-page-header__avatar"
+                  }, {
+                    default: vue.withCtx(() => [..._cache[1] || (_cache[1] = [
+                      vue.createElementVNode("span", { class: "icon-[heroicons--user]" }, null, -1)
+                    ])]),
+                    _: 1
+                  })),
+                  __props.userName ? (vue.openBlock(), vue.createElementBlock("span", _hoisted_12, vue.toDisplayString(__props.userName), 1)) : vue.createCommentVNode("", true)
+                ])
+              ]),
+              _: 1
+            })
+          ])
+        ])
+      ], 4);
+    };
+  }
+}));
+exports.default = _sfc_main;

package/dist/lib/page-header/PageHeader.vue3.js

@@ -0,0 +1,5 @@
+"use strict";
+Object.defineProperties(exports, { __esModule: { value: true }, [Symbol.toStringTag]: { value: "Module" } });
+const PageHeader_vue_vue_type_script_setup_true_lang = require("./PageHeader.vue.js");
+;/* empty css                 */
+exports.default = PageHeader_vue_vue_type_script_setup_true_lang.default;

package/dist/lib/page-header/index.d.ts

@@ -0,0 +1,4 @@
+import { InstallWithSFC } from '../utils';
+import { default as PageHeader } from './PageHeader.vue';
+export declare const JkyPageHeader: InstallWithSFC<typeof PageHeader>;
+export default JkyPageHeader;

package/dist/lib/page-header/index.js

@@ -0,0 +1,8 @@
+"use strict";
+Object.defineProperties(exports, { __esModule: { value: true }, [Symbol.toStringTag]: { value: "Module" } });
+const PageHeader_vue_vue_type_script_setup_true_lang = require("./PageHeader.vue.js");
+;/* empty css                 */
+const withInstall = require("../utils/with-install.js");
+const JkyPageHeader = withInstall.installWithSFC(PageHeader_vue_vue_type_script_setup_true_lang.default);
+exports.JkyPageHeader = JkyPageHeader;
+exports.default = JkyPageHeader;