tplus-components-touch 1.27.1 → 1.27.2

package/dist/components/keyboard/onlyLetterButton2.js

@@ -0,0 +1,235 @@
+'use strict';
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.default = undefined;
+
+var _getPrototypeOf = require('babel-runtime/core-js/object/get-prototype-of');
+
+var _getPrototypeOf2 = _interopRequireDefault(_getPrototypeOf);
+
+var _classCallCheck2 = require('babel-runtime/helpers/classCallCheck');
+
+var _classCallCheck3 = _interopRequireDefault(_classCallCheck2);
+
+var _createClass2 = require('babel-runtime/helpers/createClass');
+
+var _createClass3 = _interopRequireDefault(_createClass2);
+
+var _possibleConstructorReturn2 = require('babel-runtime/helpers/possibleConstructorReturn');
+
+var _possibleConstructorReturn3 = _interopRequireDefault(_possibleConstructorReturn2);
+
+var _inherits2 = require('babel-runtime/helpers/inherits');
+
+var _inherits3 = _interopRequireDefault(_inherits2);
+
+var _class, _temp; /**
+                    * 专为 product 写的键盘
+                    */
+
+var _react = require('react');
+
+var _react2 = _interopRequireDefault(_react);
+
+var _index = require('../../index');
+
+var _propTypes = require('prop-types');
+
+var _propTypes2 = _interopRequireDefault(_propTypes);
+
+var _mutantsMicrofx = require('mutants-microfx');
+
+require('./onlyLetterButton2.less');
+
+function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
+
+var closeImgBase64 = 'data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABgAAAAYCAYAAADgdz34AAAAAXNSR0IArs4c6QAAAslJREFUSA21Vr9vUlEYpbQEQkikaXBxshoXBRk0EH61tA5dDA000cWkSf8KZwd3N01cNOkgEEhMrAmWMEhC2kXThbaJrbaxIAUtRUrTCp7D85LX9j6wGL/kcH+87zvn3u/e9z0GdN1tGI+dgB2wARcA2h5QAlaAD8B3QGoD0lmdzor5u4AX0PIRoS10ssBr4IeYFK0s+CYezgFG4fSX7SH8ngMf1f6D6gH6E8AsMASc1xhzC6gDGyJYLcCVzwKyXQn/Xi1jrwNbQJHOev7AmPM54F/IyUMjB7nI2RHggZ4354zXMnKRsy3Aq8jbcsbW19dD6XR63Gg0SncWjUbdxWLxnsViEZlQc5BzmA+cgJRge3u7GgwGr0Fk8rRIMpn0zMzMOHZ3d3/WarWmmvlPn5xOCvAlktrU1FQml8tteDye0cXFxY5IIpHwhEKhG/l8vhAIBN5Kg5VJO1UeARe1nEwmkz6TyUy6XK7L2Wz2U6lUqk9PT7fJfT7fm3K5fKwVi/lvFHgCdD1gtQjJVldXC16vtxc5XQ9lh8MHJ6zRaDR3dnZqYhJ5r1er1V9i3K2lAAtXV4vH426kxb62tlZYWlraxOpHcfATBoNBejlUZHsUYFXUtFgs5g6Hww5c2SJyvjA2NvaOIuhfwcEHe4iUKMCSK7X5+fnbkUikTc6c44CPmC6KLC8vb/r9/qupVGpcGqxMrnCLfNEeA2e2C8L7lUqljqu4gBfqSIlRfs1msx5puuN0Oi/ZbLYX+/v7p8+EZfyhIH2AgU9NwL7Vah3CYR43m7L3SPEeGRkZ0riq7+HxclBx031BGwBOlGmmo9XiQrTt4OBAps5vw1OgIQQaGHwFWM/FrtDty7iiZ8BnRgsB9lm/+bFgPe9XhOSvgBzQNrUAJzaALcABnEgXxr2MaeHKO+QM0FopPxb/7aNPYWG8wiznrLh9/W35DRjk9s3Z3I9JAAAAAElFTkSuQmCC';
+var OnlyLetterButton2 = (_temp = _class = function (_Component) {
+  (0, _inherits3.default)(OnlyLetterButton2, _Component);
+
+  function OnlyLetterButton2(props) {
+    (0, _classCallCheck3.default)(this, OnlyLetterButton2);
+
+    var _this = (0, _possibleConstructorReturn3.default)(this, (OnlyLetterButton2.__proto__ || (0, _getPrototypeOf2.default)(OnlyLetterButton2)).call(this));
+
+    _this.keyClick = function (key) {
+      if (key == 'tab' || key == "TAB") {
+        return;
+      }
+      if (key == '123') {
+        // 切换到数字键盘
+        _this.setState({
+          isLetter: false
+        }, function () {
+          _mutantsMicrofx.localStore.set(_this.props.id, 2);
+        });
+        return;
+      }
+      if (key == 'En') {
+        _this.setState({
+          isLetter: true
+        }, function () {
+          _mutantsMicrofx.localStore.set(_this.props.id, 1);
+        });
+        return;
+      }
+      _this.props.onChange && _this.props.onChange(key);
+    };
+
+    _this.onMouseDown = function (e) {
+      e.preventDefault();
+    };
+
+    _this.capslockClick = function () {
+      _this.setState({ capslockFlag: !_this.state.capslockFlag });
+    };
+
+    _this.state = {
+      letters1: ['@', 'q', 'w', 'e', 'r', 't', 'y', 'u', 'i', 'o', 'p'],
+      letters1_1: ['@', 'Q', 'W', 'E', 'R', 'T', 'Y', 'U', 'I', 'O', 'P'],
+      letters2: ['a', 's', 'd', 'f', 'g', 'h', 'j', 'k', 'l'],
+      letters2_1: ['A', 'S', 'D', 'F', 'G', 'H', 'J', 'K', 'L'],
+      letters3: ['123', '&', 'z', 'x', 'c', 'v', 'b', 'n', 'm', '-', '%'],
+      letters3_1: ['123', '&', 'Z', 'X', 'C', 'V', 'B', 'N', 'M', '-', '%'],
+      nums: ['7', '8', '9', '4', '5', '6', '1', '2', '3', 'En', '0', '.'],
+      capslockFlag: false,
+      isLetter: props.letterOrNumber == 1 ? true : false
+    };
+    return _this;
+  }
+
+  (0, _createClass3.default)(OnlyLetterButton2, [{
+    key: 'render',
+    value: function render() {
+      var _this2 = this;
+
+      var _props = this.props,
+          handleOk = _props.handleOk,
+          handleCancel = _props.handleCancel,
+          id = _props.id;
+      var _state = this.state,
+          capslockFlag = _state.capslockFlag,
+          isLetter = _state.isLetter;
+
+      var numsKey = this.state.nums.map(function (item) {
+        return _react2.default.createElement(
+          'div',
+          { className: 'num key ' + (item == '·' ? 'bold' : ''), key: item, onClick: _this2.keyClick.bind(_this2, item) },
+          _react2.default.createElement(
+            'span',
+            null,
+            item
+          )
+        );
+      });
+      var letters1Key = (capslockFlag ? this.state.letters1_1 : this.state.letters1).map(function (item) {
+        return _react2.default.createElement(
+          'div',
+          { onClick: _this2.keyClick.bind(_this2, item), className: 'key letter', key: item },
+          _react2.default.createElement(
+            'span',
+            null,
+            item
+          )
+        );
+      });
+      var letters2Key = (capslockFlag ? this.state.letters2_1 : this.state.letters2).map(function (item) {
+        return _react2.default.createElement(
+          'div',
+          { onClick: _this2.keyClick.bind(_this2, item), className: 'key letter', key: item },
+          _react2.default.createElement(
+            'span',
+            null,
+            item
+          )
+        );
+      });
+      var letters3Key = (capslockFlag ? this.state.letters3_1 : this.state.letters3).map(function (item) {
+        return _react2.default.createElement(
+          'div',
+          { onClick: _this2.keyClick.bind(_this2, item), className: 'key letter', key: item },
+          _react2.default.createElement(
+            'span',
+            null,
+            item
+          )
+        );
+      });
+      return _react2.default.createElement(
+        'div',
+        { className: 'clearfix letters-box product-keyboarde-botton', id: 'product-keyboard-button', onMouseDown: this.onMouseDown },
+        isLetter ? _react2.default.createElement(
+          'div',
+          { className: 'letters' },
+          _react2.default.createElement(
+            'div',
+            { className: 'letters-line' },
+            letters1Key
+          ),
+          _react2.default.createElement(
+            'div',
+            { className: 'letters-line' },
+            _react2.default.createElement(
+              'div',
+              { className: 'key letter capslock ' + (capslockFlag ? '' : 'capslock-small'), onClick: this.capslockClick },
+              _react2.default.createElement(
+                'span',
+                null,
+                capslockFlag ? 'caps lock' : 'CAPS LOCK'
+              )
+            ),
+            letters2Key
+          ),
+          _react2.default.createElement(
+            'div',
+            { className: 'letters-line' },
+            letters3Key
+          )
+        ) : _react2.default.createElement(
+          'div',
+          { className: 'nums' },
+          _react2.default.createElement(
+            'div',
+            { className: 'nums-left clearfix' },
+            numsKey
+          )
+        ),
+        _react2.default.createElement(
+          'div',
+          { className: 'handle ' + (isLetter ? '' : 'is-number') },
+          _react2.default.createElement(
+            'div',
+            { className: 'del key delete', onClick: this.keyClick.bind(this, 'delete') },
+            _react2.default.createElement(_index.Ticon, { type: 'tuige' })
+          ),
+          _react2.default.createElement(
+            'div',
+            { className: 'del clear', onClick: this.keyClick.bind(this, 'clear') },
+            '\u6E05\u7A7A'
+          ),
+          isLetter ? _react2.default.createElement(
+            'div',
+            { className: 'del sure', onClick: handleOk },
+            '\u786E\u5B9A'
+          ) : _react2.default.createElement(
+            'div',
+            { className: 'del sure', onClick: handleOk, style: { lineHeight: '24px' } },
+            '\u786E',
+            _react2.default.createElement('br', null),
+            '\u5B9A'
+          )
+        ),
+        _react2.default.createElement('img', { src: closeImgBase64, id: id, className: 'icon-close', onClick: handleCancel })
+      );
+    }
+  }]);
+  return OnlyLetterButton2;
+}(_react.Component), _class.propTypes = {
+  onChange: _propTypes2.default.func.isRequired,
+  handleOk: _propTypes2.default.func.isRequired,
+  handleCancel: _propTypes2.default.func.isRequired
+}, _temp);
+exports.default = OnlyLetterButton2;
+//# sourceMappingURL=onlyLetterButton2.js.map

