cd-personselector 1.0.0
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/README.md +126 -0
- package/dist/index.d.ts +7 -0
- package/dist/index.js +1 -0
- package/dist/index.mjs +446 -0
- package/dist/src/PersonSelector.vue.d.ts +116 -0
- package/dist/src/types.d.ts +51 -0
- package/dist/style.css +1 -0
- package/package.json +48 -0
- package/src/PersonSelector.vue +819 -0
- package/src/types.ts +64 -0
|
@@ -0,0 +1,116 @@
|
|
|
1
|
+
interface User {
|
|
2
|
+
id: number | string;
|
|
3
|
+
name: string;
|
|
4
|
+
displayName?: string;
|
|
5
|
+
phone?: string;
|
|
6
|
+
email?: string;
|
|
7
|
+
position?: string;
|
|
8
|
+
department?: string;
|
|
9
|
+
isUser?: boolean;
|
|
10
|
+
[key: string]: any;
|
|
11
|
+
}
|
|
12
|
+
interface TreeNode {
|
|
13
|
+
id: number | string;
|
|
14
|
+
name: string;
|
|
15
|
+
children?: TreeNode[];
|
|
16
|
+
userCount?: number;
|
|
17
|
+
isUser?: boolean;
|
|
18
|
+
loaded?: boolean;
|
|
19
|
+
[key: string]: any;
|
|
20
|
+
}
|
|
21
|
+
interface Organization {
|
|
22
|
+
id: number | string;
|
|
23
|
+
name: string;
|
|
24
|
+
displayName?: string;
|
|
25
|
+
}
|
|
26
|
+
interface TabConfig {
|
|
27
|
+
key: string;
|
|
28
|
+
name: string;
|
|
29
|
+
icon?: string;
|
|
30
|
+
tree: TreeNode[];
|
|
31
|
+
}
|
|
32
|
+
interface Props {
|
|
33
|
+
visible: boolean;
|
|
34
|
+
tabs?: TabConfig[];
|
|
35
|
+
organizations?: Organization[];
|
|
36
|
+
modelValue?: (number | string)[];
|
|
37
|
+
dialogWidth?: string;
|
|
38
|
+
tips?: string;
|
|
39
|
+
showSearch?: boolean;
|
|
40
|
+
}
|
|
41
|
+
declare const _default: import('vue').DefineComponent<import('vue').ExtractPropTypes<__VLS_WithDefaults<__VLS_TypePropsToRuntimeProps<Props>, {
|
|
42
|
+
visible: boolean;
|
|
43
|
+
tabs: () => never[];
|
|
44
|
+
organizations: () => never[];
|
|
45
|
+
modelValue: () => never[];
|
|
46
|
+
dialogWidth: string;
|
|
47
|
+
tips: string;
|
|
48
|
+
showSearch: boolean;
|
|
49
|
+
}>>, {
|
|
50
|
+
clearSelection: () => void;
|
|
51
|
+
appendUsers: (tabKey: string, nodeId: number | string, users: User[]) => void;
|
|
52
|
+
}, {}, {}, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {
|
|
53
|
+
"update:visible": (value: boolean) => void;
|
|
54
|
+
"update:modelValue": (value: (string | number)[]) => void;
|
|
55
|
+
confirm: (items: any[]) => void;
|
|
56
|
+
"load-users": (params: {
|
|
57
|
+
tabKey: string;
|
|
58
|
+
nodeId: number | string;
|
|
59
|
+
node: any;
|
|
60
|
+
callback: (users: User[]) => void;
|
|
61
|
+
}) => void;
|
|
62
|
+
search: (params: {
|
|
63
|
+
keyword: string;
|
|
64
|
+
orgId?: number | string;
|
|
65
|
+
callback: (users: User[]) => void;
|
|
66
|
+
}) => void;
|
|
67
|
+
}, string, import('vue').PublicProps, Readonly<import('vue').ExtractPropTypes<__VLS_WithDefaults<__VLS_TypePropsToRuntimeProps<Props>, {
|
|
68
|
+
visible: boolean;
|
|
69
|
+
tabs: () => never[];
|
|
70
|
+
organizations: () => never[];
|
|
71
|
+
modelValue: () => never[];
|
|
72
|
+
dialogWidth: string;
|
|
73
|
+
tips: string;
|
|
74
|
+
showSearch: boolean;
|
|
75
|
+
}>>> & Readonly<{
|
|
76
|
+
"onUpdate:visible"?: ((value: boolean) => any) | undefined;
|
|
77
|
+
"onUpdate:modelValue"?: ((value: (string | number)[]) => any) | undefined;
|
|
78
|
+
onConfirm?: ((items: any[]) => any) | undefined;
|
|
79
|
+
"onLoad-users"?: ((params: {
|
|
80
|
+
tabKey: string;
|
|
81
|
+
nodeId: number | string;
|
|
82
|
+
node: any;
|
|
83
|
+
callback: (users: User[]) => void;
|
|
84
|
+
}) => any) | undefined;
|
|
85
|
+
onSearch?: ((params: {
|
|
86
|
+
keyword: string;
|
|
87
|
+
orgId?: number | string;
|
|
88
|
+
callback: (users: User[]) => void;
|
|
89
|
+
}) => any) | undefined;
|
|
90
|
+
}>, {
|
|
91
|
+
visible: boolean;
|
|
92
|
+
tabs: TabConfig[];
|
|
93
|
+
organizations: Organization[];
|
|
94
|
+
modelValue: (number | string)[];
|
|
95
|
+
dialogWidth: string;
|
|
96
|
+
tips: string;
|
|
97
|
+
showSearch: boolean;
|
|
98
|
+
}, {}, {}, {}, string, import('vue').ComponentProvideOptions, true, {}, any>;
|
|
99
|
+
export default _default;
|
|
100
|
+
type __VLS_NonUndefinedable<T> = T extends undefined ? never : T;
|
|
101
|
+
type __VLS_TypePropsToRuntimeProps<T> = {
|
|
102
|
+
[K in keyof T]-?: {} extends Pick<T, K> ? {
|
|
103
|
+
type: import('vue').PropType<__VLS_NonUndefinedable<T[K]>>;
|
|
104
|
+
} : {
|
|
105
|
+
type: import('vue').PropType<T[K]>;
|
|
106
|
+
required: true;
|
|
107
|
+
};
|
|
108
|
+
};
|
|
109
|
+
type __VLS_WithDefaults<P, D> = {
|
|
110
|
+
[K in keyof Pick<P, keyof P>]: K extends keyof D ? __VLS_Prettify<P[K] & {
|
|
111
|
+
default: D[K];
|
|
112
|
+
}> : P[K];
|
|
113
|
+
};
|
|
114
|
+
type __VLS_Prettify<T> = {
|
|
115
|
+
[K in keyof T]: T[K];
|
|
116
|
+
} & {};
|
|
@@ -0,0 +1,51 @@
|
|
|
1
|
+
export interface User {
|
|
2
|
+
id: number | string;
|
|
3
|
+
name: string;
|
|
4
|
+
displayName?: string;
|
|
5
|
+
phone?: string;
|
|
6
|
+
email?: string;
|
|
7
|
+
position?: string;
|
|
8
|
+
department?: string;
|
|
9
|
+
isUser?: boolean;
|
|
10
|
+
[key: string]: any;
|
|
11
|
+
}
|
|
12
|
+
export interface TreeNode {
|
|
13
|
+
id: number | string;
|
|
14
|
+
name: string;
|
|
15
|
+
children?: TreeNode[];
|
|
16
|
+
userCount?: number;
|
|
17
|
+
isUser?: boolean;
|
|
18
|
+
loaded?: boolean;
|
|
19
|
+
[key: string]: any;
|
|
20
|
+
}
|
|
21
|
+
export interface Organization {
|
|
22
|
+
id: number | string;
|
|
23
|
+
name: string;
|
|
24
|
+
displayName?: string;
|
|
25
|
+
}
|
|
26
|
+
export interface TabConfig {
|
|
27
|
+
key: string;
|
|
28
|
+
name: string;
|
|
29
|
+
icon?: string;
|
|
30
|
+
tree: TreeNode[];
|
|
31
|
+
}
|
|
32
|
+
export interface PersonSelectorProps {
|
|
33
|
+
visible: boolean;
|
|
34
|
+
tabs?: TabConfig[];
|
|
35
|
+
organizations?: Organization[];
|
|
36
|
+
modelValue?: (number | string)[];
|
|
37
|
+
dialogWidth?: string;
|
|
38
|
+
tips?: string;
|
|
39
|
+
showSearch?: boolean;
|
|
40
|
+
}
|
|
41
|
+
export interface LoadUsersParams {
|
|
42
|
+
tabKey: string;
|
|
43
|
+
nodeId: number | string;
|
|
44
|
+
node: any;
|
|
45
|
+
callback: (users: User[]) => void;
|
|
46
|
+
}
|
|
47
|
+
export interface SearchParams {
|
|
48
|
+
keyword: string;
|
|
49
|
+
orgId?: number | string;
|
|
50
|
+
callback: (users: User[]) => void;
|
|
51
|
+
}
|
package/dist/style.css
ADDED
|
@@ -0,0 +1 @@
|
|
|
1
|
+
.person-selector[data-v-210902ae]{display:flex;flex-direction:column;gap:16px;min-height:500px}.selector-tips[data-v-210902ae]{display:flex;align-items:center;gap:8px;padding:12px;background-color:#e8f4ff;border-radius:4px;font-size:13px;color:#0052d9}.search-area[data-v-210902ae]{display:flex;gap:12px;align-items:center}.search-area .org-select[data-v-210902ae]{flex-shrink:0}.search-area .search-input[data-v-210902ae]{flex:1}.content-area[data-v-210902ae]{display:flex;gap:0;height:450px;border:1px solid #dfe1e6;border-radius:4px;overflow:hidden}.tree-panel[data-v-210902ae]{width:480px;flex-shrink:0;border-right:1px solid #dfe1e6;display:flex;flex-direction:column;background-color:#fafafa}.tree-panel[data-v-210902ae] .t-tabs__nav-container{padding:0 8px;background-color:#fff}.tree-panel[data-v-210902ae] .t-tabs__content{flex:1;overflow:hidden}.tree-container[data-v-210902ae]{height:100%;overflow-y:auto;padding:8px}.tree-container[data-v-210902ae]::-webkit-scrollbar{width:6px}.tree-container[data-v-210902ae]::-webkit-scrollbar-track{background:#f1f1f1}.tree-container[data-v-210902ae]::-webkit-scrollbar-thumb{background:#c1c1c1;border-radius:3px}.tree-node-label[data-v-210902ae]{display:flex;align-items:center;gap:6px;font-size:14px;width:100%}[data-v-210902ae] .t-tree__label{flex:1}[data-v-210902ae] .t-checkbox__label{width:100%}.tree-node-label.is-user[data-v-210902ae]{font-size:13px;color:#666}.tree-node-label .user-count[data-v-210902ae]{color:#999;font-size:12px}.tree-node-label .load-users-btn[data-v-210902ae]{margin-left:auto;color:#0052d9;font-size:12px;flex-shrink:0}.empty-tree[data-v-210902ae]{display:flex;flex-direction:column;align-items:center;justify-content:center;padding:60px 20px;color:#999}.empty-tree p[data-v-210902ae]{margin-top:16px;font-size:14px}.search-results[data-v-210902ae]{display:flex;flex-direction:column;height:100%}.search-results-header[data-v-210902ae]{display:flex;justify-content:space-between;align-items:center;padding:12px 16px;background:#fff;border-bottom:1px solid #dfe1e6;font-weight:500}.search-loading[data-v-210902ae]{display:flex;flex-direction:column;align-items:center;justify-content:center;padding:60px 20px;gap:12px;color:#999}.empty-search[data-v-210902ae]{display:flex;flex-direction:column;align-items:center;justify-content:center;padding:60px 20px;color:#999}.empty-search p[data-v-210902ae]{margin-top:16px;font-size:14px}.search-result-list[data-v-210902ae]{flex:1;overflow-y:auto;padding:8px}.search-result-item[data-v-210902ae]{display:flex;align-items:center;gap:10px;padding:10px 12px;background:#fff;border-radius:4px;border:1px solid #e5e7eb;margin-bottom:8px;cursor:pointer;transition:all .2s}.search-result-item[data-v-210902ae]:hover{border-color:#0052d9;background:#f0f5ff}.search-result-item.is-selected[data-v-210902ae]{border-color:#0052d9;background:#e8f4ff}.search-result-item .user-avatar[data-v-210902ae]{width:36px;height:36px;border-radius:50%;background:linear-gradient(135deg,#667eea,#764ba2);display:flex;align-items:center;justify-content:center;color:#fff;flex-shrink:0}.search-result-item .user-details[data-v-210902ae]{flex:1;min-width:0}.search-result-item .user-name[data-v-210902ae]{font-size:14px;font-weight:500;color:#333;margin-bottom:4px}.search-result-item .user-meta[data-v-210902ae]{display:flex;flex-wrap:wrap;gap:6px;font-size:12px;color:#999}.search-result-item .user-meta span[data-v-210902ae]:before{content:"•";margin-right:4px}.search-result-item .user-meta span[data-v-210902ae]:first-child:before{display:none}.right-panel[data-v-210902ae]{flex:1;display:flex;flex-direction:column;overflow:hidden;background-color:#fafafa}.selected-header[data-v-210902ae]{display:flex;align-items:center;padding:12px 16px;border-bottom:1px solid #dfe1e6;background-color:#fff}.selected-header .header-title[data-v-210902ae]{font-weight:500;font-size:14px;color:#333}.selected-header .header-count[data-v-210902ae]{font-size:13px;color:#0052d9;font-weight:600;margin-left:8px;flex:1}.selected-list-container[data-v-210902ae]{flex:1;overflow-y:auto;padding:8px}.selected-list-container[data-v-210902ae]::-webkit-scrollbar{width:6px}.selected-list-container[data-v-210902ae]::-webkit-scrollbar-track{background:#f1f1f1}.selected-list-container[data-v-210902ae]::-webkit-scrollbar-thumb{background:#c1c1c1;border-radius:3px}.empty-selected[data-v-210902ae]{display:flex;flex-direction:column;align-items:center;justify-content:center;padding:60px 20px;color:#999}.empty-selected p[data-v-210902ae]{margin-top:16px;font-size:14px}.selected-user-list[data-v-210902ae]{display:flex;flex-direction:column;gap:8px}.selected-user-item[data-v-210902ae]{display:flex;align-items:center;justify-content:space-between;padding:10px 12px;background:#fff;border-radius:4px;border:1px solid #e5e7eb;transition:all .2s}.selected-user-item[data-v-210902ae]:hover{border-color:#0052d9;box-shadow:0 2px 4px #0052d91a}.selected-user-item .user-info[data-v-210902ae]{flex:1;min-width:0;display:flex;align-items:center;gap:10px}.user-avatar[data-v-210902ae]{width:32px;height:32px;border-radius:50%;background:#667eea;display:flex;align-items:center;justify-content:center;color:#fff;font-size:16px;flex-shrink:0}.dept-avatar[data-v-210902ae]{background:linear-gradient(135deg,#f5af19,#f12711)}.selected-dept-item[data-v-210902ae]{border-color:#f5af19}.selected-user-item .user-details[data-v-210902ae]{flex:1;min-width:0}.selected-user-item .user-name[data-v-210902ae]{font-size:13px;font-weight:500;color:#333;margin-bottom:4px}.selected-user-item .user-meta[data-v-210902ae]{display:flex;flex-wrap:wrap;gap:6px;font-size:11px;color:#999}.selected-user-item .user-meta span[data-v-210902ae]:before{content:"•";margin-right:4px}.selected-user-item .user-meta span[data-v-210902ae]:first-child:before{display:none}
|
package/package.json
ADDED
|
@@ -0,0 +1,48 @@
|
|
|
1
|
+
{
|
|
2
|
+
"name": "cd-personselector",
|
|
3
|
+
"version": "1.0.0",
|
|
4
|
+
"description": "人员选择器组件 - 支持多Tab、树形结构、搜索、懒加载",
|
|
5
|
+
"main": "dist/index.js",
|
|
6
|
+
"module": "dist/index.mjs",
|
|
7
|
+
"types": "dist/index.d.ts",
|
|
8
|
+
"type": "module",
|
|
9
|
+
"exports": {
|
|
10
|
+
".": {
|
|
11
|
+
"import": "./dist/index.mjs",
|
|
12
|
+
"require": "./dist/index.js",
|
|
13
|
+
"types": "./dist/index.d.ts"
|
|
14
|
+
},
|
|
15
|
+
"./style.css": "./dist/style.css"
|
|
16
|
+
},
|
|
17
|
+
"files": [
|
|
18
|
+
"dist",
|
|
19
|
+
"src"
|
|
20
|
+
],
|
|
21
|
+
"scripts": {
|
|
22
|
+
"build": "vite build",
|
|
23
|
+
"prepublishOnly": "npm run build"
|
|
24
|
+
},
|
|
25
|
+
"keywords": [
|
|
26
|
+
"vue",
|
|
27
|
+
"vue3",
|
|
28
|
+
"person-selector",
|
|
29
|
+
"tdesign",
|
|
30
|
+
"组织架构",
|
|
31
|
+
"人员选择"
|
|
32
|
+
],
|
|
33
|
+
"author": "",
|
|
34
|
+
"license": "MIT",
|
|
35
|
+
"peerDependencies": {
|
|
36
|
+
"vue": "^3.0.0",
|
|
37
|
+
"tdesign-vue-next": "^1.0.0"
|
|
38
|
+
},
|
|
39
|
+
"devDependencies": {
|
|
40
|
+
"@vitejs/plugin-vue": "^5.0.0",
|
|
41
|
+
"tdesign-vue-next": "^1.9.0",
|
|
42
|
+
"typescript": "^5.0.0",
|
|
43
|
+
"vite": "^5.0.0",
|
|
44
|
+
"vite-plugin-dts": "^3.0.0",
|
|
45
|
+
"vue": "^3.4.0",
|
|
46
|
+
"vue-tsc": "^2.0.0"
|
|
47
|
+
}
|
|
48
|
+
}
|