tplus-components-touch 1.27.1 → 1.27.2

package/dist/components/test/index.js

@@ -0,0 +1,338 @@
+'use strict';
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.default = undefined;
+
+var _FormControl2 = require('tinper-bee/dist/FormControl');
+
+var _FormControl3 = _interopRequireDefault(_FormControl2);
+
+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);
+
+require('tinper-bee/dist/FormControl/index.css');
+
+var _react = require('react');
+
+var _react2 = _interopRequireDefault(_react);
+
+function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
+
+var A = function (_Component) {
+  (0, _inherits3.default)(A, _Component);
+
+  function A(props) {
+    (0, _classCallCheck3.default)(this, A);
+
+    var _this = (0, _possibleConstructorReturn3.default)(this, (A.__proto__ || (0, _getPrototypeOf2.default)(A)).call(this, props));
+
+    _this.onChange = function (e) {
+      _this.setState({
+        value: e
+      });
+      _this.props.onChange(e);
+    };
+
+    _this.state = {
+      value: ''
+    };
+    return _this;
+  }
+
+  (0, _createClass3.default)(A, [{
+    key: 'render',
+    value: function render() {
+      return _react2.default.createElement(_FormControl3.default, { onChange: this.onChange, value: this.props.value });
+    }
+  }]);
+  return A;
+}(_react.Component); // import React, { Component } from 'react';
+// import { Table, Popover, Button, FormControl } from 'tinper-bee';
+
+
+// class Test extends Component {
+//     state = {
+//         show: false
+//     }
+//     onFocus = () => {
+//         console.log('focus')
+//         this.setState({
+//             show: true
+//         })
+//     }
+//     onBlur = () => {
+//         console.log('blur')
+//         this.setState({
+//             show: false
+//         })
+//     }
+//     onHide = (visible) => {
+//         this.setState({
+//             show: visible
+//         })
+//     }
+//     render() {
+//     let content = (
+//         <div>
+//             <h3>消息</h3>
+//             <ul>
+//                 <li>您的服务器已宕机，请处理。</li>
+//                 <li>您的手机已停机，请续费。</li>
+//                 <li>你的工资已到账，请查收。</li>
+//             </ul>
+//         </div>
+//     );
+//         return (
+//             <Popover
+//                 placement="topLeft"
+//                 show={this.state.show}
+//                 onHide={this.onHide}
+//                 content={content}>
+
+//                 <FormControl type='text' onFocus={this.onFocus} onBlur={this.onBlur} />
+//             </Popover>
+//         )
+//     }
+// }
+// export default Test;
+
+// import React, {Component} from 'react';
+// import { Popover, Button, FormControl } from 'tinper-bee';
+
+
+// class Test extends Component {
+//     constructor(props) {
+//         super(props);
+//         this.state = {
+//             show: false
+//         }
+//     }
+//     handleClose = () => {
+//         this.setState({
+//             show: false
+//         })
+//     }
+//     show = () => {
+//         this.setState({
+//             show: true
+//         })
+//     }
+//     onHide = (visible) => {
+//         this.setState({
+//             show: visible
+//         })
+//     }
+//     render() {
+//         let content = (
+//             <div>
+//                 <Button
+//                     colors="primary"
+//                     onClick={ this.handleClose }
+//                     size="sm">
+//                     关闭
+//                 </Button>
+//             </div>
+//         )
+//         return (
+//             <div>
+//                 <Popover
+//                     id="demo2"
+//                     placement="right"
+//                     title={<h3>请确认您的包裹已签收！</h3>}
+//                     content={content}
+//                     show={this.state.show}
+//                     onHide={this.onHide}
+//                 >
+//                     {/* <Button
+//                         colors="primary"
+//                         onClick={ this.show }
+//                         >确认按钮</Button> */}
+//                         <FormControl type='text' onFocus={this.show}  />
+//                 </Popover>
+//             </div>
+//         )
+//     }
+// }
+
+// export default Test;
+
+// /**
+// *
+// * @title 拖拽改变列宽度
+// * @parent 列操作-拖拽 Drag
+// * @description onDropBorder方法为调整列宽后触发的回调函数。注：不支持tree结构的表头、合并表头的table。
+// * demo1002
+// */
+// import React, { Component } from 'react';
+// // import {  } from 'tinper-bee';
+// import {Icon, Table} from "tinper-bee";
+
+// // import Table from "tinper-bee/lib/src";; 
+// // import dragColumn from "tinper-bee/lib/dragColumn";;
+
+// const columns23 = [
+//   {
+//     title: "订单编号",
+//     dataIndex: "a",
+//     key: "a",
+//     width: '200',
+//     fixed:'left'
+//   },
+//   {
+//     title: "单据日期",
+//     dataIndex: "b",
+//     key: "b",
+//     width: '600'
+//   },
+//   {
+//     title: "供应商",
+//     dataIndex: "c",
+//     key: "c",
+//     width: '200',
+//   }, 
+//   {
+//     title: "联系人",
+//     dataIndex: "d",
+//     key: "d",
+//     width: 500,
+//   }
+// ];
+
+// const data23 = [
+//   { a: "NU0391001", b: "2019-03-01", c: "xx供应商",d:'Tom', key: "2" },
+//   { a: "NU0391002", b: "2018-11-02", c: "yy供应商",d:'Jack', key: "1" },
+//   { a: "NU0391003", b: "2019-05-03", c: "zz供应商",d:'Jane', key: "3" }
+// ];
+
+// // const DragColumnTable = dragColumn(Table);
+
+
+// export default class Test extends Component {
+//   constructor(props) {
+//     super(props); 
+//   }
+
+//   render() {
+//     return <Table 
+//             columns={columns23} 
+//             data={data23} 
+//             bordered
+//             dragborder={true} 
+//             draggable={true} 
+//             scroll={{y:200}}
+//             onDropBorder ={(e,width)=>{
+//               console.log(width+"--调整列宽后触发事件",e.target);
+//             }}
+//             />;
+//   }
+// }
+
+/**
+ * @title 基本Tooltip
+ * @description trigger 设置显示方式。
+ */
+
+// import React, { Component } from 'react';
+// import { Tooltip, Button } from 'tinper-bee';
+
+
+// export default class Test extends Component {
+//   state = {
+//     visible: false
+//   }
+
+//   onHide = (visible) => {
+//     console.log('onHide', visible);
+//     this.setState({
+//       visible: visible
+//     })
+//   }
+
+//   show = () => {
+//     this.setState({
+//       visible: !this.state.visible
+//     })
+//   }
+
+//   render() {
+//     let tip = (
+//       <div>
+//         这是一个很强的提醒！
+// 			</div>
+//     )
+
+//     return (
+//       <div className="demo-tooltip">
+//         <Tooltip inverse overlay={tip}>
+//           <Button colors="primary">
+//             鼠标滑过显示
+// 					</Button>
+//         </Tooltip>
+//         <Tooltip
+//           trigger="click"
+//           rootClose
+//           placement="bottom"
+//           overlay={tip}
+//           visible={this.state.visible}
+//           onVisibleChange={v => console.log(v)}
+//           onHide={this.onHide}>
+//           <Button style={{ marginLeft: 100 }} colors="primary" onClick={this.show}>
+//             点击显示
+// 					</Button>
+//         </Tooltip>
+//       </div>
+//     )
+//   }
+// }
+
+
+var Test = function (_Component2) {
+  (0, _inherits3.default)(Test, _Component2);
+
+  function Test(props) {
+    (0, _classCallCheck3.default)(this, Test);
+
+    var _this2 = (0, _possibleConstructorReturn3.default)(this, (Test.__proto__ || (0, _getPrototypeOf2.default)(Test)).call(this, props));
+
+    _this2.onChange = function (e) {
+      _this2.setState({
+        value: e
+      });
+    };
+
+    _this2.state = {
+      value: ''
+    };
+    return _this2;
+  }
+
+  (0, _createClass3.default)(Test, [{
+    key: 'render',
+    value: function render() {
+      return _react2.default.createElement(A, { value: this.state.value, onChange: this.onChange });
+    }
+  }]);
+  return Test;
+}(_react.Component);
+
+exports.default = Test;
+//# sourceMappingURL=index.js.map