package/dist/components/keyboard/onlyLetterButton2.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["tplus-components-touch/components/keyboard/onlyLetterButton2.js"],"names":["closeImgBase64","OnlyLetterButton2","props","keyClick","key","setState","isLetter","localStore","set","id","onChange","onMouseDown","e","preventDefault","capslockClick","capslockFlag","state","letters1","letters1_1","letters2","letters2_1","letters3","letters3_1","nums","letterOrNumber","handleOk","handleCancel","numsKey","map","item","bind","letters1Key","letters2Key","letters3Key","lineHeight","Component","propTypes","PropTypes","func","isRequired"],"mappings":"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","file":"onlyLetterButton2.js","sourcesContent":["/**\n * 专为 product 写的键盘\n */\n\nimport React, { Component } from 'react';\nimport { Icon } from 'tinper-bee';\nimport { Ticon } from '../../index';\nimport PropTypes from 'prop-types'\nimport { localStore } from 'mutants-microfx';\nimport './onlyLetterButton2.less';\nlet closeImgBase64 = 'data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABgAAAAYCAYAAADgdz34AAAAAXNSR0IArs4c6QAAAslJREFUSA21Vr9vUlEYpbQEQkikaXBxshoXBRk0EH61tA5dDA000cWkSf8KZwd3N01cNOkgEEhMrAmWMEhC2kXThbaJrbaxIAUtRUrTCp7D85LX9j6wGL/kcH+87zvn3u/e9z0GdN1tGI+dgB2wARcA2h5QAlaAD8B3QGoD0lmdzor5u4AX0PIRoS10ssBr4IeYFK0s+CYezgFG4fSX7SH8ngMf1f6D6gH6E8AsMASc1xhzC6gDGyJYLcCVzwKyXQn/Xi1jrwNbQJHOev7AmPM54F/IyUMjB7nI2RHggZ4354zXMnKRsy3Aq8jbcsbW19dD6XR63Gg0SncWjUbdxWLxnsViEZlQc5BzmA+cgJRge3u7GgwGr0Fk8rRIMpn0zMzMOHZ3d3/WarWmmvlPn5xOCvAlktrU1FQml8tteDye0cXFxY5IIpHwhEKhG/l8vhAIBN5Kg5VJO1UeARe1nEwmkz6TyUy6XK7L2Wz2U6lUqk9PT7fJfT7fm3K5fKwVi/lvFHgCdD1gtQjJVldXC16vtxc5XQ9lh8MHJ6zRaDR3dnZqYhJ5r1er1V9i3K2lAAtXV4vH426kxb62tlZYWlraxOpHcfATBoNBejlUZHsUYFXUtFgs5g6Hww5c2SJyvjA2NvaOIuhfwcEHe4iUKMCSK7X5+fnbkUikTc6c44CPmC6KLC8vb/r9/qupVGpcGqxMrnCLfNEeA2e2C8L7lUqljqu4gBfqSIlRfs1msx5puuN0Oi/ZbLYX+/v7p8+EZfyhIH2AgU9NwL7Vah3CYR43m7L3SPEeGRkZ0riq7+HxclBx031BGwBOlGmmo9XiQrTt4OBAps5vw1OgIQQaGHwFWM/FrtDty7iiZ8BnRgsB9lm/+bFgPe9XhOSvgBzQNrUAJzaALcABnEgXxr2MaeHKO+QM0FopPxb/7aNPYWG8wiznrLh9/W35DRjk9s3Z3I9JAAAAAElFTkSuQmCC';\nexport default class OnlyLetterButton2 extends Component {\n\n  static propTypes = {\n    onChange: PropTypes.func.isRequired,\n    handleOk: PropTypes.func.isRequired,\n    handleCancel: PropTypes.func.isRequired\n  }\n\n  constructor(props) {\n    super();\n    this.state = {\n      letters1: ['@', 'q', 'w', 'e', 'r', 't', 'y', 'u', 'i', 'o', 'p'],\n      letters1_1: ['@', 'Q', 'W', 'E', 'R', 'T', 'Y', 'U', 'I', 'O', 'P'],\n      letters2: ['a', 's', 'd', 'f', 'g', 'h', 'j', 'k', 'l'],\n      letters2_1: ['A', 'S', 'D', 'F', 'G', 'H', 'J', 'K', 'L'],\n      letters3: ['123', '&', 'z', 'x', 'c', 'v', 'b', 'n', 'm', '-', '%'],\n      letters3_1: ['123', '&', 'Z', 'X', 'C', 'V', 'B', 'N', 'M', '-', '%'],\n      nums: ['7', '8', '9', '4', '5', '6', '1', '2', '3', 'En', '0', '.'],\n      capslockFlag: false,\n      isLetter: props.letterOrNumber == 1 ? true : false\n    }\n  }\n\n  keyClick = (key) => {\n    if (key == 'tab' || key == \"TAB\") {\n      return;\n    }\n    if (key == '123') { // 切换到数字键盘\n      this.setState({\n        isLetter: false\n      }, () => {\n        localStore.set(this.props.id, 2)\n      })\n      return;\n    }\n    if (key == 'En') {\n      this.setState({\n        isLetter: true\n      }, () => {\n        localStore.set(this.props.id, 1)\n      })\n      return;\n    }\n    this.props.onChange && this.props.onChange(key);\n  }\n\n  onMouseDown = (e) => {\n    e.preventDefault();\n  }\n\n  capslockClick = () => {\n    this.setState({ capslockFlag: !this.state.capslockFlag })\n  }\n\n  render() {\n    const { handleOk, handleCancel, id } = this.props;\n    let { capslockFlag, isLetter } = this.state;\n    let numsKey = this.state.nums.map((item) => <div className={`num key ${item == '·'? 'bold': ''}`} key={item} onClick={this.keyClick.bind(this, item)}><span>{item}</span></div>)\n    let letters1Key = (capslockFlag ? this.state.letters1_1 : this.state.letters1).map((item) => <div onClick={this.keyClick.bind(this, item)} className={`key letter`} key={item}><span>{item}</span></div>)\n    let letters2Key = (capslockFlag ? this.state.letters2_1 : this.state.letters2).map((item) => <div onClick={this.keyClick.bind(this, item)} className='key letter' key={item}><span>{item}</span></div>)\n    let letters3Key = (capslockFlag ? this.state.letters3_1 : this.state.letters3).map((item) => <div onClick={this.keyClick.bind(this, item)} className='key letter' key={item}><span>{item}</span></div>)\n    return (\n        <div className='clearfix letters-box product-keyboarde-botton' id='product-keyboard-button' onMouseDown={this.onMouseDown} >\n          {\n            isLetter ?\n              <div className='letters'>\n                <div className='letters-line'>\n                  {letters1Key}\n                </div>\n                <div className='letters-line'>\n                  <div className={`key letter capslock ${capslockFlag ? '' :'capslock-small'}`} onClick={this.capslockClick}><span>{capslockFlag ? 'caps lock' : 'CAPS LOCK'}</span></div>\n                  {letters2Key}\n                </div>\n                <div className='letters-line'>\n                  {letters3Key}\n                </div>\n              </div>\n              :\n              <div className='nums'>\n                <div className='nums-left clearfix'>\n                  {numsKey}\n                </div>\n              </div>\n          }\n  \n            <div className={`handle ${isLetter? '' : 'is-number'}`}>\n              <div className='del key delete' onClick={this.keyClick.bind(this, 'delete')}>\n                <Ticon type='tuige' />\n              </div>\n              <div className='del clear' onClick={this.keyClick.bind(this, 'clear')}>清空</div>\n              {\n                isLetter ?\n                <div className='del sure' onClick={handleOk}>确定</div>\n                :\n                <div className='del sure' onClick={handleOk} style={{lineHeight: '24px'}}>确<br />定</div>\n              }\n            </div>\n          <img src={closeImgBase64} id={id}  className='icon-close' onClick={handleCancel}  />\n        </div>\n    )\n  }\n}"]}

