fix(Timepicker): Can`t select last time

alibaba-fusion · Jul 25, 2019 · 40b9f46 · 40b9f46
1 parent b193dad
commit 40b9f46
Show file tree

Hide file tree

Showing 2 changed files with 34 additions and 23 deletions.
diff --git a/src/time-picker/module/time-menu.jsx b/src/time-picker/module/time-menu.jsx
@@ -71,43 +71,54 @@ class TimeMenu extends React.Component {
         this.menu = ref;
     };
 
-    render() {
+    createTimeMenuItem = index => {
         const {
             prefix,
-            title,
             mode,
             activeIndex,
-            step,
             disabled,
             disabledItems,
             onSelect,
         } = this.props;
+        const isDisabled = disabled || disabledItems(index);
+        const itemCls = classnames({
+            [`${prefix}time-picker-menu-item`]: true,
+            [`${prefix}disabled`]: isDisabled,
+            [`${prefix}selected`]: index === activeIndex,
+        });
+        const handleClick = isDisabled ? noop : () => onSelect(index, mode);
+
+        return (
+            // eslint-disable-next-line jsx-a11y/click-events-have-key-events
+            <li
+                role="option"
+                aria-selected={String(index === activeIndex)}
+                key={index}
+                title={index}
+                className={itemCls}
+                onClick={handleClick}
+            >
+                {index}
+            </li>
+        );
+    };
+
+    render() {
+        const { prefix, title, mode, step } = this.props;
         const total = mode === 'hour' ? 24 : 60;
         const list = [];
+        let last = 0;
         for (let i = 0; i < total; i++) {
             if (i % step === 0) {
-                const isDisabled = disabled || disabledItems(i);
-                const itemCls = classnames({
-                    [`${prefix}time-picker-menu-item`]: true,
-                    [`${prefix}disabled`]: isDisabled,
-                    [`${prefix}selected`]: i === activeIndex,
-                });
-                const onClick = isDisabled ? noop : () => onSelect(i, mode);
-                list.push(
-                    <li
-                        role="option"
-                        aria-selected={String(i === activeIndex)}
-                        key={i}
-                        title={i}
-                        className={itemCls}
-                        onClick={onClick}
-                    >
-                        {i}
-                    </li>
-                );
+                last = i;
+                list.push(this.createTimeMenuItem(i));
             }
         }
 
+        if (last < total - 1) {
+            list.push(this.createTimeMenuItem(total - 1));
+        }
+
         const menuTitle = title ? (
             <div className={`${prefix}time-picker-menu-title`}>{title}</div>
         ) : null;

diff --git a/test/time-picker/index-spec.js b/test/time-picker/index-spec.js
@@ -100,7 +100,7 @@ describe('TimePicker', () => {
             assert(
                 wrapper.find(
                     '.next-time-picker-menu-second .next-time-picker-menu-item'
-                ).length === 12
+                ).length === 13
             );
         });
     });