@bit-sun/business-component 2.2.7 → 2.2.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 (178) hide show
  1. package/.editorconfig +16 -16
  2. package/.fatherrc.ts +5 -5
  3. package/.gitlab-ci.yml +179 -179
  4. package/.prettierignore +7 -7
  5. package/.prettierrc +11 -11
  6. package/.umirc.ts +74 -74
  7. package/README.md +27 -27
  8. package/dist/index.esm.js +37 -34
  9. package/dist/index.js +37 -34
  10. package/dist/utils/LocalstorageUtils.d.ts +6 -0
  11. package/docs/index.md +21 -21
  12. package/lib/assets/drag.svg +17 -17
  13. package/lib/assets/exportFail.svg +37 -37
  14. package/lib/assets/exportProcessing.svg +28 -28
  15. package/lib/assets/exportSuccess.svg +34 -34
  16. package/lib/assets/label_icon_bottom.svg +25 -25
  17. package/lib/assets/upExport.svg +22 -22
  18. package/package.json +77 -77
  19. package/src/assets/32.svg +27 -27
  20. package/src/assets/addIcon.svg +17 -17
  21. package/src/assets/allfunc.svg +27 -27
  22. package/src/assets/arrowRight.svg +24 -24
  23. package/src/assets/btn-delete.svg +29 -29
  24. package/src/assets/btn-edit.svg +19 -19
  25. package/src/assets/btn-more.svg +17 -17
  26. package/src/assets/btn-submit.svg +19 -19
  27. package/src/assets/caidan.svg +11 -11
  28. package/src/assets/close.svg +26 -26
  29. package/src/assets/drag.svg +17 -17
  30. package/src/assets/exportFail.svg +37 -37
  31. package/src/assets/exportProcessing.svg +28 -28
  32. package/src/assets/exportSuccess.svg +34 -34
  33. package/src/assets/fixed-left-active.svg +11 -11
  34. package/src/assets/fixed-left.svg +15 -15
  35. package/src/assets/fixed-right-active.svg +11 -11
  36. package/src/assets/fixed-right.svg +15 -15
  37. package/src/assets/guanbi.svg +15 -15
  38. package/src/assets/icon-quanping.svg +15 -15
  39. package/src/assets/icon-shezhi.svg +17 -17
  40. package/src/assets/label_icon_bottom.svg +25 -25
  41. package/src/assets/list-no-img.svg +21 -21
  42. package/src/assets/morentouxiang-32.svg +23 -23
  43. package/src/assets/scanning.svg +24 -24
  44. package/src/assets/upExport.svg +22 -22
  45. package/src/components/Business/AddSelectBusiness/index.md +63 -63
  46. package/src/components/Business/AddSelectBusiness/index.tsx +344 -344
  47. package/src/components/Business/BsLayouts/Components/AllFunc/drawContent.tsx +111 -111
  48. package/src/components/Business/BsLayouts/Components/AllFunc/index.less +153 -153
  49. package/src/components/Business/BsLayouts/Components/AllFunc/index.tsx +70 -70
  50. package/src/components/Business/BsLayouts/Components/CustomerMenu/MenuSetting/index.less +90 -90
  51. package/src/components/Business/BsLayouts/Components/CustomerMenu/MenuSetting/index.tsx +37 -37
  52. package/src/components/Business/BsLayouts/Components/CustomerMenu/MenuSetting/leftTree.tsx +242 -242
  53. package/src/components/Business/BsLayouts/Components/CustomerMenu/MenuSetting/rightTree.tsx +384 -384
  54. package/src/components/Business/BsLayouts/Components/CustomerMenu/globalMenu/DrawContent.tsx +285 -285
  55. package/src/components/Business/BsLayouts/Components/CustomerMenu/globalMenu/customMenuHeader.tsx +74 -74
  56. package/src/components/Business/BsLayouts/Components/CustomerMenu/globalMenu/drawContent.less +170 -170
  57. package/src/components/Business/BsLayouts/Components/CustomerMenu/index.less +64 -64
  58. package/src/components/Business/BsLayouts/Components/CustomerMenu/index.tsx +153 -153
  59. package/src/components/Business/BsLayouts/Components/GlobalHeader/index.less +72 -72
  60. package/src/components/Business/BsLayouts/Components/GlobalHeader/index.tsx +157 -157
  61. package/src/components/Business/BsLayouts/Components/RightContent/LoginModal.tsx +85 -85
  62. package/src/components/Business/BsLayouts/Components/RightContent/home.less +218 -218
  63. package/src/components/Business/BsLayouts/Components/RightContent/index.tsx +156 -156
  64. package/src/components/Business/BsLayouts/Components/SearchFunc/index.less +160 -160
  65. package/src/components/Business/BsLayouts/Components/SearchFunc/index.tsx +75 -75
  66. package/src/components/Business/BsLayouts/index.less +79 -79
  67. package/src/components/Business/BsLayouts/index.tsx +1479 -1479
  68. package/src/components/Business/BsLayouts/service.ts +10 -10
  69. package/src/components/Business/BsLayouts/utils.tsx +230 -230
  70. package/src/components/Business/BsSulaQueryTable/SearchItemSetting.tsx +538 -538
  71. package/src/components/Business/BsSulaQueryTable/index.less +219 -219
  72. package/src/components/Business/BsSulaQueryTable/index.tsx +529 -529
  73. package/src/components/Business/BsSulaQueryTable/setting.tsx +802 -802
  74. package/src/components/Business/BsSulaQueryTable/utils.less +65 -65
  75. package/src/components/Business/BsSulaQueryTable/utils.tsx +688 -688
  76. package/src/components/Business/CommodityEntry/index.md +70 -70
  77. package/src/components/Business/CommodityEntry/index.tsx +80 -80
  78. package/src/components/Business/CommonAlert/index.tsx +23 -23
  79. package/src/components/Business/CommonGuideWrapper/index.less +111 -111
  80. package/src/components/Business/CommonGuideWrapper/index.md +39 -39
  81. package/src/components/Business/CommonGuideWrapper/index.tsx +83 -83
  82. package/src/components/Business/DetailPageWrapper/index.less +79 -79
  83. package/src/components/Business/DetailPageWrapper/index.tsx +335 -335
  84. package/src/components/Business/DetailPageWrapper/utils.tsx +100 -100
  85. package/src/components/Business/HomePageWrapper/index.less +33 -33
  86. package/src/components/Business/HomePageWrapper/index.md +45 -45
  87. package/src/components/Business/HomePageWrapper/index.tsx +162 -162
  88. package/src/components/Business/JsonQueryTable/components/FieldsModifyModal.tsx +824 -824
  89. package/src/components/Business/JsonQueryTable/components/FieldsSettingsTable.tsx +201 -201
  90. package/src/components/Business/JsonQueryTable/components/Formula.tsx +205 -205
  91. package/src/components/Business/JsonQueryTable/components/MaintainOptions.tsx +127 -127
  92. package/src/components/Business/JsonQueryTable/configButton/index.js +20 -20
  93. package/src/components/Business/JsonQueryTable/configTree/component/compactArrayView.js +25 -25
  94. package/src/components/Business/JsonQueryTable/configTree/component/compactObjectView.js +30 -30
  95. package/src/components/Business/JsonQueryTable/configTree/index.js +82 -82
  96. package/src/components/Business/JsonQueryTable/configTree/index.less +44 -44
  97. package/src/components/Business/JsonQueryTable/configTree/parser/highlight.js +57 -57
  98. package/src/components/Business/JsonQueryTable/configTree/parser/index.js +124 -124
  99. package/src/components/Business/JsonQueryTable/configTree/render/iconRender.js +29 -29
  100. package/src/components/Business/JsonQueryTable/configTree/render/nameRender.js +22 -22
  101. package/src/components/Business/JsonQueryTable/configTree/treeNode.js +116 -116
  102. package/src/components/Business/JsonQueryTable/drawer/index.tsx +12 -12
  103. package/src/components/Business/JsonQueryTable/function.ts +62 -62
  104. package/src/components/Business/JsonQueryTable/index.less +16 -16
  105. package/src/components/Business/JsonQueryTable/index.md +328 -328
  106. package/src/components/Business/JsonQueryTable/index.tsx +320 -320
  107. package/src/components/Business/JsonQueryTable/jsonEditor/index.js +346 -346
  108. package/src/components/Business/JsonQueryTable/jsonEditor/index.less +22 -22
  109. package/src/components/Business/JsonQueryTable/jsonEditor/lint/basicType.js +147 -147
  110. package/src/components/Business/JsonQueryTable/jsonEditor/lint/index.js +389 -389
  111. package/src/components/Business/JsonQueryTable/jsonEditor/suggestions/actions.js +118 -118
  112. package/src/components/Business/JsonQueryTable/jsonEditor/suggestions/dependency.js +22 -22
  113. package/src/components/Business/JsonQueryTable/jsonEditor/suggestions/index.js +21 -21
  114. package/src/components/Business/JsonQueryTable/jsonEditor/suggestions/request.js +65 -65
  115. package/src/components/Business/JsonQueryTable/static.ts +356 -356
  116. package/src/components/Business/SearchSelect/BusinessUtils.ts +1586 -1586
  117. package/src/components/Business/SearchSelect/common.ts +53 -53
  118. package/src/components/Business/SearchSelect/index.md +1254 -1254
  119. package/src/components/Business/SearchSelect/index.tsx +51 -51
  120. package/src/components/Business/SearchSelect/utils.ts +100 -100
  121. package/src/components/Business/StateFlow/index.less +130 -130
  122. package/src/components/Business/StateFlow/index.md +60 -60
  123. package/src/components/Business/StateFlow/index.tsx +29 -29
  124. package/src/components/Business/TreeSearchSelect/index.md +126 -126
  125. package/src/components/Business/TreeSearchSelect/index.tsx +34 -34
  126. package/src/components/Business/TreeSearchSelect/utils.ts +60 -60
  127. package/src/components/Business/columnSettingTable/columnSetting.tsx +764 -764
  128. package/src/components/Business/columnSettingTable/index.less +247 -247
  129. package/src/components/Business/columnSettingTable/index.md +357 -357
  130. package/src/components/Business/columnSettingTable/index.tsx +232 -232
  131. package/src/components/Business/columnSettingTable/sulaSettingTable.tsx +240 -240
  132. package/src/components/Business/columnSettingTable/utils.tsx +68 -68
  133. package/src/components/Business/moreTreeTable/index.less +99 -99
  134. package/src/components/Business/moreTreeTable/index.md +508 -508
  135. package/src/components/Business/moreTreeTable/index.tsx +315 -315
  136. package/src/components/Business/moreTreeTable/utils.ts +126 -126
  137. package/src/components/Functional/AddSelect/index.less +367 -367
  138. package/src/components/Functional/AddSelect/index.md +155 -155
  139. package/src/components/Functional/AddSelect/index.tsx +1072 -1072
  140. package/src/components/Functional/BillEntry/index.less +371 -371
  141. package/src/components/Functional/BillEntry/index.md +39 -39
  142. package/src/components/Functional/BillEntry/index.tsx +766 -766
  143. package/src/components/Functional/DataImport/index.less +63 -63
  144. package/src/components/Functional/DataImport/index.md +44 -44
  145. package/src/components/Functional/DataImport/index.tsx +695 -695
  146. package/src/components/Functional/DataValidation/index.less +63 -63
  147. package/src/components/Functional/DataValidation/index.md +39 -39
  148. package/src/components/Functional/DataValidation/index.tsx +687 -687
  149. package/src/components/Functional/ExportFunctions/ExportIcon/index.md +37 -37
  150. package/src/components/Functional/ExportFunctions/ExportIcon/index.tsx +59 -59
  151. package/src/components/Functional/QueryMutipleInput/index.less +37 -37
  152. package/src/components/Functional/QueryMutipleInput/index.md +33 -33
  153. package/src/components/Functional/QueryMutipleInput/index.tsx +128 -128
  154. package/src/components/Functional/SearchSelect/index.less +115 -115
  155. package/src/components/Functional/SearchSelect/index.md +141 -141
  156. package/src/components/Functional/SearchSelect/index.tsx +813 -813
  157. package/src/components/Functional/SearchSelect/utils.ts +3 -3
  158. package/src/components/Functional/TreeSearchSelect/index.md +47 -47
  159. package/src/components/Functional/TreeSearchSelect/index.tsx +160 -160
  160. package/src/index.ts +34 -34
  161. package/src/plugin/TableColumnSetting/index.less +247 -247
  162. package/src/plugin/TableColumnSetting/index.md +50 -50
  163. package/src/plugin/TableColumnSetting/index.tsx +724 -724
  164. package/src/plugin/TableColumnSetting/utils.ts +19 -19
  165. package/src/styles/bsDefault.less +1906 -1906
  166. package/src/utils/CheckOneUser/index.md +39 -39
  167. package/src/utils/CheckOneUser/index.ts +51 -51
  168. package/src/utils/LocalstorageUtils.ts +58 -33
  169. package/src/utils/TableUtils.tsx +18 -18
  170. package/src/utils/checkUtils.ts +39 -39
  171. package/src/utils/enumConfig.ts +11 -11
  172. package/src/utils/getFormMode.js +12 -12
  173. package/src/utils/index.ts +2 -2
  174. package/src/utils/requestUtils.ts +34 -33
  175. package/src/utils/serialize.js +7 -7
  176. package/src/utils/utils.ts +183 -183
  177. package/tsconfig.json +29 -29
  178. package/typings.d.ts +4 -4