package/dist/components/keyboard/onlyLetterButton2.less

@@ -0,0 +1,184 @@
+@keyboard-active-color: rgba(255,140,37,0.6);
+@keyboard-font-color: #333;
+@themeColor: #FF8C25;
+.product-keyboarde-botton.letters-box {
+
+    display: flex;
+    justify-content: space-around;
+    // min-width: 766px;
+    position: relative;
+    padding-top: 19px;
+    background: rgba(0, 0, 0, .6);
+  .letters {
+    max-width: 680px;
+    width:81%;
+
+    .letters-line {
+      height: 70px;
+      width: 100%;
+      overflow: hidden;
+
+      .disabled {
+        background: #999;
+      }
+
+      .letter:last-child {
+        margin-right: 0;
+      }
+    }
+  }
+
+  .capslock {
+    max-width: 124px !important;
+    width: 18%!important;
+    font-weight: 700;
+    padding: 0 4px;
+    span {
+      display: flex;
+      height: 100%;
+      font-size: 18px;
+      border-radius: 6px;
+      flex-direction: column;
+      justify-content: center;
+      color: @keyboard-font-color ;
+      background: #FFF;
+    }
+  }
+
+  .capslock-small {
+    font-size: 16px !important;
+  }
+
+  .nums {
+    max-width: 493px;
+    float: right;
+    width: 70%;
+
+    .nums-left {
+      float: left;
+      width: 100%;
+
+      .num {
+        height: 40px;
+        margin: 0 0px 8px 0;
+        max-width: 164px;
+        padding: 0 12px;
+        line-height: 40px;
+        min-width: 33%;
+      }
+    }
+
+    .nums-right {
+      float: right;
+      width: 60px;
+
+      .del {
+        height: 35px;
+        margin: 0 8px 8px 0;
+
+      }
+
+      .sure {
+        color: #000;
+        // background-color: #FF8C26 ;
+        border-radius: 10px;
+      }
+    }
+  }
+
+  .key {
+    max-width: 62px;
+    width: 9%;
+    height: 52px;
+    box-sizing: border-box;
+    float: left;
+    padding: 0 4px;
+    text-align: center;
+    cursor: pointer;
+    user-select: none;
+    // border: 1px solid #FF8C25;
+    // box-shadow: 0 2px 4px 0 rgba(242, 157, 14, 0.30);
+    ;
+    border-radius: 6px;
+    span {
+      &:active {
+        background: @keyboard-active-color;
+      }
+      display: flex;
+      height: 100%;
+      font-size: 18px;
+      border-radius: 6px;
+      flex-direction: column;
+      justify-content: center;
+      color: @keyboard-font-color ;
+      background: #FFF;
+    }
+  }
+
+  .handle {
+    width: 54px;
+    .del {
+      &:active {
+        background: @keyboard-active-color;
+      }
+      float: none;
+      width: 54px;
+      height: 52px;
+      box-sizing: border-box;
+      float: left;
+      margin: 0 8px 18px 0;
+      text-align: center;
+      line-height: 52px;
+      font-size: 18px;
+      border-radius: 6px;
+      cursor: pointer;
+      user-select: none;
+      display: flex;
+      flex-direction: column;
+      justify-content: center;
+      color: @keyboard-font-color ;
+      background: #FFF;
+      // border: 1px solid #FF8C25;
+      // box-shadow: 0 2px 4px 0 rgba(242, 157, 14, 0.30);
+      ;
+      border-radius: 6px;
+    }
+    .clear {
+      font-size: 16px;
+    }
+  
+    .sure {
+      background: @themeColor;
+      color: #FFF;
+    }
+  }
+  .is-number {
+    .delete {
+      height: 40px;
+      line-height: 40px;
+      margin: 0 8px 8px 0;
+    }
+    .clear {
+      height: 40px;
+      line-height: 40px;
+      margin: 0 8px 8px 0;      
+    }
+    .sure {
+      height: 90px;
+      line-height: 90px;
+    }
+
+  }
+  .bold {
+    font-weight: 700;
+  }
+
+  .icon-close {
+    width: 24px;
+    height: 24px;
+    position: absolute;
+    top: -12px;
+    right: 8px;
+    cursor: pointer;
+  }
+}

