jky-component-lib 0.0.61 → 0.0.64

package/dist/es/components.d.ts

@@ -6,6 +6,7 @@ export * from './code-mirror-editor';
 export * from './form';
 export * from './menu';
 export * from './page-header';
+export * from './page-layout';
 export * from './page-table';
 export * from './rich-editor';
 export * from './say-hello';

package/dist/es/components.js

@@ -5,6 +5,7 @@ import { JkyCodeMirrorEditor } from "./code-mirror-editor/index.js";
 import { JkyForm } from "./form/index.js";
 import { JkyMenu } from "./menu/index.js";
 import { JkyPageHeader } from "./page-header/index.js";
+import { JkyPageLayout } from "./page-layout/index.js";
 import { JkyPageTable } from "./page-table/index.js";
 import { JkyRichEditor } from "./rich-editor/index.js";
 import { JkySayHello } from "./say-hello/index.js";
@@ -18,7 +19,8 @@ const components = [
   JkyCodeMirrorEditor,
   JkyAddInput,
   JkyRichEditor,
-  JkyPageTable
+  JkyPageTable,
+  JkyPageLayout
 ];
 export {
   JkyAddInput,
@@ -28,6 +30,7 @@ export {
   JkyForm,
   JkyMenu,
   JkyPageHeader,
+  JkyPageLayout,
   JkyPageTable,
   JkyRichEditor,
   JkySayHello,

package/dist/es/form/Form.vue.d.ts

@@ -437,5 +437,5 @@ declare const _default: import('vue').DefineComponent<__VLS_PublicProps, {
             default?: (props: {}) => any;
         };
     }) | null;
-}, HTMLDivElement>;
+}, any>;
 export default _default;

package/dist/es/form/Form.vue.js

@@ -17,6 +17,18 @@ var __spreadValues = (a, b) => {
   return a;
 };
 var __spreadProps = (a, b) => __defProps(a, __getOwnPropDescs(b));
