awing-library 2.1.2-stable.30 → 2.1.2-stable.32
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/dist/AWING/DataForm/container.test.js +4 -4
- package/dist/Features/SYSTEM/Group/SearchUser/component.d.ts +3 -0
- package/dist/Features/SYSTEM/Group/SearchUser/component.d.ts.map +1 -1
- package/dist/Features/SYSTEM/Group/SearchUser/component.js +58 -33
- package/dist/Features/SYSTEM/Group/SearchUser/container.d.ts.map +1 -1
- package/dist/Features/SYSTEM/Group/SearchUser/container.js +59 -30
- package/dist/Features/SYSTEM/Group/Services.d.ts +4 -2
- package/dist/Features/SYSTEM/Group/Services.d.ts.map +1 -1
- package/package.json +1 -1
|
@@ -9,7 +9,7 @@ var __webpack_modules__ = {
|
|
|
9
9
|
"AWING/DataInput": function(module) {
|
|
10
10
|
module.exports = __WEBPACK_EXTERNAL_MODULE__DataInput_index_js_c7933a4f__;
|
|
11
11
|
},
|
|
12
|
-
"
|
|
12
|
+
"../helper": function(module) {
|
|
13
13
|
module.exports = __WEBPACK_EXTERNAL_MODULE__helper_js_663c9e82__;
|
|
14
14
|
}
|
|
15
15
|
};
|
|
@@ -92,9 +92,9 @@ jest.mock('@mui/material', ()=>({
|
|
|
92
92
|
})
|
|
93
93
|
}));
|
|
94
94
|
const mockInputFactory = __webpack_require__("AWING/DataInput")["default"];
|
|
95
|
-
const mockCalculateValue = __webpack_require__("
|
|
96
|
-
const mockConvertFormulaToBinaryTree = __webpack_require__("
|
|
97
|
-
const mockReplaceFieldsValue = __webpack_require__("
|
|
95
|
+
const mockCalculateValue = __webpack_require__("../helper").calculateValue;
|
|
96
|
+
const mockConvertFormulaToBinaryTree = __webpack_require__("../helper").convertFormulaToBinaryTree;
|
|
97
|
+
const mockReplaceFieldsValue = __webpack_require__("../helper").replaceFieldsValue;
|
|
98
98
|
describe('DataForm Component', ()=>{
|
|
99
99
|
const mockFields = [
|
|
100
100
|
{
|
|
@@ -5,6 +5,9 @@ interface SearchUserGroupUserProps {
|
|
|
5
5
|
users: User[];
|
|
6
6
|
onSearch?: (searchString: string) => void;
|
|
7
7
|
loading?: boolean;
|
|
8
|
+
loadingMore?: boolean;
|
|
9
|
+
hasMore?: boolean;
|
|
10
|
+
onLoadMore?: () => void;
|
|
8
11
|
}
|
|
9
12
|
declare function SearchUserGroupUser(props: SearchUserGroupUserProps): import("react/jsx-runtime").JSX.Element;
|
|
10
13
|
export default SearchUserGroupUser;
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"component.d.ts","sourceRoot":"","sources":["../../../../../src/Features/SYSTEM/Group/SearchUser/component.tsx"],"names":[],"mappings":"AAKA,OAAO,EAAE,IAAI,EAAE,MAAM,4BAA4B,CAAC;AAElD,UAAU,wBAAwB;IAC9B,UAAU,EAAE,MAAM,EAAE,CAAC;IACrB,kBAAkB,EAAE,CAAC,UAAU,EAAE,MAAM,EAAE,KAAK,IAAI,CAAC;IACnD,KAAK,EAAE,IAAI,EAAE,CAAC;IACd,QAAQ,CAAC,EAAE,CAAC,YAAY,EAAE,MAAM,KAAK,IAAI,CAAC;IAC1C,OAAO,CAAC,EAAE,OAAO,CAAC;
|
|
1
|
+
{"version":3,"file":"component.d.ts","sourceRoot":"","sources":["../../../../../src/Features/SYSTEM/Group/SearchUser/component.tsx"],"names":[],"mappings":"AAKA,OAAO,EAAE,IAAI,EAAE,MAAM,4BAA4B,CAAC;AAElD,UAAU,wBAAwB;IAC9B,UAAU,EAAE,MAAM,EAAE,CAAC;IACrB,kBAAkB,EAAE,CAAC,UAAU,EAAE,MAAM,EAAE,KAAK,IAAI,CAAC;IACnD,KAAK,EAAE,IAAI,EAAE,CAAC;IACd,QAAQ,CAAC,EAAE,CAAC,YAAY,EAAE,MAAM,KAAK,IAAI,CAAC;IAC1C,OAAO,CAAC,EAAE,OAAO,CAAC;IAClB,WAAW,CAAC,EAAE,OAAO,CAAC;IACtB,OAAO,CAAC,EAAE,OAAO,CAAC;IAClB,UAAU,CAAC,EAAE,MAAM,IAAI,CAAC;CAC3B;AAED,iBAAS,mBAAmB,CAAC,KAAK,EAAE,wBAAwB,2CA8F3D;AAED,eAAe,mBAAmB,CAAC"}
|
|
@@ -1,12 +1,27 @@
|
|
|
1
|
-
import {
|
|
2
|
-
import {
|
|
1
|
+
import { jsx, jsxs } from "react/jsx-runtime";
|
|
2
|
+
import { useEffect, useRef } from "react";
|
|
3
3
|
import { filter, some } from "lodash";
|
|
4
|
-
import { Checkbox, FormControlLabel, Paper } from "@mui/material";
|
|
4
|
+
import { Box, Checkbox, FormControlLabel, Paper } from "@mui/material";
|
|
5
5
|
import { CircularProgress, NoData, SearchBox } from "../../../../AWING/index.js";
|
|
6
6
|
import Grid from "@mui/material/Grid";
|
|
7
7
|
function SearchUserGroupUser(props) {
|
|
8
|
-
const { listUserId, onListUserIdChange, users, onSearch, loading } = props;
|
|
9
|
-
const
|
|
8
|
+
const { listUserId, onListUserIdChange, users, onSearch, loading, loadingMore = false, hasMore = false, onLoadMore } = props;
|
|
9
|
+
const scrollContainerRef = useRef(null);
|
|
10
|
+
useEffect(()=>{
|
|
11
|
+
const container = scrollContainerRef.current;
|
|
12
|
+
if (!container) return;
|
|
13
|
+
if (hasMore && !loadingMore && container.scrollHeight <= container.clientHeight) return void onLoadMore?.();
|
|
14
|
+
const handleScroll = ()=>{
|
|
15
|
+
const { scrollTop, scrollHeight, clientHeight } = container;
|
|
16
|
+
if (scrollHeight - scrollTop <= clientHeight + 50 && hasMore && !loadingMore) onLoadMore?.();
|
|
17
|
+
};
|
|
18
|
+
container.addEventListener('scroll', handleScroll);
|
|
19
|
+
return ()=>container.removeEventListener('scroll', handleScroll);
|
|
20
|
+
}, [
|
|
21
|
+
hasMore,
|
|
22
|
+
loadingMore,
|
|
23
|
+
onLoadMore
|
|
24
|
+
]);
|
|
10
25
|
const handleChangeUserList = (userId, e)=>{
|
|
11
26
|
let newUserIds = listUserId.slice();
|
|
12
27
|
if (e.target.checked) onListUserIdChange([
|
|
@@ -18,16 +33,13 @@ function SearchUserGroupUser(props) {
|
|
|
18
33
|
onListUserIdChange(newUserIds);
|
|
19
34
|
}
|
|
20
35
|
};
|
|
21
|
-
const handleSearch = (searchString)=>{
|
|
22
|
-
setKeyWordSearch(searchString);
|
|
23
|
-
if (onSearch) onSearch(searchString);
|
|
24
|
-
};
|
|
25
36
|
return /*#__PURE__*/ jsxs(Paper, {
|
|
26
37
|
sx: (theme)=>({
|
|
27
|
-
padding:
|
|
38
|
+
padding: theme.spacing(3),
|
|
28
39
|
border: theme.palette.background.paper,
|
|
29
40
|
minHeight: '200px',
|
|
30
|
-
position: 'relative'
|
|
41
|
+
position: 'relative',
|
|
42
|
+
height: '89vh'
|
|
31
43
|
}),
|
|
32
44
|
children: [
|
|
33
45
|
/*#__PURE__*/ jsx(SearchBox, {
|
|
@@ -36,7 +48,7 @@ function SearchUserGroupUser(props) {
|
|
|
36
48
|
width: '100%'
|
|
37
49
|
},
|
|
38
50
|
onSearch: (_searchType, searchString)=>{
|
|
39
|
-
|
|
51
|
+
onSearch?.(searchString);
|
|
40
52
|
}
|
|
41
53
|
}),
|
|
42
54
|
loading ? /*#__PURE__*/ jsx(Grid, {
|
|
@@ -46,31 +58,44 @@ function SearchUserGroupUser(props) {
|
|
|
46
58
|
mt: 3
|
|
47
59
|
},
|
|
48
60
|
children: /*#__PURE__*/ jsx(CircularProgress, {})
|
|
49
|
-
}) : users && users
|
|
50
|
-
|
|
61
|
+
}) : users && users.length > 0 ? /*#__PURE__*/ jsxs(Box, {
|
|
62
|
+
ref: scrollContainerRef,
|
|
51
63
|
sx: {
|
|
64
|
+
maxHeight: '90%',
|
|
65
|
+
overflowY: 'auto',
|
|
52
66
|
mt: 3
|
|
53
67
|
},
|
|
54
|
-
children:
|
|
55
|
-
|
|
56
|
-
|
|
57
|
-
|
|
58
|
-
|
|
59
|
-
|
|
68
|
+
children: [
|
|
69
|
+
/*#__PURE__*/ jsx(Grid, {
|
|
70
|
+
container: true,
|
|
71
|
+
children: users.map((user, key)=>/*#__PURE__*/ jsx(Grid, {
|
|
72
|
+
size: {
|
|
73
|
+
xs: 12,
|
|
74
|
+
sm: 6,
|
|
75
|
+
md: 4,
|
|
76
|
+
lg: 3
|
|
77
|
+
},
|
|
78
|
+
children: /*#__PURE__*/ jsx(FormControlLabel, {
|
|
79
|
+
control: /*#__PURE__*/ jsx(Checkbox, {
|
|
80
|
+
color: "primary",
|
|
81
|
+
checked: some(listUserId, (id)=>id === user.id),
|
|
82
|
+
onChange: (e)=>void 0 !== user.id && handleChangeUserList(user.id, e),
|
|
83
|
+
value: user.id
|
|
84
|
+
}),
|
|
85
|
+
label: user.username
|
|
86
|
+
})
|
|
87
|
+
}, key))
|
|
88
|
+
}),
|
|
89
|
+
loadingMore && /*#__PURE__*/ jsx(Grid, {
|
|
90
|
+
container: true,
|
|
91
|
+
justifyContent: "center",
|
|
92
|
+
sx: {
|
|
93
|
+
py: 1
|
|
60
94
|
},
|
|
61
|
-
children: /*#__PURE__*/ jsx(
|
|
62
|
-
|
|
63
|
-
|
|
64
|
-
|
|
65
|
-
onChange: (e)=>void 0 !== user.id && handleChangeUserList(user.id, e),
|
|
66
|
-
value: user.id
|
|
67
|
-
}),
|
|
68
|
-
label: user.username
|
|
69
|
-
})
|
|
70
|
-
}, key))
|
|
71
|
-
}) : /*#__PURE__*/ jsx(Fragment, {
|
|
72
|
-
children: keyWordSearch ? /*#__PURE__*/ jsx(NoData, {}) : null
|
|
73
|
-
})
|
|
95
|
+
children: /*#__PURE__*/ jsx(CircularProgress, {})
|
|
96
|
+
})
|
|
97
|
+
]
|
|
98
|
+
}) : /*#__PURE__*/ jsx(NoData, {})
|
|
74
99
|
]
|
|
75
100
|
});
|
|
76
101
|
}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"container.d.ts","sourceRoot":"","sources":["../../../../../src/Features/SYSTEM/Group/SearchUser/container.tsx"],"names":[],"mappings":"AACA,OAAO,EAAE,IAAI,EAAE,MAAM,4BAA4B,CAAC;
|
|
1
|
+
{"version":3,"file":"container.d.ts","sourceRoot":"","sources":["../../../../../src/Features/SYSTEM/Group/SearchUser/container.tsx"],"names":[],"mappings":"AACA,OAAO,EAAE,IAAI,EAAE,MAAM,4BAA4B,CAAC;AASlD,UAAU,YAAY;IAClB,aAAa,EAAE,IAAI,EAAE,CAAC;IACtB,eAAe,CAAC,EAAE,CAAC,KAAK,EAAE,IAAI,EAAE,KAAK,IAAI,CAAC;CAC7C;AAID,QAAA,MAAM,OAAO,UAAW,YAAY,4CA4InC,CAAC;AAEF,eAAe,OAAO,CAAC"}
|
|
@@ -6,13 +6,19 @@ import { useTranslation } from "react-i18next";
|
|
|
6
6
|
import { ClassicDrawer } from "../../../../Commons/index.js";
|
|
7
7
|
import { useContextGroup } from "../context.js";
|
|
8
8
|
import component from "./component.js";
|
|
9
|
+
import { convertArrayFiltersToCondition } from "../../../../index.js";
|
|
10
|
+
const PAGE_SIZE = 50;
|
|
9
11
|
const AddUser = (props)=>{
|
|
10
12
|
const { t } = useTranslation();
|
|
11
13
|
const { usersSelected, onChangeAddUser = ()=>null } = props;
|
|
12
14
|
const [listUserId, setListUserId] = useState([]);
|
|
13
15
|
const [usersData, setUsersData] = useState([]);
|
|
14
16
|
const [loading, setLoading] = useState(false);
|
|
17
|
+
const [loadingMore, setLoadingMore] = useState(false);
|
|
18
|
+
const [hasMore, setHasMore] = useState(false);
|
|
15
19
|
const usersCache = useRef({});
|
|
20
|
+
const searchStringRef = useRef('');
|
|
21
|
+
const skipRef = useRef(0);
|
|
16
22
|
const { services } = useContextGroup();
|
|
17
23
|
useEffect(()=>{
|
|
18
24
|
setListUserId(usersSelected.length > 0 ? usersSelected.map((item)=>item.id).filter((id)=>void 0 !== id) : []);
|
|
@@ -27,45 +33,65 @@ const AddUser = (props)=>{
|
|
|
27
33
|
};
|
|
28
34
|
const handleSubmitUser = (userIds)=>{
|
|
29
35
|
const newUserIds = lodash.differenceWith(userIds, usersSelected, (a, b)=>a === b.id);
|
|
30
|
-
const newUsers =
|
|
31
|
-
|
|
32
|
-
|
|
33
|
-
|
|
34
|
-
|
|
35
|
-
|
|
36
|
-
|
|
37
|
-
|
|
38
|
-
})
|
|
39
|
-
];
|
|
36
|
+
const newUsers = newUserIds.map((userId)=>{
|
|
37
|
+
const user = usersCache.current[userId];
|
|
38
|
+
return {
|
|
39
|
+
id: userId,
|
|
40
|
+
username: user?.username ?? '',
|
|
41
|
+
name: user?.name ?? ''
|
|
42
|
+
};
|
|
43
|
+
});
|
|
40
44
|
onChangeAddUser(newUsers);
|
|
41
45
|
};
|
|
42
|
-
const fetchUsers = (searchString)=>{
|
|
43
|
-
if (services?.getUsers)
|
|
44
|
-
|
|
45
|
-
|
|
46
|
+
const fetchUsers = (searchString, skip, isLoadMore)=>{
|
|
47
|
+
if (!services?.getUsers) return;
|
|
48
|
+
isLoadMore ? setLoadingMore(true) : setLoading(true);
|
|
49
|
+
services.getUsers({
|
|
50
|
+
input: {
|
|
46
51
|
where: {
|
|
47
|
-
|
|
48
|
-
|
|
49
|
-
|
|
50
|
-
|
|
51
|
-
|
|
52
|
-
|
|
53
|
-
|
|
54
|
-
|
|
55
|
-
|
|
56
|
-
|
|
57
|
-
|
|
52
|
+
...convertArrayFiltersToCondition([
|
|
53
|
+
{
|
|
54
|
+
key: 'name',
|
|
55
|
+
value: searchString.trim(),
|
|
56
|
+
type: 'contains'
|
|
57
|
+
}
|
|
58
|
+
])
|
|
59
|
+
},
|
|
60
|
+
skip,
|
|
61
|
+
take: PAGE_SIZE
|
|
62
|
+
}
|
|
63
|
+
}).then((data)=>{
|
|
64
|
+
data.users.forEach((user)=>{
|
|
65
|
+
if (void 0 !== user.id) usersCache.current[user.id] = user;
|
|
66
|
+
});
|
|
67
|
+
isLoadMore ? setUsersData((prev)=>[
|
|
68
|
+
...prev,
|
|
69
|
+
...data.users
|
|
70
|
+
]) : setUsersData(data.users);
|
|
71
|
+
setHasMore(skip + data.users.length < data.total);
|
|
72
|
+
}).finally(()=>{
|
|
73
|
+
isLoadMore ? setLoadingMore(false) : setLoading(false);
|
|
74
|
+
});
|
|
58
75
|
};
|
|
59
|
-
const
|
|
60
|
-
|
|
76
|
+
const debouncedFetch = useRef(lodash.debounce((searchString)=>{
|
|
77
|
+
skipRef.current = 0;
|
|
78
|
+
fetchUsers(searchString, 0, false);
|
|
61
79
|
}, 500)).current;
|
|
62
80
|
const handleSearch = (val)=>{
|
|
63
|
-
|
|
81
|
+
searchStringRef.current = val;
|
|
82
|
+
if ('' !== val) debouncedFetch(val);
|
|
64
83
|
else {
|
|
65
|
-
|
|
84
|
+
debouncedFetch.cancel();
|
|
85
|
+
skipRef.current = 0;
|
|
66
86
|
setUsersData([]);
|
|
87
|
+
setHasMore(false);
|
|
67
88
|
}
|
|
68
89
|
};
|
|
90
|
+
const handleLoadMore = ()=>{
|
|
91
|
+
const newSkip = skipRef.current + PAGE_SIZE;
|
|
92
|
+
skipRef.current = newSkip;
|
|
93
|
+
fetchUsers(searchStringRef.current, newSkip, true);
|
|
94
|
+
};
|
|
69
95
|
return /*#__PURE__*/ jsx(ClassicDrawer, {
|
|
70
96
|
title: t('UserGroup.TitleAdd'),
|
|
71
97
|
onSubmit: ()=>new Promise((resolve, _reject)=>{
|
|
@@ -85,7 +111,10 @@ const AddUser = (props)=>{
|
|
|
85
111
|
listUserId: listUserId,
|
|
86
112
|
onListUserIdChange: handleListUserIdChange,
|
|
87
113
|
onSearch: handleSearch,
|
|
88
|
-
loading: loading
|
|
114
|
+
loading: loading,
|
|
115
|
+
loadingMore: loadingMore,
|
|
116
|
+
hasMore: hasMore,
|
|
117
|
+
onLoadMore: handleLoadMore
|
|
89
118
|
})
|
|
90
119
|
})
|
|
91
120
|
});
|
|
@@ -1,5 +1,5 @@
|
|
|
1
1
|
import type { Group, GroupInput } from './types';
|
|
2
|
-
import type { CustomPagingRequestInput
|
|
2
|
+
import type { CustomPagingRequestInput } from '../../types';
|
|
3
3
|
import { User } from '../User/types';
|
|
4
4
|
import { MenuOption, ValueBase } from '../../../AWING/interface';
|
|
5
5
|
import { fetchOptionsType } from '../../../AWING/AsyncAutocomplete';
|
|
@@ -8,7 +8,9 @@ export type GroupServices = {
|
|
|
8
8
|
/** Get Users
|
|
9
9
|
* @param p - PagingQueryInput<Users> - Không truyền param sẽ lấy tất cả Users
|
|
10
10
|
*/
|
|
11
|
-
getUsers: (p?:
|
|
11
|
+
getUsers: (p?: {
|
|
12
|
+
input: CustomPagingRequestInput;
|
|
13
|
+
}) => Promise<{
|
|
12
14
|
users: User[];
|
|
13
15
|
total: number;
|
|
14
16
|
}>;
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Services.d.ts","sourceRoot":"","sources":["../../../../src/Features/SYSTEM/Group/Services.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,KAAK,EAAE,UAAU,EAAE,MAAM,SAAS,CAAC;AACjD,OAAO,KAAK,EAAE,wBAAwB,EAAE,
|
|
1
|
+
{"version":3,"file":"Services.d.ts","sourceRoot":"","sources":["../../../../src/Features/SYSTEM/Group/Services.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,KAAK,EAAE,UAAU,EAAE,MAAM,SAAS,CAAC;AACjD,OAAO,KAAK,EAAE,wBAAwB,EAAE,MAAM,gBAAgB,CAAC;AAC/D,OAAO,EAAE,IAAI,EAAE,MAAM,eAAe,CAAC;AACrC,OAAO,EAAE,UAAU,EAAE,SAAS,EAAE,MAAM,iBAAiB,CAAC;AACxD,OAAO,EAAE,gBAAgB,EAAE,MAAM,yBAAyB,CAAC;AAE3D,MAAM,MAAM,aAAa,GAAG;IAExB,WAAW,EAAE,gBAAgB,CAAC,UAAU,CAAC,SAAS,CAAC,CAAC,CAAC;IACrD;;OAEG;IACH,QAAQ,EAAE,CAAC,CAAC,CAAC,EAAE;QAAE,KAAK,EAAE,wBAAwB,CAAA;KAAE,KAAK,OAAO,CAAC;QAAE,KAAK,EAAE,IAAI,EAAE,CAAC;QAAC,KAAK,EAAE,MAAM,CAAA;KAAE,CAAC,CAAC;IAEjG,SAAS,EAAE,CAAC,CAAC,CAAC,EAAE;QAAE,KAAK,EAAE,wBAAwB,CAAA;KAAE,KAAK,OAAO,CAAC;QAAE,MAAM,EAAE,KAAK,EAAE,CAAC;QAAC,KAAK,EAAE,MAAM,CAAA;KAAE,CAAC,CAAC;IAEpG,yBAAyB;IACzB,WAAW,EAAE,CAAC,CAAC,EAAE;QAAE,EAAE,EAAE,MAAM,CAAA;KAAE,KAAK,IAAI,CAAC;IAEzC,YAAY,EAAE,CAAC,CAAC,EAAE;QAAE,EAAE,EAAE,MAAM,CAAA;KAAE,KAAK,OAAO,CAAC,KAAK,CAAC,CAAC;IAEpD,uBAAuB;IACvB,WAAW,EAAE,CAAC,CAAC,EAAE;QAAE,KAAK,EAAE,UAAU,CAAA;KAAE,KAAK,OAAO,CAAC,IAAI,CAAC,CAAC;IAEzD,yBAAyB;IACzB,WAAW,EAAE,CAAC,CAAC,EAAE;QAAE,KAAK,EAAE,UAAU,CAAC;QAAC,EAAE,EAAE,MAAM,CAAC;QAAC,SAAS,CAAC,EAAE,MAAM,CAAA;KAAE,KAAK,OAAO,CAAC,IAAI,CAAC,CAAC;IAEzF,8BAA8B;IAC9B,SAAS,EAAE,OAAO,CAAC;IAEnB,iCAAiC;IACjC,eAAe,EAAE,OAAO,CAAC;CAC5B,CAAC"}
|