package/dist/components/keyboard/onlyNumberButton.js

@@ -0,0 +1,128 @@
+'use strict';
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.default = undefined;
+
+var _getPrototypeOf = require('babel-runtime/core-js/object/get-prototype-of');
+
+var _getPrototypeOf2 = _interopRequireDefault(_getPrototypeOf);
+
+var _classCallCheck2 = require('babel-runtime/helpers/classCallCheck');
+
+var _classCallCheck3 = _interopRequireDefault(_classCallCheck2);
+
+var _createClass2 = require('babel-runtime/helpers/createClass');
+
+var _createClass3 = _interopRequireDefault(_createClass2);
+
+var _possibleConstructorReturn2 = require('babel-runtime/helpers/possibleConstructorReturn');
+
+var _possibleConstructorReturn3 = _interopRequireDefault(_possibleConstructorReturn2);
+
+var _inherits2 = require('babel-runtime/helpers/inherits');
+
+var _inherits3 = _interopRequireDefault(_inherits2);
+
+var _class, _temp; /**
+                    * 结算使用的键盘
+                    */
+
+var _react = require('react');
+
+var _react2 = _interopRequireDefault(_react);
+
+var _index = require('../../index');
+
+var _propTypes = require('prop-types');
+
+var _propTypes2 = _interopRequireDefault(_propTypes);
+
+function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
+
+var OnlyNumberButton = (_temp = _class = function (_Component) {
+  (0, _inherits3.default)(OnlyNumberButton, _Component);
+
+  function OnlyNumberButton(props) {
+    (0, _classCallCheck3.default)(this, OnlyNumberButton);
+
+    var _this = (0, _possibleConstructorReturn3.default)(this, (OnlyNumberButton.__proto__ || (0, _getPrototypeOf2.default)(OnlyNumberButton)).call(this, props));
+
+    _this.numClick = function (key) {
+      _this.props.onChange(key);
+    };
+
+    return _this;
+  }
+
+  (0, _createClass3.default)(OnlyNumberButton, [{
+    key: 'render',
+    value: function render() {
+      var _this2 = this;
+
+      var nums = {
+        '1': '1',
+        '2': '2',
+        '3': '3',
+        'delete': '<--',
+        '4': '4',
+        '5': '5',
+        '6': '6',
+        '-': '-',
+        '7': '7',
+        '8': '8',
+        '9': '9',
+        'clear': '清<br />空'
+      };
+      var nums2 = {
+        '0': '0',
+        '00': '00',
+        '.': '.'
+      };
+      var numsIndex = ['1', '2', '3', 'delete', '4', '5', '6', '-', '7', '8', '9', 'clear'];
+      var numsIndex2 = ['0', '00', '.'];
+      var numsKey = numsIndex.map(function (index) {
+        if (index === 'clear') {
+          return _react2.default.createElement('div', { className: 'key', dangerouslySetInnerHTML: { __html: index === 'clear' ? nums[index] : '' }, style: { fontSize: '18px', 'height': '126px' }, key: index, onClick: _this2.numClick.bind(_this2, index) });
+        }
+        if (index === 'delete') {
+          return _react2.default.createElement(
+            'div',
+            { className: 'key', key: index, onClick: _this2.numClick.bind(_this2, 'delete') },
+            _react2.default.createElement(_index.Ticon, { type: 'tuige' })
+          );
+        }
+        return _react2.default.createElement(
+          'div',
+          { className: 'key', key: index, onClick: _this2.numClick.bind(_this2, index) },
+          nums[index]
+        );
+      });
+      var numsKey2 = numsIndex2.map(function (index) {
+        return _react2.default.createElement(
+          'div',
+          { className: 'key', key: index, onClick: _this2.numClick.bind(_this2, index) },
+          nums2[index]
+        );
+      });
+      return _react2.default.createElement(
+        'div',
+        { className: 'only-number-button-content', onMouseDown: function onMouseDown(e) {
+            return e.preventDefault();
+          } },
+        numsKey,
+        _react2.default.createElement(
+          'div',
+          { className: 'only-number-button-content-inner' },
+          numsKey2
+        )
+      );
+    }
+  }]);
+  return OnlyNumberButton;
+}(_react.Component), _class.propTypes = {
+  onChange: _propTypes2.default.func.isRequired
+}, _temp);
+exports.default = OnlyNumberButton;
+//# sourceMappingURL=onlyNumberButton.js.map

