소스 검색

dev&build: 调整Price组件

Roxas 4 년 전
부모
커밋
e24449d208

+ 2
- 2
eslib/PriceOptions/index.d.ts 파일 보기

@@ -14,8 +14,8 @@ interface Props {
14 14
     inputPriceRender?: Function;
15 15
     inputSuffix?: string | JSX.Element[] | JSX.Element;
16 16
     injectOptions?: {
17
-        priceBtnClass: any;
18
-        priceInputClass: any;
17
+        priceBtnClass: (isActive: boolean) => any;
18
+        priceInputClass: Function;
19 19
     };
20 20
     inputRef: React.RefObject<any>;
21 21
 }

+ 9
- 5
eslib/PriceOptions/index.js 파일 보기

@@ -7,7 +7,7 @@ import { e as exportStyleSizeClass } from '../utils-6b513b37.js';
7 7
 import { _ as _slicedToArray } from '../slicedToArray-4cd9e6d3.js';
8 8
 import { Input } from 'antd';
9 9
 
10
-var css = ".PriceOptions_options__ifYbC {\n  border-bottom: 1px dashed #00000017;\n}\n.PriceOptions_options__ifYbC p {\n  font-size: 14px;\n  font-weight: 400;\n  color: #616a79;\n  margin-bottom: 20px;\n}\n.PriceOptions_options__ifYbC .PriceOptions_infoItem__246mx {\n  padding-right: 0;\n}\n.PriceOptions_options__ifYbC .PriceOptions_infoItem__246mx .PriceOptions_priceItem__3CPe3 {\n  background: rgba(243, 243, 243, 0.14);\n  border-radius: 4px;\n  border: 1px solid #cfcfcf;\n  font-size: 14px;\n  font-weight: 600;\n  color: #616a79;\n  display: inline-block;\n  text-align: center;\n  vertical-align: top;\n  height: 30px;\n  width: 70px;\n  line-height: 30px;\n  cursor: pointer;\n  margin: 6px;\n}\n.PriceOptions_options__ifYbC .PriceOptions_infoItem__246mx .PriceOptions_priceItem__3CPe3.PriceOptions_active__154by {\n  background: rgba(255, 50, 102, 0.1);\n  border-radius: 4px;\n  border: 1px solid #ff3266;\n  color: #616a79;\n}\n.PriceOptions_options__ifYbC .PriceOptions_infoItem__246mx .PriceOptions_priceInput__2JFc0 {\n  display: inline-block;\n  min-width: 70px;\n  width: auto;\n  margin: 6px;\n  text-align: center;\n}\n.PriceOptions_options__ifYbC .PriceOptions_infoItem__246mx button {\n  border-top-left-radius: 0;\n  border-bottom-left-radius: 0;\n  height: 30px;\n  width: 50px;\n  vertical-align: top;\n  padding: 0 5px;\n}\n.PriceOptions_options__ifYbC .PriceOptions_infoItem__246mx .PriceOptions_rate__17U-9 {\n  margin-left: 10px;\n}\n.PriceOptions_options__ifYbC .PriceOptions_infoItem__246mx .PriceOptions_rate__17U-9 i {\n  margin-right: 5px;\n  color: #1790FF;\n}\n.PriceOptions_options__ifYbC.PriceOptions_multi__2fM8z p {\n  font-size: 14px;\n  font-weight: 400;\n  color: #616a79;\n}\n.PriceOptions_options__ifYbC.PriceOptions_multi__2fM8z .PriceOptions_infoItem__246mx {\n  padding-right: 0;\n  display: flex;\n  flex-direction: column;\n  justify-content: center;\n}\n.PriceOptions_options__ifYbC.PriceOptions_multi__2fM8z .PriceOptions_infoItem__246mx .PriceOptions_priceBtn__1UaE8 {\n  display: flex;\n  justify-content: space-between;\n}\n.PriceOptions_options__ifYbC.PriceOptions_multi__2fM8z .PriceOptions_infoItem__246mx .PriceOptions_priceItem__3CPe3 {\n  display: inline-block;\n  background-color: #fff;\n  border-radius: 4px;\n  border: 1px solid #cfcfcf;\n}\n.PriceOptions_options__ifYbC.PriceOptions_multi__2fM8z .PriceOptions_infoItem__246mx .PriceOptions_priceItem__3CPe3.PriceOptions_active__154by {\n  background-color: #fff;\n  color: #FF3266FF;\n  border: 1px solid #ff3266;\n}\n.PriceOptions_options__ifYbC.PriceOptions_multi__2fM8z .PriceOptions_infoItem__246mx .PriceOptions_priceInput__2JFc0 {\n  width: 222px;\n  width: auto;\n}\n";
10
+var css = ".PriceOptions_options__ifYbC p {\n  font-size: 14px;\n  font-weight: 400;\n  color: #616a79;\n  margin-bottom: 20px;\n}\n.PriceOptions_options__ifYbC .PriceOptions_infoItem__246mx {\n  padding-right: 0;\n}\n.PriceOptions_options__ifYbC .PriceOptions_infoItem__246mx .PriceOptions_priceItem__3CPe3 {\n  background: rgba(243, 243, 243, 0.14);\n  border-radius: 4px;\n  border: 1px solid #cfcfcf;\n  font-size: 14px;\n  font-weight: 600;\n  color: #616a79;\n  display: inline-block;\n  text-align: center;\n  vertical-align: top;\n  height: 30px;\n  width: 70px;\n  line-height: 30px;\n  cursor: pointer;\n  margin: 6px;\n}\n.PriceOptions_options__ifYbC .PriceOptions_infoItem__246mx .PriceOptions_priceItem__3CPe3.PriceOptions_active__154by {\n  background: rgba(255, 50, 102, 0.1);\n  border-radius: 4px;\n  border: 1px solid #ff3266;\n  color: #616a79;\n}\n.PriceOptions_options__ifYbC .PriceOptions_infoItem__246mx .PriceOptions_priceInput__2JFc0 {\n  display: inline-block;\n  min-width: 70px;\n  height: 72px;\n  width: auto;\n  margin: 6px;\n  text-align: center;\n}\n.PriceOptions_options__ifYbC .PriceOptions_infoItem__246mx button {\n  border-top-left-radius: 0;\n  border-bottom-left-radius: 0;\n  height: 30px;\n  width: 50px;\n  vertical-align: top;\n  padding: 0 5px;\n}\n.PriceOptions_options__ifYbC .PriceOptions_infoItem__246mx .PriceOptions_rate__17U-9 {\n  margin-left: 10px;\n}\n.PriceOptions_options__ifYbC .PriceOptions_infoItem__246mx .PriceOptions_rate__17U-9 i {\n  margin-right: 5px;\n  color: #1790FF;\n}\n.PriceOptions_options__ifYbC.PriceOptions_multi__2fM8z p {\n  font-size: 14px;\n  font-weight: 400;\n  color: #616a79;\n}\n.PriceOptions_options__ifYbC.PriceOptions_multi__2fM8z .PriceOptions_infoItem__246mx {\n  padding-right: 0;\n  display: flex;\n  flex-direction: column;\n  justify-content: center;\n}\n.PriceOptions_options__ifYbC.PriceOptions_multi__2fM8z .PriceOptions_infoItem__246mx .PriceOptions_priceBtn__1UaE8 {\n  display: flex;\n  justify-content: space-between;\n}\n.PriceOptions_options__ifYbC.PriceOptions_multi__2fM8z .PriceOptions_infoItem__246mx .PriceOptions_priceItem__3CPe3 {\n  display: inline-block;\n  background-color: #fff;\n  border-radius: 4px;\n  border: 1px solid #cfcfcf;\n}\n.PriceOptions_options__ifYbC.PriceOptions_multi__2fM8z .PriceOptions_infoItem__246mx .PriceOptions_priceItem__3CPe3.PriceOptions_active__154by {\n  background-color: #fff;\n  color: #FF3266FF;\n  border: 1px solid #ff3266;\n}\n.PriceOptions_options__ifYbC.PriceOptions_multi__2fM8z .PriceOptions_infoItem__246mx .PriceOptions_priceInput__2JFc0 {\n  width: 222px;\n  width: auto;\n}\n";
11 11
 var styles = {
12 12
   "options": "PriceOptions_options__ifYbC",
13 13
   "infoItem": "PriceOptions_infoItem__246mx",
@@ -83,8 +83,12 @@ var PriceOptions = function PriceOptions(_ref) {
83 83
       inputSuffix = _ref$inputSuffix === void 0 ? "¥" : _ref$inputSuffix,
84 84
       _ref$injectOptions = _ref.injectOptions,
85 85
       injectOptions = _ref$injectOptions === void 0 ? {
86
-    priceBtnClass: {},
87
-    priceInputClass: {}
86
+    priceBtnClass: function priceBtnClass() {
87
+      return undefined;
88
+    },
89
+    priceInputClass: function priceInputClass() {
90
+      return undefined;
91
+    }
88 92
   } : _ref$injectOptions,
89 93
       inputRef = _ref.inputRef;
90 94
   var defaultOptions = priceOptions;
@@ -109,7 +113,7 @@ var PriceOptions = function PriceOptions(_ref) {
109 113
     var _objectSpread3;
110 114
 
111 115
     return React.createElement("span", {
112
-      className: classnames(_objectSpread((_objectSpread3 = {}, _defineProperty(_objectSpread3, styles.priceItem, true), _defineProperty(_objectSpread3, styles.active, price === item && !inputStatus), _objectSpread3), injectOptions.priceBtnClass)),
116
+      className: classnames(_objectSpread((_objectSpread3 = {}, _defineProperty(_objectSpread3, styles.priceItem, true), _defineProperty(_objectSpread3, styles.active, price === item && !inputStatus), _objectSpread3), injectOptions.priceBtnClass(price === item && !inputStatus))),
113 117
       key: item,
114 118
       onClick: function onClick() {
115 119
         onPriceChange(item);
@@ -118,7 +122,7 @@ var PriceOptions = function PriceOptions(_ref) {
118 122
     }, priceRender(item));
119 123
   })), React.createElement(Input, {
120 124
     ref: inputRef,
121
-    className: classnames(styles.priceInput, _objectSpread({}, injectOptions.priceInputClass)),
125
+    className: classnames(styles.priceInput, _objectSpread({}, injectOptions.priceInputClass())),
122 126
     onMouseEnter: function onMouseEnter() {
123 127
       if (inputStatus && inputRef && inputRef.current) {
124 128
         inputRef.current.focus();

+ 1
- 1
eslib/PriceOptions/index.js.map
파일 크기가 너무 크기때문에 변경 상태를 표시하지 않습니다.
파일 보기


+ 2
- 2
lib/PriceOptions/index.d.ts 파일 보기

@@ -14,8 +14,8 @@ interface Props {
14 14
     inputPriceRender?: Function;
15 15
     inputSuffix?: string | JSX.Element[] | JSX.Element;
16 16
     injectOptions?: {
17
-        priceBtnClass: any;
18
-        priceInputClass: any;
17
+        priceBtnClass: (isActive: boolean) => any;
18
+        priceInputClass: Function;
19 19
     };
20 20
     inputRef: React.RefObject<any>;
21 21
 }

+ 9
- 5
lib/PriceOptions/index.js 파일 보기

@@ -14,7 +14,7 @@ var utils = require('../utils-b800dc99.js');
14 14
 var slicedToArray = require('../slicedToArray-172f4624.js');
15 15
 var antd = require('antd');
16 16
 
17
-var css = ".PriceOptions_options__ifYbC {\n  border-bottom: 1px dashed #00000017;\n}\n.PriceOptions_options__ifYbC p {\n  font-size: 14px;\n  font-weight: 400;\n  color: #616a79;\n  margin-bottom: 20px;\n}\n.PriceOptions_options__ifYbC .PriceOptions_infoItem__246mx {\n  padding-right: 0;\n}\n.PriceOptions_options__ifYbC .PriceOptions_infoItem__246mx .PriceOptions_priceItem__3CPe3 {\n  background: rgba(243, 243, 243, 0.14);\n  border-radius: 4px;\n  border: 1px solid #cfcfcf;\n  font-size: 14px;\n  font-weight: 600;\n  color: #616a79;\n  display: inline-block;\n  text-align: center;\n  vertical-align: top;\n  height: 30px;\n  width: 70px;\n  line-height: 30px;\n  cursor: pointer;\n  margin: 6px;\n}\n.PriceOptions_options__ifYbC .PriceOptions_infoItem__246mx .PriceOptions_priceItem__3CPe3.PriceOptions_active__154by {\n  background: rgba(255, 50, 102, 0.1);\n  border-radius: 4px;\n  border: 1px solid #ff3266;\n  color: #616a79;\n}\n.PriceOptions_options__ifYbC .PriceOptions_infoItem__246mx .PriceOptions_priceInput__2JFc0 {\n  display: inline-block;\n  min-width: 70px;\n  width: auto;\n  margin: 6px;\n  text-align: center;\n}\n.PriceOptions_options__ifYbC .PriceOptions_infoItem__246mx button {\n  border-top-left-radius: 0;\n  border-bottom-left-radius: 0;\n  height: 30px;\n  width: 50px;\n  vertical-align: top;\n  padding: 0 5px;\n}\n.PriceOptions_options__ifYbC .PriceOptions_infoItem__246mx .PriceOptions_rate__17U-9 {\n  margin-left: 10px;\n}\n.PriceOptions_options__ifYbC .PriceOptions_infoItem__246mx .PriceOptions_rate__17U-9 i {\n  margin-right: 5px;\n  color: #1790FF;\n}\n.PriceOptions_options__ifYbC.PriceOptions_multi__2fM8z p {\n  font-size: 14px;\n  font-weight: 400;\n  color: #616a79;\n}\n.PriceOptions_options__ifYbC.PriceOptions_multi__2fM8z .PriceOptions_infoItem__246mx {\n  padding-right: 0;\n  display: flex;\n  flex-direction: column;\n  justify-content: center;\n}\n.PriceOptions_options__ifYbC.PriceOptions_multi__2fM8z .PriceOptions_infoItem__246mx .PriceOptions_priceBtn__1UaE8 {\n  display: flex;\n  justify-content: space-between;\n}\n.PriceOptions_options__ifYbC.PriceOptions_multi__2fM8z .PriceOptions_infoItem__246mx .PriceOptions_priceItem__3CPe3 {\n  display: inline-block;\n  background-color: #fff;\n  border-radius: 4px;\n  border: 1px solid #cfcfcf;\n}\n.PriceOptions_options__ifYbC.PriceOptions_multi__2fM8z .PriceOptions_infoItem__246mx .PriceOptions_priceItem__3CPe3.PriceOptions_active__154by {\n  background-color: #fff;\n  color: #FF3266FF;\n  border: 1px solid #ff3266;\n}\n.PriceOptions_options__ifYbC.PriceOptions_multi__2fM8z .PriceOptions_infoItem__246mx .PriceOptions_priceInput__2JFc0 {\n  width: 222px;\n  width: auto;\n}\n";
17
+var css = ".PriceOptions_options__ifYbC p {\n  font-size: 14px;\n  font-weight: 400;\n  color: #616a79;\n  margin-bottom: 20px;\n}\n.PriceOptions_options__ifYbC .PriceOptions_infoItem__246mx {\n  padding-right: 0;\n}\n.PriceOptions_options__ifYbC .PriceOptions_infoItem__246mx .PriceOptions_priceItem__3CPe3 {\n  background: rgba(243, 243, 243, 0.14);\n  border-radius: 4px;\n  border: 1px solid #cfcfcf;\n  font-size: 14px;\n  font-weight: 600;\n  color: #616a79;\n  display: inline-block;\n  text-align: center;\n  vertical-align: top;\n  height: 30px;\n  width: 70px;\n  line-height: 30px;\n  cursor: pointer;\n  margin: 6px;\n}\n.PriceOptions_options__ifYbC .PriceOptions_infoItem__246mx .PriceOptions_priceItem__3CPe3.PriceOptions_active__154by {\n  background: rgba(255, 50, 102, 0.1);\n  border-radius: 4px;\n  border: 1px solid #ff3266;\n  color: #616a79;\n}\n.PriceOptions_options__ifYbC .PriceOptions_infoItem__246mx .PriceOptions_priceInput__2JFc0 {\n  display: inline-block;\n  min-width: 70px;\n  height: 72px;\n  width: auto;\n  margin: 6px;\n  text-align: center;\n}\n.PriceOptions_options__ifYbC .PriceOptions_infoItem__246mx button {\n  border-top-left-radius: 0;\n  border-bottom-left-radius: 0;\n  height: 30px;\n  width: 50px;\n  vertical-align: top;\n  padding: 0 5px;\n}\n.PriceOptions_options__ifYbC .PriceOptions_infoItem__246mx .PriceOptions_rate__17U-9 {\n  margin-left: 10px;\n}\n.PriceOptions_options__ifYbC .PriceOptions_infoItem__246mx .PriceOptions_rate__17U-9 i {\n  margin-right: 5px;\n  color: #1790FF;\n}\n.PriceOptions_options__ifYbC.PriceOptions_multi__2fM8z p {\n  font-size: 14px;\n  font-weight: 400;\n  color: #616a79;\n}\n.PriceOptions_options__ifYbC.PriceOptions_multi__2fM8z .PriceOptions_infoItem__246mx {\n  padding-right: 0;\n  display: flex;\n  flex-direction: column;\n  justify-content: center;\n}\n.PriceOptions_options__ifYbC.PriceOptions_multi__2fM8z .PriceOptions_infoItem__246mx .PriceOptions_priceBtn__1UaE8 {\n  display: flex;\n  justify-content: space-between;\n}\n.PriceOptions_options__ifYbC.PriceOptions_multi__2fM8z .PriceOptions_infoItem__246mx .PriceOptions_priceItem__3CPe3 {\n  display: inline-block;\n  background-color: #fff;\n  border-radius: 4px;\n  border: 1px solid #cfcfcf;\n}\n.PriceOptions_options__ifYbC.PriceOptions_multi__2fM8z .PriceOptions_infoItem__246mx .PriceOptions_priceItem__3CPe3.PriceOptions_active__154by {\n  background-color: #fff;\n  color: #FF3266FF;\n  border: 1px solid #ff3266;\n}\n.PriceOptions_options__ifYbC.PriceOptions_multi__2fM8z .PriceOptions_infoItem__246mx .PriceOptions_priceInput__2JFc0 {\n  width: 222px;\n  width: auto;\n}\n";
18 18
 var styles = {
19 19
   "options": "PriceOptions_options__ifYbC",
20 20
   "infoItem": "PriceOptions_infoItem__246mx",
@@ -90,8 +90,12 @@ var PriceOptions = function PriceOptions(_ref) {
90 90
       inputSuffix = _ref$inputSuffix === void 0 ? "¥" : _ref$inputSuffix,
91 91
       _ref$injectOptions = _ref.injectOptions,
92 92
       injectOptions = _ref$injectOptions === void 0 ? {
93
-    priceBtnClass: {},
94
-    priceInputClass: {}
93
+    priceBtnClass: function priceBtnClass() {
94
+      return undefined;
95
+    },
96
+    priceInputClass: function priceInputClass() {
97
+      return undefined;
98
+    }
95 99
   } : _ref$injectOptions,
96 100
       inputRef = _ref.inputRef;
97 101
   var defaultOptions = priceOptions;
@@ -116,7 +120,7 @@ var PriceOptions = function PriceOptions(_ref) {
116 120
     var _objectSpread3;
117 121
 
118 122
     return React__default.createElement("span", {
119
-      className: index.classnames(_objectSpread((_objectSpread3 = {}, defineProperty._defineProperty(_objectSpread3, styles.priceItem, true), defineProperty._defineProperty(_objectSpread3, styles.active, price === item && !inputStatus), _objectSpread3), injectOptions.priceBtnClass)),
123
+      className: index.classnames(_objectSpread((_objectSpread3 = {}, defineProperty._defineProperty(_objectSpread3, styles.priceItem, true), defineProperty._defineProperty(_objectSpread3, styles.active, price === item && !inputStatus), _objectSpread3), injectOptions.priceBtnClass(price === item && !inputStatus))),
120 124
       key: item,
121 125
       onClick: function onClick() {
122 126
         onPriceChange(item);
@@ -125,7 +129,7 @@ var PriceOptions = function PriceOptions(_ref) {
125 129
     }, priceRender(item));
126 130
   })), React__default.createElement(antd.Input, {
127 131
     ref: inputRef,
128
-    className: index.classnames(styles.priceInput, _objectSpread({}, injectOptions.priceInputClass)),
132
+    className: index.classnames(styles.priceInput, _objectSpread({}, injectOptions.priceInputClass())),
129 133
     onMouseEnter: function onMouseEnter() {
130 134
       if (inputStatus && inputRef && inputRef.current) {
131 135
         inputRef.current.focus();

+ 1
- 1
lib/PriceOptions/index.js.map
파일 크기가 너무 크기때문에 변경 상태를 표시하지 않습니다.
파일 보기


+ 6
- 38
src/components/Payment/PriceOptions/PriceOptions.less 파일 보기

@@ -1,8 +1,7 @@
1 1
 @item_width: 70px;
2 2
 @item_margin: 6px;
3
+@item_border_width: 1px;
3 4
 .options{
4
-  border-bottom: 1px dashed #00000017;
5
-
6 5
   p {
7 6
     font-size:14px;
8 7
     font-weight:400;
@@ -14,7 +13,7 @@
14 13
     .priceItem {
15 14
       background:rgba(243,243,243,0.14);
16 15
       border-radius:4px;
17
-      border:1px solid rgba(207,207,207,1);
16
+      border:@item_border_width solid rgba(207,207,207,1);
18 17
       font-size:14px;
19 18
       font-weight:600;
20 19
       color:rgba(97,106,121,1);
@@ -30,13 +29,14 @@
30 29
       &.active {
31 30
         background:rgba(255,50,102,0.1);
32 31
         border-radius:4px;
33
-        border:1px solid rgba(255,50,102,1);
32
+        border:@item_border_width solid rgba(255,50,102,1);
34 33
         color:rgba(97,106,121,1);
35 34
       }
36 35
     }
37 36
     .priceInput {
38 37
         display: inline-block;
39 38
         min-width: 70px;
39
+        height: @item_width + @item_border_width * 2;
40 40
         width: auto;
41 41
         margin: @item_margin;
42 42
         text-align: center;
@@ -76,11 +76,11 @@
76 76
         display: inline-block;
77 77
         background-color: #fff;
78 78
         border-radius:4px;
79
-        border:1px solid rgba(207,207,207,1);
79
+        border:@item_border_width solid rgba(207,207,207,1);
80 80
           &.active {
81 81
           background-color: #fff;
82 82
           color: #FF3266FF;
83
-          border:1px solid rgba(255,50,102,1);
83
+          border:@item_border_width solid rgba(255,50,102,1);
84 84
         }
85 85
       }
86 86
       .priceInput {
@@ -89,36 +89,4 @@
89 89
       }
90 90
     }
91 91
   }
92
-
93
-  // &.small {
94
-  //   @item_width: 72px;
95
-  //   @item_margin: 19px;
96
-
97
-  //   padding: 0 0 12px 0;
98
-  //   border-bottom: none;
99
-  //   p {
100
-  //     margin-bottom: 8px;
101
-  //   }
102
-  //   .infoItem {
103
-  //     text-align: center;
104
-
105
-  //     .priceItem {
106
-  //       border-radius:6px;
107
-  //       height: 32px;
108
-  //       width: @item_width;
109
-  //       margin: 0 0 (@item_margin - 7px) @item_margin;
110
-  //     }
111
-  //     .priceItem:first-child{
112
-  //       margin: 0 0 (@item_margin - 7px) 0px;
113
-  //     }
114
-
115
-  //     .priceInput {
116
-  //       display: block;
117
-  //       margin: 0;
118
-  //       width: @item_width*3+@item_margin*2;
119
-  //       border-radius: 6px;
120
-  //       height: 32px;
121
-  //     }
122
-  //   }
123
-  // }
124 92
 }

+ 9
- 1
src/components/Payment/PriceOptions/README.md 파일 보기

@@ -1,3 +1,11 @@
1 1
 # PriceOptions
2 2
 
3
-- 简单介绍
3
+金额/数字选择输入组件
4
+
5
+## 简单介绍
6
+
7
+主要由priceOptions, priceRender, inputPriceRender控制界面的呈现。
8
+Render主要控制渲染其中值的渲染,Options数组提供选择项
9
+
10
+## Changelog
11
+[2020-02-06 01:34:13] v0.1 迁移完毕

+ 6
- 6
src/components/Payment/PriceOptions/index.tsx 파일 보기

@@ -35,8 +35,8 @@ interface Props {
35 35
   inputPriceRender?: Function;
36 36
   inputSuffix?: string | JSX.Element[] | JSX.Element;
37 37
   injectOptions?: {
38
-    priceBtnClass: any;
39
-    priceInputClass: any;
38
+    priceBtnClass: (isActive: boolean) => any;
39
+    priceInputClass: Function;
40 40
   }
41 41
   inputRef: React.RefObject<any>;
42 42
 }
@@ -55,8 +55,8 @@ const PriceOptions = ({
55 55
   inputPriceRender = (i: any) => (i ? i / 100 : ""),
56 56
   inputSuffix = "¥",
57 57
   injectOptions = {
58
-    priceBtnClass: {},
59
-    priceInputClass: {},
58
+    priceBtnClass: () => undefined,
59
+    priceInputClass: () => undefined,
60 60
   },
61 61
   inputRef
62 62
 }: Props) => {
@@ -78,7 +78,7 @@ const PriceOptions = ({
78 78
               className={classnames({
79 79
                 [styles.priceItem]: true,
80 80
                 [styles.active]: price === item && !inputStatus,
81
-                ...injectOptions.priceBtnClass,
81
+                ...injectOptions.priceBtnClass(price === item && !inputStatus),
82 82
               })}
83 83
               key={item}
84 84
               onClick={() => {
@@ -92,7 +92,7 @@ const PriceOptions = ({
92 92
         </span>
93 93
         <Input
94 94
           ref={inputRef}
95
-          className={classnames(styles.priceInput, {...injectOptions.priceInputClass})}
95
+          className={classnames(styles.priceInput, {...injectOptions.priceInputClass()})}
96 96
           onMouseEnter={() => {
97 97
             if (inputStatus && inputRef && inputRef.current) {
98 98
               inputRef.current.focus();

+ 1
- 1
stats.html
파일 크기가 너무 크기때문에 변경 상태를 표시하지 않습니다.
파일 보기