react-hook-core 0.1.4 → 0.1.7
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/lib/com.js +15 -0
- package/lib/components.js +24 -66
- package/lib/core.js +8 -12
- package/lib/diff.js +2 -2
- package/lib/formutil.js +2 -2
- package/lib/index.js +5 -9
- package/lib/reflect.js +268 -0
- package/lib/search.js +579 -0
- package/lib/state.js +4 -4
- package/lib/update.js +7 -20
- package/lib/useEdit.js +43 -28
- package/lib/useSearch.js +33 -50
- package/lib/useView.js +24 -26
- package/package.json +5 -7
- package/src/com.ts +53 -0
- package/src/components.ts +11 -54
- package/src/core.ts +55 -59
- package/src/diff.ts +1 -1
- package/src/formutil.ts +2 -2
- package/src/index.ts +6 -9
- package/src/reflect.ts +244 -0
- package/src/search.ts +600 -0
- package/src/state.ts +1 -1
- package/src/update.ts +7 -19
- package/src/useEdit.ts +50 -34
- package/src/useSearch.ts +29 -42
- package/src/useView.ts +31 -34
- package/tsconfig.json +1 -0
- package/lib/router.js +0 -35
- package/src/router.ts +0 -39
package/src/useEdit.ts
CHANGED
|
@@ -1,17 +1,13 @@
|
|
|
1
1
|
import {useEffect, useState} from 'react';
|
|
2
|
-
import {
|
|
3
|
-
import {clone, makeDiff} from 'reflectx';
|
|
2
|
+
import {useNavigate, useParams} from 'react-router';
|
|
4
3
|
import {Attributes, buildId, createEditStatus, EditStatusConfig, getModelName as getModelName2, hideLoading, initForm, LoadingService, Locale, message, messageByHttpStatus, ResourceService, showLoading, UIService} from './core';
|
|
5
4
|
import {build, createModel as createModel2, EditParameter, GenericService, handleStatus, handleVersion, initPropertyNullInModel, ResultInfo} from './edit';
|
|
6
5
|
import {focusFirstError, readOnly as setReadOnly} from './formutil';
|
|
7
6
|
import {DispatchWithCallback, useMergeState} from './merge';
|
|
8
|
-
import {
|
|
7
|
+
import {clone, makeDiff} from './reflect';
|
|
9
8
|
import {localeOf} from './state';
|
|
10
9
|
import {useUpdate} from './update';
|
|
11
10
|
|
|
12
|
-
function prepareData(data: any): void {
|
|
13
|
-
}
|
|
14
|
-
|
|
15
11
|
export interface BaseEditComponentParam<T, ID> {
|
|
16
12
|
status?: EditStatusConfig;
|
|
17
13
|
backOnSuccess?: boolean;
|
|
@@ -42,7 +38,7 @@ export interface BaseEditComponentParam<T, ID> {
|
|
|
42
38
|
handleDuplicateKey?: (result?: ResultInfo<T>) => void;
|
|
43
39
|
load?: (i: ID|null, callback?: (m: T, showM: (m2: T) => void) => void) => void;
|
|
44
40
|
doSave?: (obj: T, diff?: T, version?: string, isBack?: boolean) => void;
|
|
45
|
-
prepareCustomData?: (data: any) => void; // need to review
|
|
41
|
+
// prepareCustomData?: (data: any) => void; // need to review
|
|
46
42
|
}
|
|
47
43
|
export interface HookBaseEditParameter<T, ID, S> extends BaseEditComponentParam<T, ID> {
|
|
48
44
|
refForm: any;
|
|
@@ -60,24 +56,54 @@ export interface EditComponentParam<T, ID, S> extends BaseEditComponentParam<T,
|
|
|
60
56
|
initialize?: (id: ID|null, ld: (i: ID|null, cb?: (m: T, showF: (model: T) => void) => void) => void, setState2: DispatchWithCallback<Partial<S>>, callback?: (m: T, showF: (model: T) => void) => void) => void;
|
|
61
57
|
callback?: (m: T, showF: (model: T) => void) => void;
|
|
62
58
|
}
|
|
63
|
-
export interface HookPropsEditParameter<T, ID, S, P
|
|
59
|
+
export interface HookPropsEditParameter<T, ID, S, P> extends HookPropsBaseEditParameter<T, ID, S, P> {
|
|
64
60
|
initialize?: (id: ID|null, ld: (i: ID|null, cb?: (m: T, showF: (model: T) => void) => void) => void, setState2: DispatchWithCallback<Partial<S>>, callback?: (m: T, showF: (model: T) => void) => void) => void;
|
|
65
61
|
callback?: (m: T, showF: (model: T) => void) => void;
|
|
66
62
|
}
|
|
67
|
-
export interface HookPropsBaseEditParameter<T, ID, S, P
|
|
63
|
+
export interface HookPropsBaseEditParameter<T, ID, S, P> extends HookBaseEditParameter<T, ID, S> {
|
|
68
64
|
props: P;
|
|
69
|
-
prepareCustomData?: (data: any) => void;
|
|
65
|
+
// prepareCustomData?: (data: any) => void;
|
|
70
66
|
}
|
|
71
67
|
export const useEdit = <T, ID, S>(
|
|
72
68
|
refForm: any,
|
|
73
69
|
initialState: S,
|
|
74
70
|
service: GenericService<T, ID, number|ResultInfo<T>>,
|
|
75
|
-
|
|
76
|
-
|
|
71
|
+
p2: EditParameter,
|
|
72
|
+
p?: EditComponentParam<T, ID, S>
|
|
77
73
|
) => {
|
|
78
|
-
|
|
74
|
+
const params = useParams();
|
|
75
|
+
const baseProps = useCoreEdit(refForm, initialState, service, p2, p);
|
|
76
|
+
useEffect(() => {
|
|
77
|
+
if (refForm) {
|
|
78
|
+
const registerEvents = (p2.ui ? p2.ui.registerEvents : undefined);
|
|
79
|
+
initForm(baseProps.refForm.current, registerEvents);
|
|
80
|
+
}
|
|
81
|
+
const n = baseProps.getModelName(refForm.current);
|
|
82
|
+
const obj: any = {};
|
|
83
|
+
obj[n] = baseProps.createNewModel();
|
|
84
|
+
baseProps.setState(obj);
|
|
85
|
+
let keys: string[]|undefined;
|
|
86
|
+
if (p && !p.keys && service && service.metadata) {
|
|
87
|
+
const metadata = (p.metadata ? p.metadata : service.metadata());
|
|
88
|
+
if (metadata) {
|
|
89
|
+
const meta = build(metadata);
|
|
90
|
+
keys = (p.keys ? p.keys : (meta ? meta.keys : undefined));
|
|
91
|
+
const version = (p.version ? p.version : (meta ? meta.version : undefined));
|
|
92
|
+
p.keys = keys;
|
|
93
|
+
p.version = version;
|
|
94
|
+
}
|
|
95
|
+
}
|
|
96
|
+
const id = buildId<ID>(params, keys);
|
|
97
|
+
if (p && p.initialize) {
|
|
98
|
+
p.initialize(id, baseProps.load, baseProps.setState, p.callback);
|
|
99
|
+
} else {
|
|
100
|
+
baseProps.load(id, p ? p.callback : undefined);
|
|
101
|
+
}
|
|
102
|
+
// eslint-disable-next-line react-hooks/exhaustive-deps
|
|
103
|
+
}, []);
|
|
104
|
+
return {...baseProps};
|
|
79
105
|
};
|
|
80
|
-
export const useEditProps = <T, ID, S, P
|
|
106
|
+
export const useEditProps = <T, ID, S, P>(
|
|
81
107
|
props: P,
|
|
82
108
|
refForm: any,
|
|
83
109
|
initialState: S,
|
|
@@ -85,7 +111,8 @@ export const useEditProps = <T, ID, S, P extends RouteComponentProps>(
|
|
|
85
111
|
p2: EditParameter,
|
|
86
112
|
p?: EditComponentParam<T, ID, S>
|
|
87
113
|
) => {
|
|
88
|
-
const
|
|
114
|
+
const params = useParams();
|
|
115
|
+
const baseProps = useCoreEdit<T, ID, S, P>(refForm, initialState, service, p2, p, props);
|
|
89
116
|
useEffect(() => {
|
|
90
117
|
if (refForm) {
|
|
91
118
|
const registerEvents = (p2.ui ? p2.ui.registerEvents : undefined);
|
|
@@ -106,28 +133,29 @@ export const useEditProps = <T, ID, S, P extends RouteComponentProps>(
|
|
|
106
133
|
p.version = version;
|
|
107
134
|
}
|
|
108
135
|
}
|
|
109
|
-
const id = buildId<ID>(
|
|
136
|
+
const id = buildId<ID>(params, keys);
|
|
110
137
|
if (p && p.initialize) {
|
|
111
138
|
p.initialize(id, baseProps.load, baseProps.setState, p.callback);
|
|
112
139
|
} else {
|
|
113
140
|
baseProps.load(id, p ? p.callback : undefined);
|
|
114
141
|
}
|
|
142
|
+
// eslint-disable-next-line react-hooks/exhaustive-deps
|
|
115
143
|
}, []);
|
|
116
144
|
return {...baseProps};
|
|
117
145
|
};
|
|
118
|
-
export const useEditOneProps = <T, ID, S, P
|
|
146
|
+
export const useEditOneProps = <T, ID, S, P>(p: HookPropsEditParameter<T, ID, S, P>) => {
|
|
119
147
|
return useEditProps(p.props, p.refForm, p.initialState, p.service, p, p);
|
|
120
148
|
};
|
|
121
149
|
export const useEditOne = <T, ID, S>(p: HookBaseEditParameter<T, ID, S>) => {
|
|
122
150
|
return useEdit(p.refForm, p.initialState, p.service, p, p);
|
|
123
151
|
};
|
|
124
152
|
export const useCoreEdit = <T, ID, S, P>(
|
|
125
|
-
props: P|undefined,
|
|
126
153
|
refForm: any,
|
|
127
154
|
initialState: S,
|
|
128
155
|
service: GenericService<T, ID, number|ResultInfo<T>>,
|
|
129
156
|
p1: EditParameter,
|
|
130
|
-
p?: BaseEditComponentParam<T, ID
|
|
157
|
+
p?: BaseEditComponentParam<T, ID>,
|
|
158
|
+
props?: P
|
|
131
159
|
) => {
|
|
132
160
|
/*
|
|
133
161
|
const {
|
|
@@ -135,13 +163,13 @@ export const useCoreEdit = <T, ID, S, P>(
|
|
|
135
163
|
patchable = true,
|
|
136
164
|
addable = true
|
|
137
165
|
} = p; */
|
|
166
|
+
const navigate = useNavigate();
|
|
138
167
|
const addable = (p && p.patchable !== false ? true : undefined);
|
|
139
|
-
const {goBack} = useRouter();
|
|
140
168
|
const back = (event?: React.MouseEvent<HTMLButtonElement, MouseEvent>) => {
|
|
141
169
|
if (event) {
|
|
142
170
|
event.preventDefault();
|
|
143
171
|
}
|
|
144
|
-
|
|
172
|
+
navigate(-1);
|
|
145
173
|
};
|
|
146
174
|
|
|
147
175
|
const [running, setRunning] = useState<boolean>();
|
|
@@ -154,18 +182,6 @@ export const useCoreEdit = <T, ID, S, P>(
|
|
|
154
182
|
};
|
|
155
183
|
const baseProps = useUpdate<S>(initialState, getModelName, p1.getLocale);
|
|
156
184
|
|
|
157
|
-
const prepareCustomData = (p && p.prepareCustomData ? p.prepareCustomData : prepareData);
|
|
158
|
-
const updateDateState = (name: string, value: any) => {
|
|
159
|
-
const modelName = getModelName(refForm.current);
|
|
160
|
-
const currentState = (state as any)[modelName];
|
|
161
|
-
if (props && (props as any).setGlobalState) {
|
|
162
|
-
const data = (props as any).shouldBeCustomized ? prepareCustomData({ [name]: value }) : { [name]: value };
|
|
163
|
-
(props as any).setGlobalState({ [modelName]: { ...currentState, ...data } });
|
|
164
|
-
} else {
|
|
165
|
-
setState({[modelName]: {...currentState, [name]: value}} as T);
|
|
166
|
-
}
|
|
167
|
-
};
|
|
168
|
-
|
|
169
185
|
const { state, setState } = baseProps;
|
|
170
186
|
const [flag, setFlag] = useMergeState({
|
|
171
187
|
newMode: false,
|
|
@@ -462,7 +478,6 @@ export const useCoreEdit = <T, ID, S, P>(
|
|
|
462
478
|
flag,
|
|
463
479
|
running,
|
|
464
480
|
setRunning,
|
|
465
|
-
updateDateState,
|
|
466
481
|
showModel,
|
|
467
482
|
getModelName,
|
|
468
483
|
resetState,
|
|
@@ -472,6 +487,7 @@ export const useCoreEdit = <T, ID, S, P>(
|
|
|
472
487
|
newOnClick: create,
|
|
473
488
|
save,
|
|
474
489
|
onSave,
|
|
490
|
+
// eslint-disable-next-line no-restricted-globals
|
|
475
491
|
confirm,
|
|
476
492
|
validate,
|
|
477
493
|
showMessage: p1.showMessage,
|
package/src/useSearch.ts
CHANGED
|
@@ -1,21 +1,25 @@
|
|
|
1
1
|
import {useEffect, useState} from 'react';
|
|
2
|
-
import {RouteComponentProps} from 'react-router';
|
|
3
|
-
import {useHistory, useRouteMatch} from 'react-router-dom';
|
|
4
|
-
import {clone} from 'reflectx';
|
|
5
|
-
import {addParametersIntoUrl, append, buildMessage, Filter, formatResults, getFieldsFromForm, getModel, handleAppend, handleSort, initFilter, mergeFilter as mergeFilter2, Pagination, removeSortStatus, showPaging, Sortable, validate} from 'search-core';
|
|
6
2
|
import {error, getDecodeFromForm, getName, getRemoveError, getValidateForm, handleToggle, hideLoading, initForm, Locale, PageChange, pageSizes, removeFormError, ResourceService, SearchParameter, SearchResult, SearchService, showLoading} from './core';
|
|
7
3
|
import {DispatchWithCallback, useMergeState} from './merge';
|
|
4
|
+
import {clone} from './reflect';
|
|
8
5
|
import {buildFromUrl} from './route';
|
|
6
|
+
import {addParametersIntoUrl, append, buildMessage, formatResults, getFieldsFromForm, getModel, handleAppend, handleSort, initFilter, mergeFilter as mergeFilter2, Pagination, removeSortStatus, showPaging, Sortable, validate} from './search';
|
|
9
7
|
import {enLocale} from './state';
|
|
10
|
-
import {useUpdate
|
|
8
|
+
import {useUpdate} from './update';
|
|
11
9
|
|
|
12
10
|
export interface Searchable<T> extends Pagination, Sortable {
|
|
13
11
|
nextPageToken?: string;
|
|
14
12
|
excluding?: string[]|number[];
|
|
15
13
|
list?: T[];
|
|
16
14
|
}
|
|
17
|
-
|
|
15
|
+
interface Filter {
|
|
16
|
+
page?: number;
|
|
17
|
+
limit?: number;
|
|
18
|
+
firstLimit?: number;
|
|
19
|
+
fields?: string[];
|
|
20
|
+
sort?: string;
|
|
18
21
|
}
|
|
22
|
+
|
|
19
23
|
export const callSearch = <T, S extends Filter>(se: S, search3: (s: S, limit?: number, offset?: number|string, fields?: string[]) => Promise<SearchResult<T>>, showResults3: (s: S, sr: SearchResult<T>, lc: Locale) => void, searchError3: (err: any) => void, lc: Locale, nextPageToken?: string) => {
|
|
20
24
|
const s = clone(se);
|
|
21
25
|
let page = se.page;
|
|
@@ -53,7 +57,7 @@ export interface InitSearchComponentParam<T, M extends Filter, S> extends Search
|
|
|
53
57
|
createFilter?: () => M;
|
|
54
58
|
initialize?: (ld: (s: M, auto?: boolean) => void, setState2: DispatchWithCallback<Partial<S>>, com?: SearchComponentState<T, M>) => void;
|
|
55
59
|
}
|
|
56
|
-
export interface HookPropsSearchParameter<T, S extends Filter, ST, P
|
|
60
|
+
export interface HookPropsSearchParameter<T, S extends Filter, ST, P> extends HookPropsBaseSearchParameter<T, S, ST, P> {
|
|
57
61
|
createFilter?: () => S;
|
|
58
62
|
initialize?: (ld: (s: S, auto?: boolean) => void, setState2: DispatchWithCallback<Partial<ST>>, com?: SearchComponentState<T, S>) => void;
|
|
59
63
|
}
|
|
@@ -80,10 +84,10 @@ export interface SearchComponentParam<T, M extends Filter> {
|
|
|
80
84
|
getModelName?: () => string;
|
|
81
85
|
getCurrencyCode?: () => string;
|
|
82
86
|
setFilter?: (s: M) => void;
|
|
83
|
-
getFilter?: () => M;
|
|
87
|
+
getFilter?: (se?: Searchable<T>) => M;
|
|
84
88
|
getFields?: () => string[]|undefined;
|
|
85
89
|
validateSearch?: (se: M, callback: () => void) => void;
|
|
86
|
-
prepareCustomData?: (data: any) => void;
|
|
90
|
+
// prepareCustomData?: (data: any) => void;
|
|
87
91
|
format?(obj: T, locale?: Locale): T;
|
|
88
92
|
showResults?(s: M, sr: SearchResult<T>, lc: Locale): void;
|
|
89
93
|
appendList?(results: T[], list: T[]|undefined, s: DispatchWithCallback<Partial<SearchComponentState<T, M>>>): void;
|
|
@@ -110,7 +114,7 @@ export interface HookBaseSearchParameter<T, S extends Filter, ST extends SearchC
|
|
|
110
114
|
}
|
|
111
115
|
export interface HookPropsBaseSearchParameter<T, S extends Filter, ST, P> extends HookBaseSearchParameter<T, S, ST> {
|
|
112
116
|
props?: P;
|
|
113
|
-
prepareCustomData?: (data: any) => void;
|
|
117
|
+
// prepareCustomData?: (data: any) => void;
|
|
114
118
|
}
|
|
115
119
|
export interface SearchComponentState<T, S> extends Pagination, Sortable {
|
|
116
120
|
view?: string;
|
|
@@ -138,7 +142,7 @@ export interface SearchComponentState<T, S> extends Pagination, Sortable {
|
|
|
138
142
|
deletable?: boolean;
|
|
139
143
|
}
|
|
140
144
|
|
|
141
|
-
function mergeParam<T, S extends Filter>(p?: SearchComponentParam<T, S>): SearchComponentParam<T, S> {
|
|
145
|
+
export function mergeParam<T, S extends Filter>(p?: SearchComponentParam<T, S>): SearchComponentParam<T, S> {
|
|
142
146
|
if (p) {
|
|
143
147
|
if (!p.sequenceNo) {
|
|
144
148
|
p.sequenceNo = 'sequenceNo';
|
|
@@ -189,7 +193,7 @@ export const useSearch = <T, S extends Filter, ST extends SearchComponentState<T
|
|
|
189
193
|
p2: SearchParameter,
|
|
190
194
|
p?: InitSearchComponentParam<T, S, ST>,
|
|
191
195
|
) => {
|
|
192
|
-
const baseProps = useCoreSearch(
|
|
196
|
+
const baseProps = useCoreSearch(refForm, initialState, service, p2, p);
|
|
193
197
|
|
|
194
198
|
useEffect(() => {
|
|
195
199
|
const { load, setState, component } = baseProps;
|
|
@@ -204,17 +208,17 @@ export const useSearch = <T, S extends Filter, ST extends SearchComponentState<T
|
|
|
204
208
|
const s: any = mergeFilter2(buildFromUrl<S>(), se, component.pageSizes);
|
|
205
209
|
load(s, p2.auto);
|
|
206
210
|
}
|
|
211
|
+
// eslint-disable-next-line react-hooks/exhaustive-deps
|
|
207
212
|
}, []);
|
|
208
213
|
return { ...baseProps };
|
|
209
214
|
};
|
|
210
|
-
export const useSearchOneProps = <T, S extends Filter, ST extends SearchComponentState<T, S>, P
|
|
215
|
+
export const useSearchOneProps = <T, S extends Filter, ST extends SearchComponentState<T, S>, P>(p: HookPropsSearchParameter<T, S, ST, P>) => {
|
|
211
216
|
return useSearch(p.refForm, p.initialState, p.service, p, p);
|
|
212
217
|
};
|
|
213
218
|
export const useSearchOne = <T, S extends Filter, ST extends SearchComponentState<T, S>>(p: HookBaseSearchParameter<T, S, ST>) => {
|
|
214
|
-
return useCoreSearch(
|
|
219
|
+
return useCoreSearch(p.refForm, p.initialState, p.service, p, p);
|
|
215
220
|
};
|
|
216
|
-
export const useCoreSearch = <T, S extends Filter, ST
|
|
217
|
-
props: P|undefined,
|
|
221
|
+
export const useCoreSearch = <T, S extends Filter, ST>(
|
|
218
222
|
refForm: any,
|
|
219
223
|
initialState: ST,
|
|
220
224
|
service: ((s: S, limit?: number, offset?: number|string, fields?: string[]) => Promise<SearchResult<T>>) | SearchService<T, S>,
|
|
@@ -230,28 +234,14 @@ export const useCoreSearch = <T, S extends Filter, ST, P>(
|
|
|
230
234
|
const getModelName = (p && p.getModelName ? p.getModelName : _getModelName);
|
|
231
235
|
|
|
232
236
|
// const setState2: <K extends keyof S, P>(st: ((prevState: Readonly<S>, props: Readonly<P>) => (Pick<S, K> | S | null)) | (Pick<S, K> | S | null), cb?: () => void) => void;
|
|
233
|
-
const baseProps =
|
|
237
|
+
const baseProps = useUpdate<ST>(initialState, getModelName, p1.getLocale, getRemoveError(p1));
|
|
234
238
|
const { state, setState } = baseProps;
|
|
235
|
-
const [history, match] = [useHistory(), useRouteMatch()];
|
|
236
239
|
|
|
237
240
|
const _getCurrencyCode = (): string => {
|
|
238
241
|
return refForm && refForm.current ? refForm.current.getAttribute('currency-code') : null;
|
|
239
242
|
};
|
|
240
243
|
const getCurrencyCode = p && p.getCurrencyCode ? p.getCurrencyCode : _getCurrencyCode;
|
|
241
244
|
|
|
242
|
-
const prepareCustomData = (p && p.prepareCustomData ? p.prepareCustomData : prepareData);
|
|
243
|
-
const updateDateState = (name: string, value: any) => {
|
|
244
|
-
const modelName = getModelName();
|
|
245
|
-
const currentState = (state as any)[modelName];
|
|
246
|
-
if (props && (props as any).setGlobalState) {
|
|
247
|
-
const data = (props as any).shouldBeCustomized ? prepareCustomData({ [name]: value }) : { [name]: value };
|
|
248
|
-
(props as any).setGlobalState({ [modelName]: { ...currentState, ...data } });
|
|
249
|
-
} else {
|
|
250
|
-
setState({ [modelName]: { ...currentState, [name]: value } } as T);
|
|
251
|
-
}
|
|
252
|
-
setState({ [modelName]: { ...currentState, [name]: value } } as T);
|
|
253
|
-
};
|
|
254
|
-
|
|
255
245
|
// const p = createSearchComponentState<T, S>(p1);
|
|
256
246
|
const [component, setComponent] = useMergeState<SearchComponentState<T, S>>(p);
|
|
257
247
|
|
|
@@ -261,11 +251,6 @@ export const useCoreSearch = <T, S extends Filter, ST, P>(
|
|
|
261
251
|
setComponent({ hideFilter: x });
|
|
262
252
|
};
|
|
263
253
|
|
|
264
|
-
const add = (event: any) => {
|
|
265
|
-
event.preventDefault();
|
|
266
|
-
history.push(match.url + '/add');
|
|
267
|
-
};
|
|
268
|
-
|
|
269
254
|
const _getFields = (): string[]|undefined => {
|
|
270
255
|
const { fields, initFields } = component;
|
|
271
256
|
const fs = getFieldsFromForm(fields, initFields, refForm.current);
|
|
@@ -274,7 +259,7 @@ export const useCoreSearch = <T, S extends Filter, ST, P>(
|
|
|
274
259
|
};
|
|
275
260
|
const getFields = p && p.getFields ? p.getFields : _getFields;
|
|
276
261
|
|
|
277
|
-
const
|
|
262
|
+
const _getFilter = (se?: Searchable<T>): S => {
|
|
278
263
|
if (!se) {
|
|
279
264
|
se = component;
|
|
280
265
|
}
|
|
@@ -292,6 +277,7 @@ export const useCoreSearch = <T, S extends Filter, ST, P>(
|
|
|
292
277
|
const obj3 = getModel<T, S>(state, n, se, fs, se.excluding, keys, se.list, refForm.current, getDecodeFromForm(p1), lc, cc);
|
|
293
278
|
return obj3;
|
|
294
279
|
};
|
|
280
|
+
const getFilter = p && p.getFilter ? p.getFilter : _getFilter;
|
|
295
281
|
const _setFilter = (s: S): void => {
|
|
296
282
|
const objSet: any = {};
|
|
297
283
|
const n = getModelName();
|
|
@@ -355,12 +341,15 @@ export const useCoreSearch = <T, S extends Filter, ST, P>(
|
|
|
355
341
|
doSearch(component);
|
|
356
342
|
};
|
|
357
343
|
|
|
358
|
-
const clearQ = (
|
|
344
|
+
const clearQ = (e?: React.MouseEvent<HTMLButtonElement, MouseEvent>) => {
|
|
345
|
+
if (e) {
|
|
346
|
+
e.preventDefault();
|
|
347
|
+
}
|
|
359
348
|
const n = getModelName();
|
|
360
349
|
if (n && n.length > 0) {
|
|
361
350
|
const m = (state as any)[n];
|
|
362
351
|
if (m) {
|
|
363
|
-
m.
|
|
352
|
+
m.q = '';
|
|
364
353
|
const setObj: any = {};
|
|
365
354
|
setObj[n] = m;
|
|
366
355
|
setState(setObj);
|
|
@@ -496,13 +485,11 @@ export const useCoreSearch = <T, S extends Filter, ST, P>(
|
|
|
496
485
|
running,
|
|
497
486
|
setRunning,
|
|
498
487
|
getCurrencyCode,
|
|
499
|
-
updateDateState,
|
|
500
488
|
resource: p1.resource.resource(),
|
|
501
489
|
setComponent,
|
|
502
490
|
component,
|
|
503
491
|
showMessage: p1.showMessage,
|
|
504
492
|
load,
|
|
505
|
-
add,
|
|
506
493
|
search,
|
|
507
494
|
sort,
|
|
508
495
|
changeView,
|
|
@@ -511,7 +498,7 @@ export const useCoreSearch = <T, S extends Filter, ST, P>(
|
|
|
511
498
|
doSearch,
|
|
512
499
|
pageChanged,
|
|
513
500
|
pageSizeChanged,
|
|
514
|
-
|
|
501
|
+
clearQ,
|
|
515
502
|
showResults,
|
|
516
503
|
getFields,
|
|
517
504
|
getModelName,
|
package/src/useView.ts
CHANGED
|
@@ -1,9 +1,8 @@
|
|
|
1
1
|
import {useEffect, useState} from 'react';
|
|
2
|
-
import {
|
|
2
|
+
import {useNavigate, useParams} from 'react-router';
|
|
3
3
|
import {buildId, getModelName as getModelName2, hideLoading, initForm, LoadingService, Locale, message, messageByHttpStatus, ResourceService, showLoading, ViewParameter, ViewService} from './core';
|
|
4
4
|
import {readOnly} from './formutil';
|
|
5
5
|
import {DispatchWithCallback, useMergeState} from './merge';
|
|
6
|
-
import {useRouter} from './router';
|
|
7
6
|
|
|
8
7
|
export interface BaseViewComponentParam<T, ID> {
|
|
9
8
|
name?: string;
|
|
@@ -26,7 +25,7 @@ export interface ViewComponentParam<T, ID, S> extends BaseViewComponentParam<T,
|
|
|
26
25
|
initialize?: (id: ID, ld: (i: ID, cb?: (m: T, showF: (model: T) => void) => void) => void, setState2: DispatchWithCallback<Partial<S>>, callback?: (m: T, showF: (model: T) => void) => void) => void;
|
|
27
26
|
callback?: (m: T, showF: (model: T) => void) => void;
|
|
28
27
|
}
|
|
29
|
-
export interface HookPropsViewParameter<T, ID, S, P
|
|
28
|
+
export interface HookPropsViewParameter<T, ID, S, P> extends HookPropsBaseViewParameter<T, ID, S, P> {
|
|
30
29
|
keys?: string[];
|
|
31
30
|
initialize?: (id: ID, ld: (i: ID, cb?: (m: T, showF: (model: T) => void) => void) => void, setState2: DispatchWithCallback<Partial<S>>, callback?: (m: T, showF: (model: T) => void) => void) => void;
|
|
32
31
|
callback?: (m: T, showF: (model: T) => void) => void;
|
|
@@ -34,13 +33,36 @@ export interface HookPropsViewParameter<T, ID, S, P extends RouteComponentProps>
|
|
|
34
33
|
export interface HookPropsBaseViewParameter<T, ID, S, P> extends HookBaseViewParameter<T, ID, S> {
|
|
35
34
|
props: P;
|
|
36
35
|
}
|
|
37
|
-
export const useViewOneProps = <T, ID, S, P extends RouteComponentProps>(p: HookPropsViewParameter<T, ID, S, P>) => {
|
|
38
|
-
return useViewProps(p.props, p.refForm, p.initialState, p.service, p, p);
|
|
39
|
-
};
|
|
40
36
|
export const useViewOne = <T, ID, S>(p: HookBaseViewParameter<T, ID, S>) => {
|
|
41
|
-
return
|
|
37
|
+
return useCoreView(p.refForm, p.initialState, p.service, p, p);
|
|
42
38
|
};
|
|
43
39
|
export const useView = <T, ID, S>(
|
|
40
|
+
refForm: any,
|
|
41
|
+
initialState: S,
|
|
42
|
+
service: ((id: ID, ctx?: any) => Promise<T>)|ViewService<T, ID>,
|
|
43
|
+
p1: ViewParameter,
|
|
44
|
+
p?: ViewComponentParam<T, ID, S>
|
|
45
|
+
) => {
|
|
46
|
+
const baseProps = useCoreView(refForm, initialState, service, p1, p);
|
|
47
|
+
const [, setState] = useMergeState<S>(initialState);
|
|
48
|
+
const params = useParams();
|
|
49
|
+
useEffect(() => {
|
|
50
|
+
if (baseProps.refForm) {
|
|
51
|
+
initForm(baseProps.refForm.current);
|
|
52
|
+
}
|
|
53
|
+
const id = buildId<ID>(params, p ? p.keys : undefined);
|
|
54
|
+
if (id) {
|
|
55
|
+
if (p && p.initialize) {
|
|
56
|
+
p.initialize(id, baseProps.load, setState, p.callback);
|
|
57
|
+
} else {
|
|
58
|
+
baseProps.load(id, p ? p.callback : undefined);
|
|
59
|
+
}
|
|
60
|
+
}
|
|
61
|
+
}, []);
|
|
62
|
+
return {...baseProps};
|
|
63
|
+
};
|
|
64
|
+
|
|
65
|
+
export const useCoreView = <T, ID, S>(
|
|
44
66
|
refForm: any,
|
|
45
67
|
initialState: S,
|
|
46
68
|
service: ((id: ID, ctx?: any) => Promise<T>)|ViewService<T, ID>,
|
|
@@ -49,13 +71,13 @@ export const useView = <T, ID, S>(
|
|
|
49
71
|
) => {
|
|
50
72
|
const [state, setState] = useMergeState<S>(initialState);
|
|
51
73
|
const [running, setRunning] = useState<boolean>();
|
|
52
|
-
const
|
|
74
|
+
const navigate = useNavigate();
|
|
53
75
|
|
|
54
76
|
const back = (event: any) => {
|
|
55
77
|
if (event) {
|
|
56
78
|
event.preventDefault();
|
|
57
79
|
}
|
|
58
|
-
|
|
80
|
+
navigate(-1);
|
|
59
81
|
};
|
|
60
82
|
|
|
61
83
|
const getModelName = (f?: HTMLFormElement) => {
|
|
@@ -134,28 +156,3 @@ export const useView = <T, ID, S>(
|
|
|
134
156
|
back
|
|
135
157
|
};
|
|
136
158
|
};
|
|
137
|
-
export const useViewProps = <T, ID, S, P extends RouteComponentProps>(
|
|
138
|
-
props: P,
|
|
139
|
-
refForm: any,
|
|
140
|
-
initialState: S,
|
|
141
|
-
service: ((id: ID, ctx?: any) => Promise<T>)|ViewService<T, ID>,
|
|
142
|
-
p1: ViewParameter,
|
|
143
|
-
p?: ViewComponentParam<T, ID, S>
|
|
144
|
-
) => {
|
|
145
|
-
const baseProps = useView(refForm, initialState, service, p1, p);
|
|
146
|
-
const [state, setState] = useMergeState<S>(initialState);
|
|
147
|
-
useEffect(() => {
|
|
148
|
-
if (baseProps.refForm) {
|
|
149
|
-
initForm(baseProps.refForm.current);
|
|
150
|
-
}
|
|
151
|
-
const id = buildId<ID>(props, p ? p.keys : undefined);
|
|
152
|
-
if (id) {
|
|
153
|
-
if (p && p.initialize) {
|
|
154
|
-
p.initialize(id, baseProps.load, setState, p.callback);
|
|
155
|
-
} else {
|
|
156
|
-
baseProps.load(id, p ? p.callback : undefined);
|
|
157
|
-
}
|
|
158
|
-
}
|
|
159
|
-
}, []);
|
|
160
|
-
return {...baseProps};
|
|
161
|
-
};
|
package/tsconfig.json
CHANGED
package/lib/router.js
DELETED
|
@@ -1,35 +0,0 @@
|
|
|
1
|
-
"use strict";
|
|
2
|
-
Object.defineProperty(exports, "__esModule", { value: true });
|
|
3
|
-
var react_1 = require("react");
|
|
4
|
-
var react_router_dom_1 = require("react-router-dom");
|
|
5
|
-
exports.useRouter = function () {
|
|
6
|
-
var _a = [react_router_dom_1.useLocation(), react_router_dom_1.useHistory(), react_router_dom_1.useParams(), react_router_dom_1.useRouteMatch()], location = _a[0], history = _a[1], params = _a[2], match = _a[3];
|
|
7
|
-
var navigate = function (targetUrl) {
|
|
8
|
-
return function (e) {
|
|
9
|
-
if (e) {
|
|
10
|
-
e.preventDefault();
|
|
11
|
-
}
|
|
12
|
-
history.push(targetUrl);
|
|
13
|
-
};
|
|
14
|
-
};
|
|
15
|
-
var back = function (e) {
|
|
16
|
-
if (e) {
|
|
17
|
-
e.preventDefault();
|
|
18
|
-
}
|
|
19
|
-
history.goBack();
|
|
20
|
-
};
|
|
21
|
-
return react_1.useMemo(function () {
|
|
22
|
-
return ({
|
|
23
|
-
push: history.push,
|
|
24
|
-
replace: history.replace,
|
|
25
|
-
pathname: location.pathname,
|
|
26
|
-
goBack: history.goBack,
|
|
27
|
-
match: match,
|
|
28
|
-
location: location,
|
|
29
|
-
history: history,
|
|
30
|
-
params: params,
|
|
31
|
-
navigate: navigate,
|
|
32
|
-
back: back
|
|
33
|
-
});
|
|
34
|
-
}, [match, location, history, params]);
|
|
35
|
-
};
|
package/src/router.ts
DELETED
|
@@ -1,39 +0,0 @@
|
|
|
1
|
-
import {useMemo} from 'react';
|
|
2
|
-
import {useHistory, useLocation, useParams, useRouteMatch} from 'react-router-dom';
|
|
3
|
-
|
|
4
|
-
export const useRouter = () => {
|
|
5
|
-
const [location, history, params, match] = [useLocation(), useHistory(), useParams(), useRouteMatch()];
|
|
6
|
-
/*
|
|
7
|
-
const searchQueries = useMemo(() => {
|
|
8
|
-
return queryString.parse(location.search, { arrayFormat: 'comma', parseNumbers: true });
|
|
9
|
-
}, [location.search]);
|
|
10
|
-
*/
|
|
11
|
-
const navigate = (targetUrl: string) => (e: React.MouseEvent) => {
|
|
12
|
-
if (e) {
|
|
13
|
-
e.preventDefault();
|
|
14
|
-
}
|
|
15
|
-
history.push(targetUrl);
|
|
16
|
-
};
|
|
17
|
-
|
|
18
|
-
|
|
19
|
-
const back = (e: React.MouseEvent) => {
|
|
20
|
-
if (e) {
|
|
21
|
-
e.preventDefault();
|
|
22
|
-
}
|
|
23
|
-
history.goBack();
|
|
24
|
-
};
|
|
25
|
-
|
|
26
|
-
return useMemo(() => ({
|
|
27
|
-
push: history.push,
|
|
28
|
-
replace: history.replace,
|
|
29
|
-
pathname: location.pathname,
|
|
30
|
-
goBack: history.goBack,
|
|
31
|
-
match,
|
|
32
|
-
location,
|
|
33
|
-
history,
|
|
34
|
-
params,
|
|
35
|
-
// searchQueries,
|
|
36
|
-
navigate,
|
|
37
|
-
back
|
|
38
|
-
}), [match, location, history, params]);
|
|
39
|
-
};
|