fix: clearable of datepicker and timepicker

Author: uyarn

src/date-picker/date-picker.tsx

@@ -533,6 +533,11 @@ export default defineComponent({
       }
       return placeholderStr;
     },
+    handleTInputFocus() {
+      // TODO: 待改成select-input后删除
+      // hack 在input聚焦时马上blur 避免出现输入光标
+      (this.$refs.native as HTMLInputElement).blur();
+    },
   },
   render() {
     // props
@@ -655,7 +660,6 @@ export default defineComponent({
               disabled={disabled}
               clearable={clearable}
               placeholder={this.getPlaceholderText()}
-              readonly={!allowInput}
               allowInput={allowInput ? 1 : 0}
               size={size}
               inputProps={inputProps}
@@ -668,6 +672,7 @@ export default defineComponent({
               click={this.onClick}
               suffixIcon={suffixIcon}
               prefixIcon={prefixIcon}
+              onFocus={this.handleTInputFocus}
             />
           </div>
         </t-popup>

src/time-picker/time-picker.tsx

@@ -299,6 +299,11 @@ export default defineComponent({
       emitEvent(this, 'change', undefined);
       e.stopPropagation();
     },
+    handleTInputFocus() {
+      // TODO: 待改成select-input后删除
+      // hack 在input聚焦时马上blur 避免出现输入光标
+      (this.$refs.tInput as HTMLInputElement).blur();
+    },
     renderInput() {
       const classes = [
         `${this.COMPONENT_NAME}__group`,
@@ -317,11 +322,12 @@ export default defineComponent({
             size={this.size}
             onClear={this.clear}
             clearable={this.clearable}
-            readonly
             placeholder=" "
             value={this.time ? ' ' : undefined}
             class={this.isShowPanel ? this.STATUS.focused : ''}
             v-slots={slots}
+            ref="tInput"
+            onFocus={this.handleTInputFocus}
           ></t-input>
           <input-items
             size={this.size}

src/time-picker/time-range-picker.tsx

@@ -257,6 +257,11 @@ export default defineComponent({
       emitEvent(this, 'change', values);
       isFunction(this.onChange) && this.onChange(values);
     },
+    handleTInputFocus() {
+      // TODO: 待改成select-input后删除
+      // hack 在input聚焦时马上blur 避免出现输入光标
+      (this.$refs.tInput as HTMLInputElement).blur();
+    },
     renderInput() {
       const classes = [
         `${this.COMPONENT_NAME}__group`,
@@ -272,8 +277,9 @@ export default defineComponent({
             onClear={this.clear}
             clearable={this.clearable}
             placeholder=" "
-            readonly
             value={!isEqual(this.time, TIME_PICKER_EMPTY) ? ' ' : undefined}
+            ref="tInput"
+            onFocus={this.handleTInputFocus}
           >
             <time-icon slot="suffix-icon"></time-icon>
           </t-input>