@gm-mobile/c-react 3.9.6-beta.2 → 3.9.7-beta.2

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@gm-mobile/c-react",
-  "version": "3.9.6-beta.2",
+  "version": "3.9.7-beta.2",
   "description": "> TODO: description",
   "author": "liyatang <liyatang@qq.com>",
   "homepage": "https://github.com/gmfe/gm-mobile#readme",
@@ -21,9 +21,9 @@
     "url": "https://github.com/gmfe/gm-mobile/issues"
   },
   "dependencies": {
-    "@gm-mobile/c-font": "^3.9.6-beta.2",
-    "@gm-mobile/c-tool": "^3.9.6-beta.2",
-    "@gm-mobile/locales": "^3.9.6-beta.2"
+    "@gm-mobile/c-font": "^3.9.7-beta.2",
+    "@gm-mobile/c-tool": "^3.9.7-beta.2",
+    "@gm-mobile/locales": "^3.9.7-beta.2"
   },
   "peerDependencies": {
     "@tarojs/components": "3.0.18",
@@ -33,5 +33,5 @@
     "prop-types": "^15.7.2",
     "react": "^16.13.1"
   },
-  "gitHead": "6017ff553c0db37b691ec6bcfc00c226b96ecf48"
+  "gitHead": "47401ab0f5c303c3dc2aafcec9ad03ff500beb11"
 }

package/src/component/digital_keyboard/Base.tsx

@@ -28,13 +28,7 @@ export const defaultDigitalKeys = [
       }
     },
   }),
-  new DKBtn({
-    className: 'iconfont icon-backspace',
-    fn: (value) => {
-      if (value.length === 0) return value
-      return value.slice(0, value.length - 1)
-    },
-  }),
+  new DKBtn({ label: '清零', className: 'btn-clear', fn: (_) => '' }),
 ]
 
 /** 右侧功能按钮  */
@@ -68,6 +62,7 @@ export interface KeyboardProps
   show?: boolean
   /** 整数类型键盘 */
   int?: boolean
+  isClearBtn?: boolean
 }
 
 export const Keyboard: FC<KeyboardProps> = ({
@@ -78,6 +73,7 @@ export const Keyboard: FC<KeyboardProps> = ({
   digitalKeys = defaultDigitalKeys,
   show = true,
   className,
+  isClearBtn = true,
   int,
   ...rest
 }) => {
@@ -110,27 +106,33 @@ export const Keyboard: FC<KeyboardProps> = ({
     >
       <Flex>
         <Flex flex={3} wrap>
-          {digitalKeys.map((btn, i) => {
-            return (
-              <Flex
-                key={i}
-                width='33.33333%'
-                alignCenter
-                justifyCenter
-                className='keyboard-item'
-              >
-                <View
-                  className={classNames(
-                    'keyboard-button digital m-text-20',
-                    btn.className
-                  )}
-                  onClick={() => handleInput(btn)}
+          {digitalKeys
+            .filter((f) => (isClearBtn ? f : f.label !== '清零'))
+            .map((btn, i) => {
+              return (
+                <Flex
+                  key={i}
+                  width={
+                    !isClearBtn && btn.label === '0'
+                      ? '66.666666%'
+                      : '33.33333%'
+                  }
+                  alignCenter
+                  justifyCenter
+                  className='keyboard-item'
                 >
-                  {btn.label}
-                </View>
-              </Flex>
-            )
-          })}
+                  <View
+                    className={classNames(
+                      'keyboard-button digital m-text-22',
+                      btn.className
+                    )}
+                    onClick={() => handleInput(btn)}
+                  >
+                    {btn.label}
+                  </View>
+                </Flex>
+              )
+            })}
         </Flex>
         <Flex flex={1} column>
           {actionKeys.map((btn, keyIndex) => {
@@ -150,7 +152,20 @@ export const Keyboard: FC<KeyboardProps> = ({
                   )}
                   onClick={() => handleInput(btn)}
                 >
-                  {btn.label}
+                  {btn.label ? (
+                    btn.label
+                  ) : (
+                    <Flex alignCenter justifyCenter className='bt-delete'>
+                      <View className='triangle' />
+                      <Flex
+                        alignCenter
+                        justifyCenter
+                        className='m-text-14 m-text-white square'
+                      >
+                        x
+                      </Flex>
+                    </Flex>
+                  )}
                 </View>
               </Flex>
             )

package/src/component/digital_keyboard/base.less

@@ -1,5 +1,5 @@
 .keyboard {
-  @background: darken(white, 3);
+  @background: darken(white, 8);
   @btn: white;
   @text: black;
   background-color: @background;
@@ -13,17 +13,18 @@
     top: 0;
   }
   .keyboard-item {
-    padding: 3px;
+    padding: 3.5px;
     height: 60px;
     .keyboard-button {
       display: flex;
+      font-family: DINPro-Medium, DINPro;
       justify-content: center;
       align-items: center;
       width: 100%;
       height: 100%;
       color: @text;
-      // font-weight: bold;
-      border-radius: 5px;
+      font-weight: bold;
+      border-radius: 4px;
       background-color: @btn;
       overflow: hidden;
       cursor: pointer;
@@ -45,5 +46,33 @@
         }
       }
     }
+
+    .btn-ok {
+      background-color: #06C160;
+    }
+
+    .btn-clear {
+      font-size: 15px !important;
+      font-weight: 500;
+    }
+
+    .bt-delete {
+      padding-right: 10px;
+      .square {
+        width: 20px;
+        height: 20px;
+        background: #000000;
+        border-bottom-right-radius: 2px;
+        border-top-right-radius: 2px;
+        padding-right: 2px;
+      }
+
+      .triangle {
+        width: 0;
+        height: 0;
+        border: 10px solid;
+        border-color: transparent #000000 transparent transparent;
+      }
+    }
   }
 }

package/src/component/digital_keyboard/index.tsx

@@ -165,19 +165,26 @@ export class DigitalKeyboard {
   /** 自定义功能按钮 */
   get actionKeys() {
     return [
-      new DKBtn({ label: '清零', fn: (_) => '' }),
+      new DKBtn({
+        label: '',
+        // className: 'iconfont icon-backspace m-text-26',
+        fn: (value) => {
+          if (value.length === 0) return value
+          return value.slice(0, value.length - 1)
+        },
+      }),
       new DKBtn({
         label: '下一个',
-        className: 'm-bg-primary m-text-white',
+        className: 'm-text-black btn-clear',
         fn: (value) => {
           this.next()
           return this.form[this.active]
         },
       }),
       new DKBtn({
-        label: '确认',
+        label: '确定',
         flex: 2,
-        className: 'm-bg-primary m-text-white',
+        className: 'btn-ok m-text-white',
         fn: (value) => {
           return this.form[this.active]
         },