@@ -1,1072 +1,1072 @@
1
- // @ts-nocheck
2
- import React, { useState, useEffect } from 'react';
3
- import { useDebounceFn } from 'ahooks';
4
- import { Input, Button, Modal, Select, InputNumber, message, Spin, Form, Table, Checkbox, TreeSelect, Tooltip, Tag } from 'antd';
5
- import { SearchOutlined, CopyOutlined, CloseCircleOutlined } from '@ant-design/icons';
6
- import axios from 'axios';
7
- import { stringify } from 'querystring';
8
- import _ from "lodash"
9
- import './index.less';
10
- import { BusinessSearchSelect, QueryMutipleInput } from '@/index';
11
- import { Resizable } from 'react-resizable';
12
- import { checkQuantityAccuracy, precisionQuantity } from '@/utils/checkUtils';
13
- import TableColumnSetting from '@/plugin/TableColumnSetting';
14
- import { setInitialShowColumn } from '@/plugin/TableColumnSetting/utils';
15
- import { handleAntdColumnsSpecialParams } from '@/utils/utils';
16
- import { getItemDefaultWidth, noEmptyArray } from '@/components/Business/columnSettingTable/utils';
17
-
18
- const loadSelectSource = (url: string, params?: any) => {
19
- return new Promise((resolve, reject) => {
20
- axios
21
- .get(`${url}?${stringify(params)}`)
22
- .then((result: any) => {
23
- result = result.data;
24
- if ((result?.status && result.status !== '0') || (result?.code && result.code !== '000000')) {
25
- message.error(result.msg);
26
- return;
27
- }
28
- resolve(result);
29
- })
30
- .catch((err) => {
31
- reject(err);
32
- });
33
- })
34
- };
35
-
36
- const ResizeableTitle = (props) => {
37
- const { onResize, width, ...restProps } = props;
38
-
39
- if (!width) {
40
- return <th {...restProps} />;
41
- }
42
- return (
43
- <Resizable
44
- width={width}
45
- height={0}
46
- onResize={onResize}
47
- draggableOpts={{ enableUserSelectHack: false }}
48
- >
49
- <th {...restProps} />
50
- </Resizable>
51
- );
52
- };
53
-
54
- const formatSource = (reData: any, position: number, changePosition: number,changeSearchForm: any,resKeyValue=['code', 'name']) => {
55
- const data = reData && reData[position]?.data;
56
- const list = Array.isArray(data) ? data :(data?.items || data?.list || data?.children || []);
57
- const formatData = list?.length ? list.map((v: any) => ({ text: v[resKeyValue[1]], value: v[resKeyValue[0]] })) : [];
58
- changeSearchForm[changePosition] = {...changeSearchForm[changePosition], initialSource: formatData}
59
- }
60
-
61
- // 格式化树选择器数据源
62
- const mapSearchTree = (treeDataItem: any, resKeyValue: any) => {
63
- const haveChildren = Array.isArray(treeDataItem.children) && treeDataItem.children.length > 0;
64
- return {
65
- title: treeDataItem[resKeyValue[1]],
66
- value: treeDataItem[resKeyValue[0]],
67
- parentId: treeDataItem.parent,
68
- data: { ...treeDataItem },
69
- isLeaf: !haveChildren,
70
- disabled: haveChildren,
71
- children: haveChildren ? treeDataItem.children.map((i: any) => mapSearchTree(i, resKeyValue)) : [],
72
- };
73
- };
74
- const formatTreeDataSource = (reData: any, position: number, changePosition: number,changeSearchForm: any,resKeyValue=['id', 'name']) => {
75
- const data = reData && reData[position]?.data;
76
- const formatData = (data &&
77
- Array.isArray(data) &&
78
- data.length &&
79
- data.map((ites: any) => mapSearchTree(ites, resKeyValue))) ||
80
- []
81
- changeSearchForm[changePosition].field.props.treeData = formatData;
82
- }
83
-
84
- const { Option } = Select;
85
-
86
- const AddSelect = (props: any) => {
87
- const {
88
- value, // 必传
89
- onChange,
90
- selectProps = {},
91
- modalTableProps = {},
92
- labelInValue = false,
93
- requestConfig,
94
- ctx,
95
- sourceName,
96
- needModalTable = true,
97
- getPopupContainer = undefined,
98
- onSaveCallback,
99
- buttonText = '添加',
100
- buttonProps = {},
101
- beforeShowModal,
102
- tableCodeList = [], // 非必填 默认取组件定义code,如需自定义----数组第一位为供选择商品的table的code,第二位为已选择商品的table的code
103
- } = props;
104
- const { url, otherParams, isMap, fixedparameter, fieldValToParam, mappingTextField = 'name', mappingTextShowKeyField, mappingValueField = 'code', mappingTextShowTextField } = requestConfig || {};
105
- const resultSourceKey = sourceName || requestConfig?.sourceName || 'supplierCode'
106
- const realButtonProps = {type: "primary", ...buttonProps};
107
-
108
- const selectMode = selectProps?.mode // 设定当前选择器 为单选或者多选模式 无设定为单选模式(默认)
109
- const initVal = value || (selectMode ? [] : null);
110
- const pageSize = 100 // 下拉框默认分页 条数
111
- const tableInitPageSize = 10 // 弹框默认分页 条数
112
- const currentPage = 1
113
- const selectParamsKey = requestConfig?.filter || 'qp-codeAndName-like'
114
- const selectParamsInitKey = requestConfig?.filterInit || selectParamsKey
115
- const currentSelectProps = {
116
- ...selectProps,
117
- // 以下属性不可更改----设计配置项
118
- showSearch: false,
119
- filterOption: false,
120
- allowClear: true,
121
- listHeight: 160,
122
- optionLabelProp: "label",
123
- autoClearSearchValue: false
124
- }
125
- const [items, setItems] = useState([]);
126
- const [scrollPage, setScrollPage] = useState(1);
127
- const [itemsTotal, setItemsTotal] = useState(0);
128
- const [fetching, setFetching] = useState(false);
129
- const [searchValue, setSearchValue] = useState('');
130
- const [isModalVisible, setIsModalVisible] = useState(false);
131
- const [popvalue, setPopValue] = useState(initVal);
132
- const [uniqueValue, setUniqueValue] = useState(sourceName)
133
- const { run } = useDebounceFn(
134
- (v?: any) => {
135
- // 优化搜索参数 支持传多个
136
- let searchParams = {};
137
- if (typeof selectParamsKey === 'string') {
138
- searchParams = v ? { [selectParamsInitKey]: initVal } : { [selectParamsKey]: searchValue }
139
- }
140
- if (Array.isArray(selectParamsKey)) {
141
- selectParamsKey.forEach((i: any) => {
142
- searchParams = { ...searchParams, [i]: searchValue }
143
- })
144
- }
145
- // 防抖函数 待定
146
- getData(searchParams)
147
- },
148
- {
149
- wait: 1000,
150
- },
151
- );
152
-
153
- const [form] = Form.useForm();
154
- const [tableSearchForm, setTableSearchForm] = useState(modalTableProps?.tableSearchForm)
155
- const [caretLeftFlag, setCaretLeftFlag] = useState(true);
156
- const [tableData, setTableData] = useState([]);
157
- const [tablePagination, setTablePagination] = useState({ total: 0, size: "small", current: 1, pageSize: tableInitPageSize })
158
- const [selectedRowKeys, setSelectedRowKeys] = useState([]);
159
- const [doubleArr, setDoubleArr] = useState([]); // 存放双数组的数组
160
- const [checkedAll, setCheckedAll] = useState(false)
161
- const [indeterminate, setIndeterminate] = useState(false)
162
- const [tableFormParams, setTableFormParams] = useState({});
163
- const [confirmLoading, setConfirmLoading] = useState(false);
164
- const [confirmContinueLoading, setConfirmContinueLoading] = useState(false);
165
-
166
- const [selectColumns, setSelectColumns] = useState([]);
167
- const [showColumns, setShowColumns] = useState([]);
168
- const [tableColumns, setTableColumns] = useState([]);
169
- const [showToChooseColumns, setShowToChooseColumns] = useState([]);
170
- const codeToChoose = tableCodeList[0] || 'skuSelect-tableOptionsToChoosePartCode';
171
- const codeSelected = tableCodeList[1] || 'skuSelect-tableSelectedItemPartCode';
172
-
173
- useEffect(() => {
174
- setTableColumns(modalTableProps?.tableColumns)
175
- }, [modalTableProps?.tableColumns])
176
-
177
- useEffect(() => {
178
- setSelectColumns([... modalTableProps.selectColumn.map(item => {
179
- const inputLength = modalTableProps.selectColumn.filter(item => item.isInputItem).length
180
- const currentIndex = inputIndex
181
-
182
- if (item.isInputItem) {
183
- inputIndex++;
184
- return {
185
- ...item,
186
- render: (text, record, index) => {
187
- // let
188
- if(record.needFocus === true && currentIndex === 0) {
189
-
190
- }
191
- let precisionObj={};
192
- const unitAccuracy = record.packingUnitList?.[0]?.unitAccuracy
193
- const isCountUnitAccuracyCheck = item.dataIndex =='count' && unitAccuracy !== undefined
194
- if(isCountUnitAccuracyCheck) {
195
- precisionObj = {
196
- onBlur: (e: any) => {
197
- const { target: { value } } = e;
198
- if(!checkQuantityAccuracy(value,Number(unitAccuracy))) {
199
- record[item.dataIndex] = precisionQuantity(value,Number(unitAccuracy))
200
- const newPopValue = popvalue.map((i: any, innerIndex: number) => {
201
- if(innerIndex == index) {
202
- i[item.dataIndex] = record[item.dataIndex]
203
- }
204
- return i
205
- })
206
- setPopValue(newPopValue)
207
- }
208
- }
209
- // precision: unitAccuracy
210
- }
211
- }
212
- return (
213
- <InputNumber
214
- value={text || ''}
215
- min={0}
216
- autoFocus={record.needFocus}
217
- keyboard={false}
218
- {...precisionObj}
219
- onChange={(value) => {
220
- record[item.dataIndex] = value
221
- const newPopValue = popvalue.map((i: any, innerIndex: number) => {
222
- if(innerIndex == index) {
223
- i[item.dataIndex] = record[item.dataIndex]
224
- }
225
- return i
226
- })
227
- setPopValue(newPopValue)
228
- }}
229
- // onFocus={(e)=> {
230
- // let dom1 = e.currentTarget;
231
- // dom1.setSelectionRange(100, 0);
232
- // dom1.select(text);
233
- // }}
234
- onKeyDown={(e) => {
235
- if(e.keyCode === 13 && e.ctrlKey) {
236
- handleOk(true)
237
- document.getElementById("first-query")?.focus()
238
- }
239
- if(e.keyCode === 8 && e.ctrlKey) {
240
- message.success('删除当前行')
241
- e.stopPropagation();
242
- e.preventDefault();
243
- let dom = e.nativeEvent.path[5].children[index + 2]?.getElementsByTagName('input')[currentIndex]
244
- if (dom) {
245
- dom.select();
246
- dom.focus();
247
- dom.scrollIntoView(false)
248
- }
249
- dom = null
250
- deleteRecord(record, popvalue);
251
- }
252
- if (e.keyCode === 37 && e.shiftKey) { // 左滑动
253
- e.stopPropagation();
254
- e.preventDefault();
255
- let dom = e.nativeEvent.path[5].children[index + 1]?.getElementsByTagName('input')[currentIndex - 1]
256
- if (dom) {
257
- dom.select();
258
- dom.focus();
259
- dom.scrollIntoView(false)
260
- }
261
- dom = null
262
- }
263
- if (e.keyCode === 39 && e.shiftKey) { // 右滑
264
- e.stopPropagation();
265
- e.preventDefault();
266
- let dom = e.nativeEvent.path[5].children[index + 1]?.getElementsByTagName('input')[currentIndex + 1]
267
- if (dom) {
268
- dom.select();
269
- dom.focus();
270
- dom.scrollIntoView(false)
271
- }
272
- dom = null
273
- }
274
- if (e.keyCode === 40) {
275
- e.stopPropagation();
276
- e.preventDefault();
277
- let dom = e.nativeEvent.path[5].children[index + 2]?.getElementsByTagName('input')[currentIndex]
278
- if (dom) {
279
- dom.select();
280
- dom.focus();
281
- dom.scrollIntoView(false)
282
- }
283
- dom = null
284
- } else if (e.keyCode === 38) {
285
- e.stopPropagation();
286
- e.preventDefault();
287
- let dom1 = e.nativeEvent.path[5].children[index]?.getElementsByTagName('input')[currentIndex]
288
- if (dom1) {
289
- // dom1.value=""
290
- // dom1.setSelectionRange(100, 0);
291
- dom1.select();
292
- dom1.focus();
293
- dom1.scrollIntoViewIfNeeded(false)
294
- // dom1.value=record['count']
295
- }
296
- dom1 = null
297
- } else if (e.keyCode === 9 && index === selectedRowKeys.length - 1 && currentIndex === inputLength - 1) {
298
- e.stopPropagation();
299
- e.preventDefault();
300
- }
301
- }}
302
- />
303
- );
304
- },
305
- }
306
- }
307
-
308
- return item
309
- }), {
310
- title: '操作',
311
- width: 50,
312
- dataIndex: 'operation',
313
- fixed: 'right',
314
- render: (text, record, index) => {
315
- return (
316
- <span style={{cursor: 'pointer', color: '#005CFF' }} onClick={() => {
317
- deleteRecord(record)
318
- }} type={"text"}>删除</span>
319
- )
320
- }
321
- },])
322
- }, [modalTableProps?.selectColumn,popvalue])
323
-
324
- // 获取数据源 (type: 1下拉框 2弹框 不传值默认为下拉框)
325
- const getData = (params = {}, type = 1) => {
326
- if (!requestConfig) return;
327
-
328
- setFetching(true)
329
-
330
- // 处理dependence参数
331
- const fixedParam = {};
332
- if (fixedparameter && fieldValToParam && ctx) {
333
- fixedparameter.forEach((item: any, index: any) => {
334
- const fixedParamVal = ctx.form.getFieldValue(fieldValToParam[index]);
335
- if (fixedParamVal) {
336
- fixedParam[item] = fixedParamVal;
337
- form.setFieldsValue({ ...form?.getFieldsValue(), [item]: fixedParamVal })
338
- }
339
- });
340
- }
341
-
342
- // 数组对象处理,对带有特殊标记的name进行处理
343
- for (const key in params) {
344
- if (Object.prototype.hasOwnProperty.call(params, key)) {
345
- const element = params[key];
346
- if (element && key.indexOf('*number*') >= 0) {
347
- const dataParams = key.split('*number*');
348
- dataParams.forEach((value, index) => {
349
- params[value] = element[index];
350
- });
351
- delete params[key];
352
- } else if (element && key.indexOf('*address*') >= 0) {
353
- const dataParams = key.split('*address*');
354
- dataParams.forEach((value, index) => {
355
- params[value] = element.PCDCode[index];
356
- });
357
- delete params[key];
358
- } else if (element && key.indexOf('*costType*') >= 0) {
359
- const dataParams = key.split('*costType*');
360
- // eslint-disable-next-line prefer-destructuring
361
- params[dataParams[0]] = element[1];
362
- delete params[key];
363
- } else if (element && key.indexOf('*fullDate*') >= 0) {
364
- const dataParams = key.split('*fullDate*');
365
- dataParams.forEach((value, index) => {
366
- if (index === 0) {
367
- params[value] = moment(element[index])
368
- .millisecond(0)
369
- .second(0)
370
- .minute(0)
371
- .hour(0)
372
- .format('YYYY-MM-DD HH:mm:ss');
373
- } else {
374
- params[value] = moment(element[index])
375
- .millisecond(59)
376
- .second(59)
377
- .minute(59)
378
- .hour(23)
379
- .format('YYYY-MM-DD HH:mm:ss');
380
- }
381
- });
382
- delete params[key];
383
- } else if (typeof element === 'boolean' && key.indexOf('*checkBox*') >= 0) {
384
- const dataParams = key.split('*checkBox*');
385
- if (element) {
386
- params[dataParams[0]] = 0
387
- }
388
- delete params[key];
389
- } else if (element && key.indexOf('*cascader*') >= 0) {
390
- const dataParams = key.split('*cascader*');
391
- params[dataParams[0]] = element[element.length - 1]
392
- delete params[key];
393
- } else if (element && key.indexOf('*date*') >= 0) {
394
- const dataParams = key.split('*date*')
395
- dataParams.forEach((value, index) => {
396
- if (index === 0) {
397
- params[value] = moment(element[index])
398
- .format('YYYY-MM-DD');
399
- } else {
400
- params[value] = moment(element[index])
401
- .format('YYYY-MM-DD');
402
- }
403
- });
404
- delete params[key];
405
- }
406
- else if (element && key.indexOf('*') >= 0) {
407
- const dataParams = key.split('*');
408
- dataParams.forEach((value, index) => {
409
- params[value] = element[index].format('YYYY-MM-DD HH:mm:ss');
410
- });
411
- delete params[key];
412
- } else if (element && key.indexOf('_selectNumberRange') >= 0) { // key = xxxxx_selectNumberRange qp-xxxxx-gt
413
- const dataParams = key.split('_selectNumberRange')[0]
414
- if (params[key][0] === 'range') {
415
- if (params[key][1][0]) {
416
- params[`qp-${dataParams}-ge`] = params[key][1][0]
417
- }
418
- if (params[key][1][1]) {
419
- params[`qp-${dataParams}-le`] = params[key][1][1]
420
- }
421
- } else {
422
- params[`qp-${dataParams}-${params[key][0]}`] = params[key][1]
423
- }
424
- delete params[key]
425
- } else if (Array.isArray(element)) {
426
- params[key] = element.join(',');
427
- } else if (element == null || element === undefined || String(element).trim() === '') {
428
- delete params[key]
429
- }
430
- }
431
- }
432
-
433
- const queryParams = {
434
- pageSize,
435
- currentPage,
436
- ...otherParams, // 默认参数
437
- ...fixedParam,
438
- ...params,
439
- }
440
- axios
441
- .get(`${url}?${stringify(queryParams)}`)
442
- .then((result: any) => {
443
- setFetching(false)
444
- result = result.data;
445
- if ((result?.status && result.status !== '0') || (result?.code && result.code !== '000000')) {
446
- message.error(result.msg);
447
- return;
448
- }
449
- const res = result.data;
450
- let source = [];
451
- if (isMap) {
452
- source = Object.keys(res).map((d, i) => {
453
- return {
454
- text: Object.values(res)[i],
455
- value: d,
456
- };
457
- });
458
- } else {
459
- const keys = res.list ? 'list' : 'items';
460
- source = res
461
- ? res[keys]
462
- ? res[keys].map((item: any) => {
463
- let textShowText = item[mappingTextField]
464
- if (mappingTextShowTextField) {
465
- textShowText = []
466
- if (Array.isArray(mappingTextShowTextField)) {
467
- mappingTextShowTextField.forEach((r: any) => {
468
- textShowText.push(item[r])
469
- })
470
- } else {
471
- textShowText = item[mappingTextShowTextField]
472
- }
473
- }
474
- return {
475
- ...item,
476
- text: item[mappingTextField],
477
- textShowText,
478
- textShowKey: item[mappingTextShowKeyField || mappingValueField],
479
- value: item[mappingValueField],
480
- baseUnitCode: item?.packingUnitList?.find((item: any) => item.baseUnit === true)?.unitCode
481
- };
482
- })
483
- : Array.isArray(res) &&
484
- res?.map((item: Record<string, any>) => {
485
- let textShowText = item[mappingTextField]
486
- if (mappingTextShowTextField) {
487
- textShowText = []
488
- if (Array.isArray(mappingTextShowTextField)) {
489
- mappingTextShowTextField.forEach((r: any) => {
490
- textShowText.push(item[r])
491
- })
492
- } else {
493
- textShowText = item[mappingTextShowTextField]
494
- }
495
- }
496
- return {
497
- ...item,
498
- text: item[mappingTextField],
499
- textShowText,
500
- textShowKey: item[mappingTextShowKeyField || mappingValueField],
501
- value: item[mappingValueField],
502
- baseUnitCode: item?.packingUnitList?.find((item: any) => item.baseUnit === true)?.unitCode
503
- };
504
- })
505
- : [];
506
- }
507
- source = Array.isArray(source) ? source : []
508
- if (type === 1) {
509
- ctx?.form?.setFieldSource(resultSourceKey, source)
510
- setItems(source)
511
- setItemsTotal(Number(res?.total || res?.totalCount || source.length))
512
- } else {
513
- setTableData(source)
514
- setTablePagination({ ...tablePagination, total: Number(res?.total || res?.totalCount || source.length), pageSize: Number(res?.size || res?.pageSize || (params?.pageSize || pageSize)), current: Number(res?.page || res?.currentPage || (params?.currentPage || currentPage)) })
515
- }
516
- })
517
- .catch((err) => { setFetching(false) });
518
- }
519
-
520
- const SelectScroll = e => {
521
- e.persist();
522
- const { target } = e;
523
- const totalPage = Math.ceil(itemsTotal / pageSize)
524
- // 判断是否滑动到底部
525
- const isTouchGround = target.scrollTop + target.offsetHeight === target.scrollHeight // >=scrollHeight
526
- // 判断数据是否还没有加载到了最后一页
527
- const canPageAdd = scrollPage < totalPage
528
- if (isTouchGround && canPageAdd) {
529
- const nextScrollPage = scrollPage + 1;
530
- setScrollPage(nextScrollPage);
531
- getData({ currentPage: nextScrollPage }); // 调用api方法
532
- }
533
-
534
- //判断是否滑动到顶部
535
- const isTouchTop = target.scrollTop === 0 // <=0
536
- // 判断数据是否到第一页
537
- const canPageJian = scrollPage > 1
538
- if (isTouchTop && canPageJian) {
539
- const preScrollPage = scrollPage - 1;
540
- setScrollPage(preScrollPage);
541
- getData({ currentPage: preScrollPage }); // 调用api方法
542
- }
543
- }
544
-
545
- useEffect(() => {
546
- Promise.all([
547
- loadSelectSource(`/items/brand/queryBrandList`, {
548
- pageSize: 5000,
549
- currentPage: 1,
550
- 'ctl-withAuth': true
551
- }),
552
- loadSelectSource(`/items/category/queryCategoryTree`, {
553
- pageSize: 5000,
554
- currentPage: 1,
555
- }),
556
- ]).then((x: any)=>{
557
- formatSource(x,0, 2, tableSearchForm,['id','name'])
558
- formatTreeDataSource(x,1, 3, tableSearchForm)
559
- })
560
- }, [])
561
-
562
- useEffect(() => {
563
- if (value) {
564
- setPopValue(value);
565
- }
566
- }, [value]);
567
-
568
- useEffect(() => {
569
- makeUniqueValue();
570
- }, [sourceName])
571
-
572
- const showModal = () => {
573
- // getData({ pageSize: tableInitPageSize, currentPage: 1 }, 2)
574
- setIsModalVisible(true);
575
- // 回显
576
- if (value) {
577
- if (selectMode) {
578
- setSelectedRowKeys(labelInValue ? value.map(i => i.key) : value)
579
- setPopValue(labelInValue ? value.map(i => ({ value: i.key, text: i.label })) : value.map(i => ({ value: i })));
580
- setIndeterminate(!!value.length && value.length < itemsTotal);
581
- setCheckedAll(itemsTotal && value.length === itemsTotal);
582
- // 需清空数据
583
- if (!value.length) {
584
- setDoubleArr([])
585
- }
586
- } else {
587
- setSelectedRowKeys(labelInValue ? [value.key] : [value])
588
- setPopValue(labelInValue ? [{ value: value.key, text: value.label }] : [{ value: value }]);
589
- }
590
- }
591
-
592
- setTimeout(() => {
593
- document.getElementById("first-query")?.focus()
594
- }, 50)
595
- };
596
-
597
- const handleShowModal = () => {
598
- if(beforeShowModal) {
599
- beforeShowModal(popvalue).then(res => {
600
- showModal()
601
- }).catch(Error => {
602
- message.warning(Error)
603
- })
604
- } else {
605
- showModal()
606
- }
607
- }
608
-
609
- const handleSelectOver = (selectedValue: any) => {
610
- if (selectedValue?.length) {
611
- formaData(selectedValue);
612
- // 解决选择最后1页的sku,返回后,不显示名称问题
613
- const source = _.uniqBy(items.concat(selectedValue), 'value')
614
- ctx?.form?.setFieldSource(resultSourceKey, source)
615
- setItems(source)
616
- }
617
- }
618
-
619
- const handleLoading = (isContinue,flag) => {
620
- isContinue ? setConfirmContinueLoading(flag) : setConfirmLoading(flag);
621
- }
622
-
623
- const handleOk = (isContinue) => {
624
- if(!popvalue.length) {
625
- message.warning('至少选中一条数据')
626
- return;
627
- }
628
- // handleSelectOver(popvalue)
629
- if(onSaveCallback) {
630
- handleLoading(isContinue,true)
631
- onSaveCallback(popvalue).then(res => {
632
- if(true) {
633
- message.success('保存成功')
634
- deleteSelectRows();
635
- document.getElementById('first-query')?.focus()
636
- !isContinue && handleCancel();
637
- } else {
638
- }
639
- handleLoading(isContinue,false)
640
- }).catch(Error => {
641
- message.error(Error);
642
- handleLoading(isContinue,false)
643
- })
644
- } else {
645
- !isContinue && handleCancel();
646
- }
647
- };
648
-
649
- const formaData = (value) => {
650
- if (labelInValue) {
651
- const formatResult = value.map((i: any) => ({ key: i[mappingValueField], label: i[mappingTextField], value: i[mappingValueField] }))
652
- onChange(selectMode ? formatResult : formatResult[0])
653
- } else {
654
- const formatResult = selectMode ? value.map((i: any) => i.value) : _.get(value[0], 'value')
655
- onChange(formatResult)
656
- }
657
- };
658
-
659
- const handleCancel = () => {
660
- form.resetFields();
661
- setTableFormParams({});
662
- setIsModalVisible(false);
663
- setTableData([])
664
- // if (selectMode) {
665
- // run();
666
- // }
667
- };
668
-
669
- const onSearchChange = (e) => {
670
- setSearchValue(e.target.value);
671
- run();
672
- }
673
-
674
- const onSearchBlur = () => {
675
- setSearchValue('')
676
- run();
677
- }
678
-
679
- const onSearchTable = () => {
680
- const params = form.getFieldsValue();
681
- setTableFormParams(params);
682
- getData({ ...params, pageSize: tableInitPageSize }, 2)
683
- if (selectMode) {
684
- getData(params)
685
- }
686
- }
687
-
688
- const onResetTable = () => {
689
- form.resetFields();
690
- setTableFormParams({});
691
- getData({ pageSize: tableInitPageSize, currentPage: 1 }, 2)
692
- }
693
-
694
- const handleTableChange = (pagination) => {
695
- getData({ ...tableFormParams, pageSize: pagination.pageSize, currentPage: pagination.current }, 2)
696
- }
697
-
698
- // 扁平化二维数组的方法
699
- const mapRows = params => {
700
- var res = [];
701
- for (var i = 0; i < params.length; i++) {
702
- if (Array.isArray(params[i])) {
703
- // 去重
704
- res = _.uniqBy(res.concat(mapRows(params[i])), 'value');
705
- } else {
706
- res.push(params[i]);
707
- // 去重
708
- res = _.uniqBy(res, 'value')
709
- }
710
- }
711
- return res.filter(Boolean); //去掉undefined的情况
712
- };
713
-
714
- const onChangeSelectedKeys = (selectKeys, selectRows) => {
715
- if(selectKeys.length - selectedRowKeys.length > 0) {
716
- if (selectKeys.length - selectedRowKeys.length === 1) {
717
- selectRows[selectRows.length -1]['needFocus'] = true;
718
- } else {
719
- selectRows[selectedRowKeys.length]['needFocus'] = true;
720
- }
721
- }
722
- setPopValue(selectRows);
723
- setSelectedRowKeys(selectKeys)
724
- // setIndeterminate(!!filterRows.length && filterRows.length < tablePagination?.total);
725
- // setCheckedAll(filterRows.length === tablePagination?.total);
726
- }
727
-
728
- // 生成唯一值
729
- const makeUniqueValue = () => {
730
- const generateUnitKey = (((1 + Math.random()) * 0x10000) | 0).toString(16);
731
- setUniqueValue(generateUnitKey);
732
- return generateUnitKey;
733
- }
734
-
735
- const rowSelection = {
736
- type: 'checkbox',
737
- selectedRowKeys,
738
- preserveSelectedRowKeys: true,
739
- onChange: (sks, srs) => {
740
- onChangeSelectedKeys(sks, srs)
741
- },
742
- getCheckboxProps: () => ({
743
- disabled: selectProps?.disabled || props?.disabled,
744
- }),
745
- };
746
-
747
- const onDoubleClickSelect = (e, record) => {
748
- if (!selectMode) {
749
- const srs = [JSON.parse(JSON.stringify(record))]
750
- const sks = srs.map((i: any) => i.value)
751
- onChangeSelectedKeys(sks, srs)
752
- }
753
- }
754
-
755
- const themeColor = { color: '#005CFF' }
756
-
757
- const formItem = (list) => {
758
- if (isModalVisible && list?.length) {
759
- return list.map((i: any, index) => {
760
- if (i?.type === 'select' || i?.field?.type === 'select') {
761
- return (
762
- <Form.Item name={i.name} label={i.label} key={i.name}>
763
- <Select style={{ width: '100%' }} placeholder='请选择' {...i?.field?.props}>
764
- {i?.initialSource?.length && i?.initialSource.map((m: any) => (
765
- <Option value={m.value} key={m.value}>{m.text}</Option>
766
- ))}
767
- </Select>
768
- </Form.Item>
769
- )
770
- }
771
-
772
- if (i?.type === 'treeSelect' || i?.field?.type === 'treeSelect') {
773
- return (
774
- <Form.Item name={i.name} label={i.label} key={i.name}>
775
- <TreeSelect style={{ width: '100%' }} placeholder='请选择' {...i?.field?.props}></TreeSelect>
776
- </Form.Item>
777
- )
778
- }
779
-
780
- if (i?.type === 'BusinessSearchSelect' || i?.field?.type === 'BusinessSearchSelect') {
781
- return (
782
- <div>
783
- <Form.Item name={i.name} label={i.label} key={i.name}>
784
- <BusinessSearchSelect {...i.field.props} />
785
- </Form.Item>
786
- </div>
787
- )
788
- }
789
-
790
- if (i?.type === 'multipleQueryInput' || i?.field?.type === 'multipleQueryInput') {
791
- return (
792
- <div>
793
- <Form.Item name={i.name} label={i.label} key={i.name}>
794
- <QueryMutipleInput onValueChange={(value) => {
795
- form.setFieldsValue({
796
- [i.name]: value
797
- })
798
- }} />
799
- </Form.Item>
800
- </div>
801
- );
802
- }
803
-
804
- // 默认type是input
805
- return (
806
- <Form.Item name={i.name} label={i.label} key={i.name}>
807
- <Input id={index === 0 ? "first-query" : 'index'} style={{ width: '100%' }} onKeyDown={(e) => {
808
- if (e.keyCode === 13) {
809
- onSearchTable()
810
- }
811
- }} placeholder='请输入' allowClear maxLength={100} {...i?.field?.props} />
812
- </Form.Item>
813
- )
814
- })
815
- } else {
816
- return null
817
- }
818
- }
819
-
820
- const maxTagPlaceholder = (selectedValues) => {
821
- const onClose = (e: any, item: any) => {
822
- e.preventDefault();
823
- const newValue = labelInValue ? JSON.parse(JSON.stringify(value)).filter((i: any) => i.value !== item.value) : JSON.parse(JSON.stringify(value)).filter((i: any) => i !== item.value)
824
- onChange(newValue);
825
- }
826
- return (
827
- <Tooltip title={selectedValues.map((i: any) => (
828
- <Tag
829
- closable={true}
830
- onClose={(e) => onClose(e, i)}
831
- style={{ marginRight: 3, background: '#f5f5f5', height: '24px', border: '1px solid #f0f0f0' }}
832
- >
833
- {i.label}
834
- </Tag>
835
- ))}>
836
- {`+ ${selectedValues?.length}`}
837
- </Tooltip>
838
- )
839
- }
840
-
841
- const deleteSelectRows = () => {
842
- setPopValue([])
843
- setSelectedRowKeys([])
844
- }
845
-
846
- const deleteRecord = (record) => {
847
- setPopValue(popvalue.filter(item => item.skuCode !== record.skuCode))
848
- setSelectedRowKeys([...selectedRowKeys.filter(item => item !== record.skuCode)])
849
- }
850
-
851
- let inputIndex = 0;
852
-
853
- useEffect(() => {
854
- setInitialShowColumn(codeSelected,selectColumns,(res) => {
855
- setShowColumnsCallback(res)
856
- })
857
- },[selectColumns])
858
- useEffect(() => {
859
- setInitialShowColumn(codeToChoose,tableColumns,(res) => {
860
- setShowToChooseColumnsCallback(res)
861
- })
862
- },[tableColumns])
863
-
864
- const handleResize = (arr,index: any, callback) => (_: any, { size }: any) => {
865
- let newColumns = arr.map((col: any) => ({ ...col }));
866
- const handleIndex = (arr: any, indexArr: any) => {
867
- let i = indexArr.shift();
868
- if (indexArr.length > 0) {
869
- handleIndex(arr[i].children, indexArr);
870
- } else {
871
- arr[i] = {
872
- ...arr[i],
873
- width: size.width,
874
- };
875
- handleAntdColumnsSpecialParams(arr[i]);
876
- }
877
- };
878
- handleIndex(newColumns, [...index]);
879
- callback(newColumns)
880
- };
881
-
882
- const setShowColumnsCallback = (newColumns: Array<any>) => {
883
- setShowColumns([...newColumns])
884
- }
885
- const setShowToChooseColumnsCallback = (newColumns: Array<any>) => {
886
- setShowToChooseColumns([...newColumns])
887
- }
888
-
889
- const handleColumns = (arr: any, indexArr: any[], callback: any) => {
890
- arr.forEach((item: any, index: any) => {
891
- let indexArrInside = [...indexArr, index].filter((i: any) => i || i === 0)
892
- if (noEmptyArray(item.children)) {
893
- handleColumns(item.children, indexArrInside);
894
- } else {
895
- item.width = item.width || getItemDefaultWidth(item);
896
- item.onHeaderCell = (column: any) => ({
897
- ...item,
898
- width:
899
- typeof column.width === 'number'
900
- ? column.width
901
- : parseInt(column.width.replace('px', '')),
902
- onResize: handleResize(arr,indexArrInside, callback),
903
- });
904
- }
905
- })
906
- };
907
- let showToChooseCol = showToChooseColumns.map((item: any) => {
908
- handleAntdColumnsSpecialParams(item);
909
- return ({ ...item })
910
- })
911
- handleColumns(showToChooseCol, [],(res)=> setShowToChooseColumnsCallback(res));
912
- let showSelectedCol = showColumns.map((item: any) => {
913
- handleAntdColumnsSpecialParams(item);
914
- return ({ ...item })
915
- })
916
- handleColumns(showSelectedCol, [],(res)=> setShowColumnsCallback(res));
917
-
918
- return (
919
- <div className={'add_select'}>
920
- <div className="add_select_show" id={`add_select_div_${uniqueValue}`}>
921
- <Button onClick={handleShowModal} {...realButtonProps}>
922
- {buttonText}
923
- </Button>
924
- </div>
925
- {needModalTable && isModalVisible && (
926
- <Modal
927
- width='1200px'
928
- style={{ top: 20 }}
929
- bodyStyle={{ padding: '0px' }}
930
- // title={modalTableProps?.modalTableTitle}
931
- visible={isModalVisible}
932
- closable={false}
933
- onCancel={handleCancel}
934
- footer={selectMode ? [
935
- <Button key="back" onClick={handleCancel}>
936
- 取消
937
- </Button>,
938
- <Button
939
- key="save-and-continue"
940
- style={{color: '#005CFF', borderColor: '#005CFF'}}
941
- onClick={() => {handleOk(true)}}
942
- loading={confirmContinueLoading}
943
- disabled={!tableData.length || (selectProps?.disabled || props?.disabled)}
944
- >
945
- 保存并继续
946
- </Button>,
947
- <Button
948
- key="submit"
949
- type="primary"
950
- onClick={() => {handleOk(false)}}
951
- loading={confirmLoading}
952
- disabled={!tableData.length || (selectProps?.disabled || props?.disabled)}
953
- >
954
- 确定
955
- </Button>,
956
- ] : null}
957
- >
958
- <div>
959
- <div className='add_select_header'>
960
- {modalTableProps?.modalTableTitle}
961
- <span><span>*</span> &nbsp;快捷键:【Tab】-跳格切换;【Shift+←、→】-当前行左、右移动;【 ↑、↓】-当前列上、下移动;【ctrl+Enter】-保存并继续;【ctrl+Delete】-删除当前行;</span>
962
- <span className='add_select_header_close'><CloseCircleOutlined style={{fontSize: '20px'}} onClick={handleCancel} /></span>
963
- </div>
964
- <div className={'add_select_wrapper'}>
965
- <div className={caretLeftFlag ? 'add_select_wrapper_left' : 'add_select_wrapper_left1'}>
966
- <div className={'select_list_columns'}>
967
- <div className={'select_list_columns_formItems'}>
968
- <Form form={form} layout='vertical' key='modalForm'>
969
- {formItem(tableSearchForm)}
970
- </Form>
971
- </div>
972
- </div>
973
- <div className={'select_list_searchButton'}>
974
- <Button key='reset' className={'select_list_button_space'} onClick={onResetTable}>重置</Button>
975
- <Button key='search' type="primary" onClick={onSearchTable}>查询</Button>
976
- </div>
977
- </div>
978
- <div className={caretLeftFlag ? 'add_select_wrapper_right' : 'add_select_wrapper_right1'}>
979
- <div>
980
- <div className={'select_list_selectTips'}>
981
- <div style={{ marginLeft: 8 }}>搜索结果共&nbsp;<span style={themeColor}>{tablePagination?.total || 0}</span>&nbsp;项{selectMode ? <span>, 本次已选&nbsp;<span style={themeColor}>{selectedRowKeys?.length || 0}</span>&nbsp;项</span> : ''}</div>
982
- <div>
983
- <span style={{ marginRight: 8 }}>
984
- <TableColumnSetting
985
- setShowColumns={setShowToChooseColumnsCallback}
986
- showColumns={showToChooseColumns}
987
- datasource={tableColumns || []}
988
- tableCode={codeToChoose}
989
- settingImgAttribute={{ width: 20, style: { marginTop: -2 } }}
990
- />
991
- </span>
992
- </div>
993
- </div>
994
- <Table
995
- size='small'
996
- rowSelection={rowSelection}
997
- columns={showToChooseCol}
998
- dataSource={tableData}
999
- pagination={tablePagination}
1000
- loading={fetching}
1001
- onChange={handleTableChange}
1002
- rowKey={mappingValueField}
1003
- rowClassName={'row-class'}
1004
- scroll={{ y: 500 }}
1005
- components={{
1006
- header: {
1007
- cell: ResizeableTitle,
1008
- },
1009
- }}
1010
- />
1011
- </div>
1012
- </div>
1013
- {/* <div>
1014
- <Table
1015
- size='small'
1016
- columns={modalTableProps?.tableColumns}
1017
- dataSource={mapRows(doubleArr)}
1018
- rowKey={mappingValueField}
1019
- scroll={{ x: modalTableProps.overScrollX || 'max-content', y: modalTableProps.overScrollY || null }}
1020
- onRow={record => {
1021
- return {
1022
- onDoubleClick: event => onDoubleClickSelect(event, record),
1023
- };
1024
- }}
1025
- />
1026
- </div> */}
1027
- </div>
1028
- <div className={'add_select_wrapper_select'}>
1029
- <div className={'select_list_selectTips'}>
1030
- <div style={{ marginLeft: 8 }}><span>本次已选&nbsp;<span style={themeColor}>{selectedRowKeys?.length || 0}</span>&nbsp;项</span></div>
1031
- <div style={{ display: 'flex' }}>
1032
- <span style={{ marginRight: 8 }}>
1033
- <TableColumnSetting
1034
- setShowColumns={setShowColumnsCallback}
1035
- showColumns={showColumns}
1036
- datasource={selectColumns || []}
1037
- tableCode={codeSelected}
1038
- settingImgAttribute={{ width: 20, style: { marginTop: -2 } }}
1039
- />
1040
- </span>
1041
- <div style={{ marginRight: 8 }}><span onClick={deleteSelectRows} style={{ ...themeColor, cursor: 'pointer' }}>清空所选商品</span></div>
1042
- </div>
1043
- </div>
1044
- <Table
1045
- size='small'
1046
- columns={showSelectedCol}
1047
- dataSource={popvalue}
1048
- pagination={false}
1049
- // onChange={handleTableChange}
1050
- rowKey={mappingValueField}
1051
- rowClassName={'row-class'}
1052
- scroll={{ y: 500 }}
1053
- onRow={record => {
1054
- return {
1055
- onDoubleClick: event => onDoubleClickSelect(event, record),
1056
- };
1057
- }}
1058
- components={{
1059
- header: {
1060
- cell: ResizeableTitle,
1061
- },
1062
- }}
1063
- />
1064
- </div>
1065
- </div>
1066
- </Modal>
1067
- )}
1068
- </div>
1069
- );
1070
- };
1071
-
1072
- export default AddSelect;
1
+ // @ts-nocheck
2
+ import React, { useState, useEffect } from 'react';
3
+ import { useDebounceFn } from 'ahooks';
4
+ import { Input, Button, Modal, Select, InputNumber, message, Spin, Form, Table, Checkbox, TreeSelect, Tooltip, Tag } from 'antd';
5
+ import { SearchOutlined, CopyOutlined, CloseCircleOutlined } from '@ant-design/icons';
6
+ import axios from 'axios';
7
+ import { stringify } from 'querystring';
8
+ import _ from "lodash"
9
+ import './index.less';
10
+ import { BusinessSearchSelect, QueryMutipleInput } from '@/index';
11
+ import { Resizable } from 'react-resizable';
12
+ import { checkQuantityAccuracy, precisionQuantity } from '@/utils/checkUtils';
13
+ import TableColumnSetting from '@/plugin/TableColumnSetting';
14
+ import { setInitialShowColumn } from '@/plugin/TableColumnSetting/utils';
15
+ import { handleAntdColumnsSpecialParams } from '@/utils/utils';
16
+ import { getItemDefaultWidth, noEmptyArray } from '@/components/Business/columnSettingTable/utils';
17
+
18
+ const loadSelectSource = (url: string, params?: any) => {
19
+ return new Promise((resolve, reject) => {
20
+ axios
21
+ .get(`${url}?${stringify(params)}`)
22
+ .then((result: any) => {
23
+ result = result.data;
24
+ if ((result?.status && result.status !== '0') || (result?.code && result.code !== '000000')) {
25
+ message.error(result.msg);
26
+ return;
27
+ }
28
+ resolve(result);
29
+ })
30
+ .catch((err) => {
31
+ reject(err);
32
+ });
33
+ })
34
+ };
35
+
36
+ const ResizeableTitle = (props) => {
37
+ const { onResize, width, ...restProps } = props;
38
+
39
+ if (!width) {
40
+ return <th {...restProps} />;
41
+ }
42
+ return (
43
+ <Resizable
44
+ width={width}
45
+ height={0}
46
+ onResize={onResize}
47
+ draggableOpts={{ enableUserSelectHack: false }}
48
+ >
49
+ <th {...restProps} />
50
+ </Resizable>
51
+ );
52
+ };
53
+
54
+ const formatSource = (reData: any, position: number, changePosition: number,changeSearchForm: any,resKeyValue=['code', 'name']) => {
55
+ const data = reData && reData[position]?.data;
56
+ const list = Array.isArray(data) ? data :(data?.items || data?.list || data?.children || []);
57
+ const formatData = list?.length ? list.map((v: any) => ({ text: v[resKeyValue[1]], value: v[resKeyValue[0]] })) : [];
58
+ changeSearchForm[changePosition] = {...changeSearchForm[changePosition], initialSource: formatData}
59
+ }
60
+
61
+ // 格式化树选择器数据源
62
+ const mapSearchTree = (treeDataItem: any, resKeyValue: any) => {
63
+ const haveChildren = Array.isArray(treeDataItem.children) && treeDataItem.children.length > 0;
64
+ return {
65
+ title: treeDataItem[resKeyValue[1]],
66
+ value: treeDataItem[resKeyValue[0]],
67
+ parentId: treeDataItem.parent,
68
+ data: { ...treeDataItem },
69
+ isLeaf: !haveChildren,
70
+ disabled: haveChildren,
71
+ children: haveChildren ? treeDataItem.children.map((i: any) => mapSearchTree(i, resKeyValue)) : [],
72
+ };
73
+ };
74
+ const formatTreeDataSource = (reData: any, position: number, changePosition: number,changeSearchForm: any,resKeyValue=['id', 'name']) => {
75
+ const data = reData && reData[position]?.data;
76
+ const formatData = (data &&
77
+ Array.isArray(data) &&
78
+ data.length &&
79
+ data.map((ites: any) => mapSearchTree(ites, resKeyValue))) ||
80
+ []
81
+ changeSearchForm[changePosition].field.props.treeData = formatData;
82
+ }
83
+
84
+ const { Option } = Select;
85
+
86
+ const AddSelect = (props: any) => {
87
+ const {
88
+ value, // 必传
89
+ onChange,
90
+ selectProps = {},
91
+ modalTableProps = {},
92
+ labelInValue = false,
93
+ requestConfig,
94
+ ctx,
95
+ sourceName,
96
+ needModalTable = true,
97
+ getPopupContainer = undefined,
98
+ onSaveCallback,
99
+ buttonText = '添加',
100
+ buttonProps = {},
101
+ beforeShowModal,
102
+ tableCodeList = [], // 非必填 默认取组件定义code,如需自定义----数组第一位为供选择商品的table的code,第二位为已选择商品的table的code
103
+ } = props;
104
+ const { url, otherParams, isMap, fixedparameter, fieldValToParam, mappingTextField = 'name', mappingTextShowKeyField, mappingValueField = 'code', mappingTextShowTextField } = requestConfig || {};
105
+ const resultSourceKey = sourceName || requestConfig?.sourceName || 'supplierCode'
106
+ const realButtonProps = {type: "primary", ...buttonProps};
107
+
108
+ const selectMode = selectProps?.mode // 设定当前选择器 为单选或者多选模式 无设定为单选模式(默认)
109
+ const initVal = value || (selectMode ? [] : null);
110
+ const pageSize = 100 // 下拉框默认分页 条数
111
+ const tableInitPageSize = 10 // 弹框默认分页 条数
112
+ const currentPage = 1
113
+ const selectParamsKey = requestConfig?.filter || 'qp-codeAndName-like'
114
+ const selectParamsInitKey = requestConfig?.filterInit || selectParamsKey
115
+ const currentSelectProps = {
116
+ ...selectProps,
117
+ // 以下属性不可更改----设计配置项
118
+ showSearch: false,
119
+ filterOption: false,
120
+ allowClear: true,
121
+ listHeight: 160,
122
+ optionLabelProp: "label",
123
+ autoClearSearchValue: false
124
+ }
125
+ const [items, setItems] = useState([]);
126
+ const [scrollPage, setScrollPage] = useState(1);
127
+ const [itemsTotal, setItemsTotal] = useState(0);
128
+ const [fetching, setFetching] = useState(false);
129
+ const [searchValue, setSearchValue] = useState('');
130
+ const [isModalVisible, setIsModalVisible] = useState(false);
131
+ const [popvalue, setPopValue] = useState(initVal);
132
+ const [uniqueValue, setUniqueValue] = useState(sourceName)
133
+ const { run } = useDebounceFn(
134
+ (v?: any) => {
135
+ // 优化搜索参数 支持传多个
136
+ let searchParams = {};
137
+ if (typeof selectParamsKey === 'string') {
138
+ searchParams = v ? { [selectParamsInitKey]: initVal } : { [selectParamsKey]: searchValue }
139
+ }
140
+ if (Array.isArray(selectParamsKey)) {
141
+ selectParamsKey.forEach((i: any) => {
142
+ searchParams = { ...searchParams, [i]: searchValue }
143
+ })
144
+ }
145
+ // 防抖函数 待定
146
+ getData(searchParams)
147
+ },
148
+ {
149
+ wait: 1000,
150
+ },
151
+ );
152
+
153
+ const [form] = Form.useForm();
154
+ const [tableSearchForm, setTableSearchForm] = useState(modalTableProps?.tableSearchForm)
155
+ const [caretLeftFlag, setCaretLeftFlag] = useState(true);
156
+ const [tableData, setTableData] = useState([]);
157
+ const [tablePagination, setTablePagination] = useState({ total: 0, size: "small", current: 1, pageSize: tableInitPageSize })
158
+ const [selectedRowKeys, setSelectedRowKeys] = useState([]);
159
+ const [doubleArr, setDoubleArr] = useState([]); // 存放双数组的数组
160
+ const [checkedAll, setCheckedAll] = useState(false)
161
+ const [indeterminate, setIndeterminate] = useState(false)
162
+ const [tableFormParams, setTableFormParams] = useState({});
163
+ const [confirmLoading, setConfirmLoading] = useState(false);
164
+ const [confirmContinueLoading, setConfirmContinueLoading] = useState(false);
165
+
166
+ const [selectColumns, setSelectColumns] = useState([]);
167
+ const [showColumns, setShowColumns] = useState([]);
168
+ const [tableColumns, setTableColumns] = useState([]);
169
+ const [showToChooseColumns, setShowToChooseColumns] = useState([]);
170
+ const codeToChoose = tableCodeList[0] || 'skuSelect-tableOptionsToChoosePartCode';
171
+ const codeSelected = tableCodeList[1] || 'skuSelect-tableSelectedItemPartCode';
172
+
173
+ useEffect(() => {
174
+ setTableColumns(modalTableProps?.tableColumns)
175
+ }, [modalTableProps?.tableColumns])
176
+
177
+ useEffect(() => {
178
+ setSelectColumns([... modalTableProps.selectColumn.map(item => {
179
+ const inputLength = modalTableProps.selectColumn.filter(item => item.isInputItem).length
180
+ const currentIndex = inputIndex
181
+
182
+ if (item.isInputItem) {
183
+ inputIndex++;
184
+ return {
185
+ ...item,
186
+ render: (text, record, index) => {
187
+ // let
188
+ if(record.needFocus === true && currentIndex === 0) {
189
+
190
+ }
191
+ let precisionObj={};
192
+ const unitAccuracy = record.packingUnitList?.[0]?.unitAccuracy
193
+ const isCountUnitAccuracyCheck = item.dataIndex =='count' && unitAccuracy !== undefined
194
+ if(isCountUnitAccuracyCheck) {
195
+ precisionObj = {
196
+ onBlur: (e: any) => {
197
+ const { target: { value } } = e;
198
+ if(!checkQuantityAccuracy(value,Number(unitAccuracy))) {
199
+ record[item.dataIndex] = precisionQuantity(value,Number(unitAccuracy))
200
+ const newPopValue = popvalue.map((i: any, innerIndex: number) => {
201
+ if(innerIndex == index) {
202
+ i[item.dataIndex] = record[item.dataIndex]
203
+ }
204
+ return i
205
+ })
206
+ setPopValue(newPopValue)
207
+ }
208
+ }
209
+ // precision: unitAccuracy
210
+ }
211
+ }
212
+ return (
213
+ <InputNumber
214
+ value={text || ''}
215
+ min={0}
216
+ autoFocus={record.needFocus}
217
+ keyboard={false}
218
+ {...precisionObj}
219
+ onChange={(value) => {
220
+ record[item.dataIndex] = value
221
+ const newPopValue = popvalue.map((i: any, innerIndex: number) => {
222
+ if(innerIndex == index) {
223
+ i[item.dataIndex] = record[item.dataIndex]
224
+ }
225
+ return i
226
+ })
227
+ setPopValue(newPopValue)
228
+ }}
229
+ // onFocus={(e)=> {
230
+ // let dom1 = e.currentTarget;
231
+ // dom1.setSelectionRange(100, 0);
232
+ // dom1.select(text);
233
+ // }}
234
+ onKeyDown={(e) => {
235
+ if(e.keyCode === 13 && e.ctrlKey) {
236
+ handleOk(true)
237
+ document.getElementById("first-query")?.focus()
238
+ }
239
+ if(e.keyCode === 8 && e.ctrlKey) {
240
+ message.success('删除当前行')
241
+ e.stopPropagation();
242
+ e.preventDefault();
243
+ let dom = e.nativeEvent.path[5].children[index + 2]?.getElementsByTagName('input')[currentIndex]
244
+ if (dom) {
245
+ dom.select();
246
+ dom.focus();
247
+ dom.scrollIntoView(false)
248
+ }
249
+ dom = null
250
+ deleteRecord(record, popvalue);
251
+ }
252
+ if (e.keyCode === 37 && e.shiftKey) { // 左滑动
253
+ e.stopPropagation();
254
+ e.preventDefault();
255
+ let dom = e.nativeEvent.path[5].children[index + 1]?.getElementsByTagName('input')[currentIndex - 1]
256
+ if (dom) {
257
+ dom.select();
258
+ dom.focus();
259
+ dom.scrollIntoView(false)
260
+ }
261
+ dom = null
262
+ }
263
+ if (e.keyCode === 39 && e.shiftKey) { // 右滑
264
+ e.stopPropagation();
265
+ e.preventDefault();
266
+ let dom = e.nativeEvent.path[5].children[index + 1]?.getElementsByTagName('input')[currentIndex + 1]
267
+ if (dom) {
268
+ dom.select();
269
+ dom.focus();
270
+ dom.scrollIntoView(false)
271
+ }
272
+ dom = null
273
+ }
274
+ if (e.keyCode === 40) {
275
+ e.stopPropagation();
276
+ e.preventDefault();
277
+ let dom = e.nativeEvent.path[5].children[index + 2]?.getElementsByTagName('input')[currentIndex]
278
+ if (dom) {
279
+ dom.select();
280
+ dom.focus();
281
+ dom.scrollIntoView(false)
282
+ }
283
+ dom = null
284
+ } else if (e.keyCode === 38) {
285
+ e.stopPropagation();
286
+ e.preventDefault();
287
+ let dom1 = e.nativeEvent.path[5].children[index]?.getElementsByTagName('input')[currentIndex]
288
+ if (dom1) {
289
+ // dom1.value=""
290
+ // dom1.setSelectionRange(100, 0);
291
+ dom1.select();
292
+ dom1.focus();
293
+ dom1.scrollIntoViewIfNeeded(false)
294
+ // dom1.value=record['count']
295
+ }
296
+ dom1 = null
297
+ } else if (e.keyCode === 9 && index === selectedRowKeys.length - 1 && currentIndex === inputLength - 1) {
298
+ e.stopPropagation();
299
+ e.preventDefault();
300
+ }
301
+ }}
302
+ />
303
+ );
304
+ },
305
+ }
306
+ }
307
+
308
+ return item
309
+ }), {
310
+ title: '操作',
311
+ width: 50,
312
+ dataIndex: 'operation',
313
+ fixed: 'right',
314
+ render: (text, record, index) => {
315
+ return (
316
+ <span style={{cursor: 'pointer', color: '#005CFF' }} onClick={() => {
317
+ deleteRecord(record)
318
+ }} type={"text"}>删除</span>
319
+ )
320
+ }
321
+ },])
322
+ }, [modalTableProps?.selectColumn,popvalue])
323
+
324
+ // 获取数据源 (type: 1下拉框 2弹框 不传值默认为下拉框)
325
+ const getData = (params = {}, type = 1) => {
326
+ if (!requestConfig) return;
327
+
328
+ setFetching(true)
329
+
330
+ // 处理dependence参数
331
+ const fixedParam = {};
332
+ if (fixedparameter && fieldValToParam && ctx) {
333
+ fixedparameter.forEach((item: any, index: any) => {
334
+ const fixedParamVal = ctx.form.getFieldValue(fieldValToParam[index]);
335
+ if (fixedParamVal) {
336
+ fixedParam[item] = fixedParamVal;
337
+ form.setFieldsValue({ ...form?.getFieldsValue(), [item]: fixedParamVal })
338
+ }
339
+ });
340
+ }
341
+
342
+ // 数组对象处理,对带有特殊标记的name进行处理
343
+ for (const key in params) {
344
+ if (Object.prototype.hasOwnProperty.call(params, key)) {
345
+ const element = params[key];
346
+ if (element && key.indexOf('*number*') >= 0) {
347
+ const dataParams = key.split('*number*');
348
+ dataParams.forEach((value, index) => {
349
+ params[value] = element[index];
350
+ });
351
+ delete params[key];
352
+ } else if (element && key.indexOf('*address*') >= 0) {
353
+ const dataParams = key.split('*address*');
354
+ dataParams.forEach((value, index) => {
355
+ params[value] = element.PCDCode[index];
356
+ });
357
+ delete params[key];
358
+ } else if (element && key.indexOf('*costType*') >= 0) {
359
+ const dataParams = key.split('*costType*');
360
+ // eslint-disable-next-line prefer-destructuring
361
+ params[dataParams[0]] = element[1];
362
+ delete params[key];
363
+ } else if (element && key.indexOf('*fullDate*') >= 0) {
364
+ const dataParams = key.split('*fullDate*');
365
+ dataParams.forEach((value, index) => {
366
+ if (index === 0) {
367
+ params[value] = moment(element[index])
368
+ .millisecond(0)
369
+ .second(0)
370
+ .minute(0)
371
+ .hour(0)
372
+ .format('YYYY-MM-DD HH:mm:ss');
373
+ } else {
374
+ params[value] = moment(element[index])
375
+ .millisecond(59)
376
+ .second(59)
377
+ .minute(59)
378
+ .hour(23)
379
+ .format('YYYY-MM-DD HH:mm:ss');
380
+ }
381
+ });
382
+ delete params[key];
383
+ } else if (typeof element === 'boolean' && key.indexOf('*checkBox*') >= 0) {
384
+ const dataParams = key.split('*checkBox*');
385
+ if (element) {
386
+ params[dataParams[0]] = 0
387
+ }
388
+ delete params[key];
389
+ } else if (element && key.indexOf('*cascader*') >= 0) {
390
+ const dataParams = key.split('*cascader*');
391
+ params[dataParams[0]] = element[element.length - 1]
392
+ delete params[key];
393
+ } else if (element && key.indexOf('*date*') >= 0) {
394
+ const dataParams = key.split('*date*')
395
+ dataParams.forEach((value, index) => {
396
+ if (index === 0) {
397
+ params[value] = moment(element[index])
398
+ .format('YYYY-MM-DD');
399
+ } else {
400
+ params[value] = moment(element[index])
401
+ .format('YYYY-MM-DD');
402
+ }
403
+ });
404
+ delete params[key];
405
+ }
406
+ else if (element && key.indexOf('*') >= 0) {
407
+ const dataParams = key.split('*');
408
+ dataParams.forEach((value, index) => {
409
+ params[value] = element[index].format('YYYY-MM-DD HH:mm:ss');
410
+ });
411
+ delete params[key];
412
+ } else if (element && key.indexOf('_selectNumberRange') >= 0) { // key = xxxxx_selectNumberRange qp-xxxxx-gt
413
+ const dataParams = key.split('_selectNumberRange')[0]
414
+ if (params[key][0] === 'range') {
415
+ if (params[key][1][0]) {
416
+ params[`qp-${dataParams}-ge`] = params[key][1][0]
417
+ }
418
+ if (params[key][1][1]) {
419
+ params[`qp-${dataParams}-le`] = params[key][1][1]
420
+ }
421
+ } else {
422
+ params[`qp-${dataParams}-${params[key][0]}`] = params[key][1]
423
+ }
424
+ delete params[key]
425
+ } else if (Array.isArray(element)) {
426
+ params[key] = element.join(',');
427
+ } else if (element == null || element === undefined || String(element).trim() === '') {
428
+ delete params[key]
429
+ }
430
+ }
431
+ }
432
+
433
+ const queryParams = {
434
+ pageSize,
435
+ currentPage,
436
+ ...otherParams, // 默认参数
437
+ ...fixedParam,
438
+ ...params,
439
+ }
440
+ axios
441
+ .get(`${url}?${stringify(queryParams)}`)
442
+ .then((result: any) => {
443
+ setFetching(false)
444
+ result = result.data;
445
+ if ((result?.status && result.status !== '0') || (result?.code && result.code !== '000000')) {
446
+ message.error(result.msg);
447
+ return;
448
+ }
449
+ const res = result.data;
450
+ let source = [];
451
+ if (isMap) {
452
+ source = Object.keys(res).map((d, i) => {
453
+ return {
454
+ text: Object.values(res)[i],
455
+ value: d,
456
+ };
457
+ });
458
+ } else {
459
+ const keys = res.list ? 'list' : 'items';
460
+ source = res
461
+ ? res[keys]
462
+ ? res[keys].map((item: any) => {
463
+ let textShowText = item[mappingTextField]
464
+ if (mappingTextShowTextField) {
465
+ textShowText = []
466
+ if (Array.isArray(mappingTextShowTextField)) {
467
+ mappingTextShowTextField.forEach((r: any) => {
468
+ textShowText.push(item[r])
469
+ })
470
+ } else {
471
+ textShowText = item[mappingTextShowTextField]
472
+ }
473
+ }
474
+ return {
475
+ ...item,
476
+ text: item[mappingTextField],
477
+ textShowText,
478
+ textShowKey: item[mappingTextShowKeyField || mappingValueField],
479
+ value: item[mappingValueField],
480
+ baseUnitCode: item?.packingUnitList?.find((item: any) => item.baseUnit === true)?.unitCode
481
+ };
482
+ })
483
+ : Array.isArray(res) &&
484
+ res?.map((item: Record<string, any>) => {
485
+ let textShowText = item[mappingTextField]
486
+ if (mappingTextShowTextField) {
487
+ textShowText = []
488
+ if (Array.isArray(mappingTextShowTextField)) {
489
+ mappingTextShowTextField.forEach((r: any) => {
490
+ textShowText.push(item[r])
491
+ })
492
+ } else {
493
+ textShowText = item[mappingTextShowTextField]
494
+ }
495
+ }
496
+ return {
497
+ ...item,
498
+ text: item[mappingTextField],
499
+ textShowText,
500
+ textShowKey: item[mappingTextShowKeyField || mappingValueField],
501
+ value: item[mappingValueField],
502
+ baseUnitCode: item?.packingUnitList?.find((item: any) => item.baseUnit === true)?.unitCode
503
+ };
504
+ })
505
+ : [];
506
+ }
507
+ source = Array.isArray(source) ? source : []
508
+ if (type === 1) {
509
+ ctx?.form?.setFieldSource(resultSourceKey, source)
510
+ setItems(source)
511
+ setItemsTotal(Number(res?.total || res?.totalCount || source.length))
512
+ } else {
513
+ setTableData(source)
514
+ setTablePagination({ ...tablePagination, total: Number(res?.total || res?.totalCount || source.length), pageSize: Number(res?.size || res?.pageSize || (params?.pageSize || pageSize)), current: Number(res?.page || res?.currentPage || (params?.currentPage || currentPage)) })
515
+ }
516
+ })
517
+ .catch((err) => { setFetching(false) });
518
+ }
519
+
520
+ const SelectScroll = e => {
521
+ e.persist();
522
+ const { target } = e;
523
+ const totalPage = Math.ceil(itemsTotal / pageSize)
524
+ // 判断是否滑动到底部
525
+ const isTouchGround = target.scrollTop + target.offsetHeight === target.scrollHeight // >=scrollHeight
526
+ // 判断数据是否还没有加载到了最后一页
527
+ const canPageAdd = scrollPage < totalPage
528
+ if (isTouchGround && canPageAdd) {
529
+ const nextScrollPage = scrollPage + 1;
530
+ setScrollPage(nextScrollPage);
531
+ getData({ currentPage: nextScrollPage }); // 调用api方法
532
+ }
533
+
534
+ //判断是否滑动到顶部
535
+ const isTouchTop = target.scrollTop === 0 // <=0
536
+ // 判断数据是否到第一页
537
+ const canPageJian = scrollPage > 1
538
+ if (isTouchTop && canPageJian) {
539
+ const preScrollPage = scrollPage - 1;
540
+ setScrollPage(preScrollPage);
541
+ getData({ currentPage: preScrollPage }); // 调用api方法
542
+ }
543
+ }
544
+
545
+ useEffect(() => {
546
+ Promise.all([
547
+ loadSelectSource(`/items/brand/queryBrandList`, {
548
+ pageSize: 5000,
549
+ currentPage: 1,
550
+ 'ctl-withAuth': true
551
+ }),
552
+ loadSelectSource(`/items/category/queryCategoryTree`, {
553
+ pageSize: 5000,
554
+ currentPage: 1,
555
+ }),
556
+ ]).then((x: any)=>{
557
+ formatSource(x,0, 2, tableSearchForm,['id','name'])
558
+ formatTreeDataSource(x,1, 3, tableSearchForm)
559
+ })
560
+ }, [])
561
+
562
+ useEffect(() => {
563
+ if (value) {
564
+ setPopValue(value);
565
+ }
566
+ }, [value]);
567
+
568
+ useEffect(() => {
569
+ makeUniqueValue();
570
+ }, [sourceName])
571
+
572
+ const showModal = () => {
573
+ // getData({ pageSize: tableInitPageSize, currentPage: 1 }, 2)
574
+ setIsModalVisible(true);
575
+ // 回显
576
+ if (value) {
577
+ if (selectMode) {
578
+ setSelectedRowKeys(labelInValue ? value.map(i => i.key) : value)
579
+ setPopValue(labelInValue ? value.map(i => ({ value: i.key, text: i.label })) : value.map(i => ({ value: i })));
580
+ setIndeterminate(!!value.length && value.length < itemsTotal);
581
+ setCheckedAll(itemsTotal && value.length === itemsTotal);
582
+ // 需清空数据
583
+ if (!value.length) {
584
+ setDoubleArr([])
585
+ }
586
+ } else {
587
+ setSelectedRowKeys(labelInValue ? [value.key] : [value])
588
+ setPopValue(labelInValue ? [{ value: value.key, text: value.label }] : [{ value: value }]);
589
+ }
590
+ }
591
+
592
+ setTimeout(() => {
593
+ document.getElementById("first-query")?.focus()
594
+ }, 50)
595
+ };
596
+
597
+ const handleShowModal = () => {
598
+ if(beforeShowModal) {
599
+ beforeShowModal(popvalue).then(res => {
600
+ showModal()
601
+ }).catch(Error => {
602
+ message.warning(Error)
603
+ })
604
+ } else {
605
+ showModal()
606
+ }
607
+ }
608
+
609
+ const handleSelectOver = (selectedValue: any) => {
610
+ if (selectedValue?.length) {
611
+ formaData(selectedValue);
612
+ // 解决选择最后1页的sku,返回后,不显示名称问题
613
+ const source = _.uniqBy(items.concat(selectedValue), 'value')
614
+ ctx?.form?.setFieldSource(resultSourceKey, source)
615
+ setItems(source)
616
+ }
617
+ }
618
+
619
+ const handleLoading = (isContinue,flag) => {
620
+ isContinue ? setConfirmContinueLoading(flag) : setConfirmLoading(flag);
621
+ }
622
+
623
+ const handleOk = (isContinue) => {
624
+ if(!popvalue.length) {
625
+ message.warning('至少选中一条数据')
626
+ return;
627
+ }
628
+ // handleSelectOver(popvalue)
629
+ if(onSaveCallback) {
630
+ handleLoading(isContinue,true)
631
+ onSaveCallback(popvalue).then(res => {
632
+ if(true) {
633
+ message.success('保存成功')
634
+ deleteSelectRows();
635
+ document.getElementById('first-query')?.focus()
636
+ !isContinue && handleCancel();
637
+ } else {
638
+ }
639
+ handleLoading(isContinue,false)
640
+ }).catch(Error => {
641
+ message.error(Error);
642
+ handleLoading(isContinue,false)
643
+ })
644
+ } else {
645
+ !isContinue && handleCancel();
646
+ }
647
+ };
648
+
649
+ const formaData = (value) => {
650
+ if (labelInValue) {
651
+ const formatResult = value.map((i: any) => ({ key: i[mappingValueField], label: i[mappingTextField], value: i[mappingValueField] }))
652
+ onChange(selectMode ? formatResult : formatResult[0])
653
+ } else {
654
+ const formatResult = selectMode ? value.map((i: any) => i.value) : _.get(value[0], 'value')
655
+ onChange(formatResult)
656
+ }
657
+ };
658
+
659
+ const handleCancel = () => {
660
+ form.resetFields();
661
+ setTableFormParams({});
662
+ setIsModalVisible(false);
663
+ setTableData([])
664
+ // if (selectMode) {
665
+ // run();
666
+ // }
667
+ };
668
+
669
+ const onSearchChange = (e) => {
670
+ setSearchValue(e.target.value);
671
+ run();
672
+ }
673
+
674
+ const onSearchBlur = () => {
675
+ setSearchValue('')
676
+ run();
677
+ }
678
+
679
+ const onSearchTable = () => {
680
+ const params = form.getFieldsValue();
681
+ setTableFormParams(params);
682
+ getData({ ...params, pageSize: tableInitPageSize }, 2)
683
+ if (selectMode) {
684
+ getData(params)
685
+ }
686
+ }
687
+
688
+ const onResetTable = () => {
689
+ form.resetFields();
690
+ setTableFormParams({});
691
+ getData({ pageSize: tableInitPageSize, currentPage: 1 }, 2)
692
+ }
693
+
694
+ const handleTableChange = (pagination) => {
695
+ getData({ ...tableFormParams, pageSize: pagination.pageSize, currentPage: pagination.current }, 2)
696
+ }
697
+
698
+ // 扁平化二维数组的方法
699
+ const mapRows = params => {
700
+ var res = [];
701
+ for (var i = 0; i < params.length; i++) {
702
+ if (Array.isArray(params[i])) {
703
+ // 去重
704
+ res = _.uniqBy(res.concat(mapRows(params[i])), 'value');
705
+ } else {
706
+ res.push(params[i]);
707
+ // 去重
708
+ res = _.uniqBy(res, 'value')
709
+ }
710
+ }
711
+ return res.filter(Boolean); //去掉undefined的情况
712
+ };
713
+
714
+ const onChangeSelectedKeys = (selectKeys, selectRows) => {
715
+ if(selectKeys.length - selectedRowKeys.length > 0) {
716
+ if (selectKeys.length - selectedRowKeys.length === 1) {
717
+ selectRows[selectRows.length -1]['needFocus'] = true;
718
+ } else {
719
+ selectRows[selectedRowKeys.length]['needFocus'] = true;
720
+ }
721
+ }
722
+ setPopValue(selectRows);
723
+ setSelectedRowKeys(selectKeys)
724
+ // setIndeterminate(!!filterRows.length && filterRows.length < tablePagination?.total);
725
+ // setCheckedAll(filterRows.length === tablePagination?.total);
726
+ }
727
+
728
+ // 生成唯一值
729
+ const makeUniqueValue = () => {
730
+ const generateUnitKey = (((1 + Math.random()) * 0x10000) | 0).toString(16);
731
+ setUniqueValue(generateUnitKey);
732
+ return generateUnitKey;
733
+ }
734
+
735
+ const rowSelection = {
736
+ type: 'checkbox',
737
+ selectedRowKeys,
738
+ preserveSelectedRowKeys: true,
739
+ onChange: (sks, srs) => {
740
+ onChangeSelectedKeys(sks, srs)
741
+ },
742
+ getCheckboxProps: () => ({
743
+ disabled: selectProps?.disabled || props?.disabled,
744
+ }),
745
+ };
746
+
747
+ const onDoubleClickSelect = (e, record) => {
748
+ if (!selectMode) {
749
+ const srs = [JSON.parse(JSON.stringify(record))]
750
+ const sks = srs.map((i: any) => i.value)
751
+ onChangeSelectedKeys(sks, srs)
752
+ }
753
+ }
754
+
755
+ const themeColor = { color: '#005CFF' }
756
+
757
+ const formItem = (list) => {
758
+ if (isModalVisible && list?.length) {
759
+ return list.map((i: any, index) => {
760
+ if (i?.type === 'select' || i?.field?.type === 'select') {
761
+ return (
762
+ <Form.Item name={i.name} label={i.label} key={i.name}>
763
+ <Select style={{ width: '100%' }} placeholder='请选择' {...i?.field?.props}>
764
+ {i?.initialSource?.length && i?.initialSource.map((m: any) => (
765
+ <Option value={m.value} key={m.value}>{m.text}</Option>
766
+ ))}
767
+ </Select>
768
+ </Form.Item>
769
+ )
770
+ }
771
+
772
+ if (i?.type === 'treeSelect' || i?.field?.type === 'treeSelect') {
773
+ return (
774
+ <Form.Item name={i.name} label={i.label} key={i.name}>
775
+ <TreeSelect style={{ width: '100%' }} placeholder='请选择' {...i?.field?.props}></TreeSelect>
776
+ </Form.Item>
777
+ )
778
+ }
779
+
780
+ if (i?.type === 'BusinessSearchSelect' || i?.field?.type === 'BusinessSearchSelect') {
781
+ return (
782
+ <div>
783
+ <Form.Item name={i.name} label={i.label} key={i.name}>
784
+ <BusinessSearchSelect {...i.field.props} />
785
+ </Form.Item>
786
+ </div>
787
+ )
788
+ }
789
+
790
+ if (i?.type === 'multipleQueryInput' || i?.field?.type === 'multipleQueryInput') {
791
+ return (
792
+ <div>
793
+ <Form.Item name={i.name} label={i.label} key={i.name}>
794
+ <QueryMutipleInput onValueChange={(value) => {
795
+ form.setFieldsValue({
796
+ [i.name]: value
797
+ })
798
+ }} />
799
+ </Form.Item>
800
+ </div>
801
+ );
802
+ }
803
+
804
+ // 默认type是input
805
+ return (
806
+ <Form.Item name={i.name} label={i.label} key={i.name}>
807
+ <Input id={index === 0 ? "first-query" : 'index'} style={{ width: '100%' }} onKeyDown={(e) => {
808
+ if (e.keyCode === 13) {
809
+ onSearchTable()
810
+ }
811
+ }} placeholder='请输入' allowClear maxLength={100} {...i?.field?.props} />
812
+ </Form.Item>
813
+ )
814
+ })
815
+ } else {
816
+ return null
817
+ }
818
+ }
819
+
820
+ const maxTagPlaceholder = (selectedValues) => {
821
+ const onClose = (e: any, item: any) => {
822
+ e.preventDefault();
823
+ const newValue = labelInValue ? JSON.parse(JSON.stringify(value)).filter((i: any) => i.value !== item.value) : JSON.parse(JSON.stringify(value)).filter((i: any) => i !== item.value)
824
+ onChange(newValue);
825
+ }
826
+ return (
827
+ <Tooltip title={selectedValues.map((i: any) => (
828
+ <Tag
829
+ closable={true}
830
+ onClose={(e) => onClose(e, i)}
831
+ style={{ marginRight: 3, background: '#f5f5f5', height: '24px', border: '1px solid #f0f0f0' }}
832
+ >
833
+ {i.label}
834
+ </Tag>
835
+ ))}>
836
+ {`+ ${selectedValues?.length}`}
837
+ </Tooltip>
838
+ )
839
+ }
840
+
841
+ const deleteSelectRows = () => {
842
+ setPopValue([])
843
+ setSelectedRowKeys([])
844
+ }
845
+
846
+ const deleteRecord = (record) => {
847
+ setPopValue(popvalue.filter(item => item.skuCode !== record.skuCode))
848
+ setSelectedRowKeys([...selectedRowKeys.filter(item => item !== record.skuCode)])
849
+ }
850
+
851
+ let inputIndex = 0;
852
+
853
+ useEffect(() => {
854
+ setInitialShowColumn(codeSelected,selectColumns,(res) => {
855
+ setShowColumnsCallback(res)
856
+ })
857
+ },[selectColumns])
858
+ useEffect(() => {
859
+ setInitialShowColumn(codeToChoose,tableColumns,(res) => {
860
+ setShowToChooseColumnsCallback(res)
861
+ })
862
+ },[tableColumns])
863
+
864
+ const handleResize = (arr,index: any, callback) => (_: any, { size }: any) => {
865
+ let newColumns = arr.map((col: any) => ({ ...col }));
866
+ const handleIndex = (arr: any, indexArr: any) => {
867
+ let i = indexArr.shift();
868
+ if (indexArr.length > 0) {
869
+ handleIndex(arr[i].children, indexArr);
870
+ } else {
871
+ arr[i] = {
872
+ ...arr[i],
873
+ width: size.width,
874
+ };
875
+ handleAntdColumnsSpecialParams(arr[i]);
876
+ }
877
+ };
878
+ handleIndex(newColumns, [...index]);
879
+ callback(newColumns)
880
+ };
881
+
882
+ const setShowColumnsCallback = (newColumns: Array<any>) => {
883
+ setShowColumns([...newColumns])
884
+ }
885
+ const setShowToChooseColumnsCallback = (newColumns: Array<any>) => {
886
+ setShowToChooseColumns([...newColumns])
887
+ }
888
+
889
+ const handleColumns = (arr: any, indexArr: any[], callback: any) => {
890
+ arr.forEach((item: any, index: any) => {
891
+ let indexArrInside = [...indexArr, index].filter((i: any) => i || i === 0)
892
+ if (noEmptyArray(item.children)) {
893
+ handleColumns(item.children, indexArrInside);
894
+ } else {
895
+ item.width = item.width || getItemDefaultWidth(item);
896
+ item.onHeaderCell = (column: any) => ({
897
+ ...item,
898
+ width:
899
+ typeof column.width === 'number'
900
+ ? column.width
901
+ : parseInt(column.width.replace('px', '')),
902
+ onResize: handleResize(arr,indexArrInside, callback),
903
+ });
904
+ }
905
+ })
906
+ };
907
+ let showToChooseCol = showToChooseColumns.map((item: any) => {
908
+ handleAntdColumnsSpecialParams(item);
909
+ return ({ ...item })
910
+ })
911
+ handleColumns(showToChooseCol, [],(res)=> setShowToChooseColumnsCallback(res));
912
+ let showSelectedCol = showColumns.map((item: any) => {
913
+ handleAntdColumnsSpecialParams(item);
914
+ return ({ ...item })
915
+ })
916
+ handleColumns(showSelectedCol, [],(res)=> setShowColumnsCallback(res));
917
+
918
+ return (
919
+ <div className={'add_select'}>
920
+ <div className="add_select_show" id={`add_select_div_${uniqueValue}`}>
921
+ <Button onClick={handleShowModal} {...realButtonProps}>
922
+ {buttonText}
923
+ </Button>
924
+ </div>
925
+ {needModalTable && isModalVisible && (
926
+ <Modal
927
+ width='1200px'
928
+ style={{ top: 20 }}
929
+ bodyStyle={{ padding: '0px' }}
930
+ // title={modalTableProps?.modalTableTitle}
931
+ visible={isModalVisible}
932
+ closable={false}
933
+ onCancel={handleCancel}
934
+ footer={selectMode ? [
935
+ <Button key="back" onClick={handleCancel}>
936
+ 取消
937
+ </Button>,
938
+ <Button
939
+ key="save-and-continue"
940
+ style={{color: '#005CFF', borderColor: '#005CFF'}}
941
+ onClick={() => {handleOk(true)}}
942
+ loading={confirmContinueLoading}
943
+ disabled={!tableData.length || (selectProps?.disabled || props?.disabled)}
944
+ >
945
+ 保存并继续
946
+ </Button>,
947
+ <Button
948
+ key="submit"
949
+ type="primary"
950
+ onClick={() => {handleOk(false)}}
951
+ loading={confirmLoading}
952
+ disabled={!tableData.length || (selectProps?.disabled || props?.disabled)}
953
+ >
954
+ 确定
955
+ </Button>,
956
+ ] : null}
957
+ >
958
+ <div>
959
+ <div className='add_select_header'>
960
+ {modalTableProps?.modalTableTitle}
961
+ <span><span>*</span> &nbsp;快捷键:【Tab】-跳格切换;【Shift+←、→】-当前行左、右移动;【 ↑、↓】-当前列上、下移动;【ctrl+Enter】-保存并继续;【ctrl+Delete】-删除当前行;</span>
962
+ <span className='add_select_header_close'><CloseCircleOutlined style={{fontSize: '20px'}} onClick={handleCancel} /></span>
963
+ </div>
964
+ <div className={'add_select_wrapper'}>
965
+ <div className={caretLeftFlag ? 'add_select_wrapper_left' : 'add_select_wrapper_left1'}>
966
+ <div className={'select_list_columns'}>
967
+ <div className={'select_list_columns_formItems'}>
968
+ <Form form={form} layout='vertical' key='modalForm'>
969
+ {formItem(tableSearchForm)}
970
+ </Form>
971
+ </div>
972
+ </div>
973
+ <div className={'select_list_searchButton'}>
974
+ <Button key='reset' className={'select_list_button_space'} onClick={onResetTable}>重置</Button>
975
+ <Button key='search' type="primary" onClick={onSearchTable}>查询</Button>
976
+ </div>
977
+ </div>
978
+ <div className={caretLeftFlag ? 'add_select_wrapper_right' : 'add_select_wrapper_right1'}>
979
+ <div>
980
+ <div className={'select_list_selectTips'}>
981
+ <div style={{ marginLeft: 8 }}>搜索结果共&nbsp;<span style={themeColor}>{tablePagination?.total || 0}</span>&nbsp;项{selectMode ? <span>, 本次已选&nbsp;<span style={themeColor}>{selectedRowKeys?.length || 0}</span>&nbsp;项</span> : ''}</div>
982
+ <div>
983
+ <span style={{ marginRight: 8 }}>
984
+ <TableColumnSetting
985
+ setShowColumns={setShowToChooseColumnsCallback}
986
+ showColumns={showToChooseColumns}
987
+ datasource={tableColumns || []}
988
+ tableCode={codeToChoose}
989
+ settingImgAttribute={{ width: 20, style: { marginTop: -2 } }}
990
+ />
991
+ </span>
992
+ </div>
993
+ </div>
994
+ <Table
995
+ size='small'
996
+ rowSelection={rowSelection}
997
+ columns={showToChooseCol}
998
+ dataSource={tableData}
999
+ pagination={tablePagination}
1000
+ loading={fetching}
1001
+ onChange={handleTableChange}
1002
+ rowKey={mappingValueField}
1003
+ rowClassName={'row-class'}
1004
+ scroll={{ y: 500 }}
1005
+ components={{
1006
+ header: {
1007
+ cell: ResizeableTitle,
1008
+ },
1009
+ }}
1010
+ />
1011
+ </div>
1012
+ </div>
1013
+ {/* <div>
1014
+ <Table
1015
+ size='small'
1016
+ columns={modalTableProps?.tableColumns}
1017
+ dataSource={mapRows(doubleArr)}
1018
+ rowKey={mappingValueField}
1019
+ scroll={{ x: modalTableProps.overScrollX || 'max-content', y: modalTableProps.overScrollY || null }}
1020
+ onRow={record => {
1021
+ return {
1022
+ onDoubleClick: event => onDoubleClickSelect(event, record),
1023
+ };
1024
+ }}
1025
+ />
1026
+ </div> */}
1027
+ </div>
1028
+ <div className={'add_select_wrapper_select'}>
1029
+ <div className={'select_list_selectTips'}>
1030
+ <div style={{ marginLeft: 8 }}><span>本次已选&nbsp;<span style={themeColor}>{selectedRowKeys?.length || 0}</span>&nbsp;项</span></div>
1031
+ <div style={{ display: 'flex' }}>
1032
+ <span style={{ marginRight: 8 }}>
1033
+ <TableColumnSetting
1034
+ setShowColumns={setShowColumnsCallback}
1035
+ showColumns={showColumns}
1036
+ datasource={selectColumns || []}
1037
+ tableCode={codeSelected}
1038
+ settingImgAttribute={{ width: 20, style: { marginTop: -2 } }}
1039
+ />
1040
+ </span>
1041
+ <div style={{ marginRight: 8 }}><span onClick={deleteSelectRows} style={{ ...themeColor, cursor: 'pointer' }}>清空所选商品</span></div>
1042
+ </div>
1043
+ </div>
1044
+ <Table
1045
+ size='small'
1046
+ columns={showSelectedCol}
1047
+ dataSource={popvalue}
1048
+ pagination={false}
1049
+ // onChange={handleTableChange}
1050
+ rowKey={mappingValueField}
1051
+ rowClassName={'row-class'}
1052
+ scroll={{ y: 500 }}
1053
+ onRow={record => {
1054
+ return {
1055
+ onDoubleClick: event => onDoubleClickSelect(event, record),
1056
+ };
1057
+ }}
1058
+ components={{
1059
+ header: {
1060
+ cell: ResizeableTitle,
1061
+ },
1062
+ }}
1063
+ />
1064
+ </div>
1065
+ </div>
1066
+ </Modal>
1067
+ )}
1068
+ </div>
1069
+ );
1070
+ };
1071
+
1072
+ export default AddSelect;