react-hook-core 0.4.22 → 0.5.0
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/lib/core.js +16 -1
- package/lib/index.js +0 -4
- package/lib/search.js +109 -3
- package/lib/state.js +62 -35
- package/lib/update.js +1 -9
- package/package.json +1 -1
- package/src/core.ts +14 -1
- package/src/index.ts +4 -3
- package/src/search.ts +118 -4
- package/src/state.ts +72 -33
- package/src/update.ts +1 -9
package/lib/core.js
CHANGED
|
@@ -4,7 +4,12 @@ exports.pageSizes = [12, 24, 60, 100, 120, 180, 300, 600]
|
|
|
4
4
|
exports.sizes = exports.pageSizes
|
|
5
5
|
var resources = (function () {
|
|
6
6
|
function resources() {}
|
|
7
|
-
resources.
|
|
7
|
+
resources.removePhoneFormat = function (phone) {
|
|
8
|
+
return phone ? phone.replace(resources.phone, "") : ""
|
|
9
|
+
}
|
|
10
|
+
resources.removeFaxFormat = function (fax) {
|
|
11
|
+
return fax ? fax.replace(resources.fax, "") : ""
|
|
12
|
+
}
|
|
8
13
|
resources._cache = {}
|
|
9
14
|
resources.cache = true
|
|
10
15
|
resources.fields = "fields"
|
|
@@ -13,6 +18,16 @@ var resources = (function () {
|
|
|
13
18
|
resources.defaultLimit = 24
|
|
14
19
|
resources.limits = exports.pageSizes
|
|
15
20
|
resources.pageMaxSize = 7
|
|
21
|
+
resources.phone = / |\-|\.|\(|\)/g
|
|
22
|
+
resources.fax = / |\-|\.|\(|\)/g
|
|
16
23
|
return resources
|
|
17
24
|
})()
|
|
18
25
|
exports.resources = resources
|
|
26
|
+
function removePhoneFormat(phone) {
|
|
27
|
+
return resources.removePhoneFormat(phone)
|
|
28
|
+
}
|
|
29
|
+
exports.removePhoneFormat = removePhoneFormat
|
|
30
|
+
function removeFaxFormat(fax) {
|
|
31
|
+
return resources.removeFaxFormat(fax)
|
|
32
|
+
}
|
|
33
|
+
exports.removeFaxFormat = removeFaxFormat
|
package/lib/index.js
CHANGED
|
@@ -151,10 +151,6 @@ function datetimeToString(date) {
|
|
|
151
151
|
return year + "-" + month + "-" + day + "T" + hours + ":" + minutes + ":" + seconds
|
|
152
152
|
}
|
|
153
153
|
exports.datetimeToString = datetimeToString
|
|
154
|
-
function getNumber(event) {
|
|
155
|
-
return parseInt(event.currentTarget.value, 10)
|
|
156
|
-
}
|
|
157
|
-
exports.getNumber = getNumber
|
|
158
154
|
exports.scrollToFocus = function (e, isUseTimeOut) {
|
|
159
155
|
try {
|
|
160
156
|
var element = e.target
|
package/lib/search.js
CHANGED
|
@@ -1,7 +1,22 @@
|
|
|
1
1
|
"use strict"
|
|
2
|
+
var __assign =
|
|
3
|
+
(this && this.__assign) ||
|
|
4
|
+
function () {
|
|
5
|
+
__assign =
|
|
6
|
+
Object.assign ||
|
|
7
|
+
function (t) {
|
|
8
|
+
for (var s, i = 1, n = arguments.length; i < n; i++) {
|
|
9
|
+
s = arguments[i]
|
|
10
|
+
for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p)) t[p] = s[p]
|
|
11
|
+
}
|
|
12
|
+
return t
|
|
13
|
+
}
|
|
14
|
+
return __assign.apply(this, arguments)
|
|
15
|
+
}
|
|
2
16
|
Object.defineProperty(exports, "__esModule", { value: true })
|
|
3
17
|
var core_1 = require("./core")
|
|
4
18
|
var reflect_1 = require("./reflect")
|
|
19
|
+
var state_1 = require("./state")
|
|
5
20
|
function mergeFilter(obj, b, pageSizes, arrs) {
|
|
6
21
|
var a = b
|
|
7
22
|
if (!b) {
|
|
@@ -316,15 +331,17 @@ function buildSortFilter(obj, sortable) {
|
|
|
316
331
|
var filter = reflect_1.clone(obj)
|
|
317
332
|
if (sortable.sortField && sortable.sortField.length > 0) {
|
|
318
333
|
filter.sort = sortable.sortType === "-" ? "-" + sortable.sortField : sortable.sortField
|
|
334
|
+
obj.sort = filter.sort
|
|
319
335
|
} else {
|
|
320
336
|
delete filter.sort
|
|
337
|
+
delete obj.sort
|
|
321
338
|
}
|
|
322
339
|
delete filter.fields
|
|
323
340
|
return filter
|
|
324
341
|
}
|
|
325
342
|
exports.buildSortFilter = buildSortFilter
|
|
326
|
-
function handleToggle(target,
|
|
327
|
-
var
|
|
343
|
+
function handleToggle(target, off) {
|
|
344
|
+
var on = !off
|
|
328
345
|
if (target) {
|
|
329
346
|
if (on) {
|
|
330
347
|
if (!target.classList.contains("on")) {
|
|
@@ -334,9 +351,98 @@ function handleToggle(target, on) {
|
|
|
334
351
|
target.classList.remove("on")
|
|
335
352
|
}
|
|
336
353
|
}
|
|
337
|
-
return
|
|
354
|
+
return on
|
|
338
355
|
}
|
|
339
356
|
exports.handleToggle = handleToggle
|
|
357
|
+
function getNumber(event) {
|
|
358
|
+
return parseInt(event.currentTarget.value, 10)
|
|
359
|
+
}
|
|
360
|
+
exports.getNumber = getNumber
|
|
361
|
+
function setSortFilter(state, filter, setState, setFilter, search) {
|
|
362
|
+
setSort(state, filter.sort)
|
|
363
|
+
if (setFilter) {
|
|
364
|
+
setFilter(filter)
|
|
365
|
+
}
|
|
366
|
+
if (setState) {
|
|
367
|
+
setState(state)
|
|
368
|
+
}
|
|
369
|
+
if (search) {
|
|
370
|
+
search(true)
|
|
371
|
+
}
|
|
372
|
+
}
|
|
373
|
+
exports.setSortFilter = setSortFilter
|
|
374
|
+
function onToggleSearch(e, showFilter, setShowFilter) {
|
|
375
|
+
var toggleFilter = handleToggle(e.target, showFilter)
|
|
376
|
+
if (setShowFilter) {
|
|
377
|
+
setShowFilter(toggleFilter)
|
|
378
|
+
}
|
|
379
|
+
}
|
|
380
|
+
exports.onToggleSearch = onToggleSearch
|
|
381
|
+
function resetSearch(e, filter, setFilter, search) {
|
|
382
|
+
filter.page = 1
|
|
383
|
+
state_1.updateState(e, filter, setFilter)
|
|
384
|
+
if (search) {
|
|
385
|
+
search()
|
|
386
|
+
}
|
|
387
|
+
}
|
|
388
|
+
exports.resetSearch = resetSearch
|
|
389
|
+
function onClearQ(filter, setFilter, search) {
|
|
390
|
+
filter.q = ""
|
|
391
|
+
if (setFilter) {
|
|
392
|
+
setFilter(__assign({}, filter))
|
|
393
|
+
}
|
|
394
|
+
if (search) {
|
|
395
|
+
search()
|
|
396
|
+
}
|
|
397
|
+
}
|
|
398
|
+
exports.onClearQ = onClearQ
|
|
399
|
+
function onPageSizeChanged(event, search, filter, setFilter) {
|
|
400
|
+
filter.page = 1
|
|
401
|
+
filter.limit = getNumber(event)
|
|
402
|
+
if (setFilter) {
|
|
403
|
+
setFilter(filter)
|
|
404
|
+
}
|
|
405
|
+
search()
|
|
406
|
+
}
|
|
407
|
+
exports.onPageSizeChanged = onPageSizeChanged
|
|
408
|
+
function onPageChanged(data, search, filter, setFilter) {
|
|
409
|
+
var page = data.page,
|
|
410
|
+
size = data.size
|
|
411
|
+
filter.page = page
|
|
412
|
+
filter.limit = size
|
|
413
|
+
if (setFilter) {
|
|
414
|
+
setFilter(filter)
|
|
415
|
+
}
|
|
416
|
+
search()
|
|
417
|
+
}
|
|
418
|
+
exports.onPageChanged = onPageChanged
|
|
419
|
+
function onSearch(event, search, filter, state, setFilter, setState) {
|
|
420
|
+
event.preventDefault()
|
|
421
|
+
removeSortStatus(state.sortTarget)
|
|
422
|
+
filter.page = 1
|
|
423
|
+
state.sortTarget = undefined
|
|
424
|
+
state.sortField = undefined
|
|
425
|
+
if (setFilter) {
|
|
426
|
+
setFilter(filter)
|
|
427
|
+
}
|
|
428
|
+
if (setState) {
|
|
429
|
+
setState(state)
|
|
430
|
+
}
|
|
431
|
+
search()
|
|
432
|
+
}
|
|
433
|
+
exports.onSearch = onSearch
|
|
434
|
+
function onSort(event, search, state, setState) {
|
|
435
|
+
var target = getSortElement(event.target)
|
|
436
|
+
var sort = handleSort(target, state.sortTarget, state.sortField, state.sortType)
|
|
437
|
+
state.sortField = sort.field
|
|
438
|
+
state.sortType = sort.type
|
|
439
|
+
state.sortTarget = target
|
|
440
|
+
if (setState) {
|
|
441
|
+
setState(state)
|
|
442
|
+
}
|
|
443
|
+
search()
|
|
444
|
+
}
|
|
445
|
+
exports.onSort = onSort
|
|
340
446
|
function getSortElement(target) {
|
|
341
447
|
return target.nodeName === "I" ? target.parentElement : target
|
|
342
448
|
}
|
package/lib/state.js
CHANGED
|
@@ -14,6 +14,7 @@ var __assign =
|
|
|
14
14
|
return __assign.apply(this, arguments)
|
|
15
15
|
}
|
|
16
16
|
Object.defineProperty(exports, "__esModule", { value: true })
|
|
17
|
+
var core_1 = require("./core")
|
|
17
18
|
var reflect_1 = require("./reflect")
|
|
18
19
|
var util_1 = require("./util")
|
|
19
20
|
function getDecimalSeparator(ele) {
|
|
@@ -29,45 +30,56 @@ function getDecimalSeparator(ele) {
|
|
|
29
30
|
exports.getDecimalSeparator = getDecimalSeparator
|
|
30
31
|
var r1 = / |,|\$|€|£|¥|'|٬|،| /g
|
|
31
32
|
var r2 = / |\.|\$|€|£|¥|'|٬|،| /g
|
|
32
|
-
function
|
|
33
|
+
function updateNumber(e, o, setObj, decimalSeparator, callback, formatStr) {
|
|
33
34
|
var ctrl = e.target
|
|
35
|
+
var v0 = formatStr ? formatStr(ctrl.value) : ctrl.value
|
|
36
|
+
var dataField = ctrl.getAttribute("data-field")
|
|
37
|
+
var field = dataField ? dataField : ctrl.name
|
|
38
|
+
var v = decimalSeparator === "," ? v0.replace(r2, "") : v0.replace(r1, "")
|
|
39
|
+
if (v.indexOf(",") >= 0) {
|
|
40
|
+
v = v.replace(",", ".")
|
|
41
|
+
}
|
|
42
|
+
var val = isNaN(v) ? undefined : parseInt(v)
|
|
43
|
+
reflect_1.setValue(o, field, val)
|
|
44
|
+
setObj(__assign({}, o))
|
|
45
|
+
if (callback) {
|
|
46
|
+
callback()
|
|
47
|
+
}
|
|
48
|
+
}
|
|
49
|
+
exports.updateNumber = updateNumber
|
|
50
|
+
function formatAndUpdateState(e, o, setObj, formatStr, callback) {
|
|
51
|
+
updateState(e, o, setObj, callback, formatStr)
|
|
52
|
+
}
|
|
53
|
+
exports.formatAndUpdateState = formatAndUpdateState
|
|
54
|
+
function updateState(e, o, setObj, callback, formatStr) {
|
|
55
|
+
var ctrl = e.target
|
|
56
|
+
var v0 = formatStr ? formatStr(ctrl.value) : ctrl.value
|
|
34
57
|
var dataField = ctrl.getAttribute("data-field")
|
|
35
58
|
var field = dataField ? dataField : ctrl.name
|
|
36
59
|
if (ctrl.tagName === "SELECT") {
|
|
37
60
|
if (ctrl.tagName === "SELECT") {
|
|
38
|
-
if (
|
|
61
|
+
if (v0 === "" || !v0) {
|
|
39
62
|
ctrl.removeAttribute("data-value")
|
|
40
63
|
} else {
|
|
41
|
-
ctrl.setAttribute("data-value",
|
|
64
|
+
ctrl.setAttribute("data-value", v0)
|
|
42
65
|
}
|
|
43
66
|
}
|
|
44
|
-
reflect_1.setValue(o, field,
|
|
67
|
+
reflect_1.setValue(o, field, v0)
|
|
45
68
|
} else {
|
|
46
69
|
var stype = ctrl.getAttribute("type")
|
|
47
70
|
var type = stype ? stype.toLowerCase() : "text"
|
|
48
71
|
var model = o
|
|
49
|
-
if (type === "
|
|
50
|
-
var datatype = ctrl.getAttribute("data-type")
|
|
51
|
-
if (datatype === "number" || datatype === "integer") {
|
|
52
|
-
var decimalSeparator = getDecimalSeparator(ctrl)
|
|
53
|
-
var v0 = ctrl.value
|
|
54
|
-
var v = decimalSeparator === "," ? v0.replace(r2, "") : v0.replace(r1, "")
|
|
55
|
-
var val = isNaN(v) ? undefined : parseFloat(v)
|
|
56
|
-
reflect_1.setValue(o, field, val)
|
|
57
|
-
} else {
|
|
58
|
-
reflect_1.setValue(o, field, ctrl.value)
|
|
59
|
-
}
|
|
60
|
-
} else if (type === "checkbox") {
|
|
72
|
+
if (type === "checkbox") {
|
|
61
73
|
var value = model[field]
|
|
62
74
|
if (ctrl.id && ctrl.name !== ctrl.id) {
|
|
63
75
|
if (!value || !Array.isArray(value)) {
|
|
64
76
|
value = []
|
|
65
77
|
}
|
|
66
|
-
value.includes(
|
|
78
|
+
value.includes(v0)
|
|
67
79
|
? (value = value.filter(function (v) {
|
|
68
|
-
return v !==
|
|
80
|
+
return v !== v0
|
|
69
81
|
}))
|
|
70
|
-
: value.push(
|
|
82
|
+
: value.push(v0)
|
|
71
83
|
model[field] = value
|
|
72
84
|
} else {
|
|
73
85
|
var v = valueOfCheckbox(ctrl)
|
|
@@ -75,31 +87,46 @@ function updateState(e, o, setObj) {
|
|
|
75
87
|
}
|
|
76
88
|
} else if (type === "radio") {
|
|
77
89
|
if (field.indexOf(".") < 0 && field.indexOf("[") < 0) {
|
|
78
|
-
model[field] =
|
|
90
|
+
model[field] = v0
|
|
79
91
|
} else {
|
|
80
|
-
reflect_1.setValue(model, field,
|
|
92
|
+
reflect_1.setValue(model, field, v0)
|
|
81
93
|
}
|
|
82
94
|
} else if (type === "date" || type === "datetime-local") {
|
|
83
|
-
|
|
84
|
-
|
|
85
|
-
|
|
86
|
-
} catch (error) {
|
|
87
|
-
console.error("Error occurred while formatting date:", error)
|
|
88
|
-
}
|
|
95
|
+
var date = new Date(v0)
|
|
96
|
+
var val = !isNaN(date.getTime()) ? date.toISOString() : null
|
|
97
|
+
reflect_1.setValue(model, field, val)
|
|
89
98
|
} else if (type === "time") {
|
|
90
|
-
var
|
|
91
|
-
|
|
92
|
-
|
|
93
|
-
|
|
94
|
-
|
|
95
|
-
console.error("Error occurred while formatting time:", error)
|
|
99
|
+
var date = new Date(v0)
|
|
100
|
+
if (!isNaN(date.getTime())) {
|
|
101
|
+
reflect_1.setValue(model, field, date.getTime())
|
|
102
|
+
} else {
|
|
103
|
+
reflect_1.setValue(model, field, null)
|
|
96
104
|
}
|
|
97
|
-
return objSet
|
|
98
105
|
} else {
|
|
99
|
-
|
|
106
|
+
var datatype = ctrl.getAttribute("data-type")
|
|
107
|
+
if (datatype === "phone") {
|
|
108
|
+
var val = core_1.removePhoneFormat(v0)
|
|
109
|
+
reflect_1.setValue(o, field, val)
|
|
110
|
+
} else if (datatype === "fax") {
|
|
111
|
+
var val = core_1.removeFaxFormat(v0)
|
|
112
|
+
reflect_1.setValue(o, field, val)
|
|
113
|
+
} else if (datatype === "number" || datatype === "int") {
|
|
114
|
+
var decimalSeparator = getDecimalSeparator(ctrl)
|
|
115
|
+
var v = decimalSeparator === "," ? v0.replace(r2, "") : v0.replace(r1, "")
|
|
116
|
+
if (v.indexOf(",") >= 0) {
|
|
117
|
+
v = v.replace(",", ".")
|
|
118
|
+
}
|
|
119
|
+
var val = isNaN(v) ? undefined : parseFloat(v)
|
|
120
|
+
reflect_1.setValue(o, field, val)
|
|
121
|
+
} else {
|
|
122
|
+
reflect_1.setValue(o, field, v0)
|
|
123
|
+
}
|
|
100
124
|
}
|
|
101
125
|
}
|
|
102
126
|
setObj(__assign({}, o))
|
|
127
|
+
if (callback) {
|
|
128
|
+
callback()
|
|
129
|
+
}
|
|
103
130
|
}
|
|
104
131
|
exports.updateState = updateState
|
|
105
132
|
exports.enLocale = {
|
package/lib/update.js
CHANGED
|
@@ -17,14 +17,6 @@ Object.defineProperty(exports, "__esModule", { value: true })
|
|
|
17
17
|
var react_1 = require("react")
|
|
18
18
|
var core_1 = require("./core")
|
|
19
19
|
var state_1 = require("./state")
|
|
20
|
-
function removePhoneFormat(phone) {
|
|
21
|
-
if (phone) {
|
|
22
|
-
return phone.replace(core_1.resources.phone, "")
|
|
23
|
-
} else {
|
|
24
|
-
return phone
|
|
25
|
-
}
|
|
26
|
-
}
|
|
27
|
-
exports.removePhoneFormat = removePhoneFormat
|
|
28
20
|
function getModelName(form, name) {
|
|
29
21
|
if (form) {
|
|
30
22
|
var a = form.getAttribute("model-name")
|
|
@@ -90,7 +82,7 @@ exports.useUpdate = function (initialState, getName, getLocale, removeErr) {
|
|
|
90
82
|
var updatePhoneState = function (event) {
|
|
91
83
|
var re = /^[0-9\b]+$/
|
|
92
84
|
var target = event.currentTarget
|
|
93
|
-
var value = removePhoneFormat(target.value)
|
|
85
|
+
var value = core_1.removePhoneFormat(target.value)
|
|
94
86
|
if (re.test(value) || !value) {
|
|
95
87
|
updateState(event)
|
|
96
88
|
} else {
|
package/package.json
CHANGED
package/src/core.ts
CHANGED
|
@@ -6,7 +6,6 @@ export const pageSizes = [12, 24, 60, 100, 120, 180, 300, 600]
|
|
|
6
6
|
export const sizes = pageSizes
|
|
7
7
|
// tslint:disable-next-line:class-name
|
|
8
8
|
export class resources {
|
|
9
|
-
static phone = / |\-|\.|\(|\)/g
|
|
10
9
|
static _cache: any = {}
|
|
11
10
|
static cache = true
|
|
12
11
|
static fields = "fields"
|
|
@@ -15,6 +14,20 @@ export class resources {
|
|
|
15
14
|
static defaultLimit = 24
|
|
16
15
|
static limits = pageSizes
|
|
17
16
|
static pageMaxSize = 7
|
|
17
|
+
static phone = / |\-|\.|\(|\)/g
|
|
18
|
+
static fax = / |\-|\.|\(|\)/g
|
|
19
|
+
static removePhoneFormat(phone?: string | null): string {
|
|
20
|
+
return phone ? phone.replace(resources.phone, "") : ""
|
|
21
|
+
}
|
|
22
|
+
static removeFaxFormat(fax?: string | null): string {
|
|
23
|
+
return fax ? fax.replace(resources.fax, "") : ""
|
|
24
|
+
}
|
|
25
|
+
}
|
|
26
|
+
export function removePhoneFormat(phone?: string | null): string {
|
|
27
|
+
return resources.removePhoneFormat(phone)
|
|
28
|
+
}
|
|
29
|
+
export function removeFaxFormat(fax?: string | null): string {
|
|
30
|
+
return resources.removeFaxFormat(fax)
|
|
18
31
|
}
|
|
19
32
|
|
|
20
33
|
export interface StringMap {
|
package/src/index.ts
CHANGED
|
@@ -14,6 +14,10 @@ export * from "./useEdit"
|
|
|
14
14
|
export * from "./useMessage"
|
|
15
15
|
export * from "./useSearch"
|
|
16
16
|
export * from "./util"
|
|
17
|
+
|
|
18
|
+
export type ButtonMouseEvent = React.MouseEvent<HTMLButtonElement, MouseEvent>
|
|
19
|
+
export type SelectChangeEvent = ChangeEvent<HTMLSelectElement>
|
|
20
|
+
export type InputChangeEvent = ChangeEvent<HTMLInputElement>
|
|
17
21
|
/*
|
|
18
22
|
type CallBackType<T> = (updatedValue: T) => void;
|
|
19
23
|
type SetStateType<T> = T | ((prev: T) => T);
|
|
@@ -199,9 +203,6 @@ export function datetimeToString(date?: Date | string): string | undefined {
|
|
|
199
203
|
const seconds = String(d2.getSeconds()).padStart(2, "0")
|
|
200
204
|
return `${year}-${month}-${day}T${hours}:${minutes}:${seconds}`
|
|
201
205
|
}
|
|
202
|
-
export function getNumber(event: ChangeEvent<HTMLSelectElement | HTMLInputElement>): number {
|
|
203
|
-
return parseInt(event.currentTarget.value, 10)
|
|
204
|
-
}
|
|
205
206
|
|
|
206
207
|
export const scrollToFocus = (e: any, isUseTimeOut?: boolean) => {
|
|
207
208
|
try {
|
package/src/search.ts
CHANGED
|
@@ -1,5 +1,7 @@
|
|
|
1
|
+
import { ChangeEvent } from "react"
|
|
1
2
|
import { resources, StringMap } from "./core"
|
|
2
3
|
import { clone } from "./reflect"
|
|
4
|
+
import { updateState } from "./state"
|
|
3
5
|
|
|
4
6
|
export interface PageChange {
|
|
5
7
|
page: number // currentPage
|
|
@@ -351,14 +353,16 @@ export function buildSortFilter<S extends Filter>(obj: S, sortable: Sortable): S
|
|
|
351
353
|
const filter: any = clone(obj)
|
|
352
354
|
if (sortable.sortField && sortable.sortField.length > 0) {
|
|
353
355
|
filter.sort = sortable.sortType === "-" ? "-" + sortable.sortField : sortable.sortField
|
|
356
|
+
obj.sort = filter.sort
|
|
354
357
|
} else {
|
|
355
358
|
delete filter.sort
|
|
359
|
+
delete obj.sort
|
|
356
360
|
}
|
|
357
361
|
delete filter.fields
|
|
358
362
|
return filter
|
|
359
363
|
}
|
|
360
|
-
export function handleToggle(target?: HTMLElement,
|
|
361
|
-
const
|
|
364
|
+
export function handleToggle(target?: HTMLElement, off?: boolean): boolean {
|
|
365
|
+
const on = !off
|
|
362
366
|
if (target) {
|
|
363
367
|
if (on) {
|
|
364
368
|
if (!target.classList.contains("on")) {
|
|
@@ -368,9 +372,120 @@ export function handleToggle(target?: HTMLElement, on?: boolean): boolean {
|
|
|
368
372
|
target.classList.remove("on")
|
|
369
373
|
}
|
|
370
374
|
}
|
|
371
|
-
return
|
|
375
|
+
return on
|
|
376
|
+
}
|
|
377
|
+
export function getNumber(event: ChangeEvent<HTMLSelectElement | HTMLInputElement>): number {
|
|
378
|
+
return parseInt(event.currentTarget.value, 10)
|
|
372
379
|
}
|
|
373
380
|
|
|
381
|
+
export function setSortFilter<F extends Filter, T extends Sortable>(
|
|
382
|
+
state: T,
|
|
383
|
+
filter: F,
|
|
384
|
+
setState?: (v: React.SetStateAction<T>) => void,
|
|
385
|
+
setFilter?: (v: React.SetStateAction<F>) => void,
|
|
386
|
+
search?: (first?: boolean) => void,
|
|
387
|
+
) {
|
|
388
|
+
setSort(state, filter.sort)
|
|
389
|
+
if (setFilter) {
|
|
390
|
+
setFilter(filter)
|
|
391
|
+
}
|
|
392
|
+
if (setState) {
|
|
393
|
+
setState(state)
|
|
394
|
+
}
|
|
395
|
+
if (search) {
|
|
396
|
+
search(true)
|
|
397
|
+
}
|
|
398
|
+
}
|
|
399
|
+
export function onToggleSearch(
|
|
400
|
+
e: React.MouseEvent<HTMLButtonElement, MouseEvent>,
|
|
401
|
+
showFilter: boolean,
|
|
402
|
+
setShowFilter?: (v: React.SetStateAction<boolean>) => void,
|
|
403
|
+
) {
|
|
404
|
+
const toggleFilter = handleToggle(e.target as HTMLElement, showFilter)
|
|
405
|
+
if (setShowFilter) {
|
|
406
|
+
setShowFilter(toggleFilter)
|
|
407
|
+
}
|
|
408
|
+
}
|
|
409
|
+
export function resetSearch<T extends Filter>(
|
|
410
|
+
e: ChangeEvent<HTMLInputElement, HTMLInputElement>,
|
|
411
|
+
filter: T,
|
|
412
|
+
setFilter: (v: React.SetStateAction<T>) => void,
|
|
413
|
+
search?: () => void,
|
|
414
|
+
) {
|
|
415
|
+
filter.page = 1
|
|
416
|
+
updateState(e, filter, setFilter)
|
|
417
|
+
if (search) {
|
|
418
|
+
search()
|
|
419
|
+
}
|
|
420
|
+
}
|
|
421
|
+
export function onClearQ<T extends Filter>(filter: T, setFilter?: (v: React.SetStateAction<T>) => void, search?: () => void) {
|
|
422
|
+
filter.q = ""
|
|
423
|
+
if (setFilter) {
|
|
424
|
+
setFilter({ ...filter })
|
|
425
|
+
}
|
|
426
|
+
if (search) {
|
|
427
|
+
search()
|
|
428
|
+
}
|
|
429
|
+
}
|
|
430
|
+
export function onPageSizeChanged<T extends Filter>(
|
|
431
|
+
event: ChangeEvent<HTMLSelectElement>,
|
|
432
|
+
search: () => void,
|
|
433
|
+
filter: T,
|
|
434
|
+
setFilter?: (v: React.SetStateAction<T>) => void,
|
|
435
|
+
) {
|
|
436
|
+
filter.page = 1
|
|
437
|
+
filter.limit = getNumber(event)
|
|
438
|
+
if (setFilter) {
|
|
439
|
+
setFilter(filter)
|
|
440
|
+
}
|
|
441
|
+
search()
|
|
442
|
+
}
|
|
443
|
+
export function onPageChanged<T extends Filter>(data: PageChange, search: () => void, filter: T, setFilter?: (v: React.SetStateAction<T>) => void) {
|
|
444
|
+
const { page, size } = data
|
|
445
|
+
filter.page = page
|
|
446
|
+
filter.limit = size
|
|
447
|
+
if (setFilter) {
|
|
448
|
+
setFilter(filter)
|
|
449
|
+
}
|
|
450
|
+
search()
|
|
451
|
+
}
|
|
452
|
+
export function onSearch<F extends Filter, T extends Sortable>(
|
|
453
|
+
event: React.MouseEvent<HTMLButtonElement, MouseEvent>,
|
|
454
|
+
search: () => void,
|
|
455
|
+
filter: F,
|
|
456
|
+
state: T,
|
|
457
|
+
setFilter?: (v: React.SetStateAction<F>) => void,
|
|
458
|
+
setState?: (v: React.SetStateAction<T>) => void,
|
|
459
|
+
): void {
|
|
460
|
+
event.preventDefault()
|
|
461
|
+
removeSortStatus(state.sortTarget)
|
|
462
|
+
filter.page = 1
|
|
463
|
+
state.sortTarget = undefined
|
|
464
|
+
state.sortField = undefined
|
|
465
|
+
if (setFilter) {
|
|
466
|
+
setFilter(filter)
|
|
467
|
+
}
|
|
468
|
+
if (setState) {
|
|
469
|
+
setState(state)
|
|
470
|
+
}
|
|
471
|
+
search()
|
|
472
|
+
}
|
|
473
|
+
export function onSort<T extends Sortable>(
|
|
474
|
+
event: React.MouseEvent<HTMLButtonElement, MouseEvent>,
|
|
475
|
+
search: () => void,
|
|
476
|
+
state: T,
|
|
477
|
+
setState?: (v: React.SetStateAction<T>) => void,
|
|
478
|
+
) {
|
|
479
|
+
const target = getSortElement(event.target as HTMLElement)
|
|
480
|
+
const sort = handleSort(target, state.sortTarget, state.sortField, state.sortType)
|
|
481
|
+
state.sortField = sort.field
|
|
482
|
+
state.sortType = sort.type
|
|
483
|
+
state.sortTarget = target
|
|
484
|
+
if (setState) {
|
|
485
|
+
setState(state)
|
|
486
|
+
}
|
|
487
|
+
search()
|
|
488
|
+
}
|
|
374
489
|
export function getSortElement(target: HTMLElement): HTMLElement {
|
|
375
490
|
return target.nodeName === "I" ? (target.parentElement as HTMLElement) : target
|
|
376
491
|
}
|
|
@@ -383,7 +498,6 @@ export function handleSort(target: HTMLElement, previousTarget?: HTMLElement, so
|
|
|
383
498
|
}
|
|
384
499
|
return s
|
|
385
500
|
}
|
|
386
|
-
|
|
387
501
|
export function sort(preField?: string, preSortType?: string, field?: string, sortType?: string): Sort {
|
|
388
502
|
if (!preField || preField === "") {
|
|
389
503
|
const s: Sort = {
|
package/src/state.ts
CHANGED
|
@@ -1,5 +1,5 @@
|
|
|
1
1
|
import { ChangeEvent } from "react"
|
|
2
|
-
import { Locale } from "./core"
|
|
2
|
+
import { Locale, removeFaxFormat, removePhoneFormat } from "./core"
|
|
3
3
|
import { setValue } from "./reflect"
|
|
4
4
|
import { valueOf } from "./util"
|
|
5
5
|
|
|
@@ -16,45 +16,69 @@ export function getDecimalSeparator(ele: HTMLInputElement): string {
|
|
|
16
16
|
|
|
17
17
|
const r1 = / |,|\$|€|£|¥|'|٬|،| /g
|
|
18
18
|
const r2 = / |\.|\$|€|£|¥|'|٬|،| /g
|
|
19
|
+
export function updateNumber<T>(
|
|
20
|
+
e: ChangeEvent<HTMLInputElement, HTMLInputElement>,
|
|
21
|
+
o: T,
|
|
22
|
+
setObj: (v: React.SetStateAction<T>) => void,
|
|
23
|
+
decimalSeparator?: string,
|
|
24
|
+
callback?: () => void,
|
|
25
|
+
formatStr?: (s?: string) => string,
|
|
26
|
+
) {
|
|
27
|
+
const ctrl = e.target
|
|
28
|
+
const v0: string = formatStr ? formatStr(ctrl.value) : ctrl.value
|
|
29
|
+
const dataField = ctrl.getAttribute("data-field")
|
|
30
|
+
const field = dataField ? dataField : ctrl.name
|
|
31
|
+
let v = decimalSeparator === "," ? v0.replace(r2, "") : v0.replace(r1, "")
|
|
32
|
+
if (v.indexOf(",") >= 0) {
|
|
33
|
+
v = v.replace(",", ".")
|
|
34
|
+
}
|
|
35
|
+
const val = isNaN(v as any) ? undefined : parseInt(v)
|
|
36
|
+
setValue(o, field, val)
|
|
37
|
+
setObj({ ...o })
|
|
38
|
+
if (callback) {
|
|
39
|
+
callback()
|
|
40
|
+
}
|
|
41
|
+
}
|
|
42
|
+
export function formatAndUpdateState<T>(
|
|
43
|
+
e: ChangeEvent<HTMLInputElement, HTMLInputElement> | ChangeEvent<HTMLTextAreaElement, HTMLTextAreaElement>,
|
|
44
|
+
o: T,
|
|
45
|
+
setObj: (v: React.SetStateAction<T>) => void,
|
|
46
|
+
formatStr?: (s?: string) => string,
|
|
47
|
+
callback?: () => void,
|
|
48
|
+
) {
|
|
49
|
+
updateState(e, o, setObj, callback, formatStr)
|
|
50
|
+
}
|
|
19
51
|
export function updateState<T>(
|
|
20
52
|
e: ChangeEvent<HTMLInputElement, HTMLInputElement> | ChangeEvent<HTMLTextAreaElement, HTMLTextAreaElement>,
|
|
21
53
|
o: T,
|
|
22
54
|
setObj: (v: React.SetStateAction<T>) => void,
|
|
55
|
+
callback?: () => void,
|
|
56
|
+
formatStr?: (s?: string) => string,
|
|
23
57
|
) {
|
|
24
58
|
const ctrl = e.target
|
|
59
|
+
const v0: string = formatStr ? formatStr(ctrl.value) : ctrl.value
|
|
25
60
|
const dataField = ctrl.getAttribute("data-field")
|
|
26
61
|
const field = dataField ? dataField : ctrl.name
|
|
27
62
|
if (ctrl.tagName === "SELECT") {
|
|
28
63
|
if (ctrl.tagName === "SELECT") {
|
|
29
|
-
if (
|
|
64
|
+
if (v0 === "" || !v0) {
|
|
30
65
|
ctrl.removeAttribute("data-value")
|
|
31
66
|
} else {
|
|
32
|
-
ctrl.setAttribute("data-value",
|
|
67
|
+
ctrl.setAttribute("data-value", v0)
|
|
33
68
|
}
|
|
34
69
|
}
|
|
35
|
-
setValue(o, field,
|
|
70
|
+
setValue(o, field, v0)
|
|
36
71
|
} else {
|
|
37
72
|
let stype = ctrl.getAttribute("type")
|
|
38
73
|
const type: string = stype ? stype.toLowerCase() : "text"
|
|
39
74
|
let model: any = o
|
|
40
|
-
if (type === "
|
|
41
|
-
const datatype = ctrl.getAttribute("data-type")
|
|
42
|
-
if (datatype === "number" || datatype === "integer") {
|
|
43
|
-
const decimalSeparator = getDecimalSeparator(ctrl as HTMLInputElement)
|
|
44
|
-
const v0: string = ctrl.value
|
|
45
|
-
const v = decimalSeparator === "," ? v0.replace(r2, "") : v0.replace(r1, "")
|
|
46
|
-
const val = isNaN(v as any) ? undefined : parseFloat(v)
|
|
47
|
-
setValue(o, field, val)
|
|
48
|
-
} else {
|
|
49
|
-
setValue(o, field, ctrl.value)
|
|
50
|
-
}
|
|
51
|
-
} else if (type === "checkbox") {
|
|
75
|
+
if (type === "checkbox") {
|
|
52
76
|
let value = model[field]
|
|
53
77
|
if (ctrl.id && ctrl.name !== ctrl.id) {
|
|
54
78
|
if (!value || !Array.isArray(value)) {
|
|
55
79
|
value = []
|
|
56
80
|
}
|
|
57
|
-
value.includes(
|
|
81
|
+
value.includes(v0) ? (value = value.filter((v: string) => v !== v0)) : value.push(v0)
|
|
58
82
|
model[field] = value
|
|
59
83
|
} else {
|
|
60
84
|
const v = valueOfCheckbox(ctrl as HTMLInputElement)
|
|
@@ -62,31 +86,46 @@ export function updateState<T>(
|
|
|
62
86
|
}
|
|
63
87
|
} else if (type === "radio") {
|
|
64
88
|
if (field.indexOf(".") < 0 && field.indexOf("[") < 0) {
|
|
65
|
-
model[field] =
|
|
89
|
+
model[field] = v0
|
|
66
90
|
} else {
|
|
67
|
-
setValue(model, field,
|
|
91
|
+
setValue(model, field, v0)
|
|
68
92
|
}
|
|
69
93
|
} else if (type === "date" || type === "datetime-local") {
|
|
70
|
-
|
|
71
|
-
|
|
72
|
-
|
|
73
|
-
} catch (error) {
|
|
74
|
-
console.error("Error occurred while formatting date:", error)
|
|
75
|
-
}
|
|
94
|
+
const date = new Date(v0)
|
|
95
|
+
const val = !isNaN(date.getTime()) ? date.toISOString() : null
|
|
96
|
+
setValue(model, field, val)
|
|
76
97
|
} else if (type === "time") {
|
|
77
|
-
const
|
|
78
|
-
|
|
79
|
-
|
|
80
|
-
|
|
81
|
-
|
|
82
|
-
console.error("Error occurred while formatting time:", error)
|
|
98
|
+
const date = new Date(v0)
|
|
99
|
+
if (!isNaN(date.getTime())) {
|
|
100
|
+
setValue(model, field, date.getTime())
|
|
101
|
+
} else {
|
|
102
|
+
setValue(model, field, null)
|
|
83
103
|
}
|
|
84
|
-
return objSet
|
|
85
104
|
} else {
|
|
86
|
-
|
|
105
|
+
const datatype = ctrl.getAttribute("data-type")
|
|
106
|
+
if (datatype === "phone") {
|
|
107
|
+
const val = removePhoneFormat(v0)
|
|
108
|
+
setValue(o, field, val)
|
|
109
|
+
} else if (datatype === "fax") {
|
|
110
|
+
const val = removeFaxFormat(v0)
|
|
111
|
+
setValue(o, field, val)
|
|
112
|
+
} else if (datatype === "number" || datatype === "int") {
|
|
113
|
+
const decimalSeparator = getDecimalSeparator(ctrl as HTMLInputElement)
|
|
114
|
+
let v = decimalSeparator === "," ? v0.replace(r2, "") : v0.replace(r1, "")
|
|
115
|
+
if (v.indexOf(",") >= 0) {
|
|
116
|
+
v = v.replace(",", ".")
|
|
117
|
+
}
|
|
118
|
+
const val = isNaN(v as any) ? undefined : parseFloat(v)
|
|
119
|
+
setValue(o, field, val)
|
|
120
|
+
} else {
|
|
121
|
+
setValue(o, field, v0)
|
|
122
|
+
}
|
|
87
123
|
}
|
|
88
124
|
}
|
|
89
125
|
setObj({ ...o })
|
|
126
|
+
if (callback) {
|
|
127
|
+
callback()
|
|
128
|
+
}
|
|
90
129
|
}
|
|
91
130
|
|
|
92
131
|
export const enLocale = {
|
package/src/update.ts
CHANGED
|
@@ -1,15 +1,7 @@
|
|
|
1
1
|
import { useCallback, useEffect, useRef, useState } from "react"
|
|
2
|
-
import { Locale,
|
|
2
|
+
import { Locale, removePhoneFormat } from "./core"
|
|
3
3
|
import { buildFlatState, buildState, handleEvent, localeOf } from "./state"
|
|
4
4
|
|
|
5
|
-
export function removePhoneFormat(phone: string): string {
|
|
6
|
-
if (phone) {
|
|
7
|
-
return phone.replace(resources.phone, "")
|
|
8
|
-
} else {
|
|
9
|
-
return phone
|
|
10
|
-
}
|
|
11
|
-
}
|
|
12
|
-
|
|
13
5
|
export function getModelName(form?: HTMLFormElement | null, name?: string): string {
|
|
14
6
|
if (form) {
|
|
15
7
|
const a = form.getAttribute("model-name")
|