@bit-sun/business-component 1.1.11 → 1.1.14

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.
package/dist/index.esm.js CHANGED
@@ -1738,10 +1738,14 @@ var DataValidation = /*#__PURE__*/function (_React$Component) {
1738
1738
  cell.m = cell.v = cell.m.trim();
1739
1739
  }
1740
1740
 
1741
- if (typeof cell.v === 'number') {
1741
+ if (cell && cell.m && cell.m.indexOf('E+') !== -1) {
1742
1742
  cell.v = cell.v.toString();
1743
1743
  cell.m = cell.v;
1744
1744
  }
1745
+
1746
+ if (typeof cell.v === 'number') {
1747
+ cell.v = cell.m;
1748
+ }
1745
1749
  } // console.log(postion);
1746
1750
 
1747
1751
  },
@@ -2645,6 +2649,7 @@ var SearchSelect = function SearchSelect(props) {
2645
2649
  if (type === 1) {
2646
2650
  var _ctx$form;
2647
2651
 
2652
+ console.log(sourceName, 'sourceName');
2648
2653
  ctx === null || ctx === void 0 ? void 0 : (_ctx$form = ctx.form) === null || _ctx$form === void 0 ? void 0 : _ctx$form.setFieldSource(sourceName, source);
2649
2654
  setItems(source);
2650
2655
  setItemsTotal(Number(res === null || res === void 0 ? void 0 : res.total));
@@ -3522,6 +3527,142 @@ function commonFun(type, prefixUrl) {
3522
3527
  };
3523
3528
  } // 仓库选择器
3524
3529
 
3530
+
3531
+ if (type === 'physicalWarehouse') {
3532
+ requestConfig = {
3533
+ url: "".concat(prefixUrl.selectPrefix, "/physicalWarehouse"),
3534
+ filter: 'qp-nameAndCode-like',
3535
+ mappingTextField: 'physicalWarehouseName',
3536
+ mappingValueField: 'id',
3537
+ otherParams: {
3538
+ sorter: 'desc-id'
3539
+ },
3540
+ sourceName: 'warehouseIds'
3541
+ };
3542
+ tableSearchForm = [{
3543
+ name: 'qp-physicalWarehouseName-like',
3544
+ label: '物理仓名称'
3545
+ }, {
3546
+ name: 'qp-physicalWarehouseCode-like',
3547
+ label: '物理仓编码'
3548
+ }, {
3549
+ name: 'qp-physicalWarehouseType-eq',
3550
+ type: 'select',
3551
+ label: '物理仓类型',
3552
+ initialSource: getDictionarySource('SC00002')
3553
+ }, {
3554
+ name: 'qp-companyCode-eq',
3555
+ type: 'select',
3556
+ label: '所属公司',
3557
+ field: {
3558
+ type: 'select',
3559
+ props: {
3560
+ mode: 'multiple',
3561
+ notFoundContent: '暂无数据',
3562
+ allowClear: true,
3563
+ showSearch: true,
3564
+ showArrow: true,
3565
+ maxTagCount: 1,
3566
+ optionFilterProp: 'children',
3567
+ filterOption: function filterOption(input, option) {
3568
+ return option.props.children.toLowerCase().indexOf(input.toLowerCase()) >= 0;
3569
+ }
3570
+ }
3571
+ }
3572
+ }, {
3573
+ name: 'qp-isEnable-eq',
3574
+ type: 'select',
3575
+ label: '物理仓状态',
3576
+ initialSource: getDictionarySource('SC00001')
3577
+ }];
3578
+ Promise.all([loadSelectSource("".concat(prefixUrl.formSelectFix, "/company"), {
3579
+ pageSize: 5000,
3580
+ currentPage: 1,
3581
+ 'qp-companyType-eq': 20
3582
+ })]).then(function (x) {
3583
+ formatSource(x, 0, 3, tableSearchForm);
3584
+ });
3585
+ modalTableProps = {
3586
+ modalTableTitle: '选择物理仓',
3587
+ tableSearchForm: tableSearchForm,
3588
+ tableColumns: [{
3589
+ title: '物理仓编码',
3590
+ dataIndex: 'physicalWarehouseCode'
3591
+ }, {
3592
+ title: '物理仓名称',
3593
+ dataIndex: 'physicalWarehouseName'
3594
+ }, {
3595
+ title: '物理仓类型',
3596
+ dataIndex: 'physicalWarehouseType',
3597
+ render: function render(text) {
3598
+ return getDictionaryTextByValue('SC00002', text);
3599
+ }
3600
+ }, {
3601
+ title: '物理仓状态',
3602
+ dataIndex: 'isEnable',
3603
+ render: function render(text) {
3604
+ return getDictionaryTextByValue('SC00001', text);
3605
+ }
3606
+ }, {
3607
+ title: '所属公司',
3608
+ dataIndex: 'companyName'
3609
+ }]
3610
+ };
3611
+ }
3612
+
3613
+ if (type === 'realWarehouse') {
3614
+ requestConfig = {
3615
+ url: "".concat(prefixUrl.selectPrefix, "/realWarehouse"),
3616
+ filter: 'qp-nameAndCode-like',
3617
+ mappingTextField: 'realWarehouseName',
3618
+ mappingValueField: 'id',
3619
+ otherParams: {
3620
+ sorter: 'desc-id'
3621
+ },
3622
+ sourceName: 'warehouseIds'
3623
+ };
3624
+ tableSearchForm = [{
3625
+ name: 'qp-realWarehouseName-like',
3626
+ label: '逻辑仓名称'
3627
+ }, {
3628
+ name: 'qp-realWarehouseCode-like',
3629
+ label: '逻辑仓编码'
3630
+ }, {
3631
+ name: 'qp-realWarehouseType-eq',
3632
+ type: 'select',
3633
+ label: '逻辑仓类型',
3634
+ initialSource: getDictionarySource('SC00004')
3635
+ }, {
3636
+ name: 'qp-isEnable-eq',
3637
+ type: 'select',
3638
+ label: '逻辑仓状态',
3639
+ initialSource: getDictionarySource('SC00001')
3640
+ }];
3641
+ modalTableProps = {
3642
+ modalTableTitle: '选择逻辑仓',
3643
+ tableSearchForm: tableSearchForm,
3644
+ tableColumns: [{
3645
+ title: '逻辑仓编码',
3646
+ dataIndex: 'realWarehouseCode'
3647
+ }, {
3648
+ title: '逻辑仓名称',
3649
+ dataIndex: 'realWarehouseName'
3650
+ }, {
3651
+ title: '逻辑仓类型',
3652
+ dataIndex: 'realWarehouseType',
3653
+ render: function render(text) {
3654
+ return getDictionaryTextByValue('SC00004', text);
3655
+ }
3656
+ }, {
3657
+ title: '逻辑仓状态',
3658
+ dataIndex: 'isEnable',
3659
+ render: function render(text) {
3660
+ return getDictionaryTextByValue('SC00001', text);
3661
+ }
3662
+ }]
3663
+ };
3664
+ }
3665
+
3525
3666
  return {
3526
3667
  modalTableProps: modalTableProps,
3527
3668
  requestConfig: requestConfig
package/dist/index.js CHANGED
@@ -1749,10 +1749,14 @@ var DataValidation = /*#__PURE__*/function (_React$Component) {
1749
1749
  cell.m = cell.v = cell.m.trim();
1750
1750
  }
1751
1751
 
1752
- if (typeof cell.v === 'number') {
1752
+ if (cell && cell.m && cell.m.indexOf('E+') !== -1) {
1753
1753
  cell.v = cell.v.toString();
1754
1754
  cell.m = cell.v;
1755
1755
  }
1756
+
1757
+ if (typeof cell.v === 'number') {
1758
+ cell.v = cell.m;
1759
+ }
1756
1760
  } // console.log(postion);
1757
1761
 
1758
1762
  },
@@ -2656,6 +2660,7 @@ var SearchSelect = function SearchSelect(props) {
2656
2660
  if (type === 1) {
2657
2661
  var _ctx$form;
2658
2662
 
2663
+ console.log(sourceName, 'sourceName');
2659
2664
  ctx === null || ctx === void 0 ? void 0 : (_ctx$form = ctx.form) === null || _ctx$form === void 0 ? void 0 : _ctx$form.setFieldSource(sourceName, source);
2660
2665
  setItems(source);
2661
2666
  setItemsTotal(Number(res === null || res === void 0 ? void 0 : res.total));
@@ -3533,6 +3538,142 @@ function commonFun(type, prefixUrl) {
3533
3538
  };
3534
3539
  } // 仓库选择器
3535
3540
 
3541
+
3542
+ if (type === 'physicalWarehouse') {
3543
+ requestConfig = {
3544
+ url: "".concat(prefixUrl.selectPrefix, "/physicalWarehouse"),
3545
+ filter: 'qp-nameAndCode-like',
3546
+ mappingTextField: 'physicalWarehouseName',
3547
+ mappingValueField: 'id',
3548
+ otherParams: {
3549
+ sorter: 'desc-id'
3550
+ },
3551
+ sourceName: 'warehouseIds'
3552
+ };
3553
+ tableSearchForm = [{
3554
+ name: 'qp-physicalWarehouseName-like',
3555
+ label: '物理仓名称'
3556
+ }, {
3557
+ name: 'qp-physicalWarehouseCode-like',
3558
+ label: '物理仓编码'
3559
+ }, {
3560
+ name: 'qp-physicalWarehouseType-eq',
3561
+ type: 'select',
3562
+ label: '物理仓类型',
3563
+ initialSource: getDictionarySource('SC00002')
3564
+ }, {
3565
+ name: 'qp-companyCode-eq',
3566
+ type: 'select',
3567
+ label: '所属公司',
3568
+ field: {
3569
+ type: 'select',
3570
+ props: {
3571
+ mode: 'multiple',
3572
+ notFoundContent: '暂无数据',
3573
+ allowClear: true,
3574
+ showSearch: true,
3575
+ showArrow: true,
3576
+ maxTagCount: 1,
3577
+ optionFilterProp: 'children',
3578
+ filterOption: function filterOption(input, option) {
3579
+ return option.props.children.toLowerCase().indexOf(input.toLowerCase()) >= 0;
3580
+ }
3581
+ }
3582
+ }
3583
+ }, {
3584
+ name: 'qp-isEnable-eq',
3585
+ type: 'select',
3586
+ label: '物理仓状态',
3587
+ initialSource: getDictionarySource('SC00001')
3588
+ }];
3589
+ Promise.all([loadSelectSource("".concat(prefixUrl.formSelectFix, "/company"), {
3590
+ pageSize: 5000,
3591
+ currentPage: 1,
3592
+ 'qp-companyType-eq': 20
3593
+ })]).then(function (x) {
3594
+ formatSource(x, 0, 3, tableSearchForm);
3595
+ });
3596
+ modalTableProps = {
3597
+ modalTableTitle: '选择物理仓',
3598
+ tableSearchForm: tableSearchForm,
3599
+ tableColumns: [{
3600
+ title: '物理仓编码',
3601
+ dataIndex: 'physicalWarehouseCode'
3602
+ }, {
3603
+ title: '物理仓名称',
3604
+ dataIndex: 'physicalWarehouseName'
3605
+ }, {
3606
+ title: '物理仓类型',
3607
+ dataIndex: 'physicalWarehouseType',
3608
+ render: function render(text) {
3609
+ return getDictionaryTextByValue('SC00002', text);
3610
+ }
3611
+ }, {
3612
+ title: '物理仓状态',
3613
+ dataIndex: 'isEnable',
3614
+ render: function render(text) {
3615
+ return getDictionaryTextByValue('SC00001', text);
3616
+ }
3617
+ }, {
3618
+ title: '所属公司',
3619
+ dataIndex: 'companyName'
3620
+ }]
3621
+ };
3622
+ }
3623
+
3624
+ if (type === 'realWarehouse') {
3625
+ requestConfig = {
3626
+ url: "".concat(prefixUrl.selectPrefix, "/realWarehouse"),
3627
+ filter: 'qp-nameAndCode-like',
3628
+ mappingTextField: 'realWarehouseName',
3629
+ mappingValueField: 'id',
3630
+ otherParams: {
3631
+ sorter: 'desc-id'
3632
+ },
3633
+ sourceName: 'warehouseIds'
3634
+ };
3635
+ tableSearchForm = [{
3636
+ name: 'qp-realWarehouseName-like',
3637
+ label: '逻辑仓名称'
3638
+ }, {
3639
+ name: 'qp-realWarehouseCode-like',
3640
+ label: '逻辑仓编码'
3641
+ }, {
3642
+ name: 'qp-realWarehouseType-eq',
3643
+ type: 'select',
3644
+ label: '逻辑仓类型',
3645
+ initialSource: getDictionarySource('SC00004')
3646
+ }, {
3647
+ name: 'qp-isEnable-eq',
3648
+ type: 'select',
3649
+ label: '逻辑仓状态',
3650
+ initialSource: getDictionarySource('SC00001')
3651
+ }];
3652
+ modalTableProps = {
3653
+ modalTableTitle: '选择逻辑仓',
3654
+ tableSearchForm: tableSearchForm,
3655
+ tableColumns: [{
3656
+ title: '逻辑仓编码',
3657
+ dataIndex: 'realWarehouseCode'
3658
+ }, {
3659
+ title: '逻辑仓名称',
3660
+ dataIndex: 'realWarehouseName'
3661
+ }, {
3662
+ title: '逻辑仓类型',
3663
+ dataIndex: 'realWarehouseType',
3664
+ render: function render(text) {
3665
+ return getDictionaryTextByValue('SC00004', text);
3666
+ }
3667
+ }, {
3668
+ title: '逻辑仓状态',
3669
+ dataIndex: 'isEnable',
3670
+ render: function render(text) {
3671
+ return getDictionaryTextByValue('SC00001', text);
3672
+ }
3673
+ }]
3674
+ };
3675
+ }
3676
+
3536
3677
  return {
3537
3678
  modalTableProps: modalTableProps,
3538
3679
  requestConfig: requestConfig
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@bit-sun/business-component",
3
- "version": "1.1.11",
3
+ "version": "1.1.14",
4
4
  "scripts": {
5
5
  "start": "dumi dev",
6
6
  "docs:build": "dumi build",
@@ -174,13 +174,17 @@ class DataValidation extends React.Component {
174
174
  if (cell) {
175
175
  cell.fs = 10;
176
176
 
177
+
177
178
  if (typeof cell.v === 'string') {
178
179
  cell.m = cell.v = cell.m.trim();
179
180
  }
180
- if (typeof cell.v === 'number') {
181
+ if (cell && cell.m && cell.m.indexOf('E+') !== -1) {
181
182
  cell.v = cell.v.toString()
182
183
  cell.m = cell.v
183
184
  }
185
+ if (typeof cell.v === 'number') {
186
+ cell.v = cell.m
187
+ }
184
188
  }
185
189
  // console.log(postion);
186
190
  },
@@ -346,10 +346,117 @@ export function commonFun (type?: string, prefixUrl: any) {
346
346
  }
347
347
 
348
348
  // 仓库选择器
349
- if(type === 'warehouse') {
350
-
349
+ if(type === 'physicalWarehouse') {
350
+ requestConfig = {
351
+ url: `${prefixUrl.selectPrefix}/physicalWarehouse`,
352
+ filter: 'qp-nameAndCode-like', // 过滤参数
353
+ mappingTextField: 'physicalWarehouseName',
354
+ mappingValueField: 'id',
355
+ otherParams: {
356
+ sorter: 'desc-id'
357
+ }, // 默认参数
358
+ sourceName: 'warehouseIds',
359
+ }
360
+ tableSearchForm = [
361
+ { name: 'qp-physicalWarehouseName-like', label: '物理仓名称' },
362
+ { name: 'qp-physicalWarehouseCode-like', label: '物理仓编码' },
363
+ { name: 'qp-physicalWarehouseType-eq', type: 'select', label: '物理仓类型', initialSource: getDictionarySource('SC00002') },
364
+ { name: 'qp-companyCode-eq', type: 'select', label: '所属公司', field: {
365
+ type: 'select',
366
+ props: {
367
+ mode: 'multiple',
368
+ notFoundContent: '暂无数据',
369
+ allowClear: true,
370
+ showSearch: true,
371
+ showArrow: true,
372
+ maxTagCount: 1,
373
+ optionFilterProp: 'children',
374
+ filterOption: (input: string, option: { props: { children: string } }) =>
375
+ option.props.children.toLowerCase().indexOf(input.toLowerCase()) >= 0,
376
+ },
377
+ } },
378
+ { name: 'qp-isEnable-eq', type: 'select', label: '物理仓状态', initialSource: getDictionarySource('SC00001') },
379
+ ]
380
+ Promise.all([
381
+ loadSelectSource(`${prefixUrl.formSelectFix}/company`, {
382
+ pageSize: 5000,
383
+ currentPage: 1,
384
+ 'qp-companyType-eq': 20,
385
+ }),
386
+ ]).then((x: any)=>{
387
+ formatSource(x,0, 3, tableSearchForm);
388
+ })
389
+ modalTableProps = {
390
+ modalTableTitle: '选择物理仓',
391
+ tableSearchForm,
392
+ tableColumns: [
393
+ {
394
+ title: '物理仓编码',
395
+ dataIndex: 'physicalWarehouseCode',
396
+ },
397
+ {
398
+ title: '物理仓名称',
399
+ dataIndex: 'physicalWarehouseName',
400
+ },
401
+ {
402
+ title: '物理仓类型',
403
+ dataIndex: 'physicalWarehouseType',
404
+ render: (text: number) => getDictionaryTextByValue('SC00002', text),
405
+ },
406
+ {
407
+ title: '物理仓状态',
408
+ dataIndex: 'isEnable',
409
+ render: (text: number) => getDictionaryTextByValue('SC00001', text),
410
+ },
411
+ {
412
+ title: '所属公司',
413
+ dataIndex: 'companyName',
414
+ },
415
+ ]
416
+ }
417
+ }
418
+ if(type === 'realWarehouse') {
419
+ requestConfig = {
420
+ url: `${prefixUrl.selectPrefix}/realWarehouse`,
421
+ filter: 'qp-nameAndCode-like', // 过滤参数
422
+ mappingTextField: 'realWarehouseName',
423
+ mappingValueField: 'id',
424
+ otherParams: {
425
+ sorter: 'desc-id'
426
+ }, // 默认参数
427
+ sourceName: 'warehouseIds',
428
+ }
429
+ tableSearchForm = [
430
+ { name: 'qp-realWarehouseName-like', label: '逻辑仓名称' },
431
+ { name: 'qp-realWarehouseCode-like', label: '逻辑仓编码' },
432
+ { name: 'qp-realWarehouseType-eq', type: 'select', label: '逻辑仓类型', initialSource: getDictionarySource('SC00004') },
433
+ { name: 'qp-isEnable-eq', type: 'select', label: '逻辑仓状态', initialSource: getDictionarySource('SC00001') },
434
+ ]
435
+ modalTableProps = {
436
+ modalTableTitle: '选择逻辑仓',
437
+ tableSearchForm,
438
+ tableColumns: [
439
+ {
440
+ title: '逻辑仓编码',
441
+ dataIndex: 'realWarehouseCode',
442
+ },
443
+ {
444
+ title: '逻辑仓名称',
445
+ dataIndex: 'realWarehouseName',
446
+ },
447
+ {
448
+ title: '逻辑仓类型',
449
+ dataIndex: 'realWarehouseType',
450
+ render: (text: number) => getDictionaryTextByValue('SC00004', text),
451
+ },
452
+ {
453
+ title: '逻辑仓状态',
454
+ dataIndex: 'isEnable',
455
+ render: (text: number) => getDictionaryTextByValue('SC00001', text),
456
+ },
457
+ ]
458
+ }
351
459
  }
352
460
 
353
- console.log(requestConfig, 'requestConfig')
354
461
  return { modalTableProps, requestConfig };
355
462
  }
@@ -36,7 +36,7 @@ export default () => {
36
36
  // mappingTextField: 'name',
37
37
  // mappingValueField: 'code',
38
38
  // }, // 非必传,业务字段已根据业务默认默认
39
- // prefixUrl: { selectPrefix: '/bop/api', formSelectFix: '/bop/api' }, // 非必传,下拉框和tableForm下拉框接口前缀,默认为bop的接口
39
+ prefixUrl: { selectPrefix: 'http://test.i-baby.net/bop/api', formSelectFix: 'http://test.i-baby.net/bop/api' }, // 非必传,下拉框和tableForm下拉框接口前缀,默认为bop的接口
40
40
  selectProps, // 非必传
41
41
  onChange: (value: any) => {
42
42
  console.log(value)
@@ -73,15 +73,16 @@ export default () => {
73
73
  console.log(value)
74
74
  setValue(value)
75
75
  },
76
- requestConfig: {
77
- url: `/bop/api/sku`,
78
- filter: 'qp-nameAndCode-like',
79
- mappingValueField: 'skuCode',
80
- otherParams: {
81
- sorter: 'desc-id'
82
- }, // 默认参数
83
- sourceName: 'skuCode',
84
- },
76
+ // requestConfig: {
77
+ // url: `http://test.i-baby.net/bop/api/sku`,
78
+ // filter: 'qp-nameAndCode-like',
79
+ // mappingValueField: 'skuCode',
80
+ // otherParams: {
81
+ // sorter: 'desc-id'
82
+ // }, // 默认参数
83
+ // sourceName: 'skuCode',
84
+ // },
85
+ prefixUrl: { selectPrefix: 'http://test.i-baby.net/bop/api', formSelectFix: 'http://test.i-baby.net/bop/api' },
85
86
  selectProps,
86
87
  selectBusinessType: 'skuCommodity',
87
88
  };
@@ -93,4 +94,88 @@ export default () => {
93
94
  );
94
95
  };
95
96
  ```
97
+
98
+ 仓库选择器(物理仓) Select-Warehouse-001:
99
+
100
+ ```tsx
101
+ import React, { useState } from 'react';
102
+ import {BusinessSearchSelect} from '../../../index.ts';
103
+
104
+ export default () => {
105
+ const selectProps = {
106
+ mode: 'multiple',
107
+ maxTagCount: 1,
108
+ // disabled: true
109
+ }
110
+ const [value, setValue] = useState(selectProps?.mode ? [] : null);
111
+ const props = {
112
+ value,
113
+ onChange: (value: any) => {
114
+ console.log(value)
115
+ setValue(value)
116
+ },
117
+ // requestConfig: {
118
+ // url: `http://test.i-baby.net/bop/api/physicalWarehouse`,
119
+ // filter: 'qp-nameAndCode-like',
120
+ // mappingTextField: 'physicalWarehouseName',
121
+ // mappingValueField: 'physicalWarehouseCode',
122
+ // otherParams: {
123
+ // sorter: 'desc-id'
124
+ // }, // 默认参数
125
+ // sourceName: 'warehouseIds',
126
+ // },
127
+ prefixUrl: { selectPrefix: 'http://test.i-baby.net/bop/api', formSelectFix: 'http://test.i-baby.net/bop/api' },
128
+ selectProps,
129
+ selectBusinessType: 'physicalWarehouse',
130
+ };
131
+
132
+ return (
133
+ <div>
134
+ <BusinessSearchSelect {...props} />
135
+ </div>
136
+ );
137
+ };
138
+ ```
139
+
140
+ 仓库选择器(逻辑仓) Select-Warehouse-002:
141
+
142
+ ```tsx
143
+ import React, { useState } from 'react';
144
+ import {BusinessSearchSelect} from '../../../index.ts';
145
+
146
+ export default () => {
147
+ const selectProps = {
148
+ mode: 'multiple',
149
+ maxTagCount: 1,
150
+ // disabled: true
151
+ }
152
+ const [value, setValue] = useState(selectProps?.mode ? [] : null);
153
+ const props = {
154
+ value,
155
+ onChange: (value: any) => {
156
+ console.log(value)
157
+ setValue(value)
158
+ },
159
+ // requestConfig: {
160
+ // url: `http://test.i-baby.net/bop/api/realWarehouse`,
161
+ // filter: 'qp-nameAndCode-like',
162
+ // mappingTextField: 'realWarehouseName',
163
+ // mappingValueField: 'realWarehouseCode',
164
+ // otherParams: {
165
+ // sorter: 'desc-id'
166
+ // }, // 默认参数
167
+ // sourceName: 'warehouseIds',
168
+ // },
169
+ prefixUrl: { selectPrefix: 'http://test.i-baby.net/bop/api', formSelectFix: 'http://test.i-baby.net/bop/api' },
170
+ selectProps,
171
+ selectBusinessType: 'realWarehouse',
172
+ };
173
+
174
+ return (
175
+ <div>
176
+ <BusinessSearchSelect {...props} />
177
+ </div>
178
+ );
179
+ };
180
+ ```
96
181
  More skills for writing demo: https://d.umijs.org/guide/demo-principle