@cniot/android-pda-components 0.2.21 → 0.2.25

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (109) hide show
  1. package/build/assets/{index.b428d9a3.js → index.44dba996.js} +1 -1
  2. package/build/index.html +1 -1
  3. package/doc/index.jsx +0 -2
  4. package/es/index.cjs.js +7 -0
  5. package/es/index.es.js +2201 -0
  6. package/es/style.css +1 -0
  7. package/package.json +1 -1
  8. package/packages/AppList/doc.jsx +0 -138
  9. package/packages/AppList/index.jsx +0 -33
  10. package/packages/AppList/index.less +0 -52
  11. package/packages/BaseLayout/BarcodeScan.jsx +0 -88
  12. package/packages/BaseLayout/BaseLayoutContainer.jsx +0 -208
  13. package/packages/BaseLayout/RfidOnce.jsx +0 -106
  14. package/packages/BaseLayout/RfidScan.jsx +0 -118
  15. package/packages/BaseLayout/doc.jsx +0 -177
  16. package/packages/BaseLayout/index.jsx +0 -52
  17. package/packages/BaseLayout/index.less +0 -47
  18. package/packages/Button/doc.jsx +0 -62
  19. package/packages/Button/index.jsx +0 -27
  20. package/packages/Button/index.less +0 -62
  21. package/packages/Confirm/doc.jsx +0 -147
  22. package/packages/Confirm/index.jsx +0 -71
  23. package/packages/Confirm/index.less +0 -55
  24. package/packages/Header/doc.jsx +0 -171
  25. package/packages/Header/index.jsx +0 -191
  26. package/packages/Header/index.less +0 -71
  27. package/packages/InfoCard/doc.jsx +0 -244
  28. package/packages/InfoCard/index.jsx +0 -67
  29. package/packages/InfoCard/index.less +0 -111
  30. package/packages/List/doc.jsx +0 -89
  31. package/packages/List/index.jsx +0 -54
  32. package/packages/List/index.less +0 -43
  33. package/packages/Overlay/doc.jsx +0 -103
  34. package/packages/Overlay/index.jsx +0 -42
  35. package/packages/Overlay/index.less +0 -28
  36. package/packages/PdaActionSheet/doc.jsx +0 -193
  37. package/packages/PdaActionSheet/index.jsx +0 -44
  38. package/packages/PdaActionSheet/index.less +0 -65
  39. package/packages/PdaDistanceCard/doc.jsx +0 -62
  40. package/packages/PdaDistanceCard/index.jsx +0 -35
  41. package/packages/PdaDistanceCard/index.less +0 -42
  42. package/packages/PdaFinishCard/doc.jsx +0 -111
  43. package/packages/PdaFinishCard/index.jsx +0 -62
  44. package/packages/PdaFinishCard/index.less +0 -62
  45. package/packages/PdaInfiniteScroll/doc.jsx +0 -121
  46. package/packages/PdaInfiniteScroll/index.jsx +0 -114
  47. package/packages/PdaInfiniteScroll/index.less +0 -12
  48. package/packages/PdaInfiniteScroll/utils.jsx +0 -25
  49. package/packages/PdaSteps/PdaStep/index.jsx +0 -38
  50. package/packages/PdaSteps/PdaStep/index.less +0 -70
  51. package/packages/PdaSteps/PdaSteps/index.jsx +0 -33
  52. package/packages/PdaSteps/PdaSteps/index.less +0 -0
  53. package/packages/PdaSteps/doc.jsx +0 -131
  54. package/packages/PdaSteps/index.jsx +0 -5
  55. package/packages/PdaTitle/doc.jsx +0 -102
  56. package/packages/PdaTitle/index.jsx +0 -51
  57. package/packages/Presentation/doc.jsx +0 -72
  58. package/packages/Presentation/index.jsx +0 -25
  59. package/packages/Presentation/index.less +0 -31
  60. package/packages/SelectCard/doc.jsx +0 -57
  61. package/packages/SelectCard/index.jsx +0 -13
  62. package/packages/SelectCard/index.less +0 -30
  63. package/packages/SimpleCard/doc.jsx +0 -59
  64. package/packages/SimpleCard/index.jsx +0 -13
  65. package/packages/SimpleCard/index.less +0 -38
  66. package/packages/SimpleCardBlock/doc.jsx +0 -77
  67. package/packages/SimpleCardBlock/index.jsx +0 -43
  68. package/packages/SimpleCardBlock/index.less +0 -26
  69. package/packages/SubCard/doc.jsx +0 -63
  70. package/packages/SubCard/index.jsx +0 -28
  71. package/packages/SubCard/index.less +0 -64
  72. package/packages/Tag/doc.jsx +0 -47
  73. package/packages/Tag/index.jsx +0 -12
  74. package/packages/Tag/index.less +0 -22
  75. package/packages/TaskCard/doc.jsx +0 -151
  76. package/packages/TaskCard/index.jsx +0 -65
  77. package/packages/TaskCard/index.less +0 -101
  78. package/packages/Toast/doc.jsx +0 -112
  79. package/packages/Toast/index.jsx +0 -7
  80. package/packages/Toast/index.less +0 -23
  81. package/packages/Toast/methods.jsx +0 -77
  82. package/packages/Toast/toast.jsx +0 -96
  83. package/packages/WakeKeyborard/doc.jsx +0 -170
  84. package/packages/WakeKeyborard/index.jsx +0 -61
  85. package/packages/WakeKeyborard/index.less +0 -55
  86. package/packages/WakeKeyborard/keyborard.jsx +0 -61
  87. package/packages/doc.jsx +0 -19
  88. package/packages/global.less +0 -7
  89. package/packages/index.jsx +0 -60
  90. package/packages/index.less +0 -3
  91. package/packages/pageflow-system-pages/alert/doc.jsx +0 -70
  92. package/packages/pageflow-system-pages/alert/index.jsx +0 -22
  93. package/packages/pageflow-system-pages/confirm/doc.jsx +0 -118
  94. package/packages/pageflow-system-pages/confirm/index.jsx +0 -31
  95. package/packages/pageflow-system-pages/debug/index.jsx +0 -27
  96. package/packages/pageflow-system-pages/debug/index.less +0 -5
  97. package/packages/pageflow-system-pages/index.jsx +0 -38
  98. package/packages/pageflow-system-pages/loading/index.jsx +0 -37
  99. package/packages/pageflow-system-pages/not-found/index.jsx +0 -12
  100. package/packages/pageflow-system-pages/not-found/index.less +0 -26
  101. package/packages/pageflow-system-pages/prompt/doc.jsx +0 -95
  102. package/packages/pageflow-system-pages/prompt/index.jsx +0 -43
  103. package/packages/pageflow-system-pages/prompt/index.less +0 -44
  104. package/packages/pageflow-system-pages/start/index.jsx +0 -28
  105. package/packages/pageflow-system-pages/start/index.less +0 -12
  106. package/packages/pageflow-system-pages/toast/doc.jsx +0 -76
  107. package/packages/pageflow-system-pages/toast/index.jsx +0 -42
  108. package/packages/utils/index.js +0 -56
  109. package/packages/variable.less +0 -4
