84 lines
2.8 KiB
TypeScript
84 lines
2.8 KiB
TypeScript
import { defineComponent, h, type Component, type PropType } from 'vue'
|
|
|
|
export const DataTableStub = defineComponent({
|
|
name: 'DataTable',
|
|
props: { data: { type: Array as PropType<object[]>, default: () => [] } },
|
|
setup(props, { slots }) {
|
|
return () => h('div', { 'data-testid': 'data-table' }, [
|
|
slots['toolbar-actions']?.(),
|
|
...props.data.flatMap(row => slots.actions?.({ row }) || []),
|
|
])
|
|
},
|
|
})
|
|
|
|
export const AppDialogStub = defineComponent({
|
|
name: 'AppDialog',
|
|
props: { title: { type: String, required: true }, confirmText: { type: String, default: '确定' } },
|
|
emits: ['confirm'],
|
|
setup(props, { emit, slots }) {
|
|
return () => h('section', { 'data-dialog': props.title }, [
|
|
slots.default?.(),
|
|
h('button', { class: 'dialog-confirm', onClick: () => emit('confirm') }, props.confirmText),
|
|
])
|
|
},
|
|
})
|
|
|
|
export const ModelInputStub = defineComponent({
|
|
name: 'ElInput',
|
|
inheritAttrs: false,
|
|
props: { modelValue: { type: [String, Number], default: '' }, type: { type: String, default: 'text' } },
|
|
emits: ['update:modelValue', 'blur'],
|
|
setup(props, { attrs, emit }) {
|
|
return () => h(props.type === 'textarea' ? 'textarea' : 'input', {
|
|
...attrs,
|
|
value: props.modelValue,
|
|
onInput: (event: Event) => emit('update:modelValue', (event.target as HTMLInputElement).value),
|
|
onBlur: () => emit('blur'),
|
|
})
|
|
},
|
|
})
|
|
|
|
export const ModelSelectStub = defineComponent({
|
|
name: 'ElSelect',
|
|
props: { modelValue: { type: [String, Number], default: '' } },
|
|
emits: ['update:modelValue'],
|
|
setup(props, { emit, slots }) {
|
|
return () => h('select', {
|
|
value: props.modelValue,
|
|
onChange: (event: Event) => emit('update:modelValue', (event.target as HTMLSelectElement).value),
|
|
}, slots.default?.())
|
|
},
|
|
})
|
|
|
|
export const OptionStub = defineComponent({
|
|
name: 'ElOption',
|
|
props: { value: { type: [String, Number], required: true }, label: { type: String, required: true } },
|
|
setup(props) { return () => h('option', { value: props.value }, props.label) },
|
|
})
|
|
|
|
export const ModelNumberStub = defineComponent({
|
|
name: 'ElInputNumber',
|
|
props: { modelValue: { type: Number, default: undefined } },
|
|
emits: ['update:modelValue'],
|
|
setup(props, { emit }) {
|
|
return () => h('input', {
|
|
type: 'number',
|
|
value: props.modelValue,
|
|
onInput: (event: Event) => {
|
|
const value = (event.target as HTMLInputElement).value
|
|
emit('update:modelValue', value === '' ? undefined : Number(value))
|
|
},
|
|
})
|
|
},
|
|
})
|
|
|
|
export const commonPhase5Stubs: Record<string, Component> = {
|
|
DataTable: DataTableStub,
|
|
AppDialog: AppDialogStub,
|
|
QueryToolbar: defineComponent({ name: 'QueryToolbar', setup: () => () => h('div') }),
|
|
ElInput: ModelInputStub,
|
|
ElSelect: ModelSelectStub,
|
|
ElOption: OptionStub,
|
|
ElInputNumber: ModelNumberStub,
|
|
}
|