package/dist/components/test/index.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["tplus-components-touch/components/test/index.js"],"names":["A","props","onChange","e","setState","value","state","Component","Test"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAuPA;;;;;;IAEOA,C;;;AAEL,aAAYC,KAAZ,EAAmB;AAAA;;AAAA,4HACXA,KADW;;AAAA,UAOnBC,QAPmB,GAOR,UAACC,CAAD,EAAO;AAChB,YAAKC,QAAL,CAAc;AACZC,eAAOF;AADK,OAAd;AAGA,YAAKF,KAAL,CAAWC,QAAX,CAAoBC,CAApB;AACD,KAZkB;;AAEjB,UAAKG,KAAL,GAAa;AACXD,aAAO;AADI,KAAb;AAFiB;AAKlB;;;;6BASQ;AACP,aACE,uDAAa,UAAU,KAAKH,QAA5B,EAAsC,OAAO,KAAKD,KAAL,CAAWI,KAAxD,GADF;AAGD;;;EApBcE,gB,GAzPjB;AACA;;;AAGA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;;AAEA;AACA;AACA;AACA;AACA;AACA;;AAEA;AACA;;;AAGA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;;AAEA;;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;;AAEA;AACA;;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;;AAEA;AACA;AACA;AACA;AACA;;AAEA;;;AAIA;AACA;AACA;AACA;;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;;AAEA;;;;;AAMA;AACA;;;AAIA;AACA;AACA;AACA;;AAEA;AACA;AACA;AACA;AACA;AACA;;AAEA;AACA;AACA;AACA;AACA;;AAEA;AACA;AACA;AACA;AACA;AACA;;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;;;IAgCqBC,I;;;AAEnB,gBAAYP,KAAZ,EAAmB;AAAA;;AAAA,mIACXA,KADW;;AAAA,WAMnBC,QANmB,GAMR,UAACC,CAAD,EAAO;AAChB,aAAKC,QAAL,CAAc;AACZC,eAAOF;AADK,OAAd;AAGD,KAVkB;;AAEjB,WAAKG,KAAL,GAAa;AACXD,aAAO;AADI,KAAb;AAFiB;AAKlB;;;;6BAMQ;AACP,aACE,8BAAC,CAAD,IAAG,OAAO,KAAKC,KAAL,CAAWD,KAArB,EAA4B,UAAU,KAAKH,QAA3C,GADF;AAGD;;;EAjB+BK,gB;;kBAAbC,I","file":"index.js","sourcesContent":["// import React, { Component } from 'react';\n// import { Table, Popover, Button, FormControl } from 'tinper-bee';\n\n\n// class Test extends Component {\n//     state = {\n//         show: false\n//     }\n//     onFocus = () => {\n//         console.log('focus')\n//         this.setState({\n//             show: true\n//         })\n//     }\n//     onBlur = () => {\n//         console.log('blur')\n//         this.setState({\n//             show: false\n//         })\n//     }\n//     onHide = (visible) => {\n//         this.setState({\n//             show: visible\n//         })\n//     }\n//     render() {\n//     let content = (\n//         <div>\n//             <h3>消息</h3>\n//             <ul>\n//                 <li>您的服务器已宕机，请处理。</li>\n//                 <li>您的手机已停机，请续费。</li>\n//                 <li>你的工资已到账，请查收。</li>\n//             </ul>\n//         </div>\n//     );\n//         return (\n//             <Popover\n//                 placement=\"topLeft\"\n//                 show={this.state.show}\n//                 onHide={this.onHide}\n//                 content={content}>\n\n//                 <FormControl type='text' onFocus={this.onFocus} onBlur={this.onBlur} />\n//             </Popover>\n//         )\n//     }\n// }\n// export default Test;\n\n// import React, {Component} from 'react';\n// import { Popover, Button, FormControl } from 'tinper-bee';\n\n\n// class Test extends Component {\n//     constructor(props) {\n//         super(props);\n//         this.state = {\n//             show: false\n//         }\n//     }\n//     handleClose = () => {\n//         this.setState({\n//             show: false\n//         })\n//     }\n//     show = () => {\n//         this.setState({\n//             show: true\n//         })\n//     }\n//     onHide = (visible) => {\n//         this.setState({\n//             show: visible\n//         })\n//     }\n//     render() {\n//         let content = (\n//             <div>\n//                 <Button\n//                     colors=\"primary\"\n//                     onClick={ this.handleClose }\n//                     size=\"sm\">\n//                     关闭\n//                 </Button>\n//             </div>\n//         )\n//         return (\n//             <div>\n//                 <Popover\n//                     id=\"demo2\"\n//                     placement=\"right\"\n//                     title={<h3>请确认您的包裹已签收！</h3>}\n//                     content={content}\n//                     show={this.state.show}\n//                     onHide={this.onHide}\n//                 >\n//                     {/* <Button\n//                         colors=\"primary\"\n//                         onClick={ this.show }\n//                         >确认按钮</Button> */}\n//                         <FormControl type='text' onFocus={this.show}  />\n//                 </Popover>\n//             </div>\n//         )\n//     }\n// }\n\n// export default Test;\n\n// /**\n// *\n// * @title 拖拽改变列宽度\n// * @parent 列操作-拖拽 Drag\n// * @description onDropBorder方法为调整列宽后触发的回调函数。注：不支持tree结构的表头、合并表头的table。\n// * demo1002\n// */\n// import React, { Component } from 'react';\n// // import {  } from 'tinper-bee';\n// import {Icon, Table} from \"tinper-bee\";\n\n// // import Table from \"tinper-bee/lib/src\";; \n// // import dragColumn from \"tinper-bee/lib/dragColumn\";;\n\n// const columns23 = [\n//   {\n//     title: \"订单编号\",\n//     dataIndex: \"a\",\n//     key: \"a\",\n//     width: '200',\n//     fixed:'left'\n//   },\n//   {\n//     title: \"单据日期\",\n//     dataIndex: \"b\",\n//     key: \"b\",\n//     width: '600'\n//   },\n//   {\n//     title: \"供应商\",\n//     dataIndex: \"c\",\n//     key: \"c\",\n//     width: '200',\n//   }, \n//   {\n//     title: \"联系人\",\n//     dataIndex: \"d\",\n//     key: \"d\",\n//     width: 500,\n//   }\n// ];\n\n// const data23 = [\n//   { a: \"NU0391001\", b: \"2019-03-01\", c: \"xx供应商\",d:'Tom', key: \"2\" },\n//   { a: \"NU0391002\", b: \"2018-11-02\", c: \"yy供应商\",d:'Jack', key: \"1\" },\n//   { a: \"NU0391003\", b: \"2019-05-03\", c: \"zz供应商\",d:'Jane', key: \"3\" }\n// ];\n\n// // const DragColumnTable = dragColumn(Table);\n\n\n\n// export default class Test extends Component {\n//   constructor(props) {\n//     super(props); \n//   }\n\n//   render() {\n//     return <Table \n//             columns={columns23} \n//             data={data23} \n//             bordered\n//             dragborder={true} \n//             draggable={true} \n//             scroll={{y:200}}\n//             onDropBorder ={(e,width)=>{\n//               console.log(width+\"--调整列宽后触发事件\",e.target);\n//             }}\n//             />;\n//   }\n// }\n\n/**\n * @title 基本Tooltip\n * @description trigger 设置显示方式。\n */\n\n\n// import React, { Component } from 'react';\n// import { Tooltip, Button } from 'tinper-bee';\n\n\n\n// export default class Test extends Component {\n//   state = {\n//     visible: false\n//   }\n\n//   onHide = (visible) => {\n//     console.log('onHide', visible);\n//     this.setState({\n//       visible: visible\n//     })\n//   }\n\n//   show = () => {\n//     this.setState({\n//       visible: !this.state.visible\n//     })\n//   }\n\n//   render() {\n//     let tip = (\n//       <div>\n//         这是一个很强的提醒！\n// \t\t\t</div>\n//     )\n\n//     return (\n//       <div className=\"demo-tooltip\">\n//         <Tooltip inverse overlay={tip}>\n//           <Button colors=\"primary\">\n//             鼠标滑过显示\n// \t\t\t\t\t</Button>\n//         </Tooltip>\n//         <Tooltip\n//           trigger=\"click\"\n//           rootClose\n//           placement=\"bottom\"\n//           overlay={tip}\n//           visible={this.state.visible}\n//           onVisibleChange={v => console.log(v)}\n//           onHide={this.onHide}>\n//           <Button style={{ marginLeft: 100 }} colors=\"primary\" onClick={this.show}>\n//             点击显示\n// \t\t\t\t\t</Button>\n//         </Tooltip>\n//       </div>\n//     )\n//   }\n// }\n\n\n\n\n\n\nimport React, { Component } from 'react';\nimport { FormControl } from 'tinper-bee';\n class A extends Component {\n\n  constructor(props) {\n    super(props);\n    this.state = {\n      value: ''\n    }\n  }\n\n  onChange = (e) => {\n    this.setState({\n      value: e\n    })\n    this.props.onChange(e)\n  }\n\n  render() {\n    return (\n      <FormControl onChange={this.onChange} value={this.props.value} />\n    )\n  }\n}\n\nexport default class Test extends Component {\n\n  constructor(props) {\n    super(props);\n    this.state = {\n      value: ''\n    }\n  }\n  onChange = (e) => {\n    this.setState({\n      value: e\n    })\n  }\n  render() {\n    return (\n      <A value={this.state.value} onChange={this.onChange} />\n    )\n  }\n}"]}