feat: 为多个组件添加帮助信息支持
This commit is contained in:
@ -6,6 +6,7 @@ import PrimevueCascadeselect from 'primevue/cascadeselect';
|
||||
import { defineComponent, markRaw, ref } from 'vue';
|
||||
import { floatLabel } from '../sections/floatLabel';
|
||||
import { messages } from '../sections/messages';
|
||||
import { help } from '../sections/help';
|
||||
|
||||
// https://formkit.com/inputs/dropdown
|
||||
|
||||
@ -21,7 +22,7 @@ const SchemaComponent = defineComponent(
|
||||
'onUpdate:modelValue': (value: unknown) => {
|
||||
formkitContext.node.input(value);
|
||||
},
|
||||
'onBlur': async e => {
|
||||
'onBlur': async (e) => {
|
||||
setTimeout(
|
||||
() => formkitContext.handlers.blur.call(undefined, e as never),
|
||||
166, // 因为会触发两次。所以让blur事件延迟一点,可以考虑优化。(Cascadeselect好像没有这个问题)
|
||||
@ -92,6 +93,7 @@ export const PCascadeSelect: FormKitTypeDefinition = {
|
||||
input(), //
|
||||
label('$label'),
|
||||
),
|
||||
help('$help'),
|
||||
messages(),
|
||||
),
|
||||
props: ['options', 'optionLabel', 'optionValue'],
|
||||
|
@ -6,6 +6,7 @@ import PrimevueDatepicker from 'primevue/datepicker';
|
||||
import { defineComponent, markRaw } from 'vue';
|
||||
import { floatLabel } from '../sections/floatLabel';
|
||||
import { messages } from '../sections/messages';
|
||||
import { help } from '../sections/help';
|
||||
|
||||
// :plugins="[castNumber]"
|
||||
type PickerValue = Date | Array<Date> | Array<Date | null> | undefined | null;
|
||||
@ -22,7 +23,7 @@ const SchemaComponent = defineComponent(
|
||||
const formkitContext = vueProps.context;
|
||||
const { valueToDate, dateToValue } = formkitContext;
|
||||
const listeners: PrimevueDatepickerListeners = {
|
||||
'onUpdate:modelValue': value => {
|
||||
'onUpdate:modelValue': (value) => {
|
||||
let newValue = value as unknown;
|
||||
try {
|
||||
newValue = dateToValue(value);
|
||||
@ -31,7 +32,7 @@ const SchemaComponent = defineComponent(
|
||||
}
|
||||
formkitContext.node.input(newValue);
|
||||
},
|
||||
'onBlur': async e => {
|
||||
'onBlur': async (e) => {
|
||||
setTimeout(
|
||||
() => formkitContext.handlers.blur.call(undefined, e as never),
|
||||
166, // 因为会触发两次。所以让blur事件延迟一点,可以考虑优化。
|
||||
@ -80,6 +81,7 @@ export const PDatePicker: FormKitTypeDefinition = {
|
||||
input(), //
|
||||
label('$label'),
|
||||
),
|
||||
help('$help'),
|
||||
messages(),
|
||||
),
|
||||
props: ['valueToDate', 'dateToValue', 'dateFormat'],
|
||||
|
@ -5,6 +5,7 @@ import SchemaComponent from 'primevue/password';
|
||||
import { markRaw } from 'vue';
|
||||
import { messages } from '../sections/messages';
|
||||
import { floatLabel } from '../sections/floatLabel';
|
||||
import { help } from '../sections/help';
|
||||
|
||||
const input = createSection('input', () => ({
|
||||
$cmp: markRaw(SchemaComponent) as never,
|
||||
@ -27,6 +28,7 @@ export const PInputPassword: FormKitTypeDefinition = {
|
||||
input(), //
|
||||
label('$label'),
|
||||
),
|
||||
help('$help'),
|
||||
messages(),
|
||||
),
|
||||
features: [casts],
|
||||
|
@ -5,6 +5,7 @@ import PrimevueSelect, { type SelectEmitsOptions, type SelectSlots } from 'prime
|
||||
import { computed, defineComponent, markRaw, ref } from 'vue';
|
||||
import { floatLabel } from '../sections/floatLabel';
|
||||
import { messages } from '../sections/messages';
|
||||
import { help } from '../sections/help';
|
||||
|
||||
// https://formkit.com/inputs/dropdown
|
||||
|
||||
@ -23,7 +24,7 @@ const SchemaComponent = defineComponent(
|
||||
'onUpdate:modelValue': (value: unknown) => {
|
||||
formkitContext.node.input(value);
|
||||
},
|
||||
'onBlur': async e => {
|
||||
'onBlur': async (e) => {
|
||||
setTimeout(
|
||||
() => formkitContext.handlers.blur.call(undefined, e as never),
|
||||
166, // 因为会触发两次。所以让blur事件延迟一点,可以考虑优化。
|
||||
@ -59,7 +60,7 @@ const SchemaComponent = defineComponent(
|
||||
|
||||
const valueSlot = computed(() => {
|
||||
if (primevueSelectInstance.value?.label === 'p-emptylabel' && !!formkitContext._value) {
|
||||
return (slotProps => {
|
||||
return ((slotProps) => {
|
||||
return slotProps.value as never;
|
||||
}) satisfies SelectSlots['value'];
|
||||
} else {
|
||||
@ -116,6 +117,7 @@ export const PSelect: FormKitTypeDefinition = {
|
||||
input(), //
|
||||
label('$label'),
|
||||
),
|
||||
help('$help'),
|
||||
messages(),
|
||||
),
|
||||
props: ['options', 'optionLabel', 'optionValue'],
|
||||
|
Reference in New Issue
Block a user