diff --git a/examples/views/date-picker/DatePickerTest.vue b/examples/views/date-picker/DatePickerTest.vue index 4de69475..63b8a75f 100644 --- a/examples/views/date-picker/DatePickerTest.vue +++ b/examples/views/date-picker/DatePickerTest.vue @@ -1,268 +1,11 @@ - - diff --git a/package.json b/package.json index 3f64ea48..4e7e6c35 100644 --- a/package.json +++ b/package.json @@ -1,6 +1,6 @@ { "name": "vxe-pc-ui", - "version": "4.3.9", + "version": "4.3.10", "description": "A vue based PC component library", "scripts": { "update": "npm install --legacy-peer-deps", diff --git a/packages/date-picker/src/date-picker.ts b/packages/date-picker/src/date-picker.ts index 06526ed1..6e9c9ed4 100644 --- a/packages/date-picker/src/date-picker.ts +++ b/packages/date-picker/src/date-picker.ts @@ -1020,7 +1020,19 @@ export default defineComponent({ const isDateDisabled = (item: { date: Date }) => { const { disabledMethod } = props const { datePanelType } = reactData - return disabledMethod && disabledMethod({ type: datePanelType, viewType: datePanelType, date: item.date, $datePicker: $xeDatePicker }) + const dateStartTime = computeDateStartTime.value + const dateEndTime = computeDateEndTime.value + const { date } = item + if (dateStartTime && dateStartTime.getTime() > date.getTime()) { + return true + } + if (dateEndTime && dateEndTime.getTime() < date.getTime()) { + return true + } + if (disabledMethod) { + return disabledMethod({ type: datePanelType, viewType: datePanelType, date, $datePicker: $xeDatePicker }) + } + return false } const dateSelectItem = (date: Date) => { diff --git a/packages/form/render/index.ts b/packages/form/render/index.ts index cd6b6c1b..a484bdb8 100644 --- a/packages/form/render/index.ts +++ b/packages/form/render/index.ts @@ -318,12 +318,15 @@ function oldFormItemRadioAndCheckboxRender (renderOpts: any, params: any) { */ renderer.mixin({ input: { + formItemAutoFocus: 'input', renderFormItemContent: nativeItemRender }, textarea: { + formItemAutoFocus: 'textarea', renderFormItemContent: nativeItemRender }, select: { + formItemAutoFocus: 'input', renderFormItemContent (renderOpts: any, params: any) { return [ h('select', { @@ -336,18 +339,23 @@ renderer.mixin({ } }, VxeInput: { + formItemAutoFocus: 'input', renderFormItemContent: defaultItemRender }, VxeNumberInput: { + formItemAutoFocus: 'input', renderFormItemContent: defaultItemRender }, VxePasswordInput: { + formItemAutoFocus: 'input', renderFormItemContent: defaultItemRender }, VxeTextarea: { + formItemAutoFocus: 'textarea', renderFormItemContent: defaultItemRender }, VxeDatePicker: { + formItemAutoFocus: 'input', renderFormItemContent: defaultItemRender }, VxeButton: { @@ -368,6 +376,7 @@ renderer.mixin({ } }, VxeSelect: { + formItemAutoFocus: 'input', renderFormItemContent (renderOpts, params) { const { data, field } = params const { options, optionProps, optionGroups, optionGroupProps } = renderOpts @@ -381,6 +390,7 @@ renderer.mixin({ } }, VxeTreeSelect: { + formItemAutoFocus: 'input', renderFormItemContent (renderOpts: any, params: any) { const { data, field } = params const { options, optionProps } = renderOpts @@ -394,6 +404,7 @@ renderer.mixin({ } }, VxeTableSelect: { + formItemAutoFocus: 'input', renderFormItemContent (renderOpts: any, params: any) { const { data, field } = params const { options, optionProps } = renderOpts @@ -464,9 +475,11 @@ renderer.mixin({ // 以下已废弃 $input: { + formItemAutoFocus: 'input', renderFormItemContent: oldItemRender }, $textarea: { + formItemAutoFocus: 'textarea', renderFormItemContent: oldItemRender }, $button: { @@ -476,6 +489,7 @@ renderer.mixin({ renderFormItemContent: oldButtonsItemRender }, $select: { + formItemAutoFocus: 'input', renderFormItemContent (renderOpts, params) { const { data, field } = params const { options, optionProps, optionGroups, optionGroupProps } = renderOpts diff --git a/packages/form/src/form.ts b/packages/form/src/form.ts index d4613577..c4ed462d 100644 --- a/packages/form/src/form.ts +++ b/packages/form/src/form.ts @@ -358,8 +358,13 @@ export default defineComponent({ // 如果指定了聚焦 class if (XEUtils.isFunction(autoFocus)) { inputElem = autoFocus({ $form: $xeForm, $grid: $xeGrid, item, data: props.data, field }) - } else if (autoFocus) { - inputElem = el.querySelector(`.${item.id} ${autoFocus}`) as HTMLInputElement + } else { + if (autoFocus === true) { + // 自动匹配模式，会自动匹配第一个可输入元素 + inputElem = el.querySelector(`.${item.id} input,textarea`) + } else if (autoFocus) { + inputElem = el.querySelector(`.${item.id} ${autoFocus}`) as HTMLInputElement + } } if (inputElem) { inputElem.focus() diff --git a/packages/input/src/input.ts b/packages/input/src/input.ts index 8db762ab..1f9a0517 100644 --- a/packages/input/src/input.ts +++ b/packages/input/src/input.ts @@ -1343,7 +1343,19 @@ export default defineComponent({ const isDateDisabled = (item: { date: Date }) => { const { disabledMethod } = props const { datePanelType } = reactData - return disabledMethod && disabledMethod({ type: datePanelType, viewType: datePanelType, date: item.date, $input: $xeInput }) + const dateStartTime = computeDateStartTime.value + const dateEndTime = computeDateEndTime.value + const { date } = item + if (dateStartTime && dateStartTime.getTime() > date.getTime()) { + return true + } + if (dateEndTime && dateEndTime.getTime() < date.getTime()) { + return true + } + if (disabledMethod) { + return disabledMethod({ type: datePanelType, viewType: datePanelType, date, $input: $xeInput }) + } + return false } const dateSelectItem = (date: Date) => { diff --git a/packages/tabs/src/tabs.ts b/packages/tabs/src/tabs.ts index 29938143..a63d6adf 100644 --- a/packages/tabs/src/tabs.ts +++ b/packages/tabs/src/tabs.ts @@ -1,5 +1,5 @@ import { defineComponent, ref, h, reactive, inject, PropType, provide, computed, onUnmounted, createCommentVNode, watch, nextTick, onMounted } from 'vue' -import { createEvent, getConfig, getIcon, globalEvents, permission } from '../../ui' +import { createEvent, getConfig, getIcon, globalEvents, permission, renderEmptyElement } from '../../ui' import { getSlotVNs } from '../../ui/src/vn' import { toCssUnit } from '../..//ui/src/dom' import { isEnableConf } from '../..//ui/src/utils' @@ -572,6 +572,7 @@ export default defineComponent({ const tabOptions = computeTabOptions.value const tabStaticOptions = computeTabStaticOptions.value const defaultSlot = slots.default + const footerSlot = slots.footer const tabList = defaultSlot ? tabStaticOptions : tabOptions return h('div', { @@ -592,7 +593,12 @@ export default defineComponent({ renderTabHeader(tabList), h('div', { class: 'vxe-tabs-pane' - }, renderTabContent(tabList)) + }, renderTabContent(tabList)), + footerSlot + ? h('div', { + class: 'vxe-tabs-footer' + }, callSlot(footerSlot, {})) + : renderEmptyElement($xeTabs) ]) } diff --git a/types/components/form-item.d.ts b/types/components/form-item.d.ts index 9c0cc64e..1c073c50 100644 --- a/types/components/form-item.d.ts +++ b/types/components/form-item.d.ts @@ -119,14 +119,14 @@ export namespace VxeFormItemPropTypes { * 渲染组件的内容（需要渲染器支持） */ content?: string - autoFocus?: string + autoFocus?: string | boolean defaultValue?: ((params: { item: VxeFormItemProps }) => any) | null | undefined | string | number | RegExp | object | any[] | Date /** * 已废弃，请使用 autoFocus * @deprecated */ - autofocus?: string + autofocus?: string | boolean } export type Rules = VxeFormDefines.FormRule[] export type Slots = { diff --git a/types/components/tabs.d.ts b/types/components/tabs.d.ts index c486d1a6..a1887ec3 100644 --- a/types/components/tabs.d.ts +++ b/types/components/tabs.d.ts @@ -273,6 +273,7 @@ export namespace VxeTabsSlotTypes { name: VxeTabsPropTypes.ModelValue } export interface ExtraSlotParams {} + export interface FooterSlotParams {} } export interface VxeTabsSlots { @@ -287,6 +288,10 @@ export interface VxeTabsSlots { default?: (params: VxeTabsSlotTypes.DefaultSlotParams) => any extra?: (params: VxeTabsSlotTypes.ExtraSlotParams) => any + /** + * 自定义页签底部模板 + */ + footer?(params: VxeTabsSlotTypes.FooterSlotParams): any } export const Tabs: typeof VxeTabs diff --git a/types/ui/renderer.d.ts b/types/ui/renderer.d.ts index 84571377..852f2f55 100644 --- a/types/ui/renderer.d.ts +++ b/types/ui/renderer.d.ts @@ -524,7 +524,7 @@ declare module '@vxe-ui/core' { /** * 表单项 - 设置自动聚焦元素 class */ - formItemAutoFocus?: string | ((params: VxeGlobalRendererHandles.RenderFormItemAutoFocusParams) => HTMLElement | null) + formItemAutoFocus?: boolean | string | ((params: VxeGlobalRendererHandles.RenderFormItemAutoFocusParams) => HTMLElement | null) /** * 表单项 - 设置表单项的 class */