@cniot/android-pda-components 2.0.0-beta.7 → 2.0.0-beta.9

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 (9) hide show
  1. package/README.md +2 -1
  2. package/build/assets/{index.ce46372a.js → index.0a5a8d79.js} +55 -55
  3. package/build/assets/{index.87e75c31.css → index.6abd1161.css} +1 -1
  4. package/build/index.html +2 -2
  5. package/doc/all-v2-components/index.jsx +740 -394
  6. package/es/index.cjs.js +6 -6
  7. package/es/index.es.js +152 -84
  8. package/es/style.css +1 -1
  9. package/package.json +1 -1
package/doc/all-v2-components/index.jsx CHANGED
@@ -23,118 +23,125 @@ import {
23
23
  TableV2,
24
24
  PageFlowSystemPagesV2,
25
25
  DatePickerV2,
26
- } from '../../packages';
26
+ InputFieldV2,
27
+ } from "../../packages";
27
28
  import { Button, List } from "antd-mobile";
28
- import './index.less'
29
-
29
+ import "./index.less";
30
30
 
31
31
  const typePropsMap = {
32
32
  normal: {
33
- header: < div > 标题内容</div>,
34
- headerExtra:
35
- {
33
+ header: <div> 标题内容</div>,
34
+ headerExtra: {
36
35
  tag: {
37
- text: '进行中',
36
+ text: "进行中",
38
37
  // type: 'normal'
39
38
  },
40
- desc: 'A1-098',
41
- showRightIcon: true
39
+ desc: "A1-098",
40
+ showRightIcon: true,
42
41
  },
43
42
  footer: [
44
43
  {
45
- type: 'primary',
46
- buttonText: 'primary',
44
+ type: "primary",
45
+ buttonText: "primary",
47
46
  // disabled:true,
48
47
  fullWidth: true,
49
48
  },
50
49
 
51
50
  {
52
- type: 'secondary',
53
- buttonText: 'secondary',
51
+ type: "secondary",
52
+ buttonText: "secondary",
54
53
  // disabled:true,
55
54
  },
56
55
  {
57
- type: 'normal',
58
- buttonText: 'normal',
56
+ type: "normal",
57
+ buttonText: "normal",
59
58
  // disabled:true,
60
59
  },
61
60
  {
62
- type: 'primary',
63
- buttonText: 'primary',
64
- text: true
61
+ type: "primary",
62
+ buttonText: "primary",
63
+ text: true,
65
64
  },
66
65
  {
67
- type: 'normal',
68
- buttonText: 'normal',
69
- text: true
66
+ type: "normal",
67
+ buttonText: "normal",
68
+ text: true,
70
69
  },
71
70
  {
72
- type: 'warning',
73
- buttonText: 'warning',
74
- text: true
71
+ type: "warning",
72
+ buttonText: "warning",
73
+ text: true,
75
74
  },
76
75
  {
77
- type: 'warning',
78
- buttonText: 'warning',
76
+ type: "warning",
77
+ buttonText: "warning",
79
78
  },
80
79
  {
81
- type: 'warning-secondary',
82
- buttonText: 'warning-secondary',
80
+ type: "warning-secondary",
81
+ buttonText: "warning-secondary",
83
82
  },
84
- ]
85
-
83
+ ],
86
84
  },
87
85
  goods: {
88
86
  header: {
89
- goodsImage: 'https://gw.alicdn.com/imgextra/i1/O1CN01PemlAa1msAsAIrq7j_!!6000000005009-0-tps-500-500.jpg',
90
- goodsName: '礼盒套装CXW-358-EMG',
91
- goodsCode: '10290010010',
87
+ goodsImage:
88
+ "https://gw.alicdn.com/imgextra/i1/O1CN01PemlAa1msAsAIrq7j_!!6000000005009-0-tps-500-500.jpg",
89
+ goodsName: "礼盒套装CXW-358-EMG",
90
+ goodsCode: "10290010010",
92
91
  // extra:'单位：件',
93
- attrs: ['单位：件', '常温 | 避光 | 贵品',],
92
+ attrs: ["单位：件", "常温 | 避光 | 贵品"],
94
93
  tags: [
95
94
  {
96
- text: '唯一码',
97
- type: 'warning',
98
- backgroundColor: '#FEF0D6'
99
- }, {
100
- text: '单元',
101
- type: 'success'
102
- }
95
+ text: "唯一码",
96
+ type: "warning",
97
+ backgroundColor: "#FEF0D6",
98
+ },
99
+ {
100
+ text: "单元",
101
+ type: "success",
102
+ },
103
103
  ],
104
104
  },
105
105
  footer: {
106
- label: '',
106
+ label: "",
107
107
  realNum: 8,
108
108
  planNum: 10,
109
- }
109
+ },
110
110
  },
111
111
  list: {
112
- footer: 'A-9-087'
112
+ footer: "A-9-087",
113
113
  },
114
114
  tip: {
115
115
  content: {
116
- label: '标题',
117
- value: 'A-01-0908',
116
+ label: "标题",
117
+ value: "A-01-0908",
118
118
  tag: {
119
- type: 'time',
120
- text: '01:24',
119
+ type: "time",
120
+ text: "01:24",
121
121
  // icon:''
122
- }
123
- }
124
- }
125
- }
122
+ },
123
+ },
124
+ },
125
+ };
126
126
 
