@bit-sun/business-component 2.0.38 → 2.0.39-alpha.0

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 (153) hide show
  1. package/.editorconfig +16 -16
  2. package/.fatherrc.ts +5 -4
  3. package/.gitlab-ci.yml +174 -174
  4. package/.prettierignore +7 -7
  5. package/.prettierrc +11 -11
  6. package/.umirc.ts +77 -74
  7. package/README.md +27 -27
  8. package/dist/components/Business/BsLayouts/Components/AllFunc/drawContent.d.ts +4 -0
  9. package/dist/components/Business/BsLayouts/Components/AllFunc/index.d.ts +4 -0
  10. package/dist/components/Business/BsLayouts/Components/CustomerMenu/MenuSetting/index.d.ts +4 -0
  11. package/dist/components/Business/BsLayouts/Components/CustomerMenu/MenuSetting/leftTree.d.ts +17 -0
  12. package/dist/components/Business/BsLayouts/Components/CustomerMenu/MenuSetting/rightTree.d.ts +30 -0
  13. package/dist/components/Business/BsLayouts/Components/CustomerMenu/globalMenu/DrawContent.d.ts +3 -0
  14. package/dist/components/Business/BsLayouts/Components/CustomerMenu/globalMenu/customMenuHeader.d.ts +2 -0
  15. package/dist/components/Business/BsLayouts/Components/CustomerMenu/index.d.ts +4 -0
  16. package/dist/components/Business/BsLayouts/Components/GlobalHeader/index.d.ts +4 -0
  17. package/dist/components/Business/BsLayouts/Components/RightContent/LoginModal.d.ts +2 -0
  18. package/dist/components/Business/BsLayouts/Components/RightContent/index.d.ts +8 -0
  19. package/dist/components/Business/BsLayouts/Components/SearchFunc/index.d.ts +8 -0
  20. package/dist/components/Business/BsLayouts/index.d.ts +18 -0
  21. package/dist/components/Business/BsLayouts/service.d.ts +1 -0
  22. package/dist/components/Business/BsLayouts/utils.d.ts +22 -0
  23. package/dist/components/Business/DetailPageWrapper/utils.d.ts +1 -2
  24. package/dist/index.d.ts +4 -0
  25. package/dist/index.esm.js +11691 -41
  26. package/dist/index.js +11666 -8
  27. package/dist/utils/enumConfig.d.ts +10 -0
  28. package/dist/utils/utils.d.ts +2 -1
  29. package/docs/index.md +21 -21
  30. package/lib/assets/drag.svg +17 -17
  31. package/lib/assets/exportFail.svg +37 -37
  32. package/lib/assets/exportProcessing.svg +28 -28
  33. package/lib/assets/exportSuccess.svg +34 -34
  34. package/lib/assets/label_icon_bottom.svg +25 -25
  35. package/lib/assets/upExport.svg +22 -22
  36. package/package.json +70 -66
  37. package/src/assets/32.svg +28 -0
  38. package/src/assets/addIcon.svg +18 -0
  39. package/src/assets/allfunc.svg +28 -0
  40. package/src/assets/arrowRight.svg +25 -0
  41. package/src/assets/btn-delete.svg +29 -29
  42. package/src/assets/btn-edit.svg +19 -19
  43. package/src/assets/btn-more.svg +17 -17
  44. package/src/assets/btn-submit.svg +19 -19
  45. package/src/assets/caidan.svg +12 -0
  46. package/src/assets/close.svg +26 -26
  47. package/src/assets/closeicon.png +0 -0
  48. package/src/assets/drag.svg +17 -17
  49. package/src/assets/exportFail.svg +37 -37
  50. package/src/assets/exportProcessing.svg +28 -28
  51. package/src/assets/exportSuccess.svg +34 -34
  52. package/src/assets/fixed-left-active.svg +11 -11
  53. package/src/assets/fixed-left.svg +15 -15
  54. package/src/assets/fixed-right-active.svg +11 -11
  55. package/src/assets/fixed-right.svg +15 -15
  56. package/src/assets/guanbi.svg +16 -0
  57. package/src/assets/icon-quanping.svg +15 -15
  58. package/src/assets/icon-shezhi.svg +17 -17
  59. package/src/assets/label_icon_bottom.svg +25 -25
  60. package/src/assets/morentouxiang-32.svg +24 -0
  61. package/src/assets/right.png +0 -0
  62. package/src/assets/scanning.svg +24 -24
  63. package/src/assets/upExport.svg +22 -22
  64. package/src/assets/xinglan-icon-out.png +0 -0
  65. package/src/components/Business/AddSelectBusiness/index.md +41 -41
  66. package/src/components/Business/AddSelectBusiness/index.tsx +290 -290
  67. package/src/components/Business/BsLayouts/Components/AllFunc/drawContent.tsx +112 -0
  68. package/src/components/Business/BsLayouts/Components/AllFunc/index.less +153 -0
  69. package/src/components/Business/BsLayouts/Components/AllFunc/index.tsx +70 -0
  70. package/src/components/Business/BsLayouts/Components/CustomerMenu/MenuSetting/index.less +90 -0
  71. package/src/components/Business/BsLayouts/Components/CustomerMenu/MenuSetting/index.tsx +38 -0
  72. package/src/components/Business/BsLayouts/Components/CustomerMenu/MenuSetting/leftTree.tsx +243 -0
  73. package/src/components/Business/BsLayouts/Components/CustomerMenu/MenuSetting/rightTree.tsx +385 -0
  74. package/src/components/Business/BsLayouts/Components/CustomerMenu/globalMenu/DrawContent.tsx +286 -0
  75. package/src/components/Business/BsLayouts/Components/CustomerMenu/globalMenu/customMenuHeader.tsx +75 -0
  76. package/src/components/Business/BsLayouts/Components/CustomerMenu/globalMenu/drawContent.less +171 -0
  77. package/src/components/Business/BsLayouts/Components/CustomerMenu/index.less +65 -0
  78. package/src/components/Business/BsLayouts/Components/CustomerMenu/index.tsx +154 -0
  79. package/src/components/Business/BsLayouts/Components/GlobalHeader/index.less +73 -0
  80. package/src/components/Business/BsLayouts/Components/GlobalHeader/index.tsx +158 -0
  81. package/src/components/Business/BsLayouts/Components/RightContent/LoginModal.tsx +85 -0
  82. package/src/components/Business/BsLayouts/Components/RightContent/home.less +218 -0
  83. package/src/components/Business/BsLayouts/Components/RightContent/index.tsx +156 -0
  84. package/src/components/Business/BsLayouts/Components/SearchFunc/index.less +162 -0
  85. package/src/components/Business/BsLayouts/Components/SearchFunc/index.tsx +76 -0
  86. package/src/components/Business/BsLayouts/index.less +80 -0
  87. package/src/components/Business/BsLayouts/index.tsx +1495 -0
  88. package/src/components/Business/BsLayouts/service.ts +11 -0
  89. package/src/components/Business/BsLayouts/utils.tsx +350 -0
  90. package/src/components/Business/BsSulaQueryTable/index.less +219 -219
  91. package/src/components/Business/BsSulaQueryTable/index.tsx +535 -534
  92. package/src/components/Business/BsSulaQueryTable/setting.tsx +818 -817
  93. package/src/components/Business/BsSulaQueryTable/utils.less +65 -65
  94. package/src/components/Business/BsSulaQueryTable/utils.tsx +691 -690
  95. package/src/components/Business/CommodityEntry/index.md +70 -70
  96. package/src/components/Business/CommodityEntry/index.tsx +80 -80
  97. package/src/components/Business/CommonAlert/index.tsx +23 -23
  98. package/src/components/Business/CommonGuideWrapper/index.less +111 -111
  99. package/src/components/Business/CommonGuideWrapper/index.md +39 -39
  100. package/src/components/Business/CommonGuideWrapper/index.tsx +83 -83
  101. package/src/components/Business/DetailPageWrapper/index.less +79 -79
  102. package/src/components/Business/DetailPageWrapper/index.tsx +335 -324
  103. package/src/components/Business/DetailPageWrapper/utils.tsx +101 -111
  104. package/src/components/Business/HomePageWrapper/index.less +33 -33
  105. package/src/components/Business/HomePageWrapper/index.md +45 -45
  106. package/src/components/Business/HomePageWrapper/index.tsx +162 -150
  107. package/src/components/Business/SearchSelect/BusinessUtils.ts +1458 -1457
  108. package/src/components/Business/SearchSelect/common.ts +53 -53
  109. package/src/components/Business/SearchSelect/index.md +1137 -1137
  110. package/src/components/Business/SearchSelect/index.tsx +51 -51
  111. package/src/components/Business/SearchSelect/utils.ts +100 -99
  112. package/src/components/Business/StateFlow/index.less +130 -130
  113. package/src/components/Business/StateFlow/index.md +60 -60
  114. package/src/components/Business/StateFlow/index.tsx +29 -29
  115. package/src/components/Business/TreeSearchSelect/index.md +126 -126
  116. package/src/components/Business/TreeSearchSelect/index.tsx +34 -34
  117. package/src/components/Business/TreeSearchSelect/utils.ts +60 -60
  118. package/src/components/Business/columnSettingTable/columnSetting.tsx +763 -762
  119. package/src/components/Business/columnSettingTable/index.less +247 -247
  120. package/src/components/Business/columnSettingTable/index.md +357 -357
  121. package/src/components/Business/columnSettingTable/index.tsx +226 -225
  122. package/src/components/Business/columnSettingTable/sulaSettingTable.tsx +234 -233
  123. package/src/components/Business/columnSettingTable/utils.tsx +68 -68
  124. package/src/components/Functional/AddSelect/index.less +367 -367
  125. package/src/components/Functional/AddSelect/index.md +122 -122
  126. package/src/components/Functional/AddSelect/index.tsx +962 -962
  127. package/src/components/Functional/BillEntry/index.less +371 -371
  128. package/src/components/Functional/BillEntry/index.md +39 -39
  129. package/src/components/Functional/BillEntry/index.tsx +613 -613
  130. package/src/components/Functional/DataImport/index.less +63 -63
  131. package/src/components/Functional/DataImport/index.md +44 -44
  132. package/src/components/Functional/DataImport/index.tsx +689 -689
  133. package/src/components/Functional/DataValidation/index.less +63 -63
  134. package/src/components/Functional/DataValidation/index.md +38 -38
  135. package/src/components/Functional/DataValidation/index.tsx +681 -681
  136. package/src/components/Functional/ExportFunctions/ExportIcon/index.md +37 -37
  137. package/src/components/Functional/ExportFunctions/ExportIcon/index.tsx +59 -59
  138. package/src/components/Functional/QueryMutipleInput/index.less +37 -37
  139. package/src/components/Functional/QueryMutipleInput/index.md +33 -33
  140. package/src/components/Functional/QueryMutipleInput/index.tsx +128 -128
  141. package/src/components/Functional/SearchSelect/index.less +115 -115
  142. package/src/components/Functional/SearchSelect/index.md +141 -141
  143. package/src/components/Functional/SearchSelect/index.tsx +812 -812
  144. package/src/components/Functional/TreeSearchSelect/index.md +47 -47
  145. package/src/components/Functional/TreeSearchSelect/index.tsx +149 -149
  146. package/src/index.ts +31 -30
  147. package/src/utils/CheckOneUser/index.md +39 -39
  148. package/src/utils/CheckOneUser/index.ts +51 -51
  149. package/src/utils/enumConfig.ts +10 -0
  150. package/src/utils/requestUtils.ts +33 -32
  151. package/src/utils/utils.ts +52 -22
  152. package/tsconfig.json +29 -29
  153. package/typings.d.ts +4 -4
