diff --git a/src/date-picker/DateRangePicker.tsx b/src/date-picker/DateRangePicker.tsx
index e0bcc1b77..fd193fdcc 100644
--- a/src/date-picker/DateRangePicker.tsx
+++ b/src/date-picker/DateRangePicker.tsx
@@ -21,6 +21,7 @@ import {
initYearMonthTime,
} from '../_common/js/date-picker/format';
import { subtractMonth, addMonth, extractTimeObj } from '../_common/js/date-picker/utils';
+import useFormDisabled from '../hooks/useFormDisabled';
export default defineComponent({
name: 'TDateRangePicker',
@@ -28,6 +29,7 @@ export default defineComponent({
setup(props, { emit }) {
const COMPONENT_NAME = usePrefixClass('date-range-picker');
const { CalendarIcon } = useGlobalIcon({ CalendarIcon: TdCalendarIcon });
+ const { formDisabled } = useFormDisabled();
const {
inputValue,
@@ -51,6 +53,7 @@ export default defineComponent({
format: props.format,
valueType: props.valueType,
}));
+ const isDisabled = computed(() => formDisabled.value || props.disabled);
// 记录面板是否选中过
const isSelected = ref(false);
@@ -416,6 +419,7 @@ export default defineComponent({
popupVisible,
panelProps,
CalendarIcon,
+ isDisabled,
};
},
render() {
@@ -440,7 +444,7 @@ export default defineComponent({
return (
renderTNode('valueDisplay', { params: this.valueDisplayParams }),
clearable: this.clearable,
- disabled: this.disabled,
+ disabled: this.isDisabled,
label: this.renderLabel,
suffixIcon: this.renderSuffixIcon,
placeholder: this.placeholderText,
diff --git a/src/time-picker/time-picker.tsx b/src/time-picker/time-picker.tsx
index 1238e5047..8e0bccb75 100755
--- a/src/time-picker/time-picker.tsx
+++ b/src/time-picker/time-picker.tsx
@@ -13,6 +13,7 @@ import type { InputProps } from '../input';
import useVModel from '../hooks/useVModel';
import { useConfig, usePrefixClass } from '../hooks/useConfig';
import { useGlobalIcon } from '../hooks/useGlobalIcon';
+import useFormDisabled from '../hooks/useFormDisabled';
import props from './props';
@@ -25,10 +26,12 @@ export default defineComponent({
const { classPrefix } = useConfig('classPrefix');
const componentName = usePrefixClass('time-picker');
const { TimeIcon } = useGlobalIcon({ TimeIcon: TdTimeIcon });
+ const { formDisabled } = useFormDisabled();
const currentValue = ref('');
const isShowPanel = ref(false);
const { global } = useConfig('timePicker');
+ const isDisabled = computed(() => formDisabled.value || props.disabled);
const { value } = toRefs(props);
const [innerValue, setInnerValue] = useVModel(value, props.defaultValue, props.onChange, 'change');
@@ -116,6 +119,7 @@ export default defineComponent({
global,
currentValue,
TimeIcon,
+ isDisabled,
};
},
render() {
@@ -129,7 +133,7 @@ export default defineComponent({
onClear: this.handleClear,
onBlur: this.handleInputBlur,
onInputChange: this.handleInputChange,
- disabled: this.disabled,
+ disabled: this.isDisabled,
clearable: this.clearable,
allowInput: this.allowInput,
class: this.inputClasses,
diff --git a/src/time-picker/time-range-picker.tsx b/src/time-picker/time-range-picker.tsx
index e6430a79d..55de55588 100644
--- a/src/time-picker/time-range-picker.tsx
+++ b/src/time-picker/time-range-picker.tsx
@@ -19,6 +19,7 @@ import type { TimeRangePickerPartial } from './type';
import useVModel from '../hooks/useVModel';
import { useConfig, usePrefixClass } from '../hooks/useConfig';
import { useGlobalIcon } from '../hooks/useGlobalIcon';
+import useFormDisabled from '../hooks/useFormDisabled';
dayjs.extend(customParseFormat);
@@ -36,6 +37,7 @@ export default defineComponent({
const { global } = useConfig('timePicker');
const { classPrefix } = useConfig('classPrefix');
const { TimeIcon } = useGlobalIcon({ TimeIcon: TdTimeIcon });
+ const { formDisabled } = useFormDisabled();
const currentPanelIdx = ref(undefined);
const currentValue = ref>(TIME_PICKER_EMPTY);
@@ -47,6 +49,8 @@ export default defineComponent({
[`${classPrefix.value}-is-focused`]: isShowPanel.value,
},
]);
+ const isDisabled = computed(() => formDisabled.value || props.disabled);
+
const { value, format } = toRefs(props);
const [innerValue, setInnerValue] = useVModel(value, props.defaultValue, props.onChange, 'change');
@@ -150,6 +154,7 @@ export default defineComponent({
handleInputBlur,
handleTimeChange,
TimeIcon,
+ isDisabled,
};
},
render() {
@@ -161,7 +166,7 @@ export default defineComponent({
{...{
props: {
onInputChange: this.handleInputChange,
- disabled: this.disabled,
+ disabled: this.isDisabled,
popupVisible: this.isShowPanel,
inputValue: this.isShowPanel ? this.currentValue : this.innerValue ?? TIME_PICKER_EMPTY,
popupProps: {