127
127
  export default function (props) {
128
- const { data, onNext = (message) => { console.log(`message:======`, message); } } = props;
128
+ const {
129
+ data,
130
+ onNext = (message) => {
131
+ console.log(`message:======`, message);
132
+ },
133
+ } = props;
134
+ const [val, setVal] = useState();
135
+ const [val1, setVal1] = useState();
129
136
  const [showConfirm, setShowConfirm] = useState(false);
130
137
  const [showToast, setShowToast] = useState(false);
131
138
  const [showAlert, setShowAlert] = useState(false);
132
139
  const [showPrompt, setShowPrompt] = useState(false);
133
140
  const [showPopup, setShowPopup] = useState(false);
134
141
  let type;
135
- type = 'normal'
142
+ type = "normal";
136
143
  // type = 'goods'
137
- type = 'list'
144
+ type = "list";
138
145
  // type = 'tip'
139
146
 
140
147
  const showMap = {
@@ -145,6 +152,7 @@ export default function (props) {
145
152
  ButtonV2Group: true,
146
153
  TagV2: true,
147
154
  NumberPickerV2: true,
155
+ InputFieldV2: true,
148
156
  InputV2: true,
149
157
  ProgressBarV2: true,
150
158
  CardV2: true,
@@ -161,10 +169,25 @@ export default function (props) {
161
169
  TableV2: true,
162
170
  PageFlowSystemPagesV2: true,
163
171
  DatePickerV2: true,
164
- }
172
+ };
165
173
  const ImageUploaderV2Component = () => {
166
174
  const [images, setImg] = React.useState([]);
167
- setTimeout(() => { setImg([{ id: 1, url: "https://images.unsplash.com/photo-1624993590528-4ee743c9896e?ixid=MnwxMjA3fDB8MHxwaG90by1wYWdlfHx8fGVufDB8fHx8&ixlib=rb-1.2.1&auto=format&fit=crop&w=200&h=1000&q=80", }, { id: 2, url: "https://images.unsplash.com/photo-1601128533718-374ffcca299b?ixid=MnwxMjA3fDB8MHxwaG90by1wYWdlfHx8fGVufDB8fHx8&ixlib=rb-1.2.1&auto=format&fit=crop&w=3128&q=80", }, { id: 3, url: "https://images.unsplash.com/photo-1567945716310-4745a6b7844b?ixid=MnwxMjA3fDB8MHxwaG90by1wYWdlfHx8fGVufDB8fHx8&ixlib=rb-1.2.1&auto=format&fit=crop&w=300&q=60", },]); }, 1000);
175
+ setTimeout(() => {
176
+ setImg([
177
+ {
178
+ id: 1,
179
+ url: "https://images.unsplash.com/photo-1624993590528-4ee743c9896e?ixid=MnwxMjA3fDB8MHxwaG90by1wYWdlfHx8fGVufDB8fHx8&ixlib=rb-1.2.1&auto=format&fit=crop&w=200&h=1000&q=80",
180
+ },
181
+ {
182
+ id: 2,
183
+ url: "https://images.unsplash.com/photo-1601128533718-374ffcca299b?ixid=MnwxMjA3fDB8MHxwaG90by1wYWdlfHx8fGVufDB8fHx8&ixlib=rb-1.2.1&auto=format&fit=crop&w=3128&q=80",
184
+ },
185
+ {
186
+ id: 3,
187
+ url: "https://images.unsplash.com/photo-1567945716310-4745a6b7844b?ixid=MnwxMjA3fDB8MHxwaG90by1wYWdlfHx8fGVufDB8fHx8&ixlib=rb-1.2.1&auto=format&fit=crop&w=300&q=60",
188
+ },
189
+ ]);
190
+ }, 1000);
168
191
  return (
169
192
  <div>
170
193
  <p>ImageUploader 图片上传</p>
@@ -186,382 +209,705 @@ export default function (props) {
186
209
  />
187
210
  </div>
188
211
  );
189
- }
212
+ };
190
213
  const components = {
191
- LatticeMouthV2: <>投篮指引<LatticeMouthV2 row={3} col={3} dataSource={[{ value: "highlight", label: "2", color: "highlight" }, { value: "active", label: "2", color: "active" }, { value: "default", label: "2", color: "default" }, { value: "complete", label: "2", color: "complete" }, { value: "error", label: "2", color: "error" }, { value: "自定义", label: "2", style: { "--font-size": "18px", "--background-color": "#ffffff", "--color": "#f30f30", "--label-background-color": "rgba(0,0,0,0.3)" } }]} /></>,
192
- ImageUploaderV2: <ImageUploaderV2Component />,
193
- HeaderV2: <HeaderV2
194
- onBack={() => { }}
195
- actions={[
196
- {
197
- label: "功能1",
198
- value: "",
199
- onClick() {
200
- alert("功能1");
214
+ HeaderV2: (
215
+ <HeaderV2
216
+ onBack={() => {}}
217
+ actions={[
218
+ {
219
+ label: "功能1",
220
+ value: "",
221
+ onClick() {
222
+ alert("功能1");
223
+ },
201
224
  },
202
- },
203
- {
204
- label: "功能2",
205
- value: "",
206
- onClick() {
207
- alert("功能2");
225
+ {
226
+ label: "功能2",
227
+ value: "",
228
+ onClick() {
229
+ alert("功能2");
230
+ },
208
231
  },
209
- },
210
- ]}
211
- >
212
- 标准页面
213
- </HeaderV2>,
214
-
215
- ButtonV2FullWidth: <div style={{ backgroundColor: '#ffffff', height: 90, padding: 10, margin: '10px 0' }}>
216
- ButtonV2FullWidth
217
- <ButtonV2 type='primary' fullWidth onClick={() => { console.log(`primary button click===`); }}>提交</ButtonV2>
218
- </div>,
219
-
220
- ButtonV2Group: <div style={{ backgroundColor: '#ffffff', height: 90, padding: '10px 0', margin: '10px 0' }}>
221
- ButtonV2Group
222
- <ButtonV2.Group>
223
- <ButtonV2 type='primary' fullWidth onClick={() => { console.log(`primary button click===`); }}>提交</ButtonV2>
224
- <ButtonV2 fullWidth onClick={() => { console.log(`primary button click===`); }}>取消</ButtonV2>
225
- </ButtonV2.Group>
226
- </div>,
227
-
228
- TagV2: <div style={{ backgroundColor: '#ffffff', display: 'flex', flexWrap: 'wrap', gap: 4, padding: 10, margin: '10px 0' }}>
229
- TagV2
230
- <TagV2 type='data-change'>data-change</TagV2>
231
- <TagV2 type='normal'>normal'</TagV2>
232
- <TagV2 type='warning'>warning'</TagV2>
233
- <TagV2 type='almost-warning'>almost-warning</TagV2>
234
- <TagV2 type='warning-end'>warning-end</TagV2>
235
- </div>,
232
+ ]}
233
+ >
234
+ 标准页面
235
+ </HeaderV2>
236
+ ),
237
+ // ScanV2: (
238
+ // <ScanV2
239
+ // label="扫描"
240
+ // placeholder="请扫描"
241
+ // onScan={(value) => {
242
+ // console.log("scan value", value);
243
+ // }}
244
+ // ></ScanV2>
245
+ // ),
246
+ InputFieldV2: (
247
+ <div>
248
+ 独立输入框
249
+ {/* <input
250
+ value={val}
251
+ onChange={(val) => {
252
+ setVal(val?.target?.value);
253
+ }}
254
+ />
255
+ <button
256
+ onClick={() => {
257
+ setVal(null);
258
+ }}
259
+ >
260
+ dddd
261
+ </button> */}
262
+ <InputFieldV2
263
+ label="文本输入框"
264
+ // labelRowCharNum={4}
265
+ // component={() => {
266
+ // // return <input placeholder="独立输入框"></input>;
267
+ // // return <input>component 可能需要自己维护 校验逻辑等</input>;
268
+ // }}
269
+ type="input"
270
+ componentProps={{}}
271
+ validator={(val) => {
272
+ // return Number(val) > 9 ? "不能大于9" : null;
273
+ return Number(val) > 9
274
+ ? {
275
+ title: "输入错误",
276
+ level: "error",
277
+ message: "不能大于9",
278
+ duration: 5000,
279
+ }
280
+ : null;
281
+ }}
282
+ validateTriggerType="onBlur" // onChange
283
+ onChange={(val) => {
284
+ setVal(val);
285
+ }}
286
+ value={val}
287
+ clearWhenValidateError
288
+ />
289
+ <InputFieldV2
290
+ label="选择"
291
+ // labelRowCharNum={4}
292
+ // component={() => {
293
+ // // return <input placeholder="独立输入框"></input>;
294
+ // // return <input>component 可能需要自己维护 校验逻辑等</input>;
295
+ // }}
296
+ type="select"
297
+ componentProps={{
298
+ dataSource: [
299
+ { label: "1", value: "1" },
300
+ { label: "2", value: "2" },
301
+ ],
302
+ }}
303
+ validator={(val) => {
304
+ // return Number(val) <= 0 ? "必须大于0" : null;
305
+ return val === "1"
306
+ ? {
307
+ title: "输入错误",
308
+ level: "error",
309
+ message: "必须大于0",
310
+ duration: 5000,
311
+ }
312
+ : null;
313
+ }}
314
+ validateTriggerType="onChange" // onChange
315
+ clearWhenValidateError
316
+ onChange={(val) => {
317
+ console.log(`val:======`, val);
318
+ setVal1(val);
319
+ }}
320
+ value={val1}
321
+ />
322
+ <InputFieldV2
323
+ label="数字输入"
324
+ // labelRowCharNum={6}
325
+ // component={() => {
326
+ // // return <input placeholder="独立输入框"></input>;
327
+ // // return <input>component 可能需要自己维护 校验逻辑等</input>;
328
+ // }}
329
+ // componentProps={{}}
330
+ type="number"
331
+ validator={(val) => {
332
+ console.log(`val:======`, val, typeof val);
333
+ return val > 100 ? "不能大于9" : null;
334
+ // return Number(val) > 9
335
+ // ? {
336
+ // title: "输入错误",
337
+ // level: "error",
338
+ // message: "不能大于9",
339
+ // duration: 5000,
340
+ // }
341
+ // : null;
342
+ }}
343
+ validateTriggerType="onChange" // onChange
344
+ onChange={(val) => {
345
+ setVal(val);
346
+ }}
347
+ value={val}
348
+ clearWhenValidateError
349
+ />
350
+ ;
351
+ </div>
352
+ ),
353
+ LatticeMouthV2: (
354
+ <>
355
+ 投篮指引
356
+ <LatticeMouthV2
357
+ row={3}
358
+ col={3}
359
+ dataSource={[
360
+ { value: "highlight", label: "2", color: "highlight" },
361
+ { value: "active", label: "2", color: "active" },
362
+ { value: "default", label: "2", color: "default" },
363
+ { value: "complete", label: "2", color: "complete" },
364
+ { value: "error", label: "2", color: "error" },
365
+ {
366
+ value: "自定义",
367
+ label: "2",
368
+ style: {
369
+ "--font-size": "18px",
370
+ "--background-color": "#ffffff",
371
+ "--color": "#f30f30",
372
+ "--label-background-color": "rgba(0,0,0,0.3)",
373
+ },
374
+ },
375
+ ]}
376
+ />
377
+ </>
378
+ ),
379
+ ImageUploaderV2: <ImageUploaderV2Component />,
380
+ ButtonV2FullWidth: (
381
+ <div
382
+ style={{
383
+ backgroundColor: "#ffffff",
384
+ height: 90,
385
+ padding: 10,
386
+ margin: "10px 0",
387
+ }}
388
+ >
389
+ ButtonV2FullWidth
390
+ <ButtonV2
391
+ type="primary"
392
+ fullWidth
393
+ onClick={() => {
394
+ console.log(`primary button click===`);
395
+ }}
396
+ >
397
+ 提交
398
+ </ButtonV2>
399
+ </div>
400
+ ),
236
401
 
237
- NumberPickerV2: <div style={{ backgroundColor: '#ffffff', padding: 10, margin: '10px 0' }}>
238
- NumberPickerV2
239
- <NumberPickerV2
240
- max={10}
241
- min={0}
242
- />
243
- </div>,
402
+ ButtonV2Group: (
403
+ <div
404
+ style={{
405
+ backgroundColor: "#ffffff",
406
+ height: 90,
407
+ padding: "10px 0",
408
+ margin: "10px 0",
409
+ }}
410
+ >
411
+ ButtonV2Group
412
+ <ButtonV2.Group>
413
+ <ButtonV2
414
+ type="primary"
415
+ fullWidth
416
+ onClick={() => {
417
+ console.log(`primary button click===`);
418
+ }}
419
+ >
420
+ 提交
421
+ </ButtonV2>
422
+ <ButtonV2
423
+ fullWidth
424
+ onClick={() => {
425
+ console.log(`primary button click===`);
426
+ }}
427
+ >
428
+ 取消
429
+ </ButtonV2>
430
+ </ButtonV2.Group>
431
+ </div>
432
+ ),
244
433
 
245
- InputV2: <>输入框<InputV2
246
- hasBorder
247
- // style={{ '--text-align': 'right' }}
248
- /></>,
434
+ TagV2: (
435
+ <div
436
+ style={{
437
+ backgroundColor: "#ffffff",
438
+ display: "flex",
439
+ flexWrap: "wrap",
440
+ gap: 4,
441
+ padding: 10,
442
+ margin: "10px 0",
443
+ }}
444
+ >
445
+ TagV2
446
+ <TagV2 type="data-change">data-change</TagV2>
447
+ <TagV2 type="normal">normal'</TagV2>
448
+ <TagV2 type="warning">warning'</TagV2>
449
+ <TagV2 type="almost-warning">almost-warning</TagV2>
450
+ <TagV2 type="warning-end">warning-end</TagV2>
451
+ </div>
452
+ ),
249
453
 
250
- DatePickerV2: <>时间选择器<DatePickerV2 className='aaaaaaa'
251
- placeholder='请选择时间'
252
- value={new Date('2024-08-26')}
253
- onChange={(val) => { console.log(`val:======时间`, val, typeof val); }}
254
- format='YY-MM-DD'
255
- // showFormat='YYYY-MM-DD'
256
- // defaultValue={new Date('2024-08-26')}
257
- /></>,
454
+ NumberPickerV2: (
455
+ <div
456
+ style={{ backgroundColor: "#ffffff", padding: 10, margin: "10px 0" }}
457
+ >
458
+ NumberPickerV2
459
+ <NumberPickerV2 max={10} min={0} />
460
+ </div>
461
+ ),
258
462
 
259
- ProgressBarV2: <div style={{ backgroundColor: '#ffffff', padding: 10, margin: '10px 0' }}>
260
- ProgressBarV2
261
- <ProgressBarV2 percent={40} />
262
- </div>,
463
+ InputV2: (
464
+ <>
465
+ 输入框
466
+ <InputV2
467
+ hasBorder
468
+ // style={{ '--text-align': 'right' }}
469
+ />
470
+ </>
471
+ ),
263
472
 
264
- SelectV2: <>下拉选择<SelectV2 readOnly disabled value='1'
265
- label="Select Reason"
266
- placeholder="Please select"
267
- dataSource={[
268
- { label: "Item code", value: "1" },
269
- { label: "DIS", value: "2" },
270
- { label: "Barcode", value: "3" },
271
- { label: "Category", value: "4" },
272
- { label: "Qty", value: "5" },
273
- { label: "Item Name", value: "6" },
274
- { label: "DIS", value: "7" },
275
- ]}
276
- /></>,
473
+ DatePickerV2: (
474
+ <>
475
+ 时间选择器
476
+ <DatePickerV2
477
+ className="aaaaaaa"
478
+ placeholder="请选择时间"
479
+ value={new Date("2024-08-26")}
480
+ onChange={(val) => {
481
+ console.log(`val:======时间`, val, typeof val);
482
+ }}
483
+ format="YY-MM-DD"
484
+ // showFormat='YYYY-MM-DD'
485
+ // defaultValue={new Date('2024-08-26')}
486
+ />
487
+ </>
488
+ ),
277
489
 
278
- CardV2: <CardV2
279
- type={type}
280
- {...typePropsMap[type]}
281
- // noPadding
490
+ ProgressBarV2: (
491
+ <div
492
+ style={{ backgroundColor: "#ffffff", padding: 10, margin: "10px 0" }}
493
+ >
494
+ ProgressBarV2
495
+ <ProgressBarV2 percent={40} />
496
+ </div>
497
+ ),
282
498
 
283
- dataSource={[
284
- { label: "", value: "value", className: "high", display: false },
285
- { label: "", value: "value", className: "highlight", display: false },
286
- { label: "输入", value: <NumberPickerV2 /> },
287
- { label: "输入", value: <InputV2 /> },
288
- { label: "最多六个字符", value: "2022-09-08 12:00:00" },
289
- { label: "最多六个字符123", value: "2022-09-08 12:00:00" },
290
- { label: "入库单号", value: "17836397", },
291
- { label: "渠道", value: "电商", },
292
- { label: "数量/总数", value: "12/98", type: 'error', tip: '实收数量少于应收数量，请仔细核对后再结束该入库订单' },
293
- // { label: "label", value: "value,valuevalue,valuevalue,value" },
294
- // { label: "入库单号", value: "17836397", className: "tag" },
295
- // { label: "渠道", value: "电商", className: "tag" },
296
- // { label: "数量/总数", value: "12/98", className: "tag" },
297
- // { label: "多次收货", value: "允许", className: "tag" },
499
+ SelectV2: (
500
+ <>
501
+ 下拉选择
502
+ <SelectV2
503
+ readOnly
504
+ disabled
505
+ value="1"
506
+ label="Select Reason"
507
+ placeholder="Please select"
508
+ dataSource={[
509
+ { label: "Item code", value: "1" },
510
+ { label: "DIS", value: "2" },
511
+ { label: "Barcode", value: "3" },
512
+ { label: "Category", value: "4" },
513
+ { label: "Qty", value: "5" },
514
+ { label: "Item Name", value: "6" },
515
+ { label: "DIS", value: "7" },
516
+ ]}
517
+ />
518
+ </>
519
+ ),
298
520
 
299
- ]}
300
- extend={
301
- <Button size="medium" color="primary" fill="outline">
302
- Start
303
- </Button>
304
- }
305
- ></CardV2>,
521
+ CardV2: (
522
+ <CardV2
523
+ type={type}
524
+ {...typePropsMap[type]}
525
+ // noPadding
306
526
 
307
- ScanV2: <ScanV2
308
- label="扫描"
309
- placeholder="请扫描"
310
- onScan={(value) => {
311
- console.log("scan value", value);
312
- }}
313
- ></ScanV2>,
527
+ dataSource={[
528
+ { label: "", value: "value", className: "high", display: false },
529
+ { label: "", value: "value", className: "highlight", display: false },
530
+ { label: "输入", value: <NumberPickerV2 /> },
531
+ { label: "输入", value: <InputV2 /> },
532
+ { label: "最多六个字符", value: "2022-09-08 12:00:00" },
533
+ { label: "最多六个字符123", value: "2022-09-08 12:00:00" },
534
+ { label: "入库单号", value: "17836397" },
535
+ { label: "渠道", value: "电商" },
536
+ {
537
+ label: "数量/总数",
538
+ value: "12/98",
539
+ type: "error",
540
+ tip: "实收数量少于应收数量，请仔细核对后再结束该入库订单",
541
+ },
542
+ // { label: "label", value: "value,valuevalue,valuevalue,value" },
543
+ // { label: "入库单号", value: "17836397", className: "tag" },
544
+ // { label: "渠道", value: "电商", className: "tag" },
545
+ // { label: "数量/总数", value: "12/98", className: "tag" },
546
+ // { label: "多次收货", value: "允许", className: "tag" },
547
+ ]}
548
+ extend={
549
+ <Button size="medium" color="primary" fill="outline">
550
+ Start
551
+ </Button>
552
+ }
553
+ ></CardV2>
554
+ ),
314
555
 
315
- ScanV2Only: <ScanV2
316
- label="只输入"
317
- placeholder="Input code"
318
- scanAllowed={false}
319
- onScan={(value) => {
320
- console.log("scan value", value);
321
- }}
322
- onChange={(value) => {
323
- console.log("change", value);
324
- }}
325
- noEnter={true}
326
- ></ScanV2>,
556
+ ScanV2Only: (
557
+ <ScanV2
558
+ label="只输入"
559
+ placeholder="Input code"
560
+ scanAllowed={false}
561
+ onScan={(value) => {
562
+ console.log("scan value", value);
563
+ }}
564
+ onChange={(value) => {
565
+ console.log("change", value);
566
+ }}
567
+ noEnter={true}
568
+ ></ScanV2>
569
+ ),
327
570
 
328
- ListV2: <><ListV2 header="可点击列表" className="body-card" style={{ '--pda-card-margin-bottom': 0 }}>
329
- <ListV2.Item onClick={() => {
330
- setShowToast(false);
331
- onNext("toast success");
332
- setTimeout(() => {
333
- setShowToast({
334
- title: 'toast',
335
- message: 'message',
336
- // message: <div style={{ backgroundColor: 'red', }}>message</div>,
337
- level: 'success',
338
- duration: 3000,
339
- });
340
- }, 300);
341
- }}>成功 Toast</ListV2.Item>
342
- <ListV2.Item onClick={() => {
343
- setShowToast(false);
344
- onNext("toast success");
345
- setTimeout(() => {
346
- setShowToast({
347
- title: 'toast',
348
- message: 'message',
349
- // message: <div style={{ backgroundColor: 'red', }}>message</div>,
350
- level: 'warning',
351
- duration: 3000,
352
- });
353
- }, 300);
354
- }}>警告 Toast</ListV2.Item>
355
- <ListV2.Item onClick={() => {
356
- setShowToast(false);
357
- onNext("toast error");
358
- setTimeout(() => {
359
- setShowToast({
360
- title: '异常',
361
- // title: <div style={{ backgroundColor: '#ffffff', color: '#000000' }}>title</div>,
362
- message: <div style={{ backgroundColor: 'red', }}>message</div>,
363
- message: 'message',
364
- message: [{ label: '入库单号', value: '73683638' }, { label: '入库数量', value: '22' }],
365
- level: 'error',
366
- duration: 500000,
367
- });
368
- }, 300);
369
- }}>错误 Toast</ListV2.Item>
370
- <ListV2.Item onClick={() => {
371
- onNext("alert");
372
- setShowAlert({
373
- title: <div style={{ backgroundColor: '#ffffff', color: '#000000' }}>title</div>,
374
- message: <div >message</div>,
375
- message: [{ label: '入库单号', value: '73683638' }, { label: '入库数量', value: '22' }],
376
- // message: <div style={{ backgroundColor: 'red', }}>message</div>,
377
- okText: '点击确认',
378
- });
379
- }}>alert</ListV2.Item>
380
- <ListV2.Item onClick={() => {
381
- onNext("confirm");
382
- setShowConfirm({
383
- title: '确认移动？',
384
- message: 'message',
385
- message: [{ label: '入库单号', value: '73683638' }, { label: '入库数量', value: '22' }],
386
- // message: <div style={{ backgroundColor: 'red', }}>message</div>,
387
- okText: '确认',
388
- cancelText: '取消',
389
- okButtonType: 'error'
390
- });
391
- }}>confirm</ListV2.Item>
392
- <ListV2.Item onClick={() => {
393
- onNext("prompt");
394
- setShowPrompt({
395
- title: '输入下架数量',
396
- placeholder: '输入下架数量',
397
- inputTip: '这里是输入提示',
398
- defaultValue: 2,
399
- okText: '确认',
400
- cancelText: '取消',
401
- })
402
- }}>prompt</ListV2.Item>
403
- <ListV2.Item onClick={() => {
404
- onNext("popup table");
405
- setShowPopup({
406
- columns: [
407
- { title: '序号', dataIndex: 'a', },
408
- { title: 'SN', dataIndex: 'b', },
409
- { title: '状态', dataIndex: 'c', },
410
- ],
411
- dataSource: [
412
- { a: '1', b: '1234', c: '待扫' },
413
- { a: '2', b: '234', c: '待扫' },
414
- { a: '3', b: '444', c: '待扫' },
415
- { a: 'a2', b: '442', c: '待扫' },
416
- { a: 'a2', b: '2323', c: '待扫' },
417
- // { a: 'a2', b: 'b2' },
418
- // { a: 'a2', b: 'b2' },
419
- // { a: 'a2', b: 'b2' },
420
- // { a: 'a2', b: 'b2' },
421
- // { a: 'a2', b: 'b2' },
422
- // { a: 'a2', b: 'b2' },
423
- // { a: 'a2', b: 'b2' },
424
- // { a: 'a2', b: 'b2' },
425
- // { a: 'a2', b: 'b2' },
426
- // { a: 'a2', b: 'b2' },
427
- // { a: 'a2', b: 'b2' },
428
- // { a: 'a2', b: 'b2' },
429
- // { a: 'a2', b: 'b2' },
430
- // { a: 'a2', b: 'b2' },
431
- // { a: 'a2', b: 'b2' },
432
- { a: 'a2', b: 'b4' },
433
- ],
434
- })
435
- }}>Popup Table</ListV2.Item>
436
- {/* <ListV2.Item ><CardV2 type={'tip'} {...typePropsMap[type]} ></CardV2></ListV2.Item>
571
+ ListV2: (
572
+ <>
573
+ <ListV2
574
+ header="可点击列表"
575
+ className="body-card"
576
+ style={{ "--pda-card-margin-bottom": 0 }}
577
+ >
578
+ <ListV2.Item
579
+ onClick={() => {
580
+ setShowToast(false);
581
+ onNext("toast success");
582
+ setTimeout(() => {
583
+ setShowToast({
584
+ title: "toast",
585
+ message: "message",
586
+ // message: <div style={{ backgroundColor: 'red', }}>message</div>,
587
+ level: "success",
588
+ duration: 3000,
589
+ });
590
+ }, 300);
591
+ }}
592
+ >
593
+ 成功 Toast
594
+ </ListV2.Item>
595
+ <ListV2.Item
596
+ onClick={() => {
597
+ setShowToast(false);
598
+ onNext("toast success");
599
+ setTimeout(() => {
600
+ setShowToast({
601
+ title: "toast",
602
+ message: "message",
603
+ // message: <div style={{ backgroundColor: 'red', }}>message</div>,
604
+ level: "warning",
605
+ duration: 3000,
606
+ });
607
+ }, 300);
608
+ }}
609
+ >
610
+ 警告 Toast
611
+ </ListV2.Item>
612
+ <ListV2.Item
613
+ onClick={() => {
614
+ setShowToast(false);
615
+ onNext("toast error");
616
+ setTimeout(() => {
617
+ setShowToast({
618
+ title: "异常",
619
+ // title: <div style={{ backgroundColor: '#ffffff', color: '#000000' }}>title</div>,
620
+ message: (
621
+ <div style={{ backgroundColor: "red" }}>message</div>
622
+ ),
623
+ message: "message",
624
+ message: [
625
+ { label: "入库单号", value: "73683638" },
626
+ { label: "入库数量", value: "22" },
627
+ ],
628
+ level: "error",
629
+ duration: 500000,
630
+ });
631
+ }, 300);
632
+ }}
633
+ >
634
+ 错误 Toast
635
+ </ListV2.Item>
636
+ <ListV2.Item
637
+ onClick={() => {
638
+ onNext("alert");
639
+ setShowAlert({
640
+ title: (
641
+ <div style={{ backgroundColor: "#ffffff", color: "#000000" }}>
642
+ title
643
+ </div>
644
+ ),
645
+ message: <div>message</div>,
646
+ message: [
647
+ { label: "入库单号", value: "73683638" },
648
+ { label: "入库数量", value: "22" },
649
+ ],
650
+ // message: <div style={{ backgroundColor: 'red', }}>message</div>,
651
+ okText: "点击确认",
652
+ });
653
+ }}
654
+ >
655
+ alert
656
+ </ListV2.Item>
657
+ <ListV2.Item
658
+ onClick={() => {
659
+ onNext("confirm");
660
+ setShowConfirm({
661
+ title: "确认移动？",
662
+ message: "message",
663
+ message: [
664
+ { label: "入库单号", value: "73683638" },
665
+ { label: "入库数量", value: "22" },
666
+ ],
667
+ // message: <div style={{ backgroundColor: 'red', }}>message</div>,
668
+ okText: "确认",
669
+ cancelText: "取消",
670
+ okButtonType: "error",
671
+ });
672
+ }}
673
+ >
674
+ confirm
675
+ </ListV2.Item>
676
+ <ListV2.Item
677
+ onClick={() => {
678
+ onNext("prompt");
679
+ setShowPrompt({
680
+ title: "输入下架数量",
681
+ placeholder: "输入下架数量",
682
+ inputTip: "这里是输入提示",
683
+ defaultValue: 2,
684
+ okText: "确认",
685
+ cancelText: "取消",
686
+ });
687
+ }}
688
+ >
689
+ prompt
690
+ </ListV2.Item>
691
+ <ListV2.Item
692
+ onClick={() => {
693
+ onNext("popup table");
694
+ setShowPopup({
695
+ columns: [
696
+ { title: "序号", dataIndex: "a" },
697
+ { title: "SN", dataIndex: "b" },
698
+ { title: "状态", dataIndex: "c" },
699
+ ],
700
+ dataSource: [
701
+ { a: "1", b: "1234", c: "待扫" },
702
+ { a: "2", b: "234", c: "待扫" },
703
+ { a: "3", b: "444", c: "待扫" },
704
+ { a: "a2", b: "442", c: "待扫" },
705
+ { a: "a2", b: "2323", c: "待扫" },
706
+ // { a: 'a2', b: 'b2' },
707
+ // { a: 'a2', b: 'b2' },
708
+ // { a: 'a2', b: 'b2' },
709
+ // { a: 'a2', b: 'b2' },
710
+ // { a: 'a2', b: 'b2' },
711
+ // { a: 'a2', b: 'b2' },
712
+ // { a: 'a2', b: 'b2' },
713
+ // { a: 'a2', b: 'b2' },
714
+ // { a: 'a2', b: 'b2' },
715
+ // { a: 'a2', b: 'b2' },
716
+ // { a: 'a2', b: 'b2' },
717
+ // { a: 'a2', b: 'b2' },
718
+ // { a: 'a2', b: 'b2' },
719
+ // { a: 'a2', b: 'b2' },
720
+ // { a: 'a2', b: 'b2' },
721
+ { a: "a2", b: "b4" },
722
+ ],
723
+ });
724
+ }}
725
+ >
726
+ Popup Table
727
+ </ListV2.Item>
728
+ {/* <ListV2.Item ><CardV2 type={'tip'} {...typePropsMap[type]} ></CardV2></ListV2.Item>
437
729
  <ListV2.Item><CardV2 type={'tip'} {...typePropsMap[type]} ></CardV2></ListV2.Item>
438
730
  <ListV2.Item><CardV2 type={'tip'} {...typePropsMap[type]} ></CardV2></ListV2.Item> */}
439
- </ListV2>
440
- <CardV2 type={'tip'} {...typePropsMap.tip} ></CardV2>
441
- <CardV2 type={'tip'} {...typePropsMap.tip} ></CardV2>
442
- <CardV2 type={'tip'} {...typePropsMap.tip} ></CardV2>
443
- </>
444
- ,
445
-
731
+ </ListV2>
732
+ <CardV2 type={"tip"} {...typePropsMap.tip}></CardV2>
733
+ <CardV2 type={"tip"} {...typePropsMap.tip}></CardV2>
734
+ <CardV2 type={"tip"} {...typePropsMap.tip}></CardV2>
735
+ </>
736
+ ),
446
737
  IllustrationV2: <IllustrationV2 />,
447
738
 
448
- TaskCardV2: <TaskCardV2
449
- data={{
450
- title: "Trip ID.",
451
- content: "TK2021012700002",
452
- tags: [
453
- { label: "SKU", value: "6" },
454
- // { label: "QTY", value: "2" },
455
- // { label: "QTY1", value: "2" },
456
- // { label: "SKU", value: "6/7" },
457
- // { label: "QTY", value: "2/2" },
458
- ],
459
- progress: {
460
- desc: "MLP progress",
461
- current: "1",
462
- total: 10,
463
- },
464
- }}
465
- ></TaskCardV2>,
739
+ TaskCardV2: (
740
+ <TaskCardV2
741
+ data={{
742
+ title: "Trip ID.",
743
+ content: "TK2021012700002",
744
+ tags: [
745
+ { label: "SKU", value: "6" },
746
+ // { label: "QTY", value: "2" },
747
+ // { label: "QTY1", value: "2" },
748
+ // { label: "SKU", value: "6/7" },
749
+ // { label: "QTY", value: "2/2" },
750
+ ],
751
+ progress: {
752
+ desc: "MLP progress",
753
+ current: "1",
754
+ total: 10,
755
+ },
756
+ }}
757
+ ></TaskCardV2>
758
+ ),
466
759
 
467
- TaskInputV2: <TaskInputV2
468
- label="只输入"
469
- placeholder="Input code"
470
- scanAllowd={false}
471
- onChange={(value) => {
472
- console.log("scan value", value);
473
- }}
474
- decimal={3}
475
- // unit={'EA'}
476
- // max={5}
477
- // min={1}
478
- ></TaskInputV2>,
760
+ TaskInputV2: (
761
+ <TaskInputV2
762
+ label="只输入"
763
+ placeholder="Input code"
764
+ scanAllowd={false}
765
+ onChange={(value) => {
766
+ console.log("scan value", value);
767
+ }}
768
+ decimal={3}
769
+ // unit={'EA'}
770
+ // max={5}
771
+ // min={1}
772
+ ></TaskInputV2>
773
+ ),
479
774
 
480
- MenuListV2: <MenuListV2
481
- dataSource={[
482
- {
483
- label: "Assigned packing tasks",
484
- value: 10,
485
- key: "assigned",
486
- backgroundColor: "#5dc8a6",
487
- img: "https://img.alicdn.com/imgextra/i3/O1CN01UiB43o1HEYTkJDkGW_!!6000000000726-2-tps-124-128.png",
488
- },
489
- {
490
- label: "Available Packing Tasks",
491
- value: 20,
492
- key: "available",
493
- backgroundColor: "#4c80f8",
494
- img: "https://img.alicdn.com/imgextra/i2/O1CN013UzJVm262gcLeDKjQ_!!6000000007604-2-tps-118-128.png",
495
- },
496
- ]}
497
- onSelect={console.log}
498
- ></MenuListV2>,
775
+ MenuListV2: (
776
+ <MenuListV2
777
+ dataSource={[
778
+ {
779
+ label: "Assigned packing tasks",
780
+ value: 10,
781
+ key: "assigned",
782
+ backgroundColor: "#5dc8a6",
783
+ img: "https://img.alicdn.com/imgextra/i3/O1CN01UiB43o1HEYTkJDkGW_!!6000000000726-2-tps-124-128.png",
784
+ },
785
+ {
786
+ label: "Available Packing Tasks",
787
+ value: 20,
788
+ key: "available",
789
+ backgroundColor: "#4c80f8",
790
+ img: "https://img.alicdn.com/imgextra/i2/O1CN013UzJVm262gcLeDKjQ_!!6000000007604-2-tps-118-128.png",
791
+ },
792
+ ]}
793
+ onSelect={console.log}
794
+ ></MenuListV2>
795
+ ),
499
796
 
500
- FooterV2: <FooterV2>
501
- <ButtonV2.Group>
502
- <ButtonV2 type='primary' text fullWidth onClick={() => { console.log(`primary button click===`); }}>提交</ButtonV2>
503
- <ButtonV2 fullWidth onClick={() => { console.log(`primary button click===`); }}>取消</ButtonV2>
504
- <ButtonV2 type='warning' fullWidth onClick={() => { console.log(`warning button click===`); }}>warning</ButtonV2>
505
- <ButtonV2 type='secondary' fullWidth onClick={() => { console.log(`secondary button click===`); }}>secondary</ButtonV2>
506
- </ButtonV2.Group>
507
- </FooterV2>,
508
- }
797
+ FooterV2: (
798
+ <FooterV2>
799
+ <ButtonV2.Group>
800
+ <ButtonV2
801
+ type="primary"
802
+ text
803
+ fullWidth
804
+ onClick={() => {
805
+ console.log(`primary button click===`);
806
+ }}
807
+ >
808
+ 提交
809
+ </ButtonV2>
810
+ <ButtonV2
811
+ fullWidth
812
+ onClick={() => {
813
+ console.log(`primary button click===`);
814
+ }}
815
+ >
816
+ 取消
817
+ </ButtonV2>
818
+ <ButtonV2
819
+ type="warning"
820
+ fullWidth
821
+ onClick={() => {
822
+ console.log(`warning button click===`);
823
+ }}
824
+ >
825
+ warning
826
+ </ButtonV2>
827
+ <ButtonV2
828
+ type="secondary"
829
+ fullWidth
830
+ onClick={() => {
831
+ console.log(`secondary button click===`);
832
+ console.log(`val:======`, val);
833
+ }}
834
+ >
835
+ secondary
836
+ </ButtonV2>
837
+ </ButtonV2.Group>
838
+ </FooterV2>
839
+ ),
840
+ };
509
841
 
510
842
  return (
511
843
  <div className="debug-father-container">
512
- <LayoutV2 style={{ display: showMap['LayoutV2'] ? undefined : 'none' }}>
513
- {
514
- Object.entries(components).map(([key, value]) => {
515
- return showMap[key] ? value : null;
516
- })
517
- }
518
- </LayoutV2 >
519
- <div style={{ display: showMap['FinishCardV2'] ? undefined : 'none' }}>
844
+ <LayoutV2 style={{ display: showMap["LayoutV2"] ? undefined : "none" }}>
845
+ {Object.entries(components).map(([key, value]) => {
846
+ return showMap[key] ? value : null;
847
+ })}
848
+ </LayoutV2>
849
+ <div style={{ display: showMap["FinishCardV2"] ? undefined : "none" }}>
520
850
  <FinishCardV2
521
- title={'收货完成!'}
522
- okText={'返回'}
523
- cancelText={'取消'}
524
- infoTitle={'入库单号：12838383'}
851
+ title={"收货完成!"}
852
+ okText={"返回"}
853
+ cancelText={"取消"}
854
+ infoTitle={"入库单号：12838383"}
525
855
  infoList={[
526
856
  {
527
- label: '入库单号',
528
- value: '7788038939',
857
+ label: "入库单号",
858
+ value: "7788038939",
529
859
  },
530
860
  {
531
- label: 'SKU',
861
+ label: "SKU",
532
862
  value: 30,
533
863
  },
534
864
  {
535
- label: '数量',
536
- value: '200 件',
865
+ label: "数量",
866
+ value: "200 件",
537
867
  },
538
868
  ]}
539
869
  />
540
870
  </div>
541
- {
542
- showToast && <PageFlowSystemPagesV2.Toast data={showToast}
543
- onNext={() => { onNext(); }}
871
+ {showToast && (
872
+ <PageFlowSystemPagesV2.Toast
873
+ data={showToast}
874
+ onNext={() => {
875
+ onNext();
876
+ }}
544
877
  />
545
- }
546
- {
547
- showAlert && <PageFlowSystemPagesV2.Alert data={showAlert}
548
- onNext={() => { onNext(); setShowAlert(false) }}
878
+ )}
879
+ {showAlert && (
880
+ <PageFlowSystemPagesV2.Alert
881
+ data={showAlert}
882
+ onNext={() => {
883
+ onNext();
884
+ setShowAlert(false);
885
+ }}
549
886
  />
550
- }
551
- {
552
- showConfirm && <PageFlowSystemPagesV2.Confirm data={showConfirm}
553
- onNext={() => { onNext(); setShowConfirm(false) }} />
554
- }
555
- {
556
- showPrompt && <PageFlowSystemPagesV2.Prompt data={showPrompt}
557
- onNext={() => { onNext(); setShowPrompt(false) }}
887
+ )}
888
+ {showConfirm && (
889
+ <PageFlowSystemPagesV2.Confirm
890
+ data={showConfirm}
891
+ onNext={() => {
892
+ onNext();
893
+ setShowConfirm(false);
894
+ }}
558
895
  />
559
- }
560
- {
561
- showPopup && <PopupV2>
896
+ )}
897
+ {showPrompt && (
898
+ <PageFlowSystemPagesV2.Prompt
899
+ data={showPrompt}
900
+ onNext={() => {
901
+ onNext();
902
+ setShowPrompt(false);
903
+ }}
904
+ />
905
+ )}
906
+ {showPopup && (
907
+ <PopupV2>
562
908
  <TableV2 {...(showPopup || {})} />
563
909
  </PopupV2>
564
- }
565
- </div >
910
+ )}
911
+ </div>
566
912
  );
567
- }
913
+ }