index.js 2.31 KB
Newer Older
田翔's avatar
田翔 committed
1
import React, { useEffect, useMemo, useState } from 'react'
田翔's avatar
田翔 committed
2 3
import { InputNumber } from 'antd'

田翔's avatar
田翔 committed
4 5 6 7 8 9 10 11 12 13 14
function formatMoney(number, places, symbol, thousand, decimal) {
  number = number || 0;
  places = !isNaN(places = Math.abs(places)) ? places : 2;
  symbol = symbol !== undefined ? symbol : "$";
  thousand = thousand || ",";
  decimal = decimal || ".";
  var negative = number < 0 ? "-" : "",
    i = parseInt(number = Math.abs(+number || 0).toFixed(places), 10) + "",
    j = (j = i.length) > 3 ? j % 3 : 0;
  return symbol + negative + (j ? i.substr(0, j) + thousand : "") + i.substr(j).replace(/(\d{3})(?=\d)/g, "$1" + thousand) + (places ? decimal + Math.abs(number - i).toFixed(places).slice(2) : "");
}
田翔's avatar
田翔 committed
15
const NumberInput = (props) => {
田翔's avatar
田翔 committed
16

17
  const { value, onChange, schema, addons } = props
田翔's avatar
田翔 committed
18 19 20
  const { disabled, presetValue, placeholder, prefix, formatter, decimalDigits, isStoreFormatter, addonBefore, addonAfter, min, max } = schema

  const [once, setOnce] = useState(true)
田翔's avatar
田翔 committed
21

田翔's avatar
田翔 committed
22
  useEffect(() => {
田翔's avatar
田翔 committed
23
    if (addons) {
24
      addons.setValueByPath(addons.dataPath, presetValue)
田翔's avatar
田翔 committed
25
    } else {
26
      onChange(presetValue)
田翔's avatar
田翔 committed
27 28
    }
  }, [presetValue])
田翔's avatar
田翔 committed
29

30 31
  const inputChange = (value) => {
    if (addons) {
32 33 34 35 36
      if (value !== null) {
        onChange(`${value}`)
      } else {
        onChange('')
      }
田翔's avatar
田翔 committed
37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52
    }
  }

  const formatterFn = (value) => {
    if (value) {
      if (formatter === '${百分比}') {
        return `${value}%`
      } else if (formatter === '${货币}') {
        return formatMoney(Number(value), Number(decimalDigits))
      } else if (formatter === '${整数}') {
        return `${parseInt(value)}`
      } else if (formatter === '${小数}') {
        return Number(value).toFixed(Number(decimalDigits))
      } else if (formatter) {
        return `${value}${formatter}`
      }
53
    }
田翔's avatar
田翔 committed
54
    return value
55 56
  }

田翔's avatar
田翔 committed
57 58
  return (
    <InputNumber
田翔's avatar
田翔 committed
59 60 61
      min={min || Number.MIN_SAFE_INTEGER}
      max={max || Number.MAX_SAFE_INTEGER}
      step={(formatter === '${百分比}' && isStoreFormatter) ? 0.01 : 1}
田翔's avatar
田翔 committed
62 63
      addonBefore={addonBefore}
      addonAfter={addonAfter}
田翔's avatar
田翔 committed
64
      prefix={prefix}
65
      placeholder={disabled ? null : placeholder}
田翔's avatar
田翔 committed
66
      disabled={disabled}
67
      value={value === '' ? null : Number(value)}
田翔's avatar
田翔 committed
68
      formatter={formatterFn}
69
      onChange={inputChange}
田翔's avatar
田翔 committed
70
      style={{ width: '100%' }}
田翔's avatar
田翔 committed
71 72 73 74 75 76
    />
  )

}

export default NumberInput