@cgboiler/biz-mobile 1.17.7 → 1.17.9
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/index.d.ts +1 -1
- package/es/index.js +1 -1
- package/es/org-picker/OrgPicker.js +52 -105
- package/es/org-picker/_atomic.css +27 -1
- package/es/org-picker/index.css +1 -1
- package/es/org-picker/index.less +2 -0
- package/es/org-picker/types.d.ts +0 -1
- package/es/org-picker/useApi.d.ts +16 -2
- package/es/org-picker/useApi.js +24 -13
- package/es/org-picker/useSearch.d.ts +11 -0
- package/es/org-picker/useSearch.js +137 -0
- package/lib/index.d.ts +1 -1
- package/lib/index.js +1 -1
- package/lib/org-picker/OrgPicker.js +50 -103
- package/lib/org-picker/_atomic.css +27 -1
- package/lib/org-picker/index.css +1 -1
- package/lib/org-picker/index.less +2 -0
- package/lib/org-picker/types.d.ts +0 -1
- package/lib/org-picker/useApi.d.ts +16 -2
- package/lib/org-picker/useApi.js +23 -12
- package/lib/org-picker/useSearch.d.ts +11 -0
- package/lib/org-picker/useSearch.js +156 -0
- package/package.json +1 -1
package/es/index.d.ts
CHANGED
|
@@ -7,7 +7,7 @@ declare namespace _default {
|
|
|
7
7
|
}
|
|
8
8
|
export default _default;
|
|
9
9
|
export function install(app: any): void;
|
|
10
|
-
export const version: "1.17.
|
|
10
|
+
export const version: "1.17.8";
|
|
11
11
|
import MdPreview from './md-preview';
|
|
12
12
|
import OrgPicker from './org-picker';
|
|
13
13
|
import ProjectSelect from './project-select';
|
package/es/index.js
CHANGED
|
@@ -1,32 +1,12 @@
|
|
|
1
|
-
var __async = (__this, __arguments, generator) => {
|
|
2
|
-
return new Promise((resolve, reject) => {
|
|
3
|
-
var fulfilled = (value) => {
|
|
4
|
-
try {
|
|
5
|
-
step(generator.next(value));
|
|
6
|
-
} catch (e) {
|
|
7
|
-
reject(e);
|
|
8
|
-
}
|
|
9
|
-
};
|
|
10
|
-
var rejected = (value) => {
|
|
11
|
-
try {
|
|
12
|
-
step(generator.throw(value));
|
|
13
|
-
} catch (e) {
|
|
14
|
-
reject(e);
|
|
15
|
-
}
|
|
16
|
-
};
|
|
17
|
-
var step = (x) => x.done ? resolve(x.value) : Promise.resolve(x.value).then(fulfilled, rejected);
|
|
18
|
-
step((generator = generator.apply(__this, __arguments)).next());
|
|
19
|
-
});
|
|
20
|
-
};
|
|
21
1
|
import { createVNode as _createVNode, createTextVNode as _createTextVNode, Fragment as _Fragment } from "vue";
|
|
22
2
|
import "./_atomic.css";
|
|
23
|
-
import { defineComponent, ref, computed, watch
|
|
24
|
-
import { ActionSheet, Search, List, Image, Empty, Tabs, Tab } from "vant";
|
|
3
|
+
import { defineComponent, ref, computed, watch } from "vue";
|
|
4
|
+
import { ActionSheet, Search, List, Image, Empty, Tabs, Tab, Icon } from "vant";
|
|
25
5
|
import DeptImg from "./components/DeptImg";
|
|
26
6
|
import { orgPickerProps } from "./types";
|
|
27
7
|
import { useApi } from "./useApi";
|
|
28
8
|
import "./index.css";
|
|
29
|
-
import {
|
|
9
|
+
import { useSearch } from "./useSearch";
|
|
30
10
|
var stdin_default = defineComponent({
|
|
31
11
|
name: "OrgPicker",
|
|
32
12
|
props: orgPickerProps,
|
|
@@ -34,19 +14,30 @@ var stdin_default = defineComponent({
|
|
|
34
14
|
setup(props, {
|
|
35
15
|
emit
|
|
36
16
|
}) {
|
|
17
|
+
const api = useApi();
|
|
37
18
|
const {
|
|
38
|
-
orgList,
|
|
39
19
|
getOrgList,
|
|
40
|
-
|
|
20
|
+
orgList,
|
|
41
21
|
deptPath,
|
|
42
|
-
|
|
43
|
-
|
|
44
|
-
getRecentSelectedUsers,
|
|
45
|
-
setRecentSelectedUsers
|
|
46
|
-
} = useApi();
|
|
22
|
+
userList
|
|
23
|
+
} = api;
|
|
47
24
|
getOrgList();
|
|
48
25
|
const activeTab = ref("zjxz");
|
|
26
|
+
const {
|
|
27
|
+
keyword,
|
|
28
|
+
searchRef,
|
|
29
|
+
recentSelectedHistory,
|
|
30
|
+
setRecentUsers,
|
|
31
|
+
handleDeleteHistorySelect,
|
|
32
|
+
highlightText,
|
|
33
|
+
renderSearchResult
|
|
34
|
+
} = useSearch(props, api);
|
|
49
35
|
const selectedItems = ref([]);
|
|
36
|
+
const sortOrgList = computed(() => {
|
|
37
|
+
const departments = orgList.value.filter((item) => item.type === "dept");
|
|
38
|
+
const personnel = orgList.value.filter((item) => item.type !== "dept");
|
|
39
|
+
return [...personnel, ...departments];
|
|
40
|
+
});
|
|
50
41
|
watch(() => props.modelValue, (newValue) => {
|
|
51
42
|
var _a;
|
|
52
43
|
if (!newValue) {
|
|
@@ -77,7 +68,7 @@ var stdin_default = defineComponent({
|
|
|
77
68
|
selectedItems.value = [item];
|
|
78
69
|
emit("update:modelValue", [item.id]);
|
|
79
70
|
emit("update:show", false);
|
|
80
|
-
|
|
71
|
+
setRecentUsers(selectedItems.value);
|
|
81
72
|
}
|
|
82
73
|
};
|
|
83
74
|
const handleHistorySelect = (item) => {
|
|
@@ -86,67 +77,11 @@ var stdin_default = defineComponent({
|
|
|
86
77
|
const handleConfirm = () => {
|
|
87
78
|
emit("update:show", false);
|
|
88
79
|
emit("update:modelValue", selectedItems.value.map((item) => item.id));
|
|
89
|
-
|
|
80
|
+
setRecentUsers(selectedItems.value);
|
|
90
81
|
};
|
|
91
|
-
const keyword = ref("");
|
|
92
|
-
const loading = ref(false);
|
|
93
|
-
const finished = ref(true);
|
|
94
|
-
const searchRef = ref();
|
|
95
|
-
const recentSelectedHistory = ref([]);
|
|
96
|
-
const filterRecentSelectedHistory = ref([]);
|
|
97
|
-
watchEffect(() => {
|
|
98
|
-
if (activeTab.value === "zjxz") {
|
|
99
|
-
recentSelectedHistory.value = getRecentSelectedUsers();
|
|
100
|
-
}
|
|
101
|
-
});
|
|
102
|
-
watchEffect(() => {
|
|
103
|
-
if (activeTab.value === "zjxz") {
|
|
104
|
-
if (keyword.value) {
|
|
105
|
-
filterRecentSelectedHistory.value = recentSelectedHistory.value.filter((item) => item.selectedUsers.some((user) => keyword.value.split("").some((char) => user.name.includes(char))));
|
|
106
|
-
} else {
|
|
107
|
-
filterRecentSelectedHistory.value = recentSelectedHistory.value;
|
|
108
|
-
}
|
|
109
|
-
}
|
|
110
|
-
});
|
|
111
|
-
watch(() => props.show, (newVal) => __async(this, null, function* () {
|
|
112
|
-
if (newVal && props.autoFocus) {
|
|
113
|
-
yield nextTick();
|
|
114
|
-
setTimeout(() => {
|
|
115
|
-
var _a;
|
|
116
|
-
(_a = searchRef.value) == null ? void 0 : _a.focus();
|
|
117
|
-
}, 300);
|
|
118
|
-
}
|
|
119
|
-
}));
|
|
120
|
-
watch(keyword, (newKeyword) => {
|
|
121
|
-
if (newKeyword) {
|
|
122
|
-
searchOrgList(newKeyword);
|
|
123
|
-
} else {
|
|
124
|
-
getOrgList(currentDeptId.value);
|
|
125
|
-
}
|
|
126
|
-
});
|
|
127
|
-
const filteredOrgList = computed(() => {
|
|
128
|
-
if (keyword.value) {
|
|
129
|
-
return orgList.value;
|
|
130
|
-
}
|
|
131
|
-
const departments = orgList.value.filter((item) => item.type === "dept");
|
|
132
|
-
const personnel = orgList.value.filter((item) => item.type !== "dept");
|
|
133
|
-
return [...personnel, ...departments];
|
|
134
|
-
});
|
|
135
82
|
const isSelected = (item) => {
|
|
136
83
|
return selectedItems.value.some((s) => s.id === item.id);
|
|
137
84
|
};
|
|
138
|
-
const onLoad = () => {
|
|
139
|
-
finished.value = true;
|
|
140
|
-
};
|
|
141
|
-
const highlightText = (text, keyword2) => {
|
|
142
|
-
if (!keyword2) {
|
|
143
|
-
return text;
|
|
144
|
-
}
|
|
145
|
-
const keywordChars = keyword2.split("");
|
|
146
|
-
return Array.from(text).map((char, index) => keywordChars.some((kChar) => char.toLowerCase() === kChar.toLowerCase()) ? h("span", {
|
|
147
|
-
class: "highlight"
|
|
148
|
-
}, char) : char);
|
|
149
|
-
};
|
|
150
85
|
return () => _createVNode(ActionSheet, {
|
|
151
86
|
"show": props.show,
|
|
152
87
|
"onUpdate:show": (val) => emit("update:show", val),
|
|
@@ -174,28 +109,40 @@ var stdin_default = defineComponent({
|
|
|
174
109
|
"class": "close-icon"
|
|
175
110
|
}, [_createTextVNode("X")])])) : _createVNode("p", {
|
|
176
111
|
"class": "color-[#aaa] text-[14px] text-center w-full leading-[38px]"
|
|
177
|
-
}, [_createTextVNode("\u672A\u9009\u62E9\u4EBA\u5458")])]), _createVNode(
|
|
112
|
+
}, [_createTextVNode("\u672A\u9009\u62E9\u4EBA\u5458")])]), _createVNode("div", {
|
|
113
|
+
"class": "flex-1 flex flex-col overflow-hidden relative"
|
|
114
|
+
}, [_createVNode(Tabs, {
|
|
178
115
|
"active": activeTab.value,
|
|
179
116
|
"onUpdate:active": ($event) => activeTab.value = $event
|
|
180
117
|
}, {
|
|
181
118
|
default: () => [_createVNode(Tab, {
|
|
182
|
-
"title": "\u6700\u8FD1\u9009\u62E9",
|
|
183
|
-
"name": "zjxz"
|
|
184
|
-
}, null), _createVNode(Tab, {
|
|
185
119
|
"title": "\u901A\u8BAF\u5F55",
|
|
186
120
|
"name": "txl"
|
|
121
|
+
}, null), _createVNode(Tab, {
|
|
122
|
+
"title": "\u6700\u8FD1\u9009\u62E9",
|
|
123
|
+
"name": "zjxz"
|
|
187
124
|
}, null)]
|
|
188
125
|
}), _createVNode("div", {
|
|
189
126
|
"class": "org-content-wrap"
|
|
190
127
|
}, [activeTab.value === "zjxz" ? _createVNode("div", {
|
|
191
128
|
"class": "recent-list-wrap flex-1 overflow-auto px-[16px] py-[8px]"
|
|
192
|
-
}, [
|
|
129
|
+
}, [recentSelectedHistory.value.length === 0 ? _createVNode(Empty, {
|
|
193
130
|
"description": "\u6682\u65E0\u6700\u8FD1\u9009\u62E9\u8BB0\u5F55"
|
|
194
|
-
}, null) :
|
|
131
|
+
}, null) : recentSelectedHistory.value.map((historyItem) => _createVNode("div", {
|
|
195
132
|
"key": historyItem.id,
|
|
196
133
|
"onClick": () => handleHistorySelect(historyItem),
|
|
197
|
-
"class": "
|
|
198
|
-
}, [_createVNode("span",
|
|
134
|
+
"class": "py-8px border-b border-[#eee] flex items-center"
|
|
135
|
+
}, [_createVNode("span", {
|
|
136
|
+
"class": "flex-1"
|
|
137
|
+
}, [historyItem.selectedUsers.map((user) => highlightText(user.name, keyword.value)).reduce((prev, curr) => [prev, "\uFF0C", curr])]), _createVNode("span", {
|
|
138
|
+
"class": "p-4px pl-2",
|
|
139
|
+
"onClick": (e) => {
|
|
140
|
+
e.stopPropagation();
|
|
141
|
+
handleDeleteHistorySelect(historyItem);
|
|
142
|
+
}
|
|
143
|
+
}, [_createVNode(Icon, {
|
|
144
|
+
"name": "delete-o"
|
|
145
|
+
}, null)])]))]) : _createVNode(_Fragment, null, [_createVNode("div", {
|
|
199
146
|
"class": "breadcrumb-nav"
|
|
200
147
|
}, [deptPath.value.map((dept, index) => _createVNode("span", {
|
|
201
148
|
"key": dept.id
|
|
@@ -209,14 +156,10 @@ var stdin_default = defineComponent({
|
|
|
209
156
|
"class": "separator"
|
|
210
157
|
}, [_createTextVNode(" / ")])]))]), _createVNode("div", {
|
|
211
158
|
"class": "feed-list-wrap"
|
|
212
|
-
}, [
|
|
213
|
-
"description":
|
|
214
|
-
}, null) : _createVNode(List, {
|
|
215
|
-
|
|
216
|
-
"finished": finished.value,
|
|
217
|
-
"onLoad": onLoad
|
|
218
|
-
}, {
|
|
219
|
-
default: () => [filteredOrgList.value.map((item) => _createVNode("div", {
|
|
159
|
+
}, [sortOrgList.value.length === 0 ? _createVNode(Empty, {
|
|
160
|
+
"description": "\u8BE5\u90E8\u95E8\u4E0B\u6CA1\u6709\u4EBA\u5458"
|
|
161
|
+
}, null) : _createVNode(List, null, {
|
|
162
|
+
default: () => [sortOrgList.value.map((item) => _createVNode("div", {
|
|
220
163
|
"class": ["org-item", isSelected(item) ? "selected" : ""],
|
|
221
164
|
"onClick": () => handleSelect(item)
|
|
222
165
|
}, [item.type === "dept" && !keyword.value ? _createVNode("div", {
|
|
@@ -229,7 +172,11 @@ var stdin_default = defineComponent({
|
|
|
229
172
|
}, [item.name, _createVNode("span", {
|
|
230
173
|
"class": "org-item-select-icon"
|
|
231
174
|
}, [_createTextVNode("\u2713")])])]))]
|
|
232
|
-
})])])]),
|
|
175
|
+
})])])]), keyword.value && renderSearchResult({
|
|
176
|
+
handleHistorySelect,
|
|
177
|
+
isSelected,
|
|
178
|
+
handleSelect
|
|
179
|
+
})]), props.multiple && _createVNode("div", {
|
|
233
180
|
"class": "bottom-section"
|
|
234
181
|
}, [_createVNode("div", {
|
|
235
182
|
"class": "action-buttons"
|
|
@@ -31,15 +31,41 @@
|
|
|
31
31
|
}
|
|
32
32
|
|
|
33
33
|
/* layer: default */
|
|
34
|
-
.cgx-atm .
|
|
34
|
+
.cgx-atm .absolute{position:absolute;}
|
|
35
|
+
.cgx-atm .bottom-0{bottom:0rem;}
|
|
36
|
+
.cgx-atm .left-0{left:0rem;}
|
|
37
|
+
.cgx-atm .right-0{right:0rem;}
|
|
38
|
+
.cgx-atm .top-0{top:0rem;}
|
|
39
|
+
.cgx-atm .z-1{z-index:1;}
|
|
35
40
|
.cgx-atm .flex-1{flex:1 1 0%;}
|
|
36
41
|
.cgx-atm .overflow-auto{overflow:auto;}
|
|
37
42
|
.cgx-atm .border-b{border-bottom-width:1px;border-bottom-style:solid;}
|
|
38
43
|
.cgx-atm .border-\[\#eee\]{--un-border-opacity:1;border-color:rgba(238,238,238,var(--un-border-opacity));}
|
|
44
|
+
.cgx-atm .bg-\[\#fff\]{--un-bg-opacity:1;background-color:rgba(255,255,255,var(--un-bg-opacity));}
|
|
39
45
|
.cgx-atm .px-\[16px\],
|
|
40
46
|
.cgx-atm .px-16px{padding-left:16px;padding-right:16px;}
|
|
47
|
+
.cgx-atm .py-\[12px\]{padding-top:12px;padding-bottom:12px;}
|
|
48
|
+
.cgx-atm .py-\[8px\],
|
|
49
|
+
.cgx-atm .py-8px{padding-top:8px;padding-bottom:8px;}
|
|
50
|
+
.cgx-atm .text-\[14px\]{font-size:14px;}
|
|
51
|
+
.cgx-atm .font-bold{font-weight:700;}
|
|
52
|
+
.cgx-atm .text-\[\#333\]{--un-text-opacity:1;color:rgba(51,51,51,var(--un-text-opacity));}
|
|
53
|
+
/* layer: default */
|
|
54
|
+
.cgx-atm .relative{position:relative;}
|
|
55
|
+
.cgx-atm .w-full{width:100%;}
|
|
56
|
+
.cgx-atm .flex{display:flex;}
|
|
57
|
+
.cgx-atm .flex-1{flex:1 1 0%;}
|
|
58
|
+
.cgx-atm .flex-col{flex-direction:column;}
|
|
59
|
+
.cgx-atm .items-center{align-items:center;}
|
|
60
|
+
.cgx-atm .overflow-auto{overflow:auto;}
|
|
61
|
+
.cgx-atm .overflow-hidden{overflow:hidden;}
|
|
62
|
+
.cgx-atm .border-b{border-bottom-width:1px;border-bottom-style:solid;}
|
|
63
|
+
.cgx-atm .border-\[\#eee\]{--un-border-opacity:1;border-color:rgba(238,238,238,var(--un-border-opacity));}
|
|
64
|
+
.cgx-atm .p-4px{padding:4px;}
|
|
65
|
+
.cgx-atm .px-\[16px\]{padding-left:16px;padding-right:16px;}
|
|
41
66
|
.cgx-atm .py-\[8px\],
|
|
42
67
|
.cgx-atm .py-8px{padding-top:8px;padding-bottom:8px;}
|
|
68
|
+
.cgx-atm .pl-2{padding-left:0.5rem;}
|
|
43
69
|
.cgx-atm .text-center{text-align:center;}
|
|
44
70
|
.cgx-atm .text-\[14px\]{font-size:14px;}
|
|
45
71
|
.cgx-atm .leading-\[38px\]{line-height:38px;}
|
package/es/org-picker/index.css
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
:root:root{--van-action-sheet-max-height: 100%}.org-list{height:85vh;display:flex;flex-direction:column}.org-list .highlight{color:var(--van-primary-color);font-weight:700}.org-list .breadcrumb-nav{margin-bottom:4px;padding:2px 16px;border-radius:4px;font-size:12px}.org-list .breadcrumb-nav .dept-name.current-dept{color:#969799}.org-list .breadcrumb-nav .separator{color:#969799;margin:0 4px}.org-list .search-bar{position:-webkit-sticky;position:-webkit-sticky;position:sticky;top:0;z-index:1}.org-list .org-selected-items{display:flex;flex-wrap:nowrap;padding:12px 16px;gap:12px;background-color:#fff;overflow-x:auto;height:68px;border-bottom:1px solid #eee}.org-list .org-selected-items .selected-tag{flex-shrink:0;background:none;border:none;padding:0;margin:0;position:relative}.org-list .org-selected-items .selected-tag .close-icon{position:absolute;top:0;right:0;z-index:1;background-color:#fff;border-radius:50%;border:1px solid #eee;width:10px;height:10px;display:flex;align-items:center;justify-content:center;font-size:6px;color:#969799}.org-list .org-selected-items .selected-tag .tag-avatar{width:40px;height:40px}.org-list .org-selected-items .selected-tag .tag-avatar img{border-radius:4px;border:1px solid #eee;object-fit:contain}.org-list .bottom-section{border-top:1px solid #eee;background-color:#fff}.org-list .van-list{flex:1;overflow-y:auto;padding:0 16px}.org-list .org-content-wrap{flex:1;display:flex;flex-direction:column;overflow:hidden}.org-list .feed-list-wrap{flex:1;display:flex;overflow:hidden;position:relative;justify-content:center}.org-list .search-result-list{position:absolute;top:0;left:0;right:0;bottom:0;z-index:1;background-color:#fff;overflow-y:auto;padding:0 16px}.org-list .org-item{padding:12px 0;border-bottom:1px solid #eee;cursor:pointer;display:flex;align-items:center;gap:12px}.org-list .org-item .org-item-select-icon{display:none;padding-left:4px}.org-list .org-item.selected{color:var(--van-primary-color)}.org-list .org-item.selected .org-item-select-icon{display:inline}.org-list .org-item .org-avatar{flex-shrink:0;width:40px;height:40px;display:flex;align-items:center;justify-content:center}.org-list .org-item .org-avatar img{border-radius:4px;border:1px solid #eee;object-fit:contain}.org-list .org-item .org-name{font-size:14px;flex:1}.org-list .org-item:last-child{border-bottom:none}.org-list .action-buttons{padding:16px;display:flex;justify-content:center}.org-list .action-buttons .confirm-button{background-color:var(--van-primary-color);color:#fff;padding:10px 0;border-radius:4px;text-align:center;width:100%;font-size:14px}
|
|
1
|
+
:root:root{--van-action-sheet-max-height: 100%}.org-list{height:85vh;display:flex;flex-direction:column}.org-list .highlight{color:var(--van-primary-color);font-weight:700}.org-list .breadcrumb-nav{margin-bottom:4px;padding:2px 16px;border-radius:4px;font-size:12px}.org-list .breadcrumb-nav .dept-name.current-dept{color:#969799}.org-list .breadcrumb-nav .separator{color:#969799;margin:0 4px}.org-list .search-bar{position:-webkit-sticky;position:-webkit-sticky;position:sticky;top:0;z-index:1}.org-list .org-selected-items{display:flex;flex-wrap:nowrap;padding:12px 16px;gap:12px;background-color:#fff;overflow-x:auto;height:68px;border-bottom:1px solid #eee}.org-list .org-selected-items .selected-tag{flex-shrink:0;background:none;border:none;padding:0;margin:0;position:relative}.org-list .org-selected-items .selected-tag .close-icon{position:absolute;top:0;right:0;z-index:1;background-color:#fff;border-radius:50%;border:1px solid #eee;width:10px;height:10px;display:flex;align-items:center;justify-content:center;font-size:6px;color:#969799}.org-list .org-selected-items .selected-tag .tag-avatar{width:40px;height:40px}.org-list .org-selected-items .selected-tag .tag-avatar img{border-radius:4px;border:1px solid #eee;object-fit:contain}.org-list .bottom-section{border-top:1px solid #eee;background-color:#fff}.org-list .van-list{flex:1;overflow-y:auto;padding:0 16px}.org-list .org-content-wrap{flex:1;display:flex;flex-direction:column;overflow:hidden;position:relative;padding-top:4px}.org-list .feed-list-wrap{flex:1;display:flex;overflow:hidden;position:relative;justify-content:center}.org-list .search-result-list{position:absolute;top:0;left:0;right:0;bottom:0;z-index:1;background-color:#fff;overflow-y:auto;padding:0 16px}.org-list .org-item{padding:12px 0;border-bottom:1px solid #eee;cursor:pointer;display:flex;align-items:center;gap:12px}.org-list .org-item .org-item-select-icon{display:none;padding-left:4px}.org-list .org-item.selected{color:var(--van-primary-color)}.org-list .org-item.selected .org-item-select-icon{display:inline}.org-list .org-item .org-avatar{flex-shrink:0;width:40px;height:40px;display:flex;align-items:center;justify-content:center}.org-list .org-item .org-avatar img{border-radius:4px;border:1px solid #eee;object-fit:contain}.org-list .org-item .org-name{font-size:14px;flex:1}.org-list .org-item:last-child{border-bottom:none}.org-list .action-buttons{padding:16px;display:flex;justify-content:center}.org-list .action-buttons .confirm-button{background-color:var(--van-primary-color);color:#fff;padding:10px 0;border-radius:4px;text-align:center;width:100%;font-size:14px}
|
package/es/org-picker/index.less
CHANGED
package/es/org-picker/types.d.ts
CHANGED
|
@@ -27,6 +27,19 @@ export declare const useApi: () => {
|
|
|
27
27
|
type: string;
|
|
28
28
|
avatar?: string | undefined;
|
|
29
29
|
}[]>;
|
|
30
|
+
orgSearchList: Ref<{
|
|
31
|
+
[x: string]: any;
|
|
32
|
+
id: string | number;
|
|
33
|
+
name: string;
|
|
34
|
+
type: string;
|
|
35
|
+
avatar?: string | undefined;
|
|
36
|
+
}[], OrgItem[] | {
|
|
37
|
+
[x: string]: any;
|
|
38
|
+
id: string | number;
|
|
39
|
+
name: string;
|
|
40
|
+
type: string;
|
|
41
|
+
avatar?: string | undefined;
|
|
42
|
+
}[]>;
|
|
30
43
|
getOrgList: (deptId?: string) => Promise<void>;
|
|
31
44
|
currentDeptId: Ref<string, string>;
|
|
32
45
|
deptPath: Ref<{
|
|
@@ -39,7 +52,8 @@ export declare const useApi: () => {
|
|
|
39
52
|
id: string | number;
|
|
40
53
|
name: string;
|
|
41
54
|
}[]>;
|
|
55
|
+
deleteRecentSelectedUsers: (id: string) => Promise<void>;
|
|
42
56
|
searchOrgList: import("lodash-es").DebouncedFunc<(userName: string) => Promise<void>>;
|
|
43
|
-
getRecentSelectedUsers: () => RecentSelection[]
|
|
44
|
-
setRecentSelectedUsers: (users: OrgItem[]) => void
|
|
57
|
+
getRecentSelectedUsers: () => Promise<RecentSelection[]>;
|
|
58
|
+
setRecentSelectedUsers: (users: OrgItem[]) => Promise<void>;
|
|
45
59
|
};
|
package/es/org-picker/useApi.js
CHANGED
|
@@ -19,7 +19,7 @@ var __async = (__this, __arguments, generator) => {
|
|
|
19
19
|
});
|
|
20
20
|
};
|
|
21
21
|
import { ref } from "vue";
|
|
22
|
-
import { useFetch, getUserList } from "@cgboiler/core";
|
|
22
|
+
import { useFetch, getUserList, getStorage, setStorage } from "@cgboiler/core";
|
|
23
23
|
import { debounce } from "lodash-es";
|
|
24
24
|
const orgListCache = /* @__PURE__ */ new Map();
|
|
25
25
|
const fetchData = (url, cacheKey) => __async(void 0, null, function* () {
|
|
@@ -45,6 +45,7 @@ function initUserList() {
|
|
|
45
45
|
initUserList();
|
|
46
46
|
const useApi = () => {
|
|
47
47
|
const orgList = ref([]);
|
|
48
|
+
const orgSearchList = ref([]);
|
|
48
49
|
const currentDeptId = ref("1");
|
|
49
50
|
const deptPath = ref([{ id: "1", name: "\u5DDD\u9505\u516C\u53F8" }]);
|
|
50
51
|
const getOrgList = (deptId) => __async(void 0, null, function* () {
|
|
@@ -65,32 +66,31 @@ const useApi = () => {
|
|
|
65
66
|
});
|
|
66
67
|
const searchOrgList = debounce((userName) => __async(void 0, null, function* () {
|
|
67
68
|
if (!userName) {
|
|
68
|
-
|
|
69
|
+
orgSearchList.value = [];
|
|
69
70
|
return;
|
|
70
71
|
}
|
|
71
72
|
const url = `https://wflow.cgboiler.com/v1/oa/org/tree/user/search/cloud?userName=${userName}`;
|
|
72
|
-
|
|
73
|
+
orgSearchList.value = yield fetchData(url);
|
|
73
74
|
}), 300);
|
|
74
75
|
const RECENT_SELECTED_USERS_KEY = "recent_selected_users_history";
|
|
75
76
|
const MAX_RECENT_SELECTIONS = 15;
|
|
76
|
-
const getRecentSelectedUsers = () => {
|
|
77
|
+
const getRecentSelectedUsers = () => __async(void 0, null, function* () {
|
|
77
78
|
try {
|
|
78
|
-
const data =
|
|
79
|
-
return data
|
|
79
|
+
const data = yield getStorage(RECENT_SELECTED_USERS_KEY);
|
|
80
|
+
return data || [];
|
|
80
81
|
} catch (error) {
|
|
81
82
|
console.error("Failed to get recent selected users history from localStorage", error);
|
|
82
83
|
return [];
|
|
83
84
|
}
|
|
84
|
-
};
|
|
85
|
-
const setRecentSelectedUsers = (users) => {
|
|
85
|
+
});
|
|
86
|
+
const setRecentSelectedUsers = (users) => __async(void 0, null, function* () {
|
|
86
87
|
if (!users || users.length === 0)
|
|
87
88
|
return;
|
|
88
|
-
const history = getRecentSelectedUsers();
|
|
89
|
+
const history = yield getRecentSelectedUsers();
|
|
89
90
|
const newSelection = {
|
|
90
91
|
id: Date.now().toString(),
|
|
91
92
|
// 使用时间戳作为唯一ID
|
|
92
|
-
selectedUsers: users
|
|
93
|
-
timestamp: Date.now()
|
|
93
|
+
selectedUsers: users
|
|
94
94
|
};
|
|
95
95
|
const filteredHistory = history.filter((item) => {
|
|
96
96
|
return !(item.selectedUsers.length === newSelection.selectedUsers.length && item.selectedUsers.every(
|
|
@@ -99,17 +99,28 @@ const useApi = () => {
|
|
|
99
99
|
});
|
|
100
100
|
const updatedHistory = [newSelection, ...filteredHistory].slice(0, MAX_RECENT_SELECTIONS);
|
|
101
101
|
try {
|
|
102
|
-
|
|
102
|
+
yield setStorage(RECENT_SELECTED_USERS_KEY, JSON.parse(JSON.stringify(updatedHistory)));
|
|
103
103
|
} catch (error) {
|
|
104
104
|
console.error("Failed to set recent selected users history to localStorage", error);
|
|
105
105
|
}
|
|
106
|
-
};
|
|
106
|
+
});
|
|
107
|
+
const deleteRecentSelectedUsers = (id) => __async(void 0, null, function* () {
|
|
108
|
+
const history = yield getRecentSelectedUsers();
|
|
109
|
+
const updatedHistory = history.filter((item) => item.id !== id);
|
|
110
|
+
try {
|
|
111
|
+
yield setStorage(RECENT_SELECTED_USERS_KEY, JSON.parse(JSON.stringify(updatedHistory)));
|
|
112
|
+
} catch (error) {
|
|
113
|
+
console.error("Failed to delete recent selected users history to localStorage", error);
|
|
114
|
+
}
|
|
115
|
+
});
|
|
107
116
|
return {
|
|
108
117
|
userList,
|
|
109
118
|
orgList,
|
|
119
|
+
orgSearchList,
|
|
110
120
|
getOrgList,
|
|
111
121
|
currentDeptId,
|
|
112
122
|
deptPath,
|
|
123
|
+
deleteRecentSelectedUsers,
|
|
113
124
|
searchOrgList,
|
|
114
125
|
getRecentSelectedUsers,
|
|
115
126
|
setRecentSelectedUsers
|
|
@@ -0,0 +1,11 @@
|
|
|
1
|
+
export declare function useSearch(props: any, api: any): {
|
|
2
|
+
keyword: import("vue").Ref<string, string>;
|
|
3
|
+
searchRef: import("vue").Ref<any, any>;
|
|
4
|
+
setRecentUsers: (users: any[]) => Promise<void>;
|
|
5
|
+
renderSearchResult: ({ handleHistorySelect, isSelected, handleSelect }: any) => import("vue/jsx-runtime").JSX.Element;
|
|
6
|
+
handleDeleteHistorySelect: (item: any) => Promise<void>;
|
|
7
|
+
filteredOrgList: import("vue").ComputedRef<any>;
|
|
8
|
+
recentSelectedHistory: import("vue").Ref<any[], any[]>;
|
|
9
|
+
filterRecentSelectedHistory: import("vue").Ref<any[], any[]>;
|
|
10
|
+
highlightText: (text: string, keyword: string) => string | (string | import("vue/jsx-runtime").JSX.Element)[];
|
|
11
|
+
};
|
|
@@ -0,0 +1,137 @@
|
|
|
1
|
+
var __async = (__this, __arguments, generator) => {
|
|
2
|
+
return new Promise((resolve, reject) => {
|
|
3
|
+
var fulfilled = (value) => {
|
|
4
|
+
try {
|
|
5
|
+
step(generator.next(value));
|
|
6
|
+
} catch (e) {
|
|
7
|
+
reject(e);
|
|
8
|
+
}
|
|
9
|
+
};
|
|
10
|
+
var rejected = (value) => {
|
|
11
|
+
try {
|
|
12
|
+
step(generator.throw(value));
|
|
13
|
+
} catch (e) {
|
|
14
|
+
reject(e);
|
|
15
|
+
}
|
|
16
|
+
};
|
|
17
|
+
var step = (x) => x.done ? resolve(x.value) : Promise.resolve(x.value).then(fulfilled, rejected);
|
|
18
|
+
step((generator = generator.apply(__this, __arguments)).next());
|
|
19
|
+
});
|
|
20
|
+
};
|
|
21
|
+
import { createVNode as _createVNode, Fragment as _Fragment, createTextVNode as _createTextVNode } from "vue";
|
|
22
|
+
import "./_atomic.css";
|
|
23
|
+
import { ref, computed, watch, watchEffect, nextTick } from "vue";
|
|
24
|
+
import { Empty, List, Image } from "vant";
|
|
25
|
+
function useSearch(props, api) {
|
|
26
|
+
const {
|
|
27
|
+
orgSearchList,
|
|
28
|
+
getOrgList,
|
|
29
|
+
currentDeptId,
|
|
30
|
+
searchOrgList,
|
|
31
|
+
setRecentSelectedUsers,
|
|
32
|
+
deleteRecentSelectedUsers,
|
|
33
|
+
getRecentSelectedUsers
|
|
34
|
+
} = api;
|
|
35
|
+
const keyword = ref("");
|
|
36
|
+
const searchRef = ref();
|
|
37
|
+
const recentSelectedHistory = ref([]);
|
|
38
|
+
const filterRecentSelectedHistory = ref([]);
|
|
39
|
+
watchEffect(() => __async(this, null, function* () {
|
|
40
|
+
recentSelectedHistory.value = yield getRecentSelectedUsers();
|
|
41
|
+
}));
|
|
42
|
+
const setRecentUsers = (users) => __async(this, null, function* () {
|
|
43
|
+
yield setRecentSelectedUsers(users);
|
|
44
|
+
recentSelectedHistory.value = yield getRecentSelectedUsers();
|
|
45
|
+
});
|
|
46
|
+
const handleDeleteHistorySelect = (item) => __async(this, null, function* () {
|
|
47
|
+
yield deleteRecentSelectedUsers(item.id);
|
|
48
|
+
recentSelectedHistory.value = yield getRecentSelectedUsers();
|
|
49
|
+
});
|
|
50
|
+
watchEffect(() => {
|
|
51
|
+
if (keyword.value) {
|
|
52
|
+
filterRecentSelectedHistory.value = recentSelectedHistory.value.filter((item) => item.selectedUsers.some((user) => keyword.value.split("").some((char) => user.name.includes(char))));
|
|
53
|
+
} else {
|
|
54
|
+
filterRecentSelectedHistory.value = recentSelectedHistory.value;
|
|
55
|
+
}
|
|
56
|
+
});
|
|
57
|
+
watch(() => props.show, (newVal) => __async(this, null, function* () {
|
|
58
|
+
if (newVal && props.autoFocus) {
|
|
59
|
+
yield nextTick();
|
|
60
|
+
setTimeout(() => {
|
|
61
|
+
var _a;
|
|
62
|
+
(_a = searchRef.value) == null ? void 0 : _a.focus();
|
|
63
|
+
}, 300);
|
|
64
|
+
}
|
|
65
|
+
}));
|
|
66
|
+
watch(keyword, (newKeyword) => {
|
|
67
|
+
if (newKeyword) {
|
|
68
|
+
searchOrgList(newKeyword);
|
|
69
|
+
} else {
|
|
70
|
+
getOrgList(currentDeptId.value);
|
|
71
|
+
}
|
|
72
|
+
});
|
|
73
|
+
const filteredOrgList = computed(() => {
|
|
74
|
+
if (keyword.value) {
|
|
75
|
+
return orgSearchList.value;
|
|
76
|
+
}
|
|
77
|
+
return [];
|
|
78
|
+
});
|
|
79
|
+
const highlightText = (text, keyword2) => {
|
|
80
|
+
if (!keyword2) {
|
|
81
|
+
return text;
|
|
82
|
+
}
|
|
83
|
+
const keywordChars = keyword2.split("");
|
|
84
|
+
return Array.from(text).map((char, index) => keywordChars.some((kChar) => char.toLowerCase() === kChar.toLowerCase()) ? _createVNode("span", {
|
|
85
|
+
"class": "highlight"
|
|
86
|
+
}, [char]) : char);
|
|
87
|
+
};
|
|
88
|
+
const renderSearchResult = ({
|
|
89
|
+
handleHistorySelect,
|
|
90
|
+
isSelected,
|
|
91
|
+
handleSelect
|
|
92
|
+
}) => {
|
|
93
|
+
return _createVNode("div", {
|
|
94
|
+
"class": "absolute top-0 left-0 right-0 bottom-0 bg-[#fff] z-1"
|
|
95
|
+
}, [filterRecentSelectedHistory.value.length ? _createVNode(_Fragment, null, [_createVNode("p", {
|
|
96
|
+
"class": "text-[14px] text-[#333] font-bold px-[16px] py-[12px] border-b border-[#eee]"
|
|
97
|
+
}, [_createTextVNode("\u6700\u8FD1\u9009\u62E9")]), _createVNode("div", {
|
|
98
|
+
"class": "recent-list-wrap flex-1 overflow-auto py-[8px]"
|
|
99
|
+
}, [filterRecentSelectedHistory.value.map((historyItem) => _createVNode("div", {
|
|
100
|
+
"key": historyItem.id,
|
|
101
|
+
"onClick": () => handleHistorySelect(historyItem),
|
|
102
|
+
"class": "px-16px py-8px border-b border-[#eee]"
|
|
103
|
+
}, [_createVNode("span", null, [historyItem.selectedUsers.map((user) => highlightText(user.name, keyword.value)).reduce((prev, curr) => [prev, "\uFF0C", curr])])]))])]) : "", filteredOrgList.value.length ? _createVNode(_Fragment, null, [" ", _createVNode("p", {
|
|
104
|
+
"class": "text-[14px] text-[#333] font-bold px-[16px] py-[12px] border-b border-[#eee]"
|
|
105
|
+
}, [_createTextVNode("\u901A\u8BAF\u5F55")]), _createVNode("div", {
|
|
106
|
+
"class": "feed-list-wrap"
|
|
107
|
+
}, [filteredOrgList.value.length === 0 ? _createVNode(Empty, {
|
|
108
|
+
"description": "\u672A\u627E\u5230\u76F8\u5173\u4EBA\u5458"
|
|
109
|
+
}, null) : _createVNode(List, null, {
|
|
110
|
+
default: () => [filteredOrgList.value.map((item) => _createVNode("div", {
|
|
111
|
+
"class": ["org-item", isSelected(item) ? "selected" : ""],
|
|
112
|
+
"onClick": () => handleSelect(item)
|
|
113
|
+
}, [_createVNode(Image, {
|
|
114
|
+
"class": "org-avatar",
|
|
115
|
+
"src": item.avatar
|
|
116
|
+
}, null), _createVNode("div", {
|
|
117
|
+
"class": "org-name"
|
|
118
|
+
}, [item.name, _createVNode("span", {
|
|
119
|
+
"class": "org-item-select-icon"
|
|
120
|
+
}, [_createTextVNode("\u2713")])])]))]
|
|
121
|
+
})])]) : ""]);
|
|
122
|
+
};
|
|
123
|
+
return {
|
|
124
|
+
keyword,
|
|
125
|
+
searchRef,
|
|
126
|
+
setRecentUsers,
|
|
127
|
+
renderSearchResult,
|
|
128
|
+
handleDeleteHistorySelect,
|
|
129
|
+
filteredOrgList,
|
|
130
|
+
recentSelectedHistory,
|
|
131
|
+
filterRecentSelectedHistory,
|
|
132
|
+
highlightText
|
|
133
|
+
};
|
|
134
|
+
}
|
|
135
|
+
export {
|
|
136
|
+
useSearch
|
|
137
|
+
};
|
package/lib/index.d.ts
CHANGED
|
@@ -7,7 +7,7 @@ declare namespace _default {
|
|
|
7
7
|
}
|
|
8
8
|
export default _default;
|
|
9
9
|
export function install(app: any): void;
|
|
10
|
-
export const version: "1.17.
|
|
10
|
+
export const version: "1.17.8";
|
|
11
11
|
import MdPreview from './md-preview';
|
|
12
12
|
import OrgPicker from './org-picker';
|
|
13
13
|
import ProjectSelect from './project-select';
|
package/lib/index.js
CHANGED
|
@@ -42,7 +42,7 @@ var import_project_select = __toESM(require("./project-select"));
|
|
|
42
42
|
__reExport(stdin_exports, require("./md-preview"), module.exports);
|
|
43
43
|
__reExport(stdin_exports, require("./org-picker"), module.exports);
|
|
44
44
|
__reExport(stdin_exports, require("./project-select"), module.exports);
|
|
45
|
-
const version = "1.17.
|
|
45
|
+
const version = "1.17.8";
|
|
46
46
|
function install(app) {
|
|
47
47
|
const components = [
|
|
48
48
|
import_md_preview.default,
|
|
@@ -25,26 +25,6 @@ var __toESM = (mod, isNodeMode, target) => (target = mod != null ? __create(__ge
|
|
|
25
25
|
mod
|
|
26
26
|
));
|
|
27
27
|
var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
|
|
28
|
-
var __async = (__this, __arguments, generator) => {
|
|
29
|
-
return new Promise((resolve, reject) => {
|
|
30
|
-
var fulfilled = (value) => {
|
|
31
|
-
try {
|
|
32
|
-
step(generator.next(value));
|
|
33
|
-
} catch (e) {
|
|
34
|
-
reject(e);
|
|
35
|
-
}
|
|
36
|
-
};
|
|
37
|
-
var rejected = (value) => {
|
|
38
|
-
try {
|
|
39
|
-
step(generator.throw(value));
|
|
40
|
-
} catch (e) {
|
|
41
|
-
reject(e);
|
|
42
|
-
}
|
|
43
|
-
};
|
|
44
|
-
var step = (x) => x.done ? resolve(x.value) : Promise.resolve(x.value).then(fulfilled, rejected);
|
|
45
|
-
step((generator = generator.apply(__this, __arguments)).next());
|
|
46
|
-
});
|
|
47
|
-
};
|
|
48
28
|
var stdin_exports = {};
|
|
49
29
|
__export(stdin_exports, {
|
|
50
30
|
default: () => stdin_default
|
|
@@ -58,7 +38,7 @@ var import_DeptImg = __toESM(require("./components/DeptImg"));
|
|
|
58
38
|
var import_types = require("./types");
|
|
59
39
|
var import_useApi = require("./useApi");
|
|
60
40
|
var import_index = require("./index.css");
|
|
61
|
-
var
|
|
41
|
+
var import_useSearch = require("./useSearch");
|
|
62
42
|
var stdin_default = (0, import_vue2.defineComponent)({
|
|
63
43
|
name: "OrgPicker",
|
|
64
44
|
props: import_types.orgPickerProps,
|
|
@@ -66,19 +46,30 @@ var stdin_default = (0, import_vue2.defineComponent)({
|
|
|
66
46
|
setup(props, {
|
|
67
47
|
emit
|
|
68
48
|
}) {
|
|
49
|
+
const api = (0, import_useApi.useApi)();
|
|
69
50
|
const {
|
|
70
|
-
orgList,
|
|
71
51
|
getOrgList,
|
|
72
|
-
|
|
52
|
+
orgList,
|
|
73
53
|
deptPath,
|
|
74
|
-
|
|
75
|
-
|
|
76
|
-
getRecentSelectedUsers,
|
|
77
|
-
setRecentSelectedUsers
|
|
78
|
-
} = (0, import_useApi.useApi)();
|
|
54
|
+
userList
|
|
55
|
+
} = api;
|
|
79
56
|
getOrgList();
|
|
80
57
|
const activeTab = (0, import_vue2.ref)("zjxz");
|
|
58
|
+
const {
|
|
59
|
+
keyword,
|
|
60
|
+
searchRef,
|
|
61
|
+
recentSelectedHistory,
|
|
62
|
+
setRecentUsers,
|
|
63
|
+
handleDeleteHistorySelect,
|
|
64
|
+
highlightText,
|
|
65
|
+
renderSearchResult
|
|
66
|
+
} = (0, import_useSearch.useSearch)(props, api);
|
|
81
67
|
const selectedItems = (0, import_vue2.ref)([]);
|
|
68
|
+
const sortOrgList = (0, import_vue2.computed)(() => {
|
|
69
|
+
const departments = orgList.value.filter((item) => item.type === "dept");
|
|
70
|
+
const personnel = orgList.value.filter((item) => item.type !== "dept");
|
|
71
|
+
return [...personnel, ...departments];
|
|
72
|
+
});
|
|
82
73
|
(0, import_vue2.watch)(() => props.modelValue, (newValue) => {
|
|
83
74
|
var _a;
|
|
84
75
|
if (!newValue) {
|
|
@@ -109,7 +100,7 @@ var stdin_default = (0, import_vue2.defineComponent)({
|
|
|
109
100
|
selectedItems.value = [item];
|
|
110
101
|
emit("update:modelValue", [item.id]);
|
|
111
102
|
emit("update:show", false);
|
|
112
|
-
|
|
103
|
+
setRecentUsers(selectedItems.value);
|
|
113
104
|
}
|
|
114
105
|
};
|
|
115
106
|
const handleHistorySelect = (item) => {
|
|
@@ -118,67 +109,11 @@ var stdin_default = (0, import_vue2.defineComponent)({
|
|
|
118
109
|
const handleConfirm = () => {
|
|
119
110
|
emit("update:show", false);
|
|
120
111
|
emit("update:modelValue", selectedItems.value.map((item) => item.id));
|
|
121
|
-
|
|
112
|
+
setRecentUsers(selectedItems.value);
|
|
122
113
|
};
|
|
123
|
-
const keyword = (0, import_vue2.ref)("");
|
|
124
|
-
const loading = (0, import_vue2.ref)(false);
|
|
125
|
-
const finished = (0, import_vue2.ref)(true);
|
|
126
|
-
const searchRef = (0, import_vue2.ref)();
|
|
127
|
-
const recentSelectedHistory = (0, import_vue2.ref)([]);
|
|
128
|
-
const filterRecentSelectedHistory = (0, import_vue2.ref)([]);
|
|
129
|
-
(0, import_vue3.watchEffect)(() => {
|
|
130
|
-
if (activeTab.value === "zjxz") {
|
|
131
|
-
recentSelectedHistory.value = getRecentSelectedUsers();
|
|
132
|
-
}
|
|
133
|
-
});
|
|
134
|
-
(0, import_vue3.watchEffect)(() => {
|
|
135
|
-
if (activeTab.value === "zjxz") {
|
|
136
|
-
if (keyword.value) {
|
|
137
|
-
filterRecentSelectedHistory.value = recentSelectedHistory.value.filter((item) => item.selectedUsers.some((user) => keyword.value.split("").some((char) => user.name.includes(char))));
|
|
138
|
-
} else {
|
|
139
|
-
filterRecentSelectedHistory.value = recentSelectedHistory.value;
|
|
140
|
-
}
|
|
141
|
-
}
|
|
142
|
-
});
|
|
143
|
-
(0, import_vue2.watch)(() => props.show, (newVal) => __async(this, null, function* () {
|
|
144
|
-
if (newVal && props.autoFocus) {
|
|
145
|
-
yield (0, import_vue2.nextTick)();
|
|
146
|
-
setTimeout(() => {
|
|
147
|
-
var _a;
|
|
148
|
-
(_a = searchRef.value) == null ? void 0 : _a.focus();
|
|
149
|
-
}, 300);
|
|
150
|
-
}
|
|
151
|
-
}));
|
|
152
|
-
(0, import_vue2.watch)(keyword, (newKeyword) => {
|
|
153
|
-
if (newKeyword) {
|
|
154
|
-
searchOrgList(newKeyword);
|
|
155
|
-
} else {
|
|
156
|
-
getOrgList(currentDeptId.value);
|
|
157
|
-
}
|
|
158
|
-
});
|
|
159
|
-
const filteredOrgList = (0, import_vue2.computed)(() => {
|
|
160
|
-
if (keyword.value) {
|
|
161
|
-
return orgList.value;
|
|
162
|
-
}
|
|
163
|
-
const departments = orgList.value.filter((item) => item.type === "dept");
|
|
164
|
-
const personnel = orgList.value.filter((item) => item.type !== "dept");
|
|
165
|
-
return [...personnel, ...departments];
|
|
166
|
-
});
|
|
167
114
|
const isSelected = (item) => {
|
|
168
115
|
return selectedItems.value.some((s) => s.id === item.id);
|
|
169
116
|
};
|
|
170
|
-
const onLoad = () => {
|
|
171
|
-
finished.value = true;
|
|
172
|
-
};
|
|
173
|
-
const highlightText = (text, keyword2) => {
|
|
174
|
-
if (!keyword2) {
|
|
175
|
-
return text;
|
|
176
|
-
}
|
|
177
|
-
const keywordChars = keyword2.split("");
|
|
178
|
-
return Array.from(text).map((char, index) => keywordChars.some((kChar) => char.toLowerCase() === kChar.toLowerCase()) ? (0, import_vue3.h)("span", {
|
|
179
|
-
class: "highlight"
|
|
180
|
-
}, char) : char);
|
|
181
|
-
};
|
|
182
117
|
return () => (0, import_vue.createVNode)(import_vant.ActionSheet, {
|
|
183
118
|
"show": props.show,
|
|
184
119
|
"onUpdate:show": (val) => emit("update:show", val),
|
|
@@ -206,28 +141,40 @@ var stdin_default = (0, import_vue2.defineComponent)({
|
|
|
206
141
|
"class": "close-icon"
|
|
207
142
|
}, [(0, import_vue.createTextVNode)("X")])])) : (0, import_vue.createVNode)("p", {
|
|
208
143
|
"class": "color-[#aaa] text-[14px] text-center w-full leading-[38px]"
|
|
209
|
-
}, [(0, import_vue.createTextVNode)("\u672A\u9009\u62E9\u4EBA\u5458")])]), (0, import_vue.createVNode)(
|
|
144
|
+
}, [(0, import_vue.createTextVNode)("\u672A\u9009\u62E9\u4EBA\u5458")])]), (0, import_vue.createVNode)("div", {
|
|
145
|
+
"class": "flex-1 flex flex-col overflow-hidden relative"
|
|
146
|
+
}, [(0, import_vue.createVNode)(import_vant.Tabs, {
|
|
210
147
|
"active": activeTab.value,
|
|
211
148
|
"onUpdate:active": ($event) => activeTab.value = $event
|
|
212
149
|
}, {
|
|
213
150
|
default: () => [(0, import_vue.createVNode)(import_vant.Tab, {
|
|
214
|
-
"title": "\u6700\u8FD1\u9009\u62E9",
|
|
215
|
-
"name": "zjxz"
|
|
216
|
-
}, null), (0, import_vue.createVNode)(import_vant.Tab, {
|
|
217
151
|
"title": "\u901A\u8BAF\u5F55",
|
|
218
152
|
"name": "txl"
|
|
153
|
+
}, null), (0, import_vue.createVNode)(import_vant.Tab, {
|
|
154
|
+
"title": "\u6700\u8FD1\u9009\u62E9",
|
|
155
|
+
"name": "zjxz"
|
|
219
156
|
}, null)]
|
|
220
157
|
}), (0, import_vue.createVNode)("div", {
|
|
221
158
|
"class": "org-content-wrap"
|
|
222
159
|
}, [activeTab.value === "zjxz" ? (0, import_vue.createVNode)("div", {
|
|
223
160
|
"class": "recent-list-wrap flex-1 overflow-auto px-[16px] py-[8px]"
|
|
224
|
-
}, [
|
|
161
|
+
}, [recentSelectedHistory.value.length === 0 ? (0, import_vue.createVNode)(import_vant.Empty, {
|
|
225
162
|
"description": "\u6682\u65E0\u6700\u8FD1\u9009\u62E9\u8BB0\u5F55"
|
|
226
|
-
}, null) :
|
|
163
|
+
}, null) : recentSelectedHistory.value.map((historyItem) => (0, import_vue.createVNode)("div", {
|
|
227
164
|
"key": historyItem.id,
|
|
228
165
|
"onClick": () => handleHistorySelect(historyItem),
|
|
229
|
-
"class": "
|
|
230
|
-
}, [(0, import_vue.createVNode)("span",
|
|
166
|
+
"class": "py-8px border-b border-[#eee] flex items-center"
|
|
167
|
+
}, [(0, import_vue.createVNode)("span", {
|
|
168
|
+
"class": "flex-1"
|
|
169
|
+
}, [historyItem.selectedUsers.map((user) => highlightText(user.name, keyword.value)).reduce((prev, curr) => [prev, "\uFF0C", curr])]), (0, import_vue.createVNode)("span", {
|
|
170
|
+
"class": "p-4px pl-2",
|
|
171
|
+
"onClick": (e) => {
|
|
172
|
+
e.stopPropagation();
|
|
173
|
+
handleDeleteHistorySelect(historyItem);
|
|
174
|
+
}
|
|
175
|
+
}, [(0, import_vue.createVNode)(import_vant.Icon, {
|
|
176
|
+
"name": "delete-o"
|
|
177
|
+
}, null)])]))]) : (0, import_vue.createVNode)(import_vue.Fragment, null, [(0, import_vue.createVNode)("div", {
|
|
231
178
|
"class": "breadcrumb-nav"
|
|
232
179
|
}, [deptPath.value.map((dept, index) => (0, import_vue.createVNode)("span", {
|
|
233
180
|
"key": dept.id
|
|
@@ -241,14 +188,10 @@ var stdin_default = (0, import_vue2.defineComponent)({
|
|
|
241
188
|
"class": "separator"
|
|
242
189
|
}, [(0, import_vue.createTextVNode)(" / ")])]))]), (0, import_vue.createVNode)("div", {
|
|
243
190
|
"class": "feed-list-wrap"
|
|
244
|
-
}, [
|
|
245
|
-
"description":
|
|
246
|
-
}, null) : (0, import_vue.createVNode)(import_vant.List, {
|
|
247
|
-
|
|
248
|
-
"finished": finished.value,
|
|
249
|
-
"onLoad": onLoad
|
|
250
|
-
}, {
|
|
251
|
-
default: () => [filteredOrgList.value.map((item) => (0, import_vue.createVNode)("div", {
|
|
191
|
+
}, [sortOrgList.value.length === 0 ? (0, import_vue.createVNode)(import_vant.Empty, {
|
|
192
|
+
"description": "\u8BE5\u90E8\u95E8\u4E0B\u6CA1\u6709\u4EBA\u5458"
|
|
193
|
+
}, null) : (0, import_vue.createVNode)(import_vant.List, null, {
|
|
194
|
+
default: () => [sortOrgList.value.map((item) => (0, import_vue.createVNode)("div", {
|
|
252
195
|
"class": ["org-item", isSelected(item) ? "selected" : ""],
|
|
253
196
|
"onClick": () => handleSelect(item)
|
|
254
197
|
}, [item.type === "dept" && !keyword.value ? (0, import_vue.createVNode)("div", {
|
|
@@ -261,7 +204,11 @@ var stdin_default = (0, import_vue2.defineComponent)({
|
|
|
261
204
|
}, [item.name, (0, import_vue.createVNode)("span", {
|
|
262
205
|
"class": "org-item-select-icon"
|
|
263
206
|
}, [(0, import_vue.createTextVNode)("\u2713")])])]))]
|
|
264
|
-
})])])]),
|
|
207
|
+
})])])]), keyword.value && renderSearchResult({
|
|
208
|
+
handleHistorySelect,
|
|
209
|
+
isSelected,
|
|
210
|
+
handleSelect
|
|
211
|
+
})]), props.multiple && (0, import_vue.createVNode)("div", {
|
|
265
212
|
"class": "bottom-section"
|
|
266
213
|
}, [(0, import_vue.createVNode)("div", {
|
|
267
214
|
"class": "action-buttons"
|
|
@@ -31,15 +31,41 @@
|
|
|
31
31
|
}
|
|
32
32
|
|
|
33
33
|
/* layer: default */
|
|
34
|
-
.cgx-atm .
|
|
34
|
+
.cgx-atm .absolute{position:absolute;}
|
|
35
|
+
.cgx-atm .bottom-0{bottom:0rem;}
|
|
36
|
+
.cgx-atm .left-0{left:0rem;}
|
|
37
|
+
.cgx-atm .right-0{right:0rem;}
|
|
38
|
+
.cgx-atm .top-0{top:0rem;}
|
|
39
|
+
.cgx-atm .z-1{z-index:1;}
|
|
35
40
|
.cgx-atm .flex-1{flex:1 1 0%;}
|
|
36
41
|
.cgx-atm .overflow-auto{overflow:auto;}
|
|
37
42
|
.cgx-atm .border-b{border-bottom-width:1px;border-bottom-style:solid;}
|
|
38
43
|
.cgx-atm .border-\[\#eee\]{--un-border-opacity:1;border-color:rgba(238,238,238,var(--un-border-opacity));}
|
|
44
|
+
.cgx-atm .bg-\[\#fff\]{--un-bg-opacity:1;background-color:rgba(255,255,255,var(--un-bg-opacity));}
|
|
39
45
|
.cgx-atm .px-\[16px\],
|
|
40
46
|
.cgx-atm .px-16px{padding-left:16px;padding-right:16px;}
|
|
47
|
+
.cgx-atm .py-\[12px\]{padding-top:12px;padding-bottom:12px;}
|
|
48
|
+
.cgx-atm .py-\[8px\],
|
|
49
|
+
.cgx-atm .py-8px{padding-top:8px;padding-bottom:8px;}
|
|
50
|
+
.cgx-atm .text-\[14px\]{font-size:14px;}
|
|
51
|
+
.cgx-atm .font-bold{font-weight:700;}
|
|
52
|
+
.cgx-atm .text-\[\#333\]{--un-text-opacity:1;color:rgba(51,51,51,var(--un-text-opacity));}
|
|
53
|
+
/* layer: default */
|
|
54
|
+
.cgx-atm .relative{position:relative;}
|
|
55
|
+
.cgx-atm .w-full{width:100%;}
|
|
56
|
+
.cgx-atm .flex{display:flex;}
|
|
57
|
+
.cgx-atm .flex-1{flex:1 1 0%;}
|
|
58
|
+
.cgx-atm .flex-col{flex-direction:column;}
|
|
59
|
+
.cgx-atm .items-center{align-items:center;}
|
|
60
|
+
.cgx-atm .overflow-auto{overflow:auto;}
|
|
61
|
+
.cgx-atm .overflow-hidden{overflow:hidden;}
|
|
62
|
+
.cgx-atm .border-b{border-bottom-width:1px;border-bottom-style:solid;}
|
|
63
|
+
.cgx-atm .border-\[\#eee\]{--un-border-opacity:1;border-color:rgba(238,238,238,var(--un-border-opacity));}
|
|
64
|
+
.cgx-atm .p-4px{padding:4px;}
|
|
65
|
+
.cgx-atm .px-\[16px\]{padding-left:16px;padding-right:16px;}
|
|
41
66
|
.cgx-atm .py-\[8px\],
|
|
42
67
|
.cgx-atm .py-8px{padding-top:8px;padding-bottom:8px;}
|
|
68
|
+
.cgx-atm .pl-2{padding-left:0.5rem;}
|
|
43
69
|
.cgx-atm .text-center{text-align:center;}
|
|
44
70
|
.cgx-atm .text-\[14px\]{font-size:14px;}
|
|
45
71
|
.cgx-atm .leading-\[38px\]{line-height:38px;}
|
package/lib/org-picker/index.css
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
:root:root{--van-action-sheet-max-height: 100%}.org-list{height:85vh;display:flex;flex-direction:column}.org-list .highlight{color:var(--van-primary-color);font-weight:700}.org-list .breadcrumb-nav{margin-bottom:4px;padding:2px 16px;border-radius:4px;font-size:12px}.org-list .breadcrumb-nav .dept-name.current-dept{color:#969799}.org-list .breadcrumb-nav .separator{color:#969799;margin:0 4px}.org-list .search-bar{position:-webkit-sticky;position:-webkit-sticky;position:sticky;top:0;z-index:1}.org-list .org-selected-items{display:flex;flex-wrap:nowrap;padding:12px 16px;gap:12px;background-color:#fff;overflow-x:auto;height:68px;border-bottom:1px solid #eee}.org-list .org-selected-items .selected-tag{flex-shrink:0;background:none;border:none;padding:0;margin:0;position:relative}.org-list .org-selected-items .selected-tag .close-icon{position:absolute;top:0;right:0;z-index:1;background-color:#fff;border-radius:50%;border:1px solid #eee;width:10px;height:10px;display:flex;align-items:center;justify-content:center;font-size:6px;color:#969799}.org-list .org-selected-items .selected-tag .tag-avatar{width:40px;height:40px}.org-list .org-selected-items .selected-tag .tag-avatar img{border-radius:4px;border:1px solid #eee;object-fit:contain}.org-list .bottom-section{border-top:1px solid #eee;background-color:#fff}.org-list .van-list{flex:1;overflow-y:auto;padding:0 16px}.org-list .org-content-wrap{flex:1;display:flex;flex-direction:column;overflow:hidden}.org-list .feed-list-wrap{flex:1;display:flex;overflow:hidden;position:relative;justify-content:center}.org-list .search-result-list{position:absolute;top:0;left:0;right:0;bottom:0;z-index:1;background-color:#fff;overflow-y:auto;padding:0 16px}.org-list .org-item{padding:12px 0;border-bottom:1px solid #eee;cursor:pointer;display:flex;align-items:center;gap:12px}.org-list .org-item .org-item-select-icon{display:none;padding-left:4px}.org-list .org-item.selected{color:var(--van-primary-color)}.org-list .org-item.selected .org-item-select-icon{display:inline}.org-list .org-item .org-avatar{flex-shrink:0;width:40px;height:40px;display:flex;align-items:center;justify-content:center}.org-list .org-item .org-avatar img{border-radius:4px;border:1px solid #eee;object-fit:contain}.org-list .org-item .org-name{font-size:14px;flex:1}.org-list .org-item:last-child{border-bottom:none}.org-list .action-buttons{padding:16px;display:flex;justify-content:center}.org-list .action-buttons .confirm-button{background-color:var(--van-primary-color);color:#fff;padding:10px 0;border-radius:4px;text-align:center;width:100%;font-size:14px}
|
|
1
|
+
:root:root{--van-action-sheet-max-height: 100%}.org-list{height:85vh;display:flex;flex-direction:column}.org-list .highlight{color:var(--van-primary-color);font-weight:700}.org-list .breadcrumb-nav{margin-bottom:4px;padding:2px 16px;border-radius:4px;font-size:12px}.org-list .breadcrumb-nav .dept-name.current-dept{color:#969799}.org-list .breadcrumb-nav .separator{color:#969799;margin:0 4px}.org-list .search-bar{position:-webkit-sticky;position:-webkit-sticky;position:sticky;top:0;z-index:1}.org-list .org-selected-items{display:flex;flex-wrap:nowrap;padding:12px 16px;gap:12px;background-color:#fff;overflow-x:auto;height:68px;border-bottom:1px solid #eee}.org-list .org-selected-items .selected-tag{flex-shrink:0;background:none;border:none;padding:0;margin:0;position:relative}.org-list .org-selected-items .selected-tag .close-icon{position:absolute;top:0;right:0;z-index:1;background-color:#fff;border-radius:50%;border:1px solid #eee;width:10px;height:10px;display:flex;align-items:center;justify-content:center;font-size:6px;color:#969799}.org-list .org-selected-items .selected-tag .tag-avatar{width:40px;height:40px}.org-list .org-selected-items .selected-tag .tag-avatar img{border-radius:4px;border:1px solid #eee;object-fit:contain}.org-list .bottom-section{border-top:1px solid #eee;background-color:#fff}.org-list .van-list{flex:1;overflow-y:auto;padding:0 16px}.org-list .org-content-wrap{flex:1;display:flex;flex-direction:column;overflow:hidden;position:relative;padding-top:4px}.org-list .feed-list-wrap{flex:1;display:flex;overflow:hidden;position:relative;justify-content:center}.org-list .search-result-list{position:absolute;top:0;left:0;right:0;bottom:0;z-index:1;background-color:#fff;overflow-y:auto;padding:0 16px}.org-list .org-item{padding:12px 0;border-bottom:1px solid #eee;cursor:pointer;display:flex;align-items:center;gap:12px}.org-list .org-item .org-item-select-icon{display:none;padding-left:4px}.org-list .org-item.selected{color:var(--van-primary-color)}.org-list .org-item.selected .org-item-select-icon{display:inline}.org-list .org-item .org-avatar{flex-shrink:0;width:40px;height:40px;display:flex;align-items:center;justify-content:center}.org-list .org-item .org-avatar img{border-radius:4px;border:1px solid #eee;object-fit:contain}.org-list .org-item .org-name{font-size:14px;flex:1}.org-list .org-item:last-child{border-bottom:none}.org-list .action-buttons{padding:16px;display:flex;justify-content:center}.org-list .action-buttons .confirm-button{background-color:var(--van-primary-color);color:#fff;padding:10px 0;border-radius:4px;text-align:center;width:100%;font-size:14px}
|
|
@@ -27,6 +27,19 @@ export declare const useApi: () => {
|
|
|
27
27
|
type: string;
|
|
28
28
|
avatar?: string | undefined;
|
|
29
29
|
}[]>;
|
|
30
|
+
orgSearchList: Ref<{
|
|
31
|
+
[x: string]: any;
|
|
32
|
+
id: string | number;
|
|
33
|
+
name: string;
|
|
34
|
+
type: string;
|
|
35
|
+
avatar?: string | undefined;
|
|
36
|
+
}[], OrgItem[] | {
|
|
37
|
+
[x: string]: any;
|
|
38
|
+
id: string | number;
|
|
39
|
+
name: string;
|
|
40
|
+
type: string;
|
|
41
|
+
avatar?: string | undefined;
|
|
42
|
+
}[]>;
|
|
30
43
|
getOrgList: (deptId?: string) => Promise<void>;
|
|
31
44
|
currentDeptId: Ref<string, string>;
|
|
32
45
|
deptPath: Ref<{
|
|
@@ -39,7 +52,8 @@ export declare const useApi: () => {
|
|
|
39
52
|
id: string | number;
|
|
40
53
|
name: string;
|
|
41
54
|
}[]>;
|
|
55
|
+
deleteRecentSelectedUsers: (id: string) => Promise<void>;
|
|
42
56
|
searchOrgList: import("lodash-es").DebouncedFunc<(userName: string) => Promise<void>>;
|
|
43
|
-
getRecentSelectedUsers: () => RecentSelection[]
|
|
44
|
-
setRecentSelectedUsers: (users: OrgItem[]) => void
|
|
57
|
+
getRecentSelectedUsers: () => Promise<RecentSelection[]>;
|
|
58
|
+
setRecentSelectedUsers: (users: OrgItem[]) => Promise<void>;
|
|
45
59
|
};
|
package/lib/org-picker/useApi.js
CHANGED
|
@@ -67,6 +67,7 @@ function initUserList() {
|
|
|
67
67
|
initUserList();
|
|
68
68
|
const useApi = () => {
|
|
69
69
|
const orgList = (0, import_vue.ref)([]);
|
|
70
|
+
const orgSearchList = (0, import_vue.ref)([]);
|
|
70
71
|
const currentDeptId = (0, import_vue.ref)("1");
|
|
71
72
|
const deptPath = (0, import_vue.ref)([{ id: "1", name: "\u5DDD\u9505\u516C\u53F8" }]);
|
|
72
73
|
const getOrgList = (deptId) => __async(void 0, null, function* () {
|
|
@@ -87,32 +88,31 @@ const useApi = () => {
|
|
|
87
88
|
});
|
|
88
89
|
const searchOrgList = (0, import_lodash_es.debounce)((userName) => __async(void 0, null, function* () {
|
|
89
90
|
if (!userName) {
|
|
90
|
-
|
|
91
|
+
orgSearchList.value = [];
|
|
91
92
|
return;
|
|
92
93
|
}
|
|
93
94
|
const url = `https://wflow.cgboiler.com/v1/oa/org/tree/user/search/cloud?userName=${userName}`;
|
|
94
|
-
|
|
95
|
+
orgSearchList.value = yield fetchData(url);
|
|
95
96
|
}), 300);
|
|
96
97
|
const RECENT_SELECTED_USERS_KEY = "recent_selected_users_history";
|
|
97
98
|
const MAX_RECENT_SELECTIONS = 15;
|
|
98
|
-
const getRecentSelectedUsers = () => {
|
|
99
|
+
const getRecentSelectedUsers = () => __async(void 0, null, function* () {
|
|
99
100
|
try {
|
|
100
|
-
const data =
|
|
101
|
-
return data
|
|
101
|
+
const data = yield (0, import_core.getStorage)(RECENT_SELECTED_USERS_KEY);
|
|
102
|
+
return data || [];
|
|
102
103
|
} catch (error) {
|
|
103
104
|
console.error("Failed to get recent selected users history from localStorage", error);
|
|
104
105
|
return [];
|
|
105
106
|
}
|
|
106
|
-
};
|
|
107
|
-
const setRecentSelectedUsers = (users) => {
|
|
107
|
+
});
|
|
108
|
+
const setRecentSelectedUsers = (users) => __async(void 0, null, function* () {
|
|
108
109
|
if (!users || users.length === 0)
|
|
109
110
|
return;
|
|
110
|
-
const history = getRecentSelectedUsers();
|
|
111
|
+
const history = yield getRecentSelectedUsers();
|
|
111
112
|
const newSelection = {
|
|
112
113
|
id: Date.now().toString(),
|
|
113
114
|
// 使用时间戳作为唯一ID
|
|
114
|
-
selectedUsers: users
|
|
115
|
-
timestamp: Date.now()
|
|
115
|
+
selectedUsers: users
|
|
116
116
|
};
|
|
117
117
|
const filteredHistory = history.filter((item) => {
|
|
118
118
|
return !(item.selectedUsers.length === newSelection.selectedUsers.length && item.selectedUsers.every(
|
|
@@ -121,17 +121,28 @@ const useApi = () => {
|
|
|
121
121
|
});
|
|
122
122
|
const updatedHistory = [newSelection, ...filteredHistory].slice(0, MAX_RECENT_SELECTIONS);
|
|
123
123
|
try {
|
|
124
|
-
|
|
124
|
+
yield (0, import_core.setStorage)(RECENT_SELECTED_USERS_KEY, JSON.parse(JSON.stringify(updatedHistory)));
|
|
125
125
|
} catch (error) {
|
|
126
126
|
console.error("Failed to set recent selected users history to localStorage", error);
|
|
127
127
|
}
|
|
128
|
-
};
|
|
128
|
+
});
|
|
129
|
+
const deleteRecentSelectedUsers = (id) => __async(void 0, null, function* () {
|
|
130
|
+
const history = yield getRecentSelectedUsers();
|
|
131
|
+
const updatedHistory = history.filter((item) => item.id !== id);
|
|
132
|
+
try {
|
|
133
|
+
yield (0, import_core.setStorage)(RECENT_SELECTED_USERS_KEY, JSON.parse(JSON.stringify(updatedHistory)));
|
|
134
|
+
} catch (error) {
|
|
135
|
+
console.error("Failed to delete recent selected users history to localStorage", error);
|
|
136
|
+
}
|
|
137
|
+
});
|
|
129
138
|
return {
|
|
130
139
|
userList,
|
|
131
140
|
orgList,
|
|
141
|
+
orgSearchList,
|
|
132
142
|
getOrgList,
|
|
133
143
|
currentDeptId,
|
|
134
144
|
deptPath,
|
|
145
|
+
deleteRecentSelectedUsers,
|
|
135
146
|
searchOrgList,
|
|
136
147
|
getRecentSelectedUsers,
|
|
137
148
|
setRecentSelectedUsers
|
|
@@ -0,0 +1,11 @@
|
|
|
1
|
+
export declare function useSearch(props: any, api: any): {
|
|
2
|
+
keyword: import("vue").Ref<string, string>;
|
|
3
|
+
searchRef: import("vue").Ref<any, any>;
|
|
4
|
+
setRecentUsers: (users: any[]) => Promise<void>;
|
|
5
|
+
renderSearchResult: ({ handleHistorySelect, isSelected, handleSelect }: any) => import("vue/jsx-runtime").JSX.Element;
|
|
6
|
+
handleDeleteHistorySelect: (item: any) => Promise<void>;
|
|
7
|
+
filteredOrgList: import("vue").ComputedRef<any>;
|
|
8
|
+
recentSelectedHistory: import("vue").Ref<any[], any[]>;
|
|
9
|
+
filterRecentSelectedHistory: import("vue").Ref<any[], any[]>;
|
|
10
|
+
highlightText: (text: string, keyword: string) => string | (string | import("vue/jsx-runtime").JSX.Element)[];
|
|
11
|
+
};
|
|
@@ -0,0 +1,156 @@
|
|
|
1
|
+
var __defProp = Object.defineProperty;
|
|
2
|
+
var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
|
|
3
|
+
var __getOwnPropNames = Object.getOwnPropertyNames;
|
|
4
|
+
var __hasOwnProp = Object.prototype.hasOwnProperty;
|
|
5
|
+
var __export = (target, all) => {
|
|
6
|
+
for (var name in all)
|
|
7
|
+
__defProp(target, name, { get: all[name], enumerable: true });
|
|
8
|
+
};
|
|
9
|
+
var __copyProps = (to, from, except, desc) => {
|
|
10
|
+
if (from && typeof from === "object" || typeof from === "function") {
|
|
11
|
+
for (let key of __getOwnPropNames(from))
|
|
12
|
+
if (!__hasOwnProp.call(to, key) && key !== except)
|
|
13
|
+
__defProp(to, key, { get: () => from[key], enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable });
|
|
14
|
+
}
|
|
15
|
+
return to;
|
|
16
|
+
};
|
|
17
|
+
var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
|
|
18
|
+
var __async = (__this, __arguments, generator) => {
|
|
19
|
+
return new Promise((resolve, reject) => {
|
|
20
|
+
var fulfilled = (value) => {
|
|
21
|
+
try {
|
|
22
|
+
step(generator.next(value));
|
|
23
|
+
} catch (e) {
|
|
24
|
+
reject(e);
|
|
25
|
+
}
|
|
26
|
+
};
|
|
27
|
+
var rejected = (value) => {
|
|
28
|
+
try {
|
|
29
|
+
step(generator.throw(value));
|
|
30
|
+
} catch (e) {
|
|
31
|
+
reject(e);
|
|
32
|
+
}
|
|
33
|
+
};
|
|
34
|
+
var step = (x) => x.done ? resolve(x.value) : Promise.resolve(x.value).then(fulfilled, rejected);
|
|
35
|
+
step((generator = generator.apply(__this, __arguments)).next());
|
|
36
|
+
});
|
|
37
|
+
};
|
|
38
|
+
var stdin_exports = {};
|
|
39
|
+
__export(stdin_exports, {
|
|
40
|
+
useSearch: () => useSearch
|
|
41
|
+
});
|
|
42
|
+
module.exports = __toCommonJS(stdin_exports);
|
|
43
|
+
var import_vue = require("vue");
|
|
44
|
+
var import_atomic = require("./_atomic.css");
|
|
45
|
+
var import_vue2 = require("vue");
|
|
46
|
+
var import_vant = require("vant");
|
|
47
|
+
function useSearch(props, api) {
|
|
48
|
+
const {
|
|
49
|
+
orgSearchList,
|
|
50
|
+
getOrgList,
|
|
51
|
+
currentDeptId,
|
|
52
|
+
searchOrgList,
|
|
53
|
+
setRecentSelectedUsers,
|
|
54
|
+
deleteRecentSelectedUsers,
|
|
55
|
+
getRecentSelectedUsers
|
|
56
|
+
} = api;
|
|
57
|
+
const keyword = (0, import_vue2.ref)("");
|
|
58
|
+
const searchRef = (0, import_vue2.ref)();
|
|
59
|
+
const recentSelectedHistory = (0, import_vue2.ref)([]);
|
|
60
|
+
const filterRecentSelectedHistory = (0, import_vue2.ref)([]);
|
|
61
|
+
(0, import_vue2.watchEffect)(() => __async(this, null, function* () {
|
|
62
|
+
recentSelectedHistory.value = yield getRecentSelectedUsers();
|
|
63
|
+
}));
|
|
64
|
+
const setRecentUsers = (users) => __async(this, null, function* () {
|
|
65
|
+
yield setRecentSelectedUsers(users);
|
|
66
|
+
recentSelectedHistory.value = yield getRecentSelectedUsers();
|
|
67
|
+
});
|
|
68
|
+
const handleDeleteHistorySelect = (item) => __async(this, null, function* () {
|
|
69
|
+
yield deleteRecentSelectedUsers(item.id);
|
|
70
|
+
recentSelectedHistory.value = yield getRecentSelectedUsers();
|
|
71
|
+
});
|
|
72
|
+
(0, import_vue2.watchEffect)(() => {
|
|
73
|
+
if (keyword.value) {
|
|
74
|
+
filterRecentSelectedHistory.value = recentSelectedHistory.value.filter((item) => item.selectedUsers.some((user) => keyword.value.split("").some((char) => user.name.includes(char))));
|
|
75
|
+
} else {
|
|
76
|
+
filterRecentSelectedHistory.value = recentSelectedHistory.value;
|
|
77
|
+
}
|
|
78
|
+
});
|
|
79
|
+
(0, import_vue2.watch)(() => props.show, (newVal) => __async(this, null, function* () {
|
|
80
|
+
if (newVal && props.autoFocus) {
|
|
81
|
+
yield (0, import_vue2.nextTick)();
|
|
82
|
+
setTimeout(() => {
|
|
83
|
+
var _a;
|
|
84
|
+
(_a = searchRef.value) == null ? void 0 : _a.focus();
|
|
85
|
+
}, 300);
|
|
86
|
+
}
|
|
87
|
+
}));
|
|
88
|
+
(0, import_vue2.watch)(keyword, (newKeyword) => {
|
|
89
|
+
if (newKeyword) {
|
|
90
|
+
searchOrgList(newKeyword);
|
|
91
|
+
} else {
|
|
92
|
+
getOrgList(currentDeptId.value);
|
|
93
|
+
}
|
|
94
|
+
});
|
|
95
|
+
const filteredOrgList = (0, import_vue2.computed)(() => {
|
|
96
|
+
if (keyword.value) {
|
|
97
|
+
return orgSearchList.value;
|
|
98
|
+
}
|
|
99
|
+
return [];
|
|
100
|
+
});
|
|
101
|
+
const highlightText = (text, keyword2) => {
|
|
102
|
+
if (!keyword2) {
|
|
103
|
+
return text;
|
|
104
|
+
}
|
|
105
|
+
const keywordChars = keyword2.split("");
|
|
106
|
+
return Array.from(text).map((char, index) => keywordChars.some((kChar) => char.toLowerCase() === kChar.toLowerCase()) ? (0, import_vue.createVNode)("span", {
|
|
107
|
+
"class": "highlight"
|
|
108
|
+
}, [char]) : char);
|
|
109
|
+
};
|
|
110
|
+
const renderSearchResult = ({
|
|
111
|
+
handleHistorySelect,
|
|
112
|
+
isSelected,
|
|
113
|
+
handleSelect
|
|
114
|
+
}) => {
|
|
115
|
+
return (0, import_vue.createVNode)("div", {
|
|
116
|
+
"class": "absolute top-0 left-0 right-0 bottom-0 bg-[#fff] z-1"
|
|
117
|
+
}, [filterRecentSelectedHistory.value.length ? (0, import_vue.createVNode)(import_vue.Fragment, null, [(0, import_vue.createVNode)("p", {
|
|
118
|
+
"class": "text-[14px] text-[#333] font-bold px-[16px] py-[12px] border-b border-[#eee]"
|
|
119
|
+
}, [(0, import_vue.createTextVNode)("\u6700\u8FD1\u9009\u62E9")]), (0, import_vue.createVNode)("div", {
|
|
120
|
+
"class": "recent-list-wrap flex-1 overflow-auto py-[8px]"
|
|
121
|
+
}, [filterRecentSelectedHistory.value.map((historyItem) => (0, import_vue.createVNode)("div", {
|
|
122
|
+
"key": historyItem.id,
|
|
123
|
+
"onClick": () => handleHistorySelect(historyItem),
|
|
124
|
+
"class": "px-16px py-8px border-b border-[#eee]"
|
|
125
|
+
}, [(0, import_vue.createVNode)("span", null, [historyItem.selectedUsers.map((user) => highlightText(user.name, keyword.value)).reduce((prev, curr) => [prev, "\uFF0C", curr])])]))])]) : "", filteredOrgList.value.length ? (0, import_vue.createVNode)(import_vue.Fragment, null, [" ", (0, import_vue.createVNode)("p", {
|
|
126
|
+
"class": "text-[14px] text-[#333] font-bold px-[16px] py-[12px] border-b border-[#eee]"
|
|
127
|
+
}, [(0, import_vue.createTextVNode)("\u901A\u8BAF\u5F55")]), (0, import_vue.createVNode)("div", {
|
|
128
|
+
"class": "feed-list-wrap"
|
|
129
|
+
}, [filteredOrgList.value.length === 0 ? (0, import_vue.createVNode)(import_vant.Empty, {
|
|
130
|
+
"description": "\u672A\u627E\u5230\u76F8\u5173\u4EBA\u5458"
|
|
131
|
+
}, null) : (0, import_vue.createVNode)(import_vant.List, null, {
|
|
132
|
+
default: () => [filteredOrgList.value.map((item) => (0, import_vue.createVNode)("div", {
|
|
133
|
+
"class": ["org-item", isSelected(item) ? "selected" : ""],
|
|
134
|
+
"onClick": () => handleSelect(item)
|
|
135
|
+
}, [(0, import_vue.createVNode)(import_vant.Image, {
|
|
136
|
+
"class": "org-avatar",
|
|
137
|
+
"src": item.avatar
|
|
138
|
+
}, null), (0, import_vue.createVNode)("div", {
|
|
139
|
+
"class": "org-name"
|
|
140
|
+
}, [item.name, (0, import_vue.createVNode)("span", {
|
|
141
|
+
"class": "org-item-select-icon"
|
|
142
|
+
}, [(0, import_vue.createTextVNode)("\u2713")])])]))]
|
|
143
|
+
})])]) : ""]);
|
|
144
|
+
};
|
|
145
|
+
return {
|
|
146
|
+
keyword,
|
|
147
|
+
searchRef,
|
|
148
|
+
setRecentUsers,
|
|
149
|
+
renderSearchResult,
|
|
150
|
+
handleDeleteHistorySelect,
|
|
151
|
+
filteredOrgList,
|
|
152
|
+
recentSelectedHistory,
|
|
153
|
+
filterRecentSelectedHistory,
|
|
154
|
+
highlightText
|
|
155
|
+
};
|
|
156
|
+
}
|