@@ -1,37 +1,37 @@
1
- ---
2
- title: 导出按钮
3
- order: 5
4
- nav:
5
- title: 组件
6
- order: 1
7
- group:
8
- path: /components/functional
9
- order: 0
10
- title: 功能组件
11
- ---
12
-
13
- ## ExportIcon
14
-
15
- 导出按钮demo
16
-
17
- ```tsx
18
- import React, { useState, useRef } from 'react';
19
- import {ExportIcon} from '../../../../index';
20
-
21
-
22
-
23
- export default () => {
24
-
25
- const tableRef = useRef()
26
-
27
- return (
28
- <div>
29
- <ExportIcon request={{url:'abc'}} tableRef={tableRef}/>
30
- </div>
31
- );
32
- };
33
- ```
34
-
35
- <API></API>
36
-
37
- More skills for writing demo: https://d.umijs.org/guide/demo-principle
1
+ ---
2
+ title: 导出按钮
3
+ order: 5
4
+ nav:
5
+ title: 组件
6
+ order: 1
7
+ group:
8
+ path: /components/functional
9
+ order: 0
10
+ title: 功能组件
11
+ ---
12
+
13
+ ## ExportIcon
14
+
15
+ 导出按钮demo
16
+
17
+ ```tsx
18
+ import React, { useState, useRef } from 'react';
19
+ import {ExportIcon} from '../../../../index';
20
+
21
+
22
+
23
+ export default () => {
24
+
25
+ const tableRef = useRef()
26
+
27
+ return (
28
+ <div>
29
+ <ExportIcon request={{url:'abc'}} tableRef={tableRef}/>
30
+ </div>
31
+ );
32
+ };
33
+ ```
34
+
35
+ <API></API>
36
+
37
+ More skills for writing demo: https://d.umijs.org/guide/demo-principle
@@ -1,59 +1,59 @@
1
- // @ts-nocheck
2
- import React, {Ref} from 'react'
3
- import {message, Popconfirm, Tooltip} from "antd";
4
- import axios from 'axios'
5
- import exportlogo from '../../../../assets/exportlogo.png'
6
- import {omit} from 'lodash'
7
- interface exportIconType{
8
- /** others选填,使用axios发请求,*/
9
- request:{
10
- url: string,
11
- params: Function | Object,
12
- others?: Object
13
- },
14
- /** BsSulaQueryTable的tableRef*/
15
- tableRef: any,
16
- }
17
-
18
- const ExportIcon = ({request, tableRef}: exportIconType) => {
19
- const {url, params, others} = request
20
-
21
- return (
22
- <div style={{ cursor: 'pointer' }}>
23
- <Tooltip title="导出数据">
24
- <img width={32} src={exportlogo} onClick={() =>{
25
- const convertedParams = tableRef?.current?.getExportParams()
26
- let requestData: any
27
-
28
- if(typeof params === 'function'){
29
- requestData = {...omit(params(convertedParams),'selectedRows')}
30
- }else if(typeof params === 'object'){
31
- requestData = {...params}
32
- }
33
- if(!params){
34
- requestData = omit(convertedParams, 'selectedRows')
35
- }
36
-
37
- requestData['qp-id-in'] = convertedParams?.selectedRows?.map((d: any) => d.id)?.join(',')
38
-
39
- axios({
40
- url,
41
- method:'POST',
42
- data:requestData,
43
- ...others,
44
- })
45
- .then((result: any) => {
46
- result = result.data;
47
- if (result.code !== '000000') {
48
- message.error(result?.msg);
49
- return;
50
- }
51
- message.success('任务已排入导出队列')
52
- })
53
- }} />
54
- </Tooltip>
55
- </div>
56
- )
57
- }
58
-
59
- export default ExportIcon
1
+ // @ts-nocheck
2
+ import React, {Ref} from 'react'
3
+ import {message, Popconfirm, Tooltip} from "antd";
4
+ import axios from 'axios'
5
+ import exportlogo from '../../../../assets/exportlogo.png'
6
+ import {omit} from 'lodash'
7
+ interface exportIconType{
8
+ /** others选填,使用axios发请求,*/
9
+ request:{
10
+ url: string,
11
+ params: Function | Object,
12
+ others?: Object
13
+ },
14
+ /** BsSulaQueryTable的tableRef*/
15
+ tableRef: any,
16
+ }
17
+
18
+ const ExportIcon = ({request, tableRef}: exportIconType) => {
19
+ const {url, params, others} = request
20
+
21
+ return (
22
+ <div style={{ cursor: 'pointer' }}>
23
+ <Tooltip title="导出数据">
24
+ <img width={32} src={exportlogo} onClick={() =>{
25
+ const convertedParams = tableRef?.current?.getExportParams()
26
+ let requestData: any
27
+
28
+ if(typeof params === 'function'){
29
+ requestData = {...omit(params(convertedParams),'selectedRows')}
30
+ }else if(typeof params === 'object'){
31
+ requestData = {...params}
32
+ }
33
+ if(!params){
34
+ requestData = omit(convertedParams, 'selectedRows')
35
+ }
36
+
37
+ requestData['qp-id-in'] = convertedParams?.selectedRows?.map((d: any) => d.id)?.join(',')
38
+
39
+ axios({
40
+ url,
41
+ method:'POST',
42
+ data:requestData,
43
+ ...others,
44
+ })
45
+ .then((result: any) => {
46
+ result = result.data;
47
+ if (result.code !== '000000') {
48
+ message.error(result?.msg);
49
+ return;
50
+ }
51
+ message.success('任务已排入导出队列')
52
+ })
53
+ }} />
54
+ </Tooltip>
55
+ </div>
56
+ )
57
+ }
58
+
59
+ export default ExportIcon
@@ -1,37 +1,37 @@
1
- .query_input {
2
- &_show {
3
- display: flex;
4
- }
5
-
6
- &_expand_button {
7
- position: relative;
8
- width: 30px;
9
- color: #ffffff;
10
- cursor: pointer;
11
-
12
- span {
13
- position: absolute;
14
- height: 20px;
15
- line-height: 14px;
16
- left: 50%;
17
- top: 50%;
18
- transform: translate(-50%, -50%);
19
- }
20
- }
21
-
22
- &_wrapper {
23
- display: flex;
24
-
25
- &_left {
26
- width: 100px;
27
- }
28
-
29
- &_right {
30
- color: #9e9e9e;
31
- }
32
- }
33
-
34
- &_textArea {
35
- margin-top: 15px;
36
- }
37
- }
1
+ .query_input {
2
+ &_show {
3
+ display: flex;
4
+ }
5
+
6
+ &_expand_button {
7
+ position: relative;
8
+ width: 30px;
9
+ color: #ffffff;
10
+ cursor: pointer;
11
+
12
+ span {
13
+ position: absolute;
14
+ height: 20px;
15
+ line-height: 14px;
16
+ left: 50%;
17
+ top: 50%;
18
+ transform: translate(-50%, -50%);
19
+ }
20
+ }
21
+
22
+ &_wrapper {
23
+ display: flex;
24
+
25
+ &_left {
26
+ width: 100px;
27
+ }
28
+
29
+ &_right {
30
+ color: #9e9e9e;
31
+ }
32
+ }
33
+
34
+ &_textArea {
35
+ margin-top: 15px;
36
+ }
37
+ }
@@ -1,33 +1,33 @@
1
- ---
2
- nav:
3
- title: '组件'
4
- order: 1
5
- group:
6
- title: 功能组件
7
- order: 0
8
- title: 批量查询组件
9
- order: 2
10
- ---
11
-
12
- ## QueryMutipleInput
13
-
14
- Demo:
15
-
16
- ```tsx
17
- import React, { useRef } from 'react';
18
- import { QueryMutipleInput } from '../../../index';
19
-
20
- export default () => {
21
- const handleOnChange = (value) => {
22
- console.log(value);
23
- };
24
-
25
- return (
26
- <div>
27
- <QueryMutipleInput onValueChange={handleOnChange} />
28
- </div>
29
- );
30
- };
31
- ```
32
-
33
- More skills for writing demo: https://d.umijs.org/guide/demo-principle
1
+ ---
2
+ nav:
3
+ title: '组件'
4
+ order: 1
5
+ group:
6
+ title: 功能组件
7
+ order: 0
8
+ title: 批量查询组件
9
+ order: 2
10
+ ---
11
+
12
+ ## QueryMutipleInput
13
+
14
+ Demo:
15
+
16
+ ```tsx
17
+ import React, { useRef } from 'react';
18
+ import { QueryMutipleInput } from '../../../index';
19
+
20
+ export default () => {
21
+ const handleOnChange = (value) => {
22
+ console.log(value);
23
+ };
24
+
25
+ return (
26
+ <div>
27
+ <QueryMutipleInput onValueChange={handleOnChange} />
28
+ </div>
29
+ );
30
+ };
31
+ ```
32
+
33
+ More skills for writing demo: https://d.umijs.org/guide/demo-principle
@@ -1,128 +1,128 @@
1
- /*
2
- * @Description:
3
- * @Author: rodchen
4
- * @Date: 2021-12-01 10:52:08
5
- * @LastEditTime: 2021-12-29 19:14:56
6
- * @LastEditors: rodchen
7
- */
8
- // @ts-nocheck
9
- import React, { useState, useEffect } from 'react';
10
- import { useDebounceFn } from 'ahooks';
11
- import { Input, Button, Modal } from 'antd';
12
- import './index.less';
13
-
14
- const QueryMutipleInput = ({ onValueChange }) => {
15
- const [isModalVisible, setIsModalVisible] = useState(false);
16
- const [value, setValue] = useState('');
17
- const [popvalue, setPopValue] = useState('');
18
- const { run } = useDebounceFn(
19
- () => {
20
- formaData(value);
21
- },
22
- {
23
- wait: 1000,
24
- },
25
- );
26
-
27
- useEffect(() => {
28
- setPopValue(value);
29
- onValueChange(value);
30
- }, [value]);
31
-
32
- const showModal = () => {
33
- setIsModalVisible(true);
34
- };
35
-
36
- const handleOk = () => {
37
- formaData(popvalue);
38
- setIsModalVisible(false);
39
- };
40
-
41
- const formaData = (value) => {
42
- let formatValue = ToCDB(value)
43
- .split(/[/\n/\s,;]/)
44
- .filter((item) => item)
45
- .join(',');
46
- setValue(formatValue);
47
- };
48
-
49
- const handleCancel = () => {
50
- setIsModalVisible(false);
51
- };
52
-
53
- const outerChange = (e) => {
54
- setValue(e.target.value);
55
- run();
56
- };
57
-
58
- const onChange = (e) => {
59
- setPopValue(e.target.value);
60
- };
61
-
62
- return (
63
- <div className={'query_input'}>
64
- <div className="query_input_show">
65
- <Input
66
- value={value}
67
- onChange={outerChange}
68
- onBlur={(e) => {
69
- formaData(e.target.value);
70
- }}
71
- onPaste={(e) => {
72
- formaData(e.clipboardData.getData('text'));
73
- e.preventDefault();
74
- }}
75
- style={{ width: 'calc(100% - 30px)' }}
76
- placeholder="请输入(查询多个值请用 ; 或 , 分割)"
77
- />
78
- <Button style={{width: '30px', padding: '2px', height: 'auto'}} onClick={showModal} type="primary">...</Button>
79
- </div>
80
- <Modal
81
- width={600}
82
- title="多值录入"
83
- visible={isModalVisible}
84
- onOk={handleOk}
85
- onCancel={handleCancel}
86
- footer={[
87
- <Button key="back" onClick={handleCancel}>
88
- 取消
89
- </Button>,
90
- <Button key="submit" type="primary" onClick={handleOk}>
91
- 录入
92
- </Button>,
93
- ]}
94
- >
95
- <div className={'query_input_wrapper'}>
96
- <div className={'query_input_wrapper_left'}>录入区:</div>
97
- <div className={'query_input_wrapper_right'}>
98
- <div>
99
- 如需同时使用多个值进行查询,请使用逗号、分号、空格或换行进行值的分隔,中英文格式的符号均支持
100
- </div>
101
- <div className={'query_input_textArea'}>
102
- <Input.TextArea
103
- value={popvalue}
104
- onChange={onChange}
105
- rows={6}
106
- showCount
107
- />
108
- </div>
109
- </div>
110
- </div>
111
- </Modal>
112
- </div>
113
- );
114
- };
115
-
116
- function ToCDB(str) {
117
- var tmp = '';
118
- for (var i = 0; i < str.length; i++) {
119
- if (str.charCodeAt(i) > 65248 && str.charCodeAt(i) < 65375) {
120
- tmp += String.fromCharCode(str.charCodeAt(i) - 65248);
121
- } else {
122
- tmp += String.fromCharCode(str.charCodeAt(i));
123
- }
124
- }
125
- return tmp;
126
- }
127
-
128
- export default QueryMutipleInput;
1
+ /*
2
+ * @Description:
3
+ * @Author: rodchen
4
+ * @Date: 2021-12-01 10:52:08
5
+ * @LastEditTime: 2021-12-29 19:14:56
6
+ * @LastEditors: rodchen
7
+ */
8
+ // @ts-nocheck
9
+ import React, { useState, useEffect } from 'react';
10
+ import { useDebounceFn } from 'ahooks';
11
+ import { Input, Button, Modal } from 'antd';
12
+ import './index.less';
13
+
14
+ const QueryMutipleInput = ({ onValueChange }) => {
15
+ const [isModalVisible, setIsModalVisible] = useState(false);
16
+ const [value, setValue] = useState('');
17
+ const [popvalue, setPopValue] = useState('');
18
+ const { run } = useDebounceFn(
19
+ () => {
20
+ formaData(value);
21
+ },
22
+ {
23
+ wait: 1000,
24
+ },
25
+ );
26
+
27
+ useEffect(() => {
28
+ setPopValue(value);
29
+ onValueChange(value);
30
+ }, [value]);
31
+
32
+ const showModal = () => {
33
+ setIsModalVisible(true);
34
+ };
35
+
36
+ const handleOk = () => {
37
+ formaData(popvalue);
38
+ setIsModalVisible(false);
39
+ };
40
+
41
+ const formaData = (value) => {
42
+ let formatValue = ToCDB(value)
43
+ .split(/[/\n/\s,;]/)
44
+ .filter((item) => item)
45
+ .join(',');
46
+ setValue(formatValue);
47
+ };
48
+
49
+ const handleCancel = () => {
50
+ setIsModalVisible(false);
51
+ };
52
+
53
+ const outerChange = (e) => {
54
+ setValue(e.target.value);
55
+ run();
56
+ };
57
+
58
+ const onChange = (e) => {
59
+ setPopValue(e.target.value);
60
+ };
61
+
62
+ return (
63
+ <div className={'query_input'}>
64
+ <div className="query_input_show">
65
+ <Input
66
+ value={value}
67
+ onChange={outerChange}
68
+ onBlur={(e) => {
69
+ formaData(e.target.value);
70
+ }}
71
+ onPaste={(e) => {
72
+ formaData(e.clipboardData.getData('text'));
73
+ e.preventDefault();
74
+ }}
75
+ style={{ width: 'calc(100% - 30px)' }}
76
+ placeholder="请输入(查询多个值请用 ; 或 , 分割)"
77
+ />
78
+ <Button style={{width: '30px', padding: '2px', height: 'auto'}} onClick={showModal} type="primary">...</Button>
79
+ </div>
80
+ <Modal
81
+ width={600}
82
+ title="多值录入"
83
+ visible={isModalVisible}
84
+ onOk={handleOk}
85
+ onCancel={handleCancel}
86
+ footer={[
87
+ <Button key="back" onClick={handleCancel}>
88
+ 取消
89
+ </Button>,
90
+ <Button key="submit" type="primary" onClick={handleOk}>
91
+ 录入
92
+ </Button>,
93
+ ]}
94
+ >
95
+ <div className={'query_input_wrapper'}>
96
+ <div className={'query_input_wrapper_left'}>录入区:</div>
97
+ <div className={'query_input_wrapper_right'}>
98
+ <div>
99
+ 如需同时使用多个值进行查询,请使用逗号、分号、空格或换行进行值的分隔,中英文格式的符号均支持
100
+ </div>
101
+ <div className={'query_input_textArea'}>
102
+ <Input.TextArea
103
+ value={popvalue}
104
+ onChange={onChange}
105
+ rows={6}
106
+ showCount
107
+ />
108
+ </div>
109
+ </div>
110
+ </div>
111
+ </Modal>
112
+ </div>
113
+ );
114
+ };
115
+
116
+ function ToCDB(str) {
117
+ var tmp = '';
118
+ for (var i = 0; i < str.length; i++) {
119
+ if (str.charCodeAt(i) > 65248 && str.charCodeAt(i) < 65375) {
120
+ tmp += String.fromCharCode(str.charCodeAt(i) - 65248);
121
+ } else {
122
+ tmp += String.fromCharCode(str.charCodeAt(i));
123
+ }
124
+ }
125
+ return tmp;
126
+ }
127
+
128
+ export default QueryMutipleInput;