Add natural number money input demo (ant-design#1493)

* add int only money input demo * fix focus * rename int to natural * update snapshot
lixiaoyang1992 · Apr 26, 2018 · c44384e · c44384e
1 parent 5509ab5
commit c44384e
Show file tree

Hide file tree

Showing 2 changed files with 121 additions and 2 deletions.
diff --git a/components/input-item/__tests__/__snapshots__/demo.test.web.js.snap b/components/input-item/__tests__/__snapshots__/demo.test.web.js.snap
@@ -753,6 +753,113 @@ exports[`renders ./components/input-item/demo/money.md correctly 1`] = `
           style="display:none;"
         />
       </div>
+      <div
+        class="am-list-item am-input-item"
+      >
+        <div
+          class="am-input-label am-input-label-5"
+        >
+          正整数
+        </div>
+        <div
+          class="am-input-control"
+        >
+          <div
+            class="fake-input-container"
+          >
+            <div
+              class="fake-input-placeholder"
+            >
+              money format natural
+            </div>
+            <div
+              class="fake-input"
+            />
+            <div
+              class="am-number-keyboard-wrapper am-number-keyboard-wrapper-hide"
+            >
+              <table>
+                <tbody>
+                  <tr>
+                    <td
+                      class="am-number-keyboard-item"
+                    >
+                      1
+                    </td>
+                    <td
+                      class="am-number-keyboard-item"
+                    >
+                      2
+                    </td>
+                    <td
+                      class="am-number-keyboard-item"
+                    >
+                      3
+                    </td>
+                    <td
+                      class="keyboard-delete am-number-keyboard-item"
+                      rowspan="2"
+                    />
+                  </tr>
+                  <tr>
+                    <td
+                      class="am-number-keyboard-item"
+                    >
+                      4
+                    </td>
+                    <td
+                      class="am-number-keyboard-item"
+                    >
+                      5
+                    </td>
+                    <td
+                      class="am-number-keyboard-item"
+                    >
+                      6
+                    </td>
+                  </tr>
+                  <tr>
+                    <td
+                      class="am-number-keyboard-item"
+                    >
+                      7
+                    </td>
+                    <td
+                      class="am-number-keyboard-item"
+                    >
+                      8
+                    </td>
+                    <td
+                      class="am-number-keyboard-item"
+                    >
+                      9
+                    </td>
+                    <td
+                      class="keyboard-confirm am-number-keyboard-item am-number-keyboard-item-disabled"
+                      rowspan="2"
+                    />
+                  </tr>
+                  <tr>
+                    <td
+                      class="am-number-keyboard-item"
+                    >
+                      .
+                    </td>
+                    <td
+                      class="am-number-keyboard-item"
+                    >
+                      0
+                    </td>
+                    <td
+                      class="keyboard-hide am-number-keyboard-item"
+                    />
+                  </tr>
+                </tbody>
+              </table>
+            </div>
+          </div>
+        </div>
+      </div>
     </div>
   </div>
 </div>

diff --git a/components/input-item/demo/money.md b/components/input-item/demo/money.md
@@ -67,9 +67,21 @@ class H5NumberInputExample extends React.Component {
                 });
               }}
             >
-          click to focus
-        </div>
+              click to focus
+            </div>
           </List.Item>
+          <InputItem
+            {...getFieldProps('moneynatural', {
+              normalize: (v) => {
+                if (v && (v.charAt(0) === '0' || v.indexOf('.') >= 0)) {
+                  return v.replace(/^0*(\d*).*$/, '$1');
+                }
+                return v;
+              },
+            })}
+            type="money"
+            placeholder="money format natural"
+          >正整数</InputItem>
         </List>
       </div>
     );