@antsoo-lib/core 3.0.0 → 3.0.1
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/CHANGELOG.md +6 -0
- package/dist/core.css +1 -1
- package/dist/index.cjs +1 -1
- package/dist/index.js +6 -5
- package/dist/types/BaseSearch/index.d.ts +1 -1
- package/dist/types/BaseTable/index.d.ts +5 -475
- package/dist/types/Form/CoreForm.d.ts +82 -0
- package/dist/types/SSelectPage/index.d.ts +102 -0
- package/package.json +3 -3
- package/src/BaseSearch/index.vue +371 -371
- package/src/BaseTable/index.vue +910 -910
- package/src/Form/CoreForm.vue +782 -782
- package/src/Form/types.ts +86 -86
- package/src/SSelectPage/index.vue +607 -607
- package/src/index.ts +17 -17
- package/src/render/AreaCascader.tsx +64 -64
- package/src/render/AutoComplete.tsx +101 -101
- package/src/render/Button.tsx +62 -62
- package/src/render/Cascader.tsx +45 -45
- package/src/render/Checkbox.tsx +65 -65
- package/src/render/CheckboxGroup.tsx +57 -57
- package/src/render/Custom.tsx +19 -19
- package/src/render/DatePicker.tsx +83 -83
- package/src/render/Input.tsx +140 -140
- package/src/render/InputGroup.tsx +115 -115
- package/src/render/InputNumber.tsx +205 -205
- package/src/render/InputPassword.tsx +81 -81
- package/src/render/InputRange.tsx +154 -154
- package/src/render/RadioGroup.tsx +63 -63
- package/src/render/Select.tsx +96 -96
- package/src/render/SselectPage.tsx +107 -107
- package/src/render/Switch.tsx +60 -60
- package/src/render/Tree.tsx +136 -136
- package/src/render/TreeSelect.tsx +81 -81
- package/src/render/Upload.tsx +91 -91
- package/src/render/helper.tsx +221 -221
- package/src/render/index.ts +108 -108
- package/src/render/registry.ts +20 -20
- package/src/render/state.ts +37 -37
- package/src/render/types.ts +567 -567
- package/src/utils/attrMapping.ts +106 -106
- package/vite.config.ts +61 -61
- package/.turbo/turbo-build.log +0 -40
|
@@ -1,205 +1,205 @@
|
|
|
1
|
-
import { InputNumber } from '@antsoo-lib/components'
|
|
2
|
-
import { PRECISION } from '@antsoo-lib/shared'
|
|
3
|
-
import type { VoidFunction } from '@antsoo-lib/shared'
|
|
4
|
-
import { isFunction } from '@antsoo-lib/utils'
|
|
5
|
-
|
|
6
|
-
import { markRaw, nextTick } from 'vue'
|
|
7
|
-
import type { ComponentPublicInstance, VNode } from 'vue'
|
|
8
|
-
|
|
9
|
-
import { getInputNumberFocusState, renderSlotContent } from './helper'
|
|
10
|
-
import type { ToolbarState } from './state'
|
|
11
|
-
import type { InputNumberToolbarItem, ToolbarItem } from './types'
|
|
12
|
-
|
|
13
|
-
// 数字输入框渲染函数
|
|
14
|
-
export function renderInputNumber(item: ToolbarItem, toolbarState: ToolbarState): VNode {
|
|
15
|
-
const inputNumberItem = item as InputNumberToolbarItem
|
|
16
|
-
const { key, events = {}, slots } = inputNumberItem
|
|
17
|
-
const { props = {}, disabled = false } = inputNumberItem
|
|
18
|
-
|
|
19
|
-
const isDisabled = isFunction(disabled)
|
|
20
|
-
? disabled(toolbarState.getAllValues(), toolbarState)
|
|
21
|
-
: disabled
|
|
22
|
-
|
|
23
|
-
// Clone props to avoid mutation
|
|
24
|
-
const finalProps = { ...props, disabled: isDisabled }
|
|
25
|
-
|
|
26
|
-
// 自动处理精度与格式化 (xmoney/xprice/xweight/xtaxrate)
|
|
27
|
-
const { xmoney, xprice, xweight, xtaxrate } = finalProps
|
|
28
|
-
|
|
29
|
-
// 1. 确定精度
|
|
30
|
-
let precision = finalProps.precision
|
|
31
|
-
if (precision === undefined) {
|
|
32
|
-
if (xmoney) precision = PRECISION.amount
|
|
33
|
-
else if (xprice) precision = PRECISION.price
|
|
34
|
-
else if (xweight) precision = PRECISION.weight
|
|
35
|
-
else if (xtaxrate) precision = PRECISION.taxRate
|
|
36
|
-
else if (finalProps.xnumber) precision = PRECISION.number
|
|
37
|
-
|
|
38
|
-
if (precision !== undefined) {
|
|
39
|
-
finalProps.precision = precision
|
|
40
|
-
}
|
|
41
|
-
}
|
|
42
|
-
|
|
43
|
-
// 2. 确定步长 (step)
|
|
44
|
-
if (finalProps.step === undefined && precision !== undefined) {
|
|
45
|
-
finalProps.step = 1 / 10 ** precision
|
|
46
|
-
}
|
|
47
|
-
|
|
48
|
-
// 以字段 key 维度记录 InputNumber 是否处于聚焦中
|
|
49
|
-
const focusState = key ? getInputNumberFocusState(toolbarState) : undefined
|
|
50
|
-
|
|
51
|
-
const formatValueWithPrecisionOnBlur = (value: any) => {
|
|
52
|
-
if (value == null || value === '') return ''
|
|
53
|
-
const rawText = `${value}`
|
|
54
|
-
if (precision === undefined) return rawText
|
|
55
|
-
// 聚焦中保持“用户输入原样”,避免输入中间态(如 2. / 2.0)被 toFixed 强制改写
|
|
56
|
-
if (key && focusState?.get(key)) return rawText
|
|
57
|
-
const num = Number(rawText)
|
|
58
|
-
if (!Number.isFinite(num)) return rawText
|
|
59
|
-
// 失焦时按 precision 补齐尾数 0(同时会发生四舍五入)
|
|
60
|
-
return num.toFixed(precision)
|
|
61
|
-
}
|
|
62
|
-
|
|
63
|
-
// 3. 默认格式化 (千分位 或 百分比)
|
|
64
|
-
if (!finalProps.formatter) {
|
|
65
|
-
if (xtaxrate) {
|
|
66
|
-
// 税率:先补精度再加 %
|
|
67
|
-
finalProps.formatter = (value: any) => {
|
|
68
|
-
const text = formatValueWithPrecisionOnBlur(value)
|
|
69
|
-
return text === '' ? '' : `${text}%`
|
|
70
|
-
}
|
|
71
|
-
finalProps.parser = (value: string | undefined) => (value ? value.replace('%', '') : '')
|
|
72
|
-
} else {
|
|
73
|
-
// 默认千分位
|
|
74
|
-
// 千分位:先补精度再加逗号(确保 2 -> 2.00 之后再变成 2.00 的千分位格式)
|
|
75
|
-
finalProps.formatter = (value: any) => {
|
|
76
|
-
const text = formatValueWithPrecisionOnBlur(value)
|
|
77
|
-
if (text === '') return ''
|
|
78
|
-
return `${text}`.replace(/\B(?=(?:\d{3})+(?!\d))/g, ',')
|
|
79
|
-
}
|
|
80
|
-
finalProps.parser = (value: string | undefined) => (value ? value.replace(/,/g, '') : '')
|
|
81
|
-
}
|
|
82
|
-
}
|
|
83
|
-
|
|
84
|
-
const processedEvents: Record<string, VoidFunction> = {}
|
|
85
|
-
Object.keys(events).forEach((eventName) => {
|
|
86
|
-
processedEvents[eventName] = (...args: any[]) => {
|
|
87
|
-
// 对于数字输入框,自动更新状态
|
|
88
|
-
if (eventName === 'onUpdate:value' || eventName === 'onChange') {
|
|
89
|
-
const value = args[0]
|
|
90
|
-
toolbarState.setValue(key, value)
|
|
91
|
-
}
|
|
92
|
-
// 调用原始事件处理函数
|
|
93
|
-
events[eventName]?.(...args, toolbarState.getAllValues(), toolbarState)
|
|
94
|
-
}
|
|
95
|
-
})
|
|
96
|
-
|
|
97
|
-
// 如果没有设置onChange事件,添加默认的状态更新
|
|
98
|
-
if (!processedEvents['onUpdate:value'] && !processedEvents.onChange) {
|
|
99
|
-
processedEvents['onUpdate:value'] = (value: any) => {
|
|
100
|
-
toolbarState.setValue(key, value)
|
|
101
|
-
}
|
|
102
|
-
}
|
|
103
|
-
|
|
104
|
-
// 自动全选逻辑:合并 onFocus 事件
|
|
105
|
-
const userOnFocus = processedEvents.onFocus || events.onFocus
|
|
106
|
-
processedEvents.onFocus = (...args: any[]) => {
|
|
107
|
-
const e = args[0]
|
|
108
|
-
if (key) focusState?.set(key, true)
|
|
109
|
-
try {
|
|
110
|
-
if (e && e.target && typeof (e.target as HTMLInputElement).select === 'function') {
|
|
111
|
-
const target = e.target as HTMLInputElement
|
|
112
|
-
target.select()
|
|
113
|
-
|
|
114
|
-
// 阻止鼠标松开时的默认光标定位行为(仅一次),防止全选被取消
|
|
115
|
-
const preventMouseUp = (ev: Event) => {
|
|
116
|
-
ev.preventDefault()
|
|
117
|
-
target.removeEventListener('mouseup', preventMouseUp)
|
|
118
|
-
}
|
|
119
|
-
|
|
120
|
-
target.addEventListener('mouseup', preventMouseUp, { once: true })
|
|
121
|
-
|
|
122
|
-
const cleanup = () => {
|
|
123
|
-
target.removeEventListener('mouseup', preventMouseUp)
|
|
124
|
-
target.removeEventListener('blur', cleanup)
|
|
125
|
-
}
|
|
126
|
-
target.addEventListener('blur', cleanup)
|
|
127
|
-
}
|
|
128
|
-
} catch {
|
|
129
|
-
// ignore
|
|
130
|
-
}
|
|
131
|
-
// 执行用户原有逻辑
|
|
132
|
-
userOnFocus?.(...args, toolbarState.getAllValues(), toolbarState)
|
|
133
|
-
}
|
|
134
|
-
|
|
135
|
-
if (key) {
|
|
136
|
-
const userOnFocusCapture = processedEvents.onFocusCapture
|
|
137
|
-
processedEvents.onFocusCapture = (...args: any[]) => {
|
|
138
|
-
// capture 阶段优先标记“聚焦态”,确保 formatter 在同一事件周期内可读到最新状态
|
|
139
|
-
focusState?.set(key, true)
|
|
140
|
-
userOnFocusCapture?.(...args)
|
|
141
|
-
}
|
|
142
|
-
|
|
143
|
-
const userOnBlurCapture = processedEvents.onBlurCapture
|
|
144
|
-
processedEvents.onBlurCapture = (...args: any[]) => {
|
|
145
|
-
// capture 阶段优先标记“失焦态”,避免 InputNumber 内部 onBlur flush 时仍被认为是聚焦态
|
|
146
|
-
focusState?.set(key, false)
|
|
147
|
-
userOnBlurCapture?.(...args)
|
|
148
|
-
}
|
|
149
|
-
|
|
150
|
-
const userOnBlur = processedEvents.onBlur
|
|
151
|
-
processedEvents.onBlur = (...args: any[]) => {
|
|
152
|
-
focusState?.set(key, false)
|
|
153
|
-
userOnBlur?.(...args)
|
|
154
|
-
}
|
|
155
|
-
}
|
|
156
|
-
|
|
157
|
-
// 如果需要自动聚焦,添加ref处理
|
|
158
|
-
if (finalProps.autoFocus) {
|
|
159
|
-
processedEvents.ref = (el: Element | ComponentPublicInstance | null) => {
|
|
160
|
-
const element = el as HTMLElement
|
|
161
|
-
if (element) {
|
|
162
|
-
// 使用nextTick确保DOM已经渲染完成
|
|
163
|
-
nextTick(() => {
|
|
164
|
-
try {
|
|
165
|
-
element?.focus?.()
|
|
166
|
-
} catch {
|
|
167
|
-
// 忽略焦点设置失败的错误
|
|
168
|
-
}
|
|
169
|
-
})
|
|
170
|
-
}
|
|
171
|
-
}
|
|
172
|
-
}
|
|
173
|
-
|
|
174
|
-
// 构建插槽对象
|
|
175
|
-
const slotsObject: Record<string, () => VNode | undefined> = {}
|
|
176
|
-
if (slots) {
|
|
177
|
-
if (slots.addonBefore) {
|
|
178
|
-
slotsObject.addonBefore = () => renderSlotContent(slots.addonBefore!, toolbarState)
|
|
179
|
-
}
|
|
180
|
-
if (slots.addonAfter) {
|
|
181
|
-
slotsObject.addonAfter = () => renderSlotContent(slots.addonAfter!, toolbarState)
|
|
182
|
-
}
|
|
183
|
-
if (slots.prefix) {
|
|
184
|
-
slotsObject.prefix = () => renderSlotContent(slots.prefix!, toolbarState)
|
|
185
|
-
}
|
|
186
|
-
if (slots.suffix) {
|
|
187
|
-
slotsObject.suffix = () => renderSlotContent(slots.suffix!, toolbarState)
|
|
188
|
-
}
|
|
189
|
-
}
|
|
190
|
-
|
|
191
|
-
const Comp = markRaw(InputNumber)
|
|
192
|
-
return (
|
|
193
|
-
<Comp
|
|
194
|
-
key={key}
|
|
195
|
-
value={
|
|
196
|
-
toolbarState.getValue(key) !== undefined
|
|
197
|
-
? toolbarState.getValue(key)
|
|
198
|
-
: (finalProps.value ?? null)
|
|
199
|
-
}
|
|
200
|
-
{...finalProps}
|
|
201
|
-
{...processedEvents}
|
|
202
|
-
v-slots={slotsObject}
|
|
203
|
-
/>
|
|
204
|
-
)
|
|
205
|
-
}
|
|
1
|
+
import { InputNumber } from '@antsoo-lib/components'
|
|
2
|
+
import { PRECISION } from '@antsoo-lib/shared'
|
|
3
|
+
import type { VoidFunction } from '@antsoo-lib/shared'
|
|
4
|
+
import { isFunction } from '@antsoo-lib/utils'
|
|
5
|
+
|
|
6
|
+
import { markRaw, nextTick } from 'vue'
|
|
7
|
+
import type { ComponentPublicInstance, VNode } from 'vue'
|
|
8
|
+
|
|
9
|
+
import { getInputNumberFocusState, renderSlotContent } from './helper'
|
|
10
|
+
import type { ToolbarState } from './state'
|
|
11
|
+
import type { InputNumberToolbarItem, ToolbarItem } from './types'
|
|
12
|
+
|
|
13
|
+
// 数字输入框渲染函数
|
|
14
|
+
export function renderInputNumber(item: ToolbarItem, toolbarState: ToolbarState): VNode {
|
|
15
|
+
const inputNumberItem = item as InputNumberToolbarItem
|
|
16
|
+
const { key, events = {}, slots } = inputNumberItem
|
|
17
|
+
const { props = {}, disabled = false } = inputNumberItem
|
|
18
|
+
|
|
19
|
+
const isDisabled = isFunction(disabled)
|
|
20
|
+
? disabled(toolbarState.getAllValues(), toolbarState)
|
|
21
|
+
: disabled
|
|
22
|
+
|
|
23
|
+
// Clone props to avoid mutation
|
|
24
|
+
const finalProps = { ...props, disabled: isDisabled }
|
|
25
|
+
|
|
26
|
+
// 自动处理精度与格式化 (xmoney/xprice/xweight/xtaxrate)
|
|
27
|
+
const { xmoney, xprice, xweight, xtaxrate } = finalProps
|
|
28
|
+
|
|
29
|
+
// 1. 确定精度
|
|
30
|
+
let precision = finalProps.precision
|
|
31
|
+
if (precision === undefined) {
|
|
32
|
+
if (xmoney) precision = PRECISION.amount
|
|
33
|
+
else if (xprice) precision = PRECISION.price
|
|
34
|
+
else if (xweight) precision = PRECISION.weight
|
|
35
|
+
else if (xtaxrate) precision = PRECISION.taxRate
|
|
36
|
+
else if (finalProps.xnumber) precision = PRECISION.number
|
|
37
|
+
|
|
38
|
+
if (precision !== undefined) {
|
|
39
|
+
finalProps.precision = precision
|
|
40
|
+
}
|
|
41
|
+
}
|
|
42
|
+
|
|
43
|
+
// 2. 确定步长 (step)
|
|
44
|
+
if (finalProps.step === undefined && precision !== undefined) {
|
|
45
|
+
finalProps.step = 1 / 10 ** precision
|
|
46
|
+
}
|
|
47
|
+
|
|
48
|
+
// 以字段 key 维度记录 InputNumber 是否处于聚焦中
|
|
49
|
+
const focusState = key ? getInputNumberFocusState(toolbarState) : undefined
|
|
50
|
+
|
|
51
|
+
const formatValueWithPrecisionOnBlur = (value: any) => {
|
|
52
|
+
if (value == null || value === '') return ''
|
|
53
|
+
const rawText = `${value}`
|
|
54
|
+
if (precision === undefined) return rawText
|
|
55
|
+
// 聚焦中保持“用户输入原样”,避免输入中间态(如 2. / 2.0)被 toFixed 强制改写
|
|
56
|
+
if (key && focusState?.get(key)) return rawText
|
|
57
|
+
const num = Number(rawText)
|
|
58
|
+
if (!Number.isFinite(num)) return rawText
|
|
59
|
+
// 失焦时按 precision 补齐尾数 0(同时会发生四舍五入)
|
|
60
|
+
return num.toFixed(precision)
|
|
61
|
+
}
|
|
62
|
+
|
|
63
|
+
// 3. 默认格式化 (千分位 或 百分比)
|
|
64
|
+
if (!finalProps.formatter) {
|
|
65
|
+
if (xtaxrate) {
|
|
66
|
+
// 税率:先补精度再加 %
|
|
67
|
+
finalProps.formatter = (value: any) => {
|
|
68
|
+
const text = formatValueWithPrecisionOnBlur(value)
|
|
69
|
+
return text === '' ? '' : `${text}%`
|
|
70
|
+
}
|
|
71
|
+
finalProps.parser = (value: string | undefined) => (value ? value.replace('%', '') : '')
|
|
72
|
+
} else {
|
|
73
|
+
// 默认千分位
|
|
74
|
+
// 千分位:先补精度再加逗号(确保 2 -> 2.00 之后再变成 2.00 的千分位格式)
|
|
75
|
+
finalProps.formatter = (value: any) => {
|
|
76
|
+
const text = formatValueWithPrecisionOnBlur(value)
|
|
77
|
+
if (text === '') return ''
|
|
78
|
+
return `${text}`.replace(/\B(?=(?:\d{3})+(?!\d))/g, ',')
|
|
79
|
+
}
|
|
80
|
+
finalProps.parser = (value: string | undefined) => (value ? value.replace(/,/g, '') : '')
|
|
81
|
+
}
|
|
82
|
+
}
|
|
83
|
+
|
|
84
|
+
const processedEvents: Record<string, VoidFunction> = {}
|
|
85
|
+
Object.keys(events).forEach((eventName) => {
|
|
86
|
+
processedEvents[eventName] = (...args: any[]) => {
|
|
87
|
+
// 对于数字输入框,自动更新状态
|
|
88
|
+
if (eventName === 'onUpdate:value' || eventName === 'onChange') {
|
|
89
|
+
const value = args[0]
|
|
90
|
+
toolbarState.setValue(key, value)
|
|
91
|
+
}
|
|
92
|
+
// 调用原始事件处理函数
|
|
93
|
+
events[eventName]?.(...args, toolbarState.getAllValues(), toolbarState)
|
|
94
|
+
}
|
|
95
|
+
})
|
|
96
|
+
|
|
97
|
+
// 如果没有设置onChange事件,添加默认的状态更新
|
|
98
|
+
if (!processedEvents['onUpdate:value'] && !processedEvents.onChange) {
|
|
99
|
+
processedEvents['onUpdate:value'] = (value: any) => {
|
|
100
|
+
toolbarState.setValue(key, value)
|
|
101
|
+
}
|
|
102
|
+
}
|
|
103
|
+
|
|
104
|
+
// 自动全选逻辑:合并 onFocus 事件
|
|
105
|
+
const userOnFocus = processedEvents.onFocus || events.onFocus
|
|
106
|
+
processedEvents.onFocus = (...args: any[]) => {
|
|
107
|
+
const e = args[0]
|
|
108
|
+
if (key) focusState?.set(key, true)
|
|
109
|
+
try {
|
|
110
|
+
if (e && e.target && typeof (e.target as HTMLInputElement).select === 'function') {
|
|
111
|
+
const target = e.target as HTMLInputElement
|
|
112
|
+
target.select()
|
|
113
|
+
|
|
114
|
+
// 阻止鼠标松开时的默认光标定位行为(仅一次),防止全选被取消
|
|
115
|
+
const preventMouseUp = (ev: Event) => {
|
|
116
|
+
ev.preventDefault()
|
|
117
|
+
target.removeEventListener('mouseup', preventMouseUp)
|
|
118
|
+
}
|
|
119
|
+
|
|
120
|
+
target.addEventListener('mouseup', preventMouseUp, { once: true })
|
|
121
|
+
|
|
122
|
+
const cleanup = () => {
|
|
123
|
+
target.removeEventListener('mouseup', preventMouseUp)
|
|
124
|
+
target.removeEventListener('blur', cleanup)
|
|
125
|
+
}
|
|
126
|
+
target.addEventListener('blur', cleanup)
|
|
127
|
+
}
|
|
128
|
+
} catch {
|
|
129
|
+
// ignore
|
|
130
|
+
}
|
|
131
|
+
// 执行用户原有逻辑
|
|
132
|
+
userOnFocus?.(...args, toolbarState.getAllValues(), toolbarState)
|
|
133
|
+
}
|
|
134
|
+
|
|
135
|
+
if (key) {
|
|
136
|
+
const userOnFocusCapture = processedEvents.onFocusCapture
|
|
137
|
+
processedEvents.onFocusCapture = (...args: any[]) => {
|
|
138
|
+
// capture 阶段优先标记“聚焦态”,确保 formatter 在同一事件周期内可读到最新状态
|
|
139
|
+
focusState?.set(key, true)
|
|
140
|
+
userOnFocusCapture?.(...args)
|
|
141
|
+
}
|
|
142
|
+
|
|
143
|
+
const userOnBlurCapture = processedEvents.onBlurCapture
|
|
144
|
+
processedEvents.onBlurCapture = (...args: any[]) => {
|
|
145
|
+
// capture 阶段优先标记“失焦态”,避免 InputNumber 内部 onBlur flush 时仍被认为是聚焦态
|
|
146
|
+
focusState?.set(key, false)
|
|
147
|
+
userOnBlurCapture?.(...args)
|
|
148
|
+
}
|
|
149
|
+
|
|
150
|
+
const userOnBlur = processedEvents.onBlur
|
|
151
|
+
processedEvents.onBlur = (...args: any[]) => {
|
|
152
|
+
focusState?.set(key, false)
|
|
153
|
+
userOnBlur?.(...args)
|
|
154
|
+
}
|
|
155
|
+
}
|
|
156
|
+
|
|
157
|
+
// 如果需要自动聚焦,添加ref处理
|
|
158
|
+
if (finalProps.autoFocus) {
|
|
159
|
+
processedEvents.ref = (el: Element | ComponentPublicInstance | null) => {
|
|
160
|
+
const element = el as HTMLElement
|
|
161
|
+
if (element) {
|
|
162
|
+
// 使用nextTick确保DOM已经渲染完成
|
|
163
|
+
nextTick(() => {
|
|
164
|
+
try {
|
|
165
|
+
element?.focus?.()
|
|
166
|
+
} catch {
|
|
167
|
+
// 忽略焦点设置失败的错误
|
|
168
|
+
}
|
|
169
|
+
})
|
|
170
|
+
}
|
|
171
|
+
}
|
|
172
|
+
}
|
|
173
|
+
|
|
174
|
+
// 构建插槽对象
|
|
175
|
+
const slotsObject: Record<string, () => VNode | undefined> = {}
|
|
176
|
+
if (slots) {
|
|
177
|
+
if (slots.addonBefore) {
|
|
178
|
+
slotsObject.addonBefore = () => renderSlotContent(slots.addonBefore!, toolbarState)
|
|
179
|
+
}
|
|
180
|
+
if (slots.addonAfter) {
|
|
181
|
+
slotsObject.addonAfter = () => renderSlotContent(slots.addonAfter!, toolbarState)
|
|
182
|
+
}
|
|
183
|
+
if (slots.prefix) {
|
|
184
|
+
slotsObject.prefix = () => renderSlotContent(slots.prefix!, toolbarState)
|
|
185
|
+
}
|
|
186
|
+
if (slots.suffix) {
|
|
187
|
+
slotsObject.suffix = () => renderSlotContent(slots.suffix!, toolbarState)
|
|
188
|
+
}
|
|
189
|
+
}
|
|
190
|
+
|
|
191
|
+
const Comp = markRaw(InputNumber)
|
|
192
|
+
return (
|
|
193
|
+
<Comp
|
|
194
|
+
key={key}
|
|
195
|
+
value={
|
|
196
|
+
toolbarState.getValue(key) !== undefined
|
|
197
|
+
? toolbarState.getValue(key)
|
|
198
|
+
: (finalProps.value ?? null)
|
|
199
|
+
}
|
|
200
|
+
{...finalProps}
|
|
201
|
+
{...processedEvents}
|
|
202
|
+
v-slots={slotsObject}
|
|
203
|
+
/>
|
|
204
|
+
)
|
|
205
|
+
}
|
|
@@ -1,81 +1,81 @@
|
|
|
1
|
-
import { InputPassword } from '@antsoo-lib/components'
|
|
2
|
-
import type { InputProps } from '@antsoo-lib/components'
|
|
3
|
-
import type { VoidFunction } from '@antsoo-lib/shared'
|
|
4
|
-
import { isFunction } from '@antsoo-lib/utils'
|
|
5
|
-
|
|
6
|
-
import { markRaw } from 'vue'
|
|
7
|
-
import type { VNode } from 'vue'
|
|
8
|
-
|
|
9
|
-
import { renderSlotContent } from './helper'
|
|
10
|
-
import type { ToolbarState } from './state'
|
|
11
|
-
import type { InputPasswordToolbarItem, ToolbarItem } from './types'
|
|
12
|
-
|
|
13
|
-
export function renderInputPassword(item: ToolbarItem, toolbarState: ToolbarState): VNode {
|
|
14
|
-
const inputItem = item as InputPasswordToolbarItem
|
|
15
|
-
const { key, events = {}, slots } = inputItem
|
|
16
|
-
const { props = {}, disabled = false } = item
|
|
17
|
-
|
|
18
|
-
const isDisabled = isFunction(disabled)
|
|
19
|
-
? disabled(toolbarState.getAllValues(), toolbarState)
|
|
20
|
-
: disabled
|
|
21
|
-
const finalProps: Partial<InputProps> & { disabled?: boolean; value?: string } = {
|
|
22
|
-
...props,
|
|
23
|
-
disabled: isDisabled,
|
|
24
|
-
}
|
|
25
|
-
|
|
26
|
-
// 处理事件,注入工具栏状态
|
|
27
|
-
const processedEvents: Record<string, VoidFunction> = {}
|
|
28
|
-
Object.keys(events).forEach((eventName) => {
|
|
29
|
-
processedEvents[eventName] = (...args: any[]) => {
|
|
30
|
-
if (eventName === 'onUpdate:value') {
|
|
31
|
-
toolbarState.setValue(key, args[0])
|
|
32
|
-
} else if (eventName === 'onChange') {
|
|
33
|
-
const firstArg = args[0]
|
|
34
|
-
const hasTarget = firstArg && typeof firstArg === 'object' && 'target' in firstArg
|
|
35
|
-
const nextVal = hasTarget ? firstArg.target?.value : undefined
|
|
36
|
-
if (nextVal !== undefined) toolbarState.setValue(key, nextVal)
|
|
37
|
-
}
|
|
38
|
-
|
|
39
|
-
// 调用原始事件处理函数
|
|
40
|
-
events[eventName]?.(...args, toolbarState.getAllValues(), toolbarState)
|
|
41
|
-
}
|
|
42
|
-
})
|
|
43
|
-
|
|
44
|
-
// 如果没有设置onChange事件,添加默认的状态更新
|
|
45
|
-
if (!processedEvents['onUpdate:value'] && !processedEvents.onChange) {
|
|
46
|
-
processedEvents['onUpdate:value'] = (value: string) => {
|
|
47
|
-
toolbarState.setValue(key, value)
|
|
48
|
-
}
|
|
49
|
-
}
|
|
50
|
-
|
|
51
|
-
// 构建插槽对象
|
|
52
|
-
const slotsObject: Record<string, () => VNode | undefined> = {}
|
|
53
|
-
if (slots) {
|
|
54
|
-
if (slots.addonBefore) {
|
|
55
|
-
slotsObject.addonBefore = () => renderSlotContent(slots.addonBefore!, toolbarState)
|
|
56
|
-
}
|
|
57
|
-
if (slots.addonAfter) {
|
|
58
|
-
slotsObject.addonAfter = () => renderSlotContent(slots.addonAfter!, toolbarState)
|
|
59
|
-
}
|
|
60
|
-
if (slots.prefix) {
|
|
61
|
-
slotsObject.prefix = () => renderSlotContent(slots.prefix!, toolbarState)
|
|
62
|
-
}
|
|
63
|
-
if (slots.suffix) {
|
|
64
|
-
slotsObject.suffix = () => renderSlotContent(slots.suffix!, toolbarState)
|
|
65
|
-
}
|
|
66
|
-
}
|
|
67
|
-
|
|
68
|
-
const Comp = markRaw(InputPassword)
|
|
69
|
-
return (
|
|
70
|
-
<Comp
|
|
71
|
-
key={key}
|
|
72
|
-
value={toolbarState.getValue(key) || finalProps.value || ''}
|
|
73
|
-
allowClear
|
|
74
|
-
autocomplete="new-password"
|
|
75
|
-
maxlength={50}
|
|
76
|
-
{...finalProps}
|
|
77
|
-
{...processedEvents}
|
|
78
|
-
v-slots={slotsObject}
|
|
79
|
-
/>
|
|
80
|
-
)
|
|
81
|
-
}
|
|
1
|
+
import { InputPassword } from '@antsoo-lib/components'
|
|
2
|
+
import type { InputProps } from '@antsoo-lib/components'
|
|
3
|
+
import type { VoidFunction } from '@antsoo-lib/shared'
|
|
4
|
+
import { isFunction } from '@antsoo-lib/utils'
|
|
5
|
+
|
|
6
|
+
import { markRaw } from 'vue'
|
|
7
|
+
import type { VNode } from 'vue'
|
|
8
|
+
|
|
9
|
+
import { renderSlotContent } from './helper'
|
|
10
|
+
import type { ToolbarState } from './state'
|
|
11
|
+
import type { InputPasswordToolbarItem, ToolbarItem } from './types'
|
|
12
|
+
|
|
13
|
+
export function renderInputPassword(item: ToolbarItem, toolbarState: ToolbarState): VNode {
|
|
14
|
+
const inputItem = item as InputPasswordToolbarItem
|
|
15
|
+
const { key, events = {}, slots } = inputItem
|
|
16
|
+
const { props = {}, disabled = false } = item
|
|
17
|
+
|
|
18
|
+
const isDisabled = isFunction(disabled)
|
|
19
|
+
? disabled(toolbarState.getAllValues(), toolbarState)
|
|
20
|
+
: disabled
|
|
21
|
+
const finalProps: Partial<InputProps> & { disabled?: boolean; value?: string } = {
|
|
22
|
+
...props,
|
|
23
|
+
disabled: isDisabled,
|
|
24
|
+
}
|
|
25
|
+
|
|
26
|
+
// 处理事件,注入工具栏状态
|
|
27
|
+
const processedEvents: Record<string, VoidFunction> = {}
|
|
28
|
+
Object.keys(events).forEach((eventName) => {
|
|
29
|
+
processedEvents[eventName] = (...args: any[]) => {
|
|
30
|
+
if (eventName === 'onUpdate:value') {
|
|
31
|
+
toolbarState.setValue(key, args[0])
|
|
32
|
+
} else if (eventName === 'onChange') {
|
|
33
|
+
const firstArg = args[0]
|
|
34
|
+
const hasTarget = firstArg && typeof firstArg === 'object' && 'target' in firstArg
|
|
35
|
+
const nextVal = hasTarget ? firstArg.target?.value : undefined
|
|
36
|
+
if (nextVal !== undefined) toolbarState.setValue(key, nextVal)
|
|
37
|
+
}
|
|
38
|
+
|
|
39
|
+
// 调用原始事件处理函数
|
|
40
|
+
events[eventName]?.(...args, toolbarState.getAllValues(), toolbarState)
|
|
41
|
+
}
|
|
42
|
+
})
|
|
43
|
+
|
|
44
|
+
// 如果没有设置onChange事件,添加默认的状态更新
|
|
45
|
+
if (!processedEvents['onUpdate:value'] && !processedEvents.onChange) {
|
|
46
|
+
processedEvents['onUpdate:value'] = (value: string) => {
|
|
47
|
+
toolbarState.setValue(key, value)
|
|
48
|
+
}
|
|
49
|
+
}
|
|
50
|
+
|
|
51
|
+
// 构建插槽对象
|
|
52
|
+
const slotsObject: Record<string, () => VNode | undefined> = {}
|
|
53
|
+
if (slots) {
|
|
54
|
+
if (slots.addonBefore) {
|
|
55
|
+
slotsObject.addonBefore = () => renderSlotContent(slots.addonBefore!, toolbarState)
|
|
56
|
+
}
|
|
57
|
+
if (slots.addonAfter) {
|
|
58
|
+
slotsObject.addonAfter = () => renderSlotContent(slots.addonAfter!, toolbarState)
|
|
59
|
+
}
|
|
60
|
+
if (slots.prefix) {
|
|
61
|
+
slotsObject.prefix = () => renderSlotContent(slots.prefix!, toolbarState)
|
|
62
|
+
}
|
|
63
|
+
if (slots.suffix) {
|
|
64
|
+
slotsObject.suffix = () => renderSlotContent(slots.suffix!, toolbarState)
|
|
65
|
+
}
|
|
66
|
+
}
|
|
67
|
+
|
|
68
|
+
const Comp = markRaw(InputPassword)
|
|
69
|
+
return (
|
|
70
|
+
<Comp
|
|
71
|
+
key={key}
|
|
72
|
+
value={toolbarState.getValue(key) || finalProps.value || ''}
|
|
73
|
+
allowClear
|
|
74
|
+
autocomplete="new-password"
|
|
75
|
+
maxlength={50}
|
|
76
|
+
{...finalProps}
|
|
77
|
+
{...processedEvents}
|
|
78
|
+
v-slots={slotsObject}
|
|
79
|
+
/>
|
|
80
|
+
)
|
|
81
|
+
}
|