package/dist/components/keyboard/onlyNumberButton.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["tplus-components-touch/components/keyboard/onlyNumberButton.js"],"names":["OnlyNumberButton","props","numClick","key","onChange","nums","nums2","numsIndex","numsIndex2","numsKey","map","index","__html","fontSize","bind","numsKey2","e","preventDefault","Component","propTypes","PropTypes","func","isRequired"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;mBAAA;;;;AAIA;;;;AACA;;AACA;;;;;;IAEqBA,gB;;;AAMnB,4BAAYC,KAAZ,EAAmB;AAAA;;AAAA,0JACXA,KADW;;AAAA,UAInBC,QAJmB,GAIR,UAACC,GAAD,EAAS;AAClB,YAAKF,KAAL,CAAWG,QAAX,CAAoBD,GAApB;AACD,KANkB;;AAAA;AAElB;;;;6BAMQ;AAAA;;AACP,UAAIE,OAAO;AACT,aAAK,GADI;AAET,aAAK,GAFI;AAGT,aAAK,GAHI;AAIT,kBAAU,KAJD;AAKT,aAAK,GALI;AAMT,aAAK,GANI;AAOT,aAAK,GAPI;AAQT,aAAK,GARI;AAST,aAAK,GATI;AAUT,aAAK,GAVI;AAWT,aAAK,GAXI;AAYT,iBAAS;AAZA,OAAX;AAcA,UAAIC,QAAQ;AACV,aAAK,GADK;AAEV,cAAM,IAFI;AAGV,aAAK;AAHK,OAAZ;AAKA,UAAIC,YAAY,CAAC,GAAD,EAAM,GAAN,EAAW,GAAX,EAAgB,QAAhB,EAA0B,GAA1B,EAA+B,GAA/B,EAAoC,GAApC,EAAyC,GAAzC,EAA8C,GAA9C,EAAmD,GAAnD,EAAwD,GAAxD,EAA6D,OAA7D,CAAhB;AACA,UAAIC,aAAa,CAAC,GAAD,EAAM,IAAN,EAAY,GAAZ,CAAjB;AACA,UAAIC,UAAUF,UAAUG,GAAV,CAAe,iBAAS;AACpC,YAAIC,UAAU,OAAd,EAAuB;AACrB,iBAAO,uCAAK,WAAU,KAAf,EAAqB,yBAAyB,EAACC,QAAQD,UAAU,OAAV,GAAoBN,KAAKM,KAAL,CAApB,GAAkC,EAA3C,EAA9C,EAA8F,OAAO,EAACE,UAAU,MAAX,EAAmB,UAAU,OAA7B,EAArG,EAA4I,KAAKF,KAAjJ,EAAwJ,SAAS,OAAKT,QAAL,CAAcY,IAAd,CAAmB,MAAnB,EAAyBH,KAAzB,CAAjK,GAAP;AACD;AACD,YAAIA,UAAU,QAAd,EAAwB;AACtB,iBAAO;AAAA;AAAA,cAAK,WAAU,KAAf,EAAqB,KAAKA,KAA1B,EAAiC,SAAS,OAAKT,QAAL,CAAcY,IAAd,CAAmB,MAAnB,EAAyB,QAAzB,CAA1C;AAA8E,0CAAC,YAAD,IAAO,MAAK,OAAZ;AAA9E,WAAP;AACD;AACD,eAAO;AAAA;AAAA,YAAK,WAAU,KAAf,EAAqB,KAAKH,KAA1B,EAAiC,SAAS,OAAKT,QAAL,CAAcY,IAAd,CAAmB,MAAnB,EAAyBH,KAAzB,CAA1C;AAA4EN,eAAKM,KAAL;AAA5E,SAAP;AACD,OARa,CAAd;AASA,UAAII,WAAWP,WAAWE,GAAX,CAAe,iBAAS;AACrC,eAAO;AAAA;AAAA,YAAK,WAAU,KAAf,EAAqB,KAAKC,KAA1B,EAAiC,SAAS,OAAKT,QAAL,CAAcY,IAAd,CAAmB,MAAnB,EAAyBH,KAAzB,CAA1C;AAA4EL,gBAAMK,KAAN;AAA5E,SAAP;AACD,OAFc,CAAf;AAGA,aACE;AAAA;AAAA,UAAK,WAAU,4BAAf,EAA4C,aAAa;AAAA,mBAAKK,EAAEC,cAAF,EAAL;AAAA,WAAzD;AACKR,eADL;AAEI;AAAA;AAAA,YAAK,WAAU,kCAAf;AACGM;AADH;AAFJ,OADF;AAQD;;;EAxD2CG,gB,UAErCC,S,GAAY;AACjBf,YAAUgB,oBAAUC,IAAV,CAAeC;AADR,C;kBAFAtB,gB","file":"onlyNumberButton.js","sourcesContent":["/**\n * 结算使用的键盘\n */\n\nimport React, { Component } from 'react';\nimport { Ticon } from '../../index';\nimport PropTypes from 'prop-types'\n\nexport default class OnlyNumberButton extends Component {\n\n  static propTypes = {\n    onChange: PropTypes.func.isRequired\n  }\n\n  constructor(props) {\n    super(props);\n  }\n\n  numClick = (key) => {\n    this.props.onChange(key);\n  }\n  \n  render() {\n    let nums = {\n      '1': '1',\n      '2': '2',\n      '3': '3',\n      'delete': '<--',\n      '4': '4',\n      '5': '5',\n      '6': '6',\n      '-': '-',\n      '7': '7',\n      '8': '8',\n      '9': '9',\n      'clear': '清<br />空'\n    }\n    let nums2 = {\n      '0': '0',\n      '00': '00',\n      '.': '.'\n    }\n    let numsIndex = ['1', '2', '3', 'delete', '4', '5', '6', '-', '7', '8', '9', 'clear']\n    let numsIndex2 = ['0', '00', '.']\n    let numsKey = numsIndex.map( index => {\n      if (index === 'clear') {\n        return <div className='key' dangerouslySetInnerHTML={{__html: index === 'clear' ? nums[index] : ''}} style={{fontSize: '18px', 'height': '126px'}} key={index} onClick={this.numClick.bind(this, index)}></div>\n      }\n      if (index === 'delete') {\n        return <div className='key' key={index} onClick={this.numClick.bind(this, 'delete')}><Ticon type='tuige' /></div>\n      }\n      return <div className='key' key={index} onClick={this.numClick.bind(this, index)}>{nums[index]}</div>\n    })\n    let numsKey2 = numsIndex2.map(index => {\n      return <div className='key' key={index} onClick={this.numClick.bind(this, index)}>{nums2[index]}</div>\n    })\n    return (\n      <div className='only-number-button-content' onMouseDown={e => e.preventDefault()}>\n          {numsKey}\n          <div className='only-number-button-content-inner'>\n            {numsKey2}\n          </div>\n      </div>\n    )\n  }\n}"]}