+var __objRest = (source, exclude) => {
+  var target = {};
+  for (var prop in source)
+    if (__hasOwnProp.call(source, prop) && exclude.indexOf(prop) < 0)
+      target[prop] = source[prop];
+  if (source != null && __getOwnPropSymbols)
+    for (var prop of __getOwnPropSymbols(source)) {
+      if (exclude.indexOf(prop) < 0 && __propIsEnum.call(source, prop))
+        target[prop] = source[prop];
+    }
+  return target;
+};
 var __async = (__this, __arguments, generator) => {
   return new Promise((resolve, reject) => {
     var fulfilled = (value) => {
@@ -37,7 +49,7 @@ var __async = (__this, __arguments, generator) => {
     step((generator = generator.apply(__this, __arguments)).next());
   });
 };
-import { defineComponent, useModel, ref, computed, watch, openBlock, createElementBlock, normalizeClass, toDisplayString, createCommentVNode, createVNode, unref, mergeProps, withCtx, Fragment, renderList, createBlock, createTextVNode, mergeModels } from "vue";
+import { defineComponent, useModel, ref, computed, useAttrs, watch, openBlock, createElementBlock, normalizeClass, toDisplayString, createCommentVNode, createVNode, unref, mergeProps, withCtx, Fragment, renderList, createBlock, createTextVNode, mergeModels } from "vue";
 import { ElForm, ElButton } from "element-plus";
 import _sfc_main$1 from "./FormItem.vue.js";
 /* empty css              */
@@ -50,7 +62,8 @@ const _hoisted_2 = {
   class: "jky-form__footer mt-6 flex justify-end gap-2"
 };
 const _sfc_main = /* @__PURE__ */ defineComponent(__spreadProps(__spreadValues({}, {
-  name: "JkyForm"
+  name: "JkyForm",
+  inheritAttrs: false
 }), {
   __name: "Form",
   props: /* @__PURE__ */ mergeModels({
@@ -100,10 +113,54 @@ const _sfc_main = /* @__PURE__ */ defineComponent(__spreadProps(__spreadValues({
     const formRef = ref();
     const formClass = computed(() => {
       return [
-        "jky-form",
-        props.className
+        "jky-form"
       ].filter(Boolean).join(" ");
     });
+    const attrs = useAttrs();
+    const elFormProps = computed(() => {
+      const _a = props, {
+        modelValue: modelValue2,
+        items,
+        showTitle,
+        title,
+        gutter,
+        defaultSpan,
+        responsive,
+        readonly,
+        disabled,
+        watchDeep,
+        showFooter,
+        submitText,
+        cancelText,
+        submitDisabled,
+        cancelDisabled,
+        onValidate,
+        onSubmit,
+        onReset
+      } = _a, rest = __objRest(_a, [
+        // JkyForm 自己的 props（不传递给 ElForm）
+        "modelValue",
+        "items",
+        "showTitle",
+        "title",
+        "gutter",
+        "defaultSpan",
+        "responsive",
+        "readonly",
+        "disabled",
+        "watchDeep",
+        "showFooter",
+        "submitText",
+        "cancelText",
+        "submitDisabled",
+        "cancelDisabled",
+        "onValidate",
+        "onSubmit",
+        "onReset"
+      ]);
+      const _b = rest, { model } = _b, formProps = __objRest(_b, ["model"]);
+      return __spreadValues(__spreadValues({}, formProps), attrs);
+    });
     watch(
       () => props.modelValue,
       (newVal, oldVal) => {
@@ -171,11 +228,8 @@ const _sfc_main = /* @__PURE__ */ defineComponent(__spreadProps(__spreadValues({
         createVNode(unref(ElForm), mergeProps({
           ref_key: "formRef",
           ref: formRef,
-          model: modelValue.value,
-          "label-width": __props.labelWidth,
-          "label-position": __props.labelPosition,
-          size: __props.size
-        }, _ctx.$attrs), {
+          model: modelValue.value
+        }, elFormProps.value), {
           default: withCtx(() => [
             (openBlock(true), createElementBlock(Fragment, null, renderList(__props.items, (item) => {
               return openBlock(), createBlock(_sfc_main$1, {
@@ -189,7 +243,7 @@ const _sfc_main = /* @__PURE__ */ defineComponent(__spreadProps(__spreadValues({
             }), 128))
           ]),
           _: 1
-        }, 16, ["model", "label-width", "label-position", "size"]),
+        }, 16, ["model"]),
         props.showFooter ? (openBlock(), createElementBlock("div", _hoisted_2, [
           createVNode(unref(ElButton), {
             disabled: __props.cancelDisabled || __props.disabled,

package/dist/es/form/FormItem.vue.js

@@ -161,7 +161,6 @@ const _sfc_main = /* @__PURE__ */ defineComponent(__spreadProps(__spreadValues({
         placeholder,
         componentProps: componentProps2,
         hidden,
-        className,
         customStyle,
         children,
         render,
@@ -184,7 +183,6 @@ const _sfc_main = /* @__PURE__ */ defineComponent(__spreadProps(__spreadValues({
         "placeholder",
         "componentProps",
         "hidden",
-        "className",
         "customStyle",
         "children",
         "render",
@@ -212,31 +210,38 @@ const _sfc_main = /* @__PURE__ */ defineComponent(__spreadProps(__spreadValues({
         });
       }
       const commonProps = __spreadValues({
-        "modelValue": modelValue.value,
+        // use `undefined` to fix placeholder issue
+        "modelValue": modelValue.value || void 0,
         "onUpdate:modelValue": (val) => {
-          props.model[props.field] = val;
+          props.model[props.field] = val || void 0;
         },
-        "placeholder": props.config.placeholder,
+        "placeholder": props.config.placeholder || void 0,
         "disabled": props.disabled,
         "clearable": props.config.clearable
       }, componentProps.value);
       switch (type) {
         case "input":
           return h(ElInput, __spreadProps(__spreadValues({}, commonProps), {
+            placeholder: commonProps.placeholder || "请输入",
             prefixIcon: props.config.prefixIcon,
             suffixIcon: props.config.suffixIcon
           }));
         case "textarea":
           return h(ElInput, __spreadProps(__spreadValues({}, commonProps), {
+            placeholder: commonProps.placeholder || "请输入",
             type: "textarea",
             rows: 4
           }));
         case "select": {
-          const selectProps = __spreadValues(__spreadValues({}, commonProps), componentProps.value);
+          const selectProps = __spreadValues(__spreadProps(__spreadValues({}, commonProps), {
+            placeholder: commonProps.placeholder || "请选择"
+          }), componentProps.value);
           return h(ElSelect, selectProps);
         }
         case "autocomplete": {
-          const autocompleteProps = __spreadValues(__spreadValues({}, commonProps), componentProps.value);
+          const autocompleteProps = __spreadValues(__spreadProps(__spreadValues({}, commonProps), {
+            placeholder: commonProps.placeholder || "请输入"
+          }), componentProps.value);
           return h(ElAutocomplete, autocompleteProps);
         }
         case "datepicker":
@@ -297,11 +302,15 @@ const _sfc_main = /* @__PURE__ */ defineComponent(__spreadProps(__spreadValues({
         case "slider":
           return h(ElSlider, __spreadValues(__spreadValues({}, commonProps), componentProps.value));
         case "cascader": {
-          const cascaderProps = __spreadValues(__spreadValues({}, commonProps), componentProps.value);
+          const cascaderProps = __spreadValues(__spreadProps(__spreadValues({}, commonProps), {
+            placeholder: commonProps.placeholder || "请选择"
+          }), componentProps.value);
           return h(ElCascader, cascaderProps);
         }
         case "tree-select": {
-          const treeSelectProps = __spreadValues(__spreadValues({}, commonProps), componentProps.value);
+          const treeSelectProps = __spreadValues(__spreadProps(__spreadValues({}, commonProps), {
+            placeholder: commonProps.placeholder || "请选择"
+          }), componentProps.value);
           return h(ElTreeSelect, treeSelectProps);
         }
         case "color-picker":
@@ -311,6 +320,7 @@ const _sfc_main = /* @__PURE__ */ defineComponent(__spreadProps(__spreadValues({
         case "input-number": {
           const numberModelValue = modelValue.value === "" || modelValue.value === null || modelValue.value === void 0 ? null : Number(modelValue.value);
           const inputNumberProps = __spreadValues(__spreadProps(__spreadValues({}, commonProps), {
+            "placeholder": commonProps.placeholder || "请输入",
             "modelValue": numberModelValue,
             "onUpdate:modelValue": (val) => {
               props.model[props.field] = val;
@@ -431,7 +441,7 @@ const _sfc_main = /* @__PURE__ */ defineComponent(__spreadProps(__spreadValues({
         key: 1,
         prop: __props.field
       }, __spreadValues(__spreadValues({}, formItemProps.value), _ctx.$attrs), {
-        class: ["jky-form-item jky-form-item--no-label", [__props.config.useDefaultBorderClass ? "border-l-4 border-solid border-l-(--el-color-primary) bg-(--el-color-primary)/50 pl-1.5" : "", __props.config.className]],
+        class: ["jky-form-item jky-form-item--no-label", [__props.config.useDefaultBorderClass ? "border-l-4 border-solid border-l-(--el-color-primary) bg-(--el-color-primary)/50 pl-1.5" : "", __props.config.class]],
         style: [__props.config.customStyle]
       }), {
         default: withCtx(() => [
@@ -450,7 +460,7 @@ const _sfc_main = /* @__PURE__ */ defineComponent(__spreadProps(__spreadValues({
         label: __props.config.label,
         prop: __props.field
       }, __spreadValues(__spreadValues({}, formItemProps.value), _ctx.$attrs), {
-        class: ["jky-form-item", [__props.config.className]]
+        class: ["jky-form-item", [__props.config.class]]
       }), createSlots({
         default: withCtx(() => [
           __props.config.prepend || __props.config.append ? (openBlock(), createElementBlock("div", _hoisted_4, [

package/dist/es/index.js

@@ -9,6 +9,7 @@ import { JkyCodeMirrorEditor } from "./code-mirror-editor/index.js";
 import { JkyForm } from "./form/index.js";
 import { JkyMenu } from "./menu/index.js";
 import { JkyPageHeader } from "./page-header/index.js";
+import { JkyPageLayout } from "./page-layout/index.js";
 import { JkyPageTable } from "./page-table/index.js";
 import { JkyRichEditor } from "./rich-editor/index.js";
 import { JkySayHello } from "./say-hello/index.js";
@@ -24,6 +25,7 @@ export {
   JkyForm,
   JkyMenu,
   JkyPageHeader,
+  JkyPageLayout,
   JkyPageTable,
   JkyRichEditor,
   JkySayHello,

package/dist/es/package.json.js

@@ -1,4 +1,4 @@
-const version = "0.0.61";
+const version = "0.0.64";
 export {
   version
 };

package/dist/es/page-layout/PageLayout.vue.d.ts

@@ -0,0 +1,36 @@
+import { PageLayoutProps } from './types';
+declare function __VLS_template(): {
+    attrs: Partial<{}>;
+    slots: {
+        menuHeader?(_: {}): any;
+        aside?(_: {}): any;
+        aside?(_: {}): any;
+        navigationHeader?(_: {}): any;
+        navigation?(_: {}): any;
+        navigation?(_: {}): any;
+        header?(_: {}): any;
+        tabs?(_: {}): any;
+        dashboard?(_: {}): any;
+        dashboard?(_: {}): any;
+        default?(_: {}): any;
+        default?(_: {
+            height: any;
+        }): any;
+    };
+    refs: {};
+    rootEl: HTMLDivElement;
+};
+type __VLS_TemplateResult = ReturnType<typeof __VLS_template>;
+declare const __VLS_component: import('vue').DefineComponent<PageLayoutProps, {}, {}, {}, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {}, string, import('vue').PublicProps, Readonly<PageLayoutProps> & Readonly<{}>, {
+    asideWithScrollbar: boolean;
+    mainWithScrollbar: boolean;
+    navigationWithScrollbar: boolean;
+    showNavigation: boolean;
+}, {}, {}, {}, string, import('vue').ComponentProvideOptions, false, {}, HTMLDivElement>;
+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/es/page-layout/PageLayout.vue.js

@@ -0,0 +1,152 @@
+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));
+import { defineComponent, resolveComponent, openBlock, createElementBlock, createVNode, unref, normalizeClass, createSlots, withCtx, createBlock, renderSlot, createCommentVNode, createElementVNode, resolveDynamicComponent } from "vue";
+import { ElCard, ElScrollbar } from "element-plus";
+const _hoisted_1 = {
+  class: "jky-page-layout flex h-full w-full overflow-hidden gap-x-4",
+  style: { "--el-menu-border-color": "transparent" }
+};
+const _sfc_main = /* @__PURE__ */ defineComponent(__spreadProps(__spreadValues({}, {
+  name: "JkyPageLayout"
+}), {
+  __name: "PageLayout",
+  props: {
+    asideClass: {},
+    asideWithScrollbar: { type: Boolean, default: true },
+    mainClass: {},
+    mainWithCard: { type: Boolean },
+    mainWithScrollbar: { type: Boolean, default: false },
+    contentClass: {},
+    navigationClass: {},
+    navigationWithScrollbar: { type: Boolean, default: true },
+    showNavigation: { type: Boolean, default: true },
+    headerClass: {},
+    tabsClass: {},
+    showDashboard: { type: Boolean },
+    dashboardWithScrollbar: { type: Boolean },
+    dashboardClass: {},
+    className: {}
+  },
+  setup(__props) {
+    const props = __props;
+    return (_ctx, _cache) => {
+      const _component_ElAutoResizer = resolveComponent("ElAutoResizer");
+      return openBlock(), createElementBlock("div", _hoisted_1, [
+        createVNode(unref(ElCard), {
+          class: normalizeClass(["jky-page-layout__aside shrink-0 overflow-hidden p-0", props.asideClass]),
+          style: { "--el-card-padding": 0 }
+        }, createSlots({
+          default: withCtx(() => [
+            props.asideWithScrollbar ? (openBlock(), createBlock(unref(ElScrollbar), { key: 0 }, {
+              default: withCtx(() => [
+                renderSlot(_ctx.$slots, "aside")
+              ]),
+              _: 3
+            })) : renderSlot(_ctx.$slots, "aside", { key: 1 })
+          ]),
+          _: 2
+        }, [
+          _ctx.$slots.menuHeader ? {
+            name: "header",
+            fn: withCtx(() => [
+              renderSlot(_ctx.$slots, "menuHeader")
+            ]),
+            key: "0"
+          } : void 0
+        ]), 1032, ["class"]),
+        __props.showNavigation ? (openBlock(), createBlock(unref(ElCard), {
+          key: 0,
+          class: normalizeClass(["jky-page-layout__navigation shrink-0 overflow-hidden p-0", props.navigationClass]),
+          style: { "--el-card-padding": 0 }
+        }, createSlots({
+          default: withCtx(() => [
+            props.navigationWithScrollbar ? (openBlock(), createBlock(unref(ElScrollbar), { key: 0 }, {
+              default: withCtx(() => [
+                renderSlot(_ctx.$slots, "navigation")
+              ]),
+              _: 3
+            })) : renderSlot(_ctx.$slots, "navigation", { key: 1 })
+          ]),
+          _: 2
+        }, [
+          _ctx.$slots.navigationHeader ? {
+            name: "header",
+            fn: withCtx(() => [
+              renderSlot(_ctx.$slots, "navigationHeader")
+            ]),
+            key: "0"
+          } : void 0
+        ]), 1032, ["class"])) : createCommentVNode("", true),
+        createElementVNode("div", {
+          class: normalizeClass(["jky-page-layout__main flex-1 flex flex-col min-w-0 overflow-hidden p-0 gap-y-4", props.mainClass])
+        }, [
+          _ctx.$slots.header ? (openBlock(), createElementBlock("div", {
+            key: 0,
+            class: normalizeClass(["jky-page-layout__header shrink-0 flex items-center overflow-hidden px-4", props.headerClass])
+          }, [
+            renderSlot(_ctx.$slots, "header")
+          ], 2)) : createCommentVNode("", true),
+          _ctx.$slots.tabs ? (openBlock(), createElementBlock("div", {
+            key: 1,
+            class: normalizeClass(["jky-page-layout__tabs shrink-0 overflow-hidden", props.tabsClass])
+          }, [
+            renderSlot(_ctx.$slots, "tabs")
+          ], 2)) : createCommentVNode("", true),
+          _ctx.$slots.dashboard ? (openBlock(), createBlock(unref(ElCard), {
+            key: 2,
+            class: normalizeClass(["jky-page-layout__dashboard shrink-0 overflow-hidden", props.dashboardClass])
+          }, {
+            default: withCtx(() => [
+              props.dashboardWithScrollbar ? (openBlock(), createBlock(unref(ElScrollbar), { key: 0 }, {
+                default: withCtx(() => [
+                  renderSlot(_ctx.$slots, "dashboard")
+                ]),
+                _: 3
+              })) : renderSlot(_ctx.$slots, "dashboard", { key: 1 })
+            ]),
+            _: 3
+          }, 8, ["class"])) : createCommentVNode("", true),
+          (openBlock(), createBlock(resolveDynamicComponent(props.mainWithCard ? unref(ElCard) : "div"), {
+            "body-class": props.mainWithScrollbar ? "" : "pb-0!",
+            class: normalizeClass(["jky-page-layout__content flex-1 min-h-0 overflow-hidden", props.contentClass])
+          }, {
+            default: withCtx(() => [
+              props.mainWithScrollbar ? (openBlock(), createBlock(unref(ElScrollbar), { key: 0 }, {
+                default: withCtx(() => [
+                  renderSlot(_ctx.$slots, "default")
+                ]),
+                _: 3
+              })) : (openBlock(), createBlock(_component_ElAutoResizer, { key: 1 }, {
+                default: withCtx(({ height }) => [
+                  renderSlot(_ctx.$slots, "default", { height })
+                ]),
+                _: 3
+              }))
+            ]),
+            _: 3
+          }, 8, ["body-class", "class"]))
+        ], 2)
+      ]);
+    };
+  }
+}));
+export {
+  _sfc_main as default
+};

package/dist/es/page-layout/PageLayout.vue3.js

@@ -0,0 +1,5 @@
+import _sfc_main from "./PageLayout.vue.js";
+/* empty css                */
+export {
+  _sfc_main as default
+};

package/dist/es/page-layout/index.d.ts

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

package/dist/es/page-layout/index.js

@@ -0,0 +1,8 @@
+import _sfc_main from "./PageLayout.vue.js";
+/* empty css                */
+import { installWithSFC } from "../utils/with-install.js";
+const JkyPageLayout = installWithSFC(_sfc_main);
+export {
+  JkyPageLayout,
+  JkyPageLayout as default
+};

package/dist/es/page-layout/style.css

@@ -0,0 +1,8 @@
+:root {
+  /* PageLayout 布局组件 CSS 变量 */
+}
+.jky-page-layout {
+.el-menu {
+    border-right: none;
+}
+}