znyg-frontend-common 1.0.65 → 1.0.71
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/es/components/index.d.ts +3 -2
- package/es/components/index.mjs +1 -1
- package/es/components/znTable/index.d.ts +24 -1
- package/es/components/znTable/src/components/Pagination.vue.d.ts +13 -1
- package/es/components/znTable/src/components/Pagination.vue2.mjs +2 -2
- package/es/components/znTable/src/components/Pagination.vue2.mjs.map +1 -1
- package/es/components/znTable/src/index.vue.d.ts +25 -1
- package/es/components/znTable/src/index.vue2.mjs +5 -5
- package/es/components/znTable/src/index.vue2.mjs.map +1 -1
- package/es/components/znTreeFilter/index.d.ts +1 -1
- package/es/components/znTreeFilter/src/index.vue.d.ts +1 -1
- package/es/components/znTreeSelect/index.d.ts +1965 -0
- package/es/components/znTreeSelect/index.mjs +2 -0
- package/es/components/znTreeSelect/index.mjs.map +1 -0
- package/es/components/znTreeSelect/src/index.vue.d.ts +2020 -0
- package/es/components/znTreeSelect/src/index.vue.mjs +2 -0
- package/es/components/znTreeSelect/src/index.vue.mjs.map +1 -0
- package/es/components/znTreeSelect/src/index.vue2.mjs +26 -0
- package/es/components/znTreeSelect/src/index.vue2.mjs.map +1 -0
- package/es/hooks/index.d.ts +1 -0
- package/es/hooks/index.mjs +1 -1
- package/es/hooks/usePopWindowV2/index.d.ts +7 -0
- package/es/hooks/usePopWindowV2/index.mjs +2 -0
- package/es/hooks/usePopWindowV2/index.mjs.map +1 -0
- package/es/hooks/usePopWindowV2/src/index.d.ts +35 -0
- package/es/hooks/usePopWindowV2/src/index.mjs +2 -0
- package/es/hooks/usePopWindowV2/src/index.mjs.map +1 -0
- package/es/hooks/usePopWindowV2/src/interface/index.d.ts +68 -0
- package/es/hooks/usePopWindowV2/src/interface/index.mjs +2 -0
- package/es/hooks/usePopWindowV2/src/interface/index.mjs.map +1 -0
- package/es/index.mjs +1 -1
- package/es/index.mjs.map +1 -1
- package/es/utils/index.d.ts +3 -1
- package/es/utils/index.mjs +1 -1
- package/es/utils/index.mjs.map +1 -1
- package/global.d.ts +1 -0
- package/lib/components/index.d.ts +3 -2
- package/lib/components/index.js +1 -1
- package/lib/components/znTable/index.d.ts +24 -1
- package/lib/components/znTable/src/components/Pagination.vue.d.ts +13 -1
- package/lib/components/znTable/src/components/Pagination.vue2.js +2 -2
- package/lib/components/znTable/src/components/Pagination.vue2.js.map +1 -1
- package/lib/components/znTable/src/index.vue.d.ts +25 -1
- package/lib/components/znTable/src/index.vue2.js +3 -3
- package/lib/components/znTable/src/index.vue2.js.map +1 -1
- package/lib/components/znTreeFilter/index.d.ts +1 -1
- package/lib/components/znTreeFilter/src/index.vue.d.ts +1 -1
- package/lib/components/znTreeSelect/index.d.ts +1965 -0
- package/lib/components/znTreeSelect/index.js +2 -0
- package/lib/components/znTreeSelect/index.js.map +1 -0
- package/lib/components/znTreeSelect/src/index.vue.d.ts +2020 -0
- package/lib/components/znTreeSelect/src/index.vue.js +2 -0
- package/lib/components/znTreeSelect/src/index.vue.js.map +1 -0
- package/lib/components/znTreeSelect/src/index.vue2.js +26 -0
- package/lib/components/znTreeSelect/src/index.vue2.js.map +1 -0
- package/lib/hooks/index.d.ts +1 -0
- package/lib/hooks/index.js +1 -1
- package/lib/hooks/usePopWindowV2/index.d.ts +7 -0
- package/lib/hooks/usePopWindowV2/index.js +2 -0
- package/lib/hooks/usePopWindowV2/index.js.map +1 -0
- package/lib/hooks/usePopWindowV2/src/index.d.ts +35 -0
- package/lib/hooks/usePopWindowV2/src/index.js +2 -0
- package/lib/hooks/usePopWindowV2/src/index.js.map +1 -0
- package/lib/hooks/usePopWindowV2/src/interface/index.d.ts +68 -0
- package/lib/hooks/usePopWindowV2/src/interface/index.js +2 -0
- package/lib/hooks/usePopWindowV2/src/interface/index.js.map +1 -0
- package/lib/index.js +1 -1
- package/lib/index.js.map +1 -1
- package/lib/utils/index.d.ts +3 -1
- package/lib/utils/index.js +1 -1
- package/lib/utils/index.js.map +1 -1
- package/package.json +1 -1
- package/theme-default/index.css +1 -1
- package/es/utils/myDevelop.d.ts +0 -1
- package/es/utils/myDevelop.mjs +0 -2
- package/es/utils/myDevelop.mjs.map +0 -1
- package/lib/utils/myDevelop.d.ts +0 -1
- package/lib/utils/myDevelop.js +0 -2
- package/lib/utils/myDevelop.js.map +0 -1
package/es/components/index.d.ts
CHANGED
|
@@ -1,5 +1,6 @@
|
|
|
1
1
|
import ZnChart from './znChart/index';
|
|
2
2
|
import { ZnTable, type ZnTableProps, type SearchProps, type ColumnProps } from './znTable/index';
|
|
3
|
+
import { ZnTreeSelect, type ZnTreeSelectProps } from './znTreeSelect/index';
|
|
3
4
|
import ZnTreeFilter from './znTreeFilter/index';
|
|
4
5
|
import ZnCountTo from './znCountTo/index';
|
|
5
6
|
import { default as ZnForm } from './znForm/index';
|
|
@@ -11,6 +12,6 @@ import ZnSearch from './znSearch/index';
|
|
|
11
12
|
import ZnNumberScroll from './znNumberScroll/index';
|
|
12
13
|
export { type ZnFormProps, type ZnFormSchemaProps, type ZnElFormProps, useZnForm } from './znForm/index';
|
|
13
14
|
export type { ZnWorkGridProps, ZnWorkGridItemsProps, ZnWorkGridWrokListProps } from './znWorkGrid/index';
|
|
14
|
-
export type { ZnTableProps, SearchProps, ColumnProps, ZnTimelineItemPro, ZnGridProps, ZnGridItemProps };
|
|
15
|
-
export { ZnTable, ZnTreeFilter, ZnChart, ZnCountTo, ZnTest, ZnForm, ZnTimeline, ZnWorkGrid, ZnGrid, ZnGridItem, ZnSearch, ZnNumberScroll };
|
|
15
|
+
export type { ZnTableProps, ZnTreeSelectProps, SearchProps, ColumnProps, ZnTimelineItemPro, ZnGridProps, ZnGridItemProps };
|
|
16
|
+
export { ZnTable, ZnTreeSelect, ZnTreeFilter, ZnChart, ZnCountTo, ZnTest, ZnForm, ZnTimeline, ZnWorkGrid, ZnGrid, ZnGridItem, ZnSearch, ZnNumberScroll };
|
|
16
17
|
export { useZnSearch, type ZnSearchProps, type ZnSearchSchemaProps } from './znSearch/index';
|
package/es/components/index.mjs
CHANGED
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
export{ZnChart}from"./znChart/index.mjs";export{ZnTable}from"./znTable/index.mjs";export{ZnTreeFilter}from"./znTreeFilter/index.mjs";export{ZnCountTo}from"./znCountTo/index.mjs";export{ZnForm}from"./znForm/index.mjs";export{ZnTimeline}from"./znTimeLine/index.mjs";export{ZnGrid,ZnGridItem}from"./znGrid/index.mjs";export{ZnTest}from"./znTest/index.mjs";export{ZnWorkGrid}from"./znWorkGrid/index.mjs";export{ZnSearch}from"./znSearch/index.mjs";export{ZnNumberScroll}from"./znNumberScroll/index.mjs";export{useZnForm}from"./znForm/src/hooks/useZnForm.mjs";export{useZnSearch}from"./znSearch/src/hooks/useProSearch.mjs";
|
|
1
|
+
export{ZnChart}from"./znChart/index.mjs";export{ZnTable}from"./znTable/index.mjs";export{ZnTreeSelect}from"./znTreeSelect/index.mjs";export{ZnTreeFilter}from"./znTreeFilter/index.mjs";export{ZnCountTo}from"./znCountTo/index.mjs";export{ZnForm}from"./znForm/index.mjs";export{ZnTimeline}from"./znTimeLine/index.mjs";export{ZnGrid,ZnGridItem}from"./znGrid/index.mjs";export{ZnTest}from"./znTest/index.mjs";export{ZnWorkGrid}from"./znWorkGrid/index.mjs";export{ZnSearch}from"./znSearch/index.mjs";export{ZnNumberScroll}from"./znNumberScroll/index.mjs";export{useZnForm}from"./znForm/src/hooks/useZnForm.mjs";export{useZnSearch}from"./znSearch/src/hooks/useProSearch.mjs";
|
|
2
2
|
//# sourceMappingURL=index.mjs.map
|
|
@@ -36,6 +36,11 @@ export declare const ZnTable: import("../../types").SFCWithInstall<import("vue")
|
|
|
36
36
|
required: false;
|
|
37
37
|
default: boolean;
|
|
38
38
|
};
|
|
39
|
+
pageSizeOptions: {
|
|
40
|
+
type: ArrayConstructor;
|
|
41
|
+
required: false;
|
|
42
|
+
default: () => number[];
|
|
43
|
+
};
|
|
39
44
|
initParam: {
|
|
40
45
|
type: any;
|
|
41
46
|
required: false;
|
|
@@ -3221,6 +3226,11 @@ export declare const ZnTable: import("../../types").SFCWithInstall<import("vue")
|
|
|
3221
3226
|
type: FunctionConstructor;
|
|
3222
3227
|
required: true;
|
|
3223
3228
|
};
|
|
3229
|
+
pageSizeOptions: {
|
|
3230
|
+
type: ArrayConstructor;
|
|
3231
|
+
required: false;
|
|
3232
|
+
default: () => number[];
|
|
3233
|
+
};
|
|
3224
3234
|
}>, {
|
|
3225
3235
|
props: any;
|
|
3226
3236
|
pageSizes: import("vue").Ref<number[], number[]>;
|
|
@@ -3237,7 +3247,14 @@ export declare const ZnTable: import("../../types").SFCWithInstall<import("vue")
|
|
|
3237
3247
|
type: FunctionConstructor;
|
|
3238
3248
|
required: true;
|
|
3239
3249
|
};
|
|
3240
|
-
|
|
3250
|
+
pageSizeOptions: {
|
|
3251
|
+
type: ArrayConstructor;
|
|
3252
|
+
required: false;
|
|
3253
|
+
default: () => number[];
|
|
3254
|
+
};
|
|
3255
|
+
}>> & Readonly<{}>, {
|
|
3256
|
+
pageSizeOptions: unknown[];
|
|
3257
|
+
}, {}, {}, {}, string, import("vue").ComponentProvideOptions, true, {}, any>;
|
|
3241
3258
|
TableColumn: import("vue").DefineComponent<import("vue").ExtractPropTypes<{
|
|
3242
3259
|
column: {
|
|
3243
3260
|
type: any;
|
|
@@ -4107,6 +4124,11 @@ export declare const ZnTable: import("../../types").SFCWithInstall<import("vue")
|
|
|
4107
4124
|
required: false;
|
|
4108
4125
|
default: boolean;
|
|
4109
4126
|
};
|
|
4127
|
+
pageSizeOptions: {
|
|
4128
|
+
type: ArrayConstructor;
|
|
4129
|
+
required: false;
|
|
4130
|
+
default: () => number[];
|
|
4131
|
+
};
|
|
4110
4132
|
initParam: {
|
|
4111
4133
|
type: any;
|
|
4112
4134
|
required: false;
|
|
@@ -4176,6 +4198,7 @@ export declare const ZnTable: import("../../types").SFCWithInstall<import("vue")
|
|
|
4176
4198
|
columns: unknown[];
|
|
4177
4199
|
requestAuto: boolean;
|
|
4178
4200
|
pagination: boolean;
|
|
4201
|
+
pageSizeOptions: unknown[];
|
|
4179
4202
|
initParam: any;
|
|
4180
4203
|
border: boolean;
|
|
4181
4204
|
toolButton: boolean | unknown[];
|
|
@@ -11,6 +11,11 @@ declare const _default: import("vue").DefineComponent<import("vue").ExtractPropT
|
|
|
11
11
|
type: FunctionConstructor;
|
|
12
12
|
required: true;
|
|
13
13
|
};
|
|
14
|
+
pageSizeOptions: {
|
|
15
|
+
type: ArrayConstructor;
|
|
16
|
+
required: false;
|
|
17
|
+
default: () => number[];
|
|
18
|
+
};
|
|
14
19
|
}>, {
|
|
15
20
|
props: any;
|
|
16
21
|
pageSizes: import("vue").Ref<number[], number[]>;
|
|
@@ -27,5 +32,12 @@ declare const _default: import("vue").DefineComponent<import("vue").ExtractPropT
|
|
|
27
32
|
type: FunctionConstructor;
|
|
28
33
|
required: true;
|
|
29
34
|
};
|
|
30
|
-
|
|
35
|
+
pageSizeOptions: {
|
|
36
|
+
type: ArrayConstructor;
|
|
37
|
+
required: false;
|
|
38
|
+
default: () => number[];
|
|
39
|
+
};
|
|
40
|
+
}>> & Readonly<{}>, {
|
|
41
|
+
pageSizeOptions: unknown[];
|
|
42
|
+
}, {}, {}, {}, string, import("vue").ComponentProvideOptions, true, {}, any>;
|
|
31
43
|
export default _default;
|
|
@@ -1,3 +1,3 @@
|
|
|
1
|
-
import{defineComponent as e,ref as a,watch as n,resolveComponent as t,createElementBlock as
|
|
2
|
-
/* STABLE_FRAGMENT, DEV_ROOT_FRAGMENT */)}}});export{
|
|
1
|
+
import{defineComponent as e,ref as a,watch as n,resolveComponent as t,createElementBlock as r,openBlock as p,Fragment as g,createCommentVNode as i,createVNode as u}from"vue";var l=Object.defineProperty,o=e({__name:"Pagination",props:{pageable:{type:Object,required:!0},handleSizeChange:{type:Function,required:!0},handleCurrentChange:{type:Function,required:!0},pageSizeOptions:{type:Array,required:!1,default:((e,a)=>l(e,"name",{value:a,configurable:!0}))((()=>[10,25,50,100]),"default")}},setup(e){const l=e,o=a([10]);return n((()=>l.pageable.pageSize),(()=>{let e=[...l.pageSizeOptions];e.includes(l.pageable.pageSize)||e.push(l.pageable.pageSize);const a=e.sort(((e,a)=>e-a));o.value=a}),{immediate:!0,deep:!0}),(a,n)=>{const l=t("el-pagination");return p(),r(g,null,[i(" 分页组件 "),u(l,{background:!0,"current-page":e.pageable.pageNum,"page-size":e.pageable.pageSize,"page-sizes":o.value,total:e.pageable.total,layout:"total, sizes, prev, pager, next, jumper",onSizeChange:e.handleSizeChange,onCurrentChange:e.handleCurrentChange},null,8,["current-page","page-size","page-sizes","total","onSizeChange","onCurrentChange"])],2112
|
|
2
|
+
/* STABLE_FRAGMENT, DEV_ROOT_FRAGMENT */)}}});export{o as default};
|
|
3
3
|
//# sourceMappingURL=Pagination.vue2.mjs.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Pagination.vue2.mjs","sources":["../../../../../../../packages/components/znTable/src/components/Pagination.vue"],"sourcesContent":["<template>\n <!-- 分页组件 -->\n <el-pagination\n :background=\"true\"\n :current-page=\"pageable.pageNum\"\n :page-size=\"pageable.pageSize\"\n :page-sizes=\"pageSizes\"\n :total=\"pageable.total\"\n layout=\"total, sizes, prev, pager, next, jumper\"\n @size-change=\"handleSizeChange\"\n @current-change=\"handleCurrentChange\"\n ></el-pagination>\n</template>\n\n<script setup lang=\"ts\" name=\"Pagination\">\n import { ref,unref,watch } from \"vue\";\n interface Pageable {\n pageNum: number\n pageSize: number\n total: number\n }\n\n interface PaginationProps {\n pageable: Pageable\n handleSizeChange: (size: number) => void\n handleCurrentChange: (currentPage: number) => void\n }\n\n const props = defineProps({\n pageable: { type: Object, required: true },\n handleSizeChange: { type: Function, required: true },\n handleCurrentChange: { type: Function, required: true }\n})\n const pageSizes = ref([10])\n\n watch(\n () => props.pageable.pageSize,\n () => {\n let pageList = [
|
|
1
|
+
{"version":3,"file":"Pagination.vue2.mjs","sources":["../../../../../../../packages/components/znTable/src/components/Pagination.vue"],"sourcesContent":["<template>\n <!-- 分页组件 -->\n <el-pagination\n :background=\"true\"\n :current-page=\"pageable.pageNum\"\n :page-size=\"pageable.pageSize\"\n :page-sizes=\"pageSizes\"\n :total=\"pageable.total\"\n layout=\"total, sizes, prev, pager, next, jumper\"\n @size-change=\"handleSizeChange\"\n @current-change=\"handleCurrentChange\"\n ></el-pagination>\n</template>\n\n<script setup lang=\"ts\" name=\"Pagination\">\n import { ref,unref,watch } from \"vue\";\n interface Pageable {\n pageNum: number\n pageSize: number\n total: number\n }\n\n interface PaginationProps {\n pageable: Pageable\n handleSizeChange: (size: number) => void\n handleCurrentChange: (currentPage: number) => void\n pageSizeOptions?: number[] // 页面大小选项配置\n }\n\n const props = defineProps({\n pageable: { type: Object, required: true },\n handleSizeChange: { type: Function, required: true },\n handleCurrentChange: { type: Function, required: true },\n pageSizeOptions: { type: Array, required: false, default: () => [10, 25, 50, 100] }\n})\n const pageSizes = ref([10])\n\n watch(\n () => props.pageable.pageSize,\n () => {\n let pageList = [...props.pageSizeOptions] // 使用配置的页面大小选项\n if (!pageList.includes(props.pageable.pageSize)) {\n pageList.push(props.pageable.pageSize)\n }\n const sizes = pageList.sort((a, b) => a - b)\n pageSizes.value = sizes\n },\n {\n immediate: true,\n deep: true\n }\n )\n</script>\n"],"names":["props","__props","pageSizes","ref","watch","pageable","pageSize","pageList","pageSizeOptions","includes","push","sizes","sort","a","b","value","immediate","deep"],"mappings":"ofA6BE,MAAMA,EAAQC,EAMRC,EAAYC,EAAI,CAAC,YAEvBC,GACE,IAAMJ,EAAMK,SAASC,WACrB,KACE,IAAIC,EAAW,IAAIP,EAAMQ,iBACpBD,EAASE,SAAST,EAAMK,SAASC,WAC3BC,EAAAG,KAAKV,EAAMK,SAASC,UAE/B,MAAMK,EAAQJ,EAASK,MAAK,CAACC,EAAGC,IAAMD,EAAIC,IAC1CZ,EAAUa,MAAQJ,CAAA,GAEpB,CACEK,WAAW,EACXC,MAAM;"}
|
|
@@ -11,6 +11,7 @@ export interface ZnTableProps {
|
|
|
11
11
|
dataCallback?: (data: any) => any;
|
|
12
12
|
title?: string;
|
|
13
13
|
pagination?: boolean;
|
|
14
|
+
pageSizeOptions?: number[];
|
|
14
15
|
initParam?: any;
|
|
15
16
|
border?: boolean;
|
|
16
17
|
toolButton?: ('refresh' | 'setting' | 'search')[] | boolean;
|
|
@@ -59,6 +60,11 @@ declare const _default: import("vue").DefineComponent<import("vue").ExtractPropT
|
|
|
59
60
|
required: false;
|
|
60
61
|
default: boolean;
|
|
61
62
|
};
|
|
63
|
+
pageSizeOptions: {
|
|
64
|
+
type: ArrayConstructor;
|
|
65
|
+
required: false;
|
|
66
|
+
default: () => number[];
|
|
67
|
+
};
|
|
62
68
|
initParam: {
|
|
63
69
|
type: any;
|
|
64
70
|
required: false;
|
|
@@ -3244,6 +3250,11 @@ declare const _default: import("vue").DefineComponent<import("vue").ExtractPropT
|
|
|
3244
3250
|
type: FunctionConstructor;
|
|
3245
3251
|
required: true;
|
|
3246
3252
|
};
|
|
3253
|
+
pageSizeOptions: {
|
|
3254
|
+
type: ArrayConstructor;
|
|
3255
|
+
required: false;
|
|
3256
|
+
default: () => number[];
|
|
3257
|
+
};
|
|
3247
3258
|
}>, {
|
|
3248
3259
|
props: any;
|
|
3249
3260
|
pageSizes: import("vue").Ref<number[], number[]>;
|
|
@@ -3260,7 +3271,14 @@ declare const _default: import("vue").DefineComponent<import("vue").ExtractPropT
|
|
|
3260
3271
|
type: FunctionConstructor;
|
|
3261
3272
|
required: true;
|
|
3262
3273
|
};
|
|
3263
|
-
|
|
3274
|
+
pageSizeOptions: {
|
|
3275
|
+
type: ArrayConstructor;
|
|
3276
|
+
required: false;
|
|
3277
|
+
default: () => number[];
|
|
3278
|
+
};
|
|
3279
|
+
}>> & Readonly<{}>, {
|
|
3280
|
+
pageSizeOptions: unknown[];
|
|
3281
|
+
}, {}, {}, {}, string, import("vue").ComponentProvideOptions, true, {}, any>;
|
|
3264
3282
|
TableColumn: import("vue").DefineComponent<import("vue").ExtractPropTypes<{
|
|
3265
3283
|
column: {
|
|
3266
3284
|
type: any;
|
|
@@ -4130,6 +4148,11 @@ declare const _default: import("vue").DefineComponent<import("vue").ExtractPropT
|
|
|
4130
4148
|
required: false;
|
|
4131
4149
|
default: boolean;
|
|
4132
4150
|
};
|
|
4151
|
+
pageSizeOptions: {
|
|
4152
|
+
type: ArrayConstructor;
|
|
4153
|
+
required: false;
|
|
4154
|
+
default: () => number[];
|
|
4155
|
+
};
|
|
4133
4156
|
initParam: {
|
|
4134
4157
|
type: any;
|
|
4135
4158
|
required: false;
|
|
@@ -4199,6 +4222,7 @@ declare const _default: import("vue").DefineComponent<import("vue").ExtractPropT
|
|
|
4199
4222
|
columns: unknown[];
|
|
4200
4223
|
requestAuto: boolean;
|
|
4201
4224
|
pagination: boolean;
|
|
4225
|
+
pageSizeOptions: unknown[];
|
|
4202
4226
|
initParam: any;
|
|
4203
4227
|
border: boolean;
|
|
4204
4228
|
toolButton: boolean | unknown[];
|
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
import{defineComponent as e,getCurrentInstance as t,ref as a,computed as r,onMounted as o,toRaw as l,reactive as n,watch as i,unref as s,provide as u,resolveComponent as c,resolveDirective as p,createElementBlock as d,openBlock as h,createCommentVNode as m,withDirectives as f,createElementVNode as g,createBlock as y,createVNode as v,vShow as S,normalizeClass as b,renderSlot as C,mergeProps as w,withCtx as k,Fragment as _,renderList as B,resolveDynamicComponent as q,createSlots as O}from"vue";import T from"./assets/notData.png.mjs";import"./components/ColSetting.vue.mjs";import"./components/Pagination.vue.mjs";import"./components/TableColumn.vue.mjs";import"./components/SearchForm/index.vue.mjs";import"./components/OperationBtns/index.vue.mjs";import{useSelection as x}from"./hooks/useSelection.mjs";import{useTable as E}from"./hooks/useTable.mjs";import{generateUUID as N,handleProp as F}from"./utils.mjs";import{Refresh as
|
|
1
|
+
import{defineComponent as e,getCurrentInstance as t,ref as a,computed as r,onMounted as o,toRaw as l,reactive as n,watch as i,unref as s,provide as u,resolveComponent as c,resolveDirective as p,createElementBlock as d,openBlock as h,createCommentVNode as m,withDirectives as f,createElementVNode as g,createBlock as y,createVNode as v,vShow as S,normalizeClass as b,renderSlot as C,mergeProps as w,withCtx as k,Fragment as _,renderList as B,resolveDynamicComponent as q,createSlots as O}from"vue";import T from"./assets/notData.png.mjs";import"./components/ColSetting.vue.mjs";import"./components/Pagination.vue.mjs";import"./components/TableColumn.vue.mjs";import"./components/SearchForm/index.vue.mjs";import"./components/OperationBtns/index.vue.mjs";import{useSelection as x}from"./hooks/useSelection.mjs";import{useTable as E}from"./hooks/useTable.mjs";import{generateUUID as N,handleProp as F}from"./utils.mjs";import{Refresh as A,Operation as j,Search as L,DCaret as M}from"@element-plus/icons-vue";import{ElTable as U}from"element-plus";import{useLocalStorage as I,useResizeObserver as z}from"@vueuse/core";import V from"./components/SearchForm/index.vue2.mjs";import $ from"./components/OperationBtns/index.vue2.mjs";import P from"./components/TableColumn.vue2.mjs";import R from"./components/Pagination.vue2.mjs";import D from"./components/ColSetting.vue2.mjs";var H=Object.defineProperty,K=(e,t)=>H(e,"name",{value:t,configurable:!0});const G={class:"table-box"},X={class:"table-header"},J={class:"header-button-lf"},Z={key:0,class:"header-button-ri"},Q={class:"table-empty"};var W=e({name:"ZnTable",__name:"index",props:{columns:{type:Array,required:!0,default:K((()=>[]),"default")},data:{type:Array,required:!1},requestApi:{type:Function,required:!1},requestAuto:{type:Boolean,required:!1,default:!0},requestError:{type:Function,required:!1},dataCallback:{type:Function,required:!1},title:{type:String,required:!1},pagination:{type:Boolean,required:!1,default:!0},pageSizeOptions:{type:Array,required:!1,default:K((()=>[10,25,50,100]),"default")},initParam:{required:!1,default:{}},border:{type:Boolean,required:!1,default:!0},toolButton:{type:[Array,Boolean],required:!1,default:!0},rowKey:{type:String,required:!1,default:"id"},searchCol:{type:[Number,Object],required:!1,default:K((()=>({xs:1,sm:2,md:2,lg:3,xl:4})),"default")},height:{type:[String,Number],required:!1},heightOffset:{type:Number,required:!1,default:0},minHeight:{type:[String,Number],required:!1,default:200},onlyTable:{type:Boolean,required:!1,default:!1},isView:{type:Boolean,required:!1,default:!1},searchFormShow:{type:Boolean,required:!1,default:!0}},emits:["search","reset","dragSort","handleOperateBtnsClick"],setup(e,{expose:H,emit:W}){const Y=e,ee=t(),te=I("znyg",{dictMap:{}}),ae=a(0);z(document.body,(e=>{const t=e[0],{height:a}=t.contentRect;ae.value=a}));const re=r((()=>{if(Y.height)return Y.height;const e=ae.value-100-(pe.value?120:40)-(Y.pagination?150:0)-Y.heightOffset,t="number"==typeof Y.minHeight?Y.minHeight:parseInt(Y.minHeight.toString());return e>t?e:t})),oe=a(),le=a("id-"+N()),ne={
|
|
2
2
|
// 前置特殊列(显示在表格最前面)
|
|
3
3
|
FRONT_COLUMNS:["selection","radio","index","expand","sort"],
|
|
4
4
|
// 后置特殊列(显示在表格最后面)
|
|
@@ -8,7 +8,7 @@ EXCLUDE_FROM_SETTING:{props:["operation"],
|
|
|
8
8
|
// 按 prop 排除
|
|
9
9
|
types:[],
|
|
10
10
|
// 按 type 排除(会自动包含所有特殊列类型)
|
|
11
|
-
fixed:!0}},ie=[...ne.FRONT_COLUMNS,...ne.BACK_COLUMNS],se=K((e=>e&&ne.FRONT_COLUMNS.includes(e)),"isFrontSpecialColumn"),ue=K((e=>e&&ne.BACK_COLUMNS.includes(e)),"isBackSpecialColumn"),ce=K((e=>{const{type:t,prop:a,fixed:r}=e;return!(!t||!ie.includes(t))||(!(!a||!ne.EXCLUDE_FROM_SETTING.props.includes(a))||!(!ne.EXCLUDE_FROM_SETTING.fixed||!r))}),"shouldExcludeFromSetting"),pe=a(Y.searchFormShow),de=K((e=>Array.isArray(Y.toolButton)?Y.toolButton.includes(e):Y.toolButton),"showToolButton"),he=a(""),{selectionChange:me,selectedList:fe,selectedListIds:ge,isSelected:ye}=x(Y.rowKey),{tableData:ve,pageable:Se,searchParam:be,searchInitParam:Ce,getTableList:we,search:ke,reset:_e,handleSizeChange:Be,handleCurrentChange:qe,loading:Oe}=E(Y.requestApi,Y.initParam,Y.pagination,Y.dataCallback,Y.requestError),Te=K((()=>{oe.value&&oe.value.clearSelection()}),"clearSelection");o((()=>{Y.requestAuto&&we(),Y.data&&(Se.value.total=Y.data.length)}));const xe=r((()=>{if(!Y.data)return ve.value;if(!Y.pagination)return Y.data;let e=l(Y.data).slice((Se.value.pageNum-1)*Se.value.pageSize,Se.value.pageSize*Se.value.pageNum);return n(e)}));i((()=>Y.initParam),we,{deep:!0});let Ee=n(Y.columns);const Ne=r((()=>
|
|
11
|
+
fixed:!0}},ie=[...ne.FRONT_COLUMNS,...ne.BACK_COLUMNS],se=K((e=>e&&ne.FRONT_COLUMNS.includes(e)),"isFrontSpecialColumn"),ue=K((e=>e&&ne.BACK_COLUMNS.includes(e)),"isBackSpecialColumn"),ce=K((e=>{const{type:t,prop:a,fixed:r}=e;return!(!t||!ie.includes(t))||(!(!a||!ne.EXCLUDE_FROM_SETTING.props.includes(a))||!(!ne.EXCLUDE_FROM_SETTING.fixed||!r))}),"shouldExcludeFromSetting"),pe=a(Y.searchFormShow),de=K((e=>Array.isArray(Y.toolButton)?Y.toolButton.includes(e):Y.toolButton),"showToolButton"),he=a(""),{selectionChange:me,selectedList:fe,selectedListIds:ge,isSelected:ye}=x(Y.rowKey),{tableData:ve,pageable:Se,searchParam:be,searchInitParam:Ce,getTableList:we,search:ke,reset:_e,handleSizeChange:Be,handleCurrentChange:qe,loading:Oe}=E(Y.requestApi,Y.initParam,Y.pagination,Y.dataCallback,Y.requestError),Te=K((()=>{oe.value&&oe.value.clearSelection()}),"clearSelection");o((()=>{Y.requestAuto&&we(),Y.data&&(Se.value.total=Y.data.length)}));const xe=r((()=>{if(!Y.data)return ve.value;if(!Y.pagination)return Y.data;let e=l(Y.data).slice((Se.value.pageNum-1)*Se.value.pageSize,Se.value.pageSize*Se.value.pageNum);return n(e)}));i((()=>Y.initParam),we,{deep:!0});let Ee=n(Y.columns);const Ne=r((()=>je(Ee))),Fe=a(new Map),Ae=K((async({prop:e,enum:t,dictCode:a})=>{if(a&&te&&te.value?.dictMap)return void Fe.value.set(e,te.value.dictMap[a]??[]);if(!t)return;if(Fe.value.has(e)&&("function"==typeof t||Fe.value.get(e)===t))return;if("function"!=typeof t)return Fe.value.set(e,s(t));Fe.value.set(e,[]);let r=await t();r=r?.result||r,Fe.value.set(e,r)}),"setEnumMap");u("enumMap",Fe);const je=K(((e,t=[])=>(e.forEach((async e=>{e._children?.length&&t.push(...je(e._children)),t.push(e),e.isShow=e.isShow??!0,e.isShowInView=e.isShowInView??!0,e.isFilterEnum=e.isFilterEnum??!0,await Ae(e)})),t.filter((e=>!e._children?.length)))),"flatColumnsFunc"),Le=r((()=>Ne.value?.filter((e=>e.search?.el||e.search?.render)).sort(((e,t)=>e.search.order-t.search.order))));Le.value?.forEach(((e,t)=>{e.search.order=e.search?.order??t+2;const a=e.search?.key??F(e.prop),r=e.search?.defaultValue;null!=r&&(Ce.value[a]=r,be.value[a]=r)}));const Me=a(),Ue=a([]);K((()=>{Ue.value=Ee.filter((e=>!ce(e)))}),"initColSetting")();const Ie=K((e=>{if(ee&&!ee.isUnmounted)try{if(!e||!Array.isArray(e)||0===e.length)return void console.warn("updateTableColumns: 无效的列设置数据",{hasNewColSetting:!!e,isArray:Array.isArray(e),length:e?.length});let t;try{t=JSON.parse(JSON.stringify(e))}catch(a){console.warn("深拷贝列设置数据失败,使用浅拷贝"),t=[...e]}const a=new Map,r=[...Ee];r.forEach((e=>{e&&e.prop&&a.set(e.prop,e)}));const o=[],l=new Set;r.forEach((e=>{e&&(se(e.type)||"left"===e.fixed)&&(o.push(e),e.prop&&l.add(e.prop))})),t.forEach((e=>{if(e&&e.prop&&a.has(e.prop)&&!l.has(e.prop)){const t=a.get(e.prop);if(t)try{const a={...t};a.isShow=e.isShow,a.sortable=e.sortable,o.push(a),l.add(e.prop)}catch(a){console.warn("更新列配置时出错:",a),o.push(t),l.add(e.prop)}}})),r.forEach((e=>{!e||e.prop&&l.has(e.prop)||!ue(e.type)&&(ie.includes(e.type)||"left"===e.fixed)||o.push(e)})),setTimeout((()=>{if(ee&&!ee.isUnmounted)try{Ee.length=0,o.forEach((e=>{e&&Ee.push(e)}))}catch(e){console.warn("更新表格列时出错:",e)}else console.warn("延迟更新时组件已销毁")}),50)}catch(e){console.warn("updateTableColumns执行时出错:",e)}else console.warn("组件已销毁,跳过列更新")}),"updateTableColumns"),ze=K((()=>{Me.value.openColSetting()}),"openColSetting"),Ve=W,$e=K((()=>{ke(),Ve("search")}),"_search"),Pe=K((()=>{_e(),Ve("reset")}),"_reset"),Re=K(((e,t,a)=>{Ve("handleOperateBtnsClick",e,t,a)}),"handleOperateBtnsClick"),De=K((()=>{we()}),"refreshTable");return H({element:oe,tableData:xe,radio:he,pageable:Se,searchParam:be,searchInitParam:Ce,getTableList:we,search:ke,reset:_e,handleSizeChange:Be,handleCurrentChange:qe,clearSelection:Te,enumMap:Fe,isSelected:ye,selectedList:fe,selectedListIds:ge,refreshTable:De,setSearchFormShow:K((e=>{pe.value=e}),"setSearchFormShow"),getColumns:K((()=>Ee),"getColumns"),getColSetting:K((()=>Ue.value),"getColSetting")}),(t,a)=>{const r=c("el-button"),o=c("el-radio"),l=c("el-icon"),n=c("el-tag"),i=c("el-table-column"),u=p("loading");return h(),d("div",G,[m(" 查询表单 "),f(v(V,{search:$e,reset:Pe,columns:Le.value,"search-param":s(be),"search-col":e.searchCol},null,8,["columns","search-param","search-col"]),[[S,pe.value]]),m(" 表格主体 "),g("div",{class:b([e.onlyTable?"only-table":"card table-main"])},[m(" 表格头部 操作按钮 "),g("div",X,[g("div",J,[C(t.$slots,"tableHeader",{selectedList:s(fe),selectedListIds:s(ge),isSelected:s(ye)})]),e.toolButton?(h(),d("div",Z,[C(t.$slots,"toolButton",{},(()=>[de("refresh")?(h(),y(r,{key:0,icon:s(A),circle:"",onClick:s(we)},null,8,["icon","onClick"])):m("v-if",!0),de("setting")&&e.columns.length?(h(),y(r,{key:1,icon:s(j),circle:"",onClick:ze},null,8,["icon"])):m("v-if",!0),de("search")&&Le.value?.length?(h(),y(r,{key:2,icon:s(L),circle:"",onClick:a[0]||(a[0]=e=>pe.value=!pe.value)},null,8,["icon"])):m("v-if",!0)]))])):m("v-if",!0)]),m(" 表格主体 "),f((h(),y(s(U),w({ref_key:"tableRef",ref:oe},t.$attrs,{data:xe.value,border:e.border,id:le.value,"row-key":e.rowKey,height:re.value,onSelectionChange:s(me)}),{append:k((()=>[C(t.$slots,"append")])),empty:k((()=>[g("div",Q,[C(t.$slots,"empty",{},(()=>[a[4]||(a[4]=g("img",{src:T,alt:"notData"},null,-1
|
|
12
12
|
/* HOISTED */)),a[5]||(a[5]=g("div",null,"暂无数据",-1
|
|
13
13
|
/* HOISTED */))]))])])),default:k((()=>[C(t.$slots,"default"),(h(!0),d(_,null,B(s(Ee),(r=>(h(),d(_,{key:r},[m(" selection || radio || index || expand || sort "),r.type&&ie.includes(r.type)?(h(),y(i,w({key:0,ref_for:!0},r,{selectable:K((e=>null==e.selectable||null==e.selectable||e.selectable),"selectable"),align:r.align??"center","reserve-selection":"selection"==r.type}),{default:k((i=>[m(" expand "),"expand"==r.type?(h(),d(_,{key:0},[r.render?(h(),y(q(r.render),w({key:0,ref_for:!0},i),null,16
|
|
14
14
|
/* FULL_PROPS */)):C(t.$slots,r.type,w({key:1,ref_for:!0},i))],64
|
|
@@ -16,12 +16,12 @@ fixed:!0}},ie=[...ne.FRONT_COLUMNS,...ne.BACK_COLUMNS],se=K((e=>e&&ne.FRONT_COLU
|
|
|
16
16
|
/* HOISTED */)]))),_:2
|
|
17
17
|
/* DYNAMIC */},1032,["modelValue","label"])):m("v-if",!0),m(" sort "),"sort"==r.type?(h(),y(n,{key:2,class:"move"},{default:k((()=>[v(l,null,{default:k((()=>[v(s(M))])),_:1
|
|
18
18
|
/* STABLE */})])),_:1
|
|
19
|
-
/* STABLE */})):m("v-if",!0),m(" operationBtns "),"operationBtns"==r.type?(h(),y(
|
|
20
|
-
/* DYNAMIC */},1040,["selectable","align","reserve-selection"])):m("v-if",!0),m(" other "),!r.type&&r.prop&&r.isShow&&(!s(e.isView)||s(e.isView)&&r.isShowInView)?(h(),y(
|
|
19
|
+
/* STABLE */})):m("v-if",!0),m(" operationBtns "),"operationBtns"==r.type?(h(),y($,w({key:3,ref_for:!0},r.props,{row:i.row,onBtnClick:Re}),null,16,["row"])):m("v-if",!0)])),_:2
|
|
20
|
+
/* DYNAMIC */},1040,["selectable","align","reserve-selection"])):m("v-if",!0),m(" other "),!r.type&&r.prop&&r.isShow&&(!s(e.isView)||s(e.isView)&&r.isShowInView)?(h(),y(P,{key:1,column:r,"is-view":e.isView},O({_:2
|
|
21
21
|
/* DYNAMIC */},[B(Object.keys(t.$slots),(e=>({name:e,fn:k((a=>[C(t.$slots,e,w({ref_for:!0},a))]))})))]),1032,["column","is-view"])):m("v-if",!0)],64
|
|
22
22
|
/* STABLE_FRAGMENT */)))),128
|
|
23
23
|
/* KEYED_FRAGMENT */))])),_:3
|
|
24
|
-
/* FORWARDED */},16,["data","border","id","row-key","height","onSelectionChange"])),[[u,s(Oe)]]),m(" 分页组件 "),C(t.$slots,"pagination",{},(()=>[e.pagination?(h(),y(
|
|
24
|
+
/* FORWARDED */},16,["data","border","id","row-key","height","onSelectionChange"])),[[u,s(Oe)]]),m(" 分页组件 "),C(t.$slots,"pagination",{},(()=>[e.pagination?(h(),y(R,{key:0,pageable:s(Se),"handle-size-change":s(Be),"handle-current-change":s(qe),"page-size-options":e.pageSizeOptions},null,8,["pageable","handle-size-change","handle-current-change","page-size-options"])):m("v-if",!0)]))],2
|
|
25
25
|
/* CLASS */),m(" 列设置 "),e.toolButton?(h(),y(D,{key:0,ref_key:"colRef",ref:Me,"col-setting":Ue.value,"onUpdate:colSetting":a[2]||(a[2]=e=>Ue.value=e),onUpdateColumns:Ie},{colSettingHeader:k((()=>[C(t.$slots,"colSettingHeader")])),_:3
|
|
26
26
|
/* FORWARDED */},8,["col-setting"])):m("v-if",!0)])}}});export{W as default};
|
|
27
27
|
//# sourceMappingURL=index.vue2.mjs.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"index.vue2.mjs","sources":["../../../../../../packages/components/znTable/src/index.vue"],"sourcesContent":["<!-- 📚📚📚 Pro-Table 文档: https://juejin.cn/post/7166068828202336263 -->\n\n<template>\n <div class=\"table-box\">\n <!-- 查询表单 -->\n <SearchForm v-show=\"isShowSearch\" :search=\"_search\" :reset=\"_reset\" :columns=\"searchColumns\" :search-param=\"searchParam\" :search-col=\"searchCol\" />\n\n <!-- 表格主体 -->\n <div :class=\"[onlyTable ? 'only-table' : 'card table-main']\">\n <!-- 表格头部 操作按钮 -->\n <div class=\"table-header\">\n <div class=\"header-button-lf\">\n <slot name=\"tableHeader\" :selected-list=\"selectedList\" :selected-list-ids=\"selectedListIds\" :is-selected=\"isSelected\"></slot>\n </div>\n <div v-if=\"toolButton\" class=\"header-button-ri\">\n <slot name=\"toolButton\">\n <el-button v-if=\"showToolButton('refresh')\" :icon=\"Refresh\" circle @click=\"getTableList\" />\n <el-button v-if=\"showToolButton('setting') && columns.length\" :icon=\"Operation\" circle @click=\"openColSetting\" />\n <el-button v-if=\"showToolButton('search') && searchColumns?.length\" :icon=\"Search\" circle @click=\"isShowSearch = !isShowSearch\" />\n </slot>\n </div>\n </div>\n <!-- 表格主体 -->\n <el-table\n ref=\"tableRef\"\n v-bind=\"$attrs\"\n :data=\"processTableData\"\n :border=\"border\"\n :id=\"uuid\"\n :row-key=\"rowKey\"\n :height=\"tableHeight\"\n v-loading=\"loading\"\n @selection-change=\"selectionChange\">\n <!-- 默认插槽 -->\n <slot></slot>\n <template v-for=\"item in tableColumns\" :key=\"item\">\n <!-- selection || radio || index || expand || sort -->\n <el-table-column\n v-if=\"item.type && columnTypes.includes(item.type)\"\n v-bind=\"item\"\n :selectable=\"(row: any) => (row.selectable != null && row.selectable != undefined ? row.selectable : true)\"\n :align=\"item.align ?? 'center'\"\n :reserve-selection=\"item.type == 'selection'\">\n <template #default=\"scope\">\n <!-- expand -->\n <template v-if=\"item.type == 'expand'\">\n <component :is=\"item.render\" v-bind=\"scope\" v-if=\"item.render\" />\n <slot v-else :name=\"item.type\" v-bind=\"scope\"></slot>\n </template>\n <!-- radio -->\n <el-radio v-if=\"item.type == 'radio'\" v-model=\"radio\" :label=\"scope.row[rowKey]\">\n <i></i>\n </el-radio>\n <!-- sort -->\n <el-tag v-if=\"item.type == 'sort'\" class=\"move\">\n <el-icon><DCaret /></el-icon>\n </el-tag>\n <!-- operationBtns -->\n <OperationBtns\n v-if=\"item.type == 'operationBtns'\"\n v-bind=\"item.props\"\n :row=\"scope.row\"\n @btn-click=\"handleOperateBtnsClick\" />\n </template>\n </el-table-column>\n <!-- other -->\n <TableColumn\n v-if=\"!item.type && item.prop && item.isShow && (!unref(isView) || (unref(isView) && item.isShowInView))\"\n :column=\"item\"\n :is-view=\"isView\">\n <template v-for=\"slot in Object.keys($slots)\" #[slot]=\"scope\">\n <slot :name=\"slot\" v-bind=\"scope\"></slot>\n </template>\n </TableColumn>\n </template>\n <!-- 插入表格最后一行之后的插槽 -->\n <template #append>\n <slot name=\"append\"></slot>\n </template>\n <!-- 无数据 -->\n <template #empty>\n <div class=\"table-empty\">\n <slot name=\"empty\">\n <img src=\"./assets/notData.png\" alt=\"notData\" />\n <div>暂无数据</div>\n </slot>\n </div>\n </template>\n </el-table>\n <!-- 分页组件 -->\n <slot name=\"pagination\">\n <Pagination v-if=\"pagination\" :pageable=\"pageable\" :handle-size-change=\"handleSizeChange\" :handle-current-change=\"handleCurrentChange\" />\n </slot>\n </div>\n <!-- 列设置 -->\n <ColSetting v-if=\"toolButton\" ref=\"colRef\" v-model:col-setting=\"colSetting\" @update-columns=\"updateTableColumns\">\n <!-- 传递列设置头部插槽 -->\n <template #colSettingHeader>\n <slot name=\"colSettingHeader\"></slot>\n </template>\n </ColSetting>\n </div>\n</template>\n\n<script setup lang=\"ts\" name=\"ZnTable\">\n import { computed, onMounted, provide, reactive, ref, toRaw, unref, watch, nextTick, getCurrentInstance } from 'vue'\n\n import ColSetting from './components/ColSetting.vue'\n import Pagination from './components/Pagination.vue'\n import TableColumn from './components/TableColumn.vue'\n import SearchForm from './components/SearchForm/index.vue'\n import OperationBtns from './components/OperationBtns/index.vue'\n\n import { BreakPoint } from './components/Grid/interface'\n import { ColumnProps, TypeProps, OperationBtnProps } from './interface'\n import { useSelection } from './hooks/useSelection'\n import { useTable } from './hooks/useTable'\n import { generateUUID, handleProp } from './utils'\n import { Operation, Refresh, Search, DCaret } from '@element-plus/icons-vue'\n import { ElTable } from 'element-plus'\n // import Sortable from 'sortablejs'\n import { useResizeObserver, useLocalStorage } from '@vueuse/core'\n defineOptions({\n name: 'ZnTable'\n })\n\n export interface ZnTableProps {\n columns: ColumnProps[] // 列配置项 ==> 必传\n data?: any[] // 静态 table data 数据,若存在则不会使用 requestApi 返回的 data ==> 非必传\n requestApi?: (params: any) => Promise<any> // 请求表格数据的 api ==> 非必传\n requestAuto?: boolean // 是否自动执行请求 api ==> 非必传(默认为true)\n requestError?: (params: any) => void // 表格 api 请求错误监听 ==> 非必传\n dataCallback?: (data: any) => any // 返回数据的回调函数,可以对数据进行处理 ==> 非必传\n title?: string // 表格标题 ==> 非必传\n pagination?: boolean // 是否需要分页组件 ==> 非必传(默认为true)\n initParam?: any // 初始化请求参数 ==> 非必传(默认为{})\n border?: boolean // 是否带有纵向边框 ==> 非必传(默认为true)\n toolButton?: ('refresh' | 'setting' | 'search')[] | boolean // 是否显示表格功能按钮 ==> 非必传(默认为true)\n rowKey?: string // 行数据的 Key,用来优化 Table 的渲染,当表格数据多选时,所指定的 id ==> 非必传(默认为 id)\n searchCol?: number | Record<BreakPoint, number> // 表格搜索项 每列占比配置 ==> 非必传 { xs: 1, sm: 2, md: 2, lg: 3, xl: 4 }\n height?: string | number // 表格高度,如果传了,则直接使用这个高度 未传则自动计算\n heightOffset?: number // 如果没传height,自动计算时,去除的高度\n minHeight?: string | number // 表格最小高度 ==> 非必传(默认为200)\n // hiddenTableHeader?: boolean // 隐藏表格头部\n onlyTable?: boolean // 只展示el-table部分\n isView?: boolean // 是否查看,默认为否\n searchFormShow?: boolean // 是否显示筛选行,默认为true\n }\n\n // 接受父组件参数,配置默认值\n const props = defineProps({\n columns: { type: Array, required: true, default: () => [] },\n data: { type: Array, required: false },\n requestApi: { type: Function, required: false },\n requestAuto: { type: Boolean, required: false, default: true },\n requestError: { type: Function, required: false },\n dataCallback: { type: Function, required: false },\n title: { type: String, required: false },\n pagination: { type: Boolean, required: false, default: true },\n initParam: { required: false, default: {} },\n border: { type: Boolean, required: false, default: true },\n toolButton: { type: [Array, Boolean], required: false, default: true },\n rowKey: { type: String, required: false, default: 'id' },\n searchCol: { type: [Number, Object], required: false, default: () => ({ xs: 1, sm: 2, md: 2, lg: 3, xl: 4 }) },\n height: { type: [String, Number], required: false },\n heightOffset: { type: Number, required: false, default: 0 },\n minHeight: { type: [String, Number], required: false, default: 200 },\n onlyTable: { type: Boolean, required: false, default: false },\n isView: { type: Boolean, required: false, default: false },\n searchFormShow: { type: Boolean, required: false, default: true }\n})\n\n // 在 setup 顶层获取组件实例,确保能正确获取\n const componentInstance = getCurrentInstance()\n\n const znygStore = useLocalStorage('znyg', { dictMap: {} })\n\n const bodyHeight = ref(0)\n useResizeObserver(document.body, (entries) => {\n const entry = entries[0]\n const { height } = entry.contentRect\n bodyHeight.value = height\n })\n // 计算表格高度\n const tableHeight = computed(() => {\n if (props.height) {\n return props.height\n }\n const ret = bodyHeight.value - 100 - (isShowSearch.value ? 120 : 40) - (props.pagination ? 150 : 0) - props.heightOffset\n // console.log(bodyHeight.value + '-' + 100 + '-' + (isShowSearch.value ? 120 : 0) + '-' + (props.pagination ? 70 : 0))\n // console.log('bodyHeight:' + bodyHeight.value, 'isShowSearch:' + (isShowSearch.value ? 80 : 0), 'ret:' + ret)\n \n // 确保返回的高度不小于最小高度\n const minHeightValue = typeof props.minHeight === 'number' ? props.minHeight : parseInt(props.minHeight.toString())\n return ret > minHeightValue ? ret : minHeightValue\n })\n\n // table 实例\n const tableRef = ref<InstanceType<typeof ElTable>>()\n\n // 生成组件唯一id\n const uuid = ref('id-' + generateUUID())\n\n /**\n * 特殊列配置管理\n * \n * 如何添加新的特殊列类型:\n * 1. 在 interface/index.ts 中的 TypeProps 类型中添加新的列类型\n * 2. 根据列的显示位置,将新类型添加到 FRONT_COLUMNS 或 BACK_COLUMNS 数组中\n * 3. 如果需要从列设置中排除特定的 prop,添加到 EXCLUDE_FROM_SETTING.props 中\n * 4. 在模板中添加对应的渲染逻辑\n * \n * 就这样!不需要在其他地方修改代码了。\n */\n const SPECIAL_COLUMN_CONFIG = {\n // 前置特殊列(显示在表格最前面)\n FRONT_COLUMNS: ['selection', 'radio', 'index', 'expand', 'sort'] as TypeProps[],\n // 后置特殊列(显示在表格最后面)\n BACK_COLUMNS: ['operationBtns'] as TypeProps[],\n // 需要从列设置中排除的列(除了特殊列类型,还可以包括特定的 prop)\n EXCLUDE_FROM_SETTING: {\n props: ['operation'], // 按 prop 排除\n types: [] as TypeProps[], // 按 type 排除(会自动包含所有特殊列类型)\n fixed: true // 排除固定列\n }\n }\n\n // 所有特殊列类型(合并前置和后置)\n const columnTypes: TypeProps[] = [...SPECIAL_COLUMN_CONFIG.FRONT_COLUMNS, ...SPECIAL_COLUMN_CONFIG.BACK_COLUMNS]\n\n // 判断是否为前置特殊列\n const isFrontSpecialColumn = (type?: TypeProps) => {\n return type && SPECIAL_COLUMN_CONFIG.FRONT_COLUMNS.includes(type)\n }\n\n // 判断是否为后置特殊列\n const isBackSpecialColumn = (type?: TypeProps) => {\n return type && SPECIAL_COLUMN_CONFIG.BACK_COLUMNS.includes(type)\n }\n\n // 判断是否应该从列设置中排除\n const shouldExcludeFromSetting = (column: ColumnProps) => {\n const { type, prop, fixed } = column\n \n // 排除所有特殊列类型\n if (type && columnTypes.includes(type)) return true\n \n // 排除指定的 prop\n if (prop && SPECIAL_COLUMN_CONFIG.EXCLUDE_FROM_SETTING.props.includes(prop)) return true\n \n // 排除固定列\n if (SPECIAL_COLUMN_CONFIG.EXCLUDE_FROM_SETTING.fixed && fixed) return true\n \n return false\n }\n\n // 是否显示搜索模块\n const isShowSearch = ref(props.searchFormShow)\n\n // 控制 ToolButton 显示\n const showToolButton = (key: 'refresh' | 'setting' | 'search') => {\n return Array.isArray(props.toolButton) ? props.toolButton.includes(key) : props.toolButton\n }\n\n // 单选值\n const radio = ref('')\n\n // 表格多选 Hooks\n const { selectionChange, selectedList, selectedListIds, isSelected } = useSelection(props.rowKey)\n\n // 表格操作 Hooks\n const { tableData, pageable, searchParam, searchInitParam, getTableList, search, reset, handleSizeChange, handleCurrentChange, loading } = useTable(\n props.requestApi,\n props.initParam,\n props.pagination,\n props.dataCallback,\n props.requestError\n )\n\n // 清空选中数据列表\n const clearSelection = () => {\n if (!tableRef.value) return\n tableRef.value!.clearSelection()\n }\n // 初始化表格数据 && 拖拽排序\n onMounted(() => {\n // dragSort()\n props.requestAuto && getTableList()\n props.data && (pageable.value.total = props.data.length)\n })\n\n // 处理表格数据\n const processTableData = computed(() => {\n if (!props.data) return tableData.value\n if (!props.pagination) return props.data\n // return props.data.slice((pageable.value.pageNum - 1) * pageable.value.pageSize, pageable.value.pageSize * pageable.value.pageNum)\n // todo 处理当使用静态tableData数据,表格在拖拽排序后,hover进入默认样式问题\n const rawData = toRaw(props.data)\n let slicedData = rawData.slice((pageable.value.pageNum - 1) * pageable.value.pageSize, pageable.value.pageSize * pageable.value.pageNum)\n\n const reactiveData = reactive(slicedData)\n return reactiveData\n })\n\n // 监听页面 initParam 改化,重新获取表格数据\n watch(() => props.initParam, getTableList, { deep: true })\n\n // 接收 columns 并设置为响应式\n let tableColumns = reactive<ColumnProps[]>(props.columns)\n\n // 扁平化 columns\n const flatColumns = computed(() => flatColumnsFunc(tableColumns))\n\n // 定义 enumMap 存储 enum 值(避免异步请求无法格式化单元格内容 || 无法填充搜索下拉选择)\n const enumMap = ref(new Map<string, { [key: string]: any }[]>())\n const setEnumMap = async ({ prop, enum: enumValue, dictCode }: ColumnProps) => {\n if (dictCode) {\n // let znygStore = globalThis.localStorage.getItem('znyg')\n // if (znygStore) znygStore = JSON.parse(znygStore)\n if (znygStore && znygStore.value?.dictMap) {\n enumMap.value.set(prop!, znygStore.value.dictMap[dictCode] ?? [])\n return\n }\n }\n if (!enumValue) return\n\n // 如果当前 enumMap 存在相同的值 return\n if (enumMap.value.has(prop!) && (typeof enumValue === 'function' || enumMap.value.get(prop!) === enumValue)) return\n\n // 当前 enum 为静态数据,则直接存储到 enumMap\n if (typeof enumValue !== 'function') return enumMap.value.set(prop!, unref(enumValue!))\n\n // 为了防止接口执行慢,而存储慢,导致重复请求,所以预先存储为[],接口返回后再二次存储\n enumMap.value.set(prop!, [])\n\n // 当前 enum 为后台数据需要请求数据,则调用该请求接口,并存储到 enumMap\n // const { data } = await enumValue()\n // 如果当前 enum 为后台数据需要请求数据,则调用该请求接口,并存储到 enumMap\n let data = await enumValue()\n // 适配 enum 接口返回 data 以及自定义函数返回数组\n data = data?.result || data\n enumMap.value.set(prop!, data)\n }\n // 注入 enumMap\n provide('enumMap', enumMap)\n\n // 扁平化 columns 的方法\n const flatColumnsFunc = (columns: ColumnProps[], flatArr: ColumnProps[] = []) => {\n columns.forEach(async (col) => {\n if (col._children?.length) flatArr.push(...flatColumnsFunc(col._children))\n flatArr.push(col)\n\n // column 添加默认 isShow && isFilterEnum 属性值\n col.isShow = col.isShow ?? true\n col.isShowInView = col.isShowInView ?? true\n col.isFilterEnum = col.isFilterEnum ?? true\n\n // 设置 enumMap\n await setEnumMap(col)\n })\n return flatArr.filter((item) => !item._children?.length)\n }\n\n // 过滤需要搜索的配置项 && 排序\n const searchColumns = computed(() => {\n return flatColumns.value?.filter((item) => item.search?.el || item.search?.render).sort((a, b) => a.search!.order! - b.search!.order!)\n })\n\n // 设置 搜索表单默认排序 && 搜索表单项的默认值\n searchColumns.value?.forEach((column, index) => {\n column.search!.order = column.search?.order ?? index + 2\n const key = column.search?.key ?? handleProp(column.prop!)\n const defaultValue = column.search?.defaultValue\n if (defaultValue !== undefined && defaultValue !== null) {\n searchInitParam.value[key] = defaultValue\n searchParam.value[key] = defaultValue\n }\n })\n\n // 列设置\n const colRef = ref()\n const colSetting = ref<ColumnProps[]>([])\n\n // 初始化列设置数据\n const initColSetting = () => {\n colSetting.value = tableColumns.filter((item) => !shouldExcludeFromSetting(item))\n }\n\n // 初始化时设置列配置\n initColSetting()\n\n // 手动更新表格列顺序的函数\n const updateTableColumns = (newColSetting: ColumnProps[]) => {\n // console.log('updateTableColumns调用:', {\n // hasNewColSetting: !!newColSetting,\n // newColSettingLength: Array.isArray(newColSetting) ? newColSetting.length : 'not array',\n // currentTableColumnsLength: tableColumns.length\n // })\n\n // console.log('组件实例状态:', {\n // hasInstance: !!componentInstance,\n // isUnmounted: componentInstance?.isUnmounted\n // })\n\n if (!componentInstance || componentInstance.isUnmounted) {\n console.warn('组件已销毁,跳过列更新')\n return\n }\n\n try {\n // 安全检查\n if (!newColSetting || !Array.isArray(newColSetting) || newColSetting.length === 0) {\n console.warn('updateTableColumns: 无效的列设置数据', {\n hasNewColSetting: !!newColSetting,\n isArray: Array.isArray(newColSetting),\n length: newColSetting?.length\n })\n return\n }\n\n // console.log('开始处理列设置数据')\n\n // 深拷贝输入数据,避免响应式问题\n let clonedColSetting: ColumnProps[]\n try {\n clonedColSetting = JSON.parse(JSON.stringify(newColSetting))\n // console.log('深拷贝成功')\n } catch (error) {\n console.warn('深拷贝列设置数据失败,使用浅拷贝')\n clonedColSetting = [...newColSetting]\n }\n\n // 创建一个映射,用于快速查找列配置\n const colMap = new Map()\n const currentColumns = [...tableColumns] // 创建当前列的副本\n\n currentColumns.forEach(col => {\n if (col && col.prop) {\n colMap.set(col.prop, col)\n }\n })\n\n // console.log('创建列映射完成:', {\n // colMapSize: colMap.size,\n // currentColumnsLength: currentColumns.length\n // })\n\n // 根据新的列设置顺序重新排列列\n const reorderedColumns: ColumnProps[] = []\n const processedProps = new Set()\n\n // 首先添加前置特殊列(selection, radio, index 等)\n currentColumns.forEach(col => {\n if (col && (isFrontSpecialColumn(col.type) || col.fixed === 'left')) {\n // console.log('添加前置特殊列:', { type: col.type, prop: col.prop, label: col.label })\n reorderedColumns.push(col)\n if (col.prop) {\n processedProps.add(col.prop)\n }\n }\n })\n\n // console.log('前置特殊列添加完成,当前列数:', reorderedColumns.length)\n\n // 然后添加按新顺序排列的普通列\n clonedColSetting.forEach(colSetting => {\n if (colSetting && colSetting.prop && colMap.has(colSetting.prop) && !processedProps.has(colSetting.prop)) {\n const originalCol = colMap.get(colSetting.prop)\n if (originalCol) {\n // console.log('添加普通列:', { prop: colSetting.prop, label: colSetting.label, isShow: colSetting.isShow })\n try {\n // 创建列的副本并更新属性\n const updatedCol = { ...originalCol }\n updatedCol.isShow = colSetting.isShow\n updatedCol.sortable = colSetting.sortable\n reorderedColumns.push(updatedCol)\n processedProps.add(colSetting.prop)\n } catch (error) {\n console.warn('更新列配置时出错:', error)\n // 如果更新失败,使用原始列\n reorderedColumns.push(originalCol)\n processedProps.add(colSetting.prop)\n }\n }\n }\n })\n\n // console.log('普通列添加完成,当前列数:', reorderedColumns.length)\n\n // 最后添加后置特殊列(如操作列、operationBtns、右侧固定列等)\n currentColumns.forEach(col => {\n if (col && (!col.prop || !processedProps.has(col.prop)) &&\n (isBackSpecialColumn(col.type) || (!columnTypes.includes(col.type!) && col.fixed !== 'left'))) {\n // console.log('添加后置特殊列:', { type: col.type, prop: col.prop, label: col.label })\n reorderedColumns.push(col)\n }\n })\n\n // console.log('列重排完成:', {\n // reorderedColumnsLength: reorderedColumns.length,\n // processedPropsSize: processedProps.size\n // })\n\n // 使用setTimeout而不是nextTick,确保在下一个事件循环中更新\n setTimeout(() => {\n // console.log('开始更新表格列,检查组件状态:', {\n // hasInstance: !!componentInstance,\n // isUnmounted: componentInstance?.isUnmounted\n // })\n\n if (!componentInstance || componentInstance.isUnmounted) {\n console.warn('延迟更新时组件已销毁')\n return\n }\n\n try {\n // console.log('执行表格列更新')\n // 简单直接的数组替换方法\n tableColumns.length = 0\n reorderedColumns.forEach(col => {\n if (col) {\n tableColumns.push(col as any)\n }\n })\n // console.log('表格列更新完成:', {\n // newLength: tableColumns.length\n // })\n } catch (error) {\n console.warn('更新表格列时出错:', error)\n }\n }, 50) // 50ms延迟\n } catch (error) {\n console.warn('updateTableColumns执行时出错:', error)\n }\n }\n\n const openColSetting = () => {\n // 直接打开列设置,不重新初始化以避免递归更新\n colRef.value.openColSetting()\n }\n\n // 定义 emit 事件\n const emit = defineEmits([\"search\", \"reset\", \"dragSort\", \"handleOperateBtnsClick\"])\n\n const _search = () => {\n search()\n emit('search')\n }\n\n const _reset = () => {\n reset()\n emit('reset')\n }\n\n // 处理操作按钮点击事件\n const handleOperateBtnsClick = (btnName: string, row: any, btn: OperationBtnProps) => {\n emit('handleOperateBtnsClick', btnName, row, btn)\n }\n\n // 拖拽排序 // ! 列表数据需要有id\n const dragSort = () => {\n // const tbody = document.querySelector(`#${uuid.value} tbody`) as HTMLElement\n // Sortable.create(tbody, {\n // handle: '.move',\n // animation: 300,\n // onEnd({ newIndex, oldIndex }) {\n // const [removedItem] = processTableData.value.splice(oldIndex!, 1)\n // processTableData.value.splice(newIndex!, 0, removedItem)\n // console.log('newIndex', newIndex, 'oldIndex', oldIndex)\n // emit('dragSort', { newIndex, oldIndex })\n // }\n // })\n }\n\n const refreshTable = () => {\n getTableList()\n }\n\n const setSearchFormShow = (show: boolean) => {\n isShowSearch.value = show\n }\n\n // 获取当前列配置\n const getColumns = () => {\n return tableColumns\n }\n\n // 获取当前列设置配置\n const getColSetting = () => {\n return colSetting.value\n }\n\n // 暴露给父组件的参数和方法 (外部需要什么,都可以从这里暴露出去)\n defineExpose({\n element: tableRef,\n tableData: processTableData,\n radio,\n pageable,\n searchParam,\n searchInitParam,\n getTableList,\n search,\n reset,\n handleSizeChange,\n handleCurrentChange,\n clearSelection,\n enumMap,\n isSelected,\n selectedList,\n selectedListIds,\n refreshTable,\n setSearchFormShow,\n getColumns,\n getColSetting\n })\n</script>\n"],"names":["props","__props","componentInstance","getCurrentInstance","znygStore","useLocalStorage","dictMap","bodyHeight","ref","useResizeObserver","document","body","entries","entry","height","contentRect","value","tableHeight","computed","ret","isShowSearch","pagination","heightOffset","minHeightValue","minHeight","parseInt","toString","tableRef","uuid","generateUUID","SPECIAL_COLUMN_CONFIG","FRONT_COLUMNS","BACK_COLUMNS","EXCLUDE_FROM_SETTING","types","fixed","columnTypes","isFrontSpecialColumn","type","includes","isBackSpecialColumn","shouldExcludeFromSetting","column","prop","searchFormShow","showToolButton","key","Array","isArray","toolButton","radio","selectionChange","selectedList","selectedListIds","isSelected","useSelection","rowKey","tableData","pageable","searchParam","searchInitParam","getTableList","search","reset","handleSizeChange","handleCurrentChange","loading","useTable","requestApi","initParam","dataCallback","requestError","clearSelection","__name","onMounted","requestAuto","data","total","length","processTableData","slicedData","toRaw","slice","pageNum","pageSize","reactive","watch","deep","tableColumns","columns","flatColumns","flatColumnsFunc","enumMap","Map","setEnumMap","async","enum","enumValue","dictCode","set","has","get","unref","result","provide","flatArr","forEach","col","_children","push","isShow","isShowInView","isFilterEnum","filter","item","searchColumns","el","render","sort","a","b","order","index","handleProp","defaultValue","colRef","colSetting","initColSetting","updateTableColumns","newColSetting","isUnmounted","console","warn","hasNewColSetting","clonedColSetting","JSON","parse","stringify","error","colMap","currentColumns","reorderedColumns","processedProps","Set","add","originalCol","updatedCol","sortable","setTimeout","openColSetting","emit","__emit","_search","_reset","handleOperateBtnsClick","btnName","row","btn","refreshTable","__expose","element","setSearchFormShow","show","getColumns","getColSetting"],"mappings":"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"}
|
|
1
|
+
{"version":3,"file":"index.vue2.mjs","sources":["../../../../../../packages/components/znTable/src/index.vue"],"sourcesContent":["<!-- 📚📚📚 Pro-Table 文档: https://juejin.cn/post/7166068828202336263 -->\n\n<template>\n <div class=\"table-box\">\n <!-- 查询表单 -->\n <SearchForm v-show=\"isShowSearch\" :search=\"_search\" :reset=\"_reset\" :columns=\"searchColumns\" :search-param=\"searchParam\" :search-col=\"searchCol\" />\n\n <!-- 表格主体 -->\n <div :class=\"[onlyTable ? 'only-table' : 'card table-main']\">\n <!-- 表格头部 操作按钮 -->\n <div class=\"table-header\">\n <div class=\"header-button-lf\">\n <slot name=\"tableHeader\" :selected-list=\"selectedList\" :selected-list-ids=\"selectedListIds\" :is-selected=\"isSelected\"></slot>\n </div>\n <div v-if=\"toolButton\" class=\"header-button-ri\">\n <slot name=\"toolButton\">\n <el-button v-if=\"showToolButton('refresh')\" :icon=\"Refresh\" circle @click=\"getTableList\" />\n <el-button v-if=\"showToolButton('setting') && columns.length\" :icon=\"Operation\" circle @click=\"openColSetting\" />\n <el-button v-if=\"showToolButton('search') && searchColumns?.length\" :icon=\"Search\" circle @click=\"isShowSearch = !isShowSearch\" />\n </slot>\n </div>\n </div>\n <!-- 表格主体 -->\n <el-table\n ref=\"tableRef\"\n v-bind=\"$attrs\"\n :data=\"processTableData\"\n :border=\"border\"\n :id=\"uuid\"\n :row-key=\"rowKey\"\n :height=\"tableHeight\"\n v-loading=\"loading\"\n @selection-change=\"selectionChange\">\n <!-- 默认插槽 -->\n <slot></slot>\n <template v-for=\"item in tableColumns\" :key=\"item\">\n <!-- selection || radio || index || expand || sort -->\n <el-table-column\n v-if=\"item.type && columnTypes.includes(item.type)\"\n v-bind=\"item\"\n :selectable=\"(row: any) => (row.selectable != null && row.selectable != undefined ? row.selectable : true)\"\n :align=\"item.align ?? 'center'\"\n :reserve-selection=\"item.type == 'selection'\">\n <template #default=\"scope\">\n <!-- expand -->\n <template v-if=\"item.type == 'expand'\">\n <component :is=\"item.render\" v-bind=\"scope\" v-if=\"item.render\" />\n <slot v-else :name=\"item.type\" v-bind=\"scope\"></slot>\n </template>\n <!-- radio -->\n <el-radio v-if=\"item.type == 'radio'\" v-model=\"radio\" :label=\"scope.row[rowKey]\">\n <i></i>\n </el-radio>\n <!-- sort -->\n <el-tag v-if=\"item.type == 'sort'\" class=\"move\">\n <el-icon><DCaret /></el-icon>\n </el-tag>\n <!-- operationBtns -->\n <OperationBtns\n v-if=\"item.type == 'operationBtns'\"\n v-bind=\"item.props\"\n :row=\"scope.row\"\n @btn-click=\"handleOperateBtnsClick\" />\n </template>\n </el-table-column>\n <!-- other -->\n <TableColumn\n v-if=\"!item.type && item.prop && item.isShow && (!unref(isView) || (unref(isView) && item.isShowInView))\"\n :column=\"item\"\n :is-view=\"isView\">\n <template v-for=\"slot in Object.keys($slots)\" #[slot]=\"scope\">\n <slot :name=\"slot\" v-bind=\"scope\"></slot>\n </template>\n </TableColumn>\n </template>\n <!-- 插入表格最后一行之后的插槽 -->\n <template #append>\n <slot name=\"append\"></slot>\n </template>\n <!-- 无数据 -->\n <template #empty>\n <div class=\"table-empty\">\n <slot name=\"empty\">\n <img src=\"./assets/notData.png\" alt=\"notData\" />\n <div>暂无数据</div>\n </slot>\n </div>\n </template>\n </el-table>\n <!-- 分页组件 -->\n <slot name=\"pagination\">\n <Pagination v-if=\"pagination\" :pageable=\"pageable\" :handle-size-change=\"handleSizeChange\" :handle-current-change=\"handleCurrentChange\" :page-size-options=\"pageSizeOptions\" />\n </slot>\n </div>\n <!-- 列设置 -->\n <ColSetting v-if=\"toolButton\" ref=\"colRef\" v-model:col-setting=\"colSetting\" @update-columns=\"updateTableColumns\">\n <!-- 传递列设置头部插槽 -->\n <template #colSettingHeader>\n <slot name=\"colSettingHeader\"></slot>\n </template>\n </ColSetting>\n </div>\n</template>\n\n<script setup lang=\"ts\" name=\"ZnTable\">\n import { computed, onMounted, provide, reactive, ref, toRaw, unref, watch, nextTick, getCurrentInstance } from 'vue'\n\n import ColSetting from './components/ColSetting.vue'\n import Pagination from './components/Pagination.vue'\n import TableColumn from './components/TableColumn.vue'\n import SearchForm from './components/SearchForm/index.vue'\n import OperationBtns from './components/OperationBtns/index.vue'\n\n import { BreakPoint } from './components/Grid/interface'\n import { ColumnProps, TypeProps, OperationBtnProps } from './interface'\n import { useSelection } from './hooks/useSelection'\n import { useTable } from './hooks/useTable'\n import { generateUUID, handleProp } from './utils'\n import { Operation, Refresh, Search, DCaret } from '@element-plus/icons-vue'\n import { ElTable } from 'element-plus'\n // import Sortable from 'sortablejs'\n import { useResizeObserver, useLocalStorage } from '@vueuse/core'\n defineOptions({\n name: 'ZnTable'\n })\n\n export interface ZnTableProps {\n columns: ColumnProps[] // 列配置项 ==> 必传\n data?: any[] // 静态 table data 数据,若存在则不会使用 requestApi 返回的 data ==> 非必传\n requestApi?: (params: any) => Promise<any> // 请求表格数据的 api ==> 非必传\n requestAuto?: boolean // 是否自动执行请求 api ==> 非必传(默认为true)\n requestError?: (params: any) => void // 表格 api 请求错误监听 ==> 非必传\n dataCallback?: (data: any) => any // 返回数据的回调函数,可以对数据进行处理 ==> 非必传\n title?: string // 表格标题 ==> 非必传\n pagination?: boolean // 是否需要分页组件 ==> 非必传(默认为true)\n pageSizeOptions?: number[] // 分页每页条数选项 ==> 非必传(默认为[10, 25, 50, 100])\n initParam?: any // 初始化请求参数 ==> 非必传(默认为{})\n border?: boolean // 是否带有纵向边框 ==> 非必传(默认为true)\n toolButton?: ('refresh' | 'setting' | 'search')[] | boolean // 是否显示表格功能按钮 ==> 非必传(默认为true)\n rowKey?: string // 行数据的 Key,用来优化 Table 的渲染,当表格数据多选时,所指定的 id ==> 非必传(默认为 id)\n searchCol?: number | Record<BreakPoint, number> // 表格搜索项 每列占比配置 ==> 非必传 { xs: 1, sm: 2, md: 2, lg: 3, xl: 4 }\n height?: string | number // 表格高度,如果传了,则直接使用这个高度 未传则自动计算\n heightOffset?: number // 如果没传height,自动计算时,去除的高度\n minHeight?: string | number // 表格最小高度 ==> 非必传(默认为200)\n // hiddenTableHeader?: boolean // 隐藏表格头部\n onlyTable?: boolean // 只展示el-table部分\n isView?: boolean // 是否查看,默认为否\n searchFormShow?: boolean // 是否显示筛选行,默认为true\n }\n\n // 接受父组件参数,配置默认值\n const props = defineProps({\n columns: { type: Array, required: true, default: () => [] },\n data: { type: Array, required: false },\n requestApi: { type: Function, required: false },\n requestAuto: { type: Boolean, required: false, default: true },\n requestError: { type: Function, required: false },\n dataCallback: { type: Function, required: false },\n title: { type: String, required: false },\n pagination: { type: Boolean, required: false, default: true },\n pageSizeOptions: { type: Array, required: false, default: () => [10, 25, 50, 100] },\n initParam: { required: false, default: {} },\n border: { type: Boolean, required: false, default: true },\n toolButton: { type: [Array, Boolean], required: false, default: true },\n rowKey: { type: String, required: false, default: 'id' },\n searchCol: { type: [Number, Object], required: false, default: () => ({ xs: 1, sm: 2, md: 2, lg: 3, xl: 4 }) },\n height: { type: [String, Number], required: false },\n heightOffset: { type: Number, required: false, default: 0 },\n minHeight: { type: [String, Number], required: false, default: 200 },\n onlyTable: { type: Boolean, required: false, default: false },\n isView: { type: Boolean, required: false, default: false },\n searchFormShow: { type: Boolean, required: false, default: true }\n})\n\n // 在 setup 顶层获取组件实例,确保能正确获取\n const componentInstance = getCurrentInstance()\n\n const znygStore = useLocalStorage('znyg', { dictMap: {} })\n\n const bodyHeight = ref(0)\n useResizeObserver(document.body, (entries) => {\n const entry = entries[0]\n const { height } = entry.contentRect\n bodyHeight.value = height\n })\n // 计算表格高度\n const tableHeight = computed(() => {\n if (props.height) {\n return props.height\n }\n const ret = bodyHeight.value - 100 - (isShowSearch.value ? 120 : 40) - (props.pagination ? 150 : 0) - props.heightOffset\n // console.log(bodyHeight.value + '-' + 100 + '-' + (isShowSearch.value ? 120 : 0) + '-' + (props.pagination ? 70 : 0))\n // console.log('bodyHeight:' + bodyHeight.value, 'isShowSearch:' + (isShowSearch.value ? 80 : 0), 'ret:' + ret)\n \n // 确保返回的高度不小于最小高度\n const minHeightValue = typeof props.minHeight === 'number' ? props.minHeight : parseInt(props.minHeight.toString())\n return ret > minHeightValue ? ret : minHeightValue\n })\n\n // table 实例\n const tableRef = ref<InstanceType<typeof ElTable>>()\n\n // 生成组件唯一id\n const uuid = ref('id-' + generateUUID())\n\n /**\n * 特殊列配置管理\n * \n * 如何添加新的特殊列类型:\n * 1. 在 interface/index.ts 中的 TypeProps 类型中添加新的列类型\n * 2. 根据列的显示位置,将新类型添加到 FRONT_COLUMNS 或 BACK_COLUMNS 数组中\n * 3. 如果需要从列设置中排除特定的 prop,添加到 EXCLUDE_FROM_SETTING.props 中\n * 4. 在模板中添加对应的渲染逻辑\n * \n * 就这样!不需要在其他地方修改代码了。\n */\n const SPECIAL_COLUMN_CONFIG = {\n // 前置特殊列(显示在表格最前面)\n FRONT_COLUMNS: ['selection', 'radio', 'index', 'expand', 'sort'] as TypeProps[],\n // 后置特殊列(显示在表格最后面)\n BACK_COLUMNS: ['operationBtns'] as TypeProps[],\n // 需要从列设置中排除的列(除了特殊列类型,还可以包括特定的 prop)\n EXCLUDE_FROM_SETTING: {\n props: ['operation'], // 按 prop 排除\n types: [] as TypeProps[], // 按 type 排除(会自动包含所有特殊列类型)\n fixed: true // 排除固定列\n }\n }\n\n // 所有特殊列类型(合并前置和后置)\n const columnTypes: TypeProps[] = [...SPECIAL_COLUMN_CONFIG.FRONT_COLUMNS, ...SPECIAL_COLUMN_CONFIG.BACK_COLUMNS]\n\n // 判断是否为前置特殊列\n const isFrontSpecialColumn = (type?: TypeProps) => {\n return type && SPECIAL_COLUMN_CONFIG.FRONT_COLUMNS.includes(type)\n }\n\n // 判断是否为后置特殊列\n const isBackSpecialColumn = (type?: TypeProps) => {\n return type && SPECIAL_COLUMN_CONFIG.BACK_COLUMNS.includes(type)\n }\n\n // 判断是否应该从列设置中排除\n const shouldExcludeFromSetting = (column: ColumnProps) => {\n const { type, prop, fixed } = column\n \n // 排除所有特殊列类型\n if (type && columnTypes.includes(type)) return true\n \n // 排除指定的 prop\n if (prop && SPECIAL_COLUMN_CONFIG.EXCLUDE_FROM_SETTING.props.includes(prop)) return true\n \n // 排除固定列\n if (SPECIAL_COLUMN_CONFIG.EXCLUDE_FROM_SETTING.fixed && fixed) return true\n \n return false\n }\n\n // 是否显示搜索模块\n const isShowSearch = ref(props.searchFormShow)\n\n // 控制 ToolButton 显示\n const showToolButton = (key: 'refresh' | 'setting' | 'search') => {\n return Array.isArray(props.toolButton) ? props.toolButton.includes(key) : props.toolButton\n }\n\n // 单选值\n const radio = ref('')\n\n // 表格多选 Hooks\n const { selectionChange, selectedList, selectedListIds, isSelected } = useSelection(props.rowKey)\n\n // 表格操作 Hooks\n const { tableData, pageable, searchParam, searchInitParam, getTableList, search, reset, handleSizeChange, handleCurrentChange, loading } = useTable(\n props.requestApi,\n props.initParam,\n props.pagination,\n props.dataCallback,\n props.requestError\n )\n\n // 清空选中数据列表\n const clearSelection = () => {\n if (!tableRef.value) return\n tableRef.value!.clearSelection()\n }\n // 初始化表格数据 && 拖拽排序\n onMounted(() => {\n // dragSort()\n props.requestAuto && getTableList()\n props.data && (pageable.value.total = props.data.length)\n })\n\n // 处理表格数据\n const processTableData = computed(() => {\n if (!props.data) return tableData.value\n if (!props.pagination) return props.data\n // return props.data.slice((pageable.value.pageNum - 1) * pageable.value.pageSize, pageable.value.pageSize * pageable.value.pageNum)\n // todo 处理当使用静态tableData数据,表格在拖拽排序后,hover进入默认样式问题\n const rawData = toRaw(props.data)\n let slicedData = rawData.slice((pageable.value.pageNum - 1) * pageable.value.pageSize, pageable.value.pageSize * pageable.value.pageNum)\n\n const reactiveData = reactive(slicedData)\n return reactiveData\n })\n\n // 监听页面 initParam 改化,重新获取表格数据\n watch(() => props.initParam, getTableList, { deep: true })\n\n // 接收 columns 并设置为响应式\n let tableColumns = reactive<ColumnProps[]>(props.columns)\n\n // 扁平化 columns\n const flatColumns = computed(() => flatColumnsFunc(tableColumns))\n\n // 定义 enumMap 存储 enum 值(避免异步请求无法格式化单元格内容 || 无法填充搜索下拉选择)\n const enumMap = ref(new Map<string, { [key: string]: any }[]>())\n const setEnumMap = async ({ prop, enum: enumValue, dictCode }: ColumnProps) => {\n if (dictCode) {\n // let znygStore = globalThis.localStorage.getItem('znyg')\n // if (znygStore) znygStore = JSON.parse(znygStore)\n if (znygStore && znygStore.value?.dictMap) {\n enumMap.value.set(prop!, znygStore.value.dictMap[dictCode] ?? [])\n return\n }\n }\n if (!enumValue) return\n\n // 如果当前 enumMap 存在相同的值 return\n if (enumMap.value.has(prop!) && (typeof enumValue === 'function' || enumMap.value.get(prop!) === enumValue)) return\n\n // 当前 enum 为静态数据,则直接存储到 enumMap\n if (typeof enumValue !== 'function') return enumMap.value.set(prop!, unref(enumValue!))\n\n // 为了防止接口执行慢,而存储慢,导致重复请求,所以预先存储为[],接口返回后再二次存储\n enumMap.value.set(prop!, [])\n\n // 当前 enum 为后台数据需要请求数据,则调用该请求接口,并存储到 enumMap\n // const { data } = await enumValue()\n // 如果当前 enum 为后台数据需要请求数据,则调用该请求接口,并存储到 enumMap\n let data = await enumValue()\n // 适配 enum 接口返回 data 以及自定义函数返回数组\n data = data?.result || data\n enumMap.value.set(prop!, data)\n }\n // 注入 enumMap\n provide('enumMap', enumMap)\n\n // 扁平化 columns 的方法\n const flatColumnsFunc = (columns: ColumnProps[], flatArr: ColumnProps[] = []) => {\n columns.forEach(async (col) => {\n if (col._children?.length) flatArr.push(...flatColumnsFunc(col._children))\n flatArr.push(col)\n\n // column 添加默认 isShow && isFilterEnum 属性值\n col.isShow = col.isShow ?? true\n col.isShowInView = col.isShowInView ?? true\n col.isFilterEnum = col.isFilterEnum ?? true\n\n // 设置 enumMap\n await setEnumMap(col)\n })\n return flatArr.filter((item) => !item._children?.length)\n }\n\n // 过滤需要搜索的配置项 && 排序\n const searchColumns = computed(() => {\n return flatColumns.value?.filter((item) => item.search?.el || item.search?.render).sort((a, b) => a.search!.order! - b.search!.order!)\n })\n\n // 设置 搜索表单默认排序 && 搜索表单项的默认值\n searchColumns.value?.forEach((column, index) => {\n column.search!.order = column.search?.order ?? index + 2\n const key = column.search?.key ?? handleProp(column.prop!)\n const defaultValue = column.search?.defaultValue\n if (defaultValue !== undefined && defaultValue !== null) {\n searchInitParam.value[key] = defaultValue\n searchParam.value[key] = defaultValue\n }\n })\n\n // 列设置\n const colRef = ref()\n const colSetting = ref<ColumnProps[]>([])\n\n // 初始化列设置数据\n const initColSetting = () => {\n colSetting.value = tableColumns.filter((item) => !shouldExcludeFromSetting(item))\n }\n\n // 初始化时设置列配置\n initColSetting()\n\n // 手动更新表格列顺序的函数\n const updateTableColumns = (newColSetting: ColumnProps[]) => {\n // console.log('updateTableColumns调用:', {\n // hasNewColSetting: !!newColSetting,\n // newColSettingLength: Array.isArray(newColSetting) ? newColSetting.length : 'not array',\n // currentTableColumnsLength: tableColumns.length\n // })\n\n // console.log('组件实例状态:', {\n // hasInstance: !!componentInstance,\n // isUnmounted: componentInstance?.isUnmounted\n // })\n\n if (!componentInstance || componentInstance.isUnmounted) {\n console.warn('组件已销毁,跳过列更新')\n return\n }\n\n try {\n // 安全检查\n if (!newColSetting || !Array.isArray(newColSetting) || newColSetting.length === 0) {\n console.warn('updateTableColumns: 无效的列设置数据', {\n hasNewColSetting: !!newColSetting,\n isArray: Array.isArray(newColSetting),\n length: newColSetting?.length\n })\n return\n }\n\n // console.log('开始处理列设置数据')\n\n // 深拷贝输入数据,避免响应式问题\n let clonedColSetting: ColumnProps[]\n try {\n clonedColSetting = JSON.parse(JSON.stringify(newColSetting))\n // console.log('深拷贝成功')\n } catch (error) {\n console.warn('深拷贝列设置数据失败,使用浅拷贝')\n clonedColSetting = [...newColSetting]\n }\n\n // 创建一个映射,用于快速查找列配置\n const colMap = new Map()\n const currentColumns = [...tableColumns] // 创建当前列的副本\n\n currentColumns.forEach(col => {\n if (col && col.prop) {\n colMap.set(col.prop, col)\n }\n })\n\n // console.log('创建列映射完成:', {\n // colMapSize: colMap.size,\n // currentColumnsLength: currentColumns.length\n // })\n\n // 根据新的列设置顺序重新排列列\n const reorderedColumns: ColumnProps[] = []\n const processedProps = new Set()\n\n // 首先添加前置特殊列(selection, radio, index 等)\n currentColumns.forEach(col => {\n if (col && (isFrontSpecialColumn(col.type) || col.fixed === 'left')) {\n // console.log('添加前置特殊列:', { type: col.type, prop: col.prop, label: col.label })\n reorderedColumns.push(col)\n if (col.prop) {\n processedProps.add(col.prop)\n }\n }\n })\n\n // console.log('前置特殊列添加完成,当前列数:', reorderedColumns.length)\n\n // 然后添加按新顺序排列的普通列\n clonedColSetting.forEach(colSetting => {\n if (colSetting && colSetting.prop && colMap.has(colSetting.prop) && !processedProps.has(colSetting.prop)) {\n const originalCol = colMap.get(colSetting.prop)\n if (originalCol) {\n // console.log('添加普通列:', { prop: colSetting.prop, label: colSetting.label, isShow: colSetting.isShow })\n try {\n // 创建列的副本并更新属性\n const updatedCol = { ...originalCol }\n updatedCol.isShow = colSetting.isShow\n updatedCol.sortable = colSetting.sortable\n reorderedColumns.push(updatedCol)\n processedProps.add(colSetting.prop)\n } catch (error) {\n console.warn('更新列配置时出错:', error)\n // 如果更新失败,使用原始列\n reorderedColumns.push(originalCol)\n processedProps.add(colSetting.prop)\n }\n }\n }\n })\n\n // console.log('普通列添加完成,当前列数:', reorderedColumns.length)\n\n // 最后添加后置特殊列(如操作列、operationBtns、右侧固定列等)\n currentColumns.forEach(col => {\n if (col && (!col.prop || !processedProps.has(col.prop)) &&\n (isBackSpecialColumn(col.type) || (!columnTypes.includes(col.type!) && col.fixed !== 'left'))) {\n // console.log('添加后置特殊列:', { type: col.type, prop: col.prop, label: col.label })\n reorderedColumns.push(col)\n }\n })\n\n // console.log('列重排完成:', {\n // reorderedColumnsLength: reorderedColumns.length,\n // processedPropsSize: processedProps.size\n // })\n\n // 使用setTimeout而不是nextTick,确保在下一个事件循环中更新\n setTimeout(() => {\n // console.log('开始更新表格列,检查组件状态:', {\n // hasInstance: !!componentInstance,\n // isUnmounted: componentInstance?.isUnmounted\n // })\n\n if (!componentInstance || componentInstance.isUnmounted) {\n console.warn('延迟更新时组件已销毁')\n return\n }\n\n try {\n // console.log('执行表格列更新')\n // 简单直接的数组替换方法\n tableColumns.length = 0\n reorderedColumns.forEach(col => {\n if (col) {\n tableColumns.push(col as any)\n }\n })\n // console.log('表格列更新完成:', {\n // newLength: tableColumns.length\n // })\n } catch (error) {\n console.warn('更新表格列时出错:', error)\n }\n }, 50) // 50ms延迟\n } catch (error) {\n console.warn('updateTableColumns执行时出错:', error)\n }\n }\n\n const openColSetting = () => {\n // 直接打开列设置,不重新初始化以避免递归更新\n colRef.value.openColSetting()\n }\n\n // 定义 emit 事件\n const emit = defineEmits([\"search\", \"reset\", \"dragSort\", \"handleOperateBtnsClick\"])\n\n const _search = () => {\n search()\n emit('search')\n }\n\n const _reset = () => {\n reset()\n emit('reset')\n }\n\n // 处理操作按钮点击事件\n const handleOperateBtnsClick = (btnName: string, row: any, btn: OperationBtnProps) => {\n emit('handleOperateBtnsClick', btnName, row, btn)\n }\n\n // 拖拽排序 // ! 列表数据需要有id\n const dragSort = () => {\n // const tbody = document.querySelector(`#${uuid.value} tbody`) as HTMLElement\n // Sortable.create(tbody, {\n // handle: '.move',\n // animation: 300,\n // onEnd({ newIndex, oldIndex }) {\n // const [removedItem] = processTableData.value.splice(oldIndex!, 1)\n // processTableData.value.splice(newIndex!, 0, removedItem)\n // console.log('newIndex', newIndex, 'oldIndex', oldIndex)\n // emit('dragSort', { newIndex, oldIndex })\n // }\n // })\n }\n\n const refreshTable = () => {\n getTableList()\n }\n\n const setSearchFormShow = (show: boolean) => {\n isShowSearch.value = show\n }\n\n // 获取当前列配置\n const getColumns = () => {\n return tableColumns\n }\n\n // 获取当前列设置配置\n const getColSetting = () => {\n return colSetting.value\n }\n\n // 暴露给父组件的参数和方法 (外部需要什么,都可以从这里暴露出去)\n defineExpose({\n element: tableRef,\n tableData: processTableData,\n radio,\n pageable,\n searchParam,\n searchInitParam,\n getTableList,\n search,\n reset,\n handleSizeChange,\n handleCurrentChange,\n clearSelection,\n enumMap,\n isSelected,\n selectedList,\n selectedListIds,\n refreshTable,\n setSearchFormShow,\n getColumns,\n getColSetting\n })\n</script>\n"],"names":["props","__props","componentInstance","getCurrentInstance","znygStore","useLocalStorage","dictMap","bodyHeight","ref","useResizeObserver","document","body","entries","entry","height","contentRect","value","tableHeight","computed","ret","isShowSearch","pagination","heightOffset","minHeightValue","minHeight","parseInt","toString","tableRef","uuid","generateUUID","SPECIAL_COLUMN_CONFIG","FRONT_COLUMNS","BACK_COLUMNS","EXCLUDE_FROM_SETTING","types","fixed","columnTypes","isFrontSpecialColumn","type","includes","isBackSpecialColumn","shouldExcludeFromSetting","column","prop","searchFormShow","showToolButton","key","Array","isArray","toolButton","radio","selectionChange","selectedList","selectedListIds","isSelected","useSelection","rowKey","tableData","pageable","searchParam","searchInitParam","getTableList","search","reset","handleSizeChange","handleCurrentChange","loading","useTable","requestApi","initParam","dataCallback","requestError","clearSelection","__name","onMounted","requestAuto","data","total","length","processTableData","slicedData","toRaw","slice","pageNum","pageSize","reactive","watch","deep","tableColumns","columns","flatColumns","flatColumnsFunc","enumMap","Map","setEnumMap","async","enum","enumValue","dictCode","set","has","get","unref","result","provide","flatArr","forEach","col","_children","push","isShow","isShowInView","isFilterEnum","filter","item","searchColumns","el","render","sort","a","b","order","index","handleProp","defaultValue","colRef","colSetting","initColSetting","updateTableColumns","newColSetting","isUnmounted","console","warn","hasNewColSetting","clonedColSetting","JSON","parse","stringify","error","colMap","currentColumns","reorderedColumns","processedProps","Set","add","originalCol","updatedCol","sortable","setTimeout","openColSetting","emit","__emit","_search","_reset","handleOperateBtnsClick","btnName","row","btn","refreshTable","__expose","element","setSearchFormShow","show","getColumns","getColSetting"],"mappings":"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"}
|
|
@@ -2159,8 +2159,8 @@ export declare const ZnTreeFilter: import("../../types").SFCWithInstall<import("
|
|
|
2159
2159
|
id: string;
|
|
2160
2160
|
defaultExpandAll: boolean;
|
|
2161
2161
|
defaultValue: any;
|
|
2162
|
-
requestParams: any;
|
|
2163
2162
|
multiple: boolean;
|
|
2163
|
+
requestParams: any;
|
|
2164
2164
|
transformDataToTree: boolean;
|
|
2165
2165
|
defaultExpandKeys: any;
|
|
2166
2166
|
}, {}, {}, {}, string, import("vue").ComponentProvideOptions, true, {}, any>>;
|
|
@@ -2159,8 +2159,8 @@ declare const _default: import("vue").DefineComponent<import("vue").ExtractPropT
|
|
|
2159
2159
|
id: string;
|
|
2160
2160
|
defaultExpandAll: boolean;
|
|
2161
2161
|
defaultValue: any;
|
|
2162
|
-
requestParams: any;
|
|
2163
2162
|
multiple: boolean;
|
|
2163
|
+
requestParams: any;
|
|
2164
2164
|
transformDataToTree: boolean;
|
|
2165
2165
|
defaultExpandKeys: any;
|
|
2166
2166
|
}, {}, {}, {}, string, import("vue").ComponentProvideOptions, true, {}, any>;
|