@@ -1,118 +0,0 @@
1
- import React from "react";
2
- import BaseLayoutContainer from './BaseLayoutContainer'
3
- import classNames from "classnames";
4
-
5
- const blankFunc = () => { };
6
-
7
- export default class RfidOnce extends React.Component {
8
- static defaultProps = {
9
- rfidReaderSleep: false,
10
- }
11
- constructor(props) {
12
- super(props);
13
- this._rfidBeginScan = false;
14
- this._handleRfidScan = e => {
15
- const { onRfidScan, onRfidBoxScan, onRfidPalletScan } = this.props;
16
- const data = e.param;
17
- const isBox = data.rfidData.startsWith("0F006");
18
- const isPallet = data.rfidData.startsWith("0F011");
19
- if(isPallet) {
20
- let rfidData = data.rfidData;
21
- data.originData = rfidData;
22
- data.rfidData = rfidData.substr(5, 12)
23
- }
24
-
25
- if(isBox && onRfidBoxScan) {
26
- onRfidBoxScan(data);
27
- } else if(isPallet && onRfidPalletScan) {
28
- onRfidPalletScan(data);
29
- }
30
- if(onRfidScan) {
31
- onRfidScan(data);
32
- }
33
- }
34
- this._startWork = e => {
35
- document.addEventListener('ContinuousRfidScan', this._handleRfidScan);
36
- WindVane.call('WindvanePlugin', 'invoke', "{'domain': 'rfid', 'method': 'startScan', 'params': null}", function(e) {
37
-
38
- }, function(e) {
39
-
40
- });
41
- this._rfidBeginScan = true;
42
- }
43
- this._stopWork = e => {
44
- document.removeEventListener('ContinuousRfidScan', this._handleRfidScan);
45
- // WindVane.call('WindvanePlugin', 'invoke', "{'domain': 'rfid', 'method': 'stopScan', 'params':null}", function(e) {
46
- // }, function(e) {
47
- // });
48
- WindVane.call('WindvanePlugin', 'invoke', "{'domain': 'rfid', 'method': 'stopRfidScan', 'params':null}", function(e) {
49
- }, function(e) {
50
- });
51
- }
52
- this._handleKeyDown = e => {
53
- const { code, keyCode, key } = e; // code: F23/F24; keyCode: 0; key: uniden...
54
- if (code === 'F22' || code === 'F23' || code === 'F24' || code === 'F9' || code ==='F16') {
55
- if (!this._rfidBeginScan) {
56
- this._startWork();
57
- }
58
- }
59
- }
60
- this._handleKeyUp = e => {
61
- const { code, keyCode, key } = e; // code: F23/F24; keyCode: 0; key: uniden...
62
- if (code === 'F22' || code === 'F23' || code === 'F24' || code === 'F9' || code ==='F16') {
63
- this._stopWork();
64
- this._rfidBeginScan = false;
65
- }
66
- }
67
- }
68
-
69
- componentDidMount() {
70
- // console.log('Rfid Scan didMount');
71
- const { autoRfidScan = false, rfidReaderSleep } = this.props;
72
-
73
- WindVane.call('WindvanePlugin', 'invoke', "{'domain': 'keyboard', 'method': 'changeScanMode', 'params': {'scanMode': 'RFID'}}", function (e) {
74
- // alert('success ' + JSON.stringify(e));
75
- }, function (e) {
76
- // alert('failure ' + JSON.stringify(e));
77
- });
78
-
79
- if(!autoRfidScan) {
80
- document.addEventListener('keydown', this._handleKeyDown);
81
- document.addEventListener('keyup', this._handleKeyUp);
82
- } else {
83
- if(!rfidReaderSleep) {
84
- this._startWork();
85
- }
86
- }
87
- }
88
- componentWillUnmount() {
89
- // const { autoRfidScan = false } = this.props;
90
- document.removeEventListener('keydown', this._handleKeyDown);
91
- document.removeEventListener('keyup', this._handleKeyUp);
92
- this._stopWork();
93
- }
94
- shouldComponentUpdate(nextProps, nextState) {
95
- if(this.props.autoRfidScan && (this.props.rfidReaderSleep !== nextProps.rfidReaderSleep) ) {
96
- if(!nextProps.rfidReaderSleep) {
97
- this._startWork();
98
- } else {
99
- this._stopWork();
100
- }
101
- }
102
- return true;
103
- }
104
-
105
-
106
- render() {
107
- // console.log('onRfidScan render');
108
-
109
- const props = this.props;
110
- const { onRfidScan = blankFunc, autoRfidScan, ...opts } = props;
111
-
112
- return (
113
- <BaseLayoutContainer
114
- {...opts}
115
- />
116
- )
117
- }
118
- }
@@ -1,177 +0,0 @@
1
- import React, {useState} from "react";
2
- import BaseLayout from "./index";
3
- import Title from '../PdaTitle';
4
- import InfoCard from '../InfoCard';
5
- import Button from '../Button';
6
- import Presentation from '../Presentation';
7
-
8
- // const ButtonGroup = Button.Group;
9
-
10
- export default function () {
11
- const [loading, setLoading] = useState(false);
12
-
13
- const header = <Title></Title>;
14
- const footer = (
15
- <Button.Group>
16
- <Button type="cutout" onClick={e => {
17
- console.log('cancle')
18
- setLoading(true);
19
- if(!loading) {
20
- setTimeout(() => {
21
- setLoading(false);
22
- }, 2000);
23
- }
24
- }}>取消</Button>
25
- <Button type="primary">确认</Button>
26
- </Button.Group>
27
- )
28
- const infoCard = [{}, {}, {}]
29
-
30
- return (
31
- <div>
32
- <h1>Scan</h1>
33
- <p>扫码组件</p>
34
- <h2>示例</h2>
35
- {/* const { type="default", width, style = {}, onClick } = this.props; */}
36
- <div className="light-block" style={{display: 'flex'}}>
37
- <div style={{width: 480, height: 800, position: 'relative'}}>
38
- <BaseLayout
39
- style={{backgroundColor: 'black', marginRight: 20,}}
40
- header={header}
41
- footer={footer}
42
- loading={loading}
43
- // loadingTimeout={2000}
44
- >
45
- <Presentation text="请靠近箱码进行识别" ></Presentation>
46
-
47
- </BaseLayout>
48
- </div>
49
- <div style={{width: 480, height: 800, position: 'relative'}}>
50
- <BaseLayout
51
- style={{backgroundColor: 'black'}}
52
- header={header}
53
- footer={footer}
54
- >
55
- {
56
- infoCard.map((item, index) => {
57
- return <InfoCard
58
- key={index}
59
- title="待拣件数"
60
- highlightInfo="800"
61
- highlightInfoCN = "件"
62
- highlightSubInfo="/800"
63
- highlightSubInfoCN="件"
64
- boldInfo="加粗显示:512/五厂综包一楼,这是加粗显示的货品名称可能有多行"
65
- style={{
66
- width: '400px',
67
- backgroundColor: 'black',
68
- }}
69
- theme='dark'
70
- infoList={
71
- [
72
- {label: '商品条码', content: '623126388798'},
73
- {label: '截止日期', content: '2022-07-25'},
74
- {label: '产品名称', content: '商品的名称'},
75
- {label: '品号', content: '12398765423'},
76
- ]
77
- }
78
- />
79
- })
80
- }
81
- </BaseLayout>
82
- </div>
83
- </div>
84
- <code className="code">{`
85
- const header = <Title></Title>;
86
- const footer = (
87
- <Button.Group>
88
- <Button type="cutout" onClick={e => console.log('cancle')}>取消</Button>
89
- <Button type="primary">确认</Button>
90
- </Button.Group>
91
- )
92
-
93
- <BaseLayout
94
- header={header}
95
- footer={footer}
96
- >
97
- <Presentation text="请靠近箱码进行识别" ></Presentation>
98
- </BaseLayout>
99
- `}</code>
100
- <h2>参数</h2>
101
- <table className="pure-table pure-table-bordered">
102
- <thead>
103
- <tr>
104
- <th>属性</th>
105
- <th>说明</th>
106
- <th>类型</th>
107
- <th>默认值</th>
108
- </tr>
109
- </thead>
110
- <tbody>
111
- <tr>
112
- <td>header</td>
113
- <td>吸顶组件</td>
114
- <td></td>
115
- <td></td>
116
- </tr>
117
- <tr>
118
- <td>footer</td>
119
- <td>吸底组件</td>
120
- <td></td>
121
- <td></td>
122
- </tr>
123
- <tr>
124
- <td>onBarcodeScan</td>
125
- <td>注册扫描二维码/条形码[徐福记项目专用]</td>
126
- <td>Function</td>
127
- <td>data => data.scanData</td>
128
- </tr>
129
-
130
- <tr>
131
- <td>onScanBarcode</td>
132
- <td>注册扫描二维码/条形码[推荐使用]</td>
133
- <td>Function</td>
134
- <td>data => data.scanData</td>
135
- </tr>
136
-
137
- <tr>
138
- <td>onRfidOnce</td>
139
- <td>按键按下/抬起,只触发第一个rfid码</td>
140
- <td>Function</td>
141
- <td>data => {}</td>
142
- </tr>
143
- <tr>
144
- <td>onRfidBoxOnce</td>
145
- <td>按键按下/抬起,只触发第一个 rfid 箱码</td>
146
- <td>Function</td>
147
- <td>data => {}</td>
148
- </tr>
149
- <tr>
150
- <td>onRfidPalletOnce</td>
151
- <td>按键按下/抬起,只触发第一个 rfid 栈板码</td>
152
- <td>Function</td>
153
- <td>data => {}</td>
154
- </tr>
155
- <tr>
156
- <td>onRfidScan</td>
157
- <td>按键按下/抬起触发 rfid 连续扫描</td>
158
- <td>Function</td>
159
- <td>data => {}</td>
160
- </tr>
161
- <tr>
162
- <td>onRfidBoxScan</td>
163
- <td>按键按下/抬起触发 rfid 箱码连续扫描</td>
164
- <td>Function</td>
165
- <td>data => {}</td>
166
- </tr>
167
- <tr>
168
- <td>onRfidPalletScan</td>
169
- <td>按键按下/抬起触发 rfid 栈板码连续扫描</td>
170
- <td>Function</td>
171
- <td>data => {}</td>
172
- </tr>
173
- </tbody>
174
- </table>
175
- </div>
176
- );
177
- }
@@ -1,52 +0,0 @@
1
- import React from "react";
2
- import BaseLayoutContainer from './BaseLayoutContainer';
3
- import RfidOnce from './RfidOnce';
4
- import RfidScan from './RfidScan';
5
- import BarcodeScan from './BarcodeScan';
6
- import classNames from "classnames";
7
-
8
- const blankFunc = () => { };
9
-
10
- export default class BaseLayout extends React.Component {
11
- constructor(props) {
12
- super(props);
13
- }
14
-
15
- render() {
16
- const props = this.props;
17
- // onScanBarcode 一直监听
18
- // onBarcodeScan 按下某些建才监听
19
- const {onBarcodeScan, onScanBarcode, onRfidOnce, onRfidBoxOnce, onRfidPalletOnce, onRfidScan, onRfidBoxScan, onRfidPalletScan } = props;
20
-
21
- if(onRfidOnce || onRfidBoxOnce || onRfidPalletOnce) {
22
- return (
23
- <RfidOnce
24
- // onRfidOnce={onRfidOnce}
25
- {...props}
26
- />
27
- )
28
- }
29
- if(onRfidScan || onRfidBoxScan || onRfidPalletScan) {
30
- return (
31
- <RfidScan
32
- // onRfidScan={onRfidScan}
33
- {...props}
34
- />
35
- )
36
- }
37
- if(onBarcodeScan || onScanBarcode) {
38
- return (
39
- <BarcodeScan
40
- // onBarcodeScan= {onBarcodeScan}
41
- {...props}
42
- />
43
- )
44
- }
45
-
46
- return (
47
- <BaseLayoutContainer
48
- {...props}
49
- />
50
- )
51
- }
52
- }
@@ -1,47 +0,0 @@
1
- .baselayout-wrapper {
2
- height: 100%;
3
- min-height: 100%;
4
- display: flex;
5
- flex-direction: column;
6
- position: absolute;
7
- top: 0;
8
- left: 0;
9
- right: 0;
10
- bottom: 0;
11
- background-color: black;
12
-
13
- .baselayout-header {
14
- // height: 84px;
15
- }
16
- .baselayout-container {
17
- // height: calc(100% - 84px);
18
- padding: 0 24px;
19
- overflow-x: auto;
20
- flex: 1;
21
-
22
- &>* {
23
- margin-top: 16px;
24
- }
25
- padding-bottom: 16px;
26
- }
27
- .baselayout-footer {
28
- padding: 16px 0;
29
- }
30
- // .baselayout-paddingbottom {
31
- // height: 24px;
32
- // }
33
-
34
- .loading {
35
- position: absolute;
36
- top: 0;
37
- left: 0;
38
- right: 0;
39
- bottom: 0;
40
- color: white;
41
- background-color: rgba(0,0,0,0.4);
42
- background-image: url(https://img.alicdn.com/imgextra/i2/O1CN01PRSptR1YO1wOlBHCr_!!6000000003048-1-tps-240-240.gif);
43
- background-repeat: no-repeat;
44
- background-position: center;
45
- background-size: 120px 120px;
46
- }
47
- }
@@ -1,62 +0,0 @@
1
- import React from "react";
2
- import Button from "./index";
3
-
4
- export default function () {
5
- return (
6
- <div>
7
- <h1>Button</h1>
8
- <p>扫码组件</p>
9
- <h2>示例</h2>
10
- {/* const { type="default", width, style = {}, onClick } = this.props; */}
11
- <div className="light-block">
12
- <Button dataClick='arms track'>按钮</Button>
13
- <Button type='primary' onClick={e => console.log(e) } dataClick=''>确认</Button>
14
- <Button type='dark'>深色</Button>
15
- <Button.Group>
16
- <Button type="cutout">镂空</Button>
17
- <Button>按钮</Button>
18
- </Button.Group>
19
- </div>
20
- <code className="code">{`
21
- <Button dataClick='arms track'>按钮</Button>
22
- <Button type='primary' onClick={e => console.log(e) }>确认</Button>
23
- <Button type='dark'>深色</Button>
24
- <Button.Group>
25
- <Button type="cutout">镂空</Button>
26
- <Button>按钮</Button>
27
- </Button.Group>
28
- `}</code>
29
- <h2>参数</h2>
30
- <table className="pure-table pure-table-bordered">
31
- <thead>
32
- <tr>
33
- <th>属性</th>
34
- <th>说明</th>
35
- <th>类型</th>
36
- <th>默认值</th>
37
- </tr>
38
- </thead>
39
- <tbody>
40
- <tr>
41
- <td>type</td>
42
- <td>类型</td>
43
- <td>string: primary | dark | cutout</td>
44
- <td>default</td>
45
- </tr>
46
- <tr>
47
- <td>onClick</td>
48
- <td>点击事件</td>
49
- <td>function</td>
50
- <td></td>
51
- </tr>
52
- <tr>
53
- <td>dataClick</td>
54
- <td>arms 监控使用</td>
55
- <td>string</td>
56
- <td></td>
57
- </tr>
58
- </tbody>
59
- </table>
60
- </div>
61
- );
62
- }
@@ -1,27 +0,0 @@
1
- import React from "react";
2
- // import OPInput from "../OPInput";
3
- import "./index.less";
4
-
5
-
6
- export default function Button(props){
7
- const { type="default", onClick, className="", tabIndex=1, dataClick=''} = props;
8
- let opt = {};
9
- if(dataClick) {
10
- opt['data-click'] = dataClick;
11
- }
12
- return (
13
- <button className={`pda-button pda-button-${type} ${className}`} onClick={onClick} tabIndex={tabIndex} {...opt}>
14
- {props.children}
15
- </button>
16
- )
17
- }
18
-
19
- export function ButtonGroup(props){
20
- return (
21
- <div className="button-group" >
22
- {props.children}
23
- </div>
24
- )
25
- }
26
-
27
- Button.Group = ButtonGroup;
@@ -1,62 +0,0 @@
1
- .pda-button {
2
- display: block;
3
- box-sizing: border-box;
4
- padding-right: 0;
5
- text-align: center;
6
- font-size: 40px;
7
- height: 90px;
8
- line-height: 40px;
9
- // color: #000;
10
- color: #fff;
11
- background-color: #F3F4F8;
12
- border-radius: 10px;
13
- width: 100%;
14
- border-width: 0;
15
- word-break: keep-all;
16
-
17
- &.pda-button-default {
18
- color: #000;
19
- }
20
- &:active {
21
- background-color: #979797;
22
- }
23
-
24
- &.pda-button-primary {
25
- background-color: #0091EA;
26
- // color: #fff;
27
- &:active {
28
- background-color: #0074BB;
29
- }
30
- }
31
-
32
- &.pda-button-dark {
33
- background-color: #282828;
34
- // color: #fff;
35
- &:active {
36
- background-color: #979797;
37
- }
38
- }
39
-
40
- &.pda-button-cutout {
41
- // background-color: #282828;
42
- // color: #fff;
43
- color: #0091EA;
44
- border-width: 4px;
45
- border-color: #0091EA;
46
- // &:active {
47
- // background-color: #979797;
48
- // }
49
- }
50
- }
51
-
52
- .button-group {
53
- display: flex;
54
- flex-direction: row;
55
- padding: 20px 24px;
56
- width: 100%;
57
- .pda-button {
58
- &:not(:last-child){
59
- margin-right: 16px;
60
- }
61
- }
62
- }
@@ -1,147 +0,0 @@
1
- import React from "react";
2
- import Confirm from "./index";
3
- export default function () {
4
- return (
5
- <div>
6
- <h1>Confirm</h1>
7
- <p>确认组件, 如果要悬浮在页面上,请配合 Overlay 使用</p>
8
- <h2>示例</h2>
9
- <div className="light-block">
10
- <Confirm
11
- title="111111"
12
- message="22222"
13
- okText="确认"
14
- cancelText="取消"
15
- okDataClick='clickOk'
16
- // type="warning"
17
- subMessage={
18
- [{ label: '箱码', content: 'abcdefghijklmnopqrstuvwxyz' }]
19
- }
20
- onClick={(isConfirm) => {
21
- console.log("isConfirm", isConfirm);
22
- }}
23
- ></Confirm>
24
- <br />
25
- <Confirm
26
- title="111111"
27
- message="22222"
28
- okText="确认"
29
- cancelText="取消"
30
- type="warning"
31
- subMessage={
32
- [{ label: '箱码', content: 'abcdefghijklmnopqrstuvwxyz' }]
33
- }
34
- onClick={(isConfirm) => {
35
- console.log("isConfirm", isConfirm);
36
- }}
37
- insertButtons={
38
- [
39
- { label: '查看详情111', value: 'hello', dataClick: '查看详情1234' }
40
- ]
41
- }
42
- appendButtons={
43
- [
44
- { label: '查看详情', value: { name: 'id111' } }
45
- ]
46
- }
47
- ></Confirm>
48
- </div>
49
- <code className="code">{`
50
- <Confirm
51
- // type="warning"
52
- title="111111"
53
- message="22222"
54
- okText="确认"
55
- cancelText="取消"
56
- onClick={(isConfirm)=>{
57
- console.log("isConfirm", isConfirm);
58
- }}
59
- ></Confirm>
60
- `}</code>
61
- <h2>参数</h2>
62
- <table className="pure-table pure-table-bordered">
63
- <thead>
64
- <tr>
65
- <th>属性</th>
66
- <th>说明</th>
67
- <th>类型</th>
68
- <th>默认值</th>
69
- </tr>
70
- </thead>
71
- <tbody>
72
- <tr>
73
- <td>title</td>
74
- <td>标题</td>
75
- <td>string</td>
76
- <td>标题文案</td>
77
- </tr>
78
- <tr>
79
- <td>message</td>
80
- <td>消息内容</td>
81
- <td>string</td>
82
- <td>消息内容</td>
83
- </tr>
84
- <tr>
85
- <td>okText</td>
86
- <td>确认按钮文本</td>
87
- <td>string</td>
88
- <td></td>
89
- </tr>
90
- <tr>
91
- <td>cancelText</td>
92
- <td>取消按钮文本</td>
93
- <td>string</td>
94
- <td></td>
95
- </tr>
96
- <tr>
97
- <td>onClick</td>
98
- <td>按钮点击回调</td>
99
- <td>(isConfirm)=></td>
100
- <td></td>
101
- </tr>
102
- <tr>
103
- <td>type</td>
104
- <td>类型</td>
105
- <td>string: primary | warning</td>
106
- <td>primary</td>
107
- </tr>
108
- <tr>
109
- <td>subMessage</td>
110
- <td>描述</td>
111
- <td>{JSON.stringify([{ label: '箱码' }, { content: 'abcdefghijklmnopqrstuvwxyz' }])}</td>
112
- <td></td>
113
- </tr>
114
- <tr>
115
- <td>okDataClick</td>
116
- <td>ok 按钮 arms 监控</td>
117
- <td>string</td>
118
- <td></td>
119
- </tr>
120
- <tr>
121
- <td>cancelDataClick</td>
122
- <td>cancel 按钮 arms 监控</td>
123
- <td>string</td>
124
- <td></td>
125
- </tr>
126
- <tr>
127
- <td>insertButtons</td>
128
- <td>插入在默认按钮上面</td>
129
- <td>{JSON.stringify([
130
- { label: '查看详情111', value: 'hello', dataClick: '查看详情1234' }
131
- ])}</td>
132
- <td></td>
133
- </tr>
134
- <tr>
135
- <td>appendButtons</td>
136
- <td>追加到默认按钮下面</td>
137
- <td>{JSON.stringify([
138
- { label: '查看详情222', value: 'hello', dataClick: '查看详情1234' }
139
- ])}</td>
140
- <td></td>
141
- </tr>
142
-
143
- </tbody>
144
- </table>
145
- </div>
146
- );
147
- }