z-crud-table 0.0.17 → 0.0.18

package/dist/components/CrudTable.vue.d.ts

@@ -308,9 +308,7 @@ declare const _default: __VLS_WithTemplateSlots<import('vue').DefineComponent<im
     paginationHideOnSinglePage: boolean;
     dialogFormConfig: any[];
     dialogFormRules: Record<string, any>;
-}, {}, {}, {}, string, import('vue').ComponentProvideOptions, true, {}, any>, Partial<Record<any, (_: {
-    row: any;
-}) => any>> & {
+}, {}, {}, {}, string, import('vue').ComponentProvideOptions, true, {}, any>, {
     header?(_: {}): any;
     "query-conditions"?(_: {
         searchForm: {
@@ -334,6 +332,10 @@ declare const _default: __VLS_WithTemplateSlots<import('vue').DefineComponent<im
     "action-after-delete"?(_: {
         row: any;
     }): any;
+    "dialog-form-content"?(_: {
+        formData: Record<string, any>;
+        mode: "add" | "edit";
+    }): any;
 }>;
 export default _default;
 type __VLS_WithTemplateSlots<T, S> = T & {

package/dist/components/DynamicForm.vue.d.ts

@@ -0,0 +1,21 @@
+declare const _default: import('vue').DefineComponent<import('vue').ExtractPropTypes<__VLS_TypePropsToRuntimeProps<{
+    modelValue: Record<string, any>;
+    formConfig: any[];
+    rules?: Record<string, any> | undefined;
+}>>, {
+    validate: () => any;
+}, {}, {}, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {}, string, import('vue').PublicProps, Readonly<import('vue').ExtractPropTypes<__VLS_TypePropsToRuntimeProps<{
+    modelValue: Record<string, any>;
+    formConfig: any[];
+    rules?: Record<string, any> | undefined;
+}>>> & Readonly<{}>, {}, {}, {}, {}, string, import('vue').ComponentProvideOptions, true, {}, any>;
+export default _default;
+type __VLS_NonUndefinedable<T> = T extends undefined ? never : T;
+type __VLS_TypePropsToRuntimeProps<T> = {
+    [K in keyof T]-?: {} extends Pick<T, K> ? {
+        type: import('vue').PropType<__VLS_NonUndefinedable<T[K]>>;
+    } : {
+        type: import('vue').PropType<T[K]>;
+        required: true;
+    };
+};

package/dist/z-crud-table.css

@@ -1 +1 @@
-*,:before,:after{--tw-border-spacing-x: 0;--tw-border-spacing-y: 0;--tw-translate-x: 0;--tw-translate-y: 0;--tw-rotate: 0;--tw-skew-x: 0;--tw-skew-y: 0;--tw-scale-x: 1;--tw-scale-y: 1;--tw-pan-x: ;--tw-pan-y: ;--tw-pinch-zoom: ;--tw-scroll-snap-strictness: proximity;--tw-gradient-from-position: ;--tw-gradient-via-position: ;--tw-gradient-to-position: ;--tw-ordinal: ;--tw-slashed-zero: ;--tw-numeric-figure: ;--tw-numeric-spacing: ;--tw-numeric-fraction: ;--tw-ring-inset: ;--tw-ring-offset-width: 0px;--tw-ring-offset-color: #fff;--tw-ring-color: rgb(59 130 246 / .5);--tw-ring-offset-shadow: 0 0 #0000;--tw-ring-shadow: 0 0 #0000;--tw-shadow: 0 0 #0000;--tw-shadow-colored: 0 0 #0000;--tw-blur: ;--tw-brightness: ;--tw-contrast: ;--tw-grayscale: ;--tw-hue-rotate: ;--tw-invert: ;--tw-saturate: ;--tw-sepia: ;--tw-drop-shadow: ;--tw-backdrop-blur: ;--tw-backdrop-brightness: ;--tw-backdrop-contrast: ;--tw-backdrop-grayscale: ;--tw-backdrop-hue-rotate: ;--tw-backdrop-invert: ;--tw-backdrop-opacity: ;--tw-backdrop-saturate: ;--tw-backdrop-sepia: ;--tw-contain-size: ;--tw-contain-layout: ;--tw-contain-paint: ;--tw-contain-style: }::backdrop{--tw-border-spacing-x: 0;--tw-border-spacing-y: 0;--tw-translate-x: 0;--tw-translate-y: 0;--tw-rotate: 0;--tw-skew-x: 0;--tw-skew-y: 0;--tw-scale-x: 1;--tw-scale-y: 1;--tw-pan-x: ;--tw-pan-y: ;--tw-pinch-zoom: ;--tw-scroll-snap-strictness: proximity;--tw-gradient-from-position: ;--tw-gradient-via-position: ;--tw-gradient-to-position: ;--tw-ordinal: ;--tw-slashed-zero: ;--tw-numeric-figure: ;--tw-numeric-spacing: ;--tw-numeric-fraction: ;--tw-ring-inset: ;--tw-ring-offset-width: 0px;--tw-ring-offset-color: #fff;--tw-ring-color: rgb(59 130 246 / .5);--tw-ring-offset-shadow: 0 0 #0000;--tw-ring-shadow: 0 0 #0000;--tw-shadow: 0 0 #0000;--tw-shadow-colored: 0 0 #0000;--tw-blur: ;--tw-brightness: ;--tw-contrast: ;--tw-grayscale: ;--tw-hue-rotate: ;--tw-invert: ;--tw-saturate: ;--tw-sepia: ;--tw-drop-shadow: ;--tw-backdrop-blur: ;--tw-backdrop-brightness: ;--tw-backdrop-contrast: ;--tw-backdrop-grayscale: ;--tw-backdrop-hue-rotate: ;--tw-backdrop-invert: ;--tw-backdrop-opacity: ;--tw-backdrop-saturate: ;--tw-backdrop-sepia: ;--tw-contain-size: ;--tw-contain-layout: ;--tw-contain-paint: ;--tw-contain-style: }*,:before,:after{box-sizing:border-box;border-width:0;border-style:solid;border-color:#e5e7eb}:before,:after{--tw-content: ""}html,:host{line-height:1.5;-webkit-text-size-adjust:100%;-moz-tab-size:4;-o-tab-size:4;tab-size:4;font-family:ui-sans-serif,system-ui,sans-serif,"Apple Color Emoji","Segoe UI Emoji",Segoe UI Symbol,"Noto Color Emoji";font-feature-settings:normal;font-variation-settings:normal;-webkit-tap-highlight-color:transparent}body{margin:0;line-height:inherit}hr{height:0;color:inherit;border-top-width:1px}abbr:where([title]){-webkit-text-decoration:underline dotted;text-decoration:underline dotted}h1,h2,h3,h4,h5,h6{font-size:inherit;font-weight:inherit}a{color:inherit;text-decoration:inherit}b,strong{font-weight:bolder}code,kbd,samp,pre{font-family:ui-monospace,SFMono-Regular,Menlo,Monaco,Consolas,Liberation Mono,Courier New,monospace;font-feature-settings:normal;font-variation-settings:normal;font-size:1em}small{font-size:80%}sub,sup{font-size:75%;line-height:0;position:relative;vertical-align:baseline}sub{bottom:-.25em}sup{top:-.5em}table{text-indent:0;border-color:inherit;border-collapse:collapse}button,input,optgroup,select,textarea{font-family:inherit;font-feature-settings:inherit;font-variation-settings:inherit;font-size:100%;font-weight:inherit;line-height:inherit;letter-spacing:inherit;color:inherit;margin:0;padding:0}button,select{text-transform:none}button,input:where([type=button]),input:where([type=reset]),input:where([type=submit]){-webkit-appearance:button;background-color:transparent;background-image:none}:-moz-focusring{outline:auto}:-moz-ui-invalid{box-shadow:none}progress{vertical-align:baseline}::-webkit-inner-spin-button,::-webkit-outer-spin-button{height:auto}[type=search]{-webkit-appearance:textfield;outline-offset:-2px}::-webkit-search-decoration{-webkit-appearance:none}::-webkit-file-upload-button{-webkit-appearance:button;font:inherit}summary{display:list-item}blockquote,dl,dd,h1,h2,h3,h4,h5,h6,hr,figure,p,pre{margin:0}fieldset{margin:0;padding:0}legend{padding:0}ol,ul,menu{list-style:none;margin:0;padding:0}dialog{padding:0}textarea{resize:vertical}input::-moz-placeholder,textarea::-moz-placeholder{opacity:1;color:#9ca3af}input::placeholder,textarea::placeholder{opacity:1;color:#9ca3af}button,[role=button]{cursor:pointer}:disabled{cursor:default}img,svg,video,canvas,audio,iframe,embed,object{display:block;vertical-align:middle}img,video{max-width:100%;height:auto}[hidden]:where(:not([hidden=until-found])){display:none}.visible{visibility:visible}.\!mr-0{margin-right:0!important}.mb-4{margin-bottom:1rem}.mb-6{margin-bottom:1.5rem}.flex{display:flex}.flex-shrink-0{flex-shrink:0}.flex-wrap{flex-wrap:wrap}.flex-nowrap{flex-wrap:nowrap}.items-center{align-items:center}.justify-between{justify-content:space-between}.gap-4{gap:1rem}.gap-x-2{-moz-column-gap:.5rem;column-gap:.5rem}.gap-x-3{-moz-column-gap:.75rem;column-gap:.75rem}.gap-x-4{-moz-column-gap:1rem;column-gap:1rem}.space-y-12>:not([hidden])~:not([hidden]){--tw-space-y-reverse: 0;margin-top:calc(3rem * calc(1 - var(--tw-space-y-reverse)));margin-bottom:calc(3rem * var(--tw-space-y-reverse))}.rounded-xl{border-radius:.75rem}.border-l-4{border-left-width:4px}.border-green-500{--tw-border-opacity: 1;border-color:rgb(34 197 94 / var(--tw-border-opacity, 1))}.bg-white{--tw-bg-opacity: 1;background-color:rgb(255 255 255 / var(--tw-bg-opacity, 1))}.p-4{padding:1rem}.p-6{padding:1.5rem}.pl-3{padding-left:.75rem}.text-2xl{font-size:1.5rem;line-height:2rem}.text-xl{font-size:1.25rem;line-height:1.75rem}.font-bold{font-weight:700}.font-semibold{font-weight:600}.text-gray-700{--tw-text-opacity: 1;color:rgb(55 65 81 / var(--tw-text-opacity, 1))}.text-gray-800{--tw-text-opacity: 1;color:rgb(31 41 55 / var(--tw-text-opacity, 1))}.shadow-lg{--tw-shadow: 0 10px 15px -3px rgb(0 0 0 / .1), 0 4px 6px -4px rgb(0 0 0 / .1);--tw-shadow-colored: 0 10px 15px -3px var(--tw-shadow-color), 0 4px 6px -4px var(--tw-shadow-color);box-shadow:var(--tw-ring-offset-shadow, 0 0 #0000),var(--tw-ring-shadow, 0 0 #0000),var(--tw-shadow)}.blur{--tw-blur: blur(8px);filter:var(--tw-blur) var(--tw-brightness) var(--tw-contrast) var(--tw-grayscale) var(--tw-hue-rotate) var(--tw-invert) var(--tw-saturate) var(--tw-sepia) var(--tw-drop-shadow)}.filter{filter:var(--tw-blur) var(--tw-brightness) var(--tw-contrast) var(--tw-grayscale) var(--tw-hue-rotate) var(--tw-invert) var(--tw-saturate) var(--tw-sepia) var(--tw-drop-shadow)}body{background-color:#f0f2f5;font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Helvetica Neue,Arial,sans-serif;margin:0}#app{-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;color:#2c3e50;padding:1rem}@media (min-width: 768px){#app{padding:1.5rem}}.crud-container{transition:box-shadow .3s ease-in-out}.crud-container:hover{box-shadow:0 20px 25px -5px #0000001a,0 8px 10px -6px #0000001a}.query-form .el-form-item{margin-bottom:0!important}.el-table__expanded-cell{padding:1rem 3.5rem!important;background-color:#f8fafc}.action-buttons>*+*{margin-left:.75rem}.el-dialog__header{border-bottom:none;padding:24px 24px 10px}.el-dialog__title{font-size:1.25rem;font-weight:600}.el-dialog__footer{border-top:none;padding:10px 24px 24px}.el-dialog__body{padding:10px 24px}:root{--large-screen-border-color: rgba(120, 153, 199, 1);--large-screen-text-color: rgba(227, 246, 255, 1);--large-screen-search-bg: rgba(210, 224, 243, .1);--large-screen-button-bg: rgba(38, 120, 255, 1);--large-screen-action-link-color: rgba(39, 233, 255, 1);--large-screen-dialog-bg: #1e293b;--large-screen-hover-bg: rgba(120, 153, 199, .15)}.theme-large-screen{color:var(--large-screen-text-color)}.theme-large-screen .crud-container{background-color:transparent!important;border:none}.theme-large-screen .el-table,.theme-large-screen .el-table__expanded-cell,.theme-large-screen .el-table th.el-table__cell,.theme-large-screen .el-table tr,.theme-large-screen .el-table .el-table__row{background-color:transparent!important;color:var(--large-screen-text-color)}.theme-large-screen .el-table th.el-table__cell{font-weight:600}.theme-large-screen .el-table td.el-table__cell,.theme-large-screen .el-table th.el-table__cell.is-leaf{border-bottom:1px solid var(--large-screen-border-color)}.theme-large-screen .el-table--enable-row-hover .el-table__body tr:hover>td.el-table__cell{background-color:var(--large-screen-hover-bg)!important}.theme-large-screen .el-table--border .el-table__inner-wrapper:after,.theme-large-screen .el-table--border:after,.theme-large-screen .el-table--border:before,.theme-large-screen .el-table__inner-wrapper:before{background-color:var(--large-screen-border-color)}.theme-large-screen .el-form-item__label{color:var(--large-screen-text-color)}.theme-large-screen .query-form .el-input__wrapper,.theme-large-screen .query-form .el-select__wrapper{background-color:var(--large-screen-search-bg);box-shadow:none!important;border:1px solid var(--large-screen-border-color)}.theme-large-screen .el-input__inner{color:var(--large-screen-text-color)}.theme-large-screen .el-button--primary,.theme-large-screen .el-button--success{background-color:var(--large-screen-button-bg);border-color:var(--large-screen-button-bg);color:#fff}.theme-large-screen .el-button--primary:hover,.theme-large-screen .el-button--success:hover{filter:brightness(1.2);background-color:var(--large-screen-button-bg);border-color:var(--large-screen-button-bg)}.theme-large-screen .el-button--danger:not(.is-link){background-color:#f56c6c;border-color:#f56c6c;color:#fff}.theme-large-screen .el-table .el-button.is-link{color:var(--large-screen-action-link-color)}.theme-large-screen .el-table .el-button.is-link:hover{filter:brightness(1.2)}.theme-large-screen .el-pagination{--el-pagination-text-color: var(--large-screen-text-color);--el-pagination-bg-color: transparent;--el-pagination-button-disabled-bg-color: rgba(120, 153, 199, .2);--el-pagination-button-bg-color: rgba(120, 153, 199, .3)}.large-screen-dialog .el-dialog{background-color:var(--el-dialog-bg-color)!important;border-radius:8px}.large-screen-dialog .el-dialog__title,.large-screen-dialog .el-dialog__body{color:var(--large-screen-text-color)}.large-screen-dialog .el-form-item__label{color:var(--large-screen-text-color)!important}.large-screen-dialog .el-input__wrapper,.large-screen-dialog .el-select__wrapper{background-color:#7899c71a!important;border:1px solid var(--large-screen-border-color)!important;box-shadow:none!important}.large-screen-dialog .el-input__inner,.large-screen-dialog .el-radio__label{color:var(--large-screen-text-color)!important}.large-screen-dialog .el-button--primary{background-color:var(--large-screen-button-bg);border-color:var(--large-screen-button-bg);color:#fff}
+*,:before,:after{--tw-border-spacing-x: 0;--tw-border-spacing-y: 0;--tw-translate-x: 0;--tw-translate-y: 0;--tw-rotate: 0;--tw-skew-x: 0;--tw-skew-y: 0;--tw-scale-x: 1;--tw-scale-y: 1;--tw-pan-x: ;--tw-pan-y: ;--tw-pinch-zoom: ;--tw-scroll-snap-strictness: proximity;--tw-gradient-from-position: ;--tw-gradient-via-position: ;--tw-gradient-to-position: ;--tw-ordinal: ;--tw-slashed-zero: ;--tw-numeric-figure: ;--tw-numeric-spacing: ;--tw-numeric-fraction: ;--tw-ring-inset: ;--tw-ring-offset-width: 0px;--tw-ring-offset-color: #fff;--tw-ring-color: rgb(59 130 246 / .5);--tw-ring-offset-shadow: 0 0 #0000;--tw-ring-shadow: 0 0 #0000;--tw-shadow: 0 0 #0000;--tw-shadow-colored: 0 0 #0000;--tw-blur: ;--tw-brightness: ;--tw-contrast: ;--tw-grayscale: ;--tw-hue-rotate: ;--tw-invert: ;--tw-saturate: ;--tw-sepia: ;--tw-drop-shadow: ;--tw-backdrop-blur: ;--tw-backdrop-brightness: ;--tw-backdrop-contrast: ;--tw-backdrop-grayscale: ;--tw-backdrop-hue-rotate: ;--tw-backdrop-invert: ;--tw-backdrop-opacity: ;--tw-backdrop-saturate: ;--tw-backdrop-sepia: ;--tw-contain-size: ;--tw-contain-layout: ;--tw-contain-paint: ;--tw-contain-style: }::backdrop{--tw-border-spacing-x: 0;--tw-border-spacing-y: 0;--tw-translate-x: 0;--tw-translate-y: 0;--tw-rotate: 0;--tw-skew-x: 0;--tw-skew-y: 0;--tw-scale-x: 1;--tw-scale-y: 1;--tw-pan-x: ;--tw-pan-y: ;--tw-pinch-zoom: ;--tw-scroll-snap-strictness: proximity;--tw-gradient-from-position: ;--tw-gradient-via-position: ;--tw-gradient-to-position: ;--tw-ordinal: ;--tw-slashed-zero: ;--tw-numeric-figure: ;--tw-numeric-spacing: ;--tw-numeric-fraction: ;--tw-ring-inset: ;--tw-ring-offset-width: 0px;--tw-ring-offset-color: #fff;--tw-ring-color: rgb(59 130 246 / .5);--tw-ring-offset-shadow: 0 0 #0000;--tw-ring-shadow: 0 0 #0000;--tw-shadow: 0 0 #0000;--tw-shadow-colored: 0 0 #0000;--tw-blur: ;--tw-brightness: ;--tw-contrast: ;--tw-grayscale: ;--tw-hue-rotate: ;--tw-invert: ;--tw-saturate: ;--tw-sepia: ;--tw-drop-shadow: ;--tw-backdrop-blur: ;--tw-backdrop-brightness: ;--tw-backdrop-contrast: ;--tw-backdrop-grayscale: ;--tw-backdrop-hue-rotate: ;--tw-backdrop-invert: ;--tw-backdrop-opacity: ;--tw-backdrop-saturate: ;--tw-backdrop-sepia: ;--tw-contain-size: ;--tw-contain-layout: ;--tw-contain-paint: ;--tw-contain-style: }*,:before,:after{box-sizing:border-box;border-width:0;border-style:solid;border-color:#e5e7eb}:before,:after{--tw-content: ""}html,:host{line-height:1.5;-webkit-text-size-adjust:100%;-moz-tab-size:4;-o-tab-size:4;tab-size:4;font-family:ui-sans-serif,system-ui,sans-serif,"Apple Color Emoji","Segoe UI Emoji",Segoe UI Symbol,"Noto Color Emoji";font-feature-settings:normal;font-variation-settings:normal;-webkit-tap-highlight-color:transparent}body{margin:0;line-height:inherit}hr{height:0;color:inherit;border-top-width:1px}abbr:where([title]){-webkit-text-decoration:underline dotted;text-decoration:underline dotted}h1,h2,h3,h4,h5,h6{font-size:inherit;font-weight:inherit}a{color:inherit;text-decoration:inherit}b,strong{font-weight:bolder}code,kbd,samp,pre{font-family:ui-monospace,SFMono-Regular,Menlo,Monaco,Consolas,Liberation Mono,Courier New,monospace;font-feature-settings:normal;font-variation-settings:normal;font-size:1em}small{font-size:80%}sub,sup{font-size:75%;line-height:0;position:relative;vertical-align:baseline}sub{bottom:-.25em}sup{top:-.5em}table{text-indent:0;border-color:inherit;border-collapse:collapse}button,input,optgroup,select,textarea{font-family:inherit;font-feature-settings:inherit;font-variation-settings:inherit;font-size:100%;font-weight:inherit;line-height:inherit;letter-spacing:inherit;color:inherit;margin:0;padding:0}button,select{text-transform:none}button,input:where([type=button]),input:where([type=reset]),input:where([type=submit]){-webkit-appearance:button;background-color:transparent;background-image:none}:-moz-focusring{outline:auto}:-moz-ui-invalid{box-shadow:none}progress{vertical-align:baseline}::-webkit-inner-spin-button,::-webkit-outer-spin-button{height:auto}[type=search]{-webkit-appearance:textfield;outline-offset:-2px}::-webkit-search-decoration{-webkit-appearance:none}::-webkit-file-upload-button{-webkit-appearance:button;font:inherit}summary{display:list-item}blockquote,dl,dd,h1,h2,h3,h4,h5,h6,hr,figure,p,pre{margin:0}fieldset{margin:0;padding:0}legend{padding:0}ol,ul,menu{list-style:none;margin:0;padding:0}dialog{padding:0}textarea{resize:vertical}input::-moz-placeholder,textarea::-moz-placeholder{opacity:1;color:#9ca3af}input::placeholder,textarea::placeholder{opacity:1;color:#9ca3af}button,[role=button]{cursor:pointer}:disabled{cursor:default}img,svg,video,canvas,audio,iframe,embed,object{display:block;vertical-align:middle}img,video{max-width:100%;height:auto}[hidden]:where(:not([hidden=until-found])){display:none}.visible{visibility:visible}.\!mr-0{margin-right:0!important}.mb-4{margin-bottom:1rem}.mb-6{margin-bottom:1.5rem}.flex{display:flex}.flex-shrink-0{flex-shrink:0}.flex-wrap{flex-wrap:wrap}.flex-nowrap{flex-wrap:nowrap}.items-center{align-items:center}.justify-end{justify-content:flex-end}.justify-between{justify-content:space-between}.gap-4{gap:1rem}.gap-x-2{-moz-column-gap:.5rem;column-gap:.5rem}.gap-x-3{-moz-column-gap:.75rem;column-gap:.75rem}.gap-x-4{-moz-column-gap:1rem;column-gap:1rem}.space-y-12>:not([hidden])~:not([hidden]){--tw-space-y-reverse: 0;margin-top:calc(3rem * calc(1 - var(--tw-space-y-reverse)));margin-bottom:calc(3rem * var(--tw-space-y-reverse))}.rounded-xl{border-radius:.75rem}.border-l-4{border-left-width:4px}.border-green-500{--tw-border-opacity: 1;border-color:rgb(34 197 94 / var(--tw-border-opacity, 1))}.bg-white{--tw-bg-opacity: 1;background-color:rgb(255 255 255 / var(--tw-bg-opacity, 1))}.p-4{padding:1rem}.p-6{padding:1.5rem}.pl-3{padding-left:.75rem}.text-2xl{font-size:1.5rem;line-height:2rem}.text-xl{font-size:1.25rem;line-height:1.75rem}.font-bold{font-weight:700}.font-semibold{font-weight:600}.text-gray-700{--tw-text-opacity: 1;color:rgb(55 65 81 / var(--tw-text-opacity, 1))}.text-gray-800{--tw-text-opacity: 1;color:rgb(31 41 55 / var(--tw-text-opacity, 1))}.shadow-lg{--tw-shadow: 0 10px 15px -3px rgb(0 0 0 / .1), 0 4px 6px -4px rgb(0 0 0 / .1);--tw-shadow-colored: 0 10px 15px -3px var(--tw-shadow-color), 0 4px 6px -4px var(--tw-shadow-color);box-shadow:var(--tw-ring-offset-shadow, 0 0 #0000),var(--tw-ring-shadow, 0 0 #0000),var(--tw-shadow)}.blur{--tw-blur: blur(8px);filter:var(--tw-blur) var(--tw-brightness) var(--tw-contrast) var(--tw-grayscale) var(--tw-hue-rotate) var(--tw-invert) var(--tw-saturate) var(--tw-sepia) var(--tw-drop-shadow)}.filter{filter:var(--tw-blur) var(--tw-brightness) var(--tw-contrast) var(--tw-grayscale) var(--tw-hue-rotate) var(--tw-invert) var(--tw-saturate) var(--tw-sepia) var(--tw-drop-shadow)}body{background-color:#f0f2f5;font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Helvetica Neue,Arial,sans-serif;margin:0}#app{-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;color:#2c3e50;padding:1rem}@media (min-width: 768px){#app{padding:1.5rem}}.crud-container{transition:box-shadow .3s ease-in-out}.crud-container:hover{box-shadow:0 20px 25px -5px #0000001a,0 8px 10px -6px #0000001a}.query-form .el-form-item{margin-bottom:0!important}.el-table__expanded-cell{padding:1rem 3.5rem!important;background-color:#f8fafc}.action-buttons>*+*{margin-left:.75rem}.el-dialog__header{border-bottom:none;padding:24px 24px 10px}.el-dialog__title{font-size:1.25rem;font-weight:600}.el-dialog__footer{border-top:none;padding:10px 24px 24px}.el-dialog__body{padding:10px 24px}:root{--large-screen-border-color: rgba(120, 153, 199, 1);--large-screen-text-color: rgba(227, 246, 255, 1);--large-screen-search-bg: rgba(210, 224, 243, .1);--large-screen-button-bg: rgba(38, 120, 255, 1);--large-screen-action-link-color: rgba(39, 233, 255, 1);--large-screen-dialog-bg: #1e293b;--large-screen-hover-bg: rgba(120, 153, 199, .15)}.theme-large-screen{color:var(--large-screen-text-color)}.theme-large-screen .crud-container{background-color:transparent!important;border:none}.theme-large-screen .el-table,.theme-large-screen .el-table__expanded-cell,.theme-large-screen .el-table th.el-table__cell,.theme-large-screen .el-table tr,.theme-large-screen .el-table .el-table__row{background-color:transparent!important;color:var(--large-screen-text-color)}.theme-large-screen .el-table th.el-table__cell{font-weight:600}.theme-large-screen .el-table td.el-table__cell,.theme-large-screen .el-table th.el-table__cell.is-leaf{border-bottom:1px solid var(--large-screen-border-color)}.theme-large-screen .el-table--enable-row-hover .el-table__body tr:hover>td.el-table__cell{background-color:var(--large-screen-hover-bg)!important}.theme-large-screen .el-table--border .el-table__inner-wrapper:after,.theme-large-screen .el-table--border:after,.theme-large-screen .el-table--border:before,.theme-large-screen .el-table__inner-wrapper:before{background-color:var(--large-screen-border-color)}.theme-large-screen .el-form-item__label{color:var(--large-screen-text-color)}.theme-large-screen .query-form .el-input__wrapper,.theme-large-screen .query-form .el-select__wrapper{background-color:var(--large-screen-search-bg);box-shadow:none!important;border:1px solid var(--large-screen-border-color)}.theme-large-screen .el-input__inner{color:var(--large-screen-text-color)}.theme-large-screen .el-button--primary,.theme-large-screen .el-button--success{background-color:var(--large-screen-button-bg);border-color:var(--large-screen-button-bg);color:#fff}.theme-large-screen .el-button--primary:hover,.theme-large-screen .el-button--success:hover{filter:brightness(1.2);background-color:var(--large-screen-button-bg);border-color:var(--large-screen-button-bg)}.theme-large-screen .el-button--danger:not(.is-link){background-color:#f56c6c;border-color:#f56c6c;color:#fff}.theme-large-screen .el-table .el-button.is-link{color:var(--large-screen-action-link-color)}.theme-large-screen .el-table .el-button.is-link:hover{filter:brightness(1.2)}.theme-large-screen .el-pagination{--el-pagination-text-color: var(--large-screen-text-color);--el-pagination-bg-color: transparent;--el-pagination-button-disabled-bg-color: rgba(120, 153, 199, .2);--el-pagination-button-bg-color: rgba(120, 153, 199, .3)}.large-screen-dialog .el-dialog{background-color:var(--el-dialog-bg-color)!important;border-radius:8px}.large-screen-dialog .el-dialog__title,.large-screen-dialog .el-dialog__body{color:var(--large-screen-text-color)}.large-screen-dialog .el-form-item__label{color:var(--large-screen-text-color)!important}.large-screen-dialog .el-input__wrapper,.large-screen-dialog .el-select__wrapper{background-color:#7899c71a!important;border:1px solid var(--large-screen-border-color)!important;box-shadow:none!important}.large-screen-dialog .el-input__inner,.large-screen-dialog .el-radio__label{color:var(--large-screen-text-color)!important}.large-screen-dialog .el-button--primary{background-color:var(--large-screen-button-bg);border-color:var(--large-screen-button-bg);color:#fff}

package/dist/z-crud-table.js

@@ -1,36 +1,124 @@
-import { defineComponent as H, computed as U, reactive as j, ref as k, onMounted as G, resolveComponent as g, resolveDirective as J, createElementBlock as A, openBlock as i, normalizeClass as K, renderSlot as s, createCommentVNode as f, withDirectives as X, createVNode as w, createElementVNode as z, withCtx as u, createTextVNode as b, createBlock as c, mergeProps as Q, Fragment as Y, renderList as Z, createSlots as ee } from "vue";
-import { ElMessage as S } from "element-plus";
-import te from "axios";
-const m = te.create({
+import { defineComponent as T, ref as A, resolveComponent as m, createBlock as f, openBlock as r, mergeProps as S, withCtx as s, createElementBlock as _, Fragment as O, renderList as Q, createCommentVNode as c, createTextVNode as h, toDisplayString as ne, computed as P, reactive as I, onMounted as re, resolveDirective as ie, normalizeClass as se, renderSlot as y, withDirectives as L, createVNode as v, createElementVNode as R } from "vue";
+import { ElMessage as F } from "element-plus";
+import ue from "axios";
+const de = /* @__PURE__ */ T({
+  __name: "DynamicForm",
+  props: {
+    modelValue: {},
+    formConfig: {},
+    rules: {}
+  },
+  setup(g, { expose: D }) {
+    const z = A(null);
+    return D({
+      validate: () => {
+        var i;
+        return (i = z.value) == null ? void 0 : i.validate();
+      }
+    }), (i, o) => {
+      const B = m("el-input"), j = m("el-option"), w = m("el-select"), $ = m("el-radio"), p = m("el-radio-group"), k = m("el-form-item"), U = m("el-form");
+      return r(), f(U, S({
+        model: i.modelValue,
+        rules: i.rules,
+        ref_key: "formRef",
+        ref: z
+      }, i.$attrs), {
+        default: s(() => [
+          (r(!0), _(O, null, Q(i.formConfig, (n) => (r(), f(k, {
+            key: n.prop,
+            label: n.label,
+            prop: n.prop
+          }, {
+            default: s(() => [
+              n.type === "input" ? (r(), f(B, S({
+                key: 0,
+                modelValue: i.modelValue[n.prop],
+                "onUpdate:modelValue": (u) => i.modelValue[n.prop] = u
+              }, { ref_for: !0 }, n.componentProps), null, 16, ["modelValue", "onUpdate:modelValue"])) : c("", !0),
+              n.type === "textarea" ? (r(), f(B, S({
+                key: 1,
+                type: "textarea",
+                modelValue: i.modelValue[n.prop],
+                "onUpdate:modelValue": (u) => i.modelValue[n.prop] = u
+              }, { ref_for: !0 }, n.componentProps), null, 16, ["modelValue", "onUpdate:modelValue"])) : c("", !0),
+              n.type === "select" ? (r(), f(w, S({
+                key: 2,
+                modelValue: i.modelValue[n.prop],
+                "onUpdate:modelValue": (u) => i.modelValue[n.prop] = u
+              }, { ref_for: !0 }, n.componentProps), {
+                default: s(() => [
+                  (r(!0), _(O, null, Q(n.options, (u) => (r(), f(j, {
+                    key: u.value,
+                    label: u.label,
+                    value: u.value
+                  }, null, 8, ["label", "value"]))), 128))
+                ]),
+                _: 2
+              }, 1040, ["modelValue", "onUpdate:modelValue"])) : c("", !0),
+              n.type === "radio-group" ? (r(), f(p, S({
+                key: 3,
+                modelValue: i.modelValue[n.prop],
+                "onUpdate:modelValue": (u) => i.modelValue[n.prop] = u
+              }, { ref_for: !0 }, n.componentProps), {
+                default: s(() => [
+                  (r(!0), _(O, null, Q(n.options, (u) => (r(), f($, {
+                    key: u.value,
+                    label: u.value
+                  }, {
+                    default: s(() => [
+                      h(ne(u.label), 1)
+                    ]),
+                    _: 2
+                  }, 1032, ["label"]))), 128))
+                ]),
+                _: 2
+              }, 1040, ["modelValue", "onUpdate:modelValue"])) : c("", !0),
+              n.type === "input-disabled" ? (r(), f(B, S({
+                key: 4,
+                "model-value": i.modelValue[n.prop],
+                disabled: ""
+              }, { ref_for: !0 }, n.componentProps), null, 16, ["model-value"])) : c("", !0)
+            ]),
+            _: 2
+          }, 1032, ["label", "prop"]))), 128))
+        ]),
+        _: 1
+      }, 16, ["model", "rules"]);
+    };
+  }
+}), C = ue.create({
   // VITE_APP_BASE_API 是在 .env 文件中定义的基础 URL
   // 您可以根据您的项目需求进行修改
   baseURL: "",
   timeout: 1e4
   // 请求超时时间
 });
-m.interceptors.request.use(
-  (n) => {
+C.interceptors.request.use(
+  (g) => {
     const D = localStorage.getItem("token");
-    return D && (n.headers.Authorization = "Bearer " + D), n;
+    return D && (g.headers.Authorization = "Bearer " + D), g;
   },
-  (n) => (console.log(n), Promise.reject(n))
+  (g) => (console.log(g), Promise.reject(g))
 );
-m.interceptors.response.use(
-  (n) => n.data,
-  (n) => (console.log("err" + n), S({
+C.interceptors.response.use(
+  (g) => g.data,
+  (g) => (console.log("err" + g), F({
     message: "接口错误，请刷新接口",
     // 这里是您要求的统一错误提示
     type: "error",
     duration: 5 * 1e3
-  }), Promise.reject(n))
+  }), Promise.reject(g))
 );
-const oe = {
+const pe = {
   key: 0,
   class: "flex flex-wrap items-center justify-between gap-4 mb-6"
-}, re = { class: "flex items-center gap-x-2" }, ae = { class: "flex items-center gap-x-3 action-buttons flex-shrink-0" }, le = {
+}, fe = { class: "flex items-center gap-x-2" }, me = { class: "flex items-center gap-x-3 action-buttons flex-shrink-0" }, ge = {
   key: 0,
   class: "flex items-center gap-x-2"
-}, ue = /* @__PURE__ */ H({
+}, ce = {
+  key: 1,
+  class: "flex justify-end"
+}, ye = { class: "dialog-footer" }, he = /* @__PURE__ */ T({
   __name: "CrudTable",
   props: {
     /**
@@ -86,134 +174,140 @@ const oe = {
     dialogFormRules: { type: Object, default: () => ({}) }
   },
   emits: ["open-dialog", "submit", "delete"],
-  setup(n, { expose: D, emit: P }) {
-    const v = P, t = n, E = U(() => ["crud-table-wrapper", `theme-${t.theme}`, t.customClass]);
-    U(() => t.theme === "large-screen" ? "large-screen-dialog" : "");
-    const y = (e, o) => e ? !0 : (S.error(`${o} prop is required.`), !1), I = async (e, o) => {
+  setup(g, { expose: D, emit: z }) {
+    const i = z, o = g, B = P(() => ["crud-table-wrapper", `theme-${o.theme}`, o.customClass]), j = P(() => o.theme === "large-screen" ? "large-screen-dialog" : ""), w = (e, t) => e ? !0 : (F.error(`${t} prop is required.`), !1), $ = async (e, t) => {
       try {
-        let r = { ...o };
-        if (t.onBeforeSubmit && (r = await t.onBeforeSubmit(r)), a.submitting = !0, e === "add") {
-          if (!y(t.apiUrlCreate, "apiUrlCreate")) return;
-          await m.post(t.apiUrlCreate, r), S.success("新增成功");
+        let a = { ...t };
+        if (o.onBeforeSubmit && (a = await o.onBeforeSubmit(a)), l.submitting = !0, e === "add") {
+          if (!w(o.apiUrlCreate, "apiUrlCreate")) return;
+          await C.post(o.apiUrlCreate, a), F.success("新增成功");
         } else {
-          if (!y(t.apiUrlUpdate, "apiUrlUpdate")) return;
-          await m.put(t.apiUrlUpdate, r), S.success("更新成功");
+          if (!w(o.apiUrlUpdate, "apiUrlUpdate")) return;
+          await C.put(o.apiUrlUpdate, a), F.success("更新成功");
         }
-        return t.onAfterSubmit && t.onAfterSubmit(e, r), v("submit", { mode: e, data: r }), a.visible && (a.visible = !1), h(), Promise.resolve();
-      } catch (r) {
-        return console.log("Submit error:", r), Promise.reject(r);
+        return o.onAfterSubmit && o.onAfterSubmit(e, a), i("submit", { mode: e, data: a }), l.visible && (l.visible = !1), V(), Promise.resolve();
+      } catch (a) {
+        return console.log("Submit error:", a), Promise.reject(a);
       } finally {
-        a.submitting = !1;
+        l.submitting = !1;
       }
-    }, p = j({ pageNum: 1, pageSize: 10, ...t.initialSearchForm }), B = k([]), N = k(0), C = k(!1), O = k([]), a = j({ visible: !1, loading: !1, submitting: !1, mode: "add", data: {}, formRef: null });
-    U(() => a.mode === "add" ? "新增" : "编辑"), U(() => {
-      if (a.mode === "add") return t.dialogFormConfig.filter((o) => o.prop !== "id");
-      const e = [...t.dialogFormConfig.filter((o) => o.prop !== "id")];
-      return e.some((o) => o.prop === "id") || e.unshift({ type: "input-disabled", prop: "id", label: "用户ID" }), e;
-    });
-    const h = async () => {
-      if (y(t.apiUrlQuery, "apiUrlQuery")) {
-        C.value = !0;
+    }, p = I({ pageNum: 1, pageSize: 10, ...o.initialSearchForm }), k = A([]), U = A(0), n = A(!1), u = A([]), l = I({ visible: !1, loading: !1, submitting: !1, mode: "add", data: {}, formRef: null }), W = P(() => l.mode === "add" ? "新增" : "编辑"), H = P(() => {
+      if (l.mode === "add") return o.dialogFormConfig.filter((t) => t.prop !== "id");
+      const e = [...o.dialogFormConfig.filter((t) => t.prop !== "id")];
+      return e.some((t) => t.prop === "id") || e.unshift({ type: "input-disabled", prop: "id", label: "用户ID" }), e;
+    }), V = async () => {
+      if (w(o.apiUrlQuery, "apiUrlQuery")) {
+        n.value = !0;
         try {
           let e = { ...p };
-          t.onBeforeQuery && (e = await t.onBeforeQuery(e));
-          const o = await m.get(t.apiUrlQuery, { params: e });
-          if (o && Array.isArray(o.data) && typeof o.total == "number") {
-            let r = o.data;
-            t.onAfterQuery && (r = await t.onAfterQuery(r)), B.value = r, N.value = o.total;
+          o.onBeforeQuery && (e = await o.onBeforeQuery(e));
+          const t = await C.get(o.apiUrlQuery, { params: e });
+          if (t && Array.isArray(t.data) && typeof t.total == "number") {
+            let a = t.data;
+            o.onAfterQuery && (a = await o.onAfterQuery(a)), k.value = a, U.value = t.total;
           } else
-            console.warn("API response is not in the expected { data: [], total: 0 } format."), B.value = [], N.value = 0;
+            console.warn("API response is not in the expected { data: [], total: 0 } format."), k.value = [], U.value = 0;
         } catch (e) {
           console.error("Fetch data failed:", e);
         } finally {
-          C.value = !1;
+          n.value = !1;
         }
       }
-    }, F = () => {
-      p.pageNum = 1, h();
-    }, V = () => {
-      const { pageNum: e, pageSize: o, ...r } = t.initialSearchForm;
-      Object.keys(p).forEach((d) => {
-        d !== "pageNum" && d !== "pageSize" && delete p[d];
-      }), Object.assign(p, r), F();
-    }, L = (e) => {
-      O.value = e;
-    }, x = async (e, o) => {
-      let r;
-      if (e === "add" ? r = o ? { ...o } : { role: "user" } : r = { ...o }, t.onBeforeOpenDialog) {
-        const d = await t.onBeforeOpenDialog(e, r);
-        d && (r = d);
+    }, N = () => {
+      p.pageNum = 1, V();
+    }, M = () => {
+      const { pageNum: e, pageSize: t, ...a } = o.initialSearchForm;
+      Object.keys(p).forEach((b) => {
+        b !== "pageNum" && b !== "pageSize" && delete p[b];
+      }), Object.assign(p, a), N();
+    }, G = (e) => {
+      u.value = e;
+    }, q = async (e, t) => {
+      let a;
+      if (e === "add" ? a = t ? { ...t } : { role: "user" } : a = { ...t }, o.onBeforeOpenDialog) {
+        const b = await o.onBeforeOpenDialog(e, a);
+        b && (a = b);
       }
-      if (a.mode = e, a.visible = !0, e === "edit") {
-        if (!y(t.apiUrlDetail, "apiUrlDetail")) return;
-        a.loading = !0;
+      if (l.mode = e, l.visible = !0, e === "edit") {
+        if (!w(o.apiUrlDetail, "apiUrlDetail")) return;
+        l.loading = !0;
         try {
-          const d = await m.get(t.apiUrlDetail, { params: { id: r.id } });
-          a.data = d.data;
+          const b = await C.get(o.apiUrlDetail, { params: { id: a.id } });
+          l.data = b.data;
         } finally {
-          a.loading = !1, t.onAfterOpenDialog && t.onAfterOpenDialog(e, a.data), v("open-dialog", { mode: e, data: a.data });
+          l.loading = !1, o.onAfterOpenDialog && o.onAfterOpenDialog(e, l.data), i("open-dialog", { mode: e, data: l.data });
         }
       } else
-        a.data = r, t.onAfterOpenDialog && t.onAfterOpenDialog(e, a.data), v("open-dialog", { mode: e, data: a.data });
-    }, q = async (e) => {
-      if (y(t.apiUrlDelete, "apiUrlDelete"))
+        l.data = a, o.onAfterOpenDialog && o.onAfterOpenDialog(e, l.data), i("open-dialog", { mode: e, data: l.data });
+    }, J = async () => {
+      try {
+        l.formRef && await l.formRef.validate(), await $(l.mode, l.data);
+      } catch (e) {
+        console.log("Validation failed:", e);
+      }
+    }, E = async (e) => {
+      if (w(o.apiUrlDelete, "apiUrlDelete"))
         try {
-          if (t.onBeforeDelete && await t.onBeforeDelete(e) === !1)
+          if (o.onBeforeDelete && await o.onBeforeDelete(e) === !1)
             return;
-          const o = e.join(",");
-          await m.delete(t.apiUrlDelete + "/" + o.toString()), S.success("删除成功"), t.onAfterDelete && t.onAfterDelete(e), v("delete", e), B.value.length === e.length && p.pageNum > 1 && p.pageNum--, h();
-        } catch (o) {
-          console.error("Delete failed", o);
+          const t = e.join(",");
+          await C.delete(o.apiUrlDelete + "/" + t.toString()), F.success("删除成功"), o.onAfterDelete && o.onAfterDelete(e), i("delete", e), k.value.length === e.length && p.pageNum > 1 && p.pageNum--, V();
+        } catch (t) {
+          console.error("Delete failed", t);
         }
+    }, K = (e) => {
+      p.pageSize = e, N();
+    }, X = (e) => {
+      p.pageNum = e, V();
     };
-    return G(h), D({
-      refresh: h,
+    return re(V), D({
+      refresh: V,
       // 刷新表格
-      search: F,
+      search: N,
       // 按当前条件搜索
-      handleDelete: q,
+      handleDelete: E,
       // 手动触发删除
-      openDialog: x,
+      openDialog: q,
       // 手动打开弹窗
-      submit: I
+      submit: $
       // 手动提交
-    }), (e, o) => {
-      const r = g("el-button"), d = g("el-form-item"), R = g("el-form"), _ = g("el-table-column"), T = g("el-popconfirm"), W = g("el-table"), M = J("loading");
-      return i(), A("div", {
-        class: K(E.value)
+    }), (e, t) => {
+      const a = m("el-button"), b = m("el-form-item"), Y = m("el-form"), Z = m("el-popconfirm"), ee = m("el-table-column"), te = m("el-table"), oe = m("el-pagination"), ae = m("el-dialog"), x = ie("loading");
+      return r(), _("div", {
+        class: se(B.value)
       }, [
-        s(e.$slots, "header"),
-        t.showSearchSection ? (i(), A("div", oe, [
-          w(R, {
+        y(e.$slots, "header"),
+        o.showSearchSection ? (r(), _("div", pe, [
+          v(Y, {
             model: p,
             class: "query-form flex flex-nowrap items-center gap-x-4",
             style: { "overflow-x": "auto", "padding-bottom": "8px" }
           }, {
-            default: u(() => [
-              s(e.$slots, "query-conditions", { searchForm: p }),
-              w(d, { class: "!mr-0 flex-shrink-0" }, {
-                default: u(() => [
-                  z("div", re, [
-                    s(e.$slots, "query-left"),
-                    w(r, {
+            default: s(() => [
+              y(e.$slots, "query-conditions", { searchForm: p }),
+              v(b, { class: "!mr-0 flex-shrink-0" }, {
+                default: s(() => [
+                  R("div", fe, [
+                    y(e.$slots, "query-left"),
+                    v(a, {
                       type: "primary",
-                      onClick: F,
-                      loading: C.value
+                      onClick: N,
+                      loading: n.value
                     }, {
-                      default: u(() => o[1] || (o[1] = [
-                        b("搜索")
+                      default: s(() => t[6] || (t[6] = [
+                        h("搜索")
                       ])),
                       _: 1,
-                      __: [1]
+                      __: [6]
                     }, 8, ["loading"]),
-                    w(r, { onClick: V }, {
-                      default: u(() => o[2] || (o[2] = [
-                        b("清空")
+                    v(a, { onClick: M }, {
+                      default: s(() => t[7] || (t[7] = [
+                        h("清空")
                       ])),
                       _: 1,
-                      __: [2]
+                      __: [7]
                     }),
-                    s(e.$slots, "query-right")
+                    y(e.$slots, "query-right")
                   ])
                 ]),
                 _: 3
@@ -221,125 +315,166 @@ const oe = {
             ]),
             _: 3
           }, 8, ["model"]),
-          z("div", ae, [
-            s(e.$slots, "action-left", { selections: O.value }),
-            s(e.$slots, "add-button-content", {}, () => [
-              t.showNewBtn ? (i(), c(r, {
+          R("div", me, [
+            y(e.$slots, "action-left", { selections: u.value }),
+            y(e.$slots, "add-button-content", {}, () => [
+              o.showNewBtn ? (r(), f(a, {
                 key: 0,
                 type: "success",
-                onClick: o[0] || (o[0] = (l) => x("add"))
+                onClick: t[0] || (t[0] = (d) => q("add"))
               }, {
-                default: u(() => o[3] || (o[3] = [
-                  b("新增")
+                default: s(() => t[8] || (t[8] = [
+                  h("新增")
                 ])),
                 _: 1,
-                __: [3]
-              })) : f("", !0)
+                __: [8]
+              })) : c("", !0)
             ]),
-            s(e.$slots, "action-right")
+            y(e.$slots, "action-right")
           ])
-        ])) : f("", !0),
-        X((i(), c(W, Q({
-          data: B.value,
-          onSelectionChange: L
+        ])) : c("", !0),
+        L((r(), f(te, S({
+          data: k.value,
+          onSelectionChange: G
         }, e.$attrs, { style: { width: "100%", "margin-bottom": "1.5rem" } }), {
-          default: u(() => [
-            t.showSelectionColumn ? (i(), c(_, {
+          default: s(() => [
+            o.showActionsColumn ? (r(), f(ee, {
               key: 0,
-              type: "selection",
-              width: "55",
-              fixed: ""
-            })) : f("", !0),
-            t.showIndexColumn ? (i(), c(_, {
-              key: 1,
-              type: "index",
-              label: "序号",
-              width: "70",
-              fixed: ""
-            })) : f("", !0),
-            (i(!0), A(Y, null, Z(t.columns, (l) => (i(), c(_, Q({
-              key: l.prop,
-              prop: l.prop,
-              label: l.label,
-              width: l.width,
-              sortable: l.sortable || !1
-            }, { ref_for: !0 }, l.attrs), ee({ _: 2 }, [
-              l.slot ? {
-                name: "default",
-                fn: u(($) => [
-                  s(e.$slots, l.slot, {
-                    row: $.row
-                  })
-                ]),
-                key: "0"
-              } : void 0
-            ]), 1040, ["prop", "label", "width", "sortable"]))), 128)),
-            t.showActionsColumn ? (i(), c(_, {
-              key: 2,
               label: "操作",
-              width: n.actionsColumnWidth
+              width: g.actionsColumnWidth
             }, {
-              default: u((l) => [
-                l.row ? (i(), A("div", le, [
-                  s(e.$slots, "actions", {
-                    row: l.row
-                  }, () => [
-                    s(e.$slots, "action-before-edit", {
-                      row: l.row
+              default: s((d) => [
+                d.row ? (r(), _("div", ge, [
+                  e.$slots.actions ? y(e.$slots, "actions", {
+                    key: 0,
+                    row: d.row
+                  }) : (r(), _(O, { key: 1 }, [
+                    y(e.$slots, "action-before-edit", {
+                      row: d.row
                     }),
-                    t.showEditButton ? (i(), c(r, {
+                    o.showEditButton ? (r(), f(a, {
                       key: 0,
                       size: "small",
                       type: "primary",
                       link: "",
-                      onClick: ($) => x("edit", l.row)
+                      onClick: (le) => q("edit", d.row)
                     }, {
-                      default: u(() => o[4] || (o[4] = [
-                        b("编辑 ")
+                      default: s(() => t[9] || (t[9] = [
+                        h("编辑 ")
                       ])),
                       _: 2,
-                      __: [4]
-                    }, 1032, ["onClick"])) : f("", !0),
-                    t.showDeleteButton ? (i(), c(T, {
+                      __: [9]
+                    }, 1032, ["onClick"])) : c("", !0),
+                    o.showDeleteButton ? (r(), f(Z, {
                       key: 1,
                       title: "确定要删除这条数据吗?",
-                      onConfirm: ($) => q([l.row.id]),
+                      onConfirm: (le) => E([d.row.id]),
                       "confirm-button-text": "确定",
                       "cancel-button-text": "取消",
                       width: "200"
                     }, {
-                      reference: u(() => [
-                        w(r, {
+                      reference: s(() => [
+                        v(a, {
                           size: "small",
                           type: "danger",
                           link: ""
                         }, {
-                          default: u(() => o[5] || (o[5] = [
-                            b("删除")
+                          default: s(() => t[10] || (t[10] = [
+                            h("删除")
                           ])),
                           _: 1,
-                          __: [5]
+                          __: [10]
                         })
                       ]),
                       _: 2
-                    }, 1032, ["onConfirm"])) : f("", !0),
-                    s(e.$slots, "action-after-delete", {
-                      row: l.row
+                    }, 1032, ["onConfirm"])) : c("", !0),
+                    y(e.$slots, "action-after-delete", {
+                      row: d.row
                     })
-                  ])
-                ])) : f("", !0)
+                  ], 64))
+                ])) : c("", !0)
               ]),
               _: 3
-            }, 8, ["width"])) : f("", !0)
+            }, 8, ["width"])) : c("", !0)
           ]),
           _: 3
         }, 16, ["data"])), [
-          [M, C.value]
-        ])
+          [x, n.value]
+        ]),
+        o.showPagination && U.value > 0 ? (r(), _("div", ce, [
+          v(oe, {
+            "current-page": p.pageNum,
+            "onUpdate:currentPage": t[1] || (t[1] = (d) => p.pageNum = d),
+            "page-size": p.pageSize,
+            "onUpdate:pageSize": t[2] || (t[2] = (d) => p.pageSize = d),
+            "page-sizes": o.pageSizes,
+            layout: o.paginationLayout,
+            total: U.value,
+            background: o.paginationBackground,
+            small: o.paginationSmall,
+            "hide-on-single-page": o.paginationHideOnSinglePage,
+            onSizeChange: K,
+            onCurrentChange: X
+          }, null, 8, ["current-page", "page-size", "page-sizes", "layout", "total", "background", "small", "hide-on-single-page"])
+        ])) : c("", !0),
+        v(ae, {
+          modelValue: l.visible,
+          "onUpdate:modelValue": t[5] || (t[5] = (d) => l.visible = d),
+          title: W.value,
+          width: o.dialogWidth,
+          "destroy-on-close": !0,
+          "custom-class": j.value
+        }, {
+          footer: s(() => [
+            R("div", ye, [
+              v(a, {
+                onClick: t[4] || (t[4] = (d) => l.visible = !1)
+              }, {
+                default: s(() => t[11] || (t[11] = [
+                  h("取消")
+                ])),
+                _: 1,
+                __: [11]
+              }),
+              v(a, {
+                type: "primary",
+                onClick: J,
+                loading: l.submitting
+              }, {
+                default: s(() => t[12] || (t[12] = [
+                  h("确定")
+                ])),
+                _: 1,
+                __: [12]
+              }, 8, ["loading"])
+            ])
+          ]),
+          default: s(() => [
+            L((r(), _("div", null, [
+              y(e.$slots, "dialog-form-content", {
+                formData: l.data,
+                mode: l.mode
+              }, () => [
+                o.dialogFormConfig.length > 0 ? (r(), f(de, {
+                  key: 0,
+                  "form-config": H.value,
+                  modelValue: l.data,
+                  "onUpdate:modelValue": t[3] || (t[3] = (d) => l.data = d),
+                  ref: (d) => l.formRef = d,
+                  rules: o.dialogFormRules,
+                  "label-width": "80px"
+                }, null, 8, ["form-config", "modelValue", "rules"])) : c("", !0)
+              ])
+            ])), [
+              [x, l.loading]
+            ])
+          ]),
+          _: 3
+        }, 8, ["modelValue", "title", "width", "custom-class"])
       ], 2);
     };
   }
 });
 export {
-  ue as CrudTable
+  he as CrudTable
 };

package/dist/z-crud-table.umd.cjs

@@ -1 +1 @@
-(function(d,e){typeof exports=="object"&&typeof module<"u"?e(exports,require("vue"),require("element-plus"),require("axios")):typeof define=="function"&&define.amd?define(["exports","vue","element-plus","axios"],e):(d=typeof globalThis<"u"?globalThis:d||self,e(d.ZCrudTable={},d.Vue,d.ElementPlus,d.axios))})(this,function(d,e,f,_){"use strict";const c=_.create({baseURL:"",timeout:1e4});c.interceptors.request.use(i=>{const g=localStorage.getItem("token");return g&&(i.headers.Authorization="Bearer "+g),i},i=>(console.log(i),Promise.reject(i))),c.interceptors.response.use(i=>i.data,i=>(console.log("err"+i),f.ElMessage({message:"接口错误，请刷新接口",type:"error",duration:5*1e3}),Promise.reject(i)));const N={key:0,class:"flex flex-wrap items-center justify-between gap-4 mb-6"},U={class:"flex items-center gap-x-2"},A={class:"flex items-center gap-x-3 action-buttons flex-shrink-0"},V={key:0,class:"flex items-center gap-x-2"},F=e.defineComponent({__name:"CrudTable",props:{theme:{type:String,default:"default"},customClass:{type:String,default:""},apiUrlQuery:{type:String,required:!0},apiUrlDetail:{type:String,required:!0},apiUrlCreate:{type:String,required:!0},apiUrlUpdate:{type:String,required:!0},apiUrlDelete:{type:String,required:!0},showSearchSection:{type:Boolean,default:!0},showNewBtn:{type:Boolean,default:!0},columns:{type:Array,default:()=>[]},onBeforeQuery:{type:Function},onAfterQuery:{type:Function},onBeforeOpenDialog:{type:Function},onAfterOpenDialog:{type:Function},onBeforeSubmit:{type:Function},onAfterSubmit:{type:Function},onBeforeDelete:{type:Function},onAfterDelete:{type:Function},showSelectionColumn:{type:Boolean,default:!0},showIndexColumn:{type:Boolean,default:!0},showActionsColumn:{type:Boolean,default:!0},showEditButton:{type:Boolean,default:!0},showDeleteButton:{type:Boolean,default:!0},showNewBtn:{type:Boolean,default:!0},actionsColumnWidth:{type:[String,Number],default:120},dialogWidth:{type:String,default:"50%"},initialSearchForm:{type:Object,default:()=>({pageNum:1,pageSize:10})},showPagination:{type:Boolean,default:!0},pageSizes:{type:Array,default:()=>[10,20,50,100]},paginationLayout:{type:String,default:"total, sizes, prev, pager, next, jumper"},paginationBackground:{type:Boolean,default:!0},paginationSmall:{type:Boolean,default:!1},paginationHideOnSinglePage:{type:Boolean,default:!1},dialogFormConfig:{type:Array,default:()=>[]},dialogFormRules:{type:Object,default:()=>({})}},emits:["open-dialog","submit","delete"],setup(i,{expose:g,emit:$}){const y=$,o=i,E=e.computed(()=>["crud-table-wrapper",`theme-${o.theme}`,o.customClass]);e.computed(()=>o.theme==="large-screen"?"large-screen-dialog":"");const m=(t,r)=>t?!0:(f.ElMessage.error(`${r} prop is required.`),!1),q=async(t,r)=>{try{let a={...r};if(o.onBeforeSubmit&&(a=await o.onBeforeSubmit(a)),n.submitting=!0,t==="add"){if(!m(o.apiUrlCreate,"apiUrlCreate"))return;await c.post(o.apiUrlCreate,a),f.ElMessage.success("新增成功")}else{if(!m(o.apiUrlUpdate,"apiUrlUpdate"))return;await c.put(o.apiUrlUpdate,a),f.ElMessage.success("更新成功")}return o.onAfterSubmit&&o.onAfterSubmit(t,a),y("submit",{mode:t,data:a}),n.visible&&(n.visible=!1),u(),Promise.resolve()}catch(a){return console.log("Submit error:",a),Promise.reject(a)}finally{n.submitting=!1}},p=e.reactive({pageNum:1,pageSize:10,...o.initialSearchForm}),h=e.ref([]),k=e.ref(0),w=e.ref(!1),D=e.ref([]),n=e.reactive({visible:!1,loading:!1,submitting:!1,mode:"add",data:{},formRef:null});e.computed(()=>n.mode==="add"?"新增":"编辑"),e.computed(()=>{if(n.mode==="add")return o.dialogFormConfig.filter(r=>r.prop!=="id");const t=[...o.dialogFormConfig.filter(r=>r.prop!=="id")];return t.some(r=>r.prop==="id")||t.unshift({type:"input-disabled",prop:"id",label:"用户ID"}),t});const u=async()=>{if(m(o.apiUrlQuery,"apiUrlQuery")){w.value=!0;try{let t={...p};o.onBeforeQuery&&(t=await o.onBeforeQuery(t));const r=await c.get(o.apiUrlQuery,{params:t});if(r&&Array.isArray(r.data)&&typeof r.total=="number"){let a=r.data;o.onAfterQuery&&(a=await o.onAfterQuery(a)),h.value=a,k.value=r.total}else console.warn("API response is not in the expected { data: [], total: 0 } format."),h.value=[],k.value=0}catch(t){console.error("Fetch data failed:",t)}finally{w.value=!1}}},B=()=>{p.pageNum=1,u()},O=()=>{const{pageNum:t,pageSize:r,...a}=o.initialSearchForm;Object.keys(p).forEach(s=>{s!=="pageNum"&&s!=="pageSize"&&delete p[s]}),Object.assign(p,a),B()},j=t=>{D.value=t},b=async(t,r)=>{let a;if(t==="add"?a=r?{...r}:{role:"user"}:a={...r},o.onBeforeOpenDialog){const s=await o.onBeforeOpenDialog(t,a);s&&(a=s)}if(n.mode=t,n.visible=!0,t==="edit"){if(!m(o.apiUrlDetail,"apiUrlDetail"))return;n.loading=!0;try{const s=await c.get(o.apiUrlDetail,{params:{id:a.id}});n.data=s.data}finally{n.loading=!1,o.onAfterOpenDialog&&o.onAfterOpenDialog(t,n.data),y("open-dialog",{mode:t,data:n.data})}}else n.data=a,o.onAfterOpenDialog&&o.onAfterOpenDialog(t,n.data),y("open-dialog",{mode:t,data:n.data})},x=async t=>{if(m(o.apiUrlDelete,"apiUrlDelete"))try{if(o.onBeforeDelete&&await o.onBeforeDelete(t)===!1)return;const r=t.join(",");await c.delete(o.apiUrlDelete+"/"+r.toString()),f.ElMessage.success("删除成功"),o.onAfterDelete&&o.onAfterDelete(t),y("delete",t),h.value.length===t.length&&p.pageNum>1&&p.pageNum--,u()}catch(r){console.error("Delete failed",r)}};return e.onMounted(u),g({refresh:u,search:B,handleDelete:x,openDialog:b,submit:q}),(t,r)=>{const a=e.resolveComponent("el-button"),s=e.resolveComponent("el-form-item"),T=e.resolveComponent("el-form"),C=e.resolveComponent("el-table-column"),z=e.resolveComponent("el-popconfirm"),Q=e.resolveComponent("el-table"),M=e.resolveDirective("loading");return e.openBlock(),e.createElementBlock("div",{class:e.normalizeClass(E.value)},[e.renderSlot(t.$slots,"header"),o.showSearchSection?(e.openBlock(),e.createElementBlock("div",N,[e.createVNode(T,{model:p,class:"query-form flex flex-nowrap items-center gap-x-4",style:{"overflow-x":"auto","padding-bottom":"8px"}},{default:e.withCtx(()=>[e.renderSlot(t.$slots,"query-conditions",{searchForm:p}),e.createVNode(s,{class:"!mr-0 flex-shrink-0"},{default:e.withCtx(()=>[e.createElementVNode("div",U,[e.renderSlot(t.$slots,"query-left"),e.createVNode(a,{type:"primary",onClick:B,loading:w.value},{default:e.withCtx(()=>r[1]||(r[1]=[e.createTextVNode("搜索")])),_:1,__:[1]},8,["loading"]),e.createVNode(a,{onClick:O},{default:e.withCtx(()=>r[2]||(r[2]=[e.createTextVNode("清空")])),_:1,__:[2]}),e.renderSlot(t.$slots,"query-right")])]),_:3})]),_:3},8,["model"]),e.createElementVNode("div",A,[e.renderSlot(t.$slots,"action-left",{selections:D.value}),e.renderSlot(t.$slots,"add-button-content",{},()=>[o.showNewBtn?(e.openBlock(),e.createBlock(a,{key:0,type:"success",onClick:r[0]||(r[0]=l=>b("add"))},{default:e.withCtx(()=>r[3]||(r[3]=[e.createTextVNode("新增")])),_:1,__:[3]})):e.createCommentVNode("",!0)]),e.renderSlot(t.$slots,"action-right")])])):e.createCommentVNode("",!0),e.withDirectives((e.openBlock(),e.createBlock(Q,e.mergeProps({data:h.value,onSelectionChange:j},t.$attrs,{style:{width:"100%","margin-bottom":"1.5rem"}}),{default:e.withCtx(()=>[o.showSelectionColumn?(e.openBlock(),e.createBlock(C,{key:0,type:"selection",width:"55",fixed:""})):e.createCommentVNode("",!0),o.showIndexColumn?(e.openBlock(),e.createBlock(C,{key:1,type:"index",label:"序号",width:"70",fixed:""})):e.createCommentVNode("",!0),(e.openBlock(!0),e.createElementBlock(e.Fragment,null,e.renderList(o.columns,l=>(e.openBlock(),e.createBlock(C,e.mergeProps({key:l.prop,prop:l.prop,label:l.label,width:l.width,sortable:l.sortable||!1},{ref_for:!0},l.attrs),e.createSlots({_:2},[l.slot?{name:"default",fn:e.withCtx(S=>[e.renderSlot(t.$slots,l.slot,{row:S.row})]),key:"0"}:void 0]),1040,["prop","label","width","sortable"]))),128)),o.showActionsColumn?(e.openBlock(),e.createBlock(C,{key:2,label:"操作",width:i.actionsColumnWidth},{default:e.withCtx(l=>[l.row?(e.openBlock(),e.createElementBlock("div",V,[e.renderSlot(t.$slots,"actions",{row:l.row},()=>[e.renderSlot(t.$slots,"action-before-edit",{row:l.row}),o.showEditButton?(e.openBlock(),e.createBlock(a,{key:0,size:"small",type:"primary",link:"",onClick:S=>b("edit",l.row)},{default:e.withCtx(()=>r[4]||(r[4]=[e.createTextVNode("编辑 ")])),_:2,__:[4]},1032,["onClick"])):e.createCommentVNode("",!0),o.showDeleteButton?(e.openBlock(),e.createBlock(z,{key:1,title:"确定要删除这条数据吗?",onConfirm:S=>x([l.row.id]),"confirm-button-text":"确定","cancel-button-text":"取消",width:"200"},{reference:e.withCtx(()=>[e.createVNode(a,{size:"small",type:"danger",link:""},{default:e.withCtx(()=>r[5]||(r[5]=[e.createTextVNode("删除")])),_:1,__:[5]})]),_:2},1032,["onConfirm"])):e.createCommentVNode("",!0),e.renderSlot(t.$slots,"action-after-delete",{row:l.row})])])):e.createCommentVNode("",!0)]),_:3},8,["width"])):e.createCommentVNode("",!0)]),_:3},16,["data"])),[[M,w.value]])],2)}}});d.CrudTable=F,Object.defineProperty(d,Symbol.toStringTag,{value:"Module"})});
+(function(f,e){typeof exports=="object"&&typeof module<"u"?e(exports,require("vue"),require("element-plus"),require("axios")):typeof define=="function"&&define.amd?define(["exports","vue","element-plus","axios"],e):(f=typeof globalThis<"u"?globalThis:f||self,e(f.ZCrudTable={},f.Vue,f.ElementPlus,f.axios))})(this,function(f,e,h,x){"use strict";const F=e.defineComponent({__name:"DynamicForm",props:{modelValue:{},formConfig:{},rules:{}},setup(c,{expose:y}){const V=e.ref(null);return y({validate:()=>{var i;return(i=V.value)==null?void 0:i.validate()}}),(i,l)=>{const w=e.resolveComponent("el-input"),_=e.resolveComponent("el-option"),u=e.resolveComponent("el-select"),b=e.resolveComponent("el-radio"),p=e.resolveComponent("el-radio-group"),C=e.resolveComponent("el-form-item"),k=e.resolveComponent("el-form");return e.openBlock(),e.createBlock(k,e.mergeProps({model:i.modelValue,rules:i.rules,ref_key:"formRef",ref:V},i.$attrs),{default:e.withCtx(()=>[(e.openBlock(!0),e.createElementBlock(e.Fragment,null,e.renderList(i.formConfig,n=>(e.openBlock(),e.createBlock(C,{key:n.prop,label:n.label,prop:n.prop},{default:e.withCtx(()=>[n.type==="input"?(e.openBlock(),e.createBlock(w,e.mergeProps({key:0,modelValue:i.modelValue[n.prop],"onUpdate:modelValue":s=>i.modelValue[n.prop]=s},{ref_for:!0},n.componentProps),null,16,["modelValue","onUpdate:modelValue"])):e.createCommentVNode("",!0),n.type==="textarea"?(e.openBlock(),e.createBlock(w,e.mergeProps({key:1,type:"textarea",modelValue:i.modelValue[n.prop],"onUpdate:modelValue":s=>i.modelValue[n.prop]=s},{ref_for:!0},n.componentProps),null,16,["modelValue","onUpdate:modelValue"])):e.createCommentVNode("",!0),n.type==="select"?(e.openBlock(),e.createBlock(u,e.mergeProps({key:2,modelValue:i.modelValue[n.prop],"onUpdate:modelValue":s=>i.modelValue[n.prop]=s},{ref_for:!0},n.componentProps),{default:e.withCtx(()=>[(e.openBlock(!0),e.createElementBlock(e.Fragment,null,e.renderList(n.options,s=>(e.openBlock(),e.createBlock(_,{key:s.value,label:s.label,value:s.value},null,8,["label","value"]))),128))]),_:2},1040,["modelValue","onUpdate:modelValue"])):e.createCommentVNode("",!0),n.type==="radio-group"?(e.openBlock(),e.createBlock(p,e.mergeProps({key:3,modelValue:i.modelValue[n.prop],"onUpdate:modelValue":s=>i.modelValue[n.prop]=s},{ref_for:!0},n.componentProps),{default:e.withCtx(()=>[(e.openBlock(!0),e.createElementBlock(e.Fragment,null,e.renderList(n.options,s=>(e.openBlock(),e.createBlock(b,{key:s.value,label:s.value},{default:e.withCtx(()=>[e.createTextVNode(e.toDisplayString(s.label),1)]),_:2},1032,["label"]))),128))]),_:2},1040,["modelValue","onUpdate:modelValue"])):e.createCommentVNode("",!0),n.type==="input-disabled"?(e.openBlock(),e.createBlock(w,e.mergeProps({key:4,"model-value":i.modelValue[n.prop],disabled:""},{ref_for:!0},n.componentProps),null,16,["model-value"])):e.createCommentVNode("",!0)]),_:2},1032,["label","prop"]))),128))]),_:1},16,["model","rules"])}}}),g=x.create({baseURL:"",timeout:1e4});g.interceptors.request.use(c=>{const y=localStorage.getItem("token");return y&&(c.headers.Authorization="Bearer "+y),c},c=>(console.log(c),Promise.reject(c))),g.interceptors.response.use(c=>c.data,c=>(console.log("err"+c),h.ElMessage({message:"接口错误，请刷新接口",type:"error",duration:5*1e3}),Promise.reject(c)));const A={key:0,class:"flex flex-wrap items-center justify-between gap-4 mb-6"},E={class:"flex items-center gap-x-2"},z={class:"flex items-center gap-x-3 action-buttons flex-shrink-0"},$={key:0,class:"flex items-center gap-x-2"},P={key:1,class:"flex justify-end"},O={class:"dialog-footer"},T=e.defineComponent({__name:"CrudTable",props:{theme:{type:String,default:"default"},customClass:{type:String,default:""},apiUrlQuery:{type:String,required:!0},apiUrlDetail:{type:String,required:!0},apiUrlCreate:{type:String,required:!0},apiUrlUpdate:{type:String,required:!0},apiUrlDelete:{type:String,required:!0},showSearchSection:{type:Boolean,default:!0},showNewBtn:{type:Boolean,default:!0},columns:{type:Array,default:()=>[]},onBeforeQuery:{type:Function},onAfterQuery:{type:Function},onBeforeOpenDialog:{type:Function},onAfterOpenDialog:{type:Function},onBeforeSubmit:{type:Function},onAfterSubmit:{type:Function},onBeforeDelete:{type:Function},onAfterDelete:{type:Function},showSelectionColumn:{type:Boolean,default:!0},showIndexColumn:{type:Boolean,default:!0},showActionsColumn:{type:Boolean,default:!0},showEditButton:{type:Boolean,default:!0},showDeleteButton:{type:Boolean,default:!0},showNewBtn:{type:Boolean,default:!0},actionsColumnWidth:{type:[String,Number],default:120},dialogWidth:{type:String,default:"50%"},initialSearchForm:{type:Object,default:()=>({pageNum:1,pageSize:10})},showPagination:{type:Boolean,default:!0},pageSizes:{type:Array,default:()=>[10,20,50,100]},paginationLayout:{type:String,default:"total, sizes, prev, pager, next, jumper"},paginationBackground:{type:Boolean,default:!0},paginationSmall:{type:Boolean,default:!1},paginationHideOnSinglePage:{type:Boolean,default:!1},dialogFormConfig:{type:Array,default:()=>[]},dialogFormRules:{type:Object,default:()=>({})}},emits:["open-dialog","submit","delete"],setup(c,{expose:y,emit:V}){const i=V,l=c,w=e.computed(()=>["crud-table-wrapper",`theme-${l.theme}`,l.customClass]),_=e.computed(()=>l.theme==="large-screen"?"large-screen-dialog":""),u=(t,o)=>t?!0:(h.ElMessage.error(`${o} prop is required.`),!1),b=async(t,o)=>{try{let a={...o};if(l.onBeforeSubmit&&(a=await l.onBeforeSubmit(a)),r.submitting=!0,t==="add"){if(!u(l.apiUrlCreate,"apiUrlCreate"))return;await g.post(l.apiUrlCreate,a),h.ElMessage.success("新增成功")}else{if(!u(l.apiUrlUpdate,"apiUrlUpdate"))return;await g.put(l.apiUrlUpdate,a),h.ElMessage.success("更新成功")}return l.onAfterSubmit&&l.onAfterSubmit(t,a),i("submit",{mode:t,data:a}),r.visible&&(r.visible=!1),B(),Promise.resolve()}catch(a){return console.log("Submit error:",a),Promise.reject(a)}finally{r.submitting=!1}},p=e.reactive({pageNum:1,pageSize:10,...l.initialSearchForm}),C=e.ref([]),k=e.ref(0),n=e.ref(!1),s=e.ref([]),r=e.reactive({visible:!1,loading:!1,submitting:!1,mode:"add",data:{},formRef:null}),q=e.computed(()=>r.mode==="add"?"新增":"编辑"),j=e.computed(()=>{if(r.mode==="add")return l.dialogFormConfig.filter(o=>o.prop!=="id");const t=[...l.dialogFormConfig.filter(o=>o.prop!=="id")];return t.some(o=>o.prop==="id")||t.unshift({type:"input-disabled",prop:"id",label:"用户ID"}),t}),B=async()=>{if(u(l.apiUrlQuery,"apiUrlQuery")){n.value=!0;try{let t={...p};l.onBeforeQuery&&(t=await l.onBeforeQuery(t));const o=await g.get(l.apiUrlQuery,{params:t});if(o&&Array.isArray(o.data)&&typeof o.total=="number"){let a=o.data;l.onAfterQuery&&(a=await l.onAfterQuery(a)),C.value=a,k.value=o.total}else console.warn("API response is not in the expected { data: [], total: 0 } format."),C.value=[],k.value=0}catch(t){console.error("Fetch data failed:",t)}finally{n.value=!1}}},S=()=>{p.pageNum=1,B()},Q=()=>{const{pageNum:t,pageSize:o,...a}=l.initialSearchForm;Object.keys(p).forEach(m=>{m!=="pageNum"&&m!=="pageSize"&&delete p[m]}),Object.assign(p,a),S()},R=t=>{s.value=t},N=async(t,o)=>{let a;if(t==="add"?a=o?{...o}:{role:"user"}:a={...o},l.onBeforeOpenDialog){const m=await l.onBeforeOpenDialog(t,a);m&&(a=m)}if(r.mode=t,r.visible=!0,t==="edit"){if(!u(l.apiUrlDetail,"apiUrlDetail"))return;r.loading=!0;try{const m=await g.get(l.apiUrlDetail,{params:{id:a.id}});r.data=m.data}finally{r.loading=!1,l.onAfterOpenDialog&&l.onAfterOpenDialog(t,r.data),i("open-dialog",{mode:t,data:r.data})}}else r.data=a,l.onAfterOpenDialog&&l.onAfterOpenDialog(t,r.data),i("open-dialog",{mode:t,data:r.data})},M=async()=>{try{r.formRef&&await r.formRef.validate(),await b(r.mode,r.data)}catch(t){console.log("Validation failed:",t)}},D=async t=>{if(u(l.apiUrlDelete,"apiUrlDelete"))try{if(l.onBeforeDelete&&await l.onBeforeDelete(t)===!1)return;const o=t.join(",");await g.delete(l.apiUrlDelete+"/"+o.toString()),h.ElMessage.success("删除成功"),l.onAfterDelete&&l.onAfterDelete(t),i("delete",t),C.value.length===t.length&&p.pageNum>1&&p.pageNum--,B()}catch(o){console.error("Delete failed",o)}},L=t=>{p.pageSize=t,S()},I=t=>{p.pageNum=t,B()};return e.onMounted(B),y({refresh:B,search:S,handleDelete:D,openDialog:N,submit:b}),(t,o)=>{const a=e.resolveComponent("el-button"),m=e.resolveComponent("el-form-item"),W=e.resolveComponent("el-form"),H=e.resolveComponent("el-popconfirm"),Z=e.resolveComponent("el-table-column"),G=e.resolveComponent("el-table"),J=e.resolveComponent("el-pagination"),K=e.resolveComponent("el-dialog"),U=e.resolveDirective("loading");return e.openBlock(),e.createElementBlock("div",{class:e.normalizeClass(w.value)},[e.renderSlot(t.$slots,"header"),l.showSearchSection?(e.openBlock(),e.createElementBlock("div",A,[e.createVNode(W,{model:p,class:"query-form flex flex-nowrap items-center gap-x-4",style:{"overflow-x":"auto","padding-bottom":"8px"}},{default:e.withCtx(()=>[e.renderSlot(t.$slots,"query-conditions",{searchForm:p}),e.createVNode(m,{class:"!mr-0 flex-shrink-0"},{default:e.withCtx(()=>[e.createElementVNode("div",E,[e.renderSlot(t.$slots,"query-left"),e.createVNode(a,{type:"primary",onClick:S,loading:n.value},{default:e.withCtx(()=>o[6]||(o[6]=[e.createTextVNode("搜索")])),_:1,__:[6]},8,["loading"]),e.createVNode(a,{onClick:Q},{default:e.withCtx(()=>o[7]||(o[7]=[e.createTextVNode("清空")])),_:1,__:[7]}),e.renderSlot(t.$slots,"query-right")])]),_:3})]),_:3},8,["model"]),e.createElementVNode("div",z,[e.renderSlot(t.$slots,"action-left",{selections:s.value}),e.renderSlot(t.$slots,"add-button-content",{},()=>[l.showNewBtn?(e.openBlock(),e.createBlock(a,{key:0,type:"success",onClick:o[0]||(o[0]=d=>N("add"))},{default:e.withCtx(()=>o[8]||(o[8]=[e.createTextVNode("新增")])),_:1,__:[8]})):e.createCommentVNode("",!0)]),e.renderSlot(t.$slots,"action-right")])])):e.createCommentVNode("",!0),e.withDirectives((e.openBlock(),e.createBlock(G,e.mergeProps({data:C.value,onSelectionChange:R},t.$attrs,{style:{width:"100%","margin-bottom":"1.5rem"}}),{default:e.withCtx(()=>[l.showActionsColumn?(e.openBlock(),e.createBlock(Z,{key:0,label:"操作",width:c.actionsColumnWidth},{default:e.withCtx(d=>[d.row?(e.openBlock(),e.createElementBlock("div",$,[t.$slots.actions?e.renderSlot(t.$slots,"actions",{key:0,row:d.row}):(e.openBlock(),e.createElementBlock(e.Fragment,{key:1},[e.renderSlot(t.$slots,"action-before-edit",{row:d.row}),l.showEditButton?(e.openBlock(),e.createBlock(a,{key:0,size:"small",type:"primary",link:"",onClick:X=>N("edit",d.row)},{default:e.withCtx(()=>o[9]||(o[9]=[e.createTextVNode("编辑 ")])),_:2,__:[9]},1032,["onClick"])):e.createCommentVNode("",!0),l.showDeleteButton?(e.openBlock(),e.createBlock(H,{key:1,title:"确定要删除这条数据吗?",onConfirm:X=>D([d.row.id]),"confirm-button-text":"确定","cancel-button-text":"取消",width:"200"},{reference:e.withCtx(()=>[e.createVNode(a,{size:"small",type:"danger",link:""},{default:e.withCtx(()=>o[10]||(o[10]=[e.createTextVNode("删除")])),_:1,__:[10]})]),_:2},1032,["onConfirm"])):e.createCommentVNode("",!0),e.renderSlot(t.$slots,"action-after-delete",{row:d.row})],64))])):e.createCommentVNode("",!0)]),_:3},8,["width"])):e.createCommentVNode("",!0)]),_:3},16,["data"])),[[U,n.value]]),l.showPagination&&k.value>0?(e.openBlock(),e.createElementBlock("div",P,[e.createVNode(J,{"current-page":p.pageNum,"onUpdate:currentPage":o[1]||(o[1]=d=>p.pageNum=d),"page-size":p.pageSize,"onUpdate:pageSize":o[2]||(o[2]=d=>p.pageSize=d),"page-sizes":l.pageSizes,layout:l.paginationLayout,total:k.value,background:l.paginationBackground,small:l.paginationSmall,"hide-on-single-page":l.paginationHideOnSinglePage,onSizeChange:L,onCurrentChange:I},null,8,["current-page","page-size","page-sizes","layout","total","background","small","hide-on-single-page"])])):e.createCommentVNode("",!0),e.createVNode(K,{modelValue:r.visible,"onUpdate:modelValue":o[5]||(o[5]=d=>r.visible=d),title:q.value,width:l.dialogWidth,"destroy-on-close":!0,"custom-class":_.value},{footer:e.withCtx(()=>[e.createElementVNode("div",O,[e.createVNode(a,{onClick:o[4]||(o[4]=d=>r.visible=!1)},{default:e.withCtx(()=>o[11]||(o[11]=[e.createTextVNode("取消")])),_:1,__:[11]}),e.createVNode(a,{type:"primary",onClick:M,loading:r.submitting},{default:e.withCtx(()=>o[12]||(o[12]=[e.createTextVNode("确定")])),_:1,__:[12]},8,["loading"])])]),default:e.withCtx(()=>[e.withDirectives((e.openBlock(),e.createElementBlock("div",null,[e.renderSlot(t.$slots,"dialog-form-content",{formData:r.data,mode:r.mode},()=>[l.dialogFormConfig.length>0?(e.openBlock(),e.createBlock(F,{key:0,"form-config":j.value,modelValue:r.data,"onUpdate:modelValue":o[3]||(o[3]=d=>r.data=d),ref:d=>r.formRef=d,rules:l.dialogFormRules,"label-width":"80px"},null,8,["form-config","modelValue","rules"])):e.createCommentVNode("",!0)])])),[[U,r.loading]])]),_:3},8,["modelValue","title","width","custom-class"])],2)}}});f.CrudTable=T,Object.defineProperty(f,Symbol.toStringTag,{value:"Module"})});

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "z-crud-table",
   "private": false,
-  "version": "0.0.17",
+  "version": "0.0.18",
   "type": "module",
   "description": "A powerful and flexible CRUD table component for Vue 3 and Element Plus.",
   "keywords": [