1 |
- {"version":3,"file":"index.js","sources":["../../src/components/Payment/PriceOptions/index.tsx"],"sourcesContent":["import React, { useState } from \"react\";\nimport classnames from \"classnames\";\nimport { Input } from \"antd\";\nimport styles from \"./PriceOptions.less\";\nimport { exportStyleSizeClass } from '../Utils/utils';\n\n/**\n * rowModa: \"single\" 单行 | \"multi\" 两行\n * price:number 金额\n * onPriceChange: (value: price) => void\n * size: \"small\" | \"normal\" | \"large\" 样式暂无支持\n * focusScroll:boolean 点击时是否自动滚动到输入框处\n * withTitle:boolean 是否显示标题\n * titleText:string|dom 标题内容 \n * inputPlaceholderText:string 输入框默认内容\n * priceOptions:Array 金额按钮数组,默认为 [100, 600, 800]\n * priceRender:Function 金额按钮内部数字渲染字样\n * inputPriceRender:Function 输入框金额字体渲染字样\n * inputSuffix:string|dom Antd组件Suffix属性\n * injectOptions: { priceBtnClass, priceInputClass } 分别控制具体渲染按钮和输入框样式 \n * inputRef:React.RefObject<any> Input的Ref \n * @interface Props\n */\ninterface Props {\n rowMode: \"single\" | \"multi\";\n price: number;\n onPriceChange: (v: number) => void;\n size: \"small\" | \"normal\" | \"large\";\n focusScroll: boolean;\n withTitle: boolean;\n allowZero: boolean;\n titleText?: string | JSX.Element[] | JSX.Element;\n inputPlaceholderText?: string;\n priceOptions?: Array<any>;\n priceRender?: Function;\n inputPriceRender?: Function;\n inputSuffix?: string | JSX.Element[] | JSX.Element;\n injectOptions?: {\n priceBtnClass: (isActive: boolean) => any;\n priceInputClass: Function;\n }\n inputRef: React.RefObject<any>;\n}\n\nconst PriceOptions = ({\n price,\n onPriceChange,\n allowZero,\n rowMode = \"single\",\n size = \"normal\",\n focusScroll = true,\n withTitle = true,\n titleText = \"Price\",\n inputPlaceholderText = \"Others\",\n priceOptions = [100, 600, 800],\n priceRender = (i: any) => i / 100,\n inputPriceRender = (i: any) => (i ? i / 100 : \"\"),\n inputSuffix = \"¥\",\n injectOptions = {\n priceBtnClass: () => undefined,\n priceInputClass: () => undefined,\n },\n inputRef\n}: Props) => {\n const defaultOptions = priceOptions;\n // 控制是否为其他金额输入情况\n const [inputStatus, setInputStatus] = useState(false);\n const [inputPrice, setInputPrice] = useState('');\n\n return (\n <div className={classnames(styles.options, {\n [styles.multi]: rowMode === \"multi\",\n ...exportStyleSizeClass(styles, size),\n })}>\n {withTitle ? (titleText || null) : null}\n <div className={styles.infoItem}>\n <span className={styles.priceBtn}>\n {defaultOptions.map(item => {\n const isActive = price === item && !inputStatus;\n return (\n <span\n className={classnames({\n [styles.priceItem]: true,\n [styles.active]: !injectOptions.priceBtnClass(isActive) && isActive,\n ...injectOptions.priceBtnClass(isActive),\n })}\n key={item}\n onClick={() => {\n onPriceChange(item);\n setInputStatus(false);\n }}\n >\n {priceRender(item)}\n </span>\n );\n })}\n </span>\n <Input\n ref={inputRef}\n className={classnames(styles.priceInput, {...injectOptions.priceInputClass()})}\n onMouseEnter={() => {\n if (inputStatus && inputRef && inputRef.current) {\n inputRef.current.focus();\n inputRef.current.select();\n }\n }}\n suffix={inputSuffix}\n value={inputStatus ? inputPriceRender(inputPrice) : \"\"}\n placeholder={inputPlaceholderText}\n onChange={e => {\n const n = +e.target.value;\n if (Number.isNaN(n)) {\n return;\n }\n if (!allowZero && n === 0) {\n return;\n }\n // 测试暂时改成1分\n setInputPrice(`${n * 100}`);\n onPriceChange(n * 100);\n }}\n onClick={e => {\n if (!inputStatus) {\n setInputPrice('');\n setInputStatus(true);\n }\n }}\n onFocus={e => {\n e.target.placeholder = \"\";\n if (inputStatus) {\n setInputPrice(`${price}`);\n } else {\n setInputPrice('');\n setInputStatus(true);\n }\n if (focusScroll) {\n e.target.scrollIntoView();\n }\n }}\n onBlur={e => {\n e.target.placeholder = inputPlaceholderText;\n if (inputPrice) {\n setInputStatus(true);\n } else {\n setInputStatus(false);\n }\n }}\n />\n </div>\n </div>\n );\n};\n\nexport default PriceOptions;\n"],"names":["PriceOptions","price","onPriceChange","allowZero","rowMode","size","focusScroll","withTitle","titleText","inputPlaceholderText","priceOptions","priceRender","i","inputPriceRender","inputSuffix","injectOptions","priceBtnClass","undefined","priceInputClass","inputRef","defaultOptions","useState","inputStatus","setInputStatus","inputPrice","setInputPrice","React","createElement","className","classnames","styles","options","multi","exportStyleSizeClass","infoItem","priceBtn","map","item","isActive","priceItem","active","key","onClick","Input","ref","priceInput","onMouseEnter","current","focus","select","suffix","value","placeholder","onChange","e","n","target","Number","isNaN","onFocus","scrollIntoView","onBlur"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AA4CA,IAAMA,YAAY,GAAG,SAAfA,YAAe,KAAA,EAmBT;MAlBVC,KAkBU,QAlBVA;MACAC,aAiBU,QAjBVA;MACAC,SAgBU,QAhBVA;0BACAC;MAAAA,OAeU,6BAfA;uBACVC;MAAAA,IAcU,0BAdH;8BACPC;MAAAA,WAaU,iCAbI;4BACdC;MAAAA,SAYU,+BAZE;4BACZC;MAAAA,SAWU,+BAXE;mCACZC;MAAAA,oBAUU,sCAVa;+BACvBC;MAAAA,YASU,kCATK,CAAC,GAAD,EAAM,GAAN,EAAW,GAAX;8BACfC;MAAAA,WAQU,iCARI,UAACC,CAAD;WAAYA,CAAC,GAAG;AAQpB;mCAPVC;MAAAA,gBAOU,sCAPS,UAACD,CAAD;WAAaA,CAAC,GAAGA,CAAC,GAAG,GAAP,GAAa;AAOpC;8BANVE;MAAAA,WAMU,iCANI;gCACdC;MAAAA,aAKU,mCALM;AACdC,IAAAA,aAAa,EAAE,sBAAA;aAAMC;AADP,KAAA;AAEdC,IAAAA,eAAe,EAAE,wBAAA;aAAMD;;AAFT;MAIhBE,QACU,QADVA;MAEMC,cAAc,GAAGV;;kBAEeW,QAAQ,CAAC,KAAD;;MAAvCC,WAHG;MAGUC,cAHV;;mBAI0BF,QAAQ,CAAC,EAAD;;MAArCG,UAJG;MAISC,aAJT;;SAORC,KAAA,CAAAC,aAAA,CAAA,KAAA,EAAA;AAAKC,IAAAA,SAAS,EAAEC,UAAU,CAACC,MAAM,CAACC,OAAR,oCACvBD,MAAM,CAACE,OAAQ5B,OAAO,KAAK,UACzB6B,oBAAoB,CAACH,MAAD,EAASzB,IAAT,EAFC;AAA1B,GAAA,EAIGE,SAAS,GAAIC,SAAS,IAAI,IAAjB,GAAyB,IAJrC,EAKEkB,KAAA,CAAAC,aAAA,CAAA,KAAA,EAAA;AAAKC,IAAAA,SAAS,EAAEE,MAAM,CAACI;AAAvB,GAAA,EACER,KAAA,CAAAC,aAAA,CAAA,MAAA,EAAA;AAAMC,IAAAA,SAAS,EAAEE,MAAM,CAACK;AAAxB,GAAA,EACGf,cAAc,CAACgB,GAAf,CAAmB,UAAAC,IAAA,EAAO;;;QACnBC,QAAQ,GAAGrC,KAAK,KAAKoC,IAAV,IAAkB,CAACf;WAElCI,KAAA,CAAAC,aAAA,CAAA,MAAA,EAAA;AACEC,MAAAA,SAAS,EAAEC,UAAU,qEAClBC,MAAM,CAACS,WAAY,uCACnBT,MAAM,CAACU,QAAS,CAACzB,aAAa,CAACC,aAAd,CAA4BsB,QAA5B,CAAD,IAA0CA,4BACxDvB,aAAa,CAACC,aAAd,CAA4BsB,QAA5B,EAHgB,CADvB;AAMEG,MAAAA,GAAG,EAAEJ,IANP;AAOEK,MAAAA,OAAO,EAAE,gBAAA,GAAK;AACZxC,QAAAA,aAAa,CAACmC,IAAD,CAAb;AACAd,QAAAA,cAAc,CAAC,KAAD,CAAd;;AATJ,KAAA,EAYGZ,WAAW,CAAC0B,IAAD,CAZd;AAHH,GAAA,CADH,CADF,EAsBEX,KAAA,CAAAC,aAAA,CAACgB,KAAD,EAAM;AACJC,IAAAA,GAAG,EAAEzB,QADD;AAEJS,IAAAA,SAAS,EAAEC,UAAU,CAACC,MAAM,CAACe,UAAR,oBAAwB9B,aAAa,CAACG,eAAd,GAAxB,CAFjB;AAGJ4B,IAAAA,YAAY,EAAE,qBAAA,GAAK;UACbxB,WAAW,IAAIH,QAAf,IAA2BA,QAAQ,CAAC4B,SAAS;AAC/C5B,QAAAA,QAAQ,CAAC4B,OAAT,CAAiBC,KAAjB;AACA7B,QAAAA,QAAQ,CAAC4B,OAAT,CAAiBE,MAAjB;;AANA,KAAA;AASJC,IAAAA,MAAM,EAAEpC,WATJ;AAUJqC,IAAAA,KAAK,EAAE7B,WAAW,GAAGT,gBAAgB,CAACW,UAAD,CAAnB,GAAkC,EAVhD;AAWJ4B,IAAAA,WAAW,EAAE3C,oBAXT;AAYJ4C,IAAAA,QAAQ,EAAE,iBAAA,CAAAC,CAAA,EAAI;UACNC,CAAC,GAAG,CAACD,CAAC,CAACE,MAAF,CAASL;;UAChBM,MAAM,CAACC,KAAP,CAAaH,CAAb,GAAiB;;;;UAGjB,CAACpD,SAAD,IAAcoD,CAAC,KAAK,GAAG;;;;AAI3B9B,MAAAA,aAAa,WAAI8B,CAAC,GAAG,IAAR,CAAb;AACArD,MAAAA,aAAa,CAACqD,CAAC,GAAG,GAAL,CAAb;AAtBE,KAAA;AAwBJb,IAAAA,OAAO,EAAE,gBAAA,CAAAY,CAAA,EAAI;UACP,CAAChC,aAAa;AAChBG,QAAAA,aAAa,CAAC,EAAD,CAAb;AACAF,QAAAA,cAAc,CAAC,IAAD,CAAd;;AA3BA,KAAA;AA8BJoC,IAAAA,OAAO,EAAE,gBAAA,CAAAL,CAAA,EAAI;AACXA,MAAAA,CAAC,CAACE,MAAF,CAASJ,WAAT,GAAuB,EAAvB;;UACI9B,aAAa;AACfG,QAAAA,aAAa,WAAIxB,MAAJ,CAAb;AADF,aAEO;AACLwB,QAAAA,aAAa,CAAC,EAAD,CAAb;AACAF,QAAAA,cAAc,CAAC,IAAD,CAAd;;;UAEEjB,aAAa;AACfgD,QAAAA,CAAC,CAACE,MAAF,CAASI,cAAT;;AAvCA,KAAA;AA0CJC,IAAAA,MAAM,EAAE,eAAA,CAAAP,CAAA,EAAI;AACVA,MAAAA,CAAC,CAACE,MAAF,CAASJ,WAAT,GAAuB3C,oBAAvB;;UACIe,YAAY;AACdD,QAAAA,cAAc,CAAC,IAAD,CAAd;AADF,aAEO;AACLA,QAAAA,cAAc,CAAC,KAAD,CAAd;;;AA/CA,GAAN,CAtBF,CALF;AA1BJ,CAAA;;;;"}
|